|
|
@@ -1,399 +1,396 @@ |
|
|
|
<template> |
|
|
|
<navBar title="选择产品" :scrollTop="scrollTop"></navBar> |
|
|
|
<navBgCar></navBgCar> |
|
|
|
<view class="content-value"> |
|
|
|
<view |
|
|
|
@click="savaHandle(item)" |
|
|
|
class="ul-item" |
|
|
|
v-for="(item, index) in state.dataArray" |
|
|
|
:key="index" |
|
|
|
> |
|
|
|
<image |
|
|
|
style="width: 100%; height: 170rpx; border-radius: 20rpx" |
|
|
|
:src="`${$imgUrl}applyCard/product-bg.png`" |
|
|
|
></image> |
|
|
|
<view class="item-value"> |
|
|
|
<image class="icon-tip" :src="`${$imgUrl}applyCard/wechat.png`"></image> |
|
|
|
<view class="content"> |
|
|
|
<view class="title"> |
|
|
|
{{ item.promoteName }} |
|
|
|
</view> |
|
|
|
<!-- 1记账卡2储值卡3记存卡 --> |
|
|
|
<!-- <view style="margin-top: 15rpx" class="tip" v-if="item.cardType=='1'"> |
|
|
|
<navBar title="选择产品" :scrollTop="scrollTop"></navBar> |
|
|
|
<navBgCar></navBgCar> |
|
|
|
<view class="content-value"> |
|
|
|
<view @click="savaHandle(item)" class="ul-item" v-for="(item, index) in state.dataArray" :key="index"> |
|
|
|
<image style="width: 100%; height: 170rpx; border-radius: 20rpx" |
|
|
|
:src="`${$imgUrl}applyCard/product-bg.png`"></image> |
|
|
|
<view class="item-value"> |
|
|
|
<image class="icon-tip" :src="`${$imgUrl}applyCard/wechat.png`"></image> |
|
|
|
<view class="content"> |
|
|
|
<view class="title"> |
|
|
|
{{ item.promoteName }} |
|
|
|
</view> |
|
|
|
<!-- 1记账卡2储值卡3记存卡 --> |
|
|
|
<!-- <view style="margin-top: 15rpx" class="tip" v-if="item.cardType=='1'"> |
|
|
|
记账卡 |
|
|
|
</view> --> |
|
|
|
<view style="margin-top: 15rpx" class="tip"> |
|
|
|
{{ item.cardTypeArr }} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="money"> |
|
|
|
¥:{{ item.fee * 0.01 }} |
|
|
|
<view style="margin-top: 15rpx" class="tip"> |
|
|
|
{{ item.cardTypeArr }} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="money"> |
|
|
|
¥:{{ item.fee * 0.01 }} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="bottomTip"> 到底啦!敬请期待其他产品! </view> |
|
|
|
</view> |
|
|
|
<u-popup mode="center" v-model="state.choiceCardShow" closeable> |
|
|
|
<view class="squire"> |
|
|
|
<view class="bottomTip"> 到底啦!敬请期待其他产品! </view> |
|
|
|
</view> |
|
|
|
<u-popup mode="center" v-model="state.choiceCardShow" closeable> |
|
|
|
<view class="squire"> |
|
|
|
<!-- <view class="mask-close"> |
|
|
|
<image :src="fileURL + 'image/index/icon-close.png'" class="icon-closed" @click="closeMask"></image> |
|
|
|
</view> --> |
|
|
|
<!-- <view class="mask-title" :style="{ '--color': color }">选择卡的类型</view> --> |
|
|
|
<u-radio-group wrap> |
|
|
|
<u-radio :customStyle="{marginBottom: '8px'}" activeColor="#2CE242" |
|
|
|
v-for="(item, index) in state.radiolist1" :key="index" :label="item.disabled" :name="item.name" |
|
|
|
<u-radio :customStyle="{marginBottom: '8px'}" activeColor="#2CE242" |
|
|
|
v-for="(item, index) in state.radiolist1" :key="index" :label="item.disabled" :name="item.name" |
|
|
|
@change="radioChange"> |
|
|
|
<view style="width: 100%;display: flex;align-items: center;margin-bottom: 30rpx;"> |
|
|
|
<image |
|
|
|
style="width: 200rpx; height: 100rpx; border-radius: 20rpx;margin-right: 20rpx;" |
|
|
|
:src="`${$imgUrl}card2.png`" |
|
|
|
mode="aspectFill" |
|
|
|
></image> |
|
|
|
<image style="width: 200rpx; height: 100rpx; border-radius: 20rpx;margin-right: 20rpx;" |
|
|
|
:src="`${$imgUrl}card2.png`" mode="aspectFill"></image> |
|
|
|
<!-- <image :src="`${$imgUrl}card2.png`" mode=""></image> --> |
|
|
|
{{item.name}} |
|
|
|
</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
</u-radio> |
|
|
|
</u-radio-group> |
|
|
|
</view> |
|
|
|
</u-popup> |
|
|
|
</u-popup> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script setup lang="ts"> |
|
|
|
import { onLoad, onPageScroll } from "@dcloudio/uni-app"; |
|
|
|
import { reactive, ref } from "vue"; |
|
|
|
import { etcQueryProduct, productReCode } from "@/utils/network/api.js"; |
|
|
|
import { request } from "@/utils/network/request.js"; |
|
|
|
|
|
|
|
import { stringToJson} from "@/utils/network/encryption"; |
|
|
|
import { fileURL } from "@/datas/fileURL.js"; |
|
|
|
import navBgCar from "./components/nav-bg-car1"; |
|
|
|
import navBar from "@/components/nav-bar/nav-bar2.vue"; |
|
|
|
|
|
|
|
import { getItem, StorageKeys,setItem} from "@/utils/storage.ts"; |
|
|
|
import { msg } from "@/utils/utils"; |
|
|
|
const imgURL = `${fileURL}image/`; |
|
|
|
// import { setItem } from "@/utils/storage"; |
|
|
|
|
|
|
|
const scrollTop = ref(0); //滚动距离 |
|
|
|
// 单选默认数据 |
|
|
|
// let flag = ref(true) |
|
|
|
// 单选 |
|
|
|
const radioChange = (n) => { |
|
|
|
console.log('radioChange', n); |
|
|
|
if (n == '记账卡') { |
|
|
|
state.isValueCard=1 |
|
|
|
} else if(n == '储值卡'){ |
|
|
|
state.isValueCard=2 |
|
|
|
}else{ |
|
|
|
state.isValueCard=3 |
|
|
|
import { onLoad, onPageScroll } from "@dcloudio/uni-app"; |
|
|
|
import { reactive, ref } from "vue"; |
|
|
|
import { etcQueryProduct, productReCode } from "@/utils/network/api.js"; |
|
|
|
import { request } from "@/utils/network/request.js"; |
|
|
|
import { stringToJson } from "@/utils/network/encryption"; |
|
|
|
import { fileURL } from "@/datas/fileURL.js"; |
|
|
|
import navBgCar from "./components/nav-bg-car1"; |
|
|
|
import navBar from "@/components/nav-bar/nav-bar2.vue"; |
|
|
|
import { getItem, StorageKeys, setItem } from "@/utils/storage.ts"; |
|
|
|
import { msg } from "@/utils/utils"; |
|
|
|
const imgURL = `${fileURL}image/`; |
|
|
|
// import { setItem } from "@/utils/storage"; |
|
|
|
|
|
|
|
const scrollTop = ref(0); //滚动距离 |
|
|
|
// 单选默认数据 |
|
|
|
// let flag = ref(true) |
|
|
|
// 单选 |
|
|
|
const radioChange = (n) => { |
|
|
|
console.log('radioChange', n); |
|
|
|
if (n == '记账卡') { |
|
|
|
state.isValueCard = 1 |
|
|
|
} else if (n == '储值卡') { |
|
|
|
state.isValueCard = 2 |
|
|
|
} else { |
|
|
|
state.isValueCard = 3 |
|
|
|
} |
|
|
|
uni.redirectTo({ |
|
|
|
url: `/subpackage/orders/essential-information?promoteId=${getItem("promoteId")}&userType=${state.userType}&type=${state.type}&isSign=${state.isSign}&isValueCard=${state.isValueCard}`, |
|
|
|
}); |
|
|
|
} |
|
|
|
uni.redirectTo({ |
|
|
|
url: `/subpackage/orders/essential-information?promoteId=${getItem("promoteId")}&userType=${state.userType}&type=${state.type}&isSign=${state.isSign}&isValueCard=${state.isValueCard}`, |
|
|
|
}); |
|
|
|
} |
|
|
|
const savaHandle = (val) => { |
|
|
|
state.choiceCardShow=true; |
|
|
|
console.log("vAL",val) |
|
|
|
setItem("clientFee", val.clientFee); |
|
|
|
setItem("promoteId", val.promoteId); |
|
|
|
setItem("isValueCard", val.isValueCard); |
|
|
|
state.isSign=val.isSign; |
|
|
|
// 判断是几张卡 |
|
|
|
if(val.cardTypeArr.split(",").length==1){ |
|
|
|
if(val.cardTypeArr.split(",")[0]=="记账卡"){ |
|
|
|
state.isValueCard=1 |
|
|
|
} else if(val.cardTypeArr.split(",")[0] == '储值卡'){ |
|
|
|
state.isValueCard=2 |
|
|
|
}else{ |
|
|
|
state.isValueCard=3 |
|
|
|
} |
|
|
|
uni.redirectTo({ |
|
|
|
url: `/subpackage/orders/essential-information?promoteId=${getItem("promoteId")}&userType=${state.userType}&type=${state.type}&isValueCard=${state.isValueCard}`, |
|
|
|
}); |
|
|
|
}else{ |
|
|
|
state.radiolist1=[]; |
|
|
|
// 处理卡的数据 |
|
|
|
for(var i=0;i<val.cardTypeArr.split(",").length;i++){ |
|
|
|
const obj={}; |
|
|
|
obj["name"]=val.cardTypeArr.split(",")[i]; |
|
|
|
obj["disabled"]=false; |
|
|
|
state.radiolist1.push(obj) |
|
|
|
} |
|
|
|
console.log("state.radiolist1",state.radiolist1) |
|
|
|
} |
|
|
|
}; |
|
|
|
|
|
|
|
onLoad((option: any) => { |
|
|
|
// state.orderId = option.orderId; |
|
|
|
// state.userType = option.userType; |
|
|
|
// state.vehiclePlateColor = option.vehiclePlateColor; |
|
|
|
state.userType = option.userType; |
|
|
|
state.type = option.type; |
|
|
|
var data = { |
|
|
|
type: state.type, |
|
|
|
source:'WECHAT' //请求方来源 |
|
|
|
}; |
|
|
|
const options = { |
|
|
|
type: 2, |
|
|
|
data: data, |
|
|
|
method: "POST", |
|
|
|
showLoading: true, |
|
|
|
}; |
|
|
|
console.log("输出内容", options); |
|
|
|
request(etcQueryProduct, options).then((res) => { |
|
|
|
// console.log(res.bizContent); |
|
|
|
const data = stringToJson(res.bizContent); |
|
|
|
console.log(data); |
|
|
|
// console.log(typeof(data)); |
|
|
|
state.dataArray = data.csmsnPromoteDistPro ?data.csmsnPromoteDistPro: []; |
|
|
|
for(var i=0;i<state.dataArray.length;i++){ |
|
|
|
const cardTypeArr=[] |
|
|
|
for(var j=0;j<state.dataArray[i].cardType.length;j++){ |
|
|
|
if(state.dataArray[i].cardType[j]=='1'){ |
|
|
|
cardTypeArr.push('记账卡') |
|
|
|
}else if(state.dataArray[i].cardType[j]=='2'){ |
|
|
|
cardTypeArr.push('储值卡') |
|
|
|
}else if(state.dataArray[i].cardType[j]=='3'){ |
|
|
|
cardTypeArr.push('预存卡') |
|
|
|
const savaHandle = (val) => { |
|
|
|
state.choiceCardShow = true; |
|
|
|
console.log("vAL", val) |
|
|
|
setItem("clientFee", val.clientFee); |
|
|
|
setItem("promoteId", val.promoteId); |
|
|
|
setItem("isValueCard", val.isValueCard); |
|
|
|
state.isSign = val.isSign; |
|
|
|
// 判断是几张卡 |
|
|
|
if (val.cardTypeArr.split(",").length == 1) { |
|
|
|
if (val.cardTypeArr.split(",")[0] == "记账卡") { |
|
|
|
state.isValueCard = 1 |
|
|
|
} else if (val.cardTypeArr.split(",")[0] == '储值卡') { |
|
|
|
state.isValueCard = 2 |
|
|
|
} else { |
|
|
|
state.isValueCard = 3 |
|
|
|
} |
|
|
|
uni.redirectTo({ |
|
|
|
url: `/subpackage/orders/essential-information?promoteId=${getItem("promoteId")}&userType=${state.userType}&type=${state.type}&isValueCard=${state.isValueCard}`, |
|
|
|
}); |
|
|
|
} else { |
|
|
|
state.radiolist1 = []; |
|
|
|
// 处理卡的数据 |
|
|
|
for (var i = 0; i < val.cardTypeArr.split(",").length; i++) { |
|
|
|
const obj = {}; |
|
|
|
obj["name"] = val.cardTypeArr.split(",")[i]; |
|
|
|
obj["disabled"] = false; |
|
|
|
state.radiolist1.push(obj) |
|
|
|
} |
|
|
|
console.log("state.radiolist1", state.radiolist1) |
|
|
|
} |
|
|
|
state.dataArray[i].cardTypeArr=cardTypeArr.toString() |
|
|
|
} |
|
|
|
console.log("state.dataArray",state.dataArray) |
|
|
|
}); |
|
|
|
}); |
|
|
|
|
|
|
|
//监听页面滚动 |
|
|
|
onPageScroll((e) => { |
|
|
|
scrollTop.value = e.scrollTop; |
|
|
|
}); |
|
|
|
|
|
|
|
const productReCodeAction = (id) => { |
|
|
|
var data = { |
|
|
|
productId: id, |
|
|
|
orderId: state.orderId, |
|
|
|
}; |
|
|
|
const options = { |
|
|
|
type: 2, |
|
|
|
data: data, |
|
|
|
method: "POST", |
|
|
|
showLoading: true, |
|
|
|
}; |
|
|
|
|
|
|
|
return new Promise(async (resolve, reject) => { |
|
|
|
const res = await request(productReCode, options); |
|
|
|
const data = stringToJson(res.bizContent); |
|
|
|
resolve(data); |
|
|
|
}).catch((error) => { |
|
|
|
reject(error); |
|
|
|
}); |
|
|
|
}; |
|
|
|
|
|
|
|
const state = reactive({ |
|
|
|
isValueCard:1, //卡的类型 |
|
|
|
radiolist1:[], //选择卡的数据列表 |
|
|
|
choiceCardShow:false, //选择卡的弹出框 |
|
|
|
isSign:'', |
|
|
|
orderId: "", |
|
|
|
userType: 1, //1 个人 2单位 |
|
|
|
type: 0, //0 客车 1货车 |
|
|
|
vehiclePlateColor: "", |
|
|
|
data: { |
|
|
|
show: false, |
|
|
|
src: imgURL + "applyCard/edit.png", |
|
|
|
}, |
|
|
|
dataArray: [], |
|
|
|
list: [ |
|
|
|
{ |
|
|
|
bg: imgURL + "applyCard/product-bg.png", |
|
|
|
icon: imgURL + "applyCard/wechat.png", |
|
|
|
title: "【货车】微信车主服务", |
|
|
|
tip: "绑定微信支付,无需绑定银行卡", |
|
|
|
}, |
|
|
|
], |
|
|
|
}); |
|
|
|
}; |
|
|
|
|
|
|
|
onLoad((option : any) => { |
|
|
|
// state.orderId = option.orderId; |
|
|
|
// state.userType = option.userType; |
|
|
|
// state.vehiclePlateColor = option.vehiclePlateColor; |
|
|
|
state.userType = option.userType; |
|
|
|
state.type = option.type; |
|
|
|
var data = { |
|
|
|
type: state.type, |
|
|
|
source: 'WECHAT' //请求方来源 |
|
|
|
}; |
|
|
|
const options = { |
|
|
|
type: 2, |
|
|
|
data: data, |
|
|
|
method: "POST", |
|
|
|
showLoading: true, |
|
|
|
}; |
|
|
|
console.log("输出内容", options); |
|
|
|
request(etcQueryProduct, options).then((res) => { |
|
|
|
// console.log(res.bizContent); |
|
|
|
const data = stringToJson(res.bizContent); |
|
|
|
console.log(data); |
|
|
|
// console.log(typeof(data)); |
|
|
|
state.dataArray = data.csmsnPromoteDistPro ? data.csmsnPromoteDistPro : []; |
|
|
|
for (var i = 0; i < state.dataArray.length; i++) { |
|
|
|
const cardTypeArr = [] |
|
|
|
for (var j = 0; j < state.dataArray[i].cardType.length; j++) { |
|
|
|
if (state.dataArray[i].cardType[j] == '1') { |
|
|
|
cardTypeArr.push('记账卡') |
|
|
|
} else if (state.dataArray[i].cardType[j] == '2') { |
|
|
|
cardTypeArr.push('储值卡') |
|
|
|
} else if (state.dataArray[i].cardType[j] == '3') { |
|
|
|
cardTypeArr.push('预存卡') |
|
|
|
} |
|
|
|
} |
|
|
|
state.dataArray[i].cardTypeArr = cardTypeArr.toString() |
|
|
|
} |
|
|
|
console.log("state.dataArray", state.dataArray) |
|
|
|
}); |
|
|
|
}); |
|
|
|
|
|
|
|
//监听页面滚动 |
|
|
|
onPageScroll((e) => { |
|
|
|
scrollTop.value = e.scrollTop; |
|
|
|
}); |
|
|
|
|
|
|
|
const productReCodeAction = (id) => { |
|
|
|
var data = { |
|
|
|
productId: id, |
|
|
|
orderId: state.orderId, |
|
|
|
}; |
|
|
|
const options = { |
|
|
|
type: 2, |
|
|
|
data: data, |
|
|
|
method: "POST", |
|
|
|
showLoading: true, |
|
|
|
}; |
|
|
|
|
|
|
|
return new Promise(async (resolve, reject) => { |
|
|
|
const res = await request(productReCode, options); |
|
|
|
const data = stringToJson(res.bizContent); |
|
|
|
resolve(data); |
|
|
|
}).catch((error) => { |
|
|
|
reject(error); |
|
|
|
}); |
|
|
|
}; |
|
|
|
|
|
|
|
const state = reactive({ |
|
|
|
isValueCard: 1, //卡的类型 |
|
|
|
radiolist1: [], //选择卡的数据列表 |
|
|
|
choiceCardShow: false, //选择卡的弹出框 |
|
|
|
isSign: '', |
|
|
|
orderId: "", |
|
|
|
userType: 1, //1 个人 2单位 |
|
|
|
type: 0, //0 客车 1货车 |
|
|
|
vehiclePlateColor: "", |
|
|
|
data: { |
|
|
|
show: false, |
|
|
|
src: imgURL + "applyCard/edit.png", |
|
|
|
}, |
|
|
|
dataArray: [], |
|
|
|
list: [ |
|
|
|
{ |
|
|
|
bg: imgURL + "applyCard/product-bg.png", |
|
|
|
icon: imgURL + "applyCard/wechat.png", |
|
|
|
title: "【货车】微信车主服务", |
|
|
|
tip: "绑定微信支付,无需绑定银行卡", |
|
|
|
}, |
|
|
|
], |
|
|
|
}); |
|
|
|
</script> |
|
|
|
|
|
|
|
<style lang="scss" scoped> |
|
|
|
::v-deep .u-radio{ |
|
|
|
::v-deep .u-radio { |
|
|
|
display: flex !important; |
|
|
|
align-items: center !important; |
|
|
|
float: none !important; |
|
|
|
} |
|
|
|
::v-deep .u-icon__icon{ |
|
|
|
top: -4px !important; |
|
|
|
} |
|
|
|
.bottomTip { |
|
|
|
margin-top: 100rpx; |
|
|
|
text-align: center; |
|
|
|
font-size: 28rpx; |
|
|
|
font-family: Microsoft YaHei; |
|
|
|
font-weight: 400; |
|
|
|
color: #b3b3b3; |
|
|
|
} |
|
|
|
|
|
|
|
.content-value { |
|
|
|
position: relative; |
|
|
|
// margin-top: -50rpx; |
|
|
|
padding: 0rpx 30rpx; |
|
|
|
position: relative; |
|
|
|
|
|
|
|
.img-pos { |
|
|
|
position: absolute; |
|
|
|
left: 500rpx; |
|
|
|
top: -38rpx; |
|
|
|
right: 50rpx; |
|
|
|
|
|
|
|
.img-flex { |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
align-items: center; |
|
|
|
|
|
|
|
.car-img { |
|
|
|
width: 86rpx; |
|
|
|
height: 42rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.flag-img { |
|
|
|
width: 30rpx; |
|
|
|
height: 35rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.flex { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
} |
|
|
|
|
|
|
|
.action { |
|
|
|
margin-top: 30rpx; |
|
|
|
padding-left: 20rpx; |
|
|
|
padding-right: 20rpx; |
|
|
|
padding-bottom: 30rpx; |
|
|
|
|
|
|
|
.button { |
|
|
|
height: 80rpx; |
|
|
|
background: linear-gradient(-90deg, #43a1e0 0%, #13e7c1 100%); |
|
|
|
border-radius: 40rpx; |
|
|
|
font-size: 32rpx; |
|
|
|
font-weight: 400; |
|
|
|
color: #ffffff; |
|
|
|
line-height: 80rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.action-btn { |
|
|
|
margin-left: 45rpx; |
|
|
|
width: 121rpx; |
|
|
|
height: 61rpx; |
|
|
|
border: 1px solid rgba(255, 255, 255, 1); |
|
|
|
border-radius: 30rpx; |
|
|
|
background: rgba(255, 255, 255, 0.2); |
|
|
|
|
|
|
|
text-align: center; |
|
|
|
font-size: 30rpx; |
|
|
|
font-family: Microsoft YaHei; |
|
|
|
font-weight: 400; |
|
|
|
color: #ffffff; |
|
|
|
line-height: 61rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.tag1 { |
|
|
|
padding: 5rpx; |
|
|
|
background: rgba(0, 179, 139, 0.5); |
|
|
|
border-radius: 6rpx; |
|
|
|
font-size: 22rpx; |
|
|
|
font-family: Microsoft YaHei; |
|
|
|
font-weight: 400; |
|
|
|
color: #ffffff; |
|
|
|
} |
|
|
|
|
|
|
|
.tag3 { |
|
|
|
padding: 5rpx; |
|
|
|
background: rgba(139, 112, 228, 0.5); |
|
|
|
border-radius: 6rpx; |
|
|
|
font-size: 22rpx; |
|
|
|
font-family: Microsoft YaHei; |
|
|
|
font-weight: 400; |
|
|
|
color: #ffffff; |
|
|
|
} |
|
|
|
|
|
|
|
.tag2 { |
|
|
|
padding: 5rpx; |
|
|
|
background: rgba(249, 97, 60, 0.5); |
|
|
|
border-radius: 6rpx; |
|
|
|
font-size: 22rpx; |
|
|
|
font-family: Microsoft YaHei; |
|
|
|
font-weight: 400; |
|
|
|
color: #ffffff; |
|
|
|
} |
|
|
|
|
|
|
|
.ul-item { |
|
|
|
padding: 5px 20rpx; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
|
|
|
|
.item-value { |
|
|
|
padding: 20rpx; |
|
|
|
position: absolute; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
// justify-content: space-around; |
|
|
|
width: 80%; |
|
|
|
|
|
|
|
.content { |
|
|
|
width: 51%; |
|
|
|
.title { |
|
|
|
font-size: 32rpx; |
|
|
|
font-family: Microsoft YaHei; |
|
|
|
font-weight: 400; |
|
|
|
color: #ffffff; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.tip { |
|
|
|
font-size: 24rpx; |
|
|
|
font-family: Microsoft YaHei; |
|
|
|
font-weight: 400; |
|
|
|
color: #ffffff; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.icon-tip { |
|
|
|
width: 100rpx; |
|
|
|
height: 100rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.content { |
|
|
|
margin-left: 40rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
.money{ |
|
|
|
color: white; |
|
|
|
// float: right; |
|
|
|
} |
|
|
|
::v-deep .u-mode-center-box{ |
|
|
|
border-radius: 10rpx; |
|
|
|
} |
|
|
|
.squire{ |
|
|
|
padding: 30rpx 30rpx 30rpx 50rpx; |
|
|
|
} |
|
|
|
.mask-close { |
|
|
|
|
|
|
|
::v-deep .u-icon__icon { |
|
|
|
top: -4px !important; |
|
|
|
} |
|
|
|
|
|
|
|
.bottomTip { |
|
|
|
margin-top: 100rpx; |
|
|
|
text-align: center; |
|
|
|
font-size: 28rpx; |
|
|
|
font-family: Microsoft YaHei; |
|
|
|
font-weight: 400; |
|
|
|
color: #b3b3b3; |
|
|
|
} |
|
|
|
|
|
|
|
.content-value { |
|
|
|
position: relative; |
|
|
|
// margin-top: -50rpx; |
|
|
|
padding: 0rpx 30rpx; |
|
|
|
position: relative; |
|
|
|
|
|
|
|
.img-pos { |
|
|
|
position: absolute; |
|
|
|
left: 500rpx; |
|
|
|
top: -38rpx; |
|
|
|
right: 50rpx; |
|
|
|
|
|
|
|
.img-flex { |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
align-items: center; |
|
|
|
|
|
|
|
.car-img { |
|
|
|
width: 86rpx; |
|
|
|
height: 42rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.flag-img { |
|
|
|
width: 30rpx; |
|
|
|
height: 35rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.flex { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
} |
|
|
|
|
|
|
|
.action { |
|
|
|
margin-top: 30rpx; |
|
|
|
padding-left: 20rpx; |
|
|
|
padding-right: 20rpx; |
|
|
|
padding-bottom: 30rpx; |
|
|
|
|
|
|
|
.button { |
|
|
|
height: 80rpx; |
|
|
|
background: linear-gradient(-90deg, #43a1e0 0%, #13e7c1 100%); |
|
|
|
border-radius: 40rpx; |
|
|
|
font-size: 32rpx; |
|
|
|
font-weight: 400; |
|
|
|
color: #ffffff; |
|
|
|
line-height: 80rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.action-btn { |
|
|
|
margin-left: 45rpx; |
|
|
|
width: 121rpx; |
|
|
|
height: 61rpx; |
|
|
|
border: 1px solid rgba(255, 255, 255, 1); |
|
|
|
border-radius: 30rpx; |
|
|
|
background: rgba(255, 255, 255, 0.2); |
|
|
|
|
|
|
|
text-align: center; |
|
|
|
font-size: 30rpx; |
|
|
|
font-family: Microsoft YaHei; |
|
|
|
font-weight: 400; |
|
|
|
color: #ffffff; |
|
|
|
line-height: 61rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.tag1 { |
|
|
|
padding: 5rpx; |
|
|
|
background: rgba(0, 179, 139, 0.5); |
|
|
|
border-radius: 6rpx; |
|
|
|
font-size: 22rpx; |
|
|
|
font-family: Microsoft YaHei; |
|
|
|
font-weight: 400; |
|
|
|
color: #ffffff; |
|
|
|
} |
|
|
|
|
|
|
|
.tag3 { |
|
|
|
padding: 5rpx; |
|
|
|
background: rgba(139, 112, 228, 0.5); |
|
|
|
border-radius: 6rpx; |
|
|
|
font-size: 22rpx; |
|
|
|
font-family: Microsoft YaHei; |
|
|
|
font-weight: 400; |
|
|
|
color: #ffffff; |
|
|
|
} |
|
|
|
|
|
|
|
.tag2 { |
|
|
|
padding: 5rpx; |
|
|
|
background: rgba(249, 97, 60, 0.5); |
|
|
|
border-radius: 6rpx; |
|
|
|
font-size: 22rpx; |
|
|
|
font-family: Microsoft YaHei; |
|
|
|
font-weight: 400; |
|
|
|
color: #ffffff; |
|
|
|
} |
|
|
|
|
|
|
|
.ul-item { |
|
|
|
padding: 5px 20rpx; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
|
|
|
|
.item-value { |
|
|
|
padding: 20rpx; |
|
|
|
position: absolute; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
// justify-content: space-around; |
|
|
|
width: 80%; |
|
|
|
|
|
|
|
.content { |
|
|
|
width: 51%; |
|
|
|
|
|
|
|
.title { |
|
|
|
font-size: 32rpx; |
|
|
|
font-family: Microsoft YaHei; |
|
|
|
font-weight: 400; |
|
|
|
color: #ffffff; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.tip { |
|
|
|
font-size: 24rpx; |
|
|
|
font-family: Microsoft YaHei; |
|
|
|
font-weight: 400; |
|
|
|
color: #ffffff; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.icon-tip { |
|
|
|
width: 100rpx; |
|
|
|
height: 100rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.content { |
|
|
|
margin-left: 40rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.money { |
|
|
|
color: white; |
|
|
|
// float: right; |
|
|
|
} |
|
|
|
|
|
|
|
::v-deep .u-mode-center-box { |
|
|
|
border-radius: 10rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.squire { |
|
|
|
padding: 30rpx 30rpx 30rpx 50rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.mask-close { |
|
|
|
text-align: right; |
|
|
|
} |
|
|
|
.icon-closed { |
|
|
|
|
|
|
|
.icon-closed { |
|
|
|
width: 48rpx; |
|
|
|
height: 48rpx; |
|
|
|
} |
|
|
|
.mask-title { |
|
|
|
|
|
|
|
.mask-title { |
|
|
|
text-align: center; |
|
|
|
font-size: 32rpx; |
|
|
|
color: $uni-text-color-black; |
|
|
|
margin-bottom: 50rpx; |
|
|
|
margin-top: 50rpx; |
|
|
|
} |
|
|
|
</style> |
|
|
|
</style> |