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>
|