This commit is contained in:
X1627315083@163.com
2026-06-01 10:40:11 +08:00
parent 965721bbdd
commit fdc5f9d095
9 changed files with 40 additions and 35 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.2 KiB

View File

@@ -52,7 +52,7 @@
:class="{ 'is-download': download }" :class="{ 'is-download': download }"
v-if="props.showPrice && props.price" v-if="props.showPrice && props.price"
> >
{{ props.price }} HK${{ props.price }}
</div> </div>
</div> </div>
<div class="btn" @click="addShopping"> <div class="btn" @click="addShopping">
@@ -89,16 +89,17 @@
color: #232323; color: #232323;
> .name { > .name {
font-family: 'KaiseiOpti-Regular'; font-family: 'KaiseiOpti-Regular';
font-weight: 400; font-weight: 700;
font-size: var(--commodity-name-fontSize, 1.6rem); font-size: var(--commodity-name-fontSize, 2rem);
line-height: var(--commodity-name-lineHeight, 2.3rem); line-height: var(--commodity-name-lineHeight, 2.3rem);
margin-bottom: var(--commodity-name-marginBottom, 0rem); margin-bottom: var(--commodity-name-marginBottom, 0rem);
} }
> .price { > .price {
font-family: 'KaiseiOpti-Regular'; font-family: 'KaiseiOpti-Regular';
font-weight: 400; font-weight: 400;
font-size: var(--commodity-price-fontSize, 1.4rem); font-size: var(--commodity-price-fontSize, 1.6rem);
line-height: var(--commodity-price-lineHeight, 2.3rem); line-height: var(--commodity-price-lineHeight, 2.3rem);
margin-top: .8rem;
&.is-download { &.is-download {
color: #979797; color: #979797;
} }

View File

@@ -15,14 +15,14 @@ const emit = defineEmits([
]) ])
const checkList = computed(()=>{ const checkList = computed(()=>{
if(props.selected[0] === 'all'){ if(props.selected[0] === 'all'){
return props.list.map(item => item.value) return []
}else{ }else{
return [...props.selected] return [...props.selected]
} }
}) })
const handleChange = (val) => { const handleChange = (val) => {
let data = val.filter(item => item !== 'all') let data = val.filter(item => item !== 'all')
if(data.length == props.list.length){ if(data.length == props.list.length || data.length == 0){
data = ['all'] data = ['all']
}else{ }else{
data = [...val] data = [...val]
@@ -31,18 +31,19 @@ const handleChange = (val) => {
emit('change', data) emit('change', data)
} }
const checkAll = computed(()=>{ const checkAll = computed(()=>{
return checkList.value.length === props.list.length return props.selected?.[0] == 'all'
}) })
const handleCheckAllChange = (val) => { const handleCheckAllChange = (val) => {
let data = [] let data = []
if(val && props.selected[0] !== 'all'){ if(val && props.selected[0] !== 'all'){
data = ['all'] data = ['all']
// data = props.list.map(item => item.value) // data = props.list.map(item => item.value)
emit('update:selected', data)
emit('change', data)
}else{ }else{
data = [] data = []
} }
emit('update:selected', data)
emit('change', data)
} }
let data = reactive({ let data = reactive({
}) })

View File

@@ -188,6 +188,7 @@ const {} = toRefs(data);
position: relative; position: relative;
height: 34.4rem; height: 34.4rem;
transition: all .3s; transition: all .3s;
flex-shrink: 0;
&.active{ &.active{
height: 14.7rem; height: 14.7rem;
} }
@@ -227,7 +228,7 @@ const {} = toRefs(data);
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
flex: 1; flex: 1;
overflow: hidden; // overflow: hidden;
> .input{ > .input{
width: 66.6rem; width: 66.6rem;
display: flex; display: flex;
@@ -286,14 +287,17 @@ const {} = toRefs(data);
> .merchantList{ > .merchantList{
width: 121.8rem; width: 121.8rem;
margin-top: 6rem; margin-top: 6rem;
flex: 1; // flex: 1;
overflow-y: auto; // overflow-y: auto;
gap: 3.2rem;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
::-webkit-scrollbar{ ::-webkit-scrollbar{
display: none; display: none;
} }
:deep(.item){
margin-top: 2.1rem;
padding-bottom: 2.1rem;
}
.end{ .end{
font-family: 'KaiseiOpti-Regular'; font-family: 'KaiseiOpti-Regular';
font-weight: 400; font-weight: 400;

View File

@@ -78,8 +78,12 @@ defineExpose({})
overflow-y: auto; overflow-y: auto;
.header-img{ .header-img{
width: 100%; width: 100%;
border-bottom: 1px solid #232323;
>img{ >img{
width: 100%; width: 100%;
height: 100%;
display: block;
object-fit: cover;
} }
} }
.content{ .content{

View File

@@ -1,6 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref, onMounted, onUnmounted, reactive, toRefs } from "vue"; import { ref, onMounted, onUnmounted, reactive, toRefs } from "vue";
import img from "@/assets/images/collectionStory/Rectangle.png"; import img from "@/assets/images/example.png";
import coreConcept from "./coreConcept.vue"; import coreConcept from "./coreConcept.vue";
import inspiration from "./inspiration.vue"; import inspiration from "./inspiration.vue";
import feelingWithAiDA from "./feelingWithAiDA.vue"; import feelingWithAiDA from "./feelingWithAiDA.vue";
@@ -14,19 +14,11 @@ const emit = defineEmits([
let data = reactive({ let data = reactive({
}) })
const list = ref([ const list = ref([
{ // {
url: img, // url: img,
title: "Windswept Burden", // title: "Item sold here",
price: "$100.00", // price: "$?",
},{ // },
url: img,
title: "Windswept Burden",
price: "$100.00",
},{
url: img,
title: "Windswept Burden",
price: "$100.00",
},
]) ])
const addShopping = (item) => { const addShopping = (item) => {
emit('addShopping', item) emit('addShopping', item)
@@ -47,9 +39,9 @@ const {} = toRefs(data);
<div class="left"> <div class="left">
<div class="personal"> <div class="personal">
<img src="@/assets/images/collectionStory/code-create.png" alt=""> <img src="@/assets/images/collectionStory/code-create.png" alt="">
<div class="name"> <div class="name" @click="openCodeCreate">
<span>Code-Create</span> <span>Code-Create</span>
<div class="icon" @click="openCodeCreate"> <div class="icon">
<SvgIcon name="share" size="24" /> <SvgIcon name="share" size="24" />
</div> </div>
</div> </div>
@@ -100,8 +92,8 @@ const {} = toRefs(data);
display: flex; display: flex;
gap: .4rem; gap: .4rem;
align-items: center; align-items: center;
> .icon{
cursor: pointer; cursor: pointer;
> .icon{
} }
> span{ > span{
font-family: 'KaiseiOpti-Bold'; font-family: 'KaiseiOpti-Bold';

View File

@@ -22,10 +22,10 @@ const {} = toRefs(data);
<div class="collectionStory"> <div class="collectionStory">
<div class="first-screen"> <div class="first-screen">
<img class="banner" src="@/assets/images/collectionStory/collection_story_banner.png" alt=""> <img class="banner" src="@/assets/images/collectionStory/collection_story_banner.png" alt="">
<div class="back"> <!-- <div class="back">
<SvgIcon name="collectionStory-back" size="20" /> <SvgIcon name="collectionStory-back" size="20" />
<div class="text">{{ $t('collectionStory.back') }}</div> <div class="text">{{ $t('collectionStory.back') }}</div>
</div> </div> -->
<div class="title-content"> <div class="title-content">
<div class="title-box"> <div class="title-box">
<div class="title"> <div class="title">
@@ -59,6 +59,7 @@ const {} = toRefs(data);
height: auto; height: auto;
display: flex; display: flex;
overflow: hidden; overflow: hidden;
align-items: center;
> .back{ > .back{
position: absolute; position: absolute;
top: 2.4rem; top: 2.4rem;
@@ -78,7 +79,7 @@ const {} = toRefs(data);
width: 100%; width: 100%;
position: absolute; position: absolute;
padding: 0 6.7rem; padding: 0 6.7rem;
margin-top: 11.5rem; // margin-top: 11.5rem;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: flex-start; align-items: flex-start;
@@ -87,7 +88,7 @@ const {} = toRefs(data);
flex-direction: column; flex-direction: column;
> .title{ > .title{
font-size: 6.5rem; font-size: 6.5rem;
line-height: 100%; line-height: 1.3;
font-weight: 500; font-weight: 500;
color: #585858; color: #585858;
} }

View File

@@ -177,12 +177,13 @@ defineExpose({})
--el-border-radius-base: 0; --el-border-radius-base: 0;
--el-select-input-color: rgba(0, 0, 0, 0.5); --el-select-input-color: rgba(0, 0, 0, 0.5);
--el-select-input-font-size: 1rem; --el-select-input-font-size: 1rem;
--el-border-color: #222222;
.el-select__wrapper { .el-select__wrapper {
font-size: 1.07rem; font-size: 1.07rem;
padding: 0 0.7rem; padding: 0 0.7rem;
line-height: 1; line-height: 1;
min-height: 0; min-height: 0;
height: 2.2rem; height: 2.8rem;
.header-label { .header-label {
font-family: KaiseiOpti-Regular; font-family: KaiseiOpti-Regular;

View File

@@ -20,6 +20,7 @@ const categories = ref(['all'])
const gender = ref(['all']) const gender = ref(['all'])
const clearFilters = () => { const clearFilters = () => {
if(categories.value?.[0] == 'all' && gender.value?.[0] == 'all')return
categories.value = ['all'] categories.value = ['all']
gender.value = ['all'] gender.value = ['all']
handleChange() handleChange()