预约车功能完善
This commit is contained in:
BianLzhaoMin
parent
82c3b82cbb
commit
11afe7418d
33
src/App.vue
33
src/App.vue
|
|
@ -1,9 +1,30 @@
|
|||
<script>
|
||||
export default {
|
||||
onLaunch: function () {},
|
||||
onShow: function () {},
|
||||
onHide: function () {},
|
||||
}
|
||||
<script setup>
|
||||
import { onShow } from '@dcloudio/uni-app'
|
||||
|
||||
import { useMemberStore } from '@/stores/index.js'
|
||||
const memberStore = useMemberStore()
|
||||
// export default {
|
||||
// onLaunch: function () {},
|
||||
// onShow: function () {
|
||||
// // console.log(memberStore.userType, 'memberStore.userType')
|
||||
// // if (memberStore.userType === 2) {
|
||||
// // uni.setTabBarItem({
|
||||
// // index: 2,
|
||||
// // visible: true,
|
||||
// // })
|
||||
// // }
|
||||
// },
|
||||
// onHide: function () {},
|
||||
// }
|
||||
|
||||
onShow(() => {
|
||||
if (memberStore.userType === 2) {
|
||||
uni.setTabBarItem({
|
||||
index: 2,
|
||||
visible: true,
|
||||
})
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
|
|
|||
|
|
@ -76,7 +76,7 @@ const onSearchBtn = () => {
|
|||
left: 0;
|
||||
transform: translateY(100%);
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
|
||||
transition: all 0.5s;
|
||||
transition: all 2s;
|
||||
background-color: #fff;
|
||||
z-index: 9;
|
||||
view {
|
||||
|
|
|
|||
|
|
@ -28,10 +28,11 @@
|
|||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
// 预约车
|
||||
{
|
||||
"path": "pages/cart/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "预约车"
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
|
|
@ -46,16 +47,18 @@
|
|||
"navigationBarTitleText": "我的"
|
||||
}
|
||||
},
|
||||
// 装备详情
|
||||
{
|
||||
"path": "pages/goods-details/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "装备详情"
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
// 订单结算
|
||||
{
|
||||
"path": "pages/order/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "订单结算"
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
// 装备列表大厅
|
||||
|
|
@ -76,7 +79,8 @@
|
|||
{
|
||||
"pagePath": "pages/index/index",
|
||||
"text": "首页",
|
||||
"iconPath": "static/tab-bar/home_sel.png"
|
||||
"iconPath": "static/tab-bar/home.png",
|
||||
"selectedIconPath": "static/tab-bar/home_sel.png"
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/lease-demand/index",
|
||||
|
|
@ -88,12 +92,14 @@
|
|||
"pagePath": "pages/cart/index",
|
||||
"text": "预约车",
|
||||
"iconPath": "static/tab-bar/car.png",
|
||||
"selectedIconPath": "static/tab-bar/car_sel.png",
|
||||
"visible": false
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/message/index",
|
||||
"text": "消息",
|
||||
"iconPath": "static/tab-bar/message.png"
|
||||
"iconPath": "static/tab-bar/message.png",
|
||||
"selectedIconPath": "static/tab-bar/message_sel.png"
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/my/index",
|
||||
|
|
|
|||
|
|
@ -1,18 +1,577 @@
|
|||
<template>
|
||||
<!-- 预约车 -->
|
||||
<view class="content">
|
||||
<van-empty description="预约车欢迎您" />
|
||||
<view class="h5-container cart-container">
|
||||
<view class="nav-header">
|
||||
<view style="display: flex; align-items: center">
|
||||
<van-icon name="arrow-left" @click="onClickLeft()" />
|
||||
<van-image height="1rem" width="3rem" :src="cartImg" />
|
||||
<text> ({{ amountNum }}) </text>
|
||||
</view>
|
||||
<van-button
|
||||
round
|
||||
style="padding: 0 20px"
|
||||
type="primary"
|
||||
size="mini"
|
||||
class="primary-lease"
|
||||
>
|
||||
管理
|
||||
</van-button>
|
||||
</view>
|
||||
|
||||
<scroll-view scroll-y :style="{ paddingBottom: actionBarHeight + 'px' }">
|
||||
<view class="order-set" v-for="(item, index) in cartList" :key="index">
|
||||
<van-row>
|
||||
<van-col span="2">
|
||||
<van-checkbox-group
|
||||
v-model="item.isChecked"
|
||||
icon-size="16px"
|
||||
@click="onChangeAllCheckbox(index)"
|
||||
>
|
||||
<van-checkbox name="1"> </van-checkbox>
|
||||
</van-checkbox-group>
|
||||
</van-col>
|
||||
<van-col span="12">
|
||||
<view class="company-box">
|
||||
<van-image
|
||||
fit="cover"
|
||||
width="1.5rem"
|
||||
height="1.2rem"
|
||||
:src="companyImg"
|
||||
/>
|
||||
<view class="company-name">
|
||||
<view> {{ item.companyPersonPhoneKey.companyName }} </view>
|
||||
<van-image fit="cover" height="0.5rem" :src="companyBg" />
|
||||
</view>
|
||||
</view>
|
||||
</van-col>
|
||||
<van-col span="10" class="contacts">
|
||||
联系人： {{ item.companyPersonPhoneKey.person }}
|
||||
{{ item.companyPersonPhoneKey.personPhone }}
|
||||
</van-col>
|
||||
</van-row>
|
||||
|
||||
<view v-for="(goods, i) in item.devInfoVoList" :key="i">
|
||||
<van-row>
|
||||
<van-col span="2">
|
||||
<van-checkbox-group
|
||||
v-model="goods.isChecked"
|
||||
icon-size="16px"
|
||||
@click="onChangeCheckbox(index)"
|
||||
>
|
||||
<van-checkbox name="1"> </van-checkbox>
|
||||
</van-checkbox-group>
|
||||
</van-col>
|
||||
<van-col span="22">
|
||||
<view class="items-info">
|
||||
<van-image
|
||||
fit="cover"
|
||||
height="4rem"
|
||||
width="4rem"
|
||||
:src="goods.picUrl"
|
||||
/>
|
||||
<view class="info">
|
||||
<view style="color: #000">{{ goods.deviceName }}</view>
|
||||
<view>装备编号：{{ goods.code }}</view>
|
||||
<view>装备型号：{{ goods.typeName }}</view>
|
||||
<view style="display: flex; align-items: center">
|
||||
租赁金额：
|
||||
<text style="color: var(--van-submit-bar-price-color)">
|
||||
￥{{ goods.dayLeasePrice }}/天
|
||||
</text>
|
||||
|
||||
<van-stepper
|
||||
style="margin-left: 20px"
|
||||
button-size="16"
|
||||
:max="goods.deviceCount"
|
||||
v-model="goods.num"
|
||||
/>
|
||||
</view>
|
||||
<view class="items-info">
|
||||
{{ goods.rentBeginTime ? goods.rentBeginTime : '开始日期' }}
|
||||
<van-image
|
||||
width="1rem"
|
||||
height="1rem"
|
||||
:src="dateIcon"
|
||||
style="margin: 0 6px"
|
||||
@click="onSelectTime(1, index, i)"
|
||||
/>
|
||||
{{ goods.rentEndTime ? goods.rentEndTime : '结束日期' }}
|
||||
<van-image
|
||||
width="1rem"
|
||||
height="1rem"
|
||||
:src="dateIcon"
|
||||
style="margin: 0 6px"
|
||||
@click="onSelectTime(2, index, i)"
|
||||
/>
|
||||
</view>
|
||||
<view>
|
||||
租赁天数：
|
||||
{{ goods.days }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</van-col>
|
||||
<!-- <van-col span="5">
|
||||
|
||||
</van-col> -->
|
||||
</van-row>
|
||||
|
||||
<van-row style="margin-top: 14px">
|
||||
总金额：
|
||||
<view style="color: var(--van-submit-bar-price-color)">
|
||||
<text> ￥ </text>
|
||||
<text style="font-size: 16px; font-weight: bold">
|
||||
{{ goods.num * goods.dayLeasePrice * goods.days }}
|
||||
</text>
|
||||
</view>
|
||||
</van-row>
|
||||
</view>
|
||||
<van-row style="padding: 10px 0; margin-top: 10px; border-top: 1px solid #ccc">
|
||||
<van-checkbox-group
|
||||
v-model="item.protocolChecked"
|
||||
shape="square"
|
||||
icon-size="16px"
|
||||
>
|
||||
<van-checkbox name="1">
|
||||
我已阅读并同意
|
||||
<text class="protocol" @click.stop="onViewProtocol">
|
||||
《xxx公司协议》
|
||||
</text>
|
||||
</van-checkbox>
|
||||
</van-checkbox-group>
|
||||
</van-row>
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
<van-popup v-model:show="showBottom" position="bottom" :destroy-on-close="true">
|
||||
<van-date-picker
|
||||
v-model="leaseTime"
|
||||
@confirm="onConfirm"
|
||||
@cancel="onCancel"
|
||||
:min-date="minDate"
|
||||
:max-date="maxDate"
|
||||
title="选择日期"
|
||||
/>
|
||||
</van-popup>
|
||||
|
||||
<van-popup v-model:show="showBottomAddress" position="bottom">
|
||||
<van-address-list
|
||||
v-model="chosenAddressId"
|
||||
:list="addressList"
|
||||
:show-add-button="false"
|
||||
@click-item="onClickAddress"
|
||||
/>
|
||||
</van-popup>
|
||||
|
||||
<van-submit-bar
|
||||
button-color="#579d92"
|
||||
button-text="提交"
|
||||
:price="totalPrice"
|
||||
@submit="onSubmitOrder"
|
||||
>
|
||||
<template #default>
|
||||
<view class="amount"> 共计 {{ amountDevice }} 件装备 </view>
|
||||
</template>
|
||||
<template #tip>
|
||||
<text @click="onClickLink">
|
||||
{{ address.length === 0 ? '请选择收货地址' : `收货地址：${address}` }}
|
||||
</text>
|
||||
</template>
|
||||
</van-submit-bar>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
import companyImg from '@/static/goods/company-img.png'
|
||||
import companyBg from '@/static/goods/company-bg.png'
|
||||
import cartImg from '@/static/cart/cart.png'
|
||||
import dateIcon from '@/static/goods/date-icon.png'
|
||||
import { computed, nextTick, ref } from 'vue'
|
||||
import { onHide, onLoad, onShow } from '@dcloudio/uni-app'
|
||||
import { getBookCarDetailsAPI, getAddressListAPI, submitBookCarAPI } from '@/services/cart/index.js'
|
||||
import moment from 'moment'
|
||||
const cartList = ref([])
|
||||
const showBottom = ref(false)
|
||||
const showBottomAddress = ref(false)
|
||||
const minDate = new Date(moment().format('YYYY'), moment().format('MM') - 1, moment().format('DD'))
|
||||
const maxDate = new Date(moment().format('YYYY') * 1 + 100, 12, 31)
|
||||
const timeType = ref(0)
|
||||
const activeIndex = ref(0)
|
||||
const goodsIndex = ref(0)
|
||||
const leaseTime = ref()
|
||||
const address = ref('')
|
||||
const actionBarHeight = ref()
|
||||
const chosenAddressId = ref()
|
||||
const addressList = ref([])
|
||||
const onClickLeft = () => {
|
||||
uni.showTabBar()
|
||||
uni.switchTab({
|
||||
url: '/pages/index/index',
|
||||
})
|
||||
}
|
||||
const onSubmitOrder = async () => {
|
||||
if (amountDevice.value < 1) {
|
||||
showFailToast('请选择装备')
|
||||
return
|
||||
}
|
||||
let isDays = false
|
||||
try {
|
||||
amountDeviceList.value.forEach((e) => {
|
||||
if (e.days < 1) {
|
||||
showFailToast('有装备租期未选择或租期为0，请重新选择后再提交')
|
||||
isDays = true
|
||||
throw new Error()
|
||||
}
|
||||
})
|
||||
} catch (error) {}
|
||||
|
||||
if (isDays) return
|
||||
|
||||
let isRead = false
|
||||
try {
|
||||
cartList.value.forEach((e) => {
|
||||
const isSelect = e.devInfoVoList.some((j) => j.isChecked?.length > 0)
|
||||
if (isSelect && e.protocolChecked.length == 0) {
|
||||
showFailToast('请阅读公司合同')
|
||||
isRead = true
|
||||
throw new Error()
|
||||
}
|
||||
})
|
||||
} catch (error) {}
|
||||
|
||||
if (isRead) return
|
||||
|
||||
if (address.value.length == 0) {
|
||||
showFailToast('请选择收货地址')
|
||||
return
|
||||
}
|
||||
|
||||
// 组装参数
|
||||
const detailsList = amountDeviceList.value.map((e) => {
|
||||
return {
|
||||
maId: e.maId,
|
||||
id: e.id,
|
||||
rentBeginTime: e.rentBeginTime + ' ' + '00:00:00',
|
||||
rentEndTime: e.rentEndTime + ' ' + '00:00:00',
|
||||
manageType: e.manageType,
|
||||
days: e.days,
|
||||
num: e.num,
|
||||
costs: e.num * e.days * e.dayLeasePrice,
|
||||
}
|
||||
})
|
||||
|
||||
const paramsList = []
|
||||
cartList.value.forEach((j, index) => {
|
||||
let itemsArray = []
|
||||
j.devInfoVoList.forEach((e) => {
|
||||
if (e.isChecked?.length > 0) {
|
||||
itemsArray.push({
|
||||
maId: e.maId,
|
||||
id: e.id,
|
||||
rentBeginTime: e.rentBeginTime + '00:00:00',
|
||||
rentEndTime: e.rentEndTime + '23:59:59',
|
||||
manageType: e.manageType,
|
||||
days: e.days,
|
||||
num: e.num,
|
||||
costs: e.num * e.days * e.dayLeasePrice,
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
if (itemsArray.length > 0) {
|
||||
paramsList[index] = {
|
||||
cost: 0,
|
||||
detailsList: itemsArray,
|
||||
address: address.value,
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
paramsList.forEach((e) => {
|
||||
e.cost = e.detailsList.reduce((accumulator, currentValue) => {
|
||||
return accumulator + currentValue.costs
|
||||
}, 0)
|
||||
})
|
||||
|
||||
console.log(paramsList, 'paramsList')
|
||||
const res = await submitBookCarAPI(paramsList)
|
||||
if (res.code === 200) {
|
||||
showSuccessToast('提交成功')
|
||||
getDeviceDetailsData()
|
||||
}
|
||||
}
|
||||
const onViewProtocol = () => {}
|
||||
const onSelectTime = (type, index, goodsI) => {
|
||||
timeType.value = type
|
||||
activeIndex.value = index
|
||||
goodsIndex.value = goodsI
|
||||
showBottom.value = true
|
||||
}
|
||||
const onConfirm = () => {
|
||||
if (timeType.value === 1) {
|
||||
cartList.value[activeIndex.value].devInfoVoList[goodsIndex.value].rentBeginTime =
|
||||
leaseTime.value.join('-')
|
||||
} else {
|
||||
if (
|
||||
moment(leaseTime.value.join('-')).isBefore(
|
||||
moment(
|
||||
cartList.value[activeIndex.value].devInfoVoList[goodsIndex.value].rentBeginTime,
|
||||
),
|
||||
)
|
||||
) {
|
||||
showFailToast('租赁结束日期不能小于租赁开始日期')
|
||||
return
|
||||
} else {
|
||||
cartList.value[activeIndex.value].devInfoVoList[goodsIndex.value].rentEndTime =
|
||||
leaseTime.value.join('-')
|
||||
cartList.value[activeIndex.value].devInfoVoList[goodsIndex.value].days = moment(
|
||||
leaseTime.value.join('-'),
|
||||
).diff(
|
||||
cartList.value[activeIndex.value].devInfoVoList[goodsIndex.value].rentBeginTime,
|
||||
'day',
|
||||
)
|
||||
}
|
||||
}
|
||||
showBottom.value = false
|
||||
leaseTime.value = []
|
||||
}
|
||||
const onCancel = () => {
|
||||
showBottom.value = false
|
||||
}
|
||||
|
||||
// 获取预约车列表
|
||||
const getDeviceDetailsData = async () => {
|
||||
const { data: res } = await getBookCarDetailsAPI()
|
||||
cartList.value = res
|
||||
cartList.value.forEach((e) => {
|
||||
e.isChecked = []
|
||||
e.protocolChecked = []
|
||||
e.devInfoVoList.forEach((j) => {
|
||||
e.isChecked = []
|
||||
j.days = 0
|
||||
j.num = 1
|
||||
j.costs = 0
|
||||
j.rentBeginTime = ''
|
||||
j.rentEndTime = ''
|
||||
j.lease_date = null
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
// 获取地址
|
||||
const getAddressListData = async () => {
|
||||
const { rows: res } = await getAddressListAPI()
|
||||
addressList.value = res.map((e, index) => {
|
||||
return {
|
||||
id: index,
|
||||
name: '',
|
||||
tel: '',
|
||||
address: `${e.provinceName}${e.cityName}${e.areaName}${e.address}`,
|
||||
isDefault: false,
|
||||
}
|
||||
})
|
||||
}
|
||||
const totalPrice = computed(() => {
|
||||
let orderAmountPice = 0
|
||||
cartList.value.forEach((e) => {
|
||||
e.devInfoVoList.forEach((g) => {
|
||||
if (g.isChecked?.length > 0) {
|
||||
orderAmountPice = g.num * g.dayLeasePrice * g.days + orderAmountPice
|
||||
}
|
||||
})
|
||||
})
|
||||
return orderAmountPice * 100
|
||||
})
|
||||
|
||||
// 计算所有装备
|
||||
const amountNum = computed(() => {
|
||||
let amountNum = 0
|
||||
cartList.value.forEach((e) => {
|
||||
amountNum = e.devInfoVoList.length + amountNum
|
||||
})
|
||||
return amountNum
|
||||
})
|
||||
|
||||
// 已勾选的装备列表
|
||||
const amountDeviceList = computed(() => {
|
||||
let selectList = []
|
||||
cartList.value.forEach((e) => {
|
||||
e.devInfoVoList.forEach((g) => {
|
||||
if (g.isChecked?.length > 0) {
|
||||
selectList.push(g)
|
||||
}
|
||||
})
|
||||
})
|
||||
return selectList
|
||||
})
|
||||
|
||||
const amountDevice = computed(() => {
|
||||
let amountNum = 0
|
||||
cartList.value.forEach((e) => {
|
||||
e.devInfoVoList.forEach((g) => {
|
||||
if (g.isChecked?.length > 0) {
|
||||
amountNum++
|
||||
}
|
||||
})
|
||||
})
|
||||
return amountNum
|
||||
})
|
||||
|
||||
const onChangeAllCheckbox = (index) => {
|
||||
cartList.value[index].devInfoVoList.forEach((j) => {
|
||||
if (cartList.value[index].isChecked.length > 0) {
|
||||
j.isChecked = ['1']
|
||||
} else {
|
||||
j.isChecked = []
|
||||
}
|
||||
})
|
||||
}
|
||||
const onChangeCheckbox = (index) => {
|
||||
const isCheckAll = cartList.value[index].devInfoVoList.every((j) => j.isChecked.length > 0)
|
||||
console.log(isCheckAll, 'isCheckAll')
|
||||
if (isCheckAll) {
|
||||
cartList.value[index].isChecked.push('1')
|
||||
} else {
|
||||
cartList.value[index].isChecked = []
|
||||
}
|
||||
}
|
||||
|
||||
// 获取底部操作栏高度 适配底部内容
|
||||
const getActionBarHeight = () => {
|
||||
const query = uni.createSelectorQuery().in(this)
|
||||
query
|
||||
.select('.van-safe-area-bottom')
|
||||
.boundingClientRect((data) => {
|
||||
if (data) {
|
||||
console.log(data, '底部高度--')
|
||||
actionBarHeight.value = data.height
|
||||
}
|
||||
})
|
||||
.exec()
|
||||
}
|
||||
|
||||
// 选择地址
|
||||
const onClickLink = () => {
|
||||
showBottomAddress.value = true
|
||||
}
|
||||
const onClickAddress = (res) => {
|
||||
address.value = res.address
|
||||
showBottomAddress.value = false
|
||||
}
|
||||
|
||||
onLoad(() => {
|
||||
nextTick(() => {
|
||||
getActionBarHeight()
|
||||
})
|
||||
})
|
||||
|
||||
onShow(() => {
|
||||
getDeviceDetailsData()
|
||||
getAddressListData()
|
||||
uni.hideTabBar()
|
||||
})
|
||||
onHide(() => {
|
||||
cartList.value = []
|
||||
address.value = ''
|
||||
})
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.content {
|
||||
<style lang="scss" scoped>
|
||||
.cart-container {
|
||||
padding: 10px;
|
||||
box-sizing: border-box;
|
||||
background: linear-gradient(to bottom, #bfdfdb, #f9f9f9, #fff);
|
||||
}
|
||||
.order-set {
|
||||
background-color: #fff;
|
||||
padding: 10px;
|
||||
box-sizing: border-box;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
|
||||
|
||||
.van-row {
|
||||
padding: 2px 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
.nav-header {
|
||||
height: 40px;
|
||||
padding: 0 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
background-color: $uni-navbar-bg-color;
|
||||
|
||||
text:nth-child(2) {
|
||||
margin-left: 8px;
|
||||
color: #0292f9;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
font-style: italic;
|
||||
}
|
||||
}
|
||||
|
||||
.amount {
|
||||
font-size: 13px;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.company-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
.company-name {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
view {
|
||||
padding-left: 6px;
|
||||
font-size: 13px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.van-image {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.contacts {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.items-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.info {
|
||||
font-size: 12px;
|
||||
|
||||
view {
|
||||
padding: 1px 0 1px 10px;
|
||||
font-size: 12px;
|
||||
color: #6f6f6f;
|
||||
|
||||
.van-image {
|
||||
margin: 0 4px;
|
||||
}
|
||||
}
|
||||
|
||||
& view:first-child {
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.protocol {
|
||||
font-size: 13px;
|
||||
color: #1989fa;
|
||||
}
|
||||
|
||||
:deep(.van-address-item__edit) {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,13 +1,10 @@
|
|||
<template>
|
||||
<!-- 需求发布 -->
|
||||
|
||||
<view class="h5-container">
|
||||
<Navbar :navTitle="`需求发布`" />
|
||||
<view class="demand-release h5-content">
|
||||
<view class="demand-bg"></view>
|
||||
<!-- <van-image height="0.8rem" width="4rem" :src="noticeImg" /> -->
|
||||
</view>
|
||||
|
||||
<scroll-view scroll-y class="scroll-item">
|
||||
<van-form>
|
||||
<van-cell-group inset>
|
||||
|
|
|
|||
|
|
@ -46,21 +46,43 @@
|
|||
</view>
|
||||
</view>
|
||||
|
||||
<van-action-bar>
|
||||
<van-action-bar v-if="memberStore.userType === 2">
|
||||
<van-action-bar-icon icon="chat-o" text="在线聊" />
|
||||
<van-action-bar-icon icon="shop-o" text="预约车" />
|
||||
<van-action-bar-button color="#ffc758" type="warning" text="加入预约车" />
|
||||
<van-action-bar-button color="#22ab9b" type="danger" text="立即租用" @click="onRentNow" />
|
||||
<van-action-bar-icon
|
||||
icon="shop-o"
|
||||
text="预约车"
|
||||
:badge="cartCount"
|
||||
@click="onCartBarPage"
|
||||
/>
|
||||
<van-action-bar-button
|
||||
color="#ffc758"
|
||||
type="warning"
|
||||
text="加入预约车"
|
||||
@click="onAddCart"
|
||||
:disabled="deviceInfo.isBookCar == 0 || userCompanyId == deviceInfo.companyId"
|
||||
/>
|
||||
<van-action-bar-button
|
||||
color="#22ab9b"
|
||||
type="danger"
|
||||
text="立即租用"
|
||||
@click="onRentNow"
|
||||
:disabled="deviceInfo.isBookCar == 0 || userCompanyId == deviceInfo.companyId"
|
||||
/>
|
||||
</van-action-bar>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed, ref } from 'vue'
|
||||
import { getDeviceDetailsAPI } from '@/services/goods/index.js'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import { useMemberStore } from '@/stores/index.js'
|
||||
import { getDeviceDetailsAPI } from '@/services/goods/index.js'
|
||||
import { addBookCarAPI, getBookCarDetailsAPI } from '@/services/cart/index.js'
|
||||
const memberStore = useMemberStore()
|
||||
const userCompanyId = ref()
|
||||
const images = ref([])
|
||||
const activeIndex = ref(1)
|
||||
const deviceInfo = ref({})
|
||||
const cartCount = ref(0)
|
||||
const props = defineProps({
|
||||
maId: {
|
||||
type: [String, Number],
|
||||
|
|
@ -86,14 +108,52 @@ const getDeviceDetailsData = async () => {
|
|||
const { data: res } = await getDeviceDetailsAPI(props.maId)
|
||||
deviceInfo.value = res
|
||||
images.value = res.detailsFileList
|
||||
console.log(res, '装备详情')
|
||||
}
|
||||
// 获取预约车数量
|
||||
const getBookCarDetailsData = async () => {
|
||||
const { data: res } = await getBookCarDetailsAPI()
|
||||
if (res.length > 0) {
|
||||
res.forEach((e) => {
|
||||
cartCount.value = e.devInfoVoList.length + cartCount.value
|
||||
})
|
||||
} else {
|
||||
cartCount.value = 0
|
||||
}
|
||||
}
|
||||
// 加入预约车
|
||||
const onAddCart = () => {
|
||||
showConfirmDialog({
|
||||
title: '温馨提示',
|
||||
message: '是否确认加入预约车',
|
||||
})
|
||||
.then(async () => {
|
||||
console.log(deviceInfo.value, 'deviceInfo')
|
||||
const { companyId, maId } = deviceInfo.value
|
||||
const res = await addBookCarAPI({
|
||||
maId,
|
||||
orderCompany: companyId,
|
||||
})
|
||||
if (res.code === 200) {
|
||||
showSuccessToast('加入成功')
|
||||
getDeviceDetailsData()
|
||||
}
|
||||
})
|
||||
.catch(() => {})
|
||||
}
|
||||
// 立即承租
|
||||
const onRentNow = () => {
|
||||
uni.navigateTo({ url: `/pages/order/index?id=${deviceInfo.value.maId}` })
|
||||
}
|
||||
|
||||
// 跳转预约车
|
||||
const onCartBarPage = () => {
|
||||
uni.switchTab({ url: '/pages/cart/index' })
|
||||
}
|
||||
|
||||
onLoad(() => {
|
||||
userCompanyId.value = memberStore.userInfo.companyId
|
||||
getDeviceDetailsData()
|
||||
getBookCarDetailsData()
|
||||
})
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -8,18 +8,26 @@
|
|||
</van-tabs>
|
||||
</view>
|
||||
|
||||
<scroll-view scroll-y class="tabs-content">
|
||||
<DetailsModel :maId="maId" />
|
||||
<scroll-view
|
||||
scroll-y
|
||||
class="tabs-content"
|
||||
:style="{ paddingBottom: actionBarHeight + 'px' }"
|
||||
>
|
||||
<DetailsModel v-if="activeTabs === 0" :maId="maId" />
|
||||
<view v-else>
|
||||
{{ tabList[activeTabs].tab_name }}
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
import { nextTick, ref } from 'vue'
|
||||
import DetailsModel from './components/details-model.vue'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
const activeTabs = ref(0)
|
||||
const maId = ref('')
|
||||
const actionBarHeight = ref(0)
|
||||
const tabList = ref([
|
||||
{ tab_name: '装备详情' },
|
||||
{ tab_name: '装备外观' },
|
||||
|
|
@ -30,8 +38,24 @@ const onHandleBack = () => {
|
|||
uni.navigateBack()
|
||||
}
|
||||
|
||||
// 获取底部操作栏高度 适配底部内容
|
||||
const getActionBarHeight = () => {
|
||||
const query = uni.createSelectorQuery().in(this)
|
||||
query
|
||||
.select('.van-action-bar')
|
||||
.boundingClientRect((data) => {
|
||||
if (data) {
|
||||
actionBarHeight.value = data.height
|
||||
}
|
||||
})
|
||||
.exec()
|
||||
}
|
||||
|
||||
onLoad((options) => {
|
||||
maId.value = options.id
|
||||
nextTick(() => {
|
||||
getActionBarHeight()
|
||||
})
|
||||
})
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,13 +1,11 @@
|
|||
<template>
|
||||
<!-- 装备共享大厅 -->
|
||||
<view class="h5-container">
|
||||
<van-nav-bar title="装备共享大厅" left-text="返回" left-arrow @click-left="onClickLeft" />
|
||||
|
||||
<!-- <view class="search-index flex-row-start">
|
||||
<van-field placeholder="搜索" />
|
||||
<van-button square type="primary" icon="search" />
|
||||
</view> -->
|
||||
<view class="h5-content" style="padding: 20px">
|
||||
<Navbar :navTitle="`装备共享大厅`" />
|
||||
<view
|
||||
class="h5-content"
|
||||
style="padding: 20px; background: linear-gradient(to bottom, #6caf97, #78b0a9, #b8d0cf)"
|
||||
>
|
||||
<SearchIpt @onSearchByType="onSearchByType" />
|
||||
</view>
|
||||
|
||||
|
|
@ -47,6 +45,7 @@
|
|||
<script setup>
|
||||
import GoodsItems from '@/components/GoodsItems'
|
||||
import SearchIpt from '@/components/SearchIpt/index'
|
||||
import Navbar from '@/components/Navbar/index'
|
||||
import { getDeviceListAPI } from '@/services/index/index.js'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import { ref } from 'vue'
|
||||
|
|
@ -134,4 +133,9 @@ onLoad(() => {
|
|||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.van-nav-bar .van-icon),
|
||||
:deep(.van-nav-bar__title) {
|
||||
color: #333;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -38,10 +38,10 @@
|
|||
<TitleTip />
|
||||
|
||||
<van-grid :column-num="3">
|
||||
<van-grid-item v-for="value in 6" :key="value">
|
||||
<text> 我的订单 </text>
|
||||
<text>我的订单</text>
|
||||
<text>30</text>
|
||||
<van-grid-item v-for="(o, i) in orderData" :key="i">
|
||||
<van-icon name="shopping-cart" size="30" color="#309cef" />
|
||||
<text class="order-title">{{ o.order_title }}</text>
|
||||
<text class="order-count">{{ o.order_count }}</text>
|
||||
</van-grid-item>
|
||||
</van-grid>
|
||||
</view>
|
||||
|
|
@ -72,19 +72,30 @@ import toDoList from '@/static/index/to_do_list.png'
|
|||
import SearchIpt from '@/components/SearchIpt/index'
|
||||
import TitleTip from '@/components/TitleTip/index'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import { useMemberStore } from '@/stores/index.js'
|
||||
const memberStore = useMemberStore()
|
||||
const showPopover = ref(false)
|
||||
const activeUser = ref('出租方')
|
||||
const loading = ref(false)
|
||||
const finished = ref(false)
|
||||
const orderData = ref([
|
||||
{ order_title: '我的订单', order_count: 20 },
|
||||
{ order_title: '待出库', order_count: 6 },
|
||||
{ order_title: '待收货', order_count: 8 },
|
||||
{ order_title: '租赁中', order_count: 12 },
|
||||
{ order_title: '已退租', order_count: 7 },
|
||||
{ order_title: '已完成', order_count: 3 },
|
||||
])
|
||||
const userActions = ref([
|
||||
{ text: '出租方', userType: 1 },
|
||||
{ text: '承租方', userType: 2 },
|
||||
])
|
||||
const onUserSelect = (e) => {
|
||||
activeUser.value = e.text
|
||||
memberStore.editUserType(e.userType)
|
||||
uni.setTabBarItem({
|
||||
index: 2,
|
||||
visible: e.userType == 1 ? false : true,
|
||||
visible: e.userType === 1 ? false : true,
|
||||
})
|
||||
}
|
||||
|
||||
|
|
@ -159,6 +170,15 @@ onLoad(() => {
|
|||
.order-data {
|
||||
padding: 0 20px;
|
||||
box-sizing: border-box;
|
||||
|
||||
.order-title,
|
||||
.order-count {
|
||||
font-size: 13px;
|
||||
}
|
||||
.order-title {
|
||||
color: #7b7a7a;
|
||||
padding: 8px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.to-do-list {
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<!-- 需求共享大厅 -->
|
||||
<view class="h5-container">
|
||||
<van-nav-bar title="需求共享大厅" left-text="返回" left-arrow @click-left="onClickLeft" />
|
||||
<van-nav-bar title="需求共享大厅" />
|
||||
<view class="demand-header">
|
||||
<view>
|
||||
<SearchIpt @onSearchByType="onSearchByType" />
|
||||
|
|
@ -118,7 +118,6 @@ import moment from 'moment'
|
|||
import { ref } from 'vue'
|
||||
const keywords = ref('发布')
|
||||
const leaseDemandLis = ref([])
|
||||
const countDownTime = ref(30 * 60 * 60 * 1000)
|
||||
const onScrollTolower = () => {
|
||||
console.log('滚动触底')
|
||||
}
|
||||
|
|
@ -129,16 +128,11 @@ const onSearchByType = (value, type) => {
|
|||
* @value 搜索框值
|
||||
*/
|
||||
if (type === 2) {
|
||||
uni.switchTab({
|
||||
url: `/pages/lease-demand/index?value=${value}`,
|
||||
})
|
||||
getLeaseDemandListData()
|
||||
} else {
|
||||
getDeviceListData()
|
||||
uni.navigateTo({ url: '/pages/goods-list/index' })
|
||||
}
|
||||
}
|
||||
const onClickLeft = () => {
|
||||
uni.navigateBack()
|
||||
}
|
||||
|
||||
// 获取需求列表
|
||||
const getLeaseDemandListData = async () => {
|
||||
|
|
@ -242,7 +236,6 @@ onLoad(() => {
|
|||
color: $el-color-primary;
|
||||
}
|
||||
|
||||
:deep(.van-nav-bar .van-icon),
|
||||
:deep(.van-nav-bar__title) {
|
||||
color: #333;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -52,6 +52,8 @@ const onSubmitLogin = async () => {
|
|||
const { data: result } = await appLoginAPI(loginForm)
|
||||
memberStore.setToken(result.access_token)
|
||||
const userResult = await getUserInfoAPI()
|
||||
|
||||
console.log(userResult, 'userResult用户信息')
|
||||
memberStore.setUserInfo(userResult.user)
|
||||
if (userResult.code === 200) {
|
||||
showToast('登录成功')
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<!-- 订单结算 -->
|
||||
<view class="h5-container">
|
||||
<view class="nav-header">
|
||||
<van-icon name="arrow-left" />
|
||||
<van-icon name="arrow-left" @click="onClickLeft()" />
|
||||
<text> 订单确认 </text>
|
||||
<text> (1) </text>
|
||||
</view>
|
||||
|
|
@ -113,10 +113,12 @@
|
|||
import companyImg from '@/static/goods/company-img.png'
|
||||
import companyBg from '@/static/goods/company-bg.png'
|
||||
import dateIcon from '@/static/goods/date-icon.png'
|
||||
import { getDeviceDetailsAPI } from '@/services/goods/index.js'
|
||||
import { computed, ref } from 'vue'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import { useMemberStore } from '@/stores/index.js'
|
||||
import { getDeviceDetailsAPI } from '@/services/goods/index.js'
|
||||
import moment from 'moment'
|
||||
const memberStore = useMemberStore()
|
||||
const checked = ref(['1'])
|
||||
const orderList = ref([])
|
||||
const showBottom = ref(false)
|
||||
|
|
@ -125,6 +127,9 @@ const timeType = ref(0)
|
|||
const leaseTime = ref()
|
||||
const startTime = ref()
|
||||
const endTime = ref()
|
||||
const onClickLeft = () => {
|
||||
uni.navigateBack()
|
||||
}
|
||||
const onSubmitOrder = () => {
|
||||
orderList.value.forEach((e) => {
|
||||
if (e.days < 1) {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,40 @@
|
|||
import { http } from '@/utils/http'
|
||||
|
||||
/**
|
||||
* 预约车 加入预约车
|
||||
*/
|
||||
export const addBookCarAPI = (data) => {
|
||||
return http({
|
||||
method: 'POST',
|
||||
url: '/material-mall/bookCar/addBookCar',
|
||||
data,
|
||||
})
|
||||
}
|
||||
/**
|
||||
* 预约车 列表
|
||||
*/
|
||||
export const getBookCarDetailsAPI = () => {
|
||||
return http({
|
||||
method: 'GET',
|
||||
url: '/material-mall/bookCar/getBookCarDetails',
|
||||
})
|
||||
}
|
||||
/**
|
||||
* 预约车 列表
|
||||
*/
|
||||
export const getAddressListAPI = () => {
|
||||
return http({
|
||||
method: 'GET',
|
||||
url: '/material-mall/bm_company_address/list',
|
||||
})
|
||||
}
|
||||
/**
|
||||
* 预约车 提交
|
||||
*/
|
||||
export const submitBookCarAPI = (data) => {
|
||||
return http({
|
||||
method: 'POST',
|
||||
url: '/material-mall/order/submitBookCar',
|
||||
data,
|
||||
})
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 3.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.3 KiB |
|
|
@ -7,6 +7,7 @@ export const useMemberStore = defineStore(
|
|||
// 定义用户信息
|
||||
const userInfo = ref({})
|
||||
const token = ref('')
|
||||
const userType = ref(1)
|
||||
// 存储用户信息
|
||||
const setUserInfo = (val) => {
|
||||
userInfo.value = val
|
||||
|
|
@ -23,16 +24,21 @@ export const useMemberStore = defineStore(
|
|||
const clearToken = (val) => {
|
||||
token.value = undefined
|
||||
}
|
||||
// 切换用户角色
|
||||
const editUserType = (val) => {
|
||||
userType.value = val
|
||||
}
|
||||
|
||||
// 把数据和方法 return 出去
|
||||
|
||||
return {
|
||||
userInfo,
|
||||
token,
|
||||
userType,
|
||||
setUserInfo,
|
||||
clearUserInfo,
|
||||
setToken,
|
||||
clearToken,
|
||||
editUserType,
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -46,7 +46,6 @@ export const http = (options) => {
|
|||
uni.request({
|
||||
...options,
|
||||
success(res) {
|
||||
console.log('res', res)
|
||||
// 1. 判断是否请求成功
|
||||
if (res.statusCode >= 200 && res.statusCode < 300) {
|
||||
if (res.data.code >= 200 && res.data.code < 300) {
|
||||
|
|
|
|||
Loading…
Reference in New Issue