From 2cf549171f79cb1ac7f7d26cbf22b872ff0b89bf Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=AE=B8=E5=AE=8F=E6=9D=B0?= <1943105267@qq.com>
Date: Sun, 23 Feb 2025 10:58:00 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8D=95=E4=BD=8D=E7=AE=A1=E7=90=86table?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/auditPages/unit.vue | 369 ++++++++++++++++++++++++++++++++++
 1 file changed, 369 insertions(+)
 create mode 100644 src/views/auditPages/unit.vue

diff --git a/src/views/auditPages/unit.vue b/src/views/auditPages/unit.vue
new file mode 100644
index 0000000..992cbe4
--- /dev/null
+++ b/src/views/auditPages/unit.vue
@@ -0,0 +1,369 @@
+<template>
+  <main-app :showTree="true" listTitle="单位列表">
+    <template v-slot:tree>
+      <el-tree
+        :data="deptOptions"
+        :props="defaultProps"
+        :expand-on-click-node="false"
+        :filter-node-method="filterNode"
+        ref="tree"
+        node-key="id"
+        default-expand-all
+        highlight-current
+        @node-click="handleNodeClick"
+      />
+    </template>
+    <template v-slot:tablec>
+      <el-button type="info" plain icon="el-icon-upload2" size="mini"
+        >导入</el-button
+      >
+
+      <el-button type="warning" plain icon="el-icon-download" size="mini"
+        >导出</el-button
+      >
+
+      <el-button type="primary" plain icon="el-icon-plus" size="mini"
+        >新增单位</el-button
+      >
+    </template>
+    <template v-slot:search>
+      <el-form
+        :model="queryParams"
+        ref="queryForm"
+        size="small"
+        :inline="true"
+        label-width="88px"
+      >
+        <el-form-item label="单位名称：" prop="nickName">
+          <el-input
+            v-model="queryParams.nickName"
+            placeholder="请输入单位名称"
+            clearable
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item label="单位类型：" prop="dwlx">
+          <el-select
+            v-model="queryParams.dwlx"
+            placeholder="请选择单位类型"
+            clearable
+          >
+            <el-option
+              v-for="dict in dict.type.dwlx"
+              :key="dict.value"
+              :label="dict.label"
+              :value="dict.value"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="信用代码：" prop="userName">
+          <el-input
+            v-model="queryParams.userName"
+            placeholder="请输入统一社会信用代码"
+            clearable
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item>
+          <el-button
+            type="primary"
+            icon="el-icon-search"
+            size="mini"
+            @click="handleQuery"
+            >搜索</el-button
+          >
+          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
+            >重置</el-button
+          >
+        </el-form-item>
+      </el-form>
+    </template>
+    <template v-slot:table>
+      <el-table
+        v-loading="loading"
+        :data="userList"
+        :height="tabHeader"
+        :row-class-name="tableRowClassName"
+      >
+        <el-table-column type="index" width="50" label="序号" align="center" />
+        <el-table-column
+          label="单位名称"
+          align="center"
+          prop="nickName"
+          show-overflow-tooltip
+        >
+          <template slot-scope="scope">{{ scope.row.nickName }}</template>
+        </el-table-column>
+        <el-table-column
+          label="单位类型"
+          width="100"
+          align="center"
+          prop="dwlx"
+          show-overflow-tooltip
+        >
+          <template slot-scope="scope">
+            <dict-tag :options="dict.type.dwlx" :value="scope.row.dwlx" />
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="统一社会信用代码"
+          align="center"
+          prop="userName"
+          show-overflow-tooltip
+        >
+          <template slot-scope="scope">{{ scope.row.userName }}</template>
+        </el-table-column>
+
+        <el-table-column
+          label="所属行业"
+          width="80"
+          align="center"
+          prop="sshy"
+          show-overflow-tooltip
+        >
+          <template slot-scope="scope">
+            <dict-tag :options="dict.type.sshy" :value="scope.row.sshy" />
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="单位地址"
+          align="center"
+          prop="dwxxdz"
+          show-overflow-tooltip
+        >
+          <template slot-scope="scope">{{ scope.row.dwxxdz }}</template>
+        </el-table-column>
+        <el-table-column
+          label="操作"
+          prop="userId"
+          class-name="table-operation"
+          align="center"
+          width="400"
+        >
+          <template slot-scope="scope">
+            <el-button type="primary" size="mini" plain icon="el-icon-view"
+              >查看</el-button
+            >
+            <el-button
+              type="warning"
+              size="mini"
+              plain
+              icon="el-icon-edit-outline"
+              >修改</el-button
+            >
+            <el-button
+              type="warning"
+              size="mini"
+              plain
+              icon="el-icon-refresh-left"
+              >重置密码</el-button
+            >
+            <el-button type="danger" size="mini" plain icon="el-icon-delete"
+              >删除</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination
+        prev-text="上页"
+        next-text="下页"
+        v-show="total > 0"
+        :total="total"
+        :page-sizes="[10, 20, 40, 80, 100]"
+        :page.sync="queryParams.current"
+        :limit.sync="queryParams.size"
+        @pagination="getList"
+      />
+    </template>
+  </main-app>
+</template>
+
+<script>
+import { deptTreeSelect } from "@/api/system/user";
+import { listUnit, delUnit, editPassword } from "@/api/auditPagesApi/index";
+import { getToken } from "@/utils/auth";
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+
+import { MessageBox } from "element-ui";
+export default {
+  name: "User",
+  dicts: ["dwlx", "sshy"],
+  components: { Treeselect },
+  data() {
+    return {
+      roles: this.$store.state.user.roles,
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 用户表格数据
+      userList: null,
+      // 弹出层标题
+      title: "",
+      // 部门树选项
+      deptOptions: undefined,
+      // 是否显示弹出层
+      open: false,
+      // 部门名称
+      deptName: undefined,
+      // 默认密码
+      initPassword: undefined,
+      // 岗位选项
+      postOptions: [],
+      // 角色选项
+      roleOptions: [],
+      // 表单参数
+      form: {},
+      defaultProps: {
+        children: "children",
+        label: "label",
+      },
+      // 用户导入参数
+      upload: {
+        // 是否显示弹出层（用户导入）
+        open: false,
+        // 弹出层标题（用户导入）
+        title: "",
+        // 是否禁用上传
+        isUploading: false,
+        // 是否更新已经存在的用户数据
+        updateSupport: 0,
+        // 设置上传的请求头部
+        headers: { Authorization: "Bearer " + getToken() },
+        // 上传的地址
+        url: process.env.VUE_APP_BASE_API + "/tc/unit/importData",
+      },
+      // 查询参数
+      queryParams: {
+        current: 1,
+        size: 20,
+        userName: undefined,
+        nickName: undefined,
+        dwlx: undefined,
+      },
+      // 表单校验
+      rules: {
+        userName: [
+          { required: true, message: "用户名称不能为空", trigger: "blur" },
+          {
+            min: 2,
+            max: 20,
+            message: "用户名称长度必须介于 2 和 20 之间",
+            trigger: "blur",
+          },
+        ],
+        nickName: [
+          { required: true, message: "用户昵称不能为空", trigger: "blur" },
+        ],
+        password: [
+          { required: true, message: "用户密码不能为空", trigger: "blur" },
+          {
+            min: 5,
+            max: 20,
+            message: "用户密码长度必须介于 5 和 20 之间",
+            trigger: "blur",
+          },
+          {
+            pattern: /^[^<>"'|\\]+$/,
+            message: "不能包含非法字符：< > \" ' \\\ |",
+            trigger: "blur",
+          },
+        ],
+        email: [
+          {
+            type: "email",
+            message: "请输入正确的邮箱地址",
+            trigger: ["blur", "change"],
+          },
+        ],
+        phonenumber: [
+          {
+            pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
+            message: "请输入正确的手机号码",
+            trigger: "blur",
+          },
+        ],
+      },
+      tabHeader: 585,
+    };
+  },
+  created() {
+    this.getList();
+    this.getDeptTree();
+  },
+  methods: {
+    // 修改table背景色
+    tableRowClassName({ row, rowIndex }) {
+      if (rowIndex % 2 !== 0) {
+        return "evenNumber-row";
+      }
+      return "";
+    },
+
+    /** 查询部门下拉树结构 */
+    getDeptTree() {
+      deptTreeSelect().then((response) => {
+        this.deptOptions = response.data;
+      });
+    },
+
+    /**
+     * 重置
+     */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.queryParams.deptId = undefined;
+      this.$refs.tree.setCurrentKey(null);
+      this.handleQuery();
+    },
+    // 筛选节点
+    filterNode(value, data) {
+      if (!value) return true;
+      return data.label.indexOf(value) !== -1;
+    },
+    // 节点单击事件
+    handleNodeClick(data) {
+      this.queryParams.deptId = data.id;
+      this.handleQuery();
+    },
+    /**
+     * 搜索
+     */
+    handleQuery() {
+      this.queryParams.current = 1;
+
+      this.getList();
+    },
+    /**
+     * 获取列表
+     */
+    getList() {
+      this.loading = true;
+      listUnit(this.queryParams).then((response) => {
+        this.userList = response.data.records;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+::v-deep .el-form-item__content {
+  width: 280px;
+  .el-select,
+  .el-date-editor {
+    width: 100%;
+  }
+}
+</style>