kd-aiot-frontend-mes/src/views/produceOrder/components/report/Warehousing.vue

<template>
  <el-form
    class="form-no-message"
    ref="formRef"
    :show-message="false"
    label-position="left"
    :model="{ workReport }"
  >
    <div class="message-box">
      <ul>
        <li> <span class="label">报工次数</span>{{ countMsg.reportNum }}</li>
        <li>
          <span class="label">批次数量</span
          >{{ countMsg.inStoreBatchNum }}PCS</li
        >
        <li>
          <span class="label">累计入库数量</span
          >{{ countMsg.inStoreNum }}PCS</li
        >
      </ul>
      <div class="right">
        <el-form-item
          label="执行人工号"
          prop="workReport.executorJobNum"
          required
          label-width="100px"
          ><personSelectRemote
            v-model="workReport.executorId"
            placeholder="请输入"
            @selfChange="
              (val, item) => (workReport.executorJobNum = item.jobNumber)
            "
        /></el-form-item>
        <el-form-item
          label="执行日期"
          required
          prop="executeTime"
          label-width="100px"
          ><el-date-picker
            v-model="workReport.executeTime"
            value-format="yyyy-MM-dd HH:mm:ss"
            type="datetime"
            format="yyyy-MM-dd HH:mm"
            placeholder="请选择"
          ></el-date-picker
        ></el-form-item>
      </div>
    </div>
    <el-card>
      <el-descriptions title="交接" direction="vertical" :column="7" border>
        <el-descriptions-item label="待交接数量">{{
          countMsg.surplusStandardNum
        }}</el-descriptions-item>
        <el-descriptions-item label="">
          <span slot="label" class="label-required after">实际数量（PCS）</span>
          <el-form-item label="" label-width="0" class="w100" required
            ><el-input v-model="categoryMsg.number"></el-input
          ></el-form-item>
        </el-descriptions-item>
      </el-descriptions>
      <el-descriptions
        title="入库"
        direction="vertical"
        :column="7"
        border
        class="mt-16"
      >
        <!-- <template slot="extra">
          <el-button type="primary" size="small" @click="handleAddBatch"
            >添加</el-button
          >
        </template> -->
        <el-descriptions-item label="交货仓库">
          <span slot="label" class="label-required after">交货仓库</span>
          <el-form-item
            label=""
            label-width="0"
            class="w100"
            prop="workReport.storageInfo.storageCode"
          >
            <DictSelection
              v-model="workReport.storageInfo.storageCode"
              dict-name="仓库"
              @itemChange="
                (item) => (workReport.storageInfo.storageName = item.dictValue)
              "
            ></DictSelection>
          </el-form-item>
        </el-descriptions-item>
        <!-- <template v-for="(item, index) in batchList"> -->
        <el-descriptions-item label="批次号">
          <span slot="label" class="label-required after">批次号</span>
          <el-form-item
            label=""
            label-width="0"
            class="w100"
            prop="workReport.storageInfo.batchNum"
            ><el-input
              v-model="workReport.storageInfo.batchNum"
            ></el-input></el-form-item
        ></el-descriptions-item>
        <el-descriptions-item label="入库数量（PCS）">
          <span slot="label" class="label-required after">入库数量（PCS）</span
          ><el-form-item
            label=""
            label-width="0"
            class="w100"
            prop="workReport.storageInfo.storageCode"
            ><el-input
              v-model="workReport.storageInfo.inStorageNum"
            ></el-input></el-form-item
        ></el-descriptions-item>
        <!-- </template> -->
      </el-descriptions>
    </el-card>
  </el-form>
</template>

<script>
  import personSelectRemote from '@/components/CommomSelect/person-select-remote';
  import { reportCount } from '@/api/produceOrder';
  import dayjs from 'dayjs';
  export default {
    components: { personSelectRemote },
    props: {
      infoData: {
        type: Object,
        default: () => ({})
      },
      taskInfo: {
        type: Object,
        default: () => ({})
      }
    },
    data () {
      return {
        workReport: {
          executorId: '',
          executorJobNum: '',
          executeTime: dayjs(new Date()).format('YYYY-MM-DD HH:mm'),
          storageInfo: {
            batchNum: '',
            inStorageNum: '',
            storageCode: '',
            storageName: ''
          }
        },
        categoryMsg: {
          batchNo: '',
          number: '',
          totalWeight: '',
          brandNum: '',
          sourceCategoryId: '',
          rootCategoryLevelId: '9',
          name: '',
          code: ''
        },
        countMsg: {}
      };
    },
    watch: {
      taskInfo: {
        immediate: true,
        handler () {
          if (this.taskInfo.code) {
            this.getReportCount();
          }
        }
      }
    },
    created () {
      this.workReport.executorId = this.$store.state.user.info?.userId;
      this.workReport.executorJobNum = this.$store.state.user.info?.jobNumber;
    },
    methods: {
      async getReportCount () {
        const res = await reportCount({
          taskCode: this.taskInfo.code,
          lastTaskCode: this.taskInfo.lastTaskCode,
          workOrderId: this.infoData.id
        });

        this.countMsg = res;
      },
      report (fun) {
        this.$refs.formRef.validate((value) => {
          if (value) {
            this.$confirm('是否确定要报工?', '提示').then(() => {
              this.categoryMsg = Object.assign(this.categoryMsg, {
                brandNum: this.infoData.brandNo,
                sourceCategoryId: this.infoData.categoryId,
                name: this.infoData.productName,
                code: this.infoData.productCode
              });
              fun({
                checkState: 1,
                workReport: this.workReport,
                workReportCategoryList: [this.categoryMsg]
              }).then((res) => {
                this.$message.success('报工成功！');
                this.getReportCount();
              });
            });
          }
        });
      }
    }
  };
</script>

<style lang="scss" scoped>
  .message-box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    .label {
      margin-right: 5px;
    }
    ul {
      list-style: none;
      display: flex;
      align-items: center;
      justify-content: flex-start;

      li {
        margin-right: 20px;
      }
    }

    .right {
      padding-top: 22px;
      display: flex;
      align-items: center;
    }
  }
</style>