Browse Source

Merge branch 'master' of http://132.232.92.186:3000/XinXiBu/oa-system

liuhj 2 years ago
parent
commit
fcbd2ba2e7
1 changed files with 180 additions and 195 deletions
  1. 180 195
      src/components/child/AuthorityJob.vue

+ 180 - 195
src/components/child/AuthorityJob.vue

@@ -4,96 +4,75 @@
             <div class="job-head">
             <div class="job-head">
                 <div>
                 <div>
                     <el-select @change="Inquirechange()" v-model="value" clearable placeholder="权限模块">
                     <el-select @change="Inquirechange()" v-model="value" clearable placeholder="权限模块">
-                        <el-option
+                        <el-option v-for="item in authority" :key="item.value" :label="item.label" :value="item.value">
-                        v-for="item in authority"
-                        :key="item.value"
-                        :label="item.label"
-                        :value="item.value">
                         </el-option>
                         </el-option>
                     </el-select>
                     </el-select>
                 </div>
                 </div>
                 <div>
                 <div>
                     <el-select v-model="valuecorporation" clearable placeholder="公司">
                     <el-select v-model="valuecorporation" clearable placeholder="公司">
-                        <el-option
+                        <el-option v-for="item in corporation" :key="item.value" :label="item.label" :value="item.value">
-                        v-for="item in corporation"
-                        :key="item.value"
-                        :label="item.label"
-                        :value="item.value">
                         </el-option>
                         </el-option>
                     </el-select>
                     </el-select>
                     <el-select v-model="valuedepartmental" clearable placeholder="部门">
                     <el-select v-model="valuedepartmental" clearable placeholder="部门">
-                        <el-option
+                        <el-option v-for="item in departmental" :key="item.value" :label="item.label" :value="item.value">
-                        v-for="item in departmental"
-                        :key="item.value"
-                        :label="item.label"
-                        :value="item.value">
                         </el-option>
                         </el-option>
                     </el-select>
                     </el-select>
                     <el-select v-model="valueposition" clearable placeholder="职位">
                     <el-select v-model="valueposition" clearable placeholder="职位">
-                        <el-option
+                        <el-option v-for="item in position" :key="item.value" :label="item.label" :value="item.value">
-                        v-for="item in position"
-                        :key="item.value"
-                        :label="item.label"
-                        :value="item.value">
                         </el-option>
                         </el-option>
                     </el-select>
                     </el-select>
                     <el-button type="primary">保 存</el-button>
                     <el-button type="primary">保 存</el-button>
                 </div>
                 </div>
             </div>
             </div>
             <div class="job-table">
             <div class="job-table">
-                <el-table
+                <el-table :data="authorityLists.slice((currentPage - 1) * pageSize, currentPage * pageSize)" border
-                    :data="authorityLists.slice((currentPage-1)*pageSize,currentPage*pageSize)"
+                    @select="handleSelect" style="width: 100%">
-                    border
+                    <el-table-column type="selection" width="55">
-                    @select="handleSelect"
+                    </el-table-column>
-                    style="width: 100%">
+                    <el-table-column prop="title" label="权限页面" width="180">
-                        <el-table-column
+                    </el-table-column>
-                        type="selection"
+                    <el-table-column width="55" label="查看">
-                        width="55">
+                        <template slot-scope="scope">
-                        </el-table-column>
+                            <el-checkbox v-model="authorityLists[scope.$index].ck"
-                        <el-table-column
+                                @change="selectRadiocheck(scope.$index, scope.row)"
-                        prop="title"
+                                :disabled="authorityLists[scope.$index].disabled"></el-checkbox>
-                        label="权限页面"
+                        </template>
-                        width="180">
+                    </el-table-column>
-                        </el-table-column>
+                    <el-table-column width="55" label="删除">
-                        <el-table-column width="55" label="查看" >
+                        <template slot-scope="scope">
-                            <template slot-scope="scope">
+                            <el-checkbox v-model="authorityLists[scope.$index].sc"
-                                <el-checkbox v-model="authorityLists[scope.$index].ck"   @change="selectRadiocheck(scope.$index,scope.row)" :disabled="authorityLists[scope.$index].disabled"></el-checkbox>
+                                @change="selectRadioerase(scope.$index, scope.row)"
-                            </template>
+                                :disabled="authorityLists[scope.$index].disabled"></el-checkbox>
-                        </el-table-column>
+                        </template>
-                        <el-table-column width="55" label="删除" >
+                    </el-table-column>
-                            <template slot-scope="scope">
+                    <el-table-column width="55" label="编辑">
-                                <el-checkbox v-model="authorityLists[scope.$index].sc"   @change="selectRadioerase(scope.$index,scope.row)" :disabled="authorityLists[scope.$index].disabled"></el-checkbox>
+                        <template slot-scope="scope">
-                            </template>
+                            <el-checkbox v-model="authorityLists[scope.$index].bj"
-                        </el-table-column>
+                                @change="selectRadioedit(scope.$index, scope.row)"
-                        <el-table-column width="55" label="编辑" >
+                                :disabled="authorityLists[scope.$index].disabled"></el-checkbox>
-                            <template slot-scope="scope">
+                        </template>
-                                <el-checkbox v-model="authorityLists[scope.$index].bj"   @change="selectRadioedit(scope.$index,scope.row)" :disabled="authorityLists[scope.$index].disabled"></el-checkbox>
+                    </el-table-column>
-                            </template>
+                    <el-table-column width="55" label="下载">
-                        </el-table-column>
+                        <template slot-scope="scope">
-                        <el-table-column width="55" label="下载" >
+                            <el-checkbox v-model="authorityLists[scope.$index].xz"
-                            <template slot-scope="scope">
+                                @change="selectRadiodown(scope.$index, scope.row)"
-                                <el-checkbox v-model="authorityLists[scope.$index].xz"   @change="selectRadiodown(scope.$index,scope.row)" :disabled="authorityLists[scope.$index].disabled"></el-checkbox>
+                                :disabled="authorityLists[scope.$index].disabled"></el-checkbox>
-                            </template>
+                        </template>
-                        </el-table-column>
+                    </el-table-column>
-                        <el-table-column width="55" label="上传" >
+                    <el-table-column width="55" label="上传">
-                            <template slot-scope="scope">
+                        <template slot-scope="scope">
-                                <el-checkbox v-model="authorityLists[scope.$index].scc"   @change="selectRadioup(scope.$index,scope.row)" :disabled="authorityLists[scope.$index].disabled"></el-checkbox>
+                            <el-checkbox v-model="authorityLists[scope.$index].scc"
-                            </template>
+                                @change="selectRadioup(scope.$index, scope.row)"
-                        </el-table-column>
+                                :disabled="authorityLists[scope.$index].disabled"></el-checkbox>
-                        <el-table-column
+                        </template>
-                        prop="address"
+                    </el-table-column>
-                        label="备注">
+                    <el-table-column prop="address" label="备注">
-                        </el-table-column>
+                    </el-table-column>
                 </el-table>
                 </el-table>
                 <div class="block">
                 <div class="block">
-                    <el-pagination align='center' 
+                    <el-pagination align='center' @size-change="handleSizeChange" @current-change="handleCurrentChange"
-                        @size-change="handleSizeChange" 
+                        :current-page="currentPage" :page-sizes="[14, 20]" :page-size="pageSize"
-                        @current-change="handleCurrentChange"
+                        layout="total, sizes, prev, pager, next" :total="authorityLists.length">
-                        :current-page="currentPage" 
-                        :page-sizes="[14,20]" 
-                        :page-size="pageSize" 
-                        layout="total, sizes, prev, pager, next" 
-                        :total="authorityLists.length">
                     </el-pagination>
                     </el-pagination>
                 </div>
                 </div>
             </div>
             </div>
@@ -108,173 +87,173 @@ export default {
             authority: [{
             authority: [{
                 value: '1',
                 value: '1',
                 label: '人事'
                 label: '人事'
-                }, 
+            },
-                {
+            {
                 value: '2',
                 value: '2',
                 label: '国交'
                 label: '国交'
-                }, 
+            },
-                {
+            {
                 value: '3',
                 value: '3',
                 label: '财务'
                 label: '财务'
-                }, 
+            },
-                {
+            {
                 value: '4',
                 value: '4',
                 label: '报批'
                 label: '报批'
-                }, 
+            },
-                {
+            {
                 value: '5',
                 value: '5',
                 label: '酒店'
                 label: '酒店'
-                }],
+            }],
             value: '',
             value: '',
 
 
             corporation: [{
             corporation: [{
                 value: '选项1',
                 value: '选项1',
                 label: '四川'
                 label: '四川'
-                }, 
+            },
-                {
+            {
                 value: '选项2',
                 value: '选项2',
                 label: '成都'
                 label: '成都'
-                }
+            }
             ],
             ],
             valuecorporation: '',
             valuecorporation: '',
 
 
             departmental: [{
             departmental: [{
                 value: '选项1',
                 value: '选项1',
                 label: '信息部'
                 label: '信息部'
-                }, 
+            },
-                {
+            {
                 value: '选项2',
                 value: '选项2',
                 label: '市场部'
                 label: '市场部'
-                }
+            }
             ],
             ],
             valuedepartmental: '',
             valuedepartmental: '',
 
 
             position: [{
             position: [{
                 value: '选项1',
                 value: '选项1',
                 label: '后端'
                 label: '后端'
-                }, 
+            },
-                {
+            {
                 value: '选项2',
                 value: '选项2',
                 label: 'UI'
                 label: 'UI'
-                }
+            }
             ],
             ],
             valueposition: '',
             valueposition: '',
 
 
-            authorityLists:[],
+            authorityLists: [],
-            authorityList:[
+            authorityList: [
-                {
+                {
-                    title:"人事权限1",
+                    title: "人事权限1",
-                    moduleId:"1",
+                    moduleId: "1",
-                    ck:false,
+                    ck: false,
-                    sc:false,
+                    sc: false,
-                    bj:true,
+                    bj: true,
-                    xz:false,
+                    xz: false,
-                    scc:false
+                    scc: false
                 },
                 },
                 {
                 {
-                    title:"人事权限2",
+                    title: "人事权限2",
-                    moduleId:"1"
+                    moduleId: "1"
                 },
                 },
                 {
                 {
-                    title:"人事权限3",
+                    title: "人事权限3",
-                    moduleId:"1"
+                    moduleId: "1"
                 },
                 },
                 {
                 {
-                    title:"人事权限4",
+                    title: "人事权限4",
-                    moduleId:"1"
+                    moduleId: "1"
                 },
                 },
                 {
                 {
-                    title:"人事权限5",
+                    title: "人事权限5",
-                    moduleId:"1"
+                    moduleId: "1"
                 },
                 },
                 {
                 {
-                    title:"国交权限1",
+                    title: "国交权限1",
-                    moduleId:"2"
+                    moduleId: "2"
                 },
                 },
                 {
                 {
-                    title:"国交权限2",
+                    title: "国交权限2",
-                    moduleId:"2"
+                    moduleId: "2"
                 },
                 },
                 {
                 {
-                    title:"国交权限3",
+                    title: "国交权限3",
-                    moduleId:"2"
+                    moduleId: "2"
                 },
                 },
                 {
                 {
-                    title:"国交权限4",
+                    title: "国交权限4",
-                    moduleId:"2"
+                    moduleId: "2"
                 },
                 },
                 {
                 {
-                    title:"国交权限5",
+                    title: "国交权限5",
-                    moduleId:"2"
+                    moduleId: "2"
                 },
                 },
                 {
                 {
-                    title:"财务权限1",
+                    title: "财务权限1",
-                    moduleId:"3"
+                    moduleId: "3"
                 },
                 },
                 {
                 {
-                    title:"财务权限2",
+                    title: "财务权限2",
-                    moduleId:"3"
+                    moduleId: "3"
                 },
                 },
                 {
                 {
-                    title:"财务权限3",
+                    title: "财务权限3",
-                    moduleId:"3"
+                    moduleId: "3"
                 },
                 },
                 {
                 {
-                    title:"财务权限4",
+                    title: "财务权限4",
-                    moduleId:"3"
+                    moduleId: "3"
                 },
                 },
                 {
                 {
-                    title:"财务权限5",
+                    title: "财务权限5",
-                    moduleId:"3"
+                    moduleId: "3"
                 },
                 },
                 {
                 {
-                    title:"报批权限1",
+                    title: "报批权限1",
-                    moduleId:"4"
+                    moduleId: "4"
                 },
                 },
                 {
                 {
-                    title:"报批权限2",
+                    title: "报批权限2",
-                    moduleId:"4"
+                    moduleId: "4"
                 },
                 },
                 {
                 {
-                    title:"报批权限3",
+                    title: "报批权限3",
-                    moduleId:"4"
+                    moduleId: "4"
                 },
                 },
                 {
                 {
-                    title:"报批权限4",
+                    title: "报批权限4",
-                    moduleId:"4"
+                    moduleId: "4"
                 },
                 },
                 {
                 {
-                    title:"报批权限5",
+                    title: "报批权限5",
-                    moduleId:"4"
+                    moduleId: "4"
                 },
                 },
                 {
                 {
-                    title:"酒店权限1",
+                    title: "酒店权限1",
-                    moduleId:"5"
+                    moduleId: "5"
                 },
                 },
                 {
                 {
-                    title:"酒店权限2",
+                    title: "酒店权限2",
-                    moduleId:"5"
+                    moduleId: "5"
                 },
                 },
                 {
                 {
-                    title:"酒店权限3",
+                    title: "酒店权限3",
-                    moduleId:"5"
+                    moduleId: "5"
                 },
                 },
                 {
                 {
-                    title:"酒店权限4",
+                    title: "酒店权限4",
-                    moduleId:"5"
+                    moduleId: "5"
                 },
                 },
                 {
                 {
-                    title:"酒店权限5",
+                    title: "酒店权限5",
-                    moduleId:"5"
+                    moduleId: "5"
                 }
                 }
             ],
             ],
             currentPage: 1, // 当前页码
             currentPage: 1, // 当前页码
-            pageSize: 14 ,// 每页的数据条数
+            pageSize: 14,// 每页的数据条数
-            stateArr:[],
+            stateArr: [],
-            selectedAccount:[],
+            selectedAccount: [],
         }
         }
     },
     },
-    methods:{
+    methods: {
         //每页条数改变时触发 选择一页显示多少行
         //每页条数改变时触发 选择一页显示多少行
         handleSizeChange(val) {
         handleSizeChange(val) {
             this.currentPage = 1;
             this.currentPage = 1;
@@ -284,19 +263,19 @@ export default {
         handleCurrentChange(val) {
         handleCurrentChange(val) {
             this.currentPage = val;
             this.currentPage = val;
         },
         },
-        Inquirechange(){
+        Inquirechange() {
             console.log(this.value)
             console.log(this.value)
-            var newarr=[];
+            var newarr = [];
-            if(this.input==""){
+            if (this.input == "") {
-                newarr=this.authorityList;
+                newarr = this.authorityList;
-            }else{
+            } else {
-                for(var i=0;i<this.authorityList.length;i++){
+                for (var i = 0; i < this.authorityList.length; i++) {
-                    if(this.authorityList[i].moduleId.includes(this.value)){
+                    if (this.authorityList[i].moduleId.includes(this.value)) {
                         newarr.push(this.authorityList[i]);
                         newarr.push(this.authorityList[i]);
                     }
                     }
                 }
                 }
             }
             }
-            this.authorityLists=newarr;
+            this.authorityLists = newarr;
         },
         },
         //多选框选中方法
         //多选框选中方法
         handleSelect(selection, row) {
         handleSelect(selection, row) {
@@ -305,52 +284,58 @@ export default {
             this.selectedAccount = this.stateArr.flat()
             this.selectedAccount = this.stateArr.flat()
             console.log(this.selectedAccount)
             console.log(this.selectedAccount)
         },
         },
-        selectRadiocheck(index,row){
+        selectRadiocheck(index, row) {
             console.log(index)
             console.log(index)
             console.log(row)
             console.log(row)
         },
         },
-        selectRadioerase(index,row){
+        selectRadioerase(index, row) {
-            console.log(index,row)
+            console.log(index, row)
         },
         },
-        selectRadioedit(index,row){
+        selectRadioedit(index, row) {
-            console.log(index,row)
+            console.log(index, row)
         },
         },
-        selectRadiodown(index,row){
+        selectRadiodown(index, row) {
-            console.log(index,row)
+            console.log(index, row)
         },
         },
-        selectRadioup(index,row){
+        selectRadioup(index, row) {
-            console.log(index,row)
+            console.log(index, row)
         },
         },
     },
     },
-    mounted(){
+    mounted() {
-        this.authorityLists=this.authorityList
+        this.authorityLists = this.authorityList
     }
     }
 }
 }
 </script>
 </script>
 <style>
 <style>
-    body{
+body {
-        margin: 0;
+    margin: 0;
-        padding: 0;
+    padding: 0;
-    }
+}
-    .job-head{
+
-        display: flex;
+.job-head {
-        justify-content: space-between;
+    display: flex;
-    }
+    justify-content: space-between;
-    .job-box{
+}
-        background-color: #fff;
+
-        padding: 10px;
+.job-box {
-        border-radius: 10px;
+    background-color: #fff;
-    }
+    padding: 10px;
-    .job-table{
+    border-radius: 10px;
-        margin-top: 10px;
+}
-    }
+
-    .job-table .block{
+.job-table {
-        margin-top: 10px;
+    margin-top: 10px;
-    }
+}
-    .job-table .el-table--enable-row-transition .el-table__body td.el-table__cell{
+
-        text-align: center;
+.job-table .block {
-    }
+    margin-top: 10px;
-    .job-table .el-table--border .el-table__cell:first-child .cell{
+}
-        text-align: center;
+
-    }
+.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>
 </style>