923 lines
18 KiB
Vue
923 lines
18 KiB
Vue
<template>
|
||
<view class="content">
|
||
<view class="c-top">
|
||
<view class="" @click="getback()">
|
||
<uni-icons type="left" size="18"></uni-icons>
|
||
</view>
|
||
<view class="c-title">提交订单</view>
|
||
<view class=""></view>
|
||
</view>
|
||
<view class="ail">
|
||
<view class="ail-box">
|
||
<view class="o-top">
|
||
<view class="goodsimg">
|
||
<image :src=" imgs + obj.goodsImage" mode=""></image>
|
||
</view>
|
||
<view>
|
||
<view class="z-title">{{obj.goodsName}}</view>
|
||
<view class="">￥{{price/100}}</view>
|
||
</view>
|
||
</view>
|
||
<view class="o-input">
|
||
<view class="dis">
|
||
<text class="b-one">折扣</text>
|
||
<text class="b-two" v-if="obj.ratio * 10 >= 10">当前无折扣</text>
|
||
<text class="b-two" v-if="obj.ratio * 10 < 10">当前等级折扣{{obj.ratio * 10}}折</text>
|
||
</view>
|
||
<view class="dis">
|
||
<text class="xju">-{{parseFloat(((price-zhe)/100)).toFixed(2)}} 元</text>
|
||
</view>
|
||
</view>
|
||
<view class="o-input" @click="gocoupon()">
|
||
<text class="b-one">优惠卷</text>
|
||
<view class="dis">
|
||
<text class="xju">{{coupontitle}}</text>
|
||
<uni-icons type="right" size="18" color="#AAAAAA"></uni-icons>
|
||
</view>
|
||
</view>
|
||
<view class="o-input">
|
||
<text class="b-one">可用余额</text>
|
||
<view class="dis">
|
||
<text class="xju">{{balance/100}}</text>
|
||
</view>
|
||
</view>
|
||
<view class="o-input" v-if="pickCarId">
|
||
<text class="b-one">上门费用</text>
|
||
<view class="dis">
|
||
<text class="xju">{{pickPrice /100}}</text>
|
||
</view>
|
||
</view>
|
||
<view class="hj">合计：<text class="dju">￥{{((needAmount+pickPrice)/100).toFixed(2)}}</text> </view>
|
||
</view>
|
||
|
||
<!-- <view class="bai-box" v-if="jcdb == true" >
|
||
<view class="boxb" :class="{ 'boxlan' : payindex == index }" v-for="(item,index) in payTypelist" :key="index" @click="gettyp(index,item.type)">
|
||
{{item.text}}
|
||
</view>
|
||
|
||
</view> -->
|
||
<view class="img-yuye" @click="goyuye(0)">
|
||
<view class="yuyeimg">
|
||
<image src="http://www.nuoyunr.com/lananRsc/detection/yuyue.png" mode=""></image>
|
||
</view>
|
||
<view class="zhong">
|
||
<view class="zlan">提前预约</view>
|
||
<view class="zxlan">预约门店检测时间</view>
|
||
</view>
|
||
<!-- <view class="xxiangl" v-if="yuyue != 0"></view> -->
|
||
<view class="xxianglxz">
|
||
<text>→</text>
|
||
</view>
|
||
</view>
|
||
<view class="img-shangmen" @click="goyuye(4)">
|
||
<view class="yuyeimg">
|
||
<image src="http://www.nuoyunr.com/lananRsc/detection/pickCar.png" mode=""></image>
|
||
</view>
|
||
<view class="zhong">
|
||
<view class="zlanl">上门取车</view>
|
||
<view class="zxlanl">选择上门取车时间</view>
|
||
</view>
|
||
<!-- <view class="xxiangl" v-if="yuyue != 0"></view> -->
|
||
<view class="xxianglxzl">
|
||
<text>→</text>
|
||
</view>
|
||
</view>
|
||
<!-- 新增 -->
|
||
<swiper class="swiper" circular :indicator-dots="indicatorDots" :interval="interval" :duration="duration">
|
||
<swiper-item v-for="(item,index) in carlist" :key="index" @click="xuanzhong(item.carId)">
|
||
<view class="bai-box" :class="{ 'xzlan' : userCarId == item.carId }">
|
||
<view class="x-top">
|
||
<!-- @click="gocarinfo(item.carId)" -->
|
||
<view class="x-left">
|
||
<view>
|
||
<view class="dh-title">{{item.carBrand}}</view>
|
||
<view class="xh-title">{{item.carNo}}</view>
|
||
</view>
|
||
</view>
|
||
<view class="x-right">
|
||
<uni-icons v-if="userCarId == item.carId" type="checkmarkempty" color="#18bc37"
|
||
size="22"></uni-icons>
|
||
<view class="xh-title" v-if="userCarId != item.carId">点击选择此车辆</view>
|
||
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</swiper-item>
|
||
<swiper-item v-if="carlist.length == 0">
|
||
<view class="aa-box" @click="gohomemy()">
|
||
|
||
<view class="wdadada"
|
||
style="font-size: 18px; font-weight: bold; margin-top: 30px;text-align: center;">
|
||
暂无更多车辆信息点击维护</view>
|
||
</view>
|
||
</swiper-item>
|
||
</swiper>
|
||
|
||
|
||
<!-- -->
|
||
<view style="width: 100%; height: 80px;">
|
||
<view class="hongzi">
|
||
温馨提示：预约后需点击立即支付享受服务
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="bott">
|
||
<view class="dju">￥{{parseFloat(((hj+pickPrice)/100)).toFixed(2)}}</view>
|
||
<view class="" @click="getpayment()">
|
||
<view class="b-left">
|
||
<text>立即支付</text>
|
||
</view>
|
||
<view class="b-right">
|
||
<image src="http://www.nuoyunr.com/lananRsc/detection/zhifu.png" mode=""></image>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
</view>
|
||
|
||
</template>
|
||
|
||
<script>
|
||
import config from '@/config'
|
||
import request from '../../utils/request';
|
||
|
||
export default {
|
||
data() {
|
||
return {
|
||
carlist: [],
|
||
userCarId: '',
|
||
interval: 5000,
|
||
duration: 100,
|
||
appointmentId: '',
|
||
pickCarId: '',
|
||
pickPrice: 0,
|
||
zfid: 1,
|
||
imgs: '',
|
||
obj: '',
|
||
price: '',
|
||
zhe: '',
|
||
balance: '',
|
||
hj: '',
|
||
id: '',
|
||
type: '',
|
||
current: '', //积分
|
||
yedkAmount: 0,
|
||
userCouponId: '',
|
||
orderid: '',
|
||
couponId: '', //优惠券id
|
||
coupontitle: '', //优惠券名称
|
||
discount: '', //优惠卷金额
|
||
couponType: '', //优惠券类型
|
||
needAmount: 0,
|
||
datas: '',
|
||
jcdb: false,
|
||
payTypelist: [{
|
||
text: '微信',
|
||
type: 'wx'
|
||
},
|
||
{
|
||
text: '赊账',
|
||
type: 'sz'
|
||
},
|
||
],
|
||
payType: '',
|
||
payindex: ''
|
||
}
|
||
},
|
||
onLoad(option) {
|
||
this.id = option.id
|
||
this.type = option.type
|
||
this.datas = option.data
|
||
this.imgs = this.$baseUrl
|
||
|
||
this.getindex()
|
||
//获取订单信息
|
||
},
|
||
onShow() {
|
||
|
||
this.getcarlist()
|
||
uni.$on('userCouponDiscount', (data) => {
|
||
console.log('jianting', data);
|
||
//优惠券页面返回的东西
|
||
this.couponId = data.couponId
|
||
this.coupontitle = data.title
|
||
this.discount = data.discount * 100
|
||
this.couponType = data.couponType
|
||
})
|
||
// this.getindex()
|
||
|
||
// let role = uni.getStorageSync('role')
|
||
// if(role[0] == "jcdb"){
|
||
// this.jcdb = true
|
||
// console.log('判断', this.jcdb);
|
||
// }
|
||
},
|
||
methods: {
|
||
async getcarlist() {
|
||
const res = await request({
|
||
url: '/appInspection/userOwn/getCanInspectionCars',
|
||
method: 'get',
|
||
})
|
||
|
||
this.carlist = res.data
|
||
console.log(this.carlist);
|
||
},
|
||
xuanzhong(carid) {
|
||
this.userCarId = carid
|
||
},
|
||
//这个函数是写在A页面的methods中
|
||
Backappoinment(appointmentId) {
|
||
this.appointmentId = appointmentId
|
||
},
|
||
BackPickCarId(pickCarId, pickPrice) {
|
||
this.pickCarId = pickCarId
|
||
this.pickPrice = pickPrice
|
||
},
|
||
gocoupon() {
|
||
uni.navigateTo({
|
||
url: '/pages/detection/coupon?id=' + this.id + "&type=" + this.type
|
||
})
|
||
},
|
||
|
||
async getindex() {
|
||
if (this.type == 'goods') {
|
||
let res = await request({
|
||
url: '/appInspection/goods/orderGoodsInfo?goodsId=' + this.id,
|
||
method: 'get',
|
||
})
|
||
console.log('skuId', res);
|
||
this.obj = res.data
|
||
this.price = res.data.price
|
||
this.zhe = this.price * res.data.ratio //折扣多少金额
|
||
this.balance = res.data.balance //用户总积分
|
||
this.needAmount = this.zhe >= this.discount ? this.zhe - this.discount : 0
|
||
this.yedkAmount = this.balance < this.needAmount ? this.balance : this.needAmount
|
||
|
||
if (this.couponType && this.couponType == 'offset') {
|
||
this.hj = 0
|
||
} else {
|
||
this.hj = this.needAmount - this.yedkAmount
|
||
}
|
||
|
||
console.log(this.price, this.zhe, '1212', this.needAmount, this.yedkAmount);
|
||
}
|
||
|
||
if (this.type == 'sku') {
|
||
let res = await request({
|
||
url: '/appInspection/goods/orderSkuInfo?goodsId=' + this.id,
|
||
method: 'get',
|
||
})
|
||
console.log('skuId', res);
|
||
this.obj = res.data
|
||
this.price = res.data.price
|
||
this.zhe = this.price * res.data.ratio //折扣多少金额
|
||
this.balance = res.data.balance //用户总积分
|
||
this.needAmount = this.zhe >= this.discount ? this.zhe - this.discount : 0
|
||
this.yedkAmount = this.balance < this.needAmount ? this.balance : this.needAmount
|
||
|
||
if (this.couponType && this.couponType == 'offset') {
|
||
this.hj = 0
|
||
} else {
|
||
this.hj = this.needAmount - this.yedkAmount
|
||
}
|
||
|
||
console.log(this.price, this.needAmount, this.yedkAmount);
|
||
}
|
||
},
|
||
gohomemy() {
|
||
uni.navigateTo({
|
||
url: '/pages/detection/my-user'
|
||
})
|
||
},
|
||
async getpayment() {
|
||
if (!this.userCarId) {
|
||
uni.showToast({
|
||
title: '请选择车辆信息'
|
||
})
|
||
return
|
||
}
|
||
let that = this
|
||
let data
|
||
if (this.type == 'goods') {
|
||
data = {
|
||
goodsId: this.id,
|
||
goodsType: 'jc',
|
||
balance: this.yedkAmount,
|
||
couponId: this.couponId,
|
||
appointmentId: this.appointmentId,
|
||
pickCarId: this.pickCarId,
|
||
userCarId: this.userCarId
|
||
// payType:this.payType,
|
||
}
|
||
}
|
||
if (this.type == 'sku') {
|
||
data = {
|
||
skuId: this.id,
|
||
goodsType: 'jc',
|
||
balance: this.yedkAmount,
|
||
couponId: this.couponId,
|
||
appointmentId: this.appointmentId,
|
||
pickCarId: this.pickCarId,
|
||
userCarId: this.userCarId
|
||
// payType:this.payType,
|
||
}
|
||
}
|
||
|
||
let res = await request({
|
||
url: '/orderApi/createOrder',
|
||
method: 'post',
|
||
data: data
|
||
})
|
||
console.log(res);
|
||
this.orderid = res.data
|
||
if (res.data == 11111111) {
|
||
console.log('sku成功');
|
||
uni.navigateTo({
|
||
url: '/pages/detection/success'
|
||
})
|
||
} else {
|
||
console.log('执行');
|
||
const ress = await request({
|
||
url: '/payApi/jcPrepayment?type=jsapi' + '&orderId=' + this.orderid,
|
||
})
|
||
console.log(ress);
|
||
wx.requestPayment({
|
||
timeStamp: ress.timeStamp, // 时间戳，从1970年1月1日00:00:00至今的秒数，即当前的时间
|
||
nonceStr: ress.nonceStr, // 随机字符串，长度为32个字符以下。
|
||
package: ress.package, // 统一下单接口返回的 prepay_id 参数值，格式如“prepay_id=*”
|
||
signType: ress.signType, // 签名算法类型，默认为 MD5，支持RSA等其他加密算法
|
||
paySign: ress.paySign, // 签名，详见签名生成算法
|
||
success: function(res) {
|
||
console.log('成功', res);
|
||
if (res.errMsg = 'requestPayment:ok') {
|
||
uni.showToast({
|
||
title: '支付成功'
|
||
})
|
||
uni.navigateTo({
|
||
url: '/pages/detection/success'
|
||
})
|
||
}
|
||
// 支付成功后的回调函数， res.errMsg = 'requestPayment:ok'
|
||
},
|
||
fail: function(res) {
|
||
console.log('执行失败1', res);
|
||
that.cancelpay()
|
||
}
|
||
})
|
||
|
||
}
|
||
},
|
||
async cancelpay() {
|
||
console.log('执行失败2');
|
||
const resx = await request({
|
||
method: 'post',
|
||
url: '/orderApi/cancelPay',
|
||
params: {
|
||
orderId: this.orderid,
|
||
}
|
||
})
|
||
uni.showToast({
|
||
title: '支付失败'
|
||
})
|
||
console.log(resx);
|
||
},
|
||
goyuye(num) {
|
||
if (num == 0) {
|
||
uni.navigateTo({
|
||
url: '/pages/detection/reservation?goodsName=' + this.obj.goodsName + '&goodsId=' + this
|
||
.obj.goodsId + "&type=" + this.type
|
||
})
|
||
}
|
||
if (num == 4) {
|
||
uni.navigateTo({
|
||
url: '/pages/detection/godoor?goodsName=' + this.obj.goodsName + '&goodsId=' + this.obj
|
||
.goodsId + "&type=" + this.type
|
||
})
|
||
}
|
||
},
|
||
getback() {
|
||
uni.navigateBack()
|
||
},
|
||
gettyp(index, type) {
|
||
this.payindex = index
|
||
this.payType = type
|
||
},
|
||
govip() {
|
||
uni.navigateTo({
|
||
url: "/pages/detection/my-vip"
|
||
})
|
||
},
|
||
getzf(id) {
|
||
this.zfid = id
|
||
}
|
||
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.swiper {
|
||
height: 100px;
|
||
}
|
||
|
||
.bai-box {
|
||
box-sizing: border-box;
|
||
padding: 15px;
|
||
background-color: white;
|
||
border-radius: 8px;
|
||
margin-top: 15px;
|
||
}
|
||
|
||
.xzlan {
|
||
background: #E3EAFF;
|
||
}
|
||
|
||
.content {
|
||
width: 100%;
|
||
height: calc(100vh);
|
||
background-color: #F6F6F6;
|
||
box-sizing: border-box;
|
||
// padding-top: 45px;
|
||
}
|
||
|
||
.ail {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 10px 15px;
|
||
background-color: #F6F6F6;
|
||
}
|
||
|
||
.ail-box {
|
||
width: 100%;
|
||
border-radius: 8px;
|
||
box-sizing: border-box;
|
||
padding: 15px;
|
||
background: #FFFFFF;
|
||
margin-bottom: 10px;
|
||
}
|
||
|
||
.bai-box {
|
||
|
||
border-radius: 10px;
|
||
margin: 10px auto;
|
||
background: white;
|
||
box-sizing: border-box;
|
||
padding: 10px;
|
||
display: flex;
|
||
}
|
||
|
||
.boxb {
|
||
|
||
border: 1px solid #B4B3B1;
|
||
border-radius: 4px;
|
||
box-sizing: border-box;
|
||
padding: 5px 10px;
|
||
font-size: 16px;
|
||
margin-right: 10px;
|
||
}
|
||
|
||
.boxlan {
|
||
border: 1px solid #0D2E8D !important;
|
||
color: #0D2E8D !important;
|
||
}
|
||
|
||
.c-top {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 15px;
|
||
padding-top: 15%;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
background-color: white;
|
||
}
|
||
|
||
.zfxx {
|
||
width: 16px;
|
||
height: 16px;
|
||
border-radius: 50%;
|
||
opacity: 1;
|
||
border: 1px solid #B4B3B1;
|
||
}
|
||
|
||
.zzzf {
|
||
width: 16px;
|
||
height: 16px;
|
||
border-radius: 50%;
|
||
opacity: 1;
|
||
background: #0D2E8D;
|
||
border: 1px solid #B4B3B1;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
}
|
||
|
||
.wxtx {
|
||
width: 26px;
|
||
height: 26px;
|
||
overflow: hidden;
|
||
border-radius: 50%;
|
||
margin-right: 10px;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.z-title {
|
||
font-size: 18px;
|
||
font-weight: bold;
|
||
color: #333333;
|
||
margin-bottom: 60px;
|
||
}
|
||
|
||
.x-title {
|
||
font-size: 18px;
|
||
font-weight: 400;
|
||
color: #333333;
|
||
}
|
||
|
||
.bott {
|
||
width: 100%;
|
||
height: 50px;
|
||
background-color: #EEEEEE;
|
||
position: fixed;
|
||
background: white;
|
||
bottom: 0px;
|
||
box-sizing: border-box;
|
||
padding: 10px;
|
||
|
||
}
|
||
|
||
.dju {
|
||
font-size: 25px;
|
||
font-weight: bold;
|
||
color: #FF571A;
|
||
}
|
||
|
||
.b-left {
|
||
position: fixed;
|
||
bottom: 20px;
|
||
right: 10%;
|
||
z-index: 99999;
|
||
font-size: 18px;
|
||
font-weight: 400;
|
||
color: #FFFFFF;
|
||
;
|
||
|
||
}
|
||
|
||
.b-right {
|
||
width: 40%;
|
||
height: 60px;
|
||
position: fixed;
|
||
bottom: 0px;
|
||
right: 0px;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.o-top {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.dis {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.b-one {
|
||
font-size: 15px;
|
||
font-weight: 400;
|
||
color: #333333;
|
||
margin-right: 10px;
|
||
}
|
||
|
||
.b-two {
|
||
font-size: 14px;
|
||
font-weight: 400;
|
||
color: #999999;
|
||
}
|
||
|
||
.xju {
|
||
font-size: 15px;
|
||
font-weight: 400;
|
||
color: #F67B35;
|
||
}
|
||
|
||
.dju {
|
||
font-size: 30px;
|
||
font-weight: bold;
|
||
color: #FF571A;
|
||
}
|
||
|
||
.goodsimg {
|
||
width: 110px;
|
||
height: 110px;
|
||
border-radius: 8px;
|
||
margin-right: 10px;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.o-input {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin: 10px auto;
|
||
}
|
||
|
||
.hj {
|
||
width: 100%;
|
||
border-top: 1px solid #EEEEEE;
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
align-items: center;
|
||
box-sizing: border-box;
|
||
padding-top: 10px;
|
||
}
|
||
|
||
.ai-top {
|
||
width: 100%;
|
||
border-bottom: 1px solid #EEEEEE;
|
||
box-sizing: border-box;
|
||
padding-bottom: 10px;
|
||
font-size: 15px;
|
||
font-weight: 400;
|
||
color: #666666;
|
||
|
||
}
|
||
|
||
.wxinput {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin: 10px auto;
|
||
}
|
||
|
||
.img-vip {
|
||
width: 98%;
|
||
height: 75px;
|
||
margin: 0 auto;
|
||
overflow: hidden;
|
||
border-radius: 8px;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.img-yuye {
|
||
width: 98%;
|
||
height: 75px;
|
||
margin: 0 auto;
|
||
margin-bottom: 10px;
|
||
overflow: hidden;
|
||
border-radius: 8px;
|
||
box-sizing: border-box;
|
||
padding: 10px;
|
||
background: #E8F7FD;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.img-shangmen {
|
||
width: 98%;
|
||
height: 75px;
|
||
margin: 0 auto;
|
||
margin-bottom: 10px;
|
||
overflow: hidden;
|
||
border-radius: 8px;
|
||
box-sizing: border-box;
|
||
padding: 10px;
|
||
background: #D9F5E4;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.img-noyuye {
|
||
width: 98%;
|
||
height: 75px;
|
||
margin: 0 auto;
|
||
margin-bottom: 10px;
|
||
overflow: hidden;
|
||
border-radius: 8px;
|
||
box-sizing: border-box;
|
||
padding: 10px;
|
||
background: #FDE8E8;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.yuyeimg {
|
||
width: 40px;
|
||
height: 40px;
|
||
margin-right: 15px;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.zhong {
|
||
width: 70%;
|
||
text-align: left;
|
||
}
|
||
|
||
.xxiang {
|
||
width: 22px;
|
||
height: 22px;
|
||
border-radius: 50%;
|
||
border: 1px solid #F28585;
|
||
}
|
||
|
||
.xxiangl {
|
||
width: 22px;
|
||
height: 22px;
|
||
border-radius: 50%;
|
||
border: 1px solid #7984A5;
|
||
}
|
||
|
||
.xxiangxz {
|
||
width: 22px;
|
||
height: 22px;
|
||
border-radius: 50%;
|
||
// background-color: #F28585;
|
||
// border: 1px solid #F28585;
|
||
background: white;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: white;
|
||
}
|
||
|
||
.xxianglxz {
|
||
width: 22px;
|
||
height: 22px;
|
||
border-radius: 50%;
|
||
background: linear-gradient(180deg, #3F61C0 0%, #0D2E8D 100%);
|
||
border: 1px solid #7984A5;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: white;
|
||
}
|
||
|
||
.xxianglxzl {
|
||
width: 22px;
|
||
height: 22px;
|
||
border-radius: 50%;
|
||
background: #3CBC6F;
|
||
border: 1px solid #7984A5;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: white;
|
||
}
|
||
|
||
.zlanl {
|
||
width: 100%;
|
||
text-align: left;
|
||
font-size: 18px;
|
||
font-weight: 500;
|
||
color: #3CBC6F;
|
||
}
|
||
|
||
.zxlanl {
|
||
width: 100%;
|
||
text-align: left;
|
||
font-size: 15px;
|
||
font-weight: 400;
|
||
color: #79A592;
|
||
}
|
||
|
||
.zlan {
|
||
width: 100%;
|
||
text-align: left;
|
||
font-size: 18px;
|
||
font-weight: 500;
|
||
color: #0D2E8D;
|
||
}
|
||
|
||
.zxlan {
|
||
width: 100%;
|
||
text-align: left;
|
||
font-size: 15px;
|
||
font-weight: 400;
|
||
color: #7984A5;
|
||
}
|
||
|
||
.zfen {
|
||
width: 100%;
|
||
text-align: left;
|
||
font-size: 18px;
|
||
font-weight: 500;
|
||
color: #8D0D0D;
|
||
}
|
||
|
||
.zxfen {
|
||
width: 100%;
|
||
text-align: left;
|
||
font-size: 15px;
|
||
font-weight: 400;
|
||
color: #A57979;
|
||
}
|
||
|
||
.hongzi {
|
||
width: 100%;
|
||
margin: 10px auto;
|
||
text-align: center;
|
||
color: #0D2E8D;
|
||
box-sizing: border-box;
|
||
padding: 20px;
|
||
|
||
}
|
||
|
||
.x-top {
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
border-bottom: 1px solid #EEEEEE;
|
||
box-sizing: border-box;
|
||
padding-bottom: 10px;
|
||
}
|
||
|
||
.x-left {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.chebiao {
|
||
width: 70px;
|
||
height: 70px;
|
||
margin-right: 10px;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.dh-title {
|
||
font-size: 20px;
|
||
font-weight: 400;
|
||
color: #333333;
|
||
line-height: 20px;
|
||
margin-bottom: 15px;
|
||
}
|
||
|
||
.xh-title {
|
||
font-size: 15px;
|
||
font-weight: 400;
|
||
color: #666666;
|
||
line-height: 15px;
|
||
}
|
||
|
||
.x-right {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.x-xia {
|
||
margin-top: 15px;
|
||
}
|
||
|
||
.wdadada {
|
||
box-sizing: border-box;
|
||
padding: 10px 15px;
|
||
background-color: #FDE8E8;
|
||
border: 1px solid #F28585;
|
||
color: #ff0000;
|
||
border-radius: 8px;
|
||
}
|
||
</style> |