dataease/frontend/src/components/canvas/custom-component/Picture.vue

<template>
  <div style="overflow: hidden;width: 100%;height: 100%;">
    <img v-if="!showLink" :src="element.propValue">
    <a v-if="showLink" :title="element.hyperlinks.content " :target="element.hyperlinks.openMode " :href="element.hyperlinks.content ">
      <img :src="element.propValue">
    </a>
  </div>
</template>

<script>
export default {
  props: {
    element: {
      type: Object,
      require: true
    },
    editMode: {
      type: String,
      require: false,
      default: 'preview'
    }
  },
  computed: {
    showLink() {
      return this.editMode === 'preview' && this.element && this.element.hyperlinks && this.element.hyperlinks.enable
    }
  }
}
</script>

<style lang="scss" scoped>
img {
    width: 100%;
    height: 100%;
}
</style>