上传

src/views/Clue/Order/Comp/Delivery.vue

@@ -30,9 +30,10 @@
       </el-form-item>
       <el-form-item>
         <el-select
-          v-model="searchForm.signProduct"
+          v-model="searchForm.productId"
           placeholder="选择成交产品"
           filterable
+          clearable
           @change="searchForm.specsId = undefined"
         >
           <el-option
@@ -48,10 +49,11 @@
           v-model="searchForm.specsId"
           placeholder="选择规格"
           filterable
-          :disabled="!searchForm.signProduct"
+          clearable
+          :disabled="!searchForm.productId"
         >
           <el-option
-            v-for="item in specsOptions(searchForm.signProduct)"
+            v-for="item in specsOptions(searchForm.productId)"
             :key="item.specsId"
             :label="item.specsName"
             :value="item.specsId"
@@ -69,17 +71,34 @@
       <el-table-column prop="name" label="线索名称" min-width="200px" />
       <el-table-column prop="phone" label="联系方式" min-width="150px" />
       <el-table-column prop="signUserName" label="登记人" min-width="90" />
-      <el-table-column prop="dealDate" label="登记时间" min-width="150px" />
-      <el-table-column prop="" label="成交产品" min-width="150px" />
-      <el-table-column prop="" label="产品规格" min-width="150px" />
-      <el-table-column prop="" label="发货时间" min-width="150px" />
-      <el-table-column prop="" label="发货仓库" min-width="100px" />
-      <el-table-column prop="" label="备注" min-width="100px" />
-      <el-table-column label="操作" width="150px" fixed="right">
-        <template #default="{ row }">
-          <el-button type="primary" style="padding: 0" text @click="handleDetail(row.id)">
-            详情
-          </el-button>
+      <el-table-column
+        prop="dealDate"
+        label="登记时间"
+        min-width="150px"
+        :formatter="dateFormatter"
+      />
+      <el-table-column prop="productName" label="成交产品" min-width="150px" />
+      <el-table-column prop="specsName" label="产品规格" min-width="150px" />
+      <el-table-column
+        prop="createTime"
+        label="发货时间"
+        min-width="150px"
+        :formatter="dateFormatter"
+      />
+      <el-table-column prop="warehouseName" label="发货仓库" min-width="100px" />
+      <el-table-column label="发货备注">
+        <template #default="scope">
+          <el-popover
+            placement="top"
+            width="500px"
+            trigger="click"
+            v-if="scope.row.warehouseName && scope.row.remark"
+          >
+            <template #reference>
+              <el-button type="primary" style="padding: 0" text>点击查看</el-button>
+            </template>
+            <div v-dompurify-html="scope.row.remark"></div>
+          </el-popover>
         </template>
       </el-table-column>
     </el-table>
@@ -95,6 +114,9 @@
 <script setup name="Delivery">
 import { getSimpleUserList as getUserOption } from '@/api/system/user'
 import { getSimpleProductList } from '@/api/mall/product'
+import * as DeliveryApi from '@/api/clue/delivery'
+
+import { dateFormatter } from '@/utils/formatTime'
 // const message = useMessage() // 消息弹窗
 
 const searchForm = ref({
@@ -102,6 +124,8 @@ const searchForm = ref({
   name: undefined,
   dealDate: [],
   signUser: undefined,
+  productId: undefined,
+  specsId: undefined,
   pageNo: 1,
   pageSize: 20
 })
@@ -122,6 +146,8 @@ function handleReset() {
     name: undefined,
     dealDate: [],
     signUser: undefined,
+    productId: undefined,
+    specsId: undefined,
     pageNo: 1,
     pageSize: 20
   }
@@ -131,19 +157,14 @@ const loading = ref(false)
 async function getList() {
   loading.value = true
   try {
-    tableList.value = []
-    // const data = await FeebackApi.getPaymentPage(searchForm.value)
-    // tableList.value = data.list
-    // total.value = data.total
+    const data = await DeliveryApi.getDeliveryPage(searchForm.value)
+    tableList.value = data.list
+    total.value = data.total
   } finally {
     loading.value = false
   }
 }
 
-function handleDetail(id) {
-  console.log(id)
-}
-
 const prodOptions = ref([])
 
 const specsOptions = computed({