|
|
|
@ -6,10 +6,8 @@ |
|
|
|
<div class="box"> |
|
|
|
<div class="left"> |
|
|
|
<h1>用户姓名：</h1> |
|
|
|
|
|
|
|
<input type="text" v-model="state1" class="textInput"/> |
|
|
|
|
|
|
|
<img src="/images/search.png" @click="onSearch"> |
|
|
|
<div><img src="/images/search.png" @click="onSearch"></div> |
|
|
|
</div> |
|
|
|
<div class="right"> |
|
|
|
<span @click="onAddClick">添加新用户</span> |
|
|
|
@ -17,14 +15,13 @@ |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="tableMessage"> |
|
|
|
<el-table :data="tableData" border style="width: 100%;color: black;"> |
|
|
|
|
|
|
|
<el-table-column type="index" label="序号" width="176px" align="center"/> |
|
|
|
<el-table-column prop="userName" label="用户姓名" width="201px" align="center"/> |
|
|
|
<el-table-column prop="userAccountNumber" label="用户账号" width="280px" align="center"/> |
|
|
|
<el-table-column prop="userPhone" label="电话" width="278px" align="center"/> |
|
|
|
<el-table-column prop="userEmail" label="邮箱" width="250px" align="center"/> |
|
|
|
<el-table-column prop="operation" label="操作" width="301px" align="center"> |
|
|
|
<el-table :data="tableData" border style="color: black;"> |
|
|
|
<el-table-column type="index" label="序号" align="center" width="100px"/> |
|
|
|
<el-table-column prop="userName" label="用户姓名" align="center"/> |
|
|
|
<el-table-column prop="userAccountNumber" label="用户账号" align="center"/> |
|
|
|
<el-table-column prop="userPhone" label="电话" align="center"/> |
|
|
|
<el-table-column prop="userEmail" label="邮箱" align="center"/> |
|
|
|
<el-table-column prop="operation" label="操作" align="center"> |
|
|
|
<template #default="scope"> |
|
|
|
<div class="operation"> |
|
|
|
<span @click.prevent="onAmendClick(scope.$index, tableData)">修改信息</span> |
|
|
|
@ -50,7 +47,7 @@ |
|
|
|
page-size="2" |
|
|
|
@prev-click="prev" |
|
|
|
@next-click="next" |
|
|
|
@current-change="changenum"> |
|
|
|
@current-change="changEnum"> |
|
|
|
</el-pagination> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@ -59,10 +56,10 @@ |
|
|
|
<el-dialog v-model="dialogFormVisible" :title="title" show-close=false center=true width="961px" top="17%"> |
|
|
|
<el-form :model="form"> |
|
|
|
<el-form-item label="用户账号：" :label-width="formLabelWidth" > |
|
|
|
<el-input v-model="form.userAccountNumber" autocomplete="off" style="width: 260px" :disabled="isdisabled"></el-input> |
|
|
|
<el-input v-model="form.userAccountNumber" autocomplete="off" style="width: 260px" :disabled="isDisabled"></el-input> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="用户姓名：" :label-width="formLabelWidth"> |
|
|
|
<el-input v-model="form.userName" autocomplete="off" style="width: 260px"></el-input> |
|
|
|
<el-form-item label="用户密码：" :label-width="formLabelWidth"> |
|
|
|
<el-input v-model="form.userPassword" autocomplete="off" style="width: 260px" type="password"></el-input> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="电话：" :label-width="formLabelWidth"> |
|
|
|
<el-input v-model="form.userPhone" autocomplete="off" style="width: 260px"></el-input> |
|
|
|
@ -70,6 +67,9 @@ |
|
|
|
<el-form-item label="邮箱：" :label-width="formLabelWidth"> |
|
|
|
<el-input v-model="form.userEmail" autocomplete="off" style="width: 260px"></el-input> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="用户姓名：" :label-width="formLabelWidth"> |
|
|
|
<el-input v-model="form.userName" autocomplete="off" style="width: 260px"></el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-form> |
|
|
|
<template #footer> |
|
|
|
<span class="dialog-footer"> |
|
|
|
@ -88,13 +88,14 @@ |
|
|
|
import {reactive, toRefs ,ref , onMounted} from 'vue'; |
|
|
|
import { post } from "../uilts/axios"; |
|
|
|
import { ElMessage } from 'element-plus' |
|
|
|
import { format } from '../hooks/String'; |
|
|
|
export default { |
|
|
|
name: 'SystemManagement', |
|
|
|
setup() { |
|
|
|
let option = reactive({ |
|
|
|
state1:'', |
|
|
|
dialogFormVisible:false, |
|
|
|
isdisabled:false, |
|
|
|
isDisabled:false, |
|
|
|
title:'', |
|
|
|
formLabelWidth:"100px", |
|
|
|
total:"", |
|
|
|
@ -104,10 +105,10 @@ export default { |
|
|
|
userName:'', |
|
|
|
userAccountNumber:'', |
|
|
|
userPhone:'', |
|
|
|
userEmail:'' |
|
|
|
userEmail:'', |
|
|
|
userPassword:'' |
|
|
|
}, |
|
|
|
tableData:[] |
|
|
|
|
|
|
|
}) |
|
|
|
const findAllUser= ()=>{ |
|
|
|
return post("user/findAllUser",{ |
|
|
|
@ -124,23 +125,23 @@ export default { |
|
|
|
findAllUser() |
|
|
|
}) |
|
|
|
|
|
|
|
|
|
|
|
//添加用户 |
|
|
|
const onAddClick = ()=> { |
|
|
|
option.isdisabled=false |
|
|
|
option.isDisabled=false |
|
|
|
option.title = '添加用户' |
|
|
|
option.dialogFormVisible = true |
|
|
|
option.form = { |
|
|
|
userName:'', |
|
|
|
userAccountNumber:'', |
|
|
|
userPhone:'', |
|
|
|
userEmail:'' |
|
|
|
userEmail:'', |
|
|
|
userPassword:'' |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
//修改用户 |
|
|
|
const onAmendClick = (index, rows)=>{ |
|
|
|
option.isdisabled = true |
|
|
|
option.isDisabled = true |
|
|
|
option.title = '修改信息' |
|
|
|
option.dialogFormVisible = true |
|
|
|
option.form = JSON.parse(JSON.stringify(rows[index])) |
|
|
|
@ -189,14 +190,37 @@ export default { |
|
|
|
findAllUser() |
|
|
|
} |
|
|
|
|
|
|
|
const changenum =(e)=>{ |
|
|
|
const changEnum =(e)=>{ |
|
|
|
option.current= e |
|
|
|
findAllUser() |
|
|
|
} |
|
|
|
|
|
|
|
const verify = () => { |
|
|
|
let errors = []; |
|
|
|
if (option.form.userAccountNumber == null || option.form.userAccountNumber.trim() == ""){ |
|
|
|
errors.push("用户账号"); |
|
|
|
} |
|
|
|
if (option.form.userPassword == null || option.form.userPassword.trim() == ""){ |
|
|
|
errors.push("用户密码"); |
|
|
|
} |
|
|
|
if (option.form.userName == null || option.form.userName.trim() == ""){ |
|
|
|
errors.push("用户姓名"); |
|
|
|
} |
|
|
|
// if (option.form.userPhone == null || option.form.userPhone.trim() == ""){ |
|
|
|
// errors.push("手机号码"); |
|
|
|
// } |
|
|
|
if (errors.length > 0){ |
|
|
|
ElMessage.error({ |
|
|
|
message: format("{0}不能为空", errors.join(", ")), |
|
|
|
type: 'error' |
|
|
|
}); |
|
|
|
} |
|
|
|
|
|
|
|
return errors.length > 0; |
|
|
|
} |
|
|
|
|
|
|
|
const submit = ()=> { |
|
|
|
if (verify()) return; |
|
|
|
if(option.title === '修改信息'){ |
|
|
|
post("user/updateUser", option.form, "application/json").then((res: any) => { |
|
|
|
option.dialogFormVisible=false |
|
|
|
@ -217,6 +241,7 @@ export default { |
|
|
|
} |
|
|
|
|
|
|
|
if(option.title === '添加用户'){ |
|
|
|
if (verify()) return; |
|
|
|
post("user/insertUser",option.form,"application/json").then((res:any)=>{ |
|
|
|
option.dialogFormVisible = false |
|
|
|
if (res.error != 0){ |
|
|
|
@ -246,8 +271,7 @@ export default { |
|
|
|
confirmEvent, |
|
|
|
prev, |
|
|
|
next, |
|
|
|
changenum |
|
|
|
|
|
|
|
changEnum |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
@ -273,23 +297,13 @@ export default { |
|
|
|
.left{ |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
position: relative; |
|
|
|
align-items: center; |
|
|
|
|
|
|
|
.textInput{ |
|
|
|
width: 305px; |
|
|
|
} |
|
|
|
&::after { |
|
|
|
content: ''; |
|
|
|
width: 0; |
|
|
|
height: 0; |
|
|
|
display: block; |
|
|
|
position: absolute; |
|
|
|
top: 50%; |
|
|
|
right: 70px; |
|
|
|
transform: translateY(-50%); |
|
|
|
border-left: 0.08rem solid transparent; |
|
|
|
border-right: 0.08rem solid transparent; |
|
|
|
border-top: 0.08rem solid #222222; |
|
|
|
height: 35px; |
|
|
|
line-height: 35px; |
|
|
|
font-size: 20px; |
|
|
|
} |
|
|
|
|
|
|
|
h1{ |
|
|
|
@ -306,6 +320,7 @@ export default { |
|
|
|
width: 44px; |
|
|
|
height: 44px; |
|
|
|
margin-left: 10px; |
|
|
|
padding-top: 4px; |
|
|
|
cursor: pointer; |
|
|
|
} |
|
|
|
} |
|
|
|
@ -342,7 +357,6 @@ export default { |
|
|
|
opacity: 1; |
|
|
|
cursor: pointer; |
|
|
|
font-weight: 400; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
@ -360,7 +374,10 @@ export default { |
|
|
|
:deep(.el-form){ |
|
|
|
display: flex; |
|
|
|
flex-wrap: wrap; |
|
|
|
justify-content: space-evenly; |
|
|
|
justify-content: space-between; |
|
|
|
margin: 0 auto; |
|
|
|
width: 90%; |
|
|
|
//align-content: flex-start; |
|
|
|
} |
|
|
|
|
|
|
|
:deep(.el-button){ |
|
|
|
|
