<template>
|
<div class="pipe-line-table">
|
<div class="table-header">
|
<div class="title">管段列表信息</div>
|
<div class="form">
|
<el-form :inline="true" class="demo-form-inline">
|
<el-form-item label="管线点查询:">
|
<el-input placeholder="审批人" size="mini"></el-input>
|
</el-form-item>
|
<el-form-item label="运行状态:">
|
<el-select size="mini">
|
<el-option label="编辑" value="shanghai"></el-option>
|
<el-option label="提交" value="beijing"></el-option>
|
<el-option label="保存" value="beijing"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item>
|
<el-button size="mini">查询</el-button>
|
<el-button type="primary" size="mini">导入管段属性表</el-button>
|
<el-button type="primary" size="mini">图形显示</el-button>
|
<el-button type="primary" size="mini">导出信息</el-button>
|
</el-form-item>
|
</el-form>
|
</div>
|
</div>
|
<div class="table-list">
|
<el-table
|
:data="tableData"
|
style="width: 100%;height: 300px"
|
:default-sort="{prop: 'date', order: 'descending'}"
|
>
|
<el-table-column
|
prop="date"
|
label="序号"
|
sortable
|
width="180">
|
</el-table-column>
|
<el-table-column
|
prop="name"
|
label="维护与操作"
|
sortable
|
width="180">
|
</el-table-column>
|
<el-table-column
|
prop="address"
|
label="管段编码">
|
</el-table-column>
|
<el-table-column
|
prop="address"
|
label="所属管线名称">
|
</el-table-column>
|
<el-table-column
|
prop="address"
|
label="管径(mm)">
|
</el-table-column>
|
<el-table-column
|
prop="address"
|
label="材质">
|
</el-table-column>
|
<el-table-column
|
prop="address"
|
label="管道压力(Mpa)">
|
</el-table-column>
|
<el-table-column
|
prop="address"
|
label="流向">
|
</el-table-column>
|
<el-table-column
|
prop="address"
|
label="管沟类型">
|
</el-table-column>
|
<el-table-column
|
prop="address"
|
label="埋没方式">
|
</el-table-column>
|
<el-table-column
|
prop="address"
|
label="埋没时间">
|
</el-table-column>
|
<el-table-column
|
prop="address"
|
label="探测时间">
|
</el-table-column>
|
</el-table>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import 'leaflet/dist/leaflet.css'
|
|
export default {
|
name: 'PipeLineList',
|
datas: {},
|
mounted () {
|
this.$nextTick(() => {
|
this.init()
|
})
|
},
|
methods: {}
|
}
|
</script>
|
|
<style lang="less">
|
.pipe-line-table {
|
z-index: 999;
|
position: absolute;
|
bottom: 0;
|
width: 100%;
|
|
.el-form--inline .el-form-item__content {
|
vertical-align: middle;
|
}
|
|
.table-header {
|
background-color: #D7D7D7;
|
width: 100%;
|
height: 40px;
|
line-height: 40px;
|
|
.title {
|
float: left;
|
width: 200px;
|
}
|
|
.form {
|
margin-left: 200px;
|
min-height: 330px;
|
}
|
}
|
|
.table-list {
|
height: 300px;
|
}
|
}
|
</style>>
|
