|  |  |  | 
|---|
|  |  |  | <template> | 
|---|
|  |  |  | <div class="main_app"> | 
|---|
|  |  |  | <QueryForm | 
|---|
|  |  |  | v-model="filters" | 
|---|
|  |  |  | :query-form-config="queryFormConfig" | 
|---|
|  |  |  | @handleQuery="getList(1)" | 
|---|
|  |  |  | @clear="clear" | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | <el-table v-loading="loading" :data="list" stripe> | 
|---|
|  |  |  | <el-table-column | 
|---|
|  |  |  | prop="name" | 
|---|
|  |  |  | label="月台名称" | 
|---|
|  |  |  | min-width="100" | 
|---|
|  |  |  | show-overflow-tooltip | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | <el-table-column | 
|---|
|  |  |  | prop="name" | 
|---|
|  |  |  | label="月台组" | 
|---|
|  |  |  | min-width="100" | 
|---|
|  |  |  | show-overflow-tooltip | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | <el-table-column | 
|---|
|  |  |  | prop="name" | 
|---|
|  |  |  | label="停靠次数(次)" | 
|---|
|  |  |  | min-width="100" | 
|---|
|  |  |  | show-overflow-tooltip | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | <el-table-column | 
|---|
|  |  |  | prop="name" | 
|---|
|  |  |  | label="工作时长" | 
|---|
|  |  |  | min-width="100" | 
|---|
|  |  |  | show-overflow-tooltip | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | <el-table-column | 
|---|
|  |  |  | prop="name" | 
|---|
|  |  |  | label="月台使用率" | 
|---|
|  |  |  | min-width="100" | 
|---|
|  |  |  | show-overflow-tooltip | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | </el-table> | 
|---|
|  |  |  | <pagination | 
|---|
|  |  |  | @size-change="handleSizeChange" | 
|---|
|  |  |  | @current-change="getList" | 
|---|
|  |  |  | :pagination="pagination" | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <script> | 
|---|
|  |  |  | import Pagination from '@/components/common/Pagination' | 
|---|
|  |  |  | import QueryForm from '@/components/common/QueryForm' | 
|---|
|  |  |  | export default { | 
|---|
|  |  |  | components: { | 
|---|
|  |  |  | Pagination, | 
|---|
|  |  |  | QueryForm | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | data () { | 
|---|
|  |  |  | return { | 
|---|
|  |  |  | loading: false, | 
|---|
|  |  |  | pagination: { | 
|---|
|  |  |  | capacity: 10, | 
|---|
|  |  |  | page: 1 | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | filters: {}, | 
|---|
|  |  |  | list: [], | 
|---|
|  |  |  | total: 0, | 
|---|
|  |  |  | queryFormConfig: { | 
|---|
|  |  |  | formItems: [ | 
|---|
|  |  |  | { | 
|---|
|  |  |  | filed: 'aaaa', | 
|---|
|  |  |  | type: 'input', | 
|---|
|  |  |  | label: '月台名称' | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | filed: 'bbb', | 
|---|
|  |  |  | type: 'select', | 
|---|
|  |  |  | label: '月台组', | 
|---|
|  |  |  | options: [] | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | filed: 'selDate', | 
|---|
|  |  |  | type: 'daterange', | 
|---|
|  |  |  | label: '选择时间' | 
|---|
|  |  |  | } | 
|---|
|  |  |  | ], | 
|---|
|  |  |  | online: true | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | methods: { | 
|---|
|  |  |  | handleSub () { | 
|---|
|  |  |  | this.$refs.ruleForm.validate((valid) => { | 
|---|
|  |  |  | if (valid) { | 
|---|
|  |  |  | alert('submit!') | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | getList (page) { }, | 
|---|
|  |  |  | clear () { }, | 
|---|
|  |  |  | handleSizeChange (capacity) { | 
|---|
|  |  |  | this.pagination.capacity = capacity | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <style> | 
|---|
|  |  |  | </style> | 
|---|