Commit baf13aa5 authored by 高飞's avatar 高飞

1

parent 653cfc5c
......@@ -6,21 +6,21 @@ div::-webkit-scrollbar {
}
div::-webkit-scrollbar-track {
background: #125473;
background: #45454591;
border-radius: 2px;
}
div::-webkit-scrollbar-thumb {
background: #06cee0;
background: #a1dcf7;
border-radius: 10px;
}
div::-webkit-scrollbar-thumb:hover {
background: #06cee0;
background: #a1dcf7;
}
div::-webkit-scrollbar-corner {
background: #179a16;
background: #a1dcf7;
}
/* input 边框*/
......@@ -73,12 +73,44 @@ div::-webkit-scrollbar-corner {
}
.el-select-dropdown .el-tree-node__content .custom-tree-node {
max-width: 800px;
max-width: 550px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.el-select-dropdown {
border: solid 1px #588397;
border-radius: 4px;
background-color: #17354c;
background-image: url("../../assets/img/dfzy/new/6.png");
background-size: 100% 100%;
.popper__arrow::after{
border-bottom-color: #17354c !important;
}
.el-tree{
background: #ffffff00;
color: #ffffff;
}
.tree-select__option.el-select-dropdown__item{
background-color: #fff0;
}
.el-tree-node__content:hover{
background-image: linear-gradient(to right, #17344b, #2f91af, #17354c);
}
.el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content{
background-image: linear-gradient(to right, #17344b, #2f91af, #17354c);
}
.tree-select__tree.tree-select__tree--radio .el-tree-node.is-current > .el-tree-node__content{
color: orange;
}
.el-tree-node:focus > .el-tree-node__content{
background-color: #ffffff00;
}
.el-select-dropdown__item.hover, .el-select-dropdown__item:hover{
background-image: linear-gradient(to right, #17344b, #2f91af, #17354c);
}
}
.bk-animation {
position: relative;
......@@ -191,7 +223,7 @@ div::-webkit-scrollbar-corner {
right: 4.5%;
bottom: 14.6%;
border-radius: 0px 13px;
border: 2px dotted #03bdfe;
border: 1.5px dotted #03bdfe;
animation: clippathss 6s infinite linear;
}
......@@ -203,7 +235,7 @@ div::-webkit-scrollbar-corner {
right: 4.5%;
bottom: 14.6%;
border-radius: 0px 13px;
border: 2px dotted #03bdfe;
border: 1.5px dotted #03bdfe;
animation: clippathss 5s infinite linear reverse;
}
}
\ No newline at end of file
......@@ -73,7 +73,7 @@
</el-col>
<div class="line-s"></div>
<el-col :span="5" class="tm-div">
<SelectTrees :value="value_select" filterable :data="tree_data" @NodeClick="NodeClick"/>
<SelectTrees :value="value_select" filterable :data="tree_data" @NodeClick="NodeClick" class="aaaaaaaaaaaaaaaa"/>
</el-col>
<div class="line-s"></div>
<el-col :span="5" class="jzxs">
......@@ -725,9 +725,15 @@ export default {
this.type_rw_jg = e;
},
NodeClick(val){
this.value_select = val.id
this.jgName = val.id;
this.jgName_public = val.type;
if( JSON.stringify(val) == "{}"){
this.value_select = undefined
this.jgName = "1";
this.jgName_public = "2";
}else{
this.value_select = val.id
this.jgName = val.id;
this.jgName_public = val.type;
}
this.type_qf = 1;
this.input3 = "";
this.handleCurrentChange_lb(1);
......@@ -1140,7 +1146,7 @@ export default {
overflow-y: auto;
overflow-x: hidden;
.rwxx-div {
width: 20%;
width: 23%;
height: 160px;
margin: 1%;
float: left;
......@@ -1210,11 +1216,9 @@ export default {
.tilts:hover {
// transform-style: preserve-3d;
background-image: url("../../assets/img/dfzy/new/3.png");
.span-div {
.span-div-bg {
.name-div{
background-image: url("../../assets/img/dfzy/new/5.png");
}
}
}
.top-span {
background: linear-gradient(to bottom, #fffe7f, #54ff88);
-webkit-background-clip: text;
......@@ -1223,11 +1227,9 @@ export default {
}
.table-active {
background-image: url("../../assets/img/dfzy/new/3.png");
.span-div {
.span-div-bg {
.name-div{
background-image: url("../../assets/img/dfzy/new/5.png");
}
}
}
.top-span {
background: linear-gradient(to bottom, #fffe7f, #54ff88);
-webkit-background-clip: text;
......
......@@ -852,9 +852,15 @@ export default {
// this.input3 = "";
// this.handleCurrentChange_lb(1);
this.value_select = val.id
this.types = val.type;
this.jgName = val.code == undefined ? val.id : val.code;
if( JSON.stringify(val) == "{}"){
this.value_select = undefined;
this.types = 2;
this.jgName = "1";
}else{
this.value_select = val.id;
this.types = val.type;
this.jgName = val.code == undefined ? val.id : val.code;
}
this.type_zhOrcx = false;
this.input3 = "";
this.nodes_pub = val;
......@@ -1315,7 +1321,7 @@ export default {
overflow-y: auto;
overflow-x: hidden;
.rwxx-div {
width: 20%;
width: 23%;
height: 160px;
margin: 1%;
float: left;
......@@ -1385,11 +1391,10 @@ export default {
.tilts:hover {
transform-style: preserve-3d;
background-image: url("../../assets/img/dfzy/new/3.png");
.span-div {
.span-div-bg {
background-image: url("../../assets/img/dfzy/new/3.png");
.name-div{
background-image: url("../../assets/img/dfzy/new/5.png");
}
}
}
.top-span {
background: linear-gradient(to bottom, #fffe7f, #54ff88);
-webkit-background-clip: text;
......@@ -1398,11 +1403,10 @@ export default {
}
.table-active {
background-image: url("../../assets/img/dfzy/new/3.png");
.span-div {
.span-div-bg {
background-image: url("../../assets/img/dfzy/new/3.png");
.name-div{
background-image: url("../../assets/img/dfzy/new/5.png");
}
}
}
.top-span {
background: linear-gradient(to bottom, #fffe7f, #54ff88);
-webkit-background-clip: text;
......
......@@ -2228,7 +2228,7 @@ export default {
// top: -10px;
font-weight: 700;
font-size: 18px;
color: #50d7ec;
color: orange;
}
}
.mk-div {
......@@ -2414,7 +2414,7 @@ export default {
width: 100%;
height: 150px;
text-align: center;
background: #233450;
background: #23345066;
overflow-y: auto;
overflow-x: hidden;
div {
......@@ -2439,7 +2439,7 @@ export default {
ul {
padding: 0px 35px;
margin: 0px;
width: 100%;
width: calc(100% - 70px);
height: 100%;
li {
color: #26cc98;
......
......@@ -2161,7 +2161,7 @@ export default {
// top: -10px;
font-weight: 700;
font-size: 18px;
color: #50d7ec;
color: orange;
}
}
.mk-div {
......@@ -2347,7 +2347,7 @@ export default {
width: 100%;
height: 150px;
text-align: center;
background: #233450;
background: #23345066;
overflow-y: auto;
overflow-x: hidden;
div {
......@@ -2372,7 +2372,7 @@ export default {
ul {
padding: 0px 35px;
margin: 0px;
width: 100%;
width: calc(100% - 70px);
height: 100%;
li {
color: #26cc98;
......
<template>
<el-select
:title="multiple? optionData.name : ''"
:title="multiple ? optionData.name : ''"
ref="select"
:value="value"
placeholder="请选择"
......@@ -8,7 +8,7 @@
:disabled="disabled"
:filterable="filterable"
:filter-method="filterMethod"
style="width: 100%;"
style="width: 100%"
@clear="clear"
@visible-change="visibleChange"
>
......@@ -39,159 +39,159 @@
<script>
export default {
name: 'TreeSelect',
name: "TreeSelect",
props: {
// v-model绑定
value: {
type: [String, Number],
default: ''
default: "",
},
multiple: {
type: Boolean,
default: false
default: false,
},
// 树形的数据
data: {
type: Array,
default: function () {
return []
}
return [];
},
},
// 每个树节点用来作为唯一标识的属性
nodeKey: {
type: [String, Number],
default: 'id'
default: "id",
},
filterable: {
type: Boolean,
default: false
default: false,
},
disabled: {
type: Boolean,
default: false
default: false,
},
// tree的props配置
props: {
type: Object,
default: function () {
return {
label: 'label',
children: 'children'
}
}
label: "label",
children: "children",
};
},
},
},
data() {
return {
optionData: {
id: '',
name: ''
id: "",
name: "",
},
filterFlag: false
}
filterFlag: false,
};
},
watch: {
value: {
handler(val) {
if (!this.isEmpty(this.data)) {
this.init(val)
this.init(val);
}
},
immediate: true
immediate: true,
},
data: function (val) {
if (!this.isEmpty(val)) {
this.init(this.value)
this.init(this.value);
}
}
},
},
created() {},
methods: {
// 是否为空
isEmpty(val) {
for (let key in val) {
return false
return false;
}
return true
return true;
},
handleNodeClick(data) {
if (this.multiple) {
return
return;
}
this.$emit('NodeClick', data)
this.$refs.select.visible = false
this.$emit("NodeClick", data);
this.$refs.select.visible = false;
},
handleCheckChange() {
return
const nodes = this.$refs.tree.getCheckedNodes()
const value = nodes.map((item) => item).join(',')
this.$emit('NodeClick', value)
return;
const nodes = this.$refs.tree.getCheckedNodes();
const value = nodes.map((item) => item).join(",");
this.$emit("NodeClick", value);
},
init(val) {
// 多选
if (this.multiple) {
const arr = val.toString().split(',')
const arr = val.toString().split(",");
this.$nextTick(() => {
this.$refs.tree.setCheckedKeys(arr)
const nodes = this.$refs.tree.getCheckedNodes()
this.optionData.id = val
this.$refs.tree.setCheckedKeys(arr);
const nodes = this.$refs.tree.getCheckedNodes();
this.optionData.id = val;
this.optionData.name = nodes
.map((item) => item[this.props.label])
.join(',')
})
.join(",");
});
}
// 单选
else {
val = val === '' ? null : val
this.$nextTick(() => {
this.$refs.tree.setCurrentKey(val)
if (val === null) {
return
}
const node = this.$refs.tree.getNode(val)
this.optionData.id = val
this.optionData.name = node.label
})
val = val === "" ? null : val;
this.$nextTick(() => {
this.$refs.tree.setCurrentKey(val);
if (val === null) {
return;
}
const node = this.$refs.tree.getNode(val);
this.optionData.id = val;
this.optionData.name = node.label;
});
}
},
visibleChange(e) {
if (e) {
const tree = this.$refs.tree
this.filterFlag && tree.filter('')
this.filterFlag = false
let selectDom = null
if(this.multiple) {
selectDom = tree.$el.querySelector('.el-tree-node.is-checked')
const tree = this.$refs.tree;
this.filterFlag && tree.filter("");
this.filterFlag = false;
let selectDom = null;
if (this.multiple) {
selectDom = tree.$el.querySelector(".el-tree-node.is-checked");
} else {
selectDom = tree.$el.querySelector('.is-current')
selectDom = tree.$el.querySelector(".is-current");
}
setTimeout(() => {
this.$refs.select.scrollToOption({ $el: selectDom })
}, 0)
this.$refs.select.scrollToOption({ $el: selectDom });
}, 0);
}
},
clear() {
this.$emit('NodeClick', {})
this.$emit("NodeClick", {});
},
filterMethod(val) {
this.filterFlag = true
this.$refs.tree.filter(val)
this.filterFlag = true;
this.$refs.tree.filter(val);
},
filterNode(value, data) {
if (!value) return true
const label = this.props.label || 'name'
return data[label].indexOf(value) !== -1
}
}
}
if (!value) return true;
const label = this.props.label || "name";
return data[label].indexOf(value) !== -1;
},
},
};
</script>
<style lang="scss">
.el-input--suffix .el-input__inner{
.el-input--suffix .el-input__inner {
background: #ff000000;
height: 40px;
border: 1px solid #3a5f94c9;
color: white;
height: 40px;
border: 1px solid #3a5f94c9;
color: white;
}
.tree-select__option {
&.el-select-dropdown__item {
......
......@@ -71,9 +71,18 @@ export default {
},
methods: {
choiceModule(id) {
let arr = this.query_selector('.leader-line');
if(arr.length>0){
arr.forEach(element => {
element.remove();
});
}
this.isSelected = id;
this.$store.commit("activeIndex", id-1);
this.$router.push("/");
},
query_selector(selector) {
return Array.from(document.querySelectorAll(selector));
}
},
activated() {
......@@ -127,7 +136,7 @@ export default {
end:document.getElementById('right33'),
});
})
}
},
}
</script>
......
......@@ -175,6 +175,10 @@ export default {
.login-left-content {
width: calc(50% - 350px);
-webkit-animation: warn 3s ease-out infinite;
-moz-animation: warn 3s ease-out infinite;
animation: warn 3s ease-out infinite;
animation-direction:alternate;
}
.login-center-content {
......@@ -257,6 +261,15 @@ export default {
.login-right-content {
width: calc(50% - 350px);
-webkit-animation: warn 3s ease-out infinite;
-moz-animation: warn 3s ease-out infinite;
animation: warn 3s ease-out infinite;
animation-direction:alternate;
}
@keyframes warn {
from { opacity:1; transform:scale(0.98); }
to { opacity:1; transform:scale(1); }
}
}
</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment