|
|
|
@ -1,7 +1,7 @@ |
|
|
|
<template> |
|
|
|
<div style="padding: 16px;min-height: calc(100vh - 84px);display: flex; justify-content: center;align-items: center;"> |
|
|
|
<div class="div-box"> |
|
|
|
<div class="div-box-title"> 智能化衣柜 </div> |
|
|
|
<div class="div-box-title"> 智能居家数据监护 </div> |
|
|
|
<div class="div-ul"> |
|
|
|
<div class="div-li"> |
|
|
|
<div> |
|
|
|
@ -13,36 +13,77 @@ |
|
|
|
<!-- ON：开启 OFF：关闭 --> |
|
|
|
<div class="div-li"> |
|
|
|
<div> |
|
|
|
<span>除湿：</span> |
|
|
|
<el-switch v-model="value2" active-color="#13ce66" inactive-color="#ff4949"> |
|
|
|
</el-switch> |
|
|
|
<span>CO：</span>5PPM |
|
|
|
</div> |
|
|
|
<div> |
|
|
|
<span>杀菌：</span> |
|
|
|
<span>预警：</span> |
|
|
|
<el-switch v-model="value2" active-color="#13ce66" inactive-color="#ff4949"> |
|
|
|
</el-switch> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="div-tips"><span>标签序列号：</span>AE0B01 </div> |
|
|
|
<div class="div-tips"><span>阈值设定：</span>30 <i class="el-icon-edit" |
|
|
|
style="color: rgb(64, 158, 255);margin-left: 4px;cursor: pointer;" @click="handleSettings"></i></div> |
|
|
|
</div> |
|
|
|
<!-- 添加或修改公告对话框 --> |
|
|
|
<el-dialog title="阈值设定" :visible.sync="open" width="780px" append-to-body> |
|
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="80px"> |
|
|
|
|
|
|
|
<el-form-item label="阈值" prop="noticeTitle"> |
|
|
|
<el-input v-model="form.noticeTitle" placeholder="请输入阈值" /> |
|
|
|
</el-form-item> |
|
|
|
</el-form> |
|
|
|
<div slot="footer" class="dialog-footer"> |
|
|
|
<el-button type="primary" @click="submitForm">确 定</el-button> |
|
|
|
<el-button @click="open = false">取 消</el-button> |
|
|
|
</div> |
|
|
|
</el-dialog> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import { updateNotice } from "@/api/system/notice"; |
|
|
|
export default { |
|
|
|
name: "Index", |
|
|
|
data() { |
|
|
|
return { |
|
|
|
open: false, |
|
|
|
value2: false, |
|
|
|
// 表单参数 |
|
|
|
form: {}, |
|
|
|
// 表单校验 |
|
|
|
rules: { |
|
|
|
noticeTitle: [ |
|
|
|
{ required: true, message: "公告标题不能为空", trigger: "blur" } |
|
|
|
], |
|
|
|
noticeType: [ |
|
|
|
{ required: true, message: "公告类型不能为空", trigger: "change" } |
|
|
|
] |
|
|
|
}, |
|
|
|
// 版本号 |
|
|
|
version: "3.8.9", |
|
|
|
}; |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
goTarget(href) { |
|
|
|
window.open(href, "_blank"); |
|
|
|
// 阈值设定弹窗 |
|
|
|
handleSettings() { |
|
|
|
this.open = true; |
|
|
|
this.form = { |
|
|
|
noticeTitle: "30", |
|
|
|
}; |
|
|
|
// this.$message.success(''); |
|
|
|
}, |
|
|
|
/** 提交按钮 */ |
|
|
|
submitForm: function() { |
|
|
|
this.$refs["form"].validate(valid => { |
|
|
|
if (valid) { |
|
|
|
updateNotice(this.form).then(response => { |
|
|
|
this.$modal.msgSuccess("操作成功"); |
|
|
|
this.open = false; |
|
|
|
this.getList(); |
|
|
|
}); |
|
|
|
} |
|
|
|
}); |
|
|
|
}, |
|
|
|
}, |
|
|
|
}; |
|
|
|
@ -77,17 +118,26 @@ export default { |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
margin-bottom: 12px; |
|
|
|
|
|
|
|
div { |
|
|
|
flex: 1 |
|
|
|
flex: 1; |
|
|
|
align-items: center; |
|
|
|
} |
|
|
|
|
|
|
|
span { |
|
|
|
color: #666; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
.div-tips{ |
|
|
|
|
|
|
|
.div-tips { |
|
|
|
font-size: 18px; |
|
|
|
line-height: 22px; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
|
|
|
|
span { |
|
|
|
color: #666; |
|
|
|
} |
|
|
|
color: #666; |
|
|
|
} |
|
|
|
} |
|
|
|
</style> |
|
|
|
|
lzp
4 months ago