TheCloneArmy/crater
1
0
Fork 1
mirror of https://github.com/crater-invoice/crater.git synced 2025-10-28 12:11:08 -04:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'fix-minor-issues' into 'master'

Browse Source 
Fix minor issues

See merge request mohit.panjvani/crater-web!1469
This commit is contained in:
Mohit Panjwani
2022-03-21 06:45:14 +00:00
parent d130e20c92 ef35293f8a
commit a9e54981bf
12 changed files with 250 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
resources/scripts/admin/components/modal-components/CompanyModal.vue
View File

@ -48,6 +48,24 @@
/>
</BaseInputGroup>
<BaseInputGroup
:label="$tc('settings.company_info.company_slug')"
:help-text="$t('settings.company_info.company_slug_help_text')"
:error="
v$.newCompanyForm.slug.$error &&
v$.newCompanyForm.slug.$errors[0].$message
"
:content-loading="isFetchingInitialData"
required
>
<BaseInput
v-model="newCompanyForm.slug"
:invalid="v$.newCompanyForm.slug.$error"
:content-loading="isFetchingInitialData"
@input="v$.newCompanyForm.slug.$touch()"
/>
</BaseInputGroup>
<BaseInputGroup
:content-loading="isFetchingInitialData"
:label="$tc('settings.company_info.country')"
@ -130,7 +148,7 @@
<script setup>
import { useModalStore } from '@/scripts/stores/modal'
import { computed, onMounted, ref, reactive } from 'vue'
import { computed, onMounted, ref, reactive, watch } from 'vue'
import { useI18n } from 'vue-i18n'
import { required, minLength, helpers } from '@vuelidate/validators'
import { useVuelidate } from '@vuelidate/core'
@ -152,6 +170,7 @@ let companyLogoName = ref(null)
const newCompanyForm = reactive({
name: null,
slug: null,
currency: '',
address: {
country_id: null,
@ -162,6 +181,9 @@ const modalActive = computed(() => {
return modalStore.active && modalStore.componentName === 'CompanyModal'
})
const slugValidator = (value) => {
return value == slugify(value)
}
const rules = {
newCompanyForm: {
name: {
@ -171,6 +193,17 @@ const rules = {
minLength(3)
),
},
slug: {
required: helpers.withMessage(t('validation.required'), required),
minLength: helpers.withMessage(
t('validation.name_min_length', { count: 3 }),
minLength(3)
),
slugValidator: helpers.withMessage(
t('validation.invalid_slug'),
slugValidator
),
},
address: {
country_id: {
required: helpers.withMessage(t('validation.required'), required),
@ -243,6 +276,7 @@ async function submitCompanyData() {
function resetNewCompanyForm() {
newCompanyForm.name = ''
newCompanyForm.slug = ''
newCompanyForm.currency = ''
newCompanyForm.address.country_id = ''
@ -257,4 +291,24 @@ function closeCompanyModal() {
v$.value.$reset()
}, 300)
}
// watcher for if change company name then auto fill company slug value
watch(
() => newCompanyForm.name,
(currentValue) => {
newCompanyForm.slug = slugify(currentValue)
}
)
function slugify(string) {
return string
.toString()
.trim()
.toLowerCase()
.replace(/\s+/g, '-')
.replace(/[^\w\-]+/g, '')
.replace(/\-\-+/g, '-')
.replace(/^-+/, '')
.replace(/-+$/, '')
}
</script>