From 1bfba74b6bea7da6d14b0da1ab8b1efe02e474b3 Mon Sep 17 00:00:00 2001
From: fuliqi <fuliqi@qq.com>
Date: 星期五, 03 一月 2025 13:38:21 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'
---
src/components/flow/User/SingleUser.vue | 287 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 287 insertions(+), 0 deletions(-)
diff --git a/src/components/flow/User/SingleUser.vue b/src/components/flow/User/SingleUser.vue
new file mode 100644
index 0000000..e8cf64d
--- /dev/null
+++ b/src/components/flow/User/SingleUser.vue
@@ -0,0 +1,287 @@
+<template>
+ <div>
+ <el-dialog
+ :title="`閫夋嫨杞姙鎺ユ敹浜哄憳`"
+ :visible.sync="show"
+ width="65%"
+ :destroy-on-close="true"
+ :close-on-click-modal="false"
+ :modal="false"
+ :before-close="close">
+ <el-row :gutter="20">
+ <!--閮ㄩ棬鏁版嵁-->
+ <el-col :span="6" :xs="24">
+ <div class="head-container">
+ <el-input
+ v-model="deptName"
+ placeholder="璇疯緭鍏ラ儴闂ㄥ悕绉�"
+ clearable
+ size="small"
+ prefix-icon="el-icon-search"
+ style="margin-bottom: 20px"
+ />
+ </div>
+ <div class="head-container">
+ <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"
+ />
+ </div>
+ </el-col>
+ <!--鐢ㄦ埛鏁版嵁-->
+ <el-col :span="18" :xs="24">
+ <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+ <el-form-item label="鐢ㄦ埛鍚嶇О" prop="userName">
+ <el-input
+ v-model="queryParams.userName"
+ placeholder="璇疯緭鍏ョ敤鎴峰悕绉�"
+ clearable
+ style="width: 150px"
+ @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>
+ <el-table ref="dataTable" v-loading="loading" :row-key="getRowKey" :data="userList" @selection-change="handleUserSelect">
+ <el-table-column type="selection" />
+ <el-table-column label="鐢ㄦ埛缂栧彿" align="center" key="userId" prop="userId" v-if="columns[0].visible" />
+ <el-table-column label="鐧诲綍璐﹀彿" align="center" key="userName" prop="userName" v-if="columns[1].visible" :show-overflow-tooltip="true" />
+ <el-table-column label="鐢ㄦ埛濮撳悕" align="center" key="nickName" prop="nickName" v-if="columns[2].visible" :show-overflow-tooltip="true" />
+ <el-table-column label="閮ㄩ棬" align="center" key="deptName" prop="dept.deptName" v-if="columns[3].visible" :show-overflow-tooltip="true" />
+ <el-table-column label="鎵嬫満鍙风爜" align="center" key="phonenumber" prop="phonenumber" v-if="columns[4].visible" width="120" />
+ </el-table>
+ <pagination
+ v-show="total>0"
+ :total="total"
+ :page-sizes="[5,10]"
+ layout="prev, pager, next"
+ :page.sync="queryParams.pageNum"
+ :limit.sync="queryParams.pageSize"
+ @pagination="getList"
+ />
+ </el-col>
+ </el-row>
+ <span slot="footer" class="dialog-footer">
+ <el-button type="danger" @click="getSelected">纭</el-button>
+ </span>
+ </el-dialog>
+ </div>
+</template>
+
+<script>
+import { listUser, deptTreeSelect } from "@/api/system/user";
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+import {StrUtil} from '@/utils/StrUtil'
+
+export default {
+ name: "SingleUser",
+ dicts: ['sys_normal_disable', 'sys_user_sex'],
+ components: { Treeselect },
+ // 鎺ュ彈鐖剁粍浠剁殑鍊�
+ props: {
+ show: {
+ required: true,
+ type: Boolean
+ },
+ // 鍥炴樉鏁版嵁浼犲��
+ selectUser: {
+ default: null,
+ required: false
+ },
+
+ },
+ data() {
+ return {
+ innerSelected: null,
+ // 閬僵灞�
+ loading: true,
+ // 閫変腑鏁扮粍
+ ids: [],
+ // 鏄剧ず鎼滅储鏉′欢
+ showSearch: true,
+ // 鎬绘潯鏁�
+ total: 0,
+ // 鐢ㄦ埛琛ㄦ牸鏁版嵁
+ userList: [],
+ // 寮瑰嚭灞傛爣棰�
+ title: "",
+ // 閮ㄩ棬鏍戦�夐」
+ deptOptions: undefined,
+ // 鏄惁鏄剧ず寮瑰嚭灞�
+ open: false,
+ // 閮ㄩ棬鍚嶇О
+ deptName: undefined,
+ // 琛ㄥ崟鍙傛暟
+ form: {},
+ defaultProps: {
+ children: "children",
+ label: "label"
+ },
+ // 鏌ヨ鍙傛暟
+ queryParams: {
+ pageNum: 1,
+ pageSize: 5,
+ userName: undefined,
+ phonenumber: undefined,
+ status: undefined,
+ deptId: undefined
+ },
+ // 鍒椾俊鎭�
+ columns: [
+ { key: 0, label: `鐢ㄦ埛缂栧彿`, visible: true },
+ { key: 1, label: `鐢ㄦ埛鍚嶇О`, visible: true },
+ { key: 2, label: `鐢ㄦ埛鏄电О`, visible: true },
+ { key: 3, label: `閮ㄩ棬`, visible: true },
+ { key: 4, label: `鎵嬫満鍙风爜`, visible: true },
+ { key: 5, label: `鐘舵�乣, visible: true },
+ { key: 6, label: `鍒涘缓鏃堕棿`, visible: true }
+ ],
+ radioSelected: 0, // 鍗曢�夋浼犲��
+ selectUserList: [] // 鍥炴樉鏁版嵁浼犲��
+ };
+ },
+ watch: {
+ // 鏍规嵁鍚嶇О绛涢�夐儴闂ㄦ爲
+ deptName(val) {
+ this.$refs.tree.filter(val);
+ },
+ selectUser: {
+ deep: true,
+ handler(newVal) {
+ if (newVal) {
+ this.$nextTick(() => {
+ this.$refs.dataTable.clearSelection();
+ this.userList.forEach(item => {
+ if (newVal === item.userId) {
+ this.innerSelected = item
+ this.$refs.dataTable.toggleRowSelection(item)
+ }
+ })
+ });
+ } else {
+ this.innerSelected = null;
+ }
+ },
+ },
+ userLst: {
+ deep: true,
+ handler(newVal) {
+ if (newVal) {
+ this.$nextTick(() => {
+ this.$refs.dataTable.clearSelection();
+ if (! this.innerSelected) {
+ newVal.forEach(item => {
+ if (this.innerSelected.userId === item.userId) {
+ this.innerSelected = item
+ this.$refs.dataTable.toggleRowSelection(item)
+ }
+ })
+ }
+ });
+ } else {
+ this.innerSelected = null;
+ }
+ },
+ },
+ },
+ mounted() {
+ this.getList();
+ this.getDeptTree();
+ },
+ methods: {
+ setChecked(val) {
+ if (val) {
+ this.$nextTick(() => {
+ this.$refs.dataTable.clearSelection();
+ this.userList.forEach(item => {
+ if (val.userId === item.userId) {
+ this.innerSelected = item
+ this.$refs.dataTable.toggleRowSelection(item)
+ }
+ })
+ });
+ } else {
+ this.innerSelected = null
+ }
+ },
+ /** 鏌ヨ鐢ㄦ埛鍒楄〃 */
+ getList() {
+ this.loading = true;
+ listUser(this.queryParams).then(response => {
+ this.userList = response.rows;
+ this.total = response.total;
+ this.loading = false;
+ }
+ );
+ },
+ /** 鏌ヨ閮ㄩ棬涓嬫媺鏍戠粨鏋� */
+ getDeptTree() {
+ deptTreeSelect().then(response => {
+ this.deptOptions = response.data;
+ });
+ },
+ // 淇濆瓨閫変腑鐨勬暟鎹甶d,row-key灏辨槸瑕佹寚瀹氫竴涓猭ey鏍囪瘑杩欎竴琛岀殑鏁版嵁
+ getRowKey (row) {
+ return row.id
+ },
+ // 绛涢�夎妭鐐�
+ filterNode(value, data) {
+ if (!value) return true;
+ return data.label.indexOf(value) !== -1;
+ },
+ // 鑺傜偣鍗曞嚮浜嬩欢
+ handleNodeClick(data) {
+ this.queryParams.deptId = data.id;
+ this.handleQuery();
+ },
+ // 浼犻�掗�変腑鍊�
+ handleUserSelect(selectionList) {
+ if (selectionList && selectionList.length > 1) {
+ this.$refs.dataTable.clearSelection();
+ this.$refs.dataTable.toggleRowSelection(selectionList[selectionList.length - 1]);
+ }
+ if (selectionList && selectionList.length > 0) {
+ this.innerSelected = selectionList[selectionList.length - 1]
+ console.log(this.innerSelected)
+ } else {
+ this.innerSelected = null
+ }
+ },
+ getSelected() {
+ this.$emit('submit', this.innerSelected);
+ },
+ /** 鎼滅储鎸夐挳鎿嶄綔 */
+ handleQuery() {
+ this.queryParams.pageNum = 1;
+ this.getList();
+ },
+ /** 閲嶇疆鎸夐挳鎿嶄綔 */
+ resetQuery() {
+ this.dateRange = [];
+ this.resetForm("queryForm");
+ this.queryParams.deptId = undefined;
+ this.$refs.tree.setCurrentKey(null);
+ this.handleQuery();
+ },
+ close() {
+ this.$emit("close")
+ },
+ }
+};
+</script>
+<style scoped>
+/deep/ .el-table__header-wrapper .el-checkbox{
+ display:none
+}
+</style>
--
Gitblit v1.8.0