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.
78 lines
3.7 KiB
78 lines
3.7 KiB
<template>
|
|
<v-container fluid>
|
|
<v-row v-for="(module, index) in modules" :key="index" :class="`module-item section-bordered theme-${module.color} ma-0 mb-2`">
|
|
<v-col :xl="(type == 'purchased') ? '9' : '6'" class="flex-justified-right">
|
|
<v-icon class="ml-2 text--32" :color="module.color">WMi-{{ module.icon }}</v-icon>
|
|
<name-block class="ltr-3 en-mt-3" :name_fa="module.title_fa" :name_en="module.title_en" />
|
|
</v-col>
|
|
<v-col v-if="(type != 'purchased' && module.remain_days)" xl="4" class="flex-justified-space-between">
|
|
<price-block :price="module.price" :original_price="((module.old_price) ? module.old_price : '')" label="تومان - خرید یک باره" />
|
|
<div :class="`En Bold text--32 ml-2 ${module.color}--text `"> OR </div>
|
|
<price-block class="bg-light-gray" :price="module.monthly_price" :original_price="((module.old_monthly_price) ? module.old_monthly_price : '')" label="تومان - ماهانه" />
|
|
</v-col>
|
|
<v-col v-else-if="(type == 'purchased' || module.remain_days)" xl="3" class="flex-justified-left">
|
|
<number-block :class="`lg label-left theme-${(module.remain_days < 100) ? 'red' : 'cyan'}`" label="روز باقی <br> مــــــــــانده" :number="module.remain_days"/>
|
|
</v-col>
|
|
|
|
<v-col xl="2" v-if="(type != 'purchased' && !module.remain_days)" class="flex-justified-left">
|
|
<v-tooltip top transition="fade-transition" color="black">
|
|
<template v-slot:activator="{ on }">
|
|
<v-btn v-on="on" small dark fab slot="activator" :color="$_color('black')" @click.native="$store.state.TrialConfirmation = true">
|
|
<v-icon dark>WMi-clock</v-icon>
|
|
</v-btn>
|
|
</template>
|
|
<span>فعالسازی نسخه ی 15 روزه، آزمایشی</span>
|
|
</v-tooltip>
|
|
<v-tooltip top transition="fade-transition" color="black">
|
|
<template v-slot:activator="{ on }">
|
|
<v-btn v-on="on" small dark fab slot="activator" :color="module.color" @click.native="$store.state.PaymentConfirmation = true">
|
|
<v-icon dark>WMi-plus</v-icon>
|
|
</v-btn>
|
|
</template>
|
|
<span> افزودن به سیستم </span>
|
|
</v-tooltip>
|
|
</v-col>
|
|
</v-row>
|
|
|
|
|
|
<!-- --------------------------------------------------------------------
|
|
Modals :: BEGIN
|
|
---------------------------------------------------------------------->
|
|
<template>
|
|
<div class="text-xs-center">
|
|
<payment-confirmation />
|
|
<trial-confirmation />
|
|
</div>
|
|
</template>
|
|
|
|
<!-- --------------------------------------------------------------------
|
|
Modals :: END
|
|
---------------------------------------------------------------------->
|
|
</v-container>
|
|
</template>
|
|
<script>
|
|
import PaymentConfirmation from "@Home/components/Modules/PaymentConfirmation";
|
|
import TrialConfirmation from "@Home/components/Modules/TrialConfirmation";
|
|
|
|
export default {
|
|
components: {
|
|
PaymentConfirmation,
|
|
TrialConfirmation,
|
|
},
|
|
props: {
|
|
modules: {default: []},
|
|
type: {default: ''},
|
|
},
|
|
data() {},
|
|
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.module-item {
|
|
position: relative;
|
|
padding: 2px 10px;
|
|
margin-bottom: 10px;
|
|
}
|
|
</style>
|