@adminforth/list-in-place-edit 1.0.1 → 1.0.3

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 (5) hide show
  1. package/.woodpecker/release.yml +0 -2
  2. package/build.log +2 -2
  3. package/custom/InPlaceEdit.vue +14 -4
  4. package/dist/custom/InPlaceEdit.vue +14 -4
  5. package/package.json +1 -1
package/.woodpecker/release.yml CHANGED
@@ -15,8 +15,6 @@ steps:
15
15
  from_secret: VAULT_TOKEN
16
16
  commands:
17
17
  - infisical export --domain https://vault.devforth.io/api --format=dotenv-export --env="prod" > /woodpecker/deploy.vault.env
18
- secrets:
19
- - VAULT_TOKEN
20
18
 
21
19
  release:
22
20
  image: node:20
package/build.log CHANGED
@@ -7,5 +7,5 @@ custom/
7
7
  custom/InPlaceEdit.vue
8
8
  custom/tsconfig.json
9
9
 
10
- sent 4,964 bytes received 58 bytes 10,044.00 bytes/sec
11
- total size is 4,749 speedup is 0.95
10
+ sent 5,343 bytes received 58 bytes 10,802.00 bytes/sec
11
+ total size is 5,128 speedup is 0.95
package/custom/InPlaceEdit.vue CHANGED
@@ -13,9 +13,10 @@
13
13
  </div>
14
14
 
15
15
  <!-- Edit mode -->
16
- <div v-else class="flex items-center min-w-full max-w-full gap-2">
16
+ <div v-else class="flex items-center gap-2 min-w-[200px]">
17
17
  <ColumnValueInputWrapper
18
18
  ref="input"
19
+ class="flex-grow"
19
20
  :source="'edit'"
20
21
  :column="column"
21
22
  :currentValues="currentValues"
@@ -27,8 +28,11 @@
27
28
  <div class="flex gap-1">
28
29
  <button
29
30
  @click="saveEdit"
30
- :disabled="saving"
31
- class="text-green-600 hover:text-green-700 dark:text-green-500 dark:hover:text-green-400"
31
+ :disabled="!isChanged || saving"
32
+ :class="[
33
+ 'text-green-600 dark:text-green-500 hover:text-green-700 dark:hover:text-green-400',
34
+ (!isChanged || saving) ? 'opacity-50 cursor-not-allowed pointer-events-none' : ''
35
+ ]"
32
36
  >
33
37
  <IconCheckOutline class="w-5 h-5" />
34
38
  </button>
@@ -45,7 +49,7 @@
45
49
  </template>
46
50
 
47
51
  <script setup lang="ts">
48
- import { ref } from 'vue';
52
+ import { ref, computed } from 'vue';
49
53
  import { IconPenSolid, IconCheckOutline, IconXOutline } from '@iconify-prerendered/vue-flowbite';
50
54
  import { callAdminForthApi } from '@/utils';
51
55
  import { showErrorTost, showSuccesTost } from '@/composables/useFrontendApi';
@@ -63,6 +67,12 @@ const columnOptions = ref({});
63
67
  const mode = ref('edit');
64
68
  const currentValues = ref({});
65
69
  const unmasked = ref({});
70
+ const isChanged = computed(() => {
71
+ const original = props.record[props.column.name];
72
+ const current = currentValues.value[props.column.name];
73
+
74
+ return JSON.stringify(original) !== JSON.stringify(current);
75
+ });
66
76
 
67
77
  function startEdit() {
68
78
  const value = props.record[props.column.name];
package/dist/custom/InPlaceEdit.vue CHANGED
@@ -13,9 +13,10 @@
13
13
  </div>
14
14
 
15
15
  <!-- Edit mode -->
16
- <div v-else class="flex items-center min-w-full max-w-full gap-2">
16
+ <div v-else class="flex items-center gap-2 min-w-[200px]">
17
17
  <ColumnValueInputWrapper
18
18
  ref="input"
19
+ class="flex-grow"
19
20
  :source="'edit'"
20
21
  :column="column"
21
22
  :currentValues="currentValues"
@@ -27,8 +28,11 @@
27
28
  <div class="flex gap-1">
28
29
  <button
29
30
  @click="saveEdit"
30
- :disabled="saving"
31
- class="text-green-600 hover:text-green-700 dark:text-green-500 dark:hover:text-green-400"
31
+ :disabled="!isChanged || saving"
32
+ :class="[
33
+ 'text-green-600 dark:text-green-500 hover:text-green-700 dark:hover:text-green-400',
34
+ (!isChanged || saving) ? 'opacity-50 cursor-not-allowed pointer-events-none' : ''
35
+ ]"
32
36
  >
33
37
  <IconCheckOutline class="w-5 h-5" />
34
38
  </button>
@@ -45,7 +49,7 @@
45
49
  </template>
46
50
 
47
51
  <script setup lang="ts">
48
- import { ref } from 'vue';
52
+ import { ref, computed } from 'vue';
49
53
  import { IconPenSolid, IconCheckOutline, IconXOutline } from '@iconify-prerendered/vue-flowbite';
50
54
  import { callAdminForthApi } from '@/utils';
51
55
  import { showErrorTost, showSuccesTost } from '@/composables/useFrontendApi';
@@ -63,6 +67,12 @@ const columnOptions = ref({});
63
67
  const mode = ref('edit');
64
68
  const currentValues = ref({});
65
69
  const unmasked = ref({});
70
+ const isChanged = computed(() => {
71
+ const original = props.record[props.column.name];
72
+ const current = currentValues.value[props.column.name];
73
+
74
+ return JSON.stringify(original) !== JSON.stringify(current);
75
+ });
66
76
 
67
77
  function startEdit() {
68
78
  const value = props.record[props.column.name];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@adminforth/list-in-place-edit",
3
- "version": "1.0.1",
3
+ "version": "1.0.3",
4
4
  "main": "dist/index.js",
5
5
  "types": "dist/index.d.ts",
6
6
  "type": "module",