<!--
 * @Author: 纪泽龙 jizelong@qq.com
 * @Date: 2026-01-05 10:39:41
 * @LastEditors: 纪泽龙 jizelong@qq.com
 * @LastEditTime: 2026-04-14 17:11:45
 * @FilePath: /huaxindd-web/src/views/Index/index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div
    class="index"
    :style="{
      transform: `scale(${scaleX},${scaleX})`,
      top: `-${((1 - scaleX) * innerHeight) / 2}px`,
    }"
  >
    <div class="back" @click="back">跳转后台</div>
    <Top />
    <component
      :is="currentTabComponent"
      @centerClick="centerClick"
      @imgClick="imgClick"
    ></component>
    <!-- <Ind /> -->
  </div>
</template>

<script>
import Top from "./components/Top.vue";
import Ind from "@/views/bigWindow/Ind/Ind.vue";
import Ind2 from "@/views/bigWindow/Ind2/Ind.vue";
import Ind3 from "@/views/bigWindow/Ind3/Ind.vue";

export default {
  name: "",
  components: {
    Top,
    // Ind,
  },
  data() {
    return {
      scaleX: 1,
      innerWidth: 0,
      innerHeight: 0,
      currentTabComponent: Ind,
      goPage: {
        // 1: "/gasinfo/in",
        // 首页
        1: null,
        3: null,
        // 应急
        4: "/urgent/emergency",
        // 周期
        5: "/cycle/cycle",
        // 运行
        7: "/reportinfo/gasdata",
      },
    };
  },
  created() {
    this.innerWidth = window.innerWidth;
    this.innerHeight = window.innerHeight;
    // this.scaleX = window.innerWidth / 2880;
    this.scaleX = window.innerWidth / 1920;
  },
  methods: {
    imgClick(src) {
      if(src=="index"){
        this.currentTabComponent = Ind;
        return;
      }
      this.$router.push(src);
      // this.currentTabComponent =Ind;
    },
    centerClick() {
      this.currentTabComponent = Ind3;
    },
    back() {
      this.$router.push("/checktask/jmchacktask");
    },
  },
};
</script>
<style lang="scss" scoped>
.index {
  // width:2880px;
  width: 1920px;
  height: 100vh;

  background: black;
  position: relative;
  left: 50%;
  top: 0px;
  // margin-left: -1440px;
  margin-left: -960px;
  overflow: hidden;
  .back {
    position: absolute;
    border: 1px solid rgba(0, 124, 225, 1);
    border-radius: 5px;
    cursor: pointer;
    padding: 5px 10px;
    color: #fff;
    font-size: 16px;
    right: 436px;
    top: 113px;
    &:hover {
      background: rgba(0, 124, 225, 0.4);
    }
  }
}
</style>
