@ -0,0 +1,161 @@ | |||
<template> | |||
<view class="selectEssentialOil"> | |||
<van-popup v-model:show="showBottom" round position="bottom" @close="close" :style="{ height: '75%' }"> | |||
<view class="box"> | |||
<view class="title"> | |||
{{ title || '选择精油' }} | |||
</view> | |||
<view class="technician-list"> | |||
<van-list v-model:loading="loading" :finished="finished" @load="onLoad"> | |||
<view class="EssentialOil-list"> | |||
<view @click="select(item)" v-for="item in essentialOilList" :key="item.key" class="EssentialOil-item"> | |||
<view class="img-box"> | |||
<image :src="item.path" mode="aspectFill"></image> | |||
</view> | |||
<view class="name-price"> | |||
<view class="name">{{ item.name }}</view> | |||
<view class="price">¥{{ item.price }}</view> | |||
</view> | |||
</view> | |||
</view> | |||
</van-list> | |||
</view> | |||
</view> | |||
</van-popup> | |||
</view> | |||
</template> | |||
<script> | |||
export default { | |||
data() { | |||
return { | |||
showBottom : false, | |||
essentialOilList : [ | |||
{ id : 1 , path : '/static/test/精油.png' , name : '精油1' , price : 600 }, | |||
{ id : 2 , path : '/static/test/精油1.png' , name : '精油2' , price : 660 }, | |||
{ id : 3 , path : '/static/test/精油2.png' , name : '精油3' , price : 888 }, | |||
{ id : 4 , path : '/static/test/精油3.png' , name : '精油4' , price : 999 }, | |||
], | |||
loading : false, | |||
finished : true | |||
} | |||
}, | |||
props : ['show', 'title'], | |||
created(){ | |||
this.getEssentialOil() | |||
}, | |||
methods: { | |||
//获取精油列表 | |||
getEssentialOil(){ | |||
this.loading = false; | |||
this.finished = true; | |||
console.log('获取精油列表'); | |||
}, | |||
//用户选择了精油 | |||
select(e){ | |||
this.$emit('select', e) | |||
}, | |||
//关闭弹窗 | |||
close(){ | |||
this.$emit('close') | |||
}, | |||
//滑动到屏幕底部触发(分页) | |||
onLoad(){ | |||
// this.queryParams.pageSize += 10 | |||
// this.getEssentialOil() | |||
} | |||
}, | |||
watch: { | |||
show: { | |||
handler (newValue, oldValue) { | |||
this.showBottom = newValue | |||
this.getEssentialOil() | |||
}, | |||
immediate: true | |||
} | |||
} | |||
} | |||
</script> | |||
<style lang="scss" scoped> | |||
.selectEssentialOil { | |||
.box { | |||
width: 100%; | |||
height: 100%; | |||
background: #F1B8BD; | |||
box-sizing: border-box; | |||
padding: 40rpx; | |||
.title { | |||
font-size: 32rpx; | |||
text-align: center; | |||
color: #fff; | |||
margin-bottom: 40rpx; | |||
} | |||
.technician-list { | |||
overflow: auto; | |||
width: 100%; | |||
height: calc(100% - 45rpx); | |||
} | |||
.EssentialOil-list{ | |||
display: flex; | |||
flex-wrap: wrap; | |||
.EssentialOil-item{ | |||
width: calc(50% - 15rpx); | |||
background: #fff; | |||
padding: 20rpx; | |||
margin-right: 15rpx; | |||
flex-shrink: 0; | |||
margin-bottom: 20rpx; | |||
border-radius: 10rpx; | |||
box-sizing: border-box; | |||
.img-box{ | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
width: 100%; | |||
aspect-ratio: 1 / 1; /* 设置宽高比为1:1 */ | |||
image{ | |||
width: 100%; | |||
height: 100%; | |||
} | |||
} | |||
.name-price{ | |||
.name{ | |||
font-size: 30rpx; | |||
white-space: nowrap; | |||
overflow: hidden; | |||
text-overflow: ellipsis; | |||
color: #666; | |||
margin: 20rpx; | |||
} | |||
.price{ | |||
color: red; | |||
} | |||
} | |||
&:nth-child(2n){ | |||
margin-right: 0rpx; | |||
} | |||
} | |||
} | |||
} | |||
} | |||
</style> |
@ -0,0 +1,56 @@ | |||
import { showConfirmDialog } from 'vant'; | |||
export default { | |||
methods : { | |||
//再来一单 | |||
moreOrder(projectId,successCallback) { | |||
this.$api('getProjectDetail', { | |||
id: projectId | |||
}, res => { | |||
if (res.code == 200) { | |||
successCallback && successCallback(res,projectId) | |||
} | |||
}) | |||
}, | |||
//立即评价 | |||
toEvaluate(id,projectId) { | |||
uni.navigateTo({ | |||
url: '/pages/order/evaluate?id=' + id + '&projectId=' + projectId | |||
}) | |||
}, | |||
//取消订单 | |||
calcelOrder(orderId,successCallback) { | |||
showConfirmDialog({ | |||
title: '取消订单', | |||
message: '确认取消订单?', | |||
}).then(() => { | |||
this.$api('cancelVipOrder', { | |||
orderId | |||
}, res => { | |||
if (res.code == 200) { | |||
successCallback && successCallback() | |||
} | |||
}) | |||
}).catch(() => {}); | |||
}, | |||
//立即支付 | |||
toPayOrder(item) { | |||
this.$api('immediatelyPay', { | |||
addressId: item.addressId, | |||
couponId: item.couponId, | |||
orderId: item.id, | |||
payType: item.payType, | |||
remark: item.remark, | |||
serviceTime: item.serviceTime | |||
}, res => { | |||
if (res.code == 200) { | |||
this.$wxPay(res, this.getOrderList, this.getOrderList) | |||
} | |||
}) | |||
}, | |||
} | |||
} |
@ -0,0 +1,226 @@ | |||
<!-- 投诉建议 --> | |||
<template> | |||
<view class="complain"> | |||
<mNavbar title="投诉建议" :leftClick="leftClick"></mNavbar> | |||
<view class="content"> | |||
<view class="c-input"> | |||
<textarea v-model="form.suggestion" :maxlength="maxNum" @input="GetNumber" | |||
placeholder="请输入投诉/建议的内容....."></textarea> | |||
<view class="input-num">{{ inputNum }} / {{ maxNum }}</view> | |||
</view> | |||
<view class="c-input"> | |||
<input v-model="remark" type="text" placeholder="备注(选填)" /> | |||
</view> | |||
<!-- 上传图片 --> | |||
<view class="upload"> | |||
<view class="upload-title">上传图片/视频</view> | |||
<view class="image-list"> | |||
<view @click="selectImg(item)" v-for="(item,index) in form.images" class="image-item"> | |||
<image :src="item" mode=""></image> | |||
</view> | |||
<view @click="fileUploads" v-if="uploadNum < maxUploadNum" class="add-img-btn"> | |||
<image src="/static/complain/img.png" mode="scaleToFill"></image> | |||
</view> | |||
</view> | |||
</view> | |||
</view> | |||
<view class="add-btn"> | |||
<view @click="complain" class="btn"> | |||
提交审核 | |||
</view> | |||
</view> | |||
<van-action-sheet v-model:show="show" :actions="actions" @select="selectionOperation" /> | |||
</view> | |||
</template> | |||
<script> | |||
import mNavbar from '@/components/base/m-navbar.vue' | |||
import { showImagePreview } from 'vant'; | |||
export default { | |||
components: { | |||
mNavbar | |||
}, | |||
data() { | |||
return { | |||
maxNum: 600, //最大输入字数 | |||
inputNum: 0, //已输入的字数 | |||
form: { | |||
suggestion: '', //投诉建议,内容 | |||
images : [], | |||
remark : '' | |||
}, | |||
actions: [{ | |||
index : 0, | |||
name: '查看图片' | |||
}, | |||
{ | |||
index : 1, | |||
name: '删除图片' | |||
} | |||
], | |||
show : false, | |||
maxUploadNum : 5, //最大上传5张 | |||
currentImg : null, //用户点击的图片 | |||
uploadNum : 0, //已上传张数 | |||
} | |||
}, | |||
methods: { | |||
//返回个人中心 | |||
leftClick() { | |||
uni.switchTab({ | |||
url: '/pages/index/center' | |||
}) | |||
}, | |||
//获取输入字数 | |||
GetNumber(e) { | |||
this.inputNum = e.detail.cursor; | |||
}, | |||
//投诉 | |||
complain() { | |||
}, | |||
//用户选择查看图片或者删除图片 | |||
selectionOperation(item){ | |||
let { index } = item | |||
if(index){ | |||
this.removeImg() | |||
}else{ | |||
this.viewImg() | |||
} | |||
}, | |||
//图片列表删除一张图片 | |||
removeImg(){ | |||
this.form.images = this.form.images.filter(item => { | |||
return item != this.currentImg | |||
}) | |||
this.show = false | |||
this.uploadNum = this.form.images.length | |||
}, | |||
//查看图片 | |||
viewImg(){ | |||
showImagePreview([this.currentImg]); | |||
}, | |||
//选择图片 | |||
selectImg(item){ | |||
this.show = true; | |||
this.currentImg = item; | |||
}, | |||
//图片上传 | |||
fileUploads() { | |||
uni.chooseImage({ | |||
count: 1, // 默认9,设置为1表示单选 | |||
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有 | |||
sourceType: ['album'], // 可以指定来源是相册还是相机,默认二者都有 | |||
success: (res) => { | |||
let resultPromise = []; | |||
//上传单张图片逻辑 | |||
this.uploadFileToOSS(res.tempFiles[0]).then(imgPath => { | |||
this.form.images.push(imgPath) | |||
this.uploadNum++ | |||
}) | |||
} | |||
}); | |||
}, | |||
} | |||
} | |||
</script> | |||
<style lang="scss" scoped> | |||
.complain { | |||
.content { | |||
width: 96%; | |||
margin: 0rpx auto; | |||
padding-bottom: 80rpx; | |||
.c-input { | |||
background: #F6F6F6; | |||
border-radius: 20rpx; | |||
margin-top: 20rpx; | |||
box-sizing: border-box; | |||
padding: 40rpx; | |||
textarea { | |||
width: 100%; | |||
} | |||
.input-num { | |||
text-align: right; | |||
color: #BCB7B7; | |||
font-size: 22rpx; | |||
} | |||
} | |||
.upload { | |||
.upload-title { | |||
margin: 30rpx 0rpx; | |||
} | |||
.image-list { | |||
display: flex; | |||
flex-wrap: wrap; | |||
justify-content: space-between; | |||
.image-item, | |||
.add-img-btn { | |||
width: calc(375rpx - 10px); | |||
height: calc(375rpx - 10px); | |||
overflow: hidden; | |||
border-radius: 20rpx; | |||
box-sizing: border-box; | |||
border: 2px dashed #ccc; | |||
margin-bottom: 25rpx; | |||
image { | |||
width: calc(375rpx - 10px); | |||
height: calc(375rpx - 10px); | |||
} | |||
} | |||
} | |||
} | |||
} | |||
.add-btn { | |||
position: fixed; | |||
display: flex; | |||
justify-content: center; | |||
align-items: center; | |||
left: 0; | |||
bottom: 0; | |||
width: 750rpx; | |||
height: 100rpx; | |||
background: white; | |||
.btn { | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
width: 85%; | |||
height: 80rpx; | |||
border-radius: 40rpx; | |||
color: white; | |||
text-align: center; | |||
font-size: 28rpx; | |||
background: #EF8C94; | |||
} | |||
} | |||
} | |||
</style> |
@ -0,0 +1,70 @@ | |||
<!-- 我的评价 --> | |||
<template> | |||
<view class="evaluate"> | |||
<mNavbar title="我的评价" :leftClick="leftClick"></mNavbar> | |||
<van-list v-if="reviewList.length > 0" v-model:loading="loading" :finished="finished" finished-text="没有更多了" | |||
@load="onLoad"> | |||
<reviewListVue :list="reviewList"></reviewListVue> | |||
</van-list> | |||
<van-empty v-else image="/static/empty/record.png" image-size="400rpx" description="暂无评论" /> | |||
</view> | |||
</template> | |||
<script> | |||
import mNavbar from '@/components/base/m-navbar.vue' | |||
import reviewListVue from '@/components/review/reviewList/reviewList.vue' | |||
export default { | |||
components: { | |||
mNavbar, | |||
reviewListVue | |||
}, | |||
data() { | |||
return { | |||
loading : false, | |||
finished : false, | |||
reviewList : [], | |||
} | |||
}, | |||
onShow(){ | |||
this.getReview() | |||
}, | |||
methods: { | |||
//返回个人中心 | |||
leftClick() { | |||
uni.switchTab({ | |||
url: '/pages/index/center' | |||
}) | |||
}, | |||
//滑动到屏幕底部 | |||
onLoad(){ | |||
this.queryParams.pageSize += 10; | |||
this.getReview() | |||
}, | |||
//获取评论 | |||
getReview(index) { | |||
this.loading = true | |||
this.$api('getCommentList', this.queryParams, res => { | |||
if (res.code == 200) { | |||
this.reviewList = res.result; | |||
// if(res.result.total > this.queryParams.pageSize){ | |||
// this.finished = true; | |||
// } | |||
this.finished = true; | |||
this.loading = false; | |||
} | |||
}) | |||
}, | |||
} | |||
} | |||
</script> | |||
<style lang="scss" scoped> | |||
.evaluate {} | |||
</style> |
@ -0,0 +1,221 @@ | |||
<!-- 消息通知 --> | |||
<template> | |||
<view class="message"> | |||
<mNavbar title="消息通知" :leftClick="leftClick"></mNavbar> | |||
<!-- 新人礼包 --> | |||
<view class="message-top content"> | |||
<image src="/static/message/message-icon.png" mode="widthFix"></image> | |||
<view class="pack-descript"> | |||
<view class="new-person"> | |||
<view class="title">新人注册礼包</view> | |||
<view class="tag">活动</view> | |||
</view> | |||
<view class="desc">新人领券,至高可领40元!</view> | |||
</view> | |||
<view class="time-icon"> | |||
<view class="time">刚刚</view> | |||
<view class="icon"> | |||
<image src="/static/message/arrow.png" mode="aspectFill"></image> | |||
</view> | |||
</view> | |||
</view> | |||
<!-- 聊天列表 --> | |||
<view class="recover-list content"> | |||
<view v-for="item in 10" class="recover-item"> | |||
<view class="img-box"> | |||
<image src="/favicon.ico" mode="aspectFill"></image> | |||
<view class="available-ervice"> | |||
<image src="/static/message/lightning-icon.png" mode="aspectFill"></image> | |||
<text>可服务</text> | |||
</view> | |||
</view> | |||
<view class="recover-content"> | |||
<view class="name">刘莓莓</view> | |||
<view class="msg">好的亲亲</view> | |||
</view> | |||
<view class="time">刚刚</view> | |||
</view> | |||
</view> | |||
</view> | |||
</template> | |||
<script> | |||
import mNavbar from '@/components/base/m-navbar.vue' | |||
export default { | |||
components: { | |||
mNavbar | |||
}, | |||
data() { | |||
return { | |||
} | |||
}, | |||
methods: { | |||
//返回个人中心 | |||
leftClick() { | |||
uni.switchTab({ | |||
url: '/pages/index/center' | |||
}) | |||
}, | |||
} | |||
} | |||
</script> | |||
<style lang="scss" scoped> | |||
.message { | |||
background: #f5f5f5; | |||
min-height: 100vh; | |||
.message-top { | |||
display: flex; | |||
justify-content: space-between; | |||
align-items: center; | |||
image { | |||
width: 130rpx; | |||
height: 130rpx; | |||
} | |||
.pack-descript { | |||
width: calc(100% - 210rpx); | |||
height: 130rpx; | |||
display: flex; | |||
flex-direction: column; | |||
justify-content: center; | |||
.new-person { | |||
display: flex; | |||
.title{ | |||
color: black; | |||
font-size: 28rpx; | |||
font-weight: bold; | |||
margin-right: 10rpx; | |||
} | |||
.tag{ | |||
display: flex; | |||
align-items: center; | |||
background: #FBAB32; | |||
color: white; | |||
font-size: 20rpx; | |||
padding: 0rpx 10rpx; | |||
border-radius: 10rpx; | |||
} | |||
} | |||
.desc { | |||
font-size: 24rpx; | |||
color: #999999; | |||
margin-top: 10rpx; | |||
} | |||
} | |||
.time-icon { | |||
text-align: center; | |||
width: 60rpx; | |||
.time { | |||
font-size: 24rpx; | |||
color: #999999; | |||
} | |||
.icon { | |||
image { | |||
width: 25rpx; | |||
height: 25rpx; | |||
margin-top: 20rpx; | |||
} | |||
} | |||
} | |||
} | |||
.recover-list{ | |||
.recover-item{ | |||
display: flex; | |||
justify-content: space-between; | |||
align-items: center; | |||
padding-bottom: 20rpx; | |||
border-bottom: 2px dashed #D3D1D1; | |||
margin-top: 20rpx; | |||
.img-box{ | |||
position: relative; | |||
width: 120rpx; | |||
height: 120rpx; | |||
box-sizing: border-box; | |||
border: 2px solid #F6BEC3; | |||
border-radius: 10rpx; | |||
image{ | |||
width: 100%; | |||
height: 100%; | |||
border-radius: 10rpx; | |||
} | |||
.available-ervice{ | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
width: 120rpx; | |||
position: absolute; | |||
bottom: 0; | |||
left: 0; | |||
color: white; | |||
font-size: 20rpx; | |||
background: #F6BEC3; | |||
image{ | |||
width: 15rpx; | |||
height: 15rpx; | |||
} | |||
} | |||
} | |||
.recover-content{ | |||
display: flex; | |||
flex-direction: column; | |||
justify-content: center; | |||
width: calc(100% - 170rpx); | |||
box-sizing: border-box; | |||
padding-left: 15rpx; | |||
.name{ | |||
color: #333333; | |||
font-size: 30rpx; | |||
font-weight: bold; | |||
} | |||
.msg{ | |||
color: #999999; | |||
font-size: 20rpx; | |||
margin-top: 5rpx; | |||
} | |||
} | |||
.time{ | |||
width: 50rpx; | |||
color: #999999; | |||
font-size: 24rpx; | |||
} | |||
} | |||
} | |||
.content { | |||
width: 96%; | |||
margin: 0rpx auto; | |||
} | |||
} | |||
</style> |
@ -0,0 +1,317 @@ | |||
<template> | |||
<view class="orderManagement"> | |||
<mNavbar title="订单管理" :leftClick="leftClick"></mNavbar> | |||
<van-tabs v-model:active="active" color="#EF8C94" @change="clickTabs" | |||
style="position: sticky;top: 90rpx;z-index: 99;"> | |||
<van-tab :title="item.name" v-for="(item, index) in tabs" :key="index" | |||
@click="getOrderList(index)"></van-tab> | |||
</van-tabs> | |||
<view v-if="orderList.length > 0" class="list"> | |||
<van-list v-model:loading="loading" :finished="finished" finished-text="没有更多了" @load="onLoad"> | |||
<view class="item" v-for="(item, index) in orderList" @click="toOrderDetail(item.id)"> | |||
<view class="top"> | |||
<view class="service"> | |||
<text>{{item.projectId_dictText}}</text> | |||
<uni-icons type="right" size="15"></uni-icons> | |||
<text>{{item.type_dictText}}</text> | |||
</view> | |||
<view class="status"> | |||
<text> {{item.state_dictText}}</text> | |||
</view> | |||
</view> | |||
<view class="content"> | |||
<view class="left"> | |||
<image mode="aspectFill" :src="item.image"></image> | |||
</view> | |||
<view class="right"> | |||
<view class="text-hidden-1"> | |||
客户姓名:{{item.name}} | |||
</view> | |||
<view class="text-hidden-1"> | |||
下单时间:{{item.createTime}} | |||
</view> | |||
<view class="text-hidden-1"> | |||
下单地址:{{item.addressId_dictText}} | |||
</view> | |||
<view class="text-hidden-1"> | |||
总计时间:{{item.useTime}}分钟 | |||
</view> | |||
</view> | |||
</view> | |||
<view class="order-price"> | |||
<view v-if="true" class="tag"> | |||
{{item.technicianId_dictText}} | |||
</view> | |||
<view v-else class="anticipate"> | |||
<image src="/static/order/time.png" mode="aspectFill"></image> | |||
<text>预计30min内到达</text> | |||
</view> | |||
<view class="price"> | |||
总价格:<text class="num">{{item.money}}元</text> | |||
</view> | |||
</view> | |||
<view class="bottom"> | |||
<view @click.stop="calcelOrder(item.id,cancelSuccess)" class="b1" v-if="item.state == 0"> | |||
取消订单 | |||
</view> | |||
<view @click.stop="toPayOrder(item)" class="b2" v-if="item.state == 0"> | |||
立即付款 | |||
</view> | |||
<!-- <view @click.stop="toPayOrder(item)" class="b2" v-if="item.state == 2"> | |||
立即确认 | |||
</view> --> | |||
<view class="b1" @click.stop="moreOrder(item.projectId,toPlaceorder)" v-if="item.state == 3"> | |||
再来一单 | |||
</view> | |||
<view class="b2" @click.stop="toEvaluate(item.id,item.projectId)" v-if="item.state == 3"> | |||
立即评价 | |||
</view> | |||
<view class="b2" @click.stop="moreOrder(item.projectId,toPlaceorder)" v-if="item.state == 4"> | |||
再来一单 | |||
</view> | |||
</view> | |||
</view> | |||
</van-list> | |||
</view> | |||
<van-empty v-else image="/static/empty/order.png" image-size="400rpx" description="暂无订单" /> | |||
</view> | |||
</template> | |||
<script> | |||
import mNavbar from '@/components/base/m-navbar.vue' | |||
import order from '@/mixins/order.js' | |||
export default { | |||
components: { | |||
mNavbar | |||
}, | |||
mixins: [order], | |||
data(){ | |||
return { | |||
active : 0, | |||
tabs: [ | |||
{ | |||
name: '待付款' | |||
}, | |||
{ | |||
name: '已付款' | |||
}, | |||
{ | |||
name: '已确认' | |||
}, | |||
{ | |||
name: '已完成' | |||
}, | |||
{ | |||
name: '已取消' | |||
} | |||
], | |||
queryParams: { | |||
state: 0, | |||
pageNo: 1, | |||
pageSize: 10 | |||
}, | |||
orderList : [], | |||
finished : false, | |||
} | |||
}, | |||
onShow(){ | |||
this.getOrderList(0) | |||
}, | |||
methods : { | |||
//返回个人中心 | |||
leftClick() { | |||
uni.switchTab({ | |||
url: '/pages/index/center' | |||
}) | |||
}, | |||
//点击tab栏 | |||
clickTabs(index) { | |||
this.queryParams.state = index; | |||
this.getOrderList() | |||
}, | |||
//获取订单列表 | |||
getOrderList() { | |||
this.$api('getOrderList', this.queryParams, res => { | |||
if (res.code == 200) { | |||
this.orderList = res.result.records; | |||
if (this.queryParams.pageSize > res.result.total) { | |||
this.finished = true | |||
} | |||
this.loading = false | |||
}else{ | |||
this.finished = true | |||
} | |||
//用户不存在,删除token和用户信息并且需要用户重新登录 | |||
if (res.code == 500 && res.message === '操作失败,用户不存在!') { | |||
localStorage.removeItem('token') | |||
localStorage.removeItem('userInfo') | |||
uni.navigateTo({ | |||
url: '/pages/login/login' | |||
}) | |||
} | |||
}) | |||
}, | |||
//跳转订单详情页面 | |||
toOrderDetail(id) { | |||
uni.navigateTo({ | |||
url: '/pages/order/orderDetail?id=' + id | |||
}) | |||
}, | |||
//list列表滑动到底部自动新增数据列表 | |||
onLoad() { | |||
this.queryParams.pageSize += 10; | |||
this.getOrderList() | |||
}, | |||
//取消成功 | |||
cancelSuccess() { | |||
uni.showToast({ | |||
title: '取消成功', | |||
icon: 'none' | |||
}) | |||
this.getOrderList() | |||
}, | |||
} | |||
} | |||
</script> | |||
<style lang="scss" scoped> | |||
.orderManagement{ | |||
.list { | |||
.item { | |||
width: calc(100% - 40rpx); | |||
background-color: #fff; | |||
margin: 20rpx; | |||
box-sizing: border-box; | |||
border-radius: 16rpx; | |||
padding: 30rpx; | |||
.top { | |||
display: flex; | |||
justify-content: space-between; | |||
align-items: center; | |||
font-size: 30rpx; | |||
.service {} | |||
.status { | |||
color: #333; | |||
font-size: 26rpx; | |||
font-weight: 600; | |||
} | |||
} | |||
.content { | |||
display: flex; | |||
margin: 10rpx 0; | |||
.left { | |||
width: 150rpx; | |||
height: 150rpx; | |||
border-radius: 10rpx; | |||
image { | |||
width: 150rpx; | |||
height: 150rpx; | |||
} | |||
} | |||
.right { | |||
width: calc(100% - 160rpx); | |||
color: #777; | |||
font-size: 24rpx; | |||
padding-left: 20rpx; | |||
line-height: 40rpx; | |||
} | |||
} | |||
.order-price { | |||
display: flex; | |||
justify-content: space-between; | |||
margin: 20rpx 0rpx; | |||
.tag { | |||
width: 150rpx; | |||
color: #EF8C94; | |||
font-size: 24rpx; | |||
text-align: center; | |||
background-color: #FAE9EA; | |||
border: 1px solid #EF8C94; | |||
border-radius: 8rpx; | |||
padding: 2rpx 0; | |||
} | |||
.anticipate { | |||
display: flex; | |||
align-items: center; | |||
font-size: 24rpx; | |||
color: #666666; | |||
image { | |||
width: 25rpx; | |||
height: 25rpx; | |||
margin-right: 5rpx; | |||
} | |||
} | |||
.price { | |||
font-weight: 900; | |||
text-align: right; | |||
text { | |||
color: #ff780099; | |||
font-size: 30rpx; | |||
} | |||
} | |||
} | |||
.bottom { | |||
display: flex; | |||
justify-content: flex-end; | |||
font-size: 25rpx; | |||
.b1 { | |||
border: 1px solid #777; | |||
color: #777; | |||
box-sizing: border-box; | |||
} | |||
.b2 { | |||
background: #EF8C94; | |||
color: #fff; | |||
} | |||
view { | |||
margin: 12rpx; | |||
border-radius: 28rpx; | |||
padding: 8rpx 28rpx; | |||
margin-bottom: 0; | |||
} | |||
} | |||
} | |||
} | |||
} | |||
</style> |