2025-09-22 09:59:47 +08:00
|
|
|
|
<template>
|
|
|
|
|
|
<div class="app-container app-container-content">
|
|
|
|
|
|
<!-- 搜索表单 -->
|
|
|
|
|
|
<el-form
|
|
|
|
|
|
:model="queryParams"
|
|
|
|
|
|
ref="queryForm"
|
|
|
|
|
|
size="small"
|
|
|
|
|
|
:inline="true"
|
|
|
|
|
|
v-show="showSearch"
|
2025-11-12 18:05:13 +08:00
|
|
|
|
label-width="auto"
|
2025-09-22 09:59:47 +08:00
|
|
|
|
>
|
2025-11-12 18:05:13 +08:00
|
|
|
|
<el-card class="search-box">
|
|
|
|
|
|
<el-row :gutter="5" style="display: flex; justify-content: space-between">
|
|
|
|
|
|
<el-col :span="5" style="width: 320px">
|
|
|
|
|
|
<el-form-item prop="deviceName" label="装备名称">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="queryParams.deviceName"
|
|
|
|
|
|
placeholder="请输入装备名称"
|
|
|
|
|
|
clearable
|
|
|
|
|
|
@keyup.enter.native="handleQuery"
|
|
|
|
|
|
maxlength="20"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
2025-09-22 09:59:47 +08:00
|
|
|
|
|
2025-11-12 18:05:13 +08:00
|
|
|
|
<el-col :span="5" style="width: 320px">
|
|
|
|
|
|
<el-form-item prop="orderStatus" label="订单状态">
|
|
|
|
|
|
<el-select v-model="queryParams.orderStatus" placeholder="请选择订单状态" clearable>
|
|
|
|
|
|
<el-option
|
|
|
|
|
|
v-for="item in statusList"
|
|
|
|
|
|
:key="item.id"
|
|
|
|
|
|
:label="item.name"
|
|
|
|
|
|
:value="item.id"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</el-select>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
2025-09-22 09:59:47 +08:00
|
|
|
|
|
2025-11-12 18:05:13 +08:00
|
|
|
|
<el-col :span="5">
|
|
|
|
|
|
<el-form-item prop="dateRange" label="申请时间">
|
|
|
|
|
|
<el-date-picker
|
|
|
|
|
|
v-model="time"
|
|
|
|
|
|
type="daterange"
|
|
|
|
|
|
value-format="yyyy-MM-dd"
|
|
|
|
|
|
range-separator="至"
|
|
|
|
|
|
start-placeholder="开始日期"
|
|
|
|
|
|
end-placeholder="结束日期"
|
|
|
|
|
|
style="width: 240px"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
2025-09-22 09:59:47 +08:00
|
|
|
|
|
2025-11-12 18:05:13 +08:00
|
|
|
|
<el-col :span="5" style="width: 320px">
|
|
|
|
|
|
<el-form-item prop="czcompanyName" label="出租单位">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="queryParams.czcompanyName"
|
|
|
|
|
|
placeholder="请输入出租单位"
|
|
|
|
|
|
clearable
|
|
|
|
|
|
@keyup.enter.native="handleQuery"
|
|
|
|
|
|
maxlength="20"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
2025-09-22 09:59:47 +08:00
|
|
|
|
|
2025-11-12 18:05:13 +08:00
|
|
|
|
<el-col :span="5" style="width: 320px">
|
|
|
|
|
|
<el-form-item prop="companyName" label="承租单位" >
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="queryParams.companyName"
|
|
|
|
|
|
placeholder="请输入承租单位"
|
|
|
|
|
|
clearable
|
|
|
|
|
|
@keyup.enter.native="handleQuery"
|
|
|
|
|
|
maxlength="20"
|
|
|
|
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
</el-row>
|
|
|
|
|
|
|
|
|
|
|
|
<el-row>
|
|
|
|
|
|
<el-col :span="24" style="text-align: right;">
|
|
|
|
|
|
<el-form-item style="margin-top: 10px ; padding-right: 20px" >
|
|
|
|
|
|
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">查询</el-button>
|
|
|
|
|
|
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
2025-10-29 16:30:48 +08:00
|
|
|
|
</el-row>
|
|
|
|
|
|
</el-card>
|
2025-09-22 09:59:47 +08:00
|
|
|
|
</el-form>
|
|
|
|
|
|
|
2025-10-29 16:30:48 +08:00
|
|
|
|
<el-card class="content-box">
|
2025-12-05 15:38:37 +08:00
|
|
|
|
<div >
|
2025-09-22 09:59:47 +08:00
|
|
|
|
<!-- 订单列表 -->
|
|
|
|
|
|
<template v-if="cardList.length > 0">
|
|
|
|
|
|
<div class="cart-tbody" v-for="(item, index) in cardList" :key="index">
|
|
|
|
|
|
<el-row class="order-title-info">
|
|
|
|
|
|
<el-col :span="8">
|
2025-10-30 11:19:08 +08:00
|
|
|
|
<span> <i class="el-icon-document-copy"></i>订单编号： </span>
|
2025-09-22 09:59:47 +08:00
|
|
|
|
<span>{{ item.code }}</span>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="8">
|
|
|
|
|
|
<span> 下单时间： </span>
|
|
|
|
|
|
<span>{{ item.orderTime }}</span>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="8">
|
|
|
|
|
|
<span> 装备所属公司： </span>
|
|
|
|
|
|
<span>{{ item.czcompanyName }}</span>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<div class="order-type-box">
|
|
|
|
|
|
<el-tag :type="orderType(item.orderStatus)" effect="light">
|
|
|
|
|
|
{{ orderText(item.orderStatus) }}
|
|
|
|
|
|
</el-tag>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</el-row>
|
|
|
|
|
|
|
|
|
|
|
|
<el-row class="order-title-info">
|
|
|
|
|
|
<el-col :span="8">
|
|
|
|
|
|
<span> 出租方联系电话： </span>
|
|
|
|
|
|
<span>{{ item.personPhone }}</span>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="8">
|
|
|
|
|
|
<span> 承租方联系电话： </span>
|
|
|
|
|
|
<span>{{ item.phoneNumber }}</span>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="8">
|
|
|
|
|
|
<span> 收货地址： </span>
|
|
|
|
|
|
<span>{{ item.address }}</span>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
</el-row>
|
|
|
|
|
|
|
|
|
|
|
|
<el-row class="order-title-info" style="border-bottom: 1px solid #ccc; margin-bottom: 10px">
|
|
|
|
|
|
<el-col :span="8">
|
|
|
|
|
|
<span> 出租方姓名： </span>
|
|
|
|
|
|
<span>{{ item.sellerName }}</span>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="8">
|
|
|
|
|
|
<span> 承租方姓名： </span>
|
|
|
|
|
|
<span>{{ item.buyerName }}</span>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="8">
|
|
|
|
|
|
<span> 承租方所属单位： </span>
|
|
|
|
|
|
<span>{{ item.companyName }}</span>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
</el-row>
|
|
|
|
|
|
|
|
|
|
|
|
<el-row>
|
|
|
|
|
|
<!-- 装备信息 -->
|
|
|
|
|
|
<el-col :span="12">
|
|
|
|
|
|
<div
|
|
|
|
|
|
v-for="(goods, j) in item.detailsList"
|
|
|
|
|
|
:key="j"
|
|
|
|
|
|
class="order-items order-info"
|
2025-10-13 22:27:41 +08:00
|
|
|
|
:style="j != item.detailsList.length - 1 ? 'border-bottom:1px solid #f0f0f0' : ''"
|
2025-09-22 09:59:47 +08:00
|
|
|
|
style="min-height: 80px"
|
|
|
|
|
|
>
|
2025-12-02 17:03:27 +08:00
|
|
|
|
<img :src="goods.url" style="width: 110px; height: 70px" alt="设备图片"/>
|
2025-09-22 09:59:47 +08:00
|
|
|
|
<div style="min-height: 80px; flex: 1; display: flex; justify-content: space-around; flex-direction: column; padding-left: 12px; font-size: 13px">
|
|
|
|
|
|
<el-row style="color: #169bd5; font-weight: bold">
|
|
|
|
|
|
{{ goods.deviceName }}
|
|
|
|
|
|
</el-row>
|
|
|
|
|
|
<el-row>
|
|
|
|
|
|
<el-col :span="4"> 租期</el-col>
|
|
|
|
|
|
<el-col :span="8">
|
|
|
|
|
|
<span
|
|
|
|
|
|
style="margin-right: 10px"
|
|
|
|
|
|
:style="item.orderStatus == 20 ? 'text-decoration: line-through' : ''"
|
|
|
|
|
|
>
|
|
|
|
|
|
{{ goods.days }} 天
|
|
|
|
|
|
</span>
|
|
|
|
|
|
<span v-if="item.orderStatus == 20">
|
|
|
|
|
|
{{
|
|
|
|
|
|
momentInit(goods.takeOverTime).diff(goods.rentOverTime, 'day') === 0
|
|
|
|
|
|
? 1
|
|
|
|
|
|
: momentInit(goods.takeOverTime).diff(goods.rentOverTime, 'day')
|
|
|
|
|
|
}} 天
|
|
|
|
|
|
</span>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="4"> 编号</el-col>
|
|
|
|
|
|
<el-col :span="8"> {{ goods.code }}</el-col>
|
|
|
|
|
|
</el-row>
|
|
|
|
|
|
<el-row>
|
|
|
|
|
|
<el-col :span="4"> 数量</el-col>
|
|
|
|
|
|
<el-col :span="8"> {{ goods.num }} 台</el-col>
|
|
|
|
|
|
</el-row>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 租期信息 -->
|
|
|
|
|
|
<el-col :span="8" class="order-items-info">
|
|
|
|
|
|
<div
|
|
|
|
|
|
v-for="(goods, j) in item.detailsList"
|
|
|
|
|
|
:key="j"
|
|
|
|
|
|
class="order-info"
|
2025-10-13 22:27:41 +08:00
|
|
|
|
:style="j != item.detailsList.length - 1 ? 'border-bottom:1px solid #f0f0f0' : ''"
|
2025-09-22 09:59:47 +08:00
|
|
|
|
style="min-height: 80px"
|
|
|
|
|
|
>
|
|
|
|
|
|
<div style="display: flex; justify-content: center; align-items: center; flex-direction: column">
|
|
|
|
|
|
<div>租期</div>
|
|
|
|
|
|
<div
|
|
|
|
|
|
style="font-weight: bold; margin-top: 10px"
|
|
|
|
|
|
:style="item.orderStatus == 20 ? 'text-decoration: line-through' : ''"
|
|
|
|
|
|
>
|
2025-10-13 22:27:41 +08:00
|
|
|
|
{{ formatDate(goods.rentBeginTime) }}至{{ formatDate(goods.rentEndTime) }}
|
2025-09-22 09:59:47 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
<div style="font-weight: bold; margin-top: 10px" v-if="item.orderStatus == 20">
|
|
|
|
|
|
{{ goods.takeOverTime ? goods.takeOverTime.slice(0, 10) : '' }}至
|
|
|
|
|
|
{{ goods.rentOverTime ? goods.rentOverTime.slice(0, 10) : '' }}
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
|
|
|
|
|
|
<!--
|
|
|
|
|
|
<!– 状态信息 –>
|
|
|
|
|
|
<el-col :span="3" class="order-items-info">
|
|
|
|
|
|
<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: 80px; width: 95%"
|
|
|
|
|
|
>
|
|
|
|
|
|
<el-tag :type="orderType(goods.orderStatus)" effect="light">
|
|
|
|
|
|
{{ orderText(goods.orderStatus) }}
|
|
|
|
|
|
</el-tag>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
-->
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 操作按钮 -->
|
|
|
|
|
|
<el-col :span="4">
|
|
|
|
|
|
<div>
|
2025-10-14 17:24:46 +08:00
|
|
|
|
<!-- <el-button @click="handleViewOrder(item)" type="primary" size="small">
|
2025-09-22 09:59:47 +08:00
|
|
|
|
订单详情
|
2025-10-14 17:24:46 +08:00
|
|
|
|
</el-button> -->
|
2025-09-22 09:59:47 +08:00
|
|
|
|
<el-button
|
|
|
|
|
|
v-if="item.orderStatus == 20"
|
|
|
|
|
|
@click="handleViewRepair(item)"
|
|
|
|
|
|
type="primary"
|
|
|
|
|
|
size="small"
|
|
|
|
|
|
>
|
|
|
|
|
|
检修详情
|
|
|
|
|
|
</el-button>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
</el-row>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</template>
|
2025-10-29 16:30:48 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
<div class="pagination-wrapper">
|
2025-09-22 09:59:47 +08:00
|
|
|
|
<!-- 分页 -->
|
|
|
|
|
|
<pagination
|
2025-12-04 11:29:53 +08:00
|
|
|
|
|
2025-09-22 09:59:47 +08:00
|
|
|
|
:total="total"
|
|
|
|
|
|
:page.sync="queryParams.pageNum"
|
|
|
|
|
|
:limit.sync="queryParams.pageSize"
|
|
|
|
|
|
@pagination="getList"
|
|
|
|
|
|
/>
|
2025-10-29 16:30:48 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
</el-card>
|
2025-09-22 09:59:47 +08:00
|
|
|
|
<!-- 检修详情弹窗 -->
|
|
|
|
|
|
<el-dialog
|
|
|
|
|
|
:title="dialogTitle"
|
|
|
|
|
|
width="65%"
|
|
|
|
|
|
destroy-on-close
|
|
|
|
|
|
:visible.sync="addOrEditDialogCostVisible"
|
|
|
|
|
|
>
|
|
|
|
|
|
<el-row style="display: flex; letter-spacing: 1px; padding: 0 10px 20px; justify-content: space-between;">
|
|
|
|
|
|
<div style="flex: 1">
|
|
|
|
|
|
<span>订单编号：</span>
|
|
|
|
|
|
<span>{{ overhaulDetails.code }}</span>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div style="flex: 1">
|
|
|
|
|
|
<span>装备套数：</span>
|
|
|
|
|
|
<span>{{ overhaulDetails.maNumber }}</span>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div style="flex: 1">
|
|
|
|
|
|
<span>结算单位：</span>
|
|
|
|
|
|
<span>{{ overhaulDetails.leaseCompany }}</span>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</el-row>
|
|
|
|
|
|
|
2025-10-13 19:30:46 +08:00
|
|
|
|
<!-- 共享费用明细 -->
|
|
|
|
|
|
<TitleTip :titleText="`共享费用明细`"/>
|
2025-09-22 09:59:47 +08:00
|
|
|
|
<el-table
|
|
|
|
|
|
border
|
|
|
|
|
|
:data="orderDetailDtoList"
|
|
|
|
|
|
show-overflow-tooltip
|
|
|
|
|
|
:header-cell-style="{ color: '#fff', background: '#00a288' }"
|
2025-12-04 11:29:53 +08:00
|
|
|
|
height="546"
|
2025-09-22 09:59:47 +08:00
|
|
|
|
>
|
|
|
|
|
|
<el-table-column prop="code" align="center" label="装备编号"/>
|
|
|
|
|
|
<el-table-column prop="deviceName" align="center" label="装备名称"/>
|
|
|
|
|
|
<el-table-column prop="typeName" align="center" label="型号"/>
|
|
|
|
|
|
<el-table-column prop="num" align="center" label="数量"/>
|
2025-10-13 19:30:46 +08:00
|
|
|
|
<el-table-column prop="days" align="center" label="共享天数"/>
|
2025-09-22 09:59:47 +08:00
|
|
|
|
<el-table-column align="center" label="租期">
|
|
|
|
|
|
<template #default="{ row }">
|
2025-10-13 22:27:41 +08:00
|
|
|
|
{{ formatDate(row.preOutboundTime) + '至' + formatDate(row.rentOverTime) }}
|
2025-09-22 09:59:47 +08:00
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
</el-table>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 维修费用明细 -->
|
|
|
|
|
|
<TitleTip :titleText="`维修费用明细`"/>
|
|
|
|
|
|
<el-table
|
|
|
|
|
|
:data="repairRecordList"
|
|
|
|
|
|
border
|
|
|
|
|
|
show-overflow-tooltip
|
|
|
|
|
|
:header-cell-style="{ background: '#00a288', color: '#fff' }"
|
2025-12-04 11:29:53 +08:00
|
|
|
|
height="546"
|
2025-09-22 09:59:47 +08:00
|
|
|
|
>
|
|
|
|
|
|
<el-table-column prop="code" align="center" label="装备编号"/>
|
|
|
|
|
|
<el-table-column prop="deviceName" align="center" label="装备名称"/>
|
|
|
|
|
|
<el-table-column prop="typeName" align="center" label="型号"/>
|
|
|
|
|
|
<el-table-column prop="repairNum" align="center" label="维修数量"/>
|
|
|
|
|
|
<el-table-column align="center" label="维修费用(元)">
|
|
|
|
|
|
<template #default="{ row }">
|
|
|
|
|
|
<template v-if="row.isCheck == 0">
|
|
|
|
|
|
{{ row.repairPrice }}
|
|
|
|
|
|
</template>
|
|
|
|
|
|
<template v-else>
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="row.repairPrice"
|
|
|
|
|
|
style="width: 100%"
|
|
|
|
|
|
placeholder="请输入改价费用"
|
|
|
|
|
|
clearable
|
|
|
|
|
|
/>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column prop="repairChangePrice" align="center" label="改价后费用(元)"/>
|
|
|
|
|
|
<el-table-column align="center" label="附件" width="160">
|
|
|
|
|
|
<template #default="{ row }">
|
|
|
|
|
|
<el-button type="primary" size="small" @click="onViewFileImg(row, 0)">查看</el-button>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column
|
|
|
|
|
|
align="center"
|
|
|
|
|
|
label="操作"
|
|
|
|
|
|
width="160"
|
|
|
|
|
|
v-if="dialogTitle === '费用结算'"
|
|
|
|
|
|
>
|
|
|
|
|
|
<template #default="{ row }">
|
|
|
|
|
|
<el-button
|
|
|
|
|
|
type="primary"
|
|
|
|
|
|
size="small"
|
|
|
|
|
|
@click="row.isCheck = row.isCheck === 0 ? 1 : 0"
|
|
|
|
|
|
>
|
|
|
|
|
|
{{ row.isCheck === 0 ? '改价' : '取消改价' }}
|
|
|
|
|
|
</el-button>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
</el-table>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 报废费用明细 -->
|
|
|
|
|
|
<TitleTip :titleText="`报废费用明细`"/>
|
|
|
|
|
|
<el-table
|
|
|
|
|
|
:data="scrapRecordList"
|
|
|
|
|
|
border
|
|
|
|
|
|
show-overflow-tooltip
|
|
|
|
|
|
:header-cell-style="{ background: '#00a288', color: '#fff' }"
|
2025-12-04 11:29:53 +08:00
|
|
|
|
height="546"
|
2025-09-22 09:59:47 +08:00
|
|
|
|
>
|
|
|
|
|
|
<el-table-column prop="code" align="center" label="装备编号"/>
|
|
|
|
|
|
<el-table-column prop="deviceName" align="center" label="装备名称"/>
|
|
|
|
|
|
<el-table-column prop="typeName" align="center" label="型号"/>
|
|
|
|
|
|
<el-table-column prop="scrapNum" align="center" label="报废数量"/>
|
|
|
|
|
|
<el-table-column prop="scrapReason" align="center" label="报废原因"/>
|
|
|
|
|
|
<el-table-column prop="scrapPrice" align="center" label="报废费用(元)">
|
|
|
|
|
|
<template #default="{ row }">
|
|
|
|
|
|
<template v-if="row.isCheck == 0">
|
|
|
|
|
|
{{ row.scrapPrice }}
|
|
|
|
|
|
</template>
|
|
|
|
|
|
<template v-else>
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="row.scrapPrice"
|
|
|
|
|
|
style="width: 100%"
|
|
|
|
|
|
placeholder="请输入改价费用"
|
|
|
|
|
|
clearable
|
|
|
|
|
|
/>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column prop="scrapChangePrice" align="center" label="改价后费用(元)"/>
|
|
|
|
|
|
<el-table-column align="center" label="附件" width="160">
|
|
|
|
|
|
<template #default="{ row }">
|
|
|
|
|
|
<el-button type="primary" size="small" @click="onViewFileImg(row, 1)">查看</el-button>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column
|
|
|
|
|
|
align="center"
|
|
|
|
|
|
label="操作"
|
|
|
|
|
|
width="160"
|
|
|
|
|
|
v-if="dialogTitle === '费用结算'"
|
|
|
|
|
|
>
|
|
|
|
|
|
<template #default="{ row }">
|
|
|
|
|
|
<el-button
|
|
|
|
|
|
type="primary"
|
|
|
|
|
|
size="small"
|
|
|
|
|
|
@click="row.isCheck = row.isCheck === 0 ? 1 : 0"
|
|
|
|
|
|
>
|
|
|
|
|
|
{{ row.isCheck === 0 ? '改价' : '取消改价' }}
|
|
|
|
|
|
</el-button>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
</el-table>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 丢失费用明细 -->
|
|
|
|
|
|
<TitleTip :titleText="`丢失费用明细`"/>
|
|
|
|
|
|
<el-table
|
|
|
|
|
|
:data="lossRecordList"
|
|
|
|
|
|
border
|
|
|
|
|
|
show-overflow-tooltip
|
|
|
|
|
|
:header-cell-style="{ background: '#00a288', color: '#fff' }"
|
2025-12-04 11:29:53 +08:00
|
|
|
|
height="546"
|
2025-09-22 09:59:47 +08:00
|
|
|
|
>
|
|
|
|
|
|
<el-table-column prop="code" align="center" label="装备编号"/>
|
|
|
|
|
|
<el-table-column prop="deviceName" align="center" label="装备名称"/>
|
|
|
|
|
|
<el-table-column prop="typeName" align="center" label="型号"/>
|
|
|
|
|
|
<el-table-column prop="lossNum" align="center" label="丢失数量"/>
|
|
|
|
|
|
<el-table-column prop="lossPrice" align="center" label="丢失费用(元)">
|
|
|
|
|
|
<template #default="{ row }">
|
|
|
|
|
|
<template v-if="row.isCheck == 0">
|
|
|
|
|
|
{{ row.lossPrice }}
|
|
|
|
|
|
</template>
|
|
|
|
|
|
<template v-else>
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="row.lossPrice"
|
|
|
|
|
|
style="width: 100%"
|
|
|
|
|
|
placeholder="请输入改价费用"
|
|
|
|
|
|
clearable
|
|
|
|
|
|
/>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column align="center" label="附件" width="160">
|
|
|
|
|
|
<template #default="{ row }">
|
|
|
|
|
|
<el-button type="primary" size="small" @click="onViewFileImg(row, 2)">查看</el-button>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
</el-table>
|
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 附件详情弹窗 -->
|
|
|
|
|
|
<el-dialog :visible.sync="innerVisible" width="500" title="附件详情" append-to-body>
|
|
|
|
|
|
<el-table
|
|
|
|
|
|
:data="viewFileInfoList"
|
|
|
|
|
|
border
|
|
|
|
|
|
show-overflow-tooltip
|
|
|
|
|
|
:header-cell-style="{ background: '#00a288', color: '#fff' }"
|
2025-12-04 11:29:53 +08:00
|
|
|
|
height="546"
|
2025-09-22 09:59:47 +08:00
|
|
|
|
>
|
|
|
|
|
|
<el-table-column prop="fileName" align="center" label="文件名称"/>
|
|
|
|
|
|
<el-table-column align="center" label="操作" width="120">
|
|
|
|
|
|
<template #default="{ row }">
|
|
|
|
|
|
<el-image
|
|
|
|
|
|
style="width: 60px; height: 60px"
|
|
|
|
|
|
:src="row.fileUrl"
|
|
|
|
|
|
:zoom-rate="1.2"
|
|
|
|
|
|
:max-scale="7"
|
|
|
|
|
|
:min-scale="0.2"
|
|
|
|
|
|
:preview-src-list="[row.fileUrl]"
|
|
|
|
|
|
:initial-index="0"
|
|
|
|
|
|
fit="cover"
|
|
|
|
|
|
:z-index="9999999999"
|
|
|
|
|
|
:preview-teleported="true"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
</el-table>
|
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 订单详情弹窗 -->
|
|
|
|
|
|
<OrderDetailDialog
|
|
|
|
|
|
:visible.sync="showOrderDetail"
|
|
|
|
|
|
:orderId="orderId"
|
|
|
|
|
|
:orderStatus="orderStatus"
|
|
|
|
|
|
title="订单详情"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
|
import TitleTip from '@/components/TitleTip'
|
|
|
|
|
|
import { getOrderListApi, getOrderListInfoApi, getOverhaulApi } from '@/api/search/order'
|
|
|
|
|
|
import moment from 'moment'
|
|
|
|
|
|
import OrderDetailDialog from '@/views/EquipmentSharedOrder/order/detail.vue'
|
|
|
|
|
|
|
|
|
|
|
|
export default {
|
|
|
|
|
|
components: { OrderDetailDialog, TitleTip },
|
|
|
|
|
|
name: 'order',
|
|
|
|
|
|
data() {
|
|
|
|
|
|
return {
|
|
|
|
|
|
// 基础状态
|
|
|
|
|
|
loading: false,
|
|
|
|
|
|
showSearch: true,
|
|
|
|
|
|
showOrderDetail: false,
|
|
|
|
|
|
|
|
|
|
|
|
// 订单相关
|
|
|
|
|
|
orderStatus: '',
|
|
|
|
|
|
orderId: '',
|
|
|
|
|
|
statusList: [
|
2025-10-13 22:27:41 +08:00
|
|
|
|
{ id: '1', name: '待确认' },
|
2025-10-14 17:24:46 +08:00
|
|
|
|
{ id: '2', name: '已确认' },
|
|
|
|
|
|
{ id: '3', name: '已驳回' },
|
2025-09-22 09:59:47 +08:00
|
|
|
|
],
|
|
|
|
|
|
|
|
|
|
|
|
// 分页和查询
|
|
|
|
|
|
total: 0,
|
|
|
|
|
|
time: [],
|
|
|
|
|
|
queryParams: {
|
|
|
|
|
|
pageNum: 1,
|
|
|
|
|
|
pageSize: 10,
|
|
|
|
|
|
keyWord: undefined,
|
|
|
|
|
|
status: undefined,
|
|
|
|
|
|
startTime: undefined,
|
|
|
|
|
|
endTime: undefined
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
// 数据列表
|
|
|
|
|
|
cardList: [],
|
|
|
|
|
|
|
|
|
|
|
|
// 弹窗相关
|
|
|
|
|
|
dialogTitle: '',
|
|
|
|
|
|
addOrEditDialogCostVisible: false,
|
|
|
|
|
|
viewOrderDetailsOrderId: '',
|
|
|
|
|
|
orderDetailDtoList: [],
|
|
|
|
|
|
repairRecordList: [],
|
|
|
|
|
|
scrapRecordList: [],
|
|
|
|
|
|
lossRecordList: [],
|
|
|
|
|
|
overhaulDetails: {},
|
|
|
|
|
|
fileListAll: [],
|
|
|
|
|
|
innerVisible: false,
|
|
|
|
|
|
viewFileInfoList: [],
|
|
|
|
|
|
|
|
|
|
|
|
// 工具
|
|
|
|
|
|
momentInit: moment
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
created() {
|
|
|
|
|
|
this.getList()
|
|
|
|
|
|
},
|
|
|
|
|
|
methods: {
|
2025-10-13 22:27:41 +08:00
|
|
|
|
// 仅保留日期（YYYY-MM-DD）
|
|
|
|
|
|
formatDate(dateStr) {
|
|
|
|
|
|
if (!dateStr) return ''
|
|
|
|
|
|
// 兼容 'YYYY-MM-DD HH:mm:ss' 或 ISO 字符串
|
|
|
|
|
|
const s = String(dateStr)
|
|
|
|
|
|
return s.length >= 10 ? s.slice(0, 10) : s
|
|
|
|
|
|
},
|
2025-09-22 09:59:47 +08:00
|
|
|
|
// 获取订单状态文本
|
|
|
|
|
|
orderText(status) {
|
|
|
|
|
|
const foundStatus = this.statusList.find(e => e.id === status)
|
|
|
|
|
|
return foundStatus ? foundStatus.name : '未知状态'
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
// 获取订单状态样式
|
|
|
|
|
|
orderType(status) {
|
|
|
|
|
|
if ([1, 2, 3, 5].includes(Number(status))) return 'primary'
|
|
|
|
|
|
if ([4, 7].includes(Number(status))) return 'success'
|
|
|
|
|
|
if ([6].includes(Number(status))) return 'warning'
|
|
|
|
|
|
if ([8].includes(Number(status))) return 'danger'
|
|
|
|
|
|
return ''
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
/** 查询订单列表 */
|
|
|
|
|
|
getList() {
|
|
|
|
|
|
this.loading = true
|
|
|
|
|
|
|
|
|
|
|
|
// 处理日期范围
|
|
|
|
|
|
if (this.time.length > 0) {
|
|
|
|
|
|
this.queryParams.startTime = this.time[0]
|
|
|
|
|
|
this.queryParams.endTime = this.time[1]
|
|
|
|
|
|
} else {
|
|
|
|
|
|
this.queryParams.startTime = undefined
|
|
|
|
|
|
this.queryParams.endTime = undefined
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
getOrderListApi(this.queryParams).then((res) => {
|
|
|
|
|
|
this.cardList = res.data.rows
|
|
|
|
|
|
this.total = res.data.total
|
|
|
|
|
|
this.loading = false
|
|
|
|
|
|
}).catch(() => {
|
|
|
|
|
|
this.loading = false
|
|
|
|
|
|
})
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
// 查看订单详情
|
|
|
|
|
|
handleViewOrder(row) {
|
|
|
|
|
|
this.showOrderDetail = true
|
|
|
|
|
|
this.orderStatus = row.orderStatus
|
|
|
|
|
|
this.orderId = row.orderId
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
// 查看检修详情
|
|
|
|
|
|
handleViewRepair(item) {
|
|
|
|
|
|
this.viewOrderDetailsOrderId = item.orderId
|
|
|
|
|
|
this.dialogTitle = '检修详情'
|
|
|
|
|
|
|
|
|
|
|
|
getOrderListInfoApi({ orderId: this.viewOrderDetailsOrderId }).then(async(res) => {
|
|
|
|
|
|
if (item.orderStatus === 20) {
|
|
|
|
|
|
await getOverhaulApi(this.viewOrderDetailsOrderId).then((resTwo) => {
|
|
|
|
|
|
this.orderDetailDtoList = resTwo.data.orderDetailDtoList || []
|
|
|
|
|
|
this.repairRecordList = resTwo.data.repairRecordList || []
|
|
|
|
|
|
this.scrapRecordList = resTwo.data.scrapRecordList || []
|
|
|
|
|
|
this.lossRecordList = resTwo.data.lossRecordList || []
|
|
|
|
|
|
this.fileListAll = resTwo.data.fileInfoList || []
|
|
|
|
|
|
this.overhaulDetails = resTwo.data || {}
|
|
|
|
|
|
})
|
|
|
|
|
|
}
|
|
|
|
|
|
this.addOrEditDialogCostVisible = true
|
|
|
|
|
|
})
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
// 查看附件图片
|
|
|
|
|
|
onViewFileImg(row, index) {
|
|
|
|
|
|
this.viewFileInfoList = this.fileListAll
|
|
|
|
|
|
? this.fileListAll.filter(e => e.fileType === index)
|
|
|
|
|
|
: []
|
|
|
|
|
|
this.innerVisible = true
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
/** 重置查询条件 */
|
|
|
|
|
|
async resetQuery() {
|
|
|
|
|
|
await this.resetForm('queryForm')
|
|
|
|
|
|
this.time = []
|
|
|
|
|
|
this.queryParams.keyWord = null
|
|
|
|
|
|
this.handleQuery()
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
/** 执行查询 */
|
|
|
|
|
|
handleQuery() {
|
|
|
|
|
|
this.queryParams.pageNum = 1
|
|
|
|
|
|
this.getList()
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
|
|
.cart-tbody {
|
|
|
|
|
|
background: #fff;
|
2025-10-13 22:27:41 +08:00
|
|
|
|
padding: 16px;
|
|
|
|
|
|
margin-bottom: 14px;
|
|
|
|
|
|
border-radius: 10px;
|
2025-10-30 11:19:08 +08:00
|
|
|
|
border: 1px solid #169bd5;
|
|
|
|
|
|
box-shadow:
|
|
|
|
|
|
0 0 0 1px rgba(22, 155, 213, 0.2),
|
|
|
|
|
|
0 0 8px rgba(22, 155, 213, 0.3);
|
|
|
|
|
|
// 0 4px 12px rgba(0, 0, 0, 0.1);
|
|
|
|
|
|
transition: all 0.3s ease;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.cart-tbody:hover {
|
|
|
|
|
|
border-color: #0d7aa8;
|
|
|
|
|
|
box-shadow:
|
|
|
|
|
|
0 0 0 2px rgba(22, 155, 213, 0.3),
|
|
|
|
|
|
0 0 12px rgba(22, 155, 213, 0.4),
|
|
|
|
|
|
0 6px 16px rgba(0, 0, 0, 0.12);
|
2025-09-22 09:59:47 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
:deep .el-form--inline .el-form-item {
|
|
|
|
|
|
margin-right: 6px;
|
|
|
|
|
|
width: 95%;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.order-title-info {
|
|
|
|
|
|
position: relative;
|
2025-10-13 22:27:41 +08:00
|
|
|
|
padding: 8px 0;
|
2025-09-22 09:59:47 +08:00
|
|
|
|
font-size: 14px;
|
2025-10-13 22:27:41 +08:00
|
|
|
|
color: #666;
|
|
|
|
|
|
|
|
|
|
|
|
// 标签与内容的层级：标签次要、内容主要
|
|
|
|
|
|
span:first-child {
|
|
|
|
|
|
color: #666;
|
|
|
|
|
|
}
|
|
|
|
|
|
span + span {
|
|
|
|
|
|
color: #333;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
&:not(:last-child) {
|
|
|
|
|
|
margin-bottom: 6px;
|
|
|
|
|
|
}
|
2025-09-22 09:59:47 +08:00
|
|
|
|
|
|
|
|
|
|
.order-type-box {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 0;
|
|
|
|
|
|
right: 0;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.order-items {
|
2025-10-13 22:27:41 +08:00
|
|
|
|
border-right: 1px solid #f0f0f0;
|
2025-09-22 09:59:47 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.order-info {
|
|
|
|
|
|
display: flex;
|
2025-10-13 22:27:41 +08:00
|
|
|
|
padding: 8px 0;
|
2025-09-22 09:59:47 +08:00
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.order-items-info {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: center;
|
2025-10-13 22:27:41 +08:00
|
|
|
|
border-right: 1px solid #f0f0f0;
|
2025-09-22 09:59:47 +08:00
|
|
|
|
font-size: 13px;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.red-font {
|
|
|
|
|
|
color: #ff4800;
|
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
|
margin-top: 10px;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.handle-btn {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
|
|
|
|
|
|
.el-button {
|
|
|
|
|
|
width: calc((100% - 50px) / 4);
|
|
|
|
|
|
margin-bottom: 10px;
|
|
|
|
|
|
margin-left: 10px !important;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.app-container-content {
|
2025-10-30 11:19:08 +08:00
|
|
|
|
// background-color: #f5f5f5;
|
|
|
|
|
|
|
2025-09-22 09:59:47 +08:00
|
|
|
|
:deep(.el-dialog) {
|
|
|
|
|
|
display: flex !important;
|
|
|
|
|
|
flex-direction: column !important;
|
|
|
|
|
|
margin: 0 !important;
|
|
|
|
|
|
position: absolute !important;
|
|
|
|
|
|
top: 50% !important;
|
|
|
|
|
|
left: 50% !important;
|
|
|
|
|
|
transform: translate(-50%, -50%) !important;
|
|
|
|
|
|
max-height: 100vh !important;
|
|
|
|
|
|
|
|
|
|
|
|
.el-dialog__body {
|
|
|
|
|
|
flex: 1;
|
|
|
|
|
|
overflow-y: scroll !important;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.dialog-content {
|
|
|
|
|
|
padding: 20px;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-10-29 16:30:48 +08:00
|
|
|
|
|
|
|
|
|
|
.search-box {
|
|
|
|
|
|
margin-bottom: 20px;
|
|
|
|
|
|
border-radius: 8px;
|
|
|
|
|
|
padding: 0;
|
2025-10-29 18:26:13 +08:00
|
|
|
|
::v-deep .el-card__body {
|
|
|
|
|
|
padding: 20px !important;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.el-form-item--small.el-form-item {
|
|
|
|
|
|
margin-bottom: 0px;
|
2025-10-29 16:30:48 +08:00
|
|
|
|
}
|
|
|
|
|
|
.content-box {
|
|
|
|
|
|
border-radius: 8px;
|
2025-10-29 18:26:13 +08:00
|
|
|
|
height: calc(100vh - 210px);
|
2025-10-29 16:30:48 +08:00
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
|
|
|
|
|
|
::v-deep .el-card__body {
|
|
|
|
|
|
display: flex !important;
|
|
|
|
|
|
flex-direction: column !important;
|
|
|
|
|
|
height: 100% !important;
|
|
|
|
|
|
padding: 20px;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.el-row:first-child {
|
|
|
|
|
|
margin-bottom: 16px;
|
|
|
|
|
|
flex-shrink: 0;
|
|
|
|
|
|
|
|
|
|
|
|
.el-col {
|
|
|
|
|
|
display: flex;
|
2025-10-29 19:34:55 +08:00
|
|
|
|
/* justify-content: flex-end; */
|
2025-10-29 16:30:48 +08:00
|
|
|
|
align-items: center;
|
|
|
|
|
|
gap: 12px;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.table-container {
|
|
|
|
|
|
flex: 1;
|
|
|
|
|
|
overflow-y: auto;
|
|
|
|
|
|
margin-bottom: 0;
|
|
|
|
|
|
min-height: 0;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.pagination-wrapper {
|
|
|
|
|
|
flex-shrink: 0;
|
|
|
|
|
|
padding-top: 6px;
|
|
|
|
|
|
margin-top: auto;
|
|
|
|
|
|
|
|
|
|
|
|
::v-deep .pagination-container {
|
|
|
|
|
|
padding: 0px 20px !important;
|
2025-12-05 14:34:32 +08:00
|
|
|
|
/* margin-bottom: 30px; */
|
2025-10-29 16:30:48 +08:00
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-09-22 09:59:47 +08:00
|
|
|
|
</style>
|
