Skip to content

dev / zhiliang-light-mp

Go to a project
Toggle navigation
Toggle navigation pinning
7369ecbf by simon
Options

默认提交

1 parent 1cb94cb4
Inline Side-by-side
Showing 23 changed files with 658 additions and 36 deletions
......@@ -47,7 +47,7 @@ var paths = {
imgFiles: 'src/image/**/*',
scssFiles: 'src/**/*.scss',
baseFiles: ['src/**/*.{png,js,json,wxml,wxss,wxs,ts,woff2}', '!src/assets/**/*', '!src/image/**/*'],
busFiles: ['src/**/*.{js,json}', '!src/assets/**/*', '!src/image/**/*', '!src/ui/**/*'],
busFiles: ['src/**/*.{js,json,wxs}', '!src/assets/**/*', '!src/image/**/*', '!src/ui/**/*'],
assetsDir: 'src/assets',
assetsImgFiles: 'src/assets/images/**/*.{png,jpg,jpeg,svg,gif}',
wxmlFiles: ['src/**/*.wxml'],
......
......@@ -31,6 +31,7 @@
"devDependencies": {
"del": "^4.0.0",
"gulp": "^4.0.0",
"gulp-changed": "^4.0.2",
"gulp-cached": "^1.1.1",
"gulp-debug": "^4.0.0",
"gulp-if": "^2.0.2",
......
......@@ -74,6 +74,9 @@
"gift-rank-tips-comp": "../../component/gift-rank-tips-comp/gift-rank-tips-comp",
"gift-sign-tips-comp": "../../component/gift-sign-tips-comp/gift-sign-tips-comp",
"order-submit-success-tips-comp": "../../component/order-submit-success-tips-comp/order-submit-success-tips-comp",
"auction-bid-comp": "../../component/auction-bid-comp/auction-bid-comp",
"auction-bid-success-comp": "../../component/auction-bid-success-comp/auction-bid-success-comp",
"auction-bid-fail-comp": "../../component/auction-bid-fail-comp/auction-bid-fail-comp",
"empty-tips": "../../component/empty-tips/empty-tips",
"empty-tips-light": "../../component/empty-tips-light/empty-tips-light",
"van-popup": "../../ui/vant-weapp/popup/index"
......
......@@ -86,7 +86,9 @@ $contentWidth:690px;
position: relative;
}
.price {
color: #cb3939;
}
// web font icon
......
......@@ -116,6 +116,8 @@
// 通用按钮
@mixin cb2($width:320px, $height:84px, $fontSize:32px) {
box-sizing: border-box;
background-color: transparent;
position: relative;
width: $width;
height: $height;
......
let app = getApp();
Component({
options: {
styleIsolation: 'apply-shared'
},
properties: {
// 这里定义了innerText属性，属性值可以在组件使用时指定
innerText: {
type: String,
value: 'default value',
},
maxPrice: {
type: Number,
value: 0,
},
productInfo: {
type: Object,
value: {},
},
},
data: {
// 这里是一些组件内部数据
someData: {},
bidPrice: 0
},
methods: {
// 这里是一个自定义方法
customMethod() {
this.triggerEvent('evtcomp', {
name: "_evt_custom"
})
},
// 设置价格
setBidPrice(val) {
this.setData({
bidPrice: val * 0.01 //表单以元作单位
})
},
bindBidPriceInput(e) {
this.setData({
bidPrice: e.detail.value
});
},
// 出价
onSubmitHandler() {
let minPrice = (this.properties.maxPrice + this.properties.productInfo.minScope) * 0.01;
if (this.data.bidPrice < minPrice) {
wx.showToast({
title: `出价不能低于￥${minPrice}`,
icon: 'none'
})
return;
}
this.triggerEvent('evtcomp', {
name: "_evt_bid_submit",
data: {
bidPrice: this.data.bidPrice
}
})
},
// 隐藏蒙层
hideMask() {
this.triggerEvent('evtcomp', {
name: "_evt_hide_mask"
});
}
}
})
@import '../../assets/scss/mixins';
@import '../../assets/scss/utils';
.comp-item {
width: 650px;
border-radius: 10px;
background-color: #ffffff;
color: #333333;
font-size: 28px;
// padding-bottom: 240px;
padding-bottom: 120px;
.cspace {
height: 76px;
}
.cont {
text-align: center;
.tit {
font-size: 36px;
font-weight: bold;
color: #333333;
}
.t1 {
font-size: 22px;
margin: 12px auto 0;
color: #666666;
}
.bid {
display: flex;
justify-content: center;
align-items: center;
margin: 72px auto 120px;
.ipt {
border: solid 1PX #8f8f8f;
width: 160px;
height: 60px;
border-radius: 6px;
margin: 0 32px;
}
}
}
.btn-wrap {
position: absolute;
left: 0;
right: 0;
bottom: 74px;
margin: 0 auto;
display: flex;
justify-content: center;
.btn {
@include cb(240px, 60px, 28px);
margin: 0 16px;
}
.btn2 {
@include cb2(240px, 60px, 28px);
}
}
}
<wxs module="filter" src="../../utils/utilswxs.wxs"></wxs>
<view class="comp-item">
<view class="cspace"></view>
<view class="cont">
<view class="tit">填写报价</view>
<view class="t1">
当前价格
<span class="price">￥{{filter.Fen2Yuan(maxPrice)}}</span>
，出价不得低于
<span class="price">￥{{filter.Fen2Yuan(maxPrice + productInfo.minScope)}}</span>
</view>
<view class="bid">
我要报价
<input value="{{bidPrice}}" class="val" bindinput="bindBidPriceInput" class="ipt" placeholder="{{maxPrice + productInfo.minScope}}" />
元
</view>
</view>
<view class="btn-wrap">
<view class="btn btn2" bindtap="hideMask">我再想想</view>
<view class="btn" bindtap="onSubmitHandler">确认出价</view>
</view>
</view>
let app = getApp();
Component({
options: {
styleIsolation: 'apply-shared'
},
properties: {
// 这里定义了innerText属性，属性值可以在组件使用时指定
// cid 用户区分组件
cid: {
type: String,
value: '1',
},
innerTitle: {
type: String,
value: '',
},
innerText: {
type: String,
value: '',
},
innerButton: {
type: String,
value: '确定',
},
bidPrice: {
type: Number,
value: 0,
},
},
data: {
// 这里是一些组件内部数据
someData: {}
},
methods: {
// 这里是一个自定义方法
customMethod() {
this.triggerEvent('evtcomp', {
name: "_evt_custom"
})
},
// 隐藏蒙层
hideMask() {
this.triggerEvent('evtcomp', {
name: "_evt_hide_mask"
});
},
// 点击自定义按钮
onInnerButtonHandler() {
this.triggerEvent('evtcomp', {
name: "_evt_re_bid"
});
}
}
})
@import '../../assets/scss/mixins';
@import '../../assets/scss/utils';
.comp-item {
width: 650px;
min-height: 496px;
border-radius: 10px;
background-color: #ffffff;
.cspace {
height: 76px;
}
.cont {
text-align: center;
width: 520px;
margin: 0 auto;
.logo {
margin: 0 auto;
width: 200px;
height: 153px;
image {
width: 200px;
height: 153px;
}
}
.tit {
font-size: 40px;
color: #333333;
}
.tips {
margin-top: 64px;
font-size: 22px;
color: #333333;
width: 520px;
padding-bottom: 244px;
}
}
.btn-wrap {
position: absolute;
left: 0;
right: 0;
bottom: 74px;
margin: 0 auto;
display: flex;
justify-content: center;
.btn {
@include cb(240px, 60px, 28px);
margin: 0 16px;
}
.btn2 {
@include cb2(240px, 60px, 28px);
}
}
}
<view class="comp-item">
<view class="cspace"></view>
<view class="cont">
<view class="tit">{{innerTitle}}</view>
<view class="tips">
来晚一步！另有用户也一样出价
<span class="price">￥{{bidPrice}}</span>
哦
</view>
</view>
<view class="btn-wrap">
<view bindtap="hideMask" class="btn btn2">我再想想</view>
<view bindtap="onInnerButtonHandler" class="btn">重新报价</view>
</view>
</view>
let app = getApp();
Component({
options: {
styleIsolation: 'apply-shared'
},
properties: {
// 这里定义了innerText属性，属性值可以在组件使用时指定
// cid 用户区分组件
cid: {
type: String,
value: '1',
},
innerTitle: {
type: String,
value: '',
},
innerText: {
type: String,
value: '',
},
innerButton: {
type: String,
value: '确定',
},
bidPrice: {
type: Number,
value: 0,
},
},
data: {
// 这里是一些组件内部数据
someData: {}
},
methods: {
// 这里是一个自定义方法
customMethod() {
this.triggerEvent('evtcomp', {
name: "_evt_custom"
})
},
// 隐藏蒙层
hideMask() {
this.triggerEvent('evtcomp', {
name: "_evt_hide_mask"
});
},
// 点击自定义按钮
onInnerButtonHandler() {
this.triggerEvent('evtcomp', {
name: "_evt_continue_auction"
});
}
}
})
@import '../../assets/scss/mixins';
@import '../../assets/scss/utils';
.comp-item {
width: 650px;
min-height: 496px;
border-radius: 10px;
background-color: #ffffff;
.cspace {
height: 76px;
}
.cont {
text-align: center;
width: 520px;
margin: 0 auto;
.logo {
margin: 0 auto;
width: 200px;
height: 153px;
image {
width: 200px;
height: 153px;
}
}
.tit {
font-size: 40px;
color: #333333;
}
.tips {
margin-top: 64px;
font-size: 22px;
color: #333333;
width: 520px;
padding-bottom: 244px;
}
}
.btn-wrap {
position: absolute;
left: 0;
right: 0;
bottom: 74px;
margin: 0 auto;
display: flex;
justify-content: center;
.btn {
@include cb(240px, 60px, 28px);
margin: 0 16px;
}
.btn2 {
@include cb2(240px, 60px, 28px);
}
}
}
<view class="comp-item">
<view class="cspace"></view>
<view class="cont">
<view class="tit">{{innerTitle}}</view>
<view class="tips">
我的出价
<span class="price">￥{{bidPrice}}</span>
出价成功，请返回活动查看详情
</view>
</view>
<view class="btn-wrap">
<view bindtap="onInnerButtonHandler" class="btn">返回活动</view>
</view>
</view>
<wxs module="filter" src="../../utils/utilswxs.wxs"></wxs>
<view class="page">
<view class="app__bgc bgc"></view>
<view class="app__bg bg"></view>
......@@ -21,7 +22,7 @@
<view class="block">{{index == 0 ? "领先" : "淘汰"}}</view>
</view>
<view class="item item2">{{item.memberPhone}}</view>
<view class="item item3">￥{{item.priceStr}}</view>
<view class="item item3">￥{{filter.Fen2Yuan(item.price)}}</view>
<view class="item item4">{{item.recordTime}}</view>
</view>
</view>
......
import {
getBindtapData
getBindtapData,
} from '../../utils/util';
let Date = require('../../utils/date.js');
var timer = require('../../utils/wxTimer.js');
......@@ -10,6 +10,9 @@ let app = getApp();
Page({
data: {
authorizeVisible: false,
auctionBidVisible: false,
auctionBidSuccessVisible: false,
auctionBidFailVisible: false,
userInfo: {},
productInfo: {},
priceInfo: [],
......@@ -23,6 +26,7 @@ Page({
options: {},
wxTimerList: {},
lastTime: "",
bidPrice: 0, // 我的出价 单位元
},
onShareAppMessage() {},
showAuth() {
......@@ -112,7 +116,7 @@ Page({
/**
* 点击显示详情
*/
onShowAuctionBidDetailHandler() {
onShowAuctionBidDetailHandler(evt) {
app.router.push({
path: "auctionBidDetail",
query: {
......@@ -122,6 +126,24 @@ Page({
},
/**
* 我要出价
*/
onSubmitHandler() {
let productInfo = this.data.productInfo;
if (productInfo && productInfo.status == 1) {
this.setData({
auctionBidVisible: true
})
let maxPrice = this.data.maxPrice;
let minBidPrice = maxPrice + productInfo.minScope;
this.auctionBidComp = this.selectComponent("#auctionBidComp");
if (this.auctionBidComp) {
this.auctionBidComp.setBidPrice(minBidPrice);
}
}
},
/**
* 秒杀详情
*/
queryAuctionDetail() {
......@@ -136,7 +158,6 @@ Page({
auctionCode: code
}
}).then((result) => {
result.delayPeriod = (result.delayPeriod / 60) + "分钟";
this.setData({
productInfo: result
})
......@@ -159,27 +180,77 @@ Page({
* 获得最高价 和列表
*/
queryAuctionRecordLast() {
let code = this.data.options.code;
if (code) {
app.post({
url: app.api.auctionRecordLast,
data: {
auctionCode: code
}
}).then((result) => {
let priceInfo = result.list || [];
priceInfo.forEach(element => {
element.recordTime = new Date(element.recordTime).toString("yyyy.MM.dd hh:mm:ss");
element.memberPhone = element.memberPhone.substr(0, 3) + '****' + element.memberPhone.substr(7);
return new Promise((resolve, reject) => {
let code = this.data.options.code;
if (code) {
app.post({
url: app.api.auctionRecordLast,
data: {
auctionCode: code
}
}).then((result) => {
let priceInfo = result.list || [];
priceInfo.forEach(element => {
element.recordTime = new Date(element.recordTime).toString("yyyy.MM.dd hh:mm:ss");
element.memberPhone = element.memberPhone.substr(0, 3) + '****' + element.memberPhone.substr(7);
});
this.setData({
priceInfo: priceInfo,
maxPrice: result.maxPrice || 0,
priceTotal: result.total || 0
})
resolve();
});
priceInfo = [];
} else {
resolve();
}
})
},
/**
* 拍卖出价提交
* @param {*} price
*/
queryAuctionSubmit(price) {
let code = this.data.options.code;
this.setData({
bidPrice: price
})
app.post({
toast: false,
url: app.api.auctionSubmit,
data: {
auctionCode: code,
price: price * 100 //转成分
}
}).then((result) => {
console.log("result:", result);
this.queryAuctionRecordLast().then((res2) => {
this.setData({
priceInfo: priceInfo,
maxPrice: result.maxPrice || 0,
priceTotal: result.total || 0
auctionBidSuccessVisible: true
})
});
}
})
}).catch((err) => {
console.log("queryAuctionSubmit err:", err);
this.queryAuctionRecordLast().then((res2) => {
switch (err.code) {
// 来晚一步，该价格已经被其他用户提交 显示组件
case 1010:
this.setData({
auctionBidFailVisible: true
})
break;
default:
wx.showToast({
title: err.errMsg || "系统开小差"
})
break;
}
})
});
},
/**
......@@ -283,6 +354,9 @@ Page({
hideMask() {
this.setData({
authorizeVisible: false,
auctionBidVisible: false,
auctionBidSuccessVisible: false,
auctionBidFailVisible: false,
})
},
// 子组件事件
......@@ -291,6 +365,7 @@ Page({
name,
data
} = evt.detail;
console.log("@auction-detail || evt:", name)
switch (name) {
// 隐藏弹窗
......@@ -298,6 +373,27 @@ Page({
this.hideMask();
break;
// 拍卖出价
case "_evt_bid_submit":
let {
bidPrice
} = data;
console.log("bidPrice:", bidPrice);
this.hideMask();
this.queryAuctionSubmit(bidPrice);
break;
// 返回活动
case "_evt_continue_auction":
this.hideMask();
break;
// 重新报价
case "_evt_re_bid":
this.hideMask();
this.onSubmitHandler();
break;
default:
break;
}
......
......@@ -66,12 +66,10 @@ $contentWidth:690px;
@extend .bb;
.price {
color: #cb3939;
font-size: 52px;
font-weight: bold;
}
}
&-left {
......@@ -240,10 +238,16 @@ $contentWidth:690px;
}
}
.tips {
.all-bid-tips {
color: #3680EB;
margin-top: 32px;
}
.empty-tips{
text-align: center;
padding: 60px 0;
color: #666666;
}
}
}
......
<wxs module="filter" src="../../utils/utilswxs.wxs"></wxs>
<view class="page">
<view class="app__bgc bgc"></view>
<view class="app__bg bg"></view>
......@@ -19,7 +20,7 @@
<view class="func">
<view class="arrow"></view>
<view class="func-ele func-left">
<text class="price">￥{{maxPrice}}</text>
<text class="price">￥{{filter.Fen2Yuan(maxPrice)}}</text>
<text class="t1">当前价格</text>
</view>
<view class="func-ele func-right {{productInfo.status != 1 ? 'disable' : ''}}">
......@@ -41,10 +42,10 @@
<!-- 拍卖详情 -->
<view class="auction">
<view class="auction-desc">
<view class="t1">产品原价：{{productInfo.originalPrice}}元</view>
<view class="t1">起拍价：{{productInfo.startPrice}}元</view>
<view class="t1">最小加价幅度：{{productInfo.minScope}}元</view>
<view class="t1">延时周期：{{productInfo.delayPeriod}}</view>
<view class="t1">产品原价：{{filter.Fen2Yuan(productInfo.originalPrice)}} 元</view>
<view class="t1">起拍价：{{filter.Fen2Yuan(productInfo.startPrice)}}元</view>
<view class="t1">最小加价幅度：{{filter.Fen2Yuan(productInfo.minScope)}}元</view>
<view class="t1">延时周期： {{filter.msTimeFormat(productInfo.delayPeriod)}}</view>
</view>
<view class="auction-table">
<view wx:if="{{priceInfo && priceInfo.length > 0}}">
......@@ -62,20 +63,35 @@
<view class="block">{{index == 0 ? "领先" : "淘汰"}}</view>
</view>
<view class="item item2">{{item.memberPhone}}</view>
<view class="item item3">￥{{item.priceStr}}</view>
<view class="item item3">￥{{filter.Fen2Yuan(item.price)}}</view>
<view class="item item4">{{item.recordTime}}</view>
</view>
</view>
<view bindtap="onShowAuctionBidDetailHandler" class="tips">查看所有{{priceTotal}}次出价></view>
<view bindtap="onShowAuctionBidDetailHandler" class="all-bid-tips">
查看所有{{priceTotal}}次出价>
</view>
</view>
<view class="empty-tips" wx:else>
<text>大家都很矜持，该拍卖还未有人出价</text>
</view>
<view wx:else>大家都很矜持，该拍卖还未有人出价</view>
</view>
</view>
</view>
<!-- 按钮 -->
<view class="submit-btn">我要出价</view>
<view bindtap="onSubmitHandler" class="submit-btn {{productInfo.status != 1 ? 'disable' : ''}}">
我要出价
</view>
</view>
</view>
<van-popup show="{{ authorizeVisible }}">
<authorize-comp bind:evtcomp="evtcomp"></authorize-comp>
</van-popup>
<van-popup show="{{ auctionBidVisible }}">
<auction-bid-comp id="auctionBidComp" max-price="{{maxPrice}}" product-info="{{productInfo}}" bind:evtcomp="evtcomp"></auction-bid-comp>
</van-popup>
<van-popup show="{{ auctionBidSuccessVisible }}">
<auction-bid-success-comp bid-price="{{bidPrice}}" inner-title="成功出价" bind:evtcomp="evtcomp"></auction-bid-success-comp>
</van-popup>
<van-popup show="{{ auctionBidFailVisible }}">
<auction-bid-fail-comp inner-title="出价失败" bind:evtcomp="evtcomp"></auction-bid-fail-comp>
</van-popup>
......
......@@ -122,6 +122,20 @@ function formatWeek(week) {
return result;
}
/**
* 分转成元
* @param {*} fen
*/
function Fen2Yuan(fen, k = false) {
var num = fen * 0.01; //分到元
num += ''; //转成字符串
if (k) {
var reg = num.indexOf('.') > -1 ? /(\d{1,3})(?=(?:\d{3})+\.)/g : /(\d{1,3})(?=(?:\d{3})+$)/g; //千分符的正则
num = num.replace(reg, '$1,'); //千分位格式化
}
return num;
}
/**
* 根据url获取参数
......@@ -244,4 +258,5 @@ module.exports = {
wxacodeGet: wxacodeGet,
getObjByListKeyValue: getObjByListKeyValue,
getQueryByUrl: getQueryByUrl,
Fen2Yuan: Fen2Yuan
}
......
var filter = {
// 分转元
Fen2Yuan: function (val) {
var result = val * 0.01; //分到元
// result += ''; //转成字符串
// result = result.toFixed(2); //留两位小数
return result.toFixed(2);
},
// 毫秒转格式
msTimeFormat: function (val, day = true) {
// var result = (val / 60 / 1000) + "分钟";
var t = val;
if (t <= 0) return "-";
var d = Math.floor(t / 1000 / 60 / 60 / 24);
var h = Math.floor(t / 1000 / 60 / 60 % 24) + (day ? 0 : 24 * d); // 含日的话，就不用24*d了
var m = Math.floor(t / 1000 / 60 % 60);
var s = Math.floor(t / 1000 % 60);
var zeroStr = "";
var dStr = d + "";
var hStr = h < 10 ? zeroStr + h : h;
var mStr = m < 10 ? zeroStr + m : m;
var sStr = s < 10 ? zeroStr + s : s;
var result = "";
if (d > 0 && day) {
result = dStr + "天" + hStr + "时" + mStr + "分" + sStr + "秒";
} else {
if (h > 0) {
result = hStr + "时" + mStr + "分" + sStr + "秒";
} else {
if (m > 0) {
result = mStr + "分" + sStr + "秒";
} else {
result = sStr + "秒";
}
}
}
return result;
}
}
module.exports = {
Fen2Yuan: filter.Fen2Yuan,
msTimeFormat: filter.msTimeFormat,
}