From 4a125073dfb0acfefc473e9439ff6a551735e0e5 Mon Sep 17 00:00:00 2001 From: Admin <978517621@qq.com> Date: 星期五, 05 八月 2022 15:07:42 +0800 Subject: [PATCH] 班组接口对接 --- src/views/system/personShiftManage/personTimeManage/holidayTime/index.vue | 323 +++++++++++++++++++++++++++++++++++------------------ 1 files changed, 213 insertions(+), 110 deletions(-) diff --git a/src/views/system/personShiftManage/workingHoursSet/index.vue b/src/views/system/personShiftManage/personTimeManage/holidayTime/index.vue similarity index 66% copy from src/views/system/personShiftManage/workingHoursSet/index.vue copy to src/views/system/personShiftManage/personTimeManage/holidayTime/index.vue index 7eeca06..edb8aa9 100644 --- a/src/views/system/personShiftManage/workingHoursSet/index.vue +++ b/src/views/system/personShiftManage/personTimeManage/holidayTime/index.vue @@ -4,7 +4,7 @@ <el-row class="homeCard"> <el-col :span="8"> <div class="grid-content topInfo"> - <el-input v-model="searchWord" placeholder="休息时间组名称"></el-input> + <el-input v-model="searchWord" placeholder="休息日名称"></el-input> <el-button type="primary" @click="searchRecord">查询</el-button> <el-button plain @click="clearSearch">重置</el-button> </div> @@ -29,8 +29,10 @@ @selection-change="handleSelectionChange" > <el-table-column type="selection" width="100" /> - <el-table-column property="name" label="工作时间组名称"/> - <el-table-column property="list" :formatter="toNames" label="关联工作时段"/> + <el-table-column property="name" label="休息日名称"/> + <el-table-column property="typeName" label="休息日类型"/> + <el-table-column property="ruleName" label="休息日规则"/> + <el-table-column property="ruleNumber" label="休息日"/> <el-table-column property="info" label="描述信息"/> <el-table-column fixed="right" label="操作" align="center" width="250"> <template #default="scope"> @@ -56,17 +58,29 @@ </div> </div> </div> - <el-dialog v-model="dialogDetails" title="工作时间组"> + <el-dialog v-model="dialogDetails" title="休息时间"> <el-form :model="details" label-width="120px"> - <el-form-item label="时间组名称"> + <el-form-item label="名称"> <el-input v-model="details.name" readonly /> </el-form-item> - <el-form-item label="关联工作时段" v-if="details.list.length>0"> + <el-form-item label="休假类型"> <el-input - v-model="details.list" + v-model="details.typeName" + readonly + /> + </el-form-item> + <el-form-item label="休假规则" v-if="details.type == 2"> + <el-input + v-model="details.ruleName" + readonly + /> + </el-form-item> + <el-form-item label="休假时间" v-if="details.type == 2"> + <el-input + v-model="details.ruleNumber" readonly /> </el-form-item> @@ -82,18 +96,33 @@ </el-form-item> </el-form> </el-dialog> - <el-dialog v-model="dialogAddRecord" title="工作时间组编辑" @close="closeAdd" @open="openAdd"> + <el-dialog v-model="dialogAddRecord" title="休息时间编辑" @close="closeAdd"> <el-form :model="addRecord" label-width="120px" ref="addRef" :rules="addRules"> - <el-form-item label="时间组名称" prop="name"> + <el-form-item label="休息日名称" prop="name"> <el-input v-model="addRecord.name" > </el-input> </el-form-item> - <el-form-item label="关联工作时段" prop="list"> - <el-select v-model="addRecord.list" multiple> - <el-option v-for="(item,index) in workTimeList" :key="index" :label="item.name" :value="item.id" /> + <el-form-item label="休假类型" prop="type"> + <el-select v-model="addRecord.type" placeholder="请选择休假类型" style="width: 100%" @change="typeChange"> + <el-option v-for="(item,index) in typeList" :key="index" :label="item.name" :value="item.value"/> </el-select> + </el-form-item> + <el-form-item label="休假规则" prop="rule" v-if="addRecord.type == '自定义休息日' || addRecord.type == 2"> + <el-select v-model="addRecord.rule" placeholder="请选择休假规则" style="width: 100%" @change="ruleChange"> + <el-option v-for="(item,index) in ruleList" :key="index" :label="item.name" :value="item.value"/> + </el-select> + </el-form-item> + <el-form-item label="选择休假时间" prop="ruleNumber" v-if="addRecord.rule == '每周'|| addRecord.rule == 1"> + <el-checkbox-group v-model="addRecord.ruleNumber"> + <el-checkbox v-for="(item,i) in weekDays" :label="item.value" :key="i">{{item.name}}</el-checkbox> + </el-checkbox-group> + </el-form-item> + <el-form-item label="选择休假时间" prop="ruleNumber" v-if="addRecord.rule == '每月'|| addRecord.rule == 2"> + <el-checkbox-group v-model="addRecord.ruleNumber"> + <el-checkbox v-for="index in 31" :label="index" :key="index"/> + </el-checkbox-group> </el-form-item> <el-form-item label="描述信息" prop="info"> <el-input @@ -138,35 +167,42 @@ import { Edit, View, Plus, Delete, Refresh, Search, Download } from '@element-plus/icons-vue' import { ElTable } from 'element-plus' import { FormInstance, FormRules, ElMessage } from 'element-plus' - import { workingHoursSetApi } from '/@/api/basicDateManage/personShiftManage/workingHoursSet'; - import { workingHoursApi } from '/@/api/basicDateManage/personShiftManage/workingHours'; + import { holidayTimeApi } from '/@/api/basicDateManage/personShiftManage/holidayTime'; + import {workingHoursSetApi} from "/@/api/basicDateManage/personShiftManage/workingHoursSet"; + // 定义接口来定义对象的类型 interface stateType { tableData: Array<string>, - pageRecord: Array<string>, - workTimeList: Array<string>, multipleSelection: Array<any>, deleteArr: Array<any>, + weekDays: Array<any>, + typeList: Array<any>, + ruleList: Array<any>, dialogDetails: boolean, dialogAddRecord: boolean, deleteDialog: boolean, - deleteSetDialog: boolean; + deleteSetDialog: boolean, pageIndex: number, pageSize: number, - chosenIndex: null | number, - deleteId: null | number, searchWord: string, + chosenIndex: null| number, + casProps: object, + deleteId: null| number, totalSize: number, addRecord: { name: string, - list: Array<any>, + type: number | string, + rule: number | string, + ruleNumber: Array<number> | string, info: string }, details: { name: string, - list: Array<any>, + type: string, + rule: string, + ruleNumber: string, info: string } } @@ -185,21 +221,80 @@ chosenIndex: null, searchWord: '', tableData: [], - pageRecord: [], - workTimeList: [], + typeList: [ + { + name: '每周公休假日', + value: 0 + }, + { + name: '国家法定节假日', + value: 1 + }, + { + name: '自定义休息日', + value: 2 + } + ], + ruleList: [ + { + name: '每周', + value: 1 + }, + { + name: '每月', + value: 2 + } + ], multipleSelection: [], dialogDetails: false, dialogAddRecord: false, deleteDialog: false, deleteSetDialog: false, + weekDays: [ + { + name: '周一', + value: 1 + }, + { + name: '周二', + value: 2 + }, + { + name: '周三', + value: 3 + }, + { + name: '周四', + value: 4 + }, + { + name: '周五', + value: 5 + }, + { + name: '周六', + value: 6 + }, + { + name: '周日', + value: 7 + } + ], + casProps: { + expandTrigger: 'hover', + }, addRecord: { name: '', - list: [], + type: '', + rule: '', + ruleNumber: [], info: '' }, details: { name: '', - list: [], + type: '', + rule: '', + ruleNumber: '', info: '' }, deleteId: null, @@ -207,9 +302,28 @@ }) interface User { name: string, - list: [], + type: number | string, + rule: number | string, + ruleNumber: Array<number> | string, info: string } + + // 排序 + const compare = (x,y)=> { + if (x < y) { + return -1; + } else if (x > y) { + return 1; + } else { + return 0; + } + } + + const handleChange = (value) => { + state.addRecord.content = [] + console.log(JSON.parse(JSON.stringify(value))) + } + const multipleTableRef = ref<InstanceType<typeof ElTable>>() const toggleSelection = (rows?: User[]) => { if (rows) { @@ -224,6 +338,16 @@ } } + // 休息类型改变时操作 + const typeChange =()=>{ + state.addRecord.rule = '' + state.addRecord.ruleNumber = [] + } + // 休息规则改变时操作 + const ruleChange =()=>{ + state.addRecord.ruleNumber = [] + } + // 多选 const handleSelectionChange = (val: User[]) => { state.multipleSelection = JSON.parse(JSON.stringify(val)) @@ -236,61 +360,34 @@ const addRef = ref<FormInstance>() const addRules = reactive<FormRules>({ name: [{required: true, message: '该内容不能为空', trigger: 'blur'}], - list: [{required: true, message: '该内容不能为空', trigger: 'blur'}] + type: [{required: true, message: '该内容不能为空', trigger: 'blur'}], + rule: [{required: true, message: '该内容不能为空', trigger: 'blur'}], + ruleNumber: [{required: true, message: '该内容不能为空', trigger: 'blur'}] }) // 页面载入时执行方法 onMounted(() => { + // getWorkTimePeriod() getListByPage() - getWorkTimePeriod() }) - // 分页获取工作时间组列表 + // 休假类型格式化 + // const typeName =(row, column, cellValue, index) =>{ + // return row.type == 0? '每周公休假日':(row.type == 1? '国家法定节假日': '自定义休息日') + // } + + // 分页获取工作时段列表 const getListByPage = async ()=>{ const data = {pageSize: state.pageSize,pageIndex: state.pageIndex,searchParams:{name: state.searchWord}} - let res = await workingHoursSetApi().postWorkTimeGroupPage(data); + let res = await holidayTimeApi().getAllBreakTimeRuleByPage(data); if (res.data.code === '200') { - state.pageRecord = res.data.data state.tableData = res.data.data.map((item)=>{ - if(item.list == null){ - item.list = [] - }else{ - item.list= Array.from(item.list,({workTimePeriodId})=>workTimePeriodId) - } + item.typeName = item.type===0?'每周公休假日':(item.type===1?'国家法定节假日':(item.type===2?'自定义休息日':'')) + item.ruleName = item.rule===1?'每周':(item.rule===2?'每月':'') return item }) + console.log(state.tableData,'列表获取的tableData') state.totalSize = res.data.total - } else { - ElMessage({ - type: 'warning', - message: res.data.msg - }); - } - } - - // 表格数据格式化 - const toNames =(row, column, cellValue, index) => { - if(row.list==[]){ - return [] - }else{ - const nameList = [] - for(let i=0;i<row.list.length;i++){ - for(let t=0;t<state.workTimeList.length;t++){ - if(row.list[i]==state.workTimeList[t].id){ - nameList.push(state.workTimeList[t].name) - } - } - } - return nameList.join() - } - } - - // 获取工作时段列表 - const getWorkTimePeriod = async () => { - let res = await workingHoursApi().getWorkTimePeriod(); - if (res.data.code === '200') { - state.workTimeList = res.data.data - console.log(state.workTimeList,'list') } else { ElMessage({ type: 'warning', @@ -316,9 +413,9 @@ getListByPage() } - // 添加工作时段方法 + // 添加休息时间 const addRecord = async (data:any) => { - let res = await workingHoursSetApi().addWorkTimeGroup(data); + let res = await holidayTimeApi().addBreakTime(data); if (res.data.code === '200') { ElMessage({ type: 'success', @@ -333,9 +430,21 @@ } }; - // 修改工作时段方法 + // 修改休息时间 + const editRecordBtn = (index, row) => { + state.dialogAddRecord = true + state.chosenIndex = index + console.log(row,'编辑时的row') + console.log(state.tableData,'编辑时的tableData') + state.addRecord = JSON.parse(JSON.stringify(row)) + state.addRecord.ruleNumber = row.ruleNumber.split(',').map((i)=>{ + return Number(i) + }) + console.log(state.addRecord) + } + const editRecord = async (data:any) => { - let res = await workingHoursSetApi().updateWorkTimeGroup(data); + let res = await holidayTimeApi().updateBreakTime(data); if (res.data.code === '200') { ElMessage({ type: 'success', @@ -358,13 +467,23 @@ const data = { name: state.addRecord.name, info: state.addRecord.info, - workTimePeriodIds: state.addRecord.list + type: Number(state.addRecord.type), + rule: Number(state.addRecord.rule), + ruleNumber: state.addRecord.ruleNumber.sort(compare).join(',') } if (state.chosenIndex == null) { - await addRecord(data) + if(data.type == 2 && data.ruleNumber==''){ + ElMessage({ + type: 'warning', + message: '请至少选择一个休息时间' + }); + return + } else{ + await addRecord(data) + } } else { - data.id = JSON.stringify(state.addRecord.id), - console.log(data,'修改参数') + data.id = state.addRecord.id, + console.log(data,'提交时的参数data') await editRecord(data) } state.dialogAddRecord = false @@ -374,10 +493,20 @@ }) } + const closeAdd = () => { + state.addRecord = { + name: '', + type: '', + rule: '', + ruleNumber: [], + info: '' + } + state.chosenIndex = null + } - // 删除工作时间组方法 + // 删除工作时段 const deleteRecord = async (data:any) => { - let res = await workingHoursSetApi().deleteWorkTimeGroup(data); + let res = await holidayTimeApi().deleteBreakTime(data); if (res.data.code === '200') { ElMessage({ type: 'success', @@ -415,7 +544,7 @@ }; const conFirmDeleteBatch = async () => { - let res = await workingHoursSetApi().deletBatchWorkTimeGroup({ids: state.deleteArr}); + let res = await holidayTimeApi().deleteBatch({ids: state.deleteArr}); if (res.data.code === '200') { state.deleteSetDialog = false ElMessage({ @@ -444,18 +573,6 @@ // 查看记录 const viewRecord = (row) => { state.details = JSON.parse(JSON.stringify(row)) - if(row.list==[]){ - state.details.list = [] - }else{ - state.details.list = [] - for(let i=0;i<row.list.length;i++){ - for(let t=0;t<state.workTimeList.length;t++){ - if(row.list[i]==state.workTimeList[t].id){ - state.details.list.push(state.workTimeList[t].name) - } - } - } - } state.dialogDetails = true } @@ -463,21 +580,7 @@ const reLoadData = async () =>{ getListByPage() } - // 点击修改 - const editRecordBtn = (index, row) => { - state.dialogAddRecord = true - state.chosenIndex = index - state.addRecord = JSON.parse(JSON.stringify(row)) - } - const closeAdd = () => { - state.addRecord = {} - state.chosenIndex = null - } - const openAdd = () => { - if (state.chosenIndex == null) { - state.addRecord.info = '' - } - } + const indexClear = () => { state.deleteId = null } @@ -496,25 +599,25 @@ Delete, Refresh, Plus, - toNames, + typeChange, + ruleChange, + compare, toggleSelection, handleSelectionChange, + deleteBatchBtn, + conFirmDeleteBatch, searchRecord, clearSearch, viewRecord, deleteRecordBtn, conFirmDelete, getListByPage, - getWorkTimePeriod, reLoadData, deleteRecord, - deleteBatchBtn, - conFirmDeleteBatch, handleSizeChange, handleCurrentChange, confirmAddRecord, closeAdd, - openAdd, indexClear, editRecordBtn, ...toRefs(state) -- Gitblit v1.9.2