|
|
@ -1,89 +1,109 @@ |
|
|
|
<template> |
|
|
|
<view style="display: flex;flex-direction: column;background-color: #fff;"> |
|
|
|
<view style="display: flex;flex-direction: column;background-color: #fff;height: 100%;"> |
|
|
|
|
|
|
|
<view class="top"> |
|
|
|
<NavBar ref="nav" navTitle="绑定云菜窖" :showIcon="true" :start-change-height="page.startHeight" |
|
|
|
<NavBar ref="nav" navTitle=" " :showIcon="true" :start-change-height="page.startHeight" |
|
|
|
:end-change-height="page.endHeight"> |
|
|
|
</NavBar> |
|
|
|
<view> |
|
|
|
<image src="https://supervise.yxtsoft.com/lpk/image/bind_bj_new.png" mode="scaleToFill" |
|
|
|
<image src="https://supervise.yxtsoft.com/lpk/image/bind_bj_new1.png" mode="scaleToFill" |
|
|
|
style="width: 100%;height: 70vw"></image> |
|
|
|
</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- <view style="display: flex;flex-direction: column;margin-top: -10vw;box-sizing: border-box;"> |
|
|
|
<view |
|
|
|
style="display: flex;flex-direction: column;border-radius: 20rpx;background: #FFFFFF;z-index: 1;align-items: center;box-sizing: border-box;"> |
|
|
|
<view style="margin: 15px;">绑定云菜窖卡</view> |
|
|
|
<view |
|
|
|
style="display: flex;flex-direction: row;justify-content: space-between;box-sizing: border-box;width: calc(100vw - 60px);align-items: center;"> |
|
|
|
<input maxlength="20" placeholder="请输入/扫码 提货编码" |
|
|
|
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;margin-right: 10px;padding-left: 10px;" |
|
|
|
type="number" :value="page.code" @input="onKeyInput1" /> |
|
|
|
<uni-icons type="camera-filled" color="#c0c4cc" size="22" style="flex-shrink: 0;" @click="scan" /> |
|
|
|
</view> |
|
|
|
<view |
|
|
|
style="display: flex;flex-direction: row;justify-content: space-between;box-sizing: border-box;width: calc(100vw - 60px);align-items: center;margin-top: 10px;"> |
|
|
|
<input maxlength="6" placeholder="请输入提货密码" |
|
|
|
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;" |
|
|
|
type="number" :value="page.codeKey" @input="onKeyInput2" /> |
|
|
|
</view> |
|
|
|
<view |
|
|
|
style="height: calc(100vh - 75vw - 98px); overflow: scroll; padding-left: 12px;padding-right: 12px;padding-bottom: 24px;box-sizing: border-box;"> |
|
|
|
<view style="display: flex;flex-direction: row;align-items: center;"> |
|
|
|
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|
|
|
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|
|
|
<text style="margin-left: 8px;font-size: 18px;color: #333;">好友赠与的礼品</text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view v-for="(item,index) in data.list" |
|
|
|
style="display: flex;flex-direction: row;width: 100%;margin-top: 5px;"> |
|
|
|
|
|
|
|
<view |
|
|
|
style="margin: 30px;background-color: #fd3655;width: calc(100% - 60px);border-radius: 100rpx;height: 80rpx;display: flex;flex-direction: column;align-items: center;line-height: 80rpx;color: #FFFFFF;font-size: 36rpx;" |
|
|
|
@click="save"> |
|
|
|
绑定</view> --> |
|
|
|
<view style="display: flex;flex-direction: row;align-items: center;justify-content: space-between;width: 100%; |
|
|
|
padding-left: 20px;padding-right: 20px;margin-top: 8px;"> |
|
|
|
<!-- <text style="font-size: 12px;color: #666;">{{item.goodsName}}</text> |
|
|
|
<text style="font-size: 12px;color: #666;">{{item.remarks}}</text> --> |
|
|
|
|
|
|
|
<view style="display: flex;flex-direction: column;padding:20px;"> |
|
|
|
<view style="display: flex;flex-direction: row;align-items: center;box-sizing: border-box;"> |
|
|
|
|
|
|
|
<view style="display: flex;flex-direction: row;align-items: center;"> |
|
|
|
<image :src="item.goodsPicUrl" mode="aspectFill" |
|
|
|
style="width: 90px;height: 90px;border-radius: 10px;flex-shrink: 0;"></image> |
|
|
|
|
|
|
|
<view style="display: flex;flex-direction: column;margin-left:16px;box-sizing: border-box;"> |
|
|
|
|
|
|
|
<text |
|
|
|
style="color: #000;font-size: 14px;font-weight: 600;font-family: sans-serif;">{{item.goodsName}}</text> |
|
|
|
<text style="margin-top: 6px;color: #999;font-size: 12px;">{{item.goodsContent}}</text> |
|
|
|
|
|
|
|
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 15px;"> |
|
|
|
|
|
|
|
<text style="color: #E36443;font-size: 12px;">{{item.goodsFs}}</text> |
|
|
|
<text style="color: #E36443;margin-left: 10px;font-size: 12px;">{{item.goodsJs}}</text> |
|
|
|
<text |
|
|
|
style="margin-left: 10px;color: #E36443;border: 1px #E36443 solid;border-radius: 8px;padding: 1px 10px;font-size: 12px;">{{item.price}}</text> |
|
|
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 10px;" |
|
|
|
v-if="data.remarks!=''"> |
|
|
|
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|
|
|
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|
|
|
<text style="margin-left: 8px;font-size: 18px;color: #333;">绑定云菜窖</text> |
|
|
|
<text style="margin-left: 8px;font-size: 18px;color: #333;">转赠留言</text> |
|
|
|
</view> |
|
|
|
|
|
|
|
<text style="margin-left: 8px;font-size: 14px;color: #333;margin-top: 20px;">转赠单号</text> |
|
|
|
<view style="display: flex;flex-direction: row;justify-content: space-between; |
|
|
|
background: #F8F8F8;border-radius: 5px;box-sizing: border-box; |
|
|
|
width: calc(100vw -40px);align-items: center; padding:10px 0px;margin-top: 5px;"> |
|
|
|
<input maxlength="20" placeholder="请输入" |
|
|
|
style="font-size: 30rpx;flex: 1;margin-right: 20px;padding-left: 10px;" type="number" |
|
|
|
:value="page.code" @input="onKeyInput1" /> |
|
|
|
<!-- <view style="width: 1px;height: 20px;background: #ccc; margin-right: 10px;"></view> --> |
|
|
|
<!-- <uni-icons type="camera-filled" color="#c0c4cc" size="22" style="flex-shrink: 0;margin-right: 10px;" |
|
|
|
@click="scan" /> --> |
|
|
|
</view> |
|
|
|
<!-- <text style="margin-left: 8px;font-size: 14px;color: #333;margin-top: 20px;">提货密码</text> |
|
|
|
<view style="display: flex;flex-direction: row;justify-content: space-between; |
|
|
|
background: #F8F8F8;border-radius: 5px; padding:10px 0px; |
|
|
|
box-sizing: border-box;width: calc(100vw - 40px);align-items: center;margin-top: 10px;"> |
|
|
|
<input maxlength="6" placeholder="请输入提货密码" style="font-size: 30rpx;flex: 1;padding-left: 10px;" |
|
|
|
type="number" :value="page.codeKey" @input="onKeyInput2" /> |
|
|
|
</view> --> |
|
|
|
|
|
|
|
<text style="margin-left: 8px;font-size: 14px;color: #333;margin-top: 20px;">转赠内容</text> |
|
|
|
|
|
|
|
<scroll-view scroll-y="true" style="height:20vh; width: 100%;margin-top: 10px;" bindscrolltoupper="upper" |
|
|
|
bindscrolltolower="lower" bindscroll="scroll"> |
|
|
|
<view v-for="(item,index) in data" style="display: flex;flex-direction: row;width: 100%;"> |
|
|
|
|
|
|
|
<view style="display: flex;flex-direction: row;align-items: center;justify-content: space-between;width: 100%; |
|
|
|
padding-left: 20px;padding-right: 20px;margin-top: 8px;"> |
|
|
|
<text style="font-size: 12px;color: #666;">{{item.goodsName}}</text> |
|
|
|
<text style="font-size: 12px;color: #666;">{{item.remarks}}</text> |
|
|
|
</view> |
|
|
|
<text v-if="data.remarks!=''" |
|
|
|
style="margin-top: 12px; padding-left: 20px;padding-right: 20px;text-indent: 2em;font-size: 16px;color: #333; |
|
|
|
overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;">{{data.remarks}}</text> |
|
|
|
|
|
|
|
</view> |
|
|
|
</scroll-view> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
<view v-if="codeType" style="position: absolute; bottom: 24px; display: flex;flex-direction: column;width: 100%; |
|
|
|
padding-left: 21.5px;padding-right: 21.5px;box-sizing: border-box;border-top: 1px solid #EFEFEF; "> |
|
|
|
|
|
|
|
<text |
|
|
|
style=" text-align: center;width: 100%;color: #4F4F4F;font-size: 12px;margin-top: 12px;">温馨提示:您的好友赠送您一份健康蔬菜,请接收。</text> |
|
|
|
<view style="background: -webkit-linear-gradient(left,#FFB176,#FE923B); |
|
|
|
width: 100%;border-radius: 25px;height: 50px;text-align: center; |
|
|
|
margin-top: 12px;line-height: 50px;color: #FFFFFF;font-size: 16px;" @click="save"> |
|
|
|
接收</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
<!-- 恢复预约提货弹框 --> |
|
|
|
<view class="model" catchtouchmove='preventTouchMove' v-if='showModal'></view> |
|
|
|
<view class="modalDlg2" catchtouchmove='preventTouchMove' v-if='showModal'> |
|
|
|
|
|
|
|
<view style="display: flex;flex-direction: column;justify-content: center;align-items: center; |
|
|
|
width: 80%; border-radius: 20px; background: linear-gradient(#FFF4E4, #fff);"> |
|
|
|
|
|
|
|
<image src="../../static/notices.png" style="width: 60px;height: 60px; margin-top: -30px;" |
|
|
|
mode="scaleToFill"></image> |
|
|
|
|
|
|
|
<text |
|
|
|
style="margin-top: 16px;font-size: 18px;color: #101010;font-weight: 600;font-family: sans-serif;">温馨提示</text> |
|
|
|
<text |
|
|
|
style="margin-top: 12px;font-size: 14px;color: #333;padding-left: 30px;padding-right: 30px;">此卡已被领取,请核对转增信息。</text> |
|
|
|
|
|
|
|
<text style="margin-top: 25px;margin-bottom: 20px;border: 1px #FF9900 solid; color: #FF9900;font-size: 14px; |
|
|
|
border-radius: 20px;height: 40px; line-height: 40px;padding-left: 30px;padding-right: 30px;" |
|
|
|
@click="colseDialog()">确定</text> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
<view style="background: -webkit-linear-gradient(left,#FFB176,#FE923B); position: absolute; bottom: 30px; |
|
|
|
width: 90%;border-radius: 100rpx;height: 80rpx;display: flex; |
|
|
|
flex-direction: column;align-items: center;line-height: 80rpx;color: #FFFFFF;font-size: 36rpx;" @click="save"> |
|
|
|
绑定</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</template> |
|
|
@ -101,7 +121,11 @@ |
|
|
|
startHeight: 0, |
|
|
|
endHeight: 0 |
|
|
|
}, |
|
|
|
data:[] |
|
|
|
data: { |
|
|
|
remarks: "" |
|
|
|
}, |
|
|
|
codeType: false, |
|
|
|
showModal: false |
|
|
|
} |
|
|
|
}, |
|
|
|
onLoad(options) { |
|
|
@ -111,6 +135,7 @@ |
|
|
|
|
|
|
|
|
|
|
|
this.page.customerSid = getApp().globalData.sid |
|
|
|
|
|
|
|
let info = uni.getSystemInfoSync(); |
|
|
|
|
|
|
|
this.page.startHeight = info.windowWidth * 0.6 |
|
|
@ -118,11 +143,32 @@ |
|
|
|
this.getData() |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
|
|
|
|
getData(){ |
|
|
|
let _this = this |
|
|
|
colseDialog() { |
|
|
|
this.showModal = false |
|
|
|
}, |
|
|
|
getData() { |
|
|
|
let _this = this |
|
|
|
_this.$api.getTransferByCode(this.page.code).then((resp) => { |
|
|
|
_this.data = resp |
|
|
|
|
|
|
|
// 1 未领取 2 已绑定 |
|
|
|
|
|
|
|
// 已绑定 |
|
|
|
if ('2' == resp.state) { |
|
|
|
|
|
|
|
if (resp.recipientSid == _this.page.customerSid) { |
|
|
|
uni.redirectTo({ |
|
|
|
url: '/pages/login/login' |
|
|
|
}) |
|
|
|
} else { |
|
|
|
_this.showModal = true |
|
|
|
} |
|
|
|
|
|
|
|
} else { |
|
|
|
_this.data = resp |
|
|
|
_this.codeType = true |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}).catch(e => { |
|
|
|
_this.longToast(e.msg) |
|
|
@ -175,8 +221,8 @@ |
|
|
|
uni.navigateBack(1) |
|
|
|
return; |
|
|
|
} else { |
|
|
|
uni.switchTab({ |
|
|
|
url: '/pages/home/myCellar' |
|
|
|
uni.redirectTo({ |
|
|
|
url: '/pages/login/login' |
|
|
|
}) |
|
|
|
} |
|
|
|
|
|
|
@ -194,4 +240,34 @@ |
|
|
|
width: 100vw; |
|
|
|
height: 70vw; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
/* 弹窗样式 */ |
|
|
|
.model { |
|
|
|
position: absolute; |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
background: #000; |
|
|
|
z-index: 100000; |
|
|
|
opacity: 0.7; |
|
|
|
top: 0; |
|
|
|
left: 0; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modalDlg2 { |
|
|
|
/* 设置超出滚动 */ |
|
|
|
overflow: auto; |
|
|
|
position: fixed; |
|
|
|
z-index: 100000; |
|
|
|
display: flex; |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
top: 0; |
|
|
|
left: 0; |
|
|
|
flex-direction: column; |
|
|
|
justify-content: center; |
|
|
|
align-items: center; |
|
|
|
} |
|
|
|
|
|
|
|
</style> |