[tag]0.1-vcci

orval.config.ts

@@ -128,6 +128,7 @@ const orvalConfig = async () => {
           // Cập nhật khi backend thêm/xóa tag. Bỏ hết filter nếu muốn generate toàn bộ.
           tags: [
             'Authentication',
+            'Advertisement',
             'Banner',
             'Business',
             'Category',
@@ -138,6 +139,7 @@ const orvalConfig = async () => {
             'Member',
             'NewsletterSubscription',
             'PageConfig',
+            'PasswordResetRequest',
             'Permission',
             'Position',
             'Post',

src/api/endpoints/authentication.ts

@@ -37,6 +37,7 @@ import type {
   GetApiV10AuthMe200,
   GetApiV10AuthProfile200,
   LoginRequest,
+  PostApiV10AuthForgotPasswordRequestBody,
   PostApiV10AuthForgotPasswordVerifyOtp200,
   PostApiV10AuthLogin200,
   PostApiV10AuthLogin423,
@@ -1163,4 +1164,103 @@ export const usePostApiV10AuthForgotPasswordReset = <TError = ErrorType<BadReque
 
       return useMutation(mutationOptions, queryClient);
     }
+    /**
+ * User quên mật khẩu gửi yêu cầu reset về admin.
+Admin sẽ xem và xử lý (reset password) thay vì gửi OTP qua email.
+Anti-enumeration: luôn trả 200 kể cả khi email không tồn tại.
+
+ * @summary Forgot password - submit reset request to admin
+ */
+export type postApiV10AuthForgotPasswordRequestResponse200 = {
+  data: void
+  status: 200
+}
+
+export type postApiV10AuthForgotPasswordRequestResponse400 = {
+  data: void
+  status: 400
+}
+
+export type postApiV10AuthForgotPasswordRequestResponse429 = {
+  data: void
+  status: 429
+}
+    
+export type postApiV10AuthForgotPasswordRequestResponseSuccess = (postApiV10AuthForgotPasswordRequestResponse200) & {
+  headers: Headers;
+};
+export type postApiV10AuthForgotPasswordRequestResponseError = (postApiV10AuthForgotPasswordRequestResponse400 | postApiV10AuthForgotPasswordRequestResponse429) & {
+  headers: Headers;
+};
+
+export type postApiV10AuthForgotPasswordRequestResponse = (postApiV10AuthForgotPasswordRequestResponseSuccess | postApiV10AuthForgotPasswordRequestResponseError)
+
+export const getPostApiV10AuthForgotPasswordRequestUrl = () => {
+
+
+  
+
+  return `/api/v1.0/auth/forgot-password/request`
+}
+
+export const postApiV10AuthForgotPasswordRequest = async (postApiV10AuthForgotPasswordRequestBody: PostApiV10AuthForgotPasswordRequestBody, options?: RequestInit): Promise<postApiV10AuthForgotPasswordRequestResponse> => {
+  
+  return useCustomClient<postApiV10AuthForgotPasswordRequestResponse>(getPostApiV10AuthForgotPasswordRequestUrl(),
+  {      
+    ...options,
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json', ...options?.headers },
+    body: JSON.stringify(
+      postApiV10AuthForgotPasswordRequestBody,)
+  }
+);}
+
+
+
+
+export const getPostApiV10AuthForgotPasswordRequestMutationOptions = <TError = ErrorType<void>,
+    TContext = unknown>(options?: { mutation?:UseMutationOptions<Awaited<ReturnType<typeof postApiV10AuthForgotPasswordRequest>>, TError,{data: BodyType<PostApiV10AuthForgotPasswordRequestBody>}, TContext>, request?: SecondParameter<typeof useCustomClient>}
+): UseMutationOptions<Awaited<ReturnType<typeof postApiV10AuthForgotPasswordRequest>>, TError,{data: BodyType<PostApiV10AuthForgotPasswordRequestBody>}, TContext> => {
+
+const mutationKey = ['postApiV10AuthForgotPasswordRequest'];
+const {mutation: mutationOptions, request: requestOptions} = options ?
+      options.mutation && 'mutationKey' in options.mutation && options.mutation.mutationKey ?
+      options
+      : {...options, mutation: {...options.mutation, mutationKey}}
+      : {mutation: { mutationKey, }, request: undefined};
+
+      
+
+
+      const mutationFn: MutationFunction<Awaited<ReturnType<typeof postApiV10AuthForgotPasswordRequest>>, {data: BodyType<PostApiV10AuthForgotPasswordRequestBody>}> = (props) => {
+          const {data} = props ?? {};
+
+          return  postApiV10AuthForgotPasswordRequest(data,requestOptions)
+        }
+
+        
+
+
+  return  { mutationFn, ...mutationOptions }}
+
+    export type PostApiV10AuthForgotPasswordRequestMutationResult = NonNullable<Awaited<ReturnType<typeof postApiV10AuthForgotPasswordRequest>>>
+    export type PostApiV10AuthForgotPasswordRequestMutationBody = BodyType<PostApiV10AuthForgotPasswordRequestBody>
+    export type PostApiV10AuthForgotPasswordRequestMutationError = ErrorType<void>
+
+    /**
+ * @summary Forgot password - submit reset request to admin
+ */
+export const usePostApiV10AuthForgotPasswordRequest = <TError = ErrorType<void>,
+    TContext = unknown>(options?: { mutation?:UseMutationOptions<Awaited<ReturnType<typeof postApiV10AuthForgotPasswordRequest>>, TError,{data: BodyType<PostApiV10AuthForgotPasswordRequestBody>}, TContext>, request?: SecondParameter<typeof useCustomClient>}
+ , queryClient?: QueryClient): UseMutationResult<
+        Awaited<ReturnType<typeof postApiV10AuthForgotPasswordRequest>>,
+        TError,
+        {data: BodyType<PostApiV10AuthForgotPasswordRequestBody>},
+        TContext
+      > => {
+
+      const mutationOptions = getPostApiV10AuthForgotPasswordRequestMutationOptions(options);
+
+      return useMutation(mutationOptions, queryClient);
+    }
     
\ No newline at end of file

src/api/endpoints/permission.ts

@@ -374,7 +374,90 @@ export const usePutApiV10PermissionId = <TError = ErrorType<void>,
       return useMutation(mutationOptions, queryClient);
     }
     /**
- * Retrieve a list of permissions with pagination, filtering and sorting
+ * Sync permissions từ file config vào database. Chỉ system_admin mới có quyền.
+ * @summary Sync permissions from config
+ */
+export type postApiV10PermissionSyncResponse200 = {
+  data: void
+  status: 200
+}
+    
+export type postApiV10PermissionSyncResponseSuccess = (postApiV10PermissionSyncResponse200) & {
+  headers: Headers;
+};
+;
+
+export type postApiV10PermissionSyncResponse = (postApiV10PermissionSyncResponseSuccess)
+
+export const getPostApiV10PermissionSyncUrl = () => {
+
+
+  
+
+  return `/api/v1.0/permission/sync`
+}
+
+export const postApiV10PermissionSync = async ( options?: RequestInit): Promise<postApiV10PermissionSyncResponse> => {
+  
+  return useCustomClient<postApiV10PermissionSyncResponse>(getPostApiV10PermissionSyncUrl(),
+  {      
+    ...options,
+    method: 'POST'
+    
+    
+  }
+);}
+
+
+
+
+export const getPostApiV10PermissionSyncMutationOptions = <TError = ErrorType<unknown>,
+    TContext = unknown>(options?: { mutation?:UseMutationOptions<Awaited<ReturnType<typeof postApiV10PermissionSync>>, TError,void, TContext>, request?: SecondParameter<typeof useCustomClient>}
+): UseMutationOptions<Awaited<ReturnType<typeof postApiV10PermissionSync>>, TError,void, TContext> => {
+
+const mutationKey = ['postApiV10PermissionSync'];
+const {mutation: mutationOptions, request: requestOptions} = options ?
+      options.mutation && 'mutationKey' in options.mutation && options.mutation.mutationKey ?
+      options
+      : {...options, mutation: {...options.mutation, mutationKey}}
+      : {mutation: { mutationKey, }, request: undefined};
+
+      
+
+
+      const mutationFn: MutationFunction<Awaited<ReturnType<typeof postApiV10PermissionSync>>, void> = () => {
+          
+
+          return  postApiV10PermissionSync(requestOptions)
+        }
+
+        
+
+
+  return  { mutationFn, ...mutationOptions }}
+
+    export type PostApiV10PermissionSyncMutationResult = NonNullable<Awaited<ReturnType<typeof postApiV10PermissionSync>>>
+    
+    export type PostApiV10PermissionSyncMutationError = ErrorType<unknown>
+
+    /**
+ * @summary Sync permissions from config
+ */
+export const usePostApiV10PermissionSync = <TError = ErrorType<unknown>,
+    TContext = unknown>(options?: { mutation?:UseMutationOptions<Awaited<ReturnType<typeof postApiV10PermissionSync>>, TError,void, TContext>, request?: SecondParameter<typeof useCustomClient>}
+ , queryClient?: QueryClient): UseMutationResult<
+        Awaited<ReturnType<typeof postApiV10PermissionSync>>,
+        TError,
+        void,
+        TContext
+      > => {
+
+      const mutationOptions = getPostApiV10PermissionSyncMutationOptions(options);
+
+      return useMutation(mutationOptions, queryClient);
+    }
+    /**
+ * Retrieve a list of permissions with pagination, filtering and sorting. Also returns structured permissions grouped by resource.
  * @summary Get all permissions
  */
 export type getApiV10PermissionResponse200 = {

src/api/models/advertisement.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+import type { AdvertisementFile } from './advertisementFile';
+import type { AdvertisementType } from './advertisementType';
+import type { AdvertisementStatus } from './advertisementStatus';
+
+export interface Advertisement {
+  id: string;
+  /** @maxLength 255 */
+  name: string;
+  file_id: string;
+  /** @nullable */
+  file?: AdvertisementFile;
+  /**
+   * @maxLength 255
+   * @nullable
+   */
+  alt?: string | null;
+  /** @maxLength 500 */
+  link: string;
+  type: AdvertisementType;
+  status: AdvertisementStatus;
+  sort_order: number;
+  /** @nullable */
+  created_at?: string | null;
+  /** @nullable */
+  created_by?: string | null;
+  /** @nullable */
+  updated_at?: string | null;
+  /** @nullable */
+  updated_by?: string | null;
+}

src/api/models/advertisementCreate.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+import type { AdvertisementCreateType } from './advertisementCreateType';
+import type { AdvertisementCreateStatus } from './advertisementCreateStatus';
+
+export interface AdvertisementCreate {
+  /** @maxLength 255 */
+  name: string;
+  file_id: string;
+  /**
+   * @maxLength 255
+   * @nullable
+   */
+  alt?: string | null;
+  /** @maxLength 500 */
+  link: string;
+  type?: AdvertisementCreateType;
+  status?: AdvertisementCreateStatus;
+  sort_order?: number;
+}

src/api/models/advertisementCreateStatus.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+
+export type AdvertisementCreateStatus = typeof AdvertisementCreateStatus[keyof typeof AdvertisementCreateStatus];
+
+
+// eslint-disable-next-line @typescript-eslint/no-redeclare
+export const AdvertisementCreateStatus = {
+  ACTIVE: 'ACTIVE',
+  INACTIVE: 'INACTIVE',
+} as const;

src/api/models/advertisementCreateType.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+
+export type AdvertisementCreateType = typeof AdvertisementCreateType[keyof typeof AdvertisementCreateType];
+
+
+// eslint-disable-next-line @typescript-eslint/no-redeclare
+export const AdvertisementCreateType = {
+  square: 'square',
+  horizontal: 'horizontal',
+} as const;

src/api/models/advertisementFile.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+
+export interface AdvertisementFile {
+  id?: string;
+  path?: string;
+  mime?: string;
+}

src/api/models/advertisementMutate.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+import type { AdvertisementCreate } from './advertisementCreate';
+
+export type AdvertisementMutate = AdvertisementCreate;

src/api/models/advertisementStatus.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+
+export type AdvertisementStatus = typeof AdvertisementStatus[keyof typeof AdvertisementStatus];
+
+
+// eslint-disable-next-line @typescript-eslint/no-redeclare
+export const AdvertisementStatus = {
+  ACTIVE: 'ACTIVE',
+  INACTIVE: 'INACTIVE',
+} as const;

src/api/models/advertisementType.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+
+export type AdvertisementType = typeof AdvertisementType[keyof typeof AdvertisementType];
+
+
+// eslint-disable-next-line @typescript-eslint/no-redeclare
+export const AdvertisementType = {
+  square: 'square',
+  horizontal: 'horizontal',
+} as const;

src/api/models/advertisementUpdate.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+import type { AdvertisementUpdateType } from './advertisementUpdateType';
+import type { AdvertisementUpdateStatus } from './advertisementUpdateStatus';
+
+export interface AdvertisementUpdate {
+  /** @maxLength 255 */
+  name?: string;
+  file_id?: string;
+  /**
+   * @maxLength 255
+   * @nullable
+   */
+  alt?: string | null;
+  /** @maxLength 500 */
+  link?: string;
+  type?: AdvertisementUpdateType;
+  status?: AdvertisementUpdateStatus;
+  sort_order?: number;
+}

src/api/models/advertisementUpdateStatus.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+
+export type AdvertisementUpdateStatus = typeof AdvertisementUpdateStatus[keyof typeof AdvertisementUpdateStatus];
+
+
+// eslint-disable-next-line @typescript-eslint/no-redeclare
+export const AdvertisementUpdateStatus = {
+  ACTIVE: 'ACTIVE',
+  INACTIVE: 'INACTIVE',
+} as const;

src/api/models/advertisementUpdateType.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+
+export type AdvertisementUpdateType = typeof AdvertisementUpdateType[keyof typeof AdvertisementUpdateType];
+
+
+// eslint-disable-next-line @typescript-eslint/no-redeclare
+export const AdvertisementUpdateType = {
+  square: 'square',
+  horizontal: 'horizontal',
+} as const;

src/api/models/deleteApiV10AdvertisementId200.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+import type { ApiResponse } from './apiResponse';
+import type { DeleteApiV10AdvertisementId200AllOf } from './deleteApiV10AdvertisementId200AllOf';
+
+export type DeleteApiV10AdvertisementId200 = ApiResponse & DeleteApiV10AdvertisementId200AllOf;

src/api/models/deleteApiV10AdvertisementId200AllOf.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+
+export type DeleteApiV10AdvertisementId200AllOf = {
+  responseData?: boolean;
+};

src/api/models/deleteApiV10UserIdRoleBody.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+
+export type DeleteApiV10UserIdRoleBody = {
+  /** Role ID to remove */
+  role_id?: string;
+};

src/api/models/getApiV10AdvertisementId200.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+import type { ApiResponse } from './apiResponse';
+import type { GetApiV10AdvertisementId200AllOf } from './getApiV10AdvertisementId200AllOf';
+
+export type GetApiV10AdvertisementId200 = ApiResponse & GetApiV10AdvertisementId200AllOf;

src/api/models/getApiV10AdvertisementId200AllOf.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+import type { Advertisement } from './advertisement';
+
+export type GetApiV10AdvertisementId200AllOf = {
+  responseData?: Advertisement;
+};

src/api/models/getApiV10AdvertisementParams.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+import type { FiltersParameter } from './filtersParameter';
+import type { SortFieldParameter } from './sortFieldParameter';
+import type { SortOrderParameter } from './sortOrderParameter';
+import type { PageParameter } from './pageParameter';
+import type { PageSizeParameter } from './pageSizeParameter';
+
+export type GetApiV10AdvertisementParams = {
+/**
+ * filter, visit https://www.npmjs.com/package/sequelize-api-paginate for syntax
+ */
+filters?: FiltersParameter;
+/**
+ * sortField, visit https://www.npmjs.com/package/sequelize-api-paginate for syntax
+ */
+sortField?: SortFieldParameter;
+/**
+ * sort order, visit https://www.npmjs.com/package/sequelize-api-paginate for syntax
+ */
+sortOrder?: SortOrderParameter;
+/**
+ * page, visit https://www.npmjs.com/package/sequelize-api-paginate for syntax
+ * @minimum 1
+ */
+page?: PageParameter;
+/**
+ * pageSize, visit https://www.npmjs.com/package/sequelize-api-paginate for syntax
+ * @minimum 1
+ */
+pageSize?: PageSizeParameter;
+};

src/api/models/getApiV10AdvertisementPublic200.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+import type { ApiResponse } from './apiResponse';
+import type { GetApiV10AdvertisementPublic200AllOf } from './getApiV10AdvertisementPublic200AllOf';
+
+export type GetApiV10AdvertisementPublic200 = ApiResponse & GetApiV10AdvertisementPublic200AllOf;

src/api/models/getApiV10AdvertisementPublic200AllOf.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+import type { Advertisement } from './advertisement';
+
+export type GetApiV10AdvertisementPublic200AllOf = {
+  responseData?: Advertisement[];
+};

src/api/models/getApiV10AdvertisementPublicParams.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+import type { GetApiV10AdvertisementPublicType } from './getApiV10AdvertisementPublicType';
+
+export type GetApiV10AdvertisementPublicParams = {
+/**
+ * Advertisement type (square or horizontal). If omitted, returns all active.
+ */
+type?: GetApiV10AdvertisementPublicType;
+/**
+ * Max number of records to return (default 20)
+ * @minimum 1
+ * @maximum 100
+ */
+limit?: number;
+};

src/api/models/getApiV10AdvertisementPublicType.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+
+export type GetApiV10AdvertisementPublicType = typeof GetApiV10AdvertisementPublicType[keyof typeof GetApiV10AdvertisementPublicType];
+
+
+// eslint-disable-next-line @typescript-eslint/no-redeclare
+export const GetApiV10AdvertisementPublicType = {
+  square: 'square',
+  horizontal: 'horizontal',
+} as const;

src/api/models/getApiV10PasswordResetRequestParams.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+import type { GetApiV10PasswordResetRequestStatus } from './getApiV10PasswordResetRequestStatus';
+import type { GetApiV10PasswordResetRequestSortOrder } from './getApiV10PasswordResetRequestSortOrder';
+
+export type GetApiV10PasswordResetRequestParams = {
+page?: number;
+pageSize?: number;
+status?: GetApiV10PasswordResetRequestStatus;
+sortField?: string;
+sortOrder?: GetApiV10PasswordResetRequestSortOrder;
+};

src/api/models/getApiV10PasswordResetRequestSortOrder.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+
+export type GetApiV10PasswordResetRequestSortOrder = typeof GetApiV10PasswordResetRequestSortOrder[keyof typeof GetApiV10PasswordResetRequestSortOrder];
+
+
+// eslint-disable-next-line @typescript-eslint/no-redeclare
+export const GetApiV10PasswordResetRequestSortOrder = {
+  asc: 'asc',
+  desc: 'desc',
+} as const;

src/api/models/getApiV10PasswordResetRequestStatus.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+
+export type GetApiV10PasswordResetRequestStatus = typeof GetApiV10PasswordResetRequestStatus[keyof typeof GetApiV10PasswordResetRequestStatus];
+
+
+// eslint-disable-next-line @typescript-eslint/no-redeclare
+export const GetApiV10PasswordResetRequestStatus = {
+  PENDING: 'PENDING',
+  RESOLVED: 'RESOLVED',
+  REJECTED: 'REJECTED',
+  all: 'all',
+} as const;

src/api/models/index.ts

@@ -6,6 +6,17 @@
  * OpenAPI spec version: 1.0.0
  */
 
+export * from './advertisement';
+export * from './advertisementCreate';
+export * from './advertisementCreateStatus';
+export * from './advertisementCreateType';
+export * from './advertisementFile';
+export * from './advertisementMutate';
+export * from './advertisementStatus';
+export * from './advertisementType';
+export * from './advertisementUpdate';
+export * from './advertisementUpdateStatus';
+export * from './advertisementUpdateType';
 export * from './apiResponse';
 export * from './apiResponseResponseData';
 export * from './apiResponseViolationItem';
@@ -41,6 +52,8 @@ export * from './categoryTagMutate';
 export * from './categoryThumbnail';
 export * from './contact';
 export * from './contactMutate';
+export * from './deleteApiV10AdvertisementId200';
+export * from './deleteApiV10AdvertisementId200AllOf';
 export * from './deleteApiV10BannerId200';
 export * from './deleteApiV10BannerId200AllOf';
 export * from './deleteApiV10CategoryId200';
@@ -69,6 +82,7 @@ export * from './deleteApiV10RolePermissionRoleRoleId200AllOf';
 export * from './deleteApiV10RolePermissionRoleRoleId200AllOfResponseData';
 export * from './deleteApiV10TermId200';
 export * from './deleteApiV10TermId200AllOf';
+export * from './deleteApiV10UserIdRoleBody';
 export * from './deleteApiV10UserRoleId200';
 export * from './deleteApiV10UserRoleId200AllOf';
 export * from './deleteApiV10UserRoleId200AllOfResponseData';
@@ -84,6 +98,13 @@ export * from './forgotPasswordResetRequest';
 export * from './forgotPasswordSendOtpRequest';
 export * from './forgotPasswordVerifyOtpRequest';
 export * from './forgotPasswordVerifyOtpResponse';
+export * from './getApiV10AdvertisementId200';
+export * from './getApiV10AdvertisementId200AllOf';
+export * from './getApiV10AdvertisementParams';
+export * from './getApiV10AdvertisementPublic200';
+export * from './getApiV10AdvertisementPublic200AllOf';
+export * from './getApiV10AdvertisementPublicParams';
+export * from './getApiV10AdvertisementPublicType';
 export * from './getApiV10AuthMe200';
 export * from './getApiV10AuthMe200AllOf';
 export * from './getApiV10AuthProfile200';
@@ -109,6 +130,9 @@ export * from './getApiV10LogoParams';
 export * from './getApiV10MemberParams';
 export * from './getApiV10NewsletterSubscriptionParams';
 export * from './getApiV10PageConfigParams';
+export * from './getApiV10PasswordResetRequestParams';
+export * from './getApiV10PasswordResetRequestSortOrder';
+export * from './getApiV10PasswordResetRequestStatus';
 export * from './getApiV10PermissionId200';
 export * from './getApiV10PermissionId200AllOf';
 export * from './getApiV10PermissionParams';
@@ -189,6 +213,8 @@ export * from './patchApiV10NewsletterSubscriptionId200';
 export * from './patchApiV10NewsletterSubscriptionId200AllOf';
 export * from './patchApiV10TagId200';
 export * from './patchApiV10TagId200AllOf';
+export * from './patchApiV10UserIdStatusBody';
+export * from './patchApiV10UserIdStatusBodyStatus';
 export * from './patchApiV10VideoId200';
 export * from './patchApiV10VideoId200AllOf';
 export * from './permission';
@@ -200,6 +226,9 @@ export * from './permissionUpdate';
 export * from './position';
 export * from './positionMutate';
 export * from './post';
+export * from './postApiV10Advertisement200';
+export * from './postApiV10Advertisement200AllOf';
+export * from './postApiV10AuthForgotPasswordRequestBody';
 export * from './postApiV10AuthForgotPasswordVerifyOtp200';
 export * from './postApiV10AuthLogin200';
 export * from './postApiV10AuthLogin200Message';
@@ -234,6 +263,8 @@ export * from './postApiV10MemberImportBody';
 export * from './postApiV10NewsletterSubscription200';
 export * from './postApiV10NewsletterSubscription200AllOf';
 export * from './postApiV10PageConfigBody';
+export * from './postApiV10PasswordResetRequestIdRejectBody';
+export * from './postApiV10PasswordResetRequestIdResolveBody';
 export * from './postApiV10PermissionBulk200';
 export * from './postApiV10PermissionBulk200AllOf';
 export * from './postApiV10Position200';
@@ -264,6 +295,7 @@ export * from './postApiV10PostTagPostIdBulk200';
 export * from './postApiV10PostTagPostIdBulk200AllOf';
 export * from './postApiV10PostTagPostIdBulk200AllOfResponseDataItem';
 export * from './postApiV10PostTagPostIdBulkBody';
+export * from './postApiV10RoleBody';
 export * from './postApiV10RoleBulk200';
 export * from './postApiV10RoleBulk200AllOf';
 export * from './postApiV10RolePermissionRoleRoleIdBulk200';
@@ -275,6 +307,7 @@ export * from './postApiV10TagIds200AllOf';
 export * from './postApiV10TagIdsBody';
 export * from './postApiV10Term201';
 export * from './postApiV10Term201AllOf';
+export * from './postApiV10UserIdRoleBody';
 export * from './postApiV10UserRole200';
 export * from './postApiV10UserRole200AllOf';
 export * from './postApiV10Video200';
@@ -288,6 +321,8 @@ export * from './postMutateContentStructure';
 export * from './postTag';
 export * from './postTagBulkCreate';
 export * from './postTagMutate';
+export * from './putApiV10AdvertisementId200';
+export * from './putApiV10AdvertisementId200AllOf';
 export * from './putApiV10BannerId200';
 export * from './putApiV10BannerId200AllOf';
 export * from './putApiV10CategoryId200';

src/api/models/patchApiV10UserIdStatusBody.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+import type { PatchApiV10UserIdStatusBodyStatus } from './patchApiV10UserIdStatusBodyStatus';
+
+export type PatchApiV10UserIdStatusBody = {
+  /** Trạng thái mới của user */
+  status?: PatchApiV10UserIdStatusBodyStatus;
+};

src/api/models/patchApiV10UserIdStatusBodyStatus.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+
+/**
+ * Trạng thái mới của user
+ */
+export type PatchApiV10UserIdStatusBodyStatus = typeof PatchApiV10UserIdStatusBodyStatus[keyof typeof PatchApiV10UserIdStatusBodyStatus];
+
+
+// eslint-disable-next-line @typescript-eslint/no-redeclare
+export const PatchApiV10UserIdStatusBodyStatus = {
+  active: 'active',
+  inactive: 'inactive',
+} as const;

src/api/models/postApiV10Advertisement200.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+import type { ApiResponse } from './apiResponse';
+import type { PostApiV10Advertisement200AllOf } from './postApiV10Advertisement200AllOf';
+
+export type PostApiV10Advertisement200 = ApiResponse & PostApiV10Advertisement200AllOf;

src/api/models/postApiV10Advertisement200AllOf.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+import type { Advertisement } from './advertisement';
+
+export type PostApiV10Advertisement200AllOf = {
+  responseData?: Advertisement;
+};

src/api/models/postApiV10AuthForgotPasswordRequestBody.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+
+export type PostApiV10AuthForgotPasswordRequestBody = {
+  email: string;
+  /** Ghi chú thêm từ user (tên, lý do, etc.) */
+  note?: string;
+};

src/api/models/postApiV10PasswordResetRequestIdRejectBody.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+
+export type PostApiV10PasswordResetRequestIdRejectBody = {
+  /** Lý do từ chối */
+  resolveNote?: string;
+};

src/api/models/postApiV10PasswordResetRequestIdResolveBody.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+
+export type PostApiV10PasswordResetRequestIdResolveBody = {
+  /** Mật khẩu mới (nếu bỏ trống sẽ dùng vcci@2026) */
+  newPassword?: string;
+  /** Ghi chú của admin */
+  resolveNote?: string;
+};

src/api/models/postApiV10RoleBody.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+
+export type PostApiV10RoleBody = {
+  name?: string;
+  description?: string;
+  permissions?: string[];
+};

src/api/models/postApiV10UserIdRoleBody.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+
+export type PostApiV10UserIdRoleBody = {
+  /** Role ID to assign */
+  role_id?: string;
+  /** Set as primary role */
+  is_primary?: boolean;
+};

src/api/models/putApiV10AdvertisementId200.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+import type { ApiResponse } from './apiResponse';
+import type { PutApiV10AdvertisementId200AllOf } from './putApiV10AdvertisementId200AllOf';
+
+export type PutApiV10AdvertisementId200 = ApiResponse & PutApiV10AdvertisementId200AllOf;

src/api/models/putApiV10AdvertisementId200AllOf.ts

+/**
+ * Generated by orval v8.0.0-rc.0 🍺
+ * Do not edit manually.
+ * VietProDev CMS Backend API
+ * Generated API documentation
+ * OpenAPI spec version: 1.0.0
+ */
+import type { Advertisement } from './advertisement';
+
+export type PutApiV10AdvertisementId200AllOf = {
+  responseData?: Advertisement;
+};

src/api/models/role.ts

@@ -23,4 +23,6 @@ export interface Role {
   created_by?: string | null;
   /** @nullable */
   updated_by?: string | null;
+  /** Danh sách permission strings (vd: 'posts:read', 'posts:write') */
+  permissions?: string[];
 }

src/api/models/roleCreate.ts

@@ -14,4 +14,6 @@ export interface RoleCreate {
    * @nullable
    */
   description?: string | null;
+  /** Danh sách permission strings */
+  permissions?: string[];
 }

src/api/models/roleUpdate.ts

@@ -14,4 +14,6 @@ export interface RoleUpdate {
    * @nullable
    */
   description?: string | null;
+  /** Danh sách permission strings (ghi đà toàn bộ permissions hiện tại) */
+  permissions?: string[];
 }

src/app/(main)/(home)/components/featured-news/index.tsx

@@ -3,8 +3,9 @@
 import ImageNext from "@/components/shared/image-next";
 import { useHomePosts } from "@/app/(main)/(home)/lib/use-home-posts";
 import dayjs from "dayjs";
-import { ChevronRight, Mail, Phone } from "lucide-react";
+import { ChevronRight } from "lucide-react";
 import Link from "next/link";
+import HorizontalAdBanner from "@/app/(main)/(home)/components/horizontal-ad-banner";
 
 const FALLBACK_CATEGORY_LINK = "/hoat-dong/tin-tuc";
 
@@ -36,7 +37,7 @@ function FeaturedNews() {
           </Link>
         </div>
 
-        <div className="grid gap-5 lg:grid-cols-[minmax(0,1.14fr)_minmax(0,0.96fr)]">
+        <div className="grid gap-5 lg:grid-cols-[minmax(0,1fr)_minmax(0,1.4fr)]">
           {primaryItem ? (
             <Link
               href={primaryItem.externalLink}
@@ -57,7 +58,7 @@ function FeaturedNews() {
                     {primaryItem.categories[0]?.name || "Tin nổi bật"}
                   </span>
 
-                  <h3 className="max-w-3xl line-clamp-2 text-[16px] font-bold leading-[1.32] text-white transition-colors duration-200 group-hover:text-[#f7b500] md:line-clamp-3 md:text-[28px] lg:text-[32px]">
+                  <h3 className="max-w-3xl line-clamp-2 text-[16px] font-bold leading-[1.32] text-white transition-colors duration-200 group-hover:text-[#f7b500] md:line-clamp-3 md:text-[22px] lg:text-[24px]">
                     {primaryItem.title}
                   </h3>
 
@@ -79,16 +80,16 @@ function FeaturedNews() {
             </div>
           )}
 
-          <div className="grid gap-4">
-            <div className="grid gap-4 md:grid-cols-2">
+          <div className="flex flex-col gap-4 lg:min-h-[380px]">
+            <div className="grid flex-1 gap-4 md:grid-cols-2">
               {secondarySlots.map((item, index) =>
                 item ? (
                   <Link
                     key={item.id}
                     href={item.externalLink}
-                    className="group relative block cursor-pointer overflow-hidden rounded-[20px] bg-[#27447f] shadow-[0_16px_32px_rgba(28,52,120,0.2)] md:min-h-[205px] lg:min-h-[215px]"
+                    className="group relative block cursor-pointer overflow-hidden rounded-[20px] bg-[#27447f] shadow-[0_16px_32px_rgba(28,52,120,0.2)] min-h-[165px]"
                   >
-                    <div className="relative h-full min-h-[195px] md:min-h-[205px] lg:min-h-[215px]">
+                    <div className="relative flex h-full min-h-[165px]">
                       <ImageNext
                         src={item.thumbnail?.url ?? "/thumbnail.png"}
                         alt={item.thumbnail?.alt || item.title}
@@ -118,9 +119,9 @@ function FeaturedNews() {
                 ) : (
                   <div
                     key={`featured-placeholder-${index}`}
-                    className="rounded-[20px] bg-[#dde5f3] shadow-[0_16px_32px_rgba(28,52,120,0.1)] md:min-h-[205px] lg:min-h-[215px]"
+                    className="rounded-[20px] bg-[#dde5f3] shadow-[0_16px_32px_rgba(28,52,120,0.1)] min-h-[165px]"
                   >
-                    <div className="flex h-full min-h-[195px] flex-col justify-end p-3.5 md:min-h-[205px] lg:min-h-[215px]">
+                    <div className="flex h-full min-h-[165px] flex-col justify-end p-3.5">
                       <span className="mb-2 h-7 w-24 rounded-[10px] bg-white/80" />
                       <div className="h-6 w-5/6 rounded bg-white/90" />
                       <div className="mt-2 h-4 w-24 rounded bg-white/70" />
@@ -130,32 +131,7 @@ function FeaturedNews() {
               )}
             </div>
 
-            <div className="flex h-full min-h-full items-center justify-center overflow-hidden rounded-[28px] bg-linear-to-r from-[#214b95] to-[#2b66bb] px-5 py-5 text-white shadow-[0_18px_38px_rgba(28,52,120,0.2)] md:px-7">
-              <div className="flex w-full flex-col items-center justify-center gap-4 text-center md:flex-row md:gap-6 md:text-left lg:gap-8 xl:gap-12">
-                <div className="flex flex-col items-center md:items-start">
-                  <p className="text-[11px] uppercase tracking-[0.2em] text-white/80 lg:text-[12px] lg:tracking-[0.4em]">
-                    Quảng bá & tiếp cận
-                  </p>
-                  <h3 className="mt-2 text-[20px] font-extrabold uppercase leading-[1.1] lg:text-[18px] xl:text-[22px]">
-                    <span>Cộng đồng</span>
-                    <br className="hidden lg:block" />
-                    <span className="lg:hidden"> </span>
-                    <span>doanh nghiệp</span>
-                  </h3>
-                </div>
-
-                <div className="shrink-0 flex flex-col gap-2 rounded-[20px] bg-white px-4 py-3 text-[#173f88] shadow-[0_10px_24px_rgba(8,25,74,0.12)] sm:min-w-fit lg:w-auto lg:rounded-[999px]">
-                  <div className="flex items-center gap-2 text-[13px] font-medium sm:text-sm">
-                    <Mail className="h-4 w-4 shrink-0 sm:h-5 sm:w-5" />
-                    <span className="whitespace-nowrap">info@vcci-hcm.org.vn</span>
-                  </div>
-                  <div className="flex items-center gap-2 text-[13px] font-medium sm:text-sm">
-                    <Phone className="h-4 w-4 shrink-0 sm:h-5 sm:w-5" />
-                    <span className="whitespace-nowrap">+84 28 3932 6598</span>
-                  </div>
-                </div>
-              </div>
-            </div>
+            <HorizontalAdBanner />
           </div>
         </div>
       </div>

src/app/(main)/(home)/components/horizontal-ad-banner/index.tsx

+'use client';
+
+import Image from "next/image";
+import Link from "next/link";
+import { useState } from "react";
+import { useAdvertisements } from "@/app/(main)/(home)/lib/use-advertisements";
+import { resolveUploadUrl } from "@/links";
+
+const FALLBACK_HREF = "https://vcci-hcm.org.vn";
+const FALLBACK_SRC = "/quang-cao/qc-1.jpg";
+
+/**
+ * Banner quảng cáo ngang (full-width) giữa các section.
+ * Luôn hiển thị 1 banner duy nhất (record đầu tiên theo sort_order).
+ * Dù có nhiều vị trí đặt component, tất cả đều hiển thị cùng 1 banner.
+ * Fallback: nếu API không có data hoặc ảnh lỗi → dùng /quang-cao/qc-1.jpg.
+ */
+function HorizontalAdBanner() {
+  const ads = useAdvertisements("horizontal");
+  const ad = ads[0];
+
+  const href = ad?.link || FALLBACK_HREF;
+  const initialSrc = ad?.file?.path ? resolveUploadUrl(ad.file.path) : FALLBACK_SRC;
+  const [src, setSrc] = useState(initialSrc);
+  const [errored, setErrored] = useState(false);
+
+  // Reset state khi ad thay đổi
+  if (ad?.file?.path && !errored && src !== initialSrc) {
+    setSrc(initialSrc);
+  }
+
+  const isGif = src.toLowerCase().endsWith(".gif");
+  const title = ad?.name || "Quảng cáo VCCI HCM";
+  const alt = ad?.alt || title;
+
+  return (
+    <Link
+      href={href}
+      target="_blank"
+      rel="noopener noreferrer"
+      className="relative block overflow-hidden rounded-[10px] shadow-[0_16px_32px_rgba(28,52,120,0.2)] lg:rounded-[20px]"
+      style={{ aspectRatio: "1600 / 200" }}
+      title={title}
+    >
+      <Image
+        src={src}
+        alt={alt}
+        fill
+        className="object-cover"
+        unoptimized={isGif}
+        onError={() => {
+          if (src !== FALLBACK_SRC) {
+            setSrc(FALLBACK_SRC);
+            setErrored(true);
+          }
+        }}
+      />
+    </Link>
+  );
+}
+
+export default HorizontalAdBanner;

src/app/(main)/(home)/components/quick-links/index.tsx

 'use client';
 
-import ImageNext from "@/components/shared/image-next";
+import Image from "next/image";
 import Link from "next/link";
+import { useState } from "react";
+import { useAdvertisements } from "@/app/(main)/(home)/lib/use-advertisements";
+import { resolveUploadUrl } from "@/links";
+import type { Advertisement } from "@/api/models/advertisement";
+
+const FALLBACK_SRC = "/quang-cao/qc-3.jpg";
+const FALLBACK_HREF = "https://vcci-hcm.org.vn";
+
+function AdItem({ item }: { item: Advertisement }) {
+  const initialSrc = item.file?.path ? resolveUploadUrl(item.file.path) : FALLBACK_SRC;
+  const [src, setSrc] = useState(initialSrc);
+  const isGif = src.toLowerCase().endsWith(".gif");
+
+  return (
+    <Link
+      href={item.link}
+      target="_blank"
+      rel="noopener noreferrer"
+      className="block overflow-hidden rounded-[28px] shadow-[0_12px_28px_rgba(31,59,124,0.14)]"
+      title={item.name}
+    >
+      <div className="aspect-[16/10] overflow-hidden sm:aspect-[16/10] lg:aspect-[7/4] xl:aspect-[3/2]">
+        <Image
+          src={src}
+          alt={item.alt || item.name}
+          width={2048}
+          height={1365}
+          className="h-full w-full object-cover object-[center_80%]"
+          unoptimized={isGif}
+          onError={() => {
+            if (src !== FALLBACK_SRC) setSrc(FALLBACK_SRC);
+          }}
+        />
+      </div>
+    </Link>
+  );
+}
+
+function FallbackAdItem() {
+  return (
+    <Link
+      href={FALLBACK_HREF}
+      target="_blank"
+      rel="noopener noreferrer"
+      className="block overflow-hidden rounded-[28px] shadow-[0_12px_28px_rgba(31,59,124,0.14)]"
+      title="Quảng cáo VCCI HCM"
+    >
+      <div className="aspect-[16/10] overflow-hidden sm:aspect-[16/10] lg:aspect-[7/4] xl:aspect-[3/2]">
+        <Image
+          src={FALLBACK_SRC}
+          alt="Quảng cáo VCCI HCM"
+          width={2048}
+          height={1365}
+          className="h-full w-full object-cover object-[center_80%]"
+        />
+      </div>
+    </Link>
+  );
+}
+
+function Advertisements({ count = 2, startIndex = 0 }: { count?: number; startIndex?: number }) {
+  const ads = useAdvertisements("square");
+  const visibleAds = ads.slice(startIndex, startIndex + count);
+
+  // Fallback: nếu API không có data, hiển thị fallback item
+  const items =
+    visibleAds.length > 0
+      ? visibleAds.map((item) => <AdItem key={item.id} item={item} />)
+      : Array.from({ length: count }).map((_, i) => <FallbackAdItem key={`fallback-${i}`} />);
 
-function Advertisements({ count = 2 }: { count?: number }) {
   const mdCols = count >= 3 ? "md:grid-cols-3" : "md:grid-cols-2";
   return (
     <aside className={`flex w-full flex-col gap-4 md:grid ${mdCols} xl:grid xl:order-2 xl:w-[22%] xl:grid-cols-1 xl:gap-4 xl:self-center`}>
-      <Link
-        href="https://hardwaretools.com.vn/"
-        className="block overflow-hidden rounded-[28px] shadow-[0_12px_28px_rgba(31,59,124,0.14)]"
-      >
-        <div className="aspect-[16/10] overflow-hidden sm:aspect-[16/10] lg:aspect-[7/4] xl:aspect-[3/2]">
-          <ImageNext
-            src="/home/20-2048x1365.webp"
-            alt="Quảng cáo 1"
-            width={2048}
-            height={1365}
-            className="h-full w-full object-cover object-[center_80%]"
-          />
-        </div>
-      </Link>
-
-      <Link
-        href="https://hardwaretools.com.vn/"
-        className="block overflow-hidden rounded-[28px] shadow-[0_12px_28px_rgba(31,59,124,0.14)]"
-      >
-        <div className="aspect-[16/10] overflow-hidden sm:aspect-[16/10] lg:aspect-[7/4] xl:aspect-[3/2]">
-          <ImageNext
-            src="/home/20-2048x1365.webp"
-            alt="Quảng cáo 2"
-            width={2048}
-            height={1365}
-            className="h-full w-full object-cover object-[center_80%]"
-          />
-        </div>
-      </Link>
-
-      {count >= 3 && (
-        <Link
-          href="https://hardwaretools.com.vn/"
-          className="block overflow-hidden rounded-[28px] shadow-[0_12px_28px_rgba(31,59,124,0.14)]"
-        >
-          <div className="aspect-[16/10] overflow-hidden sm:aspect-[16/10] lg:aspect-[7/4] xl:aspect-[3/2]">
-            <ImageNext
-              src="/home/20-2048x1365.webp"
-              alt="Quảng cáo 3"
-              width={2048}
-              height={1365}
-              className="h-full w-full object-cover object-[center_80%]"
-            />
-          </div>
-        </Link>
-      )}
+      {items}
     </aside>
   );
 }

src/app/(main)/(home)/lib/use-advertisements.ts

+"use client";
+
+import { useGetApiV10AdvertisementPublic } from "@/api/endpoints/advertisement";
+import type { Advertisement } from "@/api/models/advertisement";
+import type { GetApiV10AdvertisementPublicType } from "@/api/models/getApiV10AdvertisementPublicType";
+
+/**
+ * Hook đọc danh sách quảng cáo active theo loại từ API backend (public, không cần auth).
+ * Backend đã lọc status=ACTIVE và sort theo sort_order ASC.
+ * Mỗi record có `file` (path, mime) — dùng `resolveUploadUrl(file.path)` để lấy URL ảnh.
+ *
+ * @param type - "square" | "horizontal"
+ * @param limit - số lượng records tối đa (mặc định 20 cho square, 1 cho horizontal)
+ */
+export function useAdvertisements(
+  type: "square" | "horizontal",
+  limit?: number,
+): Advertisement[] {
+  const effectiveLimit = limit ?? (type === "horizontal" ? 1 : 20);
+
+  const { data } = useGetApiV10AdvertisementPublic({
+    type: type as GetApiV10AdvertisementPublicType,
+    limit: effectiveLimit,
+  });
+
+  return (
+    (data as unknown as { responseData?: Advertisement[] } | undefined)?.responseData ?? []
+  );
+}

src/app/(main)/(home)/page.tsx

@@ -2,6 +2,7 @@
 
 import FeaturedNews from "./components/featured-news";
 import Advertisements from "./components/quick-links";
+import HorizontalAdBanner from "./components/horizontal-ad-banner";
 import News from "./components/news";
 import Events from "./components/events";
 import BusinessOpportunities from "./components/business-opportunities";
@@ -18,22 +19,15 @@ const Page = () => {
       {/* contents */}
       <div className="container mx-auto px-3 sm:px-6 lg:px-10 space-y-6">
         <FeaturedNews />
-        {/* <div>
-          <Link href="https://hardwaretools.com.vn/">
-            <ImageNext
-              src="/home/Standard-Banner-1-2024.png.webp"
-              alt="banner"
-              width={2560}
-              height={720}
-            />
-          </Link>
-        </div> */}
+
 
         <section className="flex flex-col xl:flex-row pb-8 gap-5 mb-0">
           <News />
-          <Advertisements count={3} />
+          <Advertisements count={3} startIndex={0} />
         </section >
 
+        <HorizontalAdBanner />
+
         <section className="flex flex-col gap-5 xl:flex-row xl:items-stretch" >
           <Events />
           <EventsCalendar />
@@ -57,7 +51,7 @@ const Page = () => {
                 <BusinessOpportunities />
                 <PolicyAndLaws />
               </div>
-              <Advertisements />
+              <Advertisements count={2} startIndex={3} />
             </section>
           </div>
 

src/app/(main)/[...slug]/templates/ArticleDetailPage.tsx

@@ -5,6 +5,7 @@ import ImageNext from "@/components/shared/image-next";
 import AppEditorContent from "@/components/shared/editor-content";
 import ListCategory from "@/components/base/list-category";
 import EventsCalendar from "@/app/(main)/(home)/components/events-calendar";
+import SidebarAdvertisements from "@/components/shared/sidebar-advertisements";
 import { Calendar, MapPin, Clock, DollarSign, Users, CreditCard } from "lucide-react";
 import { buildDynamicCategoryMenu, findDisplayCategoryForPost } from "./data";
 import StructuredPostContent from "./StructuredPostContent";
@@ -254,26 +255,7 @@ export default function ArticleDetailPage({
 
           <aside className="space-y-5 xl:pt-0">
             <EventsCalendar compact className="xl:w-full xl:min-w-0" />
-            <div className="overflow-hidden rounded-[22px] shadow-[0_18px_42px_rgba(17,24,39,0.12)]">
-              <div className="relative min-h-[390px] bg-[#1f334f]">
-                <ImageNext
-                  src="/banner.webp"
-                  alt="Đối tác quảng bá"
-                  width={640}
-                  height={760}
-                  className="absolute inset-0 h-full w-full object-cover"
-                />
-                <div className="absolute inset-0 bg-liner-to-t from-[#14213d]/92 via-[#14213d]/28 to-transparent" />
-                <div className="absolute bottom-8 left-7 right-7 text-white">
-                  <div className="text-xs font-semibold uppercase tracking-[0.24em] text-white/70">
-                    Đối tác quảng bá
-                  </div>
-                  <div className="mt-3 text-2xl font-bold leading-tight">
-                    Business Combo cho hội viên doanh nghiệp
-                  </div>
-                </div>
-              </div>
-            </div>
+            <SidebarAdvertisements count={5} startIndex={0} />
           </aside>
         </div>
       </div>

src/app/(main)/[...slug]/templates/ArticlePage.tsx

@@ -11,6 +11,7 @@ import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import ListCategory from "@/components/base/list-category";
 import EventsCalendar from "@/app/(main)/(home)/components/events-calendar";
+import SidebarAdvertisements from "@/components/shared/sidebar-advertisements";
 import {
   buildDynamicPostHref,
   buildDynamicCategoryMenu,
@@ -250,26 +251,7 @@ export default function ArticlePage({ category, allCategories }: ArticlePageProp
 
               <EventsCalendar compact className="xl:w-full xl:min-w-0" />
 
-              <div className="order-3 overflow-hidden rounded-[22px] shadow-[0_18px_42px_rgba(17,24,39,0.12)] xl:order-0">
-                <div className="relative min-h-[390px] bg-[#1f334f]">
-                  <ImageNext
-                    src="/banner.webp"
-                    alt="Đối tác quảng bá"
-                    width={640}
-                    height={760}
-                    className="absolute inset-0 h-full w-full object-cover"
-                  />
-                  <div className="absolute inset-0 bg-liner-to-t from-[#14213d]/92 via-[#14213d]/28 to-transparent" />
-                  <div className="absolute bottom-8 left-7 right-7 text-white">
-                    <div className="text-xs font-semibold uppercase tracking-[0.24em] text-white/70">
-                      Đối tác quảng bá
-                    </div>
-                    <div className="mt-3 text-2xl font-bold leading-tight">
-                      Business Combo cho hội viên doanh nghiệp
-                    </div>
-                  </div>
-                </div>
-              </div>
+              <SidebarAdvertisements count={5} startIndex={0} />
             </aside>
           </div>
         </div>

src/app/(main)/[...slug]/templates/CatalogPage.tsx

@@ -11,6 +11,7 @@ import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import ListCategory from "@/components/base/list-category";
 import EventsCalendar from "@/app/(main)/(home)/components/events-calendar";
+import SidebarAdvertisements from "@/components/shared/sidebar-advertisements";
 import {
   buildDynamicPostHref,
   buildDynamicCategoryMenu,
@@ -188,26 +189,7 @@ export default function CatalogPage({ category, allCategories }: CatalogPageProp
 
               <EventsCalendar compact className="xl:w-full xl:min-w-0" />
 
-              <div className="order-3 overflow-hidden rounded-[22px] shadow-[0_18px_42px_rgba(17,24,39,0.12)] xl:order-0">
-                <div className="relative min-h-[390px] bg-[#1f334f]">
-                  <ImageNext
-                    src="/banner.webp"
-                    alt="Đối tác quảng bá"
-                    width={640}
-                    height={760}
-                    className="absolute inset-0 h-full w-full object-cover"
-                  />
-                  <div className="absolute inset-0 bg-liner-to-t from-[#14213d]/92 via-[#14213d]/28 to-transparent" />
-                  <div className="absolute bottom-8 left-7 right-7 text-white">
-                    <div className="text-xs font-semibold uppercase tracking-[0.24em] text-white/70">
-                      Đối tác quảng bá
-                    </div>
-                    <div className="mt-3 text-2xl font-bold leading-tight">
-                      Business Combo cho hội viên doanh nghiệp
-                    </div>
-                  </div>
-                </div>
-              </div>
+              <SidebarAdvertisements count={5} startIndex={0} />
             </aside>
           </div>
         </div>

src/app/(main)/search/page.tsx

@@ -5,6 +5,7 @@ import Link from "next/link";
 import { useRouter, useSearchParams } from "next/navigation";
 import { useQuery } from "@tanstack/react-query";
 import ImageNext from "@/components/shared/image-next";
+import SidebarAdvertisements from "@/components/shared/sidebar-advertisements";
 import { Pagination } from "@components/base/pagination";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
@@ -228,26 +229,7 @@ function SearchContent() {
               </div>
             </form>
 
-            <div className="order-3 overflow-hidden rounded-[22px] shadow-[0_18px_42px_rgba(17,24,39,0.12)] xl:order-none">
-              <div className="relative min-h-[390px] bg-[#1f334f]">
-                <ImageNext
-                  src="/banner.webp"
-                  alt="Đối tác quảng bá"
-                  width={640}
-                  height={760}
-                  className="absolute inset-0 h-full w-full object-cover"
-                />
-                <div className="absolute inset-0 bg-gradient-to-t from-[#14213d]/92 via-[#14213d]/28 to-transparent" />
-                <div className="absolute bottom-8 left-7 right-7 text-white">
-                  <div className="text-xs font-semibold uppercase tracking-[0.24em] text-white/70">
-                    Đối tác quảng bá
-                  </div>
-                  <div className="mt-3 text-2xl font-bold leading-tight">
-                    Business Combo cho doanh nghiệp hội viên
-                  </div>
-                </div>
-              </div>
-            </div>
+            <SidebarAdvertisements count={5} startIndex={0} />
           </aside>
         </div>
       </div>

src/app/admin/advertisements/page.tsx

+"use client";
+
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
+import { NoPermissionMessage } from "@/components/shared/permission-gate";
+import { usePermission } from "@/hooks/usePermission";
+import { AdvertisementList } from "./advertisement-list";
+
+export default function AdvertisementsPage() {
+  const canRead = usePermission("advertisements", "read");
+
+  if (!canRead) {
+    return <NoPermissionMessage />;
+  }
+
+  return (
+    <div className="space-y-6">
+      {/* Header */}
+      <div>
+        <h1 className="text-3xl font-bold text-[#163b73]">Quản lý Quảng cáo</h1>
+        <p className="mt-1 text-sm text-slate-600">
+          Quản lý quảng cáo sidebar (vuông) và banner ngang trên trang chủ
+        </p>
+      </div>
+
+      {/* Tabs */}
+      <Tabs defaultValue="square" className="w-full">
+        <TabsList className="grid w-full max-w-md grid-cols-2 rounded-2xl border border-[#063e8e]/10 bg-[#f8fbff] p-1">
+          <TabsTrigger
+            value="square"
+            className="rounded-xl data-[state=active]:bg-[#063e8e] data-[state=active]:text-white"
+          >
+            Quảng cáo vuông (Sidebar)
+          </TabsTrigger>
+          <TabsTrigger
+            value="horizontal"
+            className="rounded-xl data-[state=active]:bg-[#063e8e] data-[state=active]:text-white"
+          >
+            Quảng cáo ngang (Banner)
+          </TabsTrigger>
+        </TabsList>
+
+        <TabsContent value="square" className="mt-6">
+          <AdvertisementList
+            type="square"
+            title="Quảng cáo vuông (Sidebar)"
+            description="Hiển thị ở sidebar các trang. Tỉ lệ ảnh khuyến nghị 16:10"
+            previewAspect="16 / 10"
+            note="Website chỉ hiển thị tối đa 5 quảng cáo vuông (theo sort_order). Các quảng cáo có thứ tự lớn hơn hoặc trạng thái 'Ẩn' sẽ không hiện trên trang."
+          />
+        </TabsContent>
+
+        <TabsContent value="horizontal" className="mt-6">
+          <AdvertisementList
+            type="horizontal"
+            title="Quảng cáo ngang (Banner)"
+            description="Hiển thị banner full-width giữa các section. Tỉ lệ ảnh khuyến nghị 1600:200"
+            previewAspect="1600 / 200"
+            note="Website chỉ hiển thị 1 quảng cáo ngang duy nhất (quảng cáo có sort_order nhỏ nhất và trạng thái 'Hiển thị'). Tất cả vị trí banner trên trang sẽ dùng chung 1 quảng cáo này."
+          />
+        </TabsContent>
+      </Tabs>
+    </div>
+  );
+}

src/app/admin/change-password/page.tsx

+"use client";
+
+import { useState } from "react";
+import { useRouter } from "next/navigation";
+import { Loader2, Lock, Eye, EyeOff, KeyRound, CheckCircle2, AlertCircle } from "lucide-react";
+import { toast } from "sonner";
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import { usePutApiV10UserChangePassword } from "@/api/endpoints/user";
+import useAuthStore from "@/store/useAuthStore";
+import { logoutAdmin } from "@/lib/auth/admin-auth";
+
+export default function ChangePasswordPage() {
+  const router = useRouter();
+  const appUser = useAuthStore((state) => state.appUser);
+  const [oldPassword, setOldPassword] = useState("");
+  const [newPassword, setNewPassword] = useState("");
+  const [confirmPassword, setConfirmPassword] = useState("");
+  const [showOld, setShowOld] = useState(false);
+  const [showNew, setShowNew] = useState(false);
+  const [showConfirm, setShowConfirm] = useState(false);
+  const [done, setDone] = useState(false);
+
+  const changePasswordMutation = usePutApiV10UserChangePassword();
+
+  const validate = (): string | null => {
+    if (!oldPassword.trim()) return "Vui lòng nhập mật khẩu cũ";
+    if (newPassword.length < 6) return "Mật khẩu mới phải có ít nhất 6 ký tự";
+    if (newPassword === oldPassword) return "Mật khẩu mới phải khác mật khẩu cũ";
+    if (newPassword !== confirmPassword) return "Xác nhận mật khẩu không khớp";
+    return null;
+  };
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    const error = validate();
+    if (error) {
+      toast.error(error);
+      return;
+    }
+
+    try {
+      await changePasswordMutation.mutateAsync({
+        data: {
+          oldPassword,
+          newPassword,
+        },
+      });
+      setDone(true);
+      toast.success("Đổi mật khẩu thành công!");
+
+      // Update store để bỏ must_change_password
+      useAuthStore.getState().setAppUser({
+        ...appUser,
+        must_change_password: false,
+      } as typeof appUser);
+
+      // Sau 2s, logout để user đăng nhập lại bằng mật khẩu mới
+      setTimeout(async () => {
+        await logoutAdmin({ silent: true, redirectToLogin: true });
+      }, 2000);
+    } catch (err: unknown) {
+      const e = err as { message?: string };
+      toast.error(e?.message || "Đổi mật khẩu thất bại");
+    }
+  };
+
+  if (done) {
+    return (
+      <div className="flex min-h-screen items-center justify-center bg-gradient-to-br from-[#063e8e]/5 to-[#f8fbff] p-4">
+        <div className="w-full max-w-md rounded-3xl border border-[#063e8e]/10 bg-white p-8 text-center shadow-xl">
+          <div className="mx-auto mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-green-100">
+            <CheckCircle2 className="h-8 w-8 text-green-600" />
+          </div>
+          <h1 className="text-2xl font-bold text-[#163b73]">Đổi mật khẩu thành công</h1>
+          <p className="mt-2 text-sm text-slate-600">
+            Mật khẩu của bạn đã được cập nhật. Bạn sẽ được chuyển về trang đăng nhập
+            để đăng nhập lại bằng mật khẩu mới.
+          </p>
+          <div className="mt-6 flex items-center justify-center gap-2 text-sm text-slate-500">
+            <Loader2 className="h-4 w-4 animate-spin" />
+            Đang chuyển hướng...
+          </div>
+        </div>
+      </div>
+    );
+  }
+
+  return (
+    <div className="flex min-h-screen items-center justify-center bg-gradient-to-br from-[#063e8e]/5 to-[#f8fbff] p-4">
+      <div className="w-full max-w-md rounded-3xl border border-[#063e8e]/10 bg-white p-8 shadow-xl">
+        {/* Header */}
+        <div className="mb-6 text-center">
+          <div className="mx-auto mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-amber-100">
+            <KeyRound className="h-8 w-8 text-amber-600" />
+          </div>
+          <h1 className="text-2xl font-bold text-[#163b73]">Đổi mật khẩu</h1>
+          <p className="mt-2 text-sm text-slate-600">
+            Đây là lần đầu bạn đăng nhập. Vui lòng đổi mật khẩu để tiếp tục.
+          </p>
+        </div>
+
+        {/* Warning */}
+        <div className="mb-6 flex items-start gap-3 rounded-2xl border border-amber-200 bg-amber-50 px-4 py-3">
+          <AlertCircle className="mt-0.5 h-5 w-5 shrink-0 text-amber-600" />
+          <p className="text-sm text-amber-800">
+            Mật khẩu mặc định không được phép sử dụng. Bạn cần tạo mật khẩu mới
+            để bảo vệ tài khoản.
+          </p>
+        </div>
+
+        {/* Form */}
+        <form onSubmit={handleSubmit} className="space-y-4">
+          <div className="space-y-1.5">
+            <Label className="text-sm font-medium">Mật khẩu hiện tại *</Label>
+            <div className="relative">
+              <Lock className="absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-slate-400" />
+              <Input
+                type={showOld ? "text" : "password"}
+                value={oldPassword}
+                onChange={(e) => setOldPassword(e.target.value)}
+                placeholder="Nhập mật khẩu hiện tại"
+                className="h-11 rounded-xl border-[#063e8e]/15 pl-10 pr-10"
+                autoFocus
+              />
+              <button
+                type="button"
+                onClick={() => setShowOld(!showOld)}
+                className="absolute right-3 top-1/2 -translate-y-1/2 text-slate-400 hover:text-slate-600"
+              >
+                {showOld ? <EyeOff className="h-4 w-4" /> : <Eye className="h-4 w-4" />}
+              </button>
+            </div>
+          </div>
+
+          <div className="space-y-1.5">
+            <Label className="text-sm font-medium">Mật khẩu mới *</Label>
+            <div className="relative">
+              <Lock className="absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-slate-400" />
+              <Input
+                type={showNew ? "text" : "password"}
+                value={newPassword}
+                onChange={(e) => setNewPassword(e.target.value)}
+                placeholder="Ít nhất 6 ký tự"
+                className="h-11 rounded-xl border-[#063e8e]/15 pl-10 pr-10"
+              />
+              <button
+                type="button"
+                onClick={() => setShowNew(!showNew)}
+                className="absolute right-3 top-1/2 -translate-y-1/2 text-slate-400 hover:text-slate-600"
+              >
+                {showNew ? <EyeOff className="h-4 w-4" /> : <Eye className="h-4 w-4" />}
+              </button>
+            </div>
+          </div>
+
+          <div className="space-y-1.5">
+            <Label className="text-sm font-medium">Xác nhận mật khẩu mới *</Label>
+            <div className="relative">
+              <Lock className="absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-slate-400" />
+              <Input
+                type={showConfirm ? "text" : "password"}
+                value={confirmPassword}
+                onChange={(e) => setConfirmPassword(e.target.value)}
+                placeholder="Nhập lại mật khẩu mới"
+                className="h-11 rounded-xl border-[#063e8e]/15 pl-10 pr-10"
+              />
+              <button
+                type="button"
+                onClick={() => setShowConfirm(!showConfirm)}
+                className="absolute right-3 top-1/2 -translate-y-1/2 text-slate-400 hover:text-slate-600"
+              >
+                {showConfirm ? <EyeOff className="h-4 w-4" /> : <Eye className="h-4 w-4" />}
+              </button>
+            </div>
+            {confirmPassword && newPassword !== confirmPassword && (
+              <p className="text-xs text-red-600">Mật khẩu xác nhận không khớp</p>
+            )}
+          </div>
+
+          <Button
+            type="submit"
+            disabled={
+              !oldPassword ||
+              !newPassword ||
+              !confirmPassword ||
+              newPassword !== confirmPassword ||
+              changePasswordMutation.isPending
+            }
+            className="h-11 w-full rounded-xl bg-[#063e8e] text-white hover:bg-[#063e8e]/90"
+          >
+            {changePasswordMutation.isPending && (
+              <Loader2 className="mr-2 h-4 w-4 animate-spin" />
+            )}
+            Đổi mật khẩu
+          </Button>
+        </form>
+      </div>
+    </div>
+  );
+}

src/app/admin/no-permission/page.tsx

+"use client";
+
+import Link from "next/link";
+import { usePermission } from "@/hooks/usePermission";
+import { NoPermissionMessage } from "@/components/shared/permission-gate";
+
+export default function NoPermissionPage() {
+  return (
+    <div className="min-h-screen bg-gradient-to-b from-[#f6f9ff] via-[#edf4ff] to-[#f8fbff]">
+      {/* Header */}
+      <div className="border-b border-[#063e8e]/10 bg-white/80 px-6 py-4 backdrop-blur-sm">
+        <div className="flex items-center gap-3">
+          <div className="flex h-10 w-10 items-center justify-center rounded-2xl bg-[#063e8e]">
+            <svg
+              className="h-5 w-5 text-white"
+              fill="none"
+              viewBox="0 0 24 24"
+              stroke="currentColor"
+              strokeWidth={2}
+            >
+              <path
+                strokeLinecap="round"
+                strokeLinejoin="round"
+                d="M9 12.75L11.25 15 15 9.75m-3-7.036A11.959 11.959 0 013.598 6 11.99 11.99 0 003 9.749c0 5.592 3.824 10.29 9 11.623 5.176-1.332 9-6.03 9-11.622 0-1.31-.21-2.571-.598-3.751h-.152c-3.196 0-6.1-1.248-8.25-3.285z"
+              />
+            </svg>
+          </div>
+          <div>
+            <div className="text-sm font-semibold text-[#063e8e]">VCCI News Admin</div>
+            <div className="text-xs text-slate-500">Trang quản trị website</div>
+          </div>
+        </div>
+      </div>
+
+      {/* Main Content */}
+      <div className="mx-auto max-w-2xl px-4 py-16">
+        <NoPermissionMessage />
+      </div>
+
+      {/* Footer */}
+      <div className="border-t border-[#063e8e]/10 bg-white/50 px-6 py-4 text-center">
+        <p className="text-sm text-slate-500">© 2026 VCCI HCM</p>
+      </div>
+    </div>
+  );
+}

src/app/admin/page.tsx

-import { redirect } from 'next/navigation';
+"use client";
+
+import { useEffect } from "react";
+import { useRouter } from "next/navigation";
+import useAuthStore from "@/store/useAuthStore";
+import { usePermission } from "@/hooks/usePermission";
+import { Loader2, ShieldX, Mail, Phone } from "lucide-react";
+import { Button } from "@/components/ui/button";
+
+// Thứ tự ưu tiên các trang admin mặc định
+const ADMIN_LANDING_ROUTES = [
+  { path: "/admin/dashboard", permission: "dashboard:read" as const },
+  { path: "/admin/news", permission: "posts:read" as const },
+  { path: "/admin/base-config", permission: "settings:read" as const },
+  { path: "/admin/users", permission: "users:read" as const },
+  { path: "/admin/password-reset-requests", permission: "users:read" as const },
+  { path: "/admin/roles", permission: "roles:read" as const },
+  { path: "/admin/advertisements", permission: "advertisements:read" as const },
+  { path: "/admin/media", permission: "files:read" as const },
+  { path: "/admin/tags", permission: "tags:read" as const },
+  { path: "/admin/videos", permission: "videos:read" as const },
+  { path: "/admin/members", permission: "members:read" as const },
+  { path: "/admin/contact-management", permission: "contact:read" as const },
+];
 
 export default function AdminPage() {
-  redirect('/admin/base-config');
+  const router = useRouter();
+  const appUser = useAuthStore((state) => state.appUser);
+  const hasHydrated = useAuthStore((state) => state._hasHydrated);
+  const isLoggedIn = useAuthStore((state) => state.appIsLoggedIn);
+
+  const hasDashboard = usePermission("dashboard", "read");
+  const hasPosts = usePermission("posts", "read");
+  const hasSettings = usePermission("settings", "read");
+  const hasUsers = usePermission("users", "read");
+  const hasRoles = usePermission("roles", "read");
+  const hasAds = usePermission("advertisements", "read");
+  const hasFiles = usePermission("files", "read");
+  const hasTags = usePermission("tags", "read");
+  const hasVideos = usePermission("videos", "read");
+  const hasMembers = usePermission("members", "read");
+  const hasContact = usePermission("contact", "read");
+
+  const permissionMap: Record<string, boolean> = {
+    "dashboard:read": hasDashboard,
+    "posts:read": hasPosts,
+    "settings:read": hasSettings,
+    "users:read": hasUsers,
+    "roles:read": hasRoles,
+    "advertisements:read": hasAds,
+    "files:read": hasFiles,
+    "tags:read": hasTags,
+    "videos:read": hasVideos,
+    "members:read": hasMembers,
+    "contact:read": hasContact,
+  };
+
+  useEffect(() => {
+    if (!hasHydrated || !isLoggedIn) return;
+    if (appUser?.must_change_password) return; // AuthGuard sẽ xử lý
+
+    // Tìm trang admin đầu tiên user có quyền
+    const firstAllowed = ADMIN_LANDING_ROUTES.find(
+      (route) => permissionMap[route.permission],
+    );
+
+    if (firstAllowed) {
+      router.replace(firstAllowed.path);
+    }
+    // Nếu không có quyền gì → stay on /admin, render no-access message
+  }, [hasHydrated, isLoggedIn, appUser, router]);
+
+  // Loading
+  if (!hasHydrated || !isLoggedIn) {
+    return (
+      <div className="flex min-h-screen items-center justify-center bg-[#f8fbff]">
+        <Loader2 className="h-8 w-8 animate-spin text-[#063e8e]" />
+      </div>
+    );
+  }
+
+  // Nếu phải đổi mật khẩu → AuthGuard sẽ redirect, tạm render loading
+  if (appUser?.must_change_password) {
+    return (
+      <div className="flex min-h-screen items-center justify-center bg-[#f8fbff]">
+        <Loader2 className="h-8 w-8 animate-spin text-[#063e8e]" />
+      </div>
+    );
+  }
+
+  // Kiểm tra có quyền gì không
+  const hasAnyPermission = ADMIN_LANDING_ROUTES.some(
+    (route) => permissionMap[route.permission],
+  );
+
+  // Nếu có quyền → loading (đang redirect)
+  if (hasAnyPermission) {
+    return (
+      <div className="flex min-h-screen items-center justify-center bg-[#f8fbff]">
+        <Loader2 className="h-8 w-8 animate-spin text-[#063e8e]" />
+      </div>
+    );
+  }
+
+  // Không có quyền gì → hiển thị thông báo
+  return (
+    <div className="flex min-h-screen items-center justify-center bg-gradient-to-b from-[#f6f9ff] via-[#edf4ff] to-[#f8fbff] px-4">
+      <div className="w-full max-w-2xl rounded-3xl border border-[#063e8e]/10 bg-white p-8 text-center shadow-xl md:p-12">
+        {/* Icon */}
+        <div className="mx-auto mb-6 flex h-20 w-20 items-center justify-center rounded-full bg-amber-100">
+          <ShieldX className="h-10 w-10 text-amber-600" />
+        </div>
+
+        {/* Title */}
+        <h1 className="text-2xl font-bold text-[#163b73] md:text-3xl">
+          Tài khoản chưa được cấp quyền
+        </h1>
+
+        {/* Message */}
+        <p className="mx-auto mt-4 max-w-md text-sm text-slate-600 md:text-base">
+          Tài khoản của bạn hiện tại chưa có quyền quản trị chức năng nào.
+          Vui lòng liên hệ ban quản trị website hoặc bên kỹ thuật để được hỗ trợ.
+        </p>
+
+        {/* User info */}
+        <div className="mt-6 rounded-2xl border border-[#063e8e]/10 bg-[#f8fbff] px-6 py-4 text-left">
+          <div className="grid grid-cols-1 gap-2 text-sm md:grid-cols-2">
+            <div>
+              <span className="text-slate-500">Email:</span>{" "}
+              <span className="font-medium text-[#163b73]">{appUser?.email}</span>
+            </div>
+            <div>
+              <span className="text-slate-500">Vai trò:</span>{" "}
+              <span className="font-medium text-[#163b73]">
+                {appUser?.roles?.length ? appUser.roles.join(", ") : "Chưa có"}
+              </span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
 }

src/components/shared/admin-permission-guard.tsx

+"use client";
+
+import React, { useEffect, useState } from "react";
+import { usePermission } from "@/hooks/usePermission";
+import useAuthStore from "@/store/useAuthStore";
+import { usePathname, useRouter } from "next/navigation";
+import { Loader2 } from "lucide-react";
+
+interface PagePermissionGuardProps {
+  children: React.ReactNode;
+  /** Required permission để truy cập page, ví dụ: "posts:read" */
+  requiredPermission?: string;
+  /** Nhiều permissions - cần ít nhất một */
+  requiredAnyPermission?: string[];
+  /** Nếu không có quyền, redirect đến trang này */
+  redirectTo?: string;
+  /** Component hiển thị khi không có quyền (thay vì redirect) */
+  fallbackComponent?: React.ReactNode;
+}
+
+/**
+ * Component để bảo vệ page dựa trên permissions
+ * - Kiểm tra user có permission cần thiết không
+ * - Nếu không có quyền, redirect hoặc hiển thị fallback
+ * - Nếu chưa hydrate xong auth store, hiển thị loading
+ */
+export function PagePermissionGuard({
+  children,
+  requiredPermission,
+  requiredAnyPermission,
+  redirectTo = "/admin/no-permission",
+  fallbackComponent,
+}: PagePermissionGuardProps) {
+  const router = useRouter();
+  const pathname = usePathname();
+  const [isChecking, setIsChecking] = useState(true);
+  const hasHydrated = useAuthStore((state) => state._hasHydrated);
+  const appIsLoggedIn = useAuthStore((state) => state.appIsLoggedIn);
+
+  // Kiểm tra permission
+  const hasPermission = usePermission(
+    requiredPermission?.split(":")[0] || "",
+    requiredPermission?.split(":")[1] || ""
+  );
+
+  // Kiểm tra nếu cần ít nhất một permission
+  const hasAnyPermission = usePermission(
+    requiredAnyPermission || [],
+    "any"
+  );
+
+  useEffect(() => {
+    // Chờ hydrate xong
+    if (!hasHydrated) {
+      return;
+    }
+
+    setIsChecking(false);
+
+    // Nếu chưa đăng nhập, redirect đến login
+    if (!appIsLoggedIn) {
+      router.push("/admin/login");
+      return;
+    }
+
+    // Kiểm tra permission
+    const hasAccess = requiredPermission
+      ? hasPermission
+      : requiredAnyPermission
+      ? hasAnyPermission
+      : true;
+
+    if (!hasAccess) {
+      if (fallbackComponent) {
+        // Đã render fallback component ở return bên dưới
+      } else {
+        router.push(redirectTo);
+      }
+    }
+  }, [hasHydrated, appIsLoggedIn, hasPermission, hasAnyPermission, requiredPermission, requiredAnyPermission, redirectTo, router, fallbackComponent]);
+
+  // Loading state - chờ hydrate
+  if (!hasHydrated || isChecking) {
+    return (
+      <div className="flex min-h-[60vh] items-center justify-center">
+        <div className="flex flex-col items-center gap-4">
+          <Loader2 className="h-8 w-8 animate-spin text-[#063e8e]" />
+          <p className="text-sm text-slate-500">Đang kiểm tra quyền truy cập...</p>
+        </div>
+      </div>
+    );
+  }
+
+  // Chưa đăng nhập - sẽ redirect
+  if (!appIsLoggedIn) {
+    return (
+      <div className="flex min-h-[60vh] items-center justify-center">
+        <div className="flex flex-col items-center gap-4">
+          <Loader2 className="h-8 w-8 animate-spin text-[#063e8e]" />
+          <p className="text-sm text-slate-500">Đang chuyển hướng...</p>
+        </div>
+      </div>
+    );
+  }
+
+  // Kiểm tra permission cuối cùng
+  const hasAccess = requiredPermission
+    ? hasPermission
+    : requiredAnyPermission
+    ? hasAnyPermission
+    : true;
+
+  // Không có quyền và có fallback component
+  if (!hasAccess && fallbackComponent) {
+    return <>{fallbackComponent}</>;
+  }
+
+  // Không có quyền - sẽ redirect
+  if (!hasAccess) {
+    return (
+      <div className="flex min-h-[60vh] items-center justify-center">
+        <div className="flex flex-col items-center gap-4">
+          <Loader2 className="h-8 w-8 animate-spin text-[#063e8e]" />
+          <p className="text-sm text-slate-500">Đang kiểm tra quyền truy cập...</p>
+        </div>
+      </div>
+    );
+  }
+
+  return <>{children}</>;
+}
+
+/**
+ * Mapping từ URL path -> required permission
+ * Sử dụng cho các page admin thông thường
+ */
+export const ADMIN_PAGE_PERMISSIONS: Record<string, string> = {
+  "/admin": "", // Dashboard - không cần permission cụ thể
+  "/admin/base-config": "settings:read",
+  "/admin/header-config": "categories:read",
+  "/admin/news": "posts:read",
+  "/admin/tags": "tags:read",
+  "/admin/videos": "videos:read",
+  "/admin/contact-management/newsletter-emails": "newsletter:read",
+  "/admin/media": "files:read",
+  "/admin/roles": "roles:read",
+  "/admin/users": "users:read",
+};
+
+/**
+ * Lấy required permission cho một path
+ */
+export function getRequiredPermissionForPath(path: string): string | undefined {
+  // Exact match
+  if (ADMIN_PAGE_PERMISSIONS[path]) {
+    return ADMIN_PAGE_PERMISSIONS[path] || undefined;
+  }
+
+  // Prefix match (cho các sub-paths)
+  for (const [basePath, permission] of Object.entries(ADMIN_PAGE_PERMISSIONS)) {
+    if (path.startsWith(basePath + "/")) {
+      return permission || undefined;
+    }
+  }
+
+  // Default - không cần permission
+  return undefined;
+}
+
+/**
+ * Component tự động kiểm tra permission dựa trên URL
+ * Sử dụng trong admin layout
+ */
+export function AutoPagePermissionGuard({ children }: { children: React.ReactNode }) {
+  const pathname = usePathname();
+  const requiredPermission = getRequiredPermissionForPath(pathname);
+
+  if (!requiredPermission) {
+    return <>{children}</>;
+  }
+
+  return (
+    <PagePermissionGuard requiredPermission={requiredPermission}>
+      {children}
+    </PagePermissionGuard>
+  );
+}

src/lib/api/cms-admin.ts

@@ -36,6 +36,7 @@ export interface CmsFileItem {
 
 export interface CmsPostContentImage {
   position: number;
+  caption: string;
   image: {
     id: string;
     name: string;
@@ -277,6 +278,7 @@ const parsePostContent = (contentStructure?: Record<string, unknown> | null): Cm
       image_rows: typeof section.image_rows === "number" ? section.image_rows : 2,
       images: images.map((image, imageIndex) => ({
         position: typeof image.position === "number" ? image.position : imageIndex + 1,
+        caption: typeof image.caption === "string" ? image.caption : "",
         image: {
           id: typeof image.image === "object" && image.image && "id" in image.image
             ? String((image.image as Record<string, unknown>).id ?? "")