mt-fe-group/yudao-init
8
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

projects/mescc/zhp #89

Merged
juzi merged 4 commits from projects/mescc/zhp into projects/mescc/develop 2024-07-10 10:01:27 +08:00
Conversation 0 Commits 4 Files Changed 44 +1413 -225
44 changed files with 1413 additions and 225 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/views/components/ChartContainer.vue
View File

@ -1,3 +1,10 @@
<!--
* @Author: zhp
* @Date: 2024-06-03 15:38:31
* @LastEditTime: 2024-07-09 15:59:41
* @LastEditors: zhp
* @Description:
-->
<!-- <!--
filename: ChartContainer.vue filename: ChartContainer.vue
author: liubin author: liubin
@ -43,7 +50,7 @@ export default {
} }
::-webkit-scrollbar { ::-webkit-scrollbar {
width: 8px; width: 80%;
height: 8px; height: 8px;
} }

2
src/views/copilot/components/Container.vue
View File

@ -122,7 +122,7 @@ export default {
gap: 8px; gap: 8px;
.container-title { .container-title {
font-size: 1.18vw; font-size: 1vw;
line-height: 1.39vw; line-height: 1.39vw;
font-weight: normal; font-weight: normal;
letter-spacing: 2px; letter-spacing: 2px;

6
src/views/copilot/components/ContainerIcon.vue
View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-04-28 13:42:51 * @Date: 2024-04-28 13:42:51
* @LastEditTime: 2024-05-07 16:54:54 * @LastEditTime: 2024-07-09 16:55:58
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -61,8 +61,8 @@ export default {
.container-icon { .container-icon {
// width: 32px; // width: 32px;
// height: 32px; // height: 32px;
width: 1.701vw; width: 1.4vw;
height: 1.701vw; height: 1.4vw;
background: #ccc2; background: #ccc2;
} }
</style> </style>

226
src/views/copilot/components/bottomLeftContainer.vue Normal file
View File

@ -0,0 +1,226 @@
<!--
* @Author: zhp
* @Date: 2024-07-09 15:07:50
* @LastEditTime: 2024-07-09 15:41:38
* @LastEditors: zhp
* @Description:
-->
<!--
* @Author: zhp
* @Date: 2024-06-05 09:43:51
* @LastEditTime: 2024-07-09 15:06:52
* @LastEditors: zhp
* @Description:
-->
<template>
<div class="copilot-container">
<!-- refresh btn -->
<button v-if="false" style="
appearance: none;
outline: none;
border: none;
background: none;
color: #fff;
cursor: pointer;
position: absolute;
top: 8px;
right: 8px;
" @click="$emit('refresh')">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"
style="width: 24px; height: 24px">
<path stroke-linecap="round" stroke-linejoin="round"
d="M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0 3.181 3.183a8.25 8.25 0 0 0 13.803-3.7M4.031 9.865a8.25 8.25 0 0 1 13.803-3.7l3.181 3.182m0-4.991v4.99" />
</svg>
</button>
<!-- decoration -->
<div class="corner tl"></div>
<div class="corner tr"></div>
<div class="corner bl"></div>
<div class="corner br"></div>
<!-- content -->
<div class="container-head" :class="[side == 'left' ? 'gradient-to-right' : 'gradient-to-left']">
<Icon style="margin-left: 16px;" :icon="icon"></Icon>
<h2 class="container-title">{{ title }}</h2>
</div>
<div class="container-body" :class="[
side == 'left' ? 'body-gradient-to-right' : 'body-gradient-to-left',
]">
<slot />
</div>
</div>
</template>
<script>
import ContainerIconVue from "./ContainerIcon.vue";
export default {
name: "DashboardContainer",
components: {
Icon: ContainerIconVue,
},
props: {
side: {
type: String,
default: "left",
},
icon: {
type: String,
default: "cube",
},
title: {
type: String,
default: "Default Title",
},
},
data() {
return {};
},
computed: {},
methods: {},
};
</script>
<style scoped lang="scss">
.copilot-container {
height: 0;
flex: 1;
display: flex;
flex-direction: column;
position: relative;
box-shadow: inset 0 0 20px 1px #fff1;
border-left: 0.11415vw solid;
border-image: linear-gradient(to bottom, transparent 10%,
#024798 20%,
transparent 90%) 1;
backdrop-filter: blur(4px);
&::before {
content: "";
position: absolute;
display: inline-block;
height: 92%;
width: 0.11415vw;
border-radius: 2px;
top: 0%;
right: 0;
background: radial-gradient(
circle at center,
#024798 2%,
#024798 100%,
transparent
);
z-index: 1;
}
&::after {
content: "";
position: absolute;
display: inline-block;
width: 90%;
height: 0.31415vh;
border-radius: 2px;
left: 8%;
bottom: 0;
background: linear-gradient(to right, transparent 60%, #024798 98%, transparent 90%);
z-index: 0;
}
.container-head {
// height: 40px;
height: 3.8vh;
padding: 8px;
display: flex;
align-items: center;
gap: 8px;
.container-title {
font-size: 1vw;
line-height: 1.39vw;
font-weight: normal;
letter-spacing: 2px;
}
}
.container-body {
padding: 12px;
display: flex;
flex-direction: column;
flex: 1;
height: 0;
}
.corner {
z-index: 1;
position: absolute;
// width: 16px;
// height: 16px;
width: 0.95vw;
height: 0.95vw;
}
.corner.tl {
border-top: 2px solid #0175dc;
border-left: 2px solid #0175dc;
top: 0;
left: 0;
}
.corner.tr {
top: 0;
right: 0;
border-top: 2px solid #0175dc;
border-right: 2px solid #0175dc;
}
.corner.bl {
// width: 20px;
// height: 20px;
width: 1.064vw;
height: 1.064vw;
bottom: 0;
left: 0;
// border-left: 10px solid #0175dc;
// border-bottom: 10px solid #0175dc;
// border-top: 10px solid transparent;
// border-right: 10px solid transparent;
border-left: 0.532vw solid transparent;
border-bottom: .6vw solid #0175dc;
border-top: 0.532vw solid transparent;
border-right: 0.532vw solid transparent;
}
.corner.br {
bottom: 0;
right: 0;
// width: 20px;
// height: 20px;
width: 1.064vw;
height: 1.064vw;
border-left: 0.532vw solid transparent;
border-bottom: 0.532vw solid #0175dc;
border-top: 0.532vw solid transparent;
border-right: 0.532vw solid #0175dc;
// border-left: 10px solid transparent;
// border-bottom: 10px solid #0175dc;
// border-top: 10px solid transparent;
// border-right: 10px solid #0175dc;
// transform: rotate(-90deg);
}
.gradient-to-right {
background: linear-gradient(to right, #0c3f68cc, transparent);
}
.gradient-to-left {
background: linear-gradient(to left, #0c3f68cc, transparent);
}
.body-gradient-to-right {
background: linear-gradient(to right, #0003, transparent);
}
.body-gradient-to-left {
background: linear-gradient(to left, #0003, transparent);
}
}
</style>

219
src/views/copilot/components/bottomRightContainer.vue Normal file
View File

@ -0,0 +1,219 @@
<!--
filename: Container.vue
author: liubin
date: 2024-04-09 10:44:09
description:
-->
<template>
<div class="copilot-container">
<!-- refresh btn -->
<button v-if="false" style="
appearance: none;
outline: none;
border: none;
background: none;
color: #fff;
cursor: pointer;
position: absolute;
top: 8px;
right: 8px;
" @click="$emit('refresh')">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"
style="width: 24px; height: 24px">
<path stroke-linecap="round" stroke-linejoin="round"
d="M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0 3.181 3.183a8.25 8.25 0 0 0 13.803-3.7M4.031 9.865a8.25 8.25 0 0 1 13.803-3.7l3.181 3.182m0-4.991v4.99" />
</svg>
</button>
<!-- decoration -->
<div class="corner tl"></div>
<div class="corner tr"></div>
<div class="corner bl"></div>
<div class="corner br"></div>
<!-- content -->
<div class="container-head" :class="[side == 'left' ? 'gradient-to-right' : 'gradient-to-left']">
<Icon style="margin-left: 16px;" :icon="icon"></Icon>
<h2 class="container-title">{{ title }}</h2>
</div>
<div class="container-body" :class="[
side == 'left' ? 'body-gradient-to-right' : 'body-gradient-to-left',
]">
<slot />
</div>
</div>
</template>
<script>
import ContainerIconVue from "./ContainerIcon.vue";
export default {
name: "DashboardContainer",
components: {
Icon: ContainerIconVue,
},
props: {
side: {
type: String,
default: "left",
},
icon: {
type: String,
default: "cube",
},
title: {
type: String,
default: "Default Title",
},
},
data() {
return {};
},
computed: {},
methods: {},
};
</script>
<style scoped lang="scss">
.copilot-container {
height: 0;
flex: 1;
display: flex;
flex-direction: column;
position: relative;
box-shadow: inset 0 0 20px 1px #fff1;
border-right: 0.11415vw solid;
border-image: linear-gradient(to bottom, transparent 10%,
#024798 20%,
transparent 90%) 1;
backdrop-filter: blur(4px);
&::before {
content: "";
position: absolute;
display: inline-block;
height: 92%;
width: 0.11415vw;
border-radius: 2px;
top: 0%;
left: 0;
background: radial-gradient(
circle at center,
#024798 2%,
#024798 100%,
transparent
);
z-index: 1;
}
&::after {
content: "";
position: absolute;
display: inline-block;
width: 95%;
height: 0.31415vh;
border-radius: 2px;
right: 3%;
bottom: 0;
background: linear-gradient(to left, transparent 60%, #024798 98%, transparent 98%);
z-index: 0;
}
.container-head {
// height: 40px;
height: 3.8vh;
padding: 8px;
display: flex;
align-items: center;
gap: 8px;
.container-title {
font-size: 1vw;
line-height: 1.39vw;
font-weight: normal;
letter-spacing: 2px;
}
}
.container-body {
padding: 12px;
display: flex;
flex-direction: column;
flex: 1;
height: 0;
}
.corner {
z-index: 1;
position: absolute;
// width: 16px;
// height: 16px;
width: 0.95vw;
height: 0.95vw;
}
.corner.tl {
border-top: 2px solid #0175dc;
border-left: 2px solid #0175dc;
top: 0;
left: 0;
}
.corner.tr {
top: 0;
right: 0;
border-top: 2px solid #0175dc;
border-right: 2px solid #0175dc;
}
.corner.bl {
// width: 20px;
// height: 20px;
width: 1.064vw;
height: 1.064vw;
bottom: 0;
left: 0;
// border-left: 10px solid #0175dc;
// border-bottom: 10px solid #0175dc;
// border-top: 10px solid transparent;
// border-right: 10px solid transparent;
border-left: 0.532vw solid #0175dc;
border-bottom: 0.532vw solid #0175dc;
border-top: 0.532vw solid transparent;
border-right: 0.532vw solid transparent;
}
.corner.br {
bottom: 0;
right: 0;
// width: 20px;
// height: 20px;
width: 1.064vw;
height: 1.064vw;
// border-left: 10px solid transparent;
// border-bottom: 10px solid #0175dc;
// border-top: 10px solid transparent;
// border-right: 10px solid #0175dc;
// transform: rotate(-90deg);
border-left: 0.532vw solid transparent;
border-bottom: .6vw solid #0175dc;
border-top: 0.532vw solid transparent;
border-right: 0.532vw solid transparent;
}
.gradient-to-right {
background: linear-gradient(to right, #0c3f68cc, transparent);
}
.gradient-to-left {
background: linear-gradient(to left, #0c3f68cc, transparent);
}
.body-gradient-to-right {
background: linear-gradient(to right, #0003, transparent);
}
.body-gradient-to-left {
background: linear-gradient(to left, #0003, transparent);
}
}
</style>

219
src/views/copilot/components/efficiencyLeftContainer.vue Normal file
View File

@ -0,0 +1,219 @@
<!--
* @Author: zhp
* @Date: 2024-07-09 15:15:00
* @LastEditTime: 2024-07-09 15:36:49
* @LastEditors: zhp
* @Description:
-->
<template>
<div class="copilot-container">
<!-- refresh btn -->
<button v-if="false" style="
appearance: none;
outline: none;
border: none;
background: none;
color: #fff;
cursor: pointer;
position: absolute;
top: 8px;
right: 8px;
" @click="$emit('refresh')">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"
style="width: 24px; height: 24px">
<path stroke-linecap="round" stroke-linejoin="round"
d="M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0 3.181 3.183a8.25 8.25 0 0 0 13.803-3.7M4.031 9.865a8.25 8.25 0 0 1 13.803-3.7l3.181 3.182m0-4.991v4.99" />
</svg>
</button>
<!-- decoration -->
<div class="corner tl"></div>
<div class="corner tr"></div>
<div class="corner bl"></div>
<div class="corner br"></div>
<!-- content -->
<div class="container-head" :class="[side == 'left' ? 'gradient-to-right' : 'gradient-to-left']">
<Icon style="margin-left: 16px;" :icon="icon"></Icon>
<h2 class="container-title">{{ title }}</h2>
</div>
<div class="container-body" :class="[
side == 'left' ? 'body-gradient-to-right' : 'body-gradient-to-left',
]">
<slot />
</div>
</div>
</template>
<script>
import ContainerIconVue from "./ContainerIcon.vue";
export default {
name: "DashboardContainer",
components: {
Icon: ContainerIconVue,
},
props: {
side: {
type: String,
default: "left",
},
icon: {
type: String,
default: "cube",
},
title: {
type: String,
default: "Default Title",
},
},
data() {
return {};
},
computed: {},
methods: {},
};
</script>
<style scoped lang="scss">
.copilot-container {
height: 0;
flex: 1;
display: flex;
flex-direction: column;
position: relative;
box-shadow: inset 0 0 20px 1px #fff1;
border-left: 0.11415vw solid;
border-image: linear-gradient(to bottom, transparent 5%,
#024798 10%,
transparent 90%) 1;
backdrop-filter: blur(4px);
&::before {
content: "";
position: absolute;
display: inline-block;
height: 92%;
width: 0.11415vw;
border-radius: 2px;
top: 0%;
right: 0;
background: radial-gradient(
circle at center,
#024798 5%,
#024798 100%,
transparent
);
z-index: 1;
}
&::after {
content: "";
position: absolute;
display: inline-block;
width: 90%;
height: 0.31415vh;
border-radius: 2px;
left: 10%;
bottom: 0;
background: linear-gradient(to right,transparent 60%, #024798 95%, transparent 97%);
z-index: 0;
}
.container-head {
// height: 40px;
height: 3.8vh;
padding: 8px;
display: flex;
align-items: center;
gap: 8px;
.container-title {
font-size: 1vw;
line-height: 1.39vw;
font-weight: normal;
letter-spacing: 2px;
}
}
.container-body {
padding: 12px;
display: flex;
flex-direction: column;
flex: 1;
height: 0;
}
.corner {
z-index: 1;
position: absolute;
// width: 16px;
// height: 16px;
width: 0.95vw;
height: 0.95vw;
}
.corner.tl {
border-top: 2px solid #0175dc;
border-left: 2px solid #0175dc;
top: 0;
left: 0;
}
.corner.tr {
top: 0;
right: 0;
border-top: 2px solid #0175dc;
border-right: 2px solid #0175dc;
}
.corner.bl {
// width: 20px;
// height: 20px;
width: 1.064vw;
height: 1.064vw;
bottom: 0;
left: 0;
// border-left: 10px solid #0175dc;
// border-bottom: 10px solid #0175dc;
// border-top: 10px solid transparent;
// border-right: 10px solid transparent;
border-left: 0.532vw solid transparent;
border-bottom: .6vw solid #0175dc;
border-top: 0.532vw solid transparent;
border-right: 0.532vw solid transparent;
}
.corner.br {
bottom: 0;
right: 0;
// width: 20px;
// height: 20px;
width: 1.064vw;
height: 1.064vw;
border-left: 0.532vw solid transparent;
border-bottom: 0.532vw solid #0175dc;
border-top: 0.532vw solid transparent;
border-right: 0.532vw solid #0175dc;
// border-left: 10px solid transparent;
// border-bottom: 10px solid #0175dc;
// border-top: 10px solid transparent;
// border-right: 10px solid #0175dc;
// transform: rotate(-90deg);
}
.gradient-to-right {
background: linear-gradient(to right, #0c3f68cc, transparent);
}
.gradient-to-left {
background: linear-gradient(to left, #0c3f68cc, transparent);
}
.body-gradient-to-right {
background: linear-gradient(to right, #0003, transparent);
}
.body-gradient-to-left {
background: linear-gradient(to left, #0003, transparent);
}
}
</style>

219
src/views/copilot/components/efficiencyRightContainer.vue Normal file
View File

@ -0,0 +1,219 @@
<!--
filename: Container.vue
author: liubin
date: 2024-04-09 10:44:09
description:
-->
<template>
<div class="copilot-container">
<!-- refresh btn -->
<button v-if="false" style="
appearance: none;
outline: none;
border: none;
background: none;
color: #fff;
cursor: pointer;
position: absolute;
top: 8px;
right: 8px;
" @click="$emit('refresh')">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"
style="width: 24px; height: 24px">
<path stroke-linecap="round" stroke-linejoin="round"
d="M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0 3.181 3.183a8.25 8.25 0 0 0 13.803-3.7M4.031 9.865a8.25 8.25 0 0 1 13.803-3.7l3.181 3.182m0-4.991v4.99" />
</svg>
</button>
<!-- decoration -->
<div class="corner tl"></div>
<div class="corner tr"></div>
<div class="corner bl"></div>
<div class="corner br"></div>
<!-- content -->
<div class="container-head" :class="[side == 'left' ? 'gradient-to-right' : 'gradient-to-left']">
<Icon style="margin-left: 16px;" :icon="icon"></Icon>
<h2 class="container-title">{{ title }}</h2>
</div>
<div class="container-body" :class="[
side == 'left' ? 'body-gradient-to-right' : 'body-gradient-to-left',
]">
<slot />
</div>
</div>
</template>
<script>
import ContainerIconVue from "./ContainerIcon.vue";
export default {
name: "DashboardContainer",
components: {
Icon: ContainerIconVue,
},
props: {
side: {
type: String,
default: "left",
},
icon: {
type: String,
default: "cube",
},
title: {
type: String,
default: "Default Title",
},
},
data() {
return {};
},
computed: {},
methods: {},
};
</script>
<style scoped lang="scss">
.copilot-container {
height: 0;
flex: 1;
display: flex;
flex-direction: column;
position: relative;
box-shadow: inset 0 0 20px 1px #fff1;
border-right: 0.11415vw solid;
border-image: linear-gradient(to bottom,transparent 5%,
#024798 10%,
transparent 90%) 1;
backdrop-filter: blur(4px);
&::before {
content: "";
position: absolute;
display: inline-block;
height: 92%;
width: 0.11415vw;
border-radius: 2px;
top: 0%;
left: 0;
background: radial-gradient(
circle at center,
#024798 2%,
#024798 100%,
transparent
);
z-index: 1;
}
&::after {
content: "";
position: absolute;
display: inline-block;
width: 95%;
height: 0.31415vh;
border-radius: 2px;
right: 3%;
bottom: 0;
background: linear-gradient(to left, transparent 60%, #024798 98%, transparent 98%);
z-index: 0;
}
.container-head {
// height: 40px;
height: 3.8vh;
padding: 8px;
display: flex;
align-items: center;
gap: 8px;
.container-title {
font-size: 1vw;
line-height: 1.39vw;
font-weight: normal;
letter-spacing: 2px;
}
}
.container-body {
padding: 12px;
display: flex;
flex-direction: column;
flex: 1;
height: 0;
}
.corner {
z-index: 1;
position: absolute;
// width: 16px;
// height: 16px;
width: 0.95vw;
height: 0.95vw;
}
.corner.tl {
border-top: 2px solid #0175dc;
border-left: 2px solid #0175dc;
top: 0;
left: 0;
}
.corner.tr {
top: 0;
right: 0;
border-top: 2px solid #0175dc;
border-right: 2px solid #0175dc;
}
.corner.bl {
// width: 20px;
// height: 20px;
width: 1.064vw;
height: 1.064vw;
bottom: 0;
left: 0;
// border-left: 10px solid #0175dc;
// border-bottom: 10px solid #0175dc;
// border-top: 10px solid transparent;
// border-right: 10px solid transparent;
border-left: 0.532vw solid #0175dc;
border-bottom: 0.532vw solid #0175dc;
border-top: 0.532vw solid transparent;
border-right: 0.532vw solid transparent;
}
.corner.br {
bottom: 0;
right: 0;
// width: 20px;
// height: 20px;
width: 1.064vw;
height: 1.064vw;
// border-left: 10px solid transparent;
// border-bottom: 10px solid #0175dc;
// border-top: 10px solid transparent;
// border-right: 10px solid #0175dc;
// transform: rotate(-90deg);
border-left: 0.532vw solid transparent;
border-bottom: .6vw solid #0175dc;
border-top: 0.532vw solid transparent;
border-right: 0.532vw solid transparent;
}
.gradient-to-right {
background: linear-gradient(to right, #0c3f68cc, transparent);
}
.gradient-to-left {
background: linear-gradient(to left, #0c3f68cc, transparent);
}
.body-gradient-to-right {
background: linear-gradient(to right, #0003, transparent);
}
.body-gradient-to-left {
background: linear-gradient(to left, #0003, transparent);
}
}
</style>

26
src/views/copilot/components/leftContainer.vue
View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-06-05 09:43:51 * @Date: 2024-06-05 09:43:51
* @LastEditTime: 2024-06-05 09:43:52 * @LastEditTime: 2024-07-09 15:35:19
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -80,23 +80,25 @@ export default {
flex-direction: column; flex-direction: column;
position: relative; position: relative;
box-shadow: inset 0 0 20px 1px #fff1; box-shadow: inset 0 0 20px 1px #fff1;
border-left: 0.11415vw solid;
border-image: linear-gradient(to bottom, transparent 10%,
#024798 20%,
transparent 90%) 1;
backdrop-filter: blur(4px); backdrop-filter: blur(4px);
&::before { &::before {
content: ""; content: "";
position: absolute; position: absolute;
display: inline-block; display: inline-block;
height: 100%; height: 92%;
width: 0.11415vw; width: 0.11415vw;
border-radius: 2px; border-radius: 2px;
top: 0%; top: 0%;
left: 0; right: 0;
background: radial-gradient( background: radial-gradient(circle at center,
circle at center,
#024798 2%, #024798 2%,
#024798 30%, #024798 100%,
transparent transparent);
);
z-index: 1; z-index: 1;
} }
@ -104,12 +106,12 @@ export default {
content: ""; content: "";
position: absolute; position: absolute;
display: inline-block; display: inline-block;
width: 60%; width: 90%;
height: 0.31415vh; height: 0.31415vh;
border-radius: 2px; border-radius: 2px;
left: 8%; left: 7%;
bottom: 0; bottom: 0;
background: linear-gradient(to right, #024798, transparent); background: linear-gradient(to right,transparent 60%, #024798 95%, transparent 97%);
z-index: 0; z-index: 0;
} }
@ -122,7 +124,7 @@ export default {
gap: 8px; gap: 8px;
.container-title { .container-title {
font-size: 1.18vw; font-size: 1vw;
line-height: 1.39vw; line-height: 1.39vw;
font-weight: normal; font-weight: normal;
letter-spacing: 2px; letter-spacing: 2px;

17
src/views/copilot/components/rightContainer.vue
View File

@ -73,6 +73,7 @@ export default {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.copilot-container { .copilot-container {
height: 0; height: 0;
flex: 1; flex: 1;
@ -80,13 +81,17 @@ export default {
flex-direction: column; flex-direction: column;
position: relative; position: relative;
box-shadow: inset 0 0 20px 1px #fff1; box-shadow: inset 0 0 20px 1px #fff1;
border-right: 0.11415vw solid;
border-image: linear-gradient(to bottom,transparent 10%,
#024798 20%,
transparent 90%) 1;
backdrop-filter: blur(4px); backdrop-filter: blur(4px);
&::before { &::before {
content: ""; content: "";
position: absolute; position: absolute;
display: inline-block; display: inline-block;
height: 100%; height: 92%;
width: 0.11415vw; width: 0.11415vw;
border-radius: 2px; border-radius: 2px;
top: 0%; top: 0%;
@ -94,7 +99,7 @@ export default {
background: radial-gradient( background: radial-gradient(
circle at center, circle at center,
#024798 2%, #024798 2%,
#024798 30%, #024798 100%,
transparent transparent
); );
z-index: 1; z-index: 1;
@ -104,12 +109,12 @@ export default {
content: ""; content: "";
position: absolute; position: absolute;
display: inline-block; display: inline-block;
width: 60%; width: 95%;
height: 0.31415vh; height: 0.31415vh;
border-radius: 2px; border-radius: 2px;
left: 8%; right: 1%;
bottom: 0; bottom: 0;
background: linear-gradient(to right, #024798, transparent); background: linear-gradient(to left, transparent 60%, #024798 98%, transparent 98%);
z-index: 0; z-index: 0;
} }
@ -122,7 +127,7 @@ export default {
gap: 8px; gap: 8px;
.container-title { .container-title {
font-size: 1.18vw; font-size: 1vw;
line-height: 1.39vw; line-height: 1.39vw;
font-weight: normal; font-weight: normal;
letter-spacing: 2px; letter-spacing: 2px;

21
src/views/copilot/components/twoContainer.vue
View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-06-05 09:48:37 * @Date: 2024-06-05 09:48:37
* @LastEditTime: 2024-06-05 09:53:49 * @LastEditTime: 2024-07-09 15:35:04
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -99,6 +99,7 @@ export default {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.copilot-container { .copilot-container {
height: 0; height: 0;
flex: 1; flex: 1;
@ -106,23 +107,25 @@ export default {
flex-direction: column; flex-direction: column;
position: relative; position: relative;
box-shadow: inset 0 0 20px 1px #fff1; box-shadow: inset 0 0 20px 1px #fff1;
border-right: 0.11415vw solid;
border-image: linear-gradient(to bottom, transparent 10%,
#024798 20%,
transparent 90%) 1;
backdrop-filter: blur(4px); backdrop-filter: blur(4px);
&::before { &::before {
content: ""; content: "";
position: absolute; position: absolute;
display: inline-block; display: inline-block;
height: 100%; height: 92%;
width: 0.11415vw; width: 0.11415vw;
border-radius: 2px; border-radius: 2px;
top: 0%; top: 0%;
left: 0; left: 0;
background: radial-gradient( background: radial-gradient(circle at center,
circle at center,
#024798 2%, #024798 2%,
#024798 30%, #024798 100%,
transparent transparent);
);
z-index: 1; z-index: 1;
} }
@ -133,7 +136,7 @@ export default {
width: 60%; width: 60%;
height: 0.31415vh; height: 0.31415vh;
border-radius: 2px; border-radius: 2px;
left: 8%; left: 6%;
bottom: 0; bottom: 0;
background: linear-gradient(to right, #024798, transparent); background: linear-gradient(to right, #024798, transparent);
z-index: 0; z-index: 0;
@ -148,7 +151,7 @@ export default {
gap: 8px; gap: 8px;
.container-title { .container-title {
font-size: 1.18vw; font-size: 1vw;
line-height: 1.39vw; line-height: 1.39vw;
font-weight: normal; font-weight: normal;
letter-spacing: 2px; letter-spacing: 2px;

16
src/views/copilot/efficiency/components/ChipOee.vue
View File

@ -63,49 +63,47 @@ export default {
const year = new Date().getFullYear(); const year = new Date().getFullYear();
if (this.period === '日' && this.than === '同比') { if (this.period === '日' && this.than === '同比') {
items = [ items = [
{ label: `${yesterday}日目标`, color: "#58adfa" },
{ label: `${year - 1}年${yesterday}日`, color: "#12f7f1" }, { label: `${year - 1}年${yesterday}日`, color: "#12f7f1" },
{ label: `${yesterday}日`, color: "#58adfa" }, { label: `${yesterday}日`, color: "#58adfa" },
{ label: `${yesterday}日目标`, color: "#58adfa" },
]; ];
} else if (this.period === '日' && this.than === '环比') { } else if (this.period === '日' && this.than === '环比') {
items = [ items = [
{ label: `${yesterday}日目标`, color: "#58adfa" },
{ label: `${dayBeYes}日`, color: "#12f7f1" }, { label: `${dayBeYes}日`, color: "#12f7f1" },
{ label: `${yesterday}日`, color: "#58adfa" }, { label: `${yesterday}日`, color: "#58adfa" },
{ label: `${yesterday}日目标`, color: "#58adfa" },
]; ];
} else if (this.period === '周' && this.than === '同比') { } else if (this.period === '周' && this.than === '同比') {
items = [ items = [
{ label: `本周目标`, color: "#58adfa" },
{ label: `${year - 1}年本周`, color: "#12f7f1" }, { label: `${year - 1}年本周`, color: "#12f7f1" },
{ label: `本周`, color: "#58adfa" }, { label: `本周`, color: "#58adfa" },
{ label: `本周目标`, color: "#58adfa" },
]; ];
} else if (this.period === '周' && this.than === '环比') { } else if (this.period === '周' && this.than === '环比') {
items = [ items = [
{ label: `本周目标`, color: "#58adfa" },
{ label: `上周`, color: "#12f7f1" }, { label: `上周`, color: "#12f7f1" },
{ label: `本周`, color: "#58adfa" }, { label: `本周`, color: "#58adfa" },
{ label: `本周目标`, color: "#58adfa" },
]; ];
} else if (this.period === '月' && this.than === '同比') { } else if (this.period === '月' && this.than === '同比') {
items = [ items = [
{ label: `${month}月目标`, color: "#58adfa" },
{ label: `${year - 1}年${month}月`, color: "#12f7f1" }, { label: `${year - 1}年${month}月`, color: "#12f7f1" },
{ label: `${month}月`, color: "#58adfa" }, { label: `${month}月`, color: "#58adfa" },
{ label: `${month}月目标`, color: "#58adfa" },
// { label: `${month}月目标`, value: valueTuple[2] }, // { label: `${month}月目标`, value: valueTuple[2] },
]; ];
} else if (this.period === '月' && this.than === '环比') { } else if (this.period === '月' && this.than === '环比') {
items = [ items = [
{ label: `${month}月目标`, color: "#58adfa" },
{ label: `${lastMonth}月`, color: "#12f7f1" }, { label: `${lastMonth}月`, color: "#12f7f1" },
{ label: `${month}月`, color: "#58adfa" }, { label: `${month}月`, color: "#58adfa" },
{ label: `${month}月目标`, color: "#58adfa" },
// { label: `${month}月目标`, value: valueTuple[2] }, // { label: `${month}月目标`, value: valueTuple[2] },
]; ];
} else { } else {
items = [ items = [
{ label: `${year}年目标`, color: "#58adfa" },
{ label: `${year - 1}年`, color: "#12f7f1" }, { label: `${year - 1}年`, color: "#12f7f1" },
{ label: `${year}年`, color: "#58adfa" }, { label: `${year}年`, color: "#58adfa" },
{ label: `${year}年目标`, color: "#58adfa" },
// { label: `${year}年目标`, value: valueTuple[2] }, // { label: `${year}年目标`, value: valueTuple[2] },
]; ];
} }

16
src/views/copilot/efficiency/components/TransformRate.vue
View File

@ -63,49 +63,47 @@ export default {
const year = new Date().getFullYear(); const year = new Date().getFullYear();
if (this.period === '日' && this.than === '同比') { if (this.period === '日' && this.than === '同比') {
items = [ items = [
{ label: `${yesterday}日目标`, color: "#58adfa" },
{ label: `${year - 1}年${yesterday}日`, color: "#12f7f1" }, { label: `${year - 1}年${yesterday}日`, color: "#12f7f1" },
{ label: `${yesterday}日`, color: "#58adfa" }, { label: `${yesterday}日`, color: "#58adfa" },
{ label: `${yesterday}日目标`, color: "#58adfa" },
]; ];
} else if (this.period === '日' && this.than === '环比') { } else if (this.period === '日' && this.than === '环比') {
items = [ items = [
{ label: `${yesterday}日目标`, color: "#58adfa" },
{ label: `${dayBeYes}日`, color: "#12f7f1" }, { label: `${dayBeYes}日`, color: "#12f7f1" },
{ label: `${yesterday}日`, color: "#58adfa" }, { label: `${yesterday}日`, color: "#58adfa" },
{ label: `${yesterday}日目标`, color: "#58adfa" },
]; ];
} else if (this.period === '周' && this.than === '同比') { } else if (this.period === '周' && this.than === '同比') {
items = [ items = [
{ label: `本周目标`, color: "#58adfa" },
{ label: `${year - 1}年本周`, color: "#12f7f1" }, { label: `${year - 1}年本周`, color: "#12f7f1" },
{ label: `本周`, color: "#58adfa" }, { label: `本周`, color: "#58adfa" },
{ label: `本周目标`, color: "#58adfa" },
]; ];
} else if (this.period === '周' && this.than === '环比') { } else if (this.period === '周' && this.than === '环比') {
items = [ items = [
{ label: `本周目标`, color: "#58adfa" },
{ label: `上周`, color: "#12f7f1" }, { label: `上周`, color: "#12f7f1" },
{ label: `本周`, color: "#58adfa" }, { label: `本周`, color: "#58adfa" },
{ label: `本周目标`, color: "#58adfa" },
]; ];
} else if (this.period === '月' && this.than === '同比') { } else if (this.period === '月' && this.than === '同比') {
items = [ items = [
{ label: `${month}月目标`, color: "#58adfa" },
{ label: `${year - 1}年${month}月`, color: "#12f7f1" }, { label: `${year - 1}年${month}月`, color: "#12f7f1" },
{ label: `${month}月`, color: "#58adfa" }, { label: `${month}月`, color: "#58adfa" },
{ label: `${month}月目标`, color: "#58adfa" },
// { label: `${month}月目标`, value: valueTuple[2] }, // { label: `${month}月目标`, value: valueTuple[2] },
]; ];
} else if (this.period === '月' && this.than === '环比') { } else if (this.period === '月' && this.than === '环比') {
items = [ items = [
{ label: `${month}月目标`, color: "#58adfa" },
{ label: `${lastMonth}月`, color: "#12f7f1" }, { label: `${lastMonth}月`, color: "#12f7f1" },
{ label: `${month}月`, color: "#58adfa" }, { label: `${month}月`, color: "#58adfa" },
{ label: `${month}月目标`, color: "#58adfa" },
// { label: `${month}月目标`, value: valueTuple[2] }, // { label: `${month}月目标`, value: valueTuple[2] },
]; ];
} else { } else {
items = [ items = [
{ label: `${year}年目标`, color: "#58adfa" },
{ label: `${year - 1}年`, color: "#12f7f1" }, { label: `${year - 1}年`, color: "#12f7f1" },
{ label: `${year}年`, color: "#58adfa" }, { label: `${year}年`, color: "#58adfa" },
{ label: `${year}年目标`, color: "#58adfa" },
// { label: `${year}年目标`, value: valueTuple[2] }, // { label: `${year}年目标`, value: valueTuple[2] },
]; ];
} }

16
src/views/copilot/efficiency/components/sub/bar/BarChartChipOEE.vue
View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-05-07 13:22:43 * @Date: 2024-05-07 13:22:43
* @LastEditTime: 2024-07-08 14:10:08 * @LastEditTime: 2024-07-09 14:51:21
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -356,10 +356,10 @@ export default {
margin-right: 0.22vw; margin-right: 0.22vw;
} }
} }
.legend-item:nth-child(3) { .legend-item:nth-child(1) {
margin-left: 1vw; margin-left: 1vw;
} }
.legend-item:nth-child(3):before { .legend-item:nth-child(1):before {
// width: 12px; // width: 12px;
// height: 2px; // height: 2px;
width: 1vw; width: 1vw;
@ -368,11 +368,11 @@ export default {
position: absolute; position: absolute;
top: 50%; top: 50%;
// left: -16px; // left: -16px;
left: -0.951vw; left: -1.3vw;
transform: translateY(-50%); transform: translateY(-50%);
} }
.legend-item:nth-child(3):after { .legend-item:nth-child(1):after {
background-color: #f3c000; background-color: #f3c000;
content: ""; content: "";
display: inline-block; display: inline-block;
@ -383,15 +383,15 @@ export default {
height: 0.3191vw; height: 0.3191vw;
border-radius: 100%; border-radius: 100%;
top: 50%; top: 50%;
left: -0.851vw; left: -1.13vw;
// left: -16px; // left: -16px;
transform: translateY(-50%) translateX(50%); transform: translateY(-50%) translateX(50%);
} }
.legend-item:nth-child(1):before { .legend-item:nth-child(2):before {
background-color: #12f7f1; background-color: #12f7f1;
} }
.legend-item:nth-child(2):before { .legend-item:nth-child(3):before {
background-color: #58adfa; background-color: #58adfa;
} }
} }

16
src/views/copilot/efficiency/components/sub/bar/BarChartChipTrans.vue
View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-05-23 15:50:44 * @Date: 2024-05-23 15:50:44
* @LastEditTime: 2024-07-05 09:49:35 * @LastEditTime: 2024-07-09 14:57:49
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -355,17 +355,17 @@ export default {
margin-right: 0.22vw; margin-right: 0.22vw;
} }
} }
.legend-item:nth-child(3) { .legend-item:nth-child(1) {
margin-left: 1vw; margin-left: 1vw;
} }
.legend-item:nth-child(1):before { .legend-item:nth-child(2):before {
background-color: #12f7f1; background-color: #12f7f1;
} }
.legend-item:nth-child(2):before { .legend-item:nth-child(3):before {
background-color: #58adfa; background-color: #58adfa;
} }
.legend-item:nth-child(3):before { .legend-item:nth-child(1):before {
// width: 12px; // width: 12px;
// height: 2px; // height: 2px;
width: 1vw; width: 1vw;
@ -374,11 +374,11 @@ export default {
position: absolute; position: absolute;
top: 50%; top: 50%;
// left: -16px; // left: -16px;
left: -0.951vw; left: -1.3vw;
transform: translateY(-50%); transform: translateY(-50%);
} }
.legend-item:nth-child(3):after { .legend-item:nth-child(1):after {
background-color: #f3c000; background-color: #f3c000;
content: ""; content: "";
display: inline-block; display: inline-block;
@ -389,7 +389,7 @@ export default {
height: 0.3191vw; height: 0.3191vw;
border-radius: 100%; border-radius: 100%;
top: 50%; top: 50%;
left: -0.851vw; left: -1.13vw;
// left: -16px; // left: -16px;
transform: translateY(-50%) translateX(50%); transform: translateY(-50%) translateX(50%);
} }

2
src/views/copilot/efficiency/components/sub/std/ProgressBar.vue
View File

@ -52,7 +52,7 @@ export default {
? 0 ? 0
: this.current != 0 && this.target != 0 : this.current != 0 && this.target != 0
? `${((this.current / this.target) * 100).toFixed(2)}%` ? `${((this.current / this.target) * 100).toFixed(2)}%`
: this.current != 0 && this.target == 0 && this.current >= 100 ? 100 + '%' : this.current != 0 && this.target == 0 && this.current < 100 ? this.current + '%' : 0 + '%' : this.current != 0 && this.target == 0 && this.current >= 100 ? 100 + '%' : this.current != 0 && this.target == 0 && this.current < 100 ? parseFloat(this.current).toFixed(2) + '%' : 0 + '%'
// } else if(this.previous != 0) { // } else if(this.previous != 0) {
// return this.previous + '%' // return this.previous + '%'
// } // }

4
src/views/copilot/efficiency/components/sub/std/StdRateItem.vue
View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-05-07 10:25:10 * @Date: 2024-05-07 10:25:10
* @LastEditTime: 2024-06-27 09:13:38 * @LastEditTime: 2024-07-09 15:04:24
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -150,7 +150,7 @@ export default {
align-items: center; align-items: center;
gap: 8px; gap: 8px;
flex: 1 1 auto; flex: 1 1 auto;
padding: 12px; padding: 16px;
} }
.std-rate-item__value { .std-rate-item__value {

4
src/views/copilot/efficiency/components/sub/std/preProgressBar.vue
View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-06-27 09:12:54 * @Date: 2024-06-27 09:12:54
* @LastEditTime: 2024-06-27 09:14:21 * @LastEditTime: 2024-07-09 15:02:46
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -49,7 +49,7 @@ export default {
dataRate() { dataRate() {
// if (this.current != 0 && this.target != 0) { // if (this.current != 0 && this.target != 0) {
// console.log( '1111111111', this.current, this.target,this.previous); // console.log( '1111111111', this.current, this.target,this.previous);
return this.previous >=100 ? 100 + '%' : this.previous + '%'; return this.previous >= 100 ? 100 + '%' : parseFloat(this.previous).toFixed(2) + '%';
// } else if(this.previous != 0) { // } else if(this.previous != 0) {
// return this.previous + '%' // return this.previous + '%'
// } // }

7
src/views/copilot/efficiency/index.vue
View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-05-07 10:04:53 * @Date: 2024-05-07 10:04:53
* @LastEditTime: 2024-07-01 12:27:45 * @LastEditTime: 2024-07-09 15:16:43
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -30,8 +30,9 @@
</template> </template>
<script> <script>
import Container from "@/views/copilot/components/rightContainer.vue"; import Container from "@/views/copilot/components/efficiencyRightContainer.vue";
import leftContainer from "@/views/copilot/components/leftContainer.vue"; import leftContainer from "@/views/copilot/components/efficiencyLeftContainer.vue";
import ChipOeeVue from "./components/ChipOee.vue"; import ChipOeeVue from "./components/ChipOee.vue";
import ChipRateVue from "./components/ChipRate.vue"; import ChipRateVue from "./components/ChipRate.vue";
import StdRateVue from "./components/StdRate.vue"; import StdRateVue from "./components/StdRate.vue";

11
src/views/copilot/factoryData/components/ContainerIcon.vue
View File

@ -1,3 +1,10 @@
<!--
* @Author: zhp
* @Date: 2024-06-03 15:38:31
* @LastEditTime: 2024-07-09 16:49:22
* @LastEditors: zhp
* @Description:
-->
<!-- <!--
filename: ContainerIcon.vue filename: ContainerIcon.vue
author: liubin author: liubin
@ -49,8 +56,8 @@ export default {
.container-icon { .container-icon {
// width: 32px; // width: 32px;
// height: 32px; // height: 32px;
width: 1.701vw; width: 1.4vw;
height: 1.701vw; height: 1.4vw;
background: #ccc2; background: #ccc2;
} }
</style> </style>

24
src/views/copilot/factoryData/components/leftContainer.vue
View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-06-05 09:36:07 * @Date: 2024-06-05 09:36:07
* @LastEditTime: 2024-06-05 09:38:23 * @LastEditTime: 2024-07-09 16:54:24
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -80,6 +80,7 @@ export default {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.copilot-container { .copilot-container {
height: 0; height: 0;
flex: 1; flex: 1;
@ -87,21 +88,23 @@ export default {
flex-direction: column; flex-direction: column;
position: relative; position: relative;
box-shadow: inset 0 0 20px 1px #fff1; box-shadow: inset 0 0 20px 1px #fff1;
border-left: 0.11415vw solid;
border-image: linear-gradient(to bottom, transparent 2%, rgba(5, 138, 237, .7) 20%, rgba(2, 82, 215, 0.24) 70%, ) 71 71;
backdrop-filter: blur(4px); backdrop-filter: blur(4px);
&::before { &::before {
content: ""; content: "";
position: absolute; position: absolute;
display: inline-block; display: inline-block;
height: 100%; height: 96%;
width: 0.11415vw; width: 0.11415vw;
border-radius: 2px; border-radius: 2px;
top: 0%; top: 0%;
left: 0; right: 0;
background: radial-gradient( background: radial-gradient(
circle at center, circle at center,
#024798 2%, #024798 2%,
#024798 30%, #024798 100%,
transparent transparent
); );
z-index: 1; z-index: 1;
@ -111,17 +114,12 @@ export default {
content: ""; content: "";
position: absolute; position: absolute;
display: inline-block; display: inline-block;
width: 60%; width: 80%;
height: 0.31415vh; height: 0.31415vh;
border-radius: 2px; border-radius: 2px;
left: 8%; right: 4%;
bottom: 0; bottom: 0;
background: radial-gradient( background: linear-gradient(to right, transparent 10%, #024798 95%, transparent 98%);
circle at center,
#024798 2%,
#024798 30%,
transparent
);
z-index: 0; z-index: 0;
} }
@ -134,7 +132,7 @@ export default {
gap: 8px; gap: 8px;
.container-title { .container-title {
font-size: 1.18vw; font-size: 1vw;
line-height: 1.39vw; line-height: 1.39vw;
font-weight: normal; font-weight: normal;
letter-spacing: 2px; letter-spacing: 2px;

23
src/views/copilot/factoryData/components/rightContainer.vue
View File

@ -33,7 +33,7 @@
<!-- content --> <!-- content -->
<div class="container-head" ref="container-head" <div class="container-head" ref="container-head"
:class="[side == 'left' ? 'gradient-to-right' : 'gradient-to-left']"> :class="[side == 'left' ? 'gradient-to-right' : 'gradient-to-left']">
<Icon :icon="icon"></Icon> <Icon style="margin-left: 16px;" :icon="icon"></Icon>
<h2 class="container-title">{{ title }}</h2> <h2 class="container-title">{{ title }}</h2>
</div> </div>
<div class="container-body" :class="[ <div class="container-body" :class="[
@ -78,6 +78,7 @@ export default {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.copilot-container { .copilot-container {
height: 100%; height: 100%;
flex: 1; flex: 1;
@ -85,22 +86,22 @@ export default {
flex-direction: column; flex-direction: column;
position: relative; position: relative;
box-shadow: inset 0 0 20px 1px #fff1; box-shadow: inset 0 0 20px 1px #fff1;
border-right: 0.11415vw solid;
border-image: linear-gradient(to bottom,transparent 0%,rgba(5, 138, 237, .7) 40%, rgba(2, 82, 215, 0.24) 70%,) 71 71;
backdrop-filter: blur(4px); backdrop-filter: blur(4px);
&::before { &::before {
content: ""; content: "";
position: absolute; position: absolute;
display: inline-block; display: inline-block;
height: 100%; height: 96%;
width: 0.11415vw; width: 0.11415vw;
border-radius: 2px; border-radius: 2px;
top: 0%; top: 0%;
left: 0; left: 0;
background: radial-gradient( background: radial-gradient(circle at center,
circle at center,
#024798 2%, #024798 2%,
#024798 30%, #024798 100%,
transparent transparent);
);
z-index: 1; z-index: 1;
} }
@ -108,12 +109,12 @@ export default {
content: ""; content: "";
position: absolute; position: absolute;
display: inline-block; display: inline-block;
width: 60%; width: 80%;
height: 0.31415vh; height: 0.31415vh;
border-radius: 2px; border-radius: 2px;
left: 8%; left: 3%;
bottom: 0; bottom: 0;
background: linear-gradient(to right, #024798, transparent); background: linear-gradient(to left, transparent 10%, #024798 95%, transparent 98%);
z-index: 0; z-index: 0;
} }
@ -126,7 +127,7 @@ export default {
gap: 8px; gap: 8px;
.container-title { .container-title {
font-size: 1.18vw; font-size: 1vw;
line-height: 1.39vw; line-height: 1.39vw;
font-weight: normal; font-weight: normal;
letter-spacing: 2px; letter-spacing: 2px;

15
src/views/copilot/yield/index.vue
View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-05-10 11:10:54 * @Date: 2024-05-10 11:10:54
* @LastEditTime: 2024-06-05 09:49:46 * @LastEditTime: 2024-07-09 15:09:27
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -20,12 +20,12 @@
</left-container> </left-container>
</section> </section>
<section class="bottom flex"> <section class="bottom flex">
<right-container class="fto-involve" title="FTO投入"> <bottom-right-container class="fto-involve" title="FTO投入">
<fto-invest :period="period" :than="than" /> <fto-invest :period="period" :than="than" />
</right-container> </bottom-right-container>
<left-container class="chip-involve" title="芯片投入" icon="chip"> <bottom-left-container class="chip-involve" title="芯片投入" icon="chip">
<chip-invest :period="period" :than="than" /> <chip-invest :period="period" :than="than" />
</left-container> </bottom-left-container>
</section> </section>
</div> </div>
</template> </template>
@ -34,7 +34,8 @@
import twoContainer from "@/views/copilot/components/twoContainer.vue"; import twoContainer from "@/views/copilot/components/twoContainer.vue";
import leftContainer from "@/views/copilot/components/leftContainer.vue"; import leftContainer from "@/views/copilot/components/leftContainer.vue";
import rightContainer from "@/views/copilot/components/rightContainer.vue"; import rightContainer from "@/views/copilot/components/rightContainer.vue";
import bottomRightContainer from "@/views/copilot/components/bottomRightContainer.vue";
import bottomLeftContainer from "@/views/copilot/components/bottomLeftContainer.vue";
import StdOutput from "./components/StdOutput.vue"; import StdOutput from "./components/StdOutput.vue";
import ChipOutput from "./components/ChipOutput.vue"; import ChipOutput from "./components/ChipOutput.vue";
import FtoInvest from "./components/FtoInvest.vue"; import FtoInvest from "./components/FtoInvest.vue";
@ -45,6 +46,8 @@ export default {
name: "YieldCopilot", name: "YieldCopilot",
components: { components: {
DbContainer: twoContainer, DbContainer: twoContainer,
bottomRightContainer,
bottomLeftContainer,
leftContainer, leftContainer,
rightContainer, rightContainer,
StdOutput, StdOutput,

2
src/views/dashboard/components/Container.vue
View File

@ -112,7 +112,7 @@ export default {
gap: 8px; gap: 8px;
.container-title { .container-title {
font-size: 1.18vw; font-size: 1vw;
line-height: 1.39vw; line-height: 1.39vw;
font-weight: normal; font-weight: normal;
letter-spacing: 2px; letter-spacing: 2px;

4
src/views/dashboard/components/ContainerIcon.vue
View File

@ -51,8 +51,8 @@ export default {
.container-icon { .container-icon {
// width: 32px; // width: 32px;
// height: 32px; // height: 32px;
width: 1.701vw; width: 1.4vw;
height: 1.701vw; height: 1.4vw;
background: #ccc2; background: #ccc2;
} }
</style> </style>

2
src/views/dashboard/components/Header.vue
View File

@ -153,7 +153,7 @@ h1 {
.side { .side {
position: absolute; position: absolute;
font-size: 1.18vw; font-size: 1vw;
// line-height: 24px; // line-height: 24px;
line-height: 1.277vw; line-height: 1.277vw;
letter-spacing: 2px; letter-spacing: 2px;

2
src/views/dashboard/components/leftContainer.vue
View File

@ -113,7 +113,7 @@ export default {
gap: 8px; gap: 8px;
.container-title { .container-title {
font-size: 1.18vw; font-size: 1vw;
line-height: 1.39vw; line-height: 1.39vw;
font-weight: normal; font-weight: normal;
letter-spacing: 2px; letter-spacing: 2px;

9
src/views/produce/data/index.vue
View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-04-15 10:49:13 * @Date: 2024-04-15 10:49:13
* @LastEditTime: 2024-07-08 14:38:25 * @LastEditTime: 2024-07-10 09:58:59
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -402,8 +402,10 @@ export default {
} }
// y轴数据 // y轴数据
arr.forEach(fac => { arr.forEach((fac,index) => {
console.log('fac',fac);
let i = 0 let i = 0
let position = fac.id == 1 ? [1, -16,] : [-8, -16,]
while ( i < 3) { while ( i < 3) {
// 下标 // 下标
const index1 = ['chipYield', 'componentYield', 'bipvProductOutput'][i] const index1 = ['chipYield', 'componentYield', 'bipvProductOutput'][i]
@ -422,6 +424,8 @@ export default {
label: { label: {
show: i === 2 ? true : false, show: i === 2 ? true : false,
position: 'top', position: 'top',
// fontSize:10,
position: position,
formatter(params) { formatter(params) {
return fac.name.substring(0, 2) return fac.name.substring(0, 2)
} }
@ -448,6 +452,7 @@ export default {
label: { label: {
show: true, show: true,
position: 'top', position: 'top',
position: position,
formatter(params) { formatter(params) {
if (params.value === 0) { if (params.value === 0) {
return '' return ''

7
src/views/produce/workOrder/dayReportComponents/dayReportExportChart/beProcessed.vue
View File

@ -1,10 +1,3 @@
<!--
* @Author: zhp
* @Date: 2024-07-08 14:51:47
* @LastEditTime: 2024-07-09 09:34:38
* @LastEditors: zhp
* @Description:
-->
<template> <template>
<div id="chipPowerExpChart" style="width:552px;height:200px;" /> <div id="chipPowerExpChart" style="width:552px;height:200px;" />
</template> </template>

5
src/views/produce/workOrder/dayReportComponents/dayReportExportChart/productYield.vue
View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-07-08 14:51:47 * @Date: 2024-07-08 14:51:47
* @LastEditTime: 2024-07-09 09:58:43 * @LastEditTime: 2024-07-09 11:07:47
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -66,7 +66,8 @@ export default {
}, },
legend: { legend: {
bottom: 0, bottom: 0,
left: 'center' left: 'center',
itemGap:40,
}, },
series: [ series: [
{ {

18
src/views/produce/workOrder/index.vue
View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-04-15 10:49:13 * @Date: 2024-04-15 10:49:13
* @LastEditTime: 2024-07-09 10:17:41 * @LastEditTime: 2024-07-09 11:08:43
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -338,7 +338,7 @@ export default {
} }
}) })
}, },
async otherMethods(val) { otherMethods(val) {
console.log(val) console.log(val)
if (val.type === 'detail') { if (val.type === 'detail') {
this.detailOrUpdateVisible = true; this.detailOrUpdateVisible = true;
@ -347,9 +347,15 @@ export default {
this.$refs.detailOrUpdate.init(val.data.id); this.$refs.detailOrUpdate.init(val.data.id);
}); });
} else { } else {
const res = await getWorkOrderDetail(val.data.id) getWorkOrderDetail(val.data.id).then((res) => {
if (res.code === 0) { if (res.code === 0) {
// this.loading = false // this.loading = false
const xAxisList = Object.keys(res.data.inProcessDis)
const yAxisList = Object.values(res.data.inProcessDis)
this.beProcessObj.xAxisList = xAxisList
this.beProcessObj.yAxisList = yAxisList
// console.log(this.beProcessObj)
; const data = res.data.prodWorkOrderDO ; const data = res.data.prodWorkOrderDO
const barList = [data.targetProduction, data.plannedInvestment, data.actualInvestment, data.actualProduction, data.wasteNum, data.reworkNum] const barList = [data.targetProduction, data.plannedInvestment, data.actualInvestment, data.actualProduction, data.wasteNum, data.reworkNum]
const seriesList = [] const seriesList = []
@ -360,10 +366,6 @@ export default {
}) })
this.hisObj.seriesList = seriesList this.hisObj.seriesList = seriesList
this.hisObj.dateList = dateList this.hisObj.dateList = dateList
const xAxisList = Object.keys(res.data.inProcessDis)
const yAxisList = Object.values(res.data.inProcessDis)
this.beProcessObj.xAxisList = xAxisList
this.beProcessObj.yAxisList = yAxisList
this.produceData = barList this.produceData = barList
this.pieList = [ this.pieList = [
{ value: data.actualProduction ? data.actualProduction : 0, name: '实际产出' }, { value: data.actualProduction ? data.actualProduction : 0, name: '实际产出' },
@ -374,6 +376,8 @@ export default {
this.$nextTick(() => { this.$nextTick(() => {
this.exportPDF() this.exportPDF()
}) })
})
} }
}, },
async getDataList() { async getDataList() {

6
src/views/report/chipOEEBM/index.vue
View File

@ -187,19 +187,19 @@ export default {
{ {
prop: "yoy", prop: "yoy",
label: msg.yoyColumn, label: msg.yoyColumn,
filter: (val) => (val || val === 0 ? val : "-"), filter: (val) => (val || val === 0 ? parseFloat(val.toFixed(2)) : "-"),
minWidth: 150, minWidth: 150,
}, },
{ {
prop: "queryValue", prop: "queryValue",
label: msg.queryColumn, label: msg.queryColumn,
filter: (val) => (val || val === 0 ? val : "-"), filter: (val) => (val || val === 0 ? parseFloat(val.toFixed(2)) : "-"),
minWidth: 150, minWidth: 150,
}, },
{ {
prop: "target", prop: "target",
label: msg.targetColumn, label: msg.targetColumn,
filter: (val) => (val || val === 0 ? val : "-"), filter: (val) => (val || val === 0 ? parseFloat(val.toFixed(2)) : "-"),
minWidth: 150, minWidth: 150,
}, },
]; ];

9
src/views/report/completionStatusIntrBM/index.vue
View File

@ -222,6 +222,7 @@ export default {
}); });
}, },
setChartMsg(val) { setChartMsg(val) {
console.log(val);
let xData1 = []; let xData1 = [];
let xData2 = []; let xData2 = [];
let barData1 = []; let barData1 = [];
@ -231,12 +232,12 @@ export default {
for (let i = 0; i < val.length; i++) { for (let i = 0; i < val.length; i++) {
if (val[i].unit !== "㎡") { if (val[i].unit !== "㎡") {
xData1.push(val[i].item); xData1.push(val[i].item);
barData1.push(parseFloat(val[i].target.toFixed(2)) || 0); barData1.push(val[i].target ? parseFloat(val[i].target.toFixed(2)) : 0);
barData2.push(parseFloat(val[i].queryValue.toFixed(2)) || 0); barData2.push(val[i].queryValue ? parseFloat(val[i].queryValue.toFixed(2)) : 0);
} else { } else {
xData2.push(val[i].item); xData2.push(val[i].item);
barData3.push(parseFloat(val[i].target.toFixed(2)) || 0); barData3.push(val[i].target ? parseFloat(val[i].target.toFixed(2)) : 0);
barData4.push(parseFloat(val[i].queryValue.toFixed(2)) || 0); barData4.push(val[i].queryValue ? parseFloat(val[i].queryValue.toFixed(2)) : 0);
} }
} }
this.chartMsg1.xData = xData1; this.chartMsg1.xData = xData1;

4
src/views/report/components/produceLineBar.vue
View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-06-19 15:28:34 * @Date: 2024-06-19 15:28:34
* @LastEditTime: 2024-07-08 14:19:57 * @LastEditTime: 2024-07-09 16:14:37
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -238,7 +238,7 @@ export default {
text-align: right; text-align: right;
position: relative; position: relative;
// right: 30; // right: 30;
top: -10px; top: 0px;
.itemData { .itemData {
display: inline-block; display: inline-block;
margin-right: 10px; margin-right: 10px;

4
src/views/report/components/produceLineBarTarget.vue
View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-06-20 16:13:36 * @Date: 2024-06-20 16:13:36
* @LastEditTime: 2024-07-05 13:47:02 * @LastEditTime: 2024-07-09 16:15:10
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -237,7 +237,7 @@ export default {
position: relative; position: relative;
// right: 30; // right: 30;
// top: 10px; // top: 10px;
top: -10px; top: 0px;
.itemData { .itemData {
display: inline-block; display: inline-block;
margin-right: 10px; margin-right: 10px;

4
src/views/report/components/produceLineBarYearTarget.vue
View File

@ -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-05 13:48:12 * @LastEditTime: 2024-07-09 16:14:43
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -215,7 +215,7 @@ export default {
text-align: right; text-align: right;
position: relative; position: relative;
// right: 30; // right: 30;
top: -10px; top: 0px;
// top: -10px; // top: -10px;
.itemData { .itemData {
display: inline-block; display: inline-block;

277
src/views/report/components/produceLineYieldBar.vue Normal file
View File

@ -0,0 +1,277 @@
<!--
* @Author: zhp
* @Date: 2024-07-09 16:06:13
* @LastEditTime: 2024-07-09 16:14:54
* @LastEditors: zhp
* @Description:
-->
<!--
* @Author: zhp
* @Date: 2024-06-19 15:28:34
* @LastEditTime: 2024-07-08 14:19:57
* @LastEditors: zhp
* @Description:
-->
<template>
<div>
<!-- 暂无数据 -->
<div class="no-data-bg" style="position: relative; left: 50%; transform: translateX(-50%)"
v-show="this.chartMsg.series[0].data.length === 0"></div>
<!-- 图例 -->
<div v-show="this.chartMsg.series[0].data.length > 0 ">
<div class="legendData" v-if="show">
<span class="itemData" v-for="item in legendList" :key="item.id">
<span v-if="item.type === 1" class="block" :style="{ backgroundColor: item.color }"></span>
<span v-if="item.type === 2" class="line" :style="{ backgroundColor: item.color }">
<span class="line-block" :style="{ backgroundColor: item.color }"></span>
</span>
{{ item.name }}</span>
</div>
<div :id="chartId" :style="{ width: '100%', height: chartHeight + 'px' }"></div>
</div>
</div>
</template>
<script>
import * as echarts from "echarts";
import { debounce } from "@/utils/debounce";
export default {
name: "bmLineBar",
data() {
return {
myChart: "",
option: {
color: [],
// color: ["#8EF0AB", "#63BDFF", "#288AFF"],
grid: {
left: 30,
right: 50,
bottom: 30,
top: 30,
containLabel:true,
},
tooltip: {
trigger: "axis",
axisPointer: {
// type: "cross",
crossStyle: {
color: "rgba(237,237,237,0.5)",
},
},
formatter: function (params) {
console.log('params', params)
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++) {
res +=
"<br/>" +
`${params[i].seriesType === "line"
? '<img width="11" height="11" style="margin-right:4px;" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMTIuNzIxNjM5NXB4IiBoZWlnaHQ9IjhweCIgdmlld0JveD0iMCAwIDEyLjcyMTYzOTUgOCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDx0aXRsZT7nvJbnu4QgNjwvdGl0bGU+CiAgICA8ZyBpZD0iMDTmiqXooajnrqHnkIYiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSLmjIfmoIflrozmiJDmg4XlhrUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMDUxLjYzOTE4MCwgLTQyNS4wMDAwMDApIj4KICAgICAgICAgICAgPGcgaWQ9Iue8lue7hC025aSH5Lu9LTQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEwMjEuNTAwMDAwLCAzNDQuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0i57yW57uELTYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI5LjUwMDAwMCwgNzguMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgPHJlY3QgaWQ9IuefqeW9oiIgeD0iMCIgeT0iMCIgd2lkdGg9IjE0IiBoZWlnaHQ9IjE0Ij48L3JlY3Q+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTcuMTM5MTgwMjYsMyBDOS4wMDMxMDczNywzIDEwLjU2OTI2NzMsNC4yNzQ4OTI3MiAxMS4wMTMyMjU0LDYuMDAwMjQzNDcgTDEyLjM2MDgxOTcsNiBDMTIuOTEzMTA0NSw2IDEzLjM2MDgxOTcsNi40NDc3MTUyNSAxMy4zNjA4MTk3LDcgQzEzLjM2MDgxOTcsNy41NTIyODQ3NSAxMi45MTMxMDQ1LDggMTIuMzYwODE5Nyw4IEwxMS4wMTI5NjY3LDguMDAwNzYxMzQgQzEwLjU2ODY1OTIsOS43MjU2MDIyNCA5LjAwMjc0NTUxLDExIDcuMTM5MTgwMjYsMTEgQzUuMjc1NjE1MDEsMTEgMy43MDk3MDEzMSw5LjcyNTYwMjI0IDMuMjY1MzkzNzgsOC4wMDA3NjEzNCBMMS42MzkxODAyNiw4IEMxLjA4Njg5NTUxLDggMC42MzkxODAyNTgsNy41NTIyODQ3NSAwLjYzOTE4MDI1OCw3IEMwLjYzOTE4MDI1OCw2LjQ0NzcxNTI1IDEuMDg2ODk1NTEsNiAxLjYzOTE4MDI2LDYgTDMuMjY1MTM1MDksNi4wMDAyNDM0NyBDMy43MDkwOTMyLDQuMjc0ODkyNzIgNS4yNzUyNTMxNSwzIDcuMTM5MTgwMjYsMyBaIiBpZD0i5b2i54q257uT5ZCIIiBmaWxsPSIjRkZDRTZBIiBmaWxsLXJ1bGU9Im5vbnplcm8iPjwvcGF0aD4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+" />'
: `<span style="display:inline-block;margin-right:4px;border-radius:2px;width:10px;height:10px;background-color:${params[i].color}"></span>`
}` +
`<span style='display:inline-block;width:150px;color:rgba(0,0,0,0.8);font-size:14px;'>${params[i].seriesName}</span>` +
`<span style='color:rgba(0,0,0,0.48);font-size:14px;'>${params[i].seriesName === "综合良率"
? (params[i].value ? params[i].value.toFixed(2) : 0.0) + "%"
: params[i].seriesName === "转化效率"
? (params[i].value ? params[i].value.toFixed(2) : 0.0) + "%"
: params[i].seriesName.search('总功率') != -1
? (params[i].value ? parseFloat(params[i].value.toFixed(2)) : 0) + "MW"
: params[i].seriesName.search('BIPV') != -1
? (params[i].value ? parseFloat(params[i].value.toFixed(2)) : 0) + "㎡" : (params[i].value ? params[i].value : 0) + "片"
}</span>`;
}
return res;
},
},
xAxis: {
type: "category",
data: [],
axisTick: {
show: false,
},
axisPointer: {
type: "shadow",
},
},
dataZoom: [//滚动条
{
// 设置滚动条的隐藏与显示
show: true,
// 设置滚动条类型
type: "slider",
// 设置背景颜色
backgroundColor: "#F7F7F7",
// handleStyle: {
// color: '#D6D6D6'
// },
handleStyle: {
borderColor: '#EBEBEB',
color: '#EBEBEB'
},
moveHandleStyle: {
borderColor: '#EBEBEB',
color: '#EBEBEB'
},
emphasis: {
handleStyle: {
borderColor: '#D6D6D6',
color: '#D6D6D6'
},
moveHandleStyle: {
borderColor: '#D6D6D6',
color: '#D6D6D6'
}
},
// 设置选中范围的填充颜色
fillerColor: "#F7F7F7",
// 设置边框颜色
borderColor: "#F7F7F7",
// 是否显示detail，即拖拽时候显示详细数值信息
showDetail: false,
// 数据窗口范围的起始数值
startValue: 0,
// 数据窗口范围的结束数值（一页显示多少条数据）
endValue: 5,
// empty：当前数据窗口外的数据，被设置为空。
// 即不会影响其他轴的数据范围
filterMode: "empty",
// 设置滚动条宽度，相对于盒子宽度
width: "100%",
// 设置滚动条高度
height: 3,
// 设置滚动条显示位置
left: "center",
// 是否锁定选择区域（或叫做数据窗口）的大小
zoomLoxk: true,
// 控制手柄的尺寸
handleSize: 0,
// dataZoom-slider组件离容器下侧的距离
bottom: 14,
},
{
// 没有下面这块的话，只能拖动滚动条，
// 鼠标滚轮在区域内不能控制外部滚动条
type: "inside",
// 滚轮是否触发缩放
zoomOnMouseWheel: false,
// 鼠标滚轮触发滚动
moveOnMouseMove: true,
moveOnMouseWheel: true,
},
],
yAxis:undefined,
series: [],
},
};
},
props: {
chartHeight: {
type: Number,
default: 300,
},
type: {
type: Number,
default: 2,
},
show: {
type: Boolean,
default: true,
},
legendList: {
type: Array,
default: () => [],
},
chartMsg: {
type: Object,
default: () => {},
},
chartId: {
type: String,
default: "bmChart",
},
chartNum: {
type: Number,
default: 1,
},
},
watch: {
chartHeight: {
handler(newVal) {
this.chartHeight = newVal;
},
},
type() {
this.canvasReset();
},
chartNum(val) {
this.canvasReset();
},
chartMsg: {
handler(newVal) {
this.canvasReset();
},
deep: true,
},
},
mounted() {
this.canvasReset();
},
methods: {
canvasReset() {
debounce(() => {
this.getMes();
}, 500)();
},
getMes() {
console.log('222222', this.chartMsg.series);
if (this.myChart) {
this.myChart.dispose();
}
var chartDom = document.getElementById(this.chartId);
this.myChart = echarts.init(chartDom);
this.option.color = this.chartMsg.color;
this.option.xAxis.data = this.chartMsg.xData;
// this.option.yAxis.name = this.chartMsg.yName;
// this.option.yAxis.axisLabel = this.chartMsg.yAxisLabel;
this.option.series = this.chartMsg.series;
this.option.yAxis = this.chartMsg.yAxis;
this.myChart.setOption(this.option);
},
},
};
</script>
<style lang="scss" scoped>
.legendData {
text-align: right;
position: relative;
// right: 30;
top: 0px;
.itemData {
display: inline-block;
margin-right: 10px;
font-size: 14px;
color: #8c8c8c;
.block {
width: 10px;
height: 10px;
display: inline-block;
margin-right: 4px;
}
.line {
width: 10px;
height: 10px;
border-radius: 5px;
display: inline-block;
margin-right: 4px;
position: relative;
.line-block {
position: absolute;
width: 20px;
height: 2px;
left: -5px;
top: 4px;
}
}
}
}
</style>

4
src/views/report/components/produceLineYieldBarTarget.vue
View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-06-21 09:05:14 * @Date: 2024-06-21 09:05:14
* @LastEditTime: 2024-07-05 13:49:59 * @LastEditTime: 2024-07-09 16:15:04
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -227,7 +227,7 @@ export default {
.legendData { .legendData {
text-align: right; text-align: right;
position: relative; position: relative;
top: -10px; top: 0px;
// right: 30; // right: 30;
// top: 10px; // top: 10px;
.itemData { .itemData {

4
src/views/report/comprehensiveData.vue
View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-04-15 10:49:13 * @Date: 2024-04-15 10:49:13
* @LastEditTime: 2024-07-08 13:39:32 * @LastEditTime: 2024-07-09 16:16:14
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -344,7 +344,7 @@ export default {
}, },
async getDataList() { async getDataList() {
console.log(this.listQuery.type); console.log(this.listQuery.type);
if (this.listQuery.type == null) { if (this.listQuery.type == null || this.listQuery.type == '') {
return this.$message('请选择时间维度') return this.$message('请选择时间维度')
} }
if (!this.listQuery.startDate && !this.listQuery.endDate) { if (!this.listQuery.startDate && !this.listQuery.endDate) {

6
src/views/report/packageOEEBM/index.vue
View File

@ -187,19 +187,19 @@ export default {
{ {
prop: "yoy", prop: "yoy",
label: msg.yoyColumn, label: msg.yoyColumn,
filter: (val) => (val || val === 0 ? val : "-"), filter: (val) => (val || val === 0 ? parseFloat(val.toFixed(2)) : "-"),
minWidth: 150, minWidth: 150,
}, },
{ {
prop: "queryValue", prop: "queryValue",
label: msg.queryColumn, label: msg.queryColumn,
filter: (val) => (val || val === 0 ? val : "-"), filter: (val) => (val || val === 0 ? parseFloat(val.toFixed(2)) : "-"),
minWidth: 150, minWidth: 150,
}, },
{ {
prop: "target", prop: "target",
label: msg.targetColumn, label: msg.targetColumn,
filter: (val) => (val || val === 0 ? val : "-"), filter: (val) => (val || val === 0 ? parseFloat(val.toFixed(2)) : "-"),
minWidth: 150, minWidth: 150,
}, },
]; ];

8
src/views/report/produceConversion.vue
View File

@ -96,7 +96,7 @@
<script> <script>
import { getProduceTransData, exportProduceTransData } from '@/api/report'; import { getProduceTransData, exportProduceTransData } from '@/api/report';
import bmSearchBar from "./components/bmSearchBar"; import bmSearchBar from "./components/bmSearchBar";
import BmLineBar from "./components/produceLineBar.vue"; import BmLineBar from "./components/produceLineYieldBar.vue";
import produceLineBarYearTarget from "./components/produceLineYieldBarTarget.vue"; import produceLineBarYearTarget from "./components/produceLineYieldBarTarget.vue";
import ButtonNav from '@/components/ButtonNav' import ButtonNav from '@/components/ButtonNav'
@ -546,7 +546,7 @@ export default {
this.chartMsgYearTarget.series[0].data = [] this.chartMsgYearTarget.series[0].data = []
this.chartMsgYearTarget.series[1].data = [] this.chartMsgYearTarget.series[1].data = []
this.title = '' this.title = ''
if (this.listQuery.date == null) { if (this.listQuery.date == null || this.listQuery.date == '') {
return this.$message('请选择时间维度') return this.$message('请选择时间维度')
} }
if (!this.listQuery.beginTime && !this.listQuery.endTime) { if (!this.listQuery.beginTime && !this.listQuery.endTime) {
@ -583,7 +583,7 @@ export default {
this.chartMsg.xData.push(ele.reportTimep) this.chartMsg.xData.push(ele.reportTimep)
this.otherProps.push({ this.otherProps.push({
label: ele.reportTimep, label: ele.reportTimep,
filter: (val) => (val || val === 0 ? val : "-"), filter: (val) => (val || val === 0 ? parseFloat(val.toFixed(2)) : "-"),
prop: 'value' + i prop: 'value' + i
}) })
}) })
@ -779,7 +779,7 @@ export default {
height: calc((100vh - 170px)); height: calc((100vh - 170px));
background-color: #fff; background-color: #fff;
border-radius: 8px; border-radius: 8px;
padding: 16px; padding: 4px 16px 16px 16px;
} }
.blueTip::before { .blueTip::before {

5
src/views/report/productionSituationMW.vue
View File

@ -517,7 +517,7 @@ export default {
this.chartMsgYearTarget.series[0].data = [] this.chartMsgYearTarget.series[0].data = []
this.chartMsgYearTarget.series[1].data = [] this.chartMsgYearTarget.series[1].data = []
console.log(this.listQuery); console.log(this.listQuery);
if (this.listQuery.type == null) { if (this.listQuery.type == null || this.listQuery.type == '') {
return this.$message('请选择时间维度') return this.$message('请选择时间维度')
} }
if (!this.listQuery.startDate && !this.listQuery.endDate) { if (!this.listQuery.startDate && !this.listQuery.endDate) {
@ -959,6 +959,7 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.search { .search {
// height: calc((100px)); // height: calc((100px));
background-color: #fff; background-color: #fff;
@ -971,7 +972,7 @@ export default {
height: calc((100vh - 170px)); height: calc((100vh - 170px));
background-color: #fff; background-color: #fff;
border-radius: 8px; border-radius: 8px;
padding: 16px; padding: 4px 16px 16px 16px;
} }
.blueTip::before { .blueTip::before {

6
src/views/report/productionSituationTablets.vue
View File

@ -649,7 +649,7 @@ export default {
this.chartMsgYearTarget.series[3].data = [] this.chartMsgYearTarget.series[3].data = []
} }
// console.log(this.listQuery); // console.log(this.listQuery);
if (this.listQuery.type == null) { if (this.listQuery.type == null || this.listQuery.type == '') {
return this.$message('请选择时间维度') return this.$message('请选择时间维度')
} }
if (!this.listQuery.startDate && !this.listQuery.endDate) { if (!this.listQuery.startDate && !this.listQuery.endDate) {
@ -664,7 +664,7 @@ export default {
// this.chartMsg.xData.push(ele.titleValue.replace(/[^\d]/g, " ")) // this.chartMsg.xData.push(ele.titleValue.replace(/[^\d]/g, " "))
this.otherProps.push({ this.otherProps.push({
label: ele.titleValue, label: ele.titleValue,
filter: (val) => (val || val === 0 ? val : "-"), filter: (val) => (val || val === 0 ? parseFloat(val.toFixed(2)) : "-"),
prop: 'value' + i prop: 'value' + i
}) })
}) })
@ -1351,7 +1351,7 @@ export default {
height: calc((100vh - 170px)); height: calc((100vh - 170px));
background-color: #fff; background-color: #fff;
border-radius: 8px; border-radius: 8px;
padding: 16px; padding: 4px 16px 16px 16px;
} }
.blueTip::before { .blueTip::before {

8
src/views/report/productionYield.vue
View File

@ -96,7 +96,7 @@
<script> <script>
import { getProductionYieldSituationMWData, exportProductionYieldSituationMWData } from '@/api/report'; import { getProductionYieldSituationMWData, exportProductionYieldSituationMWData } from '@/api/report';
import bmSearchBar from "./components/bmSearchBar"; import bmSearchBar from "./components/bmSearchBar";
import BmLineBar from "./components/produceLineBar.vue"; import BmLineBar from "./components/produceLineYieldBar.vue";
import produceLineBarYearTarget from "./components/produceLineYieldBarTarget.vue"; import produceLineBarYearTarget from "./components/produceLineYieldBarTarget.vue";
import ButtonNav from '@/components/ButtonNav' import ButtonNav from '@/components/ButtonNav'
import moment from 'moment' import moment from 'moment'
@ -567,7 +567,7 @@ export default {
this.chartMsgYearTarget.xData = [] this.chartMsgYearTarget.xData = []
this.chartMsgYearTarget.series[0].data = [] this.chartMsgYearTarget.series[0].data = []
this.chartMsgYearTarget.series[1].data = [] this.chartMsgYearTarget.series[1].data = []
if (this.listQuery.type == null) { if (this.listQuery.type == null || this.listQuery.type == '') {
return this.$message('请选择时间维度') return this.$message('请选择时间维度')
} }
if (!this.listQuery.startDate && !this.listQuery.endDate) { if (!this.listQuery.startDate && !this.listQuery.endDate) {
@ -603,7 +603,7 @@ export default {
// this.chartMsg.xData.push(ele.titleValue) // this.chartMsg.xData.push(ele.titleValue)
this.otherProps.push({ this.otherProps.push({
label: ele.titleValue, label: ele.titleValue,
filter: (val) => (val || val === 0 ? val : "-"), filter: (val) => (val || val === 0 ? parseFloat(val.toFixed(2)) : "-"),
prop: 'value' + i prop: 'value' + i
}) })
}) })
@ -855,7 +855,7 @@ export default {
height: calc((100vh - 170px)); height: calc((100vh - 170px));
background-color: #fff; background-color: #fff;
border-radius: 8px; border-radius: 8px;
padding: 16px; padding: 4px 16px 16px 16px;
} }
.blueTip::before { .blueTip::before {