Browse Source

添加提示成搜索

lex 1 year ago
parent
commit
c2eee09035

BIN
src/common/images/wx-no-bg.png


BIN
src/common/images/wx-no-top.png


+ 53 - 0
src/components/the-wx-tip/index.module.less

@@ -0,0 +1,53 @@
+.wxPopupDialog {
+  // position: relative;
+  overflow: initial;
+
+  // margin-top: -160px;
+  &::before {
+    position: absolute;
+    content: ' ';
+    top: -23px;
+    left: 50%;
+    margin-left: -50px;
+    display: inline-block;
+    background: url('../../common/images/wx-no-top.png') no-repeat top center;
+    background-size: contain;
+    width: 100px;
+    height: 60px;
+  }
+}
+
+.popupContainer {
+  background: url('../../common/images/wx-no-bg.png') no-repeat top center;
+  background-size: cover;
+  border-radius: 20px;
+  overflow: hidden;
+  padding-bottom: 16px;
+  text-align: center;
+
+  .title1 {
+    padding-top: 57px;
+    text-align: center;
+    font-size: 18px;
+    font-weight: 500;
+    color: #00153B;
+  }
+
+  .popupTips {
+    padding-top: 16px;
+    padding-bottom: 16px;
+    text-align: center;
+    font-size: 15px;
+    color: #777777;
+    line-height: 21px;
+  }
+
+  .button {
+    padding: 0 32px;
+    height: 30px;
+    // font-size: 16px;
+    font-size: 14px;
+    // color: #777;
+    // border-color: #E7E7E7;
+  }
+}

+ 79 - 0
src/components/the-wx-tip/index.tsx

@@ -0,0 +1,79 @@
+import { Button, Popup } from 'vant'
+import { defineComponent, onMounted, ref, watch } from 'vue'
+import styles from './index.module.less'
+import { browser } from '@/helpers/utils'
+
+export default defineComponent({
+  name: 'm-wx-tip',
+  props: {
+    // 是否显示微信弹窗
+    show: {
+      type: Boolean,
+      default: true
+    },
+    title: {
+      type: String,
+      default: '温馨提示'
+    },
+    message: {
+      type: String,
+      default: '请使用微信打开'
+    },
+    showButton: {
+      type: Boolean,
+      default: false
+    },
+    buttonText: {
+      type: String,
+      default: '确定'
+    }
+  },
+  emits: ['confirm'],
+  setup(props, { emit }) {
+    const showPopup = ref(false)
+    onMounted(() => {
+      if (props.show) {
+        showPopup.value = true
+        return
+      }
+    })
+
+    watch(
+      () => [props.show, props.message],
+      () => {
+        if (props.show) {
+          showPopup.value = true
+        } else {
+          showPopup.value = false
+        }
+      }
+    )
+    return () => (
+      <>
+        <Popup
+          v-model:show={showPopup.value}
+          round
+          style={{ width: '88%' }}
+          closeOnClickOverlay={false}
+          class={styles.wxPopupDialog}
+        >
+          <div class={styles.popupContainer}>
+            <p class={styles.title1}>{props.title}</p>
+            <p class={styles.popupTips}>{props.message}</p>
+
+            {props.showButton && (
+              <Button
+                round
+                type="primary"
+                class={styles.button}
+                onClick={() => emit('confirm')}
+              >
+                {props.buttonText}
+              </Button>
+            )}
+          </div>
+        </Popup>
+      </>
+    )
+  }
+})

+ 8 - 0
src/router/routes-tenant.ts

@@ -217,6 +217,14 @@ export default [
             }
           },
           {
+            path: '/music-songbook/searchAlbum',
+            name: 'searchAlbum',
+            component: () => import('@/tenant/music/search/searchAlbum'),
+            meta: {
+              title: '搜索结果'
+            }
+          },
+          {
             path: '/music-songbook/result',
             name: 'musicSongresult',
             component: () => import('@/tenant/music/search/search-result'),

+ 29 - 3
src/student/invite-teacher/index.tsx

@@ -22,6 +22,7 @@ import inactiveButtonIcon from '@common/images/icon_checkbox_default.png'
 import ColPopup from '@/components/col-popup'
 import InviteCode from './invite-code'
 import TeacherChange from './teacher-change'
+import OWxTip from '@/components/the-wx-tip'
 
 export default defineComponent({
   name: 'login',
@@ -34,7 +35,8 @@ export default defineComponent({
       imgCodeStatus: false,
       checked: false,
       teacherChangeStatus: false,
-      changeInfo: {} as any // 更换老师信息
+      changeInfo: {} as any, // 更换老师信息
+      showTips: false
     }
   },
   computed: {
@@ -72,7 +74,20 @@ export default defineComponent({
       if (!this.checked) {
         return Toast('请阅读并同意协议')
       }
-      this.imgCodeStatus = true
+
+      try {
+        const { data } = await request.get(
+          '/api-student/open/checkPhone?phone=' + this.username
+        )
+        console.log(data)
+        if (data) {
+          this.imgCodeStatus = true
+        } else {
+          this.showTips = true
+        }
+      } catch {
+        //
+      }
     },
     previewProtocol(type: string) {
       if (type === 'user') {
@@ -91,7 +106,7 @@ export default defineComponent({
         })
       }
     },
-    async onLoginSuccess(isUpdate: boolean = false) {
+    async onLoginSuccess(isUpdate = false) {
       try {
         const res = await request.get('/api-student/open/bindTeacher', {
           params: {
@@ -222,6 +237,17 @@ export default defineComponent({
             }}
           />
         </Popup>
+
+        {/* 是否在微信中打开 */}
+        <OWxTip
+          show={this.showTips}
+          message={'您已绑定机构,无法再绑定老师'}
+          showButton={true}
+          buttonText="确定"
+          onConfirm={() => {
+            this.showTips = false
+          }}
+        />
       </div>
     )
   }

+ 121 - 93
src/tenant/music/search/header.tsx

@@ -90,7 +90,12 @@ export default defineComponent({
     const searchResultStatus = ref(false)
     const keyword = ref('')
     const tagids = ref('')
-    const words = useLocalStorage<string[]>('music-search', [])
+    const words = useLocalStorage<string[]>(
+      route.path === '/music-songbook/search'
+        ? 'music-search'
+        : 'music-search-ablum',
+      []
+    )
     const activeTab = ref('all')
 
     if (route.path === '/music-songbook/result') {
@@ -130,15 +135,36 @@ export default defineComponent({
     const searchList = ref<any>([])
     const onInputSearch = useThrottleFn(async (val: any) => {
       try {
-        const { data } = await request.post('/api-student/music/sheet/search', {
-          hideLoading: true,
-          data: {
-            subjectId: subjects.id,
-            name: val,
-            rows: 10
-          }
-        })
-        const tempMusics = data.musicNames || []
+        let tData: any = {}
+        if (route.path === '/music-songbook/searchAlbum') {
+          const { data } = await request.post(
+            '/api-student/music/sheet/searchTenant',
+            {
+              hideLoading: true,
+              data: {
+                // subjectId: subjects.id,
+                name: val,
+                rows: 10
+              }
+            }
+          )
+          tData = data
+        } else {
+          const { data } = await request.post(
+            '/api-student/music/sheet/search',
+            {
+              hideLoading: true,
+              data: {
+                subjectId: subjects.id,
+                name: val,
+                rows: 10
+              }
+            }
+          )
+          tData = data
+        }
+
+        const tempMusics = tData.musicNames || []
         tempMusics.forEach((item: any, index: number) => {
           if (index < 10) {
             item.name = item.name.replace(val, `<span>${val}</span>`)
@@ -162,18 +188,27 @@ export default defineComponent({
         words.value.unshift(val)
         // console.log(words.value.length, 'words.value.length')
         words.value.length = Math.min(words.value.length, 10)
+        // 结合搜索
         if (route.path === '/music-songbook/search') defaultClose()
+        // 机构专辑搜索
+        if (route.path === '/music-songbook/searchAlbum') defaultClose()
       }
-      // mitter.emit('search', val)
-      if (route.path !== '/music-songbook/result') {
-        router.replace({
-          path: '/music-songbook/result',
-          query: {
-            search: val
-          }
-        })
-        searchResultStatus.value = false
-        searchList.value = []
+      // 机构专辑详情
+      if (route.path !== '/music-songbook/searchAlbum') {
+        // 综合搜索
+        if (route.path !== '/music-songbook/result') {
+          router.replace({
+            path: '/music-songbook/result',
+            query: {
+              search: val
+            }
+          })
+          searchResultStatus.value = false
+          searchList.value = []
+        } else {
+          searchResultStatus.value = false
+          mitter.emit('search', val)
+        }
       } else {
         searchResultStatus.value = false
         mitter.emit('search', val)
@@ -248,6 +283,7 @@ export default defineComponent({
     }
     // 首先调用默认收起的方法
     if (route.path === '/music-songbook/search') defaultClose()
+    if (route.path === '/music-songbook/searchAlbum') defaultClose()
 
     onMounted(() => {
       postMessage({
@@ -280,32 +316,36 @@ export default defineComponent({
                     if (route.path === '/music-songbook/result') {
                       router.replace('/music-songbook/search')
                     }
+
+                    if (route.path === '/music-songbook/searchAlbum') {
+                      mitter.emit('search', '')
+                    }
                   }
                 }}
                 onSearch={(val: any) => {
                   if (!val) return
                   keyword.value = val
-                  console.log(val, 'val')
                   onSearch(val)
                   // searchResultStatus.value = true
                 }}
                 type="tenant"
                 v-slots={{
-                  left: () => (
-                    <DropdownMenu>
-                      <DropdownItem
-                        // titleClass={styles.titleActive}
-                        title={subject.name}
-                        ref={searchRef}
-                      >
-                        <SelectSubject
-                          isReset
-                          searchParams={subject}
-                          onComfirm={onComfirmSubject}
-                        />
-                      </DropdownItem>
-                    </DropdownMenu>
-                  ),
+                  left: () =>
+                    route.path !== '/music-songbook/searchAlbum' && (
+                      <DropdownMenu>
+                        <DropdownItem
+                          // titleClass={styles.titleActive}
+                          title={subject.name}
+                          ref={searchRef}
+                        >
+                          <SelectSubject
+                            isReset
+                            searchParams={subject}
+                            onComfirm={onComfirmSubject}
+                          />
+                        </DropdownItem>
+                      </DropdownMenu>
+                    ),
                   action: () => (
                     <span
                       class={styles.searchCancel}
@@ -341,49 +381,53 @@ export default defineComponent({
             </TheSticky>
             <img class={styles.bgImg} src={bgImg} />
           </div>
-          {words.value.length > 0 && route.path === '/music-songbook/search' && (
-            <div class={styles.keywordSection}>
-              <div class={styles.keywordTitle}>
-                <span class={styles.t}>搜索历史</span>
-                <Icon
-                  class={styles.remove}
-                  name={iconDelete}
-                  onClick={() => (words.value = [])}
-                />
-              </div>
-              <div class={classNames(styles.keywords)}>
-                <div class={styles.content}>
-                  {words.value.map((item: any, index: number) => (
-                    <Tag
-                      ref={(el: any) => (tagRef.value[index] = el)}
-                      round
-                      class={[styles.searchKeyword, 'van-ellipsis']}
-                      key={item}
-                      onClick={() => {
-                        keyword.value = item
-                        onSearch(item)
-                      }}
-                    >
-                      {item}
-                    </Tag>
-                  ))}
-                  {collapse.line > 1 && (
-                    <span
-                      class={[styles.arrowMore]}
-                      onClick={() => {
-                        collapse.arrowStatus = !collapse.arrowStatus
-                        defaultClose()
-                      }}
-                    >
-                      <Icon
-                        name={collapse.arrowStatus ? 'arrow-up' : 'arrow-down'}
-                      />
-                    </span>
-                  )}
+          {words.value.length > 0 &&
+            (route.path === '/music-songbook/search' ||
+              route.path === '/music-songbook/searchAlbum') && (
+              <div class={styles.keywordSection}>
+                <div class={styles.keywordTitle}>
+                  <span class={styles.t}>搜索历史</span>
+                  <Icon
+                    class={styles.remove}
+                    name={iconDelete}
+                    onClick={() => (words.value = [])}
+                  />
+                </div>
+                <div class={classNames(styles.keywords)}>
+                  <div class={styles.content}>
+                    {words.value.map((item: any, index: number) => (
+                      <Tag
+                        ref={(el: any) => (tagRef.value[index] = el)}
+                        round
+                        class={[styles.searchKeyword, 'van-ellipsis']}
+                        key={item}
+                        onClick={() => {
+                          keyword.value = item
+                          onSearch(item)
+                        }}
+                      >
+                        {item}
+                      </Tag>
+                    ))}
+                    {collapse.line > 1 && (
+                      <span
+                        class={[styles.arrowMore]}
+                        onClick={() => {
+                          collapse.arrowStatus = !collapse.arrowStatus
+                          defaultClose()
+                        }}
+                      >
+                        <Icon
+                          name={
+                            collapse.arrowStatus ? 'arrow-up' : 'arrow-down'
+                          }
+                        />
+                      </span>
+                    )}
+                  </div>
                 </div>
               </div>
-            </div>
-          )}
+            )}
           {route.path === '/music-songbook/search' && (
             <Tabs
               color="var(--van-primary)"
@@ -401,22 +445,6 @@ export default defineComponent({
           )}
           <RouterView />
 
-          {/* 声部弹框 */}
-          {/* <Popup
-            show={subject.show}
-            position="bottom"
-            round
-            closeable
-            safe-area-inset-bottom
-            onClose={() => (subject.show = false)}
-            onClosed={() => (subject.show = false)}
-          >
-            <SelectSubject
-              searchParams={subject}
-              onComfirm={onComfirmSubject}
-            />
-          </Popup> */}
-
           <div
             class={[styles.searchResult]}
             style={{ display: searchResultStatus.value ? 'block' : 'none' }}

+ 16 - 0
src/tenant/music/search/index.module.less

@@ -1,3 +1,7 @@
+body {
+  background-color: #f8f8f8;
+}
+
 .search {
   --van-cell-background-color: transparent;
   --van-cell-font-size: 16px;
@@ -372,4 +376,16 @@
     height: 16px;
     margin-right: 10px;
   }
+}
+
+.searchAlbum {
+  padding: 6px 13px 13px;
+
+  :global {
+    .van-list {
+      padding: 0 13px;
+      background: #FFFFFF;
+      border-radius: 16px;
+    }
+  }
 }

+ 138 - 0
src/tenant/music/search/searchAlbum.tsx

@@ -0,0 +1,138 @@
+import { defineComponent, onMounted, onUnmounted, reactive, ref } from 'vue'
+import { useLocalStorage } from '@vueuse/core'
+import styles from './index.module.less'
+import { useRoute, useRouter } from 'vue-router'
+import { getRandomKey } from '../music'
+import { mitter } from './header'
+import { SubjectEnum, useSubjectId } from '@/helpers/hooks'
+import { List } from 'vant'
+import Song from '../component/song'
+import ColResult from '@/components/col-result'
+import { openDefaultWebView, state } from '@/state'
+import request from '@/helpers/request'
+
+export default defineComponent({
+  name: 'MusicSearch',
+  emits: ['confirm'],
+  setup() {
+    localStorage.setItem('behaviorId', getRandomKey())
+    const route = useRoute()
+    const router = useRouter()
+    const keyword = ref(route.query.keyword || '')
+    const subject = ref()
+
+    const getSubject: any = useSubjectId(SubjectEnum.SEARCH)
+    subject.value = getSubject.id
+
+    const onSearch = val => {
+      keyword.value = val
+      console.log(val, 'onSearchonSearchonSearch')
+      data.value.rows = []
+      params.name = val
+      params.page = 1
+      FetchList()
+    }
+
+    const params = reactive({
+      name: (route.query.search as string) || '',
+      rows: 20,
+      page: 1
+    })
+    const data = ref<any>(null)
+    const loading = ref(false)
+    const finished = ref(false)
+    const isError = ref(false)
+
+    const FetchList = async () => {
+      if (loading.value) {
+        return
+      }
+      loading.value = true
+      isError.value = false
+      try {
+        const res = await request.post(
+          `/api-student/music/sheet/searchTenant`,
+          {
+            data: params
+          }
+        )
+        if (data.value) {
+          const result = (data.value?.rows || []).concat(
+            res.data.music.rows || []
+          )
+          data.value.rows = result
+        }
+        data.value = data.value || res.data.music
+
+        const temp = data.value.rows || []
+        temp.forEach((item: any) => {
+          if (keyword.value) {
+            item.musicSheetName = item.musicSheetName.replace(
+              keyword.value,
+              `<span style="color: #FE2451">${keyword.value}</span>`
+            )
+          }
+        })
+        data.value.rows = temp
+
+        params.page = res.data.music.pageNo + 1
+        finished.value = res.data.music.pageNo >= res.data.music.totalPage
+      } catch (error) {
+        isError.value = true
+      }
+      loading.value = false
+    }
+
+    onMounted(() => {
+      mitter.on('search', onSearch)
+    })
+
+    onUnmounted(() => {
+      mitter.off('search', onSearch)
+    })
+
+    return () => {
+      return (
+        <div class={[styles.search, styles.searchAlbum]}>
+          <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 ? (
+              <Song
+                showTitleImg
+                list={data.value.rows}
+                onDetail={(item: any) => {
+                  const url =
+                    location.origin +
+                    location.pathname +
+                    '#/music-detail?id=' +
+                    item.id
+                  openDefaultWebView(url, () => {
+                    router.push({
+                      path: '/music-detail',
+                      query: {
+                        id: item.id
+                      }
+                    })
+                  })
+                }}
+              />
+            ) : (
+              !loading.value && (
+                <ColResult
+                  tips="暂无曲目"
+                  classImgSize="SMALL"
+                  btnStatus={false}
+                />
+              )
+            )}
+          </List>
+        </div>
+      )
+    }
+  }
+})

+ 1 - 1
vite.config.ts

@@ -12,7 +12,7 @@ function resolve(dir: string) {
 // https://vitejs.dev/config/
 // https://github.com/vitejs/vite/issues/1930 .env
 // const proxyUrl = 'https://online.colexiu.com/';
-const proxyUrl = 'https://test.colexiu.com/'
+const proxyUrl = 'https://dev.colexiu.com/'
 // const proxyUrl = 'http://192.168.3.143:8000/'
 export default defineConfig({
   base: './',