feat: wire up paidreviews (#3656)
Co-authored-by: Vlad Stan <stan.v.vlad@gmail.com>
This commit is contained in:
Arc
@@ -561,11 +561,32 @@ include('components/lnbits-error.vue') %}
|
||||
</template>
|
||||
|
||||
<template id="lnbits-extension-rating">
|
||||
<div style="margin-bottom: 3px">
|
||||
<q-rating v-model="rating" size="1.5em" :max="5" color="primary"
|
||||
><q-tooltip>
|
||||
<span v-text="$t('extension_rating_soon')"></span> </q-tooltip
|
||||
></q-rating>
|
||||
<div class="row items-center q-gutter-xs" style="margin-bottom: 3px">
|
||||
<q-rating
|
||||
:model-value="displayRating"
|
||||
size="1.4em"
|
||||
:max="5"
|
||||
color="primary"
|
||||
icon="star_border"
|
||||
icon-selected="star"
|
||||
icon-half="star_half"
|
||||
readonly
|
||||
:class="clickable ? 'cursor-pointer' : ''"
|
||||
@click="handleClick"
|
||||
>
|
||||
<q-tooltip v-if="!hasData">
|
||||
<span v-text="$t('extension_rating_soon')"></span>
|
||||
</q-tooltip>
|
||||
<q-tooltip v-else-if="clickable">
|
||||
<span v-text="$t('reviews_open')"></span>
|
||||
</q-tooltip>
|
||||
</q-rating>
|
||||
<div
|
||||
class="text-caption text-grey"
|
||||
v-if="count !== null && count !== undefined"
|
||||
>
|
||||
<span v-text="`(${count})`"></span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -137,6 +137,19 @@
|
||||
:hint="$t('extension_builder_manifest_url_hint')"
|
||||
></q-input>
|
||||
</div>
|
||||
<div class="col-12 col-md-6">
|
||||
<p>
|
||||
<span v-text="$t('reviews_url')"></span>
|
||||
</p>
|
||||
<q-input
|
||||
filled
|
||||
v-model="formData.lnbits_extensions_reviews_url"
|
||||
:label="$t('reviews_url_label')"
|
||||
:hint="$t('reviews_url_hint')"
|
||||
type="url"
|
||||
autocomplete="off"
|
||||
></q-input>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
|
||||
@@ -163,7 +163,22 @@
|
||||
v-text="extension.name"
|
||||
></div>
|
||||
<div style="justify-content: space-between; display: flex">
|
||||
<lnbits-extension-rating :rating="0" />
|
||||
<lnbits-extension-rating
|
||||
:rating="
|
||||
formatAvg(
|
||||
extension.reviewStats
|
||||
? extension.reviewStats.avg_rating
|
||||
: 0
|
||||
)
|
||||
"
|
||||
:count="
|
||||
extension.reviewStats
|
||||
? extension.reviewStats.review_count
|
||||
: null
|
||||
"
|
||||
:clickable="!!reviewsUrl"
|
||||
@click="openReviews(extension)"
|
||||
/>
|
||||
<q-btn-group size="xs" style="margin: 5px 0">
|
||||
<q-btn
|
||||
v-if="extension.hasFreeRelease"
|
||||
@@ -998,8 +1013,20 @@
|
||||
</div>
|
||||
<div class="col-sm-12 col-md-4 q-pl-sm">
|
||||
<lnbits-extension-rating
|
||||
:rating="0"
|
||||
size="2.5em"
|
||||
:rating="
|
||||
formatAvg(
|
||||
selectedExtension && selectedExtension.reviewStats
|
||||
? selectedExtension.reviewStats.avg_rating
|
||||
: 0
|
||||
)
|
||||
"
|
||||
:count="
|
||||
selectedExtension && selectedExtension.reviewStats
|
||||
? selectedExtension.reviewStats.review_count
|
||||
: null
|
||||
"
|
||||
:clickable="!!reviewsUrl"
|
||||
@click="openReviews(selectedExtension)"
|
||||
></lnbits-extension-rating>
|
||||
<div class="q-mt-md">
|
||||
<b>
|
||||
@@ -1057,6 +1084,182 @@
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
<q-dialog v-model="reviewsDialog.show" position="top">
|
||||
<q-card
|
||||
class="q-pa-md lnbits__dialog-card"
|
||||
style="width: 900px; max-width: 95vw"
|
||||
>
|
||||
<q-card-section class="q-gutter-y-sm">
|
||||
<div class="row items-center">
|
||||
<div class="col">
|
||||
<div
|
||||
class="text-h6"
|
||||
v-text="
|
||||
(reviewsDialog.extension && reviewsDialog.extension.name) ||
|
||||
(reviewsDialog.extension && reviewsDialog.extension.id)
|
||||
"
|
||||
></div>
|
||||
<div
|
||||
class="text-caption text-grey"
|
||||
v-text="reviewsDialog.extension && reviewsDialog.extension.id"
|
||||
></div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<lnbits-extension-rating
|
||||
:rating="
|
||||
formatAvg(
|
||||
reviewsDialog.extension && reviewsDialog.extension.reviewStats
|
||||
? reviewsDialog.extension.reviewStats.avg_rating
|
||||
: 0
|
||||
)
|
||||
"
|
||||
:count="
|
||||
reviewsDialog.extension && reviewsDialog.extension.reviewStats
|
||||
? reviewsDialog.extension.reviewStats.review_count
|
||||
: null
|
||||
"
|
||||
></lnbits-extension-rating>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-separator></q-separator>
|
||||
<q-card-section v-if="!reviewsUrl">
|
||||
<div
|
||||
class="text-negative"
|
||||
v-text="$t('reviews_url_not_configured')"
|
||||
></div>
|
||||
</q-card-section>
|
||||
<q-card-section v-else>
|
||||
<div v-if="reviewsDialog.loading" class="row justify-center q-pa-lg">
|
||||
<q-spinner-bars color="primary" size="2.55em"></q-spinner-bars>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div v-if="reviewsDialog.error" class="text-negative q-mb-md">
|
||||
<span v-text="reviewsDialog.error"></span>
|
||||
</div>
|
||||
|
||||
<q-form @submit="submitReview" class="q-gutter-md">
|
||||
<div class="row q-col-gutter-lg">
|
||||
<div class="col-12 col-md-6">
|
||||
<q-input
|
||||
dense
|
||||
filled
|
||||
v-model="reviewsDialog.form.name"
|
||||
:label="$t('reviews_name')"
|
||||
></q-input>
|
||||
</div>
|
||||
<div class="col-12 col-md-6">
|
||||
<q-rating
|
||||
v-model="reviewsDialog.form.rating"
|
||||
max="10"
|
||||
icon="star_border"
|
||||
icon-selected="star"
|
||||
icon-half="star_half"
|
||||
color="primary"
|
||||
class="float-right"
|
||||
></q-rating>
|
||||
</div>
|
||||
<div class="col-12 col-md-6">
|
||||
<q-input
|
||||
dense
|
||||
filled
|
||||
type="textarea"
|
||||
autogrow
|
||||
v-model="reviewsDialog.form.comment"
|
||||
:label="$t('reviews_comment')"
|
||||
></q-input>
|
||||
</div>
|
||||
|
||||
<div class="col-12 col-md-6">
|
||||
<q-btn
|
||||
type="submit"
|
||||
color="primary"
|
||||
class="float-right"
|
||||
unelevated
|
||||
:loading="reviewsDialog.submitting"
|
||||
:disable="!reviewsDialog.form.rating"
|
||||
:label="$t('reviews_submit')"
|
||||
></q-btn>
|
||||
</div>
|
||||
</div>
|
||||
</q-form>
|
||||
<q-separator class="q-my-md"></q-separator>
|
||||
<div class="row q-col-gutter-lg">
|
||||
<div class="col-12">
|
||||
<div v-if="reviews.length === 0" class="text-grey q-mb-md">
|
||||
<span v-text="$t('no_reviews')"></span>
|
||||
</div>
|
||||
<div v-else>
|
||||
<q-table
|
||||
:rows="reviews"
|
||||
:columns="reviewsTable.columns"
|
||||
v-model:pagination="reviewsTable.pagination"
|
||||
@request="getTagReviews"
|
||||
:loading="reviewsTable.loading"
|
||||
row-key="name"
|
||||
:filter="reviewsTable.search"
|
||||
>
|
||||
<template v-slot:body="props">
|
||||
<q-tr :props="props">
|
||||
<q-td key="name" :props="props">
|
||||
<span v-text="props.row.name"></span>
|
||||
</q-td>
|
||||
<q-td key="comment" :props="props">
|
||||
<span v-text="props.row.comment"></span>
|
||||
</q-td>
|
||||
<q-td key="created_at" :props="props">
|
||||
<span
|
||||
v-text="formatReviewDate(props.row.created_at)"
|
||||
></span>
|
||||
</q-td>
|
||||
<q-td key="rating" :props="props">
|
||||
<q-rating
|
||||
class="float-right q-pt-xs"
|
||||
readonly
|
||||
icon="star_border"
|
||||
icon-selected="star"
|
||||
icon-half="star_half"
|
||||
:model-value="formatAvg(props.row.rating)"
|
||||
size="sm"
|
||||
color="secondary"
|
||||
></q-rating>
|
||||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
</q-table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-separator v-if="reviews.length"></q-separator>
|
||||
<q-card-section>
|
||||
<q-btn
|
||||
@click="reviewsDialog.show = false"
|
||||
color="grey"
|
||||
outline
|
||||
class="float-right"
|
||||
:label="$t('close')"
|
||||
></q-btn>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
<q-dialog v-model="paymentDialog.show" position="top">
|
||||
<q-card class="q-pa-md lnbits__dialog-card">
|
||||
<q-card-section>
|
||||
<q-responsive :ratio="1" class="q-mx-xl q-mb-xl">
|
||||
<lnbits-qrcode
|
||||
:value="paymentDialog.invoice"
|
||||
:options="{width: 800}"
|
||||
class="rounded-borders"
|
||||
></lnbits-qrcode>
|
||||
</q-responsive>
|
||||
</q-card-section>
|
||||
<q-card-actions align="between">
|
||||
<q-btn v-close-popup flat color="grey" :label="$t('close')"></q-btn>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
<q-dialog v-model="showUpdateAllDialog" position="top">
|
||||
<q-card class="q-pa-md q-pt-md lnbits__dialog-card">
|
||||
<div class="row">
|
||||
|
||||
Reference in New Issue
Block a user