1.看板样式优化

loulijun2021

2023-03-20 f5389299d31e2236d399e48cfc1b09e5dd16f4c1

 src/views/kb/cgdd.vue

@@ -10,9 +10,14 @@
      <div class="kb_header">
        <div class="flex_c_c kb_header_text">
          <div id="topBarLeft" style="width:600px;height:100%" />
          采购跟踪看板
          采购跟踪数字化看板
          <div id="topBarRight" style="width:600px;height:100%;transform:rotate(180deg);" />
        </div>

        <div class="kb_headTime" style="left: 85px">
          <span>浙江新凯迪数字科技股份有限公司</span>
        </div>

        <div class="kb_headTime">
          <span>{{ headTime }}</span>
        </div>
@@ -258,6 +263,8 @@
  name: 'Index2',
  data() {
    return {
      onLine: navigator.onLine, // 监听网络是否在线

      headTime: '',
      purchaseLeftTopData: {},

@@ -279,9 +286,14 @@
    // 两小时看板刷新一次
    setInterval(() => {
      window.location.reload()
    }, 1000 * 60 * 120)
    }, 1000 * 60 * 60 * 10)
  },
  mounted() {
    // 监听网络是否在线
    window.addEventListener('online', this.updateOnlineStatus)
    window.addEventListener('offline', this.updateOnlineStatus)
    this.updateOnlineStatus({ type: this.onLine ? 'online' : 'offline', isFirst: true })

    this.getTopBar()
    this.getEcharts()
    this.getPurchaseLeftBottom()
@@ -289,8 +301,33 @@

    this.setStarsRef()
  },

  beforeDestroy() {
    window.removeEventListener('online', this.updateOnlineStatus)
    window.removeEventListener('offline', this.updateOnlineStatus)
  },
  methods: {
    // 更新网络状态
    updateOnlineStatus(e) {
      if (e.isFirst) {
        // console.log('x')
      } 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) {
          loading.close()
          this.$message.success('网络连接成功！')
        } else {
          this.$message.error('网络掉线，请关注网络状态！')
        }
      }
    },
    setStarsRef() {
      const starNodes = Array.from(this.$refs.starsRef.children)
      starNodes.forEach(item => {