fix：个人中心修改；

2024-10-30 10:50:30 +08:00 · 2024-10-30 10:50:30 +08:00 · 7a18c1927a
parent bc8b80e7d7
commit 7a18c1927a
5 changed files with 223 additions and 57 deletions
--- a/src/renderer/src/views/profile/components/addClass.vue
+++ b/src/renderer/src/views/profile/components/addClass.vue
@ -0,0 +1,157 @@
+<template>
+    <div>
+        <el-dialog v-model="dialogVisible" title="加入班级" width="50%" append-to-body>
+    <el-form
+      style="width: 100%"
+      label-width="auto"
+      :model="classForm"
+      :rules="rules"
+      ref="myForm"
+    >
+      <el-form-item label="老师" style="margin-right: 10px; width: 50%">
+        <el-text>
+          {{ userStore.nickName }}
+        </el-text>
+      </el-form-item>
+  
+      <el-form-item label="班级">
+        <el-tree-select
+          v-model="classids"
+          :data="gradeTree"
+          multiple
+          :render-after-expand="false"
+          style="width: 240px"
+        />
+      </el-form-item>
+    </el-form>
+  
+    <template #footer>
+      <el-button @click="dialogVisible = false">取 消</el-button>
+      <el-button type="primary" @click="btnSave">确 定</el-button>
+    </template>
+  </el-dialog>
+    </div>
+</template>
+  
+  <script setup>
+  import { ref, defineExpose,reactive } from 'vue'
+  import { listClassmain, addClasses } from '@/api/classManage/index'
+  import { ElMessage } from 'element-plus'
+  import useUserStore from '@/store/modules/user'
+  
+  // 打开班级
+  const dialogVisible = ref(false)
+  const userStore = useUserStore().user
+  const classids = ref([])
+  //获取班级信息
+  const classList = ref([])
+   //班级列表
+   const gradeTree = ref([])
+  // 未加入的班级
+  const classesNotAMemberOf = ref([])
+  // 当前选中的班级
+  const currentIndex = ref(0)
+  const newGradeList = reactive([
+    [
+      { label: '一年级', agekey: 1, checked: false, current: 1 },
+      { label: '二年级', agekey: 2, checked: false, current: 1 },
+      { label: '三年级', agekey: 3, checked: false, current: 1 },
+      { label: '四年级', agekey: 4, checked: false, current: 1 },
+      { label: '五年级', agekey: 5, checked: false, current: 1 },
+      { label: '六年级', agekey: 6, checked: false, current: 1 },
+    ],
+    [
+      { label: '初一', agekey: 7, checked: false, current: 2 },
+      { label: '初二', agekey: 8, checked: false, current: 2 },
+      { label: '初三', agekey: 9, checked: false, current: 2 },
+    ],
+    [
+      { label: '高一', agekey: 10, checked: false, current: 3 },
+      { label: '高二', agekey: 11, checked: false, current: 3 },
+      { label: '高三', agekey: 12, checked: false, current: 3 },
+    ],
+  ])
+  
+  // 打开弹窗
+  const open = () => {
+    dialogVisible.value = true
+    getClassInfo()
+  }
+  
+  // 新增班级
+  const btnSave = () => {
+    addClasses({ classIds: classids.value.join(','), userId: userStore.userId }).then(res => {
+      if (res.code === 200) {
+        dialogVisible.value = false
+        ElMessage({
+          message: res.msg,
+          type: 'success',
+        })
+        // 清空所选中的值
+        classids.value = []
+      } else {
+        ElMessage({
+          message: res.msg,
+          type: 'warning',
+        })
+      }
+    })
+  }
+  // 获取班级信息
+  const getClassInfo = () => {
+    classList.value = []
+    listClassmain({ classuserid: userStore.userId, pageSize: 100, status: 'open' }).then(response => {
+      classList.value = [...response.rows]
+      if(classList.value.length > 0){
+        currentIndex.value = 0
+      }
+    });
+    listClassmain({entpid: userStore.deptId, status: 'open', pageSize: 100}).then(response => {
+      //清除已有的班级
+      classesNotAMemberOf.value = [...response.rows]
+      classList.value.forEach(item => {
+        const currentIndex = classesNotAMemberOf.value.findIndex(items => items.id === item.id)
+        if(currentIndex) classesNotAMemberOf.value.splice(currentIndex, 1)
+      })
+      //这里获取组装所有班级
+      gradeTree.value = groupByCondition(classesNotAMemberOf.value, item => item.agekey);
+    })
+  }
+  //将所有班级筛选成二级的数组
+  function groupByCondition(arr, condition) {
+    // 分组结果存储为对象
+    const groups = arr.reduce((groups, item) => {
+      const groupKey = condition(item);
+      item.label = item.caption
+      item.value = item.id
+      groups[groupKey] = groups[groupKey] || [];
+      groups[groupKey].push(item);
+      return groups;
+    }, {});
+    // 构建新的数据结构
+    const formattedGroups = Object.keys(groups).map(key => ({
+      label: gradeName(key),
+      value:key,
+      children: groups[key]
+    }));
+    return formattedGroups;
+  }
+  //key对应学段年级
+  function gradeName(key){
+    //先把二级数组转化为一级数组，用于筛选
+    const flatGradeDataList = newGradeList.flat();
+    const currentIndex = flatGradeDataList.findIndex(item => item.agekey === Number(key));
+    if(currentIndex !== -1){
+      return flatGradeDataList[currentIndex].label;
+    }else{
+      //社团的处理
+      const defaultLabel = '社团';
+      flatGradeDataList[currentIndex] = { ...flatGradeDataList[currentIndex], label: defaultLabel };
+      return defaultLabel;
+    }
+  }
+  
+  defineExpose({
+    open
+  })
+  </script>
--- a/src/renderer/src/views/profile/components/classList.vue
+++ b/src/renderer/src/views/profile/components/classList.vue
@ -1,12 +1,15 @@
 <template>
-    <div v-for="(item,index) in classList" :key="index">
-        <div>{{item.caption}}、</div>
+  <div style="display: flex;flex-wrap: wrap;align-items: center;">
+    <div v-for="(item,index) in classList" :key="index" style="margin-right: 10px;cursor: pointer;">
+        <el-tag type="primary">{{item.caption}}</el-tag>
    </div>
-    <el-button type="primary" link>加入班级</el-button>
-  </template>
-  
+    <el-button type="primary" link @click="addClass">加入班级</el-button>
+    <AddClass ref="addClassRef" />
+  </div>
+</template>
  <script setup>
  import {onMounted, ref} from "vue";
+  import AddClass from './addClass.vue'
  const props = defineProps({
    classList:{
      type:Array,
@ -15,6 +18,10 @@
      type:Array,
    }
  })
+  const addClassRef = ref()
+  const addClass = () => {
+    addClassRef.value.open()
+  }
  onMounted(() => {

  })
--- a/src/renderer/src/views/profile/components/selectClass.vue
+++ b/src/renderer/src/views/profile/components/selectClass.vue
@ -1,39 +1,41 @@
 <template>
-    <div style="margin-left: 15px">
-        <el-dropdown @command="handleUserEduStage">
-        <span class="el-dropdown-link">
-            <el-button class="custom-button" type="default" round >{{ userStore.edustage }}
-                <el-icon><ArrowDown /></el-icon>
-            </el-button>
-        </span>
-        <template #dropdown>
-            <el-dropdown-menu>
-            <el-dropdown-item command="幼儿园">幼儿园</el-dropdown-item>
-            <el-dropdown-item command="小学">小学</el-dropdown-item>
-            <el-dropdown-item command="初中">初中</el-dropdown-item>
-            <el-dropdown-item command="高中">高中</el-dropdown-item>
-            </el-dropdown-menu>
-        </template>
-        </el-dropdown>
-    </div>
-    <div style="margin-left: 15px">
-        <el-dropdown @command="handleUserEduSubject">
-        <span class="el-dropdown-link">
-            <el-button class="custom-button" type="default" round>{{ userStore.edusubject }}
-                <el-icon><ArrowDown /></el-icon>
-            </el-button>
-        </span>
-        <template #dropdown>
-            <el-dropdown-menu>
-            <template v-for="(item, index) in subjectList">
-                <el-dropdown-item v-if="item.edustage == userStore.edustage" :command="item.itemtitle">{{
-                item.itemtitle }}</el-dropdown-item>
+    <div style="display: flex;">
+        <div style="margin-left: 15px">
+            <el-dropdown @command="handleUserEduStage">
+            <span class="el-dropdown-link">
+                <el-button class="custom-button" type="default" round >{{ userStore.edustage }}
+                    <el-icon><ArrowDown /></el-icon>
+                </el-button>
+            </span>
+            <template #dropdown>
+                <el-dropdown-menu>
+                <el-dropdown-item command="幼儿园">幼儿园</el-dropdown-item>
+                <el-dropdown-item command="小学">小学</el-dropdown-item>
+                <el-dropdown-item command="初中">初中</el-dropdown-item>
+                <el-dropdown-item command="高中">高中</el-dropdown-item>
+                </el-dropdown-menu>
            </template>
-            </el-dropdown-menu>
-        </template>
-        </el-dropdown>
+            </el-dropdown>
+        </div>
+        <div style="margin-left: 15px">
+            <el-dropdown @command="handleUserEduSubject">
+            <span class="el-dropdown-link">
+                <el-button class="custom-button" type="default" round>{{ userStore.edusubject }}
+                    <el-icon><ArrowDown /></el-icon>
+                </el-button>
+            </span>
+            <template #dropdown>
+                <el-dropdown-menu>
+                <template v-for="(item, index) in subjectList">
+                    <el-dropdown-item :command="item.itemtitle">{{
+                    item.itemtitle }}</el-dropdown-item>
+                </template>
+                </el-dropdown-menu>
+            </template>
+            </el-dropdown>
+        </div>
    </div>
-  </template>
+</template>
  
 <script setup>
 import useUserStore from '@/store/modules/user'
@ -51,6 +53,13 @@ const getSubject = () => {
    subjectList.value = res.rows.filter(item => arr.includes(String(item.id))).map(items => items)
  })
 }
+// 选择学段
+const handleUserEduStage = (item) => {
+    userStore.edustage = item
+}
+const handleUserEduSubject = (item) => {
+    userStore.edusubject = item
+}
 onMounted(() => {
    getSubject()
    console.log(userStore,'123')
--- a/src/renderer/src/views/profile/index.vue
+++ b/src/renderer/src/views/profile/index.vue
@ -80,9 +80,6 @@ onMounted(() => {
      font-size: 28px;
      font-weight: bold;
    }
-    .infomation{
-      display: flex;
-    }
  }
 }
 .list-group-item {
--- a/src/renderer/src/views/profile/userInfo.vue
+++ b/src/renderer/src/views/profile/userInfo.vue
@ -131,7 +131,7 @@ const getSubject = () => {
 }

 setTimeout(() => {
-  if (props.user.edudegree != '') {
+  if (userStore.user.edudegree != '') {
    var upcaseName = [
      '一年级',
      '二年级',
@ -146,15 +146,15 @@ setTimeout(() => {
      '高二',
      '高三'
    ]
-    var d = parseInt(props.user.edudegree.replace('年级', ''))
+    var d = parseInt(userStore.user.edudegree.replace('年级', ''))
    if (d <= 6) {
-      props.user.edustage = '小学'
+      userStore.user.edustage = '小学'
    } else if (d >= 7 && d <= 9) {
-      props.user.edustage = '初中'
+      userStore.user.edustage = '初中'
    } else if (d >= 9 && d <= 12) {
-      props.user.edustage = '高中'
+      userStore.user.edustage = '高中'
    }
-    props.user.stagelabel = upcaseName[d - 1]
+    userStore.user.stagelabel = upcaseName[d - 1]
  }
 }, 1000)

@ -162,10 +162,10 @@ setTimeout(() => {
 function submit() {
  proxy.$refs.userRef.validate((valid) => {
    if (valid) {
-      props.user.avatar = userStore.user.avatar
-      updateUserInfo(props.user).then((response) => {
+      userStore.user.avatar = userStore.user.avatar
+      updateUserInfo(userStore.user).then((response) => {
        if(response.code == 200){
-          userStore.login({username:props.user.userName,password:props.user.plainpwd}).then(() => {
+          userStore.login({username:userStore.user.userName,password:userStore.user.plainpwd}).then(() => {
            userStore.getInfo().then(res => {
              if(res.code === 200){
                let sessionSubject = {
@ -191,21 +191,20 @@ function submit() {
 }
 const semeterChange = (item) => {
    if(item === '幼儿园'){
-      props.user.edusubject = ''
+      userStore.user.edusubject = ''
    }
 }

 // 获取班级信息
 const getClassInfo = () => {
  classList.value = []
-  debugger
-  listClassmain({ classuserid: props.user.userId, pageSize: 100, status: 'open' }).then(response => {
+  listClassmain({ classuserid: userStore.user.userId, pageSize: 100, status: 'open' }).then(response => {
    classList.value = [...response.rows]
    if(classList.value.length > 0){
      currentIndex.value = 0
    }
  });
-  listClassmain({entpid: props.user.deptId, status: 'open', pageSize: 100}).then(response => {
+  listClassmain({entpid: userStore.user.deptId, status: 'open', pageSize: 100}).then(response => {
    //清除已有的班级
    classesNotAMemberOf.value = [...response.rows]
    classList.value.forEach(item => {
@ -249,9 +248,6 @@ function groupByCondition(arr, condition) {
      return defaultLabel;
    }
  }
-  const addClass = () => {
-    dialogVisible.value = true
-  }
 onMounted(() => {
  getSubject()
  getClassInfo()