<template>
    <view class="swinfo" @click="toDetail()">
        <view class="title">
            <view class="left">
                <text>{{item.stnm}}水位站</text>
            </view>
            <view class="right">
                {{item.tm}}
            </view>
        </view>
        <view class="content">
            <view class="real-sw">
                <text class="sw-name">实时水位</text>
                <text style="font-size:22px;margin-right:5px;">{{item.rz}} </text>
                <text>m</text>
            </view>
            <view class="limit-sw">
                <text class="sw-name">汛限水位</text>
                <text style="font-size:22px;margin-right:5px">{{item.flLowLimLev}}</text>
                <text>m</text>
            </view>
        </view>
    </view>

</template>

<script>
    export default {
        props: {
            item: {
                type: Object,
                required: true,
            },
        },
        data() {
            return {}
        },
        methods: {
            toDetail() {
                uni.navigateTo({
                    url: `/pages/sws/detail/index?stnm=${this.item.stnm}&stcd=${this.item.stcd}`
                })
            },
        },

    }
</script>

<style lang="scss" scoped>
    .swinfo {
        .title {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 10px 0;

        }

        .content {
            display: flex;
            justify-content: space-between;

            .real-sw,
            .limit-sw {
                flex: 1;
                position: relative;
                border: 1px solid #efefef;
                height: 60px;
                text-align: center;
                line-height: 75px;

                .sw-name {
                    position: absolute;
                    top: 0;
                    left: 0;
                    // padding: 0 5px;
                    color: #49a7f0;
                    background-color: #cbecfd;
                    font-size: 12px;
                    line-height: 20px;
                    padding: 0 5px;
                }
            }

            .real-sw {
                margin-right: 10px;
            }
        }

    }

    .withd-2 {
        width: 50%;
        text-align: center;
    }
</style>