diff --git a/web/src/components/fileSelector/index.vue b/web/src/components/fileSelector/index.vue
index 1e1862c348f8084092665c86a73af860b8e87d90..e07a91949f140c1986b800150275c3e335d42795 100644
--- a/web/src/components/fileSelector/index.vue
+++ b/web/src/components/fileSelector/index.vue
@@ -8,7 +8,27 @@
           <el-option v-for="item, index in listAllData" :key="index" :value="String(item[props.valueKey])"
             :label="item.name" />
         </el-select>
-        <div v-if="props.inputType === 'image'" style="position: relative;" class="form-display"
+
+        <div v-if="props.inputType === 'image' && props.multiple"
+          style="width: 100%; display: flex; gap: 4px; flex-wrap: wrap; margin-bottom: 4px;">
+          <el-image v-for="item, index in (data || [])" :src="item" :key="index" fit="scale-down" class="itemList"
+            :style="{ width: props.inputSize + 'px', aspectRatio: '1 / 1' }" />
+          <div style="position: relative;" :style="{ width: props.inputSize + 'px', height: props.inputSize + 'px' }">
+            <div
+              style="position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center;">
+              <el-icon :size="24">
+                <Plus />
+              </el-icon>
+            </div>
+            <div @click="selectVisiable = true && !props.disabled" class="addControllorHover"
+              :style="{ cursor: props.disabled ? 'not-allowed' : 'pointer' }"></div>
+            <el-icon v-show="(!!data && !props.disabled) && !props.multiple" class="closeHover" :size="16"
+              @click="clear">
+              <Close />
+            </el-icon>
+          </div>
+        </div>
+        <div v-if="props.inputType === 'image' && !props.multiple" class="form-display" style="position: relative;"
           @mouseenter="formDisplayEnter" @mouseleave="formDisplayLeave"
           :style="{ width: props.inputSize + 'px', height: props.inputSize + 'px' }">
           <el-image :src="data" fit="scale-down" :style="{ width: props.inputSize + 'px', aspectRatio: '1 / 1' }">
@@ -24,10 +44,11 @@
           </div>
           <div @click="selectVisiable = true && !props.disabled" class="addControllorHover"
             :style="{ cursor: props.disabled ? 'not-allowed' : 'pointer' }"></div>
-          <el-icon v-show="!!data && !props.disabled" class="closeHover" :size="16" @click="clear">
+          <el-icon v-show="(!!data && !props.disabled) && !props.multiple" class="closeHover" :size="16" @click="clear">
             <Close />
           </el-icon>
         </div>
+
         <div v-if="props.inputType === 'video'" class="form-display" @mouseenter="formDisplayEnter"
           @mouseleave="formDisplayLeave"
           style="position: relative; display: flex; align-items: center;  justify-items: center;"
@@ -46,6 +67,7 @@
             <Close />
           </el-icon>
         </div>
+
         <div v-if="props.inputType === 'audio'" class="form-display" @mouseenter="formDisplayEnter"
           @mouseleave="formDisplayLeave"
           style="position: relative; display: flex; align-items: center;  justify-items: center;"
@@ -199,7 +221,7 @@ const props = defineProps({
   tabsShow: { type: Number, default: SHOW.ALL },
 
   // 是否可以多选，默认单选
-  // 该值为true时inputType必须是selector（暂不支持其他type的多选）
+  // 该值为true时inputType必须是selector或image（暂不支持其他type的多选）
   multiple: { type: Boolean, default: false },
 
   // 是否可选，该参数用于只上传和展示而不选择和绑定model的情况
@@ -274,6 +296,7 @@ const onItemClick = async (e: MouseEvent) => {
   while (!target.dataset.id) target = target.parentElement as HTMLElement;
   let fileId = target.dataset.id;
   if (props.multiple) {
+    if (!!!data.value) data.value = [];
     if (target.classList.contains('active')) { target.classList.remove('active'); flat = -1; }
     else { target.classList.add('active'); flat = 1; }
     if (data.value.length) {
@@ -394,7 +417,8 @@ const onDataChange = (value: any) => {
 defineExpose({ data, onDataChange, selectVisiable, clearState, clear });
 
 onMounted(() => {
-  if (props.multiple && props.inputType !== 'selector')
+
+  if (props.multiple && !['selector', 'image'].includes(props.inputType))
     throw new Error('FileSelector组件属性multiple为true时inputType必须为selector');
   listRequestAll();
   console.log('fileselector tenentmdoe', isTenentMode);
@@ -475,4 +499,9 @@ onMounted(() => {
   top: 2px;
   cursor: pointer;
 }
+
+.itemList {
+  border: 1px solid #dcdfe6;
+  border-radius: 8px;
+}
 </style>
\ No newline at end of file
diff --git a/web/src/views/system/fileList/crud.tsx b/web/src/views/system/fileList/crud.tsx
index 5dc388ecbd58654332400beb9ba89794bdc7922f..48143c45d8c6b9ea6dbcb10366d93ddb65ec30bf 100644
--- a/web/src/views/system/fileList/crud.tsx
+++ b/web/src/views/system/fileList/crud.tsx
@@ -1,253 +1,254 @@
 import * as api from './api';
 import {
-	UserPageQuery,
-	AddReq,
-	DelReq,
-	EditReq,
-	CrudExpose,
-	CrudOptions,
-	CreateCrudOptionsProps,
-	CreateCrudOptionsRet,
-	dict
+  UserPageQuery,
+  AddReq,
+  DelReq,
+  EditReq,
+  CrudExpose,
+  CrudOptions,
+  CreateCrudOptionsProps,
+  CreateCrudOptionsRet,
+  dict
 } from '@fast-crud/fast-crud';
 import fileSelector from '/@/components/fileSelector/index.vue';
-import { shallowRef } from 'vue';
 
 export const createCrudOptions = function ({ crudExpose, context }: CreateCrudOptionsProps): CreateCrudOptionsRet {
-	const pageRequest = async (query: UserPageQuery) => {
-		return await api.GetList(query);
-	};
-	const editRequest = async ({ form, row }: EditReq) => {
-		form.id = row.id;
-		return await api.UpdateObj(form);
-	};
-	const delRequest = async ({ row }: DelReq) => {
-		return await api.DelObj(row.id);
-	};
-	const addRequest = async ({ form }: AddReq) => {
-		return await api.AddObj(form);
-	};
-	return {
-		crudOptions: {
-			actionbar: {
-				buttons: {
-					add: {
-						show: true,
-						click: () => context.openAddHandle?.()
-					},
-				},
-			},
-			request: {
-				pageRequest,
-				addRequest,
-				editRequest,
-				delRequest,
-			},
-			tabs: {
-				show: true,
-				name: 'file_type',
-				type: '',
-				options: [
-					{ value: 0, label: '图片' },
-					{ value: 1, label: '视频' },
-					{ value: 2, label: '音频' },
-					{ value: 3, label: '其他' },
-				]
-			},
-			rowHandle: {
-				//固定右侧
-				fixed: 'right',
-				width: 200,
-				show: false,
-				buttons: {
-					view: {
-						show: false,
-					},
-					edit: {
-						iconRight: 'Edit',
-						type: 'text',
-					},
-					remove: {
-						iconRight: 'Delete',
-						type: 'text',
-					},
-				},
-			},
-			columns: {
-				_index: {
-					title: '序号',
-					form: { show: false },
-					column: {
-						//type: 'index',
-						align: 'center',
-						width: '70px',
-						columnSetDisabled: true, //禁止在列设置中选择
-						formatter: (context) => {
-							//计算序号,你可以自定义计算规则，此处为翻页累加
-							let index = context.index ?? 1;
-							let pagination = crudExpose!.crudBinding.value.pagination;
-							return ((pagination!.currentPage ?? 1) - 1) * pagination!.pageSize + index + 1;
-						},
-					},
-				},
-				search: {
-					title: '关键词',
-					column: {
-						show: false,
-					},
-					search: {
-						show: true,
-						component: {
-							props: {
-								clearable: true,
-							},
-							placeholder: '请输入关键词',
-						},
-					},
-					form: {
-						show: false,
-						component: {
-							props: {
-								clearable: true,
-							},
-						},
-					},
-				},
-				name: {
-					title: '文件名称',
-					search: {
-						show: true,
-					},
-					type: 'input',
-					column: {
-						minWidth: 200,
-					},
-					form: {
-						component: {
-							placeholder: '请输入文件名称',
-							clearable: true
-						},
-					},
-				},
-				preview: {
-					title: '预览',
-					column: {
-						minWidth: 120,
-						align: 'center'
-					},
-					form: {
-						show: false
-					}
-				},
-				url: {
-					title: '文件地址',
-					type: 'file-uploader',
-					search: {
-						disabled: true,
-					},
-					column: {
-						minWidth: 360,
-					},
-				},
-				md5sum: {
-					title: '文件MD5',
-					search: {
-						disabled: true,
-					},
-					column: {
-						minWidth: 300,
-					},
-					form: {
-						disabled: false
-					},
-				},
-				mime_type: {
-					title: '文件类型',
-					type: 'input',
-					form: {
-						show: false,
-					},
-					column: {
-						minWidth: 160
-					}
-				},
-				file_type: {
-					title: '文件类型',
-					type: 'dict-select',
-					dict: dict({
-						data: [
-							{ label: '图片', value: 0, color: 'success' },
-							{ label: '视频', value: 1, color: 'warning' },
-							{ label: '音频', value: 2, color: 'danger' },
-							{ label: '其他', value: 3, color: 'primary' },
-						]
-					}),
-					column: {
-						show: false
-					},
-					search: {
-						show: true
-					},
-					form: {
-						show: false,
-						component: {
-							placeholder: '请选择文件类型'
-						}
-					}
-				},
-				size: {
-					title: '文件大小',
-					column: {
-						minWidth: 120
-					},
-					form: {
-						show: false
-					}
-				},
-				upload_method: {
-					title: '上传方式',
-					type: 'dict-select',
-					dict: dict({
-						data: [
-							{ label: '默认上传', value: 0, color: 'primary' },
-							{ label: '文件选择器上传', value: 1, color: 'warning' },
-						]
-					}),
-					column: {
-						minWidth: 140
-					},
-					search: {
-						show: true
-					}
-				},
-				create_datetime: {
-					title: '创建时间',
-					column: {
-						minWidth: 160
-					},
-					form: {
-						show: false
-					}
-				},
-				// fileselectortest: {
-				// 	title: '文件选择器测试',
-				// 	type: 'file-selector',
-				// 	width: 200,
-				// 	form: {
-				// 		component: {
-				// 			name: shallowRef(fileSelector),
-				// 			vModel: 'modelValue',
-				// 			tabsShow: 0b0100,
-				// 			itemSize: 100,
-				// 			multiple: false,
-				// 			selectable: true,
-				// 			showInput: true,
-				// 			inputType: 'video',
-				// 			valueKey: 'url',
-				// 		}
-				// 	}
-				// }
-			},
-		},
-	};
+  const pageRequest = async (query: UserPageQuery) => {
+    return await api.GetList(query);
+  };
+  const editRequest = async ({ form, row }: EditReq) => {
+    form.id = row.id;
+    return await api.UpdateObj(form);
+  };
+  const delRequest = async ({ row }: DelReq) => {
+    return await api.DelObj(row.id);
+  };
+  const addRequest = async ({ form }: AddReq) => {
+    return await api.AddObj(form);
+  };
+  return {
+    crudOptions: {
+      actionbar: {
+        buttons: {
+          add: {
+            show: true,
+            click: () => context.openAddHandle?.()
+          },
+        },
+      },
+      request: {
+        pageRequest,
+        addRequest,
+        editRequest,
+        delRequest,
+      },
+      tabs: {
+        show: true,
+        name: 'file_type',
+        type: '',
+        options: [
+          { value: 0, label: '图片' },
+          { value: 1, label: '视频' },
+          { value: 2, label: '音频' },
+          { value: 3, label: '其他' },
+        ]
+      },
+      rowHandle: {
+        //固定右侧
+        fixed: 'right',
+        width: 200,
+        show: false,
+        buttons: {
+          view: {
+            show: false,
+          },
+          edit: {
+            iconRight: 'Edit',
+            type: 'text',
+          },
+          remove: {
+            iconRight: 'Delete',
+            type: 'text',
+          },
+        },
+      },
+      columns: {
+        _index: {
+          title: '序号',
+          form: { show: false },
+          column: {
+            //type: 'index',
+            align: 'center',
+            width: '70px',
+            columnSetDisabled: true, //禁止在列设置中选择
+            formatter: (context) => {
+              //计算序号,你可以自定义计算规则，此处为翻页累加
+              let index = context.index ?? 1;
+              let pagination = crudExpose!.crudBinding.value.pagination;
+              return ((pagination!.currentPage ?? 1) - 1) * pagination!.pageSize + index + 1;
+            },
+          },
+        },
+        search: {
+          title: '关键词',
+          column: {
+            show: false,
+          },
+          search: {
+            show: true,
+            component: {
+              props: {
+                clearable: true,
+              },
+              placeholder: '请输入关键词',
+            },
+          },
+          form: {
+            show: false,
+            component: {
+              props: {
+                clearable: true,
+              },
+            },
+          },
+        },
+        name: {
+          title: '文件名称',
+          search: {
+            show: true,
+          },
+          type: 'input',
+          column: {
+            minWidth: 200,
+          },
+          form: {
+            component: {
+              placeholder: '请输入文件名称',
+              clearable: true
+            },
+          },
+        },
+        preview: {
+          title: '预览',
+          column: {
+            minWidth: 120,
+            align: 'center'
+          },
+          form: {
+            show: false
+          }
+        },
+        url: {
+          title: '文件地址',
+          type: 'file-uploader',
+          search: {
+            disabled: true,
+          },
+          column: {
+            minWidth: 360,
+          },
+        },
+        md5sum: {
+          title: '文件MD5',
+          search: {
+            disabled: true,
+          },
+          column: {
+            minWidth: 300,
+          },
+          form: {
+            disabled: false
+          },
+        },
+        mime_type: {
+          title: '文件类型',
+          type: 'input',
+          form: {
+            show: false,
+          },
+          column: {
+            minWidth: 160
+          }
+        },
+        file_type: {
+          title: '文件类型',
+          type: 'dict-select',
+          dict: dict({
+            data: [
+              { label: '图片', value: 0, color: 'success' },
+              { label: '视频', value: 1, color: 'warning' },
+              { label: '音频', value: 2, color: 'danger' },
+              { label: '其他', value: 3, color: 'primary' },
+            ]
+          }),
+          column: {
+            show: false
+          },
+          search: {
+            show: true
+          },
+          form: {
+            show: false,
+            component: {
+              placeholder: '请选择文件类型'
+            }
+          }
+        },
+        size: {
+          title: '文件大小',
+          column: {
+            minWidth: 120
+          },
+          form: {
+            show: false
+          }
+        },
+        upload_method: {
+          title: '上传方式',
+          type: 'dict-select',
+          dict: dict({
+            data: [
+              { label: '默认上传', value: 0, color: 'primary' },
+              { label: '文件选择器上传', value: 1, color: 'warning' },
+            ]
+          }),
+          column: {
+            minWidth: 140
+          },
+          search: {
+            show: true
+          }
+        },
+        create_datetime: {
+          title: '创建时间',
+          column: {
+            minWidth: 160
+          },
+          form: {
+            show: false
+          }
+        },
+        fileselectortest: {
+          title: '文件选择器测试',
+          type: 'file-selector',
+          column: {
+            minWidth: 200
+          },
+          form: {
+            component: {
+              name: fileSelector,
+              vModel: 'modelValue',
+              tabsShow: 0b1111,
+              itemSize: 100,
+              multiple: true,
+              selectable: true,
+              showInput: true,
+              inputType: 'image',
+              valueKey: 'url',
+            }
+          }
+        }
+      },
+    },
+  };
 };