RetailCRM-Mirror/vue-formulario
1
0
Fork 0
mirror of synced 2024-11-29 08:36:12 +03:00
Code Issues Projects Releases Wiki Activity

refactor!: FormularioForm - renamed formularioValue into state

Browse Source
This commit is contained in:
Zaytsev Kirill 2021-05-22 23:24:05 +03:00
parent fcbe4df667
commit 8144c27c69
3 changed files with 13 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/FormularioForm.vue
View File

@ -36,7 +36,7 @@ type ValidationEventPayload = {
@Component({ name: 'FormularioForm' }) @Component({ name: 'FormularioForm' })
export default class FormularioForm extends Vue { export default class FormularioForm extends Vue {
@Model('input', { default: () => ({}) }) @Model('input', { default: () => ({}) })
public readonly formularioValue!: Record<string, unknown> public readonly state!: Record<string, unknown>
// Errors record, describing state validation errors of whole form // Errors record, describing state validation errors of whole form
@Prop({ default: () => ({}) }) readonly errors!: Record<string, string[]> @Prop({ default: () => ({}) }) readonly errors!: Record<string, string[]>
@ -52,9 +52,9 @@ export default class FormularioForm extends Vue {
private localFieldErrors: Record<string, string[]> = {} private localFieldErrors: Record<string, string[]> = {}
get initialValues (): Record<string, unknown> { get initialValues (): Record<string, unknown> {
if (this.hasModel && typeof this.formularioValue === 'object') { if (this.hasModel && typeof this.state === 'object') {
// If there is a v-model on the form/group, use those values as first priority // If there is a v-model on the form/group, use those values as first priority
return { ...this.formularioValue } // @todo - use a deep clone to detach reference types return { ...this.state } // @todo - use a deep clone to detach reference types
} }
return {} return {}
@ -69,15 +69,15 @@ export default class FormularioForm extends Vue {
} }
get hasModel (): boolean { get hasModel (): boolean {
return has(this.$options.propsData || {}, 'formularioValue') return has(this.$options.propsData || {}, 'state')
} }
get hasInitialValue (): boolean { get hasInitialValue (): boolean {
return this.formularioValue && typeof this.formularioValue === 'object' return this.state && typeof this.state === 'object'
} }
@Watch('formularioValue', { deep: true }) @Watch('state', { deep: true })
onFormularioValueChange (values: Record<string, unknown>): void { onStateChange (values: Record<string, unknown>): void {
if (this.hasModel && values && typeof values === 'object') { if (this.hasModel && values && typeof values === 'object') {
this.setValues(values) this.setValues(values)
} }

4
test/unit/FormularioFieldGroup.test.js
View File

@ -39,7 +39,7 @@ describe('FormularioFieldGroup', () => {
it('Grouped fields to be got', async () => { it('Grouped fields to be got', async () => {
const wrapper = mount(FormularioForm, { const wrapper = mount(FormularioForm, {
propsData: { propsData: {
formularioValue: { state: {
group: { text: 'Group text' }, group: { text: 'Group text' },
text: 'Text', text: 'Text',
}, },
@ -80,7 +80,7 @@ describe('FormularioFieldGroup', () => {
it('Errors are set for grouped fields', async () => { it('Errors are set for grouped fields', async () => {
const wrapper = mount(FormularioForm, { const wrapper = mount(FormularioForm, {
propsData: { propsData: {
formularioValue: {}, state: {},
errors: { 'group.text': 'Test error' }, errors: { 'group.text': 'Test error' },
}, },
slots: { slots: {

8
test/unit/FormularioForm.test.js
View File

@ -40,7 +40,7 @@ describe('FormularioForm', () => {
it('Adds subcomponents to the registry', () => { it('Adds subcomponents to the registry', () => {
const wrapper = mount(FormularioForm, { const wrapper = mount(FormularioForm, {
propsData: { formularioValue: {} }, propsData: { state: {} },
slots: { slots: {
default: ` default: `
<FormularioField name="sub1" /> <FormularioField name="sub1" />
@ -97,7 +97,7 @@ describe('FormularioForm', () => {
it('Can set a field’s initial value', async () => { it('Can set a field’s initial value', async () => {
const wrapper = mount(FormularioForm, { const wrapper = mount(FormularioForm, {
propsData: { formularioValue: { test: 'Has initial value' } }, propsData: { state: { test: 'Has initial value' } },
slots: { slots: {
default: ` default: `
<FormularioField v-slot="{ context }" validation="required|in:bar" name="test" > <FormularioField v-slot="{ context }" validation="required|in:bar" name="test" >
@ -112,7 +112,7 @@ describe('FormularioForm', () => {
it('Lets individual fields override form initial value', () => { it('Lets individual fields override form initial value', () => {
const wrapper = mount(FormularioForm, { const wrapper = mount(FormularioForm, {
propsData: { formularioValue: { test: 'has initial value' } }, propsData: { state: { test: 'has initial value' } },
slots: { slots: {
default: ` default: `
<FormularioField v-slot="{ context }" name="test" value="123"> <FormularioField v-slot="{ context }" name="test" value="123">
@ -191,7 +191,7 @@ describe('FormularioForm', () => {
it('Updates calls setFieldValue on form when a field contains a populated v-model on registration', () => { it('Updates calls setFieldValue on form when a field contains a populated v-model on registration', () => {
const wrapper = mount(FormularioForm, { const wrapper = mount(FormularioForm, {
propsData: { propsData: {
formularioValue: { test: 'Initial' } state: { test: 'Initial' },
}, },
slots: { slots: {
default: '<FormularioField name="test" value="Overrides" />' default: '<FormularioField name="test" value="Overrides" />'