From c996fe40a298a0f5e10e51f768a225ef8b900735 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?lsd=E4=B8=8D=E6=98=AF=E6=B2=99=E9=9B=95?=
 <a18292577468@163.com>
Date: Sat, 29 Jun 2024 16:53:03 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B3=A8=E5=86=8C=E7=99=BB=E5=BD=95=E5=AE=8C?=
 =?UTF-8?q?=E6=88=90=EF=BC=8C=E7=AE=A1=E7=90=86=E5=91=98=E5=A2=9E=E6=9F=A5?=
 =?UTF-8?q?=E5=AE=8C=E6=88=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                          |   2 +-
 src/App.vue                           |  12 +-
 src/main.js                           |  26 +-
 src/router/index.js                   |  58 +++-
 src/router/userManagement.js          |   1 +
 src/services/authenticationService.js |  44 +++
 src/services/userService.js           |  58 ++++
 src/store/authentication.js           |  11 +-
 src/test.vue                          | 119 ++++++++
 src/view/AddTenant.vue                |  11 +
 src/view/AddUser.vue                  |  59 ++++
 src/view/EditTenant.vue               |  11 +
 src/view/EditUser.vue                 |  46 +++
 src/view/Home.vue                     |  33 +++
 src/view/Register.vue                 |  81 ++++++
 src/view/TenantManagement.vue         |  11 +
 src/view/UserManagement.vue           | 405 ++++++++++++++++++++++++++
 17 files changed, 957 insertions(+), 31 deletions(-)
 create mode 100644 src/test.vue
 create mode 100644 src/view/AddTenant.vue
 create mode 100644 src/view/AddUser.vue
 create mode 100644 src/view/EditTenant.vue
 create mode 100644 src/view/EditUser.vue
 create mode 100644 src/view/Home.vue
 create mode 100644 src/view/Register.vue
 create mode 100644 src/view/TenantManagement.vue
 create mode 100644 src/view/UserManagement.vue

diff --git a/package.json b/package.json
index e49cf53..7543975 100644
--- a/package.json
+++ b/package.json
@@ -9,10 +9,10 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "axios": "^1.7.2",
     "element-plus": "^2.7.6",
     "vue": "^3.4.29",
     "vue-router": "^4.4.0",
-    "axios": "^1.7.2",
     "vuex": "^4.1.0"
   },
   "devDependencies": {
diff --git a/src/App.vue b/src/App.vue
index 2554396..58e057f 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,10 +1,8 @@
 <template>
-  <router-view></router-view>
+  <div>
+    <router-view></router-view>
+  </div>
 </template>
 
-<script setup>
-import 'element-plus/dist/index.css'
-</script>
-
-<!--请不要对App.vue进行修改，请采用在views的对应目录下新建自己需要的文件
-并通过在/router下的对应模块名称的js中引入路由的方式来显示自己的页面-->
\ No newline at end of file
+<style scoped>
+</style>
diff --git a/src/main.js b/src/main.js
index 36d9cc5..afdbb60 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,14 +1,16 @@
-import { createApp } from 'vue'
-import './style.css'
-import App from './App.vue'
-import ElementPlus from 'element-plus'
-import 'element-plus/dist/index.css'
 
-import router from './router'
-import store from './store'
+    import './style.css'
+    import 'element-plus/dist/index.css'
+    import router from './router'
+    import store from './store'
+
+    import { createApp } from 'vue'
+    import ElementPlus from 'element-plus'
+    import 'element-plus/dist/index.css'
+    import App from './App.vue'
+
+    const app = createApp(App)
+    app.use(ElementPlus)
+    app.use(router)
+    app.use(store).mount('#app')
 
-const app = createApp(App)
-app.use(ElementPlus)
-app.use(router)
-app.use(store)
-app.mount('#app')
diff --git a/src/router/index.js b/src/router/index.js
index ab3d3c6..e849c72 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -6,17 +6,55 @@ import meetingManagementRoutes from './meetingManagement'
 import newsManagementRoutes from './newsManagement'
 import organizationManagementRoutes from './organizationManagement'
 import userManagementRoutes from './userManagement'
-
-// 请不要直接修改本文件，使用在router下的对应模块名称的js中引入路由的方式来代替->
-
+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";
 const routes = [
-    { path: '/', component: HelloWorld, meta: {"msg": "HeIl⚪ W0rId!"}},
-    ...authenticationRoutes,
-    ...courseManagementRoutes,
-    ...meetingManagementRoutes,
-    ...newsManagementRoutes,
-    ...organizationManagementRoutes,
-    ...userManagementRoutes,
+    { 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,
 ]
 
 const router = createRouter({
diff --git a/src/router/userManagement.js b/src/router/userManagement.js
index 54c169c..2162b21 100644
--- a/src/router/userManagement.js
+++ b/src/router/userManagement.js
@@ -6,4 +6,5 @@ export default [
     // { path: '/users', component: UserList },
     // { path: '/users/:id', component: UserDetail },
     // { path: '/users/:id/edit', component: UserEdit }
+
 ]
diff --git a/src/services/authenticationService.js b/src/services/authenticationService.js
index e69de29..2f51654 100644
--- a/src/services/authenticationService.js
+++ b/src/services/authenticationService.js
@@ -0,0 +1,44 @@
+    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;
+                });
+        }
+
+    }
\ No newline at end of file
diff --git a/src/services/userService.js b/src/services/userService.js
index e69de29..038b4c0 100644
--- a/src/services/userService.js
+++ b/src/services/userService.js
@@ -0,0 +1,58 @@
+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";
+            });
+    }
+
+}
\ No newline at end of file
diff --git a/src/store/authentication.js b/src/store/authentication.js
index 77ff04e..e85eb87 100644
--- a/src/store/authentication.js
+++ b/src/store/authentication.js
@@ -26,5 +26,14 @@ export default {
     state,
     mutations,
     actions,
-    getters
+    getters,
+
+    login(){
+
+    },
+
+
+    register(){
+
+    }
 }
diff --git a/src/test.vue b/src/test.vue
new file mode 100644
index 0000000..aa246bf
--- /dev/null
+++ b/src/test.vue
@@ -0,0 +1,119 @@
+<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>
diff --git a/src/view/AddTenant.vue b/src/view/AddTenant.vue
new file mode 100644
index 0000000..f79cdd8
--- /dev/null
+++ b/src/view/AddTenant.vue
@@ -0,0 +1,11 @@
+<script setup>
+
+</script>
+
+<template>
+
+</template>
+
+<style scoped>
+
+</style>
\ No newline at end of file
diff --git a/src/view/AddUser.vue b/src/view/AddUser.vue
new file mode 100644
index 0000000..34cb978
--- /dev/null
+++ b/src/view/AddUser.vue
@@ -0,0 +1,59 @@
+
+<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>
\ No newline at end of file
diff --git a/src/view/EditTenant.vue b/src/view/EditTenant.vue
new file mode 100644
index 0000000..f79cdd8
--- /dev/null
+++ b/src/view/EditTenant.vue
@@ -0,0 +1,11 @@
+<script setup>
+
+</script>
+
+<template>
+
+</template>
+
+<style scoped>
+
+</style>
\ No newline at end of file
diff --git a/src/view/EditUser.vue b/src/view/EditUser.vue
new file mode 100644
index 0000000..55472ce
--- /dev/null
+++ b/src/view/EditUser.vue
@@ -0,0 +1,46 @@
+
+<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>
\ No newline at end of file
diff --git a/src/view/Home.vue b/src/view/Home.vue
new file mode 100644
index 0000000..4ee6cc4
--- /dev/null
+++ b/src/view/Home.vue
@@ -0,0 +1,33 @@
+<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>
diff --git a/src/view/Register.vue b/src/view/Register.vue
new file mode 100644
index 0000000..6252d8e
--- /dev/null
+++ b/src/view/Register.vue
@@ -0,0 +1,81 @@
+<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>
diff --git a/src/view/TenantManagement.vue b/src/view/TenantManagement.vue
new file mode 100644
index 0000000..5f8e094
--- /dev/null
+++ b/src/view/TenantManagement.vue
@@ -0,0 +1,11 @@
+<script setup>
+
+</script>
+
+<template>
+  <router-view></router-view>
+</template>
+
+<style scoped>
+
+</style>
\ No newline at end of file
diff --git a/src/view/UserManagement.vue b/src/view/UserManagement.vue
new file mode 100644
index 0000000..af0b344
--- /dev/null
+++ b/src/view/UserManagement.vue
@@ -0,0 +1,405 @@
+<!--<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>