project/point_sys_miniapp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

添加订单详情;兑换积分不足判断

Browse Source
This commit is contained in:
LittleBoy 2023-02-21 17:58:55 +08:00
parent 928906e366
commit 55f3f0cbe6
20 changed files with 325 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
miniprogram/app.json
View File

@ -5,7 +5,8 @@
"pages/sign/index",
"pages/user/login",
"pages/logs/logs",
"pages/order/index"
"pages/order/index",
"pages/order/detail"
],
"window": {
"backgroundTextStyle": "light",
@ -14,8 +15,7 @@
"navigationBarTextStyle": "black"
},
"tabBar": {
"list": [
{
"list": [{
"pagePath": "pages/index/index",
"iconPath": "assets/images/icon_home.png",
"selectedIconPath": "assets/images/icon_home_selected.png",
@ -40,6 +40,8 @@
"v-button": "@vant/weapp/button/index",
"v-tab": "@vant/weapp/tab/index",
"v-tabs": "@vant/weapp/tabs/index",
"van-dialog": "@vant/weapp/dialog/index"
"van-dialog": "@vant/weapp/dialog/index",
"van-cell": "@vant/weapp/cell/index",
"van-cell-group": "@vant/weapp/cell-group/index"
}
}

6
miniprogram/app.less
View File

@ -1,8 +1,8 @@
@font-face {
font-family: "iconfont"; /* Project id 3795683 */
src: url('./assets/font/iconfont.woff') format('woff2'),
url('./assets/font/iconfont.woff?t=1669601953874') format('woff'),
url('./assets/font/iconfont.ttf?t=1669601953874') format('truetype');
src: url('https://at.alicdn.com/t/c/font_3795683_hbxadrued4a.woff2?t=1676964840714') format('woff2'),
url('https://at.alicdn.com/t/c/font_3795683_hbxadrued4a.woff?t=1676964840714') format('woff'),
url('https://at.alicdn.com/t/c/font_3795683_hbxadrued4a.ttf?t=1676964840714') format('truetype');
}
.iconfont {

4
miniprogram/config.ts
View File

@ -4,11 +4,11 @@ type ApplicationConfig = {
}
const ConfigData = {
dev: {
api_url: 'http://localhost:8080',
api_url: 'http://192.168.10.64:8080',
env: 'dev'
},
prod: {
api_url: 'http://localhost:8001',
api_url: 'http://192.168.10.64:8001',
env: 'prod'
}
}

7
miniprogram/pages/index/index.less
View File

@ -154,6 +154,13 @@ image {
width: 100px;
padding: 0;
line-height: 30px;
&.disabled{
background-color: #ddd;
color:#999;
&:active{
background-color: #ddd;
}
}
&:active{
background-color: rgb(233, 0, 0);
}

42
miniprogram/pages/index/index.ts
View File

@ -11,25 +11,30 @@ Page({
{
image: 'https://m15.360buyimg.com/mobilecms/jfs/t1/160398/4/32302/103427/6374d1f3E5b1ecb32/a593b9982d8378cc.jpg!cr_1125x449_0_166!q70.jpg',
url: null,
id:1,
},
{
image: 'https://m15.360buyimg.com/mobilecms/jfs/t1/203775/20/26428/95041/637fab4dEf6a4434d/3f8770efe691537b.jpg!cr_1053x420_4_0!q70.jpg',
url: null,
id:2,
},
{
image: 'https://m15.360buyimg.com/mobilecms/jfs/t1/160398/4/32302/103427/6374d1f3E5b1ecb32/a593b9982d8378cc.jpg!cr_1125x449_0_166!q70.jpg',
url: null,
id:3,
},
{
image: 'https://m15.360buyimg.com/mobilecms/jfs/t1/203775/20/26428/95041/637fab4dEf6a4434d/3f8770efe691537b.jpg!cr_1053x420_4_0!q70.jpg',
url: null,
id:4,
}
],
goodsItems: [],
recommendItems: [],
page: 1,
hasMore: true,
pageSize: 10
pageSize: 10,
userPoint: -1,
},
onPullDownRefresh() {
this.setData({
@ -65,6 +70,11 @@ Page({
})
},
onLoad() {
if(app.globalData.userInfo && app.globalData.userInfo.pointInfo){
this.setData({
userPoint: app.globalData.userInfo.pointInfo.totalPoint
})
}
// 推荐商品
queryGoodsList(2, 1, 3).then((result) => {
wx.stopPullDownRefresh();
@ -77,7 +87,7 @@ Page({
this.loadGoodsList(this.data.page);
},
createOrder(e: any) {
if(!app.globalData.token){
if(!app.globalData.token || !app.globalData.userInfo){
// message.toast('请先完成登录','none',()=>{
// })
@ -87,16 +97,24 @@ Page({
return false;
}
const goods = e.target.dataset.data as Goods;
message.showLoading({ message: '兑换中...' })
createOrder(goods.id).then(result => {
console.log(result)
// 更新用户信息
app.updateUserInfo();
message.toast('兑换成功')
}).catch(e => {
message.toast(e.message || '兑换失败')
}).finally(() => {
message.hideLoading()
if(goods.price > app.globalData.userInfo.pointInfo.totalPoint){
message.alert('积分不足')
return;
}
message.confirm('确认兑换此商品吗?').then(b=>{
if(b){
message.showLoading({ message: '兑换中...' })
createOrder(goods.id).then(result => {
console.log(result)
// 更新用户信息
app.updateUserInfo();
message.toast('兑换成功')
}).catch(e => {
message.toast(e.message || '兑换失败')
}).finally(() => {
message.hideLoading()
})
}
})
return;
}

5
miniprogram/pages/index/index.wxml
View File

@ -4,7 +4,7 @@
<view class="content-wrapper">
<view class="top-swiper">
<swiper indicator-dots="{{true}}" indicator-color="#fff" autoplay="{{true}}">
<block wx:for="{{swiperList}}" wx:key="*this">
<block wx:for="{{swiperList}}" wx:key="id">
<swiper-item>
<view class="swiper-item">
<image src="{{item.image}}" />
@ -68,7 +68,8 @@
<text>{{item.price}}积分</text>
</view>
<view class="actions">
<button data-data="{{item}}" bindtap="createOrder">立即兑换</button>
<button wx:if="{{userPoint > -1 && item.price <= userPoint}}" data-data="{{item}}" bindtap="createOrder">立即兑换</button>
<button wx:else class="disabled" disabled>积分不足</button>
</view>
</view>
</view>

6
miniprogram/pages/order/detail.json Normal file
View File

@ -0,0 +1,6 @@
{
"usingComponents": {},
"navigationBarBackgroundColor": "#f2f2f2",
"navigationBarTitleText": "订单详情",
"enablePullDownRefresh": true
}

87
miniprogram/pages/order/detail.less Normal file
View File

@ -0,0 +1,87 @@
/* pages/order/detail.wxss */
@padding: 15px;
@content_padding: 15px;
.order-detail-page {
background-color: #f2f2f2;
min-height: 100vh;
--padding-xs: 15px;
.order-status {
padding: 20px 30px;
background-color: #ffffff;
font-size: 18px;
}
.order-goods,.order-info-detail {
background-color: #ffffff;
margin: 15px;
border-radius: 10px;
overflow: hidden;
}
.order-info-detail{
font-size: 13px;
padding: 10px 0;
.item {
display: flex;
align-items: center;
padding: 5px 15px;
}
.title{
margin-right: 5px;
}
}
.order-goods-content {
padding: @content_padding;
.info {
display: flex;
}
.goods-name {
flex: 1;
margin: 0 8px;
font-size: 15px;
line-height: 1.3;
}
.goods-price {
color: #999;
text-align: right;
}
.sale-price {
color: #333;
}
.origin-price {
text-decoration: line-through;
}
}
.goods-cover-image {
width: 100px;
height: 100px;
}
.price {
text-align: right;
font-size: 13px;
.price-total {
font-size: 16px;
vertical-align: baseline;
}
}
.order-footer {
border-top: 1px solid #f2f2f2;
overflow: hidden;
padding: 15px;
}
.order-action{
float: right;
}
}

69
miniprogram/pages/order/detail.ts Normal file
View File

@ -0,0 +1,69 @@
import { queryOrderDetail } from "../../service/shop-api";
import message from "../../utils/message";
// pages/order/detail.ts
Page({
/**
* 页面的初始数据
*/
data: {
statusEnums: {
1: '待确认',
2: '已确认',
3: '已取消',
4: '已完成',
0: '已删除'
},
id: '',
order: {}
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(opts: { id?: string }) {
if (!opts.id) {
message.alert('订单数据错误').then(() => wx.navigateBack());
return;
}
this.setData({
id: opts.id
})
this.loadOrderDetail(opts.id)
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide() {
},
onPullDownRefresh(){
this.loadOrderDetail()
},
async loadOrderDetail(id?: string) {
message.showLoading()
try{
const order = await queryOrderDetail((id || this.data.id));
this.setData({ order })
wx.stopPullDownRefresh()
}finally{
message.hideLoading()
}
}
})

48
miniprogram/pages/order/detail.wxml Normal file
View File

@ -0,0 +1,48 @@
<!--pages/order/detail.wxml-->
<view class="order-detail-page">
<view class="order-status">
<text>{{statusEnums[order.status]||''}}</text>
</view>
<view class="order-goods">
<view class="order-goods-content">
<view class="info" id="{{order.id}}">
<!-- 商品图片 -->
<view class="goods-cover">
<image class="goods-cover-image" src="{{order.goods.cover}}" />
</view>
<view class="goods-name">
<text>{{order.goods.title}}</text>
</view>
<view class="goods-price">
<view class="sale-price">{{order.goods.price}}</view>
<view wx:if="{{order.goods.originPrice > 0}}" class="origin-price">{{order.goods.originPrice}}</view>
<view class="count">× 1</view>
</view>
</view>
<view class="price">
<text>实付积分:</text>
<text class="price-total">{{order.price}}</text>
</view>
</view>
<view class="order-footer">
<view class="order-action">
<v-button wx:if="{{order.status < 3}}" data-id="{{order.id}}" class="btn" round type="default" size="small">取消订单</v-button>
<v-button data-id="{{order.id}}" class="btn" round type="danger" size="small">删除订单</v-button>
</view>
</view>
</view>
<view class="order-info-detail">
<view class="item">
<view class="title">订单编号:</view>
<view class="value">{{order.id}}</view>
</view>
<view class="item">
<view class="title">创建时间:</view>
<view class="value">{{order.createTime}}</view>
</view>
<view class="item">
<view class="title">更新时间:</view>
<view class="value">{{order.updateTime}}</view>
</view>
</view>
</view>

12
miniprogram/pages/order/index.less
View File

@ -24,7 +24,11 @@
.order-footer {
border-top: 1px solid #f2f2f2;
}
.order-no{
border-bottom: 1px solid #f2f2f2;
padding: 10px;
font-size: 13px;
}
.order-goods-content {
padding: @content_padding;
@ -34,8 +38,8 @@
.goods-name{
flex:1;
margin: 0 8px;
font-size: 16px;
line-height: 1.5;
font-size: 15px;
line-height: 1.3;
}
.goods-price{
color:#999;
@ -72,7 +76,7 @@
.order-status {
display: flex;
align-items: center;
font-size: 18px;
font-size: 14px;
color: #c78a8a;
}

7
miniprogram/pages/order/index.ts
View File

@ -86,6 +86,13 @@ Page({
this.loadOrderList(tabActive)
this.setData({ tabActive })
},
showOrderDetail(e: TapEvent){
const id = e.currentTarget.id
wx.navigateTo({
url: `/pages/order/detail?id=${id}`
})
},
async cancelOrder(e: TapEvent) {
try {
if ((await message.confirm('确定要取消订单?'))) {

7
miniprogram/pages/order/index.wxml
View File

@ -4,8 +4,13 @@
<v-tab wx:for="{{tabs}}" wx:key="name" name="{{item.name}}" title="{{item.title}}">
<view class="order-list-wrapper">
<view wx:for="{{item.orders}}" wx:key="id" class="order-item" wx:for-item="o">
<view class="order-no">
<text>订单编号: </text>
<text>{{o.id}}</text>
</view>
<view class="order-goods-content">
<view class="info">
<view class="info" bindtap="showOrderDetail" data-id="{{o.id}}" id="{{o.id}}">
<!-- 商品图片 -->
<view class="goods-cover">
<image class="goods-cover-image" src="{{o.goods.cover}}" />

3
miniprogram/pages/personal/personal.less
View File

@ -25,9 +25,8 @@
}
.icon-sign{
background: linear-gradient(to right,#ddba7a,#ff9a31);
}
.icon-game{
.item-icon-game{
background: linear-gradient(to right,#ffaf8f,#ff6931);
}

6
miniprogram/pages/personal/personal.wxml
View File

@ -22,7 +22,7 @@
<text class="iconfont icon-sign-in"></text>
</view>
<view class="text">
<text>每次签到</text>
<text>签到</text>
</view>
</view>
<view class="grid-item">
@ -34,7 +34,7 @@
</view>
</view>
<view class="grid-item">
<view class="icon icon-game">
<view class="icon item-icon-game">
<text class="iconfont icon-game"></text>
</view>
<view class="text">
@ -42,7 +42,7 @@
</view>
</view>
<view class="grid-item">
<view class="icon icon-collection">
<view class="icon item-icon-collection">
<text class="iconfont icon-gift"></text>
</view>
<view class="text">

8
miniprogram/pages/sign/index.ts
View File

@ -29,9 +29,11 @@ Page({
*/
onLoad() {
if (app.globalData.userInfo) {
this.setData({
pointValue: app.globalData.userInfo?.pointInfo?.totalPoint
})
if(app.globalData.userInfo.pointInfo){
this.setData({
pointValue: app.globalData.userInfo.pointInfo.totalPoint
})
}
signInfo().then(res => {
this.setData(res)
})

3
miniprogram/service/shop-api.ts
View File

@ -48,6 +48,9 @@ export function queryOrderList(status: number = 0, page = 1, pageSize = 10) {
status, page, pageSize
});
}
export function queryOrderDetail(id: string){
return request<OrderInfo>(`/shop/order/${id}`,null,'GET');
}
export function cancelOrder(id: string) {
return request<boolean>(`/shop/order/${id}/cancel`,null,'PUT');
}

11
miniprogram/utils/message.ts
View File

@ -15,7 +15,7 @@ export function toast(message: string | any, icon: ToastIcon = 'none', callback:
icon
})
}
export function showLoading({ message = '加载中...', mask = true }) {
export function showLoading({ message = '加载中...', mask = true }={}) {
return wx.showLoading({
title: message,
mask
@ -24,6 +24,14 @@ export function showLoading({ message = '加载中...', mask = true }) {
export function hideLoading() {
wx.hideLoading()
}
export function alert(message: string) {
return new Promise((success) => {
wx.showModal({
content: message,
success
})
})
}
export function confirm(message: string) {
return new Promise<boolean>((resolve) => {
wx.showModal({
@ -43,5 +51,6 @@ export default {
toast,
showLoading,
hideLoading,
alert,
confirm,
}

5
project.private.config.json
View File

@ -1,8 +1,9 @@
{
"description": "项目私有配置文件。此文件中的内容将覆盖 project.config.json 中的相同字段。项目的改动优先同步到此文件中。详见文档：https://developers.weixin.qq.com/miniprogram/dev/devtools/projectconfig.html",
"projectname": "userlogin-demo",
"projectname": "point_sys_miniapp",
"setting": {
"compileHotReLoad": true,
"urlCheck": false
"urlCheck": false,
"bigPackageSizeSupport": true
}
}

18
yarn.lock Normal file
View File

@ -0,0 +1,18 @@
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
# yarn lockfile v1
"@types/node@^18.11.9":
version "18.14.0"
resolved "https://registry.npmmirror.com/@types/node/-/node-18.14.0.tgz#94c47b9217bbac49d4a67a967fdcdeed89ebb7d0"
integrity sha512-5EWrvLmglK+imbCJY0+INViFWUHg1AHel1sq4ZVSfdcNqGy9Edv3UB9IIzzg+xPaUcAgZYcfVs2fBcwDeZzU0A==
"@vant/weapp@^1.10.8":
version "1.10.13"
resolved "https://registry.npmmirror.com/@vant/weapp/-/weapp-1.10.13.tgz#795c52b4e5a757ad02091df2c9910e63daabffe6"
integrity sha512-Ps56qHY60W0QpaFKgzN2UGWfzCcKfZrM7QZVfFM3Qx9Kpm/Tnqln+mrGSMiI84+6qU0Bv1xKX6FBDa04yNiwAQ==
miniprogram-api-typings@^3.6.0:
version "3.9.0"
resolved "https://registry.npmmirror.com/miniprogram-api-typings/-/miniprogram-api-typings-3.9.0.tgz#c04a6b7eae5585733b5f8787297f2b9f1b60abac"
integrity sha512-QCXHHW9H4XYazb8J9EMiFyaOWHXhBG4oehkQqi+76FJpKKIlpgL0ZkXxzJ2L+6T/c5OxKm7iegovKIQGVkZDLQ==