@mixd-id/web-scaffold 0.1.230406059 → 0.1.230406060

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 (4) hide show
  1. package/package.json +1 -1
  2. package/src/components/ListView.vue +14 -11
  3. package/src/components/ListViewSettings.vue +33 -9
  4. package/src/utils/listpage1.js +8 -0
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.230406059",
4
+ "version": "0.1.230406060",
5
5
  "scripts": {
6
6
  "dev": "vite serve",
7
7
  "build": "vite build",
package/src/components/ListView.vue CHANGED
@@ -3,24 +3,27 @@
3
3
 
4
4
  <slot v-if="$slots.head" name="head"></slot>
5
5
  <div v-else class="flex flex-row items-center gap-4 px-6 md:px-0 py-4 md:py-0 bg-base-400 dark:bg-base-300 md:bg-transparent">
6
- <div class="flex-1 flex flex-row gap-4">
6
+ <div class="flex-1 flex flex-row gap-6">
7
7
  <button type="button" ref="presetSelectorBtn"
8
8
  class="flex-1 md:flex-none flex flex-row gap-1 items-center text-left md:ml-2"
9
9
  @click="$refs.presetSelector.toggle($refs.presetSelectorBtn)">
10
10
  <h2 class="overflow-hidden whitespace-nowrap text-ellipsis">{{ preset.name }}</h2>
11
11
  <svg width="16" height="16" class="fill-text hover:fill-primary" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><path d="M31.3 192h257.3c17.8 0 26.7 21.5 14.1 34.1L174.1 354.8c-7.8 7.8-20.5 7.8-28.3 0L17.2 226.1C4.6 213.5 13.5 192 31.3 192z"/></svg>
12
12
  </button>
13
- <button type="button" @click="openPreset()">
14
- <svg width="19" height="19" class="fill-text hover:fill-primary" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M452.515 237l31.843-18.382c9.426-5.441 13.996-16.542 11.177-27.054-11.404-42.531-33.842-80.547-64.058-110.797-7.68-7.688-19.575-9.246-28.985-3.811l-31.785 18.358a196.276 196.276 0 0 0-32.899-19.02V39.541a24.016 24.016 0 0 0-17.842-23.206c-41.761-11.107-86.117-11.121-127.93-.001-10.519 2.798-17.844 12.321-17.844 23.206v36.753a196.276 196.276 0 0 0-32.899 19.02l-31.785-18.358c-9.41-5.435-21.305-3.877-28.985 3.811-30.216 30.25-52.654 68.265-64.058 110.797-2.819 10.512 1.751 21.613 11.177 27.054L59.485 237a197.715 197.715 0 0 0 0 37.999l-31.843 18.382c-9.426 5.441-13.996 16.542-11.177 27.054 11.404 42.531 33.842 80.547 64.058 110.797 7.68 7.688 19.575 9.246 28.985 3.811l31.785-18.358a196.202 196.202 0 0 0 32.899 19.019v36.753a24.016 24.016 0 0 0 17.842 23.206c41.761 11.107 86.117 11.122 127.93.001 10.519-2.798 17.844-12.321 17.844-23.206v-36.753a196.34 196.34 0 0 0 32.899-19.019l31.785 18.358c9.41 5.435 21.305 3.877 28.985-3.811 30.216-30.25 52.654-68.266 64.058-110.797 2.819-10.512-1.751-21.613-11.177-27.054L452.515 275c1.22-12.65 1.22-25.35 0-38zm-52.679 63.019l43.819 25.289a200.138 200.138 0 0 1-33.849 58.528l-43.829-25.309c-31.984 27.397-36.659 30.077-76.168 44.029v50.599a200.917 200.917 0 0 1-67.618 0v-50.599c-39.504-13.95-44.196-16.642-76.168-44.029l-43.829 25.309a200.15 200.15 0 0 1-33.849-58.528l43.819-25.289c-7.63-41.299-7.634-46.719 0-88.038l-43.819-25.289c7.85-21.229 19.31-41.049 33.849-58.529l43.829 25.309c31.984-27.397 36.66-30.078 76.168-44.029V58.845a200.917 200.917 0 0 1 67.618 0v50.599c39.504 13.95 44.196 16.642 76.168 44.029l43.829-25.309a200.143 200.143 0 0 1 33.849 58.529l-43.819 25.289c7.631 41.3 7.634 46.718 0 88.037zM256 160c-52.935 0-96 43.065-96 96s43.065 96 96 96 96-43.065 96-96-43.065-96-96-96zm0 144c-26.468 0-48-21.532-48-48 0-26.467 21.532-48 48-48s48 21.533 48 48c0 26.468-21.532 48-48 48z"/></svg>
15
- </button>
16
13
 
17
14
  <ContextMenu ref="presetSelector">
18
- <div class="flex-1 flex flex-col md:w-[270px] cursor-pointer">
19
- <button type="button" v-for="(preset, idx) in config.presets"
20
- class="p-3 text-left hover:bg-primary hover:text-white block"
21
- @click="selectPreset(idx)">
22
- {{ preset.name }}
23
- </button>
15
+ <div class="flex-1 flex flex-col gap-4 md:w-[270px] cursor-pointer p-6">
16
+ <div class="pb-0 flex flex-row gap-4">
17
+ <h4 class="flex-1">Select Preset</h4>
18
+ <button type="button" class="text-primary" @click="openPreset">Settings</button>
19
+ </div>
20
+ <div class="border-text-50 border-[1px] divide-y divide-text-50 bg-base-400 rounded-lg overflow-hidden">
21
+ <button type="button" v-for="(preset, idx) in config.presets"
22
+ class="p-3 text-left hover:bg-primary hover:text-white block w-full"
23
+ @click="selectPreset(idx)">
24
+ {{ preset.name }}
25
+ </button>
26
+ </div>
24
27
  </div>
25
28
  </ContextMenu>
26
29
 
@@ -73,7 +76,7 @@
73
76
 
74
77
  <div class="flex-1 flex" v-if="mediaPrefix">
75
78
  <VirtualTable v-if="mediaPrefix !== 'sm'" ref="table1" :columns="presetColumns" :items="items"
76
- class="flex-1 bg-base-400 dark:bg-base-300"
79
+ class="flex-1 bg-base-400"
77
80
  @scroll-end="loadNext">
78
81
  <template v-for="column in presetColumns" #[colOf(column.key)]="{}">
79
82
  <div :class="getHeader(column)" @click="openColumnOptions(column.key, $event.target.closest('.' + $style.header))">
package/src/components/ListViewSettings.vue CHANGED
@@ -11,15 +11,15 @@
11
11
 
12
12
  <div class="flex-1 overflow-y-auto">
13
13
  <div v-for="(preset, idx) in config.presets"
14
- class="p-2 py-4 md:py-2 flex flex-row gap-2 items-center hover:bg-primary-50 cursor-pointer"
14
+ class="p-2 py-4 md:py-2 flex flex-row gap-2 px-4 items-center hover:bg-primary-50 cursor-pointer"
15
15
  :class="config.presetIdx === idx ? 'bg-primary-100' : ''">
16
- <div @click="config.presetIdx = idx" class="flex-1 p-1 pl-4 overflow-x-hidden whitespace-nowrap text-ellipsis">
16
+ <div @click="config.presetIdx = idx" class="flex-1 p-1 overflow-x-hidden whitespace-nowrap text-ellipsis">
17
17
  <label>{{ preset.name }}</label>
18
18
  </div>
19
- <button type="button" @click="detailMode = true" class="md:hidden">
20
- <svg width="16" height="16" class="fill-text-300" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path d="M402.6 83.2l90.2 90.2c3.8 3.8 3.8 10 0 13.8L274.4 405.6l-92.8 10.3c-12.4 1.4-22.9-9.1-21.5-21.5l10.3-92.8L388.8 83.2c3.8-3.8 10-3.8 13.8 0zm162-22.9l-48.8-48.8c-15.2-15.2-39.9-15.2-55.2 0l-35.4 35.4c-3.8 3.8-3.8 10 0 13.8l90.2 90.2c3.8 3.8 10 3.8 13.8 0l35.4-35.4c15.2-15.3 15.2-40 0-55.2zM384 346.2V448H64V128h229.8c3.2 0 6.2-1.3 8.5-3.5l40-40c7.6-7.6 2.2-20.5-8.5-20.5H48C21.5 64 0 85.5 0 112v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V306.2c0-10.7-12.9-16-20.5-8.5l-40 40c-2.2 2.3-3.5 5.3-3.5 8.5z"/></svg>
19
+ <button type="button" @click="$refs.presetMenu.open($event.target, { idx })">
20
+ <svg width="16" height="16" class="fill-text-300 hover:fill-primary-500 pointer-events-none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M304 256c0 26.5-21.5 48-48 48s-48-21.5-48-48 21.5-48 48-48 48 21.5 48 48zm120-48c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48zm-336 0c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48z"/></svg>
21
21
  </button>
22
- <button type="button" class="px-2" v-if="config.presets.length > 1" @click="removePreset(idx)">
22
+ <button type="button" class="hidden px-2" v-if="config.presets.length > 1" @click="removePreset(idx)">
23
23
  <svg width="16" height="16" viewBox="0 0 24 24" class="fill-text-300 hover:fill-red-500" xmlns="http://www.w3.org/2000/svg">
24
24
  <path fill-rule="evenodd" clip-rule="evenodd" d="M10 10.25C10.4142 10.25 10.75 10.5858 10.75 11V16C10.75 16.4142 10.4142 16.75 10 16.75C9.58579 16.75 9.25 16.4142 9.25 16V11C9.25 10.5858 9.58579 10.25 10 10.25Z"/>
25
25
  <path fill-rule="evenodd" clip-rule="evenodd" d="M14 10.25C14.4142 10.25 14.75 10.5858 14.75 11V16C14.75 16.4142 14.4142 16.75 14 16.75C13.5858 16.75 13.25 16.4142 13.25 16V11C13.25 10.5858 13.5858 10.25 14 10.25Z"/>
@@ -27,6 +27,28 @@
27
27
  </svg>
28
28
  </button>
29
29
  </div>
30
+
31
+ <ContextMenu ref="presetMenu">
32
+ <template #default="{ context }">
33
+ <div class="p-3 flex flex-col">
34
+ <button type="button"
35
+ @click="detailMode = true"
36
+ class="md:hidden w-full text-left p-2 px-3 hover:bg-text-50 rounded-lg">
37
+ Open
38
+ </button>
39
+ <button type="button"
40
+ @click="duplicatePreset(context.idx)"
41
+ class="w-full text-left p-2 px-3 hover:bg-text-50 rounded-lg">
42
+ Duplicate
43
+ </button>
44
+ <button type="button" v-if="config.presets.length > 1"
45
+ @click="removePreset(context.idx)"
46
+ class="w-full text-left p-2 px-3 hover:bg-text-50 rounded-lg">
47
+ Remove
48
+ </button>
49
+ </div>
50
+ </template>
51
+ </ContextMenu>
30
52
  </div>
31
53
 
32
54
  </div>
@@ -35,12 +57,9 @@
35
57
  <div class="p-6 pb-0">
36
58
  <div class="flex flex-row items-center gap-4 mb-3">
37
59
  <button type="button" class="md:hidden" @click="detailMode = false">
38
- <svg width="19" height="19" viewBox="0 0 24 24" class="fill-text-300 hover:fill-text-400" xmlns="http://www.w3.org/2000/svg">
39
- <path d="M10.5303 17.9697C10.8232 18.2626 10.8232 18.7374 10.5303 19.0303C10.2374 19.3232 9.76253 19.3232 9.46964 19.0303L3.67675 13.2374C2.99333 12.554 2.99333 11.446 3.67675 10.7626L9.46964 4.96967C9.76253 4.67678 10.2374 4.67678 10.5303 4.96967C10.8232 5.26256 10.8232 5.73744 10.5303 6.03033L5.31063 11.25H20C20.4142 11.25 20.75 11.5858 20.75 12C20.75 12.4142 20.4142 12.75 20 12.75H5.31063L10.5303 17.9697Z"/>
40
- </svg>
60
+ <svg width="19" height="19" class="fill-text-300 hover:fill-primary-500" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M0 80v352c0 26.51 21.49 48 48 48h416c26.51 0 48-21.49 48-48V80c0-26.51-21.49-48-48-48H48C21.49 32 0 53.49 0 80zm472 224H197.333v-96H472v96zm0 40v84c0 6.627-5.373 12-12 12H197.333v-96H472zM40 208h117.333v96H40v-96zm157.333-40V72H460c6.627 0 12 5.373 12 12v84H197.333zm-40-96v96H40V84c0-6.627 5.373-12 12-12h105.333zM40 344h117.333v96H52c-6.627 0-12-5.373-12-12v-84z"/></svg>
41
61
  </button>
42
62
  <div class="flex-1 flex flex-row items-center gap-2">
43
- <svg @click="$refs.title.select()" width="16" height="16" class="fill-text-300" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path d="M402.6 83.2l90.2 90.2c3.8 3.8 3.8 10 0 13.8L274.4 405.6l-92.8 10.3c-12.4 1.4-22.9-9.1-21.5-21.5l10.3-92.8L388.8 83.2c3.8-3.8 10-3.8 13.8 0zm162-22.9l-48.8-48.8c-15.2-15.2-39.9-15.2-55.2 0l-35.4 35.4c-3.8 3.8-3.8 10 0 13.8l90.2 90.2c3.8 3.8 10 3.8 13.8 0l35.4-35.4c15.2-15.3 15.2-40 0-55.2zM384 346.2V448H64V128h229.8c3.2 0 6.2-1.3 8.5-3.5l40-40c7.6-7.6 2.2-20.5-8.5-20.5H48C21.5 64 0 85.5 0 112v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V306.2c0-10.7-12.9-16-20.5-8.5l-40 40c-2.2 2.3-3.5 5.3-3.5 8.5z"/></svg>
44
63
  <input ref="title" class="flex-1 text-xl bg-transparent outline-none" :value="preset.name" maxlength="30"
45
64
  @blur="preset.name = $event.target.value"
46
65
  @keyup.enter="preset.name = $event.target.value" />
@@ -412,6 +431,11 @@ export default{
412
431
  this.config.presetIdx = this.config.presets[index] ? index : this.config.presets.length - 1
413
432
  },
414
433
 
434
+ duplicatePreset(index){
435
+ this.config.presets.push(JSON.parse(JSON.stringify(this.config.presets[index])))
436
+ this.config.presetIdx = this.config.presets.length - 1
437
+ },
438
+
415
439
  addFilter(key){
416
440
 
417
441
  const column = this.presetColumns.find((_) => _.key === key)
package/src/utils/listpage1.js CHANGED
@@ -1309,6 +1309,14 @@ let ListPage1 = {
1309
1309
  }
1310
1310
  break
1311
1311
 
1312
+ case '<>':
1313
+ case '!=':
1314
+ whereValue = {
1315
+ ...whereValue,
1316
+ [Op.ne]: parseFloat(value)
1317
+ }
1318
+ break
1319
+
1312
1320
  case 'in':
1313
1321
  whereValue = {
1314
1322
  ...whereValue,