需求表单校验添加

This commit is contained in:
BianLzhaoMin 2024-12-20 16:38:30 +08:00
parent 11afe7418d
commit ef77d23cec
8 changed files with 270 additions and 89 deletions

View File

@ -1,30 +1,10 @@
<script setup>
import { onShow } from '@dcloudio/uni-app'
import { useMemberStore } from '@/stores/index.js'
import { nextTick } from 'vue'
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,
})
}
})
onShow(() => {})
</script>
<style lang="scss">

View File

@ -6,72 +6,96 @@
<view class="demand-bg"></view>
</view>
<scroll-view scroll-y class="scroll-item">
<van-form>
<van-form label-width="100px" ref="demandReleaseFormRef">
<van-cell-group inset>
<van-field
v-model="demandForm.leaseName"
name="leaseName"
placeholder="请输入需求名称"
label="需求名称"
:rules="[{ message: '请输入需求名称' }]"
required
:rules="[{ required: true, message: '请输入需求名称' }]"
/>
<van-field
v-model="areaName"
is-link
readonly
name="area"
name="areaName"
label="项目所在地"
required
placeholder="点击选择省市区"
:rules="[{ message: '请选择省市区' }]"
:rules="[{ required: true, message: '请选择项目所在地' }]"
@click="showArea = true"
/>
<van-field
v-model="demandForm.address"
name="validatorMessage"
name="address"
placeholder="请输入详细地址"
label="详细地址"
:rules="[{ message: '请输入详细地址' }]"
required
:rules="[{ required: true, message: '请输入详细地址' }]"
/>
<van-field
v-model="demandForm.person"
name="person"
placeholder="请输入联系人"
label="联系人"
:rules="[{ message: '请输入正确内容' }]"
required
:rules="[{ required: true, message: '请输入联系人' }]"
/>
<van-field
v-model="demandForm.personPhone"
placeholder="请输入联系电话"
name="pattern"
label="联系电话"
:rules="[{ message: '请输入正确内容' }]"
required
:rules="[{ pattern, required: true, message: '请输入正确的联系电话' }]"
/>
<van-field
v-model="demandForm.leaseStartTime"
is-link
readonly
name="datePicker"
required
name="validatorStartTime"
label="租赁开始日期"
placeholder="点击选择时间"
@click="onOpenTimePopup(1)"
:rules="[
{
validator: validatorStartTime,
required: true,
message: '请选择租赁开始日期',
},
]"
/>
<van-field
v-model="demandForm.leaseEndTime"
is-link
readonly
name="datePicker"
required
name="validatorEndTime"
label="租赁结束日期"
placeholder="点击选择时间"
@click="onOpenTimePopup(2)"
:rules="[
{
validator: validatorEndTime,
required: true,
message: '请选择租赁结束日期',
},
]"
/>
<van-field
v-model="demandForm.endTime"
is-link
readonly
name="datePicker"
required
name="endTime"
label="需求截止日期"
placeholder="点击选择时间"
@click="onOpenTimePopup(3)"
:rules="[{ required: true, message: '请选择需求截止日期' }]"
/>
<van-field
v-model="demandForm.description"
@ -87,17 +111,32 @@
<van-button icon="plus" type="primary" size="mini">添加需求描述</van-button>
</van-cell-group>
</van-form>
<van-form v-for="(item, index) in demandDetails" :key="item.newId">
<van-form
:key="item.newId"
label-width="100px"
v-for="(item, index) in demandDetails"
:ref="
($event) => {
demandDetailsFormRefList[index] = $event
}
"
>
<van-cell-group inset>
<van-field
v-model="item.typeName"
is-link
readonly
label="地区"
label="装备类目"
placeholder="请选择装备类目"
required
@click="onOpenPopup(index)"
:rules="[{ required: true, message: '请选择装备类目' }]"
/>
<van-field label="预估数量">
<van-field
label="预估数量"
required
:rules="[{ required: true, message: '请输入预估数量' }]"
>
<template #input>
<van-stepper v-model="item.leaseNum" />
</template>
@ -107,7 +146,6 @@
name="密码"
label="装备描述"
placeholder="请输入装备描述"
:rules="[{ required: true, message: '请填写装备描述' }]"
/>
<van-field name="uploader" label="参考图片/样式">
<template #input>
@ -144,6 +182,8 @@
v-model="timeValue"
@confirm="onConfirmTime"
@cancel="showPicker = false"
:min-date="minDate"
:max-date="maxDate"
/>
</van-popup>
<van-popup v-model:show="showEquipmentType" round position="bottom">
@ -166,6 +206,9 @@ import { getEquipmentTypeAPI } from '@/services/common/index.js'
import { addLeaseInfoAPI } from '@/services/demand/index.js'
import Navbar from '@/components/Navbar/index'
import { onLoad } from '@dcloudio/uni-app'
import moment from 'moment'
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 showArea = ref(false)
const showPicker = ref(false)
const showEquipmentType = ref(false)
@ -176,6 +219,9 @@ const areaListValue = ref()
const areaName = ref('')
const timeType = ref(0)
const timeValue = ref([])
const demandReleaseFormRef = ref(null)
const demandDetailsFormRefList = ref([])
const pattern = ref(/^1[3456789]\d{9}$/)
const fieldNames = ref({
text: 'name',
value: 'id',
@ -207,6 +253,13 @@ const demandDetails = ref([
},
])
const validatorStartTime = (val) => {
console.log(val, '开始时间')
}
const validatorEndTime = (val) => {
console.log(val, '结束时间')
}
const getEquipmentTypeData = async () => {
const { data: res } = await getEquipmentTypeAPI()
equipmentTypeList.value = res
@ -239,14 +292,35 @@ const onCloseEquipmentType = () => {
//
const onSubmitDemand = async () => {
demandForm.detailsList = demandDetails.value
const res = await addLeaseInfoAPI(demandForm)
if (res.code === 200) {
showSuccessToast('提交成功')
setTimeout(() => {
uni.navigateBack()
}, 500)
}
demandReleaseFormRef.value.validate().then(async (res) => {
let isDemand = false
for (let index = 0; index < demandDetails.value.length; index++) {
try {
const valid = demandDetailsFormRefList.value[index].validate()
if (typeof valid == 'object') {
isDemand = true
throw new Error('表单校验失败')
}
} catch (error) {}
}
if (isDemand) return
showConfirmDialog({
title: '温馨提示',
message: '是否确定提交该需求',
})
.then(async () => {
demandForm.detailsList = demandDetails.value
const res = await addLeaseInfoAPI(demandForm)
if (res.code === 200) {
showSuccessToast('提交成功')
setTimeout(() => {
uni.navigateBack()
}, 500)
}
})
.catch(() => {})
})
}
//
@ -306,4 +380,8 @@ onLoad(() => {
margin-top: 10px;
padding-bottom: 10px;
}
:deep(.van-field__label) {
font-size: 13px;
}
</style>

View File

@ -66,7 +66,7 @@
type="danger"
text="立即租用"
@click="onRentNow"
:disabled="deviceInfo.isBookCar == 0 || userCompanyId == deviceInfo.companyId"
:disabled="userCompanyId == deviceInfo.companyId"
/>
</van-action-bar>
</template>
@ -111,6 +111,7 @@ const getDeviceDetailsData = async () => {
}
//
const getBookCarDetailsData = async () => {
cartCount.value = 0
const { data: res } = await getBookCarDetailsAPI()
if (res.length > 0) {
res.forEach((e) => {
@ -136,6 +137,7 @@ const onAddCart = () => {
if (res.code === 200) {
showSuccessToast('加入成功')
getDeviceDetailsData()
getBookCarDetailsData()
}
})
.catch(() => {})

View File

@ -1,7 +1,8 @@
<template>
<!-- 装备共享大厅 -->
<view class="h5-container">
<Navbar :navTitle="`装备共享大厅`" />
<!-- <Navbar :navTitle="`装备共享大厅`" /> -->
<van-nav-bar title="装备共享大厅" left-text="返回" left-arrow @click-left="onClickLeft" />
<view
class="h5-content"
style="padding: 20px; background: linear-gradient(to bottom, #6caf97, #78b0a9, #b8d0cf)"
@ -77,7 +78,9 @@ const onSearchByType = (value, type) => {
}
}
const onClickLeft = () => {
history.back()
uni.switchTab({
url: '/pages/index/index',
})
}
onLoad(() => {
getDeviceListData()

View File

@ -12,13 +12,15 @@
@select="onUserSelect"
>
<template #reference>
<text> {{ activeUser }} </text>
<text> {{ activeUser == 1 ? '出租方' : '承租方' }} </text>
<van-icon name="arrow-down" />
</template>
</van-popover>
</view>
<view class="user-name"> 您好安徽送变电公司 / 李世民 </view>
<view class="user-name">
您好安徽送变电公司 / {{ memberStore.userInfo.nickName }}
</view>
<view class="notice-box">
<van-image height="0.8rem" width="4rem" :src="noticeImg" />
<view>
@ -71,11 +73,12 @@ import noticeImg from '@/static/index/notice.png'
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 { onLoad, onShow } from '@dcloudio/uni-app'
import { useMemberStore } from '@/stores/index.js'
import { getOrderStatusCountAPI } from '@/services/index/index.js'
const memberStore = useMemberStore()
const showPopover = ref(false)
const activeUser = ref('出租方')
const activeUser = ref(1)
const loading = ref(false)
const finished = ref(false)
const orderData = ref([
@ -91,7 +94,7 @@ const userActions = ref([
{ text: '承租方', userType: 2 },
])
const onUserSelect = (e) => {
activeUser.value = e.text
activeUser.value = e.userType
memberStore.editUserType(e.userType)
uni.setTabBarItem({
index: 2,
@ -115,9 +118,23 @@ const onSearchByType = (value, type) => {
}
}
const getOrderStatusCountData = async () => {
const res = await getOrderStatusCountAPI()
console.log(res, '数量')
}
onLoad(() => {
finished.value = true
})
onShow(() => {
activeUser.value = memberStore.userType
uni.setTabBarItem({
index: 2,
visible: true,
})
getOrderStatusCountData()
})
</script>
<style lang="scss" scoped>
@ -145,11 +162,6 @@ onLoad(() => {
view {
flex: 1;
}
.van-notice-bar__left-icon,
.van-notice-bar__right-icon {
color: #df3939;
}
}
.search-ipt {
@ -195,4 +207,9 @@ onLoad(() => {
}
}
}
:deep(.van-notice-bar__left-icon),
:deep(.van-notice-bar__right-icon) {
color: #df3939;
}
</style>

View File

@ -113,7 +113,7 @@
import SearchIpt from '@/components/SearchIpt/index'
import { getLeaseDemandListAPI } from '@/services/demand/index.js'
import { acceptLeaseDemandOrderAPI } from '@/services/demand/index.js'
import { onLoad } from '@dcloudio/uni-app'
import { onLoad, onShow } from '@dcloudio/uni-app'
import moment from 'moment'
import { ref } from 'vue'
const keywords = ref('发布')
@ -147,19 +147,20 @@ const getLeaseDemandListData = async () => {
}
const onReceivingOrders = (id) => {
uni.showModal({
title: '温馨提示',
content: '是否确认接单?',
success: async () => {
const res = await acceptLeaseDemandOrderAPI({ id })
if (res.code === 200) {
showSuccessToast('接单成功')
getLeaseDemandListData()
}
},
})
// showConfirmDialog({
// title: '',
// message: '',
// })
// .then(async () => {
// const res = await acceptLeaseDemandOrderAPI({ id })
// if (res.code === 200) {
// showSuccessToast('')
// getLeaseDemandListData()
// }
// })
// .catch(() => {})
}
onLoad(() => {
onShow(() => {
getLeaseDemandListData()
})
</script>

View File

@ -24,7 +24,7 @@
</van-row>
<van-row>
<van-col span="18">
<van-col span="24">
<view class="items-info">
<van-image fit="cover" height="4rem" width="4rem" :src="item.picUrl" />
<view class="info">
@ -36,19 +36,26 @@
<text style="color: var(--van-submit-bar-price-color)">
{{ item.dayLeasePrice }}/
</text>
<van-stepper
style="margin-left: 20px"
button-size="18"
:max="item.deviceCount"
v-model="item.num"
/>
</view>
<view class="items-info">
{{ startTime ? startTime : '开始日期' }}
{{ item.rentBeginTime ? item.rentBeginTime : '开始日期' }}
<van-image
fit="cover"
style="margin: 0 6px"
width="1rem"
height="1rem"
:src="dateIcon"
@click="onSelectTime(1)"
/>
{{ endTime ? endTime : '结束日期' }}
{{ item.rentEndTime ? item.rentEndTime : '结束日期' }}
<van-image
fit="cover"
style="margin: 0 6px"
width="1rem"
height="1rem"
:src="dateIcon"
@ -62,9 +69,6 @@
</view>
</view>
</van-col>
<van-col span="6">
<van-stepper button-size="16" :max="item.deviceCount" v-model="item.num" />
</van-col>
</van-row>
<van-row style="margin-top: 14px">
@ -92,6 +96,7 @@
@confirm="onConfirm"
@cancel="onCancel"
:min-date="minDate"
:max-date="maxDate"
title="选择日期"
/>
</van-popup>
@ -105,7 +110,21 @@
<template #default>
<view class="amount"> 共计 1 件装备 </view>
</template>
<template #tip>
<text @click="onClickLink">
{{ address.length === 0 ? '请选择收货地址' : `收货地址:${address}` }}
</text>
</template>
</van-submit-bar>
<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>
</view>
</template>
@ -117,20 +136,24 @@ 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 { getAddressListAPI, submitBookCarAPI } from '@/services/cart/index.js'
import moment from 'moment'
const memberStore = useMemberStore()
const checked = ref(['1'])
const orderList = ref([])
const showBottom = ref(false)
const minDate = new Date(2024, 0, 1)
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 leaseTime = ref()
const startTime = ref()
const endTime = ref()
const address = ref('')
const chosenAddressId = ref()
const addressList = ref([])
const onClickLeft = () => {
uni.navigateBack()
}
const onSubmitOrder = () => {
const onSubmitOrder = async () => {
orderList.value.forEach((e) => {
if (e.days < 1) {
showFailToast('请选择租期')
@ -140,7 +163,39 @@ const onSubmitOrder = () => {
showFailToast('请先阅读公司协议')
return
}
if (address.value.length == 0) {
showFailToast('请选择收货地址')
return
}
})
const orderInfo = orderList.value[0]
const submitInfo = {
maId: orderInfo.maId,
id: orderInfo.id,
rentBeginTime: orderInfo.rentBeginTime + ' ' + '00:00:00',
rentEndTime: orderInfo.rentEndTime + ' ' + '00:00:00',
manageType: orderInfo.manageType,
days: orderInfo.days,
num: orderInfo.num,
costs: orderInfo.num * orderInfo.days * orderInfo.dayLeasePrice,
}
const submitParams = {
cost: submitInfo.costs,
address: address.value,
detailsList: [submitInfo],
}
const res = await submitBookCarAPI([submitParams])
if (res.code === 200) {
showSuccessToast('提交成功')
setTimeout(() => {
uni.navigateTo({
url: '/pages/goods-list/index',
})
}, 500)
}
}
const onViewProtocol = () => {}
const onSelectTime = (type) => {
@ -149,11 +204,20 @@ const onSelectTime = (type) => {
}
const onConfirm = () => {
if (timeType.value === 1) {
startTime.value = leaseTime.value.join('-')
orderList.value[0].rentBeginTime = leaseTime.value.join('-')
} else {
endTime.value = leaseTime.value.join('-')
orderList.value[0].days = moment(endTime.value).diff(startTime.value, 'day')
if (moment(leaseTime.value.join('-')).isBefore(moment(orderList.value[0].rentBeginTime))) {
showFailToast('租赁结束日期不能小于租赁开始日期')
return
} else {
orderList.value[0].rentEndTime = leaseTime.value.join('-')
orderList.value[0].days = moment(leaseTime.value.join('-')).diff(
orderList.value[0].rentBeginTime,
'day',
)
}
}
leaseTime.value = []
showBottom.value = false
}
const onCancel = () => {
@ -177,8 +241,32 @@ const totalPrice = computed(() => {
return item?.num * item?.dayLeasePrice * item?.days * 100
})
//
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 onClickLink = () => {
showBottomAddress.value = true
}
const onClickAddress = (res) => {
address.value = res.address
showBottomAddress.value = false
}
onLoad((options) => {
getDeviceDetailsData(options.id)
getAddressListData()
})
</script>
@ -247,7 +335,7 @@ onLoad((options) => {
font-size: 12px;
view {
padding: 1px 0 1px 10px;
padding: 2px 0 2px 10px;
font-size: 12px;
color: #6f6f6f;
@ -267,4 +355,7 @@ onLoad((options) => {
font-size: 13px;
color: #1989fa;
}
:deep(.van-address-item__edit) {
display: none;
}
</style>

View File

@ -10,3 +10,12 @@ export const getDeviceListAPI = (data) => {
data,
})
}
/**
* 首页 获取订单数量
*/
export const getOrderStatusCountAPI = (data) => {
return http({
method: 'GET',
url: '/material-mall/order/getOrderStatusCount',
})
}