Showing
4 changed files
with
20 additions
and
18 deletions
| 1 | import { useRouter } from 'vue-router'; | 1 | import { useRouter } from 'vue-router'; |
| 2 | 2 | ||
| 3 | +/** | ||
| 4 | + * 封装路由跳转方便行内调用 | ||
| 5 | + * @returns | ||
| 6 | + */ | ||
| 3 | export function useGo () { | 7 | export function useGo () { |
| 4 | let router = useRouter() | 8 | let router = useRouter() |
| 5 | function go (path, query) { | 9 | function go (path, query) { | ... | ... |
| ... | @@ -11,3 +11,9 @@ export const styleObject2 = ref({ | ... | @@ -11,3 +11,9 @@ export const styleObject2 = ref({ |
| 11 | color: '#0B3A72', | 11 | color: '#0B3A72', |
| 12 | borderColor: '#F9D95C' | 12 | borderColor: '#F9D95C' |
| 13 | }) | 13 | }) |
| 14 | + | ||
| 15 | +export const styleObject3 = ref({ | ||
| 16 | + backgroundColor: '#F4675A', | ||
| 17 | + color: '#FFFFFF', | ||
| 18 | + borderColor: '#F4675A' | ||
| 19 | +}) | ... | ... |
| ... | @@ -66,7 +66,8 @@ | ... | @@ -66,7 +66,8 @@ |
| 66 | <template v-for="item in prod_list" :key="item" style="height: 3rem;"> | 66 | <template v-for="item in prod_list" :key="item" style="height: 3rem;"> |
| 67 | <video-card :item="item"> | 67 | <video-card :item="item"> |
| 68 | <template #bookDetailSub> | 68 | <template #bookDetailSub> |
| 69 | - <div @click="goToDetail(item.id, item.book_id, item.type)" style="color: #999999; padding: 0px 1rem 0.5rem;">{{ item.kg_name }} | {{ item.localism_type }} </div> | 69 | + <div @click="goToDetail(item.id, item.book_id, item.type)" |
| 70 | + style="color: #999999; padding: 0px 1rem 0.5rem;">{{ item.kg_name }} | {{ item.localism_type }} </div> | ||
| 70 | </template> | 71 | </template> |
| 71 | </video-card> | 72 | </video-card> |
| 72 | </template> | 73 | </template> |
| ... | @@ -94,7 +95,7 @@ | ... | @@ -94,7 +95,7 @@ |
| 94 | <my-button @on-click="toDonate" type="plain">爱心捐书</my-button> | 95 | <my-button @on-click="toDonate" type="plain">爱心捐书</my-button> |
| 95 | </div> | 96 | </div> |
| 96 | </div> | 97 | </div> |
| 97 | - <shortcut-fixed type="C" :item="['home', 'me']"></shortcut-fixed> | 98 | + <shortcut-fixed type="C" :item="shortcutItem"></shortcut-fixed> |
| 98 | </div> | 99 | </div> |
| 99 | 100 | ||
| 100 | <!-- 上传时,如果没有默认儿童提示弹框, 如果没有实名认证提示弹框 --> | 101 | <!-- 上传时,如果没有默认儿童提示弹框, 如果没有实名认证提示弹框 --> |
| ... | @@ -124,7 +125,9 @@ import { icon_video, icon_up, icon_down, icon_subscribed, icon_unsubscribe, no_i | ... | @@ -124,7 +125,9 @@ import { icon_video, icon_up, icon_down, icon_subscribed, icon_unsubscribe, no_i |
| 124 | import { JSJ_FORM_C } from '@/constant' | 125 | import { JSJ_FORM_C } from '@/constant' |
| 125 | 126 | ||
| 126 | import { useVideoList, useDefaultPerf } from '@/composables'; | 127 | import { useVideoList, useDefaultPerf } from '@/composables'; |
| 128 | +import { useShortcutBar } from '@/composables'; | ||
| 127 | 129 | ||
| 130 | +const { shortcutItem } = useShortcutBar(['home', 'me']); // 配置快捷跳转条 | ||
| 128 | const $route = useRoute(); | 131 | const $route = useRoute(); |
| 129 | const $router = useRouter(); | 132 | const $router = useRouter(); |
| 130 | 133 | ||
| ... | @@ -352,6 +355,7 @@ const goToDetail = (prod_id, book_id, type) => { // 跳转作品详情页 | ... | @@ -352,6 +355,7 @@ const goToDetail = (prod_id, book_id, type) => { // 跳转作品详情页 |
| 352 | .book-video-title { | 355 | .book-video-title { |
| 353 | background-color: #F7F7F7; | 356 | background-color: #F7F7F7; |
| 354 | padding: 1rem 1.5rem; | 357 | padding: 1rem 1.5rem; |
| 358 | + | ||
| 355 | .bg-gradient { | 359 | .bg-gradient { |
| 356 | background: linear-gradient(@base-color, @base-color) no-repeat; | 360 | background: linear-gradient(@base-color, @base-color) no-repeat; |
| 357 | /*调整下划线的宽度占百分之百 高度是3px */ | 361 | /*调整下划线的宽度占百分之百 高度是3px */ | ... | ... |
| 1 | <template> | 1 | <template> |
| 2 | <div class="book-list"> | 2 | <div class="book-list"> |
| 3 | <template v-for="(item, key) in items" :key="key"> | 3 | <template v-for="(item, key) in items" :key="key"> |
| 4 | - <book-card type="C" :item="item" @on-click="onClick(item)"></book-card> | 4 | + <book-card type="C" :item="item" @on-click="go('/client/bookDetail', { id: item.id })"></book-card> |
| 5 | </template> | 5 | </template> |
| 6 | </div> | 6 | </div> |
| 7 | <van-empty v-if="emptyStatus" | 7 | <van-empty v-if="emptyStatus" |
| ... | @@ -14,14 +14,11 @@ | ... | @@ -14,14 +14,11 @@ |
| 14 | <script setup> | 14 | <script setup> |
| 15 | import no_image from '@images/que-shuju@2x.png' | 15 | import no_image from '@images/que-shuju@2x.png' |
| 16 | import BookCard from '@/components/BookCard/index.vue' | 16 | import BookCard from '@/components/BookCard/index.vue' |
| 17 | -import { ref, reactive, onMounted } from 'vue' | 17 | +import { ref } from 'vue' |
| 18 | -import { useRoute, useRouter } from 'vue-router' | ||
| 19 | import axios from '@/utils/axios'; | 18 | import axios from '@/utils/axios'; |
| 20 | -import $ from 'jquery' | 19 | +import { useGo } from '@/hooks/useGo' |
| 21 | -import { Toast } from 'vant'; | ||
| 22 | -const $route = useRoute(); | ||
| 23 | -const $router = useRouter(); | ||
| 24 | 20 | ||
| 21 | +const go = useGo() | ||
| 25 | // 因为不能让空图标提前出来的写法 | 22 | // 因为不能让空图标提前出来的写法 |
| 26 | const emptyStatus = ref(false); | 23 | const emptyStatus = ref(false); |
| 27 | 24 | ||
| ... | @@ -45,15 +42,6 @@ axios.get('/srv/?a=my_subscribe') | ... | @@ -45,15 +42,6 @@ axios.get('/srv/?a=my_subscribe') |
| 45 | .catch(err => { | 42 | .catch(err => { |
| 46 | console.error(err); | 43 | console.error(err); |
| 47 | }); | 44 | }); |
| 48 | - | ||
| 49 | -const onClick = (item) => { | ||
| 50 | - $router.push({ | ||
| 51 | - path: '/client/bookDetail', | ||
| 52 | - query: { | ||
| 53 | - id: item.id | ||
| 54 | - } | ||
| 55 | - }); | ||
| 56 | -} | ||
| 57 | </script> | 45 | </script> |
| 58 | 46 | ||
| 59 | <script> | 47 | <script> | ... | ... |
-
Please register or login to post a comment