| | |
| | | <el-form :model="addFieldForm" :rules="addFieldRules" :disabled="mode=='show'" ref="dialogForm" label-width="100px" label-position="center"> |
| | | <el-row> |
| | | <el-col :span="24"> |
| | | <el-form-item label="字段名称" prop="code"> |
| | | <el-input v-model="addFieldForm.code" placeholder="输入一个符合阅读习惯的简短名称,建议4个字符,最多不超过12字" clearable></el-input> |
| | | <el-form-item label="字段名称" prop="fieldName"> |
| | | <el-input v-model="addFieldForm.fieldName" placeholder="输入一个符合阅读习惯的简短名称,建议4个字符,最多不超过12字" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24"> |
| | | <el-form-item label="提示文字" prop="dictValue"> |
| | | <el-input v-model="addFieldForm.dictValue" placeholder="描述提示用户如何填写字段值(例如:请输入名字)" clearable></el-input> |
| | | <el-form-item label="提示文字"> |
| | | <el-input v-model="addFieldForm.fieldDescription" placeholder="描述提示用户如何填写字段值(例如:请输入名字)" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24"> |
| | | <el-form-item label="字段类型" prop="deptId"> |
| | | <el-select v-model="addFieldForm.test" style="width: 100%" @change="deptIdChange" placeholder="选择符合业务的字段类型"> |
| | | <el-option v-for="item in fieldTypeList" :key="item.id" :label="item.title" :value="item.id"/> |
| | | <el-form-item label="字段类型"> |
| | | <el-select v-model="addFieldForm.fieldType" style="width: 100%" placeholder="选择符合业务的字段类型"> |
| | | <el-option v-for="item in fieldTypeList" :disabled="item.disabled" :key="item.id" :label="item.title" :value="item.id"/> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <!-- 变量1 输入框 --> |
| | | <el-col :span="24"> |
| | | <el-col :span="24" v-if="addFieldForm.fieldType == '1'"> |
| | | <el-form-item label="默认值"> |
| | | <el-input v-model="addFieldForm.dictValue" placeholder="系统默认提供的值,可不填,设置默认值会替换提示文字" clearable></el-input> |
| | | <el-input v-model="addFieldForm.defaultValue" placeholder="系统默认提供的值,可不填,设置默认值会替换提示文字" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24"> |
| | | <el-col :span="24" v-if="addFieldForm.fieldType == '1'"> |
| | | <el-form-item label="文字长度"> |
| | | <el-date-picker v-model="addFieldForm.num" style="width: 100%" type="date" placeholder="请输入文字最长限制字数"></el-date-picker> |
| | | <el-input-number v-model="addFieldForm.maxlength" :min="0" :max="200" label="系统默认提供的值,可不填,设置默认值会替换提示文字"></el-input-number> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24"> |
| | | <el-col :span="24" v-if="addFieldForm.fieldType == '1'"> |
| | | <el-form-item label="输入格式"> |
| | | <el-select v-model="addFieldForm.test" style="width: 100%" @change="deptIdChange" placeholder="选择输入框不同的输入格式"> |
| | | <el-select v-model="addFieldForm.formatName" style="width: 100%" placeholder="选择输入框不同的输入格式"> |
| | | <el-option v-for="item in inputTypeList" :key="item.id" :label="item.title" :value="item.id"/> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <!-- 变量2 数字输入框--> |
| | | <el-col :span="24"> |
| | | <el-col :span="24" v-if="addFieldForm.fieldType == '2'"> |
| | | <el-form-item label="默认值"> |
| | | <el-input-number v-model="addFieldForm.num" @change="handleChange" :min="1" :max="10" label="系统默认提供的值,可不填,设置默认值会替换提示文字"></el-input-number> |
| | | <el-input-number v-model="addFieldForm.defaultValue" :precision="addFieldForm.saveDecimalNum" @change="handleChange" :min="0" :max="999" label="系统默认提供的值,可不填,设置默认值会替换提示文字"></el-input-number> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24"> |
| | | <el-col :span="24" v-if="addFieldForm.fieldType == '2'"> |
| | | <el-form-item label="格式"> |
| | | <el-radio v-model="addFieldForm.radio" label="1">数值</el-radio> |
| | | <el-radio v-model="addFieldForm.radio" label="2">百分比</el-radio> |
| | | <el-radio v-model="addFieldForm.format" label="0">数值</el-radio> |
| | | <el-radio v-model="addFieldForm.format" label="1">百分比</el-radio> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24"> |
| | | <el-col :span="24" v-if="addFieldForm.fieldType == '2'"> |
| | | <el-form-item label="保留小数位"> |
| | | <el-input-number v-model="addFieldForm.num" @change="handleChange" :min="1" :max="10" label="最多不超过4位小数"></el-input-number> |
| | | <el-input-number v-model="addFieldForm.saveDecimalNum" @change="handleChange" :min="0" :max="10" label="最多不超过4位小数"></el-input-number> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24"> |
| | | <el-col :span="24" v-if="addFieldForm.fieldType == '2'" v-show="addFieldForm.format == '0'"> |
| | | <el-form-item label="显示千分符"> |
| | | <el-checkbox v-model="addFieldForm.check"></el-checkbox> |
| | | <el-checkbox v-model="addFieldForm.isShowPercentage"></el-checkbox> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24"> |
| | | <el-col :span="24" v-if="addFieldForm.fieldType == '2'"> |
| | | <el-form-item label="限定值范围"> |
| | | <el-input-number v-model="addFieldForm.num" @change="handleChange" :min="1" :max="10"></el-input-number> |
| | | <el-input-number v-model="addFieldForm.rangeMin" :min="0" :max="9999"></el-input-number> |
| | | <span>-</span> |
| | | <el-input-number v-model="addFieldForm.num" @change="handleChange" :min="1" :max="10"></el-input-number> |
| | | <el-input-number v-model="addFieldForm.rangeMax" :min="0" :max="9999"></el-input-number> |
| | | </el-form-item> |
| | | </el-col> |
| | | <!-- 变量3 多行文本--> |
| | | <el-col :span="24"> |
| | | <el-col :span="24" v-if="addFieldForm.fieldType == '3'"> |
| | | <el-form-item label="默认值"> |
| | | <el-input v-model="addFieldForm.test" placeholder="系统默认提供的值,可不填,设置默认值会替换提示文字" clearable></el-input> |
| | | <el-input v-model="addFieldForm.defaultValue" type="textarea" placeholder="系统默认提供的值,可不填,设置默认值会替换提示文字" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24"> |
| | | <el-col :span="24" v-if="addFieldForm.fieldType == '3'"> |
| | | <el-form-item label="文字长度"> |
| | | <el-input-number v-model="addFieldForm.num" @change="handleChange" :min="1" :max="10" label="请输入文字最长限制字数"></el-input-number> |
| | | <el-input-number v-model="addFieldForm.maxlength" :min="0" :max="200" label="请输入文字最长限制字数"></el-input-number> |
| | | </el-form-item> |
| | | </el-col> |
| | | <!-- 变量4 日期选择器--> |
| | | <el-col :span="24"> |
| | | <el-col :span="24" v-if="addFieldForm.fieldType == '4'"> |
| | | <el-form-item label="默认值"> |
| | | <el-date-picker v-model="addFieldForm.test" style="width: 100%" type="date" placeholder="系统默认提供的值,可不填,设置默认值会替换提示文字"></el-date-picker> |
| | | <el-date-picker :editable="true" v-model="addFieldForm.defaultValue" style="width: 100%" :format="addFieldForm.dateFormat" :value-format="addFieldForm.dateFormat" :type="addFieldForm.dateType" placeholder="系统默认提供的值,可不填,设置默认值会替换提示文字" @change="dateChange"></el-date-picker> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24"> |
| | | <el-form-item label="日期格式" prop="deptId"> |
| | | <el-select v-model="addFieldForm.test" style="width: 100%" @change="deptIdChange" placeholder="请输入文字最长限制字数"> |
| | | <el-col :span="24" v-if="addFieldForm.fieldType == '4'"> |
| | | <el-form-item label="日期格式"> |
| | | <el-select v-model="addFieldForm.type" style="width: 100%" placeholder="请输入文字最长限制字数" @change="typeDateChange"> |
| | | <el-option v-for="item in dateFormatList" :key="item.id" :label="item.title" :value="item.id"/> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <!-- 变量5 单选按钮--> |
| | | <el-col :span="24"> |
| | | <el-form-item label="选项"> |
| | | <div> |
| | | <el-radio v-model="addFieldForm.radio" label="1"></el-radio> |
| | | <el-input v-model="addFieldForm.test" clearable></el-input> |
| | | <span class="remove-btn">删除</span> |
| | | </div> |
| | | <div class="add-btn">添加选项</div> |
| | | <el-col :span="24" v-if="addFieldForm.fieldType == '5'"> |
| | | <el-form-item label="选项" class="specialItem"> |
| | | <el-radio-group v-model="addFieldForm.selectOption" class="specialRadio"> |
| | | <el-radio :label="item.value" style="margin-right: 0px;" v-for="(item,index) in addFieldForm.radioList"> |
| | | <el-input v-model="item.label" clearable></el-input> |
| | | <span class="remove-btn" @click="removeRadio(index)">删除</span> |
| | | </el-radio> |
| | | </el-radio-group> |
| | | <div class="add-btn" @click="addRadio">添加选项</div> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24"> |
| | | </el-col> |
| | | <el-col :span="24" v-if="addFieldForm.fieldType == '5'"> |
| | | <el-form-item label="排序方式"> |
| | | <el-radio v-model="addFieldForm.radio" label="1">横向排列</el-radio> |
| | | <el-radio v-model="addFieldForm.radio" label="2">纵向排列</el-radio> |
| | | <el-radio v-model="addFieldForm.direction" label="0">横向排列</el-radio> |
| | | <el-radio v-model="addFieldForm.direction" label="1">纵向排列</el-radio> |
| | | </el-form-item> |
| | | </el-col> |
| | | <!-- 变量6 多选按钮--> |
| | | <el-col :span="24"> |
| | | <el-form-item label="选项"> |
| | | <div> |
| | | <el-checkbox v-model="addFieldForm.check"></el-checkbox> |
| | | <el-input v-model="addFieldForm.test" clearable></el-input> |
| | | <span class="remove-btn">删除</span> |
| | | </div> |
| | | <div class="add-btn">添加选项</div> |
| | | <el-col :span="24" v-if="addFieldForm.fieldType == '6'"> |
| | | <el-form-item label="选项" class="specialItem"> |
| | | <el-checkbox-group v-model="addFieldForm.selectBoxOption" class="specialCheck"> |
| | | <el-checkbox :label="item.value" :value="item.value" v-for="(item,index) in addFieldForm.checkboxList"> |
| | | <el-input v-model="item.label" clearable></el-input> |
| | | <span class="remove-btn" @click="removeCheckbox(index)">删除</span> |
| | | </el-checkbox> |
| | | </el-checkbox-group> |
| | | <!-- <div v-for="(item,index) in addFieldForm.checkboxList" class="fieldContent"> |
| | | <el-checkbox v-model="item.check" style="margin-right: 15px;"></el-checkbox> |
| | | <el-input v-model="item.input" clearable></el-input> |
| | | <span class="remove-btn" @click="removeCheckbox(index)">删除</span> |
| | | </div> --> |
| | | <div class="add-btn" @click="addCheckbox">添加选项</div> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24"> |
| | | <el-col :span="24" v-if="addFieldForm.fieldType == '6'"> |
| | | <el-form-item label="排序方式"> |
| | | <el-radio v-model="addFieldForm.radio" label="1">横向排列</el-radio> |
| | | <el-radio v-model="addFieldForm.radio" label="2">纵向排列</el-radio> |
| | | <el-radio v-model="addFieldForm.direction" label="0">横向排列</el-radio> |
| | | <el-radio v-model="addFieldForm.direction" label="1">纵向排列</el-radio> |
| | | </el-form-item> |
| | | </el-col> |
| | | <!-- 变量7 下拉选择器--> |
| | | <el-col :span="24"> |
| | | <el-form-item label="选项"> |
| | | <div> |
| | | <el-input v-model="addFieldForm.test" clearable></el-input> |
| | | <span class="remove-btn">删除</span> |
| | | <el-col :span="24" v-if="addFieldForm.fieldType == '7'"> |
| | | <el-form-item label="选项" class="specialItem"> |
| | | <div v-for="(item,index) in addFieldForm.selectList" class="fieldContent"> |
| | | <el-input v-model="item.label" clearable></el-input> |
| | | <span class="remove-btn" @click="removeSelect(index)">删除</span> |
| | | </div> |
| | | <div class="add-btn">添加选项</div> |
| | | <div class="add-btn" @click="addSelect">添加选项</div> |
| | | </el-form-item> |
| | | </el-col> |
| | | <!-- 变量8 业务字段-人员--> |
| | | <!-- 没有 --> |
| | | <!-- 变量8 业务字段-人员-没有--> |
| | | <!-- 变量9 默认-没有 --> |
| | | <el-col :span="24"> |
| | | <el-form-item label="编辑页显示"> |
| | | <el-checkbox v-model="addFieldForm.check">显示</el-checkbox> |
| | | <el-checkbox v-model="addFieldForm.updateShow"></el-checkbox> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24" v-if="addFieldForm.updateShow"> |
| | | <el-form-item label="支持编辑"> |
| | | <el-radio v-model="addFieldForm.supportUpdate" label="1">是</el-radio> |
| | | <el-radio v-model="addFieldForm.supportUpdate" label="0">否</el-radio> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24"> |
| | | <el-form-item label="查看页显示"> |
| | | <el-checkbox v-model="addFieldForm.check">显示</el-checkbox> |
| | | <el-checkbox v-model="addFieldForm.viewShow"></el-checkbox> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | |
| | | <template #footer> |
| | | <el-button @click="visible=false" >取 消</el-button> |
| | | <el-button v-if="mode!='show'" type="primary" :loading="isSaveing" @click="fieldSubmit">保存</el-button> |
| | | <el-button v-if="mode!='show'" type="primary" :loading="isSaveing" @click="fieldSubmitAgain">保存并继续添加</el-button> |
| | | <el-button v-if="mode!='show'" type="primary" :loading="isSaveing" @click="saveSubmit">保存并继续添加</el-button> |
| | | </template> |
| | | </el-dialog> |
| | | </template> |
| | |
| | | emits: ['success', 'closed'], |
| | | data() { |
| | | return { |
| | | dialogData: {}, |
| | | inputTypeList: [ //输入格式 |
| | | {title: "无",id:1}, |
| | | {title: "手机号码",id:1}, |
| | | {title: "电话号码",id:1}, |
| | | {title: "邮箱",id:1} |
| | | {title: "无",id: "1"}, |
| | | {title: "手机号码",id: "mobile"}, |
| | | {title: "电话号码",id: "telephone"}, |
| | | {title: "邮箱",id: "email"} |
| | | ], |
| | | fieldTypeList: [ //字段类型 |
| | | {title: "输入框",id:1}, |
| | | {title: "数字输入框",id:2}, |
| | | {title: "多行文本",id:3}, |
| | | {title: "日期选择器",id:4}, |
| | | {title: "单选按钮",id:5}, |
| | | {title: "多选按钮",id:6}, |
| | | {title: "下拉选择器",id:7}, |
| | | {title: "业务字段-人员",id:8}, |
| | | {title: "默认",id:9} |
| | | {title: "输入框",id: "1"}, |
| | | {title: "数字输入框",id: "2"}, |
| | | {title: "多行文本",id: "3"}, |
| | | {title: "日期选择器",id: "4"}, |
| | | {title: "单选按钮",id: "5"}, |
| | | {title: "多选按钮",id: "6"}, |
| | | {title: "下拉选择器",id: "7"}, |
| | | {title: "业务字段-人员",id: "9"}, |
| | | {title: "默认",id: "10",disabled: true} |
| | | ], |
| | | dateFormatList: [ //日期格式 |
| | | {title: "年-月",id:1}, |
| | | {title: "年-月-日",id:2}, |
| | | {title: "年-月-日 时:分",id:3}, |
| | | {title: "年-月-日 时:分:秒",id:4} |
| | | {title: "年-月",id: "yyyy-MM"}, |
| | | {title: "年-月-日",id: "yyyy-MM-dd"}, |
| | | {title: "年-月-日 时:分",id: "yyyy-MM-dd HH:mm"}, |
| | | {title: "年-月-日 时:分:秒",id: "yyyy-MM-dd HH:mm:ss"} |
| | | ], |
| | | deptIdList: [], |
| | | mode: "add", |
| | | titleMap: { |
| | | add: '添加自定义字段', |
| | |
| | | isSaveing: false, |
| | | //表单数据 |
| | | addFieldForm: { |
| | | radio: '1', |
| | | num: 0, |
| | | test: "", |
| | | check: false, |
| | | code: "", |
| | | dictValue: "", |
| | | sort: "", |
| | | isSealed: false, |
| | | remark: "", |
| | | dictKey: "-1", |
| | | $isSealed: "否" |
| | | fieldName: "", |
| | | fieldDescription: "", |
| | | defaultValue: "", |
| | | maxlength: 20, |
| | | updateShow: false, |
| | | viewShow: true, |
| | | fieldType: "1", //字段类型,默认输入框 |
| | | formatName: "", |
| | | supportUpdate: "1", |
| | | saveDecimalNum: 0, |
| | | format: "0", |
| | | isShowPercentage: false, |
| | | rangeMin: 0, |
| | | rangeMax: 0, |
| | | type: "yyyy-MM", |
| | | dateType: "month", |
| | | dateFormat: "YYYY-MM", |
| | | val: { |
| | | label: "年-月", |
| | | value: "month", |
| | | format: "yyyy-MM" |
| | | }, |
| | | direction: "0", |
| | | radioList: [], |
| | | selectOption: "", |
| | | selectBoxOption: [], |
| | | checkboxList: [], |
| | | selectList: [] |
| | | }, |
| | | //验证规则 |
| | | addFieldRules: { |
| | | code:[{required: true, message: '请输入字典编号'}], |
| | | dictValue:[{required: true, message: '请输入字典名称'}], |
| | | sort:[{required: true, message: '请输入字典排序'}] |
| | | fieldName:[{required: true, message: '请输入字段名称'}] |
| | | } |
| | | } |
| | | }, |
| | |
| | | |
| | | }, |
| | | methods: { |
| | | deptIdChange() { |
| | | |
| | | dateChange(val) { |
| | | console.log(val) |
| | | this.addFieldForm.defaultValue = val; |
| | | }, |
| | | typeDateChange(val) { |
| | | this.addFieldForm.defaultValue = ""; |
| | | if(val == "yyyy-MM") { |
| | | this.addFieldForm.dateType = "month"; |
| | | this.addFieldForm.dateFormat = "YYYY-MM"; |
| | | this.addFieldForm.val = { |
| | | label: "年-月", |
| | | value: "month", |
| | | format: val |
| | | }; |
| | | }else if(val == "yyyy-MM-dd") { |
| | | this.addFieldForm.dateType = "date"; |
| | | this.addFieldForm.dateFormat = "YYYY-MM-DD"; |
| | | this.addFieldForm.val = { |
| | | label: "年-月-日", |
| | | value: "date", |
| | | format: val |
| | | }; |
| | | }else if(val == "yyyy-MM-dd HH:mm") { |
| | | this.addFieldForm.dateType = "datetime"; |
| | | this.addFieldForm.dateFormat = "YYYY-MM-DD HH-mm"; |
| | | this.addFieldForm.val = { |
| | | label: "年-月-日 时:分", |
| | | value: "datetime", |
| | | format: val |
| | | }; |
| | | }else if(val == "yyyy-MM-dd HH:mm:ss") { |
| | | this.addFieldForm.dateType = "datetime"; |
| | | this.addFieldForm.dateFormat = "YYYY-MM-DD HH-mm-ss"; |
| | | this.addFieldForm.val = { |
| | | label: "年-月-日 时:分:秒", |
| | | value: "datetime", |
| | | format: val |
| | | }; |
| | | } |
| | | }, |
| | | fieldSubmit() { //保存 |
| | | this.saveSubmit('closeDialog'); |
| | | }, |
| | | saveSubmit(isClose) { //保存并继续 |
| | | var obj = { |
| | | businessType: 1, |
| | | fieldDescription: this.addFieldForm.fieldDescription, |
| | | fieldName: this.addFieldForm.fieldName, |
| | | fieldType: this.addFieldForm.fieldType, |
| | | supportUpdate: this.addFieldForm.supportUpdate, |
| | | systemField: 0, |
| | | updateShow: this.addFieldForm.updateShow?"1":"0", |
| | | viewShow: this.addFieldForm.viewShow?"1":"0", |
| | | } |
| | | if(this.addFieldForm.fieldType == "1") { //字段类型 |
| | | obj.defaultValue = this.addFieldForm.defaultValue; //默认值 |
| | | var propertyJson = { //长度、格式 |
| | | maxlength: this.addFieldForm.maxlength, |
| | | formatName: this.addFieldForm.formatName == "1"?"":this.addFieldForm.formatName |
| | | } |
| | | obj.propertyJson = JSON.stringify(propertyJson); |
| | | } |
| | | if(this.addFieldForm.fieldType == "2") { //字段类型 |
| | | obj.defaultValue = this.addFieldForm.defaultValue; //默认值 |
| | | var propertyJson = { |
| | | format: this.addFieldForm.format, |
| | | saveDecimalNum: this.addFieldForm.saveDecimalNum, |
| | | isShowPercentage: this.addFieldForm.isShowPercentage, |
| | | rangeMin: this.addFieldForm.rangeMin, |
| | | rangeMax: this.addFieldForm.rangeMax |
| | | } |
| | | obj.propertyJson = JSON.stringify(propertyJson); |
| | | } |
| | | if(this.addFieldForm.fieldType == "3") { //字段类型 |
| | | obj.defaultValue = this.addFieldForm.defaultValue; //默认值 |
| | | var propertyJson = { |
| | | maxlength: this.addFieldForm.maxlength |
| | | } |
| | | obj.propertyJson = JSON.stringify(propertyJson); |
| | | } |
| | | if(this.addFieldForm.fieldType == "4") { //字段类型 |
| | | obj.defaultValue = this.addFieldForm.defaultValue; //默认值 |
| | | var propertyJson = { |
| | | type: this.addFieldForm.type, |
| | | val: this.addFieldForm.val |
| | | } |
| | | obj.propertyJson = JSON.stringify(propertyJson); |
| | | } |
| | | if(this.addFieldForm.fieldType == "5") { //单选按钮 |
| | | var propertyJson = { |
| | | selectOption: this.addFieldForm.selectOption, |
| | | options: this.addFieldForm.radioList, |
| | | direction: this.addFieldForm.direction |
| | | } |
| | | obj.propertyJson = JSON.stringify(propertyJson); |
| | | } |
| | | if(this.addFieldForm.fieldType == "6") { //多选按钮 |
| | | var propertyJson = { |
| | | selectOption: this.addFieldForm.selectBoxOption, |
| | | options: this.addFieldForm.checkboxList, |
| | | direction: this.addFieldForm.direction |
| | | } |
| | | obj.propertyJson = JSON.stringify(propertyJson); |
| | | } |
| | | if(this.addFieldForm.fieldType == "7") { //下拉选择器 |
| | | var propertyJson = { |
| | | options: this.addFieldForm.selectList |
| | | } |
| | | obj.propertyJson = JSON.stringify(propertyJson); |
| | | } |
| | | obj.businessType = this.$route.query.type; |
| | | var that = this; |
| | | if(this.mode == "edit") { |
| | | var url = "/api/blade-system/custom-template-field/update"; |
| | | var method = "put"; |
| | | obj.id = this.dialogData.id; |
| | | }else { |
| | | var url = "/api/blade-system/custom-template-field/insert"; |
| | | var method = "post"; |
| | | } |
| | | this.$HTTP[method](url,obj).then(res=> { |
| | | if(res.code == 200) { |
| | | that.$message.success("提交成功"); |
| | | that.$emit("success",obj); |
| | | if(isClose == "closeDialog") { |
| | | that.visible = false; |
| | | } |
| | | }else { |
| | | that.$message.error(res.msg); |
| | | } |
| | | }) |
| | | }, |
| | | removeRadio(index) { |
| | | this.addFieldForm.radioList.splice(index,1); |
| | | }, |
| | | addRadio() { |
| | | var flag = false; |
| | | if(this.addFieldForm.radioList.length > 0) { |
| | | this.addFieldForm.radioList.forEach(item=> { |
| | | if(item.label == "") { |
| | | flag = true; |
| | | } |
| | | }) |
| | | } |
| | | if(flag) { |
| | | this.$message.error("请输入上一个自定义选项的内容"); |
| | | return; |
| | | } |
| | | this.addFieldForm.radioList.push({label: "",value: "radiosSelect" + (this.addFieldForm.radioList.length + 1),parentId: 0}); |
| | | }, |
| | | removeCheckbox(index) { |
| | | this.addFieldForm.checkboxList.splice(index,1); |
| | | }, |
| | | addCheckbox() { |
| | | var flag = false; |
| | | if(this.addFieldForm.checkboxList.length > 0) { |
| | | this.addFieldForm.checkboxList.forEach(item=> { |
| | | if(item.label == "") { |
| | | flag = true; |
| | | } |
| | | }) |
| | | } |
| | | if(flag) { |
| | | this.$message.error("请输入上一个自定义选项的内容"); |
| | | return; |
| | | } |
| | | this.addFieldForm.checkboxList.push({label: "",value: "checkboxSelect" + (this.addFieldForm.checkboxList.length + 1),parentId: 0}); |
| | | }, |
| | | removeSelect(index) { |
| | | this.addFieldForm.selectList.splice(index,1); |
| | | }, |
| | | addSelect() { |
| | | var flag = false; |
| | | if(this.addFieldForm.selectList.length > 0) { |
| | | this.addFieldForm.selectList.forEach(item=> { |
| | | if(item.label == "") { |
| | | flag = true; |
| | | } |
| | | }) |
| | | } |
| | | if(flag) { |
| | | this.$message.error("请输入上一个自定义选项的内容"); |
| | | return; |
| | | } |
| | | this.addFieldForm.selectList.push({label: "",value: "select" + (this.addFieldForm.selectList.length + 1),parentId: 0}); |
| | | }, |
| | | //显示 |
| | | open(mode='add'){ |
| | |
| | | this.visible = true; |
| | | return this |
| | | }, |
| | | //表单提交方法 |
| | | fieldSubmit(){ |
| | | var obj = Object.assign({},this.addFieldForm); |
| | | if(obj.isSealed === true) { |
| | | obj.$isSealed = "是"; |
| | | obj.isSealed = "1"; |
| | | }else { |
| | | obj.$isSealed = "否"; |
| | | obj.isSealed = "0"; |
| | | } |
| | | this.$refs.dialogForm.validate(async (valid) => { |
| | | if (valid) { |
| | | this.isSaveing = true; |
| | | this.$HTTP.post("/api/blade-system/dict/submit",obj).then(res=> { |
| | | this.isSaveing = false; |
| | | if(res.code == 200) { |
| | | this.$emit('success', this.addFieldForm, this.mode); |
| | | this.visible = false; |
| | | this.$message.success("操作成功"); |
| | | }else { |
| | | this.$alert(res.message, "提示", {type: 'error'}); |
| | | } |
| | | }) |
| | | }else{ |
| | | return false; |
| | | } |
| | | }) |
| | | }, |
| | | fieldSubmitAgain() { |
| | | |
| | | }, |
| | | //表单注入数据 |
| | | setData(data){ |
| | | console.log(data) |
| | | //可以和上面一样单个注入,也可以像下面一样直接合并进去 |
| | | if(data.isSealed == "1") { |
| | | data.isSealed = true; |
| | | }else { |
| | | data.isSealed = false; |
| | | } |
| | | Object.assign(this.addFieldForm, data); |
| | | this.dialogData = data; |
| | | this.$HTTP.get(`/api/blade-system/custom-template-field/get/${data.id}`).then(res=> { |
| | | if(res.code == 200) { |
| | | res.data.fieldType = String(res.data.fieldType); |
| | | res.data.format = res.data.format == "0"?"0":"1"; |
| | | res.data.direction = String(res.data.direction); |
| | | res.data.updateShow = res.data.updateShow == "1"?true:false; |
| | | res.data.viewShow = res.data.viewShow == "1"?true:false; |
| | | res.data.supportUpdate = String(res.data.supportUpdate); |
| | | if(res.data.fieldType != "10") { |
| | | this.addFieldForm = Object.assign(res.data,JSON.parse(res.data.propertyJson)); |
| | | }else { |
| | | this.addFieldForm = res.data; |
| | | } |
| | | this.addFieldForm.format = String(this.addFieldForm.format); |
| | | if(res.data.fieldType == "5") { |
| | | this.addFieldForm.radioList = this.addFieldForm.options; |
| | | } |
| | | if(res.data.fieldType == "6") { |
| | | this.addFieldForm.checkboxList = this.addFieldForm.options; |
| | | this.addFieldForm.selectBoxOption = this.addFieldForm.selectOption; |
| | | } |
| | | if(res.data.fieldType == "7") { |
| | | this.addFieldForm.selectList = this.addFieldForm.options; |
| | | } |
| | | } |
| | | }) |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .add-btn { |
| | | color: #409eff; |
| | | cursor: pointer; |
| | | } |
| | | .specialItem /deep/ .el-form-item__content{ |
| | | display: flex; |
| | | flex-direction: column; |
| | | align-items: flex-start; |
| | | } |
| | | .specialRadio,.specialCheck { |
| | | display: flex; |
| | | flex-direction: column; |
| | | align-items: flex-start; |
| | | } |
| | | .specialRadio label,.specialCheck label{ |
| | | margin-bottom: 8px; |
| | | } |
| | | .fieldContent { |
| | | display: flex; |
| | | align-items: flex-start; |
| | | margin-bottom: 8px; |
| | | } |
| | | .remove-btn { |
| | | margin-left: 10px; |
| | | min-width: 60px; |
| | | display: inline-block; |
| | | margin-left: 12px; |
| | | color: red; |
| | | cursor: pointer; |
| | | } |
| | | .add-btn { |
| | | margin-left: 30px; |
| | | color: #3b8e8e; |
| | | cursor: pointer; |
| | | } |
| | | </style> |