<template>
  <div class="set-params collapse scroll">
    <div class="set-top">
      <img src="../assets/image/set-icon.png" alt="" />设定值参数
    </div>
    <div class="set-tips">
      <!-- <div @click="toHome($store.state.equipmentIndex)">
                日光温室特殊参数（丽水项目）</div> -->
    </div>
    <el-collapse v-model="$store.state.activeNames">
      <template v-for="(item, index) in routerList">
        <el-collapse-item :class="routerNow == item.router || item.router.indexOf(routerNow) != -1 ? 'active' : ''"
          :name="index + 1" :key="index" v-if="!item.isRouter">
          <template slot="title" class="collapse-title">
            <span class="name">{{ item.name }}</span>
          </template>
          <!--  -->
          <ul class="table-ul">
            <li @click="toRouter(item1)" :class="routerNow == item1.router && routerIndex == index1 + 1
      ? 'active'
      : ''
      " class="table-li" v-for="(item1, index1) in item.list" :key="index1">
              {{ item1.name }}
              <div class="status" :class="item1.status == 0 ? 'outline' : 'online'" v-if="item1.status >= 0">
                {{ item1.status == 0 ? "离线" : "在线" }}
              </div>
            </li>
          </ul>
        </el-collapse-item>
        <div @click="toRouter(item)" :class="routerNow == item.router ? 'active' : ''" class="no-list" v-else>
          {{ item.name }}
        </div>
      </template>
    </el-collapse>
  </div>
</template>

<script>
export default {
  data() {
    return {
      routerList: [],
      routerNow: "skylight",
      routerIndex: 1,
      purview: [], //权限数组
      loading: null,
    };
  },
  watch: {
    $route(newName, oldName) {
      this.gerRouter();
    },
    "$store.state.equipmentIndex"(newName, oldName) {
      var store = this.$store.state;
      var item = store.equipmentList[store.equipmentIndex - 1]
      if (item.deviceName == 10 || item.deviceName == 30) {

        this.dataInit();
      }
    },
  },
  mounted() {
    this.gerRouter();

    this.dataInit();
  },
  methods: {
    countData(data) {
      if (data) {
        return (data - 400) / 10
      } else {
        return 0
      }
    },
    // 计算展示值 计算公式 x/10
    countData10(data) {
      if (data) {
        return data / 10
      } else {
        return 0
      }
    },
    toNewList(list, list2) {
      let newList = list.map((item, index) => {
        // 从第二个数组中获取对应的 nickName 并赋值给 name
        const match = list2[index];
        return match ? { ...item, name: match.nickName ? match.nickName : item.name } : item;
      });
      return newList
    },
    dataInit() {
      const that = this
      this.loading = this.$loading({
        lock: true,
        text: '加载中',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      });
      var store = this.$store.state;
      var data = store.equipmentList[store.equipmentIndex - 1].deviceId;
      this.api.getcontrol_cpermission(data).then((res) => {

        this.routerList = [];
        this.purview = res.data.data;
        this.purview.forEach((el, index) => {
          if (el.id == 1) {
            var list = [
              { name: "目标温度", list: [], router: "targetTemperature", isRouter: true, index: 1 },
              { name: "目标湿度", list: [], router: "targetHumidity", isRouter: true, index: 2 },
              { name: "目标CO2", list: [], router: "targetCo2", isRouter: true, index: 3 }
            ]
            let newList
            if (el.child.length) {
              newList = that.toNewList(list, el.child)
            } else {
              newList = list
            }
            this.routerList.push(
              {
                id: el.id, sort: el.sort,
                name: el.nickName,
                router: "targetTemperature",
                list: newList,
              },
            );
          } else if (el.id == 3) {
            this.routerList.push(
              {
                id: el.id, sort: el.sort,
                name: el.nickName,
                router: "alarmSettings",
                list: [],
                isRouter: true
              },
            );
          } else if (el.id == 19) {
            var list = [
              { name: '通风窗1', status: -1, router: 'sunroofControl', index: 1 },
              { name: '通风窗2', status: -1, router: 'sunroofControl', index: 2 },
              { name: '通风窗3', status: -1, router: 'sunroofControl', index: 3 },
              { name: '通风窗4', status: -1, router: 'sunroofControl', index: 4 },
              { name: '通风窗5', status: -1, router: 'sunroofControl', index: 5 },
              { name: '通风窗6', status: -1, router: 'sunroofControl', index: 6 },
            ]
            let newList
            if (el.child.length) {
              newList = that.toNewList(list, el.child)
            } else {
              newList = list
            }
            this.routerList.push({
              id: el.id, sort: el.sort,
              name: el.nickName, list: newList, router: "sunroofControl",
            });
          } else if (el.id == 25) {
            var list = [
              { name: '外遮阳1', status: -1, router: 'outsizeSunshade', index: 1 },
              { name: '外遮阳2', status: -1, router: 'outsizeSunshade', index: 2 },
            ]
            let newList
            if (el.child.length) {
              newList = that.toNewList(list, el.child)
            } else {
              newList = list
            }
            this.routerList.push({
              id: el.id, sort: el.sort,
              name: el.nickName, list: newList, router: "outsizeSunshade",
            });
          } else if (el.id == 24) {
            var list = [
              { name: '内遮阳1', status: -1, router: 'insizeSunshade', index: 1 },
              { name: '内遮阳2', status: -1, router: 'insizeSunshade', index: 2 },
            ]
            let newList
            if (el.child.length) {
              newList = that.toNewList(list, el.child)
            } else {
              newList = list
            }
            this.routerList.push({
              id: el.id, sort: el.sort,
              name: el.nickName, list: newList, router: "insizeSunshade",
            });
          } else if (el.id == 27) {
            var list = [
              { name: '内保温1', status: -1, router: 'internalInsulation', index: 1 },
              { name: '内保温2', status: -1, router: 'internalInsulation', index: 2 },
            ]
            let newList
            if (el.child.length) {
              newList = that.toNewList(list, el.child)
            } else {
              newList = list
            }
            this.routerList.push({
              id: el.id, sort: el.sort,
              name: el.nickName, list: newList, router: "internalInsulation",
            });
          } else if (el.id == 29) {
            var list = [
              { name: '立面保温1', status: -1, router: 'facadeInsulation', index: 1 },
              { name: '立面保温2', status: -1, router: 'facadeInsulation', index: 2 },
              { name: '立面保温3', status: -1, router: 'facadeInsulation', index: 3 },
              { name: '立面保温4', status: -1, router: 'facadeInsulation', index: 4 },
            ]
            let newList
            if (el.child.length) {
              newList = that.toNewList(list, el.child)
            } else {
              newList = list
            }
            this.routerList.push({
              id: el.id, sort: el.sort,
              name: el.nickName, list: newList, router: "facadeInsulation",
            });
          } else if (el.id == 26) {
            var list = [
                { name: '风机', status: -1, router: 'wetFan', index: 1 },
                { name: '湿帘泵', status: -1, router: 'wetFan', index: 2 },
                { name: '湿帘外翻窗', status: -1, router: 'wetFan', index: 3 },
              ]
let newList
if (el.child.length) {
  newList=that.toNewList(list,el.child)
} else {
  newList = list
}
            this.routerList.push({
              id: el.id, sort: el.sort, name: el.nickName, list: newList, router: "wetFan"
            });
          } else if (el.id == 21) {
            var list = [
                { name: '环流风扇1', status: -1, router: 'circulationCan', index: 1 },
                { name: '环流风扇2', status: -1, router: 'circulationCan', index: 2 },
              ]
let newList
if (el.child.length) {
  newList=that.toNewList(list,el.child)
} else {
  newList = list
}

            this.routerList.push({
              id: el.id, sort: el.sort,
              name: el.nickName, list: newList, router: "circulationCan",
            });
          } else if (el.id == 20) {
            
            this.routerList.push({
              id: el.id, sort: el.sort,
              name: el.nickName, list: [], router: "LED",
              isRouter: true,
            });
          } else if (el.id == 23) {
            var list = [
                { name: '高压微雾1', status: -1, router: 'coercionMist', index: 1 },
                { name: '高压微雾2', status: -1, router: 'coercionMist', index: 2 },
              ]
let newList
if (el.child.length) {
  newList=that.toNewList(list,el.child)
} else {
  newList = list
}

            this.routerList.push({
              id: el.id, sort: el.sort,
              name: el.nickName, list: newList, router: "coercionMist"
            });
          } else if (el.id == 11 || el.id == 12 || el.id == 13 || el.id == 14 || el.id == 15 || el.id == 16 || el.id == 17 || el.id == 18) {
            if (!this.routerList.some(item => item.router === "electromagneticControl")) {
              this.routerList.push({
                id: el.id, sort: el.sort,
                name: '电磁阀',
                list: [],
                router: "electromagneticControl"
              });
            }
            let targetObject = this.routerList.find(item => item.router === 'electromagneticControl');
            if (el.id == 11) {
              targetObject.list.push({ name: el.nickName, status: -1, router: 'electromagneticControl', index: 1 });
            } else if (el.id == 12) {
              targetObject.list.push({ name: el.nickName, status: -1, router: 'electromagneticControl', index: 2 });
            } else if (el.id == 13) {
              targetObject.list.push({ name: el.nickName, status: -1, router: 'electromagneticControl', index: 3 });
            } else if (el.id == 14) {
              targetObject.list.push({ name: el.nickName, status: -1, router: 'electromagneticControl', index: 4 });
            } else if (el.id == 15) {
              targetObject.list.push({ name: el.nickName, status: -1, router: 'electromagneticControl', index: 5 });
            } else if (el.id == 16) {
              targetObject.list.push({ name: el.nickName, status: -1, router: 'electromagneticControl', index: 6 });
            } else if (el.id == 17) {
              targetObject.list.push({ name: el.nickName, status: -1, router: 'electromagneticControl', index: 7 });
            } else if (el.id == 18) {
              targetObject.list.push({ name: el.nickName, status: -1, router: 'electromagneticControl', index: 8 });
            }
          } else if (el.id == 5) {
            this.routerList.push({
              id: el.id, sort: el.sort,
              name: el.nickName,
              list: [],
              router: "sensorSet-con",
              isRouter: true,
            });
          } else if (el.id == 6) {
            this.routerList.push({
              id: el.id, sort: el.sort,
              name: el.nickName,
              list: [],
              router: "synthesis-con",
              isRouter: true,
            });
          } else if (el.id == 7) {
            this.routerList.push({
              id: el.id, sort: el.sort,
              name: el.nickName,
              list: [],
              router: "upload-con",
              isRouter: true,
            });
          } else if (el.id == 2) {
            this.routerList.push({ id: el.id, sort: el.sort, name: el.nickName, list: [], router: "forceOutput", isRouter: true });
          } else if (el.id == 4) {
            this.routerList.push({ id: el.id, sort: el.sort, name: el.nickName, list: [], router: "intrinsicParameter", isRouter: true });
          } else if (el.id == 22) {
            this.routerList.push({ name: el.nickName, list: [], router: "parameterSet", isRouter: true });
          } else if (el.id == 8) {

            this.routerList.push(
              { id: el.id, sort: el.sort, name: "加热水泵", list: [], router: "waterPump", isRouter: true },
              {
                id: el.id, sort: el.sort,
                name: "地热风机",
                list: [],
                router: "geothermalFan",
                isRouter: true,
              },
              { id: el.id, sort: el.sort, name: "上风口", list: [], router: "uptake", isRouter: true },
              { id: el.id, sort: el.sort, name: "下风口", list: [], router: "downtake", isRouter: true },
              { id: el.id, sort: el.sort, name: "卷被", list: [], router: "rollByRoll", isRouter: true },
              { id: el.id, sort: el.sort, name: "除雪", list: [], router: "snowRemoval", isRouter: true }
            );
            if (
              this.routerNow != "/waterPump" &&
              this.routerNow != "/geothermalFan" &&
              this.routerNow != "/uptake" &&
              this.routerNow != "/downtake" &&
              this.routerNow != "/rollByRoll" &&
              this.routerNow != "/snowRemoval"
            ) {
              this.loading = this.$loading({
                lock: true,
                text: '加载中',
                spinner: 'el-icon-loading',
                background: 'rgba(0, 0, 0, 0.7)'
              });
              //调取数据
              var store = this.$store.state;
              var data = {
                deviceId: store.equipmentList[store.equipmentIndex - 1].deviceId,
              };
              this.api.readControl_fiveControl(data).then((res) => {
                this.loading.close()
                store.ControlData = res.data.data
                //加热水泵数据处理waterPump
                store.ControlData['21521'] = this.countData(store.ControlData['21521'])
                store.ControlData['21522'] = this.countData10(store.ControlData['21522'])
                store.ControlData['21523'] = this.countData(store.ControlData['21523'])
                store.ControlData['21524'] = this.countData(store.ControlData['21524'])

                //下风口downtake
                store.ControlData["21544"] = this.countData(store.ControlData["21544"]);

                //地热风机geothermalFan
                store.ControlData['21527'] = this.countData(store.ControlData['21527'])
                store.ControlData['21528'] = this.countData10(store.ControlData['21528'])

                //卷被rollByRoll
                store.ControlData['21552'] = this.countData(store.ControlData['21552'])
                store.ControlData['21550'] = this.countData10(store.ControlData['21550'])

                //除雪snowRemoval
                store.ControlData['21544'] = this.countData(store.ControlData['21544'])

                //上风口
                store.ControlData['21532'] = this.countData(store.ControlData['21532'])
                store.ControlData['21533'] = this.countData10(store.ControlData['21533'])
                store.ControlData['21562'] = this.countData10(store.ControlData['21562'])


              });
            }
          } else if (el.id == 9) {
            this.routerList.push(
              {
                id: el.id, sort: el.sort,
                name: "日光温室特殊参数(山地型温室)",
                router: "skylight",
                list: [
                  { name: "顶卷膜1", status: -1, router: "skylight", index: 1 },
                  { name: "顶卷膜2", status: -1, router: "skylight", index: 2 },
                  { name: "顶卷膜3", status: -1, router: "skylight", index: 3 },
                  { name: "顶卷膜4", status: -1, router: "skylight", index: 4 },
                ],
              },
              {
                id: el.id, sort: el.sort,
                name: "风机(山地型温室)",
                router: "fan",
                list: [
                  { name: "风机1", status: -1, router: "fan", index: 1 },
                  { name: "风机2", status: -1, router: "fan", index: 2 },
                  { name: "风机3", status: -1, router: "fan", index: 3 },
                  { name: "风机4", status: -1, router: "fan", index: 4 },
                  { name: "风机5", status: -1, router: "fan", index: 5 },
                ],
              }
            );
          }
        })
        // this.routerList.sort((a, b) => a.sort - b.sort);

        this.routerList.push({ name: '系统参数配置', list: [], router: 'systemSet-con', isRouter: true, },);

        var router = this.$route.query
        if (router.token && router.userid) {
          return
        }
        if (this.$route.name == this.routerList[0].router) {
          return
        }
        this.$router.push({ path: `/${this.routerList[0].router}` });


      });


    },
    //去首页
    toHome(index) {
      this.$router.push({ path: `/status?eqbyIndex=` + index });
    },
    gerRouter() {
      this.routerNow = this.$route.name;
      this.routerIndex = this.$route.query.id ? this.$route.query.id : 1;
    },
    toRouter(item) {
      if (item.router) {
        if (item.http) {
          window.location.href = item.http;
        }
        // else if (
        //   item.router == "skylight" &&
        //   this.$route.query.id != item.index
        // ) {
        //   this.$router.push({ path: `/skylight?id=${item.index}` });
        // } else if (item.router == "fan" && this.$route.query.id != item.index) {
        //   this.$router.push({ path: `/fan?id=${item.index}` });
        // } else if (item.router == 'electromagneticControl' && this.$route.query.id != item.index) {
        //   this.$router.push({ path: `/electromagneticControl?id=${item.index}` })
        // } else if (item.router == 'sunroofControl' && this.$route.query.id != item.index) {
        //   this.$router.push({ path: `/sunroofControl?id=${item.index}` })
        // } else if (item.router == 'outsizeSunshade' && this.$route.query.id != item.index) {
        //   this.$router.push({ path: `/outsizeSunshade?id=${item.index}` })
        // } else if (item.router == 'outsizeSunshade' && this.$route.query.id != item.index) {
        //   this.$router.push({ path: `/outsizeSunshade?id=${item.index}` })
        // } else if (item.router == 'insizeSunshade' && this.$route.query.id != item.index) {
        //   this.$router.push({ path: `/insizeSunshade?id=${item.index}` })
        // }
        else {
          if (item.index) {
            if (item.router == this.routerNow && item.index == this.$route.query.id) {
              return
            }
            this.$router.push({ path: `/${item.router}`,query:{id:item.index,name:item.name} })

            return
          }

          if (item.router == this.routerNow) {
            return
          }
          this.$router.push({ name: item.router,query:{name:item.name} });
        }
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.set-params {
  width: 280px;
  height: 100%;
  background: rgba(0, 92, 178, 0.15);
  border: 2px solid rgba(0, 186, 255, 0.2);

  .set-top {
    font-size: 20px;
    font-family: Microsoft YaHei;
    font-weight: bold;
    color: #ffffff;
    width: 100%;
    padding-left: 20px;
    display: flex;
    align-items: center;
    padding-top: 20px;

    img {
      width: 40px;
      height: 40px;
      margin-right: 10px;
    }
  }

  .el-collapse-item {
    &.active {}
  }

  .no-list {
    color: #a8b6c8;

    &.active {
      background: rgba(255, 255, 255, 0.1);
      border: 1px solid rgba(255, 255, 255, 0.3);
      color: #fff;
    }
  }

  .set-tips {
    width: 100%;
    border-bottom: 1px solid rgba(168, 182, 200, 0.2);
    margin-top: 17px;
    padding-bottom: 17px;
    padding-left: 10px;
    cursor: pointer;

    >div {
      width: 260px;
      height: 40px;
      // background: rgba(255, 255, 255, 0.1);
      // border: 1px solid rgba(255, 255, 255, 0.3);
      display: flex;
      align-items: center;

      padding-left: 10px;
    }
  }
}
</style>