feat(src/views/reagent/client): 完成柜体管理 分配抽屉权限功能、分配禁用用户功能、删除柜体功能、清空数据功能

src/api/reagent/client.js

@@ -26,3 +26,75 @@ export function update_status(data) {
     data
   })
 }
+
+// /api/client/get_client_drawer
+export function get_client_drawer(data) {
+  return request({
+    url: '/api/client/get_client_drawer',
+    method: 'post',
+    data
+  })
+}
+
+// /api/client/get_drawer_power
+export function get_drawer_power(data) {
+  return request({
+    url: '/api/client/get_drawer_power',
+    method: 'post',
+    data
+  })
+}
+
+//  /api/client/set_drawer_power
+export function set_drawer_power(data) {
+  return request({
+    url: '/api/client/set_drawer_power',
+    method: 'post',
+    data
+  })
+}
+//  /api/client/user_ban_list
+export function user_ban_list(data) {
+  return request({
+    url: '/api/client/user_ban_list',
+    method: 'post',
+    data
+  })
+}
+
+//  /api/client/user_ban_confirm
+export function user_ban_confirm(data) {
+  return request({
+    url: '/api/client/user_ban_confirm',
+    method: 'post',
+    data
+  })
+}
+
+//  /api/client/user_ban_relieve
+export function user_ban_relieve(data) {
+  return request({
+    url: '/api/client/user_ban_relieve',
+    method: 'post',
+    data
+  })
+}
+
+//  /api/client/del
+export function del(data) {
+  return request({
+    url: '/api/client/del',
+    method: 'post',
+    data
+  })
+}
+
+// /api/client/client_empty
+export function client_empty(data) {
+  return request({
+    url: '/api/client/client_empty',
+    method: 'post',
+    data
+  })
+}
+

src/views/reagent/client/index.vue

@@ -6,9 +6,9 @@
       <el-button type="primary" icon="el-icon-search" @click="getList">搜索</el-button>
       <el-button type="primary" plain icon="el-icon-plus" @click="handleFormOpen('add')">新增自定义柜体</el-button>
       <el-button icon="el-icon-unlock" @click="handleLock">柜体锁定/解锁</el-button>
-      <el-button><svg-icon icon-class="分配权限" /> 分配抽屉权限</el-button>
+      <el-button @click="handleDraw"><svg-icon icon-class="分配权限" /> 分配抽屉权限</el-button>
-      <el-button><svg-icon icon-class="分配禁用用户" /> 分配禁用用户</el-button>
+      <el-button @click="handleUser"><svg-icon icon-class="分配禁用用户" /> 分配禁用用户</el-button>
-      <el-button type="danger" plain icon="el-icon-close">清空数据</el-button>
+      <el-button type="danger" plain icon="el-icon-close" @click="handleEmpty">清空数据</el-button>
       <div class="right">
         <el-button icon="el-icon-delete" circle @click="handleDel" />
         <el-button icon="el-icon-refresh" circle @click="getList" />
@@ -97,7 +97,7 @@
         @current-change="pageChange"
       />
     </div>
-    <el-dialog :title="dialogTitile" :visible="dialogVisible" @close="onClose">
+    <el-dialog :title="dialogTitile" :visible.sync="dialogVisible" @close="onClose">
       <el-row :gutter="15">
         <el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="80px">
           <el-col :span="24">
@@ -181,12 +181,107 @@
         <el-button type="primary" @click="handelConfirm">确定</el-button>
       </div>
     </el-dialog>
+    <el-dialog :visible.sync="dialogDrawVisible" title="分配抽屉权限">
+      <div class="user-header">
+        <el-select v-model="drawer_id" placeholder="请选择抽屉" @change="handleDrawSelect">
+          <el-option
+            v-for="item in drawData"
+            :key="item.id"
+            :label="item.cell_code"
+            :value="item.id"
+          />
+        </el-select>
+        <el-button plain type="danger" @click="handleDrawUser"><svg-icon icon-class="确认禁用" /> 确认禁用</el-button>
+        <el-button plain type="success" @click="handleDrawUser"><svg-icon icon-class="解除禁用" /> 解除禁用</el-button>
+      </div>
+      <el-table
+        v-loading="loadingDraw"
+        element-loading-text="拼命加载中"
+        :header-cell-style="headerStyle"
+        :data="userDrawData"
+        height="420"
+        @selection-change="handleDrawUserSelectionChange"
+      >
+        <el-table-column type="selection" width="55" align="center" />
+        <el-table-column type="index" width="50" />
+        <el-table-column align="center" property="real_name" label="用户名称" />
+        <el-table-column align="center" property="user_code" label="工号" />
+        <el-table-column align="center" label="禁用状态">
+          <template slot-scope="scope">
+            <el-tag :type="scope.row.drawer_type === 1?'danger':'success'">{{ scope.row.drawer_type === 1? '已禁用':'未禁用' }}</el-tag>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div style="text-align: center">
+        <el-pagination
+          background
+          layout="prev, pager, next"
+          :current-page.sync="user_draw_page"
+          :total="user_draw_total"
+          hide-on-single-page
+          :page-size.sync="user_draw_page_size"
+          :disabled="loadingDraw"
+          @current-change="userDrawPageChange"
+        />
+      </div>
+    </el-dialog>
+    <el-dialog :visible.sync="dialogUserVisible" width="60%" title="分配禁用用户">
+      <div class="user-header">
+        <el-input v-model="seach_user" placeholder="请输入内容" />
+        <el-button type="primary" icon="el-icon-search" @click="getUserList">搜索</el-button>
+        <el-button plain type="danger" @click="handleDisUser"><svg-icon icon-class="确认禁用" /> 确认禁用</el-button>
+        <el-button plain type="success" @click="handleEnUser"><svg-icon icon-class="解除禁用" /> 解除禁用</el-button>
+      </div>
+      <el-table
+        v-loading="loadingUser"
+        element-loading-text="拼命加载中"
+        :header-cell-style="headerStyle"
+        :data="userData"
+        height="420"
+        @selection-change="handleUserSelectionChange"
+      >
+        <el-table-column type="selection" width="55" align="center" />
+        <el-table-column type="index" width="50" />
+        <el-table-column align="center" property="name" label="用户头像">
+          <template slot-scope="scope">
+            <el-avatar :size="20" :src="scope.row.circleUrl" />
+          </template>
+        </el-table-column>
+        <el-table-column align="center" property="real_name" label="用户名称" />
+        <el-table-column align="center" property="role_name" label="用户身份" />
+        <el-table-column align="center" label="禁用状态">
+          <template slot-scope="scope">
+            <el-tag :type="scope.row.status_type === 1?'danger':'success'">{{ scope.row.status_type === 1? '已禁用':'未禁用' }}</el-tag>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div style="text-align: center">
+        <el-pagination
+          background
+          layout="prev, pager, next"
+          :current-page.sync="user_page"
+          :total="user_total"
+          hide-on-single-page
+          :page-size.sync="user_page_size"
+          :disabled="loadingUser"
+          @current-change="userPageChange"
+        />
+      </div>
+
+    </el-dialog>
   </div>
 </template>
 
 <script>
 import stringify from '@/utils/stringify'
-import { get_list, add_or_update, update_status } from '@/api/reagent/client'
+import {
+  get_list,
+  add_or_update,
+  update_status,
+  get_client_drawer,
+  get_drawer_power,
+  user_ban_relieve, set_drawer_power, user_ban_list, user_ban_confirm, del, client_empty
+} from '@/api/reagent/client'
 
 export default {
   name: 'Client',
@@ -250,21 +345,174 @@ export default {
         description: []
       },
       dialogVisible: false,
-      dialogTitile: ''
+      dialogTitile: '',
+      // 抽屉权限
+      loadingDraw: false,
+      dialogDrawVisible: false,
+      drawData: [],
+      userDrawData: [],
+      multipleDrawSelection: [],
+      user_draw_page: 1,
+      user_draw_page_size: 15,
+      user_draw_total: 0,
+      client_id: undefined,
+      client_code: undefined,
+      drawer_id: undefined,
+      client_cell_code: undefined,
+      // 用户
+      dialogUserVisible: false,
+      loadingUser: false,
+      seach_user: '',
+      userData: [],
+      user_page: 1,
+      user_page_size: 15,
+      user_total: 0,
+      multipleUserSelection: []
     }
   },
   created() {
     this.getList()
   },
   methods: {
-    // 选择试剂
+    handleDisUser() {
+      if (this.multipleUserSelection.length !== 1) {
+        this.$message.warning('请选择一个用户！')
+        return
+      }
+      const data = {
+        user_id: this.multipleUserSelection[0].user_id,
+        client_id: this.client_id
+      }
+      user_ban_confirm(stringify(data)).then(res => {
+        if (res.status === 0) {
+          this.$message.success(res.msg)
+          this.getUserList()
+        }
+      })
+    },
+    handleEnUser() {
+      if (this.multipleUserSelection.length !== 1) {
+        this.$message.warning('请选择一个用户！')
+        return
+      }
+      const data = {
+        user_id: this.multipleUserSelection[0].user_id,
+        client_id: this.client_id
+      }
+      user_ban_relieve(stringify(data)).then(res => {
+        if (res.status === 0) {
+          this.$message.success(res.msg)
+          this.getUserList()
+        }
+      })
+    },
+    handleUser() {
+      if (this.multipleSelection.length !== 1) {
+        this.$message.warning('请选择一个柜体！')
+        return
+      }
+      this.getUserList()
+      this.dialogUserVisible = true
+    },
+    getUserList() {
+      const data = {
+        seach_user: this.seach_user,
+        client_id: this.client_id,
+        page: this.user_page,
+        page_size: this.user_page_size
+      }
+      this.loadingUser = true
+      user_ban_list(stringify(data)).then(
+        res => {
+          this.userData = res.data.data
+          this.user_total = res.data.total_count
+        }
+      ).finally(() => { this.loadingUser = false })
+    },
+    userPageChange(page) {
+      this.user_page = page
+      this.getUserList()
+    },
+    // 抽屉禁用或解除禁用
+    handleDrawUser() {
+      if (this.multipleDrawSelection.length !== 1) {
+        this.$message.warning('请选择一个用户！')
+        return
+      }
+      const { user_id, drawer_type } = this.multipleDrawSelection[0]
+      const data = {
+        drawer_id: this.drawer_id,
+        client_id: this.client_id,
+        client_code: this.client_cell_code,
+        client_cell_code: this.client_cell_code,
+        drawer_user_info: JSON.stringify({ [user_id]: drawer_type === 0 ? 1 : 0 })
+      }
+      set_drawer_power(stringify(data)).then(res => {
+        this.$message.success(res.msg)
+        this.getDrawUserList()
+      })
+    },
+    // 用户多选
+    handleUserSelectionChange(val) {
+      this.multipleUserSelection = val
+    },
+    //  选择不同抽屉刷新用户数据
+    handleDrawSelect(val) {
+      this.drawer_id = val
+      this.getDrawUserList()
+    },
+    // 获取柜体抽屉数据
+    handleDraw() {
+      if (this.multipleSelection.length !== 1) {
+        this.$message.warning('请选择一个柜体！')
+        return
+      }
+      this.client_id = this.multipleSelection[0].client_id
+      this.client_code = this.multipleSelection[0].client_code
+      this.loading = true
+      get_client_drawer(stringify({ client_id: this.client_id })).then(
+        res => {
+          this.drawData = res.data
+          this.drawer_id = this.drawData[0].id
+          this.client_cell_code = this.drawData[0].cell_code
+          this.getDrawUserList()
+          this.dialogDrawVisible = true
+        }
+      ).finally(() => { this.loading = false })
+    },
+    // 获取分配抽屉权限 用户列表
+    getDrawUserList() {
+      const data = {
+        drawer_id: this.drawer_id,
+        client_id: this.client_id,
+        page: this.user_draw_page,
+        page_size: this.user_draw_page_size
+      }
+      this.loadingDraw = true
+      get_drawer_power(stringify(data)).then(res => {
+        this.userDrawData = res.data.data_list
+        this.user_draw_total = res.data.total_count
+      }).finally(() => { this.loadingDraw = false })
+    },
+    // 获取分配抽屉权限 用户列表 分页
+    userDrawPageChange(page) {
+      this.user_draw_page = page
+      this.getDrawUserList()
+    },
+    // // 获取分配抽屉权限 用户列表选择用户
+    handleDrawUserSelectionChange(val) {
+      this.multipleDrawSelection = val
+    },
+    // 选择柜体
     handleSelectionChange(val) {
       this.multipleSelection = val
     },
+    // 柜体分页
     pageChange(page) {
       this.page = page
       this.getList()
     },
+    // 获取柜体列表数据
     getList() {
       this.loading = true
       const data = {
@@ -319,10 +567,35 @@ export default {
       this.dialogVisible = true
     },
     handleDel() {
+      if (this.multipleSelection.length !== 1) {
+        this.$message.warning('请选择一个柜体！')
+        return
+      }
+      this.$confirm('确定要删除所选的柜体吗？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        del(stringify({ client_id: this.multipleSelection[0].client_id })).then(
+          res => {
+            this.$message({
+              type: 'success',
+              message: res.msg
+            })
+          }
+        )
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消删除'
+        })
+      })
     },
+    // 柜体锁定
     handleLock() {
       if (this.multipleSelection.length !== 1) {
         this.$message.warning('请选择一个柜体！')
+        return
       }
       const { client_id, is_enabled } = this.multipleSelection[0]
       const data = {
@@ -345,7 +618,32 @@ export default {
       }).catch(() => {
         this.$message({
           type: 'info',
-          message: '已取消删除'
+          message: '已取消'
+        })
+      })
+    },
+    handleEmpty() {
+      if (this.multipleSelection.length !== 1) {
+        this.$message.warning('请选择一个柜体！')
+        return
+      }
+      this.$confirm('确定要清空所选的柜体数据吗？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        client_empty(stringify({ client_id: this.multipleSelection[0].client_id })).then(
+          res => {
+            this.$message({
+              type: 'success',
+              message: res.msg
+            })
+          }
+        )
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消'
         })
       })
     }
@@ -388,5 +686,9 @@ export default {
     width: 150px;
     margin-right: 1rem;
   }
+  .el-select{
+    width: 150px;
+    margin-right: 1rem;
+  }
 }
 </style>