[本时生活h5端]

2023-06-21 17:19:58 +08:00
commit ebb9575bd0
284 changed files with 39689 additions and 0 deletions
--- a/pages/payPassword/forget.vue
+++ b/pages/payPassword/forget.vue
@@ -0,0 +1,140 @@
+<template>
+    <view>
+        <view class="pass">
+            <form @submit="formSubmit">
+                <view class="favourCont-label">
+                    <view class="favourCont-name">手机号：</view>
+                    <input type="number" placeholder="请输入手机号" v-model="mobileNo" />
+                    <button @tap="sendOut" class="obtain" :disabled="senddisabled" hover-class="none">{{ codename }}</button>
+                </view>
+                <view class="favourCont-label">
+                    <view class="favourCont-name">验证码</view>
+                    <input type="number" name="code" placeholder="请输入验证码" />
+                </view>
+                <view class="favourCont-label">
+                    <view class="favourCont-name">新密码：</view>
+                    <input type="number" password name="password" placeholder="请输入新的支付密码" />
+                </view>
+                <view class="favourCont-label">
+                    <view class="favourCont-name">确认密码：</view>
+                    <input type="number" password name="confirmation" placeholder="请再次输入支付密码" />
+                </view>
+                <view class="favourCont-btn">
+                    <button formType="submit" :disabled="disabled">确认设置</button>
+                </view>
+            </form>
+        </view>
+    </view>
+</template>
+
+<script>
+    import { send } from '@/apis/interfaces/user'
+    export default {
+        data() {
+            return {
+                mobileNo    : '', // 手机号
+                codename    : '获取验证码',
+                senddisabled: false, // 获取验证码-按钮提交状态
+                disabled    : false // 按钮提交状态
+            }
+        },
+        // 生命周期函数--监听页面加载
+        onLoad(options) {},
+    
+        // 生命周期函数--监听页面显示
+        onShow() {},
+        methods: {
+            // 发送短信
+            sendOut(e) {
+                var _this = this
+                send({
+                    mobile: this.mobileNo,
+                    channel: 'PAYPASS'
+                }).then(res=>{
+                    uni.showToast({
+                        title   : '发送成功',
+                        icon    : 'success',
+                        duration: 2000
+                    })
+                    var num = 61;
+                        var timer = setInterval(function () {
+                            num--;
+                        if (num <= 0) {
+                            clearInterval(timer);
+                            _this.codename     = '重新发送'
+                            _this.senddisabled = false
+                
+                        } else {
+                           _this.codename     = num + "s后重新获取"
+                           _this.senddisabled = true
+                        }
+                        }, 1000)
+                }).catch(err=>{}) 
+            }
+        }
+    }
+</script>
+
+<style lang="scss" scoped>
+    .favourCont-label {
+        background-color: #fff;
+        height: 120rpx;
+        padding: 0 30rpx;
+        box-sizing: border-box;
+        display: flex;
+        position: relative;
+        input {
+            position: absolute;
+            left: 0;
+            top: 0;
+            width: 100%;
+            height: 100rpx;
+            line-height: 100rpx;
+            font-size: 30rpx;
+            padding-left: 220rpx;
+            box-sizing: border-box;
+        }
+    }
+    
+    .favourCont-name {
+        line-height: 100rpx;
+    }
+    
+    .favourCont-btn {
+        width: 100%;
+        padding: 0 30rpx;
+        box-sizing: border-box;
+        margin-top: 50rpx;
+        button {
+            background-color: #3a3b3e;
+            color: #fff;
+            width: 100% !important;
+            height: 90rpx;
+            line-height: 90rpx;
+            font-size: 32rpx;
+        }
+        
+    }
+    
+    .forget {
+        text-align: center;
+        line-height: 90rpx;
+        font-size: 30rpx;
+    }
+    
+    .obtain {
+        color: #d6571f;
+        background: none;
+        border: none;
+        font-size: 30rpx;
+        position: absolute;
+        width: auto !important;
+        text-align: right;
+        line-height: 100rpx;
+        z-index: 9;
+        padding: 0;
+        margin: 0;
+        right: 20rpx;
+        top: 0;
+    }
+</style>