载物订单管理接入接口
This commit is contained in:
parent
96c61f53b6
commit
a69c3d1908
12
src/api/dropdown.js
Normal file
12
src/api/dropdown.js
Normal file
@ -0,0 +1,12 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
// 获取景区下拉值
|
||||
export function getScenicValue (data) {
|
||||
return request({
|
||||
url: 'api/dataDropdown/obtainScenicList',
|
||||
method: 'get',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
export default { getScenicValue }
|
@ -1,5 +1,6 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
// 获取订单列表
|
||||
export function getOrderList(params) {
|
||||
return request({
|
||||
url: 'api/order/allOrder',
|
||||
@ -7,3 +8,48 @@ export function getOrderList(params) {
|
||||
params
|
||||
})
|
||||
}
|
||||
|
||||
// 根据id查询订单详情
|
||||
export function getOrderDetail(id) {
|
||||
return request({
|
||||
url: `api/order/queryOrderDetail/${id}`,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
// 查询结算订单列表
|
||||
export function getSettleOrderList(params) {
|
||||
return request({
|
||||
url: 'api/settlementOrder/allSettlementOrder',
|
||||
method: 'get',
|
||||
params
|
||||
})
|
||||
}
|
||||
|
||||
// 根据id查询结算订单详情
|
||||
export function getSettleOrderDetail(settlementOrderId) {
|
||||
return request({
|
||||
url: `api/settlementOrder/querySettlementOrderDetail/${settlementOrderId}`,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
// 生成结算订单
|
||||
export function generateSettlementOrder(params) {
|
||||
return request({
|
||||
url: 'api/settlementOrder/generateSettlementOrder',
|
||||
method: 'post',
|
||||
data: params
|
||||
})
|
||||
}
|
||||
|
||||
// 获取生成结算单确认列表
|
||||
// export function get
|
||||
|
||||
// 更新结算单状态
|
||||
export function updateSettleOrderStatus(settlementOrderId, settlementOrderStatus) {
|
||||
return request({
|
||||
url: `api/settlementOrder/updateSettlementOrderStatus/${settlementOrderId}/${settlementOrderStatus}`,
|
||||
method: 'put',
|
||||
})
|
||||
}
|
||||
|
@ -32,4 +32,11 @@ export function edit(data) {
|
||||
})
|
||||
}
|
||||
|
||||
export default { add, enable, del, edit }
|
||||
export function allCustomer() {
|
||||
return request({
|
||||
url: 'aerocraftAdminApi/cnCustomer/all',
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
export default { add, enable, del, edit, allCustomer }
|
||||
|
@ -4,7 +4,7 @@ import { encrypt } from '@/utils/rsaEncrypt'
|
||||
export function add(data) {
|
||||
data.password = encrypt(data.password)
|
||||
console.log(data);
|
||||
|
||||
|
||||
return request({
|
||||
url: 'api/users',
|
||||
method: 'post',
|
||||
@ -31,7 +31,7 @@ export function resetPwd(ids) {
|
||||
export function edit(data) {
|
||||
if(data.password) data.password = encrypt(data.password)
|
||||
console.log(data);
|
||||
|
||||
|
||||
return request({
|
||||
url: 'api/users',
|
||||
method: 'put',
|
||||
@ -71,5 +71,14 @@ export function updateEmail(form) {
|
||||
})
|
||||
}
|
||||
|
||||
// 载物订单管理需要判断用户角色 /api/users
|
||||
export function getUser(params) {
|
||||
return request({
|
||||
url: 'api/users',
|
||||
method: 'get',
|
||||
params
|
||||
})
|
||||
}
|
||||
|
||||
export default { add, edit, del, resetPwd }
|
||||
|
||||
|
@ -3,28 +3,44 @@
|
||||
<!-- 搜索栏 -->
|
||||
<div class="head-container">
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="query.scenicArea"
|
||||
placeholder="请输入景区名称"
|
||||
class="filter-item"
|
||||
style="width: 200px;"
|
||||
<el-select
|
||||
v-model="query.attractionId"
|
||||
placeholder="请选择景区"
|
||||
clearable
|
||||
/>
|
||||
<el-input
|
||||
v-model="query.customerName"
|
||||
placeholder="请输入客户名称"
|
||||
class="filter-item"
|
||||
style="width: 200px;"
|
||||
style="width: 200px"
|
||||
>
|
||||
<el-option
|
||||
v-for="scenic in scenicOptions"
|
||||
:key="scenic.id"
|
||||
:label="scenic.name"
|
||||
:value="scenic.id"
|
||||
/>
|
||||
</el-select>
|
||||
<el-select
|
||||
v-model="query.customerId"
|
||||
placeholder="请选择客户"
|
||||
clearable
|
||||
/>
|
||||
class="filter-item"
|
||||
style="width: 200px"
|
||||
>
|
||||
<el-option
|
||||
v-for="customer in customerOptions"
|
||||
:key="customer.id"
|
||||
:label="customer.name"
|
||||
:value="customer.id"
|
||||
/>
|
||||
</el-select>
|
||||
<el-input
|
||||
v-model="query.phone"
|
||||
placeholder="请输入手机号"
|
||||
class="filter-item"
|
||||
style="width: 200px;"
|
||||
style="width: 200px"
|
||||
clearable
|
||||
/>
|
||||
<el-button type="primary" class="filter-item" @click="handleSearch">查询</el-button>
|
||||
<el-button type="primary" class="filter-item" @click="handleSearch"
|
||||
>查询</el-button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -37,36 +53,59 @@
|
||||
@selection-change="handleSelectionChange"
|
||||
>
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column prop="customerName" label="客户名称" align="left" />
|
||||
<el-table-column prop="phone" label="手机号码" align="left" />
|
||||
<el-table-column prop="orderTime" label="下单时间" width="180" align="left" />
|
||||
<el-table-column prop="cost" label="下单费用" align="right">
|
||||
<el-table-column prop="customerName" label="客户名称" align="center" />
|
||||
<el-table-column prop="phone" label="手机号码" align="center" />
|
||||
<el-table-column prop="orderTime" label="下单时间" align="center" />
|
||||
<el-table-column
|
||||
prop="amount"
|
||||
label="下单费用"
|
||||
width="180"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.cost.toFixed(2) }}
|
||||
<div>基础费用:{{ scope.row.amount.toFixed(2) }}</div>
|
||||
<div>附加费用:{{ scope.row.surchargeAmount.toFixed(4) }}</div>
|
||||
<div>总费用:{{ scope.row.totalAmount.toFixed(4) }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="area" label="区域" align="left" />
|
||||
<el-table-column prop="scenicArea" label="景区" align="left" />
|
||||
<el-table-column prop="route" label="路线" align="left" />
|
||||
<el-table-column prop="initiator" label="订单发起人" align="left" />
|
||||
<el-table-column prop="type" label="订单类型" align="left" />
|
||||
<el-table-column prop="status" label="订单状态" align="left">
|
||||
<el-table-column prop="areaName" label="区域" align="center" />
|
||||
<el-table-column prop="scenicName" label="景区" align="center" />
|
||||
<el-table-column prop="route" label="路线" align="center" />
|
||||
<el-table-column prop="initiator" label="订单发起人" align="center" />
|
||||
<el-table-column prop="type" label="订单类型" align="center" />
|
||||
<el-table-column prop="status" label="订单状态" align="center">
|
||||
<template slot-scope="scope">
|
||||
<span class="status-text">{{ scope.row.status }}</span>
|
||||
<span
|
||||
:class="[
|
||||
'status-text',
|
||||
scope.row.status === '已完成' ? 'success' : '',
|
||||
]"
|
||||
>
|
||||
{{ scope.row.status }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="settlementStatus" label="结算状态" align="left">
|
||||
<el-table-column prop="settlementStatus" label="结算状态" align="center">
|
||||
<template slot-scope="scope">
|
||||
<span class="status-text">{{ scope.row.settlementStatus }}</span>
|
||||
<span
|
||||
:class="[
|
||||
'status-text',
|
||||
scope.row.settlementStatus === '已结算' ? 'success' : '',
|
||||
]"
|
||||
>
|
||||
{{ scope.row.settlementStatus }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="finishTime"
|
||||
label="完成时间"
|
||||
width="180"
|
||||
align="center"
|
||||
/>
|
||||
<el-table-column label="操作" width="120" align="center" fixed="right">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
type="text"
|
||||
size="small"
|
||||
@click="handleDetail(scope.row)"
|
||||
>
|
||||
<el-button type="text" size="small" @click="handleDetail(scope.row)">
|
||||
查看详情
|
||||
</el-button>
|
||||
</template>
|
||||
@ -89,94 +128,218 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getOrderList } from '@/api/order'
|
||||
import { getOrderList } from "@/api/order";
|
||||
import { allAreas } from "@/api/system/area";
|
||||
import { allScenic } from "@/api/system/scenic";
|
||||
import { allCustomer } from "@/api/system/customer";
|
||||
import { getList } from "@/api/system/pilot";
|
||||
import { getOrderDetail } from "@/api/order";
|
||||
import { getUser } from "@/api/system/user";
|
||||
import store from "@/store";
|
||||
|
||||
export default {
|
||||
name: 'loadOrder',
|
||||
name: "loadOrder",
|
||||
created() {
|
||||
this.getList()
|
||||
this.getAreas();
|
||||
this.getScenics();
|
||||
this.getPilots();
|
||||
this.getCustomers();
|
||||
this.getList();
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
query: {
|
||||
scenicArea: '',
|
||||
customerName: '',
|
||||
phone: ''
|
||||
attractionId: undefined,
|
||||
customerId: undefined,
|
||||
phone: "",
|
||||
},
|
||||
page: {
|
||||
current: 1,
|
||||
size: 10,
|
||||
total: 2
|
||||
total: 0,
|
||||
},
|
||||
tableData: [
|
||||
{
|
||||
customerName: '小明',
|
||||
phone: '12345678',
|
||||
orderTime: '2025-07-07 18:28:51',
|
||||
cost: 100.00,
|
||||
area: '广州区域',
|
||||
scenicArea: '白云山',
|
||||
route: 'a-b',
|
||||
initiator: '小红',
|
||||
type: '载物飞行',
|
||||
status: '未执行',
|
||||
settlementStatus: '未结算'
|
||||
},
|
||||
{
|
||||
customerName: '小明',
|
||||
phone: '12345678',
|
||||
orderTime: '2025-07-07 18:28:51',
|
||||
cost: 100.00,
|
||||
area: '广州区域',
|
||||
scenicArea: '白云山',
|
||||
route: 'a-b',
|
||||
initiator: '小红',
|
||||
type: '载物飞行',
|
||||
status: '进行中',
|
||||
settlementStatus: '结算中'
|
||||
}
|
||||
],
|
||||
selection: []
|
||||
}
|
||||
areaOptions: [],
|
||||
scenicOptions: [],
|
||||
customerOptions: [],
|
||||
pilotOptions: [],
|
||||
tableData: [],
|
||||
selection: [],
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.loading = true
|
||||
this.loading = true;
|
||||
const params = {
|
||||
attractionId: this.query.scenicArea ? this.query.scenicArea : undefined,
|
||||
customerId: this.query.customerName ? this.query.customerName : undefined,
|
||||
phone: this.query.phone ? this.query.phone : undefined,
|
||||
page: this.page.current - 1,
|
||||
size: this.page.size
|
||||
attractionId: this.query.attractionId,
|
||||
customerId: this.query.customerId,
|
||||
phone: this.query.phone,
|
||||
current: this.page.current,
|
||||
size: this.page.size,
|
||||
};
|
||||
getOrderList(params)
|
||||
.then((response) => {
|
||||
this.tableData = response.records.map((record) => {
|
||||
// 查找客户名称
|
||||
const customer = this.customerOptions.find(
|
||||
(c) => c.id === record.customerId
|
||||
);
|
||||
const area = this.areaOptions.find(a => a.id === record.areaId);
|
||||
const scenic = this.scenicOptions.find(s => s.id === record.attractionId);
|
||||
const initiator = this.pilotOptions.find(p => p.id === record.orderInitiatorId);
|
||||
return {
|
||||
customerName: customer ? customer.name : "未知客户",
|
||||
phone: record.customerPhone,
|
||||
orderTime: record.orderCreateTime,
|
||||
finishTime: record.orderFinishTime,
|
||||
amount: record.amount,
|
||||
totalAmount: record.totalAmount,
|
||||
surchargeAmount: record.surchargeAmount,
|
||||
areaName: area ? area.name : "未知区域",
|
||||
scenicName: scenic ? scenic.name : "未知景区",
|
||||
route: record.routeName,
|
||||
initiator: initiator ? initiator.name : "未知发起人",
|
||||
type: record.orderType === 1 ? "载物飞行" : "载人飞行",
|
||||
status: this.getOrderStatus(record.mainOrderStatus),
|
||||
settlementStatus: this.getSettlementStatus(
|
||||
record.settlementStatus
|
||||
),
|
||||
id: record.id,
|
||||
};
|
||||
});
|
||||
this.page.total = response.total || 0;
|
||||
})
|
||||
.finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 获取区域列表
|
||||
async getAreas() {
|
||||
try {
|
||||
const res = await allAreas();
|
||||
if (res) {
|
||||
this.areaOptions = res.map((area) => ({
|
||||
id: area.id,
|
||||
name: area.name,
|
||||
}));
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("获取区域列表失败:", error);
|
||||
}
|
||||
getOrderList(params).then(response => {
|
||||
this.tableData = response.content || []
|
||||
this.page.total = response.totalElements || 0
|
||||
}).finally(() => {
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
// 获取景区列表
|
||||
async getScenics() {
|
||||
try {
|
||||
let res = [];
|
||||
// 获取用户信息
|
||||
const userRes = await getUser({ id: store.getters.user.id });
|
||||
if (userRes && userRes.content && userRes.content.length > 0) {
|
||||
const userInfo = userRes.content[0];
|
||||
if (userInfo.roles && userInfo.roles.length > 0) {
|
||||
this.userRole = userInfo.roles[0].name;
|
||||
// 根据角色调用不同接口
|
||||
if (this.userRole === "区域负责人") {
|
||||
res = await allScenic({areaId: userInfo.areaId});
|
||||
} else if (this.userRole === "管理员" || this.userRole === "财务") {
|
||||
res = await allScenic();
|
||||
}
|
||||
}
|
||||
}
|
||||
// 设置景区选项
|
||||
if (res && Array.isArray(res)) {
|
||||
this.scenicOptions = res.map((scenic) => ({
|
||||
id: scenic.id,
|
||||
name: scenic.name,
|
||||
}));
|
||||
}
|
||||
// 获取订单列表
|
||||
this.getList();
|
||||
} catch (error) {
|
||||
console.error("获取景区列表失败:", error);
|
||||
}
|
||||
},
|
||||
|
||||
// 获取飞行员数据,在这是为了获取订单发起人
|
||||
async getPilots() {
|
||||
try {
|
||||
const res = await getList();
|
||||
if (res) {
|
||||
this.pilotOptions = res.content.map((pilot) => ({
|
||||
id: pilot.id,
|
||||
name: pilot.name,
|
||||
}));
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("获取飞行员列表失败:", error);
|
||||
}
|
||||
},
|
||||
// 获取客户列表
|
||||
async getCustomers() {
|
||||
try {
|
||||
const res = await allCustomer();
|
||||
if (res) {
|
||||
this.customerOptions = res.map((customer) => ({
|
||||
id: customer.id,
|
||||
name: customer.name,
|
||||
}));
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("获取客户列表失败:", error);
|
||||
}
|
||||
},
|
||||
// 获取订单详情
|
||||
async getDetail(id) {
|
||||
try {
|
||||
const res = await getOrderDetail(id);
|
||||
if (res) {
|
||||
this.form = res;
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("获取订单详情失败:", error);
|
||||
}
|
||||
},
|
||||
// 获取订单状态显示文本
|
||||
getOrderStatus(status) {
|
||||
const statusMap = {
|
||||
0: "未进行",
|
||||
1: "进行中",
|
||||
2: "已完成",
|
||||
3: "已取消",
|
||||
};
|
||||
return statusMap[status] || "未知状态";
|
||||
},
|
||||
// 获取结算状态显示文本
|
||||
getSettlementStatus(status) {
|
||||
const statusMap = {
|
||||
0: "未结算",
|
||||
1: "结算中",
|
||||
2: "结算完成",
|
||||
};
|
||||
return statusMap[status] || "未知状态";
|
||||
},
|
||||
handleSearch() {
|
||||
this.page.current = 1
|
||||
this.getList()
|
||||
this.page.current = 1;
|
||||
this.getList();
|
||||
},
|
||||
handleSelectionChange(val) {
|
||||
this.selection = val
|
||||
this.selection = val;
|
||||
},
|
||||
handleSizeChange(val) {
|
||||
this.page.size = val
|
||||
this.getList()
|
||||
this.page.size = val;
|
||||
this.getList();
|
||||
},
|
||||
handleCurrentChange(val) {
|
||||
this.page.current = val
|
||||
this.getList()
|
||||
this.page.current = val;
|
||||
this.getList();
|
||||
},
|
||||
handleDetail(row) {
|
||||
this.$router.push({ path: '/order/loadOrderDetail', query: { id: row.orderId }})
|
||||
}
|
||||
}
|
||||
}
|
||||
this.$router.push({
|
||||
path: "/order/loadOrderDetail",
|
||||
query: { id: row.id, areaName: row.areaName },
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@ -187,7 +350,6 @@ export default {
|
||||
.filter-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
gap: 10px;
|
||||
|
||||
.filter-item {
|
||||
@ -212,10 +374,13 @@ export default {
|
||||
|
||||
.status-text {
|
||||
color: #f56c6c;
|
||||
&.success {
|
||||
color: #67c23a;
|
||||
}
|
||||
}
|
||||
|
||||
.el-button--text {
|
||||
color: #409EFF;
|
||||
color: #409eff;
|
||||
&:hover {
|
||||
color: #66b1ff;
|
||||
}
|
||||
|
@ -9,36 +9,36 @@
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="订单号">
|
||||
<el-input v-model="form.orderNo" />
|
||||
<el-input v-model="form.orderNo" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="订单类型">
|
||||
<el-input v-model="form.orderType" />
|
||||
<el-input v-model="form.orderType" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="订单发起人">
|
||||
<el-input v-model="form.initiator" />
|
||||
<el-input v-model="form.initiator" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="客户名称">
|
||||
<el-input v-model="form.customerName" />
|
||||
<el-input v-model="form.customerName" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="手机号码">
|
||||
<el-input v-model="form.phoneNumber" />
|
||||
<el-input v-model="form.phoneNumber" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="区域">
|
||||
<el-select v-model="form.region" placeholder="请选择区域">
|
||||
<el-option label="区域1" value="area1" />
|
||||
<el-option label="区域2" value="area2" />
|
||||
<el-select v-model="form.region" disabled placeholder="请选择区域">
|
||||
<!-- <el-option label="区域1" value="area1" />
|
||||
<el-option label="区域2" value="area2" /> -->
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
@ -46,35 +46,35 @@
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="景区">
|
||||
<el-select v-model="form.scenicArea" placeholder="请选择景区">
|
||||
<el-option label="景区1" value="scenic1" />
|
||||
<el-option label="景区2" value="scenic2" />
|
||||
<el-select v-model="form.scenicArea" disabled placeholder="请选择景区">
|
||||
<!-- <el-option label="景区1" value="scenic1" />
|
||||
<el-option label="景区2" value="scenic2" /> -->
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="路线">
|
||||
<el-select v-model="form.route" placeholder="请选择路线">
|
||||
<el-option label="路线1" value="route1" />
|
||||
<el-option label="路线2" value="route2" />
|
||||
<el-select v-model="form.route" disabled placeholder="请选择路线">
|
||||
<!-- <el-option label="路线1" value="route1" />
|
||||
<el-option label="路线2" value="route2" /> -->
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="货物重量">
|
||||
<el-input v-model="form.weight" />
|
||||
<el-input v-model="form.weight" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="附加费">
|
||||
<el-input v-model="form.additionalFee" />
|
||||
<el-input v-model="form.additionalFee" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="操作员">
|
||||
<el-input v-model="form.operator" />
|
||||
<el-input v-model="form.operator" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
@ -84,6 +84,7 @@
|
||||
type="datetime"
|
||||
placeholder="选择日期时间"
|
||||
format="yyyy-MM-dd HH:mm:ss"
|
||||
disabled
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
@ -91,17 +92,17 @@
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="订单状态">
|
||||
<el-input v-model="form.orderStatus" />
|
||||
<el-input v-model="form.orderStatus" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="订单确认人">
|
||||
<el-input v-model="form.confirmer" />
|
||||
<el-input v-model="form.confirmer" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="订单金额">
|
||||
<el-input v-model="form.amount" />
|
||||
<el-input v-model="form.amount" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
@ -166,41 +167,34 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getOrderDetail } from '@/api/order'
|
||||
|
||||
export default {
|
||||
name: 'loadOrderDetail',
|
||||
data() {
|
||||
return {
|
||||
form: {
|
||||
orderNo: 'ORDER2025001',
|
||||
orderType: '普通订单',
|
||||
initiator: '张三',
|
||||
customerName: '李四',
|
||||
phoneNumber: '13800138000',
|
||||
region: 'area1',
|
||||
scenicArea: 'scenic1',
|
||||
route: 'route1',
|
||||
weight: '100kg',
|
||||
additionalFee: '50',
|
||||
operator: '小明',
|
||||
orderTime: new Date(),
|
||||
orderStatus: '进行中',
|
||||
confirmer: '王五',
|
||||
amount: '1000'
|
||||
orderNo: '',
|
||||
orderType: '',
|
||||
initiator: '',
|
||||
customerName: '',
|
||||
phoneNumber: '',
|
||||
region: '',
|
||||
scenicArea: '',
|
||||
route: '',
|
||||
weight: '',
|
||||
additionalFee: '',
|
||||
operator: '',
|
||||
orderTime: '',
|
||||
orderStatus: '',
|
||||
confirmer: '',
|
||||
amount: ''
|
||||
},
|
||||
flightTaskData: [
|
||||
{
|
||||
operator: '小明',
|
||||
device: 'T100',
|
||||
cargoImage: 'https://axure-file.lanhuapp.com/md5__aa8db5b0612acabf7c9b92c53293d1d3.png',
|
||||
weight: '100kg',
|
||||
status: '进行中',
|
||||
videoUrl: 'https://videos.pexels.com/video-files/32839562/13997147_2560_1440_30fps.mp4'
|
||||
}
|
||||
],
|
||||
flightTaskData: [],
|
||||
taskPage: {
|
||||
page: 1,
|
||||
size: 10,
|
||||
total: 3
|
||||
total: 0
|
||||
},
|
||||
previewVisible: false,
|
||||
previewUrl: '',
|
||||
@ -217,8 +211,42 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
getDetail(id) {
|
||||
// 调用接口获取详情
|
||||
console.log('获取详情:', id)
|
||||
getOrderDetail(id).then(res => {
|
||||
// 映射数据到form对象
|
||||
this.form = {
|
||||
orderNo: res.orderNo,
|
||||
orderType: res.orderType,
|
||||
initiator: res.orderInitiator,
|
||||
customerName: res.customerName,
|
||||
phoneNumber: res.phone,
|
||||
region: this.$route.query.areaName || res.areaName,
|
||||
scenicArea: res.scenicName,
|
||||
route: res.routeName,
|
||||
weight: res.cargoWeight + 'kg',
|
||||
additionalFee: res.surchargeAmount,
|
||||
operator: res.operatorName,
|
||||
orderTime: res.orderCreateTime,
|
||||
orderStatus: res.mainOrderStatus,
|
||||
confirmer: res.operatorName,
|
||||
amount: res.amount
|
||||
}
|
||||
|
||||
// 映射任务列表数据
|
||||
this.flightTaskData = res.orderTaskDetailList.map(task => ({
|
||||
operator: task.operatorName,
|
||||
device: task.deviceName,
|
||||
cargoImage: task.attachmentMaterialList && task.attachmentMaterialList.length > 0
|
||||
? task.attachmentMaterialList[0].fileFullPath
|
||||
: '',
|
||||
weight: task.cargoWeight + 'kg',
|
||||
status: task.orderItemStatus,
|
||||
videoUrl: ''
|
||||
}))
|
||||
|
||||
// 更新分页数据
|
||||
this.taskPage.total = res.orderTaskDetailList.length
|
||||
this.taskPage.page = 1
|
||||
})
|
||||
},
|
||||
handlePreview(url) {
|
||||
this.previewUrl = url
|
||||
@ -264,11 +292,11 @@ export default {
|
||||
::v-deep .el-date-editor {
|
||||
width: 240px;
|
||||
}
|
||||
::v-deep .el-input.is-disabled .el-input__inner {
|
||||
::v-deep .el-input.is-disabled .el-input__inner {
|
||||
background-color: white;
|
||||
color: #686868;
|
||||
}
|
||||
::v-deep .el-textarea.is-disabled .el-textarea__inner {
|
||||
::v-deep .el-textarea.is-disabled .el-textarea__inner {
|
||||
background-color: white;
|
||||
color: #686868;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user