[本时生活h5端]

pages/payPassword/setup.vue

@@ -0,0 +1,141 @@
+<template>
+    <view>
+        <view class="pass">
+            <form @submit="formSubmit">
+                <view class="favourCont-label" v-if="passType">
+                    <view class="favourCont-name">旧密码：</view>
+                    <input type="number" password name="oldPassword" placeholder="请输入旧密码" />
+                </view>
+                <view class="favourCont-label">
+                    <view class="favourCont-name">{{ passType ? '新密码' : '输入密码' }}：</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>
+                    <navigator hover-class="none" url="/pages/payPassword/forget" class="forget" v-if="passType">忘记密码， 立即找回？</navigator>
+                </view>
+            </form>
+        </view>
+    </view>
+</template>
+
+<script>
+    import { setPassword, changePassword } from '@/apis/interfaces/user'
+    export default {
+        data() {
+            return {
+                passSource  : '',    // 设置密码跳转来源favourUrl为转账跳转
+                passType    : '',    // 是否是首次设置密码
+                disabled    : false, // 设置支付密码
+                password    : '',    // 支付密码
+                confirmation: ''     // 确认密码
+            }
+        },
+        // 生命周期函数--监听页面加载
+        onLoad(options) {
+            // 检查用户登录状态
+            const Paypass = uni.getStorageSync("hasPaypass")
+    
+            this.passType  = Paypass
+            this.passSource= options.source
+        },
+    
+        // 生命周期函数--监听页面显示
+        onShow() {},
+        methods: {
+            // 设置密码
+            formSubmit(e) {
+                let newoldPassword= e.detail.value.oldPassword,
+                    newPassword   = e.detail.value.password,
+                    newFormSubmit = e.detail.value.confirmation
+        
+                let newUrl = '' //定义接口来源名称
+        
+                if(this.passType == false) newUrl = setPassword({password: newPassword, password_confirmation: newFormSubmit})
+                if(this.passType == true) newUrl = changePassword({old_password: newoldPassword, password: newPassword, password_confirmation: newFormSubmit})
+        
+                newUrl.then(res=>{
+                    // 已设置密码缓存
+                    uni.setStorage({
+                        key     : 'hasPaypass',
+                        data    : true
+                    })
+                    this.disabled = true
+                    uni.showToast({
+                        title: '设置成功',
+                    })
+        
+                    // 只有从转账页面跳转才回到上一页
+                    if(this.passSource == "favourUrl") {
+                        setTimeout(()=>{
+                            uni.navigateBack({delta: 1})
+                        },2000)
+        
+                        return
+                    }
+        
+                    // 其他跳转回到用户中心
+                    setTimeout(()=>{
+                        uni.switchTab({
+                            url: '/pages/user/index'
+                        })
+                    },2000)
+                }).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;
+        color: #d6571f;
+        font-weight: 600;
+    }
+</style>