From 0d32ef0479cb7d7d0f24b4e866994d43dfaf82e6 Mon Sep 17 00:00:00 2001
From: 马宇豪 <978517621@qq.com>
Date: Tue, 04 Jun 2024 13:12:41 +0800
Subject: [PATCH] 添加通讯录
---
src/views/Admin/userManage.vue | 293 +++++++++++++++++++++++++++++++++++++++-------------------
1 files changed, 196 insertions(+), 97 deletions(-)
diff --git a/src/views/Admin/userManage.vue b/src/views/Admin/userManage.vue
index 7ca56eb..756d6e8 100644
--- a/src/views/Admin/userManage.vue
+++ b/src/views/Admin/userManage.vue
@@ -1,16 +1,17 @@
<template>
<div class="inner">
<a-row type="flex" justify="space-between" style="margin-bottom: 20px">
- <a-col :span="4">
+ <a-col :span="6">
<a-button type="primary" @click="editData('add',{})">新增用户</a-button>
+ <a-button type="primary" @click="showDialog = true" style="margin-left: 12px">导入用户表</a-button>
</a-col>
- <a-col :span="20">
+ <a-col :span="18">
<a-row type="flex" justify="end" :gutter="12">
<a-col :span="4">
- <a-cascader :options="areaData" v-model="areaVal" placeholder="行政规划" expandTrigger="hover" changeOnSelect @change="onChange" style="width: 100%"/>
+ <a-cascader :options="areaData" v-model="areaVal" placeholder="行政规划" expandTrigger="hover" :fieldNames="fieldNames" changeOnSelect @change="onChange" style="width: 100%"/>
</a-col>
<a-col :span="4">
- <a-select v-model="search.searchParams.unittype" placeholder="监管层级" style="width: 100%">
+ <a-select v-model="search.searchParams.unittype" placeholder="监管层级" style="width: 100%" clearable>
<a-select-option :value="1">
省级
</a-select-option>
@@ -28,7 +29,7 @@
<a-col :span="4">
<a-input v-model="search.searchParams.realName" placeholder="姓名" style="width: 100%"/>
</a-col>
- <a-col :span="4">
+ <a-col :span="6">
<a-button type="primary" @click="getUserList">查询</a-button>
<a-button style="margin-left: 12px" @click="resetSearch">重置</a-button>
</a-col>
@@ -38,38 +39,67 @@
<div class="table-cont">
<a-table :columns="columns" :data-source="tableData" :pagination="pagination" :rowKey="record=>record.id" bordered>
<template #sex="sex">
- {{ sex == 0?'男':'女' }}
+ {{ sex == 1?'男':'女'}}
</template>
- <template #level="level">
+ <template #unittype="unittype">
<a-tag
- :key="level"
- :color="level === 1 ? 'pink' : level === 2 ? 'blue' : 'green'"
+ :color="unittype === 1 ? 'purple' : unittype === 2 ? 'blue' : unittype === 3 ? 'cyan' : 'green'"
>
- {{ level==1?'省级':level==2?'地（市、州）级':level==3?'区县级':'村（乡、镇）级' }}
+ {{ unittype==1?'省级':unittype==2?'地（市、州）级':unittype==3?'区县级':unittype==4?'村（乡、镇）级':'管理员' }}
</a-tag>
</template>
- <template #area="area">
- {{findAreaById(areaData,area)}}
+ <template #area="text,row">
+ <span v-if="row.province !== null && row.province !== ''">{{row.province}}</span>
+ <span v-if="row.city !== null && row.city !== ''">-{{row.city}}</span>
+ <span v-if="row.area !== null && row.area !== ''">-{{row.area}}</span>
+ <span v-if="row.town !== null && row.town !== ''">-{{row.town}}</span>
</template>
<template #role="role">
- {{ role == 1?'领导':'工作人员'}}
+ {{ role.roleName}}
</template>
<template #action="action,row">
<a-button type="link" @click="editData('edit',row)">编辑</a-button>
- <a-button type="link" class="delBtn">删除</a-button>
+ <a-button type="link" class="delBtn" @click="delData(row)">删除</a-button>
<a-button type="link" @click="editPwd(row)">重置密码</a-button>
</template>
</a-table>
+<!-- <a-pagination-->
+<!-- :total="85"-->
+<!-- :show-total="total => `Total ${total} items`"-->
+<!-- :page-size="20"-->
+<!-- :default-current="1"-->
+<!-- />-->
</div>
- <user-mod ref="userMod" @refrech="getUserList"></user-mod>
- <pwd-mod ref="pwdMod" @refrech="getUserList"></pwd-mod>
+ <user-mod ref="userMod" :unitType="unittype" @refresh="getUserList"></user-mod>
+ <pwd-mod ref="pwdMod" @refresh="getUserList"></pwd-mod>
+ <a-modal v-model="showDialog" title="导入用户" ok-text="导入用户" :confirmLoading="uploadLoading" cancel-text="取消" @ok="uploadFile" centered :afterClose="clearMod">
+ <a-form-model ref="ruleForm" :label-col="labelCol" :wrapper-col="wrapperCol" :colon="false">
+ <a-form-model-item label="用户表格模板" extra="导入用户须依据此模板">
+ <a-button type="primary" @click="downloadFile">下载模板</a-button>
+ </a-form-model-item>
+ <a-form-model-item label="区划对照表">
+ <a-button type="primary" @click="downloadAreaFile">下载区划表</a-button>
+ </a-form-model-item>
+ <a-form-model-item label="用户表格文件">
+ <a-upload :file-list="fileList" :remove="handleRemove" :before-upload="beforeUpload" accept=".xlsx,.xls">
+ <a-button> <a-icon type="upload"/> 点击上传 </a-button>
+ </a-upload>
+ </a-form-model-item>
+ </a-form-model>
+ </a-modal>
</div>
</template>
<script>
-import {getUser} from '@/api/user'
+import {getUser, delUser, importFile, downLoadArea, importUserFile} from '@/api/user'
import userMod from "@/views/Admin/components/userMod"
import pwdMod from "@/views/Admin/components/pwdMod";
+import {getDistrictInfo, loginOut} from "@/api/login";
+import {getUserInfo, Session} from "@/util/storage";
+import Cookies from "js-cookie";
+import userExampleFile from "@/assets/userExample.xlsx";
+import exampleFile from "@/assets/example.xlsx";
+import axios from "axios";
export default {
name: 'user',
components: {
@@ -79,13 +109,14 @@
data () {
return {
areaVal: [],
+ unittype: null,
search:{
pageIndex: 1,
pageSize: 10,
searchParams:{
realName: '',
districtId: null,
- unittype: undefined
+ unittype: null
}
},
columns:[
@@ -96,8 +127,8 @@
},
{
title: '姓名',
- dataIndex: 'name',
- key: 'name'
+ dataIndex: 'realName',
+ key: 'realName'
},
{
title: '手机号码',
@@ -106,8 +137,8 @@
},
{
title: '用户名',
- dataIndex: 'userName',
- key: 'userName'
+ dataIndex: 'name',
+ key: 'name'
},
{
title: '性别',
@@ -117,14 +148,14 @@
},
{
title: '级别',
- dataIndex: 'level',
- key: 'level',
- scopedSlots: { customRender: 'level' }
+ dataIndex: 'unittype',
+ // key: 'unittype',
+ scopedSlots: { customRender: 'unittype' }
},
{
title: '行政区划',
dataIndex: 'area',
- key: 'area',
+ // key: 'area',
scopedSlots: { customRender: 'area' }
},
{
@@ -136,94 +167,159 @@
{
title: '操作',
key: 'action',
+ width: '18%',
scopedSlots: { customRender: 'action' },
},
],
- tableData: [
- {
- id: 1,
- name: 'John Brown',
- phone: '15261806177',
- userName: 'JBrown',
- sex: 0,
- level: 1,
- area: 111,
- role: 1
- },
- {
- id: 2,
- name: 'Jim Green',
- phone: '15261806178',
- userName: 'JGreen',
- sex: 1,
- level: 2,
- area: 211,
- role: 2
- },
- {
- id: 3,
- name: 'Joe Black',
- phone: '15261806176',
- userName: 'JBlack',
- sex: 0,
- level: 3,
- area: 11,
- role: 1
- },
- ],
+ tableData: [],
pagination: {
current: 1,
defaultCurrent: 1,
defaultPageSize: 10,
- total: 11,
- onChange: ( page, pageSize ) => this.onPageChange(page,pageSize)
+ total: 0,
+ onChange: ( page, pageSize ) => this.onPageChange(page,pageSize),
+ showTotal: total => `共 ${total} 条`
},
- areaData: [
- {
- value: 1,
- label: '江苏省',
- children: [
- {
- value: 11,
- label: '苏州市',
- children: [
- {
- value: 111,
- label: '工业园区',
- },
- ],
- },
- ],
- },
- {
- value: 2,
- label: '新疆维吾尔自治区',
- children: [
- {
- value: 21,
- label: '乌鲁木齐市',
- children: [
- {
- value: 211,
- label: '国泰新华',
- },
- ],
- },
- ],
- },
- ]
+ areaData: [],
+ fieldNames:{
+ label: 'name',
+ value: 'id',
+ children: 'children'
+ },
+ userExampleFile,
+ labelCol: { span: 8 },
+ wrapperCol: { span: 14 },
+ fileList: [],
+ delList: [],
+ showDialog: false,
+ uploadLoading: false,
}
},
created() {
const t = this
+ t.unittype = getUserInfo().unittype
t.getUserList()
+ t.getDistrictInfo()
},
methods:{
async getUserList(){
const t = this
- const res = await getUser(t.search)
+ if(t.search.searchParams.realName == '' && t.search.searchParams.districtId == null && t.search.searchParams.unittype == null){
+ const {searchParams,...data} = t.search
+ const res = await getUser(data)
+ if(res.data.code == 100){
+ t.tableData = res.data.data
+ t.pagination.total = res.data.total
+ }else{
+ t.$message.warning(res.data.msg);
+ }
+ }else{
+ const res = await getUser(t.search)
+ if(res.data.code == 100){
+ t.tableData = res.data.data
+ t.pagination.total = res.data.total
+ }else{
+ t.$message.warning(res.data.msg);
+ }
+ }
},
+ async getDistrictInfo(){
+ let res = await getDistrictInfo()
+ if(res.data.code == 100){
+ this.areaData = res.data.data
+ } else {
+ this.$message.warning(res.data.msg);
+ }
+ },
+
+ async delData(row){
+ const t = this
+ this.$confirm({
+ title: '提示',
+ content: h => <div>是否删除该条用户信息？</div>,
+ cancelText: '取消',
+ okText: '确认',
+ centered: true,
+ onOk() {
+ delUser(row.id).then(res=>{
+ if(res.data.code == 100){
+ t.$message.success('删除用户信息成功');
+ t.getUserList()
+ }else{
+ t.$message.warning(res.data.msg);
+ }
+ })
+ },
+ onCancel() {
+ console.log('Cancel');
+ },
+ });
+ },
+
+ handleRemove(file) {
+ const index = this.fileList.indexOf(file)
+ const newFileList = this.fileList.slice()
+ newFileList.splice(index, 1)
+ this.fileList = newFileList;
+ },
+ beforeUpload(file) {
+ this.fileList = [...this.fileList, file]
+ this.fileList = this.fileList.slice(-1)
+ return false;
+ },
+
+ async uploadFile(){
+ if(this.fileList.length == 0){
+ this.$message.warning('请先上传用户表格');
+ return
+ }else{
+ this.uploadLoading = true
+ const { fileList } = this;
+ const formData = new FormData();
+ fileList.forEach((file) => {
+ formData.append('file', file)
+ })
+ const res = await importUserFile(formData)
+ if(res.data.code == 100){
+ this.$message.success(res.data.msg,2);
+ this.fileList = []
+ this.uploadLoading = false
+ this.showDialog = false
+ this.getUserList()
+ }else{
+ this.$message.warning(res.data.msg);
+ this.uploadLoading = false
+ }
+ }
+ },
+
+ downloadFile(){
+ const link = document.createElement('a')
+ link.href = userExampleFile
+ link.target = '_blank'
+ link.download = '用户导入模版(普通员工版).xlsx'
+ link.click()
+ },
+ async downloadAreaFile(){
+ const t = this
+ const res = await downLoadArea();
+ if (res) {
+ const link = document.createElement('a')
+ let blob = new Blob([res.data],{type: res.data.type})
+ link.style.display = "none";
+ link.href = URL.createObjectURL(blob); // 创建URL
+ link.setAttribute("download", '区划对照表');
+ document.body.appendChild(link);
+ link.click();
+ document.body.removeChild(link);
+ } else {
+ this.$message.error('获取文件失败')
+ }
+ },
+ clearMod(){
+ this.fileList = []
+ },
resetSearch(){
const t = this
t.areaVal = []
@@ -233,7 +329,7 @@
searchParams:{
realName: '',
districtId: null,
- unittype: undefined
+ unittype: null
}
}
t.getUserList()
@@ -247,13 +343,16 @@
editPwd(record){
const t = this
- t.$refs.pwdMod.form.id = record.id
+ t.$refs.pwdMod.form.uid = record.id
+ t.$refs.pwdMod.updateType = 2
t.$refs.pwdMod.visible = true
},
onPageChange(page, pageSize) {
const t= this
t.pagination.current = page
+ t.search.pageIndex = page
+ t.getUserList()
},
onChange(value) {
const t = this
--
Gitblit v1.9.2