src/views/product/producttraceability/index.vue
@@ -2,25 +2,36 @@
  <div class="product-traceability-div">
    <div class="product-traceability-hearder-div">
      <div style="width: 600px;margin-left:3px;">
        <tRemoteSelect
          v-model="systemNo"
          :columns="partColumn"
          :data="partList"
          :formatter="labelFormatter"
          :selectLoading="selectLoading"
          :valueColumn="valueColumn"
          @selectChange="changePart()"
          @remoteSearch="queryPart"
        ></tRemoteSelect>
        <el-row :gutter="10">
            <el-col :span="16">
                <tRemoteSelect
                v-model="systemNo"
                :columns="partColumn"
                :data="partList"
                :formatter="labelFormatter"
                :selectLoading="selectLoading"
                ref="systemSelect"
                :valueColumn="valueColumn"
                @selectChange="queryBatchNoData"
                @remoteSearch="queryPart"
                ></tRemoteSelect>
            </el-col>
            <el-col :span="8">
                <el-select @change="changePart" v-model="selBatchNo" class="lmes-select" placeholder="请选择批次号">
                    <el-option :label="item" :value="item" :key="index" v-for="(item,index) in selBatchNoList"></el-option>
                </el-select>
            </el-col>
        </el-row>
      </div>
      <div style="margin-left:20px;">
      <!-- <div style="margin-left:20px;">
        <el-radio v-model="traceType" label="posite" @change="changeTraceType"
          >反向追溯</el-radio
        >
        <el-radio v-model="traceType" label="negate" @change="changeTraceType"
          >正向追溯</el-radio
        >
      </div>
      </div> -->
    </div>
    <div class="product-traceability-body-div">
      <div class="product-traceability-relationship-div">
@@ -262,10 +273,10 @@
                  <div>工作站:</div>
                  <div>报工单号:</div>
                  <div>报工人员:</div>
                  <div>产品编号:</div>
                  <div>批次号:</div>
                  <div>零件号:</div>
                  <div>单位:</div>
                  <div>产出数量:</div>
                </div>
                <div class="product-traceability-producttracking-val-div">
                  <div :title="currProductTracking.workstationName">
@@ -280,7 +291,6 @@
                    {{ currProductTracking.partNo }}
                  </div>
                  <div>{{ currProductTracking.unit }}</div>
                  <div>{{ currProductTracking.productQty }}</div>
                </div>
              </div>
              <div class="product-traceability-producttracking-item-div">
@@ -288,24 +298,26 @@
                  <div>班组:</div>
                  <div>汇报工序:</div>
                  <div>汇报时间:</div>
                  <div>批号:</div>
                  <!-- <div>批号:</div> -->
                  <div>零件描述:</div>
                  <div>生产日期:</div>
                  <div>产出数量:</div>
                </div>
                <div class="product-traceability-producttracking-val-div">
                  <div>{{ currProductTracking.crewName }}</div>
                  <div>{{ currProductTracking.operationName }}</div>
                  <div>{{ currProductTracking.trackingTime }}</div>
                  <div>{{ currProductTracking.systemNo }}</div>
                  <!-- <div>{{ currProductTracking.systemNo }}</div> -->
                  <div :title="currProductTracking.partName">
                    {{ currProductTracking.partName }}
                  </div>
                  <div>{{ currProductTracking.productDate }}</div>
                  <div>{{ currProductTracking.productQty }}</div>
                </div>
              </div>
            </div>
          </el-tab-pane>
          <el-tab-pane label="工步信息" name="工步信息">
          <!-- <el-tab-pane label="工步信息" name="工步信息">
            <div style="margin-top:10px;">
              <el-table
                ref="stepRecordTable"
@@ -330,10 +342,113 @@
                </el-table-column>
              </el-table>
            </div>
          </el-tab-pane>
          </el-tab-pane> -->
          <el-tab-pane label="检测信息" name="检测信息">
            <div style="margin-top:10px;">
              <el-tabs type="card">
            <div style="margin-top:10px;height: 80vh;overflow-y: scroll;">
                <div class="process" v-if="process">
                    <el-divider
                    class="pane-divider"
                    direction="vertical"
                    ></el-divider>
                    <span style="font-size:14px;font-weight:bold"
                    >过程检</span>
                    <div style="font-size: 12px;margin-top: 10px;margin-left: 10px;">样品名:<span style="font-weight: 700;">{{process.sampleName}}</span></div>
                    <el-table
                    stripe
                    :data="process.sampleItem"
                    :height="paramsTableHeight"
                    :header-cell-style="paramsTableHeaderStyle0"
                    :row-class-name="tableRowClassName"
                    class="taskinfo-params-table"
                    style="margin: 10px;width: 95%;"
                  >
                    <el-table-column
                      prop="father"
                      label="项目"
                      align="center"
                      min-width="75px"
                    />
                    <el-table-column
                      prop="name"
                      label="指标"
                      align="center"
                      min-width="100px"
                    />
                    <el-table-column
                      prop="result"
                      label="结果"
                      align="center"
                      min-width="60px"
                    >
                      <template slot-scope="scope">
                        {{
                          scope.row.isQualified == 0
                            ? '不合格'
                            : (scope.row.isQualified==1?'合格':'')
                        }}
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="userName"
                      label="检验人"
                      align="center"
                      min-width="90px"
                    />
                  </el-table>
                </div>
                <div class="product" v-if="finished" :class="{checkMore:process}">
                    <el-divider
                    class="pane-divider"
                    direction="vertical"
                    ></el-divider>
                    <span style="font-size:14px;font-weight:bold"
                    >产品检</span>
                    <div style="font-size: 12px;margin-top: 10px;margin-left: 10px;">样品名:<span style="font-weight: 700;">{{finished.sampleName}}</span></div>
                    <el-table
                    stripe
                    :data="finished.sampleItem"
                    :height="paramsTableHeight"
                    :header-cell-style="paramsTableHeaderStyle0"
                    :row-class-name="tableRowClassName"
                    class="taskinfo-params-table"
                    style="margin: 10px;width: 95%;"
                  >
                    <el-table-column
                      prop="father"
                      label="项目"
                      align="center"
                      min-width="75px"
                    />
                    <el-table-column
                      prop="name"
                      label="指标"
                      align="center"
                      min-width="100px"
                    />
                    <el-table-column
                      prop="result"
                      label="结果"
                      align="center"
                      min-width="60px"
                    >
                      <template slot-scope="scope">
                        {{
                          scope.row.isQualified == 0
                            ? '不合格'
                            : (scope.row.isQualified==1?'合格':'')
                        }}
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="userName"
                      label="检验人"
                      align="center"
                      min-width="90px"
                    />
                  </el-table>
                </div>
                <!-- <p v-show="!process&&!finished">暂无数据</p> -->
              <!-- <el-tabs type="card">
                <el-tab-pane
                  v-for="(item, index) in checkItemList"
                  :key="item.reportTypeLabel"
@@ -412,30 +527,12 @@
                    </el-table-column>
                  </el-table>
                </el-tab-pane>
                <!--<el-tab-pane label="附件">
                  <el-upload
                    drag
                    ref="upload"
                    action="/mes/reportSample/upload"
                    :headers="headers"
                    :auto-upload="true"
                    :file-list="fileList"
                    list-type="text"
                    :on-preview="handlePreview"
                    :with-credentials="true"
                  >
                    <i class="el-icon-upload"></i>
                    <div class="el-upload__text">
                      将文件拖到此处,或<em>点击上传</em>
                    </div>
                  </el-upload>
                </el-tab-pane>-->
              </el-tabs>
              </el-tabs> -->
            </div>
          </el-tab-pane>
          <el-tab-pane label="生产记录" name="生产记录">
            <div style="margin-top:10px;">
              <div style="padding:0px 14px;height: 100%;overflow: auto;">
              <div style="padding:0px 14px;height: 80vh !important;overflow: auto;">
                <div class="product-record-div">
                  <div class="product-record-div-left">
                    <div class="product-record-list-header">
@@ -535,7 +632,7 @@
                            </el-table-column>
                          </el-table>
                        </el-tab-pane>
                        <el-tab-pane label="附件">
                        <!-- <el-tab-pane label="附件">
                          <el-upload
                            ref="upload"
                            action="/mes/operationTask/upload"
@@ -545,7 +642,7 @@
                            :auto-upload="false"
                            list-type="picture"
                          ></el-upload
                        ></el-tab-pane>
                        ></el-tab-pane> -->
                      </el-tabs>
                    </div>
                  </div>
@@ -657,7 +754,7 @@
              </el-tabs>
            </div>
          </el-tab-pane>
          <el-tab-pane label="模具信息" name="模具信息">
          <!-- <el-tab-pane label="模具信息" name="模具信息">
            <div style="margin-top:10px;">
              <el-table
                ref="mouldRecordTable"
@@ -762,7 +859,7 @@
                </el-table-column>
              </el-table>
            </div>
          </el-tab-pane>
          </el-tab-pane> -->
        </el-tabs>
      </div>
    </div>
@@ -970,12 +1067,16 @@
.taskinfo-params-table >>> td {
  padding: 3px 0px;
}
.checkMore{
    margin-top: 20px;
}
</style>
<script>
import {
  queryByNo,
  queryDiagram,
  queryOperationTask
  queryOperationTask,
  queryByCustomerOrderId
} from '@/api/product/producttraceability'
import {
  getTemplateRecord,
@@ -1000,6 +1101,8 @@
      },
      selectLoading: false,
      systemNo: null,
      selBatchNo: null,
      selBatchNoList: [],
      selectedProductSystemNo: null,
      valueColumn: 'customerOrderId',
      partColumn: [
@@ -1010,11 +1113,11 @@
        {
          prop: 'entityName',
          label: '项目名称'
        },
        },
        {
          prop: 'partNo',
          label: '产品编号'
        },
        },
        {
          prop: 'productName',
          label: '产品名称'
@@ -1022,7 +1125,7 @@
        {
          prop: 'specs',
          label: '产品型号'
        },
        },
        {
          prop: 'productType',
          label: '产品类型'
@@ -1115,7 +1218,9 @@
      traceType: 'posite',
      reportTypeOptions: [],
      checkItemList: [],
      mouldRecordList: []
      mouldRecordList: [],
      finished:null,
      process:null
    }
  },
  mounted() {
@@ -1124,6 +1229,16 @@
    this.resize()
  },
  methods: {
    queryBatchNoData(){
        this.selBatchNo = null
        queryByCustomerOrderId({customerOrderId : this.systemNo}).then(res=>{
            if(res.status===200){
                this.selBatchNoList = res.data.data
            }
        }).catch(error=>{
            console.error(error)
        })
    },
    // 加载浏览器窗口变化自适应
    resize() {
      window.addEventListener('resize', () => {
@@ -1191,7 +1306,7 @@
    },
    labelFormatter(ele) {
      let partLabel
      const part = this.partList.find((item) => ele.systemNo === item.systemNo)
      const part = this.partList.find((item) => ele.customerOrderId === item.customerOrderId)
      if (part !== undefined) {
        partLabel =
          '销售订单号:' +
@@ -1226,10 +1341,12 @@
      } else {
        this.partList = []
      }
      this.selBatchNo = null
      this.selBatchNoList = []
    },
    changePart() {
      if (this.systemNo != null && this.systemNo !== '') {
        const query = { systemNo: this.systemNo, traceType: this.traceType }
      if (this.selBatchNo != null && this.selBatchNo !== '') {
        const query = { systemNo: this.selBatchNo, traceType: this.traceType }
        queryDiagram(query)
          .then((response) => {
            var data = response.data
@@ -1239,15 +1356,15 @@
                const hasOutNode = data.data.linkDataArray.find((ele) => {
                  return ele.from === item.key
                })
                item.batchNo = 'SN号:' + item.batchNo
                item.batchNo = '批次号:' + item.batchNo
                item.quantity =
                  '投入数量:' +
                  (hasOutNode ? item.quantity : 0) +
                  ' ' +
                  item.unit
                item.ifsBatchNo =
                  'IFS批次号:' +
                  (item.ifsBatchNo == null ? '' : item.ifsBatchNo)
                // item.ifsBatchNo =
                //   'IFS批次号:' +
                //   (item.ifsBatchNo == null ? '' : item.ifsBatchNo)
              })
              this.modelData = {
                nodeDataArray: data.data.nodeDataArray,
@@ -1306,39 +1423,51 @@
                  _that.currProductTracking = {}
                }
                // 检测信息
                const sampleItemList = data.data.sampleItems
                if (sampleItemList != null && sampleItemList.length > 0) {
                  _that.paramValues = sampleItemList
                  _that.checkItemList = []
                  sampleItemList.forEach((item) => {
                    const reportTypeLabel = _that.reportTypeOptions.find(
                      (el) => {
                        return item.reportType == el.value
                      }
                    )
                    if (reportTypeLabel) {
                      const existCheckItem = _that.checkItemList.find(
                        (checkItem) => {
                          return (
                            reportTypeLabel.label == checkItem.reportTypeLabel
                          )
                        }
                      )
                      if (existCheckItem) {
                        existCheckItem.itemList.push(item)
                      } else {
                        _that.checkItemList.push({
                          reportTypeLabel: reportTypeLabel.label,
                          itemList: [item]
                        })
                      }
                    }
                  })
                  // reportTypeOptions
                } else {
                  _that.paramValues = []
                  _that.checkItemList = []
                const sampleItems = data.data.sampleItems
                // 检测信息-过程检
                if(sampleItems&&sampleItems.process&&sampleItems.process.length>0){
                    _that.process = sampleItems.process[0]
                }else{
                    _that.process = null
                }
                // 检测信息-产品检
                if(sampleItems&&sampleItems.finished&&sampleItems.finished.length>0){
                    _that.finished = sampleItems.finished[0]
                }else{
                    _that.finished = null
                }
                // if (sampleItemList != null && sampleItemList.length > 0) {
                //   _that.paramValues = sampleItemList
                //   _that.checkItemList = []
                //   sampleItemList.forEach((item) => {
                //     const reportTypeLabel = _that.reportTypeOptions.find(
                //       (el) => {
                //         return item.reportType == el.value
                //       }
                //     )
                //     if (reportTypeLabel) {
                //       const existCheckItem = _that.checkItemList.find(
                //         (checkItem) => {
                //           return (
                //             reportTypeLabel.label == checkItem.reportTypeLabel
                //           )
                //         }
                //       )
                //       if (existCheckItem) {
                //         existCheckItem.itemList.push(item)
                //       } else {
                //         _that.checkItemList.push({
                //           reportTypeLabel: reportTypeLabel.label,
                //           itemList: [item]
                //         })
                //       }
                //     }
                //   })
                //   // reportTypeOptions
                // } else {
                //   _that.paramValues = []
                //   _that.checkItemList = []
                // }
                _that.currOperateTask = data.data.operationTask
                if (_that.currOperateTask == null) {
                  _that.currOperateTask = {
@@ -1366,11 +1495,11 @@
                  _that.productRecordParamValues = []
                  _that.paramTabs = []
                } else {
                  // 工步信息
                  _that.getStepRecords({
                    id: _that.currOperateTask.id,
                    sn: nodeData.batchNo.split('SN号:')[1]
                  })
                  // 工步信息--报错注释掉了
                //   _that.getStepRecords({
                //     id: _that.currOperateTask.id,
                //     sn: nodeData.batchNo.split('SN号:')[1]
                //   })
                  // 工艺参数信息
                  _that.queryTechnologyInfo(_that.currOperateTask.id)
                  // 生产记录
@@ -1590,6 +1719,15 @@
      }
      return headerStyle
    },
    paramsTableHeaderStyle0({ row, column, rowIndex, columnIndex }) {
      let headerStyle = 'background:#599ef4;color:#fff;'
      if (columnIndex === 0) {
        headerStyle += 'border-radius: 6px 0px 0px 0px;'
      } else if (columnIndex === 3) {
        headerStyle += 'border-radius: 0px 6px 0px 0px;'
      }
      return headerStyle
    },
    tableRowClassName({ row, rowIndex }) {
      if (rowIndex % 2 === 1) {
        return 'stripe-row'