elkers
2025-01-25 659d9d31ab3420b5fde4ae76973c89279fd48834
src/views/screen/overView/index.vue
@@ -2,92 +2,14 @@
    <div class="dma-container">
        <div class="content">
            <div class="left">
                <div class="echarts-box">
                    <!-- <div class="echarts-title">压力监测</div> -->
                    <div class="titbox">
                        <img src="../../../assets/images/screen/irrigate/titbox.png" alt="" srcset="">
                        <span>压力监测</span>
                    </div>
                    <div id="pressure"></div>
                </div>
                <div  class="echarts-box">
                    <div class="titbox">
                        <img src="../../../assets/images/screen/irrigate/titbox.png" alt="" srcset="">
                        <span>流量监测</span>
                    </div>
                    <div id="entrance"></div>
                </div>
                <div  class="echarts-box">
                    <div class="titbox">
                        <img src="../../../assets/images/screen/irrigate/titbox.png" alt="" srcset="">
                        <span>水位监测</span>
                    </div>
                    <div id="analysis"></div>
                </div>
            </div>
            <div class="main">
                <div class="map">
                    <div class="map-img">
                        <img src="../../../assets/images/screen/overview/map.png">
                    </div>
                    <img class="circle" src="../../../assets/images/screen/overview/mini-circle.png"/>
                </div>
                <div class="table-box">
                    <el-table v-loading="loading" :data="landMassList" max-height="250px">
                        <el-table-column
                            v-for="(item, key, index) of tableHeader"
                            :prop="key.toString()"
                            :label="item"
                            :key="index"
                            align="center"
                        ></el-table-column>
                    </el-table>
                </div>
            </div>
            <!-- 右 ------------------------------------------ -->
            <div class="right">
                <!-- <div class="search">
                    <el-select v-model="pointId" filterable  placeholder="请选择监控点">
                        <el-option
                            v-for="(item,index) in pointList"
                            :key="index"
                            :label="item.pointName"
                            :value="item.id">
                        </el-option>
                    </el-select>
                    <el-button type="primary" class="search-btn" @click="searchPoint">搜 索</el-button>
                </div> -->
                <div id="alarm">
                    <div class="titbox">
                        <img src="../../../assets/images/screen/irrigate/titbox.png" alt="" srcset="">
                        <span>实时报警</span>
                    </div>
                    <div class="alarm-content">
                        <div v-for="(item,index) in alarmList" :key="index" class="alarm-item">
                            <div class="item-text">{{ item.description }}</div>
                            <div class="item-date">{{ item.createTimeView }}</div>
                        </div>
                    </div>
                    <div v-if="alarmList.length > 5" class="alarm-more">.........</div>
                </div>
                <div class="echarts-box">
                    <div class="titbox">
                        <img src="../../../assets/images/screen/irrigate/titbox.png" alt="" srcset="">
                        <span>频率监测</span>
                    </div>
                    <div id="flow"></div>
                </div>
                <div class="echarts-box">
                    <div class="titbox">
                        <img src="../../../assets/images/screen/irrigate/titbox.png" alt="" srcset="">
                        <span>设备监测</span>
                    </div>
                    <div id="liquidLevel"></div>
                </div>
            </div>
        </div>
    </div>