HealthStudentWeb/src/views/myself/deviceSetting/healthMonitor.vue

<template>
  <div class="location-monitor-container">
    <!-- nav -->
    <div class="nav-bar">
      <van-nav-bar title="健康监测" left-text="返回" @click-left="onNavBack" left-arrow>
        <template #right>
          <!-- <div class="setupClock_save" @click="onSubmit">保存</div> -->
          <van-button type="primary" @click="onSubmit" size="small">保存</van-button>
        </template>
      </van-nav-bar>
    </div>
    <!-- main -->
    <div class="main">
      <!-- 血压 -->
      <div class="list">
        <div class="item" v-show="false">
          <div class="left">
            <span class="title">血压监测:</span>
          </div>
          <div class="right">
            <!-- <img :src="rightIcon" alt=""> -->
            <van-switch v-model="healthConfig.bloodenable" :active-color="$green" />
          </div>
        </div>

        <div class="item left-gray" v-show="healthConfig.bloodenable">
          <div class="left">
            <span class="title gray">检测周期:</span>
          </div>
          <div class="right" @click="onClick('bloodinteval')">
            <span>{{ healthConfig.bloodinteval }}分钟</span>
            <img :src="rightIcon" alt="" />
          </div>
        </div>

        <div class="item left-gray" v-show="healthConfig.bloodenable">
          <div class="left">
            <span class="title gray">告警阈值-收缩压:</span>
          </div>
          <div class="right" @click="onClick('bloodmaxvalue')">
            <span>{{ healthConfig.bloodmaxvalue }}</span>
            <img :src="rightIcon" alt="" />
          </div>
        </div>

        <!-- <div class="item left-gray" v-show="healthConfig.bloodenable">
                    <div class="left">
                        <span class="title gray">告警阈值-舒张压:</span>
                    </div>
                    <div class="right" @click="onClick('bloodminvalue')">
                        <span>{{ healthConfig.bloodminvalue}}</span>
                        <img :src="rightIcon" alt="">
                    </div>
                </div> -->

        <!-- <div class="item left-gray" v-show="healthConfig.bloodenable">
                    <div class="left">
                        <span class="title gray">告警周期:</span>
                    </div>
                    <div class="right" @click="onClick('bloodperiod')">
                        <span>{{ healthConfig.bloodperiod}}</span>
                        <img :src="rightIcon" alt="">
                    </div>
                </div> -->

        <div class="item alarmType left-gray" v-show="healthConfig.bloodenable">
          <div class="left">
            <span class="title gray">告警方式:</span>
          </div>
          <div class="right">
            <!-- <img :src="rightIcon" alt=""> -->
            <div class="checkbox-group">
              <!-- <van-checkbox-group v-model="temperatureAlarmType" direction="horizontal" @change="onCheckChange('temperature')" -->
              <van-checkbox
                name="bloodvibrateenabled"
                v-model="healthConfig.bloodvibrateenabled"
                shape="square"
                direction="horizontal"
                >震动</van-checkbox
              >
              <van-checkbox
                name="bloodlcdenabled"
                v-model="healthConfig.bloodlcdenabled"
                shape="square"
                direction="horizontal"
                >亮屏</van-checkbox
              >
              <!-- <van-checkbox name="temperaturereportenabled"  v-model="healthConfig.temperaturereportenabled" shape="square" direction="horizontal" @change="onChangeSingle('temperaturereportenabled')">上报数据</van-checkbox> -->
              <!-- </van-checkbox-group> -->
            </div>
          </div>
        </div>
      </div>
      <!-- 体温 -->
      <div class="list">
        <div class="item">
          <div class="left">
            <span class="title">体温监测:</span>
          </div>
          <div class="right">
            <!-- <img :src="rightIcon" alt=""> -->
            <van-switch v-model="healthConfig.temperatureenabled" :active-color="$green" />
          </div>
        </div>

        <div class="item left-gray" v-show="healthConfig.temperatureenabled">
          <div class="left">
            <span class="title gray">检测周期:</span>
          </div>
          <div class="right" @click="onClick('temperatureinteval')">
            <span>{{ formatInteval(healthConfig.temperatureinteval) }}</span>
            <img :src="rightIcon" alt="" />
          </div>
        </div>

        <div class="item left-gray" v-show="healthConfig.temperatureenabled">
          <div class="left">
            <span class="title gray">告警阈值-高温:</span>
          </div>
          <div class="right" @click="onClick('temperaturemaxvalue')">
            <span>{{ healthConfig.temperaturemaxvalue }}度</span>
            <img :src="rightIcon" alt="" />
          </div>
        </div>

        <div class="item left-gray" v-show="false">
          <div class="left">
            <span class="title gray">告警阈值-低温:</span>
          </div>
          <div class="right" @click="onClick('temperatureminvalue')">
            <span>{{ healthConfig.temperatureminvalue }}度</span>
            <img :src="rightIcon" alt="" />
          </div>
        </div>

        <div class="item alarmType left-gray" v-show="healthConfig.temperatureenabled">
          <div class="left">
            <span class="title gray">告警方式:</span>
          </div>
          <div class="right">
            <!-- <img :src="rightIcon" alt=""> -->
            <div class="checkbox-group">
              <!-- <van-checkbox-group v-model="temperatureAlarmType" direction="horizontal" @change="onCheckChange('temperature')" -->
              <van-checkbox
                name="temperaturevibrateenabled"
                v-model="healthConfig.temperaturevibrateenabled"
                shape="square"
                direction="horizontal"
                >震动</van-checkbox
              >
              <van-checkbox
                name="temperaturelcdenabled"
                v-model="healthConfig.temperaturelcdenabled"
                shape="square"
                direction="horizontal"
                >亮屏</van-checkbox
              >
              <!-- <van-checkbox name="temperaturereportenabled"  v-model="healthConfig.temperaturereportenabled" shape="square" direction="horizontal" @change="onChangeSingle('temperaturereportenabled')">上报数据</van-checkbox> -->
              <!-- </van-checkbox-group> -->
            </div>
          </div>
        </div>
      </div>

      <div class="list">
        <div class="item">
          <div class="left">
            <span class="title">心率监测:</span>
          </div>
          <div class="right">
            <!-- <img :src="rightIcon" alt=""> -->
            <van-switch v-model="healthConfig.heartrateenabled" :active-color="$green" />
          </div>
        </div>

        <div class="item left-gray" v-show="healthConfig.heartrateenabled">
          <div class="left">
            <span class="title gray">检测周期:</span>
          </div>
          <div class="right" @click="onClick('heartrateinteval')">
            <span>{{ formatInteval(healthConfig.heartrateinteval) }}</span>
            <img :src="rightIcon" alt="" />
          </div>
        </div>

        <div class="item left-gray" v-show="healthConfig.heartrateenabled">
          <div class="left">
            <span class="title gray">告警阈值-上限:</span>
          </div>
          <div class="right" @click="onClick('heartratemaxvalue')">
            <span>{{ healthConfig.heartratemaxvalue }}次</span>
            <img :src="rightIcon" alt="" />
          </div>
        </div>

        <div class="item left-gray" v-show="healthConfig.heartrateenabled">
          <div class="left">
            <span class="title gray">告警阈值-下限:</span>
          </div>
          <div class="right" @click="onClick('heartrateminvalue')">
            <span>{{ healthConfig.heartrateminvalue }}次</span>
            <img :src="rightIcon" alt="" />
          </div>
        </div>

        <div class="item alarmType left-gray" v-show="healthConfig.heartrateenabled">
          <div class="left">
            <span class="title gray">告警方式:</span>
          </div>
          <div class="right">
            <!-- <img :src="rightIcon" alt=""> -->
            <div class="checkbox-group">
              <!-- <van-checkbox-group v-model="heartrateAlarmType" direction="horizontal" > -->
              <van-checkbox
                name="heartratevibrateenabled"
                v-model="healthConfig.heartratevibrateenabled"
                shape="square"
                direction="horizontal"
                >震动</van-checkbox
              >
              <van-checkbox
                name="heartratelcdenabled"
                v-model="healthConfig.heartratelcdenabled"
                shape="square"
                direction="horizontal"
                >亮屏</van-checkbox
              >
              <!-- <van-checkbox name="heartratereportenabled" v-model="healthConfig.heartratereportenabled" shape="square" direction="horizontal" @change="onChangeSingle('heartratereportenabled')">上报数据</van-checkbox> -->
              <!-- </van-checkbox-group> -->
            </div>
          </div>
        </div>
      </div>

      <div class="list">
        <div class="item">
          <div class="left">
            <span class="title">血氧监测:</span>
          </div>
          <div class="right">
            <!-- <img :src="rightIcon" alt=""> -->
            <van-switch v-model="healthConfig.spo2enabled" :active-color="$green" />
          </div>
        </div>

        <div class="item left-gray" v-show="healthConfig.spo2enabled">
          <div class="left">
            <span class="title gray">检测周期:</span>
          </div>
          <div class="right" @click="onClick('spo2inteval')">
            <span>{{ formatInteval(healthConfig.spo2inteval) }}</span>
            <img :src="rightIcon" alt="" />
          </div>
        </div>

        <!-- <div class="item left-gray" v-show="healthConfig.spo2enabled">
                    <div class="left">
                        <span class="title gray">告警阈值-高于:</span>
                    </div>
                    <div class="right" @click="onClick('spo2maxvalue')">
                        <span>{{ healthConfig.spo2maxvalue}}%</span>
                        <img :src="rightIcon" alt="">
                    </div>
                </div> -->
        <div class="item left-gray" v-show="healthConfig.spo2enabled">
          <div class="left">
            <span class="title gray">告警阈值-低于:</span>
          </div>
          <div class="right" @click="onClick('spo2minvalue')">
            <span>{{ healthConfig.spo2minvalue }}%</span>
            <img :src="rightIcon" alt="" />
          </div>
        </div>

        <div class="item alarmType left-gray" v-show="healthConfig.spo2enabled">
          <div class="left">
            <span class="title gray">告警方式:</span>
          </div>
          <div class="right">
            <!-- <img :src="rightIcon" alt=""> -->
            <div class="checkbox-group">
              <!-- <van-checkbox-group v-model="heartrateAlarmType" direction="horizontal" > -->
              <van-checkbox
                name="spo2vibrateenabled"
                v-model="healthConfig.spo2vibrateenabled"
                shape="square"
                direction="horizontal"
                >震动</van-checkbox
              >
              <van-checkbox
                name="spo2lcdenabled"
                v-model="healthConfig.spo2lcdenabled"
                shape="square"
                direction="horizontal"
                >亮屏</van-checkbox
              >
              <!-- <van-checkbox name="spo2reportenabled" v-model="healthConfig.spo2reportenabled" shape="square" direction="horizontal" @change="onChangeSingle('spo2reportenabled')">上报数据</van-checkbox> -->
              <!-- </van-checkbox-group> -->
            </div>
          </div>
        </div>
      </div>
    </div>

    <!-- 弹窗 -->
    <van-dialog v-model="dialog.isDialogshow" show-cancel-button cancel-button-text="返回" :show-confirm-button="false">
      <template #title>
        <div class="title">
          <span>设置</span>
        </div>
      </template>
      <template #default>
        <div class="dialog-container">
          <div class="selectConfirm">
            <div class="con">
              <van-cell v-for="(item, index) in dialog.confirmData" :key="`selectVPT${index}`" @click="onSelect(item)">
                <div class="text">
                  <div v-html="item.text"></div>
                </div>
                <em :class="['circle', { on: selectConfirmActive == index }]"></em>
              </van-cell>
            </div>
          </div>
        </div>
      </template>
    </van-dialog>
  </div>
</template>

<script>
import ToastService from '@/services/toast-service';
import DialogService from '@/services/dialog-service';
import APIHealthy from '@/api/heathly';
export default {
  name: '',
  data() {
    return {
      rightIcon: require('../../../assets/img/health/right_more.png'),
      checked: false,
      sampleinteval: '', //上报频率-定位检测
      temperatureAlarmType: ['temperaturevibrateenabled', 'temperaturelcdenabled', 'temperaturereportenabled'], //体温告警方式
      heartrateAlarmType: ['heartratevibrateenabled', 'heartratelcdenabled', 'heartratereportenabled'], //心率
      spo2AlarmType: ['spo2vibrateenabled', 'spo2lcdenabled', 'spo2reportenabled'], //血氧
      dialog: {
        isDialogshow: false,
        title: '上报频率',
        confirmData: []
      },
      // todo 以下这些弹窗列表可以用函数生成
      //    检测周期时间数据
      monitorList: [
        {
          text: '10分钟',
          model: 0,
          checked: false,
          value: 10
        },
        {
          text: '15分钟',
          model: 1,
          checked: false,
          value: 15
        },
        /* {
                text: "20分钟",
                model: 2,
                checked: false,
                value: 20
                }, */
        {
          text: '30分钟',
          model: 3,
          checked: false,
          value: 30
        },
        /*  {
                text: "40分钟",
                model: 4,
                checked: false,
                value: 40
                },
                {
                text: "50分钟",
                model: 5,
                checked: false,
                value: 50
                }, */
        {
          text: '60分钟',
          model: 6,
          checked: false,
          value: 60
        },
        {
          text: '6小时',
          model: 7,
          checked: false,
          value: 360
        },
        {
          text: '8小时',
          model: 8,
          checked: false,
          value: 480
        }
      ],
      //血压弹窗收缩压数据
      bloodMaxList: [
        {
          text: '140',
          model: 0,
          checked: false,
          className: 'circle',
          value: 140,
          name: '血压监测'
        },
        {
          text: '160',
          model: 1,
          checked: false,
          className: 'circle',
          value: 160,
          name: '血压监测'
        },
        {
          text: '180',
          model: 2,
          checked: false,
          className: 'circle',
          value: 180,
          name: '血压监测'
        }
      ],
      //血压弹窗舒张值上限数据
      bloodMinList: [
        {
          text: '90',
          model: 0,
          checked: false,
          className: 'circle',
          value: 90,
          name: '血压监测'
        },
        {
          text: '100',
          model: 1,
          checked: false,
          className: 'circle',
          value: 100,
          name: '血压监测'
        },
        {
          text: '110',
          model: 2,
          checked: false,
          className: 'circle',
          value: 110,
          name: '血压监测'
        }
      ],

      //体温弹窗最大数据
      temperatureMaxList: [
        {
          text: '37.3°C(低烧)',
          model: 0,
          checked: false,
          className: 'circle',
          value: 37.3,
          name: '体温监测'
        },
        /* {
          text: "37.5°C",
          model: 1,
          checked: false,
          className: "circle",
          value: 37.5,
          name: '体温监测'
        }, */
        /* {
          text: "37.8°C",
          model: 2,
          checked: false,
          className: "circle",
          value: 37.8,
          name: '体温监测'
        }, */
        {
          text: '38.1°C(中烧)',
          model: 1,
          checked: false,
          className: 'circle',
          value: 38.1,
          name: '体温监测'
        },
        {
          text: '39.1°C(高烧)',
          model: 2,
          checked: false,
          className: 'circle',
          value: 39.1,
          name: '体温监测'
        }
        /* {
          text: "41°C",
          model: 5,
          checked: false,
          className: "circle",
          value: 41,
          name: '体温监测'
        },
        {
          text: "42°C",
          model: 6,
          checked: false,
          className: "circle",
          value: 42,
          name: '体温监测'
        },
        {
          text: "43°C",
          model: 7,
          checked: false,
          className: "circle",
          value: 43,
          name: '体温监测'
        }, */
      ],
      //体温弹窗最大数据
      temperatureMinList: [
        {
          text: '32°C',
          model: 0,
          checked: false,
          className: 'circle',
          value: 32,
          name: '体温监测'
        },
        {
          text: '33°C',
          model: 1,
          checked: false,
          className: 'circle',
          value: 33,
          name: '体温监测'
        },
        {
          text: '34°C',
          model: 2,
          checked: false,
          className: 'circle',
          value: 34,
          name: '体温监测'
        },
        {
          text: '35°C',
          model: 3,
          checked: false,
          className: 'circle',
          value: 38,
          name: '体温监测'
        },
        {
          text: '36°C',
          model: 4,
          checked: false,
          className: 'circle',
          value: 36,
          name: '体温监测'
        }
        /* {
          text: "37.1°C",
          model: 5,
          checked: false,
          className: "circle",
          value: 37.1,
          name: '体温监测'
        }, */
      ],
      //心率弹窗最大数据
      heartRateMaxList: [
        /* {
          text: "90次",
          model: 0,
          checked: false,
          className: "circle",
          value: 90,
          name: '心率监测'
        },
        {
          text: "100次",
          model: 1,
          checked: false,
          className: "circle",
          value: 100,
           name: '心率监测'
        }, */
        {
          text: '120次(非运动)',
          model: 0,
          checked: false,
          className: 'circle',
          value: 120,
          name: '心率监测'
        },
        /* {
          text: "140次",
          model: 3,
          checked: false,
          className: "circle",
          value: 140,
           name: '心率监测'
        },
        {
          text: "160次",
          model: 4,
          checked: false,
          className: "circle",
          value: 160,
           name: '心率监测'
        }, */
        {
          text: '180次(运动)',
          model: 1,
          checked: false,
          className: 'circle',
          value: 180,
          name: '心率监测'
        }
        /* {
          text: "200次",
          model: 6,
          checked: false,
          className: "circle",
          value: 200,
           name: '心率监测'
        }, */
        /* {
          text: "210次",
          model: 7,
          checked: false,
          className: "circle",
          value: 210,
           name: '心率监测'
        }, */
      ],
      //心率弹窗最小数据
      heartRateMinList: [
        {
          text: '40次',
          model: 0,
          checked: false,
          className: 'circle',
          value: 40,
          name: '心率监测'
        },
        {
          text: '50次',
          model: 1,
          checked: false,
          className: 'circle',
          value: 50,
          name: '心率监测'
        },
        {
          text: '60次',
          model: 2,
          checked: false,
          className: 'circle',
          value: 60,
          name: '心率监测'
        }
        /*  {
          text: "60次",
          model: 3,
          checked: false,
          className: "circle",
          value: 60,
           name: '心率监测'
        },
        {
          text: "70次",
          model: 4,
          checked: false,
          className: "circle",
          value: 70,
           name: '心率监测'
        },
        {
          text: "80次",
          model: 5,
          checked: false,
          className: "circle",
          value: 80,
           name: '心率监测'
        }, */
      ],
      //血氧弹窗最小数据
      spo2MinList: [
        {
          text: '94%(轻微)',
          model: 0,
          checked: false,
          className: 'circle',
          value: 94,
          name: '血氧监测'
        },
        {
          text: '89%(中度)',
          model: 1,
          checked: false,
          className: 'circle',
          value: 89,
          name: '血氧监测'
        },
        {
          text: '85%(严重)',
          model: 2,
          checked: false,
          className: 'circle',
          value: 85,
          name: '血氧监测'
        },
        /* {
          text: "94%(默认)",
          model: 3,
          checked: false,
          className: "circle",
          value: 94,
          name: '血氧监测'
        }, */
        {
          text: '98%(临时测试)',
          model: 3,
          checked: false,
          className: 'circle',
          value: 98,
          name: '血氧监测'
        }
      ],
      //血氧弹窗最大数据
      spo2MaxList: [
        {
          text: '98%',
          model: 0,
          checked: false,
          className: 'circle',
          value: 98,
          name: '血氧监测'
        }
      ],
      selectConfirmActive: 0,
      currentDiallogName: '',
      healthConfig: {
        /* bloodenabled: false,
           bloodmaxvalue: 140, //血压-高温阈值
           bloodminvalue: 90, //血压-低温阈值
           bloodinteval: 60, //血压-检测周期
           bloodvibrateenabled: false, //血压异常时是否震动
           bloodlcdenabled: false, //血压异常时是否亮屏
           bloodreportenabled: true, //血压异常时是否上报数据
           bloodperiod: 60, //血压-检测周期 */

        temperatureenabled: false,
        temperaturemaxvalue: 38, //体温-高温阈值
        temperatureminvalue: 0, //体温-低温阈值
        temperatureinteval: 60, //体温-检测周期
        temperaturevibrateenabled: false, //体温异常时是否震动
        temperaturelcdenabled: false, //体温异常时是否亮屏
        temperaturereportenabled: true, //体温异常时是否上报数据

        heartrateenabled: false,
        heartratemaxvalue: 120, //心率-高温阈值
        heartrateminvalue: 40, //心率-低温阈值
        heartrateinteval: 60, //心率-检测周期
        heartratevibrateenabled: false, //心率异常时是否震动
        heartratelcdenabled: false, //心率异常时是否亮屏
        heartratereportenabled: true, //心率异常时是否上报数据

        spo2enabled: false,
        spo2maxvalue: 0, //血氧-高温阈值
        spo2inteval: 60,
        spo2minvalue: 94, //血氧-检测周期
        spo2vibrateenabled: false, //血氧异常时是否震动
        spo2lcdenabled: false, //血氧异常时是否亮屏
        spo2reportenabled: true, //血氧异常时是否上报数据
        imei: this.$store.getters.serialNo,
        isTime: true,
        times: [
          { startTime: '08:00', endTime: '12:00' },
          { startTime: '14:00', endTime: '16:00' }
        ]
      }
    };
  },
  computed: {
    imei() {
      return this.$store.getters.serialNo;
    }
  },
  created() {
    this.getHealthConfig();
  },
  methods: {
    onNavBack() {
      this.$router.push({
        name: 'watchSetting'
      });
    },
    onSubmit() {
      ToastService.loading({ message: '设置中' });
      // dataObj[Object.keys(tempData)[index]] = item
      let reqBody = {}; //用新对象去接收原来对象里的值
      Object.values(this.healthConfig).filter((item, index) => {
        if (typeof item === 'boolean') {
          item = item === false ? 0 : 1;
          reqBody[Object.keys(this.healthConfig)[index]] = item;
        } else {
          reqBody[Object.keys(this.healthConfig)[index]] = item;
        }
      });
      reqBody.temperaturemaxvalue = reqBody.temperaturemaxvalue * 10;
      reqBody.temperatureminvalue = /* reqBody.temperatureminvalue * 10 */ 0;
      reqBody.isTime = true;
      APIHealthy.setHealthConfig(reqBody)
        .then(res => {
          if (res.data.stateCode === 1) {
            ToastService.success({ message: '设置成功' });
            setTimeout(() => {
              this.$router.push({
                name: 'watchSetting'
              });
            }, 1500);
          } else {
            DialogService.confirm({
              title: '设置失败',
              message: `${res.data.message}`
            });
          }
        })
        .catch(e => {
          DialogService.confirm({
            title: '设置失败',
            message: `${e.message}`
          });
        })
        .finally(() => {
          setTimeout(() => {
            ToastService.clear();
          }, 1500);
        });
    },
    onSelect(data) {
      this.healthConfig[this.currentDiallogName] = data.value;
      this.selectConfirmActive = data.model;
      this.dialog.isDialogshow = false;
    },
    onClick(name) {
      this.currentDiallogName = name;
      this.dialog.confirmData = [];
      const intevalList = ['temperatureinteval', 'spo2inteval', 'heartrateinteval', 'bloodinteval'];
      if (intevalList.includes(name)) {
        this.dialog.confirmData = this.monitorList.filter(item => {
          if (name === 'bloodinteval') {
            return item.value >= 20;
          } /* else if(name === 'temperatureinteval') {
                    let delData = [20, 40, 50];
                    return delData.indexOf(item.value) === -1
                }  */ else {
            return item.value;
          }
        });
      } else if (name === 'bloodmaxvalue') {
        // 血压-收缩压
        this.dialog.confirmData = this.bloodMaxList;
      } else if (name === 'bloodminvalue') {
        // 血压-舒张压
        this.dialog.confirmData = this.bloodMinList;
      } else if (name === 'temperaturemaxvalue') {
        // 体温最大
        this.dialog.confirmData = this.temperatureMaxList;
      } else if (name === 'temperatureminvalue') {
        // 体温最小
        this.dialog.confirmData = this.temperatureMinList;
      } else if (name === 'heartratemaxvalue') {
        // 心率最大
        this.dialog.confirmData = this.heartRateMaxList;
      } else if (name === 'heartrateminvalue') {
        // 心率最小
        this.dialog.confirmData = this.heartRateMinList;
      } else if (name === 'spo2minvalue') {
        // 测试环境 启用98% 正式环境屏蔽
        if (process.env.NODE_ENV === 'production') {
          this.spo2MinList = this.spo2MinList.filter(item => {
            return item.value !== 98;
          });
        }
        // 血氧最小
        this.dialog.confirmData = this.spo2MinList;
      } else if (name === 'spo2maxvalue') {
        // 血氧最小
        this.dialog.confirmData = this.spo2MaxList;
      }
      let seclectIndex = this.dialog.confirmData.findIndex(item => {
        return item.value === this.healthConfig[name];
      });
      this.selectConfirmActive = seclectIndex;
      this.dialog.isDialogshow = true;
    },
    getResult(number1, number2) {
      const result = parseInt(number1) / parseInt(number2);
      return result.toString().indexOf('.') != -1 ? parseInt(result).toFixed(2).slice(0, 1) : result;
    },
    getHealthConfig() {
      ToastService.loading({ message: '数据加载中' });
      APIHealthy.getHealthConfig({ imei: this.imei })
        .then(res => {
          ToastService.success({ message: '数据加载完成' });
          let data = res.data.data;
          if (data) {
            let healthObj = data.config;
            let healthConfig = this.healthConfig;
            healthConfig.heartrateenabled = healthObj.heartrateenabled === 1 ? true : false;
            healthConfig.heartratelcdenabled = healthObj.heartratelcdenabled === 1 ? true : false;
            healthConfig.heartratereportenabled = healthObj.heartratereportenabled === 1 ? true : false;
            healthConfig.heartratevibrateenabled = healthObj.heartratevibrateenabled === 1 ? true : false;
            healthConfig.heartrateminvalue = healthObj.heartrateminvalue === 0 ? 60 : healthObj.heartrateminvalue;
            healthConfig.heartratemaxvalue = healthObj.heartratemaxvalue === 0 ? 180 : healthObj.heartratemaxvalue;
            healthConfig.heartrateinteval = healthObj.heartrateinteval;

            healthConfig.spo2enabled = healthObj.spo2enabled === 1 ? true : false;
            healthConfig.spo2lcdenabled = healthObj.spo2lcdenabled === 1 ? true : false;
            healthConfig.spo2reportenabled = healthObj.spo2reportenabled === 1 ? true : false;
            healthConfig.spo2vibrateenabled = healthObj.spo2vibrateenabled === 1 ? true : false;
            healthConfig.spo2minvalue = healthObj.spo2minvalue === 95 ? 94 : healthObj.spo2minvalue;
            healthConfig.spo2maxvalue = /* healthObj.spo2maxvalue === 0 ? 98 : healthObj.spo2maxvalue */ 0;
            healthConfig.spo2inteval = healthObj.spo2inteval;

            healthConfig.temperatureenabled = healthObj.temperatureenabled === 1 ? true : false;
            healthConfig.temperaturelcdenabled = healthObj.temperaturelcdenabled === 1 ? true : false;
            healthConfig.temperaturereportenabled = healthObj.temperaturereportenabled === 1 ? true : false;
            healthConfig.temperaturevibrateenabled = healthObj.temperaturevibrateenabled === 1 ? true : false;
            healthConfig.temperatureinteval = healthObj.temperatureinteval;
            healthConfig.temperaturemaxvalue = healthObj.temperaturemaxvalue / 10;
            healthConfig.temperatureminvalue =
              healthObj.temperatureminvalue === 0 ? 36 : healthObj.temperatureminvalue / 10;
          }
        })
        .catch(e => {
          console.log('e', e);
          DialogService.confirm({
            message: `${e.message}`
          });
        })
        .finally(() => {
          setTimeout(() => {
            ToastService.clear();
          }, 1500);
        });
    },
    // 格式化某些特殊参数值的时间显示方式
    formatInteval(value) {
      return value >= 360 ? value / 60 + '小时' : value + '分钟';
    }
  }
};
</script>

<style scoped lang="scss">
.location-monitor-container {
  height: 100vh;
  overflow: hidden;
  .nav-bar {
    height: 100px;
    padding: 0 20px;
  }
  .main {
    height: calc(100vh - 160px);
    background-color: $background;
    padding: 20px;
    overflow: scroll;
    .list {
      height: auto;
      background-color: #fff;
      border-radius: 8px;
      margin-bottom: 20px;
      .item {
        height: auto;
        padding: 20px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        border-bottom: 2px solid #e5e5e5;
        .left {
          @include center();
          span {
            color: #282828;
            font-size: 32px;
          }
          .title {
            font-weight: 450;
            &.gray {
              color: gray;
            }
          }
        }
        .right {
          /* width: 60%; */
          @include center();
          font-size: 32px;
          img {
            height: 35px;
            width: 35px;
          }
          span {
            font-size: 32px;
            margin-right: 10px;
            color: #aaaaaa;
          }
          .checkbox-group {
            @include center();
            .van-checkbox {
              padding: 5px;
            }
          }
        }
        &.left-gray {
          padding-left: 30px;
          color: gray;
        }
        &.alarmType {
          height: 180px;
          display: flex;
          justify-content: flex-start;
          align-items: flex-start;
          .left {
          }
          .right {
            margin-left: 40px;
            width: 60%;
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
          }
        }
      }
    }
  }
  .title {
    font-size: 32px;
  }
  .selectConfirm {
    padding: 0;
    .con {
      .van-cell {
        height: 60px;
        .van-cell__value {
          em {
            font-style: normal;
            position: absolute;
            top: 0;
            right: 0;
            @include colorAndFont(#999, 24);
            &.circle {
              width: 20px;
              height: 20px;
              border: 2px solid #bfbfbf;
              border-radius: 50%;
              position: absolute;
              right: 15px;

              &.on {
                border-color: $green;

                &:before {
                  content: '';
                  position: absolute;
                  left: 50%;
                  top: 50%;
                  transform: translate(-50%, -50%);
                  width: 14px;
                  height: 14px;
                  background: $green;
                  border-radius: 50%;
                }
              }
            }
          }
        }
      }
    }
  }
}
</style>