Compare commits

...

2 Commits

3 changed files with 222 additions and 5 deletions

View File

@ -1,8 +1,24 @@
import request from '@/utils/request' import request from '@/utils/request'
// 首页、站点地图页面页面顶部 所有站点信息 // 站点列表
export function getSiteInfoList({siteName,startTime, endTime,pageSize,pageNum}) { export function getSiteInfoList({siteName,startTime, endTime,pageSize,pageNum}) {
return request({ return request({
url: `/ems/siteConfig/getSiteInfoList?siteName=${siteName}&startTime=${startTime}&endTime=${endTime}&pageSize=${pageSize}&pageNum=${pageNum}`, url: `/ems/siteConfig/getSiteInfoList?siteName=${siteName}&startTime=${startTime}&endTime=${endTime}&pageSize=${pageSize}&pageNum=${pageNum}`,
method: 'get' method: 'get'
}) })
} }
// 设备列表
export function getDeviceInfoList({siteId,pageSize,pageNum}) {
return request({
url: `/ems/siteConfig/getDeviceInfoList?siteId=${siteId}&pageSize=${pageSize}&pageNum=${pageNum}`,
method: 'get'
})
}
// 设备详情
export function getDeviceDetailInfo(deviceId) {
return request({
url: `/ems/siteConfig/getDeviceDetailInfo?deviceId=${deviceId}`,
method: 'get'
})
}

View File

@ -0,0 +1,197 @@
<template>
<div class="ems-dashboard-editor-container" style="background-color: #ffffff" v-loading="loading">
<el-form :inline="true" class="select-container">
<el-form-item label="站点选择">
<el-select v-model="siteId" placeholder="请选择换电站名称" :loading="loading" loading-text="正在加载数据">
<el-option :label="item.siteName" :value="item.siteId" v-for="(item,index) in siteList" :key="index+'zdxeSelect'"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSearch" native-type="button">搜索</el-button>
<el-button @click="onReset" native-type="button">重置</el-button>
</el-form-item>
</el-form>
<el-table
class="common-table"
:data="tableData"
stripe
max-height="600px"
style="width: 100%;margin-top: 25px">
<el-table-column
prop="siteId"
label="站点ID">
</el-table-column>
<el-table-column
prop="siteName"
label="站点名称">
</el-table-column>
<el-table-column
prop="deviceId"
label="设备ID"
>
</el-table-column>
<el-table-column
prop="deviceName"
label="设备名称">
</el-table-column>
<el-table-column
prop="deviceType"
label="设备类型">
</el-table-column>
<el-table-column
prop="communicationStatus"
label="通信状态">
<template slot-scope="scope">
<span>{{$store.state.ems.communicationStatusOptions[scope.row.communicationStatus]}}</span>
</template>
</el-table-column>
<el-table-column
fixed="right"
label="操作"
width="140">
<template slot-scope="scope">
<el-button
@click="toDetail(scope.row.deviceId)"
type="primary"
size="small">
查看详情
</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination
v-show="tableData.length>0"
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pageNum"
:page-size="pageSize"
:page-sizes="[10, 20, 30, 40]"
layout="total, sizes, prev, pager, next, jumper"
:total="totalSize"
style="margin-top:15px;text-align: center"
>
</el-pagination>
<el-dialog :visible.sync="dialogTableVisible" class="ems-dialog" title=" 详细信息" :close-on-click-modal="false" :before-close="handleClosed">
<div class="descriptions-main" style="padding: 0" >
<el-descriptions direction="vertical" :column="2" :colon="false" border>
<el-descriptions-item v-for="item in detailData" labelClassName="descriptions-label" contentClassName="descriptions-direction" :span="1" :label="item.label">{{item.value}}</el-descriptions-item>
</el-descriptions>
</div>
</el-dialog>
</div>
</template>
<script>
import {getDeviceInfoList,getDeviceDetailInfo} from'@/api/ems/site'
import {getAllSites} from '@/api/ems/zddt'
import {formatNumber} from "@/filters/ems";
export default {
name: "Sblb",
data() {
return {
loading:false,
searchLoading:false,
siteId:'',
siteList:[],
tableData:[],
pageSize:10,//分页栏当前每个数据总数
pageNum:1,//分页栏当前页数
totalSize:0,//table表格数据总数
dialogTableVisible:false,
detailData:[
{label:'设备ID',value:'',attr:'deviceId'},
{label:'设备名称',value:'',attr:'deviceName'},
{label:'设备类型',value:'',attr:'deviceType'},
{label:'通信状态',value:'',attr:'communicationStatus'},
{label:'TCP设备的IP地址',value:'',attr:'ipAddress'},
{label:'TCP端口号',value:'',attr:'ipPort'},
{label:'串口路径',value:'',attr:'serialPort'},
{label:'波特率',value:'',attr:'baudRate'},
{label:'数据位',value:'',attr:'dataBits'},
{label:'停止位',value:'',attr:'stopBits'},
{label:'校验位',value:'',attr:'parity'},
{label:'设备描述',value:'',attr:'description'},
{label:'设备类别',value:'',attr:'deviceCategory'},
{label:'上级设备ID',value:'',attr:'parentId'},
{label:'设备唯一标识符',value:'',attr:'deviceId'},
],
detailformatAttr:{
'deviceType':'deviceTypeOptions',
'communicationStatus':'communicationStatusOptions',
}
}
},
methods:{
handleClosed(done){
this.detailData.forEach((item)=>{item.value = ''})
done()
},
toDetail(deviceId){
this.loading = true
getDeviceDetailInfo(deviceId).then(response => {
const data = response?.data || {};
this.detailData.forEach(item=>{
if(this.detailformatAttr[item.attr]){
item.value=formatNumber(this.$store.state.ems[this.detailformatAttr[item.attr]][data[item.attr]]);
}else{
item.value=formatNumber(data[item.attr]);
}
})
this.dialogTableVisible = true
}).finally(() => {this.loading = false})
},
// 分页
handleSizeChange(val) {
this.pageSize = val;
this.$nextTick(()=>{
this.getData()
})
},
handleCurrentChange(val) {
this.pageNum = val
this.$nextTick(()=>{
this.getData()
})
},
// 搜索
onSearch(){
this.pageNum =1//每次搜索从1开始搜索
this.getData()
},
// 重置
onReset(){
this.siteId=''
this.pageNum =1//每次搜索从1开始搜索
this.getData()
},
// 获取数据
getData(){
this.loading=true
const {siteId,pageNum,pageSize} =this
getDeviceInfoList({siteId,pageNum,pageSize}).then(response => {
this.tableData=response?.rows || [];
this.totalSize = response?.total || 0
}).finally(() => {this.loading=false})
},
//获取站点列表
getZdList(){
this.searchLoading=true
getAllSites().then(response => {
this.siteList = response?.data || []
}).finally(() => {this.searchLoading=false})
}
},
mounted() {
this.onReset()
this.getZdList()
}
}
</script>
<style scoped lang="scss">
</style>

View File

@ -32,6 +32,10 @@
stripe stripe
max-height="500px" max-height="500px"
style="width: 100%;margin-top: 25px"> style="width: 100%;margin-top: 25px">
<el-table-column
prop="siteId"
label="站点ID">
</el-table-column>
<el-table-column <el-table-column
prop="siteName" prop="siteName"
label="站点名称"> label="站点名称">
@ -71,10 +75,10 @@
</template> </template>
<script> <script>
import {getSiteInfoList} from'@/api/ems/site' import {getSiteInfoList} from '@/api/ems/site'
import { formatDate } from '@/filters/ems' import { formatDate } from '@/filters/ems'
export default { export default {
name: "Site", name: "Zdlb",
data() { data() {
return { return {
loading:false, loading:false,
@ -97,13 +101,13 @@ export default {
handleSizeChange(val) { handleSizeChange(val) {
this.pageSize = val; this.pageSize = val;
this.$nextTick(()=>{ this.$nextTick(()=>{
this.getTableData() this.getData()
}) })
}, },
handleCurrentChange(val) { handleCurrentChange(val) {
this.pageNum = val this.pageNum = val
this.$nextTick(()=>{ this.$nextTick(()=>{
this.getTableData() this.getData()
}) })
}, },
// //