ncs_board_ssr/pages/index/index.vue

<template>
  <div>

    <div v-show="hasRegister">

      <el-dialog :visible.sync="showCalling" :modal="false" :show-close="false" style="margin-top: 40vh;">

        <div class="new-in">
          <div class="text-lg text-center padding  light" :class="callingShowClass" style="border-radius: 10px">{{ callingText }}</div>
        </div>

      </el-dialog>

      <div
        v-for="(floor,i) in screenConfig " :key="'screen'+i" v-show="stayIndex===(i+1)">
        <template v-if="i===0&&hasPatientInFirst">
          <transition-group tag="div" name="list">
            <div v-for="(item,index) in boardBedsInfo" :key="'subscreen'+index" v-show="bedInfoArrayIndex===index">

              <nest-component :tasks="floor" :bind-data="item"   :show="true"
              />
            </div>
          </transition-group>
        </template>
        <template v-else>
          <nest-component :tasks="floor" :bind-data="boardBedsInfoRaw"   :show="true"></nest-component>
        </template>
      </div>

    </div>
    <div v-show="!hasRegister" class="bg-gradual-purple light" style="height: 100vh">
     <el-empty :image-size="350" style="padding-top: 0" description="">
       <template slot="image">
       <svg height="300" node-id="1" sillyvg="true" template-height="300" template-width="300" version="1.1" viewBox="0 0 400 300" width="400" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs node-id="46"></defs><path d="M 282.50 294.41 C 282.50 295.83 245.56 296.98 200.00 296.98 C 154.44 296.98 117.50 295.83 117.50 294.41 C 117.50 292.99 154.44 291.84 200.00 291.84 C 245.56 291.84 282.50 292.99 282.50 294.41 Z" fill="#cddcff" fill-rule="nonzero" node-id="48" stroke="none" target-height="5.1400146" target-width="165" target-x="117.5" target-y="291.84"></path><path d="M 187.73 263.31 L 183.06 289.47 L 212.95 289.47 L 208.28 262.38 L 187.73 263.31 Z" fill="#cddcff" fill-rule="nonzero" node-id="50" stroke="none" target-height="27.089996" target-width="29.89" target-x="183.06" target-y="262.38"></path><path d="M 187.73 263.31 L 186.04 272.79 L 209.97 272.74 L 208.28 262.38 L 187.73 263.31 Z" fill="#9ca3b5" fill-rule="nonzero" node-id="52" stroke="none" target-height="10.410004" target-width="23.930008" target-x="186.04" target-y="262.38"></path><path d="M 172.78 286.20 L 223.23 286.20 C 225.55 286.20 227.43 288.08 227.43 290.40 L 227.43 290.41 C 227.43 292.73 225.55 294.61 223.23 294.61 L 172.78 294.61 C 170.46 294.61 168.58 292.73 168.58 290.41 L 168.58 290.40 C 168.58 288.08 170.46 286.20 172.78 286.20 Z" fill="#313849" fill-rule="nonzero" node-id="54" stroke="none" target-height="8.409973" target-width="58.84999" target-x="168.58" target-y="286.2"></path><path d="M 305.31 266.73 L 94.69 266.73 C 92.38 266.73 90.16 265.81 88.53 264.17 C 86.90 262.53 85.99 260.31 86.00 258.00 L 86.00 124.42 C 86.00 119.62 89.89 115.73 94.69 115.73 L 305.31 115.73 C 310.11 115.73 314.00 119.62 314.00 124.42 L 314.00 258.00 C 314.01 260.31 313.10 262.53 311.47 264.17 C 309.84 265.81 307.62 266.73 305.31 266.73 Z" fill="#f2f7ff" fill-rule="nonzero" node-id="56" stroke="none" target-height="151" target-width="228.02002" target-x="85.99" target-y="115.73"></path><path d="M 305.31 123.73 C 305.69 123.73 306.00 124.04 306.00 124.42 L 306.00 258.00 C 306.00 258.38 305.69 258.69 305.31 258.69 L 94.69 258.69 C 94.31 258.69 94.00 258.38 94.00 258.00 L 94.00 124.42 C 94.00 124.04 94.31 123.73 94.69 123.73 L 305.31 123.73 M 305.31 115.73 L 94.69 115.73 C 89.89 115.73 86.00 119.62 86.00 124.42 L 86.00 258.00 C 86.00 262.80 89.89 266.69 94.69 266.69 L 305.31 266.69 C 310.11 266.69 314.00 262.80 314.00 258.00 L 314.00 124.42 C 314.00 119.62 310.11 115.73 305.31 115.73 Z" fill="#30384a" fill-rule="nonzero" node-id="58" stroke="none" target-height="150.95999" target-width="228" target-x="86" target-y="115.73"></path><path d="M 183.61 135.51 L 295.27 135.51 L 295.27 172.84 L 183.61 172.84 Z" fill="#cddcff" fill-rule="nonzero" node-id="60" stroke="none" target-height="37.33" target-width="111.65999" target-x="183.61" target-y="135.51"></path><path d="M 183.61 181.34 L 295.27 181.34 L 295.27 245.73 L 183.61 245.73 Z" fill="#cddcff" fill-rule="nonzero" node-id="62" stroke="none" target-height="64.39" target-width="111.65999" target-x="183.61" target-y="181.34"></path><path d="M 108.24 197.27 L 164.07 197.27 L 164.07 203.06 L 108.24 203.06 Z" fill="#cddcff" fill-rule="nonzero" node-id="64" stroke="none" target-height="5.7899933" target-width="55.83001" target-x="108.24" target-y="197.27"></path><path d="M 108.24 207.47 L 164.07 207.47 L 164.07 213.26 L 108.24 213.26 Z" fill="#cddcff" fill-rule="nonzero" node-id="66" stroke="none" target-height="5.7899933" target-width="55.83001" target-x="108.24" target-y="207.47"></path><path d="M 108.24 217.66 L 164.07 217.66 L 164.07 223.45 L 108.24 223.45 Z" fill="#cddcff" fill-rule="nonzero" node-id="68" stroke="none" target-height="5.7899933" target-width="55.83001" target-x="108.24" target-y="217.66"></path><path d="M 108.24 227.86 L 144.67 227.86 L 144.67 233.65 L 108.24 233.65 Z" fill="#cddcff" fill-rule="nonzero" node-id="70" stroke="none" target-height="5.7899933" target-width="36.43" target-x="108.24" target-y="227.86"></path><path d="M 108.24 238.06 L 133.88 238.06 L 133.88 243.85 L 108.24 243.85 Z" fill="#cddcff" fill-rule="nonzero" node-id="72" stroke="none" target-height="5.7900085" target-width="25.640007" target-x="108.24" target-y="238.06"></path><path d="M 140.11 159.75 L 157.31 153.33 C 154.62 148.19 150.19 144.17 144.81 142.00 C 143.16 148.24 141.18 155.73 140.11 159.75 Z" fill="#cddcff" fill-rule="nonzero" node-id="74" stroke="none" target-height="17.75" target-width="17.199997" target-x="140.11" target-y="142"></path><path d="M 135.64 164.68 L 136.40 161.83 C 137.91 156.15 140.15 147.67 141.91 141.04 C 130.99 138.14 119.51 143.09 114.12 153.01 C 108.73 162.93 110.82 175.26 119.19 182.84 C 127.56 190.42 140.03 191.30 149.37 184.96 C 158.72 178.62 162.51 166.71 158.56 156.13 Z" fill="#3e5ccd" fill-rule="nonzero" node-id="76" stroke="none" target-height="53.160004" target-width="53.77999" target-x="108.73" target-y="138.14"></path><path d="M 192.04 165.15 L 191.68 164.22 L 218.82 153.64 L 240.76 161.77 L 279.27 142.89 L 290.59 139.74 L 290.85 140.70 L 279.62 143.82 L 240.82 162.85 L 218.83 154.71 L 192.04 165.15 Z" fill="#f2f7ff" fill-rule="nonzero" node-id="78" stroke="none" target-height="25.409988" target-width="99.17001" target-x="191.68" target-y="139.74"></path><g node-id="125"><path d="M 322.79 266.73 L 214.26 266.73 L 214.26 179.20 L 322.79 179.20 Z" fill="#313849" fill-opacity="0.1" fill-rule="nonzero" group-id="1" node-id="82" stroke="none" target-height="87.530014" target-width="108.530014" target-x="214.26" target-y="179.2"></path></g><path d="M 329.18 272.39 L 220.65 272.39 L 220.65 172.07 L 329.18 172.07 Z" fill="#f1f4ff" fill-rule="nonzero" node-id="85" stroke="none" target-height="100.32001" target-width="108.53" target-x="220.65" target-y="172.07"></path><path d="M 329.59 272.80 L 220.24 272.80 L 220.24 171.66 L 329.59 171.66 Z M 221.06 272.00 L 328.77 272.00 L 328.77 172.50 L 221.06 172.50 Z" fill="#30384a" fill-rule="nonzero" node-id="87" stroke="none" target-height="101.139984" target-width="109.34999" target-x="220.24" target-y="171.66"></path><path d="M 220.65 172.07 L 329.18 172.07 L 329.18 186.03 L 220.65 186.03 Z" fill="#ffffff" fill-rule="nonzero" node-id="89" stroke="none" target-height="13.959991" target-width="108.53" target-x="220.65" target-y="172.07"></path><path d="M 329.59 272.80 L 220.24 272.80 L 220.24 171.66 L 329.59 171.66 Z M 221.06 272.00 L 328.77 272.00 L 328.77 172.50 L 221.06 172.50 Z" fill="#30384a" fill-rule="nonzero" node-id="91" stroke="none" target-height="101.139984" target-width="109.34999" target-x="220.24" target-y="171.66"></path><path d="M 236.34 230.19 L 243.17 230.19 L 243.17 251.21 L 236.34 251.21 Z" fill="#cddcff" fill-rule="nonzero" node-id="93" stroke="none" target-height="21.020004" target-width="6.830002" target-x="236.34" target-y="230.19"></path><path d="M 250.72 215.01 L 257.55 215.01 L 257.55 251.21 L 250.72 251.21 Z" fill="#cddcff" fill-rule="nonzero" node-id="95" stroke="none" target-height="36.200012" target-width="6.8299866" target-x="250.72" target-y="215.01"></path><path d="M 265.11 209.18 L 271.94 209.18 L 271.94 251.21 L 265.11 251.21 Z" fill="#cddcff" fill-rule="nonzero" node-id="97" stroke="none" target-height="42.030014" target-width="6.830017" target-x="265.11" target-y="209.18"></path><path d="M 279.50 200.17 L 286.33 200.17 L 286.33 251.21 L 279.50 251.21 Z" fill="#cddcff" fill-rule="nonzero" node-id="99" stroke="none" target-height="51.04001" target-width="6.8299866" target-x="279.5" target-y="200.17"></path><path d="M 293.89 205.85 L 300.72 205.85 L 300.72 251.20 L 293.89 251.20 Z" fill="#cddcff" fill-rule="nonzero" node-id="101" stroke="none" target-height="45.34999" target-width="6.8299866" target-x="293.89" target-y="205.85"></path><path d="M 308.27 205.85 L 315.10 205.85 L 315.10 251.20 L 308.27 251.20 Z" fill="#cddcff" fill-rule="nonzero" node-id="103" stroke="none" target-height="45.34999" target-width="6.830017" target-x="308.27" target-y="205.85"></path><path d="M 239.77 240.44 L 239.17 239.65 L 254.09 228.45 L 268.47 235.87 L 297.08 214.11 L 297.19 214.09 L 311.58 210.84 L 311.80 211.82 L 297.52 215.04 L 268.57 237.05 L 254.19 229.62 L 239.77 240.44 Z" fill="#eb5068" fill-rule="nonzero" node-id="105" stroke="none" target-height="29.600006" target-width="72.62999" target-x="239.17" target-y="210.84"></path><path d="M 241.49 240.04 C 241.49 241.00 240.71 241.78 239.75 241.78 C 238.79 241.78 238.01 241.00 238.01 240.04 C 238.01 239.08 238.79 238.30 239.75 238.30 C 240.71 238.30 241.49 239.08 241.49 240.04 Z" fill="#eb5068" fill-rule="nonzero" node-id="107" stroke="none" target-height="3.4799957" target-width="3.480011" target-x="238.01" target-y="238.3"></path><path d="M 255.88 229.35 C 255.88 230.31 255.10 231.09 254.14 231.09 C 253.18 231.09 252.40 230.31 252.40 229.35 C 252.40 228.39 253.18 227.61 254.14 227.61 C 255.10 227.61 255.88 228.39 255.88 229.35 Z" fill="#eb5068" fill-rule="nonzero" node-id="109" stroke="none" target-height="3.4799957" target-width="3.480011" target-x="252.4" target-y="227.61"></path><path d="M 270.26 236.56 C 270.26 237.52 269.48 238.30 268.52 238.30 C 267.56 238.30 266.78 237.52 266.78 236.56 C 266.78 235.60 267.56 234.82 268.52 234.82 C 269.48 234.82 270.26 235.60 270.26 236.56 Z" fill="#eb5068" fill-rule="nonzero" node-id="111" stroke="none" target-height="3.4799957" target-width="3.480011" target-x="266.78" target-y="234.82"></path><path d="M 284.65 225.69 C 284.65 226.65 283.87 227.43 282.91 227.43 C 281.95 227.43 281.17 226.65 281.17 225.69 C 281.17 224.73 281.95 223.95 282.91 223.95 C 283.87 223.95 284.65 224.73 284.65 225.69 Z" fill="#eb5068" fill-rule="nonzero" node-id="113" stroke="none" target-height="3.4799957" target-width="3.4799805" target-x="281.17" target-y="223.95"></path><path d="M 299.04 214.53 C 299.04 215.49 298.26 216.27 297.30 216.27 C 296.34 216.27 295.56 215.49 295.56 214.53 C 295.56 213.57 296.34 212.79 297.30 212.79 C 298.26 212.79 299.04 213.57 299.04 214.53 Z" fill="#eb5068" fill-rule="nonzero" node-id="115" stroke="none" target-height="3.480011" target-width="3.480011" target-x="295.56" target-y="212.79"></path><path d="M 313.43 211.33 C 313.43 212.29 312.65 213.07 311.69 213.07 C 310.73 213.07 309.95 212.29 309.95 211.33 C 309.95 210.37 310.73 209.59 311.69 209.59 C 312.65 209.59 313.43 210.37 313.43 211.33 Z" fill="#eb5068" fill-rule="nonzero" node-id="117" stroke="none" target-height="3.480011" target-width="3.4799805" target-x="309.95" target-y="209.59"></path><path d="M 230.47 179.05 C 230.47 180.43 229.35 181.55 227.97 181.55 C 226.59 181.55 225.47 180.43 225.47 179.05 C 225.47 177.67 226.59 176.55 227.97 176.55 C 229.35 176.55 230.47 177.67 230.47 179.05 Z" fill="#eb5068" fill-rule="nonzero" node-id="119" stroke="none" target-height="5" target-width="5" target-x="225.47" target-y="176.55"></path><path d="M 239.47 179.05 C 239.47 180.43 238.35 181.55 236.97 181.55 C 235.59 181.55 234.47 180.43 234.47 179.05 C 234.47 177.67 235.59 176.55 236.97 176.55 C 238.35 176.55 239.47 177.67 239.47 179.05 Z" fill="#f7cc5c" fill-rule="nonzero" node-id="121" stroke="none" target-height="5" target-width="5" target-x="234.47" target-y="176.55"></path><path d="M 248.47 179.05 C 248.47 180.43 247.35 181.55 245.97 181.55 C 244.59 181.55 243.47 180.43 243.47 179.05 C 243.47 177.67 244.59 176.55 245.97 176.55 C 247.35 176.55 248.47 177.67 248.47 179.05 Z" fill="#58c398" fill-rule="nonzero" node-id="123" stroke="none" target-height="5" target-width="5" target-x="243.47" target-y="176.55"></path></svg>
       </template>
       <template slot="description">
      <div class="bullshit">
        <div class="text-lg text-blue ">这是一台新的看板设备,请在系统后台设置该设备所属的科室。</div>
        <div class="text-lg text-blue margin-top-sm">
          该设备识别号:<span class="text-red">{{ deviceMAC }}</span> ,设备ID号:<span class="text-red">{{ deviceId }}</span>
        </div>
        <div class="bullshit__info text-lg text-cyan margin-top-sm">如有其他疑问，请联系呼叫系统管理员。谢谢！</div>
      </div>
       </template>
     </el-empty>
    </div>

  </div>

</template>

<script>
    import * as API_Board from '@/api/board'
    import Storage from '@/utils/storage'
    import { mapActions } from 'vuex'
    const deviceUrl = process.env.deviceUrl
    /** 树形结构中查找指定Id节点 */
   import {findNodeById} from "../../utils/Foundation";
    import {getHospitalStatisticsCascader} from "@/api/board";

    export default {
        name: "index",
         beforeMount() {
            if (this.$route.query.mac !== undefined && this.$route.query.mac !== '') {
                // 保存mac地址
                this.$store.dispatch('saveDeviceMac', this.$route.query.mac)
                // 初始化websocket
                //  await this.initWebSocket()
                this.initWebSocket()
            }
             this.$nextTick(() => {
                 this.$nuxt.$loading.start()

             })
        },
        mounted(){
            const _this = this
           // 驱动动画
            setTimeout(_this.timeOutFun, 1000)

            // 检查socket连接
            setTimeout(_this.socketReconnect, 60000)

        },
        beforeUpdate(){
            this.$nuxt.$loading.finish()
        },
        async asyncData({app, params,store,route}) {

            store.dispatch('saveDeviceMac', route.query.mac)
            const deviceInfo = await API_Board.getDeviceInfo(route.query.mac)
            if(deviceInfo&&deviceInfo.part_id>0) {
                store.dispatch('savePartId', deviceInfo.part_id)
                store.dispatch('saveRegisterStatus', true)
                const datas = await Promise.all([
                    API_Board.getAllTitles(store.state.partId),
                    API_Board.getBedInfo(store.state.partId),
                    API_Board.getPartStatisticSummary(store.state.partId),
                    API_Board.getPartList(store.state.partId),
                    API_Board.getHospitalStatisticsCascader(store.state.partId),
                    API_Board.getPartManualInputList(store.state.partId)
                ])

                store.dispatch('savePartStatistics',{...datas[2]})
                store.dispatch('saveCustomBoardItems',[...datas[3]])
                store.dispatch('savePartStatisticSummary',[...datas[4]])
                store.dispatch('saveManualInputBoardItems',[...datas[5]])
                const boardTitles = [...datas[0]]
                let hasPatientInFirst=false
                let screenConfig = []
                let floorList = []
                let gridItemCount = 20
                if (boardTitles.length > 0) { // 渲染首屏
                    for (let j = 0; j < boardTitles.length; j++) {
                        const floorConfig = JSON.parse(boardTitles[j].content_config)
                        screenConfig.push(floorConfig)
                    }
                    floorList = JSON.parse(boardTitles[0].content_config)

                    for (let i = 0; i < boardTitles.length; i++) {
                        const gridConfig = findNodeById(JSON.parse(boardTitles[i].content_config), 5)
                        if (gridConfig) {
                            gridItemCount = parseInt(gridConfig.moduleConfig.gridCloumns) * parseInt(gridConfig.moduleConfig.gridRows)
                            hasPatientInFirst=true
                            break
                        }else{
                          hasPatientInFirst=false
                        }
                    }
                }

                const boardBedsInfoRaw = {...datas[1]}

                // let bedInfoArray = []
                let boardBedsInfo = []
                const screens = Math.ceil(datas[1]['items'].length / gridItemCount)
                for (var i = 1; i <= screens; i++) {
                    const beds = boardBedsInfoRaw.items.slice((i - 1) * gridItemCount, i * gridItemCount >= boardBedsInfoRaw.items.length
                        ? boardBedsInfoRaw.items.length : i * gridItemCount)
                    // bedInfoArray.push(beds)
                    boardBedsInfo.push({...boardBedsInfoRaw, items: beds})
                }

                return {boardTitles, screenConfig,boardBedsInfoRaw, floorList, gridItemCount, boardBedsInfo,hasPatientInFirst,hasRegister:true}
            }else{
                store.dispatch('savePartId', 0)
                store.dispatch('saveRegisterStatus', false)
                return {hasRegister:false}
            }
        },
        data(){
            return{
                hasRegister:this.$store.state.hasRegister==='true',
                deviceMAC: this.$route.query.mac,
                deviceId:'',
                showCalling:false,
                callingText:'123',
                intervalObj:null,
                callingShowClass:'',
                boardBedsInfoRaw:{},
                screenConfig:[],
                stayIndex: 1,
                // 当前显示的床位数据
                boardBedsInfo: [],
                hasPatientInFirst:false,
                // 自定义显示条目
                // boardItems: [],
                // 科室统计数据对象
                // partStatistic: {},//通过vuex传递
                // 每屏床位数
                gridItemCount: 28,
                // 床位二维数组
                bedInfoArray: [],
                floorList:[],
                // 首屏显示数据索引
                bedInfoArrayIndex: 0,
                staySeconds:[]
            }
        },
        methods:{
            timeOutFun() {
                this.swiperChange()
                setTimeout(this.timeOutFun, 1000)
            },

            socketReconnect() {
                if (this.websock === null || this.websock.readyState !== 1) {
                    this.initWebSocket()
                }
                setTimeout(this.socketReconnect, 60000)
            },

            getBoardTitles() {
                API_Board.getAllTitles(this.$store.state.partId).then(res => {
                    if(JSON.stringify([...res])!==JSON.stringify(this.boardTitles)){
                        this.boardTitles = [...res]
                        if (this.boardTitles.length > 0) { // 渲染首屏
                            for (let j = 0; j < this.boardTitles.length; j++) {
                                const floorConfig = JSON.parse(this.boardTitles[j].content_config)
                                this.screenConfig.push(floorConfig)
                            }
                            // this.floorList = JSON.parse(this.boardTitles[0].content_config)
                            for (let i = 0; i < this.boardTitles.length; i++) {
                                const gridConfig = findNodeById(JSON.parse(this.boardTitles[i].content_config), 5)
                                if (gridConfig) {
                                    this.gridItemCount = parseInt(gridConfig.moduleConfig.gridCloumns) * parseInt(gridConfig.moduleConfig.gridRows)
                                    break
                                }
                            }
                        }
                    }

                })
            },


            getPartStatisticSummary() {
                API_Board.getPartStatisticSummary(this.$store.state.partId).then(res => {
                    if(JSON.stringify({...res})!==JSON.stringify(this.partStatistic)){
                        // this.partStatistic = { ...res }
                        this.$store.dispatch('savePartStatistics',{...res})
                    }
                })
            },
            // 获取所有自定义看板项
            getCustomBoardItems() {
                API_Board.getPartList(this.$store.state.partId).then(res => {
                    if(JSON.stringify([...res])!==JSON.stringify(this.boardItems)){
                    // this.boardItems = [...res]
                        this.$store.dispatch('saveCustomBoardItems',[...res])
                    }
                })
            },
          // 获取所有手动输入看板项
            getPartManualInputlist() {
                API_Board.getPartManualInputList(this.$store.state.partId).then(res => {
                    if(JSON.stringify([...res])!==JSON.stringify(this.boardItems)){
                        // this.boardItems = [...res]
                        this.$store.dispatch('saveManualInputBoardItems',[...res])
                    }
                })
            },

          // 获取医院级科室级联统计数据
            getHospitalStatisticsCascader() {
                API_Board.getHospitalStatisticsCascader(this.$store.state.partId).then(res => {
                    if(JSON.stringify([...res])!==JSON.stringify(this.hospitalStatisticsCascader)){
                        // this.hospitalStatisticsCascader = [...res]
                        this.$store.dispatch('savePartStatisticSummary',[...res])
                    }
                })
            },

            // 切换屏幕
            swiperChange() {
                this.countTimes++
                let stayTimes = this.staySeconds[this.stayIndex - 1]
                // console.log('stayTimes',this.staySeconds)

                // console.log('count', this.countTimes)
                if (this.stayIndex === 1) {
                    stayTimes = this.staySeconds[this.stayIndex - 1] * this.boardBedsInfo.length
                }

                if (this.countTimes >= stayTimes) { // 切换屏幕
                    if (!this.fixedScreen) {
                        if (this.stayIndex === this.boardTitles.length) { // 到最后一屏了
                            this.bedInfoArrayIndex=0
                            this.stayIndex = 1
                            this.countTimes=0
                        } else {
                            this.stayIndex++
                        }
                        // if (this.boardTitles.length > 0) {
                        //     this.floorList = JSON.parse(this.boardTitles[this.stayIndex - 1]['content_config'])
                        // }
                    }
                    this.countTimes = 0
                }

                if (this.stayIndex === 1) { // 切换子项
                    if (this.countTimes % this.staySeconds[this.stayIndex - 1] === 0 && this.boardBedsInfo.length > 1) { // 子项页数大余1时才切换
                        // console.log('change', Math.floor(this.countTimes / this.staySeconds[this.stayIndex - 1]))
                        const mod = Math.floor(this.countTimes / this.staySeconds[this.stayIndex - 1])
                        this.bedInfoArrayIndex = mod >= this.boardBedsInfo.length ? 0 : mod
                        this.show = false
                        // this.boardBedsInfo = { ...this.boardBedsInfo, items: this.bedInfoArray[this.bedInfoArrayIndex] }
                        const _this = this
                        setTimeout(function() {
                            _this.show = true
                        }, 200)
                    }
                }

            },
            // 显示呼叫
            showCall(interactionVo) {
                // console.log('action', interactionVo)
                if (interactionVo.actionType === 'SOS') {
                    this.callingText = interactionVo.fromFrameFullName + '紧急呼叫'
                    this.callingShowClass = 'bg-red'
                } else if (interactionVo.actionType === 'EVENT') {
                    this.callingText = interactionVo.fromFrameFullName + '发送' + interactionVo.data + '事件'
                    this.callingShowClass = 'bg-blue'
                } else if (interactionVo.actionType === 'REINFORCE') {
                    this.callingText = interactionVo.fromFrameFullName + '请求增援'
                    this.callingShowClass = 'bg-blue'
                } else {
                    this.callingText = interactionVo.fromFrameFullName + '呼叫'
                    this.callingShowClass = 'bg-blue'
                }
                this.showCalling = true
                const _this = this
                clearTimeout(this.intervalObj)
                this.intervalObj = setTimeout(function() {
                    _this.showCalling = false
                }, 30000)
            },

            // 获取床位信息
            getBedInfo() {
                API_Board.getBedInfo(this.$store.state.partId).then(res => {

                    if(JSON.stringify({...res})!==JSON.stringify(this.boardBedsInfoRaw)){
                    let boardBedsInfoTmp=[]
                    this.boardBedsInfoRaw = { ...res }
                        const screens = Math.ceil(res['items'].length / this.gridItemCount)
                        for (var i = 1; i <= screens; i++) {
                            const beds = this.boardBedsInfoRaw.items.slice((i - 1) * this.gridItemCount, i * this.gridItemCount >= this.boardBedsInfoRaw.items.length
                                ? this.boardBedsInfoRaw.items.length : i * this.gridItemCount)
                            // this.bedInfoArray.push(beds)
                            boardBedsInfoTmp.push({ ...res, items: beds })
                        }
                    for (var i=0;i<boardBedsInfoTmp.length;i++){
                        if(!this.boardBedsInfo[i]||this.boardBedsInfo[i]&&JSON.stringify(this.boardBedsInfo[i])!==JSON.stringify(boardBedsInfoTmp[i])){
                            this.$set(this.boardBedsInfo,i,boardBedsInfoTmp[i])
                        }
                    }
                    // this.bedInfoArray = []
                    // this.boardBedsInfo = []



                    }
                    // this.boardBedsInfo = { ...res, items: this.bedInfoArray[0] }
                })
            },

            initWebSocket: function() {
                var stockbase = deviceUrl.replace('http', 'ws')
                this.websock = new WebSocket(stockbase + '/boardinfo/1/' + this.$store.state.mac)
                this.websock.onopen = this.websocketonopen
                this.websock.onerror = this.websocketonerror
                this.websock.onmessage = this.websocketonmessage
                this.websock.onclose = this.websocketclose
            },
            websocketonopen: function() {
                // console.log('WebSocket连接成功')
            },
            websocketonerror: function(e) {
                // console.log('WebSocket连接发生错误')
            },
            websocketonmessage: function(e) {
                const boardObj = JSON.parse(e.data)
                if (boardObj.partId !== undefined && boardObj.partId > 0) { // 返回了partid,说明设备已注册
                    if(this.$store.state.partId===0){ //后台首次设置科室，重载页面，让服务端渲染
                        location.reload()
                    }
                    if (boardObj.code !== undefined) {
                        // 把科室Id设置到store
                        this.hasRegister = true
                        this.$store.dispatch('saveRegisterStatus', true)
                        this.$store.dispatch('savePartId', boardObj.partId)
                        this.deviceId = boardObj.id
                         // this.getBoardTitles()
                        this.getBedInfo()
                        this.getPartStatisticSummary()
                        this.getCustomBoardItems()
                        this.getHospitalStatisticsCascader()
                        this.getPartManualInputlist()
                        if (boardObj.config !== null && boardObj.config !== '') {
                            const boardconfig = JSON.parse(boardObj.config)
                            this.staySeconds = boardconfig.staySeconds // 轮换时间间隔
                            if ('itemCountPerScreen' in boardconfig) {
                                this.itemCountPerScreen = boardconfig.itemCountPerScreen
                            }
                            // 是否固定屏幕
                            this.fixedScreen = boardconfig.stayIndex !== 0
                            if (this.fixedScreen) {
                                this.stayIndex = boardconfig.stayIndex
                            } else {
                                // 不是固定屏幕定时任务中计算 stayIndex 的值，这里判断 this.stayIndex === 0 说明还没有初始化。把this.stayIndex 设置为第一屏
                                if (this.stayIndex === 0) {
                                    this.stayIndex = 1
                                }
                            }
                            this.countTimes = 0
                            // if (Object.keys(this.boardData).length === 0) {
                            //   const _this = this
                            //   setTimeout(function() {
                            //     _this.$forceUpdate()
                            //   }, 2000)
                            // }
                            // console.log('stayIndex', this.stayIndex)
                        } else {
                            this.autoplay = true
                        }
                    } else if (boardObj.actionType !== undefined) { // 呼叫显示
                        this.showCall(boardObj)
                        this.getBoardTitles()
                        this.getBedInfo()
                        this.getPartStatisticSummary()
                        this.getCustomBoardItems()
                       this.getPartManualInputlist()
                    }
                } else if ('action' in boardObj) {
                    // console.log('register',this.hasRegister)
                    if(boardObj.action !== 'refresh'){
                        this.showCall(boardObj)
                    }

                } else if ('hidden_call' in boardObj) {
                    this.showCalling = false
                } else {
                    this.deviceId = boardObj.id
                    this.$store.dispatch('saveRegisterStatus', false)
                    this.hasRegister = false
                }

            },
            websocketclose: function(e) {
                // console.log('connection closed (' + e.code + ')')
            }
        }
    }
</script>

<style scoped>


  /deep/ .el-dialog__body{padding:0}
  .el-aside {
    text-align: center;
    color: #333;
    border-right: 2px solid #e6e6e6;
  }

  .new-in{}
  .new-in .text-gray{color:#777!important}
  .call-item {
    text-align: left;
    padding: 0 10px;
  }

  .padding-top-8 {
    padding-top: 8px;
  }

  .padding-bottom-8 {
    padding-bottom: 8px;
  }
  /deep/ .el-dialog{
    margin-top: 48vh;
    border-radius: 10px
  }
  /deep/ .el-dialog__header{
    display: none;
  }
 /deep/ .van-empty__description{
    line-height: 32px;
  }
  .list-move, /* 对移动中的元素应用的过渡 */

  .list-leave-active {
    /*transition: all 1s ease;*/
    animation:fadeout 0.2s ease
  }
  .list-enter-active{
    animation:fadein 1s ease
  }
  @keyframes fadeout{
    0%{opacity:1;}
    100%{opacity:0;}
  }
  @keyframes fadein{
    0%{opacity:0.5;}
    100%{opacity:1;}
  }
</style>