revert a9d4e8ee50
revert Merge remote-tracking branch 'origin/personal/lsd/user' # Conflicts: # package.json # src/main.js # src/store/authentication.js
This commit is contained in:
parent
7dd7cc3e5a
commit
628c7712ff
12
src/App.vue
12
src/App.vue
@ -1,8 +1,10 @@
|
||||
<template>
|
||||
<div>
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
<router-view></router-view>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
<script setup>
|
||||
import 'element-plus/dist/index.css'
|
||||
</script>
|
||||
|
||||
<!--请不要对App.vue进行修改，请采用在views的对应目录下新建自己需要的文件
|
||||
并通过在/router下的对应模块名称的js中引入路由的方式来显示自己的页面-->
|
||||
@ -6,55 +6,17 @@ import meetingManagementRoutes from './meetingManagement'
|
||||
import newsManagementRoutes from './newsManagement'
|
||||
import organizationManagementRoutes from './organizationManagement'
|
||||
import userManagementRoutes from './userManagement'
|
||||
import App from '../App.vue';
|
||||
import Register from "../view/Register.vue";
|
||||
import Home from '../view/Home.vue';
|
||||
import UserManagement from "../view/UserManagement.vue";
|
||||
import TenantManagement from "../view/TenantManagement.vue";
|
||||
import AddUser from "../view/AddUser.vue";
|
||||
import AddTenant from "../view/AddTenant.vue";
|
||||
import EditTenant from "../view/EditTenant.vue";
|
||||
import EditUser from "../view/EditUser.vue";
|
||||
import test from "../test.vue";
|
||||
|
||||
// 请不要直接修改本文件，使用在router下的对应模块名称的js中引入路由的方式来代替->
|
||||
|
||||
const routes = [
|
||||
{ path: '/', component: Home},
|
||||
{ path: '/login', name: 'App', component:Home },
|
||||
{
|
||||
path: '/register',
|
||||
name: 'Register',
|
||||
component: Register
|
||||
},
|
||||
{ path: '/tenantManagement',
|
||||
name: 'TenantManagement',
|
||||
component: TenantManagement
|
||||
},
|
||||
{ path: '/addUser',
|
||||
name: 'AddUser',
|
||||
component: AddUser
|
||||
},
|
||||
{ path: '/addTenant',
|
||||
name: 'AddTenant',
|
||||
component: AddTenant
|
||||
},
|
||||
{ path: '/editTenant',
|
||||
name: 'EditTenant',
|
||||
component: EditTenant
|
||||
},
|
||||
{ path: '/editUser',
|
||||
name: 'EditUser',
|
||||
component: EditUser
|
||||
},
|
||||
{ path: '/test',
|
||||
name: 'Test',
|
||||
component: test
|
||||
},
|
||||
{ path: '/userManagement', name: 'UM', component:UserManagement }
|
||||
// ...authenticationRoutes,
|
||||
// ...courseManagementRoutes,
|
||||
// ...meetingManagementRoutes,
|
||||
// ...newsManagementRoutes,
|
||||
// ...organizationManagementRoutes,
|
||||
// ...userManagementRoutes,
|
||||
{ path: '/', component: HelloWorld, meta: {"msg": "HeIl⚪ W0rId!"}},
|
||||
...authenticationRoutes,
|
||||
...courseManagementRoutes,
|
||||
...meetingManagementRoutes,
|
||||
...newsManagementRoutes,
|
||||
...organizationManagementRoutes,
|
||||
...userManagementRoutes,
|
||||
]
|
||||
|
||||
const router = createRouter({
|
||||
|
||||
@ -6,5 +6,4 @@ export default [
|
||||
// { path: '/users', component: UserList },
|
||||
// { path: '/users/:id', component: UserDetail },
|
||||
// { path: '/users/:id/edit', component: UserEdit }
|
||||
|
||||
]
|
||||
|
||||
@ -1,44 +0,0 @@
|
||||
import axios from "axios";
|
||||
import { useRouter } from 'vue-router';
|
||||
import {ref} from "vue";
|
||||
|
||||
|
||||
export default {
|
||||
login(account, password){
|
||||
const url='http://localhost:8080/checkLogin'
|
||||
const data={
|
||||
account:account,
|
||||
password:password
|
||||
}
|
||||
return axios.post(url, data)
|
||||
.then(response => {
|
||||
const user=ref(null);
|
||||
const router=useRouter();
|
||||
user.value=response.data;
|
||||
if(user.value.account!=null) {
|
||||
alert("登录成功");
|
||||
if (user.value.account === "123" && user.value.password === "123") {
|
||||
alert("进入管理员界面");
|
||||
location.href="/userManagement";
|
||||
} else {
|
||||
alert("进入用户界面");
|
||||
location.href="/tenantManagement";
|
||||
}
|
||||
}else{
|
||||
alert("登录失败");
|
||||
}
|
||||
// 处理登录成功的逻辑
|
||||
console.log(response.data);
|
||||
return response.data;
|
||||
});
|
||||
|
||||
},
|
||||
register(user){
|
||||
const url='http://localhost:8080/checkRegister'
|
||||
return axios.post(url, user)
|
||||
.then(response=>{
|
||||
return response.data;
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
@ -1,58 +0,0 @@
|
||||
import axios from "axios";
|
||||
|
||||
import {ref} from "vue";
|
||||
|
||||
export default {
|
||||
addUser(user){
|
||||
const url='http://localhost:8080/addUser'
|
||||
const data={
|
||||
account: user.account,
|
||||
name: user.name,
|
||||
organization: user.organization,
|
||||
email: user.email,
|
||||
gender: user.gender,
|
||||
phone: user.phone,
|
||||
password:user.password
|
||||
}
|
||||
return axios.post(url, data)
|
||||
.then(response => {
|
||||
if(response.data!=null){
|
||||
alert("新增成功");
|
||||
}else
|
||||
alert("新增失败");
|
||||
location.href="/userManagement";
|
||||
});
|
||||
|
||||
},
|
||||
|
||||
|
||||
editUser(){
|
||||
|
||||
},
|
||||
|
||||
searchUser(){
|
||||
|
||||
},
|
||||
|
||||
getAll(){
|
||||
const url='http://localhost:8080/getAll'
|
||||
return axios.get(url)
|
||||
.then(response => {
|
||||
return response.data;
|
||||
});
|
||||
},
|
||||
|
||||
update(user){
|
||||
const url='http://localhost:8080/update';
|
||||
console.log("哈哈哈哈哈哈哈啊哈哈哈哈哈"+user);
|
||||
return axios.post(url,user)
|
||||
.then(response => {
|
||||
if(response.data!=null){
|
||||
console.log(response.data)
|
||||
}else
|
||||
console.log("更新失败");
|
||||
location.href="/userManagement";
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
119
src/test.vue
119
src/test.vue
@ -1,119 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<!-- 表格 -->
|
||||
<el-table
|
||||
:data="tableData"
|
||||
style="width: 100%"
|
||||
@selection-change="handleSelectionChange"
|
||||
>
|
||||
<!-- 勾选框列 -->
|
||||
<el-table-column
|
||||
type="selection"
|
||||
width="55">
|
||||
</el-table-column>
|
||||
<!-- 其他列 -->
|
||||
<el-table-column
|
||||
label="日期"
|
||||
prop="date">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="姓名"
|
||||
prop="name">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="地址"
|
||||
prop="address">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<!-- 显示选中行数据的按钮 -->
|
||||
<el-button @click="showDialog">编辑选中行</el-button>
|
||||
|
||||
<!-- 弹窗 -->
|
||||
<el-dialog :visible.sync="dialogVisible" title="编辑选中行">
|
||||
<el-form :model="formData">
|
||||
<el-form-item label="日期">
|
||||
<el-input v-model="formData.date"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="姓名">
|
||||
<el-input v-model="formData.name"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="地址">
|
||||
<el-input v-model="formData.address"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" @click="saveChanges">保存</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import { ElMessageBox } from 'element-plus';
|
||||
|
||||
// 表格数据
|
||||
const tableData = ref([
|
||||
{
|
||||
date: '2016-05-03',
|
||||
name: 'Tom',
|
||||
address: 'No. 189, Grove St, Los Angeles',
|
||||
},
|
||||
{
|
||||
date: '2016-05-02',
|
||||
name: 'John',
|
||||
address: 'No. 189, Grove St, Los Angeles',
|
||||
},
|
||||
{
|
||||
date: '2016-05-04',
|
||||
name: 'Jane',
|
||||
address: 'No. 189, Grove St, Los Angeles',
|
||||
},
|
||||
]);
|
||||
|
||||
const selectedRows = ref([]);
|
||||
const dialogVisible = ref(false);
|
||||
const formData = ref({
|
||||
date: '',
|
||||
name: '',
|
||||
address: '',
|
||||
});
|
||||
|
||||
// 处理选中项变化
|
||||
const handleSelectionChange = (rows) => {
|
||||
selectedRows.value = rows;
|
||||
};
|
||||
|
||||
// 显示弹窗
|
||||
const showDialog = () => {
|
||||
if (selectedRows.value.length !== 1) {
|
||||
ElMessageBox.alert('请选中一行进行编辑', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
// 设置表单数据为选中行的数据
|
||||
formData.value = { ...selectedRows.value[0] };
|
||||
dialogVisible.value = true;
|
||||
};
|
||||
|
||||
// 保存更改
|
||||
const saveChanges = () => {
|
||||
// 将更改保存到原始数据
|
||||
const index = tableData.value.findIndex(row => row.date === formData.value.date);
|
||||
if (index !== -1) {
|
||||
tableData.value[index] = { ...formData.value };
|
||||
}
|
||||
|
||||
dialogVisible.value = false;
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.dialog-footer {
|
||||
text-align: right;
|
||||
}
|
||||
</style>
|
||||
@ -1,11 +0,0 @@
|
||||
<script setup>
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@ -1,59 +0,0 @@
|
||||
|
||||
<template>
|
||||
<el-text class="mx-1" type="primary">用户名称</el-text>
|
||||
<el-input v-model="name" style="width: 240px" placeholder="请输入名称" />
|
||||
|
||||
<el-text class="mx-1" type="primary">用户名称</el-text>
|
||||
<el-input v-model="account" style="width: 240px" placeholder="请输入账号" />
|
||||
|
||||
<el-text class="mx-1" type="primary">用户密码</el-text>
|
||||
<el-input v-model="password" style="width: 240px" placeholder="请输入密码" />
|
||||
|
||||
<el-text class="mx-1" type="primary">手机号码</el-text>
|
||||
<el-input v-model="phone" style="width: 240px" placeholder="请输入手机号码" />
|
||||
|
||||
<el-text class="mx-1" type="primary">邮箱</el-text>
|
||||
<el-input v-model="email" style="width: 240px" placeholder="请输入邮箱" />
|
||||
|
||||
|
||||
<el-text class="mx-1" type="primary">用户性别</el-text>
|
||||
<el-input v-model="gender" style="width: 240px" placeholder="请输入性别" />
|
||||
|
||||
<el-text class="mx-1" type="primary">组织</el-text>
|
||||
<el-input v-model="organization" style="width: 240px" placeholder="请输入组织" />
|
||||
|
||||
<el-button type="primary" @click="addFinished">确认新增</el-button>
|
||||
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue'
|
||||
import userService from "../services/userService.js";
|
||||
|
||||
|
||||
const account=ref<String>('');
|
||||
const phone=ref<String>('');
|
||||
const email=ref<String>('');
|
||||
const name=ref<String>('');
|
||||
const gender=ref<String>('');
|
||||
const organization=ref<String>('');
|
||||
const password=ref<String>('');
|
||||
|
||||
|
||||
const addFinished = () => {
|
||||
const user = {
|
||||
account: account.value,
|
||||
name: name.value,
|
||||
organization: organization.value,
|
||||
password:password.value,
|
||||
email: email.value,
|
||||
gender: gender.value,
|
||||
phone: phone.value,
|
||||
};
|
||||
userService.addUser(user);
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@ -1,11 +0,0 @@
|
||||
<script setup>
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@ -1,46 +0,0 @@
|
||||
|
||||
<template>
|
||||
<el-text class="mx-1" type="primary">用户名称</el-text>
|
||||
<el-input v-model="name" style="width: 240px" placeholder="请输入名称" />
|
||||
|
||||
<el-text class="mx-1" type="primary">用户名称</el-text>
|
||||
<el-input v-model="account" style="width: 240px" placeholder="请输入账号" />
|
||||
|
||||
<el-text class="mx-1" type="primary">用户密码</el-text>
|
||||
<el-input v-model="password" style="width: 240px" placeholder="请输入密码" />
|
||||
|
||||
<el-text class="mx-1" type="primary">手机号码</el-text>
|
||||
<el-input v-model="phone" style="width: 240px" placeholder="请输入手机号码" />
|
||||
|
||||
<el-text class="mx-1" type="primary">邮箱</el-text>
|
||||
<el-input v-model="email" style="width: 240px" placeholder="请输入邮箱" />
|
||||
|
||||
|
||||
<el-text class="mx-1" type="primary">用户性别</el-text>
|
||||
<el-input v-model="gender" style="width: 240px" placeholder="请输入性别" />
|
||||
|
||||
<el-text class="mx-1" type="primary">组织</el-text>
|
||||
<el-input v-model="organization" style="width: 240px" placeholder="请输入组织" />
|
||||
|
||||
<el-button type="primary" @click="editFinished">确认修改</el-button>
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import userService from "../services/userService.js";
|
||||
import {ref} from "vue";
|
||||
|
||||
const account=ref<String>('');
|
||||
const phone=ref<String>('');
|
||||
const email=ref<String>('');
|
||||
const name=ref<String>('');
|
||||
const gender=ref<String>('');
|
||||
const organization=ref<String>('');
|
||||
const password=ref<String>('');
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@ -1,33 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-text class="mx-1" type="primary" style="margin-left: 30px; margin-top: -90px;">名称</el-text>
|
||||
<el-input v-model="account" style="width: 240px; margin-left: 50px; margin-top: -20px;" placeholder="请输入账号" />
|
||||
|
||||
<el-text class="mx-1" type="primary" style="margin-left: 30px; margin-top: 20px;">密码</el-text>
|
||||
<el-input v-model="password" style="width: 240px; margin-left: 50px; margin-top: 20px;" placeholder="请输入密码" />
|
||||
<el-button type="primary" style="padding: 20px; width: 90px; margin-top: 20px;" @click="handleLogin" >登录</el-button>
|
||||
<el-button type="primary" style="padding: 20px; width: 90px; margin-left: 20px; margin-top: 20px" @click="handleRegister">注册</el-button>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
<script setup>
|
||||
import authenticationService from "../services/authenticationService.js";
|
||||
import {useRouter} from "vue-router";
|
||||
import {ref} from "vue";
|
||||
const account=ref('');
|
||||
const password=ref('');
|
||||
const router=useRouter();
|
||||
|
||||
const handleLogin = ()=>{
|
||||
authenticationService.login(account.value,password.value).then(res=>{});
|
||||
}
|
||||
|
||||
const handleRegister = () => {
|
||||
router.push('/register');
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
</style>
|
||||
@ -1,81 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
|
||||
<el-text class="mx-1" type="primary" style="margin-left: 30px; margin-top: 20px;">名称</el-text>
|
||||
<el-input v-model="name" style="width: 240px; margin-left: 50px; margin-top: 20px;" placeholder="请输入名称" />
|
||||
|
||||
<el-text class="mx-1" type="primary" style="margin-left: 30px; margin-top: 20px;">账号</el-text>
|
||||
<el-input v-model="account" style="width: 240px; margin-left: 50px; margin-top: 20px;" placeholder="请输入账号" />
|
||||
|
||||
<el-text class="mx-1" type="primary" style="margin-left: 30px; margin-top: 20px;">密码</el-text>
|
||||
<el-input v-model="password" style="width: 240px; margin-left: 50px; margin-top: 20px;" placeholder="请输入密码" />
|
||||
|
||||
<el-text class="mx-1" type="primary" style="margin-left: 30px; margin-top: 20px;">性别</el-text>
|
||||
<el-input v-model="gender" style="width: 240px; margin-left: 50px; margin-top: 20px;" placeholder="请输入性别" />
|
||||
|
||||
<el-text class="mx-1" type="primary" style="margin-left: 30px; margin-top: 20px;">电话号码</el-text>
|
||||
<el-input v-model="phone" style="width: 240px; margin-left: 50px; margin-top: 20px;" placeholder="请输入电话号码" />
|
||||
|
||||
<el-text class="mx-1" type="primary" style="margin-left: 30px; margin-top: 20px;">邮箱</el-text>
|
||||
<el-input v-model="email" style="width: 240px; margin-left: 50px; margin-top: 20px;" placeholder="请输入邮箱" />
|
||||
|
||||
<el-text class="mx-1" type="primary" style="margin-left: 30px; margin-top: 20px;">组织</el-text>
|
||||
<el-input v-model="organization" style="width: 240px; margin-left: 50px; margin-top: 20px;" placeholder="请输入组织" />
|
||||
|
||||
|
||||
|
||||
<el-button plain @click="open">注册</el-button>
|
||||
<!-- style="padding: 20px; width: 90px; margin-left: 20px; margin-top: 20px;"-->
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
import { ElMessage, ElMessageBox } from 'element-plus'
|
||||
import type { Action } from 'element-plus'
|
||||
import { useRouter } from 'vue-router';
|
||||
import authenticationService from "../services/authenticationService.js";
|
||||
|
||||
const name = ref<string>('');
|
||||
const password = ref<string>('');
|
||||
const gender = ref<string>('');
|
||||
const phone = ref<string>('');
|
||||
const email = ref<string>('');
|
||||
const organization = ref<string>('');
|
||||
const account = ref<String>('');
|
||||
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
|
||||
const open = () => {
|
||||
const user = {
|
||||
account: account.value,
|
||||
password: password.value,
|
||||
name: name.value,
|
||||
organization: organization.value,
|
||||
email: email.value,
|
||||
gender: gender.value,
|
||||
phone: phone.value,
|
||||
};
|
||||
authenticationService.register(user).then(res => {
|
||||
alert(res);
|
||||
});
|
||||
ElMessageBox.alert('注册成功', '提示', {
|
||||
confirmButtonText: 'OK',
|
||||
callback: (action: Action) => {
|
||||
ElMessage({
|
||||
type: 'info',
|
||||
message: `action: ${action}`,
|
||||
});
|
||||
// 跳转到 /login 页面
|
||||
router.push('/login');
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
@ -1,11 +0,0 @@
|
||||
<script setup>
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<router-view></router-view>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@ -1,405 +0,0 @@
|
||||
<!--<template>-->
|
||||
<!-- <div>-->
|
||||
<!-- <router-view></router-view>-->
|
||||
|
||||
<!-- <el-row :gutter="20">-->
|
||||
<!-- <el-col :span="6">-->
|
||||
<!-- <el-input v-model="organization1" placeholder="请输入组织"></el-input>-->
|
||||
<!-- </el-col>-->
|
||||
<!-- <el-col :span="6">-->
|
||||
<!-- <el-input v-model="name1" placeholder="请输入用户名"></el-input>-->
|
||||
<!-- </el-col>-->
|
||||
<!-- <el-col :span="6">-->
|
||||
<!-- <el-input v-model="phone1" placeholder="请输入手机号"></el-input>-->
|
||||
<!-- </el-col>-->
|
||||
<!-- </el-row>-->
|
||||
|
||||
|
||||
<!-- <el-row :gutter="20" class="mt-2">-->
|
||||
<!-- <el-col :span="24">-->
|
||||
<!-- <el-button type="primary" @click="handleAdd">新增</el-button>-->
|
||||
<!-- <el-button plain @click="dialogVisible=true">修改</el-button>-->
|
||||
<!-- <el-button type="danger" @click="handleDelete">删除</el-button>-->
|
||||
<!-- <el-button type="primary" @clcik="handleSearch">查询</el-button>-->
|
||||
<!-- </el-col>-->
|
||||
<!-- </el-row>-->
|
||||
|
||||
<!-- <el-table :data="tableData" style="width: 100%" class="mt-2" @selection-change="handleSelectionChange">-->
|
||||
<!-- <el-table-column type="selection" width="55"></el-table-column>-->
|
||||
<!-- <el-table-column prop="id" label="用户编号" width="120"></el-table-column>-->
|
||||
<!-- <el-table-column prop="account" label="账号" width="120"></el-table-column>-->
|
||||
<!-- <el-table-column prop="name" label="名称" width="120"></el-table-column>-->
|
||||
<!-- <el-table-column prop="organization" label="组织" width="120"></el-table-column>-->
|
||||
<!-- <el-table-column prop="phone" label="手机号" width="150"></el-table-column>-->
|
||||
<!-- <el-table-column prop="email" label="邮箱" width="180"></el-table-column>-->
|
||||
<!-- <el-table-column prop="gender" label="性别" width="180"></el-table-column>-->
|
||||
<!-- </el-table>-->
|
||||
<!-- <el-dialog-->
|
||||
<!-- v-model="dialogVisible"-->
|
||||
<!-- title="Tips"-->
|
||||
<!-- width="500"-->
|
||||
<!-- :before-close="handleClose"-->
|
||||
<!-- >-->
|
||||
<!-- <span>修改用户</span>-->
|
||||
<!-- <template #footer>-->
|
||||
|
||||
<!-- <div>-->
|
||||
<!-- <el-form :model="formData">-->
|
||||
<!-- <el-form-item label="姓名">-->
|
||||
<!-- <el-input v-model="formData.name" ></el-input>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- <el-form-item label="账号">-->
|
||||
<!-- <el-input v-model="formData.account"></el-input>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- <el-form-item label="组织">-->
|
||||
<!-- <el-input v-model="formData.organization"></el-input>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- <el-form-item label="邮箱">-->
|
||||
<!-- <el-input v-model="formData.email"></el-input>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- <el-form-item label="性别">-->
|
||||
<!-- <el-input v-model="formData.gender"></el-input>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- <el-form-item label="电话">-->
|
||||
<!-- <el-input v-model="formData.phone"></el-input>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- <el-form-item label="密码">-->
|
||||
<!-- <el-input type="password" v-model="formData.password"></el-input>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-form>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<!-- <div class="dialog-footer">-->
|
||||
<!-- <el-button @click="dialogVisible = false">关闭</el-button>-->
|
||||
<!-- <el-button type="primary" @click="editFinished" >-->
|
||||
<!-- 确认修改-->
|
||||
<!-- </el-button>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<!-- </template>-->
|
||||
<!-- </el-dialog>-->
|
||||
<!-- </div>-->
|
||||
|
||||
|
||||
<!--</template>-->
|
||||
|
||||
<!--<script lang="ts">-->
|
||||
|
||||
<!--import userService from "../services/userService.js";-->
|
||||
<!--import { onMounted,ref,defineComponent } from 'vue';-->
|
||||
|
||||
<!--interface User {-->
|
||||
<!-- id: number;-->
|
||||
<!-- account: string;-->
|
||||
<!-- name: string;-->
|
||||
<!-- organization: string;-->
|
||||
<!-- phone: string;-->
|
||||
<!-- email: string;-->
|
||||
<!-- gender:string;-->
|
||||
<!--}-->
|
||||
|
||||
<!--export default defineComponent({-->
|
||||
<!-- setup(){-->
|
||||
<!-- const organization1=ref('')-->
|
||||
<!-- const name1=ref('')-->
|
||||
<!-- const phone1=ref('')-->
|
||||
<!-- const tableData = ref<User[]>([]);-->
|
||||
<!-- const selectedRows = ref([]);-->
|
||||
|
||||
<!-- const formData = ref({-->
|
||||
<!-- account: '',-->
|
||||
<!-- name: '',-->
|
||||
<!-- organization: '',-->
|
||||
<!-- email: '',-->
|
||||
<!-- gender: '',-->
|
||||
<!-- phone: '',-->
|
||||
<!-- password: '',-->
|
||||
<!-- });-->
|
||||
|
||||
<!-- const user=ref({-->
|
||||
<!-- account:formData.value.account,-->
|
||||
<!-- name:formData.value.name,-->
|
||||
<!-- organization:formData.value.organization,-->
|
||||
<!-- phone:formData.value.phone,-->
|
||||
<!-- email:formData.value.email,-->
|
||||
<!-- gender:formData.value.gender,-->
|
||||
<!-- password:formData.value.password-->
|
||||
<!-- });-->
|
||||
|
||||
|
||||
<!-- const dialogVisible = ref(false)-->
|
||||
|
||||
<!-- const handleClose = (done: () => void) => {-->
|
||||
<!-- done();-->
|
||||
<!-- }-->
|
||||
|
||||
<!-- const fetchData = async () =>{-->
|
||||
<!-- try {-->
|
||||
<!-- const data = await userService.getAll();-->
|
||||
<!-- tableData.value = data; // 这里直接赋值给 ref 变量的 value 属性-->
|
||||
<!-- } catch (error) {-->
|
||||
<!-- console.error("Error fetching organization:", error);-->
|
||||
<!-- }-->
|
||||
<!-- }-->
|
||||
|
||||
<!-- const selectedRow=ref(null);-->
|
||||
|
||||
<!-- const handleSelectionChange = (rows) => {-->
|
||||
<!-- if (rows.length === 1) {-->
|
||||
<!-- selectedRow.value = { ...rows[0] }; // 将选中的行数据复制给 selectedRow-->
|
||||
<!-- formData.value={...selectedRow.value};-->
|
||||
<!-- } else {-->
|
||||
<!-- selectedRow.value = null;-->
|
||||
<!-- }-->
|
||||
<!-- };-->
|
||||
|
||||
<!-- const editFinished=()=>{-->
|
||||
<!-- console.log("aaa"+formData);-->
|
||||
<!-- userService.update(formData);-->
|
||||
<!-- dialogVisible.value = false;-->
|
||||
<!-- }-->
|
||||
|
||||
<!-- const handleAdd = () =>{-->
|
||||
<!-- location.href='/addUser';-->
|
||||
<!-- }-->
|
||||
|
||||
<!-- const handleDelete=()=>{-->
|
||||
|
||||
<!-- }-->
|
||||
<!-- const handleSearch=()=>{-->
|
||||
|
||||
<!-- }-->
|
||||
<!-- onMounted(() => {-->
|
||||
<!-- fetchData();-->
|
||||
<!-- });-->
|
||||
|
||||
<!-- return {-->
|
||||
<!-- tableData,-->
|
||||
<!-- handleAdd,-->
|
||||
<!-- formData,-->
|
||||
<!-- dialogVisible,-->
|
||||
<!-- handleClose,-->
|
||||
<!-- selectedRows,-->
|
||||
<!-- handleSelectionChange,-->
|
||||
<!-- editFinished,-->
|
||||
<!-- user,-->
|
||||
<!-- handleDelete,-->
|
||||
<!-- phone1,-->
|
||||
<!-- organization1,-->
|
||||
<!-- name1,-->
|
||||
<!-- handleSearch-->
|
||||
<!-- }-->
|
||||
<!-- }-->
|
||||
<!--});-->
|
||||
|
||||
<!--</script>-->
|
||||
|
||||
<!--<style >-->
|
||||
<!--.mt-2 {-->
|
||||
<!-- margin-top: 20px;-->
|
||||
<!--}-->
|
||||
<!--</style>-->
|
||||
<template>
|
||||
<div>
|
||||
<router-view></router-view>
|
||||
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="6">
|
||||
<el-input v-model="searchOrganization" placeholder="请输入组织"></el-input>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-input v-model="searchName" placeholder="请输入用户名"></el-input>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-input v-model="searchPhone" placeholder="请输入手机号"></el-input>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="20" class="mt-2">
|
||||
<el-col :span="24">
|
||||
<el-button type="primary" @click="handleAdd">新增</el-button>
|
||||
<el-button plain @click="dialogVisible=true">修改</el-button>
|
||||
<el-button type="danger" @click="handleDelete">删除</el-button>
|
||||
<el-button type="primary" @click="handleSearch">查询</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-table :data="tableData" style="width: 100%" class="mt-2" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55"></el-table-column>
|
||||
<el-table-column prop="id" label="用户编号" width="120"></el-table-column>
|
||||
<el-table-column prop="account" label="账号" width="120"></el-table-column>
|
||||
<el-table-column prop="name" label="名称" width="120"></el-table-column>
|
||||
<el-table-column prop="organization" label="组织" width="120"></el-table-column>
|
||||
<el-table-column prop="phone" label="手机号" width="150"></el-table-column>
|
||||
<el-table-column prop="email" label="邮箱" width="180"></el-table-column>
|
||||
<el-table-column prop="gender" label="性别" width="180"></el-table-column>
|
||||
</el-table>
|
||||
|
||||
<el-dialog v-model="dialogVisible" title="Tips" width="500" :before-close="handleClose">
|
||||
<span>修改用户</span>
|
||||
<template #footer>
|
||||
<div>
|
||||
<el-form :model="formData">
|
||||
<el-form-item label="姓名">
|
||||
<el-input v-model="formData.name"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="账号">
|
||||
<el-input v-model="formData.account"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="组织">
|
||||
<el-input v-model="formData.organization"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="邮箱">
|
||||
<el-input v-model="formData.email"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="性别">
|
||||
<el-input v-model="formData.gender"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="电话">
|
||||
<el-input v-model="formData.phone"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="密码">
|
||||
<el-input type="password" v-model="formData.password"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">关闭</el-button>
|
||||
<el-button type="primary" @click="editFinished">确认修改</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import userService from "../services/userService.js";
|
||||
import { onMounted, ref, defineComponent } from 'vue';
|
||||
|
||||
interface User {
|
||||
id: number;
|
||||
account: string;
|
||||
name: string;
|
||||
organization: string;
|
||||
phone: string;
|
||||
email: string;
|
||||
gender: string;
|
||||
}
|
||||
|
||||
export default defineComponent({
|
||||
setup() {
|
||||
const searchOrganization = ref('');
|
||||
const searchName = ref('');
|
||||
const searchPhone = ref('');
|
||||
const tableData = ref<User[]>([]);
|
||||
const selectedRows = ref<User[]>([]);
|
||||
const formData = ref({
|
||||
id: null,
|
||||
account: '',
|
||||
name: '',
|
||||
organization: '',
|
||||
email: '',
|
||||
gender: '',
|
||||
phone: '',
|
||||
password: '',
|
||||
});
|
||||
|
||||
const dialogVisible = ref(false);
|
||||
|
||||
const handleClose = (done: () => void) => {
|
||||
done();
|
||||
};
|
||||
|
||||
const fetchData = async () => {
|
||||
try {
|
||||
const data = await userService.getAll();
|
||||
tableData.value = data;
|
||||
} catch (error) {
|
||||
console.error("Error fetching organization:", error);
|
||||
}
|
||||
};
|
||||
|
||||
const handleSelectionChange = (rows) => {
|
||||
selectedRows.value = rows;
|
||||
if (rows.length === 1) {
|
||||
formData.value = { ...rows[0] };
|
||||
} else {
|
||||
formData.value = {
|
||||
id: null,
|
||||
account: '',
|
||||
name: '',
|
||||
organization: '',
|
||||
email: '',
|
||||
gender: '',
|
||||
phone: '',
|
||||
password: '',
|
||||
};
|
||||
}
|
||||
};
|
||||
|
||||
const editFinished = async () => {
|
||||
try {
|
||||
await userService.update(formData.value);
|
||||
dialogVisible.value = false;
|
||||
fetchData();
|
||||
} catch (error) {
|
||||
console.error("Error updating user:", error);
|
||||
}
|
||||
};
|
||||
|
||||
const handleAdd = () => {
|
||||
location.href = '/addUser';
|
||||
};
|
||||
|
||||
const handleDelete = async () => {
|
||||
try {
|
||||
const ids = selectedRows.value.map(row => row.id);
|
||||
await userService.delete(ids);
|
||||
fetchData();
|
||||
} catch (error) {
|
||||
console.error("Error deleting users:", error);
|
||||
}
|
||||
};
|
||||
|
||||
const handleSearch = async () => {
|
||||
try {
|
||||
const data = await userService.search({
|
||||
organization: searchOrganization.value,
|
||||
name: searchName.value,
|
||||
phone: searchPhone.value,
|
||||
});
|
||||
tableData.value = data;
|
||||
} catch (error) {
|
||||
console.error("Error searching users:", error);
|
||||
}
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
fetchData();
|
||||
});
|
||||
|
||||
return {
|
||||
tableData,
|
||||
handleAdd,
|
||||
formData,
|
||||
dialogVisible,
|
||||
handleClose,
|
||||
selectedRows,
|
||||
handleSelectionChange,
|
||||
editFinished,
|
||||
handleDelete,
|
||||
searchPhone,
|
||||
searchOrganization,
|
||||
searchName,
|
||||
handleSearch
|
||||
};
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.mt-2 {
|
||||
margin-top: 20px;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user