|
|
@ -13,18 +13,21 @@ |
|
|
|
<div class="flex flex-row"> |
|
|
|
<span |
|
|
|
class="rounded-l border border-r-0 border-slate-400 bg-slate-200 w-1/3 text-center px-2 py-2" |
|
|
|
>Hours</span |
|
|
|
@click="changeUnitCode()" |
|
|
|
> |
|
|
|
{{ UNIT_SHORT[unitCode] }} |
|
|
|
</span> |
|
|
|
<div |
|
|
|
class="border border-r-0 border-slate-400 bg-slate-200 px-4 py-2" |
|
|
|
@click="decrement()" |
|
|
|
v-if="amountInput !== '0'" |
|
|
|
> |
|
|
|
<fa icon="chevron-left" /> |
|
|
|
</div> |
|
|
|
<input |
|
|
|
type="text" |
|
|
|
class="w-full border border-r-0 border-slate-400 px-2 py-2 text-center" |
|
|
|
v-model="hours" |
|
|
|
v-model="amountInput" |
|
|
|
/> |
|
|
|
<div |
|
|
|
class="rounded-r border border-slate-400 bg-slate-200 px-4 py-2" |
|
|
@ -81,12 +84,31 @@ export default class GiftedDialog extends Vue { |
|
|
|
activeDid = ""; |
|
|
|
apiServer = ""; |
|
|
|
|
|
|
|
amountInput = "0"; |
|
|
|
giver?: GiverInputInfo; // undefined means no identified giver agent |
|
|
|
description = ""; |
|
|
|
givenToUser = false; |
|
|
|
hours = "0"; |
|
|
|
unitCode = "HUR"; |
|
|
|
visible = false; |
|
|
|
|
|
|
|
/* eslint-disable prettier/prettier */ |
|
|
|
UNIT_SHORT: Record<string, string> = { |
|
|
|
"BTC": "BTC", |
|
|
|
"ETH": "ETH", |
|
|
|
"HUR": "Hours", |
|
|
|
"USD": "US $", |
|
|
|
}; |
|
|
|
/* eslint-enable prettier/prettier */ |
|
|
|
|
|
|
|
/* eslint-disable prettier/prettier */ |
|
|
|
UNIT_LONG: Record<string, string> = { |
|
|
|
"BTC": "BTC", |
|
|
|
"ETH": "ETH", |
|
|
|
"HUR": "hours", |
|
|
|
"USD": "dollars", |
|
|
|
}; |
|
|
|
/* eslint-enable prettier/prettier */ |
|
|
|
|
|
|
|
async created() { |
|
|
|
try { |
|
|
|
await db.open(); |
|
|
@ -115,7 +137,7 @@ export default class GiftedDialog extends Vue { |
|
|
|
this.giver = giver; |
|
|
|
// if we show "given to user" selection, default checkbox to true |
|
|
|
this.givenToUser = this.showGivenToUser; |
|
|
|
this.hours = "0"; |
|
|
|
this.amountInput = "0"; |
|
|
|
|
|
|
|
this.visible = true; |
|
|
|
} |
|
|
@ -125,12 +147,21 @@ export default class GiftedDialog extends Vue { |
|
|
|
this.visible = false; |
|
|
|
} |
|
|
|
|
|
|
|
changeUnitCode() { |
|
|
|
const units = Object.keys(this.UNIT_SHORT); |
|
|
|
const index = units.indexOf(this.unitCode); |
|
|
|
this.unitCode = units[(index + 1) % units.length]; |
|
|
|
} |
|
|
|
|
|
|
|
increment() { |
|
|
|
this.hours = `${(parseFloat(this.hours) || 0) + 1}`; |
|
|
|
this.amountInput = `${(parseFloat(this.amountInput) || 0) + 1}`; |
|
|
|
} |
|
|
|
|
|
|
|
decrement() { |
|
|
|
this.hours = `${Math.max(0, (parseFloat(this.hours) || 1) - 1)}`; |
|
|
|
this.amountInput = `${Math.max( |
|
|
|
0, |
|
|
|
(parseFloat(this.amountInput) || 1) - 1, |
|
|
|
)}`; |
|
|
|
} |
|
|
|
|
|
|
|
cancel() { |
|
|
@ -142,7 +173,7 @@ export default class GiftedDialog extends Vue { |
|
|
|
this.description = ""; |
|
|
|
this.giver = undefined; |
|
|
|
this.givenToUser = this.showGivenToUser; |
|
|
|
this.hours = "0"; |
|
|
|
this.amountInput = "0"; |
|
|
|
} |
|
|
|
|
|
|
|
async confirm() { |
|
|
@ -160,7 +191,8 @@ export default class GiftedDialog extends Vue { |
|
|
|
await this.recordGive( |
|
|
|
this.giver?.did as string | undefined, |
|
|
|
this.description, |
|
|
|
parseFloat(this.hours), |
|
|
|
parseFloat(this.amountInput), |
|
|
|
this.unitCode, |
|
|
|
).then(() => { |
|
|
|
this.eraseValues(); |
|
|
|
}); |
|
|
@ -186,12 +218,13 @@ export default class GiftedDialog extends Vue { |
|
|
|
* |
|
|
|
* @param giverDid may be null |
|
|
|
* @param description may be an empty string |
|
|
|
* @param hours may be 0 |
|
|
|
* @param amountInput may be 0 |
|
|
|
*/ |
|
|
|
public async recordGive( |
|
|
|
giverDid?: string, |
|
|
|
description?: string, |
|
|
|
hours?: number, |
|
|
|
amountInput?: number, |
|
|
|
unitCode?: string, |
|
|
|
) { |
|
|
|
if (!this.activeDid) { |
|
|
|
this.$notify( |
|
|
@ -206,13 +239,15 @@ export default class GiftedDialog extends Vue { |
|
|
|
return; |
|
|
|
} |
|
|
|
|
|
|
|
if (!description && !hours) { |
|
|
|
if (!description && !amountInput) { |
|
|
|
this.$notify( |
|
|
|
{ |
|
|
|
group: "alert", |
|
|
|
type: "danger", |
|
|
|
title: "Error", |
|
|
|
text: "You must enter a description or some number of hours.", |
|
|
|
text: `You must enter a description or some number of ${ |
|
|
|
this.UNIT_LONG[this.unitCode] |
|
|
|
}.`, |
|
|
|
}, |
|
|
|
-1, |
|
|
|
); |
|
|
@ -228,7 +263,8 @@ export default class GiftedDialog extends Vue { |
|
|
|
giverDid, |
|
|
|
this.givenToUser ? this.activeDid : undefined, |
|
|
|
description, |
|
|
|
hours, |
|
|
|
amountInput, |
|
|
|
unitCode, |
|
|
|
this.projectId, |
|
|
|
); |
|
|
|
|
|
|
|