geg-gas-web/src/views/system/jarInfo/components/HistoryVersionModal.vue

<template>
    <BasicModal
        v-bind="$attrs"
        @register="registerModal"
        title="历史版本"
        width="1000px"
        :canFullscreen="false"
        :showOkBtn="false"
        :showCancelBtn="false"
    >
        <BasicTable @register="registerTable">
            <template #action="{ record }">
                <TableAction
                    :actions="[
                        {
                            label: '下载',
                            onClick: handleDownload.bind(null, record)
                        }
                    ]"
                />
            </template>
        </BasicTable>
    </BasicModal>
</template>
<script lang="ts">
    import { defineComponent } from 'vue';
    import { BasicModal, useModalInner } from '/@/components/Modal';
    import { BasicTable, useTable, TableAction, BasicColumn } from '/@/components/Table';
    import { getJarHistoryVersionPageList, downloadJar, JarHistoryVersion } from '/@/api/system/jarInfo';
    import { useMessage } from '/@/hooks/web/useMessage';
    import { Tag } from 'ant-design-vue';
    import { h } from 'vue';

    export const columns: BasicColumn[] = [
        {
            title: '名称',
            dataIndex: 'name',
            width: 200,
            align: 'left'
        },
        {
            title: '版本',
            dataIndex: 'vs',
            width: 120,
            align: 'left'
        },
        {
            title: '是否开发包',
            dataIndex: 'custom',
            width: 120,
            align: 'left',
            customRender: ({ record }) => {
                const isCustom = record.custom === 'Y';
                const color = isCustom ? 'blue' : 'default';
                const text = isCustom ? '是' : '否';
                return h(Tag, { color: color }, () => text);
            }
        },
        {
            title: '是否boot开始',
            dataIndex: 'bootStart',
            width: 120,
            align: 'left',
            customRender: ({ record }) => {
                const isBoot = record.bootStart === 'Y';
                const color = isBoot ? 'green' : 'default';
                const text = isBoot ? '是' : '否';
                return h(Tag, { color: color }, () => text);
            }
        },
        {
            title: '是否活跃',
            dataIndex: 'active',
            width: 100,
            align: 'left',
            customRender: ({ record }) => {
                const isActive = record.active === 'Y';
                const color = isActive ? 'green' : 'default';
                const text = isActive ? '是' : '否';
                return h(Tag, { color: color }, () => text);
            }
        },
        {
            title: 'jar库列表',
            dataIndex: 'libs',
            width: 150,
            align: 'left'
        },
        {
            title: '环境',
            dataIndex: 'env',
            width: 100,
            align: 'left'
        },
        {
            title: '创建时间',
            dataIndex: 'createTime',
            width: 180,
            align: 'left'
        }
    ];

    export default defineComponent({
        name: 'HistoryVersionModal',
        components: { BasicModal, BasicTable, TableAction },
        emits: ['success', 'register'],
        setup() {
            const { createMessage } = useMessage();
            let currentJarId = '';

            const [registerTable, { reload }] = useTable({
                api: getJarHistoryVersionPageList,
                rowKey: 'id',
                columns,
                useSearchForm: false,
                showTableSetting: false,
                striped: false,
                pagination: true,
                actionColumn: {
                    width: 100,
                    title: '操作',
                    dataIndex: 'action',
                    slots: { customRender: 'action' }
                }
            });

            const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
                currentJarId = data.jarId || '';
                setModalProps({ 
                    confirmLoading: false,
                    title: `历史版本 - ${data.jarName || ''}`
                });
                reload({ 
                    searchInfo: { jarId: currentJarId },
                    page: 1 
                });
            });

            async function handleDownload(record: JarHistoryVersion) {
                try {
                    const res = await downloadJar(record.id!);
                    // 创建下载链接
                    const blob = new Blob([res as any]);
                    const url = window.URL.createObjectURL(blob);
                    const link = document.createElement('a');
                    link.href = url;
                    link.download = `${record.name}-${record.vs}.jar`;
                    link.click();
                    window.URL.revokeObjectURL(url);
                    createMessage.success('下载成功');
                } catch (error) {
                    createMessage.error('下载失败');
                }
            }

            return {
                registerModal,
                registerTable,
                handleDownload
            };
        }
    });
</script>
<style lang="less" scoped>
</style>