|
@@ -0,0 +1,265 @@
|
|
|
+<template>
|
|
|
+ <view class="container">
|
|
|
+ <view class="nomalNotice">
|
|
|
+ <view class="nomalTitle">异常提醒</view>
|
|
|
+ <view class="nomal_contain">
|
|
|
+ <view class="nomalItem">
|
|
|
+ <view class="switchBox">
|
|
|
+ <view class="switchBox">
|
|
|
+ <text class="name">起夜频次</text>
|
|
|
+ <switch
|
|
|
+ :value="statusLight"
|
|
|
+ @change="handleLightChange"
|
|
|
+ :active-value="1"
|
|
|
+ :inactive-value="0"
|
|
|
+ size="24px"
|
|
|
+ active-color="#07c160"
|
|
|
+ inactive-color="#eeeff1"
|
|
|
+ style="transform: scale(0.8)"
|
|
|
+ />
|
|
|
+ </view>
|
|
|
+ <view class="nomalLeft">
|
|
|
+ <text>23:00-06:30</text>
|
|
|
+ <image src="../../static/arrThree.png" mode="" />
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="nomalItem">
|
|
|
+ <view class="switchBox">
|
|
|
+ <view class="switchBox">
|
|
|
+ <text class="name">如厕频次</text>
|
|
|
+ <switch
|
|
|
+ :value="statusLight"
|
|
|
+ @change="handleLightChange"
|
|
|
+ :active-value="1"
|
|
|
+ :inactive-value="0"
|
|
|
+ size="24px"
|
|
|
+ active-color="#07c160"
|
|
|
+ inactive-color="#eeeff1"
|
|
|
+ style="transform: scale(0.8)"
|
|
|
+ />
|
|
|
+ </view>
|
|
|
+ <view class="nomalLeft">
|
|
|
+ <text>23:00-06:30</text>
|
|
|
+ <image src="../../static/arrThree.png" mode="" />
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="nomalItem">
|
|
|
+ <view class="switchBox">
|
|
|
+ <view class="switchBox">
|
|
|
+ <text class="name">卫生间频次</text>
|
|
|
+ <switch
|
|
|
+ :value="statusLight"
|
|
|
+ @change="handleLightChange"
|
|
|
+ :active-value="1"
|
|
|
+ :inactive-value="0"
|
|
|
+ size="24px"
|
|
|
+ active-color="#07c160"
|
|
|
+ inactive-color="#eeeff1"
|
|
|
+ style="transform: scale(0.8)"
|
|
|
+ />
|
|
|
+ </view>
|
|
|
+ <view class="nomalLeft">
|
|
|
+ <text>23:00-06:30</text>
|
|
|
+ <image src="../../static/arrThree.png" mode="" />
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="nomalItem">
|
|
|
+ <view class="switchBox">
|
|
|
+ <view class="switchBox">
|
|
|
+ <text class="name">夜间如厕频次</text>
|
|
|
+ <switch
|
|
|
+ :value="statusLight"
|
|
|
+ @change="handleLightChange"
|
|
|
+ :active-value="1"
|
|
|
+ :inactive-value="0"
|
|
|
+ size="24px"
|
|
|
+ active-color="#07c160"
|
|
|
+ inactive-color="#eeeff1"
|
|
|
+ style="transform: scale(0.8)"
|
|
|
+ />
|
|
|
+ </view>
|
|
|
+ <view class="nomalLeft">
|
|
|
+ <text>23:00-06:30</text>
|
|
|
+ <image src="../../static/arrThree.png" mode="" />
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="nomalItem">
|
|
|
+ <view class="switchBox">
|
|
|
+ <view class="switchBox">
|
|
|
+ <text class="name">如厕频次异常</text>
|
|
|
+ <switch
|
|
|
+ :value="statusLight"
|
|
|
+ @change="handleLightChange"
|
|
|
+ :active-value="1"
|
|
|
+ :inactive-value="0"
|
|
|
+ size="24px"
|
|
|
+ active-color="#07c160"
|
|
|
+ inactive-color="#eeeff1"
|
|
|
+ style="transform: scale(0.8)"
|
|
|
+ />
|
|
|
+ </view>
|
|
|
+ <view class="nomalLeft">
|
|
|
+ <text>23:00-06:30</text>
|
|
|
+ <image src="../../static/arrThree.png" mode="" />
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="box">
|
|
|
+ <view class="handle-btn">
|
|
|
+ <view class="btn2" @click="healthAlarm"> 保存设置 </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ name: "my",
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ status_light: 1,
|
|
|
+ devInfo: "",
|
|
|
+ statusLight: 1,
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {},
|
|
|
+ methods: {},
|
|
|
+ onLoad(option) {
|
|
|
+ this.devInfo = JSON.parse(option.devInfo);
|
|
|
+ console.log(this.devInfo, 999999);
|
|
|
+ },
|
|
|
+ onShow() {},
|
|
|
+ onHide() {},
|
|
|
+ onUnload() {},
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang="less" scoped>
|
|
|
+.container {
|
|
|
+ height: 100vh;
|
|
|
+ background: linear-gradient(180deg, #faede2 0%, #f4f4f4 100%);
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding-top: 20rpx;
|
|
|
+
|
|
|
+ .nomalNotice {
|
|
|
+ width: 712rpx;
|
|
|
+ margin: 0 auto;
|
|
|
+ box-sizing: border-box;
|
|
|
+
|
|
|
+ &.moreNotice {
|
|
|
+ margin-top: 56rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .nomalTitle {
|
|
|
+ padding-left: 38rpx;
|
|
|
+ font-family: MiSans;
|
|
|
+ color: #9d8179;
|
|
|
+ font-size: 28rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .nomal_contain {
|
|
|
+ padding: 10rpx 37rpx;
|
|
|
+ margin-top: 18rpx;
|
|
|
+ background: #ffffff;
|
|
|
+ border-radius: 37rpx;
|
|
|
+
|
|
|
+ .nomalItem {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+
|
|
|
+ .switchBox {
|
|
|
+ width: 600rpx;
|
|
|
+ height: 94rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ padding-top: 20rpx;
|
|
|
+ padding-bottom: 20rpx;
|
|
|
+ border-bottom: 2rpx solid #eef2f6;
|
|
|
+ background: #ffffff;
|
|
|
+
|
|
|
+ &.switchLast {
|
|
|
+ border-bottom: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ .name {
|
|
|
+ margin-left: 18rpx;
|
|
|
+ color: #111111;
|
|
|
+ font-size: 32rpx;
|
|
|
+ margin-bottom: 10rpx;
|
|
|
+
|
|
|
+ &.otherClass {
|
|
|
+ color: #999999;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .nomalLeft {
|
|
|
+ width: 250rpx;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ margin-left: auto;
|
|
|
+ color: #a0acbe;
|
|
|
+ font-size: 28rpx;
|
|
|
+ text-align: right;
|
|
|
+ margin-bottom: 10rpx;
|
|
|
+
|
|
|
+ .otherClass {
|
|
|
+ color: #999999;
|
|
|
+ }
|
|
|
+
|
|
|
+ image {
|
|
|
+ width: 12rpx;
|
|
|
+ height: 21rpx;
|
|
|
+ margin-left: 10rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .box {
|
|
|
+ position: fixed;
|
|
|
+ bottom: 0;
|
|
|
+ left: 0;
|
|
|
+ width: 100vw;
|
|
|
+ height: 168rpx;
|
|
|
+ padding: 0 37rpx;
|
|
|
+ background: #ffffff;
|
|
|
+ box-sizing: border-box;
|
|
|
+
|
|
|
+ .handle-btn {
|
|
|
+ margin-top: 40rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+
|
|
|
+ .btn2 {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ width: 700rpx;
|
|
|
+ height: 94rpx;
|
|
|
+ background: linear-gradient(
|
|
|
+ 105.95deg,
|
|
|
+ #a27867 0%,
|
|
|
+ #74483d 100%
|
|
|
+ );
|
|
|
+ border-radius: 28rpx;
|
|
|
+ box-shadow: 0rpx 4.69rpx 18.75rpx rgba(72, 41, 29, 0.15),
|
|
|
+ 0rpx 9.38rpx 9.38rpx rgba(154, 132, 89, 0.2),
|
|
|
+ 0rpx -4.69rpx 28.13rpx 4.69rpx #a16647 inset;
|
|
|
+ font-family: MiSans;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #ffffff;
|
|
|
+ font-size: 32rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|