From 4f0832ce6cd4c0d35ebe041e4ba31576230413f4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=8F=E9=99=8C?= <xiaomo.drip@gmail.com>
Date: Sun, 29 Oct 2023 14:40:25 +0800
Subject: [PATCH] ...

---
 src/views/user/index/index.vue | 551 +++++++++++++++++----------------
 1 file changed, 276 insertions(+), 275 deletions(-)

diff --git a/src/views/user/index/index.vue b/src/views/user/index/index.vue
index 030b0ba..7b8a44e 100644
--- a/src/views/user/index/index.vue
+++ b/src/views/user/index/index.vue
@@ -6,15 +6,9 @@
 					<el-input placeholder="输入关键字进行过滤" v-model="groupFilterText" clearable></el-input>
 				</el-header>
 				<el-main class="nopadding">
-					 <x-menu-item
-			            v-for="(item, index) in leftSides"
-			            :key="index"
-			            :label="item.name"
-			            :num="item.num"
-			            :icon-class="item.iconClass"
-			            :icon-color="item.color"
-			            :select="leftType==item.infoType"
-			            @click="sideClick(item)"/>
+					<x-menu-item v-for="(item, index) in leftSides" :key="index" :label="item.name" :num="item.num"
+						:icon-class="item.iconClass" :icon-color="item.color" :select="leftType == item.infoType"
+						@click="sideClick(item)" />
 				</el-main>
 			</el-container>
 		</el-aside>
@@ -22,9 +16,10 @@
 			<el-header>
 				<div class="left-panel">
 					<el-button type="primary" icon="el-icon-plus" @click="add"></el-button>
-					<el-button type="danger" plain icon="el-icon-delete" :disabled="selection.length==0" @click="batch_del"></el-button>
-					<el-button type="primary" plain :disabled="selection.length==0">分配角色</el-button>
-					<el-button type="primary" plain :disabled="selection.length==0">密码重置</el-button>
+					<el-button type="danger" plain icon="el-icon-delete" :disabled="selection.length == 0"
+						@click="batch_del"></el-button>
+					<el-button type="primary" plain :disabled="selection.length == 0">分配角色</el-button>
+					<el-button type="primary" plain :disabled="selection.length == 0">密码重置</el-button>
 				</div>
 				<div class="right-panel">
 					<div class="right-panel-search">
@@ -37,12 +32,14 @@
 				<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="200" 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">
 							<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">
+									<input class="el-input__inner" type="text" readonly
+										:value="scope.row.nickname || scope.row.username">
 								</label>
 							</div>
 						</template>
@@ -53,8 +50,10 @@
 					<el-table-column label="操作" fixed="right" align="right" width="160">
 						<template #default="scope">
 							<el-button-group>
-								<el-button text type="primary" size="small" @click="table_show(scope.row, scope.$index)">查看</el-button>
-								<el-button text type="primary" size="small" @click="table_edit(scope.row, scope.$index)">编辑</el-button>
+								<el-button text type="primary" size="small"
+									@click="table_show(scope.row, scope.$index)">查看</el-button>
+								<el-button text type="primary" size="small"
+									@click="table_edit(scope.row, scope.$index)">编辑</el-button>
 								<el-popconfirm title="确定删除吗？" @confirm="table_del(scope.row, scope.$index)">
 									<template #reference>
 										<el-button text type="primary" size="small">删除</el-button>
@@ -67,287 +66,289 @@
 			</el-main>
 		</el-container>
 	</el-container>
-	<save-dialog v-if="dialog.save" ref="saveDialog" @success="handleSuccess" @closed="dialog.save=false"></save-dialog>
+	<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>
+	<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>
-	import saveDialog from './save'
-	import xMenuItem from '@/components/xMenu/item'
+import saveDialog from './save'
+import xMenuItem from '@/components/xMenu/item'
 
-	export default {
-		name: 'user',
-		components: {
-			xMenuItem,
-			saveDialog
-		},
-		data() {
-			return {
-				dialog: {
-					save: false
+export default {
+	name: 'user',
+	components: {
+		xMenuItem,
+		saveDialog
+	},
+	data() {
+		return {
+			dialog: {
+				save: false
+			},
+			showGrouploading: false,
+			visible: false,
+			groupFilterText: '',
+			userlistApi: 'user/index/lists',
+			group: [],
+			copiedData: {},
+			selection: [],
+			leftSides: [
+				{
+					name: '今日需联系线索',
+					color: '#2362FB',
+					iconClass: 'wk wk-leads',
+					infoType: 'todayLeads',
+					num: 10,
+					hidden: false
 				},
-				showGrouploading: false,
-				visible: false,
-				groupFilterText: '',
-				userlistApi: 'user/index/lists',
-				group: [],
-				copiedData: {},
-				selection: [],
-				leftSides: [
-				  {
-				    name: '今日需联系线索',
-				    color: '#2362FB',
-				    iconClass: 'wk wk-leads',
-				    infoType: 'todayLeads',
-				    num: 10,
-				    hidden: false
-				  },
-				  {
-				    name: '今日需联系客户',
-				    color: '#2362FB',
-				    iconClass: 'wk wk-customer',
-				    infoType: 'todayCustomer',
-				    num: 0,
-				    hidden: false
-				  },
-				  {
-				    name: '今日需联系商机',
-				    color: '#2362FB',
-				    iconClass: 'wk wk-business',
-				    infoType: 'todayBusiness',
-				    num: 0,
-				    hidden: false
-				  },
-				  {
-				    name: '分配给我的线索',
-				    color: '#704AFD',
-				    iconClass: 'wk wk-leads',
-				    infoType: 'followLeads',
-				    num: 0,
-				    hidden: false
-				  },
-				  {
-				    name: '分配给我的客户',
-				    color: '#19B5F6',
-				    iconClass: 'wk wk-s-seas',
-				    infoType: 'followCustomer',
-				    num: 0,
-				    hidden: false
-				  },
-				  {
-				    name: '待进入公海的客户',
-				    color: '#26D4DA',
-				    iconClass: 'wk wk-seas',
-				    infoType: 'putInPoolRemind',
-				    num: 0,
-				    hidden: false
-				  },
-				  {
-				    name: '待审核合同',
-				    color: '#FD5B4A',
-				    iconClass: 'wk wk-contract',
-				    infoType: 'checkContract',
-				    num: 0,
-				    hidden: false
-				  },
-				  {
-				    name: '待审核回款',
-				    color: '#FFB940',
-				    iconClass: 'wk wk-receivables',
-				    infoType: 'checkReceivables',
-				    num: 0,
-				    hidden: false
-				  },
-				  {
-				    name: '待回款提醒',
-				    color: '#27BA4A',
-				    iconClass: 'wk wk-bell',
-				    infoType: 'remindReceivablesPlan',
-				    num: 0,
-				    hidden: false
-				  },
-				  {
-				    name: '即将到期的合同',
-				    color: '#FF7A38',
-				    iconClass: 'wk wk-contract',
-				    infoType: 'endContract',
-				    num: 0,
-				    hidden: false
-				  },
-				  {
-				    name: '待回访合同',
-				    color: '#ff9232',
-				    iconClass: 'wk wk-house',
-				    infoType: 'returnVisitRemind',
-				    num: 0,
-				    hidden: false
-				  },
-				  {
-				    name: '待审核发票',
-				    color: '#ff9232',
-				    iconClass: 'wk wk-invoice',
-				    infoType: 'checkInvoice',
-				    num: 0,
-				    hidden: false
-				  }
-				],
-				search: {
-					name: null
+				{
+					name: '今日需联系客户',
+					color: '#2362FB',
+					iconClass: 'wk wk-customer',
+					infoType: 'todayCustomer',
+					num: 0,
+					hidden: false
+				},
+				{
+					name: '今日需联系商机',
+					color: '#2362FB',
+					iconClass: 'wk wk-business',
+					infoType: 'todayBusiness',
+					num: 0,
+					hidden: false
+				},
+				{
+					name: '分配给我的线索',
+					color: '#704AFD',
+					iconClass: 'wk wk-leads',
+					infoType: 'followLeads',
+					num: 0,
+					hidden: false
+				},
+				{
+					name: '分配给我的客户',
+					color: '#19B5F6',
+					iconClass: 'wk wk-s-seas',
+					infoType: 'followCustomer',
+					num: 0,
+					hidden: false
+				},
+				{
+					name: '待进入公海的客户',
+					color: '#26D4DA',
+					iconClass: 'wk wk-seas',
+					infoType: 'putInPoolRemind',
+					num: 0,
+					hidden: false
+				},
+				{
+					name: '待审核合同',
+					color: '#FD5B4A',
+					iconClass: 'wk wk-contract',
+					infoType: 'checkContract',
+					num: 0,
+					hidden: false
+				},
+				{
+					name: '待审核回款',
+					color: '#FFB940',
+					iconClass: 'wk wk-receivables',
+					infoType: 'checkReceivables',
+					num: 0,
+					hidden: false
+				},
+				{
+					name: '待回款提醒',
+					color: '#27BA4A',
+					iconClass: 'wk wk-bell',
+					infoType: 'remindReceivablesPlan',
+					num: 0,
+					hidden: false
+				},
+				{
+					name: '即将到期的合同',
+					color: '#FF7A38',
+					iconClass: 'wk wk-contract',
+					infoType: 'endContract',
+					num: 0,
+					hidden: false
+				},
+				{
+					name: '待回访合同',
+					color: '#ff9232',
+					iconClass: 'wk wk-house',
+					infoType: 'returnVisitRemind',
+					num: 0,
+					hidden: false
+				},
+				{
+					name: '待审核发票',
+					color: '#ff9232',
+					iconClass: 'wk wk-invoice',
+					infoType: 'checkInvoice',
+					num: 0,
+					hidden: false
 				}
+			],
+			search: {
+				name: null
+			}
+		}
+	},
+	watch: {
+		groupFilterText(val) {
+			this.$refs.group.filter(val);
+		}
+	},
+	mounted() {
+		this.getGroup()
+	},
+	methods: {
+		getUser(o) {
+			this.visible = true
+			this.copiedData = o;
+		},
+		//添加
+		add() {
+			this.dialog.save = true
+			this.$nextTick(() => {
+				this.$refs.saveDialog.open()
+			})
+		},
+		//编辑
+		table_edit(row) {
+			this.dialog.save = true
+			this.$nextTick(() => {
+				this.$refs.saveDialog.open('edit').setData(row)
+			})
+		},
+		//查看
+		table_show(row) {
+			this.dialog.save = true
+			this.$nextTick(() => {
+				this.$refs.saveDialog.open('show').setData(row)
+			})
+		},
+		//删除
+		async table_del(row, index) {
+			var reqData = { id: row.id }
+			var res = await this.$api.demo.post.post(reqData);
+			if (res.code == 200) {
+				//这里选择刷新整个表格 OR 插入/编辑现有表格数据
+				this.$refs.table.tableData.splice(index, 1);
+				this.$message.success("删除成功")
+			} else {
+				this.$alert(res.message, "提示", { type: 'error' })
 			}
 		},
-		watch: {
-			groupFilterText(val) {
-				this.$refs.group.filter(val);
-			}
-		},
-		mounted() {
-			this.getGroup()
-		},
-		methods: {
-			getUser(o){
-				this.visible = true
-				this.copiedData = o;
-			},
-			//添加
-			add(){
-				this.dialog.save = true
-				this.$nextTick(() => {
-					this.$refs.saveDialog.open()
-				})
-			},
-			//编辑
-			table_edit(row){
-				this.dialog.save = true
-				this.$nextTick(() => {
-					this.$refs.saveDialog.open('edit').setData(row)
-				})
-			},
-			//查看
-			table_show(row){
-				this.dialog.save = true
-				this.$nextTick(() => {
-					this.$refs.saveDialog.open('show').setData(row)
-				})
-			},
-			//删除
-			async table_del(row, index){
-				var reqData = {id: row.id}
-				var res = await this.$api.demo.post.post(reqData);
-				if(res.code == 200){
-					//这里选择刷新整个表格 OR 插入/编辑现有表格数据
-					this.$refs.table.tableData.splice(index, 1);
-					this.$message.success("删除成功")
-				}else{
-					this.$alert(res.message, "提示", {type: 'error'})
-				}
-			},
-			//批量删除
-			async batch_del(){
-				this.$confirm(`确定删除选中的 ${this.selection.length} 项吗？`, '提示', {
-					type: 'warning'
-				}).then(() => {
-					const loading = this.$loading();
-					this.selection.forEach(item => {
-						this.$refs.table.tableData.forEach((itemI, indexI) => {
-							if (item.id === itemI.id) {
-								this.$refs.table.tableData.splice(indexI, 1)
-							}
-						})
+		//批量删除
+		async batch_del() {
+			this.$confirm(`确定删除选中的 ${this.selection.length} 项吗？`, '提示', {
+				type: 'warning'
+			}).then(() => {
+				const loading = this.$loading();
+				this.selection.forEach(item => {
+					this.$refs.table.tableData.forEach((itemI, indexI) => {
+						if (item.id === itemI.id) {
+							this.$refs.table.tableData.splice(indexI, 1)
+						}
 					})
-					loading.close();
-					this.$message.success("操作成功")
-				}).catch(() => {
+				})
+				loading.close();
+				this.$message.success("操作成功")
+			}).catch(() => {
 
+			})
+		},
+		//表格选择后回调事件
+		selectionChange(selection) {
+			this.selection = selection;
+		},
+		//加载树数据
+		async getGroup() {
+			this.showGrouploading = true;
+			var res = await this.$http.get('user/index/typeList');
+			this.showGrouploading = false;
+			this.group = res.data;
+		},
+		//树过滤
+		groupFilterNode(value, data) {
+			if (!value) return true;
+			return data.label.indexOf(value) !== -1;
+		},
+		//树点击事件
+		groupClick(data) {
+			var params = {
+				groupId: data.id
+			}
+			this.$refs.table.reload(params)
+		},
+		//搜索
+		upsearch() {
+			this.$refs.table.upData(this.search)
+		},
+		//本地更新数据
+		handleSuccess(data, mode) {
+			if (mode == 'add') {
+				data.id = new Date().getTime()
+				this.$refs.table.tableData.unshift(data)
+			} else if (mode == 'edit') {
+				this.$refs.table.tableData.filter(item => item.id === data.id).forEach(item => {
+					Object.assign(item, data)
 				})
-			},
-			//表格选择后回调事件
-			selectionChange(selection){
-				this.selection = selection;
-			},
-			//加载树数据
-			async getGroup(){
-				this.showGrouploading = true;
-				var res = await this.$http.get('user/index/typeList');
-				this.showGrouploading = false;
-				this.group = res.data;
-			},
-			//树过滤
-			groupFilterNode(value, data){
-				if (!value) return true;
-				return data.label.indexOf(value) !== -1;
-			},
-			//树点击事件
-			groupClick(data){
-				var params = {
-					groupId: data.id
-				}
-				this.$refs.table.reload(params)
-			},
-			//搜索
-			upsearch(){
-				this.$refs.table.upData(this.search)
-			},
-			//本地更新数据
-			handleSuccess(data, mode){
-				if(mode=='add'){
-					data.id = new Date().getTime()
-					this.$refs.table.tableData.unshift(data)
-				}else if(mode=='edit'){
-					this.$refs.table.tableData.filter(item => item.id===data.id ).forEach(item => {
-						Object.assign(item, data)
-					})
-				}
 			}
 		}
 	}
+}
 </script>
 
 <style scoped>
-	
-	.xavatar{
-		display: flex;align-items: center;cursor: pointer; 
-	}
+.xavatar {
+	display: flex;
+	align-items: center;
+	cursor: pointer;
+}
 
-	.userdrawerclose {
-		cursor: pointer;
-	    width: 25px;
-	    height: 25px;
-	    border-radius: 50%;
-	    font-size: 12px;
-	    left: -10px;
-	    top: 100px;
-	    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;
-	} 
+.userdrawerclose {
+	cursor: pointer;
+	width: 25px;
+	height: 25px;
+	border-radius: 50%;
+	font-size: 12px;
+	left: -10px;
+	top: 100px;
+	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 {
+	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;
-	}
+.xavatar .input-mask::before {
+	content: "";
+	position: absolute;
+	top: 0;
+	right: 0;
+	bottom: 0;
+	left: 0;
+	pointer-events: auto;
+	cursor: pointer;
+}
 </style>