订单管理数据导出

src/api/modules/insurancePolicy.ts

@@ -38,6 +38,8 @@ const insurancePolicyApi = (axiosInstance: ApiInstance) => ({
   addNewCar: (data: any) => axiosInstance.post('newCarJudgeRules/addNewCar', data), // 新增
   updateNewCar: (data: any) => axiosInstance.post('newCarJudgeRules/updateNewCar', data), // 编辑
   delNewCar: (data: any) => axiosInstance.post('newCarJudgeRules/delNewCar', data), // 删除
+  // 导出订单
+  exportDynamicFields: (data: any) => axiosInstance.post('supplementOrder/exportDynamicFields', data), // 导出订单
 })
 
 export default insurancePolicyApi

src/views/insurancePolicy/order.vue

@@ -14,7 +14,7 @@
               end-placeholder="结束时间" value-format="YYYY-MM-DD HH:mm:ss" />
           </el-form-item>
           <el-form-item label="订单状态">
-            <el-select v-model="orderForm.adjustStatus" placeholder="请选择" clearable >
+            <el-select v-model="orderForm.adjustStatus" placeholder="请选择" clearable>
               <el-option v-for="item in orderStatusList" :key="item.value" :value="item.value"
                 :label="item.label"></el-option>
             </el-select>
@@ -38,7 +38,7 @@
           </el-form-item>
           <el-form-item label="出单机构" v-show="!fold">
             <el-cascader clearable filterable style="width: 100%" v-model="orderForm.deptId" :options="institutionList"
-              :props="tableProps" @change="handleInstitutionChange" ></el-cascader>
+              :props="tableProps" @change="handleInstitutionChange"></el-cascader>
           </el-form-item>
           <el-form-item label="业务员" v-show="!fold">
             <el-input placeholder="输入业务员查找" v-model="orderForm.recorder" clearable></el-input>
@@ -53,16 +53,18 @@
             </el-select>
           </el-form-item>
           <el-form-item label="签单时间" v-show="!fold">
-            <el-date-picker clearable v-model="signingTime" type="datetimerange" range-separator="至" start-placeholder="开始时间"
-              end-placeholder="结束时间" value-format="YYYY-MM-DD HH:mm:ss" />
+            <el-date-picker clearable v-model="signingTime" type="datetimerange" range-separator="至"
+              start-placeholder="开始时间" end-placeholder="结束时间" value-format="YYYY-MM-DD HH:mm:ss" />
           </el-form-item>
           <el-form-item label="支付时间" v-show="!fold">
-            <el-date-picker clearable v-model="payTime" type="datetimerange" range-separator="至" start-placeholder="开始时间"
-              end-placeholder="结束时间" value-format="YYYY-MM-DD HH:mm:ss" />
+            <el-date-picker clearable v-model="payTime" type="datetimerange" range-separator="至"
+              start-placeholder="开始时间" end-placeholder="结束时间" value-format="YYYY-MM-DD HH:mm:ss" />
           </el-form-item>
           <el-form-item>
             <el-button plain @click="handleCancel">重置</el-button>
             <el-button type="primary" @click="handleSearch">查询</el-button>
+            <el-button plain @click="isExportShow = true">导出</el-button>
+
             <el-button type="primary" link @click="toggle">
               {{ fold ? '展开' : '收起' }}
               <el-icon v-if="fold"><caret-bottom /></el-icon>
@@ -175,6 +177,38 @@
       </template>
     </el-dialog>
     <!-- 批改 -->
+    <!-- 订单导出 -->
+    <el-dialog v-model="isExportShow" width="50%" title="选择导出的字段">
+      <div class="flex">
+        <div class="enumValues flex f-c">
+          <h4 class="title">基础字段</h4>
+          <el-checkbox-group v-model="checkList" class="checkbox">
+            <el-checkbox v-for="field in basicFields" :key="field.value" :label="field.label" :value="field.value" />
+          </el-checkbox-group>
+          <h4 class="title">其他字段</h4>
+          <el-checkbox-group v-model="checkList" class="checkbox">
+            <el-checkbox v-for="field in otherFields" :key="field.value" :label="field.label" :value="field.value" />
+          </el-checkbox-group>
+        </div>
+        <div class="selected flex f-c ">
+          <div class="flex j-s">
+            <span>已选字段</span>
+            <el-button link type="primary" @click="checkList = []">清空</el-button>
+          </div>
+          <div style="height: 420px; overflow: auto;">
+            <div class="item flex j-s" v-for="item in checkList" :key="item">
+              <span>{{ fieldMap[item] }}</span>
+              <el-icon :size="14" :color="'#666'" @click="checkList = checkList.filter(i => i !== item)">
+                <CloseBold />
+              </el-icon>
+            </div>
+          </div>
+        </div>
+      </div>
+      <template #footer>
+        <el-button type="primary" @click="exportOrder">确定</el-button>
+      </template>
+    </el-dialog>
     <DialogInsuranceEdit v-model="isEditVisible" :data="formData" />
     <DialogInsuranceCancel v-model="isCancelVisible" :data="formData" />
   </div>
@@ -193,10 +227,55 @@ const loading = ref(false)
 const formData = ref({})
 const isEditVisible = ref(false)
 const isCancelVisible = ref(false)
+const isExportShow = ref(false)//导出弹窗
 const signingTime = ref([]) //核保时间
 const payTime = ref([]) //支付时间
 const range = ref([])//报价时间
 const institutionList = ref([])  // 机构列表数据
+// 定义所有字段，按类别组织
+const allFields = {
+  basic: [
+    { label: "订单号", value: "orderNo" },
+    { label: "车牌号", value: "licenseNo" },
+    { label: "车架号", value: "vinNo" },
+    { label: "状态", value: "orderStatus" },
+    { label: "报价时间", value: "createTime" },
+    { label: "报价险种", value: "productName" },
+    { label: "保费总计", value: "sumPremium" },
+    { label: "业务员类型", value: "salesmanType" },
+    { label: "业务员信息", value: "salesmanInfo" },
+    { label: "出单机构", value: "deptName" },
+    { label: "录单人", value: "recorder" },
+    { label: "签单时间", value: "signingTime" },
+    { label: "支付时间", value: "payTime" }
+  ],
+  other: [
+    { label: "交强险保费", value: "ciPremium" },
+    { label: "商业险保费", value: "biPremium" },
+    { label: "驾意险保费", value: "niPremium" },
+    { label: "交强险起保时间", value: "ciStartDate" },
+    { label: "商业险起保时间", value: "biStartDate" },
+    { label: "报价协议", value: "agreementName" },
+    { label: "车主姓名", value: "ownerName" },
+    { label: "车主手机号", value: "ownerMobile" },
+    { label: "投保人姓名", value: "policyName" },
+    { label: "投保人手机号", value: "policyMobile" },
+    { label: "被保人姓名", value: "insurName" },
+    { label: "被保人手机号", value: "insurMobile" }
+  ]
+};
+
+// 创建反向映射
+const fieldMap = Object.fromEntries(
+  [...allFields.basic, ...allFields.other].map(item => [item.value, item.label])
+);
+
+// 然后可以通过解构获取需要的数组
+const basicFields = allFields.basic;
+const otherFields = allFields.other;
+
+const checkList = ref([
+  'orderNo', 'licenseNo', 'vinNo', 'orderStatus', 'createTime', 'productName', 'sumPremium', 'salesmanType', 'salesmanInfo', 'deptName', 'signingTime', 'payTime', 'ciPremium', 'biPremium', 'niPremium', 'agreementName'])
 const tableProps = ref({
   value: "id",            // 选项值字段
   label: "name",          // 选项标签字段
@@ -369,13 +448,47 @@ const initData = () => {
     loading.value = false;
   });
 }
-
-const handleSearch = () => {
-  pages.value = 1
-  size.value = 10
-  initData()
+// 导出订单
+const exportOrder = () => {
+  if (checkList.value.length == 0) {
+    ElMessage({
+      message: '请选择导出字段',
+      type: 'warning'
+    })
+    return
+  }
+  let exportDynamicFields = checkList.value.join(';')
+  api.insurancePolicyApi.exportDynamicFields({
+    pages: pages.value,
+    size: size.value,
+    ...orderForm.value,
+    startDate: range.value?.[0],
+    endDate: range.value?.[1],
+    startSigningTime: signingTime.value?.[0],//开始核保时间
+    endSigningTime: signingTime.value?.[1],//结束核保时间
+    startPayTime: payTime.value?.[0],//开始支付时间
+    endPayTime: payTime.value?.[1],//结束支付时间
+    exportDynamicFields: exportDynamicFields,
+  }).then((res: any) => {
+    if (res.code == 200) {
+      isExportShow.value = false
+      const link = document.createElement('a');
+      link.href = res.msg;
+      link.target = '_blank';
+      link.download = '';
+      // 触发下载
+      document.body.appendChild(link);
+      link.click();
+      document.body.removeChild(link);
+    } else {
+      ElMessage({
+        message: res.msg,
+        type: 'warning'
+      })
+    }
+  })
 }
-const handleCancel = () => {
+const handleSearch = () => {
   pages.value = 1
   size.value = 10
   orderForm.value = { ...initialForm }
@@ -537,4 +650,30 @@ const openDetail = (e: any) => {
   height: 500px;
   overflow: auto;
 }
+
+.enumValues {
+  flex: 1;
+  min-width: 0;
+
+  .title {
+    color: #333;
+  }
+
+}
+
+.selected {
+  width: 280px;
+  padding-left: 20px;
+  border-left: 1px dashed #DCE0E4;
+
+  .item {
+    margin: 10px;
+    cursor: pointer;
+  }
+}
+
+.checkbox {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+}
 </style>