添加关于我们页面

dev-dist/sw.js

@@ -82,7 +82,7 @@ define(['./workbox-5357ef54'], (function (workbox) { 'use strict';
     "revision": "3ca0b8505b4bec776b69afdba2768812"
   }, {
     "url": "index.html",
-    "revision": "0.fdlfbk23pr8"
+    "revision": "0.p9rb3ikv53"
   }], {});
   workbox.cleanupOutdatedCaches();
   workbox.registerRoute(new workbox.NavigationRoute(workbox.createHandlerBoundToURL("index.html"), {

public/version.json

@@ -1 +1 @@
-{"version":1708427475841}
+{"version":1708515617550}

src/components/layout/index.module.less

@@ -43,6 +43,7 @@
   .sliderList {
     margin-top: 10px;
     max-height: calc(100vh - 92px);
+    --n-scrollbar-width: 0 !important;
 
     :global {
       .n-scrollbar-content {

src/components/layout/layoutTop.tsx

@@ -9,6 +9,7 @@ import closeIcon from './images/closeIcon.png';
 import clockIcon from './images/clockIcon.png';
 import schoolDot from './images/schoolDot.png';
 import personIcon from './images/personIcon.png';
+import iconAboutus from './images/icon-aboutus.png';
 import { useUserStore } from '@/store/modules/users';
 import inFront from './images/inFront.png';
 import inBack from './images/inBack.png';
@@ -53,6 +54,9 @@ export default defineComponent({
       showWord.value = true;
       userInfoStatus.value = false;
     };
+    const aboutUs = () => {
+      router.push({ path: '/aboutUs' });
+    };
     const body = document.querySelector('body');
     if (body) {
       body.className = 'myBody body';
@@ -301,13 +305,20 @@ export default defineComponent({
                   ) : null}
 
                   <div class={styles.propWrapItem} onClick={() => resetPwd()}>
-                    {' '}
                     <NImage
                       class={styles.smallIcon}
                       src={clockIcon}
                       previewDisabled></NImage>
                     <p class={styles.smallTitle}>修改密码</p>
                   </div>
+
+                  <div class={styles.propWrapItem} onClick={() => aboutUs()}>
+                    <NImage
+                      class={styles.smallIcon}
+                      src={iconAboutus}
+                      previewDisabled></NImage>
+                    <p class={styles.smallTitle}>关于我们</p>
+                  </div>
                 </div>
                 <div
                   class={styles.logoutInfo}

src/router/routes/index.ts

@@ -129,6 +129,14 @@ export const constantRoutes: RouteRecordRaw[] = [
         }
       },
       {
+        path: '/aboutUs',
+        name: 'aboutUs',
+        component: () => import('@/views/aboutUs/index'),
+        meta: {
+          title: '关于我们'
+        }
+      },
+      {
         path: '/data-module',
         name: 'data-module',
         component: () => import('@/views/data-module/index'),

src/views/aboutUs/api.ts

@@ -0,0 +1,10 @@
+import request from '@/utils/request';
+/**
+ * 关于我们
+ */
+export const api_getCustomerServiceContact = (params: any) => {
+  return request.get('/edu-app/sysSuggestion/getCustomerServiceContact', {
+    data: params
+    // requestType: 'form'
+  });
+};

src/views/aboutUs/index.module.less

@@ -0,0 +1,129 @@
+@img: '../setting/images';
+
+.listWrap {
+  min-height: 100%;
+  padding: 20px 32px 32px;
+  background-color: #fff;
+  border-radius: 20px;
+  display: flex;
+  // align-items: center;
+  justify-content: space-between;
+  flex-direction: column;
+
+  .customTabs {
+    :global {
+      .n-tabs-tab--active {
+        font-size: max(18px, 14Px) !important;
+
+        font-weight: 600 !important;
+        color: #131415 !important;
+      }
+
+      .n-tabs-tab {
+        font-size: max(18px, 14Px);
+        padding: 8px 0 !important;
+        font-weight: 400;
+        min-width: 50px;
+        color: #8b8d98;
+
+        &:hover {
+          color: #198cfe !important;
+        }
+      }
+
+      .n-tabs-bar {
+        width: 50px !important;
+        height: 5px !important;
+        background: url('@{img}/barIcon.png') no-repeat;
+        background-size: 50px 5px;
+      }
+    }
+  }
+
+  .content {
+    padding-top: 30px;
+    flex: 1 auto;
+    display: flex;
+    align-items: center;
+    flex-direction: column;
+  }
+
+  .information {
+    flex: 1;
+  }
+
+  .logoContainer {
+    display: flex;
+    align-items: center;
+    flex-direction: column;
+
+    p {
+      font-size: max(15px, 12Px);
+      color: #8B8B8B;
+      line-height: 22px;
+    }
+  }
+
+  .iconLogo {
+    width: 178px;
+    height: 178px;
+
+    img {
+      width: inherit;
+      height: inherit;
+    }
+  }
+
+  .infos {
+    padding-top: 70px;
+    width: 667px;
+
+    .info {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      padding: 25px 0;
+      border-bottom: 1px solid #F2F2F2;
+      font-size: max(17px, 14Px);
+      color: #8B8B8B;
+    }
+
+    .title {
+      color: #121314;
+    }
+  }
+
+  .copyright {
+    padding-top: 50px;
+    padding-bottom: 26px;
+    text-align: center;
+    font-size: max(12px, 12Px);
+    color: #B2B2B2;
+    line-height: 28px;
+
+    a {
+      color: #B2B2B2;
+      text-decoration: none;
+    }
+  }
+
+}
+
+
+.wrap {
+  padding: 12px 0;
+
+  :global {
+    .n-input {
+      border-radius: 8px;
+    }
+
+    .n-input .n-input__input-el {
+      height: 53px;
+    }
+
+    .n-button.n-button--disabled {
+      background: #aaa;
+    }
+  }
+}

src/views/aboutUs/index.tsx

@@ -0,0 +1,71 @@
+import { defineComponent, onMounted, reactive, ref } from 'vue';
+import styles from './index.module.less';
+import { NTabs, NTabPane, NImage } from 'naive-ui';
+import iconLogo from './images/icon-logo.png';
+import { api_getCustomerServiceContact } from './api';
+export default defineComponent({
+  name: 'aboutUs',
+  setup() {
+    const activeTab = ref('person' as any);
+    const state = reactive({
+      email: '',
+      phone: ''
+    });
+
+    const getAboutUsInfo = async () => {
+      try {
+        const { data } = await api_getCustomerServiceContact({});
+        state.email = data.email;
+        state.phone = data.phone;
+      } catch {
+        //
+      }
+    };
+
+    onMounted(() => {
+      getAboutUsInfo();
+    });
+
+    return () => (
+      <div class={styles.listWrap}>
+        <NTabs
+          class={styles.customTabs}
+          v-model:value={activeTab.value}
+          size="large"
+          // animated
+          pane-wrapper-style="margin: 0 -4px"
+          pane-style="padding-left: 4px; padding-right: 4px; box-sizing: border-box;">
+          <NTabPane name="person" tab="关于我们"></NTabPane>
+        </NTabs>
+
+        <div class={styles.content}>
+          <div class={styles.information}>
+            <div class={styles.logoContainer}>
+              <NImage src={iconLogo} class={styles.iconLogo} />
+              <p>版本号 1.1.4</p>
+            </div>
+
+            <div class={styles.infos}>
+              <div class={styles.info}>
+                <p class={styles.title}>客服电话：</p>
+                <p>{state.phone || '--'}</p>
+              </div>
+              <div class={styles.info}>
+                <p class={styles.title}>E-mail：</p>
+                <p>{state.email || '--'}</p>
+              </div>
+            </div>
+          </div>
+          <div class={styles.copyright}>
+            <a target="_blank" href="https://beian.miit.gov.cn/">
+              网站备案：鄂ICP备2021020787号-1
+            </a>
+            ｜增值电信业务经营许可证：鄂B2-20231246｜教育移动互联网应用备案：教APP备4200212号｜网络安全等级保护备案号：42010043158-24001{' '}
+            <br />
+            Copyright@2021-2024｜酷乐秀 colexiu.com 版权所有
+          </div>
+        </div>
+      </div>
+    );
+  }
+});

src/views/prepare-lessons/components/lesson-main/train/assign-student/index.tsx

@@ -132,25 +132,27 @@ export default defineComponent({
     // 切换学生状态
     const onCheckStudents = () => {
       state.selectStudents = [];
-      if (state.checkboxIds.length <= 0) {
+      if (state.checkboxIds.length <= 0 || state.tableList.length <= 0) {
         state.indeterminate = false;
         state.checkAllStatus = false;
         return;
       }
-      if (state.checkboxIds.length === state.tableList.length) {
-        state.checkAllStatus = true;
-        state.indeterminate = false;
-      } else {
-        state.checkAllStatus = false;
-        state.indeterminate = true;
-      }
-
+      let count = 0;
       // 右边数据
       state.tableList.forEach((item: any) => {
         if (state.checkboxIds.includes(item.id)) {
+          count++;
           state.selectStudents.push(item);
         }
       });
+
+      if (count >= state.tableList.length) {
+        state.checkAllStatus = true;
+        state.indeterminate = false;
+      } else {
+        state.checkAllStatus = false;
+        state.indeterminate = true;
+      }
     };
 
     // 删除用户