zhangshengli
/
yshi
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

商品详情页新增店铺

Browse Source
main
lenovo008\lenovo 4 months ago
parent d0f2a9f976
commit 2be2423c3e
6 changed files with 263 additions and 150 deletions
Show Stats Download Patch File Download Diff File

13
fuintUniapp/config.js
Unescape Escape View File

@ -1,8 +1,9 @@
module.exports = {
// 系统名称
name: "会员系统",
// 必填: 后端api地址, 斜杠/结尾
apiUrl: "http://127.0.0.1:8080/",
// 必填: 默认商户号，从后台商户列表获取
merchantNo: "10001"
// 系统名称
name: '会员系统',
// 必填: 后端api地址, 斜杠/结尾
// apiUrl: 'http://192.168.1.103:8999/',
apiUrl: 'http://192.168.10.31:8999/',//服务器
// 必填: 默认商户号，从后台商户列表获取
merchantNo: '10001',
}

9
fuintUniapp/jsconfig.json
Unescape Escape View File

@ -0,0 +1,9 @@
{
"compilerOptions": {
"jsx": "preserve",
"baseUrl": ".",
"paths": {
"@/*": ["./*"]
}
}
}

3
fuintUniapp/pages/goods/detail.scss
Unescape Escape View File

@ -156,7 +156,8 @@
}
&--home {
margin-right: 30rpx;
margin-right: 15rpx;
text-align: center;
}
&--cart {

376
fuintUniapp/pages/goods/detail.vue
Unescape Escape View File

@ -56,7 +56,7 @@
</view>
<!-- 商品SKU弹窗 -->
<SkuPopup v-if="!isLoading" v-model="showSkuPopup" :skuMode="skuMode" :goods="goods" @addCart="onAddCart"/>
<SkuPopup v-if="!isLoading" v-model="showSkuPopup" :skuMode="skuMode" :goods="goods" @addCart="onAddCart" />
<!-- 商品描述 -->
<view v-if="!isLoading" class="goods-content m-top20">
@ -85,9 +85,35 @@
<text>首页</text>
</view>
</view>
<!-- 客服 -->
<view class="fast-item fast-item--home" @click="modalShow = true">
<view class="fast-icon">
<u-icon name="phone" size="32"></u-icon>
</view>
<view class="fast-text">
<text>客服</text>
</view>
</view>
<u-modal v-model="modalShow" title="店铺信息" width="650rpx" class="store-list">
<view class="store-info">
<view class="base-info">
<view class="name">{{ storeList.name }}</view>
<view class="hours">营业时间：{{ storeList.hours }}</view>
<view class="address"><text class="location-icon iconfont icon-dingwei"></text>{{ storeList.address }}
</view>
<view class="tel">联系电话：{{ storeList.phone }}</view>
</view>
<view class="loc-info">
<text class="dis"><text class="distance">{{ parseFloat(storeList.distance).toFixed(1) }}</text>公里</text>
</view>
</view>
</u-modal>
<!-- 购物车-->
<view class="fast-item fast-item--cart" @click="onTargetCart">
<view v-if="cartTotal > 0" class="fast-badge fast-badge--fixed">{{ cartTotal > 99 ? '99+' : cartTotal }}</view>
<view v-if="cartTotal > 0" class="fast-badge fast-badge--fixed">{{ cartTotal > 99 ? '99+' : cartTotal }}
</view>
<view class="fast-icon">
<text class="iconfont icon-gouwuche"></text>
</view>
@ -117,161 +143,229 @@
</template>
<script>
import { setCartTabBadge, setCartTotalNum } from '@/utils/app'
import * as GoodsApi from '@/api/goods'
import * as CartApi from '@/api/cart'
import jyfParser from '@/components/jyf-parser/jyf-parser'
import Shortcut from '@/components/shortcut'
import SlideImage from './components/SlideImage'
import SkuPopup from './components/SkuPopup'
export default {
components: {
jyfParser,
Shortcut,
SlideImage,
SkuPopup,
},
data() {
return {
// 正在加载
isLoading: true,
// 当前商品ID
goodsId: null,
// 商品详情
goods: {},
// 购物车总数量
cartTotal: 0,
// 显示/隐藏SKU弹窗
showSkuPopup: false,
// 模式 1:都显示 2:只显示购物车 3:只显示立即购买
skuMode: 1
}
},
import { setCartTabBadge, setCartTotalNum } from '@/utils/app'
import * as GoodsApi from '@/api/goods'
import * as CartApi from '@/api/cart'
import jyfParser from '@/components/jyf-parser/jyf-parser'
import Shortcut from '@/components/shortcut'
import SlideImage from './components/SlideImage'
import SkuPopup from './components/SkuPopup'
import * as settingApi from '@/api/setting'
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
// 商品ID
this.goodsId = parseInt(options.goodsId)
// 加载页面数据
this.onRefreshPage()
export default {
components: {
jyfParser,
Shortcut,
SlideImage,
SkuPopup,
},
data() {
return {
// 正在加载
isLoading: true,
// 当前商品ID
goodsId: null,
// 商品详情
goods: {},
// 购物车总数量
cartTotal: 0,
// 显示/隐藏SKU弹窗
showSkuPopup: false,
// 模式 1:都显示 2:只显示购物车 3:只显示立即购买
skuMode: 1,
modalShow: false,//店主电话弹框
storeList: {},//店铺信息
}
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
// 商品ID
this.goodsId = parseInt(options.goodsId)
// 加载页面数据
this.onRefreshPage()
// 获取店主电话
this.getStoreList()
},
methods: {
// 刷新页面数据
onRefreshPage() {
const app = this
app.isLoading = true
Promise.all([app.getGoodsDetail(), app.getCartTotal()])
.finally(() => app.isLoading = false)
},
methods: {
// 刷新页面数据
onRefreshPage() {
const app = this
app.isLoading = true
Promise.all([app.getGoodsDetail(), app.getCartTotal()])
.finally(() => app.isLoading = false)
},
// 获取商品信息
getGoodsDetail() {
const app = this
return new Promise((resolve, reject) => {
GoodsApi.detail(app.goodsId)
.then(result => {
const goodsData = result.data;
if (goodsData.skuList) {
goodsData.skuList.forEach(function(sku, index) {
goodsData.skuList[index].specIds = sku.specIds.split('-');
goodsData.skuList[index].skuId = sku.id;
})
}
app.goods = goodsData;
app.skuMode = 3;
resolve(result);
})
.catch(err => reject(err))
})
},
// 获取购物车总数量
getCartTotal() {
const app = this
return new Promise((resolve, reject) => {
CartApi.list()
.then(result => {
app.cartTotal = result.data.totalNum;
setCartTotalNum(app.cartTotal);
setCartTabBadge();
resolve(result);
})
.catch(err => reject(err));
})
},
// 更新购物车数量
onAddCart() {
this.$toast("添加购物车成功");
this.getCartTotal();
},
/**
* 显示/隐藏SKU弹窗
* @param {skuMode} 模式 1:都显示 2:只显示购物车 3:只显示立即购买
*/
onShowSkuPopup(skuMode = 1) {
this.skuMode = skuMode;
this.showSkuPopup = !this.showSkuPopup;
},
// 跳转到首页
onTargetHome(e) {
this.$navTo('pages/index/index');
},
// 跳转到购物车页
onTargetCart() {
this.$navTo('pages/cart/index')
}
// 获取商品信息
getGoodsDetail() {
const app = this
return new Promise((resolve, reject) => {
GoodsApi.detail(app.goodsId)
.then(result => {
const goodsData = result.data;
if (goodsData.skuList) {
goodsData.skuList.forEach(function (sku, index) {
goodsData.skuList[index].specIds = sku.specIds.split('-');
goodsData.skuList[index].skuId = sku.id;
})
}
app.goods = goodsData;
app.skuMode = 3;
resolve(result);
})
.catch(err => reject(err))
})
},
/**
* 分享当前页面
*/
onShareAppMessage() {
// 获取购物车总数量
getCartTotal() {
const app = this
// 构建页面参数
const params = app.$getShareUrlParams({
goodsId: app.goodsId,
return new Promise((resolve, reject) => {
CartApi.list()
.then(result => {
app.cartTotal = result.data.totalNum;
setCartTotalNum(app.cartTotal);
setCartTabBadge();
resolve(result);
})
.catch(err => reject(err));
})
return {
title: app.goods.name,
imageUrl: app.goods.images[0],
path: `/pages/goods/detail?${params}`
}
},
// 更新购物车数量
onAddCart() {
this.$toast("添加购物车成功");
this.getCartTotal();
},
/**
* 分享到朋友圈
* 本接口为 Beta 版本，暂只在 Android 平台支持，详见分享到朋友圈 (Beta)
* https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/share-timeline.html
* 显示/隐藏SKU弹窗
* @param {skuMode} 模式 1:都显示 2:只显示购物车 3:只显示立即购买
*/
onShareTimeline() {
const app = this
// 构建页面参数
const params = app.$getShareUrlParams({
goodsId: app.goodsId,
})
return {
title: app.goods.name,
imageUrl: app.goods.images[0],
path: `/pages/goods/detail?${params}`
}
onShowSkuPopup(skuMode = 1) {
this.skuMode = skuMode;
this.showSkuPopup = !this.showSkuPopup;
},
// 跳转到首页
onTargetHome(e) {
this.$navTo('pages/index/index');
},
// 跳转到购物车页
onTargetCart() {
this.$navTo('pages/cart/index')
},
// 获取店铺列表
async getStoreList() {
let storeId = uni.getStorageSync("storeId");
let res = await settingApi.storeList()
let temp = res.data.data
this.storeList = (temp.filter(item => item.id === storeId))[0]
console.log(this.storeList, '123132');
},
},
/**
* 分享当前页面
*/
onShareAppMessage() {
const app = this
// 构建页面参数
const params = app.$getShareUrlParams({
goodsId: app.goodsId,
})
return {
title: app.goods.name,
imageUrl: app.goods.images[0],
path: `/pages/goods/detail?${params}`
}
},
/**
* 分享到朋友圈
* 本接口为 Beta 版本，暂只在 Android 平台支持，详见分享到朋友圈 (Beta)
* https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/share-timeline.html
*/
onShareTimeline() {
const app = this
// 构建页面参数
const params = app.$getShareUrlParams({
goodsId: app.goodsId,
})
return {
title: app.goods.name,
imageUrl: app.goods.images[0],
path: `/pages/goods/detail?${params}`
}
}
}
</script>
<style>
page {
background: #fafafa;
}
page {
background: #fafafa;
}
</style>
<style lang="scss" scoped>
@import "./detail.scss";
@import "./detail.scss";
// 店铺列表
.store-list {
// display: flex;
.store-info {
padding: 10px 0;
overflow: hidden;
border: 2rpx solid #cccccc;
min-height: 240rpx;
line-height: 55rpx;
border-radius: 5rpx;
margin-top: 10rpx;
margin-bottom: 10rpx;
padding: 30rpx;
background: #FFFFFF;
.base-info {
float: left;
width: 70%;
.name {
font-size: 34rpx;
font-weight: bold;
margin-top: 15rpx;
margin-bottom: 12rpx;
color: #666;
}
.location-icon {
color: #f03c3c;
font-weight: bold;
}
}
.loc-info {
color: #666666;
// dispaly:flex;
line-height: 75rpx;
float: left;
overflow: hidden;
width: 30%;
text-align: right;
.distance {
font-weight: bold;
color: #f03c3c;
}
}
}
}
</style>

10
fuintUniapp/pages/index/index.vue
Unescape Escape View File

@ -13,9 +13,17 @@
<block>
<Blank v-if="storeInfo" :itemStyle="options.blankStyle"/>
</block>
<block>
<NavBar v-if="storeInfo" :itemStyle="options.navStyle" :params="{}" :dataList="options.navBar"/>
咨讯
<!-- <News v-if="storeInfo" :itemStyle="options.newsStyle" :params="options.newsParam" :dataList="news"/> -->
</block>
<!-- <block>
<NavBar v-if="storeInfo" :itemStyle="options.navStyle" :params="{}" :dataList="options.navBar"/>
</block> -->
<block>
<Blank v-if="storeInfo" :itemStyle="options.blankStyle"/>
</block>

2
fuintUniapp/pages/location/index.vue
Unescape Escape View File

@ -196,7 +196,7 @@
}
.loc-info {
color: #666666;
dispaly:flex;
// dispaly:flex;
line-height: 240rpx;
float: left;
overflow: hidden;

Write Preview
Loading…
Cancel
Save