<template>
  <BaseSameLayer
    :hosSameLayerArgs="hosSameLayerArgs"
    embedType="native/pick-pallet"
    :defaultWidth="100"
    :defaultHeight="100"
  ></BaseSameLayer>
</template>

<script>
import BaseSameLayer from './baseSameLayer.vue';

export default {
  data() {
    return {
      width: 0,
      height: 0,
    };
  },
  name: 'PickPallet',
  components: {
    BaseSameLayer,
  },
  props: {
    titleName: {
      type: String,
      default: '',
    },
    selectionCircleColor: {
      type: String,
      default: '#fff',
    },
    titleName: {
      type: String,
      default: '',
    },
    style: {
      type: Object,
      default: () => ({}),
    },
  },
  computed: {
    hosSameLayerArgs() {
      return {
        ...this.hosUniqueProps, // 鸿蒙原生组件独有属性
        width: this.width,
        height: this.height,
        config: this.config,
        style: this.style,
        titleName: this.titleName,
        selectionCircleColor: this.selectionCircleColor,
        handleChangeColor: this.handleChangeColor,
      };
    },
  },
  mounted() {
    this.width = this.$el.clientWidth;
    this.height = this.$el.clientHeight;
  },
  methods: {
    handleChangeColor(res) {
      this.$emit('changeColor', res);
    },
  },
};
</script>
