高阶组件

Icon 字体图标组件

web框架的图标组件是基于 iconfont 封装的。

如果需要增加字体的类型，请联系基础软件部获取原始项目资源。

基础使用

<Icon icon="icon-close" :size="16" color='#1677ff' />

提醒

框架设置了Icon组件为全局组件，使用时无需 import 引入。

组件配置

配置项	说明	类型	默认值
icon	font-class	string
size	字体大小	number	16
color	字体图标颜色	string	#000000

图标预览

CustomFileUploader 上传组件

CustomFileUploader组件是基于Element Plus 的 Uploader 组件封装的。

在 Uploader 基础实现了自动上传到服务器，图片预览等功能。

基础使用

<script setup>
 import CustomFileUploader from '@/components/Form/CustomFileUploader.vue'

 const file_list = ref(
    [
      { name: 'test.jpg', url: '795', uploadAt: '2024-02-21 09:09:09' }
    ]
 )
 const fileChange = (list) => {
    file_list.value = list
}
</script>

<template>
 <CustomFileUploader
   accept="image/*"
    :file_list="file_list"
    @fileChange="fileImgChange"
    :limit="3"
    list_type="picture"
    />
</template>

组件配置

配置项	说明	类型	默认值
file_list	文件列表	array	[]
accept	可上传的文件类型	string	""
limit	可上传的文件数量	number	100
show_list	是否显示上传文件列表	boolean	true
list_type	文件列表展示类型	text,picture,picture-card	text
tips	上传引导词	string	""