浏览代码

Merge branch 'fine-music-score' into online

lex 2 年之前
父节点
当前提交
fb1a8e6851

+ 6 - 3
src/components/col-header/index.tsx

@@ -51,8 +51,8 @@ export default defineComponent({
       default: () => {}
     }
   },
-  watch:{
-    backIconColor(){
+  watch: {
+    backIconColor() {
       // 设置返回按钮颜色
       postMessage({
         api: 'backIconChange',
@@ -129,7 +129,10 @@ export default defineComponent({
       <div>
         {this.$slots.content ? (
           <div
-            style={{ paddingTop: `${this.navBarHeight}px` }}
+            style={{
+              paddingTop: `${this.navBarHeight}px`,
+              background: this.background
+            }}
             class={styles.headerSection}
           >
             {this.$slots.content(this.navBarHeight)}

+ 6 - 0
src/constant/music.ts

@@ -52,3 +52,9 @@ export const teacherStyleType = {
   HOMEMODE: '自制伴奏',
   COMMON: '普通伴奏'
 }
+
+/** 老师端展示是否精品乐谱 */
+export const teacherExquisiteType = {
+  0: '否',
+  1: '是'
+}

+ 42 - 18
src/teacher/music/upload/index.tsx

@@ -26,7 +26,8 @@ import {
   teachershowFingeringType,
   teachershowHasBeatType,
   teacherNotationType,
-  teacherStyleType
+  teacherStyleType,
+  teacherExquisiteType
 } from '@/constant/music'
 import { getXmlInfo, FormatXMLInfo } from '@/helpers/music-xml'
 import Upload from './upload'
@@ -95,6 +96,7 @@ export default defineComponent({
       submitLoading: false,
       showPicker: false,
       music_sheet_service_fee: 0,
+      exquisiteFlag: 0,
       backgroundMp3s: [
         {
           url: '',
@@ -201,7 +203,7 @@ export default defineComponent({
         for (let i = 0; i < names.length; i++) {
           this.tagsNames[this.tags[i]] = names[i]
         }
-
+        this.exquisiteFlag = res.data.exquisiteFlag
         this.xmlFileUrl = res.data.xmlFileUrl
         this.accompanimentType = res.data.accompanimentType
         this.titleImg = res.data.titleImg
@@ -258,6 +260,7 @@ export default defineComponent({
         xmlFileUrl: this.xmlFileUrl,
         canEvaluate: Number(this.canEvaluate),
         chargeType: this.chargeType === 0 ? 'FREE' : 'CHARGE',
+        exquisiteFlag: this.exquisiteFlag,
         composer: this.composer,
         musicPrice: this.chargeType === 0 ? 0 : this.musicPrice, // 当选择免费时,重置金额为0
         background: this.backgroundMp3s.map(item => ({
@@ -870,6 +873,22 @@ export default defineComponent({
                 })}
               </RadioGroup>
             </ColField>
+            {this.chargeType === 2 && (
+              <ColField required title="收费价格">
+                <Field
+                  clearable
+                  class={styles['clear-px']}
+                  placeholder="请输入收费价格"
+                  formatter={this.onFormatter}
+                  v-slots={{ button: () => '元' }}
+                  modelValue={this.musicPrice}
+                  rules={[
+                    { required: true, validator, message: '请输入收费价格' }
+                  ]}
+                  onUpdate:modelValue={val => (this.musicPrice = val)}
+                />
+              </ColField>
+            )}
             <ColField required title="支持简谱" border={false}>
               <RadioGroup
                 class={styles['radio-group']}
@@ -891,22 +910,27 @@ export default defineComponent({
                 })}
               </RadioGroup>
             </ColField>
-            {this.chargeType === 2 && (
-              <ColField required title="收费价格">
-                <Field
-                  clearable
-                  class={styles['clear-px']}
-                  placeholder="请输入收费价格"
-                  formatter={this.onFormatter}
-                  v-slots={{ button: () => '元' }}
-                  modelValue={this.musicPrice}
-                  rules={[
-                    { required: true, validator, message: '请输入收费价格' }
-                  ]}
-                  onUpdate:modelValue={val => (this.musicPrice = val)}
-                />
-              </ColField>
-            )}
+            <ColField required title="是否精品乐谱" border={false}>
+              <RadioGroup
+                class={styles['radio-group']}
+                modelValue={this.exquisiteFlag}
+                onUpdate:modelValue={val => {
+                  this.exquisiteFlag = Number(val)
+                }}
+              >
+                {Object.keys(teacherExquisiteType).map((item: string) => {
+                  const isActive = item === String(this.exquisiteFlag)
+                  const type = isActive ? 'primary' : 'default'
+                  return (
+                    <Radio class={styles.radio} name={item}>
+                      <Tag size="large" plain={isActive} type={type}>
+                        {teacherExquisiteType[item]}
+                      </Tag>
+                    </Radio>
+                  )
+                })}
+              </RadioGroup>
+            </ColField>
           </ColFieldGroup>
           {this.chargeType === 2 && (
             <div class={styles.rule}>

二进制
src/views/music/component/images/icon_ exquisite.png


+ 5 - 0
src/views/music/component/song/index.module.less

@@ -184,3 +184,8 @@
     line-height: 20px;
   }
 }
+
+.exquisiteFlag {
+  width: 14px;
+  margin-left: 5px;
+}

+ 7 - 0
src/views/music/component/song/index.tsx

@@ -98,6 +98,13 @@ export default defineComponent({
                 >
                   {colors[n.chargeType].text}
                 </Tag>
+                {n.exquisiteFlag === 1 && (
+                  <Image
+                    class={styles.exquisiteFlag}
+                    src={getAssetsHomeFile('icon_ exquisite.png')}
+                  />
+                )}
+
                 <span class={[styles.title, 'van-ellipsis']}>
                   {n.musicSheetName}
                 </span>

+ 26 - 0
src/views/music/list/index.module.less

@@ -3,6 +3,28 @@
     box-shadow: 10px 10px 10px var(--box-shadow-color);
   }
 }
+
+.listContainer {
+  padding-top: 2px;
+  height: 42px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: #fff;
+  font-size: 16px;
+  font-weight: 600;
+  color: #999999;
+  line-height: 22px;
+  .line {
+    margin: 0 15px;
+    width: 1px;
+    height: 10px;
+    background: #e8e8e8;
+  }
+  .active {
+    color: #333333;
+  }
+}
 .label {
   margin-right: 8px;
   font-size: 14px;
@@ -24,3 +46,7 @@
   background-color: #fff;
   margin: 14px;
 }
+
+.swipeContainer {
+  // height: calc(100vh - 44px);
+}

+ 52 - 53
src/views/music/list/index.tsx

@@ -1,8 +1,8 @@
-import { defineComponent, reactive, ref } from 'vue'
-import { Sticky, List, Popup, Icon } from 'vant'
+import { defineComponent, nextTick, onMounted, reactive, ref } from 'vue'
+import { Sticky, List, Popup, Icon, Switch } from 'vant'
 import Search from '@/components/col-search'
 import request from '@/helpers/request'
-import Item from './item'
+// import Item from './item'
 import SelectTag from '../search/select-tag'
 import { useRoute, useRouter } from 'vue-router'
 import ColResult from '@/components/col-result'
@@ -12,8 +12,12 @@ import { state } from '@/state'
 import SelectSubject from '../search/select-subject'
 import { SubjectEnum, useSubjectId } from '@/helpers/hooks'
 import Song from '../component/song'
+import ColHeader from '@/components/col-header'
+import { useRect } from '@vant/use'
 
-const noop = () => {}
+const noop = () => {
+  //
+}
 
 export default defineComponent({
   name: 'MusicList',
@@ -82,6 +86,7 @@ export default defineComponent({
     //
     const params = reactive({
       search: (route.query.search as string) || '',
+      // exquisiteFlag: 1,
       musicTagIds: route.query.tagids || '',
       page: 1,
       ...defauleParams,
@@ -92,6 +97,7 @@ export default defineComponent({
     const finished = ref(false)
     const isError = ref(false)
     const tagVisibility = ref(false)
+    const exquisiteFlag = ref(false)
     const apiSuffix = ref(
       state.platformType === 'STUDENT' ? '/api-student' : '/api-teacher'
     )
@@ -141,7 +147,17 @@ export default defineComponent({
     }
 
     const onComfirm = tags => {
-      const d = Object.values(tags).flat().filter(Boolean).join(',')
+      const tempTags: any = {}
+      // 单独处理乐谱类型
+      for (const tag in tags) {
+        if (Number(tag) === -1) {
+          exquisiteFlag.value = tags[tag][0] ? true : false
+        } else {
+          tempTags[tag] = tags[tag]
+        }
+      }
+
+      const d = Object.values(tempTags).flat().filter(Boolean).join(',')
       params.musicTagIds = d
       params.page = 1
       data.value = null
@@ -166,6 +182,7 @@ export default defineComponent({
       FetchList()
       subject.show = false
     }
+
     const getSubject: any = useSubjectId(SubjectEnum.SEARCH)
     const subject = reactive({
       show: false,
@@ -181,6 +198,32 @@ export default defineComponent({
 
     return () => (
       <>
+        {!hideSearch && (
+          <Sticky class={styles.sticky}>
+            <Search
+              showAction
+              onSearch={onSearch}
+              onFilter={() => (tagVisibility.value = true)}
+              filterDot={!!params.musicTagIds}
+              v-slots={{
+                left: () => (
+                  <div
+                    class={styles.label}
+                    onClick={() => (subject.show = true)}
+                  >
+                    {subject.name}
+                    <Icon
+                      classPrefix="iconfont"
+                      name="down"
+                      size={12}
+                      color="#333"
+                    />
+                  </div>
+                )
+              }}
+            />
+          </Sticky>
+        )}
         <List
           loading={loading.value}
           finished={finished.value}
@@ -190,33 +233,6 @@ export default defineComponent({
           onLoad={FetchList}
           error={isError.value}
         >
-          {!hideSearch && (
-            <Sticky class={styles.sticky}>
-              <Search
-                showAction
-                onSearch={onSearch}
-                onFilter={() => (tagVisibility.value = true)}
-                filterDot={!!params.musicTagIds}
-                v-slots={{
-                  left: () => (
-                    <div
-                      class={styles.label}
-                      onClick={() => (subject.show = true)}
-                    >
-                      {subject.name}
-                      <Icon
-                        classPrefix="iconfont"
-                        name="down"
-                        size={12}
-                        color="#333"
-                      />
-                    </div>
-                  )
-                }}
-              />
-            </Sticky>
-          )}
-
           {data.value && data.value.rows.length ? (
             <div class={styles.alumnList}>
               <Song
@@ -227,30 +243,10 @@ export default defineComponent({
                   } else {
                     onItemClick?.(item)
                   }
-                  // if (onItemClick === noop || !onItemClick) {
-                  //   musicBuy(item, () => {}, {
-                  //     albumId: route.params.id,
-                  //     albumName: albumDetail.value?.albumName
-                  //   })
-                  // } else {
-                  //   onItemClick(item)
-                  // }
                 }}
               />
             </div>
           ) : (
-            // data.value.rows.map(item => (
-            //     <Item
-            //       data={item}
-            //       onClick={() => {
-            //         if (onItemClick === noop) {
-            //           musicBuy(item)
-            //         } else {
-            //           onItemClick?.(item)
-            //         }
-            //       }}
-            //     />
-            //   ))
             !loading.value && (
               <ColResult
                 tips="暂无曲目"
@@ -270,8 +266,11 @@ export default defineComponent({
           onUpdate:show={val => (tagVisibility.value = val)}
         >
           <SelectTag
+            exquisiteFlag
             onConfirm={onComfirm}
-            onCancel={() => {}}
+            onCancel={() => {
+              //
+            }}
             defaultValue={route.query.tagids as string}
           />
         </Popup>

+ 125 - 0
src/views/music/list/list.tsx

@@ -0,0 +1,125 @@
+import ColResult from '@/components/col-result'
+import { SubjectEnum, useSubjectId } from '@/helpers/hooks'
+import request from '@/helpers/request'
+import { state } from '@/state'
+import { List } from 'vant'
+import { defineComponent, reactive, ref } from 'vue'
+import { useRoute } from 'vue-router'
+import Song from '../component/song'
+import { getRandomKey, musicBuy } from '../music'
+import styles from './index.module.less'
+
+const noop = () => {}
+
+export default defineComponent({
+  name: 'list',
+  props: {
+    hideSearch: {
+      type: Boolean,
+      default: false
+    },
+    defauleParams: {
+      type: Object,
+      default: () => ({})
+    },
+    onItemClick: {
+      type: Function,
+      default: noop
+    },
+    teacherId: {
+      type: String || Number,
+      default: ''
+    }
+  },
+  setup({ hideSearch, defauleParams, onItemClick, teacherId }, { expose }) {
+    const route = useRoute()
+    // const router = useRouter()
+    const tempParams: any = {}
+    if (state.version) {
+      tempParams.version = state.version || '' // 处理ios审核版本
+      tempParams.platform =
+        state.platformType === 'STUDENT' ? 'ios-student' : 'ios-teacher'
+    }
+    // 判断是否在搜索页面用过
+    if (!hideSearch) {
+      const getSubject: any = useSubjectId(SubjectEnum.SEARCH)
+      tempParams.subjectIds = getSubject.id
+    }
+    //
+    const params = reactive({
+      search: (route.query.search as string) || '',
+      exquisiteFlag: 1,
+      musicTagIds: route.query.tagids || '',
+      page: 1,
+      ...defauleParams,
+      ...tempParams
+    })
+    const data = ref<any>(null)
+    const loading = ref(false)
+    const finished = ref(false)
+    const isError = ref(false)
+    const apiSuffix = ref(
+      state.platformType === 'STUDENT' ? '/api-student' : '/api-teacher'
+    )
+
+    const FetchList = async () => {
+      if (loading.value) {
+        return
+      }
+      loading.value = true
+      isError.value = false
+      const tempParams = {
+        ...params,
+        idAndName: params.search,
+        createBy: teacherId
+      }
+      // if (state.platformType === 'TEACHER') {
+      tempParams.myself = false
+      // }
+
+      try {
+        const res = await request.post(`${apiSuffix.value}/music/sheet/list`, {
+          data: tempParams
+        })
+        if (data.value) {
+          const result = (data.value?.rows || []).concat(res.data.rows || [])
+          data.value.rows = result
+        }
+        data.value = data.value || res.data
+        params.page = res.data.pageNo + 1
+        finished.value = res.data.pageNo >= res.data.totalPage
+      } catch (error) {
+        isError.value = true
+      }
+      loading.value = false
+    }
+    return () => (
+      <List
+        loading={loading.value}
+        finished={finished.value}
+        finished-text={data.value && data.value.rows.length ? '没有更多了' : ''}
+        onLoad={FetchList}
+        error={isError.value}
+      >
+        {data.value && data.value.rows.length ? (
+          <div class={styles.alumnList}>
+            <Song
+              list={data.value.rows}
+              onDetail={(item: any) => {
+                if (onItemClick === noop) {
+                  musicBuy(item)
+                } else {
+                  onItemClick?.(item)
+                }
+              }}
+            />
+          </div>
+        ) : (
+          !loading.value && (
+            <ColResult tips="暂无曲目" classImgSize="SMALL" btnStatus={false} />
+          )
+        )}
+      </List>
+    )
+  }
+})

+ 20 - 1
src/views/music/search/select-tag.tsx

@@ -17,13 +17,17 @@ export default defineComponent({
       type: Boolean,
       default: false
     },
+    exquisiteFlag: {
+      type: Boolean,
+      default: false
+    },
     needAllButton: {
       type: Boolean,
       default: true
     }
   },
   emits: ['cancel', 'confirm'],
-  setup({ defaultValue, ...restProps }, { emit, expose }) {
+  setup({ exquisiteFlag, defaultValue, ...restProps }, { emit, expose }) {
     const prefix =
       appState.platformType === 'STUDENT' ? '/api-student' : '/api-teacher'
     const { isLoading, state } = useAsyncState(
@@ -46,6 +50,19 @@ export default defineComponent({
     watch(state, () => {
       if (state.value) {
         const list = (state.value && state.value.data) || []
+        if (exquisiteFlag) {
+          list.unshift({
+            name: '乐谱类型',
+            id: -1,
+            children: [
+              {
+                id: 1,
+                name: '精品'
+              }
+            ]
+          })
+        }
+
         for (const item of list) {
           const allids = item.children.map(c => {
             names[c.id] = c.name
@@ -64,10 +81,12 @@ export default defineComponent({
 
     return () => {
       const list = (state.value && state.value.data) || []
+      console.log(list, 'list')
       return (
         <div class={styles.select}>
           <h4 class={styles.title}>全部标签</h4>
           <div class={styles.content}>
+            {/* 曲谱类型,精品曲谱、普通曲谱 */}
             {list.map(item => {
               if (!item.children || item.children.length <= 0) {
                 return null