瀏覽代碼

✨ 收货地址:code review

YunaiV 1 年之前
父節點
當前提交
5bcf44b7a9
共有 4 個文件被更改,包括 50 次插入22 次删除
  1. 12 16
      pages/user/address/list.vue
  2. 13 0
      sheep/api/member/address.js
  3. 13 0
      sheep/api/system/area.js
  4. 12 6
      sheep/components/s-address-item/s-address-item.vue

+ 12 - 16
pages/user/address/list.vue

@@ -1,9 +1,9 @@
+<!-- 收件地址列表 -->
 <template>
 	<s-layout title="收货地址" :bgStyle="{ color: '#FFF' }">
 		<view v-if="state.list.length">
 			<s-address-item hasBorderBottom v-for="item in state.list" :key="item.id" :item="item"
-				@tap="onSelect(item)">
-			</s-address-item>
+                      @tap="onSelect(item)" />
 		</view>
 
 		<su-fixed bottom placeholder>
@@ -26,20 +26,15 @@
 </template>
 
 <script setup>
-	import {
-		reactive,
-		onBeforeMount
-	} from 'vue';
-	import {
-		onShow
-	} from '@dcloudio/uni-app';
+	import { reactive, onBeforeMount } from 'vue';
+	import { onShow } from '@dcloudio/uni-app';
 	import sheep from '@/sheep';
-	import {
-		isEmpty
-	} from 'lodash';
+	import { isEmpty } from 'lodash';
+  import AreaApi from '@/sheep/api/system/area';
+  import AddressApi from '@/sheep/api/member/address';
 
 	const state = reactive({
-		list: [],
+		list: [], // 地址列表
 		loading: true,
 	});
 
@@ -52,6 +47,7 @@
 	};
 
 	// 导入微信地址
+  // TODO 芋艿:未测试
 	function importWechatAddress() {
 		let wechatAddress = {};
 		// #ifdef MP
@@ -102,7 +98,7 @@
 	}
 
 	onShow(async () => {
-		state.list = (await sheep.$api.user.address.list()).data;
+		state.list = (await AddressApi.getAddressList()).data;
 		state.loading = false;
 	});
 
@@ -111,8 +107,8 @@
 			return;
 		}
 		// 提前加载省市区数据
-		sheep.$api.data.area().then((res) => {
-			if (res.error === 0) {
+    AreaApi.getAreaTree().then((res) => {
+			if (res.code === 0) {
 				uni.setStorageSync('areaData', res.data);
 			}
 		});

+ 13 - 0
sheep/api/member/address.js

@@ -0,0 +1,13 @@
+import request2 from '@/sheep/request2';
+
+const AddressApi = {
+  // 获得用户收件地址列表
+  getAddressList: () => {
+    return request2({
+      url: '/app-api/member/address/list',
+      method: 'GET'
+    });
+  },
+};
+
+export default AddressApi;

+ 13 - 0
sheep/api/system/area.js

@@ -0,0 +1,13 @@
+import request2 from '@/sheep/request2';
+
+const AreaApi = {
+  // 获得地区树
+  getAreaTree: () => {
+    return request2({
+      url: '/app-api/system/area/tree',
+      method: 'GET'
+    });
+  },
+};
+
+export default AreaApi;

+ 12 - 6
sheep/components/s-address-item/s-address-item.vue

@@ -1,3 +1,4 @@
+<!-- 地址卡片 -->
 <template>
   <view
     class="address-item ss-flex ss-row-between ss-col-center"
@@ -11,18 +12,23 @@
           custom-style="background-color: var(--ui-BG-Main); border-color: var(--ui-BG-Main); color: #fff;"
           v-if="props.item.defaultStatus"
           text="默认"
-        ></uni-tag>
+        />
         {{ props.item.areaName }}
-		<!-- {{ props.item.city_name }} {{ props.item.district_name }} -->
       </view>
-      <view class="address-text">{{ props.item.detailAddress }}</view>
-      <view class="person-text">{{ props.item.name }} {{ props.item.mobile }}</view>
+      <view class="address-text">
+        {{ props.item.detailAddress }}
+      </view>
+      <view class="person-text">
+        {{ props.item.name }} {{ props.item.mobile }}
+      </view>
+    </view>
+    <view v-else>
+      <view class="address-text ss-m-b-10">请选择收货地址</view>
     </view>
-    <view v-else><view class="address-text ss-m-b-10">请选择收货地址</view></view>
     <slot>
       <button class="ss-reset-button edit-btn" @tap.stop="onEdit">
         <view class="edit-icon ss-flex ss-row-center ss-col-center">
-          <image :src="sheep.$url.static('/static/img/shop/user/address/edit.png')"></image>
+          <image :src="sheep.$url.static('/static/img/shop/user/address/edit.png')" />
         </view>
       </button>
     </slot>