sales-frontend-components 0.0.80 → 0.0.81

package/dist/index.d.ts

@@ -2,7 +2,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import { FieldValues, UseControllerProps } from 'react-hook-form';
 import { CheckboxButtonProps, CheckboxProps, DatePickerSingleHtmlProps, DatePickerRangeHtmlProps, FormField, SegmentGroupHtmlProps, SelectProps, OptionProps } from 'sales-frontend-design-system';
 import * as sales_frontend_api_method from 'sales-frontend-api/method';
-import { OccupationResponseDto, AddressStandardizationResponseDto, AddressResponseDto, OrganizationProfileResponse, EmployeeProfileResponseDto, Pagination } from 'sales-frontend-api/method';
+import { OccupationResponseDto, AddressStandardizationResponseDto, AddressResponseDto, OrganizationProfileResponse, EmployeeProfileResponseDto, CustomerSearchProps } from 'sales-frontend-api/method';
 import * as React$1 from 'react';
 import React__default from 'react';
 
@@ -264,42 +264,7 @@ interface JobSearchModalProps {
 }
 declare const JobSearchModal: React__default.FC<JobSearchModalProps>;
 
-interface DspResponseCustomerListResponseDto {
-    /** @description 성공여부 */
-    isSuccess?: boolean;
-    /** @description 코드 */
-    code?: string;
-    /** @description 메시지 */
-    message?: string;
-    data?: CustomerListResponseDto;
-    pagination?: Pagination;
-}
-interface CustomerListResponseDto {
-    /** @description 고객목록 */
-    custList?: CustomerDto[];
-    /** @description 총 건수 */
-    totalCount?: string;
-}
-/** @description 고객정보 */
-interface CustomerDto {
-    /** @description 고객ID */
-    customerId?: string;
-    /** @description 고객명 */
-    customerName?: string;
-    /** @description 기본주소 */
-    baseAddress?: string;
-    /** @description 상세주소 */
-    detailAddress?: string;
-    /** @description 생년월일(YYYYMMDD) */
-    birthDate?: string;
-    /** @description 성별코드 */
-    genderCode?: string;
-}
-interface CustomerSearchProps {
-    onSelect?: (customer: CustomerDto) => void;
-}
-
 declare const CustomerSearch: ({ onSelect }: CustomerSearchProps) => react_jsx_runtime.JSX.Element;
 
 export { Attachment, BankStockSearchModal, CustomerSearch, EmployeeSearchModal, FormCheckbox, FormCheckboxButton, FormDatePicker, FormDateRangePicker, FormSearchJobField, FormSegmentGroup, FormSelect, FormTextField, JobSearchModal, OrganizationSearchModal, StepIndicator, resize, testSignatureBase64Data, useAddressComponent, useBankStockSearch, useCamera, useCanvasPaint, useJobVehicleSearchModal, useSearchAddress };
-export type { AttachedPhoto, AttachmentProps, BankStockItem, BankStockSearchModalProps, CustomerDto, CustomerListResponseDto, CustomerSearchProps, DownloadProps, DspResponseCustomerListResponseDto, PaintProps, Pen, StepIndicatorProps, StepItem, cameraItemType, cameraOptions };
+export type { AttachedPhoto, AttachmentProps, BankStockItem, BankStockSearchModalProps, DownloadProps, PaintProps, Pen, StepIndicatorProps, StepItem, cameraItemType, cameraOptions };

package/dist/index.esm.js

@@ -2,7 +2,7 @@ import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import { useController } from 'react-hook-form';
 import { CheckboxButton, Checkbox, DatePicker, DateRangePicker, Accordion, Radio, Table, Button, FormField, Select, Tab, useModalState, Modal, SegmentGroup, ModalUtils, FormCore, RadioGroup, useDropDown, List, ListItem } from 'sales-frontend-design-system';
 import React, { useState, useEffect, useRef, useCallback, useMemo } from 'react';
-import { useSearchOccupationQuery, useSearchAddressQuery, useSearchPostalCodeQuery, useSearchAddressStandardizationQuery, useSearchOrganizationQuery, useSearchEmployeeProfileQuery, useSearchVehicleQuery } from 'sales-frontend-api/method';
+import { useSearchOccupationDetailQuery, useSearchOccupationQuery, useSearchAddressQuery, useSearchPostalCodeQuery, useSearchAddressStandardizationQuery, useSearchOrganizationQuery, useSearchEmployeeProfileQuery, useSearchVehicleQuery, useSearchCustomerListQuery } from 'sales-frontend-api/method';
 import { IconMainUiSearch, IconIllustCamera, IconGraphicsBankHsbc, IconGraphicsBankKebHana, IconGraphicsBankScJeil, IconGraphicsBankGyeongnam, IconGraphicsBankGwangju, IconGraphicsBankKukmin, IconGraphicsBankKiup, IconGraphicsBankJiyeokNonghyeop, IconGraphicsBankNhNonghyeop, IconGraphicsBankDaegu, IconGraphicsBankBusan, IconGraphicsBankSanlim, IconGraphicsBankSaneop, IconGraphicsBankSaemaulGeumgo, IconGraphicsBankSuhyeop, IconGraphicsBankSinhan, IconGraphicsBankSinhyeop, IconGraphicsBankOehwan, IconGraphicsBankWoori, IconGraphicsBankPost, IconGraphicsBankJeochuk, IconGraphicsBankJeonbuk, IconGraphicsBankJeju, IconGraphicsBankKakaoBank, IconGraphicsBankKBank, IconGraphicsBankHankookCity, IconGraphicsStockDbGeumyungTujajeungkwon, IconGraphicsStockKbJeungkwon, IconGraphicsStockNhWooriTujajeungkwon, IconGraphicsStockNhTujajeungkwon, IconGraphicsStockSkJeungkwon, IconGraphicsStockGyoboJeungkwon, IconGraphicsStockDaesinJeungkwon, IconGraphicsStockMeritzJeungkwon, IconGraphicsStockMiraeAssetJeungkwon, IconGraphicsStockBugukJeungkwon, IconGraphicsStockSamsungJeungkwon, IconGraphicsStockSinyeongJeungkwon, IconGraphicsStockSinhanTujajeungkwon, IconGraphicsStockYuantaJeungkwon, IconGraphicsStockYujinTujajeungkwon, IconGraphicsStockKiwoomJeungkwon, IconGraphicsStockHanaGeumyungTujajeungkwon, IconGraphicsStockHiTujajeungkwon, IconGraphicsStockHankookJeungkwonGeumyung, IconGraphicsStockHankookTujajeungkwon, IconGraphicsStockHanwhaTujajeungkwon, IconGraphicsStockHyundaiChaJeungkwon, IconGraphicsStockHochulEopsum, IconGraphicsFeedbackEmpty, IconIllustGrade, IconIllustJob, IconSubUiArrowRight, IconIllustVehicle } from 'sales-frontend-assets';
 import styles from './modal/pre-standard/job-search-modal/job-search-modal.module.scss';
 import styles$1 from './step-indicator/step-indicator.module.scss';
@@ -281,6 +281,73 @@ function JobSearchCategory({ filteredJobs, onJobSelect, searchTerm }) {
   ] }) });
 }
 
+function JobSearchDetail({ occupationTypeCode, occupationIndustryCode }) {
+  const { data: detail } = useSearchOccupationDetailQuery({
+    occupationIndustryCode,
+    occupationIndustryTypeCode: occupationTypeCode
+  });
+  if (!detail || !detail.data) {
+    return null;
+  }
+  const {
+    /** @description 직종해설내용 */
+    occupationExplanationContent,
+    /** @description 직업예시명 */
+    occupationExampleName,
+    /** @description 위험등급명 */
+    riskGradeName,
+    /** @description 위험등급코드 */
+    riskGradeCode,
+    /** @description 상해위험등급코드명 */
+    injuryRiskGradeCodeName,
+    /** @description 상해위험등급코드 */
+    injuryRiskGradeCode,
+    /** @description 입원등급코드명 */
+    hospitalizationGradeCodeName,
+    /** @description 입원등급코드 */
+    hospitalizationGradeCode,
+    /** @description 상해직종코드 */
+    injuryOccupationCode
+  } = detail.data;
+  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(Table, { variant: "horizontal", children: /* @__PURE__ */ jsxs("tbody", { children: [
+    /* @__PURE__ */ jsxs("tr", { children: [
+      /* @__PURE__ */ jsx("th", { className: "px-small", children: "\uC9C1\uC885 \uD574\uC124" }),
+      /* @__PURE__ */ jsx("td", { className: "px-small", children: occupationExplanationContent })
+    ] }),
+    /* @__PURE__ */ jsxs("tr", { children: [
+      /* @__PURE__ */ jsx("th", { className: "px-small", children: "\uC9C1\uC885 \uC608\uC2DC" }),
+      /* @__PURE__ */ jsx("td", { className: "px-small", children: occupationExampleName })
+    ] }),
+    /* @__PURE__ */ jsxs("tr", { children: [
+      /* @__PURE__ */ jsx("th", { className: "px-small", children: "\uC704\uD5D8 \uB4F1\uAE09" }),
+      /* @__PURE__ */ jsxs("td", { className: "px-small", children: [
+        riskGradeName,
+        "(",
+        riskGradeCode,
+        ")"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("tr", { children: [
+      /* @__PURE__ */ jsx("th", { className: "px-small", children: "\uC785\uC6D0 \uB4F1\uAE09" }),
+      /* @__PURE__ */ jsxs("td", { className: "px-small", children: [
+        hospitalizationGradeCodeName,
+        "(",
+        hospitalizationGradeCode,
+        ")"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("tr", { children: [
+      /* @__PURE__ */ jsx("th", { className: "px-small", children: "\uC0C1\uD574 \uB4F1\uAE09" }),
+      /* @__PURE__ */ jsxs("td", { className: "px-small", children: [
+        injuryRiskGradeCodeName,
+        "(",
+        injuryRiskGradeCode,
+        ")"
+      ] })
+    ] })
+  ] }) }) });
+}
+
 const cx$d = classNames.bind(styles);
 function JobSearchFavorite({ filteredJobs, onJobSelect }) {
   return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", { className: cx$d("popular-jobs"), children: [
@@ -306,7 +373,13 @@ function JobSearchFavorite({ filteredJobs, onJobSelect }) {
               ]
             }
           ) }),
-          /* @__PURE__ */ jsx(Accordion.Content, { variant: "text", children: "\uD56D\uBAA9 1 \uB0B4\uC6A9" })
+          /* @__PURE__ */ jsx(Accordion.Content, { variant: "text", children: /* @__PURE__ */ jsx(
+            JobSearchDetail,
+            {
+              occupationTypeCode: job.occupationTypeCode || "",
+              occupationIndustryCode: job.occupationIndustryCode
+            }
+          ) })
         ]
       },
       `item-${job.occupationIndustryCode}-${index}`
@@ -339,22 +412,13 @@ function JobSearchResult({ filteredJobs, onJobSelect, searchTerm }) {
               children: highlightOnSearchKeyword$1(job.occupationIndustryName, searchTerm)
             }
           ) }) }),
-          /* @__PURE__ */ jsx(Accordion.Content, { variant: "text", children: /* @__PURE__ */ jsx(Table, { variant: "horizontal", children: /* @__PURE__ */ jsxs("tbody", { children: [
-            /* @__PURE__ */ jsxs("tr", { children: [
-              /* @__PURE__ */ jsx("th", { children: "\uD5E4\uB354 1" }),
-              /* @__PURE__ */ jsx("td", { className: "px-24", children: "1\uD589 1\uBC88\uC9F8" }),
-              /* @__PURE__ */ jsx("th", { children: "\uD5E4\uB354 1-2" }),
-              /* @__PURE__ */ jsx("td", { className: "px-24 ", children: "1\uD589 2\uBC88\uC9F8" })
-            ] }),
-            /* @__PURE__ */ jsxs("tr", { children: [
-              /* @__PURE__ */ jsx("th", { children: "\uD5E4\uB354 2" }),
-              /* @__PURE__ */ jsx("td", { className: "pl-24 pr-16", colSpan: 3, children: /* @__PURE__ */ jsxs("p", { className: "d-flex-center-center", children: [
-                "2\uD589 1\uBC88\uC9F8 ",
-                /* @__PURE__ */ jsx("span", { className: "flex-1 pipe-left", children: "\uC11C\uBE0C\uD14D\uC2A4\uD2B8" }),
-                /* @__PURE__ */ jsx(Button, { variant: "neutral", size: "xsmall", appearance: "outline", children: "\uBC84\uD2BC\uBA85" })
-              ] }) })
-            ] })
-          ] }) }) })
+          /* @__PURE__ */ jsx(Accordion.Content, { variant: "text", children: /* @__PURE__ */ jsx(
+            JobSearchDetail,
+            {
+              occupationTypeCode: job.occupationTypeCode || "",
+              occupationIndustryCode: job.occupationIndustryCode
+            }
+          ) })
         ]
       },
       job.occupationIndustryCode
@@ -2384,34 +2448,20 @@ const JobSearchModal = ({ onClose }) => {
   ] });
 };
 
-const mockCustomers = [
-  { customerId: "1", customerName: "\uAE40\uD55C\uD654", birthDate: "1999.01.01", genderCode: "\uB0A8\uC131" },
-  {
-    customerId: "2",
-    customerName: "\uAE40\uD55C\uD654\uC0DD\uBA85",
-    birthDate: "1989.01.01",
-    genderCode: "\uC5EC\uC131",
-    baseAddress: "\uC11C\uC6B8\uC2DC \uB9C8\uD3EC\uAD6C"
-  },
-  {
-    customerId: "3",
-    customerName: "\uAE40\uD55C\uD654\uC190\uD574\uBCF4\uD5D8",
-    birthDate: "1999.01.01",
-    genderCode: "\uB0A8\uC131",
-    baseAddress: "\uC11C\uC6B8\uC2DC \uB9C8\uD3EC\uAD6C"
-  }
-];
 const useCustomerSearch = (onSelect) => {
   const { triggerRef, isOpen, setIsOpen, DropDown } = useDropDown();
   const [searchKeyword, setSearchKeyword] = useState("");
   const [searchInput, setSearchInput] = useState("");
   const [customerList, setCustomerList] = useState([]);
   const [selectedCustomer, setSelectedCustomer] = useState(null);
+  const { data } = useSearchCustomerListQuery({ customerName: searchKeyword });
   const search = () => {
     if (searchInput.length >= 2) {
       setSearchKeyword(searchInput);
-      const filtered = mockCustomers.filter((c) => c.customerName?.toLowerCase().includes(searchInput.toLowerCase()));
-      setCustomerList(filtered);
+      const filtered = data?.data?.custList?.filter(
+        (c) => c.customerName?.toLowerCase().includes(searchInput.toLowerCase())
+      );
+      setCustomerList(filtered || []);
       setIsOpen(true);
     } else {
       setCustomerList([]);