779 lines
20 KiB
Vue
779 lines
20 KiB
Vue
<template>
|
||
<view class="flex-col justify-start relative page" :style="{ backgroundImage: 'url(' + bkgUrl + ')'}">
|
||
<view class="flex-row justify-between section_2 pos">
|
||
|
||
<view @click="isSelectedState(0)">
|
||
<text class="font" :style="{ color: color[0] }"> 全部 </text>
|
||
<view class="flex-col justify-start items-center" v-if="isShowUnderLine[0]"
|
||
style="border: 1.88rpx solid #e79ea1; width: 90rpx; margin-top: 10rpx;"></view>
|
||
</view>
|
||
|
||
<view @click="isSelectedState(1)">
|
||
<text class="font" :style="{ color: color[1] }">待支付</text>
|
||
<view class="flex-col justify-start items-center" v-if="isShowUnderLine[1]"
|
||
style="border: 1.88rpx solid #e79ea1; width: 90rpx; margin-top: 10rpx;"></view>
|
||
</view>
|
||
|
||
<view @click="isSelectedState(2)">
|
||
<text class="font" :style="{ color: color[2] }">待提货</text>
|
||
<view class="flex-col justify-start items-center" v-if="isShowUnderLine[2]"
|
||
style="border: 1.88rpx solid #e79ea1; width: 90rpx; margin-top: 10rpx;"></view>
|
||
</view>
|
||
|
||
<view @click="isSelectedState(3)">
|
||
<text class="font" :style="{ color: color[3] }">租赁中</text>
|
||
<view class="flex-col justify-start items-center" v-if="isShowUnderLine[3]"
|
||
style="border: 1.88rpx solid #e79ea1; width: 90rpx; margin-top: 10rpx;"></view>
|
||
</view>
|
||
|
||
<view @click="isSelectedState(4)">
|
||
<text class="font" :style="{ color: color[4] }">已完成</text>
|
||
<view class="flex-col justify-start items-center" v-if="isShowUnderLine[4]"
|
||
style="border: 1.88rpx solid #e79ea1; width: 90rpx; margin-top: 10rpx;"></view>
|
||
</view>
|
||
|
||
</view>
|
||
|
||
|
||
<view class="flex-col pos_2">
|
||
<view class="flex-col list-item mt-15" v-for="(item, index) in orderList" :key="index" @click="gotoDetailPage(item.id)">
|
||
<view class="flex-row justify-between group">
|
||
<text class="font_3">泠珑水月阁</text>
|
||
<view class="flex-row items-center">
|
||
<text class="font_4 text_2" v-if="item.orderStatus === '待支付'">{{ item.countdown }}</text>
|
||
<text class="font_4 text_2" v-if="item.orderStatus === '待收货'">{{ item.countdown }}</text>
|
||
<text class="ml-4 font_5 text_3" v-if="item.orderStatus !== '待发货' && item.orderStatus !== '待收货'">{{ item.orderStatus }}</text>
|
||
<text class="ml-4 font_5 text_3" v-if="item.orderStatus === '待发货'">待取货</text>
|
||
<text class="ml-4 font_5 text_3" v-if="item.orderStatus === '待收货'">租赁中</text>
|
||
</view>
|
||
</view>
|
||
<view class="flex-row items-center group view">
|
||
<text class="font_6">订单编号：</text>
|
||
<text class="font_7 text_4">{{ item.orderNumber }}</text>
|
||
</view>
|
||
<view class="divider"></view>
|
||
<view class="flex-row justify-between items-end group_2">
|
||
<view class="flex-row">
|
||
<image class="image" mode="aspectFill"
|
||
:src="publicPath + item.clothesSnapshot.image"/>
|
||
<view class="flex-col items-start group_3 ml-13">
|
||
<text class="font_8">{{ item.clothesSnapshot.name }}</text>
|
||
<text class="font_10 text_6 mt-59">￥{{ item.clothesSnapshot.price.toFixed(2) }}</text>
|
||
</view>
|
||
</view>
|
||
<view class="flex-col items-center group_4" @click.stop="nav">
|
||
<image class="image_2" :src="clothesRentUrl + '/clothesRentOrderList/nav.png'" />
|
||
<text class="font_9 text_5 mt-11">提货地址</text>
|
||
</view>
|
||
</view>
|
||
<view class="flex-row justify-between items-baseline group view_2">
|
||
<text class="font_6 text_7">租赁天数</text>
|
||
<text class="font_11 text_8">X{{ item.rentDays }}</text>
|
||
</view>
|
||
<view class="flex-row justify-end items-baseline group_5">
|
||
<text class="font_9 text_9">实付款：</text>
|
||
<text class="font_12">￥{{ item.totalAmount.toFixed(2) }}</text>
|
||
</view>
|
||
|
||
|
||
<view class="flex-row justify-center group_6">
|
||
|
||
|
||
<view v-if="item.operationList[0]" style="background-color: #fff;" class="ml-10 flex-col justify-start items-center text-wrapper_2">
|
||
<text class="font_14 text_11"></text>
|
||
</view>
|
||
|
||
<view v-if="item.operationList[1]" style="background-color: #fff;" class="ml-10 flex-col justify-start items-center text-wrapper_2">
|
||
<text class="font_14 text_11"></text>
|
||
</view>
|
||
|
||
<view @click.stop>
|
||
<button v-if="item.operationList[2]" class="flex-col justify-start items-center text-wrapper" open-type="contact" bindcontact="handleContact" session-from="sessionFrom">
|
||
<text class="font_13 text_10">联系客服</text>
|
||
</button>
|
||
</view>
|
||
|
||
<view v-if="item.operationList[3]" class="ml-10 flex-col justify-start items-center text-wrapper" @click.stop="gotoCancelOrder(item.id)">
|
||
<text class="font_13">取消订单</text>
|
||
</view>
|
||
|
||
<view v-if="item.operationList[4]" class="ml-10 flex-col justify-start items-center text-wrapper_2" @click.stop="wxPay(item.id)">
|
||
<text class="font_14 text_11">去付款</text>
|
||
</view>
|
||
|
||
<view v-if="item.operationList[5]" class="ml-10 flex-col justify-start items-center text-wrapper" @click.stop="gotoDeleteOrder(item.id)">
|
||
<text class="font_13">删除订单</text>
|
||
</view>
|
||
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 遮罩层 -->
|
||
<view v-if="isShow" class="overlay"></view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { onMounted, onUnmounted, ref, onBeforeUnmount } from 'vue'
|
||
import { clothesRentUrl } from '../../../common/globalImagesUrl';
|
||
import { baseUrl } from '../../../api/request';
|
||
import { publicPath } from '../../../common/globalImagesUrl';
|
||
import emitter from '../../../utils/emitter';
|
||
import { onPullDownRefresh } from '@dcloudio/uni-app';
|
||
const items = ref([null, null, null, null])
|
||
const isShowUnderLine = ref([true, false, false, false, false])
|
||
let orderStatusList = ['全部', '待支付', '待发货', '待收货', '交易成功']
|
||
const color = ref(new Array(5).fill('#323232'))
|
||
const point = ref(0)
|
||
const cookie = wx.getStorageSync("cookie") //请求头
|
||
const bkgUrl = ref(clothesRentUrl + '/clothesRentOrderList/bkg.png')
|
||
const orderList = ref([])
|
||
|
||
let wxPayTimer = null;
|
||
let loading = false;
|
||
let isLoading = ref(false)
|
||
let isShow = ref(false)
|
||
|
||
|
||
const flushClothesOrderListHandler = () => {
|
||
getRentOrderList()
|
||
}
|
||
|
||
onMounted(() => {
|
||
color.value[0] = '#e79ea1'
|
||
getRentOrderList()
|
||
emitter.on('flushClothesOrderList', flushClothesOrderListHandler)
|
||
})
|
||
|
||
|
||
onUnmounted(() => {
|
||
emitter.off('flushClothesOrderList', flushClothesOrderListHandler)
|
||
})
|
||
|
||
onPullDownRefresh( async ()=>{ //下拉刷新
|
||
color.value[0] = '#e79ea1'
|
||
getRentOrderList()
|
||
emitter.on('flushOrderList', flushOrderListHandler)
|
||
setTimeout(()=>{
|
||
uni.stopPullDownRefresh() //停止下拉刷新
|
||
},1000)
|
||
})
|
||
|
||
|
||
|
||
const getRentOrderList = async () => {
|
||
orderList.value.forEach(order => {
|
||
if (order.countdownInterval) {
|
||
clearInterval(order.countdownInterval); // 清除定时器
|
||
}
|
||
})
|
||
const res = await uni.request({
|
||
url: baseUrl + '/clothesRent/list/my',
|
||
method: 'POST',
|
||
header: {
|
||
'cookie': cookie
|
||
}
|
||
})
|
||
orderList.value = res.data.data
|
||
dealTimeout()
|
||
orderList.value.forEach(order => {
|
||
startCountdown(order)
|
||
});
|
||
}
|
||
|
||
const isSelectedState = async (val) => {
|
||
if (point.value === val) return
|
||
point.value = val
|
||
for (var i = 0; i < 5; i++) {
|
||
if (i === val) {
|
||
isShowUnderLine.value[i] = true
|
||
color.value[i] = '#e79ea1'
|
||
} else {
|
||
isShowUnderLine.value[i] = false
|
||
color.value[i] = '#323232'
|
||
}
|
||
}
|
||
await getRentOrderList()
|
||
if (point.value !== 0) {
|
||
orderList.value = orderList.value.filter(item => item.orderStatus === orderStatusList[point.value])
|
||
}
|
||
}
|
||
|
||
|
||
|
||
|
||
const gotoCancelOrder = (val) => {
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: '您确定要取消订单吗？',
|
||
success: async (res) => {
|
||
if (res.confirm) {
|
||
await cancelRentOrder(val)
|
||
await getRentOrderList()
|
||
}
|
||
}
|
||
})
|
||
}
|
||
|
||
|
||
const cancelRentOrder = async (val) => {
|
||
const res = await uni.request({
|
||
url: baseUrl + '/clothesRent/cancel/id',
|
||
method: 'POST',
|
||
header: {
|
||
cookie
|
||
},
|
||
data: {
|
||
id: val
|
||
}
|
||
})
|
||
console.log(res.data.data)
|
||
}
|
||
|
||
|
||
|
||
const gotoDeleteOrder = (val) => {
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: '您确定要删除订单吗？',
|
||
success: async (res) => {
|
||
if (res.confirm) {
|
||
await deleteOrder(val)
|
||
await getRentOrderList()
|
||
}
|
||
}
|
||
})
|
||
}
|
||
|
||
|
||
const deleteOrder = async (val) => {
|
||
const res = await uni.request({
|
||
url: baseUrl + '/clothesRent/delete',
|
||
method: 'POST',
|
||
header: {
|
||
cookie
|
||
},
|
||
data: {
|
||
id: val
|
||
}
|
||
})
|
||
console.log('=================================>', res.data.data)
|
||
}
|
||
|
||
|
||
|
||
|
||
const dealTimeout = () => {
|
||
for (var i = 0; i < orderList.value.length; i ++ ) {
|
||
let order = orderList.value[i]
|
||
if (order.orderStatus === '待支付') {
|
||
orderList.value[i].operationList = [false, false, true, true, true, false]
|
||
} else if (order.orderStatus === '待发货') {
|
||
orderList.value[i].operationList = [true, true, true, false, false, false]
|
||
} else if (order.orderStatus === '待收货') {
|
||
orderList.value[i].operationList = [true, true, true, false, false, false]
|
||
} else if (order.orderStatus === '已退款') {
|
||
orderList.value[i].operationList = [true, true, true, false, false, false]
|
||
} else if (order.orderStatus === '交易关闭') {
|
||
orderList.value[i].operationList = [true, true, false, false, false, true]
|
||
} else if (order.orderStatus === '交易成功') {
|
||
orderList.value[i].operationList = [true, false, false, false, false, false]
|
||
}
|
||
}
|
||
}
|
||
|
||
|
||
// 启动每个订单的倒计时（仅对待支付订单有效）
|
||
const startCountdown = (order) => {
|
||
|
||
if (order.orderStatus === '待支付') {
|
||
order.endTime = add30Minutes(order.createTime); // 设置最终取消时间
|
||
|
||
order.countdownInterval = setInterval(() => {
|
||
const now = Math.floor(Date.now() / 1000); // 获取当前时间的时间戳（秒）
|
||
const remainingTime = order.endTime - now;
|
||
if (remainingTime <= 0) {
|
||
order.countdown = '00:00';
|
||
clearInterval(order.countdownInterval); // 清除定时器
|
||
order.orderStatus = '交易关闭'
|
||
dealTimeout()
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: '订单超时未支付，已取消',
|
||
showCancel: false
|
||
})
|
||
} else {
|
||
const minutes = Math.floor(remainingTime / 60); // 计算剩余分钟
|
||
const seconds = remainingTime % 60; // 计算剩余秒数
|
||
order.countdown = `${String(minutes).padStart(2, '0')}:${String(seconds).padStart(2, '0')}`;
|
||
}
|
||
}, 1000);
|
||
}
|
||
|
||
|
||
|
||
|
||
|
||
// 如果是租赁中订单
|
||
if (order.orderStatus === '待收货') {
|
||
order.endTime = addRentalTime(order.pickupTime); // 设置租赁结束时间
|
||
|
||
order.countdownInterval = setInterval(() => {
|
||
const now = Math.floor(Date.now() / 1000); // 获取当前时间的时间戳（秒）
|
||
const remainingTime = order.endTime - now;
|
||
|
||
if (remainingTime <= 0) {
|
||
order.countdown = '00天00:00:00';
|
||
clearInterval(order.countdownInterval); // 清除定时器
|
||
order.orderStatus = '交易成功'; // 修改为交易成功
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: '租赁时间已结束，订单完成',
|
||
showCancel: false
|
||
});
|
||
} else {
|
||
const days = Math.floor(remainingTime / (24 * 3600)); // 计算剩余天数
|
||
const hours = Math.floor((remainingTime % (24 * 3600)) / 3600); // 剩余小时
|
||
const minutes = Math.floor((remainingTime % 3600) / 60); // 剩余分钟
|
||
const seconds = remainingTime % 60; // 剩余秒数
|
||
|
||
// 如果天数小于10，补零；大于等于10则不补零
|
||
const daysFormatted = days < 10 ? `0${days}` : `${days}`;
|
||
|
||
order.countdown = `${daysFormatted}天${String(hours).padStart(2, '0')}:${String(minutes).padStart(2, '0')}:${String(seconds).padStart(2, '0')}`;
|
||
}
|
||
}, 1000);
|
||
}
|
||
|
||
|
||
|
||
};
|
||
|
||
|
||
// 时间格式化函数，处理后端返回的时间
|
||
const parseDate = (dateString) => {
|
||
const [date, time] = dateString.split(' ');
|
||
const [year, month, day] = date.split('-').map(Number);
|
||
const [hour, minute, second] = time.split(':').map(Number);
|
||
return new Date(year, month - 1, day, hour, minute, second); // JavaScript Date的月份是从0开始的
|
||
};
|
||
|
||
// 给订单创建时间加上30分钟
|
||
const add30Minutes = (createdTime) => {
|
||
const date = parseDate(createdTime);
|
||
date.setMinutes(date.getMinutes() + 1); // 加上30分钟
|
||
return Math.floor(date.getTime() / 1000); // 返回时间戳（秒）
|
||
};
|
||
|
||
// 给订单创建时间加上租赁时长
|
||
const addRentalTime = (createdTime) => {
|
||
const date = parseDate(createdTime);
|
||
date.setHours(date.getHours() + 24); // 假设租赁时间为24小时，可以根据需求修改
|
||
return Math.floor(date.getTime() / 1000); // 返回时间戳（秒）
|
||
};
|
||
|
||
// 在组件卸载时清除所有定时器，避免内存泄漏
|
||
onBeforeUnmount(() => {
|
||
orderList.value.forEach(order => {
|
||
if (order.countdownInterval) {
|
||
clearInterval(order.countdownInterval); // 清除定时器
|
||
}
|
||
})
|
||
});
|
||
|
||
|
||
|
||
|
||
const wxPayFd = (oid) => { //微信支付按钮防抖
|
||
clearTimeout(wxPayTimer)
|
||
showLoading()
|
||
isShow.value = true //打开遮罩
|
||
wxPayTimer = setTimeout(async () => {
|
||
await wxPay(oid)
|
||
}, 1000)
|
||
setTimeout(()=>{
|
||
hideLoading()
|
||
isShow.value = false //关闭遮罩
|
||
},2000)
|
||
}
|
||
|
||
function showLoading() { //加载弹窗
|
||
if (!loading) {
|
||
wx.showLoading({
|
||
title: '加载中...',
|
||
});
|
||
loading = true;
|
||
isLoading.value = true
|
||
}
|
||
}
|
||
|
||
function hideLoading() { //关闭弹窗
|
||
if (loading) {
|
||
wx.hideLoading();
|
||
loading = false;
|
||
isLoading.value = false
|
||
}
|
||
}
|
||
|
||
|
||
const wxPay = async( oid )=> { //传入订单id
|
||
showLoading()
|
||
isShow.value = true
|
||
try {
|
||
const res = await uni.request({
|
||
url: baseUrl + '/wechat/payment/clothesRent/create',
|
||
method: 'POST',
|
||
header: {
|
||
'cookie': wx.getStorageSync("cookie")
|
||
},
|
||
data: { id: oid }
|
||
})
|
||
const paymentData = res.data.data
|
||
wx.requestPayment({
|
||
appid: paymentData.appId,
|
||
nonceStr: paymentData.nonceStr,
|
||
package: paymentData.packageVal,
|
||
paySign: paymentData.paySign,
|
||
timeStamp: paymentData.timeStamp,
|
||
signType: paymentData.signType,
|
||
success(res) {
|
||
uni.showModal({
|
||
content: '支付成功',
|
||
showCancel: false
|
||
})
|
||
},
|
||
fail(e) {
|
||
|
||
},
|
||
complete() {
|
||
uni.redirectTo({
|
||
url: '/pages/clothesRent/clothesRentOrderDetail/clothesRentOrderDetail?id=' + oid
|
||
})
|
||
}
|
||
})
|
||
}catch(error) {
|
||
console.error('支付请求失败');
|
||
uni.showModal({
|
||
content: '支付请求失败,请重试。',
|
||
showCancel: false
|
||
})
|
||
}
|
||
}
|
||
|
||
|
||
const gotoDetailPage = (val) => {
|
||
uni.navigateTo({
|
||
url: '/pages/clothesRent/clothesRentOrderDetail/clothesRentOrderDetail?id=' + val
|
||
})
|
||
}
|
||
|
||
|
||
const nav = () => { //导航
|
||
wx.openLocation({
|
||
latitude: 45.867741,
|
||
longitude: 126.560037,
|
||
name: '哈尔滨师范大学(松北校区)',
|
||
address: '黑龙江省哈尔滨市呼兰区利民经济开发区师大路1号',
|
||
success: (res) => {
|
||
console.log(res)
|
||
}
|
||
})
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.overlay {
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
width: 100%;
|
||
height: 100%;
|
||
background-color: rgba(0, 0, 0, 0.4); /* 半透明黑色背景 */
|
||
z-index: 999;
|
||
}
|
||
button{padding: 0;margin: 0;}
|
||
button::after{ border: none; }
|
||
.mt-15 {
|
||
margin-top: 28.13rpx;
|
||
}
|
||
|
||
.ml-13 {
|
||
margin-left: 24.38rpx;
|
||
}
|
||
|
||
.mt-59 {
|
||
margin-top: 110.63rpx;
|
||
}
|
||
|
||
.mt-11 {
|
||
margin-top: 20.63rpx;
|
||
}
|
||
|
||
.page {
|
||
background-color: #ffffff;
|
||
overflow: hidden;
|
||
background-size: 100% 100%;
|
||
background-repeat: no-repeat;
|
||
width: 100%;
|
||
overflow-y: auto;
|
||
overflow-x: hidden;
|
||
height: 100vh;
|
||
}
|
||
|
||
.section_2 {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
padding: 20rpx 41.25rpx 0;
|
||
background-color: #ebe7e4;
|
||
}
|
||
|
||
.pos {
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
right: 0;
|
||
z-index: 9;
|
||
}
|
||
|
||
.font {
|
||
font-size: 30rpx;
|
||
font-family: FZSongKeBenXiuKaiS-R-GB;
|
||
line-height: 28.24rpx;
|
||
color: #323232;
|
||
}
|
||
|
||
.font_2 {
|
||
font-size: 30rpx;
|
||
font-family: FZSongKeBenXiuKaiS-R-GB;
|
||
line-height: 28.84rpx;
|
||
color: #323232;
|
||
}
|
||
|
||
.text {
|
||
line-height: 27.43rpx;
|
||
}
|
||
|
||
.pos_2 {
|
||
position: absolute;
|
||
left: 22.5rpx;
|
||
right: 24.38rpx;
|
||
top: 108.75rpx;
|
||
padding-bottom: 40rpx;
|
||
}
|
||
|
||
.list-item {
|
||
padding: 22.5rpx 22.5rpx 0;
|
||
background-color: #ffffff;
|
||
border-radius: 18.75rpx;
|
||
}
|
||
|
||
.list-item:first-child {
|
||
margin-top: 0;
|
||
}
|
||
|
||
.group {
|
||
padding: 0 11.25rpx;
|
||
}
|
||
|
||
.font_3 {
|
||
font-size: 30rpx;
|
||
font-family: FZSongKeBenXiuKaiS-R-GB;
|
||
line-height: 28.01rpx;
|
||
color: #323232;
|
||
}
|
||
|
||
.font_4 {
|
||
font-size: 26.25rpx;
|
||
font-family: FZSongKeBenXiuKaiS-R-GB;
|
||
line-height: 18.79rpx;
|
||
color: #ffaaa5;
|
||
}
|
||
|
||
.text_2 {
|
||
font-size: 28.13rpx;
|
||
}
|
||
|
||
.font_5 {
|
||
font-size: 26.25rpx;
|
||
font-family: FZSongKeBenXiuKaiS-R-GB;
|
||
line-height: 25.84rpx;
|
||
color: #ffaaa5;
|
||
}
|
||
|
||
.text_3 {
|
||
line-height: 25.74rpx;
|
||
}
|
||
|
||
.view {
|
||
margin-top: 18.75rpx;
|
||
}
|
||
|
||
.font_6 {
|
||
font-size: 26.25rpx;
|
||
font-family: FZSongKeBenXiuKaiS-R-GB;
|
||
line-height: 25.84rpx;
|
||
color: #818181;
|
||
}
|
||
|
||
.font_7 {
|
||
font-size: 26.25rpx;
|
||
font-family: FZSongKeBenXiuKaiS-R-GB;
|
||
line-height: 18.79rpx;
|
||
color: #818181;
|
||
}
|
||
|
||
.text_4 {
|
||
line-height: 17.53rpx;
|
||
}
|
||
|
||
.divider {
|
||
margin-top: 18.75rpx;
|
||
background-color: #dbdbdb;
|
||
height: 1.88rpx;
|
||
}
|
||
|
||
.group_2 {
|
||
margin-top: 26.25rpx;
|
||
padding: 0 9.38rpx;
|
||
position: relative;
|
||
}
|
||
|
||
.image {
|
||
border-radius: 9.38rpx;
|
||
width: 148.13rpx;
|
||
height: 165rpx;
|
||
}
|
||
|
||
.group_3 {
|
||
margin-bottom: 3.75rpx;
|
||
}
|
||
|
||
.font_8 {
|
||
font-size: 30rpx;
|
||
font-family: FZSongKeBenXiuKaiS-R-GB;
|
||
line-height: 29.18rpx;
|
||
color: #323232;
|
||
}
|
||
|
||
.font_10 {
|
||
font-size: 30rpx;
|
||
font-family: FZSongKeBenXiuKaiS-R-GB;
|
||
line-height: 18.79rpx;
|
||
color: #323232;
|
||
}
|
||
|
||
.text_6 {
|
||
margin-left: 7.5rpx;
|
||
line-height: 20.04rpx;
|
||
}
|
||
|
||
.group_4 {
|
||
position: absolute;
|
||
top: 0;
|
||
right: 0rpx;
|
||
}
|
||
|
||
.image_2 {
|
||
width: 46.88rpx;
|
||
height: 46.88rpx;
|
||
}
|
||
|
||
.font_9 {
|
||
font-size: 26.25rpx;
|
||
font-family: FZSongKeBenXiuKaiS-R-GB;
|
||
line-height: 25.84rpx;
|
||
color: #323232;
|
||
}
|
||
|
||
.text_5 {
|
||
line-height: 25.22rpx;
|
||
}
|
||
|
||
.view_2 {
|
||
margin-top: 22.5rpx;
|
||
}
|
||
|
||
.text_7 {
|
||
font-size: 28.13rpx;
|
||
line-height: 27.02rpx;
|
||
}
|
||
|
||
.font_11 {
|
||
font-size: 26.25rpx;
|
||
font-family: FZSongKeBenXiuKaiS-R-GB;
|
||
line-height: 18.79rpx;
|
||
color: #323232;
|
||
}
|
||
|
||
.text_8 {
|
||
font-size: 28.13rpx;
|
||
}
|
||
|
||
.group_5 {
|
||
margin-top: 30rpx;
|
||
}
|
||
|
||
.text_9 {
|
||
font-size: 28.13rpx;
|
||
line-height: 26.7rpx;
|
||
}
|
||
|
||
.font_12 {
|
||
font-size: 33.75rpx;
|
||
font-family: FZSongKeBenXiuKaiS-R-GB;
|
||
line-height: 22.54rpx;
|
||
color: #c35c5d;
|
||
}
|
||
|
||
.group_6 {
|
||
margin-top: 30rpx;
|
||
padding: 26.25rpx 0rpx 26.25rpx 160rpx;
|
||
border-top: solid 1.88rpx #dbdbdb;
|
||
}
|
||
|
||
.font_13 {
|
||
font-size: 26.25rpx;
|
||
font-family: FZSongKeBenXiuKaiS-R-GB;
|
||
line-height: 25.84rpx;
|
||
color: #e79ea1;
|
||
}
|
||
|
||
.text_10 {
|
||
line-height: 25.54rpx;
|
||
}
|
||
|
||
.text-wrapper {
|
||
padding: 15rpx 0;
|
||
background-color: #ffffff;
|
||
border-radius: 75rpx;
|
||
width: 153.75rpx;
|
||
height: 56.25rpx;
|
||
border-left: solid 1.88rpx #e79ea1;
|
||
border-right: solid 1.88rpx #e79ea1;
|
||
border-top: solid 1.88rpx #e79ea1;
|
||
border-bottom: solid 1.88rpx #e79ea1;
|
||
}
|
||
|
||
.text-wrapper_2 {
|
||
padding: 15rpx 0;
|
||
background-color: #e79ea1;
|
||
border-radius: 75rpx;
|
||
width: 153.75rpx;
|
||
height: 56.25rpx;
|
||
}
|
||
|
||
.font_14 {
|
||
font-size: 26.25rpx;
|
||
font-family: FZSongKeBenXiuKaiS-R-GB;
|
||
line-height: 25.84rpx;
|
||
color: #ffffff;
|
||
}
|
||
|
||
.text_11 {
|
||
line-height: 24rpx;
|
||
}
|
||
|
||
@import url(../../../common/css/global.css);
|
||
</style> |