<template>
  <BaseSameLayer
    :hosSameLayerArgs="hosSameLayerArgs"
    embedType="native/midea-audio-input-view"
    :defaultWidth="300"
    :defaultHeight="300"
    :key="btnEnableForAndroid"
    ref="audioWaveRef"
  ></BaseSameLayer>
</template>

<script>
import BaseSameLayer from "./baseSameLayer.vue";
const weexModule = weex.requireModule('weexModule');

export default {
  name: "mideaAudioInputView",
  data() {
    return {
      width: 0,
      height: 0
    }
  },
  components: {
    BaseSameLayer,
  },
  props: {
    hosUniqueProps: {
      type: Object,
      default() {
        return {};
      },
    },
    data: {
      type: Object,
      default() {
        return {
          embedId:''
        };
      },
    },
    accessible: {
      type: Boolean,
      default: true
    },
    ariaLabel: {
      type: String,
      default: '确认'
    },
    btnEnableForAndroid:{
      type: Boolean,
      default: true
    }
  },
  computed: {
    hosSameLayerArgs() {
      return {
        ...this.hosUniqueProps, // 鸿蒙原生组件独有属性
        width: this.width,
        height: this.height,
        data: this.data,
        accessible: this.accessible,
        btnText: this.ariaLabel,
        onAudioInputStart: this.onAudioInputStart,
        onAudioInputCancel: this.onAudioInputCancel,
        onAudioInputFail: this.onAudioInputFail,
        onAudioInputComplete: this.onAudioInputComplete,
        btnEnableForAndroid: this.btnEnableForAndroid
      };
    },
  },
  mounted() {
    this.width = this.$el.clientWidth;
    this.height = this.$el.clientHeight;
    this.embedId = this.$refs.audioWaveRef.embedId;
  },

  methods: {
    onAudioInputStart(res){
      this.$emit("onAudioInputStart", res);
    },
    onAudioInputCancel(res){
      this.$emit("onAudioInputCancel", res);
    },
    onAudioInputFail(res){
      this.$emit("onAudioInputFail", res);
    },
    onAudioInputComplete(res){
      this.$emit("onAudioInputComplete", res);
    }
  },
};
</script>
