Feature/edit citizen sidesheet

README.md

@@ -8,6 +8,9 @@ Este pacote fornece componentes reutilizáveis para integração com APIs de cid
 
 - **CitizenSelect**: Componente de busca e seleção de cidadãos com dropdown
 - **CitizenService**: Serviço para buscar dados de cidadãos via API ou mock
+- **CreateCitizenSidesheet**: Componente para a criação de um novo cidadão
+- **EditCitizenSidesheet**: Componente para a edição de um cidadão
+- **CitizenSummaryViewer**: Componente para exibir um resumo estruturado dos dados mais relevantes de um cidadão
 - Suporte a fallback para dados mockados quando a API não está configurada
 - TypeScript com tipos exportados
 

env.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="vite/client" />
+import type { Citizen } from './src/services/citizen/citizen.types';
 
 declare module '*.vue' {
 	import type { DefineComponent } from 'vue';
@@ -7,39 +8,13 @@ declare module '*.vue' {
 }
 
 declare global {
+	// eslint-disable-next-line no-unused-vars
 	type Nullable<T> = T | null;
 
 	// eslint-disable-next-line no-unused-vars
 	type CitizenSelectModelType = Citizen | Partial<Citizen> | string | null;
 
-	interface Citizen {
-		id: string;
-		cpf: string;
-		cns: string;
-		name: string;
-		gender: string;
-		cpf_responsible: Nullable<string>;
-		mother_name: string;
-		birth_date: string;
-		phone: Nullable<string>;
-		cellphone: Nullable<string>;
-		email: Nullable<string>;
-		address: {
-			cep: Nullable<string>;
-			street: Nullable<string>;
-			number: Nullable<string>;
-			complement: Nullable<string>;
-			neighborhood: Nullable<string>;
-			city: Nullable<string>;
-			uf: Nullable<string>;
-		};
-		race: string;
-		co_cidadao: number;
-		is_dead: boolean;
-		pregnant?: boolean | null;
-		identification_document?: Nullable<string>;
-		issuing_agency?: Nullable<string>;
-	}
+	Citizen;
 }
 
 export {};

package.json

@@ -38,8 +38,11 @@
 		"semantic-release:test": "semantic-release --dry-run --no-ci"
 	},
 	"dependencies": {
+		"@vee-validate/i18n": "^4.15.1",
+		"@vee-validate/rules": "^4.15.1",
 		"@vueuse/core": "^13.9.0",
-		"lodash": "^4.17.21"
+		"lodash": "^4.17.21",
+		"luxon": "^3.7.2"
 	},
 	"peerDependencies": {
 		"@sysvale/cuida": "^3.148.0",

scripts/generate-index-types.js

@@ -45,10 +45,28 @@ export interface CreateCitizenSidesheetProps {
   size?: 'sm' | 'md' | 'lg' | 'xl';
 }
 
+export interface EditCitizenSidesheetProps {
+  okButtonText?: string;
+  cancelButtonText?: string;
+  actionButtonVariant?: string;
+  size?: 'sm' | 'md' | 'lg' | 'xl';
+  citizen: string;
+}
+
+export interface CitizenSummaryViewerProps {
+  citizen: Partial<Citizen>,
+	fluid?: boolean,
+	hideEditButton?: boolean,
+	hideCloseButton?: boolean,
+	hideActions?: boolean,
+}
+
 // Export components
 export declare const CitizenSelect: DefineComponent<CitizenSelectProps>;
 export declare const CitizenTable: DefineComponent<CitizenTableProps>;
 export declare const CreateCitizenSidesheet: DefineComponent<CreateCitizenSidesheetProps>;
+export declare const EditCitizenSidesheet: DefineComponent<EditCitizenSidesheetProps>;
+export declare const CitizenSummaryViewer: DefineComponent<CitizenSummaryViewerProps>;
 
 // Export plugin
 export declare const CitizenComponentsPlugin: Plugin;

src/App.vue

@@ -13,14 +13,23 @@
 		>
 			Change Model
 		</CdsButton>
+
+		<CdsFlexbox justify="center" style="background-color: grey; padding: 30px">
+			<div style="width: 1000px;">
+				<CitizenResumeViewer :citizen="citizen" />
+			</div>
+		</CdsFlexbox>
 	</div>
 </template>
 
 <script setup lang="ts">
 import { ref } from 'vue';
 import CitizenSelect from './components/CitizenSelect.vue';
+import CitizenResumeViewer from './components/CitizenResumeViewer.vue';
 const citizen = ref<CitizenSelectModelType>(null);
 
+changeModel();
+
 function changeModel() {
 	console.log('no change model')
 	citizen.value = {
@@ -34,7 +43,7 @@ function changeModel() {
 		'birth_date': '1946-10-02',
 		'phone': '38 4017-7733',
 		'cellphone': '83 7530-1849',
-		'email': 'Delta1@hotmail.com',
+		'email': 'joaopaulosncastro@sysvale.com.br',
 		'address': {
 			'cep': '44443',
 			'street': 'Jakubowski Manors',
@@ -47,7 +56,7 @@ function changeModel() {
 		'race': 'black',
 		'co_cidadao': 2852,
 		'is_dead': true,
-		'pregnant': false,
+		'pregnant': true,
 		'identification_document': '040516263',
 		'issuing_agency': 'SSP'
 	}