考勤员工设置

src/api/personnel/attendance/employee/index.js

@@ -0,0 +1,138 @@
+import request from '@/utils/request'
+import { praseStrEmpty } from "@/utils/ruoyi";
+
+// 查询用户列表
+export function listUser(query) {
+  return request({
+    url: '/system/user/page',
+    // url: '/personnel/employee/page',
+    method: 'get',
+    params: query
+  })
+}
+
+// 获取用户精简信息列表
+export function listSimpleUsers() {
+  return request({
+    url: '/system/user/list-all-simple',
+    method: 'get'
+  })
+}
+
+// 查询用户详细
+export function getUser(userId) {
+  return request({
+    url: '/system/user/get?id=' + praseStrEmpty(userId),
+    method: 'get'
+  })
+}
+
+// 新增用户
+export function addUser(data) {
+  return request({
+    url: '/system/user/create',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改用户
+export function updateUser(data) {
+  return request({
+    url: '/system/user/update',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除用户
+export function delUser(userId) {
+  return request({
+    url: '/system/user/delete?id=' + userId,
+    method: 'delete'
+  })
+}
+
+// 导出用户
+export function exportUser(query) {
+  return request({
+    url: '/system/user/export',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}
+
+// 用户密码重置
+export function resetUserPwd(id, password) {
+  const data = {
+    id,
+    password
+  }
+  return request({
+    url: '/system/user/update-password',
+    method: 'put',
+    data: data
+  })
+}
+
+// 用户状态修改
+export function changeUserStatus(id, status) {
+  const data = {
+    id,
+    status
+  }
+  return request({
+    url: '/system/user/update-status',
+    method: 'put',
+    data: data
+  })
+}
+
+// 查询用户个人信息
+export function getUserProfile() {
+  return request({
+    url: '/system/user/profile/get',
+    method: 'get'
+  })
+}
+
+// 修改用户个人信息
+export function updateUserProfile(data) {
+  return request({
+    url: '/system/user/profile/update',
+    method: 'put',
+    data: data
+  })
+}
+
+// 用户密码重置
+export function updateUserPwd(oldPassword, newPassword) {
+  const data = {
+    oldPassword,
+    newPassword
+  }
+  return request({
+    url: '/system/user/profile/update-password',
+    method: 'put',
+    data: data
+  })
+}
+
+// 用户头像上传
+export function uploadAvatar(data) {
+  return request({
+    url: '/system/user/profile/update-avatar',
+    method: 'put',
+    data: data
+  })
+}
+
+// 下载用户导入模板
+export function importTemplate() {
+  return request({
+    url: '/system/user/get-import-template',
+    method: 'get',
+    responseType: 'blob'
+  })
+}

src/views/personnel/attendance/employee/index.vue

@@ -0,0 +1,281 @@
+<template>
+  <div class="app-container">
+    <!-- 搜索工作栏 -->
+    <el-row :gutter="20">
+      <!--部门数据-->
+      <el-col :span="4" :xs="24">
+        <div class="head-container">
+          <el-input v-model="deptName" placeholder="请输入部门名称" clearable size="small" prefix-icon="el-icon-search"
+            style="margin-bottom: 20px" />
+        </div>
+        <div class="head-container">
+          <el-tree :data="deptOptions" :props="defaultProps" :expand-on-click-node="false"
+            :filter-node-method="filterNode" ref="tree" default-expand-all highlight-current
+            @node-click="handleNodeClick" />
+        </div>
+      </el-col>
+      <!--用户数据-->
+      <el-col :span="20" :xs="24">
+        <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch"
+          label-width="68px">
+          <el-form-item label="员工姓名" prop="username">
+            <el-input v-model="queryParams.username" placeholder="请输入员工姓名" clearable style="width: 240px"
+              @keyup.enter.native="handleQuery" />
+          </el-form-item>
+          <el-form-item label="班次" prop="status">
+            <el-select v-model="queryParams.status" placeholder="班次" clearable style="width: 240px">
+              <el-option v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)" :key="parseInt(dict.value)" :label="dict.label"
+                :value="parseInt(dict.value)" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="手机号" prop="mobile">
+            <el-input v-model="queryParams.mobile" placeholder="请输入手机号码" clearable style="width: 240px"
+              @keyup.enter.native="handleQuery" />
+          </el-form-item>
+         
+          <el-form-item label="开始时间" prop="createTime">
+            <el-date-picker v-model="queryParams.createTime" style="width: 240px" value-format="yyyy-MM-dd HH:mm:ss"
+              type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"
+              :default-time="['00:00:00', '23:59:59']" />
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
+            <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
+          </el-form-item>
+        </el-form>
+
+        <el-row :gutter="10" class="mb8">
+          <el-col :span="1.5">
+            <el-button type="primary" size="mini" @click="handleAdd"
+              v-hasPermi="['system:user:create']">设置排班</el-button>
+          </el-col>
+          <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+        </el-row>
+
+        <el-table v-loading="loading" :data="userList">
+          <!-- <el-table-column label="用户编号" align="center" key="id" prop="id"/> -->
+          <el-table-column label="员工姓名" align="center" prop="username"/>
+          <el-table-column label="班次信息" align="center" prop="status">
+            <template v-slot="scope">
+              <dict-tag :type="DICT_TYPE.BPM_TASK_AUDIT_STATUS" :value="scope.row.auditStatus"/>
+            </template>
+          </el-table-column>
+          <!-- <el-table-column label="部门" align="center" key="deptName" prop="deptName"/> -->
+          <el-table-column label="手机号" align="center" prop="mobile"/>
+          <el-table-column label="邮箱" align="center" prop="nickname"/>
+          <el-table-column label="开始时间" align="center" prop="createTime" width="160">
+            <template v-slot="scope">
+              <span>{{ parseTime(scope.row.createTime) }}</span>
+            </template>
+          </el-table-column>
+        </el-table>
+
+        <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
+          @pagination="getList" />
+      </el-col>
+    </el-row>
+
+    <!-- 设置排班对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="排班选择" prop="status">
+            <el-select v-model="form.status" placeholder="请选择排班" clearable style="width: 100%;">
+              <el-option v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)" :key="parseInt(dict.value)" :label="dict.label"
+                :value="parseInt(dict.value)" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="开始时间" prop="startTime">
+        <el-date-picker value-format="yyyy-MM-dd HH:mm:ss" default-time="09:00:00" v-model="form.startTime" type="datetime" placeholder="选择时间"
+          style="width: 100%;">
+        </el-date-picker>
+      </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import {
+  addUser,
+  listUser,
+  updateUser
+} from "@/api/personnel/attendance/employee/index";
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+import { listSimpleDepts } from "@/api/system/dept";
+export default {
+  name: "SystemUser",
+  components: { Treeselect },
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 用户表格数据
+      userList: null,
+      // 弹出层标题
+      title: "",
+      // 部门树选项
+      deptOptions: undefined,
+      // 是否显示弹出层
+      open: false,
+      // 部门名称
+      deptName: undefined,
+      // 表单参数
+      form: {},
+      defaultProps: {
+        children: "children",
+        label: "name"
+      },
+      // 查询参数
+      queryParams: {
+        pageNo: 1,
+        pageSize: 10,
+        username: undefined,
+        mobile: undefined,
+        status: undefined,
+        deptId: undefined,
+        createTime: []
+      },
+      // 表单校验
+      rules: {
+        status: [
+          { required: true, message: "请选择排班", trigger: "blur" }
+        ],
+        startTime: [
+          { required: true, message: "选择时间", trigger: "blur" }
+        ],
+      },
+    };
+  },
+  watch: {
+    // 根据名称筛选部门树
+    deptName(val) {
+      this.$refs.tree.filter(val);
+    }
+  },
+  created() {
+    this.getList();
+    this.getTreeselect();
+  },
+  mounted() {
+  },
+  methods: {
+    /** 查询用户列表 */
+    getList() {
+      this.loading = true;
+      listUser(this.queryParams).then(response => {
+        this.userList = response.data.list;
+        this.total = response.data.total;
+        this.loading = false;
+      }
+      );
+    },
+    /** 查询部门下拉树结构 + 岗位下拉 */
+    getTreeselect() {
+      listSimpleDepts().then(response => {
+        // 处理 deptOptions 参数
+        this.deptOptions = [];
+        this.deptOptions.push(...this.handleTree(response.data, "id"));
+      });
+    },
+    // 筛选节点
+    filterNode(value, data) {
+      if (!value) return true;
+      return data.name.indexOf(value) !== -1;
+    },
+    // 节点单击事件
+    handleNodeClick(data) {
+      this.queryParams.deptId = data.id;
+      this.getList();
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        status: "",
+        startTime: undefined,
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNo = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "设置排班";
+    },
+   
+    /** 提交按钮 */
+    submitForm: function () {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.id !== undefined) {
+            updateUser(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addUser(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+  }
+};
+</script>
+<style lang="scss" scoped>
+.public-link-operate {
+    border-bottom: 1px solid #e1e3e5;
+    padding: 20px 0;
+    .operate-title {
+        color: #141e31;
+        font-size: 14px;
+        font-weight: 500;
+        margin-bottom: 12px;
+.link-tip {
+    color: #838892;
+    font-weight: 400;
+    margin-left: 10px;
+.link-tip-mark {
+    font-weight: 600;
+}
+}
+    }
+}
+.public-link-address {
+    color: #141e31;
+    font-weight: 500;
+    padding: 20px 0;
+.link-input {
+    font-weight: 400;
+    margin-top: 10px;
+    width: 100%;
+}
+}
+</style>