You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

857 lines
27 KiB

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<div class="main-container-text">
<div class="title">柜体管理</div>
<div class="header">
<el-input v-model="name" clearable placeholder="请输入试剂名称" />
<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 @click="handleDraw"><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" @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" />
</div>
</div>
<el-table
v-loading="loading"
:data="tableData"
element-loading-text="拼命加载中"
:header-cell-style="headerStyle"
height="69vh"
:cell-style="{'text-align':'center'}"
@selection-change="handleSelectionChange"
>
<el-table-column
type="selection"
width="55"
align="center"
/>
<el-table-column
type="index"
width="50"
align='center'
/>
<el-table-column
prop="client_name"
show-overflow-tooltip
label="柜体名称"
align="center"
/>
<el-table-column
prop="client_title"
show-overflow-tooltip
label="柜体标题"
align="center"
/>
<el-table-column
prop="place"
label="所处位置"
align="center"
/>
<!-- <el-table-column
show-overflow-tooltip
prop="contact_people_name"
label="联系人"
align="center"
/>
<el-table-column
prop="contact_phone"
label="联系电话"
align="center"
/> -->
<el-table-column
prop="is_enabled"
label="状态"
align="center"
>
<template slot-scope="scope">
<el-tag
:type="scope.row.is_enabled=== 0 ? 'danger' : 'success'"
disable-transitions
>{{ scope.row.is_enabled === 0 ?'异常':'正常' }}</el-tag>
</template>
</el-table-column>
<el-table-column
prop="description"
label="说明"
align="center"
/>
<el-table-column
label="操作"
align="center"
>
<template slot-scope="scope" style="display:flex;flex-direction: row;">
<el-button @click="handleLayerEdit(scope.row)">层级维护</el-button>
<el-button @click="handleFormEdit(scope.row)">编辑</el-button>
</template>
</el-table-column>
</el-table>
<div class="my-pagination" style="text-align: center">
<el-pagination
background
layout="prev, pager, next"
:current-page.sync="page"
:total="total"
:page-size.sync="page_size"
:disabled="loading"
@current-change="pageChange"
/>
</div>
<el-dialog :title="dialogTitile" :close-on-click-modal="false" :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">
<el-form-item label="柜体名称" prop="client_name">
<el-input
v-model="formData.client_name"
placeholder="请输入柜体名称"
clearable
:style="{width: '100%'}"
/>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="柜体标题" prop="client_title">
<el-input
v-model="formData.client_title"
placeholder="请输入柜体标题"
clearable
:style="{width: '100%'}"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="柜体序号" prop="client_code">
<el-input v-model="formData.client_code" placeholder="请输入柜体序号" clearable :style="{width: '100%'}" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="柜体类型" prop="client_type">
<el-input v-model="formData.client_type" placeholder="请输入柜体类型" clearable :style="{width: '100%'}" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="柜体位置" prop="place">
<el-autocomplete
v-model="formData.place"
class="inline-input"
:style="{width: '100%'}"
:fetch-suggestions="querySearchAsync"
clearable
placeholder="请输入柜体位置"
@select="handleSelect"
/>
<!-- <el-select
v-model="formData.place"
filterable
allow-create
default-first-option
placeholder="请输入柜体位置">
<el-option
v-for="item in options"
:key="item.value"
:label="item.value"
:value="item.value">
</el-option>
</el-select> -->
<!-- <el-input v-model="formData.place" placeholder="请输入柜体位置" clearable :style="{width: '100%'}" /> -->
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="柜体层数" prop="layer_num">
<el-input v-model="formData.layer_num" placeholder="请输入柜体层数" clearable :style="{width: '100%'}" :disabled="dialogTitile =='编辑柜体信息' ? true:false" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="柜体滤芯 生产日期" prop="filter_production_date">
<el-date-picker
v-model="formData.filter_production_date"
style="width: 100%"
type="datetime"
value-format="yyyy-MM-dd HH:mm:ss"
placeholder="请选择柜体滤芯 生产日期"
clearable
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="提醒滤芯 到期提前" prop="filter_shelf_life_warning_value">
<el-input
v-model="formData.filter_shelf_life_warning_value"
placeholder="请输入提醒滤芯 到期提前"
clearable
:style="{width: '100%'}"
>
<template slot="append">天</template>
</el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="联系人" prop="contact_people_name">
<el-input v-model="formData.contact_people_name" placeholder="请输入联系人" clearable :style="{width: '100%'}" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="联系电话" prop="contact_phone">
<el-input v-model="formData.contact_phone" placeholder="请输入联系电话" clearable :style="{width: '100%'}" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="说明" prop="description">
<el-input v-model="formData.description" placeholder="请输入说明" clearable :style="{width: '100%'}" />
</el-form-item>
</el-col>
</el-form>
</el-row>
<div slot="footer" style="text-align: center">
<el-button @click="onClose">取消</el-button>
<el-button type="primary" @click="handelConfirm">确定</el-button>
</div>
</el-dialog>
<el-dialog :visible.sync="dialogDrawVisible" :close-on-click-modal="false" 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(0)"><svg-icon icon-class="确认禁用" /> 确认禁用</el-button>
<el-button plain type="success" @click="handleDrawUser(1)"><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 class="my-pagination" style="text-align: center">
<el-pagination
background
layout="prev, pager, next"
:current-page.sync="user_draw_page"
:total="user_draw_total"
:page-size.sync="user_draw_page_size"
:disabled="loadingDraw"
@current-change="userDrawPageChange"
/>
</div>
</el-dialog>
<el-dialog :visible.sync="dialogUserVisible" :close-on-click-modal="false" width="60%" title="分配禁用用户">
<div class="user-header">
<el-input v-model="seach_user" clearable placeholder="请输入内容" />
<el-button type="primary" icon="el-icon-search" @click="getUserList">搜索</el-button>
<el-button plain type="danger" @click="handleEnUser"><svg-icon icon-class="确认禁用" /> 确认禁用</el-button>
<el-button plain type="success" @click="handleDisUser"><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 === 0?'danger':'success'">
{{ scope.row.status_type === 0? '已禁用':'未禁用' }}
</el-tag>
</template>
</el-table-column>
</el-table>
<div class="my-pagination" style="text-align: center">
<el-pagination
background
layout="prev, pager, next"
:current-page.sync="user_page"
:total="user_total"
:page-size.sync="user_page_size"
:disabled="loadingUser"
@current-change="userPageChange"
/>
</div>
</el-dialog>
<el-dialog :visible.sync="dialogLayerVisible" :close-on-click-modal="false" width="30%" title="柜体层级维护">
<el-scrollbar style="height:500px;overflow: hidden;">
<el-form ref="LayerForm" label-width="100px" style="padding-right: 20px">
<div v-for="item,index in layer" :key="index">
<el-col :span="12">
<el-form-item label="柜体层号">
{{item.cell_speci}}
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="存放试剂数量">
<el-input v-model="item.storage_quantity" placeholder="请输入存放试剂数量" clearable :style="{width: '100%'}" />
</el-form-item>
</el-col>
</div>
</el-form>
</el-scrollbar>
<div slot="footer" style="text-align: center">
<el-button @click="dialogLayerVisible =false">取消</el-button>
<el-button type="primary" @click="handelLayerfirm"></el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import stringify from '@/utils/stringify'
import {
get_list,
add_or_update,
update_status,
get_client_drawer,
get_drawer_power,
get_client_place,
get_client_layer,
update_client_storage_quantity,
user_ban_relieve, set_drawer_power, user_ban_list, user_ban_confirm, del, client_empty
} from '@/api/reagent/client'
import { client_list } from '@/api/common'
export default {
name: 'Client',
data() {
return {
page: 1,
page_size: 15,
total: 0,
name: '',
loading: false,
multipleSelection: [],
tableData: [],
headerStyle: { 'background': '#E6E6E6' },
options: [],
formData: {
client_id: undefined,
client_name: undefined,
client_title: undefined,
client_code: undefined,
client_type: undefined,
place: undefined,
filter_production_date: null,
filter_shelf_life_warning_value: undefined,
contact_people_name: undefined,
contact_phone: undefined,
description: undefined,
layer_num:undefined
},
rules: {
client_name: [{
required: true,
message: '请输入柜体名称',
trigger: 'blur'
}],
client_title: [{
required: true,
message: '请输入柜体标题',
trigger: 'blur'
}],
client_code: [{
required: true,
message: '请输入柜体序号',
trigger: 'blur'
}],
client_type: [{
required: true,
message: '请输入柜体类型',
trigger: 'blur'
}],
layer_num: [{
required: true,
message: '请输入柜体层数',
trigger: 'blur'
}],
place: [{
required: true,
message: '请输入柜体位置',
trigger: 'blur'
}],
filter_production_date: [{
required: true,
message: '请选择柜体滤芯 生产日期',
trigger: 'change'
}],
filter_shelf_life_warning_value: [{
required: true,
message: '请输入提醒滤芯 到期提前',
trigger: 'blur'
}],
contact_people_name: [],
contact_phone: [],
description: []
},
dialogVisible: false,
dialogTitile: '',
// 抽屉权限
loadingDraw: false,
dialogDrawVisible: false,
dialogLayerVisible: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: [],
layer:[],
layerflag:false
}
},
created() {
this.getList()
this.getclientplace()
},
destroyed() {
// 更新client数据供后续使用
this.get_client_list()
},
methods: {
querySearchAsync(queryString, cb) {
var restaurants = this.options
var results = queryString ? restaurants.filter(this.createStateFilter(queryString)) : restaurants
clearTimeout(this.timeout)
cb(results)
},
createStateFilter(queryString) {
return (state) => {
return (state.value.toLowerCase().indexOf(queryString.toLowerCase()) >= 1)
}
},
handleSelect(item) {
console.log(item)
this.formData = item
this.formData.place = item.value
},
handelLayerfirm(){
console.log(this.layer)
var dirctionary = {}
this.layerflag =false
this.layer.forEach(item => {
if(isNaN(Number(item.storage_quantity))==true || Number(item.storage_quantity)<1){
this.$message.warning('0')
this.layerflag =true
return
}else{
let key =item.id
let value =item.storage_quantity
dirctionary[key] = value;
}
})
if (this.layerflag){
return
}else{
update_client_storage_quantity(stringify({data_info:dirctionary})).then(
res => {
this.$message.success(res.msg)
if(res.status===0){
this.dialogLayerVisible=false
}
}
)
}
},
getclientplace(){
get_client_place().then(
res => {
this.options =res.data
}
)
},
get_client_list() {
client_list().then(
res => {
const cls = this.$store.getters.clientOptions
cls[this.$store.getters.classification] = res.data.data_list
this.$store.commit('app/SET_COPTS', cls)
}
)
},
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(d) {
if (this.multipleDrawSelection.length !== 1) {
this.$message.warning('请选择一个用户!')
return
}
const { user_id } = 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 })
drawer_id: this.drawer_id,
client_id: this.client_id,
// client_code: this.drawData.find(item => item.client_id === this.drawer_id).client_code,
client_cell_code: this.drawData.find(item => item.id === this.drawer_id).cell_code,
drawer_user_info: JSON.stringify({ [user_id]: d })
}
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
this.client_id = val[0].client_id
},
// 柜体分页
pageChange(page) {
this.page = page
this.getList()
},
// 获取柜体列表数据
getList() {
this.loading = true
const data = {
page: this.page,
page_size: this.page_size,
seach_word: this.name
}
get_list(stringify(data)).then(res => {
this.tableData = res.data.data_list
this.total = res.data.total_count
}).finally(() => { this.loading = false })
},
onClose() {
this.dialogVisible = false
this.formData = {
client_id: undefined,
client_name: undefined,
client_title: undefined,
client_code: undefined,
client_type: undefined,
place: undefined,
layer_num:undefined,
filter_production_date: null,
filter_shelf_life_warning_value: undefined,
contact_people_name: undefined,
contact_phone: undefined,
description: undefined
}
this.$refs['elForm'].resetFields()
},
handelConfirm() {
this.$refs['elForm'].validate(valid => {
if (!valid) return
add_or_update(stringify(this.formData)).then(
res => {
this.$message.success(res.msg)
this.onClose()
this.getList()
this.getclientplace()
}
)
})
},
handleFormOpen(t) {
this.dialogTitile = '新增自定义柜体'
this.dialogVisible = true
},
handleFormEdit(row) {
this.dialogTitile = '编辑柜体信息'
Object.keys(this.formData).forEach(item => {
this.formData[item] = row[item]
})
this.formData.client_id = row.client_id
this.dialogVisible = true
},
handleLayerEdit(row){
console.log(row)
const data={
client_id:row.client_id
}
get_client_layer(stringify(data)).then(
res => {
this.layer =res.data
}
)
this.dialogLayerVisible =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
})
this.getList()
this.get_client_list()
}
)
}).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 = {
status_type: is_enabled === 0 ? 1 : 0,
client_id: client_id
}
const text = is_enabled === 1 ? '确定要锁定所选的柜体?' : '确定要解锁所选的柜体?'
this.$confirm(text, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
update_status(stringify(data)).then(res => {
this.$message({
type: 'success',
message: res.msg
})
this.getList()
})
}).catch(() => {
this.$message({
type: 'info',
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: '已取消'
})
})
}
}
}
</script>
<style lang="scss" scoped>
.main-container-text{
min-height:calc(100vh - 110px) ;
padding: 1rem;
margin: 1rem;
background: white;
.title{
font-size: 20px;
font-weight: bold;
color: #000000;
}
.header{
margin: 1rem 0 1rem 0;
.right{
float: right;
}
.el-input{
width: 9.375rem;
margin-right: 1rem;
}
.el-select {
margin-right: 1rem;
}
.header-right{
float: right;
}
}
}
.user-header {
margin-bottom: 1rem;
.el-input{
width: 12.5rem;
margin-right: 1rem;
}
.el-select{
width: 12.5rem;
margin-right: 1rem;
}
}
</style>