更新

src/components/col-header/index.module.less

@@ -11,6 +11,6 @@
 }
 
 .headerSection {
-  min-height: var(--van-nav-bar-height);
+  // min-height: var(--van-nav-bar-height);
   position: relative;
 }

src/components/col-header/index.tsx

@@ -106,14 +106,20 @@ export default defineComponent({
         ) : (
           <>
             <div
-              style={{ paddingTop: `${this.navBarHeight}px` }}
+              // style={{ paddingTop: `${this.navBarHeight}px` }}
+              style={{
+                minHeight: `calc(var(--van-nav-bar-height) + ${this.navBarHeight}px)`
+              }}
               class={styles.headerSection}
             >
               <NavBar
                 title={this.headerTitle}
-                // style={{ height: this.titleHeight + 'px', lineHeight: this.titleHeight + 'px' }}
                 class={[styles.colHeader]}
-                style={{ background: this.background, color: this.color }}
+                style={{
+                  background: this.background,
+                  color: this.color,
+                  paddingTop: `${this.navBarHeight}px`
+                }}
                 left-arrow={this.isBack}
                 rightText={this.rightText}
                 fixed={this.isFixed}

src/components/col-video/index.tsx

@@ -23,6 +23,10 @@ export default defineComponent({
     styleValue: {
       type: Object,
       default: () => ({})
+    },
+    playsinline: {
+      type: Boolean,
+      default: true
     }
   },
   data() {
@@ -81,7 +85,7 @@ export default defineComponent({
         <video
           ref="video"
           src={this.src}
-          playsinline
+          playsinline={this.playsinline}
           poster={this.poster}
           style={{ ...this.styleValue }}
         />

src/student/live-class/live-detail.tsx

@@ -9,6 +9,7 @@ import { defineComponent } from 'vue'
 import styles from './live-detail.module.less'
 import iconTips from '@common/images/icon_tips.png'
 import { orderStatus } from '@/views/order-detail/orderStatus'
+import ColHeader from '@/components/col-header'
 interface IProps {
   courseTime: string
   coursePlan: string
@@ -37,7 +38,7 @@ export default defineComponent({
           `${dayjs(startTime).format('YYYY-MM-DD')} ${dayjs(startTime).format(
             'HH:mm'
           )}~${dayjs(endTime).format('HH:mm')}` || '',
-        buyNum: 0,
+        buyNum: live.studentCount,
         lessonPrice: live.coursePrice,
         lessonNum: live.courseNum,
         lessonDesc: live.courseIntroduce,
@@ -104,6 +105,7 @@ export default defineComponent({
   render() {
     return (
       <div class={[styles['live-detail'], 'mb12']}>
+        <ColHeader />
         <UserDetail userInfo={this.userInfo} />
         <SectionDetail>
           <p class={styles.introduction}>{this.userInfo.lessonDesc}</p>

src/student/main.ts

@@ -11,6 +11,9 @@ import '../styles/index.less'
 
 const app = createApp(App)
 
+// import Vconsole from 'vconsole'
+// const vconsole = new Vconsole()
+
 dayjs.locale('zh-ch')
 app.config.globalProperties.$dayjs = dayjs
 app.config.globalProperties.$filters = vueFilter

src/student/teacher-dependent/components/live.module.less

@@ -0,0 +1,61 @@
+.liveList {
+  padding: 14px;
+}
+
+.liCover {
+  width: 105px;
+  height: 71px;
+  border-radius: 4px;
+}
+
+.liContent {
+  padding-left: 10px;
+  .liTitle {
+    font-size: 15px;
+    font-weight: 500;
+    color: #1a1a1a;
+    line-height: 20px;
+    padding-bottom: 8px;
+    padding-top: 8px;
+  }
+  .avatar {
+    width: 18px;
+    height: 18px;
+    overflow: hidden;
+    border-radius: 50%;
+    margin-right: 6px;
+  }
+
+  .liUserInfo,
+  .userInfo {
+    display: flex;
+    align-items: center;
+    font-size: 13px;
+    color: #999999;
+    line-height: 18px;
+  }
+
+  .userInfo {
+    padding-right: 10px;
+    margin-right: 10px;
+  }
+
+  .num {
+    color: #ff802c;
+  }
+}
+
+.price {
+  font-size: 14px;
+  color: var(--van-primary);
+  span {
+    font-weight: 600;
+    font-size: 16px;
+  }
+}
+
+.liveGroup {
+  border-radius: 10px;
+  overflow: hidden;
+  margin-bottom: 10px;
+}

src/student/teacher-dependent/components/live.tsx

@@ -0,0 +1,101 @@
+import ColResult from '@/components/col-result'
+import { Cell, CellGroup, List, Image, Icon } from 'vant'
+import { defineComponent } from 'vue'
+import styles from './live.module.less'
+
+import iconTimer from '@common/images/icon_timer2.png'
+
+export default defineComponent({
+  name: 'live',
+  data() {
+    return {
+      list: [],
+      dataShow: true, // 判断是否有数据
+      loading: false,
+      finished: false,
+      params: {
+        page: 1,
+        rows: 20
+      }
+    }
+  },
+  render() {
+    return (
+      <>
+        {this.dataShow ? (
+          <List
+            class={styles.liveList}
+            v-model:loading={this.loading}
+            finished={this.finished}
+            finishedText="没有更多了"
+          >
+            {[1, 2, 3, 4, 5, 6, 7, 8, 9, 10].map(item => (
+              <CellGroup class={styles.liveGroup}>
+                <Cell
+                  v-slots={{
+                    icon: () => <Image class={styles.liCover} fit="cover" />,
+                    title: () => (
+                      <div class={styles.liContent}>
+                        <div class={[styles.liTitle, 'van-ellipsis']}>
+                          竖笛基础入门直播课
+                        </div>
+                        <div class={styles.liUserInfo}>
+                          <div class={[styles.userInfo, 'van-hairline--right']}>
+                            <Image class={styles.avatar} fit="cover" />
+                            <p>老师：李老师</p>
+                          </div>
+                          <span class={styles.num}>0人已购买</span>
+                        </div>
+                      </div>
+                    )
+                  }}
+                />
+                <Cell
+                  titleStyle={{ color: '#666666', fontSize: '13px' }}
+                  v-slots={{
+                    title: () => (
+                      <span
+                        style={{
+                          display: 'flex',
+                          alignItems: 'center',
+                          fontSize: '13px'
+                        }}
+                      >
+                        <Icon
+                          name={iconTimer}
+                          size="16"
+                          style={{ marginRight: '5px' }}
+                        />
+                        2022/3月20日(周日)
+                      </span>
+                    ),
+                    default: () => (
+                      <div class={styles.price}>
+                        <span>¥40</span>/40课时
+                      </div>
+                    )
+                  }}
+                />
+              </CellGroup>
+            ))}
+          </List>
+        ) : (
+          <ColResult btnStatus={false} classImgSize="SMALL" tips="暂无直播课" />
+        )}
+      </>
+    )
+
+    {
+      /* <List
+v-model:loading={this.loading}
+finished={this.finished}
+finishedText="没有更多了"
+onLoad={this.getList}
+>
+{this.buyUserList.map(item => (
+  <UserList class="mb12" users={item} />
+))}
+</List> */
+    }
+  }
+})

src/student/teacher-dependent/components/music.tsx

@@ -0,0 +1,48 @@
+import ColResult from '@/components/col-result'
+import { List } from 'vant'
+import { defineComponent } from 'vue'
+import styles from './music.module.less'
+
+export default defineComponent({
+  name: 'music',
+  data() {
+    return {
+      list: [],
+      dataShow: false, // 判断是否有数据
+      loading: false,
+      finished: false,
+      params: {
+        page: 1,
+        rows: 20
+      }
+    }
+  },
+  render() {
+    return (
+      <>
+        {this.dataShow ? (
+          <List
+            v-model:loading={this.loading}
+            finished={this.finished}
+            finishedText="没有更多了"
+          ></List>
+        ) : (
+          <ColResult btnStatus={false} classImgSize="SMALL" tips="暂无乐谱" />
+        )}
+      </>
+    )
+
+    {
+      /* <List
+v-model:loading={this.loading}
+finished={this.finished}
+finishedText="没有更多了"
+onLoad={this.getList}
+>
+{this.buyUserList.map(item => (
+  <UserList class="mb12" users={item} />
+))}
+</List> */
+    }
+  }
+})

src/student/teacher-dependent/components/practice.module.less

@@ -0,0 +1,55 @@
+.practice {
+  padding: 14px 14px 0;
+
+  .group {
+    margin-bottom: 12px;
+    border-radius: 10px;
+    overflow: hidden;
+  }
+
+  .price {
+    font-size: 14px;
+    color: #999999;
+    span {
+      font-weight: 600;
+      color: #fa6400;
+      font-size: 16px;
+    }
+  }
+}
+
+.arrangeCell {
+  margin: 10px 0 0;
+  width: auto;
+  border-radius: 10px;
+  overflow: hidden;
+}
+
+.rTitle {
+  display: flex;
+  align-items: center;
+  font-size: 16px;
+  color: #333;
+  font-weight: 500;
+  &::before {
+    margin-right: 8px;
+    content: ' ';
+    display: inline-block;
+    width: 4px;
+    height: 17px;
+    background: linear-gradient(180deg, #59e5d5 0%, #2dc7aa 100%);
+    border-radius: 3px;
+  }
+}
+
+:global {
+  .van-stepper--round .van-stepper__minus {
+    color: #333 !important;
+    border: #f3f3f3;
+    background: #f3f3f3;
+  }
+
+  .van-stepper--round .van-stepper__plus {
+    background: var(--van-primary);
+  }
+}

src/student/teacher-dependent/components/practice.tsx

@@ -0,0 +1,87 @@
+import Calendar from '@/business-components/calendar'
+import { Cell, CellGroup, Dialog, Stepper, Tag } from 'vant'
+import { defineComponent } from 'vue'
+import styles from './practice.module.less'
+
+export default defineComponent({
+  name: 'practice',
+  data() {
+    return {
+      showSelectList: []
+    }
+  },
+  methods: {
+    onCloseTag(item: any) {
+      Dialog.confirm({
+        title: '提示',
+        message: '您是否要删除该选择的课程？',
+        confirmButtonColor: 'var(--van-primary)'
+      }).then(() => {
+        // const index = createState.selectCourseList.findIndex(
+        //   (course: any) => course.startTime === item.startTime
+        // )
+        // createState.selectCourseList.splice(index, 1)
+      })
+    }
+  },
+  render() {
+    return (
+      <div class={styles.practice}>
+        <CellGroup class={styles.group}>
+          <Cell
+            title="陪练课收费"
+            v-slots={{
+              default: () => (
+                <div class={styles.price}>
+                  <span>¥40</span>/25分钟
+                </div>
+              )
+            }}
+          />
+          <Cell title="选择专业" isLink value="竖笛" />
+          <Cell
+            title="课时数"
+            v-slots={{
+              default: () => <Stepper theme="round" buttonSize={22} />
+            }}
+          />
+        </CellGroup>
+
+        <div class={styles.group}>
+          <Calendar />
+        </div>
+
+        <Cell
+          class={[styles.arrangeCell, 'mb12']}
+          v-slots={{
+            title: () => (
+              <div class={styles.rTitle}>
+                <span>已选择课程时间</span>
+              </div>
+            ),
+            label: () => (
+              <div class={styles.rTag}>
+                {this.showSelectList.map((item: any) => (
+                  <>
+                    <Tag
+                      plain
+                      round
+                      closeable
+                      size="large"
+                      type="primary"
+                      class={styles.tag}
+                      onClose={() => this.onCloseTag(item)}
+                    >
+                      {item.title}
+                    </Tag>
+                    <br />
+                  </>
+                ))}
+              </div>
+            )
+          }}
+        ></Cell>
+      </div>
+    )
+  }
+})

src/student/teacher-dependent/components/single.module.less

@@ -1,6 +1,75 @@
+.single {
+  margin-bottom: 20px;
+}
 .introduction {
   font-size: 13px;
   color: #666666;
   line-height: 1.6;
   padding-bottom: 15px;
 }
+
+.videoList {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  flex-wrap: wrap;
+}
+
+.videoItem {
+  width: 157px;
+  height: 106px;
+  background: #d8d8d8;
+  border-radius: 10px;
+  overflow: hidden;
+  position: relative;
+  margin-bottom: 10px;
+  .icon-upload {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    color: #fff;
+  }
+
+  :global {
+    .van-image {
+      width: 100%;
+      height: 100%;
+      overflow: hidden;
+    }
+  }
+}
+
+.fansGroup {
+  padding: 0 0 25px !important;
+  &:last-child {
+    padding-bottom: 12px !important;
+  }
+  :global {
+    .van-cell__title,
+    .van-cell__value {
+      flex: 1 auto;
+    }
+  }
+
+  p {
+    font-size: 14px;
+    color: #999999;
+    line-height: 20px;
+    width: 160px;
+  }
+}
+
+.fansImage {
+  width: 42px;
+  height: 42px;
+  border-radius: 50%;
+  overflow: hidden;
+}
+
+.fansTitle {
+  padding-left: 12px;
+  font-size: 16px;
+  color: #1a1a1a;
+  line-height: 22px;
+}

src/student/teacher-dependent/components/single.tsx

@@ -1,12 +1,20 @@
 import SectionDetail from '@/business-components/section-detail'
+import ColVideo from '@/components/col-video'
+import { Button, Cell, Icon, Image } from 'vant'
 import { defineComponent } from 'vue'
 import styles from './single.module.less'
 
+export const getAssetsHomeFile = (fileName: string) => {
+  const path = `../images/${fileName}`
+  const modules = import.meta.globEager('../images/*')
+  return modules[path].default
+}
+
 export default defineComponent({
   name: 'single',
   render() {
     return (
-      <div class="single">
+      <div class={styles.single}>
         <SectionDetail
           icon="personal"
           title="个人风采"
@@ -22,24 +30,49 @@ export default defineComponent({
         </SectionDetail>
 
         <SectionDetail icon="elegant" title="老师风采" size={24} border={false}>
-          <p class={styles.introduction}>
-            毕业于中央音乐学员长笛专业，师从央音长笛系
-            曾获2016年锦绣杯长笛大赛冠军
-            自2018年起研究长笛启蒙、考级到专业考试教育
-            总结出一套适合各个阶段需要的教学方式所教学员考级通过率100%，专业院校复试率92%
-          </p>
+          <div class={styles.videoList}>
+            <div class={styles.videoItem}>
+              <Image
+                src="https://daya.ks3-cn-beijing.ksyun.com/202204/T3JggS0.png"
+                fit="cover"
+              />
+              <Icon
+                class={styles['icon-upload']}
+                name={getAssetsHomeFile('icon_video.png')}
+                size={26}
+              />
+            </div>
+          </div>
         </SectionDetail>
 
-        {[1, 2, 3, 4, 5].map(i => (
-          <SectionDetail icon="fans" title="粉丝群" size={24} border={false}>
-            <p class={styles.introduction}>
-              毕业于中央音乐学员长笛专业，师从央音长笛系
-              曾获2016年锦绣杯长笛大赛冠军
-              自2018年起研究长笛启蒙、考级到专业考试教育
-              总结出一套适合各个阶段需要的教学方式所教学员考级通过率100%，专业院校复试率92%
-            </p>
-          </SectionDetail>
-        ))}
+        <SectionDetail icon="fans" title="粉丝群" size={24} border={false}>
+          {[1, 2, 3].map(item => (
+            <Cell
+              center
+              class={styles.fansGroup}
+              v-slots={{
+                icon: () => (
+                  <Image
+                    src="https://daya.ks3-cn-beijing.ksyun.com/202204/T3JggS0.png"
+                    fit="cover"
+                    class={styles.fansImage}
+                  />
+                ),
+                title: () => (
+                  <div class={styles.fansTitle}>
+                    <div class={styles.title}>竖笛学习</div>
+                    <p class="van-ellipsis">李老师竖笛交流群李老师竖笛交流群</p>
+                  </div>
+                ),
+                default: () => (
+                  <Button type="primary" size="small" round>
+                    申请入群
+                  </Button>
+                )
+              }}
+            />
+          ))}
+        </SectionDetail>
       </div>
     )
   }

src/student/teacher-dependent/components/video.module.less

@@ -0,0 +1,14 @@
+.videoList {
+  display: flex;
+  justify-content: space-between;
+  flex-wrap: wrap;
+  padding: 14px;
+}
+
+:global {
+  .van-list__loading,
+  .van-list__finished-text,
+  .van-list__error-text {
+    width: 100%;
+  }
+}

src/student/teacher-dependent/components/video.tsx

@@ -0,0 +1,54 @@
+import ColResult from '@/components/col-result'
+import VideoItem from '@/student/video-class/video-item'
+import { List } from 'vant'
+import { defineComponent } from 'vue'
+import styles from './video.module.less'
+
+export default defineComponent({
+  name: 'VideoList',
+  data() {
+    return {
+      list: [],
+      dataShow: true, // 判断是否有数据
+      loading: false,
+      finished: false,
+      params: {
+        page: 1,
+        rows: 20
+      }
+    }
+  },
+  render() {
+    return (
+      <>
+        {this.dataShow ? (
+          <List
+            class={styles.videoList}
+            v-model:loading={this.loading}
+            finished={this.finished}
+            finishedText="没有更多了"
+          >
+            {[1, 2, 3, 4, 5, 6, 7, 8, 9, 10].map(item => (
+              <VideoItem />
+            ))}
+          </List>
+        ) : (
+          <ColResult btnStatus={false} classImgSize="SMALL" tips="暂无视频课" />
+        )}
+      </>
+    )
+
+    {
+      /* <List
+v-model:loading={this.loading}
+finished={this.finished}
+finishedText="没有更多了"
+onLoad={this.getList}
+>
+{this.buyUserList.map(item => (
+  <UserList class="mb12" users={item} />
+))}
+</List> */
+    }
+  }
+})

src/student/teacher-dependent/teacher-home.module.less

@@ -148,5 +148,5 @@
 }
 
 .container {
-  padding-bottom: 20px;
+  // padding-bottom: 20px;
 }

src/student/teacher-dependent/teacher-home.tsx

@@ -5,6 +5,10 @@ import { Button, Cell, Icon, Image, Rate, Sticky, Tab, Tabs } from 'vant'
 
 import iconTeacher from '@common/images/icon_teacher.png'
 import Single from './components/single'
+import Practice from './components/practice'
+import Live from './components/live'
+import VideoList from './components/video'
+import Music from './components/music'
 
 export const getAssetsHomeFile = (fileName: string) => {
   const path = `./images/${fileName}`
@@ -15,10 +19,12 @@ export const getAssetsHomeFile = (fileName: string) => {
 export default defineComponent({
   name: 'teacherHome',
   data() {
+    const query = this.$route.query
     return {
-      tabs: 'single'
+      tabs: query.tabs || 'single'
     }
   },
+  mounted() {},
   render() {
     return (
       <div class={styles['teacher-record']}>
@@ -104,6 +110,10 @@ export default defineComponent({
 
         <div class={styles.container}>
           {this.tabs === 'single' && <Single />}
+          {this.tabs === 'practice' && <Practice />}
+          {this.tabs === 'live' && <Live />}
+          {this.tabs === 'video' && <VideoList />}
+          {this.tabs === 'music' && <Music />}
         </div>
       </div>
     )

src/student/video-class/video-class-detail.tsx

@@ -1,14 +1,14 @@
-import CourseVideoItem from "@/business-components/course-video-item";
-import SectionDetail from "@/business-components/section-detail";
-import ColHeader from "@/components/col-header";
-import ColVideo from "@/components/col-video";
-import request from "@/helpers/request";
-import { Cell, Icon, Rate, Tab, Tabs, Image, Button, Sticky, Field } from "vant";
-import { defineComponent } from "vue";
-import styles from './video-class-detail.module.less';
-import { state } from "@/state";
+import CourseVideoItem from '@/business-components/course-video-item'
+import SectionDetail from '@/business-components/section-detail'
+import ColHeader from '@/components/col-header'
+import ColVideo from '@/components/col-video'
+import request from '@/helpers/request'
+import { Cell, Icon, Rate, Tab, Tabs, Image, Button, Sticky, Field } from 'vant'
+import { defineComponent } from 'vue'
+import styles from './video-class-detail.module.less'
+import { state } from '@/state'
 
-import iconTeacher from '@common/images/icon_teacher.png';
+import iconTeacher from '@common/images/icon_teacher.png'
 
 export default defineComponent({
   name: 'VideoClassDetail',
@@ -22,7 +22,10 @@ export default defineComponent({
       detailList: [],
       posterUrl: '',
       srcUrl: '',
-      message: ''
+      message: '',
+      navHeight: 0 as any,
+      currentClassIndex: 1,
+      reload: false
     }
   },
   computed: {
@@ -31,76 +34,144 @@ export default defineComponent({
     }
   },
   async mounted() {
+    this.navHeight = sessionStorage.getItem('navHeight') || 0
     try {
-      const res = await request.get('/api-teacher/videoLessonGroup/selectVideoLesson', {
-        params: {
-          groupId: this.groupId
+      const res = await request.get(
+        '/api-teacher/videoLessonGroup/selectVideoLesson',
+        {
+          params: {
+            groupId: this.groupId
+          }
         }
-      })
+      )
       const result = res.data || {}
       this.title = result.lessonGroup.lessonName
       this.detailList = result.detailList || []
-      this.detailList.forEach((item: any) => {
+      this.detailList.forEach((item: any, index: number) => {
         if (item.id === Number(this.classId)) {
           this.posterUrl = item.coverUrl
           this.srcUrl = item.videoUrl
+          this.title = item.videoTitle
+          this.currentClassIndex = index + 1
         }
       })
-    } catch { }
+    } catch {}
   },
   methods: {
     onPlay(item: any) {
+      this.reload = true
       this.posterUrl = item.imgUrl
       this.srcUrl = item.videoUrl
+      this.title = item.title
+      this.currentClassIndex = item.index
+      setTimeout(() => {
+        this.reload = false
+      }, 0)
     }
   },
   render() {
     return (
       <div class={styles['video-class-detail']}>
-        <ColHeader v-slots={{
-          content: () => (
-            <ColVideo src={this.srcUrl} poster={this.posterUrl} />
-          )
-        }} />
-        <Cell border={false} class={styles.cell} title={this.title} titleClass={styles.titleInfo} v-slots={{
-          icon: () => (<Icon name="video" size={18} style={{ display: 'flex', alignItems: 'center' }} />),
-          value: () => (<div class={styles.label}><span>1</span>/4课时</div>)
-        }}></Cell>
+        <ColHeader
+          v-slots={{
+            content: () =>
+              !this.reload && (
+                <ColVideo src={this.srcUrl} poster={this.posterUrl} />
+              )
+          }}
+        />
+        <Cell
+          border={false}
+          class={styles.cell}
+          title={this.title}
+          titleClass={styles.titleInfo}
+          v-slots={{
+            icon: () => (
+              <Icon
+                name="video"
+                size={18}
+                color="var(--van-primary)"
+                style={{ display: 'flex', alignItems: 'center' }}
+              />
+            ),
+            value: () => (
+              <div class={styles.label}>
+                <span>{this.currentClassIndex}</span>/{this.detailList.length}
+                课时
+              </div>
+            )
+          }}
+        ></Cell>
 
-        <Tabs v-model:active={this.tabIndex} class={styles.infoField} color="var(--van-primary)" lineWidth={20}>
+        <Tabs
+          v-model:active={this.tabIndex}
+          class={styles.infoField}
+          color="var(--van-primary)"
+          lineWidth={20}
+        >
           <Tab title="目录" name={1}>
-            <div style={{ height: 'calc(100vh - 320px)', overflowY: 'auto' }}>
-              <SectionDetail title="课程列表" icon="courseList" >
+            <div
+              style={{
+                height: `calc(100vh - 320px - ${this.navHeight}px)`,
+                overflowY: 'auto'
+              }}
+            >
+              <SectionDetail title="课程列表" icon="courseList">
                 {this.detailList.map((item: any) => (
-                  <CourseVideoItem class={'mb12'} detail={{
-                    id: item.id,
-                    title: item.videoTitle,
-                    content: item.videoContent,
-                    imgUrl: item.coverUrl,
-                    videoUrl: item.videoUrl
-                  }} onPlay={this.onPlay} />
+                  <CourseVideoItem
+                    class={'mb12'}
+                    detail={{
+                      id: item.id,
+                      title: item.videoTitle,
+                      content: item.videoContent,
+                      imgUrl: item.coverUrl,
+                      videoUrl: item.videoUrl
+                    }}
+                    onPlay={this.onPlay}
+                  />
                 ))}
               </SectionDetail>
             </div>
-
           </Tab>
           <Tab title="简介" name={2}>
-            <Cell class={styles['open-teacher-info']} border={false} v-slots={{
-              icon: () => (<Image class={styles.userLogo} src={this.users?.headUrl || iconTeacher} fit="cover" />)
-            }}>
+            <Cell
+              class={styles['open-teacher-info']}
+              border={false}
+              v-slots={{
+                icon: () => (
+                  <Image
+                    class={styles.userLogo}
+                    src={this.users?.headUrl || iconTeacher}
+                    fit="cover"
+                  />
+                )
+              }}
+            >
               <div class={styles['teacher-info']}>
                 <div class={styles['users']}>
                   <div class={styles['teacher-name']}>
                     {this.users?.username}
                   </div>
-                  <Rate modelValue={this.users?.starGrade} iconPrefix="iconfont" color="#FFC459" void-icon="star_default" icon="star_active" size={15} />
-                </div>
-                <div class={styles.level}>
-                  粉丝{this.users?.fansNum}
+                  <Rate
+                    modelValue={this.users?.starGrade}
+                    iconPrefix="iconfont"
+                    color="#FFC459"
+                    void-icon="star_default"
+                    icon="star_active"
+                    size={15}
+                  />
                 </div>
+                <div class={styles.level}>粉丝{this.users?.fansNum}</div>
               </div>
               <div class={styles['teacher-desc']}>
-                <Button type="primary" icon="plus" size="mini" style={{ borderRadius: '5px', padding: '0 8px' }}>关注</Button>
+                <Button
+                  type="primary"
+                  icon="plus"
+                  size="mini"
+                  style={{ borderRadius: '5px', padding: '0 8px' }}
+                >
+                  关注
+                </Button>
               </div>
             </Cell>
             <SectionDetail>
@@ -108,32 +179,60 @@ export default defineComponent({
             </SectionDetail>
           </Tab>
           <Tab title="讨论" name={3}>
-            <div style={{ height: 'calc(100vh - 365px)', overflowY: 'auto' }}>
+            <div
+              style={{
+                height: `calc(100vh - 380px - ${this.navHeight}px)`,
+                overflowY: 'auto'
+              }}
+            >
               {[1, 2, 3].map((item: any) => (
-                <Cell class={[styles['message-list'], styles['message-active']]} valueClass={styles['message-time']} v-slots={{
-                  icon: () => (<Image class={styles.userLogo} src={this.users?.headUrl || iconTeacher} fit="cover" />),
-                  title: () => (<div class={styles.title}>
-                    <div class={styles['message-name']}>讨论讨论讨</div>
-                    <div class={styles['message-time']}>2022年4月11日</div>
-                  </div>),
-                  label: () => (<div class={styles.label}>电光2323232323冷雾中</div>)
-                }} />
+                <Cell
+                  class={[styles['message-list'], styles['message-active']]}
+                  valueClass={styles['message-time']}
+                  v-slots={{
+                    icon: () => (
+                      <Image
+                        class={styles.userLogo}
+                        src={this.users?.headUrl || iconTeacher}
+                        fit="cover"
+                      />
+                    ),
+                    title: () => (
+                      <div class={styles.title}>
+                        <div class={styles['message-name']}>讨论讨论讨</div>
+                        <div class={styles['message-time']}>2022年4月11日</div>
+                      </div>
+                    ),
+                    label: () => (
+                      <div class={styles.label}>电光2323232323冷雾中</div>
+                    )
+                  }}
+                />
               ))}
             </div>
 
-            <Sticky offsetBottom={0} position='bottom'>
+            <Sticky offsetBottom={0} position="bottom">
               <Field
                 placeholder="快来讨论吧～"
                 v-model={this.message}
                 v-slots={{
                   button: () => (
-                    <Button type="primary" disabled={!this.message} style={{ padding: '0 20px' }} size="small" round>发布</Button>
+                    <Button
+                      type="primary"
+                      disabled={!this.message}
+                      style={{ padding: '0 20px' }}
+                      size="small"
+                      round
+                    >
+                      发布
+                    </Button>
                   )
-                }} />
+                }}
+              />
             </Sticky>
           </Tab>
         </Tabs>
       </div>
-    );
+    )
   }
-})
+})

src/student/video-class/video-detail.tsx

@@ -6,6 +6,7 @@ import { defineComponent } from 'vue'
 import { state } from '@/state'
 import styles from './video-detail.module.less'
 import request from '@/helpers/request'
+import ColHeader from '@/components/col-header'
 export default defineComponent({
   name: 'VideoDetail',
   data() {
@@ -40,6 +41,7 @@ export default defineComponent({
         username: users.username,
         headUrl: users.headUrl,
         buyNum: 0,
+        lessonNum: result.lessonGroup.lessonCount,
         lessonName: result.lessonGroup.lessonName,
         lessonDesc: result.lessonGroup.lessonDesc,
         lessonPrice: result.lessonGroup.lessonPrice,
@@ -93,7 +95,8 @@ export default defineComponent({
   },
   render() {
     return (
-      <div class={[styles['video-detail'], 'mb12']}>
+      <div class={[styles['video-detail']]}>
+        <ColHeader />
         <UserDetail userInfo={this.userInfo} />
         <SectionDetail>
           <p class={styles.introduction}>{this.userInfo.lessonDesc}</p>

src/styles/iconfont/iconfont.css

@@ -1,8 +1,8 @@
 @font-face {
   font-family: "iconfont"; /* Project id 3319600 */
-  src: url('iconfont.woff2?t=1649667195930') format('woff2'),
-       url('iconfont.woff?t=1649667195930') format('woff'),
-       url('iconfont.ttf?t=1649667195930') format('truetype');
+  src: url('iconfont.woff2?t=1650794756322') format('woff2'),
+       url('iconfont.woff?t=1650794756322') format('woff'),
+       url('iconfont.ttf?t=1650794756322') format('truetype');
 }
 
 .iconfont {
@@ -13,6 +13,14 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.iconfont-upload:before {
+  content: "\e617";
+}
+
+.iconfont-down:before {
+  content: "\e8ec";
+}
+
 .iconfont-star_active:before {
   content: "\e614";
 }
@@ -21,7 +29,3 @@
   content: "\e615";
 }
 
-.iconfont-down:before {
-  content: "\e613";
-}
-

src/teacher/live-class/create-components/course-start.tsx

@@ -31,6 +31,7 @@ export default defineComponent({
   name: 'course-start',
   data() {
     return {
+      typeDateTime: 'start',
       dateStatus: false,
       currentDate: new Date(),
       minDate: dayjs().toDate(),
@@ -61,6 +62,11 @@ export default defineComponent({
       }
     },
     onConfirm(val: any) {
+      if (this.typeDateTime === 'start') {
+        createState.live.salesStartDate = dayjs(val).format('YYYY-MM-DD')
+      } else if (this.typeDateTime === 'end') {
+        createState.live.salesEndDate = dayjs(val).format('YYYY-MM-DD')
+      }
       this.dateStatus = false
     }
   },
@@ -83,6 +89,7 @@ export default defineComponent({
                 this.currentDate = dayjs(
                   createState.live.salesStartDate
                 ).toDate()
+                this.typeDateTime = 'start'
                 this.dateStatus = true
               }}
               rules={[{ required: true, message: '请选择停售日期' }]}
@@ -96,6 +103,7 @@ export default defineComponent({
               isLink
               onClick={() => {
                 this.currentDate = dayjs(createState.live.salesEndDate).toDate()
+                this.typeDateTime = 'end'
                 this.dateStatus = true
               }}
               rules={[{ required: true, message: '请选择停售日期' }]}

src/teacher/live-class/create-components/createState.ts

@@ -14,9 +14,10 @@ export const createState = reactive({
   minutes: [] as any,
   tabIndex: 1,
   templateList: [
-    'https://daya.ks3-cn-beijing.ksyun.com/202110/Sn2OAjr.png',
-    'https://daya.ks3-cn-beijing.ksyun.com/202108/ShHJ1Bb.png',
-    'https://daya.ks3-cn-beijing.ksyun.com/202110/Sn76BUQ.png'
+    'https://daya.ks3-cn-beijing.ksyun.com/202204/T3unJdc.png',
+    'https://daya.ks3-cn-beijing.ksyun.com/202204/T3unJdl.png',
+    'https://daya.ks3-cn-beijing.ksyun.com/202204/T3unJdK.png',
+    'https://daya.ks3-cn-beijing.ksyun.com/202204/T3unJeA.png'
   ], // 模板列表
   selectCourseList: [] as any, // 选择课程列表
   coursePlanStatus: false, // 是否有锁课程

src/teacher/practice-class/practice-setting.tsx

@@ -99,6 +99,17 @@ export default defineComponent({
       //
       let teacher = await request.post('/api-teacher/teacher/querySubject')
       this.subjectList = teacher.data || []
+
+      // 获取课程设置
+      const setting = await request.post(
+        '/api-teacher/teacherFreeTime/getDetail',
+        {
+          data: {
+            defaultFlag: 1
+          }
+        }
+      )
+      console.log(setting)
     } catch {}
   },
   methods: {

src/teacher/video-class/createState.tsx

@@ -8,9 +8,10 @@ export const createState = reactive({
   rate: 0, // 手续费
   subjectList: [], // 声部列表
   templateList: [
-    'https://daya.ks3-cn-beijing.ksyun.com/202110/Sn2OAjr.png',
-    'https://daya.ks3-cn-beijing.ksyun.com/202108/ShHJ1Bb.png',
-    'https://daya.ks3-cn-beijing.ksyun.com/202110/Sn76BUQ.png'
+    'https://daya.ks3-cn-beijing.ksyun.com/202204/T3unJdc.png',
+    'https://daya.ks3-cn-beijing.ksyun.com/202204/T3unJdl.png',
+    'https://daya.ks3-cn-beijing.ksyun.com/202204/T3unJdK.png',
+    'https://daya.ks3-cn-beijing.ksyun.com/202204/T3unJeA.png'
   ], // 模板列表
   lessonGroup: {
     id: null,

src/teacher/video-class/video-class-detail.tsx

@@ -42,7 +42,6 @@ export default defineComponent({
         }
       )
       const result = res.data || {}
-      console.log(result)
       this.title = result.lessonGroup.lessonName
       this.detailList = result.detailList || []
       this.detailList.forEach((item: any, index: number) => {

src/views/order-detail/index.tsx

@@ -16,6 +16,7 @@ import UserAuth from './userAuth'
 
 import iconTips from '@common/images/icon_tips.png'
 import Payment from './payment'
+import ColHeader from '@/components/col-header'
 
 export default defineComponent({
   name: 'order-detail',
@@ -65,6 +66,7 @@ export default defineComponent({
   render() {
     return (
       <div class={styles['order-detail']}>
+        <ColHeader />
         {this.orderType === 'LIVE' && (
           <OrderLive ref="orderLive" v-model={this.orderPrice} />
         )}

src/views/order-detail/payment/index.tsx

@@ -40,7 +40,7 @@ export default defineComponent({
   },
   data() {
     return {
-      payType: 'zfb',
+      payType: 'alipay',
       pay_channel: ''
     }
   },
@@ -99,7 +99,7 @@ export default defineComponent({
             payChannel: this.payType
           }
         })
-        // console.log(res)
+        console.log(res)
         postMessage({
           api: 'paymentOrder',
           content: {

src/views/trade/trade-detail.tsx

@@ -36,6 +36,10 @@ export default defineComponent({
       }
     }
   },
+  mounted() {
+    console.log(this.type, 'this.type')
+    console.log(this.order[this.type].background)
+  },
   render() {
     return (
       <div class={[styles.tradeDetail, styles[this.type]]}>