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.

Sign up for GitHub

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

Jump to bottom

Entity, Login, and Dashboard content updates + contact readout on Entity page #73

Merged
merged 4 commits into from
Mar 28, 2020
Merged

Entity, Login, and Dashboard content updates + contact readout on Entity page #73

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
a37f25b
Check in to resolve merge conflicts
funkybunch Mar 28, 2020
e3271e9
Merge branch 'master' into Entity-Page-Updates
funkybunch Mar 28, 2020
be8844d
Improved readout & contact management
funkybunch Mar 28, 2020
3b0e4fc
Updated Dashboard
funkybunch Mar 28, 2020
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
12 changes: 11 additions & 1 deletion src/App.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,7 @@
font-family: "Open Sans", OpenSans, Open-Sans, Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
text-align: left;
color: #2c3e50;
width: 100%;
margin: auto;
Expand Down Expand Up @@ -103,6 +103,12 @@
margin-top: 0;
}

p.lead {
font-size: 18px;
font-weight: unset;
margin-top: 30px;
}

nav#primary-nav img.seal {
height: 88px;
width: 88px;
Expand All @@ -115,4 +121,8 @@
max-height: 60px;
margin-left: 15px;
}

strong {
font-weight: bold;
}
</style>
134 changes: 68 additions & 66 deletions src/components/Dashboard.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,79 +1,74 @@
<template>
<b-container fluid="md" id="dashboard">
<h1>Dashboard Test</h1>
<b-row>
<b-col>
<b-col cols="12">
<h1>Provider Status Dashboard</h1>
<h4 class="text-muted">Status &amp; Check-in Starting Point</h4>
<p class="lead">Choose a Provider from the list below to begin Check-in. You can edit all provider info once inside their page.</p>
<!-- Dashboard Table -->
<b-col lg="6" class="my-1">
<b-form-group
label="Filter"
label-cols-sm="3"
label-align-sm="right"
label-size="sm"
label-for="dashboard-table"
class="mb-0"
<b-row>
<b-col cols="4">
<b-form-group
label="Filter"
label-align="left"
label-for="dashboard-table">
<b-input-group>
<b-form-input
v-model="filter"
type="search"
id="dashboard-table"
placeholder="Type to Search"
></b-form-input>
<b-input-group-append>
<b-button :disabled="!filter" @click="filter = ''" variant="outline-primary">Clear</b-button>
</b-input-group-append>
</b-input-group>
</b-form-group>
</b-col>
</b-row>
<b-table
id="dashboard-table"
striped
hover
sticky-header
:filter="filter"
:filterIncludedFields="filterOn"
:sort-by.sync="sortBy"
:sort-desc.sync="sortDesc"
:sort-direction="sortDirection"
@filtered="onFiltered"
:items="entities"
:fields="[
{
key: 'name', stickyColumn: true, isRowHeader: true,
sortable: true
},
{
key: 'status',
sortable: true
},
{
key: 'updatedAt',
label: 'Updated',
sortable: true,
// Variant applies to the whole column, including the header and footer
//variant: 'danger'
}
]"
>
<b-input-group size="sm">
<b-form-input
v-model="filter"
type="search"
id="dashboard-table"
placeholder="Type to Search"
></b-form-input>
<b-input-group-append>
<b-button :disabled="!filter" @click="filter = ''">Clear</b-button>
</b-input-group-append>
</b-input-group>
</b-form-group>
</b-col>

<b-table
id="dashboard-table"
striped
hover
:filter="filter"
:filterIncludedFields="filterOn"
:sort-by.sync="sortBy"
:sort-desc.sync="sortDesc"
:sort-direction="sortDirection"
@filtered="onFiltered"
stickyheader:true
:items="entities"
:fields="[
{
key: 'name', stickyColumn: true, isRowHeader: true,
sortable: true
},
{
key: 'lastCheckin',
sortable: true
},
{
key: 'updatedAt',
label: 'Updated',
sortable: true,
// Variant applies to the whole column, including the header and footer
//variant: 'danger'
}
]">

<template v-slot:cell(name)="data">
<router-link
:to="{ name: 'facility', params: { entityID: data.item.id }}"
>{{ data.item.name }}</router-link>
</template>
<template v-slot:cell(lastCheckIn)="data">
<span v-if="data.item.checkIn">{{ data.item.checkIn.checkIns[data.item.checkIn.checkIns.length-1].status }}</span>
<template v-slot:cell(status)="data">
<span v-if="data.item.checkIn.checkIns.length > 0">{{ data.item.checkIn.checkIns[data.item.checkIn.checkIns.length-1].status }}</span>
</template>
</b-table>
<b-pagination
v-model="currentPage"
:total-rows="rows"
:per-page="perPage"
first-text="⏮"
prev-text="⏪"
next-text="⏩"
last-text="⏭"
class="mt-4"
></b-pagination>
</b-col>
Expand All @@ -86,26 +81,30 @@
name: "Dashboard",
data() {
return {
rows: 20,
rows: 0,
perPage: 10,
currentPage: 1,
filter: null,
filterOn: [],
entities: null,
table: {
rows: 0,
currentPage: 1
},
sortBy: 'updated',
sortDesc: false,
sortDirection: 'asc',
fields: [
{ key: 'name', sortable: true },
{ key: 'lastCheckIn', sortable: true },
{ key: 'status', sortable: true },
{ key: 'updatedAt', sortable: true }
]
};
},
methods: {
updateEntities(obj) {
this.entities = obj.results;
this.rows = this.entities.length;
},
onFiltered(filteredItems) {
this.rows = filteredItems.length;
this.currentPage = 1
}
},
mounted() {
Expand All @@ -129,4 +128,7 @@
ul.pagination > li {
display: inline-block;
}
p.lead {
margin: 30px 0 15px;
}
</style>
Loading