update

* cấu hình menu
* cấu hình chính sách

src/assets/configurations.example.ts

@@ -84,4 +84,14 @@ export enum API_PATHS {
   getBookingDetail = 'booking/detail',
   getArrayArtist = 'artist/arrayArtist',
   getArrayCust = 'customer/arrayCust',
+  getlistMenu = 'web-page/list',
+  getDetailMenu = 'web-page/detail',
+  updateMenu = 'web-page/update',
+  addMenu = 'web-page/add',
+  deleteMenu = 'web-page/delete',
+  getConfigSystem = 'config-page',
+  getDetailConfigSystem = 'config-page/detail',
+  updateConfigSystem = 'config-page/update',
+  addConfigSystem = 'config-page/add',
+  deleteConfigSystem = 'config-page/delete',
 }

src/assets/enums.ts

@@ -44,3 +44,28 @@ export enum ActiveStatus {
   active = 1,
   inactive = 0,
 }
+
+export enum ContactStatus {
+  active = 1,
+  inactive = 0,
+}
+
+export enum PolicyStatus {
+  active = 1,
+  inactive = 0,
+}
+
+export enum NewsStatus {
+  active = 1,
+  inactive = 0,
+}
+
+export enum SystemHotProductStatus {
+  active = 1,
+  inactive = 0,
+}
+
+export enum MenuStatus {
+  active = 1,
+  inactive = 0,
+}

src/assets/type.ts

@@ -423,3 +423,95 @@ export type ListArrayCust = {
   id: number;
   fullName: string;
 };
+
+export type listMenu = {
+  id: number;
+  name: string;
+  url: string;
+  language: string;
+  numIndex: number;
+  status: number;
+  createBy?: string;
+  createTime?: string;
+  updateBy?: string;
+  updateTime?: string;
+};
+
+export type DetailMenu = {
+  id: number;
+  name: string;
+  url: string;
+  language: string;
+  numIndex: number;
+  status: number;
+  createBy?: string;
+  createTime?: string;
+  updateBy?: string;
+  updateTime?: string;
+};
+
+export type UpdateMenu = {
+  id: number;
+  name: string;
+  url: string;
+  numIndex: number;
+  status: number;
+  createBy?: string;
+  createTime?: string;
+  updateBy?: string;
+  updateTime?: string;
+};
+
+export type AddMenu = {
+  name: string;
+  url: string;
+  numIndex: number;
+  status: number;
+};
+
+export type ListConfigSystem = {
+  id: number;
+  namePage: string;
+  title: string;
+  content: string;
+  numIndex: number;
+  status: number;
+  createTime?: string;
+  createBy?: string;
+  updateTime?: string;
+  updateBy?: string;
+};
+
+export type DetailConfigSystem = {
+  id: number;
+  namePage: string;
+  title: string;
+  content: string;
+  numIndex: number;
+  status: number;
+  createTime?: string;
+  createBy?: string;
+  updateTime?: string;
+  updateBy?: string;
+};
+
+export type UpdateConfigSystem = {
+  id: number;
+  namePage: string;
+  title: string;
+  content: string;
+  status: number;
+  numIndex: number;
+  createTime?: string;
+  createBy?: string;
+  updateTime?: string;
+  updateBy?: string;
+};
+
+export type AddConfigSystem = {
+  namePage: string;
+  title: string;
+  content: string;
+  numIndex: number;
+  status: number;
+};

src/components/policy/index.vue

+<template>
+  <q-dialog
+    persistent
+    :model-value="isOpened"
+    @update:model-value="$emit('update:isOpened', $event)"
+  >
+    <q-card style="min-width: 80rem" bordered>
+      <q-form
+        greedy
+        @submit.prevent="
+          $emit('addUpdatePolicy', {});
+          $emit('update:isOpened', false);
+        "
+      >
+        <q-card-section>
+          <q-item>
+            <q-item-section>
+              <q-item-label class="text-h6 text-weight-regular">{{
+                isUpdate
+                  ? $t('listPolicy.dialogLabel.titleAdd')
+                  : $t('listPolicy.dialogLabel.titleUpdate')
+              }}</q-item-label>
+            </q-item-section>
+          </q-item>
+        </q-card-section>
+        <q-separator />
+
+        <q-card-section>
+          <div class="row q-col-gutter-sm">
+            <div class="col-6">
+              <q-input
+                :model-value="namePage"
+                @update:model-value="$emit('update:namePage', $event)"
+                :label="$t('listPolicy.dialogLabel.fieldLabels.namePage')"
+                class="q-my-sm"
+                type="text"
+                outlined
+                :rules="namePageRules"
+                clearable
+              ></q-input>
+              <q-input
+                :model-value="numIndex"
+                @update:model-value="$emit('update:numIndex', $event)"
+                :label="$t('listMenu.dialogLabel.fieldLabels.numIndex')"
+                class="q-my-sm"
+                mask="##"
+                outlined
+                clearable
+              ></q-input>
+            </div>
+            <div class="col-6">
+              <q-input
+                :model-value="title"
+                @update:model-value="$emit('update:title', $event)"
+                :label="$t('listPolicy.dialogLabel.fieldLabels.title')"
+                class="q-my-sm"
+                type="text"
+                outlined
+                :rules="titleRules"
+                clearable
+              ></q-input>
+              <div class="q-pt-sm q-pl-sm">
+                <span class="text-body1">{{
+                  $t('listPolicy.dialogLabel.fieldLabels.status')
+                }}</span
+                ><q-toggle
+                  :model-value="status"
+                  :true-value="PolicyStatus.active"
+                  :false-value="PolicyStatus.inactive"
+                  @update:model-value="$emit('update:status', $event)"
+                />
+              </div>
+            </div>
+            <div class="col-12">
+              <div>
+                <q-editor
+                  :model-value="content"
+                  @update:model-value="$emit('update:content', $event)"
+                  ref="editorRef"
+                  placeholder="Nội dung *"
+                  toolbar-text-color="white"
+                  toolbar-toggle-color="yellow-8"
+                  toolbar-bg="primary"
+                  style="height: 20rem"
+                  :toolbar="[
+                    [
+                      {
+                        label: $q.lang.editor.align,
+                        icon: $q.iconSet.editor.align,
+                        fixedLabel: true,
+                        list: 'only-icons',
+                        options: ['left', 'center', 'right', 'justify'],
+                      },
+                    ],
+                    [
+                      'bold',
+                      'italic',
+                      'strike',
+                      'underline',
+                      'subscript',
+                      'superscript',
+                    ],
+                    ['token', 'hr', 'link', 'custom_btn'],
+                    ['print', 'fullscreen'],
+                    [
+                      {
+                        label: $q.lang.editor.formatting,
+                        icon: $q.iconSet.editor.formatting,
+                        list: 'no-icons',
+                        options: [
+                          'p',
+                          'h1',
+                          'h2',
+                          'h3',
+                          'h4',
+                          'h5',
+                          'h6',
+                          'code',
+                        ],
+                      },
+                      {
+                        label: $q.lang.editor.fontSize,
+                        icon: $q.iconSet.editor.fontSize,
+                        fixedLabel: true,
+                        fixedIcon: true,
+                        list: 'no-icons',
+                        options: [
+                          'size-1',
+                          'size-2',
+                          'size-3',
+                          'size-4',
+                          'size-5',
+                          'size-6',
+                          'size-7',
+                        ],
+                      },
+                      {
+                        label: $q.lang.editor.defaultFont,
+                        icon: $q.iconSet.editor.font,
+                        fixedIcon: true,
+                        list: 'no-icons',
+                        options: [
+                          'default_font',
+                          'arial',
+                          'arial_black',
+                          'comic_sans',
+                          'courier_new',
+                          'impact',
+                          'lucida_grande',
+                          'times_new_roman',
+                          'verdana',
+                        ],
+                      },
+                      'removeFormat',
+                    ],
+                    ['quote', 'unordered', 'ordered', 'outdent', 'indent'],
+
+                    ['undo', 'redo'],
+                    ['viewsource'],
+                  ]"
+                  :fonts="{
+                    arial: 'Arial',
+                    arial_black: 'Arial Black',
+                    comic_sans: 'Comic Sans MS',
+                    courier_new: 'Courier New',
+                    impact: 'Impact',
+                    lucida_grande: 'Lucida Grande',
+                    times_new_roman: 'Times New Roman',
+                    verdana: 'Verdana',
+                  }"
+                />
+              </div>
+            </div>
+          </div>
+        </q-card-section>
+        <q-card-actions align="right">
+          <q-btn
+            color="grey"
+            no-caps
+            style="width: 90px"
+            :label="$t('listPolicy.crudActions.cancel')"
+            @click="$emit('update:isOpened', false)"
+          />
+          <q-btn
+            type="submit"
+            color="primary"
+            no-caps
+            style="width: 90px"
+            :label="$t('listPolicy.crudActions.save')"
+          />
+        </q-card-actions>
+      </q-form>
+    </q-card>
+  </q-dialog>
+</template>
+
+<script lang="ts">
+import { PolicyStatus } from 'src/assets/enums';
+import { defineComponent } from 'vue';
+import { i18n } from 'src/boot/i18n';
+
+export default defineComponent({
+  props: {
+    isOpened: {
+      type: Boolean,
+      required: true,
+    },
+    isUpdate: { type: Boolean, default: false },
+    namePage: { type: String, required: true },
+    title: { type: String, required: true },
+    numIndex: { type: Number, required: true },
+    content: { type: String, required: true },
+    status: { type: Number, required: true },
+  },
+  setup() {
+    const namePageRules = [
+      (val?: string) =>
+        (val && val.trim().length) ||
+        i18n.global.t('listPolicy.validateMessages.requireNamePage'),
+    ];
+    const titleRules = [
+      (val?: string) =>
+        (val && val.trim().length) ||
+        i18n.global.t('listPolicy.validateMessages.requireTitle'),
+    ];
+    return {
+      namePageRules,
+      titleRules,
+      PolicyStatus,
+    };
+  },
+  emits: [
+    'update:isOpened',
+    'update:namePage',
+    'update:title',
+    'update:content',
+    'update:numIndex',
+    'update:status',
+    'click:CloseBtn',
+    'addUpdatePolicy',
+  ],
+});
+</script>

src/components/systemMenu/index.vue

+<template>
+  <q-dialog
+    persistent
+    :model-value="isOpened"
+    @update:model-value="$emit('update:isOpened', $event)"
+  >
+    <q-card class="full-width" style="max-width: 40rem" bordered>
+      <q-form
+        greedy
+        @submit.prevent="
+          $emit('addUpdateMenu', {});
+          $emit('update:isOpened', false);
+        "
+      >
+        <q-card-section>
+          <q-item>
+            <q-item-section>
+              <q-item-label class="text-h6 text-weight-regular">
+                {{
+                  isUpdate
+                    ? $t('listMenu.dialogLabel.titleAdd')
+                    : $t('listMenu.dialogLabel.titleUpdate')
+                }}
+              </q-item-label>
+            </q-item-section>
+          </q-item>
+        </q-card-section>
+        <q-separator />
+
+        <q-card-section>
+          <div class="row q-col-gutter-sm">
+            <div class="col-12">
+              <q-input
+                :model-value="name"
+                @update:model-value="$emit('update:name', $event)"
+                :label="$t('listMenu.dialogLabel.fieldLabels.name')"
+                class="q-my-sm"
+                type="text"
+                outlined
+                :rules="nameRules"
+                clearable
+              ></q-input>
+              <q-input
+                :model-value="url"
+                @update:model-value="$emit('update:url', $event)"
+                :label="$t('listMenu.dialogLabel.fieldLabels.url')"
+                class="q-my-sm"
+                type="text"
+                outlined
+                :rules="urlRules"
+                clearable
+              ></q-input>
+              <q-input
+                :model-value="numIndex"
+                @update:model-value="$emit('update:numIndex', $event)"
+                :label="$t('listMenu.dialogLabel.fieldLabels.numIndex')"
+                class="q-my-sm"
+                mask="##"
+                outlined
+                clearable
+              ></q-input>
+              <div class="q-pt-sm">
+                <span class="text-body1">{{
+                  $t('listMenu.dialogLabel.fieldLabels.status')
+                }}</span
+                ><q-toggle
+                  :model-value="status"
+                  :true-value="MenuStatus.active"
+                  :false-value="MenuStatus.inactive"
+                  @update:model-value="$emit('update:status', $event)"
+                />
+              </div>
+            </div>
+          </div>
+        </q-card-section>
+        <q-card-actions align="right">
+          <q-btn
+            color="grey"
+            no-caps
+            style="width: 90px"
+            :label="$t('listMenu.crudActions.cancel')"
+            @click="$emit('update:isOpened', false)"
+          />
+          <q-btn
+            type="submit"
+            color="primary"
+            no-caps
+            style="width: 90px"
+            :label="$t('listMenu.crudActions.save')"
+          />
+        </q-card-actions>
+      </q-form>
+    </q-card>
+  </q-dialog>
+</template>
+
+<script lang="ts">
+import { MenuStatus } from 'src/assets/enums';
+import { defineComponent } from 'vue';
+import { i18n } from 'src/boot/i18n';
+export default defineComponent({
+  props: {
+    isOpened: {
+      type: Boolean,
+      required: true,
+    },
+    isUpdate: { type: Boolean, default: false },
+    name: { type: String, required: true },
+    url: { type: String, required: true },
+    numIndex: { type: Number, required: true },
+    status: { type: Number, required: true },
+  },
+  setup() {
+    const nameRules = [
+      (val?: string) =>
+        (val && val.trim().length) ||
+        i18n.global.t('listMenu.validateMessages.requireName'),
+    ];
+    const urlRules = [
+      (val?: string) =>
+        (val && val.trim().length) ||
+        i18n.global.t('listMenu.validateMessages.requireUrl'),
+    ];
+    return {
+      nameRules,
+      urlRules,
+      MenuStatus,
+    };
+  },
+  emits: [
+    'update:isOpened',
+    'update:name',
+    'update:url',
+    'update:numIndex',
+    'update:status',
+    'addUpdateMenu',
+  ],
+});
+</script>

src/i18n/vi/index.ts

@@ -904,20 +904,7 @@ export default {
     },
   },
 
-  menu: {
-    title: 'Danh sách menu',
-    titleColumnsTable: {
-      stt: 'STT',
-      name: 'Tên menu',
-      location: 'Vị trí',
-      sites: 'Sites',
-      createBy: 'Người tạo',
-      createTime: 'Thời gian tạo',
-      updateBy: 'Người cập nhật',
-      updateTime: 'Thời gian cập nhật',
-      action: 'Chức năng',
-    },
-  },
+  //booking
   listBooking: {
     toolTipMessage: 'Thông tin chi tiết',
     title: 'Danh sách booking',
@@ -950,6 +937,7 @@ export default {
       inactiveEvent: 'Chưa diễn',
     },
   },
+  // công việc
   work: {
     title: 'Danh sách công việc',
     titleColumnsTable: {
@@ -969,4 +957,207 @@ export default {
       inactive: 'Ngừng hoạt động',
     },
   },
+
+  //Cấu hình chính sách
+  listPolicy: {
+    add: 'Thêm',
+    toolTipMessageUpdate: 'Cập nhập',
+    toolTipMessageDelete: 'Xóa',
+    title: 'Cấu hình Chính sách',
+    titleColumnsTable: {
+      stt: 'STT',
+      namePage: 'Tên chính sách',
+      title: 'Tiêu đề',
+      content: 'Nội dung',
+      numIndex: 'Vị trí',
+      status: 'Trạng thái',
+      action: 'Chức năng',
+    },
+    dialogLabel: {
+      titleAdd: 'Thêm Chính sách',
+      titleUpdate: 'Cập nhập Chính sách',
+      fieldLabels: {
+        namePage: 'Tên chính sách *',
+        title: 'Tiêu đề *',
+        numIndex: 'Vị trí',
+        status: 'Trạng thái',
+      },
+    },
+    validateMessages: {
+      requireNamePage: 'Vui lòng nhập Tên chính sách',
+      requireTitle: 'Vui lòng nhập Tiêu đề',
+    },
+    crudActions: {
+      save: 'Lưu',
+      cancel: 'Đóng',
+    },
+    statusLabel: {
+      active: 'Hoạt động',
+      inactive: 'Ngừng hoạt động',
+    },
+    confirmActionsTitle: {
+      confirmDelete: 'Xác nhận',
+      confirmDeleteContent: 'Bạn có chắc muốn xoá Menu này không?',
+      confirmDeleteCancelBtnLabel: 'Huỷ',
+    },
+    actionMessages: {
+      addSuccess: 'Thêm Menu thành công',
+      updateSuccess: 'Cập nhập Menu thành công',
+      deleteSuccess: 'Xóa Menu thành công',
+    },
+  },
+
+  //Cấu hình tin tức
+  listNews: {
+    add: 'Thêm',
+    toolTipMessageUpdate: 'Cập nhập',
+    toolTipMessageDelete: 'Xóa',
+    title: 'Cấu hình Tin tức',
+    titleColumnsTable: {
+      stt: 'STT',
+      image: 'Ảnh tin tức',
+      title: 'Tiêu đề',
+      content: 'Nội dung',
+      location: 'Vị trí',
+      urlTarget: 'Url target',
+      createTime: 'Người tạo',
+      createBy: 'T.G tạo',
+      updateTime: 'Người cập nhập',
+      updateBy: 'T.G cập nhập',
+      status: 'Trạng thái',
+      action: 'Chức năng',
+    },
+    dialogLabel: {
+      titleUpdate: 'Cập nhập Tin tức',
+      titleAdd: 'Thêm Tin tức',
+      fieldLabels: {
+        avatar: 'Ảnh tin tức',
+        urlTarget: 'Url target',
+        title: 'Tiêu đề',
+        content: 'Nội dung',
+        location: 'Vị trí',
+        status: 'Trạng thái',
+      },
+    },
+    validateMessages: {
+      requireTitle: 'Vui lòng nhập Tiêu đề',
+      requireUrlTarget: 'Vui lòng nhập Url target',
+    },
+    crudActions: {
+      save: 'Lưu',
+      cancel: 'Đóng',
+    },
+    statusLabel: {
+      active: 'Hoạt động',
+      inactive: 'Ngừng hoạt động',
+    },
+    actionMessages: {
+      addSuccess: 'Thêm Tin tức thành công',
+      updateSuccess: 'Cập nhập Tin tức thành công',
+      deleteSuccess: 'Xóa Tin tức thành công',
+    },
+  },
+
+  //Cấu hình SP nổi bật
+  listHotProduct: {
+    add: 'Thêm',
+    toolTipMessageUpdate: 'Cập nhập',
+    toolTipMessageDelete: 'Xóa',
+    title: 'Cấu hình Sản phẩm nổi bật',
+    titleColumnsTable: {
+      stt: 'STT',
+      image: 'Ảnh sản phẩm',
+      title: 'Tiêu đề',
+      content: 'Nội dung',
+      location: 'Vị trí',
+      urlTarget: 'Url target',
+      createTime: 'Người tạo',
+      createBy: 'T.G tạo',
+      updateTime: 'Người cập nhập',
+      updateBy: 'T.G cập nhập',
+      status: 'Trạng thái',
+      action: 'Chức năng',
+    },
+    dialogLabel: {
+      titleUpdate: 'Cập nhập Sản phẩm nổi bật',
+      titleAdd: 'Thêm Sản phẩm nổi bật',
+      fieldLabels: {
+        avatar: 'Ảnh sản phẩm',
+        urlTarget: 'Url target',
+        title: 'Tiêu đề',
+        content: 'Nội dung',
+        location: 'Vị trí',
+        status: 'Trạng thái',
+      },
+    },
+    validateMessages: {
+      requireTitle: 'Vui lòng nhập Tiêu đề',
+      requireUrlTarget: 'Vui lòng nhập Url target',
+    },
+    crudActions: {
+      save: 'Lưu',
+      cancel: 'Đóng',
+    },
+    statusLabel: {
+      active: 'Hoạt động',
+      inactive: 'Ngừng hoạt động',
+    },
+    actionMessages: {
+      addSuccess: 'Thêm Sản phẩm nổi bật thành công',
+      updateSuccess: 'Cập nhập Sản phẩm nổi bật thành công',
+      deleteSuccess: 'Xóa Sản phẩm nổi bật thành công',
+    },
+  },
+
+  //Cấu hình menu
+  listMenu: {
+    add: 'Thêm',
+    toolTipMessageUpdate: 'Cập nhập',
+    toolTipMessageDelete: 'Xóa',
+    title: 'Cấu hình Menu',
+    titleColumnsTable: {
+      stt: 'STT',
+      name: 'Tên menu',
+      url: 'Url target',
+      numIndex: 'Vị trí',
+      createTime: 'Người tạo',
+      createBy: 'Thời gian tạo',
+      updateTime: 'Người cập nhập',
+      updateBy: 'Thời gian cập nhập',
+      status: 'Trạng thái',
+      action: 'Chức năng',
+    },
+    dialogLabel: {
+      titleUpdate: 'Cập nhập Menu',
+      titleAdd: 'Thêm Menu',
+      fieldLabels: {
+        name: 'Tên menu',
+        url: 'Url target',
+        numIndex: 'Vị trí',
+        status: 'Trạng thái',
+      },
+    },
+    validateMessages: {
+      requireName: 'Vui lòng nhập Tên menu',
+      requireUrl: 'Vui lòng nhập Url target',
+    },
+    crudActions: {
+      save: 'Lưu',
+      cancel: 'Đóng',
+    },
+    statusLabel: {
+      active: 'Hoạt động',
+      inactive: 'Ngừng hoạt động',
+    },
+    confirmActionsTitle: {
+      confirmDelete: 'Xác nhận',
+      confirmDeleteContent: 'Bạn có chắc muốn xoá Menu này không?',
+      confirmDeleteCancelBtnLabel: 'Huỷ',
+    },
+    actionMessages: {
+      addSuccess: 'Thêm Menu thành công',
+      updateSuccess: 'Cập nhập Menu thành công',
+      deleteSuccess: 'Xóa Menu thành công',
+    },
+  },
 };

src/pages/danh-sach-booking/index.vue

@@ -482,6 +482,25 @@ export default defineComponent({
       void getDetail(id);
     };
 
+    // const filterOrganizational = (
+    //   val: string, update: (fn : () => void) => void
+    // ) => {
+    //   if (!val) {
+    //     update(() => {
+    //       organizationalList.value = [...filterArrayOrganizational.value];
+    //     });
+    //     return;
+    //   } else {
+    //     update(() => {
+    //       const needle = val.toLowerCase();
+    //       organizationalList.value = filterArrayOrganizational.value.filter(
+    //         (item: { id: number; name: string }) =>
+    //           item.name.toLowerCase().indexOf(needle) > -1
+    //       );
+    //     });
+    //   }
+    // };
+
     onMounted(() => {
       void getListBooking();
       void getArrayArtist();

src/pages/menu/Menu.ts

-import { i18n } from 'src/boot/i18n';
-import { defineComponent, onMounted, Ref, ref } from 'vue';
-import Pagination from 'components/pagination/index.vue';
-export default defineComponent({
-  components: {
-    Pagination,
-  },
-  setup() {
-    const tableColumns = [
-      {
-        name: 'stt',
-        field: 'stt',
-        required: true,
-        label: i18n.global.t('menu.titleColumnsTable.stt'),
-        align: 'center',
-        sortable: false,
-      },
-      {
-        name: 'name',
-        field: 'name',
-        required: true,
-        label: i18n.global.t('menu.titleColumnsTable.name'),
-        align: 'center',
-        headerStyle: 'text-align: center !important;',
-        sortable: false,
-      },
-      {
-        name: 'location',
-        field: 'location',
-        required: true,
-        label: i18n.global.t('menu.titleColumnsTable.location'),
-        headerStyle: 'text-align: center !important;',
-        align: 'left',
-        sortable: false,
-      },
-      {
-        name: 'sites',
-        field: 'sites',
-        required: true,
-        label: i18n.global.t('menu.titleColumnsTable.location'),
-        headerStyle: 'text-align: center !important;',
-        align: 'left',
-        sortable: false,
-      },
-      {
-        name: 'createBy',
-        field: 'createBy',
-        required: true,
-        label: i18n.global.t('menu.titleColumnsTable.createBy'),
-        headerStyle: 'text-align: center !important;',
-        align: 'left',
-        sortable: false,
-      },
-      {
-        name: 'createTime',
-        field: 'createTime',
-        required: true,
-        label: i18n.global.t('menu.titleColumnsTable.createTime'),
-        headerStyle: 'text-align: center !important;',
-        align: 'left',
-        sortable: false,
-      },
-      {
-        name: 'updateBy',
-        field: 'updateBy',
-        required: true,
-        label: i18n.global.t('menu.titleColumnsTable.updateBy'),
-        headerStyle: 'text-align: center !important;',
-        align: 'left',
-        sortable: false,
-      },
-      {
-        name: 'updateTime',
-        field: 'updateTime',
-        required: true,
-        label: i18n.global.t('menu.titleColumnsTable.updateTime'),
-        headerStyle: 'text-align: center !important;',
-        align: 'left',
-        sortable: false,
-      },
-      {
-        name: 'action',
-        field: 'action',
-        required: true,
-        label: i18n.global.t('menu.titleColumnsTable.action'),
-        align: 'center',
-        sortable: false,
-      },
-    ];
-    const listMenu = ref([]);
-    const pageIndex = ref(1);
-    const pageSize = ref(20);
-    const totalPage = ref(10);
-    const keywordSearch: Ref<string | null> = ref(null);
-    const changePageSize = () => {
-      pageIndex.value = 1;
-      void getListMenu();
-    };
-
-    const getListMenu = () => {
-      // console.log('API List Menu');
-    };
-
-    onMounted(() => {
-      void getListMenu();
-    });
-    return {
-      keywordSearch,
-      status,
-      listMenu,
-      tableColumns,
-      pageIndex,
-      pageSize,
-      totalPage,
-      changePageSize,
-      getListMenu,
-    };
-  },
-});

src/pages/nghe-sy/index.vue

@@ -336,9 +336,9 @@ export default defineComponent({
             pageIndex: pageIndex.value,
             pageSize: pageSize.value,
             name: fullNameKeyword.value,
-            qualification: fieldSelected.value?.id,
-            artistLevel: professionSelected.value?.id,
-            field: artistLevelSelected.value?.id,
+            field: fieldSelected.value?.id,
+            qualification: professionSelected.value?.id,
+            artistLevel: artistLevelSelected.value?.id,
           },
         })) as AxiosResponse<
           BaseResponseBody<PaginationResponse<ArtistInfoType>>

src/router/routes.ts

@@ -19,6 +19,9 @@ export enum Pages {
   menu = 'menu',
   listBooking = 'danh-sach-booking',
   work = 'cong-viec',
+  policy = 'cau-hinh-chinh-sach',
+  news = 'cau-hinh-tin-tuc',
+  hotProduct = 'cau-hinh-san-pham-noi-bat',
 }
 
 const routes: RouteRecordRaw[] = [
@@ -116,6 +119,21 @@ const routes: RouteRecordRaw[] = [
         component: () => import('pages/cong-viec/index.vue'),
         name: Pages.work,
       },
+      {
+        path: 'cau-hinh-chinh-sach',
+        component: () => import('pages/cau-hinh-chinh-sach/index.vue'),
+        name: Pages.policy,
+      },
+      {
+        path: 'cau-hinh-tin-tuc',
+        component: () => import('pages/cau-hinh-tin-tuc/index.vue'),
+        name: Pages.news,
+      },
+      {
+        path: 'cau-hinh-san-pham-noi-bat',
+        component: () => import('pages/cau-hinh-san-pham-noi-bat/index.vue'),
+        name: Pages.hotProduct,
+      },
     ],
   },