add
This commit is contained in:
parent
df9ccd4c69
commit
de29f1b566
26
src/api/oa_schedule.ts
Normal file
26
src/api/oa_schedule.ts
Normal file
@ -0,0 +1,26 @@
|
||||
import request from "@/utils/request";
|
||||
|
||||
// 工作记录列表
|
||||
export function apiOaScheduleLists(params: any) {
|
||||
return request.get({ url: "/works.rcbg.oa_schedule/lists", params });
|
||||
}
|
||||
|
||||
// 添加工作记录
|
||||
export function apiOaScheduleAdd(params: any) {
|
||||
return request.post({ url: "/works.rcbg.oa_schedule/add", params });
|
||||
}
|
||||
|
||||
// 编辑工作记录
|
||||
export function apiOaScheduleEdit(params: any) {
|
||||
return request.post({ url: "/works.rcbg.oa_schedule/edit", params });
|
||||
}
|
||||
|
||||
// 删除工作记录
|
||||
export function apiOaScheduleDelete(params: any) {
|
||||
return request.post({ url: "/works.rcbg.oa_schedule/delete", params });
|
||||
}
|
||||
|
||||
// 工作记录详情
|
||||
export function apiOaScheduleDetail(params: any) {
|
||||
return request.get({ url: "/works.rcbg.oa_schedule/detail", params });
|
||||
}
|
@ -2,8 +2,8 @@
|
||||
<div class="edit-popup">
|
||||
<popup ref="popupRef" :title="popupTitle" :async="true" width="550px" @confirm="handleSubmit" @close="handleClose">
|
||||
<el-form ref="formRef" :model="formData" label-width="90px" :rules="formRules">
|
||||
<el-form-item label="调动员工" prop="uid_name">
|
||||
<el-input v-model="formData.uid_name" clearable placeholder="点击选择员工" @click="userclick('uid')" />
|
||||
<el-form-item label="调动员工" prop="user_name">
|
||||
<el-input v-model="formData.user_name" clearable placeholder="点击选择员工" @click="userclick('uid')" />
|
||||
</el-form-item>
|
||||
<el-form-item label="调出部门">
|
||||
<el-select v-model="formData.from_did" placeholder="系统自动获取" disabled class="flex-1">
|
||||
@ -67,7 +67,7 @@ const popupTitle = computed(() => {
|
||||
const formData = reactive({
|
||||
id: '',
|
||||
uid: '',
|
||||
uid_name: '',
|
||||
user_name: '',
|
||||
from_did: '',
|
||||
to_did: '',
|
||||
remark: '',
|
||||
@ -84,20 +84,26 @@ const userclick = async (val) => {
|
||||
personnel.value.open()
|
||||
}
|
||||
const submituser = (e: any) => {
|
||||
formData[value + '_name'] = e.name
|
||||
formData[value] = e.id
|
||||
// formData.
|
||||
console.log(e)
|
||||
formData['user_name'] = e.name
|
||||
formData['uid'] = e.id
|
||||
formData.from_did = e.dept_id
|
||||
showDialog.value = false
|
||||
}
|
||||
|
||||
const chekcDate = (rule: any, value: any, callback: any) => {
|
||||
console.log(formData)
|
||||
if (formData.to_did == formData.from_did) {
|
||||
callback(new Error('不同调入原部门!'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
|
||||
// 表单验证
|
||||
const formRules = reactive<any>({
|
||||
uid_name: [{
|
||||
required: true,
|
||||
message: '请输入用户ID',
|
||||
trigger: ['blur']
|
||||
message: '请选择员工',
|
||||
trigger: ['change']
|
||||
}],
|
||||
from_did: [{
|
||||
required: true,
|
||||
@ -108,7 +114,11 @@ const formRules = reactive<any>({
|
||||
required: true,
|
||||
message: '请输入调到部门id',
|
||||
trigger: ['blur']
|
||||
}],
|
||||
}, {
|
||||
validator: chekcDate,
|
||||
trigger: ['blur']
|
||||
}
|
||||
],
|
||||
admin_id: [{
|
||||
required: true,
|
||||
message: '请输入创建人',
|
||||
|
@ -29,9 +29,9 @@
|
||||
<div class="mt-4">
|
||||
<el-table :data="pager.lists" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" />
|
||||
<el-table-column label="调动员工" prop="uid_name" show-overflow-tooltip />
|
||||
<el-table-column label="调出部门" prop="from_did_text" show-overflow-tooltip />
|
||||
<el-table-column label="调入部门" prop="to_did_text" show-overflow-tooltip />
|
||||
<el-table-column label="调动员工" prop="user_name" show-overflow-tooltip />
|
||||
<el-table-column label="调出部门" prop="from_dept" show-overflow-tooltip />
|
||||
<el-table-column label="调入部门" prop="to_dept" show-overflow-tooltip />
|
||||
<el-table-column label="调动时间" prop="move_time" show-overflow-tooltip />
|
||||
<el-table-column label="状态" prop="status_text" show-overflow-tooltip />
|
||||
<el-table-column label="操作" width="120" fixed="right">
|
||||
|
@ -2,7 +2,7 @@
|
||||
<div class="edit-popup">
|
||||
<popup ref="popupRef" :title="popupTitle" :async="true" width="550px" @confirm="handleSubmit" @close="handleClose">
|
||||
<el-form ref="formRef" :model="formData" label-width="110px" :rules="formRules">
|
||||
<el-form-item label="离职员工" prop="uid">
|
||||
<el-form-item label="离职员工" prop="uid_name">
|
||||
<el-input v-model="formData.uid_name" clearable placeholder="点击选择" @click="userclick('uid', 1)" />
|
||||
</el-form-item>
|
||||
<el-form-item label="离职日期" prop="quit_time">
|
||||
@ -28,9 +28,9 @@
|
||||
<el-form-item label="离职原因">
|
||||
<el-input v-model="formData.remark" type="textarea" clearable placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
<el-form-item label="状态">
|
||||
<!-- <el-form-item label="状态">
|
||||
<el-switch v-model="formData.status" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
</el-form-item> -->
|
||||
</el-form>
|
||||
<div v-if="showDialog">
|
||||
<personnelselector ref="personnel" @confirm="submituser" :type="personnelType">
|
||||
@ -107,45 +107,45 @@ const submituser = (e: any) => {
|
||||
|
||||
// 表单验证
|
||||
const formRules = reactive<any>({
|
||||
uid: [{
|
||||
uid_name: [{
|
||||
required: true,
|
||||
message: '请输入用户ID',
|
||||
trigger: ['blur']
|
||||
message: '请选择员工',
|
||||
trigger: ['change']
|
||||
}],
|
||||
admin_id: [{
|
||||
required: true,
|
||||
message: '请输入创建人',
|
||||
trigger: ['blur']
|
||||
trigger: ['change']
|
||||
}],
|
||||
lead_admin_id: [{
|
||||
required: true,
|
||||
message: '请输入部门负责人',
|
||||
trigger: ['blur']
|
||||
trigger: ['change']
|
||||
}],
|
||||
connect_uids: [{
|
||||
required: true,
|
||||
message: '请输入参与交接人,多',
|
||||
trigger: ['blur']
|
||||
trigger: ['change']
|
||||
}],
|
||||
connect_id: [{
|
||||
required: true,
|
||||
message: '请输入资料交接人',
|
||||
trigger: ['blur']
|
||||
trigger: ['change']
|
||||
}],
|
||||
connect_time: [{
|
||||
required: true,
|
||||
message: '请输入资料交接时间',
|
||||
trigger: ['blur']
|
||||
trigger: ['change']
|
||||
}],
|
||||
status: [{
|
||||
required: true,
|
||||
message: '请输入状态:-1删除 0禁用 1启用',
|
||||
trigger: ['blur']
|
||||
message: '请输入状态',
|
||||
trigger: ['change']
|
||||
}],
|
||||
quit_time: [{
|
||||
required: true,
|
||||
message: '请输入离职时间',
|
||||
trigger: ['blur']
|
||||
trigger: ['change']
|
||||
}]
|
||||
})
|
||||
|
||||
@ -158,8 +158,10 @@ const setFormData = async (data: Record<any, any>) => {
|
||||
formData[key] = data[key]
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
formData.uid_name = data.user_name
|
||||
formData.connect_names = data.connect_users
|
||||
formData.connect_name = data.connect_user_name
|
||||
formData.uid_id = formData.uid
|
||||
}
|
||||
|
||||
const getDetail = async (row: Record<string, any>) => {
|
||||
|
@ -29,14 +29,14 @@
|
||||
<div class="mt-4">
|
||||
<el-table :data="pager.lists" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" />
|
||||
<el-table-column label="离职员工" prop="uid_name" show-overflow-tooltip />
|
||||
<el-table-column label="离职员工" prop="user_name" show-overflow-tooltip />
|
||||
<el-table-column label="离职时间" prop="quit_time" show-overflow-tooltip />
|
||||
<el-table-column label="部门负责人" prop="lead_admin_name" show-overflow-tooltip />
|
||||
<el-table-column label="资料交接人" prop="connect_name" show-overflow-tooltip />
|
||||
<el-table-column label="资料交接人" prop="connect_user_name" show-overflow-tooltip />
|
||||
<el-table-column label="资料交接时间" prop="connect_time" show-overflow-tooltip />
|
||||
<el-table-column label="参与交接人" prop="connect_names" show-overflow-tooltip />
|
||||
<el-table-column label="参与交接人" prop="connect_users" show-overflow-tooltip />
|
||||
<el-table-column label="离职原因" prop="remark" show-overflow-tooltip />
|
||||
<el-table-column label="状态" prop="status_text" show-overflow-tooltip />
|
||||
<!-- <el-table-column label="状态" prop="status_text" show-overflow-tooltip /> -->
|
||||
<el-table-column label="操作" width="120" fixed="right">
|
||||
<template #default="{ row }">
|
||||
<el-button v-perms="['works.rlzy.oa_personal_quit/edit']" type="primary" link
|
||||
|
88
src/views/oa_plan/detail.vue
Normal file
88
src/views/oa_plan/detail.vue
Normal file
@ -0,0 +1,88 @@
|
||||
<template>
|
||||
<div class="detail-popup">
|
||||
<popup ref="popupRef" title="日程安排详情" :async="true" width="550px" @confirm="handleSubmit" @close="handleClose">
|
||||
<el-descriptions :column="1" border>
|
||||
<el-descriptions-item label="工作安排主题" label-align="left" align="left" label-class-name="my-label">
|
||||
{{ formData.title }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="日程优先级" label-align="left" align="left" label-class-name="my-label">
|
||||
{{ formData.type_text }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="日程优先级" label-align="left" align="left" label-class-name="my-label">
|
||||
{{ formData.type_text }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="开始时间" label-align="left" align="left" label-class-name="my-label">
|
||||
{{ formData.start_time }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="结束时间" label-align="left" align="left" label-class-name="my-label">
|
||||
{{ formData.end_time }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="提醒类型" label-align="left" align="left" label-class-name="my-label">
|
||||
{{ formData.remind_type_text }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="描述" label-align="left" align="left" label-class-name="my-label">
|
||||
{{ formData.remark }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</popup>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup name="customdetail">
|
||||
import Popup from '@/components/popup/index.vue'
|
||||
import type { PropType } from 'vue'
|
||||
|
||||
const emit = defineEmits(['close'])
|
||||
const popupRef = shallowRef<InstanceType<typeof Popup>>()
|
||||
|
||||
// 表单数据
|
||||
const formData = reactive({
|
||||
id: '',
|
||||
title: '',
|
||||
type: '',
|
||||
type_text: '',
|
||||
start_time: '',
|
||||
end_time: '',
|
||||
remind_type: '',
|
||||
remind_type_text: '',
|
||||
remark: '',
|
||||
})
|
||||
|
||||
// 获取详情
|
||||
const setFormData = async (data: Record<any, any>) => {
|
||||
for (const key in formData) {
|
||||
if (data[key] != null && data[key] != undefined) {
|
||||
//@ts-ignore
|
||||
formData[key] = data[key]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// 提交按钮
|
||||
const handleSubmit = async () => {
|
||||
popupRef.value?.close()
|
||||
|
||||
}
|
||||
|
||||
//打开弹窗
|
||||
const open = () => {
|
||||
popupRef.value?.open()
|
||||
}
|
||||
|
||||
// 关闭回调
|
||||
const handleClose = () => {
|
||||
emit('close')
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
defineExpose({
|
||||
open,
|
||||
setFormData,
|
||||
})
|
||||
</script>
|
||||
|
@ -14,7 +14,7 @@
|
||||
<el-option label="无优先级" :value="1" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label=" 开始时间" prop="start_time">
|
||||
<el-form-item label="开始时间" prop="start_time">
|
||||
<el-date-picker class="flex-1 !flex" v-model="formData.start_time" clearable type="datetime"
|
||||
value-format="YYYY-MM-DD HH:mm" placeholder="选择开始时间">
|
||||
</el-date-picker>
|
||||
@ -77,6 +77,13 @@ const formData = reactive({
|
||||
remark: '',
|
||||
})
|
||||
|
||||
const chekcDate = (rule: any, value: any, callback: any) => {
|
||||
if (new Date(formData.end_time) < new Date(formData.start_time)) {
|
||||
callback(new Error('结束时间不能早于开始时间'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
|
||||
// 表单验证
|
||||
const formRules = reactive<any>({
|
||||
@ -99,6 +106,10 @@ const formRules = reactive<any>({
|
||||
required: true,
|
||||
message: '请输入结束时间',
|
||||
trigger: ['blur']
|
||||
},
|
||||
{
|
||||
validator: chekcDate,
|
||||
trigger: ['blur']
|
||||
}],
|
||||
remind_type: [{
|
||||
required: true,
|
||||
@ -145,8 +156,9 @@ const handleSubmit = async () => {
|
||||
}
|
||||
|
||||
//打开弹窗
|
||||
const open = (type = 'add') => {
|
||||
const open = (type = 'add', start_time = '') => {
|
||||
mode.value = type
|
||||
formData.start_time = start_time
|
||||
popupRef.value?.open()
|
||||
}
|
||||
|
||||
|
@ -5,8 +5,9 @@
|
||||
{{ data.day.split('-').slice(1).join('-') }}
|
||||
<div class="task-li" v-for="item in formData" @click.stop="handleEdit(item)">
|
||||
<div v-if="item.date.includes(data.day)">
|
||||
<span v-if="item.date[0] == data.day"> {{ item.start + item.title }} </span>
|
||||
<span v-else-if="item.date[item.date.length - 1] == data.day">{{ item.end + item.title }}</span>
|
||||
<span v-if="item.date[0] == data.day"> {{ item.start + ' ' + item.title }} </span>
|
||||
<span v-else-if="item.date[item.date.length - 1] == data.day">{{ item.end + ' ' + item.title
|
||||
}}</span>
|
||||
<span v-else> {{ item.title }} </span>
|
||||
</div>
|
||||
</div>
|
||||
@ -14,42 +15,22 @@
|
||||
</template>
|
||||
</el-calendar>
|
||||
<edit-popup v-if="showEdit" ref="editRef" @success="getLists" @close="showEdit = false" />
|
||||
<DeatilPopup v-if="showDetail" ref="detailRef" @success="getLists" @close="showEdit = false" />
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { apiOaPlanLists, apiOaPlanDetail } from '@/api/oa_plan'
|
||||
import EditPopup from '../oa_plan/edit.vue'
|
||||
import DeatilPopup from '../oa_plan/detail.vue'
|
||||
|
||||
const now = ref(new Date())
|
||||
const dialogVisible = ref(true)
|
||||
const formData = ref([])
|
||||
const editRef = ref(null)
|
||||
const showEdit = ref(false)
|
||||
const detailRef = ref(null)
|
||||
const showDetail = ref(false)
|
||||
|
||||
|
||||
let data = [
|
||||
{
|
||||
"id": 13,
|
||||
"type": "4",
|
||||
"remind_type": 0,
|
||||
"backgroundColor": "#CCEBCC",
|
||||
"borderColor": "#99CC99",
|
||||
"title": "综合系统售后工单删除失败",
|
||||
"start": "2024-05-15 09:00:00",
|
||||
"end": "2024-05-31 12:00:00"
|
||||
},
|
||||
{
|
||||
"id": 14,
|
||||
"type": "4",
|
||||
"remind_type": 0,
|
||||
"backgroundColor": "#CCEBCC",
|
||||
"borderColor": "#99CC99",
|
||||
"title": "1212",
|
||||
"start": "2024-05-25 09:00:00",
|
||||
"end": "2024-05-28 18:00:00"
|
||||
}
|
||||
]
|
||||
|
||||
function timeToDay(time) {
|
||||
const dateTime = new Date(time);
|
||||
const year = dateTime.getFullYear();
|
||||
@ -75,16 +56,14 @@ function getDatesBetween(startDate, endDate) {
|
||||
|
||||
// 编辑
|
||||
const handleEdit = async (data) => {
|
||||
showEdit.value = true
|
||||
data.id ? showDetail.value = true : showEdit.value = true
|
||||
await nextTick()
|
||||
console.log(data)
|
||||
if (data.id) {
|
||||
let res = await apiOaPlanDetail({ id: data.id })
|
||||
editRef.value?.setFormData(res)
|
||||
editRef.value?.open('edit')
|
||||
detailRef.value?.setFormData(res)
|
||||
detailRef.value?.open()
|
||||
} else {
|
||||
editRef.value?.open('add')
|
||||
|
||||
editRef.value?.open('add', data.day + ' 00:00')
|
||||
}
|
||||
}
|
||||
|
||||
|
85
src/views/oa_schedule/detail.vue
Normal file
85
src/views/oa_schedule/detail.vue
Normal file
@ -0,0 +1,85 @@
|
||||
<template>
|
||||
<div class="detail-popup">
|
||||
<popup ref="popupRef" title="工作记录详情" :async="true" width="550px" @confirm="handleSubmit" @close="handleClose">
|
||||
<el-descriptions :column="1" border>
|
||||
<el-descriptions-item label="工作记录主题" label-align="left" align="left" label-class-name="my-label">
|
||||
{{ formData.title }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="开始时间" label-align="left" align="left" label-class-name="my-label">
|
||||
{{ formData.start_time }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="结束时间" label-align="left" align="left" label-class-name="my-label">
|
||||
{{ formData.end_time }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="工作类别" label-align="left" align="left" label-class-name="my-label">
|
||||
{{ formData.cid_text }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="工作类型" label-align="left" align="left" label-class-name="my-label">
|
||||
{{ formData.labor_type_text }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="描述" label-align="left" align="left" label-class-name="my-label">
|
||||
{{ formData.remark }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</popup>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup name="customdetail">
|
||||
import Popup from '@/components/popup/index.vue'
|
||||
import type { PropType } from 'vue'
|
||||
|
||||
const emit = defineEmits(['close'])
|
||||
const popupRef = shallowRef<InstanceType<typeof Popup>>()
|
||||
|
||||
// 表单数据
|
||||
const formData = reactive({
|
||||
id: '',
|
||||
title: '',
|
||||
start_time: '',
|
||||
end_time: '',
|
||||
cid: '',
|
||||
cid_text: '',
|
||||
labor_type: '',
|
||||
labor_type_text: '',
|
||||
remark: '',
|
||||
})
|
||||
|
||||
// 获取详情
|
||||
const setFormData = async (data: Record<any, any>) => {
|
||||
for (const key in formData) {
|
||||
if (data[key] != null && data[key] != undefined) {
|
||||
//@ts-ignore
|
||||
formData[key] = data[key]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// 提交按钮
|
||||
const handleSubmit = async () => {
|
||||
popupRef.value?.close()
|
||||
|
||||
}
|
||||
|
||||
//打开弹窗
|
||||
const open = () => {
|
||||
popupRef.value?.open()
|
||||
}
|
||||
|
||||
// 关闭回调
|
||||
const handleClose = () => {
|
||||
emit('close')
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
defineExpose({
|
||||
open,
|
||||
setFormData,
|
||||
})
|
||||
</script>
|
||||
|
196
src/views/oa_schedule/edit.vue
Normal file
196
src/views/oa_schedule/edit.vue
Normal file
@ -0,0 +1,196 @@
|
||||
<template>
|
||||
<div class="edit-popup">
|
||||
<popup ref="popupRef" :title="popupTitle" :async="true" width="550px" @confirm="handleSubmit" @close="handleClose">
|
||||
<el-form ref="formRef" :model="formData" label-width="120px" :rules="formRules">
|
||||
<el-form-item label="工作记录主题" prop="title">
|
||||
<el-input v-model="formData.title" clearable placeholder="请输入工作记录主题" />
|
||||
</el-form-item>
|
||||
<el-form-item label="日期">
|
||||
<el-date-picker v-model="formData.date" value-format="YYYY-MM-DD" placeholder="选择日期"
|
||||
class="!flex flex-1"></el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="开始时间" prop="start_time">
|
||||
<el-time-picker v-model="formData.start_time" placeholder="选择开始时间" class="flex-1 !flex" />
|
||||
</el-form-item>
|
||||
<el-form-item label="结束时间" prop="end_time">
|
||||
<el-time-picker v-model="formData.end_time" placeholder="选择结束时间" class="flex-1 !flex" />
|
||||
</el-form-item>
|
||||
<el-form-item label="工作类别" prop="cid">
|
||||
<el-select v-model="formData.cid" clearable placeholder="请选择工作类别" class="flex-1">
|
||||
<el-option label="接待客户" :value="7" />
|
||||
<el-option label="拜访客户" :value="6" />
|
||||
<el-option label="参加会议" :value="5" />
|
||||
<el-option label="需求沟通" :value="4" />
|
||||
<el-option label="需求调研" :value="3" />
|
||||
<el-option label="撰写文档" :value="2" />
|
||||
<el-option label="方案策划" :value="1" />
|
||||
<el-option label="其他" :value="0" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="工作类型" prop="labor_type">
|
||||
<el-select v-model="formData.labor_type" clearable placeholder="请选择工作类别" class="flex-1">
|
||||
<el-option label="案头工作" :value="1" />
|
||||
<el-option label="外勤工作" :value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="描述">
|
||||
<el-input v-model="formData.remark" clearable placeholder="请输入描述" type="textarea" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</popup>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup name="oaScheduleEdit">
|
||||
import type { FormInstance } from 'element-plus'
|
||||
import Popup from '@/components/popup/index.vue'
|
||||
import { apiOaScheduleAdd, apiOaScheduleEdit, apiOaScheduleDetail } from '@/api/oa_schedule'
|
||||
import { timeFormat } from '@/utils/util'
|
||||
import type { PropType } from 'vue'
|
||||
defineProps({
|
||||
dictData: {
|
||||
type: Object as PropType<Record<string, any[]>>,
|
||||
default: () => ({})
|
||||
}
|
||||
})
|
||||
const emit = defineEmits(['success', 'close'])
|
||||
const formRef = shallowRef<FormInstance>()
|
||||
const popupRef = shallowRef<InstanceType<typeof Popup>>()
|
||||
const mode = ref('add')
|
||||
|
||||
|
||||
// 弹窗标题
|
||||
const popupTitle = computed(() => {
|
||||
return mode.value == 'edit' ? '编辑工作记录' : '新增工作记录'
|
||||
})
|
||||
|
||||
// 表单数据
|
||||
const formData = reactive({
|
||||
id: '',
|
||||
title: '',
|
||||
start_time: '',
|
||||
end_time: '',
|
||||
cid: '',
|
||||
labor_type: '',
|
||||
remark: '',
|
||||
date: ""
|
||||
})
|
||||
|
||||
const chekcDate = (rule: any, value: any, callback: any) => {
|
||||
if (new Date(formData.end_time) < new Date(formData.start_time)) {
|
||||
callback(new Error('结束时间不能早于开始时间'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
|
||||
// 表单验证
|
||||
const formRules = reactive<any>({
|
||||
title: [{
|
||||
required: true,
|
||||
message: '请输入工作记录主题',
|
||||
trigger: ['blur']
|
||||
}],
|
||||
start_time: [{
|
||||
required: true,
|
||||
message: '请输入开始时间',
|
||||
trigger: ['blur']
|
||||
}],
|
||||
end_time: [{
|
||||
required: true,
|
||||
message: '请输入结束时间',
|
||||
trigger: ['blur'],
|
||||
},
|
||||
{
|
||||
validator: chekcDate,
|
||||
trigger: ['blur']
|
||||
}
|
||||
],
|
||||
cid: [{
|
||||
required: true,
|
||||
message: '请选择工作类别',
|
||||
trigger: ['blur']
|
||||
}],
|
||||
labor_type: [{
|
||||
required: true,
|
||||
message: '请输入工作类型',
|
||||
trigger: ['blur']
|
||||
}],
|
||||
remark: [{
|
||||
required: true,
|
||||
message: '请输入描述',
|
||||
trigger: ['blur']
|
||||
}]
|
||||
})
|
||||
|
||||
|
||||
// 获取详情
|
||||
const setFormData = async (data: Record<any, any>) => {
|
||||
for (const key in formData) {
|
||||
if (data[key] != null && data[key] != undefined) {
|
||||
//@ts-ignore
|
||||
formData[key] = data[key]
|
||||
}
|
||||
}
|
||||
formData.date = timeFormat(new Date(formData.start_time), 'yyyy-mm-dd')
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
const getDetail = async (row: Record<string, any>) => {
|
||||
const data = await apiOaScheduleDetail({
|
||||
id: row.id
|
||||
})
|
||||
setFormData(data)
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
function getHour(params) {
|
||||
const now = new Date(params);
|
||||
const hours = now.getHours();
|
||||
const minutes = now.getMinutes();
|
||||
const formattedHours = hours < 10 ? '0' + hours : hours;
|
||||
const formattedMinutes = minutes < 10 ? '0' + minutes : minutes;
|
||||
const timeString = `${formattedHours}:${formattedMinutes}`;
|
||||
return String(' ' + timeString)
|
||||
}
|
||||
|
||||
// 提交按钮
|
||||
const handleSubmit = async () => {
|
||||
await formRef.value?.validate()
|
||||
formData.start_time = formData.date + ' ' + timeFormat(new Date(formData.start_time), 'hh:MM')
|
||||
formData.end_time = formData.date + ' ' + timeFormat(new Date(formData.end_time), 'hh:MM')
|
||||
const data = { ...formData, }
|
||||
mode.value == 'edit'
|
||||
? await apiOaScheduleEdit(data)
|
||||
: await apiOaScheduleAdd(data)
|
||||
popupRef.value?.close()
|
||||
emit('success')
|
||||
}
|
||||
|
||||
//打开弹窗
|
||||
const open = (type = 'add', start_time = '') => {
|
||||
mode.value = type
|
||||
formData.date = start_time
|
||||
popupRef.value?.open()
|
||||
}
|
||||
|
||||
|
||||
// 关闭回调
|
||||
const handleClose = () => {
|
||||
emit('close')
|
||||
}
|
||||
|
||||
|
||||
|
||||
defineExpose({
|
||||
open,
|
||||
setFormData,
|
||||
getDetail
|
||||
})
|
||||
</script>
|
122
src/views/oa_schedule/index.vue
Normal file
122
src/views/oa_schedule/index.vue
Normal file
@ -0,0 +1,122 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-card class="!border-none mb-4" shadow="never">
|
||||
<el-form class="mb-[-16px]" :model="queryParams" inline>
|
||||
<el-form-item label="工作记录主题" prop="title">
|
||||
<el-input class="w-[280px]" v-model="queryParams.title" clearable placeholder="请输入工作记录主题" />
|
||||
</el-form-item>
|
||||
<el-form-item label="工作类型" prop="labor_type">
|
||||
<el-select v-model="queryParams.labor_type" clearable placeholder="请选择工作类型" class="flex-1">
|
||||
<el-option label="案头工作" :value="1" />
|
||||
<el-option label="外勤工作" :value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="resetPage">查询</el-button>
|
||||
<el-button @click="resetParams">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
<el-card class="!border-none" v-loading="pager.loading" shadow="never">
|
||||
<el-button v-perms="['works.rcbg.oa_schedule/add']" type="primary" @click="handleAdd">
|
||||
<template #icon>
|
||||
<icon name="el-icon-Plus" />
|
||||
</template>
|
||||
新增
|
||||
</el-button>
|
||||
<el-button v-perms="['works.rcbg.oa_schedule/delete']" :disabled="!selectData.length"
|
||||
@click="handleDelete(selectData)">
|
||||
删除
|
||||
</el-button>
|
||||
<div class="mt-4">
|
||||
<el-table :data="pager.lists" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" />
|
||||
<el-table-column label="工作记录主题" prop="title" show-overflow-tooltip />
|
||||
<el-table-column label="开始时间" prop="start_time" show-overflow-tooltip />
|
||||
<el-table-column label="结束时间" prop="end_time" show-overflow-tooltip />
|
||||
<el-table-column label="工时" prop="labor_time" show-overflow-tooltip />
|
||||
<el-table-column label="工作类型" prop="labor_type_text" show-overflow-tooltip />
|
||||
<el-table-column label="描述" prop="remark" show-overflow-tooltip />
|
||||
<el-table-column label="操作" width="120" fixed="right">
|
||||
<template #default="{ row }">
|
||||
<el-button v-perms="['works.rcbg.oa_schedule/edit']" type="primary" link
|
||||
@click="handleEdit(row)">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button v-perms="['works.rcbg.oa_schedule/delete']" type="danger" link
|
||||
@click="handleDelete(row.id)">
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="flex mt-4 justify-end">
|
||||
<pagination v-model="pager" @change="getLists" />
|
||||
</div>
|
||||
</el-card>
|
||||
<edit-popup v-if="showEdit" ref="editRef" :dict-data="dictData" @success="getLists" @close="showEdit = false" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup name="oaScheduleLists">
|
||||
import { usePaging } from '@/hooks/usePaging'
|
||||
import { useDictData } from '@/hooks/useDictOptions'
|
||||
import { apiOaScheduleLists, apiOaScheduleDelete } from '@/api/oa_schedule'
|
||||
import { timeFormat } from '@/utils/util'
|
||||
import feedback from '@/utils/feedback'
|
||||
import EditPopup from './edit.vue'
|
||||
|
||||
const editRef = shallowRef<InstanceType<typeof EditPopup>>()
|
||||
// 是否显示编辑框
|
||||
const showEdit = ref(false)
|
||||
|
||||
|
||||
// 查询条件
|
||||
const queryParams = reactive({
|
||||
title: '',
|
||||
labor_type: ''
|
||||
})
|
||||
|
||||
// 选中数据
|
||||
const selectData = ref<any[]>([])
|
||||
|
||||
// 表格选择后回调事件
|
||||
const handleSelectionChange = (val: any[]) => {
|
||||
selectData.value = val.map(({ id }) => id)
|
||||
}
|
||||
|
||||
// 获取字典数据
|
||||
const { dictData } = useDictData('')
|
||||
|
||||
// 分页相关
|
||||
const { pager, getLists, resetParams, resetPage } = usePaging({
|
||||
fetchFun: apiOaScheduleLists,
|
||||
params: queryParams
|
||||
})
|
||||
|
||||
// 添加
|
||||
const handleAdd = async () => {
|
||||
showEdit.value = true
|
||||
await nextTick()
|
||||
editRef.value?.open('add')
|
||||
}
|
||||
|
||||
// 编辑
|
||||
const handleEdit = async (data: any) => {
|
||||
showEdit.value = true
|
||||
await nextTick()
|
||||
editRef.value?.open('edit')
|
||||
editRef.value?.setFormData(data)
|
||||
}
|
||||
|
||||
// 删除
|
||||
const handleDelete = async (id: number | any[]) => {
|
||||
await feedback.confirm('确定要删除?')
|
||||
await apiOaScheduleDelete({ id })
|
||||
getLists()
|
||||
}
|
||||
|
||||
getLists()
|
||||
</script>
|
||||
|
113
src/views/oa_schedule_calendar/index.vue
Normal file
113
src/views/oa_schedule_calendar/index.vue
Normal file
@ -0,0 +1,113 @@
|
||||
<template>
|
||||
<el-calendar v-model="now">
|
||||
<template #dateCell="{ data }">
|
||||
<div class="content" @click="handleEdit(data)">
|
||||
{{ data.day.split('-').slice(1).join('-') }}
|
||||
<div class="task-li" v-for="item in formData" @click.stop="handleEdit(item)">
|
||||
<div v-if="item.date.includes(data.day)">
|
||||
<span> {{ item.start + ' ' + item.title }} </span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-calendar>
|
||||
<edit-popup v-if="showEdit" ref="editRef" @success="getLists" @close="showEdit = false" />
|
||||
<DeatilPopup v-if="showDetail" ref="detailRef" @success="getLists" @close="showEdit = false" />
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { apiOaScheduleLists, apiOaScheduleDetail } from '@/api/oa_schedule'
|
||||
import EditPopup from '../oa_schedule/edit.vue'
|
||||
import DeatilPopup from '../oa_schedule/detail.vue'
|
||||
|
||||
const now = ref(new Date())
|
||||
const formData = ref([])
|
||||
const editRef = ref(null)
|
||||
const showEdit = ref(false)
|
||||
const detailRef = ref(null)
|
||||
const showDetail = ref(false)
|
||||
|
||||
|
||||
function timeToDay(time) {
|
||||
const dateTime = new Date(time);
|
||||
const year = dateTime.getFullYear();
|
||||
const month = dateTime.getMonth() + 1;
|
||||
const day = dateTime.getDate();
|
||||
const dateOnlyString = `${year}-${month < 10 ? '0' + month : month}-${day < 10 ? '0' + day : day}`;
|
||||
return dateOnlyString;
|
||||
}
|
||||
|
||||
function getDatesBetween(startDate, endDate) {
|
||||
const dates = [];
|
||||
let currentDate = new Date(startDate);
|
||||
while (currentDate <= new Date(endDate)) {
|
||||
dates.push(new Date(currentDate));
|
||||
currentDate.setDate(currentDate.getDate() + 1);
|
||||
}
|
||||
let list = dates.map(item => {
|
||||
return timeToDay(item)
|
||||
})
|
||||
return list
|
||||
}
|
||||
|
||||
|
||||
// 编辑
|
||||
const handleEdit = async (data) => {
|
||||
data.id ? showDetail.value = true : showEdit.value = true
|
||||
await nextTick()
|
||||
if (data.id) {
|
||||
let res = await apiOaScheduleDetail({ id: data.id })
|
||||
detailRef.value?.setFormData(res)
|
||||
detailRef.value?.open()
|
||||
} else {
|
||||
editRef.value?.open('add', data.day + ' 00:00')
|
||||
}
|
||||
}
|
||||
|
||||
const getLists = async () => {
|
||||
let res = await apiOaScheduleLists()
|
||||
formData.value = res.lists.map(item => {
|
||||
return {
|
||||
id: item.id,
|
||||
title: item.title,
|
||||
date: getDatesBetween(item.start_time, item.end_time),
|
||||
start: item.start_time.substring(item.start_time.length - 5),
|
||||
end: item.end_time.substring(item.end_time.length - 5),
|
||||
labor_time: item.labor_time
|
||||
}
|
||||
})
|
||||
console.log(formData.value);
|
||||
}
|
||||
|
||||
getLists()
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.content {
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
overflow-y: auto; // 取消滚动条
|
||||
-ms-overflow-style: none;
|
||||
scrollbar-width: none;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.task-li {
|
||||
background-color: #2D8CF0;
|
||||
color: white;
|
||||
border-radius: 10px;
|
||||
margin-bottom: 5px;
|
||||
box-sizing: border-box;
|
||||
padding: 0 15px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
</style>
|
Loading…
x
Reference in New Issue
Block a user