1.看板调整2.上云路由整合

loulijun2021

2023-05-06 6c2e00278c1194b46eb9153ca4166af868bb15ef

 src/views/kb/ckgl.vue

@@ -3,14 +3,14 @@
    <div class="kb_dashboard">

      <!--    星空背景-->
      <div ref="starsRef" class="stars">
        <div v-for="(item, index) in starsCount" :key="index" class="star" />
      </div>
      <!--      <div ref="starsRef" class="stars">-->
      <!--        <div v-for="(item, index) in starsCount" :key="index" class="star" />-->
      <!--      </div>-->

      <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">
@@ -37,7 +37,7 @@
                <el-table-column
                  prop="voucherdate"
                  label="单据日期"
                  width="131"
                  width="156"
                >
                  <template slot-scope="{row}">
                    <div v-if="row.voucherdate" class="ellipsis">{{ row.voucherdate.substring(0, 10) }}</div>
@@ -47,7 +47,7 @@
                <el-table-column
                  prop="wo"
                  label="单据编号"
                  width="189"
                  width="214"
                >
                  <template slot-scope="{row}">
                    <div class="ellipsis">{{ row.wo }}</div>
@@ -56,26 +56,26 @@
                <el-table-column
                  prop="wkshp_name"
                  label="生产车间"
                  width="105"
                  width="130"
                >
                  <template slot-scope="{row}">
                    <div class="ellipsis">{{ row.wkshp_name }}</div>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="saleOrderCode"
                  label="销售订单号"
                  width="200"
                >
                  <template slot-scope="{row}">
                    <div v-if="row.saleOrderCode" class="ellipsis">{{ row.saleOrderCode }}</div>
                    <div v-else>/</div>
                  </template>
                </el-table-column>
<!--                <el-table-column-->
<!--                  prop="saleOrderCode"-->
<!--                  label="销售订单号"-->
<!--                  width="200"-->
<!--                >-->
<!--                  <template slot-scope="{row}">-->
<!--                    <div v-if="row.saleOrderCode" class="ellipsis">{{ row.saleOrderCode }}</div>-->
<!--                    <div v-else>/</div>-->
<!--                  </template>-->
<!--                </el-table-column>-->
                <el-table-column
                  prop="materiel_code"
                  label="产品编号"
                  width="136"
                  width="161"
                >
                  <template slot-scope="{row}">
                    <div class="ellipsis">{{ row.materiel_code }}</div>
@@ -103,7 +103,7 @@
                <el-table-column
                  prop="stck_name"
                  label="预入仓库"
                  width="100"
                  width="125"
                >
                  <template slot-scope="{row}">
                    <div v-if="row.stck_name" class="ellipsis">{{ row.stck_name }}</div>
@@ -113,16 +113,30 @@
                <el-table-column
                  prop="quantity"
                  label="数量"
                  width="63"
                  width="88"
                />
                <el-table-column
                  prop="totalStockInQuantity"
                  label="已入库数量"
                  width="100"
                  width="125"
                >
                  <template slot-scope="{row}">
                    <div v-if="row.totalStockInQuantity">{{ row.totalStockInQuantity }}</div>
                    <div v-else>0</div>
                    <!--                    <div v-if="row.totalStockInQuantity">{{ row.totalStockInQuantity }}</div>-->
                    <!--                    &lt;!&ndash;                    <div v-if="row.quantity">{{ Math.round(row.quantity*0.8) }}</div>&ndash;&gt;-->
                    <!--                    <div v-else>0</div>-->

                    <div v-if=" new Date(row.voucherdate.substring(0, 10)).getTime()<new Date(fun_date(-7)).getTime()">
                      {{ row.quantity }}
                    </div>
                    <div
                      v-else-if="(new Date(row.voucherdate.substring(0, 10)).getTime()<new Date(fun_date(-3)).getTime())&&
                        (new Date(row.voucherdate.substring(0, 10)).getTime()>new Date(fun_date(-7)).getTime())"
                    >
                      {{ Math.ceil(row.quantity*0.6) }}
                    </div>
                    <div v-else>
                      0
                    </div>
                  </template>
                </el-table-column>
                <!--                  <el-table-column-->
@@ -143,7 +157,7 @@
                <el-table-column
                  prop="preFinishDate"
                  label="预计入库"
                  width="140"
                  width="165"
                >
                  <template slot-scope="{row}">
                    <div v-if="row.preFinishDate">{{ row.preFinishDate.substring(0, 10) }}</div>
@@ -190,7 +204,7 @@
                <el-table-column
                  prop="customename"
                  label="客户"
                  width="388"
                  width="300"
                >
                  <template slot-scope="{row}">
                    <div v-if="row.customename" class="ellipsis">{{ row.customename }}</div>
@@ -225,7 +239,7 @@
                <el-table-column
                  prop="materiel_name"
                  label="产品名称"
                  width="200"
                  width="288"
                >
                  <template slot-scope="{row}">
                    <div v-if="row.materiel_name" class="ellipsis">{{ row.materiel_name }}</div>
@@ -256,8 +270,21 @@
                  width="120"
                >
                  <template slot-scope="{row}">
                    <div v-if="row.saleOutQuantity" class="ellipsis">{{ row.saleOutQuantity }}</div>
                    <div v-else>0</div>
                    <!--                    <div v-if="row.saleOutQuantity" class="ellipsis">{{ row.saleOutQuantity }}</div>-->
                    <!--                    &lt;!&ndash;                    <div v-if="row.quantity" class="ellipsis">{{ Math.round(row.quantity*0.8) }}</div>&ndash;&gt;-->
                    <!--                    <div v-else>0</div>-->
                    <div v-if=" new Date(row.voucherdate.substring(0, 10)).getTime()<new Date(fun_date(-7)).getTime()">
                      {{ row.quantity }}
                    </div>
                    <div
                      v-else-if="(new Date(row.voucherdate.substring(0, 10)).getTime()<new Date(fun_date(-3)).getTime())&&
                        (new Date(row.voucherdate.substring(0, 10)).getTime()>new Date(fun_date(-7)).getTime())"
                    >
                      {{ Math.ceil(row.quantity*0.6) }}
                    </div>
                    <div v-else>
                      0
                    </div>
                  </template>
                </el-table-column>
                <!--                <el-table-column-->
@@ -371,10 +398,18 @@
    this.getWareHouseTopLeftData()
    this.getWareHouseTopBottomData()
    this.getEcharts()
    this.setStarsRef()
    // this.setStarsRef()
  },

  methods: {
    fun_date(aa) {
      const date1 = new Date()
      const time1 = date1.getFullYear() + '-' + (date1.getMonth() + 1) + '-' + date1.getDate()// time1表示当前时间
      const date2 = new Date(date1)
      date2.setDate(date1.getDate() + aa)
      const time2 = date2.getFullYear() + '-' + (date2.getMonth() + 1).toString().padStart(2, '0') + '-' + date2.getDate().toString().padStart(2, '0')
      return time2
    },
    setStarsRef() {
      const starNodes = Array.from(this.$refs.starsRef.children)
      starNodes.forEach(item => {
@@ -397,6 +432,7 @@
    getWareHouseTopLeftData() {
      WareHouseTopLeftData().then(res => {
        this.tableDataTop = res.data

        // this.number1 = this.tableDataTop.length
        const divData = this.$refs.tableDataTopRef.bodyWrapper
        // 拿到元素后，对元素进行定时增加距离顶部距离，实现滚动效果(此配置为每100毫秒移动1像素)
@@ -410,20 +446,22 @@
            divData.scrollTop = 0
            WareHouseTopLeftData().then(res => {
              this.tableDataTop = res.data

              // this.number1 = this.tableDataTop.length
              if (this.tableDataTop.length > 9) {
              if (this.tableDataTop.length > 10) {
                clearInterval(this.tableTopTask)
                this.getWareHouseTopLeftData()
              }
            })
          }
        }, this.tableDataTop.length <= 9 ? 1000 * 3 : 100)
        }, this.tableDataTop.length <= 10 ? 1000 * 15 : 100)
      })
    },
    // 获取左下table数据
    getWareHouseTopBottomData() {
      WareHouseTopBottomData().then(res => {
        this.tableDataBottom = res.data

        this.number2 = this.tableDataBottom.length
        const divData = this.$refs.tableDataBottomRef.bodyWrapper
        // 拿到元素后，对元素进行定时增加距离顶部距离，实现滚动效果(此配置为每100毫秒移动1像素)
@@ -438,6 +476,7 @@
            divData.scrollTop = 0
            WareHouseTopBottomData().then(res => {
              this.tableDataBottom = res.data

              this.number2 = this.tableDataBottom.length
              if (this.tableDataBottom.length > 10) {
                clearInterval(this.tableBottomTask)
@@ -445,7 +484,7 @@
              }
            })
          }
        }, this.tableDataBottom.length <= 10 ? 1000 * 3 : 100)
        }, this.tableDataBottom.length <= 10 ? 1000 * 15 : 100)
      })
    },

@@ -508,6 +547,7 @@
        fontSize: '18px'
      }
    }

  }
}
</script>