You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
184 lines
6.4 KiB
184 lines
6.4 KiB
<template>
|
|
<el-form label-position="top" :model="data" ref="functionForm">
|
|
<el-row :gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item label="设置金属腐蚀采样频率(分钟)" prop="frequency.metal">
|
|
<el-input-number :min="0" v-model="data.frequency.metal" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="设置温湿度采样频率(分钟)" prop="frequency.th">
|
|
<el-input-number :min="0" v-model="data.frequency.th" />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row :gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item label="设置SO2采样频率(分钟)" prop="frequency.so2">
|
|
<el-input-number :min="0" v-model="data.frequency.so2" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="设置盐雾采样频率(分钟)" prop="frequency.salt">
|
|
<el-input-number :min="0" v-model="data.frequency.salt" />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row :gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item label="设置时间" prop="time">
|
|
<!-- <el-input v-model="data.time"></el-input> -->
|
|
<el-date-picker v-model="data.time" type="datetime" placeholder="设置时间"> </el-date-picker>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="设置金属腐蚀采集个数" prop="count">
|
|
<el-input-number :min="0" v-model="data.count" />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row :gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item label="设置电池电压低阈值" prop="batteryLow">
|
|
<el-input-number :min="0" v-model="data.batteryLow" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="设置电池电压高阈值" prop="batteryHigh">
|
|
<el-input-number :min="0" v-model="data.batteryHigh" />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row :gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item label="设置太阳能电压高阈值" prop="sunHigh">
|
|
<el-input-number :min="0" v-model="data.sunHigh" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="设置湿度高阈值" prop="humidityHigh">
|
|
<el-input-number :min="0" v-model="data.humidityHigh" />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row :gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item label="设置温度低阈值" prop="temperatureLow">
|
|
<el-input-number :min="0" v-model="data.temperatureLow" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="设置温度高阈值" prop="temperatureHigh">
|
|
<el-input-number :min="0" v-model="data.temperatureHigh" />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row :gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item label="设置安全模式" prop="securityMode">
|
|
<!-- <el-input v-model="data.securityMode"></el-input> -->
|
|
<el-radio v-model="data.securityMode" :label="0">不加密</el-radio>
|
|
<el-radio v-model="data.securityMode" :label="1">加密</el-radio>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="设置金属腐蚀类型" prop="corrosiveType">
|
|
<!-- <el-input v-model="data.corrosiveType"></el-input> -->
|
|
<el-select v-model="data.corrosiveType" placeholder="选择金属腐蚀类型">
|
|
<el-option v-for="type in types" :key="type.value" :label="type.type" :value="type.value"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row :gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item label="设置上报时间" prop="report.type" style="margin-bottom: 0 !important">
|
|
<el-radio-group v-model="data.report.type">
|
|
<el-radio :label="0">按设定时间点上报</el-radio>
|
|
<el-radio :label="1">按设定周期上报(分钟)</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row :gutter="20" v-if="data.report.type === 0">
|
|
<el-col :lg="6" :xl="4" :md="8" :sm="12" v-for="(item, index) in data.report.timePoints" :key="index">
|
|
<el-form-item prop="report.timePoints" style="margin-bottom: 10px !important">
|
|
<el-time-picker format="HH:mm" v-model="data.report.timePoints[index]" :placeholder="`上报时间点${index + 1}`"></el-time-picker>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row :gutter="20" v-else>
|
|
<el-col :span="12">
|
|
<el-form-item prop="report.cycle">
|
|
<el-input-number :min="0" v-model="data.report.cycle" />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row :gutter="20" class="mt-5 pl-2">
|
|
<el-form-item>
|
|
<el-button type="primary" @click="onSubmit">提交</el-button>
|
|
<el-button @click="onReset">重置</el-button>
|
|
</el-form-item>
|
|
</el-row>
|
|
</el-form>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { reactive, ref } from 'vue';
|
|
|
|
const data = reactive({
|
|
frequency: {
|
|
so2: 0, // SO2采样频率
|
|
metal: 0, // 金属腐蚀采样频率
|
|
th: 0, // 温湿度 采样频率
|
|
salt: 0, // 盐雾 采样频率
|
|
}, // 采样频率
|
|
count: 0, // 采集个数
|
|
time: new Date(), // 设置时间
|
|
batteryLow: 0, // 电池电压低阈值
|
|
batteryHigh: 0, // 电池电压高阈值
|
|
sunHigh: 0, // 太阳能电压高阈值
|
|
humidityHigh: 0, // 湿度高阈值
|
|
temperatureLow: 0, // 温度低阈值
|
|
temperatureHigh: 0, // 温度高阈值
|
|
securityMode: 0, // 安全模式 0->不加密 1->加密
|
|
corrosiveType: '', // 金属腐蚀类型
|
|
report: {
|
|
type: 0, // 上报周期类型 0->时间点 1->周期
|
|
timePoints: [0, 0, 0, 0, 0, 0], // 设置时间点
|
|
cycle: 0, // 上报周期分钟数
|
|
},
|
|
});
|
|
|
|
// 金属腐蚀的类型
|
|
const types = ref([
|
|
{ value: 0, type: '金属腐蚀通道 1 类型' },
|
|
{ value: 1, type: '金属腐蚀通道 2 类型' },
|
|
{ value: 2, type: '金属腐蚀通道 3 类型' },
|
|
{ value: 3, type: '金属腐蚀通道 4 类型' },
|
|
]);
|
|
|
|
const functionForm = ref(null); // form
|
|
|
|
// 提交表单
|
|
const onSubmit = () => {
|
|
functionForm.value.validate(valid => {
|
|
console.log(valid, { ...data });
|
|
});
|
|
};
|
|
|
|
// 重置表单
|
|
const onReset = () => {
|
|
functionForm.value.resetFields();
|
|
};
|
|
</script>
|
|
|