jje_uniapp/myPages/transactionPassword/index.vue

<template>
    <view class="">
        <view class="h-content">
            <u--form
                    labelPosition="left"
                    :model="reqParm"
                    ref="form1"
            >
                <u-form-item
                        labelWidth="auto"
                        labelAlign="right"
                        prop="tradPassword"
                        borderBottom
                >
                    <u--input
                            v-model="reqParm.tradPassword"
                            disabledColor="#ffffff"
                            placeholder="请输入交易密码"
                            border="bottom"
                            type="password"
                            maxlength="6"
                    ></u--input>
                </u-form-item>
                <u--textarea v-model="reqParm.refundReason" placeholder="请在此处输入退款原因" ></u--textarea>
            </u--form>
            <view @click="submitData" class="op-btn">
                <text>提交</text>
            </view>
        </view>

    </view>
</template>

<script>
    export default {
        data() {
            return {
                order:{},
                reqParm: {
                    auth: true,
                    orderNo: null,
                    tradPassword: '',
                    refundReason: ''
                },
                rules: {
                    tradPassword: {
                        required: true,
                        min: 6,
                        max: 6,
                        message: '请输入6位密码',
                        trigger: ['blur', 'change'],
                    }
                },
            };
        },
        onLoad(option) {
            // 判断Openid是否为空
            this.order = JSON.parse(option.data)
            this.reqParm.orderNo = this.order.orderNo;
        },
        onReady() {
            this.$refs.form1.setRules(this.rules)
        },
        methods: {
            submitData() {
                let that = this;
                // 如果有错误，会在catch中返回报错信息数组，校验通过则在then中返回true
                this.$refs.form1.validate().then(res => {
                    that.orderRechargeRefund();
                }).catch(errors => {
                    uni.$u.toast('校验失败,请认真填写')
                })

            },
            // 退款
            orderRechargeRefund(){
                this.$api.orderRechargeRefund(this.reqParm).then((res)=>{
                    uni.showToast({
                        title: '已提交申请，请耐心等待'
                    })
                    uni.navigateTo({
                        url: '/myPages/rechargeRecord/index'
                    });
                }).catch((err) =>{
                    uni.showToast({
                        title: err.msg
                    })
                });
            },
        }
    };
</script>

<style lang="scss" scoped>
    .h-content{
        // margin-top: 100px;
        background: #fff;
        padding-left: 12px;
        padding-right: 12px;
        padding-bottom: 100px;
        .op-btn{
            margin: 0 auto;
            margin-top: 20px;
            text-align: center;
            line-height: 42px;
            width: 343px;
            height: 42px;
            background: #FFE05C;
            border-radius: 27px;
        }
    }

</style>