fix:修改返回菜单按钮

web

2025-03-25 0ba6a10aed87c4f05d076ee66c3189627bb5b858

 src/views/screen/flow/home/index.vue

@@ -2,17 +2,17 @@
    <div class="home">
        <div class="home-bg"></div>
        <div class="home-c">
            <div class="point">
            <div class="point" v-for="(item, index) in pointList" :key="index" :style="{left: item.left, top: item.top}">
                <div class="point-address"></div>
                <div class="point-message">
                    <div class="video-box">
                        <el-icon><VideoPlay /></el-icon>
                    </div>
                    <div class="info-box">
                        <div class="info-t">水电站流量监测点</div>
                        <div class="info-sw">水位：<span>500</span>m</div>
                        <div class="info-ls">流速：<span>15</span>m/s</div>
                        <div class="info-ssls">瞬时流速：<span>150</span>m/s</div>
                        <div class="info-t">{{ item.name }}</div>
                        <div class="info-sw">水位：<span>{{ item.shuiwei }}</span>m</div>
                        <div class="info-ls">流速：<span>{{item.liushu}}</span>m/s</div>
                        <div class="info-ssls">瞬时流速：<span>{{ item.ssls }}</span>m/s</div>
                        <div class="info-ljll">
                            累计流量：
                            <el-select
@@ -23,13 +23,13 @@
                                style="width: 240px"
                            >
                                <el-option
                                    v-for="(item, idx) in liuliangOptions"
                                    v-for="(item, idx) in item.liuliangOptions"
                                    :key="idx"
                                    :label="item.label"
                                    :value="idx"
                                />
                            </el-select>
                            <span>{{ liuliangOptions[selectll].value }}</span>m/s
                            <span>{{ item.liuliangOptions[selectll].value }}</span>m/s
                        </div>
                    </div>
                </div>
@@ -40,17 +40,29 @@


<script setup>

import {ref} from "vue";

const selectll = ref(0)

const liuliangOptions = [
const pointList = [
    { name: '电站尾水出口水温监测点', liushu: 22, ssls: '38', shuiwei: 1000, device: 1, left: '46%', top: '70%',
        liuliangOptions: [
    { label: '总计流量', value: 500 },
    { label: '日累计流量', value: 1000 },
    { label: '周累计流量', value: 10000 },
    { label: '月累计流量', value: 300000 },
    { label: '年累计流量', value: 3600000 },
        ]
    },
    { name: '电站尾水出口水温监测点', liushu: 22, ssls: '38', shuiwei: 1000, device: 2, left: '55%', top: '10%',
        liuliangOptions: [
            { label: '总计流量', value: 500 },
            { label: '日累计流量', value: 1000 },
            { label: '周累计流量', value: 10000 },
            { label: '月累计流量', value: 300000 },
            { label: '年累计流量', value: 3600000 },
        ]
    },
]

</script>
@@ -65,7 +77,7 @@
        top: 0;
        width: 100%;
        height: 100%;
        background: url("@/assets/images/map-bg.png") no-repeat;
        background: url("@/assets/images/flow-bg.png") no-repeat;
        background-size: 100% 100%;
        z-index: 11;
    }
@@ -76,8 +88,6 @@
        z-index: 20;
        .point{
            position: absolute;
            left: 58%;
            top: 30%;
            .point-address{
                width: 35px;
                height: 40px;
@@ -87,7 +97,7 @@
            .point-message{
                width: 600px;
                height: 200px;
                background: url("@/assets/images/messageInfo-box.png") no-repeat;
                background: url("@/assets/images/messageInfo-left.png") no-repeat;
                background-size: 100% 100%;
                position: absolute;
                left: -600px;