Commit bb673e6bf6d1d475b663d197199625d02f645b2c
1 parent
7866e886
up
Showing
9 changed files
with
24 additions
and
21 deletions
src/assets/banner1.png renamed to public/banner1.png
213 KB
src/assets/banner2.jpeg renamed to public/banner2.jpeg
66 KB
src/assets/banner3.jpeg renamed to public/banner3.jpeg
75.9 KB
src/components/Header.vue
| @@ -30,9 +30,6 @@ | @@ -30,9 +30,6 @@ | ||
| 30 | import { ref, onMounted } from 'vue' | 30 | import { ref, onMounted } from 'vue' |
| 31 | 31 | ||
| 32 | const tab = ref(1) | 32 | const tab = ref(1) |
| 33 | -const handleTabsChange = (val) => { | ||
| 34 | - console.log(12121) | ||
| 35 | -} | ||
| 36 | </script> | 33 | </script> |
| 37 | 34 | ||
| 38 | <style lang="scss" scoped> | 35 | <style lang="scss" scoped> |
src/components/__tests__/HelloWorld.spec.ts deleted
100644 → 0
| 1 | -import { describe, it, expect } from 'vitest' | ||
| 2 | - | ||
| 3 | -import { mount } from '@vue/test-utils' | ||
| 4 | -import HelloWorld from '../HelloWorld.vue' | ||
| 5 | - | ||
| 6 | -describe('HelloWorld', () => { | ||
| 7 | - it('renders properly', () => { | ||
| 8 | - const wrapper = mount(HelloWorld, { props: { msg: 'Hello Vitest' } }) | ||
| 9 | - expect(wrapper.text()).toContain('Hello Vitest') | ||
| 10 | - }) | ||
| 11 | -}) |
src/type.d.ts
| @@ -14,6 +14,17 @@ export interface Product { | @@ -14,6 +14,17 @@ export interface Product { | ||
| 14 | name: string | 14 | name: string |
| 15 | id: string | 15 | id: string |
| 16 | imageUrl: string | 16 | imageUrl: string |
| 17 | + basename1: string | ||
| 18 | + basename2: string | ||
| 19 | + basename2: string | ||
| 20 | + basecore1: string | ||
| 21 | + basecore2: string | ||
| 22 | + basecore3: string | ||
| 23 | + model: string | ||
| 24 | + brandName: string | ||
| 25 | + physicalproperty: string | ||
| 26 | + storage: string | ||
| 27 | + productimageliststore: ProductImage[] | ||
| 17 | } | 28 | } |
| 18 | 29 | ||
| 19 | export interface ProductListQuery { | 30 | export interface ProductListQuery { |
| @@ -22,3 +33,8 @@ export interface ProductListQuery { | @@ -22,3 +33,8 @@ export interface ProductListQuery { | ||
| 22 | pageNo: number | 33 | pageNo: number |
| 23 | pageSize: number | 34 | pageSize: number |
| 24 | } | 35 | } |
| 36 | + | ||
| 37 | +export interface ProductImage { | ||
| 38 | + url: string | ||
| 39 | + fileKey: string | ||
| 40 | +} |
src/views/Home.vue
| 1 | <template> | 1 | <template> |
| 2 | <v-container class="mx-auto content"> | 2 | <v-container class="mx-auto content"> |
| 3 | <v-carousel cycle height="360" hide-delimiter-background show-arrows="hover" class="tw-mb-16"> | 3 | <v-carousel cycle height="360" hide-delimiter-background show-arrows="hover" class="tw-mb-16"> |
| 4 | - <v-carousel-item v-for="(slide, i) in slides" :key="i" :src="slide" cover> </v-carousel-item> | 4 | + <v-carousel-item src="/banner1.png" cover> </v-carousel-item> |
| 5 | + <v-carousel-item src="/banner2.jpeg" cover> </v-carousel-item> | ||
| 6 | + <v-carousel-item src="/banner3.jpeg" cover> </v-carousel-item> | ||
| 5 | </v-carousel> | 7 | </v-carousel> |
| 6 | <div v-for="item in store.list" :key="item.categoryDisplayName" class="tw-mb-[64px]"> | 8 | <div v-for="item in store.list" :key="item.categoryDisplayName" class="tw-mb-[64px]"> |
| 7 | <HomeProductList :title="item.categoryDisplayName" :list="item.list" /> | 9 | <HomeProductList :title="item.categoryDisplayName" :list="item.list" /> |
| @@ -12,7 +14,6 @@ | @@ -12,7 +14,6 @@ | ||
| 12 | <script setup lang="ts"> | 14 | <script setup lang="ts"> |
| 13 | import HomeProductList from '@/components/HomeCategoryList.vue' | 15 | import HomeProductList from '@/components/HomeCategoryList.vue' |
| 14 | import { useCategoryStore } from '@/stores/category' | 16 | import { useCategoryStore } from '@/stores/category' |
| 15 | -const slides = ['src/assets/banner1.png', 'src/assets/banner2.jpeg', 'src/assets/banner3.jpeg'] | ||
| 16 | 17 | ||
| 17 | const store = useCategoryStore() | 18 | const store = useCategoryStore() |
| 18 | </script> | 19 | </script> |
src/views/ProductDetail.vue
| @@ -70,20 +70,21 @@ | @@ -70,20 +70,21 @@ | ||
| 70 | 70 | ||
| 71 | <script setup lang="ts"> | 71 | <script setup lang="ts"> |
| 72 | import { getDetail } from '@/service' | 72 | import { getDetail } from '@/service' |
| 73 | +import type { Product } from '@/type' | ||
| 74 | +import type { ProductImage } from '@/type' | ||
| 73 | import { onMounted, ref } from 'vue' | 75 | import { onMounted, ref } from 'vue' |
| 74 | import { useRoute } from 'vue-router' | 76 | import { useRoute } from 'vue-router' |
| 75 | 77 | ||
| 76 | const route = useRoute() | 78 | const route = useRoute() |
| 77 | -const info = ref({ | 79 | +const info = ref<Partial<Product>>({ |
| 78 | productimageliststore: [] | 80 | productimageliststore: [] |
| 79 | }) | 81 | }) |
| 80 | 82 | ||
| 81 | onMounted(() => { | 83 | onMounted(() => { |
| 82 | getDetail({ id: route.params.id as string }).then((res) => { | 84 | getDetail({ id: route.params.id as string }).then((res) => { |
| 83 | const data = res.data.data || {} | 85 | const data = res.data.data || {} |
| 84 | - console.log('%c [ data ]-117', 'font-size:13px; background:pink; color:#bf2c9f;', data) | ||
| 85 | - data.productimageliststore = JSON.parse(data.productimageliststore) || [] | ||
| 86 | - data.productimageliststore = data.productimageliststore.map((item) => ({ | 86 | + data.productimageliststore = (JSON.parse(data.productimageliststore) || []) as ProductImage[] |
| 87 | + data.productimageliststore = data.productimageliststore.map((item: ProductImage) => ({ | ||
| 87 | ...item, | 88 | ...item, |
| 88 | url: `http://112.74.45.244:8100/api/show/image?fileKey=${item.fileKey}` | 89 | url: `http://112.74.45.244:8100/api/show/image?fileKey=${item.fileKey}` |
| 89 | })) | 90 | })) |
vite.config.ts