fix rest day style in chart

src/components/DateRangeChartCard.vue

@@ -24,7 +24,7 @@ import type { EChartsOption } from "echarts";
 import ChartRangeSlider from "@/components/ChartRangeSlider.vue";
 import { useStoreChart, useStoreChartWindow } from "@/pages/store/component/useStoreChart";
 
-type ChartOptionBuilder = (visibleDateTextList: string[]) => EChartsOption;
+type ChartOptionBuilder = (visibleDateTextList: string[], chartWidth: number) => EChartsOption;
 
 const props = withDefaults(defineProps<{
 	caption?: string;
@@ -42,6 +42,7 @@ const props = withDefaults(defineProps<{
 });
 
 const dateTextList = computed(() => props.dateTextList);
+const chartWidth = ref(window.innerWidth);
 const {
 	rangeText,
 	showSlider: chartShowSlider,
@@ -51,9 +52,27 @@ const {
 	handleSliderChange
 } = useStoreChartWindow(dateTextList);
 const option = computed<EChartsOption>(() => typeof props.option === "function"
-	? props.option(visibleDateTextList.value)
+	? props.option(visibleDateTextList.value, chartWidth.value)
 	: props.option);
 const { chartElement } = useStoreChart(option);
+let resizeObserver: ResizeObserver | undefined;
+
+onMounted(() => {
+	resizeObserver = new window.ResizeObserver(updateChartWidth);
+	if (chartElement.value) {
+		resizeObserver.observe(chartElement.value);
+		updateChartWidth();
+	}
+});
+
+onBeforeUnmount(() => {
+	resizeObserver?.disconnect();
+	resizeObserver = undefined;
+});
+
+function updateChartWidth(): void {
+	chartWidth.value = chartElement.value?.clientWidth || window.innerWidth;
+}
 </script>
 
 <style scoped lang="less">