修改样式

src/components/CBreadcrumb/index.module.less

@@ -1,21 +1,28 @@
 .CBreadcrumb {
-  margin-bottom: 23px;
+  margin-bottom: 20px;
+
+  .icon_back {
+    width: 36px;
+    height: 36px;
+  }
+
   :global {
     .option.n-base-select-option {
       justify-content: center;
     }
+
     .option.n-base-select-option.n-base-select-option--pending::before {
       background-color: #198cfe !important;
     }
-    .option.n-base-select-option.n-base-select-option--pending
-      .n-base-select-option__content {
+
+    .option.n-base-select-option.n-base-select-option--pending .n-base-select-option__content {
       color: #fff !important;
       text-align: center;
     }
   }
 
   :global {
-    .n-breadcrumb > ul {
+    .n-breadcrumb>ul {
       display: flex !important;
       align-items: center !important;
 
@@ -43,7 +50,7 @@
     }
   }
 
-  & > :global(.n-space) {
+  &> :global(.n-space) {
     height: 36px !important;
   }
 
@@ -51,4 +58,4 @@
     height: 18px !important;
     margin: 0 16px !important;
   }
-}
+}

src/components/CBreadcrumb/index.tsx

@@ -43,6 +43,7 @@ export default defineComponent({
             <img
               style={{ cursor: 'pointer' }}
               src={icon_back}
+              class={styles.icon_back}
               onClick={() => router.go(-1)}
             />
             <NBreadcrumb separator="">

src/components/layout/index.module.less

@@ -13,7 +13,7 @@
     // overflow: hidden;
     // }
 
-    padding: 32px;
+    padding: 20px 32px 32px;
     height: calc(100vh - 64px);
     overflow-y: auto;
   }
@@ -117,7 +117,7 @@
       }
 
       p {
-        font-size: max(18px, 14px);
+        font-size: max(18px, 14Px);
         font-weight: 600;
         color: #131415;
       }

src/components/layout/layoutTop.tsx

@@ -39,7 +39,6 @@ export default defineComponent({
       showWord.value = true;
     };
     const body = document.querySelector('body');
-    console.log(body, 'mask');
     if (body) {
       body.className = 'myBody body';
     }

src/views/classList/index.module.less

@@ -325,7 +325,7 @@
 }
 
 .listWrap {
-  min-height: 805px;
+  min-height: 100%;
   padding: 32px;
   background-color: #fff;
   border-radius: 20px;
@@ -333,14 +333,14 @@
   .customTabs {
     :global {
       .n-tabs-tab--active {
-        font-size: max(18px, 14px) !important;
+        font-size: max(18px, 14Px) !important;
 
         font-weight: 600 !important;
         color: #131415 !important;
       }
 
       .n-tabs-tab {
-        font-size: max(18px, 14px);
+        font-size: max(18px, 14Px);
         padding: 8px 0 !important;
         font-weight: 400;
         min-width: 50px;
@@ -746,4 +746,4 @@
 
 .nextWrap {
   padding: 30px 32px 0 !important;
-}
+}

src/views/data-module/index.module.less

@@ -9,14 +9,14 @@
   .customTabs {
     :global {
       .n-tabs-tab--active {
-        font-size: max(18px, 16px) !important;
+        font-size: max(18px, 14Px) !important;
 
         font-weight: 600 !important;
         color: #131415 !important;
       }
 
       .n-tabs-tab {
-        font-size: max(18px, 16px);
+        font-size: max(18px, 14Px);
         padding: 8px 0 !important;
         font-weight: 400;
         min-width: 50px;
@@ -55,4 +55,4 @@
   line-height: 41px;
   font-weight: 600 !important;
   font-size: 18px;
-}
+}

src/views/home/index.tsx

@@ -1,4 +1,10 @@
-import { defineComponent, onBeforeUnmount, onMounted, reactive, ref } from 'vue';
+import {
+  defineComponent,
+  onBeforeUnmount,
+  onMounted,
+  reactive,
+  ref
+} from 'vue';
 import styles from './index.module.less';
 import {
   NImage,
@@ -349,7 +355,6 @@ export default defineComponent({
       }, 500);
     };
 
-
     return () => (
       <div class={styles.homeWrap}>
         <div class={styles.homeInfoLeft}>
@@ -404,7 +409,7 @@ export default defineComponent({
                 <div class={styles.informations}>
                   {forms.applyClassItem.lastStudy ? (
                     <>
-                      上次课程：
+                      <span style="flex-shrink: 0;">上次课程：</span>
                       <TheNoticeBar text={forms.applyClassItem.lastStudy} />
                     </>
                   ) : (
@@ -769,8 +774,6 @@ export default defineComponent({
           </div>
         </NModal>
 
-
-
         {forms.showGuide ? <HomeGuide></HomeGuide> : null}
       </div>
     );

src/views/natural-resources/components/my-collect/index.module.less

@@ -52,6 +52,7 @@
 
       .n-button--primary-type {
         color: #131415;
+        background-color: #D2ECFF !important;
       }
     }
 
@@ -120,3 +121,30 @@
     line-height: var(--n-blank-height);
   }
 }
+
+.collapseWrap {
+  width: 98%;
+  display: flex;
+  flex-direction: row;
+  align-items: flex-end;
+
+}
+
+.collaoseBtn {
+  width: 32px;
+  height: 32px;
+  cursor: pointer;
+}
+
+.collaoseBtn.isStart {
+  transform: rotate(-180deg);
+}
+
+.collapsSection {
+  padding-top: 10px;
+}
+
+.isHidden {
+  overflow: hidden;
+  transition: 1s all ease-in;
+}

src/views/natural-resources/components/my-collect/search-group-resources.tsx

@@ -1,9 +1,10 @@
-import { defineComponent, onMounted, reactive, ref } from 'vue';
+import { defineComponent, nextTick, onMounted, reactive, ref } from 'vue';
 import styles from './index.module.less';
-import { NButton, NForm, NFormItem, NSpace } from 'naive-ui';
+import { NButton, NForm, NFormItem, NImage, NSpace } from 'naive-ui';
 import TheSearch from '/src/components/TheSearch';
 import { resourceTypeArray } from '/src/utils/searchArray';
 import { useCatchStore } from '/src/store/modules/catchData';
+import isCollaose from '../../images/isCollaose.png';
 
 export default defineComponent({
   name: 'search-group',
@@ -22,6 +23,45 @@ export default defineComponent({
       emit('search', forms);
     };
 
+    const collapseWrapRef = ref();
+    const divDomList = ref([] as any);
+    const orginHeight = ref(0);
+    const hiddenHeight = ref(0);
+    const line = ref(0);
+    const isCollapse = ref(false);
+    const musicCateRef = (el: any) => {
+      if (el?.selfElRef) {
+        divDomList.value.push(el.selfElRef.parentNode);
+      }
+    };
+    const setCollapse = (flag: boolean) => {
+      isCollapse.value = flag;
+      getLive();
+    };
+    const getLive = () => {
+      divDomList.value = [...new Set(divDomList.value)];
+      let offsetLeft = -1;
+      divDomList.value.forEach((item: any, index: number) => {
+        if (index === 0) {
+          line.value = 1;
+          offsetLeft = item.offsetLeft;
+        } else if (item.offsetLeft === offsetLeft && index != 0) {
+          // 如果某个标签的offsetLeft和第一个标签的offsetLeft相等  说明增加了一行
+          line.value++;
+        }
+        if (!isCollapse.value) {
+          if (line.value > 1) {
+            //从第3行开始 隐藏标签
+            item.style.display = 'none';
+            // 显示展开按钮  class名chu是在前面动态添加的
+          } else {
+            item.style.display = 'block';
+          }
+        } else {
+          item.style.display = 'block';
+        }
+      });
+    };
     onMounted(async () => {
       resourceList.value = [
         {
@@ -35,6 +75,12 @@ export default defineComponent({
       await catchStore.getMusicSheetCategory();
       // 获取声部列表
       await catchStore.getSubjects();
+
+      // // 这里开始
+      // orginHeight.value = collapseWrapRef.value.offsetHeight;
+      // hiddenHeight.value = collapseWrapRef.value.offsetHeight / line.value;
+      // // 默认隐藏
+      // getLive();
     });
     return () => (
       <div class={styles.searchGroup}>
@@ -50,6 +96,17 @@ export default defineComponent({
                 onClick={() => {
                   forms.type = item.value;
                   onSearch();
+
+                  nextTick(() => {
+                    if (forms.type === 'MUSIC') {
+                      // 这里开始
+                      orginHeight.value = collapseWrapRef.value.offsetHeight;
+                      hiddenHeight.value =
+                        collapseWrapRef.value.offsetHeight / line.value;
+                      // 默认隐藏
+                      getLive();
+                    }
+                  });
                 }}>
                 {item.label}
               </NButton>
@@ -58,26 +115,78 @@ export default defineComponent({
         </div>
         <NForm labelAlign="left" labelPlacement="left">
           {forms.type === 'MUSIC' && (
-            <NFormItem label="教材：">
-              <NSpace class={styles.spaceSection}>
-                {catchStore.getAllMusicCategories.map((music: any) => (
-                  <NButton
-                    secondary={forms.bookVersionId === music.id}
-                    quaternary={forms.bookVersionId !== music.id}
-                    strong
-                    focusable={false}
-                    type={
-                      forms.bookVersionId === music.id ? 'primary' : 'default'
-                    }
-                    onClick={() => {
-                      forms.bookVersionId = music.id;
-                      onSearch();
-                    }}>
-                    {music.name}
-                  </NButton>
-                ))}
-              </NSpace>
-            </NFormItem>
+            <div class={[styles.collapsSection]}>
+              <NFormItem label="教材：">
+                <div
+                  class={[
+                    styles.collapseWrap,
+                    isCollapse.value ? '' : styles.isHidden
+                  ]}
+                  ref={collapseWrapRef}>
+                  <NSpace class={[styles.spaceSection]}>
+                    {catchStore.getAllMusicCategories.map((music: any) => (
+                      <NButton
+                        ref={musicCateRef}
+                        secondary={forms.bookVersionId === music.id}
+                        quaternary={forms.bookVersionId !== music.id}
+                        strong
+                        focusable={false}
+                        type={
+                          forms.bookVersionId === music.id
+                            ? 'primary'
+                            : 'default'
+                        }
+                        onClick={() => {
+                          forms.bookVersionId = music.id;
+                          onSearch();
+                        }}>
+                        {music.name}
+                      </NButton>
+                    ))}
+                    {line.value > 1 && (
+                      <div
+                        style={{
+                          height: 'var(--n-blank-height)',
+                          position: 'absolute',
+                          display: 'flex',
+                          alignItems: 'center'
+                        }}
+                        onClick={() => {
+                          setCollapse(!isCollapse.value);
+                        }}>
+                        <NImage
+                          previewDisabled
+                          src={isCollaose}
+                          class={[
+                            styles.collaoseBtn,
+                            isCollapse.value ? styles.isStart : ''
+                          ]}></NImage>
+                      </div>
+                    )}
+                  </NSpace>
+                </div>
+              </NFormItem>
+            </div>
+            // <NFormItem label="教材：">
+            //   <NSpace class={styles.spaceSection}>
+            //     {catchStore.getAllMusicCategories.map((music: any) => (
+            //       <NButton
+            //         secondary={forms.bookVersionId === music.id}
+            //         quaternary={forms.bookVersionId !== music.id}
+            //         strong
+            //         focusable={false}
+            //         type={
+            //           forms.bookVersionId === music.id ? 'primary' : 'default'
+            //         }
+            //         onClick={() => {
+            //           forms.bookVersionId = music.id;
+            //           onSearch();
+            //         }}>
+            //         {music.name}
+            //       </NButton>
+            //     ))}
+            //   </NSpace>
+            // </NFormItem>
           )}
           <NFormItem label="乐器：">
             <NSpace class={styles.spaceSection}>

src/views/natural-resources/components/my-resources/index.module.less

@@ -51,6 +51,7 @@
 
       .n-button--primary-type {
         color: #131415;
+        background-color: #D2ECFF !important;
       }
     }
 
@@ -216,4 +217,4 @@
       }
     }
   }
-}
+}

src/views/natural-resources/components/share-resources/search-group-resources.tsx

@@ -40,7 +40,6 @@ export default defineComponent({
       divDomList.value = [...new Set(divDomList.value)];
       let offsetLeft = -1;
       divDomList.value.forEach((item: any, index: number) => {
-        console.log(item.offsetLeft);
         if (index === 0) {
           line.value = 1;
           offsetLeft = item.offsetLeft;
@@ -52,7 +51,6 @@ export default defineComponent({
           if (line.value > 1) {
             //从第3行开始 隐藏标签
             item.style.display = 'none';
-
             // 显示展开按钮  class名chu是在前面动态添加的
           } else {
             item.style.display = 'block';
@@ -69,16 +67,10 @@ export default defineComponent({
       await catchStore.getSubjects();
 
       // 这里开始
-      // musicCateRef
-
       orginHeight.value = collapseWrapRef.value.offsetHeight;
       hiddenHeight.value = collapseWrapRef.value.offsetHeight / line.value;
       // 默认隐藏
       getLive();
-      console.log(
-        divDomList.value[1].offsetHeight,
-        collapseWrapRef.value.offsetHeight / 3
-      );
     });
     return () => (
       <div class={styles.searchGroup}>
@@ -140,23 +132,26 @@ export default defineComponent({
                         {music.name}
                       </NButton>
                     ))}
-                    <div
-                      style={{
-                        height: '100%',
-                        display: 'flex',
-                        alignItems: 'center'
-                      }}
-                      onClick={() => {
-                        setCollapse(!isCollapse.value);
-                      }}>
-                      <NImage
-                        previewDisabled
-                        src={isCollaose}
-                        class={[
-                          styles.collaoseBtn,
-                          isCollapse.value ? styles.isStart : ''
-                        ]}></NImage>
-                    </div>
+                    {line.value > 1 && (
+                      <div
+                        style={{
+                          height: 'var(--n-blank-height)',
+                          position: 'absolute',
+                          display: 'flex',
+                          alignItems: 'center'
+                        }}
+                        onClick={() => {
+                          setCollapse(!isCollapse.value);
+                        }}>
+                        <NImage
+                          previewDisabled
+                          src={isCollaose}
+                          class={[
+                            styles.collaoseBtn,
+                            isCollapse.value ? styles.isStart : ''
+                          ]}></NImage>
+                      </div>
+                    )}
                   </NSpace>
                 </div>
               </NFormItem>

src/views/natural-resources/index.module.less

@@ -15,7 +15,7 @@
 
     .n-tabs-tab {
       color: #8B8D98;
-      font-size: max(22px, 16px);
+      font-size: max(22px, 14Px);
       padding-top: 0;
       padding-bottom: 6px;
       line-height: 22px;
@@ -154,4 +154,4 @@
       }
     }
   }
-}
+}

src/views/natural-resources/index.tsx

@@ -14,7 +14,7 @@ export default defineComponent({
           defaultValue="myResources"
           paneClass={styles.paneTitle}
           justifyContent="center"
-          animated
+          // animated
           paneWrapperClass={styles.paneWrapperContainer}>
           <NTabPane
             name="myResources"

src/views/prepare-lessons/components/directory-main/images/icon-upload-bg.svg

@@ -1,30 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg width="158px" height="224px" viewBox="0 0 158 224" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <title>编组 7</title>
-    <defs>
-        <rect id="path-1" x="0" y="0" width="158" height="224"></rect>
-    </defs>
-    <g id="所有页面" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="46、选择教材" transform="translate(-470.000000, -330.000000)">
-            <g id="编组-4" transform="translate(385.000000, 127.000000)">
-                <g id="编组-2" transform="translate(57.000000, 203.000000)">
-                    <g id="编组-7" transform="translate(28.000000, 0.000000)">
-                        <mask id="mask-2" fill="white">
-                            <use xlink:href="#path-1"></use>
-                        </mask>
-                        <use id="蒙版" fill="#F8F9FB" xlink:href="#path-1"></use>
-                        <g id="编组" mask="url(#mask-2)" fill="#859BD4">
-                            <g transform="translate(54.000000, 65.000000)" id="矩形">
-                                <rect x="0" y="21" width="50" height="8" rx="4"></rect>
-                                <rect transform="translate(25.000000, 25.000000) rotate(-270.000000) translate(-25.000000, -25.000000) " x="-5.45696821e-12" y="21" width="50" height="8" rx="4"></rect>
-                            </g>
-                        </g>
-                        <text id="添加自定义教材" mask="url(#mask-2)" font-family="PingFangSC-Regular, PingFang SC" font-size="18" font-weight="normal" fill="#859BD4">
-                            <tspan x="16" y="154">添加自定义教材</tspan>
-                        </text>
-                    </g>
-                </g>
-            </g>
-        </g>
-    </g>
-</svg>

src/views/prepare-lessons/components/directory-main/select-lessonware/index.tsx

@@ -20,7 +20,7 @@ import {
   lessonCoursewareRemove,
   bookVersionPage
 } from '../../../api';
-import iconUploadBg from '../images/icon-upload-bg.svg';
+import iconUploadBg from '../images/icon-upload-bg.png';
 import { useCatchStore } from '/src/store/modules/catchData';
 import { useThrottleFn } from '@vueuse/core';
 

src/views/prepare-lessons/components/lesson-main/index.module.less

@@ -10,7 +10,7 @@
 
     .n-tabs-tab {
       color: #8B8D98;
-      font-size: max(20px, 16px);
+      font-size: max(20px, 14Px);
       padding-top: 12px;
       padding-bottom: 8px;
       line-height: 28px;
@@ -36,4 +36,4 @@
       padding-top: 4px !important;
     }
   }
-}
+}

src/views/prepare-lessons/components/resource-main/index.module.less

@@ -8,11 +8,12 @@
 
     .n-tabs-nav {
       padding: 12px 20px 24px;
+      position: relative;
     }
 
     .n-tabs-tab {
       color: #8B8D98;
-      font-size: max(16px, 14px);
+      font-size: max(16px, 14Px);
       padding-top: 12px;
       padding-bottom: 6px;
       line-height: 22px;
@@ -37,9 +38,15 @@
     .n-tab-pane {
       padding-top: 0 !important;
     }
+
+    .n-tabs-nav__suffix {
+      padding-left: 0 !important;
+    }
   }
 
   .iconScreen {
+    position: absolute;
+    right: 20px;
     font-size: 18px;
     color: var(--n-color);
     font-weight: bold;
@@ -71,4 +78,4 @@
 
 .trainEditModal {
   width: 494px;
-}
+}

src/views/prepare-lessons/model/select-music/index.module.less

@@ -10,7 +10,7 @@
 
     .n-tabs-tab {
       color: #8B8D98;
-      font-size: 22px;
+      font-size: max(22px, 14Px);
       padding-top: 12px;
       padding-bottom: 6px;
       line-height: 22px;
@@ -139,4 +139,37 @@
   &>div {
     line-height: var(--n-blank-height);
   }
+}
+
+.collapseWrap {
+  width: 98%;
+  display: flex;
+  flex-direction: row;
+  align-items: flex-end;
+
+}
+
+.collaoseBtn {
+  width: 32px;
+  height: 32px;
+  cursor: pointer;
+}
+
+.collaoseBtn.isStart {
+  transform: rotate(-180deg);
+}
+
+.collapsSection {
+  padding-top: 3px;
+}
+
+.isHidden {
+  overflow: hidden;
+  transition: 1s all ease-in;
+}
+
+.hideButton {
+  visibility: hidden;
+  height: 0 !important;
+  line-height: 0 !important;
 }

src/views/prepare-lessons/model/select-music/search-group.tsx

@@ -1,9 +1,10 @@
-import { defineComponent, reactive, onMounted } from 'vue';
+import { defineComponent, reactive, onMounted, ref } from 'vue';
 import styles from './index.module.less';
-import { NButton, NForm, NFormItem, NSpace } from 'naive-ui';
+import { NButton, NForm, NFormItem, NImage, NSpace } from 'naive-ui';
 import TheSearch from '/src/components/TheSearch';
 import { useCatchStore } from '/src/store/modules/catchData';
 import { useThrottleFn } from '@vueuse/core';
+import isCollaose from '/src/views/natural-resources/images/isCollaose.png';
 
 export default defineComponent({
   name: 'search-group',
@@ -23,16 +24,121 @@ export default defineComponent({
       onSearch();
     }, 500);
 
+    const collapseWrapRef = ref();
+    const divDomList = ref([] as any);
+    const orginHeight = ref(0);
+    const hiddenHeight = ref(0);
+    const line = ref(0);
+    const isCollapse = ref(false);
+    const loadingCollapse = ref(false); // 是否加载完成
+    const musicCateRef = (el: any) => {
+      if (el?.selfElRef) {
+        divDomList.value.push(el.selfElRef.parentNode);
+      }
+    };
+    const setCollapse = (flag: boolean) => {
+      isCollapse.value = flag;
+      getLive();
+    };
+    const getLive = () => {
+      try {
+        divDomList.value = [...new Set(divDomList.value)];
+        let offsetLeft = -1;
+        divDomList.value.forEach((item: any, index: number) => {
+          if (index === 0) {
+            line.value = 1;
+            offsetLeft = item.offsetLeft;
+          } else if (item.offsetLeft === offsetLeft && index != 0) {
+            // 如果某个标签的offsetLeft和第一个标签的offsetLeft相等  说明增加了一行
+            line.value++;
+          }
+          if (!isCollapse.value) {
+            if (line.value > 1) {
+              //从第3行开始 隐藏标签
+              item.style.display = 'none';
+
+              // 显示展开按钮  class名chu是在前面动态添加的
+            } else {
+              item.style.display = 'block';
+            }
+          } else {
+            item.style.display = 'block';
+          }
+        });
+        loadingCollapse.value = true;
+      } catch {
+        //
+      }
+    };
+
     onMounted(async () => {
       // 获取教材分类列表
       await catchStore.getMusicSheetCategory();
       // 获取声部列表
       await catchStore.getSubjects();
+
+      orginHeight.value = collapseWrapRef.value.offsetHeight;
+      hiddenHeight.value = collapseWrapRef.value.offsetHeight / line.value;
+      // 默认隐藏
+      getLive();
     });
     return () => (
       <div class={styles.searchGroup}>
         <NForm labelAlign="left" labelPlacement="left">
-          <NFormItem label="教材：">
+          <div class={styles.collapsSection}>
+            <NFormItem label="教材：">
+              <div
+                class={[
+                  styles.collapseWrap,
+                  loadingCollapse.value ? '' : styles.hideButton,
+                  isCollapse.value ? '' : styles.isHidden
+                ]}
+                ref={collapseWrapRef}>
+                <NSpace class={[styles.spaceSection]}>
+                  {catchStore.getAllMusicCategories.map((music: any) => (
+                    <NButton
+                      ref={musicCateRef}
+                      secondary={forms.musicSheetCategoriesId === music.id}
+                      quaternary={forms.musicSheetCategoriesId !== music.id}
+                      strong
+                      focusable={false}
+                      type={
+                        forms.musicSheetCategoriesId === music.id
+                          ? 'primary'
+                          : 'default'
+                      }
+                      onClick={() => {
+                        forms.musicSheetCategoriesId = music.id;
+                        throttledFn();
+                      }}>
+                      {music.name}
+                    </NButton>
+                  ))}
+                  {line.value > 1 && (
+                    <div
+                      style={{
+                        height: 'var(--n-blank-height)',
+                        position: 'absolute',
+                        display: 'flex',
+                        alignItems: 'center'
+                      }}
+                      onClick={() => {
+                        setCollapse(!isCollapse.value);
+                      }}>
+                      <NImage
+                        previewDisabled
+                        src={isCollaose}
+                        class={[
+                          styles.collaoseBtn,
+                          isCollapse.value ? styles.isStart : ''
+                        ]}></NImage>
+                    </div>
+                  )}
+                </NSpace>
+              </div>
+            </NFormItem>
+          </div>
+          {/* <NFormItem label="教材：">
             <NSpace class={styles.spaceSection}>
               {catchStore.getAllMusicCategories.map((music: any) => (
                 <NButton
@@ -53,7 +159,7 @@ export default defineComponent({
                 </NButton>
               ))}
             </NSpace>
-          </NFormItem>
+          </NFormItem> */}
           <TheSearch
             class={styles.inputSearch}
             round

src/views/prepare-lessons/model/select-resources/index.module.less

@@ -12,7 +12,7 @@
 
     .n-tabs-tab {
       color: #8B8D98;
-      font-size: 22px;
+      font-size: max(22px, 14Px);
       padding-top: 12px;
       padding-bottom: 6px;
       line-height: 22px;

src/views/prepare-lessons/model/select-resources/select-item/index.tsx

@@ -118,7 +118,6 @@ export default defineComponent({
       //   negativeText: '取消',
       //   onPositiveClick: async () => {
       try {
-        console.log(item, 'any');
         const temp: any = [];
         prepareStore.getCoursewareList.forEach((item: any) => {
           temp.push({

src/views/prepare-lessons/model/select-resources/select-item/resource-search-group/index.tsx

@@ -1,4 +1,11 @@
-import { PropType, defineComponent, onMounted, reactive, ref } from 'vue';
+import {
+  PropType,
+  defineComponent,
+  nextTick,
+  onMounted,
+  reactive,
+  ref
+} from 'vue';
 import styles from './index.module.less';
 import { NButton, NForm, NFormItem, NImage, NSpace } from 'naive-ui';
 import { resourceTypeArray } from '/src/utils/searchArray';
@@ -48,30 +55,34 @@ export default defineComponent({
       getLive();
     };
     const getLive = () => {
-      divDomList.value = [...new Set(divDomList.value)];
-      let offsetLeft = -1;
-      divDomList.value.forEach((item: any, index: number) => {
-        if (index === 0) {
-          line.value = 1;
-          offsetLeft = item.offsetLeft;
-        } else if (item.offsetLeft === offsetLeft && index != 0) {
-          // 如果某个标签的offsetLeft和第一个标签的offsetLeft相等  说明增加了一行
-          line.value++;
-        }
-        if (!isCollapse.value) {
-          if (line.value > 1) {
-            //从第3行开始 隐藏标签
-            item.style.display = 'none';
+      try {
+        divDomList.value = [...new Set(divDomList.value)];
+        let offsetLeft = -1;
+        divDomList.value.forEach((item: any, index: number) => {
+          if (index === 0) {
+            line.value = 1;
+            offsetLeft = item.offsetLeft;
+          } else if (item.offsetLeft === offsetLeft && index != 0) {
+            // 如果某个标签的offsetLeft和第一个标签的offsetLeft相等  说明增加了一行
+            line.value++;
+          }
+          if (!isCollapse.value) {
+            if (line.value > 1) {
+              //从第3行开始 隐藏标签
+              item.style.display = 'none';
 
-            // 显示展开按钮  class名chu是在前面动态添加的
+              // 显示展开按钮  class名chu是在前面动态添加的
+            } else {
+              item.style.display = 'block';
+            }
           } else {
             item.style.display = 'block';
           }
-        } else {
-          item.style.display = 'block';
-        }
-      });
-      loadingCollapse.value = true;
+        });
+        loadingCollapse.value = true;
+      } catch {
+        //
+      }
     };
     onMounted(async () => {
       if (props.type === 'myResources' || props.type === 'myCollect') {
@@ -94,11 +105,12 @@ export default defineComponent({
 
       // 这里开始
       // musicCateRef
-
-      orginHeight.value = collapseWrapRef.value.offsetHeight;
-      hiddenHeight.value = collapseWrapRef.value.offsetHeight / line.value;
-      // 默认隐藏
-      getLive();
+      if (forms.type === 'MUSIC') {
+        orginHeight.value = collapseWrapRef.value.offsetHeight;
+        hiddenHeight.value = collapseWrapRef.value.offsetHeight / line.value;
+        // 默认隐藏
+        getLive();
+      }
     });
     return () => (
       <div class={styles.searchGroup}>
@@ -114,6 +126,20 @@ export default defineComponent({
                 onClick={() => {
                   forms.type = item.value;
                   onSearch();
+
+                  try {
+                    nextTick(() => {
+                      if (forms.type === 'MUSIC') {
+                        orginHeight.value = collapseWrapRef.value.offsetHeight;
+                        hiddenHeight.value =
+                          collapseWrapRef.value.offsetHeight / line.value;
+                        // 默认隐藏
+                        getLive();
+                      }
+                    });
+                  } catch {
+                    //
+                  }
                 }}>
                 {item.label}
               </NButton>
@@ -160,23 +186,26 @@ export default defineComponent({
                         {music.name}
                       </NButton>
                     ))}
-                    <div
-                      style={{
-                        display: 'flex',
-                        alignItems: 'center',
-                        height: '100%'
-                      }}
-                      onClick={() => {
-                        setCollapse(!isCollapse.value);
-                      }}>
-                      <NImage
-                        previewDisabled
-                        src={isCollaose}
-                        class={[
-                          styles.collaoseBtn,
-                          isCollapse.value ? styles.isStart : ''
-                        ]}></NImage>
-                    </div>
+                    {line.value > 1 && (
+                      <div
+                        style={{
+                          height: 'var(--n-blank-height)',
+                          position: 'absolute',
+                          display: 'flex',
+                          alignItems: 'center'
+                        }}
+                        onClick={() => {
+                          setCollapse(!isCollapse.value);
+                        }}>
+                        <NImage
+                          previewDisabled
+                          src={isCollaose}
+                          class={[
+                            styles.collaoseBtn,
+                            isCollapse.value ? styles.isStart : ''
+                          ]}></NImage>
+                      </div>
+                    )}
                   </NSpace>
                 </div>
               </NFormItem>

src/views/setting/components/schoolInfo/index.module.less

@@ -277,7 +277,12 @@
     }
 
     &.addTeacherTitle {
-      top: -14px;
+      top: -12px;
+      height: 40px;
+
+      img {
+        height: 40px
+      }
     }
   }
 
@@ -336,7 +341,7 @@
         width: 314px;
         height: 323px;
         background: #ffffff;
-        border-radius: 17px;
+        border-radius: 14px;
 
         display: flex;
         flex-direction: column;
@@ -453,4 +458,4 @@
       cursor: pointer;
     }
   }
-}
+}

src/views/setting/components/schoolInfo/index.tsx

@@ -113,11 +113,7 @@ export default defineComponent({
           key: 'titleImg',
           render: (row: any) => (
             <NSpace>
-              <NButton
-                type="primary"
-                quaternary
-                size="small"
-                onClick={() => onResetPassword(row)}>
+              <NButton type="primary" text onClick={() => onResetPassword(row)}>
                 重置密码
               </NButton>
 
@@ -125,16 +121,14 @@ export default defineComponent({
                 <NButton
                   disabled={row.jobType === 'ADMIN'}
                   type="primary"
-                  quaternary
-                  size="small"
+                  text
                   onClick={() => handleChange(row)}>
                   冻结
                 </NButton>
               ) : (
                 <NButton
                   class={styles.errorBtn}
-                  quaternary
-                  size="small"
+                  text
                   onClick={() => handleChange(row)}>
                   解冻
                 </NButton>

src/views/setting/index.module.less

@@ -9,14 +9,14 @@
   .customTabs {
     :global {
       .n-tabs-tab--active {
-        font-size: max(18px, 16px) !important;
+        font-size: max(18px, 14Px) !important;
 
         font-weight: 600 !important;
         color: #131415 !important;
       }
 
       .n-tabs-tab {
-        font-size: max(18px, 16px);
+        font-size: max(18px, 14Px);
         padding: 8px 0 !important;
         font-weight: 400;
         min-width: 50px;
@@ -294,4 +294,4 @@
 .submitBtm {
   width: 45%;
   height: 47px;
-}
+}

src/views/studentList/index.module.less

@@ -533,10 +533,11 @@
   .btn {
     --n-padding: 0 36px !important;
     --n-height: 45px !important;
+    --n-border-radius: 8px !important;
   }
 }
 
 
 .wordDetailModel {
   width: 1012px;
-}
+}

src/views/xiaoku-music/index.module.less

@@ -93,14 +93,17 @@
 }
 
 .musicList {
-  width: 548px;
+  width: 512px;
   display: flex;
   // height: 100%;
   overflow-x: hidden;
   overflow-y: auto;
-  min-width: 330px;
+  // min-width: 330px;
   // max-height: 100vh;
   min-height: 71vh;
+  margin-right: 32px;
+  background-color: #fff;
+  border-radius: 16px;
 
   &::-webkit-scrollbar {
     width: 0;
@@ -108,11 +111,14 @@
   }
 
   .wrapList {
-    width: 512px;
-    min-width: 294px;
-    min-height: 100%;
-    background: #fff;
-    border-radius: 16px;
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+    // width: 512px;
+    // min-width: 294px;
+    // min-height: 100%;
+    // background: #fff;
+    // border-radius: 16px;
   }
 
   .empty {
@@ -125,6 +131,7 @@
 }
 
 .itemContainer {
+  width: 100%;
   // border-radius: 16px;
   padding: 4px 8px;
   background-color: #fff;
@@ -134,7 +141,7 @@
   }
 
   &:last-child {
-    border-radius: 0 0 16px 16px;
+    // border-radius: 0 0 16px 16px;
     padding-bottom: 8px;
   }
 }
@@ -240,7 +247,7 @@
   .arrow {
     position: absolute;
     top: 50%;
-    right: 0;
+    right: 12px;
     transform: translate(124%, -50%);
     opacity: 0;
   }

src/views/xiaoku-music/index.tsx

@@ -68,7 +68,7 @@ export default defineComponent({
     });
     const showGuide = ref(false);
     const userStore = useUserStore();
-    let musicsrc = ''
+    let musicsrc = '';
     const getSubjects = async () => {
       const res = await api_subjectList();
       if (Array.isArray(res?.data)) {
@@ -153,16 +153,19 @@ export default defineComponent({
     };
     /** 选中的item */
     const activeItem = computed(() => {
-
       if (data.list[data.listActive]) {
         const origin = /(localhost|192)/.test(location.host)
           ? 'https://dev.kt.colexiu.com'
           : location.origin;
-        console.log(data.list[data.listActive].xmlFileUrl, 'data.list[data.listActive]')
-        musicsrc = `${origin}/instrument?modelType=practise&id=${data.list[data.listActive].xmlFileUrl}&Authorization=${userStore.getToken}/#/preview`;
-
+        console.log(
+          data.list[data.listActive].xmlFileUrl,
+          'data.list[data.listActive]'
+        );
+        musicsrc = `${origin}/instrument?modelType=practise&id=${
+          data.list[data.listActive].xmlFileUrl
+        }&Authorization=${userStore.getToken}/#/preview`;
       } else {
-        musicsrc = ''
+        musicsrc = '';
       }
 
       return data.list[data.listActive] || {};
@@ -287,8 +290,6 @@ export default defineComponent({
                           onClick={() => handleChange(item)}>
                           <div class={styles.img}>
                             <NImage
-                              width={60}
-                              height={60}
                               lazy
                               objectFit="cover"
                               previewDisabled={true}
@@ -300,7 +301,7 @@ export default defineComponent({
                             <PlayLoading
                               class={[
                                 data.listActive === index &&
-                                  data.playState === 'play'
+                                data.playState === 'play'
                                   ? ''
                                   : styles.showPlayLoading
                               ]}
@@ -328,7 +329,7 @@ export default defineComponent({
                               <img
                                 src={
                                   data.listActive === index &&
-                                    data.playState === 'play'
+                                  data.playState === 'play'
                                     ? icon_pause
                                     : icon_play
                                 }
@@ -349,7 +350,7 @@ export default defineComponent({
                               <img
                                 src={
                                   data.listActive === index &&
-                                    data.playState === 'play'
+                                  data.playState === 'play'
                                     ? icon_pause
                                     : icon_play
                                 }
@@ -413,7 +414,7 @@ export default defineComponent({
                 <div class={styles.staffImgs}>
                   <TransitionGroup name="van-fade">
                     {activeItem.value?.musicSvg ||
-                      activeItem.value?.musicImg ? (
+                    activeItem.value?.musicImg ? (
                       (activeItem.value?.musicSvg || activeItem.value?.musicImg)
                         ?.split(',')
                         .map((item, index) => {