Merge branch 'master' of http://git.dayaedu.com/lex/colexiu-project

src/components/albumItem/index.module.less

@@ -2,19 +2,18 @@
   &:hover {
     .hold {
       img {
-        transform:scale(1.1);
+        transform: scale(1.1);
+        transition: all 0.3s ease-in-out;
       }
-
     }
   }
   cursor: pointer;
-  &:nth-child(5n){
+  &:nth-child(5n) {
     margin-right: 0;
   }
   margin-bottom: 28px;
   margin-right: 26px;
 
-
   h2 {
     line-height: 30px;
     font-size: 18px;
@@ -35,6 +34,7 @@
     transition: 2s;
     img {
       width: 100%;
+      transition: all 0.3s ease-in-out;
     }
   }
   span {
@@ -53,7 +53,8 @@
     .itemBottomL {
       margin-right: 21px;
     }
-    .itemBottomL, .itemBottomR{
+    .itemBottomL,
+    .itemBottomR {
       display: flex;
       flex-direction: row;
       justify-content: flex-start;

src/components/albumItem/index.tsx

@@ -54,13 +54,12 @@ export default defineComponent({
             gotoAlbum()
           }}
         >
-          <div   class={classes.hold}>
+          <div class={classes.hold}>
             <img
               src={
                 state.detail.albumCoverUrl ? state.detail.albumCoverUrl : hold
               }
               alt=""
-
             />
           </div>
 

src/router/routes-admin.ts

@@ -187,6 +187,12 @@ export default [
           activeMenu: 'userInfoMusicClass',
           isdark: true
         }
+      },
+      {
+        path: '/userInfo/myFans',
+        name: 'userInfoMyFans',
+        component: () => import('@/views/user-info/my-fans'),
+        meta: { title: '我的粉丝', index: 4, hidden: true, isdark: true }
       }
     ]
   },

src/views/login/index.tsx

@@ -6,6 +6,8 @@ import QrcodeVue from 'qrcode.vue'
 import QrLogin from './components/qr-login'
 import TeacherAuth from './components/teacher-auth'
 import { state } from '@/state'
+import sutdentDownLoad from '@/common/images/student_download.png'
+import teacherDownLoad from '@/common/images/teacher_download.png'
 
 export const getAssetsHomeFile = (fileName: string) => {
   const path = `./images/${fileName}`
@@ -220,11 +222,22 @@ export default defineComponent({
 
           {this.type === 'register-success' && (
             <div class={'text-center pt-4'}>
-              <QrcodeVue
+              {/* <QrcodeVue
                 value={this.qrCodeDownLoad}
                 size={178}
                 class="mx-auto shadow-lg w-[178px] h-[178px] align-middle"
-              />
+              /> */}
+              {this.registerType === 'teacher' ? (
+                <img
+                  src={teacherDownLoad}
+                  class="mx-auto shadow-lg w-[178px] h-[178px] align-middle"
+                />
+              ) : (
+                <img
+                  src={sutdentDownLoad}
+                  class="mx-auto shadow-lg w-[178px] h-[178px] align-middle"
+                />
+              )}
 
               <h3 class="text-lg text=[#1a1a1a] pt-4 pb-2">注册成功</h3>
               <div class={[styles.scanTxt, 'leading-6']}>

src/views/student-info/my-follow/index.tsx

@@ -12,12 +12,12 @@ export default defineComponent({
   },
   render() {
     return (
-      <div class={styles.myFollow}>
-        <ElTabs v-model={this.active}>
-          <ElTabPane label="我关注的老师" name="MYFOLLOW">
-            <List />
-          </ElTabPane>
-        </ElTabs>
+      <div class="h-full bg-[#FAFAFA] rounded-md overflow-hidden">
+        <div class="text-sm text-[#333] bg-white leading-none px-6 py-5 border-b border-b-[#E5E5E5]">
+          关注的老师
+        </div>
+
+        <List />
       </div>
     )
   }

src/views/student-info/my-follow/item.tsx

@@ -21,7 +21,9 @@ export default defineComponent({
     const item = this.item
     return (
       <div
-        class={['py-3 pl-3 pr-5 flex justify-between', styles.musicListItem]}
+        class={[
+          'py-3 pl-3 pr-5 flex justify-between bg-white rounded-md  hover:drop-shadow-lg transition-all'
+        ]}
       >
         <div class="flex items-center">
           <img src={iconTeacher} class="w-[54px] h-[54px] rounded-full" />
@@ -29,12 +31,12 @@ export default defineComponent({
           <div class="pl-5">
             <div class="flex items-center">
               <span class="text-base pr-1 text-[#333]">{item.userName}</span>
-              <ElRate
+              {/* <ElRate
                 modelValue={item.starGrade}
                 disabled
                 textColor="#ffc459"
                 class={[styles.rate, '!h-4']}
-              />
+              /> */}
             </div>
             <div class="pt-1">
               {this.subjects.map(subject => (
@@ -56,7 +58,7 @@ export default defineComponent({
         </div>
 
         <div class="flex items-center">
-          <div class="flex pr-16 text-[#333] text-base leading-none">
+          {/* <div class="flex pr-16 text-[#333] text-base leading-none">
             <p class="pr-5 mr-5 border-r">
               <span class="text-[#999] pr-2">粉丝</span>
               {item.fansNum}
@@ -65,7 +67,7 @@ export default defineComponent({
               <span class="text-[#999] pr-2">已上课时</span>
               {item.expTime}
             </p>
-          </div>
+          </div> */}
 
           <ElButton
             type="primary"

src/views/student-info/my-follow/list.tsx

@@ -52,47 +52,51 @@ export default defineComponent({
           this.loading = false
         }, 200)
       }
+      // this.loading = true
     }
   },
   render() {
     return (
       <>
-        <div class="px-[38px] pt-4">
+        <div class="px-3 pt-5">
           <ElSkeleton
             loading={this.loading}
             animated
-            class=" w-full m-auto px-[14px] flex items-center flex-col"
-            count={3}
+            class=" w-full m-auto flex flex-wrap"
+            count={2}
             v-slots={{
               template: () => (
-                <div class="h-[94px] flex items-center justify-between w-full mb-2">
-                  <div class="w-2/3 flex items-center">
+                <div class="basis-1/2">
+                  <div class=" rounded-md bg-white py-4 px-[14px] mb-4 mx-2 flex items-center">
                     <ElSkeletonItem
                       variant="circle"
-                      style={{ width: '66px', height: '66px' }}
+                      style={{ width: '54px', height: '54px' }}
                     ></ElSkeletonItem>
-                    <div class="w-1/2 pl-2">
+
+                    <div class="flex w-32 flex-col pl-2.5">
                       <ElSkeletonItem variant="h3"></ElSkeletonItem>
                       <ElSkeletonItem
                         variant="p"
-                        style={{ width: '50%' }}
+                        style={{ width: '60%', marginTop: '6px' }}
                       ></ElSkeletonItem>
                     </div>
                   </div>
-                  <ElSkeletonItem
-                    variant="p"
-                    style={{ width: '20%' }}
-                  ></ElSkeletonItem>
                 </div>
               )
             }}
           >
-            {this.list.map((item: any) => (
-              <Item class="mb-2" item={item} />
-            ))}
+            <div class="flex flex-wrap">
+              {this.list.map((item: any) => (
+                <div class="basis-1/2">
+                  <Item class="mb-4 mx-2" item={item} />
+                </div>
+              ))}
+            </div>
           </ElSkeleton>
         </div>
 
+        {this.dataShow && <ColEmpty />}
+
         <Pagination
           total={this.pageInfo.total}
           v-model:page={this.pageInfo.page}
@@ -100,8 +104,6 @@ export default defineComponent({
           pageSizes={this.pageInfo.page_size}
           pagination={this.getList}
         />
-
-        {this.dataShow && <ColEmpty />}
       </>
     )
   }

src/views/student-info/my-score/list.tsx

@@ -136,7 +136,7 @@ export default defineComponent({
           pagination={this.getList}
         />
 
-        {this.dataShow && <ColEmpty />}
+        {this.dataShow && <ColEmpty style={{ marginBottom: '30px' }} />}
       </>
     )
   }

src/views/user-info/components/users/index.tsx

@@ -73,7 +73,12 @@ export default defineComponent({
         </div>
 
         <div class="text-[14px] text-[#666] flex items-center justify-center">
-          <span class="flex items-center justify-center leading-6">
+          <span
+            class="flex items-center justify-center leading-6 cursor-pointer"
+            onClick={() => {
+              this.$router.push('/userInfo/myFans')
+            }}
+          >
             粉丝
             <b class="text-black text-xl pl-1 pb-[2px]">
               {this.userInfo.fansNum || 0}

src/views/user-info/my-fans/index.tsx

@@ -0,0 +1,132 @@
+import ColEmpty from '@/components/col-empty'
+import Pagination from '@/components/pagination'
+import request from '@/helpers/request'
+import { ElImage, ElSkeleton, ElSkeletonItem, ElTag } from 'element-plus'
+import { defineComponent } from 'vue'
+
+export default defineComponent({
+  name: 'MyFans',
+  data() {
+    return {
+      pageInfo: {
+        // 分页规则
+        limit: 12, // 限制显示条数
+        page: 1, // 当前页
+        total: 0, // 总条数
+        page_size: [12, 24, 48, 60] // 选择限制显示条数
+      },
+      list: [] as any[],
+      loading: false,
+      dataShow: false // 是否有数据
+    }
+  },
+  mounted() {
+    this.getList()
+  },
+  methods: {
+    async getList() {
+      this.loading = true
+      try {
+        const { data } = await request.post(
+          '/api-website/teacher/queryMyFans',
+          {
+            requestType: 'json',
+            data: {
+              page: this.pageInfo.page,
+              rows: this.pageInfo.limit
+            }
+          }
+        )
+        this.list = data.rows || []
+        console.log(this.list)
+        this.pageInfo.total = data.total
+        if (data.total <= 0) {
+          this.dataShow = true
+        }
+      } catch {}
+      if (this.dataShow) {
+        this.loading = false
+      } else {
+        setTimeout(() => {
+          this.loading = false
+        }, 200)
+      }
+    }
+  },
+  render() {
+    return (
+      <div class="h-full bg-[#FAFAFA] rounded-md overflow-hidden">
+        <div class="text-sm text-[#333] bg-white leading-none px-6 py-5 border-b border-b-[#E5E5E5]">
+          我的粉丝
+        </div>
+
+        <div class=" pt-4">
+          <ElSkeleton
+            loading={this.loading}
+            animated
+            class=" w-full m-auto px-[14px] flex"
+            count={3}
+            v-slots={{
+              template: () => (
+                <div class="w-[296px] rounded-md bg-white py-4 px-[14px] mb-4 m-auto flex items-center hover:drop-shadow-lg transition-all">
+                  <ElSkeletonItem
+                    variant="circle"
+                    style={{ width: '56px', height: '56px' }}
+                  ></ElSkeletonItem>
+
+                  <div class="flex w-32 flex-col pl-2.5">
+                    <ElSkeletonItem variant="h3"></ElSkeletonItem>
+                    <ElSkeletonItem
+                      variant="p"
+                      style={{ width: '60%', marginTop: '6px' }}
+                    ></ElSkeletonItem>
+                  </div>
+                </div>
+              )
+            }}
+          >
+            <div class="flex flex-wrap px-3">
+              {this.list.map((item: any) => (
+                <div class="basis-1/3 ">
+                  <div class="w-[296px] rounded-md bg-white py-4 px-[14px] mb-4 m-auto flex items-center hover:drop-shadow-lg transition-all">
+                    <ElImage src={item.avatar} class="w-14 h-14 rounded-full" />
+
+                    <div class="pl-2.5">
+                      <p class="text-base text-[#333] font-medium leading-tight pb-1.5">
+                        {item.userName}
+                      </p>
+                      <p>
+                        <ElTag
+                          effect="dark"
+                          size="small"
+                          color="#FFF1DE"
+                          style={{
+                            borderColor: '#FFF1DE',
+                            color: '#FF8C00',
+                            marginRight: '5px'
+                          }}
+                        >
+                          {item.subjectName}
+                        </ElTag>
+                      </p>
+                    </div>
+                  </div>
+                </div>
+              ))}
+            </div>
+          </ElSkeleton>
+        </div>
+
+        <Pagination
+          total={this.pageInfo.total}
+          v-model:page={this.pageInfo.page}
+          v-model:limit={this.pageInfo.limit}
+          pageSizes={this.pageInfo.page_size}
+          pagination={this.getList}
+        />
+
+        {this.dataShow && <ColEmpty />}
+      </div>
+    )
+  }
+})