协议管理产品费用和承保规则功能

src/components/Form/FormConfig.js

@@ -1,219 +0,0 @@
-export default {
-	formItems: [{
-			input: true, //是input
-			label: "input+正则", //字段
-			prop: "input", //字段名
-			placeholder: "请填写手机号", //提示内容
-			width: 12, //参考el-col
-			disabled: false, //是否禁用
-			unit:'单位',
-			rules: [{
-				required: true,
-				message: '联系方式'
-			}] //验证
-		}, {
-			textarea: true, //是input
-			label: "输入框", //字段
-			prop: "textearea", //字段名
-			placeholder: "请填写输入框", //提示内容
-			width: 12, //参考el-col
-			disabled: false, //是否禁用
-			rules: [{
-				required: true,
-				message: '输入框'
-			}, ] //验证
-		},
-		{
-			select: true,
-			label: "选择框",
-			prop: "select",
-			placeholder: "请选择",
-			width: 12, //参考el-col
-			disabled: false,
-			options: [{
-				label: "options1",
-				value: "1"
-			}, {
-				label: "options2",
-				value: "2"
-			}, ],
-			rules: [{
-				required: true,
-				message: '选择框不能为空！'
-			}]
-		}, {
-			searchSelect: true,
-			label: "select搜索框",
-			prop: "searchSelect",
-			placeholder: "请选择",
-			width: 12, //参考el-col
-			disabled: false,
-			options: [],
-			rules: [{
-				required: true,
-				message: 'select搜索框！'
-			}]
-		}, {
-			dateTimeRange: true,
-			label: "年月日时分秒开",
-			prop: "dateTimeRange",
-			width: 12, //参考el-col
-			disabled: false,
-			options: {
-				selectableRange: '18:30:00 - 20:30:00'
-			},
-			rules: [{
-				required: true,
-				message: '年月日时分秒开'
-			}, ]
-		}, {
-			timePicker: true,
-			label: "时分秒选择器",
-			prop: "timePicker",
-			placeholder: "请选择",
-			width: 12, //参考el-col
-			disabled: false,
-			options: "",
-			rules: [{
-				required: true,
-				message: '时分秒选择器'
-			}, ]
-		}, {
-			timePickerIsRange: true,
-			label: "时分秒开始结束",
-			prop: "timePickerIsRange",
-			placeholder: "请选择",
-			width: 12, //参考el-col
-			disabled: false,
-			options: "",
-			rules: [{
-				required: true,
-				message: '时分秒开始结束'
-			}, ]
-		}, {
-			datePicker: true,
-			label: "年月日选择器",
-			prop: "datePicker",
-			placeholder: "请选择",
-			width: 12, //参考el-col
-			disabled: false,
-			options: "",
-			rules: [{
-				required: true,
-				message: '年月日选择器'
-			}, ]
-		}, {
-			datePickerIsRange: true,
-			label: "年月日开始结束",
-			prop: "datePickerIsRange",
-			placeholder: "请选择",
-			width: 12, //参考el-col
-			disabled: false,
-			options: "",
-			rules: [{
-				required: true,
-				message: '年月日开始结束'
-			}, ]
-		}, {
-			dateTime: true,
-			label: " 年月日时分秒",
-			prop: "dateTime",
-			placeholder: "请选择",
-			width: 12, //参考el-col
-			disabled: false,
-			options: "",
-			rules: [{
-				required: true,
-				message: ' 年月日时分秒'
-			}, ]
-		}, {
-			switch: true,
-			label: "switch",
-			prop: "switch",
-			placeholder: "请选择",
-			width: 12, //参考el-col
-			disabled: false,
-			rules: [{
-				required: true,
-				message: 'switch'
-			}, ]
-		}, {
-			radio: true,
-			label: "单选框",
-			prop: "radio",
-			placeholder: "请选择",
-			width: 12, //参考el-col
-			disabled: false,
-			options: [{
-				label: "单选框1",
-				value: "1"
-			}, {
-				label: "单选框2",
-				value: "2"
-			}, ],
-			rules: [{
-				required: true,
-				message: '单选框不能为空'
-			}, ]
-		}, {
-			checkbox: true,
-			label: "复选框",
-			prop: "checkbox",
-			disabled: false,
-			width: 12, //参考el-col
-			options: [{
-				label: "复选框1",
-				value: "1"
-			}, {
-				label: "复选框2",
-				value: "2"
-			}, {
-				label: "复选框3",
-				value: "3"
-			}, ],
-			rules: [{
-				required: true,
-				message: '复选框不能为空'
-			}, ]
-		},
-		{
-			upload: true,
-			label: "文件上传",
-			prop: "upload",
-			disabled: false,
-			uploadObj: {
-				fileType: "2001",
-				limit: 1, //上传长度限制
-				hideUpload: false, //是否隐藏上传框
- 
-			},
-			rules: [{
-				required: true,
-				message: '文件上传'
-			}, ]
-		},
-		{
-			button: true,
-			label: "按钮",
-			prop: "buttona",
-			placeholder:"发送验证码",
-			width: 12, //参考el-col
-			disabled: false,
-		},
-		{
-			text: true,
-			label: "文本",
-			prop: "text",
-			width: 12, //参考el-col
-			disabled: false,
-		},
-		{
-			quillEditor: true,
-			label: "富文本",
-			prop: "quill",
-			disabled: false,
-		},
-    ],
-    refVerification:'ruleForm',
-	
-}

src/components/Form/GenericForm.vue

@@ -0,0 +1,80 @@
+<template>
+  <el-form ref="form" :model="formData" :label-width="labelWidth">
+    <el-form-item v-for="field in formFields" :key="field.name" :label="field.label">
+      <template v-if="field.type === 'input'">
+        <el-input v-model="formData[field.name]"></el-input>
+      </template>
+      <template v-else-if="field.type === 'select'">
+        <el-select v-model="formData[field.name]" placeholder="请选择">
+          <el-option v-for="(option, index) in field.options" :key="index" :label="option.label" :value="option.value"></el-option>
+        </el-select>
+      </template>
+      <template v-else-if="field.type === 'date'">
+        <el-date-picker type="date" placeholder="选择日期" v-model="formData[field.name]" style="width: 100%;"></el-date-picker>
+      </template>
+      <template v-else-if="field.type === 'time'">
+        <el-time-picker placeholder="选择时间" v-model="formData[field.name]" style="width: 100%;"></el-time-picker>
+      </template>
+      <template v-else-if="field.type === 'switch'">
+        <el-switch v-model="formData[field.name]"></el-switch>
+      </template>
+      <template v-else-if="field.type === 'checkbox'">
+        <el-checkbox-group v-model="formData[field.name]">
+          <el-checkbox v-for="(option, index) in field.options" :key="index" :label="option.label" :name="field.name"></el-checkbox>
+        </el-checkbox-group>
+      </template>
+      <template v-else-if="field.type === 'radio'">
+        <el-radio-group v-model="formData[field.name]">
+          <el-radio v-for="(option, index) in field.options" :key="index" :label="option.label"></el-radio>
+        </el-radio-group>
+      </template>
+      <template v-else-if="field.type === 'textarea'">
+        <el-input type="textarea" v-model="formData[field.name]"></el-input>
+      </template>
+    </el-form-item>
+    <el-form-item>
+      <el-button type="primary" @click="handleSubmit">提交</el-button>
+      <el-button @click="resetForm">重置</el-button>
+    </el-form-item>
+  </el-form>
+</template>
+
+<script>
+export default {
+  props: {
+    fields: {
+      type: Array,
+      required: true
+    },
+    labelWidth:{
+      type:String,
+      default:'120px'
+    }
+  },
+  data() {
+    return {
+      formFields: [], // 动态表单字段配置
+      formData: {} // 表单数据对象
+    };
+  },
+  mounted() {
+    this.formFields = this.fields;
+    this.resetForm();
+  },
+  methods: {
+    handleSubmit() {
+      this.$refs.form.validate((valid) => {
+        if (valid) {
+          this.$emit('submit', this.formData);
+        } else {
+          // 表单验证失败，做相应处理
+        }
+      });
+    },
+    resetForm() {
+      this.$refs.form.resetFields();
+      this.formData = {};
+    }
+  }
+};
+</script>

src/components/Form/MyForm.vue

@@ -1,284 +0,0 @@
-<template>
-    <el-form :model="formData" class="demo-ruleForm" :ref="refVerification" label-position="left" label-width="120px">
-        <el-col v-for=" (formItems, index) in formItems" v-show="!formItems.notShow" :key="index"
-            :span="formItems.width ? formItems.width : 24">
-            <el-form-item :label="formItems.label" :prop="formItems.prop" :rules="formItems.rules">
-                <!-- inupt输入框 -->
-                <el-input v-if="formItems.input" v-model="formData[formItems.prop]" size="small"
-                    :disabled="formItems.disabled" :placeholder="formItems.placeholder"
-                    @input="inputINPUT($event, index, formItems.prop)"
-                    @change="inputChange($event, index, formItems.prop)" />
-                <!-- textarea输入框 -->
-                <el-input v-if="formItems.textarea" v-model="formData[formItems.prop]" size="small" type="textarea"
-                    :rows="formItems.rows" :disabled="formItems.disabled" :placeholder="formItems.placeholder" />
-                <!-- select选择器 -->
-                <el-select v-if="formItems.select" v-model="formData[formItems.prop]" size="small"
-                    :disabled="formItems.disabled" :placeholder="formItems.placeholder"
-                    @change="selectChange($event, index, formItems.prop)">
-                    <el-option v-for="(options, sIndex) in formItems.options" :key="sIndex" :label="options.label"
-                        :value="options.value" />
-                </el-select>
-                <!-- select搜索框 -->
-                <el-select v-if="formItems.searchSelect" v-model="formData[formItems.prop]" size="small"
-                    :disabled="formItems.disabled" filterable remote reserve-keyword :placeholder="formItems.placeholder"
-                    :remote-method="(query) => remoteMethod(query, index, formItems.prop)" :loading="searchSelectLoading"
-                    @change="selectChange($event, index, formItems.prop)">
-                    <el-option v-for="(item, ssIndex) in formItems.options" :key="ssIndex" :label="item.label"
-                        :value="item.value" />
-                </el-select>
-                <!-- 年月日时分秒选择器 -->
-                <el-date-picker v-if="formItems.dateTime" v-model="formData[formItems.prop]"
-                    value-format="yyyy-MM-dd HH:mm:ss" type="datetime" size="small" :disabled="formItems.disabled"
-                    :placeholder="formItems.placeholder" />
-                <!-- 年月日时分秒，开始和结束时间 -->
-                <el-date-picker v-if="formItems.dateTimeRange" v-model="formData[formItems.prop]"
-                    value-format="yyyy-MM-dd HH:mm:ss" format="yyyy-MM-dd HH:mm:ss" size="small" type="datetimerange"
-                    :disabled="formItems.disabled" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" />
-                <!-- 时分秒选择器 -->
-                <el-time-picker v-if="formItems.timePicker" v-model="formData[formItems.prop]" value-format="HH:mm:ss"
-                    format="HH:mm:ss" size="small" :disabled="formItems.disabled" :placeholder="formItems.placeholder"
-                    :picker-options="formItems.options" />
-                <!-- 时分秒选择器，开始和结束时间 -->
-                <el-time-picker v-if="formItems.timePickerIsRange" v-model="formData[formItems.prop]"
-                    value-format="HH:mm:ss" format="HH:mm:ss" is-range size="small" :disabled="formItems.disabled"
-                    range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间" placeholder="选择时间范围" />
-                <!-- 年月日选择器 -->
-                <el-date-picker v-if="formItems.datePicker" v-model="formData[formItems.prop]" value-format="yyyy-MM-dd"
-                    size="small" :disabled="formItems.disabled" :placeholder="formItems.placeholder" />
-                <!-- 年月日选择器，开始和介绍年月日 -->
-                <el-date-picker v-if="formItems.datePickerIsRange" v-model="formData[formItems.prop]"
-                    value-format="yyyy-MM-dd" type="daterange" size="small" :disabled="formItems.disabled"
-                    :placeholder="formItems.placeholder" range-separator="至" start-placeholder="开始日期"
-                    end-placeholder="结束日期" />
-                <!-- switch开关 -->
-                <el-switch v-if="formItems.switch" v-model="formData[formItems.prop]" size="small"
-                    :disabled="formItems.disabled" @change="formSwitchChange($event, index, formItems.prop)" />
-                <!-- radio单选框 -->
-                <el-radio-group v-if="formItems.radio" v-model="formData[formItems.prop]" :disabled="formItems.disabled">
-                    <el-radio v-for="(options, rIndex) in formItems.options" :key="rIndex" :label="options.label"
-                        :value="options.value" />
-                </el-radio-group>
-                <!-- checkbox复选框 -->
-                <el-checkbox-group v-if="formItems.checkbox" v-model="formData[formItems.prop]"
-                    :disabled="formItems.disabled">
-                    <el-checkbox v-for="options in formItems.options" :key="options.value" :label="options.label" />
-                </el-checkbox-group>
-
-                <!-- 文件上传 -->
-                <!-- 如果对象有值就回显，没有值就为空 -->
-                <el-upload v-if="formItems.upload" :ref="formItems.prop"
-                    :accept="formItems.accept ? formItems.accept : 'PNG,JPEG'"
-                    :file-list="formData[formItems.prop] ? formData[formItems.prop] : []"
-                    :action="`${uploadUrl}${formItems.uploadObj.fileType ? formItems.uploadObj.fileType : ''}`"
-                    :limit="formItems.uploadObj.limit"
-                    :class="{ 'hide': formItems.uploadObj.hideUpload || formData[formItems.prop].length == formItems.uploadObj.limit }"
-                    :on-preview="handlePictureCardPreview"
-                    :on-remove="(file, fileList) => handleRemove(file, fileList, formItems.uploadObj.limit, formItems.prop, index)"
-                    :on-success="(response, file, fileList) => uploadSuccess(response, file, fileList, formItems.uploadObj.limit, formItems.prop, index)"
-                    list-type="picture-card" :auto-upload="true">
-                    <i slot="default" class="el-icon-plus" />
-                </el-upload>
-                <el-dialog v-if="formItems.upload" :visible.sync="dialogVisible" :append-to-body="true" width="40%">
-                    <img width="100%" :src="dialogImageUrl" alt="">
-                </el-dialog>
-
-                <!-- 按钮 -->
-                <el-button v-if="formItems.button" size="small" :disabled="formItems.disabled" :loading="formItems.loading"
-                    :type="formItems.buttonType || 'primary'" @click="buttonClick(formItems.prop, index)">
-                    {{ formItems.placeholder }}
-                </el-button>
-                <!-- text展示 -->
-                <span v-if="formItems.text" v-text="formData[formItems.prop]" />
-                <!-- 计量单位 -->
-                <span v-if="formItems.unit" class="left10">{{ formItems.unit }}</span>
-
-                <!-- 高德地图 -->
-                <!-- <div class="amap_div" v-if="formItems.aMap">
-					<el-input size="small" v-model="formData[formItems.prop]" @input="aMapInput($event,formItems.prop)"></el-input>
-					<ul v-show="searchShow==formItems.prop" class="sreach_ul">
-						<li @click="selectVal(sval,formItems.prop,index)" v-for=" (sval, index) in setSearchVal" :key="index">{{sval.name}}
-							<span style="color:#8591A6 ;font-size: 12px;">{{sval.district}}</span>
-						</li>
-					</ul>
-					<aMap :ref="'aMap'+formItems.prop" :aMapId="'aMapId'+formItems.prop" :location="formData[formItems.prop+'location']" @cbSearch="cbSearch($event,formItems.prop)"></aMap>
-				</div> -->
-
-            </el-form-item>
-        </el-col>
-    </el-form>
-</template>
-<script>
-export default {
-    name: "MyForm",
-    model: {
-        prop: 'modelValue',
-        event: 'update:modelValue',
-    },
-    props: {
-        modelValue: Object,
-        formItems: {
-            type: Array,
-            required: true
-        },
-        searchSelectOptionsCb: {
-            type: Array,
-        },
-        refVerification: {
-            type:String,
-        }
-    },
-    data() {
-        let uploadFileUrl = this.$store.state.user.uploadFileUrl;
-        return {
-            formData: {},
-            uploadUrl: uploadFileUrl,
-            dialogImageUrl: '',
-            searchSelectLoading: false,
-            dialogVisible: false,
-            disabled: false,
-            searchShow: '', //高德地图input收索联想
-            setSearchVal: [], //高德地图赋值搜索内容
-        };
-    },
-    emits: ['update:modelValue'],
-    created() {
-        // 表单初始化
-        for (let item of this.formItems) {
-            // 注意：这里要进行响应式的设置，否则表单控件会无法输入的
-            this.$set(this.formData, item.prop, '')
-        }
-        this.$emit('update:modelValue', this.formData)
-    },
-    watch: {
-        formData: {
-            handler(newValue) {
-            },
-            deep: true,
-        },
-    },
-    methods: {
-        //select变化调用
-        selectChange(value, index, prop) {
-            this.$emit('selectChange', value, index, prop);
-        },
-        // input的input事件
-        inputINPUT(value, index, prop) {
-            this.$emit('inputINPUT', value, index, prop);
-        },
-        // input的change事件
-        inputChange(value, index, prop) {
-            this.$emit('inputChange', value, index, prop);
-        },
-        // 搜索类型select搜索
-        remoteMethod(query, index, prop) {
-            if (query) {
-                this.searchSelectLoading = true;
-                this.$emit('querySelectValue', query, index, prop);
-                setTimeout(() => {
-                    this.formItems[index].options = this.searchSelectOptionsCb;
-                    this.searchSelectLoading = false;
-                }, 500)
-            } else {
-                this.searchSelectOptios = [];
-            }
-        },
-        //switch变化
-        formSwitchChange(val, index, prop) {
-            this.$emit("formSwitchChange", val, index, prop);
-        },
-        //按钮点击事件
-        buttonClick(prop, index) {
-            this.$emit("buttonClick", prop, index);
-        },
-
-        //文件上传成功回调
-        uploadSuccess(response, file, fileList, limit, prop, index) {
-            this.formItems[index].uploadObj.hideUpload = fileList.length == limit;//文件列表变化后判断当前文件列表长度是否等于限制长度。目的，当长度相等时隐藏文件上传按钮
-            this.pushUpload(file, fileList, limit, prop);
-        },
-        //文件删除
-        handleRemove(file, fileList, limit, prop, index) {
-            this.formItems[index].uploadObj.hideUpload = fileList.length == limit;//文件删除后判断当前文件列表长度是否等于限制长度。目的，当长度相等时隐藏文件上传按钮
-            this.pushUpload(file, fileList, limit, prop);
-        },
-        // 文件预览
-        handlePictureCardPreview(file) {
-            this.dialogImageUrl = file.url;
-            this.dialogVisible = true;
-        },
-
-        //提交时验证表单，直接在父级调用
-        submitForm() {
-            let formValidate = Boolean;
-            this.$refs.refVerification.validate((valid) => {
-                if (valid) {
-                    formValidate = true;
-                } else {
-                    this.$message.warning("请把信息填写完整！");
-                    formValidate = false;
-                }
-            });
-            return formValidate;
-        },
-        /* 清空表单
-            逻辑：
-            1 、如果要清空文件上传列表，要传入要清空的upload的字段名，假如多个upload用for循环，调用清空方法！
-            2、清空upload之后，还要把upload上传框展示出来，通过字段名比对，获取到在formItems中的下标，通过下标操作对象属性，进行展示
-         */
-        resetForm(uploadArr) {
-            this.$refs.ruleForm.resetFields();
-            if (uploadArr) {
-                for (let i = 0; i < uploadArr.length; i++) {
-                    this.$refs[uploadArr[i]][0].clearFiles();
-                    let index = this.formItems.findIndex(item => item.prop == uploadArr[i]);
-                    this.formItems[index].uploadObj.hideUpload = false;
-                }
-            }
-        },
-        // 单个字段验证
-        validateFieldProp(prop) {
-            let formValidate = Boolean;
-            this.$refs.ruleForm.validateField(prop, valid => {
-                if (!valid) {
-                    formValidate = true;
-                } else {
-                    formValidate = false;
-                }
-            });
-            return formValidate;
-        },
-        // 对文件上传，删除进行赋值，调用form验证
-        pushUpload(file, fileList, limit, prop) {
-            if (fileList.length > 0) {
-                this.formData[prop] = fileList;
-            } else {
-                // 表示没有数据,把字段置空
-                this.formData[prop] = "";
-            }
-            this.$refs.ruleForm.validateField(prop);//调用验证form表单的文件上传
-        },
-        //地图input的input事件
-        aMapInput(value, prop) {
-            this.$refs[`aMap${prop}`][0].getSearch(value);
-        },
-        //子组件返回地图搜索值
-        cbSearch(val, prop) {
-            this.setSearchVal = val.tips; //子组件
-            this.searchShow = prop; //显示input输入联想
-        },
-        //选中地图值
-        selectVal(val, prop, index) {
-            // 赋值的时候，拿到键，及formItems的下标，进行赋值
-            this.formData[prop] = val.name; //input输入框赋值
-            this.formData.district = val.district; //传入省市区
-            let lngLat = {
-                lng: val.location.lng,
-                lat: val.location.lat
-            };
-            this.formData[`${prop}location`] = lngLat;
-            this.searchShow = ''; //隐藏input输入联想
-        },
-
-    }
-}
-</script>

src/components/Form/ProductCostForm.vue

@@ -0,0 +1,527 @@
+<template>
+  <div style="padding-bottom:100px;">
+    <el-form ref="productCostForm" :model="localForm" label-width="200px" :size="overSize">
+      <el-card shadow="hover" class="margin-bom">
+        <div slot="header" class="clearfix flex j-s a-c">
+          <div class="flex j-s a-c">
+            <img src="../../../src/icon/car.png" alt class="icon-img" />
+            <span>车辆信息</span>
+          </div>
+          <el-button @click="toggle('Car')" style="float: right; padding: 3px 0; color: #ff9000;" type="text">{{
+            CarCollapsed
+            ? '收起' : '展开'
+          }}</el-button>
+        </div>
+        <div class="p-2" v-show="CarCollapsed">
+          <el-col v-for=" (formItems, index) in CarAttr" :key="index" :span="formItems.attrType == 'checkbox' ? 24 : 12">
+            <el-form-item :label="formItems.attrName">
+              <template v-if="formItems.attrType == 'inputNumber'">
+                <template v-if="formItems.operator == '1' || formItems.operator == null">
+                  <el-input-number v-model="formItems.min"></el-input-number>
+                  <i class="el-icon-minus"></i>
+                  <el-input-number v-model="formItems.max"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '2'">
+                  <span>＜</span>
+                  <el-input-number v-model="formItems.min"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '3'">
+                  <span>≤</span>
+                  <el-input-number v-model="formItems.min"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '4'">
+                  <span>＞</span>
+                  <el-input-number v-model="formItems.max"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '5'">
+                  <span>≥</span>
+                  <el-input-number v-model="formItems.max"></el-input-number>
+                </template>
+                <el-select v-model="formItems.operator" @change="selectoperatorChange($event, formItems.id)"
+                  placeholder="请选择" style="width: 120px;margin-left: 20px;">
+                  <el-option v-for="operatoritem in operator" :key="operatoritem.id" :label="operatoritem.label"
+                    :value="operatoritem.value"></el-option>
+                </el-select>
+              </template>
+              <el-select v-if="formItems.attrType == 'select'" multiple v-model="formItems.minArray" placeholder="请选择"
+                style="width: 100%;" @change="selectChange($event, formItems.id, 'min')">
+                <el-option v-for="dict in formItems.dictLabal" :key="dict.code" :label="dict.name"
+                  :value="dict.name"></el-option>
+              </el-select>
+              <el-input v-if="formItems.attrType == 'input'" v-model="formItems.min"
+                placeholder="输入宝马、奥迪等）多个输入，用，隔开"></el-input>
+              <el-checkbox-group v-if="formItems.attrType == 'checkbox'" v-model="formItems.minArray"
+                @change="checkboxChange($event, formItems.id, 'min')">
+                <el-checkbox v-for="dict in formItems.dictLabal" :key="dict.id" :label="dict.name"></el-checkbox>
+              </el-checkbox-group>
+              <el-radio-group v-if="formItems.attrType == 'radio'" v-model="formItems.min">
+                <el-radio-button v-for="dict in formItems.dictLabal" :key="dict.id" :label="dict.code">{{ dict.name
+                }}</el-radio-button>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+        </div>
+      </el-card>
+      <el-card shadow="hover" class="margin-bom">
+        <div slot="header" class="clearfix flex j-s a-c">
+          <div class="flex j-s a-c">
+            <img src="../../../src/icon/car.png" alt class="icon-img" />
+            <span>车主信息</span>
+          </div>
+          <el-button @click="toggle('Carowners')" style="float: right; padding: 3px 0; color: #ff9000;" type="text">{{
+            CarownersCollapsed
+            ? '收起' : '展开'
+          }}</el-button>
+        </div>
+        <div class="p-2" v-show="CarownersCollapsed">
+          <el-col v-for=" (formItems, index) in CarownersAttr" :key="index"
+            :span="formItems.attrType == 'checkbox' ? 24 : 12">
+            <el-form-item :label="formItems.attrName">
+              <template v-if="formItems.attrType == 'inputNumber'">
+                <template v-if="formItems.operator == '1' || formItems.operator == null">
+                  <el-input-number v-model="formItems.min"></el-input-number>
+                  <i class="el-icon-minus"></i>
+                  <el-input-number v-model="formItems.max"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '2'">
+                  <span>＜</span>
+                  <el-input-number v-model="formItems.min"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '3'">
+                  <span>≤</span>
+                  <el-input-number v-model="formItems.min"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '4'">
+                  <span>＞</span>
+                  <el-input-number v-model="formItems.max"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '5'">
+                  <span>≥</span>
+                  <el-input-number v-model="formItems.max"></el-input-number>
+                </template>
+                <el-select v-model="formItems.operator" @change="selectoperatorChange($event, formItems.id)"
+                  placeholder="请选择" style="width: 120px;margin-left: 20px;">
+                  <el-option v-for="operatoritem in operator" :key="operatoritem.id" :label="operatoritem.label"
+                    :value="operatoritem.value"></el-option>
+                </el-select>
+              </template>
+              <el-select v-if="formItems.attrType == 'select'" multiple v-model="formItems.list" placeholder="请选择"
+                style="width: 100%;" @change="selectChange($event, formItems.id, 'min')">
+                <el-option v-for="dict in formItems.dictLabal" :key="dict.code" :label="dict.name"
+                  :value="dict.name"></el-option>
+              </el-select>
+              <el-input v-if="formItems.attrType == 'input'" v-model="formItems.min" placeholder="身份证前6位
+"></el-input>
+              <el-checkbox-group v-if="formItems.attrType == 'checkbox'" v-model="formItems.list"
+                @change="checkboxChange($event, formItems.id, 'min')">
+                <el-checkbox v-for="dict in formItems.dictLabal" :key="dict.id" :label="dict.name"></el-checkbox>
+              </el-checkbox-group>
+              <el-radio-group v-if="formItems.attrType == 'radio'" v-model="formItems.min">
+                <el-radio-button v-for="dict in formItems.dictLabal" :key="dict.id" :label="dict.code">{{ dict.name
+                }}</el-radio-button>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+        </div>
+      </el-card>
+      <el-card shadow="hover" class="margin-bom">
+        <div slot="header" class="clearfix flex j-s a-c">
+          <div class="flex j-s a-c">
+            <img src="../../../src/icon/car.png" alt class="icon-img" />
+            <span>投保人信息</span>
+          </div>
+          <el-button @click="toggle('Applicant')" style="float: right; padding: 3px 0; color: #ff9000;" type="text">{{
+            ApplicantCollapsed
+            ? '收起' : '展开'
+          }}</el-button>
+        </div>
+        <div class="p-2" v-show="ApplicantCollapsed">
+          <el-col v-for=" (formItems, index) in ApplicantAttr" :key="index"
+            :span="formItems.attrType == 'checkbox' ? 24 : 12">
+            <el-form-item :label="formItems.attrName">
+              <template v-if="formItems.attrType == 'inputNumber'">
+                <template v-if="formItems.operator == '1' || formItems.operator == null">
+                  <el-input-number v-model="formItems.min"></el-input-number>
+                  <i class="el-icon-minus"></i>
+                  <el-input-number v-model="formItems.max"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '2'">
+                  <span>＜</span>
+                  <el-input-number v-model="formItems.min"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '3'">
+                  <span>≤</span>
+                  <el-input-number v-model="formItems.min"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '4'">
+                  <span>＞</span>
+                  <el-input-number v-model="formItems.max"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '5'">
+                  <span>≥</span>
+                  <el-input-number v-model="formItems.max"></el-input-number>
+                </template>
+                <el-select v-model="formItems.operator" placeholder="请选择"
+                  @change="selectoperatorChange($event, formItems.id)" style="width: 120px;margin-left: 20px;">
+                  <el-option v-for="operatoritem in operator" :key="operatoritem.id" :label="operatoritem.label"
+                    :value="operatoritem.value"></el-option>
+                </el-select>
+              </template>
+              <el-select v-if="formItems.attrType == 'select'" multiple v-model="formItems.list" placeholder="请选择"
+                style="width: 100%;" @change="selectChange($event, formItems.id, 'min')">
+                <el-option v-for="dict in formItems.dictLabal" :key="dict.code" :label="dict.name"
+                  :value="dict.name"></el-option>
+              </el-select>
+              <el-input v-if="formItems.attrType == 'input'" v-model="formItems.min" placeholder="身份证前6位
+"></el-input>
+              <el-checkbox-group v-if="formItems.attrType == 'checkbox'" v-model="formItems.list"
+                @change="checkboxChange($event, formItems.id, 'min')">
+                <el-checkbox v-for="dict in formItems.dictLabal" :key="dict.id" :label="dict.name"></el-checkbox>
+              </el-checkbox-group>
+              <el-radio-group v-if="formItems.attrType == 'radio'" v-model="formItems.min">
+                <el-radio-button v-for="dict in formItems.dictLabal" :key="dict.id" :label="dict.code">{{ dict.name
+                }}</el-radio-button>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+        </div>
+      </el-card>
+      <el-card shadow="hover" class="margin-bom">
+        <div slot="header" class="clearfix flex j-s a-c">
+          <div class="flex j-s a-c">
+            <img src="../../../src/icon/car.png" alt class="icon-img" />
+            <span>被保人信息</span>
+          </div>
+          <el-button @click="toggle('Insured')" style="float: right; padding: 3px 0; color: #ff9000;" type="text">{{
+            InsuredCollapsed
+            ? '收起' : '展开'
+          }}</el-button>
+        </div>
+        <div class="p-2" v-show="InsuredCollapsed">
+          <el-col v-for=" (formItems, index) in InsuredAttr" :key="index"
+            :span="formItems.attrType == 'checkbox' ? 24 : 12">
+            <el-form-item :label="formItems.attrName">
+              <template v-if="formItems.attrType == 'inputNumber'">
+                <template v-if="formItems.operator == '1' || formItems.operator == null">
+                  <el-input-number v-model="formItems.min"></el-input-number>
+                  <i class="el-icon-minus"></i>
+                  <el-input-number v-model="formItems.max"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '2'">
+                  <span>＜</span>
+                  <el-input-number v-model="formItems.min"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '3'">
+                  <span>≤</span>
+                  <el-input-number v-model="formItems.min"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '4'">
+                  <span>＞</span>
+                  <el-input-number v-model="formItems.max"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '5'">
+                  <span>≥</span>
+                  <el-input-number v-model="formItems.max"></el-input-number>
+                </template>
+                <el-select v-model="formItems.operator" @change="selectoperatorChange($event, formItems.id)"
+                  placeholder="请选择" style="width: 120px;margin-left: 20px;">
+                  <el-option v-for="operatoritem in operator" :key="operatoritem.id" :label="operatoritem.label"
+                    :value="operatoritem.value"></el-option>
+                </el-select>
+              </template>
+              <el-select v-if="formItems.attrType == 'select'" multiple v-model="formItems.list" placeholder="请选择"
+                style="width: 100%;" @change="selectChange($event, formItems.id, 'min')">
+                <el-option v-for="dict in formItems.dictLabal" :key="dict.code" :label="dict.name"
+                  :value="dict.name"></el-option>
+              </el-select>
+              <el-input v-if="formItems.attrType == 'input'" v-model="formItems.min" placeholder="身份证前6位
+"></el-input>
+              <el-checkbox-group v-if="formItems.attrType == 'checkbox'" v-model="formItems.list"
+                @change="checkboxChange($event, formItems.id, 'min')">
+                <el-checkbox v-for="dict in formItems.dictLabal" :key="dict.id" :label="dict.name"></el-checkbox>
+              </el-checkbox-group>
+              <el-radio-group v-if="formItems.attrType == 'radio'" v-model="formItems.min">
+                <el-radio-button v-for="dict in formItems.dictLabal" :key="dict.id" :label="dict.code">{{ dict.name
+                }}</el-radio-button>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+        </div>
+      </el-card>
+      <el-card shadow="hover" class="margin-bom">
+        <div slot="header" class="clearfix flex j-s a-c">
+          <div class="flex j-s a-c">
+            <img src="../../../src/icon/car.png" alt class="icon-img" />
+            <span>险别信息</span>
+          </div>
+          <el-button @click="toggle('insuranceType')" style="float: right; padding: 3px 0; color: #ff9000;" type="text">{{
+            insuranceTypeCollapsed
+            ? '收起' : '展开'
+          }}</el-button>
+        </div>
+        <div class="p-2" v-show="insuranceTypeCollapsed">
+          <el-col v-for=" (formItems, index) in insuranceTypeAttr" :key="index"
+            :span="formItems.attrType == 'checkbox' ? 24 : 12">
+            <el-form-item :label="formItems.attrName">
+              <template v-if="formItems.attrType == 'inputNumber'">
+                <template v-if="formItems.operator == '1' || formItems.operator == null">
+                  <el-input-number v-model="formItems.min"></el-input-number>
+                  <i class="el-icon-minus"></i>
+                  <el-input-number v-model="formItems.max"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '2'">
+                  <span>＜</span>
+                  <el-input-number v-model="formItems.min"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '3'">
+                  <span>≤</span>
+                  <el-input-number v-model="formItems.min"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '4'">
+                  <span>＞</span>
+                  <el-input-number v-model="formItems.max"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '5'">
+                  <span>≥</span>
+                  <el-input-number v-model="formItems.max"></el-input-number>
+                </template>
+                <el-select v-model="formItems.operator" @change="selectoperatorChange($event, formItems.id)"
+                  placeholder="请选择" style="width: 120px;margin-left: 20px;">
+                  <el-option v-for="operatoritem in operator" :key="operatoritem.id" :label="operatoritem.label"
+                    :value="operatoritem.value"></el-option>
+                </el-select>
+              </template>
+              <el-select v-if="formItems.attrType == 'select'" multiple v-model="formItems.list" placeholder="请选择"
+                style="width: 100%;" @change="selectChange($event, formItems.id, 'min')">
+                <el-option v-for="dict in formItems.dictLabal" :key="dict.code" :label="dict.name"
+                  :value="dict.name"></el-option>
+              </el-select>
+              <el-input v-if="formItems.attrType == 'input'" v-model="formItems.min"></el-input>
+              <el-checkbox-group v-if="formItems.attrType == 'checkbox'" v-model="formItems.list"
+                @change="checkboxChange($event, formItems.id, 'min')">
+                <el-checkbox v-for="dict in formItems.dictLabal" :key="dict.id" :label="dict.name"></el-checkbox>
+              </el-checkbox-group>
+              <el-radio-group v-if="formItems.attrType == 'radio'" v-model="formItems.min">
+                <el-radio-button v-for="dict in formItems.dictLabal" :key="dict.id" :label="dict.code">{{ dict.name
+                }}</el-radio-button>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+        </div>
+      </el-card>
+      <el-card shadow="hover" class="margin-bom">
+        <div slot="header" class="clearfix flex j-s a-c">
+          <div class="flex j-s a-c">
+            <img src="../../../src/icon/car.png" alt class="icon-img" />
+            <span>保司费用因子</span>
+          </div>
+          <el-button @click="toggle('insurerCostFactor')" style="float: right; padding: 3px 0; color: #ff9000;"
+            type="text">{{
+              insurerCostFactorCollapsed
+              ? '收起' : '展开'
+            }}</el-button>
+        </div>
+        <div class="p-2" v-show="insurerCostFactorCollapsed">
+          <el-col v-for=" (formItems, index) in insurerCostFactorAttr" :key="index"
+            :span="formItems.attrType == 'checkbox' ? 24 : 12">
+            <el-form-item :label="formItems.attrName">
+              <template v-if="formItems.attrType == 'inputNumber'">
+                <template v-if="formItems.operator == '1' || formItems.operator == null">
+                  <el-input-number v-model="formItems.min"></el-input-number>
+                  <i class="el-icon-minus"></i>
+                  <el-input-number v-model="formItems.max"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '2'">
+                  <span>＜</span>
+                  <el-input-number v-model="formItems.min"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '3'">
+                  <span>≤</span>
+                  <el-input-number v-model="formItems.min"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '4'">
+                  <span>＞</span>
+                  <el-input-number v-model="formItems.max"></el-input-number>
+                </template>
+                <template v-if="formItems.operator == '5'">
+                  <span>≥</span>
+                  <el-input-number v-model="formItems.max"></el-input-number>
+                </template>
+                <el-select v-model="formItems.operator" @change="selectoperatorChange($event, formItems.id)"
+                  placeholder="请选择" style="width: 120px;margin-left: 20px;">
+                  <el-option v-for="operatoritem in operator" :key="operatoritem.id" :label="operatoritem.label"
+                    :value="operatoritem.value"></el-option>
+                </el-select>
+              </template>
+              <el-select v-if="formItems.attrType == 'select'" multiple v-model="formItems.list" placeholder="请选择"
+                style="width: 100%;" @change="selectChange($event, formItems.id, 'min')">
+                <el-option v-for="dict in formItems.dictLabal" :key="dict.code" :label="dict.name"
+                  :value="dict.name"></el-option>
+              </el-select>
+              <el-input v-if="formItems.attrType == 'input'" v-model="formItems.min"></el-input>
+              <el-checkbox-group v-if="formItems.attrType == 'checkbox'" v-model="formItems.list"
+                @change="checkboxChange($event, formItems.id, 'min')">
+                <el-checkbox v-for="dict in formItems.dictLabal" :key="dict.id" :label="dict.name"></el-checkbox>
+              </el-checkbox-group>
+              <el-radio-group v-if="formItems.attrType == 'radio'" v-model="formItems.min">
+                <el-radio-button v-for="dict in formItems.dictLabal" :key="dict.id" :label="dict.code">{{ dict.name
+                }}</el-radio-button>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+        </div>
+      </el-card>
+    </el-form>
+    <div class="flex j-c a-c" :class="{
+      'footer': true,
+    }">
+      <el-button size="small" @click="cancelForm">取消</el-button>
+      <el-button type="warning" size="small" @click="saveForm">保存</el-button>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: "ProductForm",
+  props: {
+    form: Array,
+    overSize: String,
+    cardList: Array,
+    operator: Array,
+  },
+  data() {
+    return {
+      localForm: {myArray:this.form},
+      CarCollapsed: true,
+      CarownersCollapsed: true,
+      ApplicantCollapsed: true,
+      InsuredCollapsed: true,
+      insuranceTypeCollapsed: true,
+      insurerCostFactorCollapsed: true,
+    };
+  },
+  created() {
+    console.log(this.localForm)
+  },
+  computed: {
+    CarAttr() {
+      // 车辆
+      return this.localForm.myArray.filter(item => item.attrGroup === "VehicleInformation");
+    },
+    CarownersAttr() {
+      // 车主
+      return this.localForm.myArray.filter(item => item.attrGroup === "VehicleOwnerInformation");
+    },
+    ApplicantAttr() {
+      // 投保人
+      return this.localForm.myArray.filter(item => item.attrGroup === "PolicyholderInformation");
+    },
+    InsuredAttr() {
+      // 被保人
+      return this.localForm.myArray.filter(item => item.attrGroup === "InsuredInformation");
+    },
+    insuranceTypeAttr() {
+      // 险别
+      return this.localForm.myArray.filter(item => item.attrGroup === "InsuranceInformation");
+    },
+    insurerCostFactorAttr() {
+      // 保费因子
+      return this.localForm.myArray.filter(item => item.attrGroup === "InsuranceCostFactor");
+    }
+  },
+  methods: {
+    toggle(attr) {
+      this[attr + 'Collapsed'] = !this[attr + 'Collapsed'];
+    },
+    selectoperatorChange(value, index) {
+      this.localForm.myArray.map(val => {
+        if (val.id === index) {
+          val.min = null;
+          val.max = null;
+        }
+        return val;
+      })
+    },
+    selectChange(value, index, prop) {
+      let data = "";
+      value.map((ele) => {
+        data += ele + ",";
+        return;
+      });
+      this.localForm.myArray.map(val => {
+        if (val.id === index) {
+          val[prop] = data.slice(0, -1);
+        }
+        return val;
+      })
+    },
+    checkboxChange(value, index, prop) {
+      let data = "";
+      value.map((ele) => {
+        data += ele + ",";
+        return;
+      });
+      this.localForm.myArray.map(val => {
+        if (val.id === index) {
+          val[prop] = data.slice(0, -1);
+        }
+        return val;
+      })
+    },
+    saveForm() {
+      this.$emit('saveForm', this.localForm.myArray);
+    },
+    cancelForm() {
+      this.$emit('cancelForm', false);
+    },
+  }
+}
+</script>
+<style scoped lang="scss">
+/deep/ {
+  .el-card__body {
+    padding: 0;
+  }
+
+  .el-card__header {
+    background-color: antiquewhite;
+    border: none;
+    padding: 15px 18px;
+  }
+}
+
+.margin-bom {
+  margin-bottom: 20px;
+}
+.footer {
+  width: 100%;
+  position: fixed;
+  bottom: 0;
+  right: 0;
+  background-color: #fff;
+  z-index: 9;
+  padding: 20px;
+  box-sizing: border-box;
+  box-shadow: 0 0 1px 0 #ccc;
+  transition: all 0.3s, box-shadow 0.5s;
+
+  &.shadow {
+    box-shadow: 0 -10px 10px -10px #ccc;
+  }
+}
+
+.clearfix {
+  span {
+    margin-left: 10px;
+    font-weight: bold;
+  }
+
+  .icon-img {
+    display: inline-block;
+    width: 30px;
+    height: 30px;
+
+  }
+}
+</style>
+

src/components/Form/index.vue

@@ -1,78 +0,0 @@
-<template>
-    <div>
-      <MyForm ref="publicForm" :formItems="formItems" :formData="formData" :searchSelectOptionsCb="searchSelectOptionsCb"
-        @selectChange="selectChange" @inputINPUT="inputINPUT" @inputChange="inputChange"
-        @querySelectValue="querySelectValue" @formSwitchChange="formSwitchChange" @buttonClick="buttonClick">
-      </MyForm>
-    </div>
-  </template>
-   
-  <script>
-  import MyForm from '../../components/Form/MyForm.vue';
-  import formJs from '@/components/Form/FormConfig.js'
-  export default {
-    components: {
-      MyForm
-    },
-    data() {
-      return {
-        dialog: false, //弹出框
-        formItems: formJs.formItems,
-        formData: {},
-        searchSelectOptionsCb: [], //form表单搜索select返回值
-      };
-    },
-    created() {
-    },
-    watch: {
-      dialog(newVal, oldVal) {
-        if (!newVal) {
-          this.$refs.publicForm.resetForm(); //窗口关闭清空表单
-        }
-      },
-    },
-    methods: {
-      // select选择框变化
-      selectChange(value, index, prop) {
-        console.log(value, index, prop)
-      },
-      // inpuit变化
-      inputINPUT(value, index, prop) {
-        console.log(value, index, prop)
-      },
-      // inpuit Change
-      inputChange(value, index, prop) {
-        console.log(value, index, prop)
-      },
-      // select 搜索值
-      querySelectValue(value, index, prop) {
-        console.log(value, index, prop)
-        let arr = [{
-          label: '搜索返回1号',
-          value: 1
-        }, {
-          label: '搜索返回2号',
-          value: 2
-        }];
-        this.searchSelectOptionsCb = arr;
-      },
-      // form表单switch变化
-      formSwitchChange(val, index, prop) {
-        console.log(val, index, prop)
-      },
-      // 按钮点击
-      buttonClick(index, prop) {
-        console.log(index, prop)
-      },
-      dialogOK() {
-        //判断表单验证是否通过
-        if (this.$refs.publicForm.submitForm()) {
-          console.log("success");
-          console.log(this.formData)
-        } else {
-          console.log("error")
-        }
-      },
-    }
-  }
-  </script>

src/http/moudules/insCompany.js

@@ -1,223 +1,221 @@
 import axios from '../axios'
 // 保险公司树
 export const findLeftInsTree = (data) => {
-    return axios({
-        url: '/esmInsCompany/findTree',
-        method: 'post',
-        data
-    })
+  return axios({
+    url: '/esmInsCompany/findTree',
+    method: 'post',
+    data
+  })
 }
 //获取顶级保险公司
 export const gainTopList = (data) => {
   return axios({
-      url: '/esmInsCompany/gainTopList?type='+data,
-      method: 'get',
+    url: '/esmInsCompany/gainTopList?type=' + data,
+    method: 'get',
   })
 }
 //获取其他费用权限
 export const shutdown = () => {
   return axios({
-      url: '/plt/agreement/shutdown',
-      method: 'get'
+    url: '/plt/agreement/shutdown',
+    method: 'get'
   })
 }
 //通过id得到一个保险公司实体
 export const getInsCompanyById = (id) => {
-    return axios({
-        url: '/esmInsCompany/findById?id=' + id,
-        method: 'get'
-    })
+  return axios({
+    url: '/esmInsCompany/findById?id=' + id,
+    method: 'get'
+  })
 }
 //获取保险公司驾意险产品
 export const getByCompanyId = (companyId) => {
   return axios({
-      url: '/ptl/nonCar/product/getByCompanyId/'+companyId,
-      method: 'get',
+    url: '/ptl/nonCar/product/getByCompanyId/' + companyId,
+    method: 'get',
   })
 }
 //查询地区车牌
 export const getAreaLicense = (parentNumber) => {
   return axios({
-      url: '/plt/areaLicense/getAreaLicense?parentNumber='+parentNumber,
-      method: 'get',
+    url: '/plt/areaLicense/getAreaLicense?parentNumber=' + parentNumber,
+    method: 'get',
   })
 }
 // 分页查询协议
 export const findPage = (data) => {
-    return axios({
-        url: '/esmInsCompany/findPage',
-        method: 'post',
-        data
-    })
+  return axios({
+    url: '/esmInsCompany/findPage',
+    method: 'post',
+    data
+  })
 }
-
-
 // 保存保险公司
 export const addCompany = (data) => {
-    return axios({
-        url: '/esmInsCompany/saveInsCompany',
-        method: 'post',
-        data
-    })
+  return axios({
+    url: '/esmInsCompany/saveInsCompany',
+    method: 'post',
+    data
+  })
 }
 
 // 编辑保险公司
 export const editCompany = (data) => {
-    return axios({
-        url: '/esmInsCompany/editInsCompany',
-        method: 'post',
-        data
-    })
+  return axios({
+    url: '/esmInsCompany/editInsCompany',
+    method: 'post',
+    data
+  })
 }
 export const deleteEsmCompany = (id) => {
-    return axios({
-        url: '/esmInsCompany/' + id,
-        method: 'delete',
-    })
+  return axios({
+    url: '/esmInsCompany/' + id,
+    method: 'delete',
+  })
 }
 
 // 保险公司列表（通过父级id查询）
 export const companyTree = (parentid) => {
-    return axios({
-        url: '/esmInsCompany/selectList?parentid=' + parentid,
-        method: 'post'
-    })
+  return axios({
+    url: '/esmInsCompany/selectList?parentid=' + parentid,
+    method: 'post'
+  })
 }
 
 // 删除保险公司
 export const deleteCompany = (data) => {
-    return axios({
-        url: '/esmInsCompany/deleteInsCompany?idList=' + data,
-        method: 'post'
-    })
+  return axios({
+    url: '/esmInsCompany/deleteInsCompany?idList=' + data,
+    method: 'post'
+  })
 }
 // 获取保险公司渠道模板
 export const gainAttributionTemplate = (id) => {
-    return axios({
-        url: '/esm/attribution/gainAttributionTemplate/' + id,
-        method: 'get'
-    })
+  return axios({
+    url: '/esm/attribution/gainAttributionTemplate/' + id,
+    method: 'get'
+  })
 }
 //保险公司归属信息分页查询
 export const attribution = (pageNum, pageSize) => {
-    return axios({
-        url: "/esm/attribution/findPage?pageNum=" + pageNum + '&pageSize=' + pageSize,
-        method: "get",
-    })
+  return axios({
+    url: "/esm/attribution/findPage?pageNum=" + pageNum + '&pageSize=' + pageSize,
+    method: "get",
+  })
 }
 //获取保险公司归属信息模板
 export const attributionTemplate = (insCompanyId) => {
-    return axios({
-        url: "/esm/attribution/gainAttributionTemplate/" + insCompanyId,
-        method: "get",
-    })
+  return axios({
+    url: "/esm/attribution/gainAttributionTemplate/" + insCompanyId,
+    method: "get",
+  })
 }
 //保存归属信息
 export const attributionsave = (data) => {
-    return axios({
-        url: "/esm/attribution/save",
-        method: "post",
-        data
-    })
+  return axios({
+    url: "/esm/attribution/save",
+    method: "post",
+    data
+  })
 }
 //归属授权
 export const authorize = (data) => {
-    return axios({
-        url: '/esm/attribution/authorize',
-        method: "post",
-        data
-    })
+  return axios({
+    url: '/esm/attribution/authorize',
+    method: "post",
+    data
+  })
 }
 //续保分页查询
 export const queryrenewal = (pageNum, pageSize) => {
-    return axios({
-        url: '/order/renewal?pageNum=' + pageNum + '&pageSize=' + pageSize,
-        method: "get",
-    })
+  return axios({
+    url: '/order/renewal?pageNum=' + pageNum + '&pageSize=' + pageSize,
+    method: "get",
+  })
 }
 //续保新增
 export const addrenewal = (data) => {
-    return axios({
-        url: '/order/renewal',
-        method: "post",
-        data
-    })
+  return axios({
+    url: '/order/renewal',
+    method: "post",
+    data
+  })
 }
 //续保修改
 export const qudaterenewal = (id, data) => {
-    return axios({
-        url: '/order/renewal/' + id,
-        method: "put",
-        data
-    })
+  return axios({
+    url: '/order/renewal/' + id,
+    method: "put",
+    data
+  })
 }
 //续保删除
 export const deleterenewal = (id) => {
-    return axios({
-        url: '/order/renewal/' + id,
-        method: "delete",
-    })
+  return axios({
+    url: '/order/renewal/' + id,
+    method: "delete",
+  })
 }
 //分页查询模版信息
 export const queryTemplate = (pageNum, pageSize) => {
-    return axios({
-        url: '/esm/attributionTemplate?pageNum=' + pageNum + '&pageSize=' + pageSize,
-        method: "get",
-    })
+  return axios({
+    url: '/esm/attributionTemplate?pageNum=' + pageNum + '&pageSize=' + pageSize,
+    method: "get",
+  })
 }
 //提交模版信息
 export const addTemplate = (data) => {
-    return axios({
-        url: '/esm/attributionTemplate',
-        method: "post",
-        data
-    })
+  return axios({
+    url: '/esm/attributionTemplate',
+    method: "post",
+    data
+  })
 }
 //修改模版信息
 export const updateTemplate = (id, data) => {
-    return axios({
-        url: '/esm/attributionTemplate/' + id,
-        method: "put",
-        data
-    })
+  return axios({
+    url: '/esm/attributionTemplate/' + id,
+    method: "put",
+    data
+  })
 }
 //删除模版信息
 export const deleteTemplate = (id) => {
-    return axios({
-        url: '/esm/attributionTemplate/' + id,
-        method: "delete",
-    })
+  return axios({
+    url: '/esm/attributionTemplate/' + id,
+    method: "delete",
+  })
 }
 //获取产品编号
 export const getCodeAndName = () => {
-    return axios({
-        url: '/ptl/product/getCodeAndName',
-        method: "get",
-    })
+  return axios({
+    url: '/ptl/product/getCodeAndName',
+    method: "get",
+  })
 }
 //添加协议
 export const addagreement = (data) => {
-    return axios({
-        url: '/plt/agreement',
-        method: "post",
-        data
-    })
+  return axios({
+    url: '/plt/agreement',
+    method: "post",
+    data
+  })
 }
 //分页查询协议
 export const agreementPage = (data) => {
-    return axios({
-        url: '/plt/agreement/page',
-        method: "post",
-        data
-    })
+  return axios({
+    url: '/plt/agreement/page',
+    method: "post",
+    data
+  })
 }
 //根据id查询协议信息
 export const agreementId = (agreementId) => {
-    return axios({
-        url: '/plt/agreement/'+agreementId,
-        method: "get",
+  return axios({
+    url: '/plt/agreement/' + agreementId,
+    method: "get",
 
-    })
+  })
 }
 
 //根据 协议id、归属保司信息 查询配置非车费用信息
@@ -240,73 +238,73 @@ export const findRelationAgreement = (data) => {
 }
 //删除协议
 export const deleteagreement = (agreementId) => {
-    return axios({
-        url: '/plt/agreement/'+agreementId,
-        method: "delete",
-    })
+  return axios({
+    url: '/plt/agreement/' + agreementId,
+    method: "delete",
+  })
 }
 //修改协议
-export const updateagreement = (agreementId,data) => {
-    return axios({
-        url: '/plt/agreement/'+agreementId,
-        method: "put",
-        data
-    })
+export const updateagreement = (agreementId, data) => {
+  return axios({
+    url: '/plt/agreement/' + agreementId,
+    method: "put",
+    data
+  })
 }
 // 查系统字典
 export const dicType = (type) => {
-    return axios({
-        url: '/sysDict/dictDetails/'+type,
-        method: "get",
+  return axios({
+    url: '/sysDict/dictDetails/' + type,
+    method: "get",
 
-    })
+  })
 }
 /** 归属模版模块 */
 //分页获取
-    export const pagebelong = (data) => {
-    return axios({
-        url: '/ptl/attributionTemplate/page',
-        method: "post",
-        data
-    })
+export const pagebelong = (data) => {
+  return axios({
+    url: '/ptl/attributionTemplate/page',
+    method: "post",
+    data
+  })
 }
 //新增
 export const addbelong = (data) => {
-    return axios({
-        url: '/ptl/attributionTemplate',
-        method: "post",
-        data
-    })
+  return axios({
+    url: '/ptl/attributionTemplate',
+    method: "post",
+    data
+  })
 }
 //查看
 export const querybelong = (id) => {
-    return axios({
-        url: '/ptl/attributionTemplate/'+id,
-        method: "get",
-    })
+  return axios({
+    url: '/ptl/attributionTemplate/' + id,
+    method: "get",
+  })
 }
 //修改
-export const updatebelong = (id,data) => {
-    return axios({
-        url: '/ptl/attributionTemplate/'+id,
-        method: "put",
-        data
-    })
+export const updatebelong = (id, data) => {
+  return axios({
+    url: '/ptl/attributionTemplate/' + id,
+    method: "put",
+    data
+  })
 }
 //删除
 export const deletebelong = (id) => {
-    return axios({
-        url: '/ptl/attributionTemplate/'+id,
-        method: "delete",
-    })
+  return axios({
+    url: '/ptl/attributionTemplate/' + id,
+    method: "delete",
+  })
 }
 //
 export const getPtlInsAttributionTemplate = (data) => {
-    return axios({
-        url: '/ptl/attributionTemplate/getPtlInsAttributionTemplate',
-        method: "post",
-        data
-    })
+  return axios({
+    url: '/ptl/attributionTemplate/getPtlInsAttributionTemplate',
+    method: "post",
+    data
+  })
 }
 /** 归属模版模块 */
 
@@ -315,40 +313,55 @@ export const getPtlInsAttributionTemplate = (data) => {
 //查询
 export const productCostQuery = (data) => {
   return axios({
-      url: '/plt/agreement/getProduct',
-      method: "post",
-      data
+    url: '/plt/new/agreement/getProduct',
+    method: "post",
+    data
+  })
+}
+//查询费用因子
+export const productcostFactorQuery = (costsId) => {
+  return axios({
+    url: '/plt/new/agreement/costs/get?costsId=' + costsId,
+    method: "get",
+
   })
 }
 //添加
 export const productCostSave = (data) => {
   return axios({
-      url: '/plt/agreement/productSave',
-      method: "post",
-      data
+    url: '/plt/new/agreement/costs/add',
+    method: "post",
+    data
   })
 }
 //修改
 export const productCostUpdate = (data) => {
   return axios({
-      url: '/plt/agreement/productUpdate',
-      method: "post",
-      data
+    url: '/plt/new/agreement/costs/update',
+    method: "post",
+    data
   })
 }
 //删除
 export const productCostDelete = (id) => {
   return axios({
-      url: '/plt/agreement/productDelete?id='+id,
-      method: "get",
+    url: '/plt/new/agreement/costs/delete?costsId=' + id,
+    method: "post",
   })
 }
 //历史记录
 export const productCostHistory = (data) => {
   return axios({
-      url: '/plt/agreementhistory/costsHistoryPage',
-      method: "post",
-      data
+    url: '/plt/agreementhistory/costsHistoryPage',
+    method: "post",
+    data
+  })
+}
+//获取因子表单项
+export const productConfigItem = () => {
+  return axios({
+    url: '/plt/new/agreement/attr/list',
+    method: "get",
   })
 }
 /** 协议产品费用 */
@@ -359,41 +372,48 @@ export const productCostHistory = (data) => {
 //查询
 export const getUndwrtRulesQuery = (data) => {
   return axios({
-      url: '/plt/agreement/getUndwrtRules',
-      method: "post",
-      data
+    url: '/plt/new/agreement/undwrt/rules/list',
+    method: "post",
+    data
+  })
+}
+//查询详情
+export const getUndwrtRulesFactorQuery = (ruleId) => {
+  return axios({
+    url: '/plt/new/agreement/undwrt/rules/get?ruleId=' + ruleId,
+    method: "get",
+
   })
 }
 //添加
 export const undwrtRulesSaveCostSave = (data) => {
   return axios({
-      url: '/plt/agreement/undwrtRulesSave',
-      method: "post",
-      data
+    url: '/plt/new/agreement/undwrt/rules/add',
+    method: "post",
+    data
   })
 }
 //修改
 export const undwrtRulesUpdate = (data) => {
   return axios({
-      url: '/plt/agreement/undwrtRulesUpdate',
-      method: "post",
-      data
+    url: '/plt/new/agreement/undwrt/rules/update',
+    method: "post",
+    data
   })
 }
 //删除
-export const undwrtRulesDelete = (data) => {
+export const undwrtRulesDelete = (id) => {
   return axios({
-      url: '/plt/agreement/undwrtRulesDelete',
-      method: "post",
-      data
+    url: '/plt/new/agreement/undwrt/rules/delete?ruleId=' + id,
+    method: "post",
   })
 }
 //历史记录
 export const undwrtRulesHistoryPage = (data) => {
   return axios({
-      url: '/plt/agreementhistory/rulesHistoryPage',
-      method: "post",
-      data
+    url: '/plt/agreementhistory/rulesHistoryPage',
+    method: "post",
+    data
   })
 }
 /** 协议承保规则 */
@@ -402,16 +422,16 @@ export const undwrtRulesHistoryPage = (data) => {
 //查询
 export const getNonCarProductQuery = (agreementId) => {
   return axios({
-      url: '/plt/agreement/getNonCarProduct?agreementId='+agreementId,
-      method: "get",
+    url: '/plt/agreement/getNonCarProduct?agreementId=' + agreementId,
+    method: "get",
   })
 }
 //添加
 export const nonCarProductCostSave = (data) => {
   return axios({
-      url: '/plt/agreement/nonCarProductSave',
-      method: "post",
-      data
+    url: '/plt/agreement/nonCarProductSave',
+    method: "post",
+    data
   })
 }
 /** 协议非车产品费用 */
@@ -420,9 +440,9 @@ export const nonCarProductCostSave = (data) => {
 //协议历史记录
 export const agreementHistory = (data) => {
   return axios({
-      url: '/plt/agreementhistory/agreementHistoryPage',
-      method: "post",
-      data
+    url: '/plt/agreementhistory/agreementHistoryPage',
+    method: "post",
+    data
   })
 }
 

src/views/DistributionManage/CarInsurance/DistributionManage.vue

@@ -8,30 +8,31 @@
             <div>
               <el-checkbox v-model="containsSubDept">包含下级机构</el-checkbox>
 
-              <kt-button style="background-color: #52C578;border:#52C578;margin-left: 15px;margin-bottom: 10px;"  icon="el-icon-circle-plus" label="添加分销" type="primary" perms="sys:user:add" @click="handleAddButton" />
+              <kt-button style="background-color: #52C578;border:#52C578;margin-left: 15px;margin-bottom: 10px;"
+                icon="el-icon-circle-plus" label="添加分销" type="primary" perms="sys:user:add" @click="handleAddButton" />
             </div>
             <el-divider></el-divider>
 
-            <tree :setting="ztreeSetting" :nodes="ztreeNodes" @onClick="onZTreeClick" @onCreated="onZTreeCreated"/>
+            <tree :setting="ztreeSetting" :nodes="ztreeNodes" @onClick="onZTreeClick" @onCreated="onZTreeCreated" />
           </div>
         </SplitArea>
         <!-- 左侧树End -->
 
         <!-- 右侧列表页面Start -->
         <SplitArea :size="rightSplitWidth">
-          <el-row class="queryFrom" >
+          <el-row class="queryFrom">
             <el-form ref="queryFormRef" :model="queryFrom" label-width="80px">
               <el-row>
                 <el-col :span="5">
                   <el-form-item label="分销级别">
-                    <el-select style="100%" clearable size="small"  v-model="queryFrom.retailtype" placeholder="请选择"  >
+                    <el-select style="100%" clearable size="small" v-model="queryFrom.retailtype" placeholder="请选择">
                       <el-option label="一级分销" value="1"></el-option>
                       <el-option label="二级分销" value="2"></el-option>
                       <!--<el-option label="三级分销" value="3"></el-option>-->
                     </el-select>
                   </el-form-item>
                 </el-col>
-                <el-col :span="4" >
+                <el-col :span="4">
                   <el-form-item label="">
                     <el-button size="small" type="primary" @click="queryInfo">查询</el-button>
                   </el-form-item>
@@ -41,139 +42,134 @@
           </el-row>
 
 
-            <kt-common-table permsEdit="sys:user:edit" permsDelete="sys:user:delete"  :data="pageResult" :columns="columns" editButtonName="编辑"  deleteButtonName="删除" :showBatchDelete="true" @findPage="findPage" @handleEdit="handleTableEdit" @handleDeleteFlag="handleTableDeleteFlag" @handleDelete="handleTableBatchDelete">
-            </kt-common-table>
+          <kt-common-table permsEdit="sys:user:edit" permsDelete="sys:user:delete" :data="pageResult" :columns="columns"
+            editButtonName="编辑" deleteButtonName="删除" :showBatchDelete="true" @findPage="findPage"
+            @handleEdit="handleTableEdit" @handleDeleteFlag="handleTableDeleteFlag"
+            @handleDelete="handleTableBatchDelete">
+          </kt-common-table>
         </SplitArea>
         <!-- 右侧列表页面End -->
       </Split>
     </el-main>
 
-    <el-dialog
-      v-dialogDrag
-      title="分销管理"
-      :visible.sync="dialogVisible"
-      width="1200px"
-      @close="closeDialog"
+    <el-dialog v-dialogDrag title="分销管理" :visible.sync="dialogVisible" width="1200px" @close="closeDialog"
       :before-close="handleDialogBefore">
-          <el-tabs v-model="activeTabs">
-            <el-tab-pane label="行政信息" name="first">
-              <el-form label-width="120px">
-              <el-row>
-                <el-col :span="8">
-                  <el-form-item label="机构编码">
-                    <el-input size="medium" style="width: 100%;" :value="deptInfo.id" disabled></el-input>
-                  </el-form-item>
-                </el-col>
-                <el-col :span="8">
-                  <el-form-item label="机构名称">
-                    <el-input size="medium" style="width: 100%;" :value="deptInfo.name" disabled></el-input>
-                  </el-form-item>
-                </el-col>
-                <el-col :span="8">
-                  <el-form-item label="上级机构编码" >
-                    <el-input size="medium" style="width: 100%;" :value="deptInfo.parentId" disabled></el-input>
-                  </el-form-item>
-                </el-col>
-              </el-row>
-              <el-row>
-                <el-col :span="8">
-                  <el-form-item label="机构类型" >
-                    <el-select size="medium" style="width: 100%;" disabled :value="deptInfo.comtype" placeholder="请选择">
-                      <el-option v-for="item in comtypeoptions" :key="item.label" :label="item.label" :value="item.value" ></el-option>
-                    </el-select>
-                  </el-form-item>
-                </el-col>
-                <el-col :span="8">
-                  <el-form-item label="机构级别" >
-                    <el-select size="medium" style="width: 100%;" disabled :value="deptInfo.comlevel" placeholder="请选择">
-                      <el-option v-for="item in comleveloptions" :key="item.label" :label="item.label" :value="item.value" ></el-option>
-                     </el-select>
-                  </el-form-item>
-                </el-col>
-                <el-col :span="8">
-                  <el-form-item label="机构性质">
-                    <el-select size="medium" style="width: 100%;" disabled :value="deptInfo.comattribute" placeholder="请选择">
-                      <el-option v-for="item in comattributeoptions" :key="item.label" :label="item.label" :value="item.value" ></el-option>
-                    </el-select>
-                  </el-form-item>
-                </el-col>
-              </el-row>
-              <el-row>
-                <el-col :span="24">
-                  <el-form-item label="机构地址"  style="width: 100%;">
-                    <el-input
-                      size="medium"
-                      type="textarea"
-                      :rows="3"
-                      style="width: 100%;"
-                      :autosize="{ minRows: 3, maxRows: 4}"
-                      placeholder="请输入内容"
-                      :value="deptInfo.address"
-                      disabled>
-                    </el-input>
-                  </el-form-item>
-                </el-col>
-              </el-row>
-              <el-row>
-                <el-col :span="8">
-                  <el-form-item label="团队编码" >
-                    <el-input size="medium" style="width: 100%;" :value="deptInfo.teamid" disabled></el-input>
-                  </el-form-item>
-                </el-col>
-                <el-col :span="8">
-                  <el-form-item label="团队名称">
-                    <el-input size="medium" style="width: 100%;" :value="deptInfo.teamname" disabled></el-input>
-                  </el-form-item>
-                </el-col>
-              </el-row>
-
-
-              </el-form>
-            </el-tab-pane>
-             <el-tab-pane label="分佣设置" name="second">
-                <el-form v-model="distributionForm" label-width="120px">
-                  <el-form-item label="分销方式:">
-                    <el-radio-group v-model="distributionForm.retailtype"  @change="retailtypeChange">
-                      <el-row style="margin: 15px 0px;"><el-radio label="1">一级分销</el-radio></el-row>
-                      <el-row style="margin: 15px 0px;"><el-radio label="2">二级分销</el-radio></el-row>
-                      <!--<el-row style="margin: 15px 0px;"><el-radio label="3">三级分销</el-radio></el-row>-->
-                      <el-row style="margin: 15px 0px;"><el-radio label="0">无分销分式</el-radio></el-row>
-                    </el-radio-group>
-                  </el-form-item>
-                </el-form>
-
-                <el-table :data="retailSettingForm" border style="width: 100%" :span-method="arraySpanMethod">
-                  <el-table-column label="佣金级别" align="center" prop="retailLevel">
-                    <template slot-scope="scope">
-                         {{scope.row.retailLevel}}级佣金
-                    </template>
-                  </el-table-column>
-                  <el-table-column label="佣金比例(%)" align="center"  prop="retailRate">
-                    <template slot-scope="scope">
-                         <el-input-number v-model="scope.row.retailRate" :precision="2" :min="0" :step="0.01" :max="100"></el-input-number>
-                    </template>
-                  </el-table-column>
-                  <el-table-column label="说明" align="center" width="700">
-                    <template slot-scope="scope">
-                      <template v-if ="distributionForm.retailtype == 1" >
-                         <img src="@/assets/image/distribution/distribution1.png" width="600px" />
-                      </template>
-                      <template v-if ="distributionForm.retailtype == 2" >
-                         <img src="@/assets/image/distribution/distribution2.png" width="600px"  />
-                      </template>
-                      <template v-if ="distributionForm.retailtype == 3" >
-                         <img src="@/assets/image/distribution/distribution3.png" width="600px"  />
-                      </template>
-                    </template>
-                  </el-table-column>
-                </el-table>
-             </el-tab-pane>
-        </el-tabs>
-
-
-      <span slot="footer" class="dialog-footer" v-if="activeTabs=='second'">
+      <el-tabs v-model="activeTabs">
+        <el-tab-pane label="行政信息" name="first">
+          <el-form label-width="120px">
+            <el-row>
+              <el-col :span="8">
+                <el-form-item label="机构编码">
+                  <el-input size="medium" style="width: 100%;" :value="deptInfo.id" disabled></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="机构名称">
+                  <el-input size="medium" style="width: 100%;" :value="deptInfo.name" disabled></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="上级机构编码">
+                  <el-input size="medium" style="width: 100%;" :value="deptInfo.parentId" disabled></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row>
+              <el-col :span="8">
+                <el-form-item label="机构类型">
+                  <el-select size="medium" style="width: 100%;" disabled :value="deptInfo.comtype" placeholder="请选择">
+                    <el-option v-for="item in comtypeoptions" :key="item.label" :label="item.label"
+                      :value="item.value"></el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="机构级别">
+                  <el-select size="medium" style="width: 100%;" disabled :value="deptInfo.comlevel" placeholder="请选择">
+                    <el-option v-for="item in comleveloptions" :key="item.label" :label="item.label"
+                      :value="item.value"></el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="机构性质">
+                  <el-select size="medium" style="width: 100%;" disabled :value="deptInfo.comattribute" placeholder="请选择">
+                    <el-option v-for="item in comattributeoptions" :key="item.label" :label="item.label"
+                      :value="item.value"></el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row>
+              <el-col :span="24">
+                <el-form-item label="机构地址" style="width: 100%;">
+                  <el-input size="medium" type="textarea" :rows="3" style="width: 100%;"
+                    :autosize="{ minRows: 3, maxRows: 4 }" placeholder="请输入内容" :value="deptInfo.address" disabled>
+                  </el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row>
+              <el-col :span="8">
+                <el-form-item label="团队编码">
+                  <el-input size="medium" style="width: 100%;" :value="deptInfo.teamid" disabled></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="团队名称">
+                  <el-input size="medium" style="width: 100%;" :value="deptInfo.teamname" disabled></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+
+
+          </el-form>
+        </el-tab-pane>
+        <el-tab-pane label="分佣设置" name="second">
+          <el-form v-model="distributionForm" label-width="120px">
+            <el-form-item label="分销方式:">
+              <el-radio-group v-model="distributionForm.retailtype" @change="retailtypeChange">
+                <el-row style="margin: 15px 0px;"><el-radio label="1">一级分销</el-radio></el-row>
+                <el-row style="margin: 15px 0px;"><el-radio label="2">二级分销</el-radio></el-row>
+                <!--<el-row style="margin: 15px 0px;"><el-radio label="3">三级分销</el-radio></el-row>-->
+                <el-row style="margin: 15px 0px;"><el-radio label="0">无分销分式</el-radio></el-row>
+              </el-radio-group>
+            </el-form-item>
+          </el-form>
+
+          <el-table :data="retailSettingForm" border style="width: 100%" :span-method="arraySpanMethod">
+            <el-table-column label="佣金级别" align="center" prop="retailLevel">
+              <template slot-scope="scope">
+                {{ scope.row.retailLevel }}级佣金
+              </template>
+            </el-table-column>
+            <el-table-column label="佣金比例(%)" align="center" prop="retailRate">
+              <template slot-scope="scope">
+                <el-input-number v-model="scope.row.retailRate" :precision="2" :min="0" :step="0.01"
+                  :max="100"></el-input-number>
+              </template>
+            </el-table-column>
+            <el-table-column label="说明" align="center" width="700">
+              <template slot-scope="scope">
+                <template v-if="distributionForm.retailtype == 1">
+                  <img src="@/assets/image/distribution/distribution1.png" width="600px" />
+                </template>
+                <template v-if="distributionForm.retailtype == 2">
+                  <img src="@/assets/image/distribution/distribution2.png" width="600px" />
+                </template>
+                <template v-if="distributionForm.retailtype == 3">
+                  <img src="@/assets/image/distribution/distribution3.png" width="600px" />
+                </template>
+              </template>
+            </el-table-column>
+          </el-table>
+        </el-tab-pane>
+      </el-tabs>
+
+
+      <span slot="footer" class="dialog-footer" v-if="activeTabs == 'second'">
         <el-button size="small" @click="dialogVisible = false">取 消</el-button>
-        <el-button size="small"  type="primary" @click="comfirmRetail">确 定</el-button>
+        <el-button size="small" type="primary" @click="comfirmRetail">确 定</el-button>
       </span>
     </el-dialog>
 
@@ -181,396 +177,401 @@
 </template>
 
 <script>
-  import Cookies from "js-cookie"
-  import KtButton from "@/views/Core/KtButton"; // 按钮权限组件
-  import tree from "@/components/ztree.vue";  // 机构树组件
-  import KtCommonTable from "@/views/Core/KtCommonTable.vue";//表格组件
-  import CommonUtil from "@/utils/comutil.js"
-  export default {
-    components: {
-      KtButton,
-      tree,
-      KtCommonTable
-    },
-    data() {
-
-      return {
-        peopleid:"",
-        peopledeptid:"",
-        /**Split 开始 */
-        leftSplitWidth: 20,
-        rightSplitWidth: 80,
-        /**Split 结束 */
-
-        containsSubDept:true,
-
-        //----ztreeLeft begin---------
-        ztreeObj: null,
-        ztreeSetting: {
-          check: {
-            enable: false
-          },
-          data: {
-            simpleData: {
-              enable: true,
-              pIdKey: "parentId"
-            }
-          },
-          view: {
-            showIcon: false
-          }
-        },
-        ztreeNodes: [],
-        currentTreeNode: null,
-        //----ztreeLeft end---------
-
-        //------------下拉框数据字典   begin-----------------
-        comleveloptions: [],
-        comattributeoptions: [],
-        comtypeoptions: [],
-        //------------下拉框数据字典   end-----------------
-
-        // 弹出框start-------
-        dialogVisible:false,
-        activeTabs:"first",
-        deptInfo:{},
-
-        retailSettingForm:[],
-
-        distributionForm:{
-          id:"",
-          retailtype:'', //分销方式
-          disrate1:0,   //一级分销比例
-          disrate2:0,   //二级分销比例
-          disrate3:0,   //三级分销比例ss
-          creator:'',    //创建人
-          createtime:"",//创建时间
-        },
-        // 弹出框 End--------
+import Cookies from "js-cookie"
+import KtButton from "@/views/Core/KtButton"; // 按钮权限组件
+import tree from "@/components/ztree.vue";  // 机构树组件
+import KtCommonTable from "@/views/Core/KtCommonTable.vue";//表格组件
+import CommonUtil from "@/utils/comutil.js"
+export default {
+  components: {
+    KtButton,
+    tree,
+    KtCommonTable
+  },
+  data() {
+
+    return {
+      peopleid: "",
+      peopledeptid: "",
+      /**Split 开始 */
+      leftSplitWidth: 20,
+      rightSplitWidth: 80,
+      /**Split 结束 */
 
-        // 右侧列表查询数据Start
-        queryFrom:{
-          "retailtype":""
+      containsSubDept: true,
+
+      //----ztreeLeft begin---------
+      ztreeObj: null,
+      ztreeSetting: {
+        check: {
+          enable: false
         },
-        pageResult: {},
-        pageRequest: {  //查询的默认条件
-          pageNum: 1,
-          pageSize: 20,
-          columnFilters: {
-            "deptid": {
-              "name": "deptid",
-              "value": ''
-            },
-            "containsSubDept":{
-              "name":"containsSubDept",
-              "value":"1"
-            },
-            "retailtype":{
-              "name":"retailtype",
-              "value":""
-            },
-            // "status":{
-            //   "name":"status",
-            //   "value":"2"
-            // }
+        data: {
+          simpleData: {
+            enable: true,
+            pIdKey: "parentId"
           }
         },
-        columns: [ // 数据列
-          { prop: "id",label: "分销编码",minWidth: 80,sortable: false},
-          { prop: "deptid",label: "团队编码",minWidth: 80,sortable: false},
-          { prop: "deptname",label: "团队名称",minWidth: 80,sortable: false},
-          { prop: "retailtype",label: "分销方式",minWidth: 80,sortable: false},
-          { prop: "disrate1",label: "一级佣金比例",minWidth: 80,sortable: false},
-          { prop: "disrate2",label: "二级佣金比例",minWidth: 80,sortable: false},
-          { prop: "disrate3",label: "三级佣金比例",minWidth: 80,sortable: false},
-          // { prop: "display",label: "是否显示用佣金",minWidth: 80,sortable: false},
-          // { prop: "paytype",label: "提现方式",minWidth: 120,sortable: false},
-          // { prop: "minamount",label: "最少提现额度",minWidth: 120,sortable: false},
-          // { prop: "maxamount",label: "每日提现上限",minWidth: 100,sortable: false},
-          // { prop: "status", label: "状态", minWidth: 70, sortable: false},
-          { prop: "creator",label: "创建人",minWidth: 100,sortable: false},
-          { prop: "createtime",label: "创建时间",minWidth: 100,sortable: false}
-        ],
-        // 右侧列表查询数据End
-      }
-    },
-
-    mounted() {
-      this.findLeftTreeData();// 获取机构树的数据
-      //用像素初始化左边的split的宽度
-      this.changeTreeWidth(240);// 初始化树的宽度
-    },
-    watch:{
-      containsSubDept(){ // 监听是否包含下级
-        this.pageRequest.columnFilters.containsSubDept.value = this.containsSubDept ? "1" : "0";
-        this.findPage();
-      }
-    },
-    created() {
-      this.peopleid = Cookies.get('user');
-      if(this.peopleid!='admin'){
-        this.peopledeptid = Cookies.get('user').split('D')[0];
-        this.pageRequest.columnFilters.deptid.value = this.peopledeptid;
-      }else{
-        this.peopledeptid = '9';
-        this.pageRequest.columnFilters.deptid.value = this.peopledeptid;
-      }
-      //获取所有下拉框数据(字典)
-      this.getDictItems("comlevel");
-      this.getDictItems("comattribute");
-      this.getDictItems("comtype");
-    },
-    methods: {
-      /**Split 开始 */
-      changeTreeWidth(widthVal){
-        // 初始化树的宽度
-        this.leftSplitWidth = Math.ceil(widthVal/this.$refs.elMain.$el.clientWidth*100);
-        this.rightSplitWidth = 100-(this.leftSplitWidth)
-      },
-      /**Split 结束 */
-      getDictItems(typeName) {
-      //--数据字典--
-        this.$api.dict.findByLableName(typeName).then((response)=>{
-          this[typeName + "options"] = response.data; // 把获取到的数据赋给this.data
-        }).catch((error)=>{
-          this[typeName + "options"] = [];
-        })
+        view: {
+          showIcon: false
+        }
       },
-      //--left tree begin-------
-      findLeftTreeData: function() {
-        // 获取数据
-        this.$api.dept.findLeftDeptTree(this.peopledeptid).then(res => {
-          this.ztreeNodes = res.data;
-        });
+      ztreeNodes: [],
+      currentTreeNode: null,
+      //----ztreeLeft end---------
+
+      //------------下拉框数据字典   begin-----------------
+      comleveloptions: [],
+      comattributeoptions: [],
+      comtypeoptions: [],
+      //------------下拉框数据字典   end-----------------
+
+      // 弹出框start-------
+      dialogVisible: false,
+      activeTabs: "first",
+      deptInfo: {},
+
+      retailSettingForm: [],
+
+      distributionForm: {
+        id: "",
+        retailtype: '', //分销方式
+        disrate1: 0,   //一级分销比例
+        disrate2: 0,   //二级分销比例
+        disrate3: 0,   //三级分销比例ss
+        creator: '',    //创建人
+        createtime: "",//创建时间
       },
-      onZTreeCreated: function(ztreeObj) {
-        this.ztreeObj = ztreeObj;
-        // onCreated 中操作ztreeObj对象展开第一个节点
-        ztreeObj.expandNode(ztreeObj.getNodes()[0], true);
-        this.currentTreeNode=ztreeObj.getNodes()[0];
+      // 弹出框 End--------
+
+      // 右侧列表查询数据Start
+      queryFrom: {
+        "retailtype": ""
       },
-      onZTreeClick: function(evt, treeId, treeNode) {
-        // 点击事件
-        console.log(evt.type, treeNode);
-        this.currentTreeNode = treeNode;
-        this.pageRequest.columnFilters.deptid.value = this.currentTreeNode.id;
-        this.findPage();
+      pageResult: {},
+      pageRequest: {  //查询的默认条件
+        pageNum: 1,
+        pageSize: 20,
+        columnFilters: {
+          "deptid": {
+            "name": "deptid",
+            "value": ''
+          },
+          "containsSubDept": {
+            "name": "containsSubDept",
+            "value": "1"
+          },
+          "retailtype": {
+            "name": "retailtype",
+            "value": ""
+          },
+          // "status":{
+          //   "name":"status",
+          //   "value":"2"
+          // }
+        }
       },
-      //--left tree start-------
+      columns: [ // 数据列
+        { prop: "id", label: "分销编码", minWidth: 80, sortable: false },
+        { prop: "deptid", label: "团队编码", minWidth: 80, sortable: false },
+        { prop: "deptname", label: "团队名称", minWidth: 80, sortable: false },
+        { prop: "retailtype", label: "分销方式", minWidth: 80, sortable: false },
+        { prop: "disrate1", label: "一级佣金比例", minWidth: 80, sortable: false },
+        { prop: "disrate2", label: "二级佣金比例", minWidth: 80, sortable: false },
+        { prop: "disrate3", label: "三级佣金比例", minWidth: 80, sortable: false },
+        // { prop: "display",label: "是否显示用佣金",minWidth: 80,sortable: false},
+        // { prop: "paytype",label: "提现方式",minWidth: 120,sortable: false},
+        // { prop: "minamount",label: "最少提现额度",minWidth: 120,sortable: false},
+        // { prop: "maxamount",label: "每日提现上限",minWidth: 100,sortable: false},
+        // { prop: "status", label: "状态", minWidth: 70, sortable: false},
+        { prop: "creator", label: "创建人", minWidth: 100, sortable: false },
+        { prop: "createtime", label: "创建时间", minWidth: 100, sortable: false }
+      ],
+      // 右侧列表查询数据End
+    }
+  },
+
+  mounted() {
+    this.findLeftTreeData();// 获取机构树的数据
+    //用像素初始化左边的split的宽度
+    this.changeTreeWidth(240);// 初始化树的宽度
+  },
+  watch: {
+    containsSubDept() { // 监听是否包含下级
+      this.pageRequest.columnFilters.containsSubDept.value = this.containsSubDept ? "1" : "0";
+      this.findPage();
+    }
+  },
+  created() {
+    this.peopleid = Cookies.get('user');
+    if (this.peopleid != 'admin') {
+      this.peopledeptid = Cookies.get('user').split('D')[0];
+      this.pageRequest.columnFilters.deptid.value = this.peopledeptid;
+    } else {
+      this.peopledeptid = '9';
+      this.pageRequest.columnFilters.deptid.value = this.peopledeptid;
+    }
+    //获取所有下拉框数据(字典)
+    this.getDictItems("comlevel");
+    this.getDictItems("comattribute");
+    this.getDictItems("comtype");
+  },
+  methods: {
+    /**Split 开始 */
+    changeTreeWidth(widthVal) {
+      // 初始化树的宽度
+      this.leftSplitWidth = Math.ceil(widthVal / this.$refs.elMain.$el.clientWidth * 100);
+      this.rightSplitWidth = 100 - (this.leftSplitWidth)
+    },
+    /**Split 结束 */
+    getDictItems(typeName) {
+      //--数据字典--
+      this.$api.dict.findByLableName(typeName).then((response) => {
+        this[typeName + "options"] = response.data; // 把获取到的数据赋给this.data
+      }).catch((error) => {
+        this[typeName + "options"] = [];
+      })
+    },
+    //--left tree begin-------
+    findLeftTreeData: function () {
+      // 获取数据
+      this.$api.dept.findLeftDeptTree(this.peopledeptid).then(res => {
+        this.ztreeNodes = res.data;
+      });
+    },
+    onZTreeCreated: function (ztreeObj) {
+      this.ztreeObj = ztreeObj;
+      // onCreated 中操作ztreeObj对象展开第一个节点
+      ztreeObj.expandNode(ztreeObj.getNodes()[0], true);
+      this.currentTreeNode = ztreeObj.getNodes()[0];
+    },
+    onZTreeClick: function (evt, treeId, treeNode) {
+      // 点击事件
+      console.log(evt.type, treeNode);
+      this.currentTreeNode = treeNode;
+      this.pageRequest.columnFilters.deptid.value = this.currentTreeNode.id;
+      this.findPage();
+    },
+    //--left tree start-------
 
-      // 查询Start
-      queryInfo(val){
-        this.pageRequest.columnFilters.retailtype.value = this.queryFrom.retailtype;
-        this.pageRequest.pageNum = 1;
-        this.findPage();
-      },
-      // 查询End
+    // 查询Start
+    queryInfo(val) {
+      this.pageRequest.columnFilters.retailtype.value = this.queryFrom.retailtype;
+      this.pageRequest.pageNum = 1;
+      this.findPage();
+    },
+    // 查询End
 
 
-      // 右侧工具方法Start
-      handleAddButton(){
-          if(this.currentTreeNode == null ){
-            return this.$message.info("请选择门店下团队");
-          }
-          this.activeTabs = 'first'
-          // 查询机构信息
-          this.$api.dept.getDeptById(this.currentTreeNode.id).then(res => {
-            console.log(res.data);
-            if((res.data.deptType =='D') && (res.data.id.indexOf('M')>=0)){
-              this.$api.dept.getDeptById(res.data.parentId).then(result => {
-                this.deptInfo = result.data;
-                this.deptInfo.teamid = res.data.id;
-                this.deptInfo.teamname = res.data.name;
-                this.dialogVisible = true;
-              })
-            }else{
-              return this.$message.info("请选择门店下团队");
-            }
-          })
-      },
-      handleDialogBefore(done) {
-        // 退出对话框之前确认提示
-        var that = this;
-        this.$confirm('确认关闭？')
-          .then(_ => {
-            done();
+    // 右侧工具方法Start
+    handleAddButton() {
+      if (this.currentTreeNode == null) {
+        return this.$message.info("请选择门店下团队");
+      }
+      this.activeTabs = 'first'
+      // 查询机构信息
+      this.$api.dept.getDeptById(this.currentTreeNode.id).then(res => {
+        console.log(res.data);
+        if ((res.data.deptType == 'D') && (res.data.id.indexOf('M') >= 0)) {
+          this.$api.dept.getDeptById(res.data.parentId).then(result => {
+            this.deptInfo = result.data;
+            this.deptInfo.teamid = res.data.id;
+            this.deptInfo.teamname = res.data.name;
+            this.dialogVisible = true;
           })
-          .catch(_ => {});
-      },
-      // 右侧工具方法End
-
-      // 右侧列表的方法Start
-      findPage(data) {
-        // 获取分页数据
-        if(data && data.pageRequest){
-          this.pageRequest.pageNum = data.pageRequest.pageNum;
-          this.pageRequest.pageSize = data.pageRequest.pageSize;
+        } else {
+          return this.$message.info("请选择门店下团队");
         }
-        this.$api.retail.findPage(this.pageRequest).then((res) => {
-          console.log(res.data)
-          this.pageResult = res.data;
-        }).then(data != null ? data.callback : '')
-      },
-      //编辑
-      handleTableEdit(data) {
-        console.log(data);
-        var deptid = data.row.deptid.split('D')[0];
-        this.$api.dept.getDeptById(deptid).then(res => {
-          if(res.code = 200){
-            console.log(data.row)
-            this.deptInfo = res.data;
-            this.deptInfo.teamid = data.row.deptid;
-            this.deptInfo.teamname = data.row.deptname;
-            this.distributionForm = data.row;
-            // this.distributionForm.paytype = data.row.paytype.split(',');
-            this.retailSettingForm=[];
-            for(let i=0;i<data.row.retailtype;i++){
-              this.retailSettingForm.push({
-                retailLevel:(i+1),
-                retailRate:data.row['disrate'+(i+1)]
-              })
-            }
-            this.dialogVisible = true;
-          }else{
-            this.$message.info("加载失败");
+      })
+    },
+    handleDialogBefore(done) {
+      // 退出对话框之前确认提示
+      var that = this;
+      this.$confirm('确认关闭？')
+        .then(_ => {
+          done();
+        })
+        .catch(_ => { });
+    },
+    // 右侧工具方法End
+
+    // 右侧列表的方法Start
+    findPage(data) {
+      // 获取分页数据
+      if (data && data.pageRequest) {
+        this.pageRequest.pageNum = data.pageRequest.pageNum;
+        this.pageRequest.pageSize = data.pageRequest.pageSize;
+      }
+      this.$api.retail.findPage(this.pageRequest).then((res) => {
+        console.log(res.data)
+        this.pageResult = res.data;
+      }).then(data != null ? data.callback : '')
+    },
+    //编辑
+    handleTableEdit(data) {
+      let dataObj = Object.assign({}, data.row)
+      var deptid = dataObj.deptid.split('D')[0];
+      this.$api.dept.getDeptById(deptid).then(res => {
+        if (res.code = 200) {
+          this.deptInfo = res.data;
+          this.deptInfo.teamid = dataObj.deptid;
+          this.deptInfo.teamname = dataObj.deptname;
+          this.distributionForm = dataObj;
+          // this.distributionForm.paytype = data.row.paytype.split(',');
+          this.retailSettingForm = [];
+          for (let i = 0; i < dataObj.retailtype; i++) {
+            this.retailSettingForm.push({
+              retailLevel: (i + 1),
+              retailRate: dataObj['disrate' + (i + 1)]
+            })
           }
+          this.dialogVisible = true;
+        } else {
+          this.$message.info("加载失败");
+        }
 
-        })
-        return ;
-      },
-      // 批量删除人员
-      handleTableBatchDelete(data) {
+      })
+      return;
+    },
+    // 批量删除人员
+    handleTableBatchDelete(data) {
 
-      },
-      // 删除单个人员
-      handleTableDeleteFlag(data) {
+    },
+    // 删除单个人员
+    handleTableDeleteFlag(data) {
 
-      },
-      // 右侧列表的方法End
+    },
+    // 右侧列表的方法End
 
 
 
-      // 新增或修改的弹出框Start
+    // 新增或修改的弹出框Start
 
 
-      closeDialog(){
-        // 清空数据
-        this.deptInfo={};
-        this.retailSettingForm=[];
+    closeDialog() {
+      // 清空数据
+      this.deptInfo = {};
+      this.retailSettingForm = [];
 
-        this.distributionForm.id="";
-        this.distributionForm.retailtype="";
-        this.distributionForm.disrate1=0;
-        this.distributionForm.disrate2=0;
-        this.distributionForm.disrate3=0;
-        // this.distributionForm.display='';
-        // this.distributionForm.usergroup='';
-        // this.distributionForm.status='';
-        // this.distributionForm.paytype=[];
-        // this.distributionForm.minamount=1;
-        // this.distributionForm.maxamount=1000;
-        // this.distributionForm.commission=0;
-        this.distributionForm.creator='';
-        this.distributionForm.createtime='';
-      },
-      // 提交
-      submitForm() {
+      this.distributionForm.id = "";
+      this.distributionForm.retailtype = "";
+      this.distributionForm.disrate1 = 0;
+      this.distributionForm.disrate2 = 0;
+      this.distributionForm.disrate3 = 0;
+      // this.distributionForm.display='';
+      // this.distributionForm.usergroup='';
+      // this.distributionForm.status='';
+      // this.distributionForm.paytype=[];
+      // this.distributionForm.minamount=1;
+      // this.distributionForm.maxamount=1000;
+      // this.distributionForm.commission=0;
+      this.distributionForm.creator = '';
+      this.distributionForm.createtime = '';
+    },
+    // 提交
+    submitForm() {
 
-      },
+    },
 
-      // 新增或修改的弹出框End
+    // 新增或修改的弹出框End
 
-      //新增分销Start
-      retailtypeChange(e){
-        //修改分销模式
-        this.retailSettingForm=[];
-        for(let i=0;i<e;i++){
-          this.retailSettingForm.push({
-            retailLevel:(i+1),
-            retailRate:0
-          })
+    //新增分销Start
+    retailtypeChange(e) {
+      //修改分销模式
+      this.retailSettingForm = [];
+      for (let i = 0; i < e; i++) {
+        this.retailSettingForm.push({
+          retailLevel: (i + 1),
+          retailRate: 0
+        })
+      }
+    },
+    arraySpanMethod({ row, column, rowIndex, columnIndex }) {
+      //合并单元格
+      if (columnIndex === 2) {
+        let _row_1 = 0;
+        if (rowIndex === 0) {
+          _row_1 = this.retailSettingForm.length;
+        } else {
+          _row_1 = 0;
         }
-      },
-      arraySpanMethod({row, column, rowIndex, columnIndex}) {
-        //合并单元格
-        if (columnIndex === 2) {
-          let _row_1 =0;
-         if (rowIndex === 0) {
-            _row_1 = this.retailSettingForm.length;
-         }else{
-            _row_1 = 0;
-         }
-         const _col_1 = _row_1 > 0 ? 1 : 0; //如果被合并了_row=0则它这个列需要取消
-         return {
+        const _col_1 = _row_1 > 0 ? 1 : 0; //如果被合并了_row=0则它这个列需要取消
+        return {
           rowspan: _row_1,
           colspan: _col_1
-         }
         }
-       },
-       comfirmRetail(){
-         if(this.distributionForm.retailtype==''){
-           return this.$message.info("请选择分销方式");
-         }
-         // if(this.distributionForm.display=''){
-         //   return this.$message.info("请选择是否显示佣金");
-         // }]
-         // if(this.distributionForm.paytype.length==0){
-         //    return this.$message.info("请选择提现方式");
-         // }
-
-         let param = {};
-         Object.assign(param,this.distributionForm);
-         param.deptid = this.deptInfo.teamid;
-         param.deptname = this.deptInfo.teamname;
-         // param.paytype = param.paytype.toString();
-
-         param.disrate1 = '';
-         param.disrate2 = '';
-         param.disrate3 = '';
-
-         for(let i=0;i<this.retailSettingForm.length;i++){
-           console.log('disrate'+this.retailSettingForm[i].retailLevel)
-           param['disrate'+this.retailSettingForm[i].retailLevel] = this.retailSettingForm[i].retailRate;
-         }
-
-         this.$api.retail.saveRetail(param).then(res => {
-           if(res.code == 200){
-             this.$message.success("操作成功");
-             this.findPage()
-             this.dialogVisible = false;
-           }else{
-             this.$message.info("操作失败 "+res.msg);
-           }
-
-         }).catch(err=>{
-           this.$message.error("操作失败")
-         })
-       }
-      // 新增分销End
+      }
+    },
+    comfirmRetail() {
+      if (this.distributionForm.retailtype == '') {
+        return this.$message.info("请选择分销方式");
+      }
+      // if(this.distributionForm.display=''){
+      //   return this.$message.info("请选择是否显示佣金");
+      // }]
+      // if(this.distributionForm.paytype.length==0){
+      //    return this.$message.info("请选择提现方式");
+      // }
+
+      let param = {};
+      Object.assign(param, this.distributionForm);
+      param.deptid = this.deptInfo.teamid;
+      param.deptname = this.deptInfo.teamname;
+      // param.paytype = param.paytype.toString();
+
+      param.disrate1 = '';
+      param.disrate2 = '';
+      param.disrate3 = '';
+
+      for (let i = 0; i < this.retailSettingForm.length; i++) {
+        console.log('disrate' + this.retailSettingForm[i].retailLevel)
+        param['disrate' + this.retailSettingForm[i].retailLevel] = this.retailSettingForm[i].retailRate;
+      }
 
+      this.$api.retail.saveRetail(param).then(res => {
+        if (res.code == 200) {
+          this.$message.success("操作成功");
+          this.findPage()
+          this.dialogVisible = false;
+        } else {
+          this.$message.info("操作失败 " + res.msg);
+        }
 
+      }).catch(err => {
+        this.$message.error("操作失败")
+      })
     }
-  }
-</script>
-
-<style scoped>
-  .el-divider--horizontal {
-    margin: 4px 0;
-  }
+    // 新增分销End
 
-  /* 顶部查询条件样式Start */
-  .queryFrom .el-row {
-    margin: 10px 0px;
-  }
 
-  .queryFrom .el-form-item {
-    margin-bottom: 0px;
-  }
-
-  .queryFrom .queryButton .el-form-item__content {
-    margin-left: 0px !important;
   }
+}
+</script>
 
-  /* 顶部查询条件样式End */
-  .icon { width: 1em; height: 1em; vertical-align: -0.15em; fill: currentColor; overflow: hidden; }
+<style scoped>
+.el-divider--horizontal {
+  margin: 4px 0;
+}
+
+/* 顶部查询条件样式Start */
+.queryFrom .el-row {
+  margin: 10px 0px;
+}
+
+.queryFrom .el-form-item {
+  margin-bottom: 0px;
+}
+
+.queryFrom .queryButton .el-form-item__content {
+  margin-left: 0px !important;
+}
+
+/* 顶部查询条件样式End */
+.icon {
+  width: 1em;
+  height: 1em;
+  vertical-align: -0.15em;
+  fill: currentColor;
+  overflow: hidden;
+}
 </style>

src/views/FinancialManagement/CarInsurance/Verifytasks/Verifyintasks.vue

@@ -341,16 +341,16 @@
           <el-table :data="feeDetailInfo"   :border="true"   width="100%"  :stripe="true" size="mini">
             <el-table-column prop="feeTypeName" label="费用类型" width="10%"></el-table-column>
             <el-table-column  label="交强险费用跟单明细" width="30%">
-              <el-table-column prop="jqFeeRateAll" label="手续费比例/跟单费比例/总比例" width="15%"></el-table-column>
-              <el-table-column prop="jqFeeAmountAll" label="手续费金额/跟单费金额/总金额" width="15%"></el-table-column>
+              <el-table-column prop="jqFeeRateAll" label="手续费比例/跟单费比例/加投比例/总比例" width="15%"></el-table-column>
+              <el-table-column prop="jqFeeAmountAll" label="手续费金额/跟单费金额/加投金额/总金额" width="15%"></el-table-column>
             </el-table-column>
             <el-table-column  label="商业险费用跟单明细" width="30%">
-              <el-table-column prop="syFeeRateAll" label="手续费比例/跟单费比例/总比例" width="15%"></el-table-column>
-              <el-table-column prop="syFeeAmountAll" label="手续费金额/跟单费金额/总金额" width="15%"></el-table-column>
+              <el-table-column prop="syFeeRateAll" label="手续费比例/跟单费比例/加投比例/总比例" width="15%"></el-table-column>
+              <el-table-column prop="syFeeAmountAll" label="手续费金额/跟单费金额/加投金额/总金额" width="15%"></el-table-column>
             </el-table-column>
             <el-table-column   label="非车险费用跟单明细" width="30%">
-              <el-table-column prop="fcFeeRate" label="比例" width="15%"></el-table-column>
-              <el-table-column prop="fcFeeAmount" label="金额" width="15%"></el-table-column>
+              <el-table-column prop="fcFeeRateAll" label="手续费比例/跟单费比例/总比例" width="15%"></el-table-column>
+              <el-table-column prop="fcFeeAmountAll" label="手续费金额/跟单费金额/总金额" width="15%"></el-table-column>
             </el-table-column>
           </el-table>
         </div>
@@ -550,7 +550,7 @@ export default {
         } else {
           this.$message.error("订单获取失败");
         }
-        
+
       });
     },
     // 设置每页条数

src/views/Intro/Intro.vue

@@ -1,19 +1,9 @@
 <template>
   <div class="page-container" style="width:100%;margin-top:15px;">
-    <!-- <MyForm ref="publicForm" :formItems="formItems" :formData="formData" :refVerification="refVerification" :searchSelectOptionsCb="searchSelectOptionsCb"
-        @selectChange="selectChange" @inputINPUT="inputINPUT" @inputChange="inputChange"
-        @querySelectValue="querySelectValue" @formSwitchChange="formSwitchChange" @buttonClick="buttonClick">
-      </MyForm> -->
-    
   </div>
 </template>
 <script>
-  import MyForm from '../../components/Form/MyForm.vue';
-  import formJs from '@/components/Form/FormConfig.js'
 export default {
-  components: {
-    MyForm
-  },
   data() {
       return {
         // dialog: false, //弹出框