You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
120 lines
3.3 KiB
120 lines
3.3 KiB
<template>
|
|
<QuickNav selected="Profile"></QuickNav>
|
|
<!-- CONTENT -->
|
|
<section id="Content" class="p-6 pb-24">
|
|
<!-- Heading -->
|
|
<h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
|
|
Your Contact Info
|
|
</h1>
|
|
|
|
<!--
|
|
Play with display options: https://qr-code-styling.com/
|
|
See docs: https://www.npmjs.com/package/qr-code-generator-vue3
|
|
-->
|
|
<QRCodeVue3
|
|
:value="this.qrValue"
|
|
:cornersSquareOptions="{ type: 'extra-rounded' }"
|
|
:dotsOptions="{ type: 'square' }"
|
|
class="flex justify-center"
|
|
/>
|
|
</section>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import QRCodeVue3 from "qr-code-generator-vue3";
|
|
import { Component, Vue } from "vue-facing-decorator";
|
|
import { accountsDB, db } from "@/db/index";
|
|
import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
|
|
import * as R from "ramda";
|
|
import { SimpleSigner } from "@/libs/crypto";
|
|
import * as didJwt from "did-jwt";
|
|
import QuickNav from "@/components/QuickNav.vue";
|
|
import { Account } from "@/db/tables/accounts";
|
|
|
|
// eslint-disable-next-line @typescript-eslint/no-var-requires
|
|
const Buffer = require("buffer/").Buffer;
|
|
|
|
interface Notification {
|
|
group: string;
|
|
type: string;
|
|
title: string;
|
|
text: string;
|
|
}
|
|
|
|
@Component({
|
|
components: {
|
|
QRCodeVue3,
|
|
QuickNav,
|
|
},
|
|
})
|
|
export default class ContactQRScanShow extends Vue {
|
|
$notify!: (notification: Notification, timeout?: number) => void;
|
|
|
|
activeDid = "";
|
|
apiServer = "";
|
|
qrValue = "";
|
|
|
|
public async getIdentity(activeDid: string) {
|
|
await accountsDB.open();
|
|
const accounts = await accountsDB.accounts.toArray();
|
|
const account: Account | undefined = R.find(
|
|
(acc) => acc.did === activeDid,
|
|
accounts,
|
|
);
|
|
const identity = JSON.parse(account?.identity || "null");
|
|
|
|
if (!identity) {
|
|
throw new Error(
|
|
"Attempted to load Give records with no identity available.",
|
|
);
|
|
}
|
|
return identity;
|
|
}
|
|
|
|
async created() {
|
|
await db.open();
|
|
const settings = await db.settings.get(MASTER_SETTINGS_KEY);
|
|
this.activeDid = settings?.activeDid || "";
|
|
this.apiServer = settings?.apiServer || "";
|
|
|
|
await accountsDB.open();
|
|
const accounts = await accountsDB.accounts.toArray();
|
|
const account = R.find((acc) => acc.did === this.activeDid, accounts);
|
|
if (!account) {
|
|
this.$notify(
|
|
{
|
|
group: "alert",
|
|
type: "warning",
|
|
title: "",
|
|
text: "You have no identity yet.",
|
|
},
|
|
-1,
|
|
);
|
|
} else {
|
|
const identity = await this.getIdentity(this.activeDid);
|
|
const publicKeyHex = identity.keys[0].publicKeyHex;
|
|
const publicEncKey = Buffer.from(publicKeyHex, "hex").toString("base64");
|
|
const contactInfo = {
|
|
iat: Date.now(),
|
|
iss: this.activeDid,
|
|
own: {
|
|
name: (settings?.firstName || "") + " " + (settings?.lastName || ""),
|
|
publicEncKey,
|
|
},
|
|
};
|
|
|
|
const alg = undefined;
|
|
const privateKeyHex: string = identity.keys[0].privateKeyHex;
|
|
const signer = await SimpleSigner(privateKeyHex);
|
|
// create a JWT for the request
|
|
const vcJwt: string = await didJwt.createJWT(contactInfo, {
|
|
alg: alg,
|
|
issuer: identity.did,
|
|
signer: signer,
|
|
});
|
|
const viewPrefix = "https://endorser.ch/contact?jwt=";
|
|
this.qrValue = viewPrefix + vcJwt;
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|