Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

updated search buttons to use mdi icons and updated style of inputs across search & code views #649

Merged
merged 4 commits into from
Oct 23, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 3 additions & 2 deletions frontend/src/assets/css/global.css
Original file line number Diff line number Diff line change
Expand Up @@ -122,12 +122,13 @@ button.collapsed, button.not-collapsed, button.more-button {
border: none;
padding: 0; /* Optional: Remove padding if needed */
}
tbody tr:nth-of-type(odd) {
/* tbody tr:nth-of-type(odd) {
background-color: rgba(0, 0, 0, .05) !important
}
} */

th {
font-weight: bold !important;
/* border-bottom: 2px solid rgb(var(--v-theme-primary)) !important; */
}
.v-btn-link{
color: #1a5a96 !important;
Expand Down
46 changes: 23 additions & 23 deletions frontend/src/components/Courses/CourseAdvancedSearch.vue
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,8 @@
</div>
<v-text-field
label="TRAX Code:"
variant="outlined"
density="compact"
v-model="advancedSearchInput.courseCode.value"
placeholder=""
tabindex="1"
Expand All @@ -47,6 +49,8 @@
</div>
<v-text-field
label="TRAX Grade Level:"
variant="outlined"
density="compact"
v-model="advancedSearchInput.courseLevel.value"
placeholder=""
tabindex="2"
Expand All @@ -71,6 +75,8 @@
</div>
<v-text-field
label="Course Title:"
variant="outlined"
density="compact"
v-model="advancedSearchInput.courseName.value"
placeholder=""
tabindex="3"
Expand All @@ -79,16 +85,20 @@
<div class="advanced-search-field col-12 col-md-2">
<v-select
label="Instruction Language:"
variant="outlined"
density="compact"
v-model="advancedSearchInput.language.value"
:items="langOptions"
item-title="text"
item-value="value"
tabindex="4"
></v-select>
</div>
<div class="advanced-search-field col-12 col-md-2">
<div class="advanced-search-field col-12 col-md-auto">
<v-text-field
label="TRAX Start Date:"
variant="outlined"
density="compact"
id="datepicker-startDate"
v-model="advancedSearchInput.startDate.value"
type="date"
Expand All @@ -99,9 +109,11 @@
tabindex="5"
></v-text-field>
</div>
<div class="advanced-search-field col-12 col-md-2">
<div class="advanced-search-field col-12 col-md-auto">
<v-text-field
label="TRAX End Date:"
variant="outlined"
density="compact"
id="datepicker-endDate"
v-model="advancedSearchInput.endDate.value"
type="date"
Expand All @@ -116,32 +128,20 @@
<v-row class="mt-n3">
<div class="advanced-search-button">
<v-btn
prepend-icon="mdi-magnify"
v-on:click="advanceCourseSearch"
v-if="!advancedSearchLoading"
class="btn"
:loading="advancedSearchLoading"
:disabled="advancedSearchLoading"
variant="flat"
color="primary"
tabindex="7"
class="text-none"
>Search</v-btn
>
<i class="fas fa-search" aria-hidden="true"></i>
&nbsp;Search
</v-btn>
<v-btn
class="btn"
color="success"
v-if="advancedSearchLoading"
tabindex="7"
><i class="fas fa-search" aria-hidden="true"></i>
&nbsp;Search
<v-progress-circular
v-if="advancedSearchLoading"
indeterminate
color="green"
>
</v-progress-circular>
</v-btn>
<v-btn
v-on:click="clearInput()"
class="btn btn-outline-primary mx-2"
variant="outlined"
color="primary"
class="btn btn-outline-primary text-none mx-2"
tabindex="7"
>
Reset
Expand Down
22 changes: 20 additions & 2 deletions frontend/src/components/Courses/CourseRequirementsSearch.vue
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,8 @@
</div>
<v-text-field
label="Course code:"
variant="outlined"
density="compact"
v-model="requirementsSearchInput.courseCode.value"
placeholder=""
tabindex="1"
Expand All @@ -31,6 +33,8 @@
<div class="advanced-search-field col-12 col-md-2">
<v-text-field
label="Course level:"
variant="outlined"
density="compact"
v-model="requirementsSearchInput.courseLevel.value"
placeholder=""
tabindex="2"
Expand All @@ -56,6 +60,8 @@
</div>
<v-text-field
label="Rule#:"
variant="outlined"
density="compact"
v-model="requirementsSearchInput.rule.value"
placeholder=""
tabindex="3"
Expand All @@ -66,6 +72,16 @@
<v-row class="mt-n3">
<div class="advanced-search-button">
<v-btn
prepend-icon="mdi-magnify"
v-on:click="courseRequirementsSearch"
:loading="courseRequirementLoading"
:disabled="courseRequirementLoading"
variant="flat"
color="primary"
class="text-none"
>Search</v-btn
>
<!-- <v-btn
v-on:click="courseRequirementsSearch"
v-if="!courseRequirementLoading"
color="primary"
Expand All @@ -83,10 +99,12 @@
color="green"
>
</v-progress-circular>
</v-btn>
</v-btn> -->
<v-btn
v-on:click="clearInput()"
class="btn btn-outline-primary mx-2"
variant="outlined"
color="primary"
class="btn btn-outline-primary text-none mx-2"
>
Reset
</v-btn>
Expand Down
2 changes: 2 additions & 0 deletions frontend/src/components/DisplayTable.vue
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,8 @@
<v-text-field
v-model="filter"
label="Filter"
variant="outlined"
density="comfortable"
debounce="500"
placeholder=""
append-icon="mdi-close"
Expand Down
2 changes: 2 additions & 0 deletions frontend/src/components/Header/BCHeader.vue
Original file line number Diff line number Diff line change
Expand Up @@ -87,6 +87,8 @@
<v-col class="d-flex align-center">
<v-text-field
density="compact"
size="small"
variant="outlined"
type="search"
v-model="penInput"
maxlength="9"
Expand Down
10 changes: 6 additions & 4 deletions frontend/src/components/StudentSearch/PenSearchForm.vue
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@
<v-col cols="12">
<v-text-field
label="Search by PEN:"
variant="outlined"
:disabled="searchLoading"
:loading="searchLoading"
id="search-by-pen"
Expand All @@ -24,15 +25,16 @@
</v-col>
</v-row>
<v-btn
prepend-icon="mdi-magnify"
id="search-submit"
v-on:click="findStudentByPen"
:loading="searchLoading"
:disabled="searchLoading"
variant="flat"
color="primary"
class="text-none"
>Search</v-btn
>
Search
<v-progress-circular v-if="searchLoading" indeterminate color="green">
</v-progress-circular>
</v-btn>
</v-form>
<v-alert
v-if="searchMessage"
Expand Down
68 changes: 30 additions & 38 deletions frontend/src/components/StudentSearch/StudentAdvancedSearch.vue
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,8 @@
</div>
<v-text-field
label="Legal Surname:"
variant="outlined"
density="compact"
id="legal-surname-input"
class="form__input"
v-model="advancedSearchInput.legalLastName.value"
Expand Down Expand Up @@ -52,6 +54,8 @@
</div>
<v-text-field
label="Legal Given:"
variant="outlined"
density="compact"
id="legal-given-input"
v-model="advancedSearchInput.legalFirstName.value"
placeholder=""
Expand Down Expand Up @@ -79,6 +83,8 @@
</div>
<v-text-field
label="Legal Middle:"
variant="outlined"
density="compact"
id="legal-middle-input"
v-model="advancedSearchInput.legalMiddleNames.value"
placeholder=""
Expand All @@ -90,16 +96,20 @@
<v-select
v-model="advancedSearchInput.gender.value"
label="Gender:"
variant="outlined"
density="compact"
id="gender-select"
:items="genderOptions"
item-title="text"
item-value="value"
tabindex="4"
></v-select>
</div>
<div class="form-group advanced-search-field col-12 col-md-2">
<div class="form-group advanced-search-field col-12 col-md-auto">
<v-text-field
label="Birthdate From:"
variant="outlined"
density="compact"
class="form__input"
id="datepicker-birthdate-from"
v-model="advancedSearchInput.birthdateFrom.value"
Expand All @@ -112,9 +122,11 @@
v-on:keyup="keyHandler"
></v-text-field>
</div>
<div class="advanced-search-field col-12 col-md-2">
<div class="advanced-search-field col-12 col-md-auto">
<v-text-field
label="Birthdate to:"
variant="outlined"
density="compact"
id="datepicker-birthdate-to"
v-model="advancedSearchInput.birthdateTo.value"
type="date"
Expand Down Expand Up @@ -147,6 +159,8 @@
</div>
<v-text-field
label="Usual Surname:"
variant="outlined"
density="compact"
id="usual-surname-input"
v-model="advancedSearchInput.usualLastName.value"
placeholder=""
Expand All @@ -173,6 +187,8 @@
</div>
<v-text-field
label="Usual Given:"
variant="outlined"
density="compact"
id="usual-given-input"
v-model="advancedSearchInput.usualFirstName.value"
placeholder=""
Expand All @@ -199,6 +215,8 @@
</div>
<v-text-field
label="Usual Middle:"
variant="outlined"
density="compact"
id="usual-middle-input"
v-model="advancedSearchInput.usualMiddleNames.value"
placeholder=""
Expand All @@ -210,36 +228,22 @@
<v-row>
<div class="advanced-search-button">
<v-btn
prepend-icon="mdi-magnify"
id="adv-search-submit"
@click="findStudentsByAdvancedSearch()"
v-if="!advancedSearchLoading"
v-on:click="findStudentsByAdvancedSearch"
:loading="advancedSearchLoading"
:disabled="advancedSearchLoading"
variant="flat"
color="primary"
tabindex="12"
>
<i class="fas fa-search" aria-hidden="true"></i>
&nbsp;Search
</v-btn>
<v-btn
id="adv-search-submit"
@click="findStudentsByAdvancedSearch()"
v-if="advancedSearchLoading"
color="success"
tabindex="12"
class="text-none"
>Search</v-btn
>
<i class="fas fa-search" aria-hidden="true"></i>
&nbsp;Search
<v-progress-circular
v-if="advancedSearchLoading"
indeterminate
color="green"
>
</v-progress-circular>
</v-btn>
<v-btn
class="mx-2 text-none"
id="adv-search-reset-button"
color="grey-lighten-3"
color="primary"
variant="outlined"
@click="clearInput"
class="mx-2"
>
Reset
</v-btn>
Expand All @@ -256,18 +260,6 @@
v-if="advancedSearchMessage && advancedSearchAPIMessage"
:text="`${advancedSearchMessage}\n${advancedSearchAPIMessage}`"
></v-alert>
<!-- <div class="results-option-group col-12 col-md-4">
<label v-if="totalPages > 1">Results per page</label>
<v-select
class="results-option"
v-if="totalPages > 1"
@change="findStudentsByAdvancedSearch()"
v-model="resultsPerPage"
:items="resultsPerPageOptions"
:value="resultsPerPage"
label="Results Per Page"
></v-select>
</div> -->
</div>

<transition name="fade">
Expand Down
Loading
Loading