人员导入和供应商导入

README.en.md

@@ -1,8 +1,3 @@
-# hdzy_front
-
-#### Description
-核电作业许可管理系统-前端
-
 #### Software Architecture
 Software architecture description
 

README.md

@@ -1,8 +1,3 @@
-# hdzy_front
-
-#### Description
-核电作业许可管理系统-前端
-
 ### yarn
 
 ```bash

src/api/config/http.js

@@ -2,7 +2,7 @@
  * @Author: PoJun
  * @Date: 2022-02-28 10:18:24
  * @LastEditors: PoJun
- * @LastEditTime: 2024-04-10 15:38:12
+ * @LastEditTime: 2024-07-09 16:21:18
  * @Message: Do not edit
  */
 import axios from "axios";
@@ -13,7 +13,7 @@ import { logoutSystem } from "@/utils/util";
 
 const defaultConfig = {
     baseURL: process.env.NODE_ENV == "development" ? "/api" : process.env.VUE_APP_API_BASE_URL, //代理域名路径
-    timeout: 15000,
+    timeout: 150000,
     headers: {
         get: {
             "Content-Type": "application/x-www-form-urlencoded;charset=utf-8",
@@ -44,6 +44,9 @@ axios.interceptors.request.use(
         if (!req.noToken) {
             req.headers.satoken = token;
         }
+        if (req.url.includes("importTemplate")) {
+            req.responseType = "blob";
+        }
         return req;
     },
     error => {
@@ -61,6 +64,11 @@ axios.interceptors.response.use(
             }
             const { data, code, message } = response.data;
 
+            // 兼容下下载
+            if (config.url.includes("importTemplate")) {
+                return response.data;
+            }
+
             if (code === 200 || code === 0) {
                 if (config.showMsg) {
                     Vue.prototype.$message.success(message);

src/api/index.js

@@ -2,7 +2,7 @@
  * @Author: PoJun
  * @Date: 2023-03-07 14:46:02
  * @LastEditors: PoJun
- * @LastEditTime: 2024-01-17 15:08:52
+ * @LastEditTime: 2024-07-08 18:20:55
  * @Message: Nothing
  */
 export * from "./reqs/auth";
@@ -15,3 +15,4 @@ export * from "./reqs/env";
 export * from "./reqs/org";
 export * from "./reqs/srm";
 export * from "./reqs/products";
+export * from "./reqs/exportImport";

src/api/reqs/exportImport.js

@@ -0,0 +1,12 @@
+import { $get, $post } from "../config/http.js";
+// org_person   人员
+// srm_supplier 供应商
+// 获取模板
+export const getImportTem = type => {
+    return $get({ url: `/system_ext/${type}/importTemplate`, reqConfig: { showMsg: true } });
+};
+
+/** 导入 */
+export const doImportFiles = (type, data) => {
+    return $post({ url: `/system_ext/${type}/import`, data, reqConfig: { showMsg: true } });
+};

src/components/importExport/FileImport.vue

@@ -0,0 +1,150 @@
+<template>
+    <a-modal
+        v-model="showImport"
+        :title="title"
+        @cancel="cancel"
+        :destroyOnClose="true"
+        :okButtonProps="{ style: { display: 'none' } }"
+        :bodyStyle="{ overflow: 'auto', 'max-height': '580px' }"
+    >
+        <a-spin :spinning="spinning">
+            <a-upload-dragger
+                accept=".xlsx"
+                name="file"
+                :multiple="false"
+                :beforeUpload="beforeUpload"
+                @reject="rejectUpload"
+                :showUploadList="false"
+                :customRequest="customRequest"
+            >
+                <p class="ant-upload-drag-icon">
+                    <a-icon type="inbox" />
+                </p>
+                <p class="ant-upload-text">将文件拖拽至此区域，或点击区域</p>
+                <p class="ant-upload-hint">仅支持xlsx，限30M以内</p>
+            </a-upload-dragger>
+
+            <div class="upload-errmsg" v-if="errorMsgs">
+                <div v-for="(value, key, index) in errorMsgs" :key="index">第 {{ key }} 行 数据{{ value }}</div>
+            </div>
+
+            <div class="upload-rule">
+                <h4 class="upload-rule-title">导入说明</h4>
+                <p>
+                    1. 上传前请先按照excel模板格式填写信息；
+                    <span class="upload-rule-down" @click="downloadTheTemplate">下载模板</span>
+                </p>
+                <p>2. 带红色信号的项为必填项，如果存在未填写项会导致数据导入失败；</p>
+            </div>
+        </a-spin>
+        <template #footer>
+            <a-button @click="cancel">关闭</a-button>
+        </template>
+    </a-modal>
+</template>
+
+<script>
+import { getImportTem, doImportFiles } from "@/api/index.js";
+export default {
+    props: {
+        value: {
+            type: Boolean,
+            default: false,
+        },
+        title: {
+            type: String,
+            default: "导入",
+        },
+        type: {
+            type: String,
+            default: "",
+        },
+    },
+    data() {
+        return {
+            showImport: false,
+            spinning: false,
+            errorMsgs: {},
+        };
+    },
+    methods: {
+        cancel() {
+            this.errorMsgs = {};
+            this.$emit("input", false);
+        },
+        beforeUpload(file) {
+            // 判断file是否是xlsx文件
+            const allowedExtensions = /(\.xlsx)$/i;
+            if (!allowedExtensions.exec(file.name)) {
+                this.rejectUpload();
+                return false;
+            }
+        },
+        rejectUpload() {
+            this.$message.error("仅支持 .xlsx 格式的文件！");
+        },
+        customRequest({ file }) {
+            const formData = new FormData();
+            formData.append("file", file, file.name.replace(/,/g, "%$"));
+            doImportFiles(this.type, formData)
+                .then(res => {
+                    if (res && Object.values(res).length) {
+                        this.errorMsgs = res;
+                        // 可能有部分错误, 但是列表还是得刷新.
+                        this.$emit("uploadOk");
+                    } else {
+                        this.$emit("uploadOk");
+                        this.$emit("input", false);
+                    }
+                })
+                .catch(err => {
+                    console.log(err);
+                });
+        },
+        downloadTheTemplate() {
+            getImportTem(this.type).then(res => {
+                const blob = new Blob([res], { type: "application/vnd.ms-excel;charset=UTF-8" });
+                const fileName = this.type === "srm_supplier" ? "供应商导入模板.xlsx" : "客户导入模板.xlsx";
+                if (window.navigator.msSaveOrOpenBlob) {
+                    navigator.msSaveBlob(blob, fileName);
+                } else {
+                    const link = document.createElement("a");
+                    link.href = URL.createObjectURL(blob);
+                    link.download = fileName;
+                    link.click();
+                    URL.revokeObjectURL(link.href);
+                }
+            });
+        },
+    },
+    watch: {
+        value: {
+            immediate: true,
+            handler(newValue) {
+                this.showImport = newValue;
+            },
+        },
+    },
+};
+</script>
+
+<style lang="less" scoped>
+/deep/ .ant-upload.ant-upload-drag .ant-upload {
+    padding: 80px 0;
+}
+
+.upload-errmsg {
+    margin-top: 10px;
+    color: @error-color;
+}
+.upload-rule {
+    &-title {
+        font-weight: 600;
+        margin-top: 20px;
+    }
+    &-down {
+        color: @primary-color;
+        cursor: pointer;
+    }
+}
+</style>

src/pages/organization/personnel.vue

@@ -2,7 +2,7 @@
  * @Author: PoJun
  * @Date: 2023-10-13 10:35:43
  * @LastEditors: PoJun
- * @LastEditTime: 2023-12-20 15:52:28
+ * @LastEditTime: 2024-07-09 16:34:51
  * @Message: 人员管理
 -->
 <template>
@@ -39,8 +39,7 @@
                 <template slot="extraBtns">
                     <a-button type="primary" @click="optClick(null, 'new')">新增</a-button>
                     <a-button type="danger" ghost @click="exitClick('0')">删除</a-button>
-                    <!-- <a-button type="primary">导入</a-button> -->
-                    <!-- <a-button type="primary">导出</a-button> -->
+                    <a-button type="primary" @click="showImport = true">导入</a-button>
                     <!-- <a-button type="primary" @click="exitClick('1')">重置密码</a-button> -->
                 </template>
                 <template #delete="{ row }">
@@ -62,6 +61,9 @@
             :postsData="postsData"
             :depsData="depsData"
         />
+
+        <!-- 导入组件 -->
+        <FileImport v-model="showImport" @uploadOk="uploadOk" title="人员导入" type="org_person" />
     </div>
 </template>
 
@@ -72,8 +74,9 @@ import treeFilterMixin from "@/mixin/tree-filter-mixin.js";
 import { getOrgDepTree, getOrgPostTree, deleteRogPerson, batchDeletePerson } from "@/api/index.js";
 import { mapGetters } from "vuex";
 import moment from "moment";
+import FileImport from "@/components/importExport/FileImport.vue";
 export default {
-    components: { CommonTable, PersonnelDetail },
+    components: { CommonTable, PersonnelDetail, FileImport },
     mixins: [treeFilterMixin],
     name: "sysManagerUser",
     data() {
@@ -149,6 +152,7 @@ export default {
             currentPerson: {}, // 当前点击的人员
             postsData: [], // 岗位数据
             depsData: [], // 部门数据
+            showImport: false, //导入弹窗
         };
     },
     created() {
@@ -178,7 +182,7 @@ export default {
                 switch (type) {
                     case "0":
                         this.$confirm({
-                            title: "确认对选中数据做退场处理？",
+                            title: "确认删除选中数据？",
                             onOk: () => {
                                 batchDeletePerson({ ids }).then(() => {
                                     this.$refs.xTable.refresh(false);
@@ -219,6 +223,9 @@ export default {
                 this.$refs.xTable.refresh();
             });
         },
+        uploadOk() {
+            this.$refs.xTable.refresh();
+        },
     },
     computed: {
         ...mapGetters("account", ["org"]),

src/pages/srm/components/SupplierDetail.vue

@@ -1,8 +1,8 @@
 <!--
  * @Author: PoJun
  * @Date: 2023-12-22 10:02:47
- * @LastEditors: XuanJi
- * @LastEditTime: 2024-05-08 17:58:58
+ * @LastEditors: PoJun
+ * @LastEditTime: 2024-07-09 16:14:15
  * @Message: 供应商详情
 -->
 <template>
@@ -200,19 +200,19 @@ export default {
             },
             rules: {
                 name: [{ required: true, message: "必填项不能为空", trigger: ["change", "blur"] }],
-                // person: [
-                //     {
-                //         required: true,
-                //         validator: (rule, value, callback) => {
-                //             if (value == null || value == "") {
-                //                 callback(new Error("必填项不能为空"));
-                //             } else {
-                //                 callback();
-                //             }
-                //         },
-                //         trigger: ["change", "blur"],
-                //     },
-                // ],
+                person: [
+                    {
+                        required: true,
+                        validator: (rule, value, callback) => {
+                            if (value == null || value == "") {
+                                callback(new Error("必填项不能为空"));
+                            } else {
+                                callback();
+                            }
+                        },
+                        trigger: ["change", "blur"],
+                    },
+                ],
                 phone: [{ required: true, message: "必填项不能为空", trigger: ["change", "blur"] }],
                 type: [{ required: true, message: "必填项不能为空", trigger: ["change", "blur"] }],
                 mark: [{ required: true, message: "必填项不能为空", trigger: ["change", "blur"] }],

src/pages/srm/supplier.vue

@@ -2,7 +2,7 @@
  * @Author: PoJun
  * @Date: 2023-12-22 10:01:43
  * @LastEditors: PoJun
- * @LastEditTime: 2024-01-17 17:33:23
+ * @LastEditTime: 2024-07-09 16:34:43
  * @Message: 供应商列表
 -->
 <template>
@@ -20,6 +20,7 @@
             <template slot="extraBtns">
                 <a-button type="primary" @click="optClick(null, 'new')">新增</a-button>
                 <a-button type="danger" ghost @click="deleteBatch">删除</a-button>
+                <a-button type="primary" @click="showImport = true">导入</a-button>
             </template>
 
             <template #delete="{ row }">
@@ -40,6 +41,9 @@
         />
 
         <WorkingRecords :detailId="detailId" v-if="showRecords" @close="closeDetail" @confirm="confirmDetail" />
+
+        <!-- 导入组件 -->
+        <FileImport v-model="showImport" @uploadOk="uploadOk" title="供应商导入" type="srm_supplier" />
     </div>
 </template>
 
@@ -48,9 +52,10 @@ import CommonTable from "@/components/table/CommonTable.vue";
 import SupplierDetail from "./components/SupplierDetail";
 import WorkingRecords from "./components/WorkingRecords";
 import { deleteSupplier, batchDeleteSuppliers } from "@/api/index.js";
+import FileImport from "@/components/importExport/FileImport.vue";
 
 export default {
-    components: { CommonTable, SupplierDetail, WorkingRecords },
+    components: { CommonTable, SupplierDetail, WorkingRecords, FileImport },
     name: "Supplier",
     data() {
         return {
@@ -136,6 +141,7 @@ export default {
                     ],
                 },
             ],
+            showImport: false,
         };
     },
     methods: {
@@ -182,8 +188,10 @@ export default {
         confirmDetail() {
             this.$refs.xTable.refresh();
         },
+        uploadOk() {
+            this.$refs.xTable.refresh();
+        },
     },
-    created() {},
 };
 </script>