This commit is contained in:
2019-01-03 18:25:41 +00:00
parent 1e6eb7ca1a
commit a890bdeeb6
68 changed files with 35812 additions and 0 deletions

View File

@@ -0,0 +1,21 @@
<template>
<v-container>
<v-layout text-xs-center wrap="">
<v-flex xs12>
<v-img :src="require('../assets/logo.svg')" class="my-3" contain height="200"></v-img>
</v-flex>
<v-flex mb-4>
<h1 class="display-2 font-weight-bold mb-3">Welcome to AyaNova</h1>
</v-flex>
</v-layout>
</v-container>
</template>
<script>
export default {
data: () => ({})
};
</script>
<style>
</style>

View File

@@ -0,0 +1,204 @@
<template>
<div>
<v-data-table
:headers="headers"
:items="desserts"
:pagination.sync="pagination"
:total-items="totalDesserts"
:loading="loading"
class="elevation-1"
>
<template slot="items" slot-scope="props">
<td>{{ props.item.name }}</td>
<td class="text-xs-right">{{ props.item.calories }}</td>
<td class="text-xs-right">{{ props.item.fat }}</td>
<td class="text-xs-right">{{ props.item.carbs }}</td>
<td class="text-xs-right">{{ props.item.protein }}</td>
<td class="text-xs-right">{{ props.item.iron }}</td>
</template>
</v-data-table>
</div>
</template>
<script>
//https://vuetifyjs.com/en/components/data-tables#example-server
export default {
data() {
return {
totalDesserts: 0,
desserts: [],
loading: true,
pagination: {},
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" }
]
};
},
watch: {
pagination: {
handler() {
this.getDataFromApi().then(data => {
this.desserts = data.items;
this.totalDesserts = data.total;
});
},
deep: true
}
},
mounted() {
this.getDataFromApi().then(data => {
this.desserts = data.items;
this.totalDesserts = data.total;
});
},
methods: {
getDataFromApi() {
this.loading = true;
return new Promise((resolve, reject) => {
const { sortBy, descending, page, rowsPerPage } = this.pagination;
let items = this.getDesserts();
const total = items.length;
if (this.pagination.sortBy) {
items = items.sort((a, b) => {
const sortA = a[sortBy];
const sortB = b[sortBy];
if (descending) {
if (sortA < sortB) return 1;
if (sortA > sortB) return -1;
return 0;
} else {
if (sortA < sortB) return -1;
if (sortA > sortB) return 1;
return 0;
}
});
}
if (rowsPerPage > 0) {
items = items.slice((page - 1) * rowsPerPage, page * rowsPerPage);
}
setTimeout(() => {
this.loading = false;
resolve({
items,
total
});
}, 1000);
});
},
getDesserts() {
return [
{
value: false,
name: "Frozen Yogurt",
calories: 159,
fat: 6.0,
carbs: 24,
protein: 4.0,
iron: "1%"
},
{
value: false,
name: "Ice cream sandwich",
calories: 237,
fat: 9.0,
carbs: 37,
protein: 4.3,
iron: "1%"
},
{
value: false,
name: "Eclair",
calories: 262,
fat: 16.0,
carbs: 23,
protein: 6.0,
iron: "7%"
},
{
value: false,
name: "Cupcake",
calories: 305,
fat: 3.7,
carbs: 67,
protein: 4.3,
iron: "8%"
},
{
value: false,
name: "Gingerbread",
calories: 356,
fat: 16.0,
carbs: 49,
protein: 3.9,
iron: "16%"
},
{
value: false,
name: "Jelly bean",
calories: 375,
fat: 0.0,
carbs: 94,
protein: 0.0,
iron: "0%"
},
{
value: false,
name: "Lollipop",
calories: 392,
fat: 0.2,
carbs: 98,
protein: 0,
iron: "2%"
},
{
value: false,
name: "Honeycomb",
calories: 408,
fat: 3.2,
carbs: 87,
protein: 6.5,
iron: "45%"
},
{
value: false,
name: "Donut",
calories: 452,
fat: 25.0,
carbs: 51,
protein: 4.9,
iron: "22%"
},
{
value: false,
name: "KitKat",
calories: 518,
fat: 26.0,
carbs: 65,
protein: 7,
iron: "6%"
}
];
}
}
};
</script>
<style>
</style>

View File

@@ -0,0 +1,26 @@
<template>
<v-flex xs12 md4>
<v-card class="elevation-5 transparent">
<v-card-text class="text-xs-center">
<v-icon x-large color="secondary">fa-heart</v-icon>
</v-card-text>
<v-card-title primary-title class="layout justify-center">
<div class="headline">Part assembly</div>
</v-card-title>
<v-card-text>
Cras facilisis mi vitae nunc lobortis pharetra. Nulla volutpat tincidunt ornare.
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
Nullam in aliquet odio. Aliquam eu est vitae tellus bibendum tincidunt. Suspendisse potenti.
</v-card-text>
</v-card>
</v-flex>
</template>
<script>
export default {
data: () => ({})
};
</script>
<style>
</style>

View File

@@ -0,0 +1,26 @@
<template>
<v-flex xs12 md4>
<v-card class="elevation-5 transparent">
<v-card-text class="text-xs-center">
<v-icon x-large color="secondary">fa-cannabis</v-icon>
</v-card-text>
<v-card-title primary-title class="layout justify-center">
<div class="headline">Parts</div>
</v-card-title>
<v-card-text>
Cras facilisis mi vitae nunc lobortis pharetra. Nulla volutpat tincidunt ornare.
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
Nullam in aliquet odio. Aliquam eu est vitae tellus bibendum tincidunt. Suspendisse potenti.
</v-card-text>
</v-card>
</v-flex>
</template>
<script>
export default {
data: () => ({})
};
</script>
<style>
</style>

View File

@@ -0,0 +1,26 @@
<template>
<v-flex xs12 md4>
<v-card class="elevation-5 transparent">
<v-card-text class="text-xs-center">
<v-icon x-large color="secondary">fa-crow</v-icon>
</v-card-text>
<v-card-title primary-title class="layout justify-center">
<div class="headline">Purchase orders</div>
</v-card-title>
<v-card-text>
Cras facilisis mi vitae nunc lobortis pharetra. Nulla volutpat tincidunt ornare.
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
Nullam in aliquet odio. Aliquam eu est vitae tellus bibendum tincidunt. Suspendisse potenti.
</v-card-text>
</v-card>
</v-flex>
</template>
<script>
export default {
data: () => ({})
};
</script>
<style>
</style>

View File

@@ -0,0 +1,26 @@
<template>
<v-flex xs12 md4>
<v-card class="elevation-5 transparent">
<v-card-text class="text-xs-center">
<v-icon x-large color="secondary">fa-heart </v-icon>
</v-card-text>
<v-card-title primary-title class="layout justify-center">
<div class="headline">Warehouses</div>
</v-card-title>
<v-card-text>
Cras facilisis mi vitae nunc lobortis pharetra. Nulla volutpat tincidunt ornare.
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
Nullam in aliquet odio. Aliquam eu est vitae tellus bibendum tincidunt. Suspendisse potenti.
</v-card-text>
</v-card>
</v-flex>
</template>
<script>
export default {
data: () => ({})
};
</script>
<style>
</style>

View File

@@ -0,0 +1,69 @@
<template>
<v-layout row justify-center>
<v-dialog v-model="dialogdata.showeditdialog" persistent max-width="600px">
<!-- <v-btn slot="activator" color="primary" dark>Open Dialog</v-btn> -->
<v-card>
<v-card-title>
<span class="headline">User Profile ID: {{dialogdata.recordId}}</span>
</v-card-title>
<v-card-text>
<v-container grid-list-md>
<v-layout wrap>
<v-flex xs12 sm6 md4>
<v-text-field label="Legal first name*" required></v-text-field>
</v-flex>
<v-flex xs12 sm6 md4>
<v-text-field label="Legal middle name" hint="example of helper text only on focus"></v-text-field>
</v-flex>
<v-flex xs12 sm6 md4>
<v-text-field
label="Legal last name*"
hint="example of persistent helper text"
persistent-hint
required
></v-text-field>
</v-flex>
<v-flex xs12>
<v-text-field label="Email*" required></v-text-field>
</v-flex>
<v-flex xs12>
<v-text-field label="Password*" type="password" required></v-text-field>
</v-flex>
<v-flex xs12 sm6>
<v-select :items="['0-17', '18-29', '30-54', '54+']" label="Age*" required></v-select>
</v-flex>
<v-flex xs12 sm6>
<v-autocomplete
:items="['Skiing', 'Ice hockey', 'Soccer', 'Basketball', 'Hockey', 'Reading', 'Writing', 'Coding', 'Basejump']"
label="Interests"
multiple
></v-autocomplete>
</v-flex>
</v-layout>
</v-container>
<small>*indicates required field</small>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn color="blue darken-1" flat @click="$emit('dialogclose')">Close</v-btn>
<v-btn color="blue darken-1" flat @click="$emit('dialogclose')">Save</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</v-layout>
</template>
<script>
export default {
props: {
dialogdata: {
showeditdialog: false,
recordId: 0
}
},
data: () => ({})
};
</script>
<style>
</style>

View File

@@ -0,0 +1,222 @@
<template>
<v-flex xs12 md12>
<div>
<v-toolbar flat>
<v-toolbar-title>
<v-icon large color="primary">fa-splotch</v-icon>
<span class="hidden-sm-and-down">{{ lt("WidgetList")}}</span>
</v-toolbar-title>
<v-spacer></v-spacer>
<v-btn icon @click="newItem()">
<v-icon>fa-plus-circle</v-icon>
</v-btn>
<v-btn icon>
<v-icon>fa-filter</v-icon>
</v-btn>
<v-btn icon @click="getDataFromApi()">
<v-icon>fa-sync</v-icon>
</v-btn>
<v-btn icon>
<v-icon>fa-ellipsis-v</v-icon>
</v-btn>
</v-toolbar>
<WidgetEdit :dialogdata="dialogdata" v-on:dialogclose="dialogdata.showeditdialog=false"/>
<v-data-table
v-model="selected"
:headers="headers"
:items="Items"
item-key="id"
:pagination.sync="pagination"
:total-items="totalItems"
:loading="loading"
:rows-per-page-items="rowsPerPageItems"
:rows-per-page-text="lt('RowsPerPage')"
class="elevation-1"
>
<template slot="items" slot-scope="props">
<td class="text-xs-left">{{ props.item.name | capitalize }}</td>
<td class="text-xs-left">{{ props.item.serial }}</td>
<td class="text-xs-left">{{ props.item.dollarAmount | currency }}</td>
<td class="text-xs-left">{{ props.item.active | boolastext }}</td>
<td class="text-xs-left">{{ props.item.roles }}</td>
<td class="text-xs-left">{{ props.item.startDate | shortdate}}</td>
<td class="text-xs-left">{{ props.item.endDate | shortdate }}</td>
<td class="justify-center layout px-0">
<v-icon small class="mr-3" @click="editItem(props.item)">fa-pencil-alt</v-icon>
</td>
</template>
</v-data-table>
</div>
</v-flex>
</template>
<script>
/* eslint-disable */
import localeText from "../api/locale";
import pagedList from "../api/pagedlist";
import WidgetEdit from "../components/inventorywidgetedit";
export default {
ltKeysRequired: [
"Widget",
"WidgetList",
"CommonName",
"WidgetSerial",
"WidgetDollarAmount",
"CommonActive",
"WidgetRoles",
"WidgetStartDate",
"WidgetEndDate",
"WidgetNotes",
"RowsPerPage"
],
components: {
WidgetEdit
},
data() {
return {
dialogdata: {
showeditdialog: false,
recordId: 0
},
totalItems: 0,
Items: [],
loading: true,
pagination: {},
selected: [],
rowsPerPageItems: [5, 10, 25, 99],
rowsPerPageText: "blah per blah",
headers: [
{
text: this.lt("CommonName"),
value: "name"
},
{ text: this.lt("WidgetSerial"), value: "serial" },
{ text: this.lt("WidgetDollarAmount"), value: "dollarAmount" },
{ text: this.lt("CommonActive"), value: "active" },
{ text: this.lt("WidgetRoles"), value: "roles" },
{ text: this.lt("WidgetStartDate"), value: "startDate" },
{ text: this.lt("WidgetEndDate"), value: "endDate" }
]
};
},
watch: {
pagination: {
handler() {
this.getDataFromApi();
/*
{
descending: false,
page: 1,
rowsPerPage: 5,
sortBy: "name",
totalItems: 0
}
*/
},
deep: true
}
},
mounted() {
this.rowsPerPageText = lt("RowsPerPage");
this.getDataFromApi();
},
computed: {},
methods: {
lt: function(key) {
return localeText.get(key);
},
newItem() {
this.dialogdata.recordId = -1;
this.dialogdata.showeditdialog = true;
},
getDataFromApi() {
// debugger;
var listOptions = {
offset: 0,
limit: 5,
sort: "name",
asc:true
};
if (this.pagination.rowsPerPage && this.pagination.rowsPerPage > 0) {
listOptions.offset =
(this.pagination.page - 1) * this.pagination.rowsPerPage;
listOptions.limit = this.pagination.rowsPerPage;
}
listOptions.sort = this.pagination.sortBy;
listOptions.asc=!this.pagination.descending;
this.loading = true;
pagedList.fetch("Widget/ListWidgets", listOptions).then(res => {
// debugger;
this.loading = false;
this.Items = res.data;
this.totalItems = res.paging.count;
});
},
editItem(item) {
this.dialogdata.recordId = item.id;
this.dialogdata.showeditdialog = true;
}
}
};
</script>
<style>
</style>
//Example api response
// {
// "data": [
// {
// "id": 1,
// "concurrencyToken": 2262471,
// "ownerId": 1,
// "name": "Handcrafted Wooden Bacon 23",
// "serial": 1,
// "dollarAmount": 25.42,
// "active": true,
// "roles": 8212,
// "startDate": "2018-11-19T12:20:42.920058",
// "endDate": "2018-11-19T15:37:47.053849",
// "notes": "Voluptas assumenda laudantium nemo cupiditate. Quia voluptatem reiciendis et. Sit non error est. Tenetur provident nostrum. Voluptatem voluptatem et."
// },
// {
// "id": 2,
// "concurrencyToken": 2262494,
// "ownerId": 1,
// "name": "Ergonomic Soft Gloves 24",
// "serial": 2,
// "dollarAmount": 530.39,
// "active": true,
// "roles": 8212,
// "startDate": "2018-11-19T12:17:32.488013",
// "endDate": "2018-11-19T17:01:18.425666",
// "notes": "Sed rerum minima blanditiis est. Praesentium consequatur numquam nostrum voluptatem libero dolores voluptatem et. Aut et nobis consectetur voluptatem minus. Ipsa nemo non in iste adipisci voluptatem. Minus consequatur in accusantium."
// },
// {
// "id": 3,
// "concurrencyToken": 2262518,
// "ownerId": 1,
// "name": "Fantastic Metal Computer 25",
// "serial": 3,
// "dollarAmount": 494.3,
// "active": true,
// "roles": 8212,
// "startDate": "2018-11-19T13:06:47.437006",
// "endDate": "2018-11-19T14:41:44.665721",
// "notes": "Facere et ex. Ipsa aspernatur itaque maiores sint nulla esse incidunt. Architecto labore voluptatem dolore iusto ut."
// }
// ],
// "paging": {
// "count": 100,
// "offset": 0,
// "limit": 3,
// "first": "http://localhost:7575/api/v8.0/Widget/ListWidgets?pageNo=1&pageSize=3",
// "previous": null,
// "next": "http://localhost:7575/api/v8.0/Widget/ListWidgets?pageNo=1&pageSize=3",
// "last": "http://localhost:7575/api/v8.0/Widget/ListWidgets?pageNo=34&pageSize=3"
// }
// }

View File

@@ -0,0 +1,145 @@
<template>
<v-container>
<v-layout
text-xs-center
wrap
>
<v-flex xs12>
<v-img
:src="require('../assets/logo.svg')"
class="my-3"
contain
height="200"
></v-img>
</v-flex>
<v-flex mb-4>
<h1 class="display-2 font-weight-bold mb-3">
Welcome to Vuetify
</h1>
<p class="subheading font-weight-regular">
For help and collaboration with other Vuetify developers,
<br>please join our online
<a href="https://community.vuetifyjs.com" target="_blank">Discord Community</a>
</p>
</v-flex>
<v-flex
mb-5
xs12
>
<h2 class="headline font-weight-bold mb-3">What's next?</h2>
<v-layout justify-center>
<a
v-for="(next, i) in whatsNext"
:key="i"
:href="next.href"
class="subheading mx-3"
target="_blank"
>
{{ next.text }}
</a>
</v-layout>
</v-flex>
<v-flex
xs12
mb-5
>
<h2 class="headline font-weight-bold mb-3">Important Links</h2>
<v-layout justify-center>
<a
v-for="(link, i) in importantLinks"
:key="i"
:href="link.href"
class="subheading mx-3"
target="_blank"
>
{{ link.text }}
</a>
</v-layout>
</v-flex>
<v-flex
xs12
mb-5
>
<h2 class="headline font-weight-bold mb-3">Ecosystem</h2>
<v-layout justify-center>
<a
v-for="(eco, i) in ecosystem"
:key="i"
:href="eco.href"
class="subheading mx-3"
target="_blank"
>
{{ eco.text }}
</a>
</v-layout>
</v-flex>
</v-layout>
</v-container>
</template>
<script>
export default {
data: () => ({
ecosystem: [
{
text: "vuetify-loader",
href: "https://github.com/vuetifyjs/vuetify-loader"
},
{
text: "github",
href: "https://github.com/vuetifyjs/vuetify"
},
{
text: "awesome-vuetify",
href: "https://github.com/vuetifyjs/awesome-vuetify"
}
],
importantLinks: [
{
text: "Documentation",
href: "https://vuetifyjs.com"
},
{
text: "Chat",
href: "https://community.vuetifyjs.com"
},
{
text: "Made with Vuetify",
href: "https://madewithvuetifyjs.com"
},
{
text: "Twitter",
href: "https://twitter.com/vuetifyjs"
},
{
text: "Articles",
href: "https://medium.com/vuetify"
}
],
whatsNext: [
{
text: "Explore components",
href: "https://vuetifyjs.com/components/api-explorer"
},
{
text: "Select a layout",
href: "https://vuetifyjs.com/layout/pre-defined"
},
{
text: "Frequently Asked Questions",
href: "https://vuetifyjs.com/getting-started/frequently-asked-questions"
}
]
})
};
</script>
<style>
</style>