59 lines
1.4 KiB
Vue
59 lines
1.4 KiB
Vue
|
<!--
|
||
|
|
SPDX-FileCopyrightText: syuilo and other misskey contributors
|
||
|
|
SPDX-License-Identifier: AGPL-3.0-only
|
||
|
|
-->
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<div style="padding: 8px 16px">
|
||
|
|
<section>
|
||
|
|
<MkInput v-model="atDate" small type="date" class="input">
|
||
|
|
<template #label>{{ i18n.ts._poll.deadlineDate }}</template>
|
||
|
|
</MkInput>
|
||
|
|
<MkInput v-model="atTime" small type="time" class="input">
|
||
|
|
<template #label>{{ i18n.ts._poll.deadlineTime }}</template>
|
||
|
|
</MkInput>
|
||
|
|
</section>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script lang="ts" setup>
|
||
|
|
import { ref, watch } from 'vue';
|
||
|
|
import MkInput from './MkInput.vue';
|
||
|
|
import { formatDateTimeString } from '@/scripts/format-time-string.js';
|
||
|
|
import { addTime } from '@/scripts/time.js';
|
||
|
|
import { i18n } from '@/i18n.js';
|
||
|
|
|
||
|
|
const props = defineProps<{
|
||
|
|
modelValue: {
|
||
|
|
expiresAt: string;
|
||
|
|
};
|
||
|
|
}>();
|
||
|
|
const emit = defineEmits<{
|
||
|
|
(ev: 'update:modelValue', v: {
|
||
|
|
expiresAt: string;
|
||
|
|
}): void;
|
||
|
|
}>();
|
||
|
|
|
||
|
|
const atDate = ref(formatDateTimeString(addTime(new Date(), 1, 'day'), 'yyyy-MM-dd'));
|
||
|
|
const atTime = ref('00:00');
|
||
|
|
if ( props.modelValue && props.modelValue.expiresAt) {
|
||
|
|
atDate.value = atTime.value = props.modelValue.expiresAt;
|
||
|
|
}
|
||
|
|
|
||
|
|
function get() {
|
||
|
|
const calcAt = () => {
|
||
|
|
return new Date(`${atDate.value} ${atTime.value}`).getTime();
|
||
|
|
};
|
||
|
|
|
||
|
|
return {
|
||
|
|
...(
|
||
|
|
props.modelValue ? { expiresAt: calcAt() } : {}
|
||
|
|
),
|
||
|
|
};
|
||
|
|
}
|
||
|
|
|
||
|
|
watch([atDate, atTime], () => emit('update:modelValue', get()), {
|
||
|
|
deep: true,
|
||
|
|
});
|
||
|
|
</script>
|