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