修改 提货查询

src/views/platinum/platinum_pick_query/list/tab/index.vue

@@ -1,59 +1,73 @@
 <template>
   <!-- 提货查询 -->
   <div class="platinum_pick_query_tab">
+    <Filter @search="updateColumn">
+    </Filter>
+
     <Filter @search="updateColumn" />
-    <contextMenu :contextMenuList="btnList">
-      <a-table :columns="columns"
-               class="srcollYTable"
-               :scroll="{ x: '100%', y: 'calc(100vh - 163px)' }"
-               :pagination="false"
-               :expandedRowKeys="expandedRowKeys"
-               :customRow="Rowclick"
-               rowKey="key"
-               :data-source="tableList">
-        <!-- 额外的展开行 -->
-        <template #expandedRowRender="{ record }">
-          <BtnList :btnList="handleTableList(firstBtn, record)"
+    <a-table :columns="columns"
+             class="srcollYTable"
+             :scroll="{ x: '100%', y: 'calc(100vh - 163px)' }"
+             :pagination="false"
+             :loading="loading"
+             :expandedRowKeys="expandedRowKeys"
+             :customRow="Rowclick"
+             rowKey="key"
+             :data-source="tableList">
+      <!-- 额外的展开行 -->
+      <template #expandedRowRender="{ record }">
+        <!-- <BtnList :btnList="handleTableList(firstBtn, record)"
                    class="btn-list-sticky"
-                   @onClick="btnClick(record)" />
-        </template>
-        <!-- 提货状态 -->
-        <template #takeorderstatus="{ record }">
-          <a>{{ getPickUpStateName(record.takeorderstatus) }}</a>
-        </template>
-        <!-- 提货/ 收货人-->
-        <template #takemode="{ record }">
-          <a>{{ getTakeStateName(record.takemode)}}</a>
-        </template>
+                   @onClick="btnClick(record)" /> -->
+        <mtp-table-button class="btn-list-sticky"
+                          :buttons="buttons"
+                          :record="record"
+                          @click="openComponent" />
+      </template>
+      <!-- 提货状态 -->
+      <template #takeorderstatus="{ record }">
+        <a>{{ getPickUpStateName(record.takeorderstatus) }}</a>
+      </template>
+      <!-- 提货/ 收货人-->
+      <template #takemode="{ record }">
+        <a>{{ getTakeStateName(record.takemode)}}</a>
+      </template>
 
-        <!-- 物流信息 -->
-        <template #expresscompany="{ record }">
-          <a>{{ record.expresscompany + "-" + record.expressnum}}</a>
-        </template>
+      <!-- 物流信息 -->
+      <template #expresscompany="{ record }">
+        <a>{{ record.expresscompany + "-" + record.expressnum}}</a>
+      </template>
 
-        <!-- 商品数量 -->
-        <template #qty="{ record }">
-          <a>{{ record.qty + record.enumdicname}}</a>
-        </template>
+      <!-- 商品数量 -->
+      <template #qty="{ record }">
+        <a>{{ record.qty + record.enumdicname}}</a>
+      </template>
 
-        <!-- 地址 -->
-        <template #address="{ record }">
-          <a>{{ record.provincename + record.cityname + record.districtname + record.address}}</a>
-        </template>
+      <!-- 地址 -->
+      <template #address="{ record }">
+        <a>{{ record.provincename + record.cityname + record.districtname + record.address}}</a>
+      </template>
 
-        <template #userinfotype="{ record }">
-          <a>{{ record.userinfotype === 1 ? '个人' : '企业' }}</a>
-        </template>
-      </a-table>
-    </contextMenu>
+      <template #userinfotype="{ record }">
+        <a>{{ record.userinfotype === 1 ? '个人' : '企业' }}</a>
+      </template>
+    </a-table>
     <ControlModal :selectedRow="selectedRow"
                   @refresh="getData" />
-    <!-- <component :is="componentId"></component> -->
+    <!-- 右键 -->
+    <contextMenu :contextMenu="contextMenu"
+                 @cancel="closeContext"
+                 :list="buttons"> </contextMenu>
+    <component :is="componentId"
+               v-if="componentId"
+               :selectedRow="selectedRow"
+               @cancel="closeComponent"> </component>
   </div>
 </template>
 
 <script lang="ts">
-import { defineComponent, initData, getTableColumns, getTableEvent, contextMenu, BtnList, _getBtnList, queryTableList } from '@/common/export/table';
+import { ComposeTableParam, contextMenu, defineAsyncComponent, defineComponent, handleComposeTable, MtpTableButton, queryTableList, useRouteName } from '@/common/export/commonTable';
+
 import Filter from '../../compoments/filter/index.vue';
 import { handleTableList } from './setup';
 import ControlModal from './compoments/controlModal/index.vue';
@@ -63,59 +77,76 @@ import { TableEventCB } from '@/common/setup/table/interface';
 import { BtnListType } from '@/common/components/btnList/interface';
 import { ref } from 'vue';
 import { queryTradeGoodsPickup } from '@/services/go/ermcp/qhj';
+import { getTableButton } from '@/common/setup/table/button';
+import { EnumRouterName } from '@/common/constants/enumRouterName';
 
 export default defineComponent({
     name: 'platinum_pick_query_tab',
-    components: { Filter, contextMenu, BtnList, ControlModal },
+    components: {
+        Filter,
+        contextMenu,
+        MtpTableButton,
+        detail: defineAsyncComponent(() => import('./compoments/detail/index.vue')), // 详情
+        complete_stocking: defineAsyncComponent(() => import('./compoments/complete_stocking/index.vue')), // 完成备货
+        upload_logistics: defineAsyncComponent(() => import('./compoments/upload_logistics/index.vue')), // 上传物流
+        confirm_pickup: defineAsyncComponent(() => import('./compoments/confirm_pickup/index.vue')), // 确认收货
+        confirm_receipt: defineAsyncComponent(() => import('./compoments/query_receipt/index.vue')), // 确认收货
+    },
     setup() {
+        // 表格权限按钮
+        const buttons = getTableButton(['add'], true);
+
         // 表头数据
-        const { columns, registerColumn, updateColumn } = getTableColumns();
-        // 表格操作按钮列表
-        const [firstBtn] = _getBtnList('platinum_pick_query_tab', true).value;
-        const btnList = ref<BtnListType[]>([]);
-        const event: TableEventCB = {
-            contextmenuCB: (record: QhjTradeGoodsPickup) => {
-                btnList.value = handleTableList(firstBtn, record);
-            },
-        };
-        // 表格事件
-        const { expandedRowKeys, selectedRow, Rowclick, btnClick } = getTableEvent<QhjTradeGoodsPickup>(event);
+        // const { columns, registerColumn, updateColumn } = getTableColumns();
+        // // 表格操作按钮列表
+        // const [firstBtn] = _getBtnList('platinum_pick_query_tab', true).value;
+        // const btnList = ref<BtnListType[]>([]);
+        // const event: TableEventCB = {
+        //     contextmenuCB: (record: QhjTradeGoodsPickup) => {
+        //         btnList.value = handleTableList(firstBtn, record);
+        //     },
+        // };
+        // // 表格事件
+        // const { expandedRowKeys, selectedRow, Rowclick, btnClick } = getTableEvent<QhjTradeGoodsPickup>(event);
 
         // 表格列表数据
         const { loading, tableList, queryTable } = queryTableList<QhjTradeGoodsPickup>();
 
-        function getData() {
-            // 获取列表数据
-            queryTable(queryTradeGoodsPickup).then((res) => {
-                tableList.value = res.map((el) => {
-                    return { ...el, key: String(el.takeorderid) };
-                });
-            });
-        }
+        const queryTableAction = () => {
+            queryTable(queryTradeGoodsPickup);
+        };
+        // 表格通用逻辑
+        const param: ComposeTableParam = {
+            queryFn: queryTableAction,
+            menuType: EnumRouterName.plan_audit,
+            tableName: 'table_pcweb_qhj_pickup_query',
+            tableFilterKey: ['reqtime', 'pickupgoodsname', 'takeorderstatus', 'goodsname'],
+            isDetail: true,
+        };
+
+        // function getData() {
+        //     // 获取列表数据
+        //     queryTable(queryTradeGoodsPickup).then((res) => {
+        //         tableList.value = res.map((el) => {
+        //             return { ...el, key: String(el.takeorderid) };
+        //         });
+        //     });
+        // }
 
         // 1:备货中  完成备货
         // 2:待取货(自提) 确认取货
         // 4:待收货(邮寄) 上传物流信息、确认收货
-        initData(() => {
-            // 获取列表数据
-            getData();
-            // 注册表头信息 过滤
-            registerColumn('table_pcweb_qhj_pickup_query', ['reqtime', 'pickupgoodsname', 'takeorderstatus', 'goodsname']);
-        });
+        // initData(() => {
+        //     // 获取列表数据
+        //     getData();
+        //     // 注册表头信息 过滤
+        //     registerColumn('table_pcweb_qhj_pickup_query', ['reqtime', 'pickupgoodsname', 'takeorderstatus', 'goodsname']);
+        // });
 
         return {
-            btnList,
-            columns,
-            getData,
-            updateColumn,
-            expandedRowKeys,
-            selectedRow,
-            Rowclick,
-            firstBtn,
+            ...handleComposeTable<QhjTradeGoodsPickup>(param),
             loading,
             tableList,
-            queryTable,
-            btnClick,
             getPickUpStateName,
             getTakeStateName,
             handleTableList,