Skip to content

严立 / mini-shimao

Go to a project
Commit 3e7bef2e by wjw
Options

ww--项目服务修改

parents 0863868f b92a75d6
Inline Side-by-side
Showing with 2520 additions and 1011 deletions
app.js
import iMiment from './npm/miment.js'
import iUtils from './utils/utils.js'
import iRule from './utils/rule/rule.js'
import iEnvironmental from './environmental.js'
App({
modular: {
'rule': iRule,
'utils': iUtils,
'miment': iMiment,
},
......@@ -10,10 +13,12 @@ App({
globalData: {
appImageBase: '../../../image/',
appResourcesBase: 'https://sm-web.meiqicloud.com/userfiles/appResourcesS2/',
shopId: iEnvironmental.shopId,
token: '',
refreshToken: '',
userInfo: null,
baseUrl: 'https://sm-web.meiqicloud.com',//测试
baseUrl: 'https://sm-web2.meiqicloud.com',//测试
// baseUrl: 'https://smbhyh-web.meiqicloud.com',//生产
debug: true,
},
......@@ -22,18 +27,6 @@ App({
this.setUnitProportion()
},
onShow: function (options) {
},
onHide: function () {
},
onError: function (msg) {
},
setUnitProportion: function () {
let funcProportion = wx.getSystemInfoSync().windowWidth / 750
wx.setStorageSync('unitProportion', funcProportion)
......@@ -72,11 +65,11 @@ App({
obj.success(res.data)
}
} else if (402 == code) { // token失效
that.refreshToken({
success: function () {
that.wxRequest(obj)
}
})
// that.refreshToken({
// success: function () {
// that.wxRequest(obj)
// }
// })
} else {
if (obj.fail) {
let err = {
......@@ -120,11 +113,13 @@ App({
wx.login({
success: res => {
// 发送 res.code 到后台换取 openId, sessionKey, unionId
console.log('wx.login:', res);
this.wxRequest({
url: '/api/v1/login/getSmallSession?code=' + res.code,
method: 'GET',
success: function (res) {
console.log(res)
that.globalData.token = res.data.token
that.globalData.refreshToken = res.data.refreshToken
wx.setStorageSync('expires_in', res.data.expires_in)
......
app.json
......@@ -23,12 +23,14 @@
"pages/commodity/home/home",
"pages/commodity/shopping-cart/shopping-cart",
"pages/commodity/food/food",
"pages/commodity/project/project",
"pages/commodity/snacks/snacks",
"pages/commodity/art/art",
"pages/commodity/project-detail/project-detail",
"pages/commodity/menu-art/menu-art",
"pages/commodity/menu-food/menu-food",
"pages/commodity/menu-snacks/menu-snacks",
"pages/commodity/room/room",
"pages/commodity/room-appointment/room-appointment",
"pages/campsite/home/home",
"pages/campsite/home-mirror/home-mirror",
......@@ -52,6 +54,7 @@
"pages/pay/coupon/coupon",
"pages/pay/coupon-input/coupon-input",
"pages/pay/coupon-detail/coupon-detail",
"pages/login/login"
],
"usingComponents": {
......@@ -59,8 +62,10 @@
"swiper-point": "../component/swiper-point/swiper-point",
"l-avatar": "../miniprogram_npm/lin-ui/avatar/index",
"l-button": "../miniprogram_npm/lin-ui/button/index",
"l-card": "../miniprogram_npm/lin-ui/card/index",
"l-capsule-bar": "../miniprogram_npm/lin-ui/capsule-bar/index",
"l-card": "../miniprogram_npm/lin-ui/card/index",
"l-checkbox": "../miniprogram_npm/lin-ui/checkbox/index",
"l-checkbox-group": "../miniprogram_npm/lin-ui/checkbox-group/index",
"l-dialog": "../miniprogram_npm/lin-ui/dialog/index",
"l-icon": "../miniprogram_npm/lin-ui/icon/index",
"l-list": "../miniprogram_npm/lin-ui/list/index",
......@@ -98,20 +103,22 @@
"iconPath": "image/tabbar/home.png",
"selectedIconPath": "image/tabbar/home-s.png",
"text": "首页"
},
{
}, {
"pagePath": "pages/play/home/home",
"iconPath": "image/tabbar/play.png",
"selectedIconPath": "image/tabbar/play-s.png",
"text": "畅玩"
},
{
}, {
"pagePath": "pages/commodity/home/home",
"iconPath": "image/tabbar/play.png",
"selectedIconPath": "image/tabbar/play-s.png",
"text": "服务"
},{
"pagePath": "pages/campsite/home/home",
"iconPath": "image/tabbar/campsite.png",
"selectedIconPath": "image/tabbar/campsite-s.png",
"text": "营地"
},
{
}, {
"pagePath": "pages/mine/home/home",
"iconPath": "image/tabbar/mine.png",
"selectedIconPath": "image/tabbar/mine-s.png",
......
environmental.js 0 → 100644
let Environmental = 'dev'
let Development = {
host: 'https://sm-web.meiqicloud.com',
shopId: [
{
miniAppId: 1,
databaseId: '581be62a80bb4f0485abd87abcf64dc0',
name: '海错图1号馆',
logo: 'shopping-cart-logo-4.png',
}, {
miniAppId: 2,
databaseId: '26c40446fc454a02abe61758176597f6',
name: '拾光花坊',
logo: 'shopping-cart-logo-7.png',
}, {
miniAppId: 3,
databaseId: '2614f117406548718bc091f24368c16e',
name: '元养水韵SPA',
logo: '',
}, {
miniAppId: 4,
databaseId: 'd9436d7018de43809824b6ec221ea01f',
name: '原味舒食',
logo: 'shopping-cart-logo-1.png',
}, {
miniAppId: 5,
databaseId: 'c63893bb472f43bca4ec72f890bcb4fd',
name: '原野MOJITO',
logo: '',
}, {
miniAppId: 6,
databaseId: '3cfe2e3b8b4342e8b62f8b45daf60d91',
name: '5D星空影院',
logo: '',
}, {
miniAppId: 7,
databaseId: '8a3e59c57f564c569b3d7bb278ea50b3',
name: '儿童营地',
logo: 'shopping-cart-logo-6.png',
}
]
}
let Production = {
host: 'https://smbhyh-web.meiqicloud.com',
}
export default Environmental === 'dev' ? Development : Production
\ No newline at end of file
package-lock.json
{
"name": "mini-shimao",
"version": "1.0.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
"lin-ui": {
"version": "0.8.6",
"resolved": "https://registry.npm.taobao.org/lin-ui/download/lin-ui-0.8.6.tgz",
"integrity": "sha1-mLXXHCzVzIAutYSCAJyRmlav1KY="
"name": "mini-shimao",
"version": "1.0.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
"lin-ui": {
"version": "0.8.6",
"resolved": "https://registry.npm.taobao.org/lin-ui/download/lin-ui-0.8.6.tgz",
"integrity": "sha1-mLXXHCzVzIAutYSCAJyRmlav1KY="
}
}
}
}
}
\ No newline at end of file
package.json
{
"name": "mini-shimao",
"version": "1.0.0",
"description": "",
"main": "app.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"dependencies": {
"lin-ui": "^0.8.6"
}
}
"name": "mini-shimao",
"version": "1.0.0",
"description": "",
"main": "app.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"dependencies": {
"lin-ui": "^0.8.6"
}
}
\ No newline at end of file
pages/commodity/home/home.js
// pages/home/service/service.js
const App = getApp()
Page({
data: {
/**
* 页面的初始数据
*/
data: {
imageBase: App.globalData.appResourcesBase,
data: [ //畅想美食
{ url: '/image/ywssLogo@2x.png', bgc: '#586A46', },
{ url: '/image/Logo@2x (3).png', bgc: '#13625F' },
],
data1: [
{ url: App.globalData.appResourcesBase + 'commodity/home-shop-3.png' },
{ url: App.globalData.appResourcesBase + 'commodity/home-shop-4.png' },
],
phone: '13316748039',
hotline: false, //客服热线
},
//客服热线拨打
call() {
wx.makePhoneCall({
phoneNumber: this.data.phone,
})
},
onLoad: function (options) {
//取消拨打
cancel() {
this.setData({
hotline: false,
})
},
})
\ No newline at end of file
pages/commodity/home/home.json
{
"usingComponents": {}
"usingComponents": {}
}
\ No newline at end of file
pages/commodity/home/home.wxml
<!--pages/home/home/home.wxml-->
<text>pages/home/home/home.wxml</text>
<!--pages/home/service/service.wxml-->
<navigation class="navigation"></navigation>
<view class="container">
<view class="greetings_header">
<view class="greetings_title">Monica , 早上好！</view>
<image src="/image/cxms@2x.png" class="title_img"></image>
<view class="greetings_header_describe">这里有来自大自然的馈赠用心烹饪的美食</view>
</view>
<view class="greetings_body">
<swiper indicator-dots="true" style="height:1469rpx;">
<block wx:for="{{data}}">
<swiper-item>
<view class="service_store" style="background:{{item.bgc}}">
<image src="{{item.url}}" class="{{index == 0? 'store_img' : 'store_img1'}} "></image>
<view class="order_button">立即点餐</view>
</view>
<view class="service_store_shop">
<view class="service_store_shop_item" wx:for="{{4}}">
<image class="shop_img"></image>
<text class="shop_goods">炭烤猪肋排拼盘</text>
</view>
</view>
</swiper-item>
</block>
</swiper>
</view>
<view class="service_item" style="margin-bottom:136rpx;">
<view style="padding-left:40rpx;" class="greetings_header_describe">您可以用最优惠的价格享受超级服务</view>
<view class="item_banner">
<image style="z-index:-1;" class="item_banner_img" src="{{imageBase + 'commodity/home-head.png'}}"></image>
<view class="goods_buy">立即选购</view>
</view>
<view class="item_container">
<image wx:for="{{3}}" class="items_img"></image>
</view>
</view>
<view class="service_item">
<view style="padding-left:40rpx;white-space:pre-wrap" class="greetings_header_describe">尽情玩耍 随时为你补充能量
</view>
<view class="item_banner" style="background: #E8F1F6;text-align:center;z-index:-1;height:512rpx;">
<image style="width:312rpx;height:56rpx;margin-top:152rpx;" src="{{imageBase + 'commodity/home-title-1.png'}}"></image>
<view>
<image style="width:148rpx;height:16rpx;margin-top:8rpx;" src="{{imageBase + 'commodity/home-tip-1.png'}}"></image>
</view>
</view>
<view class="item_container">
<view style="margin-bottom:64rpx;" wx:for="{{2}}">
<image class="items_img" style="margin-bottom:0;"></image>
<view class="items_text">儿童营地接待区</view>
</view>
</view>
</view>
<view class="service_item">
<image style="margin-left:40rpx;" src="/image/wcsc@2x.png" class="title_img"></image>
<view style="padding-left:40rpx;white-space:pre-wrap" class="greetings_header_describe">可以为家人、朋友 准备一份精心的礼物
</view>
<view class="greetings_body">
<swiper indicator-dots="true" style="height:1469rpx;">
<block wx:for="{{data1}}">
<swiper-item>
<view class="service_store">
<image src="{{item.url}}" class="item_banner_img"></image>
<view style="width:750rpx;height:382rpx;"></view>
<view style="background:{{index== 0 ?'#C93120' : '#BD5B66' }} ;color: #FAF0DF;" class="order_button">立即选购</view>
</view>
<view class="service_store_shop">
<view class="service_store_shop_item" wx:for="{{4}}">
<image class="shop_img"></image>
<text class="shop_goods">炭烤猪肋排拼盘</text>
</view>
</view>
</swiper-item>
</block>
</swiper>
</view>
</view>
<view class="service_item">
<view style="padding-left:40rpx;white-space:pre-wrap;width:472rpx;" class="greetings_header_describe">滨海温泉院墅 足不出户即可享受滨海温泉
</view>
<view style="position: relative;">
<image class="home_footer" src="{{imageBase + 'commodity/home-footer.png'}}"></image>
<view class="seeHouse">预约看房</view>
<view class="call" bindtap="call">拨打客服</view>
</view>
</view>
</view>
<!-- 客服热线 -->
<l-arc-popup show="{{hotline}}" arc-radius="30">
<view class="phone">{{phone}}</view>
<view class="call" bindtap="call">呼叫</view>
<view style="height:10rpx;background-color:rgb(246,247,249);"></view>
<view class="call" bindtap="cancel">取消</view>
</l-arc-popup>
\ No newline at end of file
pages/commodity/home/home.wxss
/* pages/home/home/home.wxss */
\ No newline at end of file
.greetings_header {
padding-top: 196rpx;
padding-left: 46rpx;
width: 750rpx;
}
.greetings_title {
font-size: 58rpx;
font-weight: 500;
color: #15191f;
text-align: left;
}
.title_img {
width: 214rpx;
height: 50rpx;
margin-top: 128rpx;
}
.greetings_header_describe {
font-weight: 300;
color: #15191f;
margin-top: 12rpx;
width: 414rpx;
font-size: 34rpx;
line-height: 58rpx;
letter-spacing: 1px;
}
.greetings_body {
width: 750rpx;
height: height;
margin-top: 64rpx;
margin-bottom: 200rpx;
}
.service_store {
width: 750rpx;
height: 600rpx;
/* background: #586A46; */
text-align: center;
}
.store_img {
width: 178rpx;
height: 186rpx;
margin-top: 92rpx;
margin-bottom: 48rpx;
}
.store_img1 {
width: 320rpx;
height: 120rpx;
margin-top: 134rpx;
margin-bottom: 72rpx;
}
.order_button {
background: #ebe2ce;
width: 200rpx;
height: 64rpx;
border-radius: 4rpx;
font-size: 26rpx;
font-weight: 500;
line-height: 64rpx;
color: #586a46;
margin: auto;
}
.service_store_shop {
width: 670rpx;
/* height: 932rpx; */
margin: auto;
margin-top: -100rpx;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.service_store_shop_item {
width: 328rpx;
height: 410rpx;
text-align: center;
margin-bottom: 48rpx;
}
.shop_img {
width: 328rpx;
height: 328rpx;
background-color: blue;
}
.shop_goods {
font-weight: 300;
color: #15191f;
line-height: 42px;
}
.service_item {
width: 750rpx;
height: auto;
/* margin-bottom: 136rpx; */
}
.item_banner {
width: 750rpx;
height: 600rpx;
margin-top: 64rpx;
position: relative;
/* background-color: red; */
}
.item_banner_img {
width: 750rpx;
height: 600rpx;
position: absolute;
left: 0;
top: 0;
z-index: -1;
}
.item_container {
width: 670rpx;
height: auto;
margin: auto;
margin-top: -100rpx;
}
.items_img {
width: 670rpx;
height: 328rpx;
background-color: blue;
margin-bottom: 64rpx;
}
.goods_buy {
position: absolute;
width: 200rpx;
height: 64rpx;
top: 308rpx;
left: 276rpx;
border-radius: 4px;
background: #86c5e1;
font-weight: 500;
color: #fff;
font-size: 26rpx;
line-height: 64rpx;
text-align: center;
}
.items_text {
text-align: center;
margin-top: 45rpx;
font-weight: 300;
color: #000;
letter-spacing: 3px;
line-height: 42rpx;
}
.home_footer {
width: 750rpx;
height: 1640rpx;
margin-top: 64rpx;
}
.seeHouse {
position: absolute;
background: #86c5e1;
border-radius: 4px;
top: 294rpx;
width: 200rpx;
height: 64rpx;
left: 276rpx;
line-height: 64rpx;
color: #fff;
font-size: 26rpx;
text-align: center;
font-weight: 500;
}
.call {
position: absolute;
top: 1310rpx;
width: 200rpx;
height: 64rpx;
background: #d0b08f;
left: 276rpx;
line-height: 64rpx;
color: #fff;
font-size: 26rpx;
text-align: center;
font-weight: 500;
}
pages/commodity/menu-snacks/menu-snacks.js 0 → 100644
let App = getApp()
Page({
data: {
shopId: '',
shopName: '',
shopLogo: '',
sideBar: [], // 侧边菜单
menuTitle: '', // 商品列表标题
commodityList: [], // 商品列表
commodityDetail: {}, // 商品详情
shoppingCart: [], // 购物车列表
shoppingCartTotal: 0, // 购物车总数
currentIndex: 0,
scrollTop: 0,
winToast: false,
winLoading: false,
winCommodityDetail: false,
},
onLoad: function () {
// 儿童营地小程序内部 id
let funcMiniAppId = 7
let funcShopId = App.globalData.shopId
for (let i = 0, l = funcShopId.length; i < l; i++) {
if (funcMiniAppId === funcShopId[i].miniAppId) {
this.setData({
shopId: funcShopId[i].databaseId,
shopName: funcShopId[i].name,
shopLogo: funcShopId[i].logo,
})
break
}
}
this.querySideBar()
},
/**
* 查询分类
* @function
* @param
* @returns
*/
querySideBar: function () {
App.wxRequest({
url: '/api/v1/commodity/getClassifys',
data: {
'officeId': this.data.shopId,
'genre': 5
},
success: (response) => {
let funcSideBar = []
let funcResponse = response.data
for (let i = 0, l = funcResponse.length; i < l; i++) {
let funcItem = {
'id': funcResponse[i].id,
'tab': funcResponse[i].name,
}
funcSideBar.push(funcItem)
}
this.setData({
sideBar: funcSideBar,
menuTitle: funcSideBar[0].tab
})
this.queryCommodity()
}
})
},
/**
* 查询分类商品
* @function
* @param
* @returns
*/
queryCommodity: function () {
this.setData({
winLoading: true
})
App.wxRequest({
url: '/api/v1/commodity/getCommoditys',
data: {
'officeId': this.data.shopId,
'classifyId': this.data.sideBar[this.data.currentIndex].id,
'genre': 5,
},
success: (response) => {
let funcCommodityList = []
let funcResponse = response.data
for (let i = 0, l = funcResponse.length; i < l; i++) {
let funcItem = {
'id': funcResponse[i].id,
'name': funcResponse[i].name,
'cover': funcResponse[i].coverImg, // 商品封面
'price': funcResponse[i].sightseerPrice, // 普通价
'priceText': App.modular.utils.formatAmount(funcResponse[i].sightseerPrice), // 普通价文本格式
'priceSpecial': funcResponse[i].ownerPrice, // 业主价
'priceSpecialText': App.modular.utils.formatAmount(funcResponse[i].ownerPrice), // 业主价文本格式
'priceDiscount': funcResponse[i].price, // 活动价
'priceDiscountText': App.modular.utils.formatAmount(funcResponse[i].price), // 活动价文本格式
'priceType': 1,
'describe': funcResponse[i].synopsis,
'tags': funcResponse[i].tags,
}
// 根据后台判断价格显示类型
// 活动价优先级最高，如果存在活动价，则只显示活动价和普通价
if (funcItem.priceDiscount) {
funcItem.priceType = 1
} else {
// 活动价不存在，进一步判断普通价与业主价是否一致，如果不一致，则显示两者
if (funcItem.price !== funcItem.priceSpecial) {
funcItem.priceType = 2
} else {
funcItem.priceType = 3
}
}
funcCommodityList.push(funcItem)
}
this.setData({
winLoading: false,
commodityList: funcCommodityList,
})
},
})
},
/**
* 侧边菜单选择事件
* @function
* @param {object} - event
* @returns
*/
onSelectionSideBar: function (event) {
let funcIndex = event.currentTarget.dataset.index
let funcMenuTitle = this.data.sideBar[funcIndex].tab
this.setData({
currentIndex: funcIndex,
menuTitle: funcMenuTitle,
scrollTop: 0
})
this.queryCommodity()
},
/**
* 查询商品详情
* @function
* @param {object} - event
* @returns
*/
onCommodityDetail: function (event) {
let funcItem = event.currentTarget.dataset.item
let funcCommodityId = funcItem.id
App.wxRequest({
url: '/api/v1/commodity/getCommodityParticulars',
data: {
'commodityId': funcCommodityId,
'genre': 5
},
success: (response) => {
let funcResponse = response.data
funcItem.banner = funcResponse.imgs.split('|')
funcItem.banner.pop()
this.setData({
commodityDetail: funcItem,
winCommodityDetail: true
})
}
})
},
/**
* 关闭商品详情
* @function
* @param
* @returns
*/
onCommodityClose: function () {
this.setData({
winCommodityDetail: false
})
},
/**
* 添加商品
* @function
* @param {object} - event
* @returns
*/
onCommodityAdd: function (event) {
let funcShoppingCart = this.data.shoppingCart
// 详情加入购物车按钮商品数据不会存在于 event 对象中，所以要区分
let funcItem = event.currentTarget.dataset.item
if (!funcItem) {
funcItem = this.data.commodityDetail
}
// 判断购物车中是否存在同类商品
// 修改相应的商品数量
if (funcShoppingCart.length !== 0) {
for (let i = 0, l = funcShoppingCart.length; i < l; i++) {
if (funcItem.id === funcShoppingCart[i].id) {
funcShoppingCart[i].quantity = funcShoppingCart[i].quantity + 1
break
}
if (i === funcShoppingCart.length - 1) {
funcItem.quantity = 1
funcShoppingCart.push(funcItem)
}
}
} else {
funcItem.quantity = 1
funcShoppingCart.push(funcItem)
}
// 重新计算购物车总数
let funcShoppingCartTotal = 0
for (let i = 0, l = funcShoppingCart.length; i < l; i++) {
funcShoppingCartTotal = funcShoppingCartTotal + funcShoppingCart[i].quantity
}
this.setData({
shoppingCart: funcShoppingCart,
shoppingCartTotal: funcShoppingCartTotal,
winToast: true,
winCommodityDetail: false,
})
},
/**
* 跳转购物车页面
* @function
* @param
* @returns
*/
onShoppingCart: function() {
wx.setStorageSync('shopInfoBuffer', { 'id': this.data.shopId, 'name': this.data.shopName, 'logo': this.data.shopLogo })
wx.setStorageSync('shoppingCartBuffer', this.data.shoppingCart)
wx.navigateTo({
url: '/pages/commodity/shopping-cart/shopping-cart',
})
},
})
\ No newline at end of file
pages/commodity/menu-snacks/menu-snacks.json 0 → 100644
{
"usingComponents": {}
}
\ No newline at end of file
pages/commodity/menu-snacks/menu-snacks.wxml 0 → 100644
<l-toast
l-image-class="toast-image"
l-class="toast-bg"
show="{{winToast}}"
mask="{{true}}"
image="/image/success.png"
title="添加购物车成功"
></l-toast>
<l-toast
show="{{winLoading}}"
icon="loading"
title="加载中"
duration="20000"
mask="{{true}}"
></l-toast>
<navigation class="navigation" titleText="{{shopName}}" background="#FFFFFF;" backIcon="/image/back.png"></navigation>
<view class="cates">
<view class="cates-container">
<!-- 侧边菜单 -->
<view class="side-bar">
<block wx:for="{{sideBar}}" wx:for-index="index" wx:for-item="item" wx:key="index">
<view class="menu-item {{currentIndex === index ? 'active' : ''}}" data-index="{{index}}" bindtap="onSelectionSideBar">
<text>{{item.tab}}</text>
</view>
</block>
</view>
<!-- 商品列表 -->
<scroll-view scroll-top="{{scrollTop}}" scroll-y class="right-content">
<view class="right-content-title">{{menuTitle}}</view>
<block wx:for="{{commodityList}}" wx:for-index="index" wx:for-item="item" wx:key="index">
<view class="commodity-item row">
<view class="item-img" data-item="{{item}}" bindtap="onCommodityDetail">
<image src="{{item.cover}}" mode="widthFix"></image>
</view>
<view class="item-info">
<view class="item-info-title">{{item.name}}</view>
<view class="item-info-text-wrap">
<view wx:if="{{item.describe}}">{{item.describe}}</view>
<view wx:else class="item-info-content"></view>
</view>
<view class="item-other row con-b">
<!-- 活动价样式 -->
<view wx:if="{{item.priceType === 1}}">
<view class="item-price row align-c">
<text>￥</text>
<text>{{item.priceDiscountText}}</text>
<text class="item-price-discount">活动价</text>
</view>
<view class="item-info-old-price row align-c">
<text>￥</text>
<text>{{item.priceText}}</text>
</view>
</view>
<!-- 业主价样式 -->
<view wx:if="{{item.priceType === 2}}">
<view class="item-price row align-c">
<text>￥</text>
<text>{{item.priceSpecialText}}</text>
<text class="item-price-special">业主价</text>
</view>
<view class="item-info-old-price row align-c">
<text>￥</text>
<text>{{item.priceText}}</text>
</view>
</view>
<!-- 普通价样式 -->
<view wx:if="{{item.priceType === 3}}">
<view class="item-price row align-c">
<text>￥</text>
<text>{{item.priceText}}</text>
<text></text>
</view>
</view>
<view class="item-operation-add">
<button class="row con-c align-c" data-item="{{item}}" bindtap="onCommodityAdd">
<image mode="widthFix" src="/image/add-w.png"></image>
</button>
</view>
</view>
</view>
</view>
</block>
<!-- 购物车按钮 -->
<view class="cart-btn row con-c align-c" bindtap="onShoppingCart">
<view class="cart-num row con-c align-c">{{shoppingCartTotal}}</view>
<view class="cart-img-wrap">
<image src="../../../image/cart.png" mode="widthFix"></image>
</view>
</view>
</scroll-view>
<!-- 商品详情弹窗 -->
<l-popup show="{{winCommodityDetail}}" content-align="center" locked="{{true}}">
<view class="popup-wrap">
<view id="banner" class="banner">
<swiper autoplay circular class="banner-swiper" interval="5000" duration="500">
<block wx:for="{{commodityDetail.banner}}" wx:for-index="index" wx:for-item="item" wx:key="index">
<swiper-item class="banner-swiper-item">
<image class="banner-swiper-image" src="{{item}}"></image>
</swiper-item>
</block>
</swiper>
<view class="banner-wave">
<image src="/image/ornament-1.png" mode="widthFix"></image>
</view>
</view>
<view class="popup-info-wrapper">
<view class="popuo-info-title">{{commodityDetail.name}}</view>
<view class="popup-info-text">{{commodityDetail.describe}}</view>
</view>
<view class="popup-footer-wrapper">
<!-- 活动价样式 -->
<view class="popup-price-row row align-c" wx:if="{{commodityDetail.priceType === 1}}">
<view class="detail-price-discount row con-c align-c">
<text>活动价</text>
</view>
<view class="detail-price">
<text>￥</text>
<text>{{commodityDetail.priceDiscountText}}</text>
</view>
<view class="popup-price-old">
<text>￥</text>
<text>{{commodityDetail.priceText}}</text>
</view>
</view>
<!-- 业主价样式 -->
<view class="popup-price-row row align-c" wx:if="{{commodityDetail.priceType === 2}}">
<view class="detail-price-special row con-c align-c">
<text>业主价</text>
</view>
<view class="detail-price">
<text>￥</text>
<text>{{commodityDetail.priceSpecialText}}</text>
</view>
<view class="popup-price-old">
<text>￥</text>
<text>{{commodityDetail.priceText}}</text>
</view>
</view>
<!-- 普通价样式 -->
<view class="popup-price-row row align-c" wx:if="{{commodityDetail.priceType === 3}}">
<view class="popup-price-special row con-c align-c">
<text></text>
</view>
<view class="detail-price">
<text>￥</text>
<text>{{commodityDetail.priceText}}</text>
</view>
</view>
<view class="popup-footer-btn row con-c align-c" bindtap="onCommodityAdd">加入购物车</view>
</view>
</view>
<view class="popup-close-btn row con-c align-c" bindtap="onCommodityClose">
<view class="popup-close">
<image mode="widthFix" src="../../../image/icon_close.png"></image>
</view>
</view>
</l-popup>
</view>
</view>
\ No newline at end of file
pages/commodity/snacks/snacks.wxss → pages/commodity/menu-snacks/menu-snacks.wxss
Page {
height: 100%;
.navigation {
z-index: 1100;
position: fixed;
top: 0;
left: 0;
width: 750rpx;
}
.cates {
height: 100%;
margin-top: 150rpx;
}
.cates-container {
height: 100vh;
display: flex;
}
.left-menu {
.side-bar {
width: 160rpx;
background: #F2F3F5;
overflow-y: scroll;
background: #f2f3f5;
}
::-webkit-scrollbar {
.side-bar::-webkit-scrollbar {
width: 0;
height: 0;
color: transparent;
}
.menu-item {
height: 136rpx;
display: flex;
justify-content: center;
align-items: center;
font-size: 26rpx;
color: #656E7B;
color: #656e7b;
}
.menu-item.active {
color: #5CB5DD;
color: #5cb5dd;
font-weight: 600;
background: #fff;
border-left: 8rpx solid #86C5E1;
border-left: 8rpx solid #86c5e1;
}
.right-content {
position: relative;
flex: 1;
padding: 0 32rpx 0 28rpx;
}
.right-content::-webkit-scrollbar {
width: 0;
}
.right-content-title {
height: 100rpx;
padding: 32rpx 0;
font-size: 26rpx;
color: #959DA9;
color: #959da9;
}
.cart-btn {
......@@ -50,7 +66,7 @@ Page {
width: 104rpx;
height: 104rpx;
border-radius: 50%;
background-color: #86C5E1;
background-color: #86c5e1;
}
.cart-num {
......@@ -61,9 +77,9 @@ Page {
padding: 0 12rpx;
font-size: 22rpx;
line-height: 32rpx;
border: 1px solid #86C5E1;
border: 1px solid #86c5e1;
border-radius: 17rpx;
color: #86C5E1;
color: #86c5e1;
background-color: #fff;
}
......@@ -72,22 +88,10 @@ Page {
height: 48rpx;
}
.redPoint {
position: fixed;
right: 80rpx;
bottom: 560rpx;
width: 15px;
height: 15px;
background-color: #E66060;
border-radius: 50%;
}
.animation-hide {
display: none;
}
.item {
.commodity-item {
width: 100%;
height: 250rpx;
min-height: 250rpx;
padding-bottom: 56rpx;
box-sizing: border-box;
}
......@@ -103,48 +107,86 @@ Page {
.item-info-title {
font-size: 30rpx;
font-weight: 500;
line-height: 42rpx;
color: #15191F;
font-weight: 600;
}
.item-info-text-wrap {
width: 100%;
padding: 16rpx 0 24rpx;
display: -webkit-box;
width: 342rpx;
height: 64rpx;
margin-top: 16rpx;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
font-size: 22rpx;
font-weight: 400;
line-height: 32rpx;
color: #959DA9;
}
.item-info-content {
height: 40rpx;
}
.item-info-now-price {
.item-other {
margin-top: 24rpx;
}
.item-operation {
margin-top: 24rpx;
font-size: 30rpx;
font-weight: 600;
color: #15191F;
color: #15191f;
}
.price-symbol {
font-size: 22rpx;
.item-price text:nth-child(1) {
font-size: 22rpx;
}
.item-price text:nth-child(2) {
margin-right: 8rpx;
font-size: 30rpx;
}
.item-now-price-text {
.item-price-discount {
width: 78rpx;
height: 32rpx;
margin-left: 4px;
font-size: 20rpx;
border-radius: 4px;
background: #FAEDEA;
text-align: center;
font-size: 18rpx;
font-weight: 500;
color: #EF4E4E;
line-height: 32rpx;
text-align: center;
background: rgba(213, 107, 82, .12);
border-radius: 4rpx;
color: #EF4E4E;
}
.vipPrice {
color: #E8D0AF;
.item-price-special {
width: 78rpx;
height: 32rpx;
border-radius: 4px;
background: linear-gradient(180deg, #3F4357 0%, #252532 100%);
border-radius: 4rpx;
opacity: 1;
text-align: center;
font-size: 18rpx;
font-weight: 500;
line-height: 32rpx;
color: #E8D0AF;
}
.item-operation-add button {
width: 44rpx;
height: 44rpx;
border-radius: 50%;
background: #86C5E1;
}
.item-operation-add image {
width: 24rpx;
height: 24rpx;
}
.goods-add-btn-wrap {
......@@ -156,12 +198,11 @@ Page {
font-size: 24rpx;
}
.item-info-old-price {
margin-top: 4rpx;
font-size: 22rpx;
color: #C2C7CF;
text-decoration:line-through
color: #959da9;
text-decoration: line-through;
}
.popup-wrap {
......@@ -179,63 +220,96 @@ Page {
.popup-info-wrapper {
padding: 48rpx 40rpx;
}
.popuo-info-title {
font-size: 34rpx;
color: #15191F;
color: #15191f;
}
.popup-info-text {
margin-top: 24rpx;
font-size: 22rpx;
line-height: 32rpx;
color: #959DA9;
color: #959da9;
display: -webkit-box;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
.popup-footer-wrapper {
margin: 0 40rpx;
padding: 40rpx 0;
border-top: 1px solid #E2E7EF;
border-top: 1px solid #e2e7ef;
}
.popup-price-row {
padding: 10rpx 0;
}
.popup-price-now {
color: #15191f;
}
.detail-price text:nth-child(1) {
height: 52rpx;
font-size: 30rpx;
font-weight: 500;
line-height: 52rpx;
color: #15191F;
}
.detail-price text:nth-child(2) {
height: 52rpx;
font-size: 38rpx;
font-weight: 500;
line-height: 52rpx;
color: #15191F;
}
.popup-price-discount {
.detail-price-discount {
width: 90rpx;
height: 36rpx;
margin-left: 10px;
font-size: 22rpx;
margin-right: 16rpx;
border-radius: 4px;
background: #FAEDEA;
text-align: center;
font-size: 18rpx;
font-weight: 500;
line-height: 32rpx;
color: #EF4E4E;
background: rgba(213, 107, 82, .12);
border-radius: 4rpx;
}
.vipPrice {
color: #E8D0AF;
.detail-price-special {
width: 90rpx;
height: 36rpx;
margin-right: 16rpx;
border-radius: 4px;
background: linear-gradient(180deg, #3F4357 0%, #252532 100%);
border-radius: 4rpx;
opacity: 1;
text-align: center;
font-size: 18rpx;
font-weight: 500;
line-height: 32rpx;
color: #E8D0AF;
}
.popup-price-old {
margin-left: 20rpx;
font-size: 26rpx;
color: #959DA9;
text-decoration:line-through
color: #959da9;
text-decoration: line-through;
}
.popup-footer-btn {
width: 526rpx;
height: 80rpx;
margin-top: 30rpx;
font-size: 30rpx;
color: #fff;
background-color: #86C5E1;
border-radius: 4rpx;
background-color: #86c5e1;
border-radius: 4rpx;
}
.popup-close-btn {
......@@ -255,11 +329,49 @@ Page {
min-width: 262rpx !important;
min-height: 262prx !important;
}
.toast-image {
z-index: 1900;
}
image {
width: 100%;
height: 100%;
}
/* 商品详情样式 */
.banner {
position: relative;
width: 606rpx;
height: 382rpx;
border-radius: 4px;
background: #FFFFFF;
}
.banner-swiper,
.banner-swiper-item,
.banner-swiper-image {
position: absolute;
top: 0 !important;
left: 0 !important;
width: 606rpx;
height: 382rpx;
}
.banner-wave {
z-index: 1100;
position: absolute;
bottom: -2rpx;
left: 0;
width: 606rpx;
height: 50rpx;
}
.banner-wave image {
width: 606rpx;
height: 50rpx;
}
\ No newline at end of file
pages/commodity/project-detail/project-detail.js 0 → 100644
// pages/commodity/project-detail/project-detail.js
Page({
data: {
projectType: 3, // 1 儿童营地，2 - SPA，3 - 文创
titleText: '',
bgColor: '',
backgroundImg: '',
projectList: []
},
onLoad: function (options) {
let { projectType } = this.data
switch (projectType) {
case 1:
this.setData({
titleText: '儿童营地',
backgroundImg: '',
bgColor: 'linear-gradient(180deg, rgba(246, 218, 218, 0) 0%, #F6DADA 100%)',
projectList: [
{
id: 0,
cover: '',
name: '儿童营地日票（次票）',
priceSpecial: '10',
price: '49',
unit: '次',
btn: '购买门票',
isSpecial: true
},
{
id: 1,
cover: '',
name: '儿童营地日票（套票）',
priceSpecial: '80',
price: '100',
unit: '次',
btn: '购买门票',
isSpecial: true
},
{
id: 2,
cover: '',
name: '儿童营地月卡',
priceSpecial: '300',
price: '500',
unit: '人',
btn: '购买门票',
isSpecial: true
},
{
id: 3,
cover: '',
name: '儿童营地年卡',
priceSpecial: '1680',
price: '2680',
unit: '人',
btn: '购买门票',
isSpecial: true
}
]
})
break
case 2:
this.setData({
titleText: '元养水韵SPA服务',
backgroundImg: '',
bgColor: '#8FC3CB',
projectList: [
{
id: 0,
cover: '',
name: '泰国皇室经典SPA芳香精油理疗套餐',
msg: '保湿补水，深层清洁，提亮肤色',
priceSpecial: '120',
price: '180',
btn: '购买',
isSpecial: true
},
{
id: 1,
cover: '',
name: '全身舒缓释压芳香SPA护理',
msg: '保湿补水，深层清洁，提亮肤色',
priceSpecial: '120',
price: '180',
btn: '购买',
isSpecial: false
},
]
})
break
case 3:
this.setData({
titleText: '海错图购票',
backgroundImg: '',
bgColor: '#F5ECD8',
projectList: [
{
id: 0,
cover: '',
name: '海错图平日票',
priceSpecial: '42',
price: '49',
unit: '人',
btn: '购买门票',
isSpecial: true
},
{
id: 1,
cover: '',
name: '海错图周末票',
priceSpecial: '60',
price: '80',
unit: '人',
btn: '购买门票',
isSpecial: true
}
]
})
break
}
},
})
\ No newline at end of file
pages/commodity/project-detail/project-detail.json 0 → 100644
{
"usingComponents": {}
}
\ No newline at end of file
pages/commodity/project-detail/project-detail.wxml 0 → 100644
<navigation class="navigation" titleText="{{titleText}}" backIcon="/image/back.png"></navigation>
<view class="container con-s" style="background: {{bgColor}}">
<view class="background-img">
<image src="{{backgroundImg}}"></image>
</view>
<block wx:for="{{projectList}}" wx:key="id">
<view class="project-wrapper col">
<view class="project-cover">
<image src=""></image>
</view>
<view class="project-info">
<view class="project-name">
<text>{{item.name}}</text>
</view>
<view class="project-msg" wx:if="{{item.msg}}">
<text>{{item.msg}}</text>
</view>
<view class="project-price-wrapper row align-c">
<view class="price-special-msg" wx:if="{{item.isSpecial}}">
<text>业主价</text>
</view>
<view class="price-special">
<text class="price-symbol">￥</text>
<text>{{item.priceSpecial}}</text>
<text class="price-unit" wx:if="{{item.unit}}">{{'/' + item.unit}}</text>
</view>
<view class="price-old">
<text>{{'￥' + item.price}}</text>
<text class="price-old-unit" wx:if="{{item.unit}}">{{'/' + item.unit}}</text>
</view>
</view>
<view class="project-btn">
<text>{{item.btn}}</text>
</view>
</view>
</view>
</block>
</view>
\ No newline at end of file
pages/commodity/project-detail/project-detail.wxss 0 → 100644
.container {
height: 100%;
padding-bottom: 96rpx;
}
.background-img {
width: 750rpx;
height: 700rpx;
background-color: pink;
}
.project-wrapper {
margin-bottom: 48rpx;
border-radius: 4rpx;
}
.project-cover {
width: 670rpx;
height: 376rpx;
background-color: lightpink;
}
.project-info {
position: relative;
padding: 32rpx;
background-color: #fff;
}
.project-name {
color: #15191F;
font-size: 34rpx;
font-weight: 600;
line-height: 48rpx;
}
.project-msg {
margin-top: 16rpx;
color: #959DA9;
font-size: 26rpx;
line-height: 36rpx;
}
.project-price-wrapper {
height: 64rpx;
margin-top: 40rpx;
line-height: 64rpx;
}
.price-special-msg {
width: 78rpx;
height: 32rpx;
margin-right: 12rpx;
color: #E8D0AF;
font-size: 18rpx;
text-align: center;
line-height: 32rpx;
background: linear-gradient(180deg, #3F4357 0%, #252532 100%);
border-radius: 4rpx;
}
.price-special {
margin-right: 12rpx;
color: #EF4E4E;
font-size: 34rpx;
line-height: 34rpx;
font-weight: 600;
}
.price-symbol {
font-size: 24rpx;
}
.price-unit {
font-size: 20rpx;
}
.price-old {
margin-top: 10rpx;
color: #959DA9;
font-size: 22rpx;
line-height: 32rpx;
letter-spacing: 1rpx;
text-decoration: line-through;
}
.price-old-unit {
font-size: 18rpx;
}
.project-btn {
position: absolute;
right: 32rpx;
bottom: 32rpx;
width: 152rpx;
height: 64rpx;
color: #fff;
font-size: 26rpx;
line-height: 64rpx;
text-align: center;
background-color: #86C5E1;
border-radius: 4rpx;
}
image {
width: 100%;
height: 100%;
}
\ No newline at end of file
pages/commodity/project/project.js
Page({
data: {
projectType: 1, // 1 儿童营地，2 - SPA，3 - 文创， 5 - 餐品， 6 - 活动， 7 - 观影
bannerIndex: 0,
banner: [
{
......@@ -14,7 +15,106 @@ Page({
id: 2,
img: ''
}
]
],
projectAll: {
projectArt: {
projectType: 3,
btn: '购买门票',
titleImg: '',
list: [
{
id: 0,
cover: '',
name: '海错图平日票',
msg: {
0: '周一至周五'
},
priceSpecial: '42',
price: '49',
unit: '人'
},
{
id: 1,
cover: '',
name: '海错图平日票',
msg: {
0: '周六至周日'
},
priceSpecial: '42',
price: '49',
unit: '人'
}
]
},
projectSpa: {
projectType: 2,
btn: '查看服务',
list: [
{
id: '0',
name: 'SPA套餐',
cover: '',
priceSpecial: '298 - 698',
price: '300 - 900',
unit: '人'
}
]
},
projectChild: {
projectType: 1,
btn: '购买门票',
list: [
{
id: 0,
name: '日票（次票）',
priceSpecial: '10',
price: '49',
unit: '次',
msg: {
0: '单次进园',
1: '室外游乐设备免费',
2: '室内场馆及马场需单独收费'
}
},
{
id: 1,
name: '日票（套票）',
priceSpecial: '80',
price: '100',
unit: '次',
msg: {
0: '单次进园',
1: '室外游乐设备免费',
2: '室内场馆及马场均免费'
}
},
{
id: 2,
name: '儿童营地月卡',
priceSpecial: '300',
price: '500',
unit: '人',
msg: {
0: '一个月内无限次进园',
1: '室外游乐设备免费',
2: '室内场馆及马场均免费'
}
},
{
id: 3,
name: '儿童营地年卡',
priceSpecial: '1680',
price: '2680',
unit: '人',
msg: {
0: '一年内无限次进园',
1: '室外游乐设备免费',
2: '室内场馆及马场均免费'
}
}
]
}
}
},
onLoad: function (options) {
......
pages/commodity/project/project.wxml
......@@ -16,37 +16,47 @@
</view>
</view>
<block>
<block wx:for="{{projectAll}}" wx:for-index="key" wx:for-item="value">
<view class="project-wrapper">
<view class="project-title"></view>
<block>
<view class="project-title">
<image src="{{value.titleImg}}"></image>
</view>
<block wx:for="{{value.list}}">
<view class="project-item row">
<view class="project-cover">
<!-- <image></image> -->
<image src="{{item.cover}}"></image>
</view>
<view class="project-content row">
<view class="project-info">
<view class="project-name">
<text>海错图平日票</text>
<text></text>
<text>{{item.name}}</text>
</view>
<view class="project-msg col">
<text>周一至周五</text>
<text>周一至周五</text>
<text>周一至周五</text>
<block wx:for="{{item.msg}}" wx:for-index="k" wx:for-item="msg">
<text>{{msg}}</text>
</block>
</view>
</view>
<view class="project-price-wrapper col align-e">
<view class="project-price-special row align-c">
<view class="price-wrap">
<text class="price-symbol">￥</text>
<text class="price-special">42</text>
<text class="price-symbol">/人</text>
<text class="price-special">{{item.priceSpecial}}</text>
<text class="price-symbol">{{'/' + item.unit}}</text>
</view>
<view class="price-special-msg">
<text>业主价</text>
</view>
</view>
<view class="project-price-old">
<text class="price-old">{{'￥' + item.price}}</text>
<text class="price-symbol-old">/人</text>
</view>
<view class="project-buy-wrapper col align-e">
<view class="project-buy-btn">
<text>{{value.btn}}</text>
</view>
</view>
</view>
</view>
</view>
......
pages/commodity/project/project.wxss
.container {
height: 100%;
padding-bottom: 160rpx;
background: linear-gradient(180deg, #FFFFFF 0%, #F3F4F6 100%, #F3F4F6 100%, #F3F4F6 100%);
}
......@@ -41,6 +41,9 @@
padding-bottom: 50rpx;
border-bottom: 1px solid #E2E7EF;
}
.project-item:last-child {
border-bottom: none;
}
.project-cover {
width: 128rpx;
......@@ -50,7 +53,7 @@
.project-content {
margin-left: 24rpx;
width: 100%;
flex: 1;
}
.project-info {
......@@ -69,6 +72,8 @@
}
.project-price-wrapper {
flex: 1;
height: 100%;
width: 100%;
}
.project-price-special {
}
......@@ -96,6 +101,33 @@
background: linear-gradient(180deg, #3F4357 0%, #252532 100%);
border-radius: 4rpx;
}
.project-price-old {
height: 32rpx;
color: #959DA9;
line-height: 32rpx;
text-decoration: line-through;
}
.price-old {
font-size: 22rpx;
}
.price-symbol-old {
font-size: 20rpx;
}
.project-buy-wrapper {
flex: 1;
}
.project-buy-btn {
width: 120rpx;
height: 56rpx;
margin-top: 24rpx;
color: #fff;
font-size: 22rpx;
line-height: 56rpx;
text-align: center;
background-color: #86C5E1;
border-radius: 4rpx;
}
image {
width: 100%;
......
pages/commodity/shopping-cart/shopping-cart.js
// pages/shimao/index.js
let App = getApp()
Page({
data: {
totalNum: 3,
totalPrice: 840.00,
discount: 270.00,
allChecked: false,
isFoodCart: true,
isEnough: false,
cart: [
{
goods_id: 0,
goods_name: '雪碧迷你瓶装300ml',
goods_now_price: 49.00,
goods_old_price: 42.00,
goods_now_text: '业主价',
goods_num: 1,
store_num: 1,
checked: true,
img: './image/item01.png'
},
{
goods_id: 1,
goods_name: '可口可乐300ml',
goods_now_price: 52.00,
goods_old_price: 49.00,
goods_now_text: '活动价',
goods_num: 1,
store_num: 2,
checked: true,
img: './image/item01.png'
},
{
goods_id: 2,
goods_name: '葡萄汁饮料238ml',
goods_now_price: 30.00,
goods_num: 2,
checked: true,
img: './image/item01.png'
},
{
goods_id: 3,
goods_name: '牛奶苏打碳酸250ml',
goods_now_price: 78,
goods_num: 12,
checked: false,
img: './image/item01.png'
}
],
notEnough: [
{
id: 0,
img: './image/item01.png',
title: '葱爆牛肉佐秘制麻椒汁'
},
{
id: 1,
img: './image/item01.png',
title: '抹茶酸奶芝士'
imageBase: App.globalData.appImageBase,
resourcesBase: App.globalData.appResourcesBase,
shopId: '',
shopName: '',
shopLogo: '',
shoppingCart: [], // 购物车列表
shoppingCartSelection: 0, // 购物车选择数量
selectionTotal: 0, // 当前选择件数
allSelectionIsActive: false, // 全选按钮状态
amountPay: 0, // 支付金额
amountDiscount: 0, // 优惠金额
allChecked: false,
isFoodCart: true,
isEnough: false,
cart: [{
goods_id: 0,
goods_name: '雪碧迷你瓶装300ml',
goods_now_price: 49.00,
goods_old_price: 42.00,
goods_now_text: '业主价',
goods_num: 1,
store_num: 1,
checked: true,
img: './image/item01.png'
},
{
goods_id: 1,
goods_name: '可口可乐300ml',
goods_now_price: 52.00,
goods_old_price: 49.00,
goods_now_text: '活动价',
goods_num: 1,
store_num: 2,
checked: true,
img: './image/item01.png'
},
{
goods_id: 2,
goods_name: '葡萄汁饮料238ml',
goods_now_price: 30.00,
goods_num: 2,
checked: true,
img: './image/item01.png'
},
{
goods_id: 3,
goods_name: '牛奶苏打碳酸250ml',
goods_now_price: 78,
goods_num: 12,
checked: false,
img: './image/item01.png'
}
],
notEnough: [{
id: 0,
img: './image/item01.png',
title: '葱爆牛肉佐秘制麻椒汁'
},
{
id: 1,
img: './image/item01.png',
title: '抹茶酸奶芝士'
}
]
},
onLoad: function () {
this.setShopInfo()
// 读取上级页面的购物车数据，默认选中所有。
let funcShoppingCart = wx.getStorageSync('shoppingCartBuffer')
for (let i = 0, l = funcShoppingCart.length; i < l; i++) {
// 设置默认库存为 100 ，在提交订单时矫正为实际库存
funcShoppingCart[i].quantityMin = 1
funcShoppingCart[i].quantityMax = 100
funcShoppingCart[i].isActive = true
}
]
this.setData({
shoppingCart: funcShoppingCart
})
this.selectionTotal()
console.log(JSON.stringify(funcShoppingCart))
},
handleItemNumEdit(e) {
const operation = e.currentTarget.dataset.operation
const goods_id = e.currentTarget.dataset.id
let cart = this.data.cart
const index = cart.findIndex(v => v.goods_id === goods_id)
if ((cart[index].store_num === cart[index].goods_num) && operation === 1) {
console.log('没有库存')
} else if (cart[index].goods_num === 1 && operation === -1) {
wx.lin.showDialog({
type:"confirm",
title:"温馨提示",
content:"您是否要删除该商品？",
confirmColor: "#5DB5DD",
cancelColor: "#656E7B",
titleColor: "#15191F",
success: (res) => {
if (res.confirm) {
cart.splice(index, 1)
this.setCart(cart)
} else if (res.cancel) {
console.log('用户点击取消')
}
}
/**
* 设置本店信息
* @function
* @param
* @returns
*/
setShopInfo: function () {
let funcShopInfo = wx.getStorageSync('shopInfoBuffer')
this.setData({
shopId: funcShopInfo.id,
shopName: funcShopInfo.name,
shopLogo: funcShopInfo.logo
})
} else {
cart[index].goods_num += operation
this.setCart(cart)
}
console.log(this.data.shopLogo)
},
handleItemCheck(e) {
const goods_id = e.currentTarget.dataset.id
let cart = this.data.cart
const index = cart.findIndex(v => v.goods_id === goods_id)
cart[index].checked = !cart[index].checked
this.setCart(cart)
/**
* 勾选状态
* @function
* @param {object} - event
* @returns
*/
onChangeActive: function (event) {
let funcIndex = event.currentTarget.dataset.index
let funcActive = event.detail.checked
let funcShoppingCart = this.data.shoppingCart
funcShoppingCart[funcIndex].isActive = funcActive
this.setData({
shoppingCart: funcShoppingCart
})
this.selectionTotal()
},
handleItemAllCheck() {
let allChecked = !this.data.allChecked
let cart = this.data.cart
cart.forEach(v => v.checked = allChecked)
this.setCart(cart)
/**
* 减少商品数量
* @function
* @param {object} - event
* @returns
*/
onQuantityReduce: function (event) {
let funcIndex = event.currentTarget.dataset.index
let funcShoppingCart = this.data.shoppingCart
if (funcShoppingCart[funcIndex].quantity === 1) return
funcShoppingCart[funcIndex].quantity = funcShoppingCart[funcIndex].quantity - 1
this.setData({
shoppingCart: funcShoppingCart
})
this.selectionTotal()
},
/**
* 增加商品数量
* @function
* @param {object} - event
* @returns
*/
onQuantityAdd: function (event) {
let funcIndex = event.currentTarget.dataset.index
let funcShoppingCart = this.data.shoppingCart
if (funcShoppingCart[funcIndex].quantityMax < funcShoppingCart[funcIndex].quantity) return
funcShoppingCart[funcIndex].quantity = funcShoppingCart[funcIndex].quantity + 1
this.setData({
shoppingCart: funcShoppingCart
})
this.selectionTotal()
},
setCart(cart) {
let totalPrice = 0
let totalNum = 0
let allChecked = true
cart.forEach(v => {
if (v.checked) {
totalPrice += v.goods_now_price * v.goods_num
totalNum += 1
} else {
allChecked = false
/**
* 全选商品
* @function
* @param {object} - event
* @returns
*/
onSelectionAll: function (event) {
let funcActive = event.detail.checked
let funcShoppingCart = this.data.shoppingCart
for (let i = 0, l = funcShoppingCart.length; i < l; i++) {
funcShoppingCart[i].isActive = funcActive
}
})
allChecked = cart.length!=0 ? allChecked : false
this.setData({
cart,
allChecked,
totalPrice,
totalNum
})
this.setData({
shoppingCart: funcShoppingCart
})
this.selectionTotal()
},
/**
* 清空购物车
* @function
* @param {object} - event
* @returns
*/
onClearn: function () {
wx.lin.showDialog({
type: 'confirm',
title: '温馨提示',
content: '确定要清空购物车？',
confirmColor: '#5DB5DD',
cancelColor: '#656E7B',
titleColor: '#15191F',
success: (response) => {
if (response.confirm) {
// wx.setStorageSync('shoppingCartBuffer', [])
this.setData({
shoppingCart: []
})
this.selectionTotal()
} else if (response.cancel) {
console.log('用户点击取消')
}
}
})
},
handleClearCart() {
wx.lin.showDialog({
type:"confirm",
title:"温馨提示",
content:"确定要清空购物车？",
confirmColor: "#5DB5DD",
cancelColor: "#656E7B",
titleColor: "#15191F",
success: (res) => {
if (res.confirm) {
let cart = []
this.setCart(cart)
} else if (res.cancel) {
console.log('用户点击取消')
}
/**
* 计算当前需要结算的商品总数
* @function
* @param
* @returns
*/
selectionTotal: function () {
let funcCommodityTotal = 0 // 商品总数，包含选中与没有选中的
let funcSelectionTotal = 0 // 商品选择总数
let funcAmountPay = 0 // 支付金额
let funcAmountDiscount = 0 // 优惠金额
let funcShoppingCart = this.data.shoppingCart
for (let i = 0, l = funcShoppingCart.length; i < l; i++) {
funcCommodityTotal = funcCommodityTotal + funcShoppingCart[i].quantity
if (funcShoppingCart[i].isActive) {
funcSelectionTotal = funcSelectionTotal + funcShoppingCart[i].quantity
// 根据价格类型计算优惠金额
// funcAmountDiscount 是原价累计数值，最后减去特价即是优惠金额
switch (funcShoppingCart[i].priceType) {
case 1:
// 活动价
funcAmountPay = funcAmountPay + funcShoppingCart[i].priceDiscount * funcShoppingCart[i].quantity
funcAmountDiscount = funcAmountDiscount + funcShoppingCart[i].price * funcShoppingCart[i].quantity
break
case 2:
// 业主价
funcAmountPay = funcAmountPay + funcShoppingCart[i].priceSpecial * funcShoppingCart[i].quantity
funcAmountDiscount = funcAmountDiscount + funcShoppingCart[i].price * funcShoppingCart[i].quantity
break
case 3:
// 普通价
funcAmountPay = funcAmountPay + funcShoppingCart[i].price * funcShoppingCart[i].quantity
funcAmountDiscount = funcAmountDiscount + funcShoppingCart[i].price * funcShoppingCart[i].quantity
break
}
}
}
})
// 格式化金额
funcAmountDiscount = funcAmountDiscount - funcAmountPay
funcAmountPay = App.modular.utils.formatAmount(funcAmountPay)
funcAmountDiscount = App.modular.utils.formatAmount(funcAmountDiscount)
this.setData({
amountPay: funcAmountPay,
amountDiscount: funcAmountDiscount,
selectionTotal: funcSelectionTotal,
allSelectionIsActive: funcCommodityTotal === funcSelectionTotal ? true : false,
})
// 只要改变购物车数据就缓存
wx.setStorageSync('shoppingCartBuffer', this.data.shoppingCart)
},
handleOrderPay() {
let isEnough = true
this.setData({
isEnough
})
onPaySubmit: function () {
// let isEnough = true
// this.setData({
// isEnough
// })
// 在此之前需要校验用户是否登录，以及商品库存是否充足
wx.navigateTo({
url: '/pages/pay/order-input/order-input?type=5' + '&amount=' + this.data.amountPay
})
},
handleItemAllCheck() {
let allChecked = !this.data.allChecked
let cart = this.data.cart
cart.forEach(v => v.checked = allChecked)
},
handleBackCart() {
let isEnough = false
this.setData({
isEnough
})
let isEnough = false
this.setData({
isEnough
})
},
})
\ No newline at end of file
})
\ No newline at end of file
pages/commodity/shopping-cart/shopping-cart.json
{
"usingComponents": {
"Tips": "../../../component/Tips/Tips",
"Blank": "../../../component/Blank/Blank"
},
"navigationStyle": "default",
"navigationBarBackgroundColor": "#fff",
"navigationBarTitleText": "购物车"
"usingComponents": {
"Tips": "../../../component/Tips/Tips"
}
}
\ No newline at end of file
pages/commodity/shopping-cart/shopping-cart.wxml
<view class="header row align-c">
<view class="header_img">
<image mode="aspectFill" src="./image/item01.png" />
</view>
<view class="header_title">儿童营地</view>
<view class="header_clear row align-c" bindtap="handleClearCart">清空</view>
<!-- 清空弹窗 -->
<l-dialog l-content-class="l-content" l-cancel-class="l-cancel" title-color="#15191F" cancel-color="#656E7B" confirm-color="#5DB5DD"/>
</view>
<navigation class="navigation" titleText="购物车" background="#FFFFFF;" backIcon="/image/back.png"></navigation>
<scroll-view scroll-y class="item_list">
<view class="item row" wx:for="{{cart}}" wx:key="id">
<radio-group class="item_checked" bindtap="handleItemCheck" data-id="{{item.goods_id}}">
<radio checked="{{item.checked}}" color="#86C5E1"></radio>
</radio-group>
<view class="item_img">
<image src="{{item.img}}" mode="widthFix"/>
<view class="container">
<view class="shop-info row align-c">
<image wx:if="{{shopLogo}}" mode="aspectFill" src="{{resourcesBase + 'commodity/' + shopLogo}}" />
<text bindtap="onClearn">清空</text>
</view>
<view class="item_info">
<view class="item_info_title">{{item.goods_name}}</view>
<view class="item_info_now_price row align-c">
<view><text>￥</text>{{item.goods_now_price}}</view>
<view
class="item_now_price_text {{item.goods_now_text === '业主价' ? 'vipPrice' : ''}}"
wx:if="{{item.goods_now_text}}"
>
{{item.goods_now_text}}
</view>
<view class="goods_num_tool_wrapper col align-e">
<view class="goods_num_tool row con-c align-c">
<!-- <l-counter l-class="l-counter" l-symbol-class="l-symbol" l-disabled-class="l-disabled" l-count-class="l-count" count="{{item.goods_num}}" min="0" max="{{item.store_num}}"></l-counter> -->
<view
class="num_edit row con-c align-c"
bindtap="handleItemNumEdit"
data-id="{{item.goods_id}}"
data-operation="{{-1}}"
>-</view>
<view class="goods_num row con-c align-c">{{item.goods_num}}</view>
<view
class="num_edit row con-c align-c {{item.store_num === item.goods_num ? 'disable' : ''}}"
bindtap="handleItemNumEdit"
data-id="{{item.goods_id}}"
data-operation="{{1}}"
>+</view>
</view>
<view wx:if="{{item.store_num < 5}}" class="lack_wraning">仅剩{{item.store_num}}件</view>
</view>
</view>
<view class="item_info_old_price" wx:if="{{item.goods_old_price}}">
<text class="price_symbol">￥</text>
<text>{{item.goods_old_price}}</text>
</view>
<!-- 商品数量列表 -->
<view class="shopping-cart-list">
<block wx:for="{{shoppingCart}}" wx:for-index="index" wx:for-item="item" wx:key="index">
<view class="list-item row">
<view class="list-item-cover row align-c">
<l-checkbox-group l-class="list-item-selection" data-index="{{index}}" bind:linchange="onChangeActive">
<l-checkbox custom="{{true}}" checked="{{item.isActive}}" size="40rpx">
<image hidden="{{!item.isActive}}" class="list-item-selection-icon" src="/image/icon/selection-active.png" slot="icon"></image>
<image hidden="{{item.isActive}}" class="list-item-selection-icon" src="/image/icon/selection-inactive.png" slot="icon"></image>
</l-checkbox>
</l-checkbox-group>
<image src="{{item.cover}}" mode="widthFix"></image>
</view>
<view class="list-item-info col">
<view class="list-item-name">
<text>{{item.name}}</text>
</view>
<view class="list-item-other row con-b">
<!-- 活动价样式 -->
<view class="list-item-price" wx:if="{{item.priceType === 1}}">
<view class="list-item-price-main row align-c">
<text>¥</text>
<text>{{item.priceDiscountText}}</text>
<text class="price-discount">活动价</text>
</view>
<view class="list-item-price-minor row">
<text>¥</text>
<text>{{item.priceText}}</text>
</view>
</view>
<!-- 业主价样式 -->
<view class="list-item-price" wx:if="{{item.priceType === 2}}">
<view class="list-item-price-main row align-c">
<text>¥</text>
<text>{{item.priceSpecialText}}</text>
<text class="price-special">业主价</text>
</view>
<view class="list-item-price-minor row">
<text>¥</text>
<text>{{item.priceText}}</text>
</view>
</view>
<!-- 普通价样式 -->
<view class="list-item-price" wx:if="{{item.priceType === 3}}">
<view class="list-item-price-main row align-c">
<text>¥</text>
<text>{{item.priceText}}</text>
<text></text>
</view>
<view class="list-item-price-minor row">
<text></text>
<text></text>
</view>
</view>
<view class="list-item-quantity col con-e align-e">
<view class="list-item-quantity-operation row con-b align-c">
<text class="{{item.quantity === item.quantityMin ? 'list-item-quantity-disable' : ''}}" data-index="{{index}}" bindtap="onQuantityReduce">-</text>
<text>{{item.quantity}}</text>
<text class="{{item.quantityMax < item.quantity ? 'list-item-quantity-disable' : ''}}" data-index="{{index}}" bindtap="onQuantityAdd">+</text>
</view>
<view class="list-item-quantity-warning">
<text>{{item.quantityMax < 5 ? '仅剩' + item.quantityMax + '件' : ''}}</text>
</view>
</view>
</view>
</view>
</view>
</block>
</view>
</view>
</scroll-view>
<!-- 只有在食品购物车才出现 -->
<view class="tips-wrapper" wx:if="{{isFoodCart && cart.length > 0}}" >
<Tips text="请在下单内3天内取餐，逾期无效"></Tips>
</view>
<view class="footer row con-c align-c">
<view class="all_chk_wrap row con-c align-c">
<radio-group>
<radio color="#86C5E1" checked="{{allChecked}}" bindtap="handleItemAllCheck">已选 ({{totalNum}})</radio>
</radio-group>
</view>
<view class="total_price_wrap">
<view class="total_price">
￥<text class="total_price_text">{{totalPrice}}</text>
<!-- 只有在食品购物车才出现 -->
<view class="pay-tip" wx:if="{{isFoodCart && cart.length > 0}}">
<Tips text="请在下单内3天内取餐，逾期无效"></Tips>
</view>
<view class="total_discount">共{{totalNum}}件，优惠 ￥{{discount}}</view>
</view>
<view class="order_pay_wrap row con-c align-c" bindtap="handleOrderPay">结算</view>
<!-- 库存提示弹窗 -->
<l-popup show="{{isEnough}}" content-align="center" locked="{{true}}">
<view class="popup_wrap">
<view class="popup_title">抱歉，您本单商品有2件库存不足</view>
<view class="popup_list">
<view class="popup_item row align-c" wx:for="{{notEnough}}" wx:key="id">
<view class="popup_item_img">
<image mode="widthFix" src="{{item.img}}"></image>
</view>
<view class="popup_item_title">{{item.title}}</view>
</view>
<view class="pay row con-c align-c">
<!-- 选择计数 -->
<view class="pay-selection row con-c align-c">
<l-checkbox-group l-class="list-item-selection" bind:linchange="onSelectionAll">
<l-checkbox custom="{{true}}" checked="{{allSelectionIsActive}}" size="40rpx">
<image hidden="{{!allSelectionIsActive}}" class="list-item-selection-icon" src="/image/icon/selection-active.png" slot="icon"></image>
<image hidden="{{allSelectionIsActive}}" class="list-item-selection-icon" src="/image/icon/selection-inactive.png" slot="icon"></image>
</l-checkbox>
</l-checkbox-group>
<text>全选</text>
</view>
<view class="popup_back_cart row con-c align-c" bindtap="handleBackCart">返回购物车</view>
</view>
<view class="popup_close_btn row con-c align-c" bindtap="handleClosePopup">
<view class="popup_close">
<image mode="widthFix" src="../../../image/icon_close.png"></image>
<view class="pay-amount">
<view class="pay-amount-total">
<text>￥</text>
<text>{{amountPay}}</text>
</view>
<view class="pay-amount-discount">
<text>{{'共' + selectionTotal + '件，优惠 ￥' + amountDiscount}}</text>
</view>
</view>
</view>
</l-popup>
<view class="order_pay_wrap row con-c align-c" bindtap="onPaySubmit">结算</view>
<!-- 库存提示弹窗 -->
<l-popup show="{{isEnough}}" content-align="center" locked="{{true}}">
<view class="popup_wrap">
<view class="popup_title">抱歉，您本单商品有2件库存不足</view>
<view class="popup_list">
<view class="popup_item row align-c" wx:for="{{notEnough}}" wx:key="id">
<view class="popup_item_img">
<image mode="widthFix" src="{{item.img}}"></image>
</view>
<view class="popup_item_title">{{item.title}}</view>
</view>
</view>
<view class="popup_back_cart row con-c align-c" bindtap="handleBackCart">返回购物车</view>
</view>
<view class="popup_close_btn row con-c align-c" bindtap="handleClosePopup">
<view class="popup_close">
<image mode="widthFix" src="../../../image/icon_close.png"></image>
</view>
</view>
</l-popup>
</view>
</view>
<Blank></Blank>
<!-- 清空弹窗 -->
<l-dialog l-content-class="l-content" l-cancel-class="l-cancel" title-color="#15191F" cancel-color="#656E7B" confirm-color="#5DB5DD"></l-dialog>
\ No newline at end of file
pages/commodity/shopping-cart/shopping-cart.wxss
Page {
position: relative;
height: 100%;
position: relative;
height: 100%;
}
.header {
width: 100%;
height: 116rpx;
padding: 16rpx 40rpx;
font-size: 30rpx;
.navigation {
z-index: 1100;
position: fixed;
top: 0;
left: 0;
width: 750rpx;
}
.header_img {
width: 112rpx;
height: 84rpx;
.container {
margin-top: 150rpx;
}
.header_img image {
width: 100%;
height: 100%;
.shop-info {
width: 750rpx;
height: 116rpx;
padding: 16rpx 40rpx;
font-size: 30rpx;
}
.header_title {
flex: 1;
color: #C36069;
.shop-info > image {
width: 400rpx;
height: 100rpx;
}
.header_clear {
height: 100%;
color: #656E7B;
.shop-info > text {
flex-grow: 1;
height: 100rpx;
text-align: right;
line-height: 100rpx;
color: #656e7b;
}
.l-content {
color: #959DA9 !important;
color: #959da9 !important;
}
.item_list {
width: 100%;
height: calc(100vh - 390rpx);
margin-top: 10rpx;
/* 购物车列表 */
.shopping-cart-list {
width: 750rpx;
margin-top: 50rpx;
padding-bottom: 200rpx;
}
.item {
width: 100%;
height: 250rpx;
padding: 0 40rpx;
box-sizing: border-box;
.list-item {
width: 100%;
height: 250rpx;
padding: 0 40rpx;
}
.item_checked {
width: 40rpx;
height: 40rpx;
margin-top: 54rpx;
.list-item-selection,
.list-item-selection-icon {
width: 40rpx;
height: 40rpx;
}
.item_img {
width: 148rpx;
height: 148rpx;
margin-left: 24rpx;
.list-item-cover {
height: 148rpx;
}
.item_info {
flex: 1;
margin-left: 28rpx;
.list-item-cover > image {
width: 148rpx;
height: 148rpx;
margin: 0 30rpx 0 24rpx;
}
.item_info_title {
font-size: 30rpx;
color: #15191F;
.list-item-info {
width: 430rpx;
min-height: 168rpx;
}
.item_info_now_price {
margin-top: 66rpx;
font-size: 30rpx;
color: #15191F;
.list-item-name {
min-height: 108rpx;
font-size: 30rpx;
font-weight: 500;
line-height: 42rpx;
color: #15191F;
}
.item_now_price_text {
width: 78rpx;
height: 32rpx;
margin-left: 4px;
font-size: 18rpx;
color: #EF4E4E;
line-height: 32rpx;
text-align: center;
background: rgba(213, 107, 82, .12);
border-radius: 4rpx;
}
.vipPrice {
color: #E8D0AF;
background: linear-gradient(180deg, #3F4357 0%, #252532 100%);
border-radius: 4rpx;
opacity: 1;
.list-item-price-main text:nth-child(1) {
height: 42rpx;
font-size: 22rpx;
font-weight: 500;
line-height: 42rpx;
color: #15191F;
}
.goods_num_tool_wrapper {
flex: 1;
position: relative;
.list-item-price-main text:nth-child(2) {
height: 42rpx;
margin-right: 8rpx;
font-size: 30rpx;
font-weight: 500;
line-height: 42rpx;
color: #15191F;
}
.goods_num_tool {
width: 168rpx;
height: 48rpx;
padding: 12rpx 0;
box-sizing: border-box;
border: 1px solid #DBDFE5;
border-radius: 4rpx;
.list-item-price-main .price-discount {
width: 78rpx;
height: 32rpx;
border-radius: 4px;
background: #FAEDEA;
text-align: center;
font-size: 18rpx;
font-weight: 500;
line-height: 30rpx;
color: #EF4E4E;
}
.l-counter {
border: 1px solid #DBDFE5;
border-radius: 4rpx;
box-sizing: border-box;
.list-item-price-main .price-special {
width: 78rpx;
height: 32rpx;
border-radius: 4px;
background: linear-gradient(180deg, #3F4357 0%, #252532 100%);
text-align: center;
font-size: 18rpx;
font-weight: 500;
line-height: 30rpx;
color: #E8D0AF;
}
.l-symbol, .l-disabled, .l-count {
background-color: #fff !important;
.list-item-price-minor text {
height: 32rpx;
font-size: 22rpx;
font-weight: 400;
line-height: 32rpx;
color: #959DA9;
}
.l-symbol, .l-count {
color: #15191F !important;
.list-item-quantity {
flex-grow: 1;
}
.l-count {
border-left: 1px solid #DBDFE5;
border-right: 1px solid #DBDFE5;
min-height: 0rpx !important;
.list-item-quantity-operation {
width: 168rpx;
height: 48rpx;
padding: 0 16rpx;
border: 1px solid #DBDFE5;
border-radius: 4px;
}
.num_edit {
flex: 1;
.list-item-quantity-operation text:nth-child(1) {
width: 24rpx;
height: 24rpx;
line-height: 24rpx;
}
.goods_num {
flex: 1;
border-left: 1px solid #DBDFE5;
border-right: 1px solid #DBDFE5;
.list-item-quantity-operation text:nth-child(2) {
height: 36rpx;
font-size: 26rpx;
font-weight: 500;
line-height: 36rpx;
color: #15191F;
}
.disable {
color: #DBDFE5;
.list-item-quantity-operation text:nth-child(3) {
width: 24rpx;
height: 24rpx;
line-height: 24rpx;
}
.lack_wraning {
position: absolute;
top: 56rpx;
right: 84rpx;
transform: translateX(50%);
color: #D92B3A;
font-size: 22rpx;
.list-item-quantity-disable {
color: #CDD1D7;
}
.item_info_old_price {
margin-top: 4rpx;
font-size: 22rpx;
color: #959DA9;
text-decoration:line-through
.list-item-quantity-warning {
width: 168rpx;
height: 32rpx;
margin-top: 8rpx;
text-align: center;
font-size: 22rpx;
font-weight: 400;
line-height: 32rpx;
color: #D92B3A;
}
text {
font-size: 22rpx;
.pay-tip {
position: fixed;
left: 0;
bottom: 200rpx;
width: 750rpx;
height: 72rpx;
}
.tips-wrapper {
position: absolute;
left: 0;
bottom: 196rpx;
width: 100%;
/* 结算区域 */
.pay {
position: fixed;
left: 0;
bottom: 0;
width: 750rpx;
height: 200rpx;
padding: 0 40rpx 36rpx 36rpx;
border-top: 1px solid #E2E7EF;
background: #FFFFFF;
}
.footer {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
height: 196rpx;
background-color: #fff;
display: flex;
padding: 0 40rpx 36rpx 36rpx;
box-sizing: border-box;
border-top: 1px solid #E2E7EF;
.pay-selection {
height: 36rpx;
font-size: 26rpx;
font-weight: 400;
line-height: 36rpx;
color: #15191F;
}
.all_chk_wrap {
flex: 3;
font-size: 26rpx;
color: #15191F;
.pay-selection text {
margin-left: 8rpx;
}
.total_price_wrap {
flex: 5;
text-align: right;
padding-right: 32rpx;
.pay-amount {
flex: 5;
text-align: right;
padding-right: 32rpx;
}
.total_price {
color: #86C5E1;
.pay-amount-total {
height: 53rpx;
font-size: 30rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
line-height: 42rpx;
color: #5DB5DD;
}
.total_price_text {
font-size: 44rpx;
.pay-amount-total text:nth-child(2) {
font-size: 38rpx;
}
.total_discount {
font-size: 22rpx;
.pay-amount-discount {
height: 32rpx;
font-size: 22rpx;
font-weight: 400;
line-height: 32rpx;
color: #15191F;
}
.order_pay_wrap {
width: 188rpx;
height: 96rpx;
font-size: 30rpx;
color: #fff;
background-color: #86C5E1;
width: 188rpx;
height: 96rpx;
font-size: 30rpx;
color: #fff;
background-color: #86c5e1;
}
.popup_wrap {
width: 606rpx;
height: 690rpx;
padding: 0 40rpx;
background-color: #fff;
border-radius: 4rpx;
width: 606rpx;
height: 690rpx;
padding: 0 40rpx;
background-color: #fff;
border-radius: 4rpx;
}
.popup_title {
padding: 56rpx 0;
font-size: 34rpx;
font-weight: 600;
color: #15191F;
text-align: center;
border-bottom: 1px solid #E2E7EF;
padding: 56rpx 0;
font-size: 34rpx;
font-weight: 600;
color: #15191f;
text-align: center;
border-bottom: 1px solid #e2e7ef;
}
.popup_list {
padding: 26rpx 0;
padding: 26rpx 0;
}
.popup_item {
padding: 32rpx 0;
padding: 32rpx 0;
}
.popup_item_img {
width: 96rpx;
height: 96rpx;
width: 96rpx;
height: 96rpx;
}
.popup_item_title {
margin-left: 32rpx;
font-size: 30rpx;
color: #15191F;
margin-left: 32rpx;
font-size: 30rpx;
color: #15191f;
}
.popup_back_cart {
width: 526rpx;
height: 80rpx;
margin-top: 32rpx;
font-size: 30rpx;
color: #fff;
background-color: #86C5E1;
width: 526rpx;
height: 80rpx;
margin-top: 32rpx;
font-size: 30rpx;
color: #fff;
background-color: #86c5e1;
}
image {
width: 100%;
height: 100%;
width: 100%;
height: 100%;
}
\ No newline at end of file
pages/commodity/snacks/snacks.js deleted 100644 → 0
Page({
data: {
currentIndex: 0,
scrollTop: 0,
rightTitle: '优惠套餐',
showPopup: false,
showAddSucc: false,
hideAnimation: true,
leftMenuList: [
{
id: 0,
tab: '优惠套餐'
},
{
id: 1,
tab: '时令美食'
},
{
id: 2,
tab: '当地食材'
},
{
id: 3,
tab: '沙拉'
},
{
id: 4,
tab: '小食'
},
{
id: 5,
tab: '汤品'
},
{
id: 6,
tab: '主菜'
},
{
id: 7,
tab: '主食'
},
{
id: 8,
tab: '甜品'
},
{
id: 9,
tab: '饮品'
}
],
goodsItem: {
goods_id: 0,
goods_name: '雪碧迷你瓶装300ml',
goods_text: '可口可乐公司推出的柠檬味汽水，新装出道，即刻酷爽',
goods_now_price: 49.00,
goods_old_price: 42.00,
goods_now_text: '业主价',
goods_num: 1,
checked: true,
img: './image/cola.png'
},
cart: [
{
goods_id: 0,
goods_name: '雪碧迷你瓶装300ml',
goods_text: '可口可乐公司推出的柠檬味汽水，新装出道，即刻酷爽',
goods_now_price: 49.00,
goods_old_price: 42.00,
goods_now_text: '业主价',
goods_num: 1,
checked: true,
img: './image/cola.png'
},
{
goods_id: 1,
goods_name: '可口可乐300ml',
goods_text: '可口可乐公司推出的柠檬味汽水，新装出道，即刻酷爽',
goods_now_price: 52.00,
goods_old_price: 49.00,
goods_now_text: '活动价',
goods_num: 1,
checked: true,
img: './image/cola.png'
},
{
goods_id: 2,
goods_name: '葡萄汁饮料238ml',
goods_now_price: 30.00,
goods_num: 2,
checked: true,
img: './image/cola.png'
},
{
goods_id: 3,
goods_name: '牛奶苏打碳酸250ml',
goods_text: '可口可乐公司推出的柠檬味汽水，新装出道，即刻酷爽',
goods_now_price: 78,
goods_num: 12,
checked: false,
img: './image/cola.png'
}
],
popupObj: {
goods_now_text: '业主价'
}
},
onLoad() {
this.animationDown = wx.createAnimation({
duration: 400,
timingFunction: 'ease'
})
},
handleItemTap(e) {
let index = e.currentTarget.dataset.index
let rightTitle = this.data.leftMenuList[index].tab
this.setData({
currentIndex: index,
rightTitle,
scrollTop: 0
})
},
handleAddCartPopup() {
let showPopup = true
this.setData({
showPopup
})
},
handleClosePopup() {
let showPopup = false
this.setData({
showPopup,
})
},
handleAddCart() {
let showPopup = false
let showAddSucc = true
let hideAnimation = false
this.animationDown.translateY(180).step()
this.setData({
showPopup,
showAddSucc,
hideAnimation,
})
setTimeout(() => {
this.setData({
animationDown: this.animationDown.export()
})
})
setTimeout(() => {
this.animationDown.translateY(0).step()
let hideAnimation = true
this.setData({
hideAnimation,
animationDown: this.animationDown.export()
})
}, 400)
},
goToCart() {
wx.navigateTo({
url: '/pages/commodity/shopping-cart/shopping-cart',
})
}
})
\ No newline at end of file
pages/commodity/snacks/snacks.json deleted 100644 → 0
{
"usingComponents": {
"Blank": "../../../component/Blank/Blank"
},
"navigationBarTitleText": "购物车",
"navigationStyle": "default",
"navigationBarBackgroundColor": "#fff"
}
\ No newline at end of file
pages/commodity/snacks/snacks.wxml deleted 100644 → 0
<view class="cates">
<view class="cates-container">
<!-- 左边菜单 -->
<scroll-view scroll-y enhanced="true" show-scrollbar="false" class="left-menu">
<view
class="menu-item {{currentIndex === index ? 'active' : ''}}"
wx:for="{{leftMenuList}}"
wx:key="id"
bindtap="handleItemTap"
data-index="{{index}}"
>
{{item.tab}}
</view>
</scroll-view>
<!-- 右边内容 -->
<scroll-view scroll-top="{{scrollTop}}" scroll-y class="right-content">
<view class="right-content-title">{{rightTitle}}</view>
<view class="item row" wx:for="{{cart}}" wx:key="id" bindtap="handleAddCartPopup">
<view class="item-img">
<image src="{{item.img}}" mode="widthFix"/>
</view>
<view class="item-info">
<view class="item-info-title">{{item.goods_name}}</view>
<view class="item-info-text-wrap">
<view wx:if="{{item.goods_text}}">{{item.goods_text}}</view>
<view wx:else class="item-info-content"></view>
</view>
<view class="item-info-now-price row align-c">
<view>
<text class="price-symbol">￥</text>
<text class="price">{{item.goods_now_price}}</text>
</view>
<view
class="item-now-price-text {{item.goods_now_text === '业主价' ? 'vipPrice' : ''}}"
wx:if="{{item.goods_now_text}}"
>
{{item.goods_now_text}}
</view>
<view class="goods-add-btn-wrap row con-e" bindtap="handleAddCartPopup">
<l-button l-class="l-btn-circle" height="44" width="44" bg-color="#86C5E1" bind="handleAddCartPopup">
<image mode="widthFix" src="/image/add-w.png"></image>
</l-button>
</view>
</view>
<view class="item-info-old-price" wx:if="{{item.goods_old_price}}"><text>￥</text>{{item.goods_old_price}}</view>
</view>
</view>
<!-- 购物车按钮 -->
<view class="cart-btn row con-c align-c" bindtap="goToCart">
<view class="cart-num row con-c align-c">{{cart.length}}</view>
<view class="cart-img-wrap">
<image src="../../../image/cart.png" mode="widthFix"></image>
</view>
</view>
<!-- 购物车弹窗 -->
<l-popup show="{{showPopup}}" content-align="center" locked="{{true}}">
<view class="popup-wrap">
<view class="popup-img-wrapper">
<image mode="widthFix" src="./image/popup.png"></image>
</view>
<view class="popup-info-wrapper">
<view class="popuo-info-title">咖喱蔬菜大虾</view>
<view class="popup-info-text">新鲜可口的大虾，搭配咖喱与蔬菜，口感舒适，这个夏天，有你就够了</view>
</view>
<view class="popup-footer-wrapper">
<view class="popup-price-row row align-c">
<view class="popup-price-now">￥<text style="font-size: 38rpx">78.00</text></view>
<view class="popup-price-discount row con-c align-c {{popupObj.goods_now_text === '业主价' ? 'vipPrice' : ''}}">{{popupObj.goods-now-text}}</view>
<view class="popup-price-old">¥68.00</view>
</view>
<view class="popup-footer-btn row con-c align-c" bindtap="handleAddCart">加入购物车</view>
</view>
</view>
<view class="popup-close-btn row con-c align-c" bindtap="handleClosePopup">
<view class="popup-close">
<image mode="widthFix" src="../../../image/icon_close.png"></image>
</view>
</view>
</l-popup>
<!-- 添加成功 -->
<l-toast show="{{showAddSucc}}" l-image-class="toast-image" l-class="toast-bg" image="/image/success.png" title="添加购物车成功" />
<!-- 加入购物车动画 -->
<view class="redPoint {{hideAnimation ? 'animation-hide' : ''}}" animation="{{animationDown}}"></view>
</scroll-view>
</view>
</view>
\ No newline at end of file
pages/home/home/home.js
......@@ -62,7 +62,7 @@ Page({
})
var that = this
App.login({
success: function(token) {
success: function (token) {
that.getBanner()
that.loadVisiterPlanList()
that.getNoticeList()
......@@ -70,6 +70,17 @@ Page({
})
},
onShareAppMessage: function (res) {
if (res.from === 'button') {
// 来自页面内转发按钮
console.log(res.target)
}
return {
title: '自定义转发标题',
path: '/pages/home/home/home'
}
},
setNavigationLogo: function () {
this.setData({
navigationLogoTop: App.modular.utils.navigationElementCenterMarginTop(60)
......@@ -324,24 +335,17 @@ Page({
})
},
onTest2: function (event) {
wx.navigateTo({
url: '/pages/commodity/snacks/snacks'
})
},
onTest3: function (event) {
console.log(event)
wx.navigateTo({
url: '/pages/pay/order-detail/order-detail?type=' + event.currentTarget.dataset.index
})
},
onTest4: function (event) {
wx.navigateTo({
url: '/pages/pay/coupon-input/coupon-input'
})
},
onTest5: function (event) {
onShop: function (event) {
wx.navigateTo({
url: '/pages/pay/coupon-detail/coupon-detail?type=' + event.currentTarget.dataset.index
url: '/pages/commodity/menu-snacks/menu-snacks'
})
},
onTest6: function (event) {
......
pages/mine/order/order.js
......@@ -151,4 +151,10 @@ Page({
statusActive: Number(event.currentTarget.dataset.type)
})
},
onNavigationBack: function () {
wx.navigateBack({
delta: 1
})
},
})
\ No newline at end of file
pages/mine/order/order.wxml
<view class="navigation-order row con-b align-c">
<image src="{{imageBase + 'icon/arrow-l-1.png'}}"></image>
<image src="{{imageBase + 'icon/arrow-l-1.png'}}" bindtap="onNavigationBack"></image>
<view class="order-type row con-c align-c" bindtap="onOrderType">
<text>{{orderTypeTitle}}</text>
<image src="{{imageBase + 'icon/arrow-b-2.png'}}"></image>
......
pages/mine/order/order.wxss
......@@ -10,8 +10,8 @@
}
.navigation-order image {
width: 32rpx;
height: 32rpx;
width: 64rpx;
height: 64rpx;
}
.order-type {
......
pages/pay/order-comment/order-comment.js
......@@ -3,11 +3,12 @@ let App = getApp()
Page({
data: {
imageBase: App.globalData.appImageBase,
cur: -1,
scoreServe: 0, // 服务分数
scoreServeText: '0.0',
scoreProduct: 0, // 产品分数
scoreProductGray: 5,
scoreProductText: '0.0',
scoreEnvironment: 0, // 环境分数
scoreEnvironmentText: '0.0',
orderInfo: {
name: '精灵鸟理想国年卡',
price: '1680.00',
......@@ -36,25 +37,36 @@ Page({
* @returns
*/
onChangeScore: function (event) {
console.log(event)
const { index } = event.currentTarget.dataset
let { cur } = this.data
this.setData({
cur: index - 1
})
},
onChangeScoreProduct: function (event) {
const { type, index } = event.currentTarget.dataset
let { scoreProduct, scoreProductGray } = this.data
if (type === '1') {
scoreProduct = index + 1
} else {
scoreProduct += index + 1
const { index, type } = event.currentTarget.dataset
console.log(index, type)
let { scoreServe, scoreProduct, scoreEnvironment } = this.data
switch (type) {
case 1:
scoreServe = index + 1
break
case 2:
scoreProduct = index + 1
break
case 3:
scoreEnvironment = index + 1
break
}
scoreProductGray = 5 - scoreProduct
this.setData({
scoreServe,
scoreServeText: scoreServe.toFixed(1),
scoreProduct,
scoreProductGray
scoreProductText: scoreProduct.toFixed(1),
scoreEnvironment,
scoreEnvironmentText: scoreEnvironment.toFixed(1),
})
},
/**
* 输入框完成
* @function
* @param
* @returns
*/
eventInputDone: function (event) {
// console.log(event.detail.value)
}
})
\ No newline at end of file
pages/pay/order-comment/order-comment.wxml
......@@ -35,11 +35,16 @@
<view class="score-left">
<text>服务评价</text>
</view>
<view class="score-star">
<l-rate size="40" score="{{scoreServe}}" active-color="#F7BE6E" inActive-color="#F3F4F6" bind:linChange="onChangeScoreServe" />
<view class="score-star row">
<block wx:for="{{5}}" wx:key="index">
<view class="star" bindtap="onChangeScore" data-index="{{index}}" data-type="{{1}}">
<image wx:if="{{scoreServe >= index + 1}}" src="{{imageBase + 'star-yellow.png'}}"></image>
<image wx:elif="{{scoreServe < index + 1}}" src="{{imageBase + 'star-gray.png'}}"></image>
</view>
</block>
</view>
<view class="score">
<text>{{scoreServe + '星'}}</text>
<text>{{scoreServeText + '星'}}</text>
</view>
</view>
<view class="score-wrapper row align-c">
......@@ -47,37 +52,36 @@
<text>产品评价</text>
</view>
<view class="score-star row">
<block wx:for="{{scoreProduct}}" wx:key="index">
<image class="star" src="{{imageBase + 'star-yellow.png'}}" bindtap="onChangeScoreProduct" data-index="{{index}}" data-type="1"></image>
</block>
<block wx:for="{{scoreProductGray}}" wx:key="index">
<image class="star" src="{{imageBase + 'star-gray.png'}}" bindtap="onChangeScoreProduct" data-index="{{index}}" data-type="2"></image>
</block>
<!-- <block wx:for="{{5}}" wx:key="index">
<view class="star" bindtap="onChangeScore" data-index="{{index}}">
<image wx:if="{{cur >= n}}" src="{{imageBase + 'star-yellow.png'}}"></image>
<image wx:if="{{cur < n}}" src="{{imageBase + 'star-gray.png'}}"></image>
<block wx:for="{{5}}" wx:key="index">
<view class="star" bindtap="onChangeScore" data-index="{{index}}" data-type="{{2}}">
<image wx:if="{{scoreProduct >= index + 1}}" src="{{imageBase + 'star-yellow.png'}}"></image>
<image wx:elif="{{scoreProduct < index + 1}}" src="{{imageBase + 'star-gray.png'}}"></image>
</view>
</block> -->
</block>
</view>
<view class="score">
<text>{{scoreProduct + '星'}}</text>
<text>{{scoreProductText + '星'}}</text>
</view>
</view>
<view class="score-wrapper row align-c">
<view class="score-left">
<text>环境评价</text>
</view>
<view class="score-star">
<l-rate size="40" score="{{scoreEnvironment}}" active-color="#F7BE6E" inActive-color="#F3F4F6" bind:linChange="onChangeScore" />
<view class="score-star row">
<block wx:for="{{5}}" wx:key="index">
<view class="star" bindtap="onChangeScore" data-index="{{index}}" data-type="{{3}}">
<image wx:if="{{scoreEnvironment >= index + 1}}" src="{{imageBase + 'star-yellow.png'}}"></image>
<image wx:elif="{{scoreEnvironment < index + 1}}" src="{{imageBase + 'star-gray.png'}}"></image>
</view>
</block>
</view>
<view class="score">
<text>{{scoreEnvironment + '星'}}</text>
<text>{{scoreEnvironmentText + '星'}}</text>
</view>
</view>
<view class="order-comment">
<l-textarea placeholder="您的评价与建议，会让园区做的更好" placeholder-style="color: #C2C7CF" maxlength="200" l-class="l-textarea" />
<l-textarea placeholder="您的评价与建议，会让园区做的更好" placeholder-style="color: #C2C7CF" maxlength="200" l-class="l-textarea" border="{{false}}" bind:linblur="eventInputDone" />
<view class="order-picker">
<l-image-picker l-item-class="l-image-item" l-class="l-picker" count="9" size="3" size-type="compressed" custom="{{true}}">
<view class="col con-c align-c">
......
pages/pay/order-comment/order-comment.wxss
......@@ -99,7 +99,6 @@
}
.l-textarea {
height: 320rpx;
border: none !important;
}
.l-textarea > view {
color: #C2C7CF !important;
......
pages/pay/order-input/order-input.js
......@@ -15,6 +15,11 @@ let logicData = {
Page({
data: {
imageBase: App.globalData.appImageBase,
animation: {},
shopId: '',
shopName: '',
shopLogo: '',
orderType: 1, // 1 - 年卡/月卡，2 - 次票， 3 - SPA， 4 - 文创， 5 - 餐品， 6 - 活动， 7 - 观影
......@@ -40,17 +45,7 @@ Page({
buyContentAmount: '36.00',
// 购买清单
shoppingCartList: [{
cover: '',
name: '《海错图》超级豪华精致古风限量版折扇',
quantity: 12,
price: '60.50',
}, {
cover: '',
name: '《海错图》主题画册',
quantity: 12,
price: '60.50',
}],
shoppingCartList: [],
noticeText: '购买须知',
......@@ -70,16 +65,12 @@ Page({
// 购买人员信息
contactTitle: '填写购票人信息',
contactName: '',
contactPhone: '',
contactErrorName: '',
contactErrorPhone: '',
// 注册信息
// 用户信息
registerInfo: [],
// 立即支付
payAmount: '59.00',
payAmount: '',
// 购买须知详情
noticeDetail: App.globalData.appResourcesBase + 'pay/notice-detail.png',
......@@ -100,22 +91,36 @@ Page({
onLoad: function (options) {
if (options.type) options.type = Number(options.type)
if (options.passType) options.passType = Number(options.passType)
if (options.amount) {
this.setData({
payAmount: options.amount
})
}
// options.type = 7
// options.passType = 1
logicData.option = options
this.setView()
this.animation = wx.createAnimation({
duration: 700,
timingFunction: 'ease'
})
this.setShopInfo()
this.setShoppingCartData()
},
setView: function () {
this.setData({
registerInfo: [JSON.parse(JSON.stringify(logicData.registerInfoItem))]
})
switch (logicData.option.type) {
case 1:
let funcList = []
funcList.push(JSON.parse(JSON.stringify(logicData.registerInfoItem)))
this.setData({
orderType: logicData.option.type,
buyContent: this.data.buyPass[logicData.option.passType],
registerInfo: funcList,
winBuyContent: true, // 购买内容
winShoppingCart: false, // 购买清单
......@@ -262,8 +267,8 @@ Page({
winQuantity: true, // 数量选择
winContact: true, // 联系信息
winRegister: false, // 注册信息
winButtonPay: true, // 立即支付
winButtonAppointment: false, // 确认预约
winButtonPay: false, // 立即支付
winButtonAppointment: true, // 确认预约
})
break
}
......@@ -274,75 +279,100 @@ Page({
})
},
/**
* 设置本店信息
* @function
* @param
* @returns
*/
setShopInfo: function () {
let funcShopInfo = wx.getStorageSync('shopInfoBuffer')
this.setData({
shopId: funcShopInfo.id,
shopName: funcShopInfo.name,
shopLogo: funcShopInfo.logo
})
console.log(this.data.shopLogo)
},
setShoppingCartData: function () {
// 读取上级页面的购物车数据，默认选中所有。
let funcShoppingCart = wx.getStorageSync('shoppingCartBuffer')
console.log('funcShoppingCart', JSON.stringify(funcShoppingCart))
// 设置商品的最终提交价格，仅用于展示
for (let i = 0, l = funcShoppingCart.length; i < l; i++) {
switch (funcShoppingCart[i].priceType) {
case 1:
// 活动价
funcShoppingCart[i].priceConfirm = funcShoppingCart[i].priceDiscountText
break
case 2:
// 业主价
funcShoppingCart[i].priceConfirm = funcShoppingCart[i].priceSpecialText
break
case 3:
// 普通价
funcShoppingCart[i].priceConfirm = funcShoppingCart[i].priceText
break
}
}
onInputBlur: function(event) {
let funcType = event.target.dataset.type
let funcValue = event.detail.value
this.setData({
shoppingCartList: funcShoppingCart
})
},
/**
* 设置对应的用户数据
* @function
* @param
* @returns
*/
setUserInfo: function (funcType, funcValue, funcIndex, funcMessage) {
let funcRegisterInfo = this.data.registerInfo
switch (funcType) {
case 'name':
this.setData({
formName: funcValue
})
funcRegisterInfo[funcIndex].name = funcValue
funcRegisterInfo[funcIndex].errorName = funcMessage
break
case 'phone':
this.setData({
formPhone: funcValue
})
funcRegisterInfo[funcIndex].phone = funcValue
funcRegisterInfo[funcIndex].errorPhone = funcMessage
break
case 'idNum':
this.setData({
formPhone: funcValue
})
case 'identity':
funcRegisterInfo[funcIndex].identity = funcValue
funcRegisterInfo[funcIndex].errorIdentity = funcMessage
break
}
this.inspectForm()
this.setData({
registerInfo: funcRegisterInfo
})
},
inspectForm: function() {
if (this.data.formName === '') {
this.setData({
isSubmit: false,
errorName: '请填写姓名'
})
} else {
this.setData({
errorName: ''
})
}
if (this.data.formPhone === '') {
this.setData({
isSubmit: false,
errorPhone: '请输入正确的手机号码'
})
} else if (this.data.formPhone.length != 11) {
this.setData({
isSubmit: false,
errorPhone: '请输入正确的手机号码'
})
} else {
this.setData({
errorPhone: ''
})
}
onInputBlur: function(event) {
console.log(event)
let funcType = event.target.dataset.type
let funcIndex = event.target.dataset.index
let funcValue = event.detail.value
if (this.data.formIdNum === '') {
this.setData({
isSubmit: false,
errorIdNum: '请输入正确的身份证号'
})
} else if (this.data.formIdNum.length != 16) {
this.setData({
isSubmit: false,
errorIdNum: '请输入正确的身份证号'
})
} else {
this.setData({
errorIdNum: ''
})
switch (funcType) {
case 'name':
this.setUserInfo(funcType, funcValue, funcIndex, App.modular.rule.item('name', funcValue))
break
case 'phone':
this.setUserInfo(funcType, funcValue, funcIndex, App.modular.rule.item('phone', funcValue))
break
case 'identity':
this.setUserInfo(funcType, funcValue, funcIndex, App.modular.rule.item('identity', funcValue))
break
}
this.setData({
isSubmit: true
})
},
/**
......@@ -352,9 +382,22 @@ Page({
* @returns
*/
onNotice: function () {
// 初始底部弹出动画
let funcUnitProportion = wx.getStorageSync('unitProportion')
let funcMoveHeight = funcUnitProportion * 950
this.animation.translate(0, 0)
this.setData({
winNoticeDetail: true,
animation: this.animation.export()
})
let funcTimer = setTimeout(() => {
this.animation.translate(0, -funcMoveHeight).step()
this.setData({
animation: this.animation.export()
})
clearTimeout(funcTimer)
}, 100)
},
/**
......@@ -409,17 +452,103 @@ Page({
return
}
let funcRegisterInfo = this.data.registerInfo
funcRegisterInfo.push(JSON.parse(JSON.stringify(logicData.registerInfoItem)))
this.setData({
quantity: this.data.quantity + 1
quantity: this.data.quantity + 1,
registerInfo: funcRegisterInfo
})
},
if (this.data.orderType === 1) {
let funcRegisterInfo = this.data.registerInfo
funcRegisterInfo.push(JSON.parse(JSON.stringify(logicData.registerInfoItem)))
/**
* 检验数据是否都通过
* @function
* @param
* @returns
*/
inspectData: function () {
let funcPass = true
// 校验数组用户信息
let funcRegisterInfo = this.data.registerInfo
for (let i = 0, l = funcRegisterInfo.length; i < l; i++) {
if (funcRegisterInfo[i].name === '' || funcRegisterInfo[i].errorName !== '') {
funcPass = false
break
}
this.setData({
registerInfo: funcRegisterInfo
})
if (funcRegisterInfo[i].phone === '' || funcRegisterInfo[i].errorPhone !== '') {
funcPass = false
break
}
// 仅在需要的订单场景下校验
if ([1].indexOf(this.data.orderType) >= 0) {
if (funcRegisterInfo[i].identity === '' || funcRegisterInfo[i].errorIdentity !== '') {
funcPass = false
break
}
}
}
return funcPass
},
/**
* 提交订单
* @function
* @param
* @returns
*/
onPaySubmit: function () {
// 数据校验不通过
if (!this.inspectData()) return
// 整合商品数据
let funcCommodity = []
let funcShoppingCartList = this.data.shoppingCartList
for (let i = 0, l = funcShoppingCartList.length; i < l; i++) {
let funcItem = {
'smCommodity': {
'id': funcShoppingCartList[i].id,
},
'smInventory': {
'id': '',
},
'goodType': '',
'name': funcShoppingCartList[i].name,
'number': funcShoppingCartList[i].quantity,
'unitPrice': Number(funcShoppingCartList[i].priceConfirm),
'totalPrices': funcShoppingCartList[i].quantity * Number(funcShoppingCartList[i].priceConfirm)
}
funcCommodity.push(funcItem)
}
// 整合用户数据
let funcUserInfo = []
let funcRegisterInfo = this.data.registerInfo
for (let i = 0, l = funcRegisterInfo.length; i < l; i++) {
let funcItem = {
'name': funcRegisterInfo[i].name,
'cellphone': funcRegisterInfo[i].phone,
'identityCard': funcRegisterInfo[i].identity,
}
funcUserInfo.push(funcItem)
}
return
// 发送下单请求
App.wxRequest({
url: '/api/v1/order/doOrder',
data: {
'isPayment': 2,
'totalMoney': Number(this.data.payAmount),
'office': { 'id': this.data.shopId },
'smOrderDetails': funcCommodity,
'smPersonalDetails': funcUserInfo
},
success: (response) => {
let funcResponse = response.data
}
})
},
})
\ No newline at end of file
pages/pay/order-input/order-input.wxml
<!-- 购买须知详情 -->
<view class="notice-detail" wx:if="{{winNoticeDetail}}" bindtap="onNoticeClose">
<view class="notice-item" animation="{{animation}}">
<image src="{{noticeDetail}}"></image>
</view>
</view>
<view class="container">
<!-- winBuyContent -->
<view class="buy-content" wx:if="{{winBuyContent}}">
......@@ -99,14 +106,14 @@
<text>{{item.name}}</text>
</view>
<view class="shopping-cart-item-info col">
<text>¥123</text>
<text>x3</text>
<text>{{'¥' + item.priceConfirm}}</text>
<text>{{'x' + item.quantity}}</text>
</view>
</view>
</block>
<view class="shopping-cart-total row con-b align-c">
<text>总计</text>
<text>¥181.80</text>
<text>{{'¥' + payAmount}}</text>
</view>
</view>
</view>
......@@ -188,13 +195,13 @@
</view>
<view class="contact-input col">
<text>姓名</text>
<input placeholder="请输入姓名"></input>
<text>{{contactErrorName}}</text>
<input placeholder="请输入姓名" data-type="name" data-index="{{0}}" bindblur="onInputBlur"></input>
<text>{{registerInfo[0].errorName}}</text>
</view>
<view class="contact-input col">
<text>手机号</text>
<input placeholder="请输入手机号"></input>
<text>{{contactErrorPhone}}</text>
<input placeholder="请输入手机号" maxlength="11" data-type="phone" data-index="{{0}}" bindblur="onInputBlur"></input>
<text>{{registerInfo[0].errorPhone}}</text>
</view>
</view>
......@@ -214,37 +221,36 @@
</view>
<view class="contact-input col">
<text>姓名</text>
<input placeholder="请输入姓名"></input>
<input placeholder="请输入姓名" data-type="name" data-index="{{index}}" bindblur="onInputBlur"></input>
<text>{{item.errorName}}</text>
</view>
<view class="contact-input col">
<text>手机号</text>
<input placeholder="请输入手机号"></input>
<input placeholder="请输入手机号" maxlength="11" data-type="phone" data-index="{{index}}" bindblur="onInputBlur"></input>
<text>{{item.errorPhone}}</text>
</view>
<view class="contact-input col">
<text>身份证号</text>
<input placeholder="请输入身份证号"></input>
<input placeholder="请输入身份证号" data-type="identity" data-index="{{index}}" bindblur="onInputBlur"></input>
<text>{{item.errorIdentity}}</text>
</view>
</block>
</view>
<!-- winButtonPay -->
<view class="pay" wx:if="{{winButtonPay}}">
<view class="pay-tip row align-c">
<image src="{{imageBase + 'fail-icon-4.png'}}"></image>
<text>付款后一经确认不得退款</text>
</view>
<view class="pay-operation row con-b align-c">
<text>{{'¥' + payAmount}}</text>
<button class="row con-c align-c">立即支付</button>
</view>
</view>
</view>
<view class="notice-detail" wx:if="{{winNoticeDetail}}" bindtap="onNoticeClose">
<view class="notice-item">
<image src="{{noticeDetail}}"></image>
</view>
</view>
\ No newline at end of file
<!-- winButtonPay -->
<cover-view class="pay" wx:if="{{winButtonPay && !winNoticeDetail}}">
<cover-view class="pay-tip row align-c">
<cover-image src="{{imageBase + 'fail-icon-4.png'}}"></cover-image>
<cover-view class="pay-tip-text row con-c align-c">付款后一经确认不得退款</cover-view>
</cover-view>
<cover-view class="pay-operation row con-b align-c">
<cover-view class="pay-operation-amount row con-c align-c">{{'¥' + payAmount}}</cover-view>
<cover-view class="pay-operation-confirm row con-c align-c" bindtap="onPaySubmit">立即支付</cover-view>
</cover-view>
</cover-view>
<!-- winButtonAppointment -->
<cover-view class="appointment row con-c align-c" wx:if="{{winButtonAppointment && !winNoticeDetail}}">
<cover-view class="appointment-confirm row con-c align-c">确认预约</cover-view>
</cover-view>
\ No newline at end of file
pages/pay/order-input/order-input.wxss
.notice-detail {
z-index: 1700;
position: fixed;
left: 0;
bottom: 0;
width: 750rpx;
height: 100%;
padding-bottom: 48rpx;
background: rgba(0, 0, 0, .6);
}
.notice-item {
position: absolute;
left: 0;
bottom: 0;
bottom: -950rpx;
width: 750rpx;
padding: 28px 0 12px 0;
padding: 28px 0 50rpx 0;
border-radius: 24px 24px 0px 0px;
background: #FFFFFF;
}
......@@ -25,6 +27,7 @@
.container {
margin-top: 60rpx;
padding-bottom: 232rpx;
}
.buy-content {
......@@ -526,7 +529,14 @@
/* 立即支付 */
.pay {
z-index: 9;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
margin-top: 40rpx;
padding-bottom: 36rpx;
background: #FFFFFF;
}
.pay-tip {
......@@ -534,46 +544,78 @@
height: 72rpx;
padding: 0 40rpx;
background: #F5EEDF;
font-size: 22rpx;
font-weight: 400;
line-height: 32rpx;
color: #837048;
}
.pay-tip image {
.pay-tip cover-image {
display: block;
width: 28rpx;
height: 28rpx;
margin-right: 14rpx;
}
.pay-tip-text {
margin-bottom: 2rpx;
background: rgba(0, 0, 0, 0);
font-size: 22rpx;
font-weight: 400;
line-height: 32rpx;
color: #837048;
}
.pay-operation {
padding: 32rpx 40rpx;
}
.pay-operation text {
.pay-operation-amount {
height: 58rpx;
background: rgba(0, 0, 0, 0);
font-size: 34rpx;
font-weight: 800;
line-height: 48rpx;
color: #5DB5DD;
}
.pay-operation button {
.pay-operation-confirm {
width: 248rpx;
height: 96rpx;
border-radius: 4px;
background: #86C5E1;
text-align: center;
font-size: 30rpx;
font-weight: 500;
line-height: 42px;
line-height: 96rpx;
color: #FFFFFF;
}
/* 确认预约 */
.appointment {
z-index: 9;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
margin-top: 40rpx;
padding: 30rpx 0 68rpx 0;
border: 1px #E2E7EF solid;
background: #FFFFFF;
}
.appointment-confirm {
width: 670rpx;
height: 96rpx;
background: #86C5E1;
border-radius: 4px;
text-align: center;
font-size: 30rpx;
font-weight: 500;
color: #FFFFFF;
line-height: 96rpx;
}
......
project.config.json
......@@ -4,7 +4,7 @@
"ignore": []
},
"setting": {
"urlCheck": true,
"urlCheck": false,
"es6": true,
"enhance": true,
"postcss": true,
......@@ -18,7 +18,7 @@
"scopeDataCheck": false,
"uglifyFileName": false,
"checkInvalidKey": true,
"checkSiteMap": true,
"checkSiteMap": false,
"uploadWithSourceMap": true,
"compileHotReLoad": false,
"babelSetting": {
......@@ -139,9 +139,10 @@
"scene": null
},
{
"id": -1,
"name": "pages/commodity/project/project",
"pathName": "pages/commodity/project/project",
"id": 10,
"name": "pages/commodity/project-detail/project-detail",
"pathName": "pages/commodity/project-detail/project-detail",
"query": "",
"scene": null
}
]
......
sitemap.json
{
"desc": "关于本文件的更多信息，请参考文档 https://developers.weixin.qq.com/miniprogram/dev/framework/sitemap.html",
"rules": [{
"action": "allow",
"page": "*"
}]
"desc": "关于本文件的更多信息，请参考文档 https://developers.weixin.qq.com/miniprogram/dev/framework/sitemap.html",
"rules": [
{
"action": "allow",
"page": "*"
}
]
}
\ No newline at end of file
utils/rule/rule-key.js
......@@ -104,21 +104,6 @@ let Output = {
}
return funMessage
},
/**
* 顾问
* @function
* @param {string} value
* @returns {string}
*/
'adviser': function (value) {
let funMessage = ''
// let funcScene = wx.getStorageSync('scene')
// if (funcScene.type !== 2 && value.name === '未知') {
// funMessage = '请选择顾问'
// }
return funMessage
},
}
export default Output
\ No newline at end of file
utils/utils.js
......@@ -16,7 +16,20 @@ let output = {
if (funcElementHeightPx < funcCapsuleHeight) {
return (funcCapsuleHeight - funcElementHeightPx) / 2 + funcStatusHeight - 4 * funcUnitProportion
}
}
},
/**
* 金额格式化函数
* @function
* @param {number} - funcAmountValue 金额，单位分
* @returns
*/
formatAmount: function (funcAmountValue) {
if (funcAmountValue === 0) funcAmountValue = '000'
if (!funcAmountValue) return
return funcAmountValue.toString().replace(/([0-9]{2})$/, '.$1')
},
}
export default output
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment