|
|
@@ -1,203 +1,155 @@
|
|
|
<template>
|
|
|
- <div class="action pagePadding">
|
|
|
+ <div class="action">
|
|
|
<div
|
|
|
- class="action_show"
|
|
|
+ class="action_show_box"
|
|
|
v-if="powers && powers.length > 0 && powers.some((item) => item == '001')"
|
|
|
>
|
|
|
- <div class="action_show_box">
|
|
|
- <ul class="role-list">
|
|
|
- <p class="role-list__title">角色列表</p>
|
|
|
- <p
|
|
|
- v-if="roleList.length == 0"
|
|
|
- style="line-height: 60px; text-align: center; color: #909399"
|
|
|
- >
|
|
|
- 暂无数据
|
|
|
- </p>
|
|
|
- <li
|
|
|
- v-for="(item, index) in roleList"
|
|
|
- :key="'role' + index"
|
|
|
- class="role-list__item"
|
|
|
- :class="{ active: item.id == roleActive.id }"
|
|
|
- @click="!isBtnDisabled && switchRoleHandle(item)"
|
|
|
- >
|
|
|
- {{ item.role_name }}
|
|
|
- <i
|
|
|
- v-if="isBtnDisabled && item.id == roleActive.id"
|
|
|
- class="el-icon-loading"
|
|
|
- />
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- <div class="rule-view">
|
|
|
- <div class="rule-list">
|
|
|
- <el-row
|
|
|
- v-for="(item, index) in actionList"
|
|
|
- :key="'menu' + item.id + index"
|
|
|
- >
|
|
|
- <el-col
|
|
|
- v-if="item.child && item.child.length > 0"
|
|
|
- class="ffff"
|
|
|
- :span="24"
|
|
|
- >
|
|
|
- <div class="ftitle">
|
|
|
- <span>{{ item.menu_name }}</span>
|
|
|
- </div>
|
|
|
- <div class="fbody">
|
|
|
- <div
|
|
|
- class="fbody-item"
|
|
|
- v-for="(subItem, subIndex) in item.child"
|
|
|
- :key="'yemian' + subItem.id + subIndex"
|
|
|
+ <ul class="role-list fl">
|
|
|
+ <p class="role-list__title">角色列表</p>
|
|
|
+ <p
|
|
|
+ v-if="roleList.length == 0"
|
|
|
+ style="line-height: 60px; text-align: center; color: #909399"
|
|
|
+ >
|
|
|
+ 暂无数据
|
|
|
+ </p>
|
|
|
+ <li
|
|
|
+ v-for="(item, index) in roleList"
|
|
|
+ :key="'role' + index"
|
|
|
+ class="role-list__item"
|
|
|
+ :class="{ active: item.id == roleActive.id }"
|
|
|
+ @click="!isBtnDisabled && switchRoleHandle(item)"
|
|
|
+ >
|
|
|
+ {{ item.role_name }}
|
|
|
+ <i v-if="isBtnDisabled && item.id == roleActive.id" class="el-icon-loading" />
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ <div class="rule-view fr">
|
|
|
+ <div class="rule-list">
|
|
|
+ <el-row v-for="(item, index) in actionList" :key="'menu' + item.id + index">
|
|
|
+ <el-col v-if="item.child && item.child.length > 0" class="ffff" :span="24">
|
|
|
+ <div class="ftitle">
|
|
|
+ <span>{{ item.menu_name }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="fbody">
|
|
|
+ <div
|
|
|
+ class="fbody-item"
|
|
|
+ v-for="(subItem, subIndex) in item.child"
|
|
|
+ :key="'yemian' + subItem.id + subIndex"
|
|
|
+ >
|
|
|
+ <template
|
|
|
+ v-if="
|
|
|
+ !(
|
|
|
+ subItem.action &&
|
|
|
+ subItem.action.length === 0 &&
|
|
|
+ subItem.action_data &&
|
|
|
+ subItem.action_data.length === 0
|
|
|
+ )
|
|
|
+ "
|
|
|
>
|
|
|
- <template
|
|
|
- v-if="
|
|
|
- !(
|
|
|
- subItem.action &&
|
|
|
- subItem.action.length === 0 &&
|
|
|
- subItem.action_data &&
|
|
|
- subItem.action_data.length === 0
|
|
|
- )
|
|
|
- "
|
|
|
+ <div class="stitle">
|
|
|
+ <span class="_h2">{{ subItem.menu_name }}</span>
|
|
|
+ <el-radio-group
|
|
|
+ style="margin: 0 0 0 20px"
|
|
|
+ size="mini"
|
|
|
+ v-if="subItem && subItem.private && subItem.private.length === 2"
|
|
|
+ v-model="subItem.is_private_change"
|
|
|
+ >
|
|
|
+ <el-radio-button
|
|
|
+ v-for="(radioN, ri) in subItem.private"
|
|
|
+ :key="radioN.label + ri"
|
|
|
+ :label="radioN.id"
|
|
|
+ >{{ radioN.label }}</el-radio-button
|
|
|
+ >
|
|
|
+ </el-radio-group>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="scheck"
|
|
|
+ v-if="subItem.action && subItem.action.length > 0"
|
|
|
>
|
|
|
- <div class="stitle">
|
|
|
- <span class="_h2">{{ subItem.menu_name }}</span>
|
|
|
- <el-radio-group
|
|
|
- style="margin: 0 0 0 20px"
|
|
|
- size="mini"
|
|
|
- v-if="
|
|
|
- subItem &&
|
|
|
- subItem.private &&
|
|
|
- subItem.private.length === 2
|
|
|
+ <div class="checkAll">
|
|
|
+ <el-checkbox
|
|
|
+ v-model="subItem.checkAll"
|
|
|
+ :disabled="!powers.some((item) => item == '008')"
|
|
|
+ :indeterminate="indeterminateCheck(subItem)"
|
|
|
+ @change="handleCheckAllChange($event, index, item, subIndex)"
|
|
|
+ >功能全选</el-checkbox
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <div class="checkItem">
|
|
|
+ <el-checkbox-group
|
|
|
+ v-model="subItem.checkList"
|
|
|
+ :disabled="!powers.some((item) => item == '008')"
|
|
|
+ @change="
|
|
|
+ handleCheckedGroupChange($event, index, item, subIndex)
|
|
|
"
|
|
|
- v-model="subItem.is_private_change"
|
|
|
>
|
|
|
- <el-radio-button
|
|
|
- v-for="(radioN, ri) in subItem.private"
|
|
|
- :key="radioN.label + ri"
|
|
|
- :label="radioN.id"
|
|
|
- >{{ radioN.label }}</el-radio-button
|
|
|
- >
|
|
|
- </el-radio-group>
|
|
|
+ <template v-for="children in subItem.action">
|
|
|
+ <el-checkbox
|
|
|
+ :disabled="!powers.some((item) => item == '008')"
|
|
|
+ :key="'checkItem' + children.id"
|
|
|
+ :label="children.id"
|
|
|
+ @change="
|
|
|
+ handleCheckedChange(
|
|
|
+ $event,
|
|
|
+ children.id,
|
|
|
+ index,
|
|
|
+ subIndex,
|
|
|
+ item
|
|
|
+ )
|
|
|
+ "
|
|
|
+ >{{ children.action_name }}</el-checkbox
|
|
|
+ >
|
|
|
+ </template>
|
|
|
+ </el-checkbox-group>
|
|
|
</div>
|
|
|
- <div
|
|
|
- class="scheck"
|
|
|
- v-if="subItem.action && subItem.action.length > 0"
|
|
|
- >
|
|
|
- <div class="checkAll">
|
|
|
- <el-checkbox
|
|
|
- v-model="subItem.checkAll"
|
|
|
- :disabled="!powers.some((item) => item == '008')"
|
|
|
- :indeterminate="indeterminateCheck(subItem)"
|
|
|
- @change="
|
|
|
- handleCheckAllChange(
|
|
|
- $event,
|
|
|
- index,
|
|
|
- item,
|
|
|
- subIndex
|
|
|
- )
|
|
|
- "
|
|
|
- >功能全选</el-checkbox
|
|
|
- >
|
|
|
- </div>
|
|
|
- <div class="checkItem">
|
|
|
- <el-checkbox-group
|
|
|
- v-model="subItem.checkList"
|
|
|
- :disabled="!powers.some((item) => item == '008')"
|
|
|
- @change="
|
|
|
- handleCheckedGroupChange(
|
|
|
- $event,
|
|
|
- index,
|
|
|
- item,
|
|
|
- subIndex
|
|
|
- )
|
|
|
- "
|
|
|
- >
|
|
|
- <template v-for="children in subItem.action">
|
|
|
- <el-checkbox
|
|
|
- :disabled="
|
|
|
- !powers.some((item) => item == '008')
|
|
|
- "
|
|
|
- :key="'checkItem' + children.id"
|
|
|
- :label="children.id"
|
|
|
- @change="
|
|
|
- handleCheckedChange(
|
|
|
- $event,
|
|
|
- children.id,
|
|
|
- index,
|
|
|
- subIndex,
|
|
|
- item
|
|
|
- )
|
|
|
- "
|
|
|
- >{{ children.action_name }}</el-checkbox
|
|
|
- >
|
|
|
- </template>
|
|
|
- </el-checkbox-group>
|
|
|
- </div>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="sfield"
|
|
|
+ v-if="subItem.action_data && subItem.action_data.length > 0"
|
|
|
+ >
|
|
|
+ <div class="checkAll">
|
|
|
+ <el-checkbox
|
|
|
+ v-model="subItem.fieldAll"
|
|
|
+ :disabled="!powers.some((item) => item == '008')"
|
|
|
+ :indeterminate="indeterminateField(subItem)"
|
|
|
+ @change="handleFieldAllChange($event, index, item, subIndex)"
|
|
|
+ >字段全选</el-checkbox
|
|
|
+ >
|
|
|
</div>
|
|
|
- <div
|
|
|
- class="sfield"
|
|
|
- v-if="
|
|
|
- subItem.action_data && subItem.action_data.length > 0
|
|
|
- "
|
|
|
- >
|
|
|
- <div class="checkAll">
|
|
|
- <el-checkbox
|
|
|
- v-model="subItem.fieldAll"
|
|
|
- :disabled="!powers.some((item) => item == '008')"
|
|
|
- :indeterminate="indeterminateField(subItem)"
|
|
|
- @change="
|
|
|
- handleFieldAllChange(
|
|
|
- $event,
|
|
|
- index,
|
|
|
- item,
|
|
|
- subIndex
|
|
|
- )
|
|
|
- "
|
|
|
- >字段全选</el-checkbox
|
|
|
- >
|
|
|
- </div>
|
|
|
- <div class="checkItem">
|
|
|
- <el-checkbox-group
|
|
|
- v-model="subItem.fieldList"
|
|
|
- :disabled="!powers.some((item) => item == '008')"
|
|
|
- @change="
|
|
|
- handleFieldGroupChange(
|
|
|
- $event,
|
|
|
- index,
|
|
|
- item,
|
|
|
- subIndex
|
|
|
- )
|
|
|
- "
|
|
|
- >
|
|
|
- <template v-for="children in subItem.action_data">
|
|
|
- <el-checkbox
|
|
|
- :key="'FieldItem' + children.id"
|
|
|
- :label="children.id"
|
|
|
- :disabled="
|
|
|
- !powers.some((item) => item == '008')
|
|
|
- "
|
|
|
- @change="
|
|
|
- handleFieldChange(
|
|
|
- $event,
|
|
|
- children.id,
|
|
|
- index,
|
|
|
- subIndex,
|
|
|
- item
|
|
|
- )
|
|
|
- "
|
|
|
- >{{ children.field_name }}</el-checkbox
|
|
|
- >
|
|
|
- </template>
|
|
|
- </el-checkbox-group>
|
|
|
- </div>
|
|
|
+ <div class="checkItem">
|
|
|
+ <el-checkbox-group
|
|
|
+ v-model="subItem.fieldList"
|
|
|
+ :disabled="!powers.some((item) => item == '008')"
|
|
|
+ @change="handleFieldGroupChange($event, index, item, subIndex)"
|
|
|
+ >
|
|
|
+ <template v-for="children in subItem.action_data">
|
|
|
+ <el-checkbox
|
|
|
+ :key="'FieldItem' + children.id"
|
|
|
+ :label="children.id"
|
|
|
+ :disabled="!powers.some((item) => item == '008')"
|
|
|
+ @change="
|
|
|
+ handleFieldChange(
|
|
|
+ $event,
|
|
|
+ children.id,
|
|
|
+ index,
|
|
|
+ subIndex,
|
|
|
+ item
|
|
|
+ )
|
|
|
+ "
|
|
|
+ >{{ children.field_name }}</el-checkbox
|
|
|
+ >
|
|
|
+ </template>
|
|
|
+ </el-checkbox-group>
|
|
|
</div>
|
|
|
- </template>
|
|
|
- </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
</div>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </div>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="rule-bottom">
|
|
|
+ <div class="rule-bottom fr">
|
|
|
<el-button
|
|
|
size="small"
|
|
|
type="primary"
|
|
|
@@ -241,9 +193,7 @@ export default {
|
|
|
computed: {
|
|
|
powers() {
|
|
|
let tran =
|
|
|
- this.$store.getters.btnList.find(
|
|
|
- (item) => item.menu_route == "action"
|
|
|
- ) || {};
|
|
|
+ this.$store.getters.btnList.find((item) => item.menu_route == "action") || {};
|
|
|
if (tran && tran.action && tran.action.length > 0) {
|
|
|
return tran.action;
|
|
|
} else {
|
|
|
@@ -260,8 +210,7 @@ export default {
|
|
|
// 未选中子节点的数量
|
|
|
const noSlectItemLength = item.action.filter(
|
|
|
(filitem) =>
|
|
|
- item.checkList.findIndex((finditem) => finditem === filitem.id) ==
|
|
|
- -1
|
|
|
+ item.checkList.findIndex((finditem) => finditem === filitem.id) == -1
|
|
|
).length;
|
|
|
// // 当前节点的index
|
|
|
// 存在选中子节点且存在未选中子节点为中间态
|
|
|
@@ -278,8 +227,7 @@ export default {
|
|
|
// 未选中子节点的数量
|
|
|
const noSlectItemLength = item.action_data.filter(
|
|
|
(filitem) =>
|
|
|
- item.fieldList.findIndex((finditem) => finditem === filitem.id) ==
|
|
|
- -1
|
|
|
+ item.fieldList.findIndex((finditem) => finditem === filitem.id) == -1
|
|
|
).length;
|
|
|
// // 当前节点的index
|
|
|
// 存在选中子节点且存在未选中子节点为中间态
|
|
|
@@ -297,9 +245,9 @@ export default {
|
|
|
this.actionList[index].child[subIndex].checkAll = checkAll;
|
|
|
this.$set(this.actionList, index, item);
|
|
|
this.actionList[index].child[subIndex].action.forEach((element) => {
|
|
|
- const findindex = this.actionList[index].child[
|
|
|
- subIndex
|
|
|
- ].checkList.findIndex((findItem) => findItem === element.id);
|
|
|
+ const findindex = this.actionList[index].child[subIndex].checkList.findIndex(
|
|
|
+ (findItem) => findItem === element.id
|
|
|
+ );
|
|
|
if (checkAll && findindex == -1) {
|
|
|
this.actionList[index].child[subIndex].checkList.push(element.id);
|
|
|
} else if (!checkAll && findindex > -1) {
|
|
|
@@ -312,9 +260,9 @@ export default {
|
|
|
this.actionList[index].child[subIndex].fieldAll = fieldAll;
|
|
|
this.$set(this.actionList, index, item);
|
|
|
this.actionList[index].child[subIndex].action_data.forEach((element) => {
|
|
|
- const findindex = this.actionList[index].child[
|
|
|
- subIndex
|
|
|
- ].fieldList.findIndex((findItem) => findItem === element.id);
|
|
|
+ const findindex = this.actionList[index].child[subIndex].fieldList.findIndex(
|
|
|
+ (findItem) => findItem === element.id
|
|
|
+ );
|
|
|
if (fieldAll && findindex == -1) {
|
|
|
this.actionList[index].child[subIndex].fieldList.push(element.id);
|
|
|
} else if (!fieldAll && findindex > -1) {
|
|
|
@@ -325,9 +273,9 @@ export default {
|
|
|
// 复选框组内的选中/不选中
|
|
|
handleCheckedGroupChange(event, index, item, subIndex) {
|
|
|
// console.log(event, index, subIndex);
|
|
|
- this.actionList[index].child[subIndex].checkAll = this.actionList[
|
|
|
- index
|
|
|
- ].child[subIndex].action.every(
|
|
|
+ this.actionList[index].child[subIndex].checkAll = this.actionList[index].child[
|
|
|
+ subIndex
|
|
|
+ ].action.every(
|
|
|
(evitem) =>
|
|
|
this.actionList[index].child[subIndex].checkList.findIndex(
|
|
|
(finditem) => finditem === evitem.id
|
|
|
@@ -337,9 +285,9 @@ export default {
|
|
|
},
|
|
|
// 复选框组内的选中/不选中
|
|
|
handleFieldGroupChange(event, index, item, subIndex) {
|
|
|
- this.actionList[index].child[subIndex].fieldAll = this.actionList[
|
|
|
- index
|
|
|
- ].child[subIndex].action_data.every(
|
|
|
+ this.actionList[index].child[subIndex].fieldAll = this.actionList[index].child[
|
|
|
+ subIndex
|
|
|
+ ].action_data.every(
|
|
|
(evitem) =>
|
|
|
this.actionList[index].child[subIndex].fieldList.findIndex(
|
|
|
(finditem) => finditem === evitem.id
|
|
|
@@ -577,151 +525,135 @@ export default {
|
|
|
};
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
+@import "~@/styles/mixin.scss";
|
|
|
.action {
|
|
|
- // height: calc(100vh - 80px);
|
|
|
- height: 100%;
|
|
|
position: relative;
|
|
|
width: 100%;
|
|
|
- text-align: center;
|
|
|
- .action_show {
|
|
|
- position: relative;
|
|
|
+ height: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+
|
|
|
+ .action_show_box {
|
|
|
+ // position: relative;
|
|
|
+ // height: calc(100% - 50px);
|
|
|
+ // min-height: calc(100% - 50px);
|
|
|
+
|
|
|
+ display: relative;
|
|
|
width: 100%;
|
|
|
- height: 100%;
|
|
|
- // height: calc(100vh - 122px);
|
|
|
- .rule-bottom {
|
|
|
- padding: 18px 16px 0 18%;
|
|
|
- background: #fff;
|
|
|
- width: 100%;
|
|
|
- text-align: left;
|
|
|
- &::before {
|
|
|
+ height: calc(100vh - 50px);
|
|
|
+ overflow: hidden;
|
|
|
+ text-align: left;
|
|
|
+ //左侧
|
|
|
+ .role-list {
|
|
|
+ height: 100%;
|
|
|
+ overflow-y: auto;
|
|
|
+ width: 200px;
|
|
|
+ padding: 8px 16px;
|
|
|
+ min-height: 100%;
|
|
|
+ flex-shrink: 0;
|
|
|
+ border-right: 2px solid #dfe6ec;
|
|
|
+ @include scrollBar();
|
|
|
+ &::after {
|
|
|
content: "";
|
|
|
position: absolute;
|
|
|
top: 0;
|
|
|
right: 0;
|
|
|
- height: 2px;
|
|
|
- width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ width: 2px;
|
|
|
background-color: #e4e7ed;
|
|
|
z-index: 1;
|
|
|
}
|
|
|
- }
|
|
|
- .action_show_box {
|
|
|
- position: relative;
|
|
|
- height: calc(100% - 50px);
|
|
|
- min-height: calc(100% - 50px);
|
|
|
-
|
|
|
- display: flex;
|
|
|
- text-align: left;
|
|
|
-
|
|
|
- .role-list {
|
|
|
+ .role-list__title {
|
|
|
+ color: #b4b6c0;
|
|
|
+ line-height: 32px;
|
|
|
+ }
|
|
|
+ .role-list__item {
|
|
|
position: relative;
|
|
|
- height: 100%;
|
|
|
- overflow-y: auto;
|
|
|
- width: 15%;
|
|
|
- padding: 8px 16px;
|
|
|
- min-height: 100%;
|
|
|
- flex-shrink: 0;
|
|
|
- &::after {
|
|
|
- content: "";
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ overflow: hidden;
|
|
|
+ height: 32px;
|
|
|
+ line-height: 32px;
|
|
|
+ padding-left: 8px;
|
|
|
+ color: rgb(48, 49, 51);
|
|
|
+ cursor: pointer;
|
|
|
+ i {
|
|
|
position: absolute;
|
|
|
- top: 0;
|
|
|
right: 0;
|
|
|
- height: 100%;
|
|
|
- width: 2px;
|
|
|
- background-color: #e4e7ed;
|
|
|
- z-index: 1;
|
|
|
- }
|
|
|
- .role-list__title {
|
|
|
- color: #b4b6c0;
|
|
|
line-height: 32px;
|
|
|
}
|
|
|
- .role-list__item {
|
|
|
- position: relative;
|
|
|
- white-space: nowrap;
|
|
|
- text-overflow: ellipsis;
|
|
|
- overflow: hidden;
|
|
|
- height: 32px;
|
|
|
- line-height: 32px;
|
|
|
- padding-left: 8px;
|
|
|
- color: rgb(48, 49, 51);
|
|
|
- cursor: pointer;
|
|
|
- i {
|
|
|
- position: absolute;
|
|
|
- right: 0;
|
|
|
- line-height: 32px;
|
|
|
- }
|
|
|
- }
|
|
|
- .role-list__item.active {
|
|
|
- color: #63cbe7;
|
|
|
- background: #f7f7f7;
|
|
|
- }
|
|
|
}
|
|
|
- .rule-view {
|
|
|
- position: relative;
|
|
|
- height: 100%;
|
|
|
- width: 85%;
|
|
|
- overflow-y: scroll;
|
|
|
- // padding: 0 0 0 16px;
|
|
|
- .ffff {
|
|
|
- width: 100%;
|
|
|
+ .role-list__item.active {
|
|
|
+ color: #63cbe7;
|
|
|
+ background: #f7f7f7;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ //右侧
|
|
|
+ .rule-view {
|
|
|
+ height: calc(100% - 50px);
|
|
|
+ width: calc(100% - 200px);
|
|
|
+ overflow-y: auto;
|
|
|
+ @include scrollBar();
|
|
|
+ // padding: 0 0 0 16px;
|
|
|
+ .ffff {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: stretch;
|
|
|
+ .ftitle {
|
|
|
+ width: 110px;
|
|
|
+ text-align: center;
|
|
|
+ border-right: 1px solid #dfe6ec;
|
|
|
+ border-bottom: 1px solid #dfe6ec;
|
|
|
+ padding: 12px 14px;
|
|
|
display: flex;
|
|
|
- align-items: stretch;
|
|
|
- .ftitle {
|
|
|
- width: 110px;
|
|
|
+ align-items: center;
|
|
|
+ span {
|
|
|
+ display: inline-block;
|
|
|
+ width: 100%;
|
|
|
+ font-size: 17px;
|
|
|
text-align: center;
|
|
|
+ color: #97a8be;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .fbody {
|
|
|
+ width: calc(100% - 110px);
|
|
|
+ .fbody-item {
|
|
|
border-right: 1px solid #dfe6ec;
|
|
|
border-bottom: 1px solid #dfe6ec;
|
|
|
- padding: 12px 14px;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- span {
|
|
|
- display: inline-block;
|
|
|
- width: 100%;
|
|
|
- font-size: 17px;
|
|
|
- text-align: center;
|
|
|
+
|
|
|
+ .stitle {
|
|
|
+ padding: 18px 18px 12px 18px;
|
|
|
+ border-bottom: 1px dashed #dfe6ec;
|
|
|
+ font-size: 14px;
|
|
|
color: #97a8be;
|
|
|
+ ._h2 {
|
|
|
+ display: inline-block;
|
|
|
+ // width: 100px;
|
|
|
+ }
|
|
|
}
|
|
|
- }
|
|
|
- .fbody {
|
|
|
- width: calc(100% - 110px);
|
|
|
- .fbody-item {
|
|
|
- border-right: 1px solid #dfe6ec;
|
|
|
- border-bottom: 1px solid #dfe6ec;
|
|
|
-
|
|
|
- .stitle {
|
|
|
- padding: 18px 18px 12px 18px;
|
|
|
- border-bottom: 1px dashed #dfe6ec;
|
|
|
- font-size: 14px;
|
|
|
- color: #97a8be;
|
|
|
- ._h2 {
|
|
|
- display: inline-block;
|
|
|
- // width: 100px;
|
|
|
- }
|
|
|
+ .scheck {
|
|
|
+ padding: 15px 0 10px 0;
|
|
|
+ display: flex;
|
|
|
+ width: 100%;
|
|
|
+ .checkAll {
|
|
|
+ width: 140px;
|
|
|
+ text-align: right;
|
|
|
+ padding: 0 35px 0 0;
|
|
|
}
|
|
|
- .scheck {
|
|
|
- padding: 15px 0 10px 0;
|
|
|
- display: flex;
|
|
|
- width: 100%;
|
|
|
- .checkAll {
|
|
|
- width: 140px;
|
|
|
- text-align: right;
|
|
|
- padding: 0 35px 0 0;
|
|
|
- }
|
|
|
- .checkItem {
|
|
|
- width: calc(100% - 140px);
|
|
|
- }
|
|
|
+ .checkItem {
|
|
|
+ width: calc(100% - 140px);
|
|
|
}
|
|
|
- .sfield {
|
|
|
- padding: 0 0 10px 0;
|
|
|
- display: flex;
|
|
|
- width: 100%;
|
|
|
- .checkAll {
|
|
|
- width: 140px;
|
|
|
- text-align: right;
|
|
|
- padding: 0 35px 0 0;
|
|
|
- }
|
|
|
- .checkItem {
|
|
|
- width: calc(100% - 140px);
|
|
|
- }
|
|
|
+ }
|
|
|
+ .sfield {
|
|
|
+ padding: 0 0 10px 0;
|
|
|
+ display: flex;
|
|
|
+ width: 100%;
|
|
|
+ .checkAll {
|
|
|
+ width: 140px;
|
|
|
+ text-align: right;
|
|
|
+ padding: 0 35px 0 0;
|
|
|
+ }
|
|
|
+ .checkItem {
|
|
|
+ width: calc(100% - 140px);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
@@ -767,6 +699,25 @@ export default {
|
|
|
// }
|
|
|
}
|
|
|
}
|
|
|
+ .rule-bottom {
|
|
|
+ padding: 10px 18px 8px 0;
|
|
|
+ background: #fff;
|
|
|
+ width: calc(100% - 200px);
|
|
|
+ position: absolute;
|
|
|
+ text-align: right;
|
|
|
+ bottom: 0;
|
|
|
+ right: 0;
|
|
|
+ &::before {
|
|
|
+ content: "";
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ right: 0;
|
|
|
+ height: 2px;
|
|
|
+ width: 100%;
|
|
|
+ background-color: #e4e7ed;
|
|
|
+ z-index: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
</style>
|
