数据权限绑定

lms/nladmin-ui/src/views/system/permission/dataPermission.js

@@ -0,0 +1,49 @@
+import request from '@/utils/request'
+
+export function add(data) {
+  return request({
+    url: 'api/dataPermission',
+    method: 'post',
+    data
+  })
+}
+
+export function del(ids) {
+  return request({
+    url: 'api/dataPermission/',
+    method: 'delete',
+    data: ids
+  })
+}
+
+export function edit(data) {
+  return request({
+    url: 'api/dataPermission',
+    method: 'put',
+    data
+  })
+}
+
+export function getDataScopeType() {
+  return request({
+    url: 'api/dataPermission/scopeType',
+    method: 'get'
+  })
+}
+
+export function getDataPermissionOption() {
+  return request({
+    url: 'api/dataPermission/dataPermissionOption',
+    method: 'get'
+  })
+}
+
+export function saveDataPermission(data) {
+  return request({
+    url: 'api/dataPermission/saveDataPermission',
+    method: 'post',
+    data
+  })
+}
+
+export default { add, edit, del, getDataScopeType, getDataPermissionOption, saveDataPermission }

lms/nladmin-ui/src/views/system/permission/index.vue

@@ -0,0 +1,109 @@
+<template>
+  <div class="app-container">
+    <!--工具栏-->
+    <div class="head-container">
+      <!--如果想在工具栏加入更多按钮，可以使用插槽方式， slot = 'left' or 'right'-->
+      <crudOperation :permission="permission" />
+      <!--表单组件-->
+      <el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="500px">
+        <el-form ref="form" :model="form" :rules="rules" size="mini" label-width="80px">
+          <el-form-item label="编码" prop="code">
+            <el-input v-model="form.code" style="width: 370px;" />
+          </el-form-item>
+          <el-form-item label="名称" prop="name">
+            <el-input v-model="form.name" style="width: 370px;" />
+          </el-form-item>
+          <el-form-item label="排序">
+            <el-input-number
+              v-model.number="form.order_sort"
+              :min="0"
+              :max="999"
+              controls-position="right"
+              style="width: 370px;"
+            />
+          </el-form-item>
+          <el-form-item label="备注">
+            <el-input v-model="form.remark" style="width: 370px;" />
+          </el-form-item>
+          <el-form-item label="是否启用">
+            <el-switch v-model="form.is_used" active-value="1" inactive-value="0" />
+          </el-form-item>
+        </el-form>
+        <div slot="footer" class="dialog-footer">
+          <el-button type="text" @click="crud.cancelCU">取消</el-button>
+          <el-button :loading="crud.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
+        </div>
+      </el-dialog>
+      <!--表格渲染-->
+      <el-table ref="table" v-loading="crud.loading" :data="crud.data" size="mini" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
+        <el-table-column type="selection" width="55" />
+        <el-table-column v-if="false" prop="permission_id" label="permission_id" :min-width="flexWidth('permission_id',crud.data,'permission_id')" />
+        <el-table-column prop="code" label="编码" :min-width="flexWidth('code',crud.data,'编码')" />
+        <el-table-column prop="name" label="名称" :min-width="flexWidth('name',crud.data,'名称')" />
+        <el-table-column prop="order_sort" label="排序" :min-width="flexWidth('order_sort',crud.data,'排序')" />
+        <el-table-column prop="remark" label="备注" :min-width="flexWidth('remark',crud.data,'备注')" />
+        <el-table-column prop="create_name" label="创建人" :min-width="flexWidth('create_name',crud.data,'创建人')" />
+        <el-table-column prop="is_used" label="是否启用" :min-width="flexWidth('is_used',crud.data,'是否启用')" >
+          <template slot-scope="scope">
+            {{ scope.row.is_used==1?'是':'否' }}
+          </template>
+        </el-table-column>
+        <el-table-column prop="create_name" label="创建人" :min-width="flexWidth('create_name',crud.data,'创建人')" />
+        <el-table-column prop="update_time" label="修改时间" :min-width="flexWidth('update_time',crud.data,'修改时间')" />
+        <el-table-column v-permission="[]" label="操作" width="120px" align="center" fixed="right">
+          <template slot-scope="scope">
+            <udOperation
+              :data="scope.row"
+              :permission="permission"
+            />
+          </template>
+        </el-table-column>
+      </el-table>
+      <!--分页组件-->
+      <pagination />
+    </div>
+  </div>
+</template>
+
+<script>
+import crudDataPermission from './dataPermission'
+import CRUD, { crud, form, header, presenter } from '@crud/crud'
+import rrOperation from '@crud/RR.operation'
+import crudOperation from '@crud/CRUD.operation'
+import udOperation from '@crud/UD.operation'
+import pagination from '@crud/Pagination'
+
+const defaultForm = { permission_id: null, code: null, name: null, order_sort: '1', remark: null, create_name: null, is_used: '1', create_id: null, create_time: null, update_time: null, update_optid: null, update_optname: null }
+export default {
+  name: 'DataPermission',
+  components: { pagination, crudOperation, rrOperation, udOperation },
+  mixins: [presenter(), header(), form(defaultForm), crud()],
+  cruds() {
+    return CRUD({ title: '数据权限', url: 'api/dataPermission', idField: 'permission_id', sort: 'permission_id,desc', crudMethod: { ...crudDataPermission }})
+  },
+  data() {
+    return {
+      permission: {
+      },
+      rules: {
+        code: [
+          { required: true, message: '编码不能为空', trigger: 'blur' }
+        ],
+        name: [
+          { required: true, message: '名称不能为空', trigger: 'blur' }
+        ]
+      }
+    }
+  },
+  methods: {
+    // 钩子：在获取表格数据之前执行，false 则代表不获取数据
+    [CRUD.HOOK.beforeRefresh]() {
+      return true
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

lms/nladmin-ui/src/views/system/user/dialog/relevanceDeptDialog.vue

@@ -0,0 +1,169 @@
+<template>
+  <el-dialog
+    title="关联用户"
+    append-to-body
+    :visible.sync="dialogVisible"
+    destroy-on-close
+    width="1000px"
+    @close="close"
+    @open="open"
+  >
+    <el-form
+      :inline="true"
+      class="demo-form-inline"
+      label-position="right"
+      label-width="80px"
+      label-suffix=":"
+    >
+      <el-form-item label="模糊搜索">
+        <el-input
+          v-model="query.name"
+          clearable
+          size="mini"
+          placeholder="输入部门名称搜索"
+          style="width: 200px;"
+          class="filter-item"
+          @keyup.enter.native="crud.toQuery"
+        />
+      </el-form-item>
+      <rrOperation />
+    </el-form>
+
+    <!--表格渲染-->
+    <el-table
+      ref="table"
+      v-loading="crud.loading"
+      :data="crud.data"
+      lazy
+      row-key="dept_id"
+      :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
+      :load="getDeptDatas"
+      default-expand-all
+      style="width: 100%;"
+      size="mini"
+      border
+      :header-cell-style="{background:'#f5f7fa',color:'#606266'}"
+      @select="handleSelectionChange"
+      @select-all="onSelectAll"
+      @current-change="clickChange"
+    >
+      <el-table-column v-if="!isSingle" type="selection" width="55" />
+      <el-table-column v-if="isSingle" label="选择" width="55">
+        <template slot-scope="scope">
+          <el-radio v-model="tableRadio" :label="scope.row"><i /></el-radio>
+        </template>
+      </el-table-column>
+      <el-table-column label="名称" prop="name" />
+      <el-table-column label="排序" prop="dept_sort" />
+      <el-table-column prop="create_time" label="创建日期" />
+    </el-table>
+    <!--分页组件-->
+    <pagination />
+    <span slot="footer" class="dialog-footer">
+      <el-button @click="dialogVisible = false">取 消</el-button>
+      <el-button type="primary" @click="submit">确 定</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+
+import crudDept from '@/api/system/dept'
+import CRUD, { header, presenter } from '@crud/crud'
+import rrOperation from '@crud/RR.operation'
+import pagination from '@crud/Pagination'
+
+export default {
+  name: 'RelevanceDeptDialog',
+  components: { rrOperation, pagination },
+  cruds() {
+    return CRUD({ title: '部门', idField: 'dept_id', url: 'api/dept/vo', crudMethod: { ...crudDept }, query: { is_used: '1' }})
+  },
+  mixins: [presenter(), header()],
+  dicts: ['product_series'],
+  props: {
+    dialogShow: {
+      type: Boolean,
+      default: false
+    },
+    isSingle: {
+      type: Boolean,
+      default: true
+    },
+    materOptCode: {
+      type: String,
+      default: '00'
+    }
+  },
+  data() {
+    return {
+      dialogVisible: false,
+      classes: [],
+      tableRadio: null,
+      class_idStr: null,
+      checkrow: null,
+      rows: []
+    }
+  },
+  watch: {
+    dialogShow: {
+      handler(newValue) {
+        this.dialogVisible = newValue
+      }
+    }
+  },
+  methods: {
+    clickChange(item) {
+      this.tableRadio = item
+    },
+    open() {
+    },
+    handleSelectionChange(val, row) {
+      if (val.length > 1 && this.isSingle) {
+        this.$refs.table.clearSelection()
+        this.$refs.table.toggleRowSelection(val.pop())
+      } else {
+        this.checkrow = row
+      }
+    },
+    onSelectAll() {
+      this.$refs.table.clearSelection()
+    },
+    close() {
+      this.crud.resetQuery(false)
+      this.$emit('update:dialogShow', false)
+    },
+    submit() {
+      // 处理单选
+      if (this.isSingle && this.tableRadio) {
+        this.$emit('update:dialogShow', false)
+        this.$emit('selectDepts', this.tableRadio)
+        return
+      }
+      this.rows = this.$refs.table.selection
+      if (this.rows.length <= 0) {
+        this.$message('请先勾选用户')
+        return
+      }
+      this.crud.resetQuery(false)
+      this.$emit('update:dialogShow', false)
+      this.$emit('selectDepts', this.rows)
+      // console.log(this.rows)
+    },
+    getDeptDatas(tree, treeNode, resolve) {
+      const params = { pid: tree.dept_id }
+      setTimeout(() => {
+        crudDept.getDeptvo(params).then(res => {
+          resolve(res.content)
+        })
+      }, 100)
+    },
+  }
+}
+</script>
+<style rel="stylesheet/scss" lang="scss" scoped>
+  ::v-deep .el-dialog__body {
+    padding-top: 0px;
+  }
+</style>
+

lms/nladmin-ui/src/views/system/user/dialog/relevanceUserDialog.vue

@@ -0,0 +1,163 @@
+<template>
+  <el-dialog
+    title="关联用户"
+    append-to-body
+    :visible.sync="dialogVisible"
+    destroy-on-close
+    width="1000px"
+    @close="close"
+    @open="open"
+  >
+    <el-form
+      :inline="true"
+      class="demo-form-inline"
+      label-position="right"
+      label-width="80px"
+      label-suffix=":"
+    >
+      <el-form-item label="模糊搜索">
+        <el-input
+          v-model="query.blurry"
+          clearable
+          size="mini"
+          placeholder="输入账号或者名称"
+          @keyup.enter.native="crud.toQuery"
+        />
+      </el-form-item>
+      <rrOperation />
+    </el-form>
+
+    <!--表格渲染-->
+    <el-table
+      ref="table"
+      v-loading="crud.loading"
+      :data="crud.data"
+      style="width: 100%;"
+      size="mini"
+      border
+      :header-cell-style="{background:'#f5f7fa',color:'#606266'}"
+      @select="handleSelectionChange"
+      @select-all="onSelectAll"
+      @current-change="clickChange"
+    >
+      <el-table-column v-if="!isSingle" type="selection" width="55" />
+      <el-table-column v-if="isSingle" label="选择" width="55">
+        <template slot-scope="scope">
+          <el-radio v-model="tableRadio" :label="scope.row"><i /></el-radio>
+        </template>
+      </el-table-column>
+      <el-table-column prop="username" label="用户名" :min-width="flexWidth('username',crud.data,'用户名')" />
+      <el-table-column
+        prop="person_name"
+        label="姓名"
+        :min-width="flexWidth('person_name',crud.data,'姓名')"
+      />
+      <el-table-column show-overflow-tooltip prop="deptnames" label="部门" />
+      <el-table-column label="状态" align="center" prop="enabled">
+        <template slot-scope="scope">
+          {{scope.row.is_used==1?'启用':'禁用'}}
+        </template>
+      </el-table-column>
+    </el-table>
+    <!--分页组件-->
+    <pagination />
+    <span slot="footer" class="dialog-footer">
+      <el-button @click="dialogVisible = false">取 消</el-button>
+      <el-button type="primary" @click="submit">确 定</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+
+import crudUser from '@/api/system/user'
+import CRUD, { header, presenter } from '@crud/crud'
+import rrOperation from '@crud/RR.operation'
+import pagination from '@crud/Pagination'
+
+export default {
+  name: 'RelevanceUserDialog',
+  components: { rrOperation, pagination },
+  cruds() {
+    return CRUD({ title: '用户', idField: 'user_id', url: 'api/users', crudMethod: { ...crudUser }, query: {is_used: '1'}})
+  },
+  mixins: [presenter(), header()],
+  dicts: ['product_series'],
+  props: {
+    dialogShow: {
+      type: Boolean,
+      default: false
+    },
+    isSingle: {
+      type: Boolean,
+      default: true
+    },
+    materOptCode: {
+      type: String,
+      default: '00'
+    }
+  },
+  data() {
+    return {
+      dialogVisible: false,
+      classes: [],
+      tableRadio: null,
+      class_idStr: null,
+      checkrow: null,
+      rows: []
+    }
+  },
+  watch: {
+    dialogShow: {
+      handler(newValue) {
+        this.dialogVisible = newValue
+      }
+    }
+  },
+  methods: {
+    clickChange(item) {
+      this.tableRadio = item
+    },
+    open() {
+    },
+    handleSelectionChange(val, row) {
+      if (val.length > 1 && this.isSingle) {
+        this.$refs.table.clearSelection()
+        this.$refs.table.toggleRowSelection(val.pop())
+      } else {
+        this.checkrow = row
+      }
+    },
+    onSelectAll() {
+      this.$refs.table.clearSelection()
+    },
+    close() {
+      this.crud.resetQuery(false)
+      this.$emit('update:dialogShow', false)
+    },
+    submit() {
+      // 处理单选
+      if (this.isSingle && this.tableRadio) {
+        this.$emit('update:dialogShow', false)
+        this.$emit('selectUsers', this.tableRadio)
+        return
+      }
+      this.rows = this.$refs.table.selection
+      if (this.rows.length <= 0) {
+        this.$message('请先勾选用户')
+        return
+      }
+      this.crud.resetQuery(false)
+      this.$emit('update:dialogShow', false)
+      this.$emit('selectUsers', this.rows)
+      // console.log(this.rows)
+    }
+  }
+}
+</script>
+<style rel="stylesheet/scss" lang="scss" scoped>
+  ::v-deep .el-dialog__body {
+    padding-top: 0px;
+  }
+</style>
+

lms/nladmin-ui/src/views/system/user/index.vue

@@ -177,7 +177,9 @@
                   <el-dropdown-item icon="el-icon-key">
                     <span @click="openDeptDrawer(scope.row)">部门权限</span>
                   </el-dropdown-item>
-                  <el-dropdown-item icon="el-icon-key">数据权限</el-dropdown-item>
+                  <el-dropdown-item icon="el-icon-key">
+                    <span @click="openDataDialog(scope.row)">数据权限</span>
+                  </el-dropdown-item>
                   <el-dropdown-item icon="el-icon-key"><span @click="changeEnabled(scope.row)">{{ enabledTypeOptions.find(item => {return item.key !== scope.row.is_used}).display_name }}账号</span></el-dropdown-item>
                   <el-dropdown-item icon="el-icon-circle-check">
                     <span @click="openRoleDrawer(scope.row)">分配角色</span>
@@ -219,14 +221,14 @@
           />
           <el-table
             v-if="!flag"
-            highlight-current-row
             ref="roleTable"
+            highlight-current-row
             style="width: 100%;"
             :data="rolesDatas"
             @selection-change="crud.selectionChangeHandler"
           >
-            <el-table-column type="selection" width="55"/>
-            <el-table-column prop="name" label="角色名称" min-width="100" show-overflow-tooltip/>
+            <el-table-column type="selection" width="55" />
+            <el-table-column prop="name" label="角色名称" min-width="100" show-overflow-tooltip />
           </el-table>
         </div>
         <div style="height: 10%">
@@ -235,12 +237,65 @@
         </div>
       </div>
     </el-drawer>
+    <el-dialog
+      :close-on-click-modal="true"
+      :visible.sync="dataPerm"
+      title="数据权限"
+      width="700px"
+    >
+      <el-form ref="form" :inline="true" :model="dataDialog" :rules="rules" size="mini" label-width="100px">
+        <el-form-item label="用户名" prop="username">
+          <el-input v-model="dataDialog.username" disabled style="width: 200px;" />
+        </el-form-item>
+        <el-form-item label="姓名" prop="preson_name">
+          <el-input v-model="dataDialog.person_name" disabled style="width: 200px;" />
+        </el-form-item>
+        <el-table
+          ref="dialogTable"
+          :data="dataDialog.dataScopeType"
+          style="width: 100%;"
+          @selection-change="getRows"
+        >
+          <el-table-column :selectable="checkboxT" type="selection" width="55" />
+          <el-table-column prop="label" label="权限范围" />
+          <el-table-column prop="permission_id" label="数据权限">
+            <template slot-scope="scope">
+              <el-select v-model="scope.row.permission_id" placeholder="请选择" @change="openRelevance(scope.row)">
+                <el-option
+                  v-for="item in permissions"
+                  :key="item.permission_id"
+                  :label="item.name"
+                  :value="item.permission_id"
+                />
+              </el-select>
+            </template>
+          </el-table-column>
+          <!--          <el-table-column-->
+          <!--            label="操作"-->
+          <!--            fixed="right"-->
+          <!--            align="center"-->
+          <!--            width="80"-->
+          <!--          >-->
+          <!--            <template slot-scope="scope">-->
+          <!--              <el-button type="text" icon="el-icon-arrow-right" @click="openRelevance(scope.row)">关联</el-button>-->
+          <!--            </template>-->
+          <!--          </el-table-column>-->
+        </el-table>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="cancelDataPerm">取消</el-button>
+        <el-button type="primary" @click="savePermise()">确认</el-button>
+      </div>
+    </el-dialog>
+    <relevance-user-dialog :dialog-show.sync="relevanceUser" :is-single="false" @selectUsers="selectUsers" />
+    <relevance-dept-dialog :dialog-show.sync="relevanceDept" :is-single="false" @selectDepts="selectDepts"/>
   </div>
 </template>
 
 <script>
 import crudUser from '@/api/system/user'
 import crudDept from '@/api/system/dept'
+import crudDataPermission from '@/views/system/permission/dataPermission'
 import { getAll, getLevel } from '@/api/system/role'
 import CRUD, { crud, form, header, presenter } from '@crud/crud'
 import rrOperation from '@crud/RR.operation'
@@ -250,6 +305,8 @@ import pagination from '@crud/Pagination'
 import Treeselect, { LOAD_CHILDREN_OPTIONS } from '@riophae/vue-treeselect'
 import { mapGetters } from 'vuex'
 import '@riophae/vue-treeselect/dist/vue-treeselect.css'
+import RelevanceUserDialog from '@/views/system/user/dialog/relevanceUserDialog'
+import RelevanceDeptDialog from '@/views/system/user/dialog/relevanceDeptDialog'
 
 let userRoles = []
 const defaultForm = {
@@ -266,7 +323,7 @@ const defaultForm = {
 }
 export default {
   name: 'User',
-  components: { Treeselect, crudOperation, rrOperation, udOperation, pagination },
+  components: { RelevanceDeptDialog, RelevanceUserDialog, Treeselect, crudOperation, rrOperation, udOperation, pagination },
   cruds() {
     return CRUD({ title: '用户', idField: 'user_id', url: 'api/users', crudMethod: { ...crudUser }})
   },
@@ -306,7 +363,15 @@ export default {
       rolesDatas: [],
       drawerTitle: '',
       nodeKey: 'dept_id',
-      flag: true
+      flag: true,
+      dataPerm: false,
+      dataDialog: {},
+      permissions: [],
+      permission_id: '',
+      multipleSelection: [], // 选中
+      relevanceUser: false, // 关联用户
+      rowData: {}, // 当行数据
+      relevanceDept: false // 关联部门
     }
   },
   computed: {
@@ -570,6 +635,73 @@ export default {
       this.flag = false
       this.giveValue(row)
     },
+    openDataDialog(row) {
+      // 清空数据 应该需要初始化赋值
+      this.dataDialog = {}
+      this.multipleSelection = []
+      // 获取权限范围
+      crudDataPermission.getDataScopeType().then(res => {
+        this.dataDialog.dataScopeType = res
+        // permissions
+        crudDataPermission.getDataPermissionOption().then(res => {
+          this.permissions = res
+          this.dataDialog.person_name = row.person_name
+          this.dataDialog.username = row.username
+          this.dataDialog.user_id = row.user_id
+          this.dataPerm = true
+          console.log(res)
+        })
+      })
+    },
+    getRows(val) { // 获取行数据
+      this.multipleSelection = val
+      console.log(val)
+    },
+    openRelevance(row) {
+      console.log('关联的当行数据', row)
+      this.rowData = {}
+      if (row.permission_id == '1601040560293023744') { // 用户
+        this.rowData = row
+        this.relevanceUser = true
+      } else if (row.permission_id == '1601040621190123520') {
+        this.rowData = row
+        this.relevanceDept = true
+      }
+    },
+    selectUsers(row) { // row对话框传来的数据
+      for (var i = 0; i < this.dataDialog.dataScopeType.length; i++) {
+        if (this.dataDialog.dataScopeType[i].dict_id == this.rowData.dict_id) {
+          if (this.dataDialog.dataScopeType[i].depts != undefined && this.dataDialog.dataScopeType[i].depts.length > 0) this.dataDialog.dataScopeType[i].depts = []
+          this.dataDialog.dataScopeType[i].users = row
+          break
+        }
+      }
+      this.rowData = {}
+    },
+    selectDepts(row) {
+      for (var i = 0; i < this.dataDialog.dataScopeType.length; i++) {
+        if (this.dataDialog.dataScopeType[i].dict_id == this.rowData.dict_id) {
+          if (this.dataDialog.dataScopeType[i].users != undefined && this.dataDialog.dataScopeType[i].users.length > 0) this.dataDialog.dataScopeType[i].users = []
+          this.dataDialog.dataScopeType[i].depts = row
+          break
+        }
+      }
+      this.rowData = {}
+    },
+    cancelDataPerm() {
+      this.dataPerm = false
+    },
+    savePermise() {
+      const param = {
+        user_id: this.dataDialog.user_id,
+        datas: this.multipleSelection
+      }
+      crudDataPermission.saveDataPermission(param).then(res => {
+        this.dataPerm = false
+        this.crud.notify('添加数据权限成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
+        this.crud.toQuery()
+      })
+    },
     openDrawer() {
       this.syncDrawer = true
       this.depCheckedId = ''