trent_larson/crowd-funder-for-time-pwa
4
1
Fork 2
Code Issues Pull Requests 23 Releases 5 Wiki Activity

add separate screen for amount confirmations #15

Merged
anomalist merged 13 commits from separate-dbs into master 2023-03-28 07:50:57 +00:00
Conversation 1 Commits 13 Files Changed 18 +140 -47
4 changed files with 140 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 9317b59231 - Show all commits

34
src/router/index.ts
View File

@@ -23,12 +23,6 @@ const routes: Array<RouteRecordRaw> = [
component: () =>
import(/* webpackChunkName: "about" */ "../views/AboutView.vue"),
},
{
path: "/start",
name: "start",
component: () =>
import(/* webpackChunkName: "start" */ "../views/StartView.vue"),
},
{
path: "/account",
name: "account",
@@ -43,6 +37,14 @@ const routes: Array<RouteRecordRaw> = [
/* webpackChunkName: "confirm-contact" */ "../views/ConfirmContactView.vue"
),
},
{
path: "/contact-amounts",
name: "contact-amounts",
component: () =>
import(
/* webpackChunkName: "contact-amounts" */ "../views/ContactAmountsView.vue"
),
},
{
path: "/contacts",
name: "contacts",
@@ -93,12 +95,6 @@ const routes: Array<RouteRecordRaw> = [
/* webpackChunkName: "new-edit-commitment" */ "../views/NewEditCommitmentView.vue"
),
},
{
path: "/project",
name: "project",
component: () =>
import(/* webpackChunkName: "project" */ "../views/ProjectViewView.vue"),
},
{
path: "/new-edit-project",
name: "new-edit-project",
@@ -107,6 +103,12 @@ const routes: Array<RouteRecordRaw> = [
/* webpackChunkName: "new-edit-project" */ "../views/NewEditProjectView.vue"
),
},
{
path: "/project",
name: "project",
component: () =>
import(/* webpackChunkName: "project" */ "../views/ProjectViewView.vue"),
},
{
path: "/projects",
name: "projects",
@@ -114,12 +116,10 @@ const routes: Array<RouteRecordRaw> = [
import(/* webpackChunkName: "projects" */ "../views/ProjectsView.vue"),
},
{
path: "/commitments",
name: "commitments",
path: "/start",
name: "start",
component: () =>
import(
/* webpackChunkName: "commitments" */ "../views/CommitmentsView.vue"
),
import(/* webpackChunkName: "start" */ "../views/StartView.vue"),
},
];

3
src/views/CommitmentsView.vue
View File

@@ -1,3 +0,0 @@
<template>
<section id="Content" class="p-6 pb-24"></section>
</template>

70
src/views/ContactAmountsView.vue Normal file
View File

@@ -0,0 +1,70 @@
<template>
<!-- QUICK NAV -->
<nav id="QuickNav" class="fixed bottom-0 left-0 right-0 bg-slate-200">
<ul class="flex text-2xl p-2 gap-2">
<!-- Home Feed -->
<li class="basis-1/5 rounded-md text-slate-500">
<router-link :to="{ name: 'home' }" class="block text-center py-3 px-1"
><fa icon="house-chimney" class="fa-fw"></fa
></router-link>
</li>
<!-- Search -->
<li class="basis-1/5 rounded-md text-slate-500">
<router-link
:to="{ name: 'discover' }"
class="block text-center py-3 px-1"
><fa icon="magnifying-glass" class="fa-fw"></fa
></router-link>
</li>
<!-- Contacts -->
<li class="basis-1/5 rounded-md text-slate-500">
<router-link
:to="{ name: 'projects' }"
class="block text-center py-3 px-1"
><fa icon="folder-open" class="fa-fw"></fa
></router-link>
</li>
<!-- Contacts -->
<li class="basis-1/5 rounded-md text-slate-400">
<router-link
:to="{ name: 'contacts' }"
class="block text-center py-3 px-1"
><fa icon="users" class="fa-fw"></fa
></router-link>
</li>
<!-- Profile -->
<li class="basis-1/5 rounded-md text-slate-500">
<router-link
:to="{ name: 'account' }"
class="block text-center py-3 px-1"
><fa icon="circle-user" class="fa-fw"></fa
></router-link>
</li>
</ul>
</nav>
<section id="Content" class="p-6 pb-24">
<h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
Transactions with {{ contact?.name }}
</h1>
<div>{{ contact?.did }}</div>
</section>
</template>
<script lang="ts">
import { Options, Vue } from "vue-class-component";
import { Contact } from "@/db/tables/contacts";
import { db } from "@/db";
@Options({})
export default class ContactsView extends Vue {
contact: Contact | null = null;
trentlarson commented 2023-03-25 04:11:42 +00:00
Outdated
Review
Copy Link

At first I tried this:

contact?: Contact;

... but it complained at me in the console:

[Vue warn]: Property "contactName" was accessed during render but is not defined on instance.

... and it wouldn't load my information -- even though the "contacts.get" a few lines lower loads the right entry, the rest of the page wouldn't recognize that I set this.contact (or any other this value)... it was like the page was broken.

So... this works, but it doesn't seem clean, and if there's a better way than I'm all ears.

At first I tried this: `contact?: Contact;` ... but it complained at me in the console: `[Vue warn]: Property "contactName" was accessed during render but is not defined on instance. ` ... and it wouldn't load my information -- even though the "contacts.get" a few lines lower loads the right entry, the rest of the page wouldn't recognize that I set `this.contact` (or any other `this` value)... it was like the page was broken. So... this works, but it doesn't seem clean, and if there's a better way than I'm all ears.
anomalist commented 2023-03-28 08:09:09 +00:00
Outdated
Review
Copy Link

Have you tried:

contact: Nullable<Contact>;

?

Have you tried: `contact: Nullable<Contact>;` ?
trentlarson commented 2023-03-28 22:43:32 +00:00
Outdated
Review
Copy Link

Both lint & Web Storm say that is not defined

Both lint & Web Storm say that is not defined
// 'created' hook runs when the Vue instance is first created
async created() {
await db.open();
const contactDid = this.$route.query.contactDid as string;
this.contact = (await db.contacts.get(contactDid)) || null;
}
}
</script>

80
src/views/ContactsView.vue
View File

@@ -661,35 +661,61 @@ export default class ContactsView extends Vue {
this.alertMessage = "No identity is available.";
this.isAlertVisible = true;
} else {
let toFrom;
if (fromDid == this.identity?.did) {
toFrom = "from you to " + this.nameForDid(this.contacts, toDid);
} else {
toFrom = "from " + this.nameForDid(this.contacts, fromDid) + " to you";
}
let description;
if (this.hourDescriptionInput) {
description = " with description '" + this.hourDescriptionInput + "'";
} else {
description = " with no description";
}
// if they have unconfirmed amounts, ask to confirm those first
let wantsToConfirm = false;
if (
confirm(
"Are you sure you want to record " +
this.hourInput +
" hours " +
toFrom +
description +
"?"
)
toDid == this.identity?.did &&
this.givenToMeUnconfirmed[fromDid] > 0
) {
this.createAndSubmitGive(
this.identity,
fromDid,
toDid,
parseFloat(this.hourInput),
this.hourDescriptionInput
);
if (
confirm(
"There are " +
this.givenToMeUnconfirmed[fromDid] +
" unconfirmed hours from them." +
" Would you like to confirm some of those hours?"
)
) {
wantsToConfirm = true;
}
}
if (wantsToConfirm) {
this.$router.push({
name: "contact-amounts",
query: { contactDid: fromDid },
});
} else {
// ask to confirm amount
let toFrom;
if (fromDid == this.identity?.did) {
toFrom = "from you to " + this.nameForDid(this.contacts, toDid);
} else {
toFrom =
"from " + this.nameForDid(this.contacts, fromDid) + " to you";
}
let description;
if (this.hourDescriptionInput) {
description = " with description '" + this.hourDescriptionInput + "'";
} else {
description = " with no description";
}
if (
confirm(
"Are you sure you want to record " +
this.hourInput +
" hours " +
toFrom +
description +
"?"
)
) {
this.createAndSubmitGive(
this.identity,
fromDid,
toDid,
parseFloat(this.hourInput),
this.hourDescriptionInput
);
}
}
}
}