Bug 32030: Rebase UI fix - Use page-section for better separation in forms
Signed-off-by: Jonathan Field <jonathan.field@ptfs-europe.com> Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com> Signed-off-by: Kyle M Hall <kyle@bywatersolutions.com> Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>
This commit is contained in:
parent
94e854a692
commit
2197809353
GPG key ID:
0A272EA1B2F3C15F
7 changed files with 284 additions and 261 deletions
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<fieldset class="rows" id="agreement_licenses">
|
||||
<div class="page-section" id="agreement_licenses">
|
||||
<legend>{{ $t("Licenses") }}</legend>
|
||||
<fieldset
|
||||
:id="`agreement_license_${counter}`"
|
||||
|
|
@ -97,7 +97,7 @@
|
|||
><font-awesome-icon icon="plus" /> {{ $t("Add new license") }}</a
|
||||
>
|
||||
<span v-else>{{ $t("There are no licenses created yet") }}</span>
|
||||
</fieldset>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<fieldset class="rows" id="agreement_periods">
|
||||
<div class="page-section" id="agreement_periods">
|
||||
<legend>{{ $t("Periods") }}</legend>
|
||||
<fieldset
|
||||
:id="`agreement_period_${counter}`"
|
||||
|
|
@ -63,7 +63,7 @@
|
|||
<a class="btn btn-default" @click="addPeriod"
|
||||
><font-awesome-icon icon="plus" /> {{ $t("Add new period") }}</a
|
||||
>
|
||||
</fieldset>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<fieldset class="rows" id="agreement_relationships">
|
||||
<div class="page-section" id="agreement_relationships">
|
||||
<legend>{{ $t("Related agreements") }}</legend>
|
||||
<fieldset
|
||||
class="rows"
|
||||
|
|
@ -80,7 +80,7 @@
|
|||
<span v-else>{{
|
||||
$t("There are no other agreements created yet")
|
||||
}}</span>
|
||||
</fieldset>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<fieldset class="rows" id="agreement_user_roles">
|
||||
<div class="page-section" id="agreement_user_roles">
|
||||
<legend>{{ $t("Users") }}</legend>
|
||||
<fieldset
|
||||
class="rows"
|
||||
|
|
@ -57,7 +57,7 @@
|
|||
<a class="btn btn-default" @click="addUser"
|
||||
><font-awesome-icon icon="plus" /> {{ $t("Add new user") }}</a
|
||||
>
|
||||
</fieldset>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
|||
|
|
@ -7,157 +7,166 @@
|
|||
<h2 v-else>{{ $t("New agreement") }}</h2>
|
||||
<div>
|
||||
<form @submit="onSubmit($event)">
|
||||
<fieldset class="rows">
|
||||
<ol>
|
||||
<li>
|
||||
<label class="required" for="agreement_name"
|
||||
>{{ $t("Agreement name") }}:</label
|
||||
>
|
||||
<input
|
||||
id="agreement_name"
|
||||
v-model="agreement.name"
|
||||
:placeholder="$t('Agreement name')"
|
||||
required
|
||||
/>
|
||||
<span class="required">{{ $t("Required") }}</span>
|
||||
</li>
|
||||
<li>
|
||||
<label for="agreement_vendor_id"
|
||||
>{{ $t("Vendor") }}:</label
|
||||
>
|
||||
<v-select
|
||||
id="agreement_vendor_id"
|
||||
v-model="agreement.vendor_id"
|
||||
label="name"
|
||||
:reduce="(vendor) => vendor.id"
|
||||
:options="vendors"
|
||||
/>
|
||||
</li>
|
||||
<li>
|
||||
<label for="agreement_description"
|
||||
>{{ $t("Description") }}:
|
||||
</label>
|
||||
<textarea
|
||||
id="agreement_description"
|
||||
v-model="agreement.description"
|
||||
:placeholder="$t('Description')"
|
||||
rows="10"
|
||||
cols="50"
|
||||
required
|
||||
/>
|
||||
<span class="required">{{ $t("Required") }}</span>
|
||||
</li>
|
||||
<li>
|
||||
<label for="agreement_status"
|
||||
>{{ $t("Status") }}:</label
|
||||
>
|
||||
<v-select
|
||||
id="agreement_status"
|
||||
v-model="agreement.status"
|
||||
label="lib"
|
||||
:reduce="(av) => av.authorised_value"
|
||||
:options="av_agreement_statuses"
|
||||
@option:selected="onStatusChanged"
|
||||
:required="!agreement.status"
|
||||
>
|
||||
<template #search="{ attributes, events }">
|
||||
<div class="page-section">
|
||||
<fieldset class="rows">
|
||||
<ol>
|
||||
<li>
|
||||
<label class="required" for="agreement_name"
|
||||
>{{ $t("Agreement name") }}:</label
|
||||
>
|
||||
<input
|
||||
id="agreement_name"
|
||||
v-model="agreement.name"
|
||||
:placeholder="$t('Agreement name')"
|
||||
required
|
||||
/>
|
||||
<span class="required">{{
|
||||
$t("Required")
|
||||
}}</span>
|
||||
</li>
|
||||
<li>
|
||||
<label for="agreement_vendor_id"
|
||||
>{{ $t("Vendor") }}:</label
|
||||
>
|
||||
<v-select
|
||||
id="agreement_vendor_id"
|
||||
v-model="agreement.vendor_id"
|
||||
label="name"
|
||||
:reduce="(vendor) => vendor.id"
|
||||
:options="vendors"
|
||||
/>
|
||||
</li>
|
||||
<li>
|
||||
<label for="agreement_description"
|
||||
>{{ $t("Description") }}:
|
||||
</label>
|
||||
<textarea
|
||||
id="agreement_description"
|
||||
v-model="agreement.description"
|
||||
:placeholder="$t('Description')"
|
||||
rows="10"
|
||||
cols="50"
|
||||
required
|
||||
/>
|
||||
<span class="required">{{
|
||||
$t("Required")
|
||||
}}</span>
|
||||
</li>
|
||||
<li>
|
||||
<label for="agreement_status"
|
||||
>{{ $t("Status") }}:</label
|
||||
>
|
||||
<v-select
|
||||
id="agreement_status"
|
||||
v-model="agreement.status"
|
||||
label="lib"
|
||||
:reduce="(av) => av.authorised_value"
|
||||
:options="av_agreement_statuses"
|
||||
@option:selected="onStatusChanged"
|
||||
:required="!agreement.status"
|
||||
>
|
||||
<template #search="{ attributes, events }">
|
||||
<input
|
||||
:required="!agreement.status"
|
||||
class="vs__search"
|
||||
v-bind="attributes"
|
||||
v-on="events"
|
||||
/>
|
||||
</template>
|
||||
</v-select>
|
||||
<span class="required">{{
|
||||
$t("Required")
|
||||
}}</span>
|
||||
</li>
|
||||
<li>
|
||||
<label for="agreement_closure_reason"
|
||||
>{{ $t("Closure reason") }}:</label
|
||||
>
|
||||
<v-select
|
||||
id="agreement_closure_reason"
|
||||
v-model="agreement.closure_reason"
|
||||
label="lib"
|
||||
:reduce="(av) => av.authorised_value"
|
||||
:options="av_agreement_closure_reasons"
|
||||
:disabled="
|
||||
agreement.status == 'closed'
|
||||
? false
|
||||
: true
|
||||
"
|
||||
/>
|
||||
</li>
|
||||
<li>
|
||||
<label
|
||||
for="agreement_is_perpetual"
|
||||
class="radio"
|
||||
>{{ $t("Is perpetual") }}:</label
|
||||
>
|
||||
<label for="agreement_is_perpetual_yes">
|
||||
<input
|
||||
:required="!agreement.status"
|
||||
class="vs__search"
|
||||
v-bind="attributes"
|
||||
v-on="events"
|
||||
type="radio"
|
||||
name="is_perpetual"
|
||||
id="agreement_is_perpetual_yes"
|
||||
:value="true"
|
||||
v-model="agreement.is_perpetual"
|
||||
/>
|
||||
</template>
|
||||
</v-select>
|
||||
<span class="required">{{ $t("Required") }}</span>
|
||||
</li>
|
||||
<li>
|
||||
<label for="agreement_closure_reason"
|
||||
>{{ $t("Closure reason") }}:</label
|
||||
>
|
||||
<v-select
|
||||
id="agreement_closure_reason"
|
||||
v-model="agreement.closure_reason"
|
||||
label="lib"
|
||||
:reduce="(av) => av.authorised_value"
|
||||
:options="av_agreement_closure_reasons"
|
||||
:disabled="
|
||||
agreement.status == 'closed' ? false : true
|
||||
"
|
||||
/>
|
||||
</li>
|
||||
<li>
|
||||
<label for="agreement_is_perpetual" class="radio"
|
||||
>{{ $t("Is perpetual") }}:</label
|
||||
>
|
||||
<label for="agreement_is_perpetual_yes">
|
||||
<input
|
||||
type="radio"
|
||||
name="is_perpetual"
|
||||
id="agreement_is_perpetual_yes"
|
||||
:value="true"
|
||||
v-model="agreement.is_perpetual"
|
||||
Yes
|
||||
</label>
|
||||
<label for="agreement_is_perpetual_no">
|
||||
<input
|
||||
type="radio"
|
||||
name="is_perpetual"
|
||||
id="agreement_is_perpetual_no"
|
||||
:value="false"
|
||||
v-model="agreement.is_perpetual"
|
||||
/>
|
||||
No
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<label for="agreement_renewal_priority"
|
||||
>{{ $t("Renewal priority") }}:</label
|
||||
>
|
||||
<v-select
|
||||
id="agreement_renewal_priority"
|
||||
v-model="agreement.renewal_priority"
|
||||
label="lib"
|
||||
:reduce="(av) => av.authorised_value"
|
||||
:options="av_agreement_renewal_priorities"
|
||||
/>
|
||||
Yes
|
||||
</label>
|
||||
<label for="agreement_is_perpetual_no">
|
||||
<input
|
||||
type="radio"
|
||||
name="is_perpetual"
|
||||
id="agreement_is_perpetual_no"
|
||||
:value="false"
|
||||
v-model="agreement.is_perpetual"
|
||||
</li>
|
||||
<li>
|
||||
<label for="agreement_license_info"
|
||||
>{{ $t("License info") }}:
|
||||
</label>
|
||||
<textarea
|
||||
id="agreement_license_info"
|
||||
v-model="agreement.license_info"
|
||||
placeholder="License info"
|
||||
/>
|
||||
No
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<label for="agreement_renewal_priority"
|
||||
>{{ $t("Renewal priority") }}:</label
|
||||
>
|
||||
<v-select
|
||||
id="agreement_renewal_priority"
|
||||
v-model="agreement.renewal_priority"
|
||||
label="lib"
|
||||
:reduce="(av) => av.authorised_value"
|
||||
:options="av_agreement_renewal_priorities"
|
||||
/>
|
||||
</li>
|
||||
<li>
|
||||
<label for="agreement_license_info"
|
||||
>{{ $t("License info") }}:
|
||||
</label>
|
||||
<textarea
|
||||
id="agreement_license_info"
|
||||
v-model="agreement.license_info"
|
||||
placeholder="License info"
|
||||
/>
|
||||
</li>
|
||||
|
||||
<AgreementPeriods :periods="agreement.periods" />
|
||||
<AgreementUserRoles
|
||||
:user_roles="agreement.user_roles"
|
||||
:av_agreement_user_roles="av_agreement_user_roles"
|
||||
/>
|
||||
<AgreementLicenses
|
||||
:agreement_licenses="agreement.agreement_licenses"
|
||||
:av_agreement_license_statuses="
|
||||
av_agreement_license_statuses
|
||||
"
|
||||
:av_agreement_license_location="
|
||||
av_agreement_license_location
|
||||
"
|
||||
/>
|
||||
<AgreementRelationships
|
||||
:agreement_id="agreement.agreement_id"
|
||||
:relationships="agreement.agreement_relationships"
|
||||
:av_agreement_relationships="
|
||||
av_agreement_relationships
|
||||
"
|
||||
/>
|
||||
<Documents :documents="agreement.documents" />
|
||||
</ol>
|
||||
</fieldset>
|
||||
</li>
|
||||
</ol>
|
||||
</fieldset>
|
||||
</div>
|
||||
<AgreementPeriods :periods="agreement.periods" />
|
||||
<AgreementUserRoles
|
||||
:user_roles="agreement.user_roles"
|
||||
:av_agreement_user_roles="av_agreement_user_roles"
|
||||
/>
|
||||
<AgreementLicenses
|
||||
:agreement_licenses="agreement.agreement_licenses"
|
||||
:av_agreement_license_statuses="
|
||||
av_agreement_license_statuses
|
||||
"
|
||||
:av_agreement_license_location="
|
||||
av_agreement_license_location
|
||||
"
|
||||
/>
|
||||
<AgreementRelationships
|
||||
:agreement_id="agreement.agreement_id"
|
||||
:relationships="agreement.agreement_relationships"
|
||||
:av_agreement_relationships="av_agreement_relationships"
|
||||
/>
|
||||
<Documents :documents="agreement.documents" />
|
||||
<fieldset class="action">
|
||||
<input type="submit" value="Submit" />
|
||||
<router-link
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<fieldset class="rows" id="documents">
|
||||
<div class="page-section" id="documents">
|
||||
<legend>{{ $t("Documents") }}</legend>
|
||||
<fieldset
|
||||
:id="`document_${counter}`"
|
||||
|
|
@ -102,7 +102,7 @@
|
|||
<a class="btn btn-default" @click="addDocument"
|
||||
><font-awesome-icon icon="plus" /> {{ $t("Add new document") }}</a
|
||||
>
|
||||
</fieldset>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
|||
|
|
@ -7,110 +7,124 @@
|
|||
<h2 v-else>{{ $t("New license") }}</h2>
|
||||
<div>
|
||||
<form @submit="onSubmit($event)">
|
||||
<fieldset class="rows">
|
||||
<ol>
|
||||
<li>
|
||||
<label class="required" for="license_name"
|
||||
>{{ $t("License name") }}:</label
|
||||
>
|
||||
<input
|
||||
id="license_name"
|
||||
v-model="license.name"
|
||||
:placeholder="$t('License name')"
|
||||
required
|
||||
/>
|
||||
<span class="required">{{ $t("Required") }}</span>
|
||||
</li>
|
||||
<li>
|
||||
<label for="license_vendor_id"
|
||||
>{{ $t("Vendor") }}:</label
|
||||
>
|
||||
<v-select
|
||||
id="license_vendor_id"
|
||||
v-model="license.vendor_id"
|
||||
label="name"
|
||||
:reduce="(vendor) => vendor.id"
|
||||
:options="vendors"
|
||||
/>
|
||||
</li>
|
||||
<li>
|
||||
<label for="license_description"
|
||||
>{{ $t("Description") }}:
|
||||
</label>
|
||||
<textarea
|
||||
id="license_description"
|
||||
v-model="license.description"
|
||||
:placeholder="$t('Description')"
|
||||
rows="10"
|
||||
cols="50"
|
||||
required
|
||||
/>
|
||||
<span class="required">{{ $t("Required") }}</span>
|
||||
</li>
|
||||
<li>
|
||||
<label for="license_type">{{ $t("Type") }}:</label>
|
||||
<v-select
|
||||
id="license_type"
|
||||
v-model="license.type"
|
||||
label="lib"
|
||||
:reduce="(av) => av.authorised_value"
|
||||
:options="av_license_types"
|
||||
>
|
||||
<template #search="{ attributes, events }">
|
||||
<input
|
||||
:required="!license.type"
|
||||
class="vs__search"
|
||||
v-bind="attributes"
|
||||
v-on="events"
|
||||
/>
|
||||
</template>
|
||||
</v-select>
|
||||
<span class="required">{{ $t("Required") }}</span>
|
||||
</li>
|
||||
<li>
|
||||
<label for="license_status"
|
||||
>{{ $t("Status") }}:</label
|
||||
>
|
||||
<v-select
|
||||
id="license_status"
|
||||
v-model="license.status"
|
||||
:reduce="(av) => av.authorised_value"
|
||||
:options="av_license_statuses"
|
||||
label="lib"
|
||||
>
|
||||
<template #search="{ attributes, events }">
|
||||
<input
|
||||
:required="!license.status"
|
||||
class="vs__search"
|
||||
v-bind="attributes"
|
||||
v-on="events"
|
||||
/>
|
||||
</template>
|
||||
</v-select>
|
||||
<span class="required">{{ $t("Required") }}</span>
|
||||
</li>
|
||||
<li>
|
||||
<label for="started_on"
|
||||
>{{ $t("Start date") }}:</label
|
||||
>
|
||||
<flat-pickr
|
||||
id="started_on"
|
||||
v-model="license.started_on"
|
||||
:config="fp_config"
|
||||
data-date_to="ended_on"
|
||||
/>
|
||||
</li>
|
||||
<li>
|
||||
<label for="ended_on">{{ $t("End date") }}:</label>
|
||||
<flat-pickr
|
||||
id="ended_on"
|
||||
v-model="license.ended_on"
|
||||
:config="fp_config"
|
||||
/>
|
||||
</li>
|
||||
<Documents :documents="license.documents" />
|
||||
</ol>
|
||||
</fieldset>
|
||||
<div class="page-section">
|
||||
<fieldset class="rows">
|
||||
<ol>
|
||||
<li>
|
||||
<label class="required" for="license_name"
|
||||
>{{ $t("License name") }}:</label
|
||||
>
|
||||
<input
|
||||
id="license_name"
|
||||
v-model="license.name"
|
||||
:placeholder="$t('License name')"
|
||||
required
|
||||
/>
|
||||
<span class="required">{{
|
||||
$t("Required")
|
||||
}}</span>
|
||||
</li>
|
||||
<li>
|
||||
<label for="license_vendor_id"
|
||||
>{{ $t("Vendor") }}:</label
|
||||
>
|
||||
<v-select
|
||||
id="license_vendor_id"
|
||||
v-model="license.vendor_id"
|
||||
label="name"
|
||||
:reduce="(vendor) => vendor.id"
|
||||
:options="vendors"
|
||||
/>
|
||||
</li>
|
||||
<li>
|
||||
<label for="license_description"
|
||||
>{{ $t("Description") }}:
|
||||
</label>
|
||||
<textarea
|
||||
id="license_description"
|
||||
v-model="license.description"
|
||||
:placeholder="$t('Description')"
|
||||
rows="10"
|
||||
cols="50"
|
||||
required
|
||||
/>
|
||||
<span class="required">{{
|
||||
$t("Required")
|
||||
}}</span>
|
||||
</li>
|
||||
<li>
|
||||
<label for="license_type"
|
||||
>{{ $t("Type") }}:</label
|
||||
>
|
||||
<v-select
|
||||
id="license_type"
|
||||
v-model="license.type"
|
||||
label="lib"
|
||||
:reduce="(av) => av.authorised_value"
|
||||
:options="av_license_types"
|
||||
>
|
||||
<template #search="{ attributes, events }">
|
||||
<input
|
||||
:required="!license.type"
|
||||
class="vs__search"
|
||||
v-bind="attributes"
|
||||
v-on="events"
|
||||
/>
|
||||
</template>
|
||||
</v-select>
|
||||
<span class="required">{{
|
||||
$t("Required")
|
||||
}}</span>
|
||||
</li>
|
||||
<li>
|
||||
<label for="license_status"
|
||||
>{{ $t("Status") }}:</label
|
||||
>
|
||||
<v-select
|
||||
id="license_status"
|
||||
v-model="license.status"
|
||||
:reduce="(av) => av.authorised_value"
|
||||
:options="av_license_statuses"
|
||||
label="lib"
|
||||
>
|
||||
<template #search="{ attributes, events }">
|
||||
<input
|
||||
:required="!license.status"
|
||||
class="vs__search"
|
||||
v-bind="attributes"
|
||||
v-on="events"
|
||||
/>
|
||||
</template>
|
||||
</v-select>
|
||||
<span class="required">{{
|
||||
$t("Required")
|
||||
}}</span>
|
||||
</li>
|
||||
<li>
|
||||
<label for="started_on"
|
||||
>{{ $t("Start date") }}:</label
|
||||
>
|
||||
<flat-pickr
|
||||
id="started_on"
|
||||
v-model="license.started_on"
|
||||
:config="fp_config"
|
||||
data-date_to="ended_on"
|
||||
/>
|
||||
</li>
|
||||
<li>
|
||||
<label for="ended_on"
|
||||
>{{ $t("End date") }}:</label
|
||||
>
|
||||
<flat-pickr
|
||||
id="ended_on"
|
||||
v-model="license.ended_on"
|
||||
:config="fp_config"
|
||||
/>
|
||||
</li>
|
||||
</ol>
|
||||
</fieldset>
|
||||
</div>
|
||||
<Documents :documents="license.documents" />
|
||||
<fieldset class="action">
|
||||
<input type="submit" :value="$t('Submit')" />
|
||||
<router-link
|
||||
|
|
|
|||
Loading…
Reference in a new issue