Browse Source
Reviewed-on: https://gitea.anomalistdesign.com/trent_larson/crowd-funder-for-time-pwa/pulls/103button-visual-enhancement
22 changed files with 1051 additions and 127 deletions
@ -0,0 +1,220 @@ |
|||||
|
<template> |
||||
|
<QuickNav /> |
||||
|
<TopMessage /> |
||||
|
|
||||
|
<!-- CONTENT --> |
||||
|
<section id="Content" class="p-6 pb-24 max-w-3xl mx-auto"> |
||||
|
<!-- Back --> |
||||
|
<div class="text-lg text-center font-light relative px-7"> |
||||
|
<h1 |
||||
|
class="text-lg text-center px-2 py-1 absolute -left-2 -top-1" |
||||
|
@click="$router.back()" |
||||
|
> |
||||
|
<fa icon="chevron-left" class="fa-fw"></fa> |
||||
|
</h1> |
||||
|
</div> |
||||
|
|
||||
|
<!-- Heading --> |
||||
|
<h1 id="ViewHeading" class="text-4xl text-center font-light px-4 mb-4"> |
||||
|
Beginning of BVC Saturday Meeting |
||||
|
</h1> |
||||
|
|
||||
|
<div> |
||||
|
<h2 class="text-2xl m-2">You're Here</h2> |
||||
|
<div class="m-2 flex"> |
||||
|
<input type="checkbox" v-model="attended" class="h-6 w-6" /> |
||||
|
<span class="pb-2 pl-2 pr-2">Attended</span> |
||||
|
</div> |
||||
|
<div class="m-2 flex"> |
||||
|
<input type="checkbox" v-model="gaveTime" class="h-6 w-6" /> |
||||
|
<span class="pb-2 pl-2 pr-2">Spent Time</span> |
||||
|
<span v-if="gaveTime"> |
||||
|
<input |
||||
|
type="text" |
||||
|
placeholder="How much time" |
||||
|
v-model="hoursStr" |
||||
|
size="1" |
||||
|
class="border border-slate-400 h-6 px-2" |
||||
|
/> |
||||
|
hour(s) |
||||
|
</span> |
||||
|
<!-- This is to match input height to avoid shifting when hiding & showing. --> |
||||
|
<span v-else class="h-6" /> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<div |
||||
|
v-if="attended || (gaveTime && hoursStr && hoursStr != '0')" |
||||
|
class="flex justify-center mt-4" |
||||
|
> |
||||
|
<button |
||||
|
@click="record()" |
||||
|
class="block text-center text-md font-bold bg-blue-500 text-white px-2 py-3 rounded-md w-56" |
||||
|
> |
||||
|
Sign & Send |
||||
|
</button> |
||||
|
</div> |
||||
|
<div v-else class="flex justify-center mt-4"> |
||||
|
<button |
||||
|
class="block text-center text-md font-bold bg-slate-500 text-white px-2 py-3 rounded-md w-56" |
||||
|
> |
||||
|
Select Your Actions |
||||
|
</button> |
||||
|
</div> |
||||
|
</section> |
||||
|
</template> |
||||
|
|
||||
|
<script lang="ts"> |
||||
|
import axios from "axios"; |
||||
|
import { DateTime } from "luxon"; |
||||
|
import { Component, Vue } from "vue-facing-decorator"; |
||||
|
|
||||
|
import QuickNav from "@/components/QuickNav.vue"; |
||||
|
import TopMessage from "@/components/TopMessage.vue"; |
||||
|
import { NotificationIface } from "@/constants/app"; |
||||
|
import { db } from "@/db/index"; |
||||
|
import { |
||||
|
BVC_MEETUPS_PROJECT_CLAIM_ID, |
||||
|
bvcMeetingJoinClaim, |
||||
|
createAndSubmitClaim, |
||||
|
createAndSubmitGive, |
||||
|
} from "@/libs/endorserServer"; |
||||
|
import * as libsUtil from "@/libs/util"; |
||||
|
import { MASTER_SETTINGS_KEY, Settings } from "@/db/tables/settings"; |
||||
|
|
||||
|
@Component({ |
||||
|
components: { |
||||
|
QuickNav, |
||||
|
TopMessage, |
||||
|
}, |
||||
|
}) |
||||
|
export default class QuickActionBvcBeginView extends Vue { |
||||
|
$notify!: (notification: NotificationIface, timeout?: number) => void; |
||||
|
|
||||
|
attended = true; |
||||
|
gaveTime = true; |
||||
|
hoursStr = "1"; |
||||
|
todayOrPreviousStartDate = ""; |
||||
|
|
||||
|
async mounted() { |
||||
|
let currentOrPreviousSat = DateTime.now().setZone("America/Denver"); |
||||
|
if (currentOrPreviousSat.weekday < 6) { |
||||
|
// it's not Saturday or Sunday, |
||||
|
// so move back one week before setting to the Saturday |
||||
|
currentOrPreviousSat = currentOrPreviousSat.minus({ week: 1 }); |
||||
|
} |
||||
|
const eventStartDateObj = currentOrPreviousSat |
||||
|
.set({ weekday: 6 }) |
||||
|
.set({ hour: 9 }) |
||||
|
.startOf("hour"); |
||||
|
|
||||
|
// Hack, but full ISO pushes the length to 340 which crashes verifyJWT! |
||||
|
this.todayOrPreviousStartDate = |
||||
|
eventStartDateObj.toISO({ |
||||
|
suppressMilliseconds: true, |
||||
|
}) || ""; |
||||
|
} |
||||
|
|
||||
|
async record() { |
||||
|
await db.open(); |
||||
|
const settings = (await db.settings.get(MASTER_SETTINGS_KEY)) as Settings; |
||||
|
const activeDid = settings?.activeDid || ""; |
||||
|
const apiServer = settings?.apiServer || ""; |
||||
|
|
||||
|
try { |
||||
|
const hoursNum = libsUtil.numberOrZero(this.hoursStr); |
||||
|
const identity = await libsUtil.getIdentity(activeDid); |
||||
|
|
||||
|
// first send the claim for time given |
||||
|
let timeSuccess = false; |
||||
|
if (this.gaveTime && hoursNum > 0) { |
||||
|
const timeResult = await createAndSubmitGive( |
||||
|
axios, |
||||
|
apiServer, |
||||
|
identity, |
||||
|
activeDid, |
||||
|
undefined, |
||||
|
undefined, |
||||
|
hoursNum, |
||||
|
"HUR", |
||||
|
BVC_MEETUPS_PROJECT_CLAIM_ID, |
||||
|
); |
||||
|
if (timeResult.type === "success") { |
||||
|
timeSuccess = true; |
||||
|
} else { |
||||
|
console.error("Error sending give:", timeResult); |
||||
|
this.$notify( |
||||
|
{ |
||||
|
group: "alert", |
||||
|
type: "danger", |
||||
|
title: "Error", |
||||
|
text: |
||||
|
timeResult?.error?.userMessage || |
||||
|
"There was an error sending the time.", |
||||
|
}, |
||||
|
-1, |
||||
|
); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
// now send the claim for attendance |
||||
|
let attendedSuccess = false; |
||||
|
if (this.attended) { |
||||
|
const attendResult = await createAndSubmitClaim( |
||||
|
bvcMeetingJoinClaim(activeDid, this.todayOrPreviousStartDate), |
||||
|
identity, |
||||
|
apiServer, |
||||
|
axios, |
||||
|
); |
||||
|
if (attendResult.type === "success") { |
||||
|
attendedSuccess = true; |
||||
|
} else { |
||||
|
console.error("Error sending give:", attendResult); |
||||
|
this.$notify( |
||||
|
{ |
||||
|
group: "alert", |
||||
|
type: "danger", |
||||
|
title: "Error", |
||||
|
text: |
||||
|
attendResult?.error?.userMessage || |
||||
|
"There was an error sending the attendance.", |
||||
|
}, |
||||
|
-1, |
||||
|
); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
if (timeSuccess || attendedSuccess) { |
||||
|
const actions = |
||||
|
timeSuccess && attendedSuccess |
||||
|
? "attendance and time have been" |
||||
|
: timeSuccess |
||||
|
? "time has been" |
||||
|
: "attendance has been"; |
||||
|
this.$notify( |
||||
|
{ |
||||
|
group: "alert", |
||||
|
type: "success", |
||||
|
title: "Success", |
||||
|
text: `Your ${actions} recorded.`, |
||||
|
}, |
||||
|
-1, |
||||
|
); |
||||
|
} |
||||
|
|
||||
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any |
||||
|
} catch (error: any) { |
||||
|
console.error("Error sending claims.", error); |
||||
|
this.$notify( |
||||
|
{ |
||||
|
group: "alert", |
||||
|
type: "danger", |
||||
|
title: "Error", |
||||
|
text: error.userMessage || "There was an error sending claims.", |
||||
|
}, |
||||
|
-1, |
||||
|
); |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
@ -0,0 +1,368 @@ |
|||||
|
<template> |
||||
|
<QuickNav /> |
||||
|
<TopMessage /> |
||||
|
|
||||
|
<!-- CONTENT --> |
||||
|
<section id="Content" class="p-6 pb-24 max-w-3xl mx-auto"> |
||||
|
<!-- Back --> |
||||
|
<div class="text-lg text-center font-light relative px-7"> |
||||
|
<h1 |
||||
|
class="text-lg text-center px-2 py-1 absolute -left-2 -top-1" |
||||
|
@click="$router.back()" |
||||
|
> |
||||
|
<fa icon="chevron-left" class="fa-fw"></fa> |
||||
|
</h1> |
||||
|
</div> |
||||
|
|
||||
|
<!-- Heading --> |
||||
|
<h1 id="ViewHeading" class="text-4xl text-center font-light px-4 mb-4"> |
||||
|
End of BVC Saturday Meeting |
||||
|
</h1> |
||||
|
|
||||
|
<div> |
||||
|
<h2 class="text-2xl m-2">Confirm</h2> |
||||
|
<div v-if="loadingConfirms" class="flex justify-center"> |
||||
|
<fa icon="spinner" class="animate-spin" /> |
||||
|
</div> |
||||
|
<div v-else-if="claimsToConfirm.length === 0"> |
||||
|
There are no claims yet today for you to confirm. |
||||
|
<span v-if="claimCountWithHidden > 0"> |
||||
|
{{ |
||||
|
claimCountWithHidden === 1 |
||||
|
? "(There is 1 claim with hidden details.)" |
||||
|
: `(There are ${claimCountWithHidden} claims with hidden details.)` |
||||
|
}} |
||||
|
</span> |
||||
|
</div> |
||||
|
<ul class="border-t border-slate-300 m-2"> |
||||
|
<li |
||||
|
class="border-b border-slate-300 py-2" |
||||
|
v-for="record in claimsToConfirm" |
||||
|
:key="record.id" |
||||
|
> |
||||
|
<div class="grid grid-cols-12"> |
||||
|
<span class="col-span-11 justify-self-start"> |
||||
|
<span> |
||||
|
<input |
||||
|
type="checkbox" |
||||
|
:checked="claimsToConfirmSelected.includes(record.id)" |
||||
|
@click=" |
||||
|
claimsToConfirmSelected.includes(record.id) |
||||
|
? claimsToConfirmSelected.splice( |
||||
|
claimsToConfirmSelected.indexOf(record.id), |
||||
|
1, |
||||
|
) |
||||
|
: claimsToConfirmSelected.push(record.id) |
||||
|
" |
||||
|
class="mr-2 h-6 w-6" |
||||
|
/> |
||||
|
</span> |
||||
|
{{ |
||||
|
claimSpecialDescription( |
||||
|
record, |
||||
|
activeDid, |
||||
|
allMyDids, |
||||
|
allContacts, |
||||
|
) |
||||
|
}} |
||||
|
<a @click="onClickLoadClaim(record.id)"> |
||||
|
<fa |
||||
|
icon="circle-info" |
||||
|
class="pl-2 text-blue-500 cursor-pointer" |
||||
|
/> |
||||
|
</a> |
||||
|
</span> |
||||
|
</div> |
||||
|
</li> |
||||
|
</ul> |
||||
|
</div> |
||||
|
|
||||
|
<div> |
||||
|
<h2 class="text-2xl m-2">Anything else?</h2> |
||||
|
<div class="m-2 flex"> |
||||
|
<input type="checkbox" v-model="someoneGave" class="h-6 w-6" /> |
||||
|
<span class="pb-2 pl-2 pr-2">Someone else gave</span> |
||||
|
<span v-if="someoneGave"> |
||||
|
<input |
||||
|
type="text" |
||||
|
v-model="description" |
||||
|
size="20" |
||||
|
class="border border-slate-400 h-6 px-2" |
||||
|
/> |
||||
|
</span> |
||||
|
<!-- This is to match input height to avoid shifting when hiding & showing. --> |
||||
|
<span v-else class="h-6">...</span> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<div |
||||
|
v-if="claimsToConfirmSelected.length || (someoneGave && description)" |
||||
|
class="flex justify-center mt-4" |
||||
|
> |
||||
|
<button |
||||
|
@click="record()" |
||||
|
class="block text-center text-md font-bold bg-blue-500 text-white px-2 py-3 rounded-md w-56" |
||||
|
> |
||||
|
Sign & Send |
||||
|
</button> |
||||
|
</div> |
||||
|
<div v-else class="flex justify-center mt-4"> |
||||
|
<button |
||||
|
class="block text-center text-md font-bold bg-slate-500 text-white px-2 py-3 rounded-md w-56" |
||||
|
> |
||||
|
Choose What To Confirm |
||||
|
</button> |
||||
|
</div> |
||||
|
</section> |
||||
|
</template> |
||||
|
|
||||
|
<script lang="ts"> |
||||
|
import axios from "axios"; |
||||
|
import { DateTime } from "luxon"; |
||||
|
import * as R from "ramda"; |
||||
|
import { IIdentifier } from "@veramo/core"; |
||||
|
import { Component, Vue } from "vue-facing-decorator"; |
||||
|
|
||||
|
import QuickNav from "@/components/QuickNav.vue"; |
||||
|
import TopMessage from "@/components/TopMessage.vue"; |
||||
|
import { NotificationIface } from "@/constants/app"; |
||||
|
import { accountsDB, db } from "@/db/index"; |
||||
|
import { Account } from "@/db/tables/accounts"; |
||||
|
import { Contact } from "@/db/tables/contacts"; |
||||
|
import { MASTER_SETTINGS_KEY, Settings } from "@/db/tables/settings"; |
||||
|
import { accessToken } from "@/libs/crypto"; |
||||
|
import { |
||||
|
BVC_MEETUPS_PROJECT_CLAIM_ID, |
||||
|
claimSpecialDescription, |
||||
|
containsHiddenDid, |
||||
|
createAndSubmitConfirmation, |
||||
|
createAndSubmitGive, |
||||
|
ErrorResult, |
||||
|
GenericServerRecord, |
||||
|
GenericVerifiableCredential, |
||||
|
} from "@/libs/endorserServer"; |
||||
|
import * as libsUtil from "@/libs/util"; |
||||
|
|
||||
|
@Component({ |
||||
|
methods: { claimSpecialDescription }, |
||||
|
components: { |
||||
|
QuickNav, |
||||
|
TopMessage, |
||||
|
}, |
||||
|
}) |
||||
|
export default class QuickActionBvcBeginView extends Vue { |
||||
|
$notify!: (notification: NotificationIface, timeout?: number) => void; |
||||
|
|
||||
|
activeDid = ""; |
||||
|
allContacts: Array<Contact> = []; |
||||
|
allMyDids: Array<string> = []; |
||||
|
apiServer = ""; |
||||
|
claimCountWithHidden = 0; |
||||
|
claimsToConfirm: GenericServerRecord[] = []; |
||||
|
claimsToConfirmSelected: string[] = []; |
||||
|
description = "breakfast"; |
||||
|
loadingConfirms = true; |
||||
|
someoneGave = false; |
||||
|
|
||||
|
async created() { |
||||
|
await db.open(); |
||||
|
const settings = (await db.settings.get(MASTER_SETTINGS_KEY)) as Settings; |
||||
|
this.apiServer = settings?.apiServer || ""; |
||||
|
this.activeDid = settings?.activeDid || ""; |
||||
|
this.allContacts = await db.contacts.toArray(); |
||||
|
} |
||||
|
|
||||
|
async mounted() { |
||||
|
this.loadingConfirms = true; |
||||
|
let currentOrPreviousSat = DateTime.now().setZone("America/Denver"); |
||||
|
if (currentOrPreviousSat.weekday < 6) { |
||||
|
// it's not Saturday or Sunday, |
||||
|
// so move back one week before setting to the Saturday |
||||
|
currentOrPreviousSat = currentOrPreviousSat.minus({ week: 1 }); |
||||
|
} |
||||
|
const eventStartDateObj = currentOrPreviousSat |
||||
|
.set({ weekday: 6 }) |
||||
|
.set({ hour: 9 }) |
||||
|
.startOf("hour"); |
||||
|
|
||||
|
// Hack, but full ISO pushes the length to 340 which crashes verifyJWT! |
||||
|
const todayOrPreviousStartDate = |
||||
|
eventStartDateObj.toISO({ |
||||
|
suppressMilliseconds: true, |
||||
|
}) || ""; |
||||
|
|
||||
|
await accountsDB.open(); |
||||
|
const allAccounts = await accountsDB.accounts.toArray(); |
||||
|
this.allMyDids = allAccounts.map((acc) => acc.did); |
||||
|
const account: Account | undefined = await accountsDB.accounts |
||||
|
.where("did") |
||||
|
.equals(this.activeDid) |
||||
|
.first(); |
||||
|
const identity: IIdentifier = JSON.parse( |
||||
|
(account?.identity as string) || "null", |
||||
|
); |
||||
|
const headers = { |
||||
|
Authorization: "Bearer " + (await accessToken(identity)), |
||||
|
}; |
||||
|
try { |
||||
|
const response = await fetch( |
||||
|
this.apiServer + |
||||
|
"/api/claim/?" + |
||||
|
"issuedAt_greaterThanOrEqualTo=" + |
||||
|
encodeURIComponent(todayOrPreviousStartDate) + |
||||
|
"&excludeConfirmations=true", |
||||
|
{ headers }, |
||||
|
); |
||||
|
|
||||
|
if (!response.ok) { |
||||
|
console.log("Bad response", response); |
||||
|
throw new Error("Bad response when retrieving claims."); |
||||
|
} |
||||
|
await response.json().then((data) => { |
||||
|
const dataByOthers = R.reject( |
||||
|
(claim: GenericServerRecord) => claim.issuer === this.activeDid, |
||||
|
data, |
||||
|
); |
||||
|
const dataByOthersWithoutHidden = R.reject( |
||||
|
containsHiddenDid, |
||||
|
dataByOthers, |
||||
|
); |
||||
|
this.claimsToConfirm = dataByOthersWithoutHidden; |
||||
|
this.claimCountWithHidden = |
||||
|
dataByOthers.length - dataByOthersWithoutHidden.length; |
||||
|
}); |
||||
|
} catch (error) { |
||||
|
console.error("Error:", error); |
||||
|
this.$notify( |
||||
|
{ |
||||
|
group: "alert", |
||||
|
type: "danger", |
||||
|
title: "Error", |
||||
|
text: "There was an error retrieving today's claims to confirm.", |
||||
|
}, |
||||
|
-1, |
||||
|
); |
||||
|
} |
||||
|
this.loadingConfirms = false; |
||||
|
} |
||||
|
|
||||
|
onClickLoadClaim(jwtId: string) { |
||||
|
const route = { |
||||
|
path: "/claim/" + encodeURIComponent(jwtId), |
||||
|
}; |
||||
|
this.$router.push(route); |
||||
|
} |
||||
|
|
||||
|
async record() { |
||||
|
try { |
||||
|
const identity = await libsUtil.getIdentity(this.activeDid); |
||||
|
|
||||
|
// in parallel, make a confirmation for each selected claim and send them all to the server |
||||
|
const confirmResults = await Promise.allSettled( |
||||
|
this.claimsToConfirmSelected.map(async (jwtId) => { |
||||
|
const record = this.claimsToConfirm.find( |
||||
|
(claim) => claim.id === jwtId, |
||||
|
); |
||||
|
if (!record) { |
||||
|
return { type: "error", error: "Record not found." }; |
||||
|
} |
||||
|
const identity = await libsUtil.getIdentity(this.activeDid); |
||||
|
return createAndSubmitConfirmation( |
||||
|
identity, |
||||
|
record.claim as GenericVerifiableCredential, |
||||
|
record.id, |
||||
|
record.handleId, |
||||
|
this.apiServer, |
||||
|
axios, |
||||
|
); |
||||
|
}), |
||||
|
); |
||||
|
// check for any rejected confirmations |
||||
|
const confirmsSucceeded = confirmResults.filter( |
||||
|
(result) => |
||||
|
result.status === "fulfilled" && result.value.type === "success", |
||||
|
); |
||||
|
if (confirmsSucceeded.length < this.claimsToConfirmSelected.length) { |
||||
|
console.error("Error sending confirmations:", confirmResults); |
||||
|
const howMany = confirmsSucceeded.length === 0 ? "all" : "some"; |
||||
|
this.$notify( |
||||
|
{ |
||||
|
group: "alert", |
||||
|
type: "danger", |
||||
|
title: "Error", |
||||
|
text: `There was an error sending ${howMany} of the confirmations.`, |
||||
|
}, |
||||
|
-1, |
||||
|
); |
||||
|
} |
||||
|
|
||||
|
// now send the give for the description |
||||
|
let giveSucceeded = false; |
||||
|
if (this.someoneGave) { |
||||
|
const giveResult = await createAndSubmitGive( |
||||
|
axios, |
||||
|
this.apiServer, |
||||
|
identity, |
||||
|
undefined, |
||||
|
this.activeDid, |
||||
|
this.description, |
||||
|
undefined, |
||||
|
undefined, |
||||
|
BVC_MEETUPS_PROJECT_CLAIM_ID, |
||||
|
); |
||||
|
giveSucceeded = giveResult.type === "success"; |
||||
|
if (!giveSucceeded) { |
||||
|
console.error("Error sending give:", giveResult); |
||||
|
this.$notify( |
||||
|
{ |
||||
|
group: "alert", |
||||
|
type: "danger", |
||||
|
title: "Error", |
||||
|
text: |
||||
|
(giveResult as ErrorResult)?.error?.userMessage || |
||||
|
"There was an error sending the give.", |
||||
|
}, |
||||
|
-1, |
||||
|
); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
if (confirmsSucceeded.length > 0 || giveSucceeded) { |
||||
|
const confirms = |
||||
|
confirmsSucceeded.length === 1 ? "confirmation" : "confirmations"; |
||||
|
const actions = |
||||
|
confirmsSucceeded.length > 0 && giveSucceeded |
||||
|
? `${confirms} and give have been` |
||||
|
: giveSucceeded |
||||
|
? "give has been" |
||||
|
: confirms + |
||||
|
" " + |
||||
|
(confirmsSucceeded.length === 1 ? "has" : "have") + |
||||
|
" been"; |
||||
|
this.$notify( |
||||
|
{ |
||||
|
group: "alert", |
||||
|
type: "success", |
||||
|
title: "Success", |
||||
|
text: `Your ${actions} recorded.`, |
||||
|
}, |
||||
|
-1, |
||||
|
); |
||||
|
} |
||||
|
|
||||
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any |
||||
|
} catch (error: any) { |
||||
|
console.error("Error sending claims.", error); |
||||
|
this.$notify( |
||||
|
{ |
||||
|
group: "alert", |
||||
|
type: "danger", |
||||
|
title: "Error", |
||||
|
text: error.userMessage || "There was an error sending claims.", |
||||
|
}, |
||||
|
-1, |
||||
|
); |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
@ -0,0 +1,52 @@ |
|||||
|
<template> |
||||
|
<QuickNav /> |
||||
|
<TopMessage /> |
||||
|
|
||||
|
<!-- CONTENT --> |
||||
|
<section id="Content" class="p-6 pb-24 max-w-3xl mx-auto"> |
||||
|
<!-- Back --> |
||||
|
<div class="text-lg text-center font-light relative px-7"> |
||||
|
<h1 |
||||
|
class="text-lg text-center px-2 py-1 absolute -left-2 -top-1" |
||||
|
@click="$router.back()" |
||||
|
> |
||||
|
<fa icon="chevron-left" class="fa-fw"></fa> |
||||
|
</h1> |
||||
|
</div> |
||||
|
|
||||
|
<!-- Heading --> |
||||
|
<h1 id="ViewHeading" class="text-4xl text-center font-light px-4 mb-4"> |
||||
|
Bountiful Voluntaryist Community Actions |
||||
|
</h1> |
||||
|
|
||||
|
<div> |
||||
|
<router-link |
||||
|
:to="{ name: 'quick-action-bvc-begin' }" |
||||
|
class="block text-center text-md font-bold uppercase bg-blue-500 text-white mt-2 px-2 py-3 rounded-md" |
||||
|
> |
||||
|
Beginning of Meeting |
||||
|
</router-link> |
||||
|
<router-link |
||||
|
:to="{ name: 'quick-action-bvc-end' }" |
||||
|
class="block text-center text-md font-bold uppercase bg-blue-500 text-white mt-2 px-2 py-3 rounded-md" |
||||
|
> |
||||
|
End of Meeting |
||||
|
</router-link> |
||||
|
</div> |
||||
|
</section> |
||||
|
</template> |
||||
|
|
||||
|
<script lang="ts"> |
||||
|
import { Component, Vue } from "vue-facing-decorator"; |
||||
|
|
||||
|
import QuickNav from "@/components/QuickNav.vue"; |
||||
|
import TopMessage from "@/components/TopMessage.vue"; |
||||
|
|
||||
|
@Component({ |
||||
|
components: { |
||||
|
QuickNav, |
||||
|
TopMessage, |
||||
|
}, |
||||
|
}) |
||||
|
export default class QuickActionBvcView extends Vue {} |
||||
|
</script> |
||||
Loading…
Reference in new issue