|
@@ -46,8 +46,8 @@
|
|
|
<template #dropdown>
|
|
|
<el-dropdown-menu>
|
|
|
<el-dropdown-item @click="addPersone(false)" v-permission="['teamAdd']">添加人员</el-dropdown-item>
|
|
|
- <el-dropdown-item v-permission="['teamExport']">导出人员</el-dropdown-item>
|
|
|
- <el-dropdown-item v-permission="['teamImport']">批量导入</el-dropdown-item>
|
|
|
+ <el-dropdown-item @click="transitionOperation('exportUser', '')" v-permission="['teamExport']">导出人员</el-dropdown-item>
|
|
|
+ <el-dropdown-item @click="transitionOperation('importUser', '')" v-permission="['teamImport']">批量导入</el-dropdown-item>
|
|
|
</el-dropdown-menu>
|
|
|
</template>
|
|
|
</el-dropdown>
|
|
@@ -90,10 +90,12 @@
|
|
|
<el-table-column label="创建时间" property="createTime"></el-table-column>
|
|
|
<el-table-column label="操作" width="200" fixed="right">
|
|
|
<template #default="scope">
|
|
|
- <el-button :size="'small'">重置</el-button>
|
|
|
+ <el-button :size="'small'" @click="resetPwd(scope.row)">重置</el-button>
|
|
|
<el-button type="primary" :size="'small'" @click="addPersone(scope.row)">编辑</el-button>
|
|
|
- <el-button :size="'small'" v-if="scope.row.isActive == 1">停用</el-button>
|
|
|
- <el-button :size="'small'" v-if="scope.row.isActive == 0">启用</el-button>
|
|
|
+ <el-button :size="'small'" @click="transitionOperation('disable', scope.row)"
|
|
|
+ v-if="scope.row.isActive == 1">停用</el-button>
|
|
|
+ <el-button type="success" :size="'small'" @click="enableUser(scope.row)"
|
|
|
+ v-if="scope.row.isActive == 0">启用</el-button>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
@@ -128,10 +130,21 @@
|
|
|
</div>
|
|
|
|
|
|
<!-- 新增部门 -->
|
|
|
- <el-dialog v-model="dialogFrom.addDeptDialogVisible" :title="deptListItem.label || '创建部门'" width="500"
|
|
|
- :before-close="handleClose">
|
|
|
- <div class="pt-2">
|
|
|
- <el-form ref="deptRuleFormRef" style="max-width: 500px" :model="deptForm" :rules="deptRules" label-width="auto"
|
|
|
+ <el-dialog v-model="dialogFrom.addDeptDialogVisible" width="600" :show-close="false" :before-close="handleClose">
|
|
|
+ <template #header="{ close, titleId, titleClass }">
|
|
|
+ <div class="flex justify-between items-center border-b pb-3 dialog-header">
|
|
|
+ <h4 :id="titleId">{{ deptListItem.label || '创建部门' }}</h4>
|
|
|
+ <div class="flex">
|
|
|
+ <el-button @click="dialogFrom.addDeptDialogVisible = false">取消</el-button>
|
|
|
+ <el-button type="primary" @click="createDepartment(deptRuleFormRef)"
|
|
|
+ v-bind:loading="loadingFrom.deptDialogVisibleLoading">
|
|
|
+ 确定
|
|
|
+ </el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <div class="pt-5">
|
|
|
+ <el-form ref="deptRuleFormRef" style="max-width: 500px" :model="deptForm" :rules="deptRules" label-width="140px"
|
|
|
size="large" status-icon>
|
|
|
<el-form-item label="部门名称" prop="name">
|
|
|
<el-input v-model="deptForm.name" placeholder="请输入部门名称" clearable />
|
|
@@ -148,15 +161,75 @@
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
</div>
|
|
|
- <template #footer>
|
|
|
- <div class="dialog-footer">
|
|
|
- <el-button @click="dialogFrom.addDeptDialogVisible = false">取消</el-button>
|
|
|
- <el-button type="primary" @click="createDepartment(deptRuleFormRef)"
|
|
|
- v-bind:loading="loadingFrom.deptDialogVisibleLoading">
|
|
|
- 确定
|
|
|
- </el-button>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <!-- 停用 -->
|
|
|
+ <el-dialog v-model="dialogFrom.resignationVisible" width="600" :show-close="false" :before-close="handleClose">
|
|
|
+ <template #header="{ close, titleId, titleClass }">
|
|
|
+ <div class="flex justify-between items-center border-b pb-3 dialog-header">
|
|
|
+ <h4 :id="titleId">离职停用员工</h4>
|
|
|
+ <div class="flex">
|
|
|
+ <el-button @click="dialogFrom.resignationVisible = false">取消</el-button>
|
|
|
+ <el-button type="primary" @click="resignation" v-bind:loading="loadingFrom.resignationLoading">
|
|
|
+ 确定
|
|
|
+ </el-button>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</template>
|
|
|
+ <div class="pt-4 pb-2">
|
|
|
+ <div class="flex items-center justify-center">
|
|
|
+ <div class="pr-2">员工离职日期:</div>
|
|
|
+ <el-date-picker v-model="resignationDate" type="date" placeholder="请选择日期" value-format="YYYY-MM-DD"
|
|
|
+ :clearable="false" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <!-- 导出人员列表 -->
|
|
|
+ <el-dialog v-model="dialogFrom.exportUserVisible" width="600" :show-close="false" :before-close="handleClose">
|
|
|
+ <template #header="{ close, titleId, titleClass }">
|
|
|
+ <div class="flex justify-between items-center border-b pb-3 dialog-header">
|
|
|
+ <h4 :id="titleId">导出人员列表</h4>
|
|
|
+ <div class="flex">
|
|
|
+ <el-button @click="dialogFrom.exportUserVisible = false">取消</el-button>
|
|
|
+ <el-button type="primary" @click="exportUser" v-bind:loading="loadingFrom.exportUserLoading">
|
|
|
+ 导出
|
|
|
+ </el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <div class="pt-4 pb-2">
|
|
|
+ <div class="flex items-center justify-center">
|
|
|
+ <div class="pr-2">导出:</div>
|
|
|
+ <el-radio-group v-model="exportRadio" class="ml-4">
|
|
|
+ <el-radio value="1" size="large">全部人员</el-radio>
|
|
|
+ <el-radio value="0" size="large">仅在职人员</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <!-- 人员导入 -->
|
|
|
+ <el-dialog v-model="dialogFrom.importVisible" width="680" :show-close="false" top="10vh">
|
|
|
+ <template #header="{ close, titleId, titleClass }">
|
|
|
+ <div class="flex justify-between items-center border-b pb-3 dialog-header">
|
|
|
+ <h4 :id="titleId">人员批量导入</h4>
|
|
|
+ <div class="flex">
|
|
|
+ <el-button class="mr-3" @click="dialogFrom.importVisible = false">取消</el-button>
|
|
|
+ <el-upload ref="importUserRef" class="upload-demo" :limit="1" :show-file-list="false" accept=".xlsx"
|
|
|
+ :http-request="importUser">
|
|
|
+ <el-button type="primary" :loading="loadingFrom.importLoading">导入</el-button>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <div class="p-8">
|
|
|
+ <div class="ml-4 mr-4">
|
|
|
+ <div class="flex items-center">1、点击下载 <el-link type="primary"
|
|
|
+ @click="downloadFile('/upload/人员导入模板.xlsx', '人员导入模板.xlsx')">人员导入模板.xlsx</el-link></div>
|
|
|
+ <div class="mt-4">2、填写excel模板,并上传</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</el-dialog>
|
|
|
|
|
|
<!-- 新增人员 -->
|
|
@@ -175,17 +248,19 @@
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
import { ref, reactive, onMounted, onBeforeMount, inject } from 'vue';
|
|
|
-import { dayjs } from 'element-plus'
|
|
|
+import { UploadRequestOptions, dayjs } from 'element-plus'
|
|
|
import { Search, CirclePlusFilled, Edit, CirclePlus, Delete } from '@element-plus/icons-vue'
|
|
|
import { FormInstance, FormRules, ElMessageBox } from 'element-plus'
|
|
|
import { useStore } from '@/store/index'
|
|
|
-import { GET_DATA_LIST, DETELE_DEPT, MOD, GET_USERINFO, GET_ROUTELIST, GET_DEPTLIST, BACTHSERROLE, GET_USERLIST, GET_ADDDEPT, ADD_USER } from './api'
|
|
|
-import { post } from "@/utils/request";
|
|
|
-import { getFromValue, updateDepTreeData, resetFromValue } from '@/utils/tools'
|
|
|
+import { GET_DATA_LIST, DETELE_DEPT, MOD, GET_USERINFO, GET_ROUTELIST, DEACTIVEUSER, SETACTIVE, GET_DEPTLIST, BACTHSERROLE, GET_USERLIST, GET_ADDDEPT, ADD_USER, SETRESETPWD, EXPOERTUSER } from './api'
|
|
|
+import { post, uploadFile } from "@/utils/request";
|
|
|
+import { getFromValue, updateDepTreeData, resetFromValue, confirmAction, downloadFile } from '@/utils/tools'
|
|
|
|
|
|
// 导入页面
|
|
|
import AddPersonnelModal from './module/AddPersonnelModal.vue'
|
|
|
import BatchOperation from './module/BatchOperation.vue'
|
|
|
+import { formatDate } from '@/utils/times';
|
|
|
+import { URL_IMPORTTHREAD } from '../thread/constant';
|
|
|
|
|
|
const { getFunctionList, getUserInfoVal } = useStore()
|
|
|
const globalPopup = inject<GlobalPopup>('globalPopup')
|
|
@@ -202,16 +277,26 @@ interface deptRuleForm { // 部门表单类型
|
|
|
// 固定数据
|
|
|
const stateOptions = [{ value: '3', label: '全部' }, { value: '1', label: '在职' }, { value: '0', label: '停用' }]
|
|
|
|
|
|
+// ref
|
|
|
+const importUserRef = ref<any>()
|
|
|
+
|
|
|
// 定义变量
|
|
|
+const transitiondata = ref<any>() // 过度数据(针对二次弹窗)
|
|
|
const pagePermission: any = ref([]) // 功能权限
|
|
|
const loadingFrom = reactive({ // 所有加载状态
|
|
|
tableLoading: false,
|
|
|
- deptDialogVisibleLoading: false
|
|
|
+ deptDialogVisibleLoading: false,
|
|
|
+ resignationLoading: false,
|
|
|
+ exportUserLoading: false,
|
|
|
+ importLoading: false
|
|
|
})
|
|
|
const dialogFrom: any = reactive({ // 所有弹窗状态
|
|
|
addDeptDialogVisible: false,
|
|
|
addPersonnelDialogVisible: false,
|
|
|
- batchOperationVisible: false
|
|
|
+ batchOperationVisible: false,
|
|
|
+ resignationVisible: false,
|
|
|
+ exportUserVisible: false,
|
|
|
+ importVisible: false,
|
|
|
});
|
|
|
const allText = reactive({
|
|
|
batchText: '批量操作'
|
|
@@ -228,6 +313,8 @@ const multipleTableRef: any = ref()
|
|
|
const deptListUntreated: any = ref([]) // 部门数据(未处理)
|
|
|
const deptListItem: any = ref({}) // 选中的部门数据
|
|
|
const personnelFromData = ref({}) // 人员表单数据
|
|
|
+const resignationDate = ref(formatDate(new Date())) // 员工离职日期
|
|
|
+const exportRadio = ref('1') // 导出人员列表
|
|
|
const teamForm = reactive({ // 筛选条件表单
|
|
|
matchingType: 0,
|
|
|
keyword: '',
|
|
@@ -257,6 +344,66 @@ const deptRules = reactive<FormRules<typeof deptForm>>({ // 部门表单校验
|
|
|
})
|
|
|
|
|
|
// 定义方法
|
|
|
+async function importUser(param: UploadRequestOptions) {
|
|
|
+ loadingFrom.importLoading = true
|
|
|
+ const formData = new FormData();
|
|
|
+ formData.append('file', param.file)
|
|
|
+ const res = await uploadFile(URL_IMPORTTHREAD, formData).finally(() => {
|
|
|
+ importUserRef.value.clearFiles()
|
|
|
+ loadingFrom.importLoading = false
|
|
|
+ })
|
|
|
+ loadingFrom.importLoading = false
|
|
|
+ if (res.code == 'ok') {
|
|
|
+ globalPopup?.showSuccess('导入成功' || '')
|
|
|
+ closeModal('importVisible')
|
|
|
+ getTableData()
|
|
|
+ return
|
|
|
+ }
|
|
|
+ globalPopup?.showError(res.msg || '')
|
|
|
+}
|
|
|
+
|
|
|
+function exportUser() {
|
|
|
+ loadingFrom.exportUserLoading = true
|
|
|
+ post(EXPOERTUSER, { containInvalid: exportRadio.value }).then((res) => {
|
|
|
+ downloadFile(`${res.data}`, '人员列表.xlsx')
|
|
|
+ globalPopup?.showSuccess('导出成功')
|
|
|
+ closeModal('exportUserVisible')
|
|
|
+ }).finally(() => {
|
|
|
+ loadingFrom.exportUserLoading = false
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+function enableUser(row: any) {
|
|
|
+ const id = row.id
|
|
|
+ post(SETACTIVE, { id, isActive: 1 }).then(() => {
|
|
|
+ globalPopup?.showSuccess('启用成功')
|
|
|
+ getTableData()
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+function resignation() {
|
|
|
+ const id = transitiondata.value.id || ''
|
|
|
+ loadingFrom.resignationLoading = true
|
|
|
+ post(DEACTIVEUSER, { id, inactiveDate: resignationDate.value }).then(() => {
|
|
|
+ globalPopup?.showSuccess('停用成功')
|
|
|
+ getTableData()
|
|
|
+ closeModal('resignationVisible')
|
|
|
+ }).finally(() => {
|
|
|
+ loadingFrom.resignationLoading = false
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+function resetPwd(row: any) {
|
|
|
+ const userId = row.id
|
|
|
+ confirmAction(`确定要为${row.name}重置密码吗?`, '重置密码').then(() => {
|
|
|
+ post(SETRESETPWD, { userId }).then(() => {
|
|
|
+ globalPopup?.showSuccess('密码已重置为000000,请通知员工及时修改')
|
|
|
+ }).catch((err) => {
|
|
|
+ globalPopup?.showError(err.msg)
|
|
|
+ })
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
function batchEnableItem() {
|
|
|
const userIds = batchTableData.value.map((item: any) => item.id)
|
|
|
post(BACTHSERROLE, { ids: JSON.stringify(userIds), isActive: 1 }).then(() => {
|
|
@@ -451,6 +598,21 @@ function handleClose(done: any) {
|
|
|
done()
|
|
|
}
|
|
|
|
|
|
+function transitionOperation(type: string, data: any) {
|
|
|
+ if (type == 'disable') { // 停用
|
|
|
+ resignationDate.value = formatDate(new Date())
|
|
|
+ console.log(resignationDate.value, '<==== 离职')
|
|
|
+ dialogFrom.resignationVisible = true
|
|
|
+ } else if (type == 'exportUser') { // 导出
|
|
|
+ exportRadio.value = '1'
|
|
|
+ dialogFrom.exportUserVisible = true
|
|
|
+ } else if (type == 'importUser') { // 导入
|
|
|
+ dialogFrom.importVisible = true
|
|
|
+ }
|
|
|
+
|
|
|
+ transitiondata.value = data
|
|
|
+}
|
|
|
+
|
|
|
function closeModal(modelType: string, flag: boolean = false) {
|
|
|
dialogFrom[modelType] = false
|
|
|
if (flag) {
|