|
|
@@ -1,234 +1,434 @@
|
|
|
-<template>
|
|
|
- <div class="page">
|
|
|
- <div class="page_top">
|
|
|
- <div class="page_top_con" v-for="(item, index) in collectionList" :key="index">
|
|
|
- <div class="pageTitle">{{ item.myName }}</div>
|
|
|
- <div class="collection_information">
|
|
|
- <!-- <van-image width="80" height="80" :radius="6" :src="getImg(changeImgs(info.pic))" fit="cover" /> -->
|
|
|
- <van-image width="80" height="80" :radius="8" :src="item.img" fit="cover" />
|
|
|
- <div class="collection_information_right">
|
|
|
- <div class="collection_information_right_name">{{ item.name }}</div>
|
|
|
- <div class="collection_information_right_no" v-if="item.type == 'DOMAIN'">剩余时长：{{ item.endTime }}
|
|
|
- </div>
|
|
|
- <div class="collection_information_right_no" v-else>{{ item.number }}</div>
|
|
|
- <div class="collection_information_right_price_one">¥{{ item.price }}</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="collection_price">
|
|
|
- <div class="collection_price_left">作品费用</div>
|
|
|
- <div class="collection_price_right">¥{{ item.price }}</div>
|
|
|
- </div>
|
|
|
- <div class="collection_price">
|
|
|
- <div class="collection_price_left">GAS费用</div>
|
|
|
- <div class="collection_price_right">¥1</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <pay-method-pick v-model="payType" cart></pay-method-pick>
|
|
|
- <div class="page_btn van-safe-area-bottom">
|
|
|
- <div class="page_btn_left">
|
|
|
- <div class="page_btn_left_amount">总计</div>
|
|
|
- <img :src="require('@assets/icon_jiagecat@3x.png')" alt="" class="page_btn_left_img">
|
|
|
- <div class="page_btn_left_price">2000</div>
|
|
|
- </div>
|
|
|
- <div class="page_btn_right" @click="submit">
|
|
|
- <div class="page_btn_right_one">立即支付</div>
|
|
|
- <div class="page_btn_right_two">共2件</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <van-number-keyboard v-model="tradeCode" :show="showKeyboard" @blur="showKeyboard = false" />
|
|
|
- <van-dialog v-model:show="showPwdDialog" title="请输入支付密码" confirmButtonText="立即支付" show-cancel-button
|
|
|
- confirmButtonColor="#3ab200" @cancel="((showPwdDialog = false), (payName = '1')), $toast.clear()"
|
|
|
- @confirm="pay">
|
|
|
- <div style="padding: 20px 0">
|
|
|
- <van-password-input :value="tradeCode" :focused="showKeyboard" @focus="showKeyboard = true" gutter="4px" />
|
|
|
- </div>
|
|
|
- </van-dialog>
|
|
|
- </div>
|
|
|
-</template>
|
|
|
-<script>
|
|
|
-import PayMethodPick from '../../components/PayMethodPick';
|
|
|
-export default {
|
|
|
- components: { PayMethodPick },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- payType: null,
|
|
|
- tradeCode: '',
|
|
|
- showKeyboard: false,
|
|
|
- showPwdDialog: false,
|
|
|
- collectionList: [
|
|
|
- {
|
|
|
- type: 'DOMAIN',
|
|
|
- check: false,
|
|
|
- img: require('@assets/1091676369057_.pic@3x.png'),
|
|
|
- name: 'R.nft',
|
|
|
- endTime: '188天7时13分',
|
|
|
- myName: '持有者名称',
|
|
|
- price: 1000
|
|
|
- },
|
|
|
- {
|
|
|
- type: 'Collection',
|
|
|
- check: false,
|
|
|
- img: require('@assets/10561663573720_.pic_hd4@3x.png'),
|
|
|
- myImg: require('@assets/1091676369057_.pic@3x.png'),
|
|
|
- name: '游戏《百分之一》精美的礼物',
|
|
|
- myName: '持有者名称',
|
|
|
- endTime: '188天7时13分',
|
|
|
- price: 199,
|
|
|
- number: 7
|
|
|
- },
|
|
|
- ],
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- submit() {
|
|
|
- if (this.payType == 'BALANCE') {
|
|
|
- this.showPwdDialog = true;
|
|
|
- }
|
|
|
- console.log("dfhfgfg", this.payType)
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-</script>
|
|
|
-<style lang="less" scoped>
|
|
|
-.page {
|
|
|
- background-color: @bg3;
|
|
|
- padding-bottom: 170px;
|
|
|
-
|
|
|
- .page_top_con {
|
|
|
- padding: 10px 16px 13px;
|
|
|
- box-sizing: border-box;
|
|
|
- background: #FFFFFF;
|
|
|
- margin-bottom: 9px;
|
|
|
-
|
|
|
- .pageTitle {
|
|
|
- font-size: 14px;
|
|
|
- font-weight: 400;
|
|
|
- color: #000000;
|
|
|
- line-height: 24px;
|
|
|
- margin-bottom: 8px;
|
|
|
- }
|
|
|
-
|
|
|
- .collection_information {
|
|
|
- display: flex;
|
|
|
- margin-bottom: 17px;
|
|
|
-
|
|
|
- .collection_information_right {
|
|
|
- margin-left: 10px;
|
|
|
-
|
|
|
- .collection_information_right_name {
|
|
|
- font-size: 14px;
|
|
|
- font-weight: bold;
|
|
|
- color: #000000;
|
|
|
- line-height: 24px;
|
|
|
- margin-bottom: 2px;
|
|
|
- }
|
|
|
-
|
|
|
- .collection_information_right_no {
|
|
|
- font-size: 12px;
|
|
|
- font-weight: 400;
|
|
|
- color: #939599;
|
|
|
- line-height: 24px;
|
|
|
- margin-bottom: 6px;
|
|
|
- }
|
|
|
-
|
|
|
- .collection_information_right_price_one {
|
|
|
- font-size: 14px;
|
|
|
- font-weight: bold;
|
|
|
- color: #000000;
|
|
|
- line-height: 24px;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .collection_price {
|
|
|
- height: 49px;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- border-top: 1px solid #F5F7FA;
|
|
|
- justify-content: space-between;
|
|
|
-
|
|
|
- .collection_price_left {
|
|
|
- font-size: 14px;
|
|
|
- font-weight: 400;
|
|
|
- color: #000000;
|
|
|
- }
|
|
|
-
|
|
|
- .collection_price_right {
|
|
|
- font-size: 14px;
|
|
|
- font-weight: 500;
|
|
|
- color: #3AB200;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .van-number-keyboard {
|
|
|
- z-index: 9999;
|
|
|
- }
|
|
|
- :deep(.van-password-input__item) {
|
|
|
- background: @bg3;
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.page_btn {
|
|
|
- width: 100%;
|
|
|
- height: 56px;
|
|
|
- position: fixed;
|
|
|
- left: 0;
|
|
|
- bottom: 0;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- padding: 0px 16px;
|
|
|
- box-sizing: border-box;
|
|
|
- background: #FFFFFF;
|
|
|
-
|
|
|
- .page_btn_left {
|
|
|
- display: flex;
|
|
|
-
|
|
|
- .page_btn_left_amount {
|
|
|
- font-size: 14px;
|
|
|
- font-weight: 400;
|
|
|
- color: #939599;
|
|
|
- line-height: 24px;
|
|
|
- margin-right: 6px;
|
|
|
- padding-top: 3px;
|
|
|
- }
|
|
|
-
|
|
|
- .page_btn_left_img {
|
|
|
- width: 11px;
|
|
|
- height: 11px;
|
|
|
- padding-top: 10px;
|
|
|
- }
|
|
|
-
|
|
|
- .page_btn_left_price {
|
|
|
- font-size: 32px;
|
|
|
- font-family: OSP-DIN, OSP;
|
|
|
- font-weight: normal;
|
|
|
- color: #3AB200;
|
|
|
- line-height: 24px;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .page_btn_right {
|
|
|
- width: 132px;
|
|
|
- height: 38px;
|
|
|
- background: #3AB200;
|
|
|
- border-radius: 22px;
|
|
|
- text-align: center;
|
|
|
-
|
|
|
- .page_btn_right_one {
|
|
|
- font-size: 16px;
|
|
|
- font-weight: bold;
|
|
|
- color: #FFFFFF;
|
|
|
- line-height: 24px;
|
|
|
- }
|
|
|
-
|
|
|
- .page_btn_right_two {
|
|
|
- font-size: 10px;
|
|
|
- font-weight: 400;
|
|
|
- color: #FFFFFF;
|
|
|
- line-height: 10px;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
+<template>
|
|
|
+ <div class="page">
|
|
|
+ <div class="page_top">
|
|
|
+ <div class="page_top_con" v-for="(item, index) in collectionList" :key="index">
|
|
|
+ <div class="pageTitle">{{ item.myName }}</div>
|
|
|
+ <div class="collection_information">
|
|
|
+ <!-- <van-image width="80" height="80" :radius="6" :src="getImg(changeImgs(info.pic))" fit="cover" /> -->
|
|
|
+ <van-image width="80" height="80" :radius="8" :src="item.img" fit="cover" />
|
|
|
+ <div class="collection_information_right">
|
|
|
+ <div class="collection_information_right_name">{{ item.name }}</div>
|
|
|
+ <div class="collection_information_right_no" v-if="item.type == 'DOMAIN'">剩余时长：{{ item.endTime }}
|
|
|
+ </div>
|
|
|
+ <div class="collection_information_right_no" v-else>{{ item.number }}</div>
|
|
|
+ <div class="collection_information_right_price_one">¥{{ item.price }}</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="collection_price">
|
|
|
+ <div class="collection_price_left">作品费用</div>
|
|
|
+ <div class="collection_price_right">¥{{ item.price }}</div>
|
|
|
+ </div>
|
|
|
+ <div class="collection_price">
|
|
|
+ <div class="collection_price_left">GAS费用</div>
|
|
|
+ <div class="collection_price_right">¥1</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <pay-method-pick v-model="payType" cart></pay-method-pick>
|
|
|
+ <div class="page_btn van-safe-area-bottom">
|
|
|
+ <div class="page_btn_left">
|
|
|
+ <div class="page_btn_left_amount">总计</div>
|
|
|
+ <img :src="require('@assets/icon_jiagecat@3x.png')" alt="" class="page_btn_left_img">
|
|
|
+ <div class="page_btn_left_price">2000</div>
|
|
|
+ </div>
|
|
|
+ <div class="page_btn_right" @click="submit">
|
|
|
+ <div class="page_btn_right_one">立即支付</div>
|
|
|
+ <div class="page_btn_right_two">共2件</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <van-number-keyboard v-model="tradeCode" :show="showKeyboard" @blur="showKeyboard = false" />
|
|
|
+ <van-dialog v-model:show="showPwdDialog" title="请输入支付密码" confirmButtonText="立即支付" show-cancel-button
|
|
|
+ confirmButtonColor="#3ab200" @cancel="((showPwdDialog = false), (payName = '1')), $toast.clear()"
|
|
|
+ @confirm="pay">
|
|
|
+ <div style="padding: 20px 0">
|
|
|
+ <van-password-input :value="tradeCode" :focused="showKeyboard" @focus="showKeyboard = true" gutter="4px" />
|
|
|
+ </div>
|
|
|
+ </van-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import PayMethodPick from '../../components/PayMethodPick';
|
|
|
+import { mapState } from 'vuex';
|
|
|
+import resolveUrl from 'resolve-url';
|
|
|
+export default {
|
|
|
+ components: { PayMethodPick },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ payType: null,
|
|
|
+ tradeCode: '',
|
|
|
+ showKeyboard: false,
|
|
|
+ showPwdDialog: false,
|
|
|
+ id: '',
|
|
|
+ collectionList: [
|
|
|
+ {
|
|
|
+ type: 'DOMAIN',
|
|
|
+ check: false,
|
|
|
+ img: require('@assets/1091676369057_.pic@3x.png'),
|
|
|
+ name: 'R.nft',
|
|
|
+ endTime: '188天7时13分',
|
|
|
+ myName: '持有者名称',
|
|
|
+ price: 1000
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'Collection',
|
|
|
+ check: false,
|
|
|
+ img: require('@assets/10561663573720_.pic_hd4@3x.png'),
|
|
|
+ myImg: require('@assets/1091676369057_.pic@3x.png'),
|
|
|
+ name: '游戏《百分之一》精美的礼物',
|
|
|
+ myName: '持有者名称',
|
|
|
+ endTime: '188天7时13分',
|
|
|
+ price: 199,
|
|
|
+ number: 7
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ getOrder(next = false) {
|
|
|
+ this.$http.get('/domainOrder/get/' + this.id).then(res => {
|
|
|
+ this.info = res;
|
|
|
+ if (this.timer) {
|
|
|
+ clearTimeout(this.timer);
|
|
|
+ }
|
|
|
+ if (this.timerNum >= 20) {
|
|
|
+ this.$toast.clear();
|
|
|
+ this.$dialog
|
|
|
+ .confirm({
|
|
|
+ title: '提示',
|
|
|
+ message: '订单是否已经支付',
|
|
|
+ confirmButtonText: '已经支付',
|
|
|
+ cancelButtonText: '未支付'
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ this.$dialog
|
|
|
+ .alert({
|
|
|
+ title: '正在排队中...',
|
|
|
+ message: '您的铸造订单正在排队，下单的藏品后续会直接出现在藏品室哦～'
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ this.$router.back();
|
|
|
+ });
|
|
|
+ })
|
|
|
+ .catch(e => {
|
|
|
+ this.$dialog
|
|
|
+ .confirm({
|
|
|
+ title: '提示',
|
|
|
+ message: '订单未支付是否重新支付？',
|
|
|
+ confirmButtonText: '重新支付',
|
|
|
+ cancelButtonText: '取消订单'
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ this.timerNum = 0;
|
|
|
+ this.pay(false);
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ this.$router.back();
|
|
|
+ });
|
|
|
+ });
|
|
|
+ } else if (
|
|
|
+ res.orderStatus === 'PROCESSING' ||
|
|
|
+ res.orderStatus === 'FINISH' ||
|
|
|
+ res.orderStatus === 'CANCELLED' ||
|
|
|
+ res.orderStatus === 'SUCCESS' ||
|
|
|
+ res.orderStatus === 'PENDING'
|
|
|
+ ) {
|
|
|
+ this.$toast.clear();
|
|
|
+ this.$dialog
|
|
|
+ .alert({
|
|
|
+ title: '提示',
|
|
|
+ message:
|
|
|
+ res.orderStatus === 'CANCELLED'
|
|
|
+ ? '购买失败,点击重新下单'
|
|
|
+ : '恭喜购买成功，请到藏品室查看'
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ if (res.orderStatus === 'PENDING') {
|
|
|
+ this.$router.back();
|
|
|
+ } else {
|
|
|
+ this.$router.replace('/domainname');
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else if (next) {
|
|
|
+ this.timerNum += 1;
|
|
|
+ this.timer = setTimeout(() => {
|
|
|
+ this.getOrder(next);
|
|
|
+ }, 1500);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // createOrder() {
|
|
|
+ // console.log("dfgdfdffd")
|
|
|
+ // return new Promise((resolve, reject) => {
|
|
|
+ // let checkOrder = () => {
|
|
|
+ // this.$http
|
|
|
+ // .post('/domainOrder/create', {
|
|
|
+ // userId: this.userInfo.id,
|
|
|
+ // domain: this.domain,
|
|
|
+ // price: this.price,
|
|
|
+ // year: this.year
|
|
|
+ // })
|
|
|
+ // .then(res => {
|
|
|
+ // if (res) {
|
|
|
+ // clearInterval(this.createOrderTimer);
|
|
|
+ // this.createOrderTimer = null;
|
|
|
+ // resolve(res);
|
|
|
+ // }
|
|
|
+ // })
|
|
|
+ // .catch(e => {
|
|
|
+ // clearInterval(this.createOrderTimer);
|
|
|
+ // this.createOrderTimer = null;
|
|
|
+ // reject(e);
|
|
|
+ // });
|
|
|
+ // };
|
|
|
+ // setTimeout(checkOrder, 500);
|
|
|
+ // this.createOrderTimer = setInterval(checkOrder, 2000);
|
|
|
+ // });
|
|
|
+ // },
|
|
|
+ submit() {
|
|
|
+ if (this.payType == 'BALANCE') {
|
|
|
+ this.showPwdDialog = true;
|
|
|
+ }
|
|
|
+ this.createOrder()
|
|
|
+ .then(res => {
|
|
|
+ this.id = res.id;
|
|
|
+ if (this.payType != 'BALANCE') {
|
|
|
+ this.pay();
|
|
|
+ }
|
|
|
+ }).catch(e => {
|
|
|
+ if (e) {
|
|
|
+ this.showPwdDialog = false;
|
|
|
+ this.$toast.clear();
|
|
|
+ this.$dialog
|
|
|
+ .alert({
|
|
|
+ title: '提示',
|
|
|
+ message: this.backReson(e.error)
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ this.$router.back();
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ pay() {
|
|
|
+ if (this.payType == 'BALANCE') {
|
|
|
+ this.$http
|
|
|
+ .post('/payOrder/v2/domain/balance', {
|
|
|
+ id: this.id,
|
|
|
+ tradeCode: this.tradeCode
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ this.$toast.success('恭喜购买成功，请到藏品室查看');
|
|
|
+ setTimeout(() => {
|
|
|
+ this.$router.replace('/domainname');
|
|
|
+ }, 1000);
|
|
|
+ })
|
|
|
+ .catch(e => {
|
|
|
+ this.tradeCode = '';
|
|
|
+ this.$toast(e.error || '购买失败');
|
|
|
+ this.payName = '1';
|
|
|
+ });
|
|
|
+ } else if (this.payType == 'ALIPAY') {
|
|
|
+ this.$toast.loading({
|
|
|
+ message: '支付中',
|
|
|
+ forbidClick: true
|
|
|
+ });
|
|
|
+ this.$http
|
|
|
+ .get('/payOrder/v2/domain/ali', { id: this.id })
|
|
|
+ .then(res => {
|
|
|
+ this.$toast.clear();
|
|
|
+ document.location.href = res;
|
|
|
+ // this.payUrlScheme = res;
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ this.getOrder(true);
|
|
|
+ })
|
|
|
+ .catch(e => {
|
|
|
+ this.$toast.clear();
|
|
|
+ e = e || {};
|
|
|
+ e.error = e.error || '支付失败';
|
|
|
+ this.$dialog
|
|
|
+ .alert({
|
|
|
+ title: '提示',
|
|
|
+ message: this.backReson(e.error)
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ this.$router.back();
|
|
|
+ });
|
|
|
+ });
|
|
|
+ } else if (this.payType === 'UNION') {
|
|
|
+ const url = resolveUrl(this.$baseUrl, '/payOrder/v2/domain/sandQuick?id=' + this.id)
|
|
|
+ .replace('www.raex.vip', 'jump.raex.vip')
|
|
|
+ .replace('test.raex.vip', 'jumptest.raex.vip')
|
|
|
+ .replace(/http:\/\/192\.168.*?\//, 'https://jumptest.raex.vip/');
|
|
|
+ console.log(url);
|
|
|
+ document.location.href = url;
|
|
|
+ this.getOrder(true);
|
|
|
+ } else if (this.payType === 'QUICK_BIND') {
|
|
|
+ this.$http
|
|
|
+ .get('/payOrder/v2/domain/sandQuickBind?id=' + this.id)
|
|
|
+ .then(res => {
|
|
|
+ document.location.href = res;
|
|
|
+ this.getOrder(true);
|
|
|
+ })
|
|
|
+ .catch(e => {
|
|
|
+ this.$toast.clear();
|
|
|
+ e = e || {};
|
|
|
+ e.error = e.error || '支付失败';
|
|
|
+ this.$dialog
|
|
|
+ .alert({
|
|
|
+ title: '提示',
|
|
|
+ message: this.backReson(e.error)
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ this.$router.back();
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+<style lang="less" scoped>
|
|
|
+.page {
|
|
|
+ background-color: @bg3;
|
|
|
+ padding-bottom: 170px;
|
|
|
+
|
|
|
+ .page_top_con {
|
|
|
+ padding: 10px 16px 13px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ background: #FFFFFF;
|
|
|
+ margin-bottom: 9px;
|
|
|
+
|
|
|
+ .pageTitle {
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #000000;
|
|
|
+ line-height: 24px;
|
|
|
+ margin-bottom: 8px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .collection_information {
|
|
|
+ display: flex;
|
|
|
+ margin-bottom: 17px;
|
|
|
+
|
|
|
+ .collection_information_right {
|
|
|
+ margin-left: 10px;
|
|
|
+
|
|
|
+ .collection_information_right_name {
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #000000;
|
|
|
+ line-height: 24px;
|
|
|
+ margin-bottom: 2px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .collection_information_right_no {
|
|
|
+ font-size: 12px;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #939599;
|
|
|
+ line-height: 24px;
|
|
|
+ margin-bottom: 6px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .collection_information_right_price_one {
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #000000;
|
|
|
+ line-height: 24px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .collection_price {
|
|
|
+ height: 49px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ border-top: 1px solid #F5F7FA;
|
|
|
+ justify-content: space-between;
|
|
|
+
|
|
|
+ .collection_price_left {
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #000000;
|
|
|
+ }
|
|
|
+
|
|
|
+ .collection_price_right {
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #3AB200;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .van-number-keyboard {
|
|
|
+ z-index: 9999;
|
|
|
+ }
|
|
|
+
|
|
|
+ :deep(.van-password-input__item) {
|
|
|
+ background: @bg3;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.page_btn {
|
|
|
+ width: 100%;
|
|
|
+ height: 56px;
|
|
|
+ position: fixed;
|
|
|
+ left: 0;
|
|
|
+ bottom: 0;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ padding: 0px 16px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ background: #FFFFFF;
|
|
|
+
|
|
|
+ .page_btn_left {
|
|
|
+ display: flex;
|
|
|
+
|
|
|
+ .page_btn_left_amount {
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #939599;
|
|
|
+ line-height: 24px;
|
|
|
+ margin-right: 6px;
|
|
|
+ padding-top: 3px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .page_btn_left_img {
|
|
|
+ width: 11px;
|
|
|
+ height: 11px;
|
|
|
+ padding-top: 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .page_btn_left_price {
|
|
|
+ font-size: 32px;
|
|
|
+ font-family: OSP-DIN, OSP;
|
|
|
+ font-weight: normal;
|
|
|
+ color: #3AB200;
|
|
|
+ line-height: 24px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .page_btn_right {
|
|
|
+ width: 132px;
|
|
|
+ height: 38px;
|
|
|
+ background: #3AB200;
|
|
|
+ border-radius: 22px;
|
|
|
+ text-align: center;
|
|
|
+
|
|
|
+ .page_btn_right_one {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #FFFFFF;
|
|
|
+ line-height: 24px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .page_btn_right_two {
|
|
|
+ font-size: 10px;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #FFFFFF;
|
|
|
+ line-height: 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
