crm-app-vue3/pages/orderDetailRefactored/components/PicComp.vue

<template>
  <view class="pic-comp-container">
    <image 
      class="pic-comp-image" 
      :src="src" 
      mode="aspectFill" 
      @click="handleClick"
    />
  </view>
</template>

<script>
export default {
  name: 'PicComp',
  props: {
    src: {
      type: String,
      default: ''
    }
  },
  methods: {
    handleClick() {
      this.$emit('needPreviewPic', this.src)
    }
  }
}
</script>

<style scoped lang="scss">
.pic-comp-container {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  overflow: hidden;
  border-radius: 30rpx;
}

.pic-comp-image {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}
</style>