董国庆
6 天以前 653a7a72f7d6a816b4b5e24a07b7d2f450cfb287
laboratory/src/views/dataManagement/suspendExperiment/components/approvalDialog.vue
@@ -1,5 +1,5 @@
<template>
  <el-dialog :title="dialogTitle" :visible.sync="visible" width="80%" :close-on-click-modal="false"
  <el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="80%" :close-on-click-modal="false"
    @close="handleClose">
    <div class="approval-dialog">
      <!-- 左侧审批内容 -->
@@ -13,14 +13,20 @@
              </div>
            </div>
            <Table :data="groupTableData" :total="0" :height="null" class="groupTable">
              <el-table-column type="index" label="所属项目课题方案" width="80"></el-table-column>
              <el-table-column prop="groupName" label="实验编号"></el-table-column>
              <el-table-column prop="stage" label="实验名称"></el-table-column>
              <el-table-column prop="creator" label="通知时间"></el-table-column>
              <el-table-column prop="createTime" label="实验开始时间"></el-table-column>
              <el-table-column prop="approver" label="实验结束时间"></el-table-column>
              <el-table-column prop="approveTime" label="参加人员"></el-table-column>
              <el-table-column type="index" label="序号" width="80"></el-table-column>
                  <el-table-column prop="projectName" label="所属项目课题方案"></el-table-column>
                  <el-table-column prop="experimentCode" label="实验编号"></el-table-column>
                  <el-table-column prop="experimentName" label="实验名称"></el-table-column>
                  <el-table-column prop="experimentDate" label="通知时间"></el-table-column>
                  <el-table-column prop="experimentStartTime" label="实验开始时间"></el-table-column>
                  <el-table-column prop="experimentEndTime" label="实验结束时间"></el-table-column>
                  <el-table-column prop="participantsName" label="参加人员"></el-table-column>
              <el-table-column prop="status" label="状态">
                    <template slot-scope="scope">
                      <el-tag :type="getStatusType(scope.row.status)">
                        {{ getStatusText(scope.row.status) }}
                      </el-tag>
                    </template>
              </el-table-column>
            </Table>
@@ -30,7 +36,7 @@
                <div>中止原因说明</div>
              </div>
            </div>
            <AiEditor ref="purposeEditor" v-model="form.purpose" height="200px" placeholder="请输入文字" />
            <AiEditor ref="purposeEditor" :readOnly="true" :value="form.stopReason" height="200px" placeholder="请输入文字" />
          </template>
        </Card>
@@ -38,12 +44,11 @@
      <!-- 右侧审批流程 -->
      <div class="approval-flow">
        <div class="flow-content">
          <approval-process :status="form.status" :submit-time="form.createTime" :approver="form.approver"
            :approve-time="form.approveTime" />
          <approval-process :processData="approvalProcessData" />
        </div>
      </div>
    </div>
    <div class="approval-dialog-approve">
    <div class="approval-dialog-approve" v-if="type === 'approve'">
      <div class="status">
        <div class="status-title">审批结果</div>
        <div class="status-content">
@@ -55,7 +60,7 @@
          </div>
        </div>
      </div>
      <div class="remark">
      <div class="remark" style="flex:1">
        <div class="remark-title">审批意见</div>
        <el-input type="textarea" v-model="remark" placeholder="请输入审批意见" />
      </div>
@@ -71,6 +76,7 @@
<script>
import ApprovalProcess from '@/components/approvalProcess'
import AiEditor from '@/components/AiEditor'
import { audit, getDetail } from '../service'
export default {
  name: "ApprovalDialog",
  components: {
@@ -90,6 +96,30 @@
      default: () => ({}),
    },
  },
  computed: {
    dialogVisible: {
      get() {
        return this.visible;
      },
      set(val) {
        this.$emit('update:visible', val);
      }
    },
    dialogTitle() {
      return this.type === "approve" ? "审批实验中止申请" : "实验中止申请审批详情";
    },
  },
  watch: {
    visible: {
      handler(val) {
        if (val && this.data && this.data.id) {
          // this.form = { ...val };
          this.getDialogDetail(this.data.id)
        }
      },
      immediate: true,
    },
  },
  data() {
    return {
      form: {
@@ -103,51 +133,130 @@
        approver: "",
        approveTime: ""
      },
      groupTableData: [],
      approvalProcessData: [],
      radio1: 1,
      rules: {},
      status: "1",
      remark: "",
    };
  },
  computed: {
    dialogTitle() {
      return this.type === "approve" ? "审批实验中止申请" : "实验中止申请审批详情";
  methods: {
    async getDialogDetail(id) {
      try {
        const res = await getDetail({ id });
        if (!res) {
          this.$message.error('获取方案详情失败');
          this.handleClose();
          return;
        }
        if(res.stopReason){
          this.showApprovalFlow = true;
          //中止实验申请
          let processData = [];
          processData.push({
              type: "primary",
              mode: "list",
              fields: [
                { label: "提交人:", value: res.updateBy || "" },
                { label: "提交时间:", value: res.createTime || "" },
              ],
            });
            if(res.status==4||res.status==3){
              processData.push({
                type:'primary',
                mode: "list",
                fields: [
                  {
                    label: "审核结果:",
                    value:
                      res.status ==3
                        ? "通过"
                        : res.status ==4
                        ? "驳回"
                        : "待审批",
    },
  },
  watch: {
    data: {
      handler(val) {
        if (val) {
          this.form = { ...val };
                  { label: "审批意见:", value: res.auditRemark || "" },
                  { label: "审核人:", value: res.auditPersonName || "" },
                  { label: "审核时间:", value: res.auditTime || "" },
                ],
              });
            }else{
              processData.push({
                type: "warning",
                mode: "list",
                fields: [
                  { label: "等待审核"},
                ],
              });
            }
            this.approvalProcessData = processData;
        }
        // 填充基本表单数据
        this.form = {
          ...this.form,
          stopReason: res.stopReason,
        };
        // 构建实验调度数据
        if (res.experimentDispatch) {
          this.groupTableData = [res.experimentDispatch];
        }
      } catch (error) {
        console.error("获取方案详情失败:", error);
        this.$message.error("获取方案详情失败");
        this.handleClose();
        }
      },
      immediate: true,
    getStatusType(status) {
      const statusMap = {
        "-1": "info",
        "1": "warning",
        "2": "success",
        "3": "info"
      };
      return statusMap[status] || "info";
    },
    getStatusText(status) {
      const statusMap = {
        "-1": "草稿箱",
        "1": "待确认",
        "2": "已确认",
        "3": "已封存"
      };
      return statusMap[status] || "未知";
  },
  methods: {
    handleClose() {
      this.$emit("update:visible", false);
      this.form.approvalComment = "";
      this.$emit('update:visible', false);
      this.remark = "";
    },
    handleApprove() {
      if (!this.form.approvalComment) {
      if (!this.remark) {
        this.$message.warning("请输入审批意见");
        return;
      }
      this.$emit("approve", {
        ...this.form,
        status: "approved",
      });
      this.handleSubmit();
    },
    handleReject() {
      if (!this.form.approvalComment) {
        this.$message.warning("请输入审批意见");
        return;
    async handleSubmit() {
      try {
        const params = {
          id: this.data.id,
          auditRemark: this.remark,
          status: this.status === '1' ? 3 : 4  // 1表示通过(status=3),2表示拒绝(status=4)
        };
        console.log('params params',params)
        const res = await audit(params);
        console.log('res res',res)
        if (res) {
          this.$message.success('审批成功');
          this.handleClose();
      }
      this.$emit("reject", {
        ...this.form,
        status: "rejected",
      });
      } catch (error) {
        console.error('审批失败:', error);
        this.$message.error('审批失败');
      }
    },
  },
};