feat: model upload

src/api/bpm/model/index.ts

@@ -1,4 +1,10 @@
+import { UploadApiResult } from '@/api/base/model/uploadModel'
+import { useGlobSetting } from '@/hooks/setting'
+import { UploadFileParams } from '@/types/axios'
 import { defHttp } from '@/utils/http/axios'
+import { AxiosProgressEvent } from 'axios'
+
+const { apiUrl = '' } = useGlobSetting()
 
 export type ProcessDefinitionVO = {
   id: string
@@ -52,3 +58,13 @@ export function deleteModel(id: number) {
 export function deployModel(id: number) {
   return defHttp.post({ url: '/bpm/model/deploy?id=' + id })
 }
+
+export function importModel(params: UploadFileParams, onUploadProgress: (progressEvent: AxiosProgressEvent) => void) {
+  return defHttp.uploadFile<UploadApiResult>(
+    {
+      url: apiUrl + '/bpm/model/import',
+      onUploadProgress
+    },
+    params
+  )
+}

src/views/bpm/model/index.vue

@@ -5,6 +5,16 @@
         <a-button type="primary" v-auth="['bpm:model:create']" :preIcon="IconEnum.ADD" @click="handleCreate">
           {{ t('action.create') }}
         </a-button>
+        <BasicUpload
+          :maxSize="20"
+          :maxNumber="1"
+          :emptyHidePreview="true"
+          @change="handleChange"
+          :uploadParams="uploadParams"
+          :api="importModel"
+          class="my-5"
+          :accept="['.bpmn', '.xml']"
+        />
       </template>
       <template #bodyCell="{ column, record }">
         <template v-if="column.key === 'action'">
@@ -31,14 +41,17 @@
   </div>
 </template>
 <script lang="ts" setup>
+import { ref } from 'vue'
 import { useI18n } from '@/hooks/web/useI18n'
 import { useMessage } from '@/hooks/web/useMessage'
 import { useModal } from '@/components/Modal'
 import ModelModal from './ModelModal.vue'
 import { IconEnum } from '@/enums/appEnum'
+import { BasicUpload } from '@/components/Upload'
 import { BasicTable, useTable, TableAction } from '@/components/Table'
-import { deleteModel, getModelPage } from '@/api/bpm/model'
+import { deleteModel, getModelPage, importModel } from '@/api/bpm/model'
 import { columns, searchFormSchema } from './model.data'
+import { getAccessToken, getTenantId } from '@/utils/auth'
 
 defineOptions({ name: 'BpmModel' })
 
@@ -46,6 +59,11 @@ const { t } = useI18n()
 const { createMessage } = useMessage()
 const [registerModal, { openModal }] = useModal()
 
+const uploadParams = ref({
+  Authorization: 'Bearer ' + getAccessToken(),
+  'tenant-id': getTenantId()
+})
+
 const [registerTable, { reload }] = useTable({
   title: '流程模型图列表',
   api: getModelPage,
@@ -69,6 +87,10 @@ function handleEdit(record: Recordable) {
   openModal(true, { record, isUpdate: true })
 }
 
+function handleChange() {
+  reload()
+}
+
 async function handleDelete(record: Recordable) {
   await deleteModel(record.id)
   createMessage.success(t('common.delSuccessText'))

src/views/bpm/model/model.data.ts

@@ -1,6 +1,7 @@
 import { getSimpleForms } from '@/api/bpm/form'
 import { updateModelState } from '@/api/bpm/model'
 import { BasicColumn, FormSchema, useRender } from '@/components/Table'
+import { useGo } from '@/hooks/web/usePage'
 import { useMessage } from '@/hooks/web/useMessage'
 import { DICT_TYPE, getDictOptions } from '@/utils/dict'
 import { Button, Switch } from 'ant-design-vue'
@@ -21,7 +22,10 @@ export const columns: BasicColumn[] = [
   {
     title: '流程名称',
     dataIndex: 'name',
-    width: 180
+    width: 180,
+    customRender: ({ record }) => {
+      return h(Button, { type: 'link', onClick: handleBpmnDetail.bind(null, record) }, () => record.formName)
+    }
   },
   {
     title: '流程分类',
@@ -209,6 +213,15 @@ export const formSchema: FormSchema[] = [
   }
 ]
 
-function handleFormDetail() {
-  console.info('handleFormDetail')
+function handleBpmnDetail() {
+  console.info('handleBpmnDetail')
+}
+
+function handleFormDetail(record: Recordable) {
+  if (record.formType === 10) {
+    console.info('handleFormDetail')
+  } else {
+    const go = useGo()
+    go({ path: record.formCustomCreatePath })
+  }
 }