diff --git a/atst/routes/applications/settings.py b/atst/routes/applications/settings.py index e12a66f9..0ca20a27 100644 --- a/atst/routes/applications/settings.py +++ b/atst/routes/applications/settings.py @@ -85,21 +85,33 @@ def update_environment(environment_id): environment = Environments.get(environment_id) application = environment.application - form = EditEnvironmentForm(formdata=http_request.form) + env_form = EditEnvironmentForm(obj=environment, formdata=http_request.form) - if form.validate(): - Environments.update(environment=environment, name=form.name.data) + if env_form.validate(): + Environments.update(environment=environment, name=env_form.name.data) - flash("application_environments_updated") + flash("application_environments_updated") - return redirect( - url_for( - "applications.settings", - application_id=application.id, - fragment="application-environments", - _anchor="application-environments", + return redirect( + url_for( + "applications.settings", + application_id=application.id, + fragment="application-environments", + _anchor="application-environments", + ) + ) + else: + return ( + render_template( + "portfolios/applications/settings.html", + application=application, + form=ApplicationForm( + name=application.name, description=application.description + ), + environments_obj=get_environments_obj_for_app(application=application), + ), + 400, ) - ) @applications_bp.route("/applications//edit", methods=["POST"]) diff --git a/js/components/toggler.js b/js/components/toggler.js index ff3d55c5..39eca87f 100644 --- a/js/components/toggler.js +++ b/js/components/toggler.js @@ -12,7 +12,7 @@ export default { data: function() { return { - selectedSection: null, + selectedSection: this.initialSelectedSection, } }, diff --git a/js/mixins/form.js b/js/mixins/form.js index 5436f821..497497b1 100644 --- a/js/mixins/form.js +++ b/js/mixins/form.js @@ -1,23 +1,53 @@ export default { + props: { + initialSelectedSection: String, + }, + mounted: function() { this.$root.$on('field-change', this.handleFieldChange) }, + created: function() { + this.$root.$on('field-mount', this.handleFieldMount) + }, + methods: { handleFieldChange: function(event) { - const { value, name } = event + const { name, valid, parent_uid } = event if (typeof this[name] !== undefined) { - this[name] = value - if (event['parent_uid'] === this._uid) { + this.fields[name] = valid + + if (parent_uid === this._uid) { this.changed = true } } + + this.validateForm() + }, + + handleFieldMount: function(event) { + const { name, optional } = event + this.fields[name] = optional + }, + + validateForm: function() { + const valid = !Object.values(this.fields).some(field => field === false) + this.invalid = !valid + return valid + }, + + handleSubmit: function(event) { + if (this.invalid) { + event.preventDefault() + } }, }, data: function() { return { changed: this.hasChanges, + fields: {}, + invalid: true, } }, diff --git a/script/format b/script/format index c25b320e..376531d4 100755 --- a/script/format +++ b/script/format @@ -9,6 +9,5 @@ if [ "$1" == "check" ]; then else pipenv run black ${FILES_TO_FORMAT} yarn run prettier --list-different --write "js/**/*.js" --config ./prettier.config.json - tt yarn run prettier --list-different --write "styles/**/*.scss" fi diff --git a/templates/components/save_button.html b/templates/components/save_button.html index 4adb6e37..919cc73b 100644 --- a/templates/components/save_button.html +++ b/templates/components/save_button.html @@ -1,10 +1,10 @@ {% macro SaveButton(text, element="button", additional_classes="", form=None) -%} {% set class = "usa-button usa-button-primary" + additional_classes %} {% if element == "button" %} - {% elif element == 'input' %} - + {% endif %} {%- endmacro %} diff --git a/templates/fragments/applications/edit_environments.html b/templates/fragments/applications/edit_environments.html index cd27c2d3..f821e4bf 100644 --- a/templates/fragments/applications/edit_environments.html +++ b/templates/fragments/applications/edit_environments.html @@ -48,11 +48,12 @@