合同管理加下载合同功能

gaoluyang

2025-11-07 a11a30d3cc4e04b6c48857bc39fb7b4909c495cd

 src/views/personnelManagement/contractManagement/index.vue

@@ -12,7 +12,7 @@
      </div>
      <div>
        <!--        <el-button type="primary" @click="openForm('add')">新增入职</el-button>-->
        <el-button type="info" @click="handleImport">导入</el-button>
<!--        <el-button type="info" @click="handleImport">导入</el-button>-->
        <el-button @click="handleOut">导出</el-button>
        <!--        <el-button type="danger" plain @click="handleDelete">删除</el-button>-->
      </div>
@@ -65,27 +65,25 @@
        </div>
      </template>
    </el-dialog>
    <files-dia ref="filesDia"></files-dia>
  </div>
</template>

<script setup>
import { Search } from "@element-plus/icons-vue";
import { onMounted, ref } from "vue";
import { Search, UploadFilled } from "@element-plus/icons-vue";
import { onMounted, ref, reactive, toRefs, getCurrentInstance, nextTick } from "vue";
import FormDia from "@/views/personnelManagement/contractManagement/components/formDia.vue";
import { ElMessageBox } from "element-plus";
import { staffOnJobListPage } from "@/api/personnelManagement/employeeRecord.js";
import { staffOnJobListPage, staffOnJobExportCopy } from "@/api/personnelManagement/employeeRecord.js";
import dayjs from "dayjs";
import { getToken } from "@/utils/auth.js";

import FilesDia from "./filesDia.vue";
const data = reactive({
  searchForm: {
    staffName: "",
    entryDate: [
      dayjs().format("YYYY-MM-DD"),
      dayjs().add(1, "day").format("YYYY-MM-DD"),
    ], // 录入日期
    entryDateStart: dayjs().format("YYYY-MM-DD"),
    entryDateEnd: dayjs().add(1, "day").format("YYYY-MM-DD"),
    entryDate: null, // 录入日期
    entryDateStart: undefined,
    entryDateEnd: undefined,
  },
});
const { searchForm } = toRefs(data);
@@ -126,7 +124,7 @@
    prop: "sex",
  },
  {
    label: "籍贯",
    label: "户籍住址",
    prop: "nativePlace",
  },
  {
@@ -134,7 +132,7 @@
    prop: "postJob",
  },
  {
    label: "家庭住址",
    label: "现住址",
    prop: "adress",
    width: 200
  },
@@ -146,11 +144,6 @@
    label: "专业",
    prop: "profession",
    width: 100
  },
  {
    label: "身份证号",
    prop: "identityCard",
    width: 200
  },
  {
    label: "年龄",
@@ -171,10 +164,10 @@
    prop: "emergencyContactPhone",
    width: 150
  },
  {
    label: "合同年限",
    prop: "contractTerm",
  },
  // {
  //   label: "合同年限",
  //   prop: "contractTerm",
  // },
  // {
  //   label: "合同开始日期",
  //   prop: "contractStartTime",
@@ -190,6 +183,7 @@
    label: "操作",
    align: "center",
    fixed: 'right',
    width: 180,
    operation: [
      {
        name: "详情",
@@ -198,9 +192,24 @@
          openForm("edit", row);
        },
      },
      {
        name: "附件",
        type: "text",
        clickFun: (row) => {
          openFilesFormDia(row);
        },
      },
      {
        name: "下载合同",
        type: "text",
        clickFun: (row) => {
          handleDownloadContract(row);
        },
      },
    ],
  },
]);
const filesDia = ref()
const tableData = ref([]);
const selectedRows = ref([]);
const tableLoading = ref(false);
@@ -220,6 +229,13 @@
    searchForm.value.entryDateEnd = dayjs(value[1]).format("YYYY-MM-DD");
  }
  getList();
};
// 打开附件弹框
const openFilesFormDia = (row) => {
  console.log(row)
  nextTick(() => {
    filesDia.value?.openDialog( row,'合同')
  })
};
// 查询列表
/** 搜索按钮操作 */
@@ -269,6 +285,33 @@
      proxy.$modal.msg("已取消");
    });
};
// 下载合同
const handleDownloadContract = (row) => {
  const fileName = `${row.staffName || "合同"}劳动合同.docx`;
  proxy.$modal?.loading?.("正在生成合同，请稍候...");
  staffOnJobExportCopy({ ...row })
    .then((res) => {
      proxy.$modal?.closeLoading?.();
      if (res?.code === 200 && res?.msg) {
        const javaApi = proxy.javaApi || import.meta.env.VITE_JAVA_API || "";
        const downloadPath = res.msg.startsWith("/") ? res.msg : `/${res.msg}`;
        const downloadUrl = `${javaApi}${downloadPath}`;
        const link = document.createElement("a");
        link.href = downloadUrl;
        link.download = fileName;
        link.target = "_blank";
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
      } else {
        proxy.$modal.msgError(res?.msg || "合同生成失败");
      }
    })
    .catch(() => {
      proxy.$modal?.closeLoading?.();
      proxy.$modal.msgError("合同生成失败，请稍后重试");
    });
};
const upload = reactive({
  // 是否显示弹出层（合同导入）
  open: false,