|
@@ -0,0 +1,141 @@
|
|
|
+<template>
|
|
|
+ <BasicModal
|
|
|
+ :destroyOnClose="true"
|
|
|
+ :maskClosable="false"
|
|
|
+ v-bind="$attrs"
|
|
|
+ @register="registerModal"
|
|
|
+ title="节假日调整"
|
|
|
+ :width="1002"
|
|
|
+ :footer="null"
|
|
|
+ :default-fullscreen="true"
|
|
|
+ >
|
|
|
+ <div>
|
|
|
+ <a-button type="primary" @click="handleEdit({}, false)">节假日调课设置</a-button>
|
|
|
+ </div>
|
|
|
+ <Calendar
|
|
|
+ v-model:value="dataValue"
|
|
|
+ @panelChange="handelChange"
|
|
|
+ v-if="isLoad"
|
|
|
+ :disabledDate="disabledDate"
|
|
|
+ >
|
|
|
+ <template #dateCellRender="{ current }">
|
|
|
+ <div
|
|
|
+ class="c-item"
|
|
|
+ v-for="(item, index) in getListData(current)"
|
|
|
+ :key="index"
|
|
|
+ @click="handleDelete(item)"
|
|
|
+ >
|
|
|
+ <Tag :color="item.status === 3 ? '#f50' : '#108ee9'" closable @close.prevent>
|
|
|
+ {{ item.name }}
|
|
|
+ </Tag>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </Calendar>
|
|
|
+ <FormAdjust @register="registerFormModal" @success="handelSuccess" />
|
|
|
+ </BasicModal>
|
|
|
+</template>
|
|
|
+<script setup lang="ts">
|
|
|
+ import { ref, unref } from 'vue';
|
|
|
+ import { Calendar, Tag } from 'ant-design-vue';
|
|
|
+ import { BasicModal, useModal, useModalInner } from '/@/components/Modal';
|
|
|
+ import { Dayjs } from 'dayjs';
|
|
|
+ import { dateUtil, formatToDate } from '/@/utils/dateUtil';
|
|
|
+ import {
|
|
|
+ deleteHolidayHolidayDate,
|
|
|
+ getHolidayDateList,
|
|
|
+ } from '/@/services/apis/HolidayDateController';
|
|
|
+ import FormAdjust from './adjust.vue';
|
|
|
+ import { useMessage } from '/@/hooks/web/useMessage';
|
|
|
+
|
|
|
+ const { createConfirm, createMessage } = useMessage();
|
|
|
+ const [registerFormModal, { openModal }] = useModal();
|
|
|
+
|
|
|
+ const modelDataRef = ref<Recordable[]>([]);
|
|
|
+ const modelRef = ref<Recordable>({});
|
|
|
+
|
|
|
+ const dataValue = ref<Dayjs>();
|
|
|
+ const isLoad = ref<Boolean>(false);
|
|
|
+ defineEmits(['success', 'register']);
|
|
|
+
|
|
|
+ const [registerModal, { setModalProps }] = useModalInner(async (data) => {
|
|
|
+ dataValue.value = dateUtil(data.baseData.startDate);
|
|
|
+
|
|
|
+ modelRef.value = { ...data.baseData };
|
|
|
+ await getPageData(dataValue.value);
|
|
|
+ isLoad.value = true;
|
|
|
+ });
|
|
|
+
|
|
|
+ const getPageData = async (value) => {
|
|
|
+ setModalProps({ confirmLoading: true });
|
|
|
+
|
|
|
+ modelDataRef.value = await getHolidayDateList({
|
|
|
+ year: dateUtil(value).year(),
|
|
|
+ endDate: dateUtil(value).month() + 1,
|
|
|
+ });
|
|
|
+
|
|
|
+ setModalProps({ confirmLoading: false });
|
|
|
+ };
|
|
|
+
|
|
|
+ const handelChange = async (value: Dayjs) => {
|
|
|
+ await getPageData(value);
|
|
|
+ };
|
|
|
+
|
|
|
+ const getListData = (value: Dayjs) => {
|
|
|
+ const current = formatToDate(value);
|
|
|
+ const data = unref(modelDataRef);
|
|
|
+ const itemFilter = data.filter((item) => item.date === current);
|
|
|
+
|
|
|
+ const tabList: Recordable[] = [];
|
|
|
+ itemFilter.forEach((item) => {
|
|
|
+ // const status = statusOptions.filter((row) => row.value === item.status)[0]?.label;
|
|
|
+ if (item.status === 2 || item.status === 3) {
|
|
|
+ tabList.push({ id: item.id, status: item.status, name: item.status === 2 ? '班' : '休' });
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ return tabList;
|
|
|
+ };
|
|
|
+
|
|
|
+ const handleEdit = (record: any, isUpdate: boolean) => {
|
|
|
+ openModal(true, {
|
|
|
+ isUpdate: isUpdate,
|
|
|
+ baseData: {
|
|
|
+ ...record,
|
|
|
+ ...unref(modelRef),
|
|
|
+ },
|
|
|
+ });
|
|
|
+ };
|
|
|
+
|
|
|
+ const handleDelete = (record: any) => {
|
|
|
+ createConfirm({
|
|
|
+ iconType: 'warning',
|
|
|
+ title: '温馨提醒',
|
|
|
+ content: '是否删除该记录?',
|
|
|
+ onOk: async () => {
|
|
|
+ try {
|
|
|
+ await deleteHolidayHolidayDate([record.id]);
|
|
|
+ createMessage.success('删除成功');
|
|
|
+ await handelSuccess();
|
|
|
+ } catch (e) {
|
|
|
+ createMessage.error('删除失败');
|
|
|
+ }
|
|
|
+ },
|
|
|
+ okText: '确认',
|
|
|
+ cancelText: '取消',
|
|
|
+ });
|
|
|
+ };
|
|
|
+
|
|
|
+ const handelSuccess = async () => {
|
|
|
+ await getPageData(dataValue.value);
|
|
|
+ };
|
|
|
+
|
|
|
+ const disabledDate = (current) => {
|
|
|
+ return (
|
|
|
+ current &&
|
|
|
+ (formatToDate(current) < formatToDate(modelRef.value.startDate) ||
|
|
|
+ formatToDate(current) > formatToDate(modelRef.value.endDate))
|
|
|
+ );
|
|
|
+ };
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="less"></style>
|