XAMYWXTUI/src/views/business/manage/rtudetail.vue

<!--
 * @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 shadow="hover" style="margin-top: 10px;">
                <div slot="header">
                    <span>测站基本信息</span>
                </div>
                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="测站名称:" labelWidth="150px">
                    <div style="color: black;">{{ rtuInfo.rtuName }}</div>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->
                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="测站编码:" labelWidth="150px">
                    <div style="color: black;">{{ rtuInfo.rtuCode }}</div>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->
                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="站点类型:" labelWidth="150px">
                    <label style="color: black;">{{ rtuInfo.rtuKindDesc }}</label>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->
                <!-- <el-row type="flex">
                    <el-col :span="24"> -->
                <el-form-item label="通信网络类型:" labelWidth="150px">
                    <div>
                        <label v-if="(rtuInfo.isSatellite == 1)" style="color: black;">北斗通信</label>
                        <label v-else style="color: black;">4G/5G移动网络通信</label>
                    </div>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->
                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="运维单位:" labelWidth="150px">
                    <div>
                        <label style="color: black;">{{ rtuInfo.manageCompany }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>
                </el-row> -->
            </el-card>

            <el-card shadow="hover" style="margin-top: 10px;">
                <div slot="header">
                    <span>测站地理位置信息</span>
                </div>
                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="盟市:" labelWidth="150px">
                    <div>
                        <label style="color: black;">{{ rtuInfo.adCity }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->
                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="旗县区:" labelWidth="150px">
                    <div>
                        <label style="color: black;">{{ rtuInfo.adDist }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->
                <!-- <el-row type="flex">
                    <el-col :span="24"> -->
                <el-form-item label="经纬度:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ rtuInfo.lng }},{{ rtuInfo.lat }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>

                    </el-row> -->

                <!-- <el-row type="flex">

                        <el-col :span="24"> -->
                <!-- <el-form-item label="纬度:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ rtuInfo.lat }}</label>
                    </div>
                </el-form-item> -->
                <!-- </el-col>
                </el-row> -->

                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="站点具体位置描述:" labelWidth="150px">
                    <label style="color: black;">{{ rtuInfo.locationDesc }}</label>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->
            </el-card>


            <el-card shadow="hover" style="margin-top: 10px;">
                <div slot="header">
                    <span>RTU信息</span>
                </div>
                <!-- <el-row type="flex">
                    <el-col :span="24"> -->
                <el-form-item label="RTU品牌:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;"> {{ rtuInfo.rtuBrand }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>


                    </el-row> -->
                <!-- 
                <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="RTU型号:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ rtuInfo.rtuModel }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->

                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="RTU更换时间:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ rtuInfo.rtuReplaceDate }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->

                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="RTU报送单位:" labelWidth="150px">
                    <label v-if="rtuInfo.datagramToSheng = 1 && rtuInfo.datagramToShi == 1 && rtuInfo.datagramToQu == 1"
                        style="color: black;">自治区/盟市/旗县区</label>
                    <label v-else-if="rtuInfo.datagramToSheng = 1 && rtuInfo.datagramToShi == 1"
                        style="color: black;">自治区/盟市</label>
                    <label v-else-if="rtuInfo.datagramToSheng = 1 && rtuInfo.datagramToQu == 1"
                        style="color: black;">自治区/旗县区</label>
                    <label v-else-if="rtuInfo.datagramToShi == 1 && rtuInfo.datagramToQu == 1"
                        style="color: black;">盟市/旗县区</label>
                    <label v-else-if="rtuInfo.datagramToSheng = 1" style="color: black;">自治区</label>
                    <label v-else-if="rtuInfo.datagramToShi == 1" style="color: black;">盟市</label>
                    <label v-else-if="rtuInfo.datagramToQu == 1" style="color: black;">旗县区</label>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->

            </el-card>

            <el-card v-if="rtuInfo.isRain == 1" shadow="hover" style="margin-top: 10px;">
                <div slot="header">
                    <span>雨量传感器信息</span>
                </div>
                <!-- <el-row type="flex">
                    <el-col :span="24"> -->
                <el-form-item label="雨量计品牌:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ rtuInfo.rainSensorBrand }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>

                    </el-row> -->
                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="雨量计型号:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ rtuInfo.rainSensorModel }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->
                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="雨量计更换时间:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ rtuInfo.rainSensorReplaceDate }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->
            </el-card>
            <el-card v-if="(rtuInfo.isRiver == 1 || rtuInfo.isRes == 1)" shadow="hover" style="margin-top: 10px;">
                <div slot="header">
                    <span>水位计传感器信息</span>
                </div>
                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="水位计传感器类型:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ rtuInfo.waterSensorTypeText }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->
                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="水位计品牌:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ rtuInfo.waterSensorBrand }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->
                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="水位计型号:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ rtuInfo.waterSensorModel }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->
                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="水位计更换时间:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ rtuInfo.waterSensorReplaceDate }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->
            </el-card>


            <el-card v-if="rtuInfo.isGround == 1" shadow="hover" style="margin-top: 10px;">
                <div slot="header">
                    <span>墒情传感器信息</span>
                </div>
                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="墒情站传感器类型:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ rtuInfo.groundSensorTypeText }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->
                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="墒情传感器品牌:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ rtuInfo.groundSensorBrand }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->
                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="墒情传感器型号:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ rtuInfo.groundSensorModel }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->
                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="墒情传感器更换时间:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ rtuInfo.groundSensorReplaceDate }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->
            </el-card>



            <el-card shadow="hover" style="margin-top: 10px;">
                <div slot="header">
                    <span>供电系统信息</span>
                </div>
                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="蓄电池容量(AH):" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ rtuInfo.batteryModel }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->
                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="蓄电池更换时间:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ rtuInfo.batteryReplaceDate }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->

                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="太阳能板(w):" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ rtuInfo.sunPowerModel }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->

            </el-card>

            <el-card v-if="rtuInfo.isSatellite == 1" shadow="hover" style="margin-top: 10px;">
                <div slot="header">
                    <span>卫星通讯</span>
                </div>
                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="通讯模式:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ rtuInfo.satelliteModelText }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>
                </el-row> -->
            </el-card>

            <el-card v-else shadow="hover" style="margin-top: 10px;">
                <div slot="header">
                    <span>SIM卡信息</span>
                </div>
                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="SIM卡号:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ rtuInfo.networkSimId }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->
                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="SIM卡开卡单位:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ rtuInfo.networkPayer }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->
                <!-- <el-row type="flex">
                        <el-col :span="24"> -->
                <el-form-item label="SIM卡缴费截止时间:" labelWidth="150px">
                    <div class="block">
                        <label style="color: black;">{{ rtuInfo.networkPayEndDate }}</label>
                    </div>
                </el-form-item>
                <!-- </el-col>
                    </el-row> -->
            </el-card>
        </el-form>


    </basic-container>
</template>

<script>
import { getDetail } from "@/api/baseinfo/rtu.js";
export default {
    components: {

    },
    props: {
        id: {
            type: [Number],
            required: true
        },
    },
    name: 'rtudetail',
    data() {
        return {
            activeName: 'base',
            query: {},
            rtuInfo: [],
        }
    },
    created() {
        this.init();
    },
    methods: {
        init() {
            this.onLoad();
        },
        onLoad() {
            this.loading = true;
            getDetail(this.id).then((res) => {
                console.log(JSON.stringify(res.data));
                this.rtuInfo = res.data.data;
                this.loading = false;
            });
        },
    }
}
</script>
<style></style>