222
schangxiang@126.com
2025-04-30 9bec4dcae002f36aa23231da11cb03a156b40110
PipeLineLems/web/src/components/Icon/Icon.tsx
@@ -1,4 +1,5 @@
import { computed, defineComponent } from 'vue'
import { computed, defineComponent, ref } from 'vue'
import parse from 'style-to-object'
export default defineComponent({
  name: '图标',
  props: {
@@ -14,21 +15,54 @@
      type: Number,
      default: 12,
    },
    draggable: {
      type: Boolean,
      default: false,
    },
    cursor: {
      type: String,
      default: '',
    },
    class: {
      type: String,
      default: '',
    },
    style: {
      type: [Object, String],
      default: () => ({}),
    },
  },
  emits: ['click'],
  setup(props, { attrs, slots, emit }) {
    const VITE_STATIC_URL = process.env.VITE_STATIC_URL || ''
    const imgUrl = computed(() => {
      const imgName = props.icon
      return new URL(`../../assets/images/${imgName}.png`, import.meta.url).href
      let imgName = props.icon
      if (!imgName) return ''
      let baseDir = 'images'
      if (imgName.includes('files/')) {
        baseDir = 'files'
        imgName = imgName.split('/')[1]
      }
      return `${VITE_STATIC_URL}/resources/assets/${baseDir}/${imgName}.png`
    })
    const style = computed(() => {
      if (typeof props.style === 'string') {
        return parse(props.style)
      }
      return props.style
    })
    return () => {
      if (imgUrl.value.includes('undefined')) return null
      return (
        <img
          onClick={(evt: Event) => emit('click', evt)}
          width={props.width}
          height={props.height}
          src={imgUrl.value}
          style={{ cursor: props.cursor, ...style.value }}
          class={props.class}
          {...attrs}
        />
      )