fix:用户管理页面导入失败提示修改

This commit is contained in:
jackal 2024-04-25 10:46:47 +08:00
parent d8990a97e9
commit 20a6b3318b
1 changed files with 502 additions and 790 deletions

View File

@ -4,419 +4,178 @@
<!--部门数据--> <!--部门数据-->
<el-col :span="4" :xs="24"> <el-col :span="4" :xs="24">
<div class="head-container"> <div class="head-container">
<el-input <el-input v-model="deptName" placeholder="请输入部门名称" clearable size="small"
v-model="deptName" prefix-icon="el-icon-search" style="margin-bottom: 20px" />
placeholder="请输入部门名称"
clearable
size="small"
prefix-icon="el-icon-search"
style="margin-bottom: 20px"
/>
</div> </div>
<div class="head-container"> <div class="head-container">
<el-tree <el-tree :data="deptOptions" :props="defaultProps" :expand-on-click-node="false"
:data="deptOptions" :filter-node-method="filterNode" ref="tree" node-key="id" default-expand-all highlight-current
:props="defaultProps" @node-click="handleNodeClick" />
:expand-on-click-node="false"
:filter-node-method="filterNode"
ref="tree"
node-key="id"
default-expand-all
highlight-current
@node-click="handleNodeClick"
/>
</div> </div>
</el-col> </el-col>
<!--用户数据--> <!--用户数据-->
<el-col :span="20" :xs="24"> <el-col :span="20" :xs="24">
<el-form <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch"
:model="queryParams" label-width="68px">
ref="queryForm"
size="small"
:inline="true"
v-show="showSearch"
label-width="68px"
>
<el-form-item label="用户名称" prop="userName"> <el-form-item label="用户名称" prop="userName">
<el-input <el-input v-model="queryParams.userName" placeholder="请输入用户名称" clearable style="width: 240px"
v-model="queryParams.userName" @keyup.enter.native="handleQuery" />
placeholder="请输入用户名称"
clearable
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item> </el-form-item>
<el-form-item label="手机号码" prop="phonenumber"> <el-form-item label="手机号码" prop="phonenumber">
<el-input <el-input v-model="queryParams.phonenumber" placeholder="请输入手机号码" clearable style="width: 240px"
v-model="queryParams.phonenumber" @keyup.enter.native="handleQuery" />
placeholder="请输入手机号码"
clearable
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item> </el-form-item>
<el-form-item label="状态" prop="status"> <el-form-item label="状态" prop="status">
<el-select <el-select v-model="queryParams.status" placeholder="用户状态" clearable filterable
v-model="queryParams.status" style="width: 240px">
placeholder="用户状态" <el-option v-for="dict in dict.type.sys_normal_disable" :key="dict.value"
clearable :label="dict.label" :value="dict.value" />
filterable
style="width: 240px"
>
<el-option
v-for="dict in dict.type.sys_normal_disable"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="创建时间"> <el-form-item label="创建时间">
<el-date-picker <el-date-picker v-model="dateRange" style="width: 240px" value-format="yyyy-MM-dd"
v-model="dateRange" type="daterange" range-separator="-" start-placeholder="开始日期"
style="width: 240px" end-placeholder="结束日期"></el-date-picker>
value-format="yyyy-MM-dd"
type="daterange"
range-separator="-"
start-placeholder="开始日期"
end-placeholder="结束日期"
></el-date-picker>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
type="primary" <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
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-item>
</el-form> </el-form>
<el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
type="primary" v-hasPermi="['system:user:add']">新增</el-button>
plain
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['system:user:add']"
>新增</el-button
>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single"
type="success" @click="handleUpdate" v-hasPermi="['system:user:edit']">修改</el-button>
plain
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['system:user:edit']"
>修改</el-button
>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple"
type="danger" @click="handleDelete" v-hasPermi="['system:user:remove']">删除</el-button>
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['system:user:remove']"
>删除</el-button
>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button type="info" plain icon="el-icon-upload2" size="mini" @click="handleImport"
type="info" v-hasPermi="['system:user:import']">导入</el-button>
plain
icon="el-icon-upload2"
size="mini"
@click="handleImport"
v-hasPermi="['system:user:import']"
>导入</el-button
>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
type="warning" v-hasPermi="['system:user:export']">导出</el-button>
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['system:user:export']"
>导出</el-button
>
</el-col> </el-col>
<right-toolbar <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"
:showSearch.sync="showSearch" :columns="columns"></right-toolbar>
@queryTable="getList"
:columns="columns"
></right-toolbar>
</el-row> </el-row>
<el-table <el-table v-loading="loading" :data="userList" @selection-change="handleSelectionChange">
v-loading="loading" <el-table-column type="selection" width="50" align="center" />
:data="userList" <el-table-column label="用户编号" align="center" key="userId" prop="userId" v-if="columns[0].visible" />
@selection-change="handleSelectionChange" <el-table-column label="用户名称" align="center" key="userName" prop="userName"
> v-if="columns[1].visible" :show-overflow-tooltip="true" />
<el-table-column <el-table-column label="用户昵称" align="center" key="nickName" prop="nickName"
type="selection" v-if="columns[2].visible" :show-overflow-tooltip="true" />
width="50" <el-table-column label="部门" align="center" key="deptName" prop="dept.deptName"
align="center" v-if="columns[3].visible" :show-overflow-tooltip="true" />
/> <el-table-column label="手机号码" align="center" key="phonenumber" prop="phonenumber"
<el-table-column v-if="columns[4].visible" width="120" />
label="用户编号" <el-table-column label="状态" align="center" key="status" v-if="columns[5].visible">
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-column
label="状态"
align="center"
key="status"
v-if="columns[5].visible"
>
<template slot-scope="scope"> <template slot-scope="scope">
<el-switch <el-switch v-model="scope.row.status" active-value="0" inactive-value="1"
v-model="scope.row.status" @change="handleStatusChange(scope.row)"></el-switch>
active-value="0"
inactive-value="1"
@change="handleStatusChange(scope.row)"
></el-switch>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column label="创建时间" align="center" prop="createTime" v-if="columns[6].visible"
label="创建时间" width="160">
align="center"
prop="createTime"
v-if="columns[6].visible"
width="160"
>
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span> <span>{{ parseTime(scope.row.createTime) }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column label="操作" align="center" width="160" class-name="small-padding fixed-width">
label="操作" <template slot-scope="scope" v-if="scope.row.userId !== 1">
align="center" <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
width="160" v-hasPermi="['system:user:edit']">修改</el-button>
class-name="small-padding fixed-width" <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
> v-hasPermi="['system:user:remove']">删除</el-button>
<template <el-dropdown size="mini" @command="(command) =>
slot-scope="scope"
v-if="scope.row.userId !== 1"
>
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['system:user:edit']"
>修改</el-button
>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['system:user:remove']"
>删除</el-button
>
<el-dropdown
size="mini"
@command="
(command) =>
handleCommand(command, scope.row) handleCommand(command, scope.row)
" " v-hasPermi="[
v-hasPermi="[
'system:user:resetPwd', 'system:user:resetPwd',
'system:user:edit', 'system:user:edit',
]" ]">
> <el-button size="mini" type="text" icon="el-icon-d-arrow-right">更多</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-d-arrow-right"
>更多</el-button
>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item <el-dropdown-item command="handleResetPwd" icon="el-icon-key"
command="handleResetPwd" v-hasPermi="['system:user:resetPwd']">重置密码</el-dropdown-item>
icon="el-icon-key" <el-dropdown-item command="handleAuthRole" icon="el-icon-circle-check"
v-hasPermi="['system:user:resetPwd']" v-hasPermi="['system:user:edit']">分配角色</el-dropdown-item>
>重置密码</el-dropdown-item
>
<el-dropdown-item
command="handleAuthRole"
icon="el-icon-circle-check"
v-hasPermi="['system:user:edit']"
>分配角色</el-dropdown-item
>
</el-dropdown-menu> </el-dropdown-menu>
</el-dropdown> </el-dropdown>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<pagination <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
v-show="total > 0" :limit.sync="queryParams.pageSize" @pagination="getList" />
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
</el-col> </el-col>
</el-row> </el-row>
<!-- 添加或修改用户配置对话框 --> <!-- 添加或修改用户配置对话框 -->
<el-dialog <el-dialog :title="title" :visible.sync="open" width="600px" append-to-body :close-on-click-modal="false">
:title="title"
:visible.sync="open"
width="600px"
append-to-body
:close-on-click-modal="false"
>
<el-form ref="form" :model="form" :rules="rules" label-width="80px"> <el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="用户昵称" prop="nickName"> <el-form-item label="用户昵称" prop="nickName">
<el-input <el-input v-model="form.nickName" placeholder="请输入用户昵称" maxlength="30" />
v-model="form.nickName"
placeholder="请输入用户昵称"
maxlength="30"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="归属部门" prop="deptId"> <el-form-item label="归属部门" prop="deptId">
<treeselect <treeselect v-model="form.deptId" :options="deptOptions" :show-count="true"
v-model="form.deptId" placeholder="请选择归属部门" />
:options="deptOptions"
:show-count="true"
placeholder="请选择归属部门"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="手机号码" prop="phonenumber"> <el-form-item label="手机号码" prop="phonenumber">
<el-input <el-input v-model="form.phonenumber" placeholder="请输入手机号码" maxlength="11" />
v-model="form.phonenumber"
placeholder="请输入手机号码"
maxlength="11"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="邮箱" prop="email"> <el-form-item label="邮箱" prop="email">
<el-input <el-input v-model="form.email" placeholder="请输入邮箱" maxlength="50" />
v-model="form.email"
placeholder="请输入邮箱"
maxlength="50"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item <el-form-item v-if="form.userId == undefined" label="用户名称" prop="userName">
v-if="form.userId == undefined" <el-input v-model="form.userName" placeholder="请输入用户名称" maxlength="30" />
label="用户名称"
prop="userName"
>
<el-input
v-model="form.userName"
placeholder="请输入用户名称"
maxlength="30"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item <el-form-item v-if="form.userId == undefined" label="用户密码" prop="password">
v-if="form.userId == undefined" <el-input v-model="form.password" placeholder="请输入用户密码" type="password" maxlength="20"
label="用户密码" show-password />
prop="password"
>
<el-input
v-model="form.password"
placeholder="请输入用户密码"
type="password"
maxlength="20"
show-password
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="用户性别"> <el-form-item label="用户性别">
<el-select <el-select v-model="form.sex" filterable placeholder="请选择性别">
v-model="form.sex" <el-option v-for="dict in dict.type.sys_user_sex" :key="dict.value" :label="dict.label"
filterable :value="dict.value"></el-option>
placeholder="请选择性别"
>
<el-option
v-for="dict in dict.type.sys_user_sex"
:key="dict.value"
:label="dict.label"
:value="dict.value"
></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="状态"> <el-form-item label="状态">
<el-radio-group v-model="form.status"> <el-radio-group v-model="form.status">
<el-radio <el-radio v-for="dict in dict.type.sys_normal_disable" :key="dict.value"
v-for="dict in dict.type.sys_normal_disable" :label="dict.value">{{
:key="dict.value" dict.label }}</el-radio>
:label="dict.value"
>{{ dict.label }}</el-radio
>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
</el-col> </el-col>
@ -424,37 +183,17 @@
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="岗位"> <el-form-item label="岗位">
<el-select <el-select v-model="form.postIds" filterable multiple placeholder="请选择岗位">
v-model="form.postIds" <el-option v-for="item in postOptions" :key="item.postId" :label="item.postName"
filterable :value="item.postId" :disabled="item.status == 1"></el-option>
multiple
placeholder="请选择岗位"
>
<el-option
v-for="item in postOptions"
:key="item.postId"
:label="item.postName"
:value="item.postId"
:disabled="item.status == 1"
></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="角色"> <el-form-item label="角色">
<el-select <el-select v-model="form.roleIds" filterable multiple placeholder="请选择角色">
v-model="form.roleIds" <el-option v-for="item in roleOptions" :key="item.roleId" :label="item.roleName"
filterable :value="item.roleId" :disabled="item.status == 1"></el-option>
multiple
placeholder="请选择角色"
>
<el-option
v-for="item in roleOptions"
:key="item.roleId"
:label="item.roleName"
:value="item.roleId"
:disabled="item.status == 1"
></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
@ -462,12 +201,8 @@
<el-row> <el-row>
<el-col :span="24"> <el-col :span="24">
<el-form-item label="备注"> <el-form-item label="备注">
<el-input <el-input v-model="form.remark" type="textarea" placeholder="请输入内容"
v-model="form.remark" maxlength="100"></el-input>
type="textarea"
placeholder="请输入内容"
maxlength="100"
></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
@ -479,47 +214,24 @@
</el-dialog> </el-dialog>
<!-- 用户导入对话框 --> <!-- 用户导入对话框 -->
<el-dialog <el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
:title="upload.title" <el-upload ref="upload" :limit="1" accept=".xlsx, .xls" :headers="upload.headers"
:visible.sync="upload.open" :action="upload.url + '?updateSupport=' + upload.updateSupport" :disabled="upload.isUploading"
width="400px" :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false" drag>
append-to-body
>
<el-upload
ref="upload"
:limit="1"
accept=".xlsx, .xls"
:headers="upload.headers"
:action="upload.url + '?updateSupport=' + upload.updateSupport"
:disabled="upload.isUploading"
:on-progress="handleFileUploadProgress"
:on-success="handleFileSuccess"
:auto-upload="false"
drag
>
<i class="el-icon-upload"></i> <i class="el-icon-upload"></i>
<div class="el-upload__text" <div class="el-upload__text">将文件拖到此处<em>点击上传</em></div>
>将文件拖到此处<em>点击上传</em></div
>
<div class="el-upload__tip text-center" slot="tip"> <div class="el-upload__tip text-center" slot="tip">
<div class="el-upload__tip" slot="tip"> <div class="el-upload__tip" slot="tip">
<el-checkbox v-model="upload.updateSupport" /> <el-checkbox v-model="upload.updateSupport" />
是否更新已经存在的用户数据 是否更新已经存在的用户数据
</div> </div>
<span>仅允许导入xlsxlsx格式文件</span> <span>仅允许导入xlsxlsx格式文件</span>
<el-link <el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline"
type="primary" @click="importTemplate">下载模板</el-link>
:underline="false"
style="font-size: 12px; vertical-align: baseline"
@click="importTemplate"
>下载模板</el-link
>
</div> </div>
</el-upload> </el-upload>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitFileForm" <el-button type="primary" @click="submitFileForm"> </el-button>
> </el-button
>
<el-button @click="upload.open = false"> </el-button> <el-button @click="upload.open = false"> </el-button>
</div> </div>
</el-dialog> </el-dialog>
@ -527,7 +239,7 @@
</template> </template>
<script> <script>
import { import {
listUser, listUser,
getUser, getUser,
delUser, delUser,
@ -536,12 +248,12 @@
resetUserPwd, resetUserPwd,
changeUserStatus, changeUserStatus,
deptTreeSelect, deptTreeSelect,
} from '@/api/system/user' } from '@/api/system/user'
import { getToken } from '@/utils/auth' import { getToken } from '@/utils/auth'
import Treeselect from '@riophae/vue-treeselect' import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css' import '@riophae/vue-treeselect/dist/vue-treeselect.css'
export default { export default {
name: 'User', name: 'User',
dicts: ['sys_normal_disable', 'sys_user_sex'], dicts: ['sys_normal_disable', 'sys_user_sex'],
components: { Treeselect }, components: { Treeselect },
@ -836,7 +548,7 @@
) )
}) })
}) })
.catch(() => {}) .catch(() => { })
}, },
/** 分配角色操作 */ /** 分配角色操作 */
handleAuthRole: function (row) { handleAuthRole: function (row) {
@ -877,7 +589,7 @@
this.getList() this.getList()
this.$modal.msgSuccess('删除成功') this.$modal.msgSuccess('删除成功')
}) })
.catch(() => {}) .catch(() => { })
}, },
/** 导出按钮操作 */ /** 导出按钮操作 */
handleExport() { handleExport() {
@ -922,7 +634,7 @@
} else { } else {
this.$alert( this.$alert(
"<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + "<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" +
'导入失败: ' + response.msg + '导入失败: ' + '请检查导入数据是否符合导入模板' +
'</div>', '</div>',
'导入结果', '导入结果',
{ dangerouslyUseHTMLString: true }, { dangerouslyUseHTMLString: true },
@ -936,5 +648,5 @@
this.$refs.upload.submit() this.$refs.upload.submit()
}, },
}, },
} }
</script> </script>