|
|
@@ -1,258 +1,258 @@
|
|
|
-import ColHeader from '@/components/col-header'
|
|
|
-import ColSearch from '@/components/col-search'
|
|
|
-import { Sticky, Image, List, Popup, Icon } from 'vant'
|
|
|
-import { defineComponent } from 'vue'
|
|
|
-import styles from './index.module.less'
|
|
|
-import VideoItem from '@/student/video-class/video-item'
|
|
|
-// import VideoItem from './video-item'
|
|
|
-
|
|
|
-import banner from './images/banner.png'
|
|
|
-import request from '@/helpers/request'
|
|
|
-import ColResult from '@/components/col-result'
|
|
|
-import { state } from '@/state'
|
|
|
-import OrganSearch from '@/student/practice-class/model/organ-search'
|
|
|
-import { SubjectEnum, useEventTracking, useSubjectId } from '@/helpers/hooks'
|
|
|
-
|
|
|
-export default defineComponent({
|
|
|
- name: 'VideoClass',
|
|
|
- data() {
|
|
|
- return {
|
|
|
- apiSuffix:
|
|
|
- state.platformType === 'STUDENT' ? '/api-student' : '/api-teacher',
|
|
|
- search: '',
|
|
|
- list: [],
|
|
|
- dataShow: true, // 判断是否有数据
|
|
|
- loading: false,
|
|
|
- finished: false,
|
|
|
- listLoading: true,
|
|
|
- params: {
|
|
|
- search: '',
|
|
|
- lessonSubject: null as any,
|
|
|
- subjectName: '全部声部',
|
|
|
- page: 1,
|
|
|
- rows: 20
|
|
|
- },
|
|
|
- searchStatus: false,
|
|
|
- openStatus: false,
|
|
|
- subjectList: []
|
|
|
- }
|
|
|
- },
|
|
|
- async mounted() {
|
|
|
- try {
|
|
|
- const res = await request.get(
|
|
|
- `${this.apiSuffix}/subject/subjectSelect?type=VIDEO`
|
|
|
- )
|
|
|
- this.subjectList = res.data || []
|
|
|
- } catch {
|
|
|
- //
|
|
|
- }
|
|
|
-
|
|
|
- if (state.platformType === 'TEACHER') {
|
|
|
- const users = state.user.data
|
|
|
- if (users.defaultSubject) {
|
|
|
- this.params.lessonSubject = users.defaultSubject
|
|
|
- this.params.subjectName = users.defaultSubjectName
|
|
|
- }
|
|
|
- } else {
|
|
|
- // 判断是否在缓存
|
|
|
- const subjects: any = useSubjectId(SubjectEnum.VIDEO)
|
|
|
- if (subjects.id) {
|
|
|
- this.params.lessonSubject = Number(subjects.id)
|
|
|
- this.params.subjectName = subjects.name
|
|
|
- } else {
|
|
|
- const list = this.subjectList
|
|
|
- const subjectIds = state.user.data?.subjectId || ''
|
|
|
- const subjectId = subjectIds ? Number(subjectIds.split(',')[0]) : null
|
|
|
- list.forEach((subject: any) => {
|
|
|
- const child = subject.subjects || []
|
|
|
- child.forEach((sub: any) => {
|
|
|
- if (sub.id === Number(subjectId)) {
|
|
|
- this.params.lessonSubject = sub.id
|
|
|
- this.params.subjectName = sub.name
|
|
|
- }
|
|
|
- })
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
- this.listLoading = false
|
|
|
- this.getList()
|
|
|
-
|
|
|
- useEventTracking('视频课')
|
|
|
- },
|
|
|
- methods: {
|
|
|
- async getList() {
|
|
|
- try {
|
|
|
- if (this.listLoading) return
|
|
|
- this.listLoading = true
|
|
|
-
|
|
|
- const params: any = {
|
|
|
- ...this.params
|
|
|
- }
|
|
|
- // 只有学生端会有version
|
|
|
- if (state.version) {
|
|
|
- params.version = state.version || '' // 处理ios审核版本
|
|
|
- params.platform =
|
|
|
- state.platformType === 'STUDENT' ? 'ios-student' : 'ios-teacher'
|
|
|
- }
|
|
|
- const url =
|
|
|
- state.platformType === 'STUDENT'
|
|
|
- ? '/api-student/videoLesson/selectGroup'
|
|
|
- : '/api-teacher/videoLessonGroup/page'
|
|
|
- // 处理搜索，老师端分享用
|
|
|
- // if (state.platformType === 'TEACHER') {
|
|
|
- params.myself = false
|
|
|
- // }
|
|
|
- const res = await request.post(url, {
|
|
|
- data: {
|
|
|
- ...params
|
|
|
- }
|
|
|
- })
|
|
|
- this.loading = false
|
|
|
- const result = res.data || {}
|
|
|
- // 处理重复请求数据
|
|
|
- if (this.list.length > 0 && result.pageNo === 1) {
|
|
|
- return
|
|
|
- }
|
|
|
- this.list = this.list.concat(result.rows || [])
|
|
|
- this.finished = result.pageNo >= result.totalPage
|
|
|
- this.params.page = result.pageNo + 1
|
|
|
- this.dataShow = this.list.length > 0
|
|
|
- } catch {
|
|
|
- this.dataShow = false
|
|
|
- this.finished = true
|
|
|
- } finally {
|
|
|
- this.listLoading = false
|
|
|
- }
|
|
|
- },
|
|
|
- // 设置默认声部
|
|
|
- async setDefaultSubject(subjectId: any) {
|
|
|
- try {
|
|
|
- await request.post('/api-teacher/teacher/defaultSubject', {
|
|
|
- params: {
|
|
|
- subjectId
|
|
|
- }
|
|
|
- })
|
|
|
- } catch {
|
|
|
- //
|
|
|
- }
|
|
|
- },
|
|
|
- onSort() {
|
|
|
- this.params.page = 1
|
|
|
- this.list = []
|
|
|
- this.dataShow = true // 判断是否有数据
|
|
|
- this.loading = false
|
|
|
- this.finished = false
|
|
|
- this.searchStatus = false
|
|
|
- if (state.platformType === 'TEACHER') {
|
|
|
- this.setDefaultSubject(this.params.lessonSubject)
|
|
|
- } else {
|
|
|
- this.params.lessonSubject &&
|
|
|
- useSubjectId(
|
|
|
- SubjectEnum.VIDEO,
|
|
|
- JSON.stringify({
|
|
|
- id: this.params.lessonSubject,
|
|
|
- name: this.params.subjectName
|
|
|
- }),
|
|
|
- 'set'
|
|
|
- )
|
|
|
- }
|
|
|
- this.getList()
|
|
|
- },
|
|
|
- onSearch(val: string) {
|
|
|
- this.params.search = val
|
|
|
- this.onSort()
|
|
|
- },
|
|
|
- onDetail(item: any) {
|
|
|
- const params: any = {
|
|
|
- groupId: item.id
|
|
|
- }
|
|
|
- // 判断是否是老师端，如果是，则添加分享按钮
|
|
|
- if (state.platformType === 'TEACHER') {
|
|
|
- params.share = 1
|
|
|
- }
|
|
|
- this.$router.push({
|
|
|
- path: '/videoDetail',
|
|
|
- query: params
|
|
|
- })
|
|
|
- }
|
|
|
- },
|
|
|
- render() {
|
|
|
- return (
|
|
|
- <div class={styles.videoClass}>
|
|
|
- <Sticky offsetTop={0} position="top">
|
|
|
- <ColHeader
|
|
|
- class={styles.classHeader}
|
|
|
- border={false}
|
|
|
- isFixed={false}
|
|
|
- background="transparent"
|
|
|
- />
|
|
|
- <ColSearch
|
|
|
- placeholder="请输入老师名称/课程名称"
|
|
|
- onSearch={this.onSearch}
|
|
|
- v-slots={{
|
|
|
- left: () => (
|
|
|
- <div
|
|
|
- class={styles.label}
|
|
|
- onClick={() => {
|
|
|
- this.searchStatus = !this.searchStatus
|
|
|
- this.openStatus = !this.openStatus
|
|
|
- }}
|
|
|
- >
|
|
|
- {this.params.subjectName}
|
|
|
- <Icon
|
|
|
- classPrefix="iconfont"
|
|
|
- name="down"
|
|
|
- size={12}
|
|
|
- color="#333"
|
|
|
- />
|
|
|
- </div>
|
|
|
- )
|
|
|
- }}
|
|
|
- />
|
|
|
- </Sticky>
|
|
|
-
|
|
|
- {/* <div class={styles.banner}>
|
|
|
- <Image src={banner} />
|
|
|
- </div> */}
|
|
|
-
|
|
|
- <div>
|
|
|
- {this.dataShow ? (
|
|
|
- <List
|
|
|
- class={styles.videoList}
|
|
|
- v-model:loading={this.loading}
|
|
|
- finished={this.finished}
|
|
|
- finishedText="没有更多了"
|
|
|
- onLoad={this.getList}
|
|
|
- immediateCheck={false}
|
|
|
- >
|
|
|
- {this.list.map(item => (
|
|
|
- <VideoItem item={item} onClick={this.onDetail} />
|
|
|
- ))}
|
|
|
- </List>
|
|
|
- ) : (
|
|
|
- <ColResult btnStatus={false} tips="暂无视频课" />
|
|
|
- )}
|
|
|
- </div>
|
|
|
-
|
|
|
- <Popup
|
|
|
- show={this.searchStatus}
|
|
|
- position="bottom"
|
|
|
- round
|
|
|
- closeable
|
|
|
- safe-area-inset-bottom
|
|
|
- onClose={() => (this.searchStatus = false)}
|
|
|
- onClosed={() => (this.openStatus = false)}
|
|
|
- >
|
|
|
- {this.openStatus && (
|
|
|
- <OrganSearch
|
|
|
- subjectList={this.subjectList}
|
|
|
- onSort={this.onSort}
|
|
|
- v-model={this.params.lessonSubject}
|
|
|
- v-model:subjectName={this.params.subjectName}
|
|
|
- />
|
|
|
- )}
|
|
|
- </Popup>
|
|
|
- </div>
|
|
|
- )
|
|
|
- }
|
|
|
-})
|
|
|
+import ColHeader from '@/components/col-header'
|
|
|
+import ColSearch from '@/components/col-search'
|
|
|
+import { Sticky, Image, List, Popup, Icon } from 'vant'
|
|
|
+import { defineComponent } from 'vue'
|
|
|
+import styles from './index.module.less'
|
|
|
+import VideoItem from '@/student/video-class/video-item'
|
|
|
+// import VideoItem from './video-item'
|
|
|
+
|
|
|
+import banner from './images/banner.png'
|
|
|
+import request from '@/helpers/request'
|
|
|
+import ColResult from '@/components/col-result'
|
|
|
+import { state } from '@/state'
|
|
|
+import OrganSearch from '@/student/practice-class/model/organ-search'
|
|
|
+import { SubjectEnum, useEventTracking, useSubjectId } from '@/helpers/hooks'
|
|
|
+
|
|
|
+export default defineComponent({
|
|
|
+ name: 'VideoClass',
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ apiSuffix:
|
|
|
+ state.platformType === 'STUDENT' ? '/api-student' : '/api-teacher',
|
|
|
+ search: '',
|
|
|
+ list: [],
|
|
|
+ dataShow: true, // 判断是否有数据
|
|
|
+ loading: false,
|
|
|
+ finished: false,
|
|
|
+ listLoading: true,
|
|
|
+ params: {
|
|
|
+ search: '',
|
|
|
+ lessonSubject: null as any,
|
|
|
+ subjectName: '全部声部',
|
|
|
+ page: 1,
|
|
|
+ rows: 20
|
|
|
+ },
|
|
|
+ searchStatus: false,
|
|
|
+ openStatus: false,
|
|
|
+ subjectList: []
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async mounted() {
|
|
|
+ try {
|
|
|
+ const res = await request.get(
|
|
|
+ `${this.apiSuffix}/subject/subjectSelect?type=VIDEO`
|
|
|
+ )
|
|
|
+ this.subjectList = res.data || []
|
|
|
+ } catch {
|
|
|
+ //
|
|
|
+ }
|
|
|
+
|
|
|
+ if (state.platformType === 'TEACHER') {
|
|
|
+ const users = state.user.data
|
|
|
+ if (users.defaultSubject) {
|
|
|
+ this.params.lessonSubject = users.defaultSubject
|
|
|
+ this.params.subjectName = users.defaultSubjectName
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ // 判断是否在缓存
|
|
|
+ const subjects: any = useSubjectId(SubjectEnum.VIDEO)
|
|
|
+ if (subjects.id) {
|
|
|
+ this.params.lessonSubject = Number(subjects.id)
|
|
|
+ this.params.subjectName = subjects.name
|
|
|
+ } else {
|
|
|
+ const list = this.subjectList
|
|
|
+ const subjectIds = state.user.data?.subjectId || ''
|
|
|
+ const subjectId = subjectIds ? Number(subjectIds.split(',')[0]) : null
|
|
|
+ list.forEach((subject: any) => {
|
|
|
+ const child = subject.subjects || []
|
|
|
+ child.forEach((sub: any) => {
|
|
|
+ if (sub.id === Number(subjectId)) {
|
|
|
+ this.params.lessonSubject = sub.id
|
|
|
+ this.params.subjectName = sub.name
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.listLoading = false
|
|
|
+ this.getList()
|
|
|
+
|
|
|
+ useEventTracking('视频课')
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ async getList() {
|
|
|
+ try {
|
|
|
+ if (this.listLoading) return
|
|
|
+ this.listLoading = true
|
|
|
+
|
|
|
+ const params: any = {
|
|
|
+ ...this.params
|
|
|
+ }
|
|
|
+ // 只有学生端会有version
|
|
|
+ if (state.version) {
|
|
|
+ params.version = state.version || '' // 处理ios审核版本
|
|
|
+ params.platform =
|
|
|
+ state.platformType === 'STUDENT' ? 'ios-student' : 'ios-teacher'
|
|
|
+ }
|
|
|
+ const url =
|
|
|
+ state.platformType === 'STUDENT'
|
|
|
+ ? '/api-student/videoLesson/selectGroup'
|
|
|
+ : '/api-teacher/videoLessonGroup/page'
|
|
|
+ // 处理搜索，老师端分享用
|
|
|
+ // if (state.platformType === 'TEACHER') {
|
|
|
+ params.myself = false
|
|
|
+ // }
|
|
|
+ const res = await request.post(url, {
|
|
|
+ data: {
|
|
|
+ ...params
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.loading = false
|
|
|
+ const result = res.data || {}
|
|
|
+ // 处理重复请求数据
|
|
|
+ if (this.list.length > 0 && result.pageNo === 1) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.list = this.list.concat(result.rows || [])
|
|
|
+ this.finished = result.pageNo >= result.totalPage
|
|
|
+ this.params.page = result.pageNo + 1
|
|
|
+ this.dataShow = this.list.length > 0
|
|
|
+ } catch {
|
|
|
+ this.dataShow = false
|
|
|
+ this.finished = true
|
|
|
+ } finally {
|
|
|
+ this.listLoading = false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 设置默认声部
|
|
|
+ async setDefaultSubject(subjectId: any) {
|
|
|
+ try {
|
|
|
+ await request.post('/api-teacher/teacher/defaultSubject', {
|
|
|
+ params: {
|
|
|
+ subjectId
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } catch {
|
|
|
+ //
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onSort() {
|
|
|
+ this.params.page = 1
|
|
|
+ this.list = []
|
|
|
+ this.dataShow = true // 判断是否有数据
|
|
|
+ this.loading = false
|
|
|
+ this.finished = false
|
|
|
+ this.searchStatus = false
|
|
|
+ if (state.platformType === 'TEACHER') {
|
|
|
+ this.setDefaultSubject(this.params.lessonSubject)
|
|
|
+ } else {
|
|
|
+ this.params.lessonSubject &&
|
|
|
+ useSubjectId(
|
|
|
+ SubjectEnum.VIDEO,
|
|
|
+ JSON.stringify({
|
|
|
+ id: this.params.lessonSubject,
|
|
|
+ name: this.params.subjectName
|
|
|
+ }),
|
|
|
+ 'set'
|
|
|
+ )
|
|
|
+ }
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+ onSearch(val: string) {
|
|
|
+ this.params.search = val
|
|
|
+ this.onSort()
|
|
|
+ },
|
|
|
+ onDetail(item: any) {
|
|
|
+ const params: any = {
|
|
|
+ groupId: item.id
|
|
|
+ }
|
|
|
+ // 判断是否是老师端，如果是，则添加分享按钮
|
|
|
+ if (state.platformType === 'TEACHER') {
|
|
|
+ params.share = 1
|
|
|
+ }
|
|
|
+ this.$router.push({
|
|
|
+ path: '/videoDetail',
|
|
|
+ query: params
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ render() {
|
|
|
+ return (
|
|
|
+ <div class={styles.videoClass}>
|
|
|
+ <Sticky offsetTop={0} position="top">
|
|
|
+ <ColHeader
|
|
|
+ class={styles.classHeader}
|
|
|
+ border={false}
|
|
|
+ isFixed={false}
|
|
|
+ background="transparent"
|
|
|
+ />
|
|
|
+ <ColSearch
|
|
|
+ placeholder="请输入老师名称/课程名称"
|
|
|
+ onSearch={this.onSearch}
|
|
|
+ v-slots={{
|
|
|
+ left: () => (
|
|
|
+ <div
|
|
|
+ class={styles.label}
|
|
|
+ onClick={() => {
|
|
|
+ this.searchStatus = !this.searchStatus
|
|
|
+ this.openStatus = !this.openStatus
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ {this.params.subjectName}
|
|
|
+ <Icon
|
|
|
+ classPrefix="iconfont"
|
|
|
+ name="down"
|
|
|
+ size={12}
|
|
|
+ color="#333"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ )
|
|
|
+ }}
|
|
|
+ />
|
|
|
+ </Sticky>
|
|
|
+
|
|
|
+ {/* <div class={styles.banner}>
|
|
|
+ <Image src={banner} />
|
|
|
+ </div> */}
|
|
|
+
|
|
|
+ <div>
|
|
|
+ {this.dataShow ? (
|
|
|
+ <List
|
|
|
+ class={styles.videoList}
|
|
|
+ v-model:loading={this.loading}
|
|
|
+ finished={this.finished}
|
|
|
+ finishedText="没有更多了"
|
|
|
+ onLoad={this.getList}
|
|
|
+ immediateCheck={false}
|
|
|
+ >
|
|
|
+ {this.list.map(item => (
|
|
|
+ <VideoItem item={item} onClick={this.onDetail} />
|
|
|
+ ))}
|
|
|
+ </List>
|
|
|
+ ) : (
|
|
|
+ <ColResult btnStatus={false} tips="暂无视频课" />
|
|
|
+ )}
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <Popup
|
|
|
+ show={this.searchStatus}
|
|
|
+ position="bottom"
|
|
|
+ round
|
|
|
+ closeable
|
|
|
+ safe-area-inset-bottom
|
|
|
+ onClose={() => (this.searchStatus = false)}
|
|
|
+ onClosed={() => (this.openStatus = false)}
|
|
|
+ >
|
|
|
+ {this.openStatus && (
|
|
|
+ <OrganSearch
|
|
|
+ subjectList={this.subjectList}
|
|
|
+ onSort={this.onSort}
|
|
|
+ v-model={this.params.lessonSubject}
|
|
|
+ v-model:subjectName={this.params.subjectName}
|
|
|
+ />
|
|
|
+ )}
|
|
|
+ </Popup>
|
|
|
+ </div>
|
|
|
+ )
|
|
|
+ }
|
|
|
+})
|
