<template>
  <div class="w-full h-full charginfo-index">
    <div class="charglink" @click="toSf">机电工作台</div>
    <div class="chargselect">
      <wayFilter />
    </div>
    <div class="curbuss-left">
      <Left />
    </div>
    <div class="curbuss-center">
      <mainCenter />
    </div>
    <div class="curbuss-right">
      <Right />
    </div>
  </div>
</template>

<script>

import Left from './component/left.vue';
import mainCenter from './component/mainCenter.vue';
import Right from './component/right.vue';

// 组织机构下拉
import wayFilter from "@/views/electromechanicalMange/component/wayFilter.vue";
import { getLinke } from '@/api/chargeInfo.js';
import { generateKey } from "@/api/operation";
export default {
  components: {
    Left,
    mainCenter,
    Right,
    wayFilter,
  },
  data() {
    return {
      link: ''
    }
  },
  async mounted() {
    const data = await getLinke()
    const arr = data.msgContent.filter(item => item.sysCode == 'JD')
    this.link = arr[0].url
  },
  methods: {
    toSf() {
      generateKey().then((res) => {
        window.open(`http://183.64.175.153:8891/?tokenKey=${res.data}#/`);
      });
    }
  }
}
</script>

<style lang="scss" scoped>
@import "~/styles/viewport-convert.scss";

div {
  box-sizing: border-box;
}

.charginfo-index {
  background: url("@/assets/images/ChargeInfo/charginfobg.png");
  background-size: 100% 100%;
  padding-top: 55px;
  padding-bottom: 40px;
  display: flex;

}


.charglink {
  position: absolute;
  top: 10px;
  right: 285px;
  width: 96px;
  height: 34px;
  background: url("@/assets/images/ChargeInfo/sfgzttz.png");
  background-size: 100% 100%;
  font-size: 13px;
  text-align: center;
  line-height: 34px;
  z-index: 999;
  cursor: pointer;
}

.chargselect {
  position: absolute;
  top: 2px;
  left: 10px;
  z-index: 999;
}

.curbuss-left,
.curbuss-right {
  width: vw(450);
  height: 100%;


  ::v-deep {
    .el-select {
      margin: 0 10px;
    }
  }
}

.curbuss-center {
  width: vw(1000);
  height: 100%;
}
</style>
