完成文件审批记录迁移

spring

2025-02-21 956d572ebf6936af220e65f5dbab9f78eacc5ad0

完成文件审批记录迁移

 src/api/cnas/systemManagement/documentRecords.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,65 @@
// ä½“系文件记录相关接口
import request from "@/utils/request";

// æ–‡ä»¶å®¡æ‰¹è®°å½•-新增
export function addManageRecordCheck(data) {
  return request({
    url: "/manageRecordCheck/addManageRecordCheck",
    method: "post",
    data: data,
  });
}

// æ–‡ä»¶å®¡æ‰¹è®°å½•-修改
export function doManageRecordCheck(data) {
  return request({
    url: "/manageRecordCheck/doManageRecordCheck",
    method: "post",
    data: data,
  });
}

//文件审批记录-导出
export function exportOutManageRecordCheck(query) {
  return request({
    url: "/manageRecordCheck/exportOutManageRecordCheck",
    method: "get",
    params: query,
  });
}

// æ–‡ä»¶å®¡æ‰¹è®°å½•-审核
export function checkManageRecordCheck(data) {
  return request({
    url: "/manageRecordCheck/checkManageRecordCheck",
    method: "post",
    data: data,
  });
}

// æ–‡ä»¶å®¡æ‰¹è®°å½•-批准
export function ratifyManageRecordCheck(data) {
  return request({
    url: "/manageRecordCheck/ratifyManageRecordCheck",
    method: "post",
    data: data,
  });
}

//文件审批记录-删除
export function delManageRecordCheck(query) {
  return request({
    url: "/manageRecordCheck/delManageRecordCheck",
    method: "delete",
    params: query,
  });
}

//文件审批记录-列表
export function pageManageRecordCheck(query) {
  return request({
    url: "/manageRecordCheck/pageManageRecordCheck",
    method: "get",
    params: query,
  });
}

 src/utils/downHtmlToPDF.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,22 @@
import html2canvas from "html2canvas";
import jsPDF from "jspdf";

export async function exportHtmlToPDF(element, name = "exported") {
  try {
    // å°† HTML å…ƒç´ è½¬æ¢ä¸º canvas
    console.log("正在将 HTML è½¬æ¢ä¸º canvas...", element);
    const canvas = await html2canvas(element, { useCORS: true });
    const imgData = canvas.toDataURL("image/png");

    // åˆ›å»º PDF
    const pdf = new jsPDF("p", "mm", "a4");
    const pdfWidth = pdf.internal.pageSize.getWidth();
    const pdfHeight = (canvas.height * pdfWidth) / canvas.width;

    pdf.addImage(imgData, "PNG", 10, 10, pdfWidth - 20, pdfHeight - 20);
    pdf.save(name + ".pdf");
    console.log("PDF å¯¼å‡ºæˆåŠŸï¼");
  } catch (error) {
    console.error("导出 PDF å¤±è´¥ï¼š", error);
  }
}

 src/views/CNAS/systemManagement/documentRecords/approvalRecord.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,520 @@
<template>
  <!-- æ–‡ä»¶å®¡æ‰¹è®°å½• -->
  <div class="DocumentApprovalRecords">
    <div class="search">
      <div class="search_thing">
        <div class="search_label">文件名称：</div>
        <div class="search_input"><el-input size="small" placeholder="请输入" clearable v-model="queryParams.documentName"
            @keyup.enter.native="refreshTable()"></el-input></div>
      </div>
      <div class="search_thing">
        <div class="search_label">文件编号：</div>
        <div class="search_input">
          <el-input size="small" placeholder="请输入" clearable v-model="queryParams.documentCode"
            @keyup.enter.native="refreshTable()"></el-input>
        </div>
      </div>
      <div class="search_thing" style="padding-left: 30px;">
        <el-button size="small" @click="refresh()">重 ç½®</el-button>
        <el-button size="small" type="primary" @click="refreshTable()">查 è¯¢</el-button>
      </div>
      <div class="btn">
        <el-button size="small" type="primary" @click="openAdd('新增')">新增</el-button>
        <el-upload :action="action" :multiple="false" :show-file-list="false" accept='.doc,.docx' :headers="headers"
          :on-change="beforeUpload" :on-error="onError" ref='upload' :on-success="handleSuccessUp"
          style="display:inline-block;margin-left: 20px;">
          <el-button type="primary" size="small">导入</el-button></el-upload>
        <el-button size="small" type="primary" @click="handleDown" :loading="outLoading"
          style="display:inline-block;margin-left: 20px;">导出</el-button>
      </div>
    </div>
    <div class="table">
      <lims-table :tableData="tableData" :column="column" :page="page" :tableLoading="tableLoading"
        :height="'calc(100vh - 290px)'" @pagination="pagination"></lims-table>
    </div>
    <!-- æ–°å¢ž/编辑 -->
    <el-dialog :title="title" :visible.sync="addDia" width="500px">
      <el-form :model="addForm" ref="addForm" :rules="addRules" label-position="right" label-width="120px">
        <el-form-item label="文件名称" prop="documentName">
          <el-input size="small" placeholder="请输入" clearable v-model="addForm.documentName"></el-input>
        </el-form-item>
        <el-form-item label="文件编号" prop="documentCode">
          <el-input size="small" placeholder="请输入" clearable v-model="addForm.documentCode">
          </el-input>
        </el-form-item>
        <el-form-item label="版/次" prop="documentVersion">
          <el-input size="small" placeholder="请输入" clearable v-model="addForm.documentVersion">
          </el-input>
        </el-form-item>
        <el-form-item label="编制" prop="writeUser">
          <el-select v-model="addForm.writeUser" size="small" clearable placeholder="请选择" style="width: 100%">
            <el-option v-for="item in personList" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="审核" prop="checkUser">
          <el-select v-model="addForm.checkUser" size="small" clearable placeholder="请选择" style="width: 100%">
            <el-option v-for="item in personList" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="批准" prop="ratifyUser">
          <el-select v-model="addForm.ratifyUser" size="small" clearable placeholder="请选择" style="width: 100%">
            <el-option v-for="item in personList" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="批准日期" prop="ratifyDate">
          <el-date-picker v-model="addForm.ratifyDate" style="width: 100%" value-format="yyyy-MM-dd" ormat="yyyy-MM-dd"
            type="date" size="small"></el-date-picker>
        </el-form-item>
        <el-form-item label="备注" prop="remark">
          <el-input size="small" placeholder="请输入" type="textarea" :rows="2" clearable v-model="addForm.remarks">
          </el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="addDia = false">取 æ¶ˆ</el-button>
        <el-button :loading="uploading" type="primary" @click="submitProduct('addForm')">ç¡® è®¤</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import limsTable from "@/components/Table/lims-table.vue";
import { getToken } from "@/utils/auth";
import {
  selectUserCondition,
} from "@/api/business/inspectionTask.js";
import {
  addManageRecordCheck,
  doManageRecordCheck,
  exportOutManageRecordCheck,
  checkManageRecordCheck,
  ratifyManageRecordCheck,
  delManageRecordCheck,
  pageManageRecordCheck
} from '@/api/cnas/systemManagement/documentRecords.js'
export default {
  components: {
    limsTable
  },
  data() {
    return {
      addPower: true,
      outPower: true,
      upPower: true,
      outLoading: false,
      personList: [],
      queryParams: {},
      tableData: [],
      column: [
        { label: "文件名称", prop: "documentName" },
        { label: "文件编号", prop: "documentCode", width: "120px" },
        {
          label: "版/次",
          prop: "documentVersion",
        },
        { label: "编制", prop: "writeUser" },
        { label: "审核", prop: "checkUser" },
        { label: "批准", prop: "ratifyUser" },
        { label: "批准日期", prop: "ratifyDate" },
        { label: "备注", prop: "remark" },
        {
          dataType: "action",
          fixed: "right",
          label: "操作",
          operation: [
            {
              name: "编辑",
              type: "text",
              clickFun: (row) => {
                this.openAdd("编辑", row);
              },
              disabled: (row) => {
                return row.checkState == '通过' || row.ratifyState == '通过'
              },
            },
            {
              name: "审核",
              type: "text",
              clickFun: (row) => {
                this.handleCheck(row);
              },
              disabled: (row) => {
                return row.checkState == '通过' || row.ratifyState == '通过'
              },
            },
            {
              name: "批准",
              type: "text",
              clickFun: (row) => {
                this.handleApproval(row);
              },
              disabled: (row) => {
                return row.ratifyState == '通过'
              },
            },
            {
              name: "删除",
              type: "text",
              clickFun: (row) => {
                this.handleDelete(row);
              },
              disabled: (row) => {
                return row.checkState == '通过' || row.ratifyState == '通过'
              },
            },
          ],
        },
      ],
      page: {
        total: 0,
        size: 10,
        current: 0,
      },
      tableLoading: false,
      title: "新增",
      addDia: false,
      addForm: {},
      addRules: {
        documentName: [{ required: true, message: "请输入文件名称", trigger: "blur" }],
      },
      uploading: false,
    }
  },
  // ç”¨äºŽä¸Šä¼ æ–‡ä»¶çš„信息
  computed: {
    headers() {
      return {
        'Authorization': "Bearer " + getToken()
      }
    },
    action() {
      return this.javaApi + '/manageRecordCheck/exportInManageRecordCheck'
    }
  },
  mounted() {
    this.getAuthorizedPerson()
  },
  methods: {
    getPower() {
      let power = JSON.parse(sessionStorage.getItem('power'))
      let add = false
      let del = false
      let up = false;
      let out = false;
      let check = false
      let ratify = false
      for (var i = 0; i < power.length; i++) {
        if (power[i].menuMethod == 'addManageRecordCheck') {
          add = true
        }
        if (power[i].menuMethod == 'delManageRecordCheck') {
          del = true
        }
        if (power[i].menuMethod == 'exportInManageRecordCheck') {
          up = true
        }
        if (power[i].menuMethod == 'checkManageRecordCheck') {
          check = true
        }
        if (power[i].menuMethod == 'ratifyManageRecordCheck') {
          ratify = true
        }
        if (power[i].menuMethod == 'exportOutManageRecordCheck') {
          out = true
        }
      }
      if (!ratify) {
        this.componentData.do.splice(3, 1)
      }
      if (!check) {
        this.componentData.do.splice(2, 1)
      }
      if (!add) {
        this.componentData.do.splice(1, 1)
      }
      if (!del) {
        this.componentData.do.splice(0, 1)
      }
      this.addPower = add
      this.outPower = out
      this.upPower = up
    },
    getList() {
      this.tableLoading = true;
      let param = { ...this.queryParams, ...this.page };
      delete param.total;
      pageManageRecordCheck({ ...param })
        .then((res) => {
          this.tableLoading = false;
          if (res.code === 200) {
            this.tableData = res.data.records;
            this.page.total = res.data.total;
          }
        })
        .catch((err) => {
          this.tableLoading = false;
        });
    },
    pagination({ page, limit }) {
      this.page.current = page;
      this.page.size = limit;
      this.getList();
    },
    refresh() {
      this.queryParams = {};
      this.page.current = 1;
      this.getList();
    },
    refreshTable() {
      this.page.current = 1;
      this.getList();
    },
    // æ–°å¢ž/编辑
    openAdd(title, row) {
      this.title = title
      if (row) {
        this.addForm = row
      } else {
        this.addForm = {}
      }
      this.addDia = true;
    },
    // å¯¼å‡º
    handleDown() {
      this.outLoading = true
      // queryParams
      exportOutManageRecordCheck(this.queryParams).then(res => {
        this.outLoading = false
        if (res.code == 201) return this.$message.error('导出失败')
        this.$message.success('导出成功')
        let url = this.javaApi + 'word/' + res.message
        this.$download.saveAs(url, '文件审批记录')
      })
    },
    getAuthorizedPerson() {
      selectUserCondition().then(res => {
        let data = []
        res.data.forEach(a => {
          data.push({
            label: a.name,
            value: a.id
          })
        })
        this.personList = data
        this.refreshTable()()
      })
    },
    // å®¡æ ¸
    handleCheck(row) {
      this.$confirm('是否审核通过?', '提示', {
        confirmButtonText: '通过',
        cancelButtonText: '不通过',
        type: 'warning',
        closeOnClickModal: false, // ç¦æ­¢ç‚¹å‡»é®ç½©å±‚关闭
        distinguishCancelAndClose: true,
        beforeClose: (action, instance, done) => {
          if (action === 'confirm') {
            // ç‚¹å‡»â€œç¡®å®šâ€æŒ‰é’®ï¼Œå…è®¸å…³é—­
            checkManageRecordCheck({ id: row.id, checkState: '通过' }).then(res => {
              if (res.code === 201) return
              this.refreshTable()
              done();
              this.$message({
                type: 'success',
                message: '提交成功'
              })
            })
              .catch(err => {

              })
          } else if (action === 'cancel') {
            // ç‚¹å‡»â€œå–消”按钮，不允许关闭
            checkManageRecordCheck({ id: row.id, checkState: '不通过' }).then(res => {
              if (res.code === 201) return
              this.refreshTable()
              done();
              this.$message({
                type: 'success',
                message: '提交成功'
              })
            })
              .catch(err => {

              })
            console.log("取消按钮点击事件，不关闭弹框");
          } else if (action === 'close') {
            // ç‚¹å‡»â€œÃ—”按钮，不允许关闭
            done();
            console.log("×按钮点击事件，不关闭弹框");
          }
        }
      })
    },
    // æ‰¹å‡†
    handleApproval(row) {
      this.$confirm('是否批准通过?', '提示', {
        confirmButtonText: '通过',
        cancelButtonText: '不通过',
        type: 'warning',
        closeOnClickModal: false, // ç¦æ­¢ç‚¹å‡»é®ç½©å±‚关闭
        distinguishCancelAndClose: true,
        beforeClose: (action, instance, done) => {
          if (action === 'confirm') {
            // ç‚¹å‡»â€œç¡®å®šâ€æŒ‰é’®ï¼Œå…è®¸å…³é—­
            ratifyManageRecordCheck({ id: row.id, ratifyState: '通过' }).then(res => {
              if (res.code === 201) return
              this.refreshTable()
              done();
              this.$message({
                type: 'success',
                message: '提交成功'
              })
            })
              .catch(err => {

              })
          } else if (action === 'cancel') {
            // ç‚¹å‡»â€œå–消”按钮，不允许关闭
            ratifyManageRecordCheck({ id: row.id, ratifyState: '不通过' }).then(res => {
              if (res.code === 201) return
              this.refreshTable()
              done();
              this.$message({
                type: 'success',
                message: '提交成功'
              })
            })
              .catch(err => {

              })
          } else if (action === 'close') {
            // ç‚¹å‡»â€œÃ—”按钮，不允许关闭
            done();
            console.log("×按钮点击事件，不关闭弹框");
          }
        }
      })
    },
    beforeUpload(file) {
      if (file.size > 1024 * 1024 * 10) {
        this.$message.error('上传文件不超过10M');
        this.$refs.upload.clearFiles()
        return false;
      } else {
        // this.upLoading = true;
        return true;
      }
    },
    onError(err, file, fileList) {
      this.$message.error('上传失败')
      this.$refs.upload.clearFiles()
    },
    handleSuccessUp(response) {
      this.upLoading = false;
      if (response.code == 200) {
        this.$message.success('上传成功');
        this.refreshTable()()
      } else {
        this.$message.error('上传失败');
      }
    },
    // æ–°å¢ž/修改
    submitProduct(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.uploading = true;
          if (this.title == "新增") {
            addManageRecordCheck(this.addForm)
              .then((res) => {
                this.uploading = false;
                if (res.code != 200) {
                  return;
                }
                this.$message.success("提交成功");
                this.refresh();
                this.addDia = false;
              })
              .catch((err) => {
                this.uploading = false;
              });
          } else {
            doManageRecordCheck(this.addForm)
              .then((res) => {
                this.uploading = false;
                if (res.code != 200) {
                  return;
                }
                this.$message.success("提交成功");
                this.refresh();
                this.addDia = false;
              })
              .catch((err) => {
                this.uploading = false;
              });
          }
        } else {
          return false;
        }
      });
    },
    handleDelete(row) {
      this.$confirm("是否删除该条数据?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          delManageRecordCheck({ id: row.id }).then((res) => {
            if (res.code == 201) return;
            this.$message.success("删除成功");
            this.refresh();
          });
        })
        .catch(() => { });
    },
  }
}
</script>

<style scoped>
.search {
  background-color: #fff;
  height: 80px;
  display: flex;
  align-items: center;
  position: relative;
}

.search_thing {
  width: 350px;
  display: flex;
  align-items: center;
}

.search_label {
  width: 110px;
  font-size: 14px;
  text-align: right;
}

.search_input {
  width: calc(100% - 110px);
}

.btn {
  position: absolute;
  right: 16px;
  top: 20px;
}

.table {
  margin-top: 10px;
  background-color: #fff;
  height: calc(100% - 60px - 80px - 10px - 40px);
  padding: 20px;
}
</style>

 src/views/CNAS/systemManagement/documentRecords/cancellationRecord.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,442 @@
<template>
  <!-- ä½œåºŸæ–‡ä»¶é”€æ¯è®°å½• -->
  <div class="ObsoleteDocumentDestructionRecords">
    <el-row class="title">
      <el-col :span="12" style="padding-left: 20px;text-align: left;">作废文件销毁记录</el-col>
      <el-col :span="12" style="text-align: right;">
        <el-button size="medium" type="primary" @click="openAdd" v-if="addPower">新增</el-button>
        <el-upload :action="action" :multiple="false" :show-file-list="false" accept='.doc,.docx' :headers="headers"
          :on-change="beforeUpload" :on-error="onError" ref='upload' v-if="upPower" :on-success="handleSuccessUp"
          style="display:inline-block;margin-left: 20px;">
          <el-button type="primary" size="medium">导入</el-button></el-upload>
        <el-button size="medium" type="primary" @click="handleDown" :loading="outLoading" v-if="outPower"
          style="display:inline-block;margin-left: 20px;">导出</el-button>
      </el-col>
    </el-row>
    <div class="search">
      <div class="search_thing">
        <div class="search_label">文件名称：</div>
        <div class="search_input"><el-input size="small" placeholder="请输入" clearable
            v-model="componentData.entity.documentName" @keyup.enter.native="refreshTable()"></el-input></div>
      </div>
      <div class="search_thing">
        <div class="search_label">文件编号：</div>
        <div class="search_input">
          <el-input size="small" placeholder="请输入" clearable v-model="componentData.entity.documentCode"
            @keyup.enter.native="refreshTable()"></el-input>
        </div>
      </div>
      <div class="search_thing" style="padding-left: 30px;">
        <el-button size="small" @click="refresh()">重 ç½®</el-button>
        <el-button size="small" type="primary" @click="refreshTable()">查 è¯¢</el-button>
      </div>
    </div>
    <div class="table">
      <ValueTable ref="ValueTable" :url="$api.manageRecordCancel.pageManageRecordCancel"
        :delUrl="$api.manageRecordCancel.delManageRecordCancel" :componentData="componentData"
        :upUrl="$api.manageRecordIssueRecycle.doManageRecordIssueRecycle" :key="upIndex" />
    </div>
    <el-dialog :title="title" :visible.sync="addDialogVisible" width="400px" top="6vh">
      <el-row>
        <el-col :span="24" style="margin-bottom: 16px;">
          <div class="search_thing">
            <div class="search_label"><span style="color: red;margin-left: 4px;">* </span>文件编号：</div>
            <div class="search_input">
              <el-select v-model="addInfo.documentCode" size="small" style="width: 100%;" @change="getCurrentFile"
                allow-create clearable filterable>
                <el-option v-for="item in fileList" :key="item.documentCode" :label="item.title"
                  :value="item.documentCode">
                </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-input size="small" placeholder="请输入" clearable
                v-model="addInfo.documentName"></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.qty"></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.reason"></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.remark"
                type="textarea" :rows="2"></el-input></div>
          </div>
        </el-col>
      </el-row>
      <span slot="footer" class="dialog-footer">
        <el-button @click="addDialogVisible = false">取 æ¶ˆ</el-button>
        <el-button type="primary" @click="handleAdd" :loading="addLoading">ç¡® å®š</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import ValueTable from '@/components/Table//value-table.vue'
import { getToken } from "@/utils/auth";
export default {
  components: {
    ValueTable
  },
  data() {
    return {
      addPower: true,
      outPower: true,
      upPower: true,
      outLoading: false,
      addLoading: false,
      componentData: {
        entity: {
          documentName: null,
          documentCode: null,
          orderBy: {
            field: 'createTime',
            order: 'desc'
          }
        },
        isIndex: true,
        showSelect: false,
        select: false,
        // selectMethod: 'handleChangeTask',
        do: [{
          id: 'handleEdit0',
          font: '修改',
          type: 'text',
          method: 'handleEdit0',
          field: [],
          disabFun: (row, index) => {
            return row.ratifyState == '通过'
          }
        }, {
          id: 'handleRatify',
          font: '批准',
          type: 'text',
          method: 'handleRatify',
          field: [],
          disabFun: (row, index) => {
            return row.ratifyState == '通过'
          }
        }, {
          id: 'delete',
          font: '删除',
          type: 'text',
          method: 'doDiy',
          disabFun: (row, index) => {
            return row.ratifyState == '通过'
          }
        },],
        tagField: {
          // documentType:{
          //   select: []
          // },
          // receiveUserName:{
          //   select: []
          // },
        },
        selectField: {
          // documentType:{
          //   select: []
          // },
          // receiveUserName:{
          //   select: []
          // },
        },
        addUpload: ['signatoryUrl'],
        requiredAdd: [],
        requiredUp: [],
        datePicker: ['receiveDate'],
        noHead: ['signedUserName', 'signedDate', 'departLims'],//不参与新增编辑的字段
        needSort: [],
        inputType: ''
      },
      entityCopy: {},
      upIndex: 0,
      addInfo: {},
      title: '新增',
      addInfo: {},
      addDialogVisible: false,
      fileList: [],
      personList: [],
    }
  },
  // ç”¨äºŽä¸Šä¼ æ–‡ä»¶çš„信息
  computed: {
    headers() {
      return {
        'Authorization': "Bearer " + getToken()
      }
    },
    action() {
      return this.javaApi + this.$api.manageRecordCancel.exportInManageRecordCancel
    }
  },
  mounted() {
    this.entityCopy = this.HaveJson(this.componentData.entity);
    this.getPower()
    this.getAuthorizedPerson()
    this.getFileList()
  },
  methods: {
    getPower() {
      let power = JSON.parse(sessionStorage.getItem('power'))
      let add = false
      let del = false
      let up = false;
      let out = false;
      let ratify = false
      for (var i = 0; i < power.length; i++) {
        if (power[i].menuMethod == 'addManageRecordCancel') {
          add = true
        }
        if (power[i].menuMethod == 'delManageRecordCancel') {
          del = true
        }
        if (power[i].menuMethod == 'exportInManageRecordCancel') {
          up = true
        }
        if (power[i].menuMethod == 'ratifyManageRecordCancel') {
          ratify = true
        }
        if (power[i].menuMethod == 'exportOutManageRecordCancel') {
          out = true
        }
      }
      if (!ratify) {
        this.componentData.do.splice(2, 1)
      }
      if (!add) {
        this.componentData.do.splice(1, 1)
      }
      if (!del) {
        this.componentData.do.splice(0, 1)
      }
      this.addPower = add
      this.outPower = out
      this.upPower = up
    },
    openAdd() {
      // this.$refs.ValueTable.openAddDia(this.$api.manageRecordIssueRecycle.addManageRecordIssueRecycle);
      this.addInfo = {}
      this.title = '新增'
      this.addDialogVisible = true;
    },
    handleEdit0(row) {
      this.addInfo = row
      this.title = '修改'
      this.addDialogVisible = true;
    },
    // å¯¼å‡º
    handleDown() {
      this.outLoading = true
      this.$axios.post(this.$api.manageRecordCancel.exportOutManageRecordCancel, { entity: this.componentData.entity }, { headers: { 'Content-Type': 'application/json' } }).then(res => {
        this.outLoading = false
        if (res.code == 201) return this.$message.error('导出失败')
        this.$message.success('导出成功')
        let url = this.javaApi + 'word/' + res.message
        const link = document.createElement('a');
        link.href = url;
        link.download = '作废文件销毁记录';
        link.click();
      })
    },
    refreshTable() {
      this.refreshTable()()
    },
    refresh() {
      this.componentData.entity = this.HaveJson(this.entityCopy)
      this.upIndex++
      this.refreshTable()
    },
    beforeUpload(file) {
      if (file.size > 1024 * 1024 * 10) {
        this.$message.error('上传文件不超过10M');
        this.$refs.upload.clearFiles()
        return false;
      } else {
        // this.upLoading = true;
        return true;
      }
    },
    onError(err, file, fileList) {
      this.$message.error('上传失败')
      this.$refs.upload.clearFiles()
    },
    handleSuccessUp(response) {
      this.upLoading = false;
      if (response.code == 200) {
        this.$message.success('上传成功');
        this.refreshTable()()
      } else {
        this.$message.error('上传失败');
      }
    },
    // èŽ·å–文件列表--文件清单
    getFileList() {
      this.$axios.post(this.$api.manageDocumentList.pageManageDocumentList, {
        entity: {
          orderBy: {
            field: 'createTime',
            order: 'desc'
          }
        },
        page: {
          current: -1,
          size: -1
        }
      }, {
        headers: {
          'Content-Type': 'application/json'
        }
      }).then(res => {
        this.fileList = res.data.body.records.map(m => {
          m.title = m.documentCode
          return m
        })
      }).catch(err => { })
    },
    handleAdd() {
      if (!this.addInfo.documentCode) return this.$message.error('请输入文件编号')
      this.addLoading = true
      let obj = {}
      if (this.title == '新增') {
        obj = this.HaveJson(this.addInfo)
      } else {
        let { id, documentCode, documentName, qty, reason, remark } = this.addInfo
        obj = { id, documentCode, documentName, qty, reason, remark }
      }
      this.$axios.post(this.$api.manageRecordCancel[this.title == '新增' ? 'addManageRecordCancel' : 'doManageRecordCancel'], obj, { headers: { 'Content-Type': 'application/json' }, noQs: true }).then(res => {
        this.addLoading = false
        if (res.code == 201) {
          return
        }
        this.addDialogVisible = false
        this.$message({
          type: 'success',
          message: '操作成功!'
        });
        this.refreshTable()
      }).catch(err => { })
    },
    getCurrentFile(e) {
      let obj = this.fileList.find(m => m.documentCode == e)
      if (obj) {
        this.$set(this.addInfo, 'documentName', obj.name)
      }
    },
    getAuthorizedPerson() {
      this.$axios.get(this.$api.user.getUserMenu).then(res => {
        let data = []
        res.data.forEach(a => {
          data.push({
            label: a.name,
            value: a.id
          })
        })
        // this.componentData.tagField.receiveUserName.select = data
        // this.componentData.selectField.receiveUserName.select = data
        this.personList = data
      })
    },
    handleRatify(row) {
      this.$confirm('是否批准通过?', '提示', {
        confirmButtonText: '通过',
        cancelButtonText: '不通过',
        type: 'warning',
        closeOnClickModal: false, // ç¦æ­¢ç‚¹å‡»é®ç½©å±‚关闭
        distinguishCancelAndClose: true,
        beforeClose: (action, instance, done) => {
          if (action === 'confirm') {
            // ç‚¹å‡»â€œç¡®å®šâ€æŒ‰é’®ï¼Œå…è®¸å…³é—­
            this.$axios.post(this.$api.manageRecordCancel.ratifyManageRecordCancel, { id: row.id, ratifyState: '通过' }).then(res => {
              if (res.code === 201) return
              this.refreshTable()
              done();
              this.$message({
                type: 'success',
                message: '提交成功'
              })
            })
              .catch(err => {

              })
          } else if (action === 'cancel') {
            // ç‚¹å‡»â€œå–消”按钮，不允许关闭
            this.$axios.post(this.$api.manageRecordCancel.ratifyManageRecordCancel, { id: row.id, ratifyState: '不通过' }).then(res => {
              if (res.code === 201) return
              this.refreshTable()
              done();
              this.$message({
                type: 'success',
                message: '提交成功'
              })
            })
              .catch(err => {

              })
            console.log("取消按钮点击事件，不关闭弹框");
          } else if (action === 'close') {
            // ç‚¹å‡»â€œÃ—”按钮，不允许关闭
            done();
            console.log("×按钮点击事件，不关闭弹框");
          }
        }
      })
    }
  }
}
</script>

<style scoped>
.title {
  height: 60px;
  line-height: 60px;
}

.search {
  background-color: #fff;
  height: 80px;
  display: flex;
  align-items: center;
}

.search_thing {
  width: 350px;
  display: flex;
  align-items: center;
}

.search_label {
  width: 110px;
  font-size: 14px;
  text-align: right;
}

.search_input {
  width: calc(100% - 110px);
}

.table {
  margin-top: 10px;
  background-color: #fff;
  width: calc(100% - 40px);
  height: calc(100% - 60px - 80px - 10px - 40px);
  padding: 20px;
}
</style>

 src/views/CNAS/systemManagement/documentRecords/distributionCollectionRecord.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,488 @@
<template>
  <!-- æ‰€æœ‰æ–‡ä»¶ï¼ˆå†…、外部文件）的发放与回收记录 -->
  <div class="DistributionRetrievalRecordsAllDocuments">
    <el-row class="title">
      <el-col :span="12" style="padding-left: 20px;text-align: left;">所有文件（内、外部文件）的发放与回收记录</el-col>
      <el-col :span="12" style="text-align: right;">
        <el-button size="medium" type="primary" @click="openAdd" v-if="addPower">新增</el-button>
        <el-upload :action="action" :multiple="false" :show-file-list="false" accept='.doc,.docx' :headers="headers"
          :on-change="beforeUpload" :on-error="onError" ref='upload' v-if="upPower" :on-success="handleSuccessUp"
          style="display:inline-block;margin-left: 20px;">
          <el-button type="primary" size="medium">导入</el-button></el-upload>
        <el-button size="medium" type="primary" @click="handleDown" :loading="outLoading" v-if="outPower"
          style="display:inline-block;margin-left: 20px;">导出</el-button>
      </el-col>
    </el-row>
    <div class="search">
      <div class="search_thing">
        <div class="search_label">文件名称：</div>
        <div class="search_input"><el-input size="small" placeholder="请输入" clearable
            v-model="componentData.entity.documentName" @keyup.enter.native="refreshTable()"></el-input></div>
      </div>
      <div class="search_thing">
        <div class="search_label">文件编号：</div>
        <div class="search_input">
          <el-input size="small" placeholder="请输入" clearable v-model="componentData.entity.documentCode"
            @keyup.enter.native="refreshTable()"></el-input>
        </div>
      </div>
      <div class="search_thing" style="padding-left: 30px;">
        <el-button size="small" @click="refresh()">重 ç½®</el-button>
        <el-button size="small" type="primary" @click="refreshTable()">查 è¯¢</el-button>
      </div>
    </div>
    <div class="table">
      <ValueTable ref="ValueTable" :url="$api.manageRecordIssueRecycle.pageManageRecordIssueRecycle"
        :delUrl="$api.manageRecordIssueRecycle.delManageRecordIssueRecycle" :componentData="componentData"
        :upUrl="$api.manageRecordIssueRecycle.doManageRecordIssueRecycle" :key="upIndex" />
    </div>
    <el-dialog :title="title" :visible.sync="addDialogVisible" width="400px" top="6vh">
      <el-row>
        <el-col :span="24" style="margin-bottom: 16px;">
          <div class="search_thing">
            <div class="search_label"><span style="color: red;margin-left: 4px;">* </span>文件编号：</div>
            <div class="search_input">
              <el-select v-model="addInfo.documentCode" size="small" style="width: 100%;" @change="getCurrentFile"
                allow-create clearable filterable>
                <el-option v-for="item in fileList" :key="item.documentCode" :label="item.title"
                  :value="item.documentCode">
                </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-input size="small" placeholder="请输入" clearable
                v-model="addInfo.documentName"></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.documentVersion"></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.pages"></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.documentType" placeholder="请选择" size="small" style="width: 100%;">
                <el-option v-for="item in fileType" :key="item.value" :label="item.label" :value="item.value">
                </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-input size="small" placeholder="请输入" clearable
                v-model="addInfo.number"></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.receiveUser" placeholder="请选择" size="small" style="width: 100%;"
                filterable="">
                <el-option v-for="item in personList" :key="item.value" :label="item.label" :value="item.value">
                </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-select v-model="addInfo.departLims" placeholder="请选择" size="small" style="width: 100%;">
                <el-option v-for="item in list" :key="item.name" :label="item.name" :value="item.name">
                </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.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-row>
      <span slot="footer" class="dialog-footer">
        <el-button @click="addDialogVisible = false">取 æ¶ˆ</el-button>
        <el-button type="primary" @click="handleAdd" :loading="addLoading">ç¡® å®š</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import ValueTable from '@/components/Table/value-table.vue'
import {
  getYearAndMonthAndDays
} from '@/utils/date'
import { getToken } from "@/utils/auth";
export default {
  components: {
    ValueTable
  },
  data() {
    return {
      addPower: true,
      outPower: true,
      upPower: true,
      outLoading: false,
      addLoading: false,
      componentData: {
        entity: {
          documentName: null,
          documentCode: null,
          orderBy: {
            field: 'id',
            order: 'desc'
          }
        },
        isIndex: true,
        showSelect: false,
        select: false,
        // selectMethod: 'handleChangeTask',
        do: [{
          id: 'delete',
          font: '删除',
          type: 'text',
          method: 'doDiy',
          disabFun: (row, index) => {
            return !!row.signedUser
          }
        }, {
          id: 'handleEdit',
          font: '修改',
          type: 'text',
          method: 'handleEdit',
          field: [],
          disabFun: (row, index) => {
            return !!row.signedUser
          }
        }, {
          id: 'handleBack',
          font: '回收',
          type: 'text',
          method: 'handleBack',
          disabFun: (row, index) => {
            return !!row.signedUser
          }
        }],
        tagField: {
          // documentType:{
          //   select: []
          // },
          // receiveUserName:{
          //   select: []
          // },
        },
        selectField: {
          // documentType:{
          //   select: []
          // },
          // receiveUserName:{
          //   select: []
          // },
        },
        addUpload: ['signatoryUrl'],
        requiredAdd: [],
        requiredUp: [],
        datePicker: ['receiveDate'],
        noHead: ['signedUserName', 'signedDate', 'departLims'],//不参与新增编辑的字段
        needSort: [],
        inputType: ''
      },
      entityCopy: {},
      upIndex: 0,
      title: '新增',
      addDialogVisible: false,
      addInfo: {},
      personList: [],
      fileType: [],
      fileList: [],
      list: []
    }
  },
  // ç”¨äºŽä¸Šä¼ æ–‡ä»¶çš„信息
  computed: {
    headers() {
      return {
        'Authorization': "Bearer " + getToken()
      }
    },
    action() {
      return this.javaApi + this.$api.manageRecordIssueRecycle.exportInManageRecordIssueRecycle
    }
  },
  mounted() {
    this.entityCopy = this.HaveJson(this.componentData.entity);
    this.getPower()
    this.getAuthorizedPerson()
    this.selectEnumByCategory()
    this.getFileList()
    this.selectTreeList()
  },
  methods: {
    getPower() {
      let power = JSON.parse(sessionStorage.getItem('power'))
      let add = false
      let del = false
      let up = false;
      let out = false;
      let edit = false
      for (var i = 0; i < power.length; i++) {
        if (power[i].menuMethod == 'addManageRecordIssueRecycle') {
          add = true
        }
        if (power[i].menuMethod == 'delManageRecordIssueRecycle') {
          del = true
        }
        if (power[i].menuMethod == 'exportInManageRecordIssueRecycle') {
          up = true
        }
        if (power[i].menuMethod == 'doManageRecordIssueRecycle') {
          edit = true
        }
        if (power[i].menuMethod == 'exportOutManageRecordIssueRecycle') {
          out = true
        }
      }
      if (!add) {
        this.componentData.do.splice(2, 1)
      }
      if (!add) {
        this.componentData.do.splice(1, 1)
      }
      if (!del) {
        this.componentData.do.splice(0, 1)
      }
      this.addPower = add
      this.outPower = out
      this.upPower = up
    },
    // æ–°å¢ž
    openAdd() {
      // this.$refs.ValueTable.openAddDia(this.$api.manageRecordIssueRecycle.addManageRecordIssueRecycle);
      this.addInfo = {}
      this.title = '新增'
      this.addDialogVisible = true;
    },
    handleEdit(row) {
      this.addInfo = row
      this.title = '编辑'
      this.addDialogVisible = true;
    },
    // å¯¼å‡º
    handleDown() {
      this.outLoading = true
      this.$axios.post(this.$api.manageRecordIssueRecycle.exportOutManageRecordIssueRecycle, { entity: this.componentData.entity }, { headers: { 'Content-Type': 'application/json' } }).then(res => {
        this.outLoading = false
        if (res.code == 201) return this.$message.error('导出失败')
        this.$message.success('导出成功')
        let url = this.javaApi + 'word/' + res.message
        const link = document.createElement('a');
        link.href = url;
        link.download = '文件发放与回收记录';
        link.click();
      })
    },
    refreshTable() {
      this.refreshTable()()
    },
    refresh() {
      this.componentData.entity = this.HaveJson(this.entityCopy)
      this.upIndex++
      this.refreshTable()
    },
    getAuthorizedPerson() {
      this.$axios.get(this.$api.user.getUserMenu).then(res => {
        let data = []
        res.data.forEach(a => {
          data.push({
            label: a.name,
            value: a.id
          })
        })
        // this.componentData.tagField.receiveUserName.select = data
        // this.componentData.selectField.receiveUserName.select = data
        this.personList = data
      })
    },
    beforeUpload(file) {
      if (file.size > 1024 * 1024 * 10) {
        this.$message.error('上传文件不超过10M');
        this.$refs.upload.clearFiles()
        return false;
      } else {
        // this.upLoading = true;
        return true;
      }
    },
    onError(err, file, fileList) {
      this.$message.error('上传失败')
      this.$refs.upload.clearFiles()
    },
    handleSuccessUp(response) {
      this.upLoading = false;
      if (response.code == 200) {
        this.$message.success('上传成功');
        this.refreshTable()()
      } else {
        this.$message.error('上传失败');
      }
    },
    selectEnumByCategory() {
      this.$axios.post(this.$api.enums.selectEnumByCategory, {
        category: "文件类别"
      }).then(res => {
        // this.componentData.tagField.documentType.select = res.data
        // this.componentData.selectField.documentType.select = res.data
        this.fileType = res.data
      })
    },
    // èŽ·å–文件列表--文件清单
    getFileList() {
      this.$axios.post(this.$api.manageDocumentList.pageManageDocumentList, {
        entity: {
          orderBy: {
            field: 'createTime',
            order: 'desc'
          }
        },
        page: {
          current: -1,
          size: -1
        }
      }, {
        headers: {
          'Content-Type': 'application/json'
        }
      }).then(res => {
        this.fileList = res.data.body.records.map(m => {
          m.title = m.documentCode
          return m
        })
      }).catch(err => { })
    },
    getCurrentFile(e) {
      let obj = this.fileList.find(m => m.documentCode == e)
      if (obj) {
        this.$set(this.addInfo, 'documentName', obj.name)
        this.$set(this.addInfo, 'documentVersion', obj.version)
        this.$set(this.addInfo, 'documentType', obj.type)
      }
    },
    handleAdd() {
      if (!this.addInfo.documentCode) return this.$message.error('请输入文件编号')
      this.addLoading = true
      let obj = {}
      if (this.title == '新增') {
        obj = this.HaveJson(this.addInfo)
      } else {
        let { id, documentCode, documentName, documentVersion, pages, documentType, number, receiveUser, receiveDate, departLims } = this.addInfo
        obj = { id, documentCode, documentName, documentVersion, pages, documentType, number, receiveUser, receiveDate, departLims }
      }
      this.$axios.post(this.$api.manageRecordIssueRecycle[this.title == '新增' ? 'addManageRecordIssueRecycle' : 'doManageRecordIssueRecycle'], obj, { headers: { 'Content-Type': 'application/json' }, noQs: true }).then(res => {
        this.addLoading = false
        if (res.code == 201) {
          return
        }
        this.addDialogVisible = false
        this.$message({
          type: 'success',
          message: '操作成功!'
        });
        this.refreshTable()
      }).catch(err => { })
    },
    // å›žæ”¶
    handleBack(row) {
      this.$confirm('是否确认回收?', "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        let obj = {}
        let { id, documentCode, documentName, documentVersion, pages, documentType, number, receiveUser, receiveDate, departLims } = row
        obj = { id, documentCode, documentName, documentVersion, pages, documentType, number, receiveUser, receiveDate, departLims, signedDate: getYearAndMonthAndDays(), signedUser: JSON.parse(localStorage.getItem("user")).userId }
        this.$axios.post(this.$api.manageRecordIssueRecycle.doManageRecordIssueRecycle, obj, { headers: { 'Content-Type': 'application/json' }, noQs: true }).then(res => {
          this.addLoading = false
          if (res.code == 201) {
            return
          }
          this.addDialogVisible = false
          this.$message({
            type: 'success',
            message: '操作成功!'
          });
          this.refreshTable()
        }).catch(err => { })
      }).catch(() => { })
    },
    // æŸ¥è¯¢æ ‘形列表
    selectTreeList() {
      this.$axios.get(this.$api.personnel.selectCNSAPersonTree).then((res) => {
        this.list = res.data[0].children;
      });
    },
  }
}
</script>

<style scoped>
.title {
  height: 60px;
  line-height: 60px;
}

.search {
  background-color: #fff;
  height: 80px;
  display: flex;
  align-items: center;
}

.search_thing {
  width: 350px;
  display: flex;
  align-items: center;
}

.search_label {
  width: 110px;
  font-size: 14px;
  text-align: right;
}

.search_input {
  width: calc(100% - 110px);
}

.table {
  margin-top: 10px;
  background-color: #fff;
  width: calc(100% - 40px);
  height: calc(100% - 60px - 80px - 10px - 40px);
  padding: 20px;
}
</style>

 src/views/CNAS/systemManagement/documentRecords/outDocumenRecordt.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,378 @@
<template>
  <!-- å¤–来文件确认记录 -->
  <div class="ExternalDocumentConfirmationRecords">
    <el-row class="title">
      <el-col :span="20" style="padding-left: 20px;text-align: left;">外来文件确认记录</el-col>
    </el-row>
    <el-tabs type="border-card" v-model="activeName" style="height: 100%;">
      <el-tab-pane label="填写" name="填写" style="height: 100%;">
        <div style="display: flex;align-items: center;justify-content: flex-end;margin-right: 20px;">
          <el-button size="small" type="primary" @click="handleAdd0" style="margin-left: 20px;"
            v-if="addPower">新增</el-button>
          <el-upload :action="action" :multiple="false" :show-file-list="false" accept='.doc,.docx' :headers="headers"
            :on-change="beforeUpload" :on-error="onError" ref='upload' v-if="upPower" :on-success="handleSuccessUp"
            style="display:inline-block;margin-left: 20px;">
            <el-button size="small" type="primary" :loading="upLoading">导入</el-button></el-upload>
        </div>
        <div class="table" style="height: calc(100% - 200px)">
          <ValueTable ref="ValueTable0" :url="$api.manageRecordTotal.pageManageRecordVerify"
            :componentData="componentData0" :key="upIndex0" :delUrl="$api.manageRecordTotal.delManageRecordVerify"
            :upUrl="$api.manageRecordTotal.doManageRecordVerify" />
        </div>
      </el-tab-pane>
      <el-tab-pane label="历史记录" name="历史记录" style="height: 100%;">
        <div class="search">
          <div class="search_thing">
            <div class="search_label">年：</div>
            <div class="search_input">
              <el-date-picker v-model="componentData.entity.year" type="year" placeholder="选择年" format="yyyy"
                value-format="yyyy" size="small" @change="refreshTable()">
              </el-date-picker>
            </div>
          </div>
          <div class="search_thing" style="padding-left: 30px;">
            <el-button size="small" @click="refresh()">重 ç½®</el-button>
            <el-button size="small" type="primary" @click="refreshTable()">查 è¯¢</el-button>
          </div>
        </div>
        <div class="table">
          <ValueTable ref="ValueTable" :url="$api.manageRecordTotal.pageManageRecordTotal"
            :componentData="componentData" :key="upIndex" />
        </div>
      </el-tab-pane>
    </el-tabs>
    <!-- è¯¦æƒ…/下载/审核 -->
    <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>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import filePreview from '@/components/Preview/filePreview.vue'
import ValueTable from '@/components/Table/value-table.vue'
import { getToken } from "@/utils/auth";
export default {
  components: {
    ValueTable,
    filePreview,
  },
  data() {
    return {
      title0: '查看',
      activeName: '填写',
      lookDialogVisible: false,
      noCheckLoading: false,
      checkLoading: false,
      componentData: {
        entity: {
          year: null,
          orderBy: {
            field: 'id',
            order: 'desc'
          }
        },
        isIndex: true,
        showSelect: false,
        select: false,
        do: [{
          id: 'handleLook',
          font: '查看',
          type: 'text',
          method: 'handleLook',
          disabFun: (row, index) => {
            return !row.url
          }
        }, {
          id: 'handleDown0',
          font: '下载',
          type: 'text',
          method: 'handleDown0',
          disabFun: (row, index) => {
            return !row.url
          }
        },
        {
          id: 'handleSubmit',
          font: '提交',
          type: 'text',
          method: 'handleSubmit',
          disabFun: (row, index) => {
            return !!row.submitUserName
          }
        }, {
          id: 'handleApproval',
          font: '批准',
          type: 'text',
          method: 'handleApproval',
          disabFun: (row, index) => {
            return !row.submitUserName || !!row.ratifyUserName
          }
        }],
        tagField: {},
        selectField: {},
        requiredAdd: [],
        requiredUp: [],
        needSort: [],
        inputType: ''
      },
      // æ ·å“åˆ—表
      componentData0: {
        entity: {
          manageRecordTotalId: null,
          orderBy: {
            field: 'id',
            order: 'desc'
          }
        },
        isIndex: true,
        showSelect: false,
        select: false,
        do: [{
          id: 'update',
          font: '修改',
          type: 'text',
          method: 'doDiy'
        }, {
          id: 'delete',
          font: '删除',
          type: 'text',
          method: 'doDiy'
        }],
        tagField: {},
        selectField: {},
        requiredAdd: ['documentName', 'documentCode'],
        requiredUp: ['documentName', 'documentCode'],
        datePicker: ['effectiveDate', 'cancelDate'],
        needSort: [],
        inputType: ''
      },
      upIndex0: 100,
      entityCopy: {},
      upIndex: 0,
      addPower: true,
      upPower: true,
      currentInfo: {},
      upLoading: false,
    }
  },
  // ç”¨äºŽä¸Šä¼ æ–‡ä»¶çš„信息
  computed: {
    headers() {
      return {
        'Authorization': "Bearer " + getToken()
      }
    },
    action() {
      return this.javaApi + this.$api.manageRecordTotal.exportManageRecordVerify
    }
  },
  mounted() {
    this.entityCopy = this.HaveJson(this.componentData.entity);
    this.getPower()
  },
  methods: {
    getPower() {
      let power = JSON.parse(sessionStorage.getItem('power'))
      let add = false
      let del = false
      let up = false;
      let sub = false
      let ratify = false
      for (var i = 0; i < power.length; i++) {
        if (power[i].menuMethod == 'addManageRecordVerify') {
          add = true
        }
        if (power[i].menuMethod == 'delManageRecordVerify') {
          del = true
        }
        if (power[i].menuMethod == 'exportManageRecordVerify') {
          up = true
        }
        if (power[i].menuMethod == 'submitManageRecordTotal') {
          sub = true
        }
        if (power[i].menuMethod == 'ratifyManageRecordTotal') {
          ratify = true
        }
      }
      if (!ratify) {
        this.componentData.do.splice(3, 1)
      }
      if (!sub) {
        this.componentData.do.splice(2, 1)
      }
      if (!del) {
        this.componentData0.do.splice(1, 1)
      }
      if (!add) {
        this.componentData0.do.splice(0, 1)
      }
      this.addPower = add
      this.upPower = up
    },
    handleAdd0() {
      this.$refs.ValueTable0.openAddDia(this.$api.manageRecordTotal.addManageRecordVerify);
    },
    refreshTable() {
      this.refreshTable()()
    },
    beforeUpload(file) {
      if (file.size > 1024 * 1024 * 10) {
        this.$message.error('上传文件不超过10M');
        this.$refs.upload.clearFiles()
        return false;
      } else {
        // this.upLoading = true;
        return true;
      }
    },
    onError(err, file, fileList) {
      this.$message.error('上传失败')
      this.$refs.upload.clearFiles()
    },
    handleSuccessUp(response) {
      this.upLoading = false;
      if (response.code == 200) {
        this.$message.success('上传成功');
        this.$refs['ValueTable0'].selectList()
      } else {
        this.$message.error('上传失败');
      }
    },
    refresh() {
      this.componentData.entity = this.HaveJson(this.entityCopy)
      this.upIndex++
      this.refreshTable()
    },
    submitCheck(type) { },
    // æŸ¥çœ‹
    handleLook(row) {
      this.title0 = '查看'
      this.commonFun(row)
    },
    // å…¬ç”¨æ–¹æ³•
    commonFun(row, callbanck) {
      this.currentInfo = row
      this.componentData0.entity.manageRecordTotalId = row.id
      this.$axios.post(this.$api.manageRecordTotal.pageManageRecordVerify, {
        entity: this.componentData0.entity,
        page: {
          current: -1,
          size: -1
        }
      }, {
        headers: {
          'Content-Type': 'application/json'
        }, noQs: true
      }).then(res => {
        this.currentInfo.arr = res.data.body.records
        this.lookDialogVisible = true
        if (callbanck) {
          callbanck()
        }
      }).catch(err => { });
    },
    handleDown0(row) {
      let url = this.javaApi + 'word/' + row.url
      const link = document.createElement('a');
      link.href = url;
      link.download = row.month + ' å¤–来文件确认记录';
      link.click();
    },
    // æäº¤
    handleSubmit(row) {
      this.$confirm('是否提交 ' + row.year + ' å¹´çš„数据', '提交', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.$axios.post(this.$api.manageRecordTotal.submitManageRecordTotal, {
          id: row.id
        }).then(res => {
          this.$message({
            type: 'success',
            message: '提交成功!'
          });
          this.refreshTable()()
        }).catch(err => { });
      })
    },
    // æ‰¹å‡†
    handleApproval(row) {
      this.title0 = '批准'
      this.commonFun(row)
    },
    // æäº¤å®¡æ ¸/批准
    submitCheck(state) {
      if (state == '通过') {
        this.checkLoading = true
      } else {
        this.noCheckLoading = true
      }
      this.$axios.post(this.$api.manageRecordTotal.ratifyManageRecordTotal, {
        id: this.currentInfo.id,
        ratifyState: state
      }).then(res => {
        this.checkLoading = false
        this.noCheckLoading = false
        if (res.code === 201) return
        this.$message({
          type: 'success',
          message: '操作成功!'
        });
        this.refreshTable()()
        this.lookDialogVisible = false
      }).catch(err => { });
    },
  }
}
</script>

<style scoped>
.title {
  height: 60px;
  line-height: 60px;
}

.search {
  background-color: #fff;
  height: 40px;
  display: flex;
  align-items: center;
  position: relative;
}

.search_thing {
  width: 350px;
  display: flex;
  align-items: center;
}

.search_label {
  width: 110px;
  font-size: 14px;
  text-align: right;
}

.search_input {
  width: calc(100% - 110px);
}

.table {
  background-color: #fff;
  width: calc(100% - 40px);
  height: calc(100% - 60px - 140px);
  padding: 20px;
}

>>>.el-tabs__content {
  height: 100%;
}
</style>

 src/views/CNAS/systemManagement/documentRecords/regularReviewsRecord.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,585 @@
<template>
  <!-- æ–‡ä»¶å®šæœŸå®¡æŸ¥è®°å½• -->
  <div class="PeriodicDocumentReviewRecords">
    <el-row class="title">
      <el-col :span="12" style="padding-left: 20px;text-align: left;">文件定期审查记录</el-col>
      <!-- <el-col :span="12" style="text-align: right;">
        <el-button size="medium" type="primary" @click="openAdd" v-if="addPower">新增</el-button>
        <el-upload :action="action" :show-file-list="false"
          accept='.doc,.docx' :headers="headers" :on-change="beforeUpload"
          :on-error="onError" ref='upload' v-if="upPower" :on-success="handleSuccessUp" style="display:inline-block;margin-left: 20px;">
          <el-button type="primary" size="medium">导入</el-button></el-upload>
        <el-button size="medium" type="primary" @click="handleDown" :loading="outLoading" v-if="outPower" style="display:inline-block;margin-left: 20px;">导出</el-button>
      </el-col> -->
    </el-row>
    <el-tabs type="border-card" v-model="activeName" style="height: 100%;">
      <el-tab-pane label="填写" name="填写" style="height: 100%;">
        <div class="search">
          <div class="search_thing">
            <div class="search_label">文件名称：</div>
            <div class="search_input"><el-input size="small" placeholder="请输入" clearable
                v-model="componentData.entity.documentName" @keyup.enter.native="refreshTable()"></el-input></div>
          </div>
          <div class="search_thing">
            <div class="search_label">文件编号：</div>
            <div class="search_input">
              <el-input size="small" placeholder="请输入" clearable v-model="componentData.entity.documentCode"
                @keyup.enter.native="refreshTable()"></el-input>
            </div>
          </div>
          <div class="search_thing" style="padding-left: 30px;">
            <el-button size="small" @click="refresh()">重 ç½®</el-button>
            <el-button size="small" type="primary" @click="refreshTable()">查 è¯¢</el-button>
          </div>
          <div class="btns">
            <el-button size="medium" type="primary" @click="openAdd" v-if="addPower">新增</el-button>
            <el-upload :action="action" :multiple="false" :show-file-list="false" accept='.doc,.docx' :headers="headers"
              :on-change="beforeUpload" :on-error="onError" ref='upload' v-if="upPower" :on-success="handleSuccessUp"
              style="display:inline-block;margin-left: 20px;">
              <el-button type="primary" size="medium">导入</el-button></el-upload>
          </div>
        </div>
        <div class="table">
          <ValueTable ref="ValueTable" :url="$api.manageRecordIntervals.pageManageRecordIntervals"
            :delUrl="$api.manageRecordIntervals.delManageRecordIntervals" :componentData="componentData"
            :upUrl="$api.manageRecordIssueRecycle.doManageRecordIssueRecycle" :key="upIndex" />
        </div>
      </el-tab-pane>
      <el-tab-pane label="历史记录" name="历史记录" style="height: 100%;">
        <div class="search">
          <div class="search_thing">
            <div class="search_label">年：</div>
            <div class="search_input">
              <el-date-picker v-model="componentData0.entity.year" type="year" placeholder="选择年" format="yyyy"
                value-format="yyyy" size="small" @change="refreshTable()">
              </el-date-picker>
            </div>
          </div>
          <div class="search_thing" style="padding-left: 30px;">
            <el-button size="small" @click="refresh(1)">重 ç½®</el-button>
            <el-button size="small" type="primary" @click="refreshTable(1)">查 è¯¢</el-button>
          </div>
        </div>
        <div class="table">
          <ValueTable ref="ValueTable0" :url="$api.manageRecordIntervals.pageManageRecordIntervalsTotal"
            :componentData="componentData0" :key="upIndex" />
        </div>
      </el-tab-pane>
    </el-tabs>
    <el-dialog :title="title" :visible.sync="addDialogVisible" width="400px" top="6vh">
      <el-row>
        <el-col :span="24" style="margin-bottom: 16px;">
          <div class="search_thing">
            <div class="search_label"><span style="color: red;margin-left: 4px;">* </span>文件编号：</div>
            <div class="search_input">
              <el-select v-model="addInfo.documentCode" size="small" style="width: 100%;" @change="getCurrentFile"
                allow-create clearable filterable>
                <el-option v-for="item in fileList" :key="item.documentCode" :label="item.title"
                  :value="item.documentCode">
                </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-input size="small" placeholder="请输入" clearable
                v-model="addInfo.documentName"></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.documentVersion"></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.revision"></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.suitability" placeholder="请选择" size="small" style="width: 100%;">
                <el-option v-for="item in typeList" :key="item.value" :label="item.label" :value="item.value">
                </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-input size="small" placeholder="请输入" clearable v-model="addInfo.remark"
                type="textarea" :rows="2"></el-input></div>
          </div>
        </el-col>
      </el-row>
      <span slot="footer" class="dialog-footer">
        <el-button @click="addDialogVisible = false">取 æ¶ˆ</el-button>
        <el-button type="primary" @click="handleAdd" :loading="addLoading">ç¡® å®š</el-button>
      </span>
    </el-dialog>
    <!-- è¯¦æƒ…/审核 -->
    <el-dialog :title="title0" :visible.sync="lookDialogVisible" width="800px" 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>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import ValueTable from '@/components/Table/value-table.vue'
import filePreview from '@/components/Preview/filePreview.vue'
import { getToken } from "@/utils/auth";
export default {
  components: {
    ValueTable,
    filePreview
  },
  data() {
    return {
      activeName: '填写',
      title0: '新增',
      addPower: true,
      outPower: true,
      upPower: true,
      outLoading: false,
      addLoading: false,
      lookDialogVisible: false,
      noCheckLoading: false,
      checkLoading: false,
      componentData: {
        entity: {
          documentName: null,
          documentCode: null,
          orderBy: {
            field: 'id',
            order: 'desc'
          }
        },
        isIndex: true,
        showSelect: false,
        select: false,
        // selectMethod: 'handleChangeTask',
        do: [{
          id: 'handleEdit',
          font: '修改',
          type: 'text',
          method: 'handleEdit',
          field: [],
        }, {
          id: 'delete',
          font: '删除',
          type: 'text',
          method: 'doDiy',
        }],
        tagField: {
          // documentType:{
          //   select: []
          // },
          // receiveUserName:{
          //   select: []
          // },
        },
        selectField: {
          // documentType:{
          //   select: []
          // },
          // receiveUserName:{
          //   select: []
          // },
        },
        addUpload: ['signatoryUrl'],
        requiredAdd: [],
        requiredUp: [],
        datePicker: ['receiveDate'],
        noHead: ['signedUserName', 'signedDate', 'departLims'],//不参与新增编辑的字段
        needSort: [],
        inputType: ''
      },
      componentData0: {
        entity: {
          year: null,
          orderBy: {
            field: 'id',
            order: 'desc'
          }
        },
        isIndex: true,
        showSelect: false,
        select: false,
        do: [{
          id: 'handleLook',
          font: '查看',
          type: 'text',
          method: 'handleLook',
          disabFun: (row, index) => {
            return !row.url
          }
        }, {
          id: 'handleDown0',
          font: '下载',
          type: 'text',
          method: 'handleDown0',
          disabFun: (row, index) => {
            return !row.url
          }
        },
        {
          id: 'handleSubmit',
          font: '提交',
          type: 'text',
          method: 'handleSubmit',
          disabFun: (row, index) => {
            return !!row.submitUserName
          }
        }, {
          id: 'handleApproval',
          font: '批准',
          type: 'text',
          method: 'handleApproval',
          disabFun: (row, index) => {
            return !row.submitUserName || !!row.ratifyUserName
          }
        }],
        tagField: {},
        selectField: {},
        requiredAdd: [],
        requiredUp: [],
        needSort: [],
        inputType: ''
      },
      entityCopy: {},
      entityCopy0: {},
      upIndex: 0,
      addInfo: {},
      title: '新增',
      addInfo: {},
      addDialogVisible: false,
      fileList: [],
      typeList: [],
      currentInfo: {},
    }
  },
  // ç”¨äºŽä¸Šä¼ æ–‡ä»¶çš„信息
  computed: {
    headers() {
      return {
        'Authorization': "Bearer " + getToken()
      }
    },
    action() {
      return this.javaApi + this.$api.manageRecordIntervals.exportInManageRecordIntervals
    }
  },
  mounted() {
    this.entityCopy = this.HaveJson(this.componentData.entity);
    this.entityCopy0 = this.HaveJson(this.componentData0.entity);
    this.getPower()
    this.getFileList()
    this.selectEnumByCategory()
  },
  methods: {
    getPower() {
      let power = JSON.parse(sessionStorage.getItem('power'))
      let add = false
      let del = false
      let up = false;
      let out = false;
      let submit = false
      let ratify = false
      for (var i = 0; i < power.length; i++) {
        if (power[i].menuMethod == 'addManageRecordIntervals') {
          add = true
        }
        if (power[i].menuMethod == 'delManageRecordIntervals') {
          del = true
        }
        if (power[i].menuMethod == 'exportInManageRecordIntervals') {
          up = true
        }
        if (power[i].menuMethod == 'exportOutManageRecordIntervals') {
          out = true
        }
        if (power[i].menuMethod == 'submitManageRecordIntervalsTotal') {
          submit = true
        }
        if (power[i].menuMethod == 'ratifyManageRecordIntervalsTotal') {
          ratify = true
        }
      }
      if (!ratify) {
        this.componentData0.do.splice(3, 1)
      }
      if (!submit) {
        this.componentData0.do.splice(2, 1)
      }
      if (!add) {
        this.componentData.do.splice(1, 1)
      }
      if (!del) {
        this.componentData.do.splice(0, 1)
      }
      this.addPower = add
      this.outPower = out
      this.upPower = up
    },
    // æ–°å¢ž
    openAdd() {
      // this.$refs.ValueTable.openAddDia(this.$api.manageRecordIssueRecycle.addManageRecordIssueRecycle);
      this.addInfo = {}
      this.title = '新增'
      this.addDialogVisible = true;
    },
    // å¯¼å‡º
    handleDown() {
      this.outLoading = true
      this.$axios.post(this.$api.manageRecordIntervals.exportOutManageRecordIntervals, { entity: this.componentData.entity }, { headers: { 'Content-Type': 'application/json' } }).then(res => {
        this.outLoading = false
        if (res.code == 201) return this.$message.error('导出失败')
        this.$message.success('导出成功')
        let url = this.javaApi + 'word/' + res.message
        const link = document.createElement('a');
        link.href = url;
        link.download = '文件定期审查记录';
        link.click();
      })
    },
    refreshTable(num) {
      if (num) {
        this.$refs['ValueTable0'].selectList()
      } else {
        this.refreshTable()()
      }
    },
    refresh(num) {
      if (num) {
        this.componentData0.entity = this.HaveJson(this.entityCopy0)
        this.upIndex++
      } else {
        this.componentData.entity = this.HaveJson(this.entityCopy)
        this.upIndex++
      }
    },
    beforeUpload(file) {
      if (file.size > 1024 * 1024 * 10) {
        this.$message.error('上传文件不超过10M');
        this.$refs.upload.clearFiles()
        return false;
      } else {
        // this.upLoading = true;
        return true;
      }
    },
    onError(err, file, fileList) {
      this.$message.error('上传失败')
      this.$refs.upload.clearFiles()
    },
    handleSuccessUp(response) {
      this.upLoading = false;
      if (response.code == 200) {
        this.$message.success('上传成功');
        this.refreshTable()()
      } else {
        this.$message.error('上传失败');
      }
    },
    getCurrentFile(e) {
      let obj = this.fileList.find(m => m.documentCode == e)
      if (obj) {
        this.$set(this.addInfo, 'documentName', obj.name)
        this.$set(this.addInfo, 'documentVersion', obj.version)
        // this.addInfo.documentName = obj.name
        // this.addInfo.documentVersion = obj.version
      }
    },
    // èŽ·å–文件列表--文件清单
    getFileList() {
      this.$axios.post(this.$api.manageDocumentList.pageManageDocumentList, {
        entity: {
          orderBy: {
            field: 'id',
            order: 'asc'
          }
        },
        page: {
          current: -1,
          size: -1
        }
      }, {
        headers: {
          'Content-Type': 'application/json'
        }
      }).then(res => {
        this.fileList = res.data.body.records.map(m => {
          m.title = m.documentCode
          return m
        })
      }).catch(err => { })
    },
    selectEnumByCategory() {
      this.$axios.post(this.$api.enums.selectEnumByCategory, {
        category: "适宜性"
      }).then(res => {
        this.typeList = res.data
      })
    },
    // æäº¤
    handleAdd() {
      if (!this.addInfo.documentCode) return this.$message.error('请输入文件编号')
      this.addLoading = true
      let obj = {}
      if (this.title == '新增') {
        obj = this.HaveJson(this.addInfo)
      } else {
        let { id, documentCode, documentName, documentVersion, revision, suitability, remark } = this.addInfo
        obj = { id, documentCode, documentName, documentVersion, revision, suitability, remark }
      }
      this.$axios.post(this.$api.manageRecordIntervals[this.title == '新增' ? 'addManageRecordIntervals' : 'doManageRecordIntervals'], obj, { headers: { 'Content-Type': 'application/json' }, noQs: true }).then(res => {
        this.addLoading = false
        if (res.code == 201) {
          return
        }
        this.addDialogVisible = false
        this.$message({
          type: 'success',
          message: '操作成功!'
        });
        this.refreshTable()
      }).catch(err => { })
    },
    // ä¿®æ”¹
    handleEdit(row) {
      this.addInfo = row
      this.title = '编辑'
      this.addDialogVisible = true;
    },
    submitCheck(state) {
      if (state == '通过') {
        this.checkLoading = true
      } else {
        this.noCheckLoading = true
      }
      this.$axios.post(this.$api.manageRecordIntervals.ratifyManageRecordIntervalsTotal, {
        id: this.currentInfo.id,
        ratifyState: state
      }).then(res => {
        this.checkLoading = false
        if (res.code == 201) {
          return
        }
        this.noCheckLoading = false
        this.$message({
          type: 'success',
          message: '操作成功!'
        });
        this.$refs['ValueTable0'].selectList()
        this.lookDialogVisible = false
      }).catch(err => { });
    },
    // æŸ¥çœ‹
    handleLook(row) {
      this.title0 = '查看'
      this.commonFun(row)
    },
    commonFun(row, callbanck) {
      this.currentInfo = row
      this.lookDialogVisible = true
      if (callbanck) {
        callbanck()
      }
    },
    handleDown0(row) {
      let url = this.javaApi + 'word/' + row.url
      const link = document.createElement('a');
      link.href = url;
      link.download = row.month + ' æ‰€æœ‰æ–‡ä»¶å®šæœŸæ£€æŸ¥è®°å½•';
      link.click();
    },
    // æäº¤
    handleSubmit(row) {
      this.$confirm('是否提交 ' + row.year + ' å¹´çš„数据', '提交', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.$axios.post(this.$api.manageRecordIntervals.submitManageRecordIntervalsTotal, {
          id: row.id
        }).then(res => {
          if (res.code === 201) return
          this.$message({
            type: 'success',
            message: '提交成功!'
          });
          this.$refs['ValueTable0'].selectList()
        }).catch(err => { });
      })
    },
    // æ‰¹å‡†
    handleApproval(row) {
      this.title0 = '批准'
      this.commonFun(row)
    },
  }
}
</script>

<style scoped>
.title {
  height: 60px;
  line-height: 60px;
}

.search {
  background-color: #fff;
  height: 40px;
  display: flex;
  align-items: center;
  position: relative;
}

.search_thing {
  width: 350px;
  display: flex;
  align-items: center;
}

.search_label {
  width: 110px;
  font-size: 14px;
  text-align: right;
}

.search_input {
  width: calc(100% - 110px);
}

.table {
  margin-top: 10px;
  background-color: #fff;
  width: calc(100% - 40px);
  height: calc(100% - 60px - 140px);
  padding: 20px;
}

>>>.el-tabs__content {
  height: 100%;
}

.btns {
  position: absolute;
  right: 20px;
  top: 5px;
}
</style>

 src/views/CNAS/systemManagement/documentRecords/revisionRecord.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,848 @@
<template>
  <!-- æ–‡ä»¶ä¿®è®¢ç”³è¯·å®¡æ‰¹è®°å½• -->
  <div class="DocumentRevisionRequestApprovalRecords">
    <el-row class="title">
      <el-col :span="12" style="padding-left: 20px;text-align: left;">文件修订申请审批记录</el-col>
      <el-col :span="12" style="text-align: right;">
        <el-button size="medium" type="primary" @click="openAdd" v-if="addPower">新增</el-button>
        <!-- <el-upload :action="action" :show-file-list="false"
          accept='.doc,.docx' :headers="headers" :on-change="beforeUpload"
          :on-error="onError" ref='upload' v-if="upPower" :on-success="handleSuccessUp" style="display:inline-block;margin-left: 20px;">
          <el-button type="primary" size="medium">导入</el-button></el-upload> -->
        <el-button size="medium" type="primary" @click="handleDown" :loading="outLoading" v-if="outPower"
          style="display:inline-block;margin-left: 20px;">导出</el-button>
      </el-col>
    </el-row>
    <div class="search">
      <!-- <div class="search_thing">
        <div class="search_label">文件名称：</div>
        <div class="search_input"><el-input size="small" placeholder="请输入" clearable v-model="componentData.entity.documentName"
            @keyup.enter.native="refreshTable()"></el-input></div>
      </div> -->
      <div class="search_thing">
        <div class="search_label">文件编号：</div>
        <div class="search_input">
          <el-input size="small" placeholder="请输入" clearable v-model="componentData.entity.documentCode"
            @keyup.enter.native="refreshTable()"></el-input>
        </div>
      </div>
      <div class="search_thing" style="padding-left: 30px;">
        <el-button size="small" @click="refresh()">重 ç½®</el-button>
        <el-button size="small" type="primary" @click="refreshTable()">查 è¯¢</el-button>
      </div>
    </div>
    <div class="table">
      <ValueTable ref="ValueTable" :url="$api.manageRecordAudit.pageManageRecordAudit"
        :delUrl="$api.manageRecordAudit.delManageRecordAudit" :componentData="componentData"
        :upUrl="$api.manageRecordIssueRecycle.doManageRecordIssueRecycle" :key="upIndex" />
    </div>
    <el-dialog :title="title" :visible.sync="addDialogVisible" width="800px" top="6vh">
      <el-row>
        <el-col :span="12" style="margin-bottom: 16px;">
          <div class="search_thing">
            <div class="search_label">申请类型：</div>
            <div class="search_input">
              <el-radio-group v-model="addInfo.method" size="small" :disabled="title.includes('意见')">
                <el-radio label="修订">修订</el-radio>
                <el-radio label="作废">作废</el-radio>
              </el-radio-group>
            </div>
          </div>
        </el-col>
        <el-col :span="12" style="margin-bottom: 16px;">
          <div class="search_thing">
            <div class="search_label"><span style="color: red;margin-left: 4px;">* </span>文件编号：</div>
            <div class="search_input">
              <el-select v-model="addInfo.documentCode" size="small" style="width: 100%;" @change="getCurrentFile"
                allow-create clearable filterable :disabled="title.includes('意见')">
                <el-option v-for="item in fileList" :key="item.documentCode" :label="item.title"
                  :value="item.documentCode">
                </el-option>
              </el-select>
            </div>
          </div>
        </el-col>
        <el-col :span="12" 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.documentName"
                :disabled="title.includes('意见')"></el-input></div>
          </div>
        </el-col>
        <el-col :span="12" 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.capter"
                :disabled="title.includes('意见')"></el-input></div>
          </div>
        </el-col>
        <el-col :span="12" 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.pages"
                :disabled="title.includes('意见')"></el-input></div>
          </div>
        </el-col>
        <el-col :span="12" 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.number"
                :disabled="title.includes('意见')"></el-input></div>
          </div>
        </el-col>
        <el-col :span="12" 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.beforeVersion"
                :disabled="title.includes('意见')"></el-input></div>
          </div>
        </el-col>
        <el-col :span="12" 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.afterVersion"
                :disabled="title.includes('意见')"></el-input></div>
          </div>
        </el-col>
        <el-col :span="12" style="margin-bottom: 16px;">
          <div class="search_thing">
            <div class="search_label">修订人：</div>
            <div class="search_input">
              <el-select v-model="addInfo.alterUser" placeholder="请选择" size="small" style="width: 100%;" filterable
                :disabled="title.includes('意见')">
                <el-option v-for="item in personList" :key="item.value" :label="item.label" :value="item.value">
                </el-option>
              </el-select>
            </div>
          </div>
        </el-col>
        <el-col :span="12" style="margin-bottom: 16px;">
          <div class="search_thing">
            <div class="search_label">原分发部门：</div>
            <div class="search_input">
              <el-select v-model="addInfo.beforeDepart" placeholder="请选择" size="small" style="width: 100%;"
                :disabled="title.includes('意见')">
                <el-option v-for="item in list" :key="item.name" :label="item.name" :value="item.name">
                </el-option>
              </el-select>
            </div>
          </div>
        </el-col>
        <el-col :span="12" style="margin-bottom: 16px;">
          <div class="search_thing">
            <div class="search_label">修订后分发部门：</div>
            <div class="search_input">
              <el-select v-model="addInfo.afterDepart" placeholder="请选择" size="small" style="width: 100%;"
                :disabled="title.includes('意见')">
                <el-option v-for="item in list" :key="item.name" :label="item.name" :value="item.name">
                </el-option>
              </el-select>
            </div>
          </div>
        </el-col><el-col :span="12" style="margin-bottom: 16px;">
          <div class="search_thing">
            <div class="search_label">日期：</div>
            <div class="search_input">
              <el-date-picker v-model="addInfo.date" 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" style="width: 90%;">
            <div class="search_label">修改内容：</div>
            <div class="search_input"><el-input size="small" placeholder="请输入" clearable v-model="addInfo.alterThing"
                type="textarea" :rows="2" :disabled="title.includes('意见')"></el-input></div>
          </div>
        </el-col>
        <el-col :span="24" style="margin-bottom: 16px;">
          <div class="search_thing" style="width: 90%;">
            <div class="search_label">变化原因：</div>
            <div class="search_input"><el-input size="small" placeholder="请输入" clearable v-model="addInfo.reason"
                type="textarea" :rows="2" :disabled="title.includes('意见')"></el-input></div>
          </div>
        </el-col>
        <el-col :span="12" style="margin-bottom: 16px;">
          <div class="search_thing">
            <div class="search_label">上传附件：</div>
            <div class="search_input"><el-upload style="margin: 8px 0 0px 50px;" action="#" :auto-upload="false"
                :multiple="false" accept='.pdf' :on-change="handleChangeUpload"
                v-if="addDialogVisible && !title.includes('意见')">
                <el-button size="small" type="primary">上传附件</el-button>
              </el-upload></div>
          </div>
        </el-col>
        <el-col :span="12" style="margin-bottom: 16px;" v-if="title.includes('意见')">
          <div class="search_thing">
            <div class="search_label">申请部门主管意见：</div>
            <div class="search_input"><el-input size="small" placeholder="请输入" clearable v-model="addInfo.applicant"
                type="textarea" :rows="2" :disabled="title != '申请部门主管意见'"></el-input></div>
          </div>
        </el-col>
        <el-col :span="12" style="margin-bottom: 16px;" v-if="title.includes('意见')">
          <div class="search_thing">
            <div class="search_label">原定制部门意见：</div>
            <div class="search_input"><el-input size="small" placeholder="请输入" clearable v-model="addInfo.formulation"
                type="textarea" :rows="2" :disabled="title != '原定制部门意见'"></el-input></div>
          </div>
        </el-col>
        <el-col :span="12" style="margin-bottom: 16px;" v-if="title.includes('意见')">
          <div class="search_thing">
            <div class="search_label">原审核部门意见：</div>
            <div class="search_input"><el-input size="small" placeholder="请输入" clearable v-model="addInfo.audit"
                type="textarea" :rows="2" :disabled="title != '原审核部门意见'"></el-input></div>
          </div>
        </el-col>
      </el-row>
      <span slot="footer" class="dialog-footer">
        <el-button @click="addDialogVisible = false">取 æ¶ˆ</el-button>
        <el-button type="primary" @click="handleAdd" :loading="addLoading">ç¡® å®š</el-button>
      </span>
    </el-dialog>
    <el-dialog :title="title0" :visible.sync="detailDialogVisible" width="900px" top="20px"
      :class="{ downPdf: title0 == '下载' }" :modal="title0 != '下载'">
      <div style="max-height: 75vh;overflow-y: auto;">
        <div id="dialogBody">
          <h4 style="display: flex;align-items: center;flex-direction: column;justify-content: center;">
            <span style="font-size: 20px;">文件更改/作废申请表</span>
            <span>Application for alteration/cancellation of Document</span>
          </h4>
          <p style="display: flex;justify-content: space-between;margin-top: 16px;">
            <span>{{ currentInfo.documentCode }}</span>
            <span>{{ currentInfo.method }}</span>
          </p>
          <table border="1" class="tables" cellpadding="10">
            <tr>
              <td>
                <p>申请部门</p>
                <p class="en">Application department</p>
              </td>
              <td>{{ currentInfo.createUserDepart }}</td>
              <td>
                <p>申请人</p>
                <p>Proposer</p>
              </td>
              <td>{{ currentInfo.createUserName }}</td>
              <td>
                <p>申请时间</p>
                <p class="en">Application date</p>
              </td>
              <td>{{ currentInfo.createTime }}</td>
            </tr>
            <tr>
              <td>
                <p>文件名称</p>
                <p class="en">File name</p>
              </td>
              <td colspan="3">{{ currentInfo.documentName }}</td>
              <td>
                <p>文件编号</p>
                <p class="en">Document number</p>
              </td>
              <td>{{ currentInfo.documentCode }}</td>
            </tr>
            <tr>
              <td>
                <p>修改前版次</p>
                <p class="en">Modify previous editions</p>
              </td>
              <td colspan="2">{{ currentInfo.beforeVersion }}</td>
              <td>
                <p>修改后版次</p>
                <p class="en">Revised edition</p>
              </td>
              <td colspan="2">{{ currentInfo.afterVersion }}</td>
            </tr>
            <tr>
              <td>
                <p>变化原因</p>
                <p class="en">Changing reason</p>
              </td>
              <td colspan="5">
                <div class="user-content">
                  <p style="text-align: left;line-height: 26px;">{{ currentInfo.reason }}</p>
                </div>
              </td>
            </tr>
            <tr>
              <td>
                <p>原文内容</p>
                <p class="en">Original content</p>
              </td>
              <td colspan="2">见附件</td>
              <td>
                <p>拟修订内容</p>
                <p class="en">Content be revised</p>
              </td>
              <td colspan="2">{{ currentInfo.alterThing }}</td>
            </tr>
            <tr>
              <td>
                <p>修订后分发部门</p>
                <p class="en">Distribute to the department after revision</p>
              </td>
              <td colspan="2">{{ currentInfo.afterDepart }}</td>
              <td>
                <p>原分放部门</p>
                <p class="en">The original distribution department</p>
              </td>
              <td colspan="2">{{ currentInfo.beforeDepart }}</td>
            </tr>
            <tr>
              <td>
                <p>申请部门主管意见</p>
                <p class="en">Opinion of the head of the applicant department</p>
              </td>
              <td colspan="2">
                <p>原制定部门意见</p>
                <p class="en">Original formulation of the department's opinion</p>
              </td>
              <td colspan="2">
                <p>原审核部门意见</p>
                <p class="en">Opinion of the original audit department</p>
              </td>
              <td>
                <p>批准</p>
                <p class="en">Ratify</p>
              </td>
            </tr>
            <tr>
              <td>
                {{ currentInfo.applicant }}
              </td>
              <td colspan="2">
                {{ currentInfo.formulation }}
              </td>
              <td colspan="2">
                {{ currentInfo.audit }}
              </td>
              <td>
                <img :src="javaApi + 'img/' + currentInfo.ratifyUserUrl" style="width: 100%;" alt="批准人签名">
              </td>
            </tr>
          </table>
        </div>
      </div>
    </el-dialog>
    <el-dialog title="文件预览" :visible.sync="lookDialogVisible" width="800px" top="5vh" fullscreen>
      <h4>修订内容</h4>
      <filePreview v-if="lookDialogVisible" :fileUrl="javaApi + '/word/' + currentInfo.afterUrl" :currentFile="{}" />
      <h4>原内容</h4>
      <filePreview v-if="lookDialogVisible" :fileUrl="javaApi + '/word/' + currentInfo.beforeUrl" :currentFile="{}" />
    </el-dialog>
  </div>
</template>

<script>
import ValueTable from '@/components/Table/value-table.vue'
import { exportHtmlToPDF } from '@/utils/downHtmlToPDF'
import filePreview from '@/components/Preview/filePreview.vue'
export default {
  components: {
    ValueTable,
    filePreview
  },
  data() {
    return {
      addPower: true,
      outPower: true,
      outLoading: false,
      lookDialogVisible: false,
      addLoading: false,
      componentData: {
        entity: {
          // documentName: null,
          documentCode: null,
          orderBy: {
            field: 'createTime',
            order: 'desc'
          }
        },
        isIndex: true,
        showSelect: false,
        select: false,
        // selectMethod: 'handleChangeTask',
        do: [{
          id: 'handleLook',
          font: '查看',
          type: 'text',
          method: 'handleLook'
        }, {
          id: 'handleLook0',
          font: '文件预览',
          type: 'text',
          method: 'handleLook0'
        }, {
          id: 'handleOut',
          font: '下载',
          type: 'text',
          method: 'handleOut'
        }, {
          id: 'delete',
          font: '删除',
          type: 'text',
          method: 'doDiy',
          disabFun: (row, index) => {
            return !!row.ratifyUser
          }
        }, {
          id: 'handleEdit',
          font: '修改',
          type: 'text',
          method: 'handleEdit',
          field: [],
          disabFun: (row, index) => {
            return !!row.ratifyUser
          }
        }, {
          id: 'handleRatify',
          font: '批准',
          type: 'text',
          method: 'handleRatify',
          field: [],
          disabFun: (row, index) => {
            return !!row.ratifyUser
          }
        }, {
          id: 'handlework0',
          font: '申请意见',
          type: 'text',
          method: 'handlework0',
          field: [],
          disabFun: (row, index) => {
            return !!row.ratifyUser
          }
        }, {
          id: 'handlework1',
          font: '原定制意见',
          type: 'text',
          method: 'handlework1',
          field: [],
          disabFun: (row, index) => {
            return !!row.ratifyUser
          }
        }, {
          id: 'handlework2',
          font: '原审核意见',
          type: 'text',
          method: 'handlework2',
          field: [],
          disabFun: (row, index) => {
            return !!row.ratifyUser
          }
        }],
        tagField: {
          // documentType:{
          //   select: []
          // },
          // receiveUserName:{
          //   select: []
          // },
        },
        selectField: {
          // documentType:{
          //   select: []
          // },
          // receiveUserName:{
          //   select: []
          // },
        },
        addUpload: ['signatoryUrl'],
        requiredAdd: [],
        requiredUp: [],
        datePicker: ['receiveDate'],
        noHead: ['signedUserName', 'signedDate', 'departLims'],//不参与新增编辑的字段
        needSort: [],
        inputType: ''
      },
      entityCopy: {},
      upIndex: 0,
      title: '新增',
      addInfo: {
        method: '修订',
      },
      addDialogVisible: false,
      detailDialogVisible: false,
      fileList: [],
      personList: [],
      list: [],
      file: null,
      title0: '查看',
      currentInfo: {},
    }
  },
  mounted() {
    this.entityCopy = this.HaveJson(this.componentData.entity);
    this.getPower()
    this.getFileList()
    this.getAuthorizedPerson()
    this.selectTreeList()
  },
  methods: {
    getPower() {
      let power = JSON.parse(sessionStorage.getItem('power'))
      let add = false
      let del = false
      let out = false;
      let ratify = false
      let audit1 = false
      let audit2 = false
      let audit3 = false
      for (var i = 0; i < power.length; i++) {
        if (power[i].menuMethod == 'addManageRecordAudit') {
          add = true
        }
        if (power[i].menuMethod == 'delManageRecordAudit') {
          del = true
        }
        if (power[i].menuMethod == 'ratifyManageRecordAudit') {
          ratify = true
        }
        if (power[i].menuMethod == 'exportOutManageRecordAudit') {
          out = true
        }
        if (power[i].menuMethod == 'manageRecordAudit1') {
          audit1 = true
        }
        if (power[i].menuMethod == 'manageRecordAudit2') {
          audit2 = true
        }
        if (power[i].menuMethod == 'manageRecordAudit3') {
          audit3 = true
        }
      }
      if (!audit3) {
        this.componentData.do.splice(8, 1)
      }
      if (!audit2) {
        this.componentData.do.splice(7, 1)
      }
      if (!audit1) {
        this.componentData.do.splice(6, 1)
      }
      if (!ratify) {
        this.componentData.do.splice(5, 1)
      }
      if (!add) {
        this.componentData.do.splice(4, 1)
      }
      if (!del) {
        this.componentData.do.splice(3, 1)
      }
      this.addPower = add
      this.outPower = out
    },
    openAdd() {
      this.addInfo = {
        method: '修订',
      }
      this.title = '新增'
      this.addDialogVisible = true;
    },
    // å¯¼å‡º
    handleDown() {
      this.outLoading = true
      this.$axios.post(this.$api.manageRecordAudit.exportOutManageRecordAudit, { entity: this.componentData.entity }, { headers: { 'Content-Type': 'application/json' } }).then(res => {
        this.outLoading = false
        if (res.code == 201) return this.$message.error('导出失败')
        this.$message.success('导出成功')
        let url = this.javaApi + 'word/' + res.message
        const link = document.createElement('a');
        link.href = url;
        link.download = '文件修订表';
        link.click();
      })
    },
    refreshTable() {
      this.refreshTable()()
    },
    refresh() {
      this.componentData.entity = this.HaveJson(this.entityCopy)
      this.upIndex++
      this.refreshTable()
    },
    // èŽ·å–文件列表--文件清单
    getFileList() {
      this.$axios.post(this.$api.manageDocumentList.pageManageDocumentList, {
        entity: {
          orderBy: {
            field: 'createTime',
            order: 'desc'
          }
        },
        page: {
          current: -1,
          size: -1
        }
      }, {
        headers: {
          'Content-Type': 'application/json'
        }
      }).then(res => {
        this.fileList = res.data.body.records.map(m => {
          m.title = m.documentCode
          return m
        })
      }).catch(err => { })
    },
    getCurrentFile(e) { },
    handleAdd() {
      if (!this.addInfo.documentCode) return this.$message({ type: 'error', message: "请输入文件编号" })
      if (!this.addInfo.id) {
        // æ–°å¢ž
        let fd = new FormData();
        //文件信息中raw才是真的文件
        if (this.file) {
          fd.append("file", this.file.raw);
        }
        for (let m in this.addInfo) {
          fd.append(m, this.addInfo[m])
        }
        this.addLoading = true
        this.$axios.post(this.$api.manageRecordAudit.addManageRecordAudit, fd, {
          headers: {
            'Content-Type': 'multipart/form-data'
          },
          noQs: true
        }).then(res => {
          this.addLoading = false
          if (res.code == 200) {
            this.$message({
              type: 'success',
              message: '添加成功'
            })
            this.refreshTable()
            this.addDialogVisible = false
          } else {
            this.$message({
              type: 'error',
              message: '添加失败'
            })
          }
        })
      } else {
        // ä¿®æ”¹
        let { id, method, documentCode, documentName, capter, pages, beforeVersion, afterVersion, alterUser, alterThing, reason, beforeDepart, afterDepart, number, applicant, formulation, audit, date } = this.addInfo
        let fd = new FormData();
        //文件信息中raw才是真的文件
        if (this.file) {
          fd.append("file", this.file.raw);
        }
        let obj = { id, method, documentCode, documentName, capter, pages, beforeVersion, afterVersion, alterUser, alterThing, reason, beforeDepart, afterDepart, number, applicant, formulation, audit, date }
        for (let m in obj) {
          if (this.addInfo[m]) {
            fd.append(m, this.addInfo[m])
          }
        }
        this.addLoading = true
        this.$axios.post(this.$api.manageRecordAudit.doManageRecordAudit, fd, {
          headers: {
            'Content-Type': 'multipart/form-data'
          },
          noQs: true
        }).then(res => {
          this.addLoading = false
          if (res.code == 200) {
            this.refreshTable()
            this.addDialogVisible = false
          } else {
            this.$message({
              type: 'error',
              message: '添加失败'
            })
          }
        })
      }
    },
    getAuthorizedPerson() {
      this.$axios.get(this.$api.user.getUserMenu).then(res => {
        let data = []
        res.data.forEach(a => {
          data.push({
            label: a.name,
            value: a.id
          })
        })
        // this.componentData.tagField.receiveUserName.select = data
        // this.componentData.selectField.receiveUserName.select = data
        this.personList = data
      })
    },
    // æŸ¥è¯¢æ ‘形列表
    selectTreeList() {
      this.$axios.get(this.$api.personnel.selectCNSAPersonTree).then((res) => {
        this.list = res.data[0].children;
      });
    },
    handleChangeUpload(file, fileLists) {
      this.file = file
      // this.$set(this.addInfo,'name',file.name)
    },
    handleEdit(row) {
      this.addInfo = row
      this.title = '修改'
      this.addDialogVisible = true;
    },
    // å®¡æ‰¹
    handleRatify(row) {
      this.$confirm('是否批准通过?', '批准', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          this.$axios
            .post(this.$api.manageRecordAudit.ratifyManageRecordAudit, { id: row.id })
            .then(res => {
              if (res.code === 201) {
                return;
              }
              this.$message.success('操作成功');
              this.refreshTable();
            })
            .catch(e => {
              this.$message.error('操作失败');
            });
        })
        .catch(() => {
        });
    },
    handlework0(row) {
      this.addInfo = row
      this.title = '申请部门主管意见'
      this.addDialogVisible = true;
    },
    handlework1(row) {
      this.addInfo = row
      this.title = '原定制部门意见'
      this.addDialogVisible = true;
    },
    handlework2(row) {
      this.addInfo = row
      this.title = '原审核部门意见'
      this.addDialogVisible = true;
    },
    handleLook(row) {
      this.title0 = '查看'
      this.currentInfo = row
      this.detailDialogVisible = true;
    },
    handleOut(row) {
      this.currentInfo = row
      this.title0 = '下载'
      this.detailDialogVisible = true;
      setTimeout(() => {
        this.$nextTick(() => {
          const element = document.getElementById("dialogBody");
          exportHtmlToPDF(element, '文件' + row.method + '申请表').then(res => {
            this.detailDialogVisible = false;
          })
        })
      }, 500);
    },
    handleLook0(row) {
      this.currentInfo = row;
      this.lookDialogVisible = true
    }
  }
}
</script>

<style scoped>
.title {
  height: 60px;
  line-height: 60px;
}

.search {
  background-color: #fff;
  height: 80px;
  display: flex;
  align-items: center;
}

.search_thing {
  width: 350px;
  display: flex;
  align-items: center;
}

.search_label {
  width: 110px;
  font-size: 14px;
  text-align: right;
}

.search_input {
  width: calc(100% - 110px);
}

.table {
  margin-top: 10px;
  background-color: #fff;
  width: calc(100% - 40px);
  height: calc(100% - 60px - 80px - 10px - 40px);
  padding: 20px;
}

.tables {
  table-layout: fixed;
  width: 100%;
  margin-top: 10px;
}

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

.en {
  font-size: 12px;
  word-break: break-word;
  /* è‡ªåŠ¨æ–­è¡Œ */
  overflow-wrap: break-word;
  /* é˜²æ­¢æº¢å‡º */
  white-space: normal;
  /* é»˜è®¤æ¢è¡Œ */
}

.heads td {
  border: 1px dashed black;
  /* å•å…ƒæ ¼çš„虚线 */
  padding: 8px;
  text-align: left;
}

.downPdf {
  opacity: 0 !important;
}

h4.title {
  position: relative;
  height: 30px;
  line-height: 30px;
  box-sizing: border-box;
  padding-left: 16px;
  margin-left: 10px;
  margin-bottom: 10px;
}

h4.title::after {
  content: '';
  width: 4px;
  height: 20px;
  background: #3A7BFA;
  position: absolute;
  top: 5px;
  left: 0;
}

>>>.el-dialog__body {
  height: auto;
}
</style>