Reviewed-on: http://git.picaiba.com/mt-fe-group/yudao-init/pulls/92pull/99/head
@@ -34,17 +34,13 @@ export default { | |||||
changeColor(val) { | changeColor(val) { | ||||
if (val == true) { | if (val == true) { | ||||
let item = document.getElementsByClassName('el-breadcrumb__separator') | let item = document.getElementsByClassName('el-breadcrumb__separator') | ||||
// for (let i in item) { | |||||
// console.log('item[i]',item, item[i]) | |||||
// if (item[i].style) { | |||||
item[0].style.color = 'rgba(255, 255, 255, 0.45)' | |||||
item[1].style.color = 'rgba(255, 255, 255, 0.45)' | |||||
// } | |||||
// } | |||||
// let item =document.getElementsByClassName('') | |||||
item[0].classList.add("changeColor") | |||||
item[1].classList.add("changeColor") | |||||
} else { | } else { | ||||
let item = document.getElementsByClassName('el-breadcrumb__separator') | let item = document.getElementsByClassName('el-breadcrumb__separator') | ||||
item[0].style.color = '' | |||||
item[1].style.color = '' | |||||
item[0].classList.remove("changeColor") | |||||
item[1].classList.remove("changeColor") | |||||
} | } | ||||
}, | }, | ||||
$route(route) { | $route(route) { | ||||
@@ -102,9 +98,16 @@ export default { | |||||
cursor: text; | cursor: text; | ||||
} | } | ||||
} | } | ||||
.app-breadcrumb .el-breadcrumb__inner a, | .app-breadcrumb .el-breadcrumb__inner a, | ||||
.el-breadcrumb__inner.is-link { | .el-breadcrumb__inner.is-link { | ||||
color:rgba(0, 0, 0, 0.65) | color:rgba(0, 0, 0, 0.65) | ||||
} | } | ||||
</style> | </style> | ||||
<style lang="scss"> | |||||
.changeColor { | |||||
--theme-color: rgba(255, 255, 255, 0.45); | |||||
} | |||||
.el-breadcrumb__separator { | |||||
color:var(--theme-color); | |||||
} | |||||
</style> |
@@ -1,14 +1,16 @@ | |||||
<!-- | |||||
* @Author: zhp | |||||
* @Date: 2024-06-03 15:38:31 | |||||
* @LastEditTime: 2024-07-11 13:56:19 | |||||
* @LastEditors: zhp | |||||
* @Description: | |||||
--> | |||||
<template> | <template> | ||||
<div style="padding: 0 15px;" @click="toggleClick"> | <div style="padding: 0 15px;" @click="toggleClick"> | ||||
<svg | |||||
:class="{'is-active':isActive}" | |||||
class="hamburger" | |||||
viewBox="0 0 1024 1024" | |||||
xmlns="http://www.w3.org/2000/svg" | |||||
width="64" | |||||
height="64" | |||||
> | |||||
<path d="M408 442h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm-8 204c0 4.4 3.6 8 8 8h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56zm504-486H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zm0 632H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zM142.4 642.1L298.7 519a8.84 8.84 0 0 0 0-13.9L142.4 381.9c-5.8-4.6-14.4-.5-14.4 6.9v246.3a8.9 8.9 0 0 0 14.4 7z" /> | |||||
<svg :class="{'is-active':isActive}" class="hamburger" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" | |||||
width="64" height="64" :fill="changeColor === true ? 'rgba(255, 255, 255, 1)' : '' "> | |||||
<path | |||||
d="M408 442h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm-8 204c0 4.4 3.6 8 8 8h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56zm504-486H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zm0 632H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zM142.4 642.1L298.7 519a8.84 8.84 0 0 0 0-13.9L142.4 381.9c-5.8-4.6-14.4-.5-14.4 6.9v246.3a8.9 8.9 0 0 0 14.4 7z" /> | |||||
</svg> | </svg> | ||||
</div> | </div> | ||||
</template> | </template> | ||||
@@ -22,6 +24,15 @@ export default { | |||||
default: false | default: false | ||||
} | } | ||||
}, | }, | ||||
computed: { | |||||
changeColor() { | |||||
if (this.$route.path == '/copilot/efficiency-container' || this.$route.path == '/copilot/main' || this.$route.path == '/factoryData/hdIndex' || this.$route.path === '/factoryData/factory-data') { | |||||
return true | |||||
} else { | |||||
return false | |||||
} | |||||
}, | |||||
}, | |||||
methods: { | methods: { | ||||
toggleClick() { | toggleClick() { | ||||
this.$emit('toggleClick') | this.$emit('toggleClick') | ||||
@@ -1,7 +1,7 @@ | |||||
<template> | <template> | ||||
<div ref="navbar" class="navbar" | <div ref="navbar" class="navbar" | ||||
:style="changeColor ? 'background: rgba(0, 21, 41, 1);boxShadow:0px 1px 8px 0px rgba(0,131,255,0.35)' : ''"> | :style="changeColor ? 'background: rgba(0, 21, 41, 1);boxShadow:0px 1px 8px 0px rgba(0,131,255,0.35)' : ''"> | ||||
<hamburger id="hamburger-container" style="color: blue;" :is-active="sidebar.opened" class="hamburger-container" | |||||
<hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container" | |||||
@toggleClick="toggleSideBar" /> | @toggleClick="toggleSideBar" /> | ||||
<breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!topNav" /> | <breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!topNav" /> | ||||
@@ -67,17 +67,21 @@ export default { | |||||
} | } | ||||
}, | }, | ||||
watch: { | watch: { | ||||
changeColor(val) { | |||||
if (val == true) { | |||||
let svg = document.getElementsByClassName('hamburger') | |||||
console.log('svg',svg); | |||||
svg[0].setAttribute('fill', 'rgba(255, 255, 255, 1)') | |||||
} else { | |||||
let svg = document.getElementsByClassName('hamburger') | |||||
console.log('svg', svg); | |||||
svg[0].setAttribute('fill', '') | |||||
} | |||||
}, | |||||
// changeColor: { | |||||
// handler(val){ | |||||
// if (val == true) { | |||||
// let svg = document.getElementsByClassName('hamburger') | |||||
// console.log('svg', svg) | |||||
// svg[0].style.color = 'rgba(255, 255, 255, 1)' | |||||
// svg[0].setAttribute('fill', 'rgba(255, 255, 255, 1)') | |||||
// } else { | |||||
// let svg = document.getElementsByClassName('hamburger') | |||||
// console.log('svg', svg); | |||||
// svg[0].setAttribute('fill', '') | |||||
// } | |||||
// }, | |||||
// immediate: true, //立即执行 | |||||
// } | |||||
}, | }, | ||||
methods: { | methods: { | ||||
toggleSideBar() { | toggleSideBar() { | ||||
@@ -192,15 +192,12 @@ export default { | |||||
this.makeData(); | this.makeData(); | ||||
this.$nextTick(() => { | this.$nextTick(() => { | ||||
let button = document.getElementsByClassName('button-than') | let button = document.getElementsByClassName('button-than') | ||||
console.log(button); | |||||
button[0].children[0].style.borderRadius = '4px 0 0 4px' | button[0].children[0].style.borderRadius = '4px 0 0 4px' | ||||
button[0].children[1].style.borderRadius = '0px 4px 4px 0' | button[0].children[1].style.borderRadius = '0px 4px 4px 0' | ||||
console.log(button[0].children[0].style); | |||||
}) | }) | ||||
}, | }, | ||||
methods: { | methods: { | ||||
makeData() { | makeData() { | ||||
console.log('msgObj', this.msgObj); | |||||
this.msgObj.chip = {}; | this.msgObj.chip = {}; | ||||
this.msgObj.stand = {}; | this.msgObj.stand = {}; | ||||
this.msgObj.bipv = {}; | this.msgObj.bipv = {}; | ||||
@@ -1,7 +1,7 @@ | |||||
<!-- | <!-- | ||||
* @Author: zhp | * @Author: zhp | ||||
* @Date: 2024-06-20 16:13:52 | * @Date: 2024-06-20 16:13:52 | ||||
* @LastEditTime: 2024-07-09 16:14:43 | |||||
* @LastEditTime: 2024-07-11 13:52:44 | |||||
* @LastEditors: zhp | * @LastEditors: zhp | ||||
* @Description: | * @Description: | ||||
--> | --> | ||||
@@ -51,7 +51,6 @@ export default { | |||||
}, | }, | ||||
}, | }, | ||||
formatter: function (params) { | formatter: function (params) { | ||||
console.log('params', params); | |||||
var res = `<span style='color:rgba(0,0,0,0.8)'>${params[0].axisValueLabel}</span>`; | var res = `<span style='color:rgba(0,0,0,0.8)'>${params[0].axisValueLabel}</span>`; | ||||
for (var i = 0, l = params.length; i < l; i++) { | for (var i = 0, l = params.length; i < l; i++) { | ||||
res += | res += | ||||