<!--
 * @Title: 
 * @Description:  测站实时数据
 * @Author: swp
 * @Date: 2022-08-24 10:49:21
 * @LastEditors: 
 * @LastEditTime: 2022-08-24 10:49:21
-->
<template>
    <basic-container>

        <el-form ref="form">
            <el-card v-if="isRain == 1" shadow="hover" style="margin-top: 10px;">
                <div slot="header">
                    <span>雨量站</span>
                </div>
                <el-form-item label="采集时间:" labelWidth="150px">
                    <div style="color: black;">{{ rainData.tm }}</div>
                </el-form-item>
                <el-form-item label="上报时间:" labelWidth="150px">
                    <div style="color: black;">{{ rainData.fromTime }}</div>
                </el-form-item>
                <el-form-item label="时段长:" labelWidth="150px">
                    <div v-if="rainData.intv == 1" style="color: black;">小时</div>
                    <div v-if="rainData.intv == 0.05" style="color: black;">5分钟</div>
                </el-form-item>
                <el-form-item label="时段降水:" labelWidth="150px">
                    <div style="color: black;">{{ rainData.drp }}</div>
                </el-form-item>
            </el-card>

            <el-card v-if="isRiver == 1" shadow="hover" style="margin-top: 10px;">
                <div slot="header">
                    <span>水位站</span>
                </div>
                <el-form-item label="采集时间:" labelWidth="150px">
                    <div style="color: black;">{{ riverData.tm }}</div>
                </el-form-item>
                <el-form-item label="上报时间:" labelWidth="150px">
                    <div style="color: black;">{{ riverData.fromTime }}</div>
                </el-form-item>

                <el-form-item label="水位:" labelWidth="150px">
                    <div>
                        <label style="color: black;">{{ riverData.z }}</label>
                    </div>
                </el-form-item>
            </el-card>
            <el-card v-else-if="isRes == 1" shadow="hover" style="margin-top: 10px;">
                <div slot="header">
                    <span>水位站</span>
                </div>
                <el-form-item label="采集时间:" labelWidth="150px">
                    <div style="color: black;">{{ rsvrData.tm }}</div>
                </el-form-item>
                <el-form-item label="上报时间:" labelWidth="150px">
                    <div style="color: black;">{{ rsvrData.fromTime }}</div>
                </el-form-item>
                <el-form-item label="水位:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;"> {{ rsvrData.rz }}</label>
                    </div>
                </el-form-item>
            </el-card>

            <el-card v-if="isGround == 1" shadow="hover" style="margin-top: 10px;">
                <div slot="header">
                    <span>墒情站</span>
                </div>
                <el-form-item label="采集时间:" labelWidth="150px">
                    <div style="color: black;">{{ groundData.tm }}</div>
                </el-form-item>
                <el-form-item label="上报时间:" labelWidth="150px">
                    <div style="color: black;">{{ groundData.fromTime }}</div>
                </el-form-item>
                <el-form-item label="垂线平均含水量:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ groundData.vtavslm }}</label>
                    </div>
                </el-form-item>
                <el-form-item label="表层含水量:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ groundData.srlslm }}</label>
                    </div>
                </el-form-item>
                <el-form-item label="10CM深度含水量:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ groundData.slm10 }}</label>
                    </div>
                </el-form-item>
                <el-form-item label="20CM深度含水量:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ groundData.slm20 }}</label>
                    </div>
                </el-form-item>
                <el-form-item label="30CM深度含水量:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ groundData.slm30 }}</label>
                    </div>
                </el-form-item>
                <el-form-item label="40CM深度含水量:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ groundData.slm40 }}</label>
                    </div>
                </el-form-item>
                <el-form-item label="50CM深度含水量:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ groundData.slm50 }}</label>
                    </div>
                </el-form-item>
                <el-form-item label="60CM深度含水量:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ groundData.slm60 }}</label>
                    </div>
                </el-form-item>
                <el-form-item label="80CM深度含水量:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ groundData.slm80 }}</label>
                    </div>
                </el-form-item>
                <el-form-item label="100CM深度含水量:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ groundData.slm100 }}</label>
                    </div>
                </el-form-item>
            </el-card>
        </el-form>
    </basic-container>
</template>

<script>
import { getDetail as getGround } from "@/api/data/dataGround.js";
import { getDetail as getRain } from "@/api/data/dataRain.js";
import { getDetail as getRiver } from "@/api/data/dataRiver.js";
import { getDetail as getRsvr } from "@/api/data/dataRsvr.js";
export default {
    components: {

    },
    name: 'realdatadetail',
    props: {
        rtuCode: {
            type: [String],
            required: true
        },
        isRain: {
            type: [Number],
            required: true
        },
        isRiver: {
            type: [Number],
            required: true
        },
        isRes: {
            type: [Number],
            required: true
        },
        isGround: {
            type: [Number],
            required: true
        }
    },
    data() {
        return {
            query: {},
            rainData: {},
            riverData: {},
            rsvrData: {},
            groundData: {}
        }
    },
    created() {
    },
    methods: {
        init() {
            this.onLoad();
        },
        onLoad() {

            getGround(this.rtuCode).then((res) => {
                console.log(JSON.stringify(res.data));
                this.groundData = res.data.data;

            });

            getRain(this.rtuCode).then((res) => {
                console.log(JSON.stringify(res.data));
                this.rainData = res.data.data;

            });

            getRiver(this.rtuCode).then((res) => {
                console.log(JSON.stringify(res.data));
                this.riverData = res.data.data;

            });

            getRsvr(this.rtuCode).then((res) => {
                console.log(JSON.stringify(res.data));
                this.rsvrData = res.data.data;

            });
        },
    }
}
</script>
<style></style>

