<template>
  <div class="data-analysis-dialog">
    <div class="image-box">
      <el-image :src="imgUrl" fit="fill" alt=""></el-image>
    </div>
  </div>
</template>

<script lang="ts">
import {Component, Vue, Watch} from 'vue-property-decorator'
import HttpApi from '@/api'

@Component({})
export default class DataAnalysis extends Vue {
  private visible = false
  private imgUrl = ''
  private language: any = {}

  @Watch('$store.state.language', {immediate: true})
  languageChange(data: any) {
    if (data) this.language = data
  }

  public mounted() {
    this.getUrl()
  }

  /**
   * 获取数据分析图片url
   * @private
   */
  private getUrl() {
    HttpApi.getDataAnalysisImg({}).then((res: any) => {
      this.imgUrl = res
    })
  }

  private cancel() {
    console.log()
  }
}
</script>

<style lang="scss" scoped>
.data-analysis-dialog {
  ::v-deep .el-dialog__body {
    height: 56.25rem !important;
  }
}

.image-box {
  max-height: 80vh;
  overflow: auto;
  border: 0.125rem solid #d3d2d2;
  border-radius: 0.625rem;
}

::v-deep .el-dialog {
  left: 6rem;
}
</style>
