diff --git a/src/assets/1.png b/src/assets/1.png new file mode 100644 index 0000000..34705d8 Binary files /dev/null and b/src/assets/1.png differ diff --git a/src/assets/eq.png b/src/assets/eq.png index 34705d8..d18698e 100644 Binary files a/src/assets/eq.png and b/src/assets/eq.png differ diff --git a/src/components/charts/LineChart.vue b/src/components/charts/LineChart.vue index 55cf41e..ab5e61d 100644 --- a/src/components/charts/LineChart.vue +++ b/src/components/charts/LineChart.vue @@ -283,7 +283,7 @@ ul { align-items: center; height: adjust(28px); // background: #eeec; - overflow-x: hidden; + // overflow-x: hidden; white-space: pre-wrap; padding-bottom: adjust(2px); } diff --git a/src/components/isolate-area-1/Area.vue b/src/components/isolate-area-1/Area.vue index 75e415e..d9b11f3 100644 --- a/src/components/isolate-area-1/Area.vue +++ b/src/components/isolate-area-1/Area.vue @@ -15,40 +15,63 @@ import DragabbleContainer from "../layout/DragableContainer.vue"; import SmallBox2 from "../common/SmallBox2.vue"; import { mapState } from "vuex"; +let timeFun = null + export default { name: "IsolateArea--1", components: { DragabbleContainer, SmallBox2 }, data() { return { - // rdata: [ - // // { icon: "temp", title: "车间温度", value: "27℃" }, - // { icon: "fire", title: "当前火向", value: "南北" }, - // { icon: "clock", title: "换火时间", value: "12:21:39" }, - // { icon: "sand", title: "剩余时间", value: "6h" }, - // ], + rdata: [ + // { icon: "temp", title: "车间温度", value: "27℃" }, + { icon: "fire", title: "当前火向", value: "" }, + { icon: "clock", title: "换火时间", value: "20分" }, + { icon: "sand", title: "剩余时间", value: "0" }, + ], }; }, - computed: { - ...mapState(["fireDirection", "lastFireChangeTime", "fireChangeTime"]), - rdata() { - let [_, min, sec] = /(\d+)分(\d+)秒/.exec(this.lastFireChangeTime || '0分0秒') - min = +min - sec = +sec - let timer = setInterval(() => { - if (sec) sec -= 1 + watch: { + fireDirection: function(val) { + this.$set(this.rdata[0], 'value', val) + }, + fireChangeTime: function(val) { + this.$set(this.rdata[1], 'value', val) + }, + lastFireChangeTime: function(val) { + let [_, min, sec] = /(\d+)分(\d+)秒/.exec(val || '0分0秒') + if (timeFun) clearInterval(timeFun) + timeFun = setInterval(() => { + if (sec > 0) sec -= 1 else { sec = 59 min -= 1 } - }, 1000); - return [ - // { icon: "temp", title: "车间温度", value: "27℃" }, - { icon: "fire", title: "当前火向", value: this.fireDirection }, - { icon: "clock", title: "换火时间", value: this.fireChangeTime }, - { icon: "sand", title: "剩余时间", value: this.lastFireChangeTime }, - ]; + this.$set(this.rdata[2], 'value', `${min}分${sec}秒`) + }, 1000) }, }, + computed: { + ...mapState(["fireDirection", "lastFireChangeTime", "fireChangeTime"]), + // rdata() { + // let [_, min, sec] = /(\d+)分(\d+)秒/.exec(this.lastFireChangeTime) + // min = +min + // sec = +sec + // let interTime = `${min}分${sec}秒` + // let timer = setInterval(() => { + // if (sec) sec -= 1 + // else { + // sec = 59 + // min -= 1 + // } + // }, 1000); + // return [ + // // { icon: "temp", title: "车间温度", value: "27℃" }, + // { icon: "fire", title: "当前火向", value: this.fireDirection }, + // { icon: "clock", title: "换火时间", value: this.fireChangeTime }, + // { icon: "sand", title: "剩余时间", value: interTime }, + // ]; + // }, + }, }; diff --git a/src/components/layout/Main.vue b/src/components/layout/Main.vue index 5173980..4956fd3 100644 --- a/src/components/layout/Main.vue +++ b/src/components/layout/Main.vue @@ -3,7 +3,7 @@