- Install
aak-nuxt-base
as project dependency:
npm i aak-nuxt-base # npm
yarn add aak-nuxt-base # yarn
- Add it to the
extends
section of yournuxt.config
:
export default defineNuxtConfig({
extends: [['aak-nuxt-base', { install: true }]],
})
- Тебе только осталось настроить твой runtimeConfig согласно доке в пакете aak-nuxt-auth-fetch
- В App.vue добавляем
<template>
<NuxtLayout :name="'base'">
<template #logo>
<headerLogo />
</template>
<template #pages>
<NuxtPage />
</template>
</NuxtLayout>
</template>
- Если у тебя еще не прикручена авторизация то нужно добавить authDev в runtimeConfig
runtimeConfig: {
public: {
authDev: true,
},
},
- Заголовок приложения берется из runtimeConfig.public.aakNuxt.keycloakOptions.clientIdAlias
Должно получиться, что то типо этого:
brand: {
primary: '#47a150',
secondary: '#26A69A',
accent: '#9C27B0',
dark: '#1d1d1d',
'dark-page': '#121212',
positive: '#21BA45',
negative: '#C10015',
info: '#31CCEC',
warning: '#F2C037'
}
Далее копируешь это в свой nuxt.config.ts
quasar: {
config: {
brand: {
primary: '#47a150',
secondary: '#26A69A',
accent: '#9C27B0',
dark: '#1d1d1d',
'dark-page': '#121212',
positive: '#21BA45',
negative: '#C10015',
info: '#31CCEC',
warning: '#F2C037'
}
},
},
size: "12px",
color: "primary",
optionLabel: "name",
optionValue: "id",
clearable: false,
dense: true,
clearIcon: "clear",
disable: false,
useInput: false,
rules: undefined,
inputDebounce: 300,
Что бы твоя страница, корректно отображалась в меню, нужно настроить definePageMeta
/**
* title - Название страницы
* use - Используется в меню: boolean
* submenu - Является подменю:? boolean
* order - Порядок отображения:? number
* icon - Объект иконки:? {name: string; color?: string}
* accessScopes - Доступные роли:? string[]
*/
definePageMeta({
title: "Название страницы",
menu: {
submenu: false,
use: true,
order: 21,
icon: {
name: "rowing",
color: "blue",
},
},
accessScopes: ["user", "admin"],
});
На стрнице указываются роли в accessScopes, для которых просмотр разрешен. Роли сравниваются с данными из токена через предоставление информации в $userLMA().groups
Если нужно проверить без токена, перечисляем роли в baseDevAccessScopes:
runtimeConfig: {
public: {
baseDevAccessScopes : ['my-test-role'],
}
}
Слой предоставляет следующие функции через объект AAK
AAK.arr.findByField
AAK.arr.filterByField
AAK.arr.getIndexByField
AAK.arr.sortByField
AAK.obj.deepClone
AAK.obj.comparingFields
AAK.date.formatDateFromDjangoToDateTimeString
AAK.date.formatDateStringToDate
AAK.date.validateDateStringForFormat
AAK.notify.success
AAK.notify.info
AAK.notify.warning
AAK.notify.error
- Клонируй проект к себе для локальной разработки https://gitlab.lama.tomsk.ru/nuxtlayers/base.git
- Создаем свою ветку и все изменения производим в ней.
- В корневой папке выполни npm i
- Функции AAK описываются в файле baseUtils.ts в папке utils
- Базовые типы описываются в файле baseTypes.ts в папке utils
- Перднастройка компонентов Quasar в nuxt.config.ts в блоке quasar - components - defaults
- Добавь в доку описание того, что добавил.
- В package.json в блоке scripts есть команды:
-
publish-patch - Добавление версии 0.0.1 -> 0.0.2
Если было незначительное расширение функционала.
-
publish-minor - Добавление версии 0.1.0 -> 0.2.0
Если было значительное расширение функционала, без нарушения обратной совместимости.
-
publish-major - Добавление версии 1.0.0 -> 2.0.0
❗ Если было изменение функционала, с нарушения обратной совместимости.
-
publish-patch - Добавление версии 0.0.1 -> 0.0.2
Если было незначительное расширение функционала.