import { defineComponent } from "vue";
import { string } from "vue-types";
import { useEditor } from "../../..";
import { View } from "./View";

const imgDef = require("@/assets/imgs/default.png");

export const Image = defineComponent({
  props: {
    value: string(),
  },
  emits: ["update:value"],
  setup(props, { emit }) {
    const { store } = useEditor();
    async function changeVal() {
      alert("选择模型");
      emit("update:value", Math.random().toString());
    }
    return () => (
      <View>
        <img
          class="w-1/1 h-1/1"
          src={props.value || imgDef}
          onClick={store.isEditMode? changeVal : undefined}
        />
      </View>
    );
  },
});