diff --git a/src/components/XModal/src/XModal.vue b/src/components/XModal/src/XModal.vue
index c397edd9..95b9f4be 100644
--- a/src/components/XModal/src/XModal.vue
+++ b/src/components/XModal/src/XModal.vue
@@ -12,7 +12,9 @@ const props = defineProps({
   height: propTypes.string,
   minWidth: propTypes.string.def('460'),
   minHeight: propTypes.string.def('320'),
-  showFooter: propTypes.bool.def(true)
+  showFooter: propTypes.bool.def(true),
+  maskClosable: propTypes.bool.def(false),
+  escClosable: propTypes.bool.def(false)
 })
 
 const getBindValue = computed(() => {
diff --git a/src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue b/src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue
index 977e945d..e16857ec 100644
--- a/src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue
+++ b/src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue
@@ -190,12 +190,12 @@
     </div>
     <XModal title="预览" width="80%" height="90%" v-model="previewModelVisible" destroy-on-close>
       <!-- append-to-body -->
-      <pre v-highlight>
-            <code class="hljs">
-            <!-- 高亮代码块 -->
-            {{ previewResult }}
-            </code>
-        </pre>
+      <div v-highlight>
+        <code class="hljs">
+          <!-- 高亮代码块 -->
+          {{ previewResult }}
+        </code>
+      </div>
       <!-- <pre>
         <code class="hljs" v-html="highlightedCode(previewType, previewResult)"></code>
       </pre> -->
diff --git a/src/views/bpm/definition/definition.data.ts b/src/views/bpm/definition/definition.data.ts
index 919cbd9c..14a0c319 100644
--- a/src/views/bpm/definition/definition.data.ts
+++ b/src/views/bpm/definition/definition.data.ts
@@ -17,23 +17,29 @@ const crudSchemas = reactive<VxeCrudSchema>({
       title: '定义名称',
       field: 'name',
       table: {
-        width: 120,
+        // width: 120,
         slots: {
           default: 'name_default'
         }
       }
     },
     {
-      title: '流程分类',
+      title: '定义分类',
       field: 'category',
-      dictType: DICT_TYPE.BPM_MODEL_CATEGORY,
-      dictClass: 'number'
+      // dictType: DICT_TYPE.BPM_MODEL_CATEGORY,
+      // dictClass: 'number',
+      table: {
+        // width: 120,
+        slots: {
+          default: 'category_default'
+        }
+      }
     },
     {
       title: '表单信息',
       field: 'formId',
       table: {
-        width: 120,
+        // width: 200,
         slots: {
           default: 'formId_default'
         }
@@ -43,7 +49,7 @@ const crudSchemas = reactive<VxeCrudSchema>({
       title: '流程版本',
       field: 'version',
       table: {
-        width: 80,
+        // width: 80,
         slots: {
           default: 'version_default'
         }
@@ -53,7 +59,7 @@ const crudSchemas = reactive<VxeCrudSchema>({
       title: '激活状态',
       field: 'suspensionState',
       table: {
-        width: 80,
+        // width: 80,
         slots: {
           default: 'suspensionState_default'
         }
@@ -63,10 +69,10 @@ const crudSchemas = reactive<VxeCrudSchema>({
       title: '部署时间',
       field: 'deploymentTime',
       isForm: false,
-      formatter: 'formatDate',
-      table: {
-        width: 180
-      }
+      formatter: 'formatDate'
+      // table: {
+      // width: 180
+      // }
     }
   ]
 })
diff --git a/src/views/bpm/definition/index.vue b/src/views/bpm/definition/index.vue
index 19a7cf06..f2ef640c 100644
--- a/src/views/bpm/definition/index.vue
+++ b/src/views/bpm/definition/index.vue
@@ -6,6 +6,10 @@
       <template #name_default="{ row }">
         <XTextButton :title="row.name" @click="handleBpmnDetail(row.id)" />
       </template>
+      <!-- 流程分类 -->
+      <template #category_default="{ row }">
+        <DictTag :type="DICT_TYPE.BPM_MODEL_CATEGORY" :value="Number(row?.category)" />
+      </template>
       <!-- 表单信息 -->
       <template #formId_default="{ row }">
         <XTextButton
@@ -43,6 +47,16 @@
         v-if="formDetailVisible"
       />
     </XModal>
+    <!-- 流程模型图的预览 -->
+    <XModal title="流程图" v-model="showBpmnOpen" width="80%" height="90%">
+      <my-process-viewer
+        key="designer"
+        v-model="bpmnXML"
+        :value="bpmnXML"
+        v-bind="bpmnControlForm"
+        :prefix="bpmnControlForm.prefix"
+      />
+    </XModal>
   </ContentWrap>
 </template>
 <script setup lang="ts">
@@ -51,8 +65,14 @@ import * as DefinitionApi from '@/api/bpm/definition'
 // import * as ModelApi from '@/api/bpm/model'
 import { allSchemas } from './definition.data'
 import { setConfAndFields2 } from '@/utils/formCreate'
+import { DICT_TYPE } from '@/utils/dict'
 
-const message = useMessage() // 消息弹窗
+const bpmnXML = ref(null)
+const showBpmnOpen = ref(false)
+const bpmnControlForm = ref({
+  prefix: 'flowable'
+})
+// const message = useMessage() // 消息弹窗
 const router = useRouter() // 路由
 const { query } = useRoute() // 查询参数
 
@@ -89,7 +109,13 @@ const handleFormDetail = async (row) => {
 const handleBpmnDetail = (row) => {
   // TODO 芋艿：流程组件开发中
   console.log(row)
-  message.success('流程组件开发中，预计 2 月底完成')
+  DefinitionApi.getProcessDefinitionBpmnXMLApi(row).then((response) => {
+    console.log(response, 'response')
+    bpmnXML.value = response
+    // 弹窗打开
+    showBpmnOpen.value = true
+  })
+  // message.success('流程组件开发中，预计 2 月底完成')
 }
 
 // 点击任务分配按钮
@@ -97,7 +123,7 @@ const handleAssignRule = (row) => {
   router.push({
     name: 'BpmTaskAssignRuleList',
     query: {
-      modelId: row.id
+      processDefinitionId: row.id
     }
   })
 }
diff --git a/src/views/bpm/group/index.vue b/src/views/bpm/group/index.vue
index 7aa2ca4a..b0f08516 100644
--- a/src/views/bpm/group/index.vue
+++ b/src/views/bpm/group/index.vue
@@ -43,7 +43,7 @@
     </XTable>
   </ContentWrap>
 
-  <XModal v-model="dialogVisible" :title="dialogTitle">
+  <XModal v-model="dialogVisible" :title="dialogTitle" :mask-closable="false">
     <!-- 对话框(添加 / 修改) -->
     <Form
       v-if="['create', 'update'].includes(actionType)"
diff --git a/src/views/bpm/model/index.vue b/src/views/bpm/model/index.vue
index 5fafb960..298b0b6e 100644
--- a/src/views/bpm/model/index.vue
+++ b/src/views/bpm/model/index.vue
@@ -24,6 +24,10 @@
       <template #name_default="{ row }">
         <XTextButton :title="row.name" @click="handleBpmnDetail(row.id)" />
       </template>
+      <!-- 流程分类 -->
+      <template #category_default="{ row }">
+        <DictTag :type="DICT_TYPE.BPM_MODEL_CATEGORY" :value="Number(row?.category)" />
+      </template>
       <!-- 表单信息 -->
       <template #formId_default="{ row }">
         <XTextButton
@@ -429,6 +433,11 @@ const handleUpdate = async (rowId: number) => {
   await setDialogTile('edit')
   // 设置数据
   saveForm.value = await ModelApi.getModelApi(rowId)
+  if (saveForm.value.category == null) {
+    saveForm.value.category = 1
+  } else {
+    saveForm.value.category = Number(saveForm.value.category)
+  }
 }
 
 // 提交按钮
diff --git a/src/views/bpm/model/model.data.ts b/src/views/bpm/model/model.data.ts
index ebbc5b87..89e886cc 100644
--- a/src/views/bpm/model/model.data.ts
+++ b/src/views/bpm/model/model.data.ts
@@ -44,7 +44,12 @@ const crudSchemas = reactive<VxeCrudSchema>({
       field: 'category',
       dictType: DICT_TYPE.BPM_MODEL_CATEGORY,
       dictClass: 'number',
-      isSearch: true
+      isSearch: true,
+      table: {
+        slots: {
+          default: 'category_default'
+        }
+      }
     },
     {
       title: '表单信息',
diff --git a/src/views/bpm/processInstance/index.vue b/src/views/bpm/processInstance/index.vue
index d2f81753..6cba9eaf 100644
--- a/src/views/bpm/processInstance/index.vue
+++ b/src/views/bpm/processInstance/index.vue
@@ -7,7 +7,7 @@
         <XButton
           type="primary"
           preIcon="ep:zoom-in"
-          title="新建流程"
+          title="发起流程"
           v-hasPermi="['bpm:process-instance:query']"
           @click="handleCreate"
         />
diff --git a/src/views/bpm/taskAssignRule/index.vue b/src/views/bpm/taskAssignRule/index.vue
index f93e4591..e6e4b88f 100644
--- a/src/views/bpm/taskAssignRule/index.vue
+++ b/src/views/bpm/taskAssignRule/index.vue
@@ -45,9 +45,9 @@
           <el-select v-model="formData.roleIds" multiple clearable style="width: 100%">
             <el-option
               v-for="item in roleOptions"
-              :key="parseInt(item.id)"
+              :key="item.id"
               :label="item.name"
-              :value="parseInt(item.id)"
+              :value="item.id"
             />
           </el-select>
         </el-form-item>
diff --git a/src/views/system/user/user.data.ts b/src/views/system/user/user.data.ts
index c5b617c3..12c777fc 100644
--- a/src/views/system/user/user.data.ts
+++ b/src/views/system/user/user.data.ts
@@ -5,7 +5,14 @@ const { t } = useI18n()
 export const rules = reactive({
   username: [required],
   nickname: [required],
-  email: [required],
+  email: [
+    { required: true, message: t('profile.rules.mail'), trigger: 'blur' },
+    {
+      type: 'email',
+      message: t('profile.rules.truemail'),
+      trigger: ['blur', 'change']
+    }
+  ],
   status: [required],
   mobile: [
     {