小程序修改

apps/mini-user/src/pages/addresses/index.tsx

@@ -1,72 +1,126 @@
-import { useEffect, useState } from 'react';
+import { useCallback, useState } from 'react';
 import { View, Text } from '@tarojs/components';
-import Taro from '@tarojs/taro';
+import Taro, { useDidShow, useRouter } from '@tarojs/taro';
 import PageShell from '../../components/PageShell';
 import SubPageHeader from '../../components/SubPageHeader';
+import {
+  buildAddressEditUrl,
+  buildOrderConfirmUrl,
+  readCheckoutContext,
+} from '../../lib/checkout-nav';
 import { request, toast } from '../../lib/api';
 
 type Address = {
   id: string;
   receiverName: string;
   phone: string;
-  province?: string;
-  city?: string;
-  district?: string;
+  province: string;
+  city: string;
+  district: string;
   detail: string;
-  isDefault?: boolean;
+  isDefault?: number | boolean;
 };
 
+function formatAddress(a: Address) {
+  return `${a.province}${a.city}${a.district}${a.detail}`;
+}
+
 export default function AddressesPage() {
+  const router = useRouter();
+  const checkoutCtx = readCheckoutContext(router.params);
+  const selectMode = checkoutCtx.select === true;
   const [list, setList] = useState<Address[]>([]);
   const [loading, setLoading] = useState(true);
 
-  useEffect(() => {
+  const loadList = useCallback(() => {
+    setLoading(true);
     request<Address[]>('/user/addresses')
       .then((data) => setList(Array.isArray(data) ? data : []))
       .catch(() => setList([]))
       .finally(() => setLoading(false));
   }, []);
 
+  useDidShow(() => {
+    loadList();
+  });
+
+  function selectAddress(addr: Address) {
+    if (!selectMode) return;
+    Taro.redirectTo({
+      url: buildOrderConfirmUrl({
+        productId: checkoutCtx.productId,
+        qty: checkoutCtx.qty,
+        addressId: addr.id,
+        cross: checkoutCtx.cross,
+      }),
+    });
+  }
+
+  async function removeAddress(id: string) {
+    const res = await Taro.showModal({
+      title: '删除地址',
+      content: '确定删除该收货地址吗？',
+    });
+    if (!res.confirm) return;
+    try {
+      await request(`/user/addresses/${id}`, { method: 'DELETE' });
+      toast('已删除', 'success');
+      loadList();
+    } catch (e) {
+      toast(e instanceof Error ? e.message : '删除失败');
+    }
+  }
+
   return (
     <PageShell variant="sub" className="address-page" hasFixedFooter>
-      <SubPageHeader title="地址管理" />
+      <SubPageHeader title={selectMode ? '选择收货地址' : '地址管理'} />
       <View className="sub-page-body" style={{ paddingBottom: 80 }}>
         {loading ? <View className="u-empty">加载中…</View> : null}
         {!loading && list.length === 0 ? (
           <View className="u-empty">暂无收货地址</View>
         ) : null}
         {list.map((a) => (
-          <View key={a.id} className="address-item">
+          <View
+            key={a.id}
+            className="address-item"
+            onClick={() => selectAddress(a)}
+          >
             <View className="address-item-head">
               <Text className="address-item-name">{a.receiverName}</Text>
               <Text className="address-item-phone">{a.phone}</Text>
-              {a.isDefault ? <Text className="address-default-tag">默认</Text> : null}
-            </View>
-            <Text className="address-item-detail">
-              {[a.province, a.city, a.district, a.detail].filter(Boolean).join(' ')}
-            </Text>
-            <View className="address-item-actions">
-              <Text
-                className="address-action"
-                onClick={() =>
-                  Taro.navigateTo({ url: `/pages/address-edit/index?id=${a.id}` })
-                }
-              >
-                编辑
-              </Text>
-              <Text
-                className="address-action"
-                onClick={() => toast('删除功能后续接入')}
-              >
-                删除
-              </Text>
+              {a.isDefault === 1 || a.isDefault === true ? (
+                <Text className="address-default-tag">默认</Text>
+              ) : null}
             </View>
+            <Text className="address-item-detail">{formatAddress(a)}</Text>
+            {!selectMode ? (
+              <View className="address-item-actions">
+                <Text
+                  className="address-action"
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    Taro.navigateTo({ url: buildAddressEditUrl(a.id, checkoutCtx) });
+                  }}
+                >
+                  编辑
+                </Text>
+                <Text
+                  className="address-action"
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    void removeAddress(a.id);
+                  }}
+                >
+                  删除
+                </Text>
+              </View>
+            ) : null}
           </View>
         ))}
       </View>
       <View
         className="address-fab"
-        onClick={() => Taro.navigateTo({ url: '/pages/address-edit/index' })}
+        onClick={() => Taro.navigateTo({ url: buildAddressEditUrl(undefined, checkoutCtx) })}
       >
         <Text>新增地址</Text>
       </View>