<template>
|
<el-container>
|
<el-aside>
|
<basic-container>
|
<div ref="TreeBox" style="height: calc(100vh - 154px);!important;">
|
<!-- 左侧树 -->
|
<div style="height: calc(100vh - 190px);">
|
<avue-tree :data="treeData" :option="treeOption" @node-click="nodeClick">
|
<span slot-scope="{ node, data }" class="el-tree-node__label">
|
<span style="font-size: 15px">
|
<i class="el-icon-s-promotion"></i>
|
{{ (node || {}).label }}
|
</span>
|
</span>
|
</avue-tree>
|
</div>
|
</div>
|
</basic-container>
|
</el-aside>
|
|
<el-main>
|
<basic-container>
|
<avue-crud
|
ref="crud"
|
:data="data"
|
:option="option"
|
:table-loading="tableLoading"
|
@refresh-change="handleRefresh"
|
@selection-change="selectChange"
|
@row-click="rowClickHandler">
|
<template slot="menuLeft">
|
<el-button icon="el-icon-plus" size="small" type="primary" @click="addHandler">添加</el-button>
|
<el-button icon="el-icon-delete" plain size="small" type="danger" @click="delHandler">删除</el-button>
|
<el-button icon="el-icon-view" plain size="small" type="primary" @click="chekView">查看授权结果</el-button>
|
</template>
|
</avue-crud>
|
<div>
|
<data-view key="dataView" :btmNode="nodeRow" :data="viewData" :readOnly="true" height="400px"></data-view>
|
</div>
|
<!-- 新增 && 编辑 -->
|
<el-dialog
|
v-dialogDrag
|
:title="title === 'add' ? '创建' : '修改'"
|
:visible.sync="visible"
|
append-to-body="true"
|
class="avue-dialog"
|
width="75%"
|
@close="addDialogClose">
|
<div>
|
<data-view key="editView" :btmNode="nodeRow" :data="viewData" :readOnly="false" height="60vh"></data-view>
|
</div>
|
<span slot="footer" class="dialog-footer">
|
<el-button size="small" type="primary" @click="addDialogSavaHandler">确 定</el-button>
|
<el-button size="small" @click="addDialogClose">取 消</el-button>
|
</span>
|
</el-dialog>
|
<!-- 查看授权结果 -->
|
<el-dialog
|
v-dialogDrag
|
v-loading="checkViewLoading"
|
:visible.sync="checkViewVisible"
|
append-to-body="true"
|
class="avue-dialog"
|
title="查看使用范围"
|
width="60%"
|
>
|
<avue-crud
|
ref="checkViewCrud"
|
:data="checkViewData"
|
:option="checkViewOption"
|
@search-change="checkHandleSearch"
|
@search-reset="checkHandleReset"
|
>
|
|
</avue-crud>
|
</el-dialog>
|
</basic-container>
|
</el-main>
|
|
</el-container>
|
</template>
|
|
<script>
|
import {getBizTree} from "@/api/UI/uiDefine";
|
import basicOption from "@/util/basic-option";
|
import dataView from "./dataView";
|
import {getTypeActionByType} from "@/api/authority/ui/typeAction";
|
import func from "@/util/func";
|
import {getUsedEnumList} from "@/api/modeling/enumType/api";
|
import {deleteTemplate, saveTemplate, updateTemplate} from "@/api/queryTemplate/queryDefine";
|
export default {
|
name: "index",
|
components:{dataView},
|
data:function (){
|
return{
|
treeOption: {
|
height: 'auto',
|
defaultExpandAll: true,
|
menu: false,
|
addBtn: false,
|
props: {
|
label: 'text',
|
value: 'oid',
|
children: 'children'
|
}
|
},
|
nodeRow: {},
|
treeData: [],
|
tableLoading: false,
|
selectList: [],
|
option: {
|
...basicOption,
|
height:260,
|
addBtn: false,
|
editBtn: false,
|
delBtn: false,
|
filterBtn:false,
|
columnBtn:false,
|
gridBtn:false,
|
tip: false,
|
align: 'left',
|
menu:false,
|
column: [
|
{
|
label: '规则名称',
|
prop: 'plCode',
|
overHidden: true
|
},
|
{
|
label: '规则类型',
|
prop: 'plName',
|
overHidden: true
|
}
|
]
|
},
|
data: [],
|
viewData:{},
|
title: '',
|
visible: false,
|
form:{}
|
}
|
},
|
created() {
|
this.getTreeList();
|
},
|
methods: {
|
//树表查询
|
getTreeList() {
|
const loading = this.$loading({});
|
getBizTree().then(res => {
|
this.treeData = [res.data.obj];
|
loading.close();
|
}).catch(error => {
|
loading.close();
|
})
|
},
|
// 树点击
|
nodeClick(row) {
|
if (row.oid) {
|
this.nodeRow = row;
|
this.getTableList();
|
}
|
},
|
getTableList() {
|
getTypeActionByType({
|
'typeName': this.nodeRow.attributes.name,
|
}).then(res => {
|
this.data = res.data.data;
|
this.$refs.crud.clearSelection();
|
this.tableLoading = false;
|
})
|
},
|
handleRefresh() {
|
this.getTableList();
|
},
|
// 行点击
|
rowClickHandler(row) {
|
func.rowClickHandler(
|
row,
|
this.$refs.crud,
|
this.lastIndex,
|
(newIndex) => {
|
this.lastIndex = newIndex;
|
},
|
() => {
|
this.selectList = [row];
|
}
|
);
|
this.getViewData(row)
|
},
|
// 选择框
|
selectChange(row) {
|
this.selectList = row;
|
},
|
//获取下方数据
|
getViewData(row){
|
this.viewData={};
|
},
|
// 查看授权结果
|
chekView() {
|
if (this.selectList.length <= 0) {
|
this.$message.warning('请至少选择一条数据');
|
return;
|
}
|
if (this.selectList.length > 1) {
|
this.$message.warning('只能选择一条数据进行查看');
|
return;
|
}
|
|
getUsedEnumList({enumName: this.selectList[0].id}).then(res => {
|
if (res.data.code === 200) {
|
this.checkViewVisible = true;
|
this.checkViewData = res.data.data;
|
this.checkViewDataSearch = res.data.data;
|
}
|
})
|
},
|
|
// 查看授权结果查询
|
checkHandleSearch(params, done) {
|
const {source} = params;
|
|
if (!params.source) {
|
this.checkViewData = this.checkViewDataSearch;
|
return done();
|
}
|
;
|
|
this.checkViewData = this.checkViewData.filter(item => {
|
return item.source && item.source.includes(source);
|
});
|
|
done();
|
|
},
|
//创建
|
addHandler(){
|
if (func.isEmptyObject(this.nodeRow)) {
|
this.$message.error('请选择要添加的节点');
|
return;
|
}
|
this.title = 'add';
|
this.visible = true;
|
},
|
//修改
|
editHandler(){
|
if (func.isEmptyObject(this.nodeRow)) {
|
this.$message.error('请至少选择一条数据');
|
return;
|
}
|
this.title = 'edit';
|
this.visible = true;
|
},
|
// 新增编辑保存
|
addDialogSavaHandler() {
|
saveTemplate(this.viewData).then(res => {
|
if (res.data.code === 200) {
|
this.$message.success(res.data.obj);
|
this.getTableList();
|
this.addDialogClose();
|
}
|
})
|
},
|
// 新增编辑对话框取消
|
addDialogClose() {
|
this.visible = false;
|
},
|
//删除
|
delHandler(){
|
if (func.isEmptyObject(this.nodeRow)) {
|
this.$message.error('请选择数据');
|
return;
|
}
|
this.$confirm('您确定要删除所选择的数据吗?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
}).then(() => {
|
deleteTemplate({name:this.templateForm}).then(res => {
|
if (res.data.code === 200) {
|
this.$message.success(res.data.obj);
|
this.getTableList();
|
}
|
})
|
}).catch(() => {
|
this.$message({
|
type: 'info',
|
message: '已取消删除'
|
});
|
});
|
},
|
// 查看使用范围重置
|
checkHandleReset() {
|
this.checkViewData = this.checkViewDataSearch;
|
},
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
::v-deep {
|
.el-scrollbar__wrap {
|
overflow: auto !important;
|
}
|
}
|
|
</style>
|