feat(generator): 代码生成、预览支持批量

continew-org · Dec 12, 2024 · f292db5 · f292db5
1 parent 7f503f3
commit f292db5
Show file tree

Hide file tree

Showing 4 changed files with 50 additions and 13 deletions.
diff --git a/src/apis/code/generator.ts b/src/apis/code/generator.ts
@@ -27,8 +27,8 @@ export function saveGenConfig(tableName: string, req: T.GeneratorConfigResp) {
 }
 
 /** @desc 生成预览 */
-export function genPreview(tableName: string) {
-  return http.get<T.GeneratePreviewResp[]>(`${BASE_URL}/preview/${tableName}`)
+export function genPreview(tableNames: Array<string>) {
+  return http.get<T.GeneratePreviewResp[]>(`${BASE_URL}/preview/${tableNames}`)
 }
 
 /** @desc 生成代码 */

diff --git a/src/components/GiTable/index.vue b/src/components/GiTable/index.vue
@@ -72,6 +72,9 @@
         </a-tooltip>
       </a-space>
     </a-row>
+    <a-row class="gi-table__toolbar-bottom">
+      <slot name="toolbar-bottom"></slot>
+    </a-row>
     <div class="gi-table__body" :class="`gi-table__body-pagination-${attrs['page-position']}`">
       <div class="gi-table__container">
         <a-table
@@ -128,6 +131,7 @@ defineSlots<{
   'top': () => void
   'toolbar-left': () => void
   'toolbar-right': () => void
+  'toolbar-bottom': () => void
   [propsName: string]: (props: { key: string, record: T, column: TableColumnData, rowIndex: number }) => void
 }>()
 
@@ -364,6 +368,10 @@ defineExpose({ tableRef })
     :deep(.arco-form-layout-inline .arco-form-item) {
       margin-bottom: 0;
     }
+
+    &-bottom {
+      margin-bottom: 8px;
+    }
   }
 
   &__draggable {

diff --git a/src/views/code/generator/GenPreviewModal.vue b/src/views/code/generator/GenPreviewModal.vue
@@ -1,7 +1,7 @@
 <template>
   <a-modal v-model:visible="visible" width="90%" :footer="false">
     <template #title>
-      {{ `生成 ${previewTableName} 表预览` }}
+      {{ previewTableNames.length === 1 ? `生成 ${previewTableNames[0]} 表预览` : '批量生成预览' }}
       <a-link v-permission="['code:generator:generate']" style="margin-left: 10px" icon @click="onDownload">下载源码</a-link>
     </template>
     <div class="preview-content">
@@ -71,13 +71,13 @@ import { Message, type TreeNodeData } from '@arco-design/web-vue'
 import { useClipboard } from '@vueuse/core'
 import { type GeneratePreviewResp, genPreview } from '@/apis/code/generator'
 
-const emit = defineEmits<{ (e: 'generate', tableNames: string[]): void }>()
+const emit = defineEmits<{ (e: 'generate', previewTableNames: string[]): void }>()
 const { copy, copied } = useClipboard()
 
 const genPreviewList = ref<GeneratePreviewResp[]>([])
 const currentPreview = ref<GeneratePreviewResp>()
 const visible = ref(false)
-const previewTableName = ref<string>('')
+const previewTableNames = ref<string[]>([])
 const treeRef = ref()
 const treeData = ref<TreeNodeData[]>([])
 // 合并目录
@@ -128,7 +128,7 @@ const assembleTree = (genPreview: GeneratePreviewResp) => {
 
 // 下载
 const onDownload = () => {
-  emit('generate', [previewTableName.value])
+  emit('generate', [previewTableNames.value])
 }
 // 校验文件类型
 const checkFileType = (title: string, type: string) => {
@@ -160,10 +160,10 @@ const onSelectPreview = (keys: (string | number)[]) => {
 }
 
 // 打开
-const onOpen = async (tableName: string) => {
+const onOpen = async (tableNames: Array<string>) => {
   treeData.value = []
-  previewTableName.value = tableName
-  const { data } = await genPreview(tableName)
+  previewTableNames.value = tableNames
+  const { data } = await genPreview(tableNames)
   genPreviewList.value = data
   for (const genPreview of genPreviewList.value) {
     assembleTree(genPreview)

diff --git a/src/views/code/generator/index.vue b/src/views/code/generator/index.vue
@@ -1,6 +1,7 @@
 <template>
   <div class="table-page">
     <GiTable
+      v-model:selectedKeys="selectedKeys"
       title="代码生成"
       row-key="tableName"
       :data="dataList"
@@ -10,6 +11,9 @@
       :pagination="pagination"
       :disabled-tools="['size', 'setting']"
       :disabled-column-keys="['tableName']"
+      :row-selection="{ type: 'checkbox', showCheckedAll: true }"
+      @select="select"
+      @select-all="selectAll"
       @refresh="search"
     >
       <template #toolbar-left>
@@ -19,14 +23,31 @@
           <template #default>重置</template>
         </a-button>
       </template>
+      <template #toolbar-right>
+        <a-button type="primary" :disabled="!selectedKeys.length" :title="!selectedKeys.length ? '请选择' : ''" @click="onPreview(selectedKeys)">
+          <template #icon><icon-code-sandbox /></template>
+          <template #default>批量生成</template>
+        </a-button>
+      </template>
+      <template #toolbar-bottom>
+        <a-alert>
+          <template v-if="selectedKeys.length > 0">
+            已选中 {{ selectedKeys.length }} 条记录(可跨页)
+          </template>
+          <template v-else>未选中任何记录</template>
+          <template v-if="selectedKeys.length > 0" #action>
+            <a-link @click="onClearSelected">清空</a-link>
+          </template>
+        </a-alert>
+      </template>
       <template #action="{ record }">
         <a-space>
           <a-link v-permission="['code:generator:config']" title="配置" @click="onConfig(record.tableName, record.comment)">配置</a-link>
           <a-link
             v-permission="['code:generator:preview']"
             :disabled="!record.createTime"
             :title="record.createTime ? '生成' : '请先进行生成配置'"
-            @click="onPreview(record.tableName)"
+            @click="onPreview([record.tableName])"
           >
             生成
           </a-link>
@@ -57,8 +78,11 @@ const {
   tableData: dataList,
   loading,
   pagination,
+  selectedKeys,
+  select,
+  selectAll,
   search,
-} = useTable((page) => listGenConfig({ ...queryForm, ...page }), { immediate: true })
+} = useTable((page) => listGenConfig({ ...queryForm, ...page }), { immediate: true, formatResult: (data) => data.map((i) => ({ ...i, disabled: !i.createTime })) })
 const columns: TableInstanceColumns[] = [
   {
     title: '序号',
@@ -83,6 +107,11 @@ const reset = () => {
   search()
 }
 
+// 清空所有选中数据
+const onClearSelected = () => {
+  selectedKeys.value = []
+}
+
 const GenConfigDrawerRef = ref<InstanceType<typeof GenConfigDrawer>>()
 // 配置
 const onConfig = (tableName: string, comment: string) => {
@@ -91,8 +120,8 @@ const onConfig = (tableName: string, comment: string) => {
 
 const GenPreviewModalRef = ref<InstanceType<typeof GenPreviewModal>>()
 // 预览
-const onPreview = (tableName: string) => {
-  GenPreviewModalRef.value?.onOpen(tableName)
+const onPreview = (tableNames: Array<string>) => {
+  GenPreviewModalRef.value?.onOpen(tableNames)
 }
 
 // 生成