|
|
@@ -0,0 +1,184 @@
|
|
|
+<template>
|
|
|
+ <div class="app-container">
|
|
|
+ <el-tabs v-model="activeName" @tab-click="handleClick" >
|
|
|
+ <el-form ref="form14" :model="form14" :rules="rules14" label-width="180px">
|
|
|
+
|
|
|
+ <el-form-item label="菜单权限">
|
|
|
+ <el-checkbox v-model="menuExpand" @change="handleCheckedTreeExpand($event, 'menu')">展开/折叠</el-checkbox>
|
|
|
+ <el-checkbox v-model="menuNodeAll" @change="handleCheckedTreeNodeAll($event, 'menu')">全选/全不选</el-checkbox>
|
|
|
+ <el-checkbox v-model="menuCheckStrictly" @change="handleCheckedTreeConnect($event, 'menu')">父子联动</el-checkbox>
|
|
|
+ <el-tree
|
|
|
+ class="tree-border"
|
|
|
+ :data="menuOptions"
|
|
|
+ show-checkbox
|
|
|
+ ref="menu"
|
|
|
+ node-key="id"
|
|
|
+ :check-strictly="!menuCheckStrictly"
|
|
|
+ empty-text="加载中，请稍后"
|
|
|
+ :props="defaultProps"
|
|
|
+ ></el-tree>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <div class="footer">
|
|
|
+ <el-button type="primary" @click="submitForm14">提 交</el-button>
|
|
|
+ </div>
|
|
|
+ </el-form>
|
|
|
+ </el-tabs>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import Editor from '@/components/Editor/wang';
|
|
|
+import { getConfigByKey,updateConfigByKey, clearCache } from "@/api/system/config";
|
|
|
+import { listCompany } from "@/api/company/company";
|
|
|
+import Material from '@/components/Material'
|
|
|
+import {treeselect as menuTreeselect} from "@/api/company/companyMenu";
|
|
|
+export default {
|
|
|
+ name: "Config",
|
|
|
+ components: {
|
|
|
+ Material,
|
|
|
+ Editor
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ photoArr: function(val) {
|
|
|
+ this.form1.certs = val.join(',')
|
|
|
+ },
|
|
|
+ images: function(val) {
|
|
|
+ this.form7.images = val.join(',')
|
|
|
+ }
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ menuCheckStrictly: true,
|
|
|
+ defaultProps: {
|
|
|
+ children: "children",
|
|
|
+ label: "label"
|
|
|
+ },
|
|
|
+ // 菜单列表
|
|
|
+ menuOptions: [],
|
|
|
+ menuExpand: false,
|
|
|
+ menuNodeAll: false,
|
|
|
+ companyOptions:[],
|
|
|
+ activeName:"companymenu.config",
|
|
|
+ configId:null,
|
|
|
+ configKey:null,
|
|
|
+ form14:{},
|
|
|
+ rules14:{}
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.getConfigByKey(this.activeName);
|
|
|
+ this.getMenuTreeselect();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ handleClick(tab, event){
|
|
|
+ console.log(tab.name)
|
|
|
+ this.getConfigByKey(tab.name);
|
|
|
+ },
|
|
|
+ /** 查询菜单树结构 */
|
|
|
+ getMenuTreeselect() {
|
|
|
+ menuTreeselect().then(response => {
|
|
|
+ this.menuOptions = response.data;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 树权限（展开/折叠）
|
|
|
+ handleCheckedTreeExpand(value, type) {
|
|
|
+ if (type == 'menu') {
|
|
|
+ let treeList = this.menuOptions;
|
|
|
+ for (let i = 0; i < treeList.length; i++) {
|
|
|
+ this.$refs.menu.store.nodesMap[treeList[i].id].expanded = value;
|
|
|
+ }
|
|
|
+ } else if (type == 'dept') {
|
|
|
+ let treeList = this.deptOptions;
|
|
|
+ for (let i = 0; i < treeList.length; i++) {
|
|
|
+ this.$refs.dept.store.nodesMap[treeList[i].id].expanded = value;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 树权限（全选/全不选）
|
|
|
+ handleCheckedTreeNodeAll(value, type) {
|
|
|
+ if (type == 'menu') {
|
|
|
+ this.$refs.menu.setCheckedNodes(value ? this.menuOptions: []);
|
|
|
+ } else if (type == 'dept') {
|
|
|
+ this.$refs.dept.setCheckedNodes(value ? this.deptOptions: []);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 树权限（父子联动）
|
|
|
+ handleCheckedTreeConnect(value, type) {
|
|
|
+ if (type == 'menu') {
|
|
|
+ this.menuCheckStrictly = value ? true: false;
|
|
|
+ } else if (type == 'dept') {
|
|
|
+ this.deptCheckStrictly = value ? true: false;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getCompanyOptions() {
|
|
|
+ listCompany().then(response=>{
|
|
|
+ this.companyOptions = response.rows
|
|
|
+ })
|
|
|
+ },
|
|
|
+ handleSuccess(response, file) {
|
|
|
+ // 上传成功后的回调函数
|
|
|
+ this.myloading.close();
|
|
|
+ this.form7.videoUrl = response.url;
|
|
|
+ this.$refs.upload.clearFiles();
|
|
|
+ },
|
|
|
+
|
|
|
+ getConfigByKey(key){
|
|
|
+ getConfigByKey(key).then(response => {
|
|
|
+ if(key == "companymenu.config"){
|
|
|
+ this.getCompanyOptions();
|
|
|
+ console.log(response.data.configId)
|
|
|
+ this.configId=response.data.configId;
|
|
|
+ this.configKey=response.data.configKey;
|
|
|
+ if(response.data.configValue != null) {
|
|
|
+ this.form14 = JSON.parse(response.data.configValue);
|
|
|
+ // 回显选中的菜单
|
|
|
+ this.$nextTick(() => {
|
|
|
+ if (this.form14.menuIds && this.form14.menuIds.length > 0) {
|
|
|
+ this.$refs.menu.setCheckedKeys(this.form14.menuIds);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.form14 = { menuIds: [] };
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ submitForm14(){
|
|
|
+ this.form14.menuIds = this.getMenuAllCheckedKeys();
|
|
|
+ var param={configId:this.configId,configKey:this.configKey,configValue:JSON.stringify(this.form14)}
|
|
|
+ updateConfigByKey(param).then(response => {
|
|
|
+ if (response.code === 200) {
|
|
|
+ this.msgSuccess("修改成功");
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 所有菜单节点数据
|
|
|
+ getMenuAllCheckedKeys() {
|
|
|
+ // 目前被选中的菜单节点
|
|
|
+ let checkedKeys = this.$refs.menu.getHalfCheckedKeys();
|
|
|
+ // 半选中的菜单节点
|
|
|
+ let halfCheckedKeys = this.$refs.menu.getCheckedKeys();
|
|
|
+ checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys);
|
|
|
+ return checkedKeys;
|
|
|
+ },
|
|
|
+ /** 清理缓存按钮操作 */
|
|
|
+ handleClearCache() {
|
|
|
+ clearCache().then(response => {
|
|
|
+ if (response.code === 200) {
|
|
|
+ this.msgSuccess("清理成功");
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style scoped>
|
|
|
+.footer{
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: flex-end;
|
|
|
+ justify-content: flex-end;
|
|
|
+}
|
|
|
+</style>
|
