feat(order): 添加订单委托要求字段并优化界面流程 - 新增分包内容、样品处置、结果评价、报告交付方式等委托要求字段 - 添加分包单位信息、...

liding

2026-09-23 ce2570f8555ff6668da4f149521b4620bdd9d8bf

 src/views/CNAS/process/disposal/sampleReceipt/index.vue

@@ -1,119 +1,102 @@
<template>
  <div class="capacity-scope">
    <div style="display: flex;justify-content: space-between;align-items: flex-start">
      <el-form :model="queryParams0" ref="queryParams0" size="small" :inline="true">
        <el-form-item label="收样日期" prop="receiveDate">
          <el-date-picker v-model="queryParams0.receiveDate" type="date" placeholder="选择日期" format="yyyy-MM-dd"
                          value-format="yyyy-MM-dd" size="small" @change="refreshTable()">
          </el-date-picker>
  <div class="app-container">
    <div class="search">
      <el-form :model="queryParams" ref="queryParams" size="small" :inline="true">
        <el-form-item label="委托编号" prop="entrustCode">
          <el-input v-model="queryParams.entrustCode" clearable placeholder="请输入" size="small"
                    @keyup.enter.native="refreshTable"></el-input>
        </el-form-item>
        <el-form-item label="样品编号" prop="sampleCode">
          <el-input v-model="queryParams.sampleCode" clearable placeholder="请输入" size="small"
                    @keyup.enter.native="refreshTable"></el-input>
        </el-form-item>
        <el-form-item label="样品名称" prop="sampleName">
          <el-input v-model="queryParams.sampleName" clearable placeholder="请输入" size="small"
                    @keyup.enter.native="refreshTable"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" size="mini" @click="refreshTable">查询</el-button>
          <el-button size="mini" type="primary" @click="refreshTable">查询</el-button>
          <el-button size="mini" @click="refresh">重置</el-button>
        </el-form-item>
      </el-form>
      <el-button size="small" @click="handleDown0">导出</el-button>
    </div>

    <div class="table">
      <lims-table :tableData="tableData0" :column="column0" :tableLoading="tableLoading0"
                  key="tableData0"
                  :height="'calc(100vh - 240px)'" :page="page0" @pagination="pagination0">
        <div slot="action" slot-scope="scope">
          <el-button type="text" @click="handleAdd(scope.row)">编辑</el-button>
          <el-button type="text" @click="delRow(scope.row)">
            <span style="color: #F56C6C">删除</span>
          </el-button>
    <div class="container">
      <div class="table-tab">
        <div>
          <ul class="tab">
            <li :class="{ active: tabIndex === 0 }" @click="handleTab(0)">待接收</li>
            <li :class="{ active: tabIndex === 1 }" @click="handleTab(1)">已提交</li>
            <li :class="{ active: tabIndex === 2 }" @click="handleTab(2)">已拒收</li>
            <li :class="{ active: tabIndex === 3 }" @click="handleTab(3)">已取消</li>
            <li :class="{ active: tabIndex === 4 }" @click="handleTab(4)">全部</li>
          </ul>
        </div>
      </lims-table>
        <div>
          <el-button size="small" @click="handleExport">导出</el-button>
        </div>
      </div>
      <div class="table">
        <lims-table :tableData="tableData" :column="column" @pagination="pagination"
                    :height="'calc(100vh - 280px)'" :key="upIndex" :page="page" :tableLoading="tableLoading">
          <template slot="inspectionItem" slot-scope="scope">
            <div style="white-space: pre-line; text-align: left; padding: 4px 0;">{{ scope.row.inspectionItem }}</div>
          </template>
          <template slot="remark" slot-scope="scope">
            <span>{{ scope.row.status === 2 && scope.row.rejectRemark ? scope.row.rejectRemark : scope.row.remark }}</span>
          </template>
          <template slot="action" slot-scope="scope">
            <el-button v-if="scope.row.status === 0" type="text" @click="handleEdit(scope.row)">编辑</el-button>
            <el-button v-else type="text" @click="handleView(scope.row)">查看</el-button>
          </template>
        </lims-table>
      </div>
    </div>
    <!-- 新增样品 -->
    <el-dialog :title="title" :visible.sync="addDialogVisible" width="400px">
      <el-row>
        <el-col :span="24" style="margin-bottom: 16px;">
          <div class="search_thing">
            <div class="search_label">收样日期：</div>
            <div class="search_input">
              <el-date-picker v-model="addInfo.receiveDate" type="date" size="small" placeholder="选择日期" format="yyyy-MM-dd"
                              value-format="yyyy-MM-dd" style="width: 100%;">
              </el-date-picker>
            </div>
          </div>
        </el-col>
        <el-col :span="24" style="margin-bottom: 16px;">
          <div class="search_thing">
            <div class="search_label">样品名称：</div>
            <div class="search_input"><el-input size="small" placeholder="请输入" clearable
                                                v-model="addInfo.sampleName"></el-input></div>
          </div>
        </el-col>
        <el-col :span="24" style="margin-bottom: 16px;">
          <div class="search_thing">
            <div class="search_label">样品编号：</div>
            <div class="search_input"><el-input size="small" placeholder="请输入" clearable
                                                v-model="addInfo.sampleCode"></el-input></div>
          </div>
        </el-col>
        <el-col :span="24" style="margin-bottom: 16px;">
          <div class="search_thing">
            <div class="search_label">数量：</div>
            <div class="search_input"><el-input size="small" placeholder="请输入" clearable
                                                v-model="addInfo.num"></el-input>
            </div>
          </div>
        </el-col>
        <el-col :span="24" style="margin-bottom: 16px;">
          <div class="search_thing">
            <div class="search_label">来样单位：</div>
            <div class="search_input">
              <el-select v-model="addInfo.sampleSupplier" size="small">
                <el-option :label="item.company" :value="item.company" v-for="(item, index) in customPageList"
                           :key="item.id"></el-option>
              </el-select>
            </div>
          </div>
        </el-col>
        <el-col :span="24" style="margin-bottom: 16px;">
          <div class="search_thing">
            <div class="search_label">留样日期：</div>
            <div class="search_input">
              <el-date-picker v-model="addInfo.leaveDate" type="date" size="small" placeholder="选择日期" format="yyyy-MM-dd"
                              value-format="yyyy-MM-dd" style="width: 100%;">
              </el-date-picker>
            </div>
          </div>
        </el-col>
        <el-col :span="24" style="margin-bottom: 16px;">
          <div class="search_thing">
            <div class="search_label">样品状态：</div>
            <div class="search_input"><el-input size="small" placeholder="请输入" clearable
                                                v-model="addInfo.sampleState"></el-input></div>
          </div>
        </el-col>
        <el-col :span="24" style="margin-bottom: 16px;">
        <div class="search_thing">
          <div class="search_label">处理日期：</div>
          <div class="search_input">
            <el-date-picker v-model="addInfo.dealTime" type="date" size="small" placeholder="选择日期" format="yyyy-MM-dd"
                            value-format="yyyy-MM-dd" style="width: 100%;">
            </el-date-picker>
          </div>
        </div>
      </el-col>
      </el-row>

    <!-- 编辑/查看弹窗 -->
    <el-dialog :title="isEdit ? '编辑' : '查看'" :visible.sync="editDialogVisible" width="500px"
               :close-on-click-modal="false">
      <el-form ref="editForm" :model="currentInfo" label-width="110px" size="small">
        <el-form-item label="样品名称">
          <el-input v-model="currentInfo.sampleName" disabled></el-input>
        </el-form-item>
        <el-form-item label="样品编号">
          <el-input v-model="currentInfo.sampleCode" disabled></el-input>
        </el-form-item>
        <el-form-item label="委托编号">
          <el-input v-model="currentInfo.entrustCode" disabled></el-input>
        </el-form-item>
        <el-form-item label="方法标准">
          <el-input v-model="currentInfo.methodStandard" disabled></el-input>
        </el-form-item>
        <el-form-item label="检测项目">
          <el-input v-model="currentInfo.inspectionItem" type="textarea" :rows="3" disabled></el-input>
        </el-form-item>
        <el-form-item label="主检验人" required>
          <el-select v-model="currentInfo.mainInspectorId" clearable filterable placeholder="请选择" size="small"
                     style="width: 100%;" :disabled="!isEdit">
            <el-option v-for="(item, i) in personList" :key="i" :label="item.label" :value="item.value"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="addDialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="submitAdd" :loading="addLoading">确 定</el-button>
        <el-button @click="editDialogVisible = false">取 消</el-button>
        <el-button v-if="isEdit" type="danger" :loading="rejectLoading" @click="openReject">拒收样品</el-button>
        <el-button v-if="isEdit" type="primary" :loading="submitLoading" @click="handleSubmit">提交检验</el-button>
      </span>
    </el-dialog>
    <!-- 详情/下载/审核/批准 -->
    <el-dialog :title="title0" :visible.sync="lookDialogVisible" width="800px" :class="{ downPdf: title0 == '下载' }"
               :modal="title0 != '下载'" top="5vh">
      <filePreview v-if="lookDialogVisible" :fileUrl="javaApi + '/word/' + currentInfo.url" :currentFile="{}"
                   style="max-height: 70vh;overflow-y: auto;" />
      <span slot="footer" class="dialog-footer" v-if="title0 == '审核' || title0 == '批准'">
        <el-button @click="submitCheck('不通过')" :loading="noCheckLoading">不通过</el-button>
        <el-button type="primary" @click="submitCheck('通过')" :loading="checkLoading">通 过</el-button>

    <!-- 拒收备注弹窗 -->
    <el-dialog title="拒收样品" :visible.sync="rejectDialogVisible" width="400px" :close-on-click-modal="false">
      <el-form ref="rejectForm" :model="rejectInfo" label-width="90px" size="small">
        <el-form-item label="拒收备注" prop="remark" required>
          <el-input v-model="rejectInfo.remark" type="textarea" :rows="3" maxlength="500" show-word-limit
                    placeholder="请输入拒收备注"></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="rejectDialogVisible = false">取 消</el-button>
        <el-button type="danger" :loading="rejectLoading" @click="handleReject">确 定</el-button>
      </span>
    </el-dialog>
  </div>
@@ -121,220 +104,223 @@

<script>
import limsTable from "@/components/Table/lims-table.vue";
import filePreview from "@/components/Preview/filePreview.vue";
import { selectCustomPageList } from "@/api/system/customer";
import { selectUserCondition } from "@/api/performance/class";
import {
  pageProcessSample,
  delProcessSample,
  addProcessSample,
  exportProcessSample
} from "@/api/cnas/process/sampleDisposal";
  pageSampleReceipt,
  submitSampleReceipt,
  rejectSampleReceipt,
  exportSampleReceipt
} from "@/api/business/sampleReceipt";

export default {
  name: 'SampleReceipt',
  components: {
    limsTable,
    filePreview,
  },
  data() {
    return {
      activeName: '填写',
      title: '新增',
      addDialogVisible: false,
      addLoading: false,
      outLoading: false,
      editDialogVisible: false,
      lookDialogVisible: false,
      title0: '查看',
      noCheckLoading: false,
      checkLoading: false,
      // 历史列表
      addInfo: {},//新增样品
      customPageList: [],
      currentInfo: {
        arr: []
      },//查看的详情
      queryParams0: {
        receiveDate: ''
      },
      tableLoading0: false,
      tableData0: [],
      column0: [
        {
          label: "收样日期",
          prop: "receiveDate",
        },
        {
          label: "样品编号",
          prop: "sampleCode",
        },
        {
          label: "样品名称",
          prop: "sampleName",
        },
        {
          label: "样品数量",
          prop: "num",
        },
        {
          label: "来样单位",
          prop: "sampleSupplier",
        },
        {
          label: "留样日期",
          prop: "leaveDate",
        },
        {
          label: "样品状态",
          prop: "sampleState",
        },
        {
          label: "退样签收/处理日期",
          prop: "dealTime",
        },
        {
          dataType: "slot",
          slot: "action",
          label: "操作",
        }
      tabIndex: 0,
      tabList: [
        { label: '待接收', value: 0 },
        { label: '已提交', value: 1 },
        { label: '已拒收', value: 2 },
        { label: '已取消', value: 3 },
        { label: '全部', value: null },
      ],
      page0: {
      queryParams: {
        entrustCode: '',
        sampleCode: '',
        sampleName: '',
      },
      tableLoading: false,
      upIndex: 0,
      tableData: [],
      page: {
        total: 0,
        size: 10,
        current: 0,
        current: 1,
      },
      column: [
        { label: '样品名称', prop: 'sampleName' },
        { label: '样品编号', prop: 'sampleCode' },
        { label: '检测项目', prop: 'inspectionItem', dataType: 'slot', slot: 'inspectionItem', width: '220px' },
        { label: '委托编号', prop: 'entrustCode' },
        { label: '方法标准', prop: 'methodStandard' },
        { label: '主检人签字', prop: 'mainInspectorName' },
        { label: '备注', prop: 'remark', dataType: 'slot', slot: 'remark', width: '180px' },
        { label: '操作', dataType: 'slot', slot: 'action', width: '120px' },
      ],
      personList: [],
      editDialogVisible: false,
      rejectDialogVisible: false,
      isEdit: true,
      currentInfo: {},
      rejectInfo: {},
      submitLoading: false,
      rejectLoading: false,
    };
  },
  mounted() {
    this.getList0()
    this.getPersonList();
    this.getList();
  },
  methods: {
    // 获取送样单位列表
    getCustomPageList() {
      selectCustomPageList({
        current: -1,
        size: -1
      }).then(res => {
        this.customPageList = res.data.records
    getPersonList() {
      selectUserCondition({ type: 1 }).then(res => {
        this.personList = (res.data || []).map(a => ({ label: a.name, value: a.id }));
      }).catch(err => { });
    },
    handleTab(i) {
      this.tabIndex = i;
      this.refreshTable();
    },
    refresh() {
      this.queryParams0 = {};
      this.page0.current = 1;
      this.getList0();
      this.queryParams = { entrustCode: '', sampleCode: '', sampleName: '' };
      this.page.current = 1;
      this.getList();
    },
    refreshTable() {
      this.page0.current = 1;
      this.getList0();
      this.page.current = 1;
      this.getList();
    },
    // 查询表格数据
    getList0() {
      this.tableLoading0 = true;
      let param = { ...this.queryParams0, ...this.page0 };
    getList() {
      this.tableLoading = true;
      let param = { ...this.queryParams, ...this.page };
      let status = this.tabList[this.tabIndex].value;
      if (status !== null && status !== undefined) {
        param.status = status;
      }
      delete param.total;
      pageProcessSample({ ...param })
        .then((res) => {
          this.tableLoading0 = false;
          if (res.code === 200) {
            this.tableData0 = res.data.records;
            this.page0.total = res.data.total;
          }
        })
        .catch((err) => {
          this.tableLoading0 = false;
      pageSampleReceipt(param).then(res => {
        this.tableLoading = false;
        if (res.code === 200) {
          this.tableData = res.data.records;
          this.page.total = res.data.total;
          this.upIndex++;
        }
      }).catch(err => {
        this.tableLoading = false;
      });
    },
    pagination({ page, limit }) {
      this.page.current = page;
      this.page.size = limit;
      this.getList();
    },
    handleEdit(row) {
      this.isEdit = true;
      this.currentInfo = { ...row, mainInspectorId: row.mainInspectorId || null };
      this.editDialogVisible = true;
    },
    handleView(row) {
      this.isEdit = false;
      this.currentInfo = { ...row, mainInspectorId: row.mainInspectorId || null };
      this.editDialogVisible = true;
    },
    handleSubmit() {
      if (!this.currentInfo.mainInspectorId) {
        this.$message.error('请选择主检验人');
        return;
      }
      this.$confirm('确认将该样品提交至检验任务？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(() => {
        this.submitLoading = true;
        submitSampleReceipt({
          receiptId: this.currentInfo.receiptId,
          mainInspectorId: this.currentInfo.mainInspectorId,
        }).then(res => {
          this.submitLoading = false;
          this.editDialogVisible = false;
          this.$message.success('提交成功');
          this.refreshTable();
        }).catch(err => {
          this.submitLoading = false;
        });
      }).catch(() => { });
    },
    pagination0({ page, limit }) {
      this.page0.current = page;
      this.page0.size = limit;
      this.getList0();
    openReject() {
      this.rejectInfo = { remark: '' };
      this.rejectDialogVisible = true;
    },
    // 打开编辑弹框
    handleAdd(row) {
      this.addInfo = this.HaveJson(row)
      this.title = '编辑'
      this.addDialogVisible = true
      this.getCustomPageList()
    },
    delRow(row) {
      this.$confirm("是否删除该条数据?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          delProcessSample({ id: row.id }).then(res => {
            if (res.code == 200) {
              this.$message.success("删除成功");
              this.refreshTable();
            }
          }).catch(err => { });
        })
        .catch(() => { });
    },
    // 提交新增
    submitAdd() {
      // 编辑
      this.addLoading = true
      addProcessSample({
        ...this.addInfo
      }).then(res => {
        this.addLoading = false
        this.addDialogVisible = false
        this.$message({
          type: 'success',
          message: '编辑成功!'
    handleReject() {
      if (!this.rejectInfo.remark || !this.rejectInfo.remark.trim()) {
        this.$message.error('请填写拒收备注');
        return;
      }
      this.$confirm('拒收后委托将作废且不能进入检验任务，是否继续？', '警告', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(() => {
        this.rejectLoading = true;
        rejectSampleReceipt({
          receiptId: this.currentInfo.receiptId,
          remark: this.rejectInfo.remark,
        }).then(res => {
          this.rejectLoading = false;
          this.rejectDialogVisible = false;
          this.editDialogVisible = false;
          this.$message.success('拒收成功');
          this.refreshTable();
        }).catch(err => {
          this.rejectLoading = false;
        });
        this.page0.current = 1;
        this.refreshTable();
      }).catch(err => { });
      }).catch(() => { });
    },
    // 导出详情
    handleDown0() {
      exportProcessSample({ receiveDate: this.queryParams0.receiveDate }).then(res => {
        this.outLoading = false
        const blob = new Blob([res], { type: 'application/msword' });
        this.$download.saveAs(blob, '样品接收' + '.docx');
      })
    handleExport() {
      let param = { ...this.queryParams };
      let status = this.tabList[this.tabIndex].value;
      if (status !== null && status !== undefined) {
        param.status = status;
      }
      exportSampleReceipt(param).then(res => {
        const blob = new Blob([res], { type: 'application/octet-stream' });
        this.$download.saveAs(blob, '样品接收导出.xlsx');
      }).catch(err => {
        console.log('err---', err);
      });
    },
  },
}
</script>

<style scoped>
.search_thing {
  width: 350px;
.table-tab {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.search_label {
  width: 110px;
.tab {
  list-style-type: none;
  display: flex;
  margin-bottom: 12px;
  margin-top: 0;
  padding-left: 0;
}

.tab li {
  line-height: 24px;
  padding: 6px 14px;
  font-size: 14px;
  text-align: right;
  color: #333333;
  border: 1px solid #EEEEEE;
  cursor: pointer;
}

.search_input {
  width: calc(100% - 110px);
.tab li:nth-child(1) {
  border-radius: 8px 0 0 8px;
}

.downPdf {
  opacity: 0 !important;
.tab li:nth-child(5) {
  border-radius: 0 8px 8px 0;
}

.tables td {
  height: 40px;
  width: 100px;
  text-align: center;
  font-size: 14px;
  word-wrap: break-word;
  white-space: normal;
}

.user-info .el-button {
  margin: 0;
}

>>>.el-tabs__content {
  height: 100%;
.tab li.active {
  border-color: #3A7BFA;
  color: #3A7BFA;
}
</style>