@byu-oit/vue-decision-processing-components 8.34.1 → 8.35.8

package/ApplicantInfo.vue

@@ -1,100 +1,100 @@
-<!--
-   Copyright 2018 Brigham Young University
-
-   Licensed under the Apache License, Version 2.0 (the "License");
-   you may not use this file except in compliance with the License.
-   You may obtain a copy of the License at
-
-       http://www.apache.org/licenses/LICENSE-2.0
-
-   Unless required by applicable law or agreed to in writing, software
-   distributed under the License is distributed on an "AS IS" BASIS,
-   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-   See the License for the specific language governing permissions and
-   limitations under the License.
--->
-<template>
-  <div class="applicant" slot="applicantInfo">
-    <em>{{ applicantType }}</em>
-    <div v-if="compact">
-      {{ netId }}
-    </div>
-    <div v-else>
-      {{ netId }}
-      |
-      {{ byuId }}
-      |
-      {{ dateOfBirth | dateFormat }}
-      |
-      {{ age }}
-      |
-      {{ sex }}
-      |
-      {{ religion }}
-    </div>
-    <div v-if="compact">
-      {{ admitPeriod | yearTerm }}
-      |
-      {{ applicationStatus }}
-    </div>
-    <div v-else>
-      {{ admitPeriod | yearTerm }}
-      |
-      {{ applicantMajor }}
-      |
-      {{ applicationStatus }}
-    </div>
-  </div>
-</template>
-<script>
-import { dateFormat } from './dateTimeFormat'
-import { mapState } from 'vuex'
-
-export default {
-  name: 'ApplicantInfo',
-  filters: { dateFormat },
-  props: {
-    compact: {
-      type: Boolean,
-      default: false
-    }
-  },
-  computed: {
-    ...mapState({
-      applicantType: state => state.packet.applicantType ? state.packet.applicantType : state.application.applicantType,
-      admitPeriod: state => state.application.admitPeriod,
-      applicantMajor: state => state.application.applicantMajor,
-      netId: state => state.application.netId,
-      byuId: state => state.application.applicantId,
-      dateOfBirth: state => state.application.personalRecords.dateOfBirth,
-      age: state => state.application.personalRecords.age,
-      sex: state => state.application.personalRecords.sex,
-      applicationStatus: state => state.application.applicationStatus,
-      religion: state => state.application.mission.religion
-    })
-  }
-}
-</script>
-<style scoped>
-.applicant {
-  display: grid;
-  grid-template-columns: auto 1fr;
-  grid-template-rows: auto auto;
-  grid-column-gap: 0.5rem;
-}
-.applicant > em {
-  grid-column: 1 / 2;
-  grid-row: 1 / -1;
-  font-size: 1.5rem;
-  font-style: normal;
-  align-self: center;
-  background-color: var(--light, #fafafa);
-  color: var(--dark, #333333);
-  border-radius: 50%;
-  width: 2.5rem;
-  height: 2.5rem;
-  text-align: center;
-  vertical-align: middle;
-  line-height: 1.55em;
-}
-</style>
+<!--
+   Copyright 2018 Brigham Young University
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.
+-->
+<template>
+  <div class="applicant" slot="applicantInfo">
+    <em>{{ applicantType }}</em>
+    <div v-if="compact">
+      {{ netId }}
+    </div>
+    <div v-else>
+      {{ netId }}
+      |
+      {{ byuId }}
+      |
+      {{ dateOfBirth | dateFormat }}
+      |
+      {{ age }}
+      |
+      {{ sex }}
+      |
+      {{ religion }}
+    </div>
+    <div v-if="compact">
+      {{ admitPeriod | yearTerm }}
+      |
+      {{ applicationStatus }}
+    </div>
+    <div v-else>
+      {{ admitPeriod | yearTerm }}
+      |
+      {{ applicantMajor }}
+      |
+      {{ applicationStatus }}
+    </div>
+  </div>
+</template>
+<script>
+import { dateFormat } from './dateTimeFormat'
+import { mapState } from 'vuex'
+
+export default {
+  name: 'ApplicantInfo',
+  filters: { dateFormat },
+  props: {
+    compact: {
+      type: Boolean,
+      default: false
+    }
+  },
+  computed: {
+    ...mapState({
+      applicantType: state => state.packet.applicantType ? state.packet.applicantType : state.application.applicantType,
+      admitPeriod: state => state.application.admitPeriod,
+      applicantMajor: state => state.application.applicantMajor,
+      netId: state => state.application.netId,
+      byuId: state => state.application.applicantId,
+      dateOfBirth: state => state.application.personalRecords.dateOfBirth,
+      age: state => state.application.personalRecords.age,
+      sex: state => state.application.personalRecords.sex,
+      applicationStatus: state => state.application.applicationStatus,
+      religion: state => state.application.mission.religion
+    })
+  }
+}
+</script>
+<style scoped>
+.applicant {
+  display: grid;
+  grid-template-columns: auto 1fr;
+  grid-template-rows: auto auto;
+  grid-column-gap: 0.5rem;
+}
+.applicant > em {
+  grid-column: 1 / 2;
+  grid-row: 1 / -1;
+  font-size: 1.5rem;
+  font-style: normal;
+  align-self: center;
+  background-color: var(--light, #fafafa);
+  color: var(--dark, #333333);
+  border-radius: 50%;
+  width: 2.5rem;
+  height: 2.5rem;
+  text-align: center;
+  vertical-align: middle;
+  line-height: 1.55em;
+}
+</style>

package/AssignmentBulkDialog.vue

@@ -1,153 +1,153 @@
-<template>
-  <modal
-  name="assignment-bulk-modal"
-  height="auto"
-  draggable
-  @before-open="beforeOpen"
-  >
-    <div class="bg-light p-1 text-uppercase">Bulk Reassignment</div>
-    <div class="assignment-buld-dialog content-padding">
-      <div v-if="bulkChange.total !== bulkChange.complete">
-        <h3>Reassigning...({{ bulkChange.complete }}/{{ bulkChange.total }})</h3>
-        <div class="progress">
-          <div class="progress-bar bg-primary"
-               role="progressbar"
-               :aria-valuenow="bulkChange.complete"
-               aria-valuemin="0"
-               :aria-valuemax="bulkChange.total"
-               :style="`width: ${changePercent}%`"
-               ></div>
-        </div>
-      </div>
-      <div class="grid" v-else-if="count > 0">
-        <span>{{count}} currently assigned</span>
-
-        <div class="slider">
-          <label for="reassignCount">Number to reassign</label>
-          <input type="range" id="reassignCount" min="0" :max="count" v-model="numToAssign" step="1">
-          <div class="centered">{{numToAssign}}</div>
-        </div>
-
-        <div>
-          <label for="assignee">Assign To</label>
-          <select id="assignee" v-model="assignTo">
-            <option
-            v-for="user in users"
-            :key="user.byuId"
-            :value="user.byuId"
-            >{{user.name}}</option>
-          </select>
-        </div>
-      </div>
-      <div class="" v-else-if="reassignList.length > 0">
-        <div>
-          <label for="assignee">Assign To</label>
-          <select id="assignee" v-model="assignTo">
-            <option
-            v-for="user in users"
-            :key="user.byuId"
-            :value="user.byuId"
-            >{{user.name}}</option>
-          </select>
-        </div>
-        <div>
-          <span
-             v-for="app of reassignList"
-             :key="app.application_uuid"
-             class="badge badge-pill badge-primary mr-1"
-          >
-            {{ app.applicant_name }}
-          </span>
-        </div>
-      </div>
-      <div v-else>
-        Nothing to reassign
-      </div>
-
-      <span class="modal-footer">
-        <button
-          class="btn btn-outline-primary"
-          @click="reassign"
-          :disabled="numToAssign <= 0 || byuId === assignTo || !assignTo || bulkChange.total !== bulkChange.complete"
-        >Reassign</button>
-        <button class="btn btn-outline-secondary" @click="close">Cancel</button>
-      </span>
-    </div>
-  </modal>
-</template>
-<script>
-  import { mapActions } from 'vuex'
-
-  export default {
-    name: 'AssignmentBulkDialog',
-    data () {
-      return {
-        byuId: '',
-        count: 0,
-        numToAssign: 0,
-        assignTo: '',
-        reassignList: []
-      }
-    },
-    computed: {
-      users () {
-        const counselors = this.$store.getters.usersByRole('Counselor')
-        const processors = this.$store.getters.usersByRole('Processor')
-        return counselors.concat(processors)
-      },
-      bulkChange () {
-        return this.$store.state.users.bulkChange
-      },
-      changePercent () {
-        const { complete, total } = this.bulkChange
-        return 100 * complete / total
-      }
-    },
-    methods: {
-      ...mapActions(['bulkReassignApplications']),
-      beforeOpen ({params}) {
-        console.log(params)
-        const { byuId, count, reassignList = [] } = params
-        this.byuId = byuId
-        this.assignTo = byuId
-        this.count = count
-        this.reassignList = reassignList
-        this.numToAssign = count
-      },
-      async reassign () {
-        const { numToAssign, assignTo, reassignList } = this
-        await this.bulkReassignApplications({
-          fromId: this.byuId,
-          toId: assignTo,
-          count: numToAssign,
-          appIds: reassignList.map(app => app.application_uuid)
-        })
-        window.location.reload()
-      },
-      close () {
-        this.$modal.hide('assignment-bulk-modal')
-      },
-    }
-  }
-</script>
-<style scoped>
-  .grid {
-    display: grid;
-    grid-template-columns: 1fr 1fr;
-    grid-auto-rows: auto;
-    grid-gap: 0.5rem;
-  }
-
-  .slider {
-    grid-row: auto / span 2;
-    display: grid;
-    grid-template-columns: auto;
-    grid-auto-rows: auto;
-    grid-gap: 0.2rem;
-    justify-content: center;
-  }
-
-  .centered {
-    text-align: center;
-  }
-</style>
+<template>
+  <modal
+  name="assignment-bulk-modal"
+  height="auto"
+  draggable
+  @before-open="beforeOpen"
+  >
+    <div class="bg-light p-1 text-uppercase">Bulk Reassignment</div>
+    <div class="assignment-buld-dialog content-padding">
+      <div v-if="bulkChange.total !== bulkChange.complete">
+        <h3>Reassigning...({{ bulkChange.complete }}/{{ bulkChange.total }})</h3>
+        <div class="progress">
+          <div class="progress-bar bg-primary"
+               role="progressbar"
+               :aria-valuenow="bulkChange.complete"
+               aria-valuemin="0"
+               :aria-valuemax="bulkChange.total"
+               :style="`width: ${changePercent}%`"
+               ></div>
+        </div>
+      </div>
+      <div class="grid" v-else-if="count > 0">
+        <span>{{count}} currently assigned</span>
+
+        <div class="slider">
+          <label for="reassignCount">Number to reassign</label>
+          <input type="range" id="reassignCount" min="0" :max="count" v-model="numToAssign" step="1">
+          <div class="centered">{{numToAssign}}</div>
+        </div>
+
+        <div>
+          <label for="assignee">Assign To</label>
+          <select id="assignee" v-model="assignTo">
+            <option
+            v-for="user in users"
+            :key="user.byuId"
+            :value="user.byuId"
+            >{{user.name}}</option>
+          </select>
+        </div>
+      </div>
+      <div class="" v-else-if="reassignList.length > 0">
+        <div>
+          <label for="assignee">Assign To</label>
+          <select id="assignee" v-model="assignTo">
+            <option
+            v-for="user in users"
+            :key="user.byuId"
+            :value="user.byuId"
+            >{{user.name}}</option>
+          </select>
+        </div>
+        <div>
+          <span
+             v-for="app of reassignList"
+             :key="app.application_uuid"
+             class="badge badge-pill badge-primary mr-1"
+          >
+            {{ app.applicant_name }}
+          </span>
+        </div>
+      </div>
+      <div v-else>
+        Nothing to reassign
+      </div>
+
+      <span class="modal-footer">
+        <button
+          class="btn btn-outline-primary"
+          @click="reassign"
+          :disabled="numToAssign <= 0 || byuId === assignTo || !assignTo || bulkChange.total !== bulkChange.complete"
+        >Reassign</button>
+        <button class="btn btn-outline-secondary" @click="close">Cancel</button>
+      </span>
+    </div>
+  </modal>
+</template>
+<script>
+  import { mapActions } from 'vuex'
+
+  export default {
+    name: 'AssignmentBulkDialog',
+    data () {
+      return {
+        byuId: '',
+        count: 0,
+        numToAssign: 0,
+        assignTo: '',
+        reassignList: []
+      }
+    },
+    computed: {
+      users () {
+        const counselors = this.$store.getters.usersByRole('Counselor')
+        const processors = this.$store.getters.usersByRole('Processor')
+        return counselors.concat(processors)
+      },
+      bulkChange () {
+        return this.$store.state.users.bulkChange
+      },
+      changePercent () {
+        const { complete, total } = this.bulkChange
+        return 100 * complete / total
+      }
+    },
+    methods: {
+      ...mapActions(['bulkReassignApplications']),
+      beforeOpen ({params}) {
+        console.log(params)
+        const { byuId, count, reassignList = [] } = params
+        this.byuId = byuId
+        this.assignTo = byuId
+        this.count = count
+        this.reassignList = reassignList
+        this.numToAssign = count
+      },
+      async reassign () {
+        const { numToAssign, assignTo, reassignList } = this
+        await this.bulkReassignApplications({
+          fromId: this.byuId,
+          toId: assignTo,
+          count: numToAssign,
+          appIds: reassignList.map(app => app.application_uuid)
+        })
+        window.location.reload()
+      },
+      close () {
+        this.$modal.hide('assignment-bulk-modal')
+      },
+    }
+  }
+</script>
+<style scoped>
+  .grid {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    grid-auto-rows: auto;
+    grid-gap: 0.5rem;
+  }
+
+  .slider {
+    grid-row: auto / span 2;
+    display: grid;
+    grid-template-columns: auto;
+    grid-auto-rows: auto;
+    grid-gap: 0.2rem;
+    justify-content: center;
+  }
+
+  .centered {
+    text-align: center;
+  }
+</style>