style fixes, toast on profile update, remove spinner from toasts

Computational-Plant-Science · May 8, 2020 · 91586cf · 91586cf
1 parent f441870
commit 91586cf
Show file tree

Hide file tree

Showing 6 changed files with 91 additions and 43 deletions.
diff --git a/plantit/front_end/src/components/AppNavigation.vue b/plantit/front_end/src/components/AppNavigation.vue
@@ -388,8 +388,82 @@
                 </b-navbar-nav>
             </b-collapse>
         </b-navbar>
+        <b-alert
+            :show="reload_alert_dismiss_countdown"
+            dismissible
+            variant="success"
+            @dismissed="reload_alert_dismiss_countdown < 0"
+            @dismiss-count-down="countDownChanged"
+        >
+            <p>
+                User information updated. Thanks,
+                {{ this.info ? this.info.first_name : '' }}!
+            </p>
+        </b-alert>
         <br />
         <br />
+        <EditUserInfoModal
+            :prompt="false"
+            modal-id="editUserInfoModal"
+            :username="
+                this.loading
+                    ? 'Loading...'
+                    : this.info
+                    ? this.info.username
+                    : ''
+            "
+            :first_name="
+                this.loading
+                    ? 'Loading...'
+                    : this.info
+                    ? this.info.first_name
+                    : ''
+            "
+            :last_name="
+                this.loading
+                    ? 'Loading...'
+                    : this.info
+                    ? this.info.last_name
+                    : ''
+            "
+            :country="
+                this.loading
+                    ? 'Loading...'
+                    : this.info
+                    ? this.info.profile.country
+                    : ''
+            "
+            :continent="
+                this.loading
+                    ? 'Loading...'
+                    : this.info
+                    ? this.info.profile.continent
+                    : ''
+            "
+            :institution="
+                this.loading
+                    ? 'Loading...'
+                    : this.info
+                    ? this.info.profile.institution
+                    : ''
+            "
+            :institution_type="
+                this.loading
+                    ? 'Loading...'
+                    : this.info
+                    ? this.info.profile.institution_type
+                    : ''
+            "
+            :field_of_study="
+                this.loading
+                    ? 'Loading...'
+                    : this.info
+                    ? this.info.profile.field_of_study
+                    : ''
+            "
+            @saveUserInfo="saveUserInfo"
+        >
+        </EditUserInfoModal>
         <EditUserInfoModal
             :prompt="true"
             modal-id="editUserInfoModalNav"
@@ -452,24 +526,6 @@
             @saveUserInfo="saveUserInfo"
         >
         </EditUserInfoModal>
-        <b-alert
-            :show="reload_alert_dismiss_countdown"
-            dismissible
-            variant="success"
-            @dismissed="reload_alert_dismiss_countdown = 0"
-            @dismiss-count-down="countDownChanged"
-        >
-            <p>
-                User information updated. Thanks,
-                {{ this.info ? this.info.profile ? this.info.profile.first_name : '' : '' }}!
-            </p>
-            <b-progress
-                variant="dark"
-                :max="reload_alert_dismiss_seconds"
-                :value="reload_alert_dismiss_countdown"
-                height="2px"
-            ></b-progress>
-        </b-alert>
     </div>
 </template>
 
@@ -527,14 +583,12 @@ export default {
         }
     },
     methods: {
-        reload(toast) {
+        reload() {
             UserApi.getCurrentUser().then(info => {
                 this.info = info;
                 this.loading = false;
                 if (this.profileIncomplete) {
                     this.$bvModal.show('editUserInfoModalNav');
-                } else if (toast) {
-                    this.showAlert();
                 }
             });
         },
@@ -565,6 +619,7 @@ export default {
                 fieldOfStudy
             ).then(() => {
                 this.reload();
+                this.showAlert();
             });
         }
     }

diff --git a/plantit/front_end/src/components/collections/EditUserInfoModal.vue b/plantit/front_end/src/components/collections/EditUserInfoModal.vue
@@ -2,7 +2,7 @@
     <b-modal
         :id="modalId"
         :title="
-            prompt ? 'Please Provide User Information' : 'Edit User Information'
+            prompt ? 'Provide User Information' : 'Edit User Information'
         "
         ok-title="Save"
         ok-variant="success"

diff --git a/plantit/front_end/src/scss/main.sass b/plantit/front_end/src/scss/main.sass
@@ -71,7 +71,7 @@ $theme-colors: map-merge(('primary': $primary, 'secondary': $secondary, 'success
   width: 300px !important
 
 .btn-white
-  color: $gray-600
+  color: $dark
   border: 1px solid transparent !important
 
 .btn-white:hover
@@ -125,7 +125,7 @@ $theme-colors: map-merge(('primary': $primary, 'secondary': $secondary, 'success
 .b-form-input:focus
   color: $dark
   background-color: transparent
-  border-bottom: 1px solid $color-button
+  border-bottom: 1px solid $secondary
   border-top: 1px solid transparent
   border-left: 1px solid transparent
   border-right: 1px solid transparent

diff --git a/plantit/front_end/src/views/Job.vue b/plantit/front_end/src/views/Job.vue
@@ -82,12 +82,6 @@
                         <p>
                             Job info reloaded.
                         </p>
-                        <b-progress
-                            variant="dark"
-                            :max="reloadAlertDismissSeconds"
-                            :value="reloadAlertDismissCountdown"
-                            height="2px"
-                        ></b-progress>
                     </b-alert>
                 </b-col>
             </b-row>
@@ -244,7 +238,7 @@ export default {
             if (this.job.status_set.length > 0) {
                 return this.job.status_set[0].state;
             } else {
-                return '';
+                return 0;
             }
         },
         warning_count() {

diff --git a/plantit/front_end/src/views/Profile.vue b/plantit/front_end/src/views/Profile.vue
@@ -22,7 +22,9 @@
                             </b-col>
                             <b-col md="auto">
                                 <b-button
-                                    @click="$bvModal.show('editUserInfoModal')"
+                                    @click="
+                                        $bvModal.show('editUserInfoModal')
+                                    "
                                     variant="outline-dark"
                                     v-b-tooltip.hover
                                     title="Edit user information."
@@ -80,7 +82,7 @@
                 </b-card>
             </div>
         </b-container>
-        <EditUserInfoModal
+        <!--<EditUserInfoModal
             :prompt="false"
             modal-id="editUserInfoModal"
             :username="this.info.username"
@@ -112,19 +114,16 @@
             @saveUserInfo="saveUserInfo"
             @cancel="cancel"
         >
-        </EditUserInfoModal>
+        </EditUserInfoModal>-->
     </div>
 </template>
 
 <script>
 import UserApi from '@/services/apiV1/UserManager.js';
-import EditUserInfoModal from '@/components/collections/EditUserInfoModal';
 
 export default {
     name: 'UserInfo',
-    components: {
-        EditUserInfoModal
-    },
+    components: {},
     data() {
         return {
             info: {},

diff --git a/plantit/plantit/user/models.py b/plantit/plantit/user/models.py
@@ -26,11 +26,11 @@ class Profile(models.Model):
     """
     # See https://simpleisbetterthancomplex.com/tutorial/2016/07/22/how-to-extend-django-user-model.html#onetoone
     user: User = models.OneToOneField(User, on_delete=models.CASCADE)
-    country: str = models.CharField(max_length=256, default='')
-    continent: str = models.CharField(max_length=256, default='')
-    institution: str = models.CharField(max_length=256, default='')
-    institution_type: str = models.CharField(max_length=256, default='')
-    field_of_study: str = models.CharField(max_length=256, default='')
+    country: str = models.CharField(max_length=256, default='', blank=True)
+    continent: str = models.CharField(max_length=256, default='', blank=True)
+    institution: str = models.CharField(max_length=256, default='', blank=True)
+    institution_type: str = models.CharField(max_length=256, default='', blank=True)
+    field_of_study: str = models.CharField(max_length=256, default='', blank=True)
     pinned_jobs: Manager = models.ManyToManyField(Job, related_name='profile_pins', blank=True)
     pinned_collections: Manager = models.ManyToManyField(Collection, related_name='profile_pins', blank=True)