|
|
@@ -0,0 +1,452 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <PageMain style="padding: 20px;margin-bottom: 100px;">
|
|
|
+ <ElRow :gutter="60">
|
|
|
+ <ElCol :md="24" :lg="24" style="padding-bottom: 10px;font-size: 14px;">
|
|
|
+ <span class="strong">基本信息</span>
|
|
|
+ </ElCol>
|
|
|
+ <el-form :model="productform" label-width="120px" :rules="productformRules" label-position="top"
|
|
|
+ ref="productFormRef" style="max-width: 1000px;" class="flex a-c f-wrap" :size="fromSize">
|
|
|
+ <ElCol :md="24" :lg="12">
|
|
|
+ <el-form-item label="产品类型" prop="productType">
|
|
|
+ <el-select v-model="productform.productType" :disabled="productType == '2' || type=='edit'" @change="productTypeChange"
|
|
|
+ placeholder="请选择产品类型" clearable filterable>
|
|
|
+ <el-option label="主险" value="1" />
|
|
|
+ <el-option label="附加险" value="2" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </ElCol>
|
|
|
+ <ElCol :md="24" :lg="12" v-if="productform.productType != '1'">
|
|
|
+ <el-form-item label="上级产品" prop="parentId">
|
|
|
+ <el-select v-model="productform.parentId" :disabled="productType == '2' || type=='edit'" placeholder="请选择产品" clearable>
|
|
|
+ <el-option v-for="(item, index) in parentList" :key="index" :label="item.productName"
|
|
|
+ :value="item.id" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </ElCol>
|
|
|
+ <ElCol :md="24" :lg="12">
|
|
|
+ <el-form-item label="产品名称" prop="productName">
|
|
|
+ <el-input v-model="productform.productName" placeholder="输入产品名称" />
|
|
|
+ </el-form-item>
|
|
|
+ </ElCol>
|
|
|
+ <ElCol :md="24" :lg="12">
|
|
|
+ <el-form-item label="别名">
|
|
|
+ <el-input v-model="productform.alias" placeholder="输入产品别名" />
|
|
|
+ </el-form-item>
|
|
|
+ </ElCol>
|
|
|
+ <ElCol :md="24" :lg="12">
|
|
|
+ <el-form-item label="保险公司" prop="company">
|
|
|
+ <el-input v-model="productform.companyName" placeholder="保险公司" disabled />
|
|
|
+ </el-form-item>
|
|
|
+ </ElCol>
|
|
|
+ <ElCol :md="24" :lg="12">
|
|
|
+ <el-form-item label="产品编码" prop="productCode">
|
|
|
+ <el-input v-model="productform.productCode" placeholder="点击查询,获取产品编码" />
|
|
|
+ </el-form-item>
|
|
|
+ </ElCol>
|
|
|
+ <ElCol :md="24" :lg="12">
|
|
|
+ <el-form-item label="对接方式" prop="connectionMethod">
|
|
|
+ <el-select v-model="productform.connectionMethod" placeholder="请选择产品" clearable filterable>
|
|
|
+ <el-option label="API对接" value="1" />
|
|
|
+ <el-option label="Python对接" value="2" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </ElCol>
|
|
|
+ <ElCol :md="24" :lg="12">
|
|
|
+ <el-form-item label="保费设置" prop="premiumSetting">
|
|
|
+ <el-select v-model="productform.premiumSetting" placeholder="请选择" clearable filterable>
|
|
|
+ <el-option label="产品统一价格" value="1" />
|
|
|
+ <el-option label="按座位数设置价格" value="2" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </ElCol>
|
|
|
+ <ElCol :md="24" :lg="12" v-if="productform.premiumSetting == '1'">
|
|
|
+ <el-form-item label="总保额" prop="coverage">
|
|
|
+ <el-input v-model="productform.coverage" placeholder="请输入总保额">
|
|
|
+ <template #append>元</template>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </ElCol>
|
|
|
+ <ElCol :md="24" :lg="12" v-if="productform.premiumSetting == '1'">
|
|
|
+ <el-form-item label="总保费" prop="premium">
|
|
|
+ <el-input v-model="productform.premium" placeholder="请输入总保费">
|
|
|
+ <template #append>元</template>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </ElCol>
|
|
|
+ </el-form>
|
|
|
+ <ElCol :md="24" :lg="24" v-if="productform.premiumSetting == '2'">
|
|
|
+ <ElDivider style="margin: 10px 0;"></ElDivider>
|
|
|
+ <ElCol :md="24" :lg="24" style="padding-bottom: 10px;font-size: 14px;">
|
|
|
+ <span class="strong">保费设置</span>
|
|
|
+ </ElCol>
|
|
|
+ <ElCol :md="24" :lg="12">
|
|
|
+ <el-table :data="productform.settingList" style="width: 100%;">
|
|
|
+ <el-table-column prop="seats" label="座位数" width="180">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-input-number v-model="scope.row.seats" controls-position="right" style="width: 100%;" :min="5"
|
|
|
+ :max="10">
|
|
|
+ <template #suffix>
|
|
|
+ <span>座</span>
|
|
|
+ </template>
|
|
|
+ </el-input-number>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="coverage" label="保额" width="180">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-input-number v-model="scope.row.coverage" :precision="2" controls-position="right"
|
|
|
+ style="width: 100%;" :min="1" :max="9000000">
|
|
|
+ <template #suffix>
|
|
|
+ <span>元</span>
|
|
|
+ </template>
|
|
|
+ </el-input-number>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="premium" label="保费">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-input-number v-model="scope.row.premium" :precision="2" controls-position="right"
|
|
|
+ style="width: 100%;" :min="1" :max="9000000">
|
|
|
+ <template #suffix>
|
|
|
+ <span>元</span>
|
|
|
+ </template>
|
|
|
+ </el-input-number>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-button type="primary" link @click="settingDel(scope.$index)">删除</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <ElButton type="primary" style="margin-top: 10px;" @click="settingListAdd">
|
|
|
+ <template #icon>
|
|
|
+ <el-icon>
|
|
|
+ <Plus />
|
|
|
+ </el-icon>
|
|
|
+ </template>
|
|
|
+ 添加一条
|
|
|
+ </ElButton>
|
|
|
+ </ElCol>
|
|
|
+ </ElCol>
|
|
|
+ <ElCol :md="24" :lg="24">
|
|
|
+ <ElDivider style="margin: 10px 0;"></ElDivider>
|
|
|
+ <ElCol :md="24" :lg="24" style="padding-bottom: 10px;font-size: 14px;">
|
|
|
+ <span class="strong">保险责任</span>
|
|
|
+ </ElCol>
|
|
|
+ <el-table :data="productform.blameList" style="width: 100%;">
|
|
|
+ <el-table-column prop="blame" label="保险责任"></el-table-column>
|
|
|
+ <el-table-column prop="blameCode" label="保险责任编码" width="180" align="center"></el-table-column>
|
|
|
+ <el-table-column prop="blameCoverage" label="保险责任保额" width="180" align="center"></el-table-column>
|
|
|
+ <el-table-column prop="blamePremium" label="保险责任保费" width="180" align="center"></el-table-column>
|
|
|
+ <el-table-column label="操作" width="280" align="center">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-button type="primary" link @click="blameDel(scope.$index)">删除</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <ElButton type="primary" style="margin-top: 10px;" @click="blameListAdd">
|
|
|
+ <template #icon>
|
|
|
+ <el-icon>
|
|
|
+ <Plus />
|
|
|
+ </el-icon>
|
|
|
+ </template>
|
|
|
+ 添加一条
|
|
|
+ </ElButton>
|
|
|
+ </ElCol>
|
|
|
+ </ElRow>
|
|
|
+ </PageMain>
|
|
|
+ <FixedActionBar>
|
|
|
+ <ElButton @click='router.back()'>
|
|
|
+ 取消
|
|
|
+ </ElButton>
|
|
|
+ <ElButton type="primary" @click="submitForm(productFormRef)">
|
|
|
+ 保存
|
|
|
+ </ElButton>
|
|
|
+ <ElButton type="primary" @click="submitForm(productFormRef)">
|
|
|
+ 保存并继续添加
|
|
|
+ </ElButton>
|
|
|
+ </FixedActionBar>
|
|
|
+ <el-dialog v-model="blamedialogVisible" title="添加驾意险责任" width="50%">
|
|
|
+ <ElRow :gutter="20">
|
|
|
+ <el-form :model="blameFrom" :inline="true" label-width="120px" :rules="blameFromrules" label-position="top"
|
|
|
+ ref="blameFormRef" style="width: 100%;" :size="fromSize">
|
|
|
+ <ElCol :md="24" :lg="12">
|
|
|
+ <el-form-item label="保险责任" prop="blame">
|
|
|
+ <el-input v-model="blameFrom.blame" placeholder="请输入保险责任" show-word-limit maxlength="50" />
|
|
|
+ </el-form-item>
|
|
|
+ </ElCol>
|
|
|
+ <ElCol :md="24" :lg="12">
|
|
|
+ <el-form-item label="责任编码" prop="blameCode">
|
|
|
+ <el-input v-model="blameFrom.blameCode" placeholder="请输入责任编码" />
|
|
|
+ </el-form-item>
|
|
|
+ </ElCol>
|
|
|
+ <ElCol :md="24" :lg="12">
|
|
|
+ <el-form-item label="总保额" prop="blameCoverage">
|
|
|
+ <el-input-number v-model="blameFrom.blameCoverage" :precision="2" controls-position="right"
|
|
|
+ style="width: 100%;" :min="1" :max="9000000">
|
|
|
+ <template #suffix>
|
|
|
+ <span>元</span>
|
|
|
+ </template>
|
|
|
+ </el-input-number>
|
|
|
+ </el-form-item>
|
|
|
+ </ElCol>
|
|
|
+ <ElCol :md="24" :lg="12">
|
|
|
+ <el-form-item label="总保费" prop="blamePremium">
|
|
|
+ <el-input-number v-model="blameFrom.blamePremium" :precision="2" controls-position="right"
|
|
|
+ style="width: 100%;" :min="1" :max="9000000">
|
|
|
+ <template #suffix>
|
|
|
+ <span>元</span>
|
|
|
+ </template>
|
|
|
+ </el-input-number>
|
|
|
+ </el-form-item>
|
|
|
+ </ElCol>
|
|
|
+ </el-form>
|
|
|
+ </ElRow>
|
|
|
+ <template #footer>
|
|
|
+ <div class="dialog-footer">
|
|
|
+ <el-button @click="blamedialogVisible = false">取消</el-button>
|
|
|
+ <el-button type="primary" @click="blamesbimit(blameFormRef)">
|
|
|
+ 保存
|
|
|
+ </el-button>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script lang="ts" setup>
|
|
|
+import { ref } from 'vue'
|
|
|
+import { FormRules, FormInstance, ComponentSize, ElMessage } from 'element-plus';
|
|
|
+import { useRoute } from 'vue-router';
|
|
|
+import api from '@/api';
|
|
|
+import router from '@/router';
|
|
|
+import * as Types from '@/api/types/productTypes';
|
|
|
+const route = useRoute();
|
|
|
+const companyId = ref(route.query.companyID as string)//保险公司ID
|
|
|
+const companyName = ref(route.query.companyName as string)//保险公司名称
|
|
|
+const id = ref(route.query.id as string)//id标识
|
|
|
+const type = ref(route.query.type as string)//id标识
|
|
|
+const productType = ref(route.query.productType as string)
|
|
|
+// const dictLists = ref<{ [key: string]: any[] }>({});
|
|
|
+const parentList = ref<parentList>();
|
|
|
+const productFormRef = ref<FormInstance>()
|
|
|
+const blameFormRef = ref<FormInstance>()
|
|
|
+const fromSize = ref<ComponentSize>('default')
|
|
|
+const blamedialogVisible = ref(false);
|
|
|
+const productform = reactive<Types.jyxConfigRequest>({
|
|
|
+ id: "",
|
|
|
+ productType: "",//产品类型
|
|
|
+ parentId: "",//上级产品
|
|
|
+ productName: "",//产品名称
|
|
|
+ alias: '',//别名
|
|
|
+ company: "",//保险公司
|
|
|
+ companyName: "",
|
|
|
+ productCode: "",//产品编码
|
|
|
+ connectionMethod: "",//对接方式
|
|
|
+ premiumSetting: "",//保费设置
|
|
|
+ coverage: "",//总保额
|
|
|
+ premium: "",//总保费
|
|
|
+ settingList: [],
|
|
|
+ blameList: [],
|
|
|
+
|
|
|
+})
|
|
|
+const blameFrom = reactive({//保险责任表单弹窗
|
|
|
+ blame: "",
|
|
|
+ blameCode: '',
|
|
|
+ blameCoverage: 0,
|
|
|
+ blamePremium: 0,
|
|
|
+})
|
|
|
+interface parentList {
|
|
|
+ productName: string,
|
|
|
+ id: string,
|
|
|
+ [property: string]: any
|
|
|
+}
|
|
|
+const blameFromrules = ref<FormRules>({
|
|
|
+ blame: [
|
|
|
+ { required: true, trigger: 'blur', message: '请输入保险责任名称' },
|
|
|
+ { max: 50, message: '限制50个字符', trigger: 'blur' },
|
|
|
+
|
|
|
+ ],
|
|
|
+ blameCode: [
|
|
|
+ { required: true, trigger: 'blur', message: '请输入产品编码' },
|
|
|
+ ],
|
|
|
+ blameCoverage: [
|
|
|
+ { required: true, trigger: 'blur', message: '请输入总保额' },
|
|
|
+ ],
|
|
|
+ blamePremium: [
|
|
|
+ { required: true, trigger: 'blur', message: '请输入总保费' },
|
|
|
+ ],
|
|
|
+
|
|
|
+});
|
|
|
+const productformRules = ref<FormRules>({
|
|
|
+ productType: [
|
|
|
+ { required: true, trigger: 'change', message: '请选择产品类型' },
|
|
|
+ ],
|
|
|
+ parentId: [
|
|
|
+ { required: true, trigger: 'change', message: '请选择上级产品' },
|
|
|
+ ],
|
|
|
+ productName: [
|
|
|
+ { required: true, trigger: 'blur', message: '请输入产品名称' },
|
|
|
+ ],
|
|
|
+ company: [
|
|
|
+ { required: true, trigger: 'change', message: '请选择保险公司' },
|
|
|
+ ],
|
|
|
+ productCode: [
|
|
|
+ { required: true, trigger: 'blur', message: '请输入产品编码' },
|
|
|
+ ],
|
|
|
+ connectionMethod: [
|
|
|
+ { required: true, trigger: 'change', message: '请选择对接方式' },
|
|
|
+ ],
|
|
|
+ premiumSetting: [
|
|
|
+ { required: true, trigger: 'change', message: '请选择保费设置' },
|
|
|
+ ],
|
|
|
+ coverage: [
|
|
|
+ { required: true, trigger: 'blur', message: '请输入总保额' },
|
|
|
+ ],
|
|
|
+ premium: [
|
|
|
+ { required: true, trigger: 'blur', message: '请输入总保费' },
|
|
|
+ ],
|
|
|
+});
|
|
|
+
|
|
|
+onBeforeMount(() => {
|
|
|
+ if (companyId.value) {
|
|
|
+ productform.company = companyId.value;
|
|
|
+ productform.companyName = companyName.value;
|
|
|
+ }
|
|
|
+ if (productType.value) {
|
|
|
+ productform.productType = productType.value;
|
|
|
+ productform.parentId = id.value;
|
|
|
+ selectMainIns();
|
|
|
+ }
|
|
|
+ if (id.value && type.value == 'edit') {
|
|
|
+ detalis(id.value);
|
|
|
+ }
|
|
|
+
|
|
|
+});
|
|
|
+const settingListAdd = () => {
|
|
|
+ productform.settingList.push({
|
|
|
+ seats: 0,
|
|
|
+ coverage: 0,
|
|
|
+ premium: 0,
|
|
|
+ })
|
|
|
+}
|
|
|
+const settingDel = (index: any) => {
|
|
|
+ productform.settingList.splice(index, 1);
|
|
|
+}
|
|
|
+const blameListAdd = () => {
|
|
|
+ blamedialogVisible.value = true;
|
|
|
+
|
|
|
+}
|
|
|
+const blameDel = (index: any) => {
|
|
|
+ productform.blameList.splice(index, 1);
|
|
|
+
|
|
|
+}
|
|
|
+//类型事件
|
|
|
+const productTypeChange = (value: any) => {
|
|
|
+ if (value == 2) {
|
|
|
+ selectMainIns();
|
|
|
+ }
|
|
|
+}
|
|
|
+//查询主险
|
|
|
+const selectMainIns = () => {
|
|
|
+ api.product.selectMainInsurance(companyId.value).then((res: any) => {
|
|
|
+ if (res.code == '200') {
|
|
|
+ parentList.value = res.data;
|
|
|
+ } else {
|
|
|
+ }
|
|
|
+ });
|
|
|
+}
|
|
|
+const detalis = (id: string) => {
|
|
|
+ api.product.jygetById(id).then((res: any) => {
|
|
|
+ if (res.code == '200') {
|
|
|
+ selectMainIns();
|
|
|
+ Object.keys(productform).forEach((key) => {
|
|
|
+ if (res.data.hasOwnProperty(key)) {
|
|
|
+ productform[key as keyof typeof productform] = res.data[key as keyof typeof productform];
|
|
|
+ }
|
|
|
+ });
|
|
|
+ if (Array.isArray(res.data.settingList)) {
|
|
|
+ productform.settingList = res.data.settingList.map((item: any) => ({
|
|
|
+ seats: item.seats,
|
|
|
+ coverage: item.coverage,
|
|
|
+ premium: item.premium,
|
|
|
+ }));
|
|
|
+ }
|
|
|
+ if (Array.isArray(res.data.blameList)) {
|
|
|
+ productform.blameList = res.data.blameList.map((item: any) => ({
|
|
|
+ blame: item.blame,
|
|
|
+ blameCode: item.blameCode,
|
|
|
+ blameCoverage: item.blameCoverage,
|
|
|
+ blamePremium: item.blamePremium,
|
|
|
+ }));
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ }
|
|
|
+ });
|
|
|
+}
|
|
|
+//字典信息处理
|
|
|
+// const dictType = (type: string) => {
|
|
|
+// api.toolApi.dictType({ dictCode: type }).then((res: any) => {
|
|
|
+// if (res.code == '200') {
|
|
|
+// dictLists.value[type + 'List'] = res.data.map((item: any) => {
|
|
|
+// return {
|
|
|
+// value: item.value,
|
|
|
+// label: item.label
|
|
|
+// };
|
|
|
+// });
|
|
|
+// }
|
|
|
+// });
|
|
|
+// }
|
|
|
+const submitForm = async (formEl: FormInstance | undefined) => {
|
|
|
+ if (!formEl) return
|
|
|
+ await formEl.validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ if (id.value && type.value == 'edit') {
|
|
|
+ api.product.jyxupdateById(productform).then((res: any) => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ ElMessage({
|
|
|
+ type: 'success',
|
|
|
+ message: res.msg,
|
|
|
+ plain: true,
|
|
|
+ })
|
|
|
+ router.back()
|
|
|
+
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ api.product.jyxConfigAdd(productform).then((res: any) => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ ElMessage({
|
|
|
+ type: 'success',
|
|
|
+ message: res.msg,
|
|
|
+ plain: true,
|
|
|
+ })
|
|
|
+ router.back()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ ElMessage({
|
|
|
+ type: 'error',
|
|
|
+ message: '信息不完整',
|
|
|
+ plain: true,
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
+const blamesbimit = async (formEl: FormInstance | undefined) => {
|
|
|
+ if (!formEl) return
|
|
|
+ await formEl.validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ productform.blameList.push({ ...blameFrom })
|
|
|
+ blamedialogVisible.value = false;
|
|
|
+ } else {
|
|
|
+ ElMessage({
|
|
|
+ type: 'error',
|
|
|
+ message: '信息不完整',
|
|
|
+ plain: true,
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
+</script>
|