Skip to content

Commit

Permalink
- app version = 5.12.1
Browse files Browse the repository at this point in the history 
- deleted authorization date entry
- misc layout improvements
- changed "home jurisdiction" -> "previous jurisdiction"
- updated misc labels and text
- moved business number entry above date of incorporation
- changed "home incorporation date" -> "incorporation date"
- changed "identifying number" -> "incorporation number"
- updated hints
- updated UploadAffidavit invalid logic and styling

- WIP WIP WIP!!!

- added/updated unit tests
  • Loading branch information
Severin Beauvais committed Oct 3, 2024
1 parent b841af3 commit aeb91cb
Show file tree
Hide file tree
Showing 27 changed files with 609 additions and 594 deletions.
4 changes: 2 additions & 2 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "business-create-ui",
"version": "5.12.0",
"version": "5.12.1",
"private": true,
"appName": "Create UI",
"sbcName": "SBC Common Components",
Expand Down
166 changes: 21 additions & 145 deletions src/components/ContinuationIn/AuthorizationProof.vue
View file
Original file line number Diff line number Diff line change
@@ -1,68 +1,26 @@
<template>
<!--
Don't render this component until authorization object is initialized, so that we mount
FileUploadPreview with existing files, because its "inputFile" prop is not reactive.
-->
<div
v-if="authorization"
id="authorization-proof"
>
<!-- Authorization Date -->
<div id="authorization-proof">
<!-- Upload Files -->
<v-card
flat
class="py-8 px-6"
:class="{ 'invalid-section': getShowErrors && !authorizationDateValid }"
>
<v-row no-gutters>
<v-col
cols="12"
sm="3"
>
<label>Authorization Date</label>
</v-col>

<v-col
cols="12"
sm="9"
>
<DatePickerShared
id="authorization-date"
ref="authorizationDateRef"
title="Authorization Date"
:nudgeRight="40"
:nudgeTop="85"
hint="The date the authorization was issued"
:persistentHint="true"
:initialValue="authorization.date"
:inputRules="getShowErrors ? authorizationDateRules : []"
:minDate="minAuthorizationDate"
:maxDate="getCurrentDate"
@emitDateSync="authorization.date = $event"
/>
</v-col>
</v-row>
</v-card>

<!-- Upload Documents -->
<v-card
flat
class="mt-6 py-8 px-6"
:class="{ 'invalid-section': getShowErrors && !authorizationFilesValid }"
>
<v-row no-gutters>
<v-col
cols="12"
sm="3"
class="pr-4"
>
<label>Upload Documents</label>
<label>Upload File</label>
</v-col>

<v-col
cols="12"
sm="9"
>
<p :class="{ 'error-text': getShowErrors && !authorizationFilesValid }">
Upload one or more documents that show proof of authorization to continue out of your
Upload one or more files that show proof of authorization to continue out of your
previous jursidiction.
</p>

Expand Down Expand Up @@ -100,7 +58,7 @@

<FileUploadPreview
ref="fileUploadPreview"
class="d-none mt-6"
class="d-none"
:maxSize="MAX_FILE_SIZE"
:customErrorMessage.sync="customErrorMessage"
:isRequired="false"
Expand All @@ -113,7 +71,8 @@
<v-row
v-for="(num, index) in numFiles"
:key="authorization.files[index].fileKey"
class="upload-file-row mt-5 mb-n2"
class="upload-file-row mt-5"
:class="{ 'mb-n2': (num < numFiles) }"
no-gutters
>
<v-col
Expand All @@ -126,12 +85,12 @@
<v-col
cols="12"
sm="9"
class="dk-gray-background rounded d-flex justify-space-between px-2 py-1"
class="dk-gray-background rounded d-flex justify-space-between align-center px-2 py-2"
>
<div class="document-details">
<v-icon>mdi-paperclip</v-icon>
<span class="pl-2">{{ authorization.files[index]?.file.name }}</span>
<span class="pl-2">({{ friendlyFileSize(authorization.files[index]?.file.size) }})</span>
<v-icon>mdi-paperclip</v-icon>
<div class="document-details mr-auto pl-2">
{{ authorization.files[index]?.file.name }}
<span class="pl-2">({{ friendlyFileSize(authorization.files[index]?.file) }})</span>
</div>
<v-btn
class="remove-document-button"
Expand All @@ -156,6 +115,7 @@
<v-col
cols="12"
sm="3"
class="pr-4"
>
<!-- empty column -->
</v-col>
Expand Down Expand Up @@ -202,15 +162,12 @@ import { useStore } from '@/store/store'
import { DocumentMixin } from '@/mixins'
import { AuthorizationProofIF, ExistingBusinessInfoIF, PresignedUrlIF } from '@/interfaces'
import { FilingStatus } from '@/enums'
import { VuetifyRuleFunction } from '@/types'
import FileUploadPreview from '@/components/common/FileUploadPreview.vue'
import { DatePicker as DatePickerShared } from '@bcrs-shared-components/date-picker'
import AutoResize from 'vue-auto-resize'
import MessageBox from '@/components/common/MessageBox.vue'
@Component({
components: {
DatePickerShared,
FileUploadPreview,
MessageBox
},
Expand All @@ -221,12 +178,10 @@ import MessageBox from '@/components/common/MessageBox.vue'
export default class AuthorizationProof extends Mixins(DocumentMixin) {
// Refs
$refs!: {
authorizationDateRef: DatePickerShared,
fileUploadPreview: FileUploadPreview
}
@Getter(useStore) getContinuationInAuthorizationProof!: AuthorizationProofIF
@Getter(useStore) getCurrentDate!: string
@Getter(useStore) getExistingBusinessInfo!: ExistingBusinessInfoIF
@Getter(useStore) getFilingStatus!: FilingStatus
@Getter(useStore) getKeycloakGuid!: string
Expand All @@ -236,40 +191,11 @@ export default class AuthorizationProof extends Mixins(DocumentMixin) {
// Local properties
authorization = null as AuthorizationProofIF
authorizationDateValid = false
fileValidity = false
customErrorMessage = ''
isFileAdded = false
isDocumentLoading = false
/**
* The minimum date for the Authorization Date:
* - the BC Founding Date (if it exists, ie, expro business)
* - else the Home Jurisdiction Incorporation Date (ie, manual entry)
* - else fall back to null (not undefined)
*/
get minAuthorizationDate (): string {
return (
this.getExistingBusinessInfo.bcFoundingDate ||
this.getExistingBusinessInfo.homeIncorporationDate ||
null
)
}
get authorizationDateRules (): Array<VuetifyRuleFunction> {
const bcFoundingDate = this.getExistingBusinessInfo.bcFoundingDate
const homeIncorporationDate = this.getExistingBusinessInfo.homeIncorporationDate
return [
(v) => !!v || 'Authorization Date is required',
() => (this.authorization.date <= this.getCurrentDate) || 'Authorization Date cannot be in the future',
() => (!bcFoundingDate || (this.authorization.date >= bcFoundingDate)) ||
'Authorization Date cannot be before Date of Registration in B.C.',
() => (!homeIncorporationDate || (this.authorization.date >= homeIncorporationDate)) ||
'Authorization Date cannot be before Date of Incorporation in Home Jurisdiction'
]
}
/** Whether filing status is Change Requested. */
get isStatusChangeRequested (): boolean {
return (this.getFilingStatus === FilingStatus.CHANGE_REQUESTED)
Expand Down Expand Up @@ -302,6 +228,7 @@ export default class AuthorizationProof extends Mixins(DocumentMixin) {
/** Called when this component is mounted. */
mounted (): void {
// initialize the authorization object if needed
this.authorization = this.getContinuationInAuthorizationProof ||
{ files: [], date: null } as AuthorizationProofIF
}
Expand All @@ -311,15 +238,6 @@ export default class AuthorizationProof extends Mixins(DocumentMixin) {
this.$refs.fileUploadPreview.clickFileInput()
}
/** Converts a file size to a string in MB, KB or bytes. */
friendlyFileSize (size: number): string {
const sizeKB = size / 1024
const sizeMB = sizeKB / 1024
if (sizeMB > 1) return `${sizeMB.toFixed(1)} MB`
if (sizeKB > 1) return `${sizeKB.toFixed(0)} KB`
return `${size} bytes`
}
/**
* Called when FileUploadPreview tells us whether a file is valid.
* This is called right before the File Selected event.
Expand Down Expand Up @@ -351,7 +269,7 @@ export default class AuthorizationProof extends Mixins(DocumentMixin) {
// verify file name encoding
if (!isValidLatin1(file.name)) {
// put file uploader into manual error mode by setting custom error message
// set error message
this.customErrorMessage = 'Invalid character in file name.'
return // don't add to array
}
Expand Down Expand Up @@ -402,27 +320,14 @@ export default class AuthorizationProof extends Mixins(DocumentMixin) {
}
}
@Watch('getShowErrors')
@Watch('minAuthorizationDate') // because Authorization Date depends on this
@Watch('authorization.date') // in case this changes
private async onGetShowErrors (): Promise<void> {
if (this.getShowErrors) {
// wait for form to finish rendering
await this.$nextTick()
// validate date component
this.authorizationDateValid = this.$refs.authorizationDateRef.validateForm()
}
}
@Watch('authorizationFilesValid') // re-validate when the Authorization Files validity changes
@Watch('authorizationDateValid') // re-validate when the Authorization Date validity changes
@Watch('authorization.files') // update store when files are added or removed
@Emit('valid')
private onComponentValid (): boolean {
// sync local object to the store
this.setContinuationAuthorization(this.authorization)
return (this.authorizationDateValid && this.authorizationFilesValid)
return this.authorizationFilesValid
}
}
</script>
Expand All @@ -440,24 +345,6 @@ label {
color: $gray9;
}
// add whitespace between the first and second columns
.col-sm-3 {
padding-right: 1rem !important;
}
#authorization-date {
// show pointer on hover
:deep(.v-input__slot) {
pointer-events: auto;
cursor: pointer;
}
// set icon color
:deep(.v-input__icon--append .v-icon) {
color: $app-blue !important;
}
}
textarea {
color: $gray7;
width: 100%;
Expand All @@ -469,21 +356,9 @@ textarea {
height: unset;
}
// align the checkbox with its label
:deep(.v-input--checkbox .v-input__slot) {
align-items: flex-start;
}
// style the checkbox label
:deep(.v-input--checkbox label) {
margin-top: 2px;
font-size: $px-14;
color: $gray9;
}
// style the upload file bullets
ul {
list-style: none;
color: $gray7;
li::before {
content: "\2022";
Expand All @@ -494,7 +369,8 @@ ul {
}
}
.document-details {
padding-top: 6px;
// align the remove icon with the button label
.v-icon.mdi-close {
padding-top: 1px;
}
</style>
Loading

0 comments on commit aeb91cb

Please sign in to comment.