diff --git a/src/api/common.js b/src/api/common.js
index 87c582b..d1bb14a 100644
--- a/src/api/common.js
+++ b/src/api/common.js
@@ -25,3 +25,11 @@
     data: param
   })
 }
+
+// 根据部门找其默认人员
+export function getDictByType(type) {
+  return request({
+    url: 'dict/code/' + type,
+    method: 'get'
+  })
+}

diff --git a/src/api/common.js b/src/api/common.js
index 87c582b..d1bb14a 100644
--- a/src/api/common.js
+++ b/src/api/common.js
@@ -25,3 +25,11 @@
     data: param
   })
 }
+
+// 根据部门找其默认人员
+export function getDictByType(type) {
+  return request({
+    url: 'dict/code/' + type,
+    method: 'get'
+  })
+}
diff --git a/src/api/sanitation/stuff.js b/src/api/sanitation/stuff.js
new file mode 100644
index 0000000..7a49f54
--- /dev/null
+++ b/src/api/sanitation/stuff.js
@@ -0,0 +1,49 @@
+/**
+ * 人员管理接口
+ */
+import request from '@/utils/request'
+// 人员查询
+export function getStuffListPage(params) {
+  return request({
+    url: 'area/listPage',
+    method: 'get',
+    params
+  })
+}
+// 人员查询
+export function getStuffList(pid) {
+  return request({
+    url: 'area/list',
+    method: 'get',
+    params: {
+      pid: pid
+    }
+  })
+}
+
+// 添加人员
+export function addStuff(params) {
+  return request({
+    url: 'area/add',
+    method: 'post',
+    params
+  })
+}
+// 修改人员机构
+export function updateStuff(params) {
+  return request({
+    url: 'area/update',
+    method: 'post',
+    params
+  })
+}
+// 删除人员机构
+export function delStuff(id) {
+  return request({
+    url: 'area/delete',
+    method: 'post',
+    params: {
+      id: id
+    }
+  })
+}

diff --git a/src/api/common.js b/src/api/common.js
index 87c582b..d1bb14a 100644
--- a/src/api/common.js
+++ b/src/api/common.js
@@ -25,3 +25,11 @@
     data: param
   })
 }
+
+// 根据部门找其默认人员
+export function getDictByType(type) {
+  return request({
+    url: 'dict/code/' + type,
+    method: 'get'
+  })
+}
diff --git a/src/api/sanitation/stuff.js b/src/api/sanitation/stuff.js
new file mode 100644
index 0000000..7a49f54
--- /dev/null
+++ b/src/api/sanitation/stuff.js
@@ -0,0 +1,49 @@
+/**
+ * 人员管理接口
+ */
+import request from '@/utils/request'
+// 人员查询
+export function getStuffListPage(params) {
+  return request({
+    url: 'area/listPage',
+    method: 'get',
+    params
+  })
+}
+// 人员查询
+export function getStuffList(pid) {
+  return request({
+    url: 'area/list',
+    method: 'get',
+    params: {
+      pid: pid
+    }
+  })
+}
+
+// 添加人员
+export function addStuff(params) {
+  return request({
+    url: 'area/add',
+    method: 'post',
+    params
+  })
+}
+// 修改人员机构
+export function updateStuff(params) {
+  return request({
+    url: 'area/update',
+    method: 'post',
+    params
+  })
+}
+// 删除人员机构
+export function delStuff(id) {
+  return request({
+    url: 'area/delete',
+    method: 'post',
+    params: {
+      id: id
+    }
+  })
+}
diff --git a/src/assets/global_images/photo.png b/src/assets/global_images/photo.png
new file mode 100644
index 0000000..7d1e905
--- /dev/null
+++ b/src/assets/global_images/photo.png
Binary files differ

diff --git a/src/api/common.js b/src/api/common.js
index 87c582b..d1bb14a 100644
--- a/src/api/common.js
+++ b/src/api/common.js
@@ -25,3 +25,11 @@
     data: param
   })
 }
+
+// 根据部门找其默认人员
+export function getDictByType(type) {
+  return request({
+    url: 'dict/code/' + type,
+    method: 'get'
+  })
+}
diff --git a/src/api/sanitation/stuff.js b/src/api/sanitation/stuff.js
new file mode 100644
index 0000000..7a49f54
--- /dev/null
+++ b/src/api/sanitation/stuff.js
@@ -0,0 +1,49 @@
+/**
+ * 人员管理接口
+ */
+import request from '@/utils/request'
+// 人员查询
+export function getStuffListPage(params) {
+  return request({
+    url: 'area/listPage',
+    method: 'get',
+    params
+  })
+}
+// 人员查询
+export function getStuffList(pid) {
+  return request({
+    url: 'area/list',
+    method: 'get',
+    params: {
+      pid: pid
+    }
+  })
+}
+
+// 添加人员
+export function addStuff(params) {
+  return request({
+    url: 'area/add',
+    method: 'post',
+    params
+  })
+}
+// 修改人员机构
+export function updateStuff(params) {
+  return request({
+    url: 'area/update',
+    method: 'post',
+    params
+  })
+}
+// 删除人员机构
+export function delStuff(id) {
+  return request({
+    url: 'area/delete',
+    method: 'post',
+    params: {
+      id: id
+    }
+  })
+}
diff --git a/src/assets/global_images/photo.png b/src/assets/global_images/photo.png
new file mode 100644
index 0000000..7d1e905
--- /dev/null
+++ b/src/assets/global_images/photo.png
Binary files differ
diff --git a/src/router/index.js b/src/router/index.js
index 44cba3b..fecd889 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -9,7 +9,8 @@
 /* Layout */
 import Layout from '@/layout/Layout'
 import { systemRouters } from './modules/system'
-import { exampleRouters } from './modules/example'
+// import { exampleRouters } from './modules/example'
+import { sanitationRouters } from './modules/sanitation'
 
 /**
 * hidden: true                   if `hidden:true` will not show in the sidebar(default is false)
@@ -40,7 +41,7 @@
     ]
   },
   // 登录页面
-  { path: '/login', component: () => import('@/views/login/index'), hidden: true },
+  { path: '/login', component: () => import('@/views/login/index_2'), hidden: true },
   // 404错误页面
   { path: '/404', component: () => import('@/views/errorPage/404'), hidden: true },
   // 401 错误页面
@@ -70,7 +71,7 @@
 // 异步挂载路由
 // 动态需要根据权限加载的路由表
 export const asyncRouterMap = [
-  ...exampleRouters,
+  ...sanitationRouters,
   ...systemRouters,
   { path: '*', redirect: '/404', hidden: true }
 ]

diff --git a/src/api/common.js b/src/api/common.js
index 87c582b..d1bb14a 100644
--- a/src/api/common.js
+++ b/src/api/common.js
@@ -25,3 +25,11 @@
     data: param
   })
 }
+
+// 根据部门找其默认人员
+export function getDictByType(type) {
+  return request({
+    url: 'dict/code/' + type,
+    method: 'get'
+  })
+}
diff --git a/src/api/sanitation/stuff.js b/src/api/sanitation/stuff.js
new file mode 100644
index 0000000..7a49f54
--- /dev/null
+++ b/src/api/sanitation/stuff.js
@@ -0,0 +1,49 @@
+/**
+ * 人员管理接口
+ */
+import request from '@/utils/request'
+// 人员查询
+export function getStuffListPage(params) {
+  return request({
+    url: 'area/listPage',
+    method: 'get',
+    params
+  })
+}
+// 人员查询
+export function getStuffList(pid) {
+  return request({
+    url: 'area/list',
+    method: 'get',
+    params: {
+      pid: pid
+    }
+  })
+}
+
+// 添加人员
+export function addStuff(params) {
+  return request({
+    url: 'area/add',
+    method: 'post',
+    params
+  })
+}
+// 修改人员机构
+export function updateStuff(params) {
+  return request({
+    url: 'area/update',
+    method: 'post',
+    params
+  })
+}
+// 删除人员机构
+export function delStuff(id) {
+  return request({
+    url: 'area/delete',
+    method: 'post',
+    params: {
+      id: id
+    }
+  })
+}
diff --git a/src/assets/global_images/photo.png b/src/assets/global_images/photo.png
new file mode 100644
index 0000000..7d1e905
--- /dev/null
+++ b/src/assets/global_images/photo.png
Binary files differ
diff --git a/src/router/index.js b/src/router/index.js
index 44cba3b..fecd889 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -9,7 +9,8 @@
 /* Layout */
 import Layout from '@/layout/Layout'
 import { systemRouters } from './modules/system'
-import { exampleRouters } from './modules/example'
+// import { exampleRouters } from './modules/example'
+import { sanitationRouters } from './modules/sanitation'
 
 /**
 * hidden: true                   if `hidden:true` will not show in the sidebar(default is false)
@@ -40,7 +41,7 @@
     ]
   },
   // 登录页面
-  { path: '/login', component: () => import('@/views/login/index'), hidden: true },
+  { path: '/login', component: () => import('@/views/login/index_2'), hidden: true },
   // 404错误页面
   { path: '/404', component: () => import('@/views/errorPage/404'), hidden: true },
   // 401 错误页面
@@ -70,7 +71,7 @@
 // 异步挂载路由
 // 动态需要根据权限加载的路由表
 export const asyncRouterMap = [
-  ...exampleRouters,
+  ...sanitationRouters,
   ...systemRouters,
   { path: '*', redirect: '/404', hidden: true }
 ]
diff --git a/src/router/modules/sanitation.js b/src/router/modules/sanitation.js
new file mode 100644
index 0000000..65930ad
--- /dev/null
+++ b/src/router/modules/sanitation.js
@@ -0,0 +1,21 @@
+/* Layout */
+import Layout from '@/layout/Layout'
+export const sanitationRouters = [{
+  path: 'stuff',
+  component: Layout,
+  redirect: '/stufflist',
+  name: 'Stuff',
+  alwaysShow: true,
+  meta: {
+    title: '人员管理',
+    icon: 'icon-config' // 图标
+  },
+  children: [
+    {
+      path: '/stufflist',
+      name: 'StuffList',
+      component: () => import('@/views/stuffManage/stuffList'),
+      meta: { title: '人员列表', icon: '' }
+    }
+  ]
+}]

diff --git a/src/api/common.js b/src/api/common.js
index 87c582b..d1bb14a 100644
--- a/src/api/common.js
+++ b/src/api/common.js
@@ -25,3 +25,11 @@
     data: param
   })
 }
+
+// 根据部门找其默认人员
+export function getDictByType(type) {
+  return request({
+    url: 'dict/code/' + type,
+    method: 'get'
+  })
+}
diff --git a/src/api/sanitation/stuff.js b/src/api/sanitation/stuff.js
new file mode 100644
index 0000000..7a49f54
--- /dev/null
+++ b/src/api/sanitation/stuff.js
@@ -0,0 +1,49 @@
+/**
+ * 人员管理接口
+ */
+import request from '@/utils/request'
+// 人员查询
+export function getStuffListPage(params) {
+  return request({
+    url: 'area/listPage',
+    method: 'get',
+    params
+  })
+}
+// 人员查询
+export function getStuffList(pid) {
+  return request({
+    url: 'area/list',
+    method: 'get',
+    params: {
+      pid: pid
+    }
+  })
+}
+
+// 添加人员
+export function addStuff(params) {
+  return request({
+    url: 'area/add',
+    method: 'post',
+    params
+  })
+}
+// 修改人员机构
+export function updateStuff(params) {
+  return request({
+    url: 'area/update',
+    method: 'post',
+    params
+  })
+}
+// 删除人员机构
+export function delStuff(id) {
+  return request({
+    url: 'area/delete',
+    method: 'post',
+    params: {
+      id: id
+    }
+  })
+}
diff --git a/src/assets/global_images/photo.png b/src/assets/global_images/photo.png
new file mode 100644
index 0000000..7d1e905
--- /dev/null
+++ b/src/assets/global_images/photo.png
Binary files differ
diff --git a/src/router/index.js b/src/router/index.js
index 44cba3b..fecd889 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -9,7 +9,8 @@
 /* Layout */
 import Layout from '@/layout/Layout'
 import { systemRouters } from './modules/system'
-import { exampleRouters } from './modules/example'
+// import { exampleRouters } from './modules/example'
+import { sanitationRouters } from './modules/sanitation'
 
 /**
 * hidden: true                   if `hidden:true` will not show in the sidebar(default is false)
@@ -40,7 +41,7 @@
     ]
   },
   // 登录页面
-  { path: '/login', component: () => import('@/views/login/index'), hidden: true },
+  { path: '/login', component: () => import('@/views/login/index_2'), hidden: true },
   // 404错误页面
   { path: '/404', component: () => import('@/views/errorPage/404'), hidden: true },
   // 401 错误页面
@@ -70,7 +71,7 @@
 // 异步挂载路由
 // 动态需要根据权限加载的路由表
 export const asyncRouterMap = [
-  ...exampleRouters,
+  ...sanitationRouters,
   ...systemRouters,
   { path: '*', redirect: '/404', hidden: true }
 ]
diff --git a/src/router/modules/sanitation.js b/src/router/modules/sanitation.js
new file mode 100644
index 0000000..65930ad
--- /dev/null
+++ b/src/router/modules/sanitation.js
@@ -0,0 +1,21 @@
+/* Layout */
+import Layout from '@/layout/Layout'
+export const sanitationRouters = [{
+  path: 'stuff',
+  component: Layout,
+  redirect: '/stufflist',
+  name: 'Stuff',
+  alwaysShow: true,
+  meta: {
+    title: '人员管理',
+    icon: 'icon-config' // 图标
+  },
+  children: [
+    {
+      path: '/stufflist',
+      name: 'StuffList',
+      component: () => import('@/views/stuffManage/stuffList'),
+      meta: { title: '人员列表', icon: '' }
+    }
+  ]
+}]
diff --git a/src/utils/baseConfig.js b/src/utils/baseConfig.js
index 1f4fa38..c7f23b0 100644
--- a/src/utils/baseConfig.js
+++ b/src/utils/baseConfig.js
@@ -1,5 +1,5 @@
 const project = {
-  title: '后台管理系统前端基础框架'
+  title: '智慧环卫系统'
 }
 export function getProject() {
   return project

diff --git a/src/api/common.js b/src/api/common.js
index 87c582b..d1bb14a 100644
--- a/src/api/common.js
+++ b/src/api/common.js
@@ -25,3 +25,11 @@
     data: param
   })
 }
+
+// 根据部门找其默认人员
+export function getDictByType(type) {
+  return request({
+    url: 'dict/code/' + type,
+    method: 'get'
+  })
+}
diff --git a/src/api/sanitation/stuff.js b/src/api/sanitation/stuff.js
new file mode 100644
index 0000000..7a49f54
--- /dev/null
+++ b/src/api/sanitation/stuff.js
@@ -0,0 +1,49 @@
+/**
+ * 人员管理接口
+ */
+import request from '@/utils/request'
+// 人员查询
+export function getStuffListPage(params) {
+  return request({
+    url: 'area/listPage',
+    method: 'get',
+    params
+  })
+}
+// 人员查询
+export function getStuffList(pid) {
+  return request({
+    url: 'area/list',
+    method: 'get',
+    params: {
+      pid: pid
+    }
+  })
+}
+
+// 添加人员
+export function addStuff(params) {
+  return request({
+    url: 'area/add',
+    method: 'post',
+    params
+  })
+}
+// 修改人员机构
+export function updateStuff(params) {
+  return request({
+    url: 'area/update',
+    method: 'post',
+    params
+  })
+}
+// 删除人员机构
+export function delStuff(id) {
+  return request({
+    url: 'area/delete',
+    method: 'post',
+    params: {
+      id: id
+    }
+  })
+}
diff --git a/src/assets/global_images/photo.png b/src/assets/global_images/photo.png
new file mode 100644
index 0000000..7d1e905
--- /dev/null
+++ b/src/assets/global_images/photo.png
Binary files differ
diff --git a/src/router/index.js b/src/router/index.js
index 44cba3b..fecd889 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -9,7 +9,8 @@
 /* Layout */
 import Layout from '@/layout/Layout'
 import { systemRouters } from './modules/system'
-import { exampleRouters } from './modules/example'
+// import { exampleRouters } from './modules/example'
+import { sanitationRouters } from './modules/sanitation'
 
 /**
 * hidden: true                   if `hidden:true` will not show in the sidebar(default is false)
@@ -40,7 +41,7 @@
     ]
   },
   // 登录页面
-  { path: '/login', component: () => import('@/views/login/index'), hidden: true },
+  { path: '/login', component: () => import('@/views/login/index_2'), hidden: true },
   // 404错误页面
   { path: '/404', component: () => import('@/views/errorPage/404'), hidden: true },
   // 401 错误页面
@@ -70,7 +71,7 @@
 // 异步挂载路由
 // 动态需要根据权限加载的路由表
 export const asyncRouterMap = [
-  ...exampleRouters,
+  ...sanitationRouters,
   ...systemRouters,
   { path: '*', redirect: '/404', hidden: true }
 ]
diff --git a/src/router/modules/sanitation.js b/src/router/modules/sanitation.js
new file mode 100644
index 0000000..65930ad
--- /dev/null
+++ b/src/router/modules/sanitation.js
@@ -0,0 +1,21 @@
+/* Layout */
+import Layout from '@/layout/Layout'
+export const sanitationRouters = [{
+  path: 'stuff',
+  component: Layout,
+  redirect: '/stufflist',
+  name: 'Stuff',
+  alwaysShow: true,
+  meta: {
+    title: '人员管理',
+    icon: 'icon-config' // 图标
+  },
+  children: [
+    {
+      path: '/stufflist',
+      name: 'StuffList',
+      component: () => import('@/views/stuffManage/stuffList'),
+      meta: { title: '人员列表', icon: '' }
+    }
+  ]
+}]
diff --git a/src/utils/baseConfig.js b/src/utils/baseConfig.js
index 1f4fa38..c7f23b0 100644
--- a/src/utils/baseConfig.js
+++ b/src/utils/baseConfig.js
@@ -1,5 +1,5 @@
 const project = {
-  title: '后台管理系统前端基础框架'
+  title: '智慧环卫系统'
 }
 export function getProject() {
   return project
diff --git a/src/views/stuffManage/editStuff.vue b/src/views/stuffManage/editStuff.vue
new file mode 100644
index 0000000..f63efc6
--- /dev/null
+++ b/src/views/stuffManage/editStuff.vue
@@ -0,0 +1,436 @@
+<template>
+  <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" :fullscreen="false" width="60%" append-to-body>
+    <el-form ref="dataForm" :rules="rules" :model="stuffForm" label-well-code="right" label-width="100px">
+      <div class="form-div">
+        <div class="form-left">
+          <el-row :gutter="10">
+            <el-col :span="12">
+              <el-form-item label="姓名" prop="name">
+                <el-input v-model.trim="stuffForm.name" :disabled="isDetailMode" type="text" placeholder="必填"/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="性别" prop="sex">
+                <el-select v-model="stuffForm.sex" :disabled="isDetailMode" placeholder="请选择性别">
+                  <el-option
+                    v-for="item in sexList"
+                    :key="item.value"
+                    :label="item.name"
+                    :value="item.value"/>
+                </el-select>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row :gutter="10">
+            <el-col :span="12">
+              <el-form-item label="身份证号" prop="idcard">
+                <el-input v-model.trim="stuffForm.idcard" :disabled="isDetailMode" type="text" placeholder="必填"/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="手机号" prop="tel">
+                <el-input v-model.trim="stuffForm.tel" :disabled="isDetailMode" type="text" placeholder="必填"/>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row :gutter="10">
+            <el-col :span="12">
+              <el-form-item label="人员类型" prop="type">
+                <el-select v-model="stuffForm.type" :disabled="isDetailMode" placeholder="请选择人员类型">
+                  <el-option
+                    v-for="item in typeList"
+                    :key="item.value"
+                    :label="item.name"
+                    :value="item.value"/>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="岗位" prop="post">
+                <el-select v-model="stuffForm.post" :disabled="isDetailMode" placeholder="请选择岗位">
+                  <el-option
+                    v-for="item in postList"
+                    :key="item.value"
+                    :label="item.name"
+                    :value="item.value"/>
+                </el-select>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row :gutter="10">
+            <el-col :span="12">
+              <el-form-item label="入职年月" prop="hiredate">
+                <el-date-picker
+                  v-model.trim="stuffForm.hiredate"
+                  :disabled="isDetailMode"
+                  type="month"
+                  value-format="yyyy-MM"
+                  placeholder="选择入职年月"/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="负责片区" prop="responseArea">
+                <el-input v-model.trim="stuffForm.responseArea" :disabled="isDetailMode" type="text" placeholder=""/>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row :gutter="10">
+            <el-col :span="12">
+              <el-form-item label="作业内容" prop="jobs">
+                <el-select v-model="stuffForm.jobs" :disabled="isDetailMode" multiple placeholder="可多选">
+                  <el-option
+                    v-for="item in jobList"
+                    :key="item.value"
+                    :label="item.name"
+                    :value="item.value"/>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="备注" prop="notes">
+                <el-input v-model.trim="stuffForm.notes" :disabled="isDetailMode" type="text" placeholder=""/>
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </div>
+        <!--右边照片-->
+        <div class="form-right">
+          <!--<el-row>-->
+          <div class="avatar">
+            <el-image
+              :src="photo!==''?photo:defaultPhoto"
+              fit="cover"
+              style="width: 130px; height: 175px"/>
+          </div>
+          <!--</el-row>-->
+          <!--<el-row>-->
+          <el-upload
+            ref="upload"
+            :before-upload="handleBeforeUpload"
+            :on-success="handleSuccess"
+            :http-request="uploadFile"
+            :show-file-list="false"
+            class="avatar-uploader"
+            action="string"
+            accept=".jpg,.jpeg,.png">
+            <el-button type="primary">点击上传照片</el-button>
+          </el-upload>
+          <!--</el-row>-->
+        </div>
+      </div>
+
+    </el-form>
+    <div v-show="!isDetailMode" slot="footer" class="dialog-footer">
+      <el-button :disabled="!canEdit" type="primary" @click="saveData">保存</el-button>
+      <el-button @click="cancel">取消</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { addStuff, updateStuff } from '@/api/sanitation/stuff'
+import { Uploadimg } from '@/api/common'
+import { getDictByType } from '@/api/common'
+
+export default {
+  name: 'EditStuff',
+  data() {
+    const validateIDCard = (rule, value, callback) => {
+      if (value !== '') {
+        if ((/^[1-9]\d{5}(18|19|20|(3\d))\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/).test(value) === false) {
+          callback(new Error('请输入合法的身份证号'))
+        } else {
+          callback()
+        }
+      } else {
+        callback(new Error('身份证号不能为空'))
+      }
+    }
+    return {
+      baseUrl: process.env.BASE_API + '/static/',
+      photo: '', // 图片路径
+      defaultPhoto: require('../../assets/global_images/photo.png'), // 默认图片路径
+      dialogFormVisible: false, // 对话框是否显示
+      dialogStatus: '', // 对话框类型：create,update,detail
+      stuffForm: {
+        id: '', // id
+        name: '', // 姓名
+        sex: '', // 性别
+        idcard: '', // 身份证号
+        tel: '', // 手机号
+        photo: '', // 照片地址
+        type: '', // 类型
+        post: '', // 岗位
+        hiredate: '', // 入职年月
+        jobs: '', // 作业内容
+        responseArea: '', // 负责片区
+        notes: '' // 备注
+      }, // 表单
+      textMap: {
+        update: '编辑',
+        create: '新增',
+        detail: '详情'
+      }, // 表头显示标题
+      sexList: [
+        { name: '男', value: '0' },
+        { name: '女', value: '1' }
+      ], // 性别列表
+      typeList: [
+        { name: '正式职工', value: '0' },
+        { name: '外聘', value: '1' }
+      ],
+      postList: [
+        { name: '保洁员', value: '0' },
+        { name: '司机', value: '1' }
+      ], // 岗位
+      jobList: [
+        { name: '保洁员', value: '0' },
+        { name: '司机', value: '1' }
+      ], // 作业内容
+      rules: {
+        name: [{ required: true, message: '姓名不能为空', trigger: ['blur', 'change'] }],
+        sex: [{ required: true, message: '性别不能为空', trigger: ['blur', 'change'] }],
+        tel: [{ required: true, message: '手机号不能为空', trigger: ['blur', 'change'] }],
+        idcard: [{ required: true, validator: validateIDCard, trigger: ['blur', 'change'] }],
+        type: [{ required: true, message: '人员类型必选', trigger: ['blur', 'change'] }],
+        post: [{ required: true, message: '岗位必选', trigger: ['blur', 'change'] }],
+        hiredate: [{ required: true, message: '入职年月不能为空', trigger: ['blur', 'change'] }],
+        joblist: [{ required: true, message: '作业内容必选', trigger: ['blur', 'change'] }]
+      }, // 前端校验规则
+      isEditMode: false, // 编辑模式
+      isDetailMode: false, // 详情模式
+      canEdit: true
+    }
+  },
+  watch: {
+    'stuffForm.deviceType': function(val, oldval) {
+      this.fetchPost(val)
+    }
+  },
+  mounted() {
+    // this.fetchSexList()
+    // this.fetchPost()
+  },
+  methods: {
+    /**
+     * 初始化对话框
+     * @param dialogStatus 对话框类型
+     * @param dialogFormVisible 对话框是否可见
+     * @param row 内容参数（编辑和详情需要）
+     */
+    initDialog: function(dialogStatus, dialogFormVisible, row = null) {
+      this.dialogStatus = dialogStatus
+      this.dialogFormVisible = dialogFormVisible
+      if (dialogStatus === 'create') { // 如果是新增，清除验证
+        this.resetForm()
+        this.isEditMode = false
+        this.isDetailMode = false
+        this.$nextTick(() => {
+          this.$refs['dataForm'].clearValidate()
+        })
+      } else if (dialogStatus === 'update') { // 如果是修改，将row中数据填写到输入框中
+        this.stuffForm = {
+          id: row.id, // id
+          name: row.name, // 姓名
+          sex: row.sex, // 性别
+          idcard: row.idcard, // 身份证号
+          tel: row.tel, // 手机号
+          photo: row.photo, // 照片地址
+          type: row.type, // 类型
+          post: row.post, // 岗位
+          hiredate: row.hiredate, // 入职年月
+          jobs: row.jobs ? row.jobs.split(';') : [], // 作业内容
+          responseArea: row.responseArea, // 负责片区
+          notes: row.notes // 备注
+        }
+        this.isEditMode = true
+        this.isDetailMode = false
+      } else {
+        this.stuffForm = {
+          id: row.id, // id
+          name: row.name, // 姓名
+          sex: row.sex, // 性别
+          idcard: row.idcard, // 身份证号
+          tel: row.tel, // 手机号
+          photo: row.photo, // 照片地址
+          type: row.type, // 类型
+          post: row.post, // 岗位
+          hiredate: row.hiredate, // 入职年月
+          jobs: row.jobs ? row.jobs.split(';') : [], // 作业内容
+          responseArea: row.responseArea, // 负责片区
+          notes: row.notes // 备注
+        }
+        this.isEditMode = true
+        this.isDetailMode = true
+      }
+      if (this.stuffForm.photo && this.stuffForm.photo !== '') {
+        this.photo = this.baseUrl + this.stuffForm.photo
+      }
+    },
+    // 重置表单
+    resetForm() {
+      this.stuffForm = {
+        id: '',
+        deviceName: '',
+        devcode: '',
+        deviceType: '',
+        wellCode: '',
+        modelId: '',
+        installDate: '',
+        concenCode: ''
+      }
+    },
+    // 保存数据
+    saveData: function() {
+      // 照片不为空则对照片进行处理
+      if (this.photo !== '') {
+        if (this.photo.startsWith('http')) { // 上传的普通图片
+          let index = this.photo.indexOf('/static/')
+          if (index !== -1) {
+            index += 8
+          }
+          this.stuffForm.photo = this.photo.substring(index)
+        }
+      }
+      if (this.dialogStatus === 'update') {
+        this.updateData()
+      } else if (this.dialogStatus === 'create') {
+        this.createData()
+      }
+    },
+    // 新增数据
+    createData: function() {
+      this.canEdit = false
+      this.$refs['dataForm'].validate((valid) => {
+        console.log(this.stuffForm)
+        if (valid) {
+          addStuff(this.stuffForm).then(response => {
+            if (response.code === 200) {
+              this.$confirm('新增成功，是否继续新增?', '提示', {
+                confirmButtonText: '是',
+                cancelButtonText: '否',
+                type: 'info'
+              }).then(() => {
+                this.resetForm()
+                this.$nextTick(() => {
+                  this.$refs['dataForm'].clearValidate()
+                  this.canEdit = true
+                })
+              }).catch(() => {
+                this.$emit('watchChild')
+                this.dialogFormVisible = false
+                this.canEdit = true
+              })
+            }
+          })
+        } else {
+          this.canEdit = true
+        }
+      })
+    },
+    // 修改数据
+    updateData: function() {
+      this.canEdit = false
+      this.$refs['dataForm'].validate((valid) => {
+        if (valid) {
+          updateStuff(this.stuffForm).then(response => {
+            if (response.code === 200) {
+              this.$message.success('修改成功')
+              this.$emit('watchChild')
+              this.dialogFormVisible = false
+              this.canEdit = true
+            }
+          })
+        }
+      })
+    },
+    // 图片上传
+    uploadFile(file) {
+      console.log('uploadFile:' + file.file.name)
+      Uploadimg(file).then(res => {
+        if (res.code === 200) {
+          this.photo = this.baseUrl + res.data
+        } else {
+          this.$message.warning(res.message)
+        }
+      })
+    },
+    // 上传前判断文件格式及大小
+    handleBeforeUpload(file) {
+      const isJPG = (file.type === 'image/jpeg') || (file.type === 'image/png')
+      let res = true
+      const isLt2M = file.size / 1024 / 1024 < 5
+      if (!isJPG) {
+        this.$message.error('上传图片只能是 JPG 或 PNG 格式!')
+        res = false
+      }
+      if (!isLt2M) {
+        this.$message.error('上传图片大小不能超过 5MB!')
+        res = false
+      }
+      return res
+    },
+    // 上传成功后回显
+    handleSuccess(response, file) {
+      console.log('handleSuccess')
+      if (response.code === 200) {
+        this.photo = this.baseUrl + response.data
+      } else {
+        this.$message.warning(response.message)
+      }
+    },
+    // 获取性别列表
+    fetchSexList() {
+      getDictByType('sex').then(response => {
+        this.sexList = [
+          { name: '男', value: '0' },
+          { name: '女', value: '1' }
+        ]
+      })
+    },
+    // 获取人员类别
+    fetchPersonType(val) {
+      getDictByType('personType').then(response => {
+        this.typeList = response.data
+      })
+    },
+    // 获取岗位
+    fetchPost(val) {
+      getDictByType('post').then(response => {
+        this.jobList = response.data
+      })
+    },
+    cancel: function() {
+      this.dialogFormVisible = false
+      this.$emit('watchChild')
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+  .el-select{
+    width: 100%;
+  }
+  .el-date-editor{
+    width: 100%;
+  }
+  .form-div{
+    width:100%;
+    height:100%;
+    display:flex;
+    justify-content: space-between;
+  }
+  .form-left{
+    flex:1;
+    height:100%;
+  }
+  .form-right{
+    width: 180px;
+    height:100%;
+    .avatar{
+      margin-bottom: 10px;
+    }
+    text-align: center;
+  }
+</style>

diff --git a/src/api/common.js b/src/api/common.js
index 87c582b..d1bb14a 100644
--- a/src/api/common.js
+++ b/src/api/common.js
@@ -25,3 +25,11 @@
     data: param
   })
 }
+
+// 根据部门找其默认人员
+export function getDictByType(type) {
+  return request({
+    url: 'dict/code/' + type,
+    method: 'get'
+  })
+}
diff --git a/src/api/sanitation/stuff.js b/src/api/sanitation/stuff.js
new file mode 100644
index 0000000..7a49f54
--- /dev/null
+++ b/src/api/sanitation/stuff.js
@@ -0,0 +1,49 @@
+/**
+ * 人员管理接口
+ */
+import request from '@/utils/request'
+// 人员查询
+export function getStuffListPage(params) {
+  return request({
+    url: 'area/listPage',
+    method: 'get',
+    params
+  })
+}
+// 人员查询
+export function getStuffList(pid) {
+  return request({
+    url: 'area/list',
+    method: 'get',
+    params: {
+      pid: pid
+    }
+  })
+}
+
+// 添加人员
+export function addStuff(params) {
+  return request({
+    url: 'area/add',
+    method: 'post',
+    params
+  })
+}
+// 修改人员机构
+export function updateStuff(params) {
+  return request({
+    url: 'area/update',
+    method: 'post',
+    params
+  })
+}
+// 删除人员机构
+export function delStuff(id) {
+  return request({
+    url: 'area/delete',
+    method: 'post',
+    params: {
+      id: id
+    }
+  })
+}
diff --git a/src/assets/global_images/photo.png b/src/assets/global_images/photo.png
new file mode 100644
index 0000000..7d1e905
--- /dev/null
+++ b/src/assets/global_images/photo.png
Binary files differ
diff --git a/src/router/index.js b/src/router/index.js
index 44cba3b..fecd889 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -9,7 +9,8 @@
 /* Layout */
 import Layout from '@/layout/Layout'
 import { systemRouters } from './modules/system'
-import { exampleRouters } from './modules/example'
+// import { exampleRouters } from './modules/example'
+import { sanitationRouters } from './modules/sanitation'
 
 /**
 * hidden: true                   if `hidden:true` will not show in the sidebar(default is false)
@@ -40,7 +41,7 @@
     ]
   },
   // 登录页面
-  { path: '/login', component: () => import('@/views/login/index'), hidden: true },
+  { path: '/login', component: () => import('@/views/login/index_2'), hidden: true },
   // 404错误页面
   { path: '/404', component: () => import('@/views/errorPage/404'), hidden: true },
   // 401 错误页面
@@ -70,7 +71,7 @@
 // 异步挂载路由
 // 动态需要根据权限加载的路由表
 export const asyncRouterMap = [
-  ...exampleRouters,
+  ...sanitationRouters,
   ...systemRouters,
   { path: '*', redirect: '/404', hidden: true }
 ]
diff --git a/src/router/modules/sanitation.js b/src/router/modules/sanitation.js
new file mode 100644
index 0000000..65930ad
--- /dev/null
+++ b/src/router/modules/sanitation.js
@@ -0,0 +1,21 @@
+/* Layout */
+import Layout from '@/layout/Layout'
+export const sanitationRouters = [{
+  path: 'stuff',
+  component: Layout,
+  redirect: '/stufflist',
+  name: 'Stuff',
+  alwaysShow: true,
+  meta: {
+    title: '人员管理',
+    icon: 'icon-config' // 图标
+  },
+  children: [
+    {
+      path: '/stufflist',
+      name: 'StuffList',
+      component: () => import('@/views/stuffManage/stuffList'),
+      meta: { title: '人员列表', icon: '' }
+    }
+  ]
+}]
diff --git a/src/utils/baseConfig.js b/src/utils/baseConfig.js
index 1f4fa38..c7f23b0 100644
--- a/src/utils/baseConfig.js
+++ b/src/utils/baseConfig.js
@@ -1,5 +1,5 @@
 const project = {
-  title: '后台管理系统前端基础框架'
+  title: '智慧环卫系统'
 }
 export function getProject() {
   return project
diff --git a/src/views/stuffManage/editStuff.vue b/src/views/stuffManage/editStuff.vue
new file mode 100644
index 0000000..f63efc6
--- /dev/null
+++ b/src/views/stuffManage/editStuff.vue
@@ -0,0 +1,436 @@
+<template>
+  <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" :fullscreen="false" width="60%" append-to-body>
+    <el-form ref="dataForm" :rules="rules" :model="stuffForm" label-well-code="right" label-width="100px">
+      <div class="form-div">
+        <div class="form-left">
+          <el-row :gutter="10">
+            <el-col :span="12">
+              <el-form-item label="姓名" prop="name">
+                <el-input v-model.trim="stuffForm.name" :disabled="isDetailMode" type="text" placeholder="必填"/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="性别" prop="sex">
+                <el-select v-model="stuffForm.sex" :disabled="isDetailMode" placeholder="请选择性别">
+                  <el-option
+                    v-for="item in sexList"
+                    :key="item.value"
+                    :label="item.name"
+                    :value="item.value"/>
+                </el-select>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row :gutter="10">
+            <el-col :span="12">
+              <el-form-item label="身份证号" prop="idcard">
+                <el-input v-model.trim="stuffForm.idcard" :disabled="isDetailMode" type="text" placeholder="必填"/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="手机号" prop="tel">
+                <el-input v-model.trim="stuffForm.tel" :disabled="isDetailMode" type="text" placeholder="必填"/>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row :gutter="10">
+            <el-col :span="12">
+              <el-form-item label="人员类型" prop="type">
+                <el-select v-model="stuffForm.type" :disabled="isDetailMode" placeholder="请选择人员类型">
+                  <el-option
+                    v-for="item in typeList"
+                    :key="item.value"
+                    :label="item.name"
+                    :value="item.value"/>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="岗位" prop="post">
+                <el-select v-model="stuffForm.post" :disabled="isDetailMode" placeholder="请选择岗位">
+                  <el-option
+                    v-for="item in postList"
+                    :key="item.value"
+                    :label="item.name"
+                    :value="item.value"/>
+                </el-select>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row :gutter="10">
+            <el-col :span="12">
+              <el-form-item label="入职年月" prop="hiredate">
+                <el-date-picker
+                  v-model.trim="stuffForm.hiredate"
+                  :disabled="isDetailMode"
+                  type="month"
+                  value-format="yyyy-MM"
+                  placeholder="选择入职年月"/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="负责片区" prop="responseArea">
+                <el-input v-model.trim="stuffForm.responseArea" :disabled="isDetailMode" type="text" placeholder=""/>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row :gutter="10">
+            <el-col :span="12">
+              <el-form-item label="作业内容" prop="jobs">
+                <el-select v-model="stuffForm.jobs" :disabled="isDetailMode" multiple placeholder="可多选">
+                  <el-option
+                    v-for="item in jobList"
+                    :key="item.value"
+                    :label="item.name"
+                    :value="item.value"/>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="备注" prop="notes">
+                <el-input v-model.trim="stuffForm.notes" :disabled="isDetailMode" type="text" placeholder=""/>
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </div>
+        <!--右边照片-->
+        <div class="form-right">
+          <!--<el-row>-->
+          <div class="avatar">
+            <el-image
+              :src="photo!==''?photo:defaultPhoto"
+              fit="cover"
+              style="width: 130px; height: 175px"/>
+          </div>
+          <!--</el-row>-->
+          <!--<el-row>-->
+          <el-upload
+            ref="upload"
+            :before-upload="handleBeforeUpload"
+            :on-success="handleSuccess"
+            :http-request="uploadFile"
+            :show-file-list="false"
+            class="avatar-uploader"
+            action="string"
+            accept=".jpg,.jpeg,.png">
+            <el-button type="primary">点击上传照片</el-button>
+          </el-upload>
+          <!--</el-row>-->
+        </div>
+      </div>
+
+    </el-form>
+    <div v-show="!isDetailMode" slot="footer" class="dialog-footer">
+      <el-button :disabled="!canEdit" type="primary" @click="saveData">保存</el-button>
+      <el-button @click="cancel">取消</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { addStuff, updateStuff } from '@/api/sanitation/stuff'
+import { Uploadimg } from '@/api/common'
+import { getDictByType } from '@/api/common'
+
+export default {
+  name: 'EditStuff',
+  data() {
+    const validateIDCard = (rule, value, callback) => {
+      if (value !== '') {
+        if ((/^[1-9]\d{5}(18|19|20|(3\d))\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/).test(value) === false) {
+          callback(new Error('请输入合法的身份证号'))
+        } else {
+          callback()
+        }
+      } else {
+        callback(new Error('身份证号不能为空'))
+      }
+    }
+    return {
+      baseUrl: process.env.BASE_API + '/static/',
+      photo: '', // 图片路径
+      defaultPhoto: require('../../assets/global_images/photo.png'), // 默认图片路径
+      dialogFormVisible: false, // 对话框是否显示
+      dialogStatus: '', // 对话框类型：create,update,detail
+      stuffForm: {
+        id: '', // id
+        name: '', // 姓名
+        sex: '', // 性别
+        idcard: '', // 身份证号
+        tel: '', // 手机号
+        photo: '', // 照片地址
+        type: '', // 类型
+        post: '', // 岗位
+        hiredate: '', // 入职年月
+        jobs: '', // 作业内容
+        responseArea: '', // 负责片区
+        notes: '' // 备注
+      }, // 表单
+      textMap: {
+        update: '编辑',
+        create: '新增',
+        detail: '详情'
+      }, // 表头显示标题
+      sexList: [
+        { name: '男', value: '0' },
+        { name: '女', value: '1' }
+      ], // 性别列表
+      typeList: [
+        { name: '正式职工', value: '0' },
+        { name: '外聘', value: '1' }
+      ],
+      postList: [
+        { name: '保洁员', value: '0' },
+        { name: '司机', value: '1' }
+      ], // 岗位
+      jobList: [
+        { name: '保洁员', value: '0' },
+        { name: '司机', value: '1' }
+      ], // 作业内容
+      rules: {
+        name: [{ required: true, message: '姓名不能为空', trigger: ['blur', 'change'] }],
+        sex: [{ required: true, message: '性别不能为空', trigger: ['blur', 'change'] }],
+        tel: [{ required: true, message: '手机号不能为空', trigger: ['blur', 'change'] }],
+        idcard: [{ required: true, validator: validateIDCard, trigger: ['blur', 'change'] }],
+        type: [{ required: true, message: '人员类型必选', trigger: ['blur', 'change'] }],
+        post: [{ required: true, message: '岗位必选', trigger: ['blur', 'change'] }],
+        hiredate: [{ required: true, message: '入职年月不能为空', trigger: ['blur', 'change'] }],
+        joblist: [{ required: true, message: '作业内容必选', trigger: ['blur', 'change'] }]
+      }, // 前端校验规则
+      isEditMode: false, // 编辑模式
+      isDetailMode: false, // 详情模式
+      canEdit: true
+    }
+  },
+  watch: {
+    'stuffForm.deviceType': function(val, oldval) {
+      this.fetchPost(val)
+    }
+  },
+  mounted() {
+    // this.fetchSexList()
+    // this.fetchPost()
+  },
+  methods: {
+    /**
+     * 初始化对话框
+     * @param dialogStatus 对话框类型
+     * @param dialogFormVisible 对话框是否可见
+     * @param row 内容参数（编辑和详情需要）
+     */
+    initDialog: function(dialogStatus, dialogFormVisible, row = null) {
+      this.dialogStatus = dialogStatus
+      this.dialogFormVisible = dialogFormVisible
+      if (dialogStatus === 'create') { // 如果是新增，清除验证
+        this.resetForm()
+        this.isEditMode = false
+        this.isDetailMode = false
+        this.$nextTick(() => {
+          this.$refs['dataForm'].clearValidate()
+        })
+      } else if (dialogStatus === 'update') { // 如果是修改，将row中数据填写到输入框中
+        this.stuffForm = {
+          id: row.id, // id
+          name: row.name, // 姓名
+          sex: row.sex, // 性别
+          idcard: row.idcard, // 身份证号
+          tel: row.tel, // 手机号
+          photo: row.photo, // 照片地址
+          type: row.type, // 类型
+          post: row.post, // 岗位
+          hiredate: row.hiredate, // 入职年月
+          jobs: row.jobs ? row.jobs.split(';') : [], // 作业内容
+          responseArea: row.responseArea, // 负责片区
+          notes: row.notes // 备注
+        }
+        this.isEditMode = true
+        this.isDetailMode = false
+      } else {
+        this.stuffForm = {
+          id: row.id, // id
+          name: row.name, // 姓名
+          sex: row.sex, // 性别
+          idcard: row.idcard, // 身份证号
+          tel: row.tel, // 手机号
+          photo: row.photo, // 照片地址
+          type: row.type, // 类型
+          post: row.post, // 岗位
+          hiredate: row.hiredate, // 入职年月
+          jobs: row.jobs ? row.jobs.split(';') : [], // 作业内容
+          responseArea: row.responseArea, // 负责片区
+          notes: row.notes // 备注
+        }
+        this.isEditMode = true
+        this.isDetailMode = true
+      }
+      if (this.stuffForm.photo && this.stuffForm.photo !== '') {
+        this.photo = this.baseUrl + this.stuffForm.photo
+      }
+    },
+    // 重置表单
+    resetForm() {
+      this.stuffForm = {
+        id: '',
+        deviceName: '',
+        devcode: '',
+        deviceType: '',
+        wellCode: '',
+        modelId: '',
+        installDate: '',
+        concenCode: ''
+      }
+    },
+    // 保存数据
+    saveData: function() {
+      // 照片不为空则对照片进行处理
+      if (this.photo !== '') {
+        if (this.photo.startsWith('http')) { // 上传的普通图片
+          let index = this.photo.indexOf('/static/')
+          if (index !== -1) {
+            index += 8
+          }
+          this.stuffForm.photo = this.photo.substring(index)
+        }
+      }
+      if (this.dialogStatus === 'update') {
+        this.updateData()
+      } else if (this.dialogStatus === 'create') {
+        this.createData()
+      }
+    },
+    // 新增数据
+    createData: function() {
+      this.canEdit = false
+      this.$refs['dataForm'].validate((valid) => {
+        console.log(this.stuffForm)
+        if (valid) {
+          addStuff(this.stuffForm).then(response => {
+            if (response.code === 200) {
+              this.$confirm('新增成功，是否继续新增?', '提示', {
+                confirmButtonText: '是',
+                cancelButtonText: '否',
+                type: 'info'
+              }).then(() => {
+                this.resetForm()
+                this.$nextTick(() => {
+                  this.$refs['dataForm'].clearValidate()
+                  this.canEdit = true
+                })
+              }).catch(() => {
+                this.$emit('watchChild')
+                this.dialogFormVisible = false
+                this.canEdit = true
+              })
+            }
+          })
+        } else {
+          this.canEdit = true
+        }
+      })
+    },
+    // 修改数据
+    updateData: function() {
+      this.canEdit = false
+      this.$refs['dataForm'].validate((valid) => {
+        if (valid) {
+          updateStuff(this.stuffForm).then(response => {
+            if (response.code === 200) {
+              this.$message.success('修改成功')
+              this.$emit('watchChild')
+              this.dialogFormVisible = false
+              this.canEdit = true
+            }
+          })
+        }
+      })
+    },
+    // 图片上传
+    uploadFile(file) {
+      console.log('uploadFile:' + file.file.name)
+      Uploadimg(file).then(res => {
+        if (res.code === 200) {
+          this.photo = this.baseUrl + res.data
+        } else {
+          this.$message.warning(res.message)
+        }
+      })
+    },
+    // 上传前判断文件格式及大小
+    handleBeforeUpload(file) {
+      const isJPG = (file.type === 'image/jpeg') || (file.type === 'image/png')
+      let res = true
+      const isLt2M = file.size / 1024 / 1024 < 5
+      if (!isJPG) {
+        this.$message.error('上传图片只能是 JPG 或 PNG 格式!')
+        res = false
+      }
+      if (!isLt2M) {
+        this.$message.error('上传图片大小不能超过 5MB!')
+        res = false
+      }
+      return res
+    },
+    // 上传成功后回显
+    handleSuccess(response, file) {
+      console.log('handleSuccess')
+      if (response.code === 200) {
+        this.photo = this.baseUrl + response.data
+      } else {
+        this.$message.warning(response.message)
+      }
+    },
+    // 获取性别列表
+    fetchSexList() {
+      getDictByType('sex').then(response => {
+        this.sexList = [
+          { name: '男', value: '0' },
+          { name: '女', value: '1' }
+        ]
+      })
+    },
+    // 获取人员类别
+    fetchPersonType(val) {
+      getDictByType('personType').then(response => {
+        this.typeList = response.data
+      })
+    },
+    // 获取岗位
+    fetchPost(val) {
+      getDictByType('post').then(response => {
+        this.jobList = response.data
+      })
+    },
+    cancel: function() {
+      this.dialogFormVisible = false
+      this.$emit('watchChild')
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+  .el-select{
+    width: 100%;
+  }
+  .el-date-editor{
+    width: 100%;
+  }
+  .form-div{
+    width:100%;
+    height:100%;
+    display:flex;
+    justify-content: space-between;
+  }
+  .form-left{
+    flex:1;
+    height:100%;
+  }
+  .form-right{
+    width: 180px;
+    height:100%;
+    .avatar{
+      margin-bottom: 10px;
+    }
+    text-align: center;
+  }
+</style>
diff --git a/src/views/stuffManage/stuffList.vue b/src/views/stuffManage/stuffList.vue
new file mode 100644
index 0000000..616f2cd
--- /dev/null
+++ b/src/views/stuffManage/stuffList.vue
@@ -0,0 +1,354 @@
+<template>
+  <app-container>
+    <search-area :need-clear="true" :need-search-more="true" type="seperate" search-more-type="default" @search="fetchData" @clear="clearInput">
+      <!--一般查询条件-->
+      <search-item>
+        <el-input v-model.trim="listQuery.keywords" placeholder="姓名/身份证号/手机号" clearable/>
+      </search-item>
+      <search-item/>
+      <search-item>
+        <el-select v-model="listQuery.type" :disabled="isDetailMode" placeholder="人员类型">
+          <el-option
+            v-for="item in typeList"
+            :key="item.value"
+            :label="item.name"
+            :value="item.value"/>
+        </el-select>
+      </search-item>
+      <search-item>
+        <el-select v-model="listQuery.post" :disabled="isDetailMode" placeholder="岗位">
+          <el-option
+            v-for="item in postList"
+            :key="item.value"
+            :label="item.name"
+            :value="item.value"/>
+        </el-select>
+      </search-item>
+      <!--高级检索-->
+      <div slot="searchMore">
+        <search-item>
+          <el-input v-model.trim="listQuery.responseArea" placeholder="负责片区" clearable/>
+        </search-item>
+        <search-item>
+          <el-date-picker
+            v-model="listQuery.hiredate"
+            type="month"
+            value-format="yyyy-MM-dd"
+            placeholder="入职年月"/>
+        </search-item>
+        <search-item>
+          <el-select v-model="listQuery.jobCode" placeholder="作业内容">
+            <el-option
+              v-for="item in jobList"
+              :key="item.value"
+              :label="item.name"
+              :value="item.value"/>
+          </el-select>
+        </search-item>
+      </div>
+    </search-area>
+    <normal-table :data="list" :head="tableOption.head" :query="listQuery" :total="total" :columns="columns" :list-loading="listLoading" :options="tableOption.options" :tools-option="tableOption.toolsOption" @change="changePage">
+      <template slot="btns">
+        <el-button size="small" class="edit_btn" @click.stop="add">添加</el-button>
+        <!--<el-button size="small" class="edit_btn">删除</el-button>-->
+        <el-upload
+          :limit="1"
+          :show-file-list="false"
+          :http-request="uploadFile"
+          :file-list="fileList"
+          action="string"
+          accept=".xls,.xlsx"
+          class="edit_btn">
+          <el-button slot="trigger" size="small">批量导入</el-button>
+        </el-upload>
+        <el-button size="small" class="edit_btn" @click="batchExport">花名册导出</el-button>
+      </template>
+      <template slot="columns">
+        <el-table-column label="操作" align="center" width="160">
+          <template slot-scope="scope">
+            <el-button type="text" size="small" @click.stop="goDetail(scope.row)">详情</el-button>
+            <el-button type="text" size="small" @click.stop="edit(scope.row)">编辑</el-button>
+            <el-button type="text" size="small" @click.stop="del(scope.row)">删除</el-button>
+            <!--<el-button type="text" size="small" @click.stop="registerIris(scope.row)">岗位调整</el-button>-->
+          </template>
+        </el-table-column>
+      </template>
+    </normal-table>
+    <edit-stuff v-show="editShow" ref="editstuff" @watchChild="fetchData"/>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable'
+import AppContainer from '@/components/layout/AppContainer'
+import SearchArea from '@/components/SearchArea/SearchArea'
+import SearchItem from '@/components/SearchArea/SearchItem'
+import EditStuff from './editStuff'
+import { delStuff, batchImportStuff, batchExportStuff } from '@/api/sanitation/stuff'
+export default {
+  name: 'StuffList',
+  components: { EditStuff, SearchItem, SearchArea, AppContainer, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        keywords: '', // 关键字
+        type: '', // 人员类型
+        post: '', // 岗位
+        hiredate: '', // 入职年月时间
+        jobCode: '', // 作业内容
+        responseArea: '', // 负责片区
+        offset: 1,
+        limit: 20,
+        sort: '',
+        order: 'desc'
+      }, // 筛选条件
+      columns: [
+        {
+          text: '姓名',
+          value: 'name',
+          align: 'center'
+        },
+        {
+          text: '性别',
+          value: 'sexName',
+          align: 'center',
+          width: 60
+        },
+        {
+          text: '身份证号',
+          value: 'idcard',
+          width: 165,
+          align: 'center'
+        },
+        {
+          text: '手机号',
+          value: 'tel',
+          align: 'center'
+        },
+        {
+          text: '类型',
+          value: 'typeName',
+          align: 'center',
+          width: 80
+        },
+        {
+          text: '岗位',
+          value: 'postName',
+          align: 'center'
+        },
+        {
+          text: '入职年月',
+          value: 'hiredate',
+          align: 'center'
+        },
+        {
+          text: '负责片区',
+          value: 'responseAreaName',
+          align: 'center'
+        }
+      ], // 显示列
+      timeRange: [], // 时间范围
+      list: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      typeList: [
+        { name: '正式职工', value: '0' },
+        { name: '外聘', value: '1' }
+      ],
+      postList: [
+        { name: '保洁员', value: '0' },
+        { name: '司机', value: '1' }
+      ], // 岗位
+      jobList: [
+        { name: '清扫', value: '0' },
+        { name: '保洁', value: '1' }
+      ], // 作业内容
+      tableOption: {
+        head: {
+          show: true, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: true // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      editShow: false // 编辑页面是否显示
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      this.listLoading = true
+      const that = this
+      setTimeout(function() {
+        that.list = [
+          { name: '张三', sex: '0', sexName: '男', idcard: '110107199301012321', tel: '13382739123', type: '0', typeName: '普通职工', post: '1', postName: '保洁员', hiredate: '2020-01', jobs: '0;1', responseArea: '崇仁县', responseAreaName: '崇仁县' },
+          { name: '张三', sex: '0', sexName: '男', idcard: '110107199301012321', tel: '13382739123', type: '0', typeName: '普通职工', post: '1', postName: '保洁员', hiredate: '2020-01', jobs: '0', responseArea: '崇仁县', responseAreaName: '崇仁县' },
+          { name: '张三', sex: '0', sexName: '男', idcard: '110107199301012321', tel: '13382739123', type: '0', typeName: '普通职工', post: '1', postName: '保洁员', hiredate: '2020-01', jobs: '1', responseArea: '崇仁县', responseAreaName: '崇仁县' },
+          { name: '张三', sex: '0', sexName: '男', idcard: '110107199301012321', tel: '13382739123', type: '0', typeName: '普通职工', post: '1', postName: '保洁员', hiredate: '2020-01', jobs: '', responseArea: '崇仁县', responseAreaName: '崇仁县' },
+          { name: '张三', sex: '0', sexName: '男', idcard: '110107199301012321', tel: '13382739123', type: '0', typeName: '普通职工', post: '1', postName: '保洁员', hiredate: '2020-01', jobs: '0;1', responseArea: '崇仁县', responseAreaName: '崇仁县' }
+        ]
+        that.total = 200
+        that.listLoading = false
+      }, 2000)
+    },
+    // 点击编辑
+    edit(row) {
+      this.editShow = true
+      this.$refs.editstuff.initDialog('update', true, row)
+    },
+    // 点击详情
+    goDetail(row) {
+      this.editShow = true
+      this.$refs.editstuff.initDialog('detail', true, row)
+    },
+    // 点击新增
+    add() {
+      this.editShow = true
+      this.$refs.editstuff.initDialog('create', true)
+    },
+    // 删除单个人员
+    del(row) {
+      const staffIds = [row.id]
+      this.$confirm(
+        '确定要删除该人员吗？',
+        '确认操作',
+        {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }
+      ).then(() => {
+        delStuff(staffIds).then(response => {
+          if (response.code === 200) {
+            this.$message.success('删除成功')
+            this.fetchData()
+          }
+        })
+      })
+    },
+    // 删除多个人员
+    batchDel() {
+      if (this.checkSelection()) {
+        const staffIds = []
+        this.multipleSelection.forEach(function(value, index) {
+          staffIds.push(value.id)
+        })
+        this.$confirm(
+          '确定要删除所选人员吗？',
+          '确认操作',
+          {
+            confirmButtonText: '确定',
+            cancelButtonText: '取消',
+            type: 'warning'
+          }
+        ).then(() => {
+          delStuff(staffIds).then(response => {
+            if (response.code === 200) {
+              this.$message.success('删除成功')
+              this.fetchData()
+            }
+          })
+        })
+      } else {
+        this.$message.error('至少选中一项')
+      }
+    },
+    // 批量导入
+    uploadFile(param) {
+      // 判断文件大小是否符合要求
+      const _file = param.file
+      const isLt5M = _file.size / 1024 / 1024 < 5
+      if (!isLt5M) {
+        this.$message.error('请上传5M以下的excel文件')
+        return false
+      }
+      // 全屏加载动画
+      const loading = this.$loading({
+        lock: true,
+        text: '导入中,请稍后...',
+        spinner: 'el-icon-loading',
+        background: 'rgba(0, 0, 0, 0.7)'
+      })
+      // 发起导入请求
+      batchImportStuff(_file).then(res => {
+        loading.close() // 关闭加载动画
+        if (res.code === 200) {
+          this.$message.success('导入成功')
+          this.fetchData()
+        } else {
+          this.$message.error(res.message)
+        }
+      }).catch(() => {
+        loading.close() // 关闭加载动画
+      })
+      this.fileList = []
+    },
+    // 批量导出
+    batchExport() {
+      // 全屏加载动画
+      const loading = this.$loading({
+        lock: true,
+        text: '数据处理中,请稍后...',
+        spinner: 'el-icon-loading',
+        background: 'rgba(0, 0, 0, 0.7)'
+      })
+      batchExportStuff(this.listQuery).then(res => {
+        loading.close() // 关闭加载动画
+        const blob = new Blob([res.data])
+        const downloadElement = document.createElement('a')
+        const href = window.URL.createObjectURL(blob) // 创建下载的链接
+        downloadElement.href = href
+        downloadElement.download = `人员列表.xlsx` // 下载后文件名
+        document.body.appendChild(downloadElement)
+        downloadElement.click() // 点击下载
+        document.body.removeChild(downloadElement) // 下载完成移除元素
+        window.URL.revokeObjectURL(href) // 释放blob对象
+      }).catch((res) => {
+        loading.close()
+      })
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    // 重置后的操作， 若不需要显示重置按钮则不需要写
+    clearInput() {
+      this.listQuery = {
+        keywords: '', // 关键字
+        type: '', // 人员类型
+        post: '', // 岗位
+        hiredate: '', // 入职年月时间
+        jobCode: '', // 作业内容
+        responseArea: '', // 负责片区
+        offset: 1,
+        limit: 20,
+        sort: '',
+        order: 'desc'
+      }
+      this.$message.success('clearInput')
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+  .edit_btns{
+    .edit_btn{
+      float:right;
+      margin-left:5px;
+    }
+  }
+</style>