103 lines
2.9 KiB
Vue
103 lines
2.9 KiB
Vue
|
<template>
|
|||
|
|
<div class="app-container">
|
|||
|
|
<!--工具栏-->
|
|||
|
|
<div class="head-container">
|
|||
|
|
<!--如果想在工具栏加入更多按钮，可以使用插槽方式， slot = 'left' or 'right'-->
|
|||
|
|
<div>
|
|||
|
|
<el-form ref="form" :model="form" size="small" label-width="80px">
|
|||
|
|
<!-- 搜索 -->
|
|||
|
|
<el-form-item label="路由方案:">
|
|||
|
|
<el-select
|
|||
|
|
v-model="route_plan_code"
|
|||
|
|
clearable
|
|||
|
|
size="small"
|
|||
|
|
placeholder="请选择"
|
|||
|
|
class="filter-item"
|
|||
|
|
style="width: 190px"
|
|||
|
|
>
|
|||
|
|
<el-option v-for="item in taskType" :key="item.plan_code" :label="item.plan_name" :value="item.plan_code" />
|
|||
|
|
</el-select>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="起点设备:">
|
|||
|
|
<el-select
|
|||
|
|
v-model="device_code"
|
|||
|
|
filterable
|
|||
|
|
clearable
|
|||
|
|
size="small"
|
|||
|
|
placeholder="请选择"
|
|||
|
|
class="filter-item"
|
|||
|
|
style="width: 190px"
|
|||
|
|
>
|
|||
|
|
<el-option v-for="item in deviceList" :key="item.device_code" :label="item.device_code" :value="item.device_code" />
|
|||
|
|
</el-select>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="终点设备:">
|
|||
|
|
<el-select
|
|||
|
|
v-model="next_device_code"
|
|||
|
|
filterable
|
|||
|
|
clearable
|
|||
|
|
size="small"
|
|||
|
|
placeholder="请选择"
|
|||
|
|
class="filter-item"
|
|||
|
|
style="width: 190px"
|
|||
|
|
>
|
|||
|
|
<el-option
|
|||
|
|
v-for="item in deviceList"
|
|||
|
|
:key="item.device_code"
|
|||
|
|
:label="item.device_code"
|
|||
|
|
:value="item.device_code"
|
|||
|
|
/>
|
|||
|
|
</el-select>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item>
|
|||
|
|
<el-button type="primary" @click="onSubmit">搜索</el-button>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-form>
|
|||
|
|
|
|||
|
|
<div style="color: #67C23A;font-size: 40px">{{ path }}</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import deviceCrud from '@/api/acs/device/device'
|
|||
|
|
import crudRoutePlan from '@/api/acs/route/routePlan'
|
|||
|
|
export default {
|
|||
|
|
name: 'RouteChart',
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
taskType: [],
|
|||
|
|
deviceList: [],
|
|||
|
|
path: null,
|
|||
|
|
route_plan_code: null,
|
|||
|
|
device_code: null,
|
|||
|
|
next_device_code: null
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
created() {
|
|||
|
|
deviceCrud.selectDeviceList().then(data => {
|
|||
|
|
this.deviceList = data
|
|||
|
|
})
|
|||
|
|
crudRoutePlan.selectList().then(res => {
|
|||
|
|
this.taskType = res
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
onSubmit() {
|
|||
|
|
this.path = null
|
|||
|
|
crudRoutePlan.getRoute(this.device_code, this.next_device_code, this.route_plan_code).then(res => {
|
|||
|
|
if (res[0] === undefined) {
|
|||
|
|
this.path = '该路由不通'
|
|||
|
|
}
|
|||
|
|
this.path = res[0].path
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style scoped>
|
|||
|
|
|
|||
|
|
</style>
|