add:管理端
This commit is contained in:
@@ -0,0 +1,505 @@
|
||||
<template>
|
||||
<div class="shop_page_container">
|
||||
<nut-navbar title="订单编辑" :fixed="true" ref="navtest" left-show :safe-area-inset-top="true"
|
||||
:custom-color="'#312D22'">
|
||||
</nut-navbar>
|
||||
|
||||
<div class="base_box short_box">
|
||||
<div class="short_item" style="border-bottom: 1px solid #E9E8E8;padding-bottom: 10px;">
|
||||
<div class="short_item_title">订单号：{{orderItem?.orderId}}</div>
|
||||
<div class="short_item_pay">{{orderItem?.payStatus == 1 ? '已支付' : '未支付'}}</div>
|
||||
</div>
|
||||
<div class="show_box_item" style="border-bottom: 1px solid #E9E8E8;padding-bottom: 10px;">
|
||||
<div class="short_item_title">地址信息</div>
|
||||
<div class="short_item_time">{{extractPhoneNumber( orderItem?.userServiceAddr) }}</div>
|
||||
<div class="short_item_normal">{{orderItem?.addr }}</div>
|
||||
</div>
|
||||
<div class="show_box_item" style="border-bottom: 1px solid #E9E8E8;padding-bottom: 10px;">
|
||||
<div class="short_item_title">宠物信息</div>
|
||||
<div v-for="(item, index) in orderItem?.petList" :key="index">
|
||||
<div class="short_item_time">{{ item?.nickName+' | '+item?.assortment+' | '+ item?.weight+'kg'}}</div>
|
||||
<div class="short_item_normal">{{item?.goodsNameList }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="show_box_item">
|
||||
<div class="short_item_time">订单服务时长</div>
|
||||
<div class="choose_box">
|
||||
<nut-input v-model="showProjectServerTime" placeholder="请输入订单服务时长" type="number" >
|
||||
<template #right>
|
||||
分钟
|
||||
</template>
|
||||
</nut-input>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="show_box_item">
|
||||
<div class="short_item_time">服务时间</div>
|
||||
<div class="choose_box" @tap="handleshowtimepopup">
|
||||
<div class="con_content">{{ showtimeboxinfo }}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="show_box_item">
|
||||
<div class="short_item_time">详细地址信息</div>
|
||||
<div class="choose_box" @tap="handlegotoaddresspage">
|
||||
<div class="con_content_address">{{ showaddressName }}</div>
|
||||
<div class="loaction_icon">
|
||||
<img src="../../static/images/locationYellow.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="show_box_item">
|
||||
<div class="short_item_time">更换车辆</div>
|
||||
<div class="choose_box">
|
||||
<CarNoSelecter v-model="showCarNo" :localdata="carOptions" @change="carChoose" placeholder="车辆信息">
|
||||
</CarNoSelecter>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<time-popup :showbottomstates="showtimebottomstates" @selfclose="handleclosetimebottom"
|
||||
:timelists="orderServiceTimeList.info" @uploadtime="handleuploadtime"></time-popup>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="bottom_safe_area"> </div>
|
||||
<nut-safe-area position="bottom"></nut-safe-area>
|
||||
<div class="shopcar_box">
|
||||
<button class="submit-btn" :style="{ backgroundColor: '#FFCD35' }" @click="handleSubmit">
|
||||
确认
|
||||
</button>
|
||||
<div class="shopcar_box_list">
|
||||
</div>
|
||||
<nut-safe-area position="bottom"></nut-safe-area>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
reactive
|
||||
} from 'vue';
|
||||
|
||||
import timePopup from '../../components/timepopup'
|
||||
import CarNoSelecter from '../../components/carNoSelecter'
|
||||
|
||||
import {
|
||||
orderCar,
|
||||
orderDispatch
|
||||
} from '../../api/orders'
|
||||
import {
|
||||
isDateTimeGreaterThanCurrent
|
||||
} from '../../utils/date'
|
||||
import {
|
||||
carList
|
||||
} from '../../api/cars.js'
|
||||
|
||||
import {
|
||||
useUserInfo
|
||||
} from '@/store'
|
||||
const userInfo = useUserInfo()
|
||||
|
||||
const showtimeboxinfo = ref('请选择您预约的洗护时间段')
|
||||
const timeboxinfoList = ref([])
|
||||
const showtimebottomstates = ref(false)
|
||||
|
||||
const showaddressName = ref('请设置服务地址')
|
||||
|
||||
const showCarNo = ref('请选择您的车辆')
|
||||
const showCarNoItem = ref({})
|
||||
const chooseUid = ref(0)
|
||||
|
||||
const showProjectServerTime = ref('请输入服务时间')
|
||||
|
||||
const orderServiceTimeList = reactive({
|
||||
info: []
|
||||
})
|
||||
|
||||
const carOptions = ref([])
|
||||
const orderItem = ref({})
|
||||
const submitList = reactive({
|
||||
info: {
|
||||
petGoodsInfos: [],
|
||||
serviceTime: "",
|
||||
serviceAddrId: 0
|
||||
}
|
||||
})
|
||||
|
||||
const fieldNames = ref({
|
||||
text: "addr",
|
||||
value: "id",
|
||||
});
|
||||
|
||||
function handleSubmit() {
|
||||
|
||||
const submitParams = {
|
||||
"carId": showCarNo.value,
|
||||
"orderId":orderItem.value.orderId,
|
||||
"orderUpdateDTO": {
|
||||
"addr": showaddressName.value,
|
||||
"carId": showCarNo.value,
|
||||
"orderId":orderItem.value.orderId,
|
||||
"projectionServiceTime": showProjectServerTime.value,
|
||||
"remark": orderItem.value.remark,
|
||||
"serviceTime": showtimeboxinfo.value,
|
||||
"userServiceAddrId":orderItem.value.userServiceAddrId
|
||||
}
|
||||
}
|
||||
|
||||
console.log(submitParams,'==========submitParams')
|
||||
orderDispatch(submitParams).then(res => {
|
||||
if (res.code == 200) {
|
||||
uni.showToast({
|
||||
title: '派单成功',
|
||||
icon: 'success',
|
||||
duration: 2000
|
||||
})
|
||||
// 返回上一页或刷新数据
|
||||
setTimeout(() => {
|
||||
// uni.navigateBack()
|
||||
uni.switchTab({
|
||||
url: `/pages/index/index`
|
||||
})
|
||||
}, 1500)
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '派单失败，请稍后重试',
|
||||
icon: 'success',
|
||||
duration: 2000
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
//车辆选择
|
||||
function carChoose(val) {
|
||||
showCarNo.value = val.value
|
||||
showCarNoItem.value = val
|
||||
}
|
||||
|
||||
function handleuploadtime(e) {
|
||||
console.log(e, 'handleuploadtime')
|
||||
showtimeboxinfo.value = e
|
||||
}
|
||||
|
||||
// // 时间处理函数
|
||||
function getorderServiceTime() {
|
||||
carList(userInfo.getUid).then((res) => {
|
||||
if (res.code == 200) {
|
||||
orderServiceTimeList.info = []
|
||||
orderServiceTimeList.info.length = 0
|
||||
let j = 1
|
||||
for (let item of res.data) {
|
||||
console.log('------', item)
|
||||
let date = new Date(item?.serviceDate).getDay()
|
||||
let result = {
|
||||
backtime: item?.serviceDate,
|
||||
date,
|
||||
ischeck: j == 1 ? true : false,
|
||||
day: item?.serviceDate?.split('-')[1] + '.' + item?.serviceDate.split('-')[2],
|
||||
timelist: item?.carDispatchList[0].dispatchResults
|
||||
}
|
||||
|
||||
j += 1
|
||||
for (let j in result.timelist) {
|
||||
result.timelist[j].ischeck = false
|
||||
result.timelist[j].isOver = isDateTimeGreaterThanCurrent(item?.serviceDate, result
|
||||
.timelist[j].time) //
|
||||
}
|
||||
orderServiceTimeList.info.push(result)
|
||||
}
|
||||
console.log(orderServiceTimeList, 'res.data.times')
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function handleclosetimebottom(e) {
|
||||
showtimebottomstates.value = e
|
||||
}
|
||||
|
||||
function handlegotoaddresspage() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/addresslist/index?type=2'+'&uid='+chooseUid.value,
|
||||
})
|
||||
}
|
||||
|
||||
function handleshowtimepopup() {
|
||||
console.log(showtimebottomstates.value)
|
||||
showtimebottomstates.value = !showtimebottomstates.value
|
||||
}
|
||||
|
||||
onShow(_ => {
|
||||
uni.$on('returnData', (e) => {
|
||||
showaddressName.value = e.e.addr
|
||||
console.log(e)
|
||||
})
|
||||
})
|
||||
|
||||
onLoad((e) => {
|
||||
if (e.orderInfo && e.orderInfo != 'undefined') {
|
||||
const res = JSON.parse(e.orderInfo)
|
||||
orderItem.value = res
|
||||
showtimeboxinfo.value = res.serviceTime
|
||||
showaddressName.value = res.addr
|
||||
showProjectServerTime.value = res?.projectionServiceTime ? res.projectionServiceTime:0
|
||||
chooseUid.value = res.uid
|
||||
getorderServiceTime()
|
||||
usetCarList()
|
||||
orderGoodsList(res)
|
||||
console.log(res);
|
||||
}
|
||||
})
|
||||
|
||||
function orderGoodsList(data) {
|
||||
let petLists = data?.petList
|
||||
if (petLists?.length<=0 )return;
|
||||
const result = petLists.map(pet => {
|
||||
// 使用对象展开运算符保留所有原有属性
|
||||
return {
|
||||
...pet,
|
||||
// 添加新的 goodsNameList 属性
|
||||
goodsNameList: pet.petDetailList
|
||||
.map(detail => detail.goodsName)
|
||||
.join(', ')
|
||||
};
|
||||
});
|
||||
orderItem.value.petList = result
|
||||
console.log(orderItem.value, ">>>>>>n===")
|
||||
}
|
||||
|
||||
//提交编辑信息
|
||||
function usetCarList() {
|
||||
orderCar(userInfo.uid).then(res => {
|
||||
if (res.code == 200) {
|
||||
const newCarList = res.data.map(car => ({
|
||||
...car, // 保留原有所有属性
|
||||
text: car.carNo, // 添加text字段，值为carNo
|
||||
value: car.id // 添加value字段，值为id
|
||||
}));
|
||||
carOptions.value = newCarList
|
||||
showCarNo.value = newCarList.find(car => car.carNo == orderItem.value.carNo)?.id
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function extractPhoneNumber(str) {
|
||||
if (str?.length <= 0) return ""
|
||||
// 尝试多种可能的格式
|
||||
const patterns = [
|
||||
/联系电话[：:]\s*(\d{11})/, // 格式：联系电话：13912712777
|
||||
/电话[：:]\s*(\d{11})/, // 格式：电话：13912712777
|
||||
/手机[：:]\s*(\d{11})/, // 格式：手机：13912712777
|
||||
/1[3-9]\d{9}/ // 直接匹配11位手机号
|
||||
];
|
||||
|
||||
// for (const pattern of patterns) {
|
||||
// const match = str.match(pattern);
|
||||
// if (match) {
|
||||
// // 返回第一个捕获组或整个匹配
|
||||
// return match[1] || match[0];
|
||||
// }
|
||||
// }
|
||||
|
||||
return ""; // 没有找到手机号
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
image {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.shop_page_container {
|
||||
// --nut-navbar-background: #FFDE5E;
|
||||
--nut-button-border-radius: 0px 25px 25px 0px;
|
||||
--nut-navbar-color: #312D22;
|
||||
--nut-button-default-color: #312D22;
|
||||
--nut-radio-button-border-radius: 8rpx;
|
||||
--nut-form-item-label-width: 50rpx;
|
||||
--nut-navbar-box-shadow: 0px 0px 0px 0px;
|
||||
--nut-textarea-font: 16pt;
|
||||
--nut-input-border-bottom:rgba(0,0,0,0);
|
||||
height: 100%;
|
||||
background-color: #F3F3F3;
|
||||
}
|
||||
|
||||
.show_box {
|
||||
background-color: #FFFFFF;
|
||||
border-radius: 16rpx 16rpx 0rpx 0rpx;
|
||||
}
|
||||
|
||||
.show_box_item {
|
||||
padding: 24rpx;
|
||||
padding-bottom: 0rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.choose_box {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
align-items: center;
|
||||
margin-top: 12rpx;
|
||||
width: 702rpx;
|
||||
height: 112rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 16rpx 16rpx 16rpx 16rpx;
|
||||
border: 2rpx solid #E5E4E4;
|
||||
color: $uni-text-color-grey;
|
||||
font-size: $uni-font-size-base;
|
||||
padding: 24rpx;
|
||||
box-sizing: border-box;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.bottom_safe_area {
|
||||
height: 128rpx;
|
||||
padding-bottom: 60rpx;
|
||||
}
|
||||
|
||||
.short_item_time {
|
||||
font-size: $uni-font-size-base;
|
||||
color: $uni-text-color-grey;
|
||||
max-width: 500rpx;
|
||||
margin-top: 20rpx;
|
||||
// text-align: right;
|
||||
}
|
||||
|
||||
.short_item_normal {
|
||||
font-size: $uni-font-size-base;
|
||||
color: $uni-text-color-grey;
|
||||
max-width: 650rpx;
|
||||
margin-top: 20rpx;
|
||||
// text-align: right;
|
||||
}
|
||||
|
||||
.shopcar_box {
|
||||
position: fixed;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
background-color: #fff;
|
||||
|
||||
.shopcar_box_list {
|
||||
height: 68rpx;
|
||||
width: 750rpx;
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-between;
|
||||
padding: 20rpx;
|
||||
box-sizing: border-box;
|
||||
|
||||
.box_list_button {
|
||||
width: 702rpx;
|
||||
height: 88rpx;
|
||||
background: linear-gradient(270deg, #FFCD35 0%, #FFDE5E 100%);
|
||||
border-radius: 74rpx 74rpx 74rpx 74rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: $uni-text-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.con_content {
|
||||
color: #444137;
|
||||
font-size: 13pt;
|
||||
}
|
||||
|
||||
.con_content_address {
|
||||
color: #444137;
|
||||
font-size: 13pt;
|
||||
white-space: nowrap;
|
||||
/* 禁止换行 */
|
||||
overflow: hidden;
|
||||
/* 隐藏超出部分 */
|
||||
text-overflow: ellipsis;
|
||||
/* 超出部分显示省略号 */
|
||||
// width: 500px; /* 设置一个固定宽度或最大宽度 */
|
||||
}
|
||||
|
||||
.submit-btn {
|
||||
// margin-top: 50rpx;
|
||||
height: 88rpx;
|
||||
width: 700rpx;
|
||||
line-height: 88rpx;
|
||||
border-radius: 44rpx;
|
||||
color: #ffffff;
|
||||
font-size: 32rpx;
|
||||
background-color: #cccccc;
|
||||
transition: background-color 0.3s;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.base_box {
|
||||
width: 702rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 16rpx 16rpx 16rpx 16rpx;
|
||||
padding: 24rpx;
|
||||
box-sizing: border-box;
|
||||
margin: 24rpx;
|
||||
}
|
||||
|
||||
.short_box {
|
||||
padding-bottom: 0rpx;
|
||||
background-color: #FFFFFF;
|
||||
|
||||
.short_item {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 26rpx;
|
||||
padding: 24rpx;
|
||||
|
||||
.short_item_title {
|
||||
color: $uni-text-color;
|
||||
font-size: $uni-font-size-base;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.short_item_time {
|
||||
font-size: $uni-font-size-base;
|
||||
color: $uni-text-color-grey;
|
||||
max-width: 500rpx;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.short_item_pay {
|
||||
font-size: $uni-font-size-base;
|
||||
color: $uni-text-color-grey;
|
||||
max-width: 500rpx;
|
||||
text-align: right;
|
||||
color: red;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.short_box::after {
|
||||
content: '';
|
||||
display: table;
|
||||
}
|
||||
.loaction_icon {
|
||||
position: absolute;
|
||||
right: 44rpx;
|
||||
width: 32rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
.choose_box_text {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
align-items: center;
|
||||
margin-top: 12rpx;
|
||||
width: 702rpx;
|
||||
height: 112rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 16rpx 16rpx 16rpx 16rpx;
|
||||
border: 2rpx solid #E5E4E4;
|
||||
color: $uni-text-color-grey;
|
||||
font-size: $uni-font-size-base;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user