|
@@ -1,674 +0,0 @@
|
|
|
-<template>
|
|
|
- <view class="center">
|
|
|
- <view class="top">
|
|
|
- <view class="top-main">
|
|
|
- <view class="num" style="color: #888888;">挂售价格¥{{ info.price }}</view>
|
|
|
-
|
|
|
- <!-- <image class="top-image" src="../../static/img/copy.png" mode=""></image> -->
|
|
|
- </view>
|
|
|
- <view class="top-main" style="margin-top: 30rpx;">
|
|
|
- <view class="num">
|
|
|
- <text>实际支付¥ {{ info.actual_price }}</text>
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- <image class="top-image" src="../../static/img/copy.png" mode=""></image> -->
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- <view v-if="status == 1">
|
|
|
- <view class="downtime" v-if="stopTime.stopTimeH < 0 || stopTime.stopTimeM < 0 || stopTime.stopTimeS < 0">订单已过期</view>
|
|
|
- <view class="downtime" v-else>
|
|
|
- <uni-countdowns
|
|
|
- color="#FFFFFF"
|
|
|
- splitor-color="#FD3B39"
|
|
|
- background-color="#FD3B39"
|
|
|
- border-color="#FD3B39"
|
|
|
- :show-day="false"
|
|
|
- :hour="stopTime.stopTimeH"
|
|
|
- :minute="stopTime.stopTimeM"
|
|
|
- :second="stopTime.stopTimeS"
|
|
|
- ></uni-countdowns>
|
|
|
- </view>
|
|
|
- </view> -->
|
|
|
- </view>
|
|
|
- <view class="product flex">
|
|
|
- <image class="product-image" :src="info.image" mode=""></image>
|
|
|
- <view class="product-info">
|
|
|
- <view class="title">{{ info.name }}</view>
|
|
|
- <view class="title buyId">
|
|
|
- <text>卖家ID:</text>
|
|
|
- {{ info.collection_id }}
|
|
|
- </view>
|
|
|
- <view class="title buyName">
|
|
|
- <text>卖家昵称:</text>
|
|
|
- {{ info.c_nickname }}
|
|
|
- </view>
|
|
|
- <view class="title buyPhone">
|
|
|
- <text>卖家手机号:</text>
|
|
|
- {{ zfb != '' ? zfb.phone : wx != '' ? wx.phone : bank.phone }}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="main">
|
|
|
- <view class="main-tip">请向以下账号自行转账(任选一种方式)</view>
|
|
|
- <view class="main-title flex">
|
|
|
- <view class="main-item">
|
|
|
- <view class="mt-item" @click="change('0')" :class="{ current: tabCurrentIndex === 0 }" v-if="zfb != ''">
|
|
|
- <image class="mt-image" :src="tabCurrentIndex == 0 ? '../../static/img/aliD.png' : '../../static/img/ali.png'" mode=""></image>
|
|
|
- <view class="mt-font" :class="{ current: tabCurrentIndex === 0 }">支付宝</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="main-item">
|
|
|
- <view class="mt-item" @click="change('1')" :class="{ current: tabCurrentIndex === 1 }" v-if="bank != ''">
|
|
|
- <image class="mt-image1" :src="tabCurrentIndex == 1 ? '../../static/img/bankD.png' : '../../static/img/bank.png'" mode=""></image>
|
|
|
- <view class="mt-font" :class="{ current: tabCurrentIndex === 1 }">银行卡</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="main-item">
|
|
|
- <view class="mt-item" @click="change('2')" :class="{ current: tabCurrentIndex === 2 }" v-if="wx != ''">
|
|
|
- <image class="mt-image2" :src="tabCurrentIndex == 2 ? '../../static/img/yueD.png' : '../../static/img/yue.png'" mode=""></image>
|
|
|
- <view class="mt-font" :class="{ current: tabCurrentIndex === 2 }">微信</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <swiper
|
|
|
- class="swiper-box"
|
|
|
- :duration="500"
|
|
|
- @change="changeTab"
|
|
|
- :style="{ height: tabCurrentIndex == 2 ? '450rpx' : tabCurrentIndex == 1 ? '340rpx' : '280rpx' }"
|
|
|
- :current="tabCurrentIndex"
|
|
|
- disable-touch
|
|
|
- >
|
|
|
- <swiper-item class="tab-content" v-if="zfb != ''">
|
|
|
- <scroll-view scroll-y="true" style="height: 100%;">
|
|
|
- <view class="tc-item flex">
|
|
|
- <view class="tcitem-name">账号</view>
|
|
|
- <view class="ali-name">{{ zfb.payment }}</view>
|
|
|
- <image class="tcitem-image" src="../../static/img/copy.png" mode="" @click="copy(zfb.payment)"></image>
|
|
|
- </view>
|
|
|
- <view class="tc-item flex">
|
|
|
- <view class="tcitem-name">姓名</view>
|
|
|
- <view class="ali-name">{{ zfb.name }}</view>
|
|
|
- <image class="tcitem-image" src="../../static/img/copy.png" mode="" @click="copy(zfb.name)"></image>
|
|
|
- </view>
|
|
|
- </scroll-view>
|
|
|
- </swiper-item>
|
|
|
- <swiper-item class="tab-content" v-else></swiper-item>
|
|
|
- <swiper-item class="tab-content" v-if="bank != ''">
|
|
|
- <scroll-view scroll-y="true" style="height: 100%;">
|
|
|
- <view class="tc-item flex">
|
|
|
- <view class="tcitem-name">姓名</view>
|
|
|
- <view class="ali-name">{{ bank.name }}</view>
|
|
|
- <image class="tcitem-image" src="../../static/img/copy.png" mode="" @click="copy(bank.name)"></image>
|
|
|
- </view>
|
|
|
- <view class="tc-item flex">
|
|
|
- <view class="tcitem-name">银行</view>
|
|
|
- <view class="ali-name">{{ bank.bank }}</view>
|
|
|
- <image class="tcitem-image" src="../../static/img/copy.png" mode="" @click="copy(bank.bank)"></image>
|
|
|
- </view>
|
|
|
- <view class="tc-item flex">
|
|
|
- <view class="tcitem-name">支行</view>
|
|
|
- <view class="ali-name">{{ bank.bank_name }}</view>
|
|
|
- <image @click="copy(bank.bank_name)" class="tcitem-image" src="../../static/img/copy.png" mode=""></image>
|
|
|
- </view>
|
|
|
- <view class="tc-item flex">
|
|
|
- <view class="tcitem-name">账号</view>
|
|
|
- <view class="ali-name">{{ bank.payment }}</view>
|
|
|
- <image class="tcitem-image" src="../../static/img/copy.png" mode="" @click="copy(bank.payment)"></image>
|
|
|
- </view>
|
|
|
- </scroll-view>
|
|
|
- </swiper-item>
|
|
|
- <swiper-item class="tab-content" v-else></swiper-item>
|
|
|
- <swiper-item class="tab-content" v-if="wx != ''">
|
|
|
- <scroll-view scroll-y="true" style="height: 100%;">
|
|
|
- <view class="tc-item flex">
|
|
|
- <view class="tcitem-name">账号</view>
|
|
|
- <view class="ali-name">{{ wx.payment }}</view>
|
|
|
- <image class="tcitem-image" src="../../static/img/copy.png" mode="" @click="copy(wx.payment)"></image>
|
|
|
- </view>
|
|
|
- <view class="tc-item flex">
|
|
|
- <view class="tcitem-name">姓名</view>
|
|
|
- <view class="ali-name">{{ wx.name }}</view>
|
|
|
- <image class="tcitem-image" src="../../static/img/copy.png" mode="" @click="copy(wx.name)"></image>
|
|
|
- </view>
|
|
|
- <view class="tc-item">
|
|
|
- <view class="upload-title" style="color: #9d9d9d;">微信二维码</view>
|
|
|
- <view class="upload-main" @click="lookimg(wx.image)"><image class="upload-image" :src="wx.image" mode="aspectFit"></image></view>
|
|
|
- </view>
|
|
|
- </scroll-view>
|
|
|
- </swiper-item>
|
|
|
- <swiper-item class="tab-content" v-else></swiper-item>
|
|
|
- </swiper>
|
|
|
- </view>
|
|
|
- <view class="upload">
|
|
|
- <view class="upload-title">上传支付截图</view>
|
|
|
- <view class="upload-main">
|
|
|
- <image class="upload-image" src="../../static/img/add.png" mode="" v-if="!image" @click="uploads"></image>
|
|
|
- <image class="upload-image" :src="image" mode="" @click="uploads" v-if="image"></image>
|
|
|
- <view class="upload-font">点击上传支付截图</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="contentBottomHeight"></view>
|
|
|
- <view class="bottom flex">
|
|
|
- <view class="bottom-item" @click.stop="tocall()">
|
|
|
- <image class="bi-image" src="../../static/img/call.png" mode=""></image>
|
|
|
- <view class="bottom-font">联系卖家</view>
|
|
|
- </view>
|
|
|
- <view class="shu"></view>
|
|
|
- <view class="bottom-item" @click.stop="openKf()">
|
|
|
- <image class="bi-image" src="../../static/img/kf.png" mode=""></image>
|
|
|
- <view class="bottom-font">联系客服</view>
|
|
|
- </view>
|
|
|
- <view class="btn" @click.stop="buy()">完成上传</view>
|
|
|
- </view>
|
|
|
- <uni-popup ref="popupkf" type="center">
|
|
|
- <view class="popup-box">
|
|
|
- <view class="img"><image src="../../static/img/img009.png" mode=""></image></view>
|
|
|
- <view class="mian">
|
|
|
- <view class="delivery">
|
|
|
- <view class="title">已经为您定制专属客服</view>
|
|
|
- <image src="../../static/img/img010.png" mode=""></image>
|
|
|
- </view>
|
|
|
- <view class="nocancel">客服VX:{{ text }}</view>
|
|
|
- <view class="comfirm-box">
|
|
|
- <view class="cancel" @click="cancel">取消</view>
|
|
|
- <view class="comfirm" @click="copy(text)">复制微信</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </uni-popup>
|
|
|
- </view>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-import uniCountdowns from '@/components/uni-countdown/uni-countdowns.vue';
|
|
|
-import uniCopy from '@/components/js_sdk/xb-copy/uni-copy.js';
|
|
|
-import { user_auction_order, upload, up_image, edit_voucher, time } from '@/api/order.js';
|
|
|
-import { timeComputed } from '@/utils/rocessor.js';
|
|
|
-// import { json } from 'node:stream/consumers';
|
|
|
-export default {
|
|
|
- components: {
|
|
|
- uniCountdowns
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- type: 1,
|
|
|
- // 倒计时
|
|
|
- stopTime: {
|
|
|
- stopTimeH: 0,
|
|
|
- stopTimeM: 0,
|
|
|
- stopTimeS: 0
|
|
|
- },
|
|
|
- tabCurrentIndex: 0,
|
|
|
- id: '',
|
|
|
- info: '',
|
|
|
- bank: '',
|
|
|
- wx: '',
|
|
|
- zfb: '',
|
|
|
- image: '',
|
|
|
- status: 1,
|
|
|
- text: '123456',
|
|
|
- payTime: '',
|
|
|
- upFileLoding:false
|
|
|
- };
|
|
|
- },
|
|
|
- onLoad(option) {
|
|
|
- this.id = option.ordid;
|
|
|
- this.loadData();
|
|
|
- // this.getpayTime();
|
|
|
- if (option.type) {
|
|
|
- this.type = option.type;
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- uploads() {
|
|
|
- const that = this;
|
|
|
- if (that.upFileLoding) {
|
|
|
- return
|
|
|
- }
|
|
|
- that.upFileLoding = true;
|
|
|
- setTimeout(()=>{
|
|
|
- that.upFileLoding = false;
|
|
|
- },1000);
|
|
|
- upload({
|
|
|
- filename: ''
|
|
|
- }).then(data => {
|
|
|
- that.image = data[0].url;
|
|
|
- }).catch((e)=>{
|
|
|
- console.log(e);
|
|
|
- });
|
|
|
- },
|
|
|
- // getpayTime() {
|
|
|
- // time().then(({ data }) => {
|
|
|
- // this.payTime = data.tow_time * 1 * 60;
|
|
|
- // this.loadData();
|
|
|
- // });
|
|
|
- // },
|
|
|
- loadData() {
|
|
|
- user_auction_order({ type: 1, order_id: this.id }).then(({ data }) => {
|
|
|
- let time = data.time * 1 > data.radd_time * 1 ? data.time : data.radd_time;
|
|
|
- let now_time = timeComputed(time + this.payTime);
|
|
|
- this.status = data.status;
|
|
|
- this.stopTime.stopTimeH = now_time.hours;
|
|
|
- this.stopTime.stopTimeM = now_time.minutes;
|
|
|
- this.stopTime.stopTimeS = now_time.seconds;
|
|
|
- this.info = data;
|
|
|
- this.zfb = data.zfb;
|
|
|
- this.wx = data.wx;
|
|
|
- this.bank = data.bank;
|
|
|
- console.log(data.zfb.length, '123456');
|
|
|
- if (data.zfb.length == []) {
|
|
|
- this.tabCurrentIndex = 1;
|
|
|
- if (data.bank.length == []) {
|
|
|
- this.tabCurrentIndex = 2;
|
|
|
- }
|
|
|
- }
|
|
|
- console.log(this.tabCurrentIndex);
|
|
|
- });
|
|
|
- },
|
|
|
- nav(url) {
|
|
|
- uni.navigateTo({
|
|
|
- url
|
|
|
- });
|
|
|
- },
|
|
|
- copy(value) {
|
|
|
- let obj = this;
|
|
|
- let content = value; //需要复制的内容
|
|
|
- console.log('复制的内容:', content);
|
|
|
- // content = typeof content === 'string' ? content : content.toString(); // 复制内容,必须字符串,数字需要转换为字符串
|
|
|
- const result = uniCopy(content);
|
|
|
- if (result === false) {
|
|
|
- uni.showToast({
|
|
|
- title: '不支持'
|
|
|
- });
|
|
|
- } else {
|
|
|
- uni.showToast({
|
|
|
- title: '复制成功',
|
|
|
- icon: 'none'
|
|
|
- });
|
|
|
- }
|
|
|
- },
|
|
|
- tocall() {
|
|
|
- let num = this.zfb != '' ? this.zfb.phone : this.wx != '' ? this.wx.phone : this.bank.phone;
|
|
|
- console.log(num);
|
|
|
- uni.makePhoneCall({
|
|
|
- phoneNumber: num //仅为示例
|
|
|
- });
|
|
|
- },
|
|
|
- // 查看大图
|
|
|
- lookimg(src) {
|
|
|
- console.log(src);
|
|
|
- let arr = [src];
|
|
|
- uni.previewImage({
|
|
|
- current: src,
|
|
|
- urls: arr
|
|
|
- });
|
|
|
- },
|
|
|
- //swiper 切换
|
|
|
- changeTab(e) {
|
|
|
- this.tabCurrentIndex = e.target.current;
|
|
|
- },
|
|
|
- toBack() {
|
|
|
- uni.navigateBack({});
|
|
|
- },
|
|
|
- change(num) {
|
|
|
- this.tabCurrentIndex = num * 1;
|
|
|
- },
|
|
|
- // 打开客服
|
|
|
- openKf() {
|
|
|
- this.$refs.popupkf.open();
|
|
|
- },
|
|
|
- // 关闭客服
|
|
|
- cancel() {
|
|
|
- this.$refs.popupkf.close();
|
|
|
- },
|
|
|
- buy() {
|
|
|
- if (this.image == '') {
|
|
|
- return this.$api.msg('请上传支付凭证');
|
|
|
- }
|
|
|
- if (this.type == 1) {
|
|
|
- up_image({ id: this.info.id, image: this.image }).then(({ data }) => {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/money/success'
|
|
|
- });
|
|
|
- });
|
|
|
- }
|
|
|
- if (this.type == 2) {
|
|
|
- edit_voucher({ order_id: this.id, image: this.image }).then(({ data }) => {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/money/success'
|
|
|
- });
|
|
|
- });
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-};
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="less">
|
|
|
-.center {
|
|
|
- background: #f8f6f6;
|
|
|
- min-height: 100%;
|
|
|
- height: auto;
|
|
|
-}
|
|
|
-.top {
|
|
|
- margin-top: 10rpx;
|
|
|
- background-color: #ffffff;
|
|
|
- padding: 56rpx 0;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- .top-main {
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- line-height: 1;
|
|
|
- .num {
|
|
|
- font-size: 28rpx;
|
|
|
- font-family: PingFang SC;
|
|
|
- font-weight: bold;
|
|
|
- color: #fd3b39;
|
|
|
- text {
|
|
|
- font-size: 50rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- .top-image {
|
|
|
- margin-left: 10rpx;
|
|
|
- width: 26rpx;
|
|
|
- height: 28rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- .downtime {
|
|
|
- margin-top: 20rpx;
|
|
|
- }
|
|
|
-}
|
|
|
-.product {
|
|
|
- margin-top: 20rpx;
|
|
|
- padding: 35rpx 35rpx 40rpx 35rpx;
|
|
|
- background-color: #ffffff;
|
|
|
- justify-content: flex-start;
|
|
|
- align-items: flex-start;
|
|
|
- .product-image {
|
|
|
- width: 210rpx;
|
|
|
- height: 210rpx;
|
|
|
- border-radius: 10rpx;
|
|
|
- }
|
|
|
- .product-info {
|
|
|
- margin-left: 26rpx;
|
|
|
- padding-top: 10rpx;
|
|
|
- line-height: 1;
|
|
|
- .title {
|
|
|
- line-height: 1;
|
|
|
- font-size: 30rpx;
|
|
|
- font-family: PingFang SC;
|
|
|
- font-weight: bold;
|
|
|
- color: #333333;
|
|
|
- text {
|
|
|
- color: #999999;
|
|
|
- }
|
|
|
- }
|
|
|
- .buyId {
|
|
|
- margin-top: 30rpx;
|
|
|
- }
|
|
|
- .buyName {
|
|
|
- margin-top: 24rpx;
|
|
|
- }
|
|
|
- .buyPhone {
|
|
|
- margin-top: 24rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-.main {
|
|
|
- margin-top: 20rpx;
|
|
|
- padding: 30rpx 0 40rpx;
|
|
|
- background: #ffffff;
|
|
|
- .main-tip {
|
|
|
- padding: 0 30rpx;
|
|
|
- font-size: 30rpx;
|
|
|
- font-family: PingFang SC;
|
|
|
- font-weight: 500;
|
|
|
- color: #999999;
|
|
|
- }
|
|
|
- .main-title {
|
|
|
- margin-top: 34rpx;
|
|
|
- justify-content: flex-start;
|
|
|
- .current {
|
|
|
- background: linear-gradient(143.2747deg, #ff6a00, #ee0979) !important;
|
|
|
- color: #ffffff !important;
|
|
|
- }
|
|
|
- .main-item {
|
|
|
- width: 33%;
|
|
|
- }
|
|
|
- .mt-item {
|
|
|
- margin: 0 auto;
|
|
|
- width: 160rpx;
|
|
|
- height: 60rpx;
|
|
|
- background: #f8f8f8;
|
|
|
- border-radius: 10rpx;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- .mt-image {
|
|
|
- width: 32rpx;
|
|
|
- height: 32rpx;
|
|
|
- }
|
|
|
- .mt-image1 {
|
|
|
- width: 38rpx;
|
|
|
- height: 32rpx;
|
|
|
- }
|
|
|
- .mt-image2 {
|
|
|
- width: 36rpx;
|
|
|
- height: 32rpx;
|
|
|
- }
|
|
|
- .mt-font {
|
|
|
- margin-left: 10rpx;
|
|
|
- font-size: 30rpx;
|
|
|
- font-family: PingFang SC;
|
|
|
- font-weight: bold;
|
|
|
- color: #333333;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .swiper-box {
|
|
|
- width: 100%;
|
|
|
- padding: 14rpx 30rpx 0;
|
|
|
- .tc-item {
|
|
|
- padding: 50rpx 2rpx 0;
|
|
|
- line-height: 1;
|
|
|
- .tcitem-name {
|
|
|
- width: 118rpx;
|
|
|
- font-size: 30rpx;
|
|
|
- font-family: PingFang SC;
|
|
|
- font-weight: 500;
|
|
|
- color: #999999;
|
|
|
- }
|
|
|
- .ali-name {
|
|
|
- width: 380rpx;
|
|
|
- font-size: 30rpx;
|
|
|
- font-family: PingFang SC;
|
|
|
- font-weight: 500;
|
|
|
- color: #333333;
|
|
|
- }
|
|
|
- .tcitem-image {
|
|
|
- width: 26rpx;
|
|
|
- height: 28rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-.upload-image {
|
|
|
- width: 160rpx;
|
|
|
- height: 160rpx;
|
|
|
- border-radius: 10rpx;
|
|
|
-}
|
|
|
-.upload-title {
|
|
|
- font-size: 30rpx;
|
|
|
- font-family: PingFang SC;
|
|
|
- font-weight: bold;
|
|
|
- color: #333333;
|
|
|
-}
|
|
|
-.upload-main {
|
|
|
- padding-top: 32rpx;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- flex-direction: column;
|
|
|
- .upload-font {
|
|
|
- margin-top: 24rpx;
|
|
|
- font-size: 30rpx;
|
|
|
- font-family: PingFang SC;
|
|
|
- font-weight: bold;
|
|
|
- color: #333333;
|
|
|
- }
|
|
|
-}
|
|
|
-.upload {
|
|
|
- margin-top: 20rpx;
|
|
|
- padding: 34rpx 30rpx 40rpx 30rpx;
|
|
|
- background: #ffffff;
|
|
|
-}
|
|
|
-.bottom {
|
|
|
- position: fixed;
|
|
|
- bottom: 0;
|
|
|
- background: #ffffff;
|
|
|
- width: 750rpx;
|
|
|
- height: 146rpx;
|
|
|
- justify-content: flex-start;
|
|
|
- .bottom-item {
|
|
|
- margin-left: 30rpx;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- align-items: center;
|
|
|
- .bi-image {
|
|
|
- width: 38rpx;
|
|
|
- height: 34rpx;
|
|
|
- }
|
|
|
- .bottom-font {
|
|
|
- margin-top: 14rpx;
|
|
|
- font-size: 24rpx;
|
|
|
- font-family: PingFang SC;
|
|
|
- font-weight: bold;
|
|
|
- color: #333333;
|
|
|
- }
|
|
|
- .bottom-num {
|
|
|
- line-height: 1;
|
|
|
- font-size: 24rpx;
|
|
|
- font-family: PingFang SC;
|
|
|
- font-weight: bold;
|
|
|
- color: #333333;
|
|
|
- }
|
|
|
- }
|
|
|
- .shu {
|
|
|
- margin-left: 20rpx;
|
|
|
- width: 2px;
|
|
|
- height: 74rpx;
|
|
|
- background: #c0bfc0;
|
|
|
- }
|
|
|
- .btn {
|
|
|
- margin-left: 20rpx;
|
|
|
- width: 430rpx;
|
|
|
- height: 80rpx;
|
|
|
- background: #fd3b39;
|
|
|
- border-radius: 20rpx;
|
|
|
- text-align: center;
|
|
|
- font-size: 34rpx;
|
|
|
- font-family: PingFang SC;
|
|
|
- font-weight: bold;
|
|
|
- color: #ffffff;
|
|
|
- line-height: 80rpx;
|
|
|
- }
|
|
|
-}
|
|
|
-// 文章页底部高度撑开
|
|
|
-.contentBottomHeight {
|
|
|
- height: 150rpx;
|
|
|
-}
|
|
|
-.popup-box {
|
|
|
- width: 522rpx;
|
|
|
- height: 605rpx;
|
|
|
- background-color: #ffffff;
|
|
|
- border-radius: 20rpx;
|
|
|
- position: relative;
|
|
|
-
|
|
|
- .img {
|
|
|
- position: relative;
|
|
|
- top: -56rpx;
|
|
|
- left: 0;
|
|
|
- width: 522rpx;
|
|
|
- height: 132rpx;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
-
|
|
|
- image {
|
|
|
- border-radius: 20rpx 20rpx 0 0;
|
|
|
- width: 450rpx;
|
|
|
- height: 132rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .mian {
|
|
|
- margin-top: -44rpx;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- align-items: center;
|
|
|
- // padding: 32rpx 32rpx;
|
|
|
- background-color: #ffffff;
|
|
|
- border-radius: 0 0 20rpx 20rpx;
|
|
|
- text-align: center;
|
|
|
-
|
|
|
- .delivery {
|
|
|
- font-size: 40rpx;
|
|
|
- color: #333333;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- flex-direction: column;
|
|
|
-
|
|
|
- .title {
|
|
|
- }
|
|
|
-
|
|
|
- image {
|
|
|
- margin-top: 48rpx;
|
|
|
- width: 172rpx;
|
|
|
- height: 160rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .nocancel {
|
|
|
- font-size: 32rpx;
|
|
|
- color: #333333;
|
|
|
- margin-top: 14rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .comfirm-box {
|
|
|
- margin-top: 52rpx;
|
|
|
- display: flex;
|
|
|
- // margin-bottom: 32rpx;
|
|
|
-
|
|
|
- // justify-content: space-around;
|
|
|
- .cancel {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- width: 197rpx;
|
|
|
- height: 74rpx;
|
|
|
- border: 1px solid #dcc786;
|
|
|
- border-radius: 38rpx;
|
|
|
-
|
|
|
- font-size: 32rpx;
|
|
|
- color: #605128;
|
|
|
- }
|
|
|
-
|
|
|
- .comfirm {
|
|
|
- margin-left: 32rpx;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- width: 197rpx;
|
|
|
- height: 74rpx;
|
|
|
- background: linear-gradient(-90deg, #d1ba77 0%, #f7e8ad 100%);
|
|
|
- border-radius: 38px;
|
|
|
- font-size: 32rpx;
|
|
|
- color: #605128;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-</style>
|