Skip to content

liangzhen / framework-tools-web

Go to a project
Commit 796a5b16 by liuyong
Options

修改弹框

2 parents 39f5070b 337a4d93
Inline Side-by-side
Showing with 571 additions and 150 deletions
src/api/index.js
...@@ -125,4 +125,24 @@ export function save_drawio_xml_and_svg(params) { ...@@ -125,4 +125,24 @@ export function save_drawio_xml_and_svg(params) {
// 版本发布 // 版本发布
export function save_drawio_version(params) { export function save_drawio_version(params) {
return post('/ynMol/updateYnMol', params); return post('/ynMol/updateYnMol', params);
} }
\ No newline at end of file
// 获取字典数据
export function getYMXZDGLProyList(params) {
return post('/ynMolDicy/getYnMolProyList', params);
}
// 新增字典数据
export function getYMXZDGLProyAdd(params) {
return post('/ynMolDicy/addYnMolProy', params);
}
// 编辑字典数据
export function getYMXZDGLProyUpdate(params) {
return post('/ynMolDicy/updateYnMolProy', params);
}
// 删除字典数据
export function getYMXZDGLProyDel(params) {
return post('/ynMolDicy/deleteYnMolProy', params);
}
src/views/metaModelDic/pages/page1.vue
...@@ -47,7 +47,7 @@ ...@@ -47,7 +47,7 @@
<el-table-column prop="version" label="版本" align="center"></el-table-column> <el-table-column prop="version" label="版本" align="center"></el-table-column>
<el-table-column label="状态" align="center"> <el-table-column label="状态" align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<span >{{dicObj.state[scope.row.state]}}</span> <span>{{dicObj.state[scope.row.state]}}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" width="360" align="center"> <el-table-column label="操作" width="360" align="center">
...@@ -73,6 +73,7 @@ ...@@ -73,6 +73,7 @@
</el-pagination> </el-pagination>
</div> </div>
<!-- 第一个弹窗 -->
<el-dialog <el-dialog
:title="title" :title="title"
:visible.sync="add_dialog" :visible.sync="add_dialog"
...@@ -100,55 +101,57 @@ ...@@ -100,55 +101,57 @@
<el-table :data="tableData2" stripe border height="350" @cell-dblclick="tableDbclick"> <el-table :data="tableData2" stripe border height="350" @cell-dblclick="tableDbclick">
<el-table-column type="index" label="序号" width="80" align="center"></el-table-column> <el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
<el-table-column prop="fieldName" label="字段名" align="center"> <el-table-column prop="fieldName" label="字段名" align="center">
<template slot-scope="scope"> <!-- <template slot-scope="scope">
<div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.fieldName}}</div> <div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.fieldName}}</div>
<el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.fieldName"></el-input> <el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.fieldName"></el-input>
</template> </template> -->
</el-table-column> </el-table-column>
<el-table-column prop="chineseName" label="中文名" align="center"> <el-table-column prop="chineseName" label="中文名" align="center">
<template slot-scope="scope"> <!-- <template slot-scope="scope">
<div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.chineseName}}</div> <div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.chineseName}}</div>
<el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.chineseName"></el-input> <el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.chineseName"></el-input>
</template> </template> -->
</el-table-column> </el-table-column>
<el-table-column prop="displayOrder" label="排序" align="center"> <el-table-column prop="displayOrder" label="排序" align="center">
<template slot-scope="scope"> <!-- <template slot-scope="scope">
<div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.displayOrder}}</div> <div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.displayOrder}}</div>
<el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.displayOrder"></el-input> <el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.displayOrder"></el-input>
</template> </template> -->
</el-table-column> </el-table-column>
<el-table-column prop="contentLength" label="长度" align="center"> <el-table-column prop="contentLength" label="长度" align="center">
<template slot-scope="scope"> <!-- <template slot-scope="scope">
<div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.contentLength}}</div> <div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.contentLength}}</div>
<el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.contentLength"></el-input> <el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.contentLength"></el-input>
</template> </template> -->
</el-table-column> </el-table-column>
<el-table-column prop="controlType" label="控件" align="center"> <el-table-column prop="controlType" label="控件" align="center">
<template slot-scope="scope"> <!-- <template slot-scope="scope">
<div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{dicObj.controlType[scope.row.controlType]}}</div> <div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{dicObj.controlType[scope.row.controlType]}}</div>
<el-select v-show="columnIsShow&& (editIndex== scope.row.index)" v-model="scope.row.controlType"> <el-select v-show="columnIsShow&& (editIndex== scope.row.index)" v-model="scope.row.controlType">
<el-option <el-option
v-for="(item, stateListIndex) in stateList" v-for="(item, index) in selectTypeList"
:key="stateListIndex" :key="index"
:label="item.label" :label="item.label"
:value="item.value" :value="item.value"
></el-option> ></el-option>
</el-select> </el-select>
</template> -->
<template slot-scope="scope">
<span>{{dicObj.controlType[scope.row.controlType]}}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" width="200" align="center"> <el-table-column label="操作" width="200" align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<div style="display: flex;align-items: center;justify-content: center;"> <div style="display: flex;align-items: center;justify-content: center;">
<!-- <el-button icon="el-icon-edit" size="mini" @click="operateDia('edit',scope.row)">编辑</el-button> --> <el-button icon="el-icon-edit" size="mini" @click="operateDia('edit',scope.row)">编辑</el-button>
<el-button icon="el-icon-circle-plus-outline" size="mini" @click="operateDia('add',scope.row,scope.$index)">添加</el-button>
<el-button icon="el-icon-delete" size="mini" @click="operateDia('del',scope.row,scope.$index)">删除</el-button> <el-button icon="el-icon-delete" size="mini" @click="operateDia('del',scope.row,scope.$index)">删除</el-button>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<!-- <div class="newBtn"> <div class="newBtn">
<el-button class="addItem" icon="el-icon-plus" circle></el-button> <el-button class="addItem" icon="el-icon-plus" circle @click="operateDia('add')"></el-button>
</div> --> </div>
</div> </div>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button class="greenButton" @click="operate('push')">发布</el-button> <el-button class="greenButton" @click="operate('push')">发布</el-button>
...@@ -156,6 +159,47 @@ ...@@ -156,6 +159,47 @@
<el-button @click="add_dialog = false">取消</el-button> <el-button @click="add_dialog = false">取消</el-button>
</span> </span>
</el-dialog> </el-dialog>
<!-- 第二个弹窗 -->
<el-dialog
:title="title2"
:visible.sync="add_dialog2"
:center="false"
width="40%">
<div class="add_dialog_content">
<div class="dialog_content_1">
<div class="dialog_form_item">
<div class="dialog_form_item_title"><span class="reqIcon">*</span>字段名</div>
<el-input placeholder="" class="dialog_form_item_content" v-model="formData2.fieldName"></el-input>
</div>
<div class="dialog_form_item">
<div class="dialog_form_item_title"><span class="reqIcon">*</span>中文名</div>
<el-input placeholder="" class="dialog_form_item_content" v-model="formData2.chineseName"></el-input>
</div>
</div>
<div class="dialog_content_1">
<div class="dialog_form_item">
<div class="dialog_form_item_title"><span class="reqIcon">*</span>排序</div>
<el-input placeholder="" class="dialog_form_item_content" v-model="formData2.displayOrder"></el-input>
</div>
<div class="dialog_form_item">
<div class="dialog_form_item_title"><span class="reqIcon">*</span>长度</div>
<el-input placeholder="" class="dialog_form_item_content" v-model="formData2.contentLength"></el-input>
</div>
</div>
<div class="dialog_content_1">
<div class="dialog_form_item">
<div class="dialog_form_item_title"><span class="reqIcon">*</span>控件</div>
<el-select v-model="formData2.controlType" placeholder="请选择" class="search_item">
<el-option v-for="(item,idnex) in selectTypeList" :key="idnex" :label="item.label" :value="item.value" ></el-option>
</el-select>
</div>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button class="greenButton" @click="operateDia('save')">保存</el-button>
<el-button @click="add_dialog2 = false">取消</el-button>
</span>
</el-dialog>
</div> </div>
</template> </template>
...@@ -167,28 +211,26 @@ import { ...@@ -167,28 +211,26 @@ import {
getYMXZDGLDel, getYMXZDGLDel,
getYMXZDGLUpdate, getYMXZDGLUpdate,
query_jia_gou_gui_shu, query_jia_gou_gui_shu,
getYMXZDGLProyList,
getYMXZDGLProyDel,
getYMXZDGLProyAdd,
getYMXZDGLProyUpdate,
} from "@/api/index.js"; } from "@/api/index.js";
export default { export default {
name: 'metaModelDic', name: 'page1',
components: { components: {
}, },
data() { data() {
return { return {
tableData: [], tableData: [],
tableData2: [ tableData2: [],
{
fieldName: "",
chineseName: "",
displayOrder: "",
controlType: "",
contentLength: "",
}
],
selectList: [], selectList: [],
add_dialog: false, add_dialog: false,
title: "", title: "",
add_dialog2: false,
title2: "",
openType: "", openType: "",
add_dialog: false, add_dialog: false,
query_item1: null, query_item1: null,
...@@ -202,6 +244,13 @@ export default { ...@@ -202,6 +244,13 @@ export default {
rsName: "", rsName: "",
content: "", content: "",
}, },
formData2: {
fieldName: "",
chineseName: "",
displayOrder: "",
contentLength: "",
controlType: "",
},
params: { params: {
current: 1, current: 1,
pageSize: 10, pageSize: 10,
...@@ -310,17 +359,7 @@ export default { ...@@ -310,17 +359,7 @@ export default {
this.add_dialog = true; this.add_dialog = true;
this.title = "编辑字典"; this.title = "编辑字典";
this.formData = item; this.formData = item;
if (this.tableData2.length == 0) { this.getProyList(item);
this.tableData2 = [
{
fieldName: "",
chineseName: "",
displayOrder: "",
controlType: "",
contentLength: "",
}
];
}
}else if (type == "create") { }else if (type == "create") {
this.formData.state = 2; this.formData.state = 2;
if (this.formData.dicyId) { if (this.formData.dicyId) {
...@@ -389,6 +428,15 @@ export default { ...@@ -389,6 +428,15 @@ export default {
content: "", content: "",
} }
}, },
resetFormData2(){
this.formData2 = {
fieldName: "",
chineseName: "",
displayOrder: "",
contentLength: "",
controlType: "",
};
},
// 表格多选 // 表格多选
handleSelectionChange(e) { handleSelectionChange(e) {
...@@ -415,32 +463,102 @@ export default { ...@@ -415,32 +463,102 @@ export default {
// 对话表格操作 // 对话表格操作
operateDia( type, scopeRow, index){ operateDia( type, scopeRow, index){
console.log( type, scopeRow, index);
let arr = this.tableData2.concat();
let addData = JSON.parse(JSON.stringify(arr[index])); // JSON.parse(JSON.stringify(arr[index]))
switch (type) { switch (type) {
// 添加 // 添加
case 'add': case 'add':
addData.fieldName = ''; this.add_dialog2 = true;
addData.chineseName = ''; this.title2 = "新建字典属性";
addData.displayOrder = ''; this.resetFormData2();
addData.contentLength = ''; break;
addData.controlType = ''; // 编辑
arr.splice( index+1, 0, addData); case 'edit':
this.add_dialog2 = true;
this.title2 = "编辑字典属性";
this.formData2 = scopeRow;
console.log(this.formData2);
break;
// 保存
case 'save':
if (this.formData2.propertyId) {
let params = {
fieldName: this.formData2.fieldName,
chineseName: this.formData2.chineseName,
displayOrder: this.formData2.displayOrder,
contentLength: this.formData2.contentLength,
controlType: this.formData2.controlType,
propertyId: this.formData2.propertyId,
type: this.formData.type,
typeId: this.formData.typeId,
version: this.formData.version,
dicyId: this.formData.dicyId,
state: this.formData.state,
}
// 编辑保存
getYMXZDGLProyUpdate(params).then(res => {
if (res.code == 200) {
this.$message.success("保存成功");
this.add_dialog2 = false;
this.getProyList(this.formData);
}else{
this.$message.error(res.msg);
}
});
}else{
let params = {
fieldName: this.formData2.fieldName,
chineseName: this.formData2.chineseName,
displayOrder: this.formData2.displayOrder,
contentLength: this.formData2.contentLength,
controlType: this.formData2.controlType,
type: this.formData.type,
typeId: this.formData.typeId,
version: this.formData.version,
dicyId: this.formData.dicyId,
state: this.formData.state,
}
// 新建保存
getYMXZDGLProyAdd(params).then(res => {
if (res.code == 200) {
this.$message.success("新建成功");
this.add_dialog2 = false;
this.getProyList(this.formData);
}
});
}
break; break;
// 删除 // 删除
case 'del': case 'del':
arr.splice( index, 1) this.$confirm("确认删除吗", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(() => {
getYMXZDGLProyDel(scopeRow).then(res => {
if (res.code == 200) {
this.$message.success("删除成功");
this.getProyList(this.formData);
}
});
});
break; break;
} }
this.tableData2 = arr;
}, },
tableDbclick( row, column, cell, e){ tableDbclick( row, column, cell, e){
if ( this.readOnly ) { // this.editIndex = row.index;
return; // this.columnIsShow = true;
},
// 获取字典属性接口
getProyList(item) {
let params = {
type: item.type,
typeId: item.typeId,
} }
this.editIndex = row.index; getYMXZDGLProyList(params).then(res => {
this.columnIsShow = true; if (res.code == 200) {
this.tableData2 = res.data;
}
});
}, },
}, },
} }
...@@ -464,6 +582,15 @@ export default { ...@@ -464,6 +582,15 @@ export default {
.dialog_content_1{ .dialog_content_1{
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.dialog_form_item_title{
width: 70px;
}
.el-input{
width: 270px;
}
.el-select{
width: 270px;
}
} }
.search_menu{ .search_menu{
display: flex; display: flex;
......
src/views/metaModelDic/pages/page2.vue
...@@ -78,6 +78,7 @@ ...@@ -78,6 +78,7 @@
</el-pagination> </el-pagination>
</div> </div>
<!-- 第一个弹窗 -->
<el-dialog <el-dialog
:title="title" :title="title"
:visible.sync="add_dialog" :visible.sync="add_dialog"
...@@ -109,55 +110,57 @@ ...@@ -109,55 +110,57 @@
<el-table :data="tableData2" stripe border height="350" @cell-dblclick="tableDbclick"> <el-table :data="tableData2" stripe border height="350" @cell-dblclick="tableDbclick">
<el-table-column type="index" label="序号" width="80" align="center"></el-table-column> <el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
<el-table-column prop="fieldName" label="字段名" align="center"> <el-table-column prop="fieldName" label="字段名" align="center">
<template slot-scope="scope"> <!-- <template slot-scope="scope">
<div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.fieldName}}</div> <div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.fieldName}}</div>
<el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.fieldName"></el-input> <el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.fieldName"></el-input>
</template> </template> -->
</el-table-column> </el-table-column>
<el-table-column prop="chineseName" label="中文名" align="center"> <el-table-column prop="chineseName" label="中文名" align="center">
<template slot-scope="scope"> <!-- <template slot-scope="scope">
<div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.chineseName}}</div> <div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.chineseName}}</div>
<el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.chineseName"></el-input> <el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.chineseName"></el-input>
</template> </template> -->
</el-table-column> </el-table-column>
<el-table-column prop="displayOrder" label="排序" align="center"> <el-table-column prop="displayOrder" label="排序" align="center">
<template slot-scope="scope"> <!-- <template slot-scope="scope">
<div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.displayOrder}}</div> <div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.displayOrder}}</div>
<el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.displayOrder"></el-input> <el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.displayOrder"></el-input>
</template> </template> -->
</el-table-column> </el-table-column>
<el-table-column prop="contentLength" label="长度" align="center"> <el-table-column prop="contentLength" label="长度" align="center">
<template slot-scope="scope"> <!-- <template slot-scope="scope">
<div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.contentLength}}</div> <div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.contentLength}}</div>
<el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.contentLength"></el-input> <el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.contentLength"></el-input>
</template> </template> -->
</el-table-column> </el-table-column>
<el-table-column prop="controlType" label="控件" align="center"> <el-table-column prop="controlType" label="控件" align="center">
<template slot-scope="scope"> <!-- <template slot-scope="scope">
<div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{dicObj.controlType[scope.row.controlType]}}</div> <div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{dicObj.controlType[scope.row.controlType]}}</div>
<el-select v-show="columnIsShow&& (editIndex== scope.row.index)" v-model="scope.row.controlType"> <el-select v-show="columnIsShow&& (editIndex== scope.row.index)" v-model="scope.row.controlType">
<el-option <el-option
v-for="(item, stateListIndex) in stateList" v-for="(item, index) in selectTypeList"
:key="stateListIndex" :key="index"
:label="item.label" :label="item.label"
:value="item.value" :value="item.value"
></el-option> ></el-option>
</el-select> </el-select>
</template> -->
<template slot-scope="scope">
<span>{{dicObj.controlType[scope.row.controlType]}}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" width="200" align="center"> <el-table-column label="操作" width="200" align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<div style="display: flex;align-items: center;justify-content: center;"> <div style="display: flex;align-items: center;justify-content: center;">
<!-- <el-button icon="el-icon-edit" size="mini" @click="operateDia('edit',scope.row)">编辑</el-button> --> <el-button icon="el-icon-edit" size="mini" @click="operateDia('edit',scope.row)">编辑</el-button>
<el-button icon="el-icon-circle-plus-outline" size="mini" @click="operateDia('add',scope.row,scope.$index)">添加</el-button>
<el-button icon="el-icon-delete" size="mini" @click="operateDia('del',scope.row,scope.$index)">删除</el-button> <el-button icon="el-icon-delete" size="mini" @click="operateDia('del',scope.row,scope.$index)">删除</el-button>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<!-- <div class="newBtn"> <div class="newBtn">
<el-button class="addItem" icon="el-icon-plus" circle></el-button> <el-button class="addItem" icon="el-icon-plus" circle @click="operateDia('add')"></el-button>
</div> --> </div>
</div> </div>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button class="greenButton" @click="operate('push')">发布</el-button> <el-button class="greenButton" @click="operate('push')">发布</el-button>
...@@ -165,6 +168,47 @@ ...@@ -165,6 +168,47 @@
<el-button @click="add_dialog = false">取消</el-button> <el-button @click="add_dialog = false">取消</el-button>
</span> </span>
</el-dialog> </el-dialog>
<!-- 第二个弹窗 -->
<el-dialog
:title="title2"
:visible.sync="add_dialog2"
:center="false"
width="40%">
<div class="add_dialog_content">
<div class="dialog_content_1">
<div class="dialog_form_item">
<div class="dialog_form_item_title"><span class="reqIcon">*</span>字段名</div>
<el-input placeholder="" class="dialog_form_item_content" v-model="formData2.fieldName"></el-input>
</div>
<div class="dialog_form_item">
<div class="dialog_form_item_title"><span class="reqIcon">*</span>中文名</div>
<el-input placeholder="" class="dialog_form_item_content" v-model="formData2.chineseName"></el-input>
</div>
</div>
<div class="dialog_content_1">
<div class="dialog_form_item">
<div class="dialog_form_item_title"><span class="reqIcon">*</span>排序</div>
<el-input placeholder="" class="dialog_form_item_content" v-model="formData2.displayOrder"></el-input>
</div>
<div class="dialog_form_item">
<div class="dialog_form_item_title"><span class="reqIcon">*</span>长度</div>
<el-input placeholder="" class="dialog_form_item_content" v-model="formData2.contentLength"></el-input>
</div>
</div>
<div class="dialog_content_1">
<div class="dialog_form_item">
<div class="dialog_form_item_title"><span class="reqIcon">*</span>控件</div>
<el-select v-model="formData2.controlType" placeholder="请选择" class="search_item">
<el-option v-for="(item,idnex) in selectTypeList" :key="idnex" :label="item.label" :value="item.value" ></el-option>
</el-select>
</div>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button class="greenButton" @click="operateDia('save')">保存</el-button>
<el-button @click="add_dialog2 = false">取消</el-button>
</span>
</el-dialog>
</div> </div>
</template> </template>
...@@ -175,10 +219,14 @@ import { ...@@ -175,10 +219,14 @@ import {
getYMXZDGLAdd, getYMXZDGLAdd,
getYMXZDGLDel, getYMXZDGLDel,
getYMXZDGLUpdate, getYMXZDGLUpdate,
getYMXZDGLProyList,
getYMXZDGLProyDel,
getYMXZDGLProyAdd,
getYMXZDGLProyUpdate,
} from "@/api/index.js"; } from "@/api/index.js";
export default { export default {
name: 'metaModelDic', name: 'page2',
components: { components: {
}, },
...@@ -197,6 +245,8 @@ export default { ...@@ -197,6 +245,8 @@ export default {
selectList: [], selectList: [],
add_dialog: false, add_dialog: false,
title: "", title: "",
add_dialog2: false,
title2: "",
openType: "", openType: "",
add_dialog: false, add_dialog: false,
query_item1: null, query_item1: null,
...@@ -210,6 +260,13 @@ export default { ...@@ -210,6 +260,13 @@ export default {
rsName: "", rsName: "",
content: "", content: "",
}, },
formData2: {
fieldName: "",
chineseName: "",
displayOrder: "",
contentLength: "",
controlType: "",
},
params: { params: {
current: 1, current: 1,
pageSize: 10, pageSize: 10,
...@@ -313,17 +370,7 @@ export default { ...@@ -313,17 +370,7 @@ export default {
this.add_dialog = true; this.add_dialog = true;
this.title = "编辑字典"; this.title = "编辑字典";
this.formData = item; this.formData = item;
if (this.tableData2.length == 0) { this.getProyList(item);
this.tableData2 = [
{
fieldName: "",
chineseName: "",
displayOrder: "",
controlType: "",
contentLength: "",
}
];
}
}else if (type == "create") { }else if (type == "create") {
this.formData.state = 2; this.formData.state = 2;
if (this.formData.dicyId) { if (this.formData.dicyId) {
...@@ -401,6 +448,15 @@ export default { ...@@ -401,6 +448,15 @@ export default {
content: "", content: "",
} }
}, },
resetFormData2(){
this.formData2 = {
fieldName: "",
chineseName: "",
displayOrder: "",
contentLength: "",
controlType: "",
};
},
// 表格多选 // 表格多选
handleSelectionChange(e) { handleSelectionChange(e) {
...@@ -416,32 +472,101 @@ export default { ...@@ -416,32 +472,101 @@ export default {
// 对话表格操作 // 对话表格操作
operateDia( type, scopeRow, index){ operateDia( type, scopeRow, index){
console.log( type, scopeRow, index);
let arr = this.tableData2.concat();
let addData = JSON.parse(JSON.stringify(arr[index])); // JSON.parse(JSON.stringify(arr[index]))
switch (type) { switch (type) {
// 添加 // 添加
case 'add': case 'add':
addData.fieldName = ''; this.add_dialog2 = true;
addData.chineseName = ''; this.title2 = "新建字典属性";
addData.displayOrder = ''; this.resetFormData2();
addData.contentLength = ''; break;
addData.controlType = ''; // 编辑
arr.splice( index+1, 0, addData); case 'edit':
this.add_dialog2 = true;
this.title2 = "编辑字典属性";
this.formData2 = scopeRow;
console.log(this.formData2);
break;
// 保存
case 'save':
if (this.formData2.propertyId) {
let params = {
fieldName: this.formData2.fieldName,
chineseName: this.formData2.chineseName,
displayOrder: this.formData2.displayOrder,
contentLength: this.formData2.contentLength,
controlType: this.formData2.controlType,
propertyId: this.formData2.propertyId,
type: this.formData.type,
typeId: this.formData.typeId,
version: this.formData.version,
dicyId: this.formData.dicyId,
state: this.formData.state,
}
// 编辑保存
getYMXZDGLProyUpdate(params).then(res => {
if (res.code == 200) {
this.$message.success("保存成功");
this.add_dialog2 = false;
this.getProyList(this.formData);
}else{
this.$message.error(res.msg);
}
});
}else{
let params = {
fieldName: this.formData2.fieldName,
chineseName: this.formData2.chineseName,
displayOrder: this.formData2.displayOrder,
contentLength: this.formData2.contentLength,
controlType: this.formData2.controlType,
type: this.formData.type,
typeId: this.formData.typeId,
version: this.formData.version,
dicyId: this.formData.dicyId,
state: this.formData.state,
}
// 新建保存
getYMXZDGLProyAdd(params).then(res => {
if (res.code == 200) {
this.$message.success("新建成功");
this.add_dialog2 = false;
this.getProyList(this.formData);
}
});
}
break; break;
// 删除 // 删除
case 'del': case 'del':
arr.splice( index, 1) this.$confirm("确认删除吗", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(() => {
getYMXZDGLProyDel(scopeRow).then(res => {
if (res.code == 200) {
this.$message.success("删除成功");
this.getProyList(this.formData);
}
});
});
break; break;
} }
this.tableData2 = arr;
}, },
tableDbclick( row, column, cell, e){ tableDbclick( row, column, cell, e){
if ( this.readOnly ) { // this.editIndex = row.index;
return; // this.columnIsShow = true;
},
// 获取字典属性接口
getProyList(item) {
let params = {
type: item.type,
typeId: item.typeId,
} }
this.editIndex = row.index; getYMXZDGLProyList(params).then(res => {
this.columnIsShow = true; if (res.code == 200) {
this.tableData2 = res.data;
}
});
}, },
}, },
} }
...@@ -455,9 +580,25 @@ export default { ...@@ -455,9 +580,25 @@ export default {
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
} }
.newBtn{
margin-top: 5px;
.addItem{
background-color: #0D867F;
color: #fff;
}
}
.dialog_content_1{ .dialog_content_1{
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.dialog_form_item_title{
width: 70px;
}
.el-input{
width: 270px;
}
.el-select{
width: 270px;
}
} }
.search_menu{ .search_menu{
display: flex; display: flex;
......
src/views/metaModelDic/pages/page3.vue
...@@ -80,6 +80,7 @@ ...@@ -80,6 +80,7 @@
</el-pagination> </el-pagination>
</div> </div>
<!-- 第一个弹窗 -->
<el-dialog <el-dialog
:title="title" :title="title"
:visible.sync="add_dialog" :visible.sync="add_dialog"
...@@ -109,55 +110,57 @@ ...@@ -109,55 +110,57 @@
<el-table :data="tableData2" stripe border height="350" @cell-dblclick="tableDbclick"> <el-table :data="tableData2" stripe border height="350" @cell-dblclick="tableDbclick">
<el-table-column type="index" label="序号" width="80" align="center"></el-table-column> <el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
<el-table-column prop="fieldName" label="字段名" align="center"> <el-table-column prop="fieldName" label="字段名" align="center">
<template slot-scope="scope"> <!-- <template slot-scope="scope">
<div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.fieldName}}</div> <div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.fieldName}}</div>
<el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.fieldName"></el-input> <el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.fieldName"></el-input>
</template> </template> -->
</el-table-column> </el-table-column>
<el-table-column prop="chineseName" label="中文名" align="center"> <el-table-column prop="chineseName" label="中文名" align="center">
<template slot-scope="scope"> <!-- <template slot-scope="scope">
<div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.chineseName}}</div> <div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.chineseName}}</div>
<el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.chineseName"></el-input> <el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.chineseName"></el-input>
</template> </template> -->
</el-table-column> </el-table-column>
<el-table-column prop="displayOrder" label="排序" align="center"> <el-table-column prop="displayOrder" label="排序" align="center">
<template slot-scope="scope"> <!-- <template slot-scope="scope">
<div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.displayOrder}}</div> <div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.displayOrder}}</div>
<el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.displayOrder"></el-input> <el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.displayOrder"></el-input>
</template> </template> -->
</el-table-column> </el-table-column>
<el-table-column prop="contentLength" label="长度" align="center"> <el-table-column prop="contentLength" label="长度" align="center">
<template slot-scope="scope"> <!-- <template slot-scope="scope">
<div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.contentLength}}</div> <div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{scope.row.contentLength}}</div>
<el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.contentLength"></el-input> <el-input v-show="columnIsShow&& (editIndex== scope.row.index)" @blur="columnIsShow = false" v-model="scope.row.contentLength"></el-input>
</template> </template> -->
</el-table-column> </el-table-column>
<el-table-column prop="controlType" label="控件" align="center"> <el-table-column prop="controlType" label="控件" align="center">
<template slot-scope="scope"> <!-- <template slot-scope="scope">
<div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{dicObj.controlType[scope.row.controlType]}}</div> <div v-show=" !columnIsShow|| (editIndex!= scope.row.index)">{{dicObj.controlType[scope.row.controlType]}}</div>
<el-select v-show="columnIsShow&& (editIndex== scope.row.index)" v-model="scope.row.controlType"> <el-select v-show="columnIsShow&& (editIndex== scope.row.index)" v-model="scope.row.controlType">
<el-option <el-option
v-for="(item, stateListIndex) in stateList" v-for="(item, index) in selectTypeList"
:key="stateListIndex" :key="index"
:label="item.label" :label="item.label"
:value="item.value" :value="item.value"
></el-option> ></el-option>
</el-select> </el-select>
</template> -->
<template slot-scope="scope">
<span>{{dicObj.controlType[scope.row.controlType]}}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" width="200" align="center"> <el-table-column label="操作" width="200" align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<div style="display: flex;align-items: center;justify-content: center;"> <div style="display: flex;align-items: center;justify-content: center;">
<!-- <el-button icon="el-icon-edit" size="mini" @click="operateDia('edit',scope.row)">编辑</el-button> --> <el-button icon="el-icon-edit" size="mini" @click="operateDia('edit',scope.row)">编辑</el-button>
<el-button icon="el-icon-circle-plus-outline" size="mini" @click="operateDia('add',scope.row,scope.$index)">添加</el-button>
<el-button icon="el-icon-delete" size="mini" @click="operateDia('del',scope.row,scope.$index)">删除</el-button> <el-button icon="el-icon-delete" size="mini" @click="operateDia('del',scope.row,scope.$index)">删除</el-button>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<!-- <div class="newBtn"> <div class="newBtn">
<el-button class="addItem" icon="el-icon-plus" circle></el-button> <el-button class="addItem" icon="el-icon-plus" circle @click="operateDia('add')"></el-button>
</div> --> </div>
</div> </div>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button class="greenButton" @click="operate('push')">发布</el-button> <el-button class="greenButton" @click="operate('push')">发布</el-button>
...@@ -165,6 +168,47 @@ ...@@ -165,6 +168,47 @@
<el-button @click="add_dialog = false">取消</el-button> <el-button @click="add_dialog = false">取消</el-button>
</span> </span>
</el-dialog> </el-dialog>
<!-- 第二个弹窗 -->
<el-dialog
:title="title2"
:visible.sync="add_dialog2"
:center="false"
width="40%">
<div class="add_dialog_content">
<div class="dialog_content_1">
<div class="dialog_form_item">
<div class="dialog_form_item_title"><span class="reqIcon">*</span>字段名</div>
<el-input placeholder="" class="dialog_form_item_content" v-model="formData2.fieldName"></el-input>
</div>
<div class="dialog_form_item">
<div class="dialog_form_item_title"><span class="reqIcon">*</span>中文名</div>
<el-input placeholder="" class="dialog_form_item_content" v-model="formData2.chineseName"></el-input>
</div>
</div>
<div class="dialog_content_1">
<div class="dialog_form_item">
<div class="dialog_form_item_title"><span class="reqIcon">*</span>排序</div>
<el-input placeholder="" class="dialog_form_item_content" v-model="formData2.displayOrder"></el-input>
</div>
<div class="dialog_form_item">
<div class="dialog_form_item_title"><span class="reqIcon">*</span>长度</div>
<el-input placeholder="" class="dialog_form_item_content" v-model="formData2.contentLength"></el-input>
</div>
</div>
<div class="dialog_content_1">
<div class="dialog_form_item">
<div class="dialog_form_item_title"><span class="reqIcon">*</span>控件</div>
<el-select v-model="formData2.controlType" placeholder="请选择" class="search_item">
<el-option v-for="(item,idnex) in selectTypeList" :key="idnex" :label="item.label" :value="item.value" ></el-option>
</el-select>
</div>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button class="greenButton" @click="operateDia('save')">保存</el-button>
<el-button @click="add_dialog2 = false">取消</el-button>
</span>
</el-dialog>
</div> </div>
</template> </template>
...@@ -176,30 +220,28 @@ import { ...@@ -176,30 +220,28 @@ import {
getYMXZDGLDel, getYMXZDGLDel,
getYMXZDGLUpdate, getYMXZDGLUpdate,
getViewNameList, getViewNameList,
getYMXZDGLProyList,
getYMXZDGLProyDel,
getYMXZDGLProyAdd,
getYMXZDGLProyUpdate,
} from "@/api/index.js"; } from "@/api/index.js";
export default { export default {
name: 'metaModelDic', name: 'page3',
components: { components: {
}, },
data() { data() {
return { return {
tableData: [], tableData: [],
tableData2: [ tableData2: [],
{
fieldName: "",
chineseName: "",
displayOrder: "",
controlType: "",
contentLength: "",
}
],
selectList: [], selectList: [],
add_dialog: false, add_dialog: false,
title: "", title: "",
openType: "", openType: "",
add_dialog: false, add_dialog: false,
add_dialog2: false,
title2: "",
query_item1: null, query_item1: null,
query_item3: null, query_item3: null,
query_item4: null, query_item4: null,
...@@ -213,6 +255,13 @@ export default { ...@@ -213,6 +255,13 @@ export default {
viewName: "", viewName: "",
content: "", content: "",
}, },
formData2: {
fieldName: "",
chineseName: "",
displayOrder: "",
contentLength: "",
controlType: "",
},
params: { params: {
current: 1, current: 1,
pageSize: 10, pageSize: 10,
...@@ -385,17 +434,7 @@ export default { ...@@ -385,17 +434,7 @@ export default {
this.add_dialog = true; this.add_dialog = true;
this.title = "编辑字典"; this.title = "编辑字典";
this.formData = item; this.formData = item;
if (this.tableData2.length == 0) { this.getProyList(item);
this.tableData2 = [
{
fieldName: "",
chineseName: "",
displayOrder: "",
controlType: "",
contentLength: "",
}
];
}
}else if (type == "create") { }else if (type == "create") {
this.formData.state = 2; this.formData.state = 2;
if (this.formData.dicyId) { if (this.formData.dicyId) {
...@@ -475,6 +514,15 @@ export default { ...@@ -475,6 +514,15 @@ export default {
content: "", content: "",
} }
}, },
resetFormData2(){
this.formData2 = {
fieldName: "",
chineseName: "",
displayOrder: "",
contentLength: "",
controlType: "",
};
},
// 表格多选 // 表格多选
handleSelectionChange(e) { handleSelectionChange(e) {
...@@ -490,32 +538,102 @@ export default { ...@@ -490,32 +538,102 @@ export default {
// 对话表格操作 // 对话表格操作
operateDia( type, scopeRow, index){ operateDia( type, scopeRow, index){
console.log( type, scopeRow, index);
let arr = this.tableData2.concat();
let addData = JSON.parse(JSON.stringify(arr[index])); // JSON.parse(JSON.stringify(arr[index]))
switch (type) { switch (type) {
// 添加 // 添加
case 'add': case 'add':
addData.fieldName = ''; this.add_dialog2 = true;
addData.chineseName = ''; this.title2 = "新建字典属性";
addData.displayOrder = ''; this.resetFormData2();
addData.contentLength = ''; break;
addData.controlType = ''; // 编辑
arr.splice( index+1, 0, addData); case 'edit':
this.add_dialog2 = true;
this.title2 = "编辑字典属性";
this.formData2 = scopeRow;
console.log(this.formData2);
break;
// 保存
case 'save':
if (this.formData2.propertyId) {
let params = {
fieldName: this.formData2.fieldName,
chineseName: this.formData2.chineseName,
displayOrder: this.formData2.displayOrder,
contentLength: this.formData2.contentLength,
controlType: this.formData2.controlType,
propertyId: this.formData2.propertyId,
type: this.formData.type,
typeId: this.formData.typeId,
version: this.formData.version,
dicyId: this.formData.dicyId,
state: this.formData.state,
}
// 编辑保存
getYMXZDGLProyUpdate(params).then(res => {
if (res.code == 200) {
this.$message.success("保存成功");
this.add_dialog2 = false;
this.getProyList(this.formData);
}else{
this.$message.error(res.msg);
}
});
}else{
let params = {
fieldName: this.formData2.fieldName,
chineseName: this.formData2.chineseName,
displayOrder: this.formData2.displayOrder,
contentLength: this.formData2.contentLength,
controlType: this.formData2.controlType,
type: this.formData.type,
typeId: this.formData.typeId,
version: this.formData.version,
dicyId: this.formData.dicyId,
state: this.formData.state,
}
// 新建保存
getYMXZDGLProyAdd(params).then(res => {
if (res.code == 200) {
this.$message.success("新建成功");
this.add_dialog2 = false;
this.getProyList(this.formData);
}
});
}
break; break;
// 删除 // 删除
case 'del': case 'del':
arr.splice( index, 1) this.$confirm("确认删除吗", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(() => {
getYMXZDGLProyDel(scopeRow).then(res => {
if (res.code == 200) {
this.$message.success("删除成功");
this.getProyList(this.formData);
}
});
});
break; break;
} }
this.tableData2 = arr;
}, },
tableDbclick( row, column, cell, e){ tableDbclick( row, column, cell, e){
if ( this.readOnly ) { // this.editIndex = row.index;
return; // this.columnIsShow = true;
},
// 获取字典属性接口
getProyList(item) {
let params = {
type: item.type,
typeId: item.typeId,
} }
this.editIndex = row.index; getYMXZDGLProyList(params).then(res => {
this.columnIsShow = true; if (res.code == 200) {
this.tableData2 = res.data;
}
});
}, },
}, },
} }
...@@ -529,9 +647,25 @@ export default { ...@@ -529,9 +647,25 @@ export default {
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
} }
.newBtn{
margin-top: 5px;
.addItem{
background-color: #0D867F;
color: #fff;
}
}
.dialog_content_1{ .dialog_content_1{
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.dialog_form_item_title{
width: 70px;
}
.el-input{
width: 270px;
}
.el-select{
width: 270px;
}
} }
.search_menu{ .search_menu{
display: flex; display: flex;
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!