Compare commits

...

3 Commits

Author SHA1 Message Date
‘937886381’
689de3173f Merge branch 'projects/mescc/develop' into projects/mescc/zhp 2024-07-05 16:33:39 +08:00
‘937886381’
865698a9be 修改ui 2024-07-05 16:33:14 +08:00
798ea2d90d Merge pull request 'projects/mescc/zhp' (#84) from projects/mescc/zhp into projects/mescc/develop
All checks were successful
continuous-integration/drone/push Build is passing
Reviewed-on: #84
2024-07-05 14:08:40 +08:00
5 changed files with 141 additions and 80 deletions

View File

@ -18,7 +18,35 @@ export default {
levelList: null levelList: null
} }
}, },
computed: {
changeColor() {
if (this.$route.path == '/copilot/efficiency-container' || this.$route.path == '/copilot/main') {
return true
} else {
return false
}
},
},
watch: { watch: {
// changeColor(val) {
// if (val == true) {
// var tag = document.getElementsByClassName("breadcrumb-container")
// console.log('tag', tag)
// // for (let i in tag) {
// tag[i].style.color = 'rgba(255, 255, 255, 0.45)'
// // tag[i].classList.remove("default")
// // }
// // console.log('this.$refs.scrollContainer', this.$refs.tag);
// } else {
// var tag = document.getElementsByClassName("breadcrumb-container")
// console.log('tag', tag)
// for (let i in tag) {
// tag[i].style.color = ''
// // tag[i].classList.remove("default")
// }
// // this.$refs.mainContainer.style.backgroundColor = ''
// }
// },
$route(route) { $route(route) {
// if you go to the redirect page, do not update the breadcrumbs // if you go to the redirect page, do not update the breadcrumbs
if (route.path.startsWith('/redirect/')) { if (route.path.startsWith('/redirect/')) {

View File

@ -1,5 +1,5 @@
<template> <template>
<div class="navbar"> <div ref="navbar" class="navbar">
<hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container" <hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container"
@toggleClick="toggleSideBar" /> @toggleClick="toggleSideBar" />
@ -41,6 +41,13 @@ export default {
'nickname', 'nickname',
'device' 'device'
]), ]),
changeColor() {
if (this.$route.path == '/copilot/efficiency-container' || this.$route.path == '/copilot/main') {
return true
} else {
return false
}
},
setting: { setting: {
get() { get() {
return this.$store.state.settings.showSettings return this.$store.state.settings.showSettings
@ -58,6 +65,18 @@ export default {
} }
} }
}, },
watch: {
// changeColor(val) {
// if (val == true) {
// // console.log('this.$refs.mainContainer', this.$refs.mainContainer);
// this.$refs.navbar.style.backgroundColor = 'rgba(0, 21, 41, 1)'
// this.$refs.navbar.style.boxShadow = '0px 1px 8px 0px rgba(0,131,255,0.35)'
// } else {
// this.$refs.navbar.style.backgroundColor = ''
// this.$refs.navbar.style.boxShadow = ''
// }
// },
},
methods: { methods: {
toggleSideBar() { toggleSideBar() {
this.$store.dispatch('app/toggleSideBar') this.$store.dispatch('app/toggleSideBar')

View File

@ -56,23 +56,26 @@ export default {
}, },
watch: { watch: {
changeColor(val) { changeColor(val) {
// if (val == true) { if (val == true) {
// this.$refs.tagsViewContainer.style.backgroundColor = 'rgba(0, 21, 41, 1)' console.log('this.$refs.tagsViewContainer', this.$refs.tagsViewContainer);
// var tag = document.getElementsByClassName("tags-view-item") this.$refs.tagsViewContainer.style.backgroundColor = 'rgba(0, 21, 41, 1)'
// console.log('tag', tag) this.$refs.tagsViewContainer.style.borderTop = '0px solid #d8dce5'
// for (let i in tag) { var tag = document.getElementsByClassName("tags-view-item")
// tag[i].classList.add("changeColor") console.log('tag', tag)
// // tag[i].classList.remove("default") for (let i in tag) {
// } tag[i].classList.add("changeColor")
// console.log('this.$refs.scrollContainer', this.$refs.tag); // tag[i].classList.remove("default")
// } else { }
// this.$refs.tagsViewContainer.style.backgroundColor = '' console.log('this.$refs.scrollContainer', this.$refs.tag);
// var tag = document.getElementsByClassName("tags-view-item") } else {
// for (let i in tag) { this.$refs.tagsViewContainer.style.backgroundColor = ''
// // tag[i].classList.remove("changeColor") this.$refs.tagsViewContainer.style.borderTop = '1px solid #d8dce5'
// // tag[i].classList.add("default") var tag = document.getElementsByClassName("tags-view-item")
// } for (let i in tag) {
// } tag[i].classList.remove("changeColor")
// tag[i].classList.add("default")
}
}
}, },
$route() { $route() {
this.addTags() this.addTags()
@ -96,11 +99,23 @@ export default {
return route.path === this.$route.path return route.path === this.$route.path
}, },
activeStyle(tag) { activeStyle(tag) {
if (!this.isActive(tag)) return {}; if (this.changeColor) {
return { if (!this.isActive(tag)) return {
"background-color": this.theme, "background-color": 'rgba(0, 59, 115, 1)',
"border-color": this.theme "border-color": 'rgba(0, 59, 115, 1)',
}; "color": 'rgba(255, 255, 255, 1)'
};
return {
"background-color": this.theme,
"border-color": this.theme
};
} else {
if (!this.isActive(tag)) return {};
return {
"background-color": this.theme,
"border-color": this.theme
};
}
}, },
isAffix(tag) { isAffix(tag) {
return tag.meta && tag.meta.affix return tag.meta && tag.meta.affix

View File

@ -2,7 +2,7 @@
<div :class="classObj" class="app-wrapper" :style="{ '--current-color': theme }"> <div :class="classObj" class="app-wrapper" :style="{ '--current-color': theme }">
<div v-if="device === 'mobile' && sidebar.opened" class="drawer-bg" @click="handleClickOutside" /> <div v-if="device === 'mobile' && sidebar.opened" class="drawer-bg" @click="handleClickOutside" />
<sidebar v-if="!sidebar.hide" class="sidebar-container" /> <sidebar v-if="!sidebar.hide" class="sidebar-container" />
<div :class="{ hasTagsView: needTagsView, sidebarHide: sidebar.hide }" class="main-container"> <div ref="mainContainer" :class="{ hasTagsView: needTagsView, sidebarHide: sidebar.hide }" class="main-container">
<div :class="{ 'fixed-header': fixedHeader }"> <div :class="{ 'fixed-header': fixedHeader }">
<navbar /> <navbar />
<tags-view v-if="needTagsView" /> <tags-view v-if="needTagsView" />
@ -59,19 +59,14 @@ export default {
} }
}, },
watch: { watch: {
// changeColor(val) { changeColor(val) {
// if (val == true) { if (val == true) {
// var tag = document.getElementsByClassName("main-container") console.log('this.$refs.mainContainer', this.$refs.mainContainer);
// console.log('tag', tag); this.$refs.mainContainer.style.backgroundColor = 'rgba(0, 21, 41, 1)'
// tag.style.backgroundColor = 'rgba(0, 21, 41, 1)' } else {
// } else { this.$refs.mainContainer.style.backgroundColor = ''
// var tag = document.getElementsByClassName("main-container") }
// // for (let i in tag) { },
// tag.style.backgroundColor = ''
// // tag[i].classList.add("default")
// // }
// }
// },
}, },
methods: { methods: {
handleClickOutside() { handleClickOutside() {

View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2023-11-06 15:15:30 * @Date: 2023-11-06 15:15:30
* @LastEditTime: 2024-07-05 09:31:40 * @LastEditTime: 2024-07-05 15:16:01
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -78,49 +78,51 @@
dataForm.endDate[2] : '' }}</p> dataForm.endDate[2] : '' }}</p>
</el-col> </el-col>
</el-row> </el-row>
<div style="width: 100%; padding: 0 32px"> <div v-loading="loading">
<el-divider style="margin: 0"></el-divider> <div style="width: 100%; padding: 0 32px">
<el-divider style="margin: 0"></el-divider>
</div>
<el-row :gutter="0" style="margin: 20px 32px">
<el-col :span="8">
<div>
<small-title slot="title" :no-padding="true">
产品良率
</small-title>
<div ref="pie" :style="{ height: '40vh', width: '100%' }" />
</div>
</el-col>
<el-col :span="16">
<div style="border-left: 1px solid #d1d3d8; width: 100%; padding-left: 32px">
<small-title slot="title" :no-padding="true">
待制品分布
</small-title>
<div ref="equipmentLine" :style="{ height: '40vh', width: '50vw' }" />
</div>
</el-col>
</el-row>
<div style="width: 100%; padding: 0 32px">
<el-divider style="margin: 0"></el-divider>
</div>
<el-row :gutter="0" style="margin: 20px 32px">
<el-col :span="8">
<div>
<small-title slot="title" :no-padding="true">
生产明细
</small-title>
<div ref="bar" :style="{ height: '40vh', width: '100%' }" />
</div>
</el-col>
<el-col :span="16">
<div v-show="dataForm.orderStatus === 2"
style="border-left: 1px solid #d1d3d8; width: 100%; padding-left: 32px">
<small-title slot="title" :no-padding="true">
历史趋势
</small-title>
<div ref="line" :style="{ height: '40vh', width: '50vw' }" />
</div>
</el-col>
</el-row>
</div> </div>
<el-row :gutter="0" style="margin: 20px 32px">
<el-col :span="8">
<div>
<small-title slot="title" :no-padding="true">
产品良率
</small-title>
<div ref="pie" :style="{ height: '40vh', width: '100%' }" />
</div>
</el-col>
<el-col :span="16">
<div style="border-left: 1px solid #d1d3d8; width: 100%; padding-left: 32px">
<small-title slot="title" :no-padding="true">
待制品分布
</small-title>
<div ref="equipmentLine" :style="{ height: '40vh', width: '50vw' }" />
</div>
</el-col>
</el-row>
<div style="width: 100%; padding: 0 32px">
<el-divider style="margin: 0"></el-divider>
</div>
<el-row :gutter="0" style="margin: 20px 32px">
<el-col :span="8">
<div>
<small-title slot="title" :no-padding="true">
生产明细
</small-title>
<div ref="bar" :style="{ height: '40vh', width: '100%' }" />
</div>
</el-col>
<el-col :span="16">
<div v-show="dataForm.orderStatus === 2"
style="border-left: 1px solid #d1d3d8; width: 100%; padding-left: 32px">
<small-title slot="title" :no-padding="true">
历史趋势
</small-title>
<div ref="line" :style="{ height: '40vh', width: '50vw' }" />
</div>
</el-col>
</el-row>
</div> </div>
</el-drawer> </el-drawer>
@ -154,6 +156,7 @@ export default {
barChart: null, barChart: null,
equipmentLineChart: null, equipmentLineChart: null,
visible: false, visible: false,
loading:true,
dataForm: {}, dataForm: {},
colorList: ['#3E8EF7', '#69E6D8', '#F7C739'] // pie colorList: ['#3E8EF7', '#69E6D8', '#F7C739'] // pie
} }
@ -206,6 +209,7 @@ export default {
if (id) { if (id) {
getWorkOrderDetail(id).then(res => { getWorkOrderDetail(id).then(res => {
if (res.code === 0) { if (res.code === 0) {
this.loading = false
this.dataForm = res.data.prodWorkOrderDO this.dataForm = res.data.prodWorkOrderDO
this.buildChart(this.dataForm) this.buildChart(this.dataForm)
// //