mirror of
https://github.com/VueFileManager/vuefilemanager.git
synced 2026-04-18 00:02:15 +00:00
users page refactor
This commit is contained in:
Čarodej
@@ -2,7 +2,7 @@
|
||||
"/js/main.js": "/js/main.js",
|
||||
"/css/app.css": "/css/app.css",
|
||||
"/css/tailwind.css": "/css/tailwind.css",
|
||||
"/chunks/admin.js": "/chunks/admin.js?id=3d9181c894abbfe33663",
|
||||
"/chunks/admin.js": "/chunks/admin.js?id=502b35ba2ca5eb8b5dcc",
|
||||
"/chunks/admin-account.js": "/chunks/admin-account.js?id=55f9b983b9aa60c21a62",
|
||||
"/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~c7a13fb0.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~c7a13fb0.js?id=2d52fc8e939196f7ff16",
|
||||
"/chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/~3e4fdd8b.js": "/chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/~3e4fdd8b.js?id=1d731f1c4a9daecb2a99",
|
||||
@@ -26,7 +26,7 @@
|
||||
"/chunks/app-language~chunks/dashboard~chunks/files~chunks/invoices~chunks/my-shared-items~chunks/page~7dbb6a42.js": "/chunks/app-language~chunks/dashboard~chunks/files~chunks/invoices~chunks/my-shared-items~chunks/page~7dbb6a42.js?id=3cbb19b80e635b3524e5",
|
||||
"/chunks/app-others.js": "/chunks/app-others.js?id=388ee5b424fc37d19061",
|
||||
"/chunks/app-payments.js": "/chunks/app-payments.js?id=af38547bd60f92575c03",
|
||||
"/chunks/app-settings.js": "/chunks/app-settings.js?id=a16bef3e89f926038ac6",
|
||||
"/chunks/app-settings.js": "/chunks/app-settings.js?id=abf2e460a1a57f5fc830",
|
||||
"/chunks/app-setup.js": "/chunks/app-setup.js?id=459d95c0256c819ce4bf",
|
||||
"/chunks/app-setup~chunks/billings-detail~chunks/create-new-password~chunks/database~chunks/email-veri~5d0bfc57.js": "/chunks/app-setup~chunks/billings-detail~chunks/create-new-password~chunks/database~chunks/email-veri~5d0bfc57.js?id=107a78323eef0c1d4c81",
|
||||
"/chunks/billings-detail.js": "/chunks/billings-detail.js?id=f8562a0dd73fdc9a3f71",
|
||||
@@ -92,15 +92,15 @@
|
||||
"/chunks/upgrade-billing.js": "/chunks/upgrade-billing.js?id=0b40203411b63118a5eb",
|
||||
"/chunks/upgrade-billing~chunks/upgrade-plan.js": "/chunks/upgrade-billing~chunks/upgrade-plan.js?id=8bd237c632018a537d76",
|
||||
"/chunks/upgrade-plan.js": "/chunks/upgrade-plan.js?id=7ee9b84ffed9bf544997",
|
||||
"/chunks/user.js": "/chunks/user.js?id=24100ba3c089f04cbdd6",
|
||||
"/chunks/user-create.js": "/chunks/user-create.js?id=70a811ada7b123ce9bd7",
|
||||
"/chunks/user.js": "/chunks/user.js?id=5c5421f40243bcba9c23",
|
||||
"/chunks/user-create.js": "/chunks/user-create.js?id=244c7f71f243260e3faa",
|
||||
"/chunks/user-delete.js": "/chunks/user-delete.js?id=6cee8a74926ea9938322",
|
||||
"/chunks/user-detail.js": "/chunks/user-detail.js?id=5fa6f523e2e2cd327da6",
|
||||
"/chunks/user-invoices.js": "/chunks/user-invoices.js?id=a03cdaa3511d88acdd97",
|
||||
"/chunks/user-password.js": "/chunks/user-password.js?id=bc9388e177e8e8e7601a",
|
||||
"/chunks/user-storage.js": "/chunks/user-storage.js?id=cd9d2e6441a5ce09ee69",
|
||||
"/chunks/user-subscription.js": "/chunks/user-subscription.js?id=370b3df08b2ee39bf6ac",
|
||||
"/chunks/users.js": "/chunks/users.js?id=6deee497a896c8dc2560",
|
||||
"/chunks/users.js": "/chunks/users.js?id=7f9e6a60ecca4987bf9c",
|
||||
"/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~24b428d3.js": "/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~24b428d3.js?id=ee89932f7ee76e74483e",
|
||||
"/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~b505e62a.js": "/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~b505e62a.js?id=8163e0eab55c50f8afb8",
|
||||
"/vendors~chunks/admin~chunks/files~chunks/my-shared-items~chunks/platform~chunks/recent-uploads~chunk~40ccbae3.js": "/vendors~chunks/admin~chunks/files~chunks/my-shared-items~chunks/platform~chunks/recent-uploads~chunk~40ccbae3.js?id=37ce1e1ab9968c100712",
|
||||
@@ -343,5 +343,27 @@
|
||||
"/chunks/user-password.d7ae8020dd2f8634e23d.hot-update.js": "/chunks/user-password.d7ae8020dd2f8634e23d.hot-update.js",
|
||||
"/chunks/user-storage.d7ae8020dd2f8634e23d.hot-update.js": "/chunks/user-storage.d7ae8020dd2f8634e23d.hot-update.js",
|
||||
"/js/main.9e048af49ecf3c110fb4.hot-update.js": "/js/main.9e048af49ecf3c110fb4.hot-update.js",
|
||||
"/js/main.322fdb792626c316f23d.hot-update.js": "/js/main.322fdb792626c316f23d.hot-update.js"
|
||||
"/js/main.322fdb792626c316f23d.hot-update.js": "/js/main.322fdb792626c316f23d.hot-update.js",
|
||||
"/chunks/users.cacf26166a91f7b62cbd.hot-update.js": "/chunks/users.cacf26166a91f7b62cbd.hot-update.js",
|
||||
"/chunks/users.ac37fa1e01dab2a68cf9.hot-update.js": "/chunks/users.ac37fa1e01dab2a68cf9.hot-update.js",
|
||||
"/js/main.07c68e100a414dee140d.hot-update.js": "/js/main.07c68e100a414dee140d.hot-update.js",
|
||||
"/chunks/users.8db909104b8ca88ccf48.hot-update.js": "/chunks/users.8db909104b8ca88ccf48.hot-update.js",
|
||||
"/chunks/admin.50942813bd4ffb88ca8e.hot-update.js": "/chunks/admin.50942813bd4ffb88ca8e.hot-update.js",
|
||||
"/chunks/app-settings.fbd655a0e6cdb58ef877.hot-update.js": "/chunks/app-settings.fbd655a0e6cdb58ef877.hot-update.js",
|
||||
"/chunks/users.181bb5074ed83ae94603.hot-update.js": "/chunks/users.181bb5074ed83ae94603.hot-update.js",
|
||||
"/chunks/users.d4971287867035574c8a.hot-update.js": "/chunks/users.d4971287867035574c8a.hot-update.js",
|
||||
"/chunks/user-create.120e9e7fdee3ed97c783.hot-update.js": "/chunks/user-create.120e9e7fdee3ed97c783.hot-update.js",
|
||||
"/chunks/user-create.3438c1a6a347cd2860d9.hot-update.js": "/chunks/user-create.3438c1a6a347cd2860d9.hot-update.js",
|
||||
"/chunks/user-create.bc094f70de66ae88262d.hot-update.js": "/chunks/user-create.bc094f70de66ae88262d.hot-update.js",
|
||||
"/chunks/admin.2bf0d9aaaf2d445552f8.hot-update.js": "/chunks/admin.2bf0d9aaaf2d445552f8.hot-update.js",
|
||||
"/chunks/admin.e3f93e98b72fc99f120f.hot-update.js": "/chunks/admin.e3f93e98b72fc99f120f.hot-update.js",
|
||||
"/chunks/users.f6624a5e815e84a0066d.hot-update.js": "/chunks/users.f6624a5e815e84a0066d.hot-update.js",
|
||||
"/chunks/users.58d748d81ee78ffd36a5.hot-update.js": "/chunks/users.58d748d81ee78ffd36a5.hot-update.js",
|
||||
"/chunks/admin.da1f2604496245556105.hot-update.js": "/chunks/admin.da1f2604496245556105.hot-update.js",
|
||||
"/chunks/app-settings.a9982ca0ef6346bf5e6c.hot-update.js": "/chunks/app-settings.a9982ca0ef6346bf5e6c.hot-update.js",
|
||||
"/chunks/user.670bcfd397842d38a6ed.hot-update.js": "/chunks/user.670bcfd397842d38a6ed.hot-update.js",
|
||||
"/chunks/user.ffd5f50d66b11993c3c7.hot-update.js": "/chunks/user.ffd5f50d66b11993c3c7.hot-update.js",
|
||||
"/chunks/user.d6aa43992d355ce3470b.hot-update.js": "/chunks/user.d6aa43992d355ce3470b.hot-update.js",
|
||||
"/chunks/user.4efb9f76cee2f5abb951.hot-update.js": "/chunks/user.4efb9f76cee2f5abb951.hot-update.js",
|
||||
"/chunks/user.3b58dc9287c1c1384bb4.hot-update.js": "/chunks/user.3b58dc9287c1c1384bb4.hot-update.js"
|
||||
}
|
||||
|
||||
@@ -139,7 +139,7 @@ export default {
|
||||
}
|
||||
|
||||
.input-dark {
|
||||
@apply w-full bg-light-background py-3 px-4.5 rounded-lg appearance-none border-transparent text-base font-bold border
|
||||
@apply w-full bg-light-background py-3 px-5 rounded-lg appearance-none border-transparent text-base font-bold border
|
||||
}
|
||||
|
||||
[v-cloak],
|
||||
|
||||
@@ -87,7 +87,7 @@
|
||||
</ContentGroup>
|
||||
</ContentSidebar>
|
||||
|
||||
<router-view/>
|
||||
<router-view class="pr-6 w-full overflow-x-hidden relative lg:pt-6 pt-4" style="background: rgba(244, 245, 246, 0.6)" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div class="pr-6 w-full overflow-x-hidden relative" style="background: rgba(244, 245, 246, 0.6)">
|
||||
<div>
|
||||
<!--Page Tab links-->
|
||||
<div class="card shadow-card py-0 lg:mt-6 mt-4 sticky top-0 z-10">
|
||||
<div class="card shadow-card py-0 sticky top-0 z-10">
|
||||
<router-link
|
||||
class="inline-block text-sm font-bold px-4 py-5 border-b-2 border-transparent border-bottom-theme"
|
||||
:class="{'text-theme': $router.currentRoute.name === page.route, 'text-gray-600': $router.currentRoute.name !== page.route}"
|
||||
|
||||
@@ -1,7 +1,15 @@
|
||||
<template>
|
||||
<div class="pr-6 w-full overflow-x-hidden relative" style="background: rgba(244, 245, 246, 0.6)">
|
||||
<div>
|
||||
<div class="card shadow-card">
|
||||
|
||||
<div class="mb-6">
|
||||
<router-link :to="{name: 'UserCreate'}">
|
||||
<MobileActionButton icon="user-plus">
|
||||
{{ $t('admin_page_user.create_user.submit') }}
|
||||
</MobileActionButton>
|
||||
</router-link>
|
||||
</div>
|
||||
|
||||
<div class="card shadow-card lg:mt-6 mt-4">
|
||||
<!--Datatable-->
|
||||
<DatatableWrapper @init="isLoading = false" api="/api/admin/users" :paginator="true" :columns="columns" class="table table-users">
|
||||
<template slot-scope="{ row }">
|
||||
@@ -71,11 +79,6 @@
|
||||
<!–Table tools–>
|
||||
<div class="table-tools">
|
||||
<div class="buttons">
|
||||
<router-link :to="{name: 'UserCreate'}">
|
||||
<MobileActionButton icon="user-plus">
|
||||
{{ $t('admin_page_user.create_user.submit') }}
|
||||
</MobileActionButton>
|
||||
</router-link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -1,9 +1,8 @@
|
||||
<template>
|
||||
<div class="pr-6 w-full overflow-x-hidden relative" style="background: rgba(244, 245, 246, 0.6)">
|
||||
|
||||
<div>
|
||||
<div id="page-content" v-if="! isLoading">
|
||||
<!--Page Tab links-->
|
||||
<div class="card shadow-card pt-4 pb-0 lg:mt-6 mt-4 sticky top-0 z-10">
|
||||
<div class="card shadow-card pt-4 pb-0 sticky top-0 z-10">
|
||||
<div class="user-thumbnail">
|
||||
<div class="avatar">
|
||||
<img :src="user.data.relationships.settings.data.attributes.avatar.sm" :alt="user.data.relationships.settings.data.attributes.name">
|
||||
|
||||
@@ -1,92 +1,83 @@
|
||||
<template>
|
||||
<div id="single-page">
|
||||
<div id="page-content" class="small-width">
|
||||
<MobileHeader :title="$t($router.currentRoute.meta.title)"/>
|
||||
<PageHeader :can-back="true" :title="$t($router.currentRoute.meta.title)"/>
|
||||
<ValidationObserver @submit.prevent="createUser" ref="createUser" v-slot="{ invalid }" tag="form" class="form block-form">
|
||||
|
||||
<div class="content-page">
|
||||
<ValidationObserver @submit.prevent="createUser" ref="createUser" v-slot="{ invalid }" tag="form" class="form block-form">
|
||||
<div class="card shadow-card">
|
||||
<FormLabel>{{ $t('admin_page_user.create_user.group_details') }}</FormLabel>
|
||||
|
||||
<div class="form-group">
|
||||
<FormLabel>{{ $t('admin_page_user.create_user.group_details') }}</FormLabel>
|
||||
<!--Avatar-->
|
||||
<div class="block-wrapper">
|
||||
<label>{{ $t('admin_page_user.create_user.avatar') }}</label>
|
||||
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="avatar" v-slot="{ errors }">
|
||||
<ImageInput v-model="user.avatar" :error="errors[0]" />
|
||||
</ValidationProvider>
|
||||
</div>
|
||||
|
||||
<!--Avatar-->
|
||||
<div class="block-wrapper">
|
||||
<label>{{ $t('admin_page_user.create_user.avatar') }}</label>
|
||||
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="avatar" v-slot="{ errors }">
|
||||
<ImageInput v-model="user.avatar" :error="errors[0]" />
|
||||
</ValidationProvider>
|
||||
</div>
|
||||
<!--Email-->
|
||||
<div class="block-wrapper">
|
||||
<label>{{ $t('page_registration.label_email') }}:</label>
|
||||
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="email" rules="required" v-slot="{ errors }">
|
||||
<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]}"/>
|
||||
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
|
||||
</ValidationProvider>
|
||||
</div>
|
||||
|
||||
<!--Email-->
|
||||
<div class="block-wrapper">
|
||||
<label>{{ $t('page_registration.label_email') }}:</label>
|
||||
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="email" rules="required" v-slot="{ errors }">
|
||||
<input v-model="user.email" :placeholder="$t('admin_page_user.create_user.label_email')" type="email" class="focus-border-theme" :class="{'is-error': errors[0]}"/>
|
||||
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
|
||||
</ValidationProvider>
|
||||
</div>
|
||||
<!--Name-->
|
||||
<div class="block-wrapper">
|
||||
<label>{{ $t('page_registration.label_name') }}:</label>
|
||||
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="user name" rules="required" v-slot="{ errors }">
|
||||
<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]}"/>
|
||||
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
|
||||
</ValidationProvider>
|
||||
</div>
|
||||
|
||||
<!--Name-->
|
||||
<div class="block-wrapper">
|
||||
<label>{{ $t('page_registration.label_name') }}:</label>
|
||||
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="user name" rules="required" v-slot="{ errors }">
|
||||
<input v-model="user.name" :placeholder="$t('admin_page_user.create_user.label_name')" type="text" class="focus-border-theme" :class="{'is-error': errors[0]}"/>
|
||||
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
|
||||
</ValidationProvider>
|
||||
</div>
|
||||
<!--Password-->
|
||||
<div class="wrapper-inline">
|
||||
<div class="block-wrapper">
|
||||
<label>{{ $t('page_registration.label_pass') }}:</label>
|
||||
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="password" rules="required" v-slot="{ errors }">
|
||||
<input v-model="user.password" :placeholder="$t('page_registration.placeholder_pass')" type="password" class="focus-border-theme input-dark" :class="{'is-error': errors[0]}"/>
|
||||
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
|
||||
</ValidationProvider>
|
||||
</div>
|
||||
|
||||
<!--Password-->
|
||||
<div class="wrapper-inline">
|
||||
<div class="block-wrapper">
|
||||
<label>{{ $t('page_registration.label_pass') }}:</label>
|
||||
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="password" rules="required" v-slot="{ errors }">
|
||||
<input v-model="user.password" :placeholder="$t('page_registration.placeholder_pass')" type="password" class="focus-border-theme" :class="{'is-error': errors[0]}"/>
|
||||
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
|
||||
</ValidationProvider>
|
||||
</div>
|
||||
<div class="block-wrapper">
|
||||
<label>{{ $t('page_registration.label_confirm_pass') }}:</label>
|
||||
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="password confirm" rules="required" v-slot="{ errors }">
|
||||
<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]}"/>
|
||||
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
|
||||
</ValidationProvider>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="block-wrapper">
|
||||
<label>{{ $t('page_registration.label_confirm_pass') }}:</label>
|
||||
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="password confirm" rules="required" v-slot="{ errors }">
|
||||
<input v-model="user.password_confirmation" :placeholder="$t('admin_page_user.create_user.label_conf_pass')" type="password" class="focus-border-theme" :class="{'is-error': errors[0]}"/>
|
||||
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
|
||||
</ValidationProvider>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card shadow-card">
|
||||
<FormLabel>{{ $t('admin_page_user.create_user.group_settings') }}</FormLabel>
|
||||
|
||||
<div class="form-group">
|
||||
<FormLabel>{{ $t('admin_page_user.create_user.group_settings') }}</FormLabel>
|
||||
<!--User Role-->
|
||||
<div class="block-wrapper">
|
||||
<label>{{ $t('admin_page_user.select_role') }}:</label>
|
||||
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="permission" rules="required" v-slot="{ errors }">
|
||||
<SelectInput v-model="user.role" :options="$translateSelectOptions(roles)" :placeholder="$t('admin_page_user.select_role')" :isError="errors[0]"/>
|
||||
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
|
||||
</ValidationProvider>
|
||||
</div>
|
||||
|
||||
<!--User Role-->
|
||||
<div class="block-wrapper">
|
||||
<label>{{ $t('admin_page_user.select_role') }}:</label>
|
||||
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="permission" rules="required" v-slot="{ errors }">
|
||||
<SelectInput v-model="user.role" :options="$translateSelectOptions(roles)" :placeholder="$t('admin_page_user.select_role')" :isError="errors[0]"/>
|
||||
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
|
||||
</ValidationProvider>
|
||||
</div>
|
||||
<!--Storage Capacity-->
|
||||
<div class="block-wrapper">
|
||||
<label>{{ $t('admin_page_user.label_change_capacity') }}</label>
|
||||
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="storage capacity" rules="required" v-slot="{ errors }">
|
||||
<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]}"/>
|
||||
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
|
||||
</ValidationProvider>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--Storage Capacity-->
|
||||
<div class="block-wrapper">
|
||||
<label>{{ $t('admin_page_user.label_change_capacity') }}</label>
|
||||
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="storage capacity" rules="required" v-slot="{ errors }">
|
||||
<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" :class="{'is-error': errors[0]}"/>
|
||||
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
|
||||
</ValidationProvider>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<ButtonBase :disabled="isLoading" :loading="isLoading" button-style="theme" type="submit">
|
||||
{{ $t('admin_page_user.create_user.submit') }}
|
||||
</ButtonBase>
|
||||
</div>
|
||||
</ValidationObserver>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<ButtonBase :disabled="isLoading" :loading="isLoading" button-style="theme" type="submit">
|
||||
{{ $t('admin_page_user.create_user.submit') }}
|
||||
</ButtonBase>
|
||||
</div>
|
||||
</ValidationObserver>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
Reference in New Issue
Block a user