diff --git a/web/src/utils/columnPermission.ts b/web/src/utils/columnPermission.ts
index 7ef06de0ba44a26f93a4a4b709697964ff3b4863..adff4e1fef8c539e3dba8e6fe8e79a5f26439e73 100644
--- a/web/src/utils/columnPermission.ts
+++ b/web/src/utils/columnPermission.ts
@@ -22,7 +22,7 @@ export const handleColumnPermission = async (func: Function, crudOptions: any,ex
 		}
 	}
 	const columns = crudOptions.columns;
-	const excludeColumns = ['_index','id', 'create_datetime', 'update_datetime'].concat(excludeColumn)
+	const excludeColumns = ['checked','_index','id', 'create_datetime', 'update_datetime'].concat(excludeColumn)
 	for (let col in columns) {
 		for (let item of res.data) {
 			if (excludeColumns.includes(item.field_name)) {
diff --git a/web/src/views/system/menu/components/MenuButtonCom/api.ts b/web/src/views/system/menu/components/MenuButtonCom/api.ts
index d91f920b5bbbb0d7ff96bf5ba86d1fd04418f5a9..612c49d2121e8638cd286b372c68c606671057cf 100644
--- a/web/src/views/system/menu/components/MenuButtonCom/api.ts
+++ b/web/src/views/system/menu/components/MenuButtonCom/api.ts
@@ -48,3 +48,10 @@ export function BatchAdd(obj: AddReq) {
 	});
 }
 
+export function BatchDelete(keys: any) {
+	return request({
+		url: apiPrefix + 'multiple_delete/',
+		method: 'delete',
+		data: { keys },
+	});
+}
diff --git a/web/src/views/system/menu/components/MenuButtonCom/crud.tsx b/web/src/views/system/menu/components/MenuButtonCom/crud.tsx
index 908cf2a97582582d4ceed75b235af1c68e024a3b..79675fba30975199db2fc467e36ccfa9e1e27a44 100644
--- a/web/src/views/system/menu/components/MenuButtonCom/crud.tsx
+++ b/web/src/views/system/menu/components/MenuButtonCom/crud.tsx
@@ -4,6 +4,8 @@ import {auth} from '/@/utils/authFunction'
 import {request} from '/@/utils/service';
 import { successNotification } from '/@/utils/message';
 import { ElMessage } from 'element-plus';
+import { nextTick, ref } from 'vue';
+import XEUtils from 'xe-utils';
 //此处为crudOptions配置
 export const createCrudOptions = function ({crudExpose, context}: CreateCrudOptionsProps): CreateCrudOptionsRet {
     const pageRequest = async () => {
@@ -22,7 +24,42 @@ export const createCrudOptions = function ({crudExpose, context}: CreateCrudOpti
     const addRequest = async ({form}: AddReq) => {
         return await api.AddObj({...form, ...{menu: context!.selectOptions.value.id}});
     };
+    // 记录选中的行
+	const selectedRows = ref<any>([]);
+
+	const onSelectionChange = (changed: any) => {
+		const tableData = crudExpose.getTableData();
+		const unChanged = tableData.filter((row: any) => !changed.includes(row));
+		// 添加已选择的行
+		XEUtils.arrayEach(changed, (item: any) => {
+			const ids = XEUtils.pluck(selectedRows.value, 'id');
+			if (!ids.includes(item.id)) {
+				selectedRows.value = XEUtils.union(selectedRows.value, [item]);
+			}
+		});
+		// 剔除未选择的行
+		XEUtils.arrayEach(unChanged, (unItem: any) => {
+			selectedRows.value = XEUtils.remove(selectedRows.value, (item: any) => item.id !== unItem.id);
+		});
+	};
+	const toggleRowSelection = () => {
+		// 多选后，回显默认勾选
+		const tableRef = crudExpose.getBaseTableRef();
+		const tableData = crudExpose.getTableData();
+		const selected = XEUtils.filter(tableData, (item: any) => {
+			const ids = XEUtils.pluck(selectedRows.value, 'id');
+			return ids.includes(item.id);
+		});
+
+		nextTick(() => {
+			XEUtils.arrayEach(selected, (item) => {
+				tableRef.toggleRowSelection(item, true);
+			});
+		});
+	};
+    
     return {
+        selectedRows,
         crudOptions: {
             pagination:{
                 show:false
@@ -84,6 +121,11 @@ export const createCrudOptions = function ({crudExpose, context}: CreateCrudOpti
                 editRequest,
                 delRequest,
             },
+            table: {
+				rowKey: 'id', //设置你的主键id， 默认rowKey=id
+				onSelectionChange,
+				onRefreshed: () => toggleRowSelection(),
+			},
             form: {
                 col: {span: 24},
                 labelWidth: '100px',
@@ -93,6 +135,16 @@ export const createCrudOptions = function ({crudExpose, context}: CreateCrudOpti
                 },
             },
             columns: {
+                $checked: {
+					title: '选择',
+					form: { show: false },
+					column: {
+						type: 'selection',
+						align: 'center',
+						width: '70px',
+						columnSetDisabled: true, //禁止在列设置中选择
+					},
+				},
                 _index: {
                     title: '序号',
                     form: {show: false},
diff --git a/web/src/views/system/menu/components/MenuButtonCom/index.vue b/web/src/views/system/menu/components/MenuButtonCom/index.vue
index 9dddaf9453492946029c2a30ad91d2f00ab04ed4..ec55e358a7b8ff81b746a52693060af8627f5206 100644
--- a/web/src/views/system/menu/components/MenuButtonCom/index.vue
+++ b/web/src/views/system/menu/components/MenuButtonCom/index.vue
@@ -1,19 +1,72 @@
 <template>
-	<fs-crud ref="crudRef"  v-bind="crudBinding"> </fs-crud>
+	<fs-crud ref="crudRef"  v-bind="crudBinding"> 
+		<template #pagination-left>
+				<el-tooltip content="批量删除">
+					<el-button text type="danger" :disabled="selectedRowsCount === 0" :icon="Delete" circle @click="handleBatchDelete" />
+				</el-tooltip>
+			</template>
+			<template #pagination-right>
+				<el-popover placement="top" :width="400" trigger="click">
+					<template #reference>
+						<el-button text :type="selectedRowsCount > 0 ? 'primary' : ''">已选中{{ selectedRowsCount }}条数据</el-button>
+					</template>
+					<el-table :data="selectedRows" size="small">
+						<el-table-column width="150" property="id" label="id" />
+						<el-table-column fixed="right" label="操作" min-width="60">
+							<template #default="scope">
+								<el-button text type="info" :icon="Close" @click="removeSelectedRows(scope.row)" circle />
+							</template>
+						</el-table-column>
+					</el-table>
+				</el-popover>
+			</template>
+	</fs-crud>
 </template>
 
 <script lang="ts" setup>
-import { ref } from 'vue';
+import { computed, ref } from 'vue';
 import { useFs } from '@fast-crud/fast-crud';
 import { createCrudOptions } from './crud';
 import { MenuTreeItemType } from '../../types';
-
+import { ElMessage, ElMessageBox } from 'element-plus';
+import XEUtils from 'xe-utils';
+import { BatchDelete } from './api';
+import { Close, Delete } from '@element-plus/icons-vue';
 // 当前选择的菜单信息
 let selectOptions: any = ref({ name: null });
 
-const { crudRef, crudBinding, crudExpose, context } = useFs({ createCrudOptions, context: { selectOptions } });
+const { crudRef, crudBinding, crudExpose, context,selectedRows } = useFs({ createCrudOptions, context: { selectOptions } });
 const { doRefresh, setTableData } = crudExpose;
 
+// 选中行的条数
+const selectedRowsCount = computed(() => {
+	return selectedRows.value.length;
+});
+
+// 批量删除
+const handleBatchDelete = async () => {
+	await ElMessageBox.confirm(`确定要批量删除这${selectedRows.value.length}条记录吗`, '确认', {
+		distinguishCancelAndClose: true,
+		confirmButtonText: '确定',
+		cancelButtonText: '取消',
+		closeOnClickModal: false,
+	});
+	await BatchDelete(XEUtils.pluck(selectedRows.value, 'id'));
+	ElMessage.info('删除成功');
+	selectedRows.value = [];
+	await crudExpose.doRefresh();
+};
+
+// 移除已选中的行
+const removeSelectedRows = (row: any) => {
+	const tableRef = crudExpose.getBaseTableRef();
+	const tableData = crudExpose.getTableData();
+	if (XEUtils.pluck(tableData, 'id').includes(row.id)) {
+		tableRef.toggleRowSelection(row, false);
+	} else {
+		selectedRows.value = XEUtils.remove(selectedRows.value, (item: any) => item.id !== row.id);
+	}
+};
 const handleRefreshTable = (record: MenuTreeItemType) => {
 	if (!record.is_catalog && record.id) {
 		selectOptions.value = record;
diff --git a/web/src/views/system/menu/components/MenuFieldCom/api.ts b/web/src/views/system/menu/components/MenuFieldCom/api.ts
index eccde555888af1ca0ec405e3204a118ef764e3ca..e480b5a1f6a5d34275b59c75fef5f132a25a3fa5 100644
--- a/web/src/views/system/menu/components/MenuFieldCom/api.ts
+++ b/web/src/views/system/menu/components/MenuFieldCom/api.ts
@@ -42,6 +42,13 @@ export function DelObj(id: DelReq) {
 	});
 }
 
+export function BatchDelete(keys: any) {
+	return request({
+		url: apiPrefix + 'multiple_delete/',
+		method: 'delete',
+		data: { keys },
+	});
+}
 /**
  * 获取所有model
  */
diff --git a/web/src/views/system/menu/components/MenuFieldCom/crud.tsx b/web/src/views/system/menu/components/MenuFieldCom/crud.tsx
index 879f7092f6542b65d7021fa49d9dd014eb6d908d..3ba1e622ded392964fccf631f13949f8b0d8e681 100644
--- a/web/src/views/system/menu/components/MenuFieldCom/crud.tsx
+++ b/web/src/views/system/menu/components/MenuFieldCom/crud.tsx
@@ -2,8 +2,9 @@ import * as api from './api';
 import { dict, UserPageQuery, AddReq, DelReq, EditReq, compute, CreateCrudOptionsProps, CreateCrudOptionsRet } from '@fast-crud/fast-crud';
 import { request } from '/@/utils/service';
 import { dictionary } from '/@/utils/dictionary';
-import { inject } from 'vue';
+import { inject, nextTick, ref } from 'vue';
 import {auth} from "/@/utils/authFunction";
+import XEUtils from 'xe-utils';
 
 
 
@@ -27,8 +28,41 @@ export const createCrudOptions = function ({ crudExpose, props,modelDialog,selec
 		form.menu = selectOptions.value.id;
 		return await api.AddObj(form);
 	};
+// 记录选中的行
+const selectedRows = ref<any>([]);
 
+const onSelectionChange = (changed: any) => {
+	const tableData = crudExpose.getTableData();
+	const unChanged = tableData.filter((row: any) => !changed.includes(row));
+	// 添加已选择的行
+	XEUtils.arrayEach(changed, (item: any) => {
+		const ids = XEUtils.pluck(selectedRows.value, 'id');
+		if (!ids.includes(item.id)) {
+			selectedRows.value = XEUtils.union(selectedRows.value, [item]);
+		}
+	});
+	// 剔除未选择的行
+	XEUtils.arrayEach(unChanged, (unItem: any) => {
+		selectedRows.value = XEUtils.remove(selectedRows.value, (item: any) => item.id !== unItem.id);
+	});
+};
+const toggleRowSelection = () => {
+	// 多选后，回显默认勾选
+	const tableRef = crudExpose.getBaseTableRef();
+	const tableData = crudExpose.getTableData();
+	const selected = XEUtils.filter(tableData, (item: any) => {
+		const ids = XEUtils.pluck(selectedRows.value, 'id');
+		return ids.includes(item.id);
+	});
+
+	nextTick(() => {
+		XEUtils.arrayEach(selected, (item) => {
+			tableRef.toggleRowSelection(item, true);
+		});
+	});
+};
 	return {
+		selectedRows,
 		crudOptions: {
 			request: {
 				pageRequest,
@@ -77,7 +111,22 @@ export const createCrudOptions = function ({ crudExpose, props,modelDialog,selec
 					width: '600px',
 				},
 			},
+			table: {
+				rowKey: 'id', //设置你的主键id， 默认rowKey=id
+				onSelectionChange,
+				onRefreshed: () => toggleRowSelection(),
+			},
 			columns: {
+				$checked: {
+					title: '选择',
+					form: { show: false },
+					column: {
+						type: 'selection',
+						align: 'center',
+						width: '70px',
+						columnSetDisabled: true, //禁止在列设置中选择
+					},
+				},
 				_index: {
 					title: '序号',
 					form: { show: false },
diff --git a/web/src/views/system/menu/components/MenuFieldCom/index.vue b/web/src/views/system/menu/components/MenuFieldCom/index.vue
index 435ce3d9d2c0938a4a28d97a0b08ba6ca8fca8cb..d4c6d491b0b60f645065be494dcefc3a8355c1fa 100644
--- a/web/src/views/system/menu/components/MenuFieldCom/index.vue
+++ b/web/src/views/system/menu/components/MenuFieldCom/index.vue
@@ -1,137 +1,177 @@
 <template>
-  <div>
-    <el-dialog ref="modelRef" v-model="modelDialog" title="选择model">
-      <div v-show="props.model">
-        <el-tag>已选择:{{ props.model }}</el-tag>
-      </div>
-     <!-- 搜索输入框 -->
-    <el-input
-    v-model="searchQuery"
-    placeholder="搜索模型..."
-    style="margin-bottom: 10px;"
-  ></el-input>
-      <div class="model-card">
-        <!--注释编号:django-vue3-admin-index483211: 对请求回来的allModelData进行computed计算，返加搜索框匹配到的内容-->
-        <div v-for="(item,index) in filteredModelData" :value="item.key" :key="index">
-          <el-text :type="modelCheckIndex===index?'primary':''" @click="onModelChecked(item,index)">
-            {{ item.app + '--' + item.title + '(' + item.key + ')' }}
-          </el-text>
-        </div>
-      </div>
-      <template #footer>
-      <span class="dialog-footer">
-        <el-button @click="modelDialog = false">取消</el-button>
-        <el-button type="primary" @click="handleAutomatch">
-          确定
-        </el-button>
-      </span>
-      </template>
-    </el-dialog>
-    <div style="height: 80vh">
-      <fs-crud ref="crudRef" v-bind="crudBinding">
-      </fs-crud>
-
-    </div>
-  </div>
+	<div>
+		<el-dialog ref="modelRef" v-model="modelDialog" title="选择model">
+			<div v-show="props.model">
+				<el-tag>已选择:{{ props.model }}</el-tag>
+			</div>
+			<!-- 搜索输入框 -->
+			<el-input v-model="searchQuery" placeholder="搜索模型..." style="margin-bottom: 10px"></el-input>
+			<div class="model-card">
+				<!--注释编号:django-vue3-admin-index483211: 对请求回来的allModelData进行computed计算，返加搜索框匹配到的内容-->
+				<div v-for="(item, index) in filteredModelData" :value="item.key" :key="index">
+					<el-text :type="modelCheckIndex === index ? 'primary' : ''" @click="onModelChecked(item, index)">
+						{{ item.app + '--' + item.title + '(' + item.key + ')' }}
+					</el-text>
+				</div>
+			</div>
+			<template #footer>
+				<span class="dialog-footer">
+					<el-button @click="modelDialog = false">取消</el-button>
+					<el-button type="primary" @click="handleAutomatch"> 确定 </el-button>
+				</span>
+			</template>
+		</el-dialog>
+		<div style="height: 72vh">
+			<fs-crud ref="crudRef" v-bind="crudBinding">
+				<template #pagination-left>
+					<el-tooltip content="批量删除">
+						<el-button text type="danger" :disabled="selectedRowsCount === 0" :icon="Delete" circle @click="handleBatchDelete" />
+					</el-tooltip>
+				</template>
+				<template #pagination-right>
+					<el-popover placement="top" :width="400" trigger="click">
+						<template #reference>
+							<el-button text :type="selectedRowsCount > 0 ? 'primary' : ''">已选中{{ selectedRowsCount }}条数据</el-button>
+						</template>
+						<el-table :data="selectedRows" size="small">
+							<el-table-column width="150" property="id" label="id" />
+							<el-table-column fixed="right" label="操作" min-width="60">
+								<template #default="scope">
+									<el-button text type="info" :icon="Close" @click="removeSelectedRows(scope.row)" circle />
+								</template>
+							</el-table-column>
+						</el-table>
+					</el-popover>
+				</template>
+			</fs-crud>
+		</div>
+	</div>
 </template>
 
 <script lang="ts" setup>
-import {ref, onMounted, reactive, computed } from 'vue';
-import {useFs} from '@fast-crud/fast-crud';
-import {createCrudOptions} from './crud';
-import {getModelList} from './api'
-import {MenuTreeItemType} from "/@/views/system/menu/types";
-import {successMessage, successNotification, warningNotification} from '/@/utils/message';
-import {automatchColumnsData} from '/@/views/system/columns/components/ColumnsTableCom/api';
+import { ref, onMounted, reactive, computed } from 'vue';
+import { useFs } from '@fast-crud/fast-crud';
+import { createCrudOptions } from './crud';
+import { BatchDelete, getModelList } from './api';
+import { Close, Delete } from '@element-plus/icons-vue';
+import { MenuTreeItemType } from '/@/views/system/menu/types';
+import { successMessage, successNotification, warningNotification } from '/@/utils/message';
+import { automatchColumnsData } from '/@/views/system/columns/components/ColumnsTableCom/api';
+import XEUtils from 'xe-utils';
+import { ElMessage, ElMessageBox } from 'element-plus';
 // 当前选择的菜单信息
-let selectOptions: any = ref({name: null});
+let selectOptions: any = ref({ name: null });
 
 const props = reactive({
-  model: '',
-  app: '',
-  menu: ''
-})
+	model: '',
+	app: '',
+	menu: '',
+});
 
 //model弹窗
-const modelDialog = ref(false)
+const modelDialog = ref(false);
 // 获取所有model
 const allModelData = ref<any[]>([]);
-const modelCheckIndex = ref(null)
+const modelCheckIndex = ref(null);
 const onModelChecked = (row, index) => {
-  modelCheckIndex.value = index
-  props.model = row.key
-  props.app = row.app
-}
-
+	modelCheckIndex.value = index;
+	props.model = row.key;
+	props.app = row.app;
+};
 
 // 注释编号:django-vue3-admin-index083311:代码开始行
 // 功能说明:搭配搜索的处理，返回搜索结果
 const searchQuery = ref('');
 
 const filteredModelData = computed(() => {
-      if (!searchQuery.value) {
-        return allModelData.value;
-      }
-      const query = searchQuery.value.toLowerCase();
-      return allModelData.value.filter(item =>
-        item.app.toLowerCase().includes(query) ||
-        item.title.toLowerCase().includes(query) ||
-        item.key.toLowerCase().includes(query)
-      );
-    });
+	if (!searchQuery.value) {
+		return allModelData.value;
+	}
+	const query = searchQuery.value.toLowerCase();
+	return allModelData.value.filter(
+		(item) => item.app.toLowerCase().includes(query) || item.title.toLowerCase().includes(query) || item.key.toLowerCase().includes(query)
+	);
+});
 // 注释编号:django-vue3-admin-index083311:代码结束行
 
-
 /**
  * 菜单选中时,加载表格数据
  * @param record
  */
 const handleRefreshTable = (record: MenuTreeItemType) => {
-  if (!record.is_catalog && record.id) {
-    selectOptions.value = record;
-    crudExpose.doRefresh();
-  } else {
-    //清空表格数据
-    crudExpose.setTableData([]);
-  }
+	if (!record.is_catalog && record.id) {
+		selectOptions.value = record;
+		crudExpose.doRefresh();
+	} else {
+		//清空表格数据
+		crudExpose.setTableData([]);
+	}
 };
 /**
  * 自动匹配列
  */
 const handleAutomatch = async () => {
-  props.menu = selectOptions.value.id
-  modelDialog.value = false
-  if (props.menu && props.model) {
-    const res = await automatchColumnsData(props);
-    if (res?.code === 2000) {
-      successNotification('匹配成功');
-    }
-    crudExpose.doSearch({form: {menu: props.menu, model: props.model}});
-  }else {
-    warningNotification('请选择角色和模型表！');
-  }
+	props.menu = selectOptions.value.id;
+	modelDialog.value = false;
+	if (props.menu && props.model) {
+		const res = await automatchColumnsData(props);
+		if (res?.code === 2000) {
+			successNotification('匹配成功');
+		}
+		crudExpose.doSearch({ form: { menu: props.menu, model: props.model } });
+	} else {
+		warningNotification('请选择角色和模型表！');
+	}
+};
 
+// 选中行的条数
+const selectedRowsCount = computed(() => {
+	return selectedRows.value.length;
+});
+
+// 批量删除
+const handleBatchDelete = async () => {
+	await ElMessageBox.confirm(`确定要批量删除这${selectedRows.value.length}条记录吗`, '确认', {
+		distinguishCancelAndClose: true,
+		confirmButtonText: '确定',
+		cancelButtonText: '取消',
+		closeOnClickModal: false,
+	});
+	await BatchDelete(XEUtils.pluck(selectedRows.value, 'id'));
+	ElMessage.info('删除成功');
+	selectedRows.value = [];
+	await crudExpose.doRefresh();
 };
 
+// 移除已选中的行
+const removeSelectedRows = (row: any) => {
+	const tableRef = crudExpose.getBaseTableRef();
+	const tableData = crudExpose.getTableData();
+	if (XEUtils.pluck(tableData, 'id').includes(row.id)) {
+		tableRef.toggleRowSelection(row, false);
+	} else {
+		selectedRows.value = XEUtils.remove(selectedRows.value, (item: any) => item.id !== row.id);
+	}
+};
 
-const {crudBinding, crudRef, crudExpose} = useFs({createCrudOptions, props, modelDialog, selectOptions,allModelData});
+const { crudBinding, crudRef, crudExpose, selectedRows } = useFs({ createCrudOptions, props, modelDialog, selectOptions, allModelData });
 onMounted(async () => {
-  const res = await getModelList();
-  allModelData.value = res.data;
+	const res = await getModelList();
+	allModelData.value = res.data;
 });
 
-defineExpose({selectOptions, handleRefreshTable});
+defineExpose({ selectOptions, handleRefreshTable });
 </script>
 
 <style scoped lang="scss">
 .model-card {
-  margin-top: 10px;
-  height: 30vh;
-  overflow-y: scroll;
+	margin-top: 10px;
+	height: 30vh;
+	overflow-y: scroll;
 
-  div {
-    margin: 15px 0;
-    cursor: pointer;
-  }
+	div {
+		margin: 15px 0;
+		cursor: pointer;
+	}
 }
 </style>
diff --git a/web/src/views/system/menu/index.vue b/web/src/views/system/menu/index.vue
index 0637a3fe74daa0acff451f1dac15cc5f850da890..ca544a1b3d51c367edf5f78de69db9c3a6bd2205 100644
--- a/web/src/views/system/menu/index.vue
+++ b/web/src/views/system/menu/index.vue
@@ -16,12 +16,12 @@
 			<el-col :span="18">
         <el-tabs type="border-card">
           <el-tab-pane label="按钮权限配置" >
-            <div style="height: 80vh">
+            <div style="height: 72vh">
               <MenuButtonCom ref="menuButtonRef" />
             </div>
           </el-tab-pane>
           <el-tab-pane label="列权限配置">
-            <div style="height: 80vh">
+            <div style="height: 72vh">
               <MenuFieldCom ref="menuFieldRef"></MenuFieldCom>
             </div>
           </el-tab-pane>