965 lines
25 KiB
Vue
965 lines
25 KiB
Vue
<template>
|
||
<div class="main">
|
||
<div class="tabBox">
|
||
<div
|
||
:class="selectTab === item.value ? 'selectTab' : 'tabItem'"
|
||
v-for="(item, index) in tabList"
|
||
:key="index"
|
||
@click="handleChangeSelectTab(item.value)"
|
||
>
|
||
{{ item.label || "-" }}
|
||
</div>
|
||
</div>
|
||
|
||
<div class="content">
|
||
<div
|
||
class="contentFirst"
|
||
v-if="
|
||
selectTab === 1 ||
|
||
selectTab === 2 ||
|
||
selectTab === 4 ||
|
||
selectTab === 5
|
||
"
|
||
>
|
||
<div class="orderList" v-if="orderList && orderList.length > 0">
|
||
<div
|
||
class="orderItem"
|
||
v-for="(item, index) in orderList"
|
||
:key="index"
|
||
@click="goOrderDetail(item)"
|
||
>
|
||
<div class="topItem">
|
||
<div class="shopIconBox">
|
||
<image
|
||
class="shopIcon"
|
||
:src="
|
||
item.SHOPDOORIMG ||
|
||
'https://eshangtech.com/ShopICO/no-picture.png'
|
||
"
|
||
/>
|
||
</div>
|
||
<div class="messageBox">
|
||
<div class="nameBox">
|
||
{{ item.SHOPNAME || "-" }}
|
||
<span class="notice" v-if="item.TAKE_TYPE === 2000">预</span>
|
||
</div>
|
||
<div class="time">{{ item.ORDER_DATE || "-" }}</div>
|
||
</div>
|
||
<div class="statusBox">{{ item.SALEBILL_STATE_TEXT || "-" }}</div>
|
||
</div>
|
||
|
||
<div class="shopList">
|
||
<scroll-view class="shopLeftList" :scroll-x="true">
|
||
<div
|
||
class="leftShopItem"
|
||
v-for="(item, index) in item.GOODSList"
|
||
:key="index"
|
||
>
|
||
<image
|
||
class="leftShopImg"
|
||
:src="
|
||
item.IMAGE_URL ||
|
||
'https://eshangtech.com/ShopICO/no-picture.png'
|
||
"
|
||
/>
|
||
<span class="shopName">{{ item.COMMODITY_NAME }}</span>
|
||
</div>
|
||
</scroll-view>
|
||
|
||
<div class="shopRightList">
|
||
<div class="priceBox">
|
||
<span class="unit">¥</span>
|
||
<span class="money">{{ item.ORDER_AMOUNT || "-" }}</span>
|
||
</div>
|
||
<div class="orderCount">共{{ item.RECORD_COUNT || "-" }}件</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="commentBox">
|
||
<div
|
||
class="commentItem"
|
||
@click.stop="goEvaluate(item)"
|
||
v-if="
|
||
item.COMMENT_STATE === 0 &&
|
||
item.SALEBILL_STATE !== 1010 &&
|
||
item.SALEBILL_STATE >= 3000 && item.SALEBILL_STATE < 8000
|
||
"
|
||
>
|
||
评价得积分
|
||
</div>
|
||
<div
|
||
class="commentItem"
|
||
@click="goOrderDetail(item)"
|
||
v-if="item.SALEBILL_STATE === 1005"
|
||
>
|
||
去支付
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="orderList" v-if="!(orderList && orderList.length > 0)">
|
||
<no-data text="暂无数据" :isShow="true"></no-data>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="contentLast" v-if="selectTab === 3">
|
||
<template v-if="myEvaluation && myEvaluation.length > 0">
|
||
<div
|
||
class="myEvaluate"
|
||
v-for="(item, index) in myEvaluation"
|
||
:key="index"
|
||
>
|
||
<div class="evaluateTop">
|
||
<div class="evaluateLeft">
|
||
<image class="shopIcon" />
|
||
<span class="shopName"></span>
|
||
<span class="timeText"></span>
|
||
</div>
|
||
<div class="evaluateRight">
|
||
<image
|
||
class="deleteIcon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/deleteIcon.png"
|
||
/>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="rateBox">
|
||
<uni-rate
|
||
:size="12"
|
||
allowHalf
|
||
v-model="saveMsg.commentScore"
|
||
@change="changeRate($event, saveMsg)"
|
||
/>
|
||
<span class="rateText"></span>
|
||
</div>
|
||
|
||
<div class="contentText"></div>
|
||
|
||
<div class="imgListBox">
|
||
<div class="imgItem"></div>
|
||
</div>
|
||
|
||
<div class="shopText">
|
||
<div class="shopTextTitle">商家回复：</div>
|
||
<div class="shopText"></div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
<template v-if="!(myEvaluation && myEvaluation.length > 0)">
|
||
<no-data text="暂无数据" :isShow="true" />
|
||
</template>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="order" v-if="false">
|
||
<div
|
||
class="order-list"
|
||
v-for="(item, index) in orderList"
|
||
:key="index"
|
||
@click="goOrderDetail(item)"
|
||
>
|
||
<div class="order-top">
|
||
<div class="img-box">
|
||
<image
|
||
class="order-img"
|
||
mode="aspectFit"
|
||
lazy-load="true"
|
||
:src="
|
||
item.SHOPDOORIMG ||
|
||
'https://eshangtech.com/ShopICO/no-picture.png'
|
||
"
|
||
></image>
|
||
</div>
|
||
<div class="order-top-right">
|
||
<div
|
||
style="
|
||
display: flex;
|
||
align-item: center;
|
||
justify-content: space-between;
|
||
"
|
||
>
|
||
<div class="order-name-box" @click.stop="goShop(item)">
|
||
<div class="order-name">{{ item.SHOPNAME }}</div>
|
||
<van-icon name="arrow" size="24rpx" />
|
||
</div>
|
||
<span
|
||
class="order-price"
|
||
:class="{ appoint: item.TAKE_TYPE === 2000 }"
|
||
>{{ item.SALEBILL_STATE_TEXT }}</span
|
||
>
|
||
</div>
|
||
|
||
<div class="order-date">
|
||
<span>{{ item.ORDER_DATE }}</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div
|
||
style="
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin-top: 16rpx;
|
||
padding-right: 24rpx;
|
||
"
|
||
>
|
||
<div class="order-goods">
|
||
{{ item.COMMODITY_NAME }}
|
||
<span v-show="item.RECORD_COUNT > 1">
|
||
等{{ item.RECORD_COUNT }}种商品</span
|
||
>
|
||
</div>
|
||
<span class="order-price">￥{{ item.ORDER_AMOUNT }}</span>
|
||
</div>
|
||
<div class="order-btn-box">
|
||
<span class="order-btn" v-if="item.SALEBILL_STATE === 1005"
|
||
>去付款</span
|
||
>
|
||
<block v-else>
|
||
<!-- <span class="order-btn" @click.stop="goShop(item)" >再来一单</span> -->
|
||
<span
|
||
class="advice-btn"
|
||
@click.stop="goEvaluate(item)"
|
||
v-if="item.COMMENT_STATE === 0 && item.SALEBILL_STATE !== 1010"
|
||
>评价得积分</span
|
||
>
|
||
</block>
|
||
</div>
|
||
</div>
|
||
<no-data
|
||
:text="'您没有订单记录'"
|
||
:isShow="!(orderList && orderList.length > 0)"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import noData from "@/components/noData.vue";
|
||
import { mapMutations, mapGetters } from "vuex";
|
||
import NoData from "../../../components/noData.vue";
|
||
export default {
|
||
data() {
|
||
return {
|
||
pageMsg: {
|
||
isLoading: false,
|
||
pageSize: 10,
|
||
pageIndex: 1,
|
||
},
|
||
orderList: [],
|
||
tabList: [
|
||
{
|
||
label: "全部",
|
||
value: 1,
|
||
},
|
||
{
|
||
label: "待付款",
|
||
value: 2,
|
||
},
|
||
{
|
||
label: "待制作",
|
||
value: 3,
|
||
},
|
||
{
|
||
label: "待取餐",
|
||
value: 4,
|
||
},
|
||
{
|
||
label: "待评价",
|
||
value: 5,
|
||
},
|
||
],
|
||
allList: [], // [0] 全部 [1] // 待评价
|
||
selectTab: 1,
|
||
myEvaluation: [], // 我的评价
|
||
searchType: "",
|
||
};
|
||
},
|
||
components: {
|
||
noData,
|
||
},
|
||
computed: {
|
||
...mapGetters(["user", "refresh"]),
|
||
},
|
||
methods: {
|
||
...mapMutations({
|
||
setIsLoading: "setIsLoading",
|
||
setFresh: "refresh",
|
||
}),
|
||
handleChangeSelectTab(value) {
|
||
this.selectTab = value;
|
||
this.orderList = [];
|
||
let type =
|
||
this.selectTab === 1
|
||
? "1005,1010,2010,3000"
|
||
: this.selectTab === 2
|
||
? "1005"
|
||
: this.selectTab === 3
|
||
? "1010"
|
||
: this.selectTab === 4
|
||
? "2010"
|
||
: this.selectTab === 5
|
||
? "3000"
|
||
: "";
|
||
this.handleGetOrderList(type);
|
||
},
|
||
getorderList() {
|
||
let _this = this;
|
||
uni.showLoading({
|
||
title: "加载中...",
|
||
});
|
||
_this.$api
|
||
.getCoop({
|
||
action_type: "GetOrderList",
|
||
salebillType: 6000,
|
||
PageIndex: 1,
|
||
pageSize: 999999,
|
||
})
|
||
.then((res) => {
|
||
if (res.ResultCode === "100") {
|
||
if (_this.pageMsg.pageIndex === 1) {
|
||
_this.orderList = res.Data.List;
|
||
} else {
|
||
_this.orderList = _this.orderList.concat(res.Data.List);
|
||
}
|
||
|
||
if (res.Data.TotalCount > _this.orderList.length) {
|
||
_this.pageMsg.isLoadMore = true;
|
||
} else {
|
||
_this.pageMsg.isLoadMore = false;
|
||
}
|
||
} else {
|
||
_this.orderList = [];
|
||
}
|
||
|
||
let allList = [_this.orderList, []];
|
||
let otherList = [];
|
||
if (_this.orderList && _this.orderList.length > 0) {
|
||
_this.orderList.forEach((item) => {
|
||
if (item.COMMENT_STATE === 0) {
|
||
otherList.push(item);
|
||
}
|
||
});
|
||
}
|
||
allList[1] = otherList;
|
||
_this.allList = allList;
|
||
_this.orderList = allList[_this.selectTab - 1];
|
||
|
||
console.log("_this.orderList", _this.orderList);
|
||
|
||
this.setIsLoading(false);
|
||
uni.hideLoading();
|
||
});
|
||
},
|
||
goShop(item) {
|
||
// let arr = {
|
||
// id: item.SERVERPARTSHOP_ID,
|
||
// shopName: item.SHOPNAME,
|
||
// serverpartId: item.SERVERPART_ID
|
||
|
||
// }
|
||
// this.$store.commit('nowStore', arr)
|
||
this.$store.commit("setprovinceCode", item.PROVINCE_CODE);
|
||
uni.navigateTo({
|
||
url:
|
||
"/pages/shopPages/shop/index?id=" +
|
||
item.SERVERPARTSHOP_ID +
|
||
"&mid=" +
|
||
item.MERCHANTS_ID,
|
||
});
|
||
},
|
||
goEvaluate(item) {
|
||
uni.navigateTo({
|
||
url:
|
||
"/pages/newEvaluate/index?merchantsId=" +
|
||
item.MERCHANTS_ID +
|
||
"&saleBillId=" +
|
||
item.SALEBILL_ID,
|
||
});
|
||
},
|
||
goOrderDetail(item) {
|
||
uni.navigateTo({
|
||
url: `/pages/orders/orderdetail/index?orderInternal=${item.SALEBILL_ID}`,
|
||
});
|
||
// uni.navigateTo({
|
||
// url:
|
||
// "/pages/orders/orderdetail/index?orderNumber=" +
|
||
// item.SALEBILL_CODE +
|
||
// "&orderInternal=" +
|
||
// item.SALEBILL_ID,
|
||
// });
|
||
},
|
||
// 请求我的评价列表
|
||
handleGetOurEvaluateList() {
|
||
this.$api
|
||
.getCoop({
|
||
action_type: "GetCommentList",
|
||
pageSize: 999999,
|
||
pageIndex: 1,
|
||
})
|
||
.then((res) => {
|
||
console.log("handleGetOurEvaluateList", res);
|
||
});
|
||
},
|
||
// 拿到点餐列表
|
||
async handleGetOrderList(status) {
|
||
let _this = this;
|
||
uni.showLoading({
|
||
title: "加载中...",
|
||
});
|
||
const req = {
|
||
action_type: "GetOrderList",
|
||
salebillType: 6000,
|
||
salebillState: status || "",
|
||
PageIndex: this.pageMsg.pageIndex,
|
||
pageSize: this.pageMsg.pageSize,
|
||
ownerUnitId: 911,
|
||
requestType: "application/x-www-form-urlencoded",
|
||
};
|
||
const res = await this.$api.postCoop(req);
|
||
|
||
if (res.ResultCode === "100") {
|
||
if (_this.pageMsg.pageIndex === 1) {
|
||
_this.orderList = res.Data.List;
|
||
} else {
|
||
_this.orderList = _this.orderList.concat(res.Data.List);
|
||
}
|
||
|
||
if (res.Data.TotalCount > _this.orderList.length) {
|
||
_this.pageMsg.isLoadMore = true;
|
||
} else {
|
||
_this.pageMsg.isLoadMore = false;
|
||
}
|
||
} else {
|
||
_this.orderList = [];
|
||
}
|
||
|
||
console.log("_this.orderList", _this.orderList);
|
||
|
||
this.setIsLoading(false);
|
||
uni.hideLoading();
|
||
},
|
||
},
|
||
onPullDownRefresh() {
|
||
// this.orderList = []
|
||
this.pageMsg.pageIndex = 1;
|
||
// this.setIsLoading(true)
|
||
// this.getorderList();
|
||
setTimeout(function () {
|
||
uni.stopPullDownRefresh();
|
||
}, 1000);
|
||
},
|
||
onShow() {
|
||
// this.orderList = []
|
||
this.pageMsg.pageIndex = 1;
|
||
// this.getorderList();
|
||
this.setIsLoading(true);
|
||
// this.handleGetOurEvaluateList();
|
||
},
|
||
onLoad(query) {
|
||
if (query.type) {
|
||
this.searchType = query.type;
|
||
this.selectTab = Number(this.searchType)
|
||
}
|
||
let type =
|
||
this.selectTab === 1
|
||
? "1005,1010,2010,3000"
|
||
: this.selectTab === 2
|
||
? "1005"
|
||
: this.selectTab === 3
|
||
? "1010"
|
||
: this.selectTab === 4
|
||
? "2010"
|
||
: this.selectTab === 5
|
||
? "3000"
|
||
: "";
|
||
// 获取订单数据
|
||
this.handleGetOrderList(type);
|
||
// this.orderList = []
|
||
// this.pageMsg.pageIndex = 1
|
||
// this.setIsLoading(true)
|
||
// this.getorderList()
|
||
},
|
||
onReachBottom() {
|
||
if (this.pageMsg.isLoadMore) {
|
||
this.pageMsg.pageIndex += 1;
|
||
this.getorderList();
|
||
}
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="less" scoped>
|
||
// bodyColor = #C6A376;
|
||
|
||
.main {
|
||
width: 100vw;
|
||
height: 100vh;
|
||
background: #fff;
|
||
.tabBox {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
display: flex;
|
||
align-items: center;
|
||
padding: 16rpx 0 0;
|
||
border-bottom: 1px solid #f6f6f6;
|
||
.tabItem {
|
||
width: calc(100% / 3);
|
||
height: 58rpx;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #716f69;
|
||
line-height: 40rpx;
|
||
text-align: center;
|
||
font-style: normal;
|
||
}
|
||
.selectTab {
|
||
width: calc(100% / 3);
|
||
height: 58rpx;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #130f05;
|
||
line-height: 40rpx;
|
||
text-align: center;
|
||
font-style: normal;
|
||
position: relative;
|
||
}
|
||
.selectTab::after {
|
||
content: "";
|
||
position: absolute;
|
||
bottom: 0;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
width: 2rem;
|
||
height: 6rpx;
|
||
background: #ba922f;
|
||
}
|
||
}
|
||
|
||
.content {
|
||
width: 100%;
|
||
height: calc(100vh - 76rpx);
|
||
overflow-y: auto;
|
||
box-sizing: border-box;
|
||
padding: 32rpx;
|
||
.contentFirst {
|
||
width: 100%;
|
||
.orderList {
|
||
width: 100%;
|
||
.orderItem {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding-bottom: 40rpx;
|
||
border-bottom: 1px solid #f0f0f0;
|
||
margin-bottom: 40rpx;
|
||
.topItem {
|
||
display: flex;
|
||
align-items: center;
|
||
padding: 2rpx 0;
|
||
position: relative;
|
||
.shopIconBox {
|
||
width: 80rpx;
|
||
height: 80rpx;
|
||
border-radius: 6rpx;
|
||
overflow: hidden;
|
||
margin-right: 16rpx;
|
||
.shopIcon {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
.messageBox {
|
||
width: calc(100% - 180rpx);
|
||
.nameBox {
|
||
width: 100%;
|
||
text-overflow: ellipsis;
|
||
overflow: hidden;
|
||
white-space: nowrap;
|
||
.notice {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #ba922f;
|
||
line-height: 32rpx;
|
||
text-align: center;
|
||
font-style: normal;
|
||
padding: 0 8rpx;
|
||
background: #fef7e5;
|
||
border-radius: 2rpx;
|
||
margin-left: 12rpx;
|
||
}
|
||
}
|
||
.time {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #716f69;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-top: 4rpx;
|
||
}
|
||
}
|
||
.statusBox {
|
||
position: absolute;
|
||
right: 0;
|
||
top: 0;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #716f69;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
|
||
.shopList {
|
||
width: 100%;
|
||
margin-top: 24rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
.shopLeftList {
|
||
width: calc(100% - 112rpx);
|
||
white-space: nowrap;
|
||
.leftShopItem {
|
||
display: inline-block;
|
||
width: 136rpx;
|
||
margin-right: 16rpx;
|
||
.leftShopImg {
|
||
width: 168rpx;
|
||
height: 128rpx;
|
||
border-radius: 6rpx;
|
||
margin-bottom: 8rpx;
|
||
margin-right: 16rpx;
|
||
}
|
||
.shopName {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #716f69;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
display: block;
|
||
width: 100%;
|
||
white-space: nowrap;
|
||
text-overflow: ellipsis;
|
||
overflow: hidden;
|
||
}
|
||
}
|
||
}
|
||
.shopLeftList::-webkit-scrollbar {
|
||
display: none;
|
||
}
|
||
|
||
.shopRightList {
|
||
width: 112rpx;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-end;
|
||
.priceBox {
|
||
.unit {
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-weight: bold;
|
||
font-size: 24rpx;
|
||
color: #090c1a;
|
||
line-height: 24rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-right: 4rpx;
|
||
}
|
||
.money {
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-weight: bold;
|
||
font-size: 36rpx;
|
||
color: #130f05;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
.orderCount {
|
||
margin-top: 8rpx;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #716f69;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
|
||
.commentBox {
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
.commentItem {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #ba922f;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
padding: 10rpx 12rpx;
|
||
border-radius: 6rpx;
|
||
border: 2rpx solid #ba922f;
|
||
}
|
||
}
|
||
}
|
||
.orderItem:last-child {
|
||
border-bottom: 0px solid #f0f0f0;
|
||
}
|
||
}
|
||
}
|
||
|
||
.contentLast {
|
||
.myEvaluate {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding-bottom: 40rpx;
|
||
border-bottom: 2rpx solid #f0f0f0;
|
||
.evaluateTop {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
.evaluateLeft {
|
||
.shopIcon {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
margin-right: 12rpx;
|
||
}
|
||
.shopName {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 32rpx;
|
||
color: #130f05;
|
||
line-height: 44rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
display: inline-block;
|
||
width: 250rpx;
|
||
text-overflow: ellipsis;
|
||
overflow: hidden;
|
||
white-space: nowrap;
|
||
margin-right: 24rpx;
|
||
}
|
||
.timeText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #716f69;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: norma;
|
||
}
|
||
}
|
||
.evaluateRight {
|
||
.deleteIcon {
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.rateBox {
|
||
width: 100%;
|
||
margin-top: 16rpx;
|
||
.rateText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #716f69;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-left: 6rpx;
|
||
}
|
||
}
|
||
|
||
.contentText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #130f05;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.imgListBox {
|
||
width: 100%;
|
||
margin-top: 16rpx;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
.imgItem {
|
||
width: 160rpx;
|
||
height: 160rpx;
|
||
border-radius: 8rpx;
|
||
margin-right: 16rpx;
|
||
.img {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
}
|
||
|
||
.shopText {
|
||
width: 100%;
|
||
background: #f5f6f7;
|
||
border-radius: 2rpx;
|
||
padding: 16rpx 24rpx;
|
||
.shopTextTitle {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #716f69;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
.shopText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #716f69;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.content::-webkit-scrollbar {
|
||
display: none;
|
||
}
|
||
}
|
||
|
||
.order-list {
|
||
box-sizing: border-box;
|
||
padding: 30rpx 0 0rpx 32rpx;
|
||
background: #ffffff;
|
||
}
|
||
|
||
.order-top {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
font-size: 24rpx;
|
||
padding-right: 24rpx;
|
||
align-items: center;
|
||
}
|
||
|
||
.img-box {
|
||
flex: 0.1;
|
||
}
|
||
|
||
.order-img {
|
||
width: 80rpx;
|
||
height: 80rpx;
|
||
background: #fff;
|
||
}
|
||
|
||
.order-top-right {
|
||
// display flex
|
||
flex: 0.9;
|
||
// justify-content space-between
|
||
margin-left: 20rpx;
|
||
// padding-bottom 25rpx
|
||
box-sizing: border-box;
|
||
// border-bottom 2rpx solid #ddd
|
||
}
|
||
|
||
.order-name-box {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
margin-bottom: 6rpx;
|
||
}
|
||
|
||
.order-name {
|
||
font-size: 30rpx;
|
||
color: #383838;
|
||
margin-right: 20rpx;
|
||
// width 400rpx
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.appoint {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.appoint:after {
|
||
content: "预";
|
||
padding: 0 4rpx;
|
||
font-size: 20rpx;
|
||
height: 24rpx;
|
||
line-height: 24rpx;
|
||
margin-left: 16rpx;
|
||
font-weight: normal;
|
||
color: #fff;
|
||
border-radius: 4rpx;
|
||
background: #f5ba4f;
|
||
}
|
||
|
||
.order-date {
|
||
color: #a4a5a8;
|
||
line-height: 30rpx;
|
||
}
|
||
|
||
.order-goods {
|
||
padding-left: 104rpx;
|
||
color: #383838;
|
||
font-size: 24rpx;
|
||
}
|
||
|
||
.order-price {
|
||
color: #333;
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
.order-btn-box {
|
||
border-bottom: 1rpx solid #eee;
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
padding: 24rpx 24rpx 24rpx 0;
|
||
}
|
||
|
||
.order-btn {
|
||
color: #dc615a;
|
||
border: 2rpx solid #dc615a;
|
||
text-align: center;
|
||
border-radius: 6rpx;
|
||
font-size: 24rpx;
|
||
width: 158rpx;
|
||
height: 56rpx;
|
||
line-height: 56rpx;
|
||
}
|
||
|
||
.advice-btn {
|
||
color: bodyColor;
|
||
border: 2rpx solid bodyColor;
|
||
text-align: center;
|
||
border-radius: 6rpx;
|
||
font-size: 24rpx;
|
||
padding: 0 16rpx;
|
||
height: 56rpx;
|
||
line-height: 56rpx;
|
||
}
|
||
|
||
.order-btn + .advice-btn {
|
||
margin-left: 32rpx;
|
||
}
|
||
</style>
|