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

组织机构、人员管理、角色管理新增

This commit is contained in:
hyt 2024-04-02 17:14:13 +08:00
parent 4607974884
commit 48987f9324
33 changed files with 4367 additions and 2729 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
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,10 +24,10 @@ 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,
data
})
}
}

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,

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

@ -3,9 +3,9 @@ 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
})
}
}

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

@ -3,9 +3,9 @@ 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
})
}
}

4
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({
@ -61,4 +61,4 @@ export function getCodeImg() {
method: 'get',
timeout: 20000
})
}
}

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

@ -3,9 +3,9 @@ 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
})
}
}

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>

5
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
@ -126,4 +127,4 @@ export default {
border-radius: 5px;
}
}
</style>
</style>

18
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
}
},
@ -123,4 +125,4 @@ export default {
background-color: #f2f3f4;
padding: 10px
}
</style>
</style>

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

@ -133,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)
},

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>

180
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>
<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>
</template>
<script>
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()
},
}
}
<script>
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()
},
}
}
</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 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>

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

@ -1,44 +1,44 @@
// 搜索配置
const searchModelJson = [
]
// 页面操作按钮配置
const fucDataJson = [{
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,
},
]
export default {
searchModelJson,
fucDataJson,
tableColumnJson,
// 搜索配置
const searchModelJson = [
]
// 页面操作按钮配置
const fucDataJson = [{
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,
},
]
export default {
searchModelJson,
fucDataJson,
tableColumnJson,
}

121
src/views/systemSettings/jurisdictionManage/roleJurisdiction/dataPermissions.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="
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() {
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>

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

@ -1,115 +1,116 @@
<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>
</template>
<script>
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])
})
},
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");
.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;
}
.recordText.active {
background: $activeColor;
color: #fff;
}
}
</style>
<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>
</template>
<script>
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])
})
},
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>
<style lang="scss">
$activeColor: var(--bg-color, "#00aaff");
.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;
}
.recordText.active {
background: $activeColor;
color: #fff;
}
}
</style>

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

@ -1,445 +1,476 @@
<template>
<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>
</template>
<script>
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 { getCompanyId } from '@/utils/auth'
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'
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: {
},
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 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()
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.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() {
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
},
},
}
</script>
<style scoped>
>>>.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;
}
.active {
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;
}
.organizationBody {
display: flex;
justify-content: space-evenly;
background-color: #f2f3f4;
padding: 10px
}
</style>
<template>
<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>
<right-dialog ref="rightDialog" :menuData="menuData" v-if="permissionPopup"></right-dialog>
</div>
</template>
<script>
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 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 {
GetPppedomSet,
GetMenuButton,
GetAllButton,
GetAllBillDataPepedom,
GetAllBilldata,
PopedomSaveData,
} from "@/api/apis/jurisdiction";
export default {
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: {
page: 1,
limit: 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({});
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()
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.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]();
},
async setting() {
this.getMenuData();
this.permissionPopup = true;
this.$nextTick(() => {
this.$refs.rightDialog.drawer = true;
this.$refs.rightDialog.buttonLoading = true;
let params = {
objectID: this.userRadioId,
kindid: 2,
};
GetPppedomSet(params).then((res) => {
if (res.code == 1) {
const data = res.data;
let menuIDs =
data[0].length > 0 ? data[0][0].fp_MenuIdList.split(",") : [];
let echo = data[1].length > 0 ? data[1] : [];
this.$refs.rightDialog.exhibitList(menuIDs, echo, this.userRadioId);
let dataPermissions = data[2].length > 0 ? data[2] : [];
this.$refs.rightDialog.$refs.dataPermissions.selectedList =
dataPermissions;
this.$refs.rightDialog.$refs.layOutPermissions.selectedList = res
.data[3][0]
? res.data[3][0].widgetList
: "";
// this.menuData = this.addToButtonList(this.menuData,echo)
}
});
});
},
// 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.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;
},
},
};
</script>
<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;
}
.active {
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;
}
.organizationBody {
display: flex;
justify-content: space-evenly;
background-color: #f2f3f4;
padding: 10px;
}
</style>

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

@ -1,116 +1,116 @@
<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>
</template>
<script>
import baseLayout from "@/components/base/baseLayout";
import baseTable from "@/components/base/baseTable";
import baseTree from "@/components/base/BaseMenuTree/index.vue";
import configData from "./configData";
import {
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: []
},
},
data() {
return {
treeHight: '444px',
mainHight: 'calc(100% - 80px)',
classifyButtonList: [],
buttonArray: [],
colorsKey: false,
menuPopedom: [],
buttonPopedom: []
}
},
computed: {
},
watch: {
},
created() {
},
onShow() { },
mounted() {
this.initPage()
},
filters: {
},
methods: {
// 初始化页面
initPage() {
},
checkChange(ids, checkdata) {
this.menuPopedom = ids
this.checkdata = checkdata
},
typeChange(item) {
item.type = !item.type
this.$forceUpdate()
},
},
}
</script>
<style scoped lang='scss'>
.buttonSetting {
margin: 10px 0;
}
</style>
<style lang="scss">
$activeColor: var(--bg-color, "#00aaff");
.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.active {
background: $activeColor;
color: #fff;
}
}
</style>
<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>
</template>
<script>
import baseLayout from "@/components/base/baseLayout";
import baseTable from "@/components/base/baseTable";
import baseTree from "@/components/base/BaseMenuTree/index.vue";
import configData from "./configData";
import {
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: []
},
},
data() {
return {
treeHight: '444px',
mainHight: 'calc(100% - 80px)',
classifyButtonList: [],
buttonArray: [],
colorsKey: false,
menuPopedom: [],
buttonPopedom: []
}
},
computed: {
},
watch: {
},
created() {
},
onShow() { },
mounted() {
this.initPage()
},
filters: {
},
methods: {
// 初始化页面
initPage() {
},
checkChange(ids, checkdata) {
this.menuPopedom = ids
this.checkdata = checkdata
},
typeChange(item) {
item.type = !item.type
this.$forceUpdate()
},
},
}
</script>
<style scoped lang='scss'>
.buttonSetting {
margin: 10px 0;
}
</style>
<style lang="scss">
$activeColor: var(--bg-color, "#00aaff");
.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.active {
background: $activeColor;
color: #fff;
}
}
</style>

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

@ -0,0 +1,116 @@
<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 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: "",
};
},
created() {},
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();
});
},
},
watch: {
selectedList(newV, oldV) {
let tempArr = newV.split(",");
this.tableData[0].buttonList = tempArr;
},
},
};
</script>
<style scoped lang="scss"></style>

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

@ -0,0 +1,396 @@
<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">
<i
class="el-icon-star-on"
style="
height: 30px;
line-height: 30px;
font-size: 25px;
margin-right: 7px;
"
v-show="
scope.row.buttons.length != 0 &&
scope.row.buttons.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.buttons.length != 0 &&
scope.row.buttons.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.buttons"
:label="item.id"
:key="item.id"
>{{ item.NameCN }}</el-checkbox
>
</el-checkbox-group>
</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";
export default {
data() {
return {
drawer: false,
multipleSelection: [],
keys: [],
isAllSelect: false,
selected: false,
childNode: false,
build: "",
activeName: "first",
dataPermissions: [],
buttonLoading: false,
};
},
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: {
// tab切换
handleTabClick() {
this.$nextTick(() => {
this.$refs.multipleTable && this.$refs.multipleTable.doLayout();
});
},
selectAllButton(item) {
let data = [];
item.buttons.forEach((el) => {
data.push(el.id);
});
item.buttonList = data;
},
cancellation(item) {
item.buttonList = [];
},
// 全选/取消全选
selectAll() {
let data = this.treeToArray(this.menuDatas);
this.selected = !this.selected;
data.forEach((el, index) => {
this.$refs.multipleTable.toggleRowSelection(el, this.selected);
});
},
handleSelectionChange(val, row) {
this.multipleSelection = val;
let data = this.treeToArray([row]);
this.childNode = !this.childNode;
if (data.length > 1) {
data.forEach((el, index) => {
this.$refs.multipleTable.toggleRowSelection(el, this.childNode);
});
let ids = data[0].id;
let arr = this.treeFindPath(
this.menuDatas,
(data) => data.id == ids,
"id"
);
arr = arr.splice(0, arr.length - 1);
let dataList = [];
let allList = this.treeToArray(this.menuDatas);
allList.forEach((el, index) => {
if (arr.includes(el.id)) {
dataList.push(el);
}
});
dataList.forEach((el, index) => {
this.$refs.multipleTable.toggleRowSelection(el, true);
});
} else {
let ids = data[0].id;
let arr = this.treeFindPath(
this.menuDatas,
(data) => data.id == ids,
"id"
);
arr = arr.splice(0, arr.length - 1);
let dataList = [];
let allList = this.treeToArray(this.menuDatas);
allList.forEach((el, index) => {
if (arr.includes(el.id)) {
dataList.push(el);
}
});
dataList.forEach((el, index) => {
this.$refs.multipleTable.toggleRowSelection(el, true);
});
}
},
// 默认选中
exhibitList(id, echo, build) {
let data = this.treeToArray(this.menuDatas);
this.build = build;
data.forEach((el, index) => {
if (id.includes(el.id)) {
this.$refs.multipleTable.toggleRowSelection(el, true);
}
});
this.menuDatas = this.addToButtonList(this.menuDatas, echo);
this.buttonLoading = false;
},
// 数据扁平
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 data = {
objectID: this.build,
kindid: 2,
menuPopedom: "",
buttonPopedom: [],
dataPopedom: [],
widgetPopedom: "",
};
this.$refs.multipleTable.selection.forEach((el, index) => {
let dataLength = this.$refs.multipleTable.selection.length;
if (index == dataLength - 1) {
data.menuPopedom = data.menuPopedom.concat(`${el.id}`);
} else {
data.menuPopedom = data.menuPopedom.concat(`${el.id},`);
}
if (el.buttonList.length != 0) {
data.buttonPopedom.push({
op_MenuID: el.id,
op_OperateKindList: el.buttonList + [],
});
}
});
let dataPopedom = [];
this.$refs.dataPermissions.tableData.forEach((el) => {
dataPopedom.push({
dp_billKindID: el.billKindID,
dp_popeList: el.buttonList.length > 0 ? el.buttonList + [] : "",
});
});
let tempStr = "";
this.$refs.layOutPermissions.tableData.forEach((item) => {
item.buttonList.forEach((ele) => {
tempStr += ele + ",";
});
});
data.widgetPopedom = tempStr.length ? tempStr.slice(0, -1) : "none";
data.dataPopedom = dataPopedom;
const res = await PopedomSaveData(data);
if (res.success == "true") {
this.handleDialogClose();
this.$message({
message: "保存成功",
type: "success",
});
}
},
// 递归，添加选中按钮
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 {

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

@ -4,67 +4,67 @@
-->
<template>
<div>
<!-- 人员弹窗 -->
<base-dialog :closeEscape="true" :showClose="true" :closeModal="false" :dialogVisible.sync="addDialog"
@handleClose="handleClose" class="userDialog" title="新增人员" width="700px" top="10vh">
<base-form ref="customForm" :formRow="formRow" :isFunBtn="isFunBtn" @elDialogClick="organClick"
:rules="userRules" @onSubmit="getSubmit">
</base-form>
</base-dialog>
<div flex style="height: 100%;">
<base-layout title="组织机构" style="width:260px;" :defaultButtonSwitch="false" :isPage="false"
:mainColor="mainColor" :operateButtonSwitch="false" v-loading="treeLoading">
<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="treeClick"></base-tree>
</div>
</base-layout>
<base-layout title="人员信息" ref="personLayout" @pageChange="pageChange" :buttonList="buttonList"
@onFuncBtn="getFuncBtn" :isPage="true" style="flex:1;">
<div slot="main" slot-scope="{ tableHeight }" style="height: 100%;">
<base-table ref="personCustomtable" :border="true" :showIndex="false" :tabLoading.sync="tabLoading"
@radioChange="radioChange" :tableHeight="tableHeight" :tableData="tableData"
:tableColumn="tableColumn" :slotrow="true">
<!-- 入职时间 -->
<template v-slot:p_EntryTime="{ row }">
<span>{{ row.row.p_EntryTime | timeDate }}</span>
</template>
<!-- 生日 -->
<template v-slot:p_BirthDay="{ row }">
<span>{{ row.row.p_BirthDay | timeDate }}</span>
</template>
</base-table>
</div>
</base-layout>
</div>
<div>
<!-- 人员弹窗 -->
<base-dialog :closeEscape="true" :showClose="true" :closeModal="false" :dialogVisible.sync="addDialog"
@handleClose="handleClose" class="userDialog" title="新增人员" width="700px" top="10vh">
<base-form ref="customForm" :formRow="formRow" :isFunBtn="isFunBtn" @elDialogClick="organClick"
:rules="userRules" @onSubmit="getSubmit">
</base-form>
</base-dialog>
<div flex style="height: 100%;">
<base-layout title="组织机构" style="width:260px;" :defaultButtonSwitch="false" :isPage="false"
:mainColor="mainColor" :operateButtonSwitch="false" v-loading="treeLoading">
<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="treeClick"></base-tree>
</div>
</base-layout>
<base-layout title="人员信息" ref="personLayout" @pageChange="pageChange" :buttonList="buttonList"
@onFuncBtn="getFuncBtn" :isPage="true" style="flex:1;">
<div slot="main" slot-scope="{ tableHeight }" style="height: 100%;">
<base-table ref="personCustomtable" :border="true" :showIndex="false" :tabLoading.sync="tabLoading"
@radioChange="radioChange" :tableHeight="tableHeight" :tableData="tableData"
:tableColumn="tableColumn" :slotrow="true">
<!-- 入职时间 -->
<template v-slot:p_EntryTime="{ row }">
<span>{{ row.row.p_EntryTime | timeDate }}</span>
</template>
<!-- 生日 -->
<template v-slot:p_BirthDay="{ row }">
<span>{{ row.row.p_BirthDay | timeDate }}</span>
</template>
</base-table>
</div>
</base-layout>
</div>
<!-- 部门+对外签订弹窗 -->
<base-organization ref="baseOrganization" :menuData="menuData"
@handleConfirmClick="organizationHandleConfirm"></base-organization>
<!-- <base-dialog :closeEscape="true" :showClose="true" :closeModal="false"
@handleConfirmClick="organizationHandleConfirm" :dialogVisible.sync="organizationDialog" class="userDialog"
title="选择组织机构" width="700px" top="10vh" :footerShow="true">
<div class="organizationBody">
<base-layout title="组织机构" style="width: 45%;border-radius: 5px;height: 350px;overflow: auto;"
:bottonShow="false" :isPage="false" :mainColor="mainColor" :mainHight='orangHight'>
<div slot="main">
<base-tree ref="baseTree" :isCenter="false" :isSaveBtn="false" :Allshow="false"
:showCheckbox="false" :menuData="menuData" @handleNodeClick="orangNodeClick">
</base-tree>
</div>
</base-layout>
<base-layout title="选中机构" style="width: 45%;border-radius: 5px;height: 350px;" :bottonShow="false"
:isPage="false" :bodyHight="treeHight">
<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"></el-input>
</div>
<div flex="cross:center">
<label style="width: 35%;">机构名称</label>
<el-input style="flex:1" v-model="organizationForm.ParentOrganName"></el-input></div></div></base-layout></div></base-dialog> -->
</div>
<!-- 部门+对外签订弹窗 -->
<base-organization ref="baseOrganization" :menuData="menuData"
@handleConfirmClick="organizationHandleConfirm"></base-organization>
<!-- <base-dialog :closeEscape="true" :showClose="true" :closeModal="false"
@handleConfirmClick="organizationHandleConfirm" :dialogVisible.sync="organizationDialog" class="userDialog"
title="选择组织机构" width="700px" top="10vh" :footerShow="true">
<div class="organizationBody">
<base-layout title="组织机构" style="width: 45%;border-radius: 5px;height: 350px;overflow: auto;"
:bottonShow="false" :isPage="false" :mainColor="mainColor" :mainHight='orangHight'>
<div slot="main">
<base-tree ref="baseTree" :isCenter="false" :isSaveBtn="false" :Allshow="false"
:showCheckbox="false" :menuData="menuData" @handleNodeClick="orangNodeClick">
</base-tree>
</div>
</base-layout>
<base-layout title="选中机构" style="width: 45%;border-radius: 5px;height: 350px;" :bottonShow="false"
:isPage="false" :bodyHight="treeHight">
<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"></el-input>
</div>
<div flex="cross:center">
<label style="width: 35%;">机构名称</label>
<el-input style="flex:1" v-model="organizationForm.ParentOrganName"></el-input></div></div></base-layout></div></base-dialog> -->
</div>
</template>
<script>
@ -77,428 +77,430 @@ import baseTree from "@/components/base/BaseMenuTree/index.vue";
import baseOrganization from "@/components/base/baseOrganization/index.vue";
import { getCompanyId } from '@/utils/auth'
import {
PersonList,
PersonDetail,
PersonSaveData,
PersonDelData,
PersonOpen,
PersonClose
PersonList,
PersonDetail,
PersonSaveData,
PersonDelData,
PersonOpen,
PersonClose
} from '@/api/apis/personnelSettings'
import {
GetOrganTree
GetOrganTree
} from '@/api/apis/organization'
import {
dataDictionaryGetBillList
dataDictionaryGetBillList
} from '@/api/apis/dataDictionary'
import configData from "./configData";
import { authApi } from '@/api/apis/auth'
export default {
name: "review",
components: {
baseLayout,
baseTable,
baseDialog,
baseForm,
baseTree,
baseOrganization
},
data() {
return {
treeLoading: false,
radioIndex: false,
radioId: false,
treeHight: '350px',
orangHight: 'calc(100% - 39px)',
mainColor: '#f8f8f8 ',
organizationDialog: false, //选择组织机构弹窗
menuData: [],
buttonList: [
{
icon: 'button_reset',
menuName: '启用',
},
{
icon: 'button_reset',
menuName: '停用',
type: 'danger'
},
],
tabLoading: false,
tableData: [],
// 搜索配置
searchModel: configData.searchModelJson,
// 列表参数
param: {},
addDialog: false,
ruleForm: {
roleName: null, // 角色名称
roleNumber: null, // 角色编码
order: null, // 排序
describe: null, // 描述
},
roleOptions: configData.roleOptions,
formRow: configData.formRow,
userRules: configData.userRules,
isFunBtn: true,
pageModel: {
page: 1,
limit: 20,
departmentID: "",
Sequence: '',
SequenceName: ''
},
P_PersonID: 0,
organizationForm: {}
}
},
computed: {
// 表头配置
tableColumn() {
return configData.tableColumnJson
},
},
watch: {
name: "review",
components: {
baseLayout,
baseTable,
baseDialog,
baseForm,
baseTree,
baseOrganization
},
data() {
return {
treeLoading: false,
radioIndex: false,
radioId: false,
treeHight: '350px',
orangHight: 'calc(100% - 39px)',
mainColor: '#f8f8f8 ',
organizationDialog: false, //选择组织机构弹窗
menuData: [],
buttonList: [
{
icon: 'button_reset',
menuName: '启用',
},
{
icon: 'button_reset',
menuName: '停用',
type: 'danger'
},
],
tabLoading: false,
tableData: [],
// 搜索配置
searchModel: configData.searchModelJson,
// 列表参数
param: {},
addDialog: false,
ruleForm: {
roleName: null, // 角色名称
roleNumber: null, // 角色编码
order: null, // 排序
describe: null, // 描述
},
roleOptions: configData.roleOptions,
formRow: configData.formRow,
userRules: configData.userRules,
isFunBtn: true,
pageModel: {
pageNum: 1,
pageSize: 999,
organId: '',
Sequence: '',
SequenceName: ''
},
P_PersonID: 0,
organizationForm: {}
}
},
computed: {
// 表头配置
tableColumn() {
return configData.tableColumnJson
},
},
watch: {
addDialog: {
deep: true,
handler(newValue, oldValue) {
if (newValue == false) {
this.$refs.customForm.choiceAssignment({})
} else {
this.getLevelnList()
this.getEducationList()
this.getPostList()
}
}
}
},
created() { },
onShow() { },
mounted() {
this.initPage()
addDialog: {
deep: true,
handler(newValue, oldValue) {
if (newValue == false) {
this.$refs.customForm.choiceAssignment({})
} else {
this.getLevelnList()
this.getEducationList()
this.getPostList()
}
}
}
},
created() { },
onShow() { },
mounted() {
this.initPage()
},
filters: {
timeDate(row) {
if (!row) {
return
}
return row.split('T')[0]
}
},
methods: {
// 点击单元格进行多选操作
radioChange(val) {
this.radioIndex = val.index
this.radioId = val.p_PersonID
},
// 树状图点击
treeClick(data) {
this.pageModel.departmentID = data.id
this.radioIndex = false
this.radioId = false
this.resetTable()
},
// 初始化页面
initPage() {
// this.getTableList()
this.getTreeList()
},
filters: {
timeDate(row) {
if (!row) {
return
}
return row.split('T')[0]
}
},
methods: {
// 点击单元格进行多选操作
radioChange(val) {
this.radioIndex = val.index
this.radioId = val.id
},
// 树状图点击
treeClick(data) {
this.pageModel.organId = data.id
this.radioIndex = false
this.radioId = false
this.resetTable()
},
// 初始化页面
initPage() {
// this.getTableList()
this.getTreeList()
},
// 获得树状图
async getTreeList() {
this.treeLoading = true
setTimeout(() => {
this.treeLoading = false
}, 180000)
let params = {
CompanyID: ""
// CompanyID: this.$store.state.user.companyID?this.$store.state.user.companyID:getCompanyId()
}
let res = await GetOrganTree(params)
if (res.success === 'true') {
this.menuData = JSON.parse(res.data[0])
this.treeLoading = false
}
},
// 删除功能
async tableDelData(id) {
let params = {
id: id
}
let res = await PersonDelData(params)
if (res.code == 1) {
this.$vmNews('删除成功', 'success')
this.resetTable()
// this.pageModel.page = 1
// this.$refs.personLayout.setPageNum(1)
}
},
},
// 获得树状图
async getTreeList() {
this.treeLoading = true
setTimeout(() => {
this.treeLoading = false
}, 180000)
let params = {
state: 0,
// CompanyID: this.$store.state.user.companyID?this.$store.state.user.companyID:getCompanyId()
}
let res = await authApi("sysOrganService","","queryEntityTree","",{})
if (res.status == 200) {
this.menuData = res.attribute
this.treeLoading = false
}
},
// 删除功能
async tableDelData(id) {
let params = {
id: id
}
let res = await PersonDelData(params)
if (res.code == 1) {
this.$vmNews('删除成功', 'success')
this.resetTable()
// this.pageModel.page = 1
// this.$refs.personLayout.setPageNum(1)
}
},
// 获得详情
async getDetail(id) {
let params = {
id: id
}
let res = await PersonDetail(params)
res.data[0].o_OrganName = res.data[0].orgainName
this.addDialog = true
this.$nextTick(() => {
this.$refs.customForm.choiceAssignment(res.data[0])
})
},
// 获取学历类型
async getEducationList() {
let params = {
KindId: 3,
page: 1,
limit: 999,
Sequence: '',
SequenceName: ''
}
let res = await dataDictionaryGetBillList(params)
if (res.code == 1) {
let arrList = []
if (res.data[0] > 0) {
res.data[1].forEach(el => {
let arr = {
label: el.ddd_DicDetailsName,
value: el.ddd_DicDetailsID
}
arrList.push(arr)
})
}
configData.formRow[2].elCol[1].options = arrList
}
},
// 获取职务类型
async getPostList() {
let params = {
KindId: 1,
page: 1,
limit: 999,
Sequence: '',
SequenceName: ''
}
let res = await dataDictionaryGetBillList(params)
if (res.code == 1) {
let arrList = []
if (res.data[0] > 0) {
res.data[1].forEach(el => {
let arr = {
label: el.ddd_DicDetailsName,
value: el.ddd_DicDetailsID
}
arrList.push(arr)
})
}
configData.formRow[3].elCol[0].options = arrList
}
},
// 获取级别类型
async getLevelnList() {
let params = {
KindId: 2,
page: 1,
limit: 999,
Sequence: '',
SequenceName: ''
}
let res = await dataDictionaryGetBillList(params)
if (res.code == 1) {
let arrList = []
if (res.data[0] > 0) {
res.data[1].forEach(el => {
let arr = {
label: el.ddd_DicDetailsName,
value: el.ddd_DicDetailsID
}
arrList.push(arr)
})
}
configData.formRow[3].elCol[1].options = arrList
}
},
// 获得列表
async getTableList() {
this.tabLoading = true
this.tableData = []
this.$refs.personCustomtable.clearRadioIndex()
let params = {
...this.pageModel
}
let res = await PersonList(params)
if (res.code === 1) {
this.tableData = res.data[1]
this.$refs.personCustomtable.clearRadioIndex()
// 获得详情
async getDetail(id) {
let params = {
id: id
}
let res = await authApi('sysPersonService',"","getEntity","",params)
console.log(res,'res')
// res.data[0].o_OrganName = res.data[0].orgainName
this.addDialog = true
this.$nextTick(() => {
this.$refs.customForm.choiceAssignment(res.attribute)
})
},
// 获取学历类型
async getEducationList() {
let params = {
KindId: 3,
page: 1,
limit: 999,
Sequence: '',
SequenceName: ''
}
let res = await dataDictionaryGetBillList(params)
if (res.code == 1) {
let arrList = []
if (res.data[0] > 0) {
res.data[1].forEach(el => {
let arr = {
label: el.ddd_DicDetailsName,
value: el.ddd_DicDetailsID
}
arrList.push(arr)
})
}
configData.formRow[2].elCol[1].options = arrList
}
},
// 获取职务类型
async getPostList() {
let params = {
KindId: 1,
page: 1,
limit: 999,
Sequence: '',
SequenceName: ''
}
let res = await dataDictionaryGetBillList(params)
if (res.code == 1) {
let arrList = []
if (res.data[0] > 0) {
res.data[1].forEach(el => {
let arr = {
label: el.ddd_DicDetailsName,
value: el.ddd_DicDetailsID
}
arrList.push(arr)
})
}
configData.formRow[3].elCol[0].options = arrList
}
},
// 获取级别类型
async getLevelnList() {
let params = {
KindId: 2,
page: 1,
limit: 999,
Sequence: '',
SequenceName: ''
}
let res = await dataDictionaryGetBillList(params)
if (res.code == 1) {
let arrList = []
if (res.data[0] > 0) {
res.data[1].forEach(el => {
let arr = {
label: el.ddd_DicDetailsName,
value: el.ddd_DicDetailsID
}
arrList.push(arr)
})
}
configData.formRow[3].elCol[1].options = arrList
}
},
// 获得列表
async getTableList() {
this.tabLoading = true
this.tableData = []
this.$refs.personCustomtable.clearRadioIndex()
let params = {
...this.pageModel
}
let res = await authApi("sysPersonService","","queryEntityPage","",params)
if (res.status == 200) {
console.log(res.attribute,'res.attribute',res)
this.tableData = res.attribute.list;
this.$refs.personCustomtable.clearRadioIndex()
this.$refs.personLayout.setPageTotal(res.data[0])
this.$refs.personLayout.setPageTotal(res.attribute.total)
}
this.tabLoading = false
},
// 停用
async closeDelData(id) {
let params = {
id: id
}
let res = await PersonClose(params)
if (res.code == 1) {
this.$vmNews('已停用', 'success')
this.resetTable()
}
},
// 启用
async openDelData(id) {
let params = {
id: id
}
let res = await PersonOpen(params)
if (res.code == 1) {
this.$vmNews('已启用', 'success')
this.resetTable()
}
},
// 操作按钮事件
getFuncBtn(btnEven) {
if (btnEven.menuName === '新增') { // 新增
this.addDialog = true
this.P_PersonID = 0
// this.$nextTick(()=>{
// this.$refs.customForm.resetForm('ruleForm')
// })
} else {
if (!this.judgeCheckbox()) {
return
}
}
if (btnEven.menuName === '编辑') { // 编辑
// if (!this.judgeCheckbox()) {
// return
// }
this.P_PersonID = this.radioId
this.getDetail(this.radioId)
}
if (btnEven.menuName === '删除') { // 删除
// if (!this.judgeCheckbox()) {
// return
// }
this.$confirm('确认删除吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.tableDelData(this.radioId)
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
}
if (btnEven.menuName === '停用') { // 停用
// if (!this.judgeCheckbox()) {
// return
// }
this.$confirm('确认停用吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.closeDelData(this.radioId)
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
}
if (btnEven.menuName === '启用') { // 停用
}
this.tabLoading = false
},
// 停用
async closeDelData(id) {
let params = {
id: id,
"state": "1"
}
let res = await authApi("sysPersonService","","enableDisableEntity","",params)
if (res.status == 200) {
this.$vmNews('已停用', 'success')
this.resetTable()
}
},
// 启用
async openDelData(id) {
let params = {
id: id,
"state": "0"
}
let res = await authApi("sysPersonService","","enableDisableEntity","",params)
if (res.status == 200) {
this.$vmNews('已启用', 'success')
this.resetTable()
}
},
// 操作按钮事件
getFuncBtn(btnEven) {
if (btnEven.menuName === '新增') { // 新增
this.addDialog = true
this.P_PersonID = 0
// this.$nextTick(()=>{
// this.$refs.customForm.resetForm('ruleForm')
// })
} else {
if (!this.judgeCheckbox()) {
return
}
}
if (btnEven.menuName === '编辑') { // 编辑
// if (!this.judgeCheckbox()) {
// return
// }
this.P_PersonID = this.radioId
this.getDetail(this.radioId)
}
if (btnEven.menuName === '删除') { // 删除
// if (!this.judgeCheckbox()) {
// return
// }
this.$confirm('确认删除吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.tableDelData(this.radioId)
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
}
if (btnEven.menuName === '停用') { // 停用
// if (!this.judgeCheckbox()) {
// return
// }
this.$confirm('确认停用吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.closeDelData(this.radioId)
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
}
if (btnEven.menuName === '启用') { // 停用
// if (!this.judgeCheckbox()) {
// return
// }
this.$confirm('确认启用吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.openDelData(this.radioId)
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
}
},
judgeCheckbox() {
if (this.radioIndex === false) {
this.$vmNews('请勾选需要处理的信息！')
return false
}
return true
},
// if (!this.judgeCheckbox()) {
// return
// }
this.$confirm('确认启用吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.openDelData(this.radioId)
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
}
},
judgeCheckbox() {
if (this.radioIndex === false) {
this.$vmNews('请勾选需要处理的信息！')
return false
}
return true
},
// 查询、筛选事件
pageChange(model) {
this.pageModel.limit = model.limit
this.pageModel.page = model.page
this.getTableList()
},
// 查询、筛选事件
pageChange(model) {
this.pageModel.pageSize = model.limit
this.pageModel.pageNum = model.page
this.getTableList()
},
async getSubmit(data) {
let params = {
...data,
P_PersonID: this.P_PersonID,
}
let res = await PersonSaveData({
dataMain: params
})
if (res.code == 1) {
this.$vmNews('保存成功', 'success')
this.addDialog = false
this.resetTable()
}
},
resetTable() {
this.pageModel.page = 1
this.radioIndex = false
this.radioId = false
this.$nextTick(() => {
this.$refs.personCustomtable.clearSelect();
this.$refs.personLayout.pageClear()
})
this.getTableList()
},
async getSubmit(data) {
let params = {
...data,
}
let res = await authApi("sysPersonService","","saveEntity","",params)
if (res.status == 200) {
this.$vmNews('保存成功', 'success')
this.addDialog = false
this.resetTable()
}
},
resetTable() {
this.pageModel.pageNum = 1
this.radioIndex = false
this.radioId = false
this.$nextTick(() => {
this.$refs.personCustomtable.clearSelect();
this.$refs.personLayout.pageClear()
})
this.getTableList()
},
handleClose() {
this.$nextTick(() => {
this.$refs.customForm.resetForm('ruleForm')
})
},
organClick(row) {
// this.organizationDialog = true
this.$refs.baseOrganization.dialogVisible = true
},
organizationHandleConfirm() {
// this.$refs.customForm.getField(this.propLabel, this.propvalue)
let organizationForm = this.$refs.baseOrganization.organizationForm
this.$nextTick(() => {
this.$refs.customForm.getField('o_OrganName', organizationForm.label)
this.$refs.customForm.getField('P_OrganID', organizationForm.id)
})
// this.organizationDialog = false
this.$refs.baseOrganization.dialogVisible = false
},
orangNodeClick(data) {
this.organizationForm = {
code: data.code,
O_OrganID: data.id,
ParentOrganName: data.label,
}
}
},
handleClose() {
this.$nextTick(() => {
this.$refs.customForm.resetForm('ruleForm')
})
},
organClick(row) {
// this.organizationDialog = true
this.$refs.baseOrganization.dialogVisible = true
},
organizationHandleConfirm() {
// this.$refs.customForm.getField(this.propLabel, this.propvalue)
let organizationForm = this.$refs.baseOrganization.organizationForm
this.$nextTick(() => {
this.$refs.customForm.getField('organId', organizationForm.id)
this.$refs.customForm.getField('organName', organizationForm.label)
})
// this.organizationDialog = false
this.$refs.baseOrganization.dialogVisible = false
},
orangNodeClick(data) {
this.organizationForm = {
code: data.code,
O_OrganID: data.id,
ParentOrganName: data.label,
}
}
},
}
</script>
<style scoped lang='scss'>
@ -512,23 +514,23 @@ export default {
} */
.el-form-item {
color: red !important
color: red !important
}
.organizationBody {
display: flex;
justify-content: space-evenly;
background-color: #f2f3f4;
padding: 10px
display: flex;
justify-content: space-evenly;
background-color: #f2f3f4;
padding: 10px
}
</style>
<style>
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none;
-webkit-appearance: none;
}
input[type="number"] {
-moz-appearance: textfield;
-moz-appearance: textfield;
}
</style>

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>

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]: "",