diff --git a/apps/web-antd/src/views/workflow/processDefinition/index.vue b/apps/web-antd/src/views/workflow/processDefinition/index.vue
index 84105524..ef86cb9f 100644
--- a/apps/web-antd/src/views/workflow/processDefinition/index.vue
+++ b/apps/web-antd/src/views/workflow/processDefinition/index.vue
@@ -26,6 +26,7 @@ import CategoryTree from './category-tree.vue';
 import { ActivityStatusEnum } from './constant';
 import { columns, querySchema } from './data';
 import processDefinitionDeployModal from './process-definition-deploy-modal.vue';
+import processDefinitionHistoryModal from './process-definition-history-modal.vue';
 import processDefinitionModal from './process-definition-modal.vue';
 
 // 左边部门用
@@ -137,12 +138,16 @@ async function handleActive(row: any) {
   await tableApi.query();
 }
 
+const [ProcessDefinitionHistoryModal, historyModalApi] = useVbenModal({
+  connectedComponent: processDefinitionHistoryModal,
+});
 /**
  * 历史版本
- * @param _row row
+ * @param row row
  */
-function handleHistory(_row: any) {
-  message.info('暂未开放');
+function handleHistory(row: any) {
+  historyModalApi.setData({ flowCode: row.flowCode });
+  historyModalApi.open();
 }
 
 /**
@@ -328,5 +333,6 @@ function handleDeploy() {
     </div>
     <ProcessDefinitionModal @reload="() => tableApi.reload()" />
     <ProcessDefinitionDeployModal @reload="() => tableApi.reload()" />
+    <ProcessDefinitionHistoryModal />
   </Page>
 </template>
diff --git a/apps/web-antd/src/views/workflow/processDefinition/process-definition-history-modal.vue b/apps/web-antd/src/views/workflow/processDefinition/process-definition-history-modal.vue
new file mode 100644
index 00000000..d5ae375a
--- /dev/null
+++ b/apps/web-antd/src/views/workflow/processDefinition/process-definition-history-modal.vue
@@ -0,0 +1,62 @@
+<script setup lang="ts">
+import { useVbenModal } from '@vben/common-ui';
+import { useVbenVxeGrid, type VxeGridProps } from '@vben/plugins/vxe-table';
+
+import { getHisListByKey } from '#/api/workflow/definition';
+
+import { columns } from './data';
+
+const [BasicModal, modalApi] = useVbenModal({
+  title: '历史版本',
+  class: 'w-[1000px]',
+  footer: false,
+  async onOpenChange(isOpen) {
+    if (!isOpen) {
+      return null;
+    }
+    const { flowCode } = modalApi.getData() as { flowCode: string };
+    const resp = await getHisListByKey(flowCode);
+    // eslint-disable-next-line no-use-before-define
+    await tableApi.grid.loadData(resp);
+  },
+});
+
+const gridOptions: VxeGridProps = {
+  checkboxConfig: {
+    // 高亮
+    highlight: true,
+    // 翻页时保留选中状态
+    reserve: true,
+    // 点击行选中
+    trigger: 'default',
+  },
+  columns: columns?.filter((item) => item.type !== 'checkbox'),
+  height: 600,
+  keepSource: true,
+  pagerConfig: {
+    enabled: false,
+  },
+  rowConfig: {
+    isHover: true,
+    keyField: 'id',
+    height: 100,
+  },
+  toolbarConfig: {
+    custom: false,
+    zoom: false,
+    refresh: false,
+  },
+  id: 'workflow-definition-history',
+};
+
+const [BasicTable, tableApi] = useVbenVxeGrid({
+  gridOptions,
+});
+</script>
+
+<template>
+  <BasicModal>
+    <!-- TODO: 添加操作列 -->
+    <BasicTable />
+  </BasicModal>
+</template>