Use object for selector component

This commit is contained in:
richard-dds 2018-08-31 13:58:25 -04:00
parent c78aac2dea
commit b1326a7c75
3 changed files with 31 additions and 17 deletions

View File

@ -106,27 +106,37 @@ COMPLETION_DATE_RANGES = [
WORKSPACE_ROLES = [
(
"owner",
"Workspace Owner",
"Can add, edit, deactivate access to all projects, environments, and members. Can view budget reports. Can start and edit JEDI Cloud requests.",
{
"name": "Workspace Owner",
"description": "Can add, edit, deactivate access to all projects, environments, and members. Can view budget reports. Can start and edit JEDI Cloud requests.",
},
),
(
"admin",
"Administrator",
"Can add and edit projects, environments, members, but cannot deactivate. Cannot view budget reports or JEDI Cloud requests.",
{
"name": "Administrator",
"description": "Can add and edit projects, environments, members, but cannot deactivate. Cannot view budget reports or JEDI Cloud requests.",
},
),
(
"developer",
"Developer",
"Can view only the projects and environments they are granted access to. Can also view members associated with each environment.",
{
"name": "Developer",
"description": "Can view only the projects and environments they are granted access to. Can also view members associated with each environment.",
},
),
(
"billing_auditor",
"Billing Auditor",
"Can view only the projects and environments they are granted access to. Can also view budgets and reports associated with the workspace.",
{
"name": "Billing Auditor",
"description": "Can view only the projects and environments they are granted access to. Can also view budgets and reports associated with the workspace.",
},
),
(
"security_auditor",
"Security Auditor",
"Can view only the projects and environments they are granted access to. Can also view activity logs.",
{
"name": "Security Auditor",
"description": "Can view only the projects and environments they are granted access to. Can also view activity logs.",
},
),
]

View File

@ -26,17 +26,21 @@ export default {
computed: {
label: function () {
return this.value
? this.choices.find((choice) => {
if (this.value) {
const selectedChoice = this.choices.find((choice) => {
return this.value === choice[0]
})[1]
: this.defaultLabel
return selectedChoice.name
} else {
return this.defaultLabel
}
}
},
methods: {
change: function (e) {
this.value = e.target.value
console.log(this.value)
this.showError = false
setTimeout(() => this.$refs.popover.hide(), 300)
}

View File

@ -44,13 +44,13 @@
v-bind:checked='value === choice[0]'
v-on:change='change'/>
<label v-bind:for="'{{ field.name }}_' + choice[0]">
<template v-if='choices[2]'>
<template v-if='choice[1].description'>
<dl>
<dt v-html='choice[1]'></dt>
<dd v-html='choice[2]'></dd>
<dt v-html='choice[1].name'></dt>
<dd v-html='choice[1].description'></dd>
</dl>
</template>
<span v-else v-html='choice[1]'>
<span v-else v-html='choice[1].name'>
</label>
</template>
</li>