1.看板新增自动刷新2小时一次

loulijun2021

2022-10-13 ecaf70a4e7d72ecc1c18302fef31b3baab8e6513

 src/views/kb/ckgl.vue

@@ -291,11 +291,12 @@
        <div class="kb_right kb_pd10">
          <div class="kb_right_top kb_pd10">
            <div class="kb_right_top_content">
              <div class="content_head kb_title_text" style="margin-top: 30px;">产品库存量排行Top5</div>
              <div class="content_head kb_title_text" style="margin-top: 30px;">半成品、产品库存量排行Top5</div>
              <div class="content_body" style="height:402px;">
                <div id="bar03" style="width: 100%;height:100%" />
              </div>
              <div class="content_head kb_title_text" style="margin-top: 12px">半成品库存量排行Top5</div>
              <!--              <div class="content_head kb_title_text" style="margin-top: 12px">半成品库存量排行Top5</div>-->
              <div class="content_head kb_title_text" style="margin-top: 12px">原材料库存量排行Top5</div>
              <div class="content_body">
                <div id="bar04" style="width: 100%;height:100%" />
              </div>
@@ -326,6 +327,8 @@
  },
  data() {
    return {
      onLine: navigator.onLine, // 监听网络是否在线

      headTime: '',
      tableDataTop: [],
      tableDataBottom: [],
@@ -334,21 +337,67 @@
      number2: '',

      MarqueeTipsContent: '', // 公告
      speed: 100// 公告播放的速度
      speed: 100, // 公告播放的速度

      tableTopTask: null,
      tableBottomTask: null,
      echartsRightTop: null,
      echartsRightBottom: null

    }
  },

  created() {
    setInterval(this.getNowTime, 1000)

    // 两小时看板刷新一次
    setInterval(() => {
      window.location.reload()
    }, 1000 * 60 * 120)
  },
  mounted() {
    this.getWareHouseTopLeftData()
    this.getWareHouseTopBottomData()
    this.getEcharts()

    this.getMarqueeTipsContent()
    window.addEventListener('online', this.updateOnlineStatus)
    window.addEventListener('offline', this.updateOnlineStatus)
    this.updateOnlineStatus({ type: this.onLine ? 'online' : 'offline', isFirst: true })
  },
  beforeDestroy() {
    window.removeEventListener('online', this.updateOnlineStatus)
    window.removeEventListener('offline', this.updateOnlineStatus)
  },
  methods: {
    // 更新网络状态
    updateOnlineStatus(e) {
      if (e.isFirst) {
        this.getWareHouseTopLeftData()
        this.getWareHouseTopBottomData()
        this.getEcharts()
        // this.getMarqueeTipsContent()
      } else {
        const loading = this.$loading({
          lock: true,
          text: '断网了，正在拼命联网中，请检查网络是否正常...',
          spinner: 'el-icon-loading',
          customClass: 'osloading',
          background: 'rgba(0, 0, 0, 0.7)'
        })
        const { type } = e
        this.onLine = type === 'online'
        if (this.onLine) {
          this.getWareHouseTopLeftData()
          this.getWareHouseTopBottomData()
          this.getEcharts()
          loading.close()
          this.$message.success('网络连接成功！')
        } else {
          clearInterval(this.tableTopTask)
          clearInterval(this.tableBottomTask)
          clearInterval(this.echartsRightTop)
          clearInterval(this.echartsRightBottom)
          this.$message.error('网络掉线，请关注网络状态！')
        }
      }
    },

    // 获取公告
    getMarqueeTipsContent() {
      // this.MarqueeTipsContent = '各位员工们：根据上级的通知，结合我企实际情况，现将20xx年的元旦放假通知如下：一、1月1日至1月3日放假调休，共3天。1月4日正式上班。二、节假日期间，各班组要严格落实上级的重要指示精神，按照上级的具体要求，认真抓好落实节日期间值班备勤工作，确保节日期间企业各项工作正常运转。xx企业20xx年12月28日'
@@ -363,7 +412,7 @@
        this.number1 = this.tableDataTop.length
        const divData = this.$refs.tableDataTopRef.bodyWrapper
        // 拿到元素后，对元素进行定时增加距离顶部距离，实现滚动效果(此配置为每100毫秒移动1像素)
        const task = setInterval(() => {
        this.tableTopTask = setInterval(() => {
          // 元素自增距离顶部1像素
          divData.scrollTop += 1
          // divData.scrollTop += divData.scrollHeight / this.tableData.length
@@ -375,7 +424,7 @@
              this.tableDataTop = res.data
              this.number1 = this.tableDataTop.length
              if (this.tableDataTop.length > 9) {
                clearInterval(task)
                clearInterval(this.tableTopTask)
                this.getWareHouseTopLeftData()
              }
            })
@@ -390,7 +439,8 @@
        this.number2 = this.tableDataBottom.length
        const divData = this.$refs.tableDataBottomRef.bodyWrapper
        // 拿到元素后，对元素进行定时增加距离顶部距离，实现滚动效果(此配置为每100毫秒移动1像素)
        const task = setInterval(() => {
        // const task = setInterval(() => {
        this.tableBottomTask = setInterval(() => {
          // 元素自增距离顶部1像素
          divData.scrollTop += 1
          // divData.scrollTop += divData.scrollHeight / this.tableData.length
@@ -402,7 +452,7 @@
              this.tableDataBottom = res.data
              this.number2 = this.tableDataBottom.length
              if (this.tableDataBottom.length > 10) {
                clearInterval(task)
                clearInterval(this.tableBottomTask)
                this.getWareHouseTopBottomData()
              }
            })
@@ -421,13 +471,13 @@
        loadEcharts('bar04', bar02(res.data.filter(i => i.CanuseBaseQuantity > 0).map(i => i.CanuseBaseQuantity), res.data.filter(i => i.CanuseBaseQuantity > 0).map(i => i.materiel_name)))
      })

      setInterval(() => {
      this.echartsRightTop = setInterval(() => {
        WareHouseRightTopData().then(res => {
          loadEcharts('bar03', bar02(res.data.filter(i => i.CanuseBaseQuantity > 0).map(i => i.CanuseBaseQuantity), res.data.filter(i => i.CanuseBaseQuantity > 0).map(i => i.materiel_name)))
        })
      }, 1000 * 15)

      setInterval(() => {
      this.echartsRightBottom = setInterval(() => {
        WareHouseRightBottomData().then(res => {
          loadEcharts('bar04', bar02(res.data.filter(i => i.CanuseBaseQuantity > 0).map(i => i.CanuseBaseQuantity), res.data.filter(i => i.CanuseBaseQuantity > 0).map(i => i.materiel_name)))
        })