From 2e7f611bdfb28fdc16e2bc4fc19498851fe364d1 Mon Sep 17 00:00:00 2001
From: 田源 <lastanimals@163.com>
Date: 星期一, 24 七月 2023 09:46:54 +0800
Subject: [PATCH] 动态组件
---
Source/UBCS-WEB/src/components/Tree/attrCrud.vue | 252 +++++++++++++++++++++++++++++++++++---------------
1 files changed, 175 insertions(+), 77 deletions(-)
diff --git a/Source/UBCS-WEB/src/components/Tree/attrCrud.vue b/Source/UBCS-WEB/src/components/Tree/attrCrud.vue
index 016b46f..ec68c50 100644
--- a/Source/UBCS-WEB/src/components/Tree/attrCrud.vue
+++ b/Source/UBCS-WEB/src/components/Tree/attrCrud.vue
@@ -1,38 +1,38 @@
<template>
<div>
- <div style="display: flex;flex-wrap: wrap;" v-if="this.crudArrayFlag">
- <el-button-group>
+ <div style="display: flex;flex-wrap: wrap;" v-if="this.crudArrayFlag"class="app">
+
<!--鏂板-->
- <el-button v-if="attrEditVisible == false && attrFlagChiledren==false" size="small" type="primary" icon="el-icon-plus" @click="busineHandle">娣诲姞 {{ msg }}</el-button>
+ <el-button v-if="attrEditVisible == false && attrFlagChiledren==false && crudLCStatus=='Editing'" size="small" type="primary" icon="el-icon-plus" @click="busineHandle">娣诲姞 {{ msg }}</el-button>
<!-- 鍏ㄥ睆缂栬緫-->
- <el-button v-if=" attrEditVisible == false && attrFlagChiledren==false" size="small" @click="fullscreenHandle" icon="el-icon-full-screen">鍏ㄥ睆缂栬緫</el-button>
+ <el-button v-if=" attrEditVisible == false && attrFlagChiledren==false && crudLCStatus=='Editing'" size="small" @click="fullscreenHandle" icon="el-icon-full-screen">鍏ㄥ睆缂栬緫</el-button>
<!-- 楠岃瘉瑙勫垯-->
- <el-button icon="el-icon-info" size="small" @click="rulesVisible=true">楠岃瘉瑙勫垯</el-button>
+ <el-button v-if="crudLCStatus=='Editing'" icon="el-icon-info" size="small" @click="ruleAddHandler">楠岃瘉瑙勫垯</el-button>
<!-- 灞炴�у垎缁�-->
- <el-button icon="el-icon-menu" size="small" @click="attrVisibleHandle">灞炴�у垎缁�</el-button>
- </el-button-group>
- <el-button-group>
+ <el-button v-if="crudLCStatus=='Editing'" icon="el-icon-menu" size="small" @click="attrVisibleHandle">灞炴�у垎缁�</el-button>
+
+
<!-- 鍒嗙被娉ㄥ叆-->
- <el-button icon="el-icon-magic-stick" size="small" @click="injectBtn">鍒嗙被娉ㄥ叆</el-button>
+ <el-button v-if="crudLCStatus=='Editing'" icon="el-icon-magic-stick" size="small" @click="injectBtn">鍒嗙被娉ㄥ叆</el-button>
<!-- 缁勫悎瑙勫垯-->
- <el-button size="small" @click="isShowHandler">缁勫悎瑙勫垯</el-button>
+ <el-button v-if="crudLCStatus=='Editing'" size="small" @click="isShowHandler">缁勫悎瑙勫垯</el-button>
<!-- 鏋氫妇娉ㄥ叆-->
- <el-button size="small" @click="enmuVisHandle">鏋氫妇娉ㄥ叆</el-button>
+ <el-button v-if="crudLCStatus=='Editing'" size="small" @click="enmuVisHandle">鏋氫妇娉ㄥ叆</el-button>
<!-- 绾ц仈灞炴��-->
- <el-button size="small" @click="CascadeHandle">绾ц仈灞炴��</el-button>
+ <el-button v-if="crudLCStatus=='Editing'" size="small" @click="CascadeHandle">绾ц仈灞炴��</el-button>
<!-- 棰勮鎺掑簭-->
<el-button size="small" @click="orderHandle" icon="el-icon-arrow-down">棰勮鎺掑簭</el-button>
- </el-button-group>
- <el-button-group>
+
+
<!-- 淇濆瓨-->
- <el-button size="small" @click="addsHandler" icon="el-icon-check">淇濆瓨</el-button>
+ <el-button v-if="crudLCStatus=='Editing'" size="small" @click="addsHandler" icon="el-icon-check">淇濆瓨</el-button>
<!-- 鍒犻櫎-->
- <el-button size="small" @click="CrudRemove" icon="el-icon-delete">鍒犻櫎</el-button>
+ <el-button v-if="crudLCStatus=='Editing'" size="small" @click="CrudRemove" icon="el-icon-delete">鍒犻櫎</el-button>
<!-- 閲嶇疆-->
<el-button size="small" @click="reset" icon="el-icon-refresh-right">閲嶇疆</el-button>
<!-- 鍚屾鍒板叾浠栨ā鏉�-->
<el-button size="small"@click="syncHandle" icon="el-icon-share">鍚屾鍒板叾浠栨ā鏉�</el-button>
- </el-button-group>
+
<!-- 缂栫爜鐢宠棰勮-->
<el-button size="small" @click="applicationHandle" style="">缂栫爜鐢宠棰勮</el-button>
<!-- 楠岃瘉瑙勫垯-->
@@ -64,7 +64,7 @@
</div>
</el-dialog>
<!-- 鏋氫妇娉ㄥ叆-->
- <el-dialog :visible.sync="enumVisible" append-to-body title="鏋氫妇娉ㄥ叆">
+ <el-dialog :visible.sync="enumVisible" append-to-body title="鏋氫妇娉ㄥ叆" :before-close="this.enumBeforeClose">
<!-- 娓叉煋琛ㄦ牸鍙婃寜閽� -->
<!-- 娓叉煋琛ㄦ牸鍙婃寜閽� -->
<div>
@@ -72,11 +72,6 @@
<el-table :data="tableData" style="width: 100%" @cell-click="handleCellClick"
@selection-change="handleSelectionChange">
<!-- 娓叉煋琛ㄦ牸鍒楀強浼犲弬 -->
- <el-table-column label="搴忓彿" type="index"></el-table-column>
- <el-table-column
- type="selection"
- width="55">
- </el-table-column>
<el-table-column label="閫夐」鍊�" prop="key">
<template slot-scope="{ row }">
<!-- 缂栬緫鍜屽睍绀洪�昏緫 -->
@@ -103,7 +98,7 @@
<template>
<div style="display: flex;justify-content: right;margin-top: 15px">
<el-button size="small" type="primary" @click="enumAddHandle">淇濆瓨</el-button>
- <el-button size="small" @click="enumVisible=false">鍙栨秷</el-button>
+ <el-button size="small" @click="enumCancell">鍙栨秷</el-button>
</div>
</template>
</div>
@@ -208,6 +203,7 @@
:thisSceneTableData="thisSceneTableData"
:visible.sync="isShowformulaEdit"
@updateFormulaContent="updataFormlaContent"
+ :componentRuleText="componentRuleText"
></formula-editor>
<!-- 鏂板 -->
<el-dialog :visible.sync="addVisible" append-to-body title="浠庝笟鍔＄被鍨嬩腑閫夋嫨灞炴��">
@@ -233,15 +229,18 @@
<el-button size="small" type="primary" @click="addVisible=false">鍙栨秷</el-button>
</div>
</el-dialog>
+
<!-- 鍙傜収閰嶇疆-->
- <refer-config-form-dialog
- ref="referConfigFormDialog"
- @echoReferConfig="echoReferConfig"
- ></refer-config-form-dialog>
+ <refer-config-dialog
+ :display="referConfigVisble"
+ @setReferConfigValue="setReferConfigValue"
+ :referConfigOption="referConfigOption"
+ ></refer-config-dialog>
+
</div>
<el-table :data="ProData"
style="width: 100%"
- height="280"
+ height="750"
@cell-click="handleCellClicks"
@select="selectHandle"
@selection-change="selectionChange"
@@ -269,7 +268,7 @@
@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"
@@ -292,7 +291,7 @@
<el-button
size="small"
type="text"
- @click.native.prevent="CrudRowDel(scope.row)">
+ @click.native.prevent="CrudRowDel(scope.$index)">
绉婚櫎
</el-button>
</template>
@@ -314,6 +313,10 @@
crudOid: {
type: String,
default: ''
+ },
+ crudLCStatus: {
+ type: String,
+ default: 'Editing'
},
crudArray: {
type: Array,
@@ -351,6 +354,11 @@
},
data() {
return {
+ referConfigText:"",
+ referConfigVisble:false,
+ referConfigOption:{
+ referConfig:'',
+ },
screenWidth: document.documentElement.clientWidth, // 灞忓箷瀹藉害
//褰撳墠鍗曞厓鏍�
CurrentCell:'',
@@ -373,6 +381,7 @@
editingRows: null,
editShows:"",
attrFlag: false,
+ referObject:{},
//缂栫爜鐢宠棰勮option
applicationoption: {
column: []
@@ -783,7 +792,8 @@
// 灞炴�ч獙璇佽緭鍏ユ
RulesForm: {
expressionText: "",
- TestContent: ""
+ TestContent: "",
+ ruleRowBds:""
},
//灞炴�ч獙璇佽鍒欓厤缃�
rulesOption: {
@@ -1324,6 +1334,9 @@
},
//鏃堕棿鏍煎紡涓嬫媺妗�
codeDataFlag:false,
+ // 缁勫悎瑙勫崟鍏冩牸缂栬緫鍥炲～
+ componentRuleText:"",
+
}
},
computed:{
@@ -1343,20 +1356,13 @@
}
},
mounted() {
- window.addEventListener(
- 'resize',
- () => {
- if(Math.abs(this.screenWidth - document.body.clientWidth) > 20) {
- this.$nextTick(() => {
- this.$refs.AddOriginPlace.refreshTable();
- })
- }
- this.screenWidth = document.body.clientWidth;
- }
- )
},
created() {
-
+ this.option.column.forEach((item,index) => {
+ if (item.edit == 'select') {
+ this.selectChangeHandler(item.editConfig,index)
+ }
+ })
},
methods: {
formAttr(row, column) {
@@ -1383,15 +1389,16 @@
//鍙傜収閰嶇疆瀛愮粍浠�
echoReferConfig(val){
console.log('val--',val)
+ this.referObject=val
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;
})
@@ -1399,7 +1406,7 @@
//灞炴�у垎缁勬寜閽�
attrVisibleHandle() {
if (this.attrSelectList < 1) {
- this.$message.warning('璇烽�夋嫨涓�鏉℃ā鏉垮睘鎬�')
+ this.$message.warning('璇烽�夋嫨妯℃澘灞炴��')
} else {
this.attrVisible = true;
console.log(this.attrSelectList)
@@ -1407,7 +1414,12 @@
},
//灞炴�у垎缁勬彁浜�
attrHandle() {
- this.$set(this.attrRow, 'attributeGroup', this.attrModel)
+ console.log(this.attrSelectList)
+ // this.$set(this.attrRow, 'attributeGroup', this.attrModel)
+ // this.attrSelectList.attributeGroup=this.attrModel
+ this.attrSelectList.forEach(item=>{
+ item.attributeGroup=this.attrModel
+ })
this.attrModel = "";
this.attrVisible = false;
},
@@ -1460,7 +1472,8 @@
sortAttrFlag: 'false',
queryAttrFlag: 'true',
seniorQueryAttrFlag: 'true',
- attrTableWidth: 120
+ attrTableWidth: 120,
+ ts:""
})
this.ProData.push(JSON.parse(JSON.stringify(this.busineAddList)))
}
@@ -1470,7 +1483,8 @@
},
//涓氬姟绫诲瀷閫夋嫨
businessSelect(selection, row) {
- this.busineSelectList = selection
+ this.busineSelectList = selection;
+ console.log(selection)
},
// 浠庝笟鍔＄被鍨嬩腑閫夋嫨鏁版嵁寮圭獥
busineHandle() {
@@ -1505,7 +1519,11 @@
CascadeAddHandle() {
let CascadeString = "";
CascadeString = this.selectRowArr.id + (this.selectRowArr.name);
- this.$set(this.attrRow, 'parentCode', CascadeString)
+ if(this.CurrentCell){
+ this.$set(this.CurrentCell, 'parentCode', CascadeString)
+ }else {
+ this.$set(this.attrSelectList[0], 'parentCode', CascadeString)
+ }
this.CascadeVisible = false;
},
//绾ц仈灞炴�ф竻闄�
@@ -1528,7 +1546,7 @@
console.log(row)
},
//琛ㄦ牸閫夋嫨
- selectionChange(list,) {
+ selectionChange(list) {
this.attrSelectList = list;
console.log(list)
},
@@ -1544,24 +1562,46 @@
this.editingRows = row;
this.editShows = column.property;
this.rowOid = row.oid;
- console.log(row,column)
this.CurrentCell=row;
if(column.property == 'referConfig' ){
- this.$refs.referConfigFormDialog.isShowReferConfigForm = true;
- this.$refs.referConfigFormDialog.onloadAttrData();
+ this.referConfigVisble= true;
+ this.referConfigOption = {
+ referConfig: this.referConfigText || '',
+ }
+ if(this.CurrentCell.referConfig == ''){
+ this.referConfigOption = {
+ referConfig:'',
+ }
+ }
+ console.log('--',this.referConfigOption)
+ // this.$refs.referConfigFormDialog.onloadAttrData();
}else if(column.property == 'classifyInvokeLevelName'){
this.injectVisible=true;
}else if(column.property == 'componentRule'){
+ if(this.CurrentCell){
+ this.CurrentCell.componentRule=this.componentRuleText;
+ }
this.isShowformulaEdit = true;
}else if(column.property == 'enumString'){
this.enumVisible=true;
}else if(column.property == 'parentCode'){
+ gridCodeClassifyTemplateAttr({
+ 'conditionMap[classifyTemplateOid]': this.Formlist[0].oid,
+ 'conditionMap[oid_notequal]': this.CurrentCell.oid
+ }).then(res => {
+ console.log(res)
+ this.CascadeData = res.data.data;
+ })
this.CascadeVisible=true;
+ }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() {
this.editingRows = null;
- console.log('1321')
},
// 鏋氫妇娉ㄥ叆娣诲姞涓�琛岀┖鏁版嵁
addRow() {
@@ -1589,20 +1629,40 @@
this.enumVisible = true;
}
},
+ enumBeforeClose(done){
+ this.tableData=[]
+ done()
+ },
+ enumCancell(){
+ this.tableData=[]
+ this.enumVisible=false;
+ },
//鏋氫妇娉ㄥ叆澶氶�夋
handleSelectionChange(row) {
this.enumRow = JSON.parse(JSON.stringify(row));
},
//鏋氫妇娉ㄥ叆淇濆瓨
enumAddHandle() {
- if (this.enumRow.length < 1) {
- this.$message.warning('璇疯嚦灏戦�夋嫨涓�鏉℃暟鎹�')
- } else {
- if(this.CurrentCell){
- this.$set(this.CurrentCell, 'enumString', JSON.stringify(this.enumRow));
+ let hasError = false; // 娣诲姞涓�涓彉閲�
+ this.tableData.forEach((item, index) => {
+ if (item.key === '') {
+ this.$message.warning(`绗�${index + 1}琛岀殑閫夐」鍊间笉鑳戒负绌篳);
+ hasError = true;
+ return;
+ } else if (item.value === '') {
+ this.$message.warning(`绗�${index + 1}琛岀殑閫夐」涓枃鏍囩涓嶈兘涓虹┖`);
+ hasError = true;
+ return;
+ }
+ });
+ // 淇濆瓨鎵ц閫昏緫
+ if (!hasError) {
+ if (this.CurrentCell) {
+ this.$set(this.CurrentCell, 'enumString', JSON.stringify(this.tableData));
this.enumVisible = false;
- }else {
- this.$set(this.attrRow, 'enumString', JSON.stringify(this.enumRow));
+ } else {
+ this.$set(this.attrSelectList[0], 'enumString', JSON.stringify(this.tableData));
+ this.tableData=[];
this.enumVisible = false;
}
}
@@ -1611,8 +1671,18 @@
saveRow() {
this.editingRow = null;
},
+ //楠岃瘉瑙勫垯鎸夐挳
+ ruleAddHandler(){
+ if (this.attrSelectList < 1) {
+ this.$message.warning('璇烽�夋嫨妯℃澘灞炴��')
+ } else{
+ this.rulesVisible=true
+ }
+
+ },
//瑙勫垯鏍￠獙锛屽弻鍑昏〃鍗曚簨浠�
handleRulesRowDBLClick(row) {
+ this.ruleRowBds=row.bds
this.RulesForm.expressionText = row.bds
},
// 楠岃瘉瑙勫垯娓呴櫎鍐呭
@@ -1622,11 +1692,21 @@
},
// 楠岃瘉瑙勫垯纭畾
rulesHandle() {
+ if(this.CurrentCell){
+ this.$set(this.CurrentCell,'verifyRule',this.RulesForm.expressionText)
+ }else {
+ this.attrSelectList.forEach((item)=>{
+ this.$set(item,'verifyRule',this.RulesForm.expressionText)
+ })
+ this.rulesremove()
+ }
this.rulesVisible = false
},
//楠岃瘉瑙勫垯妫�鏌�
rulesExamine() {
- if (this.RulesForm.expressionText.test(this.RulesForm.TestContent)) {
+ console.log(this.RulesForm.expressionText)
+ const regex = new RegExp(this.rulesData.ruleRowBds);
+ if(regex.test(this.RulesForm.TestContent)){
this.$message.success('鏍￠獙鎴愬姛')
}
},
@@ -1637,7 +1717,8 @@
} else if (this.attrSelectList.length < 1) {
this.$message.warning('璇烽�夋嫨涓�鏉℃ā鏉挎暟鎹�')
} else if (this.attrSelectList.length === 1) {
- this.injectVisible = true
+ this.injectVisible = true;
+
}
},
//鍒嗙被娉ㄥ叆淇濆瓨
@@ -1652,8 +1733,8 @@
this.$set(this.CurrentCell, "classifyInvokeLevelName", data);
this.$set(this.CurrentCell, "classifyInvokeLevel", JSON.stringify(this.injectOption));
}else {
- this.$set(this.attrRow, 'classifyInvokeLevelName', data);
- this.$set(this.attrRow, 'classifyInvokeLevel', JSON.stringify(this.injectOption));
+ this.$set(this.attrSelectList[0], 'classifyInvokeLevelName', data);
+ this.$set(this.attrSelectList[0], 'classifyInvokeLevel', JSON.stringify(this.injectOption));
}
this.injectVisible = false
},
@@ -1670,18 +1751,24 @@
},
//灞炴�фā鏉胯〃鏍煎崟鍏冩牸鐐瑰嚮浜嬩欢
//琛ㄦ牸鎿嶄綔鏍忓垹闄�
- CrudRowDel(row) {
- this.ProData.splice(row.$index, 1)
+ CrudRowDel(index) {
+ this.ProData.splice(index, 1)
},
//琛ㄦ牸鍒犻櫎
CrudRemove() {
this.attrSelectList.forEach((item)=>{
- this.ProData.splice(item.$index, 1)
+ const index = this.ProData.indexOf(item);
+ this.ProData.splice(index, 1)
})
},
//琛ㄦ牸閲嶇疆
reset() {
- this.CrudRend()
+ // this.CrudRend(
+ this.referConfigVisble=true;
+ this.referConfigOption = {
+ referConfig: 'confing',
+ }
+ console.log(this.referConfigOption)
},
//鍚屾鍒板叾浠栨ā鏉�
syncHandle() {
@@ -1727,11 +1814,20 @@
//缁勫悎瑙勫垯纭畾
updataFormlaContent(val) {
if(this.CurrentCell){
- this.$set(this.CurrentCell, 'componentRule', JSON.stringify(val))
+ this.$set(this.CurrentCell, 'componentRule', val.replace(/"/g, ''))
}else {
- this.$set(this.attrRow, 'componentRule', JSON.stringify(val))
+ this.$set(this.attrRow, 'componentRule', val.replace(/"/g, ''))
}
+ },
+ setReferConfigValue(content){
+ let submitFormJson = JSON.stringify(content);
+ this.referConfigText=submitFormJson
+ if(this.CurrentCell){
+ this.$set(this.CurrentCell, 'referConfig', JSON.stringify(content))
+ }else {
+ this.$set(this.attrRow, 'referConfig', JSON.stringify(content))
+ }
},
// 鎺掑簭
sortChange(val) {
@@ -1752,7 +1848,9 @@
</script>
<style scoped lang="scss" >
-/deep/ .el-button {
- margin: 0 10px 10px 0;
+.app {
+ /deep/ .el-button {
+ margin: 0 10px 10px 0;
+ }
}
</style>
--
Gitblit v1.9.3