shop_uniapp/bundle/pages/credit_payment/credit_payment.vue

105 lines
2.6 KiB
Vue
Raw Normal View History

2024-06-06 09:55:01 +08:00
<template>
<view class="credit-payment-block">
<view >
<view class="flex m-t-20 row row-center">
<u-checkbox shape="circle" active-color="#ff2c3c" v-model="isAgree" :disabled="radioDisable">
<text class="sm">已阅读并同意</text>
</u-checkbox>
<router-link :to="{path: '/bundle/pages/server_explan/server_explan', query: {type: 5}}">
<text class="primary sm">《信用支付协议》</text>
</router-link>
</view>
</view>
<view class="price-state-btn">
<button v-if="xp_price_state == 0 || xp_price_state == 3" class="price-state-btn-style m-t-30" @click="creditSubmit()">
<text v-if="xp_price_state == 0">申请信用支付</text>
<text v-if="xp_price_state == 3">审核失败请重新申请</text>
</button>
<button :disabled="xp_price_state == 1" v-if="xp_price_state == 1" class="price-state-disabled-style m-t-30 bt">审核中</button>
<button v-if="xp_price_state == 2" class="price-state-success-style m-t-30">已通过审核</button>
</view>
</view>
</template>
<script>
import { subXpExamine } from '@/api/procurement'
import {mapGetters,mapActions} from 'vuex'
export default {
data() {
return {
btnStatus: false,
xp_price_state: 0,
isAgree: false,
radioDisable: false,
};
},
onLoad() {
this.xp_price_state = this.userInfo.xp_price_state;
if (this.xp_price_state == 1 || this.xp_price_state == 2) {
this.isAgree = true
this.radioDisable = true
}
},
methods: {
async creditSubmit() {
if (!this.isAgree) return this.$toast({
title: '请先同意《信用支付协议》'
})
const {
data,
code,
msg
} = await subXpExamine()
if(code == 1) {
this.$toast({
title: '提交完成,等待管理员审核'
})
this.isAgree = true
this.radioDisable = true
this.xp_price_state = 1
}
}
},
computed: {
...mapGetters(["userInfo"]),
}
};
</script>
<style lang="scss" scoped>
.credit-payment-block {
margin: 0 40rpx;
}
.price-state-btn {
width: 100%;
.price-state-btn-style {
width: 100%;
border: none;
border-radius: 999rpx;
background: #fb2d2d;
color: #fdf8f4;
display: flex;
justify-content: center;
align-items: center;
}
.price-state-disabled-style {
background: #ccc;
border-radius: 999rpx;
color: #9c9c9c;
}
.price-state-success-style {
background: linear-gradient(#12c96e 0%, #0abd57 50.76%, #03b240 100%);
color: #fff;
border-radius: 999rpx;
}
.disabled-style {
background: #ccc;
border-radius: 999rpx;
color: #9c9c9c;
}
}
</style>