修改样式

src/components/card-preview/rhythm-modal/index.module.less

@@ -1,15 +1,15 @@
-.musicScore {
-  width: 100%;
-  height: 518px;
-
-  iframe {
-    width: inherit;
-    height: inherit;
-
-    :global {
-      .headTopBackBtn {
-        display: none;
-      }
-    }
-  }
-}
+.musicScore {
+  width: 100%;
+  height: 518px;
+
+  iframe {
+    width: inherit;
+    height: inherit;
+
+    :global {
+      .headTopBackBtn {
+        display: none;
+      }
+    }
+  }
+}

src/components/card-preview/rhythm-modal/index.tsx

@@ -1,49 +1,49 @@
-import { defineComponent, ref } from 'vue';
-import styles from './index.module.less';
-import { useUserStore } from '/src/store/modules/users';
-import { vaildMusicScoreUrl } from '/src/utils/urlUtils';
-import { iframeDislableKeyboard } from '/src/utils';
-
-export default defineComponent({
-  name: 'song-modal',
-  props: {
-    item: {
-      type: Object,
-      default: () => ({})
-    }
-  },
-  setup(props) {
-    const userStore = useUserStore();
-    const iframeRef = ref();
-    const isLoaded = ref(false);
-    // const origin = /(localhost|192)/.test(location.host)
-    //   ? 'http://localhost:9002'
-    //   : location.origin;
-
-    let src = `${origin}/classroom-app/#/tempo-practice?v=${Date.now()}&Authorization=${
-      userStore.getToken
-    }&platform=modal`;
-    if (/(localhost|192)/.test(location.host)) {
-      src = `http://localhost:9002/#/tempo-practice?v=${Date.now()}&Authorization=${
-        userStore.getToken
-      }&platform=modal`;
-    }
-    if (props.item.dataJson) {
-      src += '&dataJson=' + props.item.dataJson;
-    }
-    return () => (
-      <div class={styles.musicScore}>
-        <iframe
-          ref={iframeRef}
-          onLoad={(val: any) => {
-            // emit('setIframe', iframeRef.value);
-            isLoaded.value = true;
-            iframeDislableKeyboard(val.target);
-          }}
-          class={[styles.container, 'musicIframe']}
-          frameborder="0"
-          src={src}></iframe>
-      </div>
-    );
-  }
-});
+import { defineComponent, ref } from 'vue';
+import styles from './index.module.less';
+import { useUserStore } from '/src/store/modules/users';
+import { vaildMusicScoreUrl } from '/src/utils/urlUtils';
+import { iframeDislableKeyboard } from '/src/utils';
+
+export default defineComponent({
+  name: 'song-modal',
+  props: {
+    item: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  setup(props) {
+    const userStore = useUserStore();
+    const iframeRef = ref();
+    const isLoaded = ref(false);
+    // const origin = /(localhost|192)/.test(location.host)
+    //   ? 'http://localhost:9002'
+    //   : location.origin;
+
+    let src = `${origin}/classroom-app/#/tempo-practice?v=${Date.now()}&Authorization=${
+      userStore.getToken
+    }&platform=modal`;
+    if (/(localhost|192)/.test(location.host)) {
+      src = `http://192.168.3.220:9002/#/tempo-practice?v=${Date.now()}&Authorization=${
+        userStore.getToken
+      }&platform=modal`;
+    }
+    if (props.item.dataJson) {
+      src += '&dataJson=' + props.item.dataJson;
+    }
+    return () => (
+      <div class={styles.musicScore}>
+        <iframe
+          ref={iframeRef}
+          onLoad={(val: any) => {
+            // emit('setIframe', iframeRef.value);
+            isLoaded.value = true;
+            iframeDislableKeyboard(val.target);
+          }}
+          class={[styles.container, 'musicIframe']}
+          frameborder="0"
+          src={src}></iframe>
+      </div>
+    );
+  }
+});

src/views/attend-class/component/rhythm-modal/index.tsx

@@ -1,63 +1,63 @@
-import { defineComponent, ref, watch } from 'vue';
-import styles from './index.module.less';
-import { useUserStore } from '/src/store/modules/users';
-import { vaildMusicScoreUrl } from '/src/utils/urlUtils';
-import { iframeDislableKeyboard } from '/src/utils';
-
-export default defineComponent({
-  name: 'song-modal',
-  props: {
-    item: {
-      type: Object,
-      default: () => ({})
-    },
-    activeStatus: {
-      type: Boolean,
-      default: false
-    },
-    imagePos: {
-      type: String,
-      default: 'left'
-    }
-  },
-  emits: ['setIframe'],
-  setup(props, { emit }) {
-    const userStore = useUserStore();
-    const iframeRef = ref();
-    const isLoaded = ref(false);
-    let src = `${
-      location.origin
-    }/classroom-app/#/tempo-practice?v=${+new Date()}&platform=modal&dataJson=${
-      props.item.dataJson
-    }&Authorization=${userStore.getToken}&win=pc&imagePos=${props.imagePos}`;
-    if (/(localhost)/.test(location.host)) {
-      src = `http://localhost:9002/#/tempo-practice?v=${+new Date()}&platform=modal&dataJson=${
-        props.item.dataJson
-      }&Authorization=${userStore.getToken}&win=pc&imagePos=${props.imagePos}`;
-    }
-
-    watch(
-      () => props.activeStatus,
-      () => {
-        if (!props.activeStatus) {
-          iframeRef.value.contentWindow?.postMessage({ api: 'resetPlay' }, '*');
-        }
-      }
-    );
-
-    return () => (
-      <div class={styles.musicScore}>
-        <iframe
-          ref={iframeRef}
-          onLoad={(val: any) => {
-            emit('setIframe', iframeRef.value);
-            isLoaded.value = true;
-            iframeDislableKeyboard(val.target);
-          }}
-          class={[styles.container, 'musicIframe']}
-          frameborder="0"
-          src={src}></iframe>
-      </div>
-    );
-  }
-});
+import { defineComponent, ref, watch } from 'vue';
+import styles from './index.module.less';
+import { useUserStore } from '/src/store/modules/users';
+import { vaildMusicScoreUrl } from '/src/utils/urlUtils';
+import { iframeDislableKeyboard } from '/src/utils';
+
+export default defineComponent({
+  name: 'song-modal',
+  props: {
+    item: {
+      type: Object,
+      default: () => ({})
+    },
+    activeStatus: {
+      type: Boolean,
+      default: false
+    },
+    imagePos: {
+      type: String,
+      default: 'left'
+    }
+  },
+  emits: ['setIframe'],
+  setup(props, { emit }) {
+    const userStore = useUserStore();
+    const iframeRef = ref();
+    const isLoaded = ref(false);
+    let src = `${
+      location.origin
+    }/classroom-app/#/tempo-practice?v=${+new Date()}&platform=modal&dataJson=${
+      props.item.dataJson
+    }&Authorization=${userStore.getToken}&win=pc&imagePos=${props.imagePos}`;
+    if (/(localhost|192)/.test(location.host)) {
+      src = `http://192.168.3.220:9002/#/tempo-practice?v=${+new Date()}&platform=modal&dataJson=${
+        props.item.dataJson
+      }&Authorization=${userStore.getToken}&win=pc&imagePos=${props.imagePos}`;
+    }
+
+    watch(
+      () => props.activeStatus,
+      () => {
+        if (!props.activeStatus) {
+          iframeRef.value.contentWindow?.postMessage({ api: 'resetPlay' }, '*');
+        }
+      }
+    );
+
+    return () => (
+      <div class={styles.musicScore}>
+        <iframe
+          ref={iframeRef}
+          onLoad={(val: any) => {
+            emit('setIframe', iframeRef.value);
+            isLoaded.value = true;
+            iframeDislableKeyboard(val.target);
+          }}
+          class={[styles.container, 'musicIframe']}
+          frameborder="0"
+          src={src}></iframe>
+      </div>
+    );
+  }
+});

src/views/attend-class/index.tsx

@@ -1879,6 +1879,7 @@ export default defineComponent({
                 <NTooltip
                   showArrow={false}
                   placement="left"
+                  show={item.id === 15 ? undefined : false}
                   class={[
                     item.id === 15
                       ? 'columnItemTooltip rightColumnItemTooltip'
@@ -1909,7 +1910,7 @@ export default defineComponent({
             </div>
           ))}
         </div>
-        <NTooltip showArrow={false} placement="left">
+        <NTooltip showArrow={false} placement="left" show={false}>
           {{
             trigger: () => (
               <div
@@ -1952,6 +1953,7 @@ export default defineComponent({
                 <NTooltip
                   showArrow={false}
                   placement="right"
+                  show={item.id === 15 ? undefined : false}
                   class={[item.id === 15 ? 'columnItemTooltip' : '']}>
                   {{
                     trigger: () => <img src={item.icon} />,
@@ -1965,18 +1967,17 @@ export default defineComponent({
                             </div>
                           ))}
                         </div>
-                      ) : item.id === 1 && data.type === 'preview' ? (
-                        item.name2
                       ) : (
-                        item.name
+                        ''
                       )
                   }}
+                  {/* : item.id === 1 && data.type === 'preview' ? ( item.name2 ) */}
                 </NTooltip>
               </div>
             </div>
           ))}
         </div>
-        <NTooltip showArrow={false} placement="right">
+        <NTooltip showArrow={false} placement="right" show={false}>
           {{
             trigger: () => (
               <div

src/views/attend-class/model/class-work/index.module.less

@@ -1,164 +1,164 @@
-.btnGroup {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  // padding-left: 22px !important;
-  height: 40px;
-  // padding-right: 22px !important;
-  padding: 0 40px;
-
-  margin: 18px 0;
-
-  .addBtnIcon {
-    width: 13px !important;
-    height: 14px !important;
-  }
-
-  .addPreset {
-    padding: 0 16px 0 10px !important;
-
-    :global {
-      .n-button__icon {
-        margin-right: 0;
-      }
-    }
-  }
-
-  :global {
-    .n-base-selection {
-      --n-height: max(40px, 36Px) !important;
-      width: 160px;
-      font-size: 15px;
-      border-radius: 8px !important;
-    }
-
-    .n-base-selection-input__content {
-      font-size: max(15px, 13Px);
-    }
-
-    .n-button {
-      border-radius: 8px;
-      height: 38px;
-      font-size: max(18px, 13Px);
-      font-weight: 600 !important;
-      padding: 0 27px;
-    }
-
-
-
-    .n-button--default-type {
-      background: #E8F4FF;
-      color: #0378EC;
-
-      &:not(.n-button--disabled):hover {
-        background: #E8F4FF;
-      }
-
-      .n-button__border {
-        border: 1px solid #198CFE;
-      }
-    }
-
-    .n-button--error-type {
-      background: #FDEBED !important;
-      color: #EC3A4E !important;
-
-      &:not(.n-button--disabled):hover,
-      &:not(.n-button--disabled):active {
-        background: #FDEBED;
-        color: #EC3A4E;
-      }
-
-      .n-button__border {
-        border: 1px solid #EC3A4E;
-      }
-    }
-  }
-}
-
-.removeVisiable1 {
-  width: 432px;
-
-  :global {
-    .n-card-header {
-      font-size: max(22px, 16Px);
-    }
-  }
-
-  .studentRemove {
-    padding: 20px 40px 0;
-
-    p {
-      font-size: max(18px, 14Px);
-      color: #777777;
-      line-height: 30px;
-
-      span {
-        color: #EA4132;
-      }
-    }
-  }
-
-  .btnGroupModal {
-    padding: 32px 0;
-
-    :global {
-      .n-button {
-        height: 47px;
-        min-width: 156px;
-      }
-    }
-  }
-}
-
-.assignHomework {
-  width: 660px;
-}
-
-.listContainer {
-  padding-bottom: 24px;
-}
-
-.listSection {
-  padding: 0 40px;
-}
-
-.listSectionEmpty {
-  display: flex;
-  align-items: center;
-}
-
-.workVisiable {
-  width: 1258px;
-}
-
-.workContainer {
-  display: flex;
-  align-items: center;
-
-  .workTrain {
-    flex: 1;
-    height: 75vh;
-
-    &>div {
-      padding-top: 15px;
-    }
-  }
-
-  :global {
-    .train-container {
-      max-height: calc(var(--window-page-lesson-height) - 135px) !important;
-      // max-height: calc(var(--window-page-lesson-height) - 100px) !important;
-
-      .train-listSection {
-        min-height: calc(var(--window-page-lesson-height) - 135px) !important;
-      }
-    }
-  }
-
-  .resourceMain {
-    flex: 0 0 360px;
-    height: 75vh;
-    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.1);
-  }
+.btnGroup {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  // padding-left: 22px !important;
+  height: 40px;
+  // padding-right: 22px !important;
+  padding: 0 40px;
+
+  margin: 18px 0;
+
+  .addBtnIcon {
+    width: 13px !important;
+    height: 14px !important;
+  }
+
+  .addPreset {
+    padding: 0 16px 0 10px !important;
+
+    :global {
+      .n-button__icon {
+        margin-right: 0;
+      }
+    }
+  }
+
+  :global {
+    .n-base-selection {
+      --n-height: max(40px, 36Px) !important;
+      width: 160px;
+      font-size: 15px;
+      border-radius: 8px !important;
+    }
+
+    .n-base-selection-input__content {
+      font-size: max(15px, 13Px);
+    }
+
+    .n-button {
+      border-radius: 8px;
+      height: 38px;
+      font-size: max(18px, 13Px);
+      font-weight: 600 !important;
+      padding: 0 27px;
+    }
+
+
+
+    .n-button--default-type {
+      background: #E8F4FF;
+      color: #0378EC;
+
+      &:not(.n-button--disabled):hover {
+        background: #E8F4FF;
+      }
+
+      .n-button__border {
+        border: 1px solid #198CFE;
+      }
+    }
+
+    .n-button--error-type {
+      background: #FDEBED !important;
+      color: #EC3A4E !important;
+
+      &:not(.n-button--disabled):hover,
+      &:not(.n-button--disabled):active {
+        background: #FDEBED;
+        color: #EC3A4E;
+      }
+
+      .n-button__border {
+        border: 1px solid #EC3A4E;
+      }
+    }
+  }
+}
+
+.removeVisiable1 {
+  width: 432px;
+
+  :global {
+    .n-card-header {
+      font-size: max(22px, 16Px);
+    }
+  }
+
+  .studentRemove {
+    padding: 20px 40px 0;
+
+    p {
+      font-size: max(18px, 14Px);
+      color: #777777;
+      line-height: 30px;
+
+      span {
+        color: #EA4132;
+      }
+    }
+  }
+
+  .btnGroupModal {
+    padding: 32px 0;
+
+    :global {
+      .n-button {
+        height: 47px;
+        min-width: 156px;
+      }
+    }
+  }
+}
+
+.assignHomework {
+  width: 660px;
+}
+
+.listContainer {
+  padding-bottom: 24px;
+}
+
+.listSection {
+  padding: 0 40px;
+}
+
+.listSectionEmpty {
+  display: flex;
+  align-items: center;
+}
+
+.workVisiable {
+  width: 1358px;
+}
+
+.workContainer {
+  display: flex;
+  align-items: center;
+
+  .workTrain {
+    flex: 1;
+    height: 75vh;
+
+    &>div {
+      padding-top: 15px;
+    }
+  }
+
+  :global {
+    .train-container {
+      max-height: calc(var(--window-page-lesson-height) - 135px) !important;
+      // max-height: calc(var(--window-page-lesson-height) - 100px) !important;
+
+      .train-listSection {
+        min-height: calc(var(--window-page-lesson-height) - 135px) !important;
+      }
+    }
+  }
+
+  .resourceMain {
+    flex: 0 0 360px;
+    height: 75vh;
+    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.1);
+  }
 }

src/views/attend-class/model/train-settings/index.module.less

@@ -1,113 +1,113 @@
-.trainSettings {
-  .trainBtnGroup {
-    padding: 32px 0 40px;
-    justify-content: center !important;
-
-    :global {
-      .n-button {
-        height: 48px !important;
-        padding: 0 42px;
-      }
-    }
-  }
-
-  .searchGroup {
-    display: flex;
-    padding: 26px 40px 0;
-
-    .datetime {
-      margin-left: 40px;
-      display: inline-flex;
-      align-items: center;
-
-      label {
-        font-size: 15px;
-        color: #666666;
-        line-height: 21px;
-      }
-    }
-
-    :global {
-      .n-button {
-        border-radius: 8px;
-        height: 42px;
-        font-size: 17px;
-        font-weight: 600 !important;
-        padding: 0 27px;
-      }
-
-      .n-button--default-type {
-        background: #E8F4FF;
-        color: #0378EC;
-
-        &:not(.n-button--disabled):hover {
-          background: #E8F4FF;
-        }
-
-        .n-button__border {
-          border: 1px solid #198CFE;
-        }
-      }
-
-      .n-input {
-        border-radius: 8px !important;
-      }
-    }
-  }
-
-  .trainList {
-    margin-top: 28px;
-    max-height: 50vh;
-    padding: 0 40px;
-
-    .listSection {
-      min-height: 50vh;
-    }
-
-    .emptySection {
-      display: flex;
-      align-items: center;
-    }
-
-    :global {
-      .n-scrollbar-content {
-        display: flex;
-        gap: 24px;
-        flex-wrap: wrap;
-      }
-
-      .n-spin-container {
-        width: 100%;
-      }
-    }
-
-    .list {
-      display: flex;
-      flex-flow: row wrap;
-      justify-content: flex-start;
-      gap: 20px;
-    }
-  }
-}
-
-.trainEditModal {
-  width: 494px;
-}
-
-.selectMusicModal {
-  position: relative;
-  width: 1352px;
-
-  :global {
-    .n-card-header {
-      position: absolute;
-      top: 0;
-      left: 0;
-      right: 0;
-
-      .n-card-header__main {
-        color: #fff;
-      }
-    }
-  }
+.trainSettings {
+  .trainBtnGroup {
+    padding: 32px 0 40px;
+    justify-content: center !important;
+
+    :global {
+      .n-button {
+        height: 48px !important;
+        padding: 0 42px;
+      }
+    }
+  }
+
+  .searchGroup {
+    display: flex;
+    padding: 26px 40px 0;
+
+    .datetime {
+      margin-left: 40px;
+      display: inline-flex;
+      align-items: center;
+
+      label {
+        font-size: 15px;
+        color: #666666;
+        line-height: 21px;
+      }
+    }
+
+    :global {
+      .n-button {
+        border-radius: 8px;
+        height: 42px;
+        font-size: 17px;
+        font-weight: 600 !important;
+        padding: 0 27px;
+      }
+
+      .n-button--default-type {
+        background: #E8F4FF;
+        color: #0378EC;
+
+        &:not(.n-button--disabled):hover {
+          background: #E8F4FF;
+        }
+
+        .n-button__border {
+          border: 1px solid #198CFE;
+        }
+      }
+
+      .n-input {
+        border-radius: 8px !important;
+      }
+    }
+  }
+
+  .trainList {
+    margin-top: 28px;
+    max-height: 50vh;
+    padding: 0 40px;
+
+    .listSection {
+      min-height: 50vh;
+    }
+
+    .emptySection {
+      display: flex;
+      align-items: center;
+    }
+
+    :global {
+      .n-scrollbar-content {
+        display: flex;
+        gap: 24px;
+        flex-wrap: wrap;
+      }
+
+      .n-spin-container {
+        width: 100%;
+      }
+    }
+
+    .list {
+      display: flex;
+      flex-flow: row wrap;
+      justify-content: flex-start;
+      gap: 20px;
+    }
+  }
+}
+
+.trainEditModal {
+  width: 524px;
+}
+
+.selectMusicModal {
+  position: relative;
+  width: 1352px;
+
+  :global {
+    .n-card-header {
+      position: absolute;
+      top: 0;
+      left: 0;
+      right: 0;
+
+      .n-card-header__main {
+        color: #fff;
+      }
+    }
+  }
 }

src/views/attend-class/model/train-update/index.module.less

@@ -1,43 +1,47 @@
-.trainUpdate {
-  padding: 24px 30px;
-
-  .updateBtnGroup {
-    padding: 0;
-    justify-content: center !important;
-
-    :global {
-      .n-button {
-        height: 48px !important;
-        min-width: 156px;
-      }
-    }
-  }
-
-  .switch {
-    height: 37px !important;
-    border-radius: 8px;
-
-    &.active {
-      background: #198CFE;
-      color: #fff;
-    }
-  }
-
-  :global {
-    .n-input-group-label {
-      width: 76px;
-      padding: 0;
-      text-align: center;
-      background-color: #fff;
-      border-radius: 8px;
-    }
-
-    .n-input {
-      border-radius: 8px;
-    }
-  }
-
-  .scoreGroup {
-    display: flex;
-  }
+.trainUpdate {
+  padding: 24px 30px;
+
+  .updateBtnGroup {
+    padding: 0;
+    justify-content: center !important;
+
+    :global {
+      .n-button {
+        height: 48px !important;
+        min-width: 156px;
+      }
+    }
+  }
+
+  .switch {
+    height: 37px !important;
+    border-radius: 8px;
+
+    &.active {
+      background: #198CFE;
+      color: #fff;
+    }
+  }
+
+  .difficultySpace {
+    gap: 6px 10px;
+  }
+
+  :global {
+    .n-input-group-label {
+      width: 76px;
+      padding: 0;
+      text-align: center;
+      background-color: #fff;
+      border-radius: 8px;
+    }
+
+    .n-input {
+      border-radius: 8px;
+    }
+  }
+
+  .scoreGroup {
+    display: flex;
+  }
 }

src/views/attend-class/model/train-update/index.tsx

@@ -297,7 +297,7 @@ export default defineComponent({
                 label="评测难度"
                 path="type"
                 rule={[{ required: true, message: '请选择评测难度' }]}>
-                <NSpace>
+                <NSpace class={styles.difficultySpace}>
                   <NButton
                     secondary
                     class={[

src/views/home/index.tsx

@@ -157,7 +157,7 @@ export default defineComponent({
                 class={[styles.topSection, styles.topSection2]}
                 onClick={() => {
                   const origin = /(localhost|192)/.test(location.host)
-                    ? 'https://test.lexiaoya.cn'
+                    ? 'http://192.168.3.220:9002'
                     : location.origin;
                   const src = `${origin}/classroom-app/#/tempo-practice?Authorization=${userStore.getToken}&win=pc&platform=modal&back=show`;
                   if (window.matchMedia('(display-mode: standalone)').matches) {

src/views/homework-record/index.module.less

@@ -79,7 +79,7 @@
 }
 
 .workVisiable {
-  width: 1258px;
+  width: 1358px;
 }
 
 .workContainer {
@@ -166,7 +166,7 @@
 
 .item {
   cursor: pointer;
-  background: #F7F9FF;
+  background: #F4F7FD;
   border-radius: 13px;
   padding: 0 17px 17px;
   position: relative;

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

@@ -36,6 +36,10 @@
     min-height: 60vh;
     padding: 22px 40px;
   }
+
+  .teachingSpace {
+    gap: 50px 50px !important;
+  }
 }
 
 .item {
@@ -241,4 +245,4 @@
       }
     }
   }
-}
+}

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

@@ -190,7 +190,7 @@ export default defineComponent({
         </div>
         <NScrollbar class={styles.classList}>
           <NSpin show={forms.loading} class={styles.content}>
-            <NSpace size={[50, 40]}>
+            <NSpace class={styles.teachingSpace}>
               <div
                 class={styles.item}
                 key={`item--1`}

src/views/prepare-lessons/components/lesson-main/courseware-presets/select-related/index.module.less

@@ -1,151 +1,151 @@
-.listContainer {
-  margin: 10px 0;
-  max-height: calc(var(--window-page-lesson-height) - 204px);
-  // overflow-x: auto;
-
-  &.listNoMusic {
-    max-height: calc(var(--window-page-lesson-height) - 150px);
-
-    .listSection {
-      min-height: calc(var(--window-page-lesson-height) - 150px);
-    }
-  }
-
-  .listSection {
-    min-height: calc(var(--window-page-lesson-height) - 204px);
-  }
-
-
-
-  .emptySection {
-    display: flex;
-    align-items: center;
-  }
-
-  .list {
-    padding: 10px 0;
-    text-align: center;
-
-    &>div {
-      margin-bottom: 20px;
-
-      &:last-child {
-        margin-bottom: 0;
-      }
-    }
-  }
-}
-
-.trainEditModal {
-  width: 494px;
-}
-
-.itemModal {
-  display: flex;
-  align-items: center;
-  margin: 0 17px 20px;
-
-  .itemCover {
-    position: relative;
-    width: 118px;
-    height: 66px;
-    margin-right: 10px;
-    border-radius: 12px;
-    border: 1px solid #EFF0F2;
-    overflow: hidden;
-
-    :global {
-      .n-image {
-        width: 118px;
-        height: 66px;
-      }
-    }
-
-    img {
-      width: 100%;
-      height: 100%;
-    }
-
-    &:hover {
-      .function {
-        opacity: 1;
-        transition: opacity 0.2s ease;
-      }
-    }
-  }
-
-  .function {
-    position: absolute;
-    inset: 0;
-    background: rgba(0, 0, 0, .3);
-    display: flex;
-    align-items: center;
-    justify-content: space-evenly;
-    opacity: 0;
-    transition: opacity 0.2s ease;
-
-    .iconLook,
-    .iconAdd {
-      cursor: pointer;
-      width: 27px;
-      height: 27px;
-      border-radius: 50%;
-      background: rgba(0, 0, 0, .4);
-      display: flex;
-      align-items: center;
-      justify-content: center;
-
-    }
-
-    .iconLook {
-      &::before {
-        display: inline-block;
-        content: '';
-        width: 15px;
-        height: 15px;
-        background: url('../../../../images/icon-look.png') no-repeat center;
-        background-size: contain;
-      }
-    }
-
-
-    .iconAdd {
-      &::before {
-        display: inline-block;
-        content: '';
-        width: 12px;
-        height: 12px;
-        background: url('../../../../images/icon-add.png') no-repeat center;
-        background-size: contain;
-      }
-    }
-  }
-
-  .itemContent {
-    max-width: 158px;
-    text-align: left;
-
-    .itemTitle {
-      font-weight: 600;
-      font-size: 12Px;
-      color: #000000;
-      line-height: 17px;
-
-      &:hover {
-        color: #1677FF;
-        cursor: pointer;
-      }
-    }
-
-    .itemSubject {
-      padding-top: 7px;
-      width: 100%;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      font-size: 11Px;
-      color: #777777;
-      line-height: 15px;
-    }
-  }
+.listContainer {
+  margin: 10px 0;
+  max-height: calc(var(--window-page-lesson-height) - 204px);
+  // overflow-x: auto;
+
+  &.listNoMusic {
+    max-height: calc(var(--window-page-lesson-height) - 150px);
+
+    .listSection {
+      min-height: calc(var(--window-page-lesson-height) - 150px);
+    }
+  }
+
+  .listSection {
+    min-height: calc(var(--window-page-lesson-height) - 204px);
+  }
+
+
+
+  .emptySection {
+    display: flex;
+    align-items: center;
+  }
+
+  .list {
+    padding: 10px 0;
+    text-align: center;
+
+    &>div {
+      margin-bottom: 20px;
+
+      &:last-child {
+        margin-bottom: 0;
+      }
+    }
+  }
+}
+
+.trainEditModal {
+  width: 524px;
+}
+
+.itemModal {
+  display: flex;
+  align-items: center;
+  margin: 0 17px 20px;
+
+  .itemCover {
+    position: relative;
+    width: 118px;
+    height: 66px;
+    margin-right: 10px;
+    border-radius: 12px;
+    border: 1px solid #EFF0F2;
+    overflow: hidden;
+
+    :global {
+      .n-image {
+        width: 118px;
+        height: 66px;
+      }
+    }
+
+    img {
+      width: 100%;
+      height: 100%;
+    }
+
+    &:hover {
+      .function {
+        opacity: 1;
+        transition: opacity 0.2s ease;
+      }
+    }
+  }
+
+  .function {
+    position: absolute;
+    inset: 0;
+    background: rgba(0, 0, 0, .3);
+    display: flex;
+    align-items: center;
+    justify-content: space-evenly;
+    opacity: 0;
+    transition: opacity 0.2s ease;
+
+    .iconLook,
+    .iconAdd {
+      cursor: pointer;
+      width: 27px;
+      height: 27px;
+      border-radius: 50%;
+      background: rgba(0, 0, 0, .4);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+
+    }
+
+    .iconLook {
+      &::before {
+        display: inline-block;
+        content: '';
+        width: 15px;
+        height: 15px;
+        background: url('../../../../images/icon-look.png') no-repeat center;
+        background-size: contain;
+      }
+    }
+
+
+    .iconAdd {
+      &::before {
+        display: inline-block;
+        content: '';
+        width: 12px;
+        height: 12px;
+        background: url('../../../../images/icon-add.png') no-repeat center;
+        background-size: contain;
+      }
+    }
+  }
+
+  .itemContent {
+    max-width: 158px;
+    text-align: left;
+
+    .itemTitle {
+      font-weight: 600;
+      font-size: 12Px;
+      color: #000000;
+      line-height: 17px;
+
+      &:hover {
+        color: #1677FF;
+        cursor: pointer;
+      }
+    }
+
+    .itemSubject {
+      padding-top: 7px;
+      width: 100%;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      font-size: 11Px;
+      color: #777777;
+      line-height: 15px;
+    }
+  }
 }

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

@@ -358,13 +358,13 @@
       height: 100%;
       padding: 0 6px;
 
-      &:hover {
-        .itemOperation {
-          transition: all .2s ease;
-          opacity: 1;
-          visibility: visible;
-        }
-      }
+      // &:hover {
+      //   .itemOperation {
+      //     transition: all .2s ease;
+      //     opacity: 1;
+      //     visibility: visible;
+      //   }
+      // }
     }
 
     .itemOperation {
@@ -372,10 +372,10 @@
       top: 8px;
       right: 14px;
       z-index: 98;
-      cursor: move;
-      opacity: 0;
-      visibility: hidden;
-      transition: all .2s ease;
+      // cursor: move;
+      // opacity: 0;
+      // visibility: hidden;
+      // transition: all .2s ease;
     }
 
     .iconDelete {

src/views/prepare-lessons/components/lesson-main/courseware/addCourseware.tsx

@@ -943,9 +943,13 @@ export default defineComponent({
         {/* 弹窗查看 */}
         <CardPreview
           size={
-            ['INSTRUMENT', 'THEORY', 'MUSIC_WIKI', 'MUSICIAN'].includes(
-              forms.item.type
-            )
+            [
+              'INSTRUMENT',
+              'THEORY',
+              'MUSIC_WIKI',
+              'MUSICIAN',
+              'RHYTHM'
+            ].includes(forms.item.type)
               ? 'large'
               : ''
           }

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

@@ -57,16 +57,22 @@
     }
   }
 }
-:global{
-  .assignHomeworkStuBoxClass_drag{
-    .assignStudent{
-      >div{
+
+:global {
+  .assignHomeworkStuBoxClass_drag {
+    .assignStudent {
+      >div {
         padding-bottom: 36px;
       }
     }
   }
-  .assignHomeworkStuBoxClass_drag,.workSetingBoxClass_drag,.workClearBoxClass_drag,.workSaveBoxClass_drag,.workArrangeImmediatelyBoxClass_drag{
-    .bom_drag{
+
+  .assignHomeworkStuBoxClass_drag,
+  .workSetingBoxClass_drag,
+  .workClearBoxClass_drag,
+  .workSaveBoxClass_drag,
+  .workArrangeImmediatelyBoxClass_drag {
+    .bom_drag {
       position: absolute;
       left: 0;
       bottom: 0;
@@ -74,6 +80,7 @@
     }
   }
 }
+
 .tipsContainer {
   display: flex;
   align-items: center;
@@ -182,7 +189,7 @@
 }
 
 .trainEditModal {
-  width: 494px;
+  width: 524px;
 }
 
 .assignHomework {
@@ -209,9 +216,10 @@
       background-size: contain;
       margin-right: 7px;
     }
+
     span {
       font-size: 12Px;
-        color: #1677FF;
+      color: #1677FF;
     }
   }
 
@@ -369,4 +377,4 @@
       }
     }
   }
-}
+}

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

@@ -1,50 +1,50 @@
-.listContainer {
-  margin: 10px 0;
-  max-height: calc(var(--window-page-lesson-height) - 264px);
-  // overflow-x: auto; 60 204 150
-
-  &.listNoMusic {
-    max-height: calc(var(--window-page-lesson-height) - 210px);
-
-    .listSection {
-      min-height: calc(var(--window-page-lesson-height) - 210px);
-    }
-  }
-
-  .listSection {
-    min-height: calc(var(--window-page-lesson-height) - 264px);
-  }
-
-
-
-  .emptySection {
-    display: flex;
-    align-items: center;
-  }
-
-  .list {
-    padding: 10px 0;
-    text-align: center;
-
-    &>div {
-      margin-bottom: 20px;
-
-      &:last-child {
-        margin-bottom: 0;
-      }
-    }
-  }
-}
-
-.trainEditModal {
-  width: 494px;
-}
-
-:global{
-  .workSetingBoxClass_drag .bom_drag{
-    position: absolute;
-    left: 0;
-    bottom: 0;
-    z-index: 1;
-  }
-}
+.listContainer {
+  margin: 10px 0;
+  max-height: calc(var(--window-page-lesson-height) - 264px);
+  // overflow-x: auto; 60 204 150
+
+  &.listNoMusic {
+    max-height: calc(var(--window-page-lesson-height) - 210px);
+
+    .listSection {
+      min-height: calc(var(--window-page-lesson-height) - 210px);
+    }
+  }
+
+  .listSection {
+    min-height: calc(var(--window-page-lesson-height) - 264px);
+  }
+
+
+
+  .emptySection {
+    display: flex;
+    align-items: center;
+  }
+
+  .list {
+    padding: 10px 0;
+    text-align: center;
+
+    &>div {
+      margin-bottom: 20px;
+
+      &:last-child {
+        margin-bottom: 0;
+      }
+    }
+  }
+}
+
+.trainEditModal {
+  width: 524px;
+}
+
+:global {
+  .workSetingBoxClass_drag .bom_drag {
+    position: absolute;
+    left: 0;
+    bottom: 0;
+    z-index: 1;
+  }
+}

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

@@ -1,111 +1,115 @@
-.resource-main {
-  height: 100%;
-
-  :global {
-    .n-tabs-tab-pad {
-      width: 24px !important;
-    }
-
-    .n-tabs-nav {
-      padding: 12px 20px 24px;
-      position: relative;
-    }
-
-    .n-tabs-tab {
-      color: #8B8D98;
-      font-size: max(18px, 13Px);
-      padding-top: 12px;
-      padding-bottom: 6px;
-      line-height: 22px;
-
-      &.n-tabs-tab--active {
-        font-weight: 600 !important;
-        color: #131415 !important;
-      }
-    }
-
-    .n-tabs-tab__label {
-      z-index: 10;
-    }
-
-    .n-tabs-bar {
-      height: 10px;
-      background: linear-gradient(90deg, #77BBFF 0%, rgba(163, 231, 255, 0.22) 100%);
-      z-index: 0;
-      bottom: 6px;
-    }
-
-    .n-tab-pane {
-      padding-top: 0 !important;
-    }
-
-    .n-tabs-nav__suffix {
-      padding-left: 0 !important;
-    }
-
-    .n-tabs.n-tabs--top .n-tabs-nav-scroll-wrapper::after {
-      box-shadow: none !important;
-    }
-  }
-
-  .iconScreen {
-    margin-top: 6px;
-    position: absolute;
-    right: 20px;
-    font-size: 18px;
-    color: var(--n-color);
-    font-weight: bold;
-    width: 22px;
-    height: 22px;
-    cursor: pointer;
-  }
-
-  .homerowkTabs {
-    :global {
-      .n-tabs-tab-pad {
-        width: 15px !important;
-      }
-
-      .n-tabs-tab {
-        color: #8B8D98;
-        font-size: max(18px, 13Px);
-      }
-
-      .v-x-scroll {
-        padding-right: 40px;
-      }
-    }
-  }
-
-}
-:global{
-  .workSetingBoxClass_drag,.selectResourceStatusAddBoxClass_drag{
-    .bom_drag{
-      position: absolute;
-      left: 0;
-      bottom: 0;
-      z-index: 1;
-    }
-  }
-}
-.selectMusicModal {
-  position: relative;
-  width: 1352px;
-
-  :global {
-    .n-card-header {
-      position: absolute;
-      top: 0;
-      left: 0;
-      right: 0;
-
-      .n-card-header__main {
-        color: #fff;
-      }
-    }
-  }
-}
-
-.trainEditModal {
-  width: 494px;
-}
+.resource-main {
+  height: 100%;
+
+  :global {
+    .n-tabs-tab-pad {
+      width: 24px !important;
+    }
+
+    .n-tabs-nav {
+      padding: 12px 20px 24px;
+      position: relative;
+    }
+
+    .n-tabs-tab {
+      color: #8B8D98;
+      font-size: max(18px, 13Px);
+      padding-top: 12px;
+      padding-bottom: 6px;
+      line-height: 22px;
+
+      &.n-tabs-tab--active {
+        font-weight: 600 !important;
+        color: #131415 !important;
+      }
+    }
+
+    .n-tabs-tab__label {
+      z-index: 10;
+    }
+
+    .n-tabs-bar {
+      height: 10px;
+      background: linear-gradient(90deg, #77BBFF 0%, rgba(163, 231, 255, 0.22) 100%);
+      z-index: 0;
+      bottom: 6px;
+    }
+
+    .n-tab-pane {
+      padding-top: 0 !important;
+    }
+
+    .n-tabs-nav__suffix {
+      padding-left: 0 !important;
+    }
+
+    .n-tabs.n-tabs--top .n-tabs-nav-scroll-wrapper::after {
+      box-shadow: none !important;
+    }
+  }
+
+  .iconScreen {
+    margin-top: 6px;
+    position: absolute;
+    right: 20px;
+    font-size: 18px;
+    color: var(--n-color);
+    font-weight: bold;
+    width: 22px;
+    height: 22px;
+    cursor: pointer;
+  }
+
+  .homerowkTabs {
+    :global {
+      .n-tabs-tab-pad {
+        width: 15px !important;
+      }
+
+      .n-tabs-tab {
+        color: #8B8D98;
+        font-size: max(18px, 13Px);
+      }
+
+      .v-x-scroll {
+        padding-right: 40px;
+      }
+    }
+  }
+
+}
+
+:global {
+
+  .workSetingBoxClass_drag,
+  .selectResourceStatusAddBoxClass_drag {
+    .bom_drag {
+      position: absolute;
+      left: 0;
+      bottom: 0;
+      z-index: 1;
+    }
+  }
+}
+
+.selectMusicModal {
+  position: relative;
+  width: 1352px;
+
+  :global {
+    .n-card-header {
+      position: absolute;
+      top: 0;
+      left: 0;
+      right: 0;
+
+      .n-card-header__main {
+        color: #fff;
+      }
+    }
+  }
+}
+
+.trainEditModal {
+  width: 524px;
+}

src/views/prepare-lessons/model/add-other-source/index.module.less

@@ -1,93 +1,93 @@
-.addOtherSource {
-  padding: 42px 50px;
-  display: flex;
-  align-items: center;
-  flex-wrap: wrap;
-  gap: 30px 30px;
-
-  .sourceItem {
-    cursor: pointer;
-
-
-    .coverImg {
-      width: 127px;
-      height: 127px;
-      transition: all .2s ease;
-      border: 2px solid transparent;
-      border-radius: 17px;
-      box-sizing: content-box;
-
-      &:hover {
-        border: 2px solid #198CFE;
-        transform: scale(1.02);
-        transition: all .2s ease;
-      }
-    }
-
-    .name {
-      padding-top: 4px;
-      text-align: center;
-      font-size: max(15px, 12Px);
-      color: #131415;
-      line-height: 21px;
-    }
-  }
-}
-
-
-.addOtherSourceModal {
-  width: 958px;
-}
-
-.instrumentModal,
-.musicModal {
-  width: 1200px;
-  position: relative;
-  // width: 1352px;
-
-  :global {
-    .n-card-header {
-      position: absolute;
-      top: 0;
-      left: 0;
-      right: 0;
-
-      .n-card-header__main {
-        color: #fff;
-      }
-    }
-  }
-}
-
-.musicModal {
-  width: 1360px;
-}
-
-.theoryModal {
-  width: 1360px;
-  position: relative;
-}
-
-.subjectSyncModal {
-  width: 1070px;
-}
-
-.attendClassModal {
-  width: 1100px;
-
-  :global {
-    .n-select-menu {
-      --n-height: calc(var(--n-option-height) * 5.6) !important;
-    }
-  }
-}
-
-.attendClassSaveModal {
-  width: 600px;
-
-  :global {
-    .n-select-menu {
-      --n-height: calc(var(--n-option-height) * 5.6) !important;
-    }
-  }
+.addOtherSource {
+  padding: 42px 50px;
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 30px 30px;
+
+  .sourceItem {
+    cursor: pointer;
+
+
+    .coverImg {
+      width: 127px;
+      height: 127px;
+      transition: all .2s ease;
+      border: 2px solid transparent;
+      border-radius: 17px;
+      box-sizing: content-box;
+
+      &:hover {
+        border: 2px solid #198CFE;
+        transform: scale(1.02);
+        transition: all .2s ease;
+      }
+    }
+
+    .name {
+      padding-top: 4px;
+      text-align: center;
+      font-size: max(15px, 12Px);
+      color: #131415;
+      line-height: 21px;
+    }
+  }
+}
+
+
+.addOtherSourceModal {
+  width: 1158px;
+}
+
+.instrumentModal,
+.musicModal {
+  width: 1200px;
+  position: relative;
+  // width: 1352px;
+
+  :global {
+    .n-card-header {
+      position: absolute;
+      top: 0;
+      left: 0;
+      right: 0;
+
+      .n-card-header__main {
+        color: #fff;
+      }
+    }
+  }
+}
+
+.musicModal {
+  width: 1360px;
+}
+
+.theoryModal {
+  width: 1360px;
+  position: relative;
+}
+
+.subjectSyncModal {
+  width: 1070px;
+}
+
+.attendClassModal {
+  width: 1100px;
+
+  :global {
+    .n-select-menu {
+      --n-height: calc(var(--n-option-height) * 5.6) !important;
+    }
+  }
+}
+
+.attendClassSaveModal {
+  width: 600px;
+
+  :global {
+    .n-select-menu {
+      --n-height: calc(var(--n-option-height) * 5.6) !important;
+    }
+  }
 }

src/views/prepare-lessons/model/source-rhythm/index.module.less

@@ -1,27 +1,27 @@
-.sourceRhythm {
-  width: 100%;
-  line-height: 0;
-
-
-  iframe {
-    width: 100%;
-    height: 518px;
-
-    :global {
-      .headTopBackBtn {
-        display: none;
-      }
-    }
-  }
-
-  .btnGroup {
-    padding: 20px 0;
-
-    :global {
-      .n-button {
-        height: 47px;
-        min-width: 156px;
-      }
-    }
-  }
+.sourceRhythm {
+  width: 100%;
+  line-height: 0;
+
+
+  iframe {
+    width: 100%;
+    height: 618px;
+
+    :global {
+      .headTopBackBtn {
+        display: none;
+      }
+    }
+  }
+
+  .btnGroup {
+    padding: 20px 0;
+
+    :global {
+      .n-button {
+        height: 47px;
+        min-width: 156px;
+      }
+    }
+  }
 }

src/views/prepare-lessons/model/source-rhythm/index.tsx

@@ -1,75 +1,75 @@
-import { defineComponent, onMounted, onUnmounted, ref } from 'vue';
-import styles from './index.module.less';
-import { useUserStore } from '/src/store/modules/users';
-import { NButton, NSpace, NSpin } from 'naive-ui';
-import { iframeDislableKeyboard } from '/src/utils';
-
-export default defineComponent({
-  name: 'source-rhythm',
-  emits: ['close', 'confirm'],
-  setup(props, { emit }) {
-    const userStore = useUserStore();
-    const iframeRef = ref();
-    const loading = ref(true);
-    let src = `${origin}/classroom-app/#/tempo-practice?v=${Date.now()}&Authorization=${
-      userStore.getToken
-    }&platform=modal`;
-    if (/(localhost|192)/.test(location.host)) {
-      src = `http://localhost:9002/#/tempo-practice?v=${Date.now()}&Authorization=${
-        userStore.getToken
-      }&platform=modal`;
-    }
-
-    // emit('confirm');
-    const onSubmit = () => {
-      iframeRef.value?.contentWindow?.postMessage(
-        { api: 'getTempoSetting' },
-        '*'
-      );
-    };
-
-    const iframeHandle = (ev: MessageEvent) => {
-      if (ev.data?.api === 'getTempoSetting') {
-        const data = ev.data.data ? JSON.parse(ev.data.data) : {};
-        emit('confirm', {
-          dataJson: JSON.stringify(data.setting),
-          coverImg: 'https://oss.dayaedu.com/ktqy/171013700931689a322a6.png'
-        });
-      }
-    };
-    onMounted(() => {
-      window.addEventListener('message', iframeHandle);
-    });
-
-    onUnmounted(() => {
-      window.removeEventListener('message', iframeHandle);
-    });
-
-    return () => (
-      <div class={styles.sourceRhythm}>
-        <NSpin show={loading.value}>
-          <iframe
-            ref={iframeRef}
-            onLoad={(val: any) => {
-              // emit('setIframe', iframeRef.value);
-              // isLoaded.value = true;
-              loading.value = false;
-              iframeDislableKeyboard(val.target);
-            }}
-            class={[styles.container, 'musicIframe']}
-            frameborder="0"
-            src={src}></iframe>
-
-          <NSpace class={styles.btnGroup} justify="center">
-            <NButton round onClick={() => emit('close')}>
-              取消
-            </NButton>
-            <NButton round type="primary" onClick={onSubmit}>
-              确认添加
-            </NButton>
-          </NSpace>
-        </NSpin>
-      </div>
-    );
-  }
-});
+import { defineComponent, onMounted, onUnmounted, ref } from 'vue';
+import styles from './index.module.less';
+import { useUserStore } from '/src/store/modules/users';
+import { NButton, NSpace, NSpin } from 'naive-ui';
+import { iframeDislableKeyboard } from '/src/utils';
+
+export default defineComponent({
+  name: 'source-rhythm',
+  emits: ['close', 'confirm'],
+  setup(props, { emit }) {
+    const userStore = useUserStore();
+    const iframeRef = ref();
+    const loading = ref(true);
+    let src = `${origin}/classroom-app/#/tempo-practice?v=${Date.now()}&Authorization=${
+      userStore.getToken
+    }&platform=modal`;
+    if (/(localhost|192)/.test(location.host)) {
+      src = `http://192.168.3.220:9002/#/tempo-practice?v=${Date.now()}&Authorization=${
+        userStore.getToken
+      }&platform=modal`;
+    }
+
+    // emit('confirm');
+    const onSubmit = () => {
+      iframeRef.value?.contentWindow?.postMessage(
+        { api: 'getTempoSetting' },
+        '*'
+      );
+    };
+
+    const iframeHandle = (ev: MessageEvent) => {
+      if (ev.data?.api === 'getTempoSetting') {
+        const data = ev.data.data ? JSON.parse(ev.data.data) : {};
+        emit('confirm', {
+          dataJson: JSON.stringify(data.setting),
+          coverImg: 'https://oss.dayaedu.com/ktqy/171013700931689a322a6.png'
+        });
+      }
+    };
+    onMounted(() => {
+      window.addEventListener('message', iframeHandle);
+    });
+
+    onUnmounted(() => {
+      window.removeEventListener('message', iframeHandle);
+    });
+
+    return () => (
+      <div class={styles.sourceRhythm}>
+        <NSpin show={loading.value}>
+          <iframe
+            ref={iframeRef}
+            onLoad={(val: any) => {
+              // emit('setIframe', iframeRef.value);
+              // isLoaded.value = true;
+              loading.value = false;
+              iframeDislableKeyboard(val.target);
+            }}
+            class={[styles.container, 'musicIframe']}
+            frameborder="0"
+            src={src}></iframe>
+
+          <NSpace class={styles.btnGroup} justify="center">
+            <NButton round onClick={() => emit('close')}>
+              取消
+            </NButton>
+            <NButton round type="primary" onClick={onSubmit}>
+              确认添加
+            </NButton>
+          </NSpace>
+        </NSpin>
+      </div>
+    );
+  }
+});

src/views/studentList/index.module.less

@@ -1,606 +1,613 @@
-.listWrap {
-  padding: 32px;
-  background-color: #fff;
-  border-radius: 20px;
-  min-height: 100%;
-}
-
-.infoListWrap {
-  min-height: calc(100vh - 150px) !important
-}
-
-.infoWrap {
-  min-height: 100%;
-}
-
-.addBtnIcon {
-  width: 13Px !important;
-  height: 14Px !important;
-}
-
-.addBtn {
-  height: 34Px !important;
-  background: #198cfe !important;
-  border-radius: 7Px !important;
-  line-height: 21Px !important;
-  padding: 0 18Px !important;
-  font-size: 13Px !important;
-  font-weight: 600 !important;
-
-  :global {
-    .n-button__content {
-      // font-size: 18px;
-    }
-  }
-}
-
-// 学情
-
-.homeStudy {
-  background-color: #fff;
-
-  .homeStudyTitle {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    font-size: 20px;
-
-    font-weight: 600;
-    color: #131415;
-    line-height: 28px;
-
-    .homeStudyTitleDot {
-      width: 5px;
-      height: 16px;
-      background: #198cfe;
-      margin-right: 8px;
-    }
-  }
-
-  .homeStudyInfoList {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: space-between;
-    margin-top: 21px;
-
-    .homeStudyInfoTabs {
-      display: flex;
-      flex-direction: row;
-      align-items: center;
-
-      .homeStudyInfoTabItem {
-        cursor: pointer;
-        width: 112px;
-        height: 39px;
-        border-radius: 20px;
-        font-size: 18px;
-        font-weight: 600;
-        line-height: 39px;
-        text-align: center;
-        margin-right: 24px;
-        background: #f5f6fa;
-        color: rgba(0, 0, 0, 0.5);
-
-        &:hover {
-          background: #198cfe;
-          color: #ffffff;
-          opacity: 0.8;
-        }
-      }
-
-      .homeStudyInfoTabItem.active {
-        background: #198cfe;
-        color: #ffffff;
-      }
-    }
-
-    .homeStudyInfoDate {
-      display: flex;
-      flex-direction: row;
-      align-items: center;
-      justify-content: flex-end;
-    }
-  }
-
-  .searchBtn {
-    width: 90px;
-    // height: 43px;
-    background: #198cfe;
-    border-radius: 8px;
-    // line-height: 41px;
-    font-weight: 600 !important;
-    // font-size: max(18px, 13Px);
-  }
-
-  .resetBtn {
-    // width: 90px;
-    // height: 43px;
-    border-radius: 8px;
-    // line-height: 41px;
-    font-weight: 600 !important;
-    // font-size: max(18px, 13Px);
-  }
-
-  .resetBtn,
-  .searchBtn {
-    --n-padding: 0 28px !important;
-  }
-}
-
-.homeTrainData {
-  margin-top: 40px;
-
-  .TrainDataTop {
-    margin-bottom: 40px;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: space-between;
-
-    .TrainDataTopLeft {
-      display: flex;
-      flex-direction: row;
-      align-items: center;
-
-      .TrainDataItem {
-        margin-right: 40px;
-
-        .TrainDataItemTitle {
-          display: flex;
-          flex-direction: row;
-          align-items: center;
-          text-align: center;
-          font-size: max(13px, 11Px);
-          font-weight: 400;
-          color: #131415;
-          line-height: 18px;
-
-          span {
-            font-family: 'DINA';
-            font-size: max(26px, 18Px);
-            font-weight: 600;
-            color: #131415;
-            line-height: 28px;
-          }
-        }
-
-        .TrainDataItemsubTitle {
-          margin-top: 4px;
-          text-align: center;
-          font-size: max(14px, 11Px);
-          font-family: PingFangSC-Regular, PingFang SC;
-          font-weight: 400;
-          color: #777777;
-          line-height: 18px;
-        }
-      }
-    }
-
-    .TrainDataTopRight {
-      display: flex;
-      flex-direction: row;
-      align-items: center;
-
-      .DataTopRightItem {
-        cursor: pointer;
-        display: flex;
-        flex-direction: row;
-        align-items: center;
-        margin-left: 30px;
-
-        &:hover {
-          opacity: 0.8;
-        }
-
-        .DataTopRightDot {
-          width: 16px;
-          height: 16px;
-          background: #3583fa;
-          border-radius: 4px;
-          margin-right: 6px;
-        }
-
-        .DataTopRightDot.DataTopRightDotBlue {
-          background: #d5e9ff;
-        }
-
-        .DataTopRightDot.red {
-          background: #ff7aa7;
-        }
-      }
-
-      .DataTopRightItem.DataTopRightItemDis {
-        .DataTopRightDot {
-          background: #f5f6fa;
-        }
-      }
-    }
-  }
-}
-
-.tableWrapEcharts {
-  margin-top: 40px;
-}
-
-
-.tableWrap {
-  // margin-top: 40px;
-
-  :global {
-    .n-data-table {
-      border-radius: 10px 10px 0 0;
-      overflow: hidden;
-    }
-
-    .n-data-table-thead {
-      height: 54px;
-      line-height: 54px;
-    }
-
-    .n-data-table-th {
-      padding: 0 20px;
-      background-color: #f7f7f8;
-      color: rgba(0, 0, 0, 0.88);
-    }
-
-    .n-data-table-td {
-      padding: 12px 20px;
-    }
-
-    .n-data-table-th__title-wrapper {
-      &::after {
-        content: '';
-        width: 1px;
-        height: 22px;
-        background: #ebebeb;
-
-        &:nth-last-child(1) {
-          display: none;
-        }
-      }
-    }
-
-    .n-data-table-th--last {
-      .n-data-table-th__title-wrapper {
-        &::after {
-          content: '';
-          width: 0px;
-          height: 22px;
-          background: #ebebeb;
-        }
-      }
-    }
-
-    .n-tag {
-      --n-border-radius: 6px !important;
-      --n-height: 26px !important;
-      --n-font-size: max(13px, 12Px) !important;
-      --n-padding: 0 14px !important;
-    }
-  }
-}
-
-.reportModel {
-  width: 1030px;
-  overflow: hidden;
-}
-
-.addStudentWrap {
-  position: relative;
-  width: 378px;
-  height: 631px;
-  margin: 100px auto 0;
-
-  .studentCLose {
-    cursor: pointer;
-    position: absolute;
-    right: -67px;
-    top: -54px;
-    width: 42px;
-    height: 42px;
-    z-index: 100;
-  }
-
-  .stunentStart {
-    position: absolute;
-    width: 556px;
-    height: 246px;
-    left: -70px;
-    top: -98px;
-
-    img {
-      width: 556px;
-      height: 246px;
-    }
-  }
-
-  .addTitle {
-    width: 230px;
-    height: 48px;
-    top: -9px;
-    position: absolute;
-    margin: 0 auto;
-    left: 50%;
-    margin-left: -115px;
-    z-index: 100;
-
-    img {
-      width: 230px;
-      height: 48px;
-    }
-  }
-
-  .addStudentInfo {
-    width: 378px;
-    height: 631px;
-    position: relative;
-
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-
-    .studentInfoBg {
-      position: absolute;
-      width: 378px;
-      height: 631px;
-
-      img {
-        left: 0;
-        top: 0;
-        width: 378px;
-        height: 631px;
-      }
-    }
-
-
-
-    .studentCore {
-      position: absolute;
-      bottom: 27px;
-      left: 24px;
-      width: 330px;
-      height: 339px;
-      background: rgba(255, 255, 255, 0.33);
-      border-radius: 17px;
-      border: 2px solid #ffffff;
-      backdrop-filter: blur(17px);
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-
-      .schoolLogo {
-        width: 67px;
-        height: 67px;
-        margin-top: -34px;
-        border: 1px solid #fff;
-        border-radius: 50%;
-        z-index: 100;
-        overflow: hidden;
-        background-color: #fff;
-        position: absolute;
-      }
-
-      .studentCoreInfo {
-        margin-top: 6px;
-        width: 314px;
-        height: 323px;
-        background: #ffffff;
-        border-radius: 17px;
-
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-
-        h2 {
-          margin-top: 37px;
-          height: 22px;
-          font-size: max(16px, 13Px);
-          font-weight: 600;
-          color: #000000;
-          line-height: 22px;
-          margin-bottom: 6px;
-          overflow: hidden;
-          text-overflow: ellipsis;
-          white-space: nowrap;
-        }
-
-        .studentCoreInfoSubtitle {
-          font-size: max(14px, 11Px);
-          font-weight: 400;
-          color: #000000;
-          line-height: 22px;
-
-          span {
-            color: #198cfe;
-            font-weight: 600;
-          }
-        }
-
-        .codewrap {
-          width: 147px;
-          height: 145px;
-          background: url(./images/cordWrap.png) no-repeat;
-          position: relative;
-          background-size: 147px 145px;
-          margin: 16px 0 18px;
-          display: flex;
-          flex-direction: column;
-          align-items: center;
-          justify-content: center;
-
-          .codewrapBg {
-            width: 147px !important;
-            height: 145px !important;
-            top: 0;
-            left: 0;
-            position: absolute;
-          }
-
-          // img {
-
-          // }
-
-
-        }
-
-        .codewrapSubmit {
-          width: 213px;
-          height: 35px;
-          // background: linear-gradient(135deg, #d1fdf9 0%, #d6eeff 100%);
-          // box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.62);
-          border-radius: 18px;
-          text-align: center;
-          line-height: 35px;
-          font-size: max(14px, 11Px);
-          color: #117de9;
-          position: relative;
-
-          img {
-            position: absolute;
-            left: 0;
-            top: 0;
-            width: 213px;
-            height: 35px;
-          }
-
-          span {
-            font-weight: 600;
-          }
-        }
-      }
-    }
-  }
-
-  .studentBottom {
-    width: 420px;
-
-    position: absolute;
-    left: -21px;
-    bottom: -140px;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-
-    p {
-      text-align: center;
-      font-size: 20px;
-      font-weight: bold;
-      color: #ffffff;
-      margin-bottom: 30px;
-
-    }
-
-    .downBtn {
-      width: 256px;
-      height: 54px;
-      background: linear-gradient(90deg, #ff7b57 0%, #ff3460 100%);
-      border-radius: 30px;
-      line-height: 54px;
-      font-size: 22px;
-      font-weight: 600;
-      text-align: center;
-      color: #fff;
-
-      cursor: pointer;
-    }
-  }
-}
-
-.setInfo {
-  margin-top: 64px;
-
-
-  :global {
-    .n-form-item-label {
-      font-size: max(15px, 12Px);
-      color: #000;
-    }
-
-    .n-input {
-      height: max(50px, 40Px);
-      border-radius: 8px;
-      font-size: max(18px, 14Px);
-
-      .n-input__input-el {
-        height: 100%;
-      }
-
-      &.n-input--disabled {
-        background-color: #f5f6fa;
-        color: rgba(149, 149, 152, 1);
-      }
-    }
-
-    .n-base-selection {
-      border-radius: 8px;
-
-      .n-base-selection-label {
-        height: max(50px, 40Px);
-      }
-    }
-
-    .n-base-selection.n-base-selection--disabled .n-base-selection-label {
-      background-color: #f5f6fa;
-      color: rgba(149, 149, 152, 1);
-    }
-  }
-}
-
-.btnList {
-  margin-top: 150px;
-
-  .btn {
-    --n-padding: 0 36px !important;
-    // --n-height: 45px !important;
-    --n-border-radius: 8px !important;
-  }
-}
-
-
-.wordDetailModel {
-  width: 1012px;
-}
-
-
-
-.removeVisiable {
-  width: 432px;
-
-  :global {
-    .n-card-header {
-      font-size: max(22px, 16Px);
-    }
-  }
-
-  .studentRemove {
-    padding: 32px 40px 46px;
-
-    p {
-      font-size: max(18px, 14Px);
-      color: #777777;
-      line-height: 30px;
-      text-align: center;
-
-      span {
-        color: #EA4132;
-      }
-    }
-  }
-
-  .btnGroup {
-    padding: 32px 0 0;
-
-    :global {
-      .n-button {
-        height: 47px;
-        min-width: 156px;
-      }
-    }
-  }
-}
-
-
-.updateStudent {
-  width: 580px;
+.listWrap {
+  padding: 32px;
+  background-color: #fff;
+  border-radius: 20px;
+  min-height: 100%;
+
+
+  :global {
+    .n-form.n-form--inline .n-form-item {
+      margin-right: 18px;
+    }
+  }
+}
+
+.infoListWrap {
+  min-height: calc(100vh - 150px) !important
+}
+
+.infoWrap {
+  min-height: 100%;
+}
+
+.addBtnIcon {
+  width: 13Px !important;
+  height: 14Px !important;
+}
+
+.addBtn {
+  height: 34Px !important;
+  background: #198cfe !important;
+  border-radius: 7Px !important;
+  line-height: 21Px !important;
+  padding: 0 18Px !important;
+  font-size: 13Px !important;
+  font-weight: 600 !important;
+
+  :global {
+    .n-button__content {
+      // font-size: 18px;
+    }
+  }
+}
+
+// 学情
+
+.homeStudy {
+  background-color: #fff;
+
+  .homeStudyTitle {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    font-size: 20px;
+
+    font-weight: 600;
+    color: #131415;
+    line-height: 28px;
+
+    .homeStudyTitleDot {
+      width: 5px;
+      height: 16px;
+      background: #198cfe;
+      margin-right: 8px;
+    }
+  }
+
+  .homeStudyInfoList {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
+    margin-top: 21px;
+
+    .homeStudyInfoTabs {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+
+      .homeStudyInfoTabItem {
+        cursor: pointer;
+        width: 112px;
+        height: 39px;
+        border-radius: 20px;
+        font-size: 18px;
+        font-weight: 600;
+        line-height: 39px;
+        text-align: center;
+        margin-right: 24px;
+        background: #f5f6fa;
+        color: rgba(0, 0, 0, 0.5);
+
+        &:hover {
+          background: #198cfe;
+          color: #ffffff;
+          opacity: 0.8;
+        }
+      }
+
+      .homeStudyInfoTabItem.active {
+        background: #198cfe;
+        color: #ffffff;
+      }
+    }
+
+    .homeStudyInfoDate {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      justify-content: flex-end;
+    }
+  }
+
+  .searchBtn {
+    width: 90px;
+    // height: 43px;
+    background: #198cfe;
+    border-radius: 8px;
+    // line-height: 41px;
+    font-weight: 600 !important;
+    // font-size: max(18px, 13Px);
+  }
+
+  .resetBtn {
+    // width: 90px;
+    // height: 43px;
+    border-radius: 8px;
+    // line-height: 41px;
+    font-weight: 600 !important;
+    // font-size: max(18px, 13Px);
+  }
+
+  .resetBtn,
+  .searchBtn {
+    --n-padding: 0 28px !important;
+  }
+}
+
+.homeTrainData {
+  margin-top: 40px;
+
+  .TrainDataTop {
+    margin-bottom: 40px;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
+
+    .TrainDataTopLeft {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+
+      .TrainDataItem {
+        margin-right: 40px;
+
+        .TrainDataItemTitle {
+          display: flex;
+          flex-direction: row;
+          align-items: center;
+          text-align: center;
+          font-size: max(13px, 11Px);
+          font-weight: 400;
+          color: #131415;
+          line-height: 18px;
+
+          span {
+            font-family: 'DINA';
+            font-size: max(26px, 18Px);
+            font-weight: 600;
+            color: #131415;
+            line-height: 28px;
+          }
+        }
+
+        .TrainDataItemsubTitle {
+          margin-top: 4px;
+          text-align: center;
+          font-size: max(14px, 11Px);
+          font-family: PingFangSC-Regular, PingFang SC;
+          font-weight: 400;
+          color: #777777;
+          line-height: 18px;
+        }
+      }
+    }
+
+    .TrainDataTopRight {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+
+      .DataTopRightItem {
+        cursor: pointer;
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        margin-left: 30px;
+
+        &:hover {
+          opacity: 0.8;
+        }
+
+        .DataTopRightDot {
+          width: 16px;
+          height: 16px;
+          background: #3583fa;
+          border-radius: 4px;
+          margin-right: 6px;
+        }
+
+        .DataTopRightDot.DataTopRightDotBlue {
+          background: #d5e9ff;
+        }
+
+        .DataTopRightDot.red {
+          background: #ff7aa7;
+        }
+      }
+
+      .DataTopRightItem.DataTopRightItemDis {
+        .DataTopRightDot {
+          background: #f5f6fa;
+        }
+      }
+    }
+  }
+}
+
+.tableWrapEcharts {
+  margin-top: 40px;
+}
+
+
+.tableWrap {
+  // margin-top: 40px;
+
+  :global {
+    .n-data-table {
+      border-radius: 10px 10px 0 0;
+      overflow: hidden;
+    }
+
+    .n-data-table-thead {
+      height: 54px;
+      line-height: 54px;
+    }
+
+    .n-data-table-th {
+      padding: 0 20px;
+      background-color: #f7f7f8;
+      color: rgba(0, 0, 0, 0.88);
+    }
+
+    .n-data-table-td {
+      padding: 12px 20px;
+    }
+
+    .n-data-table-th__title-wrapper {
+      &::after {
+        content: '';
+        width: 1px;
+        height: 22px;
+        background: #ebebeb;
+
+        &:nth-last-child(1) {
+          display: none;
+        }
+      }
+    }
+
+    .n-data-table-th--last {
+      .n-data-table-th__title-wrapper {
+        &::after {
+          content: '';
+          width: 0px;
+          height: 22px;
+          background: #ebebeb;
+        }
+      }
+    }
+
+    .n-tag {
+      --n-border-radius: 6px !important;
+      --n-height: 26px !important;
+      --n-font-size: max(13px, 12Px) !important;
+      --n-padding: 0 14px !important;
+    }
+  }
+}
+
+.reportModel {
+  width: 1030px;
+  overflow: hidden;
+}
+
+.addStudentWrap {
+  position: relative;
+  width: 378px;
+  height: 631px;
+  margin: 100px auto 0;
+
+  .studentCLose {
+    cursor: pointer;
+    position: absolute;
+    right: -67px;
+    top: -54px;
+    width: 42px;
+    height: 42px;
+    z-index: 100;
+  }
+
+  .stunentStart {
+    position: absolute;
+    width: 556px;
+    height: 246px;
+    left: -70px;
+    top: -98px;
+
+    img {
+      width: 556px;
+      height: 246px;
+    }
+  }
+
+  .addTitle {
+    width: 230px;
+    height: 48px;
+    top: -9px;
+    position: absolute;
+    margin: 0 auto;
+    left: 50%;
+    margin-left: -115px;
+    z-index: 100;
+
+    img {
+      width: 230px;
+      height: 48px;
+    }
+  }
+
+  .addStudentInfo {
+    width: 378px;
+    height: 631px;
+    position: relative;
+
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+
+    .studentInfoBg {
+      position: absolute;
+      width: 378px;
+      height: 631px;
+
+      img {
+        left: 0;
+        top: 0;
+        width: 378px;
+        height: 631px;
+      }
+    }
+
+
+
+    .studentCore {
+      position: absolute;
+      bottom: 27px;
+      left: 24px;
+      width: 330px;
+      height: 339px;
+      background: rgba(255, 255, 255, 0.33);
+      border-radius: 17px;
+      border: 2px solid #ffffff;
+      backdrop-filter: blur(17px);
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+
+      .schoolLogo {
+        width: 67px;
+        height: 67px;
+        margin-top: -34px;
+        border: 1px solid #fff;
+        border-radius: 50%;
+        z-index: 100;
+        overflow: hidden;
+        background-color: #fff;
+        position: absolute;
+      }
+
+      .studentCoreInfo {
+        margin-top: 6px;
+        width: 314px;
+        height: 323px;
+        background: #ffffff;
+        border-radius: 17px;
+
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+
+        h2 {
+          margin-top: 37px;
+          height: 22px;
+          font-size: max(16px, 13Px);
+          font-weight: 600;
+          color: #000000;
+          line-height: 22px;
+          margin-bottom: 6px;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+        }
+
+        .studentCoreInfoSubtitle {
+          font-size: max(14px, 11Px);
+          font-weight: 400;
+          color: #000000;
+          line-height: 22px;
+
+          span {
+            color: #198cfe;
+            font-weight: 600;
+          }
+        }
+
+        .codewrap {
+          width: 147px;
+          height: 145px;
+          background: url(./images/cordWrap.png) no-repeat;
+          position: relative;
+          background-size: 147px 145px;
+          margin: 16px 0 18px;
+          display: flex;
+          flex-direction: column;
+          align-items: center;
+          justify-content: center;
+
+          .codewrapBg {
+            width: 147px !important;
+            height: 145px !important;
+            top: 0;
+            left: 0;
+            position: absolute;
+          }
+
+          // img {
+
+          // }
+
+
+        }
+
+        .codewrapSubmit {
+          width: 213px;
+          height: 35px;
+          // background: linear-gradient(135deg, #d1fdf9 0%, #d6eeff 100%);
+          // box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.62);
+          border-radius: 18px;
+          text-align: center;
+          line-height: 35px;
+          font-size: max(14px, 11Px);
+          color: #117de9;
+          position: relative;
+
+          img {
+            position: absolute;
+            left: 0;
+            top: 0;
+            width: 213px;
+            height: 35px;
+          }
+
+          span {
+            font-weight: 600;
+          }
+        }
+      }
+    }
+  }
+
+  .studentBottom {
+    width: 420px;
+
+    position: absolute;
+    left: -21px;
+    bottom: -140px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+
+    p {
+      text-align: center;
+      font-size: 20px;
+      font-weight: bold;
+      color: #ffffff;
+      margin-bottom: 30px;
+
+    }
+
+    .downBtn {
+      width: 256px;
+      height: 54px;
+      background: linear-gradient(90deg, #ff7b57 0%, #ff3460 100%);
+      border-radius: 30px;
+      line-height: 54px;
+      font-size: 22px;
+      font-weight: 600;
+      text-align: center;
+      color: #fff;
+
+      cursor: pointer;
+    }
+  }
+}
+
+.setInfo {
+  margin-top: 64px;
+
+
+  :global {
+    .n-form-item-label {
+      font-size: max(15px, 12Px);
+      color: #000;
+    }
+
+    .n-input {
+      height: max(50px, 40Px);
+      border-radius: 8px;
+      font-size: max(18px, 14Px);
+
+      .n-input__input-el {
+        height: 100%;
+      }
+
+      &.n-input--disabled {
+        background-color: #f5f6fa;
+        color: rgba(149, 149, 152, 1);
+      }
+    }
+
+    .n-base-selection {
+      border-radius: 8px;
+
+      .n-base-selection-label {
+        height: max(50px, 40Px);
+      }
+    }
+
+    .n-base-selection.n-base-selection--disabled .n-base-selection-label {
+      background-color: #f5f6fa;
+      color: rgba(149, 149, 152, 1);
+    }
+  }
+}
+
+.btnList {
+  margin-top: 150px;
+
+  .btn {
+    --n-padding: 0 36px !important;
+    // --n-height: 45px !important;
+    --n-border-radius: 8px !important;
+  }
+}
+
+
+.wordDetailModel {
+  width: 1012px;
+}
+
+
+
+.removeVisiable {
+  width: 432px;
+
+  :global {
+    .n-card-header {
+      font-size: max(22px, 16Px);
+    }
+  }
+
+  .studentRemove {
+    padding: 32px 40px 46px;
+
+    p {
+      font-size: max(18px, 14Px);
+      color: #777777;
+      line-height: 30px;
+      text-align: center;
+
+      span {
+        color: #EA4132;
+      }
+    }
+  }
+
+  .btnGroup {
+    padding: 32px 0 0;
+
+    :global {
+      .n-button {
+        height: 47px;
+        min-width: 156px;
+      }
+    }
+  }
+}
+
+
+.updateStudent {
+  width: 580px;
 }