| | |
| | | <template> |
| | | <div> |
| | | <div style="display: flex;flex-wrap: wrap;" v-if="this.crudArrayFlag"> |
| | | <div style="display: flex;flex-wrap: wrap;" v-if="this.crudArrayFlag" class="app"> |
| | | <el-button-group> |
| | | <!--新增--> |
| | | <el-button v-if="attrEditVisible == false && attrFlagChiledren==false" size="small" type="primary" icon="el-icon-plus" @click="busineHandle">添加 {{ msg }}</el-button> |
| | |
| | | </div> |
| | | <el-table :data="ProData" |
| | | style="width: 100%" |
| | | height="280" |
| | | :height='attrEditVisible == false && attrFlagChiledren==false?400 :750' |
| | | @cell-click="handleCellClicks" |
| | | @select="selectHandle" |
| | | @selection-change="selectionChange" |
| | |
| | | @blur="saveRows"></el-input> |
| | | <el-input-number size="small" controls-position="right" v-if="editingRows === row && editShows== item.prop && item.edit == 'number'" v-model="row[item.prop]" |
| | | @blur="saveRows" :style="{width:(item.width-10)+'px'}"></el-input-number> |
| | | <el-select v-model="row[item.prop]" filterable allow-create default-first-option slot="prepend" v-if="editingRows === row && editShows== item.prop && item.edit == 'select' " @visible-change="DataChangeHandler($event,item.editConfig,index)"> |
| | | <el-select v-model="row[item.prop]" filterable allow-create default-first-option slot="prepend" v-if="editingRows === row && editShows== item.prop && item.edit == 'select' " @blur="selectChangeHandler(item.editConfig,index)"> |
| | | <el-option |
| | | v-for="optionItem in item.data" |
| | | :key="optionItem.dictValue" |
| | |
| | | column: [ |
| | | { |
| | | label: "属性英文名称", |
| | | prop: "id" |
| | | prop: "id", |
| | | width:110 |
| | | }, |
| | | { |
| | | label: "属性中文名称", |
| | | prop: "name" |
| | | prop: "name", |
| | | width:110 |
| | | }, |
| | | { |
| | | label: "长度", |
| | |
| | | ) |
| | | }, |
| | | created() { |
| | | |
| | | this.option.column.forEach((item,index) => { |
| | | if (item.edit == 'select') { |
| | | this.selectChangeHandler(item.editConfig,index) |
| | | } |
| | | }) |
| | | }, |
| | | methods: { |
| | | formAttr(row, column) { |
| | |
| | | this.$set(this.CurrentCell,'referConfig',JSON.stringify(val)) |
| | | |
| | | }, |
| | | //时间下拉格式 |
| | | DataChangeHandler($event,editConfig,index){ |
| | | //可输可选下拉 |
| | | selectChangeHandler(editConfig,index){ |
| | | let that=this; |
| | | if(!$event){ |
| | | /*if(that.option.column[index].data && that.option.column[index].data.length>=0){ |
| | | return; |
| | | } |
| | | }*/ |
| | | listByFlag(editConfig.extraParams).then(res=>{ |
| | | that.option.column[index].data=res.data.data; |
| | | }) |
| | |
| | | //属性分组按钮 |
| | | attrVisibleHandle() { |
| | | if (this.attrSelectList < 1) { |
| | | this.$message.warning('请选择一条模板属性') |
| | | this.$message.warning('请选择模板属性') |
| | | } else { |
| | | this.attrVisible = true; |
| | | console.log(this.attrSelectList) |
| | |
| | | //业务类型选择 |
| | | businessSelect(selection, row) { |
| | | this.busineSelectList = selection |
| | | console.log(selection) |
| | | }, |
| | | // 从业务类型中选择数据弹窗 |
| | | busineHandle() { |
| | |
| | | }else if(column.property == 'verifyRule'){ |
| | | this.RulesForm.expressionTextt=this.CurrentCell.verifyRule; |
| | | this.rulesVisible=true; |
| | | console.log(this.CurrentCell.verifyRule) |
| | | console.log(this.RulesForm.expressionText) |
| | | } |
| | | }, |
| | | saveRows() { |
| | |
| | | }, |
| | | //验证规则按钮 |
| | | ruleAddHandler(){ |
| | | if(this.attrSelectList.length>1){ |
| | | this.$message.warning('只能选择一条数据') |
| | | }else if(this.attrSelectList.length<1){ |
| | | this.$message.warning('请选择一提模板属性') |
| | | }else if(this.attrSelectList.length === 1){ |
| | | if (this.attrSelectList < 1) { |
| | | this.$message.warning('请选择模板属性') |
| | | } else{ |
| | | this.rulesVisible=true |
| | | } |
| | | |
| | |
| | | }, |
| | | // 验证规则确定 |
| | | rulesHandle() { |
| | | if(this.CurrentCell.length>0){ |
| | | if(this.CurrentCell){ |
| | | this.$set(this.CurrentCell,'verifyRule',this.RulesForm.expressionText) |
| | | }else { |
| | | console.log(this.attrSelectList) |
| | | this.$set(this.attrSelectList[0],'verifyRule',this.RulesForm.expressionText) |
| | | this.attrSelectList.forEach((item)=>{ |
| | | this.$set(item,'verifyRule',this.RulesForm.expressionText) |
| | | }) |
| | | this.rulesremove() |
| | | } |
| | | this.rulesVisible = false |
| | |
| | | </script> |
| | | |
| | | <style scoped lang="scss" > |
| | | /deep/ .el-button { |
| | | margin: 0 10px 10px 0; |
| | | .app { |
| | | /deep/ .el-button { |
| | | margin: 0 10px 10px 0; |
| | | } |
| | | } |
| | | </style> |