nexus/vuefilemanager
2
0
Fork 0
mirror of https://github.com/VueFileManager/vuefilemanager.git synced 2026-04-19 16:32:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

update/delete billing alert

Browse Source
This commit is contained in:
Čarodej
2021-12-18 16:52:11 +01:00
parent 401b511b40
commit e5a2be112b
41 changed files with 573 additions and 325 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
resources/js/views/Admin/AppSettings/AppSettingsTabs/Email.vue
View File

@@ -7,27 +7,27 @@
</InfoBox>
<ValidationProvider tag="div" mode="passive" name="Mail Driver" rules="required" v-slot="{ errors }">
<AppInputText :title="$t('admin_settings.email.driver')" :error="errors[0]">
<input v-model="mail.driver" :placeholder="$t('admin_settings.email.driver_plac')" type="text" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark" />
<input v-model="mail.driver" :placeholder="$t('admin_settings.email.driver_plac')" type="text" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark" />
</AppInputText>
</ValidationProvider>
<ValidationProvider tag="div" mode="passive" name="Mail Host" rules="required" v-slot="{ errors }">
<AppInputText :title="$t('admin_settings.email.host')" :error="errors[0]">
<input v-model="mail.host" :placeholder="$t('admin_settings.email.host_plac')" type="text" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark" />
<input v-model="mail.host" :placeholder="$t('admin_settings.email.host_plac')" type="text" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark" />
</AppInputText>
</ValidationProvider>
<ValidationProvider tag="div" mode="passive" name="Mail Port" rules="required" v-slot="{ errors }">
<AppInputText :title="$t('admin_settings.email.port')" :error="errors[0]">
<input v-model="mail.port" :placeholder="$t('admin_settings.email.port_plac')" type="text" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark" />
<input v-model="mail.port" :placeholder="$t('admin_settings.email.port_plac')" type="text" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark" />
</AppInputText>
</ValidationProvider>
<ValidationProvider tag="div" mode="passive" name="Mail Username" rules="required" v-slot="{ errors }">
<AppInputText :title="$t('admin_settings.email.username')" :error="errors[0]">
<input v-model="mail.username" :placeholder="$t('admin_settings.email.username_plac')" type="text" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark" />
<input v-model="mail.username" :placeholder="$t('admin_settings.email.username_plac')" type="text" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark" />
</AppInputText>
</ValidationProvider>
<ValidationProvider tag="div" mode="passive" name="Mail Password" rules="required" v-slot="{ errors }">
<AppInputText :title="$t('admin_settings.email.password')" :error="errors[0]">
<input v-model="mail.password" :placeholder="$t('admin_settings.email.password_plac')" type="text" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark" />
<input v-model="mail.password" :placeholder="$t('admin_settings.email.password_plac')" type="text" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark" />
</AppInputText>
</ValidationProvider>
<ValidationProvider tag="div" mode="passive" name="Mail Encryption" rules="required" v-slot="{ errors }">

30
resources/js/views/Admin/AppSettings/AppSettingsTabs/Index.vue
View File

@@ -25,7 +25,7 @@
<div class="block-wrapper">
<label>Title:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="App Title" rules="required" v-slot="{ errors }">
<input @input="$updateText('/admin/settings', 'header_title', app.header_title)" v-model="app.header_title" type="text" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark"/>
<input @input="$updateText('/admin/settings', 'header_title', app.header_title)" v-model="app.header_title" type="text" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark"/>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
@@ -33,7 +33,7 @@
<div class="block-wrapper">
<label>Description:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="App Description" rules="required" v-slot="{ errors }">
<textarea @input="$updateText('/admin/settings', 'header_description', app.header_description)" rows="2" v-model="app.header_description" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark"></textarea>
<textarea @input="$updateText('/admin/settings', 'header_description', app.header_description)" rows="2" v-model="app.header_description" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark"></textarea>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
@@ -65,7 +65,7 @@
<div class="block-wrapper">
<label>Title:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="App Title" rules="required" v-slot="{ errors }">
<input @input="$updateText('/admin/settings', 'features_title', app.features_title)" v-model="app.features_title" type="text" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark"/>
<input @input="$updateText('/admin/settings', 'features_title', app.features_title)" v-model="app.features_title" type="text" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark"/>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
@@ -73,7 +73,7 @@
<div class="block-wrapper">
<label>Description:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="App Description" rules="required" v-slot="{ errors }">
<textarea @input="$updateText('/admin/settings', 'features_description', app.features_description)" rows="2" v-model="app.features_description" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark"></textarea>
<textarea @input="$updateText('/admin/settings', 'features_description', app.features_description)" rows="2" v-model="app.features_description" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark"></textarea>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
@@ -104,42 +104,42 @@
<div class="block-wrapper">
<label>First Box Title:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="Feature Title 1" rules="required" v-slot="{ errors }">
<input @input="$updateText('/admin/settings', 'feature_title_1', app.feature_title_1)" v-model="app.feature_title_1" type="text" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark"/>
<input @input="$updateText('/admin/settings', 'feature_title_1', app.feature_title_1)" v-model="app.feature_title_1" type="text" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark"/>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
<div class="block-wrapper">
<label>First Box Description:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="Feature Description 1" rules="required" v-slot="{ errors }">
<textarea @input="$updateText('/admin/settings', 'feature_description_1', app.feature_description_1)" rows="2" v-model="app.feature_description_1" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark"></textarea>
<textarea @input="$updateText('/admin/settings', 'feature_description_1', app.feature_description_1)" rows="2" v-model="app.feature_description_1" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark"></textarea>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
<div class="block-wrapper">
<label>Second Box Title:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="Feature Title 2" rules="required" v-slot="{ errors }">
<input @input="$updateText('/admin/settings', 'feature_title_2', app.feature_title_2)" v-model="app.feature_title_2" type="text" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark"/>
<input @input="$updateText('/admin/settings', 'feature_title_2', app.feature_title_2)" v-model="app.feature_title_2" type="text" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark"/>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
<div class="block-wrapper">
<label>Second Box Description:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="Feature Description 2" rules="required" v-slot="{ errors }">
<textarea @input="$updateText('/admin/settings', 'feature_description_2', app.feature_description_2)" rows="2" v-model="app.feature_description_2" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark"></textarea>
<textarea @input="$updateText('/admin/settings', 'feature_description_2', app.feature_description_2)" rows="2" v-model="app.feature_description_2" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark"></textarea>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
<div class="block-wrapper">
<label>Third Box Title:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="Feature Title 3" rules="required" v-slot="{ errors }">
<input @input="$updateText('/admin/settings', 'feature_title_3', app.feature_title_3)" v-model="app.feature_title_3" type="text" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark"/>
<input @input="$updateText('/admin/settings', 'feature_title_3', app.feature_title_3)" v-model="app.feature_title_3" type="text" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark"/>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
<div class="block-wrapper">
<label>Third Box Description:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="Feature Description 3" rules="required" v-slot="{ errors }">
<textarea @input="$updateText('/admin/settings', 'feature_description_3', app.feature_description_3)" rows="2" v-model="app.feature_description_3" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark"></textarea>
<textarea @input="$updateText('/admin/settings', 'feature_description_3', app.feature_description_3)" rows="2" v-model="app.feature_description_3" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark"></textarea>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
@@ -170,7 +170,7 @@
<div class="block-wrapper">
<label>Title:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="App Title" rules="required" v-slot="{ errors }">
<input @input="$updateText('/admin/settings', 'pricing_title', app.pricing_title)" v-model="app.pricing_title" type="text" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark"/>
<input @input="$updateText('/admin/settings', 'pricing_title', app.pricing_title)" v-model="app.pricing_title" type="text" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark"/>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
@@ -178,7 +178,7 @@
<div class="block-wrapper">
<label>Description:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="App Description" rules="required" v-slot="{ errors }">
<textarea @input="$updateText('/admin/settings', 'pricing_description', app.pricing_description)" rows="2" v-model="app.pricing_description" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark"></textarea>
<textarea @input="$updateText('/admin/settings', 'pricing_description', app.pricing_description)" rows="2" v-model="app.pricing_description" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark"></textarea>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
@@ -210,7 +210,7 @@
<div class="block-wrapper">
<label>Title:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="App Title" rules="required" v-slot="{ errors }">
<input @input="$updateText('/admin/settings', 'get_started_title', app.get_started_title)" v-model="app.get_started_title" type="text" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark"/>
<input @input="$updateText('/admin/settings', 'get_started_title', app.get_started_title)" v-model="app.get_started_title" type="text" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark"/>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
@@ -218,7 +218,7 @@
<div class="block-wrapper">
<label>Description:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="App Description" rules="required" v-slot="{ errors }">
<textarea @input="$updateText('/admin/settings', 'get_started_description', app.get_started_description)" rows="2" v-model="app.get_started_description" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark"></textarea>
<textarea @input="$updateText('/admin/settings', 'get_started_description', app.get_started_description)" rows="2" v-model="app.get_started_description" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark"></textarea>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
@@ -232,7 +232,7 @@
<div class="block-wrapper">
<label>Footer content:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="App Title" rules="required" v-slot="{ errors }">
<input @input="$updateText('/admin/settings', 'footer_content', app.footer_content)" v-model="app.footer_content" type="text" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark"/>
<input @input="$updateText('/admin/settings', 'footer_content', app.footer_content)" v-model="app.footer_content" type="text" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark"/>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>

6
resources/js/views/Admin/AppSettings/AppSettingsTabs/Payments.vue
View File

@@ -35,12 +35,12 @@
</ValidationProvider>
<ValidationProvider tag="div" mode="passive" name="Publishable Key" rules="required" v-slot="{ errors }">
<AppInputText :title="$t('admin_settings.payments.stripe_pub_key')" :error="errors[0]">
<input v-model="stripeCredentials.key" :placeholder="$t('admin_settings.payments.stripe_pub_key_plac')" type="text" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark" />
<input v-model="stripeCredentials.key" :placeholder="$t('admin_settings.payments.stripe_pub_key_plac')" type="text" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark" />
</AppInputText>
</ValidationProvider>
<ValidationProvider tag="div" mode="passive" name="Secret Key" rules="required" v-slot="{ errors }">
<AppInputText :title="$t('admin_settings.payments.stripe_sec_key')" :error="errors[0]">
<input v-model="stripeCredentials.secret" :placeholder="$t('admin_settings.payments.stripe_sec_key_plac')" type="text" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark" />
<input v-model="stripeCredentials.secret" :placeholder="$t('admin_settings.payments.stripe_sec_key_plac')" type="text" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark" />
</AppInputText>
</ValidationProvider>
<ValidationProvider tag="div" mode="passive" name="Webhook URL" rules="required" v-slot="{ errors }">
@@ -53,7 +53,7 @@
</ValidationProvider>
<ValidationProvider tag="div" mode="passive" name="Webhook Secret" rules="required" v-slot="{ errors }">
<AppInputText :title="$t('Webhook Secret')" :error="errors[0]">
<input v-model="stripeCredentials.webhookSecret" :placeholder="$t('admin_settings.payments.stripe_webhook_key_plac')" type="text" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark" />
<input v-model="stripeCredentials.webhookSecret" :placeholder="$t('admin_settings.payments.stripe_webhook_key_plac')" type="text" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark" />
</AppInputText>
</ValidationProvider>
<InfoBox v-if="isError" type="error">

4
resources/js/views/Admin/Languages/Language.vue
View File

@@ -64,7 +64,7 @@
<ValidationProvider tag="div" mode="passive" name="Language name" rules="required" v-slot="{ errors }">
<AppInputText :title="$t('language_name')" :error="errors[0]">
<input @input="$updateText(`/admin/languages/${selectedLanguage.data.id}`, 'name', selectedLanguage.data.attributes.name)" v-model="selectedLanguage.data.attributes.name" :placeholder="$t('admin_settings.appearance.description_plac')" type="text" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark" />
<input @input="$updateText(`/admin/languages/${selectedLanguage.data.id}`, 'name', selectedLanguage.data.attributes.name)" v-model="selectedLanguage.data.attributes.name" :placeholder="$t('admin_settings.appearance.description_plac')" type="text" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark" />
</AppInputText>
</ValidationProvider>
@@ -100,7 +100,7 @@
@input="$updateText(`/admin/languages/${selectedLanguage.data.id}/strings`, key, selectedLanguage.data.attributes.translations[key])"
:rows="selectedLanguage.data.attributes.translations[key].length >= 80 ? 3 : 1"
class="focus-border-theme input-dark"
:class="{'is-error': errors[0]}"
:class="{'border-red-700': errors[0]}"
></textarea>
</AppInputText>
</ValidationProvider>

10
resources/js/views/Admin/Plans/PlanCreate.vue
View File

@@ -9,14 +9,14 @@
<!--Name-->
<ValidationProvider tag="div" mode="passive" name="Name" rules="required" v-slot="{ errors }">
<AppInputText :title="$t('admin_page_plans.form.name')">
<input v-model="plan.name" :placeholder="$t('admin_page_plans.form.name_plac')" type="text" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark" />
<input v-model="plan.name" :placeholder="$t('admin_page_plans.form.name_plac')" type="text" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark" />
</AppInputText>
</ValidationProvider>
<!--Description-->
<ValidationProvider tag="div" mode="passive" name="Description" v-slot="{ errors }">
<AppInputText :title="$t('admin_page_plans.form.description')" :is-last="true">
<textarea v-model="plan.description" :placeholder="$t('admin_page_plans.form.description_plac')" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark"></textarea>
<textarea v-model="plan.description" :placeholder="$t('admin_page_plans.form.description_plac')" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark"></textarea>
</AppInputText>
</ValidationProvider>
</div>
@@ -30,7 +30,7 @@
<!--Price-->
<ValidationProvider tag="div" mode="passive" name="Price" rules="required" v-slot="{ errors }" class="w-full">
<AppInputText :title="$t('admin_page_plans.form.price')" class="w-full">
<input v-model="plan.amount" :placeholder="$t('admin_page_plans.form.price_plac')" type="number" step="0.01" min="1" max="999999999999" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark" />
<input v-model="plan.amount" :placeholder="$t('admin_page_plans.form.price_plac')" type="number" step="0.01" min="1" max="999999999999" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark" />
</AppInputText>
</ValidationProvider>
@@ -58,14 +58,14 @@
<!--Storage Capacity-->
<ValidationProvider tag="div" mode="passive" name="Max Storage Capacity" rules="required" v-slot="{ errors }">
<AppInputText :title="$t('admin_page_plans.form.storage')" :description="$t('admin_page_plans.form.storage_helper')">
<input v-model="plan.features.max_storage_amount" :placeholder="$t('admin_page_plans.form.storage_plac')" type="number" min="1" max="999999999" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark" />
<input v-model="plan.features.max_storage_amount" :placeholder="$t('admin_page_plans.form.storage_plac')" type="number" min="1" max="999999999" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark" />
</AppInputText>
</ValidationProvider>
<!--Team Members-->
<ValidationProvider tag="div" mode="passive" name="Max Team Members" rules="required" v-slot="{ errors }">
<AppInputText :title="$t('Team Members')" :description="$t('To set unlimited team members, type -1 into form')" :is-last="true">
<input v-model="plan.features.max_team_members" :placeholder="$t('Add max team members in number')" type="number" min="1" max="999999999" :class="{'is-error': errors[0]}" class="focus-border-theme input-dark" />
<input v-model="plan.features.max_team_members" :placeholder="$t('Add max team members in number')" type="number" min="1" max="999999999" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark" />
</AppInputText>
</ValidationProvider>
</div>

9
resources/js/views/Admin/Users/User.vue
View File

@@ -39,6 +39,7 @@
import PageHeader from '/resources/js/components/Others/PageHeader'
import ColorLabel from '/resources/js/components/Others/ColorLabel'
import Spinner from '/resources/js/components/FilesView/Spinner'
import {events} from '/resources/js/bus'
import {mapGetters} from 'vuex'
import axios from 'axios'
@@ -80,13 +81,9 @@
route: 'UserStorage',
},
{
title: this.$t('admin_page_user.tabs.subscription'),
title: this.$t('Billing'),
route: 'UserSubscription',
},
{
title: this.$t('Transactions'),
route: 'UserInvoices',
},
{
title: this.$t('admin_page_user.tabs.password'),
route: 'UserPassword',
@@ -109,6 +106,8 @@
},
created() {
this.fetchUser()
events.$on('reload:user', () => this.fetchUser())
}
}
</script>

10
resources/js/views/Admin/Users/UserCreate.vue
View File

@@ -13,14 +13,14 @@
<!--Email-->
<ValidationProvider tag="div" mode="passive" name="email" rules="required" v-slot="{ errors }">
<AppInputText :title="$t('page_registration.label_email')" :error="errors[0]">
<input v-model="user.email" :placeholder="$t('admin_page_user.create_user.label_email')" type="email" class="focus-border-theme input-dark" :class="{'is-error': errors[0]}"/>
<input v-model="user.email" :placeholder="$t('admin_page_user.create_user.label_email')" type="email" class="focus-border-theme input-dark" :class="{'border-red-700': errors[0]}"/>
</AppInputText>
</ValidationProvider>
<!--Name-->
<ValidationProvider tag="div" mode="passive" name="user name" rules="required" v-slot="{ errors }">
<AppInputText :title="$t('page_registration.label_name')" :error="errors[0]">
<input v-model="user.name" :placeholder="$t('admin_page_user.create_user.label_name')" type="text" class="focus-border-theme input-dark" :class="{'is-error': errors[0]}"/>
<input v-model="user.name" :placeholder="$t('admin_page_user.create_user.label_name')" type="text" class="focus-border-theme input-dark" :class="{'border-red-700': errors[0]}"/>
</AppInputText>
</ValidationProvider>
@@ -28,12 +28,12 @@
<div class="flex space-x-4">
<ValidationProvider tag="div" mode="passive" name="password" rules="required" v-slot="{ errors }" class="w-full">
<AppInputText :title="$t('page_registration.label_pass')" :error="errors[0]">
<input v-model="user.password" :placeholder="$t('page_registration.placeholder_pass')" type="password" class="focus-border-theme input-dark" :class="{'is-error': errors[0]}"/>
<input v-model="user.password" :placeholder="$t('page_registration.placeholder_pass')" type="password" class="focus-border-theme input-dark" :class="{'border-red-700': errors[0]}"/>
</AppInputText>
</ValidationProvider>
<ValidationProvider tag="div" mode="passive" name="password confirm" rules="required" v-slot="{ errors }" class="w-full">
<AppInputText :title="$t('page_registration.label_confirm_pass')" :error="errors[0]">
<input v-model="user.password_confirmation" :placeholder="$t('admin_page_user.create_user.label_conf_pass')" type="password" class="focus-border-theme input-dark" :class="{'is-error': errors[0]}"/>
<input v-model="user.password_confirmation" :placeholder="$t('admin_page_user.create_user.label_conf_pass')" type="password" class="focus-border-theme input-dark" :class="{'border-red-700': errors[0]}"/>
</AppInputText>
</ValidationProvider>
</div>
@@ -51,7 +51,7 @@
<!--Storage Capacity-->
<ValidationProvider tag="div" mode="passive" name="storage capacity" rules="required" v-slot="{ errors }">
<AppInputText :title="$t('admin_page_user.label_change_capacity')" :error="errors[0]">
<input v-model="user.max_storage_amount" min="1" max="999999999" :placeholder="$t('admin_page_user.label_change_capacity')" type="number" class="focus-border-theme input-dark" :class="{'is-error': errors[0]}"/>
<input v-model="user.max_storage_amount" min="1" max="999999999" :placeholder="$t('admin_page_user.label_change_capacity')" type="number" class="focus-border-theme input-dark" :class="{'border-red-700': errors[0]}"/>
</AppInputText>
</ValidationProvider>
</div>

2
resources/js/views/Admin/Users/UserTabs/UserDelete.vue
View File

@@ -14,7 +14,7 @@
:placeholder="$t('admin_page_user.placeholder_delete_user')"
type="text"
class="focus-border-theme input-dark"
:class="{'is-error': errors[0]}"
:class="{'border-red-700': errors[0]}"
/>
<ButtonBase :loading="isSendingRequest" :disabled="isSendingRequest" type="submit" button-style="danger" class="submit-button">
{{ $t('admin_page_user.delete_user') }}

96
resources/js/views/Admin/Users/UserTabs/UserFixedSubscription.vue Normal file
View File

@@ -0,0 +1,96 @@
<template>
<div class="card shadow-card">
<div class="md:flex md:space-x-10 mb-8">
<div class="md:mb-0 mb-6">
<b class="block leading-5 text-lg">
{{ status }}
</b>
<small class="text-gray-500">
{{ $t('We will send you a notification upon Subscription expiration') }}
</small>
</div>
<div>
<b class="block leading-5 text-lg">
{{ price }}
</b>
<small class="text-gray-500">
{{ subscription.relationships.plan.data.attributes.name }}
</small>
</div>
</div>
<div v-for="(limit, i) in limitations" :key="i" class="mb-6">
<b class="mb-3 block text-sm text-gray-400">
{{ limit.message }}
</b>
<ProgressLine :data="limit.distribution" />
</div>
</div>
</template>
<script>
import ProgressLine from "../../../../components/Admin/ProgressLine"
import {mapGetters} from "vuex";
export default {
name: 'UserFixedSubscription',
props: [
'subscription',
'user',
],
components: {
ProgressLine
},
computed: {
status() {
return {
'active': `Active until ${this.subscription.attributes.renews_at}`,
'cancelled': `Active until ${this.subscription.attributes.ends_at}`,
}[this.subscription.attributes.status]
},
price() {
return {
'month': `${this.subscription.relationships.plan.data.attributes.price} Per Month`,
'year': `${this.subscription.relationships.plan.data.attributes.price} Per Year`,
}[this.subscription.relationships.plan.data.attributes.interval]
},
},
data() {
return {
limitations: []
}
},
created() {
Object
.entries(this.user.data.meta.limitations)
.map(([key, item]) => {
let payload = {
color: {
'max_storage_amount': 'warning',
'max_team_members': 'purple',
},
message: {
'max_storage_amount': `Total ${item.use} of ${item.total} Used`,
'max_team_members': `Total ${item.use} of ${item.total} Members`,
},
title: {
'max_storage_amount': `Storage`,
'max_team_members': `Team Members`,
}
}
this.limitations.push({
message: payload.message[key],
distribution: [
{
progress: item.percentage,
color: payload.color[key],
title: payload.title[key],
}
]
})
})
}
}
</script>

96
resources/js/views/Admin/Users/UserTabs/UserInvoices.vue
View File

@@ -1,96 +0,0 @@
<template>
<PageTab :is-loading="isLoading">
<div class="card shadow-card">
<DatatableWrapper
@init="isLoading = false"
:api="'/api/subscriptions/admin/users/' + this.$route.params.id + '/transactions'"
:paginator="true"
:columns="columns"
>
<template slot-scope="{ row }">
<tr class="border-b dark:border-opacity-5 border-light border-dashed">
<td class="py-4">
<span class="text-sm font-bold">
{{ row.data.attributes.note }}
</span>
</td>
<td>
<ColorLabel :color="$getTransactionStatusColor(row.data.attributes.status)">
{{ row.data.attributes.status }}
</ColorLabel>
</td>
<td>
<span class="text-sm font-bold" :class="$getTransactionTypeTextColor(row.data.attributes.type)">
{{ $getTransactionMark(row.data.attributes.type) + row.data.attributes.price }}
</span>
</td>
<td>
<span class="text-sm font-bold">
{{ row.data.attributes.created_at }}
</span>
</td>
<td class="text-right">
<img class="inline-block max-h-5" :src="$getPaymentLogo(row.data.attributes.driver)" :alt="row.data.attributes.driver">
</td>
</tr>
</template>
<!--Empty page-->
<template v-slot:empty-page>
<InfoBox>
<p>{{ $t('admin_page_user.invoices.empty') }}</p>
</InfoBox>
</template>
</DatatableWrapper>
</div>
</PageTab>
</template>
<script>
import DatatableWrapper from '/resources/js/components/Others/Tables/DatatableWrapper'
import ColorLabel from "/resources/js/components/Others/ColorLabel"
import PageTab from '/resources/js/components/Others/Layout/PageTab'
import InfoBox from '/resources/js/components/Others/Forms/InfoBox'
export default {
name: 'UserInvoices',
components: {
DatatableWrapper,
ColorLabel,
InfoBox,
PageTab,
},
data() {
return {
isLoading: true,
columns: [
{
label: this.$t('Note'),
field: 'note',
sortable: true
},
{
label: this.$t('Status'),
field: 'status',
sortable: true
},
{
label: this.$t('admin_page_invoices.table.total'),
field: 'amount',
sortable: true
},
{
label: this.$t('Payed At'),
field: 'created_at',
sortable: true
},
{
label: this.$t('Service'),
field: 'driver',
sortable: true
},
],
}
},
}
</script>

150
resources/js/views/Admin/Users/UserTabs/UserMeteredSubscription.vue Normal file
View File

@@ -0,0 +1,150 @@
<template>
<div>
<!--Balance-->
<div class="card shadow-card">
<FormLabel icon="hard-drive">
{{ $t('Balance') }}
</FormLabel>
<b class="text-3xl font-extrabold -mt-3 block mb-0.5">
{{ user.data.relationships.balance.data.attributes.formatted }}
</b>
<ValidationObserver ref="creditUserBalance" @submit.prevent="increaseBalance" v-slot="{ invalid }" tag="form" class="mt-6">
<ValidationProvider tag="div" v-slot="{ errors }" mode="passive" name="Balance Amount" rules="required">
<AppInputText :description="$t('User balance will be increased for the amount above.')" :error="errors[0]" :is-last="true">
<div class="flex space-x-4">
<input v-model="balanceAmount"
:placeholder="$t('Increase user balance for...')"
type="number"
min="1"
max="999999999"
class="focus-border-theme input-dark"
:class="{'border-red-700': errors[0]}"
/>
<ButtonBase type="submit" button-style="theme" class="submit-button"
:loading="isUpdatingBalanceAmount"
:disabled="isUpdatingBalanceAmount"
>
{{ $t('Increase Balance') }}
</ButtonBase>
</div>
</AppInputText>
</ValidationProvider>
</ValidationObserver>
</div>
<!--Usage Estimates-->
<div class="card shadow-card">
<FormLabel icon="hard-drive">
{{ $t('Usage Estimates') }}
</FormLabel>
<b class="text-3xl font-extrabold -mt-3 block mb-0.5">
{{ user.data.meta.usages.costEstimate }}
</b>
<b class="mb-3 block text-sm text-gray-400 mb-5">
{{ user.data.relationships.subscription.data.attributes.updated_at }} {{ $t('till now') }}
</b>
<div>
<div class="flex items-center justify-between py-2 border-b dark:border-opacity-5 border-light border-dashed" v-for="(usage, i) in user.data.meta.usages.featureEstimates" :key="i">
<div class="w-2/4 leading-none">
<b class="text-sm font-bold leading-none">
{{ $t(usage.feature) }}
</b>
<small class="text-xs text-gray-500 pt-2 leading-none block">
{{ $t(`feature_usage_desc_${usage.feature}`) }}
</small>
</div>
<div class="text-left w-1/4">
<span class="text-sm font-bold text-gray-560">
{{ usage.usage }}
</span>
</div>
<div class="text-right w-1/4">
<span class="text-sm font-bold text-theme">
{{ usage.cost }}
</span>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import {ValidationProvider, ValidationObserver} from 'vee-validate/dist/vee-validate.full'
import AppInputText from "../../../../components/Admin/AppInputText"
import FormLabel from "../../../../components/Others/Forms/FormLabel"
import ButtonBase from "../../../../components/FilesView/ButtonBase"
import ColorLabel from "../../../../components/Others/ColorLabel"
import {mapGetters} from "vuex";
import axios from "axios";
import {events} from "../../../../bus";
export default {
name: 'UserMeteredSubscription',
props: [
'subscription',
'user',
],
components: {
ValidationProvider,
ValidationObserver,
AppInputText,
ButtonBase,
ColorLabel,
FormLabel,
},
computed: {
...mapGetters([
]),
},
data() {
return {
balanceAmount: undefined,
isUpdatingBalanceAmount: false,
}
},
methods: {
async increaseBalance() {
// Validate fields
const isValid = await this.$refs.creditUserBalance.validate();
if (!isValid) return;
this.isUpdatingBalanceAmount = true
axios
.post(`/api/subscriptions/admin/users/${this.user.data.id}/credit`, {
amount: this.balanceAmount
})
.then(() => {
events.$emit('reload:user')
this.balanceAmount = undefined
events.$emit('toaster', {
type: 'success',
message: this.$t('User balance was successfully increased'),
})
})
.catch(() => {
events.$emit('toaster', {
type: 'success',
message: this.$t('popup_error.title'),
})
})
.finally(() => {
this.isUpdatingBalanceAmount = false
})
}
},
created() {
}
}
</script>

2
resources/js/views/Admin/Users/UserTabs/UserStorage.vue
View File

@@ -64,7 +64,7 @@
min="1"
max="999999999"
class="focus-border-theme input-dark"
:class="{'is-error': errors[0]}"
:class="{'border-red-700': errors[0]}"
/>
<ButtonBase :loading="isSendingRequest" :disabled="isSendingRequest" type="submit" button-style="theme" class="submit-button">
{{ $t('admin_page_user.change_capacity') }}

174
resources/js/views/Admin/Users/UserTabs/UserSubscription.vue
View File

@@ -1,33 +1,68 @@
<template>
<PageTab :is-loading="isLoading">
<div v-if="subscription" class="card shadow-card">
<div class="md:flex md:space-x-10 mb-8">
<div class="md:mb-0 mb-6">
<b class="block leading-5 text-lg">
{{ status }}
</b>
<small class="text-gray-500">
{{ $t('We will send you a notification upon Subscription expiration') }}
</small>
</div>
<div>
<b class="block leading-5 text-lg">
{{ price }}
</b>
<small class="text-gray-500">
{{ subscription.relationships.plan.data.attributes.name }}
</small>
</div>
</div>
<div v-for="(limit, i) in limitations" :key="i" class="mb-6">
<b class="mb-3 block text-sm text-gray-400">
{{ limit.message }}
</b>
<ProgressLine :data="limit.distribution" />
</div>
<UserMeteredSubscription
v-if="subscription && config.subscriptionType === 'metered'"
:subscription="subscription"
:user="user"
/>
<UserFixedSubscription
v-if="subscription && config.subscriptionType === 'fixed'"
:subscription="subscription"
:user="user"
/>
<!--Transactions-->
<div class="card shadow-card">
<FormLabel icon="file-text">
{{ $t('Transactions') }}
</FormLabel>
<DatatableWrapper
@init="isLoading = false"
:api="'/api/subscriptions/admin/users/' + this.$route.params.id + '/transactions'"
:paginator="true"
:columns="columns"
>
<template slot-scope="{ row }">
<tr class="border-b dark:border-opacity-5 border-light border-dashed">
<td class="py-4">
<span class="text-sm font-bold">
{{ row.data.attributes.note }}
</span>
</td>
<td>
<ColorLabel :color="$getTransactionStatusColor(row.data.attributes.status)">
{{ row.data.attributes.status }}
</ColorLabel>
</td>
<td>
<span class="text-sm font-bold" :class="$getTransactionTypeTextColor(row.data.attributes.type)">
{{ $getTransactionMark(row.data.attributes.type) + row.data.attributes.price }}
</span>
</td>
<td>
<span class="text-sm font-bold">
{{ row.data.attributes.created_at }}
</span>
</td>
<td class="text-right">
<img class="inline-block max-h-5" :src="$getPaymentLogo(row.data.attributes.driver)" :alt="row.data.attributes.driver">
</td>
</tr>
</template>
<!--Empty page-->
<template v-slot:empty-page>
<InfoBox>
<p>{{ $t('admin_page_user.invoices.empty') }}</p>
</InfoBox>
</template>
</DatatableWrapper>
</div>
<!--Empty Message-->
<div v-if="! subscription && !isLoading" class="card shadow-card">
<InfoBox style="margin-bottom: 0">
<p>{{ $t("User don't have any subscription") }}</p>
@@ -37,10 +72,14 @@
</template>
<script>
import ButtonBase from '/resources/js/components/FilesView/ButtonBase'
import ProgressLine from "../../../../components/Admin/ProgressLine"
import DatatableWrapper from '/resources/js/components/Others/Tables/DatatableWrapper'
import FormLabel from "../../../../components/Others/Forms/FormLabel";
import ColorLabel from "/resources/js/components/Others/ColorLabel"
import PageTab from '/resources/js/components/Others/Layout/PageTab'
import InfoBox from '/resources/js/components/Others/Forms/InfoBox'
import UserMeteredSubscription from "./UserMeteredSubscription";
import UserFixedSubscription from "./UserFixedSubscription"
import {mapGetters} from "vuex";
import axios from 'axios'
export default {
@@ -49,30 +88,50 @@
'user'
],
components: {
ProgressLine,
ButtonBase,
UserMeteredSubscription,
UserFixedSubscription,
DatatableWrapper,
ColorLabel,
FormLabel,
InfoBox,
PageTab,
},
computed: {
status() {
return {
'active': `Active until ${this.subscription.attributes.renews_at}`,
'cancelled': `Active until ${this.subscription.attributes.ends_at}`,
}[this.subscription.attributes.status]
},
price() {
return {
'month': `${this.subscription.relationships.plan.data.attributes.price} Per Month`,
'year': `${this.subscription.relationships.plan.data.attributes.price} Per Year`,
}[this.subscription.relationships.plan.data.attributes.interval]
},
...mapGetters([
'config',
]),
},
data() {
return {
subscription: undefined,
isLoading: true,
limitations: [],
columns: [
{
label: this.$t('Note'),
field: 'note',
sortable: true
},
{
label: this.$t('Status'),
field: 'status',
sortable: true
},
{
label: this.$t('admin_page_invoices.table.total'),
field: 'amount',
sortable: true
},
{
label: this.$t('Payed At'),
field: 'created_at',
sortable: true
},
{
label: this.$t('Service'),
field: 'driver',
sortable: true
},
],
}
},
created() {
@@ -80,37 +139,6 @@
.then(response => {
this.subscription = response.data.data
Object
.entries(this.user.data.meta.limitations)
.map(([key, item]) => {
let payload = {
color: {
'max_storage_amount': 'warning',
'max_team_members': 'purple',
},
message: {
'max_storage_amount': `Total ${item.use} of ${item.total} Used`,
'max_team_members': `Total ${item.use} of ${item.total} Members`,
},
title: {
'max_storage_amount': `Storage`,
'max_team_members': `Team Members`,
}
}
this.limitations.push({
message: payload.message[key],
distribution: [
{
progress: item.percentage,
color: payload.color[key],
title: payload.title[key],
}
]
})
})
this.isLoading = false
})
.catch(error => {