@tager/admin-blog 0.3.21 → 0.3.25

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tager/admin-blog",
-  "version": "0.3.21",
+  "version": "0.3.25",
   "license": "MIT",
   "main": "dist/index.umd.js",
   "module": "dist/index.esm.js",
@@ -19,15 +19,20 @@
     "yalc:clean": "yalc remove --all"
   },
   "dependencies": {
-    "path-to-regexp": "^6.1.0"
+    "lodash.isequal": "^4.5.0",
+    "lodash.pick": "^4.4.0",
+    "path-to-regexp": "^6.1.0",
+    "vuex": "^3.6.2"
   },
   "devDependencies": {
     "@rollup/plugin-commonjs": "^15.0.0",
     "@rollup/plugin-node-resolve": "^9.0.0",
-    "@tager/admin-dynamic-field": "^0.1.14",
-    "@tager/admin-layout": "^0.4.13",
-    "@tager/admin-services": "^0.2.24",
-    "@tager/admin-ui": "^0.8.49",
+    "@tager/admin-dynamic-field": "^0.1.18",
+    "@tager/admin-layout": "^0.5.3",
+    "@tager/admin-services": "^0.2.26",
+    "@tager/admin-ui": "^0.8.85",
+    "@types/lodash.isequal": "^4.5.5",
+    "@types/lodash.pick": "^4.4.6",
     "@types/node": "12.x",
     "@typescript-eslint/eslint-plugin": "^2.26.0",
     "@typescript-eslint/parser": "^2.26.0",
@@ -35,6 +40,7 @@
     "@vue/cli-plugin-eslint": "~4.5.6",
     "@vue/cli-plugin-router": "~4.5.6",
     "@vue/cli-plugin-typescript": "~4.5.6",
+    "@vue/cli-plugin-vuex": "^4.5.14",
     "@vue/cli-service": "~4.5.6",
     "@vue/composition-api": "^1.0.0-beta.14",
     "@vue/eslint-config-prettier": "^6.0.0",
@@ -50,7 +56,7 @@
     "rollup-plugin-typescript2": "^0.27.2",
     "rollup-plugin-vue": "^5.1.9",
     "sass-loader": "^10.0.2",
-    "typescript": "~3.9.6",
+    "typescript": "~3.9.10",
     "vue": "2.6.x",
     "vue-router": "^3.5.1",
     "vue-template-compiler": "^2.6.11"

package/src/constants/menu.ts

@@ -6,7 +6,6 @@ import {
   getBlogCategoryListUrl,
   getBlogPostFormUrl,
   getBlogPostListUrl,
-  getBlogSettingsUrl,
 } from './paths';
 
 export function getBlogMenuItem(params: {
@@ -27,7 +26,6 @@ export function getBlogMenuItem(params: {
         url: getBlogCategoryFormUrl({ categoryId: 'create' }),
       },
       { text: params.t('blog:categories'), url: getBlogCategoryListUrl() },
-      { text: params.t('blog:settings'), url: getBlogSettingsUrl() },
     ],
   };
 }

package/src/constants/paths.ts

@@ -5,7 +5,6 @@ export const BLOG_ROUTE_PATHS = {
   POST_FORM: '/blog/posts/:postId',
   CATEGORY_LIST: '/blog/categories',
   CATEGORY_FORM: '/blog/categories/:categoryId',
-  SETTINGS: '/blog/settings',
 } as const;
 
 export function getBlogPostListUrl() {
@@ -27,7 +26,3 @@ export function getBlogCategoryFormUrl(params: {
     categoryId: params.categoryId,
   });
 }
-
-export function getBlogSettingsUrl() {
-  return BLOG_ROUTE_PATHS.SETTINGS;
-}

package/src/constants/routes.ts

@@ -1,12 +1,11 @@
 import { CustomRoute, CustomRouteConfig } from '@tager/admin-layout';
 
-import BlogPostList from '../views/BlogPostList';
-import BlogPostForm from '../views/BlogPostForm';
-import BlogCategoryList from '../views/BlogCategoryList';
-import BlogCategoryForm from '../views/BlogCategoryForm';
-import BlogSettings from '../views/BlogSettings';
+import BlogPostList from '../views/Posts/PostList';
+import BlogPostForm from '../views/Posts/PostForm';
+import BlogCategoryList from '../views/Categories/CategoryList';
+import BlogCategoryForm from '../views/Categories/CategoryForm';
 
-import { BLOG_ROUTE_PATHS, getBlogSettingsUrl } from './paths';
+import { BLOG_ROUTE_PATHS } from './paths';
 
 export const BLOG_POST_LIST_ROUTE: CustomRouteConfig = {
   path: BLOG_ROUTE_PATHS.POST_LIST,
@@ -57,15 +56,3 @@ export const BLOG_CATEGORY_FORM_ROUTE: CustomRouteConfig = {
     ],
   },
 };
-
-export const BLOG_SETTINGS_ROUTE: CustomRouteConfig = {
-  path: BLOG_ROUTE_PATHS.SETTINGS,
-  component: BlogSettings,
-  name: 'Settings',
-  meta: {
-    getBreadcrumbs: (route, t) => [
-      { url: '/', text: t('blog:home') },
-      { url: getBlogSettingsUrl(), text: t('blog:blogSettings') },
-    ],
-  },
-};

package/src/constants/scopes.ts

@@ -0,0 +1,11 @@
+export const Scope = {
+  All: '*',
+  OrdersCreate: 'orders.create',
+  OrdersView: 'orders.view',
+  OrdersDelete: 'orders.delete',
+  RbacViewRoles: 'rbac.view-roles',
+  RbacEditRoles: 'rbac.edit-roles',
+  AdministratorsView: 'administrators.view',
+  AdministratorsEdit: 'administrators.edit',
+  AdministratorsDelete: 'administrators.delete',
+} as const;

package/src/dev.ts

@@ -1,69 +1,36 @@
 import Vue, { CreateElement } from 'vue';
 import VueCompositionApi, { createApp } from '@vue/composition-api';
+import Vuex from 'vuex';
 
 import { configStore, i18n } from '@tager/admin-services';
 import { AdminUiPlugin } from '@tager/admin-ui';
-import {
-  AdminLayoutPlugin,
-  createRouter,
-  CustomRoute,
-  CustomRouteConfig,
-} from '@tager/admin-layout';
+import { AdminLayoutPlugin } from '@tager/admin-layout';
 
 import '@tager/admin-ui/dist/admin-ui.css';
 
-import {
-  BLOG_CATEGORY_FORM_ROUTE,
-  BLOG_CATEGORY_LIST_ROUTE,
-  BLOG_POST_FORM_ROUTE,
-  BLOG_POST_LIST_ROUTE,
-  BLOG_SETTINGS_ROUTE,
-} from './constants/routes';
-import config from './config/config.json';
-import App from './views/App.vue';
-import Home from './views/Home.vue';
-import EN from './locales/en';
-import RU from './locales/ru';
+import config from '@/config/config.json';
+import App from '@/views/App.vue';
+import EN from '@/locales/en';
+import RU from '@/locales/ru';
+import router from '@/router';
+import store from '@/store';
 
 configStore.setConfig(config);
 
-export const HOME_ROUTE: CustomRouteConfig = {
-  path: '/',
-  component: Home,
-  name: 'Home',
-  meta: {
-    getBreadcrumbs: (route: CustomRoute) => [
-      { url: '/', text: route.name ?? '' },
-    ],
-  },
-};
-
-const router = createRouter(
-  {
-    routes: [
-      HOME_ROUTE,
-      BLOG_POST_LIST_ROUTE,
-      BLOG_POST_FORM_ROUTE,
-      BLOG_CATEGORY_LIST_ROUTE,
-      BLOG_CATEGORY_FORM_ROUTE,
-      BLOG_SETTINGS_ROUTE,
-    ],
-  },
-  { useTitleSync: false }
-);
+Vue.use(VueCompositionApi);
 
 i18n.addTranslations('en', 'blog', EN);
 i18n.addTranslations('ru', 'blog', RU);
 
 i18n.init({ debug: false }).then(() => {
-  Vue.use(VueCompositionApi);
-
   const app = createApp({
     router,
     render: (h: CreateElement) => h(App),
+    store,
   });
 
   app.use(i18n.getPlugin());
+  app.use(Vuex);
   app.use(AdminUiPlugin);
   app.use(AdminLayoutPlugin);
 

package/src/hooks/index.ts

@@ -0,0 +1,6 @@
+export { useModuleConfig } from './useModuleConfig';
+export { useBlogPostList } from './useBlogPostList';
+export { useBlogCategoryList } from './useBlogCategoryList';
+export { useStore } from './useStore';
+export { useUserProfile } from './useUserProfile';
+export { useUserPermission } from './useUserPermission';

package/src/hooks/useBlogCategoryList.ts

@@ -2,13 +2,13 @@ import { onMounted, SetupContext } from '@vue/composition-api';
 
 import { ResourceRef, useResource } from '@tager/admin-services';
 
-import { BlogCategory } from '../typings/model';
+import { Category } from '../typings/model';
 import { getBlogCategoryList } from '../services/requests';
 
 export function useBlogCategoryList(params: {
   context: SetupContext;
-}): ResourceRef<Array<BlogCategory>> {
-  const [fetchBlogCategoryList, resource] = useResource<Array<BlogCategory>>({
+}): ResourceRef<Category[]> {
+  const [fetchBlogCategoryList, resource] = useResource<Category[]>({
     fetchResource: getBlogCategoryList,
     initialValue: [],
     context: params.context,
@@ -21,5 +21,3 @@ export function useBlogCategoryList(params: {
 
   return resource;
 }
-
-export default useBlogCategoryList;

package/src/hooks/useBlogPostList.ts

@@ -7,8 +7,8 @@ import { getBlogPostList } from '../services/requests';
 
 export function useBlogPostList(params: {
   context: SetupContext;
-}): ResourceRef<Array<PostShort>> {
-  const [fetchBlogPostList, resource] = useResource<Array<PostShort>>({
+}): ResourceRef<PostShort[]> {
+  const [fetchBlogPostList, resource] = useResource<PostShort[]>({
     fetchResource: () => getBlogPostList({ pageNumber: 1, pageSize: 99999 }),
     initialValue: [],
     context: params.context,
@@ -21,5 +21,3 @@ export function useBlogPostList(params: {
 
   return resource;
 }
-
-export default useBlogPostList;

package/src/hooks/useModuleConfig.ts

@@ -2,15 +2,13 @@ import { onMounted, SetupContext } from '@vue/composition-api';
 
 import { Nullable, ResourceRef, useResource } from '@tager/admin-services';
 
-import { BlogModuleConfigType } from '../typings/model';
-import { getBlogModuleConfig } from '../services/requests';
+import { ModuleConfig } from '@/typings/model';
+import { getBlogModuleConfig } from '@/services/requests';
 
 export function useModuleConfig(params: {
   context: SetupContext;
-}): ResourceRef<Nullable<BlogModuleConfigType>> {
-  const [fetchModuleConfig, resource] = useResource<
-    Nullable<BlogModuleConfigType>
-  >({
+}): ResourceRef<Nullable<ModuleConfig>> {
+  const [fetchModuleConfig, resource] = useResource<Nullable<ModuleConfig>>({
     fetchResource: getBlogModuleConfig,
     initialValue: null,
     context: params.context,
@@ -23,5 +21,3 @@ export function useModuleConfig(params: {
 
   return resource;
 }
-
-export default useModuleConfig;

package/src/hooks/useStore.ts

@@ -0,0 +1,8 @@
+import { Store } from 'vuex';
+import { SetupContext } from '@vue/composition-api';
+
+import { RootState } from '@/store';
+
+export function useStore(context: SetupContext): Store<RootState> {
+  return context.root.$store;
+}

package/src/hooks/useUserPermission.ts

@@ -0,0 +1,16 @@
+import { computed, ComputedRef, SetupContext } from '@vue/composition-api';
+
+import { ScopeType } from '@/typings/model';
+import { useStore } from '@/hooks/useStore';
+import { userNamespace } from '@/utils/common';
+
+export function useUserPermission(
+  context: SetupContext,
+  scope: ScopeType
+): ComputedRef<boolean> {
+  const store = useStore(context);
+
+  return computed<boolean>(() => {
+    return store.getters[userNamespace('userHasPermission')](scope);
+  });
+}

package/src/hooks/useUserProfile.ts

@@ -0,0 +1,13 @@
+import { computed, ComputedRef, SetupContext } from '@vue/composition-api';
+
+import { UserModel } from '@/typings/model';
+import { useStore } from '@/hooks/useStore';
+import { userNamespace } from '@/utils/common';
+
+export function useUserProfile(context: SetupContext): ComputedRef<UserModel> {
+  const store = useStore(context);
+
+  return computed<UserModel>(() => {
+    return store.getters[userNamespace('userProfile')];
+  });
+}

package/src/locales/en.ts

@@ -6,18 +6,13 @@ const EN = {
   categories: 'Categories',
   createPost: 'Create post',
   createCategory: 'Create category',
-  settings: 'Settings',
   home: 'Home',
   allPosts: 'All posts',
   postForm: 'Post Form',
   allCategories: 'All categories',
   categoryForm: 'Category Form',
-  blogSettings: 'Blog settings',
   success: 'Success',
-  blogSettingsHaveBeenSuccessfullyUpdated:
-    'Blog settings have been successfully updated',
   error: 'Error',
-  blogSettingsUpdateHasBeenFailed: 'Blog settings update has been failed',
   newPost: 'New Post',
   edit: 'Edit',
   remove: 'Remove',
@@ -25,7 +20,14 @@ const EN = {
   name: 'Name',
   image: 'Image',
   language: 'Language',
+  languages: 'Languages',
   date: 'Date',
+  dateOfPublication: 'Date of publication',
+  from: 'from',
+  to: 'to',
+  From: 'From',
+  To: 'To',
+  category: 'Category',
   actions: 'Actions',
   updatePost: 'Update post',
   title: 'Title',
@@ -60,6 +62,16 @@ const EN = {
   blogCategoryWasSuccessfullyUpdated: 'Blog category was successfully updated',
   blogCategoryCreationWasFailed: 'Blog category creation was failed',
   blogCategoryUpdateWasFailed: 'Blog category update was failed',
+
+  clone: 'Clone',
+  cloneConfirm: 'Are you sure you want to clone the page?',
+  cloneSuccess: 'Page have copied successfully',
+  cloneFailure: 'Page copy failure',
+
+  tabs: {
+    common: 'Common',
+    seo: 'SEO',
+  },
 };
 
 export default EN;

package/src/locales/ru.ts

@@ -8,17 +8,13 @@ const RU: typeof EN = {
   categories: 'Категории',
   createPost: 'Создать пост',
   createCategory: 'Создать категорию',
-  settings: 'Настройки',
   home: 'Главная',
   allPosts: 'Все посты',
   postForm: 'Форма поста',
   allCategories: 'Все категории',
   categoryForm: 'Форма категории',
-  blogSettings: 'Настройки блога',
   success: 'Успех',
-  blogSettingsHaveBeenSuccessfullyUpdated: 'Настройки блога успешно обновлены',
   error: 'Ошибка',
-  blogSettingsUpdateHasBeenFailed: 'Не удалось обновить настройки блога',
   newPost: 'Новый пост',
   edit: 'Редактировать',
   remove: 'Удалить',
@@ -26,7 +22,14 @@ const RU: typeof EN = {
   name: 'Имя',
   image: 'Изображение',
   language: 'Язык',
+  languages: 'Языки',
   date: 'Дата',
+  dateOfPublication: 'Дата публикации',
+  from: 'от',
+  to: 'до',
+  From: 'От',
+  To: 'До',
+  category: 'Категория',
   actions: 'Действия',
   updatePost: 'Обновить пост',
   title: 'Заголовок',
@@ -61,6 +64,16 @@ const RU: typeof EN = {
   blogCategoryWasSuccessfullyUpdated: 'Категория блога успешно обновлена',
   blogCategoryCreationWasFailed: 'Не удалось создать категорию блога',
   blogCategoryUpdateWasFailed: 'Не удалось обновить категорию блога',
+
+  clone: 'Клонировать',
+  cloneConfirm: 'Вы уверены, что хотите создать копию страницы?',
+  cloneSuccess: 'Копия страницы успешно создана',
+  cloneFailure: 'Ошибка копирования страницы',
+
+  tabs: {
+    common: 'Общие',
+    seo: 'SEO',
+  },
 };
 
 export default RU;

package/src/router/index.ts

@@ -0,0 +1,39 @@
+import {
+  createRouter,
+  CustomRoute,
+  CustomRouteConfig,
+} from '@tager/admin-layout';
+
+import {
+  BLOG_CATEGORY_FORM_ROUTE,
+  BLOG_CATEGORY_LIST_ROUTE,
+  BLOG_POST_FORM_ROUTE,
+  BLOG_POST_LIST_ROUTE,
+} from '@/constants/routes';
+import Home from '@/views/Home.vue';
+
+export const HOME_ROUTE: CustomRouteConfig = {
+  path: '/',
+  component: Home,
+  name: 'Home',
+  meta: {
+    getBreadcrumbs: (route: CustomRoute) => [
+      { url: '/', text: route.name ?? '' },
+    ],
+  },
+};
+
+const router = createRouter(
+  {
+    routes: [
+      HOME_ROUTE,
+      BLOG_POST_LIST_ROUTE,
+      BLOG_POST_FORM_ROUTE,
+      BLOG_CATEGORY_LIST_ROUTE,
+      BLOG_CATEGORY_FORM_ROUTE,
+    ],
+  },
+  { useTitleSync: false }
+);
+
+export default router;

package/src/services/requests.ts

@@ -2,12 +2,16 @@ import { request, Nullable, ResponseBody } from '@tager/admin-services';
 import { FieldShortType, OutgoingValueUnion } from '@tager/admin-dynamic-field';
 
 import {
-  BlogCategory,
-  BlogModuleConfigType,
+  Category,
+  ModuleConfig,
   PostShort,
   PostFull,
-  SettingItemType,
-} from '../typings/model';
+  UserModel,
+} from '@/typings/model';
+
+export function getUserProfile(): Promise<ResponseBody<UserModel>> {
+  return request.get({ path: '/admin/self' });
+}
 
 /** Blog Posts */
 
@@ -15,7 +19,7 @@ export function getBlogPostList(params?: {
   query?: string;
   pageNumber?: number;
   pageSize?: number;
-}): Promise<ResponseBody<Array<PostShort>>> {
+}): Promise<ResponseBody<PostShort[]>> {
   return request.get({ path: '/admin/blog/posts', params });
 }
 
@@ -29,7 +33,13 @@ export function getBlogPost(
   return request.get({ path: `/admin/blog/posts/${postId}` });
 }
 
-export type PostCreationPayload = {
+export function clonePost(
+  postId: number | string
+): Promise<ResponseBody<PostFull>> {
+  return request.post({ path: `/admin/blog/posts/${postId}/clone` });
+}
+
+export interface PostCreationPayload {
   title: string;
   urlAlias: string;
   excerpt: string;
@@ -42,12 +52,12 @@ export type PostCreationPayload = {
   pageTitle: string;
   pageDescription: string;
   openGraphImage: Nullable<string>;
-  categories: Array<number>;
+  categories: number[];
   language: Nullable<string>;
-  relatedPosts: Array<number>;
-  tags: Array<string>;
-  additionalFields: Array<FieldShortType<OutgoingValueUnion>>;
-};
+  relatedPosts: number[];
+  tags: string[];
+  additionalFields: FieldShortType<OutgoingValueUnion>[];
+}
 
 export function createBlogPost(
   payload: PostCreationPayload
@@ -74,30 +84,32 @@ export function deleteBlogPost(
 
 /** Blog Categories */
 
-export function getBlogCategoryList(): Promise<
-  ResponseBody<Array<BlogCategory>>
-> {
-  return request.get({ path: '/admin/blog/categories' });
+export function getBlogCategoryList(params?: {
+  query?: string;
+  pageNumber?: number;
+  pageSize?: number;
+}): Promise<ResponseBody<Category[]>> {
+  return request.get({ path: '/admin/blog/categories', params });
 }
 
 export function getBlogCategory(
   categoryId: number | string
-): Promise<ResponseBody<BlogCategory>> {
+): Promise<ResponseBody<Category>> {
   return request.get({ path: `/admin/blog/categories/${categoryId}` });
 }
 
-export type BlogCategoryCreationPayload = {
+export interface BlogCategoryCreationPayload {
   name: string;
   isDefault: boolean;
   pageTitle: Nullable<string>;
   language: Nullable<string>;
   pageDescription: Nullable<string>;
   openGraphImage: Nullable<string>;
-};
+}
 
 export function createBlogCategory(
   payload: BlogCategoryCreationPayload
-): Promise<ResponseBody<BlogCategory>> {
+): Promise<ResponseBody<Category>> {
   return request.post({ path: '/admin/blog/categories', body: payload });
 }
 
@@ -108,7 +120,7 @@ export type BlogCategoryUpdatePayload = BlogCategoryCreationPayload & {
 export function updateBlogCategory(
   categoryId: number | string,
   payload: BlogCategoryUpdatePayload
-): Promise<ResponseBody<BlogCategory>> {
+): Promise<ResponseBody<Category>> {
   return request.put({
     path: `/admin/blog/categories/${categoryId}`,
     body: payload,
@@ -132,30 +144,8 @@ export function moveBlogCategory(
   });
 }
 
-export function getBlogModuleConfig(): Promise<
-  ResponseBody<BlogModuleConfigType>
-> {
+export function getBlogModuleConfig(): Promise<ResponseBody<ModuleConfig>> {
   return request.get({
     path: `/admin/blog/module-info`,
   });
 }
-
-export function getBlogSettingList(): Promise<
-  ResponseBody<Array<SettingItemType>>
-> {
-  return request.get({
-    path: `/admin/blog/settings`,
-  });
-}
-
-export type SettingsUpdatePayload = {
-  values: Array<FieldShortType<OutgoingValueUnion>>;
-};
-export function updateBlogSettingList(
-  payload: SettingsUpdatePayload
-): Promise<ResponseBody<Array<SettingItemType>>> {
-  return request.post({
-    path: `/admin/blog/settings`,
-    body: payload,
-  });
-}

package/src/store/index.ts

@@ -0,0 +1,21 @@
+import Vue from 'vue';
+import Vuex from 'vuex';
+
+import userModule, {
+  USER_MODULE_NAMESPACE,
+  UserModuleStateModel,
+} from '@/store/user';
+
+Vue.use(Vuex);
+
+export interface RootState {
+  user: UserModuleStateModel;
+}
+
+const store = new Vuex.Store({
+  modules: {
+    [USER_MODULE_NAMESPACE]: userModule,
+  },
+});
+
+export default store;