Files
site/resources/js/Shared/FeedList/FeedPaidBlock.vue

105 lines
3.5 KiB
Vue
Executable File

<template>
<div v-if="disabled === 0 && is_paid === 1 && $page.props.auth.user.id !== user_id" class="mt-3 rounded-md bg-indigo-300 p-4"
@click.stop=""
>
<div v-if="bought == 0" class="flex items-center justify-center">
<div class="mr-5 mb-2 md:mb-0 font-bold text-center md:text-left w-full md:w-auto">
Цена: {{ price }}
</div>
<div>
<button type="button" class="my-1 transition shadow-none hover:shadow-classic2 inline-flex items-center px-8 py-1 md:py-3 justify-center text-sm md:text-base rounded-md text-white bg-pink focus:outline-none"
@click="purchaseFeed"
>
Купить
</button>
</div>
</div>
<div v-else class="flex flex-wrap items-center justify-center">
<div class="paid-feed-msg mr-5 mb-2 md:mb-0 font-bold text-center md:text-left w-full md:w-auto">
Данный товар вами куплен
</div>
<button v-if="disable_btn == 0 && paid_open == 0" type="button"
class="my-1 mx-1 transition shadow-none hover:shadow-classic2 inline-flex items-center px-8 py-1 md:py-3 justify-center text-sm md:text-base rounded-md text-white bg-orange focus:outline-none" @click="replaceFeed"
>
Показать
</button>
<inertia-link :href="route('setting.show.purchases', feed_id)" class="my-1 mx-1 transition shadow-none hover:shadow-classic2 inline-flex items-center px-8 py-1 md:py-3 justify-center text-sm md:text-base rounded-md text-white bg-pink focus:outline-none">
Скачать
</inertia-link>
</div>
</div>
<div v-else-if="is_paid === 1 && $page.props.auth.user.id === user_id" class="p-4 text-center"
@click.stop=""
>
<button v-if="paid_open === 0" type="button"
class="my-1 mx-1 transition shadow-none hover:shadow-classic2 inline-flex items-center px-8 py-1 md:py-2 justify-center text-sm rounded-md text-white bg-orange focus:outline-none" @click="replaceFeed"
>
Показать эксклюзивный контент
</button>
</div>
</template>
<script>
import axios from 'axios'
export default {
components: {},
props: {
user_id: Number,
is_paid: Number,
feed_id: Number,
price: String,
paid_open: {
type: Number,
default: 0,
},
},
emits: ['onReplaceFeed'],
data() {
return {
bought: 0,
disable_btn: 0,
disabled: 1,
}
},
mounted() {
if (this.is_paid === 1) {
axios
.post(route('feeds.purchase_check', this.feed_id))
.then(({ data }) => {
if (data === 1) {
this.bought = 1
}
this.disabled = 0
})
}
},
methods: {
purchaseFeed() {
axios.post(route('feed.purchase', this.feed_id)).then(({ data }) => {
if (data.error == 1) {
alert(data.msg)
} else {
this.$emit('onReplaceFeed', data)
this.disable_btn = 1
this.bought = 1
}
})
},
replaceFeed() {
axios.post(route('feeds.replace', this.feed_id)).then(({ data }) => {
if (data.collection) {
this.$emit('onReplaceFeed', data)
this.disable_btn = 1
}
})
},
},
}
</script>