Merge branch 'develop' into pr/16475

This commit is contained in:
syuilo 2025-09-01 12:33:59 +09:00
commit 081740b384
7 changed files with 29 additions and 15 deletions

View File

@ -44,10 +44,10 @@ SPDX-License-Identifier: AGPL-3.0-only
</template> </template>
<script lang="ts"> <script lang="ts">
type SupportedTypes = 'text' | 'password' | 'email' | 'url' | 'tel' | 'number' | 'search' | 'color'; type SupportedTypes = 'text' | 'password' | 'email' | 'url' | 'tel' | 'number' | 'search' | 'date' | 'time' | 'datetime-local' | 'color';
type ModelValueType<T extends SupportedTypes> = type ModelValueType<T extends SupportedTypes> =
T extends 'number' ? number : T extends 'number' ? number :
T extends 'text' | 'password' | 'email' | 'url' | 'tel' | 'search' | 'color' ? string : T extends 'text' | 'password' | 'email' | 'url' | 'tel' | 'search' | 'date' | 'time' | 'datetime-local' | 'color' ? string :
never; never;
</script> </script>

View File

@ -37,6 +37,8 @@ async function renderChart() {
chartInstance.destroy(); chartInstance.destroy();
} }
if (chartEl.value == null) return;
const getDate = (ago: number) => { const getDate = (ago: number) => {
const y = now.getFullYear(); const y = now.getFullYear();
const m = now.getMonth(); const m = now.getMonth();
@ -105,7 +107,6 @@ async function renderChart() {
type: 'time', type: 'time',
offset: true, offset: true,
time: { time: {
stepSize: 1,
unit: 'day', unit: 'day',
displayFormats: { displayFormats: {
day: 'M/d', day: 'M/d',
@ -149,7 +150,9 @@ async function renderChart() {
}, },
external: externalTooltipHandler, external: externalTooltipHandler,
}, },
...({ // TS
gradient, gradient,
}),
}, },
}, },
plugins: [chartVLine(vLineColor)], plugins: [chartVLine(vLineColor)],

View File

@ -42,6 +42,9 @@ const { handler: externalTooltipHandler } = useChartTooltip();
const { handler: externalTooltipHandler2 } = useChartTooltip(); const { handler: externalTooltipHandler2 } = useChartTooltip();
onMounted(async () => { onMounted(async () => {
if (chartEl.value == null) return;
if (chartEl2.value == null) return;
const now = isChromatic() ? new Date('2024-08-31T10:00:00Z') : new Date(); const now = isChromatic() ? new Date('2024-08-31T10:00:00Z') : new Date();
const getDate = (ago: number) => { const getDate = (ago: number) => {
@ -122,7 +125,6 @@ onMounted(async () => {
stacked: true, stacked: true,
offset: false, offset: false,
time: { time: {
stepSize: 1,
unit: 'day', unit: 'day',
}, },
grid: { grid: {
@ -144,7 +146,7 @@ onMounted(async () => {
ticks: { ticks: {
display: true, display: true,
//mirror: true, //mirror: true,
callback: (value, index, values) => value < 0 ? -value : value, callback: (value, index, values) => (value as number) < 0 ? -value : value,
}, },
}, },
}, },
@ -173,7 +175,9 @@ onMounted(async () => {
label: context => `${context.dataset.label}: ${Math.abs(context.parsed.y)}`, label: context => `${context.dataset.label}: ${Math.abs(context.parsed.y)}`,
}, },
}, },
...({ // TS
gradient, gradient,
}),
}, },
}, },
plugins: [chartVLine(vLineColor)], plugins: [chartVLine(vLineColor)],
@ -213,7 +217,6 @@ onMounted(async () => {
type: 'time', type: 'time',
offset: false, offset: false,
time: { time: {
stepSize: 1,
unit: 'day', unit: 'day',
displayFormats: { displayFormats: {
day: 'M/d', day: 'M/d',
@ -260,7 +263,9 @@ onMounted(async () => {
}, },
external: externalTooltipHandler2, external: externalTooltipHandler2,
}, },
...({ // TS
gradient, gradient,
}),
}, },
}, },
plugins: [chartVLine(vLineColor)], plugins: [chartVLine(vLineColor)],

View File

@ -161,7 +161,9 @@ async function renderChart() {
}, },
external: externalTooltipHandler, external: externalTooltipHandler,
}, },
...({ // TS
gradient, gradient,
}),
}, },
}, },
plugins: [chartVLine(vLineColor), chartLegend(legendEl.value)], plugins: [chartVLine(vLineColor), chartLegend(legendEl.value)],

View File

@ -160,7 +160,9 @@ async function renderChart() {
}, },
external: externalTooltipHandler, external: externalTooltipHandler,
}, },
...({ // TS
gradient, gradient,
}),
}, },
}, },
plugins: [chartVLine(vLineColor), chartLegend(legendEl.value)], plugins: [chartVLine(vLineColor), chartLegend(legendEl.value)],

View File

@ -154,8 +154,6 @@ async function renderChart() {
display: true, display: true,
text: 'Unique/Natural PV', text: 'Unique/Natural PV',
padding: { padding: {
left: 0,
right: 0,
top: 0, top: 0,
bottom: 12, bottom: 12,
}, },
@ -171,7 +169,9 @@ async function renderChart() {
}, },
external: externalTooltipHandler, external: externalTooltipHandler,
}, },
...({ // TS
gradient, gradient,
}),
}, },
}, },
plugins: [chartVLine(vLineColor), chartLegend(legendEl.value)], plugins: [chartVLine(vLineColor), chartLegend(legendEl.value)],

View File

@ -6,9 +6,11 @@
import type { Plugin } from 'chart.js'; import type { Plugin } from 'chart.js';
import MkChartLegend from '@/components/MkChartLegend.vue'; import MkChartLegend from '@/components/MkChartLegend.vue';
export const chartLegend = (legend: InstanceType<typeof MkChartLegend>) => ({ export const chartLegend = (legend: InstanceType<typeof MkChartLegend> | null | undefined) => ({
id: 'htmlLegend', id: 'htmlLegend',
afterUpdate(chart, args, options) { afterUpdate(chart, args, options) {
if (legend == null) return;
// Reuse the built-in legendItems generator // Reuse the built-in legendItems generator
const items = chart.options.plugins!.legend!.labels!.generateLabels!(chart); const items = chart.options.plugins!.legend!.labels!.generateLabels!(chart);