@eturnity/eturnity_reusable_components 1.1.75 → 1.1.78

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 (2) hide show
  1. package/package.json +1 -1
  2. package/src/components/tableDropdown/index.vue +75 -59
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@eturnity/eturnity_reusable_components",
3
- "version": "1.1.75",
3
+ "version": "1.1.78",
4
4
  "private": false,
5
5
  "scripts": {
6
6
  "dev": "vue-cli-service serve",
package/src/components/tableDropdown/index.vue CHANGED
@@ -1,14 +1,11 @@
1
1
  <template>
2
2
  <dropdown-row
3
- :colspan="isNested ? colSpan + 1 : colSpan"
3
+ :colspan="colSpan"
4
4
  :isOpen="isOpen"
5
5
  @click="toggleOpen"
6
6
  :disabled="disabled"
7
7
  >
8
- <component-container
9
- :colSpan="isNested ? colSpan : colSpan - 1"
10
- class="table-dropdown"
11
- >
8
+ <component-container :colSpan="colSpan - 1" class="table-dropdown">
12
9
  <component-item
13
10
  v-for="(item, index) in tableItems"
14
11
  :key="index"
@@ -18,58 +15,72 @@
18
15
  'table-dropdown-item': item.type !== 'input',
19
16
  }"
20
17
  >
21
- <nested-icon v-if="isNested" />
22
- <template-button
23
- @click.stop="onTemplateClick(item.row)"
24
- v-if="
25
- item.type &&
26
- item.type === 'template' &&
27
- (item.value === '' || item.value === '-')
28
- "
29
- :key="idx"
30
- >{{ $gettext("Use template...") }}</template-button
31
- >
32
- <template-link
33
- v-else-if="item.type && item.type === 'template' && item.value !== ''"
34
- @click.stop="onSelectedTemplateClick(item.row)"
35
- >
36
- <img
37
- :src="require('../../assets/icons/file_icon.png')"
38
- alt="icon"
39
- width="12"
40
- height="16"
18
+ <nested-container>
19
+ <nested-icon
20
+ v-if="
21
+ isNested &&
22
+ (item.type === 'input' ||
23
+ item.type === 'no-template' ||
24
+ item.type === 'template')
25
+ "
41
26
  />
42
- <div>{{ item.value }}</div>
43
- </template-link>
44
- <no-template v-if="item.type && item.type === 'no-template'">
45
- {{ $gettext("No main component template") }}
46
- </no-template>
47
- <input-container
48
- v-if="item.type === 'input'"
49
- @click.native.stop="onInputClick()"
50
- >
51
- <text-container v-if="customInputDisabled" class="input-placeholder">
27
+ <template-button
28
+ @click.stop="onTemplateClick(item.row)"
29
+ v-if="
30
+ item.type &&
31
+ item.type === 'template' &&
32
+ (item.value === '' || item.value === '-')
33
+ "
34
+ :key="idx"
35
+ >{{ $gettext("Use template...") }}</template-button
36
+ >
37
+ <template-link
38
+ v-else-if="
39
+ item.type && item.type === 'template' && item.value !== ''
40
+ "
41
+ @click.stop="onSelectedTemplateClick(item.row)"
42
+ >
43
+ <img
44
+ :src="require('../../assets/icons/file_icon.png')"
45
+ alt="icon"
46
+ width="12"
47
+ height="16"
48
+ />
49
+ <div>{{ item.value }}</div>
50
+ </template-link>
51
+ <no-template v-if="item.type && item.type === 'no-template'">
52
+ {{ $gettext("No main component template") }}
53
+ </no-template>
54
+ <input-container
55
+ v-if="item.type === 'input'"
56
+ @click.native.stop="onInputClick()"
57
+ >
58
+ <text-container
59
+ v-if="customInputDisabled"
60
+ class="input-placeholder"
61
+ >
62
+ <span> {{ item.value }}</span>
63
+ </text-container>
64
+ <input-text
65
+ v-else
66
+ class="inputField"
67
+ :value="item.value"
68
+ :noBorder="true"
69
+ :minWidth="item.value.length + 'ch'"
70
+ :disabled="customInputDisabled"
71
+ @input-change="onCustomInputChange($event)"
72
+ />
73
+ </input-container>
74
+ <text-container
75
+ v-else-if="
76
+ item.type !== 'input' &&
77
+ item.type !== 'no-template' &&
78
+ item.type !== 'template'
79
+ "
80
+ >
52
81
  <span> {{ item.value }}</span>
53
82
  </text-container>
54
- <input-text
55
- v-else
56
- class="inputField"
57
- :value="item.value"
58
- :noBorder="true"
59
- :minWidth="item.value.length + 'ch'"
60
- :disabled="customInputDisabled"
61
- @input-change="onCustomInputChange($event)"
62
- />
63
- </input-container>
64
- <text-container
65
- v-else-if="
66
- item.type !== 'input' &&
67
- item.type !== 'no-template' &&
68
- item.type !== 'template'
69
- "
70
- >
71
- <span> {{ item.value }}</span>
72
- </text-container>
83
+ </nested-container>
73
84
  </component-item>
74
85
  <arrow-container class="arrow-container">
75
86
  <arrow-wrapper :showArchived="showArchived">
@@ -199,11 +210,7 @@ const DropdownRow = styled("div", rowAttrs)`
199
210
 
200
211
  const ItemAttrs = { isNested: Boolean }
201
212
  const ComponentItem = styled("td", ItemAttrs)`
202
- display: grid;
203
- align-items: center;
204
- grid-template-columns: ${(props) => (props.isNested ? "auto 1fr" : "1fr")};
205
- grid-gap: 5px;
206
- padding-left: ${(props) => (props.isNested ? "14px" : "0")};
213
+ padding-left: ${(props) => (props.isNested ? "14px !important" : "0")};
207
214
  overflow: hidden;
208
215
  text-overflow: ellipsis;
209
216
  padding-right: 0 !important;
@@ -406,6 +413,14 @@ const NestedIcon = styled.div`
406
413
  width: 6px;
407
414
  `
408
415
 
416
+ const NestedAttrs = { isNested: Boolean }
417
+ const NestedContainer = styled("div", NestedAttrs)`
418
+ display: grid;
419
+ grid-gap: 5px;
420
+ grid-template-columns: ${(props) => (props.isNested ? "auto 1fr" : "1fr")};
421
+ align-items: center;
422
+ `
423
+
409
424
  export default {
410
425
  name: "table-dropdown",
411
426
  components: {
@@ -433,6 +448,7 @@ export default {
433
448
  ArrowContainer,
434
449
  TextContainer,
435
450
  NestedIcon,
451
+ NestedContainer,
436
452
  },
437
453
  props: {
438
454
  colSpan: {