|
@@ -1,8 +1,17 @@
|
|
|
+import { Sticky, Cell, Tag, Icon, Popup, Tabs, Tab, Dialog } from 'vant'
|
|
|
import { defineComponent, onMounted, onUnmounted, ref } from 'vue'
|
|
|
+// import Search from '@/components/col-search'
|
|
|
import { useLocalStorage } from '@vueuse/core'
|
|
|
+// import AlbumItem from '../album/item'
|
|
|
import AlbumList from '../album'
|
|
|
+// import MusicItem from '../list/item'
|
|
|
import MusicList from '../list'
|
|
|
import styles from './index.module.less'
|
|
|
+// import classNames from 'classnames'
|
|
|
+// import request from '@/helpers/request'
|
|
|
+import SelectTag from './select-tag'
|
|
|
+// import ColResult from '@/components/col-result'
|
|
|
+// import { orderStatus } from '@/views/order-detail/orderStatus'
|
|
|
import { useRoute, useRouter } from 'vue-router'
|
|
|
import { getRandomKey, musicBuy } from '../music'
|
|
|
import { mitter } from './header'
|
|
@@ -11,16 +20,39 @@ export default defineComponent({
|
|
|
name: 'MusicSearch',
|
|
|
emits: ['confirm'],
|
|
|
setup() {
|
|
|
+ const searchInputRef = ref()
|
|
|
localStorage.setItem('behaviorId', getRandomKey())
|
|
|
const route = useRoute()
|
|
|
const router = useRouter()
|
|
|
+ const loading = ref(false)
|
|
|
const keyword = ref(route.query.keyword || '')
|
|
|
const tagids = ref(route.query.tagids || '')
|
|
|
- const subject = ref()
|
|
|
+ const albumRows = ref([])
|
|
|
+ const sheetRows = ref([])
|
|
|
const tagVisibility = ref(false)
|
|
|
const words = useLocalStorage<string[]>('music-search', [])
|
|
|
const activeTab = ref('songe')
|
|
|
|
|
|
+ const FetchList = async () => {
|
|
|
+ // loading.value = true
|
|
|
+ // try {
|
|
|
+ // const res = await request.post(
|
|
|
+ // '/api-student/music/sheet/albumAndSheetList',
|
|
|
+ // {
|
|
|
+ // data: {
|
|
|
+ // albumRow: 3,
|
|
|
+ // sheetRow: 10,
|
|
|
+ // search: keyword.value,
|
|
|
+ // musicTagIds: tagids.value
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // )
|
|
|
+ // albumRows.value = res.data.musicAlbumList.rows
|
|
|
+ // sheetRows.value = res.data.musicSheetList.rows
|
|
|
+ // } catch (error) {}
|
|
|
+ // loading.value = false
|
|
|
+ }
|
|
|
+
|
|
|
const onSearch = val => {
|
|
|
keyword.value = val
|
|
|
const indexOf = words.value.indexOf(val)
|
|
@@ -32,23 +64,20 @@ export default defineComponent({
|
|
|
words.value.length = Math.min(words.value.length, 5)
|
|
|
}
|
|
|
const activeRef = activeTab.value === 'album' ? albumList : musicList
|
|
|
+ console.log(val)
|
|
|
;(activeRef.value as any).onSearch?.(val)
|
|
|
+ // FetchList()
|
|
|
}
|
|
|
|
|
|
const onComfirm = tags => {
|
|
|
const data = Object.values(tags).flat().filter(Boolean).join(',')
|
|
|
tagids.value = data
|
|
|
+ // FetchList()
|
|
|
const activeRef = activeTab.value === 'album' ? albumList : musicList
|
|
|
;(activeRef.value as any).onComfirm?.(tags)
|
|
|
tagVisibility.value = false
|
|
|
}
|
|
|
|
|
|
- const onConfirmSubject = (id: any) => {
|
|
|
- subject.value = id
|
|
|
- const activeRef = activeTab.value === 'album' ? albumList : musicList
|
|
|
- ;(activeRef.value as any).onComfirmSubject?.(subject)
|
|
|
- }
|
|
|
-
|
|
|
const albumList = ref(null)
|
|
|
const musicList = ref(null)
|
|
|
|
|
@@ -60,14 +89,14 @@ export default defineComponent({
|
|
|
mitter.on('changeTab', changeTab)
|
|
|
mitter.on('search', onSearch)
|
|
|
mitter.on('confirm', onComfirm)
|
|
|
- mitter.on('confirmSubject', onConfirmSubject)
|
|
|
+ // ;(activeRef.value as any).onSearch?.('')
|
|
|
+ // console.log(searchInputRef.value)
|
|
|
})
|
|
|
|
|
|
onUnmounted(() => {
|
|
|
mitter.off('changeTab', changeTab)
|
|
|
mitter.off('search', onSearch)
|
|
|
mitter.off('confirm', onComfirm)
|
|
|
- mitter.off('confirmSubject', onConfirmSubject)
|
|
|
})
|
|
|
|
|
|
return () => {
|
|
@@ -79,8 +108,7 @@ export default defineComponent({
|
|
|
ref={albumList}
|
|
|
defauleParams={{
|
|
|
search: keyword.value,
|
|
|
- tagids: tagids.value,
|
|
|
- subjectIds: subject.value
|
|
|
+ tagids: tagids.value
|
|
|
}}
|
|
|
/>
|
|
|
) : (
|
|
@@ -99,11 +127,21 @@ export default defineComponent({
|
|
|
}}
|
|
|
defauleParams={{
|
|
|
search: keyword.value,
|
|
|
- tagids: tagids.value,
|
|
|
- subjectIds: subject.value
|
|
|
+ tagids: tagids.value
|
|
|
}}
|
|
|
/>
|
|
|
)}
|
|
|
+ {/* <Popup
|
|
|
+ show={tagVisibility.value}
|
|
|
+ round
|
|
|
+ closeable
|
|
|
+ position="bottom"
|
|
|
+ style={{ height: '60%' }}
|
|
|
+ teleport="body"
|
|
|
+ onUpdate:show={val => (tagVisibility.value = val)}
|
|
|
+ >
|
|
|
+ <SelectTag onConfirm={onComfirm} onCancel={() => {}} />
|
|
|
+ </Popup> */}
|
|
|
</div>
|
|
|
)
|
|
|
}
|