1016 lines
34 KiB
Vue
1016 lines
34 KiB
Vue
<template>
|
||
<div class="app-container">
|
||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||
<el-form-item label="运营区" prop="areaId" v-if="userName == 'admin'">
|
||
<el-select v-model="queryParams.areaId" filterable placeholder="请选择运营区" clearable>
|
||
<el-option
|
||
v-for="item in areaOptions"
|
||
:key="item.areaId"
|
||
:label="item.areaName"
|
||
:value="item.areaId"
|
||
></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item label="订单号" prop="orderNo">
|
||
<el-input
|
||
v-model="queryParams.orderNo"
|
||
placeholder="请输入订单号"
|
||
clearable
|
||
@keyup.enter.native="handleQuery"
|
||
/>
|
||
</el-form-item>
|
||
<el-form-item label="用户" prop="userName">
|
||
<el-input
|
||
v-model="queryParams.userName"
|
||
placeholder="请输入用户"
|
||
clearable
|
||
@keyup.enter.native="handleQuery"
|
||
/>
|
||
</el-form-item>
|
||
<el-form-item label="设备SN" prop="sn">
|
||
<el-input
|
||
v-model="queryParams.sn"
|
||
placeholder="请输入设备SN"
|
||
clearable
|
||
@keyup.enter.native="handleQuery"
|
||
/>
|
||
</el-form-item>
|
||
<el-form-item label="车牌号" prop="vehicleNum">
|
||
<el-input
|
||
v-model="queryParams.vehicleNum"
|
||
placeholder="请输入车牌号"
|
||
clearable
|
||
@keyup.enter.native="handleQuery"
|
||
/>
|
||
</el-form-item>
|
||
<el-form-item label="状态" prop="status">
|
||
<el-select v-model="queryParams.status" placeholder="请选择状态" clearable>
|
||
<el-option
|
||
v-for="dict in dict.type.et_order_status"
|
||
:key="dict.value"
|
||
:label="dict.label"
|
||
:value="dict.value"
|
||
/>
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item label="支付方式" prop="payType">
|
||
<el-select v-model="queryParams.payType" placeholder="请选择状态" clearable>
|
||
<el-option
|
||
v-for="dict in dict.type.et_pay_type"
|
||
:key="dict.value"
|
||
:label="dict.label"
|
||
:value="dict.value"
|
||
/>
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item>
|
||
<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-form>
|
||
|
||
<el-row :gutter="10" class="mb8">
|
||
<el-col :span="1.5">
|
||
<el-button
|
||
type="warning"
|
||
plain
|
||
icon="el-icon-download"
|
||
size="mini"
|
||
@click="handleExport"
|
||
v-hasPermi="['system:order:export']"
|
||
>导出</el-button>
|
||
</el-col>
|
||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||
</el-row>
|
||
|
||
<el-table v-loading="loading" :data="orderList" @selection-change="handleSelectionChange">
|
||
<el-table-column type="selection" width="55" align="center" />
|
||
<!-- <el-table-column label="订单id" align="center" prop="orderId" />-->
|
||
<el-table-column label="区域" align="center" prop="area" />
|
||
<el-table-column label="订单号" align="center" prop="orderNo" width="200"/>
|
||
<el-table-column label="用户" align="center" prop="userName" width="100"/>
|
||
<el-table-column label="设备SN" align="center" prop="sn" >
|
||
<template slot-scope="scope">
|
||
<router-link :to="'/system/device/sn/index/' + scope.row.sn" class="link-type">
|
||
<span>{{ scope.row.sn }}</span>
|
||
</router-link>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="车牌号" align="center" prop="vehicleNum" >
|
||
<template slot-scope="scope">
|
||
<router-link :to="'/system/device/vehicleNum/index/' + scope.row.vehicleNum" class="link-type">
|
||
<span>{{ scope.row.vehicleNum }}</span>
|
||
</router-link>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="状态" align="center" prop="status">
|
||
<template slot-scope="scope">
|
||
<dict-tag :options="dict.type.et_order_status" :value="scope.row.status"/>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="创建时间" align="center" prop="createTime" width="90">
|
||
<template slot-scope="scope">
|
||
<span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="开始骑行" align="center" prop="unlockTime" width="90">
|
||
<template slot-scope="scope">
|
||
<span>{{ parseTime(scope.row.unlockTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="结束骑行" align="center" prop="returnTime" width="90">
|
||
<template slot-scope="scope">
|
||
<span>{{ parseTime(scope.row.returnTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="支付时间" align="center" prop="payTime" width="90">
|
||
<template slot-scope="scope">
|
||
<span>{{ parseTime(scope.row.payTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="支付方式" align="center" prop="payType" width="80">
|
||
<template slot-scope="scope">
|
||
<dict-tag :options="dict.type.et_pay_type" :value="scope.row.payType"/>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="金额(元)" align="center" prop="totalFee" width="70"/>
|
||
<el-table-column label="备注" align="center" prop="mark" />
|
||
<el-table-column label="订单时长" align="center" prop="duration" :formatter="formatDuration"/>
|
||
<el-table-column label="距离" align="center" prop="distance" :formatter="formatDistance"/>
|
||
<el-table-column label="操作" align="center" width="150" class-name="small-padding fixed-width">
|
||
<template slot-scope="scope">
|
||
<el-button
|
||
size="mini"
|
||
type="text"
|
||
icon="el-icon-view"
|
||
@click="handleUpdate(scope.row)"
|
||
v-hasPermi="['system:order:edit']"
|
||
>详情</el-button>
|
||
<el-button
|
||
size="mini"
|
||
type="text"
|
||
v-if="scope.row.status == 1 || scope.row.status == 3"
|
||
icon="el-icon-edit"
|
||
@click="changePrice(scope.row)"
|
||
v-hasPermi="['system:order:edit']"
|
||
>改价</el-button>
|
||
<el-button
|
||
size="mini"
|
||
type="text"
|
||
icon="el-icon-check"
|
||
v-if="scope.row.status == '5'"
|
||
@click="handleAudit(scope.row)"
|
||
v-hasPermi="['system:order:edit']"
|
||
>审核</el-button>
|
||
<el-button
|
||
size="mini"
|
||
type="text"
|
||
v-if="scope.row.status == '6'"
|
||
icon="el-icon-money"
|
||
@click="toCommunicate(scope.row)"
|
||
v-hasPermi="['system:order:edit']"
|
||
>去沟通</el-button>
|
||
<el-button
|
||
size="mini"
|
||
type="text"
|
||
v-if="scope.row.status == 1 || scope.row.status == 3"
|
||
icon="el-icon-wallet"
|
||
@click="deduction(scope.row)"
|
||
v-hasPermi="['system:order:edit']"
|
||
>押金抵扣</el-button>
|
||
<el-button
|
||
size="mini"
|
||
type="text"
|
||
v-if="scope.row.status == 4"
|
||
icon="el-icon-money"
|
||
@click="refund(scope.row)"
|
||
v-hasPermi="['system:order:edit']"
|
||
>退款</el-button>
|
||
<el-button
|
||
size="mini"
|
||
type="text"
|
||
v-if="scope.row.status == 2"
|
||
icon="el-icon-refresh-left"
|
||
@click="returnVehicle(scope.row)"
|
||
v-hasPermi="['system:order:edit']"
|
||
>辅助还车</el-button>
|
||
<el-button
|
||
size="mini"
|
||
type="text"
|
||
icon="el-icon-document"
|
||
@click="toLog(scope.row)"
|
||
v-hasPermi="['system:order:log']"
|
||
>日志</el-button>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
|
||
<pagination
|
||
v-show="total>0"
|
||
:total="total"
|
||
:page.sync="queryParams.pageNum"
|
||
:limit.sync="queryParams.pageSize"
|
||
@pagination="getList"
|
||
/>
|
||
|
||
<!-- 添加或修改订单对话框 -->
|
||
<el-dialog :title="title" :close-on-click-modal="true" :visible.sync="open" width="1200px" append-to-body>
|
||
<el-form ref="form" :model="form" label-width="140px">
|
||
<el-row>
|
||
<el-col :span="12">
|
||
<el-form-item label="支付订单编号：">{{ form.orderNo }}</el-form-item>
|
||
<el-form-item label="租赁时长：">{{ formatDuration(form) }}</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="租赁用户：" >{{ form.phonenumber }}</el-form-item>
|
||
<el-form-item label="行驶距离：" >{{ formatDistance(form) }}</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row>
|
||
<el-col :span="12">
|
||
<el-form-item label="订单状态：">{{ formatStatus(form.status) }}</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<h2 style="font-weight: bold;font-size: 18px">设备信息</h2>
|
||
<el-row>
|
||
<el-col :span="12">
|
||
<el-form-item label="车牌号：">{{ form.device.vehicleNum }}</el-form-item>
|
||
<el-form-item label="SN：">{{ form.sn }}</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="MAC：">{{ form.device.mac }}</el-form-item>
|
||
<el-form-item label="运营区域：" >{{ form.area }}</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<h2 style="font-weight: bold;font-size: 18px">行程记录</h2>
|
||
<el-row v-if="form.tripLogs">
|
||
<template v-for="(log, index) in form.tripLogs" >
|
||
<el-row :key="index">
|
||
<el-col :span="12">
|
||
<el-form-item :label="getTypeText(log.type)+'时间：'">
|
||
{{ log.createTime }}
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item :label="getTypeText(log.type)+'地点：'">
|
||
{{ log.longitude }}, {{ log.latitude }}
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
</template>
|
||
</el-row>
|
||
<!-- 显示路径 -->
|
||
<el-row>
|
||
<el-col :span="24">
|
||
<trajectory-map
|
||
v-if="showPlaceSearchMap"
|
||
ref="map"
|
||
:key="key"
|
||
:areaId="form.areaId"
|
||
height="400px"
|
||
:trip-route-str="form.tripRouteStr"
|
||
/>
|
||
</el-col>
|
||
</el-row>
|
||
<h2 style="font-weight: bold;font-size: 18px;padding-top: 10px">费用明细</h2>
|
||
<el-row>
|
||
<el-col :span="12">
|
||
<el-form-item label="预约费用：">{{ formatFee(form.appointmentFee) }}</el-form-item>
|
||
<el-form-item label="运营区外调度费：">{{ formatFee(form.dispatchFee) }}</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="骑行费用：" >{{ formatFee(form.ridingFee) }}</el-form-item>
|
||
<el-form-item label="停车点外调度费：" >{{ formatFee(form.manageFee) }}</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row>
|
||
<el-col :span="12">
|
||
<el-form-item label="实收：">{{ formatFee(form.payFee) }}</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row>
|
||
<el-col :span="12">
|
||
<el-form-item label="支付方式：">{{ formatType(form.payType) }}</el-form-item>
|
||
<el-form-item label="支付时间：">{{ form.payTime }}</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="计费模板：" >{{ form.rule.name }}</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row v-if="form.etRefunds && form.etRefunds.length > 0">
|
||
<el-col :span="24">
|
||
<el-card v-for="(refund, index) in form.etRefunds" :key="index" class="refund-card">
|
||
<span style="font-weight: 700">退款{{index+1}}</span>
|
||
<div class="refund-content">
|
||
<el-row>
|
||
<el-col :span="12">
|
||
<el-form-item label="预约费退款：">{{ formatFee(refund.appointmentFee) }}</el-form-item>
|
||
<el-form-item label="运营区外调度费退款：" label-width="100">{{ formatFee(refund.dispatchFee) }}</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="骑行费用退款：">{{ formatFee(refund.ridingFee) }}</el-form-item>
|
||
<el-form-item label="停车点外调度费退款：" label-width="100">{{ formatFee(refund.manageFee) }}</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row>
|
||
<el-col :span="12">
|
||
<el-form-item label="退款原因：">{{ refund.reason }}</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="退款时间：">{{ refund.createTime }}</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
</div>
|
||
</el-card>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row v-if="form.etRefunds && form.etRefunds.length > 0">
|
||
<el-col :span="12">
|
||
<el-form-item label="结算总费用：">
|
||
{{ formatFee(calculateNetFee()) }}
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
</el-form>
|
||
<div slot="footer" class="dialog-footer">
|
||
<el-button @click="cancel">取 消</el-button>
|
||
</div>
|
||
</el-dialog>
|
||
|
||
<!-- 改价、退款 -->
|
||
<el-dialog :title="title2" :visible.sync="open2" width="600px" append-to-body>
|
||
<el-form ref="form2" :model="form2" label-width="110px">
|
||
<el-col>
|
||
<el-col :span="24">
|
||
<el-form-item label="预约费(元)" prop="appointmentFee">
|
||
<el-input v-model="form2.appointmentFee" placeholder="请输入预约费"/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="24">
|
||
<el-form-item label="骑行费(元)" prop="ridingFee">
|
||
<el-input v-model="form2.ridingFee" placeholder="请输入骑行费"/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="24">
|
||
<el-form-item label="调度费(元)" prop="dispatchFee">
|
||
<el-input v-model="form2.dispatchFee" placeholder="请输入调度费"/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="24">
|
||
<el-form-item label="停车点外调度费(元)" prop="manageFee">
|
||
<el-input v-model="form2.manageFee" placeholder="请输入停车点外调度费"/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="24" v-if="title2 === '退款'">
|
||
<el-form-item label="原因" prop="reason">
|
||
<el-input v-model="form2.reason" placeholder="请输入停车点外调度费"/>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-col>
|
||
</el-form>
|
||
<div slot="footer" class="dialog-footer">
|
||
<el-button v-if="title2 === '改价'" type="success" @click="submitChangePrice">确 定</el-button>
|
||
<el-button v-if="title2 === '退款'" type="success" @click="submitRefund">确 定</el-button>
|
||
<el-button @click="cancel2">取 消</el-button>
|
||
</div>
|
||
</el-dialog>
|
||
|
||
<!-- 审核对话框 -->
|
||
<el-dialog title="审核" :visible.sync="open3" width="700px" append-to-body>
|
||
<el-form :model="form3" ref="form3" label-width="100px" size="mini">
|
||
<video v-if="form3.videoUrl" :src="form3.videoUrl" controls width="70%" height="auto"></video>
|
||
<p v-else>暂无视频</p>
|
||
</el-form>
|
||
<div slot="footer" class="dialog-footer">
|
||
<el-button v-show="view == true" @click="open3 = false">关 闭</el-button>
|
||
<el-button v-show="view == false" type="success" @click="pass">通 过</el-button>
|
||
<el-button v-show="view == false" type="danger" @click="reject">车辆有损坏</el-button>
|
||
</div>
|
||
</el-dialog>
|
||
|
||
<!-- 沟通录音弹窗 -->
|
||
<el-dialog style="margin-top: 10vh !important;" title="沟通" :visible.sync="open4" width="700px" append-to-body>
|
||
<el-form :model="form4" :rules="rules" ref="form4" label-width="100px" size="mini">
|
||
<!-- 录音文件 soundRecording -->
|
||
<el-col :span="24">
|
||
<el-form-item label="上传录音" prop="soundRecording" >
|
||
<audio-upload v-model="form4.audioFiles" :limit="5" :file-size="10" :file-type="['mp3', 'wav', 'ogg', 'aac','m4a']" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<!-- 扣款金额 确定扣款 deduction -->
|
||
<el-col :span="24">
|
||
<el-form-item label="扣款金额" prop="deductionAmount">
|
||
<el-input v-model="form4.deductionAmount" placeholder="请输入扣款金额" />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-form>
|
||
<div slot="footer" class="dialog-footer">
|
||
<el-button @click="open4 = false">关 闭</el-button>
|
||
<el-button type="success" @click="confirmDeduction">确 定</el-button>
|
||
</div>
|
||
</el-dialog>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
listOrder,
|
||
getOrder,
|
||
delOrder,
|
||
addOrder,
|
||
updateOrder,
|
||
changePrice,
|
||
refund,
|
||
returnVehicle,
|
||
deduction, passAudit
|
||
} from '@/api/system/order'
|
||
import TrajectoryMap from '@/components/Map/TrajectoryMap'
|
||
import { getArea, optionselect as getAreaOptionselect } from '@/api/system/area'
|
||
|
||
export default {
|
||
name: "Order",
|
||
dicts: ['et_order_type', 'et_pay_type', 'et_order_status'],
|
||
components: {TrajectoryMap },
|
||
data() {
|
||
return {
|
||
// 遮罩层
|
||
loading: true,
|
||
// 选中数组
|
||
userName: undefined,
|
||
ids: [],
|
||
// 非单个禁用
|
||
single: true,
|
||
// 非多个禁用
|
||
multiple: true,
|
||
// 显示搜索条件
|
||
showSearch: true,
|
||
// 通过key重新渲染area-map组件
|
||
key: 0,
|
||
areaOptions: [],
|
||
// 总条数
|
||
total: 0,
|
||
view: false,
|
||
// 订单表格数据
|
||
orderList: [],
|
||
area: null,
|
||
// 弹出层标题
|
||
title: "",
|
||
title2: "",
|
||
showPlaceSearchMap: false,
|
||
// 是否显示弹出层
|
||
open: false,
|
||
open2: false,
|
||
open3: false,
|
||
open4: false,
|
||
vehicleNum: null,
|
||
// 查询参数
|
||
queryParams: {
|
||
pageNum: 1,
|
||
pageSize: 20,
|
||
areaId: null,
|
||
area: null,
|
||
orderNo: null,
|
||
type: "1",
|
||
userId: null,
|
||
userName: null,
|
||
deviceMac: null,
|
||
},
|
||
// 表单参数
|
||
form: {
|
||
device: {
|
||
vehicleNum: null,
|
||
mac: null
|
||
},
|
||
etRefund: {
|
||
appointmentFee: null,
|
||
ridingFee: null,
|
||
dispatchFee: null,
|
||
manageFee: null,
|
||
reason: null,
|
||
createTime: null
|
||
},
|
||
rule: {
|
||
name: null
|
||
},
|
||
status: null,
|
||
payType: null,
|
||
payFee: null,
|
||
appointmentFee: null,
|
||
tripRouteStr: null,
|
||
vehicleNum: null,
|
||
},
|
||
form2: {
|
||
orderNo: null,
|
||
appointmentFee: null,
|
||
ridingFee: null,
|
||
dispatchFee: null,
|
||
manageFee: null,
|
||
reason: null,
|
||
createTime: null
|
||
},
|
||
form3: {
|
||
orderNo: null,
|
||
appointmentFee: null,
|
||
ridingFee: null,
|
||
dispatchFee: null,
|
||
manageFee: null,
|
||
reason: null,
|
||
createTime: null
|
||
},
|
||
form4: {
|
||
orderNo: null,
|
||
deductionAmount: null,
|
||
audioFiles: []
|
||
},
|
||
// 表单校验
|
||
rules: {
|
||
orderNo: [
|
||
{ required: true, message: "订单号不能为空", trigger: "blur" }
|
||
],
|
||
userId: [
|
||
{ required: true, message: "用户不能为空", trigger: "blur" }
|
||
],
|
||
payType: [
|
||
{ required: true, message: "支付方式不能为空", trigger: "change" }
|
||
],
|
||
}
|
||
};
|
||
},
|
||
created() {
|
||
console.log("当前用户信息：",this.$store.state.user.name)
|
||
this.userName = this.$store.state.user.name;
|
||
const orderNo = this.$route.params && this.$route.params.orderNo;
|
||
if (orderNo != null) {
|
||
this.queryParams.orderNo = orderNo;
|
||
}
|
||
this.reset();
|
||
this.reset2();
|
||
this.getList();
|
||
this.getAreaList();
|
||
},
|
||
watch: {
|
||
open(val) {
|
||
if (!val) {
|
||
console.log("========关闭轨迹地图=============")
|
||
this.showPlaceSearchMap = false; // 关闭地图
|
||
} else {
|
||
console.log("========打开轨迹地图=============")
|
||
this.showPlaceSearchMap = true; // 打开地图
|
||
}
|
||
}
|
||
},
|
||
methods: {
|
||
confirmDeduction(){
|
||
// 扣款金额 1. 退剩余押金
|
||
this.$refs["form4"].validate(valid => {
|
||
if (valid) {
|
||
console.log("------44444---")
|
||
if (this.form4.orderId != null) {
|
||
this.form4.status = "7";
|
||
updateOrder({
|
||
orderId:this.form4.orderId,
|
||
status:this.form4.status,
|
||
deductionAmount:this.form4.deductionAmount,
|
||
audioFiles: this.form4.audioFiles
|
||
}).then(response => {
|
||
this.$modal.msgSuccess("操作成功");
|
||
this.open4 = false;
|
||
this.getList();
|
||
});
|
||
}
|
||
}
|
||
});
|
||
},
|
||
/** 通过 */
|
||
pass(){
|
||
this.$refs["form3"].validate(valid => {
|
||
if (valid) {
|
||
if (this.form3.orderNo != null) {
|
||
console.log("---------"+JSON.stringify(this.form3))
|
||
passAudit(this.form3.orderNo).then(response => {
|
||
this.$modal.msgSuccess("操作成功");
|
||
this.open3 = false;
|
||
this.getList();
|
||
});
|
||
}
|
||
}
|
||
});
|
||
},
|
||
/** 拒绝 拒绝 提供押金抵扣*/
|
||
reject(){
|
||
console.log("---------")
|
||
this.$refs["form3"].validate(valid => {
|
||
if (valid) {
|
||
console.log("------222---")
|
||
if (this.form3.orderId != null) {
|
||
this.form3.status = "6";
|
||
updateOrder({orderId:this.form3.orderId,status:this.form3.status}).then(response => {
|
||
this.$modal.msgSuccess("操作成功");
|
||
this.open3 = false;
|
||
this.getList();
|
||
});
|
||
}
|
||
}
|
||
});
|
||
},
|
||
// 去沟通
|
||
toCommunicate: function(row) {
|
||
this.$modal.confirm2('请确保与客户进行沟通并通过用户同意后方可扣款，并做好录音上传审核通过后方可扣押金,客户电话：'+row.userName,"车损押金扣款","去沟通").then(function() {
|
||
console.log("-----去沟通----")
|
||
// 打开上传录音弹窗，输入扣款金额
|
||
}).then(() => {
|
||
this.form4 = row;
|
||
this.open4 = true;
|
||
}).catch(() => {
|
||
})
|
||
},
|
||
handleAudit(row){
|
||
this.open3 = true;
|
||
this.form3 = row;
|
||
console.log("this.form3============="+JSON.stringify(this.form3))
|
||
this.view = false;
|
||
},
|
||
toLog(row){
|
||
this.$router.push(`/system/commandLog/orderNo/index/${row.orderNo}`);
|
||
},
|
||
getTypeText(type) {
|
||
switch (type) {
|
||
case '1':
|
||
return '开锁';
|
||
case '2':
|
||
return '临时锁车';
|
||
case '3':
|
||
return '解锁';
|
||
case '4':
|
||
return '关锁';
|
||
default:
|
||
return ''; // 或者根据实际情况返回其他默认值
|
||
}
|
||
},
|
||
/** 查询字典类型列表 */
|
||
getAreaList() {
|
||
getAreaOptionselect().then(response => {
|
||
this.areaOptions = response.data;
|
||
});
|
||
},
|
||
changePrice(row){
|
||
// console.log('changePrice')
|
||
const orderId = row.orderId || this.ids
|
||
this.reset2();
|
||
getOrder(orderId).then(response => {
|
||
this.form2 = response.data;
|
||
// console.log("this.form2============="+JSON.stringify(this.form2));
|
||
this.open2 = true;
|
||
this.title2 = "改价";
|
||
});
|
||
},
|
||
// 押金抵扣
|
||
deduction: function(row) {
|
||
getArea(row.areaId).then(response => {
|
||
let area = response.data
|
||
let deposit = parseFloat(area.deposit);
|
||
if(row.totalFee > deposit ){//订单金额大于押金
|
||
this.$modal.confirm('订单金额【'+row.totalFee+'】大于押金【'+deposit+'】,是否确认押金抵扣,并结束订单？').then(function() {
|
||
return deduction({ orderNo: row.orderNo })
|
||
}).then(() => {
|
||
this.getList()
|
||
this.$modal.msgSuccess('操作成功')
|
||
}).catch(() => {
|
||
})
|
||
}else{
|
||
this.$modal.confirm('是否确认用押金抵扣？').then(function() {
|
||
return deduction({ orderNo: row.orderNo })
|
||
}).then(() => {
|
||
this.getList()
|
||
this.$modal.msgSuccess('操作成功')
|
||
}).catch(() => {
|
||
})
|
||
}
|
||
|
||
})
|
||
},
|
||
refund(row){
|
||
// console.log('changePrice')
|
||
const orderId = row.orderId || this.ids
|
||
this.reset2();
|
||
getOrder(orderId).then(response => {
|
||
this.form2 = response.data;
|
||
// console.log("this.form2============="+JSON.stringify(this.form2));
|
||
this.open2 = true;
|
||
this.title2 = "退款";
|
||
});
|
||
},
|
||
returnVehicle(row){
|
||
// console.log('returnVehicle--------------'+JSON.stringify(row))
|
||
this.$modal.confirm('是否确认辅助还车MAC为：' + row.sn + '的设备吗？').then(() => {
|
||
// 显示加载中状态
|
||
const loading = this.$loading({
|
||
lock: true,
|
||
text: '加载中...',
|
||
spinner: 'custom-loading-spinner',
|
||
background: 'rgba(0, 0, 0, 0.7)'
|
||
});
|
||
|
||
return returnVehicle({ orderNo: row.orderNo, returnType: "2" })
|
||
.then(() => {
|
||
this.getList();
|
||
this.$modal.msgSuccess("操作成功");
|
||
}).finally(() => {
|
||
// 关闭加载中状态
|
||
loading.close();
|
||
});
|
||
}).catch(() => {
|
||
// 如果用户取消了确认框
|
||
});
|
||
},
|
||
formatDistance(row){
|
||
// console.log("============"+JSON.stringify(row))
|
||
// console.log("============"+row.distance)
|
||
if(row == undefined || row.distance == null){
|
||
return "";
|
||
}
|
||
return (row.distance / 1000).toFixed(1) + ' 公里';
|
||
},
|
||
//金额格式化，如果金额是null，则返回0.00，如果本来就是两位小数则直接返回，否则保留两位小数
|
||
formatFee(fee){
|
||
if (!fee) return '0.00元';
|
||
const feeStr = fee.toString();
|
||
const twoDecimalPattern = /^\d+(\.\d{2})?$/;
|
||
if (twoDecimalPattern.test(feeStr)) {
|
||
return `${feeStr}元`;
|
||
}
|
||
const formattedFee = parseFloat(fee).toFixed(2);
|
||
return `${formattedFee}元`;
|
||
},
|
||
calculateNetFee() {
|
||
// 计算总退款
|
||
let totalRefund = this.form.etRefunds.reduce((total, refund) => {
|
||
return total + refund.appointmentFee + refund.dispatchFee + refund.ridingFee + refund.manageFee;
|
||
}, 0);
|
||
// 计算结算总费用
|
||
return this.form.payFee - totalRefund;
|
||
},
|
||
formatStatus(status) {
|
||
//状态：0-预约中，1-取消预约，2-开始骑行，3-骑行结束，4-订单结束
|
||
if (!status) return '未知';
|
||
switch (status) {
|
||
case '0':
|
||
return '预约中';
|
||
case '1':
|
||
return '取消预约';
|
||
case '2':
|
||
return '开始骑行';
|
||
case '3':
|
||
return '骑行结束';
|
||
case '4':
|
||
return '订单结束';
|
||
default:
|
||
return '未知';
|
||
}
|
||
},
|
||
formatType(payType) {
|
||
switch (payType) {
|
||
case 'ali':
|
||
return '支付宝';
|
||
case 'wx':
|
||
return '微信';
|
||
case 'sys':
|
||
return '系统自动';
|
||
default:
|
||
return '无';
|
||
}
|
||
},
|
||
formatDuration(row) {
|
||
const createTime = new Date(row.createTime);
|
||
const endTime = new Date(row.returnTime);
|
||
if (!row.returnTime) {
|
||
return "未结束";
|
||
}
|
||
const durationMilliseconds = endTime - createTime;
|
||
// 计算小时、分钟和秒
|
||
const hours = Math.floor(durationMilliseconds / (1000 * 60 * 60));
|
||
const minutes = Math.floor((durationMilliseconds % (1000 * 60 * 60)) / (1000 * 60));
|
||
const seconds = Math.floor((durationMilliseconds % (1000 * 60)) / 1000); // 取整秒数
|
||
// 格式化输出
|
||
const formattedTime = `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;
|
||
return formattedTime;
|
||
},
|
||
/** 查询订单列表 */
|
||
getList() {
|
||
this.loading = true;
|
||
listOrder(this.queryParams).then(response => {
|
||
this.orderList = response.rows;
|
||
this.total = response.total;
|
||
this.loading = false;
|
||
});
|
||
},
|
||
// 取消按钮
|
||
cancel() {
|
||
this.open = false;
|
||
this.reset();
|
||
},
|
||
// 取消按钮
|
||
cancel2() {
|
||
this.open2 = false;
|
||
this.reset2();
|
||
},
|
||
// 表单重置
|
||
reset() {
|
||
this.form = {
|
||
orderId: null,
|
||
areaId: null,
|
||
orderNo: null,
|
||
userId: null,
|
||
deviceMac: null,
|
||
payTime: null,
|
||
payType: null,
|
||
type: null,
|
||
totalFee: null,
|
||
mark: null,
|
||
duration: null,
|
||
distance: null,
|
||
status: null,
|
||
createTime: null,
|
||
device: {
|
||
vehicleNum: null,
|
||
mac: null
|
||
},
|
||
etRefunds: [],
|
||
etRefund: {
|
||
appointmentFee: null,
|
||
ridingFee: null,
|
||
dispatchFee: null,
|
||
manageFee: null,
|
||
reason: null,
|
||
createTime: null
|
||
},
|
||
appointmentFee: null,
|
||
ridingFee: null,
|
||
dispatchFee: null,
|
||
manageFee: null,
|
||
returnTime: null,
|
||
user: {
|
||
nickName: null
|
||
},
|
||
rule: {
|
||
name: null
|
||
}
|
||
};
|
||
this.resetForm("form");
|
||
},
|
||
reset2() {
|
||
this.form2 = {
|
||
orderId: null,
|
||
orderNo: null,
|
||
payTime: null,
|
||
appointmentFee: null,
|
||
ridingFee: null,
|
||
dispatchFee: null,
|
||
manageFee: null,
|
||
reason: null,
|
||
createTime: null
|
||
};
|
||
this.resetForm("form2");
|
||
},
|
||
/** 搜索按钮操作 */
|
||
handleQuery() {
|
||
this.queryParams.pageNum = 1;
|
||
this.getList();
|
||
},
|
||
/** 重置按钮操作 */
|
||
resetQuery() {
|
||
this.resetForm("queryForm");
|
||
this.handleQuery();
|
||
},
|
||
// 多选框选中数据
|
||
handleSelectionChange(selection) {
|
||
this.ids = selection.map(item => item.orderId)
|
||
this.single = selection.length!==1
|
||
this.multiple = !selection.length
|
||
},
|
||
/** 新增按钮操作 */
|
||
handleAdd() {
|
||
this.reset();
|
||
this.open = true;
|
||
this.title = "添加订单";
|
||
},
|
||
/** 修改按钮操作 */
|
||
handleUpdate(row) {
|
||
this.reset();
|
||
const orderId = row.orderId || this.ids
|
||
getOrder(orderId).then(response => {
|
||
// console.log("=====getOrder======="+JSON.stringify(response))
|
||
this.form = response.data;
|
||
if (response.data.etRefund) {
|
||
this.form.etRefund = response.data.etRefund;
|
||
}
|
||
this.showPlaceSearchMap = true;
|
||
this.open = true;
|
||
this.title = "订单详情";
|
||
this.key++;
|
||
});
|
||
},
|
||
/** 提交改价 */
|
||
submitChangePrice(){
|
||
// console.log("=====submitChangePrice======="+this.form2)
|
||
changePrice(this.form2).then(response => {
|
||
this.$modal.msgSuccess("改价成功");
|
||
this.open2 = false;
|
||
this.getList();
|
||
});
|
||
},
|
||
/** 提交退款 */
|
||
submitRefund(){
|
||
// console.log("=====submitRefund======="+this.form2)
|
||
refund(this.form2).then(response => {
|
||
this.$modal.msgSuccess("退款成功");
|
||
this.open2 = false;
|
||
this.getList();
|
||
});
|
||
},
|
||
/** 提交按钮 */
|
||
submitForm() {
|
||
this.$refs["form"].validate(valid => {
|
||
if (valid) {
|
||
if (this.form.orderId != null) {
|
||
updateOrder(this.form).then(response => {
|
||
this.$modal.msgSuccess("修改成功");
|
||
this.open = false;
|
||
this.getList();
|
||
});
|
||
} else {
|
||
addOrder(this.form).then(response => {
|
||
this.$modal.msgSuccess("新增成功");
|
||
this.open = false;
|
||
this.getList();
|
||
});
|
||
}
|
||
}
|
||
});
|
||
},
|
||
/** 删除按钮操作 */
|
||
handleDelete(row) {
|
||
const orderIds = row.orderId || this.ids;
|
||
this.$modal.confirm('是否确认删除订单编号为"' + orderIds + '"的数据项？').then(function() {
|
||
return delOrder(orderIds);
|
||
}).then(() => {
|
||
this.getList();
|
||
this.$modal.msgSuccess("删除成功");
|
||
}).catch(() => {});
|
||
},
|
||
/** 导出按钮操作 */
|
||
handleExport() {
|
||
this.download('system/order/export', {
|
||
...this.queryParams
|
||
}, `order_${new Date().getTime()}.xlsx`)
|
||
}
|
||
}
|
||
};
|
||
</script>
|
||
<style>
|
||
.el-dialog__body{
|
||
padding: 0px 20px !important;
|
||
}
|
||
.el-form-item--mini.el-form-item {
|
||
margin-bottom: 10px !important;
|
||
}
|
||
.el-dialog:not(.is-fullscreen) {
|
||
margin-top: 1vh !important;
|
||
}
|
||
.refund-card {
|
||
margin-bottom: 10px; /* 卡片之间的间距 */
|
||
border: 1px solid #dcdfe6; /* 边框颜色 */
|
||
border-radius: 4px; /* 边角圆润 */
|
||
/*padding: 10px; !* 内边距 *!*/
|
||
}
|
||
|
||
.refund-content {
|
||
padding: 10px;
|
||
}
|
||
|
||
.el-card__body {
|
||
padding: 10px !important;
|
||
}
|
||
|
||
.custom-loading-spinner {
|
||
border: 6px solid rgba(0, 0, 0, 0.1);
|
||
border-left-color: #409EFF;
|
||
border-radius: 50%;
|
||
display: inline-block;
|
||
width: 40px;
|
||
height: 40px;
|
||
animation: spin 1s linear infinite;
|
||
}
|
||
|
||
@keyframes spin {
|
||
0% {
|
||
transform: rotate(0deg);
|
||
}
|
||
100% {
|
||
transform: rotate(360deg);
|
||
}
|
||
}
|
||
|
||
|
||
</style>
|