1081 lines
25 KiB
Vue
1081 lines
25 KiB
Vue
<template>
|
|
<view class="box flex justify-center align-items flex-column">
|
|
<view class="con-center flex flex-column justify-center align-items">
|
|
<view class="tabs align-items">
|
|
<span
|
|
class="s-header flex flex-column"
|
|
v-for="(item, index) in headers"
|
|
:key="index"
|
|
:class="{ selected: headerSelected(item.status) }"
|
|
@click="selectheader(item.status)"
|
|
>
|
|
{{ item.text }}
|
|
<span
|
|
class="lines"
|
|
:class="{ selected: headerSelected(item.status) }"
|
|
></span>
|
|
</span>
|
|
</view>
|
|
|
|
<view class="flex align-items justify-start shenhe" v-if="status == 0">
|
|
<span :class="['span_s', { active: !auth_status }]" @click="toShlist(0)">待审核</span>
|
|
<span :class="['span_s', { active: auth_status }]" style="margin-left: 20rpx;" @click="toShlist(2)">未通过</span>
|
|
</view>
|
|
|
|
|
|
<view class="hot flex flex-column">
|
|
<view class="content flex align-items flex-column">
|
|
<view
|
|
class="flex flex-column w-100 bbb"
|
|
style="position: relative;"
|
|
v-for="(item, index) in hotList"
|
|
:key="index"
|
|
@click="detail(item.id)"
|
|
>
|
|
<image
|
|
v-if="item.auth_status == 0"
|
|
src="/static/my/daishenhe.png"
|
|
style="width: 134rpx; height: 106rpx;position: absolute;right: 0;"
|
|
></image>
|
|
<image
|
|
v-if="item.auth_status == 2"
|
|
src="/static/my/wtg.png"
|
|
style="width: 134rpx; height: 106rpx;position: absolute;right: 0;"
|
|
></image>
|
|
<view class="flex" style="margin-top: 24rpx">
|
|
<view
|
|
class="right flex flex-column"
|
|
style="align-items: self-start"
|
|
>
|
|
|
|
<span class="title white-space">{{ item.title }}</span>
|
|
<span
|
|
class="first-image flex align-items"
|
|
style="margin-top: 20rpx; width: 100%"
|
|
>
|
|
<image
|
|
:src="item.user.avatar"
|
|
style="width: 36rpx; height: 36rpx"
|
|
></image>
|
|
<span
|
|
style="color: #9c9c9c; margin-left: 10rpx; width: 35%"
|
|
>{{ item.user.nickname }}</span
|
|
>
|
|
<view class="white-space" style="width: 60%">
|
|
<span
|
|
style="color: #0ca013; margin-left: 20rpx"
|
|
v-for="items_t in item.classes_cate"
|
|
>#{{ items_t }}</span
|
|
>
|
|
</view>
|
|
</span>
|
|
|
|
<view class="flex flex-column" style="margin-top: 20rpx">
|
|
<view class="time flex align-items white-space">
|
|
<span class="time_tex" v-if="item.status == 2">{{
|
|
"报名中"
|
|
}}</span>
|
|
<span style="margin: 0 8rpx"
|
|
>{{ dateWeeks(item.sign_start_time) }} </span
|
|
>|<span
|
|
class="white-space"
|
|
style="margin-left: 8rpx; width: 260rpx"
|
|
>{{ item.address_detail }}</span
|
|
>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="flex align-items" style="margin-top: 20rpx">
|
|
<image
|
|
class="imgs_con"
|
|
v-for="(items_img, index) in item.images.slice(0, 3)"
|
|
:key="index"
|
|
:src="items_img"
|
|
></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="bottom flex align-items" v-if="item.auth_status != 0">
|
|
<view class="flex align-items">
|
|
<span class="flex align-items" style="width: 200rpx">
|
|
<u-avatar-group
|
|
:urls="item.join_info.users"
|
|
keyName="avatar"
|
|
size="30"
|
|
maxCount="5"
|
|
gap="0.4"
|
|
></u-avatar-group>
|
|
<image
|
|
v-if="item.join_info.users.length > 0"
|
|
src="/static/index/dian.png"
|
|
style="
|
|
width: 60rpx;
|
|
height: 60rpx;
|
|
margin-left: -20rpx;
|
|
z-index: 1;
|
|
"
|
|
></image>
|
|
</span>
|
|
<view class="number flex align-items">
|
|
{{ Number(item.join_info.people_number) + "人已上车" }}
|
|
</view>
|
|
</view>
|
|
<span class="part flex justify-center align-items"> 上车 </span>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 热门活动 -->
|
|
|
|
<!-- <u-popup :show="show" mode="center" :zIndex="99999" :custom-style="popupStyle" closeable="true" @close="close"
|
|
@open="open">
|
|
<view class="popup flex flex-column align-items">
|
|
<view class="pop-center flex">
|
|
<view class="left">
|
|
<image :src="qrcode.detail.headimage" mode="" style="width: 280rpx;height: 200rpx;"></image>
|
|
</view>
|
|
<view class="right flex flex-column">
|
|
<span class="title white-space">{{qrcode.detail.title}}</span>
|
|
<span class="hui"
|
|
style="margin: 16rpx 0 6rpx 0;">课时:{{qrcode.detail.verification_num}}/{{qrcode.detail.limit_num}}</span>
|
|
<span class="hui">日期:{{qrcode.detail.classes_date_text}}</span>
|
|
<span class="hui" style="margin: 6rpx 0 6rpx 0;">时间:{{qrcode.detail.classes_time_text}}</span>
|
|
<span class="hui" v-if="qrcode && qrcode.detail" style="margin-top: 6rpx;">开始时间:{{ formatTimestamp(qrcode.detail.start_time) }}</span>
|
|
<span class="hui" v-if="qrcode && qrcode.detail" style="margin: 6rpx 0 6rpx 0;">结束时间:{{ formatTimestamp(qrcode.detail.end_time) }}</span>
|
|
<span class="hui">地址:{{qrcode.detail.address_detail}}</span>
|
|
</view>
|
|
</view>
|
|
<span class="line-short"></span>
|
|
<image :src="qrcode.codeimage" mode="" style="width: 376rpx;height: 376rpx;"></image>
|
|
<span style="margin: 24rpx 0 64rpx 0;">核销二维码</span>
|
|
</view>
|
|
</u-popup> -->
|
|
|
|
<!-- <u-loadmore :status="loadStatus" /> -->
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { dateWeek } from "../../utils/dateFormat";
|
|
export default {
|
|
data() {
|
|
return {
|
|
popupStyle: {
|
|
width: "690rpx",
|
|
margin: "0 auto", // 水平居中
|
|
display: "flex",
|
|
justifyContent: "center",
|
|
alignItems: "center",
|
|
padding: "0",
|
|
borderRadius: "20rpx",
|
|
},
|
|
sortList: [
|
|
{
|
|
text: "按照价格排序",
|
|
value: ["acs", "desc"],
|
|
},
|
|
{
|
|
text: "按照编号排序",
|
|
value: ["acs", "desc"],
|
|
},
|
|
],
|
|
size: 13,
|
|
sortStyle: ["#ff557f", "#3f3f3f"],
|
|
headers: [
|
|
{
|
|
status: "0",
|
|
text: "活动审核",
|
|
},
|
|
{
|
|
status: "1",
|
|
text: "未开始",
|
|
},
|
|
{
|
|
status: "2",
|
|
text: "报名中",
|
|
},
|
|
{
|
|
status: "3",
|
|
text: "待开始",
|
|
},
|
|
{
|
|
status: "4",
|
|
text: "进行中",
|
|
},
|
|
{
|
|
status: "5",
|
|
text: "已结束",
|
|
},
|
|
{
|
|
status: "-1",
|
|
text: "已取消",
|
|
}
|
|
],
|
|
selected: "0",
|
|
page: 1,
|
|
limit: 10,
|
|
loadStatus: "loading",
|
|
keywords: "",
|
|
list: [],
|
|
show: false,
|
|
qrcode: "",
|
|
count: 0,
|
|
// 活动列表
|
|
hotList: [],
|
|
// 审核状态
|
|
auth_status:0,
|
|
status: 0,
|
|
};
|
|
},
|
|
onLoad(option) {
|
|
// this.list = []
|
|
// this.page = 1
|
|
// if (option?.status) {
|
|
// this.selected = option.status
|
|
// this.getList(option.status);
|
|
// } else {
|
|
// this.getList('0');
|
|
// }
|
|
this.getHotList(this.status);
|
|
},
|
|
|
|
// onReachBottom() {
|
|
// if (this.list.length < this.count) {
|
|
// this.page++;
|
|
// this.getList(this.selected);
|
|
// }
|
|
|
|
// },
|
|
|
|
methods: {
|
|
// 跳转详情
|
|
detail(id) {
|
|
uni.navigateTo({
|
|
url: "/pages/center/detailSys?id=" + id,
|
|
});
|
|
},
|
|
//开始
|
|
dateWeeks(e) {
|
|
return dateWeek(e);
|
|
},
|
|
|
|
// 获取我发布的活动
|
|
getHotList(val) {
|
|
let auth_status = val == '0' ? this.auth_status : '';
|
|
let vals = val == '0' ? '' : val;
|
|
uni.$u.http
|
|
.get("/api/school.new_activity/activity_list", {
|
|
params: {
|
|
page: 1,
|
|
limit: 20,
|
|
order: "normal",
|
|
my: 1,
|
|
auth_status: auth_status,
|
|
status: vals, // 5已结束
|
|
},
|
|
})
|
|
.then((res) => {
|
|
if (res.code == 1) {
|
|
const list = res.data.list.data || [];
|
|
this.hotList = list;
|
|
} else {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: "none",
|
|
duration: 2000,
|
|
});
|
|
}
|
|
})
|
|
.catch((error) => {
|
|
uni.showToast({
|
|
title: "请求失败，请稍后再试",
|
|
icon: "none",
|
|
duration: 2000,
|
|
});
|
|
});
|
|
},
|
|
formatTimestamp(timestamp) {
|
|
const date = new Date(timestamp * 1000); // 10位时间戳需要乘以1000
|
|
const year = date.getFullYear();
|
|
const month = String(date.getMonth() + 1).padStart(2, "0");
|
|
const day = String(date.getDate()).padStart(2, "0");
|
|
const hours = String(date.getHours()).padStart(2, "0");
|
|
const minutes = String(date.getMinutes()).padStart(2, "0");
|
|
const seconds = String(date.getSeconds()).padStart(2, "0");
|
|
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
|
|
},
|
|
// 关闭弹窗
|
|
close() {
|
|
this.show = false;
|
|
// this.qrcode = ''
|
|
},
|
|
open() {
|
|
this.show = true;
|
|
},
|
|
againBuy(id) {
|
|
uni.navigateTo({
|
|
url: "/pages/center/detail?id=" + id,
|
|
});
|
|
},
|
|
// 取消支付
|
|
Cancel(order_no) {
|
|
console.log(order_no);
|
|
uni.$u.http
|
|
.post("/api/school/order/cancel", {
|
|
order_no: order_no,
|
|
})
|
|
.then((res) => {
|
|
if (res.code == 1) {
|
|
this.list = [];
|
|
this.getList(0);
|
|
} else {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: "none",
|
|
duration: 2000,
|
|
});
|
|
}
|
|
})
|
|
.catch((error) => {});
|
|
},
|
|
// 跳转预约
|
|
toMake(id, orderId, classes_lib_id, type) {
|
|
uni.navigateTo({
|
|
// url: "/pages/center/applyDetail?id=" + id + "&orderId=" + orderId + "&type=" + 2
|
|
url:
|
|
"/pages/center/orderDetail?id=" +
|
|
id +
|
|
"&orderId=" +
|
|
orderId +
|
|
"&type=" +
|
|
2 +
|
|
"&classes_lib_id=" +
|
|
classes_lib_id,
|
|
});
|
|
},
|
|
toDetail(id, orderId, classes_lib_id, order_no) {
|
|
let type = null;
|
|
if (this.selected == 0) {
|
|
type = 1;
|
|
} else if (this.selected == 3) {
|
|
type = 2;
|
|
} else if (this.selected == 9) {
|
|
type = 9;
|
|
} else if (this.selected == -3) {
|
|
type = -3;
|
|
} else if (this.selected == 6) {
|
|
type = 6;
|
|
} else {
|
|
type = 0;
|
|
}
|
|
uni.navigateTo({
|
|
url:
|
|
"/pages/center/orderDetail?id=" +
|
|
id +
|
|
"&orderId=" +
|
|
orderId +
|
|
"&order_no=" +
|
|
order_no +
|
|
"&type=" +
|
|
type +
|
|
"&classes_lib_id=" +
|
|
classes_lib_id,
|
|
});
|
|
},
|
|
// 去支付
|
|
toPay(id, orderId, classes_lib_id, order_no, type) {
|
|
uni.navigateTo({
|
|
url:
|
|
"/pages/center/orderDetail?id=" +
|
|
id +
|
|
"&orderId=" +
|
|
orderId +
|
|
"&order_no=" +
|
|
order_no +
|
|
"&type=" +
|
|
1 +
|
|
"&classes_lib_id=" +
|
|
classes_lib_id,
|
|
});
|
|
},
|
|
// 售后
|
|
service(id) {
|
|
uni.navigateTo({
|
|
url: "/pages/afterSales/index?id=" + id,
|
|
});
|
|
},
|
|
// 核销码
|
|
QR(id) {
|
|
uni.$u.http
|
|
.get("/api/school/order/detail", {
|
|
params: {
|
|
id: id,
|
|
},
|
|
})
|
|
.then((res) => {
|
|
if (res.code == 1) {
|
|
this.qrcode = res.data.detail;
|
|
} else {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: "none",
|
|
duration: 2000,
|
|
});
|
|
}
|
|
})
|
|
.catch((error) => {});
|
|
this.show = true;
|
|
},
|
|
switchSort(index, value) {
|
|
console.log(index, value);
|
|
},
|
|
// 搜索
|
|
search() {
|
|
const that = this;
|
|
that.page = 1;
|
|
that.list = [];
|
|
this.getList(this.selected);
|
|
},
|
|
// 获取课程列表
|
|
getList(status) {
|
|
// if (this.loadStatus === 'nomore') return;
|
|
uni.$u.http
|
|
.get("/api/school/order/order_list", {
|
|
params: {
|
|
keywords: this.keywords,
|
|
page: this.page,
|
|
limit: this.limit,
|
|
status: status,
|
|
},
|
|
})
|
|
.then((res) => {
|
|
if (res.code == 1) {
|
|
this.count = res.data.count;
|
|
this.list = [...this.list, ...res.data.list];
|
|
if (this.list.length >= res.data.count) {
|
|
this.loadStatus = "nomore";
|
|
} else {
|
|
this.loadStatus = "loading";
|
|
}
|
|
} else {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: "none",
|
|
duration: 2000,
|
|
});
|
|
this.loadStatus = "loading";
|
|
}
|
|
})
|
|
.catch((error) => {
|
|
console.error("请求失败", error);
|
|
this.loadStatus = "loading";
|
|
});
|
|
},
|
|
selectheader(status) {
|
|
this.selected = status;
|
|
this.hotList = [];
|
|
this.status = status;
|
|
this.getHotList(status);
|
|
},
|
|
headerSelected(status) {
|
|
return this.selected === status;
|
|
},
|
|
toShlist(val){
|
|
this.auth_status = val
|
|
this.getHotList(this.status);
|
|
}
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.box {
|
|
.con-center {
|
|
width: 100%;
|
|
// margin-top: 25rpx;
|
|
// overflow: hidden;
|
|
background: #f7f7f7;
|
|
.tabs {
|
|
width: 750rpx;
|
|
background: #ffffff;
|
|
display: flex;
|
|
overflow-x: auto;
|
|
-webkit-overflow-scrolling: touch;
|
|
font-family: PingFang SC, PingFang SC;
|
|
|
|
.s-header {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
width: 140rpx;
|
|
height: 80rpx;
|
|
font-weight: 400;
|
|
font-size: 28rpx;
|
|
color: #9e9e9e;
|
|
line-height: 26rpx;
|
|
flex: 0 0 auto;
|
|
}
|
|
|
|
.s-header.selected {
|
|
width: 140rpx;
|
|
height: 80rpx;
|
|
background: #ffffff;
|
|
font-weight: 800;
|
|
font-size: 32rpx;
|
|
color: #323232;
|
|
line-height: 28rpx;
|
|
}
|
|
.lines {
|
|
padding-top: 16rpx;
|
|
width: 44rpx;
|
|
}
|
|
.lines.selected {
|
|
border-bottom: #323232 solid 8rpx;
|
|
}
|
|
}
|
|
.shenhe{
|
|
width: 100%;
|
|
margin-left: 30rpx;
|
|
margin-top: 30rpx;
|
|
.span_s{
|
|
width: 134rpx;
|
|
height: 60rpx;
|
|
line-height: 60rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 125rpx;
|
|
color: #9C9C9C;
|
|
text-align: center;
|
|
font-size: 26rpx;
|
|
|
|
}
|
|
.span_s.active {
|
|
color: #3D3D3D;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.w-100 {
|
|
width: 100%;
|
|
}
|
|
|
|
.flex {
|
|
display: flex;
|
|
}
|
|
|
|
.flex-start {
|
|
align-items: flex-start;
|
|
}
|
|
|
|
.justify-center {
|
|
justify-content: center;
|
|
}
|
|
|
|
.align-items {
|
|
align-items: center;
|
|
}
|
|
|
|
.flex-column {
|
|
flex-flow: column;
|
|
}
|
|
|
|
.justify-start {
|
|
justify-content: start;
|
|
}
|
|
|
|
.line {
|
|
margin-top: 12rpx;
|
|
width: 690rpx;
|
|
height: 1rpx;
|
|
background: #008cff;
|
|
border-radius: 0rpx 0rpx 0rpx 0rpx;
|
|
}
|
|
|
|
.centerBox {
|
|
width: 690rpx;
|
|
|
|
.box-line {
|
|
width: 400rpx;
|
|
height: 1rpx;
|
|
background: #d9d9d9;
|
|
border-radius: 0rpx 0rpx 0rpx 0rpx;
|
|
margin-top: 24rpx;
|
|
}
|
|
|
|
.center {
|
|
margin: 32rpx 0 32rpx 0;
|
|
}
|
|
|
|
.rightBox {
|
|
margin-left: 32rpx;
|
|
width: 50%;
|
|
|
|
.line-row {
|
|
width: 382rpx;
|
|
height: 1rpx;
|
|
background: #d9d9d9;
|
|
box-shadow: 1rpx 1rpx 0rpx 0rpx rgba(102, 102, 102, 0.25);
|
|
margin: 14rpx 0 6rpx 0;
|
|
}
|
|
|
|
.name {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 800;
|
|
font-size: 34rpx;
|
|
color: #343434;
|
|
display: -webkit-box;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-line-clamp: 1;
|
|
/* 设置行数 */
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
word-break: break-all;
|
|
margin-bottom: 24rpx;
|
|
/* 防止单词被截断 */
|
|
}
|
|
|
|
.minge {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
font-size: 24rpx;
|
|
color: #7a7a7a;
|
|
margin-bottom: 8rpx;
|
|
}
|
|
|
|
.money {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
font-size: 24rpx;
|
|
color: #ff2323;
|
|
|
|
span {
|
|
font-weight: 500;
|
|
font-size: 24rpx;
|
|
color: #7a7a7a;
|
|
}
|
|
}
|
|
|
|
.Cancel {
|
|
width: 138rpx;
|
|
height: 48rpx;
|
|
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
|
border: 2rpx solid #008cff;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 800;
|
|
font-size: 24rpx;
|
|
color: #008cff;
|
|
line-height: 32rpx;
|
|
letter-spacing: 4px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
align-self: flex-end;
|
|
}
|
|
|
|
.make {
|
|
width: 138rpx;
|
|
height: 48rpx;
|
|
background: #008cff;
|
|
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 800;
|
|
font-size: 24rpx;
|
|
color: #ffffff;
|
|
line-height: 32rpx;
|
|
letter-spacing: 4px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
align-self: flex-end;
|
|
margin-left: 24rpx;
|
|
}
|
|
|
|
.QR {
|
|
width: 138rpx;
|
|
height: 48rpx;
|
|
background: #4974ff;
|
|
box-shadow: 2rpx 2rpx 0rpx 0rpx rgba(0, 0, 0, 0.4);
|
|
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
|
font-weight: 400;
|
|
font-size: 26rpx;
|
|
color: #eaeaea;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
align-self: flex-end;
|
|
margin-top: 50rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.charge {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 800;
|
|
font-size: 28rpx;
|
|
color: #ff2323;
|
|
line-height: 32rpx;
|
|
}
|
|
|
|
.search {
|
|
margin-top: 24rpx;
|
|
width: 690rpx;
|
|
height: 64rpx;
|
|
background: #ffffff;
|
|
box-shadow: 2rpx 2rpx 0rpx 0rpx rgba(0, 0, 0, 0.4);
|
|
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
|
border: 2rpx solid #008cff;
|
|
|
|
.dashed {
|
|
image {
|
|
width: 52rpx;
|
|
height: 52rpx;
|
|
}
|
|
}
|
|
|
|
.line-search {
|
|
width: 2rpx;
|
|
height: 42rpx;
|
|
background: #008cff;
|
|
border-radius: 0rpx 0rpx 0rpx 0rpx;
|
|
}
|
|
|
|
.input {
|
|
// border: 4rpx solid #EAEAEA;
|
|
padding-left: 12rpx;
|
|
height: 100%;
|
|
width: 100%;
|
|
}
|
|
|
|
::v-deep .input-placeholder {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
font-size: 32rpx;
|
|
color: #c0c0c0;
|
|
line-height: 32rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
}
|
|
|
|
.searchBtn {
|
|
width: 128rpx;
|
|
height: 64rpx;
|
|
background: #008cff;
|
|
border-radius: 5rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
font-size: 32rpx;
|
|
color: #ffffff;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
}
|
|
|
|
.popup {
|
|
.header {
|
|
margin-left: 24rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 800;
|
|
font-size: 42rpx;
|
|
color: #008cff;
|
|
margin-top: 34rpx;
|
|
width: 690rpx;
|
|
}
|
|
|
|
.line-row {
|
|
width: 690rpx;
|
|
height: 1rpx;
|
|
background: #d9d9d9;
|
|
margin: 11rpx 0 31rpx 0;
|
|
}
|
|
|
|
.pop-center {
|
|
margin-top: 50rpx;
|
|
align-items: center;
|
|
width: 650rpx;
|
|
|
|
.left {
|
|
image {
|
|
border-radius: 12rpx;
|
|
}
|
|
}
|
|
|
|
.right {
|
|
margin-left: 30rpx;
|
|
|
|
.title {
|
|
width: 340rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 800;
|
|
font-size: 34rpx;
|
|
color: #343434;
|
|
}
|
|
}
|
|
}
|
|
|
|
.line-short {
|
|
width: 400rpx;
|
|
height: 1rpx;
|
|
background: #d9d9d9;
|
|
margin: 24rpx 0;
|
|
}
|
|
|
|
.popList {
|
|
justify-content: space-between;
|
|
width: 600rpx;
|
|
margin-top: 32rpx;
|
|
|
|
.hei {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
font-size: 26rpx;
|
|
color: #343434;
|
|
}
|
|
}
|
|
|
|
.pop-btn {
|
|
width: 690rpx;
|
|
margin-top: 62rpx;
|
|
justify-content: space-around;
|
|
|
|
.Cancel {
|
|
width: 306rpx;
|
|
height: 80rpx;
|
|
border-radius: 401rpx 401rpx 401rpx 401rpx;
|
|
border: 2rpx solid #008cff;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 800;
|
|
font-size: 34rpx;
|
|
color: #008cff;
|
|
}
|
|
|
|
.Confirm {
|
|
width: 306rpx;
|
|
height: 80rpx;
|
|
background: #008cff;
|
|
border-radius: 401rpx 401rpx 401rpx 401rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 800;
|
|
font-size: 34rpx;
|
|
color: #ffffff;
|
|
}
|
|
}
|
|
}
|
|
|
|
.hui {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
font-size: 24rpx;
|
|
color: #7a7a7a;
|
|
}
|
|
|
|
.white-space {
|
|
overflow: hidden;
|
|
/* 确保超出容器的文本被隐藏 */
|
|
white-space: nowrap;
|
|
/* 确保文本在一行内显示 */
|
|
text-overflow: ellipsis;
|
|
/* 使用省略号表示被截断的文本 */
|
|
}
|
|
.hot {
|
|
// margin-top: 30rpx;
|
|
margin-bottom: 70rpx;
|
|
|
|
.hot-top {
|
|
// padding-bottom: 12rpx;
|
|
// border-bottom: 2rpx solid red;
|
|
.left {
|
|
background-image: url("/static/footer.png");
|
|
background-repeat: no-repeat;
|
|
background-position: bottom;
|
|
|
|
span {
|
|
width: 160rpx;
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: bold;
|
|
font-size: 40rpx;
|
|
color: #222222;
|
|
line-height: 47rpx;
|
|
}
|
|
}
|
|
|
|
.more {
|
|
width: 104rpx;
|
|
height: 40rpx;
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 26rpx;
|
|
color: #222222;
|
|
line-height: 30rpx;
|
|
}
|
|
}
|
|
}
|
|
.content {
|
|
// height: 462rpx;
|
|
// overflow-x: auto;
|
|
/* 允许横向滚动 */
|
|
// white-space: nowrap;
|
|
|
|
width: 690rpx;
|
|
|
|
.bbb {
|
|
background: #ffffff;
|
|
margin-top: 30rpx;
|
|
border-radius: 36rpx;
|
|
}
|
|
|
|
.right {
|
|
margin-left: 24rpx;
|
|
width: 100%;
|
|
|
|
.title {
|
|
width: 95%;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
font-size: 30rpx;
|
|
color: #323232;
|
|
}
|
|
.first-image {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
color: #9c9c9c;
|
|
|
|
span {
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 26rpx;
|
|
color: #222222;
|
|
}
|
|
}
|
|
.row {
|
|
margin: 10rpx 0 26rpx 0;
|
|
|
|
.remen {
|
|
// width: 136rpx;
|
|
height: 40rpx;
|
|
background: #ebfaf5;
|
|
border-radius: 4rpx 4rpx 4rpx 4rpx;
|
|
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
color: #14bc84;
|
|
line-height: 28rpx;
|
|
padding: 2rpx 8rpx;
|
|
}
|
|
|
|
.line-colum {
|
|
width: 1rpx;
|
|
height: 32rpx;
|
|
background: #7a7a7a;
|
|
margin: 0 13rpx;
|
|
}
|
|
|
|
.name {
|
|
width: 110rpx;
|
|
height: 32rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
font-size: 26rpx;
|
|
color: #7a7a7a;
|
|
line-height: 32rpx;
|
|
margin-left: 12rpx;
|
|
}
|
|
}
|
|
|
|
.jigou {
|
|
width: 312rpx;
|
|
// height: 32rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
font-size: 26rpx;
|
|
color: #7a7a7a;
|
|
margin: 4rpx 0 14rpx 0;
|
|
}
|
|
|
|
.time {
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 26rpx;
|
|
color: #323232;
|
|
line-height: 30rpx;
|
|
.time_tex {
|
|
width: 116rpx;
|
|
height: 42rpx;
|
|
background: #bbfc5b;
|
|
border-radius: 159rpx;
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
color: #323232;
|
|
line-height: 42rpx;
|
|
text-align: center;
|
|
}
|
|
}
|
|
.imgs_con {
|
|
width: 202rpx;
|
|
height: 202rpx;
|
|
margin-right: 20rpx;
|
|
&:first-child {
|
|
border-radius: 18rpx 0 0 18rpx;
|
|
}
|
|
&:nth-child(3) {
|
|
border-radius: 0 18rpx 18rpx 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
.bottom {
|
|
margin: 32rpx 0 32rpx 24rpx;
|
|
|
|
width: 626rpx;
|
|
|
|
.number {
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 26rpx;
|
|
color: #3d3d3d;
|
|
line-height: 30rpx;
|
|
width: 242rpx;
|
|
margin-left: 20rpx;
|
|
}
|
|
|
|
.text {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 800;
|
|
font-size: 26rpx;
|
|
color: #7a7a7a;
|
|
}
|
|
|
|
.money {
|
|
width: 150rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 800;
|
|
font-size: 36rpx;
|
|
color: #ff2323;
|
|
justify-content: flex-end;
|
|
}
|
|
}
|
|
|
|
.ovr {
|
|
width: 312rpx;
|
|
background: #ffffff;
|
|
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
|
margin-top: 18rpx;
|
|
margin-right: 24rpx;
|
|
}
|
|
}
|
|
.part {
|
|
width: 180rpx;
|
|
height: 70rpx;
|
|
background: url(@/static/index/shangche.png);
|
|
background-size: 168rpx 70rpx;
|
|
font-family: "YouSheBiaoTiHei";
|
|
font-weight: 400;
|
|
font-size: 42rpx;
|
|
color: #bbfc5b;
|
|
}
|
|
</style>
|