XAMYWXTUI/src/views/business/inspection/inspectionRportDetail.vue

<template>
    <basic-container>
        <el-form ref="form" :model="form" label-width="120px">

            <el-card shadow="hover">
                <div slot="header">
                    <span>巡检总结情况</span>
                </div>
                <el-form-item label="巡检意见:">
                    <div>
                        <label>{{form.reportDesc}}</label>
                    </div>
                </el-form-item>
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="图片一">
                            <div class="block">
                                <!-- <span class="demonstration">默认</span> -->
                                <el-image :src="form.basePhoto1Url"></el-image>
                            </div>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="图片二">
                            <div class="block">
                                <!-- <span class="demonstration">默认</span> -->
                                <el-image :src="form.basePhoto2Url"></el-image>
                            </div>
                        </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="运行状态:">
                            <div v-if="rtuStatus ==0" class="block">
                                <div>
                                    <label>正常</label>
                                </div>
                                <el-input :disabled="true" value="正常" />
                            </div>
                            <div v-else>
                                <div>
                                    <label>故障</label>
                                </div>
                            </div>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row type="flex">
                    <el-col :span="6">
                        <el-form-item label="品牌:">
                            <div class="block">
                                <label>{{form.rtuBrand}}</label>
                            </div>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="型号:">
                            <div class="block">

                                <label>{{form.rtuModel}}</label>
                            </div>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="更换时间:">
                            <div class="block">
                                <label>{{form.rtuReplaceDate}}</label>
                            </div>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row type="flex">
                    <el-col :span="24">
                        <el-form-item label="上报到县市省:">
                            <div style="display:flex; justify-content: start;align-items: center;">
                                <div v-if="form.datagramToLevel1">
                                    <label>发往县</label>
                                    <label style="margin-left: 5px;margin-right: 5px;">/</label>
                                </div>
                                <div v-if="form.datagramToLevel2">
                                    <label>发往市</label>
                                    <label style="margin-left: 5px;margin-right: 5px;">/</label>
                                </div>
                                <div v-if="form.datagramToLevel3">
                                    <label>发往省</label>
                                    <label style="margin-left: 5px;margin-right: 5px;">/</label>
                                </div>
                            </div>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row type="flex">
                    <el-col :span="24">
                        <el-form-item label="备注说明:">
                            <label>{{form.rtuDesc}}</label>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row type="flex">
                    <el-col :span="12">
                        <el-form-item label="RTU图片">
                            <div class="block">
                                <!-- <span class="demonstration">默认</span> -->
                                <el-image :src="form.rtuPhotoUrl"></el-image>
                            </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="运行状态:">
                            <div v-if="rainSensorStatus ==0" class="block">
                                <div>
                                    <label>正常</label>
                                </div>
                                <el-input :disabled="true" value="正常" />
                            </div>
                            <div v-else>
                                <div>
                                    <label>故障</label>
                                </div>
                            </div>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row type="flex">
                    <el-col :span="6">
                        <el-form-item label="品牌:">
                            <div class="block">
                                <label>{{form.rainSensorBrand}}</label>
                            </div>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="型号:">
                            <div class="block">

                                <label>{{form.rainSensorModel}}</label>
                            </div>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="更换时间:">
                            <div class="block">
                                <label>{{form.rainSensorReplaceDate}}</label>
                            </div>
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-row type="flex">
                    <el-col :span="24">
                        <el-form-item label="备注说明:">
                            <label>{{form.rainSensorDesc}}</label>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row type="flex">
                    <el-col :span="12">
                        <el-form-item label="雨量传感器图片">
                            <div class="block">
                                <!-- <span class="demonstration">默认</span> -->
                                <el-image :src="form.rainSensorPhotoUrl"></el-image>
                            </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="12">
                        <el-form-item label="运行状态:">
                            <div v-if="waterLevelSensorStatus ==0" class="block">
                                <div>
                                    <label>正常</label>
                                </div>
                                <el-input :disabled="true" value="正常" />
                            </div>
                            <div v-else>
                                <div>
                                    <label>故障</label>
                                </div>
                            </div>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="传感器类型:">
                            <div class="block">
                                <label>{{form.waterSensorTypeText}}</label>
                            </div>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row type="flex">
                    <el-col :span="6">
                        <el-form-item label="品牌:">
                            <div class="block">
                                <label>{{form.waterSensorBrand}}</label>
                            </div>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="型号:">
                            <div class="block">

                                <label>{{form.waterSensorModel}}</label>
                            </div>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="更换时间:">
                            <div class="block">
                                <label>{{form.waterSensorReplaceDate}}</label>
                            </div>
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-row type="flex">
                    <el-col :span="24">
                        <el-form-item label="备注说明:">
                            <label>{{form.waterSensorDesc}}</label>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row type="flex">
                    <el-col :span="12">
                        <el-form-item label="水位传感器图片">
                            <div class="block">
                                <!-- <span class="demonstration">默认</span> -->
                                <el-image :src="form.waterSensorPhotoUrl"></el-image>
                            </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="12">
                        <el-form-item label="运行状态:">
                            <div v-if="groundWaterSensorStatus ==0" class="block">
                                <div>
                                    <label>正常</label>
                                </div>
                                <el-input :disabled="true" value="正常" />
                            </div>
                            <div v-else>
                                <div>
                                    <label>故障</label>
                                </div>
                            </div>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="传感器类型:">
                            <div class="block">
                                <label>{{form.groundSensorTypeText}}</label>
                            </div>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row type="flex">
                    <el-col :span="6">
                        <el-form-item label="品牌:">
                            <div class="block">
                                <label>{{form.groundSensorBrand}}</label>
                            </div>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="型号:">
                            <div class="block">

                                <label>{{form.groundSensorModel}}</label>
                            </div>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="更换时间:">
                            <div class="block">
                                <label>{{form.rtuReplaceDate}}</label>
                            </div>
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-row type="flex">
                    <el-col :span="24">
                        <el-form-item label="备注说明:">
                            <label>{{form.groundSensorDesc}}</label>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row type="flex">
                    <el-col :span="12">
                        <el-form-item label="墒情传感器图片">
                            <div class="block">
                                <!-- <span class="demonstration">默认</span> -->
                                <el-image :src="form.groundSensorPhotoUrl"></el-image>
                            </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="运行状态:">
                            <div v-if="powerStatus ==0" class="block">
                                <div>
                                    <label>正常</label>
                                </div>
                                <el-input :disabled="true" value="正常" />
                            </div>
                            <div v-else>
                                <div>
                                    <label>故障</label>
                                </div>
                            </div>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row type="flex">
                    <el-col :span="6">
                        <el-form-item label="蓄电池容量(AH):">
                            <div class="block">
                                <label>{{form.batteryModel}}</label>
                            </div>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="蓄电池更换时间:">
                            <div class="block">

                                <label>{{form.batteryReplaceDate}}</label>
                            </div>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="太阳能板功率(W):">
                            <div class="block">
                                <label>{{form.sunPowerModel}}</label>
                            </div>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="太阳能板更换时间:">
                            <div class="block">
                                <label>{{form.sunPowerReplaceDate}}</label>
                            </div>
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-row type="flex">
                    <el-col :span="24">
                        <el-form-item label="备注说明:">
                            <label>{{form.powerDesc}}</label>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row type="flex">
                    <el-col :span="12">
                        <el-form-item label="蓄电池图片">
                            <div class="block">
                                <!-- <span class="demonstration">默认</span> -->
                                <el-image :src="form.batteryPhotoUrl"></el-image>
                            </div>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="太阳能板图片">
                            <div class="block">
                                <!-- <span class="demonstration">默认</span> -->
                                <el-image :src="form.sunPhotoUrl"></el-image>
                            </div>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-card>

            <el-card shadow="hover" style="margin-top: 10px;">
                <div slot="header">
                    <span>4G移动网络</span>
                </div>
                <el-row type="flex">
                    <el-col :span="24">
                        <el-form-item label="运行状态:">
                            <div v-if="networkStatus ==0" class="block">
                                <div>
                                    <label>正常</label>
                                </div>
                                <el-input :disabled="true" value="正常" />
                            </div>
                            <div v-else>
                                <div>
                                    <label>故障</label>
                                </div>
                            </div>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row type="flex">
                    <el-col :span="6">
                        <el-form-item label="SIM卡号:">
                            <div class="block">
                                <label>{{form.simCcid}}</label>
                            </div>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="开卡单位:">
                            <div class="block">
                                <label>{{form.simPay}}</label>
                            </div>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="缴费截止时间:">
                            <div class="block">
                                <label>{{form.simPayEndDate}}</label>
                            </div>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row type="flex">
                    <el-col :span="24">
                        <el-form-item label="备注说明:">
                            <label>{{form.networkDesc}}</label>
                        </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="运行状态:">
                            <div v-if="satelliteStatus ==0" class="block">
                                <div>
                                    <label>正常</label>
                                </div>
                                <el-input :disabled="true" value="正常" />
                            </div>
                            <div v-else>
                                <div>
                                    <label>故障</label>
                                </div>
                            </div>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row type="flex">
                    <el-col :span="12">
                        <el-form-item label="通讯模式:">
                            <div class="block">
                                <label>{{form.satelliteModelText}}</label>
                            </div>
                        </el-form-item>
                    </el-col>

                </el-row>

                <el-row type="flex">
                    <el-col :span="24">
                        <el-form-item label="备注说明:">
                            <label>{{form.satelliteDesc}}</label>
                        </el-form-item>
                    </el-col>
                </el-row>

            </el-card>


        </el-form>
    </basic-container>
</template>

<script>

import {
    getDetail,
} from "@/api/business/inspection/inspection";
export default {
    components: {

    },
    props: {
        id: {
            type: [Number],
            required: true
        },
    },
    name: 'inspectionReport',
    data() {
        return {

            form: {
                reportDesc: '',
                basePhoto1Url: '',
                basePhoto1Take: true,
                basePhoto2Url: '',
                basePhoto2Take: true,

                rtuStatus: 0,
                rtuDesc: 'RTU巡检意见',
                rtuBrand: 'RTU品牌',
                rtuModel: 'RTU型号',
                rtuReplaceDate: '2022-08-15 12:00:00',
                datagramToLevel1: 1,
                datagramToLevel2: 0,
                datagramToLevel3: 1,
                rtuPhotoUrl: '',
                rtuPhotoTake: true,

                rainSensorActive: 1,
                rainSensorStatus: 0,
                rainSensorDesc: '雨量巡检意见',
                rainSensorReplaceDate: '2022-08-15 12:00:00',
                rainSensorBrand: '雨量品牌',
                rainSensorModel: '雨量型号',
                rainSensorPhotoUrl: '',
                rainSensorPhotoTake: true,

                waterSensorBrand: '水位计品牌',
                waterSensorModel: '水位计型号',
                waterSensorTypeText: '雷达',
                waterSensorReplaceDate: '2022-08-15 12:00:00',
                waterSensorDesc: '水位计巡检意见',
                waterSensorPhotoUrl: '',
                waterSensorPhotoTake: true,
                waterLevelSensorActive: 1,
                waterLevelSensorStatus: 1,

                groundSensorBrand: '墒情品牌',
                groundSensorModel: '墒情型号',
                groundSensorTypeText: '插针式',
                groundSensorReplaceDate: '2022-08-15 12:00:00',
                groundSensorDesc: '墒情巡检意见',
                groundSensorPhotoUrl: '',
                groundSensorPhotoTake: true,
                groundWaterSensorActive: 1,
                groundWaterSensorStatus: 0,

                batteryModel: '电池型号',
                batteryReplaceDate: '2022-08-15 12:00:00',
                sunPowerModel: '太阳能型号',
                sunPowerReplaceDate: '2022-08-15 12:00:00',
                batteryPhotoUrl: '',
                batteryPhotoTake: true,
                sunPhotoUrl: '',
                sunPhotoTake: true,
                powerDesc: '供电巡检意见',
                powerStatus: 0,

                simCcid: '11111111111',
                simPay: '开卡单位',
                simPayEndDate: '2022-08-15 12:00:00',
                networkDesc: '4G网络巡检意见',
                networkStatus: 0,
                networkActive: 1,

                satelliteModelText: '北斗2代',
                satelliteStatus: 0,
                satelliteDesc: '卫星巡检意见',
                satelliteActive: 1,
            }
        }
    },
    created() {
        this.init();
    },
    methods: {
        init() {

            getDetail(this.id).then(res => {
                const data = res.data;
                if (data.success) {
                    this.form = data.data;
                    let url = this.form.basePhoto1Url;
                    if (url != null) {
                        url = "http://111.204.228.227:19000/galaxy/" + url;
                        this.form.basePhoto1Url = url;
                    }
                    url = this.form.basePhoto2Url;
                    if (url != null) {
                        url = "http://111.204.228.227:19000/galaxy/" + url;
                        this.form.basePhoto2Url = url;
                    }
                    url = this.form.rtuPhotoUrl;
                    if (url != null) {
                        url = "http://111.204.228.227:19000/galaxy/" + url;
                        this.form.rtuPhotoUrl = url;
                    }
                    url = this.form.rainSensorPhotoUrl;
                    if (url != null) {
                        url = "http://111.204.228.227:19000/galaxy/" + url;
                        this.form.rainSensorPhotoUrl = url;
                    }
                    url = this.form.waterSensorPhotoUrl;
                    if (url != null) {
                        url = "http://111.204.228.227:19000/galaxy/" + url;
                        this.form.waterSensorPhotoUrl = url;
                    }
                    url = this.form.groundSensorPhotoUrl;
                    if (url != null) {
                        url = "http://111.204.228.227:19000/galaxy/" + url;
                        this.form.groundSensorPhotoUrl = url;
                    }
                    url = this.form.batteryPhotoUrl;
                    if (url != null) {
                        url = "http://111.204.228.227:19000/galaxy/" + url;
                        this.form.batteryPhotoUrl = url;
                    }
                    url = this.form.sunPhotoUrl;
                    if (url != null) {
                        url = "http://111.204.228.227:19000/galaxy/" + url;
                        this.form.sunPhotoUrl = url;
                    }

                }
            })
        },

    }
}
</script>

<style>

</style>