@mixd-id/web-scaffold 0.1.230406294 → 0.1.230406295

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 (3) hide show
  1. package/package.json +1 -1
  2. package/src/components/List.vue +50 -30
  3. package/src/components/Textbox.vue +2 -2
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@mixd-id/web-scaffold",
3
3
  "private": false,
4
- "version": "0.1.230406294",
4
+ "version": "0.1.230406295",
5
5
  "scripts": {
6
6
  "dev": "vite serve",
7
7
  "build": "vite build",
package/src/components/List.vue CHANGED
@@ -124,26 +124,28 @@
124
124
  <svg class="animate-spin" width="36" height="36" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle><path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path></svg>
125
125
  </div>
126
126
 
127
- <VirtualTable v-else-if="presetView === 'table' || pivotEnabled"
128
- ref="table"
129
- :columns="columns"
130
- class="flex-1 rounded-lg panel-400"
131
- :items="data.items"
132
- :enumCache="enumCache"
133
- @scroll-end="loadNext"
134
- @item-click="onTableItemClick">
127
+ <div v-else-if="presetView === 'table' || pivotEnabled" class="flex-1 flex" :class="pivotEnabled ? 'p-3 panel-400 md:p-0' : ''">
128
+ <VirtualTable
129
+ ref="table"
130
+ :columns="columns"
131
+ class="flex-1 rounded-lg panel-400"
132
+ :items="data.items"
133
+ :enumCache="enumCache"
134
+ @scroll-end="loadNext"
135
+ @item-click="onTableItemClick">
136
+
137
+ <template v-for="(_, slot) in headerSlots" #[slot]="{ item, index }">
138
+ <div :class="getHeader(slot.replace('col-', ''))">
139
+ <slot :name="slot" :item="item" :index="index"></slot>
140
+ </div>
141
+ </template>
135
142
 
136
- <template v-for="(_, slot) in headerSlots" #[slot]="{ item, index }">
137
- <div :class="getHeader(slot.replace('col-', ''))">
143
+ <template v-for="(_, slot) in contentSlots" #[slot]="{ item, index }">
138
144
  <slot :name="slot" :item="item" :index="index"></slot>
139
- </div>
140
- </template>
141
-
142
- <template v-for="(_, slot) in contentSlots" #[slot]="{ item, index }">
143
- <slot :name="slot" :item="item" :index="index"></slot>
144
- </template>
145
+ </template>
145
146
 
146
- </VirtualTable>
147
+ </VirtualTable>
148
+ </div>
147
149
 
148
150
  <VirtualGrid v-else-if="presetView === 'grid'"
149
151
  ref="grid"
@@ -154,7 +156,7 @@
154
156
  :container-class="`${gridContainerClass}`"
155
157
  :config="config">
156
158
  <template #item="{ item }">
157
- <slot name="gridItem" :item="item" :enumCache="enumCache">
159
+ <slot name="gridItem" :item="item" :enumCache="enumCache" :getEnumText="getEnumText">
158
160
  <div class="flex flex-row panel-400 rounded-lg overflow-hidden md:rounded-lg overflow-hidden p-3 gap-3">
159
161
  <div>
160
162
  <Image :src="item.imageUrl" class="bg-text-50 w-[64px] h-[64px] rounded-lg" />
@@ -174,17 +176,6 @@
174
176
  <div v-if="extBar.open && pivotEnabled"
175
177
  :style="extStyle" class="border-t-[1px] border-text-50 flex flex-col relative md:p-5">
176
178
 
177
- <div :class="$style.resize2" class="group"
178
- @mousedown="(e) => $util.dragResize(e, resize2)">
179
- <button type="button" @click.prevent="extBar.open = false"
180
- :class="$style.extClose" class="group-hover:bg-primary">
181
- <svg width="14"
182
- height="14"
183
- class="fill-text-300 group-hover:fill-white cursor-pointer"
184
- xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Pro 6.0.0-alpha3 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
185
- </button>
186
- </div>
187
-
188
179
  <div v-if="readyState === 3" class="flex-1 flex items-center justify-center">
189
180
  <svg class="animate-spin" width="36" height="36" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle><path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path></svg>
190
181
  </div>
@@ -218,7 +209,7 @@
218
209
  :container-class="`${gridContainerClass}`"
219
210
  :config="config">
220
211
  <template #item="{ item }">
221
- <slot name="gridItem" :item="item">
212
+ <slot name="gridItem" :item="item" :getEnumText="getEnumText">
222
213
  <div class="flex flex-row panel-400 rounded-lg overflow-hidden md:rounded-lg overflow-hidden p-3 gap-3">
223
214
  <div>
224
215
  <Image :src="item.imageUrl" class="bg-text-50 w-[64px] h-[64px] rounded-lg" />
@@ -232,6 +223,17 @@
232
223
  </template>
233
224
  </VirtualGrid>
234
225
 
226
+ <div :class="$style.resize2" class="group"
227
+ @mousedown="(e) => $util.dragResize(e, resize2)">
228
+ <button type="button" @click.prevent="extBar.open = false"
229
+ :class="$style.extClose" class="group-hover:bg-primary">
230
+ <svg width="14"
231
+ height="14"
232
+ class="fill-text-300 group-hover:fill-white cursor-pointer"
233
+ xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Pro 6.0.0-alpha3 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
234
+ </button>
235
+ </div>
236
+
235
237
  </div>
236
238
 
237
239
  </div>
@@ -298,6 +300,24 @@ export default{
298
300
 
299
301
  methods: {
300
302
 
303
+ getEnumText(key, value){
304
+
305
+ let enumText
306
+
307
+ const column = this.config.columns.find(_ => _.key === key)
308
+
309
+ if(Array.isArray(column.typeParams)){
310
+ const typeParam = (column.typeParams ?? []).filter((_) => _.value === value).pop()
311
+ enumText = typeParam && typeParam.text ? typeParam.text : enumText
312
+ }
313
+
314
+ if(this.enumCache && this.enumCache[column.key] && this.enumCache[column.key][value]){
315
+ enumText = this.enumCache[column.key][value].text ?? enumText
316
+ }
317
+
318
+ return enumText ? enumText : value
319
+ },
320
+
301
321
  getHeader(column){
302
322
 
303
323
  return [
package/src/components/Textbox.vue CHANGED
@@ -47,9 +47,9 @@ export default{
47
47
  default: ''
48
48
  },
49
49
 
50
- modelValue: [ String, Number ],
50
+ modelValue: undefined,
51
51
 
52
- value: String,
52
+ value: undefined,
53
53
 
54
54
  placeholder: String,
55
55
  readonly: undefined,