aidlab/Aida_Purchaser_Front
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: aidlab:de6295f2af4e63552fad096c2c6fa0e9c68a906d
Branches Tags
aidlab:main
..
compare: aidlab:main
Branches Tags
aidlab:main

3 Commits
de6295f2af ... main

Author SHA1 Message Date
X1627315083@163.com
8c8ec7846d 调整添加购物车逻辑 2026-05-12 17:02:49 +08:00
X1627315083@163.com
8d441766c5 fix 2026-05-12 14:13:56 +08:00
X1627315083@163.com
bf907a1378 digital空状态 2026-05-12 13:35:53 +08:00
5 changed files with 210 additions and 9 deletions
Expand all files Collapse all files

5
src/assets/icons/shop.svg Normal file
View File

@@ -0,0 +1,5 @@
<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-width="0.75" 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"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

4
src/assets/icons/statement.svg Normal file
View File

@@ -0,0 +1,4 @@
<svg width="17" height="17" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M8.32919 0C3.73406 0 0 3.7382 0 8.33333C0 12.9285 3.7382 16.6667 8.32919 16.6667C12.9202 16.6667 16.6584 12.9285 16.6584 8.33333C16.6584 3.7382 12.9243 0 8.32919 0ZM8.32919 15.7352C4.24739 15.7352 0.927306 12.4151 0.927306 8.33333C0.927306 4.25153 4.24739 0.931445 8.32919 0.931445C12.411 0.931445 15.7311 4.25153 15.7311 8.33333C15.7311 12.4151 12.411 15.7352 8.32919 15.7352Z" fill="#979797"/>
<path d="M8.84744 7.50551C8.84744 7.21972 8.61576 6.98804 8.32997 6.98804C8.04418 6.98804 7.8125 7.21972 7.8125 7.50551V12.4732C7.8125 12.759 8.04418 12.9907 8.32997 12.9907C8.61576 12.9907 8.84744 12.759 8.84744 12.4732V7.50551Z" fill="#979797"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 756 B

6
src/views/collectionStory/detail/index.vue
View File

@@ -77,6 +77,7 @@ const {} = toRefs(data);
display: flex;
height: calc(100vh - var(--header-height) - var(--footer-height));
align-items: flex-start;
overflow: hidden;
> div{
// height: 100%;
}
@@ -119,8 +120,8 @@ const {} = toRefs(data);
border-right: 0.5px solid #585858;
// overflow-y: auto;
overflow: hidden;
// height: 100%;
height: auto;
height: 100%;
// height: auto;
position: relative;
.line{
border: 0.5px solid #58585899;
@@ -141,6 +142,7 @@ const {} = toRefs(data);
align-items: center;
gap: 4rem;
overflow-y: auto;
height: 100%;
&::-webkit-scrollbar{
display: none;
}

18
src/views/digitalItem/index.vue
View File

@@ -3,6 +3,8 @@ import { ref, onMounted, onUnmounted, reactive, toRefs, onActivated } from "vue"
import CommodityList from "./commodity-list.vue";
import MerchantInfo from "./merchant-info.vue";
import { useRouter } from "vue-router";
import scListNull from '@/views/shoppingCart/sc-list-null.vue'
// 定义组件名称
defineOptions({
name: 'digitalItem'
@@ -77,7 +79,15 @@ const {} = toRefs(data);
<MerchantInfo></MerchantInfo>
</div>
<div class="commodity-list">
<CommodityList @addShopping="addShopping" @openDetail="openDetail"></CommodityList>
<CommodityList v-if="true" @addShopping="addShopping" @openDetail="openDetail"></CommodityList>
<div v-else class="null">
<sc-list-null
nullImage="shopping-cart"
:showButton="false"
title="Nothing in Digital Item"
tip="Try adjusting your filters or refreshing the page."
/>
</div>
</div>
</div>
<Footer></Footer>
@@ -178,7 +188,7 @@ const {} = toRefs(data);
> .content{
display: flex;
height: auto;
align-items: flex-start;
// align-items: flex-start;
border-top: 0.5px solid #585858;
.merchant-info{
width: 38.5rem;
@@ -197,6 +207,10 @@ const {} = toRefs(data);
border-left: 0.5px solid #585858;
border-right: 0.5px solid #585858;
margin-right: 9rem;
display: flex;
.null{
flex: 1;
}
}
}
}

186
src/views/shopping-drawer.vue
View File

@@ -1,7 +1,9 @@
<script setup lang="ts">
import { ref, onMounted, onUnmounted, reactive, toRefs } from "vue";
import myEvent from '@/utils/myEvent'
import scList from '@/views/shoppingCart/sc-list.vue'
// import scList from '@/views/shoppingCart/sc-list.vue'
import { useRouter } from "vue-router";
import img from '@/assets/images/brand-null.png'
//const props = defineProps({
//})
@@ -9,11 +11,17 @@ import scList from '@/views/shoppingCart/sc-list.vue'
//])
let data = reactive({
})
const isShoppingShow = ref(false)
const router = useRouter()
const isShoppingShow = ref(true)
const shoppingClose = () => {
isShoppingShow.value = false
}
const goShopping = () => {
router.push({path: '/shoppingCart'})
isShoppingShow.value = false
}
onMounted(()=>{
myEvent.add('addShopping', (item) => {
isShoppingShow.value = true
@@ -27,14 +35,182 @@ defineExpose({})
const {} = toRefs(data);
</script>
<template>
<el-drawer v-model="isShoppingShow" width="50rem" :close-on-click-modal="false" title="I am the title" :with-header="false">
<sc-list is-mini style="flex: 0.6;" @close="shoppingClose"/>
<el-drawer v-model="isShoppingShow" width="50rem" class="addShoppingDrawer" :close-on-click-modal="false" title="I am the title" :with-header="false">
<div class="addShoppingInfo">
<div class="header">
<div class="title">Added to your Shopping Cart</div>
<span class="close" @click="shoppingClose"
><svg-icon name="close" size="13"
/></span>
</div>
<div class="content">
<div class="img-list">
<div class="img-box">
<img :src="img" alt="">
</div>
<div class="img-box">
<img :src="img" alt="">
</div>
<div class="img-box">
<img :src="img" alt="">
</div>
</div>
<div class="inf-box">
<div class="name">North Outfit Set</div>
<div class="shopping-name">
<div class="icon">
<SvgIcon name="shop" size="24" />
</div>
Roaming Clouds
</div>
<div class="price">$15 <span class="currency">HKD</span></div>
</div>
<div class="statement">
<div class="icon">
<SvgIcon name="statement" size="16.6" />
</div>
Digital Assets Only. No physical product included.
</div>
</div>
<div class="button" @click="goShopping">
SeE Shopping Cart
</div>
</div>
<!-- <sc-list is-mini style="flex: 0.6;" @close="shoppingClose"/> -->
</el-drawer>
</template>
<style lang="less">
.el-drawer.addShoppingDrawer{
--el-drawer-padding-primary: 2.4rem 3.4rem;
}
</style>
<style lang="less" scoped>
.homeNavBox{
.addShoppingInfo{
width: 100%;
height: 100%;
position: relative;
display: flex;
flex-direction: column;
> .header{
border-bottom: 0.1rem solid #c4c4c4;
display: flex;
padding-bottom: 2.4rem;
align-items: center;
justify-content: space-between;
> .title{
font-family: KaiseiOpti-Bold;
font-size: 2rem;
line-height: 120%;
color: #121212;
font-weight: 400;
}
> .close{
cursor: pointer;
}
}
> .content{
flex: 1;
padding-top: 9.6rem;
display: flex;
flex-direction: column;
align-items: center;
> .img-list{
height: 37.5rem;
width: 33.7rem;
position: relative;
> .img-box{
position: absolute;
overflow: hidden;
width: 26.9rem;
height: 34.1rem;
border: 1px solid #EFEFEF;
top: 1.7rem;
right: 0;
left: auto;
transform-origin: bottom;
box-shadow: 1rem .8rem 2.4rem 0px #4D4D4D0A;
> img{
width: 100%;
height: 100%;
object-fit: cover;
}
&:nth-child(1){
transform: rotate(-8deg);
background-color: #eaeaea;
right: 2rem;
}
&:nth-child(2){
transform: rotate(-4deg);
background-color: #eeeeee;
right: 1rem;
}
&:nth-child(3){
transform: rotate(0);
background-color: #fafafa;
}
}
}
> .inf-box{
margin-top: 5.18rem;
display: flex;
flex-direction: column;
align-items: center;
> .name{
font-family: KaiseiOpti-Bold;
font-weight: 700;
font-size: 2.4rem;
line-height: 140%;
}
> .shopping-name{
margin-top: 1.3rem;
font-weight: 500;
font-size: 1.6rem;
line-height: 140%;
display: flex;
align-items: center;
> .icon{
margin-right: 0.8rem;
}
}
> .price{
margin-top: 1.2rem;
font-family: KaiseiOpti-Bold;
font-weight: 700;
font-style: Bold;
font-size: 1.8rem;
line-height: 140%;
> .currency{
font-size: 1.2rem;
font-weight: 500;
line-height: 140%;
}
}
}
> .statement{
margin-top: 5rem;
font-family: KaiseiOpti-Regular;
color: #979797;
display: flex;
font-weight: 400;
font-size: 1.2rem;
line-height: 140%;
> .icon{
margin-right: 0.8rem;
}
}
}
> .button{
font-family: KaiseiOpti-Regular;
font-weight: 400;
font-size: 14px;
line-height: 4.6rem;
letter-spacing: 3%;
text-align: center;
width: 100%;
border: 1px solid #232323;
margin-bottom: calc(6rem - 2.4rem);
cursor: pointer;
}
}
</style>