835 lines
24 KiB
Vue
835 lines
24 KiB
Vue
<!--
|
|
* @Descripttion:
|
|
* @version:
|
|
* @Author: kBank
|
|
* @Date: 2022-10-24 15:45:01
|
|
-->
|
|
<template>
|
|
<div class="page">
|
|
<div class="topbox">
|
|
<topBar
|
|
v-if="topList.length > 0"
|
|
:top-list="topList"
|
|
:moren="moren"
|
|
/>
|
|
</div>
|
|
<div class="main">
|
|
<div class="table_a">
|
|
<div class="change_l">{{ '角色' }}</div>
|
|
<!-- {{roleAllList}}-->
|
|
<div class="table_b">
|
|
<div class="change_i">
|
|
<el-checkbox
|
|
v-for="(item, index) in roleAllList"
|
|
:key="item.roleId"
|
|
v-model="item.changed"
|
|
:disabled="disabled"
|
|
:value="item.roleId"
|
|
:label="item.roleName"
|
|
@change="checkClickC($event,index)"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="table_a">
|
|
<div class="change_l">{{ '管理名称' }}</div>
|
|
<div class="table_b">
|
|
<div class="change_i">
|
|
<el-checkbox
|
|
v-for="(item, index) in userList"
|
|
:key="item.value"
|
|
v-model="item.changed"
|
|
:disabled="disabled"
|
|
:value="item.userId"
|
|
:label="item.nickName"
|
|
@change="checkClickD($event,index)"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="table_a fx_s">
|
|
<div class="change_l" style="width: 400px;height: 100%">{{ '菜单' }}</div>
|
|
<div class="table_b">
|
|
<div class="change_i" style="display: block;padding: 0;border-bottom: none;width: 1520px;overflow-x: auto">
|
|
<div v-for="(item, index) in menuAllList" class="flex-s" style="display: block">
|
|
<div class="table_cc " :style="!item.children?'height:50px;border-bottom:1px solid #ccc':''">
|
|
<div class="flex-1">
|
|
<el-checkbox
|
|
:key="item.value"
|
|
v-model="item.changed"
|
|
:disabled="disabled"
|
|
:value="item.userId"
|
|
:label="item.menuName"
|
|
@change="checkClickA($event,index)"
|
|
/>
|
|
</div>
|
|
<div>
|
|
<div v-for="(items,indexs) in item.children">
|
|
<div style="display: flex">
|
|
<div class="class3">
|
|
<el-checkbox
|
|
:key="items.value"
|
|
v-model="items.changed"
|
|
class="checks"
|
|
:disabled="disabled"
|
|
:value="items.userId"
|
|
:label="items.menuName"
|
|
@change="checkClickB($event,index,indexs)"
|
|
/>
|
|
</div>
|
|
<div class="class2">
|
|
<div v-for="(item_s,index_s) in items.children" class="width-s">
|
|
<div class="width100">
|
|
<el-checkbox
|
|
:key="item_s.value"
|
|
v-model="item_s.changed"
|
|
class="bd-s"
|
|
:disabled="disabled"
|
|
:value="item_s.userId"
|
|
:label="item_s.menuName"
|
|
@change="checkClickF($event,index,indexs,index_s)"
|
|
/>
|
|
</div>
|
|
<div v-if="item_s.children" class="class1">
|
|
<div v-for="(item1,indexs1) in item_s.children" class="borders">
|
|
<el-checkbox
|
|
:key="item1.value"
|
|
v-model="item1.changed"
|
|
class="box-s flex1"
|
|
:disabled="disabled"
|
|
:value="item1.userId"
|
|
:label="item1.menuName"
|
|
@change="checkClickG($event,index,indexs,index_s,indexs1)"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<!-- <div class="change_i" style="border-left: 1px solid #ccc;align-items: inherit">-->
|
|
<!-- <el-checkbox-->
|
|
<!-- v-for="(items,indexs) in item.children"-->
|
|
<!-- :key="items.value"-->
|
|
<!-- v-model="items.changed"-->
|
|
<!-- :disabled="disabled"-->
|
|
<!-- :value="items.userId"-->
|
|
<!-- :label="items.menuName"-->
|
|
<!-- @change="checkClickB($event,index,indexs)"-->
|
|
<!-- />-->
|
|
<!-- </div>-->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- <div-->
|
|
<!-- v-for="(item,index) in typeList"-->
|
|
<!-- :key="index"-->
|
|
<!-- class="table_a"-->
|
|
<!-- >-->
|
|
<!-- <div class="change_l">{{ item.label }}</div>-->
|
|
<!-- <div class="table_b">-->
|
|
<!-- <div-->
|
|
<!-- v-for="(ctem,cndex) in item.enumList"-->
|
|
<!-- :key="cndex"-->
|
|
<!-- class="table_c"-->
|
|
<!-- >-->
|
|
<!-- <div class="change_i table_cc">-->
|
|
<!-- <el-checkbox-->
|
|
<!-- v-model="ctem.changed"-->
|
|
<!-- @change="checkClickA($event,index,cndex)"-->
|
|
<!-- >{{ ctem.label }}</el-checkbox>-->
|
|
<!-- </div>-->
|
|
<!-- <div-->
|
|
<!-- v-for="(stem,sndex) in ctem.enumList"-->
|
|
<!-- :key="sndex"-->
|
|
<!-- >-->
|
|
<!-- <div class="change_i">-->
|
|
<!-- <el-checkbox-->
|
|
<!-- v-model="stem.changed"-->
|
|
<!-- @change="checkClickB($event,index,cndex,sndex)"-->
|
|
<!-- >{{ stem.label }}</el-checkbox>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
</div>
|
|
<div class="footer">
|
|
<el-button
|
|
size="small"
|
|
class="myBtn"
|
|
@click="$router.push('/system/limits/limitsList');"
|
|
> {{ '取消' }}</el-button>
|
|
<el-button
|
|
style="margin-left: 40px"
|
|
size="small"
|
|
class="myBtn1"
|
|
:disabled="disabled"
|
|
@click="submit"
|
|
> {{ '确认' }}</el-button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import topBar from '@/components/topBar'
|
|
import * as api from '@/api/notice.js'
|
|
export default {
|
|
name: 'Bzpz',
|
|
components: {
|
|
topBar
|
|
},
|
|
data() {
|
|
return {
|
|
userIds: '',
|
|
tabActive: 0,
|
|
disabled: false,
|
|
roleAllList: [],
|
|
roleAllList1: [],
|
|
arr: [],
|
|
userList: [],
|
|
roleList: [],
|
|
menuAllList: [],
|
|
typeList: [],
|
|
gradeList: [],
|
|
rangList: [],
|
|
awardList: [],
|
|
menuList: [],
|
|
query: {
|
|
userList: [],
|
|
roleAllList: [],
|
|
menuAllList: []
|
|
},
|
|
moren: 'addMenuRole',
|
|
topList: [
|
|
{
|
|
name: '后台菜单权限',
|
|
path: 'addMenuRole'
|
|
}
|
|
]
|
|
}
|
|
},
|
|
mounted() {
|
|
// 获取列表
|
|
this.getDataList()
|
|
},
|
|
methods: {
|
|
handleLink(item) {
|
|
this.tabActive = item.id
|
|
},
|
|
submit() {
|
|
const obj = {
|
|
userIdList: [], // 管理员列表
|
|
menuIdList: [], // 菜单列表
|
|
adminList: [] // 角色列表
|
|
}
|
|
const objs = []
|
|
// 角色
|
|
this.roleAllList.forEach((item) => {
|
|
if (item.changed) {
|
|
objs.push(item.roleId)
|
|
}
|
|
})
|
|
// 管理员
|
|
this.userList.forEach((item) => {
|
|
if (item.changed) {
|
|
obj.userIdList.push(item.userId)
|
|
}
|
|
})
|
|
// 菜单
|
|
this.menuAllList.forEach((item, index) => {
|
|
console.error(item)
|
|
if (item.changed) {
|
|
obj.menuIdList.push(item.menuId)
|
|
}
|
|
if (item.children) {
|
|
item.children.forEach((ctem) => {
|
|
if (ctem.changed) {
|
|
obj.menuIdList.push(ctem.menuId)
|
|
if (ctem.children) {
|
|
ctem.children.forEach((ctems) => {
|
|
if (ctems.changed) {
|
|
obj.menuIdList.push(ctems.menuId)
|
|
}
|
|
if (ctems.children) {
|
|
ctems.children.forEach((item) => {
|
|
if (item.changed) {
|
|
obj.menuIdList.push(item.menuId)
|
|
}
|
|
})
|
|
}
|
|
})
|
|
}
|
|
}
|
|
})
|
|
}
|
|
})
|
|
console.error(obj.menuIdList)
|
|
if (obj.userIdList.length == 0) {
|
|
this.$message({
|
|
message: '请选择管理名称'
|
|
})
|
|
return
|
|
}
|
|
if (objs.length == 0) {
|
|
this.$message({
|
|
message: '请选择角色'
|
|
})
|
|
return
|
|
}
|
|
if (obj.menuIdList.length == 0) {
|
|
this.$message({
|
|
message: '请选择菜单'
|
|
})
|
|
return
|
|
}
|
|
api.userMenu(obj).then((res) => {
|
|
this.$message({
|
|
message: res.msg,
|
|
type: 'success'
|
|
})
|
|
this.$router.push('/system/limits/limitsList')
|
|
})
|
|
},
|
|
async getDataList() {
|
|
// 获取管理员全部
|
|
await api.getUserAdmin().then((res) => {
|
|
res.data.forEach((item) => {
|
|
item.changed = false
|
|
})
|
|
this.userList = res.data
|
|
})
|
|
// 获取全部角色
|
|
await api.roleAllList().then((res) => {
|
|
res.data.forEach((item) => {
|
|
item.changed = false
|
|
})
|
|
this.roleAllList = res.data
|
|
this.roleAllList1 = res.data
|
|
})
|
|
// 获取全部菜单
|
|
await api.menuAllList().then((res) => {
|
|
this.menuAllList = res.data
|
|
this.setNewArr()
|
|
})
|
|
// 获取回显
|
|
const geturl = window.location.href
|
|
const getqyinfo = geturl.split('?')[1]
|
|
const getqys = new URLSearchParams('?' + getqyinfo)
|
|
const getId = getqys.get('id')
|
|
const check = getqys.get('check')
|
|
if (getId) {
|
|
this.getEcho(getId)
|
|
}
|
|
if (check) {
|
|
this.disabled = true
|
|
}
|
|
},
|
|
async setNewArr() {
|
|
this.userList.forEach((item) => {
|
|
item.changed = false
|
|
})
|
|
this.roleAllList.forEach((item) => {
|
|
item.changed = false
|
|
})
|
|
this.gradeList.forEach((item) => {
|
|
item.changed = false
|
|
})
|
|
this.menuAllList.forEach((item) => {
|
|
item.changed = false
|
|
if (item.children) {
|
|
item.children.forEach((ctem) => {
|
|
ctem.changed = false
|
|
if (ctem.children) {
|
|
ctem.children.forEach((ctems) => {
|
|
ctems.changed = false
|
|
})
|
|
}
|
|
})
|
|
}
|
|
})
|
|
this.$forceUpdate()
|
|
},
|
|
// 获取回显的值
|
|
getEcho(url) {
|
|
api.menuDetails(url).then((res) => {
|
|
console.error(res.data)
|
|
this.userList.forEach((item, index) => {
|
|
if (item.userId == res.data.userId) {
|
|
item.changed = true
|
|
}
|
|
})
|
|
this.roleAllList.forEach((item, index) => {
|
|
res.data.roleIdList.forEach((items) => {
|
|
if (item.roleId == items) {
|
|
item.changed = true
|
|
}
|
|
})
|
|
})
|
|
this.menuAllList.forEach((item, index) => {
|
|
res.data.menuIdList.forEach((items) => {
|
|
if (item.menuId == items) {
|
|
item.changed = true
|
|
}
|
|
})
|
|
if (item.children) {
|
|
item.children.forEach((items) => {
|
|
res.data.menuIdList.forEach((item_s) => {
|
|
if (items.menuId == item_s) {
|
|
items.changed = true
|
|
}
|
|
})
|
|
if (items.children) {
|
|
items.children.forEach((itemss) => {
|
|
res.data.menuIdList.forEach((item_s) => {
|
|
if (itemss.menuId == item_s) {
|
|
itemss.changed = true
|
|
}
|
|
})
|
|
})
|
|
}
|
|
if (items.children) {
|
|
items.children.forEach((itemss) => {
|
|
if (itemss.children) {
|
|
itemss.children.forEach((item_s) => {
|
|
res.data.menuIdList.forEach((item) => {
|
|
if (item_s.menuId == item) {
|
|
item_s.changed = true
|
|
}
|
|
})
|
|
})
|
|
}
|
|
})
|
|
}
|
|
})
|
|
}
|
|
})
|
|
this.$forceUpdate()
|
|
})
|
|
},
|
|
checkManage() {
|
|
// 获取所有选中的角色
|
|
const _roleIds = []
|
|
this.roleAllList.forEach(function(item) {
|
|
if (item.changed) {
|
|
_roleIds.push(item.roleId)
|
|
}
|
|
})
|
|
// 获取所有管理，和选中的角色对比，满足情况后置为选中状态
|
|
const _userList = this.userList
|
|
_userList.forEach(function(item) {
|
|
let _count = 0
|
|
const _roleLength = _roleIds.length
|
|
item.roleIdList.forEach(function(roleItem) {
|
|
_roleIds.forEach(function(selRoleItem) {
|
|
if (roleItem == selRoleItem) {
|
|
_count++
|
|
}
|
|
})
|
|
})
|
|
if (_count != 0 && _count == _roleLength) {
|
|
item.changed = true
|
|
} else {
|
|
item.changed = false
|
|
}
|
|
})
|
|
this.userList = _userList
|
|
},
|
|
checkClickC(e, index) {
|
|
if (e) {
|
|
this.roleAllList[index].changed = true
|
|
this.roleAllList[index].checkArr = []
|
|
if (this.roleAllList[index].changed) {
|
|
this.roleAllList[index].checkArr.push(this.roleAllList[index].roleId)
|
|
}
|
|
this.checkManage()
|
|
} else {
|
|
this.roleAllList[index].changed = false
|
|
this.roleAllList[index].checkArr = []
|
|
this.checkManage()
|
|
}
|
|
this.$forceUpdate()
|
|
},
|
|
deppClone(obj) {
|
|
const _obj = JSON.stringify(obj)
|
|
const _obj1 = JSON.parse(_obj)
|
|
return _obj1
|
|
},
|
|
checkClickD(e, index) {
|
|
if (e) {
|
|
this.userList[index].changed = true
|
|
this.userList[index].checkArr = []
|
|
if (this.userList[index].changed) {
|
|
this.userList[index].checkArr.push(this.userList[index].userId)
|
|
}
|
|
} else {
|
|
this.userList[index].changed = false
|
|
this.userList[index].checkArr = []
|
|
}
|
|
this.$forceUpdate()
|
|
},
|
|
checkClickG(e, index, cndex, Dndex, FDnex) {
|
|
if (e) {
|
|
this.menuAllList[index].children[cndex].changed = true
|
|
this.menuAllList[index].children[cndex].children[Dndex].changed = true
|
|
this.menuAllList[index].children[cndex].children[Dndex].checkArr = []
|
|
this.menuAllList[index].children[cndex].checkArr = []
|
|
this.menuAllList[index].checkArr = []
|
|
this.menuAllList[index].changed = true
|
|
this.menuAllList[index].children[cndex].children.forEach((item) => {
|
|
if (item.changed) {
|
|
this.menuAllList[index].children[cndex].children[Dndex].checkArr.push(item.menuId)
|
|
}
|
|
})
|
|
|
|
this.menuAllList[index].children[cndex].children[Dndex].children[FDnex].changed = true
|
|
this.menuAllList[index].children[cndex].children[Dndex].children[FDnex].checkArr = []
|
|
// this.menuAllList[index].checkArr.push(this.menuAllList[index].menuId)
|
|
} else {
|
|
// this.menuAllList[index].children[cndex].changed = false
|
|
this.menuAllList[index].children[cndex].children[Dndex].children[FDnex].checkArr = []
|
|
this.menuAllList[index].children[cndex].children[Dndex].children[FDnex].changed = false
|
|
// this.menuAllList[index].children.forEach((item) => {
|
|
// if (item.changed) {
|
|
// this.menuAllList[index].children[cndex].children[Dndex].checkArr.push(item.menuId)
|
|
// }
|
|
// })
|
|
}
|
|
console.error(this.menuAllList)
|
|
this.$forceUpdate()
|
|
},
|
|
checkClickF(e, index, cndex, Dndex) {
|
|
if (e) {
|
|
this.menuAllList[index].children[cndex].changed = true
|
|
this.menuAllList[index].children[cndex].children[Dndex].changed = true
|
|
this.menuAllList[index].children[cndex].children[Dndex].checkArr = []
|
|
this.menuAllList[index].children[cndex].checkArr = []
|
|
this.menuAllList[index].checkArr = []
|
|
this.menuAllList[index].changed = true
|
|
this.menuAllList[index].children[cndex].children.forEach((item) => {
|
|
if (item.changed) {
|
|
this.menuAllList[index].children[cndex].children[Dndex].checkArr.push(item.menuId)
|
|
}
|
|
})
|
|
// this.menuAllList[index].checkArr.push(this.menuAllList[index].menuId)
|
|
} else {
|
|
// this.menuAllList[index].children[cndex].changed = false
|
|
this.menuAllList[index].children[cndex].children[Dndex].checkArr = []
|
|
this.menuAllList[index].children[cndex].children[Dndex].changed = false
|
|
if (this.menuAllList[index].children[cndex].children[Dndex].children) {
|
|
this.menuAllList[index].children[cndex].children[Dndex].children.forEach((item) => {
|
|
item.changed = false
|
|
})
|
|
}
|
|
// this.menuAllList[index].children.forEach((item) => {
|
|
// if (item.changed) {
|
|
// this.menuAllList[index].children[cndex].children[Dndex].checkArr.push(item.menuId)
|
|
// }
|
|
// })
|
|
}
|
|
this.$forceUpdate()
|
|
},
|
|
checkClickA(e, index) {
|
|
if (e) {
|
|
this.menuAllList[index].changed = true
|
|
this.menuAllList[index].checkArr = []
|
|
this.menuAllList[index].checkArr.push(this.menuAllList[index].menuId)
|
|
} else {
|
|
this.menuAllList[index].changed = false
|
|
this.menuAllList[index].checkArr = []
|
|
this.menuAllList[index].children && this.menuAllList[index].children.forEach((item) => {
|
|
item.changed = false
|
|
item.checkArr = []
|
|
if (item.children) {
|
|
item.children.forEach((items) => {
|
|
items.changed = false
|
|
items.checkArr = []
|
|
if (items.children) {
|
|
items.children.forEach((item_s) => {
|
|
item_s.changed = false
|
|
item_s.checkArr = []
|
|
})
|
|
}
|
|
})
|
|
}
|
|
})
|
|
}
|
|
this.$forceUpdate()
|
|
},
|
|
checkClickB(e, index, cndex) {
|
|
if (e) {
|
|
this.menuAllList[index].children[cndex].changed = true
|
|
this.menuAllList[index].children[cndex].checkArr = []
|
|
this.menuAllList[index].checkArr = []
|
|
this.menuAllList[index].changed = true
|
|
this.menuAllList[index].children.forEach((item) => {
|
|
if (item.changed) {
|
|
this.menuAllList[index].children[cndex].checkArr.push(item.menuId)
|
|
}
|
|
})
|
|
} else {
|
|
this.menuAllList[index].children[cndex].changed = false
|
|
this.menuAllList[index].children[cndex].checkArr = []
|
|
this.menuAllList[index].checkArr = []
|
|
if (this.menuAllList[index].children[cndex].children) {
|
|
this.menuAllList[index].children[cndex].children.forEach((item) => {
|
|
item.changed = false
|
|
item.checkArr = []
|
|
if (item.children) {
|
|
item.children.forEach((item_s) => {
|
|
item_s.changed = false
|
|
item_s.checkArr = []
|
|
})
|
|
}
|
|
})
|
|
}
|
|
this.menuAllList[index].children.forEach((item) => {
|
|
if (item.changed) {
|
|
this.menuAllList[index].children[cndex].checkArr.push(item.menuId)
|
|
}
|
|
})
|
|
}
|
|
this.$forceUpdate()
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style scoped lang="scss">
|
|
.myBtn{
|
|
width: 120px;
|
|
height: 38px;
|
|
border-radius: 5px;
|
|
color: #fff;
|
|
background-color: #CCCCCC;
|
|
border-color: #ccc;
|
|
}
|
|
.myBtn1{
|
|
width: 120px;
|
|
height: 38px;
|
|
border-radius: 5px;
|
|
color: #fff;
|
|
background-color: #C8161D;
|
|
border-color: #C8161D;
|
|
}
|
|
.width100{
|
|
//min-width: 128px;
|
|
//border-right: 1px solid #ccc;
|
|
border-bottom: 1px solid #ccc;
|
|
border-top:1px solid #ccc
|
|
}
|
|
.class1{
|
|
border-right: 1px solid #ccc;
|
|
border-bottom: 1px solid #ccc;
|
|
border-top: 1px solid #ccc;
|
|
//overflow-x: auto;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
}
|
|
.class3{
|
|
border-right: 1px solid #ccc;
|
|
}
|
|
.flex-1{
|
|
text-align: center;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
min-width: 200px;
|
|
border-right: 1px solid #ccc;
|
|
padding: 0 20px;
|
|
}
|
|
.borders{
|
|
display: flex;
|
|
border-left:none;
|
|
}
|
|
.line_s{
|
|
border-bottom: 1px solid #ccc;
|
|
}
|
|
.width-s{
|
|
//width: 1300px;
|
|
//height: 65px;
|
|
display: flex;
|
|
//border-bottom: 1px solid #ccc;
|
|
//border-right: 1px solid #ccc;
|
|
//border: 1px solid #ccc;
|
|
border-left:none;
|
|
//flex-wrap: wrap;
|
|
//overflow-x: auto;
|
|
}
|
|
.flex1{
|
|
padding: 20px 10px;
|
|
//border-top: 1px solid #ccc;
|
|
}
|
|
.bd-s{
|
|
text-align: center;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
min-width: 140px;
|
|
border-right: 1px solid #ccc;
|
|
padding:15px 10px;
|
|
//min-width: inherit!important;
|
|
height: 100%;
|
|
}
|
|
.box-s{
|
|
//display: block;
|
|
padding: 20px 10px;
|
|
//border-top: 1px solid #ccc;
|
|
//border-right: 1px solid #ccc;
|
|
margin-right: 0;
|
|
display: flex;
|
|
//border: 1px solid #ccc;
|
|
border-left: none;
|
|
min-width: 110px;
|
|
justify-content: center;
|
|
}
|
|
.checks{
|
|
//display: block;
|
|
padding: 10px 0;
|
|
//border-bottom: 1px solid #ccc;
|
|
|
|
margin-right: 0;
|
|
height: 100%;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
//border-right: 1px solid #ccc;
|
|
border-top: 1px solid #ccc;
|
|
min-width: 200px;
|
|
//display: block;
|
|
text-align: center;
|
|
}
|
|
.flex-s{
|
|
display: flex;
|
|
//width: 1140px;
|
|
//overflow-x: auto;
|
|
}
|
|
.page {
|
|
background: #f9f9f9;
|
|
padding: 20px;
|
|
}
|
|
.topbox {
|
|
align-items: center;
|
|
padding: 0px 0 15px 0;
|
|
display: flex;
|
|
// background: skyblue;
|
|
.levelList_i {
|
|
margin-left: 20px;
|
|
position: relative;
|
|
cursor: pointer;
|
|
padding: 0 5px;
|
|
min-width: 88px;
|
|
height: 34px;
|
|
border-radius: 17px;
|
|
border: 1px solid #cccccc;
|
|
font-size: 14px;
|
|
font-family: MicrosoftYaHei;
|
|
text-align: center;
|
|
line-height: 34px;
|
|
}
|
|
}
|
|
.act {
|
|
color: #ffffff;
|
|
background: #08143f;
|
|
}
|
|
.act1 {
|
|
border-bottom: 3px solid #1890ff !important;
|
|
}
|
|
.cha {
|
|
font-size: 16px;
|
|
color: #606266;
|
|
position: absolute;
|
|
top: 10px;
|
|
}
|
|
.li {
|
|
width: 40px;
|
|
margin: 0 auto;
|
|
border-bottom: 3px solid transparent;
|
|
}
|
|
.main {
|
|
background: #fff;
|
|
border-top: 1px solid #ccc;
|
|
}
|
|
.fx_s{
|
|
overflow-x: auto;
|
|
//width: 1400px;
|
|
}
|
|
.table_a {
|
|
display: flex;
|
|
align-items: center;
|
|
border-bottom: 1px solid #ccc;
|
|
border-left: 1px solid #ccc;
|
|
//border-right: 1px solid #ccc;
|
|
// border-top: 1px solid #ccc;
|
|
}
|
|
.table_b {
|
|
display: flex;
|
|
flex-direction: column;
|
|
// border-bottom: 1px solid #ccc;
|
|
border-left: 1px solid #ccc;
|
|
width: 100%;
|
|
height: 100%;
|
|
//overflow-x: auto;
|
|
}
|
|
.table_c {
|
|
display: flex;
|
|
align-items: center;
|
|
border-bottom: 1px solid #ccc;
|
|
|
|
}
|
|
.table_c:last-child{
|
|
border-bottom: 0;
|
|
}
|
|
.table_cc {
|
|
border-right: 1px solid #ccc;
|
|
//margin: 15px 0;
|
|
display: flex;
|
|
//border-bottom: 1px solid #ccc;
|
|
}
|
|
.change_l {
|
|
//padding: 0 44px;
|
|
width: 150px;
|
|
text-align: center;
|
|
font-size: 14px;
|
|
color: #333;
|
|
font-weight: 600;
|
|
}
|
|
.change_i {
|
|
display: flex;
|
|
//align-items: center;
|
|
padding: 15px 0 15px 15px;
|
|
flex-wrap: wrap;
|
|
//border-bottom: 1px solid #ccc;
|
|
//display:table ;
|
|
//display:table-cell ;
|
|
//vertical-align:middle;
|
|
}
|
|
.footer {
|
|
height: 68px;
|
|
background: #ffffff;
|
|
box-shadow: 0px -3px 20px 0px rgba(204, 204, 204, 0.5);
|
|
// margin: 0 20px;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
.thebtn1 {
|
|
background: #3181e5;
|
|
color: #ffffff;
|
|
padding: 9px 45px;
|
|
}
|
|
.thebtn2 {
|
|
background: #cccccc;
|
|
color: #ffffff;
|
|
padding: 9px 45px;
|
|
}
|
|
}
|
|
::v-deep .el-checkbox{
|
|
margin-bottom: 10px;
|
|
}
|
|
</style>
|