班组接口对接

Admin

2022-08-05 4a125073dfb0acfefc473e9439ff6a551735e0e5

 src/views/system/personShiftManage/shiftManage/teamManage/index.vue

copy from src/views/system/personShiftManage/workingHoursSet/index.vue
copy to src/views/system/personShiftManage/shiftManage/teamManage/index.vue
文件从 src/views/system/personShiftManage/workingHoursSet/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,9 +29,9 @@
                  @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="info" label="描述信息"/>
               <el-table-column property="groupName" label="班组名称"/>
               <el-table-column property="groupMembers" label="班组人员" width="180" :show-overflow-tooltip="true"/>
               <el-table-column property="groupInfo" label="描述"/>
               <el-table-column fixed="right" label="操作" align="center" width="250">
                  <template #default="scope">
                     <el-button link type="primary" size="small" :icon="View" @click="viewRecord(scope.row)">查看</el-button>
@@ -56,48 +56,50 @@
         </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"
                     v-model="details.groupName"
                     readonly
               />
            </el-form-item>
            <el-form-item label="关联工作时段" v-if="details.list.length>0">
               <el-input
                     v-model="details.list"
                     readonly
               />
            <el-form-item label="班组人员">
               <el-input v-model="details.groupMembers" type="textarea" readonly/>
            </el-form-item>
            <el-form-item label="描述信息" v-if="details.info">
               <el-input
                     v-model="details.info"
                     type="textarea"
                     readonly
               />
            <el-form-item label="描述">
               <el-input v-model="details.groupInfo" type="textarea" readonly/>
            </el-form-item>
            <el-form-item>
               <el-button type="primary" @click="dialogDetails = false" size="default">确认</el-button>
            </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" @open="openAdd">
         <el-form :model="addRecord" label-width="120px" ref="addRef" :rules="addRules">
            <el-form-item label="时间组名称" prop="name">
            <el-form-item label="班组名称" prop="groupName">
               <el-input
                     v-model="addRecord.name"
                     v-model="addRecord.groupName"
               >
               </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="department">
               <el-cascader
                     v-model="addRecord.department"
                     :options="departmentList"
                     :props="casProps"
                     :show-all-levels="false"
                     @change="handleChange"
               />
            </el-form-item>
            <el-form-item label="选择人员" prop="groupMembers" v-if="addRecord.department !== ''">
               <el-select v-model="addRecord.groupMembers" multiple>
                  <el-option v-for="(item,index) in workerList" :label="item.username" :key="index" :value="item.uid">{{item.username}}</el-option>
               </el-select>
            </el-form-item>
            <el-form-item label="描述信息" prop="info">
            <el-form-item label="描述" prop="groupInfo">
               <el-input
                     v-model="addRecord.info"
                     v-model="addRecord.groupInfo"
                     type="textarea"
               >
               </el-input>
@@ -138,15 +140,15 @@
   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 { teamManageApi } from '/@/api/basicDateManage/personShiftManage/teamManage';


   // 定义接口来定义对象的类型
   interface stateType {
      tableData: Array<string>,
      pageRecord: Array<string>,
      workTimeList: Array<string>,
      departmentList: Array<any>,
      workerList: Array<string>,
      casProps: {},
      multipleSelection: Array<any>,
      deleteArr: Array<any>,
      dialogDetails: boolean,
@@ -160,14 +162,17 @@
      searchWord: string,
      totalSize: number,
      addRecord: {
         name: string,
         list: Array<any>,
         info: string
         groupName: string,
         department: number | null,
         depId: number | null,
         groupMembers: Array<any>,
         groupInfo: string
      },
      details: {
         name: string,
         list: Array<any>,
         info: string
         groupName: string,
         department: number | null,
         groupMembers: Array<any>,
         groupInfo: string
      }
   }

@@ -185,30 +190,43 @@
         chosenIndex: null,
         searchWord: '',
         tableData: [],
         pageRecord: [],
         workTimeList: [],
         departmentList: [],
         department: '',
         workerList: [],
         casProps: {
            expandTrigger: 'hover',
            emitPath: false,
            value: 'depId',
            label: 'depName'
         },
         multipleSelection: [],
         dialogDetails: false,
         dialogAddRecord: false,
         deleteDialog: false,
         deleteSetDialog: false,
         addRecord: {
            name: '',
            list: [],
            info: ''
            groupName: '',
            department: null,
            groupMembers: [],
            depId: null,
            groupInfo: ''
         },
         details: {
            name: '',
            list: [],
            info: ''
            groupName: '',
            department: null,
            groupMembers: [],
            depId: null,
            groupInfo: ''
         },
         deleteId: null,
         deleteArr: []
      })
      interface User {
         name: string,
         list: [],
         info: string
         groupName: string,
         department: number | null,
         depId: number,
         groupMembers: Array<any>,
         groupInfo: string
      }
      const multipleTableRef = ref<InstanceType<typeof ElTable>>()
      const toggleSelection = (rows?: User[]) => {
@@ -235,27 +253,27 @@

      const addRef = ref<FormInstance>()
      const addRules = reactive<FormRules>({
         name: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
         list: [{required: true, message: '该内容不能为空', trigger: 'blur'}]
         groupName: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
         department: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
         groupMembers: [{required: true, message: '该内容不能为空', trigger: 'blur'}]
      })

      // 页面载入时执行方法
      onMounted(() => {
         getListByPage()
         getWorkTimePeriod()
         getAllDepartment()
      })

      // 分页获取工作时间组列表
      // 分页获取班组管理列表
      const getListByPage = async ()=>{
         const data = {pageSize: state.pageSize,pageIndex: state.pageIndex,searchParams:{name: state.searchWord}}
         let res = await workingHoursSetApi().postWorkTimeGroupPage(data);
         const data = {pageSize: state.pageSize,pageIndex: state.pageIndex,searchParams:{groupName: state.searchWord,containGroupMemberEnable: true}}
         let res = await teamManageApi().getRecordPage(data);
         if (res.data.code === '200') {
            state.pageRecord = res.data.data
            state.tableData = res.data.data.map((item)=>{
               if(item.list == null){
                  item.list = []
               if(!item.groupMembers || item.groupMembers == null){
                  item.groupMembers = []
               }else{
                  item.list= Array.from(item.list,({workTimePeriodId})=>workTimePeriodId)
                  item.groupMembers= Array.from(item.groupMembers,({username})=>username)
               }
               return item
            })
@@ -268,30 +286,26 @@
         }
      }

      // 表格数据格式化
      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 getAllDepartment = async () => {
         let res = await teamManageApi().getAllDepartment();
         if (res.data.code === '200') {
            state.departmentList = res.data.data
         } else {
            ElMessage({
               type: 'warning',
               message: res.data.msg
            });
         }
      }

      // 获取工作时段列表
      const getWorkTimePeriod = async () => {
         let res = await workingHoursApi().getWorkTimePeriod();
         if (res.data.code === '200') {
            state.workTimeList = res.data.data
            console.log(state.workTimeList,'list')
         } else {
      const handleChange = async (value)=>{
         state.addRecord.depId = value
         console.log(state.addRecord.department,'de')
         let res = await teamManageApi().getAllMember(value);
         if(res.data.code === '200'){
            state.workerList = res.data.data
         }else{
            ElMessage({
               type: 'warning',
               message: res.data.msg
@@ -316,9 +330,9 @@
         getListByPage()
      }

      // 添加工作时段方法
      // 添加班组管理方法
      const addRecord = async (data:any) => {
         let res = await workingHoursSetApi().addWorkTimeGroup(data);
         let res = await teamManageApi().addRecord(data);
         if (res.data.code === '200') {
            ElMessage({
               type: 'success',
@@ -334,8 +348,16 @@
      };

      // 修改工作时段方法
      const editRecordBtn = async (index, row) => {
         state.addRecord = JSON.parse(JSON.stringify(row))
         state.addRecord.department = ''
         state.addRecord.groupMembers = []
         state.dialogAddRecord = true
         state.chosenIndex = index
      }

      const editRecord = async (data:any) => {
         let res = await workingHoursSetApi().updateWorkTimeGroup(data);
         let res = await teamManageApi().updateRecord(data);
         if (res.data.code === '200') {
            ElMessage({
               type: 'success',
@@ -356,15 +378,15 @@
         await formEl.validate(async (valid, fields) => {
            if (valid) {
               const data = {
                  name: state.addRecord.name,
                  info: state.addRecord.info,
                  workTimePeriodIds: state.addRecord.list
                  groupName: state.addRecord.groupName,
                  groupInfo: state.addRecord.groupInfo,
                  depId: state.addRecord.depId,
                  groupMemberIds: state.addRecord.groupMembers
               }
               if (state.chosenIndex == null) {
                  await addRecord(data)
               } else {
                  data.id = JSON.stringify(state.addRecord.id),
                        console.log(data,'修改参数')
                  data.groupId = JSON.stringify(state.addRecord.groupId)
                  await editRecord(data)
               }
               state.dialogAddRecord = false
@@ -377,7 +399,7 @@

      // 删除工作时间组方法
      const deleteRecord = async (data:any) => {
         let res = await workingHoursSetApi().deleteWorkTimeGroup(data);
         let res = await teamManageApi().deleteRecord(data);
         if (res.data.code === '200') {
            ElMessage({
               type: 'success',
@@ -393,44 +415,49 @@
      }

      const deleteRecordBtn = (row) => {
         state.deleteId = row.id
         console.log(row,'row')
         state.deleteId = row.groupId
         state.deleteDialog = true
      }

      const conFirmDelete = () => {
         deleteRecord({ id: state.deleteId })
         deleteRecord({ groupId: state.deleteId })
         state.deleteDialog = false
      }

      // 批量删除
      const deleteBatchBtn = async () => {
         if (state.deleteArr.length > 0) {
            state.deleteSetDialog = true
         } else {
            ElMessage({
               type: 'warning',
               message: '请先选择要删除的记录'
            });
         }
         ElMessage({
            type: 'warning',
            message: '抱歉，本页面暂不支持批量删除'
         });
         // if (state.deleteArr.length > 0) {
         //    state.deleteSetDialog = true
         // } else {
         //    ElMessage({
         //       type: 'warning',
         //       message: '请先选择要删除的记录'
         //    });
         // }
      };

      const conFirmDeleteBatch = async () => {
         let res = await workingHoursSetApi().deletBatchWorkTimeGroup({ids: state.deleteArr});
         if (res.data.code === '200') {
            state.deleteSetDialog = false
            ElMessage({
               type: 'success',
               message: res.data.msg
            });
            getListByPage()
         } else {
            ElMessage({
               type: 'warning',
               message: res.data.msg
            });
            state.deleteSetDialog = false
         }
      }
      // const conFirmDeleteBatch = async () => {
      //    let res = await teamManageApi().deletBatchRecord({ids: state.deleteArr});
      //    if (res.data.code === '200') {
      //       state.deleteSetDialog = false
      //       ElMessage({
      //          type: 'success',
      //          message: res.data.msg
      //       });
      //       getListByPage()
      //    } else {
      //       ElMessage({
      //          type: 'warning',
      //          message: res.data.msg
      //       });
      //       state.deleteSetDialog = false
      //    }
      // }

      const handleSizeChange = (val: number) => {
         state.pageSize = val
@@ -444,18 +471,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,12 +478,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
@@ -496,7 +506,7 @@
         Delete,
         Refresh,
         Plus,
         toNames,
         handleChange,
         toggleSelection,
         handleSelectionChange,
         searchRecord,
@@ -505,11 +515,9 @@
         deleteRecordBtn,
         conFirmDelete,
         getListByPage,
         getWorkTimePeriod,
         reLoadData,
         deleteRecord,
         deleteBatchBtn,
         conFirmDeleteBatch,
         handleSizeChange,
         handleCurrentChange,
         confirmAddRecord,