fix: 列表修改

src/views/order/factoryOrderNew/index.vue

@@ -72,20 +72,13 @@
             </ElFormItem>
 
             <ElFormItem label="工艺">
-              <ElSelect
-                v-model="craftCode"
-                placeholder="请选择"
-                clearable
-                filterable
-                style="width: 140px"
-              >
-                <ElOption
-                  v-for="item in craftList"
-                  :key="item.id"
-                  :label="item.name"
-                  :value="item.id"
-                />
-              </ElSelect>
+              <LogisticsWaySelect
+                v-model="searchForm.craftCode"
+                :company-list="craftList"
+                :start-width="'150px'"
+                search-placeholder="搜索工艺名称"
+                start-placeholder="请选择工艺名称"
+              ></LogisticsWaySelect>
             </ElFormItem>
 
             <ElFormItem label="库存SKU">
@@ -133,7 +126,6 @@
               />
             </ElFormItem>
 
-
             <ElFormItem label="数量">
               <el-radio-group v-model="searchForm.multi">
                 <el-radio-button :value="false">单件</el-radio-button>
@@ -439,17 +431,32 @@
 
       <div class="operation-list">
         <span class="item">
-          <ElButton
-            type="primary"
-            :disabled="!selectedRowIds.length"
-            @click="handleConfirmOrder"
-          >
+          <ElButton type="success" @click="handleConfirmOrder">
             确认接单
           </ElButton>
         </span>
       </div>
+
+      <div v-if="status === 'PENDING_ACCEPT'" class="pending-accept-subtabs">
+        <div
+          class="pending-accept-subtab"
+          :class="{ active: pendingAcceptSubTab === 'PENDING_ACCEPT' }"
+          @click="pendingAcceptSubTab = 'PENDING_ACCEPT'"
+        >
+          待接单<span> (0) </span>
+        </div>
+        <div
+          class="pending-accept-subtab"
+          :class="{
+            active: pendingAcceptSubTab === 'ACCEPT_FAIL_OUT_OF_STOCK',
+          }"
+          @click="pendingAcceptSubTab = 'ACCEPT_FAIL_OUT_OF_STOCK'"
+        >
+          接单失败-缺货<span> (0) </span>
+        </div>
+      </div>
       <div class="table-content">
-        <splitDiv size="55">
+        <splitDiv v-loading="loading" size="55">
           <template #top>
             <div class="table-list flex-1 overflow-hidden">
               <TableView
@@ -539,6 +546,7 @@ import {
 } from '@/api/podCnOrder'
 import { getUserMarkList } from '@/api/common'
 import { getAllCountryApi } from '@/api/logistics'
+import LogisticsWaySelect from '@/views/logistics/components/LogisticsWaySelect'
 const defaultStatusTree: StatusTreeNode[] = [
   {
     code: 'ALL',
@@ -574,6 +582,9 @@ const defaultStatusTree: StatusTreeNode[] = [
 
 const statusTree = ref<StatusTreeNode[]>(defaultStatusTree)
 const status = ref<string>('PENDING_ACCEPT')
+const pendingAcceptSubTab = ref<'PENDING_ACCEPT' | 'ACCEPT_FAIL_OUT_OF_STOCK'>(
+  'PENDING_ACCEPT',
+)
 const treeRef = ref<InstanceType<typeof ElTree>>()
 const searchForm = ref<SearchForm>({})
 const dateRange = ref<string[]>([])
@@ -731,6 +742,12 @@ const mainColumns: CustomColumn<FactoryOrderNewListData>[] = [
     minWidth: 160,
   },
   { key: 'statusName', prop: 'statusName', label: '订单状态', minWidth: 120 },
+  { key: 'status', prop: 'status', label: '客户标签', minWidth: 160 },
+  { key: 'status', prop: 'status', label: '客户编号', minWidth: 160 },
+  { key: 'status', prop: 'status', label: '物流类型', minWidth: 120 },
+  { key: 'status', prop: 'status', label: '物流跟踪号', minWidth: 160 },
+  { key: 'status', prop: 'status', label: '总克重', minWidth: 120 },
+  { key: 'status', prop: 'status', label: '商品总数量', minWidth: 120 },
   {
     key: 'logisticsWayName',
     prop: 'logisticsWayName',
@@ -738,12 +755,6 @@ const mainColumns: CustomColumn<FactoryOrderNewListData>[] = [
     minWidth: 140,
   },
   {
-    key: 'totalWeight',
-    prop: 'totalWeight',
-    label: '总克重',
-    minWidth: 100,
-  },
-  {
     key: 'totalProductNum',
     prop: 'totalProductNum',
     label: '商品总数量',
@@ -762,6 +773,12 @@ const mainColumns: CustomColumn<FactoryOrderNewListData>[] = [
     minWidth: 140,
   },
   {
+    key: 'receiverPhone',
+    prop: 'receiverPhone',
+    label: '收货人邮编',
+    minWidth: 140,
+  },
+  {
     key: 'receiverAddress',
     prop: 'receiverAddress',
     label: '收货地址',
@@ -773,19 +790,30 @@ const mainColumns: CustomColumn<FactoryOrderNewListData>[] = [
     prop: 'createTime',
     label: '创建时间',
     minWidth: 180,
+    sortable: true,
   },
   {
     key: 'acceptTime',
     prop: 'acceptTime',
     label: '接单时间',
+    sortable: true,
     minWidth: 180,
   },
   {
     key: 'finishTime',
     prop: 'finishTime',
     label: '完成时间',
+    sortable: true,
     minWidth: 180,
   },
+  {
+    key:'operation',
+    prop: 'operation',
+    label: '操作',
+    minWidth: 120,
+    slot: 'operation',
+    fixed: 'right',
+  },
 ]
 
 const productColumns: CustomColumn<ProductListData>[] = [
@@ -820,13 +848,13 @@ const productColumns: CustomColumn<ProductListData>[] = [
     key: 'craftCode',
     prop: 'craftCode',
     label: '工艺',
-    minWidth: 120,
+    minWidth: 100,
   },
   {
     key: 'styleNo',
     prop: 'styleNo',
     label: '款号',
-    minWidth: 120,
+    minWidth: 100,
   },
   {
     key: 'price',
@@ -850,23 +878,54 @@ const productColumns: CustomColumn<ProductListData>[] = [
     key: 'availableQuantity',
     prop: 'availableQuantity',
     label: '可用数量',
-    minWidth: 110,
+    minWidth: 100,
   },
   {
     key: 'stockQuantity',
     prop: 'stockQuantity',
     label: '库存数量',
-    minWidth: 110,
+    minWidth: 100,
   },
   {
     key: 'occupiedQuantity',
     prop: 'occupiedQuantity',
     label: '占用数量',
-    minWidth: 110,
+    minWidth: 100,
+  },
+  {
+    key:'',
+    prop: '',
+    label:'英文报关名称',
+    width: 160,
+  },
+  {
+    key:'',
+    prop: '',
+    label:'中文报关名称',
+    width: 160,
+  },
+  {
+    key:'',
+    prop: '',
+    label:'申报重量(g)',
+    width: 100,
+  },
+  {
+    key:'',
+    prop: '',
+    label:'申报价值($)',
+    width: 100,
+  },
+  {
+    key:'',
+    prop: '',
+    label:'备注',
+    width: 160,
   },
 ]
 
 const {
+  loading,
   currentPage,
   pageSize,
   total,
@@ -885,7 +944,11 @@ const {
       },
       page,
       size,
-      status.value === 'ALL' ? undefined : status.value,
+      status.value === 'ALL'
+        ? undefined
+        : status.value === 'PENDING_ACCEPT'
+        ? pendingAcceptSubTab.value
+        : status.value,
     ).then((res) => res.data),
 })
 
@@ -903,6 +966,9 @@ const reset = () => {
 
 const handleStatusNodeClick = (node: StatusTreeNode) => {
   status.value = node.code
+  if (node.code !== 'PENDING_ACCEPT') {
+    pendingAcceptSubTab.value = 'PENDING_ACCEPT'
+  }
   // refresh()
 }
 
@@ -946,6 +1012,16 @@ const handleMainRowClick = (row: FactoryOrderNewListData) => {
 }
 
 watch(
+  () => pendingAcceptSubTab.value,
+  () => {
+    if (status.value === 'PENDING_ACCEPT') {
+      onCurrentPageChange(1)
+      refresh()
+    }
+  },
+)
+
+watch(
   () => activeTab.value,
   () => {
     if (currentRow.value) {
@@ -1050,6 +1126,31 @@ onMounted(() => {
   }
 }
 
+.pending-accept-subtabs {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  border-top: 1px solid #e5e6eb;
+  border-bottom: 1px solid #e5e6eb;
+  margin-top: 10px;
+}
+
+.pending-accept-subtab {
+  font-size: 14px;
+  line-height: 32px;
+  padding: 0 12px;
+  cursor: pointer;
+  user-select: none;
+  color: #333;
+  position: relative;
+
+  &.active {
+    background: #ecf5ff;
+    color: #409eff;
+    border-bottom: 2px solid #409eff;
+  }
+}
+
 .right {
   flex: 1;
   flex-shrink: 0;