pukaad-ui-lib 1.207.0 → 1.208.0

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/dist/module.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "pukaad-ui-lib",
3
3
  "configKey": "pukaadUI",
4
- "version": "1.207.0",
4
+ "version": "1.208.0",
5
5
  "builder": {
6
6
  "@nuxt/module-builder": "1.0.2",
7
7
  "unbuild": "3.6.1"
@@ -103,16 +103,14 @@ const onSubmit = async () => {
103
103
  contact_channels: form.value.contact_channels
104
104
  }
105
105
  });
106
- if (res.status === "success" || res.code === 200) {
107
- $toast?.success?.(res.message || "\u0E1A\u0E31\u0E19\u0E17\u0E36\u0E01\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E2A\u0E33\u0E40\u0E23\u0E47\u0E08");
108
- emit("submit", form.value);
109
- isDrawerOpen.value = false;
110
- } else {
111
- $toast?.error?.(res.message || "\u0E40\u0E01\u0E34\u0E14\u0E02\u0E49\u0E2D\u0E1C\u0E34\u0E14\u0E1E\u0E25\u0E32\u0E14");
112
- }
106
+ $toast?.success?.(
107
+ res.message?.description || "\u0E1A\u0E31\u0E19\u0E17\u0E36\u0E01\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E2A\u0E33\u0E40\u0E23\u0E47\u0E08"
108
+ );
109
+ emit("submit", form.value);
110
+ isDrawerOpen.value = false;
113
111
  } catch (e) {
114
112
  $toast?.error?.(
115
- e?.data?.message || "\u0E40\u0E01\u0E34\u0E14\u0E02\u0E49\u0E2D\u0E1C\u0E34\u0E14\u0E1E\u0E25\u0E32\u0E14\u0E43\u0E19\u0E01\u0E32\u0E23\u0E40\u0E0A\u0E37\u0E48\u0E2D\u0E21\u0E15\u0E48\u0E2D"
113
+ e?.data?.message?.description || e?.data?.message || "\u0E40\u0E01\u0E34\u0E14\u0E02\u0E49\u0E2D\u0E1C\u0E34\u0E14\u0E1E\u0E25\u0E32\u0E14\u0E43\u0E19\u0E01\u0E32\u0E23\u0E40\u0E0A\u0E37\u0E48\u0E2D\u0E21\u0E15\u0E48\u0E2D"
116
114
  );
117
115
  } finally {
118
116
  loading.value = false;
@@ -8,58 +8,25 @@
8
8
  <ShadTabsTrigger value="video">วิดีโอ</ShadTabsTrigger>
9
9
  </ShadTabsList>
10
10
  <ShadTabsContent value="business-info">
11
- <SuggestPlaceForm :state="props.state" />
12
- </ShadTabsContent>
13
- <ShadTabsContent value="image">
14
- <div class="flex flex-col gap-[16px] w-full">
15
- <div class="flex justify-between items-center">
16
- <div class="flex flex-col gap-[4px]">
17
- <div class="font-body-large-prominent">รูปภาพ</div>
18
- <div class="font-label-serif-medium text-gray">
19
- รองรับไฟล์ *.jpg *.jpeg *.png *.webp *.bmp *.gif ขนาดไฟล์ไม่เกิน
20
- 30 mb
21
- </div>
22
- </div>
23
- <div class="flex gap-[8px]">
24
- <Icon
25
- name="lucide:list"
26
- size="20"
27
- :class="
28
- photoColumns ? 'text-primary' : 'cursor-pointer text-gray'
29
- "
30
- @click="photoColumns = true"
31
- />
32
- <Icon
33
- name="lucide:layout-grid"
34
- size="20"
35
- :class="
36
- !photoColumns ? 'text-primary' : 'cursor-pointer text-gray'
37
- "
38
- @click="photoColumns = false"
39
- />
40
- </div>
41
- </div>
42
- <InputFile accept="image/*" :column="photoColumns" />
43
- </div>
11
+ <SuggestPlaceForm />
44
12
  </ShadTabsContent>
13
+ <ShadTabsContent value="image"> รูปภาพ </ShadTabsContent>
45
14
  <ShadTabsContent value="video"> วิดีโอ </ShadTabsContent>
46
15
  </ShadTabs>
47
16
 
48
17
  <!-- personal / business: แสดงตรงๆ ไม่มี tabs -->
49
18
  <div v-else>
50
- <SuggestPlaceForm :state="props.state" />
19
+ <SuggestPlaceForm />
51
20
  </div>
52
21
  </Drawer>
53
22
  </template>
54
23
 
55
24
  <script setup>
56
- import { computed, ref } from "vue";
25
+ import { computed } from "vue";
57
26
  const props = defineProps({
58
27
  state: { type: String, required: false, default: "personal" }
59
28
  });
60
29
  const isOpen = defineModel({ type: Boolean, ...{ default: false } });
61
- const photoColumns = ref(false);
62
- console.log("photoColumns", photoColumns.value);
63
30
  const drawerTitle = computed(() => {
64
31
  if (props.state === "personal" || props.state === "business") {
65
32
  return "\u0E41\u0E19\u0E30\u0E19\u0E33\u0E2A\u0E16\u0E32\u0E19\u0E17\u0E35\u0E48\u0E17\u0E35\u0E48\u0E02\u0E32\u0E14\u0E44\u0E1B";
@@ -1,8 +1,3 @@
1
- type __VLS_Props = {
2
- state?: "personal" | "business" | "backoffice";
3
- };
4
- declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
5
- state: "personal" | "business" | "backoffice";
6
- }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
1
+ declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
7
2
  declare const _default: typeof __VLS_export;
8
3
  export default _default;
@@ -73,32 +73,6 @@
73
73
  เพิ่มเบอร์โทรศัพท์
74
74
  </Button>
75
75
  </div>
76
- <template v-if="props.state === 'personal'">
77
- <div class="flex flex-col gap-[16px]">
78
- <InputCheckbox v-model="review" label="คุณต้องการรีวิวสถานที่นี้" />
79
- <template v-if="review">
80
- <InputRating class="flex py-4 justify-center" />
81
- <InputTextarea
82
- label="คำอธิบาย"
83
- placeholder="คำอธิบายเกี่ยวกับสถานที่"
84
- show-counter
85
- />
86
- <div class="flex flex-col gap-[8px]">
87
- <div class="flex flex-col gap-[4px]">
88
- <div class="font-body-large-prominent text-gray">
89
- เพิ่มภาพถ่าย
90
- </div>
91
- <div class="font-body-small text-gray">สูงสุด 9 รายการ</div>
92
- </div>
93
- <InputFile accept="image/*" :limit="9" />
94
- <div class="font-body-small text-gray w-[250px]">
95
- รองรับไฟล์ *.jpg *.jpeg *.png *.webp *.bmp *.gif
96
- ขนาดไฟล์ไม่เกิน 30 mb
97
- </div>
98
- </div>
99
- </template>
100
- </div>
101
- </template>
102
76
  </template>
103
77
  </div>
104
78
 
@@ -116,10 +90,6 @@
116
90
 
117
91
  <script setup>
118
92
  import { ref, computed } from "vue";
119
- const props = defineProps({
120
- state: { type: String, required: false, default: "personal" }
121
- });
122
- const review = ref(false);
123
93
  const addressValue = ref({});
124
94
  const extraNameCount = ref(0);
125
95
  const extraPhones = ref([]);
@@ -1,8 +1,3 @@
1
- type __VLS_Props = {
2
- state?: "personal" | "business" | "backoffice";
3
- };
4
- declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
5
- state: "personal" | "business" | "backoffice";
6
- }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
1
+ declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
7
2
  declare const _default: typeof __VLS_export;
8
3
  export default _default;
@@ -2,7 +2,6 @@ import type { InputFile } from "@/types/components/input/input-file";
2
2
  interface IFileItem {
3
3
  file?: File;
4
4
  url: string;
5
- description?: string;
6
5
  }
7
6
  type __VLS_Props = InputFile;
8
7
  type __VLS_ModelProps = {
@@ -36,7 +35,6 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {
36
35
  accept: string;
37
36
  labelIcon: string;
38
37
  disabledDrop: boolean;
39
- column: boolean;
40
38
  }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
41
39
  declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
42
40
  declare const _default: typeof __VLS_export;
@@ -1,54 +1,35 @@
1
1
  <template>
2
2
  <div class="space-y-[4px]">
3
- <div
4
- :class="[
5
- 'flex gap-[8px]',
6
- props.column ? 'flex-col' : 'flex-wrap flex-row'
7
- ]"
8
- >
3
+ <div class="flex flex-wrap gap-[8px]">
9
4
  <Draggable v-model="arrFiles">
10
5
  <template #item="{ item, index }">
11
- <div
12
- :class="[
13
- props.column ? 'flex gap-[16px] w-full items-start' : 'relative'
14
- ]"
15
- >
16
- <div class="relative shrink-0">
17
- <video
18
- v-if="item.file?.type?.startsWith('video')"
19
- :src="item.url"
20
- class="rounded-[4px] object-cover w-[98px] h-[98px]"
21
- />
22
- <Image
23
- v-else-if="!item.file || item.file?.type?.startsWith('image')"
24
- width="98"
25
- height="98"
26
- :src="item.url"
27
- class="rounded-[4px]"
28
- />
29
- <div
30
- v-else
31
- class="w-[98px] h-[98px] rounded-[4px] flex justify-center items-center"
32
- >
33
- <Icon
34
- name="material-symbols:lab-profile-rounded"
35
- size="34"
36
- ></Icon>
37
- </div>
38
- <div
39
- class="absolute top-[2px] right-[2px] p-[1px] w-[20px] h-[20px] bg-white rounded-full cursor-pointer flex justify-center items-center"
40
- @click="onDeleteImage(index)"
41
- >
42
- <Icon name="gravity-ui:xmark" size="16"></Icon>
43
- </div>
6
+ <div class="relative">
7
+ <video
8
+ v-if="item.file?.type?.startsWith('video')"
9
+ :src="item.url"
10
+ class="rounded-[4px] object-cover w-[98px] h-[98px]"
11
+ />
12
+ <Image
13
+ v-else-if="!item.file || item.file?.type?.startsWith('image')"
14
+ width="98"
15
+ height="98"
16
+ :src="item.url"
17
+ class="rounded-[4px]"
18
+ />
19
+ <div
20
+ v-else
21
+ class="w-[98px] h-[98px] rounded-[4px] flex justify-center items-center"
22
+ >
23
+ <Icon
24
+ name="material-symbols:lab-profile-rounded"
25
+ size="34"
26
+ ></Icon>
44
27
  </div>
45
-
46
- <div v-if="props.column" class="flex-1 w-full h-[98px]">
47
- <textarea
48
- v-model="item.description"
49
- placeholder="เพิ่มคำอธิบาย..."
50
- class="w-full h-full p-[8px] rounded-[4px] border-[1px] border-cloud outline-none focus:border-primary focus:ring-1 focus:ring-primary resize-none font-body text-black bg-white"
51
- ></textarea>
28
+ <div
29
+ class="absolute top-[2px] right-[2px] p-[1px] w-[20px] h-[20px] bg-white rounded-full cursor-pointer flex justify-center items-center"
30
+ @click="onDeleteImage(index)"
31
+ >
32
+ <Icon name="gravity-ui:xmark" size="16"></Icon>
52
33
  </div>
53
34
  </div>
54
35
  </template>
@@ -59,12 +40,11 @@
59
40
  :class="[
60
41
  'relative flex flex-col gap-[4px] justify-center items-center cursor-pointer',
61
42
  'rounded-[4px] border-dashed',
62
- props.column ? 'self-start' : '',
63
43
  actionOnDrop
64
44
  ]"
65
45
  :style="{
66
- width: props.fullWidth ? '100%' : String(props.width).match(/^[0-9]+$/) ? `${props.width}px` : props.width,
67
- height: props.fullHeight ? '100%' : String(props.height).match(/^[0-9]+$/) ? `${props.height}px` : props.height
46
+ width: props.fullWidth ? '100%' : props.width,
47
+ height: props.fullHeight ? '100%' : props.height
68
48
  }"
69
49
  @dragover.prevent="onDragOver"
70
50
  @dragenter.prevent
@@ -114,13 +94,12 @@ const props = defineProps({
114
94
  limit: { type: Number, required: false, default: 0 },
115
95
  label: { type: String, required: false, default: "" },
116
96
  labelIcon: { type: String, required: false, default: "" },
117
- width: { type: [Number, String], required: false, default: 100 },
118
- height: { type: [Number, String], required: false, default: 100 },
97
+ width: { type: [Number, String], required: false, default: 98 },
98
+ height: { type: [Number, String], required: false, default: 98 },
119
99
  fullWidth: { type: Boolean, required: false, default: false },
120
100
  fullHeight: { type: Boolean, required: false, default: false },
121
101
  disabledDrop: { type: Boolean, required: false, default: false },
122
- disabledErrorMessage: { type: Boolean, required: false, default: false },
123
- column: { type: Boolean, required: false, default: false }
102
+ disabledErrorMessage: { type: Boolean, required: false, default: false }
124
103
  });
125
104
  const isDrag = ref(false);
126
105
  const { errorMessage, setErrors } = useField(props.name);
@@ -179,15 +158,12 @@ const onSelectFile = (event) => {
179
158
  return;
180
159
  }
181
160
  const fileItems = files.map(createFileItem);
182
- arrFiles.value = [...arrFiles.value || [], ...fileItems];
161
+ arrFiles.value.push(...fileItems);
183
162
  if (input) input.value = "";
184
163
  emit("select", arrFiles.value);
185
164
  };
186
165
  const onDeleteImage = (index) => {
187
- if (!arrFiles.value) return;
188
- const newFiles = [...arrFiles.value];
189
- newFiles.splice(index, 1);
190
- arrFiles.value = newFiles;
166
+ arrFiles.value?.splice(index, 1);
191
167
  };
192
168
  const onDragOver = () => {
193
169
  isDrag.value = true;
@@ -2,7 +2,6 @@ import type { InputFile } from "@/types/components/input/input-file";
2
2
  interface IFileItem {
3
3
  file?: File;
4
4
  url: string;
5
- description?: string;
6
5
  }
7
6
  type __VLS_Props = InputFile;
8
7
  type __VLS_ModelProps = {
@@ -36,7 +35,6 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {
36
35
  accept: string;
37
36
  labelIcon: string;
38
37
  disabledDrop: boolean;
39
- column: boolean;
40
38
  }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
41
39
  declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
42
40
  declare const _default: typeof __VLS_export;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pukaad-ui-lib",
3
- "version": "1.207.0",
3
+ "version": "1.208.0",
4
4
  "description": "pukaad-ui for MeMSG",
5
5
  "repository": {
6
6
  "type": "git",