1

heshaofeng

2026-01-20 5dfd83bd540c2e43af2e0449c246c79a22cb1296

 ÏîÄ¿´úÂë/WIDESEA_WMSClient/src/views/index/Message.vue

@@ -1,56 +1,51 @@
<template>
  <div class="message-container">
    <div class="item" v-for="(item, index) in list" :key="index">
      <div class="title">{{ item.title }}({{ item.date }})</div>
      <div class="content">
        <el-row>
          <el-col :span="8">
            <label>收货单号：{{ item.formData.receiveOrderNo }}</label>
          </el-col>
          <el-col :span="8">
            <label>质检单号：{{ item.formData.checkOrderNo }}</label>
          </el-col>
          <el-col :span="8">
            <label>收货明细行号：{{ item.formData.receiveDetailRowNo }}</label>
          </el-col>
        </el-row>
    <!-- åŠ è½½çŠ¶æ€ -->
    <div v-if="loading" class="loading">加载中...</div>
    
    <!-- ç©ºæ•°æ®æç¤º -->
    <div v-else-if="!list.length" class="empty">暂无消息</div>
    
    <!-- æ¶ˆæ¯åˆ—表 -->
    <div v-else class="list-wrap">
      <div class="item" v-for="(item, index) in list" :key="index">
        <div class="title">{{ item.title }}({{ item.date }})</div>
        <div class="content">
          <el-row>
            <el-col :span="8">
              <label>质检结果：{{ item.formData.result || '未填写' }}</label>
            </el-col>
            <el-col :span="8">
              <label>质检单号：{{ item.formData.checkOrderNo || '未填写' }}</label>
            </el-col>
            <el-col :span="8">
              <label>批次：{{ item.formData.batchNo || item.formData.receiveDetailRowNo || '未填写' }}</label>
            </el-col>
          </el-row>

        <el-row>
          <el-col :span="8">
            <label>物料编号：{{ item.formData.materielCode }}</label>
          </el-col>
          <el-col :span="8">
            <label>合格数量：{{ item.formData.qualifiedQuantity }}</label>
          </el-col>
          <el-col :span="8">
            <label>特采数量：{{ item.formData.defectedQuantity }}</label>
          </el-col>
        </el-row>
          <el-row>
            <el-col :span="8">
              <label>物料编号：{{ item.formData.materielCode || '未填写' }}</label>
            </el-col>
            <el-col :span="8">
              <label>质检数量：{{ item.formData.receivedQuantity || '未填写' }}</label>
            </el-col>
            <el-col :span="8">
              <label>检验次数：{{ item.formData.inspectionNumber || '未填写' }}</label>
            </el-col>
          </el-row>

        <el-row>
          <el-col :span="8">
            <label>退货数量：{{ item.formData.returnQuantity }}</label>
          </el-col>
          <el-col :span="8">
            <label>报废数量：{{ item.formData.scrappedQuantity }}</label>
          </el-col>
          <el-col :span="8">
            <label>质检总数：{{ item.formData.receivedQuantity }}</label>
          </el-col>
        </el-row>
        
        <el-row>
          <el-col :span="16">
            <label>特采说明：{{ item.formData.defectedNote }}</label>
          </el-col>
          <el-col :span="8">
            <label>检验人：{{ item.formData.checkUserName }}</label>
          </el-col>
        </el-row>
      </div>
      <div style="margin-top: 20px">
        <el-button type="primary">同意</el-button
        ><el-button type="danger">驳回</el-button>
          <!-- è¡¥å……展示更多字段 -->
          <el-row v-if="item.formData.message" style="margin-top: 10px">
            <el-col :span="24">
              <label>备注：{{ item.formData.message }}</label>
            </el-col>
          </el-row>
        </div>
        <div style="margin-top: 20px">
          <el-button type="primary" @click="handleAgree(item)">同意</el-button>
          <el-button type="danger" @click="handleReject(item)">驳回</el-button>
        </div>
      </div>
    </div>
  </div>
@@ -58,51 +53,163 @@

<script>
export default {
  name: 'CheckOrderApproval',
  props: {
    list: {
      type: Array,
      default: () => {
        return [];
      },
      default: () => [],
    },
  },
  data() {
    return {
      // æœ¬åœ°ç»´æŠ¤åˆ—表数据（无初始模拟数据）
      localList: [],
      loading: false, // åŠ è½½çŠ¶æ€
    };
  },
  created() {
    // if (!this.list.length) {
    //   this.list.push({
    //     title: "IQC质检结果审批",
    //     formData: {
    //       receiveOrderNo: "收货单号",
    //       checkOrderNo: "质检单号",
    //       receiveDetailRowNo: "收货明细行号",
    //       materielCode: "物料编号",
    //       qualifiedQuantity: "合格数量",
    //       defectedQuantity: "特采数量",
    //       returnQuantity: "退货数量",
    //       scrappedQuantity: "报废数量",
    //       receivedQuantity: "质检总数",
    //       defectedNote: "特采说明",
    //       checkUserName: "检验人",
    //       message: "消息测试内容消息测试内容消息测试内容消息测试内容",
    //     },
    //     date: "2022-05-02 03:10",
    //   });
    // }
    // ä»…调用接口，无测试数据填充
    this.fetchCheckOrderList();
  },
  methods: {
    /**
     * è¯·æ±‚质检审批列表（无兜底数据）
     */
    fetchCheckOrderList() {
      const _this = this;
      _this.loading = true;
      
      _this.http
        .post(`api/CheckOrder/ReceiveReCheckOrder`, {}, "加载质检审批数据中...")
        .then((x) => {
          _this.loading = false;
          if (x.status) {
            // ä»…赋值接口返回的真实数据
            _this.localList = x.data || [];
          } else {
            // æ— å…œåº•æ•°æ®ï¼Œä»…提示错误，列表置空
            _this.$Message.error('加载质检审批数据失败');
            _this.localList = [];
          }
        })
        .catch((error) => {
          _this.loading = false;
          console.error('加载质检审批数据异常：', error);
          _this.$Message.error('加载质检审批数据异常，请稍后重试');
          // å¼‚常时列表置空，无兜底数据
          _this.localList = [];
        });
    },

    /**
     * åŒæ„å®¡æ‰¹ï¼ˆæ— æµ‹è¯•é€»è¾‘）
     */
    handleAgree(item) {
      const _this = this;
      _this.$confirm('确定同意该质检审批吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'info',
      }).then(() => {
        _this.http
          .post(`api/CheckOrder/AgreeReCheckOrder?orderNo=${item.formData.checkOrderNo}`, {}, "审批处理中...")
          .then((x) => {
            if (x.status) {
              _this.$Message.success('审批同意完成');
              _this.fetchCheckOrderList(); // åˆ·æ–°åˆ—表
            } else {
              return _this.$Message.error('审批同意失败');
            }
          })
          .catch((error) => {
            console.error('同意审批异常：', error);
            _this.$Message.error('审批同意异常，请稍后重试');
          });
      }).catch(() => {
        _this.$Message.info('已取消同意');
      });
    },

    /**
     * é©³å›žå®¡æ‰¹ï¼ˆæ— æµ‹è¯•é€»è¾‘）
     */
    handleReject(item) {
      const _this = this;
      _this.$prompt('请输入驳回原因', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
      }).then(({ value }) => {
        _this.http
          .post(
            `api/CheckOrder/RejectReCheckOrder?orderNo=${item.formData.checkOrderNo}`,
            { rejectReason: value },
            "审批驳回处理中..."
          )
          .then((x) => {
            if (x.status) {
              _this.$Message.success('审批驳回完成');
              _this.fetchCheckOrderList(); // åˆ·æ–°åˆ—表
            } else {
              return _this.$Message.error('审批驳回失败');
            }
          })
          .catch((error) => {
            console.error('驳回审批异常：', error);
            _this.$Message.error('审批驳回异常，请稍后重试');
          });
      }).catch(() => {
        _this.$Message.info('已取消驳回');
      });
    },
  },
  computed: {
    list() {
      return this.localList.length ? this.localList : this.$props.list;
    },
  },
};
</script>

<style scoped lang="less">
.message-container {
  min-height: 300px;
  padding: 10px;

  .loading,
  .empty {
    text-align: center;
    padding: 50px 0;
    color: #999;
    font-size: 14px;
  }

  .title {
    padding-bottom: 10px;
    font-weight: bold;
    font-size: 15px;
  }

  .item {
    border-bottom: 1px solid #eee;
    padding: 10px 20px;
    margin-bottom: 10px;
    background: #fafafa;
    border-radius: 4px;
  }

  .content {
    color: #1b1b1b;
    font-size: 14px;
    line-height: 1.8;

    label {
      display: block;
      word-break: break-all;
    }
  }

  .list-wrap {
    margin-top: 10px;
  }
}
</style>
</style>