工厂驾驶舱样式

这个提交包含在:
朱菊兰 2024-05-09 18:35:12 +08:00
父节点 bfa8a73423
当前提交 3765db0611
共有 3 个文件被更改,包括 105 次插入52 次删除

查看文件

@ -9,19 +9,14 @@
>{{ item.label }}</span
>
</div>
<div
ref="chart"
style="width: 100%"
:style="{ height: vHeight + 'vh' }"
></div>
<div id="factoryEnergyChart" style="width: 100%; height: 100%"></div>
</div>
</template>
<script>
import chartMixin from "@/mixins/chart.js";
import { debounce } from "@/utils/debounce";
import * as echarts from "echarts";
export default {
name: "Energy",
mixins: [chartMixin],
props: {
vHeight: {
type: Number,
@ -44,6 +39,7 @@ export default {
return {
isFullscreen: false,
actualOptions: null,
chart: "",
options: {
color: ["#FFD160", "#2760FF", "#12FFF5"],
grid: {
@ -205,49 +201,67 @@ export default {
// this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12;
// this.initOptions(this.actualOptions);
// },
series(val) {
if (!val) {
this.initOptions(this.options);
return;
}
const actualOptions = JSON.parse(JSON.stringify(this.options));
actualOptions.series[0].data = val[0].data;
actualOptions.series[0].name = val[0].name;
actualOptions.series[1].data = val[1].data;
actualOptions.series[1].name = val[1].name;
actualOptions.series[2].data = val[2].data;
actualOptions.series[2].name = val[2].name;
this.actualOptions = actualOptions;
this.initOptions(actualOptions);
},
// series(val) {
// if (!val) {
// this.initOptions(this.options);
// return;
// }
// const actualOptions = JSON.parse(JSON.stringify(this.options));
// actualOptions.series[0].data = val[0].data;
// actualOptions.series[0].name = val[0].name;
// actualOptions.series[1].data = val[1].data;
// actualOptions.series[1].name = val[1].name;
// actualOptions.series[2].data = val[2].data;
// actualOptions.series[2].name = val[2].name;
// this.actualOptions = actualOptions;
// this.initOptions(actualOptions);
// },
},
mounted() {
console.log("00000000000000000000");
const actualOptions = JSON.parse(JSON.stringify(this.options));
actualOptions.series[0].data = this.series[0].data;
actualOptions.series[0].name = this.series[0].name;
actualOptions.series[1].data = this.series[1].data;
actualOptions.series[1].name = this.series[1].name;
actualOptions.series[2].data = this.series[2].data;
actualOptions.series[2].name = this.series[2].name;
this.actualOptions = actualOptions;
console.log(actualOptions);
console.log("1111111111");
this.initOptions(actualOptions);
// this.actualOptions = this.options;
// this.initOptions(this.options);
// if (screenfull.isEnabled) {
// screenfull.on("change", () => {
// this.isFullscreen = screenfull.isFullscreen;
// });
// }
this.canvasReset();
window.addEventListener("resize", this.canvasReset);
},
beforeDestroy() {
if (this.chart) {
this.chart.dispose();
}
},
destroyed() {
window.removeEventListener("resize", this.canvasReset);
},
methods: {
canvasReset() {
debounce(() => {
this.initChart();
}, 500)();
},
initChart() {
if (this.chart) {
this.chart.dispose();
}
this.chart = echarts.init(document.getElementById("factoryEnergyChart"));
const actualOptions = JSON.parse(JSON.stringify(this.options));
actualOptions.series[0].data = this.series[0].data;
actualOptions.series[0].name = this.series[0].name;
actualOptions.series[1].data = this.series[1].data;
actualOptions.series[1].name = this.series[1].name;
actualOptions.series[2].data = this.series[2].data;
actualOptions.series[2].name = this.series[2].name;
this.actualOptions = actualOptions;
this.chart.setOption(actualOptions);
},
},
};
</script>
<style scoped lang="scss">
.left-chart-base {
// position: relative;
height: 100%;
.legend {
position: absolute;

查看文件

@ -1,11 +1,17 @@
<template>
<dv-scroll-board :config="config" style="width: 100%; height: 100%" />
<dv-scroll-board
v-if="aa"
:config="config"
style="width: 100%; height: 100%"
/>
</template>
<script>
import { debounce } from "@/utils/debounce";
export default {
name: "Order",
data() {
return {
aa: true,
config: {
header: ["序号", "客户名称", "产品名称", "计划加工数量", "加工进度"],
headerBGC: "rgba(0, 106, 205, 0.22)",
@ -41,5 +47,20 @@ export default {
},
};
},
mounted() {
this.tableReset();
window.addEventListener("resize", this.tableReset);
},
methods: {
tableReset() {
this.aa = false;
debounce(() => {
this.initTable();
}, 500)();
},
initTable() {
this.aa = true;
},
},
};
</script>

查看文件

@ -1,15 +1,11 @@
<template>
<div
ref="chart"
style="width: 100%"
:style="{ height: vHeight + 'vh' }"
></div>
<div id="factoryStoreChart" style="width: 100%; height: 100%"></div>
</template>
<script>
import chartMixin from "@/mixins/chart.js";
import { debounce } from "@/utils/debounce";
import * as echarts from "echarts";
export default {
name: "Store",
mixins: [chartMixin],
props: {
vHeight: {
type: Number,
@ -28,6 +24,7 @@ export default {
return {
isFullscreen: false,
actualOptions: null,
chart: "",
options: {
grid: {
left: "3%",
@ -134,18 +131,39 @@ export default {
},
},
mounted() {
console.log("store");
const actualOptions = JSON.parse(JSON.stringify(this.options));
actualOptions.series[0].data = this.series[0].data;
actualOptions.series[0].name = this.series[0].name;
this.actualOptions = actualOptions;
this.initOptions(actualOptions);
// if (screenfull.isEnabled) {
// screenfull.on("change", () => {
// this.isFullscreen = screenfull.isFullscreen;
// });
// }
this.canvasReset();
window.addEventListener("resize", this.canvasReset);
},
beforeDestroy() {
if (this.chart) {
this.chart.dispose();
}
},
destroyed() {
window.removeEventListener("resize", this.canvasReset);
},
methods: {
canvasReset() {
debounce(() => {
this.initChart();
}, 500)();
},
initChart() {
if (this.chart) {
this.chart.dispose();
}
this.chart = echarts.init(document.getElementById("factoryStoreChart"));
const actualOptions = JSON.parse(JSON.stringify(this.options));
actualOptions.series[0].data = this.series[0].data;
actualOptions.series[0].name = this.series[0].name;
this.actualOptions = actualOptions;
this.chart.setOption(actualOptions);
},
},
};
</script>