1

src/api/system/dept/index.ts

@@ -1,4 +1,5 @@
 import request from '@/config/axios'
+import { UserVO } from '@/api/system/user'
 
 export interface DeptVO {
   id?: number
@@ -10,6 +11,10 @@ export interface DeptVO {
   phone: string
   email: string
   createTime: Date
+  user: UserVO
+  // 导师信息
+  supervisorId: number
+  supervisor: string
 }
 
 // 查询部门（精简)列表
@@ -29,6 +34,10 @@ export const getDept = async (id: number) => {
 
 // 查询部门详情
 
+// 查询登录导师的工作间详情
+export const getUserDept = async () => {
+  return await request.get({ url: '/system/dept/GetUserDept' })
+}
 
 // 新增部门
 export const createDept = async (data: DeptVO) => {

src/api/system/user/profile.ts

@@ -48,6 +48,9 @@ export interface UserProfileUpdateReqVO {
 export const getUserProfile = () => {
   return request.get({ url: '/system/user/profile/get' })
 }
+// const a = getUserProfile()
+// console.log('a',a);
+
 
 // 修改用户个人信息
 export const updateUserProfile = (data: UserProfileUpdateReqVO) => {

src/views/Profile/components/BasicInfo.vue

@@ -71,6 +71,7 @@ const schema = reactive<FormSchema[]>([
     value: 0
   }
 ])
+
 const formRef = ref<FormExpose>() // 表单 Ref
 const submit = () => {
   const elForm = unref(formRef)?.getElFormRef()

src/views/system/workroomTeacher/dept/components/UserInfo.vue

@@ -0,0 +1,107 @@
+<template>
+  <Form ref="formRef" :labelWidth="200" :rules="rules" :schema="schema">
+    <template #sex="form">
+      <el-radio-group v-model="form['sex']">
+        <el-radio :value="1">{{ t('index.user.man') }}</el-radio>
+        <el-radio :value="2">{{ t('index.user.woman') }}</el-radio>
+      </el-radio-group>
+    </template>
+  </Form>
+  <div style="text-align: center">
+    <XButton :title="t('common.save')" type="primary" @click="submit()" />
+    <XButton :title="t('common.reset')" type="danger" @click="init()" />
+  </div>
+</template>
+
+<script lang="ts" setup>
+import type { FormRules } from 'element-plus'
+import { FormSchema } from '@/types/form'
+import type { FormExpose } from '@/components/Form'
+import { useUserStore } from '@/store/modules/user'
+import { 
+  getDept,
+  updateDept,
+  DeptVO
+} from '@/api/system/dept/index'
+import { ref, reactive, onMounted, defineOptions, unref } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { useMessage } from '@/hooks/web/useMessage'
+
+defineOptions({ name: 'UserInfo' })
+
+const { t } = useI18n()
+const message = useMessage()
+const userStore = useUserStore()
+
+// const data = ref<DeptVO | null>(null)
+
+const rules = reactive<FormRules>({
+  nickname: [{ required: true, message: t('index.user.user.nickname'), trigger: 'blur' }],
+  email: [
+    { required: true, message: t('index.user.user.mail'), trigger: 'blur' },
+    {
+      type: 'email',
+      message: t('index.user.user.truemail'),
+      trigger: ['blur', 'change']
+    }
+  ],
+  mobile: [
+    { required: true, message: t('index.user.user.phone'), trigger: 'blur' },
+    {
+      pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
+      message: t('index.user.user.truephone'),
+      trigger: 'blur'
+    }
+  ]
+})
+
+const schema = reactive<FormSchema[]>([
+  {
+    field: 'user.nickname',
+    label: t('res.user.nickname'),
+    component: 'Input'
+  },
+  {
+    field: 'user.mobile',
+    label: t('index.user.user.mobile'),
+    component: 'Input'
+  },
+  {
+    field: 'email',
+    label: t('index.user.user.email'),
+    component: 'Input'
+  },
+  {
+    field: 'sex',
+    label: t('index.user.user.sex'),
+    component: 'Radio'
+  }
+])
+
+const formRef = ref<FormExpose>()
+
+const submit = async () => {
+  const elForm = unref(formRef)?.getElFormRef()
+  if (!elForm) return
+  elForm.validate(async (valid) => {
+    if (valid) {
+      const formData = unref(formRef)?.formModel as DeptVO
+      console.log('提交的数据:', formData)
+      await updateDept(formData)
+      message.success(t('common.updateSuccess'))
+      userStore.setUserNicknameAction(formData.user.nickname)
+    }
+  })
+}
+
+const init = async () => {
+  const res = await getDept(114)
+  console.log('获取的数据:', res)
+  unref(formRef)?.setValues(res)
+  return res
+}
+
+onMounted(async () => {
+  await init()
+})
+</script>

src/views/system/workroomTeacher/dept/components/index.ts

@@ -0,0 +1,3 @@
+import UserInfo from './UserInfo.vue'
+
+export { UserInfo }

src/views/system/workroomTeacher/dept/index.vue

@@ -1,105 +1,279 @@
 <template>
-  <el-card class="workspace-info">
-    <div class="user-info">
-      <div class="info-item">
-        <span class="info-label">负责人邮箱：</span>
-        <span>{{ userInfo.email }}</span>
-      </div>
-      <div class="info-item">
-        <span class="info-label">所属角色：</span>
-        <span>{{ userInfo.roles.join(', ') }}</span>
-      </div>
-      <div class="info-item">
-        <span class="info-label">所属部门：</span>
-        <span>{{ userInfo.department }}</span>
-      </div>
-      <div class="info-item">
-        <span class="info-label">手机号码：</span>
-        <span>{{ userInfo.phone }}</span>
-      </div>
-      <div class="info-item">
-        <span class="info-label">用户名称：</span>
-        <span>{{ userInfo.name }}</span>
-      </div>
-      <div class="info-item">
-        <span class="info-label">所属岗位：</span>
-        <span>{{ userInfo.position }}</span>
-      </div>
-      <div class="info-item">
-        <span class="info-label">创建日期：</span>
-        <span>{{ userInfo.creationDate }}</span>
+  <el-card class="workspace-info card-border mb-2">
+    <div class="workspace-name">
+      <div class="card-header">
+        <span>{{ form.name }}</span>
       </div>
     </div>
-    <el-divider>负责人信息</el-divider>
-    <div class="personal-info">
-      <el-form ref="form" :model="form" label-width="80px">
-        <el-form-item label="手机号码">
-          <el-input v-model="form.phone"/>
+  </el-card>
+  <div class="flex">
+    <el-card class="workspace-info w-1/2">
+      <template #header>
+        <div class="card-header">
+          <span>{{ t(form.title1) }}</span>
+        </div>
+      </template>
+      <el-form ref="formRef" :model="form" label-width="100px" :rules="rules">
+        <!-- <el-form-item label="负责人名称" prop="nickname">
+          <el-input v-model="form1.nickname"/>
+        </el-form-item> -->
+        <el-form-item label="负责人名称" prop="supervisorId">
+            <el-select
+              v-model="form.supervisor"
+              @change="handleSupervisorChange"
+              placeholder="请选择导师名称"
+              clearable
+              filterable
+            >
+              <el-option
+                v-for="supervisor in supervisors"
+                :key="supervisor.id"
+                :label="supervisor.nickname"
+                :value="supervisor.id"
+              />
+            </el-select>
         </el-form-item>
-        <el-form-item label="用户昵称">
-          <el-input v-model="form.nickname"/>
+        <el-form-item label="负责人电话" prop="phone">
+          <el-input v-model="form.phone"/>
         </el-form-item>
-        <el-form-item label="用户邮箱">
+        <el-form-item label="负责人邮箱" prop="email">
           <el-input v-model="form.email"/>
         </el-form-item>
-        <el-form-item label="性别">
-          <el-radio-group v-model="form.gender">
-            <el-radio label="male">男</el-radio>
-            <el-radio label="female">女</el-radio>
-          </el-radio-group>
+        <!-- <el-form-item>
+          <el-button type="primary" @click="submit">保存</el-button>
+          <el-button type="danger" @click="init">重置</el-button>
+        </el-form-item> -->
+      </el-form>
+    </el-card>
+    <el-card class="workspace-info ml-3 w-1/2">
+      <template #header>
+        <div class="card-header">
+          <span>{{ t(form.title2) }}</span>
+        </div>
+      </template>
+      <el-form ref="formRef" :model="form" label-width="100px" :rules="rules">
+        <el-form-item label="工作间地址" prop="address">
+          <el-input v-model="form.address"/>
+        </el-form-item>
+        <el-form-item label="工作间名称" prop="name">
+          <el-input v-model="form.name"/>
+        </el-form-item>
+        <el-form-item label="导师人数" prop="supervisorNum">
+          <el-input v-model.number="form.supervisorNum"/>
+        </el-form-item>
+        <el-form-item label="学生人数" prop="studentNum">
+          <el-input v-model.number="form.studentNum"/>
         </el-form-item>
-        <el-form-item>
-          <el-button type="primary" @click="saveInfo">保存</el-button>
+        <el-form-item label="工作间简介" prop="description">
+          <el-input type="textarea" v-model="form.description"/>
         </el-form-item>
+        <el-form-item label="成果展示" prop="achievement">
+          <el-input type="textarea" v-model="form.achievement"/>
+        </el-form-item>
+        <!-- <el-form-item>
+          <el-button type="primary" @click="submit">保存</el-button>
+          <el-button type="danger" @click="init">重置</el-button>
+        </el-form-item> -->
       </el-form>
-    </div>
+    </el-card>
+  </div>
+  <el-card class="card-border w-full mt-2">
+      <el-form ref="formRef" :model="form" :rules="rules" style="display: flex; justify-content: center;">
+      <el-form-item>
+        <el-button type="primary" @click="submit">保存</el-button>
+        <el-button type="danger" @click="init" >重置</el-button>
+      </el-form-item>
+    </el-form>
   </el-card>
 </template>
 
 <script lang="ts">
-import { defineComponent, reactive, ref } from 'vue';
+import { defineComponent, reactive, ref, onMounted } from 'vue';
+import type { FormRules } from 'element-plus';
+import { useI18n } from 'vue-i18n';
+import { useMessage } from '@/hooks/web/useMessage';
+import { updateDept, DeptVO, getUserDept } from '@/api/system/dept/index';
+import * as UserApi from '@/api/system/user'
 
 export default defineComponent({
   setup() {
+    const { t } = useI18n();
+    const message = useMessage();
+    const formRef = ref();
+
     const form = reactive({
-      phone: '18818260277',
-      nickname: 'admin',
-      email: 'aoteman@126.com',
-      gender: 'male'
+      title: '',
+      title1: '负责人信息',
+      title2: '工作间信息',
+
+      nickname: '',
+      phone: '',
+      email: '',
+      supervisorId: '',
+      supervisor: '',
+
+      name: '',
+      supervisorNum: '',
+      studentNum: '',
+      description: '',
+      achievement: '',
+      address: ''
     });
 
-    const userInfo = reactive({
-      email: 'aoteman@126.com',
-      roles: ['超级管理员', '普通角色'],
-      department: '董事长,项目经理',
-      phone: '18818260277',
-      name: 'admin',
-      position: '基本资料',
-      creationDate: '2020-01-05 17:03:47'
+    // 表单校验规则
+    const rules = reactive<FormRules>({
+      nickname: [
+        { required: true, message: '请输入负责人名称', trigger: 'blur' }
+      ],
+      phone: [
+        { required: true, message: '请输入负责人电话', trigger: 'blur' },
+        {
+          pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
+          message: '请输入正确的手机号码',
+          trigger: 'blur'
+        }
+      ],
+      email: [
+        { required: true, message: '请输入邮箱', trigger: 'blur' },
+        {
+          type: 'email',
+          message: '请输入正确的邮箱格式',
+          trigger: ['blur', 'change']
+        }
+      ],
+      address: [
+        { required: true, message: '请输入工作间地址', trigger: 'blur' }
+      ],
+      name: [
+        { required: true, message: '请输入工作间名称', trigger: 'blur' }
+      ],
+      supervisorNum: [
+        { required: true, message: '请输入导师人数', trigger: 'blur' },
+      ],
+      studentNum: [
+        { required: true, message: '请输入学生人数', trigger: 'blur' }
+      ]
     });
+   
+    // const userInfo = reactive({
+    //   email: 'aoteman@126.com',
+    //   roles: ['超级管理员', '普通角色'],
+    //   department: '董事长,项目经理',
+    //   phone: '18818260277',
+    //   name: 'admin',
+    //   position: '基本资料',
+    //   creationDate: '2020-01-05 17:03:47'
+    // });
+
+    // 将 userInfo 定义放入 setup 中
+    const userInfo = ref({} as DeptVO);  
+    const fetchUserInfo = async () => {
+      const users = await getUserDept();
+      console.log(users);
+      userInfo.value = users;
+    };
+
+    // 获取导师列表
+    const supervisors = ref();
+    const getSupervisor= async () => {
+      try {
+        const response = await UserApi.getSupervisor()
+        supervisors.value = response
+      } catch (error) {
+        console.error('Error fetching user data:', error)
+      }
+    }
 
-    const saveInfo = () => {
-      // 保存信息的逻辑
-      console.log('保存信息', form);
+    //传supervisorId给formData.supervisorId
+    const handleSupervisorChange = (value: number) => {
+      const formData = unref(formRef)?.formModel as DeptVO
+        console.log('提交的数据:', formData);
+      const selectedUser = supervisors.value.find(user => user.id === value);
+      if (selectedUser) {
+        formData.supervisorId = selectedUser.id;
+        formData.supervisor = selectedUser.nickname;
+      }
+    }
+
+    // 表单提交
+    const submit = async () => {
+      try {
+        await formRef.value?.validate();
+        const formData = unref(formRef)?.formModel as DeptVO
+        console.log('提交的数据:', formData);
+        await updateDept(formData);
+        message.success(t('common.updateSuccess'));
+      } catch (error) {
+        message.error(t('common.validateError'));
+      }
+    };
+
+    // 表单重置
+    const init = async () => {
+      const res = await getUserDept();
+      console.log('获取的数据:', res);
+      form.nickname = res.user.nickname || '';
+      form.phone = res.user.mobile || '';
+      form.email = res.user.email || '';
+      form.name = res.name || '';
+      userInfo.value = res.user; 
     };
 
+    onMounted(async () => {
+      await init();
+      await fetchUserInfo();
+      getSupervisor();
+    });
+
     return {
+      t,
       form,
       userInfo,
-      saveInfo
+      submit,
+      init,
+      rules,
+      formRef,
+      supervisors,
+      handleSupervisorChange,
+      // users,
+      getSupervisor,
     };
   }
 });
+
 </script>
 
 <style scoped>
-.workspace-info {
-  max-width: 800px;
-  margin: 20px auto;
+.workspace-name {
+  height: 20px;
+}
+
+.card-header {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.user-info {
+  padding-right: 0;
+  padding-left: 0;
+  border-right: 0;
+  border-left: 0;
+  border-radius: 0;
+  list-style: none;
 }
 
 .info-item {
   margin-bottom: 10px;
+  padding: 11px 0;
+  margin-bottom: -1px;
+  font-size: 13px;
+  border-top: 1px solid #e7eaec;
+  border-bottom: 1px solid #e7eaec;
+}
+
+.pull-right {
+  float: right !important;
 }
 
 .info-label {