projects/mescc/zjl #31
4
.env.dev
4
.env.dev
@ -1,8 +1,8 @@
|
||||
###
|
||||
# @Author: zhp
|
||||
# @Date: 2024-04-28 13:42:51
|
||||
# @LastEditTime: 2024-06-03 08:50:41
|
||||
# @LastEditors: DY
|
||||
# @LastEditTime: 2024-06-03 15:41:29
|
||||
# @LastEditors: zhp
|
||||
# @Description:
|
||||
###
|
||||
# 开发环境配置
|
||||
|
@ -4,16 +4,16 @@ function __resizeHandler(entries) {
|
||||
console.log(entries)
|
||||
for (const entry of entries) {
|
||||
if (entry.contentBoxSize) {
|
||||
// const contentBoxSize = Array.isArray(entry.contentBoxSize)
|
||||
// ? entry.contentBoxSize[0]
|
||||
// : entry.contentBoxSize;
|
||||
// this.chart_mixin_chartInstance.resize({
|
||||
// width:
|
||||
// contentBoxSize.inlineSize < this.MIN_WIDTH
|
||||
// ? this.MIN_WIDTH
|
||||
// : contentBoxSize.inlineSize,
|
||||
// height: contentBoxSize.blockSize,
|
||||
// });
|
||||
const contentBoxSize = Array.isArray(entry.contentBoxSize)
|
||||
? entry.contentBoxSize[0]
|
||||
: entry.contentBoxSize;
|
||||
this.chart_mixin_chartInstance.resize({
|
||||
width:
|
||||
contentBoxSize.inlineSize < this.MIN_WIDTH
|
||||
? this.MIN_WIDTH
|
||||
: contentBoxSize.inlineSize,
|
||||
height: contentBoxSize.blockSize,
|
||||
});
|
||||
} else {
|
||||
// manipulate contentRect
|
||||
this.chart_mixin_chartInstance.resize({
|
||||
|
@ -1,14 +1,14 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2024-05-07 10:25:10
|
||||
* @LastEditTime: 2024-05-31 16:38:29
|
||||
* @LastEditTime: 2024-06-03 16:40:45
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
|
||||
<template>
|
||||
<!-- <div class="order"> -->
|
||||
<div class="std-rate" style="width: 100%; overflow: hidden scroll; height: 400px">
|
||||
<div class="std-rate" style="width: 100%">
|
||||
<!-- <div class="span-2">
|
||||
<StdRateItem :period="period" :city="cities[5]" />
|
||||
</div> -->
|
||||
@ -106,12 +106,12 @@ export default {
|
||||
<style scoped lang="scss">
|
||||
.std-rate {
|
||||
display: flex;
|
||||
// gap: 1px;
|
||||
gap: 16px;
|
||||
// flex: 1 1 auto;
|
||||
|
||||
flex-direction: column;
|
||||
// display: -webkit-box;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
// flex-wrap: wrap;
|
||||
// align-items: center;
|
||||
// grid-template-columns: repeat(2, 1fr);
|
||||
// grid-template-rows: repeat(4, 1fr);
|
||||
}
|
||||
@ -120,10 +120,10 @@ export default {
|
||||
}
|
||||
.flex-item{
|
||||
// flex: 1 1 auto;
|
||||
width: 50%;
|
||||
// width: 50%;
|
||||
}
|
||||
.span-2 {
|
||||
// flex: 1 1 auto;
|
||||
flex-basis: 100%;
|
||||
flex: 1 1 auto;
|
||||
// flex-basis: 100%;
|
||||
}
|
||||
</style>
|
||||
|
@ -1,7 +1,7 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2024-05-07 13:22:43
|
||||
* @LastEditTime: 2024-05-31 15:55:00
|
||||
* @LastEditTime: 2024-06-03 16:13:52
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
@ -11,7 +11,7 @@
|
||||
<span v-for="(item,index) in legend" :key="index" class="legend-item"
|
||||
:style="{ fontSize: isFullscreen ? '0.58vw' : '0.54vw' }">{{ item.label }}</span>
|
||||
</div>
|
||||
<div ref="oeeChart" style="height:100%;width:100%"></div>
|
||||
<div ref="oeeChart" style="height:94%;width:100%"></div>
|
||||
</chart-container>
|
||||
</template>
|
||||
|
||||
@ -22,7 +22,7 @@ import ChartContainer from "../../../../components/ChartContainer.vue";
|
||||
import { debounce } from "@/utils/debounce";
|
||||
import * as echarts from "echarts";
|
||||
export default {
|
||||
name: "BarChartBase",
|
||||
name: "barChartBaseoee",
|
||||
components: {
|
||||
ChartContainer,
|
||||
},
|
||||
@ -220,30 +220,30 @@ export default {
|
||||
this.canvasReset()
|
||||
},
|
||||
/** 全屏状态切换时,对柱子粗细和字体大小进行相应调整 */
|
||||
// isFullscreen(val) {
|
||||
// this.actualOptions.series.map((item) => {
|
||||
// item.barWidth = val ? 18 : 12;
|
||||
// });
|
||||
// this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12;
|
||||
// this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12;
|
||||
// this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12;
|
||||
// // if (val === false && this.isOpen === true) {
|
||||
// // console.log(val)
|
||||
// // this.width = 97 + '%'
|
||||
// // this.canvasReset()
|
||||
// // } else if (val === false && this.isOpen === false) {
|
||||
// // this.width = 100 + '%'
|
||||
// // this.canvasReset()
|
||||
// // }
|
||||
// // this.actualOptions.series.map((item) => {
|
||||
// // item.barWidth = val ? 18 : 12;
|
||||
// // });
|
||||
// // this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12;
|
||||
// // this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12;
|
||||
// // this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12;
|
||||
// this.initChart(this.actualOptions)
|
||||
// this.canvasReset()
|
||||
// },
|
||||
isFullscreen(val) {
|
||||
// this.actualOptions.series.map((item) => {
|
||||
// item.barWidth = val ? 18 : 12;
|
||||
// });
|
||||
// this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12;
|
||||
// this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12;
|
||||
// this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12;
|
||||
// if (val === false && this.isOpen === true) {
|
||||
// console.log(val)
|
||||
// this.width = 97 + '%'
|
||||
// this.canvasReset()
|
||||
// } else if (val === false && this.isOpen === false) {
|
||||
// this.width = 100 + '%'
|
||||
// this.canvasReset()
|
||||
// }
|
||||
// this.actualOptions.series.map((item) => {
|
||||
// item.barWidth = val ? 18 : 12;
|
||||
// });
|
||||
// this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12;
|
||||
// this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12;
|
||||
// this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12;
|
||||
this.initChart(this.actualOptions)
|
||||
this.canvasReset()
|
||||
},
|
||||
series(val) {
|
||||
if (!val) {
|
||||
this.initChart(this.options);
|
||||
@ -268,11 +268,11 @@ export default {
|
||||
// this.isFullscreen = screenfull.isFullscreen;
|
||||
// });
|
||||
// }
|
||||
// if (screenfull.isEnabled) {
|
||||
// screenfull.on("change", () => {
|
||||
// this.isFullscreen = screenfull.isFullscreen;
|
||||
// });
|
||||
// }
|
||||
if (screenfull.isEnabled) {
|
||||
screenfull.on("change", () => {
|
||||
this.isFullscreen = screenfull.isFullscreen;
|
||||
});
|
||||
}
|
||||
this.actualOptions = this.options
|
||||
this.canvasReset();
|
||||
window.addEventListener("resize", this.canvasReset);
|
||||
|
@ -1,7 +1,7 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2024-05-23 15:50:44
|
||||
* @LastEditTime: 2024-05-31 15:54:41
|
||||
* @LastEditTime: 2024-06-03 16:14:03
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
@ -11,7 +11,7 @@
|
||||
<span v-for="(item,index) in legend" :key="index" class="legend-item"
|
||||
:style="{ fontSize: isFullscreen ? '0.58vw' : '0.54vw' }">{{ item.label }}</span>
|
||||
</div>
|
||||
<div ref="oeeChart" style="height:100%;width:100%"></div>
|
||||
<div ref="oeeChart" style="height:94%;width:100%"></div>
|
||||
</chart-container>
|
||||
</template>
|
||||
|
||||
@ -22,7 +22,7 @@ import ChartContainer from "../../../../components/ChartContainer.vue";
|
||||
import { debounce } from "@/utils/debounce";
|
||||
import * as echarts from "echarts";
|
||||
export default {
|
||||
name: "BarChartBase",
|
||||
name: "barChartBaseoee",
|
||||
components: {
|
||||
ChartContainer,
|
||||
},
|
||||
@ -221,12 +221,12 @@ export default {
|
||||
},
|
||||
/** 全屏状态切换时,对柱子粗细和字体大小进行相应调整 */
|
||||
isFullscreen(val) {
|
||||
this.actualOptions.series.map((item) => {
|
||||
item.barWidth = val ? 18 : 12;
|
||||
});
|
||||
this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12;
|
||||
this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12;
|
||||
this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12;
|
||||
// this.actualOptions.series.map((item) => {
|
||||
// item.barWidth = val ? 18 : 12;
|
||||
// });
|
||||
// this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12;
|
||||
// this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12;
|
||||
// this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12;
|
||||
// if (val === false && this.isOpen === true) {
|
||||
// console.log(val)
|
||||
// this.width = 97 + '%'
|
||||
@ -241,8 +241,8 @@ export default {
|
||||
// this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12;
|
||||
// this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12;
|
||||
// this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12;
|
||||
// this.initChart(this.actualOptions)
|
||||
// this.canvasReset()
|
||||
this.initChart(this.actualOptions)
|
||||
this.canvasReset()
|
||||
},
|
||||
series(val) {
|
||||
if (!val) {
|
||||
@ -267,11 +267,11 @@ export default {
|
||||
// this.isFullscreen = screenfull.isFullscreen;
|
||||
// });
|
||||
// }
|
||||
// if (screenfull.isEnabled) {
|
||||
// screenfull.on("change", () => {
|
||||
// this.isFullscreen = screenfull.isFullscreen;
|
||||
// });
|
||||
// }
|
||||
if (screenfull.isEnabled) {
|
||||
screenfull.on("change", () => {
|
||||
this.isFullscreen = screenfull.isFullscreen;
|
||||
});
|
||||
}
|
||||
this.actualOptions = this.options
|
||||
this.canvasReset();
|
||||
window.addEventListener("resize", this.canvasReset);
|
||||
|
@ -270,7 +270,7 @@ export default {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
// justify-content: center;
|
||||
gap: 3px;
|
||||
backdrop-filter: blur(24px);
|
||||
.cities {
|
||||
@ -283,6 +283,7 @@ export default {
|
||||
flex: 1 1 auto;
|
||||
padding: 0 15%;
|
||||
/* margin: 10%; */
|
||||
height: 16vh;
|
||||
/* min-width: 300px; */
|
||||
align-self: stretch;
|
||||
}
|
||||
|
@ -1,25 +1,31 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2024-05-07 10:04:53
|
||||
* @LastEditTime: 2024-05-31 13:19:34
|
||||
* @LastEditTime: 2024-06-03 16:08:27
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
|
||||
<template>
|
||||
<div class="efficiency-copilot">
|
||||
<Container title="芯片良率" icon="chip2">
|
||||
<ChipRate :period="period" :than="than" />
|
||||
</Container>
|
||||
<Container title="标准组件良率" icon="std">
|
||||
<StdRate :period="period" :than="than" />
|
||||
</Container>
|
||||
<Container title="芯片OEE" icon="chip">
|
||||
<ChipOee :chipOeeRate="chipOeeRate" :period="period" :than="than" />
|
||||
</Container>
|
||||
<Container title="转化效率" icon="cube">
|
||||
<TransformRate :transformRate="transformRate" :period="period" :than="than" />
|
||||
</Container>
|
||||
<section class="top flex">
|
||||
<Container title="芯片良率" icon="chip2">
|
||||
<ChipRate :period="period" :than="than" />
|
||||
</Container>
|
||||
<Container title="标准组件良率" icon="std">
|
||||
<StdRate :period="period" :than="than" />
|
||||
</Container>
|
||||
</section>
|
||||
<section class="bottom flex">
|
||||
<Container title="芯片OEE" icon="chip">
|
||||
<ChipOee :chipOeeRate="chipOeeRate" :period="period" :than="than" />
|
||||
</Container>
|
||||
<Container title="转化效率" icon="cube">
|
||||
<TransformRate :transformRate="transformRate" :period="period" :than="than" />
|
||||
</Container>
|
||||
</section>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -31,7 +37,7 @@ import StdRateVue from "./components/StdRate.vue";
|
||||
import TransformRateVue from "./components/TransformRate.vue";
|
||||
|
||||
export default {
|
||||
name: "EfficiencyCopilot",
|
||||
name: "efficiencyCopilot",
|
||||
components: {
|
||||
Container,
|
||||
ChipOee: ChipOeeVue,
|
||||
@ -88,7 +94,30 @@ export default {
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
<style scoped>
|
||||
.efficiency-copilot {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.flex {
|
||||
display: flex;
|
||||
gap: 16px;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.top > div,
|
||||
.bottom > div {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<!-- <style scoped>
|
||||
|
||||
.efficiency-copilot {
|
||||
flex: 1;
|
||||
display: grid;
|
||||
@ -100,4 +129,4 @@ export default {
|
||||
.efficiency-copilot > div {
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
</style> -->
|
||||
|
@ -22,7 +22,7 @@ export default ({
|
||||
textAlign: "center",
|
||||
textStyle: {
|
||||
fontWeight: 600,
|
||||
fontSize: 32,
|
||||
fontSize: 26,
|
||||
color: "#fffd",
|
||||
},
|
||||
subtext: `\u2002${subtitle}\u2002`,
|
||||
|
@ -1,7 +1,7 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2024-05-20 16:04:18
|
||||
* @LastEditTime: 2024-05-31 13:16:26
|
||||
* @LastEditTime: 2024-06-03 15:45:58
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
@ -95,13 +95,14 @@ export default {
|
||||
</script>
|
||||
<style>
|
||||
|
||||
|
||||
.copilot-layout {
|
||||
padding: 16px;
|
||||
background: url(../../assets/images/copilot-bg.png) 0 0 / 100% 100% no-repeat;
|
||||
position: absolute;
|
||||
left: -16px;
|
||||
/* top: -8px; */
|
||||
height: calc(100% + 240px);
|
||||
height: calc(100% + 30px);
|
||||
width: calc(100% + 30px);
|
||||
z-index: 1001;
|
||||
color: #fff;
|
||||
@ -110,12 +111,12 @@ export default {
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.produce{
|
||||
/* .produce{
|
||||
height: calc(100% + 38px);
|
||||
}
|
||||
.other {
|
||||
} */
|
||||
/* .other { */
|
||||
/* height: calc(100% + 240px); */
|
||||
}
|
||||
/* } */
|
||||
.copilot-footer {
|
||||
/** position: absolute;
|
||||
bottom: 10px; **/
|
||||
|
@ -1,7 +1,7 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2024-05-20 13:32:59
|
||||
* @LastEditTime: 2024-05-31 15:05:20
|
||||
* @LastEditTime: 2024-06-03 16:26:24
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
@ -151,7 +151,7 @@ export default {
|
||||
];
|
||||
}
|
||||
let titleValue =
|
||||
vt[1] != null && vt[2] !== 0
|
||||
vt[1] != null && (vt[2] !== 0 && vt[2] !== undefined)
|
||||
? this.formatNumber((vt[1] / vt[2] * 100)) + '%'
|
||||
: (vt[1] != 0 && vt[1] != null) && vt[2] == 0
|
||||
? "100%" : '0%',
|
||||
|
@ -1,17 +1,10 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2024-05-30 16:00:50
|
||||
* @LastEditTime: 2024-05-31 16:15:51
|
||||
* @LastEditTime: 2024-06-03 16:26:03
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
<!--
|
||||
filename: DoubleRingWrapper.vue
|
||||
author: liubin
|
||||
date: 2024-04-17 09:55:12
|
||||
description:
|
||||
-->
|
||||
|
||||
<template>
|
||||
<div class="double-ring-wrapper">
|
||||
<template>
|
||||
|
@ -22,7 +22,7 @@ export default ({
|
||||
textAlign: "center",
|
||||
textStyle: {
|
||||
fontWeight: 600,
|
||||
fontSize: 32,
|
||||
fontSize: 20,
|
||||
color: "#fffd",
|
||||
},
|
||||
subtext: `\u2002${subtitle}\u2002`,
|
||||
@ -38,7 +38,7 @@ export default ({
|
||||
{
|
||||
type: "pie",
|
||||
name: "当前目标",
|
||||
radius: ["70%", "85%"],
|
||||
radius: ["80%", "90%"],
|
||||
center: ["45%", "52%"],
|
||||
emptyCircleStyle: {
|
||||
color: "#042c5f33",
|
||||
@ -47,7 +47,7 @@ export default ({
|
||||
// 数据 series
|
||||
{
|
||||
type: "pie",
|
||||
radius: ["70%", "85%"],
|
||||
radius: ["80%", "90%"],
|
||||
center: ["45%", "52%"],
|
||||
avoidLabelOvervlap: false,
|
||||
label: {
|
||||
@ -92,7 +92,7 @@ export default ({
|
||||
// 数据 series2 - 2023累计
|
||||
{
|
||||
type: "pie",
|
||||
radius: ["55%", "70%"],
|
||||
radius: ["70%", "80%"],
|
||||
center: ["45%", "52%"],
|
||||
avoidLabelOvervlap: false,
|
||||
label: {
|
||||
|
@ -1,16 +1,10 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2024-04-28 13:42:51
|
||||
* @LastEditTime: 2024-05-31 16:14:09
|
||||
* @LastEditTime: 2024-06-03 08:55:42
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
<!--
|
||||
filename: Bipv.vue
|
||||
author: liubin
|
||||
date: 2024-04-10 15:39:54
|
||||
description:
|
||||
-->
|
||||
|
||||
<template>
|
||||
<right-chart-base
|
||||
@ -31,7 +25,7 @@ export default {
|
||||
data() {
|
||||
const year = new Date().getFullYear();
|
||||
// 城市数组的顺序必须是固定的
|
||||
const cities = ["瑞昌", "邯郸",
|
||||
const cities = [ "邯郸",
|
||||
// "株洲", "佳木斯", "成都", "凯盛", "蚌埠"
|
||||
|
||||
];
|
||||
@ -80,15 +74,15 @@ export default {
|
||||
return [
|
||||
{
|
||||
name: `${new Date().getFullYear()}年目标值`,
|
||||
data: bipvOutput.target,
|
||||
data: bipvOutput.target.splice(0, 1),
|
||||
},
|
||||
{
|
||||
name: `${new Date().getFullYear() - 1}年`,
|
||||
data: bipvOutput.previous,
|
||||
data: bipvOutput.previous.splice(0, 1)
|
||||
},
|
||||
{
|
||||
name: `${new Date().getFullYear()}年`,
|
||||
data: bipvOutput.current,
|
||||
data: bipvOutput.current.splice(0, 1),
|
||||
},
|
||||
];
|
||||
},
|
||||
|
@ -111,18 +111,16 @@ export default {
|
||||
name: '', // this.series[0].name,
|
||||
type: "bar",
|
||||
barWidth: 12,
|
||||
label: {
|
||||
show: true, //开启显示
|
||||
position: 'top', //在上方显示
|
||||
textStyle: { //数值样式
|
||||
color: '#DFF1FE',
|
||||
fontSize: 16
|
||||
}
|
||||
},
|
||||
itemStyle: {
|
||||
borderRadius: [10, 10, 0, 0],
|
||||
normal: {
|
||||
label: {
|
||||
show: true, //开启显示
|
||||
position: 'top', //在上方显示
|
||||
textStyle: { //数值样式
|
||||
color: '#DFF1FE',
|
||||
fontSize: 16
|
||||
}
|
||||
}
|
||||
},
|
||||
color: {
|
||||
type: "linear",
|
||||
x: 0,
|
||||
@ -156,8 +154,19 @@ export default {
|
||||
name: '', // this.series[1].name,
|
||||
type: "bar",
|
||||
barWidth: 12,
|
||||
label: {
|
||||
show: true, //开启显示
|
||||
position: 'top', //在上方显示
|
||||
textStyle: { //数值样式
|
||||
color: '#DFF1FE',
|
||||
fontSize: 16
|
||||
}
|
||||
},
|
||||
itemStyle: {
|
||||
borderRadius: [10, 10, 0, 0],
|
||||
// normal: {
|
||||
|
||||
// },
|
||||
color: {
|
||||
type: "linear",
|
||||
x: 0,
|
||||
|
@ -3,8 +3,8 @@
|
||||
<div id="map-container">
|
||||
<!-- <div v-if="visible" class="cdLine"></div> -->
|
||||
<!-- <div v-if="visible" class="zzLine"></div> -->
|
||||
<div v-if="visible" class="rcLine"></div>
|
||||
<div v-if="visible" class="rcLineTwo"></div>
|
||||
<!-- <div v-if="visible" class="rcLine"></div> -->
|
||||
<!-- <div v-if="visible" class="rcLineTwo"></div> -->
|
||||
<div v-if="visible" class="hdLine"></div>
|
||||
<div v-if="visible" class="hdLineTwo"></div>
|
||||
<!-- <div v-if="visible" class="ksLine"></div> -->
|
||||
@ -39,12 +39,12 @@
|
||||
</div>
|
||||
</div>
|
||||
<company-info v-if="visible" :info="info" :position="rcHintPosition" />
|
||||
<ks-company-info v-if="visible" :info="ksInfo" :position="ksHintPosition" />
|
||||
<jms-company-info v-if="visible" :info="jmsInfo" :position="jmsHintPosition" />
|
||||
<!-- <ks-company-info v-if="visible" :info="ksInfo" :position="ksHintPosition" /> -->
|
||||
<!-- <jms-company-info v-if="visible" :info="jmsInfo" :position="jmsHintPosition" /> -->
|
||||
<hd-company-info v-if="visible" :info="hdInfo" :position="hdHintPosition" />
|
||||
<bb-company-info v-if="visible" :info="bbInfo" :position="bbHintPosition" />
|
||||
<cd-company-info v-if="visible" :info="cdInfo" :position="cdHintPosition" />
|
||||
<zz-company-info v-if="visible" :info="zzInfo" :position="zzHintPosition" />
|
||||
<!-- <bb-company-info v-if="visible" :info="bbInfo" :position="bbHintPosition" /> -->
|
||||
<!-- <cd-company-info v-if="visible" :info="cdInfo" :position="cdHintPosition" /> -->
|
||||
<!-- <zz-company-info v-if="visible" :info="zzInfo" :position="zzHintPosition" /> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -69,13 +69,17 @@ const LOCATIONS = [
|
||||
// 蚌埠2
|
||||
// { x: 61, y: 53, tx: 39, ty: 68, path: 'factoryData/ksIndex' },
|
||||
// 江西 瑞昌
|
||||
{ x: 60, y: 58, tx: 68, ty: 52, path: 'factoryData/factory-data' },
|
||||
{ x: 60, y: 58, tx: 68, ty: 52,lx:61,ly:61.5,ltx:68.8,lty:52, path: 'factoryData/factory-data' },
|
||||
// 湖南 株洲
|
||||
// { x: 56, y: 60, tx: 60, ty: 95, path: 'factoryData/zzIndex' },
|
||||
// 邯郸
|
||||
{ x: 58, y: 45, tx: 47, ty: 34, path: 'factoryData/hdIndex' },
|
||||
{ x: 58, y: 45, tx: 47, ty: 34, lx: 58.7, ly: 34, ltx: 53, lty: 34, path: 'factoryData/hdIndex' },
|
||||
];
|
||||
|
||||
// rcLine.style.left = `66.8%`;
|
||||
// rcLine.style.top = `52%`;
|
||||
// rcLineTwo.className = "rcLineTwo";
|
||||
// rcLineTwo.style.left = `58.7%`;
|
||||
// rcLineTwo.style.top = `34%`;
|
||||
export default {
|
||||
name: "Index",
|
||||
components: {
|
||||
@ -247,7 +251,17 @@ export default {
|
||||
// templateInfo.items[3].value = this.homeStore.stdOutput.current[5];
|
||||
// this.ksInfo = templateInfo;
|
||||
// }
|
||||
(position === LOCATIONS[0]) {
|
||||
(position === LOCATIONS[0]) {
|
||||
const rcLine = document.createElement("div");
|
||||
const rcLineTwo = document.createElement("div");
|
||||
rcLine.className = "rcLine";
|
||||
rcLine.style.left = `${position.lx}%`;
|
||||
rcLine.style.top = `${position.ly}%`;
|
||||
rcLineTwo.className = "rcLineTwo";
|
||||
rcLineTwo.style.left = `${position.ltx}%`;
|
||||
rcLineTwo.style.top = `${position.lty}%`;
|
||||
document.getElementById("map-container").appendChild(rcLine);
|
||||
document.getElementById("map-container").appendChild(rcLineTwo);
|
||||
this.rcHintPosition = position;
|
||||
templateInfo.companyName = "瑞昌中建材";
|
||||
templateInfo.items[0].value = this.homeStore.ftoInvest?.current[0];
|
||||
@ -264,6 +278,16 @@ export default {
|
||||
// templateInfo.items[3].value = this.homeStore.stdOutput.current[2];
|
||||
// this.zzInfo = templateInfo;
|
||||
} else if (position === LOCATIONS[1]) {
|
||||
const hdLine = document.createElement("div");
|
||||
const hdLineTwo = document.createElement("div");
|
||||
hdLine.className = "hdLine";
|
||||
hdLine.style.left = `${position.lx}%`;
|
||||
hdLine.style.top = `${position.ly}%`;
|
||||
hdLineTwo.className = "hdLineTwo";
|
||||
hdLineTwo.style.left = `${position.ltx}%`;
|
||||
hdLineTwo.style.top = `${position.lty}%`;
|
||||
document.getElementById("map-container").appendChild(hdLine);
|
||||
document.getElementById("map-container").appendChild(hdLineTwo);
|
||||
this.hdHintPosition = position;
|
||||
templateInfo.companyName = "邯郸中建材";
|
||||
templateInfo.items[0].value = this.homeStore.ftoInvest?.current[1];
|
||||
@ -350,22 +374,22 @@ export default {
|
||||
.rcLine {
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
left: 61%;
|
||||
width: 100px;
|
||||
top: 61.5%;
|
||||
/* left: 61%; */
|
||||
width: 7.9vw;
|
||||
/* top: 61.5%; */
|
||||
/* x: 60, y: 58, */
|
||||
height: 1px;
|
||||
height: 1px;
|
||||
border: 2px dashed #FFCF00;
|
||||
}
|
||||
|
||||
.rcLineTwo {
|
||||
position: absolute;
|
||||
left: 66.8%;
|
||||
/* left: 66.8%; */
|
||||
width: 1px;
|
||||
top: 52%;
|
||||
/* top: 52%; */
|
||||
display: inline-block;
|
||||
/* // x: 60, y: 58, */
|
||||
height: 90px;
|
||||
height: 5vw;
|
||||
border: 2px dashed #FFCF00;
|
||||
}
|
||||
|
||||
@ -376,13 +400,13 @@ export default {
|
||||
top: 34%;
|
||||
display: inline-block;
|
||||
/* // x: 60, y: 58, */
|
||||
height: 100px;
|
||||
height: 6vw;
|
||||
border: 2px dashed #FFCF00;
|
||||
}
|
||||
.hdLineTwo {
|
||||
position: absolute;
|
||||
left: 53%;
|
||||
width: 90px;
|
||||
width: 5vw;
|
||||
top: 34%;
|
||||
display: inline-block;
|
||||
/* // x: 60, y: 58, */
|
||||
|
Loading…
Reference in New Issue
Block a user