@j-solution/components 1.1.0 → 1.1.1
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/components/molecules/JAlert.vue.cjs +1 -1
- package/components/molecules/JAlert.vue.cjs.map +1 -1
- package/components/molecules/JAlert.vue.js +6 -5
- package/components/molecules/JAlert.vue.js.map +1 -1
- package/components/molecules/JFormField.vue.cjs +1 -1
- package/components/molecules/JFormField.vue.cjs.map +1 -1
- package/components/molecules/JFormField.vue.js +3 -2
- package/components/molecules/JFormField.vue.js.map +1 -1
- package/components/molecules/JTitlebar.vue.cjs +1 -1
- package/components/molecules/JTitlebar.vue.cjs.map +1 -1
- package/components/molecules/JTitlebar.vue.js +10 -9
- package/components/molecules/JTitlebar.vue.js.map +1 -1
- package/components/organisms/JDynamicForm.vue2.cjs +1 -1
- package/components/organisms/JDynamicForm.vue2.cjs.map +1 -1
- package/components/organisms/JDynamicForm.vue2.js +3 -2
- package/components/organisms/JDynamicForm.vue2.js.map +1 -1
- package/components/organisms/JFormModal.vue.cjs +1 -1
- package/components/organisms/JFormModal.vue.cjs.map +1 -1
- package/components/organisms/JFormModal.vue.js +3 -2
- package/components/organisms/JFormModal.vue.js.map +1 -1
- package/components/organisms/JModal.vue.cjs +1 -1
- package/components/organisms/JModal.vue.cjs.map +1 -1
- package/components/organisms/JModal.vue.js +17 -16
- package/components/organisms/JModal.vue.js.map +1 -1
- package/components/organisms/JSearchPanel.vue2.cjs +1 -1
- package/components/organisms/JSearchPanel.vue2.cjs.map +1 -1
- package/components/organisms/JSearchPanel.vue2.js +17 -16
- package/components/organisms/JSearchPanel.vue2.js.map +1 -1
- package/index.cjs +1 -1
- package/index.js +51 -49
- package/package.json +1 -1
- package/types/index.d.ts +4 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue");require("../shadcn/index.cjs");const i=require("../atoms/JButton.vue.cjs");require("lucide-vue-next");require("clsx");require("tailwind-merge");require("@internationalized/date");require("../shadcn/badge-variants.cjs");require("@vueuse/core");require("reka-ui");;/* empty css */require("../shadcn/avatar-variants.cjs");require("ag-grid-vue3");require("ag-grid-community");require("ag-grid-enterprise");;/* empty css */;/* empty css */;/* empty css */;/* empty css */const y=require("../molecules/JFormField.vue.cjs");;/* empty css */;/* empty css */;/* empty css */;/* empty css */const v=require("../shadcn/Dialog.vue.cjs"),q=require("../shadcn/DialogContent.vue.cjs"),x=require("../shadcn/DialogHeader.vue.cjs"),_=require("../shadcn/DialogTitle.vue.cjs"),g=require("../shadcn/DialogBody.vue.cjs"),F=require("../shadcn/DialogFooter.vue.cjs"),V={class:"space-y-4"},b={key:0,class:"text-sm text-muted-foreground"},C={key:1},h=e.defineComponent({__name:"JModal",props:{open:{type:Boolean,default:!1},title:{},description:{},size:{default:"md"},showFormField:{type:Boolean,default:!1},formFieldLabel:{},formFieldError:{},formFieldRequired:{type:Boolean},formFieldInputType:{default:"text"},formFieldInputPlaceholder:{},formFieldValue:{},formFieldType:{default:"input"},buttonType:{default:"OkCancel"},confirmText:{default:"확인"},cancelText:{default:"취소"},confirmVariant:{default:"default"},confirmDisabled:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1}},emits:["update:open","confirm","cancel"],setup(t,{emit:d}){const r=t,u=d,a=e.ref(r.formFieldValue||""),c=e.computed(()=>`modal-input-${Math.random().toString(36).substr(2,9)}`),s=e.computed(()=>({sm:"!max-w-sm",md:"!max-w-md",lg:"!max-w-2xl",xl:"!max-w-4xl","2xl":"!max-w-6xl",full:"!max-w-[95vw]"})[r.size]);e.watch(()=>r.formFieldValue,l=>{l!==void 0&&(a.value=l)});const f=l=>{u("update:open",l)},o=()=>{const l=r.showFormField?a.value:void 0;u("confirm",l)},m=()=>{u("cancel"),a.value=r.formFieldValue||""};return(l,n)=>(e.openBlock(),e.createBlock(e.unref(v.default),{open:t.open,"onUpdate:open":f,class:e.normalizeClass(s.value)},{default:e.withCtx(()=>[e.createVNode(e.unref(q.default),null,{default:e.withCtx(()=>[t.title?(e.openBlock(),e.createBlock(e.unref(x.default),{key:0,class:"bg-muted/50 border-b"},{default:e.withCtx(()=>[e.createVNode(e.unref(_.default),null,{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.title),1)]),_:1})]),_:1})):e.createCommentVNode("",!0),e.createVNode(e.unref(g.default),null,{default:e.withCtx(()=>[e.createElementVNode("div",V,[t.description?(e.openBlock(),e.createElementBlock("p",b,e.toDisplayString(t.description),1)):e.createCommentVNode("",!0),t.showFormField?(e.openBlock(),e.createElementBlock("div",C,[e.createVNode(e.unref(y.default),{label:t.formFieldLabel,"error-msg":t.formFieldError,required:t.formFieldRequired,type:t.formFieldType,id:c.value,modelValue:a.value,"onUpdate:modelValue":n[0]||(n[0]=p=>a.value=p),"input-type":t.formFieldInputType,placeholder:t.formFieldInputPlaceholder,disabled:t.disabled},null,8,["label","error-msg","required","type","id","modelValue","input-type","placeholder","disabled"])])):e.createCommentVNode("",!0),e.renderSlot(l.$slots,"body")])]),_:3}),e.createVNode(e.unref(F.default),null,{default:e.withCtx(()=>[t.buttonType==="OkCancel"?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createVNode(e.unref(i.default),{variant:"outline",onClick:m},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.cancelText),1)]),_:1}),e.createVNode(e.unref(i.default),{variant:t.confirmVariant,disabled:t.confirmDisabled,onClick:o},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.confirmText),1)]),_:1},8,["variant","disabled"])],64)):t.buttonType==="Ok"?(e.openBlock(),e.createBlock(e.unref(i.default),{key:1,variant:t.confirmVariant,disabled:t.confirmDisabled,onClick:o,class:"w-full"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.confirmText),1)]),_:1},8,["variant","disabled"])):e.createCommentVNode("",!0)]),_:1})]),_:3})]),_:3},8,["open","class"]))}});exports.default=h;
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue");require("../shadcn/index.cjs");const i=require("../atoms/JButton.vue.cjs");require("lucide-vue-next");require("clsx");require("tailwind-merge");require("@internationalized/date");require("../shadcn/badge-variants.cjs");require("@vueuse/core");require("reka-ui");;/* empty css */require("../shadcn/avatar-variants.cjs");require("ag-grid-vue3");require("ag-grid-community");require("ag-grid-enterprise");;/* empty css */;/* empty css */;/* empty css */;/* empty css */require("vue-sonner");const y=require("../molecules/JFormField.vue.cjs");;/* empty css */;/* empty css */;/* empty css */;/* empty css */const v=require("../shadcn/Dialog.vue.cjs"),q=require("../shadcn/DialogContent.vue.cjs"),x=require("../shadcn/DialogHeader.vue.cjs"),_=require("../shadcn/DialogTitle.vue.cjs"),g=require("../shadcn/DialogBody.vue.cjs"),F=require("../shadcn/DialogFooter.vue.cjs"),V={class:"space-y-4"},b={key:0,class:"text-sm text-muted-foreground"},C={key:1},h=e.defineComponent({__name:"JModal",props:{open:{type:Boolean,default:!1},title:{},description:{},size:{default:"md"},showFormField:{type:Boolean,default:!1},formFieldLabel:{},formFieldError:{},formFieldRequired:{type:Boolean},formFieldInputType:{default:"text"},formFieldInputPlaceholder:{},formFieldValue:{},formFieldType:{default:"input"},buttonType:{default:"OkCancel"},confirmText:{default:"확인"},cancelText:{default:"취소"},confirmVariant:{default:"default"},confirmDisabled:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1}},emits:["update:open","confirm","cancel"],setup(t,{emit:d}){const r=t,u=d,a=e.ref(r.formFieldValue||""),c=e.computed(()=>`modal-input-${Math.random().toString(36).substr(2,9)}`),s=e.computed(()=>({sm:"!max-w-sm",md:"!max-w-md",lg:"!max-w-2xl",xl:"!max-w-4xl","2xl":"!max-w-6xl",full:"!max-w-[95vw]"})[r.size]);e.watch(()=>r.formFieldValue,l=>{l!==void 0&&(a.value=l)});const f=l=>{u("update:open",l)},o=()=>{const l=r.showFormField?a.value:void 0;u("confirm",l)},m=()=>{u("cancel"),a.value=r.formFieldValue||""};return(l,n)=>(e.openBlock(),e.createBlock(e.unref(v.default),{open:t.open,"onUpdate:open":f,class:e.normalizeClass(s.value)},{default:e.withCtx(()=>[e.createVNode(e.unref(q.default),null,{default:e.withCtx(()=>[t.title?(e.openBlock(),e.createBlock(e.unref(x.default),{key:0,class:"bg-muted/50 border-b"},{default:e.withCtx(()=>[e.createVNode(e.unref(_.default),null,{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.title),1)]),_:1})]),_:1})):e.createCommentVNode("",!0),e.createVNode(e.unref(g.default),null,{default:e.withCtx(()=>[e.createElementVNode("div",V,[t.description?(e.openBlock(),e.createElementBlock("p",b,e.toDisplayString(t.description),1)):e.createCommentVNode("",!0),t.showFormField?(e.openBlock(),e.createElementBlock("div",C,[e.createVNode(e.unref(y.default),{label:t.formFieldLabel,"error-msg":t.formFieldError,required:t.formFieldRequired,type:t.formFieldType,id:c.value,modelValue:a.value,"onUpdate:modelValue":n[0]||(n[0]=p=>a.value=p),"input-type":t.formFieldInputType,placeholder:t.formFieldInputPlaceholder,disabled:t.disabled},null,8,["label","error-msg","required","type","id","modelValue","input-type","placeholder","disabled"])])):e.createCommentVNode("",!0),e.renderSlot(l.$slots,"body")])]),_:3}),e.createVNode(e.unref(F.default),null,{default:e.withCtx(()=>[t.buttonType==="OkCancel"?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createVNode(e.unref(i.default),{variant:"outline",onClick:m},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.cancelText),1)]),_:1}),e.createVNode(e.unref(i.default),{variant:t.confirmVariant,disabled:t.confirmDisabled,onClick:o},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.confirmText),1)]),_:1},8,["variant","disabled"])],64)):t.buttonType==="Ok"?(e.openBlock(),e.createBlock(e.unref(i.default),{key:1,variant:t.confirmVariant,disabled:t.confirmDisabled,onClick:o,class:"w-full"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.confirmText),1)]),_:1},8,["variant","disabled"])):e.createCommentVNode("",!0)]),_:1})]),_:3})]),_:3},8,["open","class"]))}});exports.default=h;
|
|
2
2
|
//# sourceMappingURL=JModal.vue.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"JModal.vue.cjs","sources":["../../../../src/components/organisms/JModal.vue"],"sourcesContent":["<template>\r\n <Dialog\r\n :open=\"open\"\r\n @update:open=\"onOpenChange\"\r\n :class=\"sizeClass\"\r\n >\r\n <DialogContent>\r\n <!-- Header -->\r\n <DialogHeader v-if=\"title\" class=\"bg-muted/50 border-b\">\r\n <DialogTitle>\r\n {{ title }}\r\n </DialogTitle>\r\n </DialogHeader>\r\n\r\n <!-- Body -->\r\n <DialogBody>\r\n <div class=\"space-y-4\">\r\n <!-- Description -->\r\n <p v-if=\"description\" class=\"text-sm text-muted-foreground\">\r\n {{ description }}\r\n </p>\r\n\r\n <!-- JFormField가 있는 경우 -->\r\n <div v-if=\"showFormField\">\r\n <JFormField\r\n :label=\"formFieldLabel\"\r\n :error-msg=\"formFieldError\"\r\n :required=\"formFieldRequired\"\r\n :type=\"formFieldType\"\r\n :id=\"inputId\"\r\n v-model=\"inputValue\"\r\n :input-type=\"formFieldInputType\"\r\n :placeholder=\"formFieldInputPlaceholder\"\r\n :disabled=\"disabled\"\r\n />\r\n </div>\r\n\r\n <!-- 커스텀 컨텐츠 슬롯 -->\r\n <slot name=\"body\" />\r\n </div>\r\n </DialogBody>\r\n\r\n <!-- Footer -->\r\n <DialogFooter>\r\n <!-- 확인/취소 버튼 -->\r\n <template v-if=\"buttonType === 'OkCancel'\">\r\n <JButton\r\n variant=\"outline\"\r\n @click=\"handleCancel\"\r\n >\r\n {{ cancelText }}\r\n </JButton>\r\n <JButton\r\n :variant=\"confirmVariant\"\r\n :disabled=\"confirmDisabled\"\r\n @click=\"handleConfirm\"\r\n >\r\n {{ confirmText }}\r\n </JButton>\r\n </template>\r\n \r\n <!-- 확인 버튼만 -->\r\n <template v-else-if=\"buttonType === 'Ok'\">\r\n <JButton\r\n :variant=\"confirmVariant\"\r\n :disabled=\"confirmDisabled\"\r\n @click=\"handleConfirm\"\r\n class=\"w-full\"\r\n >\r\n {{ confirmText }}\r\n </JButton>\r\n </template>\r\n </DialogFooter>\r\n </DialogContent>\r\n </Dialog>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { computed, ref, watch } from 'vue'\r\nimport {\r\n Dialog,\r\n DialogBody,\r\n DialogContent,\r\n DialogFooter,\r\n DialogHeader,\r\n DialogTitle,\r\n} from '@/components/shadcn'\r\nimport { JButton } from '@/components/atoms'\r\nimport { JFormField } from '@/components/molecules'\r\n\r\nexport interface JModalProps {\r\n // 모달 표시 여부\r\n open: boolean\r\n // 헤더\r\n title?: string\r\n description?: string\r\n // 모달 사이즈\r\n size?: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | 'full'\r\n // 폼 필드 (JFormField)\r\n showFormField?: boolean\r\n formFieldLabel?: string\r\n formFieldError?: string\r\n formFieldRequired?: boolean\r\n // 입력 필드 설정\r\n formFieldInputType?: 'text' | 'email' | 'password' | 'number' | 'tel' | 'url'\r\n formFieldInputPlaceholder?: string\r\n formFieldValue?: string\r\n formFieldType?: 'input' | 'textarea' | 'checkbox' | 'switch' | 'combo' | 'radio' | 'searchCombo' | 'datepicker'\r\n // 버튼 설정\r\n buttonType?: 'Ok' | 'OkCancel'\r\n confirmText?: string\r\n cancelText?: string\r\n confirmVariant?: 'default' | 'destructive' | 'outline' | 'secondary' | 'ghost' | 'link'\r\n confirmDisabled?: boolean\r\n // 기타\r\n disabled?: boolean\r\n}\r\n\r\nconst props = withDefaults(defineProps<JModalProps>(), {\r\n open: false,\r\n size: 'md',\r\n showFormField: false,\r\n formFieldInputType: 'text',\r\n formFieldType: 'input',\r\n buttonType: 'OkCancel',\r\n confirmText: '확인',\r\n cancelText: '취소',\r\n confirmVariant: 'default',\r\n confirmDisabled: false,\r\n disabled: false,\r\n})\r\n\r\nconst emit = defineEmits<{\r\n 'update:open': [value: boolean]\r\n 'confirm': [value?: string]\r\n 'cancel': []\r\n}>()\r\n\r\n// 입력값 관리\r\nconst inputValue = ref(props.formFieldValue || '')\r\n\r\n// 입력 필드 ID 생성\r\nconst inputId = computed(() => `modal-input-${Math.random().toString(36).substr(2, 9)}`)\r\n\r\n// 사이즈 클래스 계산\r\nconst sizeClass = computed(() => {\r\n // Dialog.vue에 기본 max-w-lg가 하드코딩되어 있어 !max-w-*로 오버라이드\r\n const sizeMap: Record<NonNullable<JModalProps['size']>, string> = {\r\n 'sm': '!max-w-sm',\r\n 'md': '!max-w-md',\r\n 'lg': '!max-w-2xl',\r\n 'xl': '!max-w-4xl',\r\n '2xl': '!max-w-6xl',\r\n 'full': '!max-w-[95vw]'\r\n }\r\n return sizeMap[props.size]\r\n})\r\n\r\n// props.formFieldValue 변경 감지\r\nwatch(() => props.formFieldValue, (newValue) => {\r\n if (newValue !== undefined) {\r\n inputValue.value = newValue\r\n }\r\n})\r\n\r\n// 모달 열기/닫기 핸들러\r\nconst onOpenChange = (value: boolean) => {\r\n emit('update:open', value)\r\n}\r\n\r\n// 확인 버튼 핸들러\r\nconst handleConfirm = () => {\r\n const value = props.showFormField ? inputValue.value : undefined\r\n emit('confirm', value)\r\n}\r\n\r\n// 취소 버튼 핸들러\r\nconst handleCancel = () => {\r\n emit('cancel')\r\n // 입력값 초기화\r\n inputValue.value = props.formFieldValue || ''\r\n}\r\n</script>\r\n"],"names":["props","__props","emit","__emit","inputValue","ref","inputId","computed","sizeClass","watch","newValue","onOpenChange","value","handleConfirm","handleCancel","_createBlock","_unref","Dialog","_createVNode","DialogContent","DialogHeader","DialogTitle","DialogBody","_createElementVNode","_hoisted_1","_createElementBlock","_hoisted_2","_toDisplayString","_hoisted_3","JFormField","$event","_renderSlot","_ctx","DialogFooter","_Fragment","JButton"],"mappings":"
|
|
1
|
+
{"version":3,"file":"JModal.vue.cjs","sources":["../../../../src/components/organisms/JModal.vue"],"sourcesContent":["<template>\r\n <Dialog\r\n :open=\"open\"\r\n @update:open=\"onOpenChange\"\r\n :class=\"sizeClass\"\r\n >\r\n <DialogContent>\r\n <!-- Header -->\r\n <DialogHeader v-if=\"title\" class=\"bg-muted/50 border-b\">\r\n <DialogTitle>\r\n {{ title }}\r\n </DialogTitle>\r\n </DialogHeader>\r\n\r\n <!-- Body -->\r\n <DialogBody>\r\n <div class=\"space-y-4\">\r\n <!-- Description -->\r\n <p v-if=\"description\" class=\"text-sm text-muted-foreground\">\r\n {{ description }}\r\n </p>\r\n\r\n <!-- JFormField가 있는 경우 -->\r\n <div v-if=\"showFormField\">\r\n <JFormField\r\n :label=\"formFieldLabel\"\r\n :error-msg=\"formFieldError\"\r\n :required=\"formFieldRequired\"\r\n :type=\"formFieldType\"\r\n :id=\"inputId\"\r\n v-model=\"inputValue\"\r\n :input-type=\"formFieldInputType\"\r\n :placeholder=\"formFieldInputPlaceholder\"\r\n :disabled=\"disabled\"\r\n />\r\n </div>\r\n\r\n <!-- 커스텀 컨텐츠 슬롯 -->\r\n <slot name=\"body\" />\r\n </div>\r\n </DialogBody>\r\n\r\n <!-- Footer -->\r\n <DialogFooter>\r\n <!-- 확인/취소 버튼 -->\r\n <template v-if=\"buttonType === 'OkCancel'\">\r\n <JButton\r\n variant=\"outline\"\r\n @click=\"handleCancel\"\r\n >\r\n {{ cancelText }}\r\n </JButton>\r\n <JButton\r\n :variant=\"confirmVariant\"\r\n :disabled=\"confirmDisabled\"\r\n @click=\"handleConfirm\"\r\n >\r\n {{ confirmText }}\r\n </JButton>\r\n </template>\r\n \r\n <!-- 확인 버튼만 -->\r\n <template v-else-if=\"buttonType === 'Ok'\">\r\n <JButton\r\n :variant=\"confirmVariant\"\r\n :disabled=\"confirmDisabled\"\r\n @click=\"handleConfirm\"\r\n class=\"w-full\"\r\n >\r\n {{ confirmText }}\r\n </JButton>\r\n </template>\r\n </DialogFooter>\r\n </DialogContent>\r\n </Dialog>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { computed, ref, watch } from 'vue'\r\nimport {\r\n Dialog,\r\n DialogBody,\r\n DialogContent,\r\n DialogFooter,\r\n DialogHeader,\r\n DialogTitle,\r\n} from '@/components/shadcn'\r\nimport { JButton } from '@/components/atoms'\r\nimport { JFormField } from '@/components/molecules'\r\n\r\nexport interface JModalProps {\r\n // 모달 표시 여부\r\n open: boolean\r\n // 헤더\r\n title?: string\r\n description?: string\r\n // 모달 사이즈\r\n size?: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | 'full'\r\n // 폼 필드 (JFormField)\r\n showFormField?: boolean\r\n formFieldLabel?: string\r\n formFieldError?: string\r\n formFieldRequired?: boolean\r\n // 입력 필드 설정\r\n formFieldInputType?: 'text' | 'email' | 'password' | 'number' | 'tel' | 'url'\r\n formFieldInputPlaceholder?: string\r\n formFieldValue?: string\r\n formFieldType?: 'input' | 'textarea' | 'checkbox' | 'switch' | 'combo' | 'radio' | 'searchCombo' | 'datepicker'\r\n // 버튼 설정\r\n buttonType?: 'Ok' | 'OkCancel'\r\n confirmText?: string\r\n cancelText?: string\r\n confirmVariant?: 'default' | 'destructive' | 'outline' | 'secondary' | 'ghost' | 'link'\r\n confirmDisabled?: boolean\r\n // 기타\r\n disabled?: boolean\r\n}\r\n\r\nconst props = withDefaults(defineProps<JModalProps>(), {\r\n open: false,\r\n size: 'md',\r\n showFormField: false,\r\n formFieldInputType: 'text',\r\n formFieldType: 'input',\r\n buttonType: 'OkCancel',\r\n confirmText: '확인',\r\n cancelText: '취소',\r\n confirmVariant: 'default',\r\n confirmDisabled: false,\r\n disabled: false,\r\n})\r\n\r\nconst emit = defineEmits<{\r\n 'update:open': [value: boolean]\r\n 'confirm': [value?: string]\r\n 'cancel': []\r\n}>()\r\n\r\n// 입력값 관리\r\nconst inputValue = ref(props.formFieldValue || '')\r\n\r\n// 입력 필드 ID 생성\r\nconst inputId = computed(() => `modal-input-${Math.random().toString(36).substr(2, 9)}`)\r\n\r\n// 사이즈 클래스 계산\r\nconst sizeClass = computed(() => {\r\n // Dialog.vue에 기본 max-w-lg가 하드코딩되어 있어 !max-w-*로 오버라이드\r\n const sizeMap: Record<NonNullable<JModalProps['size']>, string> = {\r\n 'sm': '!max-w-sm',\r\n 'md': '!max-w-md',\r\n 'lg': '!max-w-2xl',\r\n 'xl': '!max-w-4xl',\r\n '2xl': '!max-w-6xl',\r\n 'full': '!max-w-[95vw]'\r\n }\r\n return sizeMap[props.size]\r\n})\r\n\r\n// props.formFieldValue 변경 감지\r\nwatch(() => props.formFieldValue, (newValue) => {\r\n if (newValue !== undefined) {\r\n inputValue.value = newValue\r\n }\r\n})\r\n\r\n// 모달 열기/닫기 핸들러\r\nconst onOpenChange = (value: boolean) => {\r\n emit('update:open', value)\r\n}\r\n\r\n// 확인 버튼 핸들러\r\nconst handleConfirm = () => {\r\n const value = props.showFormField ? inputValue.value : undefined\r\n emit('confirm', value)\r\n}\r\n\r\n// 취소 버튼 핸들러\r\nconst handleCancel = () => {\r\n emit('cancel')\r\n // 입력값 초기화\r\n inputValue.value = props.formFieldValue || ''\r\n}\r\n</script>\r\n"],"names":["props","__props","emit","__emit","inputValue","ref","inputId","computed","sizeClass","watch","newValue","onOpenChange","value","handleConfirm","handleCancel","_createBlock","_unref","Dialog","_createVNode","DialogContent","DialogHeader","DialogTitle","DialogBody","_createElementVNode","_hoisted_1","_createElementBlock","_hoisted_2","_toDisplayString","_hoisted_3","JFormField","$event","_renderSlot","_ctx","DialogFooter","_Fragment","JButton"],"mappings":"qmEAsHA,MAAMA,EAAQC,EAcRC,EAAOC,EAOPC,EAAaC,EAAAA,IAAIL,EAAM,gBAAkB,EAAE,EAG3CM,EAAUC,EAAAA,SAAS,IAAM,eAAe,KAAK,OAAA,EAAS,SAAS,EAAE,EAAE,OAAO,EAAG,CAAC,CAAC,EAAE,EAGjFC,EAAYD,EAAAA,SAAS,KAEyC,CAChE,GAAM,YACN,GAAM,YACN,GAAM,aACN,GAAM,aACN,MAAO,aACP,KAAQ,eAAA,GAEKP,EAAM,IAAI,CAC1B,EAGDS,EAAAA,MAAM,IAAMT,EAAM,eAAiBU,GAAa,CAC1CA,IAAa,SACfN,EAAW,MAAQM,EAEvB,CAAC,EAGD,MAAMC,EAAgBC,GAAmB,CACvCV,EAAK,cAAeU,CAAK,CAC3B,EAGMC,EAAgB,IAAM,CAC1B,MAAMD,EAAQZ,EAAM,cAAgBI,EAAW,MAAQ,OACvDF,EAAK,UAAWU,CAAK,CACvB,EAGME,EAAe,IAAM,CACzBZ,EAAK,QAAQ,EAEbE,EAAW,MAAQJ,EAAM,gBAAkB,EAC7C,8BApLEe,EAAAA,YAyESC,EAAAA,MAAAC,EAAAA,OAAA,EAAA,CAxEN,KAAMhB,EAAA,KACN,gBAAaU,EACb,uBAAOH,EAAA,KAAS,CAAA,qBAEjB,IAmEgB,CAnEhBU,EAAAA,YAmEgBF,EAAAA,MAAAG,SAAA,EAAA,KAAA,mBAjEd,IAIe,CAJKlB,EAAA,qBAApBc,EAAAA,YAIeC,EAAAA,MAAAI,EAAAA,OAAA,EAAA,OAJY,MAAM,sBAAA,qBAC/B,IAEc,CAFdF,EAAAA,YAEcF,EAAAA,MAAAK,SAAA,EAAA,KAAA,mBADZ,IAAW,qCAARpB,EAAA,KAAK,EAAA,CAAA,CAAA,8CAKZiB,EAAAA,YAyBaF,EAAAA,MAAAM,SAAA,EAAA,KAAA,mBAxBX,IAuBM,CAvBNC,EAAAA,mBAuBM,MAvBNC,EAuBM,CArBKvB,EAAA,2BAATwB,EAAAA,mBAEI,IAFJC,EAEIC,EAAAA,gBADC1B,EAAA,WAAW,EAAA,CAAA,+BAILA,EAAA,6BAAXwB,EAAAA,mBAYM,MAAAG,EAAA,CAXJV,cAUEF,EAAAA,MAAAa,EAAAA,OAAA,EAAA,CATC,MAAO5B,EAAA,eACP,YAAWA,EAAA,eACX,SAAUA,EAAA,kBACV,KAAMA,EAAA,cACN,GAAIK,EAAA,iBACIF,EAAA,2CAAAA,EAAU,MAAA0B,GAClB,aAAY7B,EAAA,mBACZ,YAAaA,EAAA,0BACb,SAAUA,EAAA,QAAA,yIAKf8B,aAAoBC,EAAA,OAAA,MAAA,CAAA,WAKxBd,EAAAA,YA6BeF,EAAAA,MAAAiB,SAAA,EAAA,KAAA,mBA3Bb,IAcW,CAdKhC,EAAA,aAAU,0BAA1BwB,EAAAA,mBAcWS,WAAA,CAAA,IAAA,GAAA,CAbThB,cAKUF,EAAAA,MAAAmB,EAAAA,OAAA,EAAA,CAJR,QAAQ,UACP,QAAOrB,CAAA,qBAER,IAAgB,qCAAbb,EAAA,UAAU,EAAA,CAAA,CAAA,SAEfiB,cAMUF,EAAAA,MAAAmB,EAAAA,OAAA,EAAA,CALP,QAASlC,EAAA,eACT,SAAUA,EAAA,gBACV,QAAOY,CAAA,qBAER,IAAiB,qCAAdZ,EAAA,WAAW,EAAA,CAAA,CAAA,wCAKGA,EAAA,aAAU,oBAC7Bc,EAAAA,YAOUC,QAAAmB,EAAAA,OAAA,EAAA,OANP,QAASlC,EAAA,eACT,SAAUA,EAAA,gBACV,QAAOY,EACR,MAAM,QAAA,qBAEN,IAAiB,qCAAdZ,EAAA,WAAW,EAAA,CAAA,CAAA"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { defineComponent as T, ref as w, computed as F, watch as $, createBlock as c, openBlock as
|
|
1
|
+
import { defineComponent as T, ref as w, computed as F, watch as $, createBlock as c, openBlock as a, unref as t, normalizeClass as g, withCtx as o, createVNode as i, createCommentVNode as d, createTextVNode as f, toDisplayString as n, createElementVNode as B, createElementBlock as s, renderSlot as z, Fragment as I } from "vue";
|
|
2
2
|
import "../shadcn/index.js";
|
|
3
3
|
import p from "../atoms/JButton.vue.js";
|
|
4
4
|
import "lucide-vue-next";
|
|
@@ -17,6 +17,7 @@ import "ag-grid-enterprise";
|
|
|
17
17
|
/* empty css */
|
|
18
18
|
/* empty css */
|
|
19
19
|
/* empty css */
|
|
20
|
+
import "vue-sonner";
|
|
20
21
|
import q from "../molecules/JFormField.vue.js";
|
|
21
22
|
/* empty css */
|
|
22
23
|
/* empty css */
|
|
@@ -31,7 +32,7 @@ import S from "../shadcn/DialogFooter.vue.js";
|
|
|
31
32
|
const L = { class: "space-y-4" }, P = {
|
|
32
33
|
key: 0,
|
|
33
34
|
class: "text-sm text-muted-foreground"
|
|
34
|
-
}, R = { key: 1 },
|
|
35
|
+
}, R = { key: 1 }, xe = /* @__PURE__ */ T({
|
|
35
36
|
__name: "JModal",
|
|
36
37
|
props: {
|
|
37
38
|
open: { type: Boolean, default: !1 },
|
|
@@ -74,20 +75,20 @@ const L = { class: "space-y-4" }, P = {
|
|
|
74
75
|
}, V = () => {
|
|
75
76
|
u("cancel"), m.value = r.formFieldValue || "";
|
|
76
77
|
};
|
|
77
|
-
return (l, b) => (
|
|
78
|
+
return (l, b) => (a(), c(t(D), {
|
|
78
79
|
open: e.open,
|
|
79
80
|
"onUpdate:open": k,
|
|
80
81
|
class: g(h.value)
|
|
81
82
|
}, {
|
|
82
83
|
default: o(() => [
|
|
83
|
-
|
|
84
|
+
i(t(E), null, {
|
|
84
85
|
default: o(() => [
|
|
85
|
-
e.title ? (
|
|
86
|
+
e.title ? (a(), c(t(M), {
|
|
86
87
|
key: 0,
|
|
87
88
|
class: "bg-muted/50 border-b"
|
|
88
89
|
}, {
|
|
89
90
|
default: o(() => [
|
|
90
|
-
|
|
91
|
+
i(t(N), null, {
|
|
91
92
|
default: o(() => [
|
|
92
93
|
f(n(e.title), 1)
|
|
93
94
|
]),
|
|
@@ -96,12 +97,12 @@ const L = { class: "space-y-4" }, P = {
|
|
|
96
97
|
]),
|
|
97
98
|
_: 1
|
|
98
99
|
})) : d("", !0),
|
|
99
|
-
|
|
100
|
+
i(t(O), null, {
|
|
100
101
|
default: o(() => [
|
|
101
102
|
B("div", L, [
|
|
102
|
-
e.description ? (
|
|
103
|
-
e.showFormField ? (
|
|
104
|
-
|
|
103
|
+
e.description ? (a(), s("p", P, n(e.description), 1)) : d("", !0),
|
|
104
|
+
e.showFormField ? (a(), s("div", R, [
|
|
105
|
+
i(t(q), {
|
|
105
106
|
label: e.formFieldLabel,
|
|
106
107
|
"error-msg": e.formFieldError,
|
|
107
108
|
required: e.formFieldRequired,
|
|
@@ -119,10 +120,10 @@ const L = { class: "space-y-4" }, P = {
|
|
|
119
120
|
]),
|
|
120
121
|
_: 3
|
|
121
122
|
}),
|
|
122
|
-
|
|
123
|
+
i(t(S), null, {
|
|
123
124
|
default: o(() => [
|
|
124
|
-
e.buttonType === "OkCancel" ? (
|
|
125
|
-
|
|
125
|
+
e.buttonType === "OkCancel" ? (a(), s(I, { key: 0 }, [
|
|
126
|
+
i(t(p), {
|
|
126
127
|
variant: "outline",
|
|
127
128
|
onClick: V
|
|
128
129
|
}, {
|
|
@@ -131,7 +132,7 @@ const L = { class: "space-y-4" }, P = {
|
|
|
131
132
|
]),
|
|
132
133
|
_: 1
|
|
133
134
|
}),
|
|
134
|
-
|
|
135
|
+
i(t(p), {
|
|
135
136
|
variant: e.confirmVariant,
|
|
136
137
|
disabled: e.confirmDisabled,
|
|
137
138
|
onClick: y
|
|
@@ -141,7 +142,7 @@ const L = { class: "space-y-4" }, P = {
|
|
|
141
142
|
]),
|
|
142
143
|
_: 1
|
|
143
144
|
}, 8, ["variant", "disabled"])
|
|
144
|
-
], 64)) : e.buttonType === "Ok" ? (
|
|
145
|
+
], 64)) : e.buttonType === "Ok" ? (a(), c(t(p), {
|
|
145
146
|
key: 1,
|
|
146
147
|
variant: e.confirmVariant,
|
|
147
148
|
disabled: e.confirmDisabled,
|
|
@@ -165,6 +166,6 @@ const L = { class: "space-y-4" }, P = {
|
|
|
165
166
|
}
|
|
166
167
|
});
|
|
167
168
|
export {
|
|
168
|
-
|
|
169
|
+
xe as default
|
|
169
170
|
};
|
|
170
171
|
//# sourceMappingURL=JModal.vue.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"JModal.vue.js","sources":["../../../../src/components/organisms/JModal.vue"],"sourcesContent":["<template>\r\n <Dialog\r\n :open=\"open\"\r\n @update:open=\"onOpenChange\"\r\n :class=\"sizeClass\"\r\n >\r\n <DialogContent>\r\n <!-- Header -->\r\n <DialogHeader v-if=\"title\" class=\"bg-muted/50 border-b\">\r\n <DialogTitle>\r\n {{ title }}\r\n </DialogTitle>\r\n </DialogHeader>\r\n\r\n <!-- Body -->\r\n <DialogBody>\r\n <div class=\"space-y-4\">\r\n <!-- Description -->\r\n <p v-if=\"description\" class=\"text-sm text-muted-foreground\">\r\n {{ description }}\r\n </p>\r\n\r\n <!-- JFormField가 있는 경우 -->\r\n <div v-if=\"showFormField\">\r\n <JFormField\r\n :label=\"formFieldLabel\"\r\n :error-msg=\"formFieldError\"\r\n :required=\"formFieldRequired\"\r\n :type=\"formFieldType\"\r\n :id=\"inputId\"\r\n v-model=\"inputValue\"\r\n :input-type=\"formFieldInputType\"\r\n :placeholder=\"formFieldInputPlaceholder\"\r\n :disabled=\"disabled\"\r\n />\r\n </div>\r\n\r\n <!-- 커스텀 컨텐츠 슬롯 -->\r\n <slot name=\"body\" />\r\n </div>\r\n </DialogBody>\r\n\r\n <!-- Footer -->\r\n <DialogFooter>\r\n <!-- 확인/취소 버튼 -->\r\n <template v-if=\"buttonType === 'OkCancel'\">\r\n <JButton\r\n variant=\"outline\"\r\n @click=\"handleCancel\"\r\n >\r\n {{ cancelText }}\r\n </JButton>\r\n <JButton\r\n :variant=\"confirmVariant\"\r\n :disabled=\"confirmDisabled\"\r\n @click=\"handleConfirm\"\r\n >\r\n {{ confirmText }}\r\n </JButton>\r\n </template>\r\n \r\n <!-- 확인 버튼만 -->\r\n <template v-else-if=\"buttonType === 'Ok'\">\r\n <JButton\r\n :variant=\"confirmVariant\"\r\n :disabled=\"confirmDisabled\"\r\n @click=\"handleConfirm\"\r\n class=\"w-full\"\r\n >\r\n {{ confirmText }}\r\n </JButton>\r\n </template>\r\n </DialogFooter>\r\n </DialogContent>\r\n </Dialog>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { computed, ref, watch } from 'vue'\r\nimport {\r\n Dialog,\r\n DialogBody,\r\n DialogContent,\r\n DialogFooter,\r\n DialogHeader,\r\n DialogTitle,\r\n} from '@/components/shadcn'\r\nimport { JButton } from '@/components/atoms'\r\nimport { JFormField } from '@/components/molecules'\r\n\r\nexport interface JModalProps {\r\n // 모달 표시 여부\r\n open: boolean\r\n // 헤더\r\n title?: string\r\n description?: string\r\n // 모달 사이즈\r\n size?: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | 'full'\r\n // 폼 필드 (JFormField)\r\n showFormField?: boolean\r\n formFieldLabel?: string\r\n formFieldError?: string\r\n formFieldRequired?: boolean\r\n // 입력 필드 설정\r\n formFieldInputType?: 'text' | 'email' | 'password' | 'number' | 'tel' | 'url'\r\n formFieldInputPlaceholder?: string\r\n formFieldValue?: string\r\n formFieldType?: 'input' | 'textarea' | 'checkbox' | 'switch' | 'combo' | 'radio' | 'searchCombo' | 'datepicker'\r\n // 버튼 설정\r\n buttonType?: 'Ok' | 'OkCancel'\r\n confirmText?: string\r\n cancelText?: string\r\n confirmVariant?: 'default' | 'destructive' | 'outline' | 'secondary' | 'ghost' | 'link'\r\n confirmDisabled?: boolean\r\n // 기타\r\n disabled?: boolean\r\n}\r\n\r\nconst props = withDefaults(defineProps<JModalProps>(), {\r\n open: false,\r\n size: 'md',\r\n showFormField: false,\r\n formFieldInputType: 'text',\r\n formFieldType: 'input',\r\n buttonType: 'OkCancel',\r\n confirmText: '확인',\r\n cancelText: '취소',\r\n confirmVariant: 'default',\r\n confirmDisabled: false,\r\n disabled: false,\r\n})\r\n\r\nconst emit = defineEmits<{\r\n 'update:open': [value: boolean]\r\n 'confirm': [value?: string]\r\n 'cancel': []\r\n}>()\r\n\r\n// 입력값 관리\r\nconst inputValue = ref(props.formFieldValue || '')\r\n\r\n// 입력 필드 ID 생성\r\nconst inputId = computed(() => `modal-input-${Math.random().toString(36).substr(2, 9)}`)\r\n\r\n// 사이즈 클래스 계산\r\nconst sizeClass = computed(() => {\r\n // Dialog.vue에 기본 max-w-lg가 하드코딩되어 있어 !max-w-*로 오버라이드\r\n const sizeMap: Record<NonNullable<JModalProps['size']>, string> = {\r\n 'sm': '!max-w-sm',\r\n 'md': '!max-w-md',\r\n 'lg': '!max-w-2xl',\r\n 'xl': '!max-w-4xl',\r\n '2xl': '!max-w-6xl',\r\n 'full': '!max-w-[95vw]'\r\n }\r\n return sizeMap[props.size]\r\n})\r\n\r\n// props.formFieldValue 변경 감지\r\nwatch(() => props.formFieldValue, (newValue) => {\r\n if (newValue !== undefined) {\r\n inputValue.value = newValue\r\n }\r\n})\r\n\r\n// 모달 열기/닫기 핸들러\r\nconst onOpenChange = (value: boolean) => {\r\n emit('update:open', value)\r\n}\r\n\r\n// 확인 버튼 핸들러\r\nconst handleConfirm = () => {\r\n const value = props.showFormField ? inputValue.value : undefined\r\n emit('confirm', value)\r\n}\r\n\r\n// 취소 버튼 핸들러\r\nconst handleCancel = () => {\r\n emit('cancel')\r\n // 입력값 초기화\r\n inputValue.value = props.formFieldValue || ''\r\n}\r\n</script>\r\n"],"names":["props","__props","emit","__emit","inputValue","ref","inputId","computed","sizeClass","watch","newValue","onOpenChange","value","handleConfirm","handleCancel","_createBlock","_unref","Dialog","_createVNode","DialogContent","DialogHeader","DialogTitle","DialogBody","_createElementVNode","_hoisted_1","_createElementBlock","_hoisted_2","_toDisplayString","_hoisted_3","JFormField","$event","_renderSlot","_ctx","DialogFooter","_Fragment","JButton"],"mappings":"
|
|
1
|
+
{"version":3,"file":"JModal.vue.js","sources":["../../../../src/components/organisms/JModal.vue"],"sourcesContent":["<template>\r\n <Dialog\r\n :open=\"open\"\r\n @update:open=\"onOpenChange\"\r\n :class=\"sizeClass\"\r\n >\r\n <DialogContent>\r\n <!-- Header -->\r\n <DialogHeader v-if=\"title\" class=\"bg-muted/50 border-b\">\r\n <DialogTitle>\r\n {{ title }}\r\n </DialogTitle>\r\n </DialogHeader>\r\n\r\n <!-- Body -->\r\n <DialogBody>\r\n <div class=\"space-y-4\">\r\n <!-- Description -->\r\n <p v-if=\"description\" class=\"text-sm text-muted-foreground\">\r\n {{ description }}\r\n </p>\r\n\r\n <!-- JFormField가 있는 경우 -->\r\n <div v-if=\"showFormField\">\r\n <JFormField\r\n :label=\"formFieldLabel\"\r\n :error-msg=\"formFieldError\"\r\n :required=\"formFieldRequired\"\r\n :type=\"formFieldType\"\r\n :id=\"inputId\"\r\n v-model=\"inputValue\"\r\n :input-type=\"formFieldInputType\"\r\n :placeholder=\"formFieldInputPlaceholder\"\r\n :disabled=\"disabled\"\r\n />\r\n </div>\r\n\r\n <!-- 커스텀 컨텐츠 슬롯 -->\r\n <slot name=\"body\" />\r\n </div>\r\n </DialogBody>\r\n\r\n <!-- Footer -->\r\n <DialogFooter>\r\n <!-- 확인/취소 버튼 -->\r\n <template v-if=\"buttonType === 'OkCancel'\">\r\n <JButton\r\n variant=\"outline\"\r\n @click=\"handleCancel\"\r\n >\r\n {{ cancelText }}\r\n </JButton>\r\n <JButton\r\n :variant=\"confirmVariant\"\r\n :disabled=\"confirmDisabled\"\r\n @click=\"handleConfirm\"\r\n >\r\n {{ confirmText }}\r\n </JButton>\r\n </template>\r\n \r\n <!-- 확인 버튼만 -->\r\n <template v-else-if=\"buttonType === 'Ok'\">\r\n <JButton\r\n :variant=\"confirmVariant\"\r\n :disabled=\"confirmDisabled\"\r\n @click=\"handleConfirm\"\r\n class=\"w-full\"\r\n >\r\n {{ confirmText }}\r\n </JButton>\r\n </template>\r\n </DialogFooter>\r\n </DialogContent>\r\n </Dialog>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { computed, ref, watch } from 'vue'\r\nimport {\r\n Dialog,\r\n DialogBody,\r\n DialogContent,\r\n DialogFooter,\r\n DialogHeader,\r\n DialogTitle,\r\n} from '@/components/shadcn'\r\nimport { JButton } from '@/components/atoms'\r\nimport { JFormField } from '@/components/molecules'\r\n\r\nexport interface JModalProps {\r\n // 모달 표시 여부\r\n open: boolean\r\n // 헤더\r\n title?: string\r\n description?: string\r\n // 모달 사이즈\r\n size?: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | 'full'\r\n // 폼 필드 (JFormField)\r\n showFormField?: boolean\r\n formFieldLabel?: string\r\n formFieldError?: string\r\n formFieldRequired?: boolean\r\n // 입력 필드 설정\r\n formFieldInputType?: 'text' | 'email' | 'password' | 'number' | 'tel' | 'url'\r\n formFieldInputPlaceholder?: string\r\n formFieldValue?: string\r\n formFieldType?: 'input' | 'textarea' | 'checkbox' | 'switch' | 'combo' | 'radio' | 'searchCombo' | 'datepicker'\r\n // 버튼 설정\r\n buttonType?: 'Ok' | 'OkCancel'\r\n confirmText?: string\r\n cancelText?: string\r\n confirmVariant?: 'default' | 'destructive' | 'outline' | 'secondary' | 'ghost' | 'link'\r\n confirmDisabled?: boolean\r\n // 기타\r\n disabled?: boolean\r\n}\r\n\r\nconst props = withDefaults(defineProps<JModalProps>(), {\r\n open: false,\r\n size: 'md',\r\n showFormField: false,\r\n formFieldInputType: 'text',\r\n formFieldType: 'input',\r\n buttonType: 'OkCancel',\r\n confirmText: '확인',\r\n cancelText: '취소',\r\n confirmVariant: 'default',\r\n confirmDisabled: false,\r\n disabled: false,\r\n})\r\n\r\nconst emit = defineEmits<{\r\n 'update:open': [value: boolean]\r\n 'confirm': [value?: string]\r\n 'cancel': []\r\n}>()\r\n\r\n// 입력값 관리\r\nconst inputValue = ref(props.formFieldValue || '')\r\n\r\n// 입력 필드 ID 생성\r\nconst inputId = computed(() => `modal-input-${Math.random().toString(36).substr(2, 9)}`)\r\n\r\n// 사이즈 클래스 계산\r\nconst sizeClass = computed(() => {\r\n // Dialog.vue에 기본 max-w-lg가 하드코딩되어 있어 !max-w-*로 오버라이드\r\n const sizeMap: Record<NonNullable<JModalProps['size']>, string> = {\r\n 'sm': '!max-w-sm',\r\n 'md': '!max-w-md',\r\n 'lg': '!max-w-2xl',\r\n 'xl': '!max-w-4xl',\r\n '2xl': '!max-w-6xl',\r\n 'full': '!max-w-[95vw]'\r\n }\r\n return sizeMap[props.size]\r\n})\r\n\r\n// props.formFieldValue 변경 감지\r\nwatch(() => props.formFieldValue, (newValue) => {\r\n if (newValue !== undefined) {\r\n inputValue.value = newValue\r\n }\r\n})\r\n\r\n// 모달 열기/닫기 핸들러\r\nconst onOpenChange = (value: boolean) => {\r\n emit('update:open', value)\r\n}\r\n\r\n// 확인 버튼 핸들러\r\nconst handleConfirm = () => {\r\n const value = props.showFormField ? inputValue.value : undefined\r\n emit('confirm', value)\r\n}\r\n\r\n// 취소 버튼 핸들러\r\nconst handleCancel = () => {\r\n emit('cancel')\r\n // 입력값 초기화\r\n inputValue.value = props.formFieldValue || ''\r\n}\r\n</script>\r\n"],"names":["props","__props","emit","__emit","inputValue","ref","inputId","computed","sizeClass","watch","newValue","onOpenChange","value","handleConfirm","handleCancel","_createBlock","_unref","Dialog","_createVNode","DialogContent","DialogHeader","DialogTitle","DialogBody","_createElementVNode","_hoisted_1","_createElementBlock","_hoisted_2","_toDisplayString","_hoisted_3","JFormField","$event","_renderSlot","_ctx","DialogFooter","_Fragment","JButton"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),_=require("lucide-vue-next");require("../shadcn/index.cjs");const N=require("../atoms/JButton.vue.cjs");require("clsx");require("tailwind-merge");require("@internationalized/date");const V=require("../atoms/JBadge.vue.cjs");require("@vueuse/core");require("reka-ui");;/* empty css */require("../shadcn/avatar-variants.cjs");require("ag-grid-vue3");require("ag-grid-community");require("ag-grid-enterprise");;/* empty css */;/* empty css */;/* empty css */;/* empty css */const C=require("./JDynamicForm.vue.cjs"),g=require("../shadcn/Card.vue.cjs"),w=require("../shadcn/CardHeader.vue.cjs"),B=require("../shadcn/CardTitle.vue.cjs"),E=require("../shadcn/CardContent.vue.cjs"),S={class:"flex items-center justify-between"},D={class:"flex items-center gap-3 flex-1"},F={key:2,class:"flex flex-wrap items-center gap-2 ml-2"},j=["onClick","aria-label"],T=e.defineComponent({__name:"JSearchPanel",props:{title:{default:"조회조건"},schema:{},modelValue:{},defaultCollapsed:{type:Boolean,default:!1},collapsible:{type:Boolean,default:!0}},emits:["update:modelValue","submit","reset"],setup(u,{emit:v}){const r=u,i=v,d=e.ref(null),n=e.ref(!r.defaultCollapsed),s=e.reactive(r.modelValue?{...r.modelValue}:{});let c=!1;e.watch(()=>r.modelValue,l=>{l&&!c&&(Object.keys(s).forEach(a=>{a in l||delete s[a]}),Object.assign(s,l)),c=!1},{deep:!0,immediate:!0});function y(l){c=!0,Object.assign(s,l),i("update:modelValue",{...l})}const m=e.computed(()=>{if(!r.schema)return[];const l=[];return r.schema.type==="simple"&&r.schema.fields?l.push(...r.schema.fields):r.schema.type==="sectioned"&&r.schema.sections?r.schema.sections.forEach(a=>{a.fields&&l.push(...a.fields)}):r.schema.type==="wizard"&&r.schema.steps&&r.schema.steps.forEach(a=>{a.fields&&l.push(...a.fields)}),l}),p=e.computed(()=>{if(!s||!r.schema)return[];const l=[],a=s;return m.value.forEach(t=>{const o=a[t.controlName];if(o==null||o===""||o==="ALL"||o==="SELECT"||t.type==="checkbox"&&o==="N"||t.type==="switch"&&o==="N")return;let f=String(o);if((t.type==="combo"||t.type==="searchcombo")&&t.options){const h=t.options.find(
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),_=require("lucide-vue-next");require("../shadcn/index.cjs");const N=require("../atoms/JButton.vue.cjs");require("clsx");require("tailwind-merge");require("@internationalized/date");const V=require("../atoms/JBadge.vue.cjs");require("@vueuse/core");require("reka-ui");;/* empty css */require("../shadcn/avatar-variants.cjs");require("ag-grid-vue3");require("ag-grid-community");require("ag-grid-enterprise");;/* empty css */;/* empty css */;/* empty css */;/* empty css */require("vue-sonner");const C=require("./JDynamicForm.vue.cjs"),g=require("../shadcn/Card.vue.cjs"),w=require("../shadcn/CardHeader.vue.cjs"),B=require("../shadcn/CardTitle.vue.cjs"),E=require("../shadcn/CardContent.vue.cjs"),S={class:"flex items-center justify-between"},D={class:"flex items-center gap-3 flex-1"},F={key:2,class:"flex flex-wrap items-center gap-2 ml-2"},j=["onClick","aria-label"],T=e.defineComponent({__name:"JSearchPanel",props:{title:{default:"조회조건"},schema:{},modelValue:{},defaultCollapsed:{type:Boolean,default:!1},collapsible:{type:Boolean,default:!0}},emits:["update:modelValue","submit","reset"],setup(u,{emit:v}){const r=u,i=v,d=e.ref(null),n=e.ref(!r.defaultCollapsed),s=e.reactive(r.modelValue?{...r.modelValue}:{});let c=!1;e.watch(()=>r.modelValue,l=>{l&&!c&&(Object.keys(s).forEach(a=>{a in l||delete s[a]}),Object.assign(s,l)),c=!1},{deep:!0,immediate:!0});function y(l){c=!0,Object.assign(s,l),i("update:modelValue",{...l})}const m=e.computed(()=>{if(!r.schema)return[];const l=[];return r.schema.type==="simple"&&r.schema.fields?l.push(...r.schema.fields):r.schema.type==="sectioned"&&r.schema.sections?r.schema.sections.forEach(a=>{a.fields&&l.push(...a.fields)}):r.schema.type==="wizard"&&r.schema.steps&&r.schema.steps.forEach(a=>{a.fields&&l.push(...a.fields)}),l}),p=e.computed(()=>{if(!s||!r.schema)return[];const l=[],a=s;return m.value.forEach(t=>{const o=a[t.controlName];if(o==null||o===""||o==="ALL"||o==="SELECT"||t.type==="checkbox"&&o==="N"||t.type==="switch"&&o==="N")return;let f=String(o);if((t.type==="combo"||t.type==="searchcombo")&&t.options){const h=t.options.find(k=>k.value===o);h&&(f=h.label)}t.type==="checkbox"||t.type==="switch"?o==="Y"&&l.push({fieldName:t.controlName,label:t.label,value:t.inlineLabel||t.label}):l.push({fieldName:t.controlName,label:t.label,value:f})}),l});function b(l){i("submit",l)}function x(){d.value&&(d.value.reset(),i("reset"))}function q(l){if(!s||!r.schema)return;const a=m.value.find(t=>t.controlName===l);a&&(a.type==="checkbox"||a.type==="switch"?s[l]="N":s[l]="",c=!0,i("update:modelValue",{...s}))}return(l,a)=>(e.openBlock(),e.createBlock(e.unref(g.default),{class:"w-full"},{default:e.withCtx(()=>[e.createVNode(e.unref(w.default),{class:"pt-4 pb-3 px-6"},{default:e.withCtx(()=>[e.createElementVNode("div",S,[e.createElementVNode("div",D,[u.collapsible?(e.openBlock(),e.createElementBlock("button",{key:0,type:"button",onClick:a[0]||(a[0]=t=>n.value=!n.value),class:"flex items-center gap-2 font-semibold hover:text-primary transition-colors"},[e.createVNode(e.unref(_.ChevronDown),{class:e.normalizeClass(["h-4 w-4 transition-transform",n.value?"rotate-0":"-rotate-90"])},null,8,["class"]),e.createTextVNode(" "+e.toDisplayString(u.title),1)])):(e.openBlock(),e.createBlock(e.unref(B.default),{key:1,class:"mb-0"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(u.title),1)]),_:1})),p.value.length>0?(e.openBlock(),e.createElementBlock("div",F,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(p.value,t=>(e.openBlock(),e.createBlock(e.unref(V.default),{key:t.fieldName,variant:"secondary",size:"sm",class:"flex items-center gap-1.5 pr-1"},{default:e.withCtx(()=>[e.createElementVNode("span",null,e.toDisplayString(t.label)+": "+e.toDisplayString(t.value),1),e.createElementVNode("button",{type:"button",onClick:e.withModifiers(o=>q(t.fieldName),["stop"]),class:"h-4 w-4 rounded-full hover:bg-destructive/20 hover:text-destructive transition-colors flex items-center justify-center","aria-label":`${t.label} 조건 제거`},[e.createVNode(e.unref(_.X),{class:"h-3 w-3"})],8,j)]),_:2},1024))),128))])):e.createCommentVNode("",!0)]),e.createVNode(e.unref(N.default),{variant:"outline",size:"sm",onClick:e.withModifiers(x,["stop"])},{default:e.withCtx(()=>[...a[1]||(a[1]=[e.createTextVNode(" 초기화 ",-1)])]),_:1})])]),_:1}),e.withDirectives(e.createVNode(e.unref(E.default),{class:"px-6 pb-6 pt-0"},{default:e.withCtx(()=>[e.createVNode(C.default,{ref_key:"dynamicFormRef",ref:d,schema:u.schema,"model-value":s,"onUpdate:modelValue":y,onSubmit:b},null,8,["schema","model-value"])]),_:1},512),[[e.vShow,n.value||!u.collapsible]])]),_:1}))}});exports.default=T;
|
|
2
2
|
//# sourceMappingURL=JSearchPanel.vue2.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"JSearchPanel.vue2.cjs","sources":["../../../../src/components/organisms/JSearchPanel.vue"],"sourcesContent":["<template>\n <Card class=\"w-full\">\n <!-- 헤더: 제목, Badge 목록, 초기화 버튼 -->\n <CardHeader class=\"pt-4 pb-3 px-6\">\n <div class=\"flex items-center justify-between\">\n <div class=\"flex items-center gap-3 flex-1\">\n <button\n v-if=\"collapsible\"\n type=\"button\"\n @click=\"isExpanded = !isExpanded\"\n class=\"flex items-center gap-2 font-semibold hover:text-primary transition-colors\"\n >\n <ChevronDown\n :class=\"['h-4 w-4 transition-transform', isExpanded ? 'rotate-0' : '-rotate-90']\"\n />\n {{ title }}\n </button>\n <CardTitle v-else class=\"mb-0\">{{ title }}</CardTitle>\n \n <!-- 조건 Badge 목록 -->\n <div v-if=\"conditionBadges.length > 0\" class=\"flex flex-wrap items-center gap-2 ml-2\">\n <JBadge\n v-for=\"badge in conditionBadges\"\n :key=\"badge.fieldName\"\n variant=\"secondary\"\n size=\"sm\"\n class=\"flex items-center gap-1.5 pr-1\"\n >\n <span>{{ badge.label }}: {{ badge.value }}</span>\n <button\n type=\"button\"\n @click.stop=\"handleFieldReset(badge.fieldName)\"\n class=\"h-4 w-4 rounded-full hover:bg-destructive/20 hover:text-destructive transition-colors flex items-center justify-center\"\n :aria-label=\"`${badge.label} 조건 제거`\"\n >\n <X class=\"h-3 w-3\" />\n </button>\n </JBadge>\n </div>\n </div>\n \n <JButton\n variant=\"outline\"\n size=\"sm\"\n @click.stop=\"handleReset\"\n >\n 초기화\n </JButton>\n </div>\n </CardHeader>\n \n <!-- 폼 내용 -->\n <CardContent v-show=\"isExpanded || !collapsible\" class=\"px-6 pb-6 pt-0\">\n <JDynamicForm\n ref=\"dynamicFormRef\"\n :schema=\"schema\"\n :model-value=\"localModelValue\"\n @update:model-value=\"handleFormValueUpdate\"\n @submit=\"handleSubmit\"\n />\n </CardContent>\n </Card>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, ref, reactive, watch } from 'vue'\nimport { ChevronDown, X } from 'lucide-vue-next'\nimport { Card, CardHeader, CardTitle, CardContent } from '@/components/shadcn'\nimport { JButton, JBadge } from '@/components/atoms'\nimport JDynamicForm from './JDynamicForm.vue'\nimport type { FormSchema, DynamicFormField } from '@/types/dynamic-form'\nimport type { ComponentPublicInstance } from 'vue'\n\ninterface ConditionBadge {\n fieldName: string\n label: string\n value: string\n}\n\nexport interface JSearchPanelProps {\n /** 패널 제목 */\n title?: string\n /** JDynamicForm에 전달할 FormSchema */\n schema: FormSchema\n /** JDynamicForm의 v-model 값 */\n modelValue?: Record<string, any>\n /** 기본 접힘 상태 */\n defaultCollapsed?: boolean\n /** 접기/펼치기 가능 여부 */\n collapsible?: boolean\n}\n\nconst props = withDefaults(defineProps<JSearchPanelProps>(), {\n title: '조회조건',\n defaultCollapsed: false,\n collapsible: true,\n})\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: Record<string, any>]\n 'submit': [values: Record<string, any>]\n 'reset': []\n}>()\n\nconst dynamicFormRef = ref<ComponentPublicInstance & { reset: () => void } | null>(null)\nconst isExpanded = ref(!props.defaultCollapsed)\n\n// 로컬 modelValue - reactive로 관리하여 양방향 바인딩\nconst localModelValue = reactive<Record<string, any>>(props.modelValue ? { ...props.modelValue } : {})\n\n// 내부 변경인지 외부 변경인지 구분하는 플래그\nlet isInternalUpdate = false\n\n// props.modelValue 변경 시 localModelValue 동기화 (외부 변경)\nwatch(\n () => props.modelValue,\n (newValue) => {\n if (newValue && !isInternalUpdate) {\n // 기존 키 중 새 값에 없는 것은 삭제\n Object.keys(localModelValue).forEach(key => {\n if (!(key in newValue)) {\n delete localModelValue[key]\n }\n })\n // 새 값으로 업데이트\n Object.assign(localModelValue, newValue)\n }\n isInternalUpdate = false\n },\n { deep: true, immediate: true }\n)\n\n// JDynamicForm에서 값이 변경되었을 때 처리\nfunction handleFormValueUpdate(value: Record<string, any>) {\n // JDynamicForm에서 emit된 값을 localModelValue에 반영\n isInternalUpdate = true\n Object.assign(localModelValue, value)\n // 상위로 emit\n emit('update:modelValue', { ...value })\n}\n\n// 모든 필드 가져오기\nconst allFields = computed((): DynamicFormField[] => {\n if (!props.schema) return []\n \n const fields: DynamicFormField[] = []\n if (props.schema.type === 'simple' && props.schema.fields) {\n fields.push(...props.schema.fields)\n } else if (props.schema.type === 'sectioned' && props.schema.sections) {\n props.schema.sections.forEach(section => {\n if (section.fields) fields.push(...section.fields)\n })\n } else if (props.schema.type === 'wizard' && props.schema.steps) {\n props.schema.steps.forEach(step => {\n if (step.fields) fields.push(...step.fields)\n })\n }\n return fields\n})\n\n// 조건 Badge 목록 생성\nconst conditionBadges = computed((): ConditionBadge[] => {\n if (!localModelValue || !props.schema) {\n return []\n }\n\n const badges: ConditionBadge[] = []\n const formState = localModelValue\n\n allFields.value.forEach((field) => {\n const value = formState[field.controlName]\n \n // 빈 값 체크 (빈 문자열, null, undefined, 'ALL', 'SELECT' 제외)\n if (\n value === undefined ||\n value === null ||\n value === '' ||\n value === 'ALL' ||\n value === 'SELECT' ||\n (field.type === 'checkbox' && value === 'N') ||\n (field.type === 'switch' && value === 'N')\n ) {\n return\n }\n\n // 필드 타입에 따라 값 표시\n let displayValue = String(value)\n\n // 콤보/검색콤보인 경우 옵션의 label 찾기\n if ((field.type === 'combo' || field.type === 'searchcombo') && field.options) {\n const option = field.options.find(opt => opt.value === value)\n if (option) {\n displayValue = option.label\n }\n }\n\n // 체크박스/스위치는 'Y'일 때만 표시\n if (field.type === 'checkbox' || field.type === 'switch') {\n if (value === 'Y') {\n badges.push({\n fieldName: field.controlName,\n label: field.label,\n value: field.inlineLabel || field.label\n })\n }\n } else {\n badges.push({\n fieldName: field.controlName,\n label: field.label,\n value: displayValue\n })\n }\n })\n\n return badges\n})\n\n// submit 핸들러\nfunction handleSubmit(values: Record<string, any>) {\n emit('submit', values)\n}\n\n// 전체 초기화 핸들러\nfunction handleReset() {\n if (dynamicFormRef.value) {\n dynamicFormRef.value.reset()\n emit('reset')\n }\n}\n\n// 필드별 초기화 핸들러\nfunction handleFieldReset(fieldName: string) {\n if (!localModelValue || !props.schema) return\n \n const field = allFields.value.find(f => f.controlName === fieldName)\n \n if (field) {\n // 필드 타입에 따라 초기값 설정 - reactive 객체 직접 수정\n if (field.type === 'checkbox' || field.type === 'switch') {\n localModelValue[fieldName] = 'N'\n } else {\n localModelValue[fieldName] = ''\n }\n \n // localModelValue 변경 후 상위로 emit하여 JDynamicForm에도 반영\n isInternalUpdate = true\n emit('update:modelValue', { ...localModelValue })\n }\n}\n</script>\n\n<style scoped>\n/* 필요시 스타일 추가 */\n</style>\n\n"],"names":["props","__props","emit","__emit","dynamicFormRef","ref","isExpanded","localModelValue","reactive","isInternalUpdate","watch","newValue","key","handleFormValueUpdate","value","allFields","computed","fields","section","step","conditionBadges","badges","formState","field","displayValue","option","opt","handleSubmit","values","handleReset","handleFieldReset","fieldName","f","_createBlock","_unref","Card","_createVNode","CardHeader","_createElementVNode","_hoisted_1","_hoisted_2","_createElementBlock","_cache","$event","ChevronDown","_createTextVNode","CardTitle","_openBlock","_hoisted_3","_Fragment","_renderList","badge","JBadge","_toDisplayString","_withModifiers","X","JButton","CardContent","JDynamicForm","_vShow"],"mappings":"gjDA4FA,MAAMA,EAAQC,EAMRC,EAAOC,EAMPC,EAAiBC,EAAAA,IAA4D,IAAI,EACjFC,EAAaD,EAAAA,IAAI,CAACL,EAAM,gBAAgB,EAGxCO,EAAkBC,EAAAA,SAA8BR,EAAM,WAAa,CAAE,GAAGA,EAAM,UAAA,EAAe,EAAE,EAGrG,IAAIS,EAAmB,GAGvBC,EAAAA,MACE,IAAMV,EAAM,WACXW,GAAa,CACRA,GAAY,CAACF,IAEf,OAAO,KAAKF,CAAe,EAAE,QAAQK,GAAO,CACpCA,KAAOD,GACX,OAAOJ,EAAgBK,CAAG,CAE9B,CAAC,EAED,OAAO,OAAOL,EAAiBI,CAAQ,GAEzCF,EAAmB,EACrB,EACA,CAAE,KAAM,GAAM,UAAW,EAAA,CAAK,EAIhC,SAASI,EAAsBC,EAA4B,CAEzDL,EAAmB,GACnB,OAAO,OAAOF,EAAiBO,CAAK,EAEpCZ,EAAK,oBAAqB,CAAE,GAAGY,EAAO,CACxC,CAGA,MAAMC,EAAYC,EAAAA,SAAS,IAA0B,CACnD,GAAI,CAAChB,EAAM,OAAQ,MAAO,CAAA,EAE1B,MAAMiB,EAA6B,CAAA,EACnC,OAAIjB,EAAM,OAAO,OAAS,UAAYA,EAAM,OAAO,OACjDiB,EAAO,KAAK,GAAGjB,EAAM,OAAO,MAAM,EACzBA,EAAM,OAAO,OAAS,aAAeA,EAAM,OAAO,SAC3DA,EAAM,OAAO,SAAS,QAAQkB,GAAW,CACnCA,EAAQ,QAAQD,EAAO,KAAK,GAAGC,EAAQ,MAAM,CACnD,CAAC,EACQlB,EAAM,OAAO,OAAS,UAAYA,EAAM,OAAO,OACxDA,EAAM,OAAO,MAAM,QAAQmB,GAAQ,CAC7BA,EAAK,QAAQF,EAAO,KAAK,GAAGE,EAAK,MAAM,CAC7C,CAAC,EAEIF,CACT,CAAC,EAGKG,EAAkBJ,EAAAA,SAAS,IAAwB,CACvD,GAAI,CAACT,GAAmB,CAACP,EAAM,OAC7B,MAAO,CAAA,EAGT,MAAMqB,EAA2B,CAAA,EAC3BC,EAAYf,EAElB,OAAAQ,EAAU,MAAM,QAASQ,GAAU,CACjC,MAAMT,EAAQQ,EAAUC,EAAM,WAAW,EAGzC,GAEET,GAAU,MACVA,IAAU,IACVA,IAAU,OACVA,IAAU,UACTS,EAAM,OAAS,YAAcT,IAAU,KACvCS,EAAM,OAAS,UAAYT,IAAU,IAEtC,OAIF,IAAIU,EAAe,OAAOV,CAAK,EAG/B,IAAKS,EAAM,OAAS,SAAWA,EAAM,OAAS,gBAAkBA,EAAM,QAAS,CAC7E,MAAME,EAASF,EAAM,QAAQ,KAAKG,GAAOA,EAAI,QAAUZ,CAAK,EACxDW,IACFD,EAAeC,EAAO,MAE1B,CAGIF,EAAM,OAAS,YAAcA,EAAM,OAAS,SAC1CT,IAAU,KACZO,EAAO,KAAK,CACV,UAAWE,EAAM,YACjB,MAAOA,EAAM,MACb,MAAOA,EAAM,aAAeA,EAAM,KAAA,CACnC,EAGHF,EAAO,KAAK,CACV,UAAWE,EAAM,YACjB,MAAOA,EAAM,MACb,MAAOC,CAAA,CACR,CAEL,CAAC,EAEMH,CACT,CAAC,EAGD,SAASM,EAAaC,EAA6B,CACjD1B,EAAK,SAAU0B,CAAM,CACvB,CAGA,SAASC,GAAc,CACjBzB,EAAe,QACjBA,EAAe,MAAM,MAAA,EACrBF,EAAK,OAAO,EAEhB,CAGA,SAAS4B,EAAiBC,EAAmB,CAC3C,GAAI,CAACxB,GAAmB,CAACP,EAAM,OAAQ,OAEvC,MAAMuB,EAAQR,EAAU,MAAM,KAAKiB,GAAKA,EAAE,cAAgBD,CAAS,EAE/DR,IAEEA,EAAM,OAAS,YAAcA,EAAM,OAAS,SAC9ChB,EAAgBwB,CAAS,EAAI,IAE7BxB,EAAgBwB,CAAS,EAAI,GAI/BtB,EAAmB,GACnBP,EAAK,oBAAqB,CAAE,GAAGK,EAAiB,EAEpD,6BAvPE0B,EAAAA,YA4DOC,EAAAA,MAAAC,EAAAA,OAAA,EAAA,CA5DD,MAAM,UAAQ,mBAElB,IA8Ca,CA9CbC,EAAAA,YA8CaF,EAAAA,MAAAG,EAAAA,OAAA,EAAA,CA9CD,MAAM,kBAAgB,mBAChC,IA4CM,CA5CNC,EAAAA,mBA4CM,MA5CNC,EA4CM,CA3CJD,EAAAA,mBAkCM,MAlCNE,EAkCM,CAhCIvC,EAAA,2BADRwC,EAAAA,mBAUS,SAAA,OARP,KAAK,SACJ,QAAKC,EAAA,CAAA,IAAAA,EAAA,CAAA,EAAAC,GAAErC,EAAA,MAAU,CAAIA,EAAA,OACtB,MAAM,4EAAA,GAEN8B,cAEEF,EAAAA,MAAAU,EAAAA,WAAA,EAAA,CADC,uDAAwCtC,EAAA,MAAU,WAAA,YAAA,CAAA,CAAA,oBACnDuC,EAAAA,gBAAA,sBACC5C,EAAA,KAAK,EAAA,CAAA,CAAA,mBAEVgC,EAAAA,YAAsDC,EAAAA,MAAAY,EAAAA,OAAA,EAAA,OAApC,MAAM,MAAA,qBAAO,IAAW,qCAAR7C,EAAA,KAAK,EAAA,CAAA,CAAA,UAG5BmB,EAAA,MAAgB,OAAM,GAAjC2B,EAAAA,YAAAN,EAAAA,mBAkBM,MAlBNO,EAkBM,kBAjBJP,EAAAA,mBAgBSQ,EAAAA,SAAA,KAAAC,EAAAA,WAfS9B,EAAA,MAAT+B,kBADTlB,EAAAA,YAgBSC,EAAAA,MAAAkB,EAAAA,OAAA,EAAA,CAdN,IAAKD,EAAM,UACZ,QAAQ,YACR,KAAK,KACL,MAAM,gCAAA,qBAEN,IAAiD,CAAjDb,EAAAA,mBAAiD,OAAA,KAAAe,EAAAA,gBAAxCF,EAAM,KAAK,EAAG,KAAEE,EAAAA,gBAAGF,EAAM,KAAK,EAAA,CAAA,EACvCb,EAAAA,mBAOS,SAAA,CANP,KAAK,SACJ,QAAKgB,EAAAA,cAAAX,GAAOb,EAAiBqB,EAAM,SAAS,EAAA,CAAA,MAAA,CAAA,EAC7C,MAAM,yHACL,aAAU,GAAKA,EAAM,KAAK,QAAA,GAE3Bf,EAAAA,YAAqBF,EAAAA,MAAAqB,EAAAA,CAAA,EAAA,CAAlB,MAAM,UAAS,CAAA,6DAM1BnB,cAMUF,EAAAA,MAAAsB,EAAAA,OAAA,EAAA,CALR,QAAQ,UACR,KAAK,KACJ,wBAAY3B,EAAW,CAAA,MAAA,CAAA,CAAA,qBACzB,IAED,CAAA,GAAAa,EAAA,CAAA,IAAAA,EAAA,CAAA,EAAA,mBAFC,QAED,EAAA,CAAA,sCAKJN,EAAAA,YAQcF,QAAAuB,EAAAA,OAAA,EAAA,CARmC,MAAM,kBAAgB,mBACrE,IAME,CANFrB,EAAAA,YAMEsB,EAAAA,QAAA,SALI,iBAAJ,IAAItD,EACH,OAAQH,EAAA,OACR,cAAaM,EACb,sBAAoBM,EACpB,SAAQc,CAAA,gDANQ,CAAAgC,EAAAA,MAAArD,EAAA,QAAeL,EAAA,WAAW,CAAA"}
|
|
1
|
+
{"version":3,"file":"JSearchPanel.vue2.cjs","sources":["../../../../src/components/organisms/JSearchPanel.vue"],"sourcesContent":["<template>\n <Card class=\"w-full\">\n <!-- 헤더: 제목, Badge 목록, 초기화 버튼 -->\n <CardHeader class=\"pt-4 pb-3 px-6\">\n <div class=\"flex items-center justify-between\">\n <div class=\"flex items-center gap-3 flex-1\">\n <button\n v-if=\"collapsible\"\n type=\"button\"\n @click=\"isExpanded = !isExpanded\"\n class=\"flex items-center gap-2 font-semibold hover:text-primary transition-colors\"\n >\n <ChevronDown\n :class=\"['h-4 w-4 transition-transform', isExpanded ? 'rotate-0' : '-rotate-90']\"\n />\n {{ title }}\n </button>\n <CardTitle v-else class=\"mb-0\">{{ title }}</CardTitle>\n \n <!-- 조건 Badge 목록 -->\n <div v-if=\"conditionBadges.length > 0\" class=\"flex flex-wrap items-center gap-2 ml-2\">\n <JBadge\n v-for=\"badge in conditionBadges\"\n :key=\"badge.fieldName\"\n variant=\"secondary\"\n size=\"sm\"\n class=\"flex items-center gap-1.5 pr-1\"\n >\n <span>{{ badge.label }}: {{ badge.value }}</span>\n <button\n type=\"button\"\n @click.stop=\"handleFieldReset(badge.fieldName)\"\n class=\"h-4 w-4 rounded-full hover:bg-destructive/20 hover:text-destructive transition-colors flex items-center justify-center\"\n :aria-label=\"`${badge.label} 조건 제거`\"\n >\n <X class=\"h-3 w-3\" />\n </button>\n </JBadge>\n </div>\n </div>\n \n <JButton\n variant=\"outline\"\n size=\"sm\"\n @click.stop=\"handleReset\"\n >\n 초기화\n </JButton>\n </div>\n </CardHeader>\n \n <!-- 폼 내용 -->\n <CardContent v-show=\"isExpanded || !collapsible\" class=\"px-6 pb-6 pt-0\">\n <JDynamicForm\n ref=\"dynamicFormRef\"\n :schema=\"schema\"\n :model-value=\"localModelValue\"\n @update:model-value=\"handleFormValueUpdate\"\n @submit=\"handleSubmit\"\n />\n </CardContent>\n </Card>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, ref, reactive, watch } from 'vue'\nimport { ChevronDown, X } from 'lucide-vue-next'\nimport { Card, CardHeader, CardTitle, CardContent } from '@/components/shadcn'\nimport { JButton, JBadge } from '@/components/atoms'\nimport JDynamicForm from './JDynamicForm.vue'\nimport type { FormSchema, DynamicFormField } from '@/types/dynamic-form'\nimport type { ComponentPublicInstance } from 'vue'\n\ninterface ConditionBadge {\n fieldName: string\n label: string\n value: string\n}\n\nexport interface JSearchPanelProps {\n /** 패널 제목 */\n title?: string\n /** JDynamicForm에 전달할 FormSchema */\n schema: FormSchema\n /** JDynamicForm의 v-model 값 */\n modelValue?: Record<string, any>\n /** 기본 접힘 상태 */\n defaultCollapsed?: boolean\n /** 접기/펼치기 가능 여부 */\n collapsible?: boolean\n}\n\nconst props = withDefaults(defineProps<JSearchPanelProps>(), {\n title: '조회조건',\n defaultCollapsed: false,\n collapsible: true,\n})\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: Record<string, any>]\n 'submit': [values: Record<string, any>]\n 'reset': []\n}>()\n\nconst dynamicFormRef = ref<ComponentPublicInstance & { reset: () => void } | null>(null)\nconst isExpanded = ref(!props.defaultCollapsed)\n\n// 로컬 modelValue - reactive로 관리하여 양방향 바인딩\nconst localModelValue = reactive<Record<string, any>>(props.modelValue ? { ...props.modelValue } : {})\n\n// 내부 변경인지 외부 변경인지 구분하는 플래그\nlet isInternalUpdate = false\n\n// props.modelValue 변경 시 localModelValue 동기화 (외부 변경)\nwatch(\n () => props.modelValue,\n (newValue) => {\n if (newValue && !isInternalUpdate) {\n // 기존 키 중 새 값에 없는 것은 삭제\n Object.keys(localModelValue).forEach(key => {\n if (!(key in newValue)) {\n delete localModelValue[key]\n }\n })\n // 새 값으로 업데이트\n Object.assign(localModelValue, newValue)\n }\n isInternalUpdate = false\n },\n { deep: true, immediate: true }\n)\n\n// JDynamicForm에서 값이 변경되었을 때 처리\nfunction handleFormValueUpdate(value: Record<string, any>) {\n // JDynamicForm에서 emit된 값을 localModelValue에 반영\n isInternalUpdate = true\n Object.assign(localModelValue, value)\n // 상위로 emit\n emit('update:modelValue', { ...value })\n}\n\n// 모든 필드 가져오기\nconst allFields = computed((): DynamicFormField[] => {\n if (!props.schema) return []\n \n const fields: DynamicFormField[] = []\n if (props.schema.type === 'simple' && props.schema.fields) {\n fields.push(...props.schema.fields)\n } else if (props.schema.type === 'sectioned' && props.schema.sections) {\n props.schema.sections.forEach(section => {\n if (section.fields) fields.push(...section.fields)\n })\n } else if (props.schema.type === 'wizard' && props.schema.steps) {\n props.schema.steps.forEach(step => {\n if (step.fields) fields.push(...step.fields)\n })\n }\n return fields\n})\n\n// 조건 Badge 목록 생성\nconst conditionBadges = computed((): ConditionBadge[] => {\n if (!localModelValue || !props.schema) {\n return []\n }\n\n const badges: ConditionBadge[] = []\n const formState = localModelValue\n\n allFields.value.forEach((field) => {\n const value = formState[field.controlName]\n \n // 빈 값 체크 (빈 문자열, null, undefined, 'ALL', 'SELECT' 제외)\n if (\n value === undefined ||\n value === null ||\n value === '' ||\n value === 'ALL' ||\n value === 'SELECT' ||\n (field.type === 'checkbox' && value === 'N') ||\n (field.type === 'switch' && value === 'N')\n ) {\n return\n }\n\n // 필드 타입에 따라 값 표시\n let displayValue = String(value)\n\n // 콤보/검색콤보인 경우 옵션의 label 찾기\n if ((field.type === 'combo' || field.type === 'searchcombo') && field.options) {\n const option = field.options.find(opt => opt.value === value)\n if (option) {\n displayValue = option.label\n }\n }\n\n // 체크박스/스위치는 'Y'일 때만 표시\n if (field.type === 'checkbox' || field.type === 'switch') {\n if (value === 'Y') {\n badges.push({\n fieldName: field.controlName,\n label: field.label,\n value: field.inlineLabel || field.label\n })\n }\n } else {\n badges.push({\n fieldName: field.controlName,\n label: field.label,\n value: displayValue\n })\n }\n })\n\n return badges\n})\n\n// submit 핸들러\nfunction handleSubmit(values: Record<string, any>) {\n emit('submit', values)\n}\n\n// 전체 초기화 핸들러\nfunction handleReset() {\n if (dynamicFormRef.value) {\n dynamicFormRef.value.reset()\n emit('reset')\n }\n}\n\n// 필드별 초기화 핸들러\nfunction handleFieldReset(fieldName: string) {\n if (!localModelValue || !props.schema) return\n \n const field = allFields.value.find(f => f.controlName === fieldName)\n \n if (field) {\n // 필드 타입에 따라 초기값 설정 - reactive 객체 직접 수정\n if (field.type === 'checkbox' || field.type === 'switch') {\n localModelValue[fieldName] = 'N'\n } else {\n localModelValue[fieldName] = ''\n }\n \n // localModelValue 변경 후 상위로 emit하여 JDynamicForm에도 반영\n isInternalUpdate = true\n emit('update:modelValue', { ...localModelValue })\n }\n}\n</script>\n\n<style scoped>\n/* 필요시 스타일 추가 */\n</style>\n\n"],"names":["props","__props","emit","__emit","dynamicFormRef","ref","isExpanded","localModelValue","reactive","isInternalUpdate","watch","newValue","key","handleFormValueUpdate","value","allFields","computed","fields","section","step","conditionBadges","badges","formState","field","displayValue","option","opt","handleSubmit","values","handleReset","handleFieldReset","fieldName","f","_createBlock","_unref","Card","_createVNode","CardHeader","_createElementVNode","_hoisted_1","_hoisted_2","_createElementBlock","_cache","$event","ChevronDown","_createTextVNode","CardTitle","_openBlock","_hoisted_3","_Fragment","_renderList","badge","JBadge","_toDisplayString","_withModifiers","X","JButton","CardContent","JDynamicForm","_vShow"],"mappings":"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"}
|
|
@@ -17,6 +17,7 @@ import "ag-grid-enterprise";
|
|
|
17
17
|
/* empty css */
|
|
18
18
|
/* empty css */
|
|
19
19
|
/* empty css */
|
|
20
|
+
import "vue-sonner";
|
|
20
21
|
import Y from "./JDynamicForm.vue.js";
|
|
21
22
|
import q from "../shadcn/Card.vue.js";
|
|
22
23
|
import G from "../shadcn/CardHeader.vue.js";
|
|
@@ -25,7 +26,7 @@ import K from "../shadcn/CardContent.vue.js";
|
|
|
25
26
|
const Q = { class: "flex items-center justify-between" }, W = { class: "flex items-center gap-3 flex-1" }, Z = {
|
|
26
27
|
key: 2,
|
|
27
28
|
class: "flex flex-wrap items-center gap-2 ml-2"
|
|
28
|
-
}, ee = ["onClick", "aria-label"],
|
|
29
|
+
}, ee = ["onClick", "aria-label"], ge = /* @__PURE__ */ L({
|
|
29
30
|
__name: "JSearchPanel",
|
|
30
31
|
props: {
|
|
31
32
|
title: { default: "조회조건" },
|
|
@@ -36,32 +37,32 @@ const Q = { class: "flex items-center justify-between" }, W = { class: "flex ite
|
|
|
36
37
|
},
|
|
37
38
|
emits: ["update:modelValue", "submit", "reset"],
|
|
38
39
|
setup(n, { emit: E }) {
|
|
39
|
-
const
|
|
40
|
+
const o = n, u = E, b = V(null), p = V(!o.defaultCollapsed), a = z(o.modelValue ? { ...o.modelValue } : {});
|
|
40
41
|
let f = !1;
|
|
41
42
|
D(
|
|
42
|
-
() =>
|
|
43
|
+
() => o.modelValue,
|
|
43
44
|
(t) => {
|
|
44
|
-
t && !f && (Object.keys(
|
|
45
|
-
l in t || delete
|
|
46
|
-
}), Object.assign(
|
|
45
|
+
t && !f && (Object.keys(a).forEach((l) => {
|
|
46
|
+
l in t || delete a[l];
|
|
47
|
+
}), Object.assign(a, t)), f = !1;
|
|
47
48
|
},
|
|
48
49
|
{ deep: !0, immediate: !0 }
|
|
49
50
|
);
|
|
50
51
|
function $(t) {
|
|
51
|
-
f = !0, Object.assign(
|
|
52
|
+
f = !0, Object.assign(a, t), u("update:modelValue", { ...t });
|
|
52
53
|
}
|
|
53
54
|
const _ = C(() => {
|
|
54
|
-
if (!
|
|
55
|
+
if (!o.schema) return [];
|
|
55
56
|
const t = [];
|
|
56
|
-
return
|
|
57
|
+
return o.schema.type === "simple" && o.schema.fields ? t.push(...o.schema.fields) : o.schema.type === "sectioned" && o.schema.sections ? o.schema.sections.forEach((l) => {
|
|
57
58
|
l.fields && t.push(...l.fields);
|
|
58
|
-
}) :
|
|
59
|
+
}) : o.schema.type === "wizard" && o.schema.steps && o.schema.steps.forEach((l) => {
|
|
59
60
|
l.fields && t.push(...l.fields);
|
|
60
61
|
}), t;
|
|
61
62
|
}), k = C(() => {
|
|
62
|
-
if (!
|
|
63
|
+
if (!a || !o.schema)
|
|
63
64
|
return [];
|
|
64
|
-
const t = [], l =
|
|
65
|
+
const t = [], l = a;
|
|
65
66
|
return _.value.forEach((e) => {
|
|
66
67
|
const s = l[e.controlName];
|
|
67
68
|
if (s == null || s === "" || s === "ALL" || s === "SELECT" || e.type === "checkbox" && s === "N" || e.type === "switch" && s === "N")
|
|
@@ -89,9 +90,9 @@ const Q = { class: "flex items-center justify-between" }, W = { class: "flex ite
|
|
|
89
90
|
b.value && (b.value.reset(), u("reset"));
|
|
90
91
|
}
|
|
91
92
|
function B(t) {
|
|
92
|
-
if (!
|
|
93
|
+
if (!a || !o.schema) return;
|
|
93
94
|
const l = _.value.find((e) => e.controlName === t);
|
|
94
|
-
l && (l.type === "checkbox" || l.type === "switch" ?
|
|
95
|
+
l && (l.type === "checkbox" || l.type === "switch" ? a[t] = "N" : a[t] = "", f = !0, u("update:modelValue", { ...a }));
|
|
95
96
|
}
|
|
96
97
|
return (t, l) => (r(), v(i(q), { class: "w-full" }, {
|
|
97
98
|
default: c(() => [
|
|
@@ -160,7 +161,7 @@ const Q = { class: "flex items-center justify-between" }, W = { class: "flex ite
|
|
|
160
161
|
ref_key: "dynamicFormRef",
|
|
161
162
|
ref: b,
|
|
162
163
|
schema: n.schema,
|
|
163
|
-
"model-value":
|
|
164
|
+
"model-value": a,
|
|
164
165
|
"onUpdate:modelValue": $,
|
|
165
166
|
onSubmit: S
|
|
166
167
|
}, null, 8, ["schema", "model-value"])
|
|
@@ -175,6 +176,6 @@ const Q = { class: "flex items-center justify-between" }, W = { class: "flex ite
|
|
|
175
176
|
}
|
|
176
177
|
});
|
|
177
178
|
export {
|
|
178
|
-
|
|
179
|
+
ge as default
|
|
179
180
|
};
|
|
180
181
|
//# sourceMappingURL=JSearchPanel.vue2.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"JSearchPanel.vue2.js","sources":["../../../../src/components/organisms/JSearchPanel.vue"],"sourcesContent":["<template>\n <Card class=\"w-full\">\n <!-- 헤더: 제목, Badge 목록, 초기화 버튼 -->\n <CardHeader class=\"pt-4 pb-3 px-6\">\n <div class=\"flex items-center justify-between\">\n <div class=\"flex items-center gap-3 flex-1\">\n <button\n v-if=\"collapsible\"\n type=\"button\"\n @click=\"isExpanded = !isExpanded\"\n class=\"flex items-center gap-2 font-semibold hover:text-primary transition-colors\"\n >\n <ChevronDown\n :class=\"['h-4 w-4 transition-transform', isExpanded ? 'rotate-0' : '-rotate-90']\"\n />\n {{ title }}\n </button>\n <CardTitle v-else class=\"mb-0\">{{ title }}</CardTitle>\n \n <!-- 조건 Badge 목록 -->\n <div v-if=\"conditionBadges.length > 0\" class=\"flex flex-wrap items-center gap-2 ml-2\">\n <JBadge\n v-for=\"badge in conditionBadges\"\n :key=\"badge.fieldName\"\n variant=\"secondary\"\n size=\"sm\"\n class=\"flex items-center gap-1.5 pr-1\"\n >\n <span>{{ badge.label }}: {{ badge.value }}</span>\n <button\n type=\"button\"\n @click.stop=\"handleFieldReset(badge.fieldName)\"\n class=\"h-4 w-4 rounded-full hover:bg-destructive/20 hover:text-destructive transition-colors flex items-center justify-center\"\n :aria-label=\"`${badge.label} 조건 제거`\"\n >\n <X class=\"h-3 w-3\" />\n </button>\n </JBadge>\n </div>\n </div>\n \n <JButton\n variant=\"outline\"\n size=\"sm\"\n @click.stop=\"handleReset\"\n >\n 초기화\n </JButton>\n </div>\n </CardHeader>\n \n <!-- 폼 내용 -->\n <CardContent v-show=\"isExpanded || !collapsible\" class=\"px-6 pb-6 pt-0\">\n <JDynamicForm\n ref=\"dynamicFormRef\"\n :schema=\"schema\"\n :model-value=\"localModelValue\"\n @update:model-value=\"handleFormValueUpdate\"\n @submit=\"handleSubmit\"\n />\n </CardContent>\n </Card>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, ref, reactive, watch } from 'vue'\nimport { ChevronDown, X } from 'lucide-vue-next'\nimport { Card, CardHeader, CardTitle, CardContent } from '@/components/shadcn'\nimport { JButton, JBadge } from '@/components/atoms'\nimport JDynamicForm from './JDynamicForm.vue'\nimport type { FormSchema, DynamicFormField } from '@/types/dynamic-form'\nimport type { ComponentPublicInstance } from 'vue'\n\ninterface ConditionBadge {\n fieldName: string\n label: string\n value: string\n}\n\nexport interface JSearchPanelProps {\n /** 패널 제목 */\n title?: string\n /** JDynamicForm에 전달할 FormSchema */\n schema: FormSchema\n /** JDynamicForm의 v-model 값 */\n modelValue?: Record<string, any>\n /** 기본 접힘 상태 */\n defaultCollapsed?: boolean\n /** 접기/펼치기 가능 여부 */\n collapsible?: boolean\n}\n\nconst props = withDefaults(defineProps<JSearchPanelProps>(), {\n title: '조회조건',\n defaultCollapsed: false,\n collapsible: true,\n})\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: Record<string, any>]\n 'submit': [values: Record<string, any>]\n 'reset': []\n}>()\n\nconst dynamicFormRef = ref<ComponentPublicInstance & { reset: () => void } | null>(null)\nconst isExpanded = ref(!props.defaultCollapsed)\n\n// 로컬 modelValue - reactive로 관리하여 양방향 바인딩\nconst localModelValue = reactive<Record<string, any>>(props.modelValue ? { ...props.modelValue } : {})\n\n// 내부 변경인지 외부 변경인지 구분하는 플래그\nlet isInternalUpdate = false\n\n// props.modelValue 변경 시 localModelValue 동기화 (외부 변경)\nwatch(\n () => props.modelValue,\n (newValue) => {\n if (newValue && !isInternalUpdate) {\n // 기존 키 중 새 값에 없는 것은 삭제\n Object.keys(localModelValue).forEach(key => {\n if (!(key in newValue)) {\n delete localModelValue[key]\n }\n })\n // 새 값으로 업데이트\n Object.assign(localModelValue, newValue)\n }\n isInternalUpdate = false\n },\n { deep: true, immediate: true }\n)\n\n// JDynamicForm에서 값이 변경되었을 때 처리\nfunction handleFormValueUpdate(value: Record<string, any>) {\n // JDynamicForm에서 emit된 값을 localModelValue에 반영\n isInternalUpdate = true\n Object.assign(localModelValue, value)\n // 상위로 emit\n emit('update:modelValue', { ...value })\n}\n\n// 모든 필드 가져오기\nconst allFields = computed((): DynamicFormField[] => {\n if (!props.schema) return []\n \n const fields: DynamicFormField[] = []\n if (props.schema.type === 'simple' && props.schema.fields) {\n fields.push(...props.schema.fields)\n } else if (props.schema.type === 'sectioned' && props.schema.sections) {\n props.schema.sections.forEach(section => {\n if (section.fields) fields.push(...section.fields)\n })\n } else if (props.schema.type === 'wizard' && props.schema.steps) {\n props.schema.steps.forEach(step => {\n if (step.fields) fields.push(...step.fields)\n })\n }\n return fields\n})\n\n// 조건 Badge 목록 생성\nconst conditionBadges = computed((): ConditionBadge[] => {\n if (!localModelValue || !props.schema) {\n return []\n }\n\n const badges: ConditionBadge[] = []\n const formState = localModelValue\n\n allFields.value.forEach((field) => {\n const value = formState[field.controlName]\n \n // 빈 값 체크 (빈 문자열, null, undefined, 'ALL', 'SELECT' 제외)\n if (\n value === undefined ||\n value === null ||\n value === '' ||\n value === 'ALL' ||\n value === 'SELECT' ||\n (field.type === 'checkbox' && value === 'N') ||\n (field.type === 'switch' && value === 'N')\n ) {\n return\n }\n\n // 필드 타입에 따라 값 표시\n let displayValue = String(value)\n\n // 콤보/검색콤보인 경우 옵션의 label 찾기\n if ((field.type === 'combo' || field.type === 'searchcombo') && field.options) {\n const option = field.options.find(opt => opt.value === value)\n if (option) {\n displayValue = option.label\n }\n }\n\n // 체크박스/스위치는 'Y'일 때만 표시\n if (field.type === 'checkbox' || field.type === 'switch') {\n if (value === 'Y') {\n badges.push({\n fieldName: field.controlName,\n label: field.label,\n value: field.inlineLabel || field.label\n })\n }\n } else {\n badges.push({\n fieldName: field.controlName,\n label: field.label,\n value: displayValue\n })\n }\n })\n\n return badges\n})\n\n// submit 핸들러\nfunction handleSubmit(values: Record<string, any>) {\n emit('submit', values)\n}\n\n// 전체 초기화 핸들러\nfunction handleReset() {\n if (dynamicFormRef.value) {\n dynamicFormRef.value.reset()\n emit('reset')\n }\n}\n\n// 필드별 초기화 핸들러\nfunction handleFieldReset(fieldName: string) {\n if (!localModelValue || !props.schema) return\n \n const field = allFields.value.find(f => f.controlName === fieldName)\n \n if (field) {\n // 필드 타입에 따라 초기값 설정 - reactive 객체 직접 수정\n if (field.type === 'checkbox' || field.type === 'switch') {\n localModelValue[fieldName] = 'N'\n } else {\n localModelValue[fieldName] = ''\n }\n \n // localModelValue 변경 후 상위로 emit하여 JDynamicForm에도 반영\n isInternalUpdate = true\n emit('update:modelValue', { ...localModelValue })\n }\n}\n</script>\n\n<style scoped>\n/* 필요시 스타일 추가 */\n</style>\n\n"],"names":["props","__props","emit","__emit","dynamicFormRef","ref","isExpanded","localModelValue","reactive","isInternalUpdate","watch","newValue","key","handleFormValueUpdate","value","allFields","computed","fields","section","step","conditionBadges","badges","formState","field","displayValue","option","opt","handleSubmit","values","handleReset","handleFieldReset","fieldName","f","_createBlock","_unref","Card","_createVNode","CardHeader","_createElementVNode","_hoisted_1","_hoisted_2","_createElementBlock","_cache","$event","ChevronDown","_createTextVNode","CardTitle","_openBlock","_hoisted_3","_Fragment","_renderList","badge","JBadge","_toDisplayString","_withModifiers","X","JButton","CardContent","JDynamicForm","_vShow"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"JSearchPanel.vue2.js","sources":["../../../../src/components/organisms/JSearchPanel.vue"],"sourcesContent":["<template>\n <Card class=\"w-full\">\n <!-- 헤더: 제목, Badge 목록, 초기화 버튼 -->\n <CardHeader class=\"pt-4 pb-3 px-6\">\n <div class=\"flex items-center justify-between\">\n <div class=\"flex items-center gap-3 flex-1\">\n <button\n v-if=\"collapsible\"\n type=\"button\"\n @click=\"isExpanded = !isExpanded\"\n class=\"flex items-center gap-2 font-semibold hover:text-primary transition-colors\"\n >\n <ChevronDown\n :class=\"['h-4 w-4 transition-transform', isExpanded ? 'rotate-0' : '-rotate-90']\"\n />\n {{ title }}\n </button>\n <CardTitle v-else class=\"mb-0\">{{ title }}</CardTitle>\n \n <!-- 조건 Badge 목록 -->\n <div v-if=\"conditionBadges.length > 0\" class=\"flex flex-wrap items-center gap-2 ml-2\">\n <JBadge\n v-for=\"badge in conditionBadges\"\n :key=\"badge.fieldName\"\n variant=\"secondary\"\n size=\"sm\"\n class=\"flex items-center gap-1.5 pr-1\"\n >\n <span>{{ badge.label }}: {{ badge.value }}</span>\n <button\n type=\"button\"\n @click.stop=\"handleFieldReset(badge.fieldName)\"\n class=\"h-4 w-4 rounded-full hover:bg-destructive/20 hover:text-destructive transition-colors flex items-center justify-center\"\n :aria-label=\"`${badge.label} 조건 제거`\"\n >\n <X class=\"h-3 w-3\" />\n </button>\n </JBadge>\n </div>\n </div>\n \n <JButton\n variant=\"outline\"\n size=\"sm\"\n @click.stop=\"handleReset\"\n >\n 초기화\n </JButton>\n </div>\n </CardHeader>\n \n <!-- 폼 내용 -->\n <CardContent v-show=\"isExpanded || !collapsible\" class=\"px-6 pb-6 pt-0\">\n <JDynamicForm\n ref=\"dynamicFormRef\"\n :schema=\"schema\"\n :model-value=\"localModelValue\"\n @update:model-value=\"handleFormValueUpdate\"\n @submit=\"handleSubmit\"\n />\n </CardContent>\n </Card>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, ref, reactive, watch } from 'vue'\nimport { ChevronDown, X } from 'lucide-vue-next'\nimport { Card, CardHeader, CardTitle, CardContent } from '@/components/shadcn'\nimport { JButton, JBadge } from '@/components/atoms'\nimport JDynamicForm from './JDynamicForm.vue'\nimport type { FormSchema, DynamicFormField } from '@/types/dynamic-form'\nimport type { ComponentPublicInstance } from 'vue'\n\ninterface ConditionBadge {\n fieldName: string\n label: string\n value: string\n}\n\nexport interface JSearchPanelProps {\n /** 패널 제목 */\n title?: string\n /** JDynamicForm에 전달할 FormSchema */\n schema: FormSchema\n /** JDynamicForm의 v-model 값 */\n modelValue?: Record<string, any>\n /** 기본 접힘 상태 */\n defaultCollapsed?: boolean\n /** 접기/펼치기 가능 여부 */\n collapsible?: boolean\n}\n\nconst props = withDefaults(defineProps<JSearchPanelProps>(), {\n title: '조회조건',\n defaultCollapsed: false,\n collapsible: true,\n})\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: Record<string, any>]\n 'submit': [values: Record<string, any>]\n 'reset': []\n}>()\n\nconst dynamicFormRef = ref<ComponentPublicInstance & { reset: () => void } | null>(null)\nconst isExpanded = ref(!props.defaultCollapsed)\n\n// 로컬 modelValue - reactive로 관리하여 양방향 바인딩\nconst localModelValue = reactive<Record<string, any>>(props.modelValue ? { ...props.modelValue } : {})\n\n// 내부 변경인지 외부 변경인지 구분하는 플래그\nlet isInternalUpdate = false\n\n// props.modelValue 변경 시 localModelValue 동기화 (외부 변경)\nwatch(\n () => props.modelValue,\n (newValue) => {\n if (newValue && !isInternalUpdate) {\n // 기존 키 중 새 값에 없는 것은 삭제\n Object.keys(localModelValue).forEach(key => {\n if (!(key in newValue)) {\n delete localModelValue[key]\n }\n })\n // 새 값으로 업데이트\n Object.assign(localModelValue, newValue)\n }\n isInternalUpdate = false\n },\n { deep: true, immediate: true }\n)\n\n// JDynamicForm에서 값이 변경되었을 때 처리\nfunction handleFormValueUpdate(value: Record<string, any>) {\n // JDynamicForm에서 emit된 값을 localModelValue에 반영\n isInternalUpdate = true\n Object.assign(localModelValue, value)\n // 상위로 emit\n emit('update:modelValue', { ...value })\n}\n\n// 모든 필드 가져오기\nconst allFields = computed((): DynamicFormField[] => {\n if (!props.schema) return []\n \n const fields: DynamicFormField[] = []\n if (props.schema.type === 'simple' && props.schema.fields) {\n fields.push(...props.schema.fields)\n } else if (props.schema.type === 'sectioned' && props.schema.sections) {\n props.schema.sections.forEach(section => {\n if (section.fields) fields.push(...section.fields)\n })\n } else if (props.schema.type === 'wizard' && props.schema.steps) {\n props.schema.steps.forEach(step => {\n if (step.fields) fields.push(...step.fields)\n })\n }\n return fields\n})\n\n// 조건 Badge 목록 생성\nconst conditionBadges = computed((): ConditionBadge[] => {\n if (!localModelValue || !props.schema) {\n return []\n }\n\n const badges: ConditionBadge[] = []\n const formState = localModelValue\n\n allFields.value.forEach((field) => {\n const value = formState[field.controlName]\n \n // 빈 값 체크 (빈 문자열, null, undefined, 'ALL', 'SELECT' 제외)\n if (\n value === undefined ||\n value === null ||\n value === '' ||\n value === 'ALL' ||\n value === 'SELECT' ||\n (field.type === 'checkbox' && value === 'N') ||\n (field.type === 'switch' && value === 'N')\n ) {\n return\n }\n\n // 필드 타입에 따라 값 표시\n let displayValue = String(value)\n\n // 콤보/검색콤보인 경우 옵션의 label 찾기\n if ((field.type === 'combo' || field.type === 'searchcombo') && field.options) {\n const option = field.options.find(opt => opt.value === value)\n if (option) {\n displayValue = option.label\n }\n }\n\n // 체크박스/스위치는 'Y'일 때만 표시\n if (field.type === 'checkbox' || field.type === 'switch') {\n if (value === 'Y') {\n badges.push({\n fieldName: field.controlName,\n label: field.label,\n value: field.inlineLabel || field.label\n })\n }\n } else {\n badges.push({\n fieldName: field.controlName,\n label: field.label,\n value: displayValue\n })\n }\n })\n\n return badges\n})\n\n// submit 핸들러\nfunction handleSubmit(values: Record<string, any>) {\n emit('submit', values)\n}\n\n// 전체 초기화 핸들러\nfunction handleReset() {\n if (dynamicFormRef.value) {\n dynamicFormRef.value.reset()\n emit('reset')\n }\n}\n\n// 필드별 초기화 핸들러\nfunction handleFieldReset(fieldName: string) {\n if (!localModelValue || !props.schema) return\n \n const field = allFields.value.find(f => f.controlName === fieldName)\n \n if (field) {\n // 필드 타입에 따라 초기값 설정 - reactive 객체 직접 수정\n if (field.type === 'checkbox' || field.type === 'switch') {\n localModelValue[fieldName] = 'N'\n } else {\n localModelValue[fieldName] = ''\n }\n \n // localModelValue 변경 후 상위로 emit하여 JDynamicForm에도 반영\n isInternalUpdate = true\n emit('update:modelValue', { ...localModelValue })\n }\n}\n</script>\n\n<style scoped>\n/* 필요시 스타일 추가 */\n</style>\n\n"],"names":["props","__props","emit","__emit","dynamicFormRef","ref","isExpanded","localModelValue","reactive","isInternalUpdate","watch","newValue","key","handleFormValueUpdate","value","allFields","computed","fields","section","step","conditionBadges","badges","formState","field","displayValue","option","opt","handleSubmit","values","handleReset","handleFieldReset","fieldName","f","_createBlock","_unref","Card","_createVNode","CardHeader","_createElementVNode","_hoisted_1","_hoisted_2","_createElementBlock","_cache","$event","ChevronDown","_createTextVNode","CardTitle","_openBlock","_hoisted_3","_Fragment","_renderList","badge","JBadge","_toDisplayString","_withModifiers","X","JButton","CardContent","JDynamicForm","_vShow"],"mappings":"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"}
|
package/index.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
require('./assets/styles/j-components.css');
|
|
2
2
|
require('./assets/styles/themes.css');
|
|
3
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});;/* empty css */;/* empty css */;/* empty css */const e=require("./components/atoms/JButton.vue.cjs"),t=require("./components/atoms/JInput.vue.cjs"),u=require("./components/atoms/JTextarea.vue.cjs"),_=require("./components/atoms/JCheckbox.vue.cjs"),r=require("./components/atoms/JCombo.vue.cjs"),a=require("./components/atoms/JSearchCombo.vue.cjs"),s=require("./components/atoms/JRadio.vue.cjs"),p=require("./components/atoms/JSwitch.vue.cjs"),i=require("./components/atoms/JDatepicker.vue.cjs"),n=require("./components/atoms/JDivider.vue.cjs"),
|
|
3
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});;/* empty css */;/* empty css */;/* empty css */const e=require("./components/atoms/JButton.vue.cjs"),t=require("./components/atoms/JInput.vue.cjs"),u=require("./components/atoms/JTextarea.vue.cjs"),_=require("./components/atoms/JCheckbox.vue.cjs"),r=require("./components/atoms/JCombo.vue.cjs"),a=require("./components/atoms/JSearchCombo.vue.cjs"),s=require("./components/atoms/JRadio.vue.cjs"),p=require("./components/atoms/JSwitch.vue.cjs"),i=require("./components/atoms/JDatepicker.vue.cjs"),n=require("./components/atoms/JDivider.vue.cjs"),o=require("./components/atoms/JLink.vue.cjs"),c=require("./components/atoms/JImage.vue.cjs"),l=require("./components/atoms/JBadge.vue.cjs"),J=require("./components/atoms/JProgress.vue.cjs");;/* empty css */const d=require("./components/atoms/JSpinner.vue.cjs"),v=require("./components/atoms/JAvatar.vue.cjs"),q=require("./components/atoms/JKbd.vue.cjs"),y=require("./components/atoms/JTooltip.vue.cjs"),g=require("./components/atoms/JIcon.vue.cjs"),f=require("./components/atoms/JLabel.vue.cjs"),b=require("./components/atoms/JPopover.vue.cjs"),m=require("./components/atoms/JGrid.vue.cjs"),S=require("vue-sonner"),C=require("./components/atoms/JToast.vue.cjs"),T=require("./components/molecules/JFormField.vue.cjs");;/* empty css */const A=require("./components/molecules/JGroupCombo.vue.cjs"),h=require("./components/molecules/JTabs.vue.cjs"),L=require("./components/molecules/JSearchAddr.vue.cjs"),P=require("./components/molecules/JContextMenu.vue.cjs"),B=require("./components/molecules/JCard.vue.cjs"),D=require("./components/molecules/JAlert.vue.cjs"),F=require("./components/molecules/JAccordion.vue.cjs"),M=require("./components/molecules/JTitlebar.vue.cjs"),k=require("./components/molecules/JButtonGroup.vue.cjs"),x=require("./components/molecules/JBreadcrumb.vue.cjs"),G=require("./components/organisms/JDynamicTabs.vue.cjs"),I=require("./components/organisms/JModal.vue.cjs"),j=require("./components/organisms/JFormModal.vue.cjs"),w=require("./components/organisms/JDynamicForm.vue.cjs"),H=require("./components/organisms/JSearchPanel.vue.cjs"),K=require("./components/organisms/JHeader.vue.cjs"),O=require("./components/organisms/JSidebarSimple.vue.cjs"),R=require("./components/organisms/JSidebarAdvanced.vue.cjs"),z=require("./components/organisms/JPageContainer.vue.cjs"),E=require("./components/templates/JLayout.vue.cjs"),N=require("./components/templates/JLayoutSimple.vue.cjs"),Q=require("./components/templates/JLayoutAdvanced.vue.cjs");exports.JButton=e.default;exports.JInput=t.default;exports.JTextarea=u.default;exports.JCheckbox=_.default;exports.JCombo=r.default;exports.JSearchCombo=a.default;exports.JRadio=s.default;exports.JSwitch=p.default;exports.JDatepicker=i.default;exports.JDivider=n.default;exports.JLink=o.default;exports.JImage=c.default;exports.JBadge=l.default;exports.JProgress=J.default;exports.JSpinner=d.default;exports.JAvatar=v.default;exports.JKbd=q.default;exports.JTooltip=y.default;exports.JIcon=g.default;exports.JLabel=f.default;exports.JPopover=b.default;exports.JGrid=m.default;Object.defineProperty(exports,"JToast",{enumerable:!0,get:()=>S.toast});exports.JToaster=C.default;exports.JFormField=T.default;exports.JGroupCombo=A.default;exports.JTabs=h.default;exports.JSearchAddr=L.default;exports.JContextMenu=P.default;exports.JCard=B.default;exports.JAlert=D.default;exports.JAccordion=F.default;exports.JTitlebar=M.default;exports.JButtonGroup=k.default;exports.JBreadcrumb=x.default;exports.JDynamicTabs=G.default;exports.JModal=I.default;exports.JFormModal=j.default;exports.JDynamicForm=w.default;exports.JSearchPanel=H.default;exports.JHeader=K.default;exports.JSidebarSimple=O.default;exports.JSidebarAdvanced=R.default;exports.JPageContainer=z.default;exports.JLayout=E.default;exports.JLayoutSimple=N.default;exports.JLayoutAdvanced=Q.default;
|
|
4
4
|
//# sourceMappingURL=index.cjs.map
|