no message

skyouc

2025-06-22 fee38f39e36bcda9924f5b26dca609dda6b331e0

 construction-data/src/components/datav/index.vue

@@ -4,14 +4,14 @@
      <top-header/>
      <template>
        <el-row>
          <el-col :span="15">
          <el-col :span="13">
            <el-row class="header-left-task" type="flex" align="center" >
              <el-col v-for="(task, index) in tasks" :key="index" >
                <el-row type="flex" align="center" justify="center" @click.native="borderClick(task)">
                  <dv-border-box-2>
                    <el-card class="header-card" >
                      <el-row>
                        <el-col :span="4" v-for="(item, index) in Object.keys(waveLabels)" :key="index">
                        <el-col class="heaer-label-column" v-for="(item, index) in Object.keys(waveLabels)" :key="index">
                          <div class="header-card-label" >{{ waveLabels[item] }}</div>
                          <div class="header-card-val" >{{ task[item] }}</div>
                        </el-col>
@@ -22,13 +22,11 @@
              </el-col>
            </el-row>
            <el-row class="detl-info-row">
              <dv-border-box-2>
                <el-card>
                  <el-table :data="mergeTaskDetl" class="talbe-matnr" @row-click="selectRow">
                    <el-table-column v-for="(item,index) in Object.keys(detlLabels)" :prop="item" :label="detlLabels[item]" :key="index"/>
                  </el-table>
                </el-card>
              </dv-border-box-2>
              <el-card class="detl-info-card">
                <el-table :data="mergeTaskDetl" class="table-matnr" @row-click="selectRow">
                  <el-table-column v-for="(item,index) in Object.keys(detlLabels)" :prop="item" :label="detlLabels[item]" :key="index"/>
                </el-table>
              </el-card>
            </el-row>
            <el-row class="pick-order-detl">
              <dv-border-box11 title="拣货订单明细" class="detl-box-border">
@@ -41,31 +39,13 @@
              </dv-border-box11>
            </el-row>
          </el-col>
          <el-col :span="9">
          <el-col :span="11">
              <el-row class="order-box-row">
                <dv-border-box-11 title="订单完成情况" class="order-box">
                  <el-table :data="orders" v-if="orders.length > 0" class="order-table">
                    <el-table-column v-for="(item, dex) in Object.keys(orderStatus)" :prop="item" :label="orderStatus[item]" :key="dex">
                    <el-table-column v-for="(item, dex) in Object.keys(orderStatus)" :prop="item" :label="orderStatus[item]" :key="dex" >
                      <template slot-scope="scope">
                        <el-popover
                          placement="right"
                          width="300"
                          trigger="manual"
                          v-model="visible"
                          v-if="item === 'action'" >
                          <template>
                            <div>
                              <span>选择目标发货区</span>
                              <el-divider/>
                              <el-row :gutter="15">
                                <el-col v-for="(palt, index) in platforms" :key="index" class="platform" :span="7" @click.native="bindShipping(palt, scope)">
                                  <div>{{palt.platformNo}}</div>
                                </el-col>
                              </el-row>
                            </div>
                          </template>
                          <el-button slot="reference" type="text" @click.native.prevent="print(scope.$index, orders)">打印明细</el-button>
                        </el-popover>
                        <el-button slot="reference" type="text" @click.native.prevent="print(scope.$index, orders)" class="btnPrint" v-if="item === 'action'" >打印明细</el-button>
                        <div v-else class="ship-order-list">
                          {{scope.row[item]}}
                        </div>
@@ -73,20 +53,37 @@
                    </el-table-column>
                  </el-table>
                  <el-empty description="暂无投放订单" class="empty-padding" v-else></el-empty>
                  <el-popover
                    placement="right"
                    trigger="manual"
                    class="popover-order"
                    v-model="visible">
                    <template>
                      <div>
                        <span>选择目标发货区</span>
                        <el-divider/>
                        <el-row :gutter="15">
                          <el-col v-for="(palt, index) in platforms" :key="index" :span="7" @click.native="bindShipping(palt)">
                            <div class="platform" >{{palt.platformNo}}</div>
                          </el-col>
                        </el-row>
                      </div>
                    </template>
                  </el-popover>
                </dv-border-box-11>
              </el-row>
              <el-row type="flex" align="center" id="datav">
                <dv-border-box-11  title="播种墙" class="pick-wall" >
                  <el-row type="flex" align="center" justify="center" class="pick-wall-circle" >
                    <el-col :span="1">
                      <p class="pick-wall-tip"></p>
                    </el-col>
                    <el-col :span="22">
                      <p>绿色：任务已完成  黄色：等待中  红色：播种中</p>
                    </el-col>
                  </el-row>
<!--                  <el-row type="flex" align="center" justify="center" class="pick-wall-circle" >-->
<!--                    <el-col :span="1">-->
<!--                      <p class="pick-wall-tip"></p>-->
<!--                    </el-col>-->
<!--                    <el-col :span="22">-->
<!--                      <p>绿色：任务已完成  黄色：等待中  红色：播种中</p>-->
<!--                    </el-col>-->
<!--                  </el-row>-->
                  <div class="pick-wall-box">
                    <el-col :span="6" v-for="(item, index) in seedBracket" :key="index" @click.native="lightClick(item)">
                    <el-col :span="6" v-for="(item, index) in seedBracket" :key="index">
                      <div class="seed-bracket" :style="getLightStatus(item)" />
                    </el-col>
                  </div>
@@ -191,13 +188,12 @@
    }
  },
  created () {
    //获取当前执行任务
    this.getWaves()
    //获取当前播种墙库位信息
    this.getSeedLoc()
    //获取所有发货暂存区
    this.getAllPlatforms()
    let that = this
    setInterval(() => {
        that.refreshData()
    }, 10000)
  },

  computed: {
    getLightStatus() {
      return (item)=> {
@@ -210,6 +206,14 @@
    }
  },
  methods: {
    refreshData() {
      //获取当前执行任务
      this.getWaves()
      //获取当前播种墙库位信息
      this.getSeedLoc()
      //获取所有发货暂存区
      this.getAllPlatforms()
    },
    printPage() {
      // let element = document.querySelector('#datav');
      // let el = this.$refs.datav
@@ -230,12 +234,16 @@
    },
    //拍灯容器流动
    lightClick(item) {
      if (item.platformId == null || item.platformId == undefined || item.platformId == '') {
        this.$message.error('请打印订单明细，并选择目标集货区！！')
        return
      }
      this.slapLight(item)
    },
    //订单入库集货区,并打印单据
    bindShipping(plat, item) {
    bindShipping(plat) {
      this.visible = false
      let order = item.row
      let order = this.selectOrder
      if (order == null) {
        this.$message.error("当前订单信息不存在，请联系管理员！！")
        return
@@ -244,6 +252,7 @@
      // eslint-disable-next-line no-undef
      $ajax.post('/api/bind/shipping/platform', {orderId: order.id, waveId: order.waveId, platformId: plat.id}).then(response => {
        if (response.code === 200) {
          that.refreshData()
          //隐藏发货区,执行打印
        } else {
          this.$message.error(response.msg)
@@ -410,8 +419,6 @@
</script>

<style lang="less">


  @media screen and (max-width: 1920px){
    #data-view {
      width: 100%;
@@ -431,22 +438,10 @@
        margin: 5px 0;
      }

      .platform {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 80px;
        background-color: #03d3ec;
        margin: 5px;
        text-align: center;
      }

      .pick-order-detl {
        padding: 0 15px;

        .detl-box-border {
          height: 59vh;

          height: 55vh;
          .detl-box-padding {
            height: 65px
          }
@@ -457,10 +452,8 @@
        text-align: center;
        color: white;
        margin: 20vh;

        .container {
          padding: 45px 60px;

          .btn {
            width: 30vh;height: 7vh;font-size: 23px;
          }
@@ -490,7 +483,7 @@

      .pick-wall {
        padding: 60px 10px 10px 10px;
        height: 68vh;
        height: 47vh;

        .pick-wall-box {
          .seed-bracket {
@@ -511,6 +504,10 @@
            background: #03d3ec;
            border-left: 5px solid #50bfff
          }

          span {
            margin: 2px;
          }
        }
      }

@@ -524,27 +521,36 @@
          text-align: center;
          padding: 15px;

          .header-card-label {
            font-size: 25px;
            font-style: oblique;
            padding: 5px;
            color: white;
          }
          .header-card-val {
            font-size: 20px;
            padding: 10px;
            color: orange;
          .heaer-label-column {
            min-width: 170px;
            width: auto;
            .header-card-label {
              font-size: 25px;
              font-style: oblique;
              padding: 5px;
              color: white;
            }
            .header-card-val {
              font-size: 20px;
              padding: 10px;
              color: orange;
            }
          }
        }
      }

      .detl-info-row {
        padding: 0 15px;

        .detl-info-card {

        }

      }

      .order-box-row {
        width: 84vh;
        height: 38vh;
        height: 33vh;

        .order-box {
          padding:0px 30px;
@@ -554,13 +560,30 @@
            padding-top: 65px;
            height: 275px;

            .popover-order {
              width: 300px;

              .platform {
                display: flex;
                align-items: center;
                justify-content: center;
                height: 80px;
                background-color: #03d3ec;
                margin: 5px;
                text-align: center;
              }
            }

            .ship-order-list {
              font-size: 18px; color: white;
            }
          }
        }
        .empty-padding {
          padding-top: 65px;
          padding-top: 105px;
          .el-empty__image {
            height: 100px;
          }
        }
      }
      .order-detl-list {
@@ -620,7 +643,7 @@
        top: 0px !important;
      }

      .talbe-matnr {
      .table-matnr {
        height: 26vh;
      }

@@ -667,23 +690,58 @@
@media screen and (max-width: 1281px)  {
  #data-view {
    .header-left-task {
      .header-card {
        margin: 5px;height: 90px;
        padding: 5px;
      padding: 5px 15px 5px 15px;

        .header-card-label {
          font-size: 18px;
          padding: 5px;
      .header-card {
        margin: 2px;
        height: 70px;
        padding: 2px;

        .el-card__body {
          padding: 5px 20px;
        }

        .header-card-val {
          font-size: 14px;
        .heaer-label-column{
          max-width: 130px;
          min-width: 75px;
          width: auto;
          .header-card-label {
            font-size: 13px;
            padding: 5px;
          }

          .header-card-val {
            font-size: 11px;
          }
        }
      }
    }

    .detl-info-row {
      padding: 0 15px;

      .detl-info-card {
          padding: 0;
        .el-card__body {
          padding: 8px;
        }
      }

      .el-table {
        th.el-table__cell>.cell {
          text-align: center;
        }

        .el-table__cell {
          padding: 5px 0;
          text-align: center;
          width: auto;
        }
      }
    }

    .order-box-row {
      width: 58vh;
      width: 68vh;
      height: 28vh;

      .order-box {
@@ -694,37 +752,47 @@
          padding-top: 65px;
          height: 275px;

          .btnPrint {
            font-size: 9px;
          }

          .ship-order-list {
            font-size: 14px;
            font-size: 10px;
          }

          .el-table__cell {
            padding: 0;
          }
        }
      }
      .empty-padding {
        padding-top: 65px;
        width: 30px;
        height: 30px;
      }
    }


    .talbe-matnr {
      height: 20vh;
    .table-matnr {
      height: 15vh;
    }

    .el-table .cell {
      font-size: 16px !important;
      font-size: 10px !important;
    }

    .pick-order-detl {
      padding: 0 10px;

      .detl-box-border {
        height: 39vh;
        height: 49vh;

        .detl-box-padding {
          height: 65px
        }

        .order-detl-list {
          height: 23vh;
          height: 38vh;
        }
      }
    }