mirrors/homebox
1
0
Fork 0
mirror of https://github.com/sysadminsmedia/homebox.git synced 2025-12-24 06:28:34 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat: add char counts

Browse Source
This commit is contained in:
tonya
2024-09-17 21:58:57 +00:00
parent 1b53a5235c
commit d159908b91
9 changed files with 135 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
frontend/components/Form/TextField.vue
View File

@@ -1,13 +1,31 @@
<template>
<div v-if="!inline" class="form-control w-full">
<label class="label">
<span class="label-text">{{ label }}</span>
<span class="label-text"> {{ label }} </span>
<span
:class="{
'text-red-600':
typeof value === 'string' &&
((maxLength && value.length > maxLength) || (minLength && value.length < minLength)),
}"
>
{{ typeof value === "string" && (maxLength || minLength) ? `${value.length}/${maxLength}` : "" }}
</span>
</label>
<input ref="input" v-model="value" :placeholder="placeholder" :type="type" class="input input-bordered w-full" />
</div>
<div v-else class="sm:grid sm:grid-cols-4 sm:items-start sm:gap-4">
<label class="label">
<span class="label-text">{{ label }}</span>
<span class="label-text"> {{ label }} </span>
<span
:class="{
'text-red-600':
typeof value === 'string' &&
((maxLength && value.length > maxLength) || (minLength && value.length < minLength)),
}"
>
{{ typeof value === "string" && (maxLength || minLength) ? `${value.length}/${maxLength}` : "" }}
</span>
</label>
<input v-model="value" :placeholder="placeholder" class="input input-bordered col-span-3 mt-2 w-full" />
</div>
@@ -39,6 +57,14 @@
type: String,
default: "",
},
maxLength: {
type: Number,
required: false,
},
minLength: {
type: Number,
required: false,
},
});
const input = ref<HTMLElement | null>(null);