theluyuan/layui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

✨(component): 修复月份范围选择与日期范围选择月份单位未翻译的问题

Browse Source
This commit is contained in:
就眠儀式 2022-10-25 17:41:14 +08:00
parent 6d1552f83b
commit ae2cdb8bf4
2 changed files with 38 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
package/component/src/component/datePicker/components/DateRange.vue
View File

@ -31,7 +31,7 @@
</lay-dropdown>
<lay-dropdown ref="dropdownMonthPanelRefLeft">
<span class="laydate-range-time"
>{{ startTime.month + 1 }} {{ t("datePicker.month") }}</span
> {{ MONTH_NAME[startTime.month] }}</span
>
<template #content>
<MonthPanel
@ -88,12 +88,9 @@
</lay-dropdown>
<lay-dropdown ref="dropdownMonthPanelRefRight">
<span class="laydate-range-time"
>{{
startTime.month + 2 > 12
? startTime.month - 10
: startTime.month + 2
}}
{{ t("datePicker.month") }}</span
> {{ MONTH_NAME[startTime.month + 1 > 11
? startTime.month + 1 - 12
: startTime.month + 1] }} </span
>
<template #content>
<MonthPanel
@ -180,7 +177,7 @@ export default {
};
</script>
<script lang="ts" setup>
import { inject, reactive, ref, watch } from "vue";
import { computed, inject, reactive, ref, watch } from "vue";
import { provideType } from "../interface";
import { setDateList } from "../day";
import PanelFoot from "./PanelFoot.vue";
@ -200,10 +197,26 @@ const emits = defineEmits([
"update:startTime",
"update:endTime",
]);
const datePicker: provideType = inject("datePicker") as provideType;
const { t } = useI18n();
const MONTH_NAME = computed(() => [
t("datePicker.january"),
t("datePicker.february"),
t("datePicker.march"),
t("datePicker.april"),
t("datePicker.may"),
t("datePicker.june"),
t("datePicker.july"),
t("datePicker.august"),
t("datePicker.september"),
t("datePicker.october"),
t("datePicker.november"),
t("datePicker.december"),
]);
const prevDateList = ref<any>([]);
const nextDateList = ref<any>([]);
const startTime = reactive({

32
package/component/src/component/datePicker/components/MonthRange.vue
View File

@ -144,21 +144,23 @@ const endTime = reactive({
? dayjs(props.endTime).hour(0).minute(0).second(0).valueOf()
: -1,
});
let hoverMonth = ref(-1);
const MONTH_NAME = [
"1月",
"2月",
"3月",
"4月",
"5月",
"6月",
"7月",
"8月",
"9月",
"10月",
"11月",
"12月",
];
const MONTH_NAME = computed(() => [
t("datePicker.january"),
t("datePicker.february"),
t("datePicker.march"),
t("datePicker.april"),
t("datePicker.may"),
t("datePicker.june"),
t("datePicker.july"),
t("datePicker.august"),
t("datePicker.september"),
t("datePicker.october"),
t("datePicker.november"),
t("datePicker.december"),
]);
// 切换年月
const changeYear = (num: number) => {
@ -284,7 +286,7 @@ const ifHasRangeHoverClass = computed(() => {
const getUnix = computed(() => {
return function (item: any, position: "left" | "right") {
let month = MONTH_NAME.indexOf(item);
let month = MONTH_NAME.value.indexOf(item);
let year = position === "left" ? startTime.year : startTime.year + 1;
return dayjs(year + "-" + (month + 1)).valueOf();
};