admin/raven-client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

cleaning up layout, removed a bunch of unneeded stuff

Browse Source
This commit is contained in:
John Cardinal
2020-01-31 21:07:45 +00:00
parent 2b4963bc9f
commit 1a7160bd6c
5 changed files with 226 additions and 167 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
ayanova/devdocs/todo.txt
View File

@@ -47,42 +47,17 @@ CURRENT TODOs
SHELL / NAV / MENUS / LAYOUT
TODO: Grid is leaving space for side nav on it's right side when in medium width or if make nav go away in full screen
- It appears it thinks it needs to leave room for nav even when not there
- Maybe it's a breakpoint issue somewhere that I overrode and has since changed or something
TODO: toolbar above grid for filters, refresh etc (make it a standard component?)
TODO: main.js filters need to be finished
TODO: Grid is leaving space for side nav on it's right side when in medium width or if make nav go away in full screen
TODO: GRIDS
- MAKE GRID AS GENERIC VUE COMPONENT
- See gz-data-table.vue notes in component comments for it's own todo's
- See test-widgets.vue for parent container that hosts control and get devving!!
- MUST HANDLE HIDDEN FIELDS AND NOT DISPLAY (this is also a server issue)
- Grid does *NOT* have sort indicators or controls, that's behind the grid in the filter UI, this is necessary for reasons I forget
- Max 100 rows in grid at a time with paging
- AFTER working mocked grid
- DISPLAY FORMAT TEMPLATES
- Speccd in core-display-format-template-system.txt
- Requires server work and client work
- MODIFY WIDGET GRID DATA LIST at server to work with templates properly
- SEARCH UI (need to be able to search from the grid for that type of object)
- FILTER UI
- Show the total quantity of records so it's clear the user is seeing a subset, i.e. "Showing 100 records of 30,124 (filtered)" or something to that effect.
- For efficiency this might need to be a fuzzy number gathered periodically at the server as part of a job and put on a route?
- Don't want to count them every time the list is fetched....or do I? Maybe it's pretty efficient in Postgres?
- Doesn't it already count them for paging purposes and even sends that value to the client already?
- Show current filter summary or text name of filter at top of filter
- going to need filter name and also a summarized fragment of text showing criteria for reporting so also could purpose that list to show current filter?
- Filter picklist will show name for the current filter and sb at top of filter right up front
-
- Needs to remember last settings (stored centrally) like filter used, number of rows etc
- When user opens up AyaNova it should always look the same in each area as last time they were there
- Modify the grid to no longer use mock values but real ones instead and test
TODO: SEARCH UI
TODO: FILTER UI
- Show current filter summary or text name of filter at top of filter
- going to need filter name and also a summarized fragment of text showing criteria for reporting so also could purpose that list to show current filter?
- Filter picklist will show name for the current filter and sb at top of filter right up front

11
ayanova/src/App.vue
View File

@@ -9,7 +9,6 @@
app
width="350"
>
<!-- <v-card class="mx-auto" width="300"> -->
<v-list>
<template v-for="item in navItems">
<!-- TOP LEVEL can be holders or actions -->
@@ -190,12 +189,10 @@
</v-toolbar-items>
</v-app-bar>
<v-content>
<v-container fluid fill-height>
<v-row justify-center>
<transition name="fade" mode="out-in" @after-leave="afterLeave">
<router-view class="view"></router-view>
</transition>
</v-row>
<v-container fluid>
<transition name="fade" mode="out-in" @after-leave="afterLeave">
<router-view class="view"></router-view>
</transition>
</v-container>
</v-content>
<v-footer color="primary" padless v-if="!isAuthenticated">

207
ayanova/src/components/gz-data-table.vue
View File

@@ -1,57 +1,97 @@
<template>
<div>
<v-data-table
:headers="headers"
:items="records"
v-model="selected"
:options.sync="dataTablePagingOptions"
:server-items-length="totalRecords"
:loading="loading"
:disable-sort="true"
:show-select="showSelect"
:single-select="singleSelect"
:hide-default-header="narrowFormat"
:footer-props="{
showCurrentPage: true,
showFirstLastPage: true,
itemsPerPageOptions: rowsPerPageItems,
itemsPerPageText: lt('RowsPerPage'),
pageText: lt('PageOfPageText')
}"
:loading-text="lt('Loading')"
:no-data-text="lt('NoData')"
class="elevation-1"
>
<!-- /*From server: UiDataTypes
NoType = 0,v-on:item-selected="handleSelect"
DateTime = 1,
Date = 2,
Time = 3,
Text = 4,
Integer = 5,
Bool = 6,
Decimal = 7,
Currency = 8,
Tags = 9,
Enum = 10,
EmailAddress = 11,
HTTP = 12
*/ -->
<template v-slot:body="{ items }">
<tbody>
<template v-if="!narrowFormat">
<tr v-for="item in items" :key="item.id">
<template v-if="showSelect">
<td>
<v-data-table
:headers="headers"
:items="records"
v-model="selected"
:options.sync="dataTablePagingOptions"
:server-items-length="totalRecords"
:loading="loading"
:disable-sort="true"
:show-select="showSelect"
:single-select="singleSelect"
:hide-default-header="narrowFormat"
:footer-props="{
showCurrentPage: true,
showFirstLastPage: true,
itemsPerPageOptions: rowsPerPageItems,
itemsPerPageText: lt('RowsPerPage'),
pageText: lt('PageOfPageText')
}"
:loading-text="lt('Loading')"
:no-data-text="lt('NoData')"
class="elevation-1"
>
<template v-slot:body="{ items }">
<tbody>
<template v-if="!narrowFormat">
<tr v-for="item in items" :key="item.id">
<template v-if="showSelect">
<td>
<v-checkbox
v-model="selected"
:value="item"
primary
hide-details
></v-checkbox>
</td>
</template>
<td v-for="c in item.columns" :key="c.key">
<!-- Handle all plain text types right up to and including enums -->
<!--TODO when get to coloured stuff will need to add that as a prop to column data but leaving out for now-->
<template v-if="c.t < 11">
<template v-if="c.i">
<!-- openable object with an ID -->
<v-btn depressed small @click="btnClick(c.key, c.i)">{{
c.v
}}</v-btn>
</template>
<template v-else>
{{ c.v }}
</template>
</template>
<template v-if="c.t == 11">
<a :href="'mailto:' + c.v">{{ c.v }}</a>
</template>
<template v-if="c.t == 12">
<!-- Expects full url with protocol etc in c.v so might need to add to record builder -->
<a :href="c.v" target="_blank">{{ c.v }}</a>
</template>
</td>
</tr>
</template>
<template v-else>
<!-- Narrow width template -->
<tr
class="v-data-table__mobile-table-row"
v-for="item in items"
:key="item.id"
>
<!-- HEADER TO THE LEFT -->
<!-- FIELD VALUE TO THE RIGHT -->
<template v-if="showSelect">
<td class="v-data-table__mobile-row">
<div class="v-data-table__mobile-row__header"></div>
<div class="v-data-table__mobile-row__cell">
<v-checkbox
v-model="selected"
:value="item"
primary
hide-details
></v-checkbox>
</td>
</template>
<td v-for="c in item.columns" :key="c.key">
</div>
</td>
</template>
<td
class="v-data-table__mobile-row"
v-for="c in item.columns"
:key="c.key"
>
<div class="v-data-table__mobile-row__header">
{{ getHeaderText(c.key) }}
</div>
<div class="v-data-table__mobile-row__cell">
<!-- Handle all plain text types right up to and including enums -->
<!--TODO when get to coloured stuff will need to add that as a prop to column data but leaving out for now-->
<template v-if="c.t < 11">
@@ -72,70 +112,14 @@
<!-- Expects full url with protocol etc in c.v so might need to add to record builder -->
<a :href="c.v" target="_blank">{{ c.v }}</a>
</template>
</td>
</tr>
</template>
<template v-else>
<!-- Narrow width template -->
<tr
class="v-data-table__mobile-table-row"
v-for="item in items"
:key="item.id"
>
<!-- HEADER TO THE LEFT -->
<!-- FIELD VALUE TO THE RIGHT -->
<template v-if="showSelect">
<td class="v-data-table__mobile-row">
<div class="v-data-table__mobile-row__header"></div>
<div class="v-data-table__mobile-row__cell">
<v-checkbox
v-model="selected"
:value="item"
primary
hide-details
></v-checkbox>
</div>
</td>
</template>
<td
class="v-data-table__mobile-row"
v-for="c in item.columns"
:key="c.key"
>
<div class="v-data-table__mobile-row__header">
{{ getHeaderText(c.key) }}
</div>
<div class="v-data-table__mobile-row__cell">
<!-- Handle all plain text types right up to and including enums -->
<!--TODO when get to coloured stuff will need to add that as a prop to column data but leaving out for now-->
<template v-if="c.t < 11">
<template v-if="c.i">
<!-- openable object with an ID -->
<v-btn depressed small @click="btnClick(c.key, c.i)">{{
c.v
}}</v-btn>
</template>
<template v-else>
{{ c.v }}
</template>
</template>
<template v-if="c.t == 11">
<a :href="'mailto:' + c.v">{{ c.v }}</a>
</template>
<template v-if="c.t == 12">
<!-- Expects full url with protocol etc in c.v so might need to add to record builder -->
<a :href="c.v" target="_blank">{{ c.v }}</a>
</template>
</div>
</td>
</tr>
</template>
</tbody>
</template>
</v-data-table>
<!-- <hr />
</div>
</td>
</tr>
</template>
</tbody>
</template>
</v-data-table>
<!-- <hr />
<div>Selected: {{ selected }}</div>
<div>Headers: {{ headers }}</div>
<div>Records: {{ records }}</div>
@@ -146,7 +130,6 @@
<div>dataListKey: {{ dataListKey }}</div>
<div>dataFilterId: {{ dataFilterId }}</div>
<div>viewPort is XS: {{ mini }}</div> -->
</div>
</template>
<script>

20
ayanova/src/views/test-widgets.vue
View File

@@ -1,15 +1,13 @@
<template>
<v-container style="position:absolute;top:0px">
<gz-data-table
formKey="test-widgets"
dataListKey="TestWidgetDataList"
:dataFilterId="currentDataFilterId"
:showSelect="true"
:singleSelect="false"
v-on:update:selected="handleSelected"
>
</gz-data-table>
</v-container>
<gz-data-table
formKey="test-widgets"
dataListKey="TestWidgetDataList"
:dataFilterId="currentDataFilterId"
:showSelect="true"
:singleSelect="false"
v-on:update:selected="handleSelected"
>
</gz-data-table>
</template>
<script>

112
ayanova/src/views/vendors.vue
View File

@@ -1,13 +1,119 @@
<template>
<UnderConstruction />
<!-- <v-container fluid> -->
<v-data-table
:headers="headers"
:items="desserts"
:items-per-page="5"
class="elevation-1"
></v-data-table>
<!-- </v-container> -->
</template>
<script>
import UnderConstruction from "../components/underconstruction.vue";
//import UnderConstruction from "../components/underconstruction.vue";
export default {
data() {
return {
headers: [
{
text: "Dessert (100g serving)",
align: "left",
sortable: false,
value: "name"
},
{ text: "Calories", value: "calories" },
{ text: "Fat (g)", value: "fat" },
{ text: "Carbs (g)", value: "carbs" },
{ text: "Protein (g)", value: "protein" },
{ text: "Iron (%)", value: "iron" }
],
desserts: [
{
name: "Frozen Yogurt",
calories: 159,
fat: 6.0,
carbs: 24,
protein: 4.0,
iron: "1%"
},
{
name: "Ice cream sandwich",
calories: 237,
fat: 9.0,
carbs: 37,
protein: 4.3,
iron: "1%"
},
{
name: "Eclair",
calories: 262,
fat: 16.0,
carbs: 23,
protein: 6.0,
iron: "7%"
},
{
name: "Cupcake",
calories: 305,
fat: 3.7,
carbs: 67,
protein: 4.3,
iron: "8%"
},
{
name: "Gingerbread",
calories: 356,
fat: 16.0,
carbs: 49,
protein: 3.9,
iron: "16%"
},
{
name: "Jelly bean",
calories: 375,
fat: 0.0,
carbs: 94,
protein: 0.0,
iron: "0%"
},
{
name: "Lollipop",
calories: 392,
fat: 0.2,
carbs: 98,
protein: 0,
iron: "2%"
},
{
name: "Honeycomb",
calories: 408,
fat: 3.2,
carbs: 87,
protein: 6.5,
iron: "45%"
},
{
name: "Donut",
calories: 452,
fat: 25.0,
carbs: 51,
protein: 4.9,
iron: "22%"
},
{
name: "KitKat",
calories: 518,
fat: 26.0,
carbs: 65,
protein: 7,
iron: "6%"
}
]
};
},
components: {
UnderConstruction
//UnderConstruction
},
beforeCreate() {
window.$gz.eventBus.$emit("menu-change", {