@@ -1,7 +1,7 @@ | |||
### | |||
# @Author: zhp | |||
# @Date: 2024-04-28 13:42:51 | |||
# @LastEditTime: 2024-06-03 09:21:15 | |||
# @LastEditTime: 2024-06-04 08:56:35 | |||
# @LastEditors: DY | |||
# @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, */ | |||