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

41
ayanova/devdocs/todo.txt
View File

@@ -47,42 +47,17 @@ CURRENT TODOs
SHELL / NAV / MENUS / LAYOUT 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: toolbar above grid for filters, refresh etc (make it a standard component?)
TODO: main.js filters need to be finished 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: SEARCH UI
TODO: FILTER UI
- Show current filter summary or text name of filter at top of filter
TODO: GRIDS - 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?
- MAKE GRID AS GENERIC VUE COMPONENT - Filter picklist will show name for the current filter and sb at top of filter right up front
- 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

11
ayanova/src/App.vue
View File

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

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

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

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

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

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

@@ -1,13 +1,119 @@
<template> <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> </template>
<script> <script>
import UnderConstruction from "../components/underconstruction.vue"; //import UnderConstruction from "../components/underconstruction.vue";
export default { 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: { components: {
UnderConstruction //UnderConstruction
}, },
beforeCreate() { beforeCreate() {
window.$gz.eventBus.$emit("menu-change", { window.$gz.eventBus.$emit("menu-change", {