Manager

Back Back Up Advanced Editor

<span></span>

<BaseButton :loading="isSaving" :disabled="isSaving" class="mt-6">
        <template #left="slotProps">
          <BaseIcon
            v-if="!isSaving"
            name="SaveIcon"
            :class="slotProps.class"
          ></BaseIcon>
        </template>
        {{ $t('settings.company_info.save') }}
      </BaseButton>
    </BaseSettingCard>
  </form>
</template>

const userStore = useUserStore()
const globalStore = useGlobalStore()
const companyStore = useCompanyStore()
const { t } = useI18n()

let isSaving = ref(false)
let avatarFileBlob = ref(null)
let imgFiles = ref([])
const isAdminAvatarRemoved = ref(false)

if (userStore.currentUser.avatar) {
  imgFiles.value.push({
    image: userStore.currentUser.avatar,
  })
}

const rules = computed(() => {
  return {
    name: {
      required: helpers.withMessage(t('validation.required'), required),
    },
    email: {
      required: helpers.withMessage(t('validation.required'), required),
      email: helpers.withMessage(t('validation.email_incorrect'), email),
    },
    password: {
      minLength: helpers.withMessage(
        t('validation.password_length', { count: 8 }),
        minLength(8)
      ),
    },
    confirm_password: {
      sameAsPassword: helpers.withMessage(
        t('validation.password_incorrect'),
        sameAs(userForm.password)
      ),
    },
  }
})

const userForm = reactive({
  name: userStore.currentUser.name,
  email: userStore.currentUser.email,
  language:
    userStore.currentUserSettings.language ||
    companyStore.selectedCompanySettings.language,
  password: '',
  confirm_password: '',
})

const v$ = useVuelidate(
  rules,
  computed(() => userForm)
)

function onFileInputChange(fileName, file) {
  avatarFileBlob.value = file
}

function onFileInputRemove() {
  avatarFileBlob.value = null
  isAdminAvatarRemoved.value = true
}

async function updateUserData() {
  v$.value.$touch()

if (v$.value.$invalid) {
    return true
  }

isSaving.value = true

let data = {
    name: userForm.name,
    email: userForm.email,
  }

try {
    if (
      userForm.password != null &&
      userForm.password !== undefined &&
      userForm.password !== ''
    ) {
      data = { ...data, password: userForm.password }
    }
    // Update Language if changed

if (userStore.currentUserSettings.language !== userForm.language) {
      await userStore.updateUserSettings({
        settings: {
          language: userForm.language,
        },
      })
    }

let response = await userStore.updateCurrentUser(data)

if (response.data.data) {
      isSaving.value = false

if (avatarFileBlob.value || isAdminAvatarRemoved.value) {
        let avatarData = new FormData()

if (avatarFileBlob.value) {
          avatarData.append('admin_avatar', avatarFileBlob.value)
        }
        avatarData.append('is_admin_avatar_removed', isAdminAvatarRemoved.value)

await userStore.uploadAvatar(avatarData)
        avatarFileBlob.value = null
        isAdminAvatarRemoved.value = false
      }

userForm.password = ''
      userForm.confirm_password = ''
    }
  } catch (error) {
    isSaving.value = false
    return true
  }
}
</script>