From dcf9c9e0410fe1186239e3f8d6f7bdc789c08010 Mon Sep 17 00:00:00 2001
From: lzhe <lzhe@example.com>
Date: 星期三, 05 六月 2024 18:00:39 +0800
Subject: [PATCH] 1
---
src/views/console/system/meta-object-type/index.vue | 521 ++++++++++++++++++++++++++++++++++++---------------------
1 files changed, 325 insertions(+), 196 deletions(-)
diff --git a/src/views/console/system/meta-object-type/index.vue b/src/views/console/system/meta-object-type/index.vue
index cb4edaf..f8b2261 100644
--- a/src/views/console/system/meta-object-type/index.vue
+++ b/src/views/console/system/meta-object-type/index.vue
@@ -2,7 +2,7 @@
* @Author: lzhe lzhe@example.com
* @Date: 2024-03-26 10:28:33
* @LastEditors: lzhe lzhe@example.com
- * @LastEditTime: 2024-05-13 12:15:04
+ * @LastEditTime: 2024-05-14 16:22:28
* @FilePath: /smart-web/src/views/master/person/main/index.vue
* @Description: 杩欐槸榛樿璁剧疆,璇疯缃甡customMade`, 鎵撳紑koroFileHeader鏌ョ湅閰嶇疆 杩涜璁剧疆: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
@@ -10,96 +10,151 @@
<div class="aposcope-main">
<div class="aposcope-left">
<div class="left-title">涓氬姟鍒楄〃</div>
- <el-tree :data="tableData" row-key="id" :props="defalutProps" @node-click="handleNodeClick" ref="treeRef" default-expand-all :highlight-current="true" :expand-on-click-node="false" :default-checked-keys="treeCheck"/>
+ <el-tree :data="tableData" node-key="id" :props="defalutProps" @node-click="handleNodeClick" ref="treeRef" default-expand-all :highlight-current="true" :expand-on-click-node="false"/>
</div>
<div class="aposcope-right">
- <div class="right-top">
- <div>
- <el-button type="primary" @click="addData">+ 娣诲姞瑙勫垯</el-button>
- <el-button type="danger" plain @click="delData" disabled>鍒犻櫎</el-button>
- </div>
- <el-button @click="openVisible">寮�鍚鍒欏垎绫�</el-button>
+ <div class="right-content">
+ <div class="content-title"><span>*</span>鎵�鍦ㄧ墿鐞嗚〃</div>
+ <el-select v-model="metaForm.tableName" :disabled="isDis">
+ <el-option v-for="item in tableNameList" :key="item.tableName" :label="item.tableName" :value="item.tableName"/>
+ </el-select>
</div>
- <div class="right-content" v-if="searchDataList.length == 0">
- <!-- <img src="./quesheng.bd026700.png" /> -->
- <div>
- <span>鏆傛棤鏁版嵁</span>
- <!-- <span @click="addData">娣诲姞瑙勫垯</span> -->
- </div>
+ <div class="right-content">
+ <div class="content-title"><span>*</span>瀛楁1</div>
+ <el-select v-model="metaForm.refCode" :disabled="isDis">
+ <el-option v-for="item in refCodeList" :key="item.columnName" :label="item.columnName" :value="item.columnName"/>
+ </el-select>
</div>
- <el-table v-if="searchDataList.length != 0" ref="searchDataListRef" :data="searchDataList" border style="width: 100%;margin-top: 20px;" class="multipleTableRef" @selection-change="searchHandleSelectionChange">
- <el-table-column type="selection" width="55" />
- <el-table-column prop="moduleCode" label="鎺ュ彛妯″潡"></el-table-column>
- <el-table-column prop="controllerCode" label="Controller"></el-table-column>
- <el-table-column prop="scopeName" label="action"></el-table-column>
- <el-table-column prop="httpMethod" label="Http鏂规硶"></el-table-column>
- <el-table-column prop="scopePath" label="api鍦板潃"></el-table-column>
- </el-table>
- </div>
- <el-drawer :title="'褰撳墠閫変腑鑿滃崟璺緞'+drawerPath" v-model="drawer" :direction="direction" :before-close="handleClose" size="780" class="drawerClass">
- <el-form :inline="true" :model="drawerSearchData" abel-width="120px">
- <el-form-item label="鎺ュ彛妯″潡">
- <el-select v-model="drawerSearchData.moduleCode" style="width: 100%">
- <el-option v-for="item in aList" :key="item.id" :label="item.title" :value="item.id"/>
- </el-select>
- </el-form-item>
- <el-form-item label="鎺ュ彛Controller">
- <el-select v-model="drawerSearchData.controllerCode" style="width: 100%">
- <el-option v-for="item in aList" :key="item.id" :label="item.title" :value="item.id"/>
- </el-select>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" @click="drawerSearchclick">鎼滅储</el-button>
- </el-form-item>
- </el-form>
- <div>
- <div class="dict-table">
- <el-table ref="multipleTableRef" :data="drawerTableData" border style="width: 100%" class="multipleTableRef" @selection-change="drawerHandleSelectionChange">
- <el-table-column type="selection" width="55" />
- <el-table-column prop="className" label="鎺ュ彛妯″潡"></el-table-column>
- <el-table-column prop="controllerCode" label="Controller"></el-table-column>
- <el-table-column prop="name" label="action"></el-table-column>
- <el-table-column prop="httpMethod" label="Http鏂规硶"></el-table-column>
- <el-table-column prop="url" label="api鍦板潃"></el-table-column>
- </el-table>
- </div>
+ <div class="right-content">
+ <div class="content-title"><span>*</span>瀛楁2</div>
+ <el-select v-model="metaForm.refName" :disabled="isDis">
+ <el-option v-for="item in refCodeList" :key="item.columnName" :label="item.columnName" :value="item.columnName"/>
+ </el-select>
</div>
- <div class="drawer-foot">
- <el-button type="primary" @click="drawerConfirm" disabled>娣诲姞</el-button>
- <el-button @click="closeDrawer">鍙栨秷</el-button>
+ <div class="right-content">
+ <div class="content-title">缂栫爜瀛楁</div>
+ <el-select v-model="metaForm.code">
+ <el-option v-for="item in refCodeList" :key="item.columnName" :label="item.columnName" :value="item.columnName"/>
+ </el-select>
</div>
- </el-drawer>
- <el-dialog title="瑙勫垯鍒嗙被" v-model="visible" :width="600" @closed="closeVisible('closed')">
- <el-form :model="classificationForm" :rules="classificationRules" ref="dialogForm" label-width="120px"
- label-position="center">
- <el-row>
- <el-col :span="12">
- <el-form-item label="鍒嗙被瀛楁" prop="classify">
- <el-select v-model="classificationForm.classify" style="width: 100%" placeholder="璇烽�夋嫨">
- <el-option v-for="item in aList" :key="item.id" :label="item.title" :value="item.id"/>
+ <div class="right-content">
+ <div class="content-title">鍙傛暟璁剧疆</div>
+ <el-button type="primary" @click="addParameter" :disabled="isAdd">娣诲姞鍙傛暟</el-button>
+ </div>
+ <el-table ref="searchDataListRef" :data="searchDataList" border style="width: 100%;margin-top: 20px;" class="multipleTableRef">
+ <el-table-column prop="fcode" label="瀛楁缂栫爜">
+ <template #default="scope">
+ <div v-if="scope.row.isEdit">
+ <span class="important-star">*</span>
+ <el-select v-model="tableForm.fcode" style="width: 90%;">
+ <el-option v-for="item in refCodeList" :key="item.columnName" :label="item.columnName" :value="item.columnName"/>
</el-select>
- </el-form-item>
- </el-col>
- <el-col :span="12">
- <el-form-item label="鍒嗙被瀛楀吀">
- <el-input v-model="classificationForm.dictionary" placeholder="鍒嗙被瀛楀吀" clearable></el-input>
- </el-form-item>
- </el-col>
- </el-row>
- </el-form>
- <template #footer>
- <el-button @click="visible = false">鍙栨秷</el-button>
- <el-button type="primary" :loading="isSaveing" @click="classificationSubmit">纭畾</el-button>
- </template>
- </el-dialog>
+ </div>
+ <div v-else>{{scope.row.fcode}}</div>
+ </template>
+ </el-table-column>
+ <el-table-column prop="fname" label="瀛楁鏍囬">
+ <template #default="scope">
+ <div v-if="scope.row.isEdit">
+ <span class="important-star">*</span>
+ <el-input v-model="tableForm.fname" style="width: 90%;"></el-input>
+ </div>
+ <div v-else>{{scope.row.fname}}</div>
+ </template>
+ </el-table-column>
+ <el-table-column prop="field" label="瀹炰綋灞炴��">
+ <template #default="scope">
+ <div v-if="scope.row.isEdit">
+ <span class="important-star">*</span>
+ <el-input v-model="tableForm.field" style="width: 90%;"></el-input>
+ </div>
+ <div v-else>{{scope.row.field}}</div>
+ </template>
+ </el-table-column>
+ <el-table-column prop="elementType" label="鍏冪礌绫诲瀷">
+ <template #default="scope">
+ <div v-if="scope.row.isEdit">
+ <span class="important-star">*</span>
+ <el-select v-model="tableForm.elementType" @change="elementTypeNameChange" style="width: 90%;">
+ <el-option v-for="item in dictionaryType" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
+ </el-select>
+ </div>
+ <div v-else>{{scope.row.elementTypeName}}</div>
+ </template>
+ </el-table-column>
+ <el-table-column prop="enumType" label="鏋氫妇绫诲瀷">
+ <template #default="scope">
+ <el-select v-if="scope.row.isEdit" v-model="tableForm.enumType" :disabled="tableForm.elementType!='4'" @change = enumTypeChange>
+ <el-option v-for="item in dictList" :key="item.id" :label="item.code" :value="item.id"/>
+ </el-select>
+ <div v-else>{{scope.row.enumTypeZn}}</div>
+ </template>
+ </el-table-column>
+ <el-table-column prop="seq" label="瀛楁椤哄簭">
+ <template #default="scope">
+ <el-input-number v-if="scope.row.isEdit" scope.row.isEdit v-model="tableForm.seq" :min="0" :max="99" style="width:100%;"/>
+ <div v-else>{{scope.row.seq}}</div>
+ </template>
+ </el-table-column>
+ <el-table-column prop="refObjectTypeId" label="寮曠敤鍏崇郴">
+ <template #default="scope">
+ <el-tree-select v-if="scope.row.isEdit" node-key="id" :props="defalutProps" v-model="tableForm.refObjectTypeId" :data="tableData" :render-after-expand="false" :disabled="tableForm.elementType!='5'" @node-click="handleNodeClick1"/>
+ <div v-else>{{scope.row.refObjectTypeIdZn}}</div>
+ </template>
+ </el-table-column>
+ <el-table-column label="鎿嶄綔">
+ <template #default="scope">
+ <div v-if="scope.row.isEdit">
+ <el-button size="small" type="primary" @click="comfirmTable">纭畾</el-button>
+ <el-button size="small" @click="cancelTable">鍙栨秷</el-button>
+ </div>
+ <div v-else>
+ <!-- <el-icon class="operationIcon" @click="editTable(scope.$index)"><Edit /></el-icon> -->
+ <el-icon class="operationIcon" @click="deleteTable(scope.$index)"><Delete /></el-icon>
+ </div>
+ </template>
+ </el-table-column>
+ </el-table>
+ <div class="saveBtn">
+ <el-button type="primary" @click="saveBtn" :disabled="isAdd">淇濆瓨</el-button>
+ </div>
+ </div>
</div>
</template>
<script>
+ import * as ElementPlusIconsVue from '@element-plus/icons-vue'
+ let icons = []
+ for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
+ icons.push(key)
+ }
export default {
- name: "apiscope",
+ name: "metaObject",
data(){
return {
- treeCheck: [],
+ dictList: [], //鏋氫妇绫诲瀷
+ elementTypeValue: "",
+ detailobj: {},
+ testList: [],
+ tableForm: {
+ fcode: "",
+ fname: "",
+ field: "",
+ elementType: "",
+ enumType: "",
+ seq: 0,
+ refObjectTypeId: ""
+ },
+ inputValue: "",
+ isAdd: false,
+ isDis: true,
+ tableNameList: [],
+ refCodeList: [],
+ metaForm: {
+ tableName: "",
+ refCode: "",
+ refName: "",
+ code: ""
+ },
classificationRules: {
classify: [
{ required: true, message: "璇烽�夋嫨鍒嗙被瀛楁" }
@@ -110,42 +165,158 @@
dictionary: ""
},
isSaveing: false,
- visible: false,
- drawerPath: "",
- searchData: {
- size: "15",
- current: "1"
- },
searchDataList: [], //鍙充晶鏁版嵁list
- aList: [],
- drawerSearchData: {
- moduleCode: "",
- controllerCode: "",
- menuId: "",
- size: "-1"
- },
- direction: "rtl",
- drawer: false,
defalutProps: {
label: 'dictValue',
children: 'children',
isLeaf: 'hasChildren'
},
- parentId: "0",
tableData: [],
- searchSelection: []
+ firstChild: [], //涓�绾ц彍鍗�
+ dictKey: "",
+ dictionaryType: [] //瀛楀吀绫诲瀷
}
},
created(){
},
mounted(){
- this.getMenuList();
+ this.getDictionary(); //瀛楀吀绫诲瀷
+ this.getDict(); //鏋氫妇绫诲瀷
},
components: {
-
- },
+ ...ElementPlusIconsVue
+ },
methods: {
+ getDict() { //鏋氫妇绫诲瀷
+ this.$HTTP.get("/api/blade-system/dict/list").then(res=> { //鐗╃悊琛�
+ if(res.code == 200) {
+ this.dictList = res.data;
+ }
+ })
+ },
+ editTable(index) {
+ this.isAdd = true;
+ var obj = Object.assign({},this.searchDataList[index],{isEdit: true});
+ this.searchDataList.splice(index,1,obj);
+ },
+ deleteTable(index) {
+ this.searchDataList.splice(index,1);
+ },
+ enumTypeChange(val) { //鏋氫妇绫诲瀷
+ this.dictList.forEach(item=> {
+ if(item.id == val) {
+ this.tableForm.enumTypeZn = item.code;
+ }
+ })
+ },
+ elementTypeNameChange(val) { //鍏冪礌绫诲瀷
+ this.dictionaryType.forEach(item=> {
+ if(item.dictKey == val) {
+ this.elementTypeValue = item.dictValue;
+ }
+ })
+ this.tableForm.enumType = "";
+ this.tableForm.refObjectTypeId = "";
+ },
+ saveBtn() {
+ var obj = Object.assign(this.detailobj,this.metaForm); //detailobj鐗╃悊鏁版嵁锛宮etaForm鍩虹鏁版嵁
+ obj.fields = this.searchDataList;
+ this.$HTTP.post("/api/blade-system/meta-object-type/submit",obj).then(res=> {
+ if(res.code == 200) {
+ this.$message.success("淇濆瓨鎴愬姛");
+ }
+ })
+ },
+ comfirmTable() {
+ this.cancelTable();
+ this.tableForm.refObjectTypeIdZn = this.tableForm.dictKey;
+ this.tableForm.elementTypeName = this.elementTypeValue;
+ this.tableForm.enumType = this.tableForm.enumTypeZn;
+ this.tableForm.id = null;
+ this.tableForm.objectId = this.detailobj.objectId;
+ this.searchDataList.unshift(this.tableForm);
+ },
+ cancelTable() {
+ this.searchDataList.splice(0,1);
+ this.isAdd = false;
+ },
+ addParameter() {
+ this.tableForm = {
+ fcode: "",
+ fname: "",
+ field: "",
+ elementType: "",
+ enumType: "",
+ seq: 0,
+ refObjectTypeId: ""
+ }
+ this.isAdd = true;
+ var obj = Object.assign({},this.tableForm,{isEdit: true})
+ obj.id = null;
+ this.searchDataList.unshift(obj);
+ },
+ getDictionary() { //瀛楀吀绫诲瀷
+ this.$HTTP.get("/api/blade-system/dict/dictionary?code=element_type").then(res=> { //鐗╃悊琛�
+ if(res.code == 200) {
+ this.dictionaryType = res.data;
+ this.getMenuList();
+ }
+ })
+ },
+ getList() {
+ this.$HTTP.get(`/api/blade-system/bascoderule/count?type=${this.dictKey}`).then(res=> { //鏄惁鍙��
+ if(res.code == 200) {
+ if(res.data == 1) {
+ this.isDis = true;
+ }else {
+ this.isDis = false;
+ }
+ }
+ })
+ this.$HTTP.get("/api/blade-system/meta-object-type/tableDetail").then(res=> { //鐗╃悊琛�
+ if(res.code == 200) {
+ this.tableNameList = res.data;
+ this.gettableName(); //鑾峰彇瀛楁
+ }
+ })
+ this.getSearchDataList(); //琛ㄦ牸鏁版嵁
+ },
+ gettableName() {
+ this.$HTTP.get(`/api/blade-system/meta-object-type/detail?fId=${this.dictKey}`).then(res=> { //鐗╃悊琛ㄦ暟鎹�
+ if(res.code == 200) {
+ this.tableNameList.forEach(item=> {
+ if(res.data.tableName == item.tableName) {
+ this.refCodeList = item.tableColumns;
+ }
+ })
+ this.metaForm.tableName = res.data.tableName;
+ this.metaForm.refCode = res.data.refCode;
+ this.metaForm.refName = res.data.refName;
+ this.metaForm.code = res.data.code;
+ this.detailobj = res.data;
+ this.detailobj.objectId = res.data.fid;
+ }
+ })
+ },
+ getSearchDataList() {
+ this.$HTTP.get(`/api/blade-system/meta-object-type-field/list?objectId=${this.dictKey}`).then(res=> { //琛ㄦ牸鏁版嵁
+ if(res.code == 200) {
+ this.searchDataList = res.data;
+ res.data.forEach(item=> {
+ item.enumTypeZn = item.enumType; //鏋氫妇绫诲瀷
+ item.refObjectTypeIdZn = item.refObjectTypeId; //寮曠敤鍏崇郴
+ })
+ this.dictionaryType.forEach(item=> { //鍏冪礌绫诲瀷
+ this.searchDataList.forEach(item1=> {
+ if(item1.elementType == item.dictKey) {
+ item1.elementTypeName = item.dictValue;
+ }
+ })
+ })
+ }
+ })
+ },
closeVisible(flag) {
if(flag == "closed") {
this.classificationForm = {
@@ -155,104 +326,67 @@
this.$refs.dialogForm.resetFields();
};
},
- classificationSubmit() {
- this.$refs.dialogForm.validate(async (valid) => {
- if (valid) {
- this.isSaveing = false;
- // this.$HTTP.post("/api/blade-system/data-scope/submit",obj).then(res=> {
- // this.isSaveing = false;
- // if(res.code == 200) {
- // this.$emit('success', this.addDictForm, this.mode);
- // this.visible = false;
- // this.$message.success("鎿嶄綔鎴愬姛");
- // }else {
- // this.$alert(res.message, "鎻愮ず", {type: 'error'});
- // }
- // })
- }else{
- return false;
- }
- })
+ handleNodeClick1(data) {
+ if(this.firstChild.includes(data.id)) { //涓�绾ц彍鍗曡繑鍥�
+ this.$nextTick(()=> {
+ this.tableForm.refObjectTypeId = "";
+ })
+ return;
+ };
+ this.tableForm.refObjectTypeIdZn = data.dictValue;
+ this.tableForm.dictKey = data.dictKey;
},
- openVisible() {
- this.visible = true;
- },
- closeDrawer() {
- this.drawer = false;
- },
- drawerConfirm() {
- this.drawer = false;
- },
- searchHandleSelectionChange(selection) {
- this.searchSelection = selection;
- },
- drawerHandleSelectionChange() {
-
- },
- drawerSearchclick() {
- this.drawerSearchData.menuId = this.searchData.menuId;
- var obj = {};
- for(var key in this.drawerSearchData) {
- if(this.drawerSearchData[key]) {
- obj[key] = this.drawerSearchData[key];
- }
- }
- this.$HTTP.get("/api/blade-system/resource-definition/page",obj).then(res=> {
- if(res.code == 200) {
- this.drawerTableData = res.data.records;
- }
- })
- },
- handleClose(done) {
- done();
- },
handleNodeClick(data) {
+ if(!this.firstChild.includes(data.id)) {
+ this.dictKey = data.dictKey;
+ this.getList(); //鎵�鍦ㄧ墿鐞嗚〃銆佹槸鍚﹀彲閫�
+ this.isAdd = false;
+ }
// this.drawerPath = data.name;
- // console.log(data,data.name,222)
- // this.searchData.menuId = data.id;
// this.$HTTP.get("/api/blade-system/api-scope/list",this.searchData).then(res=> {
// if(res.code == 200) {
// this.searchDataList = res.data.records;
// }
// })
},
+ extractLastLevelIds(array) { //閫掑綊鑾峰彇children鏈�鍚庝竴绾х殑id鐨勬暟缁�
+ let ids = [];
+ for (let i = 0; i < array.length; i++) {
+ const obj = array[i];
+ if (obj.children) {
+ // 閫掑綊璋冪敤浠ユ彁鍙栨洿娣卞眰绾х殑children涓殑id
+ ids = ids.concat(this.extractLastLevelIds(obj.children));
+ } else {
+ // 濡傛灉娌℃湁children灞炴�э紝鍒欏亣瀹氬綋鍓嶅璞℃槸鏈�鍚庝竴绾�
+ if (obj.id) {
+ ids.push(obj);
+ }
+ }
+ }
+ return ids;
+ },
getMenuList() {
this.$HTTP.get("/api/blade-system/dict/dictionary-tree?code=code_rule_for_biz_objects").then(res=> {
if(res.code == 200) {
this.tableData = res.data;
- // this.treeCheck = idarr; //鑾峰彇閫変腑鏁版嵁
+ var menuGrantList = res.data.filter(item=> { //杩囨护鎺夋病鏈塩hildren鐨�
+ return item.children;
+ });
+ var lastId = this.extractLastLevelIds(menuGrantList[0].children); //鑾峰彇鏈�鍚庝竴绾d
+ this.firstChild = res.data.map(item=> {
+ return item.id;
+ })
+ this.$nextTick(()=> {
+ this.dictKey = lastId[0].dictKey;
+ this.$refs.treeRef.setCurrentKey(lastId[0].id); //璁剧疆閫変腑鏁版嵁
+ this.getList(); //鎵�鍦ㄧ墿鐞嗚〃銆佹槸鍚﹀彲閫�
+ })
}
})
- },
- addData() {
- // this.drawerSearchclick();
- // this.drawer = true;
- },
- delData() {
- if(this.searchSelection.length == 0) {
- this.$message({
- message: '璇烽�夋嫨鑷冲皯涓�鏉℃暟鎹�',
- type: 'warning'
- });
- return;
- }
- var selStr = "";
- this.searchSelection.map(item=> {
- selStr += item.id + ","
- })
- selStr = selStr.replace(/,$/, '');
- var that = this;
- // this.$HTTP.post("/api/blade-system/data-scope/remove?ids="+selStr).then(res=> {
- // if(res.code == 200) {
- // that.$message.success("鎿嶄綔鎴愬姛");
- // that.drawerSearchclick();
- // }
- // })
}
}
}
</script>
-
<style scoped>
.aposcope-main {
display: flex;
@@ -282,31 +416,26 @@
margin-bottom: 12px;
}
.right-content {
- text-align: center;
+ margin-bottom: 12px;
}
-.right-content img {
- width: 350px;
- height: 350px;
+.content-title {
+ margin-bottom: 12px;
}
-.right-content > div {
- font-size: 14px;;
+.content-title span {
+ margin-right: 4px;
+ color: red;
}
-.right-content > div span:nth-child(2) {
- margin-left: 8px;
- color: #409eff;
+.operationIcon {
+ font-size: 16px;
+ margin-right:4px;
cursor: pointer;
}
-/deep/ .drawerClass {
- padding: 8px;
-}
-.datascope-drawer-btn {
- margin-bottom: 8px;
-}
-.drawer-foot {
+.saveBtn {
margin-top: 20px;
+ text-align: right;
}
-.right-top {
- display: flex;
- justify-content: space-between;
+.important-star {
+ margin-right: 4px;
+ color: red;
}
</style>
--
Gitblit v1.9.3