<template>
|
<Modal
|
:value="visible"
|
:width="650"
|
title="创建订单"
|
@on-visible-change="visibleChange"
|
>
|
<h3>接口地址根路径：</h3>
|
<i-input v-model="baseUrl" readonly></i-input>
|
<Tabs v-model="mode">
|
<TabPane label="根据post创建订单" name="mode1">
|
<h3>接口名称：</h3>
|
<i-input placeholder="如：transportOrders" readonly></i-input>
|
<h3>接口参数：</h3>
|
<i-input
|
v-model="param1"
|
type="textarea"
|
:rows="9"
|
placeholder=""
|
></i-input>
|
</TabPane>
|
<TabPane label="创建positon" name="mode2">
|
<h3>指定车辆：</h3>
|
<Select v-model="intendedVehicle2">
|
<Option
|
v-for="(item, index) in vehicleNames"
|
:value="item"
|
:key="index"
|
>{{ item }}</Option
|
>
|
</Select>
|
<h3>站点名：</h3>
|
<Select v-model="locationName2" filterable>
|
<Option
|
v-for="(item, index) in destinations"
|
:value="item.destination"
|
:key="index"
|
>{{ item.destination }}</Option
|
>
|
</Select>
|
</TabPane>
|
<TabPane label="创建订单" name="mode3">
|
<h3>指定车辆：</h3>
|
<Select v-model="intendedVehicle3">
|
<Option
|
v-for="(item, index) in vehicleNames"
|
:value="item"
|
:key="index"
|
>{{ item }}</Option
|
>
|
</Select>
|
|
<div v-for="(d, i) in destinations3" :key="i">
|
<h1>
|
目的地{{ i + 1 }}
|
<i-button
|
v-if="i > 0"
|
type="primary"
|
shape="circle"
|
icon="md-remove"
|
@click="delDestination3(i)"
|
></i-button>
|
</h1>
|
<h3>站点名：</h3>
|
<Select v-model="d.locationName" @on-change="onChange3(d)" filterable>
|
<Option
|
v-for="(item, index) in destinations"
|
:value="item.destination"
|
:key="index"
|
>{{ item.destination }}</Option
|
>
|
</Select>
|
<h3>操作：</h3>
|
<Select v-model="d.operation" transfer>
|
<Option
|
v-for="(item, index) in d.operations"
|
:value="item"
|
:key="index"
|
>{{ item }}</Option
|
>
|
</Select>
|
</div>
|
<div style="text-align: center; margin-top: 11px">
|
<i-button
|
type="primary"
|
shape="circle"
|
icon="md-add"
|
@click="addDestination3"
|
></i-button>
|
</div>
|
</TabPane>
|
<!-- <TabPane label="创建OrderSequence" name="mode4">
|
<div v-for="(d, i) in destinations4" :key="i">
|
<h1>
|
orderSequence{{ i + 1 }}
|
<i-button
|
v-if="i > 0"
|
type="primary"
|
shape="circle"
|
icon="md-remove"
|
@click="delDestination4(i)"
|
></i-button>
|
</h1>
|
<h3>locationName：</h3>
|
<Select v-model="d.locationName" @on-change="onChange4(d)">
|
<Option
|
v-for="(item, index) in destinations"
|
:value="item.destination"
|
:key="index"
|
>{{ item.destination }}</Option
|
>
|
</Select>
|
<h3>operation：</h3>
|
<Select v-model="d.operation" transfer>
|
<Option
|
v-for="(item, index) in d.operations"
|
:value="item"
|
:key="index"
|
>{{ item }}</Option
|
>
|
</Select>
|
</div>
|
<div style="text-align: center; margin-top: 11px">
|
<i-button
|
type="primary"
|
shape="circle"
|
icon="md-add"
|
@click="addDestination4"
|
></i-button>
|
</div>
|
</TabPane> -->
|
</Tabs>
|
<template v-slot:footer>
|
<Button type="primary" @click="ok">确定</Button>
|
<Button type="default" @click="cancel">关闭</Button>
|
</template>
|
</Modal>
|
</template>
|
|
<script>
|
import { webConfig } from "@/utils";
|
import HttpRequest from "@/api/request";
|
export default {
|
name: "MonitorModalAddOrder",
|
model: {
|
prop: "visible",
|
event: "visible-change",
|
},
|
props: {
|
visible: Boolean,
|
},
|
data() {
|
return {
|
baseUrl: webConfig.apiUrl,
|
mode: "mode1",
|
url1: "",
|
url2: "",
|
url3: "transportOrders",
|
url4: "orderSequence",
|
param1: "{}",
|
locationName2: "",
|
intendedVehicle2: "",
|
operation2: "MOVE",
|
intendedVehicle3: "",
|
destinations3: [
|
{
|
locationName: "",
|
operation: "",
|
operations: [],
|
},
|
],
|
destinations4: [
|
{
|
locationName: "",
|
operation: "",
|
operations: [],
|
},
|
],
|
vehicleNames: [],
|
destinations: []
|
};
|
},
|
methods: {
|
ok() {
|
if (this.mode == "mode1") {
|
this.sendRequest1();
|
}
|
if (this.mode == "mode2") {
|
this.sendRequest2();
|
}
|
if (this.mode == "mode3") {
|
this.sendRequest3();
|
}
|
if (this.mode == "mode4") {
|
this.sendRequest4();
|
}
|
},
|
cancel() {
|
this.$emit("cancel");
|
this.close();
|
},
|
close() {
|
this.$emit("visible-change", false);
|
},
|
visibleChange(value) {
|
this.$emit("visible-change", value);
|
},
|
onChange3(destination) {
|
destination.operations = this.destinations.find(
|
(d) => d.destination == destination.locationName
|
).operations;
|
},
|
onChange4(destination) {
|
destination.operations = this.destinations.find(
|
(d) => d.destination == destination.locationName
|
).operations;
|
},
|
sendRequest(url, data) {
|
let httpRequest = new HttpRequest(this.baseUrl);
|
httpRequest.form(url, data).then(() => {
|
this.$Message.success("创建成功");
|
this.$emit("ok");
|
this.close();
|
});
|
},
|
sendRequest1() {
|
try {
|
let param1 = JSON.parse(this.param1);
|
this.sendRequest(this.url1, param1);
|
} catch (ex) {
|
this.$Message.error("参数解析失败，json格式不正确，" + ex.message);
|
}
|
},
|
sendRequest2() {
|
var date = new Date(
|
new Date().getTime() + 24 * 60 * 60 * 1000
|
).toISOString();
|
let url = "transportOrders";
|
let param = {
|
deadline: date,
|
intendedVehicle: this.intendedVehicle2,
|
destinations: [
|
{
|
locationName: this.locationName2,
|
operation: this.operation2,
|
},
|
],
|
};
|
if (!this.intendedVehicle2 || !this.intendedVehicle2.trim())
|
delete param.intendedVehicle;
|
this.sendRequest(url, param);
|
},
|
sendRequest3() {
|
var date = new Date(
|
new Date().getTime() + 24 * 60 * 60 * 1000
|
).toISOString();
|
let url = "transportOrders";
|
let param = {
|
deadline: date,
|
intendedVehicle: this.intendedVehicle3,
|
destinations: this.destinations3.map(d=>{
|
return {
|
locationName: d.locationName,
|
operation: d.operation,
|
}
|
}),
|
};
|
if (!this.intendedVehicle3 || !this.intendedVehicle3.trim())
|
delete param.intendedVehicle;
|
this.sendRequest(url, param);
|
},
|
sendRequest4() {
|
var date = new Date(
|
new Date().getTime() + 24 * 60 * 60 * 1000
|
).toISOString();
|
let url = "orderSequence";
|
let param = this.destinations4.map((d) => {
|
return {
|
deadline: date,
|
destinations: [
|
{
|
locationName: d.locationName,
|
operation: d.operation,
|
},
|
],
|
};
|
});
|
this.sendRequest(url, {
|
orderSequence: param,
|
});
|
},
|
addDestination3() {
|
this.destinations3.push({
|
locationName: "",
|
operation: "",
|
operations: [],
|
});
|
},
|
addDestination4() {
|
this.destinations4.push({
|
locationName: "",
|
operation: "",
|
operations: [],
|
});
|
},
|
delDestination3(i) {
|
this.destinations3.splice(i, 1);
|
},
|
delDestination4(i) {
|
this.destinations4.splice(i, 1);
|
},
|
setUrl() {
|
this.reload();
|
},
|
reload() {
|
let httpRequest = new HttpRequest(this.baseUrl);
|
httpRequest
|
.get("vehicles")
|
.then((res) => {
|
this.vehicleNames = res.map((v) => v.name);
|
})
|
.catch((err) => {
|
this.$Message.error({ content: err, duration: 10 });
|
});
|
httpRequest.get("destinations").then((res) => {
|
this.destinations = res;
|
});
|
},
|
},
|
mounted() {
|
this.reload();
|
},
|
};
|
</script>
|
|
<style lang="less" scoped>
|
</style>
|
