xymp
/
frontend
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

实时查询功能

Browse Source
master
liuyi 2 years ago
parent 2cf750b663
commit 040da13a21
2 changed files with 102 additions and 180 deletions
Show Stats Download Patch File Download Diff File

10
src/utils/api/index.js
Unescape Escape View File

@ -47,6 +47,16 @@ export function getPictureList(data){
})
}
//实时查询
//获取电压-线路-杆塔等信息
export function getSearchInfo(data){
return request({
url: "/test/getLineAndGt",
method: "post",
data
})
}
//杆塔信息
//1.获取杆塔列表
export function getTowerListApi(data) {

272
src/views/realTimeSearch/index.vue
Unescape Escape View File

@ -2,47 +2,37 @@
<div class="realTimeSearch">
<div class="searchMain">
<div class="searchBox">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form :inline="true" :model="formdata" class="demo-form-inline">
<el-form-item label="电压名称">
<el-select v-model="formdata.dyVal" @change="getSearchxl">
<el-option v-for="item in dyOptions" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="线路名称">
<el-select v-model="formInline.xlVal" placeholder="活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
<el-select v-model="formdata.xlVal" @change="getSearchgt">
<el-option v-for="item in xlOptions" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="杆塔名称">
<el-select v-model="formInline.gtVal" placeholder="活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
<el-select v-model="formdata.gtVal" @change="getSearchtd">
<el-option v-for="item in gtOptions" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="通道监拍点">
<el-select v-model="formInline.tdVal" placeholder="活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
<el-select v-model="formdata.tdVal">
<el-option v-for="item in tdOptions" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="开始日期">
<el-date-picker
v-model="formInline.startTimeVal"
type="datetime"
placeholder="选择日期时间"
>
</el-date-picker>
</el-form-item>
<el-form-item label="结束日期">
<el-date-picker
v-model="formInline.endTimeVal"
type="datetime"
placeholder="选择日期时间"
>
</el-date-picker>
<el-form-item label="日期">
<el-date-picker v-model="formdata.timeVal" type="datetimerange" start-placeholder="开始日期" end-placeholder="结束日期"
value-format="timestamp"></el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">查询</el-button>
</el-form-item>
</el-form>
</div>
<div class="pictureBox">
<div class="pictureBox" v-loading="loading">
<el-card
class="box-card imgList"
v-for="(item, index) in picList"
@ -70,9 +60,10 @@
<div class="pageNation">
<el-pagination
@current-change="handleCurrentChange"
@size-change="handleSizeChange"
:current-page="page"
:page-size="pageSize"
layout=" prev, pager, next, jumper,total"
layout="sizes, prev, pager, next, jumper,total"
:total="total"
background
>
@ -83,175 +74,96 @@
</template>
<script>
import { getSearchInfo, getPictureList } from "@/utils/api/index";
export default {
data() {
return {
formInline: {
xlVal: "",
gtVal: "",
tdVal: "",
startTimeVal: "",
endTimeVal: "",
dyOptions: [],//电压数据
xlOptions: [],//线路数据
gtOptions: [],//杆塔数据
tdOptions: [],//通道数据
formdata: {
dyVal:'',
xlVal:'',
gtVal: '',
tdVal: '',
timeVal: '',
},
picList: [
{
id: 15,
termId: 10010,
channelId: 1,
presetId: 255,
width: 0,
height: 0,
fileSize: 265357,
photoTime: "2023-05-05T17:21:04.000+00:00",
recvTime: null,
path: "http://47.96.238.157/photos/2023/05/06/64/XYIGQ10C221000064_1_FF_20230506012104.jpg",
manualRequest: 0,
},
{
id: 16,
termId: 10010,
channelId: 1,
presetId: 255,
width: 0,
height: 0,
fileSize: 263597,
photoTime: "2023-05-05T17:21:49.000+00:00",
recvTime: null,
path: "http://47.96.238.157/photos/2023/05/06/64/XYIGQ10C221000064_1_FF_20230506012149.jpg",
manualRequest: 0,
},
{
id: 17,
termId: 10010,
channelId: 1,
presetId: 255,
width: 0,
height: 0,
fileSize: 265471,
photoTime: "2023-05-05T17:25:13.000+00:00",
recvTime: null,
path: "http://47.96.238.157/photos/2023/05/06/64/XYIGQ10C221000064_1_FF_20230506012513.jpg",
manualRequest: 0,
},
{
id: 18,
termId: 10010,
channelId: 1,
presetId: 255,
width: 0,
height: 0,
fileSize: 263625,
photoTime: "2023-05-05T17:36:37.000+00:00",
recvTime: null,
path: "http://47.96.238.157/photos/2023/05/06/64/XYIGQ10C221000064_1_FF_20230506013617.jpg",
manualRequest: 0,
},
{
id: 19,
termId: 10010,
channelId: 1,
presetId: 255,
width: 0,
height: 0,
fileSize: 261572,
photoTime: "2023-05-05T17:37:14.000+00:00",
recvTime: null,
path: "http://47.96.238.157/photos/2023/05/06/64/XYIGQ10C221000064_1_FF_20230506013654.jpg",
manualRequest: 0,
},
{
id: 22,
termId: 10010,
channelId: 1,
presetId: 255,
width: 0,
height: 0,
fileSize: 264348,
photoTime: "2023-05-05T17:40:06.000+00:00",
recvTime: null,
path: "http://47.96.238.157/photos/2023/05/06/64/XYIGQ10C221000064_1_FF_20230506013946.jpg",
manualRequest: 0,
},
{
id: 23,
termId: 10010,
channelId: 1,
presetId: 255,
width: 0,
height: 0,
fileSize: 262231,
photoTime: "2023-05-05T17:42:33.000+00:00",
recvTime: null,
path: "http://47.96.238.157/photos/2023/05/06/64/XYIGQ10C221000064_1_FF_20230506014213.jpg",
manualRequest: 0,
},
{
id: 24,
termId: 10010,
channelId: 1,
presetId: 255,
width: 0,
height: 0,
fileSize: 262564,
photoTime: "2023-05-05T17:43:11.000+00:00",
recvTime: null,
path: "http://47.96.238.157/photos/2023/05/06/64/XYIGQ10C221000064_1_FF_20230506014252.jpg",
manualRequest: 0,
},
{
id: 26,
termId: 10010,
channelId: 2,
presetId: 255,
width: 0,
height: 0,
fileSize: 177557,
photoTime: "2023-05-05T17:46:23.000+00:00",
recvTime: null,
path: "http://47.96.238.157/photos/2023/05/06/64/XYIGQ10C221000064_2_FF_20230506014604.jpg",
manualRequest: 0,
},
{
id: 37,
termId: 10010,
channelId: 2,
presetId: 255,
width: 0,
height: 0,
fileSize: 219467,
photoTime: "2023-05-05T17:47:31.000+00:00",
recvTime: null,
path: "http://47.96.238.157/photos/2023/05/06/64/XYIGQ10C221000064_2_FF_20230506014711.jpg",
manualRequest: 0,
},
{
id: 89,
termId: 10010,
channelId: 2,
presetId: 255,
width: 0,
height: 0,
fileSize: 257854,
photoTime: "2023-05-06T00:54:07.000+00:00",
recvTime: null,
path: "http://47.96.238.157/photos/2023/05/06/64/XYIGQ10C221000064_2_FF_20230506085401.jpg",
manualRequest: 0,
},
],
picList: [],
page: 1, // 当前页数
pageSize: 10, // 每页数量
total: 0, //总条数
loading: false,
};
},
mounted(){
this.$set(this.formdata, "timeVal", [new Date(new Date().toLocaleDateString()).getTime(), new Date().getTime()]);
this.getSearchdy()
this.getPicData()
},
methods: {
//获取电压信息
getSearchdy(){
getSearchInfo({ type:1 }).then((res) => {
this.dyOptions = res.data.list;
this.formdata.dyVal = res.data.list[0].id
this.getSearchxl()
}).catch((err) => {});
},
//获取线路数据
getSearchxl(){
getSearchInfo({ type: 2, id: this.formdata.dyVal }).then((res) => {
this.xlOptions = res.data.list;
this.formdata.xlVal = res.data.list[0].id
this.getSearchgt()
}).catch((err) => {});
},
//获取杆塔数据
getSearchgt(){
getSearchInfo({ type: 3, id: this.formdata.xlVal }).then((res) => {
this.gtOptions = res.data.list;
this.formdata.gtVal = res.data.list[0].id
this.getSearchtd()
}).catch((err) => {});
},
//获取通道数据
getSearchtd(){
getSearchInfo({ type: 4, id: this.formdata.gtVal }).then((res) => {
this.tdOptions = res.data.list;
this.formdata.tdVal = res.data.list[0].id
}).catch((err) => {});
},
//获取图片列表
getPicData() {
this.loading = true;
this.$set(this.formdata, "pageindex", this.page);
this.$set(this.formdata, "pagesize", this.pageSize);
this.$set(this.formdata, "startTimeVal", this.formdata.timeVal[0]);
this.$set(this.formdata, "endTimeVal", this.formdata.timeVal[1]);
getPictureList(this.formdata)
.then((res) => {
this.picList = res.data.list;
this.total = res.data.total;
this.loading = false;
})
.catch((err) => {
console.log(err);
});
},
//查询
onSubmit() {
console.log("submit!");
this.getPicData()
},
//点击分页
handleCurrentChange(val) {
this.page = val;
this.getPicData()
},
//每页条数
handleSizeChange(val){
this.pageSize = val;
this.getPicData()
}
},
};
</script>

Write Preview
Loading…
Cancel
Save