> For the complete documentation index, see [llms.txt](https://tech.x2bee.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://tech.x2bee.com/dev-guide/dev-start/images-and-media/undefined-3.md).
# 숫자 및 날짜 변환 가이드
X2BEE 솔루션에서 사용하는 숫자 및 날짜 변환 방법에 대한 가이드를 제공합니다. Front와 BO에서의 숫자 변환 지침과 날짜 변환 예제 및 예상 결과를 설명합니다.
***
## 숫자 변환 가이드
#### BO 숫자변환 가이드 (format-number.ts)
```ts
export function fNumber(inputValue: InputNumberValue, options?: Options) {
const locale = formatNumberLocale() || DEFAULT_LOCALE
const number = processInput(inputValue)
if (number === null) return ''
const fm = new Intl.NumberFormat(locale.code, {
minimumFractionDigits: 0,
maximumFractionDigits: 2,
...options
}).format(number)
return fm
}
```
샘플
* fNumber(24000000) — 결과: 24,000,000
***
## 날짜 변환 가이드
#### BO 날짜변환 가이드 (common-utils.ts)
```ts
/**
* 날짜 변환
* Format을 사용자 지정
*/
export const convertFormatDate = (value: ConfigType, formatValue: string) =>
dayjs(value).format(formatValue)
/**
* 날짜 변환 Type1
* Format YYYY-MM-DD HH:mm:ss
*/
export const convertLocaleDateTime = (date: ConfigType) =>
dayjs(date).format(DATE_FORMAT.LOCAL_DATE_TIME)
/**
* 날짜 변환 Type2
* Format YYYY-MM-DD
*/
export const convertLocaleDate = (date: ConfigType) =>
dayjs(date).format(DATE_FORMAT.DEFAULT.DATE)
```
샘플
* convertFormatDate('2023-06-12T09:52:16', 'YYYY-MM-DD HH:mm');\
결과: 2023-06-12 09:52
* convertLocaleDateTime('2023-06-12T09:52:16');\
결과: 2023-06-12 09:52:16
{% hint style="info" %}
#### BO Locale
MUI 내에서 제공되는 `LocalizationProvider` 적용 및 `@mui/x-date-pickers` 컴포넌트를 사용합니다.
언어셋 변경 시, 변경된 언어셋에 해당되는 Date Format으로 자동 변환합니다.
`LocalizationProvider` 적용 방법은 다음 문서를 참고하세요:\
{% endhint %}
***
#### BO 날짜 패턴 상수 (common-constants.ts)
```ts
export const DATE_FORMAT = {
DATE_TIME: 'DD MMM YYYY h:mm a',
DATE: 'DD MMM YYYY',
TIME: 'h:mm a',
LOCAL_DATE_TIME: 'YYYY-MM-DDTHH:mm:ss',
SPLIT: {
DATE_TIME: 'DD/MM/YYYY h:mm a',
DATE: 'DD/MM/YYYY'
},
DEFAULT: {
DATE_TIME: 'YYYY-MM-DD HH:mm:ss',
DATE_TIME_WITH_MINUTE: 'YYYY-MM-DD HH:mm',
DATE: 'YYYY-MM-DD',
DOT_DATE: 'YYYY.MM.DD',
DATE_STRING: 'YYYYMMDD',
MONTH: 'YYYY-MM'
},
PARAM_CASE: {
DATE_TIME: 'DD-MM-YYYY h:mm a',
DATE: 'DD-MM-YYYY'
}
}
```
샘플
* convertFormatDate('2023-06-12T09:52:16', DATE\_FORMAT.DEFAULT.DATE\_TIME\_WITH\_MINUTE);\
결과: 2023-06-12 09:52
* convertFormatDate('2023-06-12T09:52:16', DATE\_FORMAT.DEFAULT.DATE\_TIME);\
결과: 2023-06-12 09:52:16
***
#### 날짜 패턴 유형
아래 표현을 참고하여 format에 넣어 사용하시면 됩니다.
| 토큰 | 예시 출력 | 설명 |
| ---- | ---------------- | --------------------------------- |
| YY | 01 | Two-digit year |
| YYYY | 2001 | Four-digit year |
| M | 1-12 | Month, beginning at 1 |
| MM | 01-12 | Month, 2-digits |
| MMM | Jan-Dec | The abbreviated month name |
| MMMM | January-December | The full month name |
| D | 1-31 | Day of month |
| DD | 01-31 | Day of month, 2-digits |
| H | 0-23 | Hours |
| HH | 00-23 | Hours, 2-digits |
| h | 1-12 | Hours, 12-hour clock |
| hh | 01-12 | Hours, 12-hour clock, 2-digits |
| m | 0-59 | Minutes |
| mm | 00-59 | Minutes, 2-digits |
| s | 0-59 | Seconds |
| ss | 00-59 | Seconds, 2-digits |
| S | 0-9 | Hundreds of milliseconds, 1-digit |
| SS | 00-99 | Tens of milliseconds, 2-digits |
| SSS | 000-999 | Milliseconds, 3-digits |
| Z | -05:00 | Offset from UTC |
| ZZ | -0500 | Compact offset from UTC, 2-digits |
| A | AM PM | Post or ante meridiem, upper-case |
| a | am pm | Post or ante meridiem, lower-case |
| Do | 1st...31st | Day of Month with ordinal |
| X | 1410715640.579 | Unix timestamp (seconds) |
| x | 1410715640579 | Unix timestamp (ms) |
---
# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.
## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter:
```
GET https://tech.x2bee.com/dev-guide/dev-start/images-and-media/undefined-3.md?ask=
```
The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.