zhangjing/ysdH5
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

[本时生活h5端]

Browse Source
This commit is contained in:
张慢慢
2023-06-21 17:19:58 +08:00
commit ebb9575bd0
284 changed files with 39689 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

367
pages/favour/favour.vue Normal file
View File

@@ -0,0 +1,367 @@
<template>
<view>
<view class="favourTitle">
<image class="favourTitle-img" src="https://card.ysd-bs.com/storage/materials/2021/09/01/favour_title.png" mode="widthFix"></image>
</view>
<view class="favourBack" v-if="typeArr[typeIndex]">
<image class="favourBack-img" src="https://card.ysd-bs.com/storage/materials/2021/09/01/favour_back.png" mode="widthFix"></image>
<view class="favourBack-cont-title">我的{{ typeArr[typeIndex].value }}</view>
<view class="favourBack-cont">
<view class="favourBack-cont-name">{{ typeArr[typeIndex].value }}</view>
<view class="favourBack-cont-number">
<text>{{ typeArr[typeIndex].key == 'silver' ? account.silver : account.drill }}</text>元
</view>
</view>
<view class="favourCont">
<view class="favourBlack">
<view class="favourCont-title">赠好友消费红包</view>
<form @submit="formSubmit">
<view class="favourCont-label">
<view class="favourCont-name">账户类型</view>
<picker class="favourCont-picker" :range="typeArr" :range-key="'value'" @change="typeBind">
<view class="tabs-text">
{{ typeArr[typeIndex].value }}
</view>
<image src="/static/icon/rightsArrow.png"></image>
</picker>
</view>
<view class="favourCont-label">
<view class="favourCont-name">好友手机号</view>
<view class="favourCont-check">
<input type="number" @input="bindKeyInput" placeholder="输入好友手机号" />
<view class="favourCont-check-btn" @tap="checkTel">校验号码</view>
</view>
</view>
<view class="favourCont-label">
<view class="favourCont-name">转账金额</view>
<input type="digit" name="amount" placeholder="请输入转账金额" />
</view>
<view class="favourCont-label">
<view class="favourCont-name">支付密码</view>
<input type="number" name="paypass" placeholder="请输入支付密码" password />
</view>
<button class="favourCont-btn" formType="submit" :disabled="disabled">立即转入</button>
</form>
</view>
<navigator class="favourCont-record" v-if="typeArr[typeIndex]" hover-class="none" :url="'/pages/account/account?type=' + typeArr[typeIndex].key"><text>赠予记录</text>
</navigator>
</view>
</view>
<!-- 校验手机号弹出 -->
<view class="popTel-back" v-if="popShow"></view>
<view class="popTel" v-if="popShow">
<view class="popTel-title">当前转入的账户信息</view>
<view class="popTel-cont">
<image class="popTel-head" :src="userInfo.avatar"></image>
<view class="popTel-name">{{ userInfo.nickname }}</view>
</view>
<view class="popTel-btn" @tap="popHide">知道了</view>
</view>
</view>
</template>
<script>
import { transfers, ajaxTel, transfersForm } from '@/apis/interfaces/user'
export default {
data() {
return {
account : '', //账户积分
typeArr : [], //转账类型
typeIndex: 0, //转账下标
userInfo : '', //转账用户信息
mobile : '', //转账手机号
disabled : false, //支付按钮状态
popShow : false //校验弹出层
}
},
onLoad(options) {
// 获取账户下拉列表
this.accountList();
},
methods: {
// 账户下拉列表
accountList() {
transfers().then(res=>{
this.account = res.account
this.typeArr = res.accounts
}).catch(err=>{})
},
// 账户下拉选择
typeBind(e) {
this.typeIndex = e.detail.value
},
// 转入的手机号
bindKeyInput(val){
this.mobile = val.detail.value
},
// 校验手机号码
checkTel() {
ajaxTel(this.mobile).then(res=>{
this.userInfo = res
this.popShow = !this.popShow
}).catch(err=>{})
},
// 关闭校验弹出
popHide() {
this.popShow = !this.popShow
},
// 提交表单
formSubmit(e) {
// 检查用户登录状态
const Paypass = uni.getStorageSync("hasPaypass")
if(Paypass == false) {
uni.showModal({
title : '提示',
content : '抱歉，您还没有设置支付密码',
success : res=> {
if (res.confirm) {
uni.navigateTo({
url: '/pages/payPassword/setup?source=favourUrl'
})
} else if (res.cancel) {}
}
})
return
}
let newAmount = e.detail.value.amount,
newMobile = this.mobile,
newPaypass = e.detail.value.paypass,
newType = this.typeArr[this.typeIndex].key
transfersForm({
mobile: newMobile,
type: newType,
amount: newAmount,
paypass: newPaypass
}).then(res=>{
this.disabled = true
uni.showToast({
title: '转入成功',
})
setTimeout(()=>{
uni.redirectTo({
url: "/pages/account/account?type=" + newType
})
},2000)
}) .catch(err=>{
uni.showToast({
title: err.message,
icon:'none'
})
})
}
}
}
</script>
<style lang="scss" scoped>
page {
background-color: #000000;
}
.favourTitle {
text-align: center;
margin: 40rpx 0;
}
.favourBack{
position: relative;
width: 100vw;
}
.favourBack-img {
width: 100vw;
display: block;
}
.favourBack-cont {
position: absolute;
top: 100rpx;
left: 0;
padding-left: 14%;
z-index: 1;
color: #606060;
width: 100%;
box-sizing: border-box;
}
.favourBack-cont-number {
color: #000000;
width: 100%;
margin-top: 20rpx;
text {
font-size: 50rpx;
font-weight: 600;
padding-right: 10rpx;
display: inline-block;
}
}
.favourBack-cont-title {
position: absolute;
top: 0;
left: 0;
width: 100%;
text-align: center;
font-size: 26rpx;
line-height: 50rpx;
}
.favourCont {
background-color: #ffffff;
padding: 40rpx 50rpx;
width: 100%;
box-sizing: border-box;
border-radius: 5rpx 5rpx 0 0;
}
.favourBlack {
background-color: #e9e9e9;
padding: 40rpx;
box-sizing: border-box;
border-radius: 45rpx;
}
.favourCont-record {
line-height: 90rpx;
text-align: center;
font-size: 34rpx;
}
.favourCont-title {
font-size: 45rpx;
text-align: center;
}
.favourCont-label {
display: flex;
margin-top: 40rpx;
font-size: 28rpx;
input {
font-size: 28rpx;
}
}
.favourCont-check,
.favourCont-picker,
.favourCont-label>input {
background-color: #c9c9c9;
display: flex;
width: calc(100% - 160rpx);
padding: 0 20rpx;
box-sizing: border-box;
height: 80rpx;
line-height: 80rpx;
}
.favourCont-picker {
position: relative;
image {
width: 40rpx;
height: 40rpx;
position: absolute;
right: 0;
top: 20rpx;
z-index: 2;
}
input {
height: 80rpx;
line-height: 80rpx;
}
}
.favourCont-check input,
.favourCont-picker input {
height: 80rpx;
line-height: 80rpx;
}
.favourCont-name {
width: 160rpx;
line-height: 80rpx;
}
.favourCont-check-btn {
width: 150rpx;
text-align: center;
background-color: #a1a1a1;
line-height: 60rpx;
height: 60rpx;
margin-top: 10rpx;
font-size: 24rpx;
}
.favourCont-btn {
width: 100% !important;
background-color: #dbc190;
margin-top: 40rpx;
border-radius: 60rpx;
}
.tabs-text {
width: 100%;
position: absolute;
left: 0;
top: 0;
padding-left: 20rpx;
box-sizing: border-box;
}
/* 校验弹出层 */
.popTel-back {
position: fixed;
left: 0;
top: 0;
background: rgba(0, 0, 0, .7);
width: 100vw;
height: 100vh;
z-index: 10;
}
.popTel {
position: fixed;
left: 140rpx;
right: 140rpx;
top: 30%;
z-index: 11;
background-color: #fff;
border-radius: 20rpx;
text-align: center;
overflow: hidden;
}
.popTel-title {
font-size: 32rpx;
background-color: #ff8e65;
color: #fff;
line-height: 80rpx;
}
.popTel-cont {
padding: 60rpx 0;
}
.popTel-head {
width: 100rpx;
height: 100rpx;
border-radius: 50%;
margin: 0 auto 20rpx;
border: #ff8e65 solid 2rpx;
}
.popTel-btn {
border-top: 2rpx solid #dedede;
line-height: 90rpx;
color: #ff8e65;
font-size: 30rpx;
}
</style>