Update emitters for vue components on portfolio settings page
This commit is contained in:
parent
b6e8db2e50
commit
d4facd1e36
@ -1,4 +1,4 @@
|
|||||||
import FormMixin from '../../mixins/form'
|
import FormMixin from '../../mixins/form_mixin'
|
||||||
import textinput from '../text_input'
|
import textinput from '../text_input'
|
||||||
import optionsinput from '../options_input'
|
import optionsinput from '../options_input'
|
||||||
import checkboxinput from '../checkbox_input'
|
import checkboxinput from '../checkbox_input'
|
||||||
@ -25,23 +25,16 @@ export default {
|
|||||||
data: function() {
|
data: function() {
|
||||||
return {
|
return {
|
||||||
step: 0,
|
step: 0,
|
||||||
fields: {},
|
|
||||||
invalid: true,
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
created: function() {
|
|
||||||
this.$root.$on('field-mount', this.handleFieldMount)
|
|
||||||
},
|
|
||||||
|
|
||||||
mounted: function() {
|
mounted: function() {
|
||||||
this.$root.$on('field-change', this.handleValidChange)
|
|
||||||
this.$root.$on('modalOpen', this.handleModalOpen)
|
this.$root.$on('modalOpen', this.handleModalOpen)
|
||||||
},
|
},
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
next: function() {
|
next: function() {
|
||||||
if (this._checkIsValid()) {
|
if (this.validateFields()) {
|
||||||
this.step += 1
|
this.step += 1
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -49,27 +42,10 @@ export default {
|
|||||||
this.step -= 1
|
this.step -= 1
|
||||||
},
|
},
|
||||||
goToStep: function(step) {
|
goToStep: function(step) {
|
||||||
if (this._checkIsValid()) {
|
if (this.validateFields()) {
|
||||||
this.step = step
|
this.step = step
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
handleValidChange: function(event) {
|
|
||||||
const { name, valid, parent_uid } = event
|
|
||||||
// check that this field is in the modal and not on some other form
|
|
||||||
if (parent_uid === this._uid) {
|
|
||||||
this.fields[name] = valid
|
|
||||||
this._checkIsValid()
|
|
||||||
}
|
|
||||||
},
|
|
||||||
_checkIsValid: function() {
|
|
||||||
const valid = !Object.values(this.fields).some(field => field === false)
|
|
||||||
this.invalid = !valid
|
|
||||||
return valid
|
|
||||||
},
|
|
||||||
handleFieldMount: function(event) {
|
|
||||||
const { name, optional } = event
|
|
||||||
this.fields[name] = optional
|
|
||||||
},
|
|
||||||
handleModalOpen: function(_bool) {
|
handleModalOpen: function(_bool) {
|
||||||
this.step = 0
|
this.step = 0
|
||||||
},
|
},
|
||||||
@ -77,12 +53,10 @@ export default {
|
|||||||
return this.step === this.steps - 1
|
return this.step === this.steps - 1
|
||||||
},
|
},
|
||||||
handleSubmit: function(e) {
|
handleSubmit: function(e) {
|
||||||
if (this.invalid || !this._onLastPage()) {
|
if (!this.validateFields() || !this._onLastPage()) {
|
||||||
e.preventDefault()
|
e.preventDefault()
|
||||||
this.next()
|
this.next()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
computed: {},
|
|
||||||
}
|
}
|
||||||
|
@ -45,7 +45,7 @@
|
|||||||
<input
|
<input
|
||||||
type='button'
|
type='button'
|
||||||
v-on:click="next()"
|
v-on:click="next()"
|
||||||
v-bind:disabled="invalid"
|
v-bind:disabled="!canSave"
|
||||||
class='action-group__action usa-button usa-button-primary'
|
class='action-group__action usa-button usa-button-primary'
|
||||||
value='Next'>
|
value='Next'>
|
||||||
<a class='action-group__action' v-on:click="closeModal('{{ new_port_mem }}')">Cancel</a>
|
<a class='action-group__action' v-on:click="closeModal('{{ new_port_mem }}')">Cancel</a>
|
||||||
|
@ -32,7 +32,7 @@
|
|||||||
<input
|
<input
|
||||||
type='button'
|
type='button'
|
||||||
v-on:click="next()"
|
v-on:click="next()"
|
||||||
v-bind:disabled="invalid"
|
v-bind:disabled="!canSave"
|
||||||
class='action-group__action usa-button'
|
class='action-group__action usa-button'
|
||||||
value='{{ "fragments.ppoc.assign_user_button_text" | translate }}'>
|
value='{{ "fragments.ppoc.assign_user_button_text" | translate }}'>
|
||||||
<a class='action-group__action icon-link icon-link--default' v-on:click="closeModal('change-ppoc-form')">
|
<a class='action-group__action icon-link icon-link--default' v-on:click="closeModal('change-ppoc-form')">
|
||||||
|
@ -4,11 +4,11 @@
|
|||||||
{% from "components/alert.html" import Alert %}
|
{% from "components/alert.html" import Alert %}
|
||||||
|
|
||||||
<section class="member-list" id="portfolio-members">
|
<section class="member-list" id="portfolio-members">
|
||||||
<base-form inline-template>
|
<div class='responsive-table-wrapper panel accordion-table'>
|
||||||
<div class='responsive-table-wrapper panel accordion-table'>
|
{% if g.matchesPath("portfolio-members") %}
|
||||||
{% if g.matchesPath("portfolio-members") %}
|
{% include "fragments/flash.html" %}
|
||||||
{% include "fragments/flash.html" %}
|
{% endif %}
|
||||||
{% endif %}
|
<base-form inline-template>
|
||||||
<form method='POST' id="member-perms" action='{{ url_for("portfolios.edit_members", portfolio_id=portfolio.id) }}' autocomplete="off" enctype="multipart/form-data">
|
<form method='POST' id="member-perms" action='{{ url_for("portfolios.edit_members", portfolio_id=portfolio.id) }}' autocomplete="off" enctype="multipart/form-data">
|
||||||
{{ member_perms_form.csrf_token }}
|
{{ member_perms_form.csrf_token }}
|
||||||
|
|
||||||
@ -72,35 +72,34 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
{% if user_can(permissions.CREATE_PORTFOLIO_USERS) %}
|
</base-form>
|
||||||
{% include "portfolios/fragments/add_new_portfolio_member.html" %}
|
{% if user_can(permissions.EDIT_PORTFOLIO_USERS) %}
|
||||||
{% endif %}
|
{% for subform in member_perms_form.members_permissions %}
|
||||||
|
{% set modal_id = "portfolio_id_{}_user_id_{}".format(portfolio.id, subform.member_id.data) %}
|
||||||
{% if user_can(permissions.EDIT_PORTFOLIO_USERS) %}
|
{% call Modal(name=modal_id, dismissable=False) %}
|
||||||
{% for subform in member_perms_form.members_permissions %}
|
<h1>{{ "portfolios.admin.alert_header" | translate }}</h1>
|
||||||
{% set modal_id = "portfolio_id_{}_user_id_{}".format(portfolio.id, subform.member_id.data) %}
|
<hr>
|
||||||
{% call Modal(name=modal_id, dismissable=False) %}
|
{{
|
||||||
<h1>{{ "portfolios.admin.alert_header" | translate }}</h1>
|
Alert(
|
||||||
<hr>
|
title="portfolios.admin.alert_title" | translate,
|
||||||
{{
|
message="portfolios.admin.alert_message" | translate,
|
||||||
Alert(
|
level="warning"
|
||||||
title="portfolios.admin.alert_title" | translate,
|
)
|
||||||
message="portfolios.admin.alert_message" | translate,
|
}}
|
||||||
level="warning"
|
<div class="action-group">
|
||||||
)
|
<form method="POST" action="{{ url_for('portfolios.remove_member', portfolio_id=portfolio.id, portfolio_role_id=subform.member_id.data)}}">
|
||||||
}}
|
{{ member_perms_form.csrf_token }}
|
||||||
<div class="action-group">
|
<button class="usa-button usa-button-danger">
|
||||||
<form method="POST" action="{{ url_for('portfolios.remove_member', portfolio_id=portfolio.id, portfolio_role_id=subform.member_id.data)}}">
|
{{ "portfolios.members.archive_button" | translate }}
|
||||||
{{ member_perms_form.csrf_token }}
|
</button>
|
||||||
<button class="usa-button usa-button-danger">
|
</form>
|
||||||
{{ "portfolios.members.archive_button" | translate }}
|
<a v-on:click="closeModal('{{ modal_id }}')" class="action-group__action icon-link icon-link--default">{{ "common.cancel" | translate }}</a>
|
||||||
</button>
|
</div>
|
||||||
</form>
|
{% endcall %}
|
||||||
<a v-on:click="closeModal('{{ modal_id }}')" class="action-group__action icon-link icon-link--default">{{ "common.cancel" | translate }}</a>
|
{% endfor %}
|
||||||
</div>
|
{% endif %}
|
||||||
{% endcall %}
|
</div>
|
||||||
{% endfor %}
|
{% if user_can(permissions.CREATE_PORTFOLIO_USERS) %}
|
||||||
{% endif %}
|
{% include "portfolios/fragments/add_new_portfolio_member.html" %}
|
||||||
</div>
|
{% endif %}
|
||||||
</base-form>
|
|
||||||
</section>
|
</section>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user