currency-tools

• 示例

<template>
<my-panel fit
    id="testId"
    :shadow="'never'"
    :border="false"
    title="cs">
  <div id="test">
    <div >
      <span>cs123</span>
      123
      </div>
    <el-tooltip :content="tooltipText">
      <span style="cursor: pointer">
        <i :class="icon"
          style="font-size: x-large"
          @click="toggle"></i>
      </span>
    </el-tooltip>
  </div>
</my-panel>

</template>

<script>
import {Design, isFullScreen} from 'currency-tools'
export default {
  data() {
    return {
      isFullScreen: false
    }
  },
  computed: {
    icon() {
      return this.isFullScreen ? 'el-icon-switch-button' : 'el-icon-full-screen'
    },
    tooltipText() {
      return this.isFullScreen ? '退出全屏' : '全屏'
    }
  },
  created() {
    // 初始化监听器
    this.resizeListener()
  },
  methods: {
    resizeListener() {
      const that = this
      window.addEventListener('resize', function () {
        if (!isFullScreen()) {
          if (!isFullScreen()) {
            that.isFullScreen = false
          }
        }
      })
    },
    toggle() {
      Design.toggle('testId', this)
    }
  }
}
</script>

<style>
</style>