aiot-app/pages/pda/jobBooking/components/singleJobBom.vue

<template>
  <view>
    <!-- 单个报工 -->
    <view class="title_box rx-bc">
      <view class="name">报工信息</view>
    </view>

    <view class="material">
      <view class="content_table">
        <view class="item rx-sc">
          <view class="rx">
            <view class="lable lable150 rx-cc">报工数量</view>
            <view class="content">
              {{ tableData.length || 0 }}
            </view>
          </view>
        </view>

        <view class="item rx-sc">
          <view class="rx ww55">
            <view class="lable lable150 rx-cc">要求生产数量</view>
            <view class="content rx-sc">
              <view>{{ item.formingNum }}</view>
              <view class="unit">{{ item.unit }}</view>
            </view>
          </view>

          <view class="rx ww45">
            <view class="lable rx-cc ww80">重量</view>
            <view class="content content_num">
              <view>{{ item.formingWeight }}</view>
              <view class="unit">{{ item.weightUnit }}</view>
            </view>
          </view>
        </view>

        <view class="item rx-sc">
          <view class="rx ww55">
            <view class="lable lable150 rx-cc">合格品数量</view>
            <view class="content content_num">
              <input
                class="uni-input"
                v-model="item.workReportInfo.formedNum"
                :disabled="isDetails"
                @input="blurNum(item.workReportInfo)"
                type="digit"
              />
              <view class="unit">{{ item.unit }}</view>
            </view>
          </view>

          <view class="rx ww45">
            <view class="lable rx-cc ww80">重量</view>
            <view class="content content_num">
              <input
                class="uni-input"
                v-model="item.workReportInfo.formedWeight"
                type="digit"
                :disabled="isDetails"
              />
              <view class="unit">{{ item.weightUnit }}</view>
            </view>
          </view>
        </view>

        <view
          class="item rx-sc"
          v-for="(not, notIndex) in notFormedList"
          :key="notIndex"
        >
          <view class="rx ww55">
            <view class="lable lable150 rx-cc">不合格数量</view>
            <view class="content content_num">
              <!-- //详情 -->
              <input
                class="uni-input"
                v-model="item.workReportInfo.notFormedNum"
                type="digit"
                :disabled="isDetails"
                v-if="isDetails"
                @input="changeNum"
              />

              <input
                class="uni-input"
                v-model="not.notFormedNum"
                type="number"
                v-else
                @input="changeNum(not)"
              />
              <view class="unit">{{ item.unit }}</view>
            </view>
          </view>

          <view class="rx ww45">
            <view class="lable rx-cc ww80">重量</view>
            <view class="content content_num">
              <input
                class="uni-input"
                v-model="item.workReportInfo.notFormedWeight"
                type="digit"
                :disabled="isDetails"
                v-if="isDetails"
              />
              <input
                class="uni-input"
                v-model="not.notFormedWeight"
                type="digit"
                :disabled="isDetails"
                v-else
              />
              <view class="unit">{{ item.weightUnit }}</view>

              <!-- <view class="penalize" v-if='!isDetails'
								:style="{ background: not.warehouseId ? '#FFA07A' : '' }" @click="penalize">处置</view> -->
              <!-- <view class="penalize" v-if='isDetails'
								:style="{ background: not.warehouseId ? '#FFA07A' : '' }"
								@click="handleView(isDetails ? not.warehouseName : item.warehouseName)">查看</view> -->
            </view>
          </view>
        </view>
        <view class="item rx-sc">
          <view class="rx ww55">
            <view class="lable lable150 rx-cc">报工备注</view>
            <view class="content content_num" style="width: 100%">
              <input
                class="uni-input"
                v-model="item.workReportInfo.remark"
                :disabled="isDetails"
                type="text"
              />
            </view>
          </view>
          <!-- v-if="clientEnvironmentId==2" -->
          <view class="rx ww45" v-if="clientEnvironmentId == 2">
            <view class="lable ww80 rx-cc">批次号</view>
            <view class="content content_num" style="width: 100%">
              {{ item.batchNo }}
              <input
                class="uni-input"
                v-model="batchNo"
                @input="batchNoNew"
                :disabled="isDetails"
                type="text"
              />
            </view>
          </view>

          <!-- 不是首工序展示这个按钮 -->
          <view
            class="unit-btn"
            @click="singleQuery"
            v-if="
              item.currentTaskDiagram.isFirstTask && clientEnvironmentId != 3
            "
            >确认</view
          >

          <!-- <view
            class="unit-btn"
            @click="singleQueryTg"
            v-if="
              item.currentTaskDiagram.isFirstTask && clientEnvironmentId == 3
            "
            >确认</view
          > -->
        </view>
      </view>
      <view class="content_table">
        <!-- <view class="item rx-sc">
					<view class="rx ww55 ">
						<view class="lable lable150 rx-cc ">名称</view>
						<view class="content content_num ">
							<view>{{ forValue.name }}</view>
						</view>
					</view>

					<view class="rx ww45">
						<view class="lable rx-cc ww80">编码</view>
						<view class="content content_num">
							<view>{{ forValue.code }}</view>

						</view>
					</view>

				</view>
				<view class="item rx-sc">
					<view class="rx ww55">
						<view class="lable lable150 rx-cc ww80">单位</view>
						<view class="content content_num">
							<view>{{ forValue.unit }}</view>
						</view>
					</view>
					<view class="rx ww45 ">
						<view class="lable rx-cc ww80">规格</view>
						<view class="content content_num rx-sc">
							<view>{{ forValue.specification }}</view>
						</view>
					</view>
				</view>
				<view class="item rx-sc">


					<view class="rx ww55">
						<view class="lable lable150 rx-cc ww80">牌号</view>
						<view class="content  content_num">
							<view>{{ forValue.brandNum }}</view>

						</view>
					</view>
					<view class="rx ww45">
						<view class="lable rx-cc ww80">型号</view>
						<view class="content content_num">
							<view>{{ forValue.modelType }}</view>
						</view>
					</view>
				</view> -->
        <!-- <checkboxTable :tableData="tableData" :itemData="item" @tableDataFn="tableDataFn"></checkboxTable> -->
        <singleProductJobBom
          :item="item"
          :list="item.semiProductList"
          :equipmentList="item.equipmentList"
        ></singleProductJobBom>
      </view>
    </view>
  </view>
</template>

<script>
import { createInProduct } from "@/api/pda/jobBooking.js";
import checkboxTable from "../componentsTable/checkbox/checkbox.vue";
import singleProductJobBom from "./singleProductJobBom.vue";
import { parameterGetByCode } from "@/api/mainData/index.js";
import { createInProductBatchTG } from "@/api/pda/jobBooking.js";
export default {
  props: {
    item: {
      type: Object,
      default: () => {},
    },
    notFormed: {
      type: Array,
      default: () => [],
    },
    isDetails: {
      type: Boolean,
      default: false,
    },
  },

  watch: {
    notFormed: {
      immediate: true,
      deep: true,
      handler(newVal) {
        this.notFormedList = newVal;
      },
    },
    item: {
      immediate: true,
      deep: true,
      handler(newVal) {
        if (!newVal.currentTaskDiagram.isFirstTask) {
          this.getSemiProductList(newVal);
        }
      },
    },
  },
  components: { checkboxTable, singleProductJobBom },
  data() {
    return {
      forValue: {},

      tableData: [],
      batchNo: "",
      notFormedList: [],
      clientEnvironmentId:
        uni.getStorageSync("userInfo") &&
        uni.getStorageSync("userInfo").clientEnvironmentId, // *1 主环境-601环境   2 soll-索尔环境    3 tg-碳谷环境
    };
  },
  created() {
    if (this.isDetails) {
      this.notFormedList = this.notFormedList.map((m) => {
        return {
          notFormedNum: Number(m.quantity),
          notFormedWeight: m.weight,
          ...m,
        };
      });
    }

    this.getByCode();

    console.log(this.item, "items");
  },

  methods: {
    tableDataFn(tableData) {
      console.log(tableData);
      let adultCount = 0;
      let noAdultCount = 0;

      this.arrDataStatistics(tableData);
      tableData.forEach((v) => {
        if (v.selected) {
          console.log(11111);
          if (v.extInfo.isQualified == 1) {
            adultCount += 1;
          } else {
            noAdultCount += 1;
          }
        }
      });
      this.$set(this.item.workReportInfo, "formedNum", adultCount);
      this.$set(this.notFormedList[0], "notFormedNum", noAdultCount);
      // this.tableData = this.notFormedList;
      if (!(this.clientEnvironmentId == 3 || this.item.singleReport !== 1)) {
        this.item.semiProductList = tableData;
      }
    },

    arrDataStatistics(arr) {
      console.log(arr);

      const adultCount = arr.filter(
        (user) => user.extInfo.isQualified == 1
      ).length;
      const noAdultCount = arr.filter(
        (user) => user.extInfo.isQualified !== 1
      ).length;

      console.log(adultCount, noAdultCount);
      this.$set(this.item.workReportInfo, "formedNum", adultCount);
      this.$set(this.notFormedList[0], "notFormedNum", noAdultCount);
    },

    getByCode() {
      parameterGetByCode({ code: "enable_quality_plus" }).then((res) => {
        if (
          res.value == "1" &&
          (this.item.currentTaskDiagram.type == 6 ||
            this.item.currentTaskDiagram.type == 2 ||
            this.item.currentTaskDiagram.type == 2)
        ) {
          uni.showModal({
            title: "提示",
            content: "质检需要去PC端进行",
            success: function (res) {
              if (res.confirm) {
                console.log("用户点击确定");
              } else if (res.cancel) {
                console.log("用户点击取消");
              }
            },
          });
        }
      });
    },

    getSemiProductList(newVal) {
      console.log(newVal);
      if (newVal.semiProductList.length) {
        newVal.semiProductList.map((v) => {
          v.selected = true;
        });
        this.arrDataStatistics(newVal.semiProductList);
        this.tableData = newVal.semiProductList;
      }
      if (newVal.pickOutInList.length) {
        newVal.pickOutInList.map((v) => {
          v.selected = true;
        });
        this.arrDataStatistics(newVal.pickOutInList);
        this.tableData = newVal.pickOutInList;
      }
    },

    singleQuery() {
      console.log(this.item.workReportInfo);

      if (!this.item.workReportInfo.formedNum)
        return uni.showToast({
          icon: "none",
          title: "请输入合格品数",
        });
      if (
        this.notFormedList[0].notFormedNum == "" ||
        this.notFormedList[0].notFormedNum == null
      )
        return uni.showToast({
          icon: "none",
          title: "请输入不合格品数",
        });

      const req = {
        formedNum: this.item.workReportInfo.formedNum,
        notFormedNum: this.notFormedList[0].notFormedNum,
        taskId: this.item.workReportInfo.taskId,
        workOrderId: this.item.workReportInfo.workOrderId,
      };

      createInProduct(req).then((res) => {
        if (res && res.length) {
          this.forValue = res[0];

          res.map((v) => {
            v.selected = true;
          });
          this.tableData = res;
          this.item.semiProductList = res;
        }
      });
    },

    singleQueryTg() {
      console.log(this.item.workReportInfo);

      if (!this.item.workReportInfo.formedNum)
        return uni.showToast({
          icon: "none",
          title: "请输入合格品数",
        });
      if (
        this.notFormedList[0].notFormedNum == "" ||
        this.notFormedList[0].notFormedNum == null
      )
        return uni.showToast({
          icon: "none",
          title: "请输入不合格品数",
        });

      const req = {
        formedNum: this.item.workReportInfo.formedNum,
        notFormedNum: this.notFormedList[0].notFormedNum,
        taskId: this.item.workReportInfo.taskId,
        workOrderId: this.item.workReportInfo.workOrderId,
      };

      createInProductBatchTG(req).then((res) => {
        if (res && res.length) {
          this.forValue = res[0];

          res.map((v) => {
            v.selected = true;
          });
          this.tableData = res;
          this.item.semiProductList = res;
        }
      });
    },

    /**
     * 更新批次号
     *
     * @param e 事件对象
     */
    batchNoNew(e) {
      this.item.workReportInfo.batchNo = this.item.batchNo + e.target.value;
    },

    setFormedNum(num) {
      this.item.workReportInfo.formedNum = num;

      let weight =
        Number(this.item.workReportInfo.formedNum) *
        Number(this.item.singleWeight) *
        Number(this.item.weightMultiple);

      if (["G", "g", "克"].includes(this.item.singleWeightUnit)) {
        weight = parseFloat((weight / 1000).toFixed(2));
      } else {
        weight = parseFloat(weight.toFixed(2));
      }

      this.$set(this.item.workReportInfo, "formedWeight", weight);

      this.$forceUpdate();
    },

    penalize() {
      this.$emit("penalize", null);
    },

    handleView(name) {
      uni.showToast({
        icon: "none",
        title: name || "未设置",
      });
    },

    blurNum(value) {
      let total = 0;
      //匹配非数字
      let val = value.formedNum;
      let reg = new RegExp("([^0-9]*)", "g");
      let ma = val.match(reg);
      //如果有非数字，替换成""
      if (ma.length > 0) {
        for (let k in ma) {
          if (ma[k] != "") {
            val = val.replace(ma[k], 0);
          }
        }
      }
      //可以为0，但不能以0开头
      if (val.startsWith("0") && val.length > 1) {
        val = val.substring(1, val.length);
      }
      value.formedNum = val;

      if (this.item.currentTaskDiagram.isFirstTask) {
        // formingNum 生产数量  feedQuantity   this.item.product[0] //投料数量
        if (value.formedNum > this.item.formingNum) {
          this.$set(
            this.item.workReportInfo,
            "workReportInfo",
            this.item.formingNum
          );
          this.$set(this.notFormedList[0], "notFormedNum", 0);
          this.notForme();
          return uni.showToast({
            icon: "none",
            title: "合格品数量不能大于要求生产数量",
          });
        }
      } else {
        if (this.item.product.length) {
          if (value.formedNum > this.item.product[0].feedQuantity) {
            console.log(this.item.product[0].feedQuantity);
            this.$set(
              this.item.workReportInfo,
              "workReportInfo",
              this.item.product[0].feedQuantity
            );
            this.$set(this.notFormedList[0], "notFormedNum", 0);
            this.notForme();
            return uni.showToast({
              icon: "none",
              title: "合格品数量不能大于投料数量",
            });
          }
        }
      }

      if (
        this.item.product[0] &&
        this.item.product[0].feedQuantity > 0 &&
        Number(this.item.workReportInfo.formedNum)
      ) {
        this.$set(
          this.notFormedList[0],
          "notFormedNum",
          this.item.product[0].feedQuantity -
            Number(this.item.workReportInfo.formedNum)
        );
        this.notForme();
      }

      let weight =
        Number(this.item.workReportInfo.formedNum) *
        Number(this.item.singleWeight) *
        Number(this.item.weightMultiple);

      if (["G", "g", "克"].includes(this.item.singleWeightUnit)) {
        weight = parseFloat((weight / 1000).toFixed(2));
      } else {
        weight = parseFloat(weight.toFixed(2));
      }

      this.$set(this.item.workReportInfo, "formedWeight", weight);

      total =
        Number(this.item.workReportInfo.formedNum) +
        Number(this.notFormedList[0].notFormedNum);

      console.log(total);

      this.$emit("modeNum", total);

      this.$forceUpdate();
    },

    notForme() {
      let weight =
        Number(this.notFormedList[0].notFormedNum) *
        Number(this.item.singleWeight) *
        Number(this.item.weightMultiple);
      if (
        this.item.singleWeightUnit == "G" ||
        this.item.singleWeightUnit == "g" ||
        this.item.singleWeightUnit == "克"
      ) {
        weight = parseFloat((weight / 1000).toFixed(2));
      } else {
        weight = parseFloat(weight.toFixed(2));
      }
      this.$set(this.notFormedList[0], "notFormedWeight", weight);

      if (
        this.item.product[0] &&
        this.item.product[0].feedQuantity > 0 &&
        Number(this.notFormedList[0].notFormedNum)
      ) {
        this.$set(
          this.item.workReportInfo,
          "formedNum",
          this.item.product[0].feedQuantity -
            Number(this.notFormedList[0].notFormedNum)
        );

        let weight =
          Number(this.item.workReportInfo.formedNum) *
          Number(this.item.singleWeight) *
          Number(this.item.weightMultiple);
        if (
          this.item.singleWeightUnit == "G" ||
          this.item.singleWeightUnit == "g" ||
          this.item.singleWeightUnit == "克"
        ) {
          weight = parseFloat((weight / 1000).toFixed(2));
        } else {
          weight = parseFloat(weight.toFixed(2));
        }
        this.$set(this.item.workReportInfo, "formedWeight", weight);
      }

      this.$forceUpdate();
    },

    changeNum(value) {
      // 不合格数量
      let val = value.notFormedNum;
      //匹配非数字
      let reg = new RegExp("([^0-9]*)", "g");
      let ma = val.match(reg);
      //如果有非数字，替换成""
      if (ma.length > 0) {
        for (let k in ma) {
          if (ma[k] != "") {
            val = val.replace(ma[k], "0");
          }
        }
      }
      //可以为0，但不能以0开头
      if (val.startsWith("0") && val.length > 1) {
        val = val.substring(1, val.length);
      }

      // this.$set(this.item.workReportInfo, 'formedNum', val)
      value.notFormedNum = val;

      console.log(Number(this.item.workReportInfo.formedNum), 1);
      console.log(Number(this.notFormedList[0].notFormedNum), 2);

      let total =
        Number(this.item.workReportInfo.formedNum) +
        Number(this.notFormedList[0].notFormedNum);

      console.log(total);

      this.$emit("modeNum", total);

      this.notForme();
      // this.blurNum()
    },
  },
};
</script>

<style lang="scss" scoped>
.unit-btn {
  background-color: #157a2c;
  height: 48rpx;
  padding: 0 20rpx;
  line-height: 48rpx;
  color: #fff;
}

.content_num {
  display: flex;
  align-items: center;
  padding: 0 4rpx;
  font-size: 26rpx !important;
  /deep/ .uni-input-input {
    border: 2rpx solid #f0f8f2;
    background: #f0f8f2;
    color: $theme-color;
  }
}

.item {
  display: flex;
  justify-content: space-between;
}

.title_box {
  margin-top: 20rpx;

  .name {
    font-size: 28rpx;
    font-style: normal;
    font-weight: 400;
    color: $theme-color;
    padding-left: 20rpx;

    position: relative;

    &:before {
      position: absolute;
      content: "";
      left: 0rpx;
      top: 0rpx;
      bottom: 0rpx;
      width: 4rpx;
      height: 28rpx;
      background: $theme-color;
      margin: auto;
    }
  }
}

.material {
  margin-top: 10rpx;

  .content_table {
    width: 100%;
    border: 2rpx solid $border-color;

    .item {
      display: flex;
      border-bottom: 2rpx solid $border-color;

      .lable {
        width: 132rpx;
        text-align: center;
        background-color: #f7f9fa;
        font-size: 26rpx;
        border-right: 2rpx solid $border-color;
        flex-shrink: 0;
      }

      .lable220 {
        width: 220rpx !important;
        font-size: 24rpx;
      }

      .lable150 {
        width: 156rpx !important;
        font-size: 24rpx;
      }

      .ww80 {
        width: 80rpx;
      }

      .content {
        width: 518rpx;
        min-height: 64rpx;
        font-size: 28rpx;
        line-height: 28rpx;
        font-style: normal;
        font-weight: 400;
        padding: 18rpx 8rpx;
        box-sizing: border-box;
        word-wrap: break-word;
        flex-grow: 1 !important;

        .unit {
          padding: 0 4rpx;
          font-size: 24rpx;
          color: #404446;
        }

        .penalize {
          width: 160rpx;
          line-height: 60rpx;
          background: $theme-color;
          font-size: 24rpx;
          text-align: center;
          color: #fff;
        }
      }

      .pd4 {
        padding: 4rpx 8rpx;
      }

      &:last-child {
        border-bottom: none;
      }
    }

    .ww55 {
      width: 55%;
    }

    .ww45 {
      width: 45%;
    }
  }
}
</style>