This commit is contained in:
李志鹏
2026-05-21 11:36:15 +08:00
6 changed files with 235 additions and 94 deletions

35
src/api/brand.ts Normal file
View File

@@ -0,0 +1,35 @@
import request from '@/utils/request'
/**
* 获取店铺列表
* @param data 获取店铺列表的参数
* @param data.keyword 模糊查询店铺
* @returns 获取店铺列表
*/
export interface designerListData {
keyword: string
}
export const getDesignerList = (data:designerListData,loading?:boolean) => {
return request({
url: '/buyer/designer/search',
method: 'get',
params: data,
loading
})
}
/**
* 获取店铺详情
* @param data 获取店铺详情的参数
* @param data.sellerId 店铺 id
* @returns 获取店铺详情
*/
export interface designerDetailData {
sellerId?: string
}
export const getDesignerDetail = (data:designerDetailData,loading?:boolean) => {
return request({
url: `/buyer/designer/shop/${data.sellerId}`,
method: 'get',
loading
})
}

70
src/api/listing.ts Normal file
View File

@@ -0,0 +1,70 @@
import request from '@/utils/request'
/**
* 获取店铺商品列表
* @param data 获取店铺商品列表的参数
* @param data.sellerId 店铺id
* @param data.designFor 查询类型 female/male/all
* @param data.pageNum 页码
* @param data.pageSize 页面大小
* @returns 获取店铺商品列表
*/
export interface listingListData {
sellerId?: string
designFor?: string
pageNum?: number
pageSize?: number
}
export const getlistingList = (data:listingListData,loading?:boolean) => {
return request({
url: '/buyer/listing/shop/seller',
method: 'get',
params: data,
loading
})
}
/**
* 获取商品详情
* @param data 获取商品详情的参数
* @param data.id 商品 id
* @returns 获取商品详情
*/
export interface listingDetailData {
id?: string
}
export const getListingDetail = (data:listingDetailData,loading?:boolean) => {
return request({
url: `/buyer/listing/mall/detail`,
method: 'get',
params: data,
loading
})
}
/**
* 获取资产数字商品列表
* @param data 获取资产数字商品列表的参数
* @param data.designFor 查询类型 female/male/all
* @param data.categories 商品分类
* @param data.sortField 排序字段 price/salesVolume/updateTime/viewCount/createTime默认 updateTime
* @param data.sortOrder 排序顺序asc/desc默认 desc
* @param data.pageNum 页码
* @param data.pageSize 页面大小
* @returns 获取资产数字商品列表
*/
export interface listingMallData {
designFor: string,
categories: string[],
sortField: string,
sortOrder: string,
pageNum: number,
pageSize: number
}
export const getListingMallList = (data:listingMallData,loading?:boolean) => {
return request({
url: `/buyer/listing/mall`,
method: 'post',
data,
loading
})
}

View File

@@ -25,25 +25,25 @@ const {} = toRefs(data);
<div class="item">
<div class="left">
<div class="portrait">
<img :src="item.portrait" alt="">
<img :src="item.avatar" alt="">
</div>
<div class="info">
<div class="name">{{ item.name }}</div>
<div class="name">{{ item.shopName }}</div>
<div class="collection">
{{ item.collectionsName }} |
{{ item?.collections?.length || 0 }} Collections
{{ item.ownerName }} |
{{ item?.listingTotal || 0 }} Collections
</div>
<div class="view-profile" @click="viewProfile(item)">View Profile</div>
</div>
</div>
<div class="right">
<div class="img-list">
<div class="img-item" v-for="itemImg in item?.collections?.slice(0,5)" :key="item.id">
<div class="img-item" v-for="itemImg in item?.covers" :key="itemImg">
<img :src="itemImg" alt="">
</div>
</div>
<div class="more">
<div class="icon" v-show="item?.collections?.length > 5">
<div class="icon" v-show="item?.covers?.length == 5">
<svgIcon name="brand-more" size="24" />
</div>
</div>

View File

@@ -4,6 +4,8 @@ import { useRouter } from "vue-router";
import myEvent from '@/utils/myEvent'
import scListNull from '@/views/shoppingCart/sc-list-null.vue'
import brandItem from '@/views/brand/brand-item.vue'
import { getDesignerList } from '@/api/brand'
import img from '@/assets/images/collectionStory/Rectangle.png'
//const props = defineProps({
@@ -23,87 +25,89 @@ const getMerchantData = reactive({
isShowMark:false,
isNoData:false,
})
const list = ref([
' 1',
'Brand 2',
'Brand 3',
'1213123 4',
'Brand 4',
'2222 4',
'B23rand 4',
'Bran112222d 4',
' 4',
const searchHistory = ref([
])
let changeSearchBrandTime = null
const changeSearchBrand = () => {
clearTimeout(changeSearchBrandTime)
changeSearchBrandTime = setTimeout(()=>{
getMerchantData.pageNum = 1
getDesignerList({
keyword: searchBrand.value,
}).then((res)=>{
merchantList.value = []
getMerchantData.isShowMark = false
getMerchantData.isNoData = false
},300)
merchantList.value.push(...res)
})
// changeSearchBrandTime = setTimeout(()=>{
// getMerchantData.pageNum = 1
// getMerchantData.isShowMark = false
// getMerchantData.isNoData = false
// },300)
}
const getBrandList = async () => {
if(getMerchantData.isShowMark && !getMerchantData.isNoData)return
getMerchantData.isShowMark = true
let value = {
pageSize: getMerchantData.pageSize,
pageNum: getMerchantData.pageNum,
status: 1,
}
setTimeout(()=>{
if(merchantList.value.length >= 5){
getMerchantData.isNoData = true
merchantList.value = []
return
}
getMerchantData.pageNum += 1
merchantList.value.push({
name:'Roaming Clouds',
portrait: img,
collectionsName:'by Lian Su ',
collections:[
img,img,img,
],
})
getMerchantData.isShowMark = false
},1000)
// await getPublishList(value).then((res)=>{
// if(res.content.length == 0)getMerchantData.isNoData = true
// const getBrandList = async () => {
// if(getMerchantData.isShowMark && !getMerchantData.isNoData)return
// getMerchantData.isShowMark = true
// let value = {
// pageSize: getMerchantData.pageSize,
// pageNum: getMerchantData.pageNum,
// status: 1,
// }
// setTimeout(()=>{
// if(merchantList.value.length >= 5){
// getMerchantData.isNoData = true
// merchantList.value = []
// return
// }
// getMerchantData.pageNum += 1
// list.value.push(...res.content)
// merchantList.value.push({
// name:'Roaming Clouds',
// portrait: img,
// collectionsName:'by Lian Su ',
// collections:[
// img,img,img,
// ],
// })
}
const vObserve = {
mounted (el,binding) {
getMerchantData.isShowMark = false
getMerchantData.isNoData = false
new IntersectionObserver(
(entries, observer) => {
// 如果不是相交,则直接返回
// console.log(entries[0]);
if (!entries[0].intersectionRatio) return;
getMerchantData.pageNum += 1
binding.value()
},
// { root:worksPage }
).observe(el);
}
}
// getMerchantData.isShowMark = false
// },1000)
// // await getPublishList(value).then((res)=>{
// // if(res.content.length == 0)getMerchantData.isNoData = true
// // getMerchantData.pageNum += 1
// // list.value.push(...res.content)
// // })
// }
// const vObserve = {
// mounted (el,binding) {
// getMerchantData.isShowMark = false
// getMerchantData.isNoData = false
// new IntersectionObserver(
// (entries, observer) => {
// // 如果不是相交,则直接返回
// // console.log(entries[0]);
// if (!entries[0].intersectionRatio) return;
// getMerchantData.pageNum += 1
// binding.value()
// },
// // { root:worksPage }
// ).observe(el);
// }
// }
const deleteHistory = (item) => {
list.value = list.value.filter((i) => i != item)
searchHistory.value = searchHistory.value.filter((i) => i != item)
localStorage.setItem('brandSearchHistory', JSON.stringify(searchHistory.value));
}
const viewProfile = (item) => {
if(!searchHistory.value.includes(searchBrand.value))searchHistory.value.push(searchBrand.value)
localStorage.setItem('brandSearchHistory', JSON.stringify(searchHistory.value));
router.push({
path:'/brand/1',
path:'/brand/'+item.sellerId,
})
}
onMounted(()=>{
const value = localStorage.getItem('brandSearchHistory');
if(value)searchHistory.value = JSON.parse(value)
})
onUnmounted(()=>{
})
@@ -129,10 +133,10 @@ const {} = toRefs(data);
<div class="merchantList" v-if="searchBrand.length > 0">
<brand-item v-for="item in merchantList" :key="item.name" :item="item" @viewProfile="viewProfile"></brand-item>
<div class="end" v-show="!getMerchantData.isNoData && !getMerchantData.isShowMark">- The End-</div>
<div v-show="!getMerchantData.isNoData" class="material_content_list_loding">
<!-- <div v-show="!getMerchantData.isNoData" class="material_content_list_loding">
<span class="page_loading" v-show="!getMerchantData.isShowMark" v-observe="getBrandList"></span>
<img v-if="getMerchantData.isShowMark" src="@/assets/images/brand/brandLoading.gif" alt="">
</div>
</div> -->
<div class="merchantListNull" v-if="getMerchantData.isNoData && searchBrand.length > 0">
<sc-list-null
@@ -151,7 +155,7 @@ const {} = toRefs(data);
<span>Searching History</span>
</div>
<div class="history">
<div v-for="item in list" :key="item" @click.stop="searchBrand = item" class="item">
<div v-for="item in searchHistory" :key="item" @click.stop="searchBrand = item" class="item">
<span>{{item}}</span>
<div class="icon" @click.stop="deleteHistory(item)">
<SvgIcon name="brand-delete" size="18" />

View File

@@ -2,36 +2,57 @@
import { ref, onMounted, onUnmounted, reactive, toRefs } from "vue";
import CommodityList from "./commodity-list.vue";
import MerchantInfo from "./merchant-info.vue";
import { useRouter } from "vue-router";
import { useRouter, useRoute } from "vue-router";
import myEvent from '@/utils/myEvent'
import { getDesignerDetail } from '@/api/brand'
//const props = defineProps({
//})
//const emit = defineEmits([
//])
const router = useRouter()
let data = reactive({
const route = useRoute()
const designerDetail = ref({
avatar: '',
brandBanner: '',
description: '',
email: '',
mobile: '',
ownerName: '',
shopName: '',
socialLinks: '[]',
})
const addShopping = (item) => {
myEvent.emit('addShopping', item)
}
const openDetail = (item) => {
router.push({name: 'digitalDetail', params: {id: item.id}})
}
const getDetail = ()=>{
let data = {
sellerId: route.params.id,
}
getDesignerDetail(data,true).then((res)=>{
designerDetail.value = res
})
}
onMounted(()=>{
getDetail()
})
onUnmounted(()=>{
})
defineExpose({})
const {} = toRefs(data);
</script>
<template>
<div class="brand">
<div class="header-img">
<img src="@/assets/images/brand/brandDetailBg.png" alt="">
<img :src="designerDetail.brandBanner || '@/assets/images/brand/brandDetailBg.png'" alt="">
</div>
<div class="content">
<div class="merchant-info">
<MerchantInfo></MerchantInfo>
<MerchantInfo :designerDetail="designerDetail"></MerchantInfo>
</div>
<div class="commodity-list">
<CommodityList @addShopping="addShopping" @openDetail="openDetail"></CommodityList>

View File

@@ -1,7 +1,22 @@
<script setup lang="ts">
import { ref, onMounted, onUnmounted, reactive, toRefs } from "vue";
//const props = defineProps({
//})
const props = defineProps({
designerDetail: {
type: Object,
default: () => {
return {
avatar: '',
brandBanner: '',
description: '',
email: '',
mobile: '',
ownerName: '',
shopName: '',
socialLinks: '[]',
}
},
},
})
//const emit = defineEmits([
//])
let data = reactive({
@@ -16,12 +31,12 @@ const {} = toRefs(data);
<template>
<div class="merchantInfo">
<div class="profile">
<img src="@/assets/images/collectionStory/Rectangle.png" alt="">
<img :src="designerDetail.avatar || '@/assets/images/collectionStory/Rectangle.png'" alt="">
</div>
<div class="info">
<div class="detail">
<div class="name">Lian Su</div>
<div class="title">Roaming Clouds</div>
<div class="name">{{ designerDetail.ownerName }}</div>
<div class="title">{{ designerDetail.shopName }}</div>
</div>
<div class="contact">
<div class="title">Contact</div>
@@ -29,30 +44,26 @@ const {} = toRefs(data);
<div class="icon">
<svg-icon name="brand-email" size="24" />
</div>
<div>lian.su@urieworweoo.com</div>
<div>{{ designerDetail.email }}</div>
</div>
<div class="phone label">
<div class="icon">
<svg-icon name="brand-call" size="24" />
</div>
<div>+86 139 4829 7710</div>
<div>{{ designerDetail.mobile }}</div>
</div>
<div class="address label">
<div class="address label" v-for="value in JSON.parse(designerDetail.socialLinks)">
<div class="icon">
<svg-icon name="brand-link" size="24" />
</div>
<div>746312432</div>
</div>
<div class="website label">
<div class="icon">
<svg-icon name="brand-link" size="24" />
</div>
<div>https://urieworweoo.com</div>
<div>{{value}}</div>
</div>
</div>
<div class="about">
<div class="title">About</div>
<div class="content">Lian Sus work weaves understated ethnic influences into contemporary minimalism. She explores materials and silhouettes that bridge heritage and modern sensibilities. Her designs reflect a quiet dialogue between cultural memory and forward-looking innovation.</div>
<div class="content">
{{ designerDetail.description }}
</div>
</div>
</div>
</div>