订单列表：列表重构 添加门店、物流检索条件

puhui999 · puhui999 · commit 5dceda614ab3 · 2023-08-22T18:47:31.000+08:00
diff --git a/src/api/mall/trade/delivery/express/index.ts b/src/api/mall/trade/delivery/express/index.ts
@@ -19,7 +19,7 @@ export const getDeliveryExpress = async (id: number) => {
   return await request.get({ url: '/trade/delivery/express/get?id=' + id })
 }
 
-// 获得商品品牌精简信息列表
+// 获得快递公司精简信息列表
 export const getSimpleDeliveryExpressList = () => {
   return request.get({ url: '/trade/delivery/express/list-all-simple' })
 }
diff --git a/src/api/mall/trade/delivery/pickUpStore/index.ts b/src/api/mall/trade/delivery/pickUpStore/index.ts
@@ -16,7 +16,7 @@ export interface DeliveryPickUpStoreVO {
 }
 
 // 查询自提门店列表
-export const getDeliveryPickUpStorePage = async (params: DeliveryPickUpStorePageReqVO) => {
+export const getDeliveryPickUpStorePage = async (params) => {
   return await request.get({ url: '/trade/delivery/pick-up-store/page', params })
 }
 
@@ -25,6 +25,11 @@ export const getDeliveryPickUpStore = async (id: number) => {
   return await request.get({ url: '/trade/delivery/pick-up-store/get?id=' + id })
 }
 
+// 查询自提门店精简列表
+export const getListAllSimple = async () => {
+  return await request.get({ url: '/trade/delivery/pick-up-store/list-all-simple' })
+}
+
 // 新增自提门店
 export const createDeliveryPickUpStore = async (data: DeliveryPickUpStoreVO) => {
   return await request.post({ url: '/trade/delivery/pick-up-store/create', data })
@@ -39,8 +44,3 @@ export const updateDeliveryPickUpStore = async (data: DeliveryPickUpStoreVO) =>
 export const deleteDeliveryPickUpStore = async (id: number) => {
   return await request.delete({ url: '/trade/delivery/pick-up-store/delete?id=' + id })
 }
-
-// 导出自提门店 Excel
-export const exportDeliveryPickUpStoreApi = async (params) => {
-  return await request.download({ url: '/trade/delivery/pick-up-store/export-excel', params })
-}
diff --git a/src/views/mall/trade/delivery/pickUpStore/index.vue b/src/views/mall/trade/delivery/pickUpStore/index.vue
@@ -1,27 +1,27 @@
 <template>
   <!-- 搜索工作栏 -->
   <ContentWrap>
-    <el-form class="-mb-15px" :model="queryParams" ref="queryFormRef" :inline="true">
+    <el-form ref="queryFormRef" :inline="true" :model="queryParams" class="-mb-15px">
       <el-form-item label="门店手机" prop="phone">
         <el-input
           v-model="queryParams.phone"
-          placeholder="请输门店手机"
+          class="!w-240px"
           clearable
+          placeholder="请输门店手机"
           @keyup.enter="handleQuery"
-          class="!w-240px"
         />
       </el-form-item>
       <el-form-item label="门店名称" prop="name">
         <el-input
           v-model="queryParams.name"
-          placeholder="请输门店名称"
+          class="!w-240px"
           clearable
+          placeholder="请输门店名称"
           @keyup.enter="handleQuery"
-          class="!w-240px"
         />
       </el-form-item>
       <el-form-item label="门店状态" prop="status">
-        <el-select v-model="queryParams.status" placeholder="门店状态" clearable class="!w-240px">
+        <el-select v-model="queryParams.status" class="!w-240px" clearable placeholder="门店状态">
           <el-option
             v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)"
             :key="dict.value"
@@ -33,32 +33,30 @@
       <el-form-item label="创建时间" prop="createTime">
         <el-date-picker
           v-model="queryParams.createTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="datetimerange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
           class="!w-240px"
+          end-placeholder="结束日期"
+          start-placeholder="开始日期"
+          type="datetimerange"
+          value-format="YYYY-MM-DD HH:mm:ss"
         />
       </el-form-item>
       <el-form-item>
-        <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-        <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-        <el-button
-          type="primary"
-          plain
-          @click="openForm('create')"
-          v-hasPermi="['trade:delivery:pick-up-store:create']"
-        >
-          <Icon icon="ep:plus" class="mr-5px" /> 新增
+        <el-button @click="handleQuery">
+          <Icon class="mr-5px" icon="ep:search" />
+          搜索
+        </el-button>
+        <el-button @click="resetQuery">
+          <Icon class="mr-5px" icon="ep:refresh" />
+          重置
         </el-button>
         <el-button
-          type="success"
+          v-hasPermi="['trade:delivery:pick-up-store:create']"
           plain
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['trade:delivery:pick-up-store:export']"
+          type="primary"
+          @click="openForm('create')"
         >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
+          <Icon class="mr-5px" icon="ep:plus" />
+          新增
         </el-button>
       </el-form-item>
     </el-form>
@@ -75,34 +73,34 @@
       </el-table-column>
       <el-table-column label="门店名称" prop="name" />
       <el-table-column label="门店手机" prop="phone" />
-      <el-table-column label="门店详细地址" align="center" prop="detailAddress" />
-      <el-table-column label="开启状态" align="center" prop="status">
+      <el-table-column align="center" label="门店详细地址" prop="detailAddress" />
+      <el-table-column align="center" label="开启状态" prop="status">
         <template #default="scope">
           <dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status" />
         </template>
       </el-table-column>
       <el-table-column
-        label="创建时间"
+        :formatter="dateFormatter"
         align="center"
+        label="创建时间"
         prop="createTime"
         width="180"
-        :formatter="dateFormatter"
       />
-      <el-table-column label="操作" align="center">
+      <el-table-column align="center" label="操作">
         <template #default="scope">
           <el-button
+            v-hasPermi="['trade:delivery:pick-up-store:update']"
             link
             type="primary"
             @click="openForm('update', scope.row.id)"
-            v-hasPermi="['trade:delivery:pick-up-store:update']"
           >
             编辑
           </el-button>
           <el-button
+            v-hasPermi="['trade:delivery:pick-up-store:delete']"
             link
             type="danger"
             @click="handleDelete(scope.row.id)"
-            v-hasPermi="['trade:delivery:pick-up-store:delete']"
           >
             删除
           </el-button>
@@ -113,18 +111,17 @@
   <!-- 表单弹窗：添加/修改 -->
   <DeliveryPickUpStoreForm ref="formRef" @success="getList" />
 </template>
-<script setup lang="ts" name="DeliveryPickUpStore">
+<script lang="ts" name="DeliveryPickUpStore" setup>
 import * as DeliveryPickUpStoreApi from '@/api/mall/trade/delivery/pickUpStore'
 import DeliveryPickUpStoreForm from './PickUpStoreForm.vue'
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { dateFormatter } from '@/utils/formatTime'
-import download from '@/utils/download'
+
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 
 const total = ref(0) // 列表的总页数
 const loading = ref(true) // 列表的加载中
-const exportLoading = ref(false) // 导出的加载中
 const list = ref<any[]>([]) // 列表的数据
 const queryParams = reactive({
   pageNo: 1,
@@ -179,21 +176,6 @@ const resetQuery = () => {
   handleQuery()
 }
 
-/** 导出按钮操作 */
-const handleExport = async () => {
-  try {
-    // 导出的二次确认
-    await message.exportConfirm()
-    // 发起导出
-    exportLoading.value = true
-    const data = await DeliveryPickUpStoreApi.exportDeliveryPickUpStoreApi(queryParams)
-    download.excel(data, '自提门店.xls')
-  } catch {
-  } finally {
-    exportLoading.value = false
-  }
-}
-
 /** 初始化 **/
 onMounted(() => {
   getList()
diff --git a/src/views/mall/trade/order/index.vue b/src/views/mall/trade/order/index.vue
@@ -64,8 +64,34 @@
           />
         </el-select>
       </el-form-item>
-
-      <el-form-item label="订单搜索">
+      <el-form-item label="快递公司" prop="type">
+        <el-select v-model="queryParams.logisticsId" class="!w-280px" clearable placeholder="全部">
+          <el-option
+            v-for="item in deliveryExpressList"
+            :key="item.id as string"
+            :label="item.name"
+            :value="item.id"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="自提门店" prop="type">
+        <el-select
+          v-model="queryParams.pickUpStoreId"
+          class="!w-280px"
+          clearable
+          multiple
+          placeholder="全部"
+        >
+          <el-option
+            v-for="item in pickUpStoreList"
+            :key="item.id as string"
+            :label="item.name"
+            :value="item.id"
+          />
+        </el-select>
+      </el-form-item>
+      <!-- TODO 考虑是否移除或重构-->
+      <el-form-item label="聚合搜索">
         <el-input
           v-show="true"
           v-model="queryType.v"
@@ -86,7 +112,6 @@
         </el-input>
       </el-form-item>
       <el-form-item>
-        <!-- TODO 订单按钮相关权限等订单完善后补齐 -->
         <el-button @click="handleQuery">
           <Icon class="mr-5px" icon="ep:search" />
           搜索
@@ -153,13 +178,31 @@
             </el-table-column>
             <el-table-column label="买家/收货人" min-width="160">
               <template #default>
-                <div class="flex flex-col">
+                <!-- 快递发货  -->
+                <div v-if="scope.row.deliveryType === 1" class="flex flex-col">
                   <span>买家：{{ scope.row.user.nickname }}</span>
                   <span>
                     收货人：{{ scope.row.receiverName }} {{ scope.row.receiverMobile }}
                     {{ scope.row.receiverAreaName }} {{ scope.row.receiverDetailAddress }}
                   </span>
                 </div>
+                <!-- 自提  -->
+                <div v-if="scope.row.deliveryType === 2" class="flex flex-col">
+                  <span>
+                    门店名称：
+                    {{ pickUpStoreList.find((p) => p.id === scope.row.pickUpStoreId)?.name }}
+                  </span>
+                  <span>
+                    门店手机：
+                    {{ pickUpStoreList.find((p) => p.id === scope.row.pickUpStoreId)?.phone }}
+                  </span>
+                  <span>
+                    自提门店:
+                    {{
+                      pickUpStoreList.find((p) => p.id === scope.row.pickUpStoreId)?.detailAddress
+                    }}
+                  </span>
+                </div>
               </template>
             </el-table-column>
             <el-table-column align="center" label="配送方式" width="120">
@@ -169,6 +212,7 @@
             </el-table-column>
             <el-table-column align="center" fixed="right" label="操作" width="160">
               <template #default>
+                <!-- TODO 权限后续补齐 -->
                 <div class="flex justify-center items-center">
                   <el-button link type="primary" @click="openForm(scope.row.id)">
                     <Icon icon="ep:notification" />
@@ -263,9 +307,11 @@ import OrderRemarksForm from './components/OrderRemarksForm.vue'
 import { dateFormatter } from '@/utils/formatTime'
 import * as TradeOrderApi from '@/api/mall/trade/order'
 import { OrderItemRespVO, OrderVO } from '@/api/mall/trade/order'
+import { getListAllSimple } from '@/api/mall/trade/delivery/pickUpStore'
 import { DICT_TYPE, getStrDictOptions } from '@/utils/dict'
 import { formatToFraction } from '@/utils'
 import { createImageViewer } from '@/components/ImageViewer'
+import * as DeliveryExpressApi from '@/api/mall/trade/delivery/express'
 
 const { currentRoute, push } = useRouter() // 路由跳转
 
@@ -320,7 +366,7 @@ const handleCommand = (command: string, row: OrderVO) => {
   }
 }
 const queryFormRef = ref<FormInstance>() // 搜索的表单
-//表单搜索 TODO 订单相关操作完成后立马实现
+//表单搜索
 const queryParams = reactive({
   pageNo: 1, //首页
   pageSize: 10, //页面大小
@@ -337,6 +383,8 @@ const queryParams = reactive({
   createTime: [],
   spuName: '',
   itemCount: '',
+  pickUpStoreId: [],
+  logisticsId: null,
   all: ''
 })
 
@@ -383,8 +431,12 @@ watch(
   }
 )
 
+const pickUpStoreList = ref([]) // 自提门店精简列表
+const deliveryExpressList = ref([]) // 物流公司
 /** 初始化 **/
 onMounted(async () => {
   await getList()
+  pickUpStoreList.value = await getListAllSimple()
+  deliveryExpressList.value = await DeliveryExpressApi.getSimpleDeliveryExpressList()
 })
 </script>

Original file line number	Diff line number	Diff line change
`@@ -19,7 +19,7 @@ export const getDeliveryExpress = async (id: number) => {`
`19`	`19`	`return await request.get({ url: '/trade/delivery/express/get?id=' + id })`
`20`	`20`	`}`
`21`	`21`
`22`		`-// 获得商品品牌精简信息列表`
	`22`	`+// 获得快递公司精简信息列表`
`23`	`23`	`export const getSimpleDeliveryExpressList = () => {`
`24`	`24`	`return request.get({ url: '/trade/delivery/express/list-all-simple' })`
`25`	`25`	`}`