ryan/ltx
1
0
Fork 0
Code Issues 4 Pull Requests Packages Projects 3 Releases Wiki Activity

First swing at importing data

Browse Source
This commit is contained in:
ryan
2023-05-05 16:34:51 -07:00
parent 8bbe9c9fb4
commit d6ecb14ff4
14 changed files with 2403 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lifetracker-vue/src/components/AuthNav.vue
+1
View File
@@ -2,6 +2,7 @@
import { useSessionStore } from "../stores/session";
const storeSession = useSessionStore();
// Try connecting to an existing session
storeSession.connect();
</script>
lifetracker-vue/src/router/index.ts
+13
View File
@@ -2,6 +2,7 @@ import { createRouter, createWebHistory } from 'vue-router'
import TableView from '../views/TableView.vue'
import DatabaseView from '../views/DatabaseView.vue'
import AboutView from '../views/AboutView.vue'
import { useSessionStore } from "../stores/session";
const router = createRouter({
history: createWebHistory(import.meta.env.BASE_URL),
@@ -24,3 +25,15 @@ const router = createRouter({
})
export default router
// router.beforeEach(async (to) => {
// // redirect to login page if not logged in and trying to access a restricted page
// const publicPages = ['/database'];
// const authRequired = !publicPages.includes(to.path);
// const auth = useSessionStore();
// if (authRequired && !auth.session['id']) {
// return '/database';
// }
// });
lifetracker-vue/src/services/Api.ts
+7
View File
@@ -0,0 +1,7 @@
import axios from 'axios'
export default() => {
return axios.create({
baseURL: `http://localhost:8081`
})
}
lifetracker-vue/src/stores/database.ts
+23
View File
@@ -0,0 +1,23 @@
import type { IEntry } from "@/types/entry";
import { defineStore } from 'pinia';
import Api from "@/services/Api"
export const useDatabaseStore = defineStore({
id: 'databaseState',
state: () => ({
entries: [] as IEntry[]
}),
getters: {
length: (state) => state.entries.length
},
actions: {
async fetchEntries(){
try{
const response = await Api().get("database");
this.entries = response.data;
} catch (error) {
console.log(error);
}
}
}
})
lifetracker-vue/src/stores/session.ts
+13 -8
View File
@@ -1,5 +1,4 @@
import type { ISession } from '@/types/session';
import axios from 'axios';
import { defineStore } from 'pinia';
import { Client, Account, ID } from 'appwrite';
@@ -15,14 +14,18 @@ export const useSessionStore = defineStore({
session: [] as ISession[],
}),
getters: {
isConnected: (state) => state.session['userId'] == 'ryan',
isConnected: (state) => state.session['userId'],
},
actions: {
logout() {
const promise = this.account.deleteSession(this.session);
const promise = account.deleteSession(this.session.id);
var self = this;
promise.then(function (response) {
self.userId = null; self.email = null; self.session = false;
self.session = {
email: '',
userId: '',
id: '',
};
console.log(response); // Success
}, function (error) {
console.log(error); // Failure
@@ -35,20 +38,21 @@ export const useSessionStore = defineStore({
userId: '',
id: '',
};
var self = this;
promise.then(
function (response) {
session.email = response.providerUid;
session.userId = response.userId;
session.id = response.$id;
console.log('Connected to existing session');
session = session;
self.session = session;
},
function (error) {
session.email = null;
session.userId = null;
session.id = null;
session.id = '';
console.log('No existing session; starting fresh.');
return session;
self.session = session;
}
);
},
@@ -60,12 +64,13 @@ export const useSessionStore = defineStore({
userId: '',
id: '',
};
var self = this;
promise.then(function (response) {
session.email = response.providerUid;
session.userId = response.userId;
session.id = response.$id;
console.log('Logged in');
return session;
self.session = session;
}, function (error) {
console.log('Error');
});
lifetracker-vue/src/types/entry.ts
+6
View File
@@ -0,0 +1,6 @@
export interface IEntry {
date: Date,
hours: Number[],
mood: Number,
note: String
}
lifetracker-vue/src/views/DatabaseView.vue
+12 -13
View File
@@ -1,5 +1,6 @@
<script setup>
import { useSessionStore } from "../stores/session";
import Api from "@/services/Api";
const storeSession = useSessionStore();
</script>
@@ -10,25 +11,22 @@ export default {
},
data(){
return {
userId: userId,
email: email,
password: password,
error: null,
session: session,
}
entries: []
}
},
methods: {
connect() {
console.log("Legacy method called.");
async getDatabase() {
const response = await Api().get("database");
this.entries = response.data;
}
}
}
</script>
<template>
<div v-if="storeSession.session == null">
<div v-if="storeSession.isConnected == null">
Loading...
</div>
<div v-if="storeSession.session == false" id="form">
<div v-if="storeSession.isConnected == ''" id="form">
<h2>Not connected yet.</h2>
<div id="login">
<input name="email" type="text" v-model="email" placeholder="email" />
@@ -37,10 +35,11 @@ export default {
<h3 class="error" v-if="error">{{ error }}</h3>
</div>
</div>
<div v-if="storeSession.session.id">
<h2>Welcome back, {{ userId }}!</h2>
<div v-if="storeSession.isConnected">
<h2>Welcome back, {{ storeSession.session.userId }}!</h2>
<div class="flex">
<button @click="logout">Log Out</button>
<button @click="storeSession.logout()">Log Out</button>
</div>
</div>
</template>
lifetracker-vue/src/views/TableView.vue
+56 -28
View File
@@ -1,44 +1,62 @@
<template>
<hot-table :settings="hotSettings" :data="data"></hot-table>
</template>
<script scoped>
import { Client, Account, ID } from 'appwrite';
<script setup>
import { useDatabaseStore } from "@/stores/database"
import Api from "@/services/Api"
</script>
<script>
import { defineComponent } from 'vue';
import { HotTable } from '@handsontable/vue3';
import { registerAllModules } from 'handsontable/registry';
import 'handsontable/dist/handsontable.full.css';
import Handsontable from 'handsontable/base';
// register Handsontable's modules
registerAllModules();
const appwriteclient = new Client();
appwriteclient
.setEndpoint('http://ryanpandya.com:8080/v1')
.setProject('lifetracker');
const colHeaders = ["DATE", "DAY", "12 AM"]
.concat(Array.from(new Array(11), (x, y) => y+1 + " AM") )
.concat(Array.from(new Array(12), (x, y) => y+1 + " PM") )
.concat(["Mood", "Comments"])
const ExampleComponent = defineComponent({
data() {
return {
entries: [
],
hotSettings: {
data: [
['DATE', 'DAY',
'12 AM', '1 AM', '2 AM', '3 AM', '4 AM', '5 AM', '6 AM', '7 AM', '8 AM', '9 AM', '10 AM', '11 AM',
'12 PM', '1 PM', '2 PM', '3 PM', '4 PM', '5 PM', '6 PM', '7 PM', '8 PM', '9 PM', '10 PM', '11 PM',
'Mood', 'Notes'
],
['A2', 'B2', 'C2', 'D2', 'E2', 'F2', 'G2', 'H2', 'I2', 'J2'],
['A3', 'B3', 'C3', 'D3', 'E3', 'F3', 'G3', 'H3', 'I3', 'J3'],
['A4', 'B4', 'C4', 'D4', 'E4', 'F4', 'G4', 'H4', 'I4', 'J4'],
['A5', 'B5', 'C5', 'D5', 'E5', 'F5', 'G5', 'H5', 'I5', 'J5'],
['A6', 'B6', 'C6', 'D6', 'E6', 'F6', 'G6', 'H6', 'I6', 'J6'],
],
colHeaders: false,
columns: [
{
renderer: 'date'
},
{ renderer: 'text'},
Array.from(new Array(24), (a, b) => { renderer: 'hour'}),
{ renderer: 'text'},
{ renderer: 'text'}
].flat(),
colHeaders: colHeaders,
rowHeaders: false,
readOnly: false,
height: 'auto',
afterChange: () => {
if (this.hotRef) {
console.log(this.hotRef.getSourceData());
}
},
licenseKey: 'non-commercial-and-evaluation'
}
};
},
hotRef: null
}
},
mounted() {
},
methods: {
fetch(){
this.hotRef = this.$refs.wrapper.hotInstance;
const storeDatabase = useDatabaseStore();
storeDatabase.fetchEntries();
this.entries = storeDatabase.entries;
this.hotRef.loadData(this.entries);
}
},
components: {
HotTable,
@@ -46,4 +64,14 @@ const ExampleComponent = defineComponent({
});
export default ExampleComponent;
</script>
</script>
<template>
<button @click="fetch">Fetch</button>
<hot-table ref="wrapper" :settings="hotSettings" :data="entries"></hot-table>
</template>
<style>
</style>