diff --git a/src/api/data_scope_department.js b/src/api/data_scope_department.js
new file mode 100644
index 0000000..d7bd05c
--- /dev/null
+++ b/src/api/data_scope_department.js
@@ -0,0 +1,9 @@
+import api from '@/utils/api'
+
+export function getAll(params) {
+  return api({
+    url: '/dataScopeDepartment/all',
+    method: 'get',
+    params
+  })
+}
diff --git a/src/components/Crud/Edit/index.vue b/src/components/Crud/Edit/index.vue
index 9c80023..a4ec5b7 100644
--- a/src/components/Crud/Edit/index.vue
+++ b/src/components/Crud/Edit/index.vue
@@ -1,8 +1,5 @@
 <template>
-  <el-button v-if="!flag" type="text" :disabled="disabledEdit" icon="edit" @click="crud.toEdit(data)">
-    修改
-  </el-button>
-  <el-button v-else type="text" :disabled="disabledEdit" icon="edit" @click="editFn(data)">
+  <el-button v-permission="permission.edit" type="text" :disabled="disabledEdit" icon="edit" @click="crud.toEdit(data)">
     修改
   </el-button>
 </template>
@@ -15,18 +12,13 @@ export default {
       type: Object,
       required: true
     },
+    permission: {
+      type: Object,
+      required: true
+    },
     disabledEdit: {
       type: Boolean,
       default: false
-    },
-    flag: {
-      type: Boolean,
-      defalut: false
-    }
-  },
-  methods: {
-    editFn() {
-      this.$emit('editFn', this.data)
     }
   }
 }
diff --git a/src/views/borrow/borrow.vue b/src/views/borrow/borrow.vue
index e61d50c..f43289b 100644
--- a/src/views/borrow/borrow.vue
+++ b/src/views/borrow/borrow.vue
@@ -52,13 +52,9 @@
     >
       <el-table-column slot="operation" align="center" width="100" label="操作">
         <template slot-scope="scope">
-          <Edit
-            :permission="permission"
-            :data="scope.row"
-            :disabled-edit="false"
-            :flag="true"
-            @editFn="editFn"
-          />
+          <el-button v-permission="permission.edit" type="text" icon="edit" @click="editFn(scope.row)">
+            修改
+          </el-button>
         </template>
       </el-table-column>
     </CustomTable>
@@ -97,7 +93,6 @@
 <script>
 import CRUD, { form, header, presenter } from '@/components/Crud/crud'
 // import Crud from '@/components/Crud'
-import Edit from '@/components/Crud/Edit'
 import CustomTable from '@/components/Crud/Table'
 import Pagination from '@/components/Crud/Pagination'
 import { addBorrowFn } from '@/api/common'
@@ -122,7 +117,7 @@ const defaultForm = form({
 
 export default {
   name: 'InstrumentList',
-  components: { Pagination, CustomTable, Edit },
+  components: { Pagination, CustomTable },
   mixins: [defaultCrud, defaultForm, header()],
   data() {
     return {
diff --git a/src/views/user/components/data-permission.vue b/src/views/user/components/data-permission.vue
new file mode 100644
index 0000000..e2ae5c3
--- /dev/null
+++ b/src/views/user/components/data-permission.vue
@@ -0,0 +1,247 @@
+<template>
+  <el-drawer title="数据权限" :visible="show" size="90%" :destroy-on-close="true" @close="close">
+    <el-form ref="permission" :model="permission" label-width="100px">
+      <el-form-item label="角色名称">
+        {{ permission.roleName }}
+      </el-form-item>
+      <el-form-item label="角色代码">
+        {{ permission.roleCode }}
+      </el-form-item>
+      <el-form-item label="权限范围">
+        <el-select v-model="permission.dataScope">
+          <el-option v-for="(item, index) in dataScopes" :key="index" :label="item" :value="index" />
+        </el-select>
+      </el-form-item>
+      <el-form-item v-if="permission.dataScope === 1" label="数据权限">
+        <el-table
+          ref="departments"
+          :data="departments"
+          border
+          fit
+          height="650"
+          highlight-current-row
+          row-key="id"
+          :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
+          style="width: 99%;"
+        >
+          <el-table-column label="部门名称">
+            <template slot-scope="scope">
+              <el-checkbox v-model="scope.row.checked" :indeterminate="scope.row.indeterminate" @change="handleCheckAllChange(scope.row, $event)">
+                {{ scope.row.name }}
+              </el-checkbox>
+            </template>
+          </el-table-column>
+        </el-table>
+      </el-form-item>
+    </el-form>
+    <el-row :gutter="20">
+      <el-col :span="4" :offset="2">
+        <el-select v-if="permission.dataScope === 1" v-model="showMode" @change="changeShowMode">
+          <el-option
+            v-for="(item, index) in showModes"
+            :key="index"
+            :label="item"
+            :value="index"
+          />
+        </el-select>
+      </el-col>
+      <el-col :span="4" :offset="14">
+        <el-button type="primary" @click="update">
+          确 认
+        </el-button>
+        <el-button @click="close">
+          取 消
+        </el-button>
+      </el-col>
+    </el-row>
+  </el-drawer>
+</template>
+
+<script>
+import CrudRole from '@/api/role'
+import { getAll } from '@/api/data_scope_department'
+
+export default {
+  name: 'DataPermission',
+  data() {
+    return {
+      show: false,
+      permission: {},
+      dataScopes: ['全部数据权限', '自定义数据权限', '本部门数据权限', '本部门及下级数据权限', '仅本人数据权限'],
+      departments: [],
+      showMode: 0,
+      showModes: ['合并所有', '展开所有', '全部勾选', '取消勾选'],
+      checkedIds: new Set()
+    }
+  },
+  mounted() {
+    const that = this
+    this.common.$on('openDataPermission', function(data) {
+      that.open(data)
+    })
+  },
+  created() {
+    const that = this
+    this.common.$on('openDataPermission', function(data) {
+      that.open(data)
+    })
+    this.getDepartmentList()
+  },
+  methods: {
+    open(data) {
+      this.permission = data
+      this.getAllDataScopeDepartment()
+      this.show = true
+    },
+    close() {
+      this.show = false
+    },
+    getAllDataScopeDepartment() {
+      getAll({
+        roleId: this.permission.id
+      }).then(data => {
+        data = data.map(row => row.departmentId)
+        this.departments.forEach(permission => {
+          if (permission.children.length > 0) {
+            this.echoChildren(permission.children, data)
+          } else {
+            this.settingChecked(permission, data)
+          }
+        })
+      })
+    },
+    getDepartmentList() {
+      // 查询列表
+      this.api({
+        url: '/department/tree',
+        method: 'get'
+      }).then(data => {
+        this.departments = data
+      })
+    },
+    /**
+     * 改变展示方式
+     */
+    changeShowMode(val) {
+      switch (val) {
+        case 0:
+          this.departments.forEach(row => this.$refs.departments.toggleRowExpansion(row, false))
+          break
+        case 1:
+          this.departments.forEach(row => this.$refs.departments.toggleRowExpansion(row, true))
+          break
+        case 2:
+          this.departments.forEach(row => {
+            row.checked = true
+            row.indeterminate = false
+            this.handleCheckAllChange(row, true)
+          })
+          break
+        case 3:
+          this.departments.forEach(row => {
+            row.checked = false
+            row.indeterminate = false
+            this.handleCheckAllChange(row, false)
+          })
+          break
+        default:
+          break
+      }
+    },
+    update() {
+      console.log(this.checkedIds)
+      console.log(Array.from(this.checkedIds))
+      this.permission.dataScopeDepartmentIds = Array.from(this.checkedIds)
+      console.log(this.permission)
+      CrudRole.edit(this.permission).then(() => this.$notify.success('操作成功'))
+    },
+    handleCheckAllChange(val, checked) {
+      if (checked) {
+        this.checkedIds.add(val.id)
+      } else {
+        this.checkedIds.delete(val.id)
+      }
+      // 有下级去处理下级
+      if (val.children.length > 0) {
+        this.findChildren(val.children, checked)
+      }
+      // 处理上级
+      if (val.parentId !== 0) {
+        this.findParent(this.departments, val.parentId)
+      }
+      val.indeterminate = false
+    },
+    findChildren(list, checked) {
+      list.forEach(children => {
+        children.checked = checked
+        children.indeterminate = false
+        if (children.children.length > 0) {
+          this.findChildren(children.children, checked)
+        }
+      })
+    },
+    findParent(list, parentId) {
+      list.forEach(result => {
+        let parentCheckedLength = 0
+        let parentIndeterminateLength = 0
+        // 对当前层级的上级操作
+        if (result.id === parentId) {
+          // 判断下级的状态，用来为父级的状态做判断
+          result.children.forEach(children => {
+            if (children.indeterminate) {
+              parentIndeterminateLength++
+            } else if (children.checked) {
+              parentCheckedLength++
+            }
+          })
+          result.checked = parentCheckedLength === result.children.length
+          result.indeterminate = (parentIndeterminateLength > 0 || parentCheckedLength > 0) && parentCheckedLength < result.children.length
+
+          if (result.checked) {
+            this.checkedIds.add(result.id)
+          } else {
+            this.checkedIds.delete(result.id)
+          }
+          // 如果还有上级，继续操作
+          if (result.parentId !== 0) {
+            this.findParent(this.departments, result.parentId)
+          }
+        } else if (result.children.length > 0) {
+          this.findParent(result.children, parentId)
+        }
+      })
+    },
+    echoChildren(list, optionsIds) {
+      list.forEach(result => {
+        if (result.children.length === 0) {
+          this.settingChecked(result, optionsIds)
+        } else {
+          this.echoChildren(result.children, optionsIds)
+        }
+      })
+    },
+    settingChecked(result, optionsIds) {
+      let matching = false
+      optionsIds.forEach(optionsId => {
+        if (result.id === optionsId) {
+          result.checked = true
+          matching = true
+        }
+      })
+      if (matching) {
+        this.handleCheckChange(result)
+      }
+    },
+    handleCheckChange(val) {
+      // 处理上级
+      if (val.parentId !== 0) {
+        this.findParent(this.departments, val.parentId)
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/user/role.vue b/src/views/user/role.vue
index 4eff965..012e153 100644
--- a/src/views/user/role.vue
+++ b/src/views/user/role.vue
@@ -10,9 +10,12 @@
     </div>
     <!--表格内容-->
     <CustomTable ref="customTable" :col-configs="colConfigs" :columns="columns" :crud="crud">
-      <el-table-column v-if="checkPermission(permission.edit)" slot="operation" align="center" width="100" label="操作">
+      <el-table-column v-if="checkPermission(permission.edit)" slot="operation" align="center" width="200" label="操作">
         <template slot-scope="scope">
           <Edit :permission="permission" :data="scope.row" :disabled-edit="false" />
+          <el-button type="text" icon="edit" @click="editDataPermission(scope.row)">
+            数据权限
+          </el-button>
         </template>
       </el-table-column>
     </CustomTable>
@@ -87,6 +90,7 @@
         </el-col>
       </el-row>
     </el-drawer>
+    <data-permission />
   </div>
 </template>
 
@@ -99,6 +103,8 @@ import CustomTable from '@/components/Crud/Table'
 import Pagination from '@/components/Crud/Pagination'
 import CrudRole from '@/api/role'
 import { getPermissionsByRoleId, getTree } from '@/api/permission'
+import DataPermission from './components/data-permission'
+import Utils from '@/utils/contact'
 
 // crud交由presenter持有
 const defaultCrud = presenter(CRUD({
@@ -118,7 +124,7 @@ const defaultForm = form({
 
 export default {
   name: 'RoleList',
-  components: { Pagination, Query, Crud, CustomTable, Edit },
+  components: { Pagination, Query, Crud, CustomTable, Edit, DataPermission },
   mixins: [defaultCrud, defaultForm, header()],
   data() {
     return {
@@ -163,6 +169,13 @@ export default {
     [CRUD.HOOK.afterValidateCU]() {
       this.form.resourcePermissionIds = Array.from(this.checkedIds)
     },
+    /**
+     * 加载数据权限窗口
+     */
+    editDataPermission(data) {
+      console.log('加载数据权限窗口')
+      Utils.$emit('openDataPermission', data)
+    },
     /**
      * 改变展示方式
      */