feat(): update

mixcore · Nov 27, 2023 · 9b79e2d · 9b79e2d · vercel · Nov 27, 2023
1 parent a347694
commit 9b79e2d
Show file tree

Hide file tree

Showing 17 changed files with 327 additions and 317 deletions.
diff --git a/...pp/pages/portal/database-data/components/custom-group-row/custom-group-row.component.html b/...pp/pages/portal/database-data/components/custom-group-row/custom-group-row.component.html
@@ -0,0 +1 @@
+<p>custom-group-row works!</p>
diff --git a/...pp/pages/portal/database-data/components/custom-group-row/custom-group-row.component.scss b/...pp/pages/portal/database-data/components/custom-group-row/custom-group-row.component.scss
diff --git a/.../app/pages/portal/database-data/components/custom-group-row/custom-group-row.component.ts b/.../app/pages/portal/database-data/components/custom-group-row/custom-group-row.component.ts
@@ -0,0 +1,12 @@
+import { CommonModule } from '@angular/common';
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+
+@Component({
+  selector: 'mix-custom-group-row',
+  standalone: true,
+  imports: [CommonModule],
+  templateUrl: './custom-group-row.component.html',
+  styleUrl: './custom-group-row.component.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class CustomGroupRowComponent {}
diff --git a/...ms/src/app/pages/portal/database-data/components/custom-header/custom-header.component.ts b/...ms/src/app/pages/portal/database-data/components/custom-header/custom-header.component.ts
@@ -48,7 +48,7 @@ export class CustomHeaderComponent implements IHeaderAngularComp {
     this.parentComp = this.params.context.componentParent;
 
     const dataType = this.params['dataType'];
-    this.icon = DataTypeDisplay[dataType]?.icon || 'Default';
+    this.icon = DataTypeDisplay[dataType]?.icon || '';
     this.iconSize = DataTypeDisplay[dataType]?.iconSize || '16px';
     this.color = DataTypeColors[dataType] || '#000';
     this.text = params['displayName'] || 'Default';

diff --git a/apps/mix-cms/src/app/pages/portal/database/database.component.html b/apps/mix-cms/src/app/pages/portal/database/database.component.html
@@ -1,41 +1,41 @@
-<div *ngIf="store.vm$ | async as state"
-     class="data-table-page">
+<div class="data-table-page">
   <div class="data-table-page__main-container">
-    <mix-sub-toolbar [description]="'LISTING'"
-                     [title]="'All Database'">
+    <mix-sub-toolbar [description]="'LISTING'" [title]="'All Database'">
       <div class="toolbar-separator"></div>
-      <mix-button (click)="createDatabase()"
-                  size="s"><span class="material-symbols-outlined"> add </span>&nbsp; New
-        MixDb</mix-button>
+      <mix-button (click)="createDatabase()" size="s"
+        ><span class="material-symbols-outlined"> add </span>&nbsp; New
+        MixDb</mix-button
+      >
       <div class="toolbar-separator"></div>
-      <mix-button type="danger"
-                  [disabled]="!selectedTable.length"
-                  (click)="onDeleteTable()"
-                  size="s">
+      <mix-button
+        type="danger"
+        [disabled]="!selectedTable.length"
+        (click)="onDeleteTable()"
+        size="s"
+      >
         <span class="material-symbols-outlined"> delete </span>&nbsp;
-        Delete(s)</mix-button>
+        Delete(s)</mix-button
+      >
 
       <mix-dynamic-filter class="d-block ms-auto"></mix-dynamic-filter>
     </mix-sub-toolbar>
 
-    <div class="data-table-page__body">
-      <mix-data-table [contextMenus]="contextMenus"
-                      [dataset]="state.data"
-                      [loading]="state.status === 'Loading'"
-                      [pageInfo]="state.pageInfo"
-                      [searchFieldOptions]="store.searchColumns"
-                      (itemsSelectedChange)="selectedTable = $event || []"
-                      (pageChange)="store.changePage($event)"
-                      (searchChange)="
+    <div class="data-table-page__body" *ngIf="store.vm$ | async as state">
+      <mix-data-table
+        [contextMenus]="contextMenus"
+        [dataset]="state.data"
+        [loading]="state.status === 'Loading'"
+        [pageInfo]="state.pageInfo"
+        [searchFieldOptions]="store.searchColumns"
+        (itemsSelectedChange)="selectedTable = $event || []"
+        (pageChange)="store.changePage($event)"
+        (searchChange)="
           store.search($event.searchText, $any($event.searchField))
-        ">
-        <div [header]="'Name'"
-             key="displayName"
-             mixTableColumn>
-          <ng-template let-data
-                       mixColumnCell>
-            <div class="d-flex w-fit"
-                 (click)="goDetail(data.id)">
+        "
+      >
+        <div [header]="'Name'" key="displayName" mixTableColumn>
+          <ng-template let-data mixColumnCell>
+            <div class="d-flex w-fit" (click)="goDetail(data.id)">
               <div class="text-600 me-2">
                 {{ data.displayName }}
               </div>
@@ -47,44 +47,32 @@
           </ng-template>
         </div>
 
-        <div [header]="'Description'"
-             key="description"
-             mixTableColumn>
-          <ng-template let-data
-                       mixColumnCell>
+        <div [header]="'Description'" key="description" mixTableColumn>
+          <ng-template let-data mixColumnCell>
             <div>
               {{ data.description || 'No description' }}
             </div>
           </ng-template>
         </div>
 
-        <div [header]="'Created'"
-             key="createdDateTime"
-             mixTableColumn>
-          <ng-template let-data
-                       mixColumnCell>
+        <div [header]="'Created'" key="createdDateTime" mixTableColumn>
+          <ng-template let-data mixColumnCell>
             <div>
-              {{ data.createdDateTime | date: 'short' | relativeTimeSpan }}
+              {{ data.createdDateTime | date : 'short' | relativeTimeSpan }}
             </div>
           </ng-template>
         </div>
 
-        <div [header]="'Columns'"
-             key="modifiedBy"
-             mixTableColumn>
-          <ng-template let-data
-                       mixColumnCell>
+        <div [header]="'Columns'" key="modifiedBy" mixTableColumn>
+          <ng-template let-data mixColumnCell>
             <div class="mix-db__highlight --orange">
               {{ data.columns.length }} column(s)
             </div>
           </ng-template>
         </div>
 
-        <div [header]="''"
-             key="status"
-             mixTableColumn>
-          <ng-template let-data
-                       mixColumnCell>
+        <div [header]="''" key="status" mixTableColumn>
+          <ng-template let-data mixColumnCell>
             <mix-status-indicator [status]="data.status"></mix-status-indicator>
           </ng-template>
         </div>

diff --git a/libs/mix-share/src/bases/base-crud.store.ts b/libs/mix-share/src/bases/base-crud.store.ts
@@ -79,7 +79,7 @@ export class BaseCRUDStore<T> extends ComponentStore<BaseState<T>> {
         switchMap((request) => {
           this.cacheKey = buildCacheKey(request, this.requestName);
           if (!this.cacheService.has(this.cacheKey)) {
-            this.patchState((s) => ({ ...s, status: 'Loading' }));
+            this.patchState({ status: 'Loading' });
           }
 
           return of(request);
@@ -100,8 +100,13 @@ export class BaseCRUDStore<T> extends ComponentStore<BaseState<T>> {
       )
   );
 
+  public reUpdateCache() {
+    this.cacheService.delete(this.cacheKey);
+    this.cacheService.set(this.cacheKey, this.get());
+  }
+
   public reload() {
-    this.patchState((s) => ({ ...s, status: 'Loading' }));
+    this.patchState({ status: 'Loading' });
     this.loadData(this.request$());
   }
 
@@ -128,13 +133,10 @@ export class BaseCRUDStore<T> extends ComponentStore<BaseState<T>> {
   }
 
   public changePage(index: number) {
-    this.patchState((s) => ({
-      ...s,
-      request: {
-        ...s.request,
-        pageIndex: index,
-      },
-    }));
+    const request = this.get().request;
+    request.pageIndex = index;
+
+    this.patchState({ request: request });
   }
 
   public searchChange(

diff --git a/libs/mix-share/src/components/main-side-menu/main-side-menu.component.html b/libs/mix-share/src/components/main-side-menu/main-side-menu.component.html
@@ -18,7 +18,7 @@
       tuiDropdownDirection="bottom"
     >
       <div
-        class="side-menu__item ripple-gray"
+        class="side-menu__item"
         [ngClass]="{
           '--open': isMenuSelected(item, selectedMenu),
           '--active': isMenuSelected(item, selectedMenu)
@@ -54,7 +54,7 @@
         >
           <div
             *ngFor="let child of item.children"
-            class="side-menu__child-item"
+            class="side-menu__child-item ripple-gray"
             [routerLink]="'/' + child.url"
             (click)="$event.stopPropagation()"
           >

diff --git a/libs/mix-share/src/components/main-side-menu/main-side-menu.component.scss b/libs/mix-share/src/components/main-side-menu/main-side-menu.component.scss
@@ -58,7 +58,8 @@
     }
 
     &:hover {
-      color: var(--primary-color);
+      // color: var(--primary-color);
+      opacity: 0.8;
     }
 
     &:first-of-type {

diff --git a/libs/mix-share/src/modules/task-manage/components/task-dnd-list/task-dnd-list.component.scss b/libs/mix-share/src/modules/task-manage/components/task-dnd-list/task-dnd-list.component.scss
@@ -5,10 +5,10 @@
   flex-direction: column;
 
   .cdk-drop-list-dragging {
-    transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
+    transition: transform 150ms cubic-bezier(0, 0, 0.2, 1);
 
     .cdk-drag:not(.cdk-drag-placeholder) {
-      transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
+      transition: transform 150ms cubic-bezier(0, 0, 0.2, 1);
     }
   }
 
@@ -42,5 +42,5 @@
 }
 
 .cdk-drag-animating {
-  transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
+  transition: transform 150ms cubic-bezier(0, 0, 0.2, 1);
 }
diff --git a/libs/mix-share/src/modules/task-manage/store/task.store.ts b/libs/mix-share/src/modules/task-manage/store/task.store.ts
@@ -5,14 +5,13 @@ import {
   TaskStatus,
 } from '@mixcore/lib/model';
 import { BaseCRUDStore } from '@mixcore/share/base';
+import * as R from 'remeda';
 import { map } from 'rxjs';
 
 @Injectable({ providedIn: 'root' })
 export class TaskStore extends BaseCRUDStore<MixTaskNew> {
   public override requestFn = (request: PaginationRequestModel) =>
-    this.mixApi.databaseApi.getDataByName<MixTaskNew>('mixDb_mixTask', {
-      ...request,
-    });
+    this.mixApi.databaseApi.getDataByName<MixTaskNew>('mixDb_mixTask', request);
 
   public override requestName = 'mixTask';
   public override searchColumns = ['Title', 'Description'];
@@ -44,13 +43,14 @@ export class TaskStore extends BaseCRUDStore<MixTaskNew> {
   };
 
   public addTask = (task: MixTaskNew, mode: 'Update' | 'Create' = 'Create') => {
-    this.patchState((s) => {
-      if (mode === 'Create') return { ...s, data: [task, ...s.data] };
+    const currentData = this.get().data;
+    if (mode === 'Create') {
+      currentData.unshift(task);
+    } else {
+      const taskIndex = currentData.findIndex((x) => x.id === task.id);
+      if (taskIndex >= 0) currentData[taskIndex] = task;
+    }
 
-      const taskIndex = s.data.findIndex((x) => x.id === task.id);
-      if (taskIndex >= 0) s.data[taskIndex] = task;
-
-      return { ...s };
-    });
+    this.patchState({ data: R.clone(currentData) });
   };
 }
diff --git a/libs/mix-share/src/stores/user-info.store.ts b/libs/mix-share/src/stores/user-info.store.ts
@@ -31,7 +31,7 @@ export class UserInfoStore extends BaseCRUDStore<UserListVm> {
 
     this.request$$
       .pipe(
-        tap(() => this.patchState((s) => ({ ...s, status: 'Loading' }))),
+        tap(() => this.patchState({ status: 'Loading' })),
         tap((request) => this.loadData(request)),
         takeUntilDestroyed()
       )