变更记录

src/api/system.js

@@ -133,6 +133,16 @@ export function getRosterDetails (params) {
   return http.post('/digitizationData/employee/detail', params)
 }
 
+// 花名册快照
+export function getRosterVersion (params) {
+  return http.post('/digitizationData/employee/version/page', params)
+}
+
+// 花名册快照导出
+export function exportRosterVersion (params) {
+  return http.download('/digitizationData/employee/version/download/export', params)
+}
+
 // 花名册钻取员工
 // export function organizationDrill (params) {
 //   return http.post('/digitizationData/employee/organization/tree/subordinates', params)

src/components/AutoComponents/MSearch/index.vue

@@ -54,7 +54,7 @@
             </template>
           </el-autocomplete>
 
-          <!-- 时间选择器 -->
+          <!-- 日期选择器 -->
           <el-date-picker
             v-if="item.type === 'datePicker'"
             v-model="query[item.prop]"

src/views/humanResources/roster/index.vue

@@ -20,19 +20,22 @@
         </el-upload>
         <m-button type="orange" size="small" icon="el-icon-download" @click="onExport" :loading="exportLoading">导出</m-button>
         <m-button type="orange" size="small" icon="el-icon-download" @click="onDownload" :loading="downloadLoading">下载模板</m-button>
+        <m-button type="orange" size="small" icon="el-icon-setting" @click="onChange">变更记录</m-button>
       </template>
       <template #actions="{ row }">
         <m-button text type="primary" @click="onEdit(row)">编辑</m-button>
         <m-button text type="danger" @click="onDelete(row)">删除</m-button>
       </template>
     </m-table>
-    <rosterEdit ref="rosterEditRef" :title="title" @refresh="init"></rosterEdit>
+    <RosterEdit ref="rosterEditRef" :title="title" @refresh="init"></RosterEdit>
+    <RosterVersion ref="rosterVersionRefs"></RosterVersion>
   </div>
 </template>
 
 <script>
 import { downloadFile } from '@/utils'
-import rosterEdit from './rosterEdit.vue'
+import RosterEdit from './rosterEdit.vue'
+import RosterVersion from './rosterVersion.vue'
 import {
   getRosterList,
   deleteRoster,
@@ -43,7 +46,7 @@ import {
 import { mapGetters } from 'vuex'
 export default {
   name: 'sys-roster',
-  components: { rosterEdit },
+  components: { RosterEdit, RosterVersion },
   data () {
     return {
       importLoading: false,
@@ -241,6 +244,9 @@ export default {
     pageChange (index) {
       this.pageInfo.current = index
       this.init()
+    },
+    onChange () {
+      this.$refs.rosterVersionRefs.open(this.headers.slice(0, -1))
     }
   }
 }

src/views/humanResources/roster/rosterVersion.vue

@@ -0,0 +1,160 @@
+<template>
+  <el-drawer
+    title="员工变更记录"
+    :visible.sync="show"
+    direction="rtl"
+    size="75%"
+  >
+    <div class="pa-3">
+      <m-search shadow="never" class="mb-3" :items="searchItems" v-model="searchValues" @search="onSearch"></m-search>
+      <m-table
+        v-loading="loading"
+        shadow="never"
+        :card-title="`员工变更记录 [ 截止 ${exportTime} ] `"
+        :headers="headers"
+        :items="items"
+        :total="total"
+        :page-size="pageInfo.size"
+        :page-current="pageInfo.current"
+        @page-change="onPageChange"
+      >
+        <template #card-tools>
+            <m-button size="mini" type="orange" icon="el-icon-download" :loading="exportLoading" @click="onExport">导出</m-button>
+          </template>
+      </m-table>
+    </div>
+  </el-drawer>
+</template>
+
+<script>
+import { getRosterVersion, exportRosterVersion } from '@/api/system'
+import { downloadFile } from '@/utils'
+import { mapGetters } from 'vuex'
+import {
+  dateFormat
+} from '@/utils/date'
+export default {
+  name: 'rosterVersion',
+  data () {
+    return {
+      loading: false,
+      headers: [],
+      items: [],
+      show: false,
+      pageInfo: {
+        size: 10,
+        current: 1
+      },
+      searchValues: {
+        versionDate: dateFormat('YYYY-mm-dd HH:MM:SS', new Date()),
+        employeeName: null
+      },
+      exportTime: dateFormat('YYYY-mm-dd HH:MM:SS', new Date()),
+      exportLoading: false
+    }
+  },
+  computed: {
+    ...mapGetters(['organizationTree']),
+    searchItems () {
+      return [
+        {
+          label: '时间',
+          type: 'datePicker',
+          prop: 'versionDate',
+          options: {
+            placeholder: '请选择时间',
+            type: 'datetime',
+            valueFormat: 'yyyy-MM-dd HH:mm:ss'
+          }
+        },
+        {
+          label: '员工名称',
+          options: {
+            placeholder: '请输入员工名称'
+          },
+          prop: 'employeeName',
+          type: 'input'
+        },
+        {
+          label: '部门名称',
+          options: {
+            filterable: true,
+            clearable: true,
+            placeholder: '请选择部门',
+            options: this.organizationTree,
+            showAllLevels: false,
+            props: {
+              emitPath: false,
+              value: 'organizationNo',
+              label: 'organizationName',
+              children: 'child'
+            }
+          },
+          prop: 'organizationNo',
+          type: 'cascader'
+        }
+      ]
+    }
+  },
+  methods: {
+    async open (headers) {
+      this.headers = headers
+      this.show = true
+      await this.init()
+    },
+    async init () {
+      this.loading = true
+      try {
+        const { data } = await getRosterVersion({
+          page: {
+            ...this.pageInfo
+          },
+          ...this.searchValues
+        })
+        this.items = data.records.map(e => {
+          const date = new Date(e.tradeUnionsTime)
+          // 获取年、月、日
+          const year = date.getFullYear()
+          const month = String(date.getMonth() + 1).padStart(2, '0') // 月份从0开始，所以要加1
+          const day = String(date.getDate()).padStart(2, '0')
+          return {
+            ...e,
+            tradeUnionsTimeText: `${year}年${month}月${day}日`
+          }
+        })
+        this.total = data.total
+      } catch (error) {
+        this.$message.error(error)
+      } finally {
+        this.loading = false
+      }
+    },
+    async onExport () {
+      this.exportLoading = true
+      try {
+        const { data, name } = await exportRosterVersion({
+          versionDate: this.exportTime
+        })
+        downloadFile(data, name)
+      } catch (error) {
+        this.$message.error(error)
+      } finally {
+        this.exportLoading = false
+      }
+    },
+    onSearch () {
+      this.pageInfo.current = 1
+      this.exportTime = this.searchValues.versionDate
+      this.init()
+    },
+    onPageChange (index) {
+      this.pageInfo.current = index
+      this.init()
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>