19 changed files with 3631 additions and 202 deletions
@ -0,0 +1,152 @@ |
|||||
|
<!-- |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 08:04:30 |
||||
|
@ 备注: 批量导入班组人员 |
||||
|
--> |
||||
|
<script lang="ts" setup> |
||||
|
import { analysisRedisTimesExelect } from "@/api/hr/people/index"; |
||||
|
|
||||
|
const props = defineProps({ |
||||
|
id: { |
||||
|
type: String, |
||||
|
default: "", |
||||
|
}, |
||||
|
isShow: { |
||||
|
type: Boolean, |
||||
|
default: false, |
||||
|
}, |
||||
|
}); |
||||
|
const excelUpload = ref<any>(); |
||||
|
const emits = defineEmits(["update:isShow", "closeOpen"]); |
||||
|
//上传地址 |
||||
|
const uploadFFurl = |
||||
|
import.meta.env.VITE_APP_BASE_API + "/hrapi/staff/uploadTiemsManFiles"; |
||||
|
const excelLoading = ref(false); |
||||
|
const peopleMsg = ref<string[]>([]); |
||||
|
const progressSize = ref(0); |
||||
|
const redisListKey = ref<string>(); |
||||
|
const totalNum = ref<number>(); |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 08:20:49 |
||||
|
@ 功能: 上传前先检查文件 |
||||
|
*/ |
||||
|
function handleExcelChangeTemp(file: UploadFile) { |
||||
|
excelLoading.value = true; |
||||
|
if (!/\.(xlsx|xls|XLSX|XLS)$/.test(file.name)) { |
||||
|
ElMessage.warning("上传Excel只能为xlsx、xls格式"); |
||||
|
excelLoading.value = false; |
||||
|
return false; |
||||
|
} |
||||
|
} |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 08:22:50 |
||||
|
@ 功能: 上传文件错误处理 |
||||
|
*/ |
||||
|
const uploadError = (response: any, uploadFile: UploadFile, uploadFiles: UploadFiles) => { |
||||
|
excelLoading.value = false; |
||||
|
peopleMsg.value.push( |
||||
|
"响应时间过长,系统自动转为后台静默处理,可先关闭窗口!完成时间大约90分钟。请于90分钟后刷新信息" |
||||
|
); |
||||
|
}; |
||||
|
|
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 08:28:35 |
||||
|
@ 功能: 监控弹窗状态 |
||||
|
*/ |
||||
|
watch( |
||||
|
() => props.isShow, |
||||
|
(val: boolean) => { |
||||
|
if (!val) { |
||||
|
peopleMsg.value = []; |
||||
|
excelLoading.value = false; |
||||
|
progressSize.value = 0; |
||||
|
} |
||||
|
}, |
||||
|
{ deep: true } |
||||
|
); |
||||
|
let jiBuQiVal = 0; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 08:31:36 |
||||
|
@ 功能: 上传成功 |
||||
|
*/ |
||||
|
const uploadTrue = (response: any, uploadFile: UploadFile, uploadFiles: UploadFiles) => { |
||||
|
// excelLoading.value = false; |
||||
|
console.log("上传完成此次乘车", response); |
||||
|
jiBuQiVal = 0; |
||||
|
progressSize.value = 0; |
||||
|
if (response.code == 0) { |
||||
|
peopleMsg.value.push("文件上传成功!开始解析数据并写入数据库!"); |
||||
|
redisListKey.value = response.data.redisListKey; |
||||
|
totalNum.value = response.data.totalNum; |
||||
|
inintTimeDatas(); |
||||
|
} else { |
||||
|
peopleMsg.value.push("文件上传失败!请重新上传文件!"); |
||||
|
} |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 10:02:26 |
||||
|
@ 功能: 写入数据 |
||||
|
*/ |
||||
|
const inintTimeDatas = () => { |
||||
|
if (jiBuQiVal < totalNum.value) { |
||||
|
let sendInfo = { |
||||
|
timeId: props.id.toString(), |
||||
|
redisListKey: redisListKey.value, |
||||
|
number: jiBuQiVal, |
||||
|
}; |
||||
|
analysisRedisTimesExelect(sendInfo).then((data: any) => { |
||||
|
peopleMsg.value.push(data.data.msgStr); |
||||
|
jiBuQiVal++; |
||||
|
progressSize.value = Math.round((jiBuQiVal / totalNum.value) * 10000) / 100; |
||||
|
inintTimeDatas(); |
||||
|
}); |
||||
|
} else { |
||||
|
excelLoading.value = false; |
||||
|
progressSize.value = 100; |
||||
|
excelUpload.value.clearFiles(); |
||||
|
} |
||||
|
}; |
||||
|
</script> |
||||
|
<template> |
||||
|
<el-row> |
||||
|
<el-col |
||||
|
:span="24" |
||||
|
v-loading="excelLoading" |
||||
|
element-loading-text="文档解析中,请稍候..." |
||||
|
> |
||||
|
<el-upload |
||||
|
ref="excelUpload" |
||||
|
class="upload-demo" |
||||
|
drag |
||||
|
:action="uploadFFurl" |
||||
|
:data="{ timeId: props.id.toString() }" |
||||
|
:before-upload="handleExcelChangeTemp" |
||||
|
:on-success="uploadTrue" |
||||
|
:on-error="uploadError" |
||||
|
:show-file-list="false" |
||||
|
multiple |
||||
|
> |
||||
|
<el-icon class="el-icon--upload"><upload-filled /></el-icon> |
||||
|
<div class="el-upload__text">将电子表格拖到此处或 <em>单击上载</em></div> |
||||
|
</el-upload> |
||||
|
</el-col> |
||||
|
<el-col :span="24"> |
||||
|
<el-progress :text-inside="true" :stroke-width="20" :percentage="progressSize"> |
||||
|
<span>已完成:{{ progressSize }}%</span> |
||||
|
</el-progress> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
<el-scrollbar height="300px" ref="scrollbarRef" always> |
||||
|
<div ref="innerRef"> |
||||
|
<p v-for="(item, index) in peopleMsg" :key="index" class="scrollbar-demo-item"> |
||||
|
{{ item }} |
||||
|
</p> |
||||
|
</div> |
||||
|
</el-scrollbar> |
||||
|
</template> |
||||
|
<style lang="scss" scoped></style> |
||||
@ -0,0 +1,398 @@ |
|||||
|
<!-- |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 13:33:45 |
||||
|
@ 备注: 添加班组轮询规则 |
||||
|
--> |
||||
|
<script lang="ts" setup> |
||||
|
import { workTimeInfo, ruleInfo, TimesClassInfo } from "@/api/hr/people/type"; |
||||
|
import { teamcontlist } from "@/api/hr/org/index"; |
||||
|
import { addTeamTime } from "@/api/hr/people/index"; |
||||
|
const props = defineProps({ |
||||
|
open: { |
||||
|
type: Boolean, |
||||
|
default: false, |
||||
|
}, |
||||
|
teamInfo: { |
||||
|
type: Object, |
||||
|
default() { |
||||
|
return {}; |
||||
|
}, |
||||
|
}, |
||||
|
}); |
||||
|
const tiemList = ref<string[]>([]); |
||||
|
const emits = defineEmits(["update:open", "restdata"]); |
||||
|
const sunmitBut = ref(false); |
||||
|
const formInfo = reactive({ |
||||
|
name: "", |
||||
|
}); |
||||
|
const worktimeList = ref<workTimeInfo[]>([ |
||||
|
{ |
||||
|
title: "", |
||||
|
startTime: "", |
||||
|
endTime: "", |
||||
|
}, |
||||
|
]); |
||||
|
let countNum = 1; |
||||
|
const ruleList = ref<ruleInfo[]>([ |
||||
|
{ |
||||
|
teamid: "", |
||||
|
sort: countNum, |
||||
|
}, |
||||
|
]); |
||||
|
/** |
||||
|
* 弹窗显示控制 |
||||
|
*/ |
||||
|
const isShow = computed({ |
||||
|
get: () => { |
||||
|
if (props.open) { |
||||
|
getTimeClassList(); |
||||
|
} |
||||
|
return props.open; |
||||
|
}, |
||||
|
set: (val) => { |
||||
|
emits("update:open", val); |
||||
|
}, |
||||
|
}); |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 13:57:36 |
||||
|
@ 功能: 关闭弹窗 |
||||
|
*/ |
||||
|
const closeDialog = () => { |
||||
|
emits("update:open", false); |
||||
|
countNum = 1; |
||||
|
worktimeList.value = [ |
||||
|
{ |
||||
|
title: "", |
||||
|
startTime: "", |
||||
|
endTime: "", |
||||
|
}, |
||||
|
]; |
||||
|
ruleList.value = [ |
||||
|
{ |
||||
|
teamid: "", |
||||
|
sort: countNum, |
||||
|
}, |
||||
|
]; |
||||
|
formInfo.name = ""; |
||||
|
sunmitBut.value = false; |
||||
|
emits("restdata"); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 11:34:57 |
||||
|
@ 功能: 获取班次列表 |
||||
|
*/ |
||||
|
const getTimeClassList = () => { |
||||
|
teamcontlist().then((data: any) => { |
||||
|
tiemList.value = data.data.list; |
||||
|
}); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 15:16:33 |
||||
|
@ 功能: 添加工作时间段安排 |
||||
|
*/ |
||||
|
const addTimeSet = () => { |
||||
|
worktimeList.value.push({ |
||||
|
title: "", |
||||
|
startTime: "", |
||||
|
endTime: "", |
||||
|
}); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 15:34:42 |
||||
|
@ 功能: 删除时间片段 |
||||
|
*/ |
||||
|
const delTimeSet = (val: any) => { |
||||
|
console.log("删除时间片段", val.$index, worktimeList.value.length); |
||||
|
if (worktimeList.value.length > 1) { |
||||
|
worktimeList.value.splice(val.$index, 1); |
||||
|
console.log("删除时间片段", val.$index); |
||||
|
} else { |
||||
|
val.title = ""; |
||||
|
val.startTime = ""; |
||||
|
val.title = ""; |
||||
|
} |
||||
|
}; |
||||
|
|
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 16:00:54 |
||||
|
@ 功能: 添加轮询规则 |
||||
|
*/ |
||||
|
const addTimeRuleSet = () => { |
||||
|
countNum++; |
||||
|
ruleList.value.push({ |
||||
|
sort: countNum, |
||||
|
teamid: "", |
||||
|
}); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 16:06:44 |
||||
|
@ 功能: 删除轮询规则 |
||||
|
*/ |
||||
|
const delTimeRuleSet = (val: any) => { |
||||
|
if (ruleList.value.length > 1) { |
||||
|
ruleList.value.splice(val.$index, 1); |
||||
|
} else { |
||||
|
val.sort = 1; |
||||
|
val.titteamidle = ""; |
||||
|
} |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 16:19:51 |
||||
|
@ 功能: 提交数据 |
||||
|
*/ |
||||
|
const addContsubmit = () => { |
||||
|
sunmitBut.value = true; |
||||
|
if (!formInfo.name) { |
||||
|
ElMessage.error("请输入名称"); |
||||
|
sunmitBut.value = false; |
||||
|
return false; |
||||
|
} else { |
||||
|
if (formInfo.name == "" || formInfo.name == null) { |
||||
|
ElMessage.error("请输入名称"); |
||||
|
sunmitBut.value = false; |
||||
|
return false; |
||||
|
} |
||||
|
} |
||||
|
let workList = new Array(); |
||||
|
let ruleAry = new Array(); |
||||
|
if (worktimeList.value.length < 1) { |
||||
|
ElMessage.error("请输入工作时间安排!"); |
||||
|
sunmitBut.value = false; |
||||
|
return false; |
||||
|
} else { |
||||
|
let isTrue = false; |
||||
|
worktimeList.value.forEach((item: any) => { |
||||
|
if (!item.title) { |
||||
|
isTrue = true; |
||||
|
} else { |
||||
|
if (item.title == "" || item.title == null) { |
||||
|
isTrue = true; |
||||
|
} |
||||
|
} |
||||
|
if (!item.startTime) { |
||||
|
isTrue = true; |
||||
|
} else { |
||||
|
if (item.startTime == "" || item.startTime == null) { |
||||
|
isTrue = true; |
||||
|
} |
||||
|
} |
||||
|
if (!item.endTime) { |
||||
|
isTrue = true; |
||||
|
} else { |
||||
|
if (item.endTime == "" || item.endTime == null) { |
||||
|
isTrue = true; |
||||
|
} |
||||
|
} |
||||
|
workList.push(item); |
||||
|
}); |
||||
|
if (isTrue) { |
||||
|
ElMessage.error("请输入工作时间安排!"); |
||||
|
sunmitBut.value = false; |
||||
|
return false; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
if (ruleList.value.length < 1) { |
||||
|
ElMessage.error("请输入轮询规则!"); |
||||
|
sunmitBut.value = false; |
||||
|
return false; |
||||
|
} else { |
||||
|
let isOk = false; |
||||
|
ruleList.value.forEach((item: any) => { |
||||
|
// if (!item.id) { |
||||
|
// isOk = true; |
||||
|
// } else { |
||||
|
// if (item.id == "" || item.id == null) { |
||||
|
// isOk = true; |
||||
|
// } |
||||
|
// } |
||||
|
if (!item.teamid) { |
||||
|
isOk = true; |
||||
|
} else { |
||||
|
if (item.teamid == "" || item.teamid == null) { |
||||
|
isOk = true; |
||||
|
} |
||||
|
} |
||||
|
ruleAry.push({ |
||||
|
sort: item.sort, |
||||
|
teamid: item.teamid.toString(), |
||||
|
}); |
||||
|
}); |
||||
|
if (isOk) { |
||||
|
ElMessage.error("请输入轮询规则!"); |
||||
|
sunmitBut.value = false; |
||||
|
return false; |
||||
|
} |
||||
|
} |
||||
|
var sendData = { |
||||
|
name: formInfo.name, |
||||
|
rule: ruleAry, |
||||
|
list: workList, |
||||
|
}; |
||||
|
console.log("上传规则", sendData); |
||||
|
addTeamTime(sendData) |
||||
|
.then((data) => { |
||||
|
console.log("上传规则-------<", data); |
||||
|
if (data.code == 0) { |
||||
|
ElMessageBox.confirm("新增成功!是否继续添加?", "提示", { |
||||
|
confirmButtonText: "确定", |
||||
|
cancelButtonText: "取消", |
||||
|
type: "warning", |
||||
|
}) |
||||
|
.then(() => { |
||||
|
countNum = 1; |
||||
|
worktimeList.value = [ |
||||
|
{ |
||||
|
title: "", |
||||
|
startTime: "", |
||||
|
endTime: "", |
||||
|
}, |
||||
|
]; |
||||
|
ruleList.value = [ |
||||
|
{ |
||||
|
teamid: "", |
||||
|
sort: countNum, |
||||
|
}, |
||||
|
]; |
||||
|
formInfo.name = ""; |
||||
|
sunmitBut.value = false; |
||||
|
}) |
||||
|
.catch(() => { |
||||
|
closeDialog(); |
||||
|
}); |
||||
|
} else { |
||||
|
ElMessage.error(data.msg || "添加失败!"); |
||||
|
closeDialog(); |
||||
|
} |
||||
|
}) |
||||
|
.finally(() => { |
||||
|
sunmitBut.value = false; |
||||
|
}); |
||||
|
}; |
||||
|
</script> |
||||
|
<template> |
||||
|
<el-dialog |
||||
|
v-model="isShow" |
||||
|
width="60%" |
||||
|
title="添加班组轮询规则" |
||||
|
append-to-body |
||||
|
:before-close="closeDialog" |
||||
|
> |
||||
|
<el-form ref="addForm" :model="formInfo" label-width="120px" class="demo-ruleForm"> |
||||
|
<el-form-item label="名称" prop="name"> |
||||
|
<el-input v-model="formInfo.name" placeholder="请输入名称"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="工作时间段安排" prop="rule"> |
||||
|
<el-table :data="worktimeList" border style="width: 100%"> |
||||
|
<el-table-column align="center" prop="title" label="时段名称" width="180"> |
||||
|
<template #default="scope"> |
||||
|
<el-input v-model="scope.row.title" placeholder="请输入时段名称"></el-input> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column align="center" label="开始与结束时间"> |
||||
|
<template #default="scope"> |
||||
|
<el-time-select |
||||
|
style="width: 120px" |
||||
|
placeholder="起始时间" |
||||
|
v-model="scope.row.startTime" |
||||
|
start="00:00" |
||||
|
step="00:01" |
||||
|
end="23:59" |
||||
|
> |
||||
|
</el-time-select> |
||||
|
至 |
||||
|
<el-time-select |
||||
|
style="width: 120px" |
||||
|
placeholder="结束时间" |
||||
|
v-model="scope.row.endTime" |
||||
|
:min-time="scope.row.startTime" |
||||
|
start="00:00" |
||||
|
step="00:01" |
||||
|
end="23:59" |
||||
|
> |
||||
|
</el-time-select> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column align="center" width="100"> |
||||
|
<template #header> |
||||
|
<el-button type="primary" size="small" @click="addTimeSet()" |
||||
|
><i class="fa fa-plus iconLeft"></i> 新增</el-button |
||||
|
> |
||||
|
</template> |
||||
|
<template #default="scope"> |
||||
|
<el-button |
||||
|
v-if="worktimeList.length > 1" |
||||
|
type="danger" |
||||
|
size="small" |
||||
|
@click="delTimeSet(scope)" |
||||
|
><i class="fa fa-trash-o iconLeft"></i>删除</el-button |
||||
|
> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="轮询规则" prop="rule"> |
||||
|
<el-table :data="ruleList" border style="width: 100%"> |
||||
|
<el-table-column align="center" prop="sort" label="排序" width="180"> |
||||
|
<template #default="scope"> |
||||
|
<el-input |
||||
|
v-model="scope.row.sort" |
||||
|
placeholder="请输入序号" |
||||
|
disabled |
||||
|
></el-input> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column align="center" prop="name" label="班组"> |
||||
|
<template #default="scope"> |
||||
|
<el-select v-model="scope.row.teamid" clearable placeholder="请选择"> |
||||
|
<el-option |
||||
|
v-for="item in tiemList" |
||||
|
:key="item.id" |
||||
|
:label="item.name" |
||||
|
:value="item.id" |
||||
|
> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column align="center" width="100"> |
||||
|
<template #header> |
||||
|
<el-button type="primary" size="small" @click="addTimeRuleSet()" |
||||
|
><i class="fa fa-plus iconLeft"></i> 新增</el-button |
||||
|
> |
||||
|
</template> |
||||
|
<template #default="scope"> |
||||
|
<el-button |
||||
|
v-if="ruleList.length > 1" |
||||
|
type="danger" |
||||
|
size="small" |
||||
|
@click="delTimeRuleSet(scope)" |
||||
|
><i class="fa fa-trash-o iconLeft"></i>删除</el-button |
||||
|
> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
<template #footer class="el_dialog__footer"> |
||||
|
<div class="dialog-footer"> |
||||
|
<el-button size="small" type="primary" @click="addContsubmit" :loading="sunmitBut" |
||||
|
>确 定</el-button |
||||
|
> |
||||
|
<el-button size="small" @click="closeDialog">取 消</el-button> |
||||
|
</div> |
||||
|
</template> |
||||
|
</el-dialog> |
||||
|
</template> |
||||
|
<style lang="scss" scoped> |
||||
|
.iconLeft { |
||||
|
margin-right: 10px; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,194 @@ |
|||||
|
<!-- |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-16 14:39:18 |
||||
|
@ 备注: 周内容 |
||||
|
--> |
||||
|
<script lang="ts" setup> |
||||
|
import { PropType } from "vue"; |
||||
|
import DateClass from "@/api/calendar/DateClass"; |
||||
|
import { dateBase } from "@/api/calendar/Calendar"; |
||||
|
import FormPageCont from "@/components/DesignForm/tableListPage/formPageCont.vue"; |
||||
|
const props = defineProps({ |
||||
|
col: { |
||||
|
type: Object as PropType<dateBase>, |
||||
|
default: () => { |
||||
|
return {}; |
||||
|
}, |
||||
|
}, |
||||
|
time: { |
||||
|
type: String, |
||||
|
default: "", |
||||
|
}, |
||||
|
}); |
||||
|
const isCurrentMonth = (time: string) => { |
||||
|
console.log("分割时间", time); |
||||
|
const months = time.split("-")[1]; |
||||
|
return DateClass.getCurrent()[1] === Number(months); |
||||
|
}; |
||||
|
const emit = defineEmits(["changeTargetDate"]); |
||||
|
const changeTargetDate = (time: dateBase) => { |
||||
|
emit("changeTargetDate", time); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2024-07-16 10:32:41 |
||||
|
@ 功能: 搜索数据 |
||||
|
*/ |
||||
|
const searchtData = (val: any, time?: any) => { |
||||
|
return time; |
||||
|
}; |
||||
|
</script> |
||||
|
<template> |
||||
|
<div |
||||
|
class="calendar-item-container" |
||||
|
:class="[ |
||||
|
{ |
||||
|
'is-current': col.isCurrent, |
||||
|
'is-holidays': col.isHolidays, |
||||
|
'is-week': col.isWeek, |
||||
|
'is-selected': col.date === props.time, |
||||
|
'is-current-month': isCurrentMonth(col.date), |
||||
|
}, |
||||
|
]" |
||||
|
@click="changeTargetDate(col)" |
||||
|
> |
||||
|
<div class="dayStyle"> |
||||
|
<span>{{ col.title }}</span> |
||||
|
<div v-if="col.isHolidays">休</div> |
||||
|
<span>{{ col.lunarsChina }}</span> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
<style lang="scss" scoped></style> |
||||
|
<style scoped lang="less"> |
||||
|
.calendar-item-container { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
flex-direction: column; |
||||
|
box-sizing: border-box; |
||||
|
border-radius: 6px; |
||||
|
border: 2px solid #ffffff; |
||||
|
|
||||
|
.dayList { |
||||
|
height: calc(100% - 20px); |
||||
|
overflow-y: auto; |
||||
|
} |
||||
|
.dayLogCont { |
||||
|
white-space: nowrap; /* 确保文本在一行内显示 */ |
||||
|
overflow: hidden; /* 隐藏溢出的内容 */ |
||||
|
text-overflow: ellipsis; /* 使用省略号表示文本溢出 */ |
||||
|
font-size: 0.95rem; |
||||
|
border: 1px solid #bcbcbc; |
||||
|
border-radius: 5px; |
||||
|
margin-bottom: 5px; |
||||
|
padding: 0 5px; |
||||
|
} |
||||
|
.dayStyle { |
||||
|
display: flex; |
||||
|
// align-items: top; |
||||
|
justify-content: space-between; |
||||
|
font-size: 12px; |
||||
|
color: #999999; |
||||
|
} |
||||
|
.calendar-title { |
||||
|
font-size: 1.2rem; |
||||
|
color: #999999; |
||||
|
} |
||||
|
.calendar-lunar { |
||||
|
margin-top: 6px; |
||||
|
|
||||
|
font-size: 0.85rem; |
||||
|
color: #bcbcbc; |
||||
|
} |
||||
|
transition: all 0.2s; |
||||
|
} |
||||
|
.calendar-item-container:hover { |
||||
|
cursor: pointer; |
||||
|
border: 2px solid #409eff; |
||||
|
} |
||||
|
.is-holidays { |
||||
|
.holidays-text { |
||||
|
position: absolute; |
||||
|
top: 6px; |
||||
|
left: 14px; |
||||
|
font-size: 0.85rem; |
||||
|
color: #ffa2a2; |
||||
|
} |
||||
|
.calendar-title { |
||||
|
color: #ffa2a2; |
||||
|
} |
||||
|
.dayStyle { |
||||
|
color: #ffa2a2; |
||||
|
} |
||||
|
background-color: #feeeef; |
||||
|
} |
||||
|
.is-selected { |
||||
|
border: 2px solid #409eff; |
||||
|
} |
||||
|
.is-holidays.is-selected { |
||||
|
border: 2px solid #ffa2a2; |
||||
|
} |
||||
|
.is-selected.is-current-month { |
||||
|
border: 2px solid #409eff; |
||||
|
} |
||||
|
.is-holidays.is-selected.is-current-month { |
||||
|
border: 2px solid #f62b2b; |
||||
|
} |
||||
|
.is-week { |
||||
|
.calendar-title { |
||||
|
color: #ffa2a2; |
||||
|
} |
||||
|
.dayStyle { |
||||
|
color: #ffa2a2; |
||||
|
} |
||||
|
} |
||||
|
.calendar-item-container.is-current { |
||||
|
.calendar-title { |
||||
|
color: #333333; |
||||
|
} |
||||
|
.dayStyle { |
||||
|
color: #333333; |
||||
|
} |
||||
|
.calendar-lunar { |
||||
|
color: #666666; |
||||
|
} |
||||
|
} |
||||
|
.calendar-item-container.is-current.is-holidays { |
||||
|
.holidays-text { |
||||
|
position: absolute; |
||||
|
top: 6px; |
||||
|
left: 14px; |
||||
|
font-size: 0.85rem; |
||||
|
color: #f62b2b; |
||||
|
} |
||||
|
background-color: #fbe3e4; |
||||
|
} |
||||
|
.calendar-item-container.is-current.is-holidays, |
||||
|
.calendar-item-container.is-current.is-week { |
||||
|
.calendar-title { |
||||
|
color: #f62b2b; |
||||
|
} |
||||
|
.dayStyle { |
||||
|
color: #f62b2b; |
||||
|
} |
||||
|
} |
||||
|
.calendar-item-container.is-current.is-holidays { |
||||
|
.holidays-text { |
||||
|
position: absolute; |
||||
|
top: 6px; |
||||
|
left: 14px; |
||||
|
font-size: 0.85rem; |
||||
|
color: #fb4949; |
||||
|
} |
||||
|
.calendar-title { |
||||
|
color: #fb6e6e; |
||||
|
} |
||||
|
.dayStyle { |
||||
|
color: #fb6e6e; |
||||
|
} |
||||
|
background-color: #ffe4e7; |
||||
|
} |
||||
|
.calendar-item-container.is-holidays:hover { |
||||
|
border: 2px solid #f62b2b; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,121 @@ |
|||||
|
<!-- |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-16 14:08:44 |
||||
|
@ 备注: 日历天 |
||||
|
--> |
||||
|
<script lang="ts" setup> |
||||
|
import Calendar from "@/api/calendar/Calendar"; |
||||
|
import DateClass from "@/api/calendar/DateClass"; |
||||
|
import { dateBase } from "@/api/calendar/Calendar"; |
||||
|
import { clockFactory } from "@/api/calendar/utils"; |
||||
|
import { gainCalendarList } from "@/api/calendar/request"; |
||||
|
import DayInfoPage from "@/views/hr/teams/classTime/dayInfoPage.vue"; |
||||
|
const props = defineProps({ |
||||
|
taDay: { |
||||
|
type: Array, |
||||
|
default() { |
||||
|
return [2024, 7, 13]; |
||||
|
}, |
||||
|
}, |
||||
|
}); |
||||
|
const curttWeek = computed(() => { |
||||
|
// console.log("画板高度---------->",props.taDay[0]) |
||||
|
return DateClass.getWeek( |
||||
|
DateClass.solarWeek(props.taDay[0], props.taDay[1], props.taDay[2]) |
||||
|
); |
||||
|
}); |
||||
|
const dayInfo = ref<any>(); |
||||
|
const selectedTime = ref( |
||||
|
props.taDay[0] + "-" + clockFactory(props.taDay[1]) + "-" + clockFactory(props.taDay[2]) |
||||
|
); |
||||
|
onMounted(() => { |
||||
|
dayInfo.value = Calendar.gainOneDay(props.taDay[0], props.taDay[1], props.taDay[2]); |
||||
|
// console.log("初次加载",dayInfo.value,props.searchSend) |
||||
|
|
||||
|
nextTick(() => { |
||||
|
let ddTime = DateClass.getCurrent(); |
||||
|
selectedTime.value = |
||||
|
ddTime[0] + "-" + clockFactory(ddTime[1]) + "-" + clockFactory(ddTime[2]); |
||||
|
}); |
||||
|
}); |
||||
|
|
||||
|
watch( |
||||
|
() => props.taDay, |
||||
|
(val: any) => { |
||||
|
dayInfo.value = Calendar.gainOneDay(val[0], val[1], val[2]); |
||||
|
// console.log("监听变化",dayInfo.value) |
||||
|
}, |
||||
|
{ |
||||
|
deep: true, |
||||
|
} |
||||
|
); |
||||
|
const emit = defineEmits(["getDate"]); |
||||
|
const changeDate = (time: dateBase) => { |
||||
|
selectedTime.value = time.date; |
||||
|
emit("getDate", time); |
||||
|
}; |
||||
|
const loadDay = ref(false); |
||||
|
</script> |
||||
|
<template> |
||||
|
<div |
||||
|
class="monthCalendarBox" |
||||
|
:style="'height:calc(100vh - ' + drawingBoardHeight + 'px)'" |
||||
|
> |
||||
|
<ul class="t-calendar-header"> |
||||
|
<li> |
||||
|
{{ curttWeek }} |
||||
|
</li> |
||||
|
</ul> |
||||
|
<div class="t-calendar-day" v-loading="loadDay"> |
||||
|
<template v-if="dayInfo"> |
||||
|
<div class="t-calendar-row"> |
||||
|
<DayInfoPage |
||||
|
:col="dayInfo" |
||||
|
:time="selectedTime" |
||||
|
@changeTargetDate="changeDate" |
||||
|
></DayInfoPage> |
||||
|
</div> |
||||
|
</template> |
||||
|
<template v-else> |
||||
|
<div class="no-date">抱歉,暂无数据</div> |
||||
|
</template> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
<style lang="scss" scoped> |
||||
|
.monthCalendarBox { |
||||
|
width: 100%; |
||||
|
margin-top: 10px; |
||||
|
height: calc(100vh - 340px); |
||||
|
.t-calendar-header { |
||||
|
display: flex; |
||||
|
width: 100%; |
||||
|
height: 42px; |
||||
|
padding: 0; |
||||
|
box-sizing: border-box; |
||||
|
li { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
flex: 1; |
||||
|
font-size: 0.95rem; |
||||
|
} |
||||
|
} |
||||
|
.t-calendar-day { |
||||
|
display: flex; |
||||
|
width: 100%; |
||||
|
height: calc(100% - 42px); |
||||
|
padding: 0; |
||||
|
box-sizing: border-box; |
||||
|
border-right: 1px solid #ebeef5; |
||||
|
.t-calendar-row { |
||||
|
width: 100%; |
||||
|
|
||||
|
font-size: 0.95rem; |
||||
|
border-bottom: 1px solid #ebeef5; |
||||
|
border-top: 1px solid #ebeef5; |
||||
|
border-left: 1px solid #ebeef5; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,366 @@ |
|||||
|
<!-- |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-15 09:20:43 |
||||
|
@ 备注: 编辑班组轮询规则 |
||||
|
--> |
||||
|
<script lang="ts" setup> |
||||
|
import { teamcontlist } from "@/api/hr/org/index"; |
||||
|
import { editWorkTimeCont } from "@/api/hr/people/index"; |
||||
|
|
||||
|
const props = defineProps({ |
||||
|
open: { |
||||
|
type: Boolean, |
||||
|
default: false, |
||||
|
}, |
||||
|
teamInfo: { |
||||
|
type: Object, |
||||
|
default() { |
||||
|
return {}; |
||||
|
}, |
||||
|
}, |
||||
|
}); |
||||
|
const emits = defineEmits(["update:open", "restdata"]); |
||||
|
const tiemList = ref<string[]>([]); |
||||
|
const editBut = ref(false); |
||||
|
const editFormInfo = reactive({ |
||||
|
id: props.teamInfo.id, |
||||
|
name: props.teamInfo.name, |
||||
|
}); |
||||
|
let countEditNum = 1; |
||||
|
const editWorktimeList = ref<workTimeInfo[]>([]); |
||||
|
const editRuleList = ref<ruleInfo[]>([]); |
||||
|
/** |
||||
|
* 弹窗显示控制 |
||||
|
*/ |
||||
|
const isOpen = computed({ |
||||
|
get: () => { |
||||
|
if (props.open) { |
||||
|
editFormInfo.id = props.teamInfo.id.toString(); |
||||
|
editFormInfo.name = props.teamInfo.name; |
||||
|
editWorktimeList.value = props.teamInfo.list; |
||||
|
editRuleList.value = props.teamInfo.rule; |
||||
|
countEditNum = props.teamInfo.rule.length; |
||||
|
getTimeClassList(); |
||||
|
} |
||||
|
return props.open; |
||||
|
}, |
||||
|
set: (val) => { |
||||
|
emits("update:open", val); |
||||
|
}, |
||||
|
}); |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 11:34:57 |
||||
|
@ 功能: 获取班次列表 |
||||
|
*/ |
||||
|
const getTimeClassList = () => { |
||||
|
teamcontlist().then((data: any) => { |
||||
|
if (data.data.list && data.data.list.length > 0) { |
||||
|
data.data.list.forEach((item: any) => { |
||||
|
tiemList.value.push({ |
||||
|
id: item.id.toString(), |
||||
|
name: item.name, |
||||
|
state: item.state, |
||||
|
status: item.status, |
||||
|
time: item.time, |
||||
|
}); |
||||
|
}); |
||||
|
} |
||||
|
// tiemList.value = data.data.list; |
||||
|
console.log("props.teamInfo", tiemList.value); |
||||
|
}); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-15 13:01:03 |
||||
|
@ 功能: 关闭修改轮询 |
||||
|
*/ |
||||
|
const closeEditDialog = () => { |
||||
|
editFormInfo.id = ""; |
||||
|
editFormInfo.name = ""; |
||||
|
editWorktimeList.value = []; |
||||
|
editRuleList.value = []; |
||||
|
emits("update:open", false); |
||||
|
}; |
||||
|
|
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 15:16:33 |
||||
|
@ 功能: 添加工作时间段安排 |
||||
|
*/ |
||||
|
const addTimeSet = () => { |
||||
|
editWorktimeList.value.push({ |
||||
|
title: "", |
||||
|
startTime: "", |
||||
|
endTime: "", |
||||
|
}); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 15:34:42 |
||||
|
@ 功能: 删除时间片段 |
||||
|
*/ |
||||
|
const delTimeSet = (val: any) => { |
||||
|
console.log("删除时间片段", val.$index, editWorktimeList.value.length); |
||||
|
if (editWorktimeList.value.length > 1) { |
||||
|
editWorktimeList.value.splice(val.$index, 1); |
||||
|
console.log("删除时间片段", val.$index); |
||||
|
} else { |
||||
|
val.title = ""; |
||||
|
val.startTime = ""; |
||||
|
val.title = ""; |
||||
|
} |
||||
|
}; |
||||
|
|
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 16:00:54 |
||||
|
@ 功能: 添加轮询规则 |
||||
|
*/ |
||||
|
const addTimeRuleSet = () => { |
||||
|
countEditNum++; |
||||
|
editRuleList.value.push({ |
||||
|
id: "", |
||||
|
sort: countEditNum, |
||||
|
teamid: "", |
||||
|
}); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 16:06:44 |
||||
|
@ 功能: 删除轮询规则 |
||||
|
*/ |
||||
|
const delTimeRuleSet = (val: any) => { |
||||
|
if (editRuleList.value.length > 1) { |
||||
|
editRuleList.value.splice(val.$index, 1); |
||||
|
} else { |
||||
|
val.sort = 1; |
||||
|
val.titteamidle = ""; |
||||
|
} |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-15 13:13:43 |
||||
|
@ 功能: 提交编辑轮询规则 |
||||
|
*/ |
||||
|
const editContsubmit = () => { |
||||
|
editBut.value = true; |
||||
|
if (!editFormInfo.name) { |
||||
|
ElMessage.error("请输入名称"); |
||||
|
editBut.value = false; |
||||
|
return false; |
||||
|
} else { |
||||
|
if (editFormInfo.name == "" || editFormInfo.name == null) { |
||||
|
ElMessage.error("请输入名称"); |
||||
|
editBut.value = false; |
||||
|
return false; |
||||
|
} |
||||
|
} |
||||
|
let workList = new Array(); |
||||
|
let ruleAry = new Array(); |
||||
|
if (editWorktimeList.value.length < 1) { |
||||
|
ElMessage.error("请输入工作时间安排!"); |
||||
|
editBut.value = false; |
||||
|
return false; |
||||
|
} else { |
||||
|
let isTrue = false; |
||||
|
editWorktimeList.value.forEach((item: any) => { |
||||
|
if (!item.title) { |
||||
|
isTrue = true; |
||||
|
} else { |
||||
|
if (item.title == "" || item.title == null) { |
||||
|
isTrue = true; |
||||
|
} |
||||
|
} |
||||
|
if (!item.startTime) { |
||||
|
isTrue = true; |
||||
|
} else { |
||||
|
if (item.startTime == "" || item.startTime == null) { |
||||
|
isTrue = true; |
||||
|
} |
||||
|
} |
||||
|
if (!item.endTime) { |
||||
|
isTrue = true; |
||||
|
} else { |
||||
|
if (item.endTime == "" || item.endTime == null) { |
||||
|
isTrue = true; |
||||
|
} |
||||
|
} |
||||
|
workList.push(item); |
||||
|
}); |
||||
|
if (isTrue) { |
||||
|
ElMessage.error("请输入工作时间安排!"); |
||||
|
editBut.value = false; |
||||
|
return false; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
if (editRuleList.value.length < 1) { |
||||
|
ElMessage.error("请输入轮询规则!"); |
||||
|
editBut.value = false; |
||||
|
return false; |
||||
|
} else { |
||||
|
let isEditOk = false; |
||||
|
editRuleList.value.forEach((item: any) => { |
||||
|
// console.log("请输入轮询规则!====3===>", item.teamid); |
||||
|
if (!item.teamid) { |
||||
|
isEditOk = true; |
||||
|
// console.log("请输入轮询规则!====2===>", item.teamid); |
||||
|
} else { |
||||
|
// console.log("请输入轮询规则!====1===>", item.teamid == ""); |
||||
|
if (item.teamid == "" || item.teamid == null) { |
||||
|
isEditOk = true; |
||||
|
} |
||||
|
} |
||||
|
ruleAry.push({ |
||||
|
id: item.id.toString(), |
||||
|
sort: item.sort, |
||||
|
teamid: item.teamid.toString(), |
||||
|
}); |
||||
|
}); |
||||
|
// console.log("请输入轮询规则!", isEditOk); |
||||
|
if (isEditOk) { |
||||
|
ElMessage.error("请输入轮询规则!"); |
||||
|
editBut.value = false; |
||||
|
return false; |
||||
|
} |
||||
|
} |
||||
|
var sendData = { |
||||
|
id: editFormInfo.id, |
||||
|
name: editFormInfo.name, |
||||
|
rule: ruleAry, |
||||
|
list: workList, |
||||
|
}; |
||||
|
console.log("上传规则", sendData); |
||||
|
editBut.value = false; |
||||
|
|
||||
|
editWorkTimeCont(sendData) |
||||
|
.then((data) => { |
||||
|
ElMessage.success(data.msg); |
||||
|
closeEditDialog(); |
||||
|
}) |
||||
|
.finally(() => { |
||||
|
editBut.value = false; |
||||
|
}); |
||||
|
}; |
||||
|
</script> |
||||
|
<template> |
||||
|
<el-dialog |
||||
|
v-model="isOpen" |
||||
|
width="60%" |
||||
|
title="添加班组轮询规则" |
||||
|
append-to-body |
||||
|
:before-close="closeEditDialog" |
||||
|
> |
||||
|
<el-form |
||||
|
ref="addForm" |
||||
|
:model="editFormInfo" |
||||
|
label-width="120px" |
||||
|
class="demo-ruleForm" |
||||
|
> |
||||
|
<el-form-item label="名称" prop="name"> |
||||
|
<el-input v-model="editFormInfo.name" placeholder="请输入名称"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="工作时间段安排" prop="rule"> |
||||
|
<el-table :data="editWorktimeList" border style="width: 100%"> |
||||
|
<el-table-column align="center" prop="title" label="时段名称" width="180"> |
||||
|
<template #default="scope"> |
||||
|
<el-input v-model="scope.row.title" placeholder="请输入时段名称"></el-input> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column align="center" label="开始与结束时间"> |
||||
|
<template #default="scope"> |
||||
|
<el-time-select |
||||
|
style="width: 120px" |
||||
|
placeholder="起始时间" |
||||
|
v-model="scope.row.startTime" |
||||
|
start="00:00" |
||||
|
step="00:01" |
||||
|
end="23:59" |
||||
|
> |
||||
|
</el-time-select> |
||||
|
至 |
||||
|
<el-time-select |
||||
|
style="width: 120px" |
||||
|
placeholder="结束时间" |
||||
|
v-model="scope.row.endTime" |
||||
|
:min-time="scope.row.startTime" |
||||
|
start="00:00" |
||||
|
step="00:01" |
||||
|
end="23:59" |
||||
|
> |
||||
|
</el-time-select> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column align="center" width="100"> |
||||
|
<template #header> |
||||
|
<el-button type="primary" size="small" @click="addTimeSet()" |
||||
|
><i class="fa fa-plus iconLeft"></i> 新增</el-button |
||||
|
> |
||||
|
</template> |
||||
|
<template #default="scope"> |
||||
|
<el-button |
||||
|
v-if="editWorktimeList.length > 1" |
||||
|
type="danger" |
||||
|
size="small" |
||||
|
@click="delTimeSet(scope)" |
||||
|
><i class="fa fa-trash-o iconLeft"></i>删除</el-button |
||||
|
> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="轮询规则" prop="rule"> |
||||
|
<el-table :data="editRuleList" border style="width: 100%"> |
||||
|
<el-table-column align="center" prop="sort" label="排序" width="180"> |
||||
|
<template #default="scope"> |
||||
|
<el-input |
||||
|
v-model="scope.row.sort" |
||||
|
placeholder="请输入序号" |
||||
|
disabled |
||||
|
></el-input> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column align="center" prop="name" label="班组"> |
||||
|
<template #default="scope"> |
||||
|
<el-select v-model="scope.row.teamid" clearable placeholder="请选择"> |
||||
|
<el-option |
||||
|
v-for="item in tiemList" |
||||
|
:key="item.id" |
||||
|
:label="item.name" |
||||
|
:value="item.id" |
||||
|
> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column align="center" width="100"> |
||||
|
<template #header> |
||||
|
<el-button type="primary" size="small" @click="addTimeRuleSet()" |
||||
|
><i class="fa fa-plus iconLeft"></i> 新增</el-button |
||||
|
> |
||||
|
</template> |
||||
|
<template #default="scope"> |
||||
|
<el-button |
||||
|
v-if="editRuleList.length > 1" |
||||
|
type="danger" |
||||
|
size="small" |
||||
|
@click="delTimeRuleSet(scope)" |
||||
|
><i class="fa fa-trash-o iconLeft"></i>删除</el-button |
||||
|
> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
<template #footer class="el_dialog__footer"> |
||||
|
<div class="dialog-footer"> |
||||
|
<el-button size="small" type="primary" @click="editContsubmit" :loading="editBut" |
||||
|
>确 定</el-button |
||||
|
> |
||||
|
<el-button size="small" @click="closeEditDialog">取 消</el-button> |
||||
|
</div> |
||||
|
</template> |
||||
|
</el-dialog> |
||||
|
</template> |
||||
|
<style lang="scss" scoped></style> |
||||
@ -0,0 +1,200 @@ |
|||||
|
<!-- |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-16 14:18:28 |
||||
|
@ 备注: 日历详情 |
||||
|
--> |
||||
|
<script lang="ts" setup> |
||||
|
import { PropType } from "vue"; |
||||
|
import DateClass from "@/api/calendar/DateClass"; |
||||
|
import { dateBase } from "@/api/calendar/Calendar"; |
||||
|
import FormPageCont from "@/components/DesignForm/tableListPage/formPageCont.vue"; |
||||
|
const props = defineProps({ |
||||
|
col: { |
||||
|
type: Object as PropType<dateBase>, |
||||
|
default: () => { |
||||
|
return {}; |
||||
|
}, |
||||
|
}, |
||||
|
time: { |
||||
|
type: String, |
||||
|
default: "", |
||||
|
}, |
||||
|
}); |
||||
|
const isCurrentMonth = (time: string) => { |
||||
|
// console.log("分割时间",time) |
||||
|
const months = time.split("-")[1]; |
||||
|
return DateClass.getCurrent()[1] === Number(months); |
||||
|
}; |
||||
|
const emit = defineEmits(["changeTargetDate"]); |
||||
|
const changeTargetDate = (time: dateBase) => { |
||||
|
emit("changeTargetDate", time); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2024-07-16 10:32:41 |
||||
|
@ 功能: 搜索数据 |
||||
|
*/ |
||||
|
const searchtData = (val: any, time?: any) => { |
||||
|
return time; |
||||
|
}; |
||||
|
</script> |
||||
|
<template> |
||||
|
<div |
||||
|
class="calendar-item-container" |
||||
|
:class="[ |
||||
|
{ |
||||
|
'is-current': col.isCurrent, |
||||
|
'is-holidays': col.isHolidays, |
||||
|
'is-week': col.isWeek, |
||||
|
'is-selected': col.date === props.time, |
||||
|
'is-current-month': isCurrentMonth(col.date), |
||||
|
}, |
||||
|
]" |
||||
|
@click="changeTargetDate(col)" |
||||
|
> |
||||
|
<div class="dayStyle"> |
||||
|
<span>{{ col.title }}</span> |
||||
|
<div v-if="col.isHolidays">休</div> |
||||
|
<span>{{ col.lunarsChina }}</span> |
||||
|
</div> |
||||
|
<div class="dayList"> |
||||
|
<div v-if="false" class="dayLogCont" @click="lookPageInfo">白班</div> |
||||
|
<div v-if="col.list != bull" v-for="itemCol in col.list" @click="lookPageInfo"> |
||||
|
{{ itemCol.rankName }}---{{ itemCol.rulesName }} |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
<style lang="scss" scoped></style> |
||||
|
<style scoped lang="less"> |
||||
|
.calendar-item-container { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
flex-direction: column; |
||||
|
box-sizing: border-box; |
||||
|
border-radius: 6px; |
||||
|
border: 2px solid #ffffff; |
||||
|
|
||||
|
.dayList { |
||||
|
height: calc(100% - 20px); |
||||
|
overflow-y: auto; |
||||
|
} |
||||
|
.dayLogCont { |
||||
|
white-space: nowrap; /* 确保文本在一行内显示 */ |
||||
|
overflow: hidden; /* 隐藏溢出的内容 */ |
||||
|
text-overflow: ellipsis; /* 使用省略号表示文本溢出 */ |
||||
|
font-size: 0.95rem; |
||||
|
border: 1px solid #bcbcbc; |
||||
|
border-radius: 5px; |
||||
|
margin-bottom: 5px; |
||||
|
padding: 0 5px; |
||||
|
} |
||||
|
.dayStyle { |
||||
|
display: flex; |
||||
|
// align-items: top; |
||||
|
justify-content: space-between; |
||||
|
font-size: 12px; |
||||
|
color: #999999; |
||||
|
} |
||||
|
.calendar-title { |
||||
|
font-size: 1.2rem; |
||||
|
color: #999999; |
||||
|
} |
||||
|
.calendar-lunar { |
||||
|
margin-top: 6px; |
||||
|
|
||||
|
font-size: 0.85rem; |
||||
|
color: #bcbcbc; |
||||
|
} |
||||
|
transition: all 0.2s; |
||||
|
} |
||||
|
.calendar-item-container:hover { |
||||
|
cursor: pointer; |
||||
|
border: 2px solid #409eff; |
||||
|
} |
||||
|
.is-holidays { |
||||
|
.holidays-text { |
||||
|
position: absolute; |
||||
|
top: 6px; |
||||
|
left: 14px; |
||||
|
font-size: 0.85rem; |
||||
|
color: #ffa2a2; |
||||
|
} |
||||
|
.calendar-title { |
||||
|
color: #ffa2a2; |
||||
|
} |
||||
|
.dayStyle { |
||||
|
color: #ffa2a2; |
||||
|
} |
||||
|
background-color: #feeeef; |
||||
|
} |
||||
|
.is-selected { |
||||
|
border: 2px solid #409eff; |
||||
|
} |
||||
|
.is-holidays.is-selected { |
||||
|
border: 2px solid #ffa2a2; |
||||
|
} |
||||
|
.is-selected.is-current-month { |
||||
|
border: 2px solid #409eff; |
||||
|
} |
||||
|
.is-holidays.is-selected.is-current-month { |
||||
|
border: 2px solid #f62b2b; |
||||
|
} |
||||
|
.is-week { |
||||
|
.calendar-title { |
||||
|
color: #ffa2a2; |
||||
|
} |
||||
|
.dayStyle { |
||||
|
color: #ffa2a2; |
||||
|
} |
||||
|
} |
||||
|
.calendar-item-container.is-current { |
||||
|
.calendar-title { |
||||
|
color: #333333; |
||||
|
} |
||||
|
.dayStyle { |
||||
|
color: #333333; |
||||
|
} |
||||
|
.calendar-lunar { |
||||
|
color: #666666; |
||||
|
} |
||||
|
} |
||||
|
.calendar-item-container.is-current.is-holidays { |
||||
|
.holidays-text { |
||||
|
position: absolute; |
||||
|
top: 6px; |
||||
|
left: 14px; |
||||
|
font-size: 0.85rem; |
||||
|
color: #f62b2b; |
||||
|
} |
||||
|
background-color: #fbe3e4; |
||||
|
} |
||||
|
.calendar-item-container.is-current.is-holidays, |
||||
|
.calendar-item-container.is-current.is-week { |
||||
|
.calendar-title { |
||||
|
color: #f62b2b; |
||||
|
} |
||||
|
.dayStyle { |
||||
|
color: #f62b2b; |
||||
|
} |
||||
|
} |
||||
|
.calendar-item-container.is-current.is-holidays { |
||||
|
.holidays-text { |
||||
|
position: absolute; |
||||
|
top: 6px; |
||||
|
left: 14px; |
||||
|
font-size: 0.85rem; |
||||
|
color: #fb4949; |
||||
|
} |
||||
|
.calendar-title { |
||||
|
color: #fb6e6e; |
||||
|
} |
||||
|
.dayStyle { |
||||
|
color: #fb6e6e; |
||||
|
} |
||||
|
background-color: #ffe4e7; |
||||
|
} |
||||
|
.calendar-item-container.is-holidays:hover { |
||||
|
border: 2px solid #f62b2b; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,156 @@ |
|||||
|
<!-- |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-16 14:06:22 |
||||
|
@ 备注: 日历月 |
||||
|
--> |
||||
|
<script lang="ts" setup> |
||||
|
import Calendar from "@/api/calendar/Calendar"; |
||||
|
import DateClass from "@/api/calendar/DateClass"; |
||||
|
import { dateBase } from "@/api/calendar/Calendar"; |
||||
|
import { clockFactory } from "@/api/calendar/utils"; |
||||
|
import { gainCalendarList } from "@/api/calendar/request"; |
||||
|
import { analysisMonthRulers } from "@/api/hr/people/index"; |
||||
|
import MonthInfoPage from "@/views/hr/teams/classTime/monthInfoPage.vue"; |
||||
|
|
||||
|
const props = defineProps({ |
||||
|
taDay: { |
||||
|
type: Array, |
||||
|
default() { |
||||
|
return [2024, 7, 13]; |
||||
|
}, |
||||
|
}, |
||||
|
orgId: { |
||||
|
type: Number, |
||||
|
default: 0, |
||||
|
}, |
||||
|
}); |
||||
|
|
||||
|
const TBody = ref<any[]>([]); |
||||
|
const loadMonth = ref(false); |
||||
|
const selectedTime = ref( |
||||
|
props.taDay[0] + "-" + clockFactory(props.taDay[1]) + "-" + clockFactory(props.taDay[2]) |
||||
|
); |
||||
|
|
||||
|
//获取排班 |
||||
|
const analyban = () => { |
||||
|
let sendData = { |
||||
|
orgId: props.orgId.toString() != "0" ? props.orgId.toString() : "103", |
||||
|
monthAllDay: TBody.value, |
||||
|
}; |
||||
|
console.log("获取每天数据条件", sendData); |
||||
|
analysisMonthRulers(sendData).then((data: any) => { |
||||
|
console.log("获取排班", data); |
||||
|
TBody.value = data.data; |
||||
|
}); |
||||
|
}; |
||||
|
|
||||
|
onMounted(() => { |
||||
|
TBody.value = Calendar.table(props.taDay); |
||||
|
console.log("初始加载", TBody.value); |
||||
|
analyban(); |
||||
|
nextTick(() => { |
||||
|
selectedTime.value = |
||||
|
props.taDay[0] + |
||||
|
"-" + |
||||
|
clockFactory(props.taDay[1]) + |
||||
|
"-" + |
||||
|
clockFactory(props.taDay[2]); |
||||
|
}); |
||||
|
}); |
||||
|
|
||||
|
watch( |
||||
|
() => props.taDay, |
||||
|
(val: any) => { |
||||
|
TBody.value = Calendar.table(props.taDay); |
||||
|
// analyban(); |
||||
|
console.log("初始加载----》", TBody.value); |
||||
|
}, |
||||
|
{ |
||||
|
deep: true, |
||||
|
} |
||||
|
); |
||||
|
const emit = defineEmits(["getDate"]); |
||||
|
const changeDate = (time: dateBase) => { |
||||
|
selectedTime.value = time.date; |
||||
|
emit("getDate", time); |
||||
|
}; |
||||
|
//周期 |
||||
|
const THeader = Calendar.title(); |
||||
|
</script> |
||||
|
<template> |
||||
|
<div |
||||
|
class="monthCalendarBox" |
||||
|
:style="'height:calc(100vh - ' + drawingBoardHeight + 'px)'" |
||||
|
> |
||||
|
<ul class="t-calendar-header"> |
||||
|
<li v-for="(item, index) in THeader" :key="index"> |
||||
|
{{ item }} |
||||
|
</li> |
||||
|
</ul> |
||||
|
<div v-loading="loadMonth" class="t-calendar-day"> |
||||
|
<template v-if="TBody.length"> |
||||
|
<div class="t-calendar-row" v-for="(item, index) in TBody" :key="index"> |
||||
|
<div class="t-calendar-col" v-for="(col, colIdx) in item" :key="colIdx"> |
||||
|
<MonthInfoPage |
||||
|
:col="col" |
||||
|
:time="selectedTime" |
||||
|
@changeTargetDate="changeDate" |
||||
|
></MonthInfoPage> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
<template v-else> |
||||
|
<div class="no-date">抱歉,暂无数据</div> |
||||
|
</template> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
<style lang="scss" scoped> |
||||
|
.monthCalendarBox { |
||||
|
width: 100%; |
||||
|
margin-top: 10px; |
||||
|
height: calc(100vh - 340px); |
||||
|
.t-calendar-header { |
||||
|
display: flex; |
||||
|
width: 100%; |
||||
|
height: 42px; |
||||
|
padding: 0; |
||||
|
box-sizing: border-box; |
||||
|
li { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
flex: 1; |
||||
|
font-size: 0.95rem; |
||||
|
} |
||||
|
} |
||||
|
.t-calendar-day { |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
width: 100%; |
||||
|
height: calc(100% - 42px); |
||||
|
.t-calendar-row { |
||||
|
width: 100%; |
||||
|
height: 60px; |
||||
|
display: flex; |
||||
|
flex: 1; |
||||
|
border-bottom: 1px solid #ebeef5; |
||||
|
.t-calendar-col { |
||||
|
box-sizing: border-box; |
||||
|
flex: 1; |
||||
|
border-left: 1px solid #ebeef5; |
||||
|
padding: 2px; |
||||
|
font-size: 16px; |
||||
|
transition: all 0.2s; |
||||
|
width: calc(100% / 7); |
||||
|
} |
||||
|
.t-calendar-col:last-child { |
||||
|
border-right: 1px solid #ebeef5; |
||||
|
} |
||||
|
} |
||||
|
.t-calendar-row:first-child { |
||||
|
border-top: 1px solid #ebeef5; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,249 @@ |
|||||
|
<!-- |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-16 15:26:29 |
||||
|
@ 备注: 行政组织绑定倒班规则及设置源点 |
||||
|
--> |
||||
|
<script lang="ts" setup> |
||||
|
import { gainTemsTypeAndRuler, setOirginCont } from "@/api/hr/people/index"; |
||||
|
const props = defineProps({ |
||||
|
open: { |
||||
|
type: Boolean, |
||||
|
default: false, |
||||
|
}, |
||||
|
orgId: { |
||||
|
type: Number, |
||||
|
default: 0, |
||||
|
}, |
||||
|
orgName: { |
||||
|
type: String, |
||||
|
default: "", |
||||
|
}, |
||||
|
rulerInfo: { |
||||
|
type: Object, |
||||
|
default() { |
||||
|
return {}; |
||||
|
}, |
||||
|
}, |
||||
|
}); |
||||
|
const emits = defineEmits(["update:open", "updateShiftRules"]); |
||||
|
const loadRules = ref(false); |
||||
|
const rulesInfo = ref({ |
||||
|
id: props.rulerInfo.id.toString(), |
||||
|
starttime: props.rulerInfo.begainTime, |
||||
|
setIsm: props.rulerInfo.typeIdStr, |
||||
|
shifttime: props.rulerInfo.periodid.toString(), |
||||
|
rule: props.rulerInfo.rules.toString(), |
||||
|
orgId: props.orgId.toString(), |
||||
|
}); |
||||
|
const workTimeRules = ref<any>([]); |
||||
|
const timeSelect = ref<any>([]); |
||||
|
const rulesSelect = ref<any>([]); |
||||
|
const editOriginForm = ref(ElForm); //编辑倒班制度及设置源点 |
||||
|
|
||||
|
watch( |
||||
|
() => props.rulerInfo, |
||||
|
(val: any) => { |
||||
|
rulesInfo.value.id = props.rulerInfo.id.toString(); |
||||
|
rulesInfo.value.starttime = props.rulerInfo.begainTime; |
||||
|
rulesInfo.value.setIsm = props.rulerInfo.typeIdStr; |
||||
|
rulesInfo.value.shifttime = props.rulerInfo.periodid.toString(); |
||||
|
rulesInfo.value.rule = props.rulerInfo.rules.toString(); |
||||
|
rulesInfo.value.orgId = props.orgId.toString(); |
||||
|
}, |
||||
|
{ deep: true } |
||||
|
); |
||||
|
|
||||
|
/** |
||||
|
* 弹窗显示控制 |
||||
|
*/ |
||||
|
const isShow = computed({ |
||||
|
get: () => { |
||||
|
if (props.open) { |
||||
|
rulesInfo.value.orgId = props.orgId.toString(); |
||||
|
getWorkRules(); |
||||
|
} |
||||
|
return props.open; |
||||
|
}, |
||||
|
set: (val) => { |
||||
|
emits("update:open", val); |
||||
|
}, |
||||
|
}); |
||||
|
/** |
||||
|
* 表单验证规则 |
||||
|
*/ |
||||
|
const addOriginRules = reactive({ |
||||
|
starttime: [{ required: true, message: "请选择源点时间", trigger: "blur" }], |
||||
|
setIsm: [{ required: true, message: "请选择执行制度", trigger: "blur" }], |
||||
|
shifttime: [{ required: true, message: "请选择起始工作时间段", trigger: "blur" }], |
||||
|
rule: [{ required: true, message: "请选择起始轮询班组", trigger: "blur" }], |
||||
|
}); |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-16 16:52:44 |
||||
|
@ 功能: 关闭弹窗 |
||||
|
*/ |
||||
|
const closeRulesDialog = () => { |
||||
|
emits("update:open", false); |
||||
|
editOriginForm.value.resetFields(); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-17 11:02:38 |
||||
|
@ 功能: 获取排班类别及轮询制度 |
||||
|
*/ |
||||
|
const getWorkRules = () => { |
||||
|
gainTemsTypeAndRuler().then((data: any) => { |
||||
|
console.log("获取排班类别及轮询制度--->", data); |
||||
|
if (data.data && data.data.length > 0) { |
||||
|
workTimeRules.value = data.data; |
||||
|
for (let i = 0; i < data.data.length; i++) { |
||||
|
if (props.rulerInfo.typeIdStr == data.data[i].id) { |
||||
|
if ( |
||||
|
data.data[i].pollingRules && |
||||
|
data.data[i].pollingRules.length > 0 && |
||||
|
data.data[i].workingTimePeriod && |
||||
|
data.data[i].workingTimePeriod.length > 0 |
||||
|
) { |
||||
|
console.log("获取排班类别及轮询制度-3-->", data.data[i].id); |
||||
|
// rulesInfo.value.setIsm = data.data[i].id.toString(); |
||||
|
timeSelect.value = data.data[i].workingTimePeriod; |
||||
|
// rulesInfo.value.shifttime = data.data[i].workingTimePeriod[0].id.toString(); |
||||
|
rulesSelect.value = data.data[i].pollingRules; |
||||
|
// rulesInfo.value.rule = data.data[i].pollingRules[0].id.toString(); |
||||
|
return true; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
}); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-17 13:36:59 |
||||
|
@ 功能: 选定制度 |
||||
|
*/ |
||||
|
watch( |
||||
|
() => rulesInfo.value.setIsm, |
||||
|
(val: string) => { |
||||
|
// console.log("选定制度", val); |
||||
|
if (workTimeRules.value && workTimeRules.value.length > 0) { |
||||
|
workTimeRules.value.forEach((item: any) => { |
||||
|
// console.log("选定制度------2--------->", item.id == val, item, val); |
||||
|
if (item.id == val) { |
||||
|
// console.log("选定制度----3------->", item); |
||||
|
timeSelect.value = item.workingTimePeriod; |
||||
|
rulesSelect.value = item.pollingRules; |
||||
|
rulesInfo.value.shifttime = item.workingTimePeriod[0].id.toString(); |
||||
|
rulesInfo.value.rule = item.pollingRules[0].id.toString(); |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
}, |
||||
|
{ |
||||
|
deep: true, |
||||
|
} |
||||
|
); |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-17 13:58:12 |
||||
|
@ 功能: 提交数据 |
||||
|
*/ |
||||
|
const setOrgRulessubmit = () => { |
||||
|
loadRules.value = true; |
||||
|
editOriginForm.value.validate((isValid: boolean) => { |
||||
|
if (isValid) { |
||||
|
console.log("提交数据", rulesInfo.value); |
||||
|
setOirginCont(rulesInfo.value) |
||||
|
.then((data: any) => { |
||||
|
console.log("提交数据", data); |
||||
|
if (data.code == 0) { |
||||
|
rulesInfo.value.id = data.data.id.toString(); |
||||
|
} |
||||
|
emits("updateShiftRules"); |
||||
|
closeRulesDialog(); |
||||
|
}) |
||||
|
.finally(() => { |
||||
|
loadRules.value = false; |
||||
|
}); |
||||
|
} else { |
||||
|
loadRules.value = false; |
||||
|
} |
||||
|
}); |
||||
|
}; |
||||
|
</script> |
||||
|
<template> |
||||
|
<el-dialog |
||||
|
v-model="isShow" |
||||
|
width="500" |
||||
|
:title="'设置<' + orgName + '>倒班制度及执行源点数据'" |
||||
|
append-to-body |
||||
|
:before-close="closeRulesDialog" |
||||
|
> |
||||
|
<el-form |
||||
|
ref="editOriginForm" |
||||
|
:model="rulesInfo" |
||||
|
:rules="addOriginRules" |
||||
|
label-width="125px" |
||||
|
class="demo-ruleForm" |
||||
|
> |
||||
|
<el-form-item label="源点日期" prop="starttime"> |
||||
|
<el-date-picker |
||||
|
v-model="rulesInfo.starttime" |
||||
|
format="YYYY 年 MM 月 DD 日" |
||||
|
type="date" |
||||
|
placeholder="选择日期" |
||||
|
value-format="YYYY-MM-DD" |
||||
|
clearable |
||||
|
> |
||||
|
</el-date-picker> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="执行制度" prop="setIsm"> |
||||
|
<el-select v-model="rulesInfo.setIsm" placeholder="请选择执行制度" clearable> |
||||
|
<el-option |
||||
|
v-for="item in workTimeRules" |
||||
|
:key="item.id" |
||||
|
:label="item.name" |
||||
|
:value="item.id" |
||||
|
/> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="起始工作时间段" prop="shifttime"> |
||||
|
<el-select |
||||
|
v-model="rulesInfo.shifttime" |
||||
|
placeholder="请选择起始工作时间段" |
||||
|
clearable |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in timeSelect" |
||||
|
:key="item.id" |
||||
|
:label="item.name + ' [' + item.startTime + '-' + item.endTime + ']'" |
||||
|
:value="item.id" |
||||
|
/> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="起始轮询班组" prop="rule"> |
||||
|
<el-select v-model="rulesInfo.rule" placeholder="请选择起始轮询班组" clearable> |
||||
|
<el-option |
||||
|
v-for="item in rulesSelect" |
||||
|
:key="item.id" |
||||
|
:label="item.name + ' [NO.' + item.sort + ']'" |
||||
|
:value="item.id" |
||||
|
/> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
<template #footer class="el_dialog__footer"> |
||||
|
<div class="dialog-footer"> |
||||
|
<el-button |
||||
|
size="small" |
||||
|
type="primary" |
||||
|
@click="setOrgRulessubmit" |
||||
|
:loading="loadRules" |
||||
|
>确 定</el-button |
||||
|
> |
||||
|
<el-button size="small" @click="closeRulesDialog">取 消</el-button> |
||||
|
</div> |
||||
|
</template> |
||||
|
</el-dialog> |
||||
|
</template> |
||||
|
<style lang="scss" scoped></style> |
||||
@ -0,0 +1,195 @@ |
|||||
|
<!-- |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-16 14:39:18 |
||||
|
@ 备注: 周内容 |
||||
|
--> |
||||
|
<script lang="ts" setup> |
||||
|
import { PropType } from "vue"; |
||||
|
import DateClass from "@/api/calendar/DateClass"; |
||||
|
import { dateBase } from "@/api/calendar/Calendar"; |
||||
|
import FormPageCont from "@/components/DesignForm/tableListPage/formPageCont.vue"; |
||||
|
const props = defineProps({ |
||||
|
col: { |
||||
|
type: Object as PropType<dateBase>, |
||||
|
default: () => { |
||||
|
return {}; |
||||
|
}, |
||||
|
}, |
||||
|
time: { |
||||
|
type: String, |
||||
|
default: "", |
||||
|
}, |
||||
|
}); |
||||
|
const isCurrentMonth = (time: string) => { |
||||
|
console.log("分割时间", time); |
||||
|
const months = time.split("-")[1]; |
||||
|
return DateClass.getCurrent()[1] === Number(months); |
||||
|
}; |
||||
|
const emit = defineEmits(["changeTargetDate"]); |
||||
|
const changeTargetDate = (time: dateBase) => { |
||||
|
emit("changeTargetDate", time); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2024-07-16 10:32:41 |
||||
|
@ 功能: 搜索数据 |
||||
|
*/ |
||||
|
const searchtData = (val: any, time?: any) => { |
||||
|
return time; |
||||
|
}; |
||||
|
</script> |
||||
|
<template> |
||||
|
<div |
||||
|
class="calendar-item-container" |
||||
|
:class="[ |
||||
|
{ |
||||
|
'is-current': col.isCurrent, |
||||
|
'is-holidays': col.isHolidays, |
||||
|
'is-week': col.isWeek, |
||||
|
'is-selected': col.date === props.time, |
||||
|
'is-current-month': isCurrentMonth(col.date), |
||||
|
}, |
||||
|
]" |
||||
|
@click="changeTargetDate(col)" |
||||
|
> |
||||
|
<div class="dayStyle"> |
||||
|
{{ col }} |
||||
|
<span>{{ col.title }}</span> |
||||
|
<div v-if="col.isHolidays">休</div> |
||||
|
<span>{{ col.lunarsChina }}</span> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
<style lang="scss" scoped></style> |
||||
|
<style scoped lang="less"> |
||||
|
.calendar-item-container { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
flex-direction: column; |
||||
|
box-sizing: border-box; |
||||
|
border-radius: 6px; |
||||
|
border: 2px solid #ffffff; |
||||
|
|
||||
|
.dayList { |
||||
|
height: calc(100% - 20px); |
||||
|
overflow-y: auto; |
||||
|
} |
||||
|
.dayLogCont { |
||||
|
white-space: nowrap; /* 确保文本在一行内显示 */ |
||||
|
overflow: hidden; /* 隐藏溢出的内容 */ |
||||
|
text-overflow: ellipsis; /* 使用省略号表示文本溢出 */ |
||||
|
font-size: 0.95rem; |
||||
|
border: 1px solid #bcbcbc; |
||||
|
border-radius: 5px; |
||||
|
margin-bottom: 5px; |
||||
|
padding: 0 5px; |
||||
|
} |
||||
|
.dayStyle { |
||||
|
display: flex; |
||||
|
// align-items: top; |
||||
|
justify-content: space-between; |
||||
|
font-size: 12px; |
||||
|
color: #999999; |
||||
|
} |
||||
|
.calendar-title { |
||||
|
font-size: 1.2rem; |
||||
|
color: #999999; |
||||
|
} |
||||
|
.calendar-lunar { |
||||
|
margin-top: 6px; |
||||
|
|
||||
|
font-size: 0.85rem; |
||||
|
color: #bcbcbc; |
||||
|
} |
||||
|
transition: all 0.2s; |
||||
|
} |
||||
|
.calendar-item-container:hover { |
||||
|
cursor: pointer; |
||||
|
border: 2px solid #409eff; |
||||
|
} |
||||
|
.is-holidays { |
||||
|
.holidays-text { |
||||
|
position: absolute; |
||||
|
top: 6px; |
||||
|
left: 14px; |
||||
|
font-size: 0.85rem; |
||||
|
color: #ffa2a2; |
||||
|
} |
||||
|
.calendar-title { |
||||
|
color: #ffa2a2; |
||||
|
} |
||||
|
.dayStyle { |
||||
|
color: #ffa2a2; |
||||
|
} |
||||
|
background-color: #feeeef; |
||||
|
} |
||||
|
.is-selected { |
||||
|
border: 2px solid #409eff; |
||||
|
} |
||||
|
.is-holidays.is-selected { |
||||
|
border: 2px solid #ffa2a2; |
||||
|
} |
||||
|
.is-selected.is-current-month { |
||||
|
border: 2px solid #409eff; |
||||
|
} |
||||
|
.is-holidays.is-selected.is-current-month { |
||||
|
border: 2px solid #f62b2b; |
||||
|
} |
||||
|
.is-week { |
||||
|
.calendar-title { |
||||
|
color: #ffa2a2; |
||||
|
} |
||||
|
.dayStyle { |
||||
|
color: #ffa2a2; |
||||
|
} |
||||
|
} |
||||
|
.calendar-item-container.is-current { |
||||
|
.calendar-title { |
||||
|
color: #333333; |
||||
|
} |
||||
|
.dayStyle { |
||||
|
color: #333333; |
||||
|
} |
||||
|
.calendar-lunar { |
||||
|
color: #666666; |
||||
|
} |
||||
|
} |
||||
|
.calendar-item-container.is-current.is-holidays { |
||||
|
.holidays-text { |
||||
|
position: absolute; |
||||
|
top: 6px; |
||||
|
left: 14px; |
||||
|
font-size: 0.85rem; |
||||
|
color: #f62b2b; |
||||
|
} |
||||
|
background-color: #fbe3e4; |
||||
|
} |
||||
|
.calendar-item-container.is-current.is-holidays, |
||||
|
.calendar-item-container.is-current.is-week { |
||||
|
.calendar-title { |
||||
|
color: #f62b2b; |
||||
|
} |
||||
|
.dayStyle { |
||||
|
color: #f62b2b; |
||||
|
} |
||||
|
} |
||||
|
.calendar-item-container.is-current.is-holidays { |
||||
|
.holidays-text { |
||||
|
position: absolute; |
||||
|
top: 6px; |
||||
|
left: 14px; |
||||
|
font-size: 0.85rem; |
||||
|
color: #fb4949; |
||||
|
} |
||||
|
.calendar-title { |
||||
|
color: #fb6e6e; |
||||
|
} |
||||
|
.dayStyle { |
||||
|
color: #fb6e6e; |
||||
|
} |
||||
|
background-color: #ffe4e7; |
||||
|
} |
||||
|
.calendar-item-container.is-holidays:hover { |
||||
|
border: 2px solid #f62b2b; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,119 @@ |
|||||
|
<!-- |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-16 14:08:25 |
||||
|
@ 备注: 日历周 |
||||
|
--> |
||||
|
<script lang="ts" setup> |
||||
|
import Calendar from "@/api/calendar/Calendar"; |
||||
|
import DateClass from "@/api/calendar/DateClass"; |
||||
|
import { dateBase } from "@/api/calendar/Calendar"; |
||||
|
import { clockFactory } from "@/api/calendar/utils"; |
||||
|
import { gainCalendarList } from "@/api/calendar/request"; |
||||
|
import WeekInfoPage from "@/views/hr/teams/classTime/weekInfoPage.vue"; |
||||
|
|
||||
|
const props = defineProps({ |
||||
|
taDay: { |
||||
|
type: Array, |
||||
|
default() { |
||||
|
return [2024, 7, 13]; |
||||
|
}, |
||||
|
}, |
||||
|
}); |
||||
|
//周期 |
||||
|
const THeader = Calendar.title(); |
||||
|
const WeekBody = ref<any>([]); |
||||
|
const selectedTime = ref( |
||||
|
props.taDay[0] + "-" + clockFactory(props.taDay[1]) + "-" + clockFactory(props.taDay[2]) |
||||
|
); |
||||
|
onMounted(() => { |
||||
|
WeekBody.value = Calendar.gainDayOfWeek( |
||||
|
props.taDay.start[0], |
||||
|
props.taDay.start[1], |
||||
|
props.taDay.start[2] |
||||
|
); |
||||
|
nextTick(() => { |
||||
|
let ddTime = DateClass.getCurrent(); |
||||
|
selectedTime.value = |
||||
|
ddTime[0] + "-" + clockFactory(ddTime[1]) + "-" + clockFactory(ddTime[2]); |
||||
|
}); |
||||
|
}); |
||||
|
const emit = defineEmits(["getDate"]); |
||||
|
const changeDate = (time: dateBase) => { |
||||
|
selectedTime.value = time.date; |
||||
|
emit("getDate", time); |
||||
|
}; |
||||
|
watch( |
||||
|
() => props.taDay, |
||||
|
(val: any) => { |
||||
|
WeekBody.value = Calendar.gainDayOfWeek( |
||||
|
props.taDay.start[0], |
||||
|
props.taDay.start[1], |
||||
|
props.taDay.start[2] |
||||
|
); |
||||
|
}, |
||||
|
{ |
||||
|
deep: true, |
||||
|
} |
||||
|
); |
||||
|
const loadWeek = ref(false); |
||||
|
</script> |
||||
|
<template> |
||||
|
<div class="monthCalendarBox"> |
||||
|
<ul class="t-calendar-header"> |
||||
|
<li v-for="(item, index) in THeader" :key="index"> |
||||
|
{{ item }} |
||||
|
</li> |
||||
|
</ul> |
||||
|
<div class="t-calendar-day" v-loading="loadWeek"> |
||||
|
<template v-if="WeekBody.length"> |
||||
|
<div class="t-calendar-row" v-for="(item, index) in WeekBody" :key="index"> |
||||
|
<WeekInfoPage |
||||
|
:col="item" |
||||
|
:time="selectedTime" |
||||
|
@changeTargetDate="changeDate" |
||||
|
></WeekInfoPage> |
||||
|
</div> |
||||
|
</template> |
||||
|
<template v-else> |
||||
|
<div class="no-date">抱歉,暂无数据</div> |
||||
|
</template> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
<style lang="scss" scoped> |
||||
|
.monthCalendarBox { |
||||
|
width: 100%; |
||||
|
margin-top: 10px; |
||||
|
height: calc(100vh - 340px); |
||||
|
.t-calendar-header { |
||||
|
display: flex; |
||||
|
width: 100%; |
||||
|
height: 42px; |
||||
|
padding: 0; |
||||
|
box-sizing: border-box; |
||||
|
li { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
flex: 1; |
||||
|
font-size: 0.95rem; |
||||
|
} |
||||
|
} |
||||
|
.t-calendar-day { |
||||
|
display: flex; |
||||
|
width: 100%; |
||||
|
height: calc(100% - 42px); |
||||
|
padding: 0; |
||||
|
box-sizing: border-box; |
||||
|
border-right: 1px solid #ebeef5; |
||||
|
.t-calendar-row { |
||||
|
width: calc(100% / 7); |
||||
|
|
||||
|
font-size: 0.95rem; |
||||
|
border-bottom: 1px solid #ebeef5; |
||||
|
border-top: 1px solid #ebeef5; |
||||
|
border-left: 1px solid #ebeef5; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,186 @@ |
|||||
|
<!-- |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 11:17:13 |
||||
|
@ 备注: 班次管理 |
||||
|
--> |
||||
|
<script lang="ts" setup> |
||||
|
import { TimesClassInfo } from "@/api/hr/people/type"; |
||||
|
import { teamTimeList, editWorkTimeState } from "@/api/hr/people/index"; |
||||
|
|
||||
|
import AddClass from "@/views/hr/teams/classTime/addClass.vue"; |
||||
|
import EditClass from "@/views/hr/teams/classTime/editClass.vue"; |
||||
|
|
||||
|
const searchData = reactive({ |
||||
|
name: "", |
||||
|
}); |
||||
|
const searchFormRef = ref(ElForm); |
||||
|
const timeClassList = ref<TimesClassInfo[]>([]); |
||||
|
const teamLookInfo = ref<TimesClassInfo>(); |
||||
|
const addIsShow = ref(false); |
||||
|
const editIsShow = ref(false); |
||||
|
const setupIsShow = ref(false); |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 11:34:57 |
||||
|
@ 功能: 获取班次列表 |
||||
|
*/ |
||||
|
const getTimeClassList = () => { |
||||
|
teamTimeList(searchData).then((data: any) => { |
||||
|
timeClassList.value = data.data; |
||||
|
}); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 11:39:01 |
||||
|
@ 功能: 查询班次 |
||||
|
*/ |
||||
|
const searchSubmit = () => { |
||||
|
getTimeClassList(); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 13:14:17 |
||||
|
@ 功能: 改变班次轮询规则状态 |
||||
|
*/ |
||||
|
const switchChange = (val: any) => { |
||||
|
// console.log("改变班次轮询规则状态", val); |
||||
|
let setState = 2; |
||||
|
if (val.states) setState = 1; |
||||
|
let sendData = { |
||||
|
id: val.id.toString(), |
||||
|
state: setState, |
||||
|
constrain: 2, |
||||
|
}; |
||||
|
editWorkTimeState(sendData).then((data: any) => { |
||||
|
getTimeClassList(); |
||||
|
}); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 13:31:30 |
||||
|
@ 功能: 新增班次轮询规则 |
||||
|
*/ |
||||
|
const addNewCont = () => { |
||||
|
// console.log("新增班次轮询规则"); |
||||
|
addIsShow.value = true; |
||||
|
// console.log("新增班次轮询规则", addIsShow.value); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-15 09:16:08 |
||||
|
@ 功能: 编辑班次轮询 |
||||
|
*/ |
||||
|
const showEdit = (val: any) => { |
||||
|
teamLookInfo.value = val; |
||||
|
editIsShow.value = true; |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-15 09:12:06 |
||||
|
@ 功能: 删除班次轮询 |
||||
|
*/ |
||||
|
const deleteOperate = (val: any) => { |
||||
|
ElMessageBox.confirm("您确定要删除此内容?一经删除!内容将不可恢复!", "Warning", { |
||||
|
confirmButtonText: "确定", |
||||
|
cancelButtonText: "取消", |
||||
|
type: "warning", |
||||
|
}) |
||||
|
.then(() => { |
||||
|
let sendData = { |
||||
|
id: val.id.toString(), |
||||
|
state: 3, |
||||
|
constrain: 2, |
||||
|
}; |
||||
|
editWorkTimeState(sendData).then((data: any) => { |
||||
|
getTimeClassList(); |
||||
|
}); |
||||
|
}) |
||||
|
.catch(() => {}); |
||||
|
}; |
||||
|
//数据加载 |
||||
|
onMounted(() => { |
||||
|
getTimeClassList(); |
||||
|
}); |
||||
|
</script> |
||||
|
<template> |
||||
|
<div class="app-container"> |
||||
|
<AddClass v-model:open="addIsShow" @restdata="getTimeClassList" /> |
||||
|
<EditClass |
||||
|
v-model:open="editIsShow" |
||||
|
:team-info="teamLookInfo" |
||||
|
@restdata="getTimeClassList" |
||||
|
/> |
||||
|
<el-card shadow="never"> |
||||
|
<template #header> |
||||
|
<el-form ref="searchFormRef" :model="searchData" :inline="true"> |
||||
|
<el-form-item label="班次名称"> |
||||
|
<el-input v-model="searchData.name" clearable></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item> |
||||
|
<el-button type="primary" @click="searchSubmit" |
||||
|
><i class="fa fa-search"></i>查询</el-button |
||||
|
> |
||||
|
</el-form-item> |
||||
|
<el-form-item> |
||||
|
<el-button type="warning" @click="addNewCont" |
||||
|
><i class="fa fa-plus"></i>新增</el-button |
||||
|
> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
</template> |
||||
|
<el-table :data="timeClassList" style="width: 100%"> |
||||
|
<el-table-column prop="name" label="名称" width="200"> </el-table-column> |
||||
|
<el-table-column prop="rulename" label="轮询规则"> </el-table-column> |
||||
|
<el-table-column label="工作时段安排"> |
||||
|
<template #default="scope"> |
||||
|
<el-row v-for="item in scope.row.list" :key="item.title"> |
||||
|
<el-col :span="24" |
||||
|
>{{ item.title }} 工作时间:{{ item.startTime }} - |
||||
|
{{ item.endTime }}</el-col |
||||
|
> |
||||
|
</el-row> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
|
||||
|
<el-table-column label="状态" width="100"> |
||||
|
<template #default="scope"> |
||||
|
<el-switch |
||||
|
@change="switchChange(scope.row)" |
||||
|
style="display: block" |
||||
|
v-model="scope.row.states" |
||||
|
active-color="#13ce66" |
||||
|
inactive-color="#ff4949" |
||||
|
active-text="启用" |
||||
|
inactive-text="禁用" |
||||
|
inline-prompt |
||||
|
> |
||||
|
</el-switch> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
|
||||
|
<el-table-column |
||||
|
align="center" |
||||
|
fixed="right" |
||||
|
label="操作" |
||||
|
width="160" |
||||
|
header-align="center" |
||||
|
> |
||||
|
<template #default="scope"> |
||||
|
<el-button v-if="false" size="small" @click="setOrigin(scope.row)" |
||||
|
>设置源点</el-button |
||||
|
> |
||||
|
<el-button size="small" @click="showEdit(scope.row)">编辑</el-button> |
||||
|
<el-button size="small" @click="deleteOperate(scope.row)">删除</el-button> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
</el-card> |
||||
|
</div> |
||||
|
</template> |
||||
|
<style lang="scss" scoped> |
||||
|
.app-container { |
||||
|
:deep .el-card__header { |
||||
|
padding-bottom: 0px; |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,439 @@ |
|||||
|
<!-- |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-13 11:44:11 |
||||
|
@ 备注: 班组列表 |
||||
|
--> |
||||
|
<script lang="ts" setup> |
||||
|
import { |
||||
|
teamcontlist, |
||||
|
eidtdelteamcont, |
||||
|
addteamcont, |
||||
|
eiteteamcont, |
||||
|
} from "@/api/hr/org/index"; |
||||
|
|
||||
|
import BatchImportTimePeople from "@/views/hr/teams/batchImportTimePeople.vue"; |
||||
|
|
||||
|
const searchFormRef = ref(ElForm); |
||||
|
const addFormRef = ref(ElForm); |
||||
|
const searchMap = reactive({ |
||||
|
page: 1, |
||||
|
pagesize: 20, |
||||
|
name: "", |
||||
|
}); |
||||
|
const loadLing = ref(false); |
||||
|
const totalCount = ref(0); |
||||
|
const tiemList = ref([]); |
||||
|
const selectTableLength = ref(0); |
||||
|
const tableIds = ref<string[]>([]); //已选择的行政组织ID数组 |
||||
|
|
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-13 13:48:00 |
||||
|
@ 功能: 获取班组列表 |
||||
|
*/ |
||||
|
const gainTimeList = () => { |
||||
|
loadLing.value = true; |
||||
|
teamcontlist(searchMap) |
||||
|
.then((data) => { |
||||
|
totalCount.value = data.data.total; |
||||
|
tiemList.value = data.data.list; |
||||
|
}) |
||||
|
.finally(() => { |
||||
|
loadLing.value = false; |
||||
|
}); |
||||
|
}; |
||||
|
|
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-13 13:54:15 |
||||
|
@ 功能: 加载完毕页面 |
||||
|
*/ |
||||
|
onMounted(() => { |
||||
|
gainTimeList(); |
||||
|
}); |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-13 15:00:20 |
||||
|
@ 功能: 搜索班组 |
||||
|
*/ |
||||
|
const getOrgteimList = () => { |
||||
|
searchMap.page = 1; |
||||
|
gainTimeList(); |
||||
|
}; |
||||
|
/** |
||||
|
* 重置搜索表单 |
||||
|
*/ |
||||
|
function resetSearchQuery() { |
||||
|
searchFormRef.value.resetFields(); |
||||
|
gainTimeList(); |
||||
|
} |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-13 15:33:49 |
||||
|
@ 功能: 改变状态 |
||||
|
*/ |
||||
|
const editOrgClassState = (id: number, state: any) => { |
||||
|
console.log("改变状态---", id, state); |
||||
|
if (state == 1) { |
||||
|
state = 2; |
||||
|
} else { |
||||
|
state = 1; |
||||
|
} |
||||
|
let send = { |
||||
|
id: id, |
||||
|
idstr: id.toString(), |
||||
|
state: state, |
||||
|
istrue: 2, |
||||
|
}; |
||||
|
eidtdelteamcont(send).then((data) => { |
||||
|
console.log("改变状态结果--》,", data); |
||||
|
gainTimeList(); |
||||
|
}); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-13 15:37:00 |
||||
|
@ 功能: 批量选择 |
||||
|
*/ |
||||
|
const handleClassIdChange = (selection: any) => { |
||||
|
selectTableLength.value = selection.length; |
||||
|
tableIds.value = selection.map((item: any) => item.id); |
||||
|
}; |
||||
|
|
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-13 16:04:47 |
||||
|
@ 功能: 添加班组相关数据 |
||||
|
*/ |
||||
|
const addDiaShow = ref(false); |
||||
|
|
||||
|
const addTiemInfo = reactive({ |
||||
|
name: "", |
||||
|
}); |
||||
|
|
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-13 16:09:06 |
||||
|
@ 功能: 新增数据 |
||||
|
*/ |
||||
|
const addOrgClassDialog = () => { |
||||
|
addDiaShow.value = true; |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-13 16:10:57 |
||||
|
@ 功能: 关闭添加班组 |
||||
|
*/ |
||||
|
const closeAddDiaShow = () => { |
||||
|
addDiaShow.value = false; |
||||
|
addFormRef.value.resetFields(); |
||||
|
gainTimeList(); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-13 16:13:11 |
||||
|
@ 功能: 重置添加表单 |
||||
|
*/ |
||||
|
const resetAddTime = () => { |
||||
|
addTiemInfo.name = ""; |
||||
|
addFormRef.value.resetFields(); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-13 16:15:34 |
||||
|
@ 功能: 提交新增班组 |
||||
|
*/ |
||||
|
const sendAddTime = () => { |
||||
|
addteamcont(addTiemInfo).then((data) => { |
||||
|
closeAddDiaShow(); |
||||
|
}); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-13 16:19:26 |
||||
|
@ 功能: 删除 |
||||
|
*/ |
||||
|
const handleDeleteOrgClass = (classId?: string) => { |
||||
|
const delOrgTypeIds = [classId || tableIds.value].join(","); |
||||
|
if (!delOrgTypeIds) { |
||||
|
ElMessage.warning("请勾选删除项"); |
||||
|
return; |
||||
|
} |
||||
|
ElMessageBox.confirm("确认删除已选中的数据项?", "警告", { |
||||
|
confirmButtonText: "确定", |
||||
|
cancelButtonText: "取消", |
||||
|
type: "warning", |
||||
|
}) |
||||
|
.then(() => { |
||||
|
let send = { |
||||
|
id: classId, |
||||
|
idstr: classId.toString(), |
||||
|
state: 3, |
||||
|
istrue: 2, |
||||
|
}; |
||||
|
eidtdelteamcont(send).then((data) => { |
||||
|
gainTimeList(); |
||||
|
}); |
||||
|
}) |
||||
|
.catch(() => ElMessage.info("已取消删除")); |
||||
|
}; |
||||
|
///////////////////////////////////// |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-13 16:27:00 |
||||
|
@ 功能: 修改 |
||||
|
*/ |
||||
|
const editDiaShow = ref(false); |
||||
|
const editTiemInfo = reactive({ |
||||
|
id: "", |
||||
|
name: "", |
||||
|
}); |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-13 16:46:54 |
||||
|
@ 功能: 编辑班组 |
||||
|
*/ |
||||
|
const editOrgTypeDialog = (val: any) => { |
||||
|
editTiemInfo.id = val.id.toString(); |
||||
|
editTiemInfo.name = val.name; |
||||
|
editDiaShow.value = true; |
||||
|
}; |
||||
|
const editFormRef = ref(null); |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-13 16:51:07 |
||||
|
@ 功能: 关闭编辑班组弹窗 |
||||
|
*/ |
||||
|
const closeEditDiaShow = () => { |
||||
|
editDiaShow.value = false; |
||||
|
editFormRef.value.resetFields(); |
||||
|
gainTimeList(); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-13 16:53:25 |
||||
|
@ 功能: 重置编辑按钮 |
||||
|
*/ |
||||
|
const resetEditTime = () => { |
||||
|
editTiemInfo.id = ""; |
||||
|
editTiemInfo.name = ""; |
||||
|
editFormRef.value.resetFields(); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-13 16:55:06 |
||||
|
@ 功能: 发送修改数组数据 |
||||
|
*/ |
||||
|
const sendEditTime = () => { |
||||
|
eiteteamcont(editTiemInfo).then((data) => { |
||||
|
closeEditDiaShow(); |
||||
|
}); |
||||
|
}; |
||||
|
|
||||
|
const setupOpen = ref(false); |
||||
|
const setupTeimId = ref(""); |
||||
|
const setupTeimTitle = ref(""); |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 07:56:27 |
||||
|
@ 功能: 设置班组人员 |
||||
|
*/ |
||||
|
const setupTimePeople = (val: any) => { |
||||
|
setupTeimId.value = val.id.toString(); |
||||
|
setupTeimTitle.value = val.name; |
||||
|
setupOpen.value = true; |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-14 08:02:29 |
||||
|
@ 功能: 关闭批量导入 |
||||
|
*/ |
||||
|
const closeBatchImport = () => { |
||||
|
setupTeimId.value = ""; |
||||
|
setupTeimTitle.value = ""; |
||||
|
setupOpen.value = false; |
||||
|
}; |
||||
|
</script> |
||||
|
<template> |
||||
|
<div class="app-container"> |
||||
|
<el-card shadow="never"> |
||||
|
<template #header> |
||||
|
<el-form ref="searchFormRef" :model="searchMap" :inline="true"> |
||||
|
<el-form-item label="班组名称" prop="keywords"> |
||||
|
<el-input |
||||
|
v-model="searchMap.name" |
||||
|
placeholder="请输入关键字" |
||||
|
clearable |
||||
|
@keyup.enter="getOrgteimList" |
||||
|
/> |
||||
|
</el-form-item> |
||||
|
<el-form-item> |
||||
|
<el-button type="primary" @click="getOrgteimList"> |
||||
|
<template #icon><i-ep-search /></template> |
||||
|
搜索 |
||||
|
</el-button> |
||||
|
<el-button @click="resetSearchQuery"> |
||||
|
<template #icon><i-ep-refresh /></template> |
||||
|
重置 |
||||
|
</el-button> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
</template> |
||||
|
|
||||
|
<div style="margin-bottom: 15px; height: 32px; display: flex"> |
||||
|
<el-button |
||||
|
type="primary" |
||||
|
@click="addOrgClassDialog()" |
||||
|
v-hasPerm="['339372544081539072']" |
||||
|
> |
||||
|
<i-ep-plus /> |
||||
|
新增 |
||||
|
</el-button> |
||||
|
<!-- <el-button |
||||
|
v-hasPerm="['339372760021086208']" |
||||
|
plain |
||||
|
type="primary" |
||||
|
:disabled="tiemList.length === 0" |
||||
|
@click="handleDeleteOrgClass()" |
||||
|
> |
||||
|
<i-ep-delete />删除 |
||||
|
</el-button> |
||||
|
<span class="select-text">已选 {{ selectTableLength }} 条</span> --> |
||||
|
</div> |
||||
|
|
||||
|
<el-table |
||||
|
v-loading="loadLing" |
||||
|
highlight-current-row |
||||
|
:data="tiemList" |
||||
|
stripe |
||||
|
@selection-change="handleClassIdChange" |
||||
|
:header-cell-style="{ background: '#F4F5F9' }" |
||||
|
> |
||||
|
<!-- <el-table-column type="selection" width="55" align="center" /> --> |
||||
|
<el-table-column label="班组名称" prop="name" /> |
||||
|
<el-table-column |
||||
|
v-hasPerm="['339372659932409856']" |
||||
|
label="状态" |
||||
|
prop="state" |
||||
|
width="100" |
||||
|
align="center" |
||||
|
> |
||||
|
<template #default="scope"> |
||||
|
<el-switch |
||||
|
v-model="scope.row.status" |
||||
|
class="ml-2" |
||||
|
inline-prompt |
||||
|
style="--el-switch-on-color: #1e5eff" |
||||
|
@change="editOrgClassState(scope.row.id, scope.row.state)" |
||||
|
/> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column fixed="right" label="操作" align="center" width="250"> |
||||
|
<template #default="scope"> |
||||
|
<el-button |
||||
|
v-hasPerm="['339372597063987200']" |
||||
|
type="primary" |
||||
|
link |
||||
|
size="small" |
||||
|
@click.stop="setupTimePeople(scope.row)" |
||||
|
>设置班组人员</el-button |
||||
|
> |
||||
|
<el-button |
||||
|
v-hasPerm="['339372597063987200']" |
||||
|
type="primary" |
||||
|
link |
||||
|
size="small" |
||||
|
@click.stop="editOrgTypeDialog(scope.row)" |
||||
|
>编辑</el-button |
||||
|
> |
||||
|
<el-button |
||||
|
v-hasPerm="['339372708624084992']" |
||||
|
type="primary" |
||||
|
link |
||||
|
size="small" |
||||
|
@click.stop="handleDeleteOrgClass(scope.row.id)" |
||||
|
>删除</el-button |
||||
|
> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
|
||||
|
<pagination |
||||
|
v-if="total > 0" |
||||
|
v-model:total="totalCount" |
||||
|
v-model:page="searchMap.page" |
||||
|
v-model:limit="searchMap.pagesize" |
||||
|
@pagination="searchMap" |
||||
|
/> |
||||
|
</el-card> |
||||
|
|
||||
|
<el-dialog |
||||
|
v-model="editDiaShow" |
||||
|
title="编辑班组" |
||||
|
width="300" |
||||
|
:before-close="closeEditDiaShow" |
||||
|
> |
||||
|
<el-form ref="editFormRef" :model="editTiemInfo"> |
||||
|
<el-form-item label="班组名称" prop="keywords"> |
||||
|
<el-input v-model="editTiemInfo.name" placeholder="请输入班组名称" clearable /> |
||||
|
</el-form-item> |
||||
|
<el-form-item> |
||||
|
<el-button type="primary" @click="sendEditTime"> |
||||
|
<template #icon><i-ep-search /></template> |
||||
|
确定 |
||||
|
</el-button> |
||||
|
<el-button @click="resetEditTime"> |
||||
|
<template #icon><i-ep-refresh /></template> |
||||
|
重置 |
||||
|
</el-button> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
</el-dialog> |
||||
|
|
||||
|
<el-dialog |
||||
|
v-model="addDiaShow" |
||||
|
title="添加班组" |
||||
|
width="300" |
||||
|
:before-close="closeAddDiaShow" |
||||
|
> |
||||
|
<el-form ref="addFormRef" :model="addTiemInfo"> |
||||
|
<el-form-item label="班组名称" prop="keywords"> |
||||
|
<el-input v-model="addTiemInfo.name" placeholder="请输入班组名称" clearable /> |
||||
|
</el-form-item> |
||||
|
<el-form-item> |
||||
|
<el-button type="primary" @click="sendAddTime"> |
||||
|
<template #icon><i-ep-search /></template> |
||||
|
确定 |
||||
|
</el-button> |
||||
|
<el-button @click="resetAddTime"> |
||||
|
<template #icon><i-ep-refresh /></template> |
||||
|
重置 |
||||
|
</el-button> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
</el-dialog> |
||||
|
|
||||
|
<el-dialog |
||||
|
v-model="setupOpen" |
||||
|
:title="'批量导入《' + setupTeimTitle + '》人员'" |
||||
|
width="500" |
||||
|
:before-close="closeBatchImport" |
||||
|
> |
||||
|
<BatchImportTimePeople |
||||
|
v-model:is-show="setupOpen" |
||||
|
:id="setupTeimId" |
||||
|
@closeOpen="closeBatchImport" |
||||
|
/> |
||||
|
</el-dialog> |
||||
|
</div> |
||||
|
</template> |
||||
|
<style lang="scss" scoped> |
||||
|
.select-text { |
||||
|
display: inline-block; |
||||
|
color: #999; |
||||
|
font-size: 16px; |
||||
|
padding-left: 15px; |
||||
|
line-height: 40px; |
||||
|
height: 32px; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,419 @@ |
|||||
|
<!-- |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-15 14:13:24 |
||||
|
@ 备注: 排班管理 |
||||
|
--> |
||||
|
<script lang="ts" setup> |
||||
|
import DateClass from "@/api/calendar/DateClass"; |
||||
|
import { clockFactory } from "@/api/calendar/utils"; |
||||
|
import { accordRoleGiveOrg, gainShiftRules } from "@/api/hr/people/index"; |
||||
|
|
||||
|
import MonthPage from "@/views/hr/teams/classTime/monthPage.vue"; |
||||
|
import WeekPage from "@/views/hr/teams/classTime/weekPage.vue"; |
||||
|
import DayPage from "@/views/hr/teams/classTime/dayPage.vue"; |
||||
|
import SetupShiftRules from "@/views/hr/teams/classTime/setupShiftRules.vue"; |
||||
|
|
||||
|
const orgTreeLoading = ref(false); |
||||
|
const orgTreeList = ref([]); //行政组织树数据 |
||||
|
const orgTreeProps = { |
||||
|
children: "child", |
||||
|
label: "name", |
||||
|
}; //行政组织树对照值 |
||||
|
const cureeOrgName = ref(""); |
||||
|
const cureeOrgId = ref(0); |
||||
|
const taday = ref<any>([]); //当前日期 |
||||
|
const curtteDayType = ref(1); |
||||
|
const curtteDay = ref(1); |
||||
|
const shiftRulesOpen = ref(false); |
||||
|
const teamRulerIsm = ref({ |
||||
|
begainTime: "", |
||||
|
id: "", |
||||
|
orgId: "", |
||||
|
periodName: "", |
||||
|
periodid: "", |
||||
|
rules: "", |
||||
|
rulesTime: "长白班(1)", |
||||
|
starttime: "", |
||||
|
time: "", |
||||
|
typeIdStr: "", |
||||
|
typeName: "", |
||||
|
typeid: "", |
||||
|
}); |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-16 09:46:35 |
||||
|
@ 功能: 获取行政组织树 |
||||
|
*/ |
||||
|
const gainOrgTree = () => { |
||||
|
orgTreeLoading.value = true; |
||||
|
accordRoleGiveOrg() |
||||
|
.then((dada) => { |
||||
|
// console.log("获取行政组织树", dada); |
||||
|
orgTreeList.value = dada.data.orgTree; |
||||
|
if (dada.data.orgName != "") { |
||||
|
cureeOrgName.value = dada.data.orgName; |
||||
|
cureeOrgId.value = dada.data.orgId; |
||||
|
} else if (dada.data.maindeparmentName != "") { |
||||
|
cureeOrgName.value = dada.data.maindeparmentName; |
||||
|
cureeOrgId.value = dada.data.maindeparment; |
||||
|
} else if (dada.data.companyName != "") { |
||||
|
cureeOrgName.value = dada.data.companyName; |
||||
|
cureeOrgId.value = dada.data.company; |
||||
|
} |
||||
|
getCurrOrgRules(cureeOrgId.value.toString()); |
||||
|
}) |
||||
|
.finally(() => { |
||||
|
orgTreeLoading.value = false; |
||||
|
}); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-16 09:57:20 |
||||
|
@ 功能: 选中行政组织 |
||||
|
*/ |
||||
|
const handleOrgTreeNodeClick = (val: any) => { |
||||
|
// console.log("选中行政组织", val); |
||||
|
cureeOrgName.value = val.name; |
||||
|
cureeOrgId.value = val.id; |
||||
|
getCurrOrgRules(val.id.toString()); |
||||
|
}; |
||||
|
|
||||
|
//当前月 |
||||
|
const curtteMonth = computed(() => { |
||||
|
if (taday.value.length <= 0) { |
||||
|
taday.value = DateClass.getCurrent(); |
||||
|
} |
||||
|
// console.log("当前月", taday.value); |
||||
|
if (curtteDayType.value != 2) { |
||||
|
if (taday.value.length >= 2) { |
||||
|
return taday.value[0] + "年" + taday.value[1] + "月"; |
||||
|
} |
||||
|
} else { |
||||
|
if (taday.value.start != undefined) { |
||||
|
return taday.value.start[0] + "年"; |
||||
|
} else { |
||||
|
return taday.value[0] + "年" + taday.value[1] + "月"; |
||||
|
} |
||||
|
} |
||||
|
}); |
||||
|
//当前星期 |
||||
|
const curttWeek = computed(() => { |
||||
|
if (taday.value.length <= 0) { |
||||
|
taday.value = DateClass.getCurrent(); |
||||
|
} |
||||
|
// console.log("当前星期", taday.value); |
||||
|
if (curtteDayType.value != 2) { |
||||
|
return DateClass.getWeek( |
||||
|
DateClass.solarWeek(taday.value[0], taday.value[1], taday.value[2]) |
||||
|
); |
||||
|
} else { |
||||
|
return ( |
||||
|
taday.value.start[1] + |
||||
|
"月" + |
||||
|
taday.value.start[2] + |
||||
|
"-" + |
||||
|
taday.value.end[1] + |
||||
|
"月" + |
||||
|
taday.value.end[2] |
||||
|
); |
||||
|
} |
||||
|
}); |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2024-07-12 11:12:12 |
||||
|
@ 功能: 后退时间 |
||||
|
*/ |
||||
|
const backTime = () => { |
||||
|
if (taday.value.length <= 0) { |
||||
|
taday.value = DateClass.getCurrent(); |
||||
|
} |
||||
|
// console.log("后退时间", taday.value); |
||||
|
if (curtteDayType.value != 2) { |
||||
|
taday.value = DateClass.gobackTime( |
||||
|
taday.value[0], |
||||
|
taday.value[1], |
||||
|
taday.value[2], |
||||
|
curtteDayType.value, |
||||
|
-1 |
||||
|
); |
||||
|
} else { |
||||
|
let weekObject = DateClass.gobackTime( |
||||
|
taday.value.start[0], |
||||
|
taday.value.start[1], |
||||
|
taday.value.start[2], |
||||
|
curtteDayType.value, |
||||
|
-1 |
||||
|
); |
||||
|
taday.value = weekObject; |
||||
|
} |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2024-07-12 14:04:06 |
||||
|
@ 功能: 前进时间 |
||||
|
*/ |
||||
|
const forwardTime = () => { |
||||
|
// console.log("前进时间", curtteDayType.value); |
||||
|
if (taday.value.length <= 0) { |
||||
|
taday.value = DateClass.getCurrent(); |
||||
|
} |
||||
|
if (curtteDayType.value != 2) { |
||||
|
taday.value = DateClass.moveTime( |
||||
|
taday.value[0], |
||||
|
taday.value[1], |
||||
|
taday.value[2], |
||||
|
curtteDayType.value |
||||
|
); |
||||
|
} else { |
||||
|
let weekObject = DateClass.moveTime( |
||||
|
taday.value.start[0], |
||||
|
taday.value.start[1], |
||||
|
taday.value.start[2], |
||||
|
curtteDayType.value |
||||
|
); |
||||
|
taday.value = weekObject; |
||||
|
} |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2024-07-13 16:58:07 |
||||
|
@ 功能: 回到今日 |
||||
|
*/ |
||||
|
|
||||
|
const goTady = () => { |
||||
|
taday.value = DateClass.getCurrent(); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2024-07-13 08:33:01 |
||||
|
@ 功能: 选择时间 |
||||
|
*/ |
||||
|
const pickTime = (val: number) => { |
||||
|
curtteDayType.value = val; |
||||
|
switch (val) { |
||||
|
case 2: |
||||
|
taday.value = DateClass.getCurrent(); |
||||
|
let weekObject = DateClass.gobackTime( |
||||
|
taday.value[0], |
||||
|
taday.value[1], |
||||
|
taday.value[2], |
||||
|
curtteDayType.value |
||||
|
); |
||||
|
taday.value = weekObject; |
||||
|
break; |
||||
|
case 3: |
||||
|
taday.value = DateClass.getCurrent(); |
||||
|
break; |
||||
|
default: |
||||
|
taday.value = DateClass.getCurrent(); |
||||
|
break; |
||||
|
} |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-16 16:39:32 |
||||
|
@ 功能: 获取当前行政组织排班制度 |
||||
|
*/ |
||||
|
const getCurrOrgRules = (orgId: any) => { |
||||
|
gainShiftRules({ id: orgId }).then((data: any) => { |
||||
|
console.log("获取当前行政组织排班制度", data, data.code == 0); |
||||
|
if (data.code == 0) { |
||||
|
teamRulerIsm.value.begainTime = data.data.begainTime; |
||||
|
teamRulerIsm.value.id = data.data.id.toString(); |
||||
|
teamRulerIsm.value.orgId = data.data.orgId.toString(); |
||||
|
teamRulerIsm.value.periodName = data.data.periodName; |
||||
|
teamRulerIsm.value.periodid = data.data.periodid.toString(); |
||||
|
teamRulerIsm.value.rules = data.data.rules.toString(); |
||||
|
teamRulerIsm.value.rulesTime = data.data.rulesTime; |
||||
|
teamRulerIsm.value.starttime = data.data.starttime; |
||||
|
teamRulerIsm.value.time = data.data.time; |
||||
|
teamRulerIsm.value.typeIdStr = data.data.typeIdStr; |
||||
|
teamRulerIsm.value.typeName = data.data.typeName; |
||||
|
teamRulerIsm.value.typeid = data.data.typeid; |
||||
|
} else { |
||||
|
teamRulerIsm.value.begainTime = ""; |
||||
|
teamRulerIsm.value.id = ""; |
||||
|
teamRulerIsm.value.orgId = ""; |
||||
|
teamRulerIsm.value.periodName = ""; |
||||
|
teamRulerIsm.value.periodid = ""; |
||||
|
teamRulerIsm.value.rules = ""; |
||||
|
teamRulerIsm.value.rulesTime = ""; |
||||
|
teamRulerIsm.value.starttime = ""; |
||||
|
teamRulerIsm.value.time = ""; |
||||
|
teamRulerIsm.value.typeIdStr = ""; |
||||
|
teamRulerIsm.value.typeName = ""; |
||||
|
teamRulerIsm.value.typeid = ""; |
||||
|
} |
||||
|
}); |
||||
|
}; |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-16 15:30:43 |
||||
|
@ 功能: 更新倒班制度及源点 |
||||
|
*/ |
||||
|
const updateShiftRules = (val?: any) => { |
||||
|
getCurrOrgRules(cureeOrgId.value.toString()); |
||||
|
}; |
||||
|
onMounted(() => { |
||||
|
gainOrgTree(); |
||||
|
if (taday.value.length <= 0) { |
||||
|
taday.value = DateClass.getCurrent(); |
||||
|
} |
||||
|
}); |
||||
|
|
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-01-16 16:50:12 |
||||
|
@ 功能: 设置执行倒班制度及源点数据 |
||||
|
*/ |
||||
|
const setupOrgRules = () => { |
||||
|
shiftRulesOpen.value = true; |
||||
|
}; |
||||
|
</script> |
||||
|
<template> |
||||
|
<div class="app-container"> |
||||
|
<el-container> |
||||
|
<el-aside width="300px" style="border-right: solid 1px #f0f0f0"> |
||||
|
<el-scrollbar class="orgTreeBox"> |
||||
|
<el-tree |
||||
|
ref="orgTreeRef" |
||||
|
v-loading="orgTreeLoading" |
||||
|
node-key="id" |
||||
|
class="orgTree" |
||||
|
:data="orgTreeList" |
||||
|
:props="orgTreeProps" |
||||
|
:expand-on-click-node="false" |
||||
|
:check-on-click-node="true" |
||||
|
:check-strictly="true" |
||||
|
:default-expand-all="false" |
||||
|
@node-click="handleOrgTreeNodeClick" |
||||
|
/> |
||||
|
</el-scrollbar> |
||||
|
</el-aside> |
||||
|
<el-container> |
||||
|
<el-header |
||||
|
class="contentBetween" |
||||
|
style="border-bottom: solid 1px #f0f0f0; padding-top: 5px" |
||||
|
> |
||||
|
<el-text>当前行政组织:{{ cureeOrgName }}</el-text> |
||||
|
<div> |
||||
|
<el-text |
||||
|
>执行倒班制度及源点:{{ teamRulerIsm.typeName }} [ |
||||
|
{{ teamRulerIsm.begainTime }}({{ teamRulerIsm.periodName }}-{{ |
||||
|
teamRulerIsm.rulesTime |
||||
|
}})]</el-text |
||||
|
> |
||||
|
<el-button type="primary" text @click="setupOrgRules">设置</el-button> |
||||
|
</div> |
||||
|
</el-header> |
||||
|
<el-main> |
||||
|
<div class="calBox"> |
||||
|
<!--日历头部--> |
||||
|
<div class="calHead"> |
||||
|
<div> |
||||
|
<i class="fa fa-calendar icont"></i> |
||||
|
<el-text class="day">{{ curtteMonth }}</el-text> |
||||
|
<el-text class="week">{{ curttWeek }}</el-text> |
||||
|
</div> |
||||
|
<div> |
||||
|
<el-button-group class="ml-4"> |
||||
|
<el-button size="small" @click="goTady()">今天</el-button> |
||||
|
<el-button |
||||
|
:color="curtteDayType == 1 ? '#a0cfff' : ''" |
||||
|
@click="pickTime(1)" |
||||
|
size="small" |
||||
|
>月</el-button |
||||
|
> |
||||
|
<el-button |
||||
|
:color="curtteDayType == 2 ? '#a0cfff' : ''" |
||||
|
@click="pickTime(2)" |
||||
|
size="small" |
||||
|
>周</el-button |
||||
|
> |
||||
|
<el-button |
||||
|
:color="curtteDayType == 3 ? '#a0cfff' : ''" |
||||
|
@click="pickTime(3)" |
||||
|
size="small" |
||||
|
>日</el-button |
||||
|
> |
||||
|
<el-button |
||||
|
size="small" |
||||
|
class="fa fa-angle-left" |
||||
|
@click="backTime()" |
||||
|
></el-button> |
||||
|
<el-button |
||||
|
size="small" |
||||
|
class="fa fa-angle-right" |
||||
|
@click="forwardTime()" |
||||
|
></el-button> |
||||
|
</el-button-group> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="weekNumber"> |
||||
|
<MonthPage |
||||
|
ref="monthPageRef" |
||||
|
v-if="curtteDayType == 1" |
||||
|
:ta-day="taday" |
||||
|
:org-id="cureeOrgId" |
||||
|
/> |
||||
|
<WeekPage |
||||
|
ref="weekPageRef" |
||||
|
v-if="curtteDayType == 2" |
||||
|
:ta-day="taday" |
||||
|
:org-id="cureeOrgId" |
||||
|
/> |
||||
|
<DayPage |
||||
|
ref="dayPageRef" |
||||
|
v-if="curtteDayType == 3" |
||||
|
:ta-day="taday" |
||||
|
:org-id="cureeOrgId" |
||||
|
/> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<SetupShiftRules |
||||
|
v-model:open="shiftRulesOpen" |
||||
|
:org-id="cureeOrgId" |
||||
|
:org-name="cureeOrgName" |
||||
|
:ruler-info="teamRulerIsm" |
||||
|
@updateShiftRules="updateShiftRules" |
||||
|
/> |
||||
|
</el-main> |
||||
|
</el-container> |
||||
|
</el-container> |
||||
|
</div> |
||||
|
</template> |
||||
|
<style lang="scss" scoped> |
||||
|
.app-container { |
||||
|
:deep .el-tree-node__content { |
||||
|
padding: 16px 0; |
||||
|
} |
||||
|
} |
||||
|
.orgTreeBox { |
||||
|
height: calc(100vh - 210px); |
||||
|
} |
||||
|
.contentBetween { |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
} |
||||
|
.calBox { |
||||
|
width: 100%; |
||||
|
height: calc(100vh - 290px); |
||||
|
.calHead { |
||||
|
padding: 10px 0; |
||||
|
border-bottom: 1px solid #ccc; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: space-between; |
||||
|
.icont { |
||||
|
font-size: 20px; |
||||
|
} |
||||
|
.day { |
||||
|
font-size: 20px; |
||||
|
padding: 0 10px; |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
Loading…
Reference in new issue