@eturnity/eturnity_reusable_components 6.46.5-EPDM-8599.0 → 6.46.5-qa-16-11.27

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": "@eturnity/eturnity_reusable_components",
3
- "version": "6.46.5-EPDM-8599.0",
3
+ "version": "6.46.5-qa-16-11.27",
4
4
  "private": false,
5
5
  "scripts": {
6
6
  "dev": "vue-cli-service serve",
package/src/App.vue CHANGED
@@ -114,7 +114,6 @@ import iconCollection from '@/components/icon/iconCollection'
114
114
  import dropdownComponent from '@/components/dropdown'
115
115
  import videoThumbnail from '@/components/videoThumbnail'
116
116
  import icon from '@/components/icon'
117
- import infoCard from '@/components/infoCard'
118
117
  // import TableDropdown from "@/components/tableDropdown"
119
118
 
120
119
  const PageContainer = styled.div`
@@ -139,8 +138,7 @@ export default {
139
138
  iconCollection,
140
139
  dropdownComponent,
141
140
  videoThumbnail,
142
- icon,
143
- infoCard
141
+ icon
144
142
  },
145
143
  data() {
146
144
  return {
@@ -40,7 +40,10 @@
40
40
  v-for="(item, idx) in filterData"
41
41
  :key="idx + '_filterdata'"
42
42
  >
43
- <column-title :showBorder="idx + 1 !== filterData.length">
43
+ <column-title
44
+ :showBorder="idx + 1 !== filterData.length"
45
+ :data-id="`filter_label_project_view_file_manager_${item.type}`"
46
+ >
44
47
  {{ item.columnName }}
45
48
  </column-title>
46
49
  <row-container v-if="item.type === 'columns'">
@@ -88,13 +91,12 @@
88
91
  selectHeight="36px"
89
92
  fontSize="13px"
90
93
  :label="filter.label"
94
+ :labelDataId="filter.dataId"
91
95
  alignItems="vertical"
92
96
  :disabled="!filter.choices.length"
93
97
  >
94
98
  <template #selector>
95
- <option-title>
96
- {{ filter.selectedText }}
97
- </option-title>
99
+ <option-title> {{ filter.selectedText }} </option-title>
98
100
  </template>
99
101
  <template #dropdown>
100
102
  <dropdown-checkbox-container @click.stop>
@@ -117,7 +119,7 @@
117
119
  </template>
118
120
  </select-component>
119
121
  <section-container v-else-if="isRangeSelector(filter.filter_type)">
120
- <row-label>{{ filter.label }}</row-label>
122
+ <row-label :data-id="filter.dataId">{{ filter.label }}</row-label>
121
123
  <grid-container>
122
124
  <input-number
123
125
  :placeholder="
@@ -165,7 +167,7 @@
165
167
  v-else-if="isDateSelector(filter.filter_type)"
166
168
  @click.stop
167
169
  >
168
- <row-label>{{ filter.label }}</row-label>
170
+ <row-label :data-id="filter.dataId">{{ filter.label }}</row-label>
169
171
  <grid-container>
170
172
  <date-picker-input
171
173
  :placeholder="$gettext('Date from')"
@@ -13,7 +13,7 @@
13
13
  </label-slot-wrapper>
14
14
 
15
15
  <label-wrapper v-if="labelText">
16
- <label-text :labelFontColor="labelFontColor">
16
+ <label-text :labelFontColor="labelFontColor" :data-id="labelDataId">
17
17
  {{ labelText }}
18
18
  </label-text>
19
19
  <info-text
@@ -53,6 +53,7 @@
53
53
  :hasLabelSlot="hasLabelSlot"
54
54
  :slotSize="slotSize"
55
55
  :showLinearUnitName="showLinearUnitName"
56
+ :data-id="inputDataId"
56
57
  />
57
58
  <slot-container v-if="hasSlot" :slotSize="slotSize" :isError="isError">
58
59
  <slot></slot>
@@ -437,6 +438,14 @@ export default {
437
438
  focus: {
438
439
  required: false,
439
440
  default: false
441
+ },
442
+ labelDataId: {
443
+ required: false,
444
+ default: ''
445
+ },
446
+ inputDataId: {
447
+ required: false,
448
+ default: ''
440
449
  }
441
450
  },
442
451
  computed: {
@@ -5,9 +5,15 @@
5
5
  :alignItems="alignItems"
6
6
  >
7
7
  <label-wrapper v-if="label">
8
- <input-label :labelFontColor="labelFontColor" :fontSize="fontSize">{{
9
- label
10
- }} <optionalLabel v-if="labelOptional">({{ $gettext('Optional') }})</optionalLabel></input-label>
8
+ <input-label
9
+ :labelFontColor="labelFontColor"
10
+ :fontSize="fontSize"
11
+ :dataId="labelDataId"
12
+ >{{ label }}
13
+ <optionalLabel v-if="labelOptional"
14
+ >({{ $gettext('Optional') }})</optionalLabel
15
+ ></input-label
16
+ >
11
17
  <info-text
12
18
  v-if="infoTextMessage"
13
19
  :text="infoTextMessage"
@@ -38,6 +44,7 @@
38
44
  :hasFocus="hasFocus"
39
45
  :backgroundColor="backgroundColor"
40
46
  :disabledBackgroundColor="disabledBackgroundColor"
47
+ :dataId="inputDataId"
41
48
  />
42
49
  <icon-wrapper
43
50
  v-if="inputType === 'password' && !isError"
@@ -310,6 +317,14 @@ export default {
310
317
  },
311
318
  borderColor: {
312
319
  required: false
320
+ },
321
+ labelDataId: {
322
+ required: false,
323
+ default: ''
324
+ },
325
+ inputDataId: {
326
+ required: false,
327
+ default: ''
313
328
  }
314
329
  },
315
330
  methods: {
@@ -11,6 +11,7 @@
11
11
  :inputWidth="inputWidth"
12
12
  :isFilter="isFilter"
13
13
  :hasFocus="hasFocus"
14
+ :dataId="dataId"
14
15
  />
15
16
  <img
16
17
  class="search-icn"
@@ -30,6 +31,7 @@
30
31
  // inputWidth="250px"
31
32
  // @on-change="function($event)"
32
33
  // :isFilter="true" // to set the height at 30px
34
+ // dataId="test-data-id"
33
35
  // />
34
36
  import styled from 'vue-styled-components'
35
37
 
@@ -104,6 +106,10 @@ export default {
104
106
  hasFocus: {
105
107
  required: false,
106
108
  default: false
109
+ },
110
+ dataId: {
111
+ required: false,
112
+ default: ''
107
113
  }
108
114
  },
109
115
  methods: {
@@ -8,7 +8,7 @@
8
8
  :hasLabel="!!label && label.length > 0"
9
9
  :alignItems="alignItems"
10
10
  >
11
- <label-wrapper v-if="label">
11
+ <label-wrapper v-if="label" :data-id="labelDataId">
12
12
  <input-label
13
13
  :fontColor="
14
14
  labelFontColor || colorMode == 'dark' ? 'white' : 'eturnityGrey'
@@ -121,6 +121,7 @@
121
121
  // optionWidth="50%"
122
122
  // label="that is a label"
123
123
  // alignItems="vertical"
124
+ // label-data-id="test-data-id"
124
125
  // >
125
126
  // <template #selector="{selectedValue}">
126
127
  // value selected: {{selectedValue}}
@@ -304,6 +305,10 @@ export default {
304
305
  required: false,
305
306
  default: false
306
307
  },
308
+ labelDataId: {
309
+ required: false,
310
+ default: ''
311
+ },
307
312
  infoTextMessage: {
308
313
  required: false
309
314
  },
@@ -408,7 +413,7 @@ export default {
408
413
  isActive: false,
409
414
  textSearch: '',
410
415
  hoveredIndex: 0,
411
- hoveredValue:null,
416
+ hoveredValue: null,
412
417
  isClickOutsideActive: false
413
418
  }
414
419
  },
@@ -447,7 +452,7 @@ export default {
447
452
  this.$emit('input-change', e)
448
453
  },
449
454
  optionHovered(e) {
450
- this.hoveredValue=e
455
+ this.hoveredValue = e
451
456
  },
452
457
  mouseEnterHandler() {
453
458
  if (this.hoverDropdown) {
@@ -502,14 +507,16 @@ export default {
502
507
  },
503
508
  onArrowPress(dir) {
504
509
  let newHoveredElem
505
- const currentHoveredElem=this.$refs.dropdown.$el.querySelector(`[data-value="${this.hoveredValue}"]`);
506
- if(currentHoveredElem){
507
- if(dir>0){
508
- newHoveredElem=currentHoveredElem.nextElementSibling
509
- }else{
510
- newHoveredElem=currentHoveredElem.previousElementSibling
510
+ const currentHoveredElem = this.$refs.dropdown.$el.querySelector(
511
+ `[data-value="${this.hoveredValue}"]`
512
+ )
513
+ if (currentHoveredElem) {
514
+ if (dir > 0) {
515
+ newHoveredElem = currentHoveredElem.nextElementSibling
516
+ } else {
517
+ newHoveredElem = currentHoveredElem.previousElementSibling
511
518
  }
512
- if(newHoveredElem){
519
+ if (newHoveredElem) {
513
520
  this.hoveredValue = newHoveredElem.getAttribute('data-value')
514
521
  const topPos = newHoveredElem.offsetTop
515
522
  this.$refs.dropdown.$el.scrollTop = topPos
@@ -5,7 +5,9 @@
5
5
  :hasLabel="label && label.length > 0"
6
6
  >
7
7
  <label-wrapper v-if="label">
8
- <input-label :fontSize="fontSize">{{ label }}</input-label>
8
+ <input-label :fontSize="fontSize" :data-id="labelDataId">{{
9
+ label
10
+ }}</input-label>
9
11
  <info-text
10
12
  v-if="infoTextMessage"
11
13
  :text="infoTextMessage"
@@ -27,6 +29,7 @@
27
29
  :disabled="isDisabled"
28
30
  @input="onChangeHandler"
29
31
  :resize="resize"
32
+ :data-id="inputDataId"
30
33
  />
31
34
  </input-container>
32
35
  </input-wrapper>
@@ -181,6 +184,14 @@ export default {
181
184
  resize: {
182
185
  required: false,
183
186
  default: 'none'
187
+ },
188
+ labelDataId: {
189
+ required: false,
190
+ default: ''
191
+ },
192
+ inputDataId: {
193
+ required: false,
194
+ default: ''
184
195
  }
185
196
  },
186
197
  methods: {
@@ -1,38 +0,0 @@
1
- <template>
2
- <info-container>
3
- <icon name="info" size="24px" />
4
- <InfoTextContainer>
5
- <slot />
6
- </InfoTextContainer>
7
- </info-container>
8
- </template>
9
-
10
- <script>
11
- import styled from 'vue-styled-components'
12
- import icon from '../icon'
13
- const InfoContainer = styled('div')`
14
- display: flex;
15
- align-items: flex-start;
16
- gap: 15px;
17
- padding: 20px;
18
- width: 500px;
19
- min-width: 450px;
20
- border: 1px dashed #dee2eb;
21
- border-radius: 4px;
22
- margin:20px 0;
23
- `
24
-
25
- const InfoTextContainer = styled('div')`
26
- font-size: 13px;
27
- `
28
-
29
-
30
- export default {
31
- components:{
32
- icon,
33
- InfoTextContainer,
34
- InfoContainer
35
- },
36
- props:[]
37
- }
38
- </script>