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

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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lx-frontend/wrap-element-ui",
3
- "version": "1.0.1-beta.8",
3
+ "version": "1.0.1",
4
4
  "description": "wrap-element-ui",
5
5
  "author": "",
6
6
  "main": "src/components/index.ts",
@@ -4,40 +4,37 @@
4
4
  :title="title"
5
5
  :with-submit-btn="false"
6
6
  :width="360"
7
- @on-change="handleCloseSelectPopup"
7
+ @on-change="handleCloseTechniciansSelectPopup"
8
8
  >
9
9
  <div
10
10
  slot="form"
11
- class="team-setting__members-popover"
11
+ class="team-setting__technicians-popover"
12
12
  >
13
- <div class="team-setting__members-select">
13
+ <div class="team-setting__technicians-select">
14
14
  <el-input
15
- v-model="searchQuery"
15
+ v-model="techniciansSearchQuery"
16
16
  placeholder="请输入姓名"
17
- @input="handleInputSearch(searchQuery, $attrs.keyId)"
17
+ @input="handleInputTechniciansSearch"
18
18
  />
19
19
  </div>
20
20
  <div
21
- v-if="searchQuery && !options.length && !fetchLoading"
22
- class="team-setting__empty-members-options"
21
+ v-if="techniciansSearchQuery && !technicianOptions.length && !fetchTechniciansLoading"
22
+ class="team-setting__empty-technicians-options"
23
23
  >
24
24
  {{ $attrs.empty || '系统未登记该员工,请先添加员工账号' }}
25
25
  </div>
26
26
  <ul
27
27
  v-else
28
- class="team-setting__members-options"
28
+ class="team-setting__technicians-options"
29
29
  >
30
30
  <li
31
- class="team-setting__members-option"
32
- v-for="item in options"
31
+ class="team-setting__technicians-option"
32
+ v-for="item in technicianOptions"
33
33
  :key="item[$attrs.showConfig.id]"
34
34
  >
35
- <div class="team-setting__members-option-left" v-if="isShowRoles">
35
+ <div class="team-setting__technicians-option-left">
36
36
  {{ `${item[$attrs.showConfig.name]} | ${item.roles}` }}
37
37
  </div>
38
- <div class="team-setting__members-option-left" v-else>
39
- {{item[$attrs.showConfig.name]}}
40
- </div>
41
38
  <el-button
42
39
  v-if="item.is_selected"
43
40
  type="text"
@@ -48,7 +45,7 @@
48
45
  <el-button
49
46
  v-else
50
47
  type="text"
51
- @click="handleAdd($attrs.keyId, item)"
48
+ @click="handleAddTechnician($attrs.keyId, item)"
52
49
  >
53
50
  添加
54
51
  </el-button>
@@ -83,31 +80,26 @@ export default {
83
80
  type: String,
84
81
  default: '添加成员',
85
82
  },
86
- /** 角色名称展示 */
87
- isShowRoles: {
88
- type: Boolean,
89
- default: true,
90
- },
91
83
  },
92
84
  data() {
93
85
  return {
94
- searchQuery: '',
86
+ techniciansSearchQuery: '',
95
87
  }
96
88
  },
97
89
  watch: {
98
90
  },
99
91
  methods: {
100
- handleCloseSelectPopup(show) {
92
+ handleCloseTechniciansSelectPopup(show) {
101
93
  if (show) return;
102
- this.searchQuery = '';
103
- this.$emit('update:options', []);
94
+ this.techniciansSearchQuery = '';
95
+ this.$emit('update:technicianOptions', []);
104
96
  },
105
- handleInputSearch(query, keyId) {
106
- this.$emit('fetchMethods', { query, keyId });
97
+ handleInputTechniciansSearch(query) {
98
+ this.$emit('fetchTechniciansMethods', query);
107
99
  },
108
- handleAdd(id, item) {
100
+ handleAddTechnician(id, item) {
109
101
  const query = { id, item };
110
- this.$emit('handleAdd', query);
102
+ this.$emit('handleAddTechnician', query);
111
103
  },
112
104
  },
113
105
  };
@@ -115,25 +107,25 @@ export default {
115
107
 
116
108
  <style lang="less">
117
109
  .team-setting {
118
- &__members-popover {
119
- padding: 20px 0;
120
- margin: 0 20px;
110
+ &__technicians-popover {
111
+ padding: 20px;
121
112
  height: 350px;
122
113
  overflow-y: auto;
123
114
  }
124
- &__empty-members {
125
- &-options {
126
- font-size: 12px;
127
- color: #80838e;
128
- text-align: center;
129
- margin-top: 10px;
130
- }
115
+ &__technicians-select {
116
+ width: 320px;
117
+ }
118
+ &__empty-technicians-options {
119
+ font-size: 12px;
120
+ color: #80838e;
121
+ text-align: center;
122
+ margin-top: 10px;
131
123
  }
132
- &__members-options {
124
+ &__technicians-options {
133
125
  display: flex;
134
126
  flex-direction: column;
135
127
  }
136
- &__members-option {
128
+ &__technicians-option {
137
129
  display: flex;
138
130
  justify-content: space-between;
139
131
  align-items: center;
@@ -1,17 +1,7 @@
1
- import usePagination from './usePagination';
2
- import useCellHover from './useCellHover';
3
- import useViewSetting from './useViewSetting';
4
- import useRowBgColor from './useRowBgColor';
5
- import useDefaultOperation from './useDefaultOperation';
6
- import useColumnHeaderOperation from './useColumnHeaderOperation';
7
- import useDragSort from './useDragSort';
8
-
9
- export {
10
- usePagination,
11
- useCellHover,
12
- useViewSetting,
13
- useRowBgColor,
14
- useDefaultOperation,
15
- useColumnHeaderOperation,
16
- useDragSort,
17
- }
1
+ export * from './usePagination';
2
+ export * from './useCellHover';
3
+ export * from './useViewSetting';
4
+ export * from './useRowBgColor';
5
+ export * from './useDefaultOperation';
6
+ export * from './useColumnHeaderOperation';
7
+ export * from './useDragSort';
@@ -2,7 +2,7 @@ import debounce from 'lodash/debounce';
2
2
  import throttle from 'lodash/throttle';
3
3
  import { onBeforeUnmount, onMounted, ref } from 'vue'
4
4
 
5
- export default function useCellHover(tableDomRef) {
5
+ export function useCellHover(tableDomRef) {
6
6
 
7
7
  // 鼠标悬浮的行
8
8
  const hoveringCellInfo = ref<{
@@ -9,7 +9,7 @@ interface IUseColumnHeaderOperationParams {
9
9
  showingColumns: Ref<string[]>
10
10
  }
11
11
 
12
- export default function useColumnHeaderOperation({ props, tableDomRef, sortFilterPopoverRef, emit, showingColumns }: IUseColumnHeaderOperationParams) {
12
+ export function useColumnHeaderOperation({ props, tableDomRef, sortFilterPopoverRef, emit, showingColumns }: IUseColumnHeaderOperationParams) {
13
13
 
14
14
  // column如果有sortable属性,点击列头部,会直接触发排序,为了在弹窗点确定时再触发排序,需要阻止点击立即排序
15
15
  // 所以,初始渲染时,将sortable设置为false,在触发排序逻辑时再设置成真实的值,再利用el-table自身的排序逻辑触发排序
@@ -9,7 +9,7 @@ interface IParams {
9
9
  hasExpandRow: boolean
10
10
  }
11
11
 
12
- export default function useDefaultOperation({ emit, pageSize, props, tableDomRef, hasExpandRow }: IParams) {
12
+ export function useDefaultOperation({ emit, pageSize, props, tableDomRef, hasExpandRow }: IParams) {
13
13
  const operationPopoverRef = ref<any>(null);
14
14
  const editingRowData = ref<Record<string, any>>({});
15
15
  const editingRowIndex = ref<number>(-1);
@@ -11,7 +11,7 @@ interface IUseDragSortParams {
11
11
  pageSize: Ref<number>
12
12
  tableDomRef: Ref<any>
13
13
  }
14
- export default function useDragSort({ props, emit, viewSettingDragSortOptions, pageSize, beforeDragStart, currScope, tableDomRef }: IUseDragSortParams) {
14
+ export function useDragSort({ props, emit, viewSettingDragSortOptions, pageSize, beforeDragStart, currScope, tableDomRef }: IUseDragSortParams) {
15
15
 
16
16
  const draggingData = ref<IDraggingData>({}); // 拖拽相关数据
17
17
  const isMouseDown = ref(false);
@@ -6,7 +6,7 @@ interface IParams {
6
6
  beforePageChange: () => void
7
7
  }
8
8
 
9
- export default function usePagination({ emit, beforePageChange }: IParams) {
9
+ export function usePagination({ emit, beforePageChange }: IParams) {
10
10
 
11
11
  const pageSize = ref(10);
12
12
 
@@ -5,7 +5,7 @@ interface IUseRowBgColorParams {
5
5
  emit: IEmits;
6
6
  }
7
7
 
8
- export default function useRowBgColor({ colorList, emit }: IUseRowBgColorParams) {
8
+ export function useRowBgColor({ colorList, emit }: IUseRowBgColorParams) {
9
9
  const isDefaultColor = (id: number) => {
10
10
  if (!id) {
11
11
  // 没有颜色id,则认为是默认色
@@ -14,7 +14,7 @@ interface IViewSettingParams {
14
14
  }
15
15
  }
16
16
 
17
- export default function useViewSetting({
17
+ export function useViewSetting({
18
18
  showingColumns,
19
19
  actualColumns,
20
20
  props,