imm-element-ui 0.4.0 → 0.4.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (32) hide show
  1. package/esm2022/lib/grid/grid/grid.component.mjs +4 -1
  2. package/esm2022/lib/grid/pager/pager.component.mjs +3 -3
  3. package/esm2022/lib/href-btn-list/href-btn-list.component.mjs +3 -3
  4. package/esm2022/lib/search/pop-date/pop-date.component.mjs +3 -3
  5. package/esm2022/lib/search/pop-panel/pop-panel.component.mjs +5 -5
  6. package/esm2022/lib/search/pop-select/pop-select.component.mjs +3 -3
  7. package/esm2022/lib/search/pop-self/pop-self.component.mjs +3 -3
  8. package/esm2022/lib/search/pop-sort/pop-sort.component.mjs +37 -8
  9. package/esm2022/lib/search/pop-tree/pop-tree.component.mjs +3 -3
  10. package/esm2022/lib/search/search/search.component.mjs +18 -19
  11. package/esm2022/lib/search/search-tip/search-tip.component.mjs +17 -7
  12. package/esm2022/lib/search/search-utils.mjs +1 -10
  13. package/esm2022/lib/service/action.service.mjs +7 -21
  14. package/fesm2022/imm-element-ui.mjs +92 -76
  15. package/fesm2022/imm-element-ui.mjs.map +1 -1
  16. package/lib/grid/grid/grid.component.d.ts +1 -1
  17. package/lib/search/pop-panel/pop-panel.component.d.ts +2 -2
  18. package/lib/search/pop-sort/pop-sort.component.d.ts +9 -3
  19. package/lib/search/search/search.component.d.ts +3 -2
  20. package/lib/search/search-tip/search-tip.component.d.ts +8 -5
  21. package/lib/search/search-utils.d.ts +0 -1
  22. package/lib/service/action.service.d.ts +8 -6
  23. package/package.json +1 -1
  24. package/src/lib/grid/pager/pager.component.scss +0 -10
  25. package/src/lib/href-btn-list/href-btn-list.component.scss +25 -2
  26. package/src/lib/search/pop-date/pop-date.component.scss +25 -5
  27. package/src/lib/search/pop-select/pop-select.component.scss +10 -4
  28. package/src/lib/search/pop-self/pop-self.component.scss +25 -5
  29. package/src/lib/search/pop-sort/pop-sort.component.scss +22 -2
  30. package/src/lib/search/pop-tree/pop-tree.component.scss +6 -3
  31. package/src/lib/search/search/search.component.scss +2 -2
  32. package/src/lib/search/search-tip/search-tip.component.scss +7 -4
@@ -244,7 +244,7 @@ export declare class GridComponent {
244
244
  searchPrm: import("@angular/core").ModelSignal<Search>;
245
245
  deleteEmit: import("@angular/core").OutputEmitterRef<number[]>;
246
246
  addEmit: import("@angular/core").OutputEmitterRef<void>;
247
- addType: import("@angular/core").InputSignal<"select" | "handle" | "none" | undefined>;
247
+ addType: import("@angular/core").InputSignal<"select" | "none" | "handle" | undefined>;
248
248
  selectData: import("@angular/core").InputSignal<any[] | undefined>;
249
249
  showAct: import("@angular/core").InputSignal<boolean>;
250
250
  actPos: import("@angular/core").InputSignal<"top" | "bottom">;
@@ -1,4 +1,4 @@
1
- import { SearchItem } from '../search/search.component';
1
+ import { SearchItem, SearchItemOption } from '../search/search.component';
2
2
  import { ActionService } from '../../service/action.service';
3
3
  import * as i0 from "@angular/core";
4
4
  export declare class PopPanelComponent {
@@ -6,7 +6,7 @@ export declare class PopPanelComponent {
6
6
  searchItems: import("@angular/core").InputSignal<SearchItem[] | undefined>;
7
7
  modelName: import("@angular/core").InputSignal<string | undefined>;
8
8
  otherItems: SearchItem[];
9
- groupItems: SearchItem[];
9
+ sortOptions: SearchItemOption[];
10
10
  itemop: SearchItem;
11
11
  constructor(action: ActionService);
12
12
  static ɵfac: i0.ɵɵFactoryDeclaration<PopPanelComponent, never>;
@@ -1,9 +1,15 @@
1
- import { SearchItem } from '../search/search.component';
1
+ import { SearchItemOption } from '../search/search.component';
2
+ import { ActionService } from '../../service/action.service';
2
3
  import * as i0 from "@angular/core";
3
4
  export declare class PopSortComponent {
4
- searchItems: import("@angular/core").InputSignal<SearchItem[] | undefined>;
5
+ private action;
6
+ sortOptions: import("@angular/core").InputSignal<SearchItemOption[] | undefined>;
7
+ modelName: import("@angular/core").InputSignal<string | undefined>;
5
8
  isActive: boolean;
9
+ fields: string[];
10
+ constructor(action: ActionService);
6
11
  onLabelClick(event: MouseEvent): void;
12
+ onSortOptionClick(item: SearchItemOption, event: MouseEvent): void;
7
13
  static ɵfac: i0.ɵɵFactoryDeclaration<PopSortComponent, never>;
8
- static ɵcmp: i0.ɵɵComponentDeclaration<PopSortComponent, "pop-sort", never, { "searchItems": { "alias": "searchItems"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
14
+ static ɵcmp: i0.ɵɵComponentDeclaration<PopSortComponent, "pop-sort", never, { "sortOptions": { "alias": "sortOptions"; "required": false; "isSignal": true; }; "modelName": { "alias": "modelName"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
9
15
  }
@@ -1,7 +1,7 @@
1
1
  import { ElementRef } from '@angular/core';
2
2
  import { GridOptions } from '../../grid/grid/grid.component';
3
- import { ActionService } from '../../service/action.service';
4
- import { Search } from '../../am/am.component';
3
+ import { ActionService, SortItem } from '../../service/action.service';
4
+ import { Search, Sort } from '../../am/am.component';
5
5
  import { Popover } from 'primeng/popover';
6
6
  import { Observable } from 'rxjs';
7
7
  import { I18nService } from '../../service/i18n.service';
@@ -59,6 +59,7 @@ export declare class SearchComponent {
59
59
  onPopHide(event: any): void;
60
60
  calcMarginLeft(): void;
61
61
  getSearchItemByField(field: string): SearchItem;
62
+ getSortItemBySorts(sorts: Sort[]): SortItem | undefined;
62
63
  onStrItemClick(event: any): void;
63
64
  static ɵfac: i0.ɵɵFactoryDeclaration<SearchComponent, never>;
64
65
  static ɵcmp: i0.ɵɵComponentDeclaration<SearchComponent, "custom-search", never, { "searchPrm": { "alias": "searchPrm"; "required": false; "isSignal": true; }; "gridOptions": { "alias": "gridOptions"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
@@ -1,25 +1,28 @@
1
1
  import { SearchItem, SearchItemOption } from '../search/search.component';
2
- import { ColumnFilter } from '../../am/am.component';
3
- import { ActionService } from '../../service/action.service';
2
+ import { ColumnFilter, Sort } from '../../am/am.component';
3
+ import { ActionService, SortItem } from '../../service/action.service';
4
4
  import { I18nService } from '../../service/i18n.service';
5
5
  import * as i0 from "@angular/core";
6
6
  export declare class SearchTipComponent {
7
7
  private action;
8
8
  private i18n;
9
- groups: import("@angular/core").InputSignal<string[] | undefined>;
10
9
  columnFilter: import("@angular/core").InputSignal<ColumnFilter | undefined>;
11
10
  searchItem: import("@angular/core").InputSignal<SearchItem | undefined>;
11
+ sorts: import("@angular/core").InputSignal<Sort[] | undefined>;
12
+ sortItem: import("@angular/core").InputSignal<SortItem | undefined>;
12
13
  flattenTreeOptions?: any[];
13
14
  operatorList: any[];
14
15
  constructor(action: ActionService, i18n: I18nService);
15
- onGroupTipClose(): void;
16
+ onSortTipClick(): void;
17
+ onSortTipClose(): void;
16
18
  onSearchTipClose(): void;
17
19
  isNotFirstCheckedOption(option: SearchItemOption, item: SearchItem): boolean;
18
20
  formatSelectGroups(selects: SearchItem[]): string;
19
21
  operatorLabel(opera: string): any;
22
+ labelForSorts(): void;
20
23
  labelForList(): (string | undefined)[] | undefined;
21
24
  labelForSelect(): string | (string | undefined)[] | undefined;
22
25
  labelForTree(): any;
23
26
  static ɵfac: i0.ɵɵFactoryDeclaration<SearchTipComponent, never>;
24
- static ɵcmp: i0.ɵɵComponentDeclaration<SearchTipComponent, "search-tip", never, { "groups": { "alias": "groups"; "required": false; "isSignal": true; }; "columnFilter": { "alias": "columnFilter"; "required": false; "isSignal": true; }; "searchItem": { "alias": "searchItem"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
27
+ static ɵcmp: i0.ɵɵComponentDeclaration<SearchTipComponent, "search-tip", never, { "columnFilter": { "alias": "columnFilter"; "required": false; "isSignal": true; }; "searchItem": { "alias": "searchItem"; "required": false; "isSignal": true; }; "sorts": { "alias": "sorts"; "required": false; "isSignal": true; }; "sortItem": { "alias": "sortItem"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
25
28
  }
@@ -5,7 +5,6 @@ export declare const searchUtils: {
5
5
  flattenTree: (nodes: any[]) => any[];
6
6
  transferFilter: (item: SearchItem) => ColumnFilter | undefined;
7
7
  concatFilter: (search: Search | undefined, filter: ColumnFilter) => Search;
8
- concatGroup: (search: Search | undefined, item: SearchItem) => Search;
9
8
  extractSearchItems: (columnDefs: any, searchItems?: SearchItem[]) => SearchItem[];
10
9
  cascadeColumnFilters: (searchClear: string, columnFilters: ColumnFilter[], searchItems: SearchItem[]) => ColumnFilter[];
11
10
  translate: (operatorList: any[], i18n: I18nService) => any[];
@@ -12,6 +12,11 @@ export interface SearchRow {
12
12
  modelName?: string;
13
13
  search?: Search;
14
14
  }
15
+ export interface SortItem {
16
+ isAsc?: boolean;
17
+ fields?: string[];
18
+ labels?: string[];
19
+ }
15
20
  export interface FieldLabelAction {
16
21
  key?: string;
17
22
  type?: 'mouseenter' | 'mouseleave' | 'click' | 'dblclick';
@@ -21,9 +26,8 @@ export declare class ActionService {
21
26
  modelNameForSearch: import("@angular/core").WritableSignal<String | undefined>;
22
27
  searchList: import("@angular/core").WritableSignal<SearchRow[]>;
23
28
  searchItem: import("@angular/core").WritableSignal<SearchItem | undefined>;
24
- groupItem: import("@angular/core").WritableSignal<SearchItem | undefined>;
25
29
  searchClear: import("@angular/core").WritableSignal<String | undefined>;
26
- groupClear: import("@angular/core").WritableSignal<Boolean | undefined>;
30
+ sortItem: import("@angular/core").WritableSignal<SortItem | undefined>;
27
31
  selectedRows: import("@angular/core").WritableSignal<any[]>;
28
32
  page: import("@angular/core").WritableSignal<Page | undefined>;
29
33
  fieldLabelAction: import("@angular/core").WritableSignal<FieldLabelAction | undefined>;
@@ -37,12 +41,10 @@ export declare class ActionService {
37
41
  searchMonitor(modelName: string | undefined): boolean;
38
42
  setSearchItem(searchItem: SearchItem | undefined): void;
39
43
  getSearchItem(): SearchItem | undefined;
40
- setGroupItem(groupItem: SearchItem | undefined): void;
41
- getGroupItem(): SearchItem | undefined;
42
44
  setSearchClear(searchClear: String | undefined): void;
43
45
  getSearchClear(): String | undefined;
44
- setGroupClear(groupClear: Boolean | undefined): void;
45
- getGroupClear(): Boolean | undefined;
46
+ setSortItem(sortItem: SortItem | undefined): void;
47
+ getSortItem(): SortItem | undefined;
46
48
  setPage(page: Page): void;
47
49
  getPage(): Page | undefined;
48
50
  setFieldLabelAction(key: string, type: 'mouseenter' | 'mouseleave' | 'click' | 'dblclick'): void;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "imm-element-ui",
3
- "version": "0.4.0",
3
+ "version": "0.4.2",
4
4
  "peerDependencies": {
5
5
  "@angular/common": "^18.2.0",
6
6
  "@angular/core": "^18.2.0"
@@ -1,13 +1,3 @@
1
- :host ::ng-deep {
2
- .ms-down .p-button {
3
- border-radius: 6px 0 0 6px;
4
- margin-right: 1px;
5
- }
6
- .ms-up .p-button {
7
- border-radius: 0 6px 6px 0;
8
- margin-left: 1px;
9
- }
10
- }
11
1
  .page-container {
12
2
  color: #334155;
13
3
  }
@@ -1,6 +1,15 @@
1
1
  .btn{
2
- border-radius: var(--p-border-radius-md);
2
+ // border-radius: var(--p-border-radius-md);
3
3
  border: 1px solid rgb(216, 218, 221);
4
+ z-index: 0;
5
+ // border-left: none;
6
+ &:active{
7
+ border-color: var(--p-button-primary-active-border-color);
8
+ z-index: 1
9
+ }
10
+ }
11
+ .not-first{
12
+ margin-left: -0.8px;
4
13
  }
5
14
  .bg {
6
15
  background-color: rgb(230, 242, 243);
@@ -23,5 +32,19 @@
23
32
  color: var(--p-primary-color);
24
33
  }
25
34
  .btn:hover{
26
- background-color: #e7e9ed;
35
+ // background-color: #e7e9ed;
36
+ background-color: var(--p-button-outlined-primary-hover-background);
37
+ }
38
+
39
+ .border-left {
40
+ border-left:1px solid rgb(216, 218, 221);
41
+ }
42
+ .first-btn {
43
+ border-radius:var(--p-border-radius-md) 0 0 var(--p-border-radius-md);
44
+ margin-left: 0 !important;
45
+
46
+ // border-left:1px solid rgb(216, 218, 221);
47
+ }
48
+ .last-btn {
49
+ border-radius:0 var(--p-border-radius-md) var(--p-border-radius-md) 0;
27
50
  }
@@ -1,10 +1,30 @@
1
1
  @import 'styles';
2
- :host ::ng-deep {
3
- .p-inputtext {
4
- font-size: 12px;
2
+ ::ng-deep {
3
+ .s-pop-date-container {
4
+ .p-inputtext {
5
+ font-size: 12px;
6
+ }
7
+ .p-select-sm .p-select-label {
8
+ font-size: 12px;
9
+ }
5
10
  }
6
- .p-select-sm .p-select-label {
7
- font-size: 12px;
11
+ .s-pop-date-select-panel {
12
+ .p-select-option {
13
+ font-size: 12px;
14
+ padding: 0.25rem 0.75rem;
15
+ }
16
+ }
17
+ .s-pop-date-datepicker-panel {
18
+ .p-datepicker-calendar {
19
+ font-size: 12px;
20
+ .p-datepicker-day-view {
21
+ font-size: 12px;
22
+ .p-datepicker-day {
23
+ height: 1.5rem;
24
+ width: 1.5rem;
25
+ }
26
+ }
27
+ }
8
28
  }
9
29
  }
10
30
  .s-pop-date-container {
@@ -1,3 +1,10 @@
1
+ ::ng-deep {
2
+ .s-pop-select-popover {
3
+ .p-popover-content {
4
+ padding: var(--p-select-list-padding);
5
+ }
6
+ }
7
+ }
1
8
  .s-pop-select-container {
2
9
  padding: 5px 0;
3
10
  border-bottom: solid 1px #d6d8db;
@@ -19,15 +26,14 @@
19
26
  cursor: pointer;
20
27
  }
21
28
  .s-pop-select-panel-item-option {
22
- font-size: 14px;
23
- padding: 2px 1rem;
29
+ font-size: 12px;
30
+ padding: 0.25rem 0.75rem;
24
31
  }
25
32
  .s-pop-select-panel-item-option:hover {
26
33
  background-color: var(--p-list-option-focus-background);
27
- border-radius: 6px;
28
34
  cursor: pointer;
29
35
  }
30
36
  .s-pop-select-content {
31
- max-height: 300px;
37
+ max-height: 250px;
32
38
  overflow-y: scroll;
33
39
  }
@@ -1,10 +1,30 @@
1
1
  @import 'styles';
2
- :host ::ng-deep {
3
- .p-inputtext {
4
- font-size: 12px;
2
+ ::ng-deep {
3
+ .s-pop-self-container {
4
+ .p-inputtext {
5
+ font-size: 12px;
6
+ }
7
+ .p-select-sm .p-select-label {
8
+ font-size: 12px;
9
+ }
5
10
  }
6
- .p-select-sm .p-select-label {
7
- font-size: 12px;
11
+ .s-pop-self-select-panel {
12
+ .p-select-option {
13
+ font-size: 12px;
14
+ padding: 0.25rem 0.75rem;
15
+ }
16
+ }
17
+ .s-pop-self-datepicker-panel {
18
+ .p-datepicker-calendar {
19
+ font-size: 12px;
20
+ .p-datepicker-day-view {
21
+ font-size: 12px;
22
+ .p-datepicker-day {
23
+ height: 1.5rem;
24
+ width: 1.5rem;
25
+ }
26
+ }
27
+ }
8
28
  }
9
29
  }
10
30
  .s-pop-self-container {
@@ -1,7 +1,6 @@
1
1
  @import 'styles';
2
2
  .s-pop-sort-container {
3
3
  padding: 5px 0;
4
- border-bottom: solid 1px #d6d8db;
5
4
  }
6
5
  .s-pop-sort-label {
7
6
  padding: 2.5px 1.6rem;
@@ -19,7 +18,9 @@
19
18
  cursor: pointer;
20
19
  }
21
20
  .s-pop-sort-panel {
22
- padding: 6px 0;
21
+ padding: 0 0.4rem;
22
+ overflow-y: scroll;
23
+ max-height: 200px;
23
24
  }
24
25
  .s-pop-sort-panel-show {
25
26
  display: block;
@@ -27,3 +28,22 @@
27
28
  .s-pop-sort-panel-hide {
28
29
  display: none;
29
30
  }
31
+
32
+ .s-check {
33
+ padding: 0 2.5px;
34
+ font-size: 1rem;
35
+ width: 1.5rem;
36
+ line-height: 1;
37
+ display: inline-block;
38
+ }
39
+ .s-pop-sort-item-option {
40
+ font-size: 12px;
41
+ padding: 2px 0;
42
+ }
43
+ .s-pop-sort-item-option:hover {
44
+ background-color: var(--p-list-option-focus-background);
45
+ cursor: pointer;
46
+ }
47
+ .s-pop-sort-item-selected-option {
48
+ color: var(--p-form-field-focus-border-color);
49
+ }
@@ -1,7 +1,10 @@
1
1
  @import 'styles';
2
- ::ng-deep .p-popover-content .s-pop-tree-content {
3
- .p-tree {
4
- padding: 0;
2
+ ::ng-deep {
3
+ .s-pop-tree-popover .p-popover-content {
4
+ padding: var(--p-select-list-padding);
5
+ .s-pop-tree-content .p-tree {
6
+ padding: 0;
7
+ }
5
8
  }
6
9
  }
7
10
  .s-pop-tree-container {
@@ -13,7 +13,7 @@
13
13
  }
14
14
  .s-container {
15
15
  border-right-width: 0;
16
- border-radius: 5px 0 0 5px;
16
+ border-radius: 3.5px 0 0 3.5px;
17
17
  padding: 1.25px 0;
18
18
  width: 100%;
19
19
  }
@@ -35,7 +35,7 @@
35
35
  }
36
36
  .s-dropdown {
37
37
  width: 35px;
38
- border-radius: 0 5px 5px 0;
38
+ border-radius: 0 3.5px 3.5px 0;
39
39
  display: flex;
40
40
  align-items: center;
41
41
  justify-content: center;
@@ -6,20 +6,20 @@
6
6
  margin: 1.25px;
7
7
  display: flex;
8
8
  flex-wrap: nowrap;
9
- border-radius: 5px;
9
+ border-radius: 3.5px;
10
10
  }
11
11
  .s-search-tip-field {
12
12
  padding: 2.5px 5px 1.5px 5px;
13
13
  margin-right: 2.5px;
14
14
  background-color: var(--p-primary-color);
15
- border-radius: 5px 0 0 5px;
15
+ border-radius: 3.5px 0 0 3.5px;
16
16
  color: #fff;
17
17
  }
18
18
  .s-search-tip-icon {
19
19
  padding: 6.5px 6px 0 6px;
20
20
  margin-right: 2.5px;
21
21
  font-size: 11px;
22
- border-radius: 5px 0 0 5px;
22
+ border-radius: 3.5px 0 0 3.5px;
23
23
  color: #fff;
24
24
  }
25
25
  .s-search-tip-icon-filter {
@@ -28,6 +28,9 @@
28
28
  .s-search-tip-icon-group {
29
29
  background-color: var(--p-primary-color);
30
30
  }
31
+ .s-search-tip-sort:hover {
32
+ cursor: pointer;
33
+ }
31
34
  .s-search-tip-title {
32
35
  padding: 2.5px;
33
36
  white-space: nowrap;
@@ -38,7 +41,7 @@
38
41
  }
39
42
  .s-search-tip-close {
40
43
  padding: 6.5px 5px 0 5px;
41
- border-radius: 0 5px 5px 0;
44
+ border-radius: 0 3.5px 3.5px 0;
42
45
  font-size: 11px;
43
46
  }
44
47
  .s-search-tip-close:hover {