2025-10-16
商城主页 商城分类 我的 商品详情40%
This commit is contained in:
@@ -2,8 +2,12 @@ import {
|
||||
http
|
||||
} from "../util/api";
|
||||
|
||||
const baseUrl = "http://192.168.0.26:3000"
|
||||
|
||||
export const mallAPI = {
|
||||
getMallList: (params) => http.get('/mall', params)
|
||||
getMallList: (params) => http.get(baseUrl + '/api/products', params),
|
||||
getCategory: () => http.get(baseUrl + '/api/category'),
|
||||
getMallDetail: (id) => http.get(baseUrl + '/products/' + id)
|
||||
}
|
||||
|
||||
export default {
|
||||
|
||||
@@ -2,7 +2,8 @@ import {
|
||||
http
|
||||
} from "../util/api"
|
||||
|
||||
const baseURL = "http://192.168.0.12:3005/chat"
|
||||
// const baseURL = "http://192.168.0.12:3005/chat"
|
||||
const baseURL = "http://192.168.0.15:3007"
|
||||
|
||||
// 项目相关API
|
||||
export const messageAPI = {
|
||||
|
||||
40
pages.json
40
pages.json
@@ -58,41 +58,51 @@
|
||||
}
|
||||
},
|
||||
{
|
||||
"path" : "pages/mall/mall",
|
||||
"style" :
|
||||
{
|
||||
"navigationBarTitleText" : "商城",
|
||||
"path": "pages/mall/mall",
|
||||
"style": {
|
||||
"navigationBarTitleText": "商城",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path" : "pages/message/chat",
|
||||
"style" :
|
||||
{
|
||||
"navigationBarTitleText" : "聊天页面",
|
||||
"path": "pages/message/chat",
|
||||
"style": {
|
||||
"navigationBarTitleText": "聊天页面",
|
||||
"navigationStyle": "custom",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path" : "pages/message/systemMessage",
|
||||
"style" :
|
||||
{
|
||||
"navigationBarTitleText" : "系统通知",
|
||||
"path": "pages/message/systemMessage",
|
||||
"style": {
|
||||
"navigationBarTitleText": "系统通知",
|
||||
"navigationBarBackgroundColor": "#F0F3FF",
|
||||
"navigationBarTextStyle": "#000",
|
||||
"app-plus": {
|
||||
"titleNView": {
|
||||
"buttons": [
|
||||
{
|
||||
"buttons": [{
|
||||
"type": "menu",
|
||||
"color": "#000"
|
||||
}
|
||||
|
||||
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/home/mallDetail",
|
||||
"style": {
|
||||
"navigationBarTitleText": "商品详情",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/home/mallCategory",
|
||||
"style": {
|
||||
"navigationBarTitleText": "商品分类",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}
|
||||
],
|
||||
"globalStyle": {
|
||||
|
||||
@@ -1,174 +1,339 @@
|
||||
<template>
|
||||
<view class="message-container">
|
||||
<!-- 固定背景的容器 -->
|
||||
<view class="background-container"></view>
|
||||
|
||||
<!-- 可滚动的内容区域 -->
|
||||
<view class="content-container" :style="'height:'+height+'px'">
|
||||
|
||||
<u-swiper class="u-m-t-60" :list="list" name="url" height="324"></u-swiper>
|
||||
<scroll-view scroll-y="true" style="height: 100%;">
|
||||
<view class="header-search">
|
||||
<u-search :action-style="searchBtn" shape="square" bg-color="#CADBFF" placeholder="输入商品名称或商品种类"
|
||||
v-model="keyword"></u-search>
|
||||
</view>
|
||||
|
||||
<view class="menu-list">
|
||||
<swiper class="swiper" @change="changeMenu">
|
||||
<swiper-item>
|
||||
<u-grid :col="4" :border="false">
|
||||
<u-grid-item bg-color="transparent">
|
||||
<u-icon name="/static/home/1.png" :size="120"></u-icon>
|
||||
<view class="grid-text">精选直播</view>
|
||||
</u-grid-item>
|
||||
<u-grid-item bg-color="transparent">
|
||||
<u-icon name="/static/home/2.png" :size="120"></u-icon>
|
||||
<view class="grid-text">订单数据</view>
|
||||
</u-grid-item>
|
||||
<u-grid-item bg-color="transparent" @click="openMall">
|
||||
<u-icon name="/static/home/3.png" :size="120"></u-icon>
|
||||
<view class="grid-text">商城好物</view>
|
||||
</u-grid-item>
|
||||
<u-grid-item bg-color="transparent">
|
||||
<u-icon name="/static/home/4.png" :size="120"></u-icon>
|
||||
<view class="grid-text">获得积分</view>
|
||||
</u-grid-item>
|
||||
</u-grid>
|
||||
</swiper-item>
|
||||
<swiper-item>
|
||||
<u-grid :col="4" :border="false">
|
||||
<u-grid-item bg-color="transparent">
|
||||
<u-icon name="/static/home/5.png" :size="120"></u-icon>
|
||||
<view class="grid-text">微信读书</view>
|
||||
</u-grid-item>
|
||||
</u-grid>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
|
||||
<view class="indicator-dots">
|
||||
<view class="indicator-dots-item" :class="current==0?'indicator-dots-active':''">
|
||||
<view class="menu-item" @click="handleCategory">
|
||||
<u-image src="/static/shop/01.png" :width="iconWidth" mode="widthFix"></u-image>
|
||||
<view class="menu-text">
|
||||
商品分类
|
||||
</view>
|
||||
<view class="indicator-dots-item" :class="current==1?'indicator-dots-active':''">
|
||||
</view>
|
||||
<view class="menu-item">
|
||||
<u-image src="/static/shop/02.png" :width="iconWidth" mode="widthFix"></u-image>
|
||||
<view class="menu-text">
|
||||
观看直播
|
||||
</view>
|
||||
</view>
|
||||
<view class="menu-item">
|
||||
<u-image src="/static/shop/03.png" :width="iconWidth" mode="widthFix"></u-image>
|
||||
<view class="menu-text">
|
||||
违规通告
|
||||
</view>
|
||||
</view>
|
||||
<view class="menu-item">
|
||||
<u-image src="/static/shop/04.png" :width="iconWidth" mode="widthFix"></u-image>
|
||||
<view class="menu-text">
|
||||
百亿补贴
|
||||
</view>
|
||||
</view>
|
||||
<view class="menu-item">
|
||||
<u-image src="/static/shop/05.png" :width="iconWidth" mode="widthFix"></u-image>
|
||||
<view class="menu-text">
|
||||
限时秒杀
|
||||
</view>
|
||||
</view>
|
||||
<view class="menu-item">
|
||||
<u-image src="/static/shop/06.png" :width="iconWidth" mode="widthFix"></u-image>
|
||||
<view class="menu-text">
|
||||
会员专区
|
||||
</view>
|
||||
</view>
|
||||
<view class="menu-item">
|
||||
<u-image src="/static/shop/07.png" :width="iconWidth" mode="widthFix"></u-image>
|
||||
<view class="menu-text">
|
||||
商品收藏
|
||||
</view>
|
||||
</view>
|
||||
<view class="menu-item">
|
||||
<u-image src="/static/shop/08.png" :width="iconWidth" mode="widthFix"></u-image>
|
||||
<view class="menu-text">
|
||||
充值缴费
|
||||
</view>
|
||||
</view>
|
||||
<view class="menu-item">
|
||||
<u-image src="/static/shop/09.png" :width="iconWidth" mode="widthFix"></u-image>
|
||||
<view class="menu-text">
|
||||
资质认证
|
||||
</view>
|
||||
</view>
|
||||
<view class="menu-item">
|
||||
<u-image src="/static/shop/10.png" :width="iconWidth" mode="widthFix"></u-image>
|
||||
<view class="menu-text">
|
||||
联系客服
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<Tabbar id="tabbarId"></Tabbar>
|
||||
|
||||
<view class="mall-list">
|
||||
<u-waterfall v-model="mallList" ref="mallListRef">
|
||||
<template v-slot:left="{leftList}">
|
||||
<view class="mall-item u-m-r-10" v-for="(item, index) in leftList" :key="index"
|
||||
@click="handleCheck(item)">
|
||||
<u-lazy-load threshold="-450" border-radius="10" :image="getImageUrl(item.image)"
|
||||
:index="index"></u-lazy-load>
|
||||
<view class="mall-title u-m-l-5 u-m-r-5">
|
||||
{{item.name}}
|
||||
</view>
|
||||
<del class="u-m-l-5 u-m-r-5" style="white-space: nowrap;">￥{{item.price}}</del>
|
||||
<view class="mall-price u-m-l-5 u-m-r-5" v-if="RDType(item.payment_methods)">
|
||||
<image src="/static/icon/rongdou.png" class="icon" mode=""></image>
|
||||
{{item.rongdou_price}}
|
||||
</view>
|
||||
<view class="mall-price u-m-l-5 u-m-r-5" v-if="pointsType(item.payment_methods)">
|
||||
<u-icon name="integral"></u-icon>
|
||||
{{item.points_price}}
|
||||
</view>
|
||||
<view class="mall-tag u-m-l-5 u-m-r-5">
|
||||
<view class="mall-tag-text" v-if="RDType(item.payment_methods)">
|
||||
融豆
|
||||
</view>
|
||||
<view class="mall-tag-owner" v-if="pointsType(item.payment_methods)">
|
||||
积分
|
||||
</view>
|
||||
</view>
|
||||
<view class="mall-shop u-m-l-5 u-m-r-5">
|
||||
{{item.category}}
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<template v-slot:right="{rightList}">
|
||||
<view class="mall-item u-m-l-10" v-for="(item, index) in rightList" :key="index"
|
||||
@click="handleCheck(item)">
|
||||
<u-lazy-load threshold="-450" border-radius="10" :image="getImageUrl(item.image)"
|
||||
:index="index"></u-lazy-load>
|
||||
<view class="mall-title u-m-l-5 u-m-r-5">
|
||||
{{item.name}}
|
||||
</view>
|
||||
<del class="u-m-l-5 u-m-r-5" style="white-space: nowrap;">￥{{item.price}}</del>
|
||||
<view class="mall-price u-m-l-5 u-m-r-5" v-if="RDType(item.payment_methods)">
|
||||
<image src="/static/icon/rongdou.png" class="icon" mode=""></image>
|
||||
{{item.rongdou_price}}
|
||||
</view>
|
||||
<view class="mall-price u-m-l-5 u-m-r-5" v-if="pointsType(item.payment_methods)">
|
||||
<u-icon name="integral"></u-icon>
|
||||
{{item.points_price}}
|
||||
</view>
|
||||
<view class="mall-tag u-m-l-5 u-m-r-5">
|
||||
<view class="mall-tag-text" v-if="RDType(item.payment_methods)">
|
||||
融豆
|
||||
</view>
|
||||
<view class="mall-tag-owner" v-if="pointsType(item.payment_methods)">
|
||||
积分
|
||||
</view>
|
||||
</view>
|
||||
<view class="mall-shop u-m-l-5 u-m-r-5">
|
||||
{{item.category}}
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</u-waterfall>
|
||||
<u-loadmore margin-top="20" :status="loadStatus"></u-loadmore>
|
||||
</view>
|
||||
|
||||
<view class="box-div"></view>
|
||||
|
||||
</scroll-view>
|
||||
</view>
|
||||
<Tabbar id="tabbarId"></Tabbar>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, computed, getCurrentInstance } from 'vue';
|
||||
import {
|
||||
onReady
|
||||
} from '@dcloudio/uni-app';
|
||||
import { onReady as onUniReady } from '@dcloudio/uni-app';
|
||||
const instance = getCurrentInstance();
|
||||
ref, onMounted
|
||||
} from 'vue';
|
||||
import { mallAPI } from '../../api/mall';
|
||||
import { getImageUrl } from '../../util/common';
|
||||
|
||||
const height = ref(0)
|
||||
const keyword = ref('')
|
||||
const searchBtn = {
|
||||
background: 'linear-gradient(100.84deg, #7B99FF 0%, #002CC2 99.52%)',
|
||||
width: '128rpx',
|
||||
borderRadius: '198rpx',
|
||||
color: '#fff',
|
||||
fontSize: '28rpx',
|
||||
boxShadow: '0px 4px 4px 0px #FFFFFF40 inset',
|
||||
}
|
||||
const iconWidth = "65%"
|
||||
|
||||
const loadHeight = () => {
|
||||
uni.getSystemInfo({
|
||||
success(res) {
|
||||
let screenHeight = res.screenHeight
|
||||
uni.createSelectorQuery().in(instance.proxy).select("#tabbarId").boundingClientRect((data : any) => {
|
||||
height.value = screenHeight - data.height
|
||||
}).exec()
|
||||
const handleCategory = () => {
|
||||
uni.navigateTo({
|
||||
url: '/pages/home/mallCategory'
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
const params = ref({
|
||||
keyword: '',
|
||||
page: 1,
|
||||
limit: 5,
|
||||
category: ''
|
||||
})
|
||||
const mallList = ref([])
|
||||
const mallListRef = ref()
|
||||
const loadStatus = ref('loadmore') // nomore
|
||||
const maxPage = ref(1)
|
||||
|
||||
// 积分兑换
|
||||
const pointsType = (val : any) => {
|
||||
if (val && val.indexOf("points") >= 0) return true
|
||||
return false
|
||||
}
|
||||
// 融豆兑换
|
||||
const RDType = (val : any) => {
|
||||
if (val && val.indexOf("rongdou") >= 0) return true
|
||||
return false
|
||||
}
|
||||
|
||||
// 加载数据
|
||||
const loadMallData = () => {
|
||||
if (loadStatus.value == 'nomore') return
|
||||
mallAPI.getMallList(params.value).then((res) => {
|
||||
console.log(res.data);
|
||||
mallList.value = mallList.value.concat(res.data.products)
|
||||
maxPage.value = res.data.pagination.pages
|
||||
params.value.page++
|
||||
if (maxPage.value < params.value.page) {
|
||||
loadStatus.value = 'nomore'
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const list = [
|
||||
{ url: '/static/banner/1.png' },
|
||||
{ url: '/static/banner/2.png' },
|
||||
{ url: '/static/banner/3.png' },
|
||||
]
|
||||
|
||||
const current = ref(0)
|
||||
const changeMenu = (val : any) => {
|
||||
current.value = val.detail.current
|
||||
}
|
||||
|
||||
const openMall = () => {
|
||||
const handleCheck = (item : any) => {
|
||||
uni.navigateTo({
|
||||
url: '/pages/mall/mall'
|
||||
url: '/pages/home/mallDetail?id=' + item.id
|
||||
})
|
||||
}
|
||||
|
||||
onUniReady(() => {
|
||||
loadHeight()
|
||||
onMounted(() => {
|
||||
loadMallData()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.message-container {
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
/* 防止容器本身滚动 */
|
||||
height: 100vh;
|
||||
padding: 60rpx 20rpx;
|
||||
background: #79AFFF;
|
||||
|
||||
/* 固定背景 */
|
||||
.background-container {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: linear-gradient(180deg, #2F75F9 0%, #F0F3FF 34.13%);
|
||||
z-index: 1;
|
||||
/* 确保背景在内容下方 */
|
||||
.header-search {
|
||||
.search-btn {
|
||||
;
|
||||
box-shadow: 0px -4px 4px 0px #00000040 inset;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
/* 内容滚动区域 */
|
||||
.content-container {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
/* 确保内容在背景上方 */
|
||||
width: 100%;
|
||||
overflow-y: scroll;
|
||||
height: 100%;
|
||||
// padding: 32rpx;
|
||||
.menu-list {
|
||||
background: #FFFFFF80;
|
||||
margin-top: 32rpx;
|
||||
padding: 20rpx 0 0 0;
|
||||
border-radius: 20rpx;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.menu-list {
|
||||
border-top-left-radius: 32rpx;
|
||||
border-top-right-radius: 32rpx;
|
||||
box-shadow: 0rpx -8rpx 20rpx 0rpx #628AC080;
|
||||
padding-bottom: 20rpx;
|
||||
.menu-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
width: 20%;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.swiper {
|
||||
height: 200rpx;
|
||||
.menu-text {
|
||||
font-family: Work Sans;
|
||||
font-weight: 400;
|
||||
font-style: Regular;
|
||||
font-size: 24rpx;
|
||||
leading-trim: NONE;
|
||||
line-height: 100%;
|
||||
letter-spacing: -2%;
|
||||
color: #2B2B2B;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.grid-text {
|
||||
font-family: Work Sans;
|
||||
font-weight: 400;
|
||||
font-style: Regular;
|
||||
font-size: 28rpx;
|
||||
leading-trim: NONE;
|
||||
line-height: 32rpx;
|
||||
letter-spacing: -2%;
|
||||
text-align: center;
|
||||
|
||||
// 商城列表
|
||||
.mall-list {
|
||||
margin-top: 20rpx;
|
||||
|
||||
.mall-item {
|
||||
border-radius: 16rpx;
|
||||
background: #F0F5FF;
|
||||
position: relative;
|
||||
margin-top: 20rpx;
|
||||
box-shadow: 0px 4px 4px 0px #00000040;
|
||||
padding-bottom: 10rpx;
|
||||
|
||||
.mall-title {
|
||||
font-size: 30rpx;
|
||||
margin-top: 10rpx;
|
||||
color: $u-main-color;
|
||||
}
|
||||
|
||||
.mall-price {
|
||||
font-size: 30rpx;
|
||||
color: $u-type-error;
|
||||
margin-top: 10rpx;
|
||||
|
||||
.icon {
|
||||
height: 30rpx;
|
||||
width: 30rpx;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.indicator-dots {
|
||||
// margin-top: 40rpx;
|
||||
|
||||
.mall-tag {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-top: 5px;
|
||||
|
||||
.mall-tag-owner {
|
||||
background-color: $u-type-error;
|
||||
color: #FFFFFF;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 4rpx 14rpx;
|
||||
border-radius: 50rpx;
|
||||
font-size: 20rpx;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.mall-tag-text {
|
||||
margin-right: 10px;
|
||||
border: 1px solid $u-type-primary;
|
||||
color: $u-type-primary;
|
||||
border-radius: 50rpx;
|
||||
line-height: 1;
|
||||
padding: 4rpx 14rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-radius: 50rpx;
|
||||
font-size: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.indicator-dots-item {
|
||||
background-color: $u-tips-color;
|
||||
height: 6px;
|
||||
width: 6px;
|
||||
border-radius: 10px;
|
||||
margin: 0 3px;
|
||||
|
||||
|
||||
.mall-shop {
|
||||
font-size: 22rpx;
|
||||
color: $u-tips-color;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.indicator-dots-active {
|
||||
background-color: $u-type-primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.box-div {
|
||||
padding: 30rpx 0rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
319
pages/home/mallCategory.vue
Normal file
319
pages/home/mallCategory.vue
Normal file
@@ -0,0 +1,319 @@
|
||||
<template>
|
||||
<view class="category-container">
|
||||
<u-navbar id="uNavbarId" title="商品详情" :background="{background: 'transparent' }" :border-bottom="false"
|
||||
back-icon-color="#000" title-color="#000">
|
||||
<template v-slot:right>
|
||||
<image class="collection" src="/static/icon/Settings.png" mode=""></image>
|
||||
</template>
|
||||
</u-navbar>
|
||||
<scroll-view scroll-y="true" :style="'height:'+scrollHeight+'px'">
|
||||
<view class="scroll-view">
|
||||
<view class="menu-level1">
|
||||
<view class="text" :class="{'active': currentCate==index}" v-for="(item, index) in categoryList"
|
||||
@click="handleChangeCategory(index)">
|
||||
{{item.name}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="menu-level2" v-if="categoryList[currentCate]?.relative.length!=0">
|
||||
<view class="menu-item" v-for="item in categoryList[currentCate]?.relative">
|
||||
<u-image v-if="item.img" :fade="false" :src="getImageUrl(item.img)" :width="iconWidth"
|
||||
mode="widthFix"></u-image>
|
||||
<view class="menu-text">
|
||||
{{item.name}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="mall-list">
|
||||
<u-waterfall v-model="mallList" ref="mallListRef">
|
||||
<template v-slot:left="{leftList}">
|
||||
<view class="mall-item u-m-r-10" v-for="(item, index) in leftList" :key="index"
|
||||
@click="handleCheck(item)">
|
||||
<u-lazy-load threshold="-450" border-radius="10" :image="getImageUrl(item.image)"
|
||||
:index="index"></u-lazy-load>
|
||||
<view class="mall-title u-m-l-5 u-m-r-5">
|
||||
{{item.name}}
|
||||
</view>
|
||||
<del class="u-m-l-5 u-m-r-5" style="white-space: nowrap;">￥{{item.price}}</del>
|
||||
<view class="mall-price u-m-l-5 u-m-r-5" v-if="RDType(item.payment_methods)">
|
||||
<image src="/static/icon/rongdou.png" class="icon" mode=""></image>
|
||||
{{item.rongdou_price}}
|
||||
</view>
|
||||
<view class="mall-price u-m-l-5 u-m-r-5" v-if="pointsType(item.payment_methods)">
|
||||
<u-icon name="integral"></u-icon>
|
||||
{{item.points_price}}
|
||||
</view>
|
||||
<view class="mall-tag u-m-l-5 u-m-r-5">
|
||||
<view class="mall-tag-text" v-if="RDType(item.payment_methods)">
|
||||
融豆
|
||||
</view>
|
||||
<view class="mall-tag-owner" v-if="pointsType(item.payment_methods)">
|
||||
积分
|
||||
</view>
|
||||
</view>
|
||||
<view class="mall-shop u-m-l-5 u-m-r-5">
|
||||
{{item.category}}
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<template v-slot:right="{rightList}">
|
||||
<view class="mall-item u-m-l-10" v-for="(item, index) in rightList" :key="index"
|
||||
@click="handleCheck(item)">
|
||||
<u-lazy-load threshold="-450" border-radius="10" :image="getImageUrl(item.image)"
|
||||
:index="index"></u-lazy-load>
|
||||
<view class="mall-title u-m-l-5 u-m-r-5">
|
||||
{{item.name}}
|
||||
</view>
|
||||
<del class="u-m-l-5 u-m-r-5" style="white-space: nowrap;">￥{{item.price}}</del>
|
||||
<view class="mall-price u-m-l-5 u-m-r-5" v-if="RDType(item.payment_methods)">
|
||||
<image src="/static/icon/rongdou.png" class="icon" mode=""></image>
|
||||
{{item.rongdou_price}}
|
||||
</view>
|
||||
<view class="mall-price u-m-l-5 u-m-r-5" v-if="pointsType(item.payment_methods)">
|
||||
<u-icon name="integral"></u-icon>
|
||||
{{item.points_price}}
|
||||
</view>
|
||||
<view class="mall-tag u-m-l-5 u-m-r-5">
|
||||
<view class="mall-tag-text" v-if="RDType(item.payment_methods)">
|
||||
融豆
|
||||
</view>
|
||||
<view class="mall-tag-owner" v-if="pointsType(item.payment_methods)">
|
||||
积分
|
||||
</view>
|
||||
</view>
|
||||
<view class="mall-shop u-m-l-5 u-m-r-5">
|
||||
{{item.category}}
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</u-waterfall>
|
||||
<u-loadmore margin-top="20" :status="loadStatus"></u-loadmore>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import {
|
||||
ref, onMounted, getCurrentInstance
|
||||
} from 'vue';
|
||||
import { mallAPI } from '../../api/mall';
|
||||
import { getImageUrl } from '../../util/common';
|
||||
|
||||
const instance = getCurrentInstance();
|
||||
|
||||
const currentCate = ref(0)
|
||||
const categoryList = ref([])
|
||||
const iconWidth = "65%"
|
||||
const loadCategory = () => {
|
||||
mallAPI.getCategory().then(res => {
|
||||
categoryList.value = res.data
|
||||
})
|
||||
}
|
||||
|
||||
const handleChangeCategory = (index) => {
|
||||
currentCate.value = index
|
||||
}
|
||||
|
||||
const params = ref({
|
||||
keyword: '',
|
||||
page: 1,
|
||||
limit: 5,
|
||||
category: ''
|
||||
})
|
||||
const mallList = ref([])
|
||||
const mallListRef = ref()
|
||||
const loadStatus = ref('loadmore') // nomore
|
||||
const maxPage = ref(1)
|
||||
|
||||
// 积分兑换
|
||||
const pointsType = (val : any) => {
|
||||
if (val && val.indexOf("points") >= 0) return true
|
||||
return false
|
||||
}
|
||||
// 融豆兑换
|
||||
const RDType = (val : any) => {
|
||||
if (val && val.indexOf("rongdou") >= 0) return true
|
||||
return false
|
||||
}
|
||||
|
||||
// 加载数据
|
||||
const loadMallData = () => {
|
||||
if (loadStatus.value == 'nomore') return
|
||||
mallAPI.getMallList(params.value).then((res) => {
|
||||
mallList.value = mallList.value.concat(res.data.products)
|
||||
maxPage.value = res.data.pagination.pages
|
||||
params.value.page++
|
||||
if (maxPage.value < params.value.page) {
|
||||
loadStatus.value = 'nomore'
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const handleCheck = (item : any) => {
|
||||
uni.navigateTo({
|
||||
url: '/pages/home/mallDetail?id=' + item.id
|
||||
})
|
||||
}
|
||||
|
||||
const scrollHeight = ref(0)
|
||||
const loadHeight = () => {
|
||||
uni.getSystemInfo({
|
||||
success(res) {
|
||||
let screenHeight = res.screenHeight
|
||||
uni.createSelectorQuery().in(instance.proxy).select("#uNavbarId").boundingClientRect((data : any) => {
|
||||
scrollHeight.value = screenHeight - data.height
|
||||
}).exec()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
loadHeight()
|
||||
loadCategory()
|
||||
loadMallData()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.category-container {
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
background: #B9D5FF;
|
||||
|
||||
.collection {
|
||||
width: 48rpx;
|
||||
height: 48rpx;
|
||||
margin-right: 24rpx;
|
||||
}
|
||||
|
||||
.scroll-view {
|
||||
.menu-level1 {
|
||||
display: flex;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
overflow-x: scroll;
|
||||
|
||||
leading-trim: NONE;
|
||||
line-height: 100%;
|
||||
letter-spacing: -2%;
|
||||
font-family: Work Sans;
|
||||
font-weight: 600;
|
||||
font-style: SemiBold;
|
||||
|
||||
.text {
|
||||
margin: 22rpx;
|
||||
font-family: Work Sans;
|
||||
font-weight: 600;
|
||||
font-style: SemiBold;
|
||||
font-size: 14px;
|
||||
color: #F5F8FF;
|
||||
}
|
||||
|
||||
.active {
|
||||
font-size: 16px;
|
||||
color: var(--wz, #2938E0);
|
||||
}
|
||||
}
|
||||
|
||||
.menu-level2 {
|
||||
background: #F5F8FF;
|
||||
// background: #FFFFFF80;
|
||||
padding: 20rpx 0 0 0;
|
||||
border-radius: 20rpx;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.menu-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
width: 20%;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.menu-text {
|
||||
font-family: Work Sans;
|
||||
font-weight: 400;
|
||||
font-style: Regular;
|
||||
font-size: 24rpx;
|
||||
leading-trim: NONE;
|
||||
line-height: 100%;
|
||||
letter-spacing: -2%;
|
||||
color: #2B2B2B;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 商城列表
|
||||
.mall-list {
|
||||
margin-top: 20rpx;
|
||||
padding: 0 20rpx;
|
||||
|
||||
.mall-item {
|
||||
border-radius: 16rpx;
|
||||
background: #F0F5FF;
|
||||
position: relative;
|
||||
margin-top: 20rpx;
|
||||
box-shadow: 0px 4px 4px 0px #00000040;
|
||||
padding-bottom: 10rpx;
|
||||
|
||||
.mall-title {
|
||||
font-size: 30rpx;
|
||||
margin-top: 10rpx;
|
||||
color: $u-main-color;
|
||||
}
|
||||
|
||||
.mall-price {
|
||||
font-size: 30rpx;
|
||||
color: $u-type-error;
|
||||
margin-top: 10rpx;
|
||||
|
||||
.icon {
|
||||
height: 30rpx;
|
||||
width: 30rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.mall-tag {
|
||||
display: flex;
|
||||
margin-top: 5px;
|
||||
|
||||
.mall-tag-owner {
|
||||
background-color: $u-type-error;
|
||||
color: #FFFFFF;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 4rpx 14rpx;
|
||||
border-radius: 50rpx;
|
||||
font-size: 20rpx;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.mall-tag-text {
|
||||
margin-right: 10px;
|
||||
border: 1px solid $u-type-primary;
|
||||
color: $u-type-primary;
|
||||
border-radius: 50rpx;
|
||||
line-height: 1;
|
||||
padding: 4rpx 14rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-radius: 50rpx;
|
||||
font-size: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.mall-shop {
|
||||
font-size: 22rpx;
|
||||
color: $u-tips-color;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
146
pages/home/mallDetail.vue
Normal file
146
pages/home/mallDetail.vue
Normal file
@@ -0,0 +1,146 @@
|
||||
<template>
|
||||
<view class="detail-container">
|
||||
<u-navbar id="uNavbarId" title="商品详情" :background="{background: 'transparent' }" :border-bottom="false"
|
||||
back-icon-color="#000" title-color="#000">
|
||||
<template v-slot:right>
|
||||
<image class="collection" src="/static/icon/Settings.png" mode=""></image>
|
||||
</template>
|
||||
</u-navbar>
|
||||
<scroll-view scroll-y="true" :style="'height:'+scrollHeight+'px'">
|
||||
111
|
||||
</scroll-view>
|
||||
|
||||
<view class="bottom-view" id="bottomViewId">
|
||||
<view class="icon-btn">
|
||||
<view class="item">
|
||||
<u-image width="100%" :fade="false" src="/static/mall/Home.png" mode="widthFix"></u-image>
|
||||
店铺
|
||||
</view>
|
||||
<view class="item">
|
||||
<u-image width="100%" :fade="false" src="/static/mall/Twitch.png" mode="widthFix"></u-image>
|
||||
客服
|
||||
</view>
|
||||
<view class="item">
|
||||
<u-image width="100%" :fade="false" src="/static/mall/Star.png" mode="widthFix"></u-image>
|
||||
收藏
|
||||
</view>
|
||||
</view>
|
||||
<view class="text-btn">
|
||||
<u-button class="add-car common" :hair-line="false" hover-class="none">加入购物车</u-button>
|
||||
<u-button class="buy common" :hair-line="false" hover-class="none">领券购买</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, ref, getCurrentInstance } from 'vue';
|
||||
|
||||
const instance = getCurrentInstance();
|
||||
|
||||
const scrollHeight = ref(0)
|
||||
|
||||
const loadHeight = () => {
|
||||
uni.getSystemInfo({
|
||||
success(res) {
|
||||
let screenHeight = res.screenHeight
|
||||
uni.createSelectorQuery().in(instance.proxy).select("#uNavbarId").boundingClientRect((data : any) => {
|
||||
scrollHeight.value = screenHeight - data.height
|
||||
}).exec()
|
||||
uni.createSelectorQuery().in(instance.proxy).select("#bottomViewId").boundingClientRect((data : any) => {
|
||||
scrollHeight.value = scrollHeight.value - data.height
|
||||
}).exec()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
loadHeight()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.detail-container {
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
background: linear-gradient(180deg, #2F75F9 0%, #F0F3FF 34.13%);
|
||||
|
||||
|
||||
.collection {
|
||||
width: 48rpx;
|
||||
height: 48rpx;
|
||||
margin-right: 24rpx;
|
||||
}
|
||||
|
||||
.bottom-view {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 116rpx;
|
||||
background: #F5F8FF;
|
||||
padding: 0 29rpx;
|
||||
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.icon-btn {
|
||||
display: flex;
|
||||
width: 228rpx;
|
||||
width: 30%;
|
||||
flex-wrap: nowrap;
|
||||
|
||||
.item {
|
||||
margin-right: 20rpx;
|
||||
white-space: nowrap;
|
||||
|
||||
font-family: Work Sans;
|
||||
font-weight: 400;
|
||||
font-style: Regular;
|
||||
font-size: 26rpx;
|
||||
leading-trim: NONE;
|
||||
line-height: 100%;
|
||||
letter-spacing: -2%;
|
||||
}
|
||||
}
|
||||
|
||||
.text-btn {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
justify-content: flex-end;
|
||||
|
||||
.common {
|
||||
border: none;
|
||||
width: 200rpx;
|
||||
height: 70rpx;
|
||||
margin: 0;
|
||||
color: #fff;
|
||||
font-family: Work Sans;
|
||||
font-weight: 400;
|
||||
font-style: Regular;
|
||||
font-size: 26rpx;
|
||||
leading-trim: NONE;
|
||||
line-height: 100%;
|
||||
letter-spacing: -2%;
|
||||
}
|
||||
|
||||
.buy {
|
||||
background: #6287FF;
|
||||
border-top-right-radius: 12rpx;
|
||||
border-bottom-right-radius: 12rpx;
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
||||
.add-car {
|
||||
background: #A8BCFF;
|
||||
border-top-right-radius: 0rpx;
|
||||
border-bottom-right-radius: 0rpx;
|
||||
border-top-left-radius: 12rpx;
|
||||
border-bottom-left-radius: 12rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
223
pages/my/my.vue
223
pages/my/my.vue
@@ -7,7 +7,7 @@
|
||||
<view class="header-avatar">
|
||||
<u-avatar :src="getImageUrl(user.avatar)"></u-avatar>
|
||||
</view>
|
||||
<view class="header-username u-m-l-10">
|
||||
<view class="header-username u-m-l-20">
|
||||
{{user.real_name}}
|
||||
</view>
|
||||
</view>
|
||||
@@ -15,7 +15,7 @@
|
||||
<image src="/static/icon/Settings.png" style="width: 100%;height: 100%;" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="statistics">
|
||||
<view class="item">
|
||||
<view class="count">
|
||||
@@ -51,7 +51,89 @@
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<u-button @click="loginOut">退出登录</u-button>
|
||||
<view class="open-vip">
|
||||
<view class="text-vip">
|
||||
<view class="title">
|
||||
vip专享
|
||||
</view>
|
||||
<view class="sub-title">
|
||||
立享价值1000元权益
|
||||
</view>
|
||||
</view>
|
||||
<u-button class="btn-vip" hover-class="none" :hair-line="false">298元开通</u-button>
|
||||
</view>
|
||||
|
||||
<view class="white-block">
|
||||
<view class="item">
|
||||
<view class="title">
|
||||
会员权益
|
||||
</view>
|
||||
<view class="sub-title">
|
||||
领取升级福利
|
||||
</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="title">
|
||||
积分商城
|
||||
</view>
|
||||
<view class="sub-title">
|
||||
赚积分享福利
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="menu-list">
|
||||
<view class="menu-item">
|
||||
<u-image src="/static/my/01.png" width="40%" mode="widthFix"></u-image>
|
||||
<view class="menu-text">
|
||||
领券中心
|
||||
</view>
|
||||
</view>
|
||||
<view class="menu-item">
|
||||
<u-image src="/static/my/02.png" width="40%" mode="widthFix"></u-image>
|
||||
<view class="menu-text">
|
||||
积分兑换
|
||||
</view>
|
||||
</view>
|
||||
<view class="menu-item">
|
||||
<u-image src="/static/my/03.png" width="40%" mode="widthFix"></u-image>
|
||||
<view class="menu-text">
|
||||
我的客户
|
||||
</view>
|
||||
</view>
|
||||
<view class="menu-item">
|
||||
<u-image src="/static/my/04.png" width="40%" mode="widthFix"></u-image>
|
||||
<view class="menu-text">
|
||||
常见问题
|
||||
</view>
|
||||
</view>
|
||||
<view class="menu-item">
|
||||
<u-image src="/static/my/05.png" width="40%" mode="widthFix"></u-image>
|
||||
<view class="menu-text">
|
||||
充值中心
|
||||
</view>
|
||||
</view>
|
||||
<view class="menu-item">
|
||||
<u-image src="/static/my/06.png" width="40%" mode="widthFix"></u-image>
|
||||
<view class="menu-text">
|
||||
收货地址
|
||||
</view>
|
||||
</view>
|
||||
<view class="menu-item">
|
||||
<u-image src="/static/my/07.png" width="40%" mode="widthFix"></u-image>
|
||||
<view class="menu-text">
|
||||
我的订单
|
||||
</view>
|
||||
</view>
|
||||
<view class="menu-item">
|
||||
<u-image src="/static/my/08.png" width="40%" mode="widthFix"></u-image>
|
||||
<view class="menu-text">
|
||||
成为代理
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<u-button class="u-m-t-20" @click="loginOut">退出登录</u-button>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
@@ -92,10 +174,11 @@
|
||||
justify-content: flex-end;
|
||||
|
||||
.header-user {
|
||||
padding: 20rpx 10rpx;
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 170rpx;
|
||||
padding-left: 60rpx;
|
||||
}
|
||||
|
||||
.header-setting {
|
||||
@@ -103,17 +186,139 @@
|
||||
height: 52rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.statistics{
|
||||
|
||||
.statistics {
|
||||
display: flex;
|
||||
|
||||
.item{
|
||||
|
||||
font-family: SF Pro;
|
||||
font-weight: 510;
|
||||
font-style: Medium;
|
||||
font-size: 32rpx;
|
||||
leading-trim: NONE;
|
||||
line-height: 48rpx;
|
||||
letter-spacing: 0%;
|
||||
|
||||
margin: 40rpx 0 20rpx;
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 25%;
|
||||
border: 1rpx solid #000;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.open-vip {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
background: #2B2B2B;
|
||||
align-items: center;
|
||||
padding: 24rpx 0;
|
||||
border-top-left-radius: 24rpx;
|
||||
border-top-right-radius: 24rpx;
|
||||
|
||||
.text-vip {
|
||||
margin-left: 32rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
color: #FFDD9E;
|
||||
justify-content: flex-start;
|
||||
|
||||
.title {
|
||||
font-family: SF Pro;
|
||||
font-weight: 700;
|
||||
font-style: Bold;
|
||||
font-size: 32rpx;
|
||||
leading-trim: NONE;
|
||||
line-height: 48rpx;
|
||||
letter-spacing: 0%;
|
||||
}
|
||||
|
||||
.sub-title {
|
||||
font-family: SF Pro;
|
||||
font-weight: 274;
|
||||
font-style: Light;
|
||||
font-size: 32rpx;
|
||||
leading-trim: NONE;
|
||||
line-height: 48rpx;
|
||||
letter-spacing: 0%;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.btn-vip {
|
||||
margin-right: 42rpx;
|
||||
width: 180rpx;
|
||||
height: 56rpx;
|
||||
border: none;
|
||||
border-radius: 198rpx;
|
||||
background: linear-gradient(90deg, #FFCC5E 0%, #FFE9BA 47.27%, #FFCC5E 100%);
|
||||
}
|
||||
}
|
||||
|
||||
.white-block {
|
||||
margin-top: 44rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
.item {
|
||||
width: 48%;
|
||||
background: #F5F8FF;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 30rpx 32rpx;
|
||||
border-radius: 24rpx;
|
||||
|
||||
.title {
|
||||
font-family: SF Pro;
|
||||
font-weight: 700;
|
||||
font-style: Bold;
|
||||
font-size: 32rpx;
|
||||
leading-trim: NONE;
|
||||
line-height: 48rpx;
|
||||
letter-spacing: 0%;
|
||||
}
|
||||
|
||||
.sub-title {
|
||||
margin-top: 14rpx;
|
||||
font-family: Work Sans;
|
||||
font-weight: 400;
|
||||
font-size: 26rpx;
|
||||
leading-trim: NONE;
|
||||
line-height: 100%;
|
||||
letter-spacing: -2%;
|
||||
color: #8C8C8C;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.menu-list{
|
||||
background: #F5F8FF;
|
||||
margin-top: 20rpx;
|
||||
padding: 20rpx 0 0 0;
|
||||
border-radius: 24rpx;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.menu-item{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
width: 25%;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.menu-text{
|
||||
font-family: Work Sans;
|
||||
font-weight: 400;
|
||||
font-style: Regular;
|
||||
font-size: 20rpx;
|
||||
leading-trim: NONE;
|
||||
line-height: 100%;
|
||||
letter-spacing: -2%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
BIN
static/mall/Home.png
Normal file
BIN
static/mall/Home.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 834 B |
BIN
static/mall/Star.png
Normal file
BIN
static/mall/Star.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
BIN
static/mall/Twitch.png
Normal file
BIN
static/mall/Twitch.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 654 B |
BIN
static/my/01.png
Normal file
BIN
static/my/01.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
BIN
static/my/02.png
Normal file
BIN
static/my/02.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.4 KiB |
BIN
static/my/03.png
Normal file
BIN
static/my/03.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
BIN
static/my/04.png
Normal file
BIN
static/my/04.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
BIN
static/my/05.png
Normal file
BIN
static/my/05.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
BIN
static/my/06.png
Normal file
BIN
static/my/06.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
BIN
static/my/07.png
Normal file
BIN
static/my/07.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.0 KiB |
BIN
static/my/08.png
Normal file
BIN
static/my/08.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
BIN
static/shop/01.png
Normal file
BIN
static/shop/01.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 8.9 KiB |
BIN
static/shop/02.png
Normal file
BIN
static/shop/02.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.3 KiB |
BIN
static/shop/03.png
Normal file
BIN
static/shop/03.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.1 KiB |
BIN
static/shop/04.png
Normal file
BIN
static/shop/04.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.4 KiB |
BIN
static/shop/05.png
Normal file
BIN
static/shop/05.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
BIN
static/shop/06.png
Normal file
BIN
static/shop/06.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.1 KiB |
BIN
static/shop/07.png
Normal file
BIN
static/shop/07.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.5 KiB |
BIN
static/shop/08.png
Normal file
BIN
static/shop/08.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.8 KiB |
BIN
static/shop/09.png
Normal file
BIN
static/shop/09.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.4 KiB |
BIN
static/shop/10.png
Normal file
BIN
static/shop/10.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.1 KiB |
@@ -7,18 +7,18 @@ export const validatePhone = (phone) => {
|
||||
|
||||
export const getImageUrl = (imagePath) => {
|
||||
if (!imagePath) return ''
|
||||
// 如果图片路径以/uploads开头，直接返回原路径
|
||||
const baseURL = "https://minio.zrbjr.com"
|
||||
if (imagePath.startsWith('/uploads')) {
|
||||
return `${baseURL}/jurongquan${imagePath}`
|
||||
}
|
||||
|
||||
if (imagePath.startsWith('http')) return imagePath
|
||||
|
||||
// const baseURL = "http://192.168.1.43:3000"
|
||||
// const baseURL = "https://www.zrbjr.com"
|
||||
const baseURL = "https://minio.zrbjr.com"
|
||||
|
||||
// 如果图片路径以/uploads开头，直接返回原路径
|
||||
if (imagePath.startsWith('/uploads')) {
|
||||
return `${baseURL}/jurongquan${imagePath}`
|
||||
}
|
||||
|
||||
return fullUrl
|
||||
return baseURL + imagePath
|
||||
}
|
||||
|
||||
export const getUserInfo = () => {
|
||||
|
||||
Reference in New Issue
Block a user