|
|
@@ -0,0 +1,54 @@
|
|
|
+<!-- 账户管理-收货地址管理 -->
|
|
|
+<template>
|
|
|
+ <app-drawer title="收货地址" :width="600" v-model:show="showModal" :loading="loading">
|
|
|
+ <app-table :data="dataList" v-model:columns="tableColumns" :loading="loading" :highlight-current-row="false">
|
|
|
+ <template #radio="{ index }">
|
|
|
+ <el-radio :label="index" v-model="radio" @change="onChange">
|
|
|
+ <span></span>
|
|
|
+ </el-radio>
|
|
|
+ </template>
|
|
|
+ <!-- 收货地址 -->
|
|
|
+ <template #address="{ row }">
|
|
|
+ {{ [row.provincename, row.cityname, row.districtname, row.address].join(' ') }}
|
|
|
+ </template>
|
|
|
+ </app-table>
|
|
|
+ </app-drawer>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script lang="ts" setup>
|
|
|
+import { shallowRef, toRaw, computed } from 'vue'
|
|
|
+import { useRequest } from '@/hooks/request'
|
|
|
+import { queryUserReceiveInfo } from '@/services/api/user'
|
|
|
+import AppDrawer from '@pc/components/base/drawer/index.vue'
|
|
|
+import AppTable from '@pc/components/base/table/index.vue'
|
|
|
+
|
|
|
+const props = defineProps({
|
|
|
+ show: {
|
|
|
+ type: Boolean,
|
|
|
+ default: false
|
|
|
+ }
|
|
|
+})
|
|
|
+
|
|
|
+const emit = defineEmits(['change', 'update:show'])
|
|
|
+const radio = shallowRef()
|
|
|
+
|
|
|
+const showModal = computed({
|
|
|
+ get: () => props.show,
|
|
|
+ set: (val) => emit('update:show', val)
|
|
|
+})
|
|
|
+
|
|
|
+const { loading, dataList } = useRequest(queryUserReceiveInfo)
|
|
|
+
|
|
|
+const tableColumns = shallowRef<Model.TableColumn[]>([
|
|
|
+ { prop: 'radio', label: '选择', width: 80 },
|
|
|
+ { prop: 'receivername', label: '收货人' },
|
|
|
+ { prop: 'phonenum', label: '联系电话' },
|
|
|
+ { prop: 'address', label: '收货地址' },
|
|
|
+])
|
|
|
+
|
|
|
+const onChange = (index: number) => {
|
|
|
+ const record = dataList.value[index]
|
|
|
+ emit('change', toRaw(record))
|
|
|
+ showModal.value = false
|
|
|
+}
|
|
|
+</script>
|