出租方订单管理

This commit is contained in:
jjLv 2024-11-27 09:06:45 +08:00
parent aabe6c4003
commit c767bd2593
3 changed files with 396 additions and 81 deletions

6
auto-imports.d.ts vendored
View File

@ -46,6 +46,7 @@ declare global {
const onServerPrefetch: typeof import('vue')['onServerPrefetch']
const onUnmounted: typeof import('vue')['onUnmounted']
const onUpdated: typeof import('vue')['onUpdated']
const onWatcherCleanup: typeof import('vue')['onWatcherCleanup']
const provide: typeof import('vue')['provide']
const reactive: typeof import('vue')['reactive']
const readonly: typeof import('vue')['readonly']
@ -66,10 +67,13 @@ declare global {
const useAttrs: typeof import('vue')['useAttrs']
const useCssModule: typeof import('vue')['useCssModule']
const useCssVars: typeof import('vue')['useCssVars']
const useId: typeof import('vue')['useId']
const useLink: typeof import('vue-router')['useLink']
const useModel: typeof import('vue')['useModel']
const useRoute: typeof import('vue-router')['useRoute']
const useRouter: typeof import('vue-router')['useRouter']
const useSlots: typeof import('vue')['useSlots']
const useTemplateRef: typeof import('vue')['useTemplateRef']
const watch: typeof import('vue')['watch']
const watchEffect: typeof import('vue')['watchEffect']
const watchPostEffect: typeof import('vue')['watchPostEffect']
@ -78,6 +82,6 @@ declare global {
// for type re-export
declare global {
// @ts-ignore
export type { Component, ComponentPublicInstance, ComputedRef, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, VNode, WritableComputedRef } from 'vue'
export type { Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue'
import('vue')
}

19
components.d.ts vendored
View File

@ -3,30 +3,25 @@
// @ts-nocheck
// Generated by unplugin-vue-components
// Read more: https://github.com/vuejs/core/pull/3399
export { }
export {}
declare module 'vue' {
export interface GlobalComponents {
Breadcrumb: typeof import('./src/components/Breadcrumb/index.vue')['default']
ElBreadcrumb: typeof import('element-plus/es')['ElBreadcrumb']
ElBreadcrumbItem: typeof import('element-plus/es')['ElBreadcrumbItem']
ElButton: typeof import('element-plus/es')['ElButton']
ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
ElCol: typeof import('element-plus/es')['ElCol']
ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
ElForm: typeof import('element-plus/es')['ElForm']
ElFormItem: typeof import('element-plus/es')['ElFormItem']
ElIcon: typeof import('element-plus/es')['ElIcon']
ElImage: typeof import('element-plus/es')['ElImage']
ElInputNumber: typeof import('element-plus/es')['ElInputNumber']
ElOption: typeof import('element-plus/es')['ElOption']
ElInput: typeof import('element-plus/es')['ElInput']
ElMenu: typeof import('element-plus/es')['ElMenu']
ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
ElPagination: typeof import('element-plus/es')['ElPagination']
ElPopconfirm: typeof import('element-plus/es')['ElPopconfirm']
ElRadioButton: typeof import('element-plus/es')['ElRadioButton']
ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
ElRow: typeof import('element-plus/es')['ElRow']
ElSelect: typeof import('element-plus/es')['ElSelect']
ElTable: typeof import('element-plus/es')['ElTable']
ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
ElTag: typeof import('element-plus/es')['ElTag']
EquipCard: typeof import('./src/components/equipCard.vue')['default']
EquipCardHall: typeof import('./src/components/equipCardHall/index.vue')['default']
EquipCardNew: typeof import('./src/components/equipCardNew/index.vue')['default']

View File

@ -5,19 +5,145 @@
import { getOrderListApi } from 'http/api/usercenter/seekorder'
const queryParams = ref({})
const router = useRouter()
const pageSize = 20
const pageSize = 10
const pageNumber = 1
const total: any = ref(0)
const cardList= ref<any>([])
const status = 0
//
const getList = async () => {
const res: any = await getOrderListApi()
console.log('获取数据列表***', res)
tableData.value = res.rows
total.value = res.total
}
// const getList = async () => {
// const res: any = await getOrderListApi()
// console.log('***', res)
// tableData.value = res.rows
// total.value = res.total
// }
/** 查询列表 */
const getList = async()=> {
// if(this.dateRange.length>0){
// this.queryParams.startTime=this.dateRange[0]
// this.queryParams.endTime=this.dateRange[1]
// }else{
// this.queryParams.startTime=undefined
// this.queryParams.endTime=undefined
// }
cardList.value = [
{
company_name: '安徽博诺斯有限公司',
user_name: '王先生',
user_phone: '18725632356',
isChecked: false,
good_list: [
{
goods_pic:
'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1',
goods_name: 'W190挖掘机',
goods_code: '995221_JHL',
goods_type: '挖地型号996',
lease_date: '',
lease_pic: 300,
lease_day: 1,
goods_num: 0,
totalAmount: 0,
isChecked: false,
lease_date_string: '',
getList()
},
],
},
{
company_name: '安徽博诺斯有限公司',
user_name: '王先生',
user_phone: '18725632356',
isChecked: false,
good_list: [
{
goods_pic:
'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1',
goods_name: 'W190挖掘机',
goods_code: '995221_JHL',
goods_type: '挖地型号996',
lease_date: '',
lease_pic: 300,
lease_day: 0,
goods_num: 0,
totalAmount: 0,
isChecked: false,
lease_date_string: '',
},
{
goods_pic:
'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1',
goods_name: 'W190挖掘机',
goods_code: '995221_JHL',
goods_type: '挖地型号996',
lease_date: '',
lease_pic: 300,
lease_day: 0,
goods_num: 0,
totalAmount: 0,
isChecked: false,
lease_date_string: '',
},
{
goods_pic:
'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1',
goods_name: 'W190挖掘机',
goods_code: '995221_JHL',
goods_type: '挖地型号996',
lease_date: '',
lease_pic: 300,
lease_day: 0,
goods_num: 0,
totalAmount: 0,
isChecked: false,
lease_date_string: '',
},
],
},
{
company_name: '安徽博诺斯有限公司',
user_name: '王先生',
user_phone: '18725632356',
isChecked: false,
good_list: [
{
goods_pic:
'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1',
goods_name: 'W190挖掘机',
goods_code: '995221_JHL',
goods_type: '挖地型号996',
lease_date: '',
lease_pic: 300,
lease_day: 0,
goods_num: 0,
totalAmount: 0,
isChecked: false,
lease_date_string: '',
},
{
goods_pic:
'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1',
goods_name: 'W190挖掘机',
goods_code: '995221_JHL',
goods_type: '挖地型号996',
lease_date: '',
lease_pic: 300,
lease_day: 0,
goods_num: 0,
totalAmount: 0,
isChecked: false,
lease_date_string: '',
},
],
},
];
total.value = cardList.value.length;
console.log(total.value)
}
onMounted(() => {
getList()
})
//
const queryTableList = () => {
@ -71,6 +197,7 @@
<template>
<!-- 订单管理 -->
<div class="container">
<el-form :model="queryParams" :inline="true" size="small">
<el-form-item label="订单编号:" prop="menuName">
<el-input />
@ -96,73 +223,262 @@
</el-form-item>
<el-form-item>
<el-button type="primary" @click="queryTableList">查询</el-button>
<el-button type="success">保存</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<!-- 表格 -->
<el-table
:data="tableData"
style="width: 100%"
show-overflow-tooltip
:header-cell-style="{
background: '#3E98FF',
color: '#fff'
}"
height="440px"
max-height="440px">
<el-table-column align="center" prop="code" label="订单编号" />
<el-table-column align="center" prop="supplierCompany" label="供应商" />
<el-table-column align="center" prop="time" label="订单创建日期" />
<el-table-column align="center" prop="typeName" label="装备类型" />
<el-table-column align="center" prop="deviceName" label="装备名称" />
<el-table-column align="center" label="订单状态">
<template #default="{ row }">
<el-tag v-if="row.orderStatus == 31">待确认</el-tag>
<el-tag v-if="row.orderStatus == 32">待合同上传</el-tag>
<el-tag v-if="row.orderStatus == 35">待收货</el-tag>
<el-tag v-if="row.orderStatus == 36">进行中</el-tag>
</template>
</el-table-column>
<el-table-column align="center" prop="name" label="操作" width="160px">
<template #default="scope">
<el-button size="small" type="primary" @click="clickPreviewDetails(scope.row)">
查看
</el-button>
<el-button
size="small"
type="danger"
@click="clickRentingTermination"
v-if="scope.row.orderStatus == 36">
退租
</el-button>
<el-button
size="small"
type="warning"
@click="clickRenewalOfLease"
v-if="scope.row.orderStatus == 36">
续租
</el-button>
<el-button
size="small"
type="success"
@click="clickConfirmReceipt(scope.row)"
v-if="scope.row.orderStatus == 35">
确认收货
</el-button>
</template>
</el-table-column>
</el-table>
<div class="cart-tbody" v-for="(item, index) in cardList" :key="index">
<el-row style="border-bottom: 1px solid #ccc">
<el-col :span="1">
<div style="text-align: center">
<el-checkbox
v-model="item.isChecked"
@change="onChangeCompany($event, index, item)"
>
</el-checkbox>
</div>
</el-col>
<el-col :span="22">
<el-row>
<el-col :span="7">
<div class="item" style="flex-shrink: 0;margin-bottom: 5px;font-size: 12px;">
<span>订单编号:</span>
{{ item.company_name }}
</div>
</el-col>
<el-col :span="7">
<div class="item" style="flex-shrink: 0;margin-bottom: 5px;font-size: 12px;">
<span class="user-name">下单时间:</span>
{{ item.user_name }}
</div>
</el-col>
<el-col :span="7">
<div class="item" style="flex-shrink: 0;margin-bottom: 5px;font-size: 12px;">
<span class="user-phone">装备所属公司:</span>
{{ item.user_phone }}
</div>
</el-col>
<el-col :span="2">
<div style="flex-shrink: 0;margin-bottom: 1px;font-size: 7px;">
<el-button v-if="status==0" class="item" type="primary" size="small">出库</el-button>
<el-button v-if="status==0" class="item" type="primary" size="small">驳回</el-button>
</div>
</el-col>
</el-row>
<PagingComponent
<el-row>
<el-col :span="7">
<div class="item" style="flex-shrink: 0;margin-bottom: 5px;font-size: 12px;">
<span>出租方联系电话:</span>
{{ item.company_name }}
</div>
</el-col>
<el-col :span="7">
<div class="item" style="flex-shrink: 0;margin-bottom: 5px;font-size: 12px;">
<span class="user-name">承租方联系电话:</span>
{{ item.user_name }}
</div>
</el-col>
<el-col :span="7">
<div class="item" style="flex-shrink: 0;margin-bottom: 5px;font-size: 12px;">
<span class="user-phone">承租方地址:</span>
{{ item.user_phone }}
</div>
</el-col>
</el-row>
</el-col>
</el-row>
<el-row class="cart-list" v-for="(goods, j) in item.good_list" :key="j">
<el-col :span="1">
<div style="text-align: center">
<el-checkbox v-model="goods.isChecked" @change="onChangeGoods(index)">
</el-checkbox>
</div>
</el-col>
<el-col :span="8" class="goods-info">
<el-col :span="7">
<img :src="goods.goods_pic" alt="" />
</el-col>
<div class="goods-code">
<div style="font-size: 12px; font-weight: bold">{{ goods.goods_name }}</div>
<div>租期 {{ goods.lease_day }}{{" "+"天"}}</div>
<div>租金{{ goods.lease_pic }}{{" "+"元/天"}}</div>
<div>数量{{ goods.goods_num }}{{" "+"台"}}</div>
</div>
</el-col>
<el-col :span="2">
<div style="font-size: 14px; font-weight: bold;margin-bottom:10px">总费用</div>
<div class="red-font">1500</div>
</el-col>
<el-col :span="6">
<div style="font-size: 14px; font-weight: bold;margin-bottom:10px">租期</div>
<div style="color:black;font-weight: bold;">
{{ "2024-10-11"+" " }}{{"至"}}{{ " "+"2024-10-11" }}
</div>
</el-col>
<el-col :span="2">
<div style="font-size: 14px; font-weight: bold;margin-bottom:10px">
{{ "待出租"}}
</div>
</el-col>
<el-col :span="3">
<div>
<el-button
@click="handleViewOrder(j)"
type="text"
size="mini"
style="color: #blue; font-weight: bold"
>
订单详情
</el-button>
<el-button
@click="handleViewOrder(j)"
type="text"
size="mini"
style="color: #blue; font-weight: bold"
>
租赁协议
</el-button>
<el-button
@click="handleViewOrder(j)"
type="text"
size="mini"
style="color: #blue; font-weight: bold"
>
退租检修
</el-button>
<el-button
@click="handleViewOrder(j)"
type="text"
size="mini"
style="color: #blue; font-weight: bold"
>
费用结算
</el-button>
</div>
</el-col>
</el-row>
<PagingComponent
@getList="getList"
:pageSize="pageSize"
:pageNumber="pageNumber"
:total="total" />
:total="total" />
</div>
</div>
</template>
<style>
.el-form {
margin: 15px 0;
<style lang="scss" scoped>
.container {
width: 800px;
margin: 0 auto;
padding: 10px;
background: #eeeff6;
font-size: 14px;
.cart-title {
margin-top: 10px;
padding: 10px 0;
display: flex;
align-items: center;
font-size: 14px;
font-weight: bold;
letter-spacing: 1px;
}
.cart-title div:first-child {
width: 5px;
height: 20px;
background-color: #4fabfe;
}
.cart-th {
margin: 15px 0;
div {
text-align: center;
}
}
.cart-tbody {
background: #fff;
padding: 8px 12px;
margin: 10px;
.cart-user-info {
display: flex;
align-items: center;
font-size: 13px;
.user-name,
.user-phone {
padding: 3px 18px;
border: 1px solid #ccc;
}
.user-name {
margin-left: 20px;
border-right: none;
}
}
.cart-list {
margin: 15px 0;
display: flex;
align-items: center;
font-size: 13px;
div {
text-align: center;
}
.goods-info {
display: flex;
align-content: center;
img {
width: 140px;
height: 80px;
}
.goods-code {
margin-left: 70px;
display: flex;
flex-direction: column;
justify-content: space-around;
div {
text-align: left;
}
}
}
.lease-date {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
font-size: 12px;
}
.red-font {
color: #ff4800;
font-weight: bold;
}
}
}
.protocol-handle {
background: #fff;
padding: 8px 12px;
margin: 10px;
font-size: 13px;
.checkbox-container a {
color: #ff4800;
text-decoration: underline;
}
}
}
</style>