aiot-app/pages/production/report/components/orderDetail/summary.vue

<template>
  <view class="summary card-content">
    <view v-for="item in processesList" :key="item.name">
      <view class="collapse-title">
        <view class="report-item">
          <view class="report-col">序号：{{ item.vornr }}</view>
          <view class="report-col">名称：{{ item.processes }}</view>
          <view class="report-col">在制品：<text :class="{'text-danger': !Number.isNaN(+item.workProgress) && (item.workProgress < 0)}">{{item.workProgress || 0}}</text></view>
          <view class="report-col">已合格：{{ item.lmnga || 0 }}</view>
          <view class="report-col">废品：{{ item.xmnga || 0 }}</view>
          <view class="report-col"
            ><text class="view-detail" @click="viewDetail(item)"
              >查看详情</text
            ></view
          >
        </view>
      </view>
    </view>

    <uni-popup ref="inputDialog" type="dialog">
      <view class="pup">
        <card>
          <text slot="title" class="dialog-title">工序报工信息</text>
          <text slot="right" class="view-detail" @click="handleClose"
            >关闭</text
          >
          <view class="msg-box" :key="detailObj.length">
            <view class="card-list" v-for="(itm, idx) in detailObj" :key="idx">
              <view
                class="list-item"
                v-for="(item, index) in processeDetail"
                :key="index"
              >
                <view class="label">{{ item.label }}</view>
                <view class="content"
                  >{{ itm[item.key]
                  }}<button
                    type="warn"
                    v-if="index === 0"
                    style=""
                    :disabled="
                      !canReport ||
                      currentObj.steus === 'W003' ||
                      orderStatus !== '在制' ||
                      currentObj.deptCode !== 'X12' ||
                      (!processOperation.includes(currentObj.operaDesc) &&
                        !processOperation.includes('ALL'))
                    "
                    @click="handleChargeOff(itm)"
                  >
                    冲销
                  </button></view
                >
              </view>
            </view>
            <view v-show="!detailObj.length" class="noData">暂无数据</view>
          </view>
        </card>
      </view>
    </uni-popup>
  </view>
</template>


<script>
import card from "@/components/card/card";
import { getReportByVornrId, chargeOff } from "@/api/report/index";

export default {
  components: { card },
  props: {
    processesList: {
      type: Array,
      default: () => [],
    },
    orderStatus: String,
    canReport: {
      type: Boolean,
      default: false,
    },
    processOperation: {
      type: Array,
      default: () => [],
    },
  },
  data() {
    return {
      processeDetail: [
        { label: "工序名称", key: "processes" },
        { label: "报工时间", key: "crtTime" },
        { label: "合格", key: "lmnga" },
        { label: "废品", key: "xmnga" },
        { label: "操作工", key: "actionName" },
        { label: "让步", key: "cmnga" },
        { label: "返修", key: "upmnga" },
        { label: "改型", key: "umnga" },
        // {label:'合格重量', key: 'zyzl'},
        { label: "小批次", key: "reciverBatch" },
        { label: "生产订单", key: "aufnr" },
        // {label:'其他', key: 'omnga'},
        { label: "设备号", key: "equipId" },
        { label: "炉次", key: "equipNum" },
        { label: "备注", key: "workDesc" },
        { label: "序号", key: "vornr" },
        { label: "返回料", key: "remnga" },
        { label: "返工料", key: "rmnga" },
        { label: "工艺曲线", key: "processCurve" },
        // {label:'转速', key: 'aa'},
        // {label:'工时系数', key: 'ratio'},
        // {label:'工时调整', key: 'adjust'},
        // {label:'实际工时', key: 'taskTime'},
        { label: "模孔数", key: "dieHole" },
        { label: "输入员", key: "crtName" },
        { label: "压力", key: "yl" },
        // {label:'合格单重', key: 'zydz'},
        { label: "料浆粘度", key: "ljnd" },
      ],
      detailObj: [],
      curId: null,
      currentObj:{}
    };
  },
  methods: {
    viewDetail(item) {
      this.curId = item.id;
      this.currentObj = item
      getReportByVornrId(item.id).then((res) => {
        this.detailObj = res;
      });
      this.$refs.inputDialog.open();
    },
    handleClose() {
      this.$refs.inputDialog.close();
    },

    handleChargeOff(itm) {
      const _this = this;
      uni.showModal({
        title: `确认冲销？`,
        content: "",
        confirmText: "确认",
        success: async function (res) {
          if (res.confirm) {
            console.log(44);
            const userInfo = uni.getStorageSync("userInfo");

            const params = {
              id: itm.id,
            };
            if (userInfo?.id) {
              params.userId = userInfo.id;
              params.userName = userInfo.name;
            }
            chargeOff(params)
              .then(() => {
                uni.showToast({
                  title: "冲销成功！",
                });
                setTimeout(() => {
                  getReportByVornrId(_this.curId).then((res) => {
                    _this.detailObj = res;
                  });
                  uni.$emit("chargeOff");
                }, 1500);
              })
              .catch((err) => {
                uni.showToast({
                  title: err,
                  icon: "none",
                });
              });
          }
        },
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.report-item {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  margin-bottom: 30rpx;
  padding: 10rpx 0;
  border-bottom: 1rpx solid #ccc;
  font-size: $uni-font-size-lg;

  .report-col {
    width: 50%;
    margin-bottom: 10rpx;

    .view-detail {
      width: 180rpx;
      height: 60rpx;
      line-height: 60rpx;
      color: $j-primary-green;
      margin: 0 0 0 auto;
    }
  }
}
.card-content {
  padding: 10rpx 10rpx 20rpx;
  font-size: $uni-font-size-lg;

  .collapse-title {
    display: flex;
    justify-content: space-between;
    padding: 16rpx 3% 16rpx;
  }
}

.msg-box {
  max-height: 65vh;
  width: 90vw;
  min-height: 30vh;
  font-size: $uni-font-size-lg;
  overflow: auto;
  padding: 10rpx;
  position: relative;
  .noData {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
}
.card-list {
  padding: 30rpx;
  border: 1rpx solid #000;
  border-radius: 20rpx;
  // border-bottom: 1rpx solid #ccc;
  margin-bottom: 20rpx;
  .list-item {
    border-bottom: 1rpx dashed #ccc;

    font-size: $uni-font-size-lg;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16rpx 0;

    .content {
      display: flex;
      justify-content: flex-end;
      align-items: center;

      button {
        width: 160rpx;
        height: 50rpx;
        line-height: 50rpx;
        margin: 0 0 0 10rpx;
        
      }
      uni-button[disabled]{
              background: #ccc !important;
          }
    }
  }
}

.dialog-title {
  line-height: 80rpx;
  font-size: $uni-font-size-lg;
}
.view-detail {
  padding: 0 30rpx;
  color: $j-primary-green;
  margin: 0 0 0 auto;
}
</style>