用户端调整

2.首页商品详情增加点击区域
3.浓香型 酱香型 点击增加提示：暂未开放
5.首页餐券2字更换为“好客权益”
6.门店页面地址筛选功能 （三级菜单，省市区）
7.好客权益：去使用点击交互调整为核销页面，单张好客权益点击核销页面带参数和金额
7.核销金额限制为可用余额最大数，不是500
9.收货地址电话号码增加校验，长度限制，地址或者未填提示，地区调整为省市区三级菜单
10.微信授权位置调整在手机验证码下侧

apps/h5-user/src/pages/HomePage.tsx

@@ -3,6 +3,7 @@ import { Link } from 'react-router-dom';
 import { request } from '../lib/api';
 import ProductCarousel from '../components/ProductCarousel';
 import TabMainHeader from '../components/TabMainHeader';
+import AppToast from '../components/AppToast';
 import { getProductImages } from '../lib/product-images';
 import CouponBadge from '@dukang/shared-ui/CouponBadge';
 
@@ -19,19 +20,33 @@ type Product = {
 };
 
 const AROMA_TABS = [
-  { key: 'QINGXIANG', label: '清香型', disabled: false },
-  { key: 'JIANGXIANG', label: '酱香型', disabled: true },
-  { key: 'NONGXIANG', label: '浓香型', disabled: true },
+  { key: 'QINGXIANG', label: '清香型', open: true },
+  { key: 'JIANGXIANG', label: '酱香型', open: false },
+  { key: 'NONGXIANG', label: '浓香型', open: false },
 ];
 
 export default function HomePage() {
   const [tab, setTab] = useState('QINGXIANG');
   const [products, setProducts] = useState<Product[]>([]);
+  const [toast, setToast] = useState('');
 
   useEffect(() => {
     request<Product[]>('USER_H5', '/catalog/products').then(setProducts);
   }, []);
 
+  function showToast(message: string) {
+    setToast(message);
+    window.setTimeout(() => setToast(''), 2200);
+  }
+
+  function onAromaTabClick(key: string, open: boolean) {
+    if (!open) {
+      showToast('暂未开放');
+      return;
+    }
+    setTab(key);
+  }
+
   const filtered = products.filter((p) => p.aromaType === tab);
   const onSale = tab === 'QINGXIANG';
 
@@ -52,9 +67,8 @@ export default function HomePage() {
           <button
             key={t.key}
             type="button"
-            disabled={t.disabled}
-            className={`home-aroma-tab${tab === t.key ? ' active' : ''}${t.disabled ? ' disabled' : ''}`}
-            onClick={() => !t.disabled && setTab(t.key)}
+            className={`home-aroma-tab${tab === t.key ? ' active' : ''}${!t.open ? ' muted' : ''}`}
+            onClick={() => onAromaTabClick(t.key, t.open)}
           >
             {t.label}
           </button>
@@ -66,23 +80,29 @@ export default function HomePage() {
         {onSale &&
           filtered.map((p, index) => (
             <article key={p.id} className="home-product-card">
-              <ProductCarousel images={getProductImages(index)} alt={p.name} />
-              <div className="home-product-body">
-                <div className="home-product-row">
-                  <h3 className="home-product-name">{p.name}</h3>
-                  <span className="home-product-price">¥{p.price}</span>
-                </div>
-                <p className="home-product-sub">{p.subtitle}</p>
-                <div className="home-product-footer">
-                  <CouponBadge amount={p.benefitDisplay} />
-                  <Link to={`/product/${p.id}`} className="home-buy-btn">
-                    立即购买
-                  </Link>
+              <Link to={`/product/${p.id}`} className="home-product-link">
+                <ProductCarousel images={getProductImages(index)} alt={p.name} />
+                <div className="home-product-body">
+                  <div className="home-product-row">
+                    <h3 className="home-product-name">{p.name}</h3>
+                    <span className="home-product-price">¥{p.price}</span>
+                  </div>
+                  <p className="home-product-sub">{p.subtitle}</p>
+                  <div className="home-product-footer">
+                    <CouponBadge amount={p.benefitDisplay} label="好客权益" />
+                  </div>
                 </div>
+              </Link>
+              <div className="home-product-actions">
+                <Link to={`/product/${p.id}`} className="home-buy-btn">
+                  立即购买
+                </Link>
               </div>
             </article>
           ))}
       </section>
+
+      <AppToast message={toast} />
     </div>
   );
 }