完成个人权限控制页面

src/components/child/AuthorityJob.vue

@@ -193,6 +193,11 @@ export default {
             this.valueposition = '';
             this.position = [];
             this.departmental = [];
+ 
+            if(this.valuecorporation == ''){
+                return;
+            }
+
             var that = this;
             //初始化界面数据
             this.$axios.post(this.PathUrl + '/api/System/QueryDepartmentList', {
@@ -213,8 +218,13 @@ export default {
         //部门下拉框
         depaChange(){
             var that = this;
-            this.position = [], //职位数据
-            this.valueposition = '',//职位val
+            this.position = []; //职位数据
+            this.valueposition = '';//职位val
+
+            if(this.valuecorporation == '' || this.valuedepartmental == ''){
+                return;
+            }
+
             //初始化界面数据
             this.$axios.post(this.PathUrl + '/api/System/QueryJobPost', {
                 "CompanyId": this.valuecorporation,
@@ -272,6 +282,19 @@ export default {
         JobChange(){
             let val = this.value == '' ? 13 :this.value;
             var that = this;
+
+            if(this.valueposition == ''){
+
+                var arr = this.authorityList;
+                arr.forEach(item=>{
+                    item.selList = [];
+                })
+                this.authorityList = arr;
+                this.authorityLists = this.authorityList;
+
+                return
+            }
+
             //初始化界面数据
             this.$axios.post(this.PathUrl + '/api/System/QueryJobAuth', {
                 "jobid": this.valueposition,

src/components/child/AuthorityUser.vue

@@ -0,0 +1,391 @@
+<template>
+    <div  v-loading="loading"
+    element-loading-text="拼命加载中"
+    element-loading-spinner="el-icon-loading">
+        <div class="job-box">
+            <div class="job-head">
+                <div>
+                    <el-select @change="Inquirechange()" v-model="value" clearable placeholder="权限模块">
+                        <el-option v-for="item in authority" :key="item.value" :label="item.name" :value="item.id">
+                        </el-option>
+                    </el-select>
+                </div>
+                <div>
+                    <el-select @change="companyChange()" v-model="valuecorporation" clearable placeholder="公司">
+                        <el-option v-for="item in corporation" :key="item.value" :label="item.companyName" :value="item.id">
+                        </el-option>
+                    </el-select>
+                    <el-select @change="depaChange()" v-model="valuedepartmental" clearable placeholder="部门">
+                        <el-option v-for="item in departmental" :key="item.id" :label="item.depName" :value="item.id">
+                        </el-option>
+                    </el-select>
+                    <el-select @change="JobChange()" v-model="valueposition" clearable placeholder="职位">
+                        <el-option v-for="item in position" :key="item.id" :label="item.jobName" :value="item.id">
+                        </el-option>
+                    </el-select>
+                    <el-select @change="UserChange()" v-model="Valueuesr"  clearable placeholder="员工">
+                        <el-option v-for="item in Users" :key="item.userId" :label="item.cnName" :value="item.userId">
+                        </el-option>
+                    </el-select>
+                    <el-button type="primary" @click="saveAuth()">保 存</el-button>
+                </div> 
+            </div>
+            <div class="job-table">
+                <el-table :data="authorityLists.slice((currentPage - 1) * pageSize, currentPage * pageSize)" border
+                    @select="handleSelect" @select-all="allchange" style="width: 100%">
+                    <el-table-column type="selection" width="55">
+                    </el-table-column>
+                    <el-table-column prop="name" label="权限页面" width="180">
+                    </el-table-column>
+                    
+                    <el-table-column width="55" :label="op.functionName"  :key="op.id" v-for="op in opList">
+                        <template slot-scope="scope">
+                            <div>
+                                <el-checkbox @change='checkchange(authorityLists[scope.$index].id,op.id)'  v-if=" authorityLists[scope.$index].opList.indexOf(op.id) != -1" :value="authorityLists[scope.$index].selList.indexOf(op.id) != -1" >
+                                </el-checkbox >
+                                <el-checkbox  v-else :disabled="true" >
+                                </el-checkbox>
+                            </div>
+                        </template>
+                    </el-table-column>
+                   
+                  
+                    <el-table-column prop="address" label="备注">
+                    </el-table-column>
+                </el-table>
+                <div class="block">
+                    <el-pagination align='center' @size-change="handleSizeChange" @current-change="handleCurrentChange"
+                        :current-page="currentPage" :page-sizes="[14, 20]" :page-size="pageSize"
+                        layout="total, sizes, prev, pager, next" :total="authorityList.length">
+                    </el-pagination>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+import { cw } from '@fullcalendar/core/internal-common';
+import { promised, reject, resolve } from 'q';
+
+export default {
+    data() {
+        return {
+            authority: [],
+            value: '',        //模块下拉框数据
+            corporation: [],
+            valuecorporation: '',//公司val
+
+            departmental: [], //部门数据
+            valuedepartmental: '', //部门val
+
+            position: [], //职位数据
+            valueposition: '',//职位val
+
+            authorityLists: [],
+            authorityList: [],
+            currentPage: 1, // 当前页码
+            pageSize: 14,// 每页的数据条数
+            stateArr: [],
+            selectedAccount: [],
+            PathUrl:'http://localhost:5256',
+            opList :[],//操作方式
+            loading:true,
+            Users:[],
+            Valueuesr:'',//员工val
+        }
+    },
+    methods: {
+        //每页条数改变时触发 选择一页显示多少行
+        handleSizeChange(val) {
+            this.currentPage = 1;
+            this.pageSize = val;
+        },
+        //当前页改变时触发 跳转其他页
+        handleCurrentChange(val) {
+            this.currentPage = val;
+        },
+        //模块下拉框
+        Inquirechange() {
+            this.currentPage = 1;
+            this.pageload(this.value);
+        },
+        //多选框选中方法
+        handleSelect(selection, row) {
+            console.log(selection,row)
+            if (selection.length > 0) {
+                row.selList = this.opList.map(x => x.id);
+            }else{
+                row.selList = [];
+            }
+        },
+        selectRadiocheck(index, row) {
+            console.log(index)
+            console.log(row)
+        },
+        selectRadioerase(index, row) {
+            console.log(index, row)
+        },
+        selectRadioedit(index, row) {
+            console.log(index, row)
+        },
+        selectRadiodown(index, row) {
+            console.log(index, row)
+        },
+        selectRadioup(index, row) {
+            console.log(index, row)
+        },
+        pageload(moduleId){
+            var that = this;
+            //初始化界面数据
+            this.$axios.post(this.PathUrl + '/api/System/GetAuth', {
+                "pageSize": this.pageSize,
+                "currentPage": this.currentPage,
+                "moduleId":moduleId,
+            }, {
+                headers: {
+                    'Authorization': 'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1laWRlbnRpZmllciI6IkZ1dHVyZSIsImV4cCI6MTY3OTU0MjgwNSwiaXNzIjoiT0FTeXN0ZW0uY29tIiwiYXVkIjoiT0FTeXN0ZW0uY29tIn0.iy5SUInq1p3yjZultRPyzCa2ekLeepSdMLxvPwXY6MI',
+                }
+            }).then(resp => {
+                if (resp.data.code == 200) {
+                    that.authority = resp.data.data.setDataResult; //模块数据
+                    that.corporation = resp.data.data.companyDataResult; //公司数据
+                    that.authorityList = resp.data.data.systemMenuPermissionData; //页面数据(默认权限页面)
+                    that.authorityLists = that.authorityList;
+                    that.opList = resp.data.data.pageOperation; //操作方式
+                    that.loading =false;
+                }
+            }).then(suc=>{
+                if(this.Valueuesr != ''){
+                    //链式调用加载
+                    this.UserChange();
+                }
+            })
+        },
+        //公司下拉框
+        companyChange(){
+
+            this.valuedepartmental = ''; //清空数据
+            this.valueposition = '';
+            this.position = [];
+            this.departmental = [];
+            this.Valueuesr = ''; //清空数据
+            this.Users = [];
+
+            if(this.valuecorporation == ''){
+                return;
+            }
+           
+            var that = this;
+            //初始化界面数据
+            this.$axios.post(this.PathUrl + '/api/System/QueryDepartmentList', {
+                "CompanyId": this.valuecorporation,
+                "PortType": 1,
+            }, {
+                headers: {
+                    'Authorization': 'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1laWRlbnRpZmllciI6IkZ1dHVyZSIsImV4cCI6MTY3OTU0MjgwNSwiaXNzIjoiT0FTeXN0ZW0uY29tIiwiYXVkIjoiT0FTeXN0ZW0uY29tIn0.iy5SUInq1p3yjZultRPyzCa2ekLeepSdMLxvPwXY6MI',
+                }
+            }).then(resp => {
+                console.log(resp);
+                if (resp.data.code == 200) {
+                    that.departmental = resp.data.data;
+                }
+            })
+
+        },
+        //部门下拉框
+        depaChange(){
+
+            this.position = []; //职位数据
+            this.valueposition = '';//职位val
+            this.Valueuesr = ''; //清空数据
+            this.Users = [];
+
+            if(this.valuecorporation == '' || this.valuedepartmental == ''){
+                return;
+            }
+
+            var that = this;
+            //初始化界面数据
+            this.$axios.post(this.PathUrl + '/api/System/QueryJobPost', {
+                "CompanyId": this.valuecorporation,
+                "DepId":this.valuedepartmental,
+                "PortType": 1,
+            }, {
+                headers: {
+                    'Authorization': 'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1laWRlbnRpZmllciI6IkZ1dHVyZSIsImV4cCI6MTY3OTU0MjgwNSwiaXNzIjoiT0FTeXN0ZW0uY29tIiwiYXVkIjoiT0FTeXN0ZW0uY29tIn0.iy5SUInq1p3yjZultRPyzCa2ekLeepSdMLxvPwXY6MI',
+                }
+            }).then(resp => {
+                console.log(resp);
+                if (resp.data.code == 200) {
+                    that.position =  resp.data.data;
+                }
+            })
+        },
+        //保存权限
+        saveAuth(){
+            var that = this;
+
+            if(this.Valueuesr == ''){
+                this.$message.error('请选择员工！');
+                return;  
+            }
+
+            var savejob = [];
+            this.authorityLists.forEach(item=>{
+                savejob.push({
+                    SmId:item.id,
+                    FIds:item.selList,
+                });
+            })
+            console.log(savejob);
+            //初始化界面数据
+            this.$axios.post(this.PathUrl + '/api/System/SaveUserAuth', {
+                "uid": this.Valueuesr,
+                "Savejobs": savejob,
+            }, {
+                headers: {
+                    'Authorization': 'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1laWRlbnRpZmllciI6IkZ1dHVyZSIsImV4cCI6MTY3OTU0MjgwNSwiaXNzIjoiT0FTeXN0ZW0uY29tIiwiYXVkIjoiT0FTeXN0ZW0uY29tIn0.iy5SUInq1p3yjZultRPyzCa2ekLeepSdMLxvPwXY6MI',
+                }
+            }).then(resp => {
+                console.log(resp);
+                if (resp.data.code == 200) {
+                    this.$message({
+                        message: '保存成功！',
+                        type: 'success'
+                    });
+                }else{
+                    this.$message.error('保存失败！'+ resp.data.msg);
+                }
+            })
+        },
+        //职位下拉获取权限
+        JobChange(){
+
+            this.Valueuesr = ''; //清空数据
+            this.Users = [];
+
+            if(this.valuecorporation == '' || this.valuedepartmental == '' || this.valueposition == ''){
+                return;
+            }
+
+            var that = this;
+            //获取员工信息
+            this.$axios.post(this.PathUrl + '/api/System/QueryUserList', {
+                "CompanyId": this.valuecorporation,
+                "DepId":this.valuedepartmental, 
+                "JobPostId":this.valueposition,
+                "PortType":1
+
+            }, {
+                headers: {
+                    'Authorization': 'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1laWRlbnRpZmllciI6IkZ1dHVyZSIsImV4cCI6MTY3OTU0MjgwNSwiaXNzIjoiT0FTeXN0ZW0uY29tIiwiYXVkIjoiT0FTeXN0ZW0uY29tIn0.iy5SUInq1p3yjZultRPyzCa2ekLeepSdMLxvPwXY6MI',
+                }
+            }).then(resp => {
+                console.log(resp);
+                if (resp.data.code == 200) {
+                   that.Users = resp.data.data;
+                }
+            })
+        },
+        //全选
+        allchange(selection){
+            let that = this;
+
+            if (selection.length > 0) {
+                selection.forEach(item => {
+                    item.selList = that.opList.map(x => x.id);
+                });
+
+            }else{
+                this.authorityLists.forEach(item => {
+                    item.selList = [];
+                });
+            }
+        },
+        checkchange(rowid, linid) {
+            this.authorityLists.forEach(item => {
+                if (item.id == rowid) {
+                    if(item.selList.indexOf(linid) == -1){
+                        item.selList.push(linid);
+                    }else{
+                        item.selList.splice(item.selList.indexOf(linid), 1)
+                    }
+                }
+            });
+            console.warn(this.authorityLists);
+        },
+        //员工下拉框
+        UserChange(){
+            console.log(this.Valueuesr);
+
+            var moduleId = this.value == "" ? 13 :this.value;
+            if(this.Valueuesr == ''){
+
+                var arr = this.authorityList;
+                arr.forEach(item=>{
+                    item.selList = [];
+                })
+                this.authorityList = arr;
+                this.authorityLists = this.authorityList;
+                return;
+            }
+
+            var that = this;
+            //获取员工信息
+            this.$axios.post(this.PathUrl + '/api/System/QueryUserAuth', {
+                "Userid": this.Valueuesr,
+                "moduleId":moduleId
+
+            }, {
+                headers: {
+                    'Authorization': 'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1laWRlbnRpZmllciI6IkZ1dHVyZSIsImV4cCI6MTY3OTU0MjgwNSwiaXNzIjoiT0FTeXN0ZW0uY29tIiwiYXVkIjoiT0FTeXN0ZW0uY29tIn0.iy5SUInq1p3yjZultRPyzCa2ekLeepSdMLxvPwXY6MI',
+                }
+            }).then(resp => {
+                console.log(resp);
+                if (resp.data.code == 200) {
+                    that.authorityList = resp.data.data; //页面数据(默认权限页面)
+                    that.authorityLists = that.authorityList;
+                }
+            })
+
+        }
+    },
+    mounted() {
+        this.pageload(13);
+    }
+}
+</script>
+<style>
+body {
+    margin: 0;
+    padding: 0;
+}
+
+.job-head {
+    display: flex;
+    justify-content: space-between;
+}
+
+.job-box {
+    background-color: #fff;
+    padding: 10px;
+    border-radius: 10px;
+}
+
+.job-table {
+    margin-top: 10px;
+}
+
+.job-table .block {
+    margin-top: 10px;
+}
+
+.job-table .el-table--enable-row-transition .el-table__body td.el-table__cell {
+    text-align: center;
+}
+
+.job-table .el-table--border .el-table__cell:first-child .cell {
+    text-align: center;
+}
+</style>

src/router/index.js

@@ -13,6 +13,7 @@ import Globalindex from '@/components/child/Globalindex'
 import Generalindex from '@/components/child/Generalindex'
 import AuthorityJob from '@/components/child/AuthorityJob'
 import Controltree from '@/components/child/Controltree'
+import AuthorityUser from '@/components/child/AuthorityUser'
 
 Vue.use(Router)
 
@@ -68,6 +69,11 @@ export default new Router({
           name: 'AuthorityJob',
           component: AuthorityJob
         },
+        {
+          path: '/home/AuthorityUser',
+          name: 'AuthorityUser',
+          component: AuthorityUser
+        },
         {
           path: '/home/Controltree',
           name: 'Controltree',