OQC检验

啊鑫

2025-07-16 1b8ed4768feeb6433cef55ea8e7c4ad7070c151c

 pages/QC/RKJ/Add.vue

@@ -1,566 +1,928 @@
<template>
   <view>
      <view class="form-container">
         <form :modelValue="formData">
            <view class="form-group">
               <label class="form-label">检验单号:</label>
               <input class="form-input" disabled="true" type="text" v-model="formData.releaseNo" />
            </view>
            <view class="form-group">
               <label class="form-label">创建人:</label>
               <input class="form-input" disabled="true" type="text" v-model="formData.createBy" />
            </view>
            <view class="form-group">
               <label class="form-label">创建时间:</label>
               <input class="form-input" disabled="true" type="text" v-model="formData.createDate" />
            </view>
            <view class="uni-form-item uni-column form-item edit">
               <text class="form-label">生产线别:</text>
               <superwei-combox v-if="isUpdate" :candidates="DAA020List" placeholder="请选择或输入"
                  v-model="formData.lineNo" @select="onDaa020Change" class="picker form-input"
                  style="border: none;"></superwei-combox>
               <input v-else class="form-input" disabled="true" type="text" v-model="formData.lineNo" />
            </view>
  <view class="container">
    <!-- 页面标题 -->
    <view class="page-header">
      <text class="page-title">检验单管理</text>
     <!-- <text v-if="isUpdate" class="page-status status-editable">编辑中</text>
      <text v-else class="page-status status-viewonly">已提交</text>
   --> </view>

            <view class="uni-form-item uni-column form-item edit">
               <text class="form-label">送检批次号:</text>
               <superwei-combox v-if="isUpdate" :candidates="DAA001List" placeholder="请选择或输入"
                  v-model="formData.billNo" @select="onDaa001Change" class="picker form-input"
                  style="border: none;"></superwei-combox>
               <input v-else class="form-input" disabled="true" type="text" v-model="formData.billNo" />
            </view>
            <view class="form-group">
               <label class="form-label">物料编码:</label>
               <input class="form-input" disabled="true" type="text" v-model="formData.itemNo" />
            </view>
            <!--        <view class="form-group">-->
            <!--          <label class="form-label">生产订单:</label>-->
            <!--          <input class="form-input" disabled="true" type="text" v-model="formData.mocode"/>-->
            <!--        </view>-->
            <view class="form-group">
               <label class="form-label">任务单号:</label>
               <input class="form-input" disabled="true" type="text" v-model="formData.taskNo" />
            </view>
            <view class="form-group">
               <label class="form-label">产品型号:</label>
               <input class="form-input" disabled="true" type="text" v-model="formData.itemModel" />
            </view>
            <view class="uni-title-sub uni-ellipsis-2">
               <view class="form-group">
                  <label class="form-label">产品名称:</label>
                  <input class="form-input" disabled="true" type="text" v-model="formData.itemName" />
               </view>
            </view>
		
            <view class="form-group">
               <label class="form-label">送检数量:</label>
               <input class="form-input" disabled="true" type="text" v-model="formData.quantity" />
            </view>
            <view class="form-group">
               <label class="form-label">不合格描述:</label>
               <input class="form-input" disabled="true" type="text" v-model="formData.remarks" />
            </view>
         </form>
      </view>
    <!-- 表单区域 -->
    <view class="form-container card">
      <form :modelValue="formData">
        <view class="form-grid">
          <view class="form-group col-2">
            <label class="form-label">检验单号:</label>
            <input class="form-input" disabled="true" type="text" v-model="formData.releaseNo" />
          </view>
          <view class="form-group col-2">
            <label class="form-label">创建人:</label>
            <input class="form-input" disabled="true" type="text" v-model="formData.createBy" />
          </view>
          <view class="form-group col-2">
            <label class="form-label">创建时间:</label>
            <input class="form-input" disabled="true" type="text" v-model="formData.createDate" />
          </view>
          <view class="form-group col-2">
            <label class="form-label">生产线别:</label>
            <superwei-combox v-if="isUpdate" :candidates="DAA020List" placeholder="请选择或输入"
              v-model="formData.lineNo" @select="onDaa020Change" class="picker form-input"
              style="border: none;"></superwei-combox>
            <input v-else class="form-input" disabled="true" type="text" v-model="formData.lineNo" />
          </view>
          <view class="form-group col-2">
            <label class="form-label">送检批次号:</label>
            <superwei-combox v-if="isUpdate" :candidates="DAA001List" placeholder="请选择或输入"
              v-model="formData.billNo" @select="onDaa001Change" class="picker form-input"
              style="border: none;"></superwei-combox>
            <input v-else class="form-input" disabled="true" type="text" v-model="formData.billNo" />
          </view>
          <view class="form-group col-2">
            <label class="form-label">物料编码:</label>
            <input class="form-input" disabled="true" type="text" v-model="formData.itemNo" />
          </view>
          <view class="form-group col-2">
            <label class="form-label">任务单号:</label>
            <input class="form-input" disabled="true" type="text" v-model="formData.taskNo" />
          </view>
          <view class="form-group col-2">
            <label class="form-label">产品型号:</label>
            <input class="form-input" disabled="true" type="text" v-model="formData.itemModel" />
          </view>
          <view class="form-group col-2">
            <label class="form-label">产品名称:</label>
            <input class="form-input" disabled="true" type="text" v-model="formData.itemName" />
          </view>
          <view class="form-group col-2">
            <label class="form-label">送检数量:</label>
            <input class="form-input" disabled="true" type="text" v-model="formData.quantity" />
          </view>
          <view class="form-group col-4">
            <label class="form-label">不合格描述:</label>
            <input class="form-input" disabled="true" type="text" v-model="formData.remarks" />
          </view>
        </view>
      </form>
    </view>

      <view class="list-container">
         <uni-table ref="table" border emptyText="暂无更多数据">
            <uni-tr>
               <uni-th align="center" class="th" style="color: #FFFFFF;">检验项目</uni-th>
               <uni-th align="center" class="th" style="color: #FFFFFF">是否合格</uni-th>
               <uni-th align="center" class="th" style="color: #FFFFFF">记录(点击)</uni-th>
            </uni-tr>
            <uni-tr v-for="(item, index) in tableData" :key="index">
               <uni-td align="center">
                  <input class="form-input" disabled="true" type="text" v-model="item.projName" />
               </uni-td>
               <uni-td align="center">
                  <input class="form-input" disabled="true" type="text" v-model="item.result" />
               </uni-td>
               <uni-td>
                  <view class="uni-group">
                     <button v-if="item.isCheck >=item.levelNum" type="default" @click="toDetail(item)">
                        {{ item.levelNum + '/' + item.isCheck }}
                     </button>
                     <button v-else type="warn" @click="toDetail(item)">
                        {{ item.levelNum + '/' + item.isCheck }}
                     </button>
                  </view>
               </uni-td>
            </uni-tr>
         </uni-table>
      </view>
    <!-- 检验项目表格区域 -->
    <view class="table-container card">
      <view class="table-header">
        <text class="section-title">检验项目列表</text>
      </view>
      <uni-table ref="table" border emptyText="暂无更多数据" class="custom-table">
        <uni-tr class="table-header-row">
          <uni-th align="center" class="th">检验项目</uni-th>
          <uni-th align="center" class="th">是否合格</uni-th>
          <uni-th align="center" class="th">记录详情</uni-th>
        </uni-tr>
        <uni-tr v-for="(item, index) in tableData" :key="index" class="table-row"
          :class="{ 'row-success': item.result === '合格', 'row-warning': item.result === '不合格', 'row-pending': item.result === '未完成' }">
          <uni-td align="center">
            <input class="form-input" disabled="true" type="text" v-model="item.projName" />
          </uni-td>
          <uni-td align="center">
            <input class="form-input" disabled="true" type="text" v-model="item.result" />
          </uni-td>
          <uni-td align="center">
            <view class="record-button-container">
              <button 
                :class="['record-button', item.isCheck >= item.levelNum ? 'complete' : 'incomplete', {'button-loading': item.isLoading}]" 
                @click="toDetail(item)"
                :disabled="isUpdate">
                <view class="record-status">
                  <text class="check-count">{{ item.isCheck }}/{{ item.levelNum }}</text>
                  <text class="status-text" v-if="item.isCheck >= item.levelNum">已完成</text>
                  <text class="status-text" v-else>待完成</text>
                </view>
                <view class="record-icon">
                  <i class="fa fa-arrow-right"></i>
                </view>
              </button>
            </view>
          </uni-td>
        </uni-tr>
      </uni-table>
    </view>

      <view class="plus-button">
         <button type="warn" v-if="isUpdate && !isShowTable" @click="getItem">生成检验单</button>
      </view>
      <view class="plus-button">
         <button type="warn" v-if="!isUpdate && !isShowTable" @click="toImage">上传/查看图片</button>
      </view>
      <view class="plus-button">
         <button type="warn" v-if="!isUpdate && !isShowTable" @click="saveRemarks">添加不合格描述</button>
      </view>
      <view class="plus-button">
         <button type="warn" v-if="!isUpdate && !formData.fcheckResu && !isShowTable" @click="removeXJ">删除单据</button>
      </view>
    <!-- 操作按钮区域 -->
    <view class="action-buttons-container button-group">
      <view class="plus-button">
        <view :class="['button button-warning', { 'button-loading': isLoading }]" 
              v-if="!isUpdate && !isShowTable" @click="submit">
          <text>审核单据</text>
        </view>
      </view>
      <view class="plus-button">
        <view :class="['button button-warning', { 'button-loading': isLoading }]" 
              v-if="isUpdate && !isShowTable" @click="getItem">
          <text>生成检验单</text>
        </view>
      </view>
      <view class="plus-button">
        <view :class="['button button-warning', { 'button-loading': isLoading }]" 
              v-if="!isUpdate && !isShowTable" @click="toImage">
          <text>上传/查看图片</text>
        </view>
      </view>
      <view class="plus-button">
        <view :class="['button button-warning', { 'button-loading': isLoading }]" 
              v-if="!isUpdate && !isShowTable" @click="saveRemarks">
          <text>添加不合格描述</text>
        </view>
      </view>
      <view class="plus-button">
        <view :class="['button button-warning', { 'button-loading': isLoading }]" 
              v-if="isShowTable" @click="getTable">
          <text>获取检验项目</text>
        </view>
      </view>
      <view class="plus-button">
        <view :class="['button button-warning', { 'button-loading': isLoading }]" 
              v-if="isShowTable && isUpdate" @click="saveTable">
          <text>生成检验项目</text>
        </view>
      </view>
    </view>

      <view class="plus-button">
         <button type="warn" v-if="isShowTable" @click="getTable">获取检验项目</button>
      </view>

      <view class="plus-button">
         <button type="warn" v-if="isShowTable && isUpdate" @click="saveTable">生成检验项目</button>
      </view>


      <view v-if="showPopup" class="overlay">
         <view class="popup">
            <h3>修改不合格描述</h3>
            <form>
               <view class="form-group">
                  <label class="form-label">不合格描述:</label>
                  <input class="form-input" type="text" v-model="remarks" />
               </view>
               <button type="warn" @click="edit">修改</button>
               <button @click="showPopup = !showPopup">取消</button>
            </form>
         </view>
      </view>

   </view>
    <!-- 弹出层 -->
    <view v-if="showPopup" class="overlay">
      <view class="popup card">
        <h3>修改不合格描述</h3>
        <form>
          <view class="form-group">
            <label class="form-label">不合格描述:</label>
            <input class="form-input" type="text" v-model="remarks" />
          </view>
          <view class="button-group">
            <view class="button button-success" @click="edit">
              <text>修改</text>
            </view>
            <view class="button button-default" @click="showPopup = !showPopup">
              <text>取消</text>
            </view>
          </view>
        </form>
      </view>
    </view>
  </view>
</template>

<script>
   export default {
      data() {
         return {
            formData: {
               id: "",
               releaseNo: "",
               createBy: "",
               createDate: "",
               daa020: "",
               itemNo: "",
               billNo: "",
               catQty: "",
               detailMem: "",
               taskNo: "",
               fcheckResu: "",
               remarks: "",
               itemId:"",
               itemName:"",
               itemModel:"",
            },
  export default {
    data() {
      return {
        formData: {
          id: "",
          releaseNo: "",
          createBy: "",
          createDate: "",
          daa020: "",
          itemNo: "",
          billNo: "",
          catQty: "",
          detailMem: "",
          taskNo: "",
          fcheckResu: "",
          remarks: "",
          itemId:"",
          itemName:"",
          itemModel:"",
        },

            DAA020List: [],
        DAA020List: [],

            DAA001List: [],
        DAA001List: [],

            BillNoList: [],
        BillNoList: [],

            lineList: [],
        lineList: [],

            lineNo: "",
        lineNo: "",

            tableData: [],
        tableData: [],

            isSubmit: true,
        isSubmit: true,

            isUpdate: true,
        isUpdate: true,

            isShowTable: false,
        isShowTable: false,

            remarks: "",
        remarks: "",

            showPopup: false,
         };
      },
      onLoad(options) {
         //options中包含了url附带的参数
        showPopup: false,
        
        // 新增：加载状态控制
        isLoading: false,
      };
    },
    onLoad(options) {
      let params = options;

         let params = options;
      if (params["id"]) {
        this.isUpdate = false;
        this.formData.id = params["id"];
        this.formData.releaseNo = params["releaseNo"];
        this.init();
      } else {
        this.$post({
          url: "/RKJ/getMaxReleaseNo"
        }).then(res => {
          this.formData.releaseNo = res.data.tbBillList;
          this.formData.createBy = this.$loginInfo.account;
          this.formData.createDate = this.$getDate("yyyy-mm-dd");
        });

         if (params["id"]) {
            this.isUpdate = false;
            this.formData.id = params["id"];
            this.formData.releaseNo = params["releaseNo"];
            //getQaItemXj02
            this.init();
         } else {
            //初始化检验单号
            this.$post({
               url: "/RKJ/getMaxReleaseNo"
            }).then(res => {
               this.formData.releaseNo = res.data.tbBillList;
               this.formData.createBy = this.$loginInfo.account;
               this.formData.createDate = this.$getDate("yyyy-mm-dd");
            });
        this.$post({
          url: "/XJ/getLineAll"
        }).then(res => {
          this.lineList = res.data.tbBillList;
          this.DAA020List = res.data.tbBillList.map(item => item.lineName);
        })
      }
    },
    methods: {
      removeXJ() {
        if (this.formData.id) {
          this.$post({
            url: "/RKJ/removeXJ",
            data: {
              id: this.formData.id
            }
          }).then(res => {
            if (res.data.tbBillList > 0) {
              this.$showMessage("删除成功");
              uni.navigateBack();
            } else {
              this.$showMessage("删除失败");
            }
          });
        } else {
          this.$showMessage("请先选择检验单号");
        }
      },
      getItem() {
        if (!this.formData.billNo) {
          this.$showMessage("请选择送检批次号");
          return;
        }

            //车间下拉框的初始化
            this.$post({
               url: "/XJ/getLineAll"
            }).then(res => {
               this.lineList = res.data.tbBillList;
               this.DAA020List = res.data.tbBillList.map(item => item.lineName);
            })
         }
      },
      methods: {
         removeXJ() {
            if (this.formData.id) {
               this.$post({
                  url: "/RKJ/removeXJ",
                  data: {
                     id: this.formData.id
                  }
               }).then(res => {
                  if (res.data.tbBillList > 0) {
                     this.$showMessage("删除成功");
                     //关闭当前页面，返回上一页面或多级页面
                     uni.navigateBack();
                  } else {
                     this.$showMessage("删除失败");
                  }
               });
            } else {
               this.$showMessage("请先选择检验单号");
            }
         },
         getItem() {
        if (this.isSubmit) {
          this.$showMessage("此物料无启用的检验项目，请维护!");
          return;
        }

            if (!this.formData.billNo) {
               this.$showMessage("请选择送检批次号");
               return;
            }
        // 显示加载状态
        this.isLoading = true;
        
        this.$post({
          url: "/RKJ/save",
          data: {
            from: this.formData,
            userNo: this.$loginInfo.account,
            items: this.tableData
          }
        }).then(res => {
          // 隐藏加载状态
          this.isLoading = false;
          
          this.formData.id = res.data.tbBillList;
          this.$showMessage("生成检验项目成功");
          this.init();
          this.isUpdate = false;
        });
      },
      onDaa020Change(event) {
        this.formData.lineName = event;
        this.lineNo = this.lineList[this.DAA020List.indexOf(event)].lineNo;
        this.formData.line = this.lineNo;

            if (this.isSubmit) {
               this.$showMessage("此物料无启用的检验项目，请维护!");
               return;
            }
        this.$post({
          url: "/RKJ/getDaa001",
          data: {
            lineNo: this.lineNo
          }
        }).then(res => {
          this.BillNoList = res.data.tbBillList;
          this.DAA001List = res.data.tbBillList.map(s => s.billNo);

            this.$post({
               url: "/RKJ/save",
               data: {
                  from: this.formData,
                  userNo: this.$loginInfo.account,
                  //moidNum: this.formData.moidNum
                  items: this.tableData
               }
            }).then(res => {
               this.formData.id = res.data.tbBillList;
               this.$showMessage("生成检验项目成功");
               this.init();
               this.isUpdate = false;
            });
         },
         //生产线别选择并初始话工单号
         onDaa020Change(event) {
            //获取生产线别的下标地址
            this.formData.lineName = event;
          this.formData.billNo = "";
          this.formData.mocode = "";
          this.formData.boardModel = "";
          this.formData.taskNo = "";
          this.formData.itemNo = "";
          this.formData.boardName = "";
          this.formData.quantity = "";
          this.tableData = [];
        })
      },
      onDaa001Change(e) {
        this.formData.billNo = e;
        let data = this.BillNoList[this.DAA001List.indexOf(e)];

            this.lineNo = this.lineList[this.DAA020List.indexOf(event)].lineNo;
        if (!data) {
          this.formData.billNo = "";
          this.formData.mocode = "";
          this.formData.boardModel = "";
          this.formData.taskNo = "";
          this.formData.itemNo = "";
          this.formData.boardName = "";
          this.formData.quantity = "";
          this.tableData = [];
          return;
        }
        this.formData.billNo = data.billNo;
        this.formData.mocode = data.mocode;
        this.formData.boardModel = data.boardModel;
        this.formData.taskNo = data.taskNo;
        this.formData.itemNo = data.itemNo;
        this.formData.boardName = data.boardName;
        this.formData.quantity = data.quantity;

            this.formData.line = this.lineNo;
        this.$post({
          url: "/RKJ/setJYItem",
          data: {
            itemId: this.formData.itemId,
            quantity: this.formData.quantity
          }
        }).then(res => {
          this.tableData = res.data.tbBillList;
          if (this.tableData.length === 0) {
            this.$showMessage("该物料没有检验项目");
            this.isSubmit = true;
            this.tableData = [];
          } else {
            this.isSubmit = false;
          }
        });
      },
      submit() {
        // 显示加载状态
        this.isLoading = true;
        
        this.$post({
          url: "/RKJ/RKJQaSubmit",
          data: {
            userNo: this.$loginInfo.account,
            gid: this.formData.id
          }
        }).then(res => {
          // 隐藏加载状态
          this.isLoading = false;
          
          if (res.statusCode === 200) {
            this.$showMessage("成功提交检验");
            setTimeout(() => {
              this.hideCustomMessage();
            }, 7000);
          } else {
            this.$showMessage(res.data.message);
          }
        })
      },
      init() {
        this.$post({
          url: "/RKJ/getPage",
          data: {
            id: this.formData.id,
            pageIndex: 1,
            limit: 1,
          }
        }).then(res => {
          let data = res.data.tbBillList[0];
          if (data) {
            this.formData = data;

            this.$post({
               url: "/RKJ/getDaa001",
               data: {
                  lineNo: this.lineNo
               }
            }).then(res => {
               this.BillNoList = res.data.tbBillList;
               this.DAA001List = res.data.tbBillList.map(s => s.billNo);

               this.formData.billNo = "";
               this.formData.mocode = "";
               this.formData.boardModel = "";
               this.formData.taskNo = "";
               this.formData.itemNo = "";
               this.formData.boardName = "";
               this.formData.quantity = "";
               this.tableData = [];
            })
         },
         //选取工单填充物料号和其他信息
         onDaa001Change(e) {

            this.formData.billNo = e;

            let data = this.BillNoList[this.DAA001List.indexOf(e)];

            //当返回的结果集为空时置空原有的值
            if (!data) {
               this.formData.billNo = "";
               this.formData.mocode = "";
               this.formData.boardModel = "";
               this.formData.taskNo = "";
               this.formData.itemNo = "";
               this.formData.boardName = "";
               this.formData.quantity = "";
               this.tableData = [];
               return;
            }
            //不为空时赋值
            this.formData.billNo = data.billNo;
            this.formData.mocode = data.mocode;
            this.formData.boardModel = data.boardModel;
            this.formData.taskNo = data.taskNo;
            this.formData.itemNo = data.itemNo;
            this.formData.boardName = data.boardName;
            this.formData.quantity = data.quantity;


            this.$post({
               url: "/RKJ/setJYItem",
               data: {
                  itemId: this.formData.itemId,
                  quantity: this.formData.quantity
               }
            }).then(res => {
               this.tableData = res.data.tbBillList;
               if (this.tableData.length === 0) {
                  this.$showMessage("该物料没有检验项目");
                  this.isSubmit = true;
                  this.tableData = [];
               } else {
                  this.isSubmit = false;
               }
            });
         },
         init() {
            this.$post({
               url: "/RKJ/getPage",
               data: {
                  id: this.formData.id,
                  pageIndex: 1,
                  limit: 1,
               }
            }).then(res => {
               let data = res.data.tbBillList[0];
               if (data) {
                  this.formData = data;

                  this.$post({
                     url: "/RKJ/getItems",
                     data: {
                        pid: this.formData.id
                     }
                  }).then(res1 => {

                     let tableData = res1.data.tbBillList

                     //当已检验个数都不为空时按照检测结构排序
                     tableData.sort((a, b) => {
                        if (a.result === '未完成' && b.result === '合格') {
                           return -1;
                        } else if (a.result === '合格' && b.result === '未完成') {
                           return 1;
                        } else {
                           return 0;
                        }
                     });
                     this.tableData = tableData;

                     if (this.tableData.length === 0) {
                        this.isShowTable = true;
                     }
                  })
               }
            });
         },
         toDetail(item) {

            if (this.isUpdate) {
               uni.showToast({
                  icon: "none",
                  title: "请先生成检验项目",
                  duration: 2000,
               });
            } else {
               uni.navigateTo({
                  url: 'detail?id=' + item.id + '&billNo=' + this.formData.billNo + '&gid=' + this.formData
                     .id
               });
            }
         },
         toImage() {
            uni.navigateTo({
               url: 'ImageItem?id=' + this.formData.id
            });
         },
         saveRemarks() {
            this.showPopup = !this.showPopup;
            this.remarks = this.formData.remarks;
         },
         edit() {
            if (this.remarks) {
               //saveRemarksGid
               this.$post({
                  url: "/RKJ/saveRemarksGid",
                  data: {
                     gid: this.formData.id,
                     remarks: this.remarks
                  }
               }).then(res => {
                  if (res.data.tbBillList > 0) {
                     this.formData.remarks = this.remarks;
                     this.showPopup = !this.showPopup;
                     this.$showMessage("保存成功");
                  }
               })
            }
         },
         getTable() {
            this.$post({
               url: "/RKJ/setJYItem",
               data: {
                  itemId: this.formData.itemId,
                  quantity: this.formData.quantity
               }
            }).then(res => {

               this.tableData = res.data.tbBillList;
					
               if (this.tableData.length === 0) {
						
						
                  this.$showMessage("该物料条码没有检验项目");
                  this.isSubmit = true;
                  this.tableData = [];
                  this.isShowTable = true;
                  this.isUpdate = false;
						
               } else {
						
                  this.isSubmit = false;
                  this.isShowTable = true;
                  this.isUpdate = true;
						
               }
				
            });
         },
         saveTable() {
            if (this.tableData.length === 0) {
               return;
            }
            this.$post({
               url: "/RKJ/saveItem",
               data: {
                  gid: this.formData.id,
                  items: this.tableData,
                  userNo: this.$loginInfo.account
               }
            }).then(res => {
               this.formData.id = res.data.tbBillList;
               this.isShowTable = false;
               this.isUpdate = false;
               this.init();
            })
         }
      },
      onShow() {
         //每次进入页面都会执行的方法
         if (this.formData.id) {
            this.init();
         }
      },
   };
            this.$post({
              url: "/RKJ/getItems",
              data: {
                pid: this.formData.id
              }
            }).then(res1 => {
              let tableData = res1.data.tbBillList;
              tableData.sort((a, b) => {
                if (a.result === '未完成' && b.result === '合格') return -1;
                if (a.result === '合格' && b.result === '未完成') return 1;
                return 0;
              });
              this.tableData = tableData;
              if (this.tableData.length === 0) {
                this.isShowTable = true;
              }
            })
          }
        });
      },
      toDetail(item) {
        if (this.isUpdate) {
          uni.showToast({
            icon: "none",
            title: "请先生成检验项目",
            duration: 2000,
          });
          return;
        }
        
        // 设置当前项目的加载状态
        item.isLoading = true;
        
        uni.navigateTo({
          url: 'detail?id=' + item.id + '&billNo=' + this.formData.billNo + '&gid=' + this.formData.id + '&releaseNo=' + this.formData.releaseNo,
          complete: () => {
            // 页面跳转完成后，取消加载状态
            item.isLoading = false;
          }
        });
      },
      toImage() {
        // 显示加载状态
        this.isLoading = true;
        
        uni.navigateTo({
          url: 'ImageItem?id=' + this.formData.id,
          complete: () => {
            // 页面跳转完成后，取消加载状态
            this.isLoading = false;
          }
        });
      },
      saveRemarks() {
        this.showPopup = !this.showPopup;
        this.remarks = this.formData.remarks;
      },
      edit() {
        if (this.remarks) {
          // 显示加载状态
          this.isLoading = true;
          
          this.$post({
            url: "/RKJ/saveRemarksGid",
            data: {
              gid: this.formData.id,
              remarks: this.remarks
            }
          }).then(res => {
            // 隐藏加载状态
            this.isLoading = false;
            
            if (res.data.tbBillList > 0) {
              this.formData.remarks = this.remarks;
              this.showPopup = !this.showPopup;
              this.$showMessage("保存成功");
            }
          })
        }
      },
      getTable() {
        // 显示加载状态
        this.isLoading = true;
        
        this.$post({
          url: "/RKJ/setJYItem",
          data: {
            itemId: this.formData.itemId,
            quantity: this.formData.quantity
          }
        }).then(res => {
          // 隐藏加载状态
          this.isLoading = false;
          
          this.tableData = res.data.tbBillList;
          if (this.tableData.length === 0) {
            this.$showMessage("该物料条码没有检验项目");
            this.isSubmit = true;
            this.tableData = [];
            this.isShowTable = true;
            this.isUpdate = false;
          } else {
            this.isSubmit = false;
            this.isShowTable = true;
            this.isUpdate = true;
          }
        });
      },
      saveTable() {
        if (this.tableData.length === 0) {
          return;
        }
        
        // 显示加载状态
        this.isLoading = true;
        
        this.$post({
          url: "/RKJ/saveItem",
          data: {
            gid: this.formData.id,
            items: this.tableData,
            userNo: this.$loginInfo.account
          }
        }).then(res => {
          // 隐藏加载状态
          this.isLoading = false;
          
          this.formData.id = res.data.tbBillList;
          this.isShowTable = false;
          this.isUpdate = false;
          this.init();
        })
      }
    },
    onShow() {
      if (this.formData.id) {
        this.init();
      }
    },
  };
</script>

<style>
   .form-group {
      display: flex;
      align-items: center;
      border-bottom: 1px solid #c9c9c9;
   }
  .container {
    padding: 15px;
    background-color: #f9fafb;
  }

   .form-label {
      margin-bottom: 0;
      padding: 5px;
   }
  .page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 2px solid #e5edff;
  }

   .form-input {
      flex: 1;
      margin-bottom: 0;
      padding: 5px;
   }
  .page-title {
    font-size: 22px;
    font-weight: 700;
    color: #3498db;
  }

  .page-status {
    font-size: 13px;
    padding: 4px 10px;
    border-radius: 18px;
    font-weight: 500;
  }

  .status-editable {
    background-color: #e6f2ff;
    color: #3498db;
  }

  .status-viewonly {
    background-color: #e6ffed;
    color: #27ae60;
  }

  .card {
    background-color: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(52, 152, 219, 0.1);
    padding: 20px;
    margin-bottom: 15px;
    transition: transform 0.3s;
  }

  .card:hover {
    transform: translateY(-3px);
  }

  .form-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
  }

  .form-group {
    display: flex;
    flex-direction: column;
    border-bottom: 1px solid #ebf2ff;
    padding-bottom: 12px;
  }

  .col-2 {
    grid-column: span 2;
  }

  .col-4 {
    grid-column: span 4;
  }

  .form-label {
    font-size: 13px;
    color: #7f8c8d;
    margin-bottom: 6px;
    font-weight: 500;
  }

  .form-input {
    padding: 8px 12px;
    border: 1px solid #dfe6e9;
    border-radius: 8px;
    font-size: 13px;
    color: #2c3e50;
    background-color: #f9f9f9;
  }

  .form-input:disabled {
    background-color: #f1f2f6;
    color: #95a5a6;
    cursor: not-allowed;
  }

  .picker {
    flex: 1;
    margin-bottom: 0;
    padding: 8px 12px;
    border: 1px solid #dfe6e9;
    border-radius: 8px;
    font-size: 13px;
    color: #2c3e50;
    background-color: #f9f9f9;
  }

  .table-container {
    margin-bottom: 15px;
  }

  .table-header {
    margin-bottom: 12px;
  }

  .section-title {
    font-size: 16px;
    font-weight: 600;
    color: #2c3e50;
  }

  .custom-table {
    width: 100%;
  }

  .table-header-row {
    background-color: #3498db;
    color: #fff;
  }

  .th {
    padding: 10px 12px;
    text-align: center;
    font-weight: 500;
    font-size: 13px;
  }

  .table-row {
    transition: background-color 0.3s;
  }

  .table-row:hover {
    background-color: #f8f9fa;
  }

  .table-row td {
    padding: 10px 12px;
    border-bottom: 1px solid #ebf2ff;
    font-size: 13px;
    color: #34495e;
  }

  .row-success td {
    background-color: #e8f5e9;
  }

  .row-warning td {
    background-color: #fff3e0;
  }

  .row-pending td {
    background-color: #f5f5f5;
  }

  .plus-button {
    display: flex;
    justify-content: center;
    margin-bottom: 10px;
  }

  /* 基础按钮样式 - 统一规范 */
  .button {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 24px;
    height: 40px;
    font-size: 14px;
    font-weight: 500;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(231, 76, 60, 0.25);
  }

  /* 主操作按钮 - 警告类型（原红色按钮） */
  .button-warning {
    background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%);
    color: #ffffff;
  }

  /* 次要操作按钮 - 默认类型 */
  .button-default {
    background-color: #f5f7fa;
    color: #6c757d;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  }

  /* 成功操作按钮 - 绿色类型 */
  .button-success {
    background: linear-gradient(135deg, #2ecc71 0%, #27ae60 100%);
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(46, 204, 113, 0.3);
  }

  /* 按钮悬停效果 */
  .button-warning:hover,
  .button-default:hover,
  .button-success:hover {
    transform: translateY(-3px);
  }

  /* 按钮点击效果 */
  .button-warning:active,
  .button-default:active,
  .button-success:active {
    transform: translateY(1px);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
  }

  /* 按钮加载状态 */
  .button-loading {
    cursor: progress;
  }

  .button-loading::after {
    content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: spin 1s linear infinite;
  }

  .button-default.button-loading::after {
    border-top-color: #6c757d;
  }

  .button-success.button-loading::after {
    border-top-color: #ffffff;
  }

  /* 禁用状态按钮 */
  .button:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none !important;
    box-shadow: none !important;
  }

  /* 加载动画 */
  @keyframes spin {
    to {
      transform: rotate(360deg);
    }
  }

  /* 按钮图标样式 - 支持左侧图标 */
  .button-icon {
    margin-right: 8px;
    font-size: 16px;
  }

  /* 按钮组样式 - 优化按钮间距 */
  .button-group {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
    margin: 15px 0;
  }

  /* 记录按钮样式 */
  .record-button-container {
    display: flex;
    justify-content: center;
  }

  .record-button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 120px;
    height: 36px;
    border-radius: 18px;
    padding: 0 16px;
    transition: all 0.3s ease;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }

  .record-button.complete {
    background: linear-gradient(135deg, #2ecc71 0%, #27ae60 100%);
    color: white;
    box-shadow: 0 4px 12px rgba(46, 204, 113, 0.3);
  }

  .record-button.incomplete {
    background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%);
    color: white;
    box-shadow: 0 4px 12px rgba(231, 76, 60, 0.3);
  }

  .record-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
  }

  .record-button:active {
    transform: translateY(1px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  }

  .record-button:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none !important;
    box-shadow: none !important;
  }


   .picker {
      flex: 1;
      margin-bottom: 0;
      padding: 5px;
      font-size: 12px;
   }

   .uni-form-item {
      display: flex;
      border-bottom: 1px solid #c9c9c9;
   }
  .check-count {
    font-size: 12px;
    font-weight: 600;
  }

   .edit {
      background-color: white;
   }
  .status-text {
    font-size: 10px;
    opacity: 0.8;
  }

   /* 默认样式 */
   .list-container {
      height: 60vh;
      /* 设置列表容器的高度为剩余空间，并减去表单容器的高度 */
      overflow-y: auto;
      /* 允许列表容器垂直滚动 */
      padding: 10px;
      /* 可选：添加一些内边距，使列表内容更美观 */
   }
  .record-icon {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
  }

   /* 在小屏幕设备上，重置高度为适应屏幕 */
   @media (max-width: 768px) {
      .list-container {
         height: calc(100vh - 500px);
         /* 适当调整高度 */
      }
   }
  /* 记录按钮加载状态 */
  .record-button.button-loading::after {
    content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: spin 1s linear infinite;
    right: 16px;
  }

  .record-button.button-loading .record-icon {
    opacity: 0;
  }

   .form-container {
      padding: 10px;
      /* 可选：添加一些内边距，使表单内容更美观 */
   }
  .overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
  }

   .th {
      background-color: lightskyblue;
      color: #FFFFFF;
   }
  .popup {
    background-color: #fff;
    padding: 20px;
    border: 1px solid #ccc;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    width: 80vw;
    border-radius: 10px;
  }


   .plus-button {
      line-height: 59px;
      font-size: 24px;
      cursor: pointer;
      z-index: 1000;
      margin-bottom: 10px;
   }

   .overlay {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.5);
      display: flex;
      justify-content: center;
      align-items: center;
   }

   .popup {
      background-color: #fff;
      padding: 20px;
      border: 1px solid #ccc;
      box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
      width: 68vw;
      /* 设置宽度为视口宽度的80% */
      height: 25vh;
      /* 设置高度为视口高度的80% */
   }
  h3 {
    font-size: 16px;
    margin-bottom: 15px;
    color: #2c3e50;
  }
</style>