bonus
/
Zlpt_Portal
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

承租方订单页面优化

This commit is contained in:
BianLzhaoMin 2024-12-11 16:10:20 +08:00
parent 9c3ae0bc5a
commit d288f3131f
6 changed files with 290 additions and 110 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
components.d.ts vendored
View File

@ -18,13 +18,11 @@ declare module 'vue' {
ElCheckbox: typeof import('element-plus/es')['ElCheckbox'] ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
ElCol: typeof import('element-plus/es')['ElCol'] ElCol: typeof import('element-plus/es')['ElCol']
ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider'] ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
ElCountdown: typeof import('element-plus/es')['ElCountdown']
ElDatePicker: typeof import('element-plus/es')['ElDatePicker'] ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
ElDialog: typeof import('element-plus/es')['ElDialog'] ElDialog: typeof import('element-plus/es')['ElDialog']
ElEmpty: typeof import('element-plus/es')['ElEmpty'] ElEmpty: typeof import('element-plus/es')['ElEmpty']
ElForm: typeof import('element-plus/es')['ElForm'] ElForm: typeof import('element-plus/es')['ElForm']
ElFormItem: typeof import('element-plus/es')['ElFormItem'] ElFormItem: typeof import('element-plus/es')['ElFormItem']
ElHeader: typeof import('element-plus/es')['ElHeader']
ElIcon: typeof import('element-plus/es')['ElIcon'] ElIcon: typeof import('element-plus/es')['ElIcon']
ElImage: typeof import('element-plus/es')['ElImage'] ElImage: typeof import('element-plus/es')['ElImage']
ElInput: typeof import('element-plus/es')['ElInput'] ElInput: typeof import('element-plus/es')['ElInput']
@ -32,7 +30,6 @@ declare module 'vue' {
ElMenu: typeof import('element-plus/es')['ElMenu'] ElMenu: typeof import('element-plus/es')['ElMenu']
ElMenuItem: typeof import('element-plus/es')['ElMenuItem'] ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
ElOption: typeof import('element-plus/es')['ElOption'] ElOption: typeof import('element-plus/es')['ElOption']
ElPageHeader: typeof import('element-plus/es')['ElPageHeader']
ElPagination: typeof import('element-plus/es')['ElPagination'] ElPagination: typeof import('element-plus/es')['ElPagination']
ElPopconfirm: typeof import('element-plus/es')['ElPopconfirm'] ElPopconfirm: typeof import('element-plus/es')['ElPopconfirm']
ElProgress: typeof import('element-plus/es')['ElProgress'] ElProgress: typeof import('element-plus/es')['ElProgress']

4
env/.env.dev vendored
View File

@ -10,8 +10,8 @@ VITE_API_URL = '/proxyApi'
# VITE_proxyTarget = 'http://192.168.2.246:28080' # 马帅 # VITE_proxyTarget = 'http://192.168.2.246:28080' # 马帅
# VITE_proxyTarget = 'http://192.168.2.127:28080' # 梁超 # VITE_proxyTarget = 'http://192.168.2.127:28080' # 梁超
# VITE_proxyTarget = 'http://36.33.26.201:17788/proxyApi' # 测试服务 # VITE_proxyTarget = 'http://36.33.26.201:17788/proxyApi' # 测试服务
VITE_proxyTarget = 'http://192.168.0.244:28580' # 测试服务 # VITE_proxyTarget = 'http://192.168.0.244:28580' # 测试服务
# VITE_proxyTarget = 'http://192.168.2.129:18080' # 马帅j VITE_proxyTarget = 'http://192.168.2.72:28080' # 马帅j
# VITE_proxyTarget = 'http://10.40.92.185:9206' # 赵福海 ( 设备类型) # VITE_proxyTarget = 'http://10.40.92.185:9206' # 赵福海 ( 设备类型)
# VITE_proxyTarget = 'http://10.40.92.16:9502' # 牛 (个人中心 基础信息企业申请认证) # VITE_proxyTarget = 'http://10.40.92.16:9502' # 牛 (个人中心 基础信息企业申请认证)

50
src/views/cart/index.vue
View File

@ -271,32 +271,32 @@ onMounted(() => {
// } // }
// } // }
const onLeaseDateChange = (value: any, companyIndex: number, goodsIndex: number) => { const onLeaseDateChange = (value: any, companyIndex: number, goodsIndex: number) => {
// if (!value) { if (!value) {
// cardList.value[companyIndex].devInfoVoList[goodsIndex].rentBeginTime = '' cardList.value[companyIndex].devInfoVoList[goodsIndex].rentBeginTime = ''
// cardList.value[companyIndex].devInfoVoList[goodsIndex].rentEndTime = '' cardList.value[companyIndex].devInfoVoList[goodsIndex].rentEndTime = ''
// cardList.value[companyIndex].devInfoVoList[goodsIndex].days = 0 cardList.value[companyIndex].devInfoVoList[goodsIndex].days = 0
// } else { } else {
// cardList.value[companyIndex].devInfoVoList[goodsIndex].rentBeginTime = value[0] cardList.value[companyIndex].devInfoVoList[goodsIndex].rentBeginTime = value[0]
// cardList.value[companyIndex].devInfoVoList[goodsIndex].rentEndTime = value[1] cardList.value[companyIndex].devInfoVoList[goodsIndex].rentEndTime = value[1]
// cardList.value[companyIndex].devInfoVoList[goodsIndex].days = moment(value[1]).diff( cardList.value[companyIndex].devInfoVoList[goodsIndex].days = moment(value[1]).diff(
// value[0], value[0],
// 'day', 'day',
// ) )
// } }
cardList.value.forEach((e: any) => { // cardList.value.forEach((e: any) => {
e.devInfoVoList.forEach((j: any) => { // e.devInfoVoList.forEach((j: any) => {
if (!value) { // if (!value) {
j.rentBeginTime = '' // j.rentBeginTime = ''
j.rentEndTime = '' // j.rentEndTime = ''
j.days = 0 // j.days = 0
} else { // } else {
j.rentBeginTime = value[0] // j.rentBeginTime = value[0]
j.rentEndTime = value[1] // j.rentEndTime = value[1]
j.days = moment(value[1]).diff(value[0], 'day') // j.days = moment(value[1]).diff(value[0], 'day')
} // }
}) // })
}) // })
} }
// 删除按钮 // 删除按钮

39
src/views/user/orderManagement/components/order-details.vue
View File

@ -369,6 +369,7 @@ if (props.orderStatus == 7) {
? 'border-bottom:1px solid #eee' ? 'border-bottom:1px solid #eee'
: '' : ''
" "
style="min-height: 140px"
> >
<el-image <el-image
:src="goods.url" :src="goods.url"
@ -378,6 +379,7 @@ if (props.orderStatus == 7) {
/> />
<div <div
style=" style="
min-height: 140px;
flex: 1; flex: 1;
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
@ -404,16 +406,40 @@ if (props.orderStatus == 7) {
</div> </div>
</div> </div>
</el-col> </el-col>
<el-col :span="5" class="order-items-info"> <el-col :span="5" class="order-items-info">
<div
v-for="(goods, j) in orderDetails.detailsList"
:key="j"
class="order-items order-info"
:style="
j != orderDetails.detailsList.length - 1
? 'border-bottom:1px solid #eee'
: ''
"
style="min-height: 140px; width: 100%"
>
<div
style="
width: 100%;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
"
>
<div>租期</div>
<div style="font-weight: bold; margin-top: 10px">
{{ goods.rentBeginTime }}至{{ goods.rentEndTime }}
</div>
</div>
</div>
</el-col>
<el-col :span="5" class="order-items-info" style="border: none">
<div>总费用</div> <div>总费用</div>
<div class="red-font">{{ orderDetails.cost }} 元</div> <div class="red-font">{{ orderDetails.cost }} 元</div>
</el-col> </el-col>
<el-col :span="5" class="order-items-info" style="border: none">
<div>租期</div>
<div style="font-weight: bold; margin-top: 10px">
{{ orderDetails.startTime }}至{{ orderDetails.endTime }}
</div>
</el-col>
</el-row> </el-row>
</div> </div>
</div> </div>
@ -592,6 +618,7 @@ if (props.orderStatus == 7) {
.order-info { .order-info {
display: flex; display: flex;
padding: 10px 0; padding: 10px 0;
align-items: center;
} }
.order-items-info { .order-items-info {

256
src/views/user/orderManagement/components/order-home.vue
View File

@ -46,17 +46,27 @@ const pageNumber = 1
const total: any = ref(0) const total: any = ref(0)
const cardList = ref<any>([]) const cardList = ref<any>([])
const status = 0 const status = 0
const statusList = [ const statusList: any = [
{ id: '1', name: '待接单' }, { id: '1', name: '待接单' },
{ id: '2', name: '待出库' }, { id: '2', name: '待出库' },
{ id: '3', name: '待收货' }, { id: '3', name: '待收货' },
{ id: '4', name: '租赁中' }, { id: '4', name: '租赁中' },
{ id: '5', name: '已退租' }, { id: '5', name: '已退租待结算' },
{ id: '6', name: '已完成' }, { id: '6', name: '结算待确认' },
{ id: '7', name: '已完成' }, { id: '7', name: '已完成' },
{ id: '8', name: '已驳回' }, { id: '8', name: '已驳回' },
] ]
const orderText = (status: any) => {
return statusList.filter((e: any) => e.id == status)[0].name
}
const orderType = (status: any) => {
if (status == 1 || status == 2 || status == 3 || status == 5) return 'primary'
if (status == 4 || status == 7) return 'success'
if (status == 5 || status == 6) return 'warning'
if (status == 8) return 'danger'
}
// const dateTimeConvert=(param:string)=>{ // const dateTimeConvert=(param:string)=>{
// const time = param; // const time = param;
// // 创建一个新的Date对象 // // 创建一个新的Date对象
@ -183,16 +193,38 @@ const dialogVisible: any = ref(false)
const dialogImageUrl = ref('') const dialogImageUrl = ref('')
// 发起退租 // 发起退租
const handleViewBack = async (row: any) => { const handleViewBack = async (goods: any, row: any) => {
ElMessageBox.confirm('是否确定发起退租？', { ElMessageBox.confirm('是否确定发起退租？', {
confirmButtonText: '确定', confirmButtonText: '确定',
cancelButtonText: '取消', cancelButtonText: '取消',
type: 'warning', type: 'warning',
})
.then(() => {
return passApi({ orderId: row.orderId, orderStatus: 5, maIds: [goods.maId] })
})
.then((res: any) => {
if (res.code === 200) {
ElMessage({
type: 'success',
message: '发起退租成功',
})
numberTemp.value = numberTemp.value + 1
getList()
}
})
.catch(() => {})
}
// 全部退租
const handleViewBackAll = (row: any) => {
ElMessageBox.confirm('是否确定发起全部退租？', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}) })
.then(() => { .then(() => {
return passApi({ orderId: row.orderId, orderStatus: 5 }) return passApi({ orderId: row.orderId, orderStatus: 5 })
}) })
.then((res) => { .then((res: any) => {
if (res.code === 200) { if (res.code === 200) {
ElMessage({ ElMessage({
type: 'success', type: 'success',
@ -506,7 +538,17 @@ const costSubmit = () => {
{{ item.czcompanyName }} {{ item.czcompanyName }}
</span> </span>
</el-col> </el-col>
<div class="order-type-box">
<el-tag
style="padding: 6px 12px"
:type="orderType(item.orderStatus)"
effect="light"
>{{ orderText(item.orderStatus) }}</el-tag
>
</div>
</el-row> </el-row>
<el-row <el-row
style="border-bottom: 1px solid #ccc; margin-bottom: 10px" style="border-bottom: 1px solid #ccc; margin-bottom: 10px"
class="order-title-info" class="order-title-info"
@ -537,6 +579,7 @@ const costSubmit = () => {
v-for="(goods, j) in item.detailsList" v-for="(goods, j) in item.detailsList"
:key="j" :key="j"
class="order-items order-info" class="order-items order-info"
style="min-height: 140px"
:style=" :style="
j != item.detailsList.length - 1 j != item.detailsList.length - 1
? 'border-bottom:1px solid #eee' ? 'border-bottom:1px solid #eee'
@ -547,6 +590,7 @@ const costSubmit = () => {
<div <div
style=" style="
flex: 1; flex: 1;
min-height: 140px;
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
flex-direction: column; flex-direction: column;
@ -576,13 +620,50 @@ const costSubmit = () => {
<div class="red-font">{{ item.cost }} 元</div> <div class="red-font">{{ item.cost }} 元</div>
</el-col> </el-col>
<el-col :span="4" class="order-items-info"> <el-col :span="4" class="order-items-info">
<div>租期</div> <div
<div style="font-weight: bold; margin-top: 10px"> v-for="(goods, j) in item.detailsList"
{{ item.startTime }}至{{ item.endTime }} :key="j"
class="order-info"
:style="
j != item.detailsList.length - 1
? 'border-bottom:1px solid #eee'
: ''
"
style="min-height: 140px"
>
<div
style="
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
"
>
<div>租期</div>
<div style="font-weight: bold; margin-top: 10px">
{{ goods.rentBeginTime }}至{{ goods.rentEndTime }}
</div>
</div>
</div> </div>
</el-col> </el-col>
<el-col :span="3" class="order-items-info"> <el-col :span="3" class="order-items-info">
<div <div
v-for="(goods, j) in item.detailsList"
:key="j"
class="order-info"
:style="
j != item.detailsList.length - 1
? 'border-bottom:1px solid #eee'
: ''
"
style="min-height: 140px; width: 95%"
>
<el-tag :type="orderType(goods.orderStatus)" effect="light">{{
orderText(goods.orderStatus)
}}</el-tag>
</div>
<!-- <div
v-if="item.orderStatus == '1'" v-if="item.orderStatus == '1'"
style=" style="
font-size: 14px; font-size: 14px;
@ -681,62 +762,90 @@ const costSubmit = () => {
" "
> >
{{ '已驳回' }} {{ '已驳回' }}
</div> -->
</el-col>
<el-col :span="2" class="order-items-info" v-if="item.orderStatus == 4">
<div
v-for="(goods, j) in item.detailsList"
:key="j"
class="order-info"
:style="
j != item.detailsList.length - 1
? 'border-bottom:1px solid #eee'
: ''
"
style="min-height: 140px; width: 95%"
>
<el-button
v-if="goods.orderStatus == 4"
@click="handleViewBack(goods, item)"
type="primary"
size="small"
>
发起退租
</el-button>
</div> </div>
</el-col> </el-col>
<el-col :span="6" class="handle-btn"> <el-col
<el-button :span="item.orderStatus == 4 ? 4 : 6"
v-if="item.orderStatus == '3'" style="display: flex; align-items: center"
type="primary" >
size="small" <div :class="item.orderStatus == 4 ? 'handle-btn-4' : 'handle-btn'">
@click="confirmReceipt(index)" <el-button
>确认收货</el-button v-if="item.orderStatus == '2'"
> type="primary"
<el-button size="small"
v-if="item.orderStatus == '2'" @click="confirmFail(index)"
type="primary" >取消</el-button
size="small" >
@click="confirmFail(index)"
>取消</el-button
>
<el-button @click="handleViewOrder(j, item)" type="primary" size="small"> <el-button
订单详情 @click="handleViewOrder(j, item)"
</el-button> type="primary"
<el-button @click="handleViewWord(j)" type="primary" size="small"> size="small"
租赁协议 >
</el-button> 订单详情
<el-button </el-button>
v-if="item.orderStatus == '4'" <el-button @click="handleViewWord(j)" type="primary" size="small">
@click="handleViewBack(item)" 租赁协议
type="primary" </el-button>
size="small"
> <el-button
发起退租 v-if="item.orderStatus == '6' || item.orderStatus == '7'"
</el-button> @click="handleViewList(item.orderId)"
<el-button type="primary"
v-if="item.orderStatus == '6' || item.orderStatus == '7'" size="small"
@click="handleViewList(item.orderId)" >
type="primary" 费用清单
size="small" </el-button>
> <el-button
费用清单 v-if="item.orderStatus == 7 && item.isLeaseContent == 1"
</el-button> @click="onViewOverhaulDetails(item.orderId)"
<el-button type="primary"
v-if="item.orderStatus == 7 && item.isLeaseContent == 1" size="small"
@click="onViewOverhaulDetails(item.orderId)" >
type="primary" 检修详情
size="small" </el-button>
> <el-button
检修详情 v-if="item.orderStatus == 6 && item.isLeaseContent == 1"
</el-button> @click="onCostConfirm(item.orderId)"
<el-button type="primary"
v-if="item.orderStatus == 6 && item.isLeaseContent == 1" size="small"
@click="onCostConfirm(item.orderId)" >
type="primary" 费用确认
size="small" </el-button>
>
费用确认 <el-button
</el-button> v-if="item.orderStatus == 4"
@click="handleViewBackAll(item)"
type="primary"
size="small"
>
全部退租
</el-button>
<el-button type="primary" size="small"> 发起减免 </el-button>
</div>
</el-col> </el-col>
</el-row> </el-row>
</div> </div>
@ -1506,9 +1615,16 @@ const costSubmit = () => {
} }
.order-title-info { .order-title-info {
padding: 6px 4px; position: relative;
padding: 14px 4px;
font-size: 14px; font-size: 14px;
color: #999; color: #999;
.order-type-box {
position: absolute;
top: 0;
right: 0;
}
} }
.order-items { .order-items {
@ -1518,6 +1634,8 @@ const costSubmit = () => {
.order-info { .order-info {
display: flex; display: flex;
padding: 10px 0; padding: 10px 0;
align-items: center;
justify-content: center;
} }
.order-items-info { .order-items-info {
@ -1535,6 +1653,7 @@ const costSubmit = () => {
} }
.handle-btn { .handle-btn {
width: 100%;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
align-items: center; align-items: center;
@ -1544,4 +1663,17 @@ const costSubmit = () => {
margin-left: 10px !important; margin-left: 10px !important;
} }
} }
.handle-btn-4 {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
.el-button {
width: calc((100% - 20px) / 2);
// margin: 0;
margin-left: 10px !important;
margin-bottom: 10px;
}
}
</style> </style>

48
src/views/user/orderManagementCz/components/order-details.vue
View File

@ -157,7 +157,6 @@ console.log(props.orderStatus, 'orderStatus', props.orderId, 'orderId')
const time = ref([]) const time = ref([])
const currentActive = ref(0) const currentActive = ref(0)
const type = ref(0)
const stepList = ref([ const stepList = ref([
{ {
title: '待接单', title: '待接单',
@ -176,22 +175,20 @@ const stepList = ref([
description: '', description: '',
}, },
{ {
title: '待退租结算', title: '退租待结算',
description: '', description: '',
}, },
{ {
title: '待结算确认', title: '结算待确认',
description: '', description: '',
}, },
{ {
title: '已完成', title: '已完成',
description: '', description: '',
}, },
]) ])
// const setStepType = (status: any) => {
// }
if (props.orderStatus == 1) { if (props.orderStatus == 1) {
currentActive.value = 0 currentActive.value = 0
} }
@ -372,6 +369,7 @@ if (props.orderStatus == 7) {
? 'border-bottom:1px solid #eee' ? 'border-bottom:1px solid #eee'
: '' : ''
" "
style="min-height: 140px"
> >
<el-image <el-image
:src="goods.url" :src="goods.url"
@ -381,6 +379,7 @@ if (props.orderStatus == 7) {
/> />
<div <div
style=" style="
min-height: 140px;
flex: 1; flex: 1;
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
@ -407,16 +406,40 @@ if (props.orderStatus == 7) {
</div> </div>
</div> </div>
</el-col> </el-col>
<el-col :span="5" class="order-items-info"> <el-col :span="5" class="order-items-info">
<div
v-for="(goods, j) in orderDetails.detailsList"
:key="j"
class="order-items order-info"
:style="
j != orderDetails.detailsList.length - 1
? 'border-bottom:1px solid #eee'
: ''
"
style="min-height: 140px; width: 100%"
>
<div
style="
width: 100%;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
"
>
<div>租期</div>
<div style="font-weight: bold; margin-top: 10px">
{{ goods.rentBeginTime }}至{{ goods.rentEndTime }}
</div>
</div>
</div>
</el-col>
<el-col :span="5" class="order-items-info" style="border: none">
<div>总费用</div> <div>总费用</div>
<div class="red-font">{{ orderDetails.cost }} 元</div> <div class="red-font">{{ orderDetails.cost }} 元</div>
</el-col> </el-col>
<el-col :span="5" class="order-items-info" style="border: none">
<div>租期</div>
<div style="font-weight: bold; margin-top: 10px">
{{ orderDetails.startTime }}至{{ orderDetails.endTime }}
</div>
</el-col>
</el-row> </el-row>
</div> </div>
</div> </div>
@ -595,6 +618,7 @@ if (props.orderStatus == 7) {
.order-info { .order-info {
display: flex; display: flex;
padding: 10px 0; padding: 10px 0;
align-items: center;
} }
.order-items-info { .order-items-info {