mirror of
https://github.com/VueFileManager/vuefilemanager.git
synced 2026-04-28 02:50:39 +00:00
card navigation refactoring
This commit is contained in:
@@ -8,7 +8,7 @@
|
||||
</label>
|
||||
|
||||
<!--Input Description-->
|
||||
<span v-if="description" class="text-xs text-gray-500 leading-3 -mt-0.5 block" v-html="description"></span>
|
||||
<span v-if="description" class="text-xs text-gray-500 leading-4 block" v-html="description"></span>
|
||||
|
||||
<!--Input Description-->
|
||||
<span v-if="error" class="error-message">
|
||||
|
||||
@@ -10,7 +10,7 @@
|
||||
<slot></slot>
|
||||
|
||||
<!--Input Description-->
|
||||
<small v-if="description" class="text-xs text-gray-500 leading-normal -mt-0.5 block" v-html="description"></small>
|
||||
<small v-if="description" class="text-xs text-gray-500 leading-4 block" v-html="description"></small>
|
||||
|
||||
<!--Input Description-->
|
||||
<span v-if="error" class="text-red-700 pt-2 text-xs">
|
||||
|
||||
@@ -0,0 +1,28 @@
|
||||
<template>
|
||||
<div class="whitespace-nowrap overflow-x-auto">
|
||||
<router-link
|
||||
class="inline-block text-sm font-bold px-4 py-5 border-b-2 border-transparent border-bottom-theme"
|
||||
:class="{'text-theme': routeName === page.route, 'text-gray-600': routeName !== page.route}"
|
||||
v-for="(page, i) in pages"
|
||||
:to="{name: page.route}"
|
||||
:key="i"
|
||||
replace
|
||||
>
|
||||
{{ page.title }}
|
||||
</router-link>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'CardNavigation',
|
||||
props: [
|
||||
'pages'
|
||||
],
|
||||
computed: {
|
||||
routeName() {
|
||||
return this.$route.name
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
@@ -5,24 +5,23 @@
|
||||
|
||||
<PopupContent>
|
||||
<ValidationObserver v-if="! token" @submit.prevent="createTokenForm" ref="createToken" v-slot="{ invalid }" tag="form" class="form-wrapper">
|
||||
<ValidationProvider tag="div" mode="passive" class="input-wrapper password" name="Token Name" rules="required" v-slot="{ errors }">
|
||||
<label class="input-label"> {{ $t('popup_personal_token.label') }}:</label>
|
||||
<input v-model="name" :class="{'is-error': errors[0]}" type="text" ref="input" class="focus-border-theme" :placeholder="$t('popup_personal_token.plc')">
|
||||
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
|
||||
|
||||
<ValidationProvider tag="div" mode="passive" name="Token Name" rules="required" v-slot="{ errors }">
|
||||
<AppInputText :title="$t('popup_personal_token.label')" :error="errors[0]" :is-last="true">
|
||||
<input v-model="name" :class="{'is-error': errors[0]}" type="text" ref="input" class="focus-border-theme input-dark" :placeholder="$t('popup_personal_token.plc')">
|
||||
</AppInputText>
|
||||
</ValidationProvider>
|
||||
|
||||
</ValidationObserver>
|
||||
|
||||
<div v-if="token" class="form-wrapper">
|
||||
<div v-if="token">
|
||||
<div class="input-wrapper">
|
||||
<label class="input-label">{{ $t('popup_personal_token.your_token') }}:</label>
|
||||
<CopyInput size="small" :str="token['plainTextToken']" />
|
||||
</div>
|
||||
</div>
|
||||
<AppInputText v-if="token" :title="$t('popup_personal_token.your_token')" class="form-wrapper" :is-last="true">
|
||||
<CopyInput size="small" :str="token['plainTextToken']" />
|
||||
|
||||
<InfoBox style="margin-bottom: 0; margin-top: 20px">
|
||||
<p v-html="$t('popup_personal_token.copy_token')"></p>
|
||||
</InfoBox>
|
||||
</div>
|
||||
<p v-html="$t('popup_personal_token.copy_token')"></p>
|
||||
</InfoBox>
|
||||
</AppInputText>
|
||||
|
||||
</PopupContent>
|
||||
|
||||
<PopupActions v-if="! token">
|
||||
@@ -57,6 +56,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import AppInputText from "../Admin/AppInputText";
|
||||
import {ValidationProvider, ValidationObserver} from 'vee-validate/dist/vee-validate.full'
|
||||
import PopupWrapper from '/resources/js/components/Others/Popup/PopupWrapper'
|
||||
import PopupActions from '/resources/js/components/Others/Popup/PopupActions'
|
||||
@@ -74,6 +74,7 @@ export default {
|
||||
components: {
|
||||
ValidationProvider,
|
||||
ValidationObserver,
|
||||
AppInputText,
|
||||
PopupWrapper,
|
||||
PopupActions,
|
||||
PopupContent,
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="inline-wrapper icon-append copy-input" :class="size" @click="copyUrl">
|
||||
<input ref="sel" :value="str" id="link-input" type="text" class="input-text" readonly>
|
||||
<input ref="sel" :value="str" id="link-input" type="text" class="focus-border-theme input-dark" readonly>
|
||||
<div class="multi-icon">
|
||||
<div class="icon-item group hover-bg-theme-100">
|
||||
<copy-icon v-if="! isCopiedLink" size="14" class="group-hover-text-theme hover-text-theme"/>
|
||||
@@ -75,7 +75,7 @@ export default {
|
||||
}
|
||||
|
||||
.icon-item {
|
||||
padding: 9px 10px;
|
||||
padding: 13px 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-left: 1px solid $light_mode_border_darken;
|
||||
|
||||
@@ -5,11 +5,10 @@
|
||||
|
||||
<PopupContent>
|
||||
<ValidationObserver @submit.prevent="confirmPassword" v-if="! qrCode" ref="passwordForm" v-slot="{ invalid }" tag="form" class="form-wrapper">
|
||||
|
||||
<ValidationProvider tag="div" mode="passive" class="input-wrapper password" name="Password" rules="required" v-slot="{ errors }">
|
||||
<label class="input-label"> {{ $t('popup_2fa.input_label') }}:</label>
|
||||
<input v-model="password" :class="{'is-error': errors[0]}" type="password" ref="input" class="focus-border-theme" :placeholder="$t('page_sign_in.placeholder_password')">
|
||||
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
|
||||
<ValidationProvider tag="div" mode="passive" name="Password" rules="required" v-slot="{ errors }">
|
||||
<AppInputText :title="$t('popup_2fa.input_label')" :error="errors[0]" :is-last="true">
|
||||
<input v-model="password" :class="{'is-error': errors[0]}" type="password" ref="input" class="focus-border-theme input-dark" :placeholder="$t('page_sign_in.placeholder_password')">
|
||||
</AppInputText>
|
||||
</ValidationProvider>
|
||||
</ValidationObserver>
|
||||
|
||||
@@ -56,6 +55,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import AppInputText from "../Admin/AppInputText";
|
||||
import {ValidationProvider, ValidationObserver} from 'vee-validate/dist/vee-validate.full'
|
||||
import PopupWrapper from '/resources/js/components/Others/Popup/PopupWrapper'
|
||||
import PopupActions from '/resources/js/components/Others/Popup/PopupActions'
|
||||
@@ -73,6 +73,7 @@ export default {
|
||||
components: {
|
||||
ValidationProvider,
|
||||
ValidationObserver,
|
||||
AppInputText,
|
||||
PopupWrapper,
|
||||
PopupActions,
|
||||
PopupContent,
|
||||
|
||||
Reference in New Issue
Block a user