444

src/api/system/dept/index.ts

@@ -13,6 +13,7 @@ export interface DeptVO {
   // createTime?: Date
   user?: UserVO
   address: any
+  description: string
   // 导师信息
   // supervisorId?: number
   // supervisor?: string

src/api/system/user/index.ts

@@ -49,27 +49,27 @@ export const getUserPage1 = (params: PageParam) => {
 
 // 查询当前工作间下用户
 export const getDeptUser = () => {
-  return request.get({ url: '/system/user/DeptUser'})
+  return request.get({ url: '/system/user/DeptUser' })
 }
 
 // 查询工作间下的导师
 export const getDeptsupervisor = (deptId: number) => {
-  return request.get({ url: '/system/user/DeptSupervisor' + deptId })
+  return request.get({ url: '/system/user/DeptSupervisor?id=' + deptId })
 }
 
 // 查询毕业生管理列表(学院)
 export const getGraduateStudentPage = (params: PageParam) => {
-  return request.get({ url: '/system/user/graduateStudentPage',params })
+  return request.get({ url: '/system/user/graduateStudentPage', params })
 }
 
 // 查询毕业生管理列表(导师)
 export const getGraduateStudentTPage = (params: PageParam) => {
-  return request.get({ url: '/system/user/graduateStudentTPage',params })
+  return request.get({ url: '/system/user/graduateStudentTPage', params })
 }
 
 // 查询所有导师列表
 export const getSupervisor = () => {
-  return request.get({ url: '/system/user/supervisor'})
+  return request.get({ url: '/system/user/supervisor' })
 }
 
 // 教师更新学生图片
@@ -134,7 +134,7 @@ export const exportTeacherList = () => {
 
 // 导出在校生
 export const exportStudentList = () => {
-  return request.get({ url: '/system/user/exportStudent' })  
+  return request.get({ url: '/system/user/exportStudent' })
 }
 
 // 导出毕业生
@@ -153,7 +153,7 @@ export const importGraduateTemplate = () => {
 }
 
 // 获得导师模板
-export const importTeacherTemplate = () => { 
+export const importTeacherTemplate = () => {
   return request.download({ url: '/system/user/get-import-teacherTemplate' })
 }
 

src/views/system/workroomCollege/dept/DeptForm.vue

@@ -7,7 +7,7 @@
       :rules="formRules"
       label-width="100px"
     >
-      <el-form-item label="上级部门" prop="parentId">
+      <!-- <el-form-item label="上级部门" prop="parentId">
         <el-tree-select
           v-model="formData.parentId"
           :data="deptTree"
@@ -17,14 +17,14 @@
           placeholder="请选择上级部门"
           value-key="deptId"
         />
-      </el-form-item>
+      </el-form-item> -->
       <el-form-item label="工作间名称" prop="name">
         <el-input v-model="formData.name" placeholder="请输入工作间名称" />
       </el-form-item>
       <!-- <el-form-item label="显示排序" prop="sort">
         <el-input-number v-model="formData.sort" :min="0" controls-position="right" />
       </el-form-item> -->
-      <el-form-item label="负责人" prop="leaderUserId">
+      <!-- <el-form-item label="负责人" prop="leaderUserId">
         <el-select
           v-model="formData.leaderUserId"
           @change="handleSupervisorChange"
@@ -41,19 +41,11 @@
             :value="user.id"
           />
         </el-select>
-        <!-- <el-select v-model="formData.leaderUserId" clearable placeholder="请输入负责人">
-          <el-option
-            v-for="item in userList"
-            :key="item.id"
-            :label="item.nickname"
-            :value="item.id"
-          />
-        </el-select> -->
-      </el-form-item>
-      <el-form-item label="联系电话" prop="phone" v-if="formType === 'create'">
+      </el-form-item> -->
+      <el-form-item label="联系电话" prop="phone" >
         <el-input v-model="formData.phone" maxlength="11" placeholder="请输入联系电话" />
       </el-form-item>
-      <el-form-item label="邮箱" prop="email" v-if="formType === 'create'">
+      <el-form-item label="邮箱" prop="email" >
         <el-input v-model="formData.email" maxlength="50" placeholder="请输入邮箱" />
       </el-form-item>
       <!-- <el-form-item label="状态" prop="status">
@@ -69,16 +61,19 @@
       <el-form-item label="工作间地址" prop="address">
           <el-input v-model="formData.address" placeholder="请输入工作间地址" />
         </el-form-item>
-      <el-form-item label="创建时间" prop="createTime">
+      <!-- <el-form-item label="创建时间" prop="createTime">
         <el-date-picker
           v-model="formData.createTime"
           type="datetime"
           value-format="x"
           placeholder="选择打卡时间"
         />
-      </el-form-item>
-      <el-form-item label="简介" prop="description">
+      </el-form-item> -->
+      <!-- <el-form-item label="简介" prop="description">
         <el-input type="textarea" v-model="formData.description" placeholder="请输入简介" />
+      </el-form-item> -->
+      <el-form-item label="简介" prop="description">
+          <Editor v-model="formData.description" ref="editorRef"/>
       </el-form-item>
     </el-form>
     <template #footer>
@@ -94,6 +89,7 @@ import * as DeptApi from '@/api/system/dept'
 import * as UserApi from '@/api/system/user'
 import { CommonStatusEnum } from '@/utils/constants'
 import { FormRules } from 'element-plus'
+// import { Editor } from 'src/components/Editor'
 
 defineOptions({ name: 'SystemDeptForm' })
 
@@ -107,24 +103,25 @@ const formType = ref('') // 表单的类型：create - 新增；update - 修改
 const formData = ref({
   id: undefined,
   title: '',
-  parentId: undefined,
+  parentId: 0,
   name: undefined,
   // sort: undefined,
   leaderUserId: [],
   phone: undefined,
   email: undefined,
   status: CommonStatusEnum.ENABLE,
-  createTime: undefined,
+  // createTime: undefined,
   address: undefined,
-  description: undefined
+  description: '',
 })
 const formRules = reactive<FormRules>({
   parentId: [{ required: true, message: '上级部门不能为空', trigger: 'blur' }],
   name: [{ required: true, message: '工作间名称不能为空', trigger: 'blur' }],
   // sort: [{ required: true, message: '显示排序不能为空', trigger: 'blur' }],
   leaderUserId: [{ required: true, message: '负责人不能为空', trigger: 'change' }],
-  email: [{ type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur', 'change'] }],
+  email: [{ required: true, message: '邮箱不能为空', trigger: 'blur' }, { type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur', 'change'] }],
   phone: [
+    { required: true, message: '联系电话不能为空', trigger: 'blur' },
     { pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: '请输入正确的手机号码', trigger: 'blur' }
   ],
   status: [{ required: true, message: '状态不能为空', trigger: 'blur' }]
@@ -143,7 +140,20 @@ const open = async (type: string, id?: number) => {
   if (id) {
     formLoading.value = true
     try {
-      formData.value = await DeptApi.getDept(id)
+      // formData.value = await DeptApi.getDept(id)
+      const response = await DeptApi.getDept(id);
+      formData.value = {
+        id: response.id,
+        title: response.title,
+        parentId: response.parentId,
+        name: response.name,
+        leaderUserId: response.leaderUserId,
+        phone: response.phone,
+        email: response.email,
+        status: response.status,
+        address: response.address,
+        description: response.description || '' // 确保为字符串
+      }
     } finally {
       formLoading.value = false
     }
@@ -203,7 +213,7 @@ const resetForm = () => {
   formData.value = {
     id: undefined,
     title: '',
-    parentId: undefined,
+    parentId: 0,
     name: undefined,
     // sort: undefined,
     leaderUserId: [],
@@ -211,8 +221,8 @@ const resetForm = () => {
     email: undefined,
     status: CommonStatusEnum.ENABLE,
     address: undefined,
-    createTime: undefined,
-    description: undefined
+    // createTime: undefined,
+    description: ''
   }
   formRef.value?.resetFields()
 }

src/views/system/workroomCollege/deptInfo/index.vue

@@ -8,42 +8,68 @@
   </el-card> -->
   <div>
     <div class="flex mb-3">
-      <el-card class="workspace-info w-1/3">
+      <el-card class="workspace-info w-full" style="padding-bottom: 40px;">
         <template #header>
           <div class="card-header">
             <span>工作间信息</span>
           </div>
         </template>
         <ul class="user-info">
-          <li class="info-item">
-            <Icon class="mr-5px" icon="ep:user" />
-            <span class="info-label">负责人名称：</span>
-            <span class="pull-right">{{ userInfo.user?.map(user => user.nickname).join(', ') }}</span>
-          </li>
-          <li class="info-item">
-            <Icon class="mr-5px" icon="fontisto:email" />
-            <span class="info-label">邮箱：</span>
-            <span class="pull-right">{{ userInfo.email }}</span>
-          </li>
-          <li class="info-item">
-            <Icon class="mr-5px" icon="ep:phone" />
-            <span class="info-label">联系电话：</span>
-            <span class="pull-right">{{ userInfo.phone }}</span>
-          </li>
-          <li class="info-item">
-            <Icon class="mr-5px" icon="fontisto:email" />
-            <span class="info-label">导师人数：</span>
-            <span class="pull-right">{{ userInfo.supervisorNum }}</span>
-          </li>
-          <li class="info-item">
-            <Icon class="mr-5px" icon="ep:user" />
-            <span class="info-label">学生人数：</span>
-            <span class="pull-right">{{ userInfo.studentNum }}</span>
-          </li>
+          <div class="info-row">
+            <li class="info-item">
+              <Icon class="mr-5px" icon="ep:user" />
+              <span class="info-label">工作间名称：</span>
+              <span class="pull-right">{{ userInfo.name }}</span>
+            </li>
+            <li class="info-item">
+              <Icon class="mr-5px" icon="ep:phone" />
+              <span class="info-label">联系电话：</span>
+              <span class="pull-right">{{ userInfo.phone }}</span>
+            </li>
+          </div>
+
+          <div class="info-row">
+            <li class="info-item">
+              <Icon class="mr-5px" icon="fontisto:email" />
+              <span class="info-label">邮箱：</span>
+              <span class="pull-right">{{ userInfo.email }}</span>
+            </li>
+            <li class="info-item">
+              <Icon class="mr-5px" icon="ep:location" />
+              <span class="info-label">工作间地址：</span>
+              <span class="pull-right">{{ userInfo.address }}</span>
+            </li>
+          </div>
+
+          <div class="info-row">
+            <li class="info-item">
+              <Icon class="mr-5px" icon="fontisto:email" />
+              <span class="info-label">导师人数：</span>
+              <span class="pull-right">{{ userInfo.supervisorNum }}</span>
+            </li>
+            <li class="info-item">
+              <Icon class="mr-5px" icon="ep:user" />
+              <span class="info-label">学生人数：</span>
+              <span class="pull-right">{{ userInfo.studentNum }}</span>
+            </li>
+          </div>
+
+          <!-- <div>
+            <li class="info-item">
+              <Icon class="mr-5px" icon="ep:user" />
+              <span class="info-label">工作间简介：</span>
+              <span class="pull-right">{{ userInfo.description }}</span>
+            </li>
+          </div> -->
         </ul>
+        <div class="info-description">
+          <!-- <Icon class="mr-5px" icon="ep:location" /> -->
+          <div class="div-label" style="margin-left: 20px;">简介：</div>
+          <div class="description-content">{{ cleanedDescription }}</div>
+        </div>
       </el-card>
 
-      <el-card class="workspace-info ml-3 w-2/3">
+      <!-- <el-card class="workspace-info ml-3 w-2/3">
         <template #header>
           <div class="card-header">
             <span>{{ userInfo.name }}</span>
@@ -69,7 +95,7 @@
             <el-button type="primary" @click="toggleEditMode">{{ isEditMode ? '保存' : '修改' }}</el-button>
           </el-form-item>
         </el-form>
-      </el-card>
+      </el-card> -->
     </div>
     <div class="flex flex-col">
        <el-card class="teacher-info w-full">
@@ -167,21 +193,22 @@ export default defineComponent({
         // name: users.user[0].nickname // 提取 nickname
     };
 
-//   //获取工作间下的导师
-// const users = ref()
-// const getDeptsupervisor= async (id) => {
-//   try {
-//     const response = await UserApi.getDeptsupervisor(id)
-//     users.value = response
-//   } catch (error) {
-//     console.error('Error fetching user data:', error)
-//   }
-// }
-
-// //传supervisorId给form.leaderUserId
-// const handleSupervisorChange = (values) => {
-//   form.leaderUserId = values;  // values 是选择的用户ID数组
-// }
+    //获取工作间下的导师
+    const users = ref()
+    const getDeptsupervisor = async (id) => {
+      try {
+        const response = await UserApi.getDeptsupervisor(id.value)
+        users.value = response
+        console.log('工作间下导师信息:', users.value);
+      } catch (error) {
+        console.error('Error fetching user data:', error)
+      }
+    }
+
+    //传supervisorId给form.leaderUserId
+    const handleSupervisorChange = (values) => {
+      form.leaderUserId = values;  // values 是选择的用户ID数组
+    }
 
 const isEditMode = ref(false);
 
@@ -194,6 +221,11 @@ const toggleEditMode = () => {
   isEditMode.value = !isEditMode.value;
 };
 
+ // 创建一个 computed 属性来处理并去掉 <p> 标签
+  const cleanedDescription = computed(() => {
+      return userInfo.value.description ? userInfo.value.description.replace(/<\/?p[^>]*>/g, '') : '';
+    });
+
     // 表单提交
     const submit = async () => {
       try {
@@ -231,7 +263,9 @@ const toggleEditMode = () => {
       if (id.value) {
         await fetchUserInfo(id.value); // 传入获取到的 ID
       }
-      // getDeptsupervisor(id);
+      // const response = await UserApi.getDeptsupervisor(id.value)
+      // users.value = response
+      getDeptsupervisor(id);
     });
 
     return {
@@ -244,9 +278,10 @@ const toggleEditMode = () => {
       init,
       rules,
       formRef,
-      // users,
-      // handleSupervisorChange,
-      // getDeptsupervisor,
+      users,
+      handleSupervisorChange,
+      getDeptsupervisor,
+      cleanedDescription
     };
   }
 });
@@ -270,9 +305,10 @@ const toggleEditMode = () => {
 }
 
 .user-info {
+  margin-top: 10px;
+  
   margin-left: 5%;
   margin-right: 5%;
-  margin-top: 60px;
   padding-right: 0;
   padding-left: 0;
   border-right: 0;
@@ -281,15 +317,59 @@ const toggleEditMode = () => {
   list-style: none;
 }
 
+.info-row {
+  display: flex;
+  justify-content: space-between; /* 保持并排显示 */
+  align-items: center; /* 垂直居中对齐 */
+  margin-bottom: 20px; /* 增加行之间的间距 */
+}
+
 .info-item {
-  margin-bottom: 10px;
-  padding: 11px 0;
-  margin-bottom: -1px;
-  font-size: 13px;
-  border-top: 1px solid #e7eaec;
+  flex: 1; /* 每个信息项占据相同的空间 */
+  padding: 11px 0; /* 内部上下填充 */
+  margin-right: 50px; /* 每个信息项之间的右边距 */
+}
+
+/* 仅为每个信息项添加底部边框 */
+.info-item:first-child {
   border-bottom: 1px solid #e7eaec;
 }
 
+.info-item:last-child {
+  border-bottom: 1px solid #e7eaec; 
+}
+
+.info-description {
+  margin-top: 30px; /* 与上面的信息分隔 */
+  margin-left: 5%; /* 左侧与上面列表保持一致 */
+  margin-right: 5%; /* 右侧与上面列表保持一致 */
+  /* display: flex;  */
+  align-items: center; /* 确保标题与描述对齐 */
+  align-items: flex-start;
+}
+
+.info-label {
+  font-weight: bold; /* 加粗标题 */
+  margin-right: 10px; /* 标题与内容之间的间距 */
+}
+
+.div-label {
+  font-weight: bold; /* 加粗标题 */
+  display: block;
+  
+}
+
+.description-content {
+  white-space: pre-wrap; /* 保持换行 */
+  overflow-wrap: break-word; /* 自动断行 */
+  margin-right: 5%;
+  font-size: 13px; /* 根据需要设置字体大小 */
+  margin-top: 20px; /* 内容与标题之间不需要额外间距 */
+  letter-spacing: 3px;
+  text-indent: 2em; 
+  line-height: 2;
+}
+
 .pull-right {
   float: right !important;
 }

src/views/system/workroomCollege/user/UserForm.vue

@@ -5,7 +5,7 @@
       v-loading="formLoading"
       :model="formData"
       :rules="formRules"
-      label-width="80px"
+      label-width="85px"
     >
       <el-row>
         <el-col :span="12">
@@ -57,7 +57,7 @@
       </el-row>
       <el-row>
         <el-col :span="12">
-          <el-form-item label="用户性别">
+          <el-form-item label="用户性别" prop="sex">
             <el-select v-model="formData.sex" placeholder="请选择">
               <el-option
                 v-for="dict in getIntDictOptions(DICT_TYPE.SYSTEM_USER_SEX)"
@@ -85,7 +85,7 @@
           </el-form-item>
         </el-col>
         <el-col :span="12" v-if="formType === 'create-T' || formType === 'update-T'">
-          <!-- <el-form-item label="用户类型" prop="userType">
+          <el-form-item label="用户类型" prop="userType">
             <el-select v-model="formData.userType" placeholder="请选择用户类型">
               <el-option
                 v-for="option in userTypes"
@@ -94,11 +94,11 @@
                 :value="option.value"
                 />
             </el-select>
-          </el-form-item> -->
-          <el-form-item label="用户类型" prop="userType">
-            <span style="margin-left: 10px;">导师</span> <!-- 无法选择，直接显示 -->
-            <input type="hidden" v-model="formData.userType" value="3" /> <!-- 固定为导师 -->
           </el-form-item>
+          <!-- <el-form-item label="用户类型" prop="userType">
+            <span style="margin-left: 10px;">导师</span> 
+            <input type="hidden" v-model="formData.userType" value="3" />
+          </el-form-item> -->
         </el-col>
       </el-row>
 
@@ -123,7 +123,15 @@
           </el-form-item>
         </el-col>
 
-        <el-col :span="12" v-if="formType === 'update-S'">
+        <el-col :span="12" v-if="formType === 'create-S' || formType === 'update-S'">
+          <el-form-item label="家长号码" prop="parentMobile">
+            <el-input v-model="formData.parentMobile" maxlength="11" placeholder="请输入家长号码" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+
+      <el-row>
+        <el-col :span="24" v-if="formType === 'update-S'">
           <el-form-item label="毕业条件" >
             <el-select 
               v-model="formData.isGraduate" 
@@ -146,8 +154,11 @@
   
       <el-row>
         <el-col :span="24">
-          <el-form-item label="备注">
+          <!-- <el-form-item label="备注">
             <el-input v-model="formData.remark" placeholder="请输入内容" type="textarea" />
+          </el-form-item> -->
+          <el-form-item label="简介" prop="remark">
+            <Editor v-model="formData.remark" ref="editorRef"/>
           </el-form-item>
         </el-col>
       </el-row>
@@ -166,6 +177,7 @@ import * as PostApi from '@/api/system/post'
 import * as DeptApi from '@/api/system/dept'
 import * as UserApi from '@/api/system/user'
 import { FormRules } from 'element-plus'
+import { pa } from 'element-plus/es/locale'
 
 defineOptions({ name: 'SystemUserForm' })
 
@@ -193,12 +205,14 @@ const formData = ref({
   supervisor:'',
   supervisorId:'',
   isGraduate: 0,
+  parentMobile: '',
 })
 const formRules = reactive<FormRules>({
   username: [{ required: true, message: '账号不能为空', trigger: 'blur' }],
   nickname: [{ required: true, message: '姓名不能为空', trigger: 'blur' }],
   password: [{ required: true, message: '用户密码不能为空', trigger: 'blur' }],
   email: [
+    { required: true, message: '邮箱不能为空', trigger: 'blur' }, // 确保这是必填
     {
       type: 'email',
       message: '请输入正确的邮箱地址',
@@ -206,29 +220,39 @@ const formRules = reactive<FormRules>({
     }
   ],
   mobile: [
+    { required: true, message: '手机号码不能为空', trigger: 'blur' },
     {
       pattern: /^(?:(?:\+|00)86)?1(?:3[\d]|4[5-79]|5[0-35-9]|6[5-7]|7[0-8]|8[\d]|9[189])\d{8}$/,
       message: '请输入正确的手机号码',
       trigger: 'blur'
     }
-  ]
+  ],
+  parentMobile: [
+    { required: true, message: '家长号码不能为空', trigger: 'blur' }, // 确保这是必填
+    {
+      trigger: 'blur',
+      pattern: /^(?:(?:\+|00)86)?1(?:3[\d]|4[5-79]|5[0-35-9]|6[5-7]|7[0-8]|8[\d]|9[189])\d{8}$/,
+      message: '请输入正确的手机号码'
+    }
+  ],
 })
+
 const formRef = ref() // 表单 Ref
 const deptList = ref<Tree[]>([]) // 树形结构
 const postList = ref([] as PostApi.PostVO[]) // 岗位列表
 
 //用户类型
-// const userTypes = computed(() => {
-//   const types = [];
-//   if (formType.value === 'create-S' || formType.value === 'update-S') {
-//     types.push({ label: '在校生', value: "1" });
-//     types.push({ label: '毕业生', value: "2" });
-//   }
-//   if (formType.value === 'create-T' || formType.value === 'update-T') {
-//     types.push({ label: '导师', value: "3" });
-//   }
-//   return types;
-// });
+const userTypes = computed(() => {
+  const types = [];
+  if (formType.value === 'create-S' || formType.value === 'update-S') {
+    types.push({ label: '在校生', value: "1" });
+    types.push({ label: '毕业生', value: "2" });
+  }
+  if (formType.value === 'create-T' || formType.value === 'update-T') {
+    types.push({ label: '导师', value: "3" });
+  }
+  return types;
+});
 
 
 //获取所有导师
@@ -322,6 +346,7 @@ const resetForm = () => {
     supervisor:'',
     supervisorId:'',
     isGraduate: 0,
+    parentMobile: '',
   }
   formRef.value?.resetFields()
 }

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

@@ -1,107 +0,0 @@
-<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

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

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

@@ -7,56 +7,76 @@
     </div>
   </el-card> -->
   <div class="flex">
-    <el-card class="workspace-info w-1/3">
-      <template #header>
-        <div class="card-header">
-          <span>工作间信息</span>
+    <el-card class="workspace-info w-full" style="padding-bottom: 40px;">
+        <template #header>
+          <div class="card-header">
+            <span>工作间信息</span>
+          </div>
+        </template>
+        <ul class="user-info">
+          <div class="info-row">
+            <li class="info-item">
+              <Icon class="mr-5px" icon="ep:user" />
+              <span class="info-label">工作间名称：</span>
+              <span class="pull-right">{{ userInfo.name }}</span>
+            </li>
+            <li class="info-item">
+              <Icon class="mr-5px" icon="ep:phone" />
+              <span class="info-label">联系电话：</span>
+              <span class="pull-right">{{ userInfo.phone }}</span>
+            </li>
+          </div>
+
+          <div class="info-row">
+            <li class="info-item">
+              <Icon class="mr-5px" icon="fontisto:email" />
+              <span class="info-label">邮箱：</span>
+              <span class="pull-right">{{ userInfo.email }}</span>
+            </li>
+            <li class="info-item">
+              <Icon class="mr-5px" icon="ep:location" />
+              <span class="info-label">工作间地址：</span>
+              <span class="pull-right">{{ userInfo.address }}</span>
+            </li>
+          </div>
+
+          <div class="info-row">
+            <li class="info-item">
+              <Icon class="mr-5px" icon="fontisto:email" />
+              <span class="info-label">导师人数：</span>
+              <span class="pull-right">{{ userInfo.supervisorNum }}</span>
+            </li>
+            <li class="info-item">
+              <Icon class="mr-5px" icon="ep:user" />
+              <span class="info-label">学生人数：</span>
+              <span class="pull-right">{{ userInfo.studentNum }}</span>
+            </li>
+          </div>
+
+          <!-- <div>
+            <li class="info-item">
+              <Icon class="mr-5px" icon="ep:user" />
+              <span class="info-label">工作间简介：</span>
+              <span class="pull-right">{{ userInfo.description }}</span>
+            </li>
+          </div> -->
+        </ul>
+        <div class="info-description">
+          <!-- <Icon class="mr-5px" icon="ep:location" /> -->
+          <div class="div-label" style="margin-left: 20px;">简介：</div>
+          <div class="description-content">{{ cleanedDescription }}</div>
         </div>
-      </template>
-      <ul class="user-info">
-        <li class="info-item">
-          <Icon class="mr-5px" icon="ep:user" />
-          <span class="info-label">负责人名称：</span>
-          <span class="pull-right">{{ userInfo.user?.map(user => user.nickname).join(', ') }}</span>
-        </li>
-
-
-        <li class="info-item">
-          <Icon class="mr-5px" icon="fontisto:email" />
-          <span class="info-label">工作室邮箱：</span>
-          <span class="pull-right">{{ userInfo.email }}</span>
-        </li>   
-        <li class="info-item">
-          <Icon class="mr-5px" icon="ep:phone" />
-          <span class="info-label">工作室号码：</span>
-          <span class="pull-right">{{ userInfo.phone }}</span>
-        </li>
-        <li class="info-item">
-          <Icon class="mr-5px" icon="fontisto:email" />
-          <span class="info-label">导师人数：</span>
-          <span class="pull-right">{{ userInfo.supervisorNum }}</span>
-        </li>   
-        <li class="info-item">
-          <Icon class="mr-5px" icon="ep:user" />
-          <span class="info-label">学生人数：</span>
-          <span class="pull-right">{{ userInfo.studentNum }}</span>
-        </li>   
-        <!-- <li class="info-item" v-for="(url, index) in userAchievements.value.datil" :key="index">
-          <Icon class="mr-5px" icon="fontisto:email" />
-          <span class="info-label">成果展示：</span>
-          <span class="pull-right">{{ userInfo.achievement }}</span>
-          <img :src="url" alt="成就展示图片" class="user-image" />
-        </li> -->
-      </ul>
-    </el-card>
-    <el-card class="workspace-info ml-3 w-2/3">
+        <!-- <el-button type="primary" @click="openDialog">修改</el-button> -->
+      </el-card>
+       <!-- <DeptForm ref="formRef" @success="getList" /> -->
+    <!-- <el-card class="workspace-info ml-3 w-2/3">
       <template #header>
         <div class="card-header">
           <span>{{ userInfo.name }}</span>
         </div>
       </template>
       <el-form ref="formRef" :model="form" label-width="100px" :rules="rules" style="margin-left: 5%; margin-right: 5%;;">
-        <!-- <el-form-item>
+        <el-form-item>
           <template #label>
             <span style="font-weight: bold;">负责人信息</span>
           </template>
@@ -79,7 +99,7 @@
             :value="user.id"
           />
         </el-select>
-        </el-form-item> -->
+        </el-form-item>
         <el-form-item>
           <template #label>
             <span style="font-weight: bold;">工作间信息</span>
@@ -104,12 +124,13 @@
         </el-form-item>
         <el-form-item>
           <el-button type="primary" @click="toggleEditMode">{{ isEditMode ? '保存' : '修改' }}</el-button>
-          <!-- <el-button type="primary" @click="submit">保存</el-button> -->
-          <!-- <el-button type="danger" @click="init">重置</el-button> -->
+          <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> -->
   </div>
+ 
 </template>
 
 <script lang="ts">
@@ -208,6 +229,12 @@ const toggleEditMode = () => {
   isEditMode.value = !isEditMode.value;
 };
 
+// 创建一个 computed 属性来处理并去掉 <p> 标签
+  const cleanedDescription = computed(() => {
+     return userInfo.value.description ? userInfo.value.description.replace(/<\/?p[^>]*>/g, '') : '';
+  });
+
+
     // 表单提交
     const submit = async () => {
       try {
@@ -243,6 +270,7 @@ const toggleEditMode = () => {
       await init();
       await fetchUserInfo();
       getSupervisor();
+
     });
 
     return {
@@ -258,6 +286,7 @@ const toggleEditMode = () => {
       users,
       handleSupervisorChange,
       getSupervisor,
+      cleanedDescription
     };
   }
 });
@@ -281,9 +310,10 @@ const toggleEditMode = () => {
 }
 
 .user-info {
+  margin-top: 10px;
+  
   margin-left: 5%;
   margin-right: 5%;
-  margin-top: 60px;
   padding-right: 0;
   padding-left: 0;
   border-right: 0;
@@ -292,15 +322,59 @@ const toggleEditMode = () => {
   list-style: none;
 }
 
+.info-row {
+  display: flex;
+  justify-content: space-between; /* 保持并排显示 */
+  align-items: center; /* 垂直居中对齐 */
+  margin-bottom: 20px; /* 增加行之间的间距 */
+}
+
 .info-item {
-  margin-bottom: 10px;
-  padding: 11px 0;
-  margin-bottom: -1px;
-  font-size: 13px;
-  border-top: 1px solid #e7eaec;
+  flex: 1; /* 每个信息项占据相同的空间 */
+  padding: 11px 0; /* 内部上下填充 */
+  margin-right: 50px; /* 每个信息项之间的右边距 */
+}
+
+/* 仅为每个信息项添加底部边框 */
+.info-item:first-child {
   border-bottom: 1px solid #e7eaec;
 }
 
+.info-item:last-child {
+  border-bottom: 1px solid #e7eaec; 
+}
+
+.info-description {
+  margin-top: 30px; /* 与上面的信息分隔 */
+  margin-left: 5%; /* 左侧与上面列表保持一致 */
+  margin-right: 5%; /* 右侧与上面列表保持一致 */
+  /* display: flex;  */
+  align-items: center; /* 确保标题与描述对齐 */
+  align-items: flex-start;
+}
+
+.info-label {
+  font-weight: bold; /* 加粗标题 */
+  margin-right: 10px; /* 标题与内容之间的间距 */
+}
+
+.div-label {
+  font-weight: bold; /* 加粗标题 */
+  display: block;
+  
+}
+
+.description-content {
+  white-space: pre-wrap; /* 保持换行 */
+  overflow-wrap: break-word; /* 自动断行 */
+  margin-right: 5%;
+  font-size: 13px; /* 根据需要设置字体大小 */
+  margin-top: 20px; /* 内容与标题之间不需要额外间距 */
+  letter-spacing: 3px;
+  text-indent: 2em; 
+  line-height: 2;
+}
+
 .pull-right {
   float: right !important;
 }

src/views/system/workroomTeacher/user/UserForm.vue

@@ -146,8 +146,11 @@
       
       <el-row>
         <el-col :span="24">
-          <el-form-item label="备注">
+          <!-- <el-form-item label="备注">
             <el-input v-model="formData.remark" placeholder="请输入内容" type="textarea" />
+          </el-form-item> -->
+          <el-form-item label="简介" prop="remark">
+            <Editor v-model="formData.remark" ref="editorRef"/>
           </el-form-item>
         </el-col>
       </el-row>