<template>
  <div class="dashboard-container" v-loading.fullscreen="fullScreenLoading"
    element-loading-background="rgba(0, 0, 0, 0.8)">
    <div class="absolute " style="z-index: 99999;">
      <!-- <el-button @click="create">点一下</el-button> -->
      <!--      <span style="color: red">{{ $t("login.loginTitle") }}</span>-->
      <!--      <el-select @change="langChange" v-model="value" placeholder="请选择">
              <el-option
                  v-for="item in options"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
              </el-option>
            </el-select>-->
      <!--      <span class="svg-container" @click="handleLogin">
                      <svg-icon icon-class="point" :class-name="['point','pp']"></svg-icon>
                      <svg-icon icon-class="personalModel" :class-name="['point','pp']"></svg-icon>
                      <svg-icon icon-class="measure" :class-name="['point','pp']"></svg-icon>
                      <svg-icon icon-class="height_measure" :class-name="['point','pp']"></svg-icon>
                  </span>-->
    </div>
    <Tree v-if="noSituation" class="absolute zIndex9 tree" ref="tree"></Tree>
    <!--        <WangEditor class="absolute zIndex99"></WangEditor>-->
    <myHeaderAll ref="myHeaderAll" v-if="noSituation"></myHeaderAll>

    <bottomMenu v-if="noSituation"></bottomMenu>

    <!-- 态势演播 -->
    <!-- <div class="movie absolute zIndex999">
     <gant class="movie absolute zIndex999"/>
    </div> -->
    <!-- <button class="videoStop absolute zIndex999" @click="videoStop">结束录制</button> -->
    <!--左侧一级菜单-->
    <firstMenu v-if="noSituation" class="absolute zIndex9" ref="firstMenu"></firstMenu>
    <!--左侧二级菜单-->
    <secondMenu class="absolute" ref="secondMenu"></secondMenu>
    <editor class="absolute zIndex99" ref="editor"></editor>
    <selectImg class="selectImgBox absolute" ref="selectImg"></selectImg>
    <!--剖面分析-->
    <profileAnalysis class="profileAnalysisBox absolute zIndex99"></profileAnalysis>
    <!--土方分析-->
    <cutFill class="cutFillBox absolute zIndex99"></cutFill>
    <!--淹没分析-->
    <inundationAnalysis class="inundationAnalysisBox absolute zIndex99"></inundationAnalysis>
    <!--    <div class="richTextDialogBox">-->
    <el-dialog :title="richTextDialog.title" :modal="false" :visible.sync="richTextDialog.visible" width="1090px"
      @close="cancel" :center="true" :close-on-click-modal="false">
      <div id="richTextEditor" style="background: #fff"></div>
      <!--      :content="richTextDialog.content"-->
      <!--      <richTextEditor></richTextEditor>-->
      <!--      <div style="display: flex;justify-content: flex-end;padding: 6px 0;">

              <el-button size="mini" type="primary" @click="save">确定</el-button>
              <el-button size="mini" type="danger" @click="cancel">取消</el-button>
            </div>-->
    </el-dialog>
    <!--坐标定位-->
    <flyToLocation ref="flyToLocation" class="flyToLocationBox absolute zIndex99"></flyToLocation>
    <junbiao ref="junbiao" class="junbiaoBox absolute zIndex999"></junbiao>
    <junbiao3d ref="junbiao3d" class="junbiao3dBox absolute zIndex999"></junbiao3d>
    <vrModel class="vrModelBox absolute zIndex999"></vrModel>
    <textModel class="textModelBox absolute zIndex999"></textModel>
    <adddirectory class="adddirectoryBox absolute zIndex999"></adddirectory>
    <model ref="model" class="modelBox absolute zIndex999"></model>
    <modelg ref="modelg" class="modelBoxg absolute zIndex999"></modelg>
    <modelSelect ref="modelSelect" class="modelSelectBox absolute zIndex999"></modelSelect>
    <bimInfo ref="bimInfo" class="bimInfoBox absolute zIndex99"></bimInfo>
    <echartsTotal ref="echartsTotal" class="echartsTotalBox absolute zIndex99"></echartsTotal>
    <rolePermission></rolePermission>
    <div class="absolute zIndex99 tongbu" style="top: 5vw">
      <el-button size="mini" @click="tongbu">数据同步</el-button>
    </div>
    <div v-if="showBigData || noSituation" style="display: flex">
      <div id="earth" :class="['fullSize']"></div>
      <div id="map2d" :class="['fullSize', 'absolute', 'halfEarth', 'zIndex1']" style="left: 50%; height: 100vh"></div>
    </div>
    <div v-if="!noSituation && !showBigData" id="earthContainers" :class="['fullSize']"></div>
    <div v-if="noSituation" class="absolute zIndex9 logo" style="bottom: 15px" @click="changeState">
      <!-- <img src="@/assets/images/81.gif" /> -->
      <!-- <img src="@/assets/images/rotation.gif" /> -->
      <!--      <img src="@/assets/images/地球.gif" />-->
      <img :src="require('@/assets/images/shijingjun/' + skinInfo + '/logo.png')" alt="" />
      <!--      <img src="@/assets/images/3c60ff3cd2d9e0547ada43a58fa60c3.png">-->
      <!--      <img src="@/assets/images/aaaaaa.webp">-->
      <!--      <button v-for="item in optionss" @click="addMarker(item)">{{ item.source_name }}</button>-->
    </div>
    <scene class="absolute zIndex999 scene"></scene>
    <div id="modal" style=""></div>
    <el-drawer class="transformDrawerBox" :modal-append-to-body="false" :wrapperClosable="false" title="转换"
      :visible.sync="transformDrawer" direction="ltr">
      <div class="transformDrawerContent">
        <el-collapse @change="changeActive" v-model="transformTypeActiveName" accordion>
          <template v-for="item in transformTypes">
            <el-collapse-item :title="item.title" :name="item.name">
              <div class="transformDrawerItem">
                <span>源文件路径</span>
                <el-input size="medium" v-model="input" :placeholder="item.placeholder ? item.placeholder : '请输入文件路径'
    ">
                  <template slot="append">
                    <el-button @click="openDialog(item)">
                      <i class="el-icon-more"></i>
                    </el-button>
                  </template>
                </el-input>
              </div>

              <div class="transformDrawerItem">
                <span>存放路径</span>
                <el-input size="medium" v-model="output" :placeholder="item.outplaceholder ? item.outplaceholder : '请输入文件路径'
    ">
                  <template slot="append">
                    <el-button @click="openSaveDialog(item)">
                      <i class="el-icon-more"></i>
                    </el-button>
                  </template>
                </el-input>
              </div>
            </el-collapse-item>
          </template>
        </el-collapse>
        <div class="btn">
          <el-button :disabled="transformTypeActiveName == ''" type="primary" size="medium" @click="transform">转换
          </el-button>
        </div>
      </div>
    </el-drawer>
    <!--    导入作战数据生成的点的样式-->
    <fightingDataStyle ref="fightingDataStyle" class="fightingDataStyleBox absolute zIndex99"></fightingDataStyle>
    <DTH ref="dth" :host="host" :token="token" class="zIndex99"></DTH>
    <!-- 标准版本  无人机 -->
    <!-- <flyer v-if="flyerDiv" class="flyer"></flyer> -->
    <!-- <flyer2 v-if="flyerDiv2" class="flyer"></flyer2> -->
    <!--态势部分-->
    <div v-show="!showBigData && !noSituation" class="titles">
      实景三维态势推演系统
    </div>
    <svg v-show="!showBigData && !noSituation" class="icon icon-top" aria-hidden="true">
      <use xlink:href="#icon-top"></use>
    </svg>
    <svg class="icon icon-tuichudenglu" @click="closeSituation" aria-hidden="true" v-if="showList">
      <use xlink:href="#icon-tuichudenglu"></use>
    </svg>
    <!--右侧元素指挥舱-->
    <!--新增态势0827-->
    <div v-if="editSituation" :class="[
    'cabinBox',
    'animate__animated',
    typeof showCabin == 'boolean'
      ? showCabin
        ? 'animate__zoomOutRight'
        : 'animate__zoomInRight'
      : '',
  ]">
      <cabin @changeShow="changeShow('showCabin', 'showCabinBtn')" ref="cabin"></cabin>
    </div>
    <div v-if="editSituation && typeof showCabinBtn == 'boolean'" :class="[
    'cabinShowBtn',
    'cabinShowBtn',
    'animate__animated',
    typeof showCabinBtn == 'boolean'
      ? showCabinBtn
        ? 'animate__lightSpeedInRight'
        : 'animate__lightSpeedOutRight'
      : '',
  ]">
      <div class="switch-node-outer">
        <div class="switch-node-inner" @click="changeShow('showCabinBtn', 'showCabin')">
          展开指挥舱
        </div>
      </div>
    </div>
    <!--态势事件新建框-->
    <div class="newEventBox" v-if="eventBox">
      <newEvent></newEvent>
    </div>
    <!--态势时间面板-->
    <eventEditor class="eventEditor"></eventEditor>
    <!--元素列表框-->
    <div :class="[
    'elementBox',
    'animate__animated',
    typeof showElement == 'boolean'
      ? showElement
        ? 'animate__zoomOutLeft'
        : 'animate__zoomInLeft'
      : '',
  ]" v-if="editSituation">
      <elements @changeShow="changeShow('showElement', 'showElementBtn')" v-if="!showList"></elements>
    </div>
    <!--新增态势0822 -->
    <div v-if="editSituation && typeof showElementBtn == 'boolean'" style="left: 0%;" :class="[
    'elementShowBtn',
    'animate__animated',
    typeof showElementBtn == 'boolean'
      ? showElementBtn
        ? 'animate__lightSpeedInLeft'
        : 'animate__lightSpeedOutLeft'
      : '',
  ]">
      <div class="switch-node-outer">
        <div class="switch-node-inner" @click="changeShow('showElementBtn', 'showElement')">
          展开军标标绘
        </div>
      </div>
    </div>
    <svg class="icon icon-tuichu" @click="closeSituationEdit" aria-hidden="true" v-if="editSituation">
      <use xlink:href="#icon-tuichu"></use>
    </svg>
    <!-- 方案列表 -->
    <div class="content" v-if="showList">
      <situationList ref="situation" @openSituationEdit="openSituationEdit"></situationList>
    </div>
    <div v-if="eventsList" class="timeline-container">
      <deduction ref="Deduction" :TSTYOBJ="TSTYOBJ" :action="action"></deduction>
    </div>
    <!-- gis资源列表 -->
    <div class="gisTable">
      <el-dialog title="gis资源列表" :modal="false" :visible.sync="dialogTableVisible" @open="fetchData">
        <el-table class="gisTable" :row-key="getRowKey" :reserve-selection="true" :data="gisData" ref="multipleTable"
          @selection-change="handleSelectionChange">
          <el-table-column type="selection" width="55"> </el-table-column>
          <!--<el-table-column width="150" property="date" label="日期"></el-table-column>-->
          <el-table-column property="source_name" label="名称"></el-table-column>
          <el-table-column width="300" property="source_type" label="类型"></el-table-column>
        </el-table>
        <div class="btnsbox">
          <el-button class="btns" @click="addResource">添加</el-button>
        </div>
      </el-dialog>
    </div>
    <input type="file" id="fileInputlink" style="display: none;" multiple
      accept=".jpg, .png, .webp, .svg, .bmp, .gif,.mp4,.mp3,.pdf" @change="uploadFile" />
    <input type="file" id="fileInputPanorama" style="display: none;" multiple accept=".jpeg,.png,.jpg"
      @change="uploadFile2" />
    <!-- 海东1021 -->
    <div class="goodSearch" v-if="goodSearchDialog">
      <div class="contentBox " v-draggable>
        <div class="titleBox nav">
          <span class="title">{{ $t("leftMenu.secondMenu.goodsSearch") }}</span>
          <span class="closeBox">
            <span @click="goodSearchDialog = false">✕</span>
          </span>
          <div class="hr"></div>
        </div>
        <!-- <template v-if="goodSearchEmpty">
          <div class="empty-img">

          </div>
        </template>
        <template v-else> -->
        <div id="goodSearchEchart"></div>
        <!-- <div style="height: 60px;position: relative;">
          <el-button class="export-btn" style="
            background: rgba(var(--color-sdk-base-rgb), 0.2);
            border: 1px solid rgba(var(--color-sdk-base-rgb), 0.5);
            color: #ffffff;
            position: absolute;
            right: 20px;
            bottom: 20px;
          ">导出Excel</el-button>
        </div> -->
        <!-- </template> -->
      </div>
    </div>
    <!-- 海东表格设置 -->
    <excelSet ref="excelSet" class="excelSetBox absolute zIndex99"></excelSet>
    <!-- tufu_select -->
    <tufuSelect style="top: 115px;right: 50px;" class="tufuSelect absolute zIndex99"></tufuSelect>
    <!-- 战术计算 -->
    <tactical class="tacticalBox absolute"></tactical>
    <!-- modelSet -->
    <ModelSet class="ModelSetBox absolute"></ModelSet>
  </div>
</template>

<script>
// 新增态势0910
import { remote } from "electron";
import { mapGetters } from "vuex";
import Tree from "@/components/Tree/index";
import bottomMenu from "@/components/bottomMenus/bottomMenu.vue";
import myHeaderAll from "@/components/myHeaderAll/index.vue";
import firstMenu from "@/components/LeftMenu/firstMenu.vue";
import secondMenu from "@/components/LeftMenu/secondMenu.vue";
import editor from "@/components/editor/index.vue";
import selectImg from "@/components/selectImg.vue";
import profileAnalysis from "@/components/analysis/profileAnalysis.vue";
import cutFill from "@/components/analysis/cutFill.vue";
import inundationAnalysis from "@/components/analysis/inundationAnalysis.vue";
import flyToLocation from "@/components/dialog/flyToLocation.vue";
import junbiao from "@/components/dialog/junbiao.vue";
import junbiao3d from "@/components/dialog/junbiao3d.vue";
import model from "@/components/dialog/model.vue";
import modelg from "@/components/dialog/modelg.vue";
import vrModel from "@/components/dialog/vrModel.vue";
import textModel from "@/components/dialog/textModel.vue";
import ModelSet from "@/components/dialog/ModelSet.vue";
import modelSelect from "@/components/dialog/modelSelect.vue";
import echartsTotal from "@/components/dialog/echartsTotal.vue";
import bimInfo from "@/components/dialog/bimInfo.vue";
import fightingDataStyle from "@/components/dialog/fightingDataStyle.vue";
import scene from "@/components/three/index.vue";
import rolePermission from "@/components/myHeaderAll/systemPopup/components/permission/permission.vue";
import gant from "../../components/gantt-next/gant.vue";
import modelTransform from "./modelTransform";
import DTH from "@/components/DTH/index";
// import flyer from "@/components/UAV2/index";
// import flyer2 from "@/components/UAV3/index";
import situationList from "@/components/situationList/index.vue";
import deduction from "@/components/TS/deduction.vue";
import cabin from "@/components/situationEdit/cabin.vue";
import elements from "@/components/situationEdit/element.vue";
import nodeType from "@/components/treeNode";
import newEvent from "@/components/Events/newEvent.vue";
import adddirectory from "../../components/dialog/adddirectory.vue";
import excelSet from "@/components/dialog/excelSet.vue";
import eventEditor from "@/components/TS/eventEditor/index.vue";
import tufuSelect from "@/components/dialog/tufu_select.vue";
import tactical from "@/components/dialog/tactical.vue";
import {
  getSelectedNode,
  getNodeData,
  cusAddNodes,
  cusRenderNode,
} from "@/components/Tree/treeNode";
import { addSource, delSource, checkAuth, linkFile } from "@/api/gisAPI";
import { eventList, tilesetAdd, tilesetList } from "@/api/aboutCabin";
import { obj } from "@/api/dataFromApi";
import { getIP } from "../../utils";
import { getToken } from "@/utils/auth";
import { cusNodeIcon } from "../../components/Tree/treeNode";

// import richTextEditor from "@/components/editor/richTextEditor.vue";
let handleLogin = (that) => {
  // 需要登录就去掉“/dashboard”
  that.$store
    .dispatch("Login", {
      host: "http://localhost:8890",
      username: "admin",
      password: "c30807e6587ade285ba7ade9f881b3d7",
    })
    .then(() => {
      console.log("logined$$$$$$$$$$$$$$");
      // that.createEarth();
      // this.$router.push({path: '/'})
    })
    .catch(() => { });
};

export default {
  name: "dashboard",
  mixins: [modelTransform],
  components: {
    newEvent,
    elements,
    cabin,
    deduction,
    situationList,
    eventEditor,
    // flyer,
    // flyer2,
    DTH,
    gant,
    scene,
    Tree,
    rolePermission,
    bottomMenu,
    myHeaderAll,
    firstMenu,
    secondMenu,
    editor,
    selectImg,
    profileAnalysis,
    cutFill,
    inundationAnalysis,
    model,
    modelSelect,
    bimInfo,
    fightingDataStyle,
    echartsTotal,
    junbiao,
    junbiao3d,
    flyToLocation,
    vrModel,
    textModel,
    adddirectory,
    // richTextEditor
    // New,
    // WangEditor
    excelSet,
    tufuSelect,
    tactical,
    ModelSet,
    modelg
  },

  data() {
    return {
      eventLists: [],
      TSTYOBJ: {},
      action: null,
      // flyerDiv
      flyerDiv: false,
      flyerDiv2: false,
      excelSetDialog: false,
      //海东1021
      goodSearchDialog: false,
      goodSearchEmpty: false,
      // 新增态势0827
      showCabin: "",
      showCabinBtn: "",
      // 新增态势0821
      showElement: "",
      showElementBtn: "",
      //新增态势
      noSituation: true,
      showBigData: false,
      showList: false,
      editSituation: false,
      eventBox: false,
      eventsList: false,
      dialogTableVisible: false,
      gisData: [],
      multipleSelection: [],
      // tasks: Store.tasks, //渲染的真实任务数据、
      // scales: Store.scales,
      host: localStorage.getItem("service"),
      token: getToken(),
      skinInfo: JSON.parse(localStorage.getItem("systemSetting")).skinInfo,
      appVersion: "81", //localStorage.getItem("appVersion"),
      fullScreenLoading: false,
      transformDrawer: false,
      State: true, //功能菜单的显示状态
      imgsrc: "",
      halfEarth: false,

      richTextDialog: {
        title: "true",
        content: "<span style='color:red'>true</span>",
        visible: false,
      },
      treeObj: null,

      /* BillboardObject,
      *PolygonObject,
       PolylineObject,
       Model,
       Path,
       Circle,
       AttackArrow,
       PincerArrow,*/
      /*测试用*/
      optionss: [
        {
          source_name: "点标注",
          key: "DrawPoint",
          source_type: "point",
          className: "public",
        },
        /* {name: "线", source_name: "线标注", key: "DrawPolyline", source_type: "line",},
        {name: "面", source_name: "面标注", key: "DrawPolygon", source_type: "panel",},
        {name: "圆", source_name: "圆标注", key: "DrawCircle", source_type: "circle",},
        {name: "箭头", source_name: "箭头", key: "DrawAttackArrow", source_type: "attackArrow",},
        {name: "钳形箭头", source_name: "钳形箭头", key: "DrawPincerArrow", source_type: "pincerArrow",},
      */
      ],
      /*测试用*/
      options: [
        {
          value: "zh",
          label: "中文简体",
        },
        {
          value: "en",
          label: "英文",
        },
        {
          value: "tw",
          label: "中文繁体",
        },
      ],
      value: "zh",
    };
  },
  beforeMount() {
    // this.appVersion="earth"
  },
  computed: {
    ...mapGetters(["name", "roles", "lang"]),
  },
  beforeCreate() {
    //  if (!(this.$store.getters.token))
    //    handleLogin(this)
    //新增态势
    // window.Store = new TSTY.store();
    // window.Clock = new TSTY.clock();
  },
  mounted() {
    // new Notification("这是标题", {
    //   body: "这是正文",
    //   icon:
    //     "https://gw.alipayobjects.com/zos/rmsportal/BiazfanxmamNRoxxVxka.png",
    //   requireInteraction: true,
    //   image:
    //     "https://gw.alipayobjects.com/zos/rmsportal/JiqGstEfoWAOHiTxclqi.png",
    // });
    window.$dth = this.$refs.dth;

    // this.appVersion=localStorage.getItem("appVersion")
    const that = this;
    // this.imgsrc=require('@/assets/images/'+'81'+'/'+this.skinInfo+'/logo.png')
    window.addEventListener("setItemEvent", (e) => {
      if (e.key == "systemSetting") {
        let obj = JSON.parse(e.newValue);
        that.skinInfo = obj.skinInfo;
      }
    });
    window.$root_home_index = this;
    // // this.$nextTick(() => {
    // this.createEarth()
    this.value = this.$i18n.locale;
    //
    /*YJMap.on().then(() => {
      window.map2d = new YJMap.Map("map2d")
    })*/
    this.$recvChanel("checkSituation", () => {
      this.removeEarth1();
    });
    //测试用
    this.$recvChanel("getTreeObj", (treeObj) => {
      console.log(treeObj);
      this.treeObj = treeObj;
      this.$removeChanel("getTreeObj");
    });
    // checkAuth(res => {
    //     // console.log(res)
    //     // this.authInfo = res
    //   })
    //测试用

    // this.changeState()
    window.addEventListener("openEventBox", () => {
      console.log("++++++++++++++++++++++++++++");
      this.eventBox = true;
      this.$nextTick(() => {
        window.dispatchEvent(window.EventsNameMap.get("initEvent"));
      });
    });
    // this.create();

    //
    this.$recvChanel("linkFile", () => {
      this.importPath();
    });
    this.$recvChanel('panoramaFile', () => {
      this.importPath2()
    })


    this.systemSetting = JSON.parse(localStorage.getItem("systemSetting"));
    // this.systemSetting.skinInfo = this.system.skin
    if (this.systemSetting.sheetIndexStatusSwitch) {
      this.$changeComponentShow(".tufuSelect", true);
    } else {
      this.$changeComponentShow(".tufuSelect", false);
    }
  },
  methods: {
    // 上传链接link
    uploadFile(event) {
      let files = event.target.files;
      console.log("files", files);

      if (files.length > 0) {
        const formData = new FormData();
        for (let i = 0; i < files.length; i++) {
          const element = files[i];
          formData.append("files", element);
        }

        // 创建loading实例
        const loading = this.$loading({
          lock: true,
          text: '上传中 0%',
          spinner: 'el-icon-loading',
          background: 'rgba(0, 0, 0, 0.7)'
        });

        // 配置axios请求
        this.$axios({
          method: 'post',
          url: getIP() + '/yjearth4.0/api/v1/linkFile/import',
          data: formData,
          headers: {
            'token': getToken()
          },
          onUploadProgress: (progressEvent) => {
            if (progressEvent.lengthComputable) {
              const percentComplete = Math.round((progressEvent.loaded / progressEvent.total) * 100);
              loading.text = `上传中 ${percentComplete}%`;
            }
          }
        }).then(response => {
          loading.close();
          const res = response.data;
          if (res.code == 0) {
            this.$message.success("上传成功");
            this.$sendChanel("linkFileData", res.data.list);
          } else {
            this.$message.error(res.message || "上传失败");
          }
        }).catch(error => {
          loading.close();
          this.$message.error("上传失败: " + error.message);
        });
      }
    },
    // 上传全景
    uploadFile2(event) {
      let files = event.target.files;
      if (files.length > 0) {
        const formData = new FormData();
        for (let i = 0; i < files.length; i++) {
          const element = files[i];
          formData.append("files", element);
        }

        // 创建loading实例
        const loading = this.$loading({
          lock: true,
          text: '上传中 0%',
          spinner: 'el-icon-loading',
          background: 'rgba(0, 0, 0, 0.7)'
        });

        // 配置axios请求
        this.$axios({
          method: 'post',
          url: getIP() + '/yjearth4.0/api/v1/linkFile/import',
          data: formData,
          headers: {
            'token': getToken()
          },
          onUploadProgress: (progressEvent) => {
            if (progressEvent.lengthComputable) {
              const percentComplete = Math.round((progressEvent.loaded / progressEvent.total) * 100);
              loading.text = `上传中 ${percentComplete}%`;
            }
          }
        }).then(response => {
          loading.close();
          const res = response.data;
          if (res.code == 0) {
            this.$message.success("上传成功");
            this.$sendChanel("panoramaFileData", res.data.list);
          } else {
            this.$message.error(res.message || "上传失败");
          }
        }).catch(error => {
          loading.close();
          this.$message.error("上传失败: " + error.message);
        });
      }
    },
    // 导入链接link
    importPath() {
      document.getElementById("fileInputlink").click();
      // this.$removeChanel("fileInputlink");
    },
    // 导入链接link
    importPath2() {
      document.getElementById("fileInputPanorama").click();
      // this.$removeChanel("fileInputPanorama");
    },

    //新增态势0822
    changeShow(key1, key2) {
      this[key1] = !this[key1];
      // this[key2]=!this[key2]
      setTimeout(() => {
        this[key2] = !this[key2];
      }, 500);
    },
    // 创建地球
    create() {
      this.noSituation = !this.noSituation;
      this.showBigData = true;
      this.$nextTick(() => {
        window.$createEarth();
      });
    },

    //新增态势
    closeSituation() {
      //退出态势
      this.noSituation = !this.noSituation;
      this.showList = !this.showList;
      this.$nextTick(() => {
        window.$createEarth();
      });
      // 新增态势0910
      remote.getCurrentWindow().setFullScreen(false);
      // this.openEarth();
    },
    closeSituationEdit() {
      // 新增态势0906

      if (window.Earth1) {
        window.draw && window.draw.end();
        Array.from(ts_Map.values()).forEach((entity) => entity.remove());

        ts_Map.clear();
        window.Earth1.destroy();
        window.Earth1 = null;
      }
      this.$refs.Deduction.stop();
      this.editSituation = !this.editSituation;
      this.eventsList = false;
      this.showList = !this.showList;
      // //新增态势0824
      this.showElementBtn = "";
      this.showCabinBtn = "";
      this.showCabin = "";
      this.showElement = "";
      //
      // this.eventBox = false;

      this.$nextTick(() => {
        this.$refs.situation.getList();
      });
    },
    getRowKey(row) {
      // 需要为每一行设置一个唯一标识，这里假设每行的id是唯一的
      return row.ID;
    },
    addResource() {
      let ztreeObj = $.fn.zTree.getZTreeObj("treeDemos");
      let nodes = ztreeObj.getSelectedNodes();
      let p_id = 0;
      if (nodes.length) {
        p_id = nodeType[nodes[0].type].allowChildren
          ? nodes[0].id
          : nodes[0].p_id;
      }
      let tilesetArr = [];
      let allNodes = ztreeObj.transformToArray(ztreeObj.getNodes());
      allNodes.forEach(
        (item) => item.source_id && tilesetArr.push(item.source_id)
      );
      this.multipleSelection.forEach((item) => {
        if (item.source_id && tilesetArr.includes(item.source_id)) {
          console.log("已经添加过该资源");
        } else {
          let param = {};
          param.p_id = p_id;
          param.name = item.source_name;
          param.tree_index = item.tree_index;
          param.type = item.source_type;
          param.source_id = item.source_id;
          param.detail = {
            layer_index: item.layer_index,
            params: item.detail,
          };
          tilesetAdd(param, (res) => {
            console.log("render数据资源");
            this.dialogTableVisible = false;
            let idKey = ztreeObj.setting.data.simpleData.idKey;
            let parentNode = ztreeObj.getNodeByParam(idKey, param.p_id, null);
            res.icon = cusNodeIcon(res);
            res.children = null;
            let newNodes = ztreeObj.addNodes(parentNode, [res]);
            nodeType[res.type].render(res);
            ztreeObj.updateNode(newNodes[0]);
          });
        }
      });
    },
    fetchData() {
      tilesetList({}, (res) => {
        // console.log(res);
        this.gisData = res.list.length ? res.list : [];

        let ztreeObj = $.fn.zTree.getZTreeObj("treeDemos");
        let nodes = ztreeObj.transformToArray(ztreeObj.getNodes());
        let tilesetArr = [];

        nodes.forEach(
          (item) => item.source_id && tilesetArr.push(item.source_id)
        );
        console.log("tilesetArr", tilesetArr);
        console.log(this.gisData);
        setTimeout(() => {
          for (let i = 0; i < this.gisData.length; i++) {
            let item = this.gisData[i];
            console.log(this.$refs.multipleTable.toggleRowSelection);
            console.log(item);
            console.log(tilesetArr.includes(item.source_id));
            if (item.source_id && tilesetArr.includes(item.source_id)) {
              this.$refs.multipleTable.toggleRowSelection(item, true);
            }
          }
        }, 10);
      });
    },
    handleSelectionChange(val) {
      console.log(val);
      this.multipleSelection = val;
    },
    openSituationEdit(plan) {
      window.currentPlan = plan;
      eventList({ plan_id: plan.ID || plan.plan_id }, (res) => {
        console.log("eventList", res);
        this.eventLists = res.list
        this.eventsList = true;
        window.TSTYOBJ = window.TSTY.init({
          startTimestamp: plan.plan_create_time,
          tasks: this.eventLists,
          scales: { preMainIndex: 2 }
        });
        this.action = window.TSTYOBJ.initAction()
        this.TSTYOBJ = window.TSTYOBJ
        this.$nextTick(() => {
          TSTYOBJ.store.init()
          TSTYOBJ.renderLine(this.$nextTick)
          TSTYOBJ.renderLabel({ left: 0 })
          TSTYOBJ.store.updateTimeLineRightRest()
        })
        this.showList = !this.showList;
        this.editSituation = !this.editSituation;
        this.createEarth("earthContainers");

        /*

         console.log("eventList", res);
         // obj.tasks = res.list;
         let arr = [];
         res.list.forEach((item) => {
           arr.push(window.Store.databaseToTimeline(item));
         });
         obj.tasks = arr;
         obj.startTimestamp = plan.plan_create_time;
         window.Store.initData(obj);
         // window.Clock = new TSTY.clock();
         this.scales = Store.scales;
         this.tasks = Store.tasks;

         this.showList = !this.showList;
         this.editSituation = !this.editSituation;
         this.createEarth("earthContainers");
         this.eventsList = true;
         this.$nextTick(() => {
           window.Store.setFullWidth();
         });*/
      });
    },
    removeEarth1() {
      /* Array.from(_entityMap.values()).forEach(
          (entity) => entity && entity.remove()
      );*/
      _entityMap.clear();
      if (window.Earth1) {
        window.Earth1.destroy();
        window.Earth1 = null;
      }
      this.noSituation = !this.noSituation;
      this.showList = !this.showList;
      this.$nextTick(() => {
        this.$refs.situation.getList();
      });
    },
    changeState() {
      this.State = !this.State;
      let bottomMenuMove = [
        "animate__fadeInLeftBig",
        "animate__fadeOutLeftBig",
      ];
      let leftMenuMove = ["animate__fadeInUpBig", "animate__fadeOutDownBig"];

      let add = 1,
        remove = 0;

      let left_second = document.querySelector(".left_second");
      if (!this.State) {
        left_second.style.display = "none";
      }

      if (this.State) {
        add = 0;
        remove = 1;
      }
      $(".bottomMenu").removeClass(bottomMenuMove[remove]);
      $(".bottomMenu").addClass(bottomMenuMove[add]);
      $(".left").removeClass(leftMenuMove[remove]);
      $(".left").addClass(leftMenuMove[add]);
    },
    tongbu() {
      this.$refs.firstMenu.tongbu2D();
    },
    // videoStop(){
    //   this.$changeComponentShow('.videoStop', false)
    //   this.$sendElectronChanel('endRecoder')
    // },
    flyToView() {
      console.log("2222222222flyToView");
      console.log(111111, localStorage.getItem("defaultView"));
      if (localStorage.getItem("defaultView"))
        YJ.Global.flyTo(JSON.parse(localStorage.getItem("defaultView")));
    },
    closeEditor() {
      this.$sendChanel("closeEditor");
      this.$changeComponentShow("#modal", false);
      this.richTextDialog.visible = false;
    },
    /* save() {
       this.$sendChanel("saveRichText")
       this.$sendChanel("closeEditor")
       this.richTextDialog.visible = false
     },*/
    cancel() {
      this.$changeComponentShow("#modal", false);
      this.$sendChanel("closeEditor");
      this.richTextDialog.visible = false;
    },
    //测试用
    addMarker(option) {
      let selectedNode = getSelectedNode(this.treeObj);
      if (selectedNode) {
        let DbOption = JSON.parse(JSON.stringify(option));
        let source_id = this.$md5(new Date().getTime() + option.source_name);
        DbOption.source_id = source_id;
        DbOption.p_id = selectedNode.source_id;

        let draw = new YJ.Draw[option.key]();
        draw.start((err, params) => {
          console.log(params);
          let detailOption = {};
          if (
            Object.prototype.toString.call(params) === "[object Object]" &&
            !params.hasOwnProperty("lng")
          ) {
            detailOption = params;
          } else {
            detailOption = { position: params, name: option.source_name };
          }
          if (err) throw err;
          //node上树，node存数据库
          let node = getNodeData(DbOption, detailOption);
          console.log(DbOption);
          addSource(node).then((res) => {
            if ([0, 200].includes(res.code)) {
              cusRenderNode(DbOption);
              cusAddNodes(this.treeObj, selectedNode, [node]);
            }
          });
        });
      } else {
        this.$message.warning("请选中一节点后操作");
      }
    },

    /*langChange() {
      this.$store.dispatch("changeLang", this.value)
      this.$store.dispatch("changeIconSingleColor", "red")
      console.log("lang", this.lang)
    },*/
    createEarth(domId) {
      this.$nextTick(() => {
        console.log("$nextTick");
        if (YJ) {
          window.Earth1 = new YJ.YJEarth(domId);
          window.earth = window.Earth1;
          YJ.Global.CesiumContainer(Earth1, { compass: false, legend: false });
          YJ.Global.setGroundCover(true);
          this.$refs.cabin.getSourceList();
          window.Earth1.tabHide = ["属性信息"];
        }
      });
    }
  },
};
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.dashboard {
  &-container {
    width: 100vw;
    height: 100vh;
    position: fixed;

    //海东1021
    .goodSearch {
      z-index: 999;

      .contentBox {
        border: 1.5px solid;
        backdrop-filter: blur(2px);
        background: linear-gradient(0deg, #00ffff33 0%, #00ffff00 100%),
          rgba(0, 0, 0, 0.6);
        width: 650px;
        height: 400px;
        position: absolute;
        color: #fff;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        border-image: linear-gradient(to bottom,
            rgb(0, 255, 255) 6.25%,
            rgb(0, 200, 255) 100%) 1;
        display: flex;
        flex-direction: column;
        justify-content: space-between;

        .titleBox {
          height: 50px;

          .title {
            line-height: 50px;
            padding-left: 15px;
            font-size: 20px;
            text-shadow: 0px 0px 9px rgba(20, 118, 255, 1);
          }

          .closeBox {
            right: 0;
            position: absolute;
            display: inline-block;
            width: 35px;
            height: 33px;
            border-radius: 0 0 0 90%;
            background: #00ffff;

            &>span {
              font-size: 22px;
              position: absolute;
              right: 5px;
              cursor: pointer;
            }
          }
        }

        #goodSearchEchart {
          flex: auto;
        }

        .hr {
          width: 89%;
          margin: 0 auto;
          border-bottom: 1px solid rgba(204, 204, 204, 0.2);
        }

        &:after {
          display: block;
          position: absolute;
          content: "";
          left: -1.5px;
          top: -6px;
          width: 70.5px;
          height: 6px;
          opacity: 1;
          background: rgba(0, 255, 255, 1);
          clip-path: polygon(0 0, calc(100% - 3px) 0, 100% 6px, 0 6px);
        }
      }
    }

    //height: calc(100vh - 50px);
    //margin: 30px;
    #earth {
      display: flex;
      width: 100vw;
      height: 100vh;
    }

    #earths {
      width: 100vw;
      height: 100vh;
      display: none;
    }

    .halfEarth {
      display: block !important;
      width: 50vw !important;
    }

    .zIndex1 {
      z-index: -1;
    }

    .selectedEarthCss {
      //border: 1px solid red;
      padding: 2px;
    }

    .svg-container {
      display: inline-block;
      //border: 1px solid red;
    }

    .bottomMenuBox,
    .leftBox {
      overflow: hidden;
    }

    .selectImgBox,
    .profileAnalysisBox,
    .cutFillBox,
    .inundationAnalysisBox,
    .flyToLocationBox,
    .tongbu,
    .modelSelectBox,
    .bimInfoBox,
    .echartsTotalBox,
    .modelBox,
    .vrModelBox,
    .scene,
    .editor,
    .junbiaoBox,
    .textModelBox,
    .junbiao3dBox,
    .videoStop,
    .adddirectoryBox,
    .excelSetBox,
    .tufuSelect,
    .tacticalBox,
    .ModelSetBox,
    .modelBoxg {
      display: none;
    }

    .selectImgBox {
      z-index: 9999999;
    }
    .ModelSetBox{
      z-index: 10000;
    }

    .scene {
      //width: 5vw;
      //height: 5vw;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      //border: 1px solid red;
      background: #808080;
    }

    .logo {
      width: 5vw;
      height: 5vw;
      bottom: 10px;
      left: 20px;

      img {
        width: 100%;
        height: 100%;
      }
    }

    .richTextDialogBox {
      position: absolute;
      //border: 1px solid red;
      width: 1090px;
      height: 600px;
      z-index: 2003;
    }

    #modal {
      position: fixed;
      z-index: 99;
      background-color: rgba(0, 0, 0, 0.5);
      width: 100vw;
      height: 100vh;
      display: none;
    }

    ::v-deep .el-dialog {
      height: 600px;

      .el-dialog__body {
        padding: 0 !important;
      }
    }
  }

  &-text {
    font-size: 30px;
    line-height: 46px;
  }
}
</style>
<style lang="scss">
.dashboard-container {

  //新增态势0830
  .cabinShowBtn {
    z-index: 9999;
    //display: none;
    position: absolute;
    top: calc(50% - 225px);

    .switch-node-outer {
      position: relative;
      background: #0ff;
      clip-path: polygon(0% calc(var(--width) + var(--innerBorder)),
          100% 0%,
          100% 100%,
          0% calc(100% - var(--width) - var(--innerBorder)));
      padding: calc(var(--innerBorder) * 1.42) var(--innerBorder);

      .switch-node-inner {
        clip-path: polygon(0% var(--width),
            100% var(--innerBorder),
            100% calc(100% - var(--innerBorder)),
            0% calc(100% - var(--width)));
        //clip-path: polygon(0% var(--innerBorder), 100% var(--width), 100% calc(100% - 30px), 0% calc(100% - 3px));
        cursor: pointer;
        writing-mode: vertical-lr;
        padding: calc(var(--width) * 1.1) 0;
        width: var(--width);
        line-height: var(--width);
        background: var(--bg-color);
        color: #0ff;
        letter-spacing: 2.5px;
        /* border: 1.5px solid rgba(0, 255, 255, 1); */
        position: relative;
        box-sizing: border-box;
      }
    }
  }

  .timeline-container {
    position: absolute;
    width: 100vw;
    //height: 230px;
    box-sizing: border-box;
    z-index: 9;
    bottom: 0;

    .area {
      position: relative;
    }
  }

  //新增态势0822
  .elementShowBtn {
    z-index: 9999;
    //display: none;
    position: absolute;
    //新增态势0827
    //left: 0%;
    top: calc(50% - 225px);
    /*transform: translateY(-50%);*/

    .switch-node-outer {
      position: relative;

      //width: var(--width);
      clip-path: polygon(0% 0%,
          100% calc(var(--width) + var(--innerBorder)),
          100% calc(100% - var(--width) - var(--innerBorder)),
          0% 100%);
      //clip-path: polygon(0% 0%, 100% 33px, 100% calc(100% - 33px), 0% 100%);
      padding: calc(var(--innerBorder) * 1.42) var(--innerBorder);
      //padding: 4.6px 3px;
      background: #0ff;

      .switch-node-inner {
        clip-path: polygon(0% var(--innerBorder),
            100% var(--width),
            100% calc(100% - var(--width)),
            0% calc(100% - var(--innerBorder)));
        //clip-path: polygon(0% var(--innerBorder), 100% var(--width), 100% calc(100% - 30px), 0% calc(100% - 3px));
        cursor: pointer;
        writing-mode: vertical-lr;
        padding: calc(var(--width) * 1.1) 0;
        width: var(--width);
        line-height: var(--width);
        background: var(--bg-color);
        color: #0ff;
        letter-spacing: 2.5px;
        /* border: 1.5px solid rgba(0, 255, 255, 1); */
        position: relative;
        box-sizing: border-box;
      }
    }
  }

  .cabinShowBtn {
    right: 0%;
  }

  //新增态势
  &>.content {
    background: url("../../assets/img/bkgif@3x.gif") no-repeat;
    background-size: 100% 100%;
    width: 100vw;
    height: 100vh !important;
    position: absolute;
    z-index: 9;
  }

  .icon-top {
    //width: 100%;
    //height: 100%;
    top: 0;
    left: 0;
    z-index: 99;
    position: absolute;
    width: vw(1920) !important;
    //height: 8.888vh;
    height: vh(96) !important;
    //background: linear-gradient(180deg, rgba(0, 33, 36, 1) 0%, rgba(0, 38, 41, 1) 25.47%, rgba(0, 0, 0, 0) 100%);
  }

  .timeline-content {
    position: absolute;
    width: 100vw;
    height: vh(295);
    box-sizing: border-box;
    z-index: 9;
    bottom: 0;
    background: url("../../assets/img/timeLinePanelBg.png") no-repeat 50% 100%;
    background-size: cover;

    .area {
      position: relative;
    }
  }

  .icon-tuichu {
    position: absolute;
    top: vh(5);
    right: vw(5);
    z-index: 999;
    width: vw(24) !important;
    height: vh(24) !important;
    cursor: pointer;
  }

  .icon-tuichudenglu {
    position: absolute;
    z-index: 999;
    width: vw(26);
    height: vh(26);
    right: vw(8);
    top: vh(8);
  }

  .titles {
    left: 50%;
    transform: translateX(-50%);
    font-size: px2font(40);
    top: vh(19);
    line-height: px2font(50);
    font-family: "alimamashuheiti";
    z-index: 999;
    position: absolute;
    color: #fff;
  }

  .elementBox,
  .cabinBox {
    width: vw(343);
    height: vh(662);
    position: absolute;
    z-index: 9999;
    top: vh(145);
    border: vw(1.5) solid rgba(0, 255, 255, 1);
    background: linear-gradient(180deg,
        rgba(0, 255, 255, 0.2) 0%,
        rgba(0, 255, 255, 0) 100%),
      rgba(0, 0, 0, 0.5);
    color: #fff;
  }

  .eventEditor {
    border: 1px solid;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 999;
    color: #fff;
    background: rgba(0, 63, 63, 1);
    overflow-y: auto;
    font-size: px2font(16);
  }

  .elementBox {
    left: vw(30);
  }

  .cabinBox {
    right: vw(30);
  }

  //新增态势结束
  .el-dialog {
    height: 600px;
    display: flex;
    flex-direction: column;

    .el-dialog__body {
      padding-top: 0 !important;
      padding-bottom: 0 !important;
      flex: auto;
      display: flex;
      flex-direction: column;

      #richTextEditor {
        flex: auto;
        display: flex;
        flex-direction: column;

        .w-e-text-container {
          flex: auto;
        }
      }
    }
  }

  .transformDrawerContent {
    padding-left: 15px;

    .btn {
      margin-top: 5px;
    }

    .transformDrawerItem {
      padding-left: 10px;
      font-size: 12px;
      display: flex;
      align-items: center;
      margin-top: 5px;

      >span {
        display: block;
        width: 115px;
        /* align-content: center; */
      }
    }
  }

  .fightingDataStyleBox {
    display: none;
  }

  .movie {
    top: 0.1vh;
    left: 0;
    width: 98vw;
    // display: none;
    //height: 240px !important;
  }
}
</style>
