From 74b08dc8f5cf11958d56430bca80caea5fb1cec6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=8F=E9=99=8C?= <xiaomo.drip@gmail.com>
Date: Thu, 17 Aug 2023 18:58:46 +0800
Subject: [PATCH] no message

---
 src/views/user/index/index.vue | 79 ++++++++++++++++++++++++++++------
 1 file changed, 66 insertions(+), 13 deletions(-)

diff --git a/src/views/user/index/index.vue b/src/views/user/index/index.vue
index e8639af..6a23147 100644
--- a/src/views/user/index/index.vue
+++ b/src/views/user/index/index.vue
@@ -34,18 +34,22 @@
 				</div>
 			</el-header>
 			<el-main class="nopadding">
-				<xTable ref="table" @selection-change="selectionChange" stripe remoteSort remoteFilter>
+				<xTable ref="table" @selection-change="selectionChange" :api="userlistApi" stripe remoteSort remoteFilter>
 					<el-table-column type="selection" width="50"></el-table-column>
 					<el-table-column label="UID" prop="uid" width="80" sortable='custom'></el-table-column>
-					<el-table-column label="头像" width="80" column-key="filterAvatar" :filters="[{text: '已上传', value: '1'}, {text: '未上传', value: '0'}]">
+					<el-table-column label="头像" width="200" column-key="filterAvatar" :filters="[{text: '已上传', value: '1'}, {text: '未上传', value: '0'}]">
 						<template #default="scope">
-							<el-avatar :src="scope.row.avatar" size="small"></el-avatar>
+							<div class="xavatar" @click="getUser(scope.row)">
+								<el-avatar :src="scope.row.avatar" size="small">空</el-avatar>
+								<label class="input-mask">
+									<input class="el-input__inner" type="text" readonly :value="scope.row.nickname || scope.row.username">
+								</label>
+							</div>
 						</template>
+
 					</el-table-column>
-					<el-table-column label="登录账号" prop="nickname" width="150" sortable='custom' column-key="filterUserName" :filters="[{text: '系统账号', value: '1'}, {text: '普通账号', value: '0'}]"></el-table-column>
-					<el-table-column label="姓名" prop="name" width="150" sortable='custom'></el-table-column>
 					<el-table-column label="所属角色" prop="groupName" width="200" sortable='custom'></el-table-column>
-					<el-table-column label="加入时间" prop="date" width="170" sortable='custom'></el-table-column>
+					<el-table-column label="加入时间" prop="date" width="170" sortable='regdate'></el-table-column>
 					<el-table-column label="操作" fixed="right" align="right" width="160">
 						<template #default="scope">
 							<el-button-group>
@@ -64,6 +68,11 @@
 		</el-container>
 	</el-container>
 	<save-dialog v-if="dialog.save" ref="saveDialog" @success="handleSuccess" @closed="dialog.save=false"></save-dialog>
+
+	<el-drawer :with-header="false" append-to-body="true" v-if="visible" v-model="visible" :size="1000" :show-close="false" style="overflow: initial;" destroy-on-close @closed="visible=false;$emit('closed')">
+	    <el-button type="danger" @click="visible=false" class="userdrawerclose" icon="el-icon-close"> </el-button>
+		<x-user v-model="copiedData"></x-user>
+	</el-drawer>
 </template>
 
 <script>
@@ -82,8 +91,11 @@
 					save: false
 				},
 				showGrouploading: false,
+				visible: false,
 				groupFilterText: '',
+				userlistApi: 'user/index/lists',
 				group: [],
+				copiedData: {},
 				selection: [],
 				leftSides: [
 				  {
@@ -197,6 +209,10 @@
 			this.getGroup()
 		},
 		methods: {
+			getUser(o){
+				this.visible = true
+				this.copiedData = o;
+			},
 			//添加
 			add(){
 				this.dialog.save = true
@@ -256,13 +272,8 @@
 			//加载树数据
 			async getGroup(){
 				this.showGrouploading = true;
-				// var res = await this.$api.system.dept.list.get();
-				var res = {
-					data:[]
-				};
+				var res = await this.$http.get('user/index/typeList');
 				this.showGrouploading = false;
-				var allNode ={id: '', label: '所有'}
-				res.data.unshift(allNode);
 				this.group = res.data;
 			},
 			//树过滤
@@ -296,5 +307,47 @@
 	}
 </script>
 
-<style>
+<style scoped>
+	
+	.xavatar{
+		display: flex;align-items: center;cursor: pointer; 
+	}
+
+	.userdrawerclose {
+		cursor: pointer;
+	    width: 25px;
+	    height: 25px;
+	    border-radius: 50%;
+	    font-size: 12px;
+	    left: -10px;
+	    top: 120px;
+	    background-color: #9facc3;
+	    background-repeat: no-repeat;
+	    background-position: 50%;
+	    display: flex;
+	    align-items: center;
+	    justify-content: center;
+	    position: absolute;
+	    border-color: #fff;
+		padding: 6px; 
+		font-weight: bolder;
+	} 
+
+	.xavatar .input-mask {
+	  	margin-left: 28px;
+	    z-indexz: 1;
+	    position: absolute;
+	}
+
+	.xavatar .input-mask::before {
+	  content: "";
+	  position: absolute;
+	  top: 0;
+	  right: 0;
+	  bottom: 0;
+	  left: 0;
+	  pointer-events: auto;
+	  cursor: pointer;
+	}
 </style>
+