<template>
|
<view class="index">
|
<!-- 接单方 -->
|
<view class="index-j" v-if="userInfo && userInfo.useIdentity === 1">
|
<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="search" :style="{ top: statusbarHeight + navHeight + 'px' }">
|
<view class="index-j-cate">
|
<view class="index-j-cate-item" v-for="(item, index) in searchType" :key="index" @click="clickCate(item.id)">
|
<text :style="{ color: typeVal === item.id ? '#222222' : '', fontSize: typeVal === item.id ? '36rpx' : '', fontWeight: typeVal === item.id ? '600' : '' }">{{item.name}}</text>
|
<view class="index-j-cate-item-x" v-if="typeVal === item.id"></view>
|
</view>
|
</view>
|
<view class="index-j-search">
|
<view :class="sortType === item.id ? 'index-j-search-item active' : 'index-j-search-item'" v-for="(item, index) in sortList" :key="index" @click="clickSort(item.id)">{{item.name}}</view>
|
</view>
|
</view>
|
<view class="index-j-list">
|
<view class="index-list-item" v-if="orderList" 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>
|
<view class="index-list-item-head-r">距离 {{item.distance}}km</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-if="item.wayInfo" 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">
|
<!-- <sunui-mverify @change="getaccept($event, item.id, index)"></sunui-mverify> -->
|
<view class="eidt-btn" @click="show1 = true, orderId = item.id">抢单</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
|
<!-- 发单方 -->
|
<view class="index-c" v-if="!userInfo || userInfo.useIdentity === 0">
|
<view :style="{ width: '100%', height: statusbarHeight + 'px' }"></view>
|
<view class="index-c-title" :style="{ height: navHeight + 'px' }" @click="selectAddress(-1)">
|
<text class="index-c-title-logo">近快</text>
|
<image class="dingwei" src="/static/icon/home_ic_location@2x.png" mode="widthFix"></image>
|
<text>{{location.address || address || '获取地址失败'}}</text>
|
<image class="qu" src="/static/icon/home_ar_next@2x.png" mode="widthFix"></image>
|
</view>
|
|
<view class="index-c-cate">
|
<view
|
v-if="type"
|
:class="typeId === item.id ? 'index-c-cate-item active' : 'index-c-cate-item'"
|
v-for="(item, index) in type"
|
:key="index"
|
@click="clickType(item.id)">
|
{{item.name}}
|
</view>
|
</view>
|
|
<!-- 订餐 -->
|
<template v-if="typeId === 2">
|
<view class="list">
|
<view class="list-item">
|
<view class="list-item-label">时间地点</view>
|
<view class="list-item-row" @click="show = true">
|
<view class="list-item-row-label">用餐日期<b>*</b></view>
|
<view class="list-item-row-val">
|
<text>{{ form.startDate ? form.startDate + ' 至 ' + form.endDate + '（' + form.days + '天）' : '请选择'}}</text>
|
<u-icon name="arrow-right" color="#111111" size="16"></u-icon>
|
</view>
|
</view>
|
<view class="list-item-row">
|
<view class="list-item-row-label">用餐时间<b>*</b></view>
|
<view class="list-item-row-radio">
|
<view class="radio-item" v-if="orderFood" v-for="(item, index) in orderFood" :key="index">
|
<view class="radio-item-label">{{item.name}}</view>
|
<view class="radio-item-list">
|
<view class="radio-item-list-l">
|
<view v-if="item.list" :class="child.active ? 'radio-item-list-item active' : 'radio-item-list-item'" v-for="(child, childIndex) in item.list" :key="childIndex" @click="selectMenu(index, childIndex)">{{child.price||0}}元</view>
|
</view>
|
<view class="radio-item-list-data">
|
<text style="flex-shrink: 0;">份数：</text>
|
<input type="number" v-model="item.num" placeholder="请输入">
|
<text style="color: #999999;">份</text>
|
<view class="radio-item-list-data-btn" @click="clear(index)">取消</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
<view class="list-item-row" @click="selectAddress(1)">
|
<view class="list-item-row-label">用餐地点<b>*</b></view>
|
<view class="list-item-row-val">
|
<text>{{form.address ? form.address : '请选择'}}</text>
|
<u-icon name="arrow-right" color="#111111" size="16"></u-icon>
|
</view>
|
</view>
|
<view class="list-item-row">
|
<view class="list-item-row-label">地点描述</view>
|
<view class="list-item-row-val">
|
<input type="text" v-model="form.locationRemark" placeholder="请输入" />
|
</view>
|
</view>
|
<view class="list-item-row" v-if="viewStatus">
|
<view class="list-item-row-label">需求补充</view>
|
<view class="list-item-row-val">
|
<textarea v-model="form.supplement" cols="30" rows="10" placeholder="请输入" maxlength="200"></textarea>
|
</view>
|
</view>
|
<view class="list-item-row" v-if="viewStatus">
|
<view class="list-item-row-label">图片</view>
|
<view class="list-item-row-upload">
|
<view class="upload-item" v-if=" form.multifileList" v-for="(item, index) in form.multifileList" :key="index">
|
<image :src="item.url" mode="widthFix"></image>
|
<image class="upload-item-dele" @click="form.multifileList.splice(index, 1)" src="/static/icon/ic_delete1@2x.png" mode="widthFix"></image>
|
</view>
|
<view class="upload-item" @click="uploadImg">
|
<u-icon name="plus" color="#999999" size="24"></u-icon>
|
<text>点击上传</text>
|
</view>
|
</view>
|
</view>
|
<view class="list-item-zk" @click="viewStatus = !viewStatus">
|
<text>{{viewStatus ? '收起' : '补充需求'}}</text>
|
<u-icon :name="viewStatus ? 'arrow-up' : 'arrow-down'" color="#00BC12" size="16"></u-icon>
|
</view>
|
</view>
|
<view class="list-item">
|
<view class="list-item-label">联系人信息</view>
|
<view class="list-item-row">
|
<view class="list-item-row-label">联系人</view>
|
<view class="list-item-row-val">
|
<input type="text" v-model="form.linkName" placeholder="请输入" />
|
</view>
|
</view>
|
<view class="list-item-row">
|
<view class="list-item-row-label">联系电话<b>*</b></view>
|
<view class="list-item-row-val">
|
<input type="number" v-model="form.linkPhone" placeholder="请输入" maxlength="11" />
|
</view>
|
</view>
|
</view>
|
</view>
|
<view style="width: 100%; height: 214rpx;"></view>
|
<view class="footer">
|
<view class="footer-price">
|
<view class="footer-price-info">预估总费用</view>
|
<view class="footer-price-num">
|
<text>{{totalPrice}}</text>
|
<text>元</text>
|
</view>
|
</view>
|
<view class="box-hz-btn" :style="{ backgroundImage: 'url(' + btn + ')' }">
|
<view class="box-hz-btn-kf" @click="contactPhone()">客服</view>
|
<view class="box-hz-btn-next" @click="submit">立即下单</view>
|
</view>
|
</view>
|
</template>
|
|
<view class="box" v-if="typeId !== 2">
|
<view class="box-hz" :style="{ minHeight: 'calc(100vh - env(safe-area-inset-bottom) - 94rpx - ' + ((navHeight + statusbarHeight) + 'px') + ')' }">
|
|
<!-- 用工 -->
|
<template v-if="typeId === 0">
|
<view class="box-hz-cate">
|
<view v-if="typeWork" :class="form.workType === item.id ? 'box-hz-cate-item active' : 'box-hz-cate-item'" v-for="(item, index) in typeWork" :key="index" @click="clickTypeWork(item.id)">
|
<text>{{item.name}}</text>
|
<view class="box-hz-cate-item-x" v-if="form.workType === item.id"></view>
|
</view>
|
</view>
|
<view class="box-hz-list">
|
<view class="box-hz-list-item" @click="show = true">
|
<view class="box-hz-list-item-label"><text>用工时间：</text></view>
|
<view :class="form.startDate ? 'box-hz-list-item-val active' : 'box-hz-list-item-val'">
|
<view class="box-hz-list-item-val-left">
|
<image class="icon" src="/static/icon/ic_time@2x.png" mode="widthFix"></image>
|
<text>{{ form.startDate ? form.startDate + ' 至 ' + form.endDate : '请选择用工时间'}}</text>
|
</view>
|
<u-icon name="arrow-right" color="#111111" size="16"></u-icon>
|
</view>
|
</view>
|
<view class="box-hz-list-item" @click="selectAddress(1)">
|
<view class="box-hz-list-item-label"><text>用工地点：</text></view>
|
<view :class="form.address ? 'box-hz-list-item-val active' :'box-hz-list-item-val'">
|
<view class="box-hz-list-item-val-left">
|
<image class="icon" src="/static/icon/ic_location@2x.png" mode="widthFix"></image>
|
<text>{{form.address ? form.address : '请选择用工地点'}}</text>
|
</view>
|
<u-icon name="arrow-right" color="#111111" size="16"></u-icon>
|
</view>
|
</view>
|
</view>
|
</template>
|
|
<!-- 运货 -->
|
<template v-if="typeId === 1">
|
<scroll-view class="nav-scroll" scroll-x="true">
|
<view v-if="car" :class="form.categoryId === item.id ? 'nav-item active' : 'nav-item'" v-for="(item, index) in car" :key="index" @click="clickCar(item)">
|
<text>{{item.name}}</text>
|
<view class="nav-item-x" v-if="form.categoryId === item.id"></view>
|
</view>
|
</scroll-view>
|
|
<view class="box-hz-car">
|
<view class="box-hz-car-image">
|
<image :src="carImage" mode="widthFix"></image>
|
</view>
|
<view class="box-hz-car-info" v-if="carRemark">
|
{{carRemark || ''}}
|
</view>
|
</view>
|
<view class="box-hz-list">
|
<view class="box-hz-list-item" @click="show = true">
|
<view class="box-hz-list-item-label"><text>用车时间：</text></view>
|
<view :class="form.startDate ? 'box-hz-list-item-val active' : 'box-hz-list-item-val'">
|
<view class="box-hz-list-item-val-left">
|
<image class="icon" src="/static/icon/ic_time@2x.png" mode="widthFix"></image>
|
<text>{{ form.startDate ? form.startDate + ' 至 ' + form.endDate : '请选择用车时间'}}</text>
|
</view>
|
<u-icon name="arrow-right" color="#111111" size="16"></u-icon>
|
</view>
|
</view>
|
<view class="box-hz-list-item">
|
<view class="box-hz-list-item-label">
|
<text>用车地点：</text>
|
<text @click="addAddr">+增加途经点</text>
|
</view>
|
<view class="item-d">
|
<view class="item-d-row" @click="selectAddress(2)">
|
<view class="item-d-row-icon">
|
<image src="/static/icon/ic_qidian@2x.png" mode="widthFix"></image>
|
</view>
|
<view class="item-d-row-val">
|
<text>{{form.address ? form.address : '请选择用车起点'}}</text>
|
<u-icon name="arrow-right" color="#111111" size="16"></u-icon>
|
</view>
|
</view>
|
<view class="item-d-row" v-if="form.wayInfoDTOList" v-for="(item, index) in form.wayInfoDTOList" :key="index" @click="selectAddress(4, index)">
|
<view class="item-d-row-icon">
|
<image src="/static/icon/ic_jingguo@2x.png" mode="widthFix"></image>
|
</view>
|
<view class="item-d-row-val">
|
<text>{{item.location ? item.location : '请选择途经地点'}}</text>
|
<view style="display: flex; align-items: center; flex-shrink: 0;">
|
<image src="/static/icon/ic_delete@2x.png" style="margin-right: 22rpx; width: 32rpx; height: 32rpx;" @click.stop="form.wayInfoDTOList.splice(index, 1)" mode="widthFix"></image>
|
<u-icon name="arrow-right" color="#111111" size="16"></u-icon>
|
</view>
|
</view>
|
</view>
|
<view class="item-d-row" @click="selectAddress(3)">
|
<view class="item-d-row-icon">
|
<image src="/static/icon/ic_zhongdian@2x.png" mode="widthFix"></image>
|
</view>
|
<view class="item-d-row-val">
|
<text>{{form.locationEnd ? form.locationEnd : '请选择用车终点'}}</text>
|
<u-icon name="arrow-right" color="#111111" size="16"></u-icon>
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</template>
|
<view class="box-hz-btn" :style="{ backgroundImage: 'url(' + btn + ')' }">
|
<view class="box-hz-btn-kf" @click="contactPhone()" >客服</view>
|
<view class="box-hz-btn-next" @click="jump()" v-if="typeId == 2">立即下单</view>
|
<view class="box-hz-btn-next" @click="jump()" v-if="typeId !== 2">下一步</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
|
<!-- 选择日期范围 -->
|
<u-calendar :show="show" color="#00BC12" :allowSameDay="true" mode="range" @close="show = false" @confirm="confirmDate"></u-calendar>
|
|
<u-popup :show="showPhone" round="15" mode="bottom" :safeAreaInsetBottom="true" @close="contactPhone()" :closeable="true" :closeOnClickOverlay="true">
|
<view class="phone">
|
<view class="phone-head">
|
<view></view>
|
<text>客服电话</text>
|
</view>
|
<view class="phone-item" v-if="serverPhone" v-for="(item,index) in serverPhone" :key="item" @click="contactPhoneDo(item)">
|
<view></view>
|
<text>{{item}}</text>
|
</view>
|
<view style="width: 100%; height: 30rpx;"></view>
|
<!-- <view class="phone-botton" @click="contactPhone()" >关闭</view> -->
|
</view>
|
</u-popup>
|
|
<u-modal
|
title="温馨提示"
|
:show="show1"
|
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="show1 = false">取消</view>
|
<view class="btn2" @click="getaccept1">确认</view>
|
</view>
|
</u-modal>
|
</view>
|
</template>
|
|
<script>
|
import { mapState } from 'vuex'
|
import sunuiMverify from '@/components/sunui-mverify/sunui-mverify.vue';
|
var QQMapWX = require('@/utils/qqmap-wx-jssdk.js');
|
export default {
|
components: { sunuiMverify },
|
computed: {
|
...mapState(['navHeight', 'statusbarHeight','userInfo','token','openid', 'latitude', 'longitude','address']),
|
totalPrice() {
|
return this.form.estimatedAccount / 100
|
}
|
},
|
data() {
|
return {
|
showPhone:false,
|
serverPhone:[],
|
show: false,
|
isLogin: false,
|
typeId: 0,
|
qqmapsdk: null,
|
location:{
|
latitude:null,
|
longitude:null,
|
address:null,
|
},
|
type: [
|
{ name: '用工', id: 0 },
|
{ name: '运货', id: 1 },
|
{ name: '订餐', id: 2 }
|
],
|
searchType: [
|
{ name: '全部', id: '' },
|
{ name: '用工', id: 0 },
|
{ name: '运货', id: 1 },
|
{ name: '订餐', id: 2 }
|
],
|
typeWork: [
|
{ name: '采摘工', id: 0 },
|
{ name: '分拣工', id: 1 },
|
{ name: '包装工', id: 2 }
|
],
|
sortList: [
|
{ name: '最新发布', id: 0 },
|
{ name: '距离优先', id: 1 },
|
{ name: '价格从高到低', id: 2 }
|
],
|
car: [],
|
btn: require('@/static/image/btn.png'),
|
typeViewId: 0,
|
carImage: '',
|
carRemark: '',
|
|
orderFood: [],
|
viewStatus: false,
|
|
form: {
|
startDate: '',
|
endDate: '',
|
latitude: '',
|
longitude: '',
|
location: '',
|
locationEnd: '',
|
wayInfoDTOList: [],
|
workType: 0,
|
categoryId: '',
|
categoryName: '',
|
days: '',
|
locationRemark: '',
|
supplement: '',
|
multifileList: [],
|
linkName: '',
|
linkPhone: '',
|
estimatedAccount: '',
|
price: '',
|
address: ''
|
},
|
sortType: 0,
|
orderList: [],
|
typeVal: '',
|
page: 1,
|
next: true,
|
|
isOnce: true,
|
show1: false,
|
orderId: null
|
}
|
},
|
async onLoad() {
|
await this.$onLaunched;
|
console.log('2')
|
// if (this.token && this.token != '' && this.userInfo && JSON.stringify(this.userInfo) != '{}' && this.userInfo.useIdentity === 1) {
|
// this.getOrderList()
|
// }
|
|
this.getCategoryLists()
|
this.getDictInfo()
|
|
if (this.token && this.token != '' && this.userInfo && JSON.stringify(this.userInfo) != '{}') {
|
this.form.linkPhone = this.userInfo.telephone || ''
|
this.form.linkName = this.userInfo.name || ''
|
}
|
|
this.qqmapsdk = new QQMapWX({
|
key: '4PXBZ-JLBC7-LCLXG-P2SZX-C4HYE-LDBLQ'
|
});
|
|
uni.$on('clear', (data) => {
|
this.form.startDate = ''
|
this.form.endDate = ''
|
this.form.latitude = ''
|
this.form.longitude = ''
|
this.form.location = ''
|
this.form.locationEnd = ''
|
this.form.wayInfoDTOList = []
|
this.form.workType = 0
|
this.form.days = ''
|
this.form.locationRemark = ''
|
this.form.supplement = ''
|
this.form.multifileList = []
|
this.form.estimatedAccount = ''
|
this.form.price = ''
|
this.form.address = ''
|
this.clearAll()
|
})
|
// 刷新首页数据
|
uni.$on('refresh', () => {
|
this.getCategoryLists()
|
this.getDictInfo()
|
|
if (this.token && this.token != '' && this.userInfo && JSON.stringify(this.userInfo) != '{}') {
|
this.form.linkPhone = this.userInfo.telephone
|
}
|
})
|
},
|
async onShow(options) {
|
await this.$onLaunched;
|
if(this.token && this.token != '' && this.userInfo && JSON.stringify(this.userInfo) != '{}') {
|
console.log('已登陆')
|
this.isLogin = true
|
|
// this.typeViewId = this.userInfo.useIdentity
|
// !this.isOnce &&
|
if (this.userInfo.useIdentity === 1) {
|
console.log('已登陆111')
|
this.page = 1
|
this.next = true
|
this.orderList = []
|
this.getOrderList()
|
}
|
|
} else {
|
this.isLogin = false
|
console.log('未登陆')
|
}
|
},
|
watch: {
|
typeId: {
|
handler(news, old) {
|
this.clearFormParam()
|
}
|
},
|
orderFood: {
|
deep: true,
|
handler(news, old) {
|
let price = 0
|
news.forEach(item => {
|
let num = 0
|
item.list.forEach(child => {
|
if (child.active) {
|
num = Number(child.price)
|
}
|
})
|
if (item.num && num > 0) {
|
price += num * item.num
|
}
|
})
|
console.log("========================",price)
|
this.form.price = price
|
}
|
},
|
'form.price': {
|
handler(news, old) {
|
console.log(news,"==========",old)
|
if (news != old) {
|
this.getPrice()
|
}
|
}
|
}
|
},
|
onReachBottom() {
|
if (this.token && this.token != '' && this.userInfo && JSON.stringify(this.userInfo) != '{}' && this.userInfo.useIdentity === 1) {
|
this.getOrderList()
|
}
|
},
|
methods: {
|
clearFormParam(){
|
this.form.startDate = ''
|
this.form.address = ''
|
this.form.endDate = ''
|
this.form.latitude = ''
|
this.form.longitude = ''
|
this.form.location = ''
|
this.form.locationEnd = ''
|
this.form.wayInfoDTOList = []
|
this.form.workType = 0
|
this.form.days = ''
|
this.form.locationRemark = ''
|
this.form.supplement = ''
|
this.form.multifileList = []
|
this.form.estimatedAccount = ''
|
this.form.price = ''
|
this.viewStatus = false
|
this.clearAll()
|
},
|
clear(index) {
|
this.orderFood[index].num = ''
|
this.orderFood[index].list.forEach(item => {
|
item.active = false
|
})
|
},
|
clearAll() {
|
this.orderFood.forEach(p=>{
|
p.num=null
|
p.list.forEach(item => {
|
item.active = false
|
})
|
})
|
},
|
getDictInfo(){
|
var that = this;
|
this.$u.api.getPlatformAboutUs({}).then(res =>{
|
that.serverPhone = (res.data.serverPhone||'').split(",")
|
})
|
},
|
contactPhone(){
|
this.showPhone = !this.showPhone
|
console.log("==================================",this.showPhone)
|
},
|
contactPhoneDo(phone){
|
if(phone !=null && phone!=''){
|
uni.makePhoneCall({
|
phoneNumber: phone
|
})
|
}
|
},
|
// 手动接单
|
getaccept() {
|
var that = this;
|
that.$u.api.accept({ orderId: this.orderId })
|
.then(res1 => {
|
if (res1.code === 200) {
|
uni.showToast({ title: '抢单成功！', icon: 'success', duration: 2000 })
|
setTimeout(() => {
|
that.page = 1
|
that.next = true
|
that.orderList = []
|
that.getOrderList()
|
}, 2000)
|
}
|
})
|
},
|
getaccept1() {
|
var that = this;
|
this.show1 = false
|
uni.requestSubscribeMessage({
|
tmplIds: ['AA97cHjvlPiNO4viMkVe4JifCf9TD5b5Eb7s6El3VS8','3YSC7gouRlSjHXz4CrWOGFzPmGwEBtFj4snwdfMvKHk','tDpYImlrdv-0d3euTrHbYZ1cEZvjVHTNlqHvV0tpLHg'],
|
success(res) {
|
that.getaccept()
|
},
|
fail(err) {
|
that.getaccept()
|
}
|
})
|
},
|
clickSort(id) {
|
this.sortType = id
|
this.page = 1
|
this.next = true
|
this.orderList = []
|
this.getOrderList()
|
},
|
clickCate(id) {
|
this.typeVal = id
|
this.page = 1
|
this.next = true
|
this.orderList = []
|
this.getOrderList()
|
},
|
// 订单分页
|
getOrderList() {
|
if (!this.next) return;
|
this.$u.api.orderPage({
|
capacity: 10,
|
page: this.page,
|
model: {
|
queryMyOrderType: 2,
|
type: this.typeVal,
|
sortType: this.sortType,
|
queryLat: uni.getStorageSync('address').latitude,
|
queryLgt: uni.getStorageSync('address').longitude
|
}
|
}).then(res => {
|
if (res.code !== 200) return;
|
this.isOnce = false
|
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
|
}
|
})
|
},
|
// 提交订单
|
submit() {
|
var that = this
|
if (!this.form.startDate) {
|
return uni.showToast({ title: '请选择用餐时间', icon: 'none' })
|
}
|
let cateringDTOList = []
|
let valid = true
|
let msg ='请选择'
|
that.orderFood.forEach(item => {
|
item.list.forEach(child => {
|
if (child.active) {
|
// (Number(child.price) * Number(item.num))
|
if( !item.num){
|
msg =msg +'【'+item.name+'】';
|
valid =false
|
}
|
cateringDTOList.push({
|
id:item.id,
|
name: item.name,
|
num: item.num,
|
price: child.price * 100
|
})
|
}
|
})
|
})
|
if(!valid){
|
return uni.showToast({ title: msg+'用餐份数', icon: 'none' })
|
}
|
if (cateringDTOList.length === 0) {
|
return uni.showToast({ title: '请选择用餐标准', icon: 'none' })
|
}
|
if (!this.form.address) {
|
return uni.showToast({ title: '请选择用餐地点', icon: 'none' })
|
}
|
if (!this.form.linkPhone) {
|
return uni.showToast({ title: '请输入联系电话', icon: 'none' })
|
}
|
uni.requestSubscribeMessage({
|
tmplIds: ['oVjOBLcHxIlGzOMJsdInmgI5CHGXh-UTvMzQqfFOnIg','AA97cHjvlPiNO4viMkVe4JifCf9TD5b5Eb7s6El3VS8'],
|
success(res) {
|
that.$u.api.release({
|
...that.form,
|
type: 2,
|
price: Number(that.form.price) * 100,
|
priceNum1: that.form.days,
|
location: that.form.address,
|
lat: that.form.latitude,
|
lgt: that.form.longitude,
|
cateringDTOList
|
}).then(res => {
|
if (res.code == 200) {
|
that.clearFormParam();
|
wx.requestPayment({
|
timeStamp: res.data.object.timeStamp,
|
nonceStr: res.data.object.nonceStr,
|
package: res.data.object.packageVal,
|
signType: res.data.object.signType,
|
paySign: res.data.object.paySign,
|
success (res1) {
|
if (res1.errMsg = 'requestPayment:ok') {
|
uni.showToast({ title: '支付成功', icon: 'success', duration: 2000 });
|
setTimeout(() => {
|
uni.navigateTo({
|
url: `/pages/success/success?orderId=${res.data.id}`
|
})
|
}, 1500)
|
}
|
},
|
fail(err) {
|
console.log(err)
|
}
|
})
|
}
|
})
|
console.log(cateringDTOList)
|
},
|
fail(err) {
|
console.log(err)
|
}
|
})
|
},
|
uploadImg() {
|
uni.chooseImage({
|
success: (chooseImageRes) => {
|
for (let i = 0; i < chooseImageRes.tempFilePaths.length; i++) {
|
uni.uploadFile({
|
url: this.$baseUrl + '/web/public/upload',
|
filePath: chooseImageRes.tempFilePaths[i],
|
name: 'file',
|
formData: {
|
'folder': 'orders'
|
},
|
success: (uploadFileRes) => {
|
const res = JSON.parse(uploadFileRes.data)
|
this.form.multifileList.push({
|
fileurl: res.data.imgaddr,
|
name: res.data.originname,
|
url: res.data.url,
|
type: 0
|
})
|
}
|
});
|
}
|
}
|
});
|
},
|
// 计算金额
|
getPrice() {
|
var that = this
|
if (that.form.price && that.form.days) {
|
that.$u.api.getTotal({
|
price: Number(that.form.price) * 100,
|
priceNum1: that.form.days,
|
type: 2
|
}).then(res => {
|
if (res.code === 200) {
|
that.form.estimatedAccount = res.data
|
}
|
})
|
}else{
|
that.form.estimatedAccount = 0
|
}
|
},
|
addAddr() {
|
this.form.wayInfoDTOList.push({
|
lat: '',
|
lgt: '',
|
location: ''
|
})
|
},
|
confirmDate(e) {
|
this.form.startDate = e[0]
|
this.form.endDate = e[e.length - 1]
|
|
let time = this.form.startDate == this.form.endDate ? 1 : 0
|
|
this.form.days = e.length - time;
|
this.show = false
|
if (this.typeId === 2) {
|
this.getPrice()
|
}
|
},
|
selectAddress(type, index) {
|
uni.chooseLocation({
|
success: (res) => {
|
console.log("==================",res)
|
if ([1,2].includes(type)) {
|
this.form.latitude = res.latitude
|
this.form.longitude = res.longitude
|
this.form.address = res.name ||res.address
|
} else if (type === 3) {
|
this.form.locationEnd = res.name ||res.address
|
this.form.latEnd = res.latitude
|
this.form.lgtEnd = res.longitude
|
} else if (type === 4) {
|
this.form.wayInfoDTOList[index].lat = res.latitude
|
this.form.wayInfoDTOList[index].lgt = res.longitude
|
this.form.wayInfoDTOList[index].location = res.name|| res.address
|
}else if (type == -1) {
|
console.log(res)
|
this.location.latitude = res.latitude
|
this.location.longitude = res.longitude
|
this.location.address =res.name || res.address
|
}
|
}
|
});
|
},
|
clickType(e) {
|
if (!this.token) {
|
uni.navigateTo({
|
url: '/pages/login/login'
|
})
|
return
|
}
|
this.typeId = e
|
if (e === 2) {
|
this.form.categoryId = this.car[0].id
|
this.form.categoryName = this.car[0].name
|
this.carRemark = this.car[0].remark
|
this.carImage = this.car[0].iconFull
|
}
|
},
|
clickTypeWork(e) {
|
this.form.workType = e
|
},
|
clickCar(item) {
|
this.form.categoryId = item.id
|
this.form.categoryName = item.name
|
this.carImage = item.iconFull
|
this.carRemark = item.remark
|
},
|
jump() {
|
if(!this.userInfo || !this.token){
|
uni.navigateTo({
|
url: '/pages/login/login'
|
})
|
return
|
}
|
|
const { form } = this;
|
|
// 用工
|
if (this.typeId === 0) {
|
|
if (!form.startDate || !form.endDate) {
|
return uni.showToast({ title: '请选择用工时间', icon: 'none' })
|
} else if (!form.latitude || !form.longitude) {
|
return uni.showToast({ title: '请选择用工地点', icon: 'none' })
|
}
|
|
// 采摘工
|
if (this.form.workType === 0) {
|
uni.navigateTo({
|
url: `/pages/using-workers/using-workers?days=${form.days}&startDate=${form.startDate}&endDate=${form.endDate}&latitude=${form.latitude}&longitude=${form.longitude}&address=${form.address}&workType=${form.workType}`
|
})
|
// 分拣工
|
} else if (this.form.workType === 1) {
|
uni.navigateTo({
|
url: `/pages/sorting/sorting?days=${form.days}&startDate=${form.startDate}&endDate=${form.endDate}&latitude=${form.latitude}&longitude=${form.longitude}&address=${form.address}&workType=${form.workType}`
|
})
|
// 包装工
|
} else if (this.form.workType === 2) {
|
uni.navigateTo({
|
url: `/pages/packaging-worker/packaging-worker?days=${form.days}&startDate=${form.startDate}&endDate=${form.endDate}&latitude=${form.latitude}&longitude=${form.longitude}&address=${form.address}&workType=${form.workType}`
|
})
|
}
|
// 运货
|
} else if (this.typeId === 1) {
|
|
if (!form.startDate || !form.endDate) {
|
return uni.showToast({ title: '请选择用车时间', icon: 'none' })
|
} else if (!form.latitude || !form.longitude) {
|
return uni.showToast({ title: '请选择用车起点', icon: 'none' })
|
} else if (!form.latEnd || !form.lgtEnd) {
|
return uni.showToast({ title: '请选择用车终点', icon: 'none' })
|
}
|
|
let carData = {
|
startDate: form.startDate,
|
endDate: form.endDate,
|
lat: form.latitude,
|
lgt: form.longitude,
|
location: form.address,
|
latEnd: form.latEnd,
|
lgtEnd: form.lgtEnd,
|
locationEnd: form.locationEnd,
|
wayInfoDTOList: form.wayInfoDTOList,
|
categoryId: form.categoryId,
|
categoryName: form.categoryName,
|
days: form.days
|
}
|
|
uni.setStorageSync('carData', carData);
|
|
uni.navigateTo({
|
url: `/pages/freight/freight`
|
})
|
}
|
},
|
// 选择套餐
|
selectMenu(a, b) {
|
this.orderFood.forEach((item, index) => {
|
if (index === a) {
|
item.list.forEach((child, childIndex) => {
|
child.active = b === childIndex
|
})
|
}
|
})
|
},
|
getCategoryLists() {
|
this.$u.api.getCategoryList({ type: 1 })
|
.then(res => {
|
if (res.code === 200) {
|
this.car = res.data
|
this.form.categoryId = res.data[0].id
|
this.form.categoryName = res.data[0].name
|
this.carRemark = res.data[0].remark
|
this.carImage = res.data[0].iconFull
|
}
|
})
|
this.$u.api.getCategoryList({ type: 2 })
|
.then(res => {
|
if (res.code === 200) {
|
res.data.forEach(item => {
|
item.num = ''
|
item.list = item.detailList.map(child => {
|
return {
|
active: false,
|
price: child
|
}
|
})
|
})
|
this.orderFood = res.data
|
}
|
})
|
}
|
}
|
}
|
</script>
|
|
<style>
|
page {
|
background: #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 {
|
width: 100%;
|
.index-j-head {
|
width: 100%;
|
background-color: #ffffff;
|
position: sticky;
|
top: 0;
|
left: 0;
|
z-index: 999;
|
.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;
|
}
|
}
|
}
|
.search {
|
width: 100%;
|
position: sticky;
|
left: 0;
|
z-index: 999;
|
.index-j-cate {
|
width: 100%;
|
height: 110rpx;
|
display: flex;
|
background-color: #ffffff;
|
align-items: center;
|
border-bottom: 1rpx solid #E5E5E5;
|
.index-j-cate-item {
|
flex: 1;
|
height: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
position: relative;
|
text {
|
font-weight: 400;
|
font-size: 32rpx;
|
color: #666666;
|
}
|
.index-j-cate-item-x {
|
position: absolute;
|
bottom: 0;
|
left: 50%;
|
transform: translate(-50%, 0);
|
width: 40rpx;
|
height: 6rpx;
|
background: #00BC12;
|
border-radius: 3rpx;
|
}
|
}
|
}
|
.index-j-search {
|
width: 100%;
|
height: 96rpx;
|
padding: 0 30rpx;
|
box-sizing: border-box;
|
background-color: #ffffff;
|
display: flex;
|
align-items: center;
|
.active {
|
background: rgba(91,190,56,0.08) !important;
|
font-weight: 400 !important;
|
font-size: 26rpx !important;
|
color: #4DB02B !important;
|
}
|
.index-j-search-item {
|
padding: 10rpx 20rpx;
|
box-sizing: border-box;
|
background: #F7F7F7;
|
border-radius: 28rpx;
|
font-weight: 400;
|
font-size: 26rpx;
|
color: #666666;
|
margin-right: 24rpx;
|
}
|
}
|
}
|
.index-j-list {
|
width: 100%;
|
padding: 24rpx 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%;
|
height: 100rpx;
|
padding: 6rpx;
|
box-sizing: border-box;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
.eidt-btn {
|
width: 100%;
|
height: 88rpx;
|
line-height: 88rpx;
|
text-align: center;
|
background: #00BC12;
|
border-radius: 44rpx;
|
font-weight: 500;
|
font-size: 32rpx;
|
color: #FFFFFF;
|
}
|
// background: #00BC12;
|
// border-radius: 50rpx;
|
// text {
|
// font-weight: 500;
|
// font-size: 36rpx;
|
// color: #FFFFFF;
|
// }
|
}
|
.index-list-item-price {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
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;
|
}
|
}
|
.index-list-item-head-r {
|
font-weight: 400;
|
font-size: 28rpx;
|
color: #888888;
|
}
|
}
|
}
|
}
|
}
|
.index-c {
|
width: 100%;
|
height: 520rpx;
|
background: linear-gradient(#00BC12 0%, #00BC12 83%, #ffffff 100%);
|
.index-c-title {
|
width: 100%;
|
padding: 0 30rpx;
|
box-sizing: border-box;
|
display: flex;
|
align-items: center;
|
.index-c-title-logo {
|
font-weight: bold;
|
font-size: 40rpx;
|
color: #FFFFFF;
|
margin-right: 30rpx;
|
}
|
.dingwei {
|
width: 36rpx;
|
height: 36rpx;
|
margin-right: 8rpx;
|
}
|
text {
|
font-weight: 500;
|
font-size: 32rpx;
|
color: #ffffff;
|
margin-right: 12rpx;
|
max-width: 280rpx;
|
white-space: nowrap;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
}
|
.qu {
|
width: 22rpx;
|
height: 22rpx;
|
}
|
}
|
.list {
|
width: 100%;
|
display: flex;
|
padding: 0 30rpx 30rpx 30rpx;
|
box-sizing: border-box;
|
flex-direction: column;
|
margin-top: 26rpx;
|
.list-item {
|
width: 100%;
|
padding: 40rpx 30rpx;
|
box-sizing: border-box;
|
background-color: #ffffff;
|
border-radius: 20rpx;
|
margin-bottom: 20rpx;
|
&:last-child {
|
margin: 0 !important;
|
}
|
.list-item-label {
|
font-weight: 600;
|
font-size: 32rpx;
|
color: #222222;
|
margin-bottom: 28rpx;
|
}
|
.list-item-zk {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
text {
|
font-weight: 400;
|
font-size: 28rpx;
|
color: #00BC12;
|
margin-right: 8rpx;
|
}
|
}
|
.list-item-row {
|
width: 100%;
|
display: flex;
|
flex-direction: column;
|
border-bottom: 1rpx solid #E5E5E5;
|
margin-bottom: 30rpx;
|
&:last-child {
|
margin: 0 !important;
|
}
|
.list-item-row-label {
|
font-weight: 400;
|
font-size: 28rpx;
|
color: #666666;
|
display: flex;
|
align-items: center;
|
b {
|
color: red;
|
}
|
}
|
.list-item-row-user {
|
width: 100%;
|
display: flex;
|
flex-direction: column;
|
.user-item {
|
width: 100%;
|
padding: 30rpx 0;
|
box-sizing: border-box;
|
display: flex;
|
align-items: center;
|
margin-bottom: 30rpx;
|
justify-content: space-between;
|
border-bottom: 1rpx solid #E5E5E5;
|
&:last-child {
|
margin: 0 !important;
|
}
|
text {
|
flex-shrink: 0;
|
font-weight: 400;
|
font-size: 30rpx;
|
color: #333333;
|
}
|
input {
|
flex: 1;
|
text-align: center;
|
margin: 0 30rpx;
|
font-weight: 400;
|
font-size: 30rpx;
|
color: #222222;
|
}
|
}
|
}
|
.list-item-row-radio {
|
width: 100%;
|
display: flex;
|
padding: 30rpx 0;
|
box-sizing: border-box;
|
flex-direction: column;
|
// border-bottom: 1rpx solid #E5E5E5;
|
.radio-item {
|
width: 100%;
|
display: flex;
|
align-items: flex-start;
|
margin-bottom: 30rpx;
|
border-bottom: 1rpx solid #E5E5E5;
|
&:last-child {
|
border: none;
|
}
|
&:last-child {
|
margin: 0 !important;
|
}
|
.radio-item-label {
|
width: 200rpx;
|
flex-shrink: 0;
|
font-weight: 400;
|
font-size: 30rpx;
|
color: #111111;
|
}
|
.radio-item-list {
|
flex: 1;
|
display: flex;
|
flex-direction: column;
|
.radio-item-list-l {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
flex-wrap: wrap;
|
.active {
|
background: #00BC12 !important;
|
color: #ffffff !important;
|
}
|
.radio-item-list-item {
|
width: 124rpx;
|
height: 72rpx;
|
line-height: 72rpx;
|
text-align: center;
|
background: #EEEEEE;
|
border-radius: 36rpx;
|
font-weight: 400;
|
font-size: 28rpx;
|
color: #111111;
|
margin-top: 30rpx;
|
&:nth-child(1) {
|
margin-top: 0 !important;
|
}
|
&:nth-child(2) {
|
margin-top: 0 !important;
|
}
|
&:nth-child(3) {
|
margin-top: 0 !important;
|
}
|
}
|
}
|
.radio-item-list-data {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: flex-end;
|
margin-top: 42rpx;
|
margin-bottom: 34rpx;
|
.radio-item-list-data-btn {
|
width: 110rpx;
|
height: 64rpx;
|
line-height: 64rpx;
|
margin-left: 20rpx;
|
font-weight: 400;
|
font-size: 24rpx;
|
color: #666666;
|
text-align: center;
|
border: 1rpx solid #B2B2B2;
|
border-radius: 34rpx;
|
}
|
text {
|
font-weight: 400;
|
font-size: 30rpx;
|
color: #333333;
|
}
|
input {
|
width: 100rpx;
|
font-weight: bold;
|
font-size: 30rpx;
|
color: #222222;
|
text-align: right;
|
margin: 0 30rpx;
|
&::-webkit-input-placeholder {
|
color: #999999;
|
font-weight: 400;
|
}
|
}
|
}
|
}
|
}
|
}
|
.list-item-row-upload {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
flex-wrap: wrap;
|
padding: 30rpx 0;
|
box-sizing: border-box;
|
.upload-item {
|
width: 156rpx;
|
height: 156rpx;
|
display: flex;
|
align-items: center;
|
flex-direction: column;
|
justify-content: center;
|
background: #F8F9FB;
|
border-radius: 8rpx;
|
margin-right: 20rpx;
|
border: 2rpx solid #EEEEEE;
|
position: relative;
|
&:last-child {
|
margin: 0 !important;
|
}
|
image {
|
width: 100%;
|
}
|
text {
|
font-weight: 400;
|
font-size: 26rpx;
|
color: #666666;
|
margin-top: 16rpx;
|
}
|
.upload-item-dele {
|
position: absolute;
|
top: -20rpx;
|
right: -20rpx;
|
width: 40rpx;
|
height: 40rpx;
|
z-index: 9;
|
}
|
}
|
}
|
.list-item-row-val {
|
width: 100%;
|
padding: 30rpx 0;
|
box-sizing: border-box;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
text {
|
font-weight: 400;
|
font-size: 30rpx;
|
color: #111111;
|
}
|
input {
|
width: 100%;
|
font-weight: 400;
|
font-size: 30rpx;
|
color: #222222;
|
}
|
textarea {
|
width: 100%;
|
height: 90rpx;
|
font-weight: 400;
|
font-size: 30rpx;
|
color: #111111;
|
}
|
}
|
}
|
}
|
}
|
.index-c-cate {
|
width: 100%;
|
padding: 0 30rpx;
|
box-sizing: border-box;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
margin-top: 28rpx;
|
.active {
|
background: #FFFFFF !important;
|
color: #5BBE38 !important;
|
}
|
.index-c-cate-item {
|
width: 128rpx;
|
height: 64rpx;
|
line-height: 64rpx;
|
text-align: center;
|
border-radius: 32rpx;
|
font-weight: 400;
|
font-size: 32rpx;
|
color: #FFFFFF;
|
}
|
}
|
.footer {
|
width: 100%;
|
height: 214rpx;
|
padding: 20rpx 30rpx;
|
box-sizing: border-box;
|
position: fixed;
|
bottom: 0;
|
left: 0;
|
z-index: 9;
|
display: flex;
|
flex-direction: column;
|
justify-content: space-between;
|
background: #FFFFFF;
|
box-shadow: 0rpx -2rpx 4rpx 0rpx rgba(0,0,0,0.06);
|
.footer-price {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
.footer-price-info {
|
font-weight: 400;
|
font-size: 30rpx;
|
color: #222222;
|
}
|
.footer-price-num {
|
display: flex;
|
align-items: center;
|
text {
|
&:nth-child(1) {
|
font-weight: 500;
|
font-size: 40rpx;
|
color: #FF0000;
|
margin-right: 20rpx;
|
}
|
&:nth-child(2) {
|
font-weight: 400;
|
font-size: 30rpx;
|
color: #222222;
|
}
|
}
|
}
|
}
|
.box-hz-btn {
|
width: 100%;
|
height: 88rpx;
|
background-repeat: no-repeat;
|
background-size: 100% 100%;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
.box-hz-btn-kf {
|
flex-shrink: 0;
|
width: 188rpx;
|
height: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
font-weight: 500;
|
font-size: 32rpx;
|
color: #8B2300;
|
}
|
.box-hz-btn-next {
|
flex: 1;
|
height: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
font-weight: 500;
|
font-size: 32rpx;
|
color: #FFFFFF;
|
}
|
}
|
// .footer-bottom {
|
// width: 100%;
|
// display: flex;
|
// align-items: center;
|
// justify-content: space-between;
|
// .footer-bottom-kf {
|
// flex-shrink: 0;
|
// margin-right: 40rpx;
|
// display: flex;
|
// flex-direction: column;
|
// align-items: center;
|
// justify-content: center;
|
// image {
|
// width: 36rpx;
|
// height: 36rpx;
|
// }
|
// text {
|
// font-weight: 400;
|
// font-size: 24rpx;
|
// color: #222222;
|
// margin-top: 8rpx;
|
// }
|
// }
|
// .footer-bottom-btn {
|
// flex: 1;
|
// height: 88rpx;
|
// display: flex;
|
// align-items: center;
|
// justify-content: center;
|
// background: #00BC12;
|
// box-shadow: 0rpx 8rpx 12rpx 0rpx rgba(91,190,56,0.16);
|
// border-radius: 44rpx;
|
// text {
|
// &:nth-child(1) {
|
// font-weight: 500;
|
// font-size: 32rpx;
|
// color: #FFFFFF;
|
// }
|
// &:nth-child(2) {
|
// font-weight: 500;
|
// font-size: 26rpx;
|
// color: #FFFFFF;
|
// }
|
// }
|
// }
|
// }
|
}
|
.box {
|
width: 100%;
|
padding: 0 30rpx 30rpx 30rpx;
|
box-sizing: border-box;
|
margin-top: 30rpx;
|
.box-hz {
|
width: 100%;
|
padding: 40rpx 30rpx;
|
border-radius: 20rpx;
|
box-sizing: border-box;
|
background-color: #FFFFFF;
|
.box-hz-car {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
flex-direction: column;
|
margin-top: 24rpx;
|
margin-bottom: 40rpx;
|
.box-hz-car-image {
|
width: 432rpx;
|
height: 200rpx;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
overflow: hidden;
|
image {
|
width: 100%;
|
}
|
}
|
.box-hz-car-info {
|
width: 100%;
|
padding: 24rpx;
|
box-sizing: border-box;
|
background: #F7F7F7;
|
font-weight: 400;
|
font-size: 26rpx;
|
color: #666666;
|
border-radius: 16rpx;
|
margin-top: 30rpx;
|
}
|
}
|
.nav-scroll {
|
white-space: nowrap; /* 防止导航项换行 */
|
margin-bottom: 50rpx;
|
height: 66rpx;
|
overflow: auto; /* 允许滚动条出现 */
|
.nav-item {
|
display: inline-block; /* 使导航项水平排列 */
|
margin-right: 60rpx;
|
position: relative;
|
text {
|
font-weight: 400;
|
font-size: 30rpx;
|
color: #666666;
|
}
|
.nav-item-x {
|
width: 40rpx;
|
height: 6rpx;
|
position: absolute;
|
bottom: -10rpx;
|
left: 50%;
|
transform: translate(-50%, 0);
|
background: #FF5A40;
|
border-radius: 3rpx;
|
}
|
// padding: 10px 20px; /* 设置内边距 */
|
// margin-right: 10px; /* 设置右边距 */
|
// background-color: #f0f0f0; /* 设置背景色 */
|
// border: 1px solid #ddd; /* 设置边框 */
|
// border-radius: 5px; /* 设置圆角 */
|
}
|
.active {
|
text {
|
font-weight: 600 !important;
|
font-size: 32rpx !important;
|
color: #222222 !important;
|
}
|
}
|
}
|
.box-hz-cate {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
margin-bottom: 50rpx;
|
.active {
|
text {
|
font-weight: 600 !important;
|
font-size: 32rpx !important;
|
color: #222222 !important;
|
}
|
}
|
.box-hz-cate-item {
|
position: relative;
|
margin-right: 60rpx;
|
text {
|
font-weight: 400;
|
font-size: 30rpx;
|
color: #666666;
|
}
|
.box-hz-cate-item-x {
|
width: 40rpx;
|
height: 6rpx;
|
position: absolute;
|
bottom: -10rpx;
|
left: 50%;
|
transform: translate(-50%, 0);
|
background: #FF5A40;
|
border-radius: 3rpx;
|
}
|
}
|
}
|
.box-hz-list {
|
width: 100%;
|
.box-hz-list-item {
|
width: 100%;
|
display: flex;
|
flex-direction: column;
|
margin-bottom: 40rpx;
|
.item-d {
|
width: 100%;
|
padding: 0 30rpx;
|
box-sizing: border-box;
|
background: #FFFCF9;
|
border-radius: 16rpx;
|
border: 2rpx solid #FD9E24;
|
.item-d-row {
|
width: 100%;
|
// height: 100rpx;
|
height: auto;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
.item-d-row-icon {
|
width: 36rpx;
|
height: 36rpx;
|
flex-shrink: 0;
|
margin-right: 24rpx;
|
image {
|
width: 100%;
|
height: 100%;
|
}
|
}
|
.item-d-row-val {
|
flex: 1;
|
// height: 100%;
|
padding: 30rpx 0;
|
box-sizing: border-box;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
border-bottom: 1rpx solid #E5E5E5;
|
text {
|
flex: 1;
|
font-weight: 400;
|
font-size: 32rpx;
|
color: #111111;
|
}
|
image {
|
flex-shrink: 0;
|
width: 30rpx;
|
height: 30rpx;
|
}
|
}
|
}
|
}
|
.box-hz-list-item-label {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
margin-bottom: 30rpx;
|
text {
|
&:nth-child(1) {
|
font-weight: 400;
|
font-size: 28rpx;
|
color: #666666;
|
}
|
&:nth-child(2) {
|
font-weight: 400;
|
font-size: 28rpx;
|
color: #5BBE38;
|
}
|
}
|
}
|
.active {
|
background: rgba(91,190,56,0.06) !important;
|
border: 2rpx solid #5BBE38 !important;
|
}
|
.box-hz-list-item-val {
|
width: 100%;
|
height: 104rpx;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
background: #FFFCF9;
|
border-radius: 16rpx;
|
padding: 0 30rpx;
|
box-sizing: border-box;
|
border: 2rpx solid #FD9E24;
|
.box-hz-list-item-val-left {
|
flex: 1;
|
height: 100%;
|
display: flex;
|
align-items: center;
|
.icon {
|
width: 36rpx;
|
height: 36rpx;
|
margin-right: 24rpx;
|
flex-shrink: 0;
|
}
|
text {
|
width: 470rpx;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
white-space: nowrap;
|
font-weight: 400;
|
font-size: 32rpx;
|
color: #111111;
|
}
|
}
|
}
|
}
|
}
|
.list {
|
width: 100%;
|
display: flex;
|
flex-direction: column;
|
.list-label {
|
font-weight: 600;
|
font-size: 32rpx;
|
color: #222222;
|
}
|
}
|
.box-hz-btn {
|
width: 100%;
|
height: 88rpx;
|
background-repeat: no-repeat;
|
background-size: 100% 100%;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
.box-hz-btn-kf {
|
flex-shrink: 0;
|
width: 188rpx;
|
height: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
font-weight: 500;
|
font-size: 32rpx;
|
color: #8B2300;
|
}
|
.box-hz-btn-next {
|
flex: 1;
|
height: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
font-weight: 500;
|
font-size: 32rpx;
|
color: #FFFFFF;
|
}
|
}
|
}
|
}
|
}
|
.phone {
|
width: 100%;
|
padding-top: 40rpx;
|
box-sizing: border-box;
|
.phone-botton {
|
width: 100%;
|
height: 88rpx;
|
line-height: 88rpx;
|
text-align: center;
|
font-weight: 500;
|
font-size: 32rpx;
|
color: #FFFFFF;
|
background: #00BC12;
|
border-radius: 44rpx;
|
margin-top: 60rpx;
|
}
|
.phone-head {
|
width: 100%;
|
text-align: center;
|
justify-content: space-between;
|
margin-bottom: 40rpx;
|
text {
|
font-weight: 800;
|
font-size: 32rpx;
|
color: #222222;
|
}
|
}
|
.phone-item {
|
width: 100%;
|
text-align: center;
|
justify-content: space-between;
|
border-bottom: 1rpx solid #eeeeee;
|
line-height: 78rpx;
|
text {
|
font-weight: 500;
|
font-size: 28rpx;
|
line-height: 28rpx;
|
color: #222222;
|
}
|
}
|
}
|
}
|
</style>
|
