fix: 处理方案新增险种、驾意险的数据交互

src/api/modules/project.ts

@@ -12,7 +12,9 @@ export interface GetSchemeList {
 const projectApi = (axiosInstance: ApiInstance) => ({
   getBusinessInsurance: () => axiosInstance.get('/scheme/getBusinessInsurance'),
   getScheme: () => axiosInstance.get('/scheme/getScheme'),
-  getSchemeList: (data: GetSchemeList) => axiosInstance.post('/scheme/getSchemeList', data)
+  getSchemeList: (data: GetSchemeList) => axiosInstance.post('/scheme/getSchemeList', data), // 险种
+  jyxList: (data: { company: string }) => axiosInstance.post('/jyxConfig/jyxList', data), // 驾意险
+  saveScheme: (data: any) => axiosInstance.post('/scheme/saveScheme', data), // 保存方案
 })
 
 export default projectApi

src/layouts/components/DrivingType/index.vue

@@ -0,0 +1,143 @@
+<template>
+  <div style="height: 400px">
+    <el-row :gutter="20" style="height: calc(100% - 30px); border: 1px solid #ccc; margin: 5px; border-radius: 5px; padding: 5px">
+      <el-col :span="12">
+        <el-input v-model="searchName" placeholder="输入驾意险名称查找" style="margin-bottom: 10px">
+          <template #append>
+            <el-button type="primary" @click="handleSearchName">查找</el-button>
+          </template>
+        </el-input>
+<!--        <el-checkbox-group v-model="item.drivingIntentionId">
+          <el-checkbox style="display: block;" v-for="JYX in JYXList" :key="JYX.id" :value="JYX.id" :label="JYX.productName"></el-checkbox>
+        </el-checkbox-group>-->
+        <div class="insuranceLeft">
+          <div class="insuranceItem" v-for="(item, index) in JYXList" @click="handleType(item, index)">
+          <span class="checkIcon" :class="{ 'active': item.checked }">
+            <el-icon><Select /></el-icon>
+          </span>
+            <span>{{ item.productName }}</span>
+          </div>
+        </div>
+      </el-col>
+      <el-divider direction="vertical" style="height: 100%;"></el-divider>
+      <el-col :span="11">
+        <div style="display: flex; align-items: center; justify-content: space-between; margin: 8px 0">
+          <span>已选： {{ selectedList.length }}份驾意险</span>
+          <el-button link type="primary">清空</el-button>
+        </div>
+        <div class="selectedList">
+          <div style="display: flex; align-items: center; justify-content: space-between; margin: 10px" v-for="JYX in selectedList" :key="JYX.id">
+            <span>{{ JYX.productName }}</span>
+            <el-icon><Close /></el-icon>
+          </div>
+        </div>
+      </el-col>
+    </el-row>
+    <div class="footer">
+      <el-button plain @click="handleCancel">取消</el-button>
+      <el-button type="primary" @click="handleConfirm">保存</el-button>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+
+const emits = defineEmits(['close'])
+
+// 查找
+import api from "@/api";
+import {ElMessage} from "element-plus";
+
+let searchName = ref('')
+const handleSearchName = () => {
+
+}
+
+// 驾意险
+let JYXList = ref([])
+const initJYX = () => {
+  api.projectApi.jyxList({
+    company: '173881173559933834'
+  }).then(res => {
+    if(res.code == 200) {
+      if(res.data && res.data.len > 0) {
+        res.data.forEach(item => {
+          item.checked = false
+        })
+      }
+      JYXList.value = res.data
+    } else {
+      ElMessage({
+        message: res.msg,
+        type: 'warning'
+      })
+    }
+  })
+}
+
+// 选择驾意险
+let selectedList = ref([])
+const handleType = (item, index) => {
+  item.checked = !item.checked
+  selectedList.value = []
+  JYXList.value.forEach(sub => {
+    if(sub.checked) {
+      selectedList.value.push(sub)
+    }
+  })
+}
+
+// 取消
+const handleCancel = () => {
+  emits('close', [])
+}
+// 保存
+const handleConfirm = () => {
+  emits('close', selectedList.value)
+}
+
+onMounted(() => {
+  initJYX()
+})
+
+</script>
+
+<style scoped lang="scss">
+.insuranceLeft{
+  height: 100%;
+  overflow-y: auto;
+}
+.insuranceLeft{
+  width: calc(100% - 110px);
+  .insuranceItem{
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    margin: 10px 0;
+    span{
+      margin-left: 10px;
+    }
+    .checkIcon{
+      width: 14px;
+      height: 14px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      border: 1px solid #ccc;
+      border-radius: 2px;
+      font-size: 10px;
+      color: #fff;
+    }
+    .active{
+      color: #fff;
+      background: #3994FB;
+      border-color: #3994FB;
+    }
+  }
+}
+.footer{
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+</style>

src/layouts/components/InsuranceType/index.vue

@@ -68,8 +68,8 @@ const initInsurance = () => {
             sub.checked = false
           })
         })
-        insuranceTypeList.value = res.data
-        typeList.value = res.data
+        insuranceTypeList.value = JSON.parse(JSON.stringify(res.data))
+        typeList.value = JSON.parse(JSON.stringify(res.data))
       }
     } else {
       ElMessage({
@@ -105,16 +105,19 @@ const handleConfirm = () => {
 
 // 修改数据
 const initEditData = (data) => {
-  console.log(123, data)
-  nextTick(() => {
-    console.log(456, typeList.value)
-    const result = typeList.value.map(item1 => {
-      const item2 = data.find(item => item.id === item1.id);
-      return item2 || item1; // 如果找到匹配项则替换，否则保留原值
-    });
-    insuranceTypeList.value = [...result]
-    console.log(789, insuranceTypeList.value)
-  })
+  console.log('已选中的数据', data)
+  console.log(111, typeList.value)
+  insuranceTypeList.value = [...typeList.value]
+  console.log(222, insuranceTypeList.value)
+  // const result = insuranceTypeList.value.map(item1 => {
+  //   const item2 = data.find(item => item.id === item1.id);
+  //   return item2 || item1; // 如果找到匹配项则替换，否则保留原值
+  // });
+  const result = typeList.value.filter(item1 =>
+    !data.some(item2 => item1.id === item2.id)
+  );
+  console.log(333, insuranceTypeList.value)
+  insuranceTypeList.value = [...data, ...result]
 }
 
 onMounted(() => {

src/router/modules/quoteConfig.ts

@@ -39,16 +39,16 @@ const routes: RouteRecordRaw = {
             activeMenu: '/quoteConfig/agreement/agreementIndex',
           },
         },
-        {
-          path: 'agreementDetails',
-          name: 'AgreementDetails',
-          component: () => import('@/views/quoteConfig/agreement/agreementDetails.vue'),
-          meta: {
-            title: '协议详情',
-            menu:false,
-            activeMenu: '/quoteConfig/agreement/agreementIndex',
-          },
-        },
+        // {
+        //   path: 'agreementDetails',
+        //   name: 'AgreementDetails',
+        //   component: () => import('@/views/quoteConfig/agreement/agreementDetails.vue'),
+        //   meta: {
+        //     title: '协议详情',
+        //     menu:false,
+        //     activeMenu: '/quoteConfig/agreement/agreementIndex',
+        //   },
+        // },
       ]
     },
     {

src/views/quoteConfig/project/modules/projectAdd.vue

@@ -16,7 +16,7 @@
           </el-form-item>
           <el-form-item label="险种类型" prop="productId">
             <el-radio-group v-model="projectAddFrom.productId">
-              <el-radio-button v-for="item in insuranceType" :key="item.id" :value="item.id">{{ item.label }}</el-radio-button>
+              <el-radio-button v-for="item in insuranceType" :key="item.value" :value="item.value">{{ item.label }}</el-radio-button>
             </el-radio-group>
           </el-form-item>
           <div style="display: flex;">
@@ -53,31 +53,40 @@
                 <div>
                   <div style="display: flex; align-items: center; margin-bottom: 10px">
                     <span style="margin-right: 20px">驾意险</span>
-                    <el-button link icon="plus" type="primary">选择驾意险</el-button>
+                    <el-button link icon="plus" type="primary" @click="handleDriving(item, index)">选择驾意险</el-button>
+                    <el-dialog
+                      v-model="drivingShow"
+                      title="选择驾意险"
+                      width="700"
+                    >
+                      <driving @close="handleDrivingClose(item, $event)"></driving>
+                    </el-dialog>
                   </div>
                   <el-table
-                    :data="projectAddFrom.A"
+                    :data="item.drivingList"
                   >
-                    <el-table-column label="名称" prop="a">
+                    <el-table-column label="名称" prop="productName">
                       <template #default="scope">
-                        <a>名称名称</a>
+                        <a>{{ scope.row.productName }}</a>
                       </template>
                     </el-table-column>
                     <el-table-column label="客户端状态" prop="f">
                       <template #default="scope">
-                        <el-select v-model="projectAddFrom.f">
+                        <el-select v-model="scope.row.selectedStatus">
                           <el-option label="默认不选中" key="1" value="1"></el-option>
                           <el-option label="默认选中" key="2" value="2"></el-option>
                           <el-option label="强制选中" key="3" value="3"></el-option>
                         </el-select>
                       </template>
                     </el-table-column>
-                    <el-table-column label="份数" prop="g">
-                      <el-input v-model="projectAddFrom.g"></el-input>份
+                    <el-table-column label="份数" prop="quantity">
+                      <template #default="scope">
+                        <el-input v-model="scope.row.quantity" style="width: 100px;"></el-input>份
+                      </template>
                     </el-table-column>
                     <el-table-column label="操作">
                       <template #default="scope">
-                        <el-button link>删除</el-button>
+                        <el-button link type="primary" @click="drivingTypeDel(item, scope.row)">删除</el-button>
                       </template>
                     </el-table-column>
                   </el-table>
@@ -140,18 +149,19 @@
 import api from "@/api";
 import { ElMessage } from "element-plus";
 import insurance from '../../../../layouts/components/InsuranceType/index.vue'
+import driving from '../../../../layouts/components/DrivingType/index.vue'
 
 const InsuranceTypeRef = ref(null)
 
 let projectAddFrom = ref({
-  rulesList: [{
-
-  }],
+  rulesList: [],
   schemeList: [{
     schemeName: '',
     description: '',
     tableData: [],
-    schemeInsuranceList: []
+    drivingList: [],
+    schemeInsuranceList: [],
+    drivingIntentionList: []
   }]
 })
 let projectAddRules = ref({
@@ -184,7 +194,9 @@ const addProject = () => {
     schemeName: '',
     description: '',
     tableData: [],
-    schemeInsuranceList: []
+    drivingList: [],
+    schemeInsuranceList: [],
+    drivingIntentionList: []
   })
 }
 
@@ -226,6 +238,27 @@ const insuranceTypeDel = (item, row) => {
   item.tableData = [...data]
 }
 
+// 驾意险
+let drivingShow = ref(false)
+const handleDriving = (item, index) => {
+  drivingShow.value = true
+}
+const handleDrivingClose = (item, list ) => {
+  if(list && list.length > 0) {
+    list.forEach(sub => {
+      sub.drivingIntentionId = sub.id
+      sub.selectedStatus = '1'
+      sub.quantity = '1'
+    })
+  }
+  item.drivingList = list
+  drivingShow.value = false
+}
+const drivingTypeDel = (item, row) => {
+  let data = item.drivingList.filter(a => a.id != row.id)
+  item.drivingList = [...data]
+}
+
 const handlePopover = (item, index) => {
   insuranceShow.value = true
   nextTick(() => {
@@ -239,7 +272,35 @@ const quit = () => {
 }
 // 保存
 const save = () => {
-  console.log(123, projectAddFrom.value)
+  let formData = {...projectAddFrom.value}
+  formData.schemeList.forEach(item => {
+    item.drivingList.forEach(sub => {
+      let obj = {
+        drivingIntentionId: sub.id,
+        selectedStatus: sub.selectedStatus,
+        quantity: sub.quantity
+      }
+      item.drivingIntentionList.push(obj)
+    })
+    item.tableData.forEach(ins => {
+      let obj = {
+        insuranceId: ins.id,
+        optionId: ins.options.find(a => a.checked)?.value
+      }
+      item.schemeInsuranceList.push(obj)
+    })
+  })
+  console.log(123, formData)
+  api.projectApi.saveScheme({...formData}).then(res => {
+    if(res.code == 200) {
+
+    } else {
+      ElMessage({
+        message: res.msg,
+        type: 'warning'
+      })
+    }
+  })
 }
 
 onMounted(() => {