Fix selection on modal, fix a typo

atst/models/environment_role.py

@@ -7,7 +7,7 @@ from atst.models import Base, types, mixins
 
 
 class CSPRole(Enum):
-    NONSENSE_ROLE = "nonesense_role"
+    NONSENSE_ROLE = "nonsense_role"
 
 
 class EnvironmentRole(Base, mixins.TimestampsMixin):

js/components/forms/edit_workspace_member.js

@@ -0,0 +1,40 @@
+import FormMixin from '../../mixins/form'
+import textinput from '../text_input'
+import Selector from '../selector'
+import Modal from '../../mixins/modal'
+import toggler from '../toggler'
+
+export default {
+  name: 'edit-workspace-member',
+
+  mixins: [FormMixin, Modal],
+
+  components: {
+    toggler,
+    Modal,
+    Selector,
+    textinput
+  },
+
+  props: {
+    choices: Array,
+    initialData: String
+  },
+
+  data: function () {
+    return { value: this.initialData }
+  },
+
+  methods: {
+    change: function (e) {
+      this.value = e.target.value
+    },
+    readableName: function (role) {
+      return role.replace(/[_]/g, " ")
+    },
+  },
+
+  mounted: function () {
+    console.log(this.initialData, this.choices)
+  }
+}

templates/workspaces/members/edit.html

@@ -52,23 +52,16 @@
   {% call Modal(name='rolesModal', dismissable=False) %}
   <div class="block-list">
     <header class="block-list__header">
-      <div>
       <h2 class="block-list__title">
-          Environment access for Danny Knight
+        Environment access for {{ member.user.full_name }}
         <div class='subtitle'>Project Name - Environment Name</div>
       </h2>
-        <div class="block-list__description">
-          <p>An environment role determines the permissions a member of the workspace assumes when using the JEDI Cloud.</p>
-          <p>A member may have different environment roles across different projects. A member can only have one assigned environment role in a given environment.</p>
-        </div>
-      </div>
     </header>
 
-    <form method="post" action="">
     <ul>
       <li class='block-list__item block-list__item--selectable'>
-          <input type='radio' name='radio' id='radio-' />
+        <input type='radio' name='radio' id='developer' />
-          <label for='radio-'>
+        <label for='developer'>
           <dl>
             <dt>Developer</dt>
             <dd>Configures cloud-based IaaS and PaaS computing, networking, and storage services.</dd>
@@ -77,8 +70,8 @@
       </li>
 
       <li class='block-list__item block-list__item--selectable'>
-          <input type='radio' name='radio' id='radio-' />
+        <input type='radio' name='radio' id='database_admin' />
-          <label for='radio-'>
+        <label for='database_admin'>
           <dl>
             <dt>Database Administrator</dt>
             <dd>Configures cloud-based database services.</dd>
@@ -87,8 +80,8 @@
       </li>
 
       <li class='block-list__item block-list__item--selectable'>
-          <input type='radio' name='radio' id='radio-' />
+        <input type='radio' name='radio' id='devops' />
-          <label for='radio-'>
+        <label for='devops'>
           <dl>
             <dt>DevOps</dt>
             <dd>Provisions, deprovisions, and deploys cloud-based IaaS and PaaS computing, networking, and storage services, including pre-configured machine images.</dd>
@@ -97,18 +90,18 @@
       </li>
 
       <li class='block-list__item block-list__item--selectable'>
-          <input type='radio' name='radio' id='radio-' />
+        <input type='radio' name='radio' id='billing_admin' />
-          <label for='radio-'>
+        <label for='billing_admin'>
           <dl>
             <dt>Billing Administrator</dt>
-              <dd>Views cloud resource usage, budget reports, and invoices; tracks budgets, including spend reports, cost planning and projections, and sets limits based on cloud service usage.</dd>
+            <dd>Views cloud resource usage, budget reports, and invoices; Tracks budgets, including spend reports, cost planning and projections, and sets limits based on cloud service usage.</dd>
           </dl>
         </label>
       </li>
 
       <li class='block-list__item block-list__item--selectable'>
-          <input type='radio' name='radio' id='radio-' />
+        <input type='radio' name='radio' id='security_admin' />
-          <label for='radio-'>
+        <label for='security_admin'>
           <dl>
             <dt>Security Administrator</dt>
             <dd>Accesses information security and control tools of cloud resources which include viewing cloud resource usage logging, user roles and permissioning history.</dd>
@@ -117,8 +110,8 @@
       </li>
 
       <li class='block-list__item block-list__item--selectable'>
-          <input type='radio' name='radio' id='radio-' />
+        <input type='radio' name='radio' id='financial_auditor' />
-          <label for='radio-'>
+        <label for='financial_auditor'>
           <dl>
             <dt>Financial Auditor</dt>
             <dd>Views cloud resource usage and budget reports.</dd>
@@ -133,7 +126,6 @@
         <a class='action-group__action icon-link icon-link--danger' v-on:click="closeModal('rolesModal')">No Access</a>
       </div>
     </div>
-    </form>
 
   </div>