From 44db498cedee7573d090797b1fe5c331c413b00a Mon Sep 17 00:00:00 2001
From: zzzz <690498789@qq.com>
Date: Mon, 22 Apr 2024 19:03:57 +0800
Subject: [PATCH] first
---
src/page/user/recharge.vue | 1039 ++++++++++++++++++++-------------------------------------
1 files changed, 365 insertions(+), 674 deletions(-)
diff --git a/src/page/user/recharge.vue b/src/page/user/recharge.vue
index f2097ce..7edccc9 100644
--- a/src/page/user/recharge.vue
+++ b/src/page/user/recharge.vue
@@ -1,701 +1,392 @@
<template>
- <div class="wrapper">
- <form id="pay_form" action="https://zf.flyotcpay.com/payment/" method="post" >
- <input type="hidden" name="merchantid" v-model="formDate.merchantid">
- <input type="hidden" name="orderno" v-model="formDate.orderno">
- <input type="hidden" name="orderamount" v-model="formDate.orderamount">
- <input type="hidden" name="paytype" v-model="formDate.paytype">
- <input type="hidden" name="ordercurrency" v-model="formDate.ordercurrency">
- <input type="hidden" name="serverbackurl" v-model="formDate.serverbackurl">
- <input type="hidden" name="callbackurl" v-model="formDate.callbackurl">
- <input type="hidden" name="signtype" v-model="formDate.signtype">
- <input type="hidden" name="sign" v-model="formDate.sign">
- </form>
- <!-- <div class="header">
- <mt-header title="充值">
- <router-link to="/user" slot="left">
- <mt-button icon="back">我的</mt-button>
- </router-link>
- </mt-header>
- </div> -->
- <div class="box">
- <div class="box-contain clearfix">
- <div class="account text-center">
- <p class="title">当前可用余额（元）</p>
- <p class="red number">{{$store.state.userInfo.enableAmt}}</p>
- </div>
- </div>
- </div>
- <div class=" page-part transaction">
- <div class="box-contain clearfix">
- <div class="back-info">
- <!-- 银行卡信息 -->
- <p class="title">
- 选择面额(元)
- </p>
- <div class="box-tab">
- <input v-model="selectNumber" class="btn-default" type="number">
- <div class="tab-con">
- <ul class="radio-group clearfix">
- <li v-for="item in numberList" :key="item.key" @click="selectTypeFun(item.value)">
- <div :class="selectNumber == item.value?'on':''">
- {{item.label}}
- </div>
- </li>
- <!-- <li v-for="item in numberList" :key="item.key" @click="selectTypeFun(item.value)">
- <div :class="selectNumber == item.value?'on':''">
- {{item.label}}
- </div>
- </li> -->
- </ul>
- </div>
- <p style="padding-bottom:0.3rem">最小充值金额为{{settingInfo.chargeMinAmt}}元</p>
+ <div>
+ <van-nav-bar
+ :placeholder="true"
+ :safe-area-inset-top="true"
+ :title="$t('充值中心')"
+ left-arrow
+ @click-left="onClickLeft"
+ >
+ <template #right>
+ <van-icon
+ @click="$router.push('/rechargelist')"
+ name="orders-o"
+ size="20"
+ />
+ </template>
+ </van-nav-bar>
+ <main>
+ <div>
+ <div class="main-title">{{ $t("支持得支付渠道") }}</div>
+ <van-cell
+ is-link
+ :title="paymentSelectData.channelAccount || $t('請選擇')"
+ @click="paymentShow = true"
+ />
+ <!-- paymentSelectData.channelMinLimit -->
+ <van-action-sheet
+ v-model="paymentShow"
+ :actions="paymentActions"
+ :cancel-text="$t('qx')"
+ close-on-click-action
+ @select="paymentSelect"
+ />
+
+ <template v-if="paymentSelectData.channelAccount !== undefined">
+ <div class="main-title">{{ $t("收款卡號") }}</div>
+ <div class="white-input">
+ <span>{{ paymentSelectData.channelAccount }}</span>
+ <i
+ class="iconfont icon-fuzhi fuzhi"
+ @click="(e) => copyText(e, channelAccount)"
+ ></i>
</div>
- </div>
- <div class="back-info">
- <!-- 银行卡信息 -->
- <p class="title">
- 充值方式
- </p>
- <div class="box-tab">
- <div v-for="i in optionsPay" :key="i.key" class="pay-radio">
- <!-- 1 ==> 支付宝 2 ==> 微信 3 ==> 对公转账-->
- <div @click="changeType(i)" :class="i.id == id?'pay-list on':'pay-list'" style="display: flex;">
- <span class="col-md-4 pay-icon">
- <!-- <img class="pay-miniimg" :src="i.channelImg" > -->
- <i v-if="i.ctype == 0" style="color:#1296db;" class="iconfont icon-zhifubao"></i>
- <i v-else-if="i.ctype == 1" style="color:#36ae55;" class="iconfont icon-yinlian"></i>
- <i v-else style="color:#009688;" class="iconfont icon-chongzhi"></i>
- <!-- <i v-if="i.value == 3" style="color:#009688;" class="iconfont icon-weixin"></i> -->
- {{i.channelType}}
- </span>
- <span class="col-md-4 pull-right" style="text-align: right;">
- <i :class="id == i.id?'icon-on iconfont icon-xuanzhong':'iconfont icon-weixuanze'"></i>
- </span>
+ <div class="main-title">{{ $t("收款銀行") }}</div>
+ <div class="white-input">
+ <span>{{ paymentSelectData.channelDesc }}</span>
+ <i
+ class="iconfont icon-fuzhi fuzhi"
+ @click="(e) => copyText(e, paymentSelectData.channelDesc)"
+ ></i>
+ </div>
+ <div class="main-title">{{ $t("收款人名字") }}</div>
+ <div class="white-input">
+ <span>{{ paymentSelectData.channelName }}</span>
+ <i
+ class="iconfont icon-fuzhi fuzhi"
+ @click="(e) => copyText(e, paymentSelectData.channelName)"
+ ></i>
+ </div>
+ <div class="main-title">{{ $t("請選擇充值賬戶") }}</div>
+ <van-cell
+ is-link
+ :title="$t(rechargeAccountData.key) || $t('請選擇')"
+ />
+ <!-- @click="rechargeAccountShow = true" -->
+ <van-action-sheet
+ v-model="rechargeAccountShow"
+ :actions="rechargeAccountActions"
+ :cancel-text="$t('qx')"
+ />
+ <!-- close-on-click-action -->
+ <!-- @select="rechargeAccountSelect" -->
+ <div class="main-title">{{ $t("請選擇充值金額") }}</div>
+ <div class="white-input">
+ <input type="number" :value="value" @input="inputValue" />
+ <span class="myr"> {{ rechargeAccountData.symbolCode }}</span>
+ </div>
+
+ <div class="bottom-text">
+ <div class="balance" style="margin-top: 10px">
+ <div>{{ $t("最小充值金額") }}</div>
+ <div class="balance-text" style="margin-bottom: 0px">
+ {{ paymentSelectData.channelMinLimit }}
+ {{ rechargeAccountData.symbolCode }}
</div>
</div>
- <!-- <div class="pay-radio">
- <div @click="changeType('juhe1')" :class="'juhe1' == type?'pay-list on':'pay-list'">
- <span class="col-md-4 pay-icon">
- <i style="color:#009688;" class="iconfont icon-chongzhi"></i>
- 支付宝扫码
- </span>
- <span class="col-md-4 pull-right">
- <i :class="type == 'juhe1'?'icon-on iconfont icon-xuanzhong':'iconfont icon-weixuanze'"></i>
- </span>
- </div>
- </div> -->
+ <div class="division"></div>
+ <div class="upload-text">
+ <div style="margin-bottom: 0.37333rem">
+ {{ $t("上傳憑證：") }}
+ </div>
+ <el-upload
+ v-loading="loading"
+ :with-credentials="true"
+ class="avatar-uploader"
+ :action="admin + '/user/upload.do'"
+ list-type="picture-card"
+ name="upload_file"
+ :show-file-list="false"
+ :on-success="handleAvatarSuccess"
+ :on-error="handleError"
+ :before-upload="beforeAvatarUpload"
+ :disabled="!showBtn"
+ :limit="1"
+ >
+ <img
+ v-if="form.img1key"
+ :src="form.img1key"
+ class="id-img avatar"
+ style="width: 100%; height: 100%"
+ />
+ </el-upload>
+ </div>
</div>
- </div>
+ <!-- :disabled="butFlg" -->
+ <van-button
+ class="but"
+ type="primary"
+ style="margin-top: 1.04rem; margin-bottom: 1.04rem"
+ @click="selCzFns"
+ >{{ $t("hj172") }}</van-button
+ >
+ </template>
</div>
- <div class="btnbox">
- <span v-if="!dialogShow" class="text-center btnok" @click="toSure">
- 立即充值
- <i v-show="isloading" style="color:#fff;" class="iconfont icon-jiazaizhong"></i>
- <i v-show="isloading"></i>
- </span>
- <div v-if="dialogShow" class="text-center btnok">
- <form method="get" ref="formDate" :action="formDate.postUrl" enctype="multipart/form-data">
- <!--<input type="hidden" name="pay_amount" v-model="selectNumber"/>-->
- <!--<input type="hidden" name="pay_applydate" v-model="formDate.pay_applydate"/>-->
- <!--<input type="hidden" name="pay_bankcode" v-model="formDate.pay_bankcode"/>-->
- <!--<input type="hidden" name="pay_callbackurl" v-model="formDate.pay_callbackurl"/>-->
- <!--<input type="hidden" name="pay_md5sign" v-model="formDate.pay_md5sign"/>-->
- <!--<input type="hidden" name="pay_memberid" v-model="formDate.pay_memberid"/>-->
- <!--<input type="hidden" name="pay_notifyurl" v-model="formDate.pay_notifyurl"/>-->
- <!--<input type="hidden" name="pay_orderid" v-model="formDate.pay_orderid"/>-->
- <!--<input type="hidden" name="pay_productdesc" v-model="formDate.pay_productdesc"/>-->
- <!--<input type="hidden" name="pay_productname" v-model="formDate.pay_productname"/>-->
- <!--<input type="hidden" name="pay_productnum" v-model="formDate.pay_productnum"/>-->
- <!--<input type="hidden" name="pay_producturl" v-model="formDate.pay_producturl"/>-->
- </form>
- <button class="submitBtn" type="submit" @click="onsubmit()">
- 立即充值
- </button>
- </div>
- </div>
- <div class="attention">
- <p>注意:充值默认充值在融资账户中。</p>
- </div>
- </div>
-
- <!-- 倒计时弹框 -->
- <mt-popup v-model="popupVisible" pop-transition='popup-fade' :closeOnClickModal="false" class="mint-popup-white">
- <div class="clearfix">
- <a @click="closePopup" class="pull-right"><i class="iconfont icon-weitongguo"></i></a>
- </div>
- <div class="box-block">
- <p class="text-center">
- <i v-if="formCode == 1" class="iconfont icon-umidd17"></i>
- <i v-if="formCode == 3" class="iconfont icon-02"></i>
- </p>
- <div class="prompt-box text-center">
- 扫码后请输入以下金额支付
- </div>
- <p class="text-center money">
- ¥<span class="number">{{selectNumber}}</span>
- </p>
- <div class="qrCode">
- <!-- <img src="../../assets/img/timg.jpg" alt="二维码"> -->
- <div id="qrcode" ref="qrcode"></div>
- <div v-if="stopTime" class="alert-box">
- <i class="iconfont icon-jinggao2"></i>
- 支付已过期
- </div>
- </div>
- <div class="timer-box">
- {{time.minutes}}:{{time.seconds}}
- </div>
- <div class="scan">
- <span v-if="formCode == 1">打开支付宝扫一扫</span>
- <span v-if="formCode == 3">打开微信扫一扫</span>
- </div>
- </div>
- </mt-popup>
- <!-- <mt-popup pop-transition='popup-fade' :closeOnClickModal="false" class="mint-popup-white">
- <div class="clearfix">
- <a @click="closePopup" class="pull-right"><i class="iconfont icon-weitongguo"></i></a>
- </div>
- </mt-popup> -->
+ </main>
</div>
</template>
<script>
-import * as api from '@/axios/api'
-import QRCode from "qrcodejs2";
-import { Toast } from 'mint-ui'
-
+import { ActionSheet } from "vant";
+import ClipboardJS from "clipboard";
+import apiUrl from "@/axios/api.url.js";
+import { siteGetPayInfo, selCzFn } from "../../axios/api";
+import { Notify } from "vant";
+import { rechargeAccountActions } from "@/utils/rechargeActions";
+// baseURL
export default {
- components: {},
- props: {},
- data () {
+ components: { ActionSheet, [Notify.Component.name]: Notify.Component },
+ mounted() {
+ this.getPayInfos();
+ },
+ // getPayInfo
+ data() {
return {
- isloading: false,
- dialogShow: false, // 扫码支付
- numberList: [
- // {label:'10000',value:10000},
- { label: '50000', value: 50000 },
- { label: '100000', value: 100000 },
- { label: '150000', value: 150000 },
- { label: '200000', value: 200000 }
- ],
- selectNumber: 50000,
- type: '', // 选择的渠道类型
- optionsPay: [
- {
- label: '支付宝',
- value: '1'
- },
- {
- label: '对公转账',
- value: '3'
- },
- {
- label: '微信',
- value: '2'
- }
- ],
- popupVisible: false, // 二维码倒计时
- minutes: 10,
- seconds: 0,
- time: {
- minutes: 10,
- seconds: '00'
+ loading: false,
+ butFlg: true,
+ admin: apiUrl.baseURL,
+ value: 0,
+ rechargeSelect: {},
+ paymentSelectData: {},
+ rechargeAccountData: {},
+ show: false,
+ actions: [{ name: this.$t("銀行卡充值"), key: "YHK" }],
+ paymentShow: false,
+ paymentActions: [],
+ rechargeAccountShow: false,
+ rechargeAccountActions: rechargeAccountActions,
+ showBtn: true,
+ imgStatus: false,
+ form: {
+ img1key: "",
},
- formh5Date: {},
- formCode: 1,
- stopTime: false, // 倒计时结束提示
- timer: null, // 定时器
- settingInfo: {
- chargeMinAmt: 500
- }, // 设置信息
- id: '', // 选择渠道的id
- formDate: {
- merchantid: '',
- orderno: '',
- orderamount: '',
- paytype: '',
- ordercurrency: '',
- serverbackurl: '',
- callbackurl: '',
- signtype: '',
- sign: ''
- },
- code: '',
- formUrl: '',
- formCode: ''
- }
+ };
},
- computed: {},
- created () {},
- mounted () {
- if (this.$state.theme =='red') {
- document.body.classList.remove('black-bg')
- document.body.classList.add('red-bg')
- }
- this.getSettingInfo()
- if (!this.$store.state.userInfo.idCard) {
- this.getUserInfo()
- }
- this.getPayInfo()
- },
- beforeDestroy () {
- if (this.$state.theme =='red') {
- document.body.classList.remove('red-bg')
- document.body.classList.add('black-bg')
- }
- window.clearInterval(this.timer)
- },
- watch: {},
methods: {
- async onsubmit () {
- // 解决金额不变的问题
- if (this.type === 2) {
- let data2 = await api.getjuhe1({ payType: this.formCode, payAmt: this.selectNumber })
- if (data2.status === 0) {
- // 成功
- this.formDate = data2.data
- //console.log(document.getElementById("pay_form"))
- this.dialogShow = true
- // 支付跳转
- setTimeout(() => {
- document.getElementById("pay_form").submit()
- this.isloading = false
- }, 1500)
- } else {
- Toast(data2.msg)
- }
+ judgeValue() {
+ console.log(this.form.img1key, this.value);
+ if (this.form.img1key && this.value) {
+ this.butFlg = false;
} else {
+ this.butFlg = true;
+ }
+ },
+ inputValue(e) {
+ this.value = e.target.value;
+ this.judgeValue();
+ },
+ async selCzFns() {
+ if (!this.value) {
+ return Notify(this.$t("hj171"));
+ }
+ if (!this.form.img1key) {
+ return Notify(this.$t("请上传文件"));
+ }
+ const res = await selCzFn({
+ payTypeId: this.paymentSelectData.id,
+ payAmt: this.value,
+ img: this.form.img1key,
+ });
+ if (res.status === 0) {
+ Notify({ type: "success", message: this.$t("hj182") });
setTimeout(() => {
- this.$refs.formDate.submit()
- }, 1000)
+ this.$router.push("/rechargelist");
+ }, 500);
}
+ // Notify("请上传文件");
},
- async getUserInfo () {
- // 获取用户信息
- let data = await api.getUserInfo()
- if (data.status === 0) {
- this.$store.state.userInfo = data.data
- } else {
- Toast(data.msg)
+ async getPayInfos() {
+ const res = await siteGetPayInfo();
+ if (res.status === 0) {
+ res.data.map((item) => {
+ item.name = item.channelAccount;
+ });
+ this.paymentActions = res.data;
}
+ console.log(res);
},
- async getPayInfo () {
- // 获取支付渠道
- let data = await api.getPayInfo()
- if (data.status === 0) {
- this.optionsPay = data.data
- this.id = data.data[0].id
- this.type = data.data[0].ctype
- if (data.data[0].ctype === 2) {
- this.formCode = data.data[0].formCode
- let data2 = await api.getjuhe1({ payType: data.data[0].formCode, payAmt: this.selectNumber })
- if (data2.status === 0) {
- // 成功
- this.formDate = data2.data
- this.dialogShow = true
- } else {
- Toast(data2.msg)
- }
+ handleAvatarSuccess(res, file) {
+ this.imgStatus = false;
+ this.form.img1key = res.data.url;
+ this.loading = false;
+ this.judgeValue();
+ },
+ beforeAvatarUpload(file) {
+ this.loading = true;
+ this.judgeValue();
+ this.imgStatus = true;
+ },
+ handleError() {
+ this.loading = false;
+ this.imgStatus = false;
+ },
+ // upload
+ async afterRead(file) {
+ let formData = new FormData();
+ formData.append("file", file.file || file.raw);
+ // console.log(formData);
+ const res = await upload({ file: formData });
+ // console.log(res);
+ },
+ copyText(e, data) {
+ var clipboard = new ClipboardJS(".copy-button", {
+ text: () => data,
+ });
+
+ clipboard.on("success", () => {
+ clipboard.destroy();
+ });
+
+ clipboard.onClick(e);
+ },
+ onClickLeft() {
+ this.$router.push("/user");
+ },
+ select(e) {
+ this.rechargeSelect = e;
+ },
+ rechargeAccountSelect(e) {
+ this.rechargeAccountData = e;
+ },
+ paymentSelect(e) {
+ this.paymentSelectData = e;
+ this.rechargeAccountActions.map((item) => {
+ if (item.key === e.assetsType) {
+ this.rechargeAccountData = item;
}
- } else {
- Toast(data.msg)
- }
+ });
},
- selectTypeFun (value) {
- // 选择充值金额
- this.selectNumber = value
- },
- async changeType (value) {
- this.id = value.id
- // 支付宝扫码渠道单独分开
- // if(value == 'juhe1'){
- if(value.formUrl !== undefined && value.formUrl !== '' && value.formUrl.indexOf('yunpay.waa.cn') !== -1){
- this.type = value.ctype
- this.formDate = value
- this.formCode = value.formCode
- this.dialogShow = false
- } else if (value.ctype === 2) {
- this.type = value.ctype
- // let data = await api.getjuhe1({payType:903,payAmt:this.selectNumber})
- let data = await api.getjuhe1({ payType: value.formCode, payAmt: this.selectNumber })
- if (data.status === 0) {
- // 成功
- this.formCode = value.formCode
- this.formDate = data.data
- this.dialogShow = true
- } else {
- Toast(data.msg)
- }
- } else {
- this.dialogShow = false
- if (value.isLock === 1) {
- Toast('该渠道暂不可用')
- } else {
- if (value.ctype === 2) {
- // 其他渠道 保存code & url
- this.code = value.formCode
- this.formUrl = value.formUrl
- this.type = value.ctype
- } else {
- // 选择支付方式
- this.type = value.ctype
- this.id = value.id
- }
- }
- }
- },
- toSure () {
- // 充值 先判断是否实名认证
- if (!this.$store.state.userInfo.idCard) {
- Toast('您还未实名认证,请先实名认证')
- this.$router.push('/authentication')
- // else if(this.type == 2){
- // Toast('微信支付暂未开通')
- // }else if(this.type == 3){
- // Toast('对公转账暂未开通')
- // }
- } else {
- this.recharge()
- }
- // if(this.selectNumber > 20000 || this.selectNumber <500){
- // Toast('一次最高充值20000,最低充值500')
- // }else{
- // this.popupVisible = true
- // this.minutes = 10
- // this.seconds = 0
- // this.time.minutes = 10
- // this.time.seconds = '00'
- // this.stopTime = false
- // this.timerInterval()
- // }
- },
- async getSettingInfo () {
- let data = await api.getSetting()
- if (data.status === 0) {
- // 成功
- this.settingInfo = data.data
- // this.selectNumber = this.settingInfo.chargeMinAmt // 设置默认金额为最小金额
- // 充值金额快捷选择
- // this.numberList = []
- // for(var i = 0;i<10;i++){
- // let item = {
- // label:(this.settingInfo.chargeMinAmt+i*this.settingInfo.chargeMinAmt) ,
- // value:this.settingInfo.chargeMinAmt+i*this.settingInfo.chargeMinAmt
- // }
- // this.numberList.push(item)
- // }
- } else {
- Toast(data.msg)
- }
- },
- async recharge () {
- if (this.isloading) {
- return
- }
- //H5支付
- if(this.formDate.formUrl !== undefined && this.formDate.formUrl !== '' && this.formDate.formUrl.indexOf('yunpay.waa.cn') !== -1){
- let data5 = await api.getjuheH5({ payType: this.formDate.formCode, payAmt: this.selectNumber })
- if (data5.status === 0) {
- this.formh5Date = data5.data
- this.$nextTick(() => {
- this.qrcode(this.formh5Date.qrcode);
- });
-
- this.popupVisible = true
- // console.log(document.getElementById("payh5_form"))
- // return;
- // setTimeout(() => {
- // this.isloading = false
- // }, 180000)
- } else {
- this.$message.error(data5.msg)
- }
- } else if (this.type === 2) {
- // 其他渠道
- let opts = {
- payType: this.code,
- payAmt: this.selectNumber
- }
- let data = await api.payLInk(this.formUrl, opts)
- if (data.status === 0) {
- // 成功
- this.formDate = data.data
- } else {
- Toast(data.msg)
- }
- } else {
- let opts = {
- amt: this.selectNumber,
- payType: this.type
- }
- this.isloading = true
- let data = await api.inMoney(opts)
- if (data.status === 0) {
- // 成功
- // Toast(data.msg?data.msg:'充值成功!')
- this.$router.push({
- path: '/rechargeSure',
- query: {
- type: this.type,
- id: this.id,
- selectNumber: this.selectNumber
- }
- })
- } else {
- Toast(data.msg ? data.msg : '充值失败,请重新充值')
- }
- }
- this.isloading = false
- },
- // 生成二维码
- qrcode (url) {
- document.getElementById("qrcode").innerHTML = ""
- let qrcode = new QRCode("qrcode", {
- width: 200, // 二维码宽度，单位像素
- height: 200, // 二维码高度，单位像素
- text: url // 生成二维码的链接
- });
- },
- closePopup () {
- // 关闭弹窗
- this.popupVisible = false
- window.clearInterval(this.timer)
- },
- goBack () {
- this.$router.back(-1)
- },
- num (n) {
- return n < 10 ? '0' + n : '' + n
- },
- timerInterval () {
- var _this = this
- _this.timer = window.setInterval(function () {
- if (_this.seconds === 0 && _this.minutes !== 0) {
- _this.seconds = 59
- _this.minutes -= 1
- } else if (_this.minutes === 0 && _this.seconds === 0) {
- // 倒计时结束
- _this.seconds = 0
- _this.stopTime = true
- window.clearInterval(_this.timer)
- } else {
- _this.seconds -= 1
- }
- _this.time.minutes = _this.num(_this.minutes)
- _this.time.seconds = _this.num(_this.seconds)
- }, 1000)
+ },
+};
+</script>
+
+<style lang="less" scoped>
+.but {
+ width: 100%;
+ color: #ffffff;
+ background-color: #1989fa;
+ border-radius: 8px;
+ height: 66px;
+ font-size: 22px;
+}
+.bottom-text {
+ width: 100%;
+ background-color: #fff;
+ padding: 0.26667rem 0.37333rem;
+ box-sizing: border-box;
+ margin-top: 0.26667rem;
+ // margin-bottom: 80px;
+ .balance {
+ display: flex;
+ justify-content: space-between;
+ color: #181818;
+ font-family: PingFang SC;
+ font-size: 0.32rem;
+ font-style: normal;
+ font-weight: 500;
+ box-sizing: border-box;
+ .balance-text {
+ color: #181818;
+ font-family: PingFang SC;
+ font-size: 0.32rem;
+ font-style: normal;
+ font-weight: 500;
+ line-height: 0.37333rem;
+ margin-bottom: 0.37333rem;
}
+ }
+ .division {
+ width: 100%;
+ height: 0.02667rem;
+ flex-shrink: 0;
+ background-color: #e5e8ed;
+ margin: 0.37333rem 0;
+ }
+ .upload-text {
+ color: #181818;
+ font-family: PingFang SC;
+ font-size: 0.32rem;
+ font-style: normal;
+ font-weight: 500;
}
}
-</script>
-<style lang="less" scoped>
- .pay-img {
- padding: 0 0.2rem;
- padding-top: 0.417rem;
+/deep/ .van-nav-bar__content {
+ height: 65px;
+}
+/deep/ .van-nav-bar__title {
+ font-family: "DINPro";
+ width: 100%;
+ height: 1.17333rem;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ font-style: normal;
+ font-weight: 500;
+ font-size: 0.48rem;
+ color: #14181f;
+}
+/deep/ .van-cell {
+ list-style: none;
+ width: 100%;
+ margin-top: 0.26667rem;
+ background: #fff;
+ border-radius: 0.10667rem;
+ list-style: none;
+ border: none;
+ font-family: Arial, sans-serif;
+ font-style: normal;
+ font-weight: 500;
+ font-size: 0.37333rem;
+ line-height: 0.53333rem;
+ padding: 0.32rem 0.4rem;
+ box-sizing: border-box;
+ margin-top: 0.26667rem;
+ box-shadow: 0 0.16rem 0.32rem #eaeaea99;
+}
+main {
+ padding: 0 0.4rem 0.53333rem;
+ box-sizing: border-box;
+}
+.main-title {
+ font-style: normal;
+ font-weight: 400;
+ font-size: 0.37333rem;
+ color: #8c9fad;
+ margin-top: 0.53333rem;
+}
- img {
- width: 100%;
- }
- }
-
- .submitBtn {
- background: none;
- border: none;
- display: inline-block;
- width: 100%;
- }
-
- .pay-radio {
- /* padding: 0.2rem 0.1rem; */
- margin-bottom: 0.2rem;
- height: 0.8rem;
- line-height: 0.75rem;
-
- .pay-icon {
- .iconfont {
- margin-right: 0.2rem;
- }
- }
-
- .pay-list {
- border-radius: 0.2rem;
-
- .pay-miniimg {
- width: 18px;
- vertical-align: middle;
- margin-right: 8px;
- }
- }
-
- .pay-weixin {
- border-color: #36ae55;
- }
-
- // .pay-zhifubao{
- // border-color:#1296db;
- // }
- .icon-on {
- color: #b60c0d;
- }
- }
-
- .btn-default {
- border: 0.02rem solid #4e4d4d;
- border-radius: 0.2rem;
- display: inline-block;
- height: 0.8rem;
- width: 100%;
- text-indent: 0.2rem;
- background: none;
- color: #ddd;
- }
-
- .tips-group {
- padding: 0.417rem;
- margin-top: 0.417rem;
-
- p {
- line-height: 2;
- font-size: 0.25rem;
- }
-
- .tip-text {
- text-indent: 0.28rem;
- }
- }
-
- .transaction {
-
- .title {
- padding: 0.2rem;
- }
-
- .input-btn {
- border: 0.02rem solid #4e4d4d;
- height: 0.6rem;
- line-height: 0.6rem;
- border-radius: 0.05rem;
- width: 100%;
- }
- }
-
- .radio-group li {
- // width: 19%;
- width: 24%;
- margin-right: 1%;
- }
-
- .account {
- padding-bottom: 0.4rem;
-
- .title {
- height: 1.4rem;
- line-height: 1.4rem;
- font-size: 0.29rem;
- // color: rgb(51, 51, 51);
- text-align: center;
- font-weight: 700;
- }
-
- .number {
- font-size: 0.466rem;
- }
- }
-
- .mint-popup-white {
- color: #333;
- width: 80%;
- padding: 0.2rem 0.3rem 0;
- // bottom: 30%;
- border-radius: 0.1rem;
- box-shadow: 0.014rem 0.014rem 0.014rem rgba(103, 107, 111, 0.38);
- // .popup-silide-bottom-leave-active{
- // bottom: -10%;
- // }
- .box-block {
- .qrCode {
- border: 1px solid #f3f3f3;
- padding: 0.1rem;
- height: 3rem;
- width: 3rem;
- margin: 0.3rem auto;
- position: relative;
-
- img {
- width: 100%;
- height: 100%;
- }
-
- .alert-box {
- width: 100%;
- height: 100%;
- background: rgba(255, 255, 255, 0.9);
- position: absolute;
- left: 0;
- top: 0;
- color: #333;
- text-align: center;
-
- .iconfont {
- color: #f98700;
- font-size: 0.6rem;
- display: block;
- margin-top: 0.8rem;
- margin-bottom: 0.4rem;
- }
- }
- }
-
- .prompt-box {
- padding: 0.2rem;
- margin: 0.2rem 0;
- color: #666;
- }
-
- .money {
- font-weight: bold;
- font-size: 0.5rem;
-
- .number {
- margin-left: 0.1rem;
- }
- }
-
- .timer-box {
- text-align: center;
- font-size: 0.5rem;
- }
-
- .number {
- font-size: 0.6rem;
- }
- }
-
- .scan {
- border-top: 0.02rem dashed #ddd;
- margin-top: 0.5rem;
- padding: 0.3rem;
- text-align: center;
- color: #ff1100;
- }
-
- // 微信支付宝icon设置
- .icon-umidd17 {
- color: #1296db;
- font-size: 0.6rem;
- }
-
- .icon-02 {
- color: #36ae55;
- font-size: 0.6rem;
- }
- }
-
- .attention {
- height: 0.417rem;
- line-height: 0.417rem;
- color: rgb(187, 187, 187);
- padding: 0.347rem;
- }
-</style>
+.white-input {
+ width: 100%;
+ background: #fff;
+ border-radius: 0.10667rem;
+ list-style: none;
+ border: none;
+ font-family: Arial, sans-serif;
+ font-style: normal;
+ font-weight: 500;
+ font-size: 0.37333rem;
+ line-height: 0.53333rem;
+ padding: 0.32rem 0.4rem;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+ margin-top: 0.26667rem;
+ -webkit-box-shadow: 0 0.16rem 0.32rem #eaeaea99;
+ box-shadow: 0 0.16rem 0.32rem #eaeaea99;
+ display: flex;
+ justify-content: space-between;
+}
+.fuzhi {
+ font-size: 28px;
+ cursor: pointer;
+}
+.myr {
+ color: rgb(150, 151, 153);
+}
+/deep/ .el-upload__input {
+ display: none !important;
+}
+/deep/ .avatar-uploader {
+ width: 2.740741rem;
+ height: 2.740741rem;
+}
+</style>
\ No newline at end of file
--
Gitblit v1.9.3