<template>
  <div style="display: inline-block;height: 100% ">
    <div style="display: flex;align-items: center;height: 100%">
    <span :style="(defaultData||{}).textData">
    {{ ((defaultData || {}).textData || {}).text }}
    </span>
    </div>
  </div>
</template>
<script>

export default {
  props: ['defaultData'],
  expose: ['getRequestData'],
  components: {},
  data() {
    return {
      resizeTime: true,
      maxHeight: null,
      requestData: null
    };
  },
  watch: {
    defaultData: {
      handler(a, b) {
        this.getOption();
      },
      deep: true
    }
  },
  mounted() {
    this.getRequestData();
    this.getOption();
  },
  methods: {
    getOption() {
    },
    async getRequestData() {
      this.requestData = {};
      if (this.defaultData?.requests) {
        for (const e of (this.defaultData || {}).requests) {
          let fn = new Function('_this', `return async function() {${e.text}}`);
          let data = await fn(this)();
          e.data = data;
          this.requestData = { ...this.requestData, ...data };
        }
      }
    }
  }
};
</script>
<style>

</style>
