Commit 2b006763 authored by neogcg's avatar neogcg

2.23/19:03

parent d8f144dc
<template>
<div>
<el-form
ref="form"
:model="formData"
:rules="rules"
label-width="200px"
class="form"
>
<el-form-item label="铁路名:" prop="name">
<el-input v-model="formData.name" placeholder="请输入铁路名" />
</el-form-item>
<el-form-item label="铁路线起点站名:" prop="startPointName">
<el-input
v-model="formData.startPointName"
placeholder="请输入铁路线起点站名"
/>
</el-form-item>
<el-form-item label="铁路线终点站名:" prop="endPointName">
<el-input
v-model="formData.endPointName"
placeholder="请输入铁路线终点站名"
/>
</el-form-item>
<el-form-item label="铁路全长(公里):" prop="totalLong">
<el-input
v-model="formData.totalLong"
placeholder="请输入铁路全长公里数"
/>
</el-form-item>
</el-form>
<div class="btn">
<!-- <el-button type="primary" @click="reset">重置</el-button>
<el-button type="primary" @click="submit">确认提交</el-button> -->
</div>
</div>
</template>
<script>
export default {
props: [],
components: {},
data() {
return {
formData: {
endPointName: "",
name: "",
startPointName: "",
totalLong: ""
},
monitor: {
equipCode: "",
equipFactory: "",
equipMode: '',
equipName: "",
equipSerialNumber: "",
equipType: '',
installDate: "",
kmSign: "",
parentId: '',
repairDate: ""
},
rules: {
name: [
{ required: true, message: "请输入铁路名", trigger: "blur" },
// { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
],
startPointName: [
{ required: true, message: "请输入铁路线起点站名", trigger: "blur" },
],
endPointName: [
{ required: true, message: "请输入铁路线终点站名", trigger: "blur" },
],
totalLong: [
{ required: true, message: "请输入铁路全长公里数", trigger: "blur" },
],
siteLongitude: [
{ required: true, message: "请输入铁路全长公里数", trigger: "blur" },
],
},
};
},
computed: {
},
methods: {
},
mounted() {},
};
</script>
<style scoped>
.form {
padding: 20px 0;
width: 600px;
margin: 0 auto;
}
</style>
\ No newline at end of file
<template>
<div>
<el-form
ref="form"
:model="formData"
:rules="rules"
label-width="200px"
class="form"
>
<el-form-item label="铁路名:" prop="name">
<el-input v-model="formData.name" placeholder="请输入铁路名" />
</el-form-item>
<el-form-item label="铁路线起点站名:" prop="startPointName">
<el-input
v-model="formData.startPointName"
placeholder="请输入铁路线起点站名"
/>
</el-form-item>
<el-form-item label="铁路线终点站名:" prop="endPointName">
<el-input
v-model="formData.endPointName"
placeholder="请输入铁路线终点站名"
/>
</el-form-item>
<el-form-item label="铁路全长(公里):" prop="totalLong">
<el-input
v-model="formData.totalLong"
placeholder="请输入铁路全长公里数"
/>
</el-form-item>
</el-form>
<div class="btn">
<el-button type="primary" @click="reset">重置</el-button>
<el-button type="primary" @click="submit">确认提交</el-button>
</div>
</div>
</template>
<script>
import { railWaysave,sitesave } from "../../api"
export default {
props: [],
components: {},
data() {
return {
formData: {
endPointName: "",
name: "",
startPointName: "",
totalLong: ""
},
monitor: {
equipCode: "",
equipFactory: "",
equipMode: '',
equipName: "",
equipSerialNumber: "",
equipType: '',
installDate: "",
kmSign: "",
parentId: '',
repairDate: ""
},
rules: {
name: [
{ required: true, message: "请输入铁路名", trigger: "blur" },
// { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
],
startPointName: [
{ required: true, message: "请输入铁路线起点站名", trigger: "blur" },
],
endPointName: [
{ required: true, message: "请输入铁路线终点站名", trigger: "blur" },
],
totalLong: [
{ required: true, message: "请输入铁路全长公里数", trigger: "blur" },
],
siteLongitude: [
{ required: true, message: "请输入铁路全长公里数", trigger: "blur" },
],
},
};
},
computed: {
},
methods: {
reset() {
this.$refs.form.resetFields();
},
submit() {
this.$refs.form.validate((valid) => {
if (valid) {
console.log(this.formData);
railWaysave(this.formData).then(res=>{
console.log(res);
})
}
this.formData={
endPointName: "",
name: "",
startPointName: "",
totalLong: ""
}
});
},
},
mounted() {},
};
</script>
<style lang="scss" scoped>
.form {
padding: 20px 0;
width: 600px;
margin: 0 auto;
}
.btn {
padding-top: 50px;
text-align: center;
button {
width: 120px;
}
}
</style>
\ No newline at end of file
<template>
<div>
<el-form
ref="stationform"
:model="stationForm"
label-width="200px"
class="form"
>
<el-form-item label="站点所属铁路线:" prop="parentId">
<el-select
v-model="stationForm.parentId"
placeholder="请选择铁路线"
>
<el-option
v-for="item in FSUrailway"
:key="item.key"
:label="item.label"
:value="item.key"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="站点编号" prop="siteCode">
<el-input
v-model="stationForm.siteCode"
placeholder="请输入站点编号"
/>
</el-form-item>
<el-form-item label="站名" prop="siteName">
<el-input
v-model="stationForm.siteName"
placeholder="请输入站名"
/>
</el-form-item>
<el-form-item label="站点地址" prop="siteAddress">
<el-input
v-model="stationForm.siteAddress"
placeholder="请输入站点地址"
/>
</el-form-item>
<el-form-item label="站点所在局" prop="siteArea">
<el-input
v-model="stationForm.siteArea"
placeholder="请输入站点所在局"
/>
</el-form-item>
<el-form-item label="站点所在段号" prop="siteSectionCode">
<el-input
v-model="stationForm.siteSectionCode"
placeholder="请输入站点所在段号"
/>
</el-form-item>
<el-form-item label="站点所在公里标" prop="siteKmSign">
<el-input
v-model="stationForm.siteKmSign"
placeholder="请输入站点所在公里标"
/>
</el-form-item>
<el-form-item label="站点经度" prop="siteLatitude">
<el-input
v-model="stationForm.siteLatitude"
placeholder="请输入站点经度"
/>
</el-form-item>
<el-form-item label="站点维度" prop="siteLongitude">
<el-input
v-model="stationForm.siteLongitude"
placeholder="请输入站点维度"
/>
</el-form-item>
<el-form-item label="站点其他信息" prop="siteOtherMessage">
<el-input
v-model="stationForm.siteOtherMessage"
placeholder="请输入站点其他信息"
/>
</el-form-item>
</el-form>
<div class="btn">
<el-button type="primary" @click="reset">重置</el-button>
<el-button type="primary" @click="submit">确认提交</el-button>
</div>
</div>
</template>
<script>
import { sitelist,sitesave } from "../../api"
export default {
props: [],
components: {},
data() {
return {
FSUrailway: [
{
key: 0,
label: "张呼客运专线",
},
{
key: 1,
label: "南昆客运专线",
},
],
stationForm: {
parentId: "",
siteCode: "",
siteName: "",
siteAddress: "",
siteArea: "",
siteSectionCode: "",
siteKmSign: "",
siteLatitude: "",
siteLongitude: "",
siteOtherMessage: "",
},
};
},
computed: {
},
methods: {
reset() {
this.$refs.stationform.resetFields();
},
submit() {
this.$refs.stationform.validate((valid) => {
if (valid) {
console.log(this.stationForm);
sitesave(this.stationForm).then(res=>{
console.log(res);
})
}
this.stationForm={
parentId: "",
siteCode: "",
siteName: "",
siteAddress: "",
siteArea: "",
siteSectionCode: "",
siteKmSign: "",
siteLatitude: "",
siteLongitude: "",
siteOtherMessage: "",
}
});
},
},
mounted() {},
};
</script>
<style lang="scss" scoped>
.form {
padding: 20px 0;
width: 600px;
margin: 0 auto;
}
.btn {
padding-top: 50px;
text-align: center;
button {
width: 120px;
}
}
</style>
\ No newline at end of file
...@@ -5,7 +5,8 @@ ...@@ -5,7 +5,8 @@
<el-tab-pane label="铁路线" name="0"> <el-tab-pane label="铁路线" name="0">
<div class="content" v-if="activeName === '0'"> <div class="content" v-if="activeName === '0'">
<div class="content-title">添加铁路线</div> <div class="content-title">添加铁路线</div>
<el-form <railWay></railWay>
<!-- <el-form
ref="form" ref="form"
:model="formData" :model="formData"
:rules="rules" :rules="rules"
...@@ -13,6 +14,7 @@ ...@@ -13,6 +14,7 @@
class="form" class="form"
> >
<el-form-item label="铁路名:" prop="name"> <el-form-item label="铁路名:" prop="name">
<el-input v-model="formData.name" placeholder="请输入铁路名" /> <el-input v-model="formData.name" placeholder="请输入铁路名" />
</el-form-item> </el-form-item>
...@@ -34,81 +36,90 @@ ...@@ -34,81 +36,90 @@
placeholder="请输入铁路全长公里数" placeholder="请输入铁路全长公里数"
/> />
</el-form-item> </el-form-item>
</el-form> </el-form> -->
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="站点" name="1"> <el-tab-pane label="站点" name="1">
<div class="content" v-if="activeName === '1'"> <div class="content" v-if="activeName === '1'">
<div class="content-title">添加站点</div> <div class="content-title">添加站点</div>
<el-form <station></station>
<!-- <el-form
ref="stationform" ref="stationform"
:model="stationForm" :model="stationForm"
:rules="rules" :rules="rules"
label-width="200px" label-width="200px"
class="form" class="form"
> >
<el-form-item label="站点所属铁路线:" prop="railwayName"> <el-form-item label="站点所属铁路线:" prop="parentId">
<el-input <el-select
v-model="stationForm.railwayName" v-model="stationForm.parentId"
placeholder="请选择铁路线" placeholder="请选择铁路线"
/> >
<el-option
v-for="item in FSUrailway"
:key="item.key"
:label="item.label"
:value="item.key"
></el-option>
</el-select>
</el-form-item> </el-form-item>
<el-form-item label="站点编号:" prop="staId"> <el-form-item label="站点编号:" prop="siteCode">
<el-input <el-input
v-model="stationForm.staId" v-model="stationForm.siteCode"
placeholder="请输入站点编号" placeholder="请输入站点编号"
/> />
</el-form-item> </el-form-item>
<el-form-item label="站名" prop="staName"> <el-form-item label="站名" prop="siteName">
<el-input <el-input
v-model="stationForm.staName" v-model="stationForm.siteName"
placeholder="请输入站名" placeholder="请输入站名"
/> />
</el-form-item> </el-form-item>
<el-form-item label="站点地址" prop="staAddress"> <el-form-item label="站点地址" prop="siteAddress">
<el-input <el-input
v-model="stationForm.staAddress" v-model="stationForm.siteAddress"
placeholder="请输入站点地址" placeholder="请输入站点地址"
/> />
</el-form-item> </el-form-item>
<el-form-item label="站点所在局" prop="staOffice"> <el-form-item label="站点所在局" prop="siteArea">
<el-input <el-input
v-model="stationForm.staOffice" v-model="stationForm.siteArea"
placeholder="请输入站点所在局" placeholder="请输入站点所在局"
/> />
</el-form-item> </el-form-item>
<el-form-item label="站点所在编号" prop="staNumber"> <el-form-item label="站点所在段号" prop="siteSectionCode">
<el-input <el-input
v-model="stationForm.staNumber" v-model="stationForm.siteSectionCode"
placeholder="请输入站点所在号" placeholder="请输入站点所在号"
/> />
</el-form-item> </el-form-item>
<el-form-item label="站点所在公里标" prop="staKm"> <el-form-item label="站点所在公里标" prop="siteKmSign">
<el-input <el-input
v-model="stationForm.staKm" v-model="stationForm.siteKmSign"
placeholder="请输入站点所在公里标" placeholder="请输入站点所在公里标"
/> />
</el-form-item> </el-form-item>
<el-form-item label="站点经度" prop="stalongitude"> <el-form-item label="站点经度" prop="siteLatitude">
<el-input <el-input
v-model="stationForm.stalongitude" v-model="stationForm.siteLatitude"
placeholder="请输入站点经度" placeholder="请输入站点经度"
/> />
</el-form-item> </el-form-item>
<el-form-item label="站点维度" prop="stadimensionality"> <el-form-item label="站点维度" prop="siteLongitude">
<el-input <el-input
v-model="stationForm.stadimensionality" v-model="stationForm.siteLongitude"
placeholder="请输入站点维度" placeholder="请输入站点维度"
/> />
</el-form-item> </el-form-item>
<el-form-item label="站点其他信息" prop="staOtherinfo"> <el-form-item label="站点其他信息" prop="siteOtherMessage">
<el-input <el-input
v-model="stationForm.staOtherinfo" v-model="stationForm.siteOtherMessage"
placeholder="请输入站点其他信息" placeholder="请输入站点其他信息"
/> />
</el-form-item> </el-form-item>
</el-form> </el-form> -->
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="FSU" name="2"> <el-tab-pane label="FSU" name="2">
...@@ -121,9 +132,9 @@ ...@@ -121,9 +132,9 @@
label-width="200px" label-width="200px"
class="form" class="form"
> >
<el-form-item label="所在铁路线:" prop="railwayName"> <el-form-item label="所在铁路线:" prop="parentId">
<el-select <el-select
v-model="FSUForm.railwayName" v-model="FSUForm.parentId"
placeholder="请选择铁路线" placeholder="请选择铁路线"
> >
<el-option <el-option
...@@ -219,6 +230,7 @@ ...@@ -219,6 +230,7 @@
<el-tab-pane label="监测设备" name="3"> <el-tab-pane label="监测设备" name="3">
<div class="content" v-if="activeName === '3'"> <div class="content" v-if="activeName === '3'">
<div class="content-title">添加监测设备</div> <div class="content-title">添加监测设备</div>
<monitor></monitor>
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="漏缆" name="4"> <el-tab-pane label="漏缆" name="4">
...@@ -234,16 +246,22 @@ ...@@ -234,16 +246,22 @@
</el-tabs> </el-tabs>
</div> </div>
<div class="btn"> <!-- <div class="btn">
<el-button type="primary" @click="reset">重置</el-button> <el-button type="primary" @click="reset">重置</el-button>
<el-button type="primary" @click="submit">确认提交</el-button> <el-button type="primary" @click="submit">确认提交</el-button>
</div> </div> -->
</div> </div>
</template> </template>
<script> <script>
import { railWaysave } from "../api" import { railWaysave,sitesave } from "../api"
import railWay from "./comp/railWay.vue"
import monitor from "./comp/monitor.vue"
import station from "./comp/station.vue"
export default { export default {
components: {
monitor,station,railWay
},
data() { data() {
return { return {
FSUrailway: [ FSUrailway: [
...@@ -300,19 +318,19 @@ export default { ...@@ -300,19 +318,19 @@ export default {
totalLong: "" totalLong: ""
}, },
stationForm: { stationForm: {
railwayName: "", parentId: "",
staId: "", siteCode: "",
staName: "", siteName: "",
staAddress: "", siteAddress: "",
staOffice: "", siteArea: "",
staNumber: "", siteSectionCode: "",
staKm: "", siteKmSign: "",
stalongitude: "", siteLatitude: "",
stadimensionality: "", siteLongitude: "",
staOtherinfo: "", siteOtherMessage: "",
}, },
FSUForm: { FSUForm: {
railwayName: "", parentId: "",
station: "", station: "",
FSUid: "", FSUid: "",
FSUport: "", FSUport: "",
...@@ -342,7 +360,7 @@ export default { ...@@ -342,7 +360,7 @@ export default {
totalLong: [ totalLong: [
{ required: true, message: "请输入铁路全长公里数", trigger: "blur" }, { required: true, message: "请输入铁路全长公里数", trigger: "blur" },
], ],
stadimensionality: [ siteLongitude: [
{ required: true, message: "请输入铁路全长公里数", trigger: "blur" }, { required: true, message: "请输入铁路全长公里数", trigger: "blur" },
], ],
}, },
...@@ -356,14 +374,46 @@ export default { ...@@ -356,14 +374,46 @@ export default {
this.$refs.form.resetFields(); this.$refs.form.resetFields();
}, },
submit() { submit() {
if (this.activeName==0) {
this.$refs.form.validate((valid) => { this.$refs.form.validate((valid) => {
if (valid) { if (valid) {
console.log(this.formData); console.log(this.formData);
railWaysave(this.formData).then(res=>{ railWaysave(this.formData).then(res=>{
console.log(res); console.log(res);
}) })
}
this.formData={
endPointName: "",
name: "",
startPointName: "",
totalLong: ""
} }
}); });
}
if (this.activeName==1) {
this.$refs.stationform.validate((valid) => {
if (valid) {
console.log(this.stationForm);
// sitesave(this.stationForm).then(res=>{
// console.log(res);
// })
}
this.stationForm={
parentId: "",
siteCode: "",
siteName: "",
siteAddress: "",
siteArea: "",
siteSectionCode: "",
siteKmSign: "",
siteLatitude: "",
siteLongitude: "",
siteOtherMessage: "",
}
});
}
}, },
}, },
}; };
......
...@@ -7,9 +7,14 @@ const path = { ...@@ -7,9 +7,14 @@ const path = {
railWaybatchDelete: 'railWay/batchDelete', railWaybatchDelete: 'railWay/batchDelete',
railWayselectList: 'railWay/selectList', railWayselectList: 'railWay/selectList',
siteList: 'site/selectPage',
sitedetail: 'site/detail',
sitesave: 'site/save',
sitebatchDelete: 'site/batchDelete',
siteselectList: 'site/selectList',
} }
// 铁路线
export function railWaylist() { export function railWaylist() {
return request.post(path.railWaylist, ...arguments) return request.post(path.railWaylist, ...arguments)
} }
...@@ -28,4 +33,22 @@ export function railWayselectList() { ...@@ -28,4 +33,22 @@ export function railWayselectList() {
return request.post(path.railWayselectList, ...arguments) return request.post(path.railWayselectList, ...arguments)
} }
//站点
export function sitelist() {
return request.post(path.siteList, ...arguments)
}
export function sitedetail() {
return request.post(path.sitedetail, ...arguments)
}
export function sitesave() {
return request.post(path.sitesave, ...arguments)
}
export function sitebatchDelete() {
return request.post(path.sitebatchDelete, ...arguments)
}
export function siteselectList() {
return request.post(path.siteselectList, ...arguments)
}
<template>
<div>
<div class="leakage-top">
<div style="color: #666666"></div>
<div class="operate-btn">
<el-button
:type="multipleSelection.length ? 'primary' : 'info'"
:disabled="!multipleSelection.length"
@click="delData"
>删除</el-button
>
<el-button type="primary" @click="refresh">刷新</el-button>
<el-button type="primary" @click="query">查询</el-button>
<el-button type="primary" @click="exportData">导出</el-button>
</div>
</div>
<el-table
ref="multipleTable"
class="statistics-table"
:data="tableData"
tooltip-effect="dark"
style="width: 100%"
:row-class-name="tableRowClassName"
:row-style="{ height: '50px' }"
:header-cell-style="{
background: '#eaf1fe',
color: '#000',
fontWeight: 700,
height: '50px',
}"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="55" align="center" />
<el-table-column prop="name" label="铁路名称" align="center" />
<el-table-column
prop="startPointName"
label="铁路起点站名"
align="center"
/>
<el-table-column
prop="endPointName"
label="铁路终点站名"
show-overflow-tooltip
align="center"
/>
<el-table-column
prop="totalLong"
label="铁路总长度(公里)"
show-overflow-tooltip
align="center"
/>
<el-table-column
prop="action"
label="详细信息"
show-overflow-tooltip
align="center"
>
<template slot-scope="{ row }">
<el-link type="primary" :underline="false" @click="handleView(row)"
>查看</el-link
>
</template>
</el-table-column>
</el-table>
<pagination
:limit="params.pageSize"
:page="params.pageNum"
:total="total"
class="pagination"
@pagination="handlePageChange"
/>
</div>
</template>
<script>
import Pagination from "@/components/Pagination";
import { railWaylist, railWaybatchDelete, railWaydetail } from "../../api";
export default {
props: [],
components: { Pagination },
data() {
return {
tableData:[],
params: {
pageNum: 1,
pageSize: 10,
},
total: 10,
multipleSelection: [],
ids: [],
};
},
computed: {},
methods: {
tableRowClassName({ row, rowIndex }) {
return rowIndex % 2 === 0 ? "" : "single-row";
},
changeType(item) {
this.activeName = item.key;
},
delData() {
let ids = this.ids;
railWaybatchDelete({ ids }).then((res) => {});
this.getTableData();
},
refresh() {},
query() {},
exportData() {},
handleSelectionChange(val) {
this.multipleSelection = val;
this.ids = this.multipleSelection.map((i) => i.id);
console.log(this.ids);
},
handleView(row) {
console.log(row.id);
let id = row.id;
railWaydetail({ id }).then((res) => {
console.log(res);
});
},
handlePageChange(pageData) {
this.params.pageSize = pageData.size;
this.params.pageNum = pageData.page;
this.getTableData();
},
getTableData() {
// this.tableData2 = this.tableData.slice(( this.params.pageNum - 1) * this.params.pageSize,
// this.params.pageNum * this.params.pageSize
// );
// this.total = this.tableData.length
let params = {
current: this.params.pageNum,
size: this.params.pageSize,
};
railWaylist(params).then((res) => {
let list = res.records || [];
this.tableData = list;
this.total = res.total;
});
},
},
mounted() {
this.getTableData();
},
};
</script>
<style lang="scss" scoped>
.leakage-cable {
.leakage-top {
margin-bottom: 20px;
display: flex;
align-items: flex-end;
justify-content: space-between;
}
& ::v-deep .cell {
color: #333333;
}
& ::v-deep .stripe {
background-color: #eaf1fe;
}
& ::v-deep .red {
background-color: #f00;
}
& ::v-deep .green {
background-color: green;
}
.page {
display: flex;
align-items: center;
justify-content: center;
margin: 20px 0;
.pageNum {
margin: 0 20px;
}
}
}
</style>
<style lang="scss">
.statistics-table {
.single-row {
background: #f1f6ff;
}
td {
padding: 5px !important;
}
}
</style>
\ No newline at end of file
<template>
<div>
<div class="leakage-top">
<div style="color: #666666"></div>
<div class="operate-btn">
<el-button
:type="multipleSelection.length ? 'primary' : 'info'"
:disabled="!multipleSelection.length"
@click="delData"
>删除</el-button
>
<el-button type="primary" @click="refresh">刷新</el-button>
<el-button type="primary" @click="query">查询</el-button>
<el-button type="primary" @click="exportData">导出</el-button>
</div>
</div>
<el-table
ref="multipleTable"
class="statistics-table"
:data="tableData"
tooltip-effect="dark"
style="width: 100%"
:row-class-name="tableRowClassName"
:row-style="{ height: '50px' }"
:header-cell-style="{
background: '#eaf1fe',
color: '#000',
fontWeight: 700,
height: '50px',
}"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="55" align="center" />
<el-table-column prop="parentId" label="站点所属铁路线:" align="center" />
<el-table-column prop="siteCode" label="站点编号" align="center" />
<el-table-column
prop="siteName"
label="站名"
align="center"
/>
<el-table-column
prop="siteAddress"
label="站点地址"
show-overflow-tooltip
align="center"
/>
<el-table-column
prop="siteArea"
label="站点所在局"
show-overflow-tooltip
align="center"
/>
<el-table-column
prop="siteSectionCode"
label="站点所在段号"
show-overflow-tooltip
align="center"
/> <el-table-column
prop="siteKmSign"
label="站点所在公里标"
show-overflow-tooltip
align="center"
/> <el-table-column
prop="siteLatitude"
label="站点经度"
show-overflow-tooltip
align="center"
/> <el-table-column
prop="siteLongitude"
label="站点维度"
show-overflow-tooltip
align="center"
/> <el-table-column
prop="siteOtherMessage"
label="站点其他信息"
show-overflow-tooltip
align="center"
/>
<el-table-column
prop="action"
label="详细信息"
show-overflow-tooltip
align="center"
>
<template slot-scope="{ row }">
<el-link type="primary" :underline="false" @click="handleView(row)"
>查看</el-link
>
</template>
</el-table-column>
</el-table>
<pagination
:limit="params.pageSize"
:page="params.pageNum"
:total="total"
class="pagination"
@pagination="handlePageChange"
/>
</div>
</template>
<script>
import Pagination from "@/components/Pagination";
import { sitelist } from "../../api";
export default {
props: [],
components: { Pagination },
data() {
return {
tableData:[],
params: {
pageNum: 1,
pageSize: 10,
},
total: 10,
multipleSelection: [],
ids: [],
};
},
computed: {},
methods: {
tableRowClassName({ row, rowIndex }) {
return rowIndex % 2 === 0 ? "" : "single-row";
},
changeType(item) {
this.activeName = item.key;
},
delData() {
let ids = this.ids;
railWaybatchDelete({ ids }).then((res) => {});
this.getTableData();
},
refresh() {},
query() {},
exportData() {},
handleSelectionChange(val) {
this.multipleSelection = val;
this.ids = this.multipleSelection.map((i) => i.id);
console.log(this.ids);
},
handleView(row) {
console.log(row.id);
let id = row.id;
railWaydetail({ id }).then((res) => {
console.log(res);
});
},
handlePageChange(pageData) {
this.params.pageSize = pageData.size;
this.params.pageNum = pageData.page;
this.getTableData();
},
getTableData() {
// this.tableData2 = this.tableData.slice(( this.params.pageNum - 1) * this.params.pageSize,
// this.params.pageNum * this.params.pageSize
// );
// this.total = this.tableData.length
let params = {
current: this.params.pageNum,
size: this.params.pageSize,
};
sitelist(params).then((res) => {
let list = res.records || [];
this.tableData = list;
this.total = res.total;
});
},
},
mounted() {
this.getTableData();
},
};
</script>
<style lang="scss" scoped>
.leakage-cable {
.leakage-top {
margin-bottom: 20px;
display: flex;
align-items: flex-end;
justify-content: space-between;
}
& ::v-deep .cell {
color: #333333;
}
& ::v-deep .stripe {
background-color: #eaf1fe;
}
& ::v-deep .red {
background-color: #f00;
}
& ::v-deep .green {
background-color: green;
}
.page {
display: flex;
align-items: center;
justify-content: center;
margin: 20px 0;
.pageNum {
margin: 0 20px;
}
}
}
</style>
<style lang="scss">
.statistics-table {
.single-row {
background: #f1f6ff;
}
td {
padding: 5px !important;
}
}
</style>
\ No newline at end of file
...@@ -9,7 +9,7 @@ ...@@ -9,7 +9,7 @@
>{{ item.label }}</el-button >{{ item.label }}</el-button
> >
</el-button-group> </el-button-group>
<div class="leakage-top"> <!-- <div class="leakage-top">
<div style="color: #666666"></div> <div style="color: #666666"></div>
<div class="operate-btn"> <div class="operate-btn">
...@@ -25,9 +25,10 @@ ...@@ -25,9 +25,10 @@
</div> </div>
</div> </div>
<el-table <el-table
v-if="activeName === '0'"
ref="multipleTable" ref="multipleTable"
class="statistics-table" class="statistics-table"
:data="tableData2" :data="tableData"
tooltip-effect="dark" tooltip-effect="dark"
style="width: 100%" style="width: 100%"
:row-class-name="tableRowClassName" :row-class-name="tableRowClassName"
...@@ -42,15 +43,19 @@ ...@@ -42,15 +43,19 @@
> >
<el-table-column type="selection" width="55" align="center" /> <el-table-column type="selection" width="55" align="center" />
<el-table-column prop="name" label="铁路名称" align="center" /> <el-table-column prop="name" label="铁路名称" align="center" />
<el-table-column prop="start" label="铁路起点站名" align="center" />
<el-table-column <el-table-column
prop="end" prop="startPointName"
label="铁路起点站名"
align="center"
/>
<el-table-column
prop="endPointName"
label="铁路终点站名" label="铁路终点站名"
show-overflow-tooltip show-overflow-tooltip
align="center" align="center"
/> />
<el-table-column <el-table-column
prop="long" prop="totalLong"
label="铁路总长度(公里)" label="铁路总长度(公里)"
show-overflow-tooltip show-overflow-tooltip
align="center" align="center"
...@@ -67,22 +72,31 @@ ...@@ -67,22 +72,31 @@
> >
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table> -->
<pagination <railWayTable v-if="activeName=='0'"></railWayTable>
<stationTable v-if="activeName=='1'"></stationTable>
<!-- <pagination
:limit="params.pageSize" :limit="params.pageSize"
:page="params.pageNum" :page="params.pageNum"
:total="total" :total="total"
class="pagination" class="pagination"
@pagination="handlePageChange" @pagination="handlePageChange"
/> /> -->
</div> </div>
</template> </template>
<script> <script>
import railWayTable from "./comp/railWayTable.vue"
import stationTable from "./comp/stationTable.vue"
import Pagination from "@/components/Pagination"; import Pagination from "@/components/Pagination";
import { railWaylist } from "../api" import {
railWaylist,
railWaybatchDelete,
railWaydetail,
sitelist,
} from "../api";
export default { export default {
components: { Pagination }, components: { Pagination,railWayTable,stationTable },
data() { data() {
return { return {
params: { params: {
...@@ -117,7 +131,7 @@ export default { ...@@ -117,7 +131,7 @@ export default {
key: "5", key: "5",
}, },
], ],
tableData2:[], tableData2: [],
tableData: [ tableData: [
{ {
name: "张呼铁路客运专线", name: "张呼铁路客运专线",
...@@ -181,6 +195,7 @@ export default { ...@@ -181,6 +195,7 @@ export default {
}, },
], ],
multipleSelection: [], multipleSelection: [],
ids: [],
}; };
}, },
methods: { methods: {
...@@ -190,18 +205,32 @@ export default { ...@@ -190,18 +205,32 @@ export default {
changeType(item) { changeType(item) {
this.activeName = item.key; this.activeName = item.key;
}, },
delData() {}, delData() {
let ids = this.ids;
railWaybatchDelete({ ids }).then((res) => {});
this.getTableData();
},
refresh() {}, refresh() {},
query() {}, query() {},
exportData() {}, exportData() {},
handleSelectionChange(val) { handleSelectionChange(val) {
this.multipleSelection = val; this.multipleSelection = val;
this.ids = this.multipleSelection.map((i) => i.id);
console.log(this.ids);
},
handleView(row) {
console.log(row.id);
let id = row.id;
railWaydetail({ id }).then((res) => {
console.log(res);
});
}, },
handleView() {},
handlePageChange(pageData) { handlePageChange(pageData) {
this.params.pageSize = pageData.size; this.params.pageSize = pageData.size;
this.params.pageNum = pageData.page; this.params.pageNum = pageData.page;
this.getTableData() this.getTableData();
}, },
getTableData() { getTableData() {
// this.tableData2 = this.tableData.slice(( this.params.pageNum - 1) * this.params.pageSize, // this.tableData2 = this.tableData.slice(( this.params.pageNum - 1) * this.params.pageSize,
...@@ -210,18 +239,17 @@ export default { ...@@ -210,18 +239,17 @@ export default {
// this.total = this.tableData.length // this.total = this.tableData.length
let params = { let params = {
current: this.params.pageNum, current: this.params.pageNum,
size: this.params.pageSize size: this.params.pageSize,
} };
railWaylist(params).then((res)=>{ railWaylist(params).then((res) => {
console.log(res); let list = res.records || [];
let list = res.records || [] this.tableData = list;
this.tableData = list this.total = res.total;
this.total = res.total });
})
}, },
}, },
mounted() { mounted() {
this.getTableData() this.getTableData();
}, },
}; };
</script> </script>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment