mirror of
https://github.com/VueFileManager/vuefilemanager.git
synced 2026-04-19 16:32:15 +00:00
added prettier
This commit is contained in:
Čarodej
@@ -1,91 +1,137 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="card shadow-card">
|
||||
<FormLabel>
|
||||
{{ $t('Details') }}
|
||||
</FormLabel>
|
||||
<div>
|
||||
<div class="card shadow-card">
|
||||
<FormLabel>
|
||||
{{ $t('Details') }}
|
||||
</FormLabel>
|
||||
|
||||
<!--Name-->
|
||||
<AppInputText :title="$t('admin_page_plans.form.name')">
|
||||
<input @input="$updateInput('/subscriptions/admin/plans/' + $route.params.id, 'name', plan.attributes.name)" v-model="plan.attributes.name" :placeholder="$t('admin_page_plans.form.name_plac')" type="text" class="focus-border-theme input-dark"/>
|
||||
</AppInputText>
|
||||
<!--Name-->
|
||||
<AppInputText :title="$t('admin_page_plans.form.name')">
|
||||
<input
|
||||
@input="$updateInput('/subscriptions/admin/plans/' + $route.params.id, 'name', plan.attributes.name)"
|
||||
v-model="plan.attributes.name"
|
||||
:placeholder="$t('admin_page_plans.form.name_plac')"
|
||||
type="text"
|
||||
class="focus-border-theme input-dark"
|
||||
/>
|
||||
</AppInputText>
|
||||
|
||||
<!--Description-->
|
||||
<AppInputText :title="$t('admin_page_plans.form.description')" :is-last="true">
|
||||
<textarea @input="$updateInput('/subscriptions/admin/plans/' + $route.params.id, 'description', plan.attributes.description)" v-model="plan.attributes.description" :placeholder="$t('admin_page_plans.form.description_plac')" class="focus-border-theme input-dark"></textarea>
|
||||
</AppInputText>
|
||||
</div>
|
||||
<div class="card shadow-card">
|
||||
<FormLabel>
|
||||
{{ $t('Charged Features') }}
|
||||
</FormLabel>
|
||||
<!--Description-->
|
||||
<AppInputText :title="$t('admin_page_plans.form.description')" :is-last="true">
|
||||
<textarea
|
||||
@input="$updateInput('/subscriptions/admin/plans/' + $route.params.id, 'description', plan.attributes.description)"
|
||||
v-model="plan.attributes.description"
|
||||
:placeholder="$t('admin_page_plans.form.description_plac')"
|
||||
class="focus-border-theme input-dark"
|
||||
></textarea>
|
||||
</AppInputText>
|
||||
</div>
|
||||
<div class="card shadow-card">
|
||||
<FormLabel>
|
||||
{{ $t('Charged Features') }}
|
||||
</FormLabel>
|
||||
|
||||
<!--Bandwidth-->
|
||||
<AppInputText v-if="plan.attributes.features.bandwidth" :title="$t('Bandwidth Price per 1GB')" :description="$t('Charge your user by the amount of data he upload or download.')" class="w-full">
|
||||
<input :value="formatCurrency(plan.attributes.currency, plan.attributes.features.bandwidth.tiers[0].per_unit)" type="text" class="focus-border-theme input-dark" disabled/>
|
||||
</AppInputText>
|
||||
<!--Bandwidth-->
|
||||
<AppInputText
|
||||
v-if="plan.attributes.features.bandwidth"
|
||||
:title="$t('Bandwidth Price per 1GB')"
|
||||
:description="$t('Charge your user by the amount of data he upload or download.')"
|
||||
class="w-full"
|
||||
>
|
||||
<input
|
||||
:value="formatCurrency(plan.attributes.currency, plan.attributes.features.bandwidth.tiers[0].per_unit)"
|
||||
type="text"
|
||||
class="focus-border-theme input-dark"
|
||||
disabled
|
||||
/>
|
||||
</AppInputText>
|
||||
|
||||
<!--Storage-->
|
||||
<AppInputText v-if="plan.attributes.features.storage" :title="$t('Storage Price per 1GB')" :description="$t('Charge your user by the amount of data he has stored on the disk per 1GB.')" class="w-full">
|
||||
<input :value="formatCurrency(plan.attributes.currency, plan.attributes.features.storage.tiers[0].per_unit)" type="text" class="focus-border-theme input-dark" disabled/>
|
||||
</AppInputText>
|
||||
<!--Storage-->
|
||||
<AppInputText
|
||||
v-if="plan.attributes.features.storage"
|
||||
:title="$t('Storage Price per 1GB')"
|
||||
:description="$t('Charge your user by the amount of data he has stored on the disk per 1GB.')"
|
||||
class="w-full"
|
||||
>
|
||||
<input
|
||||
:value="formatCurrency(plan.attributes.currency, plan.attributes.features.storage.tiers[0].per_unit)"
|
||||
type="text"
|
||||
class="focus-border-theme input-dark"
|
||||
disabled
|
||||
/>
|
||||
</AppInputText>
|
||||
|
||||
<!--Member-->
|
||||
<AppInputText v-if="plan.attributes.features.member" :title="$t('Price per 1 Member')" :description="$t('Charge your user by the total members he use in his Team Folders.')" class="w-full">
|
||||
<input :value="formatCurrency(plan.attributes.currency, plan.attributes.features.member.tiers[0].per_unit)" type="text" class="focus-border-theme input-dark" disabled/>
|
||||
</AppInputText>
|
||||
<!--Member-->
|
||||
<AppInputText
|
||||
v-if="plan.attributes.features.member"
|
||||
:title="$t('Price per 1 Member')"
|
||||
:description="$t('Charge your user by the total members he use in his Team Folders.')"
|
||||
class="w-full"
|
||||
>
|
||||
<input
|
||||
:value="formatCurrency(plan.attributes.currency, plan.attributes.features.member.tiers[0].per_unit)"
|
||||
type="text"
|
||||
class="focus-border-theme input-dark"
|
||||
disabled
|
||||
/>
|
||||
</AppInputText>
|
||||
|
||||
<!--Flat Fee-->
|
||||
<AppInputText v-if="plan.attributes.features.flatFee" :title="$t('Flat Fee per Cycle')" :description="$t('Charge monthly flat fee.')" class="w-full">
|
||||
<input :value="formatCurrency(plan.attributes.currency, plan.attributes.features.flatFee.tiers[0].per_unit)" type="text" class="focus-border-theme input-dark" disabled/>
|
||||
</AppInputText>
|
||||
<!--Flat Fee-->
|
||||
<AppInputText v-if="plan.attributes.features.flatFee" :title="$t('Flat Fee per Cycle')" :description="$t('Charge monthly flat fee.')" class="w-full">
|
||||
<input
|
||||
:value="formatCurrency(plan.attributes.currency, plan.attributes.features.flatFee.tiers[0].per_unit)"
|
||||
type="text"
|
||||
class="focus-border-theme input-dark"
|
||||
disabled
|
||||
/>
|
||||
</AppInputText>
|
||||
|
||||
<InfoBox style="margin-bottom: 0">
|
||||
<p>{{ $t('Price change is not possible. If you would like to change your price or currency, please feel free to create a new plan.') }}</p>
|
||||
</InfoBox>
|
||||
</div>
|
||||
</div>
|
||||
<InfoBox style="margin-bottom: 0">
|
||||
<p>
|
||||
{{ $t('Price change is not possible. If you would like to change your price or currency, please feel free to create a new plan.') }}
|
||||
</p>
|
||||
</InfoBox>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import SwitchInput from "../../../../components/Others/Forms/SwitchInput";
|
||||
import SelectInput from "../../../../components/Others/Forms/SelectInput";
|
||||
import AppInputSwitch from "../../../../components/Admin/AppInputSwitch"
|
||||
import FormLabel from "../../../../components/Others/Forms/FormLabel";
|
||||
import AppInputText from "../../../../components/Admin/AppInputText"
|
||||
import InfoBox from "../../../../components/Others/Forms/InfoBox";
|
||||
import SwitchInput from '../../../../components/Others/Forms/SwitchInput'
|
||||
import SelectInput from '../../../../components/Others/Forms/SelectInput'
|
||||
import AppInputSwitch from '../../../../components/Admin/AppInputSwitch'
|
||||
import FormLabel from '../../../../components/Others/Forms/FormLabel'
|
||||
import AppInputText from '../../../../components/Admin/AppInputText'
|
||||
import InfoBox from '../../../../components/Others/Forms/InfoBox'
|
||||
|
||||
export default {
|
||||
name: 'PlanMeteredSettings',
|
||||
props: [
|
||||
'plan'
|
||||
],
|
||||
components: {
|
||||
AppInputSwitch,
|
||||
AppInputText,
|
||||
SwitchInput,
|
||||
SelectInput,
|
||||
FormLabel,
|
||||
InfoBox,
|
||||
export default {
|
||||
name: 'PlanMeteredSettings',
|
||||
props: ['plan'],
|
||||
components: {
|
||||
AppInputSwitch,
|
||||
AppInputText,
|
||||
SwitchInput,
|
||||
SelectInput,
|
||||
FormLabel,
|
||||
InfoBox,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
visible: undefined,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
formatCurrency(currency, amount) {
|
||||
// TODO: add user locale
|
||||
let formatter = new Intl.NumberFormat('en-US', {
|
||||
style: 'currency',
|
||||
currency: currency,
|
||||
})
|
||||
|
||||
return formatter.format(amount)
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
visible: undefined
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
formatCurrency(currency, amount) {
|
||||
// TODO: add user locale
|
||||
let formatter = new Intl.NumberFormat('en-US', {
|
||||
style: 'currency',
|
||||
currency: currency,
|
||||
});
|
||||
|
||||
return formatter.format(amount);
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.visible = this.plan.attributes.visible
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.visible = this.plan.attributes.visible
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user