bonus-ui/src/views/kitchen/baseSetting/setEnvMoniFre.vue

<template>
    <div class="app-container">
        <h3 style="font-weight: bold;">环境监控设置</h3>

        <div style="width: 100%;margin: 10px auto;border: 1px solid #ccc;padding: 10px;border-radius: 10px;">
            <div style="font-weight: bold;border-left: 4px solid #1890FF;padding-left: 4px;">环境监控设置</div>
            <div class="item">
                <div>
                    <div>
                        <span class="item-label">环境监控统计频率:</span>
                        <el-input
                            v-model="env_monitor_statis_frequency" style="width: 200px;margin-left: 50px;"
                            auto-complete="off" maxlength="9"
                            placeholder="60" 
                            ></el-input>
                        <span class="item-unit">秒</span> 
                    </div>
                    <div style="color: #999;font-size: 14px;margin-top: 10px">同一设备相同的状态N秒内只记录一次，当设备状态变化时立即记录一次</div>
                </div>
                <div style="display: flex;padding-left: 40px;">
                    <el-button type="primary" @click="save31">保存</el-button>
                    <el-button type="info" @click="reset31">恢复默认</el-button>
                </div>
            </div> 
            <div class="item" v-for="(item,index) in metricSettingList" :key="index">
                <div>
                    <div>
                        <span class="item-label">{{item.measureName}}报警阈值:</span>
                        <span>高于</span>
                        <el-input
                            v-model="item.measureMaxValue" style="width: 200px;margin-left: 20px;"
                            auto-complete="off" maxlength="9"
                            placeholder="22" 
                            ></el-input>
                        <span class="item-unit">{{item.measureUnit}}</span> 
                    </div>
                    <div>
                        <span class="item-label"></span>
                        <span>低于</span>
                        <el-input
                            v-model="item.measureMinValue" style="width: 200px;margin-left: 20px;"
                            auto-complete="off" maxlength="9"
                            placeholder="16" 
                            ></el-input>
                        <span class="item-unit">{{item.measureUnit}}</span> 
                    </div>
                    <div style="color: #999;font-size: 14px;margin-top: 10px">当{{item.measureName}}处于报警阈值时，系统会生成环境报警记录</div>
                </div>
                <div style="display: flex;padding-left: 40px;">
                    <el-button type="primary" @click="save32(item)">保存</el-button>
                    <el-button type="info" @click="reset32(item)">恢复默认</el-button>
                </div>
            </div>
            <!-- <div class="item">
                <div>
                    <div>
                        <span class="item-label">湿度报警阈值:</span>
                        <span>高于</span>
                        <el-input
                            v-model="env_humidity_max_value" style="width: 200px;margin-left: 20px;"
                            auto-complete="off" maxlength="9"
                            placeholder="75" 
                            ></el-input>
                        <span class="item-unit">%</span> 
                    </div>
                    <div>
                        <span class="item-label"></span>
                        <span>低于</span>
                        <el-input
                            v-model="env_humidity_min_value" style="width: 200px;margin-left: 20px;"
                            auto-complete="off" maxlength="9"
                            placeholder="30" 
                            ></el-input>
                        <span class="item-unit">%</span> 
                    </div>
                    <div style="color: #999;font-size: 14px;margin-top: 10px">当湿度处于报警阈值时，系统会生成环境报警记录</div>
                </div>
                <div style="display: flex;padding-left: 40px;">
                    <el-button type="primary" @click="save33">保存</el-button>
                    <el-button type="info" @click="reset33">恢复默认</el-button>
                </div>
            </div> 
            <div class="item">
                <div>
                    <div>
                        <span class="item-label">烟雾报警阈值:</span>
                        <el-input
                            v-model="env_smoke_max_value" style="width: 200px;margin-left: 50px;"
                            auto-complete="off" maxlength="9"
                            placeholder="30" 
                            ></el-input>
                        <span class="item-unit">mg/m³</span> 
                    </div>
                    <div style="color: #999;font-size: 14px;margin-top: 10px">当烟雾浓度处于报警阈值时，系统会生成环境报警记录</div>
                </div>
                <div style="display: flex;padding-left: 40px;">
                    <el-button type="primary" @click="save34">保存</el-button>
                    <el-button type="info" @click="reset34">恢复默认</el-button>
                </div>
            </div> 
            <div class="item">
                <div>
                    <div>
                        <span class="item-label">留样柜温度报警阈值:</span>
                        <span>高于</span>
                        <el-input
                            v-model="env_sample_cabinet_temp_max_value" style="width: 200px;margin-left: 20px;"
                            auto-complete="off" maxlength="9"
                            placeholder="6" 
                            ></el-input>
                        <span class="item-unit">°C</span> 
                    </div>
                    <div>
                        <span class="item-label"></span>
                        <span>低于</span>
                        <el-input
                            v-model="env_sample_cabinet_temp_min_value" style="width: 200px;margin-left: 20px;"
                            auto-complete="off" maxlength="9"
                            placeholder="0" 
                            ></el-input>
                        <span class="item-unit">°C</span> 
                    </div>
                    <div style="color: #999;font-size: 14px;margin-top: 10px">当留样柜内温度处于报警阈值时，系统会生成环境报警记录</div>
                </div>
                <div style="display: flex;padding-left: 40px;">
                    <el-button type="primary" @click="save35">保存</el-button>
                    <el-button type="info" @click="reset35">恢复默认</el-button>
                </div>
            </div>  -->
        </div> 
    </div>
</template>
  
<script> 
import { getSettingListApi,batchEditSettingApi,batchResetSettingApi,getMetricSettingListApi,batchEditMetricSettingApi,batchResetMetricSettingApi } from "@/api/kitchen/setting.js";
  
export default {
        name: "",
        dicts: [],
        data() {
        return { 
            //环境监控设置
            env_monitor_statis_frequency:null,
            metricSettingList:[]
        };
    },
    created() {
        
    },
    mounted(){
        this.query31()
        this.query32()
    },
    methods: { 
        query31(){
            getSettingListApi({"itemName": "env_monitor_statis_frequency"}).then(response => { 
                this.env_monitor_statis_frequency = response.rows[0].itemValue
            });
        },
        save31(){
            let param = [
                {"itemName": "env_monitor_statis_frequency","itemValue":this.env_monitor_statis_frequency}
            ]
            batchEditSettingApi(param).then(response => {
                this.$message.success("保存成功");
                this.query31()
            }); 
        },
        reset31(){
            let param = [
                {"itemName": "env_monitor_statis_frequency"},
            ]
            batchResetSettingApi(param).then(response => {
                this.$message.success("恢复成功");
                this.query31()
            }); 
        },
        query32(){
            getMetricSettingListApi().then(response => { 
                this.metricSettingList = response.rows
            });
        },
        save32(item){
            let param = [
                item
            ]
            batchEditMetricSettingApi(param).then(response => {
                this.$message.success("保存成功");
                this.query32()
            }); 
        },
        reset32(item){
            batchResetMetricSettingApi(item.measureId).then(response => {
                this.$message.success("保存成功");
                this.query32()
            }); 
        }
    }
};
</script>
<style scoped>
    .item{
        width: 96%;margin: 10px auto;padding: 20px 10px;border-radius: 8px;display: flex;align-items: center;
    }
    .item-label{
        display: inline-block;
        width: 240px;
    }
    .item-unit{
        margin-left: 10px;
    }
    .item-th{
        width: 100%;height: 60px;display: flex;line-height: 60px;
    }
</style>