访问网站 流程图,网络营销属于什么专业类型,个人简历模板网站,网络公司网站设计方案ppt效果图#xff1a;
主要是使用vue elmentUi 的from的基础上进行封装
使用改组件#xff0c;是需要自定义从父组件传入一下字段表单字段
export const topicTypeMainTaskEdit: any new Map([// 主任务可编辑状态[feasibleInstructions, // 督办件[{value: documentNum…效果图
主要是使用vue elmentUi 的from的基础上进行封装
使用改组件是需要自定义从父组件传入一下字段表单字段
export const topicTypeMainTaskEdit: any new Map([// 主任务可编辑状态[feasibleInstructions, // 督办件[{value: documentNum,formKey: [documentNum],rules: [{ required: true, message: 请输入办文编号, trigger: blur },{ min: 0, max: 30, message: 办文编号字数长度超过限制 }],label: 办文编号,class: half-item,type: text,maxlength: 30},{value: taskTitle,formKey: [taskTitle],rules: [{ required: true, message: 请输入任务标题, trigger: blur },{ min: 0, max: 300, message: 任务标题字数长度超过限制 }],label: 任务标题,class: half-item-all,isMate: true, // 填写时是否和关联任务的相应的字段匹配type: text,maxlength: 300},{value: taskSourceId,formKey: {value: taskSourceId,label: taskSource},rules: [{ required: true, message: 请选择事项类型, trigger: change }],hasSlot: {key: taskSource,label: 事项类型管理,type: managementMatters},slotKey: taskSource,label: 事项类型,type: select,list: itemTypeList,options: () JSON.parse(localStorage.getItem(store)).firstLevelTask.itemTypeData.filter(res { return res.dicStatus * 1 1 })},{value: mainLeaderId,formKey: {value: mainLeaderId,label: mainLeader},label: 批示领导,hasSlot: {key: mainLeader,label: 批示领导管理,type: managementMatters},slotKey: mainLeader,type: select,multiple: true,list: leaderOptions,options: () JSON.parse(localStorage.getItem(store)).firstLevelTask.mainLeaderData.filter(res { return res.dicStatus * 1 1 })},{value: indicationTime,formKey: [indicationTime],label: 批示时间,class: half-item,type: date,noLimitCurrentDate: true // false为限制不能选当天以前的日期},{value: itemClaim,formKey: [itemClaim],rules: [{ min: 0, max: 300, message: 省领导批示内容字数长度超过限制 }],label: 省领导批示内容,class: ,type: textarea,showWordLimit: true,maxlength: 300,rows: 4},{value: workRequire,formKey: [workRequire],rules: [{ min: 0, max: 300, message: 领导跟批情况字数长度超过限制 }],label: 领导跟批情况,class: ,type: textarea,showWordLimit: true,maxlength: 300,rows: 4},{value: documentUrl,formKey: [documentUrl],// rules: [// { required: true, message: 请输入相关公文, trigger: blur }// ],label: 相关公文,class: half-item,type: text,maxlength: 300},// {// value: documentUrl,// label: 相关公文,// formKey: [documentUrl, mainDeptId, mainUnitId],// type: authPanel,// authPanelType: department,// deptArray: [],// multiple: true// },{value: taskContent,formKey: [taskContent],rules: [{ required: true, message: 请输入任务描述, trigger: blur },{ min: 0, max: 800, message: 任务描述字数长度超过限制 }],label: 任务描述,class: ,type: textarea,showWordLimit: true,isMate: true, // 填写时是否和关联任务的相应的字段匹配maxlength: 800,rows: 4},{value: mainUnitName,rules: [{ required: true, message: 请选择主办处室, trigger: blur }],label: 主办处室,formKey: [mainUnitName, mainDeptId, mainUnitId],type: authPanel,authPanelType: department,deptArray: [],multiple: true,linkage: mainUnitName,fn: (data: any, formData: any) {let interrupt falseconst departId Array.isArray(data) data.map(item {return item.departId})formData formData.forEach(i {if (i.key assistUnitNames) {i.deptArray.forEach(j {if (departId.indexOf(j.departId) -1) {interrupt trueMessage({message: ${j.name}不能同时作为主办、会办处室,type: error})}})}})return {interrupt}}},{value: assistUnitNames,label: 会办处室,formKey: [assistUnitNames, assistDeptIds, assistUnitIds],type: authPanel,authPanelType: department,deptArray: [],multiple: true,linkage: assistUnitNames,fn: (data: any, formData: any) {let interrupt falseconst departId Array.isArray(data) data.map(item {return item.departId})formData formData.forEach(i {if (i.key mainUnitName) {i.deptArray.forEach(j {if (departId.indexOf(j.departId) -1) {interrupt trueMessage({message: ${j.name}不能同时作为主办、会办处室,type: error})}})}})return {interrupt}}},{value: leaderId,formKey: {value: leaderId,label: leader},rules: [{ required: true, message: 请选择分管领导, trigger: change }],label: 分管领导,hasSlot: {key: leader,label: 分管领导管理,type: managementMatters},slotKey: leader,type: select,multiple: true,list: leaderOptions,options: () JSON.parse(localStorage.getItem(store)).firstLevelTask.leaderData.filter(res { return res.dicStatus * 1 1 })},{value: supervisionCycle,formKey: [cycleType, supervisionCycle, supervisionCycleIds, firstSubmitTime],rules: [{ required: true, message: 请选择报送时间 }],label: 报送时间,class: half-item,type: deliveryTime},{value: limitDate,formKey: [limitDate],label: 办结期限,class: half-item,type: date},{value: peopleArray,formKey: [sendCopys, sendCopysId, sendCopysDeptId],label: 抄送人员,type: authPanel,authPanelType: people,deptArray: [],multiple: true,hasSameDataDefaultProps: { isSame: complexId, parentId: departId, childrenId: userId }}]],[keyWork, // 重点工作[{value: taskTitle,formKey: [taskTitle],rules: [{ required: true, message: 请输入任务标题, trigger: blur },{ min: 0, max: 300, message: 任务标题字数长度超过限制 }],label: 任务标题,type: text,maxlength: 300},{value: workRequire,formKey: [workRequire],rules: [{ min: 0, max: 500, message: 描述字数长度超过限制 }],label: 描述,type: textarea,showWordLimit: true,maxlength: 500,rows: 4},{value: taskSourceId,formKey: {value: taskSourceId,label: taskSource},rules: [{ required: true, message: 请选择事项类型, trigger: change }],hasSlot: {key: taskSource,label: 事项类型管理,type: managementMatters},slotKey: taskSource,label: 事项类型,type: select,list: itemTypeList,options: () JSON.parse(localStorage.getItem(store)).firstLevelTask.itemTypeData.filter(res { return res.dicStatus * 1 1 })},// {// value: documentUrl,// label: 相关公文,// formKey: [documentUrl],// type: authPanel,// authPanelType: department,// deptArray: [],// multiple: true// },{value: documentUrl,formKey: [documentUrl],label: 相关公文,class: half-item,type: text,maxlength: 300},{value: peopleArray,formKey: [sendCopys, sendCopysId, sendCopysDeptId],label: 抄送人员,type: authPanel,authPanelType: people,deptArray: [],multiple: true,hasSameDataDefaultProps: { isSame: complexId, parentId: departId, childrenId: userId }}]]
])然后先初始化表单字段的数据
const getTopicTypeData this.topicTypeData.length 0 ? this.topicTypeData : topicTypeData[this.topicTypeDataKey].get(this.otherTask || this.topicType)// const getTopicTypeData this.topicTypeData.length 0 ? this.topicTypeData : topicTypeData[this.topicTypeDataKey].get(this.topicType || this.otherTask)this.topicTypeMainTask [...getTopicTypeData.map(item {return { ...item, type: item.type text ? input : item.type, isEdit: !item.disabled, key: item.value, value: , options: typeof item.options function ? item.options() : item.options || }}), { key: fileJson, type: upload, value: }]this.topicTypeMainTask.forEach(item {// if (item.type authPanel item.authPanelType people) {if (item.type authPanel item.authPanelType people !item.mixedData) {item.deptArray this.taskData.sendCopysId ? this.resestPeopleArray(this.taskData.sendCopysId, this.taskData.sendCopys, this.taskData.sendCopysDeptId) : []item.value this.taskData[item.key]} else if (item.type authPanel (item.authPanelType department || (item.mixedData true item.authPanelType people))) {// else if (item.type authPanel item.authPanelType department) {if (item.disabled typeof item.disabled function) {item.disabled item.disabled(!!(this.taskData.status this.taskData.status 4))}item.deptArray this.resestDeptArr(item.formKey)item.value this.taskData[item.key]} else if (item.type deliveryTime) {item.deliveryTime {supervisionCycleIds: this.taskData.supervisionCycleIds,cycleType: this.taskData.cycleType,supervisionCycle: this.taskData.supervisionCycle,firstSubmitTime: this.taskData.firstSubmitTime}item.value this.taskData[item.key]} else if (item.type select) {if (this.topicType coordinatingCommittee item.key meetingTypeId) {item.value 1} else {if (item.multiple) {item.value (this.taskData[item.key] this.taskData[item.key].split(,)) || []} else {item.value this.taskData[item.key]}}} else if (item.type upload) {item.value this.taskData[item.key] ? this.taskData[item.key] : []} else {item.value this.taskData[item.key]}})这些字段都是存在在一个新ts文件中如果对象有值根据不用的表单类型进行赋值回显没有的话就是空
表单组件中传入的值代表的意思 props: {isShowSearchBtn: { // 是否显示查询按钮type: Boolean,default: true},labelPosition: { // 表单文本标题的位置type: String,default: right},labelWidth: { // 表单文本标题的宽度type: String,default: },formItemWidth: {type: String,default: 100%},setStyle: {type: Object,default: () {return {}}},updateModel: {type: Object,default: () {return {}}},isRules: { // 是否要校验type: Boolean,default: true},rules: { // 校验规则type: Object,default: () {return {}}},formData: { // 表单数据type: Array,default: () {return []}},inline: { // 是否是行内type: Boolean,default: true},flexWrap: {type: Boolean,default: false}, // 控制表单是否换行justifyContent: { // 布局type: String,default: space-between}, // 表单布局风格noCheck: {type: Boolean,default: true},pickerOptions: { // 时间日期表单的时间限制type: Object,default: () {return {disabledDate(time) {return time.getTime() Date.now() - 8.64e7}}}}},如果表单数据对象遍历中出现slotKey代表这个字段是使用插槽
在父组件中使用插槽然后将根据不用字段显示不同的内容
表单组件里面的表单类型
el-formrefformRef:inlineinline:modelmodel:rulesisRules ? rules : {}:label-positionlabelPosition:label-widthlabelWidth:style{flex-wrap: flexWrap ? nowrap : wrap, justify-content : justifyContent}el-form-itemv-for(item,i) in formData:keyformi:classitem.type -form:labelitem.label:propitem.key:rulesisRules ? item.rules : []:erroritem.success ? : item.message:style{width: item.width ? item.width : formItemWidth, ...item.style }!-- 插槽 --template v-ifitem.slotKeyslot :nameitem.slotKey :rowitem //templatetemplate v-else!-- 输入框 --el-inputv-ifitem.type inputv-modelmodel[item.key]:disabled!item.isEdit:maxlengthitem.maxlength:show-word-limititem.showWordLimit:placeholderitem.placeholder || 请输入blurhandleBlur(item)/!-- 文本框 --el-inputv-else-ifitem.type textareav-modelmodel[item.key]:disabled!item.isEdit:maxlengthitem.maxlength:show-word-limititem.showWordLimittypetextarea:rows3:placeholderitem.placeholder || 请输入blurhandleBlur(item)/!-- 下拉框 --el-selectv-else-ifitem.type selectv-modelmodel[item.key]:disabled!item.isEdit:multipleitem.multiple:placeholderitem.placeholder || 请选择change(val) updateDeptArray(val, item)el-option v-for(option, j) in item.options :keyoptionj :labeloption.label :valueoption.value //el-select!-- 输入框可以过滤 --el-autocompletev-else-ifitem.type autocompletev-modelmodel[item.key]:fetch-suggestions(a,b) querySearch(a,b,item.options):placeholderitem.placeholder || 请输入select(val) handleSelect(val, item)/!-- 单选框 --el-radio-group v-else-ifitem.type radio v-modelmodel[item.key]el-radio v-for(option, z) in item.options :keyoptionz :labeloption.value{{ option.label }}/el-radio/el-radio-group!-- 日期 --el-date-pickerv-else-ifitem.type date:keydatePicker iv-modelmodel[item.key]:picker-options!item.noLimitCurrentDate pickerOptionstypedate:placeholderitem.placeholder || 请选择value-formatyyyy-MM-ddformatyyyy-MM-dd/!-- 日期时间 --el-date-pickerv-else-ifitem.type daterange:keydaterangePicker iv-modelmodel[item.key]:picker-options!item.noLimitCurrentDate pickerOptionstypedaterangerange-separator至start-placeholder开始日期end-placeholder结束日期value-formatyyyy-MM-ddformatyyyy-MM-dd/!-- 数字 --el-input-numberv-else-ifitem.type inputNumberv-modelmodel[item.key]:min1/!-- 报送时间 --div v-else-ifitem.type deliveryTime classmodule-timeInput clickshowSubMissionel-input v-modelmodel[item.key] :disabled!item.isEdit :placeholder item.placeholder || 请选择报送时间 readonly //div!-- 单位或者人员组织构架 --auth-panelv-else-ifitem.type authPanel:auth-panel-paramsitem.params:mixed-dataitem.mixedData:disableditem.disabled:typeitem.authPanelType:dept-arrayitem.deptArray:has-same-data-default-propsitem.hasSameDataDefaultProps:multipleitem.multiple:stage-singleitem.stageSingle:select-alltrueupdate:deptArray(val) updateDeptArray(val, item)/!-- auth-panel v-else-ifitem.type authPanel :disabled!item.isEdit :typeitem.authPanelType :dept-arrayitem.deptArray :has-same-data-default-propsitem.hasSameDataDefaultProps :multipleitem.multiple :select-alltrue update:deptArray(val) updateDeptArray(val, item) / --!-- 文件上传 --template v-else-ifitem.type uploadel-form-item labeldiv classgroup-itemdiv classexportFilesupload :file-datafileList changeFilegetFileList / !--:file-typefileFormat--/div/divfile-list v-forfile in fileList :keyfile.fileId :filefile :file-operate-btn[eyes, closeBg] remove-fileremoveFile //el-form-item/template/template/el-form-itemel-form-itemtemplate v-ifisShowSearchBtnel-button typeprimary sizemiddle clicksubmitForm(formRef)查询/el-buttonel-button plain clickresetForm(formRef)重置/el-button/templateslot namebtnList //el-form-item/el-form完整代码
templatediv classform :stylesetStyleel-formrefformRef:inlineinline:modelmodel:rulesisRules ? rules : {}:label-positionlabelPosition:label-widthlabelWidth:style{flex-wrap: flexWrap ? nowrap : wrap, justify-content : justifyContent}el-form-itemv-for(item,i) in formData:keyformi:classitem.type -form:labelitem.label:propitem.key:rulesisRules ? item.rules : []:erroritem.success ? : item.message:style{width: item.width ? item.width : formItemWidth, ...item.style }!-- 插槽 --template v-ifitem.slotKeyslot :nameitem.slotKey :rowitem //templatetemplate v-else!-- 输入框 --el-inputv-ifitem.type inputv-modelmodel[item.key]:disabled!item.isEdit:maxlengthitem.maxlength:show-word-limititem.showWordLimit:placeholderitem.placeholder || 请输入blurhandleBlur(item)/!-- 文本框 --el-inputv-else-ifitem.type textareav-modelmodel[item.key]:disabled!item.isEdit:maxlengthitem.maxlength:show-word-limititem.showWordLimittypetextarea:rows3:placeholderitem.placeholder || 请输入blurhandleBlur(item)/!-- 下拉框 --el-selectv-else-ifitem.type selectv-modelmodel[item.key]:disabled!item.isEdit:multipleitem.multiple:placeholderitem.placeholder || 请选择change(val) updateDeptArray(val, item)el-option v-for(option, j) in item.options :keyoptionj :labeloption.label :valueoption.value //el-select!-- 输入框可以过滤 --el-autocompletev-else-ifitem.type autocompletev-modelmodel[item.key]:fetch-suggestions(a,b) querySearch(a,b,item.options):placeholderitem.placeholder || 请输入select(val) handleSelect(val, item)/!-- 单选框 --el-radio-group v-else-ifitem.type radio v-modelmodel[item.key]el-radio v-for(option, z) in item.options :keyoptionz :labeloption.value{{ option.label }}/el-radio/el-radio-group!-- 日期 --el-date-pickerv-else-ifitem.type date:keydatePicker iv-modelmodel[item.key]:picker-options!item.noLimitCurrentDate pickerOptionstypedate:placeholderitem.placeholder || 请选择value-formatyyyy-MM-ddformatyyyy-MM-dd/!-- 日期时间 --el-date-pickerv-else-ifitem.type daterange:keydaterangePicker iv-modelmodel[item.key]:picker-options!item.noLimitCurrentDate pickerOptionstypedaterangerange-separator至start-placeholder开始日期end-placeholder结束日期value-formatyyyy-MM-ddformatyyyy-MM-dd/!-- 数字 --el-input-numberv-else-ifitem.type inputNumberv-modelmodel[item.key]:min1/!-- 报送时间 --div v-else-ifitem.type deliveryTime classmodule-timeInput clickshowSubMissionel-input v-modelmodel[item.key] :disabled!item.isEdit :placeholder item.placeholder || 请选择报送时间 readonly //div!-- 单位或者人员组织构架 --auth-panelv-else-ifitem.type authPanel:auth-panel-paramsitem.params:mixed-dataitem.mixedData:disableditem.disabled:typeitem.authPanelType:dept-arrayitem.deptArray:has-same-data-default-propsitem.hasSameDataDefaultProps:multipleitem.multiple:stage-singleitem.stageSingle:select-alltrueupdate:deptArray(val) updateDeptArray(val, item)/!-- auth-panel v-else-ifitem.type authPanel :disabled!item.isEdit :typeitem.authPanelType :dept-arrayitem.deptArray :has-same-data-default-propsitem.hasSameDataDefaultProps :multipleitem.multiple :select-alltrue update:deptArray(val) updateDeptArray(val, item) / --!-- 文件上传 --template v-else-ifitem.type uploadel-form-item labeldiv classgroup-itemdiv classexportFilesupload :file-datafileList changeFilegetFileList / !--:file-typefileFormat--/div/divfile-list v-forfile in fileList :keyfile.fileId :filefile :file-operate-btn[eyes, closeBg] remove-fileremoveFile //el-form-item/template/template/el-form-itemel-form-itemtemplate v-ifisShowSearchBtnel-button typeprimary sizemiddle clicksubmitForm(formRef)查询/el-buttonel-button plain clickresetForm(formRef)重置/el-button/templateslot namebtnList //el-form-item/el-form!--报送周期组件--submission-dialog refsubmissionDialog :sub-mission-datasubMissionData confirmconfirmMission //div
/template
script
import authPanel from /components/authPanel/index.vue
import submissionDialog from /components/Dialog/submissionDialog.vue
import upload from /components/UploadCom/index.vue
import fileList from /components/fileList/index.vue
export default {name: InitForm,components: { authPanel, upload, fileList, submissionDialog },props: {isShowSearchBtn: { // 是否显示查询按钮type: Boolean,default: true},labelPosition: { // 表单文本标题的位置type: String,default: right},labelWidth: { // 表单文本标题的宽度type: String,default: },formItemWidth: {type: String,default: 100%},setStyle: {type: Object,default: () {return {}}},updateModel: {type: Object,default: () {return {}}},isRules: { // 是否要校验type: Boolean,default: true},rules: { // 校验规则type: Object,default: () {return {}}},formData: { // 表单数据type: Array,default: () {return []}},inline: { // 是否是行内type: Boolean,default: true},flexWrap: {type: Boolean,default: false}, // 控制表单是否换行justifyContent: { // 布局type: String,default: space-between}, // 表单布局风格noCheck: {type: Boolean,default: true},pickerOptions: { // 时间日期表单的时间限制type: Object,default: () {return {disabledDate(time) {return time.getTime() Date.now() - 8.64e7}}}}},data() {return {model: {},fileList: [],linkageDataKey: {},subMissionData: { // 报送时间回显的参数格式supervisionCycleIds: ,cycleType: ,firstSubmitTime: ,supervisionCycle: },defaultProps: { // 初始化表单key值value: value, // 表单显示的值authPanel: list // 获取选择单位/选择人员所选择的对象值}}},watch: {updateModel: {handler(newV) {if (newV) {this.model[Object.keys(newV)[0]] newV[Object.keys(newV)[0]]}},deep: true}},created() {this.init()},methods: {init() {this.formData.forEach(item {!item.defaultProps (item.defaultProps this.defaultProps)if (item.type deliveryTime) {this.subMissionData item.deliveryTime ? item.deliveryTime : this.subMissionData}if (item.linkage) {this.linkageDataKey[item.linkage] this.formData.find(data {return data.key item.linkage})const linkageType Array.isArray(this.linkageDataKey[item.linkage].value)if ((linkageType this.linkageDataKey[item.linkage].value.length 0) || (!linkageType this.linkageDataKey[item.linkage].value)) {if (item.fn(this.linkageDataKey[item.linkage].value).then) {item.fn(this.linkageDataKey[item.linkage].value).then(() {this.$set(this.model, item.key, Array.isArray(item.value) ? item.value.map(String) : item.value)})} else {this.$set(this.model, item.key, Array.isArray(item.value) ? item.value.map(String) : item.value)}}} else {this.$set(this.model, item.key, item.value)// if (item.type select item.multiple) {// if (item.value item.value.length 0) {// this.$set(this.model, item.key, item.value)// } else {// this.$set(this.model, item.key, [])// if (!item.message) {// this.$nextTick(() {// this.$refs[formRef].clearValidate([item.key])// })// }// }// } else {// this.$set(this.model, item.key, item.value)// }// this.model[item.key] item.value}if (item.type upload) {this.fileList item.value ? JSON.parse(item.value) : []}})},// 清除校验// clearRules(value) {// this.$nextTick(() {// if (value) {// this.$refs[formRef].clearValidate([value])// } else {// this.$refs[formRef].resetFields()// }// })// },querySearch(queryString, cb, options) {const option options || []cb(option.filter(item {return item.value.indexOf(queryString) -1}))},handleSelect(val, data) {data.formKey.forEach(item {if (item.indexOf(Id) -1) {this.$set(this.model, item, val.id)} else {this.$set(this.model, item, val.value)}})},submitForm(formEl) {if (!formEl) returnthis.$emit(submit, this.model)},resetForm(formEl) {if (!formEl) returnthis.$refs[formEl].resetFields()this.$emit(reset, this.model)},getTreeSelectData(data) {this.$set(this.model, treeSelectData, data)},updateDeptArray(data, formItem) {let interrupt false // 是否中断赋值formItem.type authPanel this.$set(this.model, formItem.key, data.map(item { return item.name }).join(,))this.$refs.formRef.clearValidate(formItem.key)this.formData.forEach(item {if (item.linkage formItem.key) {interrupt item.fn(data, this.formData).interrupt}if (item.type authPanel item.key formItem.key !interrupt) {item.deptArray data}})if (!interrupt) {this.$emit(update:formData, this.formData)}},async getFormData(callback) {if (!this.$refs.formRef) returnconst initFormData this.initSaveFormData(JSON.parse(JSON.stringify(this.formData)))let data {}await this.$refs.formRef.validate((valid) {const errmsg 验证不通过if (valid) {data callback ? callback({ data: initFormData, valid: true }) : { data: initFormData, valid: true }} else {data { valid: false }}})return data// if (noCheck) {// return this.checkFormData(callback, initFormData)// }},getFormDataNoCheck(callback) { // 获取数据不需要校验if (!this.$refs.formRef) returnconst initFormData this.initSaveFormData(JSON.parse(JSON.stringify(this.formData)))this.$refs.formRef.clearValidate()return (callback ? callback({ data: initFormData, valid: true }) : { data: initFormData, valid: true })},initSaveFormData(initFormData) {Object.keys(this.model).forEach(modelKey {initFormData.forEach(formData {if (formData.key modelKey) {if (formData.key supervisionCycle) {formData.deliveryTime this.subMissionData}formData[formData.defaultProps.value] this.model[modelKey]}})})return initFormData},// 显示报送周期showSubMission() {this.$refs.submissionDialog.showVisilie()},// 回显周期数据confirmMission(callData) {this.$set(this.model, supervisionCycle, callData[supervisionCycle])Object.keys(this.subMissionData).forEach(item {this.$set(this.subMissionData, item, callData[item])})},getFileList(fileList) {this.fileList fileList.map((item, index) {return {source: item.source || ,fileId: item.fileId,fileName: item.name,name: item.name,fileSize: item.fileSize,sort: index 1,suffixName: item.iconType}})this.$set(this.model, fileJson, JSON.stringify(this.fileList))},removeFile(data) {this.fileList this.fileList.filter(item {return item.fileId ! data.fileId})this.$set(this.model, fileJson, JSON.stringify(this.fileList))},// 输入框失去焦点handleBlur(data) {if (data.isMate) {console.log(1440, data, this.model[data.key], this.formData)this.$emit(getMatched, data, this.model, this.formData)}}}
}
/scriptstyle langscss scoped// .el-form{// padding: 27px 16px 9px;// }.form{::v-deep .el-autocomplete{width: 100%;}::v-deep .el-form-item{:last-of-type{margin-right: 0;}}::v-deep .el-form--inline{display: flex;justify-content: space-between;}::v-deep .el-form--inline{.el-form-item{display: flex;margin-right: 0;}}::v-deep .el-tag{line-height: initial;}::v-deep .el-form-item__content{width: 100%;flex: 1}::v-deep .el-date-editor.el-input, ::v-deep .el-date-editor.el-input__inner{width: inherit;}}.el-select{width: 100%;}.hint{margin-left: 6px;}// .dialogObj-text-box {// margin-left: 12px;// min-width: 60px;// :hover {// color: #1a8af9;// cursor: pointer;// }// }/style
