更新任务日程
This commit is contained in:
weipengfei
parent
77475478d8
commit
5c486b4ee5
@ -4,6 +4,18 @@ import request from '@/utils/request'
|
||||
export function apiTaskAdd(params: any) {
|
||||
return request.post({ url: '/task_scheduling_plan.task_scheduling_plan/add', params })
|
||||
}
|
||||
|
||||
//修改任务
|
||||
export function apiTaskEdit(params: any) {
|
||||
return request.post({ url: '/task_scheduling_plan.task_scheduling_plan/edit', params })
|
||||
}
|
||||
|
||||
//删除任务
|
||||
export function apiTaskDelete(params: any) {
|
||||
return request.post({ url: '/task_scheduling_plan.task_scheduling_plan/delete', params })
|
||||
}
|
||||
|
||||
|
||||
//任务日程-列表
|
||||
export function apiTaskList(params: any) {
|
||||
return request.get({ url: '/task_scheduling_plan.task_scheduling_plan/lists', params })
|
||||
|
||||
@ -1,132 +1,137 @@
|
||||
<template>
|
||||
<div class="dialog">
|
||||
<div class="dialog__trigger" @click="open">
|
||||
<!-- 触发弹窗 -->
|
||||
<slot name="trigger"></slot>
|
||||
</div>
|
||||
<el-dialog
|
||||
v-model="visible"
|
||||
:custom-class="customClass"
|
||||
:center="center"
|
||||
:append-to-body="true"
|
||||
:width="width"
|
||||
:close-on-click-modal="clickModalClose"
|
||||
@closed="close"
|
||||
>
|
||||
<!-- 弹窗内容 -->
|
||||
<template v-if="title" #header>{{ title }}</template>
|
||||
|
||||
<!-- 自定义内容 -->
|
||||
<slot>{{ content }}</slot>
|
||||
<!-- 底部弹窗页脚 -->
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button v-if="cancelButtonText" @click="handleEvent('cancel')">
|
||||
{{ cancelButtonText }}
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="confirmButtonText"
|
||||
type="primary"
|
||||
@click="handleEvent('confirm')"
|
||||
>
|
||||
{{ confirmButtonText }}
|
||||
</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<div class="dialog">
|
||||
<div class="dialog__trigger" @click="open">
|
||||
<!-- 触发弹窗 -->
|
||||
<slot name="trigger"></slot>
|
||||
</div>
|
||||
<el-dialog
|
||||
v-model="visible"
|
||||
:custom-class="customClass"
|
||||
:center="center"
|
||||
:append-to-body="true"
|
||||
:width="width"
|
||||
:close-on-click-modal="clickModalClose"
|
||||
@closed="close"
|
||||
>
|
||||
<!-- 弹窗内容 -->
|
||||
<template v-if="title" #header>{{ title }}</template>
|
||||
|
||||
<!-- 自定义内容 -->
|
||||
<slot>{{ content }}</slot>
|
||||
<!-- 底部弹窗页脚 -->
|
||||
<template v-if="button" #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button v-if="cancelButtonText" @click="handleEvent('cancel')">
|
||||
{{ cancelButtonText }}
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="confirmButtonText"
|
||||
type="primary"
|
||||
@click="handleEvent('confirm')"
|
||||
>
|
||||
{{ confirmButtonText }}
|
||||
</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
export default defineComponent({
|
||||
props: {
|
||||
title: {
|
||||
// 弹窗标题
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
content: {
|
||||
// 弹窗内容
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
confirmButtonText: {
|
||||
// 确认按钮内容
|
||||
type: [String, Boolean],
|
||||
default: '确定'
|
||||
},
|
||||
cancelButtonText: {
|
||||
// 取消按钮内容
|
||||
type: [String, Boolean],
|
||||
default: '取消'
|
||||
},
|
||||
width: {
|
||||
// 弹窗的宽度
|
||||
type: String,
|
||||
default: '400px'
|
||||
},
|
||||
disabled: {
|
||||
// 是否禁用
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
async: {
|
||||
// 是否开启异步关闭
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
clickModalClose: {
|
||||
// 点击遮罩层关闭对话窗口
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
center: {
|
||||
// 是否居中布局
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
customClass: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
props: {
|
||||
title: {
|
||||
// 弹窗标题
|
||||
type: String,
|
||||
default: "",
|
||||
},
|
||||
emits: ['confirm', 'cancel', 'close', 'open'],
|
||||
setup(props, { emit }) {
|
||||
const visible = ref(false)
|
||||
button: {
|
||||
// 是否显示按钮
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
content: {
|
||||
// 弹窗内容
|
||||
type: String,
|
||||
default: "",
|
||||
},
|
||||
confirmButtonText: {
|
||||
// 确认按钮内容
|
||||
type: [String, Boolean],
|
||||
default: "确定",
|
||||
},
|
||||
cancelButtonText: {
|
||||
// 取消按钮内容
|
||||
type: [String, Boolean],
|
||||
default: "取消",
|
||||
},
|
||||
width: {
|
||||
// 弹窗的宽度
|
||||
type: String,
|
||||
default: "400px",
|
||||
},
|
||||
disabled: {
|
||||
// 是否禁用
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
async: {
|
||||
// 是否开启异步关闭
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
clickModalClose: {
|
||||
// 点击遮罩层关闭对话窗口
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
center: {
|
||||
// 是否居中布局
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
customClass: {
|
||||
type: String,
|
||||
default: "",
|
||||
},
|
||||
},
|
||||
emits: ["confirm", "cancel", "close", "open"],
|
||||
setup(props, { emit }) {
|
||||
const visible = ref(false);
|
||||
|
||||
const handleEvent = (type: 'confirm' | 'cancel') => {
|
||||
emit(type)
|
||||
if (!props.async || type === 'cancel') {
|
||||
close()
|
||||
}
|
||||
}
|
||||
const handleEvent = (type: "confirm" | "cancel") => {
|
||||
emit(type);
|
||||
if (!props.async || type === "cancel") {
|
||||
close();
|
||||
}
|
||||
};
|
||||
|
||||
const close = () => {
|
||||
visible.value = false
|
||||
nextTick(() => {
|
||||
emit('close')
|
||||
})
|
||||
}
|
||||
const open = () => {
|
||||
if (props.disabled) {
|
||||
return
|
||||
}
|
||||
emit('open')
|
||||
visible.value = true
|
||||
}
|
||||
provide('visible', visible)
|
||||
return {
|
||||
visible,
|
||||
handleEvent,
|
||||
close,
|
||||
open
|
||||
}
|
||||
}
|
||||
})
|
||||
const close = () => {
|
||||
visible.value = false;
|
||||
nextTick(() => {
|
||||
emit("close");
|
||||
});
|
||||
};
|
||||
const open = () => {
|
||||
if (props.disabled) {
|
||||
return;
|
||||
}
|
||||
emit("open");
|
||||
visible.value = true;
|
||||
};
|
||||
provide("visible", visible);
|
||||
return {
|
||||
visible,
|
||||
handleEvent,
|
||||
close,
|
||||
open,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.dialog-body {
|
||||
white-space: pre-line;
|
||||
white-space: pre-line;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,92 +1,199 @@
|
||||
<template>
|
||||
<div class="edit-popup">
|
||||
<popup
|
||||
ref="popupRef"
|
||||
title="创建日程安排"
|
||||
:async="true"
|
||||
width="800px"
|
||||
@confirm="handleSubmit"
|
||||
@close="handleClose"
|
||||
>
|
||||
<el-form class="formdata" :model="detailsdt" label-width="120px">
|
||||
<el-form-item label="任务日期">
|
||||
<el-date-picker v-model="formData.time" type="date" placeholder="选择日期" />
|
||||
</el-form-item>
|
||||
<el-form-item label="任务模板">
|
||||
<el-input
|
||||
v-model="formData.template_name"
|
||||
@click="isShow = true"
|
||||
clearable
|
||||
placeholder="请输入任务模板"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</popup>
|
||||
<el-dialog v-model="isShow" title="选择任务" width="60%">
|
||||
<DialogIndex @customEvent="customEvent" />
|
||||
</el-dialog>
|
||||
</div>
|
||||
<div class="edit-popup">
|
||||
<popup
|
||||
ref="popupRef"
|
||||
:title="title"
|
||||
:async="true"
|
||||
width="800px"
|
||||
@confirm="handleSubmit"
|
||||
@close="handleClose"
|
||||
:clickModalClose="mode == 'show'"
|
||||
:button="mode != 'show'"
|
||||
>
|
||||
<el-form
|
||||
ref="formRef"
|
||||
:rules="rules"
|
||||
class="formdata"
|
||||
:model="formData"
|
||||
label-width="120px"
|
||||
>
|
||||
<el-form-item required label="任务日期" prop="datetime">
|
||||
<el-date-picker
|
||||
:disabled="isDisabled"
|
||||
v-model="formData.datetime"
|
||||
name="datetime"
|
||||
type="daterange"
|
||||
range-separator="至"
|
||||
start-placeholder="开始时间"
|
||||
end-placeholder="结束时间"
|
||||
@change="changeDateTime"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item required label="任务模板" prop="template_id">
|
||||
<el-input
|
||||
:disabled="isDisabled"
|
||||
v-model="formData.template_name"
|
||||
@click="isShow = true"
|
||||
name="template_id"
|
||||
clearable
|
||||
placeholder="请输入任务模板"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="mode == 'show'" label="">
|
||||
<el-button type="primary" @click="clickUpdate"> 修改 </el-button>
|
||||
<el-button type="danger" @click="clickDelete"> 删除 </el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</popup>
|
||||
<el-dialog v-model="isShow" title="选择任务" width="60%">
|
||||
<DialogIndex @customEvent="customEvent" />
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup name="taskEidt">
|
||||
import type { FormInstance } from 'element-plus'
|
||||
import Popup from '@/components/popup/index.vue'
|
||||
import { apiTaskAdd } from '@/api/task'
|
||||
import { reactive, onUpdated, type PropType } from 'vue'
|
||||
import DialogIndex from '@/views/task_template/list_two.vue'
|
||||
const route = useRoute()
|
||||
import type { FormInstance, FormRules } from "element-plus";
|
||||
import Popup from "@/components/popup/index.vue";
|
||||
import { apiTaskAdd, apiTaskEdit, apiTaskDelete } from "@/api/task";
|
||||
import { reactive, onUpdated, type PropType } from "vue";
|
||||
import DialogIndex from "@/views/task_template/list_two.vue";
|
||||
import { timeFormat } from "@/utils/util";
|
||||
import feedback from "@/utils/feedback";
|
||||
const route = useRoute();
|
||||
|
||||
const emit = defineEmits(['success', 'close'])
|
||||
const popupRef = shallowRef<InstanceType<typeof Popup>>()
|
||||
const mode = ref('add')
|
||||
const detailsdt = ref({})
|
||||
const isShow = ref(false)
|
||||
const emit = defineEmits(["success", "close"]);
|
||||
const popupRef = shallowRef<InstanceType<typeof Popup>>();
|
||||
const mode = ref("add");
|
||||
const detailsdt = ref({});
|
||||
const isShow = ref(false);
|
||||
const title = ref("创建日程安排");
|
||||
|
||||
const changeDateTime = (e: any) => {
|
||||
formData.start_time = timeFormat(e[0]);
|
||||
formData.end_time = timeFormat(e[1]);
|
||||
};
|
||||
|
||||
// 表单数据
|
||||
const formData = reactive({
|
||||
time: '',
|
||||
template_id: '',
|
||||
scheduling_id: '',
|
||||
template_name: ''
|
||||
})
|
||||
function customEvent(data: any) {
|
||||
isShow.value = false
|
||||
formData.template_id = data.id
|
||||
formData.template_name = data.title
|
||||
}
|
||||
if (route.query.id) {
|
||||
formData.scheduling_id = route.query.id.toString()
|
||||
id: "",
|
||||
create_user_id: "",
|
||||
status: "",
|
||||
template_id: "",
|
||||
scheduling_id: "",
|
||||
template_name: "",
|
||||
start_time: "",
|
||||
end_time: "",
|
||||
datetime: "",
|
||||
});
|
||||
|
||||
interface RuleForm {
|
||||
datetime: Date | String;
|
||||
template_id: String;
|
||||
}
|
||||
|
||||
const rules = reactive<FormRules<RuleForm>>({
|
||||
datetime: { required: true, message: "请选择时间范围", trigger: "blur" },
|
||||
template_id: {
|
||||
required: true,
|
||||
message: "请选择任务模板",
|
||||
trigger: "change",
|
||||
},
|
||||
});
|
||||
|
||||
function customEvent(data: any) {
|
||||
isShow.value = false;
|
||||
formData.template_id = data.id;
|
||||
formData.template_name = data.title;
|
||||
}
|
||||
if (route.query.id) {
|
||||
formData.scheduling_id = route.query.id.toString();
|
||||
}
|
||||
|
||||
const formRef = ref(null);
|
||||
|
||||
const props = defineProps({
|
||||
task: {
|
||||
type: Object,
|
||||
defualt: () => {
|
||||
null;
|
||||
},
|
||||
},
|
||||
});
|
||||
const isDisabled = ref(false);
|
||||
|
||||
const updatedForm = async () => {
|
||||
if (mode.value == "show") {
|
||||
title.value = "查看日程安排";
|
||||
isDisabled.value = true;
|
||||
Object.keys(formData).forEach((key: any) => {
|
||||
if (props.task[key] != null && props.task[key] != undefined)
|
||||
formData[key] = props.task[key];
|
||||
});
|
||||
formData.datetime = [
|
||||
formData.start_time.split(" ")[0],
|
||||
formData.end_time.split(" ")[0],
|
||||
];
|
||||
} else {
|
||||
isDisabled.value = false;
|
||||
Object.keys(formData).forEach((key: any) => {
|
||||
formData[key] = "";
|
||||
});
|
||||
}
|
||||
await nextTick();
|
||||
formRef.value.resetFields();
|
||||
};
|
||||
|
||||
const clickUpdate = () => {
|
||||
mode.value = "edit";
|
||||
isDisabled.value = false;
|
||||
};
|
||||
|
||||
// 删除
|
||||
const clickDelete = () => {
|
||||
feedback.confirm("确定要删除吗?").then(async (e) => {
|
||||
if (e == "confirm") {
|
||||
await apiTaskDelete({ id: formData.id });
|
||||
popupRef.value?.close();
|
||||
emit("success");
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// 提交按钮
|
||||
const handleSubmit = async () => {
|
||||
const data = { ...formData }
|
||||
console.log(data)
|
||||
mode.value == 'edit' ? await apiTaskAdd(data) : await apiTaskAdd(data)
|
||||
popupRef.value?.close()
|
||||
emit('success')
|
||||
}
|
||||
const handleSubmit = () => {
|
||||
if (mode.value == "show") return popupRef.value?.close();
|
||||
else
|
||||
formRef.value.validate(async (e: Boolean) => {
|
||||
if (e) {
|
||||
const data = { ...formData };
|
||||
mode.value == "edit" ? await apiTaskEdit(data) : await apiTaskAdd(data);
|
||||
popupRef.value?.close();
|
||||
emit("success");
|
||||
}
|
||||
});
|
||||
};
|
||||
//打开弹窗
|
||||
const open = (type = 'add') => {
|
||||
mode.value = type
|
||||
popupRef.value?.open()
|
||||
}
|
||||
const open = (type = "add") => {
|
||||
mode.value = type;
|
||||
popupRef.value?.open();
|
||||
};
|
||||
|
||||
// 关闭回调
|
||||
const handleClose = () => {
|
||||
emit('close')
|
||||
}
|
||||
emit("close");
|
||||
};
|
||||
|
||||
defineExpose({
|
||||
open
|
||||
})
|
||||
open,
|
||||
updatedForm,
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.formdata {
|
||||
.el-form-item {
|
||||
.el-date-picker {
|
||||
width: 100%;
|
||||
}
|
||||
.el-form-item {
|
||||
.el-date-picker {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,205 +1,213 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-card class="!border-none" v-loading="loading" shadow="never">
|
||||
<el-button v-perms="['flow_type/add']" type="primary" @click="handleAdd">
|
||||
<template #icon>
|
||||
<icon name="el-icon-Plus" />
|
||||
</template>
|
||||
新增
|
||||
</el-button>
|
||||
<div class="mt-4">
|
||||
<el-calendar v-model="dateValue">
|
||||
<template #dateCell="{ data }">
|
||||
<div style="width: 100%; height: 100%">
|
||||
<p
|
||||
:class="data.isSelected ? 'is-selected' : ''"
|
||||
style="padding: 8px 8px 0 8px"
|
||||
>
|
||||
{{ data.day.split('-').slice(1).join('-') }}
|
||||
<!-- {{ data.isSelected ? '✔️' : '' }} -->
|
||||
</p>
|
||||
<div>{{ dateNow(data.day) }}</div>
|
||||
<div
|
||||
class="task"
|
||||
:class="{
|
||||
fou: item.priority == 4,
|
||||
tow: item.priority == 2,
|
||||
the: item.priority == 3
|
||||
}"
|
||||
@click="handleEdit(item)"
|
||||
v-for="(item, index) in taskList"
|
||||
:key="index"
|
||||
>
|
||||
{{ item.title }}
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="task" style="color: var(--el-color-primary);">完成BUG测试</div>
|
||||
<div class="task" style="color: var(--el-color-danger);">完成BUG测试</div> -->
|
||||
</template>
|
||||
</el-calendar>
|
||||
<div>
|
||||
<el-card class="!border-none" v-loading="loading" shadow="never">
|
||||
<el-button v-perms="['flow_type/add']" type="primary" @click="handleAdd">
|
||||
<template #icon>
|
||||
<icon name="el-icon-Plus" />
|
||||
</template>
|
||||
新增
|
||||
</el-button>
|
||||
<div class="mt-4">
|
||||
<el-calendar v-model="dateValue">
|
||||
<template #dateCell="{ data }">
|
||||
<div style="width: 100%; height: 100%">
|
||||
<p
|
||||
:class="data.isSelected ? 'is-selected' : ''"
|
||||
style="padding: 8px 8px 0 8px"
|
||||
>
|
||||
{{ data.day.split("-").slice(1).join("-") }}
|
||||
</p>
|
||||
<div
|
||||
class="task"
|
||||
@click="clickTask(item)"
|
||||
v-for="(item, index) in taskListFilter(data.day)"
|
||||
:key="index"
|
||||
>
|
||||
{{ item.template_name }}
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
</el-calendar>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
<edit-popup
|
||||
ref="editRef"
|
||||
:dict-data="dictData"
|
||||
:dateValue="dateValue"
|
||||
:detailsdata="detailsdata"
|
||||
@success="loadTask"
|
||||
@close="showEdit = false"
|
||||
/>
|
||||
<EditTowPopup
|
||||
ref="editTowRef"
|
||||
:dict-data="dictData"
|
||||
:dateValue="dateValue"
|
||||
:detailsdata="detailsdata"
|
||||
@success="loadTask"
|
||||
@close="showEditTow = false"
|
||||
/>
|
||||
</div>
|
||||
<edit-popup
|
||||
ref="editRef"
|
||||
:dateValue="dateValue"
|
||||
@success="loadTask"
|
||||
@close="showEdit = false"
|
||||
/>
|
||||
<EditTowPopup
|
||||
ref="editTowRef"
|
||||
:task="task"
|
||||
:type="popupType"
|
||||
@success="loadTask"
|
||||
@close="showEditTow = false"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup name="task">
|
||||
import { timeFormat } from '@/utils/util'
|
||||
import feedback from '@/utils/feedback'
|
||||
import { timeFormat } from "@/utils/util";
|
||||
import feedback from "@/utils/feedback";
|
||||
// import { getRoutePath } from "router";
|
||||
import EditPopup from './edit.vue'
|
||||
import EditTowPopup from './editTow.vue'
|
||||
import { reactive, watch } from 'vue'
|
||||
import { apiTaskList, apiTaskDetails } from '@/api/task'
|
||||
import { apiTaskSchedulingPlanAdd } from '@/api/task_scheduling_plan'
|
||||
const route = useRoute()
|
||||
import EditPopup from "./edit.vue";
|
||||
import EditTowPopup from "./editTow.vue";
|
||||
import { reactive, watch } from "vue";
|
||||
import { apiTaskList, apiTaskDetails } from "@/api/task";
|
||||
import { apiTaskSchedulingPlanAdd } from "@/api/task_scheduling_plan";
|
||||
const route = useRoute();
|
||||
|
||||
const dateValue = ref(new Date())
|
||||
const detailsdata = reactive({
|
||||
create_time: '',
|
||||
create_user_id: 0,
|
||||
delete_time: '',
|
||||
end_time: '',
|
||||
extend: '',
|
||||
id: '',
|
||||
scheduling_id: '',
|
||||
sn: '',
|
||||
start_time: '',
|
||||
status: '',
|
||||
task_id: '',
|
||||
task_info: {
|
||||
admin_id: 0,
|
||||
content: '',
|
||||
create_time: '',
|
||||
delete_time: '',
|
||||
id: 0,
|
||||
money: '',
|
||||
status: 0,
|
||||
title: '',
|
||||
type: 0,
|
||||
type_name: '',
|
||||
update_time: ''
|
||||
},
|
||||
template_id: 0,
|
||||
update_time: ''
|
||||
})
|
||||
watch(
|
||||
() => dateValue,
|
||||
async (newValue, oldValue) => {
|
||||
const id = taskList.value.find(
|
||||
(item) => item.start_time.split(' ')[0] == timeFormat(newValue.value.getTime())
|
||||
)?.id
|
||||
if (id) {
|
||||
const res = await apiTaskDetails({ id })
|
||||
Object.keys(detailsdata).forEach((key) => {
|
||||
res[key] ? (detailsdata[key] = res[key]) : null
|
||||
})
|
||||
editRef.value?.open('add')
|
||||
initShowDate(timeFormat(newValue.value.getTime()))
|
||||
}
|
||||
},
|
||||
{ deep: true }
|
||||
)
|
||||
const dateValue = ref(new Date());
|
||||
// watch(
|
||||
// () => dateValue,
|
||||
// async (newValue, oldValue) => {
|
||||
// const id = taskList.value.find(
|
||||
// (item) =>
|
||||
// item.start_time.split(" ")[0] == timeFormat(newValue.value.getTime())
|
||||
// )?.id;
|
||||
// if (id) {
|
||||
// const res = await apiTaskDetails({ id });
|
||||
// Object.keys(detailsdata).forEach((key) => {
|
||||
// res[key] ? (detailsdata[key] = res[key]) : null;
|
||||
// });
|
||||
// editRef.value?.open("add");
|
||||
// initShowDate(timeFormat(newValue.value.getTime()));
|
||||
// }
|
||||
// },
|
||||
// { deep: true }
|
||||
// );
|
||||
|
||||
// 当前点击的任务
|
||||
const task = ref({
|
||||
create_user_id: 0,
|
||||
end_time: "",
|
||||
id: 0,
|
||||
scheduling_id: 0,
|
||||
start_time: "",
|
||||
status: 0,
|
||||
template_id: 0,
|
||||
template_name: "",
|
||||
});
|
||||
const popupType = ref("add");
|
||||
const clickTask = (e: any) => {
|
||||
popupType.value = "show";
|
||||
task.value = e;
|
||||
handleSelect();
|
||||
};
|
||||
|
||||
// 加载
|
||||
const loading = ref(true)
|
||||
const loading = ref(true);
|
||||
|
||||
const editRef = shallowRef<InstanceType<typeof EditPopup>>()
|
||||
const editTowRef = shallowRef<InstanceType<typeof EditPopup>>()
|
||||
const editRef = shallowRef<InstanceType<typeof EditPopup>>();
|
||||
const editTowRef = shallowRef<InstanceType<typeof EditPopup>>();
|
||||
// 是否显示编辑框
|
||||
const showEdit = ref(false)
|
||||
const showEditTow = ref(false)
|
||||
const showEdit = ref(false);
|
||||
const showEditTow = ref(false);
|
||||
|
||||
// 查询条件
|
||||
const queryParams = reactive({
|
||||
start_time: '',
|
||||
end_time: '',
|
||||
page_no: 1,
|
||||
pageSize: 150
|
||||
})
|
||||
start_time: "",
|
||||
end_time: "",
|
||||
page_no: 1,
|
||||
pageSize: 150,
|
||||
});
|
||||
|
||||
const taskList = ref<any>([])
|
||||
const taskList = ref<any>([]);
|
||||
|
||||
// 查询
|
||||
const loadTask = async () => {
|
||||
apiTaskList(queryParams).then((res) => {
|
||||
taskList.value = res.lists
|
||||
})
|
||||
loading.value = false
|
||||
}
|
||||
apiTaskList(queryParams).then((res) => {
|
||||
taskList.value = res.lists;
|
||||
});
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
const start_date = ref('')
|
||||
const end_date = ref('')
|
||||
const start_date = ref("");
|
||||
const end_date = ref("");
|
||||
// 计算当前显示的第一天和最后一天
|
||||
const initShowDate = (dateStr = '') => {
|
||||
const currentDate = dateStr ? new Date(dateStr) : new Date()
|
||||
const currentYear = currentDate.getFullYear()
|
||||
const currentMonth = currentDate.getMonth()
|
||||
const lastDay = new Date(currentYear, currentMonth + 1, 0).getDay() //获取第一天星期
|
||||
const startDay = new Date(currentYear, currentMonth, 1).getDay() //获取最后一天星期
|
||||
// console.log(new Date(currentYear, currentMonth, 1-startDay).getDate());
|
||||
// console.log(new Date(currentYear, currentMonth + 1, 6-lastDay).getDate());
|
||||
start_date.value = timeFormat(new Date(currentYear, currentMonth, 1 - startDay).getTime()) //获取第一天时间
|
||||
end_date.value = timeFormat(new Date(currentYear, currentMonth + 1, 6 - lastDay).getTime()) //获取最后一天时间
|
||||
if (queryParams.start_time != start_date.value) {
|
||||
queryParams.start_time = start_date.value
|
||||
queryParams.end_time = end_date.value
|
||||
loading.value = true
|
||||
loadTask()
|
||||
}
|
||||
}
|
||||
initShowDate()
|
||||
const dateNow = (day) => {
|
||||
return taskList.value.find((item) => item.start_time.split(' ')[0] == day)?.template_name
|
||||
}
|
||||
const initShowDate = (dateStr = "") => {
|
||||
const currentDate = dateStr ? new Date(dateStr) : new Date();
|
||||
const currentYear = currentDate.getFullYear();
|
||||
const currentMonth = currentDate.getMonth();
|
||||
const lastDay = new Date(currentYear, currentMonth + 1, 0).getDay(); //获取第一天星期
|
||||
const startDay = new Date(currentYear, currentMonth, 1).getDay(); //获取最后一天星期
|
||||
// console.log(new Date(currentYear, currentMonth, 1-startDay).getDate());
|
||||
// console.log(new Date(currentYear, currentMonth + 1, 6-lastDay).getDate());
|
||||
start_date.value = timeFormat(
|
||||
new Date(currentYear, currentMonth, 1 - startDay).getTime()
|
||||
); //获取第一天时间
|
||||
end_date.value = timeFormat(
|
||||
new Date(currentYear, currentMonth + 1, 6 - lastDay).getTime()
|
||||
); //获取最后一天时间
|
||||
if (queryParams.start_time != start_date.value) {
|
||||
queryParams.start_time = start_date.value;
|
||||
queryParams.end_time = end_date.value;
|
||||
loading.value = true;
|
||||
loadTask();
|
||||
}
|
||||
};
|
||||
initShowDate();
|
||||
|
||||
// 过滤的任务列表
|
||||
const taskListFilter = (e: any) => {
|
||||
return taskList.value
|
||||
.filter((item: any) => {
|
||||
let now = new Date(e).getTime() / 1000;
|
||||
let start = new Date(item.start_time).getTime() / 1000;
|
||||
let end = new Date(item.end_time).getTime() / 1000;
|
||||
return now - start >= 0 && now - end <= 0;
|
||||
})
|
||||
.slice(0, 5);
|
||||
};
|
||||
|
||||
// 添加
|
||||
const handleAdd = async () => {
|
||||
showEditTow.value = true
|
||||
await nextTick()
|
||||
editTowRef.value?.open('add')
|
||||
}
|
||||
popupType.value = "add";
|
||||
showEditTow.value = true;
|
||||
await nextTick();
|
||||
editTowRef.value?.open("add");
|
||||
editTowRef.value?.updatedForm();
|
||||
};
|
||||
// 查询
|
||||
const handleSelect = async () => {
|
||||
popupType.value = "show";
|
||||
showEditTow.value = true;
|
||||
await nextTick();
|
||||
editTowRef.value?.open("show");
|
||||
editTowRef.value?.updatedForm();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.is-selected {
|
||||
color: #1989fa;
|
||||
color: #1989fa;
|
||||
}
|
||||
.el-calendar-table .el-calendar-day {
|
||||
height: auto;
|
||||
min-height: 6.2rem;
|
||||
padding: 0;
|
||||
min-height: 8.2rem;
|
||||
padding: 0;
|
||||
}
|
||||
.task {
|
||||
font-size: 0.8rem;
|
||||
color: #f7ba2a;
|
||||
white-space: nowrap; /* 设置文本不换行 */
|
||||
overflow: hidden; /* 隐藏溢出的部分 */
|
||||
text-overflow: ellipsis; /* 在溢出的部分显示省略号 */
|
||||
font-size: 0.8rem;
|
||||
/* color: #f7ba2a; */
|
||||
color: #1989fa;
|
||||
padding: 0 8px;
|
||||
white-space: nowrap; /* 设置文本不换行 */
|
||||
overflow: hidden; /* 隐藏溢出的部分 */
|
||||
text-overflow: ellipsis; /* 在溢出的部分显示省略号 */
|
||||
&:hover {
|
||||
background-color: rgba($color: #f38200, $alpha: 0.7);
|
||||
border-radius: 4px;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
.the {
|
||||
color: #ff5100;
|
||||
color: #ff5100;
|
||||
}
|
||||
.tow {
|
||||
color: #f38200;
|
||||
color: #f38200;
|
||||
}
|
||||
.fou {
|
||||
color: red;
|
||||
color: red;
|
||||
}
|
||||
</style>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user