Skip to content

dev / marubi-wish-list-mp

Go to a project
Toggle navigation
Toggle navigation pinning
1283d91e by simon
Options

版本提交

1 parent c7d81d9a
Expand all
Inline Side-by-side
Showing 17 changed files with 913 additions and 106 deletions
......@@ -132,7 +132,7 @@ function sassCompile() {
}))
.pipe(replace('.scss', '.wxss'))
// .pipe(replace('%ASSETS_IMG%/', res))
.pipe(replace('../../image/oss/', res)) // 自定义图片地址
// .pipe(replace('../../image/oss/', res)) // 自定义图片地址
.pipe(replace('src/assets/images', res)) // 雪碧图CSS RUL 中的图片路径
.pipe(gulp.dest(paths.dist.baseDir))
}
......@@ -231,7 +231,7 @@ var watchHandler = function (type, file) {
var tmp = file.replace('src/', 'dist/')
del([tmp]);
} else {
copyWXML();
// copyWXML();
wxmlImgRewrite();
}
}
......
......@@ -22,5 +22,10 @@
"navigationBarBackgroundColor": "#fff",
"navigationBarTitleText": "心愿单",
"navigationBarTextStyle": "black"
},
"permission": {
"scope.userLocation": {
"desc": "你的位置信息将用显示附近门店"
}
}
}
......
import {
getBindtapData,
} from '../../utils/util';
let app = getApp();
Component({
properties: {
// 这里定义了innerText属性，属性值可以在组件使用时指定
innerText: {
type: String,
value: 'default value',
},
wishInfo: {
type: Object,
value: {},
},
location: {
type: Object,
value: {},
},
//是否选择模式
selectedMode: {
type: Boolean,
value: false
}
},
data: {
// 这里是一些组件内部数据
someData: {}
someData: {},
searchMode: 1, // 查询模式 1.根据位置自动查询 2.省市区查询
provinceId: "",
cityId: "",
districtId: "",
provinceList: [],
cityList: [],
districtList: [],
provinceIndex: -1,
cityIndex: -1,
districtIndex: -1,
addressList: [],
total: 0,
curAddress: null
},
methods: {
/**
* 请求门店地址
*/
queryShop() {
return new Promise((resolve, reject) => {
let {
location,
wishInfo,
provinceId,
cityId,
districtId,
} = this.data;
app.post({
url: app.api.storeQuery,
data: {
couponId: wishInfo.couponId,
latitude: location.latitude,
longitude: location.longitude,
provinceId: provinceId,
cityId: cityId,
districtId: districtId,
page: 1,
size: 100,
}
}).then((result) => {
this.setData({
addressList: result.list,
total: result.total
})
resolve();
})
});
},
/**
* 选择地址 item
*/
onSelectHandler(evt) {
let item = getBindtapData(evt);
let index = getBindtapData(evt, "index");
let addressList = this.data.addressList;
addressList.forEach((element, idx) => {
element.selected = index == idx;
});
this.setData({
addressList: addressList,
curAddress: item
})
},
/**
* 提交门店
*/
onSubmitHandler(evt) {
let curAddress = this.data.curAddress;
if (!curAddress) {
wx.showToast({
title: "请选择门店",
icon: 'none'
});
return;
}
let wishInfo = this.properties.wishInfo;
app.post({
url: app.api.wishbillStoreAppoint,
data: {
instanceCode: wishInfo.instanceCode,
storeCode: curAddress.storeCode,
storeName: curAddress.storeName,
storeAddress: curAddress.storeAddress,
latitude: curAddress.latitude,
longitude: curAddress.longitude
}
}).then((result) => {
this.triggerEvent('evtcomp', {
name: "_evt_submit_store_complete"
})
});
},
/**
* 显示位置
* @param {*} e
*/
onShowLocHandler(evt) {
let item = getBindtapData(evt);
wx.openLocation({
latitude: item.latitude, // 纬度，范围为-90~90，负数表示南纬
longitude: item.longitude, // 经度，范围为-180~180，负数表示西经
scale: 18, // 缩放比例
name: item.storeName, // 位置名
address: item.storeAddress, // 地址的详细说明
success: function (res) {
// success
}
})
},
// 转换成手动模式
onSearchHandModeHandler() {
this.setData({
searchMode: 2
});
},
// 转换为自动模式
onSearchAutoModeHandler() {
this.setData({
searchMode: 1,
provinceId: "",
cityId: "",
districtId: "",
})
},
getProvince() {
return new Promise((resolve, reject) => {
app.post({
url: app.api.provinceQuery
}).then((result) => {
this.setData({
provinceList: result
})
console.log("getProvince result:", result);
})
});
},
getCity() {
return new Promise((resolve, reject) => {
app.post({
url: app.api.cityQuery,
data: {
parentId: this.data.provinceId
}
}).then((result) => {
console.log("getCity result:", result);
})
});
},
getDistrict() {
return new Promise((resolve, reject) => {
app.post({
url: app.api.districtQuery,
data: {
parentId: this.data.cityId
}
}).then((result) => {
console.log("getDistrict result:", result);
})
});
},
bindPickerChangeProvince(e) {
let index = e.detail.value;
this.setData({
provinceIndex: index,
provinceId: this.data.provinceList[index].id,
cityList: [],
districtList: [],
})
// 选市
this.getCity()
},
bindPickerChangeCity(e) {
let index = e.detail.value;
this.setData({
cityIndex: index,
cityId: this.data.cityList[index].id,
districtList: [],
})
this.getDistrict();
},
bindPickerChangeDistrict(e) {
let index = e.detail.value;
this.setData({
districtIndex: index,
districtId: this.data.districtList[index].id,
})
},
// 这里是一个自定义方法
customMethod() {
this.triggerEvent('evtcomp', {
......@@ -23,5 +242,9 @@ Component({
name: "_evt_hide_mask"
});
}
},
//
ready() {
this.getProvince();
}
})
......
......@@ -53,6 +53,10 @@ $contentWidth:690px;
padding: 0 20px;
margin-right: 10px;
.val {
@include ellipsis(1);
}
.icon {
width: 30px;
height: 17px;
......@@ -155,6 +159,11 @@ $contentWidth:690px;
margin: 0 auto;
@include cb();
}
.disable {
background: transparent;
background-color: #d2d2d2;
}
}
}
......
<view class="comp-item">
<view class="cont">
<!-- 导航 -->
<view wx:if="{{1>10}}" class="nav nav1">
<view wx:if="{{searchMode == 1}}" class="nav nav1">
<view class="place">
您当前所在城市：
<span class="city">深圳市</span>
</view>
<view class="btn">切换城市</view>
<view bindtap="onSearchHandModeHandler" data-data="1" class="btn">手动选择</view>
</view>
<view wx:else class="nav nav2">
<view class="area">
<view class="area-item">
省
<!-- 省 -->
<picker bindchange="bindPickerChangeProvince" value="{{provinceIndex}}" range="{{provinceList}}" range-key="name">
<view bindtap="getProvince" class="area-item">
<span class="val">
{{provinceList[provinceIndex].name ? provinceList[provinceIndex].name : '省'}}
</span>
<image class="icon" mode="widthFix" src="../../image/oss/icon/icon-drow-down.png" />
</view>
</picker>
<!-- 市 -->
<picker bindchange="bindPickerChangeCity" value="{{cityIndex}}" range="{{cityList}}" range-key="name">
<view class="area-item">
市
<span class="val">{{cityList[cityIndex].name ? cityList[cityIndex].name : '市'}}</span>
<image class="icon" mode="widthFix" src="../../image/oss/icon/icon-drow-down.png" />
</view>
</picker>
<!-- 区 -->
<picker bindchange="bindPickerChangeDistrict" value="{{districtIndex}}" range="{{districtList}}" range-key="name">
<view class="area-item">
区
<span class="val">
{{districtList[districtIndex].name ? districtList[districtIndex].name : '区'}}
</span>
<image class="icon" mode="widthFix" src="../../image/oss/icon/icon-drow-down.png" />
</view>
</picker>
</view>
<view class="btn">切换城市</view>
<view bindtap="onSearchAutoModeHandler" data-data="2" class="btn">自动选择</view>
</view>
<!-- 门店列表 -->
<scroll-view scroll-y="{{true}}" class="pos">
<view class="pos-item">
<view wx:if="{{1>10}}" class="check">
<image class="icon" mode="widthFix" src="../../image/oss/icon/icon-check.png" />
</view>
<view class="info">
<view class="tit">
<view class="name">坂田天虹店</view>
<view class="distance">距您1.2公里</view>
</view>
<view class="address">地址：安徽省安庆市大观区集贤南路43号八佰伴购物中心一楼</view>
</view>
<view class="loc">
<image class="icon" mode="widthFix" src="../../image/oss/icon/icon-loc.png" />
<view class="txt">导航</view>
</view>
</view>
<view class="pos-item">
<view class="check">
<image class="icon" mode="widthFix" src="../../image/oss/icon/icon-check.png" />
<view bindtap="onSelectHandler" data-data="{{item}}" data-index="{{index}}" wx:for="{{addressList}}" wx:key="{{index}}" class="pos-item">
<view wx:if="{{selectedMode}}" class="check">
<image wx:if="{{item.selected}}" class="icon" mode="widthFix" src="../../image/oss/icon/icon-check.png" />
</view>
<view class="info">
<view class="tit">
<view class="name">坂田天虹店</view>
<view class="distance">距您1.2公里</view>
<view class="name">{{item.storeName}}</view>
<view class="distance">距您{{item.distance}}</view>
</view>
<view class="address">地址：安徽省安庆市大观区集贤南路43号八佰伴购物中心一楼</view>
<view class="address">{{item.storeAddress}}</view>
</view>
<view class="loc">
<view bindtap="onShowLocHandler" data-data="{{item}}" class="loc">
<image class="icon" mode="widthFix" src="../../image/oss/icon/icon-loc.png" />
<view class="txt">导航</view>
</view>
</view>
</scroll-view>
<!-- 按钮 -->
<view wx:if="{{1>10}}" class="btn-wrap">
<view bindtap="onSelectHandler" class="store-btn">选择门店</view>
<view wx:if="{{selectedMode}}" class="btn-wrap">
<view wx:if="{{curAddress}}" bindtap="onSubmitHandler" class="store-btn">选择门店</view>
<view wx:else class="store-btn disable">选择门店</view>
</view>
</view>
</view>
......
......@@ -6,26 +6,10 @@ Component({
type: String,
value: 'default value',
},
eleList: {
type: Object,
value: [],
},
eleVal: {
type: Number,
value: 0,
},
wishBillInfo: {
type: Object,
value: {},
},
wishInfo: {
type: Object,
value: {},
},
wishList: {
type: Object,
value: [],
},
// 1正常(有库存) 2无库存
status: {
type: Number,
......@@ -49,19 +33,51 @@ Component({
name: "_evt_hide_mask"
});
},
// 自提 要带上参数
/**
* 提交礼品领取方式
*/
queryWishbillAcceptTypeSubmit(acceptType) {
return new Promise((resolve, reject) => {
let wishInfo = this.properties.wishInfo;
app.post({
url: app.api.wishbillAcceptTypeSubmit,
data: {
instanceCode: wishInfo.instanceCode,
acceptType: acceptType
}
}).then((result) => {
resolve(result)
})
});
},
// 自提
toSelfLiftHandler() {
this.queryWishbillAcceptTypeSubmit(2).then((result) => {
console.log("prize-self-result:", result);
let wishInfo = this.properties.wishInfo;
let query = Object.assign(wishInfo, result);
console.log("prize-self-query:", query);
this.hideMask();
app.router.push({
path: "prizeDetail",
query: this.properties.wishInfo
query: query
})
})
},
// 邮寄
toUserTableHandler() {
this.queryWishbillAcceptTypeSubmit(1).then((result) => {
console.log("prize-table-result:", result);
let wishInfo = this.properties.wishInfo;
let query = Object.assign(wishInfo, result);
console.log("prize-table-query:", query);
this.hideMask();
app.router.push({
path: "userTable",
query: query
})
})
},
......
......@@ -169,6 +169,199 @@ let productMap = {
}
/**
* @my-wish
* 点击领取心愿单奖品
*/
let wishbillGiftAccept = {
"status": 1,
"order": {
"acceptType": 0,
"instanceCode": "162951b667a746188c83491bd5601164",
"prizeName": "丸美弹力蛋白眼精华素10g+10g",
"prizePic": "",
"commodityNo": "11059001"
},
"coupon": null
}
/**
* @my-wish
* 点击单个心愿单奖品
*/
let curWish = {
accessStatus: 1,
commodityNo: "11059001",
conditionElasticValue: 5480,
coupon: null,
elasticValue: 10000,
initialElasticValue: 33,
instanceCode: "162951b667a746188c83491bd5601164",
name: "丸美弹力蛋白眼精华素10g+10g",
order: {
acceptType: 0,
instanceCode: "162951b667a746188c83491bd5601164",
prizeName: "丸美弹力蛋白眼精华素10g+10g",
prizePic: "",
commodityNo: "11059001"
},
point: {
left: 558,
top: 437
},
price: "548",
prizeDefineCode: "P000000000000000000000000000001",
prizeName: "丸美弹力蛋白眼精华素10g+10g",
prizePic: "",
progress: 100,
progressLeft: 169.00000000000003,
sence: 1,
status: 1,
storeRemain: 99,
tag: 3,
tips: {
type: "top-left",
point: {
fixLeft: -188,
fixTop: -314
}
}
}
// 读取心愿单奖品
let wishbillGiftQuery = {
"status": 1,
"order": {
"coupon": {
"couponId": "20839",
"couponCode": "RLLW18Q1",
"rule": "RLLW18Q1",
"startDate": 1564912960000,
"endDate": 1567526399000,
"type": 4,
"name": "眼部护理体验券-7月24日",
"state": 0
},
"acceptType": 2,
"instanceCode": "0924988c7fb0437b99c31b97bd1f1d6c",
"storeCode": "",
"storeName": "",
"storeAddress": "",
"latitude": 0.0,
"longitude": 0.0,
"prizeName": "丸美巧克力青春丝滑眼乳霜25g",
"orderSn": "MW20190804180237100003",
"commodityNo": "11039003"
},
"coupon": null
}
/**
* @tips-prize-comp
* 自提数据
*/
let prizeLiftQuery = {
"coupon": {
"couponId": "20839",
"couponCode": "RLLW18Q1",
"rule": "RLLW18Q1",
"startDate": 1564912960000,
"endDate": 1567526399000,
"type": 4,
"name": "眼部护理体验券-7月24日",
"state": 0
},
"acceptType": 2,
"instanceCode": "0924988c7fb0437b99c31b97bd1f1d6c",
"storeCode": "",
"storeName": "",
"storeAddress": "",
"latitude": 0.0,
"longitude": 0.0,
"prizeName": "丸美巧克力青春丝滑眼乳霜25g",
"orderSn": "MW20190804180237100003",
"commodityNo": "11039003"
}
/**
* @tips-prize-comp
* 邮寄提交返回数据
*/
let prizeTableQuery = {
address: "",
associateMobile: "",
associateName: "",
city: "",
commodityNo: "11059001",
district: "",
instanceCode: "162951b667a746188c83491bd5601164",
logisticsCompany: "",
logisticsSn: "",
memberCode: "654b8d70164e4c1e83e1503d44f325db",
orderSn: "MW20190804152353100001",
prizeName: "丸美弹力蛋白眼精华素10g+10g",
prizePic: "",
province: "",
}
/**
* @tips-prize-comp
* 邮寄提交返回数据 合并
*/
let prizeTableQueryAssign = {
accessStatus: 2,
address: "",
associateMobile: "",
associateName: "",
city: "",
commodityNo: "11059001",
conditionElasticValue: 5480,
coupon: null,
district: "",
elasticValue: 10000,
initialElasticValue: 33,
instanceCode: "162951b667a746188c83491bd5601164",
logisticsCompany: "",
logisticsSn: "",
memberCode: "654b8d70164e4c1e83e1503d44f325db",
name: "丸美弹力蛋白眼精华素10g+10g",
order: {
acceptType: 0,
instanceCode: "162951b667a746188c83491bd5601164",
prizeName: "丸美弹力蛋白眼精华素10g+10g",
prizePic: "",
commodityNo: "11059001"
},
orderSn: "MW20190804152353100001",
point: {
left: 558,
top: 437
},
price: "548",
prizeDefineCode: "P000000000000000000000000000001",
prizeName: "丸美弹力蛋白眼精华素10g+10g",
prizePic: "",
progress: 100,
progressLeft: 169.00000000000003,
province: "",
sence: 1,
status: 1,
storeRemain: 98,
tag: 3,
tips: {
type: "top-left",
point: {
fixLeft: -188,
fixTop: -314
},
},
}
module.exports = {
productMap: productMap
productMap: productMap,
prizeTableQueryAssign: prizeTableQueryAssign,
prizeLiftQuery: prizeLiftQuery,
wishbillGiftQuery: wishbillGiftQuery
}
......
......@@ -22,5 +22,10 @@ module.exports = {
wishbillAcceptTypeSubmit: '/warubiEyeCreamApi/app/wishbill/accept/type/submit', // post 提交礼品领取方式
wishbillAddressSubmit: '/warubiEyeCreamApi/app/wishbill/address/submit', // post 提交邮寄地址
wishbillStoreAppoint: '/warubiEyeCreamApi/app/wishbill/store/appoint', // post 预约自提门店
provinceQuery: '/warubiEyeCreamApi/app/store/province', // post 省
cityQuery: '/warubiEyeCreamApi/app/store/city', // post 市
districtQuery: '/warubiEyeCreamApi/app/store/district', // post 区
wxacodeGet: '/warubiEyeCreamApi/app/qrcode/create', //
}
......
import {
getBindtapData
wishbillGiftQuery
} from '../../const/custom-data';
import {
getBindtapData,
pxToRpx
} from '../../utils/util';
import Date from '../../utils/date';
import QR from '../../utils/qrcode'
let app = getApp();
Page({
data: {
userInfo: {},
used: false, //优惠券已使用，另外的样式
couponInfo: {
"couponId": "20839",
"couponCode": "RLLL1IHG",
"rule": "RLLL1IHG",
"startDate": 1564479217000,
"endDate": 1567094399000,
"type": 4,
"name": "眼部护理体验券-7月24日",
"state": 0,
"endDateStr": "19-08-29"
}
wishInfo: {},
couponInfo: {},
nearbyStoreVisible: false,
qrImagePath: "",
location: {},
},
onShareAppMessage() {},
onLoad(options) {
let couponInfo = options;
// let wishInfo = options;
let wishInfo = wishbillGiftQuery.order;
let couponInfo = wishInfo.coupon;
// 设置起止时间
couponInfo.startDateStr = new Date(couponInfo.startDate).toString("yyyy.MM.dd");
couponInfo.endDateStr = new Date(couponInfo.endDate).toString("yyyy.MM.dd");
// 判断是否使用
// 自提券 使用状态（0=未使用 1=已过期，2=已使用）
let used = couponInfo.state != 0;
// used = true;
// 设置数据
this.setData({
couponInfo: couponInfo
wishInfo: wishInfo,
couponInfo: couponInfo,
used: used
})
console.log("couponInfo:", couponInfo);
this.initData();
},
initData() {
......@@ -35,11 +50,124 @@ Page({
this.setData({
userInfo: app.globalData.userInfo
})
// 设置二维码
let couponInfo = this.data.couponInfo;
let qrSize = this.setCanvasSize(300);
console.log("couponInfo:", couponInfo);
let codeContent = couponInfo.couponCode || '';
this.createQrCode(codeContent, 'qrcanvas', qrSize.w, qrSize.h);
})
},
/**
* 请求门店地址
*/
queryShop() {
this.selectComponent("#nearbyStoreComp").queryShop().then((result) => {
this.setData({
nearbyStoreVisible: true
})
})
},
// 查看可用门店
onNearbyStoreHandler(evt) {
console.log("onNearbyStoreHandler couponInfo:", this.data.couponInfo);
this.wxLocation();
},
// 使用微信位置
wxLocation() {
let _this = this;
wx.getLocation({
type: 'wgs84',
success(res) {
_this.setData({
location: res
})
_this.queryShop();
},
fail(err) {
wx.getSetting({
success: (res) => {
if (!res.authSetting['scope.userLocation']) {
// 未授权
wx.showModal({
title: '提示',
content: '小程序请求访问地理位置',
confirmText: '前往授权',
success(res) {
if (res.confirm) {
wx.openSetting({
complete() {
//设置完后重拉一遍位置，拉不到就算了
wx.getLocation({
type: 'wgs84', // 默认为 wgs84 返回 gps 坐标，gcj02 返回可用于 wx.openLocation 的坐标
success: function (res) {
_this.setData({
location: res
})
_this.queryShop();
},
fail: function () {
_this.queryShop();
}
})
}
})
} else if (res.cancel) {
// 模态窗取消
_this.queryShop();
}
}
})
}
}
})
}
})
},
createQrCode(content, canvasId, cavW, cavH) {
//调用插件中的draw方法，绘制二维码图片
QR.api.draw(content, canvasId, cavW, cavH);
this.canvasToTempImage(canvasId);
},
//获取临时缓存图片路径，存入data中
canvasToTempImage(canvasId) {
let that = this;
wx.canvasToTempFilePath({
canvasId, // 这里canvasId即之前创建的canvas-id
success: function (res) {
let tempFilePath = res.tempFilePath;
console.log(tempFilePath);
that.setData({ // 如果采用mpvue,即 this.imagePath = tempFilePath
qrImagePath: tempFilePath,
});
},
fail: function (res) {
console.log(res);
}
});
},
//适配不同屏幕大小的canvas
setCanvasSize(sz) {
var size = {};
try {
var res = wx.getSystemInfoSync();
var scale = 750 / sz; //不同屏幕下canvas的适配比例；设计稿是750宽
var width = res.windowWidth / scale;
var height = width; //canvas画布为正方形
size.w = width;
size.h = height;
} catch (e) {
// Do something when catch error
console.log("获取设备信息失败" + e);
}
return size;
},
hideMask() {
this.setData({
nearbyStoreVisible: false
})
},
// 子组件事件
evtcomp(evt) {
......@@ -50,6 +178,18 @@ Page({
switch (name) {
case "_evt_hide":
this.hideMask();
break;
// 提交完毕
case "_evt_submit_store_complete":
// 刷新状态
this.hideMask();
wx.showModal({
content: '预约成功',
showCancel: false,
success(res) {}
});
break;
default:
......
{
"navigationBarTitleText": "卡券详情",
"usingComponents": {
"use-notice-comp": "../../component/use-notice-comp/use-notice-comp"
"use-notice-comp": "../../component/use-notice-comp/use-notice-comp",
"tips-nearby-store-comp": "../../component/tips-nearby-store-comp/tips-nearby-store-comp",
"van-popup": "../../ui/vant-weapp/popup/index"
}
}
......
......@@ -2,6 +2,7 @@
@import '../../assets/scss/utils';
.page {
position: relative;
padding-bottom: $pageBottom;
font-weight: 300;
......@@ -82,8 +83,12 @@
.qrcode {
width: 300px;
height: 300px;
background-color: wheat;
margin: 0 auto;
image {
width: 300px;
height: 300px;
}
}
// 数字码
......@@ -215,14 +220,20 @@
// 已使用
.used {
$alp: 0.3;
.qrcode {
opacity: $alp;
}
.info {
opacity: $alp;
}
// .qrcode {
// opacity: $alp;
// }
// .info {
// opacity: $alp;
// }
// .code{
// opacity: $alp;
// }
}
......
<canvas style="width: 300rpx;height: 300rpx;visibility: hidden;position:absolute;" canvas-id="qrcanvas" />
<view class="page">
<view class="app__bgc bgc"></view>
<view class="app__bg bg"></view>
......@@ -26,10 +27,14 @@
</view>
</view>
<!-- 二维码 -->
<view class="qrcode"></view>
<view class="qrcode">
<image class="image" mode="widthFix" src="{{qrImagePath}}" />
</view>
<view class="code">{{couponInfo.couponCode}}</view>
<!-- 预约自提按钮 -->
<view wx:if="{{1<10}}" bindtap="onNearbyStoreHandler" class="reservation-btn">预约自提门店</view>
<view wx:if="{{1<10}}" bindtap="onNearbyStoreHandler" class="reservation-btn">
预约自提门店
</view>
<!-- 预约成功 -->
<view wx:else class="reservation-complete">
<view class="tips">您已成功预约，请在有效期内前往领取</view>
......@@ -57,3 +62,6 @@
</view>
</view>
</view>
<van-popup show="{{ nearbyStoreVisible }}" position="bottom" bind:click-overlay="hideMask">
<tips-nearby-store-comp id="nearbyStoreComp" bind:evtcomp="evtcomp" wish-info="{{wishInfo}}" location="{{location}}" selectedMode="{{true}}"></tips-nearby-store-comp>
</van-popup>
......
import {
prizeTableQueryAssign
} from '../../const/custom-data';
import {
getBindtapData,
checkMobile,
} from '../../utils/util';
let app = getApp();
Page({
data: {
......@@ -5,17 +14,122 @@ Page({
receiverName: "",
receiverMobile: "",
receiverAddress: "",
addressStr: "", // 省市区合并地址
region: [],
regionStr: "",
prize: {}
prize: {},
wishInfo: {}
},
onShareAppMessage() {},
onLoad(options) {},
onLoad(options) {
// let wishInfo = options;
let wishInfo = prizeTableQueryAssign;
console.log("wishInfo:", wishInfo);
this.setData({
wishInfo: wishInfo
})
if (wishInfo.associateMobile) {
// 如果初始化回显，则要设置 表单信息
// 显示省市区
this.setData({
receiverName: wishInfo.associateName,
receiverMobile: wishInfo.associateMobile,
receiverAddress: wishInfo.address,
regionStr: wishInfo.province + wishInfo.city + wishInfo.district,
})
this.setStatus(1);
} else {
this.setStatus(0);
}
},
/**
* 提交表单
* @param {*} evt
*/
onSubmitHandler(evt) {},
onSubmitHandler(evt) {
let wishInfo = this.data.wishInfo;
let {
receiverName,
receiverMobile,
receiverAddress,
region,
} = this.data;
let receiverProvince = region[0];
let receiverCity = region[1];
let receiverDistrict = region[2];
let tips = "";
if (!receiverName) {
tips = "请输入姓名";
this.showTips(tips);
return;
}
if (!receiverMobile) {
tips = "请输入手机号码";
this.showTips(tips);
return;
}
if (!checkMobile(receiverMobile)) {
tips = "请输入正确的手机号";
this.showTips(tips);
return;
}
if (!receiverProvince || !receiverCity || !receiverDistrict) {
tips = "请选择区域";
this.showTips(tips);
return;
}
if (!receiverAddress) {
tips = "请填写地址";
this.showTips(tips);
return;
}
let data = {
instanceCode: wishInfo.instanceCode,
associateName: receiverName,
associateMobile: receiverMobile,
province: receiverProvince,
city: receiverCity,
district: receiverDistrict,
address: receiverAddress,
}
console.log("data:", data);
app.post({
url: app.api.wishbillAddressSubmit,
data: data
}).then((result) => {
this.setStatus(1);
})
},
// 设置显示状态 0：填写 1：回显
setStatus(tableIndex) {
if (tableIndex == 1) {
// 回显，拼接完整地址
this.refreshFullAddress();
}
this.setData({
tableIndex: tableIndex
})
},
/**
* 配置完整地址
*/
refreshFullAddress() {
let {
receiverAddress,
regionStr,
} = this.data;
let addressStr = regionStr + receiverAddress;
this.setData({
addressStr: addressStr
})
},
/**
* 返回心愿单页面
* @param {*} evt
......@@ -26,17 +140,39 @@ Page({
path: "wish"
})
},
bindNameInput(e) {
this.setData({
receiverName: e.detail.value
})
},
bindPhoneInput(e) {
this.setData({
receiverMobile: e.detail.value
})
},
bindAddressInput(e) {
this.setData({
receiverAddress: e.detail.value
})
},
bindRegionChange(e) {
let region = e.detail.value;
let regionStr = "";
if (region.length > 0) {
regionStr = region.join("，");
regionStr = region.join("");
}
this.setData({
region,
regionStr
})
},
showTips(tips) {
wx.showToast({
title: tips,
icon: 'none'
})
},
// 子组件事件
evtcomp(evt) {
let {
......
......@@ -165,13 +165,24 @@ $iptHeight:80px;
align-items: center;
width: 140px;
@extend .bb;
padding: 0 20px;
padding: 0 12px;
font-size: 26px;
.icon {
width: 15px;
height: 9px;
margin-left: 8px;
}
.val{
// @extend
@include ellipsis(1);
}
.holder{
}
}
.line {
......
......@@ -14,9 +14,9 @@
<image mode="widthFix" src="../../image/oss/user-table/user-table-c1.png" />
</view>
<view class="display">
<image class="prod" mode="aspectFit" src="../../image/prize/prize-1.png" />
<image wx:if="{{wishInfo.tag}}" class="prod" mode="aspectFit" src="../../image/prize/prize-{{wishInfo.tag}}.png" />
</view>
<view class="name">丸美弹力蛋白凝时紧致乳</view>
<view class="name">{{wishInfo.prizeName}}</view>
</view>
<!-- 表单 -->
<view class="table">
......@@ -28,28 +28,31 @@
<view class="form">
<view class="ipt">
<view class="label">姓名</view>
<input class="input" placeholder="请输入" />
<input value="{{receiverName}}" bindinput="bindNameInput" class="input" placeholder="请输入" />
</view>
<view class="ipt">
<view class="label">电话</view>
<input class="input" placeholder="请输入" />
<input value="{{receiverMobile}}" bindinput="bindPhoneInput" class="input" placeholder="请输入" />
</view>
<view class="ipt">
<view class="label">区域</view>
<picker class="form-detail-item-label" mode="region" bindchange="bindRegionChange" value="{{region}}">
<view class="input area">
<view class="area-item area-item2">
省
<span class="val">{{region[0]?region[0]:'省'}}</span>
<!-- <span wx:if="{{!region[0]}}" class="holder">省</span> -->
<image class="icon" mode="widthFix" src="../../image/oss/icon/icon-drow-down.png" />
</view>
<view class="line"></view>
<view class="area-item area-item2">
市
<span class="val">{{region[1]?region[1]:'市'}}</span>
<!-- <span wx:if="{{!region[1]}}" class="holder">市</span> -->
<image class="icon" mode="widthFix" src="../../image/oss/icon/icon-drow-down.png" />
</view>
<view class="line"></view>
<view class="area-item area-item2">
区
<span class="val">{{region[2]?region[2]:'区'}}</span>
<!-- <span wx:if="{{!region[2]}}" class="holder">区</span> -->
<image class="icon" mode="widthFix" src="../../image/oss/icon/icon-drow-down.png" />
</view>
</view>
......@@ -57,7 +60,7 @@
</view>
<view class="ipt ipt2">
<view class="label">地址</view>
<textarea class="input textarea" placeholder="请输入"></textarea>
<textarea value="{{receiverAddress}}" bindinput="bindAddressInput" class="input textarea" placeholder="请输入"></textarea>
</view>
</view>
<view bindtap="onSubmitHandler" class="submit-btn">确认提交</view>
......@@ -68,16 +71,16 @@
<view class="tips">*感谢您提交的地址，我们将尽快为您送出以上礼品</view>
<view class="form">
<view class="form-item">
<view class="label">姓名</view>
<view class="label">{{wishInfo.associateName}}</view>
<view class="val">林小美</view>
</view>
<view class="form-item">
<view class="label">电话</view>
<view class="val">18812345678</view>
<view class="val">{{wishInfo.associateMobile}}</view>
</view>
<view class="form-item">
<view class="label">地址</view>
<view class="val">广州市天河区珠江新城花城大道路xx广州市天河区珠江新城花城大道路xx广州市天河区珠江新城花城大道路xx</view>
<view class="val">{{regionStr}}{{wishInfo.addressStr}}</view>
</view>
</view>
<view bindtap="onWishHandler" class="submit-btn">返回首页</view>
......
......@@ -16,7 +16,18 @@ Page({
wishInfo: {},
wishList: [],
helperInfo: {},
curWish: {},
// curWish: {},
curWish: {
"status": 1,
"order": {
"acceptType": 0,
"instanceCode": "162951b667a746188c83491bd5601164",
"prizeName": "丸美弹力蛋白眼精华素10g+10g",
"prizePic": "",
"commodityNo": "11059001"
},
"coupon": null
},
status: 1, // 1正常(有库存) 2无库存
},
onShareAppMessage() {},
......@@ -38,28 +49,64 @@ Page({
onGetGiftHandler(evt) {
let curData = getBindtapData(evt);
console.log("curData:", curData);
this.setData({
curWish: curData,
tipsPirzeVisible: true,
})
return;
app.poster({
app.post({
url: app.api.wishbillGiftAccept,
data: curData
data: {
instanceCode: curData.instanceCode
}
}).then((result) => {
// let curData
curData = Object.assign(curData, result);
this.setData({
curWish: curData,
tipsPirzeVisible: true,
status: curData.status
})
});
},
/**
* 查看我的奖品
* 点击领取
*/
onCheckGiftHandler(evt) {
let curData = getBindtapData(evt);
console.log("curData:", curData);
// console.log("curData:", curData);
app.post({
url: app.api.wishbillGiftQuery,
data: {
instanceCode: curData.instanceCode
}
}).then((result) => {
curData = Object.assign(curData, result);
console.log("curData 222:", curData);
this.setData({
curWish: curData,
status: curData.status
})
// 领取状态
// 领取类型：0=未提交；1=邮寄（填写邮寄信息）；2=自提（填门店预约信息）
let acceptType = curData.order.acceptType;
console.log("acceptType:",acceptType);
if (acceptType == 0) {
// 未提交，显示领取选择
this.setData({
tipsPirzeVisible: true,
})
} else if (acceptType == 1) {
// 已经选择邮寄
// 判断是否已经填写邮寄信息
app.router.push({
path: "userTable"
})
} else if (acceptType == 2) {
// 已经选择自提
app.router.push({
path: "prizeDetail"
})
}
// 查看是否已经预约
})
},
// 显示规则页面
onShowRuleHandler() {
......