From 116e7e293077050e037cb6e6b44e6cc4d3f160ce Mon Sep 17 00:00:00 2001 From: ssmumbai07 Date: Tue, 23 Apr 2024 23:00:38 +0530 Subject: [PATCH 1/2] Edit template --- backend/src/admin/admin.controller.ts | 16 +++ backend/src/admin/admin.service.ts | 4 + .../document_template.service.ts | 6 + frontend/src/app/common/manage-templates.ts | 6 + .../manage-templates/EditTemplateModal.tsx | 111 ++++++++++++++++++ .../manage-templates/TemplateInfoTable.tsx | 36 +++++- frontend/src/app/types/types.ts | 1 + 7 files changed, 178 insertions(+), 2 deletions(-) create mode 100644 frontend/src/app/components/modal/manage-templates/EditTemplateModal.tsx diff --git a/backend/src/admin/admin.controller.ts b/backend/src/admin/admin.controller.ts index 3aadb69d..47f4f0cd 100644 --- a/backend/src/admin/admin.controller.ts +++ b/backend/src/admin/admin.controller.ts @@ -57,6 +57,22 @@ export class AdminController { }); } + @Get('update-template/:id/:documentTypeId/:documentNo/:documentName') + async upddateTemplate( + @User() user: IdirObject, + @Param('id') id: number, + @Param('document_type_id') document_type_id: number, + @Param('documentNo') documentNo: number, + @Param('documentName') documentName: string + ){ + return this.adminService.updateTemplate({ + id: id, + documentNo: documentNo, + documentName: documentName, + document_type_id: document_type_id, + }); + } + @Get('preview-template/:id') async previewTemplate(@Param('id') id: number, @Res() res) { try { diff --git a/backend/src/admin/admin.service.ts b/backend/src/admin/admin.service.ts index b799099f..1ef6fe3e 100644 --- a/backend/src/admin/admin.service.ts +++ b/backend/src/admin/admin.service.ts @@ -40,6 +40,10 @@ export class AdminService { return this.documentTemplateService.remove(document_type_id, id); } + updateTemplate(data: { id: number; documentNo: number; documentName: string; document_type_id: number }): Promise { + return this.documentTemplateService.updateTemplate(data); + } + async uploadTemplate( data: { document_type_id: number; diff --git a/backend/src/document_template/document_template.service.ts b/backend/src/document_template/document_template.service.ts index 0da87ce7..f98005bf 100644 --- a/backend/src/document_template/document_template.service.ts +++ b/backend/src/document_template/document_template.service.ts @@ -65,6 +65,12 @@ export class DocumentTemplateService { return activatedTemplate; } + async updateTemplate(data:{id: number; documentNo: number; documentName: string; document_type_id: number }): Promise{ + const updatedTemplate = await this.documentTemplateRepository.update({ id: data.id }, { file_name: data.documentName, template_version: data.documentNo}); + await this.updateTemplates(data.document_type_id); + return updatedTemplate + } + async checkForActiveTemplates(data: { id: number; update_userid: string; document_type_id: number }): Promise { const allTemplates = await this.documentTemplateRepository .createQueryBuilder('documentTemplate') diff --git a/frontend/src/app/common/manage-templates.ts b/frontend/src/app/common/manage-templates.ts index 49a5817a..4175d7d7 100644 --- a/frontend/src/app/common/manage-templates.ts +++ b/frontend/src/app/common/manage-templates.ts @@ -93,3 +93,9 @@ export const uploadTemplate = async (formData: FormData): Promise => { const postParameters = api.generateApiParameters(url, formData); await api.post<{ message: string }>(postParameters); }; + +export const editTemplate = async (id: number, documentTypeId: number, documentNo: number, documentName: string): Promise => { + const url = `${config.API_BASE_URL}/admin/update-template/${id}/${documentTypeId}/${documentNo}/${documentName}`; + const getParameters = api.generateApiParameters(url); + await api.get(getParameters); +} diff --git a/frontend/src/app/components/modal/manage-templates/EditTemplateModal.tsx b/frontend/src/app/components/modal/manage-templates/EditTemplateModal.tsx new file mode 100644 index 00000000..eee62e7c --- /dev/null +++ b/frontend/src/app/components/modal/manage-templates/EditTemplateModal.tsx @@ -0,0 +1,111 @@ +import { FC, useState } from 'react'; +import Modal from 'react-bootstrap/Modal'; +import { editTemplate, uploadTemplate } from '../../../common/manage-templates'; +import { Button } from 'react-bootstrap'; + +type EditTemplateModalProps = { + show: boolean; + documentName: string; + documentId: number; + documentVersion: number; + documentTypeId: number + onHide: () => void; + onUpload: () => void; +}; + +const EditTemplateModal: FC = ({ + show, + documentName, + documentId, + documentVersion, + documentTypeId, + onHide, + onUpload, +}) => { + const [error, setError] = useState(''); + const [showError, setShowError] = useState(false); + const [documentNameText, setDocumentNameText] = useState(documentName); + const [documentVersionText, setDocumentVersionText] = useState(documentVersion); + const [isLoading, setIsLoading] = useState(false); + + const editButtonHandler = async () => { + if (!documentNameText || !documentVersionText) { + setError('Fields cannot be empty'); + setShowError(true); + return; + } + try { + setIsLoading(true); + setShowError(false); + await editTemplate(documentId, documentTypeId, +documentVersionText, documentNameText); + } catch (error) { + setError('Error updating templete'); + setShowError(true); + console.log(error); + } finally { + setIsLoading(false); + onUpload(); + } + }; + const handleChange = (e: React.ChangeEvent) => { + const value = e.target.value; + if (value === '') { + setDocumentVersionText(''); + } else { + setDocumentVersionText(+value); + } + }; + + return ( + + + Edit Template + + + + +
+ + +
+
+ + setDocumentNameText(e.target.value)} + placeholder="Template Name" + style={{ width: '500px' }} + /> +
+ {showError &&
{error}
} + + + + + + + ); +}; +export default EditTemplateModal; diff --git a/frontend/src/app/components/table/manage-templates/TemplateInfoTable.tsx b/frontend/src/app/components/table/manage-templates/TemplateInfoTable.tsx index 88e0eb04..65b2777b 100644 --- a/frontend/src/app/components/table/manage-templates/TemplateInfoTable.tsx +++ b/frontend/src/app/components/table/manage-templates/TemplateInfoTable.tsx @@ -5,6 +5,7 @@ import { activateTemplate, downloadTemplate, getTemplatesInfo, previewTemplate } import { DocType, TemplateInfo } from '../../../types/types'; import { Button } from 'react-bootstrap'; import PreviewTemplateModal from '../../modal/admin/manage-templates/PreviewTemplateModal'; +import EditTemplateModal from '../../modal/manage-templates/EditTemplateModal'; interface TemplateInfoTableProps { documentType: DocType; @@ -18,7 +19,13 @@ const TemplateInfoTable: React.FC = ({ documentType, ref const [loading, setLoading] = useState(false); const [isOpen, setIsOpen] = useState(false); const [iframeSrcBlob, setIframeSrcBlob] = useState(null); - + const [isEditModalOpen, setisEditModalOpen] = useState(false); + const [documentId, setDocumentId] = useState(10); + const [documentName, setDocumentName] = useState(''); + const [documentVersion, setDocumentVersion] = useState(10); + const [isTemplateUpdated, setTemplateUpdated] = useState(false); + //] + // useEffect(() => { const fetchData = async () => { const data = await getTemplatesInfo(documentType.id); @@ -31,7 +38,7 @@ const TemplateInfoTable: React.FC = ({ documentType, ref }; fetchData(); - }, [documentType, refreshVersion]); + }, [documentType, refreshVersion, isTemplateUpdated]); const activeRadioHandler = async (id: number) => { try { @@ -79,11 +86,24 @@ const TemplateInfoTable: React.FC = ({ documentType, ref } }; + const handleEditTemplate = async (id: number, fileName: string, version: number) => { + setLoading(true); + setDocumentId(id); + setDocumentName(fileName); + setDocumentVersion(version); + setisEditModalOpen(true); + }; + // this opens a modal which is handled on the ManageTemplatesPage const handleRemoveButton = (id: number) => { handleRemove(id); }; + const onTemplateUpdated = () => { + setTemplateUpdated(!isTemplateUpdated); + setisEditModalOpen(false); + } + const columnHelper = createColumnHelper(); const columns: ColumnDef[] = [ @@ -149,6 +169,17 @@ const TemplateInfoTable: React.FC = ({ documentType, ref enableSorting: false, meta: { customCss: { width: '12%' } }, }), + columnHelper.accessor('edit', { + id: 'edit', + cell: (info) => ( + + ), + header: () => null, + enableSorting: false, + meta: { customCss: { width: '11%' } }, + }), columnHelper.accessor('remove', { id: 'remove', cell: (info) => ( @@ -173,6 +204,7 @@ const TemplateInfoTable: React.FC = ({ documentType, ref return <> + {isEditModalOpen && setisEditModalOpen(false)} onUpload={onTemplateUpdated} />} {isOpen && } Date: Wed, 24 Apr 2024 00:33:36 +0530 Subject: [PATCH 2/2] Review changes --- backend/src/document_template/document_template.service.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/backend/src/document_template/document_template.service.ts b/backend/src/document_template/document_template.service.ts index f98005bf..099eaf03 100644 --- a/backend/src/document_template/document_template.service.ts +++ b/backend/src/document_template/document_template.service.ts @@ -67,7 +67,6 @@ export class DocumentTemplateService { async updateTemplate(data:{id: number; documentNo: number; documentName: string; document_type_id: number }): Promise{ const updatedTemplate = await this.documentTemplateRepository.update({ id: data.id }, { file_name: data.documentName, template_version: data.documentNo}); - await this.updateTemplates(data.document_type_id); return updatedTemplate }