Merge branch 'main' of ssh://18.167.251.121:10002/aidlab/Aida_Purchaser_Front
BIN
public/images/home/digital-items-1.png
Normal file
|
After Width: | Height: | Size: 201 KiB |
BIN
public/images/home/digital-items-2.jpg
Normal file
|
After Width: | Height: | Size: 176 KiB |
BIN
public/images/home/digital-items-3.png
Normal file
|
After Width: | Height: | Size: 622 KiB |
BIN
public/images/home/digital-items-4.png
Normal file
|
After Width: | Height: | Size: 199 KiB |
BIN
public/images/home/digital-items-5.png
Normal file
|
After Width: | Height: | Size: 188 KiB |
BIN
public/images/home/digital-items-6.png
Normal file
|
After Width: | Height: | Size: 177 KiB |
BIN
public/images/home/digital-items-7.png
Normal file
|
After Width: | Height: | Size: 244 KiB |
BIN
public/images/home/digital-items-8.png
Normal file
|
After Width: | Height: | Size: 158 KiB |
@@ -1,5 +1,34 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M20 6.4C20 5.3 19.1 4 18 4H7.5C7.4 4 7.2 4 7.1 4C5.9 4.2 5 5.2 5 6.4L4 9C4 10.4 5.1 11.5 6.5 11.5C7.9 11.5 8.1 11.1 8.5 10.5C8.9 11.1 9.7 11.5 10.5 11.5C11.3 11.5 12.1 11.1 12.5 10.5C12.9 11.1 13.7 11.5 14.5 11.5C15.3 11.5 16.1 11.1 16.5 10.5C16.9 11.1 17.7 11.5 18.5 11.5C19.9 11.5 21 10.4 21 9M5.9 6.4C5.9 5.6 6.5 5 7.2 4.9C7.2 4.9 7.3 4.9 7.4 4.9H17.9C18.5 4.9 19 5.8 19 6.4C19 7 20 9.1 20 9.1C20 10 19.3 10.7 18.4 10.7C17.5 10.7 16.8 10 16.8 9.1V7.6H15.9V9.1C15.9 10 15.2 10.7 14.3 10.7C13.4 10.7 12.7 10 12.7 9.1V7.6H11.8V9.1C11.8 10 11.1 10.7 10.2 10.7C9.3 10.7 8.6 10 8.6 9.1V7.6H7.7V9.1C7.7 10 7.50938 10.7 6.60938 10.7C5.48438 10.7 4.9 9.9 4.9 9L5.9 6.4Z" fill="#232323"/>
|
||||
<path d="M6 11.2V19.3C6 19.9 6.4 20.3 7 20.3H18C18.6 20.3 19 19.9 19 19.3V13.5" stroke="#232323" stroke-linecap="round"/>
|
||||
<path d="M17 15.5V13.5C17 13.2239 16.7761 13 16.5 13C16.2239 13 16 13.2239 16 13.5V15.5C16 15.7761 16.2239 16 16.5 16C16.7761 16 17 15.7761 17 15.5Z" fill="#232323"/>
|
||||
<?xml version="1.0" standalone="no"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
|
||||
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
|
||||
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
|
||||
width="512.000000pt" height="512.000000pt" viewBox="0 0 512.000000 512.000000"
|
||||
preserveAspectRatio="xMidYMid meet">
|
||||
|
||||
<g transform="translate(0.000000,512.000000) scale(0.100000,-0.100000)"
|
||||
fill="#000000" stroke="none">
|
||||
<path d="M1466 4255 c-92 -26 -177 -75 -247 -145 -80 -80 -124 -165 -140 -271
|
||||
-7 -49 -46 -167 -115 -349 -110 -291 -116 -319 -93 -420 31 -136 153 -289 276
|
||||
-346 l62 -29 3 -885 3 -885 23 -47 c13 -26 43 -65 67 -87 82 -76 1 -72 1386
|
||||
-69 l1234 3 55 30 c60 33 114 96 130 153 6 24 10 274 10 699 l0 662 -22 21
|
||||
c-25 23 -56 26 -84 6 -18 -14 -19 -36 -24 -678 -6 -738 -3 -708 -74 -742 -31
|
||||
-15 -145 -16 -1253 -16 -1204 0 -1218 0 -1251 20 -64 39 -62 3 -62 938 l0 849
|
||||
108 5 c166 9 244 46 316 151 l37 54 57 -56 c99 -98 230 -151 374 -151 141 0
|
||||
287 60 376 154 l49 51 57 -57 c103 -104 250 -156 409 -145 138 9 257 64 347
|
||||
160 l40 43 63 -61 c98 -97 221 -145 367 -145 263 0 486 190 521 445 l11 80
|
||||
-102 265 c-72 186 -107 290 -116 348 -39 236 -188 417 -373 452 -35 6 -467 10
|
||||
-1215 9 -939 -1 -1170 -3 -1210 -14z m2388 -186 c97 -27 177 -151 202 -313 16
|
||||
-108 55 -221 147 -426 52 -115 61 -143 60 -189 -2 -72 -49 -167 -109 -220 -70
|
||||
-61 -140 -84 -244 -79 -75 3 -94 8 -150 39 -43 24 -78 52 -102 85 -63 82 -70
|
||||
115 -75 337 l-5 197 -94 0 -94 0 0 -195 c0 -174 -2 -200 -21 -252 -27 -70 -95
|
||||
-145 -164 -181 -72 -37 -197 -43 -277 -12 -75 28 -150 96 -185 168 -27 56 -28
|
||||
61 -31 265 l-4 207 -93 0 -94 0 -3 -203 -3 -203 -33 -66 c-40 -81 -102 -139
|
||||
-181 -169 -80 -30 -204 -24 -279 15 -64 33 -123 92 -154 154 -21 43 -23 63
|
||||
-28 257 l-5 210 -95 0 -95 0 -5 -240 c-5 -223 -7 -243 -28 -290 -47 -101 -102
|
||||
-130 -234 -123 -65 4 -96 11 -141 33 -107 53 -174 152 -184 270 -5 57 0 72 98
|
||||
325 56 146 106 291 110 323 20 132 105 232 234 273 53 17 2299 20 2359 3z"/>
|
||||
<path d="M3494 2343 c-12 -2 -34 -18 -50 -34 l-29 -30 -3 -211 c-2 -116 -1
|
||||
-231 3 -256 14 -97 108 -135 177 -73 l33 29 3 241 c3 205 1 245 -13 274 -21
|
||||
45 -71 70 -121 60z"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 2.1 KiB |
@@ -41,7 +41,7 @@
|
||||
</script>
|
||||
<template>
|
||||
<div class="commodity-item" :class="{ 'is-download': download }">
|
||||
<img :src="props.url" alt="" @click="openDetail" />
|
||||
<img v-loadimg="props.url" alt="" @click="openDetail" />
|
||||
<div class="detail">
|
||||
<div class="text">
|
||||
<div class="name">
|
||||
|
||||
@@ -14,7 +14,7 @@ export default {
|
||||
};
|
||||
function loadImage(el, src) {
|
||||
if (!src) return
|
||||
|
||||
if (el.src === src) return
|
||||
const img = new Image()
|
||||
img.src = src
|
||||
img.onload = () => {
|
||||
|
||||
@@ -1,6 +1,10 @@
|
||||
import img from '@/assets/images/shopping-cart-null.png'
|
||||
// 加载图片
|
||||
export default {
|
||||
name: 'loadimg',
|
||||
beforeMount(el, binding) {
|
||||
if (!el.src) el.src = img
|
||||
},
|
||||
mounted(el, binding) {
|
||||
const src = binding.value
|
||||
if (el.src === src) return
|
||||
|
||||
@@ -3,7 +3,9 @@ export const UrlList = {
|
||||
codeCreate: 'https://www.code-create.com/',
|
||||
terms: 'https://www.code-create.com.hk/terms-of-use/',
|
||||
privacy: 'https://www.code-create.com.hk/privacy-policy/',
|
||||
|
||||
faq: 'https://code-create.com.hk/help-centre/',
|
||||
aboutUs: 'https://code-create.com.hk/about-us/',
|
||||
joinWithUs: 'https://code-create.com.hk/contact-us/',
|
||||
}
|
||||
export const openView = (url) => {
|
||||
window.open(url, '_blank')
|
||||
|
||||
@@ -163,6 +163,7 @@ defineExpose({})
|
||||
border-right: 0.5px solid #585858;
|
||||
margin-right: -1px;
|
||||
margin-bottom: -1px;
|
||||
min-width: 0;
|
||||
}
|
||||
> .material_content_list_loding{
|
||||
width: 100%;
|
||||
|
||||
@@ -81,7 +81,7 @@ defineExpose({})
|
||||
overflow-y: auto;
|
||||
.header-img{
|
||||
width: 100%;
|
||||
border-bottom: 1px solid #232323;
|
||||
border-bottom: 1px solid #585858;
|
||||
>img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
@@ -376,6 +376,9 @@ defineExpose({})
|
||||
font-size: 3rem;
|
||||
line-height: 120%;
|
||||
margin-bottom: 1rem;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.img-price{
|
||||
font-family: KaiseiOpti-Bold;
|
||||
|
||||
@@ -114,7 +114,6 @@ const {} = toRefs(data);
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-top: -1px;
|
||||
.list{
|
||||
width: 100%;
|
||||
flex: 1;
|
||||
@@ -125,7 +124,6 @@ const {} = toRefs(data);
|
||||
display: grid;
|
||||
align-content: start;
|
||||
grid-template-columns: repeat(auto-fill, minmax(min(100%, 28rem), 1fr));
|
||||
border-top: 0.5px solid #585858;
|
||||
padding: .5px 0 0 .5px;
|
||||
|
||||
/* 垂直线(右边框) */
|
||||
@@ -136,6 +134,7 @@ const {} = toRefs(data);
|
||||
border-right: 0.5px solid #585858;
|
||||
margin-right: -1px;
|
||||
margin-bottom: -1px;
|
||||
min-width: 0;
|
||||
}
|
||||
> .material_content_list_loding{
|
||||
width: 100%;
|
||||
|
||||
@@ -25,22 +25,22 @@
|
||||
{
|
||||
title: 'Women’s Item',
|
||||
tip: 'Blue Pleat Aria',
|
||||
url: 'http://118.31.39.42:3000/falls/digital-items-1.png'
|
||||
url: '/images/home/digital-items-1.png'
|
||||
},
|
||||
{
|
||||
title: 'Girls’ Item',
|
||||
tip: 'Candy Riot',
|
||||
url: 'http://118.31.39.42:3000/falls/digital-items-2.jpg'
|
||||
url: '/images/home/digital-items-2.jpg'
|
||||
},
|
||||
{
|
||||
title: 'Men’s Item',
|
||||
tip: 'Void Armour',
|
||||
url: 'http://118.31.39.42:3000/falls/digital-items-3.png'
|
||||
url: '/images/home/digital-items-3.png'
|
||||
},
|
||||
{
|
||||
title: 'Boys’ Item',
|
||||
tip: 'Jester Edit',
|
||||
url: 'http://118.31.39.42:3000/falls/digital-items-4.png'
|
||||
url: '/images/home/digital-items-4.png'
|
||||
}
|
||||
])
|
||||
const onShopAll = () => {
|
||||
|
||||
@@ -17,25 +17,25 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, ref } from 'vue'
|
||||
const list = ref([
|
||||
{
|
||||
title: 'Women’s Item',
|
||||
tip: 'Blue Pleat Aria',
|
||||
url: 'http://118.31.39.42:3000/falls/digital-items-1.png'
|
||||
},
|
||||
{
|
||||
title: 'Girls’ Item',
|
||||
tip: 'Candy Riot',
|
||||
url: 'http://118.31.39.42:3000/falls/digital-items-2.jpg'
|
||||
tip: 'Meadow Wrap',
|
||||
url: '/images/home/digital-items-5.png'
|
||||
},
|
||||
{
|
||||
title: 'Men’s Item',
|
||||
tip: 'Void Armour',
|
||||
url: 'http://118.31.39.42:3000/falls/digital-items-3.png'
|
||||
title: 'Women’s Item',
|
||||
tip: 'Onyx Silhouette',
|
||||
url: '/images/home/digital-items-6.png'
|
||||
},
|
||||
{
|
||||
title: 'Boys’ Item',
|
||||
tip: 'Jester Edit',
|
||||
url: 'http://118.31.39.42:3000/falls/digital-items-4.png'
|
||||
tip: 'Autumn Roam',
|
||||
url: '/images/home/digital-items-7.png'
|
||||
},
|
||||
{
|
||||
title: 'Men’s Item',
|
||||
tip: 'Archive Casual',
|
||||
url: '/images/home/digital-items-8.png'
|
||||
}
|
||||
])
|
||||
</script>
|
||||
|
||||
@@ -21,26 +21,11 @@
|
||||
<span class="icon"><svg-icon name="arrow_right" size="12" /></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="help">
|
||||
<div class="title">{{ $t('Home.Help') }}</div>
|
||||
<div class="item">{{ $t('Home.FAQ') }}</div>
|
||||
<div class="item">{{ $t('Home.MyAccount') }}</div>
|
||||
<div class="item">{{ $t('Home.MyOrders') }}</div>
|
||||
<div class="item">{{ $t('Home.PaymentInvoices') }}</div>
|
||||
<div class="item">{{ $t('Home.CopyrightLicense') }}</div>
|
||||
</div>
|
||||
<div class="polices">
|
||||
<div class="title">{{ $t('Home.Polices') }}</div>
|
||||
<div class="item">{{ $t('Home.Legal') }}</div>
|
||||
<div class="item">{{ $t('Home.PrivacyPolicy') }}</div>
|
||||
<div class="item">{{ $t('Home.CookiesSettings') }}</div>
|
||||
<div class="item">{{ $t('Home.PurchaseConditions') }}</div>
|
||||
</div>
|
||||
<div class="company">
|
||||
<div class="title">{{ $t('Home.Company') }}</div>
|
||||
<div class="item">{{ $t('Home.AboutUs') }}</div>
|
||||
<div class="item">{{ $t('Home.Offices') }}</div>
|
||||
<div class="item">{{ $t('Home.JoinWithUs') }}</div>
|
||||
<div v-for="v in list" :key="v.title" :class="[v.class]">
|
||||
<div class="title">{{ $t(v.title) }}</div>
|
||||
<div v-for="item in v.child" :key="item.title" class="item" @click="onItem(item)">
|
||||
{{ $t(item.title) }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<HomeFooter class="footer" isHome />
|
||||
@@ -53,6 +38,81 @@
|
||||
const router = useRouter()
|
||||
import HomeFooter from '@/components/Footer.vue'
|
||||
import { UrlList, openView } from '../../utils/UrlList'
|
||||
const list = ref([
|
||||
{
|
||||
title: 'Home.Help',
|
||||
class: 'help',
|
||||
child: [
|
||||
{
|
||||
title: 'Home.FAQ',
|
||||
url: UrlList.faq
|
||||
},
|
||||
{
|
||||
title: 'Home.MyAccount',
|
||||
name: 'settings'
|
||||
},
|
||||
{
|
||||
title: 'Home.MyOrders',
|
||||
name: 'wardrobe'
|
||||
},
|
||||
{
|
||||
title: 'Home.PaymentInvoices',
|
||||
url: ''
|
||||
},
|
||||
{
|
||||
title: 'Home.CopyrightLicense',
|
||||
url: ''
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: 'Home.Polices',
|
||||
class: 'polices',
|
||||
child: [
|
||||
{
|
||||
title: 'Home.Legal',
|
||||
url: ''
|
||||
},
|
||||
{
|
||||
title: 'Home.PrivacyPolicy',
|
||||
url: UrlList.privacy
|
||||
},
|
||||
{
|
||||
title: 'Home.CookiesSettings',
|
||||
url: ''
|
||||
},
|
||||
{
|
||||
title: 'Home.PurchaseConditions',
|
||||
url: ''
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: 'Home.Company',
|
||||
class: 'company',
|
||||
child: [
|
||||
{
|
||||
title: 'Home.AboutUs',
|
||||
url: UrlList.aboutUs
|
||||
},
|
||||
{
|
||||
title: 'Home.Offices',
|
||||
url: ''
|
||||
},
|
||||
{
|
||||
title: 'Home.JoinWithUs',
|
||||
url: UrlList.joinWithUs
|
||||
}
|
||||
]
|
||||
}
|
||||
])
|
||||
const onItem = (item) => {
|
||||
if (item.url) {
|
||||
openView(item.url)
|
||||
} else if (item.name) {
|
||||
router.push({ name: item.name })
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
|
||||
@@ -7,9 +7,9 @@
|
||||
}"
|
||||
>
|
||||
<slot name="checkbox" />
|
||||
<img :src="info.cover" />
|
||||
<img v-loadimg="info.cover" />
|
||||
<div class="content">
|
||||
<div class="title">{{ info.title }}</div>
|
||||
<div class="title" :title="info.title">{{ info.title }}</div>
|
||||
<div class="brand" v-if="showBrand" @click="handleBrandClick">
|
||||
<span class="icon"><svg-icon name="order-shop" size="24" /></span>
|
||||
<span class="text">{{ info.brand }}</span>
|
||||
@@ -107,6 +107,7 @@
|
||||
flex: 1;
|
||||
margin: var(--sc-item-content-margin, 0 4rem);
|
||||
align-self: var(--sc-item-content-align-self);
|
||||
overflow: hidden;
|
||||
> * {
|
||||
margin-bottom: var(--sc-item-margin-bottom, 1.6rem);
|
||||
&:last-child {
|
||||
@@ -117,6 +118,14 @@
|
||||
font-family: KaiseiOpti-Bold;
|
||||
font-size: var(--sc-item-title-font-size, 2.4rem);
|
||||
color: var(--sc-item-title-color, #232323);
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
word-break: break-all;
|
||||
display: -webkit-box;
|
||||
line-clamp: 2;
|
||||
box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
> .brand {
|
||||
display: flex;
|
||||
|
||||