소스 검색

fix 退回不良&修改地址

ylong 8 달 전
부모
커밋
d45110908e

+ 17 - 41
src/components/CommonPage/AreaSelect.vue

@@ -1,10 +1,10 @@
 <template>
     <el-cascader v-model="selectedValue" :options="areaOptions" :props="propsCascader" @change="handleChange"
-        style="width:100%" placeholder="请选择省/市/区" clearable />
+        style="width:100%" placeholder="请选择省/市/区" clearable :key="componentKey" />
 </template>
 
 <script setup>
-import { ref, watch, onMounted } from 'vue'
+import { ref, watch, onMounted, computed } from 'vue'
 import request from '@/utils/request'
 
 const props = defineProps({
@@ -23,6 +23,12 @@ const emit = defineEmits(['update:modelValue'])
 const selectedValue = ref([])
 const areaOptions = ref([])
 
+// 创建一个响应式的key,用于强制重新渲染
+const componentKey = computed(() => {
+    // 当modelValue发生变化时,生成新的key
+    return props.modelValue ? props.modelValue.join('-') : 'empty'
+})
+
 // 配置级联选择器属性
 const propsCascader = {
     lazy: true,
@@ -34,37 +40,37 @@ const propsCascader = {
 
 // 监听外部传入的值变化,用于数据回填
 watch(() => props.modelValue, (newVal) => {
-    console.log(newVal, 'newVal')
-    if (newVal && newVal.length > 0) {
-        selectedValue.value = newVal
-        // 如果有初始值,需要预加载数据
-        initAreaData(newVal)
-    }
+    console.log(newVal, 'AreaSelect received newVal')
+    selectedValue.value = newVal || []
 }, { immediate: true, deep: true })
 
 // 值变化时触发
 const handleChange = (value) => {
+    console.log('AreaSelect handleChange:', value)
     emit('update:modelValue', value)
 }
 
 // 加载区域数据
 async function loadAreaData(node, resolve) {
     const { level, value } = node
+    console.log('loadAreaData called:', level, value)
     try {
         let data = []
         if (level === 0) {
             // 加载省份数据
             data = await getProvinceList()
-            console.log(data, 'data')
+            console.log('省份数据:', data)
         } else if (level === 1) {
             // 加载城市数据
             data = await getProvinceList(value)
+            console.log('城市数据:', data)
         } else if (level === 2) {
             // 加载区县数据
             data = await getProvinceList(value)
             data.forEach(item => {
                 item.leaf = true
             })
+            console.log('区县数据:', data)
         }
         resolve(data)
     } catch (error) {
@@ -84,39 +90,9 @@ function getProvinceList(id = 1) {
     })
 }
 
-// 初始化数据(用于回填)
-async function initAreaData(codes) {
-    try {
-        // 加载省份列表
-        areaOptions.value = await getProvinceList()
-
-        if (codes.length > 0) {
-            // 预加载市
-            const cityList = await getProvinceList(codes[0])
-            const province = areaOptions.value.find(p => p.id === codes[0])
-            if (province) {
-                province.children = cityList
-            }
-
-            if (codes.length > 1) {
-                // 预加载区
-                const districtList = await getProvinceList(codes[1])
-                const city = cityList.find(c => c.id === codes[1])
-                if (city) {
-                    city.children = districtList
-                }
-            }
-        }
-    } catch (error) {
-        console.error('初始化地区数据失败:', error)
-    }
-}
-
 onMounted(() => {
-    // 初始加载省份数据
-    loadAreaData({ level: 0 }, (data) => {
-        areaOptions.value = data
-    })
+    console.log('AreaSelect mounted')
+    // 不需要在mounted时预加载,懒加载会自动处理
 })
 </script>
 

+ 50 - 56
src/views/recycleOrder/completed/index.vue

@@ -1,14 +1,8 @@
 <template>
   <order-page ref="pageRef" :pageConfig="pageConfig" permissionKey="completed" :propColumns="columns">
     <template #toolbar>
-      <el-button
-        type="success"
-        plain
-        class="ele-btn-icon"
-        :icon="DownloadOutlined"
-        v-permission="'recycleOrder:completed:export'"
-        @click="exportData"
-      >
+      <el-button type="success" plain class="ele-btn-icon" :icon="DownloadOutlined"
+        v-permission="'recycleOrder:completed:export'" @click="exportData">
         导出订单明细
       </el-button>
     </template>
@@ -16,57 +10,57 @@
 </template>
 
 <script setup>
-  import { ref, reactive } from 'vue';
-  import { DownloadOutlined } from '@/components/icons';
-  import OrderPage from '@/views/recycleOrder/components/order-page-all.vue';
+import { ref, reactive } from 'vue';
+import { DownloadOutlined } from '@/components/icons';
+import OrderPage from '@/views/recycleOrder/components/order-page-all.vue';
 
-  defineOptions({ name: 'recycleOrderCompleted' });
+defineOptions({ name: 'recycleOrderCompleted' });
 
-  /** 页面组件实例 */
-  const pageRef = ref(null);
+/** 页面组件实例 */
+const pageRef = ref(null);
 
-  const pageConfig = reactive({
-    pageUrl: '/order/orderInfo/done/pageList',
-    exportUrl: '/order/orderInfo/done/export',
-    fileName: '已完成订单',
-    cacheKey: 'recycleOrderCompletedTable'
-  });
+const pageConfig = reactive({
+  pageUrl: '/order/orderInfo/done/pageList',
+  exportUrl: '/order/orderInfo/done/export',
+  fileName: '已完成订单',
+  cacheKey: 'recycleOrderCompletedTable'
+});
 
-  //导出数据
-  function exportData() {
-    pageRef.value?.exportData('已完成订单');
-  }
+//导出数据
+function exportData() {
+  pageRef.value?.exportData('已完成订单');
+}
 
-  /** 表格列配置 */
-  const columns = ref([
-    {
-      type: 'selection',
-      columnKey: 'selection',
-      width: 50,
-      align: 'center',
-      fixed: 'left'
-    },
-    { label: '单号', prop: 'orderNumber', slot: 'orderNumber', minWidth: 230 },
-    { label: '客户', prop: 'customer', slot: 'customer', minWidth: 360 },
-    { label: '金额', prop: 'amount', slot: 'amount', minWidth: 160 },
-    {
-      label: '状态',
-      prop: 'status',
-      slot: 'status',
-      width: '166'
-    },
-    { label: '时间', prop: 'time', slot: 'time', minWidth: 210 },
-    { label: '备注', prop: 'remarks', slot: 'remarks' },
-    { label: '售后', prop: 'refundStatusName' },
-    {
-      columnKey: 'action',
-      label: '操作',
-      width: 182,
-      align: 'center',
-      slot: 'action',
-      hideInPrint: true,
-      hideInExport: true,
-      fixed: 'right'
-    }
-  ]);
+/** 表格列配置 */
+const columns = ref([
+  {
+    type: 'selection',
+    columnKey: 'selection',
+    width: 50,
+    align: 'center',
+    fixed: 'left'
+  },
+  { label: '单号', prop: 'orderNumber', slot: 'orderNumber', minWidth: 230 },
+  { label: '客户', prop: 'customer', slot: 'customer', minWidth: 360 },
+  { label: '金额', prop: 'amount', slot: 'amount', minWidth: 160 },
+  {
+    label: '状态',
+    prop: 'status',
+    slot: 'status',
+    width: '166'
+  },
+  { label: '时间', prop: 'time', slot: 'time', minWidth: 210 },
+  { label: '备注', prop: 'remarks', slot: 'remarks' },
+  { label: '售后', prop: 'refundStatusName' },
+  {
+    columnKey: 'action',
+    label: '操作',
+    width: 182,
+    align: 'center',
+    slot: 'action',
+    hideInPrint: true,
+    hideInExport: true,
+    fixed: 'right'
+  }
+]);
 </script>

+ 22 - 54
src/views/recycleOrder/components/modify-address.vue

@@ -15,10 +15,9 @@
 </template>
 
 <script setup>
-  import { reactive, ref, defineEmits, getCurrentInstance } from 'vue';
+  import { reactive, ref, defineEmits, getCurrentInstance, nextTick, computed } from 'vue';
   import SimpleFormModal from '@/components/CommonPage/SimpleFormModal.vue';
   import AreaSelect from '@/components/CommonPage/AreaSelect.vue';
-  import request from '@/utils/request';
   const { proxy } = getCurrentInstance();
 
   const emit = defineEmits(['success']);
@@ -47,19 +46,10 @@
         }
       },
       {
-        type: 'regions',
+        type: 'areaSelect',
         label: '省市区',
         prop: 'proCodes',
-        required: true,
-        props: {
-          cascaderProps: {
-            lazy: true,
-            lazyLoad: loadAreaData,
-            value: 'id',
-            label: 'district',
-            checkStrictly: false
-          }
-        }
+        required: true
       },
       {
         type: 'textarea',
@@ -100,54 +90,32 @@
   };
 
   function handleOpen(data) {
+    console.log('handleOpen called with:', data);
+    
+    // 先重置formData,确保清空所有数据
+    formData.value = {
+      orderId: '',
+      sendName: '',
+      sendMobile: '',
+      provinceId: 0,
+      cityId: 0,
+      districtId: 0,
+      detailAddress: '',
+      proCodes: []
+    };
+    
     if (data && data.orderId) {
       formData.value.orderId = data.orderId;
       formData.value.sendName = data.sendName;
       formData.value.sendMobile = data.sendMobile;
       formData.value.detailAddress = data.sendAddress;
       formData.value.proCodes = data.sendSsqId ? data.sendSsqId.split('/').map(Number) : [];
-      console.log(formData.value, 'formData.value');
-      editRef.value?.handleOpen(formData.value);
+      console.log('formData after setup:', formData.value);
     }
-  }
-
-  // 加载区域数据
-  async function loadAreaData(node, resolve) {
-    const { level, value } = node;
-    try {
-      let data = [];
-      if (level === 0) {
-        // 加载省份数据
-        data = await getProvinceList();
-        console.log(data, 'data');
-      } else if (level === 1) {
-        // 加载城市数据
-        data = await getProvinceList(value);
-      } else if (level === 2) {
-        // 加载区县数据
-        data = await getProvinceList(value);
-        data.forEach((item) => {
-          item.leaf = true;
-        });
-      }
-      resolve(data);
-    } catch (error) {
-      console.error('加载地区数据失败:', error);
-      resolve([]);
-    }
-  }
-
-  function getProvinceList(id = 1) {
-    return new Promise((resolve, reject) => {
-      request
-        .get(`/baseinfo/districtInfo/findInfo/${id}`)
-        .then((res) => {
-          resolve(res.data.data);
-        })
-        .catch((err) => {
-          resolve([]);
-          reject(err);
-        });
+    
+    // 使用nextTick确保数据重置后再打开弹窗
+    nextTick(() => {
+      editRef.value?.handleOpen(formData.value);
     });
   }
 

+ 460 - 576
src/views/recycleOrder/components/order-page-all.vue

@@ -4,29 +4,16 @@
     <order-search @search="reload" />
     <ele-card :body-style="{ paddingTop: '8px' }" flex-table>
       <!-- 表格 -->
-      <ele-pro-table
-        ref="tableRef"
-        row-key="orderId"
-        :columns="propColumns.length > 0 ? propColumns : columns"
-        :datasource="datasource"
-        :show-overflow-tooltip="true"
-        v-model:selections="selections"
-        highlight-current-row
-        :export-config="{ fileName: pageConfig.fileName }"
-        :cache-key="pageConfig.cacheKey"
-      >
+      <ele-pro-table ref="tableRef" row-key="orderId" :columns="propColumns.length > 0 ? propColumns : columns"
+        :datasource="datasource" :show-overflow-tooltip="true" v-model:selections="selections" highlight-current-row
+        :export-config="{ fileName: pageConfig.fileName }" :cache-key="pageConfig.cacheKey">
         <template #toolbar>
           <slot name="toolbar"></slot>
         </template>
 
         <template #status="{ row }">
           <el-tag type="danger" v-if="row.cancelStatus == 1">已取消</el-tag>
-          <dict-data
-            v-else
-            code="order_status"
-            type="tag"
-            :model-value="row.status"
-          />
+          <dict-data v-else code="order_status" type="tag" :model-value="row.status" />
           <div v-if="row.status == 4 && row.auditRejectReason">
             原因:
             <el-text type="info">{{ row.auditRejectReason }}</el-text>
@@ -45,225 +32,112 @@
           <order-time :row="row"></order-time>
         </template>
         <template #remarks="{ row }">
-          <el-popover
-            trigger="hover"
-            width="240px"
-            @show="handleShowPopover(row)"
-            @hide="showOrderId = ''"
-          >
+          <el-popover trigger="hover" width="240px" @show="handleShowPopover(row)" @hide="showOrderId = ''">
             <template #reference>
-              <el-icon
-                style="cursor: pointer"
-                :size="24"
-                :color="row.remarkLabel || '#777777'"
-                @click="handleRemarks(row)"
-              >
+              <el-icon style="cursor: pointer" :size="24" :color="row.remarkLabel || '#777777'"
+                @click="handleRemarks(row)">
                 <Flag />
               </el-icon>
             </template>
-            <orderTimeline
-              title="备注历史记录"
-              ref="remarkPopoverRef"
-            ></orderTimeline>
+            <orderTimeline title="备注历史记录" ref="remarkPopoverRef"></orderTimeline>
           </el-popover>
         </template>
 
         <template #action="{ row }">
           <div class="flex justify-center flex-wrap">
-            <el-button
-              type="success"
-              link
-              v-permission="usePermission('detail')"
-              @click="toOrderDetail(row)"
-            >
+            <el-button type="success" link v-permission="usePermission('detail')" @click="toOrderDetail(row)">
               [订单详情]
             </el-button>
-            <el-button
-              type="warning"
-              link
-              v-permission="usePermission('log')"
-              @click="openOrderLog(row)"
-            >
+            <el-button type="warning" link v-permission="usePermission('log')" @click="openOrderLog(row)">
               [订单日志]
             </el-button>
-            <el-button
-              type="danger"
-              link
-              v-if="row.status == 2"
-              v-permission="usePermission('audit')"
-              @click="handleFirstCheck(row)"
-            >
+            <el-button type="danger" link v-if="row.status == 2" v-permission="usePermission('audit')"
+              @click="handleFirstCheck(row)">
               [初步审核]
             </el-button>
             <!-- 3 已初审-带上门取件 5已揽件-待签收 6已签收-待确认到货 -->
-            <el-button
-              type="danger"
-              link
-              v-if="['3', '5', '6'].includes(row.status)"
-              v-permission="usePermission('cancel')"
-              @click="handleCancelOrder(row)"
-            >
+            <el-button type="danger" link v-if="['3', '5', '6'].includes(row.status)"
+              v-permission="usePermission('cancel')" @click="handleCancelOrder(row)">
               [取消订单]
             </el-button>
             <!-- 3 已初审-带上门取件 5已揽件-待签收 6已签收-待确认到货 8待回收审核 9审核未提交 10待付款 -->
-            <el-button
-              type="primary"
-              link
-              v-if="['3', '5', '6', '8', '9', '10'].includes(row.status)"
-              v-permission="usePermission('fallback')"
-              @click="fallbackOrder(row)"
-            >
+            <el-button type="primary" link v-if="['3', '5', '6', '8', '9', '10'].includes(row.status)"
+              v-permission="usePermission('fallback')" @click="fallbackOrder(row)">
               [回退状态]
             </el-button>
-            <el-button
-              type="success"
-              link
-              v-if="row.status == 3"
-              v-permission="usePermission('materialPickup')"
-              @click="materialPickup(row)"
-            >
+            <el-button type="success" link v-if="row.status == 3" v-permission="usePermission('materialPickup')"
+              @click="materialPickup(row)">
               [物流揽件]
             </el-button>
-            <el-button
-              type="success"
-              link
-              v-if="row.status == 5"
-              v-permission="usePermission('receive')"
-              @click="handleLogisticsSigning(row)"
-            >
+            <el-button type="success" link v-if="row.status == 5" v-permission="usePermission('receive')"
+              @click="handleLogisticsSigning(row)">
               [物流签收]
             </el-button>
-            <el-button
-              type="success"
-              link
-              v-if="row.status == 5 || row.status == 7"
-              v-permission="usePermission('signDelivery')"
-              @click="handleSignDelivery(row)"
-            >
+            <el-button type="success" link v-if="row.status == 5 || row.status == 7"
+              v-permission="usePermission('signDelivery')" @click="handleSignDelivery(row)">
               [快递签收]
             </el-button>
-            <el-button
-              type="success"
-              link
-              v-if="row.status == 6"
-              v-permission="usePermission('confirmReceipt')"
-              @click="handleConfirmReceipt(row)"
-            >
+            <el-button type="success" link v-if="row.status == 6" v-permission="usePermission('confirmReceipt')"
+              @click="handleConfirmReceipt(row)">
               [确认收货]
             </el-button>
-            <el-button
-              type="success"
-              link
-              v-if="['8', '9'].includes(row.status)"
-              v-permission="usePermission('arrivalAudit')"
-              @click="toOrderDetail(row)"
-            >
+            <el-button type="success" link v-if="['8', '9'].includes(row.status)"
+              v-permission="usePermission('arrivalAudit')" @click="toOrderDetail(row)">
               [到货审核]
             </el-button>
-            <el-button
-              type="danger"
-              link
-              v-if="['8', '9', '10', '11'].includes(row.status)"
-              v-permission="usePermission('auditScreenshot')"
-              @click="handleAuditScreenshot(row)"
-            >
+            <el-button type="danger" link v-if="['8', '9', '10', '11'].includes(row.status)"
+              v-permission="usePermission('auditScreenshot')" @click="handleAuditScreenshot(row)">
               [审核截图]
             </el-button>
-            <el-button
-              type="danger"
-              link
-              v-if="row.status == 10"
-              v-permission="usePermission('payment')"
-              @click="handleBatchPayment(row)"
-            >
+            <el-button type="danger" link v-if="row.status == 10" v-permission="usePermission('payment')"
+              @click="handleBatchPayment(row)">
               [支付书款]
             </el-button>
-            <el-button
-              type="danger"
-              link
-              v-if="row.status == 11"
-              v-permission="usePermission('afterSalesPayment')"
-              @click="handleAfterSalesPayment(row)"
-            >
+            <el-button type="danger" link v-if="row.status == 11" v-permission="usePermission('afterSalesPayment')"
+              @click="handleAfterSalesPayment(row)">
               [售后补款]
             </el-button>
-            <el-button
-              type="warning"
-              link
-              v-permission="usePermission('userTag')"
-              @click="openEditUserTag(row)"
-            >
+            <el-button type="warning" link v-permission="usePermission('userTag')" @click="openEditUserTag(row)">
               [用户标签]
             </el-button>
-            <el-button
-              type="success"
-              link
-              v-if="row.status == 2"
-              v-permission="usePermission('modifyAddress')"
-              @click="handleModifyAddress(row)"
-            >
+            <el-button type="success" link v-if="row.status == 2" v-permission="usePermission('modifyAddress')"
+              @click="handleModifyAddress(row)">
               [修改地址]
             </el-button>
 
             <!-- v-if="['8', '9', '10', '11'].includes(row.status)" -->
-            <el-button
-              type="success"
-              link
-              v-if="row.status > 2"
-              v-permission="usePermission('sendSMS')"
-              @click="handleSendSMS(row)"
-            >
+            <el-button type="success" link v-if="row.status > 2" v-permission="usePermission('sendSMS')"
+              @click="handleSendSMS(row)">
               [推送短信]
             </el-button>
-            <el-button
-              type="info"
-              link
-              v-if="['8', '9', '10'].includes(row.status)"
-              v-permission="usePermission('smsLog')"
-              @click="handleSmsLog(row)"
-            >
+            <el-button type="info" link v-if="['8', '9', '10'].includes(row.status)"
+              v-permission="usePermission('smsLog')" @click="handleSmsLog(row)">
               [短信记录]
             </el-button>
-            <el-button
-              color="#7728f5"
-              link
-              plain
-              v-if="row.status == 11"
-              v-permission="usePermission('applyForOrderClaim')"
-              @click="handleApplyForOrderClaim(row)"
-            >
+            <el-button color="#7728f5" link plain v-if="row.status == 11"
+              v-permission="usePermission('applyForOrderClaim')" @click="handleApplyForOrderClaim(row)">
               [申请订单理赔]
             </el-button>
-            <el-button
-              color="#7728f5"
-              link
-              plain
-              v-if="row.cancelStatus == 1"
-              v-permission="usePermission('applyForOrderRestore')"
-              @click="handleApplyForOrderRestore(row)"
-            >
+            <el-button color="#7728f5" link plain v-if="row.cancelStatus == 1"
+              v-permission="usePermission('applyForOrderRestore')" @click="handleApplyForOrderRestore(row)">
               [申请恢复订单]
             </el-button>
 
+            <el-button link plain type="danger"
+              v-if="row.status == 11 && (row.refundStatus == 1 || row.refundStatus == 5)"
+              v-permission="usePermission('returnBad')" @click="handleReturnBad(row)">
+              [退回不良]
+            </el-button>
+
             <template v-if="row.interceptStatus == 0">
-              <el-button
-                type="danger"
-                link
-                v-if="['5', '6'].includes(row.status)"
-                v-permission="usePermission('interception')"
-                @click="applyForInterception(row)"
-              >
+              <el-button type="danger" link v-if="['5', '6'].includes(row.status)"
+                v-permission="usePermission('interception')" @click="applyForInterception(row)">
                 [申请拦截退回]
               </el-button>
             </template>
             <template v-else>
-              <el-button
-                type="info"
-                link
-                v-if="['5', '6'].includes(row.status)"
-                v-permission="usePermission('cancelInterception')"
-                @click="cancelInterception(row)"
-              >
+              <el-button type="info" link v-if="['5', '6'].includes(row.status)"
+                v-permission="usePermission('cancelInterception')" @click="cancelInterception(row)">
                 [取消拦截退回]
               </el-button>
             </template>
@@ -301,424 +175,434 @@
 </template>
 
 <script setup>
-  import { ref, getCurrentInstance, nextTick } from 'vue';
-  import { ElMessageBox } from 'element-plus/es';
-  import { EleMessage } from 'ele-admin-plus/es';
-  import { DownloadOutlined } from '@/components/icons';
-  import { Flag, ChatDotSquare } from '@element-plus/icons-vue';
-  import OrderSearch from '../components/order-search.vue';
-  import OrderNumber from '@/views/recycleOrder/components/order-number.vue';
-  import OrderCustomer from '@/views/recycleOrder/components/order-customer.vue';
-  import OrderAmount from '@/views/recycleOrder/components/order-amount.vue';
-  import OrderTime from '@/views/recycleOrder/components/order-time.vue';
-  import { useDictData } from '@/utils/use-dict-data';
-  import { download, toFormData, checkDownloadRes } from '@/utils/common';
-  import orderRemarks from '@/views/recycleOrder/components/order-remarks.vue';
-  import orderTimeline from '@/views/recycleOrder/components/order-timeline.vue';
-  import firstCheckModal from '@/views/recycleOrder/components/first-check-modal.vue';
-  import modifyAddress from '@/views/recycleOrder/components/modify-address.vue';
-  import applyForOrderClaim from '@/views/recycleOrder/components/applyfor-order-claim.vue';
-  import afterSalesPayment from '@/views/recycleOrder/components/after-sales-payment.vue';
-  //订单日志
-  import orderLog from '@/views/recycleOrder/components/order-log.vue';
-  //用户标签
-  import userBindTag from '@/views/recycleOrder/components/user-bind-tag.vue';
-  //订单详情
-  import orderDetail from '@/views/recycleOrder/components/order-detail.vue';
-  //审核截图
-  import auditScreenshot from '@/views/recycleOrder/components/audit-screenshot.vue';
-  //推送短信
-  import sendSMS from '@/views/recycleOrder/components/send-SMS.vue';
-  //短信记录
-  import orderSmsLog from '@/views/recycleOrder/components/order-sms-log.vue';
-  //申请恢复订单
-  import applyOrderRestore from '@/views/recycleOrder/components/apply-order-restore.vue';
-
-  let props = defineProps({
-    pageConfig: {
-      type: Object,
-      default: () => ({
-        cacheKey: 'recycleOrderTable',
-        pageUrl: '/order/orderInfo/pageList',
-        fileName: '回收订单查询',
-        exportUrl: '/order/orderInfo/export',
-        where: {}
-      })
-    },
-    exportUrl: { type: String, default: '/system/post/export' },
-    permissionKey: { type: String, default: 'search' },
-    propColumns: { type: Array, default: () => [] }
-  });
-  const usePermission = computed(() => (opts) => {
-    return `recycleOrder:${props.permissionKey}:${opts}`;
-  });
-
-  let { proxy } = getCurrentInstance();
-  /** 字典数据 */
-  const [statusDicts] = useDictData(['order_status']);
-
-  /** 表格实例 */
-  const tableRef = ref(null);
-
-  /** 表格列配置 */
-  const columns = ref([
-    {
-      type: 'selection',
-      columnKey: 'selection',
-      width: 50,
-      align: 'center',
-      fixed: 'left'
-    },
-    { label: '单号', prop: 'orderNumber', slot: 'orderNumber', minWidth: 230 },
-    { label: '客户', prop: 'customer', slot: 'customer', minWidth: 360 },
-    { label: '金额', prop: 'amount', slot: 'amount', minWidth: 160 },
-    {
-      label: '状态',
-      prop: 'status',
-      slot: 'status',
-      width: '166'
-    },
-    { label: '时间', prop: 'time', slot: 'time', minWidth: 210 },
-    { label: '备注', prop: 'remarks', slot: 'remarks' },
-    {
-      columnKey: 'action',
-      label: '操作',
-      width: 182,
-      align: 'center',
-      slot: 'action',
-      hideInPrint: true,
-      hideInExport: true,
-      fixed: 'right'
-    }
-  ]);
-
-  /** 表格选中数据 */
-  const selections = ref([]);
-
-  /** 当前编辑数据 */
-  const current = ref(null);
-
-  /** 是否显示编辑弹窗 */
-  const showEdit = ref(false);
-
-  async function queryPage(params) {
-    if (!props.pageConfig.pageUrl) return EleMessage.error('未配置页面请求URL');
-    const res = await proxy.$http.get(props.pageConfig.pageUrl, { params });
-    if (res.data.code === 200) {
-      return res.data;
-    }
-    return Promise.reject(new Error(res.data.msg));
+import { ref, getCurrentInstance, nextTick } from 'vue';
+import { ElMessageBox } from 'element-plus/es';
+import { EleMessage } from 'ele-admin-plus/es';
+import { DownloadOutlined } from '@/components/icons';
+import { Flag, ChatDotSquare } from '@element-plus/icons-vue';
+import OrderSearch from '../components/order-search.vue';
+import OrderNumber from '@/views/recycleOrder/components/order-number.vue';
+import OrderCustomer from '@/views/recycleOrder/components/order-customer.vue';
+import OrderAmount from '@/views/recycleOrder/components/order-amount.vue';
+import OrderTime from '@/views/recycleOrder/components/order-time.vue';
+import { useDictData } from '@/utils/use-dict-data';
+import { download, toFormData, checkDownloadRes } from '@/utils/common';
+import orderRemarks from '@/views/recycleOrder/components/order-remarks.vue';
+import orderTimeline from '@/views/recycleOrder/components/order-timeline.vue';
+import firstCheckModal from '@/views/recycleOrder/components/first-check-modal.vue';
+import modifyAddress from '@/views/recycleOrder/components/modify-address.vue';
+import applyForOrderClaim from '@/views/recycleOrder/components/applyfor-order-claim.vue';
+import afterSalesPayment from '@/views/recycleOrder/components/after-sales-payment.vue';
+//订单日志
+import orderLog from '@/views/recycleOrder/components/order-log.vue';
+//用户标签
+import userBindTag from '@/views/recycleOrder/components/user-bind-tag.vue';
+//订单详情
+import orderDetail from '@/views/recycleOrder/components/order-detail.vue';
+//审核截图
+import auditScreenshot from '@/views/recycleOrder/components/audit-screenshot.vue';
+//推送短信
+import sendSMS from '@/views/recycleOrder/components/send-SMS.vue';
+//短信记录
+import orderSmsLog from '@/views/recycleOrder/components/order-sms-log.vue';
+//申请恢复订单
+import applyOrderRestore from '@/views/recycleOrder/components/apply-order-restore.vue';
+
+let props = defineProps({
+  pageConfig: {
+    type: Object,
+    default: () => ({
+      cacheKey: 'recycleOrderTable',
+      pageUrl: '/order/orderInfo/pageList',
+      fileName: '回收订单查询',
+      exportUrl: '/order/orderInfo/export',
+      where: {}
+    })
+  },
+  exportUrl: { type: String, default: '/system/post/export' },
+  permissionKey: { type: String, default: 'search' },
+  propColumns: { type: Array, default: () => [] }
+});
+const usePermission = computed(() => (opts) => {
+  return `recycleOrder:${props.permissionKey}:${opts}`;
+});
+
+let { proxy } = getCurrentInstance();
+/** 字典数据 */
+const [statusDicts] = useDictData(['order_status']);
+
+/** 表格实例 */
+const tableRef = ref(null);
+
+/** 表格列配置 */
+const columns = ref([
+  {
+    type: 'selection',
+    columnKey: 'selection',
+    width: 50,
+    align: 'center',
+    fixed: 'left'
+  },
+  { label: '单号', prop: 'orderNumber', slot: 'orderNumber', minWidth: 230 },
+  { label: '客户', prop: 'customer', slot: 'customer', minWidth: 360 },
+  { label: '金额', prop: 'amount', slot: 'amount', minWidth: 160 },
+  {
+    label: '状态',
+    prop: 'status',
+    slot: 'status',
+    width: '166'
+  },
+  { label: '时间', prop: 'time', slot: 'time', minWidth: 210 },
+  { label: '备注', prop: 'remarks', slot: 'remarks' },
+  {
+    columnKey: 'action',
+    label: '操作',
+    width: 182,
+    align: 'center',
+    slot: 'action',
+    hideInPrint: true,
+    hideInExport: true,
+    fixed: 'right'
   }
+]);
 
-  /** 表格数据源 */
-  const datasource = ({ pages, where, orders }) => {
-    let initParams = props.pageConfig?.where || {};
-    return queryPage({
-      ...where,
-      ...orders,
-      ...pages,
-      ...initParams
-    });
-  };
-
-  /** 搜索 */
-  const reload = (where) => {
-    tableRef.value?.reload?.({ page: 1, where });
-  };
-
-  /** 批量操作 */
-  const operatBatch = ({ row, url, title }) => {
-    const rows = row == null ? selections.value : [row];
-    if (!rows.length) {
-      EleMessage.error('请至少选择一条数据');
-      return;
-    }
-    title = title || '是否确认当前操作?';
-    ElMessageBox.confirm(title, '提示', {
-      type: 'warning',
-      draggable: true
-    })
-      .then(() => {
-        const loading = EleMessage.loading({
-          message: '请求中..',
-          plain: true
-        });
+/** 表格选中数据 */
+const selections = ref([]);
 
-        proxy.$http
-          .delete(url)
-          .then(() => {
-            loading.close();
-            EleMessage.success('操作成功');
-            reload();
-          })
-          .catch((e) => {
-            loading.close();
-            EleMessage.error(e.message);
-          });
-      })
-      .catch(() => {});
-  };
-
-  /// 导出数据
-  async function exportPage(params, name) {
-    if (!props.pageConfig.exportUrl)
-      return EleMessage.error('未配置导出的URL!');
-    const res = await proxy.$http({
-      url: props.pageConfig.exportUrl,
-      method: 'POST',
-      data: toFormData(params),
-      responseType: 'blob'
-    });
-    await checkDownloadRes(res);
-    download(
-      res.data,
-      name ? `${name}_${Date.now()}.xlsx` : `post_${Date.now()}.xlsx`
-    );
-  }
+/** 当前编辑数据 */
+const current = ref(null);
+
+/** 是否显示编辑弹窗 */
+const showEdit = ref(false);
 
-  //导出数据 进导出记录
-  function exportRecord(params, name) {
-    if (!props.pageConfig.exportUrl)
-      return EleMessage.error('未配置导出的URL!');
-    return proxy.$http({
-      url: props.pageConfig.exportUrl,
-      method: 'POST',
-      data: params
-    }); // 导出记录
+async function queryPage(params) {
+  if (!props.pageConfig.pageUrl) return EleMessage.error('未配置页面请求URL');
+  const res = await proxy.$http.get(props.pageConfig.pageUrl, { params });
+  if (res.data.code === 200) {
+    return res.data;
+  }
+  return Promise.reject(new Error(res.data.msg));
+}
+
+/** 表格数据源 */
+const datasource = ({ pages, where, orders }) => {
+  let initParams = props.pageConfig?.where || {};
+  return queryPage({
+    ...where,
+    ...orders,
+    ...pages,
+    ...initParams
+  });
+};
+
+/** 搜索 */
+const reload = (where) => {
+  tableRef.value?.reload?.({ page: 1, where });
+};
+
+/** 批量操作 */
+const operatBatch = ({ row, url, title }) => {
+  const rows = row == null ? selections.value : [row];
+  if (!rows.length) {
+    EleMessage.error('请至少选择一条数据');
+    return;
   }
+  title = title || '是否确认当前操作?';
+  ElMessageBox.confirm(title, '提示', {
+    type: 'warning',
+    draggable: true
+  })
+    .then(() => {
+      const loading = EleMessage.loading({
+        message: '请求中..',
+        plain: true
+      });
 
-  /** 导出数据 */
-  const exportData = (name) => {
-    const loading = EleMessage.loading({
-      message: '请求中..',
-      plain: true
-    });
-    tableRef.value?.fetch?.(({ where, orders }) => {
-      exportRecord({ ...where, ...orders }, name)
-        .then((res) => {
-          if (res.data.code === 200) {
-            EleMessage.success('操作成功,请前往导出记录下载');
-          }
+      proxy.$http
+        .delete(url)
+        .then(() => {
           loading.close();
+          EleMessage.success('操作成功');
+          reload();
         })
         .catch((e) => {
           loading.close();
           EleMessage.error(e.message);
         });
-    });
-  };
-
-  //修改备注
-  const remarksRef = ref(null);
-  function handleRemarks(row) {
-    remarksRef.value?.handleOpen(row);
-  }
-
-  //备注弹窗显示
-  const showOrderId = ref();
-  const remarkPopoverRef = ref(null);
-  function handleShowPopover(row) {
-    nextTick(() => {
-      remarkPopoverRef.value?.getRemarks(row.orderId);
-    });
-
-    if (showOrderId.value !== row.orderId) {
-      showOrderId.value = row.orderId;
-    }
-  }
-
-  //弹窗确认操作
-  function messageBoxConfirm({ message, fetch }) {
-    ElMessageBox.confirm(message, '提示', {
-      confirmButtonText: '确定',
-      cancelButtonText: '关闭',
-      type: 'warning'
-    }).then(() => {
-      fetch().then((res) => {
+    })
+    .catch(() => { });
+};
+
+/// 导出数据
+async function exportPage(params, name) {
+  if (!props.pageConfig.exportUrl)
+    return EleMessage.error('未配置导出的URL!');
+  const res = await proxy.$http({
+    url: props.pageConfig.exportUrl,
+    method: 'POST',
+    data: toFormData(params),
+    responseType: 'blob'
+  });
+  await checkDownloadRes(res);
+  download(
+    res.data,
+    name ? `${name}_${Date.now()}.xlsx` : `post_${Date.now()}.xlsx`
+  );
+}
+
+//导出数据 进导出记录
+function exportRecord(params, name) {
+  if (!props.pageConfig.exportUrl)
+    return EleMessage.error('未配置导出的URL!');
+  return proxy.$http({
+    url: props.pageConfig.exportUrl,
+    method: 'POST',
+    data: params
+  }); // 导出记录
+}
+
+/** 导出数据 */
+const exportData = (name) => {
+  const loading = EleMessage.loading({
+    message: '请求中..',
+    plain: true
+  });
+  tableRef.value?.fetch?.(({ where, orders }) => {
+    exportRecord({ ...where, ...orders }, name)
+      .then((res) => {
         if (res.data.code === 200) {
-          EleMessage.success('操作成功');
-          reload();
-        } else {
-          EleMessage.error(res.data.msg);
+          EleMessage.success('操作成功,请前往导出记录下载');
         }
+        loading.close();
+      })
+      .catch((e) => {
+        loading.close();
+        EleMessage.error(e.message);
       });
-    });
-  }
-
-  //取消订单
-  function handleCancelOrder(row) {
-    const rows = row == null ? selections.value : [row];
-    if (!rows.length) {
-      EleMessage.error('请至少选择一条数据');
-      return;
-    }
-    messageBoxConfirm({
-      message: '是否确认取消订单?',
-      fetch: () =>
-        proxy.$http.post('/order/orderInfo/adminCancel', {
-          orderIds: rows.map((item) => item.orderId)
-        })
-    });
-  }
-  //申请拦截退出
-  function applyForInterception(row) {
-    messageBoxConfirm({
-      message: '确认拦截?',
-      fetch: () => proxy.$http.post(`/order/orderInfo/intercept/${row.orderId}`)
-    });
-  }
-  //取消拦截退出
-  function cancelInterception(row) {
-    messageBoxConfirm({
-      message: '确认取消拦截?',
-      fetch: () =>
-        proxy.$http.post(`/order/orderInfo/interceptBack/${row.orderId}`)
-    });
-  }
-
-  //物流签收
-  function handleLogisticsSigning(row) {
-    messageBoxConfirm({
-      message: '确认签收?',
-      fetch: () =>
-        proxy.$http.post('/order/orderInfo/adminSigned', {
-          orderIds: [row.orderId]
-        })
-    });
-  }
-  //快递签收
-  function handleSignDelivery(row) {
-    messageBoxConfirm({
-      message: '确认快递签收?',
-      fetch: () =>
-        proxy.$http.post('/order/orderInfo/adminDeliverySigned', {
-          orderId: row.orderId
-        })
-    });
-  }
-  //物流揽件
-  function materialPickup(row) {
-    messageBoxConfirm({
-      message: '确认物流揽件?',
-      fetch: () =>
-        proxy.$http.post('/order/orderInfo/adminPickup', {
-          orderIds: [row.orderId]
-        })
-    });
-  }
-  //申请订单理赔
-  const applyForOrderClaimRef = ref(null);
-  function handleApplyForOrderClaim(row) {
-    applyForOrderClaimRef.value?.handleOpen(row);
-  }
-  //售后补款
-  const afterSalesPaymentRef = ref(null);
-  function handleAfterSalesPayment(row) {
-    afterSalesPaymentRef.value?.handleOpen(row);
-  }
-  //推送短信
-  const sendSMSRef = ref(null);
-  function handleSendSMS(row) {
-    sendSMSRef.value?.handleOpen(row);
-  }
-  //短信记录
-  const orderSmsLogRef = ref(null);
-  function handleSmsLog(row) {
-    orderSmsLogRef.value?.handleOpen(row);
-  }
-
-  //确认收货
-  function handleConfirmReceipt(row) {
-    const rows = row == null ? selections.value : [row];
-    if (!rows.length) {
-      EleMessage.error('请至少选择一条数据');
-      return;
-    }
-    messageBoxConfirm({
-      message: '确认收货?',
-      fetch: () =>
-        proxy.$http.post('/order/orderInfo/adminConfirm', {
-          orderIds: rows.map((item) => item.orderId)
-        })
-    });
-  }
+  });
+};
+
+//修改备注
+const remarksRef = ref(null);
+function handleRemarks(row) {
+  remarksRef.value?.handleOpen(row);
+}
+
+//备注弹窗显示
+const showOrderId = ref();
+const remarkPopoverRef = ref(null);
+function handleShowPopover(row) {
+  nextTick(() => {
+    remarkPopoverRef.value?.getRemarks(row.orderId);
+  });
 
-  //订单详情
-  const orderDetailRef = ref(null);
-  function toOrderDetail(row) {
-    orderDetailRef.value?.handleOpen(row);
+  if (showOrderId.value !== row.orderId) {
+    showOrderId.value = row.orderId;
   }
-  //初审
-  const firstCheckRef = ref(null);
-  function handleFirstCheck(row) {
-    const rows = row == null ? selections.value : [row];
-    if (!rows.length) {
-      EleMessage.error('请至少选择一条数据');
-      return;
-    }
-    let orderIds = rows.map((item) => item.orderId).join(',');
-    firstCheckRef.value?.handleOpen(orderIds);
-  }
-  //修改地址
-  const modifyAddressRef = ref(null);
-  function handleModifyAddress(row) {
-    modifyAddressRef.value?.handleOpen(row);
-  }
-  //订单日志
-  const orderLogRef = ref(null);
-  function openOrderLog(row) {
-    orderLogRef.value?.handleOpen(row.orderId);
-  }
-  //用户标签
-  const userTagRef = ref(null);
-  function openEditUserTag(row) {
-    userTagRef.value?.handleOpen(row);
-  }
-
-  function handleBatchPayment(row) {
-    const rows = row == null ? selections.value : [row];
-    console.log(row, rows, 'xxxx');
-    if (!rows.length) {
-      EleMessage.error('请至少选择一条数据');
-      return;
-    }
-    messageBoxConfirm({
-      message: '确认支付书款?',
-      fetch: () =>
-        proxy.$http.post('/order/orderInfo/payout', {
-          orderIds: rows.map((item) => item.orderId)
-        })
+}
+
+//弹窗确认操作
+function messageBoxConfirm({ message, fetch }) {
+  ElMessageBox.confirm(message, '提示', {
+    confirmButtonText: '确定',
+    cancelButtonText: '关闭',
+    type: 'warning'
+  }).then(() => {
+    fetch().then((res) => {
+      if (res.data.code === 200) {
+        EleMessage.success('操作成功');
+        reload();
+      } else {
+        EleMessage.error(res.data.msg);
+      }
     });
+  });
+}
+
+//取消订单
+function handleCancelOrder(row) {
+  const rows = row == null ? selections.value : [row];
+  if (!rows.length) {
+    EleMessage.error('请至少选择一条数据');
+    return;
   }
-
-  //回退状态
-  function fallbackOrder(row) {
-    messageBoxConfirm({
-      message: '确认回退?',
-      fetch: () =>
-        proxy.$http.post(`/order/orderInfo/statusBack/${row.orderId}`)
-    });
+  messageBoxConfirm({
+    message: '是否确认取消订单?',
+    fetch: () =>
+      proxy.$http.post('/order/orderInfo/adminCancel', {
+        orderIds: rows.map((item) => item.orderId)
+      })
+  });
+}
+//申请拦截退出
+function applyForInterception(row) {
+  messageBoxConfirm({
+    message: '确认拦截?',
+    fetch: () => proxy.$http.post(`/order/orderInfo/intercept/${row.orderId}`)
+  });
+}
+//取消拦截退出
+function cancelInterception(row) {
+  messageBoxConfirm({
+    message: '确认取消拦截?',
+    fetch: () =>
+      proxy.$http.post(`/order/orderInfo/interceptBack/${row.orderId}`)
+  });
+}
+//退回不良
+function handleReturnBad(row) {
+  messageBoxConfirm({
+    message: '确认退回不良?',
+    fetch: () =>
+      proxy.$http.post(`/order/orderInfo/refund/adminSubmit`, {
+        orderId: row.orderId
+      })
+  });
+}
+
+//物流签收
+function handleLogisticsSigning(row) {
+  messageBoxConfirm({
+    message: '确认签收?',
+    fetch: () =>
+      proxy.$http.post('/order/orderInfo/adminSigned', {
+        orderIds: [row.orderId]
+      })
+  });
+}
+//快递签收
+function handleSignDelivery(row) {
+  messageBoxConfirm({
+    message: '确认快递签收?',
+    fetch: () =>
+      proxy.$http.post('/order/orderInfo/adminDeliverySigned', {
+        orderId: row.orderId
+      })
+  });
+}
+//物流揽件
+function materialPickup(row) {
+  messageBoxConfirm({
+    message: '确认物流揽件?',
+    fetch: () =>
+      proxy.$http.post('/order/orderInfo/adminPickup', {
+        orderIds: [row.orderId]
+      })
+  });
+}
+//申请订单理赔
+const applyForOrderClaimRef = ref(null);
+function handleApplyForOrderClaim(row) {
+  applyForOrderClaimRef.value?.handleOpen(row);
+}
+//售后补款
+const afterSalesPaymentRef = ref(null);
+function handleAfterSalesPayment(row) {
+  afterSalesPaymentRef.value?.handleOpen(row);
+}
+//推送短信
+const sendSMSRef = ref(null);
+function handleSendSMS(row) {
+  sendSMSRef.value?.handleOpen(row);
+}
+//短信记录
+const orderSmsLogRef = ref(null);
+function handleSmsLog(row) {
+  orderSmsLogRef.value?.handleOpen(row);
+}
+
+//确认收货
+function handleConfirmReceipt(row) {
+  const rows = row == null ? selections.value : [row];
+  if (!rows.length) {
+    EleMessage.error('请至少选择一条数据');
+    return;
   }
-  //审核截图
-  const auditScreenshotRef = ref(null);
-  function handleAuditScreenshot(row) {
-    auditScreenshotRef.value?.handleOpen(row);
+  messageBoxConfirm({
+    message: '确认收货?',
+    fetch: () =>
+      proxy.$http.post('/order/orderInfo/adminConfirm', {
+        orderIds: rows.map((item) => item.orderId)
+      })
+  });
+}
+
+//订单详情
+const orderDetailRef = ref(null);
+function toOrderDetail(row) {
+  orderDetailRef.value?.handleOpen(row);
+}
+//初审
+const firstCheckRef = ref(null);
+function handleFirstCheck(row) {
+  const rows = row == null ? selections.value : [row];
+  if (!rows.length) {
+    EleMessage.error('请至少选择一条数据');
+    return;
   }
-
-  //申请恢复订单
-  const applyOrderRestoreRef = ref(null);
-  function handleApplyForOrderRestore(row) {
-    applyOrderRestoreRef.value?.handleOpen(row);
+  let orderIds = rows.map((item) => item.orderId).join(',');
+  firstCheckRef.value?.handleOpen(orderIds);
+}
+//修改地址
+const modifyAddressRef = ref(null);
+function handleModifyAddress(row) {
+  modifyAddressRef.value?.handleOpen(row);
+}
+//订单日志
+const orderLogRef = ref(null);
+function openOrderLog(row) {
+  orderLogRef.value?.handleOpen(row.orderId);
+}
+//用户标签
+const userTagRef = ref(null);
+function openEditUserTag(row) {
+  userTagRef.value?.handleOpen(row);
+}
+
+function handleBatchPayment(row) {
+  const rows = row == null ? selections.value : [row];
+  console.log(row, rows, 'xxxx');
+  if (!rows.length) {
+    EleMessage.error('请至少选择一条数据');
+    return;
   }
-
-  defineExpose({
-    selections,
-    reload,
-    exportData,
-    operatBatch,
-    handleFirstCheck,
-    handleConfirmReceipt,
-    handleCancelOrder,
-    handleBatchPayment
+  messageBoxConfirm({
+    message: '确认支付书款?',
+    fetch: () =>
+      proxy.$http.post('/order/orderInfo/payout', {
+        orderIds: rows.map((item) => item.orderId)
+      })
+  });
+}
+
+//回退状态
+function fallbackOrder(row) {
+  messageBoxConfirm({
+    message: '确认回退?',
+    fetch: () =>
+      proxy.$http.post(`/order/orderInfo/statusBack/${row.orderId}`)
   });
+}
+//审核截图
+const auditScreenshotRef = ref(null);
+function handleAuditScreenshot(row) {
+  auditScreenshotRef.value?.handleOpen(row);
+}
+
+//申请恢复订单
+const applyOrderRestoreRef = ref(null);
+function handleApplyForOrderRestore(row) {
+  applyOrderRestoreRef.value?.handleOpen(row);
+}
+
+defineExpose({
+  selections,
+  reload,
+  exportData,
+  operatBatch,
+  handleFirstCheck,
+  handleConfirmReceipt,
+  handleCancelOrder,
+  handleBatchPayment
+});
 </script>