tenant-Platform/src/views/quoteConfig/project/modules/projectAdd.vue

<template>
  <!-- 项目添加/编辑页面主容器 -->
  <div class="projectAdd">
    <!-- 项目表单，包含基本信息和方案配置 -->
    <el-form :model="projectAddFrom" :rules="projectAddRules" ref="ProjectAddRef">
      <!-- 基本信息描述 -->
      <el-descriptions title="基本信息">
        <el-descriptions-item>
          <!-- 保险公司选择 -->
          <el-form-item label="保险公司" prop="companyId">
            <el-select
              :disabled="isEdit"
              filterable
              v-model="projectAddFrom.companyId"
              placeholder="请选择"
              style="width: 40%"
              @change="initProduct"
            >
              <el-option v-for="item in companyOption" :key="item.id" :value="item.id" :label="item.nameSimple"></el-option>
            </el-select>
          </el-form-item>

          <!-- 方案类型选择 -->
          <el-form-item label="方案类型" prop="schemeType">
            <el-radio-group
              :disabled="isEdit"
              v-model="projectAddFrom.schemeType"
              @change="schemeTypeChange"
            >
              <el-radio :value="1">基础方案</el-radio>
              <el-radio :value="2">自选方案</el-radio>
            </el-radio-group>
          </el-form-item>

          <!-- 险种类型选择 -->
          <el-form-item label="险种类型" prop="productId">
            <el-radio-group
              :disabled="isEdit"
              v-model="projectAddFrom.productId"
              @change="initProduct"
            >
              <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;">
            <span style="width: 10%"><a style="color: red">*</a>规则条件</span>
            <div style="width: 60%">
              <!-- 规则条件容器组件 -->
              <rule-condition-container :rulesAttrList="rulesAttrList" @Del="handleDel"></rule-condition-container>
            </div>
          </div>

          <!-- 添加规则条件按钮 -->
          <el-button style="margin: 10px 10%" plain type="primary" icon="plus" @click="addRules">添加条件</el-button>

          <!-- 方案配置描述 -->
          <el-descriptions>
            <template #title>
              <div style="display: flex; align-items: center">
                <span>方案配置</span>
                <!-- 添加新方案按钮（非编辑模式） -->
                <el-button v-show="!isEdit" type="primary" icon="plus" style="margin-left: 20px;" @click="addProject">添加新方案</el-button>
              </div>
            </template>
            <el-descriptions-item>
              <!-- 方案列表 -->
              <div class="configuration" v-for="(item, index) in projectAddFrom.schemeList">
                <!-- 方案名称 -->
                <el-form-item label="方案名称" prop="schemeName">
                  <el-input v-model="item.schemeName"></el-input>
                </el-form-item>

                <!-- 方案描述 -->
                <el-form-item label="方案描述" prop="description">
                  <el-input type="textarea" v-model="item.description" maxlength="500"></el-input>
                </el-form-item>

                <!-- 驾意险配置 -->
                <div>
                  <div style="display: flex; align-items: center; margin-bottom: 10px">
                    <span style="margin-right: 20px">驾意险</span>
                    <el-button link icon="plus" type="primary" @click="handleDriving(item, index)">选择驾意险</el-button>
                  </div>
                  <!-- 驾意险列表 -->
                  <el-table :data="item.drivingList">
                    <el-table-column label="名称" prop="productName">
                      <template #default="scope">
                        <el-button link type="primary" @click="getJYXDetail(scope.row)">{{ scope.row.productName }}</el-button>
                      </template>
                    </el-table-column>
                    <!-- 客户端状态（仅自选方案显示） -->
                    <el-table-column label="客户端状态" prop="selectedStatus" v-if="projectAddFrom.schemeType!=1">
                      <template #default="scope">
                        <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="quantity">
                      <template #default="scope">
                        <el-input-number
                          v-model="scope.row.quantity"
                          style="width: 150px;"
                          :min="1"
                          :max="99"
                          @change="numberChange($event, scope.row)"
                        ></el-input-number>份
                      </template>
                    </el-table-column>
                    <!-- 驾意险操作 -->
                    <el-table-column label="操作">
                      <template #default="scope">
                        <el-button link type="primary" @click="drivingTypeDel(item, scope.row)">删除</el-button>
                      </template>
                    </el-table-column>
                  </el-table>
                </div>

                <!-- 险种配置 -->
                <div>
                  <div style="display: flex; align-items: center; margin: 10px 0">
                    <span style="margin-right: 20px">险种</span>
                    <el-button link icon="plus" type="primary" @click="handlePopover(item, index)">选择险种</el-button>
                  </div>
                  <!-- 险种列表 -->
                  <el-table :data="item.tableData">
                    <el-table-column label="险种" prop="kindName">
                      <template #default="scope">
                        <a>{{ scope.row.kindName }}</a>
                      </template>
                    </el-table-column>
                    <!-- 保额选择 -->
                    <el-table-column label="保额" prop="optionId">
                      <template #default="scope">
                        <!-- 自选方案支持多选保额 -->
                        <el-select
                          :disabled="scope.row.insuranceId == '19'"
                          v-if="projectAddFrom.schemeType === 2"
                          v-model="scope.row.moneyId"
                          style="width: 150px"
                          multiple
                          @change="() => { scope.row.optionId = scope.row.moneyId }"
                        >
                          <el-option v-for="m in scope.row.options" :label="m.label" :key="m.id" :value="m.id"></el-option>
                        </el-select>
                        <!-- 基础方案只能选择一个保额 -->
                        <el-select
                          :disabled="scope.row.insuranceId == '19'"
                          v-else
                          v-model="scope.row.moneyId"
                          style="width: 150px"
                          @change="() => { scope.row.optionId = scope.row.moneyId }"
                        >
                          <el-option v-for="m in scope.row.options" :label="m.label" :key="m.id" :value="m.id"></el-option>
                        </el-select>
                      </template>
                    </el-table-column>
                    <!-- 险种操作 -->
                    <el-table-column label="操作">
                      <template #default="scope">
                        <!-- 交强险不可删除 -->
                        <el-button
                          :disabled="projectAddFrom.productId == '0330'&&scope.row.id=='19' || projectAddFrom.productId == '0330034002'&&scope.row.id=='19' || projectAddFrom.productId == '0330034001'&&scope.row.id=='19'"
                          link
                          type="primary"
                          @click="insuranceTypeDel(item, scope.row)"
                        >删除</el-button>
                      </template>
                    </el-table-column>
                  </el-table>
                </div>
              </div>
            </el-descriptions-item>
          </el-descriptions>
        </el-descriptions-item>
      </el-descriptions>
    </el-form>

    <!-- 底部操作按钮 -->
    <div class="btns">
      <el-button plain @click="quit">取消</el-button>
      <el-button type="primary" @click="save(ProjectAddRef)">保存</el-button>
    </div>

    <!-- 驾意险选择弹窗 -->
    <el-dialog v-model="drivingShow" title="选择驾意险" width="700">
      <driving ref="DrivingTypeRef" @close="handleDrivingClose"></driving>
    </el-dialog>

    <!-- 险种选择弹窗 -->
    <el-dialog v-model="insuranceShow" title="选择险种" width="500">
      <insurance ref="InsuranceTypeRef" @close="handleClose"></insurance>
    </el-dialog>

    <!-- 驾意险详情弹窗 -->
    <el-dialog v-model="JYXDetailShow" title="驾意险详情" width="600">
      <detail ref="JYXDetail"></detail>
    </el-dialog>

    <!-- 规则条件选择弹窗 -->
    <el-dialog v-model="ruleSelectShow" title="规则条件" width="600">
      <ruleSelect ref="RuleSelect" @close="handleRuleSelectClose"></ruleSelect>
    </el-dialog>
  </div>
</template>

<script setup lang="ts">

// 导入API模块
import api from "@/api";
// 导入Element Plus组件和类型
import { ElMessage, FormInstance, FormRules } from "element-plus";
// 导入Vue Router
import { useRouter, useRoute } from 'vue-router'
// 导入自定义组件
import insurance from '../../../../layouts/components/InsuranceType/index.vue'
import driving from '../../../../layouts/components/DrivingType/index.vue'
import rule from '../../../../components/ruleConditionContainer/index.vue'
import detail from '../../../../layouts/components/JYXDetail/index.vue'
import ruleSelect from '../../../../layouts/components/ruleSelect/index.vue'
import Detail from "@/views/representative/detail.vue";
// 导入Vue 3组合式API
import { ref, onMounted, onBeforeMount, nextTick } from 'vue'

// 路由实例
const myRouter = useRouter()
const myRoute = useRoute()

// 表单引用
const ProjectAddRef = ref<FormInstance>()
// 组件引用
const InsuranceTypeRef = ref(null)
const DrivingTypeRef = ref(null)
const JYXDetail = ref(null)
const RuleSelect = ref()

// 车牌地区数据
const licensePlateRegion = ref();
// 车牌号数据
const licensePlateNumber = ref();

/**
 * 获取车牌地区数据
 * @param value 地区代码
 */
const regionLicenseRegion = (value: string) => {
    api.agreementApi.getAreaLicense(value).then((res: any) => {
        if (res.code == '200') {
            let data: any = [];
            res.data.map((val: any) => {
                data.push({
                    code: val.areaNumber,
                    name: val.license,
                })
                return val;
            })
            licensePlateRegion.value = data;
        }
    });
}

/**
 * 获取车牌号数据
 * @param value 地区代码
 */
const regionLicenseNumber = (value: string) => {
    api.agreementApi.getAreaLicense(value).then((res: any) => {
        if (res.code == '200') {
            let data: any = [];
            res.data.map((val: any) => {
                data.push({
                    code: val.areaNumber,
                    name: val.license,
                })
                return val;
            })
            licensePlateNumber.value = data;
        }
    });
}

// 规则条件选择弹窗状态
let ruleSelectShow = ref(false)

/**
 * 处理规则条件选择关闭
 * @param data 选中的规则条件数据
 */
const handleRuleSelectClose = (data) => {
    if(data && data.length > 0) {
        rulesAttrList.value = data.map(a => {
            // 处理车牌相关数据
            if (a.attrCode == 'LicenseNo') {
                a.dictLabal = licensePlateNumber.value;
            }
            if (a.attrCode == 'LicenseArea') {
                a.dictLabal = licensePlateRegion.value;
            }
            return {
                ...a,
                min: a.attrName == '能源类型'? '0':a.min?a.min: '',
                minArray: a.minArray&&a.minArray.length>0?a.minArray:a.attrName == '使用性质' || a.attrName == '车辆种类' || a.attrName == '能源类型'?[a.dictLabal[0].code]:[],
                max: a.max?a.max: ''
            }
        })
    }
    ruleSelectShow.value = false
}

// 是否编辑模式
let isEdit = ref(false)

// 项目表单数据
let projectAddFrom = ref({
  ruleAttrs: [], // 规则属性
  schemeType: 1, // 方案类型：1-基础方案，2-自选方案
  productId: '0330', // 险种类型
  schemeList: [{
    schemeName: '', // 方案名称
    description: '', // 方案描述
    tableData: [], // 险种列表
    drivingList: [], // 驾意险列表
    schemeInsuranceList: [], // 方案险种列表
    drivingIntentionList: [] // 驾意险意向列表
  }]
})

// 表单验证规则
let projectAddRules = ref<FormRules>({
  companyId: [
    { required: true, trigger: "change", message: "请选择保险公司" }
  ],
  schemeType: [
    { required: true, trigger: "change", message: "请选择方案类型" }
  ],
  productId: [
    { required: true, trigger: "change", message: "请选择险种类型" }
  ]
})

// 驾意险详情弹窗状态
let JYXDetailShow = ref(false)

/**
 * 查看驾意险详情
 * @param row 驾意险数据行
 */
const getJYXDetail = (row) => {
  JYXDetailShow.value = true
  nextTick(() => {
    JYXDetail.value.initData(row.drivingIntentionId)
  })
}

/**
 * 处理驾意险份数变化
 * @param e 新的份数值
 * @param row 驾意险数据行
 */
const numberChange = (e, row) => {
  if(typeof e != 'number') {
    row.quantity = 1
  }
}

/**
 * 初始化产品方案
 * @param e 产品ID
 */
const initProduct = (e) => {
    // 获取规则条件中的能源类型、车辆种类、使用性质
    let energyType = null, vehicleType = null, carnature = null
    if(rulesAttrList.value && rulesAttrList.value.length > 0) {
        energyType = rulesAttrList.value.find(a => a.attrName === '能源类型')
        vehicleType = rulesAttrList.value.find(a => a.attrName === '车辆种类')
        carnature = rulesAttrList.value.find(a => a.attrName === '使用性质')
    }

    // 根据产品类型初始化默认险种
    if(e == '0330' || e == '0330034001') {
        // 交强险
        let obj = insuranceTypeList.value.filter(item => item.id == '19')
        if(obj) {
            obj.forEach(item => {
                item.insuranceId = item.id
                if(item.id == '19') {
                    item.moneyId = item.options[0].id
                }
            })
            projectAddFrom.value.schemeList.forEach(item => {
                item.schemeName = ''
                item.description = ''
                item.drivingList = []
                item.tableData = [...obj]
            })
        }
    } else if(e == '034002') {
      // 商业险
      let obj = insuranceTypeList.value.find(item => item.id == '2')
      obj.insuranceId = obj.id
      projectAddFrom.value.schemeList.forEach(item => {
        item.schemeName = ''
        item.description = ''
        item.drivingList = []
        item.tableData = [obj]
      })
    } else if(e == '0330034002') {
      // 交强险+商业险
      let obj = insuranceTypeList.value.filter(item => item.id == '2' || item.id == '19')
      if(obj) {
        obj.forEach(item => {
          item.insuranceId = item.id
          if(item.id == '19') {
            item.moneyId = item.options[0].id
          }
        })
        projectAddFrom.value.schemeList.forEach(item => {
          item.schemeName = ''
          item.description = ''
          item.drivingList = []
          item.tableData = [...obj]
        })
      }
    } else {
      // 其他产品类型
      projectAddFrom.value.schemeList.forEach(item => {
        item.schemeName = ''
        item.description = ''
        item.drivingList = []
        item.tableData = []
      })
    }

    // 获取保险公司的方案配置
    if(projectAddFrom.value.companyId && projectAddFrom.value.productId && projectAddFrom.value.schemeType) {
      api.projectApi.getSchemeByCompany({
        companyId: projectAddFrom.value.companyId,
        productId: projectAddFrom.value.productId,
        schemeType: projectAddFrom.value.schemeType,
        energyType: energyType?.min,
        vehicleType: vehicleType?.minArray?.join(','),
        carnature: carnature?.minArray?.join(','),
      }).then(res => {
        if(res.code == 200) {
          if(res.data && res.data.schemeList.length > 0) {
            res.data.schemeList.forEach(item => {
              // 处理驾意险数据
              item.drivingList = item.drivingIntentionList
              // 处理险种数据
              item.tableData = item.schemeInsuranceList.map(sub => {
                let obj = insuranceTypeList.value.find(a => a.id === sub.insuranceId)
                return {
                  ...sub,
                  optionId: res.data.schemeType===1?`${sub.optionId[0]}`:sub.optionId,
                  moneyId: res.data.schemeType===1?`${sub.optionId[0]}`:sub.optionId,
                  options: obj?.options
                }
              })
            })
            projectAddFrom.value = res.data
            // 处理规则条件数据
            rulesAttrList.value = res.data.ruleAttrs.map(val => {
                if (val.attrCode == 'LicenseNo') {
                    val.dictLabal = licensePlateNumber.value;
                }
                if (val.attrCode == 'LicenseArea') {
                    val.dictLabal = licensePlateRegion.value;
                }
                return val
            })
          }
        }
      })
    }
}

// 险种列表
let insuranceTypeList = ref([])

/**
 * 初始化险种数据
 */
const initInsurance = () => {
  api.projectApi.getBusinessInsurance(projectAddFrom.value.productId || '0330').then(res => {
    if(res.code == 200) {
      insuranceTypeList.value = res.data

      // 根据产品类型初始化默认险种
      if(projectAddFrom.value.productId == '0330' || projectAddFrom.value.productId == '0330034001') {
          let obj = insuranceTypeList.value.filter(item => item.id == '19')
          if(obj) {
              obj.forEach(item => {
                  item.insuranceId = item.id
                  if(item.id == '19') {
                      item.moneyId = item.options[0].id
                  }
              })
              projectAddFrom.value.schemeList.forEach(item => {
                  item.drivingList = []
                  item.tableData = [...obj]
              })
          }
      } else if(projectAddFrom.value.productId == '034002') {
          let obj = insuranceTypeList.value.find(item => item.id == '2')
          obj.insuranceId = obj.id
          projectAddFrom.value.schemeList.forEach(item => {
              item.drivingList = []
              item.tableData = [obj]
          })
      } else if(projectAddFrom.value.productId == '0330034002') {
          let obj = insuranceTypeList.value.filter(item => item.id == '2' || item.id == '19')
          if(obj) {
              obj.forEach(item => {
                  item.insuranceId = item.id
                  if(item.id == '19') {
                      item.moneyId = item.options[0].id
                  }
              })
              projectAddFrom.value.schemeList.forEach(item => {
                  item.drivingList = []
                  item.tableData = [...obj]
              })
          }
      } else {
          projectAddFrom.value.schemeList.forEach(item => {
              item.drivingList = []
              item.tableData = []
          })
      }
    } else {
      ElMessage({
        message: res.msg,
        type: 'warning'
      })
    }
  })
}

/**
 * 方案类型切换处理
 * @param e 方案类型
 */
const schemeTypeChange = (e) => {
  initProduct(projectAddFrom.value.productId)
}

// 保险公司列表
let companyOption = ref([])

/**
 * 初始化保险公司列表
 */
const initCompany = () => {
  api.projectApi.getCompanyList().then(res => {
    if(res.code == 200) {
      companyOption.value = res.data
    } else {
      ElMessage({
        message: res.msg,
        type: 'warning'
      })
    }
  })
}

/**
 * 添加新方案
 */
const addProject = () => {
  projectAddFrom.value.schemeList.push({
    schemeName: '',
    description: '',
    tableData: [],
    drivingList: [],
    schemeInsuranceList: [],
    drivingIntentionList: []
  })
}

// 规则条件显示状态
let rulesShow = ref(false)

/**
 * 打开规则条件选择弹窗
 */
const addRules = () => {
    ruleSelectShow.value = true
    nextTick(() => {
        RuleSelect.value.initEditData(rulesAttrList.value)
    })
}

// 规则条件列表
let rulesAttrList = ref([])
// 默认规则条件列表
let defaultAttrList = ref([])

/**
 * 取消规则条件编辑
 * @param data 数据
 */
const cancelRule = (data) => {
  rulesShow.value = false
}

/**
 * 删除规则条件
 * @param index 索引
 */
const handleDel = (index) => {
  // 能源类型、使用性质、车辆种类不可删除
  if(rulesAttrList.value[index].attrName === '能源类型' || rulesAttrList.value[index].attrName === '使用性质' || rulesAttrList.value[index].attrName === '车辆种类') {
    return
  } else {
    rulesAttrList.value.splice(index, 1)
  }
}

// 险种类型列表
let insuranceType = ref([])

/**
 * 初始化险种类型
 */
const initType = () => {
  api.commonApi.personInfo('insurance_type').then(res => {
    if(res.code == 200) {
      insuranceType.value = res.data
      projectAddFrom.value.productId = insuranceType.value[0].value
    } else {
      ElMessage({
        message: res.msg,
        type: 'warning'
      })
    }
  })
}

// 险种选择弹窗状态
let insuranceShow = ref(false)

/**
 * 处理险种选择关闭
 * @param obj 险种数据
 */
const handleClose = ( obj ) => {
  if(obj.list && obj.list.length > 0) {
    if(projectAddFrom.value.schemeType === 2) {
      // 自选方案处理多选
      obj.list.forEach(a => {
        a.optionId = []
        a.options.forEach(b => {
          if(b.checked) {
            a.optionId.push(b.id)
          }
        })
        a.moneyId = a.optionId
      })
    } else {
      // 基础方案处理单选
      obj.list.forEach(a => {
        a.optionId = a.options.find(b => b.checked)?.id
        a.moneyId = a.optionId
      })
    }
    projectAddFrom.value.schemeList[obj.index].tableData = obj.list
  }
  insuranceShow.value = false
}

/**
 * 删除险种
 * @param item 方案项
 * @param row 险种行数据
 */
const insuranceTypeDel = (item, row) => {
  let data = item.tableData.filter(a => a.insuranceId != row.insuranceId)
  item.tableData = [...data]
}

// 驾意险选择弹窗状态
let drivingShow = ref(false)

/**
 * 打开驾意险选择弹窗
 * @param item 方案项
 * @param index 索引
 */
const handleDriving = (item, index) => {
  drivingShow.value = true
  nextTick(() => {
    DrivingTypeRef.value.initEditData(item.drivingList, index, myRoute.query.companyId)
  })
}

/**
 * 处理驾意险选择关闭
 * @param obj 驾意险数据
 */
const handleDrivingClose = ( obj ) => {
  if(obj.list && obj.list.length > 0) {
    obj.list.forEach(sub => {
      sub.drivingIntentionId = sub.drivingIntentionId
      sub.selectedStatus = sub.selectedStatus?sub.selectedStatus:'1'
      sub.quantity = sub.quantity?sub.quantity:'1'
    })
    projectAddFrom.value.schemeList[obj.index].drivingList = obj.list
  }
  drivingShow.value = false
}

/**
 * 删除驾意险
 * @param item 方案项
 * @param row 驾意险行数据
 */
const drivingTypeDel = (item, row) => {
  let data = item.drivingList.filter(a => a.id != row.id)
  item.drivingList = [...data]
}

/**
 * 打开险种选择弹窗
 * @param item 方案项
 * @param index 索引
 */
const handlePopover = (item, index) => {
  insuranceShow.value = true
  nextTick(() => {
    InsuranceTypeRef.value.initEditData(item.tableData, index, projectAddFrom.value.schemeType, projectAddFrom.value.productId)
  })
}

/**
 * 初始化规则属性
 */
const initAttr = () => {
  api.agreementApi.ruleAttrGroup({ attrName: '' }).then(res => {
    if(res.code == 200) {
      // 获取车辆信息相关的规则属性
      let list = res.data?.VehicleInformation?.filter(e => e.attrName === '能源类型' || e.attrName === '使用性质' || e.attrName === '车辆种类')
      rulesAttrList.value = list?.map(a => {
          if (a.attrCode == 'LicenseNo') {
              a.dictLabal = licensePlateNumber.value;
          }
          if (a.attrCode == 'LicenseArea') {
              a.dictLabal = licensePlateRegion.value;
          }
          return {
              ...a,
              operator: '1',
              min: a.attrName == '能源类型'? '0':'',
              minArray: a.minArray?a.minArray:a.attrName == '使用性质' || a.attrName == '车辆种类'?[a.dictLabal[0].code]:[]
          }
      })
      defaultAttrList.value = [...list]
    } else {
      ElMessage({
        message: res.msg,
        type: 'warning'
      })
    }
  })
}

/**
 * 初始化编辑数据
 */
const initEdit = async () => {
  initInsurance()
  await api.projectApi.getScheme(myRoute.query.id).then(res => {
    if(res.code == 200) {
      if(res.data && res.data.schemeList.length > 0) {
        res.data.schemeList.forEach(item => {
          item.drivingList = item.drivingIntentionList
          item.tableData = item.schemeInsuranceList.map(sub => {
            let obj = insuranceTypeList.value.find(a => a.id == sub.insuranceId)
            console.log("🚀 ~ initEdit ~ obj:", obj)
            return {
              ...sub,
              optionId: res.data.schemeType===1?`${sub.optionId[0]}`:sub.optionId,
              moneyId: res.data.schemeType===1?`${sub.optionId[0]}`:sub.optionId,
              options: obj?.options
            }
          })
        })
        projectAddFrom.value = res.data
        rulesAttrList.value = res.data.ruleAttrs.map(val => {
            if (val.attrCode == 'LicenseNo') {
                val.dictLabal = licensePlateNumber.value;
            }
            if (val.attrCode == 'LicenseArea') {
                val.dictLabal = licensePlateRegion.value;
            }
            return val
        })
      }
    } else {
      ElMessage({
        message: res.msg,
        type: 'warning'
      })
    }
  })
}

/**
 * 取消操作
 */
const quit = () => {
  myRouter.push({
    path: '/quoteConfig/agreement/project',
    query: {
      id: myRoute.query.companyId
    }
  })
}

/**
 * 保存项目
 * @param ProjectAddRef 表单引用
 */
const save = async (ProjectAddRef: FormInstance | undefined) => {
  if(!ProjectAddRef) {
    return
  }
  await ProjectAddRef.validate((valid) => {
    if(valid) {
      let formData = {...projectAddFrom.value}
      formData.ruleAttrs = [...rulesAttrList.value]

      // 处理方案数据
      formData.schemeList.forEach(item => {
        item.drivingIntentionList = []
        item.schemeInsuranceList = []

        // 处理驾意险数据
        item.drivingList.forEach(sub => {
          let obj = {
            id: sub.id,
            drivingIntentionId: sub.drivingIntentionId,
            selectedStatus: sub.selectedStatus,
            quantity: sub.quantity
          }
          item.drivingIntentionList.push(obj)
        })

        // 处理险种数据
        item.tableData.forEach(ins => {
          let obj = {
            id: ins.id,
            insuranceId: ins.insuranceId,
            optionId: projectAddFrom.value.schemeType === 1?[ins.moneyId]:projectAddFrom.value.schemeType === 2?ins.moneyId:[]
          }
          item.schemeInsuranceList.push(obj)
        })
      })

      // 调用保存API
      api.projectApi.saveScheme({...formData}).then(res => {
        if(res.code == 200) {
          ElMessage({
            message: res.msg,
            type: 'success'
          })
          myRouter.push({
            path: '/quoteConfig/agreement/project',
            query: {
              id: myRoute.query.companyId
            }
          })
        } else if(res.code != 400) {
          ElMessage({
            message: res.msg,
            type: 'warning'
          })
        }
      })
    } else {
      ElMessage({
        message: '请正确填写相关信息！',
        type: 'warning'
      })
    }
  })
}

/**
 * 组件挂载时执行
 */
 onBeforeMount(() => {
  // 初始化险种类型
  initType()
  // 初始化保险公司列表
  initCompany()
  // 初始化车牌地区数据
  regionLicenseRegion('0')
  // 初始化车牌号数据
  regionLicenseNumber('14')
  // 设置保险公司ID
  projectAddFrom.value.companyId = myRoute.query.companyId

  // 判断是否为编辑模式
  if(myRoute.query.id) {
    isEdit.value = true
    projectAddFrom.value.id = myRoute.query.id
    projectAddFrom.value.productId = myRoute.query.productId
    initEdit()
  } else {
    isEdit.value = false
    initAttr()
    initInsurance()
  }
})

</script>

<style scoped lang="scss">
.projectAdd{
  width: 100%;
  height: 100%;
  background: white;
  padding: 20px;
  .ruleList{
    width: 90%;
    .ruleItem{
      display: flex;
      align-items: center;
      justify-content: flex-start;
      margin: 10px 0;
    }
  }
  .configuration{
    width: 100%;
    background: #f0f0f0;
    padding: 20px 100px;
    margin-bottom: 10px;
    border-radius: 5px;
  }
  .btns{
    display: flex;
    align-items: center;
    justify-content: center;
  }
}
</style>