<template>
|
<view class="index">
|
<view class="index-j-head">
|
<view :style="{ width: '100%', height: statusbarHeight + 'px' }"></view>
|
<view class="index-c-title" :style="{ height: navHeight + 'px' }">
|
<text>我的订单</text>
|
</view>
|
</view>
|
|
<!-- 未登录 -->
|
<view class="index-wu" v-if="!isLogin">
|
<image src="/static/icon/default_login@2x.png" mode="widthFix"></image>
|
<text>您还没有登录，请登录后查看订单</text>
|
<button>登录</button>
|
</view>
|
|
<!-- 已登陆 -->
|
<template v-else>
|
<!-- 发单方 -->
|
<view class="index-labs" v-if="typeViewId === 0" :style="{ top: statusbarHeight + navHeight + 'px' }">
|
<scroll-view scroll-x class="scroll-view_H">
|
<view :class="item.id === status ? 'index-labs-row active' : 'index-labs-row'" v-for="(item, index) in list1" :key="index" @click="clickOrderType(item.id)">
|
{{item.name}}
|
<view class="index-labs-row-x" v-if="item.id === status"></view>
|
</view>
|
</scroll-view>
|
</view>
|
<!-- 接单方 -->
|
<view class="index-labs" v-if="typeViewId === 1" :style="{ top: statusbarHeight + navHeight + 'px' }">
|
<scroll-view scroll-x class="scroll-view_H">
|
<view :class="item.id === status ? 'index-labs-row active' : 'index-labs-row'" v-for="(item, index) in list" :key="index" @click="clickOrderType(item.id)">
|
{{item.name}}
|
<view class="index-labs-row-x" v-if="item.id === status"></view>
|
</view>
|
</scroll-view>
|
</view>
|
<!-- 发单方 -->
|
<view class="index-list" v-if="typeViewId === 0">
|
<view class="index-list-item" v-for="(item, index) in orderList" :key="index" @click="jumpDesc(item)">
|
<view class="index-list-item-head">
|
<view class="index-list-item-head-l">
|
<view class="xoam"></view>
|
<text v-if="item.type === 0 && item.workType === 0">用工单 - 采摘工</text>
|
<text v-else-if="item.type === 0 && item.workType === 1">用工单 - 分拣工</text>
|
<text v-else-if="item.type === 0 && item.workType === 2">用工单 - 包装工</text>
|
<text v-else-if="item.type === 1">运货单-{{item.categoryName}}-{{item.carUnit}}</text>
|
<text v-else-if="item.type === 2">订餐单</text>
|
</view>
|
<view class="index-list-item-head-r" v-if="item.status === 1">待接单方接单</view>
|
<view class="index-list-item-head-r" v-if="item.status === 2">已接单</view>
|
<view class="index-list-item-head-r" v-if="item.status === 3">进行中</view>
|
<view class="index-list-item-head-r" v-if="item.status === 2 && item.isUpdate === 1">已修改，待接单方确认</view>
|
<view class="index-list-item-head-r hui" v-if="item.status === 4">已完成</view>
|
<view class="index-list-item-head-r hui" v-if="item.status === 99">已取消</view>
|
<view class="index-list-item-head-r" v-if="item.status === 4 && item.commentStatus === 0">待评价</view>
|
</view>
|
<view class="index-list-item-info" v-if="item.type === 0 && item.workType === 0">
|
{{item.categoryName}}｜{{item.priceNum1}}斤
|
</view>
|
<view class="index-list-item-info" v-if="item.type === 0 && item.workType === 1">
|
{{item.categoryName}}｜{{item.priceNum1}}人
|
</view>
|
<view class="index-list-item-info" v-if="item.type === 0 && item.workType === 2">
|
{{item.categoryName}}｜{{item.priceNum1}}人
|
</view>
|
<view class="index-list-item-info" v-if="item.type === 1">
|
{{item.transportTypeName}} | {{item.transportNum}}{{item.transportUnit}}｜用车{{item.priceNum1}}天
|
</view>
|
<view class="index-list-item-info" v-if="item.type === 2">
|
{{item.wayInfoCopy}}
|
</view>
|
<view class="address" v-if="item.type === 1">
|
<view class="address-xian"></view>
|
<view class="address-row" v-for="(address, i) in item.wayInfo" :key="i">
|
<image src="/static/icon/ic_qidian@2x.png" mode="widthFix" v-if="i === 0"></image>
|
<image src="/static/icon/ic_jingguo@2x.png" mode="widthFix" v-else-if="i !== 0 && i !== item.wayInfo.length - 1"></image>
|
<image src="/static/icon/ic_zhongdian@2x.png" mode="widthFix" v-else-if="i === item.wayInfo.length - 1"></image>
|
<text>{{item.location}}</text>
|
</view>
|
</view>
|
<template v-if="[0, 2].includes(item.type)">
|
<view class="index-list-item-dz">
|
<image src="/static/icon/order_ic_location@2x.png" mode="widthFix"></image>
|
<text>{{item.location}}</text>
|
</view>
|
<view class="index-list-item-dz">
|
<image src="/static/icon/order_ic_time@2x.png" mode="widthFix"></image>
|
<text>{{item.startDate}} 至 {{item.endDate}}（{{item.totalDays}}天）</text>
|
</view>
|
</template>
|
<view class="index-list-item-price">
|
<text>预估：</text>
|
<text>¥{{item.estimatedAccount / 100}}</text>
|
</view>
|
<view class="eidt">
|
<view></view>
|
<view class="eidt-right">
|
<view class="eidt-close" v-if="[0,1,2].includes(item.status)" @click.stop="orderId = item.id, show = true">取消订单</view>
|
<view class="eidt-phone" v-if="[2].includes(item.status)">联系师傅</view>
|
<view class="eidt-phone" v-if="item.status === 4 && item.commentStatus === 0">评价订单</view>
|
<view class="eidt-btn" v-if="[0,1,2].includes(item.status)" @click.stop="jumpEdit(item)">修改订单</view>
|
<view class="eidt-btn" v-if="(item.type === 2 && item.status === 0) || (item.type === 2 && item.status === 3)" @click.stop="jumpEdit(item)">继续支付</view>
|
<view class="eidt-btn" v-if="item.status === 2" @click.stop="startJobs(item.id)">开始作业</view>
|
<view class="eidt-btn" v-if="item.status === 3" @click.stop="jumpDesc(item)">完成并支付</view>
|
<!-- <view class="eidt-close">删除订单</view>
|
<view class="eidt-phone">联系师傅</view>
|
<view class="eidt-phone">评价订单</view>
|
<view class="eidt-btn">修改订单</view>
|
<view class="eidt-btn">完成并支付</view> -->
|
</view>
|
</view>
|
</view>
|
</view>
|
<!-- 接单方 -->
|
<view class="index-list" v-if="typeViewId === 1">
|
<view class="index-list-item" v-for="(item, index) in orderList" :key="index">
|
<view class="index-list-item-head">
|
<view class="index-list-item-head-l">
|
<view class="xoam"></view>
|
<text v-if="item.type === 0 && item.workType === 0">用工单 - 采摘工</text>
|
<text v-else-if="item.type === 0 && item.workType === 1">用工单 - 分拣工</text>
|
<text v-else-if="item.type === 0 && item.workType === 2">用工单 - 包装工</text>
|
<text v-else-if="item.type === 1">运货单-{{item.categoryName}}-{{item.carUnit}}</text>
|
<text v-else-if="item.type === 2">订餐单</text>
|
<view class="tips" v-if="item.acceptType === 1">系统派单</view>
|
<view class="tips1" v-if="item.acceptType === 0">手动接单</view>
|
</view>
|
<view class="index-list-item-head-r" v-if="item.status === 2">已接单</view>
|
<view class="index-list-item-head-r" v-if="item.status === 3">进行中</view>
|
<view class="index-list-item-head-r hui" v-if="item.status === 4">已完成</view>
|
<view class="index-list-item-head-r hui" v-if="item.status === 99">已取消</view>
|
</view>
|
<view class="index-list-item-info" v-if="item.type === 0 && item.workType === 0">
|
{{item.categoryName}}｜{{item.priceNum1}}斤
|
</view>
|
<view class="index-list-item-info" v-if="item.type === 0 && item.workType === 1">
|
{{item.categoryName}}｜{{item.priceNum1}}人
|
</view>
|
<view class="index-list-item-info" v-if="item.type === 0 && item.workType === 2">
|
{{item.categoryName}}｜{{item.priceNum1}}人
|
</view>
|
<view class="index-list-item-info" v-if="item.type === 1">
|
{{item.transportTypeName}} | {{item.transportNum}}{{item.transportUnit}}｜用车{{item.priceNum1}}天
|
</view>
|
<view class="index-list-item-info" v-if="item.type === 2">
|
{{item.wayInfoCopy}}
|
</view>
|
<view class="address" v-if="item.type === 1">
|
<view class="address-xian"></view>
|
<view class="address-row" v-for="(address, i) in item.wayInfo" :key="i">
|
<image src="/static/icon/ic_qidian@2x.png" mode="widthFix" v-if="i === 0"></image>
|
<image src="/static/icon/ic_jingguo@2x.png" mode="widthFix" v-else-if="i !== 0 && i !== item.wayInfo.length - 1"></image>
|
<image src="/static/icon/ic_zhongdian@2x.png" mode="widthFix" v-else-if="i === item.wayInfo.length - 1"></image>
|
<text>{{item.location}}</text>
|
</view>
|
</view>
|
<template v-if="[0, 2].includes(item.type)">
|
<view class="index-list-item-dz">
|
<image src="/static/icon/order_ic_location@2x.png" mode="widthFix"></image>
|
<text>{{item.location}}</text>
|
</view>
|
<view class="index-list-item-dz">
|
<image src="/static/icon/order_ic_time@2x.png" mode="widthFix"></image>
|
<text>{{item.startDate}} 至 {{item.endDate}}（{{item.priceNum1}}天）</text>
|
</view>
|
</template>
|
<view class="index-list-item-price">
|
<text>预估：</text>
|
<text>¥{{item.estimatedAccount / 100}}</text>
|
</view>
|
<view class="eidt">
|
<view class="eidt-tips" v-if="item.isUpdate === 1">
|
<image src="/static/icon/ic_tip@2x.png" mode="widthFix"></image>
|
<text>订单已修改</text>
|
</view>
|
<view class="eidt-tips" v-else></view>
|
|
<view class="eidt-right">
|
<view class="eidt-close" v-if="item.status === 2" @click.stop="orderId = item.id, show = true">取消订单</view>
|
<view class="eidt-phone" v-if="[2,3].includes(item.status)" @click.stop="phoneCall(item.linkPhone)">联系业主</view>
|
|
<!-- <view class="eidt-close">删除订单</view>
|
<view class="eidt-phone">联系师傅</view>
|
<view class="eidt-phone">评价订单</view>
|
<view class="eidt-btn">修改订单</view>
|
<view class="eidt-btn">完成并支付</view> -->
|
</view>
|
</view>
|
</view>
|
<!-- <view class="index-list-item">
|
<view class="index-list-item-head">
|
<view class="index-list-item-head-l">
|
<view class="xoam"></view>
|
<text>运货单-小货车-厢式</text>
|
<view class="tips1">自主抢单</view>
|
</view>
|
<view class="index-list-item-head-r">已接单</view>
|
</view>
|
<view class="index-list-item-info">
|
葡萄｜20000斤｜需2辆
|
</view>
|
<view class="index-list-item-date">
|
<image src="/static/icon/order_ic_time@2x.png" mode="widthFix"></image>
|
<text>07-26 至 07-27（2天）</text>
|
</view>
|
<view class="address">
|
<view class="address-xian"></view>
|
<view class="address-row">
|
<image src="/static/icon/ic_qidian@2x.png" mode="widthFix"></image>
|
<text>长江西路大蜀山森林公园西门保安室</text>
|
</view>
|
<view class="address-row">
|
<image src="/static/icon/ic_jingguo@2x.png" mode="widthFix"></image>
|
<text>长江西路大蜀山森林公园东门保安室</text>
|
</view>
|
<view class="address-row">
|
<image src="/static/icon/ic_zhongdian@2x.png" mode="widthFix"></image>
|
<text>安徽莲花科技产业园豆米科技有限公司</text>
|
</view>
|
</view>
|
<view class="index-list-item-price">
|
<text>预估：</text>
|
<text>¥1000.00</text>
|
</view>
|
<view class="eidt">
|
<view></view>
|
<view class="eidt-right">
|
<view class="eidt-close">取消订单</view>
|
</view>
|
</view>
|
</view> -->
|
<!-- <view class="index-list-item">
|
<view class="index-list-item-head">
|
<view class="index-list-item-head-l">
|
<view class="xoam"></view>
|
<text>用工单-采摘工</text>
|
<view class="tips1">自主抢单</view>
|
</view>
|
<view class="index-list-item-head-r">待接单</view>
|
</view>
|
<view class="index-list-item-info">
|
葡萄｜2000斤
|
</view>
|
<view class="index-list-item-dz">
|
<image src="/static/icon/order_ic_location@2x.png" mode="widthFix"></image>
|
<text>长江西路大蜀山森林公园西门保安室</text>
|
</view>
|
<view class="index-list-item-dz">
|
<image src="/static/icon/order_ic_time@2x.png" mode="widthFix"></image>
|
<text>07-26 至 07-27（2天）</text>
|
</view>
|
<view class="index-list-item-price">
|
<text>预估：</text>
|
<text>¥1000.00</text>
|
</view>
|
<view class="eidt">
|
<view></view>
|
<view class="eidt-right">
|
<view class="eidt-close">取消订单</view>
|
</view>
|
</view>
|
</view> -->
|
</view>
|
</template>
|
|
<u-modal
|
title="温馨提示"
|
:show="show"
|
closeOnClickOverlay
|
showCancelButton
|
>
|
<view class="slot-content">
|
确认取消订单吗？
|
</view>
|
<view slot="confirmButton" style="display: flex; justify-content: space-between; align-items: center; width: 100%;">
|
<view class="btn1" @click="show = false">我再想想</view>
|
<view class="btn2" @click="cancelOrder">确认取消</view>
|
</view>
|
</u-modal>
|
|
</view>
|
</template>
|
|
<script>
|
import { mapState } from 'vuex'
|
export default {
|
computed: {
|
...mapState(['navHeight', 'statusbarHeight','userInfo','token','openid', 'latitude', 'longitude'])
|
},
|
onShow(options) {
|
this.typeViewId = 0
|
if(this.token && this.token != '' && this.userInfo && JSON.stringify(this.userInfo) != '{}'){
|
this.isLogin = true
|
}
|
if (this.userInfo && this.userInfo.useIdentity == 1) {
|
this.typeViewId = 1
|
} else {
|
this.typeViewId = 0
|
}
|
},
|
data() {
|
return {
|
show: false,
|
isLogin: false,
|
typeViewId: 0,
|
list: [
|
{ name: '全部', id: '' },
|
{ name: '已接单', id: 2 },
|
{ name: '进行中', id: 3 },
|
{ name: '已完成', id: 4 },
|
{ name: '已取消', id: 99 },
|
],
|
list1: [
|
{ name: '全部', id: '' },
|
{ name: '待支付', id: 0 },
|
{ name: '待接单', id: 1 },
|
{ name: '已接单', id: 2 },
|
{ name: '进行中', id: 3 },
|
{ name: '已完成', id: 4 },
|
{ name: '已取消', id: 99 },
|
{ name: '待评价', id: [4, 0] }
|
],
|
orderId: null,
|
status: '',
|
commentStatus: '',
|
|
next: true,
|
page: 1,
|
orderList: []
|
};
|
},
|
async onLoad() {
|
await this.$onLaunched;
|
uni.$on('refresh', (data) => {
|
console.log('我的订单页刷新');
|
this.status = ''
|
this.commentStatus = ''
|
this.orderList = []
|
this.next = true
|
this.page = 1
|
this.getOrderList()
|
})
|
this.getOrderList()
|
},
|
onReachBottom() {
|
this.getOrderList()
|
},
|
methods: {
|
startJobs(orderId) {
|
this.$u.api.begin({ orderId })
|
.then(res => {
|
this.status = ''
|
this.commentStatus = ''
|
this.orderList = []
|
this.next = true
|
this.page = 1
|
this.getOrderList()
|
})
|
},
|
jumpDesc(item) {
|
uni.navigateTo({
|
url: `/pages/order-details/order-details?id=${item.id}`
|
})
|
},
|
// 修改
|
jumpEdit(item) {
|
if (item.type === 0 && item.workType === 0) {
|
uni.navigateTo({
|
url: `/pages/using-workers/using-workers?id=${item.id}`
|
})
|
} else if (item.type === 0 && item.workType === 1) {
|
uni.navigateTo({
|
url: `/pages/sorting/sorting?id=${item.id}`
|
})
|
} else if (item.type === 0 && item.workType === 2) {
|
uni.navigateTo({
|
url: `/pages/packaging-worker/packaging-worker?id=${item.id}`
|
})
|
} else if (item.type === 1) {
|
uni.navigateTo({
|
url: `/pages/freight/freight?id=${item.id}`
|
})
|
}
|
},
|
cancelOrder() {
|
this.$u.api.receiveCancelOrder({
|
orderId: this.orderId
|
}).then(res => {
|
this.show = false
|
this.orderList = []
|
this.next = true
|
this.page = 1
|
this.getOrderList()
|
})
|
},
|
phoneCall(phoneNumber) {
|
uni.makePhoneCall({
|
phoneNumber
|
});
|
},
|
// 订单分页
|
getOrderList() {
|
if (!this.next) return;
|
this.$u.api.orderPage({
|
capacity: 10,
|
page: this.page,
|
model: {
|
queryMyOrderType: this.userInfo.useIdentity,
|
status: this.status,
|
queryLat: this.latitude,
|
queryLgt: this.longitude
|
}
|
}).then(res => {
|
res.data.records.forEach(item => {
|
// 订餐单
|
if (item.type === 2) {
|
item.wayInfoCopy = JSON.parse(item.wayInfo).map(item => {
|
return `${item.name}${item.price / 100}元(${item.num}份)`
|
}).join(' | ')
|
// 运货
|
} else if (item.type === 1) {
|
item.wayInfo = JSON.parse(item.wayInfo)
|
}
|
})
|
this.orderList = [...this.orderList, ...res.data.records]
|
|
if (this.orderList.length === res.data.total) {
|
this.next = false
|
} else {
|
this.page += 1
|
}
|
})
|
},
|
clickOrderType(id) {
|
if (typeof id === 'object') {
|
this.status = id[0]
|
this.commentStatus = id[1]
|
} else {
|
this.commentStatus = ''
|
this.status = id
|
}
|
this.orderList = []
|
this.next = true
|
this.page = 1
|
this.getOrderList()
|
}
|
}
|
}
|
</script>
|
|
<style>
|
page {
|
background-color: #F7F7F7;
|
}
|
</style>
|
|
<style lang="scss" scoped>
|
.index {
|
width: 100%;
|
.slot-content {
|
width: 100%;
|
text-align: center;
|
font-weight: 400;
|
font-size: 30rpx;
|
color: #333333;
|
margin: 30rpx 0;
|
}
|
.btn1 {
|
width: 264rpx;
|
height: 88rpx;
|
line-height: 88rpx;
|
text-align: center;
|
font-weight: 400;
|
font-size: 32rpx;
|
color: #666666;
|
border-radius: 44rpx;
|
border: 1rpx solid #B2B2B2;
|
}
|
.btn2 {
|
width: 264rpx;
|
height: 88rpx;
|
line-height: 88rpx;
|
text-align: center;
|
font-weight: 500;
|
font-size: 32rpx;
|
color: #FFFFFF;
|
background: #00BC12;
|
border-radius: 44rpx;
|
}
|
.index-j-head {
|
width: 100%;
|
background-color: #ffffff;
|
position: sticky;
|
top: 0;
|
left: 0;
|
z-index: 9;
|
.index-c-title {
|
width: 100%;
|
padding: 0 30rpx;
|
box-sizing: border-box;
|
display: flex;
|
align-items: center;
|
text {
|
font-weight: bold;
|
font-size: 36rpx;
|
color: #111111;
|
}
|
}
|
}
|
.index-list {
|
width: 100%;
|
padding: 20rpx 30rpx;
|
box-sizing: border-box;
|
.index-list-item {
|
width: 100%;
|
padding: 30rpx;
|
box-sizing: border-box;
|
background: #FFFFFF;
|
border-radius: 20rpx;
|
margin-bottom: 20rpx;
|
&:last-child {
|
margin: 0 !important;
|
}
|
.eidt {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
.eidt-tips {
|
flex-shrink: 0;
|
display: flex;
|
align-items: center;
|
image {
|
width: 26rpx;
|
height: 26rpx;
|
margin-right: 12rpx;
|
}
|
text {
|
font-weight: 400;
|
font-size: 26rpx;
|
color: #FF0000;
|
}
|
}
|
.eidt-right {
|
flex: 1;
|
display: flex;
|
align-items: center;
|
justify-content: flex-end;
|
flex-wrap: wrap;
|
.eidt-close {
|
width: 160rpx;
|
height: 64rpx;
|
font-weight: 400;
|
font-size: 28rpx;
|
color: #666666;
|
line-height: 64rpx;
|
text-align: center;
|
border-radius: 34rpx;
|
border: 1rpx solid #B2B2B2;
|
margin-left: 20rpx;
|
}
|
.eidt-phone {
|
width: 160rpx;
|
height: 64rpx;
|
line-height: 64rpx;
|
text-align: center;
|
font-weight: 400;
|
font-size: 28rpx;
|
color: #00BC12;
|
border-radius: 34rpx;
|
border: 1rpx solid #00BC12;
|
margin-left: 20rpx;
|
}
|
.eidt-btn {
|
width: 160rpx;
|
height: 64rpx;
|
line-height: 64rpx;
|
text-align: center;
|
font-weight: 400;
|
font-size: 28rpx;
|
color: #FFFFFF;
|
background: #00BC12;
|
border-radius: 34rpx;
|
margin-left: 20rpx;
|
}
|
}
|
}
|
.index-list-item-price {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: flex-end;
|
margin-bottom: 20rpx;
|
text {
|
&:nth-child(1) {
|
font-weight: 400;
|
font-size: 26rpx;
|
color: #333333;
|
}
|
&:nth-child(2) {
|
font-weight: 600;
|
font-size: 36rpx;
|
color: #FF0000;
|
}
|
}
|
}
|
.index-list-item-dz {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
margin-bottom: 20rpx;
|
image {
|
width: 32rpx;
|
height: 32rpx;
|
flex-shrink: 0;
|
margin-right: 16rpx;
|
}
|
text {
|
flex: 1;
|
font-weight: 400;
|
font-size: 28rpx;
|
color: #333333;
|
}
|
}
|
.index-list-item-info {
|
font-weight: 400;
|
font-size: 28rpx;
|
color: #888888;
|
margin-bottom: 20rpx;
|
}
|
.address {
|
width: 100%;
|
background: #F7F7F7;
|
border-radius: 16rpx;
|
padding: 30rpx;
|
box-sizing: border-box;
|
margin-bottom: 24rpx;
|
position: relative;
|
.address-xian {
|
position: absolute;
|
top: 17px;
|
left: 24px;
|
width: 1rpx;
|
height: calc(100% - 60rpx);
|
border-right: 2rpx dashed #B2B2B2;
|
}
|
.address-row {
|
position: relative;
|
z-index: 2;
|
width: 100%;
|
display: flex;
|
align-items: center;
|
margin-bottom: 30rpx;
|
&:last-child {
|
margin: 0 !important;
|
}
|
image {
|
width: 36rpx;
|
height: 36rpx;
|
flex-shrink: 0;
|
margin-right: 24rpx;
|
}
|
text {
|
font-weight: 400;
|
font-size: 28rpx;
|
color: #333333;
|
}
|
}
|
}
|
.index-list-item-date {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
margin-bottom: 20rpx;
|
image {
|
flex-shrink: 0;
|
width: 28rpx;
|
height: 28rpx;
|
margin-right: 18rpx;
|
}
|
text {
|
font-weight: 400;
|
font-size: 28rpx;
|
color: #333333;
|
}
|
}
|
.index-list-item-head {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
margin-bottom: 20rpx;
|
.index-list-item-head-l {
|
display: flex;
|
align-items: center;
|
.xoam {
|
width: 6rpx;
|
height: 30rpx;
|
background: #00BC12;
|
border-radius: 4rpx;
|
margin-right: 20rpx;
|
}
|
text {
|
font-weight: 600;
|
font-size: 32rpx;
|
color: #222222;
|
margin-right: 12rpx;
|
}
|
.tips {
|
padding: 4rpx 12rpx;
|
border-radius: 8rpx;
|
font-weight: 400;
|
font-size: 24rpx;
|
color: #00BC12;
|
border: 2rpx solid #00BC12;
|
}
|
.tips1 {
|
padding: 4rpx 12rpx;
|
border-radius: 8rpx;
|
font-weight: 400;
|
font-size: 24rpx;
|
color: #FD9E24;
|
border: 2rpx solid #FD9E24;
|
}
|
}
|
.hui {
|
color: #999999 !important;
|
}
|
.index-list-item-head-r {
|
font-weight: 400;
|
font-size: 28rpx;
|
color: #FF0000;
|
}
|
}
|
}
|
}
|
.index-labs {
|
width: 100%;
|
height: 90rpx;
|
padding: 0 30rpx;
|
box-sizing: border-box;
|
display: flex;
|
align-items: center;
|
background: #FFFFFF;
|
position: sticky;
|
left: 0;
|
.scroll-view_H {
|
width: 100%;
|
height: 100%;
|
white-space: nowrap;
|
.active {
|
font-weight: 500 !important;
|
font-size: 32rpx !important;
|
color: #222222 !important;
|
}
|
.index-labs-row {
|
display: inline-block;
|
height: 100%;
|
line-height: 90rpx;
|
font-weight: 400;
|
font-size: 30rpx;
|
color: #666666;
|
position: relative;
|
margin-right: 62rpx;
|
&:last-child {
|
margin: 0 !important;
|
}
|
.index-labs-row-x {
|
position: absolute;
|
bottom: 0;
|
left: 50%;
|
width: 40rpx;
|
height: 2rpx;
|
background-color: #00BC12;
|
transform: translate(-50%, 0);
|
}
|
}
|
}
|
}
|
.index-wu {
|
width: 100%;
|
margin-top: 286rpx;
|
display: flex;
|
flex-direction: column;
|
align-items: center;
|
justify-content: center;
|
image {
|
width: 300rpx;
|
height: 300rpx;
|
}
|
text {
|
font-weight: 400;
|
font-size: 28rpx;
|
color: #999999;
|
margin-bottom: 40rpx;
|
}
|
button {
|
width: 160rpx;
|
height: 72rpx;
|
line-height: 72rpx;
|
text-align: center;
|
background: #00BC12;
|
border-radius: 36rpx;
|
font-weight: 500;
|
font-size: 32rpx;
|
color: #FFFFFF;
|
}
|
}
|
}
|
</style>
|
