普通用户桥梁切换，数据更新

src/api/bridgeInfo.js

import request from '@/utils/request'
export function getUserAllResource(params) { // 用户所有信息
  return request({
    url: '/ajax/all/byUser',
    method: 'get',
    params
  })
}
export function getBridgeList(params) { // 用户所有桥梁
  return request({
    url: '/ajax/bridge/byUser',
  })
}
export function getServerInfo(params) { // 某个服务器
  return request({
    url: '/ajax/server/qo',
    method: 'get',
    params
  })
}
export function getDeviceInfo(params) { // 某个采集盒
  return request({
    url: '/ajax/device/qo',
    method: 'get',
    params
  })
}
// 报警信息
export function getDangerList(params) {
  return request({

src/components/DefaultPage/index.vue

<template>
  <div class="ev_content" v-show="show">
    <div class="notice_d" v-show="noResult">
      <div class="d_prompt">
        <p class="d_2">{{message2}}</p>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  props: {
    show: {
      type: Boolean,
      default: true
    },
    noResult: {
      type: Boolean,
      default: true
    },
    message2: {
      type: String,
      default: '没有相关数据'
    }
  }
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
  .ev_content{
    width: 100%;
    height: 42%;
    z-index: 11;
    padding:40px;
    box-sizing: border-box;
    display: flex;
    justify-content:center;
  }
  .d_prompt p{
    margin: 0;
    font-size: 0;
  }
  .d_prompt .d_2{
    height: auto;
    margin: 0 auto;
    word-break: break-word;
    font-size: 13px;
    color: #999999;
    text-align: center;
    margin-top: 10px;
  }
</style>

src/components/Marqueebox/index.vue

  <div>
    <el-dialog title="系统消息编辑" :visible.sync="dialogFormVisible">
      <el-form :model="formNotice" ref="formNotice" :rules="rules">
        <el-input type="textarea" v-model="formNotice.desc"></el-input>
        <el-input type="textarea" rows="6" maxlength="100" v-model="formNotice.desc" @input="limitFn"></el-input>
      </el-form>
      <div class="limit_num">还可以输入{{ableNum}}字</div>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="setNotice('formNotice')">确 定</el-button>
    <el-menu class="message-box" mode="horizontal">
      <div class="marquee_box">
        <span class="tit">系统公告：</span>
        <el-tooltip :content="formNotice.desc" placement="bottom-end" effect="dark">
        <el-tooltip placement="bottom-end" effect="dark">
          <div slot="content" class="popper-tips">{{formNotice.desc}}</div>
          <div class="marquee_text">{{formNotice.desc}}</div>
        </el-tooltip>
        <span class="btn-span" v-if="isShow" @click="openNoticeDialog">设置</span>
  data() {
    return {
      dialogFormVisible: false,
      animate: true,
      ableNum: 100,
      formNotice: {
        desc: ''
      },
    this.getNotice()
  },
  methods: {
    limitFn() {
      this.ableNum = 100 - this.formNotice.desc.length
    },
    getNotice() {
      getNotice().then(res => {
        if (res.success) {
          this.formNotice.desc = res.data
          this.limitFn()
        }
      })
    },
      cursor: pointer;
    }
  }
  .anim{
    transition: all 0.5s;
  }
}
.el-textarea .el-textarea__inner{
  height: 160px;
.limit_num{
  font-size: 14px;
  color: #ff0000;
  text-align: right;
}
.popper-tips{
  font-size:14px;
  line-height: 20px;
  display:block;
  max-width: 500px;
  word-break: break-all;
}
</style>

src/router/index.js

    component: Layout,
    redirect: '/dashboard',
    hidden: true,
    meta: { noCache: true },
    children: [{
      path: 'dashboard',
      component: () => import('@/views/dashboard'),
                path: 'dangerDetail',
                name: 'dangerDetail',
                component: () => import('@/views/bridgesConsole/bridgeDanger/dangerDetail'),
                meta: { title: '报警信息浏览' }
                meta: { title: '报警信息浏览', noCache: true }
              }
            ]
          },
            meta: {
              title: '历史监测信息查询',
              roles: ['0'],
              noCache: true }
              noCache: true
            }
          }
        ]
      }

src/utils/queryInfo.js

import request from '@/utils/request'
/*eslint one-var: ["error", { "initialized": "always", "uninitialized": "never" }]*/
var serverList = [],
  deviceList = [],
  transducerList = [],
  queryAllInfo = function() {
    request({
      url: '/ajax/all/byUser',
      method: 'get',
      params: {
        active: 1
      }
    }).then(res => {
      if (res.success) {
        serverList = res.data.server
        deviceList = res.data.device
        transducerList = res.data.transducer
      }
    })
  },
  queryServers = function(bid, flag) {
    const obj = serverList
    /*eslint one-var: ["error", { "initialized": "always", "uninitialized": "never" }]*/
    var servers = [], serverSeqArr = []
    for (let i = 0; i < obj.length; ++i) {
      if (bid === obj[i].bridgeId) {
        servers.push(obj[i])
        serverSeqArr.push(obj[i].seq)
      }
    }
    return flag ? serverSeqArr : servers
  },
  queryDevices = function(bid) {
    var devices = []
    for (let i = 0; i < serverList.length; ++i) {
      if (bid === serverList[i].bridgeId) {
        for (let j = 0; j < deviceList.length; ++j) {
          if (serverList[i].id === deviceList[j].serverId) {
            deviceList[j].serverCode = serverList[i].code
            devices.push(deviceList[j])
          }
        }
      }
    }
    return devices
  },
  queryTrans = function(bid) {
    var trans = []
    for (let i = 0; i < serverList.length; ++i) {
      if (bid === serverList[i].bridgeId) {
        for (let j = 0; j < deviceList.length; ++j) {
          for (let m = 0; m < transducerList.length; ++m) {
            if (serverList[i].id === transducerList[m].serverId) {
              transducerList[m].deviceCode = deviceList[j].code
              trans.push(transducerList[m])
            }
          }
        }
      }
    }
    return trans
  },
  ret = {
    queryAllInfo: queryAllInfo,
    queryServers: queryServers,
    queryDevices: queryDevices,
    queryTrans: queryTrans
  }
export default ret

src/views/bridgesConsole/bridgeDanger/dangerList.vue

      <div slot="header" class="block-title">
        <span>报警信息</span>
      </div>
      <ul class="item-ul">
      <ul class="item-ul" v-if="dangerList.length">
        <li :class="!item.readed ? 'readed-li' : ''" v-for="item in dangerShowList" :key="item.index" @click="alarmShow(item.aid, item.device)">
          <span>{{item.alarmTime}}</span>
          <span>{{item.device}}，请点击查看。</span>
          </span>
        </li>
      </ul>
      <DefaultPage v-if="!dangerList.length"></DefaultPage>
      <div class="pagination-container">
        <el-pagination
          background
          :current-page.sync="pageNo"
          :page-size="pageSize"
          layout="prev, pager, next, jumper"
          :total="total">
          :total="dangerList.length">
        </el-pagination>
      </div>
    </el-card>
<script>
import queryInfo from '@/utils/queryInfo'
import Cookies from 'js-cookie'
import { parseTime } from '@/utils'
import { getDangerList } from '@/api/bridgeInfo'
import DefaultPage from '@/components/DefaultPage'
export default {
  props: {
    bridgeName: {
      type: String
    }
  components: {
    DefaultPage
  },
  data() {
    return {
      bridgeId: '',
      bridgeName: '',
      dangerList: [],
      total: 0,
      pageSize: 4,
      pageNo: 1
    }
    }
  },
  created() {
    this.getDangerList()
    this.bridgeId = Cookies.get('bridgeId')
    this.bridgeName = Cookies.get('bridgeName')
    this.serverSeqArr = queryInfo.queryServers(this.bridgeId, true)
    if (this.serverSeqArr) {
      this.getDangerList(this.serverSeqArr)
    }
  },
  methods: {
    getDangerList() {
    getDangerList(arr) {
      const param = {
        seq: arr,
        pageSize: 18,
        pageNo: 1
      }

src/views/bridgesConsole/bridgeDanger/index.vue

<template>
  <div>
    <router-view :bridgeName="bridgeName"></router-view>
    <router-view></router-view>
  </div>
</template>
<script>
import '@/styles/roleuser.scss'
import Cookies from 'js-cookie'
export default {
  data() {
    return {
      bridgeName: ''
    }
  },
  created() {
    this.bridgeName = Cookies.get('bridgeName')
  }
}
</script>

src/views/bridgesConsole/bridgeDetail/components/BInfoDialog01.vue

        </el-col>
        <el-col :xs="10" :sm="10" :lg="10">
          <div style="width:100%">
            <img :src="'/data/bridge'+ dataInfo.img" :alt="dataInfo.shortName" width="90%">
            <img :src="'/data/bridge'+ dataInfo.img" :alt="dataInfo.shortName" width="100%">
          </div>
        </el-col>
        <el-col :span="24" v-if="dataInfo.descp">

src/views/bridgesConsole/bridgeDetail/components/BInfoDialog02.vue

<template>
  <el-dialog title="采集服务器信息" :visible.sync="dialogTableVisible" :width="dialogW">
    <el-form class="form-main">
      <el-row :gutter="16">
      <el-row :gutter="16" v-if="serverList.length">
        <el-col :xs="12" :sm="12" :lg="12" v-for="item in serverShowList" :key="item.index">
          <div class="list-item">
            <el-row>
          </div>
        </el-col>
      </el-row>
      <DefaultPage v-if="!serverList.length"></DefaultPage>
      <div class="pagination-container">
        <el-pagination
          background
<script>
import './style.scss'
import DefaultPage from '@/components/DefaultPage'
import queryInfo from '@/utils/queryInfo'
export default {
  props: {
    serverList: {
      type: Array
    }
  components: {
    DefaultPage
  },
  data() {
    return {
      serverList: [],
      dialogW: '',
      bridgeId: '',
      bridgeName: '',
      dialogTableVisible: false,
      pageSize: 4,
    }
  },
  created() {
    this.bridgeId = this.$parent.bridgeId
    this.bridgeName = this.$parent.bridgeName
    this.dialogW = this.$parent.dialogW
    this.serverList = queryInfo.queryServers(this.bridgeId)
  },
  computed: {
    serverShowList() {

src/views/bridgesConsole/bridgeDetail/components/BInfoDialog03.vue

<template>
  <el-dialog title="采集盒信息" :visible.sync="dialogTableVisible" :width="dialogW">
    <el-form class="form-main">
      <el-row :gutter="16">
      <el-row :gutter="16" v-if="deviceList.length">
        <el-col :xs="12" :sm="12" :lg="12" v-for="item in deviceShowList" :key="item.index">
          <div class="list-item">
            <el-row>
          </div>
        </el-col>
      </el-row>
      <DefaultPage v-if="!deviceList.length"></DefaultPage>
      <div class="pagination-container">
        <el-pagination
          background
<script>
import './style.scss'
import DefaultPage from '@/components/DefaultPage'
import queryInfo from '@/utils/queryInfo'
export default {
  props: {
    deviceList: {
      type: Array
    }
  components: {
    DefaultPage
  },
  data() {
    return {
      dialogW: '',
      deviceList: [],
      bridgeId: '',
      dialogTableVisible: false,
      pageSize: 4,
      pageNo: 1
    }
  },
  created() {
    this.bridgeId = this.$parent.bridgeId
    this.dialogW = this.$parent.dialogW
    this.deviceList = queryInfo.queryDevices(this.bridgeId)
  },
  computed: {
    deviceShowList() {

src/views/bridgesConsole/bridgeDetail/components/BInfoDialog04.vue

<template>
  <el-dialog title="传感器信息" :visible.sync="dialogTableVisible" :width="dialogW">
    <el-form class="form-main">
      <el-row :gutter="16">
      <el-row :gutter="16" v-if="transducerList.length">
        <el-col :xs="12" :sm="12" :lg="12" v-for="item in transducerShowList" :key="item.index">
          <div class="list-item">
            <el-row>
          </div>
        </el-col>
      </el-row>
      <DefaultPage v-if="!transducerList.length"></DefaultPage>
      <div class="pagination-container">
        <el-pagination
          background
<script>
import './style.scss'
import DefaultPage from '@/components/DefaultPage'
import queryInfo from '@/utils/queryInfo'
export default {
  props: {
    transducerList: {
      type: Array
    }
  components: {
    DefaultPage
  },
  data() {
    return {
      dialogW: '',
      bridgeId: '',
      transducerList: [],
      childCableMain: [],
      childAddr: [],
      dialogTableVisible: false,
    this.childCableMain = this.$parent.cableMain
    this.childAddr = this.$parent.addr
    this.dialogW = this.$parent.dialogW
    this.bridgeId = this.$parent.bridgeId
    this.transducerList = queryInfo.queryTrans(this.bridgeId)
  },
  computed: {
    transducerShowList() {

src/views/bridgesConsole/bridgeDetail/index.vue

<template>
  <div class="dashboard-editor-container">
    <BInfoDialog01 ref="BInfoDialog01"></BInfoDialog01>
    <BInfoDialog02 ref="BInfoDialog02" :serverList="serverList"></BInfoDialog02>
    <BInfoDialog03 ref="BInfoDialog03" :deviceList="deviceList"></BInfoDialog03>
    <BInfoDialog04 ref="BInfoDialog04" :transducerList="transducerList"></BInfoDialog04>
    <BInfoDialog02 ref="BInfoDialog02"></BInfoDialog02>
    <BInfoDialog03 ref="BInfoDialog03"></BInfoDialog03>
    <BInfoDialog04 ref="BInfoDialog04"></BInfoDialog04>
    <updatePersonInfo ref="updatePersonInfo"></updatePersonInfo>
    <updateLoginPwd ref="updateLoginPwd"></updateLoginPwd>
            <span>报警信息</span>
            <el-button type="text" @click="queryDangerInfo">查看全部</el-button>
          </div>
          <ul class="item-ul">
          <ul class="item-ul" v-if="dangerList.length">
            <li :class="!item.readed ? 'readed-li' : ''" v-for="item in dangerList" :key="item.index" @click="alarmShow(item.aid, item.device)">
              <span>{{item.alarmTime}}</span>
              <span>{{item.device}}，请点击查看。</span>
              </span>
            </li>
          </ul>
          <DefaultPage v-if="!dangerList.length"></DefaultPage>
        </el-card>
        <el-card class="box-card block-group">
          <div slot="header" class="block-title">
            <span>实时监测</span>
          </div>
          <el-row class="line-chart-box">
          <el-row class="line-chart-box" v-if="monitorList.length">
            <el-col :xs="24" :sm="24" :lg="24" v-for="item in monitorShowList" :key="item.index">
              <lineChart2 :chartData="item"></lineChart2>
            </el-col>
          </el-row>
          <DefaultPage v-if="!monitorList.length"></DefaultPage>
          <div class="pagination-container">
            <el-pagination
              background
<script>
import '@/styles/roleuser.scss'
import Cookies from 'js-cookie'
import { parseTime, turnTime } from '@/utils'
import { getUserAllResource, getDangerList, getTimingMonitor, getServerInfo, getDeviceInfo } from '@/api/bridgeInfo'
import queryInfo from '@/utils/queryInfo'
import { urlParse, parseTime, turnTime } from '@/utils'
import { getDangerList, getTimingMonitor } from '@/api/bridgeInfo'
import { mainCable, location, provinceCityDistrict } from '@/api/numberDictionary'
import lineChart2 from '../lineChart/LineChart2'
import updatePersonInfo from './components/updatePersonInfo'
import updateLoginPwd from './components/updateLoginPwd'
import DefaultPage from '@/components/DefaultPage'
export default {
  name: 'dashboard-other',
  components: {
    BInfoDialog03,
    BInfoDialog04,
    updatePersonInfo,
    updateLoginPwd
    updateLoginPwd,
    DefaultPage
  },
  data() {
    return {
      dialogW: '880px',
      bridgeId: '',
      bridgeName: '',
      dialogW: '860px',
      citys: [],
      cableMain: [],
      addr: [],
      dangerList: '',
      bridgeList: [],
      serverList: [],
      serverSeqArr: [],
      deviceList: [],
      transducerList: [],
      monitorList: [],
      currentNo: 1,
      currentSize: 4,
    }
  },
  created() {
    this.bridgeId = Cookies.get('bridgeId')
    this.bridgeName = Cookies.get('bridgeName')
    if (urlParse('id')) {
      this.bridgeId = urlParse('id')
      this.bridgeName = urlParse('name')
    } else {
      this.bridgeId = Cookies.get('bridgeId')
      this.bridgeName = Cookies.get('bridgeName')
    }
    this.getDictoryData()
    this.getUserAllResource()
    this.getDangerList()
    if (this.bridgeId) {
      this.serverSeqArr = queryInfo.queryServers(this.bridgeId, true)
      if (this.serverSeqArr.length) {
        this.getTimingMonitor(this.serverSeqArr)
        this.getDangerList(this.serverSeqArr)
      }
    }
    // setInterval(() => {
    //   this.addData(true)
    //   this.getTimingMonitor()
    // }, 60000)
  },
  methods: {
    getDangerList() {
    getDangerList(arr) {
      const param = {
        seq: arr,
        pageSize: 5,
        pageNo: 1
      }
        }
      })
    },
    getUserAllResource() {
      var _this = this
    getTimingMonitor(arr) {
      var that = this
      const param = {
        active: 1
        seq: arr
      }
      getUserAllResource(param).then(res => {
        if (res.success) {
          res.data.bridge.map((value, index, array) => {
            if (value.id === _this.bridgeId) {
              _this.bridgeName = value.shortName
            }
          })
          res.data.server.map((value, index, array) => {
            if (value.bridgeId === _this.bridgeId) {
              _this.serverList.push(value)
              _this.serverSeqArr.push(value.seq)
              _this.$forceUpdate()
              res.data.device.map((value2, index2, array2) => {
                if (value2.serverId === value.id) {
                  getServerInfo({ id: value2.serverId }).then(res => {
                    if (res.success && res.data) {
                      value2.serverCode = res.data.code
                      _this.$forceUpdate()
                    }
                  })
                  _this.deviceList.push(value2)
                  res.data.transducer.map((value3, index3, array3) => {
                    if (value3.serverId === value.id) {
                      getDeviceInfo({ id: value3.deviceId }).then(res => {
                        if (res.success && res.data) {
                          value3.deviceCode = res.data.code
                          _this.$forceUpdate()
                        }
                      })
                      _this.transducerList.push(value3)
                    }
                  })
                }
              })
            }
          })
          _this.getTimingMonitor()
        }
      })
    },
    getTimingMonitor() {
      var that = this
      const arr = this.serverSeqArr
      if (arr) {
        const param = {
          seq: arr
        }
        getTimingMonitor(param).then(res => {
          if (res.success && res.data) {
            var monitorList = []
            for (let i = 0; i < res.data.length; i++) {
              var str = res.data[i].cid
              var monitorData = null
              for (let j = 0; j < monitorList.length; ++j) {
                if (str === monitorList[j].tit) {
                  monitorData = monitorList[j]
                  break
                }
      getTimingMonitor(param).then(res => {
        if (res.success && res.data) {
          var monitorList = []
          for (let i = 0; i < res.data.length; i++) {
            var str = res.data[i].cid
            var monitorData = null
            for (let j = 0; j < monitorList.length; ++j) {
              if (str === monitorList[j].tit) {
                monitorData = monitorList[j]
                break
              }
              if (!monitorData) {
                monitorData = {
                  xData: [],
                  seData: {
                    max: [],
                    min: []
                  }
            }
            if (!monitorData) {
              monitorData = {
                xData: [],
                seData: {
                  max: [],
                  min: []
                }
                monitorList.push(monitorData)
                monitorData.tit = str
                that.addData()
              }
              monitorData.xData.push(that.dateArr)
              monitorData.seData.max.push(res.data[i].hvalue)
              monitorData.seData.min.push(res.data[i].lvalue)
              monitorList.push(monitorData)
              monitorData.tit = str
              that.addData()
            }
            that.monitorList = monitorList
            monitorData.xData.push(that.dateArr)
            monitorData.seData.max.push(res.data[i].hvalue)
            monitorData.seData.min.push(res.data[i].lvalue)
          }
        })
      }
          that.monitorList = monitorList
        }
      })
    },
    getDictoryData() {
      mainCable().then(response => {
      this.$router.push({ name: 'dangerList' })
    },
    queryMonitorInfo() {
      this.$router.push({
        name: 'bridgeMonitor',
        query: { arr: this.serverSeqArr }
      })
      this.$router.push({ name: 'bridgeMonitor' })
    },
    queryBirdgeInfo() {
      this.$refs.BInfoDialog01.dialogTableVisible = true

src/views/bridgesConsole/bridgeMonitor/index.vue

          </el-date-picker>
          <el-button type="primary" @click="getMonitorByDay">查询</el-button>
      </div>
      <el-row class="line-chart-box">
      <el-row class="line-chart-box" v-if="alarmList.length">
        <el-col :xs="24" :sm="24" :lg="24" v-for="item in alarmShowList" :key="item.index">
          <lineChart2 :chartData="item"></lineChart2>
        </el-col>
      </el-row>
      <DefaultPage v-if="!alarmList.length"></DefaultPage>
      <div class="pagination-container">
        <el-pagination
          background
<script>
import '@/styles/roleuser.scss'
import { urlParse, parseTime } from '@/utils'
import { Message } from 'element-ui'
import Cookies from 'js-cookie'
import queryInfo from '@/utils/queryInfo'
import { parseTime } from '@/utils'
import { getMonitorByDay } from '@/api/bridgeInfo'
import lineChart2 from '../lineChart/LineChart2'
import DefaultPage from '@/components/DefaultPage'
export default {
  data() {
    return {
      bridgeId: '',
      valueDate: new Date().toISOString().substring(0, 10).replace(/-/g, ''),
      serverSeqArr: [],
      alarmList: [],
    }
  },
  components: {
    lineChart2
    lineChart2,
    DefaultPage
  },
  computed: {
    alarmShowList() {
    }
  },
  created() {
    this.serverSeqArr = urlParse('arr')
    this.getMonitorByDay()
    this.bridgeId = Cookies.get('bridgeId')
    this.serverSeqArr = queryInfo.queryServers(this.bridgeId, true)
    if (this.serverSeqArr.length) {
      this.getMonitorByDay(this.serverSeqArr)
    }
  },
  methods: {
    getMonitorByDay() {
    getMonitorByDay(arr) {
      var that = this
      const arr = this.serverSeqArr
      if (arr) {
        var date = that.valueDate
        var param = {
          seq: arr,
          day: date
        }
        getMonitorByDay(param).then(res => {
          if (res.success && res.data) {
            var monitorList = []
            for (let i = 0; i < res.data.length; i++) {
              var str = res.data[i].cid
              var monitorData = null
              for (let j = 0; j < monitorList.length; ++j) {
                if (str === monitorList[j].tit) {
                  monitorData = monitorList[j]
                  break
                }
      var date = that.valueDate
      var param = {
        seq: arr,
        day: date
      }
      getMonitorByDay(param).then(res => {
        if (res.success && res.data) {
          var monitorList = []
          for (let i = 0; i < res.data.length; i++) {
            var str = res.data[i].cid
            var monitorData = null
            for (let j = 0; j < monitorList.length; ++j) {
              if (str === monitorList[j].tit) {
                monitorData = monitorList[j]
                break
              }
              if (!monitorData) {
                monitorData = {
                  xData: [],
                  seData: {
                    max: [],
                    min: []
                  }
            }
            if (!monitorData) {
              monitorData = {
                xData: [],
                seData: {
                  max: [],
                  min: []
                }
                monitorList.push(monitorData)
                monitorData.tit = str
              }
              monitorData.xData.push(parseTime(res.data[i].ctime, true, true))
              monitorData.seData.max.push(res.data[i].hvalue)
              monitorData.seData.min.push(res.data[i].lvalue)
              monitorList.push(monitorData)
              monitorData.tit = str
            }
            that.alarmList = monitorList
            monitorData.xData.push(parseTime(res.data[i].ctime, true, true))
            monitorData.seData.max.push(res.data[i].hvalue)
            monitorData.seData.min.push(res.data[i].lvalue)
          }
        })
      } else {
        Message.error('当前没有任何采集服务器，请检查')
      }
          that.alarmList = monitorList
        }
      })
    },
    changeDate(val) {
      this.valueDate = val

src/views/dashboard/other/index.vue

<script>
import {
  getBridgeServers,
  getBridgeList,
  getBridgeUnread
} from '@/api/bridgeInfo'
import '@/styles/roleuser.scss'
import Cookies from 'js-cookie'
import queryInfo from '@/utils/queryInfo'
export default {
  data() {
      total: 0,
      pageSize: 10,
      pageNo: 1,
      dataList: [],
      bridgeList: [],
      serverList: [],
      serverSeqArr: [],
      deviceList: [],
      transducerList: []
      dataList: []
    }
  },
  created() {
    queryInfo.queryAllInfo()
    this.getBridgeLists()
  },
  components: {
  },
  methods: {
    getBridgeLists() {
      const param = {
      }
      getBridgeList(param).then(res => {
        if (res.success) {
          if (res.data.data.length > 0) {
          var $data = res.data.data
          if ($data.length > 0) {
            this.total = res.data.total
            this.getBridgeServers(res.data.data)
            for (let i = 0; i < $data.length; i++) {
              var svrs = queryInfo.queryServers($data[i].id, true)
              this.getBridgeUnread($data[i], svrs)
            }
            this.dataList = $data
          }
        }
      })
    },
    getBridgeServers($data) {
      var that = this
      for (let i = 0; i < $data.length; i++) {
        (function(i) {
          const param = {
            active: 1,
            id: $data[i].id
          }
          getBridgeServers(param).then(res => {
            if (res.success) {
              var serverSeqArr = []
              if (res.data.length > 0) {
                for (let j = 0; j < res.data.length; j++) {
                  serverSeqArr.push(res.data[j].seq)
                }
                that.getBridgeUnread($data[i], serverSeqArr)
              }
            }
          })
        })(i)
      }
      this.dataList = $data
    },
    getBridgeUnread($data, $arr) {
    getBridgeUnread($data, svrs) {
      var that = this
      const param = {
        server: $arr
      }
      var alarmNum = 0
      getBridgeUnread(param).then(res => {
        if (res.success) {
          if (res.data.length > 0) {
            for (let j = 0; j < res.data.length; j++) {
              alarmNum += res.data[j].num
      if (svrs.length) {
        getBridgeUnread({ server: svrs }).then(res => {
          if (res.success) {
            if (res.data.length > 0) {
              for (let j = 0; j < res.data.length; j++) {
                alarmNum += res.data[j].num
              }
              $data.alarmNum = alarmNum
              that.$forceUpdate()
            }
            $data.alarmNum = alarmNum
            that.$forceUpdate()
          }
        }
      })
        })
      }
    },
    goToDashboardC(id, name) {
      this.$router.push({ name: 'bridgeHome' })

src/views/layout/components/TopNavbar.vue

          {{showName ? showName : '选择桥梁'}}<i class="el-icon-arrow-down el-icon--right"></i>
        </span>
        <el-dropdown-menu class="drop-menu-list" style="min-width:120px;" slot="dropdown">
          <el-dropdown-item v-for="(item,index) in dataList" :key="item.index" :disabled="item.disab" @click.native="goToDashboardC(index, item.id, item.shortName)">{{item.shortName}}
          <el-dropdown-item v-for="item in dataList" :key="item.index" :disabled="item.disab" @click.native="goToDashboardC(item.id, item.shortName)">{{item.shortName}}
            <i v-if="item.disab" class="el-icon-check"></i>
          </el-dropdown-item>
        </el-dropdown-menu>
  },
  watch: {
    '$route'(to, from) {
      if (this.$route.path === '/') {
      if (to.path === '/dashboard') {
        this.showName = ''
      } else {
        this.bridgeId = Cookies.get('bridgeId')
        }
      })
    },
    goToDashboardC(index, id, name) {
      this.$router.push({ name: 'bridgeDetail' })
      this.dataList[index].disab = true
    goToDashboardC(id, name) {
      this.showName = name
      Cookies.set('bridgeId', id)
      Cookies.set('bridgeName', name)
      this.$router.push({
        name: 'bridgeDetail',
        query: { id: id, name: name }
      })
    }
  }
}