Răsfoiți Sursa

fix: add presets i18n in DatePicker (#1643)

YannLynn 2 ani în urmă
părinte
comite
7ee436eb2b

+ 2 - 1
packages/semi-ui/datePicker/datePicker.tsx

@@ -552,7 +552,7 @@ export default class DatePicker extends BaseComponent<DatePickerProps, DatePicke
     }
 
     renderQuickControls() {
-        const { presets, type, presetPosition, insetInput } = this.props;
+        const { presets, type, presetPosition, insetInput, locale } = this.props;
         return (
             <QuickControl
                 type={type}
@@ -560,6 +560,7 @@ export default class DatePicker extends BaseComponent<DatePickerProps, DatePicke
                 insetInput={insetInput}
                 presetPosition={presetPosition}
                 onPresetClick={(item, e) => this.foundation.handlePresetClick(item, e)}
+                locale={locale}
             />
         );
     }

+ 4 - 2
packages/semi-ui/datePicker/quickControl.tsx

@@ -18,6 +18,7 @@ export interface QuickControlProps {
     onPresetClick: (preset: PresetType, e: React.MouseEvent) => void;
     type: string;
     insetInput: DateInputFoundationProps['insetInput']
+    locale: any
 }
 
 class QuickControl extends PureComponent<QuickControlProps> {
@@ -27,6 +28,7 @@ class QuickControl extends PureComponent<QuickControlProps> {
         onPresetClick: PropTypes.func,
         type: PropTypes.string,
         insetInput: PropTypes.oneOfType([PropTypes.bool, PropTypes.object]),
+        locale: PropTypes.object,
     };
 
     static defaultProps = {
@@ -36,7 +38,7 @@ class QuickControl extends PureComponent<QuickControlProps> {
     };
 
     render() {
-        const { presets, onPresetClick, type, presetPosition, insetInput } = this.props;
+        const { presets, onPresetClick, type, presetPosition, insetInput, locale } = this.props;
         const isTypeRange = type === 'dateRange' || type === 'dateTimeRange';
         const isPanelTopAndBottom = presetPosition === 'top' || presetPosition === 'bottom';
         const isMonth = type === 'month';
@@ -75,7 +77,7 @@ class QuickControl extends PureComponent<QuickControlProps> {
         }
         return (
             <div className={wrapperCls} x-insetinput={insetInput ? "true" : "false"}>
-                {!isPanelTopAndBottom && <div className={headerCls}>快捷选择</div>}
+                {!isPanelTopAndBottom && <div className={headerCls}>{locale.presets}</div>}
                 <div className={contentWrapperCls}>
                     <div className={contentCls}>
                         {presets.map((item, index) => {

+ 14 - 1
packages/semi-ui/locale/_story/locale.stories.jsx

@@ -87,6 +87,19 @@ const CascaderDemo = () => {
 const I18nComponent = () => {
   const [modalVisible, setModalVisible] = useState(false);
   const style = { margin: 10 };
+  const presets = [
+        {
+            text: 'Today',
+            start: new Date(),
+            end: new Date(),
+        },
+        {
+            text: 'Tomorrow',
+            start: new Date(new Date().valueOf() + 1000 * 3600 * 24),
+            end: new Date(new Date().valueOf() + 1000 * 3600 * 24),
+        },
+    ];
+
   return (
     <>
       <Pagination total={100} showTotal showSizeChanger style={style} />
@@ -113,7 +126,7 @@ const I18nComponent = () => {
         <p>More content...</p>
       </Modal>
       <DatePicker style={{ ...style, width: 200 }} />
-      <DatePicker style={{ ...style, width: 250 }} type="dateTime" />
+      <DatePicker style={{ ...style, width: 250 }} type="dateTime" presets={presets} presetPosition="left"/>
       <DatePicker style={{ ...style, width: 250 }} type="dateRange" />
       <DatePicker style={{ ...style, width: 400 }} type="dateTimeRange" />
       <TimePicker style={style} />

+ 1 - 0
packages/semi-ui/locale/interface.ts

@@ -34,6 +34,7 @@ export interface Locale {
             dateTimeRange: [string, string];
             monthRange: [string, string]
         };
+        presets: string;
         footer: {
             confirm: string;
             cancel: string

+ 1 - 0
packages/semi-ui/locale/source/ar.ts

@@ -35,6 +35,7 @@ const local: Locale = {
             dateTimeRange: ['تاريخ البدء', 'تاريخ النهاية'],
             monthRange: ['الشهر الأول', 'الشهر الأخير'],
         },
+        presets: 'اختيار سريع',
         footer: {
             confirm: 'تؤكد',
             cancel: 'إلغاء',

+ 1 - 0
packages/semi-ui/locale/source/de.ts

@@ -35,6 +35,7 @@ const local: Locale = {
             dateTimeRange: ['Startdatum', 'Enddatum'],
             monthRange: ['Startmonat', 'Endmonat'],
         },
+        presets: 'Schnellauswahl',
         footer: {
             confirm: 'Bestätigen',
             cancel: 'Abbrechen',

+ 1 - 0
packages/semi-ui/locale/source/en_GB.ts

@@ -35,6 +35,7 @@ const local: Locale = {
             dateTimeRange: ['Start date', 'End date'],
             monthRange: ['Start month', 'End month'],
         },
+        presets: 'Presets',
         footer: {
             confirm: 'Confirm',
             cancel: 'Cancel',

+ 1 - 0
packages/semi-ui/locale/source/en_US.ts

@@ -35,6 +35,7 @@ const local: Locale = {
             dateTimeRange: ['Start date', 'End date'],
             monthRange: ['Start month', 'End month'],
         },
+        presets: 'Presets',
         footer: {
             confirm: 'Confirm',
             cancel: 'Cancel',

+ 1 - 0
packages/semi-ui/locale/source/es.ts

@@ -40,6 +40,7 @@ const locale: Locale = {
             dateTimeRange: ['Fecha inicial', 'Fecha final'],
             monthRange: ['Mes inicial', 'Mes final'],
         },
+        presets: 'Seleccionar rango',
         footer: {
             confirm: 'Aceptar',
             cancel: 'Cancelar',

+ 1 - 0
packages/semi-ui/locale/source/fr.ts

@@ -35,6 +35,7 @@ const local: Locale = {
             dateTimeRange: ['Date de début', 'Date de fin'],
             monthRange: ['Mois de début', 'Mois de fin'],
         },
+        presets: 'Préréglages',
         footer: {
             confirm: 'Confirmer',
             cancel: 'Annuler',

+ 1 - 0
packages/semi-ui/locale/source/id_ID.ts

@@ -35,6 +35,7 @@ const local: Locale = {
             dateTimeRange: ['Tanggal mulai', 'Tanggal akhir'],
             monthRange: ['Bulan pertama', 'Bulan terakhir'],
         },
+        presets: 'Pilihan cepat',
         footer: {
             confirm: 'Konfirmasi',
             cancel: 'Batalkan',

+ 1 - 0
packages/semi-ui/locale/source/it.ts

@@ -35,6 +35,7 @@ const local: Locale = {
             dateTimeRange: ['Data inizio', 'Data fine'],
             monthRange: ['Mese inizio', 'Mese fine'],
         },
+        presets: 'Preimpostazioni rapide',
         footer: {
             confirm: 'Conferma',
             cancel: 'Cancella',

+ 1 - 0
packages/semi-ui/locale/source/ja_JP.ts

@@ -35,6 +35,7 @@ const local: Locale = {
             dateTimeRange: ['開始日', '終了日'],
             monthRange: ['開始月', '終了月'],
         },
+        presets: 'クイック選択',
         footer: {
             confirm: '確認する',
             cancel: 'キャンセル',

+ 1 - 0
packages/semi-ui/locale/source/ko_KR.ts

@@ -36,6 +36,7 @@ const local: Locale = {
             dateTimeRange: ['시작 날짜', '종료일'],
             monthRange: ['시작 월', '종료 월'],
         },
+        presets: '빠른 선택',
         footer: {
             confirm: '확인',
             cancel: '취소',

+ 1 - 0
packages/semi-ui/locale/source/ms_MY.ts

@@ -35,6 +35,7 @@ const local: Locale = {
             dateTimeRange: ['Tarikh mula', 'Tarikh akhir'],
             monthRange: ['Bulan mula', 'Bulan akhir'],
         },
+        presets: 'Pilihan Pantas',
         footer: {
             confirm: 'Sahkan',
             cancel: 'Batal',

+ 1 - 0
packages/semi-ui/locale/source/nl_NL.ts

@@ -42,6 +42,7 @@ const local: Locale = {
             dateTimeRange: ['Begindatum', 'Einddatum'],
             monthRange: ['Begindatum', 'Einddatum'],
         },
+        presets: 'Snelle selectie',
         footer: {
             confirm: 'Bevestigen',
             cancel: 'Annuleren',

+ 1 - 0
packages/semi-ui/locale/source/pl_PL.ts

@@ -43,6 +43,7 @@ const local: Locale = {
             dateTimeRange: ['Data rozpoczęcia', 'Data zakończenia'],
             monthRange: ['Miesiąc rozpoczęcia', 'Miesiąc zakończenia'],
         },
+        presets: 'Szybki wybór',
         footer: {
             confirm: 'Potwierdź',
             cancel: 'Anuluj',

+ 1 - 0
packages/semi-ui/locale/source/pt_BR.ts

@@ -35,6 +35,7 @@ const local: Locale = {
             dateTimeRange: ['Data de início', 'Data de fim'],
             monthRange: ['Mês de início', 'Mês de fim'],
         },
+        presets: 'Seleção rápida',
         footer: {
             confirm: 'OK',
             cancel: 'Cancelar',

+ 1 - 0
packages/semi-ui/locale/source/ro.ts

@@ -37,6 +37,7 @@ export default {
             dateTimeRange: ['Data de început', 'Data de sfârșit'],
             monthRange: ['Luna de început', 'Luna de sfârșit'],
         },
+        presets: 'Selecții rapide',
         footer: {
             confirm: 'Confirmă',
             cancel: 'Anulează',

+ 1 - 0
packages/semi-ui/locale/source/ru_RU.ts

@@ -38,6 +38,7 @@ const local: Locale = {
             dateTimeRange: ['Дата начала', 'Дата окончания'],
             monthRange: ['Начальный месяц', 'Конечный месяц'],
         },
+        presets: 'Быстрый выбор',
         footer: {
             confirm: 'подтвердить',
             cancel: 'отмена',

+ 1 - 0
packages/semi-ui/locale/source/sv_SE.ts

@@ -40,6 +40,7 @@ const local: Locale = {
             dateTimeRange: ['Startdatum', 'Slutdatum'],
             monthRange: ['Startmånad', 'Slutmånad'],
         },
+        presets: 'Snabbval',
         footer: {
             confirm: 'Bekräfta',
             cancel: 'Avbryt',

+ 1 - 0
packages/semi-ui/locale/source/th_TH.ts

@@ -38,6 +38,7 @@ const local: Locale = {
             dateTimeRange: ['วันที่เริ่มต้น', 'วันที่สิ้นสุด'],
             monthRange: ['เดือนเริ่มต้น', 'เดือนสิ้นสุด'],
         },
+        presets: 'การเลือกด่วน',
         footer: {
             confirm: 'ตกลง',
             cancel: 'ยกเลิก',

+ 1 - 0
packages/semi-ui/locale/source/tr_TR.ts

@@ -38,6 +38,7 @@ const local: Locale = {
             dateTimeRange: ['Başlangıç tarihi', 'Bitiş tarihi'],
             monthRange: ['Başlangıç ​​ayı', 'Bitiş ayı']
         },
+        presets: 'Hızlı seçim',
         footer: {
             confirm: 'Tamam',
             cancel: 'İptal'

+ 1 - 0
packages/semi-ui/locale/source/vi_VN.ts

@@ -38,6 +38,7 @@ const local: Locale = {
             dateTimeRange: ['Ngày bắt đầu', 'Ngày kết thúc'],
             monthRange: ['Tháng bắt đầu', 'Tháng kết thúc'],
         },
+        presets: 'Lựa chọn nhanh',
         footer: {
             confirm: 'Xác nhận',
             cancel: 'Huỷ bỏ',

+ 1 - 0
packages/semi-ui/locale/source/zh_CN.ts

@@ -35,6 +35,7 @@ const local: Locale = {
             dateTimeRange: ['开始日期', '结束日期'],
             monthRange: ['开始月份', '结束月份'],
         },
+        presets: '快捷选择',
         footer: {
             confirm: '确定',
             cancel: '取消',

+ 1 - 0
packages/semi-ui/locale/source/zh_TW.ts

@@ -35,6 +35,7 @@ const local: Locale = {
             dateTimeRange: ['開始日期', '結束日期'],
             monthRange: ['開始月份', '結束月份'],
         },
+        presets: '快捷選擇',
         footer: {
             confirm: '確定',
             cancel: '取消',