admin/apollo-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update KsNewDocumentForm.vue to add ksProjectName field and modify ksDocType dropdown options

Browse Source
This commit is contained in:
andrea.terzani
2024-10-27 12:33:53 +01:00
parent fa3a5d0965
commit d28e970a1b
1 changed files with 29 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
src/views/pages/ksDocuments/KsNewDocumentForm.vue
View File

@@ -8,7 +8,7 @@
<form @submit.prevent="submitForm" class="p-fluid">
<div class="col-12 md:col-6 mb-4">
<span class="p-float-label">
<label for="description" v-tooltip="'A brief overview of the system purpose and functionality.'">System
<label for="description" v-tooltip="'A brief overview of the document.'">Document
Description</label>
<InputText id="description" type="text" v-model="formData.description" required class="w-full" />
</span>
@@ -22,7 +22,12 @@
<InputText id="type" v-model="formData.type" required class="w-full" />
</span>
</div>
<div class="col-12 md:col-6 mb-4">
<span class="p-float-label">
<label for="ksProjectName" v-tooltip="'Enter the project name here.'">KS Projerct Name</label>
<InputText id="ksProjectName" v-model="formData.ksProjectName" required class="w-full" />
</span>
</div>
<div class="col-12 md:col-6 mb-4">
<span class="p-float-label">
<label for="ksApplicationName" v-tooltip="'Enter the application name here.'">KS Application Name</label>
@@ -32,8 +37,10 @@
<div class="col-12 md:col-6 mb-4">
<span class="p-float-label">
<label for="ksDocType" v-tooltip="'Specify the type of document e.g, md, pdf,'">KS Document Type</label>
<InputText id="ksDocType" v-model="formData.ksDocType" required class="w-full" />
<label for="ksDocType" v-tooltip="'Specify the type of document e.g functional, code_istruction'">KS
Document Type</label>+
<Dropdown id="ksDocType" v-model="formData.ksDocType" :options="documentTypeOptions" optionLabel="name">
</Dropdown>
</span>
</div>
@@ -86,7 +93,7 @@
class="p-button-rounded" @select="onFileSelect" />
</div>
</div>
<Button type="submit" label="Submit" :fluid="false" class="p-button-rounded p-button-lg" />
<Button type="submit" label="Submit" :fluid="false"></Button>
</form>
</div>
</div>
@@ -102,24 +109,24 @@ import { useRouter } from 'vue-router';
const toast = useToast();
const router = useRouter();
const dropdownItems = ref([
{ name: 'PDF', value: 'pdf' },
{ name: 'MD', value: 'md' },
{ name: 'DOCX', value: 'docx' },
{ name: 'EXCEL', value: 'excel' }
const documentTypeOptions = ref([
{ name: 'Functional', value: 'functional' },
{ name: 'Code Instruction', value: 'code_instruction' },
{ name: 'Specification', value: 'specification' },
{ name: 'Other', value: 'other' }
]);
const formData = ref({
description: '', //Jenkins DevopsJ2Cloud System CSV configuration md file
ingestionStatus: 'NEW',
type: '', //.md file
ksApplicationName: '', //Jenkins-DevopsJ2Cloud
ksDocType: 'Functional',
ksDocSource: '', //Git Repository - DevopsJ2Cloud CSV System Configuration
defaultChunkSize: 1000,
minChunkSize: 200,
description: '',
type: '',
ksProjectName: '',
ksApplicationName: '',
ksDocType: 'functional',
ksDocSource: '',
defaultChunkSize: 2000,
minChunkSize: 50,
maxNumberOfChunks: 1000,
minChunkSizeToEmbed: 20
minChunkSizeToEmbed: 50
});
const fileUpload = ref(null);
@@ -136,11 +143,11 @@ const submitForm = async () => {
formDataToSend.append('file', selectedFile.value);
}
// Append each field separately to ensure they are correctly processed by the server
formDataToSend.append('description', formData.value.description);
formDataToSend.append('type', formData.value.type);
formDataToSend.append('ksApplicationName', formData.value.ksApplicationName);
formDataToSend.append('ksDocType', formData.value.ksDocType);
formDataToSend.append('ksProjectName', formData.value.ksProjectName);
formDataToSend.append('ksDocType', formData.value.ksDocType.value);
formDataToSend.append('ksDocSource', formData.value.ksDocSource);
formDataToSend.append('defaultChunkSize', formData.value.defaultChunkSize);
formDataToSend.append('minChunkSize', formData.value.minChunkSize);
@@ -166,40 +173,4 @@ const submitForm = async () => {
</script>
<style scoped>
.card-container {
max-width: 800px;
margin: 2rem auto;
padding: 0 1rem;
}
:deep(.p-card) {
background: linear-gradient(145deg, #f3f4f6, #ffffff);
border-radius: 15px;
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}
:deep(.p-button) {
background: linear-gradient(45deg, #4CAF50, #45a049);
border: none;
transition: all 0.3s ease;
}
:deep(.p-button:hover) {
background: linear-gradient(45deg, #45a049, #4CAF50);
transform: translateY(-2px);
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}
:deep(.p-inputtext:focus) {
box-shadow: 0 0 0 2px rgba(76, 175, 80, 0.2);
}
:deep(.p-dropdown:focus) {
box-shadow: 0 0 0 2px rgba(76, 175, 80, 0.2);
}
:deep(.p-inputnumber-input:focus) {
box-shadow: 0 0 0 2px rgba(76, 175, 80, 0.2);
}
</style>
<style scoped></style>