hzya
/
middleground_code_v2
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request 'huyt' (#1) from huyt into master 

Reviewed-on: http://192.168.2.237:3000/root/middleground_code_v2/pulls/1
This commit is contained in:
huyt 2024-04-07 11:32:57 +08:00
parent 2ada974f80 216989412f
commit de079e407d
66 changed files with 8431 additions and 6045 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/api/apiChunks/index.js
View File

@ -4,7 +4,7 @@ import request from '@/utils/request'
// 动态模版请求
export function getApiModuleApi(obj, data = {}) {
return request({
url: '/kangarooDataCenter/entranceController/option',
url: 'kangarooDataCenter/entranceController/option',
method: 'post',
headers: obj,
data
@ -12,7 +12,7 @@ export function getApiModuleApi(obj, data = {}) {
}
export function getApiResultApi(data = {}) {
return request({
url: '/kangarooDataCenter/entranceController/option ',
url: 'kangarooDataCenter/entranceController/option ',
method: 'post',
headers: {
tl: "appApiService",
@ -24,7 +24,7 @@ export function getApiResultApi(data = {}) {
}
export function getExcelApi(obj, data = {}) {
return request({
url: '/kangarooDataCenter/entranceController/option ',
url: 'kangarooDataCenter/entranceController/option ',
method: 'post',
responseType: "blob",
headers: obj,

2
src/api/apis/auth.js
View File

@ -2,7 +2,7 @@ import request from "@/utils/request";
export function authApi(tl,as,dj,url = '',data){
return request({
url: '/kangarooDataCenter/entranceController/option' + url,
url: 'kangarooDataCenter/entranceController/option' + url,
headers: {
tl:tl,
as:as,

2
src/api/apis/detailData.js
View File

@ -3,7 +3,7 @@ import request from '@/utils/request'
// 获取全部插件列表
export function option(obj, data = {}) {
return request({
url: '/kangarooDataCenter/entranceController/option',
url: 'kangarooDataCenter/entranceController/option',
method: 'post',
headers: obj,
data

2
src/api/integrationOption/integrationOption.js
View File

@ -3,7 +3,7 @@ import request from '@/utils/request'
export function getUserModuleApi(obj, data = {}) {
return request({
url: '/kangarooDataCenter/entranceController/option',
url: 'kangarooDataCenter/entranceController/option',
method: 'post',
headers: obj,
data

2
src/api/login.js
View File

@ -7,7 +7,7 @@ import request from '@/utils/request'
// 登录方法
export function login(login_name, password) {
const data = {
login_name,
loginCode:login_name,
password,
}
return request({

2
src/api/system/integrationOption.js
View File

@ -3,7 +3,7 @@ import request from '@/utils/request'
// 集成应用请求
export function getPagesApi(obj, data = {}) {
return request({
url: '/kangarooDataCenter/entranceController/option',
url: 'kangarooDataCenter/entranceController/option',
method: 'post',
headers: obj,
data

7
src/components/TopNav/index.vue
View File

@ -6,7 +6,7 @@
>
<template v-for="(item, index) in topMenus">
<el-menu-item :style="{'--theme': theme}" :index="item.path" :key="index" v-if="index < visibleNumber"
><svg-icon :icon-class="item.meta.icon" />
><svg-icon :icon-class="item.meta.menuIcon" />
{{ item.meta.title }}</el-menu-item
>
</template>
@ -19,9 +19,8 @@
:index="item.path"
:key="index"
v-if="index >= visibleNumber"
><svg-icon :icon-class="item.meta.icon" />
{{ item.meta.title }}</el-menu-item
>
><svg-icon :icon-class="item.meta.menuIcon" />
{{ item.meta.title }}</el-menu-item>
</template>
</el-submenu>
</el-menu>

352
src/components/base/BaseMenuTree/index.vue
View File

@ -6,98 +6,20 @@
<template>
<!-- 权限设置弹框 -->
<!-- :style="{'margin':isCenter?'auto':''}"> -->
<div style="padding: 0 0 16px 16px; height: 100%">
<div flex="cross:center" v-if="filterShow" style="margin-bottom: 5px">
<el-input
placeholder="输入关键字进行过滤"
v-model="filterText"
style="margin-right: 13px"
></el-input>
<el-button
icon="el-icon-plus"
style="height: 32px; line-height: 32px; padding: 0 13px !important"
@click="add"
v-if="filterButtonShow"
>
</el-button>
<div v-loading="treeLoading" flex style="margin:auto;height: 100%;">
<div class="menu-i" flex="cross:center main:center">
<div class="menu-i-t" flex="cross:top main:justify">
<el-tree :data="menuData" :check-strictly="true" :default-checked-keys="selectData"
@node-click="handleNodeClick" :expand-on-click-node="false" :default-expand-all="expandAll"
:key="new Date().getTime()" :props="treeProps" style="width: 100%;background-color:white;height: 100%;"
@check-change="checkChange" node-key="id" ref="elTree" :show-checkbox="showCheckbox">
</el-tree>
<div @click="changePcAll" class="checkText" v-if="Allshow">全选</div>
</div>
</div>
<div
flex="dir:top cross:center main:center"
style="margin: auto; overflow: auto"
:style="'height:' + treeBodyHeight + ';'"
class="treeBodyHeight"
>
<div class="menu-i" flex="cross:center main:center">
<div class="menu-i-t" flex="cross:top main:justify">
<el-tree
:data="menuData"
:check-strictly="true"
:default-checked-keys="selectData"
v-loading="treeLoading"
@node-click="handleNodeClick"
:expand-on-click-node="false"
:default-expand-all="expandAll"
:filter-node-method="filterNode"
:props="treeProps"
style="width: 100%; background-color: transparent"
@check-change="checkChange"
node-key="id"
ref="elTree"
:show-checkbox="showCheckbox"
>
<div
flex="cross:center main:justify"
style="width: calc(100% - 31px)"
slot-scope="{ node, data }"
>
<p
class="nowrap"
style="
flex: 1;
font-size: 12px;
height: 32px;
line-height: 32px;
"
@dblclick="dbTree"
>
{{ nodeLabel == "" ? node.label : node.label[nodeLabel] }}
</p>
<div style="width: 60px" v-if="treeButton">
<el-button
type="text"
size="mini"
icon="el-icon-plus"
v-if="appendButton"
@click.stop="() => append(node, data)"
>
</el-button>
<el-button
type="text"
size="mini"
icon="el-icon-edit"
v-if="reviseButton"
@click.stop="() => revise(node, data)"
>
</el-button>
<el-button
type="text"
size="mini"
icon="el-icon-delete"
v-if="removeButton"
@click.stop="() => remove(node, data)"
>
</el-button>
</div>
</div>
</el-tree>
<div @click="changePcAll" class="checkText" v-if="Allshow">全选</div>
</div>
</div>
<div flex="cross:center main:center" style="width: 100%" v-if="isSaveBtn">
<el-button style="width: 40%" type="primary" @click="saveMenuUser"
>保存</el-button
>
</div>
<div flex="cross:center main:center" style="width:100%" v-if="isSaveBtn">
<el-button style="width:40%" type="primary" @click="saveMenuUser">保存</el-button>
</div>
</div>
</template>
@ -108,108 +30,45 @@ export default {
// 是否默认展开所有节点
expandAll: {
type: Boolean,
default: true,
},
// 操作按钮
treeButton: {
type: Boolean,
default: false,
},
// 操作按钮
filterButtonShow: {
type: Boolean,
default: false,
default: true
},
// 是否显示保存按钮
isSaveBtn: {
type: Boolean,
default: false,
default: false
},
// 是否显示全选按钮
Allshow: {
type: Boolean,
default: false,
default: false
},
// 是否显示多选按钮
showCheckbox: {
type: Boolean,
default: false,
default: false
},
// 是否居中
isCenter: {
type: Boolean,
default: true,
},
// 是否显示筛选
filterShow: {
type: Boolean,
default: false,
default: true
},
menuData: {
type: Array,
default: () => {
return [];
},
return []
}
},
setting: {
type: Boolean,
default: false,
},
treeLoading: {
type: Boolean,
default: false,
},
appendButton: {
type: Boolean,
default: true,
},
reviseButton: {
type: Boolean,
default: true,
},
removeButton: {
type: Boolean,
default: true,
},
nodeLabel: {
type: String,
default: "",
},
treeProps: {
type: Object,
default() {
return {
children: "children",
label: "label",
};
},
},
// 树高度
treeBodyHeight: {
type: [Number, String],
default: "calc(100% - 22px)",
},
},
watch: {
defaultTheme: {
handler: function (val, oldVal) {
this.theme = val;
// document.getElementsByTagName('body')[0].style.setProperty('--active', val)
// let arr = document.getElementsByClassName('.el-tree-node:focus>.el-tree-node__content')
// $('.el-tree-node:focus>.el-tree-node__content').css('color',val)
},
immediate: true,
},
filterText(val) {
this.$refs.elTree.filter(val);
default: false
},
},
data() {
return {
filterText: "",
theme: "",
theme: '',
powerDlog: false,
// 菜单数据
// menuData: [],
// 回显选中ids
selectData: [],
// 树状图设置
@ -217,70 +76,52 @@ export default {
// label: 'menuName',
// children: 'id',
// },
// treeProps: {
// children: 'children',
// label: 'label'
// },
treeProps: {
children: 'children',
label: 'label'
},
// PC菜单全选
checkedAllPc: false,
// 防连点
outing: false,
};
treeLoading: false,
}
},
created() { },
mounted() {
},
created() {},
mounted() {},
computed: {
defaultTheme() {
return this.$store.state.settings.theme;
return this.$store.state.settings.theme
},
},
watch: {
defaultTheme: {
handler: function (val, oldVal) {
this.theme = val
// document.getElementsByTagName('body')[0].style.setProperty('--active', val)
// let arr = document.getElementsByClassName('.el-tree-node:focus>.el-tree-node__content')
// $('.el-tree-node:focus>.el-tree-node__content').css('color',val)
},
immediate: true,
},
},
methods: {
setCurrentKey(selectId) {
this.$nextTick(() => {
this.$refs.elTree.setCurrentKey(selectId);
});
},
dbTree() {
this.setCurrentKey(null);
},
// 添加
append(node, data) {
this.$emit("append", data);
},
// 编辑
revise(node, data) {
this.$emit("revise", data);
},
// 删除
remove(node, data) {
this.$emit("remove", data);
},
add() {
this.$emit("add");
},
filterNode(value, data, node) {
if (!value) return true;
let nodeData =
this.nodeLabel == ""
? data[this.treeProps.label]
: data[this.treeProps.label][this.nodeLabel];
return nodeData.indexOf(value) !== -1;
},
buttonL(el) {
el.active = !el.active;
this.$forceUpdate();
el.active = !el.active
this.$forceUpdate()
},
setData(id) {
this.selectData.push(id);
this.selectData.push(id)
},
saveMenuUser() {
let allKeys = this.getKey();
this.$emit("onSaveMenu", allKeys);
this.$emit('onSaveMenu', allKeys);
},
// 获取选中的key值
getKey() {
return this.$refs.elTree.getCheckedKeys();
return this.$refs.elTree.getCheckedKeys()
},
// 初始数据
initData() {
@ -292,15 +133,15 @@ export default {
},
// 关闭弹窗
handleClose() {
this.powerDlog = false;
this.initData();
this.powerDlog = false
this.initData()
},
// 全选、反选
changePcAll() {
this.checkedAllPc = !this.checkedAllPc;
let selectData = [];
if (this.checkedAllPc) {
selectData = this.cycleData(this.menuData);
selectData = this.cycleData(this.menuData)
}
this.selectData = selectData;
},
@ -316,40 +157,39 @@ export default {
function cycle(data) {
if (!data || data.length == 0) {
return false;
return false
} else {
for (var i = 0, len = data.length; i < len; i++) {
let item = data[i];
let item = data[i]
if (isSelect && item.selected == 1) {
newData.push(item.id);
newData.push(item.id)
}
if (!isSelect) {
newData.push(item.id);
newData.push(item.id)
}
cycle(item.id);
cycle(item.id)
}
}
}
cycle(outData);
return newData;
cycle(outData)
return newData
},
getData(childIds) {
let newData = [];
function cycle(data) {
data.forEach((el) => {
childIds.forEach((item) => {
data.forEach(el => {
childIds.forEach(item => {
if (el.id == item) {
newData.push(el);
newData.push(el)
}
});
})
if (el.children != null && el.children && el.children.length) {
cycle(el.children, childIds);
cycle(el.children, childIds)
}
});
})
}
cycle(this.menuData, childIds);
return newData;
cycle(this.menuData, childIds)
return newData
},
/**
* @description 节点选中状态发生变化时的回调
@ -359,55 +199,48 @@ export default {
* @param { Boolean } checked 当前节点是否选中
*/
checkChange(nodeDode, checked) {
let getHalfCheckedKeys = this.$refs.elTree
.getCheckedKeys()
.concat(this.$refs.elTree.getHalfCheckedKeys());
let getHalfCheckedKeys = this.$refs.elTree.getCheckedKeys().concat(this.$refs.elTree.getHalfCheckedKeys())
// let getHalfCheckedKeys = this.$refs.elTree.getHalfCheckedKeys()
let childIds =
getHalfCheckedKeys.length != 0 ? getHalfCheckedKeys : this.selectData;
let checkdata = this.getData(childIds);
this.$emit("checkChange", childIds, checkdata);
return;
let childIds = getHalfCheckedKeys.length != 0 ? getHalfCheckedKeys : this.selectData
let checkdata = this.getData(childIds)
this.$emit('checkChange', childIds, checkdata)
return
let id = nodeDode.id;
// let childIds = this.cycleData(id)
console.log(id)
// 循环设置子项是否选中
childIds.forEach((item) => {
this.$refs.elTree.setChecked(item, checked);
});
childIds.forEach(item => {
this.$refs.elTree.setChecked(item, checked)
})
},
// 点击事件
handleNodeClick(data) {
this.$emit("handleNodeClick", data);
this.$emit('handleNodeClick', data);
},
},
};
}
}
</script>
<style lang="scss">
// $activeColor:val(--activeColor, "#00aaff");
.nowrap {
/*让长段文本不换行*/
white-space: nowrap;
/*设置文本超出元素宽度部分隐藏*/
overflow-x: hidden;
/*设置文本超出部分用省略号显示*/
text-overflow: ellipsis;
}
.el-tree-node__content {
height: 32px !important;
}
.el-tree-node__label {
// font-size: 16px !important;
font-size: 14px !important;
margin-left: 4px;
}
.el-tree-node__content > label.el-checkbox {
.el-tree-node__content>label.el-checkbox {
transform: scale(1.3);
}
.el-tree-node__content > .el-tree-node__expand-icon {
.el-tree-node__content>.el-tree-node__expand-icon {
font-size: 18px;
}
@ -420,14 +253,9 @@ export default {
}
</style>
<style lang="scss" scoped>
.el-tree-node.is-current > .el-tree-node__content .el-button--text {
color: white;
}
.menu-i {
width: 100%;
// margin-bottom: 24px;
height: 100%;
&-f {
color: #52575a;
@ -438,10 +266,10 @@ export default {
&-t {
width: 100%;
height: 100%;
// height: 450px;
// border: 1px solid #d8d8d8;
// overflow-y: auto;
overflow-y: auto;
height: 100%;
}
}
@ -461,7 +289,7 @@ export default {
transition: all 0.3s ease-in-out;
&:hover {
color: #ecf5ff;
color: #4570fc;
}
}
</style>

747
src/components/base/baseLayout/index.vue
View File

@ -5,142 +5,219 @@
-->
<!-- style="overflow: auto;" -->
<template>
<div class="container" v-loading="loading" :style="'backgroundColor:' +
bgColor +
';paddingBottom:' +
paddingBottom +
';height:' +
bodyHight
" ref="baseLayout">
<div
class="container"
v-loading="loading"
:style="
'backgroundColor:' +
bgColor +
';paddingBottom:' +
paddingBottom +
';height:' +
bodyHight
"
>
<!-- 标题 -->
<div flex="cross:center" style="padding: 10px" :style="{
'justify-content':
searchShow || showTitle ? 'space-between' : 'flex-end',
}" v-if="showTitle">
<div class="title" v-if="showTitle">
<span v-if="showTitle">{{ title }}</span>
</div>
<div flex="cross:center" v-if="searchShow">
<i class="queryIcon" :class="queryShow ? 'el-icon-arrow-down' : 'el-icon-arrow-right'"
@click="queryShowChange"></i>
<el-dropdown trigger="click">
<span class="el-dropdown-link" style="cursor: pointer; color: #303133; font-size: 14px">
默认条件<i class="el-icon-arrow-down el-icon--right" style="margin-left: 8px"></i>
</span>
<el-dropdown-menu slot="dropdown" style="
padding: 7px 20px;
background-color: #f5f7fa;
border: 1px soild #dcdfe6;
">
<el-dropdown-item command="a" class="requirementList">默认查询
</el-dropdown-item>
<el-dropdown-item v-for="(item, index) in requirementList" :key="item.command" :command="item.command">
<div flex="cross:center main:justify">
<p>{{ item.title }}</p>
<div flex="cross:center ">
<i class="el-icon-edit" @click="edit(item)"></i>
<i class="el-icon-close" @click="del(item)"></i>
</div>
</div>
</el-dropdown-item>
<el-dropdown-item command="d">创建方案</el-dropdown-item>
<el-dropdown-item command="e">高级查询</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<!-- <p>高级查询</p> -->
</div>
<div flex="cross:centet" v-if="buttonList && buttonList.length > 0">
<el-dropdown v-for="(item, index) in buttonList" class="buttonList" :key="index" @command="dropClick">
<el-button :type="item.type ? item.type : 'primary'" size="small" class="iconfont" :icon="item.icon"
@keyup.prevent.native @keydown.enter.prevent.native @click="funNewClick(item)">
{{
item.menuName
}}<i v-if="item.dropList && item.dropList.length > 0" class="el-icon-arrow-down el-icon--right"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<!-- <i class="el-icon-arrow-down el-icon--right"> -->
<el-dropdown-item v-for="(dropItem, dropIndex) in item.dropList" :key="dropIndex" :icon="dropItem.icon"
:command="dropItem.dropFun">{{ dropItem.title }}
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
<div class="title" flex="cross:center" v-if="showTitle">
<span v-if="!$route.meta.back">{{ title }}</span>
<span @click="goBack" class="back" v-else
><i class="el-icon-arrow-left"></i>返回</span
>
</div>
<!-- <div class="main":style="'backgroundColor:'+ mainColor " > -->
<!-- 搜索 -->
<div class="main" :style="'height:' + mainHight + ';backgroundColor:' + mainColor">
<div
class="main"
:style="{
height: showTitle ? 'calc(100% - 38px)' : '100%',
backgroundColor: mainColor,
}"
>
<!-- 操作按钮 -->
<div
class="pushButton"
flex="cross:centet main:right cross:center"
v-if="operateButtonSwitch"
>
<div class="operationButton" flex="cross:center">
<div v-if="defaultButtonSwitch" style="margin-right: 5px">
<el-button
v-for="(item, index) in defaultButtonList"
:type="item.type ? item.type : 'primary'"
size="small"
class="iconfont buttonList"
:icon="item.icon"
@click="funNewClick(item)"
:key="index"
>
{{ item.menuName }}
</el-button>
</div>
<slot name="btn"></slot>
<el-button
v-for="(item, index) in buttonList"
:type="item.type ? item.type : 'primary'"
size="small"
class="iconfont buttonList"
:icon="item.icon"
@click="funNewClick(item)"
:key="index"
>
<span v-if="item.menuName">{{ item.menuName }}</span>
</el-button>
</div>
<div v-if="fixedButton" style="margin-left: 5px">
<el-tooltip
class="item"
effect="dark"
:content="item.title"
placement="top"
v-for="(item, index) in fixedButtonList"
:key="index"
trigger="hover"
>
<span>
<el-button
size="mini"
:icon="item.icon"
@click.stop="fixedClick(item)"
style="margin: 0"
></el-button>
</span>
</el-tooltip>
</div>
</div>
<!-- 搜索 -->
<div v-show="queryShow" style="padding: 16px;" flex="cross:center" ref="serchRefs" class="searchContainer">
<div v-for="(row, indexRow) in searchList" class="searchBox" :key="indexRow">
<el-input v-model="ruleForm[row.prop]" clearable :type="row.type ? row.type : 'text'" style="width: 100%"
:placeholder="!row.placeholder ? '请输入' : row.placeholder" v-if="row.tag === 'elInput'" min="1">
<div
v-show="querySwitch"
style="padding: 5px; background-color: #fff"
flex="cross:center"
ref="serchRefs"
class="searchForTable"
>
<div
v-for="(row, indexRow) in searchList"
class="searchBox"
:key="indexRow"
style="margin-right: 5px"
>
<el-input
v-model="ruleForm[row.columnNameEN]"
clearable
:type="row.type ? row.type : 'text'"
style="width: 100%"
:placeholder="!row.columnNameCN ? '请输入' : row.columnNameCN"
v-if="row.tag === 'elInput'"
min="1"
@keydown.enter.native="handerInputEnter()"
>
</el-input>
<el-date-picker v-model="ruleForm[row.prop]" v-if="row.tag === 'elDatePicker'"
:class="{ one: row.type ? 'date' : row.type }" style="width: 100%"
:value-format="!row.valueFormat ? 'yyyy-MM-dd' : row.valueFormat" range-separator="至" start-placeholder="开始日期"
end-placeholder="结束日期" :type="!row.type ? 'date' : row.type"
:placeholder="!row.placeholder ? '请选择' : row.placeholder">
<el-date-picker
v-model="ruleForm[row.columnNameEN]"
v-if="row.tag === 'elDatePicker'"
:class="{ one: row.type ? 'date' : row.type }"
style="width: 100%"
:value-format="!row.valueFormat ? 'yyyy-MM-dd' : row.valueFormat"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
:type="!row.type ? 'date' : row.type"
:placeholder="!row.columnNameCN ? '请选择' : row.columnNameCN"
>
</el-date-picker>
<el-radio-group v-model="ruleForm[row.prop]" v-if="row.tag === 'elRadio'">
<el-radio-button v-for="el in row.options" :label="el.value" :key="el.value">{{ el.label }}
<el-radio-group
v-model="ruleForm[row.columnNameEN]"
v-if="row.tag === 'elRadio'"
>
<el-radio-button
v-for="el in row.options"
:label="el.value"
:key="el.value"
>{{ el.label }}
</el-radio-button>
</el-radio-group>
<div v-if="row.tag === 'elDialog'" class="elDialog" style="cursor: pointer; height: 32px; ine-height: 32px">
<p :style="{ color: ruleForm[row.prop] ? '#000' : '#c0c4cc' }" style="width: 100%; margin: 0"
@click="elDialogClick(row, indexRow, indexRow)">
<div
v-if="row.tag === 'elDialog'"
class="elDialog"
style="cursor: pointer; height: 32px; ine-height: 32px"
>
<p
:style="{
color: ruleForm[row.columnNameEN] ? '#000' : '#c0c4cc',
}"
style="width: 100%; margin: 0"
@click="elDialogClick(row, index, indexRow)"
>
{{
ruleForm[row.prop]
? ruleForm[row.prop]
: row.placeholder
? row.placeholder
: "请点击选择"
ruleForm[row.columnNameEN]
? ruleForm[row.columnNameEN]
: row.columnNameCN
? row.columnNameCN
: "请点击选择"
}}
</p>
<i class="el-icon-more" @click="elDialogClick(row, index, indexRow)"
v-if="!row.disabled && !ruleForm[row.prop]"></i>
<i class="el-icon-circle-close" v-if="!row.disabled && ruleForm[row.prop]" @click="elDialogClear(row)"
style="margin-left: 10px"></i>
<i
class="el-icon-more"
@click="elDialogClick(row, index, indexRow)"
v-if="!row.disabled && !ruleForm[row.columnNameEN]"
></i>
<i
class="el-icon-circle-close"
v-if="!row.disabled && ruleForm[row.columnNameEN]"
@click="elDialogClear(row)"
style="margin-left: 10px"
></i>
</div>
<el-select v-model="ruleForm[row.prop]" filterable style="width: 100%"
@change="selectChange($event, indexRow, indexRow, row)" :clearable="row.clearable ? row.clearable : true"
:placeholder="!row.placeholder ? '请选择' : row.placeholder" v-if="row.tag === 'elSelect'">
<el-option v-for="(el, elIndex) in row.options" :key="!row.optionValue ? el['value'] : el[row.optionValue]"
<el-select
v-model="ruleForm[row.columnNameEN]"
filterable
style="width: 100%"
@change="selectChange($event, indexRow)"
:clearable="row.clearable ? row.clearable : true"
:placeholder="!row.columnNameCN ? '请选择' : row.columnNameCN"
v-if="row.tag === 'elSelect'"
>
<el-option
v-for="(el, elIndex) in row.options"
:key="!row.optionValue ? el['value'] : el[row.optionValue]"
:label="!row.optionLabel ? el['label'] : el[row.optionLabel]"
:value="!row.optionValue ? el['value'] : el[row.optionValue]">
:value="!row.optionValue ? el['value'] : el[row.optionValue]"
>
</el-option>
</el-select>
</div>
<!-- 搜索按钮 -->
<!-- <el-input
auto-complete="off"
placeholder="验证码"
style="width: calc(100% - 130px)"
v-show="false"
clearable
@keyup.enter.native="testEnter"
>
</el-input> -->
<el-button type="primary" icon="el-icon-search searchIcon" class="searchIcon" v-if="searchBtnShow" @click="search"
@keyup.enter="testEnter" style="margin-left: 15px">
<el-button
type="primary"
size="small"
icon="el-icon-search searchIcon"
@click="search"
title="搜索"
>
搜索
</el-button>
<el-button type="primary" icon="el-icon-refresh searchIcon" class="searchIcon" v-if="resetBtnShow"
@click="refresh">
</el-button>
<el-button v-for="item in searchBtnList" :key="item.btnFunction" :type="item.type ? item.type : 'primary'"
size="small" class="searchIcon" :icon="item.icon" style="font-size:14px;" @click="funSearchBtnClick(item)">
{{ item.name }}
<el-button
v-if="searchList.length > 1"
type="primary"
size="small"
icon="el-icon-refresh-left searchIcon"
class="searchIcon"
@click="refresh"
title="重置"
>重置
</el-button>
<slot name="searchBtn"></slot>
</div>
<div flex="cross:center" v-if="(searchModel.length != 0 && bottonShow) || nowBtns.length != 0">
<el-button type="primary" icon="el-icon-search" size="small" @click="showSearch" v-if="searchModel.length != 0">检索
</el-button>
<el-button type="primary" icon="el-icon-refresh" :plain="true" size="small" @click="refresh" v-if="false">刷新
</el-button>
<div :style="'height:' + getMainHeight()" class="tableHeight">
<slot name="main" :tableHeight="tableHeight"></slot>
</div>
<!-- 主要内容 -->
<slot name="main" :tableHeight="tableHeight"></slot>
<!-- 分页 -->
<base-page v-if="isPage" :pageModel.sync="pageModel" @onPageChange="onPageChange"></base-page>
<base-page
v-if="isPage"
:pageModel.sync="pageModel"
@onPageChange="onPageChange"
></base-page>
</div>
</div>
</template>
@ -148,7 +225,6 @@
<script>
// import heightTransition from '@/common/js/heightTransition'
// import customCascader from "@/components/customCascader";
import elementResizeDetectorMaker from "element-resize-detector";
import { exportDown, wordDown, zipDown } from "@/utils/util.js";
import basePage from "@/components/base/basePage";
import { TokenKeys } from "@/utils/variable";
@ -162,59 +238,18 @@ export default {
// customCascader
},
props: {
// 搜索按钮列表
searchBtnList: {
type: Array,
default: () => {
return [];
},
},
// 是否展示标题
showTitle: {
type: Boolean,
default: true,
},
// 是否显示搜索按钮
searchBtnShow: {
type: Boolean,
default: true,
},
// 是否显示重置按钮
resetBtnShow: {
type: Boolean,
default: true,
},
// main高度
mainHight: {
type: [Number, String, Boolean],
default: "auto",
},
// 标题
title: {
type: String,
default: "",
},
// 标题
fixModel: {
type: String | Array,
default: () => {
return [];
},
},
// 查询列表
requirementList: {
type: Array,
default: () => {
return [];
},
},
// 搜索列表
searchList: {
type: Array,
default: () => {
return [];
},
},
// 背景颜色
bgColor: {
type: String,
@ -233,7 +268,12 @@ export default {
// 高度
bodyHight: {
type: [Number, String],
default: "calc(100vh - 88px)",
default: "100%",
},
// main高度
mainHight: {
type: [Number, String, Boolean],
default: "calc(100% - 38px)",
},
// 搜索配置
searchModel: {
@ -242,25 +282,50 @@ export default {
return [];
},
},
// 搜索配置
nowBtnTab: {
type: Array,
default: () => {
return [];
},
},
// 按钮配置
nowBtns: {
type: Array,
default: () => {
return [];
},
},
// 按钮配置
buttonList: {
type: Array,
default: () => {
return [];
// [{
// icon: 'el-icon-plus',
// menuName: '新增'
// }, {
// icon: 'el-icon-edit',
// menuName: '编辑'
// }, {
// icon: 'el-icon-delete',
// menuName: '删除',
// type: 'danger'
// }, {
// icon: 'el-icon-refresh',
// menuName: '刷新'
// },]
},
},
defaultButtonList: {
type: Array,
default: () => {
return [
{
icon: "el-icon-plus",
menuName: "新增",
},
{
icon: "el-icon-edit",
menuName: "编辑",
},
{
icon: "el-icon-delete",
menuName: "删除",
type: "danger",
},
// {
// icon: 'el-icon-refresh',
// menuName: '刷新'
// },
];
},
},
// 是否展示分页
@ -268,24 +333,6 @@ export default {
type: Boolean,
default: false,
},
// 搜索按钮显示
bottonShow: {
type: Boolean,
default: true,
},
// 默认条件隐藏显示
searchShow: {
type: Boolean,
default: false,
},
queryShow: {
type: Boolean,
default: true,
},
enterClickType: {
type: Boolean,
default: true,
},
// 导出接口地址
exportUrl: {
default: "",
@ -294,22 +341,61 @@ export default {
importUrl: {
default: "",
},
//多选
selectTable: {
default: "",
},
//单选
only: {
default: "",
},
// 左侧固定按钮
fixedButton: {
type: Boolean,
default: false,
},
// 是否显示查询条件
querySwitch: {
type: Boolean,
default: false,
},
// 搜索列表
searchList: {
type: Array,
default: () => {
return [];
},
},
// 操作按钮
operateButtonSwitch: {
type: Boolean,
default: true,
},
// 操作按钮
defaultButtonSwitch: {
type: Boolean,
default: true,
},
// 右侧按钮
fixedButtonList: {
type: Array,
default: () => {
return [
{
icon: "el-icon-s-operation",
title: "筛选",
},
{
icon: "el-icon-printer",
title: "打印",
},
{
icon: "el-icon-folder",
title: "导出",
},
];
},
},
},
watch: {},
data() {
return {
// 表单数据
ruleForm: {},
// queryShow: true,
onlyUrl: "",
clientHeight: "",
// 上传请求头
@ -323,26 +409,47 @@ export default {
// 分页数据
pageModel: {
total: 0,
pageIndex: 1,
pageSize: 10,
page: 1,
limit: 20,
},
// 清除状态
clearState: 0,
// 操作按钮
tableHeight: "calc(100vh - 218px)",
loading: false,
// fixedButtonList: [{
// icon: 'el-icon-s-operation',
// title: '筛选'
// },
// {
// icon: 'el-icon-printer',
// title: '打印'
// },
// {
// icon: 'el-icon-folder',
// title: '导出'
// }
// ],
// defaultButtonList: [
// {
// icon: 'el-icon-plus',
// menuName: '新增'
// }, {
// icon: 'el-icon-edit',
// menuName: '编辑'
// }, {
// icon: 'el-icon-delete',
// menuName: '删除',
// type: 'danger'
// }, {
// icon: 'el-icon-refresh',
// menuName: '刷新'
// },
// ],
tableHeight: "100%",
};
},
created() {
},
created() {},
mounted() {
this.watchSize();
document.addEventListener("keydown", (e) => {
let key = window.event.keyCode;
if (key == 13) {
this.testEnter();
}
});
// this.getTableHight()
// window.onresize = () => {
// this.clientHeight = document.documentElement.clientHeight;
// },
@ -354,66 +461,40 @@ export default {
// }
},
methods: {
watchSize() {
const _this = this;
var erd = elementResizeDetectorMaker();
if (!this.queryShow) {
_this.getTableHight();
} else {
erd.listenTo(this.$refs.serchRefs, (element) => {
// 这里的this.$refs.fan指定要监听的元素对象，对应的是<div ref=“fan”></div>
var height = element.offsetHeight;
_this.$nextTick(() => {
_this.getTableHight(height);
});
});
getTableHight() {
let height = "100%";
let heightReduce = 0;
if (this.operateButtonSwitch) {
heightReduce = heightReduce + 53;
}
if (this.querySwitch) {
heightReduce = heightReduce + 47;
}
},
getTableHight(height = 0) {
// 导航栏+标签栏 102 按钮列表64 查询条件64 分页32 102 + 64 + 32
let reduceHight = 0;
let windowHeight = this.$refs.baseLayout.offsetHeight;
if (this.isPage) {
reduceHight = reduceHight + 52;
heightReduce = heightReduce + 53;
}
if (this.queryShow) {
let searchHeight = this.$refs.serchRefs.offsetHeight;
reduceHight = reduceHight + searchHeight;
height = "calc(100% - " + heightReduce + "px)";
this.tableHeight = height;
},
getMainHeight() {
// operateButtonSwitch 操作开关 querySwitch查询高 度
let height = "100%";
let heightReduce = 0;
if (this.operateButtonSwitch) {
heightReduce = heightReduce + 56;
}
if (this.buttonList && this.buttonList.length > 0) {
reduceHight = reduceHight + 68;
if (this.querySwitch) {
heightReduce = heightReduce + 33;
}
this.tableHeight = windowHeight - reduceHight + "px";
},
//参数propLabel ， 值value
getField(propLabel, value) {
this.$set(this.ruleForm, propLabel, value);
},
setQueryShow(type) {
this.queryShow = type;
},
elDialogClick(row, index, indexRow) {
if (row.disabled) {
return;
if (this.isPage) {
heightReduce = heightReduce + 56;
}
this.$emit("elDialogClick", row, index);
},
elDialogClear(row) {
this.resetField(row.prop);
this.$emit("elDialogClear", row);
},
// 重置表单字段
resetField(field) {
if (this.ruleForm[field]) {
this.$set(this.ruleForm, field, "");
}
},
edit(item) {
},
del(item) {
height = "calc(100% - " + heightReduce + "px)";
// console.log(height, "height")
return height;
},
pageClear() {
this.pageModel.pageIndex = 1;
this.pageModel.page = 1;
},
// importUpload() {
// const timestamp = new Date().getTime() + '';
@ -439,7 +520,6 @@ export default {
handleError() {
this.$vmNews("上传失败", "error");
},
// 设置按钮
// 自定义级联选择器返回值
getCascader(value, field) {
this.$set(this.model, field, value);
@ -451,9 +531,9 @@ export default {
setPageNum(pageNum) {
this.$set(this.pageModel, "page", pageNum);
},
// 搜索按钮点击事件
funSearchBtnClick(item) {
this.$emit("onFuncSearchBtn", item);
//参数propLabel ， 值value
getField(propLabel, value) {
this.$set(this.ruleForm, propLabel, value);
},
// 返回
goBack() {
@ -461,30 +541,24 @@ export default {
},
// 按钮点击事件
funNewClick(item) {
if (item.menuName == "刷新") {
if (item.menuName == "刷新" || item.btnFunction == "Refresh") {
this.$tab.refreshPage(this.$route);
} else {
this.$emit("onFuncBtn", item);
}
},
dropClick(item) {
this.$emit("dropClick", item);
},
// 查询隐藏展示
queryShowChange() {
this.queryShow = !this.queryShow;
this.$nextTick(() => {
this.watchSize();
});
this.$emit("queryShowChange", this.queryShow);
// 固定按钮点击事件
fixedClick(item) {
this.$emit("onFixedBtn", item);
},
// 操作按钮点击事件
funcClick(btnItem) {
// console.log(btnItem,"btnItem")
this.$emit("onFuncBtn", btnItem);
},
// 导出函数
eventExport(params) {
// console.log(params, 'params')
// console.log(this.onlyUrl ? this.onlyUrl : this.exportUrl, 'this.onlyUrl?this.onlyUrl:this.exportUrl')
// return fetch.get(this.onlyUrl ? this.onlyUrl : this.exportUrl, {
// params,
// responseType: 'blob'
@ -498,22 +572,22 @@ export default {
queryEvent(state) {
this.$emit("onQuery", this.mergeParam(true));
},
// 条件查询-下拉框
selectChange(event, index, indexItem, row) {
// if (typeof event == "number" && event < 3) {
// if (Number(event) == 2) {
// event = 0;
// } else {
// event = event - 1;
// }
// }
if (event !== "" && event != undefined) {
this.$emit("onElSelect", event, index, indexItem, this.model, row);
}
// 回车搜索
handerInputEnter() {
this.$emit("handerInputEnter", this.ruleForm);
},
// 刷新
refresh() {
this.$emit("onQuery", this.mergeParam(true));
// 条件查询-下拉框
selectChange(event, index, indexItem) {
if (typeof event == "number" && event < 3) {
if (Number(event) == 2) {
event = 0;
} else {
event = event - 1;
}
}
if (event !== "" && event != undefined) {
this.$emit("onElSelect", event, index, indexItem, this.model);
}
},
// 页数或每页条数更改时触发
onPageChange() {
@ -522,11 +596,11 @@ export default {
// 合并参数
mergeParam(state) {
if (state) {
this.pageModel.pageIndex = 1;
this.pageModel.page = 1;
}
let page = {
pageIndex: this.pageModel.pageIndex,
pageSize: this.pageModel.pageSize,
page: this.pageModel.page,
limit: this.pageModel.limit,
};
for (let i in this.model) {
if (!this.model[i]) {
@ -540,57 +614,41 @@ export default {
showSearch() {
this.isSearch = !this.isSearch;
},
// 查询函数
search() {
this.$emit("search", this.ruleForm);
},
// 重置函数
refresh() {
this.ruleForm = Object.assign({}, "");
},
testEnter() {
if (this.enterClickType) {
this.search();
}
this.search();
},
},
};
</script>
<style scoped lang='scss'>
p {
margin: 0;
.pushButton {
/* margin: 12px 10px 10px 10px; */
padding: 10px;
}
::v-deep .iconfont {
font-size: 12px;
text-align: center;
}
.queryIcon {
font-size: 16px;
color: #606266;
margin-right: 16px;
cursor: pointer;
::v-deep .el-tooltip {
padding: 0 3px;
}
.searchIcon {
font-size: 18px;
/* padding: 0 12px; */
height: 32px;
/* line-height: 32px; */
margin-left: 8px;
display: flex;
justify-content: center;
align-items: center;
}
.requirementList {
width: 160px;
height: 30px;
line-height: 30px;
::v-deep .el-button--mini {
padding: 6px 8px;
margin: 5px;
}
.container {
width: 100%;
height: 100%;
overflow: auto;
.title {
/* @include boxBase(100%, 48px, $base-color); */
@ -599,16 +657,13 @@ p {
padding: 12px;
}
.buttonList {}
.buttonList+.buttonList {
margin-left: 8px;
.buttonList + .buttonList {
margin-left: 5px;
}
.main {
/* height: auto !important; */
overflow-y: auto;
flex-wrap: wrap;
/* padding:0 12px; */
.search {
@ -617,10 +672,6 @@ p {
border: 1px solid #d8d8d8;
padding: 12px;
transition: all 0.2s ease-in-out;
.row {
/* @include fontBase(14px, #333) */
}
}
.hide {
@ -651,32 +702,4 @@ p {
cursor: pointer;
}
}
.elDialog {
display: flex;
/* width: calc(100% - 14px);1 */
align-items: center;
justify-content: space-between;
border: 1px solid #dcdfe6;
border-radius: 4px;
padding: 0 15px;
cursor: pointer;
background-color: white;
i {
color: #c0c4cc;
}
}
.searchBox {
width: 200px;
}
.searchBox+.searchBox {
margin-left: 8px;
}
::v-deep.el-radio-button--medium .el-radio-button__inner {
padding: 8px !important;
}
</style>

956
src/components/base/baseNewForm/index.vue
View File

File diff suppressed because it is too large Load Diff

3
src/components/base/baseOrganization/index.vue
View File

@ -21,7 +21,7 @@
<div slot="main" style="padding: 10px;">
<div flex="cross:center" style="margin-bottom: 10px;">
<label style="width: 35%;">机构编码</label>
<el-input style="flex:1;" v-model="organizationForm.code" disabled></el-input>
<el-input style="flex:1;" v-model="organizationForm.id" disabled></el-input>
</div>
<div flex="cross:center">
<label style="width: 35%;">机构名称</label>
@ -100,6 +100,7 @@ export default {
},
// 菜单树选中
handleNodeClick(data) {
console.log(data)
this.organizationForm = data
},
// 清空form

16
src/components/base/basePerson/index.vue
View File

@ -29,6 +29,7 @@
</template>
<script>
import { authApi } from "@/api/apis/auth";
import baseDialog from "@/components/base/BaseNewDialog/index.vue"
import baseTree from "@/components/base/BaseMenuTree/index.vue"
import baseLayout from "@/components/base/baseLayout"
@ -68,9 +69,9 @@ export default {
personTableHeight: '280px', //人员表格高度
personTableData: [],
personModel: {
page: 1,
limit: 999,
departmentID: '',
pageNum: 1,
pageSize: 999,
organId: '',
Sequence: '',
SequenceName: ''
},
@ -82,7 +83,7 @@ export default {
methods: {
// 菜单树选中
handleNodeClick(data) {
this.personModel.departmentID = data.id
this.personModel.organId = data.id
this.personData = {}
this.$refs.personCustomtable.clearRadioIndex()
this.getPersonList()
@ -103,9 +104,10 @@ export default {
let params = {
...this.personModel
}
let res = await PersonList(params)
if (res.code === 1) {
this.personTableData = res.data[1]
let res = await authApi("sysPersonService","","queryEntity","",params)
if (res.status == 200) {
console.log(res,'res')
this.personTableData = res.attribute
this.personLoading = false
}
},

24
src/layout/components/Navbar.vue
View File

@ -6,17 +6,19 @@
class="hamburger-container"
@toggleClick="toggleSideBar"
/>
<div class="right-menu" flex>
<div flex>
<router-link :to="item.path" class="indexRouter" :style="{
color: activePage == index ? '#1478f6' : ''}" v-for="(item,index) in lagerScreenMenuData" :key="index">
<div @click="handlerClick(item,index)" flex>
<i :class="item.meta.icon"></i>
<p>{{item.meta.title}}</p>
</div>
</router-link>
<breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!topNav" />
<tags-view />
<!-- -->
<!-- <router-link :to="item.path" class="indexRouter" :style="{-->
<!-- color: activePage == index ? '#1478f6' : ''}" v-for="(item,index) in lagerScreenMenuData" :key="index">-->
<!-- <div @click="handlerClick(item,index)" flex>-->
<!-- <i :class="item.meta.menuIcon"></i>-->
<!-- <p>{{item.meta.title}}</p>-->
<!-- </div>-->
<!-- </router-link>-->
<!-- <breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!topNav" />-->
</div>
<el-dropdown class="avatar-container right-menu-item hover-effect" style="display:flex;">
<!-- trigger="click" -->
@ -64,6 +66,7 @@ import { getInfo, setInfo, getCompanyId, setCompanyId } from "@/utils/auth";
import { downloadFromMinio } from "@/api/apis/auth";
import { PersonDetail } from "@/api/apis/personnelSettings";
import { authApi } from "@/api/apis/auth";
import tagsView from '@/layout/components/TagsView/index.vue'
export default {
components: {
Breadcrumb,
@ -74,6 +77,7 @@ export default {
Search,
RuoYiGit,
RuoYiDoc,
tagsView
},
computed: {
...mapGetters(["sidebar", "avatar", "device"]),
@ -129,7 +133,7 @@ export default {
mounted() {
this.personInfo = JSON.parse(getInfo());
this.PersonName = JSON.parse(getInfo()).personName;
this.getLagerScreenMenuData();
// this.getLagerScreenMenuData();
// this.getMessageData();
// this.getInfoDetail(JSON.parse(getInfo()).personID)
},

12
src/layout/components/Sidebar/SidebarItem.vue
View File

@ -5,25 +5,25 @@
<app-link v-if="onlyOneChild.meta" :to="resolvePath(onlyOneChild.path, onlyOneChild.query)">
<el-menu-item :index="resolvePath(onlyOneChild.path)" :class="{'submenu-title-noDropdown':!isNest}">
<!-- <template slot="title"> -->
<!-- <i class="iconfont" :class="item.meta.icon" > </i> -->
<!-- <i class="iconfont" :class="item.meta.menuIcon" > </i> -->
<!-- <span v-show="sidebarOpened && !isNest">{{onlyOneChild.meta.title}}</span> -->
<!-- <span v-show="isNest">{{onlyOneChild.meta.title}}</span> -->
<!-- <div v-if="sidebarOpened">
<i class="iconfont" :class="item.meta.icon" > </i>
<i class="iconfont" :class="item.meta.menuIcon" > </i>
<span>{{isNest}}</span>
</div> -->
<div v-if="isNest === false" :style="{'text-align':sidebarOpened?'left':'center'}">
<i class="iconfont" :class="item.meta.icon"> </i>
<i class="iconfont" :class="item.meta.menuIcon"> </i>
<span v-show="sidebarOpened" style="margin-left: 16px;">{{onlyOneChild.meta.title}}</span>
</div>
<div v-else>
<i class="iconfont" :class="item.meta.icon"> </i>
<i class="iconfont" :class="item.meta.menuIcon"> </i>
<span>{{onlyOneChild.meta.title}}</span>
</div>
<template slot="title">
<div v-if="isNest === false">
<i class="iconfont" :class="item.meta.icon"> </i>
<i class="iconfont" :class="item.meta.menuIcon"> </i>
<span style="margin-left: 16px;">{{item.meta.title}}</span>
</div>
</template>
@ -32,7 +32,7 @@
</template>
<el-submenu v-else ref="subMenu" :index="resolvePath(item.path)" popper-append-to-body>
<template slot="title">
<i class="iconfont" :class="item.meta.icon" v-if="item.meta.icon"> </i>
<i class="iconfont" :class="item.meta.menuIcon" v-if="item.meta.menuIcon"> </i>
<span v-show="sidebarOpened" :style="{'margin-left':(sidebarOpened && isNest == false) ?'16px':''}"
class="itemSidebar">{{item.meta.title}}</span>
</template>

6
src/layout/components/Sidebar/childrenAppSider.vue
View File

@ -3,7 +3,7 @@
<div class="newsSider bitTitle lastList" v-if="!isNest && hasOneShowingChild(item.children, item)"
style="width:100px;" @click="goRoute(item)">
<div class="concise">
<i class=" concise-icon-item iconfont" :class="item.meta.icon"></i>
<i class=" concise-icon-item iconfont" :class="item.meta.menuIcon"></i>
<i :class="item.collect == true ? 'el-icon-star-on' : 'el-icon-star-off'" class="star concise-icon"
@click.stop="handleClickWithDelay(item)"></i>
</div>
@ -20,7 +20,7 @@
<div v-for="(route, index) in getPriceList(item.children)" class="lastList" :key="index"
@click="goRoute(item, route)" style="width:100px">
<div class="concise">
<i class=" concise-icon-item iconfont" :class="route.meta.icon">
<i class=" concise-icon-item iconfont" :class="route.meta.menuIcon">
</i>
<i :class="route.collect == true ? 'el-icon-star-on' : 'el-icon-star-off'" class="star concise-icon"
@click.stop="handleClickWithDelay(route)"></i>
@ -93,7 +93,7 @@ export default {
this.$emit("openChildren", item);
},
async collectClick(val) {
// console.log(val.meta.icon);
// console.log(val.meta.menuIcon);
let params = {
mcId: val.id,
type: "",

2
src/layout/components/Sidebar/newsSider.vue
View File

@ -30,7 +30,7 @@
@mouseenter="openChildren(item, index)"
@click="goRouter(item, index)"
>
<i class="newsSider-icon iconfont" :class="item.meta.icon"> </i>
<i class="newsSider-icon iconfont" :class="item.meta.menuIcon"> </i>
<p class="newsSider-title" :class="{ active: index === activeIndex }">
{{ item.meta.title }}
</p>

4
src/layout/components/Sidebar/newsSiderApp.vue
View File

@ -29,8 +29,8 @@
class="newsSider"
@mouseenter="openChildren(item, index)"
>
<i class="newsSider-icon iconfont" :class="item.meta.icon ? item.meta.icon :'el-icon-office-building'"> </i>
<!-- <i class="newsSider-icon iconfont" :class="item.meta.icon"> </i> -->
<i class="newsSider-icon iconfont" :class="item.meta.menuIcon ? item.meta.menuIcon :'el-icon-office-building'"> </i>
<!-- <i class="newsSider-icon iconfont" :class="item.meta.menuIcon"> </i> -->
<p class="newsSider-title" :class="{ active: index === activeIndex }">
{{ item.meta.title }}
</p>

10
src/layout/components/TagsView/index.vue
View File

@ -268,22 +268,22 @@ export default {
// border-bottom: 1px solid #d8dce5;
// box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .12), 0 0 3px 0 rgba(0, 0, 0, .04);
position: fixed;
top: 55px;
top: 22px;
// margin-top: 60px;
z-index: 1000;
.tags-view-wrapper {
display: flex;
.tags-view-item {
display: inline-block;
position: relative;
cursor: pointer;
height: 26px;
line-height: 26px;
border: 1px solid #d8dce5;
color: #495060;
background: #fff;
padding: 0 8px;
font-size: 12px;
padding: 5px 8px;
font-size: 18px;
margin-left: 5px;
margin: 4px;

12
src/layout/components_new/Sidebar/SidebarItem.vue
View File

@ -5,25 +5,25 @@
<app-link v-if="onlyOneChild.meta" :to="resolvePath(onlyOneChild.path, onlyOneChild.query)">
<el-menu-item :index="resolvePath(onlyOneChild.path)" :class="{'submenu-title-noDropdown':!isNest}">
<!-- <template slot="title"> -->
<!-- <i class="iconfont" :class="item.meta.icon" > </i> -->
<!-- <i class="iconfont" :class="item.meta.menuIcon" > </i> -->
<!-- <span v-show="sidebarOpened && !isNest">{{onlyOneChild.meta.title}}</span> -->
<!-- <span v-show="isNest">{{onlyOneChild.meta.title}}</span> -->
<!-- <div v-if="sidebarOpened">
<i class="iconfont" :class="item.meta.icon" > </i>
<i class="iconfont" :class="item.meta.menuIcon" > </i>
<span>{{isNest}}</span>
</div> -->
<div v-if="isNest === false" :style="{'text-align':sidebarOpened?'left':'center'}">
<i class="iconfont" :class="item.meta.icon"> </i>
<i class="iconfont" :class="item.meta.menuIcon"> </i>
<span v-show="sidebarOpened" style="margin-left: 16px;">{{onlyOneChild.meta.title}}</span>
</div>
<div v-else>
<i class="iconfont" :class="item.meta.icon"> </i>
<i class="iconfont" :class="item.meta.menuIcon"> </i>
<span>{{onlyOneChild.meta.title}}</span>
</div>
<template slot="title">
<div v-if="isNest === false">
<i class="iconfont" :class="item.meta.icon"> </i>
<i class="iconfont" :class="item.meta.menuIcon"> </i>
<span style="margin-left: 16px;">{{item.meta.title}}</span>
</div>
</template>
@ -32,7 +32,7 @@
</template>
<el-submenu v-else ref="subMenu" :index="resolvePath(item.path)" popper-append-to-body>
<template slot="title">
<i class="iconfont" :class="item.meta.icon" v-if="item.meta.icon"> </i>
<i class="iconfont" :class="item.meta.menuIcon" v-if="item.meta.menuIcon"> </i>
<span v-show="sidebarOpened" :style="{'margin-left':(sidebarOpened && isNest == false) ?'16px':''}"
class="itemSidebar">{{item.meta.title}}</span>
</template>

6
src/layout/components_new/Sidebar/childrenAppSider.vue
View File

@ -3,7 +3,7 @@
<div class="newsSider bitTitle lastList" v-if="!isNest && hasOneShowingChild(item.children, item)"
style="width:100px;" @click="goRoute(item)">
<div class="concise">
<i class=" concise-icon-item iconfont" :class="item.meta.icon"></i>
<i class=" concise-icon-item iconfont" :class="item.meta.menuIcon"></i>
<i :class="item.collect == true ? 'el-icon-star-on' : 'el-icon-star-off'" class="star concise-icon"
@click.stop="handleClickWithDelay(item)"></i>
</div>
@ -20,7 +20,7 @@
<div v-for="(route, index) in getPriceList(item.children)" class="lastList" :key="index"
@click="goRoute(item, route)" style="width:100px">
<div class="concise">
<i class=" concise-icon-item iconfont" :class="route.meta.icon">
<i class=" concise-icon-item iconfont" :class="route.meta.menuIcon">
</i>
<i :class="route.collect == true ? 'el-icon-star-on' : 'el-icon-star-off'" class="star concise-icon"
@click.stop="handleClickWithDelay(route)"></i>
@ -93,7 +93,7 @@ export default {
this.$emit("openChildren", item);
},
async collectClick(val) {
// console.log(val.meta.icon);
// console.log(val.meta.menuIcon);
let params = {
mcId: val.id,
type: "",

2
src/layout/components_new/Sidebar/newsSider.vue
View File

@ -14,7 +14,7 @@
<div v-if="!item.hidden && item.meta" flex="cross:center" :class="{ active: index === activeIndex }" :style="{
color: settings.sideTheme === 'theme-dark' ? '#fff' : '#4c4c4c',
}" class="newsSider" @mouseenter="openChildren(item, index)">
<i class="newsSider-icon iconfont" :class="item.meta.icon"> </i>
<i class="newsSider-icon iconfont" :class="item.meta.menuIcon"> </i>
<p class="newsSider-title" :class="{ active: index === activeIndex }">
{{ item.meta.title }}
</p>

2
src/layout/components_new/Sidebar/newsSiderApp.vue
View File

@ -14,7 +14,7 @@
<div v-if="!item.hidden && item.meta" flex="cross:center" :class="{ active: index === activeIndex }" :style="{
color: settings.sideTheme === 'theme-dark' ? '#fff' : '#4c4c4c',
}" class="newsSider" @mouseenter="openChildren(item, index)">
<i class="newsSider-icon iconfont" :class="item.meta.icon"> </i>
<i class="newsSider-icon iconfont" :class="item.meta.menuIcon"> </i>
<p class="newsSider-title" :class="{ active: index === activeIndex }">
{{ item.meta.title }}
</p>

3
src/layout/index.vue
View File

@ -2,6 +2,7 @@
<div :class="classObj" class="app-wrapper" :style="{ '--current-color': theme }">
<div :class="{ hasTagsView: needTagsView, sidebarHide: sidebar.hide }" class="main-container">
<div :class="{ 'fixed-header': fixedHeader }">
<!-- <tags-view v-if="needTagsView" />-->
<navbar />
<sidebar ref="sidebar" class="sidebar-container" v-if="true" :style="{
width: sidebar.opened
@ -10,7 +11,7 @@
? childrenWidth
: '128px',
}" @openChildren="openChildren" @changeWidth="changeWidth" />
<!-- <tags-view v-if="needTagsView" /> -->
</div>
<app-main />
<right-panel>

537
src/store/modules/permission.js
View File

@ -1,289 +1,290 @@
import auth from "@/plugins/auth";
import router, {constantRoutes, dynamicRoutes} from "@/router";
import {GetMenu} from "@/api/apis/menuManage";
import {authApi} from '@/api/apis/auth'
import {getInfo} from "@/utils/auth";
import Layout from "@/layout/index";
import ParentView from "@/components/ParentView";
import InnerLink from "@/layout/components/InnerLink";
import auth from '@/plugins/auth'
import router, { constantRoutes, dynamicRoutes } from '@/router'
import { GetMenu } from '@/api/apis/menuManage'
import { authApi } from '@/api/apis/auth'
import { getInfo } from '@/utils/auth'
import Layout from '@/layout/index'
import ParentView from '@/components/ParentView'
import InnerLink from '@/layout/components/InnerLink'
const permission = {
state: {
routes: [],
addRoutes: [],
defaultRoutes: [],
topbarRouters: [],
sidebarRouters: [],
},
mutations: {
SET_ROUTES: (state, routes) => {
routes.forEach(item => {
if (item.path === "/applicationList") {
item.children.forEach(ele => {
if (ele.path === "settingMenu") {
ele.redirect = 'settingMenu/applicationEdit'
ele.children = [
{
path: "applicationEdit",
component: () => import("@/views/applicationList/applicationAdd.vue"),
name: "applicationEdit",
hidden: true,
meta: {
title: "应用编辑",
hidden: true,
},
},
{
path: "exploit",
component: () => import("@/views/applicationList/exploit"),
name: "exploit",
hidden: true,
meta: {
title: "开发管理",
hidden: true,
},
},
{
path: "authority",
component: () => import("@/views/applicationList/authority"),
name: "authority",
hidden: true,
meta: {
title: "权限管理",
hidden: true,
state: {
routes: [],
addRoutes: [],
defaultRoutes: [],
topbarRouters: [],
sidebarRouters: []
},
mutations: {
SET_ROUTES: (state, routes) => {
routes.forEach(item => {
if (item.path === '/applicationList') {
item.children.forEach(ele => {
if (ele.path === 'settingMenu') {
ele.redirect = 'settingMenu/applicationEdit'
ele.children = [
{
path: 'applicationEdit',
component: () => import('@/views/applicationList/applicationAdd.vue'),
name: 'applicationEdit',
hidden: true,
meta: {
title: '应用编辑',
hidden: true
}
},
{
path: 'exploit',
component: () => import('@/views/applicationList/exploit'),
name: 'exploit',
hidden: true,
meta: {
title: '开发管理',
hidden: true
}
},
{
path: 'authority',
component: () => import('@/views/applicationList/authority'),
name: 'authority',
hidden: true,
meta: {
title: '权限管理',
hidden: true
},
},
{
path: "appApiAdmin",
name: "appApiAdmin",
component: () => import("@/views/applicationList/apiList/apiAdmin"),
meta: {
title: "API管理",
hidden: true
}
},
{
path: "inserterAdmin",
name: "inserterAdmin",
component: () => import("@/views/applicationList/inserterAdmin"),
meta: {
title: "插件管理",
hidden: true,
}
},
{
path: "appApiadd",
name: "appApiAdd",
redirect: "",
hidden: "true",
component: () => import("@/views/applicationList/apiList/apiAdd"),
meta: {
title: "API新增",
}
},
{
path: 'appApiAdmin',
name: 'appApiAdmin',
component: () => import('@/views/applicationList/apiList/apiAdmin'),
meta: {
title: 'API管理',
hidden: true
}
},
{
path: 'inserterAdmin',
name: 'inserterAdmin',
component: () => import('@/views/applicationList/inserterAdmin'),
meta: {
title: '插件管理',
hidden: true
}
},
{
path: 'appApiadd',
name: 'appApiAdd',
redirect: '',
hidden: 'true',
component: () => import('@/views/applicationList/apiList/apiAdd'),
meta: {
title: 'API新增'
},
},
{
path: "appApiview",
name: "appApiView",
hidden: "true",
component: () => import("@/views/applicationList/apiList/apiView"),
meta: {
title: "API查看"
}
},
]
}
})
} else if (item.path === "/integrationOption") {
item.children.forEach(ele => {
if (ele.path === "settingMenu") {
ele.redirect = 'settingMenu/masterDataEdit'
ele.children = [
{
path: "masterDataEdit",
component: () => import("@/views/masterDataOptions/masterDataAdd.vue"),
name: "masterDataEdit",
hidden: true,
meta: {
title: "基本信息",
hidden: true,
},
},
{
path: "dataOrigin",
component: () => import("@/views/masterDataOptions/dataOrigin"),
name: "dataOrigin",
hidden: true,
meta: {
title: "数据源",
hidden: true,
},
},
{
path: "displayInfo",
component: () => import("@/views/masterDataOptions/displayInfo"),
name: "displayInfo",
hidden: true,
meta: {
title: "显示信息",
hidden: true,
},
},
{
path: "authorily",
name: "authorily",
component: () => import("@/views/masterDataOptions/authority"),
meta: {
title: "配置权限",
hidden: true
}
},
{
path: "distribute",
name: "distribute",
component: () => import("@/views/masterDataOptions/distribute"),
meta: {
title: "分发设置",
hidden: true,
}
},
]
}
})
}
},
{
path: 'appApiview',
name: 'appApiView',
hidden: 'true',
component: () => import('@/views/applicationList/apiList/apiView'),
meta: {
title: 'API查看'
}
}
})
state.addRoutes = routes;
state.routes = constantRoutes.concat(routes);
// state.routes = routes
},
SET_DEFAULT_ROUTES: (state, routes) => {
state.defaultRoutes = constantRoutes.concat(routes);
},
SET_TOPBAR_ROUTES: (state, routes) => {
state.topbarRouters = routes;
},
SET_SIDEBAR_ROUTERS: (state, routes) => {
state.sidebarRouters = routes;
},
REMOVE_ROUTER: (state, routes) => {
state.routes = [];
state.addRoutes = []
},
]
}
})
} else if (item.path === '/integrationOption') {
item.children.forEach(ele => {
if (ele.path === 'settingMenu') {
ele.redirect = 'settingMenu/masterDataEdit'
ele.children = [
{
path: 'masterDataEdit',
component: () => import('@/views/masterDataOptions/masterDataAdd.vue'),
name: 'masterDataEdit',
hidden: true,
meta: {
title: '基本信息',
hidden: true
}
},
{
path: 'dataOrigin',
component: () => import('@/views/masterDataOptions/dataOrigin'),
name: 'dataOrigin',
hidden: true,
meta: {
title: '数据源',
hidden: true
}
},
{
path: 'displayInfo',
component: () => import('@/views/masterDataOptions/displayInfo'),
name: 'displayInfo',
hidden: true,
meta: {
title: '显示信息',
hidden: true
}
},
{
path: 'authorily',
name: 'authorily',
component: () => import('@/views/masterDataOptions/authority'),
meta: {
title: '配置权限',
hidden: true
}
},
{
path: 'distribute',
name: 'distribute',
component: () => import('@/views/masterDataOptions/distribute'),
meta: {
title: '分发设置',
hidden: true
}
}
]
}
})
}
})
state.addRoutes = routes
state.routes = constantRoutes.concat(routes)
// state.routes = routes
},
actions: {
// 生成路由
GenerateRoutes({commit}) {
return new Promise((resolve) => {
let params = {
UserID: JSON.parse(getInfo()).id,
};
authApi('moduleService', 'module', 'queryTreeById', '', params).then((res) => {
const sdata = JSON.parse(JSON.stringify(res.attribute))
const rdata = JSON.parse(JSON.stringify(res.attribute))
const sidebarRoutes = filterAsyncRouter(sdata);
const rewriteRoutes = filterAsyncRouter(rdata, false, true);
const asyncRoutes = filterDynamicRoutes(dynamicRoutes);
rewriteRoutes.push({
path: "*",
redirect: "/notFound",
hidden: true,
});
router.addRoutes(asyncRoutes);
router.addRoutes(rewriteRoutes);
commit("SET_ROUTES", rewriteRoutes);
// commit("SET_SIDEBAR_ROUTERS", sidebarRoutes);
commit("SET_DEFAULT_ROUTES", sidebarRoutes);
commit("SET_TOPBAR_ROUTES", sidebarRoutes);
commit('SET_SIDEBAR_ROUTERS', constantRoutes.concat(sidebarRoutes))
resolve(rewriteRoutes);
});
});
},
SET_DEFAULT_ROUTES: (state, routes) => {
state.defaultRoutes = constantRoutes.concat(routes)
},
};
SET_TOPBAR_ROUTES: (state, routes) => {
state.topbarRouters = routes
},
SET_SIDEBAR_ROUTERS: (state, routes) => {
state.sidebarRouters = routes
},
REMOVE_ROUTER: (state, routes) => {
state.routes = []
state.addRoutes = []
}
},
actions: {
// 生成路由
GenerateRoutes({ commit }) {
return new Promise((resolve) => {
let params = {
id: JSON.parse(getInfo()).id
}
authApi('sysMenuConfigService', '', 'queryTreeById', '', params).then((res) => {
const sdata = JSON.parse(JSON.stringify(res.attribute))
const rdata = JSON.parse(JSON.stringify(res.attribute))
const sidebarRoutes = filterAsyncRouter(sdata)
const rewriteRoutes = filterAsyncRouter(rdata, false, true)
const asyncRoutes = filterDynamicRoutes(dynamicRoutes)
rewriteRoutes.push({
path: '*',
redirect: '/notFound',
hidden: true
})
router.addRoutes(asyncRoutes)
router.addRoutes(rewriteRoutes)
console.log(rewriteRoutes,'rewriteRoutes')
commit('SET_ROUTES', rewriteRoutes)
// commit("SET_SIDEBAR_ROUTERS", sidebarRoutes);
commit('SET_DEFAULT_ROUTES', sidebarRoutes)
commit('SET_TOPBAR_ROUTES', sidebarRoutes)
commit('SET_SIDEBAR_ROUTERS', constantRoutes.concat(sidebarRoutes))
resolve(rewriteRoutes)
})
})
}
}
}
// 遍历后台传来的路由字符串，转换为组件对象
function filterAsyncRouter(asyncRouterMap, lastRouter = false, type = false) {
return asyncRouterMap.filter((route) => {
if (type && route.children) {
route.children = filterChildren(route.children);
}
if (route.component) {
// Layout ParentView 组件特殊处理
if (route.component === "Layout") {
route.component = Layout;
} else if (route.component === "ParentView") {
route.component = ParentView;
} else if (route.component === "InnerLink") {
route.component = InnerLink;
} else {
route.component = loadView(route.component);
}
}
if (route.children != null && route.children && route.children.length) {
route.children = filterAsyncRouter(route.children, route, type);
} else {
delete route["children"];
delete route["redirect"];
}
return true;
});
return asyncRouterMap.filter((route) => {
if (type && route.children) {
route.children = filterChildren(route.children)
}
if (route.component) {
// Layout ParentView 组件特殊处理
if (route.component === 'Layout') {
route.component = Layout
} else if (route.component === 'ParentView') {
route.component = ParentView
} else if (route.component === 'InnerLink') {
route.component = InnerLink
} else {
route.component = loadView(route.component)
}
}
if (route.children != null && route.children && route.children.length) {
route.children = filterAsyncRouter(route.children, route, type)
} else {
delete route['children']
delete route['redirect']
}
return true
})
}
function filterChildren(childrenMap, lastRouter = false) {
var children = [];
childrenMap.forEach((el, index) => {
if (el.children && el.children.length) {
if (el.component === "ParentView" && !lastRouter) {
el.children.forEach((c) => {
c.path = el.path + "/" + c.path;
if (c.children && c.children.length) {
children = children.concat(filterChildren(c.children, c));
return;
}
children.push(c);
});
return;
}
}
if (lastRouter) {
el.path = lastRouter.path + "/" + el.path;
}
children = children.concat(el);
});
return children;
var children = []
childrenMap.forEach((el, index) => {
if (el.children && el.children.length) {
if (el.component === 'ParentView' && !lastRouter) {
el.children.forEach((c) => {
c.path = el.path + '/' + c.path
if (c.children && c.children.length) {
children = children.concat(filterChildren(c.children, c))
return
}
children.push(c)
})
return
}
}
if (lastRouter) {
el.path = lastRouter.path + '/' + el.path
}
children = children.concat(el)
})
return children
}
// 动态路由遍历，验证是否具备权限
export function filterDynamicRoutes(routes) {
const res = [];
routes.forEach((route) => {
// if (route.permissions) {
// if (auth.hasPermiOr(route.permissions)) {
// res.push(route)
// }
// } else if (route.roles) {
// if (auth.hasRoleOr(route.roles)) {
// res.push(route)
// }
// }
res.push(route);
});
return res;
const res = []
routes.forEach((route) => {
// if (route.permissions) {
// if (auth.hasPermiOr(route.permissions)) {
// res.push(route)
// }
// } else if (route.roles) {
// if (auth.hasRoleOr(route.roles)) {
// res.push(route)
// }
// }
res.push(route)
})
return res
}
export const loadView = (view) => {
// if (process.env.NODE_ENV === 'development') {
// return (resolve) => require([`@/views/${view}`], resolve)
// } else {
// // 使用 import 实现生产环境的路由懒加载
// // return () => import(`@/views/${view}`)
// // return (resolve) => require([`@/views/${view}`], resolve)
// return () => import(`@/views/${view}`)
// }
return (resolve) => require([`@/views/${view}`], resolve);
};
// if (process.env.NODE_ENV === 'development') {
// return (resolve) => require([`@/views/${view}`], resolve)
// } else {
// // 使用 import 实现生产环境的路由懒加载
// // return () => import(`@/views/${view}`)
// // return (resolve) => require([`@/views/${view}`], resolve)
// return () => import(`@/views/${view}`)
// }
return (resolve) => require([`@/views/${view}`], resolve)
}
export default permission;
export default permission

173
src/views/doraChunk/components/contentChunk/index.vue Normal file
View File

@ -0,0 +1,173 @@
<template>
<div
class="wrap"
:class="{ border: drop }"
@dragover.prevent
@drop="dropIn"
style="position: relative"
>
<VueDraggable
type="div"
class="flex"
v-if="elementList.length"
v-model="$store.state.dropIndex.elementList"
v-bind="{
sort: drop,
animation: 500,
}"
handle=".move"
group="componentsGroup"
>
<template v-for="(item, index) in elementList">
<div
class="chunk"
:style="{ width: `${item.width}%` }"
@click.stop="activeBox(item)"
@mouseenter="mouseenterBox(item)"
@mouseleave="mouseleaveBox"
:class="{
active:
(drop && item.id == activeInfo.id) ||
item.id === mouseenterInfo.id,
move: drop,
center: item.alignCenter,
}"
>
<i class="el-icon-delete" @click.stop="deleBox(item)" v-if="drop"></i>
<component :is="item.component" :key="item.key" />
</div>
</template>
</VueDraggable>
<span class="tip" v-else>从右侧拖入或点击组件进行表单设计..</span>
</div>
</template>
<script>
import VueDraggable from "vuedraggable";
import { v4 as uuidv4 } from "uuid";
import { mapActions, mapGetters, mapMutations } from "vuex";
export default {
props: {
drop: {
type: Boolean,
default: false,
},
},
methods: {
//模块拉入
dropIn(event) {
const drop_element = event.dataTransfer.getData("drop_element");
if (!drop_element) return;
let tempFlag = this.elementList.some((item) => {
if (JSON.parse(drop_element).componentName === item.componentName) {
return true;
} else {
return false;
}
});
if (tempFlag) {
this.$message({
type: "warning",
message: "禁止加入相同组件",
});
return;
}
const dropElement = JSON.parse(drop_element);
dropElement.id = uuidv4();
dropElement.key = uuidv4();
dropElement.component =
this.$options.components[dropElement.componentName];
this.updateElementList(dropElement);
},
//点击模块
activeBox(item) {
if (!this.drop) return;
this.SET_ACTIONINFO(item);
},
//鼠标移入模块
mouseenterBox(item) {
if (!this.drop) return;
this.SET_MOUSEENTERINFO(item);
},
//鼠标移出模块
mouseleaveBox() {
if (!this.drop) return;
this.REMOVE_MOUSEENTERINFO();
},
//删除模块
deleBox(item) {
if (!this.drop) return;
//需判断删除模块是否为选中模块，如果是则移除选择
if (item.id === this.activeInfo.id) {
this.REMOVE_ACTIONINFO({});
}
this.REMOVE_ELEMENT_LIST(item);
},
...mapActions("dropIndex", ["updateElementList"]),
...mapMutations("dropIndex", [
"SET_ACTIONINFO",
"SET_MOUSEENTERINFO",
"REMOVE_MOUSEENTERINFO",
"REMOVE_ELEMENT_LIST",
"REMOVE_ACTIONINFO",
]),
},
computed: {
...mapGetters(["elementList", "activeInfo", "mouseenterInfo"]),
},
components: {
VueDraggable,
},
};
</script>
<style scoped lang='scss'>
.wrap {
width: 100%;
height: 100%;
background-color: #fafafa;
overflow-y: auto;
position: relative;
> .tip {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: #c8b2e6;
font-size: 24px;
letter-spacing: 5px;
}
> .flex {
display: flex;
flex-wrap: wrap;
> .chunk {
margin: 10px;
border: 1px solid transparent;
position: relative;
> i {
cursor: pointer;
position: absolute;
top: 0px;
right: 0px;
color: red;
display: none;
}
}
.center {
margin: 10px auto;
}
}
.active {
border: 1px dashed #5a9cf8 !important;
> i {
display: block !important;
}
}
}
.border {
border: 1px dashed #ccc;
}
.move {
cursor: move !important;
}
</style>

78
src/views/doraChunk/components/menuChunk/index copy.vue Normal file
View File

@ -0,0 +1,78 @@
<template>
<div class="wrap">
<div class="chunk">
<div class="title">
<i class="el-icon-monitor"></i>
<div class="text">首页组件模块</div>
</div>
<div class="content">
<div
class="item"
v-for="(item, index) in dropElement"
:key="index"
draggable="true"
@dragstart="dragstart($event, item)"
>
<i :class="item.icon"></i>
{{ item.name }}
</div>
</div>
</div>
</div>
</template>
<script>
import { mapGetters } from "vuex";
export default {
props: {
dropElement: {
type: Array,
default: () => {
return [];
},
},
},
computed: {
...mapGetters(["elementList"]),
},
methods: {
dragstart(e, item) {
e.dataTransfer.setData("drop_element", JSON.stringify(item));
},
},
};
</script>
<style scoped lang='scss'>
.wrap {
width: 100%;
height: 100%;
background-color: #fff;
padding: 5px;
> .chunk {
> .title {
display: flex;
align-content: center;
font-size: 14px;
> .text {
margin-left: 10px;
}
}
> .content {
display: flex;
margin-top: 10px;
align-items: center;
flex-wrap: wrap;
> .item {
cursor: pointer;
margin-top: 5px;
width: 45%;
font-size: 12px;
margin-right: 5%;
padding: 15px 10px;
background-color: #f6f7fe;
}
}
}
}
</style>

120
src/views/doraChunk/components/menuChunk/index.vue Normal file
View File

@ -0,0 +1,120 @@
<template>
<div class="wrap">
<div class="chunk">
<div class="title">
<i class="el-icon-monitor"></i>
<div class="text">首页组件模块</div>
</div>
<div class="content">
<div
class="item"
v-for="(item, index) in dropElement"
:key="index"
draggable="true"
@click="dropIn(item)"
@dragstart="dragstart($event, item)"
>
<i :class="item.icon"></i>
{{ item.name }}
</div>
</div>
</div>
</div>
</template>
<script>
import _ from "lodash";
import { mapGetters, mapActions } from "vuex";
import { v4 as uuidv4 } from "uuid";
export default {
props: {
dropElement: {
type: Array,
default: () => {
return [];
},
},
littleModule: {
type: Array,
default: () => {
return [];
},
},
},
computed: {
...mapGetters(["elementList"]),
},
methods: {
//点击模块录用数据
dropIn(item) {
const drop_element = _.cloneDeep(item);
if (!drop_element) return;
let tempFlag = this.elementList.some((item) => {
if (drop_element.componentName === item.componentName) {
return true;
} else {
return false;
}
});
if (tempFlag) {
this.$message({
type: "warning",
message: "禁止加入相同组件",
});
return;
}
const dropElement = drop_element;
dropElement.id = uuidv4();
dropElement.key = uuidv4();
dropElement.component =
this.$options.components[dropElement.componentName];
this.updateElementList(dropElement);
},
//拖拽开始
dragstart(e, item) {
e.dataTransfer.setData("drop_element", JSON.stringify(_.cloneDeep(item)));
},
...mapActions("dropIndex", ["updateElementList", "=-"]),
},
};
</script>
<style scoped lang='scss'>
.wrap {
width: 100%;
height: 100%;
background-color: #fff;
padding: 5px;
> .chunk {
> .title {
margin-top: 10px;
display: flex;
align-content: center;
font-size: 14px;
> .text {
margin-left: 10px;
}
}
> .content {
display: flex;
margin-top: 10px;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
> .item {
cursor: pointer;
margin-top: 5px;
width: 49%;
font-size: 12px;
padding: 15px 10px;
background-color: #f6f7fe;
border: 1px transparent dashed;
&:hover {
color: #797be1;
border: 1px #797be1 dashed;
}
}
}
}
}
</style>

169
src/views/doraChunk/components/optionsChunk/index.vue Normal file
View File

@ -0,0 +1,169 @@
<template>
<div class="wrap">
<div class="title" v-if="activeInfo.id">
<i class="el-icon-setting"></i>
<div class="text">{{ activeInfo.name }}-配置项</div>
</div>
<div class="content" v-if="activeInfo.id">
<template>
<div class="chunk">
<div class="chunkTitle">宽度设置: （{{ activeInfo.width }}%）</div>
<div class="btn">
<el-slider
v-model="activeInfo.width"
:max="100"
:min="10"
></el-slider>
</div>
</div>
<div class="chunk">
<div class="chunkTitle">
是否居中:
<el-checkbox v-model="activeInfo.alignCenter"></el-checkbox>
</div>
</div>
<div class="chunk">
<div class="btn resize">
<el-button
type="primary"
icon="el-icon-refresh-left"
@click="resizeActiveWidth"
size="mini"
>还原默认</el-button
>
</div>
</div>
</template>
</div>
<!-- <div class="chunk">
{{ elementList }}
</div> -->
<div class="lookView" v-if="elementList.length">
<div class="btnChunk">
<el-button
type="primary"
icon="el-icon-view"
@click="viewHanlde"
size="mini"
>预览</el-button
>
</div>
<div class="btnChunk">
<el-button
type="danger"
icon="el-icon-delete"
size="mini"
@click="cleanHanlde"
>清空</el-button
>
</div>
<div class="btnChunk">
<el-button
:loading="submitLoading"
type="success"
icon="el-icon-plus"
size="mini"
@click="submitHanlde"
>提交</el-button
>
</div>
</div>
</div>
</template>
<script>
import { mapActions, mapGetters, mapMutations } from "vuex";
import _ from "lodash";
// import { SaveMyWidgetAPI } from "@/api/apis/layOutAuth.js";
export default {
data() {
return {
submitLoading: false,
};
},
computed: {
...mapGetters(["elementList", "activeInfo", "mouseenterInfo"]),
},
methods: {
// 提交
async submitHanlde() {
this.submitLoading = true;
let tempArr = _.cloneDeep(this.elementList).map((item) => {
this.$delete(item, "component");
return item;
});
const res = await SaveMyWidgetAPI(JSON.stringify(tempArr));
this.submitLoading = false;
if (res.code == 1) {
this.$message({
type: "success",
message: "保存成功！",
});
this.$router.push({ name: "Index" });
}
},
//清空组件
cleanHanlde() {
this.$confirm("确定清空组件？")
.then((_) => {
this.CLEAN_ELEMENT_LIST();
})
.catch((_) => {});
},
//还原选中模块宽度
resizeActiveWidth() {
this.RESIZE_ACTIVE_WIDTH();
},
...mapMutations("dropIndex", ["RESIZE_ACTIVE_WIDTH", "CLEAN_ELEMENT_LIST"]),
//点击预览
viewHanlde() {
this.$emit("viewHanlde");
},
},
};
</script>
<style scoped lang='scss'>
.wrap {
background-color: #fff;
padding: 10px;
width: 100%;
height: 100%;
position: relative;
> .title {
display: flex;
align-items: center;
.text {
font-size: 14px;
margin-left: 10px;
}
}
> .content {
margin-top: 20px;
> .chunk {
margin: 10px 0;
width: 100%;
> .chunkTitle {
font-size: 14px;
}
> .btn {
width: 90%;
margin: 0 auto;
}
> .resize {
display: flex;
justify-content: flex-end;
}
}
}
> .lookView {
position: absolute;
bottom: 10px;
display: flex;
.btnChunk {
flex: 1;
margin-right: 2px;
}
}
}
</style>

206
src/views/doraChunk/config/indexChunkConfig.js Normal file
View File

@ -0,0 +1,206 @@
/**
* huyitong 2023-09-05
* tag:"layOutChunk"首页模块
* name:"左侧拖拽菜单显示名"
* icon:“左侧拖拽菜单显示icon”
* min：最小宽度
* width:初始宽度
* defaultWidth:默认宽度（还原默认用）
* componentName:组件名（需去@/components/index.js提前注册）
* alignCenter:是否居中
*/
const config = [
// {
// name: "今日数据概览-普通员工",
// componentName: "employeeTodayData",
// width: 60,
// defaultWidth: 60,
// min: 10,
// icon: "el-icon-picture-outline-round",
// tag: "layOutChunk",
// alignCenter: false,
// },
{
name: "任务预警",
componentName: "taskWarning",
width: 32,
defaultWidth: 32,
min: 10,
icon: "el-icon-picture-outline-round",
tag: "layOutChunk",
alignCenter: false,
},
{
name: "合同预警",
componentName: "contractWarning",
width: 32,
defaultWidth: 32,
min: 10,
icon: "el-icon-picture-outline-round",
tag: "layOutChunk",
alignCenter: false,
},
{
name: "待审工作",
componentName: "agencyReviewWork",
width: 32,
defaultWidth: 32,
min: 10,
icon: "el-icon-picture-outline-round",
tag: "layOutChunk",
alignCenter: false,
},
{
name: "项目预警",
componentName: "projectWarning",
width: 32,
defaultWidth: 32,
min: 10,
icon: "el-icon-picture-outline-round",
tag: "layOutChunk",
alignCenter: false,
},
{
name: "交接单未立项",
componentName: "contractHandover",
width: 16,
defaultWidth: 16,
min: 10,
icon: "el-icon-picture-outline-round",
tag: "layOutChunk",
alignCenter: false,
},
{
name: "本月任务数",
componentName: "employeeMonthTask",
width: 35,
min: 10,
defaultWidth: 35,
icon: "el-icon-menu",
tag: "layOutChunk",
alignCenter: false,
},
{
name: "本周任务",
componentName: "employeeWeekTask",
width: 60,
min: 10,
defaultWidth: 60,
icon: "el-icon-s-cooperation",
tag: "layOutChunk",
alignCenter: false,
},
{
name: "快捷操作区",
componentName: "quickOperation",
width: 35,
min: 10,
defaultWidth: 35,
icon: "el-icon-s-cooperation",
tag: "layOutChunk",
alignCenter: false,
},
{
name: "我的周计划",
componentName: "weekPlan",
width: 35,
min: 10,
defaultWidth: 35,
icon: "el-icon-s-release",
tag: "layOutChunk",
alignCenter: false,
},
{
name: "我的审批",
componentName: "approval",
width: 35,
min: 10,
defaultWidth: 35,
icon: "el-icon-date",
tag: "layOutChunk",
alignCenter: false,
},
// {
// name: "今日数据概览-项目经理",
// componentName: "projectManagerTodayData",
// width: 60,
// defaultWidth: 60,
// min: 10,
// icon: "el-icon-s-check",
// tag: "layOutChunk",
// alignCenter: false,
// },
{
name: "未处理问题",
componentName: "projectManagerProblem",
width: 35,
min: 10,
defaultWidth: 35,
icon: "el-icon-s-claim",
tag: "layOutChunk",
alignCenter: false,
},
{
name: "项目阶段预警",
componentName: "projectManagerProjectWarning",
width: 60,
defaultWidth: 60,
min: 10,
icon: "el-icon-picture-outline-round",
tag: "littleModule",
alignCenter: false,
},
{
name: "重点项目跟进",
componentName: "keyProject",
width: 60,
defaultWidth: 60,
min: 10,
icon: "el-icon-picture-outline-round",
tag: "littleModule",
alignCenter: false,
},
// {
// name: "今日数据概览-业务员",
// componentName: "salesManTodayData",
// width: 60,
// defaultWidth: 60,
// min: 10,
// icon: "el-icon-picture-outline-round",
// tag: "littleModule",
// alignCenter: false,
// },
{
name: "回款认领",
componentName: "salesMamRefundClaim",
width: 60,
defaultWidth: 60,
min: 10,
icon: "el-icon-picture-outline-round",
tag: "littleModule",
alignCenter: false,
},
{
name: "合同收款预警",
componentName: "salesManCollectionWarning",
width: 60,
defaultWidth: 60,
min: 10,
icon: "el-icon-picture-outline-round",
tag: "littleModule",
alignCenter: false,
},
{
name: "今日天气",
componentName: "weatherChunk",
width: 35,
defaultWidth: 35,
min: 10,
icon: "el-icon-picture-outline-round",
tag: "littleModule",
alignCenter: false,
},
];
export default {
config,
};

6
src/views/doraChunk/config/littleModule.js Normal file
View File

@ -0,0 +1,6 @@
const config = [
]
export default {
config,
};

137
src/views/doraChunk/index.vue Normal file
View File

@ -0,0 +1,137 @@
<template>
<div class="warp">
<div class="dropMain">
<div class="left" v-if="!full">
<menuChunk
:dropElement="dropElement"
:littleModule="littleModule"
></menuChunk>
</div>
<div class="center">
<contentChunk :drop="drop"></contentChunk>
</div>
<div class="right" v-if="!full">
<optionsChunk @viewHanlde="viewHanlde"></optionsChunk>
</div>
</div>
<div class="exitView" v-if="viewFLag">
<el-button @click="openDrap">{{
drop ? "关闭拖拽" : "开启拖拽"
}}</el-button>
<el-button @click="exitViewHanlde">退出预览</el-button>
</div>
</div>
</template>
<script>
import dropData from "./config/indexChunkConfig";
import menuChunk from "./components/menuChunk/index.vue";
import contentChunk from "./components/contentChunk/index.vue";
import optionsChunk from "./components/optionsChunk/index.vue";
import { GetPppedomSet } from "@/api/apis/jurisdiction";
import { getInfo } from "@/utils/auth";
// import {
// GeWidgetPepedomLoginUserAPI,
// GetMyWidgetAPI,
// } from "@/api/apis/layOutAuth.js";
import { mapMutations } from "vuex";
import littleModule from "./config/littleModule";
export default {
props: {},
data() {
return {
dropElement: [], //左侧拖拽模块(首页模块)
littleModule: littleModule.config, //小组件模块
viewFLag: false, //开启预览模式
drop: true, //开启拖拽
full: false, //开启全屏模式
};
},
components: {
menuChunk,
contentChunk,
optionsChunk,
},
created() {
this.GetMyWidgetHanlde();
},
activated() {
this.GetMyWidgetHanlde();
},
methods: {
//获取首页小组件事件
async GetMyWidgetHanlde() {
const authRes = await GeWidgetPepedomLoginUserAPI();
let tempAuthStr = authRes.data[0];
let tempArr = [];
dropData.config.forEach((item) => {
if (tempAuthStr.includes(item.componentName)) {
this.dropElement.push(item);
}
});
const res = await GetMyWidgetAPI();
if (res.code === 1) {
if (res.data.length && res.data[0]) {
tempArr = JSON.parse(res.data[0]).filter((item) => {
if (tempAuthStr.includes(item.componentName)) {
item.component = this.$options.components[item.componentName];
return item;
}
});
this.SET_ELEMENT_LIST(tempArr);
} else {
//没模版
}
}
},
async initAuth() {},
//点击预览$emit上来
viewHanlde() {
// this.drop = false;
this.viewFLag = true;
this.full = true;
},
//退出预览事件
exitViewHanlde() {
this.drop = true; //开启拖拽
this.viewFLag = false; //关闭预览按钮
this.full = false; //关闭全屏模式
},
//拖拽开启切换
openDrap() {
this.drop = !this.drop;
},
...mapMutations("dropIndex", ["SET_ELEMENT_LIST"]),
},
};
</script>
<style lang='scss' scoped>
.warp {
width: 100%;
position: relative;
overflow-x: auto;
> .dropMain {
padding: 10px;
display: flex;
height: 90vh;
.left {
flex: 1;
}
.center {
margin: 0 10px;
flex: 4.5;
background-color: #fff;
}
.right {
flex: 1;
background-color: #fff;
}
}
.exitView {
position: absolute;
top: 10px;
right: 25px;
}
}
</style>

2
src/views/newIntegrationTask/foregroundTask/baseNewSelect.vue
View File

@ -46,7 +46,7 @@
</el-select>
</template>
<template v-else
><div v-loading="selLoading">{{ showValue }}</div></template
><div v-loading="selLoading">{{ showValue }}</div></template
>
</div>
</template>

17
src/views/newIntegrationTask/foregroundTask/configData.js
View File

@ -106,10 +106,25 @@ const formRowShow = [
}]
},
]
const operationTableColumn= [
{
label: '本次推送的执行时间',
prop: 'create_time',
},
{
label: '本次推送的入参',
prop: 'inParameter',
},
{
label: '推送人名称',
prop: 'create_user_id',
},
]
export default {
tableColumnData,
formRow,
basicsRules,
formRowShow,
tableVersionColumn
tableVersionColumn,
operationTableColumn
}

8
src/views/newIntegrationTask/foregroundTask/index.vue
View File

@ -74,7 +74,7 @@ export default {
{
color: "#6a9af1",
text: "编辑",
text: "重推",
},
{
color: "#d67a74",
@ -137,15 +137,15 @@ export default {
add() {
this.$refs.rightDialog.openDialog("add");
},
// 表格操作事件 查看 编辑 删除
// 表格操作事件 查看 重推 删除
onFunc(index, row,item) {
// 查看
if (item.text==='查看') {
this.openLoading("detail");
this.$refs.rightDialog.openDialog("show", row);
}
// 编辑
if (item.text==='编辑') {
// 重推
if (item.text==='重推') {
this.openLoading("detail");
this.$refs.rightDialog.openDialog("edit", row);
}

78
src/views/newIntegrationTask/foregroundTask/rightDialog.vue
View File

@ -42,7 +42,7 @@
:funData="funData"
@onFunc="onFunc"
>
<!-- 编码-->
<!-- 编码-->
<template v-slot:argName="{ row }">
<div style="width: 100%">
{{row.argName}}
@ -50,7 +50,7 @@
</template>
<template v-slot:argValue="{ row }">
<div style="width: 100%">
<!-- 若参数类型为1 （字符串） 否则为2 （日期）-->
<!-- 若参数类型为1 （字符串） 否则为2 （日期）-->
<template v-if="row.argType==1">
<template v-if="!submitShow">{{row.argValue}}</template>
<el-input
@ -61,8 +61,9 @@
:disabled="!submitShow"
></el-input>
</template>
<template v-else>
<template v-if="!submitShow">{{row.startDate}}-{{row.endDate}}</template>
<!-- 日期选择器-->
<template v-else-if="row.argType==2">
<template v-if="!submitShow">{{row.startDate}}/{{row.endDate}}</template>
<template v-else>
<el-date-picker
v-model="row.startDate"
@ -81,7 +82,46 @@
value-format="yyyy-MM-dd">
</el-date-picker>
</template>
</template>
<!-- 年月-->
<template v-else-if="row.argType==3">
<template v-if="!submitShow">{{row.argValue}}</template>
<template v-else>
<el-date-picker
v-model="row.argValue"
type="month"
placeholder="年月"
:disabled="!submitShow"
format="yyyy 年 MM 月"
value-format="yyyy-MM">
</el-date-picker>
</template>
</template>
<!-- 年月日-->
<template v-else-if="row.argType==4">
<template v-if="!submitShow">{{row.argValue}}</template>
<template v-else>
<el-date-picker
v-model="row.argValue"
type="date"
placeholder="年月日"
:disabled="!submitShow"
format="yyyy 年 MM 月 DD 日"
value-format="yyyy-MM-DD">
</el-date-picker>
</template>
</template>
<!-- 年月日时间-->
<template v-else-if="row.argType==5">
<template v-if="!submitShow">{{row.argValue}}</template>
<template v-else>
<el-date-picker
v-model="row.argValue"
type="datetime"
placeholder="年月日时间"
:disabled="!submitShow">
</el-date-picker>
</template>
</template>
</div>
</template>
@ -106,6 +146,18 @@
</div>
</template>
</base-table>
<template v-if="dialogTitle!=='新增'">
<div class="small_title">操作记录</div>
<base-table
:border="true"
:showIndex="true"
:tableColumn="tableColumn"
:tableData="tableData"
:funWidth="80"
>
</base-table>
</template>
</base-right-dialog>
</div>
</template>
@ -141,6 +193,8 @@ export default {
isEdit: false,
select_dist:{},
plugNameOptions:[],
tableColumn:configData.operationTableColumn,//操作记录
tableData:[],
};
},
mounted() {
@ -215,14 +269,9 @@ export default {
openDialog(type, row) {
this.queryProductClassfy();
this.formRow = configData.formRow;
this.submitShow = true;
this.submitShow = true;
this.isEdit = false
this.funData = [
{
color: "#ff0000",
text: "删除",
}
]
this.funData = []
// 新增
if (type == "add") {
this.dialogTitle = "新增";
@ -270,6 +319,7 @@ export default {
this.$set(item,'endDate',item.argValue.split("/")[1])
}
})
this.tableData=res.attribute.sysIntegratedForegroundTaskParameterEntities
// let result = [];
// this.tableVersionData = Object.assign([], result);
});
@ -389,6 +439,10 @@ export default {
</script>
<style scoped lang="scss">
.small_title{
margin: 10px 0;
font-size: 16px;
}
.dialogList {
padding: 16px 0;
border-top: 1px solid #dcdfe6;

42
src/views/newIntegrationTask/plugInOptions/rightDialog.vue
View File

@ -65,10 +65,18 @@
</template>
<template v-slot:argType="{ row }">
<div style="width: 100%">
<el-radio-group v-model="row.argType" :disabled="!submitShow">
<el-radio label="1">字符串</el-radio>
<el-radio label="2">日期</el-radio>
</el-radio-group>
<!-- <el-radio-group v-model="row.argType" :disabled="!submitShow">-->
<!-- <el-radio label="1">字符串</el-radio>-->
<!-- <el-radio label="2">日期</el-radio>-->
<!-- </el-radio-group>-->
<el-select v-model="row.argType" placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
</template>
<template v-slot:remark="{ row }">
@ -116,6 +124,28 @@ export default {
funData: [],
isEdit: false,
select_dist:{},
options:[
{
label:"字符串",
value:"1"
},
{
label:"日期范围选择",
value:"2"
},
{
label:"年月",
value:"3"
},
{
label:"年月日",
value:"4"
},
{
label:"年月日时间",
value:"5"
},
]
};
},
mounted() {
@ -151,6 +181,10 @@ export default {
this.submitShow = true;
this.isEdit = false
this.funData = [
{
color: "#ff0000",
text: "删除",
}
]
// 新增
if (type == "add") {

319
src/views/systemMaintenance/buttonManagement/configData.js
View File

@ -1,157 +1,174 @@
// 表头配置
const tableColumnJson = [
{
label: '按钮编号',
prop: 'code',
tooltip: true,
},
{
label: '按钮中文编码',
prop: 'nameEN',
tooltip: true,
},
{
label: '按钮英文编码',
prop: 'nameEN',
tooltip: true,
},
{
label: '按钮格式',
prop: 'style',
tooltip: true,
},
{
label: '按钮图标',
prop: 'icoName',
tooltip: true
},
{
label: '按钮方法',
prop: 'btnFunction',
tooltip: true
},
{
label: '按钮顺序',
prop: 'sort',
tooltip: true,
},
{
label: '备注',
prop: 'remark',
tooltip: true
},
{
label: '创建时间',
prop: 'createTime',
tooltip: true
},
// {
// label: '删除标识',
// prop: 'IsDelete',
// tooltip: true
// },
{
label: '按钮编号',
prop: 'code',
tooltip: true,
},
{
label: '按钮中文编码',
prop: 'nameCh',
tooltip: true,
},
{
label: '按钮英文编码',
prop: 'nameEn',
tooltip: true,
},
{
label: '按钮格式',
prop: 'styles',
tooltip: true,
},
{
label: '按钮图标',
prop: 'iconName',
tooltip: true
},
{
label: '按钮方法',
prop: 'btnFunction',
tooltip: true
},
{
label: '按钮顺序',
prop: 'sorts',
tooltip: true,
},
{
label: '备注',
prop: 'remark',
tooltip: true
},
{
label: '创建时间',
prop: 'createTime',
tooltip: true
},
// {
// label: '删除标识',
// prop: 'IsDelete',
// tooltip: true
// },
]
// 详情页面结构JSON
const formRow = [{
elCol: [{
label: '按钮编号',
prop: 'Code',
tag: 'elInput',
},
{
label: '中文名称',
prop: 'nameCN',
tag: 'elInput',
},
]
},
{
elCol: [{
label: '英文名称',
prop: 'nameEN',
tag: 'elInput'
},
{
label: '调用方法',
prop: 'btnFunction',
tag: 'elInput',
},
]
},
{
elCol: [{
label: '样式',
prop: 'style',
tag: 'elInput',
},
{
label: '图标',
prop: 'icoName',
tag: 'elInput',
},
]
},
{
elCol: [{
label: '顺序',
prop: 'sort',
tag: 'elInput',
}
]
},
{
elCol: [{
label: '备注',
prop: 'remark',
tag: 'elInput',
span:24,
type:'textarea'
}
]
},
]
const roleOptions = [{
label: '超级管理员',
value: 1
},
{
label: '业务员',
value: 2
},
{
label: '管理员',
value: 3
},
{
label: '开发成员',
value: 4
},
{
label: '项目经理',
value: 5
},
{
label: '实施人员',
value: 6
},
{
label: '财务',
value: 7
},
{
label: '总经理',
value: 8
},
{
label: '副总',
value: 9
}
]
const rules = {
};
const formRow = [
{
elCol: [
{
label: "按钮编号",
prop: "code",
tag: "elInput",
},
{
label: "中文名称",
prop: "nameCh",
tag: "elInput",
},
],
},
{
elCol: [
{
label: "英文名称",
prop: "nameEn",
tag: "elInput",
},
{
label: "调用方法",
prop: "btnFunction",
tag: "elInput",
},
],
},
{
elCol: [
{
label: "样式",
prop: "styles",
tag: "elInput",
},
{
label: "图标",
prop: "iconName",
tag: "elInput",
},
],
},
{
elCol: [
{
label: "顺序",
prop: "sorts",
tag: "elInput",
},
],
},
// {
// elCol: [
// {
// label: "接口名称",
// prop: "actionName",
// tag: "elInput",
// span: 24,
// type: "textarea",
// },
// ],
// },
{
elCol: [
{
label: "备注",
prop: "remark",
tag: "elInput",
span: 24,
type: "textarea",
},
],
},
];
const roleOptions = [
{
label: "超级管理员",
value: 1,
},
{
label: "业务员",
value: 2,
},
{
label: "管理员",
value: 3,
},
{
label: "开发成员",
value: 4,
},
{
label: "项目经理",
value: 5,
},
{
label: "实施人员",
value: 6,
},
{
label: "财务",
value: 7,
},
{
label: "总经理",
value: 8,
},
{
label: "副总",
value: 9,
},
];
const rules = {};
export default {
formRow,
rules,
tableColumnJson
}
formRow,
rules,
tableColumnJson,
};

504
src/views/systemMaintenance/buttonManagement/index.vue
View File

@ -1,263 +1,277 @@
<template>
<div>
<div flex style="height: 100%;">
<base-layout title="菜单树" style="width:260px;" :bottonShow="false" :isPage="false" :mainColor="mainColor"
ref="treeLayout" :operateButtonSwitch="false">
<div slot="main">
<base-tree ref="baseTree" @handleNodeClick="handleNodeClick" :menuData="menuData"></base-tree>
</div>
</base-layout>
<div style="flex:1;">
<!-- <div style="">
<p>标准按钮</p>
<div flex-wrap="cross:centet;height: 100px;overflow: auto;">
<el-button v-for="(item,index) in standardList" :type="item.type?item.type:'primary'"
size="small" style="margin-left: 5px;margin-bottom: 10px;" @click="funNewClick(item)"
:key="index">
{{item.menuName}}
</el-button>
</div>
</div> -->
<base-layout title="按钮权限" ref="buttonLayout" :isPage="true" @onFuncBtn="getFuncBtn"
@pageChange="pageChange">
<div slot="main" slot-scope="{ tableHeight }" style="height: 100%;">
<base-table ref="customtable" :border="true" :showIndex="false" :tabLoading.sync="tabLoading"
:tableHeight="tableHeight" :tableData="tableData" @radioChange="radioChange" :slotrow="true"
:tableColumn="tableColumn">
</base-table>
</div>
</base-layout>
</div>
</div>
<div>
<div flex style="height: 100%;">
<base-layout title="菜单树" style="width:260px;" :bottonShow="false" :isPage="false" :mainColor="mainColor"
ref="treeLayout" :operateButtonSwitch="false"
>
<div slot="main">
<base-tree ref="baseTree" @handleNodeClick="handleNodeClick" :menuData="menuData"></base-tree>
</div>
</base-layout>
<div style="flex:1;">
<!-- <div style="">
<p>标准按钮</p>
<div flex-wrap="cross:centet;height: 100px;overflow: auto;">
<el-button v-for="(item,index) in standardList" :type="item.type?item.type:'primary'"
size="small" style="margin-left: 5px;margin-bottom: 10px;" @click="funNewClick(item)"
:key="index">
{{item.menuName}}
</el-button>
</div>
</div> -->
<base-layout title="按钮权限" ref="buttonLayout" :isPage="true" @onFuncBtn="getFuncBtn"
@pageChange="pageChange"
>
<div slot="main" slot-scope="{ tableHeight }" style="height: 100%;">
<base-table ref="customtable" :border="true" :showIndex="false" :tabLoading.sync="tabLoading"
:tableHeight="tableHeight" :tableData="tableData" @radioChange="radioChange" :slotrow="true"
:tableColumn="tableColumn"
>
</base-table>
</div>
</base-layout>
</div>
</div>
<!-- 按钮权限弹窗 -->
<base-dialog :closeEscape="true" :showClose="true" :closeModal="false" :dialogVisible.sync="settingsDialog"
class="userDialog" title="按钮权限" width="700px" top="10vh">
<base-form ref="customForm" :formRow="formRow" :isFunBtn="isFunBtn" :formdata="formdata" @onSubmit="getSubmit">
</base-form>
</base-dialog>
</div>
<!-- 按钮权限弹窗 -->
<base-dialog :closeEscape="true" :showClose="true" :closeModal="false" :dialogVisible.sync="settingsDialog"
class="userDialog" title="按钮权限" width="700px" top="10vh"
>
<base-form ref="customForm" :formRow="formRow" :isFunBtn="isFunBtn" :formdata="formdata" @onSubmit="getSubmit">
</base-form>
</base-dialog>
</div>
</template>
<script>
import baseTable from "@/components/base/baseTable";
import baseLayout from "@/components/base/baseLayout";
import baseDialog from "@/components/base/BaseNewDialog/index.vue";
import baseTree from "@/components/base/BaseMenuTree/index.vue";
import baseForm from "@/components/base/baseNewForm/index.vue";
import configData from "./configData";
import baseTable from '@/components/base/baseTable'
import baseLayout from '@/components/base/baseLayout'
import baseDialog from '@/components/base/BaseNewDialog/index.vue'
import baseTree from '@/components/base/BaseMenuTree/index.vue'
import baseForm from '@/components/base/baseNewForm/index.vue'
import configData from './configData'
import {
GetMenuTree,
GetMenuTree
} from '@/api/apis/menuManage'
import {
buttonGetMenBillList,
buttonGetBillList,
buttonSaveData,
buttonDelData
buttonGetMenBillList,
buttonGetBillList,
buttonSaveData,
buttonDelData, buttonGetBillData
} from '@/api/apis/buttonList'
import { authApi } from '@/api/apis/auth'
export default {
name: "review",
components: {
baseLayout,
baseTable,
baseDialog,
baseTree,
baseForm
},
data() {
return {
radioIndex: false,
radioID: false,
mainColor: '#f8f8f8',
tabLoading: false,
standardList: [{
icon: 'el-icon-search',
menuName: '新增'
},],
tableData: [],
settingsDialog: false,
settingCenter: "left",
isFunBtn: true,
formRow: configData.formRow,
// buttonList: [{
// 'menuName': '新增',
// icon: 'el-icon-plus'
// },
// {
// 'menuName': '编辑',
// icon: 'el-icon-edit'
// },
// {
// 'menuName': '删除',
// icon: 'el-icon-delete',
// type: 'danger'
// },
// ],
btnEvenName: '',
menuData: [],
formdata: {},
pageModel: {
limit: 20,
menuId: '',
page: 1,
Sequence: "",
SequenceName: ""
}
}
},
computed: {
// 表头配置
tableColumn() {
return configData.tableColumnJson
},
},
mounted() {
this.initPage()
},
methods: {
initPage() {
this.getMenuData()
this.getTableData()
},
async getMenuData() {
let res = await GetMenuTree({})
if (res.code == 1) {
let arr = JSON.parse(res.data[0])
this.menuData = JSON.parse(res.data[0])
}
},
// 树状图点击事件
handleNodeClick(data) {
this.pageModel.menuId = data.id
this.pageModel.page = 1
this.RefreshTable()
},
// 刷新table
RefreshTable() {
this.radioID = false
this.radioIndex = false
this.$nextTick(() => {
this.$refs.buttonLayout.pageClear()
this.$refs.customtable.clearRadioIndex()
})
this.getTableData()
},
pageChange(model) {
this.pageModel.page = model.page
this.pageModel.limit = model.limit
this.getTableData()
},
// 单选
radioChange(val) {
this.radioIndex = val.index
this.radioID = val.id
},
getTableData() {
this.tabLoading = true
let params = {
...this.pageModel
}
this.tabLoading = true
this.tableData = []
buttonGetBillList(params).then(res => {
if (res.code == 1) {
this.tableData = res.data[1]
this.$nextTick(() => {
this.$refs.buttonLayout.setPageTotal(res.data[0])
})
}
this.tabLoading = false
})
this.tabLoading = false
},
btnadd() {
console.log("添加")
},
test() {
console.log("测试")
},
name: 'review',
components: {
baseLayout,
baseTable,
baseDialog,
baseTree,
baseForm
},
data() {
return {
radioIndex: false,
radioID: false,
mainColor: '#f8f8f8',
tabLoading: false,
standardList: [{
icon: 'el-icon-search',
menuName: '新增'
}],
tableData: [],
settingsDialog: false,
settingCenter: 'left',
isFunBtn: true,
formRow: configData.formRow,
// buttonList: [{
// 'menuName': '新增',
// icon: 'el-icon-plus'
// },
// {
// 'menuName': '编辑',
// icon: 'el-icon-edit'
// },
// {
// 'menuName': '删除',
// icon: 'el-icon-delete',
// type: 'danger'
// },
// ],
btnEvenName: '',
menuData: [],
formdata: {},
pageModel: {
pageSize: 20,
menuId: '',
pageNum: 1
}
}
},
computed: {
// 表头配置
tableColumn() {
return configData.tableColumnJson
}
},
mounted() {
this.initPage()
},
methods: {
initPage() {
this.getMenuData()
this.getTableData()
},
async getMenuData() {
let res = await authApi('sysMenuConfigService', '', 'queryEntityTree', '', { state: 0 })
if (res.status == 200) {
let arr = res.attribute[0]
this.menuData = res.attribute
}
},
// 树状图点击事件
handleNodeClick(data) {
this.pageModel.menuId = data.id
this.pageModel.pageNum = 1
this.RefreshTable()
},
// 刷新table
RefreshTable() {
this.radioID = false
this.radioIndex = false
this.$nextTick(() => {
this.$refs.buttonLayout.pageClear()
this.$refs.customtable.clearRadioIndex()
})
this.getTableData()
},
pageChange(model) {
this.pageModel.pageNum = model.page
this.pageModel.pageSize = model.limit
this.getTableData()
},
// 单选
radioChange(val) {
this.radioIndex = val.index
this.radioID = val.id
},
async getTableData() {
this.tabLoading = true
let params = {
...this.pageModel
}
this.tabLoading = true
this.tableData = []
const res = await authApi('sysButtonConfigService', '', 'queryEntityPage', '', params)
if (res.status == 200) {
this.tableData = res.attribute.list
this.$nextTick(() => {
this.$refs.buttonLayout.setPageTotal(res.attribute.total)
})
this.tabLoading = false
}
},
//详情
async buttonGetBillData(id) {
const res = await authApi('sysButtonConfigService', '', 'getEntity', '', { id })
if (res.status == 200) {
this.$nextTick(() => {
this.$refs.customForm.choiceAssignment(res.attribute)
})
}
this.tabLoading = false
}
,
btnadd() {
console.log('添加')
}
,
test() {
console.log('测试')
}
,
// 按钮点击事件
getFuncBtn(btnEven) {
this.btnEvenName = btnEven.menuName
// let ftnFunction = 'test'
// this[ftnFunction]()
if (btnEven.menuName == '新增') {
if (!this.pageModel.menuId) {
this.$vmNews('请选择菜单')
return
}
// this.$refs.customForm.resetForm()
this.settingsDialog = true
this.$nextTick(() => {
this.$refs.customForm.choiceAssignment({})
})
// 按钮点击事件
getFuncBtn(btnEven) {
this.btnEvenName = btnEven.menuName
// let ftnFunction = 'test'
// this[ftnFunction]()
if (btnEven.menuName == '新增') {
if (!this.pageModel.menuId) {
this.$vmNews('请选择菜单')
return
}
// this.$refs.customForm.resetForm()
this.settingsDialog = true
this.$nextTick(() => {
this.$refs.customForm.choiceAssignment({})
})
}
if (btnEven.menuName == "编辑") {
if (this.radioID === false) {
this.$vmNews('请选择一条数据')
return
}
this.settingsDialog = true
this.formdata = this.tableData[this.radioIndex]
this.$nextTick(() => {
this.$refs.customForm.choiceAssignment(this.tableData[this.radioIndex])
})
}
if (btnEven.menuName == '删除') {
if (this.radioID === false) {
this.$vmNews('请选择一条数据')
return
}
this.$confirm('确定删除吗？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
let params = {
id: this.radioID
}
buttonDelData(params).then(res => {
if (res.code == 1) {
this.$vmNews("删除成功", 'success')
this.pageModel.page = 1
this.RefreshTable()
}
})
}).catch(() => { });
}
if (btnEven.menuName == '编辑') {
if (this.radioID === false) {
this.$vmNews('请选择一条数据')
return
}
this.settingsDialog = true
this.buttonGetBillData(this.radioID)
}
if (btnEven.menuName == '删除') {
if (this.radioID === false) {
this.$vmNews('请选择一条数据')
return
}
this.$confirm('确定删除吗？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(async() => {
let params = {
id: this.radioID
}
const res = await authApi('sysButtonConfigService', '', 'deleteEntity', '', params)
}
if (res.status == 200) {
this.$vmNews('删除成功', 'success')
this.pageModel.pageNum = 1
this.RefreshTable()
}
}).catch(() => {
})
},
}
//表单提交
getSubmit(data) {
let params = {
...data
}
if (this.btnEvenName == '编辑') {
delete params.createTime
delete params.index
} else {
params.id = 0
params.MenuID = this.pageModel.menuId
}
buttonSaveData({
dataMain: params
}).then(res => {
if (res.code == 1) {
this.$vmNews("保存成功", 'success')
this.pageModel.page = 1
this.RefreshTable()
this.settingsDialog = false
}
})
},
funNewClick(item) {
// this.$emit('onFuncBtn', item);
},
},
}
,
//表单提交
async getSubmit(data) {
let params = {
...data
}
let res
if (this.btnEvenName == '编辑') {
delete params.createTime
delete params.index
res = await authApi('sysButtonConfigService', '', 'updateEntity', '', params)
} else {
params.menuId = this.pageModel.menuId
res = await authApi('sysButtonConfigService', '', 'saveEntity', '', params)
}
if (res.status == 200) {
this.$vmNews('保存成功', 'success')
this.pageModel.pageNum = 1
this.RefreshTable()
this.settingsDialog = false
}
}
,
funNewClick(item) {
// this.$emit('onFuncBtn', item);
}
}
}
</script>

311
src/views/systemMaintenance/menuManagement/configData.js
View File

@ -1,156 +1,173 @@
// 详情页面结构JSON
const formRow = [{
elCol: [{
label: '父节点',
prop: 'upIds',
tag: 'elTreeSelect',
options:[],
},
{
label: '等级',
prop: 'lvl',
disabled:true,
tag: 'elInputNumber',
},
]
},
{
elCol: [{
label: '菜单名称',
prop: 'title',
tag: 'elInput',
},
{
label: '菜单英文名称',
prop: 'name',
tag: 'elInput',
},
]
},
{
elCol: [{
label: '文件路径',
prop: 'component',
tag: 'elInput',
},
{
label: '菜单图标',
prop: 'icon',
tag: 'elInput',
},
]
},
{
elCol: [{
label: '页面路径',
prop: 'path',
tag: 'elInput',
},
{label: '菜单编码',
prop: 'code',
tag: 'elInput',
},
]
},
{
elCol: [
{
label: '打开方式',
prop: 'openType',
tag: 'elRadio',
options: [{
label: '菜单',
value: '1'
},{
label: '弹窗',
value: '2'
}
]
},
{
label: '菜单顺序',
prop: 'sorts',
tag: 'elInputNumber',
},
]
},
{
elCol: [{
label: '操作级别',
prop: 'level',
tag: 'elRadio',
options: [{
label: 'SuperAdmin',
value: '1'
},{
label: 'admin',
value: '2'
},{
label: 'user',
value: '3'
}
]
},
{
label: '显示',
prop: 'hidden',
tag: 'elRadio',
options: [{
label: '是',
value: 'false'
},{
label: '否',
value: 'true'
}
]
},
// {
// label: '操作权限',
// prop: 'telphone',
// tag: 'elRadio',
// options: [{
// label: '是',
// value: '1'
// },{
// label: '否',
// value: '2'
// }
// ]
// },
]
},
elCol: [{
label: '父节点',
prop: 'parentMenuName',
tag: 'elDialog',
span:24,
},
// {
// label: '菜单顺序',
// prop: 'mc_Sort',
// tag: 'elInput',
// rules:true
// // type:'number'
// },
]
},
{
elCol: [{
label: '菜单名称',
prop: 'menuName',
tag: 'elInput',
},
{
label: '菜单英文名称',
prop: 'menuEnglishName',
tag: 'elInput',
},
]
},
{
elCol: [{
label: '菜单路径',
prop: 'route',
tag: 'elInput',
},
{
label: '菜单图标',
prop: 'menuIcon',
tag: 'elInput',
},
]
},
{
elCol: [{
label: '页面路径',
prop: 'menuPage',
tag: 'elInput',
},
]
},
{
elCol: [
{
label: '打开方式',
prop: 'showType',
tag: 'elRadio',
options: [{
label: '菜单',
value: "1"
},{
label: '弹窗',
value: "2"
}
]
},
{
label: '显示',
prop: 'visibles',
tag: 'elRadio',
options: [{
label: '是',
value: "0"
},{
label: '否',
value: "1",
}
]
},
]
},
// {
// elCol: [{
// label: '功能权限',
// prop: 'birthday',
// tag: 'elRadio',
// options: [{
// label: '是',
// value: '1'
// },{
// label: '否',
// value: '2'
// }
// ]
// },
// {
// label: '操作权限',
// prop: 'telphone',
// tag: 'elRadio',
// options: [{
// label: '是',
// value: '1'
// },{
// label: '否',
// value: '2'
// }
// ]
// },
// ]
// },
]
const roleOptions = [{
label: '超级管理员',
value: 1
},
{
label: '业务员',
value: 2
},
{
label: '管理员',
value: 3
},
{
label: '开发成员',
value: 4
},
{
label: '项目经理',
value: 5
},
{
label: '实施人员',
value: 6
},
{
label: '财务',
value: 7
},
{
label: '总经理',
value: 8
},
{
label: '副总',
value: 9
}
]
const rules = {
title: [{
required: true,
message: '请输入名称',
trigger: 'change'
}],
component: [{
required: true,
message: '请输入文件路径',
trigger: 'change'
}],
path: [{
required: true,
message: '请输入路由路径',
trigger: 'change'
}],
code: [{
required: true,
message: '请输入编码',
trigger: 'change'
}],
openType: [{
required: true,
message: '请选择打开方式',
trigger: 'change'
}],
villageId: [{
required: true,
message: '请选择村/社区名称',
trigger: 'change'
}],
registerTime: [{
required: true,
message: '请选择登记时间',
trigger: 'change'
}],
};
// 详情显示图片配置
const showImgJson = {
span: 24,
text: '现场照片',
field: 'photoUrls',
};
export default {
formRow,
rules
showImgJson,
formRow,
rules
}

356
src/views/systemMaintenance/menuManagement/index.vue
View File

@ -3,81 +3,49 @@
* @date: 2022-09-09
-->
<template>
<div style="display: flex; height: 100%">
<base-layout
:showTitle="true"
:title="'菜单管理'"
style="width: 260px"
:queryShow="false"
:searchShow="false"
:mainHight="`calc(100% - 58px)`"
<div style="display: flex;height: 100%;">
<base-layout title="菜单管理" :operateButtonSwitch="false" style="width: 260px;">
<div slot="main" flex style="height:100%">
<div style="width: 100%;border-right:1px solid #dfe6ec;height:100%;overflow: auto;">
<base-tree ref="baseTree" :isCenter="false" :isSaveBtn="false" :Allshow="false" :expandAll="true"
:showCheckbox="false" :menuData="menuData" @handleNodeClick="formClick">
</base-tree>
</div>
>
<div
slot="main"
style="
width: 100%;
border-right: 1px solid #dfe6ec;
height: 100%;
overflow-y: auto;
"
>
<base-tree
ref="baseTree"
:isCenter="false"
:isSaveBtn="false"
:Allshow="false"
:expandAll="true"
:showCheckbox="false"
:menuData="menuData"
@handleNodeClick="formClick"
:treeProps="treeProps"
:treeBodyHeight="'100%'"
>
</base-tree>
</div>
</base-layout>
<base-layout
title="菜单树编辑区"
:buttonList="buttonList"
@onFuncBtn="getFuncBtn"
style="flex: 1; width: calc(100% - 260px)"
:queryShow="false"
:searchShow="false"
:mainHight="`calc(100% - 58px)`"
>
<div slot="main" style="padding: 20px 12px; height: 300px">
<base-form
ref="customForm"
:formRow="formRow"
:isFunBtn="isFunBtn"
:rules="rules"
@selectTree="selectTree"
@onSubmit="getSubmit"
>
<base-layout title="菜单树编辑区" :defaultButtonSwitch="false" :buttonList="buttonList" @onFuncBtn="getFuncBtn"
style="flex:1;">
<div slot="main" style="padding:0 12px;height:300px">
<base-form ref="customForm" :formRow="formRow" :isFunBtn="isFunBtn" @elDialogClick="elDialogClick"
:formdata="ruleForm" @onSubmit="getSubmit">
</base-form>
</div>
</base-layout>
<base-organization ref="baseOrganization" :menuData="menuData" @handleConfirmClick="handleConfirmClick">
</base-organization>
</div>
</template>
<script>
import router from "@/router";
import baseLayout from "@/components/base/baseLayout";
import baseForm from "@/components/base/baseNewForm/index.vue";
import baseTree from "@/components/base/BaseMenuTree/index.vue";
import baseTreeclick from "@/components/base/baseTreeClick/index.vue";
import baseDialog from "@/components/base/BaseNewDialog";
import baseOrganization from "@/components/base/baseOrganization";
import router from '@/router'
import baseLayout from "@/components/base/baseLayout"
import baseForm from "@/components/base/baseNewForm/index.vue"
import baseTree from "@/components/base/BaseMenuTree/index.vue"
import baseTreeclick from "@/components/base/baseTreeClick/index.vue"
import baseDialog from "@/components/base/BaseNewDialog"
import baseOrganization from "@/components/base/baseOrganization"
import configData from "./configData";
import { GetOrganTree } from "@/api/apis/organization";
import {
GetOrganTree,
} from '@/api/apis/organization'
import {
GetMenuTree,
GetBillData,
MenuSaveData,
MenuDelData,
} from "@/api/apis/menuManage";
import { authApi } from "@/api/apis/auth";
MenuDelData
} from '@/api/apis/menuManage'
import { authApi } from '@/api/apis/auth'
export default {
components: {
baseLayout,
@ -85,200 +53,168 @@ export default {
baseForm,
baseTreeclick,
baseDialog,
baseOrganization,
baseOrganization
},
data() {
return {
buttonList: [
// treeHight: '350',
dialogVisible: false,
dialogTitle: '选择上级菜单',
leftTitle: '菜单树',
rightTitle: '菜单及上级菜单',
mainColor: '#f8f8f8 ',
buttonList: [{
menuName: '新增根节点',
icon: 'el-icon-plus'
},
{
menuName: "新增根节点",
icon: "el-icon-plus",
menuName: '新增子节点',
icon: 'el-icon-plus'
},
{
menuName: "新增子节点",
icon: "el-icon-plus",
},
{
menuName: "删除节点",
icon: "el-icon-delete",
type: "danger",
menuName: '删除节点',
icon: 'el-icon-delete',
type: 'danger'
},
],
delId: null,
delId: '',
menuData: [],
menuForm: {},
rules: configData.rules,
ruleForm: {},
rules: {},
formRow: configData.formRow,
isFunBtn: true,
treeProps: {
children: "children",
label: "label",
},
menuForm: {},
};
}
},
mounted() {
// this.$refs.baseTree.getMenuList()
this.initPage();
this.initPage()
},
methods: {
//页面初始化
initPage() {
this.getMenuData();
this.$nextTick(() => {
this.resetForm();
});
},
resetForm() {
this.$refs.customForm.getField("lvl", 0);
this.$refs.customForm.getField("sorts", 0);
this.$refs.customForm.getField("hidden", "false");
this.$refs.customForm.getField("upIds", null);
// this.delId = ""
this.getMenuData()
},
// 获得树状图
async getMenuData() {
let res = await authApi("moduleService", "module", "queryTree");
this.menuData = res.attribute;
this.formRow[0].elCol[0].options = res.attribute;
let res = await authApi('sysMenuConfigService','','queryEntityTree','',{})
if (res.status == 200) {
let arr = res.attribute[0]
this.menuData = res.attribute
}
},
// 操作按钮事件
getFuncBtn(btnEven) {
if (btnEven.menuName == "新增根节点") {
if (!this.delId) {
this.$vmNews('请选择处理的信息')
return
}
if (btnEven.menuName == '新增根节点') {
let newRuleForm = {
parentMenuName: "",
parentMenuId: 0,
}
this.$nextTick(() => {
this.$refs.customForm.resetFields();
this.resetForm();
this.delId = null;
this.$refs.baseTree.setCurrentKey(null);
});
this.$refs.customForm.resetForm('ruleForm')
this.$refs.customForm.choiceAssignment(newRuleForm)
})
}
if (btnEven.menuName == "新增子节点") {
if (!this.delId) {
this.$tipConfirm("请选择左侧要操作的菜单节点");
return;
if (btnEven.menuName == '新增子节点') {
let newRuleForm = {
parentMenuName: this.ruleForm.menuName,
parentMenuId: this.ruleForm.id
}
if (this.menuForm.lvl == "2") {
this.$tipConfirm("最多允许添加三级菜单");
} else {
this.$nextTick(() => {
this.$refs.customForm.resetFields();
this.resetForm();
this.$refs.customForm.getField("upIds", this.delId);
this.$refs.customForm.getField(
"lvl",
JSON.parse(this.menuForm.lvl) + 1
);
this.delId = null;
console.log(newRuleForm,'newRuleForm')
this.$nextTick(() => {
this.$refs.customForm.resetForm('ruleForm')
this.$refs.customForm.choiceAssignment(newRuleForm)
})
}
if (btnEven.menuName == '删除节点') {
this.$confirm('确认删除该菜单吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.menuDel()
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
}
}
if (btnEven.menuName == "删除节点") {
if (!this.delId) {
this.$tipConfirm("请选择左侧要操作的菜单节点");
return;
}
this.$delConfirm().then(() => {
this.menuDel();
});
}
},
async menuDel() {
let params = {
id: this.delId,
};
let res = await authApi(
"moduleService",
"module",
"delectModuleTree",
"",
params
);
if (res.status == "200") {
this.$vmNews("删除成功", "success");
this.menuForm = {};
this.getMenuData();
this.$refs.customForm.resetFields();
this.changeMenu();
id: this.delId
}
let res = await authApi('sysMenuConfigService','','deleteEntity','',params)
if (res.status == 200) {
this.$vmNews('删除成功', 'success')
this.ruleForm = {}
this.getMenuData()
this.$refs.customForm.choiceAssignment({})
}
},
// 获取详情
async getDetail(id) {
let params = {
id: id,
};
let res = await authApi(
"moduleService",
"module",
"queryModule",
"",
params
);
this.$nextTick(() => {
this.$refs.customForm.choiceAssignment(res.attribute);
this.menuForm = res.attribute;
});
},
getSubmit(data) {
async function submitForm(delId) {
let params = {
...data,
label: data.title,
};
let res = await authApi(
"moduleService",
"module",
delId ? "updateModule" : "addModule",
"",
params
);
return res;
id: id
}
let res = await authApi('sysMenuConfigService','','getEntity','',params)
if (res.status == 200) {
console.log(res,'res')
this.ruleForm = res.attribute
this.$nextTick(() => {
this.$refs.customForm.choiceAssignment(res.attribute)
})
}
this.$refs.customForm.$refs["ruleForm"].validate((valid) => {
if (!valid) {
return;
} else {
submitForm(this.delId).then((res) => {
if (res.status == "200") {
this.$vmNews("保存成功", "success");
this.menuForm = {};
this.getMenuData();
this.$refs.customForm.resetFields();
this.changeMenu();
}
});
}
});
},
changeMenu() {
this.$store.dispatch("GenerateRoutes").then((accessRoutes) => {
// 根据roles权限生成可访问的路由表
for (let i = 0, length = accessRoutes.length; i < length; i += 1) {
const element = accessRoutes[i];
router.addRoutes(accessRoutes); // 动态添加可访问路由表
}
localStorage.setItem("routeList", JSON.stringify(accessRoutes));
});
async getSubmit(data) {
let params = {
...data
}
let res
if(params.id){
res = await authApi("sysMenuConfigService","","updateEntity","",params)
}else{
res = await authApi("sysMenuConfigService","","saveEntity","",params)
}
if (res.status == 200) {
this.$vmNews('保存成功', 'success')
this.ruleForm = {}
this.getMenuData()
this.$refs.customForm.choiceAssignment({})
this.$store.dispatch('GenerateRoutes').then(accessRoutes => {
// 根据roles权限生成可访问的路由表
for (let i = 0, length = accessRoutes.length; i < length; i += 1) {
const element = accessRoutes[i]
router.addRoutes(accessRoutes) // 动态添加可访问路由表
}
localStorage.setItem('routeList', JSON.stringify(accessRoutes))
})
}
},
//父节点点击事件
elDialogClick(row, index, indexRow) {
this.$refs.baseOrganization.dialogVisible = true
},
handleConfirmClick(val) {
console.log(val, "val");
this.ruleForm.parentMenuName = val.label
this.ruleForm.parentMenuId = val.id
this.$refs.customForm.incomingParameters(this.ruleForm)
this.$refs.baseOrganization.dialogVisible = false
},
formClick(data) {
this.delId = data.id;
this.getDetail(data.id);
},
selectTree(row) {
if (row.lvl == "2") {
// this.$refs.customForm.treeSelectClear()
this.$tipConfirm("最多允许添加三级菜单").then(() => {
this.$refs.customForm.getField("upIds", this.delId);
});
} else {
this.$refs.customForm.resetFields();
this.resetForm();
this.$refs.customForm.getField("lvl", JSON.parse(row.lvl) + 1);
this.menuForm = {};
}
this.delId = data.id
this.getDetail(data.id)
},
},
};
}
</script>
<style scoped>

172
src/views/systemSettings/jurisdictionManage/roleJurisdiction/buttonSetting.vue
View File

@ -1,98 +1,98 @@
<template>
<div >
<div flex="cross:center cross:baseline" flex-wrap v-for="(el,elIndex) in classifyButtonList"
class="buttonSetting">
<p style="width:100px;text-align: right;">{{el.label}}</p>
<div flex="cross:center" flex-wrap style="width: calc(100% - 200px);">
<p class="recordText" v-for="(item,index) in el.buttonList" @click="typeChange(item)" :key="index"
:class="{'active':item.type}">{{item.NameCN}}</p>
<p v-if="el.buttonList.length == 0" class="recordText">暂无按钮</p>
</div>
</div>
</div>
<div >
<div flex="cross:center cross:baseline" flex-wrap v-for="(el,elIndex) in classifyButtonList"
class="buttonSetting">
<p style="width:100px;text-align: right;">{{el.label}}</p>
<div flex="cross:center" flex-wrap style="width: calc(100% - 200px);">
<p class="recordText" v-for="(item,index) in el.buttonList" @click="typeChange(item)" :key="index"
:class="{'active':item.type}">{{item.NameCN}}</p>
<p v-if="el.buttonList.length == 0" class="recordText">暂无按钮</p>
</div>
</div>
</div>
</template>
<script>
import {
GetAllButton,
} from '@/api/apis/jurisdiction'
export default {
// props:{
// ButtonList: {
// type: Array,
// default: () => {
// return []
// }
// },
// }
data(){
return{
// ButtonList:[],
classifyButtonList: [],
buttonPopedom:[],
import {
GetAllButton,
} from '@/api/apis/jurisdiction'
export default {
// props:{
// ButtonList: {
// type: Array,
// default: () => {
// return []
// }
// },
// }
data(){
return{
// ButtonList:[],
classifyButtonList: [],
buttonPopedom:[],
}
},
methods:{
async GetAllButtonList(ids, checkdata) {
this.classifyButtonList = []
let params = {
menuIDs: ids.join(",")
}
let res = await GetAllButton(params)
if (res.code == 1) {
let allButtonList = res.data[0]
checkdata.forEach(el => {
el.buttonList = []
allButtonList.forEach(item => {
if (el.id == item.MenuID) {
el.buttonList.push(item)
}
})
})
this.classifyButtonList = checkdata
}
if(this.buttonPopedom.length > 0){
this.classifyButtonList.forEach(item=>{
item.buttonList.forEach(bItem=>{
this.buttonPopedom.forEach(el=>{
if(el == bItem.id){
bItem.type = true
}
})
})
})
}
},
typeChange(item) {
item.type = !item.type
this.$forceUpdate()
},
}
}
}
},
methods:{
async GetAllButtonList(ids, checkdata) {
this.classifyButtonList = []
let params = {
menuIDs: ids.join(",")
}
let res = await GetAllButton(params)
if (res.code == 1) {
let allButtonList = res.data[0]
checkdata.forEach(el => {
el.buttonList = []
allButtonList.forEach(item => {
if (el.id == item.MenuID) {
el.buttonList.push(item)
}
})
})
this.classifyButtonList = checkdata
}
if(this.buttonPopedom.length > 0){
this.classifyButtonList.forEach(item=>{
item.buttonList.forEach(bItem=>{
this.buttonPopedom.forEach(el=>{
if(el == bItem.id){
bItem.type = true
}
})
})
})
}
},
typeChange(item) {
item.type = !item.type
this.$forceUpdate()
},
}
}
</script>
<style lang="scss">
$activeColor: var(--bg-color, "#00aaff");
.buttonSetting{
margin-bottom: 5px;
.recordText {
border: 1px solid #fff;
width: 80px;
padding: 8px 0;
text-align: center;
font-size: 12px;
cursor: pointer;
background: #f2f2f2;
color: #e0e0e0;
margin:3px;
}
$activeColor: var(--bg-color, "#00aaff");
.buttonSetting{
margin-bottom: 5px;
.recordText {
border: 1px solid #fff;
width: 80px;
padding: 8px 0;
text-align: center;
font-size: 12px;
cursor: pointer;
background: #f2f2f2;
color: #e0e0e0;
margin:3px;
}
.recordText.active {
background: $activeColor;
color: #fff;
}
}
.recordText.active {
background: $activeColor;
color: #fff;
}
}
</style>

52
src/views/systemSettings/jurisdictionManage/roleJurisdiction/configData.js
View File

@ -4,41 +4,37 @@ const searchModelJson = [
]
// 页面操作按钮配置
const fucDataJson = [{
name: '导出',
type: 'danger',
icon: 'el-icon-position'
},
name: '导出',
type: 'danger',
icon: 'el-icon-position'
},
]
// 表头配置
const tableColumnJson = [
{
label: '角色编码',
prop: 'r_RoleCode',
tooltip: true,
// sortable:true
},
{
label: '角色名称',
prop: 'r_RoleName',
tooltip: true,
},
{
label: '顺序',
prop: 'r_Sort',
tooltip: true,
},
{
label: '角色描述',
prop: 'r_Description',
tooltip: true,
},
{
label: '角色编号',
prop: 'roleCode',
tooltip: true,
sortable: true,
},
{
label: '角色名称',
prop: 'roleName',
tooltip: true,
sortable: true,
},
{
label: '角色描述 ',
prop: 'description',
tooltip: true,
},
]
export default {
searchModelJson,
fucDataJson,
tableColumnJson,
searchModelJson,
fucDataJson,
tableColumnJson,
}

122
src/views/systemSettings/jurisdictionManage/roleJurisdiction/dataPermissions.vue Normal file
View File

@ -0,0 +1,122 @@
<template>
<div>
<el-table ref="multipleTable" :data="tableData" style="width: 100%" :show-header="false">
<el-table-column prop="billName" label="单据" width="120">
</el-table-column>
<el-table-column prop="dataList" label="字段">
<template slot-scope="scope">
<i
class="el-icon-star-on"
style="
height: 30px;
line-height: 30px;
font-size: 25px;
margin-right: 7px;
"
v-show="
scope.row.dataList.length != 0 &&
scope.row.dataList.length == scope.row.buttonList.length
"
@click="cancellation(scope.row)"
></i>
<i
class="el-icon-star-on"
style="
height: 30px;
line-height: 30px;
font-size: 25px;
margin-right: 7px;
color: #808080;
"
v-show="
scope.row.dataList.length != 0 &&
scope.row.dataList.length != scope.row.buttonList.length
"
@click="selectAllButton(scope.row)"
></i>
<el-checkbox-group v-model="scope.row.buttonList" size="small">
<el-checkbox
v-for="item in scope.row.dataList"
:label="item.id"
:key="item.id"
>{{ item.name }}</el-checkbox
>
</el-checkbox-group>
</template>
</el-table-column>
</el-table>
</div>
</template>
<script>
import { GetAllBilldata, GetAllBillDataPepedom } from "@/api/apis/jurisdiction";
export default {
data() {
return {
tableData: [],
selectedList: []
};
},
created() {
this.init();
},
components: {},
computed: {},
mounted() {},
beforeUpdate() {
this.handleTabClick()
},
methods: {
selectAllButton(item) {
let data = [];
item.dataList.forEach((el) => {
data.push(el.id);
});
item.buttonList = data;
},
cancellation(item) {
item.buttonList = [];
},
handleTabClick() {
this.$nextTick(() => {
this.$refs.multipleTable && this.$refs.multipleTable.doLayout()
})
},
async init() {
return
let data = [];
const res = await GetAllBilldata({});
if (res.code == 1) {
data = res.data[0];
data.forEach((el) => {
el.dataList = [];
el.buttonList = []
});
}
const item = await GetAllBillDataPepedom({});
if (item.code == 1) {
data.forEach((el) => {
item.data[0].forEach((e) => {
if (el.billKindID == e.billKindID) {
el.dataList.push(e);
}
})
this.selectedList.forEach(add => {
if (el.billKindID == add.dp_billKindID) {
el.buttonList = add.dp_popeList.split("\,")
}
})
});
}
this.tableData = data;
},
},
};
</script>
<style scoped lang="scss"></style>

185
src/views/systemSettings/jurisdictionManage/roleJurisdiction/dataSetting.vue
View File

@ -1,86 +1,87 @@
<template>
<div>
<div v-for="(item, index) in dataList" :key="index" class="dataSetting" flex>
<p style="width: 100px;text-align: right;">{{ item.billName }}</p>
<div flex flex-wrap style="margin-left: 10px;width: calc(100% - 150px);">
<p class="recordText" v-for="el in item.buttonList" :class="{ 'active': el.type }" @click="typeChange(el)">
{{ el.name }}</p>
</div>
</div>
</div>
<div>
<div v-for="(item, index) in dataList" :key="index" class="dataSetting" flex>
<p style="width: 100px;text-align: right;">{{ item.billName }}</p>
<div flex flex-wrap style="margin-left: 10px;width: calc(100% - 150px);">
<p class="recordText" v-for="el in item.buttonList" :class="{ 'active': el.type }" @click="typeChange(el)">
{{ el.name }}</p>
</div>
</div>
</div>
</template>
<script>
import {
GetAllBillDataPepedom,
GetAllBilldata
GetAllBillDataPepedom,
GetAllBilldata
} from '@/api/apis/jurisdiction.js'
export default {
name: "dataSetting",
data() {
return {
dataList: [],
dataPepedom: [],
dataSet: [],
activeList: [],
}
},
created() {
// this.inPage()
},
name: "dataSetting",
data() {
return {
dataList: [],
dataPepedom: [],
dataSet: [],
activeList: [],
}
},
created() {
// this.inPage()
},
methods: {
inPage() {
let dataPepedom = this.getDataPepedom()
let dataSet = this.getDataSet()
Promise.all([dataSet, dataPepedom]).then((value) => {
this.getDataList(value[0], value[1])
})
},
methods: {
inPage() {
let dataPepedom = this.getDataPepedom()
let dataSet = this.getDataSet()
Promise.all([dataSet, dataPepedom]).then((value) => {
this.getDataList(value[0], value[1])
})
},
async getDataPepedom() {
let res = await GetAllBillDataPepedom()
if (res.code == 1) {
return res.data[0]
}
},
async getDataSet() {
let res = await GetAllBilldata()
if (res.code == 1) {
res.data[0].forEach(el => {
el.buttonList = []
})
return res.data[0]
}
},
getDataList(dataSet, dataPepedom) {
this.dataList = []
let arr = []
dataSet.forEach((el, index) => {
dataPepedom.forEach((item) => {
if (el.billKindID == item.billKindID) {
el.buttonList.push(item)
}
})
})
this.dataList = dataSet
if (this.activeList.length > 0) {
this.dataList.forEach(item => {
item.buttonList.forEach(bItem => {
this.activeList.forEach(el => {
if (el == bItem.id) {
bItem.type = true
}
})
})
})
}
},
typeChange(item) {
item.type = !item.type
this.$forceUpdate()
},
}
async getDataPepedom() {
let res = await GetAllBillDataPepedom()
if (res.code == 1) {
return res.data[0]
}
},
async getDataSet() {
let res = await GetAllBilldata()
if (res.code == 1) {
res.data[0].forEach(el => {
el.buttonList = []
})
return res.data[0]
}
},
getDataList(dataSet, dataPepedom) {
console.log(dataSet, dataPepedom);
this.dataList = []
let arr = []
dataSet.forEach((el, index) => {
dataPepedom.forEach((item) => {
if (el.billKindID == item.billKindID) {
el.buttonList.push(item)
}
})
})
this.dataList = dataSet
if (this.activeList.length > 0) {
this.dataList.forEach(item => {
item.buttonList.forEach(bItem => {
this.activeList.forEach(el => {
if (el == bItem.id) {
bItem.type = true
}
})
})
})
}
},
typeChange(item) {
item.type = !item.type
this.$forceUpdate()
},
}
}
</script>
@ -88,28 +89,28 @@ export default {
$activeColor: var(--bg-color, "#00aaff");
.el-icon-star-on {
/* color: #00aa00; */
color: $activeColor;
/* color: #00aa00; */
color: $activeColor;
}
.dataSetting {
color: #000;
color: #000;
.recordText {
border: 1px solid #fff;
width: 80px;
padding: 8px 0;
text-align: center;
font-size: 12px;
cursor: pointer;
background: #f2f2f2;
color: #e0e0e0;
margin: 3px;
}
.recordText {
border: 1px solid #fff;
width: 80px;
padding: 8px 0;
text-align: center;
font-size: 12px;
cursor: pointer;
background: #f2f2f2;
color: #e0e0e0;
margin: 3px;
}
.recordText.active {
background: $activeColor;
color: #fff;
}
.recordText.active {
background: $activeColor;
color: #fff;
}
}
</style>

830
src/views/systemSettings/jurisdictionManage/roleJurisdiction/index.vue
View File

@ -1,44 +1,39 @@
<template>
<div>
<div style="display: flex;height: 100%;">
<!-- <base-layout title="组织机构" ref="organLayout" style="width: 20%;" :bottonShow="false" :isPage="false "
<div>
<div style="display: flex; height: 100%">
<!-- <base-layout title="组织机构" ref="organLayout" style="width: 20%;" :bottonShow="false" :isPage="false "
:mainColor="mainColor" :bodyHight="orangTreeHight">
<div slot="main">
<base-tree ref="baseTree" :isCenter="false" :isSaveBtn="false" :Allshow="false"
:showCheckbox="false" :menuData="orangData" @handleNodeClick="orangClick"></base-tree>
</div>
</base-layout> -->
<base-layout ref="userLayout" @pageChange="pageChange" :showTitle="false" :buttonList="buttonList"
:defaultButtonSwitch="false" @onFuncBtn="getFuncBtn" :isPage="true">
<div slot="main" slot-scope="{ tableHeight }" style="height: 100%;">
<base-table ref="userCustomtable" :border="true" :showIndex="false" :tabLoading.sync="tabLoading"
@radioChange="userRadioChange" :slotrow="true" :tableHeight="tableHeight" :tableData="tableData"
:tableColumn="tableColumn">
</base-table>
</div>
</base-layout>
</div>
<base-dialog :closeEscape="true" :showClose="true" :closeModal="false" :dialogVisible.sync="settingDialog"
class="userDialog" title="权限设置" width="50vw" top="5vh" :footerShow="true"
@handleConfirmClick="settingConfirmClick">
<base-layout :bodyHight="settingTreeHight" :showTitle="false" :operateButtonSwitch="false">
<div slot="main">
<el-tabs v-model="activeName" type="card" @tab-click="handleClick" :before-leave="beforeLeave">
<el-tab-pane label="菜单权限" name="jurisdictionSetting">
<jurisdiction-Setting ref="jurisdictionSetting" :menuData="menuData"></jurisdiction-Setting>
</el-tab-pane>
<el-tab-pane label="按钮权限" name="buttonSetting">
<button-setting ref="buttonSetting"></button-setting>
</el-tab-pane>
<el-tab-pane label="数据权限" name="dataSetting">
<data-setting ref="dataSetting"></data-setting>
</el-tab-pane>
</el-tabs>
</div>
</base-layout>
</base-dialog>
</div>
<base-layout ref="userLayout" @pageChange="pageChange" :showTitle="false" :buttonList="buttonList" :defaultButtonSwitch="false" @onFuncBtn="getFuncBtn" :isPage="true">
<div slot="main" slot-scope="{ tableHeight }" style="height: 100%">
<base-table ref="userCustomtable" :border="true" :showIndex="false" :tabLoading.sync="tabLoading" @radioChange="userRadioChange" :slotrow="true" :tableHeight="tableHeight" :tableData="tableData" :tableColumn="tableColumn">
</base-table>
</div>
</base-layout>
</div>
<base-dialog :closeEscape="true" :showClose="true" :closeModal="false" :dialogVisible.sync="settingDialog" class="userDialog" title="权限设置" width="50vw" top="5vh" :footerShow="true" @handleConfirmClick="settingConfirmClick">
<base-layout :bodyHight="settingTreeHight" :showTitle="false" :operateButtonSwitch="false">
<div slot="main">
<el-tabs v-model="activeName" type="card" @tab-click="handleClick" :before-leave="beforeLeave">
<el-tab-pane label="菜单权限" name="jurisdictionSetting">
<jurisdiction-Setting ref="jurisdictionSetting" :menuData="menuData"></jurisdiction-Setting>
</el-tab-pane>
<el-tab-pane label="按钮权限" name="buttonSetting">
<button-setting ref="buttonSetting"></button-setting>
</el-tab-pane>
<el-tab-pane label="数据权限" name="dataSetting">
<data-setting ref="dataSetting"></data-setting>
</el-tab-pane>
</el-tabs>
</div>
</base-layout>
</base-dialog>
<right-dialog ref="rightDialog" :menuData="menuData" v-if="permissionPopup"></right-dialog>
</div>
</template>
<script>
@ -49,397 +44,424 @@ import baseForm from "@/components/base/baseNewForm/index.vue";
import baseTree from "@/components/base/BaseMenuTree/index.vue";
import jurisdictionSetting from "./jurisdictionSetting.vue";
import buttonSetting from "./buttonSetting.vue";
import dataSetting from "./dataSetting.vue"
import dataSetting from "./dataSetting.vue";
import configData from "./configData";
import { getCompanyId } from '@/utils/auth'
import rightDialog from "./rightDialog";
import { getCompanyId } from "@/utils/auth";
import { GetMenuTree } from "@/api/apis/menuManage";
import { RoleGetBillList } from "@/api/apis/roleManagement";
import { GetOrganTree } from "@/api/apis/organization";
import {
GetMenuTree,
} from '@/api/apis/menuManage'
import {
RoleGetBillList,
} from '@/api/apis/roleManagement'
import {
GetOrganTree,
} from '@/api/apis/organization'
import {
GetPppedomSet,
GetAllButton,
GetAllBillDataPepedom,
GetAllBilldata,
PopedomSaveData
} from '@/api/apis/jurisdiction'
GetPppedomSet,
GetMenuButton,
GetAllButton,
GetAllBillDataPepedom,
GetAllBilldata,
PopedomSaveData,
} from "@/api/apis/jurisdiction";
import { authApi } from '@/api/apis/auth'
export default {
name: "review",
components: {
buttonSetting,
dataSetting,
baseLayout,
baseTable,
baseDialog,
baseForm,
baseTree,
jurisdictionSetting
},
data() {
return {
activeName: 'jurisdictionSetting',
settingTreeHight: '500px',
radioIndex: false,
userRadioId: false,
settingDialog: false,
// orangTreeHight: 'calc(100vh - 119px)',
// tableHeight: 'calc(100vh - 189px)',
mainColor: '#f8f8f8',
tabLoading: false,
tableData: [],
// 搜索配置
menuData: [],
orangData: [],
buttonList: [{
'icon': 'el-icon-plus',
'menuName': '权限设置',
btnFunciton: 'setting'
},],
pageModel: {
page: 1,
limit: 20,
departmentID: '',
Sequence: '',
SequenceName: ''
},
defaultProps: {
children: 'children',
label: 'label'
},
buttonArray: [],
allButtonList: [],
menuIDs: [],
menuList: [],
menuPopedom: []
}
},
computed: {
// 表头配置
tableColumn() {
return configData.tableColumnJson
},
},
watch: {
settingDialog: {
deep: true,
handler(newValue, oldValue) {
if (newValue == false) {
this.$refs.dataSetting.dataList = []
this.$refs.jurisdictionSetting.$refs.menuTree.$refs.elTree.setCheckedKeys([])
// this.$refs.elTree.getCheckedKeys()
// this.$refs.jurisdictionSetting.$refs.menuTree.checkChange([])
this.$refs.buttonSetting.classifyButtonList = []
}
}
}
},
created() { },
onShow() { },
mounted() {
this.initPage()
},
filters: {
name: "review",
components: {
buttonSetting,
dataSetting,
baseLayout,
baseTable,
baseDialog,
baseForm,
baseTree,
jurisdictionSetting,
rightDialog,
},
data() {
return {
activeName: "jurisdictionSetting",
settingTreeHight: "500px",
radioIndex: false,
userRadioId: false,
settingDialog: false,
// orangTreeHight: 'calc(100vh - 119px)',
// tableHeight: 'calc(100vh - 189px)',
mainColor: "#f8f8f8",
tabLoading: false,
tableData: [],
// 搜索配置
menuData: [],
orangData: [],
buttonList: [
{
icon: "el-icon-plus",
menuName: "权限设置",
btnFunciton: "setting",
},
],
pageModel: {
pageNum: 1,
pageSize: 20,
departmentID: "",
Sequence: "",
SequenceName: "",
},
defaultProps: {
children: "children",
label: "label",
},
buttonArray: [],
allButtonList: [],
menuIDs: [],
menuList: [],
menuPopedom: [],
permissionPopup: false,
};
},
computed: {
// 表头配置
tableColumn() {
return configData.tableColumnJson;
},
},
watch: {
settingDialog: {
deep: true,
handler(newValue, oldValue) {
if (newValue == false) {
this.$refs.dataSetting.dataList = [];
this.$refs.jurisdictionSetting.$refs.menuTree.$refs.elTree.setCheckedKeys(
[]
);
// this.$refs.elTree.getCheckedKeys()
// this.$refs.jurisdictionSetting.$refs.menuTree.checkChange([])
this.$refs.buttonSetting.classifyButtonList = [];
}
},
},
},
created() { },
onShow() { },
mounted() {
this.initPage();
// this.getMenuData();
},
filters: {},
methods: {
beforeLeave(activeName, oldActiveName) {
if (
oldActiveName == "jurisdictionSetting" &&
activeName == "buttonSetting"
) {
this.menuPopedom = this.$refs.jurisdictionSetting.menuPopedom;
if (this.menuPopedom.length == 0) {
this.$vmNews("请选择菜单");
return false;
}
}
if (oldActiveName == "dataSetting" && activeName == "buttonSetting") {
return false;
}
},
// 切换tab
handleClick(tab, event) {
if (this.activeName == "buttonSetting") {
let checkdata = this.$refs.jurisdictionSetting.checkdata;
this.$refs.buttonSetting.GetAllButtonList(this.menuPopedom, checkdata);
}
if (this.activeName == "dataSetting") {
this.$refs.dataSetting.inPage();
}
},
// 获取菜单选中
getMenuIDs(menuData) {
menuData.forEach((el) => {
if (el.type) {
this.menuList.push(el);
this.menuIDs.push(el.id);
}
if (el.children != null && el.children && el.children.length) {
this.getMenuIDs(el.children);
}
});
},
// 初始化页面
initPage() {
this.getTableList();
// this.getOrganList();
this.$refs.userCustomtable.clearRadioIndex();
},
//获取菜单树
async getMenuData() {
// let res = await GetMenuButton({});
let res = await authApi('sysMenuConfigService', '', 'queryEntityTree', '', { state: 0 })
if (res.status == 200) {
let arr = res.attribute
this.menuData = res.attribute
this.changeMenu(this.menuData, 0)
// this.getButtonArray(this.menuData)
}
},
// 菜单树添加参数
changeMenu(data, num) {
let level = num;
level = level + 1;
data.forEach((el) => {
el.buttonList = [];
el.type = false;
// el.level = level
if (el.children != null && el.children && el.children.length) {
this.changeMenu(el.children, level);
}
});
},
// 获取用户信息列表
async getTableList() {
this.tabLoading = true;
this.tableData = [];
let params = {
...this.pageModel,
};
const res = await authApi("sysRoleService","","queryEntityPage","",params)
if (res.status == 200) {
console.log(res,'res')
this.tableData = res.attribute.list;
this.$nextTick(() => {
// this.$refs.customtable.clearRadioIndex()
},
methods: {
beforeLeave(activeName, oldActiveName) {
if (oldActiveName == 'jurisdictionSetting' && activeName == "buttonSetting") {
this.menuPopedom = this.$refs.jurisdictionSetting.menuPopedom
if (this.menuPopedom.length == 0) {
this.$vmNews("请选择菜单")
return false
}
}
if (oldActiveName == 'dataSetting' && activeName == "buttonSetting") {
return false
}
},
// 切换tab
handleClick(tab, event) {
if (this.activeName == 'buttonSetting') {
let checkdata = this.$refs.jurisdictionSetting.checkdata
this.$refs.buttonSetting.GetAllButtonList(this.menuPopedom, checkdata)
}
if (this.activeName == 'dataSetting') {
this.$refs.dataSetting.inPage()
}
},
// 获取菜单选中
getMenuIDs(menuData) {
menuData.forEach(el => {
if (el.type) {
this.menuList.push(el)
this.menuIDs.push(el.id)
}
if (el.children != null && el.children && el.children.length) {
this.getMenuIDs(el.children)
}
})
},
// 初始化页面
initPage() {
this.getTableList()
this.getOrganList()
this.$refs.userLayout.setPageTotal(res.attribute.total);
});
this.tabLoading = false;
}
},
this.$refs.userCustomtable.clearRadioIndex()
},
//获取菜单树
async getMenuData() {
let res = await GetMenuTree({})
if (res.code == 1) {
let arr = JSON.parse(res.data[0])
this.menuData = JSON.parse(res.data[0])
this.changeMenu(this.menuData, 0)
// this.getButtonArray(this.menuData)
}
},
// 菜单树添加参数
changeMenu(data, num) {
let level = num
level = level + 1
data.forEach(el => {
el.buttonList = []
el.type = false
// el.level = level
if (el.children != null && el.children && el.children.length) {
this.changeMenu(el.children, level)
}
})
},
// 获取用户信息列表
async getTableList() {
this.tabLoading = true
this.tableData = []
let params = {
...this.pageModel
}
let res = await RoleGetBillList(params)
if (res.code === 1) {
this.tableData = res.data[1]
this.$nextTick(() => {
this.$refs.customtable.clearRadioIndex()
getButtonArray(menuData) {
menuData.forEach((el, index) => {
this.allButtonList.forEach((item) => {
if (el.id == item.MenuID) {
item.active = false;
el.buttonList.push(item);
}
});
if (el.children != null && el.children && el.children.length) {
this.getButtonArray(el.children);
}
});
},
// 单选
userRadioChange(val) {
this.radioIndex = val.index;
this.userRadioId = val.id;
},
// 获取组织列表
async getOrganList() {
let params = {
// CompanyID: "43"
CompanyID: this.$store.state.user.companyID
? this.$store.state.user.companyID
: getCompanyId(),
};
let res = await GetOrganTree(params);
this.orangData = JSON.parse(res.data[0]);
},
this.$refs.userLayout.setPageTotal(res.data[0])
})
this.tabLoading = false
}
},
// 树状图点击
orangClick(data) {
this.pageModel.departmentID = data.id;
this.resetTable();
// this.result()
},
getButtonArray(menuData) {
menuData.forEach((el, index) => {
this.allButtonList.forEach(item => {
if (el.id == item.MenuID) {
item.active = false
el.buttonList.push(item)
}
})
if (el.children != null && el.children && el.children.length) {
this.getButtonArray(el.children)
}
})
},
// 单选
userRadioChange(val) {
this.radioIndex = val.index
this.userRadioId = val.r_RoleID
},
// 获取组织列表
async getOrganList() {
let params = {
// CompanyID: "43"
CompanyID: this.$store.state.user.companyID ? this.$store.state.user.companyID : getCompanyId()
}
let res = await GetOrganTree(params)
this.orangData = JSON.parse(res.data[0])
},
// 树状图点击
orangClick(data) {
this.pageModel.departmentID = data.id
this.resetTable()
// this.result()
},
resetTable() {
this.pageModel.page = 1
this.userRadioId = false
this.radioIndex = false
this.$nextTick(() => {
this.$refs.userCustomtable.clearRadioIndex()
this.$refs.userLayout.pageClear()
})
this.getTableList()
},
// 操作按钮事件
getFuncBtn(btnEven) {
if (this.radioIndex === false) {
this.$vmNews("请选择一条数据")
return
}
this[btnEven.btnFunciton]()
},
setting() {
resetTable() {
this.pageModel.pageNum = 1;
this.userRadioId = false;
this.radioIndex = false;
this.$nextTick(() => {
this.$refs.userCustomtable.clearRadioIndex();
this.$refs.userLayout.pageClear();
});
this.getTableList();
},
// 操作按钮事件
getFuncBtn(btnEven) {
if (this.radioIndex === false) {
this.$vmNews("请选择一条数据");
return;
}
this[btnEven.btnFunciton]();
},
//点击权限设置
async setting() {
this.getMenuData()
if (this.radioIndex === false) {
this.$vmNews("请选择一条数据")
return
}
this.settingDialog = true
this.activeName = "jurisdictionSetting"
this.GetPppedomData()
},
async GetPppedomData() {
let params = {
objectID: this.userRadioId,
kindid: 2
}
let res = await GetPppedomSet(params)
if (res.code == 1) {
const data = res.data
let menuIDs = data[0].length > 0 ? data[0][0].fp_MenuIdList.split(',') : []
this.$refs.jurisdictionSetting.$refs.menuTree.selectData = menuIDs
this.$refs.jurisdictionSetting.$refs.menuTree.checkChange(menuIDs)
let buttonPopedom = this.getbuttonPopedomList(res.data[1])
this.$refs.buttonSetting.buttonPopedom = buttonPopedom
let activeList = this.getActiveList(res.data[2])
this.$refs.dataSetting.activeList = activeList
// selectData
}
},
getActiveList(data) {
let array = []
data.forEach(el => {
el.dp_popeList.split(',').forEach(item => {
array.push(item)
})
})
return array
},
getbuttonPopedomList(data) {
let array = []
data.forEach(el => {
el.op_OperateKindList.split(',').forEach(item => {
array.push(item)
})
})
return array
},
pageChange(model) {
this.pageModel.page = model.page
this.pageModel.limit = model.limit
this.getTableList()
},
settingConfirmClick() {
let menuPopedom = this.$refs.jurisdictionSetting.menuPopedom.join(",")
let buttonPopedom = this.getButtonPopedom(this.$refs.buttonSetting.classifyButtonList)
let dataPopedom = this.getDataPopedom(this.$refs.dataSetting.dataList)
let params = {
kindid: 2,
objectID: this.userRadioId,
menuPopedom: menuPopedom,
buttonPopedom: buttonPopedom,
dataPopedom: dataPopedom,
}
this.saveData(params)
},
async saveData(params) {
let res = await PopedomSaveData(params)
if (res.code == 1) {
this.$vmNews("保存成功", 'success')
this.activeName = "jurisdictionSetting"
this.settingDialog = false
}
},
getDataPopedom(dataPopedom) {
let array = []
dataPopedom.forEach(el => {
el.dp_popeList = []
el.buttonList.forEach(item => {
if (item.type) {
el.dp_popeList.push(item.id)
}
})
})
dataPopedom.forEach(el => {
if (el.dp_popeList.length > 0) {
let params = {
dp_billKindID: el.billKindID,
dp_popeList: el.dp_popeList.join(',')
}
array.push(params)
}
})
return array
},
getButtonPopedom(buttonPopedom) {
let array = []
// let op_OperateKindList = []
buttonPopedom.forEach(el => {
el.op_MenuID = el.id
el.op_OperateKindList = []
el.buttonList.forEach(item => {
if (item.type) {
el.op_OperateKindList.push(item.id)
}
})
})
buttonPopedom.forEach(el => {
if (el.op_OperateKindList.length > 0) {
let params = {
op_MenuID: el.op_MenuID,
op_OperateKindList: el.op_OperateKindList.join(',')
}
array.push(params)
}
})
return array
},
},
}
this.permissionPopup = true
this.$nextTick(async() => {
this.$refs.rightDialog.drawer = true
this.$refs.rightDialog.buttonLoading = true
let params = {
id: this.userRadioId,
kindId: 2
}
const res = await authApi('sysUserService', '', 'jurisdiction', '',params)
if (res.status == 200) {
const data = res.attribute
this.$refs.rightDialog.exhibitList(res.attribute.menvVoList,res.attribute.homeList,this.userRadioId)
}
})
},
// setting() {
// if (this.radioIndex === false) {
// this.$vmNews("请选择一条数据")
// return
// }
// this.settingDialog = true
// this.activeName = "jurisdictionSetting"
// this.GetPppedomData()
// },
async GetPppedomData() {
let params = {
objectID: this.userRadioId,
kindId: 2,
};
let res = await GetPppedomSet(params);
if (res.code == 1) {
const data = res.data;
let menuIDs =
data[0].length > 0 ? data[0][0].fp_MenuIdList.split(",") : [];
this.$refs.jurisdictionSetting.$refs.menuTree.selectData = menuIDs;
this.$refs.jurisdictionSetting.$refs.menuTree.checkChange(menuIDs);
let buttonPopedom = this.getbuttonPopedomList(res.data[1]);
this.$refs.buttonSetting.buttonPopedom = buttonPopedom;
let activeList = this.getActiveList(res.data[2]);
this.$refs.dataSetting.activeList = activeList;
// selectData
}
},
getActiveList(data) {
let array = [];
data.forEach((el) => {
el.dp_popeList.split(",").forEach((item) => {
array.push(item);
});
});
return array;
},
getbuttonPopedomList(data) {
let array = [];
data.forEach((el) => {
el.op_OperateKindList.split(",").forEach((item) => {
array.push(item);
});
});
return array;
},
pageChange(model) {
this.pageModel.pageNum = model.page;
this.pageModel.pageSize = model.limit;
this.getTableList();
},
settingConfirmClick() {
let menuPopedom = this.$refs.jurisdictionSetting.menuPopedom.join(",");
let buttonPopedom = this.getButtonPopedom(
this.$refs.buttonSetting.classifyButtonList
);
let dataPopedom = this.getDataPopedom(this.$refs.dataSetting.dataList);
let params = {
kindid: 2,
objectID: this.userRadioId,
menuPopedom: menuPopedom,
buttonPopedom: buttonPopedom,
dataPopedom: dataPopedom,
};
this.saveData(params);
},
async saveData(params) {
let res = await PopedomSaveData(params);
if (res.code == 1) {
this.$vmNews("保存成功", "success");
this.activeName = "jurisdictionSetting";
this.settingDialog = false;
}
},
getDataPopedom(dataPopedom) {
let array = [];
dataPopedom.forEach((el) => {
el.dp_popeList = [];
el.buttonList.forEach((item) => {
if (item.type) {
el.dp_popeList.push(item.id);
}
});
});
dataPopedom.forEach((el) => {
if (el.dp_popeList.length > 0) {
let params = {
dp_billKindID: el.billKindID,
dp_popeList: el.dp_popeList.join(","),
};
array.push(params);
}
});
return array;
},
getButtonPopedom(buttonPopedom) {
let array = [];
// let op_OperateKindList = []
buttonPopedom.forEach((el) => {
el.op_MenuID = el.id;
el.op_OperateKindList = [];
el.buttonList.forEach((item) => {
if (item.type) {
el.op_OperateKindList.push(item.id);
}
});
});
buttonPopedom.forEach((el) => {
if (el.op_OperateKindList.length > 0) {
let params = {
op_MenuID: el.op_MenuID,
op_OperateKindList: el.op_OperateKindList.join(","),
};
array.push(params);
}
});
return array;
},
},
};
</script>
<style scoped>
>>>.el-dialog__body {
padding: 0 25px;
<style scoped lang='scss'>
>>> .el-dialog__body {
padding: 0 25px;
}
</style>
<style scoped lang='scss'>
.roleName {
padding: 10px 0;
width: 90px;
border: 2px solid #f2f2f2;
background-color: #f2f2f2;
margin: 0px 10px 10px 0px;
text-align: center;
cursor: pointer;
box-shadow: 0 0 0 2px #f2f2f2;
border-radius: 5px;
padding: 10px 0;
width: 90px;
border: 2px solid #f2f2f2;
background-color: #f2f2f2;
margin: 0px 10px 10px 0px;
text-align: center;
cursor: pointer;
box-shadow: 0 0 0 2px #f2f2f2;
border-radius: 5px;
}
.active {
background-color: #00a490;
border: 2px solid #ffffff;
color: white;
box-shadow: 0 0 0 2px #00a490;
background-color: #00a490;
border: 2px solid #ffffff;
color: white;
box-shadow: 0 0 0 2px #00a490;
}
.bigTitle {
padding-bottom: 10px;
margin: 10px 0;
font-size: 16px;
font-weight: bold;
border-bottom: 1px solid #ccc;
padding-bottom: 10px;
margin: 10px 0;
font-size: 16px;
font-weight: bold;
border-bottom: 1px solid #ccc;
}
.organizationBody {
display: flex;
justify-content: space-evenly;
background-color: #f2f3f4;
padding: 10px
display: flex;
justify-content: space-evenly;
background-color: #f2f3f4;
padding: 10px;
}
</style>

162
src/views/systemSettings/jurisdictionManage/roleJurisdiction/jurisdictionSetting.vue
View File

@ -1,13 +1,13 @@
<template>
<div flex>
<base-layout title="菜单权限" ref="layout" :bodyHight="treeHight" :mainHight="mainHight" :operateButtonSwitch="false">
<div slot="main">
<base-tree ref="menuTree" :isCenter="false" :showCheckbox="true" :menuData="menuData" :setting="true"
@checkChange="checkChange">
</base-tree>
</div>
</base-layout>
</div>
<div flex>
<base-layout title="菜单权限" ref="layout" :bodyHight="treeHight" :mainHight="mainHight" :operateButtonSwitch="false">
<div slot="main">
<base-tree ref="menuTree" :isCenter="false" :showCheckbox="true" :menuData="menuData" :setting="true"
@checkChange="checkChange">
</base-tree>
</div>
</base-layout>
</div>
</template>
<script>
@ -16,101 +16,101 @@ import baseTable from "@/components/base/baseTable";
import baseTree from "@/components/base/BaseMenuTree/index.vue";
import configData from "./configData";
import {
GetPppedomSet,
GetAllButton,
GetPppedomSet,
GetAllButton,
} from '@/api/apis/jurisdiction'
export default {
name: "jurisdictionSetting",
components: {
baseLayout,
baseTable,
baseTree
},
props: {
objectID: {
type: [Number, String, Boolean],
default: false
},
menuData: {
type: Array,
default: []
},
name: "jurisdictionSetting",
components: {
baseLayout,
baseTable,
baseTree
},
props: {
objectID: {
type: [Number, String, Boolean],
default: false
},
menuData: {
type: Array,
default: []
},
},
data() {
return {
treeHight: '444px',
mainHight: 'calc(100% - 80px)',
classifyButtonList: [],
buttonArray: [],
colorsKey: false,
menuPopedom: [],
buttonPopedom: []
}
},
computed: {
},
data() {
return {
treeHight: '444px',
mainHight: 'calc(100% - 80px)',
classifyButtonList: [],
buttonArray: [],
colorsKey: false,
menuPopedom: [],
buttonPopedom: []
}
},
computed: {
},
watch: {
},
watch: {
},
created() {
},
created() {
},
onShow() { },
mounted() {
this.initPage()
},
filters: {
},
onShow() { },
mounted() {
this.initPage()
},
filters: {
},
methods: {
// 初始化页面
initPage() {
},
checkChange(ids, checkdata) {
this.menuPopedom = ids
this.checkdata = checkdata
},
},
methods: {
// 初始化页面
initPage() {
},
checkChange(ids, checkdata) {
this.menuPopedom = ids
this.checkdata = checkdata
},
typeChange(item) {
item.type = !item.type
this.$forceUpdate()
},
typeChange(item) {
item.type = !item.type
this.$forceUpdate()
},
},
},
}
</script>
<style scoped lang='scss'>
.buttonSetting {
margin: 10px 0;
margin: 10px 0;
}
</style>
<style lang="scss">
$activeColor: var(--bg-color, "#00aaff");
.el-icon-star-on {
/* color: #00aa00; */
color: $activeColor;
/* color: #00aa00; */
color: $activeColor;
}
.buttonSetting {
.recordText {
border: 1px solid #fff;
width: 100px;
padding: 10px 0;
text-align: center;
font-size: 12px;
cursor: pointer;
background: #f2f2f2;
color: #e0e0e0;
margin: 0px 3px;
}
.recordText {
border: 1px solid #fff;
width: 100px;
padding: 10px 0;
text-align: center;
font-size: 12px;
cursor: pointer;
background: #f2f2f2;
color: #e0e0e0;
margin: 0px 3px;
}
.recordText.active {
background: $activeColor;
color: #fff;
}
.recordText.active {
background: $activeColor;
color: #fff;
}
}
</style>

121
src/views/systemSettings/jurisdictionManage/roleJurisdiction/layOutPermissions.vue Normal file
View File

@ -0,0 +1,121 @@
<template>
<div>
<el-table
ref="multipleTable"
:data="tableData"
style="width: 100%"
:show-header="false"
>
<el-table-column prop="billName" label="模块" width="120">
</el-table-column>
<el-table-column prop="dataList" label="字段">
<template slot-scope="scope">
<i
class="el-icon-star-on"
style="
height: 30px;
line-height: 30px;
font-size: 25px;
margin-right: 7px;
"
v-show="btnShowHandle(homeList,true)"
@click="cancellation(homeList)"
></i>
<i
class="el-icon-star-on"
style="
height: 30px;
line-height: 30px;
font-size: 25px;
margin-right: 7px;
color: #808080;
"
v-show="btnShowHandle(homeList,false)"
@click="selectAllButton(homeList)"
></i>
<el-checkbox v-model="item.check" v-for="item in homeList">{{ item.name }}</el-checkbox>
</template>
</el-table-column>
</el-table>
</div>
</template>
<script>
import config from '@/views/doraChunk/config/indexChunkConfig.js'
import { mapMutations } from 'vuex'
export default {
data() {
return {
tableData: [
{
billName: '首页拖拽模块',
dataList: config.config.map((item) => {
let obj = {
id: item.componentName,
name: item.name
}
return obj
}),
buttonList: []
}
],
selectedList: '',
homeList: []
}
},
created() {
},
components: {},
computed: {},
mounted() {
},
beforeUpdate() {
this.handleTabClick()
},
methods: {
//判断全选是否显示
btnShowHandle(list, flag = false) {
if (!list.length) return false
let flagResult = list.every(item => {
return item.check
})
if (flag) {
return flagResult
} else {
return !flagResult
}
},
selectAllButton(item) {
console.log(item)
item.forEach(item => {
item.check = true
})
},
cancellation(item) {
item.forEach(item => {
item.check = false
})
},
handleTabClick() {
this.$nextTick(() => {
this.$refs.multipleTable && this.$refs.multipleTable.doLayout()
})
}
},
watch: {
selectedList(newV, oldV) {
let tempArr = newV.split(',')
this.tableData[0].buttonList = tempArr
}
}
}
</script>
<style scoped lang="scss"></style>

392
src/views/systemSettings/jurisdictionManage/roleJurisdiction/rightDialog.vue Normal file
View File

@ -0,0 +1,392 @@
<template>
<div>
<base-right-dialog
ref="baseRightDialog"
:footerShow="true"
:appendBody="true"
:dialogVisible.sync="drawer"
:withHeader="false"
title="权限分配"
@handleClose="handleDialogClose"
@handleConfirmClick="handleConfirmClick"
:size="'60%'"
>
<el-tabs v-model="activeName">
<el-tab-pane label="功能权限" name="first">
<el-table
border
ref="multipleTable"
:data="menuDatas"
row-key="id"
tooltip-effect="dark"
style="width: 100%"
:default-expand-all="true"
:default-checked-keys="keys"
@select-all="selectAll"
@select="handleSelectionChange"
v-loading="buttonLoading"
>
<el-table-column
type="selection"
width="45"
:reserve-selection="true"
></el-table-column>
<el-table-column
prop="name"
label="菜单名称"
width="200"
></el-table-column>
<el-table-column prop="buttonSelection" label="按钮">
<template slot-scope="scope">
<div style="display: flex;align-items: center">
<i
class="el-icon-star-on"
style="
height: 30px;
line-height: 30px;
font-size: 25px;
margin-right: 7px;
cursor: pointer;
"
v-show="btnShowHandle(scope.row.buttonList,true)"
@click="cancellation(scope.row.buttonList)"
></i>
<i
class="el-icon-star-on"
style="
height: 30px;
line-height: 30px;
font-size: 25px;
margin-right: 7px;
color: #808080;
cursor: pointer;
"
@click="selectAllButton(scope.row.buttonList)"
v-show="btnShowHandle(scope.row.buttonList,false)"
></i>
<el-checkbox v-model="item.check" v-for="item in scope.row.buttonList">{{ item.nameCh }}</el-checkbox>
</div>
</template>
</el-table-column>
</el-table>
</el-tab-pane
>
<el-tab-pane label="数据权限" name="second">
<data-permissions ref="dataPermissions"></data-permissions>
</el-tab-pane>
<el-tab-pane label="首页拖拽权限" name="layOutAuth">
<layOutPermissions ref="layOutPermissions"></layOutPermissions>
</el-tab-pane>
</el-tabs>
</base-right-dialog>
</div>
</template>
<script>
import baseRightDialog from '@/components/base/baseRightDialog'
import { PopedomSaveData, GetAllBilldata } from '@/api/apis/jurisdiction'
import dataPermissions from './dataPermissions.vue'
import layOutPermissions from './layOutPermissions.vue'
import loginVue from '../../../login.vue'
import { authApi } from '@/api/apis/auth'
export default {
data() {
return {
drawer: false,
multipleSelection: [],
keys: [],
isAllSelect: false,
selected: false,
childNode: false,
build: '',
activeName: 'first',
dataPermissions: [],
buttonLoading: false,
menuDatas: []
}
},
props: {
menuData: {
type: Array,
default: () => {
return []
}
}
},
components: {
baseRightDialog,
dataPermissions,
layOutPermissions
},
beforeUpdate() {
this.handleTabClick()
},
computed: {
// menuDatas: {
// // return JSON.parse(JSON.stringify(this.menuData));
// get: function () {
// return JSON.parse(JSON.stringify(this.menuData));
// },
// set: function (item) {
// return JSON.parse(JSON.stringify(item));
// },
// },
},
methods: {
//判断全选是否显示
btnShowHandle(list, flag = false) {
if (!list.length) return false
let flagResult = list.every(item => {
return item.check
})
if (flag) {
return flagResult
} else {
return !flagResult
}
},
// tab切换
handleTabClick() {
this.$nextTick(() => {
this.$refs.multipleTable && this.$refs.multipleTable.doLayout()
})
},
selectAllButton(item) {
item.forEach(item => {
item.check = true
})
},
cancellation(item) {
item.forEach(item => {
item.check = false
})
},
// 全选/取消全选
selectAll() {
let data = this.treeToArray(this.menuDatas)
this.selected = !this.selected
data.forEach((el, index) => {
el.check = this.selected
this.$refs.multipleTable.toggleRowSelection(el, this.selected)
})
},
handleSelectionChange(val, row) {
row.check = !row.check
},
// 默认选中
exhibitList(menu, homeList, id) {
this.$refs.layOutPermissions.homeList = homeList
console.log(menu, 'menu')
// let data = this.treeToArray(this.menuDatas);
this.build = id
// data.forEach((el, index) => {
// if (id.includes(el.id)) {
// this.$refs.multipleTable.toggleRowSelection(el, true);
// }
// });
this.menuCheckHandle(menu)
this.menuDatas = menu
console.log(this.menuDatas, 'this.menuDatas')
this.buttonLoading = false
},
//数据处理
menuCheckHandle(arr) {
arr.forEach(item => {
if (item.check) {
this.$refs.multipleTable.toggleRowSelection(item, true)
}
if (item.children.length) {
this.menuCheckHandle(item.children)
}
})
},
// 数据扁平
treeToArray(items) {
let children = []
items.forEach((item) => {
children.push(item)
if (item.children) {
children = children.concat(this.treeToArray(item.children))
}
})
return children
},
handleDialogClose() {
let data = this.treeToArray(this.menuDatas)
data.forEach((el, index) => {
this.$refs.multipleTable.toggleRowSelection(el, false)
})
this.changeMenu(this.menuDatas, 0)
this.drawer = false
this.$parent.permissionPopup = false
},
async handleConfirmClick() {
let params = {
id: this.build,
kindId: 2,
sysPopedomHomeEntities: [],
sysPopedomMenuEntities: [],
sysPopedomOperateEntities: []
}
this.homeListHandle(params.sysPopedomHomeEntities)
this.menuListHandle(this.menuDatas, params.sysPopedomMenuEntities, params.sysPopedomOperateEntities)
const res = await authApi("sysUserService","","saveJurisdiction","",params)
if(res.status == '200'){
this.handleDialogClose();
this.$message({
message: "保存成功",
type: "success",
});
}
},
//处理首页拖拽
homeListHandle(arr) {
this.$refs.layOutPermissions.homeList.forEach(item => {
if (item.check) {
arr.push({ homeId: item.id })
}
})
},
//菜单数据处理
menuListHandle(list, result, btnResult) {
list.forEach(item => {
if (item.check) {
result.push({
menuId: item.id
})
}
if (item.children.length) {
this.menuListHandle(item.children, result,btnResult)
}
if (item.buttonList.length) {
this.btnListHandle(item.buttonList, btnResult, item.id)
}
})
},
//按钮选中处理
btnListHandle(list, btnResult, menuId) {
list.forEach(item => {
if (item.check) {
console.log(btnResult,'btnResult')
btnResult.push({
menuId,
operate: item.id
})
}
})
},
// 递归，添加选中按钮
addToButtonList(arr, newArr) {
newArr.forEach((newItem) => {
this.addToButtonListRecursive(
arr,
newItem.op_MenuID,
newItem.op_OperateKindList
)
})
return arr
},
addToButtonListRecursive(arr, targetId, operateKindList) {
for (let i = 0; i < arr.length; i++) {
const item = arr[i]
if (item.id == targetId) {
let lists = operateKindList.split(',')
lists.forEach((el) => {
item.buttonList.push(parseInt(el))
})
return item
}
if (item.children && item.children.length > 0) {
this.addToButtonListRecursive(
item.children,
targetId,
operateKindList
)
}
}
},
changeMenu(data, num) {
let level = num
level = level + 1
data.forEach((el) => {
el.buttonList = []
el.type = false
if (el.children != null && el.children && el.children.length) {
this.changeMenu(el.children, level)
}
})
},
toFlatArray(tree, parentId) {
return tree.reduce((t, _) => {
const child = _[children]
return [
...t,
parentId ? { ..._, parentId } : _,
...(child && child.length ? toFlatArray(child, _[id]) : [])
]
}, [])
},
getIds(flatArray) {
let ids = [nodeId]
let child = flatArray.find((_) => _[id] === nodeId)
while (child && child.parentId) {
ids = [child.parentId, ...ids]
child = flatArray.find((_) => _[id] === child.parentId)
}
return ids
},
treeFindPath(tree, func, field = '', path = []) {
if (!tree) return []
for (const data of tree) {
field === '' ? path.push(data) : path.push(data[field])
if (func(data)) return path
if (data.children) {
const findChildren = this.treeFindPath(
data.children,
func,
field,
path
)
if (findChildren.length) return findChildren
}
path.pop()
}
return []
}
}
}
</script>
<style scoped lang="scss">
.rightDialog {
height: 100%;
padding: 0 16px;
}
::v-deep .cell {
display: flex;
}
::v-deep .el-checkbox-group {
display: flex;
align-items: center;
flex-wrap: wrap;
}
::v-deep .el-checkbox {
margin-right: 15px;
}
::v-deep .el-tabs__nav {
transform: translateX(22px) !important;
}
</style>

132
src/views/systemSettings/jurisdictionManage/userJurisdiction/buttonSetting.vue
View File

@ -1,104 +1,34 @@
<template>
<div v-loading="buttonLoading" style="height:500px;overflow: auto;">
<div flex="cross:center cross:baseline" flex-wrap v-for="(el,elIndex) in classifyButtonList"
class="buttonSetting">
<p style="width:100px;text-align: right;">{{el.label}}</p>
<div flex="cross:center" flex-wrap style="width: calc(100% - 200px);">
<p class="recordText" v-for="(item,index) in el.buttonList" @click="typeChange(item)" :key="index"
:class="{'active':item.type}">{{item.NameCN}}</p>
<p v-if="el.buttonList.length == 0" class="recordText">暂无按钮</p>
</div>
</div>
</div>
</template>
<script>
import {
GetAllButton,
} from '@/api/apis/jurisdiction'
export default {
// props:{
// ButtonList: {
// type: Array,
// default: () => {
// return []
// }
// },
// }
data(){
return{
// ButtonList:[],
classifyButtonList: [],
buttonPopedom:[],
buttonLoading:false
// 表头配置
const tableColumnJson = [
{
label: '用户账号',
prop: 'u_LoginCode',
tooltip: true,
},
{
label: '用户姓名',
prop: 'p_PersonName',
tooltip: true,
},
{
label: '所属部门',
prop: 'o_OrganName',
tooltip: true,
},
{
label: '手机号',
prop: 'p_Telphone',
tooltip: true
},
{
label: '状态',
prop: 'stateNote',
tooltip: true
},
}
},
methods:{
async GetAllButtonList(ids, checkdata) {
this.buttonLoading = true
setTimeout(()=>{
this.buttonLoading = false
},3000)
this.classifyButtonList = []
let params = {
menuIDs: ids.join(",")
}
let res = await GetAllButton(params)
if (res.success === 'true') {
let allButtonList = res.data[0]
checkdata.forEach(el => {
el.buttonList = []
allButtonList.forEach(item => {
if (el.id == item.MenuID) {
el.buttonList.push(item)
}
})
})
this.classifyButtonList = checkdata
}
if(this.buttonPopedom.length > 0){
this.classifyButtonList.forEach(item=>{
item.buttonList.forEach(bItem=>{
this.buttonPopedom.forEach(el=>{
if(el == bItem.id){
bItem.type = true
}
})
})
})
}
this.buttonLoading = false
},
typeChange(item) {
item.type = !item.type
this.$forceUpdate()
},
}
}
]
</script>
<style lang="scss">
$activeColor: var(--bg-color, "#00aaff");
.buttonSetting{
margin-bottom: 5px;
.recordText {
border: 1px solid #fff;
width: 80px;
padding: 8px 0;
text-align: center;
font-size: 12px;
cursor: pointer;
background: #f2f2f2;
color: #e0e0e0;
margin:3px;
}
.recordText.active {
background: $activeColor;
color: #fff;
}
}
</style>
export default {
tableColumnJson,
}

52
src/views/systemSettings/jurisdictionManage/userJurisdiction/configData.js
View File

@ -1,34 +1,34 @@
// 表头配置
const tableColumnJson = [
{
label: '用户账号',
prop: 'u_LoginCode',
tooltip: true,
},
{
label: '用户姓名',
prop: 'p_PersonName',
tooltip: true,
},
{
label: '所属部门',
prop: 'o_OrganName',
tooltip: true,
},
{
label: '手机号',
prop: 'p_Telphone',
tooltip: true
},
{
label: '状态',
prop: 'stateNote',
tooltip: true
},
{
label: '用户账号',
prop: 'loginCode',
tooltip: true,
},
{
label: '用户姓名',
prop: 'personName',
tooltip: true,
},
{
label: '所属部门',
prop: 'organName',
tooltip: true,
},
{
label: '手机号',
prop: 'mobilePhone',
tooltip: true
},
{
label: '状态',
prop: 'state',
tooltip: true
},
]
export default {
tableColumnJson,
tableColumnJson,
}

127
src/views/systemSettings/jurisdictionManage/userJurisdiction/dataPermissions.vue Normal file
View File

@ -0,0 +1,127 @@
<template>
<div>
<el-table
ref="multipleTable"
:data="tableData"
style="width: 100%"
:show-header="false"
>
<el-table-column prop="billName" label="单据" width="120">
</el-table-column>
<el-table-column prop="dataList" label="字段">
<template slot-scope="scope">
<i
class="el-icon-star-on"
style="
height: 30px;
line-height: 30px;
font-size: 25px;
margin-right: 7px;
"
v-show="
scope.row.dataList.length != 0 &&
scope.row.dataList.length == scope.row.buttonList.length
"
@click="cancellation(scope.row)"
></i>
<i
class="el-icon-star-on"
style="
height: 30px;
line-height: 30px;
font-size: 25px;
margin-right: 7px;
color: #808080;
"
v-show="
scope.row.dataList.length != 0 &&
scope.row.dataList.length != scope.row.buttonList.length
"
@click="selectAllButton(scope.row)"
></i>
<el-checkbox-group v-model="scope.row.buttonList" size="small">
<el-checkbox
v-for="item in scope.row.dataList"
:label="item.id"
:key="item.id"
>{{ item.name }}</el-checkbox
>
</el-checkbox-group>
</template>
</el-table-column>
</el-table>
</div>
</template>
<script>
import { GetAllBilldata, GetAllBillDataPepedom } from "@/api/apis/jurisdiction";
export default {
data() {
return {
tableData: [],
selectedList: [],
};
},
created() {
this.init();
},
components: {},
computed: {},
mounted() {},
beforeUpdate() {
this.handleTabClick();
},
methods: {
selectAllButton(item) {
let data = [];
item.dataList.forEach((el) => {
data.push(el.id);
});
item.buttonList = data;
},
cancellation(item) {
item.buttonList = [];
},
handleTabClick() {
this.$nextTick(() => {
this.$refs.multipleTable && this.$refs.multipleTable.doLayout();
});
},
async init() {
return
let data = [];
const res = await GetAllBilldata({});
if (res.code == 1) {
data = res.data[0];
data.forEach((el) => {
el.dataList = [];
el.buttonList = [];
});
}
const item = await GetAllBillDataPepedom({});
if (item.code == 1) {
data.forEach((el) => {
item.data[0].forEach((e) => {
if (el.billKindID == e.billKindID) {
el.dataList.push(e);
}
});
this.selectedList.forEach((add) => {
if (el.billKindID == add.dp_billKindID) {
el.buttonList = add.dp_popeList.split(",");
}
});
});
}
this.tableData = data;
},
},
};
</script>
<style scoped lang="scss"></style>

200
src/views/systemSettings/jurisdictionManage/userJurisdiction/dataSetting.vue
View File

@ -1,114 +1,114 @@
<template>
<div >
<div v-for="(item, index) in dataList" :key="index" class="dataSetting" flex>
<p style="width: 100px;text-align: right;">{{item.billName}}</p>
<div flex flex-wrap style="margin-left: 10px;width: calc(100% - 150px);">
<p class="recordText" v-for="el in item.buttonList" :class="{'active':el.type}" @click="typeChange(el)">{{el.name}}</p>
</div>
</div>
</div>
<div >
<div v-for="(item, index) in dataList" :key="index" class="dataSetting" flex>
<p style="width: 100px;text-align: right;">{{item.billName}}</p>
<div flex flex-wrap style="margin-left: 10px;width: calc(100% - 150px);">
<p class="recordText" v-for="(el,index) in item.buttonList" :key="index" :class="{'active':el.type}" @click="typeChange(el)">{{el.name}}</p>
</div>
</div>
</div>
</template>
<script>
import {
GetAllBillDataPepedom,
GetAllBilldata
} from '@/api/apis/jurisdiction.js'
export default {
name: "dataSetting",
data() {
return {
dataList: [],
dataPepedom: [],
dataSet: [],
activeList:[],
}
},
created() {
// this.inPage()
},
import {
GetAllBillDataPepedom,
GetAllBilldata
} from '@/api/apis/jurisdiction.js'
export default {
name: "dataSetting",
data() {
return {
dataList: [],
dataPepedom: [],
dataSet: [],
activeList:[],
}
},
created() {
// this.inPage()
},
methods: {
inPage() {
let dataPepedom = this.getDataPepedom()
let dataSet = this.getDataSet()
Promise.all([dataSet, dataPepedom]).then((value) => {
this.getDataList(value[0], value[1])
})
},
methods: {
inPage() {
let dataPepedom = this.getDataPepedom()
let dataSet = this.getDataSet()
Promise.all([dataSet, dataPepedom]).then((value) => {
this.getDataList(value[0], value[1])
})
},
async getDataPepedom() {
let res = await GetAllBillDataPepedom()
if (res.code == 1) {
return res.data[0]
}
},
async getDataSet() {
let res = await GetAllBilldata()
if (res.code == 1) {
res.data[0].forEach(el=>{
el.buttonList = []
})
return res.data[0]
}
},
getDataList(dataSet, dataPepedom) {
this.dataList = []
let arr = []
dataSet.forEach((el, index) => {
dataPepedom.forEach((item) => {
if (el.billKindID == item.billKindID) {
el.buttonList.push(item)
}
})
})
this.dataList = dataSet
if(this.activeList.length > 0){
this.dataList.forEach(item=>{
item.buttonList.forEach(bItem=>{
this.activeList.forEach(el=>{
if(el == bItem.id){
bItem.type = true
}
})
})
})
}
},
typeChange(item) {
item.type = !item.type
this.$forceUpdate()
},
}
}
async getDataPepedom() {
let res = await GetAllBillDataPepedom()
if (res.code == 1) {
return res.data[0]
}
},
async getDataSet() {
let res = await GetAllBilldata()
if (res.code == 1) {
res.data[0].forEach(el=>{
el.buttonList = []
})
return res.data[0]
}
},
getDataList(dataSet, dataPepedom) {
this.dataList = []
let arr = []
dataSet.forEach((el, index) => {
dataPepedom.forEach((item) => {
if (el.billKindID == item.billKindID) {
el.buttonList.push(item)
}
})
})
this.dataList = dataSet
if(this.activeList.length > 0){
this.dataList.forEach(item=>{
item.buttonList.forEach(bItem=>{
this.activeList.forEach(el=>{
if(el == bItem.id){
bItem.type = true
}
})
})
})
}
},
typeChange(item) {
item.type = !item.type
this.$forceUpdate()
},
}
}
</script>
<style lang="scss">
$activeColor: var(--bg-color, "#00aaff");
$activeColor: var(--bg-color, "#00aaff");
.el-icon-star-on {
/* color: #00aa00; */
color: $activeColor;
}
.el-icon-star-on {
/* color: #00aa00; */
color: $activeColor;
}
.dataSetting {
color: #000;
.recordText {
border: 1px solid #fff;
width: 80px;
padding: 8px 0;
text-align: center;
font-size: 12px;
cursor: pointer;
background: #f2f2f2;
color: #e0e0e0;
margin:3px;
}
.dataSetting {
color: #000;
.recordText {
border: 1px solid #fff;
width: 80px;
padding: 8px 0;
text-align: center;
font-size: 12px;
cursor: pointer;
background: #f2f2f2;
color: #e0e0e0;
margin:3px;
}
.recordText.active {
background: $activeColor;
color: #fff;
}
}
.recordText.active {
background: $activeColor;
color: #fff;
}
}
</style>

917
src/views/systemSettings/jurisdictionManage/userJurisdiction/index.vue
View File

@ -1,460 +1,513 @@
<template>
<div>
<div style="display: flex;height: 100%;">
<base-layout title="组织机构" ref="organLayout" style="width: 20%;" :bottonShow="false" :isPage="false"
:operateButtonSwitch="false" :mainColor="mainColor">
<div slot="main" style="height: 100%;">
<base-tree ref="baseTree" :isCenter="false" :isSaveBtn="false" :Allshow="false" :showCheckbox="false"
:menuData="orangData" @handleNodeClick="orangClick"></base-tree>
</div>
</base-layout>
<base-layout title="用户信息" ref="userLayout" @pageChange="pageChange" style="width: 80%;" :buttonList="buttonList"
:defaultButtonSwitch="false" @onFuncBtn="getFuncBtn" :isPage="true">
<div slot="main" slot-scope="{ tableHeight }" style="height: 100%;">
<base-table ref="userCustomtable" :border="true" :showIndex="false" :tabLoading.sync="tabLoading"
@radioChange="userRadioChange" :slotrow="true" :tableHeight="tableHeight" :tableData="tableData"
:tableColumn="tableColumn">
<div>
<div style="display: flex; height: 100%">
<base-layout title="组织机构" ref="organLayout" style="width: 20%" :bottonShow="false" :isPage="false"
:operateButtonSwitch="false" :mainColor="mainColor"
>
<div slot="main" style="height: 100%">
<base-tree ref="baseTree" :isCenter="false" :isSaveBtn="false" :Allshow="false" :showCheckbox="false"
:menuData="orangData" @handleNodeClick="orangClick"
></base-tree>
</div>
</base-layout>
<base-layout title="用户信息" ref="userLayout" @pageChange="pageChange" style="width: 80%"
:buttonList="buttonList" :defaultButtonSwitch="false" @onFuncBtn="getFuncBtn" :isPage="true"
>
<div slot="main" slot-scope="{ tableHeight }" style="height: 100%">
<base-table ref="userCustomtable" :border="true" :showIndex="false" :tabLoading.sync="tabLoading"
@radioChange="userRadioChange" :slotrow="true" :tableHeight="tableHeight" :tableData="tableData"
:tableColumn="tableColumn"
>
</base-table>
</div>
</base-layout>
</div>
<right-dialog ref="rightDialog" :menuData="menuData" v-if="permissionPopup"></right-dialog>
</base-table>
</div>
</base-layout>
</div>
<base-dialog :closeEscape="true" :showClose="true" :closeModal="false" :dialogVisible.sync="settingDialog"
class="userDialog" title="权限设置" width="50vw" top="5vh" :footerShow="true"
@handleConfirmClick="settingConfirmClick">
<base-layout :showTitle="false" :defaultButtonSwitch="false" >
<div slot="main">
<el-tabs v-model="activeName" type="card" @tab-click="handleClick" :before-leave="beforeLeave">
<el-tab-pane label="菜单权限" name="jurisdictionSetting">
<jurisdiction-Setting ref="jurisdictionSetting" :menuData="menuData"></jurisdiction-Setting>
</el-tab-pane>
<el-tab-pane label="按钮权限" name="buttonSetting">
<button-setting ref="buttonSetting"></button-setting>
</el-tab-pane>
<el-tab-pane label="数据权限" name="dataSetting">
<data-setting ref="dataSetting"></data-setting>
</el-tab-pane>
</el-tabs>
</div>
</base-layout>
</base-dialog>
</div>
<base-dialog :closeEscape="true" :showClose="true" :closeModal="false" :dialogVisible.sync="settingDialog"
class="userDialog" title="权限设置" width="50vw" top="5vh" :footerShow="true"
@handleConfirmClick="settingConfirmClick"
>
<base-layout :showTitle="false" :defaultButtonSwitch="false">
<div slot="main">
<el-tabs v-model="activeName" type="card" @tab-click="handleClick" :before-leave="beforeLeave">
<el-tab-pane label="菜单权限" name="jurisdictionSetting">
<jurisdiction-Setting ref="jurisdictionSetting" :menuData="menuData"></jurisdiction-Setting>
</el-tab-pane>
<el-tab-pane label="按钮权限" name="buttonSetting">
<button-setting ref="buttonSetting"></button-setting>
</el-tab-pane>
<el-tab-pane label="数据权限" name="dataSetting">
<data-setting ref="dataSetting"></data-setting>
</el-tab-pane>
</el-tabs>
</div>
</base-layout>
</base-dialog>
</div>
</template>
<script>
import router from '@/router'
import baseLayout from "@/components/base/baseLayout";
import baseTable from "@/components/base/baseTable";
import baseDialog from "@/components/base/BaseNewDialog/index.vue";
import baseForm from "@/components/base/baseNewForm/index.vue";
import baseTree from "@/components/base/BaseMenuTree/index.vue";
import jurisdictionSetting from "./jurisdictionSetting.vue";
import buttonSetting from "./buttonSetting.vue";
import dataSetting from "./dataSetting.vue"
import configData from "./configData";
import baseLayout from '@/components/base/baseLayout'
import baseTable from '@/components/base/baseTable'
import baseDialog from '@/components/base/BaseNewDialog/index.vue'
import baseForm from '@/components/base/baseNewForm/index.vue'
import baseTree from '@/components/base/BaseMenuTree/index.vue'
import rightDialog from './rightDialog'
import jurisdictionSetting from './jurisdictionSetting.vue'
import buttonSetting from './buttonSetting.vue'
import dataSetting from './dataSetting.vue'
import configData from './configData'
import { getCompanyId } from '@/utils/auth'
import { GetMenuTree } from '@/api/apis/menuManage'
import { userGetBillList } from '@/api/apis/userInformation'
import { GetOrganTree } from '@/api/apis/organization'
import {
GetMenuTree,
} from '@/api/apis/menuManage'
import {
userGetBillList,
} from '@/api/apis/userInformation'
import {
GetOrganTree,
} from '@/api/apis/organization'
import {
GetPppedomSet,
GetAllButton,
GetAllBillDataPepedom,
GetAllBilldata,
PopedomSaveData
GetPppedomSet,
GetMenuButton,
GetAllButton,
GetAllBillDataPepedom,
GetAllBilldata,
PopedomSaveData
} from '@/api/apis/jurisdiction'
import { authApi } from '@/api/apis/auth'
export default {
name: "review",
components: {
buttonSetting,
dataSetting,
baseLayout,
baseTable,
baseDialog,
baseForm,
baseTree,
jurisdictionSetting
},
data() {
return {
activeName: 'jurisdictionSetting',
radioIndex: false,
userRadioId: false,
settingDialog: false,
// tableHeight: 'calc(100vh - 227px)',
mainColor: '#f8f8f8',
tabLoading: false,
tableData: [],
// 搜索配置
menuData: [],
orangData: [],
buttonList: [{
'icon': 'el-icon-plus',
'menuName': '权限设置',
btnFunciton: 'setting'
},],
pageModel: {
page: 1,
limit: 20,
departmentID: '',
},
defaultProps: {
children: 'children',
label: 'label'
},
buttonArray: [],
allButtonList: [],
menuIDs: [],
menuList: [],
menuPopedom: []
}
},
computed: {
// 表头配置
tableColumn() {
return configData.tableColumnJson
},
},
watch: {
settingDialog: {
deep: true,
handler(newValue, oldValue) {
if (newValue == false) {
this.$refs.dataSetting.dataList = []
this.$refs.jurisdictionSetting.$refs.menuTree.$refs.elTree.setCheckedKeys([])
this.$refs.buttonSetting.classifyButtonList = []
}
}
}
},
created() { },
onShow() { },
mounted() {
this.initPage()
},
filters: {
},
methods: {
beforeLeave(activeName, oldActiveName) {
if(oldActiveName == 'jurisdictionSetting'){
this.menuPopedom = this.$refs.jurisdictionSetting.menuPopedom
this.checkdata = this.$refs.jurisdictionSetting.checkdata
}
if (oldActiveName == 'jurisdictionSetting' && activeName == "buttonSetting") {
if (this.menuPopedom.length == 0) {
this.$vmNews("当前用户未分配菜单权限")
return false
}
}
if (oldActiveName == 'dataSetting' && activeName == "buttonSetting") {
// return false
}
},
// 切换tab
handleClick(tab, event) {
if (this.activeName == 'buttonSetting') {
this.checkdata = this.$refs.jurisdictionSetting.checkdata
this.$refs.buttonSetting.GetAllButtonList(this.menuPopedom, this.checkdata)
}
if (this.activeName == 'dataSetting') {
this.$refs.dataSetting.inPage()
}
},
// 获取菜单选中
getMenuIDs(menuData) {
menuData.forEach(el => {
if (el.type) {
this.menuList.push(el)
this.menuIDs.push(el.id)
}
if (el.children != null && el.children && el.children.length) {
this.getMenuIDs(el.children)
}
})
},
// 初始化页面
initPage() {
this.getTableList()
this.getOrganList()
},
//获取菜单树
async getMenuData() {
let res = await GetMenuTree({})
if (res.code == 1) {
let arr = JSON.parse(res.data[0])
this.menuData = JSON.parse(res.data[0])
this.changeMenu(this.menuData, 0)
// this.getButtonArray(this.menuData)
}
},
// 菜单树添加参数
changeMenu(data, num) {
let level = num
level = level + 1
data.forEach(el => {
el.buttonList = []
el.type = false
// el.level = level
if (el.children != null && el.children && el.children.length) {
this.changeMenu(el.children, level)
}
})
},
// 获取用户信息列表
async getTableList() {
this.tabLoading = true
this.tableData = []
let params = {
...this.pageModel
}
let res = await userGetBillList(params)
if (res.code === 1) {
this.tableData = res.data[1]
this.$nextTick(() => {
this.$refs.userCustomtable.clearRadioIndex()
this.$refs.userLayout.setPageTotal(res.data[0])
})
this.tabLoading = false
}
},
getButtonArray(menuData) {
menuData.forEach((el, index) => {
this.allButtonList.forEach(item => {
if (el.id == item.MenuID) {
item.active = false
el.buttonList.push(item)
}
})
if (el.children != null && el.children && el.children.length) {
this.getButtonArray(el.children)
}
})
},
// 单选
userRadioChange(val) {
this.radioIndex = val.index
this.userRadioId = val.u_UserID
},
// 获取组织列表
async getOrganList() {
this.$refs.baseTree.treeLoading = true
setTimeout(() => {
this.$refs.baseTree.treeLoading = false
}, 3000)
let params = {
// CompanyID: "46"
CompanyID: this.$store.state.user.companyID ? this.$store.state.user.companyID : getCompanyId()
}
let res = await GetOrganTree(params)
if (res.success === 'true') {
this.orangData = JSON.parse(res.data[0])
this.$refs.baseTree.treeLoading = false
}
},
// 树状图点击
orangClick(data) {
this.pageModel.departmentID = data.id
this.resetTable()
// this.result()
},
resetTable() {
this.pageModel.page = 1
this.userRadioId = false
this.radioIndex = false
this.$nextTick(() => {
this.$refs.userCustomtable.clearRadioIndex()
this.$refs.userLayout.pageClear()
})
this.getTableList()
},
// 操作按钮事件
getFuncBtn(btnEven) {
if (this.radioIndex === false) {
this.$vmNews("请选择一条数据")
return
}
this[btnEven.btnFunciton]()
},
setting() {
name: 'review',
components: {
buttonSetting,
dataSetting,
baseLayout,
baseTable,
baseDialog,
baseForm,
baseTree,
jurisdictionSetting,
rightDialog
},
data() {
return {
activeName: 'jurisdictionSetting',
radioIndex: false,
userRadioId: false,
settingDialog: false,
// tableHeight: 'calc(100vh - 227px)',
mainColor: '#f8f8f8',
tabLoading: false,
tableData: [],
// 搜索配置
menuData: [],
orangData: [],
buttonList: [
{
icon: 'el-icon-plus',
menuName: '权限设置',
btnFunciton: 'setting'
}
],
pageModel: {
pageNum: 1,
pageSize: 20,
organId: ''
},
defaultProps: {
children: 'children',
label: 'label'
},
buttonArray: [],
allButtonList: [],
menuIDs: [],
menuList: [],
menuPopedom: [],
permissionPopup: false
}
},
computed: {
// 表头配置
tableColumn() {
return configData.tableColumnJson
}
},
watch: {
settingDialog: {
deep: true,
handler(newValue, oldValue) {
if (newValue == false) {
this.$refs.dataSetting.dataList = []
this.$refs.jurisdictionSetting.$refs.menuTree.$refs.elTree.setCheckedKeys(
[]
)
this.$refs.buttonSetting.classifyButtonList = []
}
}
}
},
created() {
},
onShow() {
},
mounted() {
this.initPage()
this.getMenuData()
},
filters: {},
methods: {
beforeLeave(activeName, oldActiveName) {
if (oldActiveName == 'jurisdictionSetting') {
this.menuPopedom = this.$refs.jurisdictionSetting.menuPopedom
this.checkdata = this.$refs.jurisdictionSetting.checkdata
}
if (
oldActiveName == 'jurisdictionSetting' &&
activeName == 'buttonSetting'
) {
if (this.menuPopedom.length == 0) {
this.$vmNews('当前用户未分配菜单权限')
return false
}
}
if (oldActiveName == 'dataSetting' && activeName == 'buttonSetting') {
// return false
}
},
// 切换tab
handleClick(tab, event) {
if (this.activeName == 'buttonSetting') {
this.checkdata = this.$refs.jurisdictionSetting.checkdata
this.$refs.buttonSetting.GetAllButtonList(
this.menuPopedom,
this.checkdata
)
}
if (this.activeName == 'dataSetting') {
this.$refs.dataSetting.inPage()
}
},
// 获取菜单选中
getMenuIDs(menuData) {
menuData.forEach((el) => {
if (el.type) {
this.menuList.push(el)
this.menuIDs.push(el.id)
}
if (el.children != null && el.children && el.children.length) {
this.getMenuIDs(el.children)
}
})
},
// 初始化页面
initPage() {
this.getTableList()
this.getOrganList()
},
//获取菜单树
async getMenuData() {
// let res = await GetMenuButton({});
let res = await authApi('sysMenuConfigService', '', 'queryEntityTree', '', { state: 0 })
if (res.status == 200) {
let arr = res.attribute
this.menuData = res.attribute
this.changeMenu(this.menuData, 0)
// this.getButtonArray(this.menuData)
}
},
// 菜单树添加参数
changeMenu(data, num) {
let level = num
level = level + 1
data.forEach((el) => {
el.buttonList = []
el.type = false
if (el.children != null && el.children && el.children.length) {
this.changeMenu(el.children, level)
}
})
},
addToButtonList(arr, newArr) {
newArr.forEach((newItem) => {
this.addToButtonListRecursive(
arr,
newItem.op_MenuID,
newItem.op_OperateKindList
)
})
return arr
},
addToButtonListRecursive(arr, targetId, operateKindList) {
for (let i = 0; i < arr.length; i++) {
const item = arr[i]
if (item.id == targetId) {
item.buttonList = operateKindList.split(',')
return item
}
if (item.children && item.children.length > 0) {
this.addToButtonListRecursive(
item.children,
targetId,
operateKindList
)
}
}
},
// 获取用户信息列表
async getTableList() {
this.tabLoading = true
this.tableData = []
let params = {
...this.pageModel
}
let res = await authApi('sysUserService', '', 'queryEntityPage', '', params)
if (res.status == 200) {
this.tableData = res.attribute.list
this.$nextTick(() => {
this.$refs.userCustomtable.clearRadioIndex()
this.$refs.userLayout.setPageTotal(res.attribute.total)
})
this.tabLoading = false
}
},
getButtonArray(menuData) {
menuData.forEach((el, index) => {
this.allButtonList.forEach((item) => {
if (el.id == item.MenuID) {
item.active = false
el.buttonList.push(item)
}
})
if (el.children != null && el.children && el.children.length) {
this.getButtonArray(el.children)
}
})
},
// 单选
userRadioChange(val) {
this.radioIndex = val.index
this.userRadioId = val.id
},
// 获取组织列表
async getOrganList() {
this.$refs.baseTree.treeLoading = true
setTimeout(() => {
this.$refs.baseTree.treeLoading = false
}, 3000)
const res = await authApi('sysOrganService', '', 'queryEntityTree', '', { state: 0 })
// let res = await GetOrganTree(params);
if (res.status == 200) {
this.orangData = res.attribute
this.$refs.baseTree.treeLoading = false
}
},
// 树状图点击
orangClick(data) {
this.pageModel.organId = data.id
this.resetTable()
// this.result()
},
resetTable() {
this.pageModel.pageNum = 1
this.userRadioId = false
this.radioIndex = false
this.$nextTick(() => {
this.$refs.userCustomtable.clearRadioIndex()
this.$refs.userLayout.pageClear()
})
this.getTableList()
},
// 操作按钮事件
getFuncBtn(btnEven) {
if (this.radioIndex === false) {
this.$vmNews('请选择一条数据')
return
}
this[btnEven.btnFunciton]()
},
//点击权限设置
async setting() {
this.getMenuData()
this.settingDialog = true
this.activeName = "jurisdictionSetting"
this.GetPppedomData()
this.permissionPopup = true
this.$nextTick(async() => {
this.$refs.rightDialog.drawer = true
this.$refs.rightDialog.buttonLoading = true
let params = {
id: this.userRadioId,
kindId: 1
}
const res = await authApi('sysUserService', '', 'jurisdiction', '',params)
if (res.status == 200) {
const data = res.attribute
this.$refs.rightDialog.exhibitList(res.attribute.menvVoList,res.attribute.homeList,this.userRadioId)
}
})
},
// setting() {
// this.settingDialog = true
// this.activeName = "jurisdictionSetting"
// this.GetPppedomData()
// },
async GetPppedomData() {
let params = {
objectID: this.userRadioId,
kindid: 1
}
},
async GetPppedomData() {
let params = {
objectID: this.userRadioId,
kindid: 1
}
let res = await GetPppedomSet(params)
this.$refs.jurisdictionSetting.menuLoading = true
setTimeout(() => {
this.$refs.jurisdictionSetting.menuLoading = false
}, 3000)
if (res.code == 1) {
const data = res.data
let menuIDs = data[0].length > 0 ? data[0][0].fp_MenuIdList.split(',') : []
this.$refs.jurisdictionSetting.$refs.menuTree.selectData = menuIDs
this.$refs.jurisdictionSetting.$refs.menuTree.checkChange(menuIDs)
let buttonPopedom = this.getbuttonPopedomList(res.data[1])
this.$refs.buttonSetting.buttonPopedom = buttonPopedom
let activeList = this.getActiveList(res.data[2])
this.$refs.dataSetting.activeList = activeList
this.$refs.jurisdictionSetting.menuLoading = false
// selectData
}
},
getActiveList(data) {
let array = []
data.forEach(el => {
el.dp_popeList.split(',').forEach(item => {
array.push(item)
})
})
return array
},
getbuttonPopedomList(data) {
let array = []
data.forEach(el => {
el.op_OperateKindList.split(',').forEach(item => {
array.push(item)
})
})
return array
},
pageChange(model) {
this.pageModel.page = model.page
this.pageModel.limit = model.limit
this.getTableList()
},
settingConfirmClick() {
let menuPopedom = this.$refs.jurisdictionSetting.menuPopedom.join(",")
let buttonPopedom = this.getButtonPopedom(this.$refs.buttonSetting.classifyButtonList)
let dataPopedom = this.getDataPopedom(this.$refs.dataSetting.dataList)
let params = {
kindid: 1,
objectID: this.userRadioId,
menuPopedom: menuPopedom,
buttonPopedom: buttonPopedom,
dataPopedom: dataPopedom,
}
this.saveData(params)
},
async saveData(params) {
let res = await PopedomSaveData(params)
if (res.code == 1) {
this.$vmNews("保存成功", 'success')
this.activeName = "jurisdictionSetting"
this.settingDialog = false
this.$store.dispatch('GenerateRoutes').then(accessRoutes => {
// 根据roles权限生成可访问的路由表
for (let i = 0, length = accessRoutes.length; i < length; i += 1) {
const element = accessRoutes[i]
router.addRoutes(accessRoutes) // 动态添加可访问路由表
}
localStorage.setItem('routeList', JSON.stringify(accessRoutes))
})
}
},
getDataPopedom(dataPopedom) {
let array = []
dataPopedom.forEach(el => {
el.dp_popeList = []
el.buttonList.forEach(item => {
if (item.type) {
el.dp_popeList.push(item.id)
}
})
})
dataPopedom.forEach(el => {
if (el.dp_popeList.length > 0) {
let params = {
dp_billKindID: el.billKindID,
dp_popeList: el.dp_popeList.join(',')
}
array.push(params)
}
})
return array
},
getButtonPopedom(buttonPopedom) {
let array = []
// let op_OperateKindList = []
buttonPopedom.forEach(el => {
el.op_MenuID = el.id
el.op_OperateKindList = []
el.buttonList.forEach(item => {
if (item.type) {
el.op_OperateKindList.push(item.id)
}
})
})
buttonPopedom.forEach(el => {
if (el.op_OperateKindList.length > 0) {
let params = {
op_MenuID: el.op_MenuID,
op_OperateKindList: el.op_OperateKindList.join(',')
}
array.push(params)
}
})
return array
},
},
let res = await GetPppedomSet(params)
this.$refs.jurisdictionSetting.menuLoading = true
setTimeout(() => {
this.$refs.jurisdictionSetting.menuLoading = false
}, 3000)
if (res.code == 1) {
const data = res.data
let menuIDs =
data[0].length > 0 ? data[0][0].fp_MenuIdList.split(',') : []
this.$refs.jurisdictionSetting.$refs.menuTree.selectData = menuIDs
this.$refs.jurisdictionSetting.$refs.menuTree.checkChange(menuIDs)
let buttonPopedom = this.getbuttonPopedomList(res.data[1])
this.$refs.buttonSetting.buttonPopedom = buttonPopedom
let activeList = this.getActiveList(res.data[2])
this.$refs.dataSetting.activeList = activeList
this.$refs.jurisdictionSetting.menuLoading = false
// selectData
}
},
getActiveList(data) {
let array = []
data.forEach((el) => {
el.dp_popeList.split(',').forEach((item) => {
array.push(item)
})
})
return array
},
getbuttonPopedomList(data) {
let array = []
data.forEach((el) => {
el.op_OperateKindList.split(',').forEach((item) => {
array.push(item)
})
})
return array
},
pageChange(model) {
this.pageModel.pageNum = model.page
this.pageModel.pageSize = model.limit
this.getTableList()
},
settingConfirmClick() {
let menuPopedom = this.$refs.jurisdictionSetting.menuPopedom.join(',')
let buttonPopedom = this.getButtonPopedom(
this.$refs.buttonSetting.classifyButtonList
)
let dataPopedom = this.getDataPopedom(this.$refs.dataSetting.dataList)
let params = {
kindid: 1,
objectID: this.userRadioId,
menuPopedom: menuPopedom,
buttonPopedom: buttonPopedom,
dataPopedom: dataPopedom
}
this.saveData(params)
},
async saveData(params) {
let res = await PopedomSaveData(params)
if (res.code == 1) {
this.$vmNews('保存成功', 'success')
this.activeName = 'jurisdictionSetting'
this.settingDialog = false
this.$store.dispatch('GenerateRoutes').then((accessRoutes) => {
// 根据roles权限生成可访问的路由表
for (let i = 0, length = accessRoutes.length; i < length; i += 1) {
const element = accessRoutes[i]
router.addRoutes(accessRoutes) // 动态添加可访问路由表
}
localStorage.setItem('routeList', JSON.stringify(accessRoutes))
})
}
},
getDataPopedom(dataPopedom) {
let array = []
dataPopedom.forEach((el) => {
el.dp_popeList = []
el.buttonList.forEach((item) => {
if (item.type) {
el.dp_popeList.push(item.id)
}
})
})
dataPopedom.forEach((el) => {
if (el.dp_popeList.length > 0) {
let params = {
dp_billKindID: el.billKindID,
dp_popeList: el.dp_popeList.join(',')
}
array.push(params)
}
})
return array
},
getButtonPopedom(buttonPopedom) {
let array = []
// let op_OperateKindList = []
buttonPopedom.forEach((el) => {
el.op_MenuID = el.id
el.op_OperateKindList = []
el.buttonList.forEach((item) => {
if (item.type) {
el.op_OperateKindList.push(item.id)
}
})
})
buttonPopedom.forEach((el) => {
if (el.op_OperateKindList.length > 0) {
let params = {
op_MenuID: el.op_MenuID,
op_OperateKindList: el.op_OperateKindList.join(',')
}
array.push(params)
}
})
return array
}
}
}
</script>
<style scoped>
>>>.el-dialog__body {
padding: 0 25px;
<style scoped lang="scss">
> > > .el-dialog__body {
padding: 0 25px;
}
</style>
<style scoped lang='scss'>
<style scoped lang="scss">
.roleName {
padding: 10px 0;
width: 90px;
border: 2px solid #f2f2f2;
background-color: #f2f2f2;
margin: 0px 10px 10px 0px;
text-align: center;
cursor: pointer;
box-shadow: 0 0 0 2px #f2f2f2;
border-radius: 5px;
padding: 10px 0;
width: 90px;
border: 2px solid #f2f2f2;
background-color: #f2f2f2;
margin: 0px 10px 10px 0px;
text-align: center;
cursor: pointer;
box-shadow: 0 0 0 2px #f2f2f2;
border-radius: 5px;
}
.active {
background-color: #00a490;
border: 2px solid #ffffff;
color: white;
box-shadow: 0 0 0 2px #00a490;
background-color: #00a490;
border: 2px solid #ffffff;
color: white;
box-shadow: 0 0 0 2px #00a490;
}
.bigTitle {
padding-bottom: 10px;
margin: 10px 0;
font-size: 16px;
font-weight: bold;
border-bottom: 1px solid #ccc;
padding-bottom: 10px;
margin: 10px 0;
font-size: 16px;
font-weight: bold;
border-bottom: 1px solid #ccc;
}
.organizationBody {
display: flex;
justify-content: space-evenly;
background-color: #f2f3f4;
padding: 10px
display: flex;
justify-content: space-evenly;
background-color: #f2f3f4;
padding: 10px;
}
</style>

170
src/views/systemSettings/jurisdictionManage/userJurisdiction/jurisdictionSetting.vue
View File

@ -1,13 +1,13 @@
<template>
<div flex v-loading="menuLoading">
<base-layout ref="layout" :bodyHight="treeHight" :operateButtonSwitch="false">
<div slot="main">
<base-tree ref="menuTree" :isCenter="false" :showCheckbox="true" :menuData="menuData" :setting="true"
@checkChange="checkChange">
</base-tree>
</div>
</base-layout>
</div>
<div flex v-loading="menuLoading">
<base-layout ref="layout" :bodyHight="treeHight" :operateButtonSwitch="false">
<div slot="main">
<base-tree ref="menuTree" :isCenter="false" :showCheckbox="true" :menuData="menuData" :setting="true"
@checkChange="checkChange">
</base-tree>
</div>
</base-layout>
</div>
</template>
<script>
@ -16,102 +16,102 @@ import baseTable from "@/components/base/baseTable";
import baseTree from "@/components/base/BaseMenuTree/index.vue";
import configData from "./configData";
import {
GetPppedomSet,
GetAllButton,
GetPppedomSet,
GetAllButton,
} from '@/api/apis/jurisdiction'
export default {
name: "jurisdictionSetting",
components: {
baseLayout,
baseTable,
baseTree
},
props: {
objectID: {
type: [Number, String, Boolean],
default: false
},
menuData: {
type: Array,
default: []
},
name: "jurisdictionSetting",
components: {
baseLayout,
baseTable,
baseTree
},
props: {
objectID: {
type: [Number, String, Boolean],
default: false
},
menuData: {
type: Array,
default: []
},
},
data() {
return {
treeHight: '500px',
mainHight: 'calc(100% - 80px)',
classifyButtonList: [],
buttonArray: [],
colorsKey: false,
menuLoading: false,
menuPopedom: [],
buttonPopedom: []
}
},
computed: {
},
data() {
return {
treeHight: '500px',
mainHight: 'calc(100% - 80px)',
classifyButtonList: [],
buttonArray: [],
colorsKey: false,
menuLoading: false,
menuPopedom: [],
buttonPopedom: []
}
},
computed: {
},
watch: {
},
watch: {
},
created() {
},
created() {
},
onShow() { },
mounted() {
this.initPage()
},
filters: {
},
onShow() { },
mounted() {
this.initPage()
},
filters: {
},
methods: {
// 初始化页面
initPage() {
},
checkChange(ids, checkdata) {
this.menuPopedom = ids
this.checkdata = checkdata
},
},
methods: {
// 初始化页面
initPage() {
},
checkChange(ids, checkdata) {
this.menuPopedom = ids
this.checkdata = checkdata
},
typeChange(item) {
item.type = !item.type
this.$forceUpdate()
},
typeChange(item) {
item.type = !item.type
this.$forceUpdate()
},
},
},
}
</script>
<style scoped lang='scss'>
.buttonSetting {
margin: 10px 0;
margin: 10px 0;
}
</style>
<style lang="scss">
$activeColor: var(--bg-color, "#00aaff");
// $activeColor: var(--bg-color, "#00aaff");
.el-icon-star-on {
/* color: #00aa00; */
color: $activeColor;
}
// .el-icon-star-on {
// /* color: #00aa00; */
// color: $activeColor;
// }
.buttonSetting {
.recordText {
border: 1px solid #fff;
width: 100px;
padding: 10px 0;
text-align: center;
font-size: 12px;
cursor: pointer;
background: #f2f2f2;
color: #e0e0e0;
margin: 0px 3px;
}
.recordText {
border: 1px solid #fff;
width: 100px;
padding: 10px 0;
text-align: center;
font-size: 12px;
cursor: pointer;
background: #f2f2f2;
color: #e0e0e0;
margin: 0px 3px;
}
.recordText.active {
background: $activeColor;
color: #fff;
}
// .recordText.active {
// background: $activeColor;
// color: #fff;
// }
}
</style>

121
src/views/systemSettings/jurisdictionManage/userJurisdiction/layOutPermissions.vue Normal file
View File

@ -0,0 +1,121 @@
<template>
<div>
<el-table
ref="multipleTable"
:data="tableData"
style="width: 100%"
:show-header="false"
>
<el-table-column prop="billName" label="模块" width="120">
</el-table-column>
<el-table-column prop="dataList" label="字段">
<template slot-scope="scope">
<i
class="el-icon-star-on"
style="
height: 30px;
line-height: 30px;
font-size: 25px;
margin-right: 7px;
"
v-show="btnShowHandle(homeList,true)"
@click="cancellation(homeList)"
></i>
<i
class="el-icon-star-on"
style="
height: 30px;
line-height: 30px;
font-size: 25px;
margin-right: 7px;
color: #808080;
"
v-show="btnShowHandle(homeList,false)"
@click="selectAllButton(homeList)"
></i>
<el-checkbox v-model="item.check" v-for="item in homeList">{{ item.name }}</el-checkbox>
</template>
</el-table-column>
</el-table>
</div>
</template>
<script>
import config from '@/views/doraChunk/config/indexChunkConfig.js'
import { mapMutations } from 'vuex'
export default {
data() {
return {
tableData: [
{
billName: '首页拖拽模块',
dataList: config.config.map((item) => {
let obj = {
id: item.componentName,
name: item.name
}
return obj
}),
buttonList: []
}
],
selectedList: '',
homeList: []
}
},
created() {
},
components: {},
computed: {},
mounted() {
},
beforeUpdate() {
this.handleTabClick()
},
methods: {
//判断全选是否显示
btnShowHandle(list, flag = false) {
if (!list.length) return false
let flagResult = list.every(item => {
return item.check
})
if (flag) {
return flagResult
} else {
return !flagResult
}
},
selectAllButton(item) {
console.log(item)
item.forEach(item => {
item.check = true
})
},
cancellation(item) {
item.forEach(item => {
item.check = false
})
},
handleTabClick() {
this.$nextTick(() => {
this.$refs.multipleTable && this.$refs.multipleTable.doLayout()
})
}
},
watch: {
selectedList(newV, oldV) {
let tempArr = newV.split(',')
this.tableData[0].buttonList = tempArr
}
}
}
</script>
<style scoped lang="scss"></style>

226
src/views/systemSettings/jurisdictionManage/userJurisdiction/menuSetting.vue
View File

@ -1,131 +1,131 @@
<template>
<div v-if="useMenuList">
<div v-for="(item, index) in menuList" :key="index" class="classifyButtonList">
<div flex="cross:center" flex-wrap>
<div class="title" @click="menuclick(item)">
<i :class="item.type?'el-icon-star-on':'el-icon-star-off'"></i>
<span :class="{'active':item.type}">{{item.label}}</span>
</div>
<div v-if="useMenuList">
<div v-for="(item, index) in menuList" :key="index" class="classifyButtonList">
<div flex="cross:center" flex-wrap>
<div class="title" @click="menuclick(item)">
<i :class="item.type?'el-icon-star-on':'el-icon-star-off'"></i>
<span :class="{'active':item.type}">{{item.label}}</span>
</div>
</div>
<menu-tree v-if="item.children" :use-menu-list="true" :parent-tree-data="item.children" ></menu-tree>
</div>
</div>
</div>
<menu-tree v-if="item.children" :use-menu-list="true" :parent-tree-data="item.children" ></menu-tree>
</div>
</div>
</template>
<script>
export default {
name: "menuTree",
props: {
useMenuList: {
type: Boolean,
default: false,
},
parentTreeData: {
type: Array,
default: () => {
return []
}
},
},
data() {
return {
menuList: [],
menuPopedom: []
}
},
created() {
this.menuList = Object.assign([], this.parentTreeData)
},
export default {
name: "menuTree",
props: {
useMenuList: {
type: Boolean,
default: false,
},
parentTreeData: {
type: Array,
default: () => {
return []
}
},
},
data() {
return {
menuList: [],
menuPopedom: []
}
},
created() {
this.menuList = Object.assign([], this.parentTreeData)
},
methods: {
menuclick(item) {
item.type = !item.type
// if (item.children != null && item.children && item.children.length) {
// this.allClick(item.children,item.type )
// }
this.menuPopedom.push(item.id)
this.setMenuPopedom(this.menuPopedom)
this.$forceUpdate()
},
setMenuPopedom(arr) {
let newArr = []
arr.forEach((val)=>{
if(newArr.indexOf(val) == -1){
newArr.push(val)
}
})
this.menuPopedom = newArr
},
allClick(data, type) {
data.forEach(el => {
el.type = type
if (el.children != null && el.children && el.children.length) {
this.allClick(el.children, type)
}
})
},
changeMenu(data, num) {
let level = num
level = level + 1
data.forEach(el => {
el.buttonList = []
// el.isShow = true
el.level = level
if (el.children != null && el.children && el.children.length) {
this.changeMenu(el.children, level)
}
})
},
}
}
methods: {
menuclick(item) {
item.type = !item.type
// if (item.children != null && item.children && item.children.length) {
// this.allClick(item.children,item.type )
// }
this.menuPopedom.push(item.id)
this.setMenuPopedom(this.menuPopedom)
this.$forceUpdate()
},
setMenuPopedom(arr) {
let newArr = []
arr.forEach((val)=>{
if(newArr.indexOf(val) == -1){
newArr.push(val)
}
})
this.menuPopedom = newArr
},
allClick(data, type) {
data.forEach(el => {
el.type = type
if (el.children != null && el.children && el.children.length) {
this.allClick(el.children, type)
}
})
},
changeMenu(data, num) {
let level = num
level = level + 1
data.forEach(el => {
el.buttonList = []
// el.isShow = true
el.level = level
if (el.children != null && el.children && el.children.length) {
this.changeMenu(el.children, level)
}
})
},
}
}
</script>
<style lang="scss">
$activeColor: var(--bg-color, "#00aaff");
$activeColor: var(--bg-color, "#00aaff");
.el-icon-star-on {
/* color: #00aa00; */
color: $activeColor;
}
.el-icon-star-on {
/* color: #00aa00; */
color: $activeColor;
}
.classifyButtonList {
s .active {
color: $activeColor;
}
}
.classifyButtonList {
s .active {
color: $activeColor;
}
}
// .recordText {
// border: 1px solid #fff;
// padding: 3px 10px;
// text-align: center;
// font-size: 14px;
// cursor: pointer;
// background: #f2f2f2;
// color: #4e4e4e;
// margin:5px;
// border-radius: 5px;
// }
// .recordText {
// border: 1px solid #fff;
// padding: 3px 10px;
// text-align: center;
// font-size: 14px;
// cursor: pointer;
// background: #f2f2f2;
// color: #4e4e4e;
// margin:5px;
// border-radius: 5px;
// }
// .recordText.active {
// background-color: $activeColor;
// color: white;
// }
// .recordText.active {
// background-color: $activeColor;
// color: white;
// }
</style>
<style scoped lang="scss">
.tree-div {}
.tree-div {}
.classifyButtonList {
// margin-bottom: 10px;
padding: 0 0 0 10px;
// cursor: pointer;
line-height: 25px;
.classifyButtonList {
// margin-bottom: 10px;
padding: 0 0 0 10px;
// cursor: pointer;
line-height: 25px;
.title {
// text-align: right;
cursor: pointer;
width: 100%;
border-bottom: 1px solid #ccc;
}
.title {
// text-align: right;
cursor: pointer;
width: 100%;
border-bottom: 1px solid #ccc;
}
}
}
</style>

758
src/views/systemSettings/jurisdictionManage/userJurisdiction/newSetting.vue
View File

@ -1,410 +1,410 @@
<template>
<div>
<el-tabs v-model="activeName" type="card" @tab-click="handleClick">
<el-tab-pane label="菜单权限" name="first">
<!-- 最外围 -->
<div v-for="item in dataList">
<div class="listBox">
<div class="list p-10" @click="muenclick(1,item)">
<i :class="item.type?'el-icon-star-on':'el-icon-star-off'"></i>
<p>{{item.title}}</p>
</div>
<div class="list" v-for="itemA in item.children">
<div class="list p-10" @click="muenclick(2,itemA)">
<i :class="itemA.type ?'el-icon-star-on':'el-icon-star-off'"></i>
<p>{{itemA.title}}</p>
</div>
<div class="list p-10 ml-10" v-for="itemB in itemA.children" @click="muenclick(3,itemB)">
<i :class="itemB.type?'el-icon-star-on':'el-icon-star-off'"></i>
<p>{{itemB.title}}</p>
</div>
</div>
</div>
</div>
<div>
<el-tabs v-model="activeName" type="card" @tab-click="handleClick">
<el-tab-pane label="菜单权限" name="first">
<!-- 最外围 -->
<div v-for="item in dataList">
<div class="listBox">
<div class="list p-10" @click="muenclick(1,item)">
<i :class="item.type?'el-icon-star-on':'el-icon-star-off'"></i>
<p>{{item.title}}</p>
</div>
<div class="list" v-for="itemA in item.children">
<div class="list p-10" @click="muenclick(2,itemA)">
<i :class="itemA.type ?'el-icon-star-on':'el-icon-star-off'"></i>
<p>{{itemA.title}}</p>
</div>
<div class="list p-10 ml-10" v-for="itemB in itemA.children" @click="muenclick(3,itemB)">
<i :class="itemB.type?'el-icon-star-on':'el-icon-star-off'"></i>
<p>{{itemB.title}}</p>
</div>
</div>
</div>
</div>
</el-tab-pane>
<el-tab-pane label="按钮权限" name="second">
<div class="p-10 list listBox" v-for="item in ButtonList">
<div style="display: flex;align-items: center;" @click="recordAll(item)">
<p>{{item.billid}}</p>
<i :class="item.type?'el-icon-star-on':'el-icon-star-off'"></i>
</div>
<div style="display: flex;margin-left: 10px;">
<p class="recordText" v-for="el in item.dataDetail" :class="{'active':el.type}"
@click="typeChange(el)">{{el.name}}</p>
</div>
</div>
</el-tab-pane>
<el-tab-pane label="数据权限" name="third">
<div class="p-10 list listBox" v-for="item in recordList">
<div style="display: flex;align-items: center;" @click="recordAll(item)">
<p>{{item.billid}}</p>
<i :class="item.type?'el-icon-star-on':'el-icon-star-off'"></i>
</div>
<div style="display: flex;margin-left: 10px;">
<p class="recordText" v-for="el in item.dataDetail" :class="{'active':el.type}"
@click="typeChange(el)">{{el.name}}</p>
</div>
</div>
</el-tab-pane>
</el-tabs>
</div>
</el-tab-pane>
<el-tab-pane label="按钮权限" name="second">
<div class="p-10 list listBox" v-for="item in ButtonList">
<div style="display: flex;align-items: center;" @click="recordAll(item)">
<p>{{item.billid}}</p>
<i :class="item.type?'el-icon-star-on':'el-icon-star-off'"></i>
</div>
<div style="display: flex;margin-left: 10px;">
<p class="recordText" v-for="el in item.dataDetail" :class="{'active':el.type}"
@click="typeChange(el)">{{el.name}}</p>
</div>
</div>
</el-tab-pane>
<el-tab-pane label="数据权限" name="third">
<div class="p-10 list listBox" v-for="item in recordList">
<div style="display: flex;align-items: center;" @click="recordAll(item)">
<p>{{item.billid}}</p>
<i :class="item.type?'el-icon-star-on':'el-icon-star-off'"></i>
</div>
<div style="display: flex;margin-left: 10px;">
<p class="recordText" v-for="el in item.dataDetail" :class="{'active':el.type}"
@click="typeChange(el)">{{el.name}}</p>
</div>
</div>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script>
import baseDialog from "@/components/base/BaseNewDialog/index.vue";
export default {
name: "review",
components: {
baseDialog
},
data() {
return {
activeName: 'first',
// 数据权限
ButtonList:[],
recordList: [{
billid: '合同管理',
type: false,
ids:[],
dataDetail: [
{name: '浙江用安',
id: 60,
type: false,
},
{
name: '销售部',
id: 58,
type: false,
},
{
name: '实施服务',
id: 61,
type: false,
},
],
},
{
billid: '项目管理',
type: true,
dataDetail: [
{
name: '浙江用安',
id: 60,
type: false,
},
{
name: '销售部',
id: 58,
type: false,
},
{
name: '实施服务',
id: 61,
type: false,
},
],
},
],
dataList: [{
title: '系统管理',
type: 1,
id:1,
children: [{
title: '数据字典',
type: false,
id:2
},
{
title: '用户管理',
type: 1,
id:3,
children: [{
title: '角色管理',
type: true,
id:4
},
{
title: '人员管理',
type: false,
id:5
},
]
}
]
},
{
title: '系统维护',
type: false,
id:6,
children: [{
title: 'LayUI图标库',
type: false,
id:7
}]
}
],
}
},
watch: {
dataList: {
deep: true, //深度监听设置为 true
handler: function(newV, oldV) {
newV.forEach(el => {
el.children.forEach(item => {
if (item.type == true) {
el.type = true
}
if (item.children && item.children.length > 0) {
item.children.forEach(last => {
if (last.type == true) {
el.type = true
}
})
}
})
})
}
},
recordList: {
deep: true, //深度监听设置为 true
handler: function(newV, oldV) {
let num = 0
newV.forEach(el => {
el.dataDetail.forEach(item => {
if (item.type == true) {
el.type = true
num = num +1
}
})
if(num == 0){
el.type = false
}
})
import baseDialog from "@/components/base/BaseNewDialog/index.vue";
export default {
name: "review",
components: {
baseDialog
},
data() {
return {
activeName: 'first',
// 数据权限
ButtonList:[],
recordList: [{
billid: '合同管理',
type: false,
ids:[],
dataDetail: [
{name: '浙江用安',
id: 60,
type: false,
},
{
name: '销售部',
id: 58,
type: false,
},
{
name: '实施服务',
id: 61,
type: false,
},
],
},
{
billid: '项目管理',
type: true,
dataDetail: [
{
name: '浙江用安',
id: 60,
type: false,
},
{
name: '销售部',
id: 58,
type: false,
},
{
name: '实施服务',
id: 61,
type: false,
},
],
},
],
dataList: [{
title: '系统管理',
type: 1,
id:1,
children: [{
title: '数据字典',
type: false,
id:2
},
{
title: '用户管理',
type: 1,
id:3,
children: [{
title: '角色管理',
type: true,
id:4
},
{
title: '人员管理',
type: false,
id:5
},
]
}
]
},
{
title: '系统维护',
type: false,
id:6,
children: [{
title: 'LayUI图标库',
type: false,
id:7
}]
}
],
}
},
watch: {
dataList: {
deep: true, //深度监听设置为 true
handler: function(newV, oldV) {
newV.forEach(el => {
el.children.forEach(item => {
if (item.type == true) {
el.type = true
}
if (item.children && item.children.length > 0) {
item.children.forEach(last => {
if (last.type == true) {
el.type = true
}
})
}
})
})
}
},
recordList: {
deep: true, //深度监听设置为 true
handler: function(newV, oldV) {
let num = 0
newV.forEach(el => {
el.dataDetail.forEach(item => {
if (item.type == true) {
el.type = true
num = num +1
}
})
if(num == 0){
el.type = false
}
})
}
},
},
}
},
},
methods: {
methods: {
getMenuTreeselect() {
menuTreeselect().then((response) => {
const parseTree = (arr) => {
if (arr.length > 0) {
arr.forEach(item => {
if (item.id) {
item['label'] = this.$t(allPermis.filter(p => p.id === item.id)[0]?.localKey)
}
if (item.children && item.children.length > 0) {
parseTree(item.children)
}
})
}
return arr
}
this.menuOptions = parseTree(response.data)
})
},
getMenuTreeselect() {
menuTreeselect().then((response) => {
const parseTree = (arr) => {
if (arr.length > 0) {
arr.forEach(item => {
if (item.id) {
item['label'] = this.$t(allPermis.filter(p => p.id === item.id)[0]?.localKey)
}
if (item.children && item.children.length > 0) {
parseTree(item.children)
}
})
}
return arr
}
this.menuOptions = parseTree(response.data)
})
},
handleClick(tab, event) {
let ids = []
const parseTree = (arr) =>{
arr.forEach(item =>{
if(item.type){
ids.push(item.id)
}
if (item.children && item.children.length > 0) {
parseTree(item.children)
}
})
return ids
}
let vrr = parseTree(this.dataList)
this.getButtonList(vrr)
},
async getButtonList(vrr){
this.ButtonList = []
let arr = {
billid: '用户管理',
type: false,
ids:[],
dataDetail: [
{ name: '新增',
id: 60,
type: false,
},
{
name: '编辑',
id: 58,
type: false,
},
{
name: '删除',
id: 61,
type: true,
},
],
}
if(vrr.length > 0){
vrr.forEach(el=>{
if(el == 3){
this.ButtonList.push(arr)
}
})
}
},
// 数据权限全选
recordAll(item) {
item.dataDetail.forEach(el => {
if (item.type ==false) {
this.AllType(el, true)
} else {
this.AllType(el, false)
}
})
this.typeChange(item)
},
// 改变选中
typeChange(item) {
if (item.type == true) {
item.type = false
} else {
item.type = true
}
},
AllType(item, type) {
item.type = type
},
muenclick(index, item) {
let ids = []
// index代表多少级菜单
if (index == 1) {
if (item.type == false) {
ids.push(item.id)
this.AllType(item, true)
item.children.forEach(el => {
this.AllType(el, true)
if (el.children && el.children.length > 0) {
el.children.forEach(small => {
ids.push(item.id)
this.AllType(small, true)
})
}
})
} else {
this.AllType(item, false)
item.children.forEach(el => {
this.AllType(el, false)
if (el.children && el.children.length > 0) {
el.children.forEach(small => {
this.AllType(small, false)
})
}
})
}
} else {
this.typeChange(item)
}
}
},
mounted() {
handleClick(tab, event) {
let ids = []
const parseTree = (arr) =>{
arr.forEach(item =>{
if(item.type){
ids.push(item.id)
}
if (item.children && item.children.length > 0) {
parseTree(item.children)
}
})
return ids
}
let vrr = parseTree(this.dataList)
this.getButtonList(vrr)
},
async getButtonList(vrr){
this.ButtonList = []
let arr = {
billid: '用户管理',
type: false,
ids:[],
dataDetail: [
{ name: '新增',
id: 60,
type: false,
},
{
name: '编辑',
id: 58,
type: false,
},
{
name: '删除',
id: 61,
type: true,
},
],
}
if(vrr.length > 0){
vrr.forEach(el=>{
if(el == 3){
this.ButtonList.push(arr)
}
})
}
},
// 数据权限全选
recordAll(item) {
item.dataDetail.forEach(el => {
if (item.type ==false) {
this.AllType(el, true)
} else {
this.AllType(el, false)
}
})
this.typeChange(item)
},
// 改变选中
typeChange(item) {
if (item.type == true) {
item.type = false
} else {
item.type = true
}
},
AllType(item, type) {
item.type = type
},
muenclick(index, item) {
let ids = []
// index代表多少级菜单
if (index == 1) {
if (item.type == false) {
ids.push(item.id)
this.AllType(item, true)
item.children.forEach(el => {
this.AllType(el, true)
if (el.children && el.children.length > 0) {
el.children.forEach(small => {
ids.push(item.id)
this.AllType(small, true)
})
}
})
} else {
this.AllType(item, false)
item.children.forEach(el => {
this.AllType(el, false)
if (el.children && el.children.length > 0) {
el.children.forEach(small => {
this.AllType(small, false)
})
}
})
}
} else {
this.typeChange(item)
}
}
},
mounted() {
}
}
}
}
</script>
<style scoped lang="scss">
.recordText {
border: 1px solid #fff;
width: 60px;
padding: 5px 0;
text-align: center;
font-size: 12px;
cursor: pointer;
background: #f2f2f2;
color: #e0e0e0;
margin: 0px 3px;
}
.recordText {
border: 1px solid #fff;
width: 60px;
padding: 5px 0;
text-align: center;
font-size: 12px;
cursor: pointer;
background: #f2f2f2;
color: #e0e0e0;
margin: 0px 3px;
}
.recordText.active {
background: #00a490;
color: #fff;
}
.recordText.active {
background: #00a490;
color: #fff;
}
.listBox {
border-top: 1px solid #ccc;
}
.listBox {
border-top: 1px solid #ccc;
}
.list {
display: flex;
align-content: center;
cursor: pointer;
}
.list {
display: flex;
align-content: center;
cursor: pointer;
}
.ml-10 {
margin-left: 10px;
}
.ml-10 {
margin-left: 10px;
}
.p-10 {
padding: 10px 0;
}
.p-10 {
padding: 10px 0;
}
.small.active {
border-color: crimson transparent transparent transparent;
}
.small.active {
border-color: crimson transparent transparent transparent;
}
.small.active:before,
.small.active:after {
border-color: crimson transparent transparent transparent;
}
.small.active:before,
.small.active:after {
border-color: crimson transparent transparent transparent;
}
.small {
border-color: #7d7d7d transparent transparent transparent;
border-style: solid;
border-top-width: 9.375px;
border-right-width: 15px;
border-left-width: 15px;
height: 0;
margin-top: 9.375px;
margin-bottom: 6.02679px;
position: relative;
width: 0;
margin: 2rem 0.8rem;
}
.small {
border-color: #7d7d7d transparent transparent transparent;
border-style: solid;
border-top-width: 9.375px;
border-right-width: 15px;
border-left-width: 15px;
height: 0;
margin-top: 9.375px;
margin-bottom: 6.02679px;
position: relative;
width: 0;
margin: 2rem 0.8rem;
}
.small:before,
.small:after {
border-color: #7d7d7d transparent transparent transparent;
border-style: solid;
border-top-width: 9.375px;
border-right-width: 15px;
border-left-width: 15px;
content: '';
display: block;
height: 0;
left: -15px;
position: absolute;
top: -9.375px;
width: 0;
}
.small:before,
.small:after {
border-color: #7d7d7d transparent transparent transparent;
border-style: solid;
border-top-width: 9.375px;
border-right-width: 15px;
border-left-width: 15px;
content: '';
display: block;
height: 0;
left: -15px;
position: absolute;
top: -9.375px;
width: 0;
}
.small:before {
transform: rotate(70deg);
}
.small:before {
transform: rotate(70deg);
}
.small:after {
transform: rotate(-70deg);
}
.small:after {
transform: rotate(-70deg);
}
</style>
<style lang="scss">
$activeColor: var(--bg-color, "#00aaff");
.el-icon-star-on{
/* color: #00aa00; */
color: $activeColor;
}
$activeColor: var(--bg-color, "#00aaff");
.el-icon-star-on{
/* color: #00aa00; */
color: $activeColor;
}
</style>

392
src/views/systemSettings/jurisdictionManage/userJurisdiction/rightDialog.vue Normal file
View File

@ -0,0 +1,392 @@
<template>
<div>
<base-right-dialog
ref="baseRightDialog"
:footerShow="true"
:appendBody="true"
:dialogVisible.sync="drawer"
:withHeader="false"
title="权限分配"
@handleClose="handleDialogClose"
@handleConfirmClick="handleConfirmClick"
:size="'60%'"
>
<el-tabs v-model="activeName">
<el-tab-pane label="功能权限" name="first">
<el-table
border
ref="multipleTable"
:data="menuDatas"
row-key="id"
tooltip-effect="dark"
style="width: 100%"
:default-expand-all="true"
:default-checked-keys="keys"
@select-all="selectAll"
@select="handleSelectionChange"
v-loading="buttonLoading"
>
<el-table-column
type="selection"
width="45"
:reserve-selection="true"
></el-table-column>
<el-table-column
prop="name"
label="菜单名称"
width="200"
></el-table-column>
<el-table-column prop="buttonSelection" label="按钮">
<template slot-scope="scope">
<div style="display: flex;align-items: center">
<i
class="el-icon-star-on"
style="
height: 30px;
line-height: 30px;
font-size: 25px;
margin-right: 7px;
cursor: pointer;
"
v-show="btnShowHandle(scope.row.buttonList,true)"
@click="cancellation(scope.row.buttonList)"
></i>
<i
class="el-icon-star-on"
style="
height: 30px;
line-height: 30px;
font-size: 25px;
margin-right: 7px;
color: #808080;
cursor: pointer;
"
@click="selectAllButton(scope.row.buttonList)"
v-show="btnShowHandle(scope.row.buttonList,false)"
></i>
<el-checkbox v-model="item.check" v-for="item in scope.row.buttonList">{{ item.nameCh }}</el-checkbox>
</div>
</template>
</el-table-column>
</el-table>
</el-tab-pane
>
<el-tab-pane label="数据权限" name="second">
<data-permissions ref="dataPermissions"></data-permissions>
</el-tab-pane>
<el-tab-pane label="首页拖拽权限" name="layOutAuth">
<layOutPermissions ref="layOutPermissions"></layOutPermissions>
</el-tab-pane>
</el-tabs>
</base-right-dialog>
</div>
</template>
<script>
import baseRightDialog from '@/components/base/baseRightDialog'
import { PopedomSaveData, GetAllBilldata } from '@/api/apis/jurisdiction'
import dataPermissions from './dataPermissions.vue'
import layOutPermissions from './layOutPermissions.vue'
import loginVue from '../../../login.vue'
import { authApi } from '@/api/apis/auth'
export default {
data() {
return {
drawer: false,
multipleSelection: [],
keys: [],
isAllSelect: false,
selected: false,
childNode: false,
build: '',
activeName: 'first',
dataPermissions: [],
buttonLoading: false,
menuDatas: []
}
},
props: {
menuData: {
type: Array,
default: () => {
return []
}
}
},
components: {
baseRightDialog,
dataPermissions,
layOutPermissions
},
beforeUpdate() {
this.handleTabClick()
},
computed: {
// menuDatas: {
// // return JSON.parse(JSON.stringify(this.menuData));
// get: function () {
// return JSON.parse(JSON.stringify(this.menuData));
// },
// set: function (item) {
// return JSON.parse(JSON.stringify(item));
// },
// },
},
methods: {
//判断全选是否显示
btnShowHandle(list, flag = false) {
if (!list.length) return false
let flagResult = list.every(item => {
return item.check
})
if (flag) {
return flagResult
} else {
return !flagResult
}
},
// tab切换
handleTabClick() {
this.$nextTick(() => {
this.$refs.multipleTable && this.$refs.multipleTable.doLayout()
})
},
selectAllButton(item) {
item.forEach(item => {
item.check = true
})
},
cancellation(item) {
item.forEach(item => {
item.check = false
})
},
// 全选/取消全选
selectAll() {
let data = this.treeToArray(this.menuDatas)
this.selected = !this.selected
data.forEach((el, index) => {
el.check = this.selected
this.$refs.multipleTable.toggleRowSelection(el, this.selected)
})
},
handleSelectionChange(val, row) {
row.check = !row.check
},
// 默认选中
exhibitList(menu, homeList, id) {
this.$refs.layOutPermissions.homeList = homeList
console.log(menu, 'menu')
// let data = this.treeToArray(this.menuDatas);
this.build = id
// data.forEach((el, index) => {
// if (id.includes(el.id)) {
// this.$refs.multipleTable.toggleRowSelection(el, true);
// }
// });
this.menuCheckHandle(menu)
this.menuDatas = menu
console.log(this.menuDatas, 'this.menuDatas')
this.buttonLoading = false
},
//数据处理
menuCheckHandle(arr) {
arr.forEach(item => {
if (item.check) {
this.$refs.multipleTable.toggleRowSelection(item, true)
}
if (item.children.length) {
this.menuCheckHandle(item.children)
}
})
},
// 数据扁平
treeToArray(items) {
let children = []
items.forEach((item) => {
children.push(item)
if (item.children) {
children = children.concat(this.treeToArray(item.children))
}
})
return children
},
handleDialogClose() {
let data = this.treeToArray(this.menuDatas)
data.forEach((el, index) => {
this.$refs.multipleTable.toggleRowSelection(el, false)
})
this.changeMenu(this.menuDatas, 0)
this.drawer = false
this.$parent.permissionPopup = false
},
async handleConfirmClick() {
let params = {
id: this.build,
kindId: 1,
sysPopedomHomeEntities: [],
sysPopedomMenuEntities: [],
sysPopedomOperateEntities: []
}
this.homeListHandle(params.sysPopedomHomeEntities)
this.menuListHandle(this.menuDatas, params.sysPopedomMenuEntities, params.sysPopedomOperateEntities)
const res = await authApi("sysUserService","","saveJurisdiction","",params)
if(res.status == '200'){
this.handleDialogClose();
this.$message({
message: "保存成功",
type: "success",
});
}
},
//处理首页拖拽
homeListHandle(arr) {
this.$refs.layOutPermissions.homeList.forEach(item => {
if (item.check) {
arr.push({ homeId: item.id })
}
})
},
//菜单数据处理
menuListHandle(list, result, btnResult) {
list.forEach(item => {
if (item.check) {
result.push({
menuId: item.id
})
}
if (item.children.length) {
this.menuListHandle(item.children, result,btnResult)
}
if (item.buttonList.length) {
this.btnListHandle(item.buttonList, btnResult, item.id)
}
})
},
//按钮选中处理
btnListHandle(list, btnResult, menuId) {
list.forEach(item => {
if (item.check) {
console.log(btnResult,'btnResult')
btnResult.push({
menuId,
operate: item.id
})
}
})
},
// 递归，添加选中按钮
addToButtonList(arr, newArr) {
newArr.forEach((newItem) => {
this.addToButtonListRecursive(
arr,
newItem.op_MenuID,
newItem.op_OperateKindList
)
})
return arr
},
addToButtonListRecursive(arr, targetId, operateKindList) {
for (let i = 0; i < arr.length; i++) {
const item = arr[i]
if (item.id == targetId) {
let lists = operateKindList.split(',')
lists.forEach((el) => {
item.buttonList.push(parseInt(el))
})
return item
}
if (item.children && item.children.length > 0) {
this.addToButtonListRecursive(
item.children,
targetId,
operateKindList
)
}
}
},
changeMenu(data, num) {
let level = num
level = level + 1
data.forEach((el) => {
el.buttonList = []
el.type = false
if (el.children != null && el.children && el.children.length) {
this.changeMenu(el.children, level)
}
})
},
toFlatArray(tree, parentId) {
return tree.reduce((t, _) => {
const child = _[children]
return [
...t,
parentId ? { ..._, parentId } : _,
...(child && child.length ? toFlatArray(child, _[id]) : [])
]
}, [])
},
getIds(flatArray) {
let ids = [nodeId]
let child = flatArray.find((_) => _[id] === nodeId)
while (child && child.parentId) {
ids = [child.parentId, ...ids]
child = flatArray.find((_) => _[id] === child.parentId)
}
return ids
},
treeFindPath(tree, func, field = '', path = []) {
if (!tree) return []
for (const data of tree) {
field === '' ? path.push(data) : path.push(data[field])
if (func(data)) return path
if (data.children) {
const findChildren = this.treeFindPath(
data.children,
func,
field,
path
)
if (findChildren.length) return findChildren
}
path.pop()
}
return []
}
}
}
</script>
<style scoped lang="scss">
.rightDialog {
height: 100%;
padding: 0 16px;
}
::v-deep .cell {
display: flex;
}
::v-deep .el-checkbox-group {
display: flex;
align-items: center;
flex-wrap: wrap;
}
::v-deep .el-checkbox {
margin-right: 15px;
}
::v-deep .el-tabs__nav {
transform: translateX(22px) !important;
}
</style>

282
src/views/systemSettings/organization/configData.js
View File

@ -1,120 +1,184 @@
// 表头配置
const tableColumnJson = [{
label: '所属部门',
prop: 'o_OrganName',
tooltip: true,
},
{
label: '工号',
prop: 'p_PersonCode',
tooltip: true,
},
{
label: '姓名',
prop: 'p_PersonName',
tooltip: true,
},
{
label: '入职时间',
prop: 'EntryTime',
tooltip: true,
},
const tableColumnJson = [
{
label: '所属部门',
prop: 'organName',
tooltip: true,
},
{
label: '工号',
prop: 'personCode',
tooltip: true,
},
{
label: '姓名',
prop: 'personName',
tooltip: true,
},
{
label: '入职时间',
prop: 'entryTime',
tooltip: true,
},
// {
// label: '固定电话 ',
// prop: 'p_MoiblePhone',
// tooltip: true,
// },
// {
// label: '电子邮箱',
// prop: 'p_Email',
// tooltip: true,
// },
{
label: '出生年月',
prop: 'p_BirthDay',
tooltip: true,
},
{
label: '是否用户分配',
prop: 'isuser',
tooltip: true,
width: 150
},
// {
// label: '固定电话 ',
// prop: 'p_MoiblePhone',
// tooltip: true,
// },
// {
// label: '电子邮箱',
// prop: 'p_Email',
// tooltip: true,
// },
{
label: '出生年月',
prop: 'p_BirthDay',
tooltip: true,
},
{
label: '是否用户分配',
prop: 'isuser',
tooltip: true,
width:150
},
]
// 详情页面结构JSON
const formRow = [{
elCol: [{
label: '上级机构',
prop: 'upId',
tag: 'elTreeSelect',
options:[]
}]
},
{
elCol: [{
label: '机构名称',
prop: 'orgName',
tag: 'elInput',
}]
},
{
elCol: [{
label: '部门编码',
prop: 'orgCode',
tag: 'elInput',
}]
},
{
elCol: [{
label: '类型',
prop: 'orgType',
tag: 'elRadio',
options: [{
label: '集团',
value: '1'
}, {
label: '公司',
value: '2'
}, {
label: '部门',
value: '3'
}]
}]
},
{
elCol: [{
label: '机构顺序',
prop: 'sorts',
tag: 'elInputNumber',
rules: true
}]
elCol: [{
label: '上级机构',
prop: 'parentOrganName',
tag: 'elDialog',
disabled:true,
}
]
},
{
elCol: [{
label: '机构名称',
prop: 'organName',
tag: 'elInput',
}
]
},
{
elCol: [{
label: '部门编码',
prop: 'organCode',
tag: 'elInput',
}
]
},
{
elCol: [{
label: '负责人',
prop: 'managerName',
tag: 'elDialog',
}
]
},
{
elCol: [{
label: '是否公司',
prop: 'company',
tag: 'elRadio',
options: [{
label: '是',
value: "1"
},{
label: '否',
value: "0"
}
]
}
]
},
{
elCol: [{
label: '是否启用',
prop: 'state',
tag: 'elRadio',
options: [{
label: '是',
value: "1"
},{
label: '否',
value: "0"
}
]
}
]
},
{
elCol: [{
label: '备注',
prop: 'remark',
tag: 'elInput',
type:'textarea',
span:24
}]
},
{
elCol: [{
label: '等级',
prop: 'lvl',
tag: 'elInput',
disabled: true
}]
},
},
]
const roleOptions = [{
label: '超级管理员',
value: 1
},
{
label: '业务员',
value: 2
},
{
label: '管理员',
value: 3
},
{
label: '开发成员',
value: 4
},
{
label: '项目经理',
value: 5
},
{
label: '实施人员',
value: 6
},
{
label: '财务',
value: 7
},
{
label: '总经理',
value: 8
},
{
label: '副总',
value: 9
}
]
const rules = {
orgName: [{
required: true,
message: '请输入机构名称',
trigger: 'change'
}],
orgCode: [{
required: true,
message: '请输入机构编码',
trigger: 'change'
}],
villageId: [{
required: true,
message: '请选择村/社区名称',
trigger: 'change'
}],
registerTime: [{
required: true,
message: '请选择登记时间',
trigger: 'change'
}],
};
// 详情显示图片配置
const showImgJson = {
span: 24,
text: '现场照片',
field: 'photoUrls',
};
export default {
formRow,
rules,
tableColumnJson
showImgJson,
formRow,
rules,
tableColumnJson
}

428
src/views/systemSettings/organization/index.vue
View File

@ -2,243 +2,310 @@
* @name: 组织机构
-->
<template>
<div flex style="height: 100%">
<base-layout
:title="'组织机构'"
style="width: 260px;"
:queryShow="false"
:searchShow="false"
:mainHight="`calc(100% - 58px)`"
>
<div
slot="main"
style="
height: 100%;
border-right: 1px solid #dfe6ec;
overflow-y: auto;
"
>
<base-tree
ref="baseTree"
:isCenter="false"
:isSaveBtn="false"
:Allshow="false"
:showCheckbox="false"
:treeLoading="treeLoading"
:menuData="menuData"
@handleNodeClick="treeNodeClick"
:treeProps="treeProps"
></base-tree>
<div style="height: 100%;">
<div flex v-loading="windowLoading" style="height: 100%;">
<base-layout title="组织机构" style="width:260px;overflow: auto;" :bottonShow="false" :isPage="false"
:operateButtonSwitch="false" :mainColor="mainColor">
<div slot="main" style="height: 100%;border-right: 1px solid #dfe6ec;overflow-y: auto;">
<base-tree ref="baseTree" :isCenter="false" :isSaveBtn="false" :Allshow="false" :showCheckbox="false"
:menuData="menuData" @handleNodeClick="treeNodeClick"></base-tree>
</div>
</base-layout>
<base-layout
title="机构编辑区"
:bottonShow="false"
:isPage="false"
:queryShow="false"
:searchShow="false"
:buttonList="buttonList"
style="flex: 1"
:defaultButtonSwitch="false"
@onFuncBtn="getFuncBtn"
>
<div
slot="main"
style="width: 100%; height: auto !important; padding: 0 20px"
>
<base-form
ref="customForm"
:formRow="formRow"
:isFunBtn="isFunBtn"
:rules="rules"
class="form-control"
@onSubmit="getSubmit"
@resetForm="clearPage"
>
<base-layout title="机构编辑区" :bottonShow="false" :isPage="false" :buttonList="buttonList" style="flex:1; "
:defaultButtonSwitch="false" @onFuncBtn="getFuncBtn">
<div slot="main" style="width: 100%;height: 100%; padding: 0 20px;">
<base-form ref="customForm" :formRow="orangformRow" :isFunBtn="isFunBtn" @elDialogClick="elDialogClick"
class="form-control" @onSubmit="getSubmit" v-loading="formLoading">
</base-form>
</div>
</base-layout>
</div>
<!-- 机构选择 -->
<base-organization ref="baseOrganization" :dialogVisible="organizationDialog" :menuData="menuData"
@handleConfirmClick="handleConfirmClick"></base-organization>
<!-- 负责人 -->
<base-person ref="basePerson" :menuData="menuData" :tableColumn="tableColumn"
@personConfirmClick="personConfirmClick"></base-person>
</div>
</template>
<script>
import { authApi } from "@/api/apis/auth";
import baseLayout from "@/components/base/baseLayout";
import baseTable from "@/components/base/baseTable";
import baseForm from "@/components/base/baseNewForm/index.vue";
import baseDialog from "@/components/base/BaseNewDialog/index.vue";
import baseTree from "@/components/base/BaseMenuTree/index.vue";
import baseOrganization from "@/components/base/baseOrganization/index.vue";
import basePerson from "@/components/base/basePerson/index.vue";
import configData from "./configData";
import { authApi } from "@/api/apis/auth";
import { getCompanyId } from '@/utils/auth'
import {
GetOrganTree,
OrganGetBillData,
OrganSaveData,
OrganDelData
} from '@/api/apis/organization'
import {
PersonList
} from '@/api/apis/personnelSettings'
export default {
name: "organization",
name: 'organization',
components: {
baseLayout,
baseTree,
baseForm,
baseDialog,
baseTable,
baseOrganization,
basePerson
},
data() {
return {
treeProps: {
children: "children",
label: "orgName",
radioIndex: false,
windowLoading: false,
formLoading: false,
selectForm: {
P_PersonName: '',
P_PersonID: ''
},
buttonList: [
{
icon: "el-icon-plus",
menuName: "新增子节点",
},
{
type: "danger",
menuName: "删除",
icon: "el-icon-delete",
},
], //按钮
theme: '',
personLoading: false, //人员加载
// topmainHight: 'calc(100% - 41px)', //内容高度
orangMainHight: 'calc(100% - 38px)', //组织弹框高度
orangHight: 'calc(100% - 38px)', //组织高度
organizationDialog: false, //选择组织机构弹窗
mainColor: '#f8f8f8 ', //背景颜色
buttonList: [{
'icon': 'el-icon-plus',
'menuName': '新增根节点'
}, {
'icon': 'el-icon-plus',
'menuName': '新增子节点'
}, {
'type': 'danger',
'menuName': '删除',
'icon': 'el-icon-delete'
},], //按钮
menuData: [], //树状图数据
formRow: configData.formRow, //表头
ruleForm: {}, //参数
orangformRow: configData.formRow, //表头
isFunBtn: true,
organizationForm: {},
// 分页数据
delId: null,
orgForm: "",
rules: configData.rules,
treeLoading: false,
};
delId: '',
delData: []
}
},
watch: {
},
watch: {},
computed: {
// 表头配置
tableColumn() {
return configData.tableColumnJson;
return configData.tableColumnJson
},
},
mounted() {
this.initPage();
this.initPage()
},
methods: {
// 单选
radioChange(val) {
this.radioIndex = val.index
this.selectForm.P_PersonName = val.P_PersonName
this.selectForm.P_PersonID = val.P_PersonID
},
//页面初始化
initPage() {
this.delId = null;
this.getMenuData();
this.$nextTick(() => {
this.resetForm();
});
},
resetForm() {
this.$refs.customForm.resetFields();
this.$refs.customForm.getField("lvl", 0);
this.$refs.customForm.getField("sorts", 0);
this.$refs.customForm.getField("upId", null);
this.$refs.customForm.getField("orgType", "1");
},
clearPage() {
this.$nextTick(() => {
this.delId = null;
this.orgForm = "";
this.$refs.baseTree.setCurrentKey(null);
this.$refs.customForm.resetFields();
this.$refs.customForm.getField("lvl", 0);
this.$refs.customForm.getField("sorts", 0);
this.$refs.customForm.getField("upId", null);
this.$refs.customForm.getField("orgType", "1");
});
},
// 获得树状图
async getMenuData() {
this.treeLoading = true;
this.delId = ""
this.windowLoading = true
setTimeout(() => {
this.treeLoading = false;
}, 10000);
let res = await authApi("orgService", "org", "queryTree");
if (res.status == "200") {
this.treeLoading = false;
this.menuData = res.attribute;
this.formRow[0].elCol[0].options = res.attribute;
}
this.windowLoading = false
}, 3000)
// this.$nextTick(() => {
// this.$refs.customForm.resetForm('ruleForm')
// })
this.getMenuData()
},
// 获取详情
async getDetail(id) {
this.openLoading("detail");
// 树状图点击
treeClick(data) {
this.pageModel.departmentID = data.id
this.radioIndex = false
},
async getMenuData() {
this.$refs.baseTree.treeLoading = true
setTimeout(() => {
this.$refs.baseTree.treeLoading = false
}, 3000)
let params = {
id: id,
};
let res = await authApi("orgService", "org", "queryEntity", "", params);
// CompanyID: "46"
// CompanyID: this.$store.state.user.companyID ? this.$store.state.user.companyID : getCompanyId()
}
let res = await authApi("sysOrganService","","queryEntityTree","",{})
console.log(res,'res')
this.menuData = res.attribute
this.$refs.baseTree.treeLoading = false
this.windowLoading = false
},
async getInfo(id) {
this.formLoading = true
setTimeout(() => {
this.formLoading = false
}, 3000)
let params = {
id: id
}
let res = await authApi("sysOrganService","","getEntity","",params)
this.ruleForm = res.attribute
this.ruleForm.parentOrganName = res.attribute.parentOrganName
this.$nextTick(() => {
this.$refs.customForm.choiceAssignment(res.attribute);
this.orgForm = res.attribute;
});
this.$refs.customForm.choiceAssignment(this.ruleForm)
this.formLoading = false
})
},
// 选择框点击事件
elDialogClick(row, index, indexRow) {
this.organizationForm = {
// o_OrganCode: '',
// O_OrganID: '',
// ParentOrganName: '',
// O_ParentOrganID: '',
// ParentOrgainName: '',
}
if (row.label == '上级机构') {
// this.organizationDialog = true
this.$refs.baseOrganization.dialogVisible = true
}
if (row.label == '负责人') {
this.$refs.basePerson.personDialog = true
}
},
// 点击事件
treeNodeClick(data) {
this.delId = data.id;
this.orgForm = data;
this.getDetail(data.id);
this.getInfo(data.id)
this.delId = data.id
// this.$refs.customForm.getField(data)
},
getSubmit(data) {
async function submitForm(delId) {
let params = {
...data,
label: data.orgName,
};
let res = await authApi(
"orgService",
"org",
delId ? "updateEntity" : "addEntity",
"",
params
);
return res;
let params = {
...data
}
this.$refs.customForm.$refs["ruleForm"].validate((valid) => {
if (!valid) {
return;
} else {
submitForm(this.delId).then((res) => {
if (res.status == "200") {
this.$vmNews("保存成功", "success");
this.getMenuData();
this.clearPage();
}
});
params.o_OrganID = params.o_OrganID ? params.o_OrganID : 0
params.o_ParentOrganID = params.o_ParentOrganID ? params.o_ParentOrganID : 0
this.savaData(params)
},
async savaData(params) {
let res
console.log(params)
if(params.id){
res = await authApi("sysOrganService","","updateEntity","",params)
}else{
res = await authApi("sysOrganService","","saveEntity","",params)
}
if (res.status == 200) {
this.$vmNews('保存成功！', 'success')
this.$nextTick(() => {
this.$refs.customForm.resetForm('ruleForm')
})
this.initPage()
}
},
personConfirmClick(val) {
if (JSON.stringify(val) == "{}") {
this.$vmNews('请选择人员信息！')
return
}
this.$refs.customForm.getField('managerName', val.personName)
this.$refs.customForm.getField('managerId', val.id)
this.$refs.basePerson.personDialog = false
},
handleConfirmClick(val) {
this.$nextTick(() => {
this.$refs.customForm.getField('parentOrgainName', val.label)
this.$refs.customForm.getField('o_ParentOrganID', val.id)
})
this.$refs.baseOrganization.dialogVisible = false
},
getDelData(data) {
let delD = []
data.forEach(el => {
if (this.delId == el.id) {
this.delData = el
}
});
if (el.children != null && el.children && el.children.length) {
this.getDelData(el.children)
}
})
return this.delData
},
async OrganDel() {
let params = {
id: this.delId,
};
let res = await authApi("orgService", "org", "delectEntity", "", params);
if (res.status == "200") {
this.$vmNews("删除成功", "success");
this.getMenuData();
this.clearPage();
id: this.delId
}
this.delData = []
this.getDelData(this.menuData)
if (this.delData.children != null && this.delData.children && this.delData.children.length > 0) {
this.$vmNews('存在子节点，不可以删除', 'error')
return
}
let res = await authApi("sysOrganService","","deleteEntity","",params)
if (res.status == 200) {
this.$vmNews('删除成功', 'success')
this.initPage()
this.$nextTick(() => {
this.$refs.customForm.resetForm('ruleForm')
})
}
},
// 操作按钮事件
getFuncBtn(btnEven) {
if (!this.delId || this.orgForm == "") {
this.$vmNews("请选择组织机构！");
return;
if (!this.delId && btnEven.menuName != '新增根节点') {
this.$vmNews('请选择需要处理的信息！')
return
}
if (btnEven.menuName === "新增子节点") {
// 新增
if (btnEven.menuName === '新增根节点') { // 新增
let newRuleForm = {
parentOrganName: "",
parentOrganId: 0
}
this.$nextTick(() => {
this.resetForm();
this.$refs.customForm.getField("upId", this.orgForm.id);
this.$refs.customForm.getField(
"lvl",
JSON.parse(this.orgForm.lvl) + 1
);
this.delId = null;
this.$refs.customForm.resetForm('ruleForm')
this.$refs.customForm.choiceAssignment(newRuleForm)
})
}
if (btnEven.menuName === '新增子节点') { // 新增
let newRuleForm = {
parentOrganName: this.ruleForm.organName,
parentOrganId: this.ruleForm.id,
}
this.$nextTick(() => {
this.$refs.customForm.resetForm('ruleForm')
this.$refs.customForm.choiceAssignment(newRuleForm)
})
}
if (btnEven.menuName === '删除') { // 删除
this.$confirm('确认删除该组织吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.OrganDel()
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
}
if (btnEven.menuName === "删除") {
// 删除
this.$delConfirm().then(() => {
this.OrganDel();
});
}
},
}
},
};
}
</script>
<style lang="scss">
$activeColor: var(--bg-color, yellow);
@ -249,19 +316,21 @@ $activeColor: var(--bg-color, yellow);
background-color: $activeColor !important;
}
.el-tree-node:focus > .el-tree-node__content {
.el-tree-node:focus>.el-tree-node__content {
color: white;
background-color: $activeColor !important;
}
.el-tree-node.is-current > .el-tree-node__content {
.el-tree-node.is-current>.el-tree-node__content {
color: white;
background-color: $activeColor !important;
}
</style>
<style scoped lang="scss">
$activeColor: var(--bg-color, yellow);
::v-deep .baseNewFormBox{
border:0px !important;
}
.content {
--font-color: red;
width: 100%;
@ -272,6 +341,7 @@ $activeColor: var(--bg-color, yellow);
background-color: white;
color: var(--font-color);
}
}
.form-control {

101
src/views/systemSettings/userSettings/PersonnelSettings/configData.js
View File

@ -12,31 +12,26 @@ const fucDataJson = [{
]
// 表头配置
const tableColumnJson = [
{
label: '所属部门',
prop: 'o_OrganName',
tooltip: true,
},
{
label: '工号',
prop: 'p_PersonCode',
tooltip: true,
// other: {
// color: '#4C9CFF',
// isClick: true
// }
},
{
label: '姓名',
prop: 'p_PersonName',
tooltip: true,
},
{
label: '入职时间',
prop: 'p_EntryTime',
tooltip: true,
},
{
label: '所属部门',
prop: 'organName',
tooltip: true,
},
{
label: '工号',
prop: 'personCode',
tooltip: true,
},
{
label: '姓名',
prop: 'personName',
tooltip: true,
},
{
label: '入职时间',
prop: 'entryTime',
tooltip: true,
},
// {
// label: '离职时间',
// prop: 'number',
@ -69,7 +64,7 @@ const tableColumnJson = [
// },
{
label: '固定电话 ',
prop: 'p_MoiblePhone',
prop: 'telPhone',
tooltip: true,
},
// {
@ -84,17 +79,12 @@ const tableColumnJson = [
// },
{
label: '电子邮箱',
prop: 'p_Email',
prop: 'email',
tooltip: true,
},
{
label: '出生年月',
prop: 'p_BirthDay',
tooltip: true,
},
{
label: '是否用户分配',
prop: 'isuser',
prop: 'birthDay',
tooltip: true,
},
@ -103,12 +93,12 @@ const tableColumnJson = [
const formRow = [{
elCol: [{
label: '工号',
prop: 'p_PersonCode',
prop: 'personCode',
tag: 'elInput',
},
{
label: '姓名',
prop: 'p_PersonName',
prop: 'personName',
tag: 'elInput',
},
]
@ -116,12 +106,12 @@ const formRow = [{
{
elCol: [{
label: '部门',
prop: 'o_OrganName',
prop: 'organName',
tag: 'elDialog'
},
{
label: '手机号',
prop: 'p_Telphone',
prop: 'mobilePhone',
tag: 'elInput',
rules:true,
rulesName:'phone'
@ -131,7 +121,7 @@ const formRow = [{
{
elCol: [{
label: '性别',
prop: 'p_Sex',
prop: 'sex',
tag: 'elRadio',
options: [{
label: '男',
@ -144,7 +134,7 @@ const formRow = [{
},
{
label: '学历',
prop: 'p_DegreeID',
prop: '`degreeId`',
tag: 'elSelect',
options: []
},
@ -153,14 +143,15 @@ const formRow = [{
{
elCol: [{
label: '职务',
prop: 'p_PostID',
prop: '`postId`',
tag: 'elSelect',
options: [
]
},
{
label: '级别',
prop: 'p_LevelID',
prop: '`levelId`',
tag: 'elSelect',
options: [],
},
@ -169,13 +160,13 @@ const formRow = [{
{
elCol: [{
label: '生日',
prop: 'p_BirthDay',
prop: 'birthDay',
tag: 'elDatePicker',
placeholder:'请点击选择',
// type:'date'
},{
label: '入职时间',
prop: 'p_EntryTime',
prop: '`entryTime`',
tag: 'elDatePicker',
placeholder:'请点击选择',
// type:'date'
@ -186,7 +177,7 @@ const formRow = [{
elCol: [
{
label: '固定电话',
prop: 'p_MoiblePhone',
prop: '`telPhone`',
tag: 'elInput'
},
// {
@ -199,23 +190,17 @@ const formRow = [{
{
elCol: [{
label: '电子邮箱',
prop: 'p_Email',
prop: 'email',
tag: 'elInput',
// rules:true,
// rulesName:'eMail'
},
{
label: '序号',
prop: 'p_Sort',
tag: 'elInput',
type:'number'
},
]
},
{
elCol: [{
label: '备注',
prop: 'p_Remark',
prop: 'remark',
tag: 'elInput',
type: 'textarea',
span:24
@ -262,32 +247,32 @@ const roleOptions = [{
}
]
const userRules = {
p_PersonCode: [{
personCode: [{
required: true,
message: '请输入工号',
trigger: 'change'
}],
p_PersonName: [{
personName: [{
required: true,
message: '请输入姓名',
trigger: 'change'
}],
orgainName: [{
organName: [{
required: true,
message: '请选择组织',
trigger: 'change'
}],
p_Telphone: [{
mobilePhone: [{
required: true,
message: '请输入手机号码',
trigger: 'change'
}],
p_Sex: [{
sex: [{
required: true,
message: '请选择性别',
trigger: 'change'
}],
p_Email: [{ type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur', 'change'] }],
email: [{ type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur', 'change'] }],
};
export default {

974
src/views/systemSettings/userSettings/PersonnelSettings/index.vue
View File

File diff suppressed because it is too large Load Diff

478
src/views/systemSettings/userSettings/roleSettings/index.vue
View File

@ -1,207 +1,315 @@
<template>
<div >
<right-dialog ref="rightDialog" @handleDialogClose="tableResult"></right-dialog>
<base-layout title="人员信息" ref="layout" @pageChange="pageChange" :isPage="true" :showTitle="false"
@onFuncBtn="getFuncBtn">
<div slot="main" style="height: 100%;" slot-scope="{ tableHeight }">
<base-table ref="customtable" :border="true" :showIndex="false" :slotrow="true"
:tabLoading.sync="tabLoading" :tableHeight="tableHeight" :tableData="tableData"
:tableColumn="tableColumn" @radioChange="radioChange">
<!-- 所属分类 -->
<template v-slot:category="{row}">
<p>{{row.row.category == '1'?'超级管理员':row.row.category == '2'?'管理员':'业务员'}}</p>
</template>
<!-- 角色分类 -->
<template v-slot:roleType="{row}">
<p>{{row.row.roleType | roleType}}</p>
</template>
<!-- 所属分类 -->
<template v-slot:roleBond="{row}">
<p>{{row.row.roleBond | roleBond}}</p>
</template>
<template v-slot:isBenchmark="{row}">
<p>{{row.row.isBenchmark =='1'?'是':'否'}}</p>
</template>
<template v-slot:externalType="{row}">
<p>{{row.row.externalType =='1'?'外部':'内部'}}</p>
</template>
<template v-slot:isEnable="{row}">
<p>{{row.row.isEnable =='1'?'显示':'隐藏'}}</p>
</template>
</base-table>
</div>
</base-layout>
</div>
<div flex>
<base-layout title="人员信息" ref="layout" @pageChange="pageChange" :isPage="true" :showTitle="false"
@onFuncBtn="getFuncBtn">
<div slot="main" style="height: 100%;" slot-scope="{ tableHeight }">
<base-table ref="customtable" :border="true" :showIndex="false" :slotrow="true"
:tabLoading.sync="tabLoading" :tableHeight="tableHeight" :tableData="tableData"
:tableColumn="tableColumn" @sortChange="sortChange" @radioChange="radioChange">
<!-- 单选 -->
<!-- <template v-slot:option="{row}">
<el-radio v-model="radioIndex" :label="row.$index"><span></span></el-radio>
</template> -->
</base-table>
</div>
</base-layout>
<base-right-dialog :closeEscape="false" :showClose="false" :closeModal="false" :dialogVisible.sync="RoleAdd"
:title="frameTitle + '角色信息'" width="520px" @handleConfirmClick="confirmBtn" @handleClose="handleClose">
<el-form validate-on-rule-change :model="ruleForm" :rules="rules" class="formMain" ref="ruleForm"
label-width="100px">
<el-form-item prop="r_RoleCode">
<span class="label" slot="label">角色编码</span>
<el-input placeholder="请输入角色编码" clearable v-model="ruleForm.roleCode">
</el-input>
</el-form-item>
<el-form-item prop="r_RoleName">
<span class="label" slot="label">角色名称</span>
<el-input clearable placeholder="请输入角色名称" v-model="ruleForm.roleName">
</el-input>
</el-form-item>
<el-form-item prop="r_Sort">
<span class="label" slot="label">状态</span>
<el-radio-group v-model="ruleForm.enableState">
<el-radio label="0">启用</el-radio>
<el-radio label="1">停用</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item prop="r_Description">
<span class="label" slot="label">描述</span>
<el-input type="textarea" :rows="4" placeholder="请输入内容" v-model="ruleForm.r_Description">
</el-input>
</el-form-item>
</el-form>
<!-- <div flex="cross:center main:right">-->
<!-- <el-button type="primary" @click="confirmBtn">确认</el-button>-->
<!-- <el-button @click="cancelBtn">取消</el-button>-->
<!-- </div>-->
</base-right-dialog>
</div>
</template>
<script>
import baseRightDialog from "@/components/base/baseRightDialog";
import baseLayout from "@/components/base/baseLayout";
import BaseTable from '@/components/base/baseTable/index.vue'
import baseDialog from "@/components/base/BaseNewDialog/index.vue";
import BaseSelect from '@/components/base/BaseSelect'
import baseTree from "@/components/base/BaseMenuTree/index.vue";
import rightDialog from "./rightDialog";
import configData from "./configData";
import {
authApi
} from '@/api/apis/auth'
import {
RoleGetBillList,
RoleDelData,
RoleSaveData
} from '@/api/apis/roleManagement'
import { authApi } from "@/api/apis/auth";
export default {
name: 'RoleSettings',
components: {
baseLayout,
BaseTable,
BaseSelect,
baseDialog,
baseTree,
rightDialog
},
data() {
return {
radioIndex: false,
radioId: false,
radioForm: {},
tabLoading: false,
tableData: [],
pageModel: {
pageNum: 1,
pageSize: 20,
},
tableColumn: configData.tableColumn,
}
},
name: 'RoleSettings',
components: {
baseLayout,
BaseTable,
BaseSelect,
baseDialog,
baseTree,
baseRightDialog
},
data() {
return {
radioIndex: false,
radioId: false,
radioForm: {},
filters:{
roleType(val){
let roleTypeName = ''
switch (val) {
case '1':
roleTypeName = '固定角色'
break;
case '2':
roleTypeName = '相对角色'
break;
case '3':
roleTypeName = '自建角色'
break;
}
return roleTypeName
},
roleBond(val){
let roleBondName = ''
switch (val) {
case '0':
roleBondName = '集团角色'
break;
case '1':
roleBondName = '单位角色'
break;
case '2':
roleBondName = '部门角色'
break;
case '3':
roleBondName = '不使用'
break;
case '4':
roleBondName = '不使用'
break;
case '5':
roleBondName = '业务生成器'
break;
case '6':
roleBondName = 'sso'
break;
}
return roleBondName
}
},
mounted() {
// this.$refs.baseTree.getMenuList()
this.getTableList()
},
methods: {
// 点击单元格进行多选操作
radioChange(val) {
this.radioIndex = val.index
this.radioId = val.id
this.radioForm = val
},
// 获取表格内容
async getTableList() {
this.radioIndex = false
this.tabLoading = true
setTimeout(()=>{
this.tabLoading = false
},100000)
let params = {
...this.pageModel
}
let res = await authApi('roleService','role','queryList','',params)
if (res.status == '200') {
this.$refs.layout.setPageTotal(res.attribute.total)
this.$refs.customtable.clearRadioIndex()
this.tableData = res.attribute.list
}
this.tabLoading = false
},
async delData(id) {
let params = {
id: id
}
let res = await authApi('roleService','role','delectEntity','',params)
if(res.status == '200'){
this.$vmNews("删除成功",'success')
this.tableResult()
}
},
getFuncBtn(btnEven) {
if (btnEven.menuName == '新增') {
this.frameTitle = '添加'
this.$refs.rightDialog.openDialog('新增')
}
if (btnEven.menuName == '编辑') {
if (this.radioIndex === false) {
this.$vmNews('请选择一条记录')
} else {
this.$refs.rightDialog.openDialog('编辑',this.radioForm.id)
}
mainColor: '#f8f8f8 ',
tabLoading: false,
tableData: [],
total: "",
pageModel: {
pageNum: 1,
pageSize: 20,
roleCode: '',
roleName: ''
},
// 表头
tableColumn: [
{
label: '角色编号',
prop: 'roleCode',
tooltip: true,
sortable: true,
},
{
label: '角色名称',
prop: 'roleName',
tooltip: true,
sortable: true,
},
{
label: '角色描述 ',
prop: 'description',
tooltip: true,
},
],
RoleAdd: false,
ruleForm: {
R_RoleID: "", //角色id
r_RoleCode: null, // 角色编码
r_RoleName: null, // 角色名称
r_Sort: null, // 排序
r_Description: null, // 描述
},
rules: {
roleCode: [{
required: true,
message: '请输入角色编码',
trigger: 'blur'
}],
roleName: [{
required: true,
message: '请输入角色名称',
trigger: 'blur'
}],
enableState: [{
required: true,
message: '请选择状态',
trigger: 'blur'
}],
},
menuData: [],
frameTitle: '',
}
},
watch: {
pageModel: {
deep: true, //深度监听设置为 true
handler: function (newV, oldV) {
this.getTableList()
}
},
RoleAdd: {
deep: true, //深度监听设置为 true
handler: function (newV, oldV) {
if (this.RoleAdd == true) {
this.$nextTick(() => {
this.$refs.ruleForm.clearValidate();
})
}
}
}
},
mounted() {
this.getTableList()
},
methods: {
handleClose(){
this.RoleAdd=false
},
// 点击单元格进行多选操作
radioChange(val) {
this.radioIndex = val.index
this.radioId = val.id
this.radioForm = val
},
// 获取表格内容
async getTableList() {
this.radioIndex = false
this.tabLoading = true
let params = {
...this.pageModel
}
// let res = await RoleGetBillList(params)
const res = await authApi("sysRoleService","","queryEntityPage","",params)
if (res.status == 200) {
this.$refs.layout.setPageTotal(res.attribute.total)
this.$refs.customtable.clearRadioIndex()
this.tableData = res.attribute.list
}
this.tabLoading = false
},
async delData(id) {
let params = {
id: id
}
let res = await authApi("sysRoleService","","deleteEntity","",params)
if (res.status == 200) {
this.$vmNews('删除成功', 'success')
this.getTableList()
// this.tableResult()
} else {
this.$vmNews('删除失败', 'error')
}
},
getFuncBtn(btnEven) {
if (btnEven.menuName == '新增') {
this.ruleForm = {}
this.frameTitle = '添加'
this.RoleAdd = true
}
if (btnEven.menuName == '编辑') {
// this.ruleForm = row
if (this.radioIndex === false) {
this.$vmNews('请选择一条记录')
} else {
this.ruleForm = Object.assign({}, this.radioForm)
this.frameTitle = '编辑'
this.RoleAdd = true
}
}
if (btnEven.menuName == '删除') {
if (this.radioIndex === false) {
this.$vmNews('请选择一条记录')
} else {
this.$delConfirm().then(()=>{
this.delData(this.radioId)
})
}
}
}
if (btnEven.menuName == '删除') {
if (this.radioIndex === false) {
this.$vmNews('请选择一条记录')
} else {
this.$confirm('确认删除吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
console.log(this.radioId,'this.radioId')
this.delData(this.radioId)
this.getTableList()
}).catch(() => {
this.$message({
type: 'info',
message: '已取消操作'
});
});
}
// this.tableData.splice(,1)
}
},
tableResult() {
this.radioForm = {}
this.radioId = false
this.radioIndex = false
this.$refs.customtable.clearRadioIndex()
this.pageModel.pageNum = 1
this.$nextTick(() => {
this.$refs.layout.pageClear(1)
this.$refs.customtable.clearSelect();
})
this.getTableList()
},
// 页面改变时
pageChange(model) {
this.pageModel = model
this.getTableList()
},
},
},
// 确定
async confirmBtn() {
let params = {
...this.ruleForm
}
let pass
this.$refs.ruleForm.validate((valid) => {
if (valid) {
pass = true
} else {
pass = false
}
});
if (pass) {
let res
if(this.frameTitle === '添加'){
res = await authApi("sysRoleService","","saveEntity","",this.ruleForm)
}else if (this.frameTitle === '编辑'){
console.log(this.ruleForm,'this.ruleForm')
res = await authApi("sysRoleService","","updateEntity","",this.ruleForm)
}
if (res.status == 200) {
this.$vmNews('保存成功', 'success')
this.tableResult()
this.RoleAdd = false
}
this.getTableList()
} else {
return
}
},
tableResult() {
this.ruleForm = {}
this.radioForm = {}
this.radioId = false
this.radioIndex = false
this.$refs.customtable.clearRadioIndex()
this.pageModel.page = 1
this.$nextTick(() => {
this.$refs.layout.pageClear(1)
this.$refs.customtable.clearSelect();
})
// this.getTableList()
},
// 取消
cancelBtn() {
this.RoleAdd = false
},
// 页面改变时
pageChange(model) {
this.pageModel.pageNum = model.page
this.pageModel.pageSize = model.limit
},
// 排序
sortChange(prop, type) {
this.pageModel.SequenceName = prop
this.pageModel.Sequence = type
this.pageModel.pageNum = 1
this.radioForm = {}
this.radioId = false
this.$nextTick(() => {
this.$refs.layout.pageClear()
})
}
},
}
</script>
<style>
textarea {
resize: none;
resize: none;
}
</style>

730
src/views/systemSettings/userSettings/userInformation/configData.js
View File

@ -1,527 +1,243 @@
// 页面操作按钮配置
const fucDataJson = [{
name: '导出',
type: 'danger',
icon: 'el-icon-position'
},
name: '导出',
type: 'danger',
icon: 'el-icon-position'
},
]
// 表头配置
const tableColumnJson = [{
label: '显示名称',
prop: 'viewName',
tooltip: true,
},
{
label: '登录名',
prop: 'loginName',
tooltip: true,
// other: {
// color: '#4C9CFF',
// isClick: true
// }
},
{
label: '密码超期时间',
prop: 'expirationDate',
tooltip: true,
},
{
label: '入职时间',
prop: 'entryTime',
tooltip: true,
},
{
label: '是否启用',
prop: 'state',
tooltip: true
},
{
label: '电子邮箱',
prop: 'email',
tooltip: true
},
{
label: '在职状态',
prop: 'useState',
tooltip: true,
},
const personColumn = [
{
label: '所属部门',
prop: 'organName',
tooltip: true,
},
{
label: '工号',
prop: 'personCode',
tooltip: true,
// other: {
// color: '#4C9CFF',
// isClick: true
// }
},
{
label: '姓名',
prop: 'personName',
tooltip: true,
},
{
label: '入职时间',
prop: 'entryTime',
tooltip: true,
},
// {
// label: '离职时间',
// prop: 'number',
// tooltip: true
// },
// {
// label: '性别',
// prop: 'sex',
// tooltip: true
// },
// {
// label: '学历',
// prop: 'Degree',
// tooltip: true,
// },
// {
// label: '职务',
// prop: 'Post',
// tooltip: true,
// },
// {
// label: '级别 ',
// prop: 'illegalType',
// tooltip: true,
// },
// {
// label: '生日',
// prop: 'BirthDay',
// tooltip: true,
// },
{
label: '固定电话 ',
prop: 'mobilePhone',
tooltip: true,
},
// {
// label: '籍贯 ',
// prop: 'areaCovered',
// tooltip: true,
// },
// {
// label: '身份证',
// prop: 'areaBuilding',
// tooltip: true,
// },
{
label: '电子邮箱',
prop: 'email',
tooltip: true,
},
{
label: '出生年月',
prop: 'birthDay',
tooltip: true,
},
{
label: '是否用户分配',
prop: 'state',
tooltip: true,
},
]
// 表头配置
const personColumn = [{
label: '用户账号',
prop: 'u_LoginCode',
tooltip: true,
},
{
label: '用户姓名',
prop: 'p_PersonName',
tooltip: true,
},
{
label: '所属部门',
prop: 'o_OrganName',
tooltip: true,
},
{
label: '手机号',
prop: 'p_Telphone',
tooltip: true
},
{
label: '状态',
prop: 'stateNote',
tooltip: true
},
const tableColumnJson = [
{
label: '用户账号',
prop: 'loginCode',
tooltip: true,
},
{
label: '用户姓名',
prop: 'personName',
tooltip: true,
},
{
label: '所属部门',
prop: 'organName',
tooltip: true,
},
{
label: '手机号',
prop: 'mobilePhone',
tooltip: true
},
{
label: '状态',
prop: 'state',
tooltip: true
},
]
// 详情页面结构JSON
const formRow1 = [{
elCol: [{
label: '选择人员',
prop: 'p_PersonName',
tag: 'elDialog',
// disabled:false
},
{
label: '登录账号',
prop: 'u_LoginCode',
tag: 'elInput',
// placeholder:'自动带入',
// disabled:true
},
]
}, {
elCol: [{
label: '描述',
prop: 'u_Remark',
tag: 'elInput',
type: 'textarea',
span: 24
}, ]
}]
elCol: [{
label: '选择人员',
prop: 'personName',
tag: 'elDialog',
// disabled:false
},
{
label: '登录账号',
prop: 'loginCode',
tag: 'elInput',
// placeholder:'自动带入',
// disabled:true
},
]
},{
elCol: [{
label: '描述',
prop: 'remark',
tag: 'elInput',
type:'textarea',
span:24
},
]
}
]
const formRow2 = [{
elCol: [{
label: '用户名',
prop: 'p_PersonName',
tag: 'elDialog',
// disabled:false
},
{
label: '登录账号',
prop: 'u_LoginCode',
tag: 'elInput',
// placeholder:'自动带入',
// disabled:true
},
]
}, {
elCol: [{
label: '描述',
prop: 'u_Remark',
tag: 'elInput',
type: 'textarea',
span: 24
}, ]
}]
elCol: [{
label: '用户名',
prop: 'p_PersonName',
tag: 'elDialog',
// disabled:false
},
{
label: '登录账号',
prop: 'u_LoginCode',
tag: 'elInput',
// placeholder:'自动带入',
// disabled:true
},
]
},{
elCol: [{
label: '描述',
prop: 'u_Remark',
tag: 'elInput',
type:'textarea',
span:24
},
]
}
]
const roleOptions = [{
label: '超级管理员',
value: 1
},
{
label: '业务员',
value: 2
},
{
label: '管理员',
value: 3
},
{
label: '开发成员',
value: 4
},
{
label: '项目经理',
value: 5
},
{
label: '实施人员',
value: 6
},
{
label: '财务',
value: 7
},
{
label: '总经理',
value: 8
},
{
label: '副总',
value: 9
}
]
const rules = {
villageId: [{
required: true,
message: '请选择村/社区名称',
trigger: 'change'
}],
registerTime: [{
required: true,
message: '请选择登记时间',
trigger: 'change'
}],
villageId: [{
required: true,
message: '请选择村/社区名称',
trigger: 'change'
}],
registerTime: [{
required: true,
message: '请选择登记时间',
trigger: 'change'
}],
};
// 详情显示图片配置
const showImgJson = {
span: 24,
text: '现场照片',
field: 'photoUrls',
span: 24,
text: '现场照片',
field: 'photoUrls',
};
const formRow = [
{
elCol: [{
label: '显示名称',
prop: 'viewName',
tag: 'elInput',
}, {
label: '登录名',
prop: 'loginName',
tag: 'elInput',
disabled: false
}]
},
{
elCol: [{
label: '密码',
prop: 'password',
tag: 'elInput',
type: 'password'
}, {
label: '加密策略',
prop: 'encryptionPolicy',
tag: 'elInput',
}]
},
{
elCol: [{
label: '密码超时时间',
prop: 'expirationDate',
tag: 'elDatePicker',
type: 'datetime'
}, {
label: '密码次数',
prop: 'pawFrequency',
tag: 'elInputNumber',
}]
}, {
elCol: [{
label: '人员编号 ',
prop: 'staffId',
tag: 'elInput',
},
{
label: '头像路径',
prop: 'iconUrl',
tag: 'elInput',
disabled: false
}
]
},
{
elCol: [{
label: '是否是内部',
prop: 'builtIn',
tag: 'elRadio',
options: [{
label: '是',
value: '1'
},
{
label: '否',
value: '0'
},
]
}, {
label: '是否启用',
prop: 'state',
tag: 'elRadio',
options: [{
label: '启用',
value: '1'
},
{
label: '停用',
value: '0'
},
]
}]
},
{
elCol: [{
label: '模块操作级别',
prop: 'level',
tag: 'elSelect',
options: [{
label: 'SuperAdmin',
value: '1'
},{
label: 'admin',
value: '2'
},{
label: 'user',
value: '3'
}
]
}, {
label: '电子邮件',
prop: 'email',
tag: 'elInput',
}]
},
{
elCol: [{
label: '手机号码',
prop: 'phone',
tag: 'elInput',
}, {
label: '职务级别',
prop: 'userLvl',
tag: 'elSelect',
options: [
{
label: '管理员',
value: '0'
},
{
label: '访客',
value: '1'
},
{
label: '员工',
value: '2'
},
]
}]
},
{
elCol: [{
label: '性别',
prop: 'sex',
tag: 'elRadio',
options: [{
label: '男',
value: '0'
},
{
label: '女',
value: '1'
},
]
}, {
label: '锁定状态',
prop: 'lockState',
tag: 'elRadio',
options: [{
label: '锁定',
value: '0'
},
{
label: '未锁定',
value: '1'
},
]
}]
},
{
elCol: [{
label: '在职状态',
prop: 'useState',
tag: 'elRadio',
options: [{
label: '在职',
value: '1'
},
{
label: '离职',
value: '2'
},
]
}, {
label: '微信token',
prop: 'wechatToken',
tag: 'elInput',
disabled: true
}]
},
{
elCol: [{
label: '是否可以登录',
prop: 'isLoginable',
tag: 'elRadio',
options: [{
label: '是',
value: '1'
},
{
label: '否',
value: '0'
},
]
}, {
label: '是否虚拟账号',
prop: 'isVirtual',
tag: 'elRadio',
options: [{
label: '是',
value: '1'
},
{
label: '否',
value: '0'
},
]
}]
},
{
elCol: [{
label: '是否被分配',
prop: 'isAssigned',
tag: 'elRadio',
options: [{
label: '是',
value: '1'
},
{
label: '否',
value: '0'
},
]
}, {
label: '是否管理员',
prop: 'isAdmin',
tag: 'elRadio',
options: [{
label: '是',
value: '1'
},
{
label: '否',
value: '0'
},
]
}]
},
{
elCol: [{
label: '枚举',
prop: 'memberType',
tag: 'elInput',
tag: 'elRadio',
options: [{
label: '正式',
value: '1'
},
{
label: '非正式',
value: '0'
},
]
}, {
label: '是否被删除',
prop: 'isDeleted',
tag: 'elRadio',
options: [{
label: '删除',
value: '1'
},
{
label: '未删除',
value: '0'
},
]
}]
},
{
elCol: [{
label: '内外标识',
prop: 'externalType',
tag: 'elRadio',
options: [{
label: '外部人',
value: '1'
},
{
label: '内部人',
value: '0'
},
]
}, {
label: '编号',
prop: 'memberCode',
tag: 'elInput',
}]
},
{
elCol: [{
label: '出生日期',
prop: 'birthDate',
tag: 'elDatePicker',
type: 'datetime'
}, {
label: '办公电话',
prop: 'officeTel',
tag: 'elInput',
}]
},
{
elCol: [{
label: '人员照片地址',
prop: 'photoAddress',
tag: 'elInput',
disabled: true
}, {
label: '所属部门',
prop: 'department',
tag: 'elTreeSelect',
options:[],
}]
},
{
elCol: [{
label: '排序编号',
prop: 'sorts',
tag: 'elInputNumber',
}, {
label: '工作地',
prop: 'workplace',
tag: 'elInput',
}]
},
{
elCol: [{
label: '主岗',
prop: 'majorPosition',
tag: 'elInput',
}, {
label: '副岗',
prop: 'deputyPost',
tag: 'elInput',
}]
},
{
elCol: [{
label: '人员类型',
prop: 'userType',
tag: 'elSelect',
options:[
{label:'超级管理员',value:'1'},
{label:'管理员',value:'2'},
{label:'业务员',value:'3'},
]
}, {
label: '人员状态',
prop: 'personnelStatus',
tag: 'elInput',
tag: 'elRadio',
options: [{
label: '启用',
value: '1'
},
{
label: '停用',
value: '0'
},
]
}]
},
{
elCol: [{
label: '入职时间',
prop: 'entryTime',
tag: 'elDatePicker',
type: 'datetime'
}, {
label: '汇报人',
prop: 'reporter',
tag: 'elInput',
}]
},
]
export default {
fucDataJson,
tableColumnJson,
showImgJson,
formRow1,
formRow2,
rules,
personColumn,
formRow
fucDataJson,
tableColumnJson,
showImgJson,
formRow1,
formRow2,
rules,
personColumn
}

815
src/views/systemSettings/userSettings/userInformation/index.vue
View File

@ -1,273 +1,588 @@
<template>
<div>
<div style="display: flex;height: 100%;">
<base-layout title="组织机构" ref="organLayout" style="width: 240px;" :bottonShow="false" :isPage="false"
:operateButtonSwitch="false" >
<div slot="main" style="height: 100%;border-right: 1px solid #dfe6ec;overflow-y: auto;">
<base-tree ref="baseTree" :isCenter="false" :isSaveBtn="false" :Allshow="false" :showCheckbox="false"
:menuData="menuData" @handleNodeClick="orangClick"></base-tree>
</div>
</base-layout>
<base-layout title="用户信息" ref="userLayout" @pageChange="pageChange" style="flex:1"
:buttonList="buttonList" @onFuncBtn="getFuncBtn" :isPage="true">
<div slot="main" slot-scope="{ tableHeight }" style="height: 100%;">
<base-table ref="userCustomtable" :border="true" :showIndex="false" :tabLoading.sync="tabLoading"
@radioChange="userRadioChange" :slotrow="true" :tableHeight="tableHeight" :tableData="tableData"
:tableColumn="tableColumn">
</base-table>
</div>
</base-layout>
</div>
<right-dialog ref="rightDialog" :orgData="menuData" @handleDialogClose="resetTable"></right-dialog>
<table-dialog ref="tableDialog" :orgData="menuData" @handleDialogClose="resetTable"></table-dialog>
</div>
<div>
<div style="display: flex;height: 100%;">
<base-layout title="组织机构" ref="organLayout" style="width: 240px;" :bottonShow="false" :isPage="false"
:operateButtonSwitch="false" :mainColor="mainColor"
>
<div slot="main" style="height: 100%;border-right: 1px solid #dfe6ec;overflow-y: auto;">
<base-tree ref="baseTree" :isCenter="false" :isSaveBtn="false" :Allshow="false" :showCheckbox="false"
:menuData="menuData" @handleNodeClick="orangClick"
></base-tree>
</div>
</base-layout>
<base-layout title="用户信息" ref="userLayout" :selectTable="selectTable" @pageChange="pageChange" style="flex:1"
:buttonList="buttonList" @onElSelect="getElSelect" @onFuncBtn="getFuncBtn" :isPage="true"
>
<div slot="main" slot-scope="{ tableHeight }" style="height: 100%;">
<base-table ref="userCustomtable" :border="true" :showIndex="false" :tabLoading.sync="tabLoading"
@radioChange="userRadioChange" :slotrow="true" :tableHeight="tableHeight" :tableData="tableData"
:tableColumn="tableColumn"
>
<template #state="{row}">
<div>{{ row.row.state == 0 ? '启动' : '停用' }}</div>
</template>
</base-table>
</div>
</base-layout>
</div>
<base-dialog :closeEscape="true" :showClose="true" :closeModal="false" :dialogVisible.sync="addDialog"
:footerShow="true" @handleConfirmClick="handleConfirmClick" class="userDialog"
:title="dialogType == 'add' ? '新增用户信息' : '编辑用户信息'" width="900px" top="8vh"
>
<base-form ref="customForm" :formRow="formRow" :isFunBtn="false" @elDialogClick="elDialogClick">
</base-form>
<div>
<p class="bigTitle">选择公司</p>
<div flex="cross:center" flex-wrap>
<p v-for="(item, index) in companyList" :class="{ 'active': item.isActive }" :key="index"
@click="item.isActive = !item.isActive" class="roleName"
>{{ item.organName }}</p>
</div>
</div>
<div>
<p class="bigTitle">选择角色</p>
<div flex="cross:center" flex-wrap>
<p v-for="(item, index) in roleList" :class="{ 'active': item.isActive }" :key="index"
@click="item.isActive = !item.isActive" class="roleName"
>{{ item.roleName }}</p>
</div>
</div>
</base-dialog>
<!--选择人员 -->
<base-person ref="basePerson" :menuData="menuData" :tableColumn="personColumn"
@personConfirmClick="personConfirmClick"
></base-person>
</div>
</template>
<script>
import baseLayout from "@/components/base/baseLayout";
import baseTable from "@/components/base/baseTable";
import baseLayout from '@/components/base/baseLayout'
import baseTable from '@/components/base/baseTable'
// import baseDialog from "@/components/base/BaseNewDialog";
import baseDialog from "@/components/base/BaseNewDialog/index.vue";
import baseForm from "@/components/base/baseNewForm/index.vue";
import baseTree from "@/components/base/BaseMenuTree/index.vue";
import basePerson from "@/components/base/basePerson/index.vue";
import configData from "./configData";
import rightDialog from "./rightDialog";
import tableDialog from "./tableDialog";
import {
authApi
} from '@/api/apis/auth'
import baseDialog from '@/components/base/BaseNewDialog/index.vue'
import baseForm from '@/components/base/baseNewForm/index.vue'
import baseTree from '@/components/base/BaseMenuTree/index.vue'
import basePerson from '@/components/base/basePerson/index.vue'
import configData from './configData'
import { getCompanyId } from '@/utils/auth'
import {
PersonDetail,
PersonSaveData
} from '@/api/apis/personnelSettings'
import {
RoleGetBillList
} from '@/api/apis/roleManagement'
import {
userGetBillList,
userGetBillData,
userSaveData,
userOpen,
userClose,
userResetPwd,
userChangePwd
} from '@/api/apis/userInformation'
import {
GetOrganTree,
OrganGetCompany
} from '@/api/apis/organization'
import {
PersonList
} from '@/api/apis/personnelSettings'
import { authApi } from '@/api/apis/auth'
export default {
name: "UserInformation",
components: {
baseLayout,
baseTable,
baseDialog,
baseForm,
baseTree,
basePerson,
rightDialog,
tableDialog
},
data() {
return {
userRadioIndex: false,
userRadioId: false,
tabLoading: false,
tableData: [],
// 搜索配置
menuData: [],
buttonList: [
name: 'UserInformation',
components: {
baseLayout,
baseTable,
baseDialog,
baseForm,
baseTree,
basePerson
},
data() {
return {
userRadioIndex: false,
userRadioId: false,
personHight: '350px', //人员选择高度
personMainHight: 'calc(100% - 39px)', //人员弹框高度
personLoading: false, //人员加载
personDialog: false,
personTableData: [],
personTableHeight: '280px', //人员表格高度
roleList: [],
companyList: [],
// tableHeight: 'calc(100vh - 227px)',
mainColor: '#f8f8f8',
tabLoading: false,
tableData: [],
selectTable: [],
selectPerson: [],
dialogType: '',
// 搜索配置
addDialog: false,
roleOptions: configData.roleOptions,
formRow: configData.formRow1,
formRow2: configData.formRow2,
isFunBtn: true,
menuData: [],
infoData: '',
buttonList: [
{
'icon': 'el-icon-refresh',
'menuName': '设置角色'
},
{
'icon': 'el-icon-open',
'menuName': '设置组织'
},
{
'icon': 'el-icon-turn-off',
'menuName': '停用',
type: 'danger'
},
],
pageModel: {
pageNum: 1,
pageSize: 20,
},
orgId:null,
}
},
computed: {
// 表头配置
tableColumn() {
return configData.tableColumnJson
},
// 表头配置
personColumn() {
return configData.personColumn
},
},
created() { },
onShow() { },
mounted() {
this.initPage()
// this.$refs.baseTree.getMenuList()
},
filters: {
{
'icon': 'el-icon-refresh',
'menuName': '重置密码'
},
{
'icon': 'el-icon-open',
'menuName': '启用'
},
{
'icon': 'el-icon-turn-off',
'menuName': '停用',
type: 'danger'
}
],
pageModel: {
pageNum: 1,
pageSize: 20,
organId: ''
// SequenceName:'',
// Sequence:''
},
personModel: {
page: 1,
limit: 20,
organId: ''
}
}
},
computed: {
// 表头配置
tableColumn() {
return configData.tableColumnJson
},
// 表头配置
personColumn() {
return configData.personColumn
}
},
watch: {
// pageModel: {
// deep: true, //深度监听设置为 true
// handler: function(newV, oldV) {
// this.getTableList()
// }
// },
addDialog: {
deep: true, //深度监听设置为 true
handler: function(newV, oldV) {
if (newV == false) {
this.formRow[0].elCol[0].disabled = false
this.$nextTick(() => {
this.$refs.customForm.resetForm('ruleForm')
},
methods: {
// 初始化页面
initPage() {
this.getMenuData()
},
// 获得树状图
async getMenuData() {
let res = await authApi('orgService', 'org', 'queryTree')
if(res.status == '200'){
this.menuData = res.attribute
}
},
// 获取用户信息列表
async getTableList() {
this.tabLoading = true
setTimeout(()=>{
this.tabLoading = false
},100000)
this.tableData = []
let params = {
...this.pageModel,
department:this.orgId
}
let res =await authApi('userService', 'user', 'queryList','',params)
if (res.status == '200') {
this.tableData = res.attribute.list
this.$nextTick(() => {
this.$refs.userCustomtable.clearRadioIndex()
this.$refs.userLayout.setPageTotal(res.attribute.total)
})
this.tabLoading = false
}
},
// 单选
userRadioChange(val) {
this.userRadioIndex = val.index
this.userRadioId = val.id
},
// 树状图点击
orangClick(data) {
this.orgId = data.id
this.resetTable()
},
resetTable() {
this.pageModel.page = 1
this.userRadioId = false
this.userRadioIndex = false
this.$nextTick(() => {
this.$refs.userCustomtable.clearSelect()
this.$refs.userCustomtable.clearRadioIndex()
this.$refs.userLayout.pageClear()
})
this.getTableList()
},
// 操作按钮事件
getFuncBtn(btnEven) {
if (btnEven.menuName === '新增') { // 新增
this.$refs.rightDialog.openDialog('新增',this.orgId)
}
if (btnEven.menuName != '新增') {
if (this.userRadioIndex === false) {
this.$tipConfirm('请勾选需要处理的信息')
return
}
}
if (btnEven.menuName === '编辑') { // 编辑
this.$refs.rightDialog.openDialog('编辑',this.orgId,this.userRadioId)
}
if (btnEven.menuName === '设置角色') { // 编辑
this.$refs.tableDialog.openDialog(this.userRadioId)
}
if(btnEven.menuName === '删除'){
this.$delConfirm().then(()=>{
this.delData(this.userRadioId)
})
}
if (btnEven.menuName === '重置密码') { // 重置密码
this.$confirm('确认重置密码吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.ResetPwd(this.userRadioId)
}).catch(() => {
this.$message({
type: 'info',
message: '已取消操作'
});
});
}
if (btnEven.menuName === '启用') { // 导入
this.$confirm('确认启用吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.openDelData(this.userRadioId)
}).catch(() => {
this.$message({
type: 'info',
message: '已取消操作'
});
});
}
if (btnEven.menuName === '停用') { //
this.$confirm('确认停用吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.closeDelData(this.userRadioId)
}).catch(() => {
this.$message({
type: 'info',
message: '已取消操作'
});
});
}
})
if (this.roleList.length > 0) {
this.roleList.forEach(el => {
el.isActive = false
})
}
if (this.companyList.length > 0) {
this.companyList.forEach(el => {
el.isActive = false
})
}
},
async delData(id) {
let params = {
id: id
}
let res = await authApi('userService','user','delectEntity','',params)
if(res.status == '200'){
this.$vmNews("删除成功",'success')
this.resetTable()
}
},
pageChange(model) {
this.pageModel= model
this.getTableList()
}
},
}
}
},
personModel: {
deep: true, //深度监听设置为 true
handler: function(newV, oldV) {
this.getPersonList()
}
}
},
created() {
},
onShow() {
},
mounted() {
this.initPage()
// this.$refs.baseTree.getMenuList()
},
filters: {},
methods: {
// 初始化页面
initPage() {
this.getTableList()
this.getOrganList()
},
// 获取用户信息列表
async getTableList() {
this.tabLoading = true
this.tableData = []
let params = {
...this.pageModel
}
let res = await authApi('sysUserService', '', 'queryEntityPage', '', params)
if (res.status == 200) {
this.tableData = res.attribute.list
// this.$nextTick(() => {
this.$refs.userCustomtable.clearRadioIndex()
this.$refs.userLayout.setPageTotal(res.attribute.total)
// })
this.tabLoading = false
}
},
// 单选
userRadioChange(val) {
this.userRadioIndex = val.index
this.userRadioId = val.id
},
// 获取组织列表
async getOrganList() {
let res = await authApi('sysOrganService', '', 'queryEntityTree', '', {
state: 0
})
this.menuData = res.attribute
},
// 获取角色列表
async getRoleList(dataList) {
let params = {
page: 1,
limit: 50,
Sequence: '',
SequenceName: ''
}
let res = await authApi('sysRoleService', '', 'queryEntity', '', { enableState: '0' })
if (res.status == 200) {
console.log(res, 'res')
res.attribute.forEach(el => {
el.isActive = false
if (dataList && dataList.length > 0) {
dataList.forEach(item => {
console.log(item.id,el.id,'id对比')
if (item.roleId == el.id) {
el.isActive = true
}
})
}
})
this.roleList = res.attribute
}
},
// 获取公司列表
async getCompanyList(dataList) {
let res = await authApi('sysOrganService', '', 'queryEntityTree', '', { state: 0 })
if (res.status == 200) {
console.log(res, '组织')
res.attribute.forEach(el => {
el.isActive = false
if (dataList && dataList.length > 0) {
dataList.forEach(item => {
if (el.id == item.userCompanyId) {
el.isActive = true
}
})
}
})
this.companyList = res.attribute
}
},
// 获得人员列表
async getPersonList() {
this.personLoading = true
let params = {
...this.personModel
}
let res = await PersonList(params)
if (res.code === 1) {
this.personTableData = res.data[1]
this.personLoading = false
}
},
async userSave(params) {
let res
if(params.id){
res = await authApi('sysUserService','','updateEntity','',params)
}else{
res = await authApi('sysUserService','','saveEntity','',params)
}
if (res.status == 200) {
this.$vmNews('保存成功', 'success')
this.resetTable()
this.addDialog = false
}
},
// 获得人员详情
async getInfoData(id) {
let params = {
id: id
}
console.log(id)
let res = await authApi('sysUserService','','getEntity','',params)
this.infoData = res.attribute
// this.infoData.p_PersonName = this.infoData.personName
this.getRoleList(res.attribute.userRoles)
this.getCompanyList(res.attribute.userCompanys)
this.formRow[0].elCol[0].disabled = true
this.addDialog = true
this.$nextTick(() => {
this.$refs.customForm.choiceAssignment(this.infoData)
})
},
// 树状图点击
personClick(data) {
this.personModel.organId = data.id
},
elDialogClick() {
this.$refs.basePerson.personDialog = true
// this.personDialog = true
this.getPersonList()
},
// 重置
// result() {
// this.selectTable = []
// this.$refs.personCustomtable.clearSelect();
// },
// 树状图点击
orangClick(data) {
this.pageModel.organId = data.id
this.resetTable()
// this.result()
},
// 表格多选
getPersonSelect(selectTable) {
this.selectPerson = selectTable
},
async ResetPwd(id) {
let params = {
id: id
}
let res = await authApi('sysUserService','','resetPassword','',params)
if (res.status == 200) {
this.$vmNews('重置成功', 'success')
this.resetTable()
this.initPage()
}
},
async openDelData(id) {
let params = {
id: id,
state:0
}
let res = await authApi('sysUserService','','enableDisableEntity','',params)
if (res.status == 200) {
this.$vmNews('已成功启用', 'success')
this.resetTable()
this.initPage()
}
},
async closeDelData(id) {
let params = {
id: id,
state:1
}
let res = await authApi('sysUserService','','enableDisableEntity','',params)
if (res.status == 200) {
this.$vmNews('已成功停用', 'success')
this.resetTable()
this.initPage()
}
},
resetTable() {
this.pageModel.pageNum = 1
this.userRadioId = false
this.userRadioIndex = false
this.selectTable = []
this.$nextTick(() => {
this.$refs.userCustomtable.clearSelect()
this.$refs.userCustomtable.clearRadioIndex()
this.$refs.userLayout.pageClear()
})
this.getTableList()
},
// 操作按钮事件
getFuncBtn(btnEven) {
if (btnEven.menuName === '新增') { // 新增
this.dialogType = 'add'
this.getRoleList()
this.getCompanyList()
this.addDialog = true
}
if (btnEven.menuName != '新增') {
if (this.userRadioIndex === false) {
this.$tipConfirm('请勾选需要处理的信息')
return
}
}
if (btnEven.menuName === '编辑') { // 编辑
this.dialogType = 'edit'
this.getInfoData(this.userRadioId)
// this.$refs.customtable.clearSelect()
}
if (btnEven.menuName === '重置密码') { // 重置密码
this.$confirm('确认重置密码吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.ResetPwd(this.userRadioId)
}).catch(() => {
this.$message({
type: 'info',
message: '已取消操作'
})
})
}
if (btnEven.menuName === '启用') { // 导入
this.$confirm('确认启用吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.openDelData(this.userRadioId)
}).catch(() => {
this.$message({
type: 'info',
message: '已取消操作'
})
})
}
if (btnEven.menuName === '停用') { //
this.$confirm('确认停用吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.closeDelData(this.userRadioId)
}).catch(() => {
this.$message({
type: 'info',
message: '已取消操作'
})
})
}
console.log(btnEven)
if (btnEven.menuName === '删除') { // 删除
// if (!this.judgeCheckbox()) {
// return
// }
this.$confirm('确认删除吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.tableDelData(this.userRadioId)
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
}
},
// 删除功能
async tableDelData(id) {
let params = {
id: id
}
let res = await authApi('sysUserService','','deleteEntity','',params)
if (res.status == 200) {
this.$vmNews('删除成功', 'success')
this.resetTable()
// this.pageModel.page = 1
// this.$refs.personLayout.setPageNum(1)
}
},
getElSelect(event, index, indexItem, param) {
},
handleConfirmClick() {
let ruleForm = this.$refs.customForm.ruleForm
let userCompanys = []
let userRoles = []
this.companyList.forEach(el => {
if (el.isActive === true) {
userCompanys.push({
userCompanyId: el.id
})
}
})
this.roleList.forEach(el => {
if (el.isActive == true) {
userRoles.push({
roleId: el.id
})
}
})
let params = {
// U_UserID: this.dialogType == 'add' ? '00000000-0000-0000-0000-000000000000' : this.infoData.U_UserID,
...ruleForm,
userCompanys: userCompanys,
userRoles: userRoles
}
this.userSave(params)
},
personConfirmClick(val) {
console.log(val)
// P_PersonName 人员姓名 P_PersonCode工号 P_PersonID所属人员id u_UserID用户id
// u_UserID人员id U_LoginCode账号=人员工号
// this.$refs.customForm.ruleForm.U_PersonID = val.p_PersonID
this.$refs.customForm.getField('personID', val.id)
this.$refs.customForm.getField('loginCode', val.personCode)
this.$refs.customForm.getField('personName', val.personName)
this.$refs.basePerson.personDialog = false
},
pageChange(model) {
this.pageModel.pageNum = model.page
this.pageModel.pageSize = model.limit
this.getTableList()
}
}
}
</script>
<style scoped lang='scss'>
<style scoped lang="scss">
.roleName {
padding: 10px 0;
width: 90px;
border: 2px solid #f2f2f2;
background-color: #f2f2f2;
margin: 0px 10px 10px 0px;
text-align: center;
cursor: pointer;
box-shadow: 0 0 0 2px #f2f2f2;
border-radius: 5px;
padding: 10px 0;
width: 90px;
border: 2px solid #f2f2f2;
background-color: #f2f2f2;
margin: 0px 10px 10px 0px;
text-align: center;
cursor: pointer;
box-shadow: 0 0 0 2px #f2f2f2;
border-radius: 5px;
}
.active {
background-color: #00a490;
border: 2px solid #ffffff;
color: white;
box-shadow: 0 0 0 2px #00a490;
background-color: #00a490;
border: 2px solid #ffffff;
color: white;
box-shadow: 0 0 0 2px #00a490;
}
.bigTitle {
padding-bottom: 10px;
margin: 10px 0;
font-size: 16px;
font-weight: bold;
border-bottom: 1px solid #ccc;
padding-bottom: 10px;
margin: 10px 0;
font-size: 16px;
font-weight: bold;
border-bottom: 1px solid #ccc;
}
.organizationBody {
display: flex;
justify-content: space-evenly;
background-color: #f2f3f4;
padding: 10px
display: flex;
justify-content: space-evenly;
background-color: #f2f3f4;
padding: 10px
}
</style>

4
vue.config.js
View File

@ -39,9 +39,9 @@ module.exports = {
proxy: {
// detail: https://cli.vuejs.org/config/#devserver-proxy
[process.env.VUE_APP_BASE_API]: {
target: `http://hzya.ufyct.com:9067/`,
// target: `http://hzya.ufyct.com:9067/`,
// target: `http://127.0.0.1:9081/`,
// target: `http://192.168.2.78:9999`,
target: `http://192.168.2.78:9999`,
changeOrigin: true,
pathRewrite: {
["^" + process.env.VUE_APP_BASE_API]: "",