{"ast":null,"code":"import { getEnvSensingList } from '@/api';\nexport default {\n  name: 'EnvSensing',\n  data() {\n    return {\n      list: [],\n      needScroll: false,\n      scrollTimer: null,\n      paused: false\n    };\n  },\n  async mounted() {\n    const res = await getEnvSensingList();\n    this.list = res.data.list;\n    this.$nextTick(() => this.checkScroll());\n  },\n  beforeDestroy() {\n    if (this.scrollTimer) cancelAnimationFrame(this.scrollTimer);\n  },\n  methods: {\n    checkScroll() {\n      const wrapper = this.$refs.listWrapper;\n      const inner = this.$refs.listInner;\n      if (!wrapper || !inner) return;\n      // 内容高度超过容器时开启无缝滚动\n      this.needScroll = inner.offsetHeight > wrapper.offsetHeight;\n      if (this.needScroll) {\n        this.$nextTick(() => this.startScroll());\n      }\n    },\n    startScroll() {\n      const wrapper = this.$refs.listWrapper;\n      const inner = this.$refs.listInner;\n      if (!wrapper || !inner) return;\n      const firstHeight = inner.offsetHeight;\n      let lastTime = 0;\n      const speed = 0.4; // px per frame (~24px/s at 60fps)\n\n      const step = timestamp => {\n        if (!this.paused) {\n          wrapper.scrollTop += speed;\n          // 当滚动到第一份内容末尾时，无缝回到顶部\n          if (wrapper.scrollTop >= firstHeight) {\n            wrapper.scrollTop -= firstHeight;\n          }\n        }\n        this.scrollTimer = requestAnimationFrame(step);\n      };\n      this.scrollTimer = requestAnimationFrame(step);\n    },\n    pauseScroll() {\n      this.paused = true;\n    },\n    resumeScroll() {\n      this.paused = false;\n    }\n  }\n};","map":{"version":3,"names":["getEnvSensingList","name","data","list","needScroll","scrollTimer","paused","mounted","res","$nextTick","checkScroll","beforeDestroy","cancelAnimationFrame","methods","wrapper","$refs","listWrapper","inner","listInner","offsetHeight","startScroll","firstHeight","lastTime","speed","step","timestamp","scrollTop","requestAnimationFrame","pauseScroll","resumeScroll"],"sources":["src/components/LabStats/EnvSensing.vue"],"sourcesContent":["<template>\n  <div class=\"panel-box env-sensing\">\n    <div class=\"panel-title\">实验环境安全智能感知</div>\n    <div class=\"panel-content\">\n      <div class=\"list-wrapper\" ref=\"listWrapper\" @mouseenter=\"pauseScroll\" @mouseleave=\"resumeScroll\">\n        <div ref=\"listInner\" class=\"list-inner\">\n          <div class=\"env-item\" v-for=\"item in list\" :key=\"'a'+item.id\">\n            <div class=\"env-header\">\n              <span class=\"env-lab\">{{ item.lab }}</span>\n              <span class=\"env-dept\">{{ item.dept }}</span>\n            </div>\n            <div class=\"env-data\">\n              <span class=\"data-tag normal\">温度:{{ item.temp }}°C</span>\n              <span class=\"data-tag normal\">湿度:{{ item.humidity }}%</span>\n              <span class=\"data-tag normal\">TVOC {{ item.tvoc }}mg/m³</span>\n              <span class=\"data-tag\" :class=\"item.co2.warn ? 'warn' : 'normal'\">\n                <template v-if=\"item.co2.warn\">△</template>CO₂ {{ item.co2.value }}ppm\n              </span>\n              <span class=\"data-tag\" :class=\"item.o2.warn ? 'warn' : 'normal'\">\n                <template v-if=\"item.o2.warn\">△</template>O₂ {{ item.o2.value }}%\n              </span>\n            </div>\n          </div>\n        </div>\n        <!-- 复制一份用于无缝滚动 -->\n        <div class=\"list-inner\" v-if=\"needScroll\">\n          <div class=\"env-item\" v-for=\"item in list\" :key=\"'b'+item.id\">\n            <div class=\"env-header\">\n              <span class=\"env-lab\">{{ item.lab }}</span>\n              <span class=\"env-dept\">{{ item.dept }}</span>\n            </div>\n            <div class=\"env-data\">\n              <span class=\"data-tag normal\">温度:{{ item.temp }}°C</span>\n              <span class=\"data-tag normal\">湿度:{{ item.humidity }}%</span>\n              <span class=\"data-tag normal\">TVOC {{ item.tvoc }}mg/m³</span>\n              <span class=\"data-tag\" :class=\"item.co2.warn ? 'warn' : 'normal'\">\n                <template v-if=\"item.co2.warn\">△</template>CO₂ {{ item.co2.value }}ppm\n              </span>\n              <span class=\"data-tag\" :class=\"item.o2.warn ? 'warn' : 'normal'\">\n                <template v-if=\"item.o2.warn\">△</template>O₂ {{ item.o2.value }}%\n              </span>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script>\nimport { getEnvSensingList } from '@/api'\n\nexport default {\n  name: 'EnvSensing',\n  data() {\n    return {\n      list: [],\n      needScroll: false,\n      scrollTimer: null,\n      paused: false\n    }\n  },\n  async mounted() {\n    const res = await getEnvSensingList()\n    this.list = res.data.list\n    this.$nextTick(() => this.checkScroll())\n  },\n  beforeDestroy() {\n    if (this.scrollTimer) cancelAnimationFrame(this.scrollTimer)\n  },\n  methods: {\n    checkScroll() {\n      const wrapper = this.$refs.listWrapper\n      const inner = this.$refs.listInner\n      if (!wrapper || !inner) return\n      // 内容高度超过容器时开启无缝滚动\n      this.needScroll = inner.offsetHeight > wrapper.offsetHeight\n      if (this.needScroll) {\n        this.$nextTick(() => this.startScroll())\n      }\n    },\n    startScroll() {\n      const wrapper = this.$refs.listWrapper\n      const inner = this.$refs.listInner\n      if (!wrapper || !inner) return\n      const firstHeight = inner.offsetHeight\n      let lastTime = 0\n      const speed = 0.4 // px per frame (~24px/s at 60fps)\n\n      const step = (timestamp) => {\n        if (!this.paused) {\n          wrapper.scrollTop += speed\n          // 当滚动到第一份内容末尾时，无缝回到顶部\n          if (wrapper.scrollTop >= firstHeight) {\n            wrapper.scrollTop -= firstHeight\n          }\n        }\n        this.scrollTimer = requestAnimationFrame(step)\n      }\n      this.scrollTimer = requestAnimationFrame(step)\n    },\n    pauseScroll() { this.paused = true },\n    resumeScroll() { this.paused = false }\n  }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.env-sensing {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n\n  .panel-content {\n    flex: 1;\n    overflow: hidden;\n    padding: 0;\n  }\n}\n\n.list-wrapper {\n  height: 100%;\n  overflow: hidden;\n  padding: 0 14px;\n}\n\n.env-item {\n  padding: 10px 0;\n  border-bottom: 1px solid rgba(26, 58, 106, 0.3);\n}\n\n.env-header {\n  display: flex;\n  align-items: baseline;\n  gap: 10px;\n  margin-bottom: 6px;\n}\n\n.env-lab {\n  font-size: 13px;\n  font-weight: bold;\n  color: #fff;\n}\n\n.env-dept {\n  font-size: 11px;\n  color: $text-muted;\n}\n\n.env-data {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 6px 10px;\n}\n\n.data-tag {\n  font-size: 12px;\n  color: $text-secondary;\n\n  &.normal {\n    background: rgba(15, 45, 77, 0.5);\n    border: 1px solid rgba(15, 45, 77, 0.8);\n    box-shadow: 0 0 4px rgba(15, 45, 77, 0.4);\n    border-radius: 3px;\n    padding: 1px 6px;\n  }\n\n  &.warn {\n    color: #f44336;\n    font-weight: bold;\n    background: rgba(244, 67, 54, 0.08);\n    border: 1px solid rgba(244, 67, 54, 0.35);\n    box-shadow: 0 0 6px rgba(244, 67, 54, 0.2);\n    border-radius: 3px;\n    padding: 1px 6px;\n  }\n}\n</style>\n"],"mappings":"AAkDA,SAAAA,iBAAA;AAEA;EACAC,IAAA;EACAC,KAAA;IACA;MACAC,IAAA;MACAC,UAAA;MACAC,WAAA;MACAC,MAAA;IACA;EACA;EACA,MAAAC,QAAA;IACA,MAAAC,GAAA,SAAAR,iBAAA;IACA,KAAAG,IAAA,GAAAK,GAAA,CAAAN,IAAA,CAAAC,IAAA;IACA,KAAAM,SAAA,YAAAC,WAAA;EACA;EACAC,cAAA;IACA,SAAAN,WAAA,EAAAO,oBAAA,MAAAP,WAAA;EACA;EACAQ,OAAA;IACAH,YAAA;MACA,MAAAI,OAAA,QAAAC,KAAA,CAAAC,WAAA;MACA,MAAAC,KAAA,QAAAF,KAAA,CAAAG,SAAA;MACA,KAAAJ,OAAA,KAAAG,KAAA;MACA;MACA,KAAAb,UAAA,GAAAa,KAAA,CAAAE,YAAA,GAAAL,OAAA,CAAAK,YAAA;MACA,SAAAf,UAAA;QACA,KAAAK,SAAA,YAAAW,WAAA;MACA;IACA;IACAA,YAAA;MACA,MAAAN,OAAA,QAAAC,KAAA,CAAAC,WAAA;MACA,MAAAC,KAAA,QAAAF,KAAA,CAAAG,SAAA;MACA,KAAAJ,OAAA,KAAAG,KAAA;MACA,MAAAI,WAAA,GAAAJ,KAAA,CAAAE,YAAA;MACA,IAAAG,QAAA;MACA,MAAAC,KAAA;;MAEA,MAAAC,IAAA,GAAAC,SAAA;QACA,UAAAnB,MAAA;UACAQ,OAAA,CAAAY,SAAA,IAAAH,KAAA;UACA;UACA,IAAAT,OAAA,CAAAY,SAAA,IAAAL,WAAA;YACAP,OAAA,CAAAY,SAAA,IAAAL,WAAA;UACA;QACA;QACA,KAAAhB,WAAA,GAAAsB,qBAAA,CAAAH,IAAA;MACA;MACA,KAAAnB,WAAA,GAAAsB,qBAAA,CAAAH,IAAA;IACA;IACAI,YAAA;MAAA,KAAAtB,MAAA;IAAA;IACAuB,aAAA;MAAA,KAAAvB,MAAA;IAAA;EACA;AACA","ignoreList":[]},"metadata":{},"sourceType":"module","externalDependencies":[]}