Browse Source

fix: 加班和场景的静态页面

chenzhen2 2 years ago
parent
commit
ca6d99b1a3

File diff suppressed because it is too large
+ 10 - 0
public/images/ipdImages/sanhui.svg


File diff suppressed because it is too large
+ 29 - 0
public/images/ipdImages/taolun.svg


File diff suppressed because it is too large
+ 9 - 0
public/images/ipdImages/touying.svg


File diff suppressed because it is too large
+ 0 - 57
public/images/ipdImages/图层 2.svg


File diff suppressed because it is too large
+ 17 - 0
public/images/page-officehome/goOffWork.svg


BIN
public/images/page-officehome/officehome.jpg


File diff suppressed because it is too large
+ 17 - 0
public/images/page-officehome/work.svg


+ 4 - 0
src/apis/envmonitor.ts

@@ -169,3 +169,7 @@ export const getWorkTimeList = (params: any) => {
   return https().request<any>(`${duoduoenvService}customScene/queryCustomAndScence?${params}`)
 }
 
+export const querySpaceSceneConfig=(params: any)=>{
+  return https().request<any>(`${setupService}scene/querySpaceSceneConfig${params}`, Method.GET, undefined, ContentType.json)
+}
+

+ 18 - 16
src/styles/_variables.scss

@@ -1,32 +1,34 @@
 /* Variables */
 
 // Base color
-$blue:#324157;
-$light-blue:#3A71A8;
-$red:#C03639;
+$blue: #324157;
+$light-blue: #3A71A8;
+$red: #C03639;
 $pink: #E65D6E;
 $green: #30B08F;
 $tiffany: #4AB7BD;
-$yellow:#FEC171;
+$yellow: #FEC171;
 $panGreen: #30B08F;
 
 // Sidebar
-$sideBarWidth:300px;
-$subMenuBg:#1f2d3d;
-$subMenuHover:#001528;
-$subMenuActiveText:#f4f4f5;
-$menuBg:#fff;
-$menuText:#162B64;
-$menuActiveText:#435EBE; // Also see settings.sidebarTextTheme
+$sideBarWidth: 300px;
+$subMenuBg: #1f2d3d;
+$subMenuHover: #001528;
+$subMenuActiveText: #f4f4f5;
+$menuBg: #fff;
+$menuText: #162B64;
+$menuActiveText: #435EBE; // Also see settings.sidebarTextTheme
 
 // Login page
 $lightGray: #eee;
-$darkGray:#889aa4;
+$darkGray: #889aa4;
 $loginBg: #2d3a4b;
 $loginCursorColor: #fff;
-$elActiveColor:#CE9F27;
-$elActiveText:#fff;
-$elDeleteColor:#E5574F;
+$elActiveColor: #CE9F27;
+$elActive4: rgba(206, 159, 39, 0.4);
+$elActiveText: #fff;
+$elDeleteColor: #E5574F;
+$bg: '/borui/images/page-officehome/officehome.jpg';
 
 // The :export directive is the magic sauce for webpack
 // https://mattferderer.com/use-sass-variables-in-typescript-and-javascript
@@ -34,4 +36,4 @@ $elDeleteColor:#E5574F;
   menuBg: $menuBg;
   menuText: $menuText;
   menuActiveText: $menuActiveText;
-}
+}

+ 5 - 2
src/styles/index.scss

@@ -160,7 +160,10 @@ div:focus {
 
 .popup-content {
   height: 100%;
-  min-width: 375px;
-  width: 375px;
+  min-width: 330px;
+  width: 330px;
   //width: 39%;
 }
+.van-switch--on {
+  background: $elActiveColor !important;
+}

+ 0 - 830
src/views/envmonitor/Air.vue

@@ -1,830 +0,0 @@
-<template>
-  <div class="air">
-    <div class="air-top">
-      <div class="air-desc">
-        <p class="air-title">
-          空调
-        </p>
-        <p class="air-temperature" v-if="temperature">
-          {{ temperature ? temperature : '--' }}
-          <sup>℃</sup>
-        </p>
-        <p class="air-model">
-          <span v-if="modeName">
-            {{ modeName }}
-          </span>
-          <span v-if="airData.tempSet">
-            {{ airData.tempSet }}℃
-          </span>
-        </p>
-        <p class="air-status" v-if="hasAir">
-          {{ airData.isOpen ? '空调已开启' : '空调已关闭' }}
-        </p>
-        <p class="air-loading" v-if="airData.isOpen">
-          <img
-            v-if="airData.icon==1 || airData.icon==2 || airData.icon==3"
-            :src="airRunImg"
-            alt=""
-          >
-          <span>{{ airData.spaceStatus }}</span>
-        </p>
-      </div>
-      <div class="air-right">
-        <img
-          v-if="airData.airImg"
-          :src="airData.airImg"
-          alt=""
-        >
-        <van-loading
-          style="padding-top: 20px;"
-          v-else
-        />
-
-        <Switch class="switch-btn"
-                active-color="#FFE823"
-                :loading="loadingAir || firstLoadingAir"
-                :disabled="!userIsControl || loadingAir || firstLoadingAir"
-                inactive-color="rgba(196, 196, 196, 0.2)"
-                size="24px"
-                @click="airChange"
-                :model-value="airData.isOpen" v-if="hasAir"
-        />
-      </div>
-    </div>
-    <!--温度调节-->
-    <div class="air-control" v-if="userIsControl && airData.isOpen">
-      <div class="control-title">
-        温度调节
-      </div>
-      <div class="btn-box">
-        <div class="control-btn mr20" @click.stop="changeAir(4, 'temp','toCold')">
-          <img
-            :src="parseImgUrl('envmonitor','arrow-top.png')"
-            alt=""
-          >
-        </div>
-        <div class="control-btn" @click.stop=" changeAir(2, 'temp','toWarm')">
-          <img
-            :src="parseImgUrl('envmonitor','arrow-down.png')"
-            alt=""
-          >
-        </div>
-      </div>
-    </div>
-    <div class="air-control" v-if="userIsControl && airData.isOpen  && showAirVolumeBtn">
-      <div class="control-title">
-        风量调节
-      </div>
-      <div class="btn-box">
-        <div class="control-btn mr20" @click.stop="changeAir(5,'wind','toWindLow')">
-          <img
-            class="temp-img"
-            :src="parseImgUrl('envmonitor','fengshan.png')"
-            alt=""
-          >
-        </div>
-        <div class="control-btn" @click.stop="changeAir(6,'wind','toWindUp')">
-          <img
-            class="temp-img"
-            :src="parseImgUrl('envmonitor','wendu.png')"
-            alt=""
-          >
-        </div>
-      </div>
-    </div>
-
-    <!-- 空调反馈 文案 -->
-    <van-dialog v-model:show="showDialog"
-                class="dialog-width"
-                :show-confirm-button="false"
-                :show-cancel-button="false"
-    >
-      <div class="air-dialog-content">
-        <div class="dialog-top">
-          <img
-            class="img-greey"
-            :class="airSetText.toWhere == 'toCold'?'img-blue':airSetText.toWhere == 'toWarm'?'img-red':''"
-            :src="parseImgUrl('page-officehome',airSetText.nowImg)" alt=""
-          >
-        </div>
-        <div class="dialog-text">
-          <div
-            class="air-body-item-num"
-            v-if="airSetText.toWhere === 'toCold' || airSetText.toWhere === 'toWarm'"
-          >
-            <div class="air-temp-num">{{ temperature }}</div>
-            <div
-              class="air-temp-num"
-              :class="{'arrow-cooling':airSetText.toWhere=='toCold', 'arrow-warn':airSetText.toWhere=='toWarm'}"
-            >→
-            </div>
-            <div v-if="airSetText.designTemperature" class="air-temp-num">{{ airSetText.designTemperature }}</div>
-            <div v-else class="air-temp-num-load">
-              <img style="padding-top: 4px; height: 20px;width: 20px;"
-                   :src="parseImgUrl('page-officehome','loading.svg')"
-              />
-            </div>
-
-          </div>
-          <p v-if="airSetText.notice" class="air-notice"><span>{{ airSetText.notice }}</span></p>
-          <div v-else class="air-temp-load">
-            <van-loading type="spinner"/>
-          </div>
-        </div>
-        <div class="dialog-btns" @click.stop="closeDialog">
-          <span>确定</span>
-        </div>
-      </div>
-    </van-dialog>
-  </div>
-</template>
-
-<script lang="ts">
-import {
-  defineComponent,
-  onMounted,
-  reactive,
-  toRefs,
-  computed,
-  watch,
-  onUnmounted,
-  onBeforeMount,
-  onBeforeUnmount
-} from 'vue'
-import { Switch, Dialog, Loading, Toast } from 'vant'
-import { changeTempHttp, getEquipmentListHttp, getFeedbackDocumentsHttp } from '@/apis/envmonitor'
-import { parseImgUrl } from '@/utils'
-import any = jasmine.any
-
-export default defineComponent({
-  props: {
-    temperature: {  // 空调基本信息
-      type: Number,
-      default: () => 0
-    },
-    hasAir: {  // 有无空调
-      type: Boolean,
-      default: () => false
-    },
-    airVolumes: {  // 风量信息
-      type: Array,
-      default: () => []
-    },
-    projectId: {
-      type: String,
-      default: () => ''
-    },
-    spaceId: {
-      type: String,
-      default: () => ''
-    },
-    userIsControl: {
-      type: Boolean,
-      default: () => false
-    }
-  },
-  components: {
-    Switch,
-    [Dialog.Component.name]: Dialog.Component,
-    Loading
-  },
-  setup(props, contx) {
-    const propsVal = props
-    let airData: any = {
-      avg: '--',                // 算法调节温度(目标值)
-      icon: 1,                // 固定框文案ID 7 为关机,其它都是开机
-      spaceStatus: '',    // 固定框文案展示
-      notice: '',                // 弹框文案展示
-      mode: 0,  //  模式
-      tempSet: 0, // 温度
-      isOpen: false // 空调开关 true 是开
-    }
-    const feedbackTimer: any = null
-    const airTimer: any = null
-    const domAirOpeen: any = ''
-    const proxyData = reactive({
-      loadingAir: false,
-      temperature: props.temperature,
-      userIsControl: props.userIsControl,
-      firstLoadingAir: true,
-      domAirOpeen: domAirOpeen,
-      feedbackTimer: feedbackTimer,
-      parseImgUrl: parseImgUrl,
-      airData: airData,
-      modeName: '',
-      showAirVolumeBtn: true,  // 是否展示风量调节按钮
-      showDialog: false,
-      airTimer: airTimer,
-      airSetText: {   // 空调反馈文案
-        notice: '',
-        nowImg: '',
-        toWhere: '',
-        designTemperature: 0
-      },
-      // 格式化模式
-      formateModel(model: any) {
-        if (model) {
-          if (model === 1) {
-            proxyData.modeName = '制冷'
-          } else if (model === 2) {
-            proxyData.modeName = '制热'
-          } else if (model === 3) {
-            proxyData.modeName = '通风'
-          } else if (model === 4) {
-            proxyData.modeName = '除湿'
-          } else {
-            proxyData.modeName = ''
-          }
-        } else {
-          proxyData.modeName = ''
-        }
-      },
-      // 获取设备类型(ACATVI)
-      getEquipmentListHttp() {
-        let params = {
-          spaceId: props.spaceId
-        }
-        proxyData.showAirVolumeBtn = true
-        getEquipmentListHttp(params).then(res => {
-          let resData: any = res
-          let data: any = resData ? resData.data : []
-          data.map((item: any) => {
-            if (item.equipmentCategory === 'ACATVI') {   //
-              proxyData.showAirVolumeBtn = false
-              return
-            }
-          })
-        })
-      },
-      // 定时获取空调状态
-      getAirInfoToTimer() {
-        proxyData.poll()
-      },
-      // 清除定时器
-      poll() {
-        if (proxyData.airTimer) {
-          clearTimeout(proxyData.airTimer)
-        }
-        proxyData.airTimer = setTimeout(function() {
-          proxyData.getAirInfo()
-        }, 1000)
-        // proxyData.airTimer = setInterval(function() {
-        //   proxyData.getAirInfo()
-        // }, 1000)
-      },
-      // 关闭空调的按钮点击的loading状态
-      closeLoading() {
-        if (proxyData.domAirOpeen !== '') {
-          if (proxyData.domAirOpeen === proxyData.airData.isOpen) {
-            proxyData.loadingAir = false
-            proxyData.domAirOpeen = ''
-          }
-          if (proxyData.domAirOpeen !== '') {
-            let num: any = 0
-            let interval: any = setInterval(() => {
-              num++
-              clearInterval(interval)
-              if (num > 30) {
-                proxyData.loadingAir = false
-                proxyData.domAirOpeen = ''
-              }
-            }, 1000)
-          }
-        }
-      },
-      getAirInfo(type: string = '', btnType: string = '', feedbackId: any = '', isTimer: boolean = true) {
-        const paramObj: any = {
-          projectId: propsVal.projectId, // 项目id
-          objectId: propsVal.spaceId// 空间id
-        }
-
-        if (type === 'feedback') {
-          paramObj.id = feedbackId
-        }
-        getFeedbackDocumentsHttp(paramObj).then(res => {
-          const resData: any = res
-          if (type !== 'feedback') {
-            if (resData) {
-              proxyData.airData = resData
-              proxyData.formateModel(proxyData.airData.mode)
-              contx.emit('updateAirTemp', proxyData.airData.tempSet)
-              if (proxyData.airData.icon && proxyData.airData.icon === 7) {
-                proxyData.airData.isOpen = false
-                proxyData.airData.airImg = parseImgUrl('page-officehome', 'air_close.png')
-              } else {
-                proxyData.airData.isOpen = true
-                proxyData.airData.airImg = parseImgUrl('page-officehome', 'openair.png')
-              }
-              // 关闭按钮的loading
-              proxyData.closeLoading()
-            }
-          }
-          //   弹窗
-          if (type === 'feedback' && resData.notice && btnType != 'sw') {
-            if (proxyData.feedbackTimer) {
-              clearTimeout(proxyData.feedbackTimer) // 拿到反馈文案清除定时器
-              proxyData.getAirInfoToTimer()
-            }
-            proxyData.airSetText.notice = resData.notice
-          }else {
-            proxyData.getAirInfoToTimer()
-          }
-          //接口调完了再调
-          if (isTimer) {
-            // proxyData.poll()
-          }
-          proxyData.firstLoadingAir = false
-        }).catch(() => {
-          proxyData.getAirInfoToTimer()
-          proxyData.firstLoadingAir = false
-          if (type !== 'feedback') {
-            proxyData.closeLoading()
-          }
-          // proxyData.loadingAir = false
-        })
-      },
-      airChange() {
-        // 先不更新状态等确认框弹出后再更新状
-        if (proxyData.userIsControl) {
-          proxyData.airComfir()
-        } else {
-          Toast('您没有当前空间的控制权限!')
-        }
-      },
-      // 确认
-      airComfir() {
-        const message = proxyData.airData.isOpen ? '要关闭空调吗?' : '要开启空调吗?'
-        const confirmBtnText = proxyData.airData.isOpen ? '关闭' : '开启'
-        Dialog.confirm({
-          cancelButtonText: '取消',
-          confirmButtonText: confirmBtnText,
-          confirmButtonColor: '#5E8BCF',
-          message: message,
-        }).then(() => {  // 操作空调
-          const domAirOpen = !proxyData.airData.isOpen
-          const itemId = domAirOpen ? 12 : 10   // 12 开启 10关闭
-          proxyData.domAirOpeen = domAirOpen
-          let btnTypeDetail = ''
-          if (itemId == 12) {
-            btnTypeDetail = 'openAir'
-          } else {
-            btnTypeDetail = 'closeAir'
-          }
-          proxyData.loadingAir = true
-          proxyData.changeAir(itemId, 'sw', btnTypeDetail)
-        }).catch(() => {
-          // on cancel
-        })
-
-      },
-      // 更新空调开关状态
-      updatAirStatus(btnType: string) {
-        // 开启空调后手动调一下状态更新接口
-        if (btnType === 'sw') {
-          proxyData.getAirInfo('', '', '', false)
-        }
-      },
-      // 更新
-      updateAirText(btnType: string, val: any) {
-        if (btnType !== 'sw') {
-          proxyData.airSetText.designTemperature = val.designTemperature // 目标温度
-          proxyData.airSetText.toWhere = val.toWhere
-          if (proxyData.airSetText.toWhere == 'toCold') {
-            proxyData.airSetText.nowImg = 'dialog_cooling.svg'
-          } else if (proxyData.airSetText.toWhere == 'toWarm') {
-            proxyData.airSetText.nowImg = 'dialog_warmUp.svg'
-          } else {
-            proxyData.airSetText.nowImg = 'icon_wind.svg'
-          }
-        }
-      },
-      // 展示空调反馈弹窗¬
-      showAirConditioning(btnType: string, btnTypeDetail: string) {
-        // 空调温度和风量调整的时候展示弹窗
-        if (btnType !== 'sw') {
-          proxyData.showDialog = true
-          // 调整空调温度接口
-          const defaultAirText: any = {
-            'toWhere': btnTypeDetail,
-            'designTemperature': 0
-          }
-          proxyData.updateAirText(btnType, defaultAirText)
-        }
-      },
-      // 关闭弹窗
-      closeDialog() {
-        if (proxyData.feedbackTimer) {
-          clearInterval(proxyData.feedbackTimer) // 拿到反馈文案清除定时器
-          proxyData.feedbackTimer = null
-        }
-        proxyData.getAirInfoToTimer()
-        proxyData.showDialog = false
-      },
-      changeAir(itemId: number, btnType: string, btnTypeDetail: string) {
-        /**
-         * 缺少的逻辑:
-         * 1.设备位置判断
-         * 2.空调温度调整的反馈文案
-         */
-        // 温度切换的时候调整文案
-        proxyData.airSetText.notice = ''
-        const paramObj = {
-          projectId: propsVal.projectId, // 项目id
-          objectId: propsVal.spaceId, // 空间id
-          valueType: 1, // 固定为1
-          itemId: itemId  //    12 开启 10关闭  4 调低温  2 调高温 5 调小风量 6 调大风量
-        }
-        // 空调温度和风量调整的时候展示弹窗
-        proxyData.showAirConditioning(btnType, btnTypeDetail)
-        changeTempHttp(paramObj).then(res => {
-          let resData: any = res
-          // 开启和关闭空调之后手动
-          proxyData.updatAirStatus(btnType)
-          // 调整温度和风量的时候修改文案
-          let airText = {
-            'toWhere': btnTypeDetail,
-            'designTemperature': resData.designTemperature
-          }
-          proxyData.updateAirText(btnType, airText)
-          // 改变温度和风量的时候给弹窗设置文案
-          if (btnType !== 'sw') {
-            if (resData.notice) {
-              proxyData.airSetText.notice = resData.notice
-            } else {
-              clearInterval(proxyData.airTimer)
-              proxyData.airTimer = null
-              proxyData.feedbackTimer = setInterval(() => {
-                proxyData.getAirInfo('feedback', btnType, resData.id, false) // 调节反馈文案
-              }, 1000)
-            }
-          }
-        }).catch(() => {
-          proxyData.loadingAir = false
-        })
-      }
-    })
-    watch(
-      props,
-      (newProps: any) => {
-        if (newProps.spaceId) {   // 空间id改变的重新获取值调用接口
-          // 定时调空间信息
-          proxyData.getAirInfoToTimer()
-          proxyData.getEquipmentListHttp()
-        }
-        proxyData.temperature = props.temperature
-        proxyData.userIsControl = newProps.userIsControl
-      }
-    )
-    onBeforeUnmount(() => {
-      if (proxyData.airTimer) {
-        clearInterval(proxyData.airTimer)
-        proxyData.airTimer = null
-      }
-      if (proxyData.feedbackTimer) {
-        clearInterval(proxyData.feedbackTimer)
-        proxyData.feedbackTimer = null
-      }
-    })
-    onMounted(() => {
-      // 获取空调信息
-      proxyData.firstLoadingAir = true
-      proxyData.getAirInfoToTimer()
-      proxyData.getEquipmentListHttp()
-    })
-    const airRunImg = computed(() => {
-      let imgStr: string = ''
-      switch (proxyData.airData.icon) {
-        case 1:
-          imgStr = parseImgUrl('page-officehome', 'temp-keep.png')
-          break
-        case 2:
-          imgStr = parseImgUrl('page-officehome', 'temp_cold.svg')
-          break
-        case 3:
-          imgStr = parseImgUrl('page-officehome', 'temp_sun.png')
-          break
-        default:
-          imgStr = ''
-          break
-      }
-      return imgStr
-    })
-    return {
-      airRunImg,
-      ...toRefs(proxyData
-      )
-    }
-  }
-})
-</script>
-<style lang="scss" scoped>
-.air {
-  width: 100%;
-  background: #FFFFFF;
-  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.07), 0px 4px 10px rgba(0, 0, 0, 0.05);
-  border-radius: 25px;
-  margin: 15px 0px;
-}
-
-.air-top {
-  padding-left: 20px;
-  padding-bottom: 10px;
-  display: flex;
-  justify-content: space-between;
-}
-
-.air-desc {
-  flex: 1 157px;
-  padding-top: 10px;
-  font-family: PingFang SC;
-  font-size: 16px;
-  line-height: 19px;
-  color: #4D5262;
-  flex: none;
-  order: 0;
-  //color: rgba(196, 196, 196, 0.2)
-  flex-grow: 0;
-  margin: 5px 0px;
-}
-
-.air-right {
-  position: relative;
-  width: 157px;
-  text-align: center;
-
-  img {
-    width: 147px;
-    height: 110px;
-  }
-
-  .switch-btn {
-    position: absolute;
-    z-index: 111;
-    bottom: 10px;
-    right: 25px;
-  }
-}
-
-.air-title {
-  font-family: PingFang SC;
-  padding-left: 5px;
-  font-size: 16px;
-  line-height: 19px;
-  color: #4D5262;
-  flex: none;
-  order: 0;
-  flex-grow: 0;
-  margin: 5px 0px;
-}
-
-.air-temperature {
-  display: inline-block;
-  font-family: 'Montserrat';
-  font-style: normal;
-  font-weight: normal;
-  font-size: 32px;
-  line-height: 32px;
-  flex: none;
-  order: 0;
-  flex-grow: 0;
-  margin: 0px 4px;
-
-  sup {
-    font-family: Mulish;
-    font-style: normal;
-    font-weight: 800;
-    font-size: 12px;
-    line-height: 15px;
-  }
-}
-
-.air-model {
-  padding-left: 5px;
-  display: inline-block;
-  font-family: 'Montserrat';
-  font-style: normal;
-  font-weight: 400;
-  font-size: 15px;
-  line-height: 18px;
-  color: #C4C4C4;
-
-  span {
-    padding-right: 2px;
-  }
-}
-
-.air-status {
-  font-family: PingFang SC;
-  padding-left: 5px;
-  font-size: 14px;
-  line-height: 16px;
-  color: #C4C4C4;
-  flex: none;
-  order: 1;
-  flex-grow: 0;
-  margin: 10px 0px;
-}
-
-.air-loading {
-  font-family: Roboto;
-  padding-left: 5px;
-  font-style: normal;
-  font-weight: normal;
-  font-size: 11px;
-  line-height: 13px;
-  color: #C4C4C4;
-
-  img {
-    width: 12px;
-    height: 12px;
-  }
-}
-
-.air-control {
-  display: flex;
-  justify-content: space-between;
-  padding: 10px 0;
-  padding-left: 28px;
-  padding-right: 15px;
-  border-top: 1px solid rgba(196, 196, 196, 0.4);
-
-  .control-title {
-    flex: 1;
-    line-height: 42px;
-    font-weight: 500;
-    font-size: 12px;
-    color: #C4C4C4;
-
-  }
-
-  .btn-box {
-    flex: 1;
-    text-align: right;
-  }
-
-  .control-btn {
-    display: inline-block;
-    vertical-align: middle;
-    width: 42px;
-    height: 42px;
-    text-align: center;
-    border-radius: 50%;
-    background: rgba(196, 196, 196, 0.2);
-
-    img {
-      width: 13px;
-      height: 17px;
-      margin: 0 auto;
-      margin-top: 12.5px;
-    }
-
-    .temp-img {
-      width: 20px;
-      height: 20px;
-    }
-  }
-}
-
-
-.dialog-width {
-  width: 280px !important;
-}
-
-.air-dialog-content {
-  position: relative;
-  width: 100%;
-  height: 360px;
-
-  .dialog-top {
-    position: relative;
-    height: 70px;
-    background: #F3F3F3;
-
-    .img-greey {
-      background: #C4C4C4;
-    }
-
-    .img-blue {
-      background: #5E8BCF;
-    }
-
-    .img-red {
-      background: #E5574F;
-    }
-
-    img {
-      box-sizing: border-box;
-      border-radius: 50%;
-      position: absolute;
-      left: 50%;
-      width: 70px;
-      height: 70px;
-      padding: 17px;
-      transform: translateX(-50%);
-      top: 15px;
-    }
-
-  }
-}
-
-.dialog-text {
-  padding-top: 52px;
-  text-align: center;
-
-  .air-temp-num {
-    font-family: Montserrat;
-    display: inline-block;
-    font-size: 24px;
-    font-weight: 400;
-    line-height: 29px;
-    color: rgba(20, 0, 80, 1);
-
-    &.arrow-cooling {
-      color: #5e8bcf;
-      margin: 0 30px;
-      margin-bottom: 70px;
-    }
-
-    &.arrow-warn {
-      color: rgba(229, 87, 79, 1);
-      margin: 0 30px;
-      margin-bottom: 70px;
-    }
-  }
-
-  .air-temp-num-load {
-    display: inline-block;
-  }
-
-  .air-notice {
-    padding-top: 25px;
-    padding-left: 48px;
-    padding-right: 48px;
-    text-align: left;
-    display: flex;
-    justify-content: center;
-    font-family: PingFang SC;
-    font-size: 15px;
-    font-weight: 400;
-    line-height: 21px;
-    color: rgba(77, 82, 98, 1);
-  }
-
-  .air-temp-load {
-    padding-top: 25px;
-  }
-
-  .air-body-item-num {
-    height: 50px;
-  }
-}
-
-.dialog-btns {
-  position: absolute;
-  left: 50%;
-  bottom: 30px;
-  transform: translateX(-50%);
-  text-align: center;
-  margin: 0 auto;
-  width: 88px;
-  height: 46px;
-  line-height: 1;
-  color: #4D5262;
-  background: #FFFFFF;
-  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.05), 0px 4px 15px rgba(0, 0, 0, 0.15);
-  border-radius: 25px;
-  cursor: pointer;
-
-  span {
-    height: 46px;
-    line-height: 46px;
-    display: inline-block;
-  }
-}
-
-</style>
-<style lang="scss">
-.air-dialog-content {
-  .van-button_text {
-    color: #5E8BCF;
-  }
-}
-
-.air {
-  .van-loading__spinner {
-    color: #FFB800 !important;
-  }
-
-  .van-switch__loading {
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    line-height: 1;
-  }
-
-  .van-switch--disabled {
-    opacity: 0.3;
-  }
-}
-</style>

+ 0 - 454
src/views/envmonitor/LightOld.vue

@@ -1,454 +0,0 @@
-<template>
-  <div class="light" v-if="lampList && lampList.length">
-    <div class="light-top">
-      <div class="light-desc">
-        <p class="light-title">
-          {{ isShowChildLight ? '光照' : lampList[0].localName }}
-        </p>
-        <p :class="isShowChildLight?'light-status':'light-status'">
-          {{ lampSw ? '照明已开启' : '照明已关闭' }}
-        </p>
-        <div class="show-all" @click="showAll" v-if="isShowChildLight">
-          <van-icon
-            :name="lightIcon"
-            class="light-icon"
-          />
-          <span>显示全部</span>
-        </div>
-      </div>
-      <div class="light-right">
-        <img
-          :src="lightImg"
-          alt=""
-        >
-        <Switch size="24px"
-                v-if="!showFlag"
-                :model-value="lampSw"
-                :loading="loadingLight"
-                :disabled="loadingLight"
-                @click="eqChange('allLamp','',0)"
-                active-color="#FFE823"
-                inactive-color="rgba(196, 196, 196, 0.2)"
-                class="switch-btn"
-        />
-      </div>
-    </div>
-    <!--灯控制按钮-->
-    <div class="light-control"
-         v-for="(item,index) in lampList"
-         :key="item.id"
-         v-if="showFlag && isShowChildLight"
-    >
-      <div class="control-title">
-        {{ item.localName }}
-      </div>
-      <Switch size="24px"
-              active-color="#FFE823"
-              :model-value="item.switch"
-              type="spinner"
-              :loading="item.loading"
-              :disabled="item.loading"
-              @click="eqChange('main',item,index)"
-              inactive-color="rgba(196, 196, 196, 0.2)"
-              class="switch-btn"
-      />
-    </div>
-  </div>
-</template>
-
-<script lang="ts">
-import {
-  defineComponent,
-  computed,
-  onMounted,
-  reactive,
-  toRefs,
-  getCurrentInstance,
-  watch,
-  onBeforeMount,
-  onUnmounted, onBeforeUnmount
-} from 'vue'
-import { Switch, Toast } from 'vant'
-import { getLampHttp, getStatusHttp, setallLampHttp } from '@/apis/envmonitor'
-import { parseImgUrl } from '@/utils'
-
-export default defineComponent({
-  props: {
-    projectId: {
-      type: String,
-      default: () => ''
-    },
-    spaceId: {
-      type: String,
-      default: () => ''
-    }
-  },
-  components: { Switch },
-  setup(props) {
-    const { proxyInstance } = getCurrentInstance() as any
-    const lampList: any = []
-    const lightsStatusTimer: any = null
-    const timeOut: any = null
-    const initData: any = []
-    let lightParams: any = []
-    const proxyData = reactive({
-      lightParams: lightParams,
-      allowSvg: 'down_Arrow.svg',
-      timeOut: timeOut,
-      lightIcon: 'arrow-down',
-      showFlag: false,
-      loadingLight: false,
-      initData: initData,
-      lampList: lampList,
-      lightsStatusTimer: lightsStatusTimer,
-      startCheckLightsTime: 0,
-      lightImg: parseImgUrl('page-officehome', 'lamp_close_v2.png'),
-      lampSw: false,  // 主灯开关
-      // 点击展示所有的登录
-      showAll() {
-        proxyData.showFlag = !proxyData.showFlag
-        proxyData.lightIcon = 'arrow-down'
-      },
-      // 获取灯的状态
-      getLampList() {
-        getLampHttp({ spaceId: props.spaceId }).then(res => {
-          const resData: any = res
-          if (resData && resData.result == 'success') {
-            let content = resData?.content ?? []
-            let lampOpen = false // 如果有一个开 则总灯开
-            for (let i = 0; i < content.length; i++) {
-              content[i].type = 'lamp'
-              content[i].imgOpen = parseImgUrl('page-officehome', 'lampch_open.png')
-              content[i].imgClose = parseImgUrl('page-officehome', 'lampch_close.png')
-              content[i].switch = content[i].runStatus ? true : false
-              if (content[i].runStatus) {
-                lampOpen = true
-              }
-              content[i].loading = false
-            }
-            proxyData.initData = JSON.parse(JSON.stringify(content))//  灯的数据
-            proxyData.lampSw = lampOpen // 主灯开关
-            proxyData.lampList = content
-            proxyData.lightImg = proxyData.lampSw ? parseImgUrl('page-officehome', 'lamp_open_v2.png')
-              : parseImgUrl('page-officehome', 'lamp_close_v2.png')
-          }
-        })
-      },
-      // 调整灯
-      eqChange(type: any, item: any, index: any) {
-        if (type === 'allLamp') {  //  总开关按钮所有灯
-          //  当前要执行的灯的操作
-          proxyData.loadingLight = true
-          const statusFlag = !proxyData.lampSw
-          proxyData.setLamp(type, '', statusFlag, 0)// 调接口
-        } else {
-          //当前要执行的灯的操作
-          // 按钮loading
-          item.loading = true
-          const statusFlag: any = !item.switch
-          let id = item.id
-          proxyData.setLamp(type, id, statusFlag, index)// 调接口
-        }
-      },
-      //  控制灯的接口
-      setLamp(type: string, id: any, statusFlag: any, index: any) {
-        let params: any = []
-        if (type === 'allLamp') {
-          for (let i = 0; i < proxyData.initData.length; i++) {
-            proxyData.initData[i].switch = statusFlag
-          }
-          params = proxyData.initData
-        } else {
-          params = [{
-            id: id,
-            switch: statusFlag
-          }]
-        }
-        proxyData.lightParams = params
-        // 调服务端的接口像后台发送灯的操作的指令
-        setallLampHttp(params).then(res => {
-          const resData: any = res
-          if (resData.result === 'success') {
-            const checkData: any = proxyData.judgeChangeResponeseSuccess(resData)
-            proxyData.getTimeLampStatus(checkData, type, id, statusFlag, index)
-          } else {
-            proxyData.initLampLoading()
-          }
-        }).catch(() => {
-        })
-      },
-      // 报错后关闭灯的loading
-      initLampLoading() {
-        proxyData.loadingLight = false
-        proxyData.lampList.map((item: any) => {
-          item.loading = false
-        })
-      },
-      // 轮询查看状态
-      getTimeLampStatus(checkData: any, type: any, id: any, statusFlag: any, index: any) {
-        if (checkData['success'] && checkData['success'].length) {
-          if (type === 'allLamp') {   // 点击主灯按钮
-            proxyData.updateAllLampLoading(checkData['success'])// 所有灯
-          } else {  // 当个的时候修改loading的状态
-            proxyData.updateLampLoading(index)
-          }
-          proxyData.getLampList()
-        }
-        if (checkData['processing'] && checkData['processing'].length) {
-          let checkParams: any = proxyData.lightParams
-          let processArr: any = checkData['processing']
-          let params: any = []
-          processArr.map((item: any) => {
-            let obj: any = {
-              id: item.id,
-              orderSeqNum: item.orderSeqNum
-            }
-            for (let i = 0; i < checkParams.length; i++) {
-              if (item.id === checkParams[i].id) {
-                obj.switch = checkParams[i].switch
-                break
-              }
-            }
-            params.push(obj)
-          })
-          proxyData.checkChangeLightStatusSuccess(params, type, id, statusFlag, index)
-        }
-        if (checkData['error'] && checkData['error'].length) {
-          if (type === 'allLamp') {   // 点击主灯按钮
-            proxyData.updateAllLampLoading(checkData['error'])// 所有灯
-          } else {  // 当个的时候修改loading的状态
-            proxyData.updateLampLoading(index)
-          }
-        }
-      },
-      // 查看指令是否成功完成
-      judgeChangeResponeseSuccess(resData: any) {
-        console.log(resData)
-        let data: any = resData?.content ?? []
-        let processingArr: any = []
-        let successArr: any = []
-        let errorArr: any = []
-        for (let i = 0; i < data.length; i++) {
-          let item: any = data[i]
-          if (item.result = 'success') {
-            if (item.state === 200 && item.exeResult === 'success') {
-              successArr.push(item)
-            } else if (item.state === 200 && item.exeResult === 'processing:rcvd'
-              || (item.state === 202 && !item.exeResult)) {
-              processingArr.push(item)
-            } else {
-              errorArr.push(item)
-            }
-          } else {
-            errorArr.push(item)
-          }
-        }
-        let obj: any = {
-          'success': successArr,
-          'processing': processingArr,
-          'error': errorArr
-        }
-        return obj
-      },
-      // 操作成功后更新所有灯的真实状态
-      updateAllLampLoading(arr: any) {
-        for (let i = 0; i < proxyData.lampList.length; i++) {
-          if (proxyData.lampList[i].type == 'lamp') {
-            arr.map((item: any) => {
-              if (proxyData.lampList[i].id === item.id) {
-                proxyData.lampList[i].loading = false
-              }
-            })
-          }
-        }
-        let loadingLen = proxyData.lampList.filter((item: any) => {
-          return item.loading
-        })
-        if (loadingLen.length === 0) {
-          proxyData.loadingLight = false
-        }
-      },
-      // 动态切换主灯的状态
-      updateLampLoading(index: any) {
-        proxyData.lampList[index].loading = false
-      },
-      // 灯的指令完成后更新状态
-      checkChangeLightStatusSuccess(checkParams: any, type: any, id: any, value: any, index: any) {
-        // 轮询查询灯的状态
-        getStatusHttp(checkParams).then(res => {
-          const resData: any = res
-          const checkData: any = proxyData.judgeChangeResponeseSuccess(resData)
-          proxyData.getTimeLampStatus(checkData, type, id, value, index)
-        })
-      },
-      // 清楚定时器
-      clearLightStatusTimer() {
-        if (proxyData.lightsStatusTimer) {
-          clearInterval(proxyData.lightsStatusTimer)
-        }
-      },
-      // 定时刷新接口
-      startLightsStatusTimer() {
-        if (proxyData.lightsStatusTimer) {
-          clearInterval(proxyData.lightsStatusTimer)
-          proxyData.lightsStatusTimer = null
-        }
-        // proxyData.getLampList()
-        proxyData.lightsStatusTimer = setInterval(() => {
-          proxyData.getLampList()
-        }, 1000)  // 2秒描刷接口
-      }
-    })
-    const isShowChildLight = computed(() => {
-      return proxyData.lampList.length && proxyData.lampList.length > 1
-    })
-    watch(
-      props,
-      (newProps: any) => {
-        if (newProps.spaceId) {   // 空间id改变的重新获取值调用接口
-          // 定时调空间信息
-          proxyData.startLightsStatusTimer()
-        }
-      }
-    )
-    onBeforeUnmount(() => {
-      clearInterval(proxyData.lightsStatusTimer)
-      proxyData.lightsStatusTimer = null
-    })
-    onBeforeMount(() => {
-      // 获取空调信息
-      // proxyData.getLampList()
-      proxyData.startLightsStatusTimer()
-    })
-    return {
-      isShowChildLight,
-      ...toRefs(proxyData
-      )
-    }
-  }
-})
-</script>
-<style lang="scss" scoped>
-.light {
-  width: 100%;
-  background: #FFFFFF;
-  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.07), 0px 4px 10px rgba(0, 0, 0, 0.05);
-  border-radius: 25px;
-  margin: 15px 0px;
-}
-
-.light-top {
-  padding-left: 20px;
-  padding-bottom: 0px;
-  display: flex;
-  justify-content: space-between;
-}
-
-.light-desc {
-  flex: 1 98px;
-  padding-top: 10px;
-  font-family: PingFang SC;
-  font-size: 16px;
-  line-height: 19px;
-  color: #4D5262;
-  flex: none;
-  order: 0;
-  flex-grow: 0;
-  margin: 5px 0px;
-}
-
-.light-right {
-  position: relative;
-  width: 98px;
-  margin-right: 45px;
-  text-align: center;
-
-  img {
-    //width: 98px;
-    height: 120px;
-  }
-
-  .switch-btn {
-    position: absolute;
-    right: -20px;
-    bottom: 20px;
-  }
-}
-
-.light-title {
-  font-family: PingFang SC;
-  padding-left: 5px;
-  font-size: 16px;
-  line-height: 19px;
-  color: #4D5262;
-  flex: none;
-  order: 0;
-  flex-grow: 0;
-  margin: 5px 0px;
-}
-
-.light-status {
-  font-family: PingFang SC;
-  padding-left: 5px;
-  font-size: 14px;
-  line-height: 16px;
-  color: #C4C4C4;
-  flex: none;
-  order: 1;
-  flex-grow: 0;
-  margin: 10px 0px;
-}
-
-
-.show-all {
-  font-family: PingFang SC;
-  //display: none;
-  .light-icon {
-    font-size: 12px;
-    padding-right: 10px;
-  }
-
-  padding-top: 28px;
-  padding-bottom: 22px;
-  font-size: 14px;
-  line-height: 16px;
-  color: #C4C4C4;
-  margin: 0px 5px;
-}
-
-.light-control {
-  display: flex;
-  justify-content: space-between;
-  padding: 10px 15px 10px 28px;
-  border-top: 1px solid rgba(196, 196, 196, 0.4);
-
-  .control-title {
-    flex: 1 110px;
-    font-weight: 500;
-    font-family: PingFang SC;
-    font-size: 16px;
-    line-height: 30px;
-    color: #4D5262;
-  }
-
-  .switch-btn {
-    margin-top: 5px;
-  }
-}
-
-</style>
-<style class="style" lang="scss">
-.light {
-  .van-loading__spinner {
-    color: #FFB800 !important;
-  }
-
-  .van-switch__loading {
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    line-height: 1;
-  }
-}
-</style>

+ 0 - 959
src/views/envmonitor/MapBox-copy.vue

@@ -1,959 +0,0 @@
-<template>
-  <div>
-    <div class="space-main" id="spaceMain">
-      <div class="space-box"
-           v-if="mapData && mapData.spaceList && mapData.spaceList.length"
-           v-for="(area,index) in mapData.spaceList"
-           :style="{width:area.width+'px',
-           height:area.height+'px',
-           top:area.top+'px',
-           left:area.left+'px'}"
-      >
-        <div class="space"
-             :id="'space'+area.id"
-             :class="[area.canClick?'':'click-disable',selectArea.id===area.id?'select':'',
-             spaceInfo.spaceId===area.spaceId && spaceInfo.isPermanent?'use-select':'']"
-             @click.stop="checkSpace(area)"
-             :style="{backgroundColor:area.backgroundColor?area.backgroundColor:''}"
-        >
-          <div class="device"
-               :class="selectArea.id===area.id?'select-device':''"
-               v-show="area.width*displacement.scale>24 && area.height*displacement.scale>24"
-          >
-            <img :src="area.icon" v-if="selectArea.id!==area.id && area.icon">
-            <img :src="area.selectIcon" v-else class="select-icon" alt="">
-            <template v-if="area.localName">
-              <span v-if="area.height>80 && area.localName.length*12<area.width || selectArea.id===area.id"
-                    style="font-size: 12px"
-              >{{ area.localName }}</span>
-            </template>
-          </div>
-          <!--          <div class="circle" v-else :style="{backgroundColor: area.circleColor?area.circleColor:''}"></div>-->
-        </div>
-      </div>
-    </div>
-    <!--地图右侧的操作按钮-->
-    <div class="map-toolbar">
-      <img
-        :src="parseImgUrl('map-icon','icon-search-big.svg')"
-        @click.stop="goSearch"
-        class="icon-search" alt=""
-      >
-      <div class="toolbar-item" @click.stop="checkFloor">
-        <span class="text-hidden">{{ floorItem.localName }}</span>
-      </div>
-      <div class="toolbar-item" @click.stop="checkBuilding">
-        <span class="text-hidden">{{ buildingItem.localName }}</span>
-      </div>
-      <!--      <div class="toolbar-item">-->
-      <!--        <img src="../../assets/images/map-icon/icon-floor-arrow.svg" alt="">-->
-      <!--      </div>-->
-    </div>
-    <!-- 选择建筑  -->
-    <van-popup v-model:show="showBuilding"
-               teleport="body"
-               class="buiding-box"
-               style="width: 40%;height: 100%;padding: 20px"
-               position="right"
-    >
-      <div class="buiding-item"
-           :key="item.id"
-           :class="buildingItem.buildingId===item.id?'active':''"
-           @click.stop="comfirmBuilding(item)"
-           v-for="item in buildingData"
-      >
-        {{ item.localName }}
-      </div>
-    </van-popup>
-
-    <!-- 选择楼层  -->
-    <van-popup v-model:show="showFloor"
-               teleport="body"
-               class="buiding-box"
-               style="width: 40%;height: 100%;padding: 20px"
-               position="right"
-    >
-      <div class="buiding-item"
-           :key="item.id"
-           :class="floorItem.id===item.id?'active':''"
-           @click.stop="comfirmFloor(item)"
-           v-for="item in floorData"
-      >
-        {{ item.localName }}
-      </div>
-    </van-popup>
-
-    <!--搜索-->
-    <van-popup v-model:show="showSearch"
-               teleport="body"
-               class="buiding-box"
-               style="width: 100%;height: 100%"
-               position="right"
-    >
-      <div style="width: 100%;height: 100%">
-        <space-search @closeSearch="closeSearch"></space-search>
-      </div>
-    </van-popup>
-  </div>
-</template>
-
-<script lang="ts">
-import { defineComponent, onMounted, nextTick, reactive, toRefs, watch } from 'vue'
-import { mapObj } from '@/model/map'
-import {
-  getLocalStorageFloor,
-  getStorageSpaceId,
-  localStorageFloor,
-  localStorageSpaceId,
-  parseImgUrl,
-  setLocalNewSpaceInfo
-} from '@/utils'
-import { Toast, Dialog } from 'vant'
-import { getBuildingList, getFloorList, getMapInfo } from '@/apis/envmonitor'
-import SpaceSearch from '@/views/envmonitor/Search/SpaceSearch.vue'
-import { useRouter } from 'vue-router'
-import { getSpaceType, mapIcon } from '@/utils/mapIcon'
-
-export default defineComponent({
-  props: {
-    projectId: {
-      type: String,
-      default: () => ''
-    },
-    spaceInfo: {
-      type: Object,
-      default: () => {
-      }
-    },
-    isSetSpace: {
-      type: Boolean,
-      default: () => false
-    }
-
-  },
-  components: {
-    SpaceSearch
-  },
-  setup(props, contx) {
-    const router = useRouter()
-    const mapData: any = {}
-    const document: any = window.document
-    const screenInfo: any = {
-      screenWidth: document.body.clientWidth,
-      screenHeight: document.body.clientHeight
-    }
-    const comMapScale: any = 0.8
-    const displacement: any = {
-      scale: 1,
-      pageX: 0,
-      pageX2: 0,
-      originScale: 0,
-      moveable: false
-    }
-    let buildingData: any = []
-    let floorData: any = []
-    let floorItem: any = {}
-    let selectArea: any = {}
-    const proxyData = reactive({
-      parseImgUrl: parseImgUrl,
-      isSetSpace: props.isSetSpace,  // isSetSpace:true 代表常驻空间页面展示
-      widthMapScale: 1,
-      tempScale: 0.8,
-      comMapScale: comMapScale,
-      heightScale: 1,
-      showSearch: false,
-      showBuilding: false,
-      showFloor: false,
-      buildingItem: {
-        buildingId: '',
-        localName: ''
-      },
-      floorData: floorData,
-      floorItem: floorItem,
-      buildingData: buildingData,
-      mapData: mapData,
-      selectArea: selectArea,
-      displacement: displacement,
-      screenInfo: screenInfo,
-      // 切换楼层的时候恢缩放和滚动的样式
-      clearPreStyle() {
-        let mapDom = document.querySelector('#map')
-        mapDom.scrollLeft = 0
-        mapDom.scrollTop = 0
-        let matrix_box: any = document.querySelector('#spaceMain')
-        // 记住使用的缩放值
-        proxyData.displacement.scale = 1
-        // 图像应用缩放效果
-        // console.log(newScale);
-        matrix_box.style.transform = 'scale(' + 1 + ')'
-      },
-      /**
-       * 地图滚动
-       */
-      mapScroll() {
-        let mapDom = document.querySelector('#map')
-        let houseDesDom = document.querySelector('#houseDes')
-        let houseHeight: any = houseDesDom ? houseDesDom.offsetHeight : 0
-        // let headerDom = document.querySelector('#header')
-        // let headerHeight: any = headerDom.offsetHeight
-        mapDom.addEventListener('scroll', () => {
-          let scrollTop: any = mapDom.scrollTop
-          let height: any = proxyData.mapData.height * proxyData.displacement.scale
-          let tempHeight: any = proxyData.screenInfo.screenHeight - houseHeight - 130
-          if (height < tempHeight) {
-            mapDom.scrollTop = 0
-          } else {
-            if (height - tempHeight < scrollTop) {
-              mapDom.scrollTop = height - tempHeight
-            }
-          }
-        })
-      },
-      /**
-       * 关闭搜索页面
-       * @param item
-       */
-      closeSearch(item: any) {
-        proxyData.showSearch = false
-        if (item) {
-          proxyData.loadingStart()
-          let searchSpace: any = {
-            buildingId: item.buildingId,
-            buildingName: '',
-            floorId: item.floorId,
-            floorName: '',
-            spaceId: item.id
-          }
-          proxyData.init(searchSpace)
-        }
-      },
-      /*
-        去搜索页面
-       */
-      goSearch() {
-        proxyData.showSearch = true
-        // router.push({ path: '/search' })
-      },
-      /**
-       * 设置选中的空间的位置,
-       */
-      setSelectSpacePosition(area: any) {
-        setTimeout(() => {
-          proxyData.setScrollLeft(area)
-          proxyData.scrollTop(area)
-        })
-      },
-      /**
-       * 判断像左还是像右滚动
-       */
-      setScrollLeft(area: any) {
-        let mapDom = document.getElementById('map')
-        let left: any = area.left * proxyData.displacement.scale - (proxyData.screenInfo.screenWidth - area.width * proxyData.displacement.scale) / 2
-        mapDom.scrollLeft = left
-      },
-      /**
-       * 获取竖着的方向
-       */
-      scrollTop(area: any) {
-        let mapDom = document.querySelector('#map')
-        let houseDesDom = document.querySelector('#houseDes')
-        let houseHeight: any = houseDesDom ? houseDesDom.offsetHeight : 0
-        if ((area.top + area.height) * proxyData.displacement.scale > proxyData.screenInfo.screenHeight - houseHeight - 20) {
-          mapDom.scrollTop = (area.top * proxyData.displacement.scale - (proxyData.screenInfo.screenHeight - houseHeight) / 2 + (area.height * proxyData.displacement.scale) / 2)
-        } else {
-          if ((area.top - area.height) * proxyData.displacement.scale < mapDom.scrollTop) {
-            mapDom.scrollTop = (area.top - area.height) * proxyData.displacement.scale
-          }
-        }
-      },
-      /**
-       * 切换空间
-       */
-      checkSpace(area: any) {
-        if (area.canClick) {
-          proxyData.setSelectSpacePosition(area)
-          if (proxyData.isSetSpace) {
-            // 记录当前选中的id
-            proxyData.comfirSetSpace(area)
-          } else {
-            proxyData.selectArea = area
-            proxyData.setLocalSpaceInfo()
-            // 记录当前选中的id
-            contx.emit('changeSpaceId', proxyData.selectArea.spaceId)
-          }
-        } else {
-          Toast('不可选区域')
-        }
-      },
-      /**
-       * 确认设置为常驻空间
-       */
-      comfirSetSpace(item: any) {
-        if (item.spaceId === props.spaceInfo.spaceId) {
-          Dialog.confirm({
-            title: '取消常驻空间',
-            confirmButtonColor: '#000000',
-            cancelButtonColor: '#4D5262',
-            message: `是否取消常驻空间设置?`
-          }).then(() => {
-            contx.emit('delPermanentSpace')
-          }).catch(() => {
-          })
-        } else {
-          Dialog.confirm({
-            title: '设置常驻空间',
-            confirmButtonColor: '#000000',
-            cancelButtonColor: '#4D5262',
-            message: `是否将常驻空间设置为${item.localName}?`
-          }).then(() => {
-            proxyData.selectArea = item
-            contx.emit('changeSpaceId', proxyData.selectArea.spaceId)
-          }).catch(() => {
-          })
-        }
-      },
-      /**
-       * 本地缓存最新的空间建筑信息,提供给首次进入页面使用
-       */
-      setLocalSpaceInfo() {
-        localStorageSpaceId(proxyData.buildingItem.buildingId, proxyData.floorItem.id, proxyData.selectArea.spaceId)
-        let spaceInfo: any = {
-          buildingId: proxyData.buildingItem.buildingId,
-          buildingName: proxyData.buildingItem.localName,
-          floorId: proxyData.floorItem.id,
-          floorName: proxyData.floorItem.localName,
-          spaceId: proxyData.selectArea.spaceId // 上格云3
-        }
-        setLocalNewSpaceInfo(spaceInfo)
-      },
-      /**
-       * 地图放大的距离
-       * @param start
-       * @param stop
-       */
-      getDistance(start: any, stop: any) {
-        return Math.hypot(stop.x - start.x, stop.y - start.y)
-      },
-      /**
-       * 格式化地图数据
-       */
-      formateMapData() {
-        let data: any = proxyData.mapData
-        if (data) {
-          proxyData.setSpaceScale()
-          proxyData.setTempScale()
-          if (data.width < 3000) {
-            proxyData.comMapScale = 0.8
-          }
-          data.width = data.width * proxyData.comMapScale
-          data.height = data.height * proxyData.comMapScale
-          let spaceList: any = data?.spaceList ?? []
-          for (let i = 0; i < spaceList.length; i++) {
-            let item = spaceList[i]
-            item.width = item.width * proxyData.comMapScale
-            item.height = item.height * proxyData.comMapScale
-            item.top = item.top * proxyData.comMapScale
-            item.left = item.left * proxyData.comMapScale
-            // item.canClick = !item.canClick
-            proxyData.setSpaceIcon(item)
-          }
-        }
-      },
-      // 获取空间最小宽
-      setSpaceScale() {
-        let data: any = proxyData.mapData
-        if (data) {
-          let spaceList: any = data?.spaceList ?? []
-          let minHeight: any = Math.min.apply(null, spaceList.map((item: any) => item.height))
-          let minWidth: any = Math.min.apply(null, spaceList.map((item: any) => item.width))
-          let min: any = minHeight < minWidth ? minHeight : minWidth
-          min = min ? min : 30
-          proxyData.comMapScale = 30 / min
-        }
-      },
-      // 缩放的临界值修改
-      setTempScale() {
-        proxyData.tempScale = 0.4
-        let data: any = proxyData.mapData
-        if (data) {
-          let width: any = proxyData.mapData.width
-          let height: any = proxyData.mapData.height
-          if (width > height) {
-            let num: any = Math.ceil(width / proxyData.screenInfo.screenWidth)
-            if (num < 10) {
-              proxyData.tempScale = 0.4
-            } else if (num < 20) {
-              proxyData.tempScale = 0.3
-            } else {
-              proxyData.tempScale = 0.25
-            }
-          } else {
-            let num: any = Math.ceil(height / proxyData.screenInfo.screenHeight)
-            if (num < 10) {
-              proxyData.tempScale = 0.4
-            } else if (num < 20) {
-              proxyData.tempScale = 0.3
-            } else {
-              proxyData.tempScale = 0.25
-            }
-          }
-        }
-      },
-      /**
-       * 设置地图最外框宽和高
-       */
-      setMapBoxStyle() {
-        let mapBoxEle = document.querySelector('#spaceMain')
-        if (proxyData.mapData && proxyData.mapData.width) {
-          mapBoxEle.style.width = proxyData.mapData.width + 'px'
-          mapBoxEle.style.height = proxyData.mapData.height + 'px'
-        }
-      },
-      /**
-       * 设置空间的图标
-       *
-       */
-      setSpaceIcon(item: any) {
-        // if(item.can)
-        if (item.canClick) {
-          let typeName: any = getSpaceType(item.roomFuncType)
-          item.icon = mapIcon[typeName].icon
-          item.selectIcon = mapIcon[typeName].selectIcon
-          item.backgroundColor = mapIcon[typeName].backgroundColor
-          item.bg = mapIcon[typeName].bg
-          item.icon = parseImgUrl('map-new-icon', item.icon)
-          item.selectIcon = parseImgUrl('map-new-icon', item.selectIcon)
-        }
-      },
-      midpoint(x1: any, y1: any, x2: any, y2: any) {
-        return [(x1 + x2) / 2, (y1 + y2) / 2]
-      },
-      /**
-       * 地图缩放功能
-       */
-      mapScale() {
-        let matrix_box: any = document.querySelector('#spaceMain')
-        let mapDom: any = document.querySelector('#map')
-        matrix_box.addEventListener('touchstart', function(event: any) {
-          let touches: any = event.touches
-          let events: any = touches[0]
-          let events2: any = touches[1]
-          // 第一个触摸点的坐标
-          proxyData.displacement.pageX = events.pageX
-          proxyData.displacement.pageY = events.pageY
-
-          proxyData.displacement.moveable = true
-
-          if (events2) {
-            proxyData.displacement.pageX2 = events2.pageX
-            proxyData.displacement.pageY2 = events2.pageY
-            proxyData.displacement.center = proxyData.midpoint(proxyData.displacement.pageX, proxyData.displacement.pageY, proxyData.displacement.pageX2, proxyData.displacement.pageY2)
-          }
-
-          proxyData.displacement.originScale = proxyData.displacement.scale || 1
-        })
-        matrix_box.addEventListener('touchmove', function(event: any) {
-          if (!proxyData.displacement.moveable) {
-            return
-          }
-          // event.preventDefault();
-          let touches: any = event.touches
-          let events: any = touches[0]
-          let events2: any = touches[1]
-          // 双指移动
-          if (events2) {
-            // 第2个指头坐标在touchmove时候获取
-            if (!proxyData.displacement.pageX2) {
-              proxyData.displacement.pageX2 = events2.pageX
-            }
-            if (!proxyData.displacement.pageY2) {
-              proxyData.displacement.pageY2 = events2.pageY
-            }
-
-            // 双指缩放比例计算
-            let zoom: any = proxyData.getDistance(
-              {
-                x: events.pageX,
-                y: events.pageY
-              },
-              {
-                x: events2.pageX,
-                y: events2.pageY
-              }
-            ) / proxyData.getDistance(
-              {
-                x: proxyData.displacement.pageX,
-                y: proxyData.displacement.pageY
-              },
-              {
-                x: proxyData.displacement.pageX2,
-                y: proxyData.displacement.pageY2
-              }
-            )
-            // 应用在元素上的缩放比例
-            let newScale: any = proxyData.displacement.originScale * zoom
-            // 最大缩放比例限制
-            if (newScale < proxyData.tempScale) {
-              newScale = proxyData.tempScale
-            }
-            if (newScale > 1) {
-              newScale = 1
-            }
-            // 记住使用的缩放值
-            proxyData.displacement.scale = newScale
-            // 图像应用缩放效果
-            // console.log(newScale);
-            matrix_box.style.transform = 'scale(' + newScale + ')'
-            // 设置旋转元素的基点位置
-            // matrix_box.style.transformOrigin = '0px 0px 0px'
-            // matrix_box.style.transformOrigin = -proxyData.displacement.center[0] + ' ' + -proxyData.displacement.center[1]
-            // mapDom.scrollTop = proxyData.displacement.center[1]
-            // mapDom.scrollLeft = proxyData.displacement.center[0]
-            // if (proxyData.selectArea) {
-            //   proxyData.setSelectSpacePosition(proxyData.selectArea)
-            // }
-          }
-        })
-      },
-      /**
-       * 获取建筑信息
-       */
-      getBuildingList() {
-        let params: any = {
-          'criteria': {
-            'projectId': props.projectId
-          }
-        }
-        getBuildingList(params).then(res => {
-          let resData: any = res
-          if (resData.result === 'success') {
-            let content: any = resData?.content ?? []
-            proxyData.buildingData = content
-            // 设置展示的建筑名称
-            proxyData.setBuildingName()
-          }
-        })
-      },
-      /**
-       *
-       * 选择建筑
-       */
-      checkBuilding() {
-        proxyData.showBuilding = true
-      },
-      /**
-       *  选择楼层
-       */
-      checkFloor() {
-        proxyData.showFloor = true
-      },
-      /**
-       * 确定选择的楼层信息
-       */
-      comfirmFloor(item: any, flag: boolean = true) {
-        proxyData.floorItem = item
-        proxyData.showFloor = false
-        // 获取地图数据
-        proxyData.loadingStart()
-        proxyData.getMapInfo(flag)
-        /**
-         *缓存建筑对应的楼层
-         */
-        localStorageFloor(proxyData.buildingItem.buildingId, proxyData.floorItem.id)
-      },
-      /**
-       * 确定建筑
-       */
-      comfirmBuilding(item: any) {
-        proxyData.showBuilding = false
-        proxyData.buildingItem.buildingId = item.id
-        proxyData.buildingItem.localName = item.localName
-        proxyData.getFloorList()
-      },
-      /**
-       * 加载loading
-       */
-      loadingStart() {
-        Toast.loading({
-          duration: 0, // 持续展示 toast
-          forbidClick: true,
-          message: '加载中...'
-        })
-      },
-      /**
-       * 结束
-       */
-      loadinngEnd() {
-        Toast.clear()
-      },
-      /**
-       * 查询楼层信息
-       */
-      getFloorList(flag: boolean = true) {
-        if (proxyData.buildingItem.buildingId) {
-          let params: any = {
-            'criteria': {
-              'projectId': props.projectId,
-              'buildingId': proxyData.buildingItem.buildingId
-            }
-          }
-          getFloorList(params).then(res => {
-            let resData: any = res
-            if (res.result === 'success') {
-              proxyData.floorData = resData?.content ?? []
-              //  设置楼层的名称
-              proxyData.setFloorName()
-            } else {
-              proxyData.floorData = []
-            }
-            if (flag && proxyData.floorData.length) {
-              proxyData.getHistorySelectFloor()
-              proxyData.getMapInfo()
-            }
-          })
-        }
-      },
-      /**
-       * 获取地图信息
-       */
-      getMapInfo(flag: boolean = true, searchItem: any = null) {
-        let params: any = {
-          'projectId': props.projectId,
-          'floorId': proxyData.floorItem.id
-        }
-        getMapInfo(params).then(res => {
-          let resData: any = res
-          if (resData.result === 'success') {
-            proxyData.mapData = resData?.data ?? null
-            // 切换数据的时候清楚默认样式
-            proxyData.clearPreStyle()
-            proxyData.formateMapData()
-
-            /**
-             * 如果是当前页面切换楼层,展示历史楼层
-             */
-            if (flag) {
-              proxyData.getHistorySpace()
-            } else {  // 首次进入页面的时候展示空间来源于父div
-              let area = proxyData.getFirstSelectSpace(searchItem)
-              if (area) {
-                proxyData.selectArea = area
-              }
-              // 搜索页面过来设置常驻空间页面
-              if (!proxyData.isSetSpace) {
-                proxyData.checkSpace(area)
-              }
-            }
-            if (!proxyData.isSetSpace) {
-              proxyData.checkSpace(proxyData.selectArea)
-            }
-            // 当没有默认空间的时候设置常驻空间页面不高量
-            if (proxyData.isSetSpace && !props.spaceInfo.isPermanent) {
-              proxyData.selectArea = {}
-            } else {
-              // proxyData.checkSpace(proxyData.selectArea)
-              // 设置当前空间的位置
-              proxyData.setSelectSpacePosition(proxyData.selectArea)
-            }
-            // 接口返回后设置地图缩放和滚动
-            nextTick(() => {
-              // 地图双指缩放
-              proxyData.setMapBoxStyle()
-              proxyData.mapScale()
-              proxyData.mapScroll()
-            })
-          }
-          proxyData.loadinngEnd()
-        }).catch(() => {
-          proxyData.loadinngEnd()
-        })
-      },
-      /**
-       * 获取缓存的楼层
-       */
-      getHistorySelectFloor() {
-        let historyFloor: any = getLocalStorageFloor()
-        let flag: any = false
-        let floorId: any = historyFloor[proxyData.buildingItem.buildingId]
-        proxyData.floorData.map((floor: any) => {
-          if (floor.id === floorId) {
-            flag = true
-            proxyData.floorItem = floor
-          }
-        })
-        if (!flag) {
-          proxyData.floorItem = proxyData.floorData[0]
-        }
-      },
-      /**
-       *  获取选中的选中空间
-       */
-      getHistorySpace() {
-        let data: any = proxyData.mapData
-        let historySpace: any = getStorageSpaceId()
-        if (data) {
-          let flag: boolean = false
-          let spaceList = data?.spaceList ?? []
-          let key: any = `${proxyData.buildingItem.buildingId},${proxyData.floorItem.id}`
-          let spaceId: any = historySpace[key]
-          if (spaceId) {
-            spaceList.map((space: any) => {
-              if (spaceId === space.spaceId) {
-                proxyData.selectArea = space
-                flag = true
-              }
-            })
-          }
-
-          if (!flag) {
-            for (let i: any = 0; i < spaceList.length; i++) {
-              if (spaceList[i].canClick) {
-                proxyData.selectArea = spaceList[i]
-                break
-              }
-            }
-          }
-        }
-      },
-      /**
-       * 首次进入页面设置选中的空间
-       */
-      getFirstSelectSpace(item: any) {
-        let area: any = null
-        let data: any = proxyData.mapData
-        if (data && item) {
-          let spaceList = data?.spaceList ?? []
-          for (let i = 0; i < spaceList.length; i++) {
-            if (spaceList[i].spaceId === item.spaceId) {
-              // proxyData.selectArea = spaceList[i]
-              area = spaceList[i]
-              if (!proxyData.isSetSpace) {
-                localStorageSpaceId(proxyData.buildingItem.buildingId, proxyData.floorItem.id, proxyData.selectArea.spaceId)
-              }
-              break
-            }
-          }
-        }
-        return area
-      },
-      setDefaultSpace(item: any) {
-        if (item) {
-          proxyData.buildingItem.buildingId = item.buildingId
-          proxyData.buildingItem.localName = item.buildingName ? item.buildingName : ''
-          proxyData.floorItem = {
-            id: item.floorId,
-            localName: item.floorName ? item.floorName : ''
-          }
-        }
-      },
-      // 设备模块初始化地图
-      init(item: any) {
-        proxyData.setDefaultSpace(item)
-        /**
-         *缓存建筑对应的楼层
-         */
-        if (!proxyData.isSetSpace) {
-          localStorageFloor(proxyData.buildingItem.buildingId, proxyData.floorItem.id)
-        }
-        proxyData.getBuildingList()
-        proxyData.getFloorList(false)
-        proxyData.getMapInfo(false, item)
-      },
-
-      /**
-       *搜索后设置建筑的localName
-       */
-      setBuildingName() {
-        if (proxyData.buildingItem.buildingId) {
-          proxyData.buildingData.map((item: any) => {
-            if (item.id === proxyData.buildingItem.buildingId) {
-              proxyData.buildingItem.localName = item.localName
-            }
-          })
-        } else {  // 设置常驻空间的时候使用
-          proxyData.buildingItem = {
-            buildingId: proxyData.buildingData[0].id,
-            localName: proxyData.buildingData[0].localName
-          }
-        }
-      },
-      /**
-       * 搜索页面回来根据id设置楼层的localName
-       */
-      setFloorName() {
-        if (proxyData.floorItem.id) {
-          proxyData.floorData.map((item: any) => {
-            if (item.id === proxyData.floorItem.id) {
-              proxyData.floorItem.localName = item.localName
-            }
-          })
-        } else {  // 设置常驻空间的时候使用
-          proxyData.floorItem = proxyData.floorData[0]
-        }
-      }
-    })
-    // watch(
-    //   props.spaceInfo, (newVal, oldValue) => {
-    //
-    //   }
-    // )
-    onMounted(() => {
-      // proxyData.formateMapData()
-      // proxyData.setMapBoxStyle()
-      let item: any = props.spaceInfo
-      proxyData.init(item)
-    })
-    return {
-      ...toRefs(proxyData)
-    }
-  }
-})
-</script>
-<style lang="scss" scoped>
-.space-main {
-  width: 100%;
-  height: 100%;
-  position: relative;
-  background: #f7f8fa;
-  //transform-origin: 0 0;
-  transition: transform 0.3s;
-  transform: scale(1);
-  padding: 0 5px;
-  overflow: auto;
-
-  .space-box {
-    position: absolute;
-    padding: 5px;
-  }
-
-  .space {
-    position: relative;
-    width: 100%;
-    height: 100%;
-    box-shadow: 0px 1px 4px rgba(1, 1, 51, 0.01), 0px 16px 40px rgba(1, 1, 51, 0.03);
-    border-radius: 4px;
-    box-sizing: border-box;
-
-    .device {
-      position: absolute;
-      left: 50%;
-      top: 50%;
-      transform: translate(-50%, -50%);
-      text-align: center;
-      z-index: 666;
-
-      img {
-        //margin-bottom: 6px;
-      }
-
-      span {
-        display: block;
-        word-break: keep-all;
-        white-space: nowrap;
-        //font-size: 12px;
-        color: #8995ba;
-        font-weight: 600;
-      }
-    }
-
-    .select-device {
-      transform: translate(-50%, -70%);
-
-      img {
-        margin-bottom: 6px;
-      }
-    }
-
-    .circle {
-      width: 4px;
-      height: 4px;
-      border-radius: 50%;
-      position: absolute;
-      top: 50%;
-      left: 50%;
-      transform: translateX(-50%) translateY(-50%);
-    }
-  }
-
-
-  .select {
-    border: 2px solid rgba(77, 148, 255, 0.8);
-  }
-
-  .use-select {
-    border: 5px solid #FFE823;
-  }
-
-  &::-webkit-scrollbar {
-    display: none;
-  }
-}
-
-.map-toolbar {
-  position: fixed;
-  width: 44px;
-  right: 20px;
-  z-index: 999;
-  top: 50%;
-  transform: translateY(-50%);
-
-  .icon-search {
-    width: 44px;
-    height: 44px;
-    border-radius: 5px;
-    background: #fff;
-  }
-
-  .toolbar-item {
-    width: 44px;
-    height: 44px;
-    background: #FFFFFF;
-    box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.1), 0px 4px 8px rgba(0, 0, 0, 0.1);
-    border-radius: 4px;
-    margin-top: 10px;
-    text-align: center;
-
-    .toolbar-menu {
-      width: 44px;
-    }
-
-    img {
-      width: 12px;
-      height: 14px;
-      margin-top: 15px;
-    }
-  }
-
-  .text-hidden {
-    //font-family: Montserrat;
-    display: block;
-    font-style: normal;
-    width: 44px;
-    line-height: 44px;
-    font-weight: 500;
-    font-size: 16px;
-    text-align: center;
-    color: #4D5262;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-}
-
-.buiding-item {
-  //font-family: 'Montserrat';
-  width: 100%;
-  padding: 10px;
-  font-style: normal;
-  font-weight: 500;
-  font-size: 14px;
-  text-align: left;
-  color: rgba(13, 13, 61, 0.86);
-  border-bottom: 1px solid rgba(2, 2, 82, 0.03)
-}
-
-.active {
-  color: rgba(77, 148, 255, 0.8);
-}
-
-</style>

+ 0 - 29
src/views/envmonitor/SpaceSeting.vue

@@ -1,29 +0,0 @@
-<template>
-  <div class="air" />
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-export default defineComponent({
-  components: { }
-})
-</script>
-<style lang="scss" scoped>
-.air{
-  width: 100%;
-  height: 100%;
-  background: #FFFFFF;
-  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.07), 0px 4px 10px rgba(0, 0, 0, 0.05);
-  border-radius: 25px;
-  flex: none;
-  order: 0;
-  flex-grow: 0;
-  background: #FFFFFF;
-  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.07), 0px 4px 10px rgba(0, 0, 0, 0.05);
-  border-radius: 25px;
-  flex: none;
-  order: 0;
-  flex-grow: 0;
-  margin: 15px 0px;
-}
-</style>

+ 870 - 0
src/views/envmonitor/components/Air.vue

@@ -0,0 +1,870 @@
+<template>
+  <div class="air">
+    <div class="air-top">
+      <div class="air-desc">
+        <p class="air-title">空调</p>
+        <p class="air-temperature" v-if="temperature">
+          {{ temperature ? temperature : "--" }}
+          <sup>℃</sup>
+        </p>
+        <p class="air-model">
+          <span v-if="modeName">
+            {{ modeName }}
+          </span>
+          <span v-if="airData.tempSet"> {{ airData.tempSet }}℃ </span>
+        </p>
+        <p class="air-status" v-if="hasAir">
+          {{ airData.isOpen ? "空调已开启" : "空调已关闭" }}
+        </p>
+        <p class="air-loading" v-if="airData.isOpen">
+          <img
+            v-if="airData.icon == 1 || airData.icon == 2 || airData.icon == 3"
+            :src="airRunImg"
+            alt=""
+          />
+          <span>{{ airData.spaceStatus }}</span>
+        </p>
+      </div>
+      <div class="air-right">
+        <img v-if="airData.airImg" :src="airData.airImg" alt="" />
+        <van-loading style="padding-top: 20px" v-else />
+
+        <Switch
+          class="switch-btn"
+          :loading="loadingAir || firstLoadingAir"
+          :disabled="!userIsControl || loadingAir || firstLoadingAir"
+          inactive-color="rgba(196, 196, 196, 0.4)"
+          size="24px"
+          @click="airChange"
+          :model-value="airData.isOpen"
+          v-if="hasAir"
+        />
+      </div>
+    </div>
+    <!--温度调节-->
+    <div class="air-control" v-if="userIsControl && airData.isOpen">
+      <div class="control-title">温度调节</div>
+      <div class="btn-box">
+        <div
+          class="control-btn mr20"
+          @click.stop="changeAir(4, 'temp', 'toCold')"
+        >
+          <img :src="parseImgUrl('envmonitor', 'arrow-top.png')" alt="" />
+        </div>
+        <div class="control-btn" @click.stop="changeAir(2, 'temp', 'toWarm')">
+          <img :src="parseImgUrl('envmonitor', 'arrow-down.png')" alt="" />
+        </div>
+      </div>
+    </div>
+    <div
+      class="air-control"
+      v-if="userIsControl && airData.isOpen && showAirVolumeBtn"
+    >
+      <div class="control-title">风量调节</div>
+      <div class="btn-box">
+        <div
+          class="control-btn mr20"
+          @click.stop="changeAir(5, 'wind', 'toWindLow')"
+        >
+          <img
+            class="temp-img"
+            :src="parseImgUrl('envmonitor', 'fengshan.png')"
+            alt=""
+          />
+        </div>
+        <div class="control-btn" @click.stop="changeAir(6, 'wind', 'toWindUp')">
+          <img
+            class="temp-img"
+            :src="parseImgUrl('envmonitor', 'wendu.png')"
+            alt=""
+          />
+        </div>
+      </div>
+    </div>
+
+    <!-- 空调反馈 文案 -->
+    <van-dialog
+      v-model:show="showDialog"
+      class="dialog-width"
+      :show-confirm-button="false"
+      :show-cancel-button="false"
+    >
+      <div class="air-dialog-content">
+        <div class="dialog-top">
+          <img
+            class="img-greey"
+            :class="
+              airSetText.toWhere == 'toCold'
+                ? 'img-blue'
+                : airSetText.toWhere == 'toWarm'
+                ? 'img-red'
+                : ''
+            "
+            :src="parseImgUrl('page-officehome', airSetText.nowImg)"
+            alt=""
+          />
+        </div>
+        <div class="dialog-text">
+          <div
+            class="air-body-item-num"
+            v-if="
+              airSetText.toWhere === 'toCold' || airSetText.toWhere === 'toWarm'
+            "
+          >
+            <div class="air-temp-num">{{ temperature }}</div>
+            <div
+              class="air-temp-num"
+              :class="{
+                'arrow-cooling': airSetText.toWhere == 'toCold',
+                'arrow-warn': airSetText.toWhere == 'toWarm',
+              }"
+            >
+              →
+            </div>
+            <div v-if="airSetText.designTemperature" class="air-temp-num">
+              {{ airSetText.designTemperature }}
+            </div>
+            <div v-else class="air-temp-num-load">
+              <img
+                style="padding-top: 4px; height: 20px; width: 20px"
+                :src="parseImgUrl('page-officehome', 'loading.svg')"
+              />
+            </div>
+          </div>
+          <p v-if="airSetText.notice" class="air-notice">
+            <span>{{ airSetText.notice }}</span>
+          </p>
+          <div v-else class="air-temp-load">
+            <van-loading type="spinner" />
+          </div>
+        </div>
+        <div class="dialog-btns" @click.stop="closeDialog">
+          <span>确定</span>
+        </div>
+      </div>
+    </van-dialog>
+  </div>
+</template>
+
+<script lang="ts">
+import {
+  defineComponent,
+  onMounted,
+  reactive,
+  toRefs,
+  computed,
+  watch,
+  onUnmounted,
+  onBeforeMount,
+  onBeforeUnmount,
+} from "vue";
+import { Switch, Dialog, Loading, Toast } from "vant";
+import {
+  changeTempHttp,
+  getEquipmentListHttp,
+  getFeedbackDocumentsHttp,
+} from "@/apis/envmonitor";
+import { parseImgUrl } from "@/utils";
+import any = jasmine.any;
+
+export default defineComponent({
+  props: {
+    temperature: {
+      // 空调基本信息
+      type: Number,
+      default: () => 0,
+    },
+    hasAir: {
+      // 有无空调
+      type: Boolean,
+      default: () => false,
+    },
+    airVolumes: {
+      // 风量信息
+      type: Array,
+      default: () => [],
+    },
+    projectId: {
+      type: String,
+      default: () => "",
+    },
+    spaceId: {
+      type: String,
+      default: () => "",
+    },
+    userIsControl: {
+      type: Boolean,
+      default: () => false,
+    },
+  },
+  components: {
+    Switch,
+    [Dialog.Component.name]: Dialog.Component,
+    Loading,
+  },
+  setup(props, contx) {
+    const propsVal = props;
+    let airData: any = {
+      avg: "--", // 算法调节温度(目标值)
+      icon: 1, // 固定框文案ID 7 为关机,其它都是开机
+      spaceStatus: "", // 固定框文案展示
+      notice: "", // 弹框文案展示
+      mode: 0, //  模式
+      tempSet: 0, // 温度
+      isOpen: false, // 空调开关 true 是开
+    };
+    const feedbackTimer: any = null;
+    const airTimer: any = null;
+    const domAirOpeen: any = false;
+    const proxyData = reactive({
+      loadingAir: false,
+      temperature: props.temperature,
+      userIsControl: props.userIsControl,
+      firstLoadingAir: true,
+      domAirOpeen: domAirOpeen,
+      feedbackTimer: feedbackTimer,
+      parseImgUrl: parseImgUrl,
+      airData: airData,
+      modeName: "",
+      showAirVolumeBtn: false, // 是否展示风量调节按钮
+      showDialog: false,
+      airTimer: airTimer,
+      airSetText: {
+        // 空调反馈文案
+        notice: "",
+        nowImg: "",
+        toWhere: "",
+        designTemperature: 0,
+      },
+      // 格式化模式
+      formateModel(model: any) {
+        if (model) {
+          if (model === 1) {
+            proxyData.modeName = "制冷";
+          } else if (model === 2) {
+            proxyData.modeName = "制热";
+          } else if (model === 3) {
+            proxyData.modeName = "通风";
+          } else if (model === 4) {
+            proxyData.modeName = "除湿";
+          } else {
+            proxyData.modeName = "";
+          }
+        } else {
+          proxyData.modeName = "";
+        }
+      },
+      // 获取设备类型(ACATVI)
+      getEquipmentListHttp() {
+        let params = {
+          spaceId: props.spaceId,
+        };
+        proxyData.showAirVolumeBtn = false;
+        let flag: any = true;
+        getEquipmentListHttp(params).then((res) => {
+          let resData: any = res;
+          let data: any = resData ? resData.data : [];
+          for (let i = 0; i < data.length; i++) {
+            let item: any = data[i];
+            if (item.equipmentCategory === "ACATVI") {
+              // 多联机不展示风量调整
+              proxyData.showAirVolumeBtn = false;
+              flag = false;
+              break;
+            }
+          }
+          if (flag) {
+            proxyData.showAirVolumeBtn = true;
+          }
+        });
+      },
+      // 定时获取空调状态
+      getAirInfoToTimer(timerLong: any = 3000) {
+        if (proxyData.airTimer) {
+          clearTimeout(proxyData.airTimer);
+        }
+        proxyData.airTimer = setTimeout(function () {
+          proxyData.getAirInfo();
+        }, timerLong);
+      },
+      // 定时调文案的接口
+      getFeedbackTimer(btnType: any, id: any) {
+        clearTimeout(proxyData.airTimer);
+        proxyData.airTimer = null;
+        proxyData.feedbackTimer = setTimeout(() => {
+          proxyData.getAirInfo("feedback", btnType, id, false); // 调节反馈文案
+        }, 3000);
+      },
+      // 关闭空调的按钮点击的loading状态
+      closeLoading() {
+        let num: any = 0;
+        let interval: any = setInterval(() => {
+          if (num > 30 || proxyData.domAirOpeen === proxyData.airData.isOpen) {
+            proxyData.loadingAir = false;
+            clearInterval(interval);
+          }
+          num++;
+        }, 1000);
+      },
+      getAirInfo(
+        type: string = "",
+        btnType: string = "",
+        feedbackId: any = "",
+        isTimer: boolean = true
+      ) {
+        let paramObj: any = {
+          projectId: propsVal.projectId, // 项目id
+          objectId: propsVal.spaceId, // 空间id
+        };
+
+        if (type === "feedback") {
+          paramObj.id = feedbackId;
+        }
+        console.log("paramObj===");
+        getFeedbackDocumentsHttp(paramObj)
+          .then((res) => {
+            const resData: any = res;
+            if (type !== "feedback") {
+              if (resData) {
+                proxyData.airData = resData;
+                proxyData.formateModel(proxyData.airData.mode);
+                contx.emit("updateAirTemp", proxyData.airData.tempSet);
+                if (
+                  proxyData.airData.icon &&
+                  (proxyData.airData.icon === 7 || proxyData.airData.icon === 8)
+                ) {
+                  proxyData.airData.isOpen = false;
+                  proxyData.airData.airImg = parseImgUrl(
+                    "page-officehome",
+                    "air_close.png"
+                  );
+                } else {
+                  proxyData.airData.isOpen = true;
+                  proxyData.airData.airImg = parseImgUrl(
+                    "page-officehome",
+                    "openair.png"
+                  );
+                }
+              }
+            }
+            //   弹窗
+            if (type === "feedback") {
+              if (resData.notice) {
+                proxyData.airSetText.notice = resData.notice;
+                if (proxyData.feedbackTimer) {
+                  clearTimeout(proxyData.feedbackTimer); // 拿到反馈文案清除定时器
+                  proxyData.getAirInfoToTimer();
+                }
+              } else {
+                proxyData.getFeedbackTimer(btnType, feedbackId);
+              }
+            } else {
+              proxyData.getAirInfoToTimer();
+            }
+            proxyData.firstLoadingAir = false;
+          })
+          .catch(() => {
+            proxyData.getAirInfoToTimer();
+            proxyData.firstLoadingAir = false;
+            proxyData.airData.airImg = parseImgUrl(
+              "page-officehome",
+              "air_close.png"
+            );
+          });
+      },
+      airChange() {
+        // 先不更新状态等确认框弹出后再更新状
+        if (proxyData.userIsControl) {
+          if (!proxyData.loadingAir) {
+            proxyData.airComfir();
+          } else {
+            Toast("指令正在下发中,勿重复操作!");
+          }
+        } else {
+          Toast("您没有当前空间的控制权限!");
+        }
+      },
+      // 确认
+      airComfir() {
+        const message = proxyData.airData.isOpen
+          ? "要关闭空调吗?"
+          : "要开启空调吗?";
+        const confirmBtnText = proxyData.airData.isOpen ? "关闭" : "开启";
+        Dialog.confirm({
+          cancelButtonText: "取消",
+          confirmButtonText: confirmBtnText,
+          confirmButtonColor: "$elActiveColor",
+          message: message,
+        })
+          .then(() => {
+            // 操作空调
+            const domAirOpen = !proxyData.airData.isOpen;
+            const itemId = domAirOpen ? 12 : 10; // 12 开启 10关闭
+            proxyData.domAirOpeen = domAirOpen;
+            let btnTypeDetail = "";
+            if (itemId == 12) {
+              btnTypeDetail = "openAir";
+            } else {
+              btnTypeDetail = "closeAir";
+            }
+            proxyData.loadingAir = true;
+            proxyData.closeLoading();
+            proxyData.changeAir(itemId, "sw", btnTypeDetail);
+          })
+          .catch(() => {
+            // on cancel
+          });
+      },
+      // 切换散会的时候手动关闭空调()
+      closeScenarioAir() {
+        proxyData.changeAir(10, "sw", "closeAir");
+      },
+      // 更新空调开关状态
+      updatAirStatus(btnType: string) {
+        // 开启空调后手动调一下状态更新接口
+        if (btnType === "sw") {
+          proxyData.getAirInfo("", "", "", false);
+        }
+      },
+      // 更新
+      updateAirText(btnType: string, val: any) {
+        if (btnType !== "sw") {
+          proxyData.airSetText.designTemperature = val.designTemperature; // 目标温度
+          proxyData.airSetText.toWhere = val.toWhere;
+          if (proxyData.airSetText.toWhere == "toCold") {
+            proxyData.airSetText.nowImg = "dialog_cooling.svg";
+          } else if (proxyData.airSetText.toWhere == "toWarm") {
+            proxyData.airSetText.nowImg = "dialog_warmUp.svg";
+          } else {
+            proxyData.airSetText.nowImg = "icon_wind.svg";
+          }
+        }
+      },
+      // 展示空调反馈弹窗¬
+      showAirConditioning(btnType: string, btnTypeDetail: string) {
+        // 空调温度和风量调整的时候展示弹窗
+        if (btnType !== "sw") {
+          proxyData.showDialog = true;
+          // 调整空调温度接口
+          const defaultAirText: any = {
+            toWhere: btnTypeDetail,
+            designTemperature: 0,
+          };
+          proxyData.updateAirText(btnType, defaultAirText);
+        }
+      },
+      // 关闭弹窗
+      closeDialog() {
+        if (proxyData.feedbackTimer) {
+          clearInterval(proxyData.feedbackTimer); // 拿到反馈文案清除定时器
+          proxyData.feedbackTimer = null;
+        }
+        proxyData.getAirInfoToTimer();
+        proxyData.showDialog = false;
+      },
+      changeAir(itemId: number, btnType: string, btnTypeDetail: string) {
+        /**
+         * 缺少的逻辑:
+         * 1.设备位置判断
+         * 2.空调温度调整的反馈文案
+         */
+        // 温度切换的时候调整文案
+        proxyData.airSetText.notice = "";
+        const paramObj = {
+          projectId: propsVal.projectId, // 项目id
+          objectId: propsVal.spaceId, // 空间id
+          valueType: 1, // 固定为1
+          itemId: itemId, //    12 开启 10关闭  4 调低温  2 调高温 5 调小风量 6 调大风量
+        };
+        // 空调温度和风量调整的时候展示弹窗
+        proxyData.showAirConditioning(btnType, btnTypeDetail);
+        changeTempHttp(paramObj)
+          .then((res) => {
+            let resData: any = res;
+            // 开启和关闭空调之后手动
+            // proxyData.updatAirStatus(btnType)
+            // 调整温度和风量的时候修改文案
+            let airText = {
+              toWhere: btnTypeDetail,
+              designTemperature: resData.designTemperature,
+            };
+            proxyData.updateAirText(btnType, airText);
+            // 改变温度和风量的时候给弹窗设置文案
+            if (btnType !== "sw") {
+              if (resData.notice) {
+                proxyData.airSetText.notice = resData.notice;
+              } else {
+                proxyData.getFeedbackTimer(btnType, resData.id);
+              }
+            }
+          })
+          .catch(() => {
+            proxyData.loadingAir = false;
+          });
+      },
+    });
+    watch(props, (newProps: any) => {
+      if (newProps.spaceId) {
+        // 空间id改变的重新获取值调用接口
+        // 定时调空间信息
+        proxyData.getAirInfoToTimer(0);
+        // proxyData.getAirInfo()
+        proxyData.getEquipmentListHttp();
+      }
+      proxyData.temperature = props.temperature;
+      proxyData.userIsControl = newProps.userIsControl;
+    });
+    onBeforeUnmount(() => {
+      if (proxyData.airTimer) {
+        clearTimeout(proxyData.airTimer);
+        proxyData.airTimer = null;
+      }
+      if (proxyData.feedbackTimer) {
+        clearTimeout(proxyData.feedbackTimer);
+        proxyData.feedbackTimer = null;
+      }
+    });
+    onMounted(() => {
+      // 获取空调信息
+      proxyData.firstLoadingAir = true;
+      proxyData.getAirInfo();
+      proxyData.getEquipmentListHttp();
+    });
+    const airRunImg = computed(() => {
+      let imgStr: string = "";
+      switch (proxyData.airData.icon) {
+        case 1:
+          imgStr = parseImgUrl("page-officehome", "temp-keep.png");
+          break;
+        case 2:
+          imgStr = parseImgUrl("page-officehome", "temp_cold.svg");
+          break;
+        case 3:
+          imgStr = parseImgUrl("page-officehome", "temp_sun.png");
+          break;
+        default:
+          imgStr = "";
+          break;
+      }
+      return imgStr;
+    });
+    return {
+      airRunImg,
+      ...toRefs(proxyData),
+    };
+  },
+});
+</script>
+<style lang="scss" scoped>
+.air {
+  width: 100%;
+  background: #ffffff;
+  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.07), 0px 4px 10px rgba(0, 0, 0, 0.05);
+  border-radius: 25px;
+  margin: 15px 0px;
+}
+
+.air-top {
+  padding-left: 20px;
+  padding-bottom: 10px;
+  display: flex;
+  justify-content: space-between;
+}
+
+.air-desc {
+  flex: 1 157px;
+  padding-top: 10px;
+  font-family: PingFang SC;
+  font-size: 16px;
+  line-height: 19px;
+  color: #4d5262;
+  flex: none;
+  order: 0;
+  //color: rgba(196, 196, 196, 0.2)
+  flex-grow: 0;
+  margin: 5px 0px;
+}
+
+.air-right {
+  position: relative;
+  width: 157px;
+  text-align: center;
+
+  img {
+    width: 147px;
+    height: 110px;
+  }
+
+  .switch-btn {
+    position: absolute;
+    z-index: 111;
+    bottom: 10px;
+    right: 25px;
+  }
+}
+
+.air-title {
+  font-family: PingFang SC;
+  padding-left: 5px;
+  font-size: 16px;
+  line-height: 19px;
+  color: #4d5262;
+  flex: none;
+  order: 0;
+  flex-grow: 0;
+  margin: 5px 0px;
+}
+
+.air-temperature {
+  display: inline-block;
+  font-family: "Montserrat";
+  font-style: normal;
+  font-weight: normal;
+  font-size: 32px;
+  line-height: 32px;
+  flex: none;
+  order: 0;
+  flex-grow: 0;
+  margin: 0px 4px;
+
+  sup {
+    font-family: Mulish;
+    font-style: normal;
+    font-weight: 800;
+    font-size: 12px;
+    line-height: 15px;
+  }
+}
+
+.air-model {
+  padding-left: 5px;
+  display: inline-block;
+  font-family: "Montserrat";
+  font-style: normal;
+  font-weight: 400;
+  font-size: 15px;
+  line-height: 18px;
+  color: #c4c4c4;
+
+  span {
+    padding-right: 2px;
+  }
+}
+
+.air-status {
+  font-family: PingFang SC;
+  padding-left: 5px;
+  font-size: 14px;
+  line-height: 16px;
+  color: #c4c4c4;
+  flex: none;
+  order: 1;
+  flex-grow: 0;
+  margin: 10px 0px;
+}
+
+.air-loading {
+  font-family: Roboto;
+  padding-left: 5px;
+  font-style: normal;
+  font-weight: normal;
+  font-size: 11px;
+  //line-height: 13px;
+  color: #c4c4c4;
+
+  img {
+    width: 12px;
+    height: 12px;
+    vertical-align: middle;
+  }
+
+  span {
+    vertical-align: middle;
+  }
+}
+
+.air-control {
+  display: flex;
+  justify-content: space-between;
+  padding: 10px 0;
+  padding-left: 28px;
+  padding-right: 15px;
+  border-top: 1px solid rgba(196, 196, 196, 0.4);
+
+  .control-title {
+    flex: 1;
+    line-height: 42px;
+    font-weight: 500;
+    font-size: 12px;
+    color: #c4c4c4;
+  }
+
+  .btn-box {
+    flex: 1;
+    text-align: right;
+  }
+
+  .control-btn {
+    display: inline-block;
+    vertical-align: middle;
+    width: 42px;
+    height: 42px;
+    text-align: center;
+    border-radius: 50%;
+    background: rgba(196, 196, 196, 0.2);
+
+    img {
+      width: 13px;
+      height: 17px;
+      margin: 0 auto;
+      margin-top: 12.5px;
+    }
+
+    .temp-img {
+      width: 20px;
+      height: 20px;
+    }
+  }
+}
+
+.dialog-width {
+  width: 280px !important;
+}
+
+.air-dialog-content {
+  position: relative;
+  width: 100%;
+  height: 360px;
+
+  .dialog-top {
+    position: relative;
+    height: 70px;
+    background: #f3f3f3;
+
+    .img-greey {
+      background: #c4c4c4;
+    }
+
+    .img-blue {
+      background: $elActiveColor;
+    }
+
+    .img-red {
+      background: #e5574f;
+    }
+
+    img {
+      box-sizing: border-box;
+      border-radius: 50%;
+      position: absolute;
+      left: 50%;
+      width: 70px;
+      height: 70px;
+      padding: 17px;
+      transform: translateX(-50%);
+      top: 15px;
+    }
+  }
+}
+
+.dialog-text {
+  padding-top: 52px;
+  text-align: center;
+
+  .air-temp-num {
+    font-family: Montserrat;
+    display: inline-block;
+    font-size: 24px;
+    font-weight: 400;
+    line-height: 29px;
+    color: rgba(20, 0, 80, 1);
+
+    &.arrow-cooling {
+      color: $elActiveColor;
+      margin: 0 30px;
+      margin-bottom: 70px;
+    }
+
+    &.arrow-warn {
+      color: rgba(229, 87, 79, 1);
+      margin: 0 30px;
+      margin-bottom: 70px;
+    }
+  }
+
+  .air-temp-num-load {
+    display: inline-block;
+  }
+
+  .air-notice {
+    padding-top: 25px;
+    padding-left: 48px;
+    padding-right: 48px;
+    text-align: left;
+    display: flex;
+    justify-content: center;
+    font-family: PingFang SC;
+    font-size: 15px;
+    font-weight: 400;
+    line-height: 21px;
+    color: rgba(77, 82, 98, 1);
+  }
+
+  .air-temp-load {
+    padding-top: 25px;
+  }
+
+  .air-body-item-num {
+    height: 50px;
+  }
+}
+
+.dialog-btns {
+  position: absolute;
+  left: 50%;
+  bottom: 30px;
+  transform: translateX(-50%);
+  text-align: center;
+  margin: 0 auto;
+  width: 88px;
+  height: 46px;
+  line-height: 1;
+  color: #4d5262;
+  background: #ffffff;
+  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.05), 0px 4px 15px rgba(0, 0, 0, 0.15);
+  border-radius: 25px;
+  cursor: pointer;
+
+  span {
+    height: 46px;
+    line-height: 46px;
+    display: inline-block;
+  }
+}
+</style>
+<style lang="scss">
+.air-dialog-content {
+  .van-button_text {
+    color: $elActiveColor;
+  }
+}
+
+.air {
+  .van-loading__spinner {
+    color: $elActiveColor !important;
+  }
+
+  .van-switch__loading {
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    line-height: 1;
+  }
+
+  .van-switch--disabled {
+    opacity: 0.5;
+  }
+ 
+}
+</style>

+ 1 - 0
src/views/envmonitor/Curtain.vue

@@ -278,6 +278,7 @@ export default defineComponent({
       (newProps: any) => {
         if (newProps.spaceId) {
           // 当前空间的控制权限
+          proxyData.getEqpGroup()
           proxyData.userIsControl = newProps.userIsControl
         }
       }

+ 18 - 20
src/views/envmonitor/Light.vue

@@ -26,8 +26,7 @@
                 :disabled="!userIsControl"
                 v-model="lampSw"
                 @click="eqChange('allLamp','',0)"
-                active-color="#FFE823"
-                inactive-color="rgba(196, 196, 196, 0.2)"
+                inactive-color="rgba(196, 196, 196, 0.4)"
                 class="switch-btn"
         />
       </div>
@@ -42,7 +41,7 @@
         {{ item.localName }}
       </div>
       <Switch size="24px"
-              active-color="#FFE823"
+              active-color="$elActiveColor"
               :disabled="!userIsControl"
               v-model="item.switch"
               @click="eqChange('main',item,index)"
@@ -87,7 +86,7 @@ export default defineComponent({
   components: { Switch },
   setup(props) {
     const lampList: any = []
-    const lightsStatusTimer: any = null
+    let lightsStatusTimer: any = null
     const timeOut: any = null
     const initData: any = []
     let lightParams: any = []
@@ -136,6 +135,7 @@ export default defineComponent({
                 : parseImgUrl('page-officehome', 'lamp_close_v2.png')
             }
           }
+          console.log('执行了----====')
           proxyData.startLightsStatusTimer()
         }).catch(() => {
           proxyData.startLightsStatusTimer()
@@ -327,21 +327,15 @@ export default defineComponent({
           proxyData.getTimeLampStatus(checkData, type, id, value, index)
         })
       },
-      // 清楚定时器
-      clearLightStatusTimer() {
-        if (proxyData.lightsStatusTimer) {
-          clearInterval(proxyData.lightsStatusTimer)
-        }
-      },
       // 定时刷新接口
       startLightsStatusTimer() {
         if (proxyData.lightsStatusTimer) {
-          clearTimeout(proxyData.lightsStatusTimer)
+          window.clearTimeout(proxyData.lightsStatusTimer)
           proxyData.lightsStatusTimer = null
         }
-        proxyData.lightsStatusTimer = setTimeout(() => {
+        proxyData.lightsStatusTimer = window.setTimeout(() => {
           proxyData.getLampList()
-        }, 1000)
+        }, 2000)
       }
     })
     const isShowChildLight = computed(() => {
@@ -351,22 +345,26 @@ export default defineComponent({
       props,
       (newProps: any) => {
         if (newProps.spaceId) {   // 空间id改变的重新获取值调用接口
+          console.log('spaceid变化了=======')
           proxyData.startLightsStatusTimer()
         }
         // 定时调空间信息
         proxyData.userIsControl = newProps.userIsControl
-      }
-    )
+      }, {
+        deep: false,
+        immediate: true
+      })
     onBeforeUnmount(() => {
       if (proxyData.lightsStatusTimer) {
-        clearTimeout(proxyData.lightsStatusTimer)
+        window.clearTimeout(proxyData.lightsStatusTimer)
         proxyData.lightsStatusTimer = null
       }
     })
     onMounted(() => {
+      // console.log('空间切换====d')
       // 获取空调信息
-      // proxyData.getLampList()
-      proxyData.startLightsStatusTimer()
+      proxyData.getLampList()
+      // proxyData.startLightsStatusTimer()
     })
     return {
       isShowChildLight,
@@ -488,7 +486,7 @@ export default defineComponent({
 <style class="style" lang="scss">
 .light {
   .van-loading__spinner {
-    color: #FFB800 !important;
+    color: $elActiveColor !important;
   }
 
   .van-switch__loading {
@@ -500,7 +498,7 @@ export default defineComponent({
   }
 
   .van-switch--disabled {
-    opacity: 0.3;
+    opacity: 0.5;
   }
 }
 </style>

src/views/envmonitor/Scenario.vue → src/views/envmonitor/components/Scenario.vue


+ 109 - 0
src/views/envmonitor/components/ScenarioConfig.vue

@@ -0,0 +1,109 @@
+<template>
+  <div class="scene-config">
+    <div
+      class="scene-item"
+      :key="'scene' + index"
+      @click="checkScenario(item)"
+      :style="{
+        flex:
+          scenarioArr.length && scenarioArr.length == 2 && item.id === activeId
+            ? 2
+            : 1,
+      }"
+      :class="item.id === activeId ? 'scene-active' : ''"
+      v-for="(item, index) in scenarioArr"
+    >
+      <img :src="item.img" alt="" />
+      <span>{{ item.name }}</span>
+    </div>
+  </div>
+</template>
+
+<script lang="ts">
+import {
+  defineComponent,
+  reactive,
+  toRefs,
+  onBeforeMount,
+  onMounted,
+  ref,
+} from "vue";
+import { useRouter } from "vue-router";
+import { parseImgUrl } from "@/utils";
+import { UserActionTypes } from "@/store/modules/user/action-types";
+import { useStore } from "@/store";
+
+export default defineComponent({
+  setup(props) {
+    let router: any = useRouter();
+    const store = useStore();
+    const scenarioArr: any = [
+      {
+        id: 1,
+        name: "讨论",
+        img: parseImgUrl("ipdImages", "taolun.svg"),
+      },
+      {
+        id: 2,
+        name: "投影",
+        img: parseImgUrl("ipdImages", "touying.svg"),
+      },
+      // {
+      //   id: 3,
+      //   name: "散会",
+      //   img: parseImgUrl("ipdImages", "sanhui.svg"),
+      // },
+    ];
+    const proxyData = reactive({
+      parseImgUrl: parseImgUrl,
+      scenarioArr: scenarioArr,
+      activeId: 1,
+      onSubmit(values: any) {
+        router.push({ path: "/choice-project" });
+      },
+      checkScenario(item: any) {
+        proxyData.activeId = item.id;
+      },
+    });
+    return {
+      ...toRefs(proxyData),
+    };
+  },
+});
+</script>
+<style lang="scss" scoped>
+.scene-config {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  padding: 20px;
+  width: 100%;
+  height: 100%;
+  background: #ffffff;
+  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.07), 0px 4px 10px rgba(0, 0, 0, 0.05);
+  border-radius: 25px;
+  .scene-item {
+    flex: 1;
+    line-height: 58px;
+    background: rgba(159, 183, 205, 0.15);
+    border-radius: 16px;
+    margin-left: 10px;
+    text-align: center;
+    &:nth-child(1) {
+      margin-left: 0;
+    }
+    img {
+      display: inline-block;
+      vertical-align: middle;
+      width: 20px;
+      height: 20px;
+      margin-right: 5px;
+    }
+  }
+  .scene-active {
+    background: $elActive4;
+  }
+}
+</style>
+<style lang="scss">
+</style>

+ 160 - 0
src/views/envmonitor/components/WorkConfig.vue

@@ -0,0 +1,160 @@
+<template>
+  <div class="scene-config">
+    <!--开放办公区-->
+    <div class="time-box">
+      <img :src="parseImgUrl('page-officehome', 'work.svg')" alt="" />
+      <div class="time-text">
+        <span>工作时间</span>
+        <span>09:00~20:00</span>
+      </div>
+      <div class="time-btn">
+        <span> 预约</span>
+        <span>延时</span>
+      </div>
+    </div>
+    <div class="time-del">
+      <img :src="parseImgUrl('page-officehome', 'goOffWork.svg')" alt="" />
+      <div class="del-text">
+        <span>我要</span>
+        <span>离开</span>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts">
+import {
+  defineComponent,
+  reactive,
+  toRefs,
+  onBeforeMount,
+  onMounted,
+  ref,
+} from "vue";
+import { useRouter } from "vue-router";
+import { parseImgUrl } from "@/utils";
+import { UserActionTypes } from "@/store/modules/user/action-types";
+import { useStore } from "@/store";
+
+export default defineComponent({
+  setup(props) {
+    let router: any = useRouter();
+    const store = useStore();
+    const proxyData = reactive({
+      parseImgUrl: parseImgUrl,
+      onSubmit(values: any) {
+        router.push({ path: "/choice-project" });
+      },
+    });
+    return {
+      ...toRefs(proxyData),
+    };
+  },
+});
+</script>
+<style lang="scss" scoped>
+.scene-config {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  padding: 20px;
+  width: 100%;
+  height: 100%;
+  background: #ffffff;
+  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.07), 0px 4px 10px rgba(0, 0, 0, 0.05);
+  border-radius: 25px;
+  .time-box {
+    position: relative;
+    // width: 69%;
+    flex: 2.4;
+    height: 100%;
+    line-height: 58px;
+    background: rgba(206, 159, 39, 0.4);
+    // opacity: 0.4;
+    border-radius: 16px;
+    img {
+      display: inline-block;
+      vertical-align: middle;
+      width: 20px;
+      height: 20px;
+      margin-left: 10px;
+    }
+    .time-text {
+      display: inline-block;
+      vertical-align: middle;
+      padding-left: 10px;
+      span {
+        display: block;
+        &:nth-child(1) {
+          font-family: "Montserrat";
+          font-style: normal;
+          font-weight: 500;
+          font-size: 12px;
+          line-height: 15px;
+          color: #4d5262;
+        }
+        &:nth-child(2) {
+          font-family: "Montserrat";
+          font-style: normal;
+          font-weight: 500;
+          font-size: 15px;
+          line-height: 18px;
+          color: #1f2429;
+        }
+      }
+    }
+    .time-btn {
+      position: absolute;
+      padding-top: 9px;
+      right: 4px;
+      top: 50%;
+      transform: translateY(-50%);
+      display: inline-block;
+      width: 48px;
+      height: 50px;
+      background: #ffffff;
+      box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.1),
+        0px 4px 10px rgba(0, 0, 0, 0.07);
+      border-radius: 12px;
+      span {
+        display: block;
+        font-size: 13px;
+        line-height: 16px;
+        text-align: center;
+        color: #000000;
+      }
+    }
+  }
+
+  .time-del {
+    // width: 27%;
+    padding-top: 13px;
+    flex: 1;
+    margin-left: 10px;
+    background: #f1f4f8;
+    border-radius: 16px;
+    img {
+      display: inline-block;
+      vertical-align: middle;
+      width: 20px;
+      height: 20px;
+      margin-left: 10px;
+    }
+    .del-text {
+      display: inline-block;
+      vertical-align: middle;
+      padding-left: 10px;
+      //   padding-top: 9px;
+      span {
+        display: block;
+        font-size: 13px;
+        line-height: 16px;
+        text-align: center;
+        color: #000000;
+      }
+    }
+  }
+}
+</style>
+<style lang="scss">
+</style>

File diff suppressed because it is too large
+ 861 - 745
src/views/envmonitor/index.vue


+ 5 - 5
src/views/envmonitor/index1.vue

@@ -233,10 +233,10 @@ import { defineComponent, reactive, toRefs, ref, onBeforeMount, onMounted, nextT
 import MapBox from '@/views/envmonitor/MapBox.vue'
 import Header from '@/components/header/Index.vue'
 import Comheader from '@/components/header/Comheader.vue'
-import Scenario from '@/views/envmonitor/Scenario.vue'
-import Air from '@/views/envmonitor/Air.vue'
-import Light from '@/views/envmonitor/Light.vue'
-import Curtain from '@/views/envmonitor/Curtain.vue'
+import Scenario from '@/views/envmonitor/components/Scenario.vue'
+import Air from '@/views/envmonitor/components/Air.vue'
+import Light from '@/views/envmonitor/components/Light.vue'
+import Curtain from '@/views/envmonitor/components/Curtain.vue'
 import TimeBox from '@/views/envmonitor/TimeBox.vue'
 import NavBar from '@/views/envmonitor/NavBar.vue'
 import { Icon, Popup, Dialog, Toast } from 'vant'
@@ -1939,7 +1939,7 @@ export default defineComponent({
 <style lang="scss">
 .air-dialog-content {
   .van-button_text {
-    color: #5E8BCF;
+    color: $elActiveColor;
   }
 }
 </style>

+ 0 - 13
src/views/envmonitor/test.vue

@@ -1,13 +0,0 @@
-<template>
-  <iframe sandbox="allow-scripts" src="http://10.100.28.79/sgadmin/sgacloud"></iframe>
-</template>
-<script>
-
-export default {
-  name: 'test'
-}
-</script>
-
-<style scoped>
-
-</style>