@lx-frontend/wrap-element-ui 1.0.2-beta.6 → 1.0.2-beta.8

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 (8) hide show
  1. package/package.json +1 -1
  2. package/src/components/EditableTable/bizHooks/useDragSort.ts +2 -2
  3. package/src/components/EditableTable/features/bizColorSelect.vue +1 -1
  4. package/src/components/EditableTable/features/bizTableHeaderPopover.vue +25 -25
  5. package/src/components/EditableTable/features/bizTableOperatePopover.vue +7 -7
  6. package/src/components/EditableTable/features/bizViewSettingDialog.vue +17 -17
  7. package/src/components/EditableTable/index.less +11 -11
  8. package/src/components/EditableTable/index.vue +7 -7
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lx-frontend/wrap-element-ui",
3
- "version": "1.0.2-beta.6",
3
+ "version": "1.0.2-beta.8",
4
4
  "description": "wrap-element-ui",
5
5
  "author": "",
6
6
  "main": "src/components/index.ts",
package/src/components/EditableTable/bizHooks/useDragSort.ts CHANGED
@@ -46,7 +46,7 @@ export function useDragSort({ props, emit, viewSettingDragSortOptions, pageSize,
46
46
  handleDragMouseDown(e, +target.dataset.index);
47
47
  }
48
48
 
49
- if ([...target.classList].includes('editable-table__view-setting-drag-target')) {
49
+ if ([...target.classList].includes('editable-table-view-setting-drag-target')) {
50
50
  dragType.value = 'view-setting';
51
51
  // 处理显示设置拖拽
52
52
  handleViewSettingDragMouseDown(e, +target.dataset.index);
@@ -208,7 +208,7 @@ export function useDragSort({ props, emit, viewSettingDragSortOptions, pageSize,
208
208
  }
209
209
 
210
210
  const handleViewSettingDragMouseDown = (event, index) => {
211
- const rowDoms = [...document.getElementsByClassName('editable-table__view-setting-draggable-item')]
211
+ const rowDoms = [...document.getElementsByClassName('editable-table-view-setting-draggable-item')]
212
212
  .reduce((pre, item, index) => ({ ...pre, [index]: [item] }), {});
213
213
  draggingData.value.isDragging = true;
214
214
  draggingData.value.rowDoms = rowDoms;
package/src/components/EditableTable/features/bizColorSelect.vue CHANGED
@@ -4,7 +4,7 @@
4
4
  v-model="visible"
5
5
  placement="right"
6
6
  trigger="click"
7
- popper-class="editable-table__color-popover"
7
+ popper-class="editable-table-color-popover"
8
8
  >
9
9
  <div class="color-list">
10
10
  <div
package/src/components/EditableTable/features/bizTableHeaderPopover.vue CHANGED
@@ -3,7 +3,7 @@
3
3
  ref="popoverRef"
4
4
  placement="bottom"
5
5
  trigger="click"
6
- popper-class="editable-table__sort-filter"
6
+ popper-class="editable-table-sort-filter"
7
7
  :data-prop="column.prop"
8
8
  @show="() => emit('popover-show')"
9
9
  >
@@ -14,26 +14,26 @@
14
14
  <div :class="['editable-table__sort-icon', headActive && 'editable-table__sort-icon--active']" />
15
15
  </span>
16
16
  </template>
17
- <div class="editable-table__sort-filter">
18
- <div class="editable-table__sort-filter__column-title">
17
+ <div class="editable-table-sort-filter">
18
+ <div class="editable-table-sort-filter__column-title">
19
19
  {{ column.label }}
20
20
  </div>
21
21
  <div
22
22
  v-if="column.isColumnSortable"
23
- class="editable-table__sort-filter__sort"
23
+ class="editable-table-sort-filter__sort"
24
24
  >
25
- <div class="editable-table__sort-filter__sort-title">
25
+ <div class="editable-table-sort-filter__sort-title">
26
26
  排序
27
27
  </div>
28
- <div class="editable-table__sort-filter__sort-btns">
28
+ <div class="editable-table-sort-filter__sort-btns">
29
29
  <el-button
30
- :class="['editable-table__sort-filter__sort-btn', tempSortingColumn?.prop === column.prop && tempSortType === 'ascending' && 'editable-table__sort-filter__sort-btn--active']"
30
+ :class="['editable-table-sort-filter__sort-btn', tempSortingColumn?.prop === column.prop && tempSortType === 'ascending' && 'editable-table-sort-filter__sort-btn--active']"
31
31
  @click="() => emit('update:sort', 'ascending')"
32
32
  >
33
33
  升序
34
34
  </el-button>
35
35
  <el-button
36
- :class="['editable-table__sort-filter__sort-btn', tempSortingColumn?.prop === column.prop && tempSortType === 'descending' && 'editable-table__sort-filter__sort-btn--active']"
36
+ :class="['editable-table-sort-filter__sort-btn', tempSortingColumn?.prop === column.prop && tempSortType === 'descending' && 'editable-table-sort-filter__sort-btn--active']"
37
37
  @click="() => emit('update:sort', 'descending')"
38
38
  >
39
39
  降序
@@ -42,13 +42,13 @@
42
42
  </div>
43
43
  <div
44
44
  v-if="column.search && !Array.isArray(column.search)"
45
- class="editable-table__sort-filter__search"
45
+ class="editable-table-sort-filter__search"
46
46
  >
47
- <div class="editable-table__sort-filter__search-title">
47
+ <div class="editable-table-sort-filter__search-title">
48
48
  搜索
49
49
  </div>
50
50
  <el-input
51
- class="editable-table__sort-filter__search-input"
51
+ class="editable-table-sort-filter__search-input"
52
52
  placeholder="请输入内容"
53
53
  :value="tempSearchValue[column.prop]"
54
54
  @input="val => emit('update:tempSearchValue', column.prop, val)"
@@ -57,18 +57,18 @@
57
57
 
58
58
  <div
59
59
  v-if="column.search && Array.isArray(column.search)"
60
- class="editable-table__sort-filter__search"
60
+ class="editable-table-sort-filter__search"
61
61
  style="display: flex;flex-direction: column;gap: 12px;"
62
62
  >
63
63
  <div
64
64
  v-for="item in column.search"
65
65
  :key="item.prop"
66
66
  >
67
- <div class="editable-table__sort-filter__search-title">
67
+ <div class="editable-table-sort-filter__search-title">
68
68
  {{ item.label }}
69
69
  </div>
70
70
  <el-input
71
- class="editable-table__sort-filter__search-input"
71
+ class="editable-table-sort-filter__search-input"
72
72
  placeholder="请输入内容"
73
73
  :value="tempSearchValue[item.prop]"
74
74
  @input="val => emit('update:tempSearchValue', item.prop, val)"
@@ -78,14 +78,14 @@
78
78
 
79
79
  <div
80
80
  v-if="column.filters && ((Array.isArray(column.filters) ? column.filters : column.filters.options).length > 0)"
81
- class="editable-table__sort-filter__filter"
81
+ class="editable-table-sort-filter__filter"
82
82
  >
83
- <div class="editable-table__sort-filter__filter-title">
83
+ <div class="editable-table-sort-filter__filter-title">
84
84
  筛选
85
85
  </div>
86
86
  <el-checkbox-group
87
87
  v-if="column.filters && (Array.isArray(column.filters) || column.filters.type === 'checkbox')"
88
- class="editable-table__sort-filter__filter-checkbox-group"
88
+ class="editable-table-sort-filter__filter-checkbox-group"
89
89
  :value="tempFilteredValue[column.prop]"
90
90
  @input="val => emit('update:tempFilteredValue', column.prop, val)"
91
91
  >
@@ -93,7 +93,7 @@
93
93
  v-for="item in (Array.isArray(column.filters) ? column.filters : column.filters.options)"
94
94
  :key="item.value"
95
95
  :label="item.value"
96
- class="editable-table__sort-filter__filter-checkbox"
96
+ class="editable-table-sort-filter__filter-checkbox"
97
97
  >
98
98
  <slot
99
99
  name="filter-item"
@@ -126,19 +126,19 @@
126
126
  </div>
127
127
  <div
128
128
  v-if="column.summary"
129
- class="editable-table__sort-filter__filter"
129
+ class="editable-table-sort-filter__filter"
130
130
  >
131
- <div class="editable-table__sort-filter__filter-title">
131
+ <div class="editable-table-sort-filter__filter-title">
132
132
  统计
133
133
  </div>
134
134
  <el-checkbox-group
135
- class="editable-table__sort-filter__filter-checkbox-group"
135
+ class="editable-table-sort-filter__filter-checkbox-group"
136
136
  :value="tempSummaryList"
137
137
  @input="val => emit('update:tempSummaryList', val)"
138
138
  >
139
139
  <el-checkbox
140
140
  :label="column.prop"
141
- class="editable-table__sort-filter__filter-checkbox"
141
+ class="editable-table-sort-filter__filter-checkbox"
142
142
  >
143
143
  <slot
144
144
  name="summay-item"
@@ -149,15 +149,15 @@
149
149
  </el-checkbox>
150
150
  </el-checkbox-group>
151
151
  </div>
152
- <div class="editable-table__sort-filter__footer">
152
+ <div class="editable-table-sort-filter__footer">
153
153
  <el-button
154
- class="editable-table__sort-filter__reset-btn"
154
+ class="editable-table-sort-filter__reset-btn"
155
155
  @click="() => emit('reset')"
156
156
  >
157
157
  重置
158
158
  </el-button>
159
159
  <el-button
160
- class="editable-table__sort-filter__confirm-btn"
160
+ class="editable-table-sort-filter__confirm-btn"
161
161
  type="primary"
162
162
  @click="() => emit('confirm')"
163
163
  >
package/src/components/EditableTable/features/bizTableOperatePopover.vue CHANGED
@@ -3,34 +3,34 @@
3
3
  ref="operationPopoverRef"
4
4
  placement="bottom"
5
5
  trigger="click"
6
- popper-class="editable-table__operation-popover"
6
+ popper-class="editable-table-operation-popover"
7
7
  >
8
8
  <div
9
9
  slot="reference"
10
- class="editable-table__operation-popover__operation-reference btn-pointer"
10
+ class="editable-table-operation-popover__operation-reference btn-pointer"
11
11
  >
12
- <el-button :class="['editable-table__operation-popover__operation-btn', hoveringCellInfo.rowIndex === scope.$index && 'editable-table__operation-popover__operation-btn--active']">
12
+ <el-button :class="['editable-table-operation-popover__operation-btn', hoveringCellInfo.rowIndex === scope.$index && 'editable-table-operation-popover__operation-btn--active']">
13
13
  操作
14
14
  </el-button>
15
15
  </div>
16
- <div class="editable-table__operation-popover__operation">
16
+ <div class="editable-table-operation-popover__operation">
17
17
  <div
18
18
  v-if="defaultOperations.includes('delete')"
19
- class="editable-table__operation-popover__operation-item btn-pointer"
19
+ class="editable-table-operation-popover__operation-item btn-pointer"
20
20
  @click="() => emit('delete')"
21
21
  >
22
22
  删除
23
23
  </div>
24
24
  <div
25
25
  v-if="defaultOperations.includes('edit')"
26
- class="editable-table__operation-popover__operation-item btn-pointer"
26
+ class="editable-table-operation-popover__operation-item btn-pointer"
27
27
  @click="() => emit('edit')"
28
28
  >
29
29
  编辑
30
30
  </div>
31
31
  <div
32
32
  v-if="defaultOperations.includes('top')"
33
- class="editable-table__operation-popover__operation-item btn-pointer"
33
+ class="editable-table-operation-popover__operation-item btn-pointer"
34
34
  @click="() => emit('rowPinToTop')"
35
35
  >
36
36
  置顶
package/src/components/EditableTable/features/bizViewSettingDialog.vue CHANGED
@@ -6,11 +6,11 @@
6
6
  top="12vh"
7
7
  :close-on-click-modal="false"
8
8
  append-to-body
9
- custom-class="editable-table__view-setting__dialog"
9
+ custom-class="editable-table-view-setting__dialog"
10
10
  >
11
- <div class="editable-table__view-setting__content">
12
- <div class="editable-table__view-setting__content-left">
13
- <div class="editable-table__view-setting__checkbox-wrapper">
11
+ <div class="editable-table-view-setting__content">
12
+ <div class="editable-table-view-setting__content-left">
13
+ <div class="editable-table-view-setting__checkbox-wrapper">
14
14
  <el-checkbox-group v-model="columnsToBeShown">
15
15
  <el-checkbox
16
16
  v-for="item in props.columnConfig"
@@ -18,51 +18,51 @@
18
18
  :label="item.prop"
19
19
  :disabled="item.isAlwaysShow"
20
20
  >
21
- <div class="editable-table__view-setting__content-left-item">
21
+ <div class="editable-table-view-setting__content-left-item">
22
22
  {{ item.label }}
23
23
  </div>
24
24
  </el-checkbox>
25
25
  </el-checkbox-group>
26
26
  </div>
27
27
  </div>
28
- <div class="editable-table__view-setting__content-right">
29
- <div class="editable-table__view-setting__content-right-title">
28
+ <div class="editable-table-view-setting__content-right">
29
+ <div class="editable-table-view-setting__content-right-title">
30
30
  已选择
31
- <div class="editable-table__view-setting__selected-count">
31
+ <div class="editable-table-view-setting__selected-count">
32
32
  {{ columnsToBeShown.length }}
33
33
  </div>
34
34
  </div>
35
- <div class="editable-table__view-setting__content-right-frize">
35
+ <div class="editable-table-view-setting__content-right-frize">
36
36
  冻结前
37
37
  <el-input
38
- class="editable-table__view-setting__content-right-input"
38
+ class="editable-table-view-setting__content-right-input"
39
39
  :value="tempLeftFixedColumnCount"
40
40
  @input="handleInputTempLeftFixedColumnCount"
41
41
  />
42
42
  列
43
43
  </div>
44
- <div class="editable-table__view-setting__content-right-selected">
44
+ <div class="editable-table-view-setting__content-right-selected">
45
45
  <div
46
46
  v-for="(item, index) in viewSettingDragSortOptions"
47
47
  :key="item.prop"
48
- class="editable-table__view-setting__selected-item editable-table__view-setting-draggable-item"
48
+ class="editable-table-view-setting__selected-item editable-table-view-setting-draggable-item"
49
49
  >
50
- <div class="editable-table__view-setting__selected-item-left">
50
+ <div class="editable-table-view-setting__selected-item-left">
51
51
  <div
52
- class="editable-table__view-setting-drag-target editable-table__view-setting__icon-wrapper"
52
+ class="editable-table-view-setting-drag-target editable-table-view-setting__icon-wrapper"
53
53
  :data-index="index"
54
54
  >
55
55
  <div
56
- class="editable-table__view-setting-drag-target editable-table-drag-icon"
56
+ class="editable-table-view-setting-drag-target editable-table-drag-icon"
57
57
  :data-index="index"
58
58
  />
59
59
  </div>
60
- <div class="editable-table__view-setting__selected-item-name">
60
+ <div class="editable-table-view-setting__selected-item-name">
61
61
  {{ item.label }}
62
62
  </div>
63
63
  </div>
64
64
  <div
65
- :class="['editable-table__view-setting__selected-item-close', item.isAlwaysShow ? 'editable-table__view-setting__selected-item-close--disabled' : '']"
65
+ :class="['editable-table-view-setting__selected-item-close', item.isAlwaysShow ? 'editable-table-view-setting__selected-item-close--disabled' : '']"
66
66
  @click="handleColumnClose(item)"
67
67
  >
68
68
  <i class="el-icon-close" />
package/src/components/EditableTable/index.less CHANGED
@@ -139,7 +139,7 @@
139
139
  }
140
140
  }
141
141
 
142
- &__view-setting {
142
+ &-view-setting {
143
143
  &__btn-wrapper {
144
144
  display: flex;
145
145
  justify-content: flex-end;
@@ -349,7 +349,7 @@
349
349
  }
350
350
  }
351
351
 
352
- &__color-popover {
352
+ &-color-popover {
353
353
  min-width: 102px !important;
354
354
  width: 102px !important;
355
355
  padding: 0 !important;
@@ -374,7 +374,7 @@
374
374
  }
375
375
  }
376
376
 
377
- &__sort-filter {
377
+ &-sort-filter {
378
378
  padding: 0 !important;
379
379
  width: 258px;
380
380
 
@@ -438,15 +438,15 @@
438
438
  &:hover {
439
439
  background-color: #fafafa;
440
440
  }
441
+ }
441
442
 
442
- &--active {
443
- color: @--theme-blue--;
444
- border-color: #eef3ff;
445
- background: #f4f7fe;
443
+ &__sort-btn--active.el-button {
444
+ color: @--theme-blue--;
445
+ border-color: #eef3ff;
446
+ background: #f4f7fe;
446
447
 
447
- &:hover {
448
- background-color: #f4f7fe;
449
- }
448
+ &:hover {
449
+ background-color: #f4f7fe;
450
450
  }
451
451
  }
452
452
 
@@ -600,7 +600,7 @@
600
600
  }
601
601
  }
602
602
 
603
- &__operation-popover {
603
+ &-operation-popover {
604
604
  min-width: 120px;
605
605
  padding: 0;
606
606
 
package/src/components/EditableTable/index.vue CHANGED
@@ -1,16 +1,16 @@
1
1
  <template>
2
2
  <div class="editable-table">
3
- <div class="editable-table__view-setting">
3
+ <div class="editable-table-view-setting">
4
4
  <div
5
5
  v-if="!hideViewSettingBtn"
6
- class="editable-table__view-setting__btn-wrapper"
6
+ class="editable-table-view-setting__btn-wrapper"
7
7
  >
8
8
  <div
9
- class="editable-table__view-setting__btn btn-pointer"
9
+ class="editable-table-view-setting__btn btn-pointer"
10
10
  @click="handleViewSettingShow"
11
11
  >
12
12
  <i class="el-icon-setting" />
13
- <div class="editable-table__view-setting__btn-text">
13
+ <div class="editable-table-view-setting__btn-text">
14
14
  显示设置
15
15
  </div>
16
16
  </div>
@@ -186,16 +186,16 @@
186
186
 
187
187
  <div
188
188
  v-else
189
- class="editable-table__operation-popover__save-cancel"
189
+ class="editable-table-operation-popover__save-cancel"
190
190
  >
191
191
  <div
192
- class="btn-pointer editable-table__operation-popover__btn"
192
+ class="btn-pointer editable-table-operation-popover__btn"
193
193
  @click="handleEditSave(scope.row)"
194
194
  >
195
195
  保存
196
196
  </div>
197
197
  <div
198
- class="btn-pointer editable-table__operation-popover__btn"
198
+ class="btn-pointer editable-table-operation-popover__btn"
199
199
  @click="handleEditCancel(scope.row)"
200
200
  >
201
201
  取消