yx lin
3 years ago
committed by
GitHub
GitHub
13 changed files with 685 additions and 14 deletions
@ -0,0 +1,121 @@ |
|||
import { defAbpHttp } from '/@/utils/http/abp'; |
|||
import { |
|||
PackageCreateDto, |
|||
PackageDto, |
|||
PackageBlobUploadDto, |
|||
PackageBlobDto, |
|||
PackageBlobRemoveDto, |
|||
PackageBlobDownloadInput, |
|||
PackageGetLatestInput, |
|||
PackageGetPagedListInput, |
|||
PackageUpdateDto |
|||
} from './model'; |
|||
|
|||
const remoteServiceName = 'Platform'; |
|||
const controllerName = 'Package'; |
|||
|
|||
export const CreateAsyncByInput = (input: PackageCreateDto) => { |
|||
return defAbpHttp.request<PackageDto>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'CreateAsync', |
|||
uniqueName: 'CreateAsyncByInput', |
|||
params: { |
|||
}, |
|||
data: input, |
|||
}); |
|||
}; |
|||
export const DeleteAsyncById = (id: string) => { |
|||
return defAbpHttp.request<void>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'DeleteAsync', |
|||
uniqueName: 'DeleteAsyncById', |
|||
params: { |
|||
id: id, |
|||
}, |
|||
}); |
|||
}; |
|||
export const UploadBlobAsyncByIdAndInput = (id: string, input: PackageBlobUploadDto) => { |
|||
return defAbpHttp.request<PackageBlobDto>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'UploadBlobAsync', |
|||
uniqueName: 'UploadBlobAsyncByIdAndInput', |
|||
params: id, |
|||
data: input, |
|||
}); |
|||
}; |
|||
export const RemoveBlobAsyncByIdAndInput = (id: string, input: PackageBlobRemoveDto) => { |
|||
return defAbpHttp.request<void>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'RemoveBlobAsync', |
|||
uniqueName: 'RemoveBlobAsyncByIdAndInput', |
|||
params: { |
|||
id: id, |
|||
input: input, |
|||
}, |
|||
}); |
|||
}; |
|||
export const DownloadBlobAsyncByIdAndInput = (id: string, input: PackageBlobDownloadInput) => { |
|||
return defAbpHttp.request<Blob>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'DownloadBlobAsync', |
|||
uniqueName: 'DownloadBlobAsyncByIdAndInput', |
|||
params: { |
|||
id: id, |
|||
input: input, |
|||
}, |
|||
},{ |
|||
withToken: false, |
|||
}); |
|||
}; |
|||
export const GetAsyncById = (id: string) => { |
|||
return defAbpHttp.request<PackageDto>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'GetAsync', |
|||
uniqueName: 'GetAsyncById', |
|||
params: { |
|||
id: id, |
|||
}, |
|||
},{ |
|||
withToken: false, |
|||
}); |
|||
}; |
|||
export const GetLatestAsyncByInput = (input: PackageGetLatestInput) => { |
|||
return defAbpHttp.request<PackageDto>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'GetLatestAsync', |
|||
uniqueName: 'GetLatestAsyncByInput', |
|||
params: { |
|||
input: input, |
|||
}, |
|||
},{ |
|||
withToken: false, |
|||
}); |
|||
}; |
|||
export const GetListAsyncByInput = (input: PackageGetPagedListInput) => { |
|||
return defAbpHttp.pagedRequest<PackageDto>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'GetListAsync', |
|||
uniqueName: 'GetListAsyncByInput', |
|||
params: { |
|||
input: input, |
|||
}, |
|||
}); |
|||
}; |
|||
export const UpdateAsyncByIdAndInput = (id: string, input: PackageUpdateDto) => { |
|||
return defAbpHttp.request<PackageDto>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'UpdateAsync', |
|||
uniqueName: 'UpdateAsyncByIdAndInput', |
|||
params: id, |
|||
data: input, |
|||
}); |
|||
}; |
|||
@ -0,0 +1,84 @@ |
|||
export interface PackageCreateDto extends PackageCreateOrUpdateDto { |
|||
name: string; |
|||
version: string; |
|||
} |
|||
|
|||
export interface PackageBlobUploadDto { |
|||
name: string; |
|||
size?: number; |
|||
summary?: string; |
|||
contentType?: string; |
|||
createdAt?: string; |
|||
updatedAt?: string; |
|||
license?: string; |
|||
authors?: string; |
|||
file: Blob; |
|||
} |
|||
|
|||
export interface PackageBlobRemoveDto { |
|||
name: string; |
|||
} |
|||
|
|||
export interface PackageBlobDownloadInput { |
|||
name: string; |
|||
} |
|||
|
|||
export interface PackageGetLatestInput { |
|||
name: string; |
|||
} |
|||
|
|||
export interface PackageGetPagedListInput extends PagedAndSortedResultRequestDto { |
|||
filter?: string; |
|||
name?: string; |
|||
note?: string; |
|||
version?: string; |
|||
description?: string; |
|||
forceUpdate?: boolean; |
|||
authors?: string; |
|||
} |
|||
|
|||
export interface PackageUpdateDto extends PackageCreateOrUpdateDto { |
|||
concurrencyStamp?: string; |
|||
} |
|||
|
|||
export interface PackageCreateOrUpdateDto { |
|||
note: string; |
|||
description?: string; |
|||
forceUpdate?: boolean; |
|||
authors?: string; |
|||
level?: PackageLevel; |
|||
} |
|||
|
|||
export enum PackageLevel { |
|||
Resource = 0, |
|||
Full = 1, |
|||
None = -1, |
|||
} |
|||
|
|||
export interface PackageBlobDto extends CreationAuditedEntityDto<number> { |
|||
name?: string; |
|||
url?: string; |
|||
size?: number; |
|||
summary?: string; |
|||
createdAt?: string; |
|||
updatedAt?: string; |
|||
license?: string; |
|||
authors?: string; |
|||
sHA256?: string; |
|||
contentType?: string; |
|||
downloadCount?: number; |
|||
extraProperties?: Dictionary<string, any>; |
|||
} |
|||
|
|||
export interface PackageDto extends ExtensibleAuditedEntityDto<string> { |
|||
concurrencyStamp?: string; |
|||
name?: string; |
|||
note?: string; |
|||
version?: string; |
|||
description?: string; |
|||
forceUpdate?: boolean; |
|||
authors?: string; |
|||
level?: PackageLevel; |
|||
blobs?: PackageBlobDto[]; |
|||
} |
|||
|
|||
@ -0,0 +1,65 @@ |
|||
<template> |
|||
<BasicModal |
|||
:title="L('Packages')" |
|||
:can-fullscreen="false" |
|||
:show-ok-btn="true" |
|||
:width="800" |
|||
:height="500" |
|||
@register="registerModal" |
|||
@ok="handleSubmit" |
|||
> |
|||
<BasicForm @register="registerForm" /> |
|||
</BasicModal> |
|||
</template> |
|||
|
|||
<script lang="ts" setup> |
|||
import { nextTick } from 'vue'; |
|||
import { BasicForm, useForm } from '/@/components/Form'; |
|||
import { BasicModal, useModalInner } from '/@/components/Modal'; |
|||
import { useMessage } from '/@/hooks/web/useMessage'; |
|||
import { useLocalization } from '/@/hooks/abp/useLocalization'; |
|||
import { getModalFormSchemas } from '../datas/ModalData'; |
|||
import { formatToDateTime } from '/@/utils/dateUtil'; |
|||
import { GetAsyncById, CreateAsyncByInput, UpdateAsyncByIdAndInput } from '/@/api/platform/package'; |
|||
|
|||
const emits = defineEmits(['change', 'register']); |
|||
|
|||
const { createMessage } = useMessage(); |
|||
const { L } = useLocalization(['Platform', 'AbpUi']); |
|||
const [registerForm, { setFieldsValue, resetFields, validate }] = useForm({ |
|||
layout: 'vertical', |
|||
showActionButtonGroup: false, |
|||
schemas: getModalFormSchemas(), |
|||
transformDateFunc: (date) => { |
|||
return date ? formatToDateTime(date) : ''; |
|||
}, |
|||
}); |
|||
const [registerModal, { closeModal }] = useModalInner((data) => { |
|||
nextTick(() => { |
|||
resetFields(); |
|||
if (data.id) { |
|||
fetchEntity(data.id); |
|||
} |
|||
}); |
|||
}); |
|||
|
|||
function fetchEntity(id: string) { |
|||
GetAsyncById(id).then((dto) => { |
|||
setFieldsValue(dto); |
|||
}); |
|||
} |
|||
|
|||
function handleSubmit() { |
|||
validate().then((input) => { |
|||
const api = input.id |
|||
? UpdateAsyncByIdAndInput(input.id, input) |
|||
: CreateAsyncByInput(input); |
|||
|
|||
api.then((dto) => { |
|||
createMessage.success(L('SuccessfullySaved')); |
|||
emits('change', dto); |
|||
closeModal(); |
|||
}); |
|||
}); |
|||
} |
|||
</script> |
|||
@ -0,0 +1,98 @@ |
|||
<template> |
|||
<div> |
|||
<BasicTable @register="registerTable"> |
|||
<template #toolbar> |
|||
<Button |
|||
v-auth="['Platform.Package.Create']" |
|||
type="primary" |
|||
@click="handleAddNew" |
|||
> |
|||
{{ L('Package:AddNew') }} |
|||
</Button> |
|||
</template> |
|||
<template #bodyCell="{ column, record }"> |
|||
<template v-if="column.key === 'action'"> |
|||
<TableAction |
|||
:stop-button-propagation="true" |
|||
:actions="[ |
|||
{ |
|||
auth: 'Platform.Package.Update', |
|||
label: L('Edit'), |
|||
icon: 'ant-design:edit-outlined', |
|||
onClick: handleEdit.bind(null, record), |
|||
}, |
|||
{ |
|||
auth: 'Platform.Package.Delete', |
|||
label: L('Delete'), |
|||
color: 'error', |
|||
icon: 'ant-design:delete-outlined', |
|||
onClick: handleDelete.bind(null, record), |
|||
}, |
|||
]" |
|||
/> |
|||
</template> |
|||
</template> |
|||
</BasicTable> |
|||
<PackageModal @register="registerModal" @change="reload" /> |
|||
</div> |
|||
</template> |
|||
|
|||
<script lang="ts" setup> |
|||
import { Button } from 'ant-design-vue'; |
|||
import { BasicTable, TableAction, useTable } from '/@/components/Table'; |
|||
import { getDataColumns } from '../datas/TableData'; |
|||
import { getSearchFormProps } from '../datas/ModalData'; |
|||
import { useModal } from '/@/components/Modal'; |
|||
import { useMessage } from '/@/hooks/web/useMessage'; |
|||
import { useLocalization } from '/@/hooks/abp/useLocalization'; |
|||
import { GetListAsyncByInput, DeleteAsyncById } from '/@/api/platform/package'; |
|||
import { formatPagedRequest } from '/@/utils/http/abp/helper'; |
|||
import PackageModal from './PackageModal.vue'; |
|||
|
|||
const { L } = useLocalization(['Platform', 'AbpUi']); |
|||
const { createConfirm, createMessage } = useMessage(); |
|||
const [registerModal, { openModal }] = useModal(); |
|||
const [registerTable, { reload }] = useTable({ |
|||
rowKey: 'id', |
|||
title: L('Packages'), |
|||
api: GetListAsyncByInput, |
|||
columns: getDataColumns(), |
|||
beforeFetch: formatPagedRequest, |
|||
pagination: true, |
|||
striped: false, |
|||
useSearchForm: true, |
|||
showIndexColumn: false, |
|||
showTableSetting: true, |
|||
formConfig: getSearchFormProps(), |
|||
bordered: true, |
|||
canResize: true, |
|||
immediate: true, |
|||
actionColumn: { |
|||
width: 150, |
|||
title: L('Actions'), |
|||
dataIndex: 'action', |
|||
}, |
|||
}); |
|||
|
|||
function handleAddNew() { |
|||
openModal(true, {}); |
|||
} |
|||
|
|||
function handleEdit(record) { |
|||
openModal(true, record); |
|||
} |
|||
|
|||
function handleDelete(record) { |
|||
createConfirm({ |
|||
iconType: 'warning', |
|||
title: L('AreYouSure'), |
|||
content: L('ItemWillBeDeletedMessage'), |
|||
onOk: () => { |
|||
return DeleteAsyncById(record.id).then(() => { |
|||
createMessage.success(L('SuccessfullyDeleted')); |
|||
reload(); |
|||
}); |
|||
}, |
|||
}); |
|||
} |
|||
</script> |
|||
@ -0,0 +1,119 @@ |
|||
import { useLocalization } from '/@/hooks/abp/useLocalization'; |
|||
import { FormProps, FormSchema } from '/@/components/Form'; |
|||
|
|||
const { L } = useLocalization(['Platform', 'AbpUi']); |
|||
|
|||
export function getSearchFormProps(): Partial<FormProps> { |
|||
return { |
|||
labelWidth: 100, |
|||
schemas: [ |
|||
{ |
|||
field: 'filter', |
|||
component: 'Input', |
|||
label: L('Search'), |
|||
colProps: {span: 24}, |
|||
}, |
|||
{ |
|||
field: 'name', |
|||
component: 'Input', |
|||
label: L('DisplayName:Name'), |
|||
colProps: {span: 8}, |
|||
}, |
|||
{ |
|||
field: 'note', |
|||
component: 'Input', |
|||
label: L('DisplayName:Note'), |
|||
colProps: {span: 8}, |
|||
}, |
|||
{ |
|||
field: 'version', |
|||
component: 'Input', |
|||
label: L('DisplayName:Version'), |
|||
colProps: {span: 8}, |
|||
}, |
|||
{ |
|||
field: 'description', |
|||
component: 'Input', |
|||
label: L('DisplayName:Description'), |
|||
colProps: {span: 8}, |
|||
}, |
|||
{ |
|||
field: 'forceUpdate', |
|||
component: 'Input', |
|||
label: L('DisplayName:ForceUpdate'), |
|||
colProps: {span: 8}, |
|||
}, |
|||
{ |
|||
field: 'authors', |
|||
component: 'Input', |
|||
label: L('DisplayName:Authors'), |
|||
colProps: {span: 8}, |
|||
} |
|||
], |
|||
}; |
|||
} |
|||
|
|||
export function getModalFormSchemas(): FormSchema[] { |
|||
return [ |
|||
{ |
|||
field: 'note', |
|||
component: 'Input', |
|||
label: L('DisplayName:Note'), |
|||
colProps: {span: 24}, |
|||
componentProps: {}, |
|||
}, |
|||
{ |
|||
field: 'description', |
|||
component: 'Input', |
|||
label: L('DisplayName:Description'), |
|||
colProps: {span: 24}, |
|||
componentProps: {}, |
|||
}, |
|||
{ |
|||
field: 'forceUpdate', |
|||
component: 'Input', |
|||
label: L('DisplayName:ForceUpdate'), |
|||
colProps: {span: 24}, |
|||
componentProps: {}, |
|||
}, |
|||
{ |
|||
field: 'authors', |
|||
component: 'Input', |
|||
label: L('DisplayName:Authors'), |
|||
colProps: {span: 24}, |
|||
componentProps: {}, |
|||
}, |
|||
{ |
|||
field: 'name', |
|||
component: 'Input', |
|||
label: L('DisplayName:Name'), |
|||
colProps: {span: 24}, |
|||
componentProps: {}, |
|||
}, |
|||
{ |
|||
field: 'version', |
|||
component: 'Input', |
|||
label: L('DisplayName:Version'), |
|||
colProps: {span: 24}, |
|||
componentProps: {}, |
|||
}, |
|||
{ |
|||
field: 'id', |
|||
component: 'Input', |
|||
label: 'id', |
|||
show: false, |
|||
dynamicDisabled: true, |
|||
colProps: {span: 24}, |
|||
componentProps: {}, |
|||
}, |
|||
{ |
|||
field: 'concurrencyStamp', |
|||
component: 'Input', |
|||
label: 'concurrencyStamp', |
|||
show: false, |
|||
dynamicDisabled: true, |
|||
colProps: {span: 24}, |
|||
componentProps: {}, |
|||
}, |
|||
]; |
|||
} |
|||
@ -0,0 +1,118 @@ |
|||
import { useLocalization } from '/@/hooks/abp/useLocalization'; |
|||
import { BasicColumn } from '/@/components/Table'; |
|||
import { formatToDateTime } from '/@/utils/dateUtil'; |
|||
|
|||
const { L } = useLocalization(['Platform', 'AbpUi']); |
|||
|
|||
export function getDataColumns(): BasicColumn[] { |
|||
return [ |
|||
{ |
|||
title: L('DisplayName:Id'), |
|||
dataIndex: 'id', |
|||
align: 'left', |
|||
width: 1, |
|||
sorter: true, |
|||
resizable: true, |
|||
ifShow: false, |
|||
}, |
|||
{ |
|||
title: L('DisplayName:CreationTime'), |
|||
dataIndex: 'creationTime', |
|||
align: 'left', |
|||
width: 1, |
|||
sorter: true, |
|||
resizable: true, |
|||
ifShow: false, |
|||
format: (text) => { |
|||
return text ? formatToDateTime(text) : text; |
|||
} |
|||
}, |
|||
{ |
|||
title: L('DisplayName:CreatorId'), |
|||
dataIndex: 'creatorId', |
|||
align: 'left', |
|||
width: 1, |
|||
sorter: true, |
|||
resizable: true, |
|||
ifShow: false, |
|||
}, |
|||
{ |
|||
title: L('DisplayName:LastModificationTime'), |
|||
dataIndex: 'lastModificationTime', |
|||
align: 'left', |
|||
width: 1, |
|||
sorter: true, |
|||
resizable: true, |
|||
ifShow: false, |
|||
format: (text) => { |
|||
return text ? formatToDateTime(text) : text; |
|||
} |
|||
}, |
|||
{ |
|||
title: L('DisplayName:LastModifierId'), |
|||
dataIndex: 'lastModifierId', |
|||
align: 'left', |
|||
width: 1, |
|||
sorter: true, |
|||
resizable: true, |
|||
ifShow: false, |
|||
}, |
|||
{ |
|||
title: L('DisplayName:ConcurrencyStamp'), |
|||
dataIndex: 'concurrencyStamp', |
|||
align: 'left', |
|||
width: 1, |
|||
sorter: true, |
|||
resizable: true, |
|||
ifShow: false, |
|||
}, |
|||
{ |
|||
title: L('DisplayName:Name'), |
|||
dataIndex: 'name', |
|||
align: 'left', |
|||
width: 120, |
|||
sorter: true, |
|||
resizable: true, |
|||
}, |
|||
{ |
|||
title: L('DisplayName:Note'), |
|||
dataIndex: 'note', |
|||
align: 'left', |
|||
width: 120, |
|||
sorter: true, |
|||
resizable: true, |
|||
}, |
|||
{ |
|||
title: L('DisplayName:Version'), |
|||
dataIndex: 'version', |
|||
align: 'left', |
|||
width: 120, |
|||
sorter: true, |
|||
resizable: true, |
|||
}, |
|||
{ |
|||
title: L('DisplayName:Description'), |
|||
dataIndex: 'description', |
|||
align: 'left', |
|||
width: 120, |
|||
sorter: true, |
|||
resizable: true, |
|||
}, |
|||
{ |
|||
title: L('DisplayName:ForceUpdate'), |
|||
dataIndex: 'forceUpdate', |
|||
align: 'left', |
|||
width: 120, |
|||
sorter: true, |
|||
resizable: true, |
|||
}, |
|||
{ |
|||
title: L('DisplayName:Authors'), |
|||
dataIndex: 'authors', |
|||
align: 'left', |
|||
width: 120, |
|||
sorter: true, |
|||
resizable: true, |
|||
}, |
|||
]; |
|||
} |
|||
@ -0,0 +1,13 @@ |
|||
<template> |
|||
<PackageTable /> |
|||
</template> |
|||
|
|||
<script lang="ts"> |
|||
import { defineComponent } from 'vue'; |
|||
import PackageTable from './components/PackageTable.vue'; |
|||
|
|||
export default defineComponent({ |
|||
name: 'PlatformPackages', |
|||
components: { PackageTable }, |
|||
}); |
|||
</script> |
|||
Loading…
Reference in new issue