| | |
| | | ]"></My-bread> |
| | | <el-divider /> |
| | | <div class="cataLogContent"> |
| | | <div class="left_Tree"> |
| | | <div class="left_Tree subpage_Div"> |
| | | <div style="min-width:200px"> |
| | | <el-tree |
| | | ref="tree" |
| | |
| | | </el-tree> |
| | | </div> |
| | | </div> |
| | | <div class="right_menu"> |
| | | <div class="right_menu subpage_Div"> |
| | | |
| | | <div style="display:flex;justify-content:space-between"> |
| | | <el-breadcrumb separator="/"> |
| | |
| | | </el-breadcrumb> |
| | | |
| | | <div> |
| | | <el-button v-if="menuStatus.update" |
| | | :disabled="itemdetail.pid == null ? true : false" |
| | | @click="setEditNode(1)" |
| | | type="info" |
| | | icon="el-icon-top" |
| | | size="small" |
| | | >向上移动</el-button> |
| | | <el-button v-if="menuStatus.update" |
| | | :disabled="itemdetail.pid == null ? true : false" |
| | | @click="setEditNode(2)" |
| | | type="info" |
| | | icon="el-icon-bottom" |
| | | size="small" |
| | | >向下移动</el-button> |
| | | <el-button v-if="menuStatus.insert" |
| | | <el-button |
| | | v-if="menuStatus.insert" |
| | | :disabled="itemdetail.pid == null ? true : false" |
| | | @click="setNewNode(1)" |
| | | type="success" |
| | | icon="el-icon-plus" |
| | | size="small" |
| | | >新增同级</el-button> |
| | | <el-button v-if="menuStatus.insert" |
| | | <el-button |
| | | v-if="menuStatus.insert" |
| | | :disabled="itemdetail.pid == null ? true : false" |
| | | @click="setNewNode(2)" |
| | | type="success" |
| | | icon="el-icon-plus" |
| | | size="small" |
| | | >新增子级</el-button> |
| | | <el-button v-if="menuStatus.delete" |
| | | <el-button |
| | | v-if="menuStatus.delete" |
| | | @click="setDelNode()" |
| | | :disabled="itemdetail.pid == null ? true : false" |
| | | type="danger" |
| | | icon="el-icon-delete" |
| | | size="small" |
| | | >删除</el-button> |
| | | <el-button |
| | | v-if="menuStatus.update" |
| | | :disabled="itemdetail.pid == null ? true : false" |
| | | @click="setEditNode(1)" |
| | | type="info" |
| | | icon="el-icon-top" |
| | | size="small" |
| | | >向上移动</el-button> |
| | | <el-button |
| | | v-if="menuStatus.update" |
| | | :disabled="itemdetail.pid == null ? true : false" |
| | | @click="setEditNode(2)" |
| | | type="info" |
| | | icon="el-icon-bottom" |
| | | size="small" |
| | | >向下移动</el-button> |
| | | </div> |
| | | </div> |
| | | <el-divider /> |
| | |
| | | break; |
| | | } |
| | | }, |
| | | getPerms() { |
| | | getPerms() { |
| | | var val = this.$store.state.currentPerms; |
| | | var permsEntity = this.$store.state.permsEntity; |
| | | |
| | | |
| | | if (permsEntity.length == 0) { |
| | | getPerms().then((res) => { |
| | | if (res.code == 200) { |
| | |
| | | }, |
| | | mounted() { |
| | | this.getMenuTree(); |
| | | this.getPerms(); |
| | | this.getPerms(); |
| | | }, |
| | | created() { |
| | | // var val = this.$store.state.currentPerms; |
| | |
| | | height: 98%; |
| | | width: 98%; |
| | | padding: 1%; |
| | | position: absolute; |
| | | |
| | | .cataLogContent { |
| | | width: 100%; |
| | | height: 92%; |
| | |
| | | .left_Tree { |
| | | width: 15%; |
| | | height: 91%; |
| | | border: 1px solid white; |
| | | |
| | | border-radius: 5px; |
| | | padding: 1%; |
| | | overflow-y: auto; |
| | | |
| | | .el-icon-circle-plus { |
| | | color: gray; |
| | | } |
| | | .el-icon-delete-solid { |
| | | color: gray; |
| | | } |
| | | } |
| | | .right_menu { |
| | | width: 80%; |
| | | height: 91%; |
| | | border: 1px solid white; |
| | | |
| | | border-radius: 5px; |
| | | padding: 1%; |
| | | overflow: auto; |
| | |
| | | .el-input { |
| | | width: 400px; |
| | | } |
| | | /deep/.el-form-item__label { |
| | | color: white; |
| | | } |
| | | } |
| | | .el-card-define { |
| | | height: 680px; |
| | | background: #303030; |
| | | border: 1px solid gray; |
| | | padding: 1px; |
| | | } |
| | | .card_tree { |
| | | display: block; |
| | | height: 650px; |
| | | overflow-y: auto; |
| | | // 更改指标树图标颜色 |
| | | /deep/ .el-tree .el-icon-caret-right:before { |
| | | color: white; /** 这里是要修改图标的颜色 **/ |
| | | } |
| | | /deep/ .el-tree { |
| | | color: white; /** 这里是要修改图标的颜色 **/ |
| | | background: transparent; |
| | | } |
| | | /deep/.el-tree-node__content { |
| | | &:hover { |
| | | background-color: rgba(255, 255, 255, 0.3) !important; |
| | | } |
| | | } |
| | | /deep/.el-tree-node.is-current > .el-tree-node__content { |
| | | background-color: rgba(255, 255, 255, 0.3) !important; |
| | | color: #409eff; |
| | | } |
| | | } |
| | | // .menuSettings_tree { |
| | | // position: relative; |
| | | // width: 344px; |
| | | // height: 100%; |
| | | // background: rgb(240, 242, 245); |
| | | // padding: 20px; |
| | | // border-radius: 10px; |
| | | // box-sizing: border-box; |
| | | // overflow: auto; |
| | | // .saveBtn { |
| | | // position: absolute; |
| | | // left: 250px; |
| | | // top: 23px; |
| | | // } |
| | | // .depTreeBox { |
| | | // height: 88%; |
| | | // width: 100%; |
| | | // overflow: auto; |
| | | // .el-tree { |
| | | // background: transparent; |
| | | // font-size: 15px; |
| | | // font-family: Microsoft YaHei; |
| | | // font-weight: 400; |
| | | // color: #000000; |
| | | // /deep/ .el-tree-node { |
| | | // padding-top: 10px; |
| | | // // padding-bottom: 10px; |
| | | // } |
| | | // /deep/ .el-tree-node:focus > .el-tree-node__content { |
| | | // background-color: #b9b9b9; |
| | | // } |
| | | // /deep/ .el-tree-node__content:hover { |
| | | // background-color: rgb(153, 153, 153); |
| | | // } |
| | | // .btnBox { |
| | | // margin: 0 10px 0 5px; |
| | | // .el-button + .el-button { |
| | | // margin-left: 5px; |
| | | // } |
| | | // } |
| | | // } |
| | | // } |
| | | // } |
| | | // .itemSettings { |
| | | // width: calc(100% - 344px); |
| | | // border-radius: 10px; |
| | | // background: rgb(240, 242, 245); |
| | | // margin-left: 10px; |
| | | // height: 100%; |
| | | // padding: 10px; |
| | | // box-sizing: border-box; |
| | | // .title_box { |
| | | // background: #fff; |
| | | // padding: 10px; |
| | | // margin-bottom: 24px; |
| | | // display: flex; |
| | | // border-radius: 10px; |
| | | // border: 1px solid rgb(202, 201, 204); |
| | | // box-sizing: border-box; |
| | | // } |
| | | // .form_box { |
| | | // border: 1px solid rgb(202, 201, 204); |
| | | // border-radius: 10px; |
| | | // background: #fff; |
| | | // padding-top: 30px; |
| | | // box-sizing: border-box; |
| | | // width: 100%; |
| | | // .el-input, |
| | | // /deep/ .el-textarea { |
| | | // width: 400px; |
| | | // } |
| | | // .btnBox { |
| | | // margin: 0 270px 20px; |
| | | // width: 200px; |
| | | // display: flex; |
| | | // justify-content: space-between; |
| | | // } |
| | | // } |
| | | // } |
| | | /deep/ .el-dialog__body { |
| | | padding: 0 30px 0 0; |
| | | } |
| | | /*里面的代码可以根据自己需求去进行更改*/ |
| | | /* 设置滚动条的样式 */ |
| | | ::-webkit-scrollbar { |
| | | width: 4px; |
| | | } |
| | | /* 滚动槽 */ |
| | | ::-webkit-scrollbar-track { |
| | | -webkit-box-shadow: inset006pxrgba(0, 0, 0, 0.3); |
| | | border-radius: 10px; |
| | | } |
| | | /* 滚动条滑块 */ |
| | | ::-webkit-scrollbar-thumb { |
| | | border-radius: 10px; |
| | | background: #8b8b8b; |
| | | -webkit-box-shadow: inset006pxrgba(0, 0, 0, 0.5); |
| | | } |
| | | ::-webkit-scrollbar-thumb:window-inactive { |
| | | background: #8b8b8b; |
| | | height: 289px; |
| | | } |
| | | /deep/ .el-input__inner { |
| | | background-color: transparent !important; |
| | | border: 1px solid; |
| | | color: white; |
| | | } |
| | | /deep/ .el-dialog { |
| | | background: #303030; |
| | | } |
| | | /deep/.el-range-editor.is-active, |
| | | .el-range-editor.is-active:hover, |
| | | .el-select .el-input.is-focus .el-input__inner { |
| | | border: 1px solid; |
| | | } |
| | | /deep/.el-dialog__title { |
| | | color: white; |
| | | } |
| | | /deep/.el-form-item__label { |
| | | color: white; |
| | | } |
| | | } |
| | | </style> |