Commit 99e2f6ec authored by AiNoeLiYa's avatar AiNoeLiYa

Merge branch 'newprotect' of http://gitlab.91isoft.com:90/yangshuo/template_vue into newprotect

parents 4999b371 c3381046
<template>
<div class="app-container">
<!-- TODO: 基础设备管理-->
<el-form ref="queryForm" style="padding: 0 0 0 10px" :model="queryParams" :inline="true">
<el-form-item label="设备名称" prop="roleName">
<el-input
v-model="queryParams.roleName"
v-model="queryParams.deviceName"
placeholder="请输入设备名称"
clearable
:maxlength="30"
......@@ -12,158 +15,144 @@
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="设备来源" prop="roleKey">
<el-input
v-model="queryParams.roleKey"
placeholder="请输入设备来源"
clearable
size="small"
style="width: 150px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" size="small" icon="el-icon-search" @click="handleQuery">查询</el-button>
</el-form-item>
</el-form>
<div class="placeholder" />
<!-- TODO: 中间的分隔符号 -->
<div style="padding:5px 10px">
<div class="mb12 font-small-bold">设备申请列表</div>
<el-table v-loading="loading" border :data="tableData" @selection-change="handleSelectionChange">
<!-- TODO: 以下为基础设备管理列表 -->
<div class="mb12 font-small-bold">设备领用列表</div>
<el-table v-loading="loading" border :data="roleList" @selection-change="handleSelectionChange">
<el-table-column type="index" label="序号" width="50" />
<el-table-column
label="设备名称"
prop="name">
<el-table-column label="设备名称" prop="deviceName" :show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.deviceName || '-' }}
</template>
</el-table-column>
<el-table-column
label="设备编码"
prop="id">
<el-table-column label="设备编码" prop="deviceId">
<template slot-scope="scope">
{{ scope.row.deviceId || '-' }}
</template>
</el-table-column>
<el-table-column
label="LOT"
prop="lot">
<el-table-column label="LOT" prop="LOT">
<template slot-scope="scope">
{{ scope.row.deviceId || '-' }}
</template>
</el-table-column>
<el-table-column type="expand" width="30">
<template slot-scope="props">
<el-form label-position="left" inline class="demo-table-expand">
<el-form-item label="设备名称:">
<span>{{ props.row.name }}</span>
</el-form-item>
<el-form-item label="设备编码:">
<span>{{ props.row.id }}</span>
</el-form-item>
<el-form-item label="LOT:">
<span>{{ props.row.lot }}</span>
</el-form-item>
<el-form-item label="厚度:">
<span>{{ props.row.ply }}</span>
</el-form-item>
<el-form-item label="创建时间:">
<span>{{ props.row.creatTime }}</span>
</el-form-item>
<el-form-item label="位置:">
<span>{{ props.row.loction }}</span>
</el-form-item>
<el-form-item label="创建人:">
<span>{{ props.row.creatMan }}</span>
</el-form-item>
</el-form>
<el-table-column label="位置" prop="location">
<template slot-scope="scope">
{{ scope.row.location || '-' }}
</template>
</el-table-column>
<el-table-column label="厚度" prop="ply">
<template slot-scope="scope">
{{ scope.row.ply || '-' }}
</template>
</el-table-column>
<el-table-column label="操作员" prop="createBy">
<template slot-scope="scope">
{{ scope.row.createBy || '-' }}
</template>
</el-table-column>
<el-table-column label="创建时间" :show-overflow-tooltip="true" align="center" prop="createTime">
<template slot-scope="scope">
<span>{{ scope.row.createTime | transformDateByFormat('YYYY-MM-DD HH:mm') }}</span>
</template>
</el-table-column>
<el-table-column label="状态" prop="state">
<template slot-scope="scope">
{{ scope.row.state || '-' }}
</template>
</el-table-column>
<el-table-column label="操作" class-name="small-padding fixed-width" width="140px">
<template slot-scope="scope">
<!-- <el-button-->
<!-- v-hasPermi="['sys:role:update']"-->
<!-- size="mini"-->
<!-- type="text"-->
<!-- style="color: #49cec9"-->
<!-- @click="handleUpdate(scope.row)"-->
<!-- >修改</el-button>-->
<coolbutton style="color: #49cec9" :type="typeParent" :name="audit" :size="size" :haspermi="updateHaspermi" @btn-click="handleUpdate(scope.row)" />
<!-- <el-button-->
<!-- v-hasPermi="['sys:role:update']"-->
<!-- size="mini"-->
<!-- type="text"-->
<!-- icon="el-icon-circle-check"-->
<!-- @click="handleMenu(scope.row)"-->
<!-- >数据权限</el-button>-->
<!-- <el-button
size="mini"
type="text"
@click="handleDelete(scope.row)"
<el-button v-if="scope.row.state !== ' '" type="typeParent" :size="size" @click="handleDetail(scope.row)">
详情
</el-button>
<!-- <el-button v-if="scope.row.state !== ' '" type="typeParent" :size="size" @click="handleUpdate(scope.row)">
{{ updataName }}
</el-button>
<el-button v-if="scope.row.state !== ' '" type="typeParent" :size="size" @click="handleDelete(scope.row)"
>删除</el-button> -->
</template>
</el-table-column>
</el-table>
</div>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<el-pagination
background
layout="prev, pager, next"
:total="1000">
</el-pagination>
<!-- 添加或修改设备配置对话框 -->
<!-- TODO: 添加或修改设备配置对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="名称" prop="roleName">
<el-input v-model.trim="form.roleName" show-word-limit :maxlength="30" placeholder="请输入设备名称" />
<el-form-item label="设备名称" prop="deviceName">
<el-input v-model.trim="form.deviceName" show-word-limit :maxlength="30" placeholder="请输入设备名称" />
</el-form-item>
<el-form-item label="编码" prop="roleKey">
<el-input v-model.trim="form.roleKey" show-word-limit :maxlength="30" placeholder="请输入设备编码" />
<el-form-item label="设备编码" prop="deviceId">
<el-input v-model.trim="form.deviceId" show-word-limit :maxlength="30" placeholder="请输入设备编码" />
</el-form-item>
<el-form-item label="LOT" prop="roleSort">
<el-input v-model.trim="form.roleSort" show-word-limit :maxlength="30" placeholder="请输入设备LOT" />
<el-form-item label="LOT" prop="LOT">
<el-input v-model.trim="form.LOT" show-word-limit :maxlength="30" placeholder="请输入LOT" />
</el-form-item>
<!-- <el-form-item label="状态"> -->
<!-- <el-radio-group v-model="form.flag">-->
<!-- <el-radio :label="1">启用</el-radio>-->
<!-- <el-radio :label="0">停用</el-radio>-->
<!-- </el-radio-group>-->
<!-- <el-radio v-model="form.flag" label="1">启用</el-radio>
<el-radio v-model="form.flag" label="0">停用</el-radio>
</el-form-item> -->
<!-- <el-form-item label="设备批次"> -->
<!-- <el-checkbox v-model="menuExpand" @change="handleCheckedTreeExpand($event, 'menu')">展开/折叠</el-checkbox>-->
<!-- <el-checkbox v-model="menuNodeAll" @change="handleCheckedTreeNodeAll($event, 'menu')">全选/全不选</el-checkbox>-->
<!-- <el-checkbox v-model="form.menuCheckStrictly" @change="handleCheckedTreeConnect($event, 'menu')">父子联动</el-checkbox>-->
<!-- <el-tree
ref="menu"
class="tree-border"
:data="menuOptions"
show-checkbox
node-key="id"
check-strictly
empty-text="加载中,请稍后"
:props="defaultProps"
@check-change="handleMenuCheckChange"
/>
</el-form-item> -->
<el-form-item label="备注">
<el-input v-model.trim="form.remark" maxlength="200" show-word-limit type="textarea" placeholder="请输入内容" />
<el-form-item label="位置" prop="location">
<el-input v-model.trim="form.location" show-word-limit :maxlength="30" placeholder="请输入设备编码" />
</el-form-item>
<el-form-item label="厚度" prop="ply">
<el-input v-model.trim="form.ply" show-word-limit :maxlength="30" placeholder="请输入设备编码" />
</el-form-item>
<el-form-item label="操作员" prop="createBy">
<el-input v-model.trim="form.createBy" :maxlength="30" show-word-limit placeholder="请输入创建人" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancel">取 消</el-button>
<el-button type="primary" @click="submitForm">提 交</el-button>
<el-button type="primary" @click="submitForm">确 定</el-button>
</div>
</el-dialog>
<!-- TODO: 单项详情信息表单配置 -->
<el-dialog class="aboutSingleDetails" :title="title" :visible.sync="openDetails" width="700px" append-to-body>
<el-form ref="formDetails" :model="singleDetails" size="small" label-width="90px">
<el-form-item label="名称:" prop="deviceName">
<el-input v-model.trim="singleDetails.deviceName" :readonly="isReadOnly" />
</el-form-item>
<el-form-item label="设备编码:" prop="deviceId">
<el-input v-model.trim="singleDetails.deviceId" :readonly="isReadOnly" />
</el-form-item>
<el-form-item label="LOT: " prop="LOT">
<el-input v-model.trim="singleDetails.LOT" :readonly="isReadOnly" />
</el-form-item>
<el-form-item label="位置:" prop="location">
<el-input v-model.trim="singleDetails.location" :readonly="isReadOnly" />
</el-form-item>
<el-form-item label="位置:" prop="ply">
<el-input v-model.trim="singleDetails.ply" :readonly="isReadOnly" />
</el-form-item>
<el-form-item label="创建时间:" prop="createTime">
<el-input v-model.trim="singleDetails.createTime" :readonly="isReadOnly" />
</el-form-item>
<el-form-item label="创建人:" prop="createBy">
<el-input v-model.trim="singleDetails.createBy" :readonly="isReadOnly" />
</el-form-item>
<el-form-item label="状态" prop="state">
<el-input v-model.trim="singleDetails.state" :readonly="isReadOnly" />
</el-form-item>
</el-form>
</el-dialog>
</div>
</template>
<script>
import { listRole, getRole, delRole, addRole, updateRole, exportRole, dataScope, changeRoleStatus } from '@/api/system/role'
import { roleMenuTreeselectMC, treeselect as menuTreeselect, roleMenuTreeselect } from '@/api/system/menu'
import { treeselect as deptTreeselect, roleDeptTreeselect } from '@/api/system/dept'
// import { getRolesByInsId } from '../../../api/businessManage/template'
// TODO: 导入外部已经封装好的button组件
import Coolbutton from '@/components/coolbutton'
export default {
name: 'Role',
......@@ -176,25 +165,18 @@ export default {
nameParent: '删除',
resetName: '重置',
addName: '新增',
application: '申请领用',
exportName: '导出',
application:'申请领用',
updataName: '修改',
audit:'审核',
size: 'mini',
smallSize: 'small',
delicon: 'el-icon-delete',
addIcon: 'el-icon-plus',
exportIcon: 'el-icon-download',
resetIcon: '',
haspermi: ['sys:user:delete'],
resetHaspermi: ['sys:user:resetPwd'],
updateHaspermi: ['sys:role:update'],
addHaspermi: ['sys:role:add'],
exportHaspermi: ['sys:role:export'],
// TODO: 控制只读
isReadOnly: true,
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
......@@ -207,8 +189,8 @@ export default {
title: '',
// 是否显示弹出层
open: false,
// 是否显示弹出层(数据权限
openDataScope: false,
// 是否显示弹出层(数据详情
openDetails: false,
// 日期范围
// dateRange: [],
// 菜单表格数据
......@@ -217,90 +199,101 @@ export default {
menuNodeAll: false,
deptExpand: true,
deptNodeAll: false,
// 状态数据字典
statusOptions: [
{
dictLabel: '启用',
dictValue: '1'
},
{
dictLabel: '停用',
dictValue: '0'
}
],
// 数据范围选项
dataScopeOptions: [
{
value: '1',
label: '全部数据权限'
},
{
value: '2',
label: '自定数据权限'
},
{
value: '3',
label: '本部门数据权限'
},
{
value: '4',
label: '本部门及以下数据权限'
},
{
value: '5',
label: '仅本人数据权限'
}
],
// 菜单列表
menuOptions: [],
// 部门列表
tOptions: [],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
roleName: undefined,
roleKey: undefined,
deviceName: undefined,
deviceId: undefined,
LOT: undefined,
location: undefined,
ply: undefined,
state: undefined,
flag: undefined
},
// 表单参数
defaultProps: {},
// TODO: 表单参数
form: {
deviceName: '',
deviceId: '',
LOT: '',
location:'',
ply:'',
state:'',
flag: '1',
remark: '',
createTime: new Date(),
updataTime: new Date(),
createBy: ''
},
// TODO: 表单初始参数
formReset: {
deviceName: '',
deviceId: '',
LOT: '',
location:'',
ply:'',
state:'',
state:'',
flag: '1',
createTime: new Date(),
updataTime: new Date(),
createBy: ''
},
// TODO: 表单里的单项详情参数
singleDetails: {
deviceName: '',
deviceId: '',
LOT: '',
location:'',
ply:'',
state:'',
flag: '1',
createTime: new Date(),
updataTime: new Date(),
createBy: ''
},
defaultProps: {
children: 'children',
label: 'label'
// TODO: 模拟测试数据
simulateDeviceList: [{
deviceName: '设备1', deviceId: '0001', flag: 1, LOT: '0001', location:'XXX', ply:'YYY', createTime: new Date(), updataTime: new Date(), createBy: 'admin',state:'驳回',
}, {
deviceName: '设备2', deviceId: '0002', flag: 2, LOT: '0002', location:'XXX', ply:'YYY', createTime: new Date(), updataTime: new Date(), createBy: 'admin' ,state:'驳回',
},{
deviceName: '设备3', deviceId: '0003', flag: 2, LOT: '0003', location:'XXX', ply:'YYY', createTime: new Date(), updataTime: new Date(), createBy: 'admin' ,state:'驳回',
},{
deviceName: '设备4', deviceId: '0004', flag: 2, LOT: '0004', location:'XXX', ply:'YYY', createTime: new Date(), updataTime: new Date(), createBy: 'admin' ,state:'驳回',
},{
deviceName: '设备5', deviceId: '0005', flag: 2, LOT: '0005', location:'XXX', ply:'YYY', createTime: new Date(), updataTime: new Date(), createBy: 'admin' ,state:'待审核',
},{
deviceName: '设备6', deviceId: '0006', flag: 2, LOT: '0006', location:'XXX', ply:'YYY', createTime: new Date(), updataTime: new Date(), createBy: 'admin' ,state:'待审核',
},{
deviceName: '设备7', deviceId: '0007', flag: 2, LOT: '0007', location:'XXX', ply:'YYY', createTime: new Date(), updataTime: new Date(), createBy: 'admin' ,state:'待审核',
},{
deviceName: '设备8', deviceId: '0008', flag: 2, LOT: '0008', location:'XXX', ply:'YYY', createTime: new Date(), updataTime: new Date(), createBy: 'admin' ,state:'待审核',
},{
deviceName: '设备9', deviceId: '0009', flag: 2, LOT: '0009', location:'XXX', ply:'YYY', createTime: new Date(), updataTime: new Date(), createBy: 'admin' ,state:'通过',
},{
deviceName: '设备10', deviceId: '00010', flag: 2, LOT: '0010', location:'XXX', ply:'YYY', createTime: new Date(), updataTime: new Date(), createBy: 'admin' ,state:'通过',
},
],
// 表单校验
rules: {
roleName: [
deviceName: [
{ required: true, message: '请输入设备名称', trigger: 'blur' }
],
roleKey: [
{ required: true, message: '请输入设备来源', trigger: 'blur' }
deviceId: [
{ required: true, message: '请输入设备编码', trigger: 'blur' }
],
roleSort: [
{ required: true, message: '请输入设备排序', trigger: 'blur' }
LOT: [
{ required: true, message: '请输入LOT', trigger: 'blur' }
],
createBy: [
{ required: true, message: '请输入申请人', trigger: 'blur' }
]
},
deptOptions: [],
tableData: [{
name: 'XXXXXXX',
id: 'XXXXXXX',
lot: 'XXXXXXXXX',
loction: 'XXXXXXX',
ply: 'XXXXXXX',
creatTime: 'XXXXXXX',
creatMan: 'XXXXXXX'
}, {
name: 'XXXXXXX',
id: 'XXXXXXX',
lot: 'XXXXXXXXX',
loction: 'XXXXXXX',
ply: 'XXXXXXX',
creatTime: 'XXXXXXX',
creatMan: 'XXXXXXX'
}]
deptOptions: []
}
},
/** 路由离开前存储筛选条件*/
......@@ -320,338 +313,140 @@ export default {
this.queryParams = { ...param }
}
this.getList()
// this.getDicts(dictCons['NORMAL_DISABLE']).then(response => {
// this.statusOptions = response.data;
// });
},
methods: {
/** 查询角色列表 */
getList() {
this.loading = true
listRole(this.queryParams).then(
response => {
this.roleList = response.rows
this.total = response.total
this.loading = false
}
)
},
/** 查询菜单树结构 */
getMenuTreeselect() {
menuTreeselect().then(response => {
this.menuOptions = response.data
})
},
/** 查询菜单列表 */
getMenuList(roleId) {
roleMenuTreeselectMC(roleId).then(response => {
this.menuList = this.handleTree(response.data.menus, 'businessId')
this.roleList = this.simulateDeviceList
console.log(this.roleList)
this.loading = false
})
},
/** 查询部门树结构 */
getDeptTreeselect() {
deptTreeselect().then(response => {
this.deptOptions = response.data
})
},
// 树状图节点点击选中事件
handleMenuCheckChange(data, check, subCheck) { // data为选中节点信息,check选中状态
if (data.children !== undefined && data.children !== null) { // 是否包含子节点
this.checkNode(data.children, check) // 调用checkNode方法
}
// // 获取所有被选中的节点信息
// const nodes = this.$refs.menu.getCheckedNodes(false, false)
// // 将获取到的信息赋值(根据自己的需求)
// this.custGroupDesc = nodes.map(item => item.CN_NAME)
// this.searchForm.custGroup = nodes.map(item => item.code)
},
// 选中所有下级节点
checkNode(data, check) {
// 遍历所有下级节点信息
data.forEach(item => {
// 通过节点信息设置选中状态
this.$refs.menu.setChecked(item, check, false)
// 是否包含下级节点,包含下级节点则选中所有下级节点
if (item.children !== undefined) {
this.checkNode(item.children, check)
}
})
},
// 所有菜单节点数据
getMenuAllCheckedKeys() {
// 目前被选中的菜单节点
const checkedKeys = this.$refs.menu.getHalfCheckedKeys()
// 半选中的菜单节点
const halfCheckedKeys = this.$refs.menu.getCheckedKeys()
checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys)
return checkedKeys
},
// 所有部门节点数据
getDeptAllCheckedKeys() {
// 目前被选中的部门节点
const checkedKeys = this.$refs.dept.getHalfCheckedKeys()
// // 半选中的部门节点
const halfCheckedKeys = this.$refs.dept.getCheckedKeys()
checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys)
return this.$refs.dept.getCheckedKeys()
},
/** 根据角色ID查询菜单树结构 */
getRoleMenuTreeselect(roleId) {
return roleMenuTreeselect(roleId).then(response => {
this.menuOptions = response.data.menus
return response
})
},
/** 根据角色ID和菜单ID查询部门树结构 */
getRoleDeptTreeselect(roleId, menuId) {
return roleDeptTreeselect(roleId, menuId).then(response => {
this.form.deptCheckStrictly = response.data.deptCheckStrictly
this.deptOptions = response.data.depts
this.form.dataScope = this.dataScopeOptions[response.data.dataScope - 1].value
return response
})
},
// 角色状态修改
handleStatusChange(row) {
const text = row.flag === '1' ? '启用' : '停用'
this.$confirm('是否确认操作?', '警告', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(function() {
return changeRoleStatus(row.businessId, row.flag)
}).then(() => {
this.$message({
message: text + '成功',
type: 'success'
})
}).catch(function() {
row.flag = row.flag === '0' ? '1' : '0'
})
},
// 取消按钮
cancel() {
this.open = false
this.reset()
},
// 取消按钮(数据权限)
cancelDataScope() {
this.openDataScope = false
this.reset()
},
// 表单重置
reset() {
if (this.$refs.menu !== undefined) {
this.$refs.menu.setCheckedKeys([])
}
this.menuExpand = false
this.menuNodeAll = false
this.deptExpand = true
this.deptNodeAll = false
// TODO: 将模拟数据的空对象赋值给表单对象,达成清空填写表单的效果
this.form = {
roleId: undefined,
businessId: undefined,
roleName: undefined,
roleKey: undefined,
roleSort: 0,
deviceName: '',
deviceId: '',
location:'',
ply:'',
state:'',
flag: '1',
menuIds: [],
menuName: undefined,
deptIds: [],
menuCheckStrictly: false,
deptCheckStrictly: false,
remark: undefined
createTime: new Date(),
updataTime: new Date(),
createBy: ''
}
this.resetForm('form')
},
/** 查询按钮操作 */
/** TODO: 查询按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery() {
// this.dateRange = []
this.resetForm('queryForm')
this.handleQuery()
},
/** TODO: 重置按钮操作 */
resetQuery() {},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.roleId)
this.single = selection.length !== 1
this.multiple = !selection.length
},
// // 树权限(父子联动)
// handleCheckedTreeConnect(value, type) {
// if (type === 'menu') {
// this.form.menuCheckStrictly = !!value
// } else if (type === 'dept') {
// this.form.deptCheckStrictly = !!value
// }
// },
// 树权限(全选/全不选)
handleCheckedTreeNodeAll(value, type) {
if (type === 'menu') {
this.$refs.menu.setCheckedNodes(value ? this.menuOptions : [])
} else if (type === 'dept') {
this.$refs.dept.setCheckedNodes(value ? this.deptOptions : [])
}
},
// 树权限(展开/折叠)
handleCheckedTreeExpand(value, type) {
if (type === 'menu') {
const treeList = this.menuOptions
for (let i = 0; i < treeList.length; i++) {
this.$refs.menu.store.nodesMap[treeList[i].id].expanded = value
}
} else if (type === 'dept') {
const treeList = this.deptOptions
for (let i = 0; i < treeList.length; i++) {
this.$refs.dept.store.nodesMap[treeList[i].id].expanded = value
}
}
},
/** 新增按钮操作 */
handleSelectionChange(selection) {},
/** TODO: 新增按钮操作 */
handleAdd() {
// TODO: 初始化新增对话框的状态
this.reset()
this.getMenuTreeselect()
this.open = true
this.title = '添加设备'
this.title = '申请领用设备'
this.open = !this.open
},
/** 申请领用按钮操作 */
handleApplication(){
this.reset()
this.getMenuTreeselect()
this.open = true
this.title = '申请'
// TODO: 获取所选行详情信息操作
handleDetail(row) {
this.singleDetails = this.formReset
this.singleDetails = row
this.title = '详情信息'
this.openDetails = !this.openDetails
},
/** 修改按钮操作 */
/** TODO: 修改按钮操作 */
handleUpdate(row) {
this.reset()
const roleId = row.businessId || this.ids
const roleMenu = this.getRoleMenuTreeselect(roleId)
getRole(roleId).then(response => {
this.form = response.data
this.open = true
this.getMenuTreeselect(roleId)
this.$nextTick(() => {
roleMenu.then(res => {
this.$refs.menu.setCheckedKeys(res.data.checkedKeys)
})
})
this.title = '修改申请'
})
const upddeviceName = row.deviceName
for (const pd of this.simulateDeviceList) {
if (pd.deviceName === upddeviceName) {
this.form = pd
}
}
this.open = true
},
/** 分配数据权限操作 选择菜单 */
handleMenu(row) {
/** TODO: 修改或增加list列表里的数据 */
submitForm: function() {
this.$refs['form'].validate(valid => {
if (valid) {
// TODO: 模拟测试数据的修改,可删除
for (const p of this.simulateDeviceList) {
if (p.deviceName === this.form.deviceName) {
this.simulateDeviceList = this.simulateDeviceList.map(obj =>
obj.deviceName === this.form.deviceName ? this.form : obj
)
this.msgSuccess('申请成功')
this.getList()
this.reset()
const roleId = row.businessId || this.ids
this.getMenuList(roleId) // 查询菜单列表树形显示
getRole(roleId).then(response => {
this.form = response.data
this.openDataScope = true
this.title = '分配数据权限'
})
},
/** 分配数据权限操作 */
handleDataScope(row) {
this.deptOptions = []
this.form.dataScope = undefined
const roleId = this.form.businessId
this.form.menuId = row.businessId
this.form.menuName = row.menuName
const roleDeptTreeselect = this.getRoleDeptTreeselect(roleId, this.form.menuId)
this.$nextTick(() => {
roleDeptTreeselect.then(res => {
this.$refs.dept.setCheckedKeys(res.data.checkedKeys)
})
})
this.title = '分配数据权限'
},
/** 提交按钮 */
submitForm() {
this.$message({
message: '提交成功',
type: 'success'
});
this.open = false
// this.$refs['form'].validate(valid => {
// if (valid) {
// this.form.menuCheckStrictly = false
// if (this.form.businessId !== undefined) {
// this.form.menuIds = this.getMenuAllCheckedKeys()
// updateRole(this.form).then(response => {
// this.msgSuccess('修改成功')
// this.open = false
// this.getList()
// })
// } else {
// this.form.menuIds = this.getMenuAllCheckedKeys()
// addRole(this.form).then(response => {
// this.msgSuccess('新增成功')
// this.open = false
// this.getList()
// })
// }
// }
// })
},
/** 提交按钮(数据权限) */
submitDataScope: function() {
if (this.form.businessId !== undefined && this.form.menuId !== undefined) {
this.form.deptIds = this.getDeptAllCheckedKeys()
dataScope(this.form).then(response => {
this.msgSuccess('修改成功')
this.openDataScope = false
this.open = !this.open
return
} else {
if (this.form !== undefined && this.form !== null) {
this.simulateDeviceList.push(this.form)
this.msgSuccess('申请成功')
this.getList()
this.reset()
this.open = !this.open
return
}
}
}
}
})
},
/** TODO: 关于模拟数据的 删除list数组所调用的删除方法,封装的函数如下 */
delDevice(delDeviceName) {
let tip = false
for (const pd0 of this.simulateDeviceList) {
console.log('This is pd0:', pd0)
if (pd0.deviceName === delDeviceName) {
this.simulateDeviceList = this.simulateDeviceList.filter(item => item.deviceName !== delDeviceName)
tip = true
break
}
}
return tip
},
/** 删除按钮操作 */
/** TODO:删除按钮操作 */
handleDelete(row) {
const roleIds = row.businessId || this.ids
this.$confirm('是否确认操作?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(function() {
return delRole(roleIds)
}).then(() => {
return this.delDevice(row.deviceName)
}).then(() => {
this.getList()
this.$message({
message: '删除成功',
type: 'success'
})
}).catch(function() {
})
},
/** 导出按钮操作 */
handleExport() {
const queryParams = this.queryParams
this.$confirm('是否确认操作?', '警告', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(function() {
return exportRole(queryParams).then(response => {
const blob = new Blob([response])
const downloadElement = document.createElement('a')
const href = window.URL.createObjectURL(blob)// 创建下载的链接
downloadElement.href = href
downloadElement.download = '角色信息' + '.xls' // 下载后文件名
document.body.appendChild(downloadElement)
downloadElement.click()// 点击下载
document.body.removeChild(downloadElement)// 下载完成移除元素
window.URL.revokeObjectURL(href)// 释放掉blob对象
// this.download(response.msg);
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
})
})
}
}
}
</script>
<style lang="scss" scoped>
.app-container {
font-size: 18px;
padding: 0;
......@@ -676,16 +471,20 @@ export default {
height: 12em;
width: 4px;
}
.demo-table-expand {
font-size: 0;
}
.demo-table-expand label {
width: 90px;
color: #99a9bf;
.aboutSingleDetails{
.el-form-item{
.el-input >>> .el-input__inner {
-webkit-appearance: none;
background-color: #FFF;
background-image: none;
border-radius: 4px;
border: 0;
width: 100%;
}
.demo-table-expand .el-form-item {
margin-right: 0;
margin-bottom: 0;
width: 50%;
}
}
</style>
<template>
<div class="app-container">
<!-- TODO: 基础设备管理-->
<el-form ref="queryForm" style="padding: 0 0 0 10px" :model="queryParams" :inline="true">
<el-form-item label="设备名称" prop="roleName">
<el-input
v-model="queryParams.roleName"
v-model="queryParams.deviceName"
placeholder="请输入设备名称"
clearable
:maxlength="30"
......@@ -12,10 +14,20 @@
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="设备来源" prop="roleKey">
<el-form-item label="设备编码" prop="roleKey">
<el-input
v-model="queryParams.roleKey"
placeholder="请输入设备来源"
v-model="queryParams.deviceId"
placeholder="请输入设备编码"
clearable
size="small"
style="width: 150px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="LOT" >
<el-input
v-model="queryParams.LOT"
placeholder="请输入LOT"
clearable
size="small"
style="width: 150px"
......@@ -25,146 +37,145 @@
<el-form-item>
<el-button type="primary" size="small" icon="el-icon-search" @click="handleQuery">查询</el-button>
</el-form-item>
<div style="float: right">
<el-form-item>
<coolbutton style="padding: 8px 7px;" :type="typePrimary" :name="application" :size="smallSize" :icon="addIcon" @btn-click="handleApplication" />
<coolbutton style="padding: 8px 7px;" :type="typePrimary" :name="application" :size="smallSize" :icon="addIcon" @btn-click="handleAdd" />
</el-form-item>
</div>
</el-form>
<div class="placeholder" />
<!-- TODO: 中间的分隔符号 -->
<div style="padding:5px 10px">
<!-- TODO: 以下为基础设备管理列表 -->
<div class="mb12 font-small-bold">设备领用列表</div>
<el-table v-loading="loading" border :data="roleList" @selection-change="handleSelectionChange">
<el-table-column type="index" label="序号" width="50" />
<el-table-column label="名称" prop="roleName" :show-overflow-tooltip="true">
<!-- <el-table-column label="设备名称" prop="deviceName" :show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.roleName || '-' }}
{{ scope.row.deviceName || '-' }}
</template>
</el-table-column>
<el-table-column label="编码" prop="roleKey">
</el-table-column> -->
<el-table-column label="设备编码" prop="deviceId">
<template slot-scope="scope">
{{ scope.row.roleKey || '-' }}
{{ scope.row.deviceId || '-' }}
</template>
</el-table-column>
<el-table-column label="LOT" prop="roleSort">
<el-table-column label="LOT" prop="LOT">
<template slot-scope="scope">
{{ scope.row.roleSort || '-' }}
{{ scope.row.deviceId || '-' }}
</template>
</el-table-column>
<el-table-column label="位置" prop="roleSort">
<el-table-column label="位置" prop="location">
<template slot-scope="scope">
{{ scope.row.roleSort || '-' }}
{{ scope.row.location || '-' }}
</template>
</el-table-column>
<el-table-column label="厚度" prop="roleSort">
<el-table-column label="厚度" prop="ply">
<template slot-scope="scope">
{{ scope.row.roleSort || '-' }}
{{ scope.row.ply || '-' }}
</template>
</el-table-column>
<el-table-column label="状态" prop="roleSort">
<template slot-scope="scope" >
<span style="color: red;">{{ "驳回" }}</span>
<el-table-column label="操作员" prop="createBy">
<template slot-scope="scope">
{{ scope.row.createBy || '-' }}
</template>
</el-table-column>
<el-table-column label="创建时间" :show-overflow-tooltip="true" align="center" prop="createTime">
<template slot-scope="scope">
<span>{{ scope.row.createDate | transformDateByFormat('YYYY-MM-DD HH:mm') }}</span>
<span>{{ scope.row.createTime | transformDateByFormat('YYYY-MM-DD HH:mm') }}</span>
</template>
</el-table-column>
<el-table-column label="创建人" prop="roleSort">
<el-table-column label="状态" prop="state">
<template slot-scope="scope">
{{ scope.row.roleSort || '-' }}
{{ scope.row.state || '-' }}
</template>
</el-table-column>
<el-table-column label="操作" class-name="small-padding fixed-width" width="140px">
<el-table-column label="操作" class-name="small-padding fixed-width" width="240px">
<template slot-scope="scope">
<!-- <el-button-->
<!-- v-hasPermi="['sys:role:update']"-->
<!-- size="mini"-->
<!-- type="text"-->
<!-- style="color: #49cec9"-->
<!-- @click="handleUpdate(scope.row)"-->
<!-- >修改</el-button>-->
<coolbutton style="color: #49cec9" :type="typeParent" :name="updataName" :size="size" :haspermi="updateHaspermi" @btn-click="handleUpdate(scope.row)" />
<!-- <el-button-->
<!-- v-hasPermi="['sys:role:update']"-->
<!-- size="mini"-->
<!-- type="text"-->
<!-- icon="el-icon-circle-check"-->
<!-- @click="handleMenu(scope.row)"-->
<!-- >数据权限</el-button>-->
<!-- <el-button
size="mini"
type="text"
@click="handleDelete(scope.row)"
>删除</el-button> -->
<el-button v-if="scope.row.state !== '驳回'" type="typeParent" :size="size" @click="handleDetail(scope.row)">
详情
</el-button>
<el-button v-if="scope.row.state !== ' '" type="typeParent" :size="size" @click="handleUpdate(scope.row)">
{{ updataName }}
</el-button>
<el-button v-if="scope.row.state !== ' '" type="typeParent" :size="size" @click="handleDelete(scope.row)"
>删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<el-pagination
background
layout="prev, pager, next"
:total="1000">
</el-pagination>
<!-- 添加或修改设备配置对话框 -->
<!-- TODO: 添加或修改设备配置对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="名称" prop="roleName">
<el-input v-model.trim="form.roleName" show-word-limit :maxlength="30" placeholder="请输入设备名称" />
<el-form-item label="设备名称" prop="deviceName">
<el-input v-model.trim="form.deviceName" show-word-limit :maxlength="30" placeholder="请输入设备名称" />
</el-form-item>
<el-form-item label="编码" prop="roleKey">
<el-input v-model.trim="form.roleKey" show-word-limit :maxlength="30" placeholder="请输入设备编码" />
<el-form-item label="设备编码" prop="deviceId">
<el-input v-model.trim="form.deviceId" show-word-limit :maxlength="30" placeholder="请输入设备编码" />
</el-form-item>
<el-form-item label="LOT" prop="roleSort">
<el-input v-model.trim="form.roleSort" show-word-limit :maxlength="30" placeholder="请输入设备LOT" />
<el-form-item label="LOT" prop="LOT">
<el-input v-model.trim="form.LOT" show-word-limit :maxlength="30" placeholder="请输入LOT" />
</el-form-item>
<!-- <el-form-item label="状态"> -->
<!-- <el-radio-group v-model="form.flag">-->
<!-- <el-radio :label="1">启用</el-radio>-->
<!-- <el-radio :label="0">停用</el-radio>-->
<!-- </el-radio-group>-->
<!-- <el-radio v-model="form.flag" label="1">启用</el-radio>
<el-radio v-model="form.flag" label="0">停用</el-radio>
</el-form-item> -->
<!-- <el-form-item label="设备批次"> -->
<!-- <el-checkbox v-model="menuExpand" @change="handleCheckedTreeExpand($event, 'menu')">展开/折叠</el-checkbox>-->
<!-- <el-checkbox v-model="menuNodeAll" @change="handleCheckedTreeNodeAll($event, 'menu')">全选/全不选</el-checkbox>-->
<!-- <el-checkbox v-model="form.menuCheckStrictly" @change="handleCheckedTreeConnect($event, 'menu')">父子联动</el-checkbox>-->
<!-- <el-tree
ref="menu"
class="tree-border"
:data="menuOptions"
show-checkbox
node-key="id"
check-strictly
empty-text="加载中,请稍后"
:props="defaultProps"
@check-change="handleMenuCheckChange"
/>
</el-form-item> -->
<el-form-item label="备注">
<el-input v-model.trim="form.remark" maxlength="200" show-word-limit type="textarea" placeholder="请输入内容" />
<el-form-item label="位置" prop="location">
<el-input v-model.trim="form.location" show-word-limit :maxlength="30" placeholder="请输入设备编码" />
</el-form-item>
<el-form-item label="厚度" prop="ply">
<el-input v-model.trim="form.ply" show-word-limit :maxlength="30" placeholder="请输入设备编码" />
</el-form-item>
<el-form-item label="操作员" prop="createBy">
<el-input v-model.trim="form.createBy" :maxlength="30" show-word-limit placeholder="请输入创建人" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancel">取 消</el-button>
<el-button type="primary" @click="submitForm">提 交</el-button>
<el-button type="primary" @click="submitForm">确 定</el-button>
</div>
</el-dialog>
<!-- TODO: 单项详情信息表单配置 -->
<el-dialog class="aboutSingleDetails" :title="title" :visible.sync="openDetails" width="700px" append-to-body>
<el-form ref="formDetails" :model="singleDetails" size="small" label-width="90px">
<el-form-item label="名称:" prop="deviceName">
<el-input v-model.trim="singleDetails.deviceName" :readonly="isReadOnly" />
</el-form-item>
<el-form-item label="设备编码:" prop="deviceId">
<el-input v-model.trim="singleDetails.deviceId" :readonly="isReadOnly" />
</el-form-item>
<el-form-item label="LOT: " prop="LOT">
<el-input v-model.trim="singleDetails.LOT" :readonly="isReadOnly" />
</el-form-item>
<el-form-item label="位置:" prop="location">
<el-input v-model.trim="singleDetails.location" :readonly="isReadOnly" />
</el-form-item>
<el-form-item label="位置:" prop="ply">
<el-input v-model.trim="singleDetails.ply" :readonly="isReadOnly" />
</el-form-item>
<el-form-item label="创建时间:" prop="createTime">
<el-input v-model.trim="singleDetails.createTime" :readonly="isReadOnly" />
</el-form-item>
<el-form-item label="创建人:" prop="createBy">
<el-input v-model.trim="singleDetails.createBy" :readonly="isReadOnly" />
</el-form-item>
<el-form-item label="状态" prop="state">
<el-input v-model.trim="singleDetails.state" :readonly="isReadOnly" />
</el-form-item>
</el-form>
</el-dialog>
</div>
</template>
<script>
import { listRole, getRole, delRole, addRole, updateRole, exportRole, dataScope, changeRoleStatus } from '@/api/system/role'
import { roleMenuTreeselectMC, treeselect as menuTreeselect, roleMenuTreeselect } from '@/api/system/menu'
import { treeselect as deptTreeselect, roleDeptTreeselect } from '@/api/system/dept'
// import { getRolesByInsId } from '../../../api/businessManage/template'
// TODO: 导入外部已经封装好的button组件
import Coolbutton from '@/components/coolbutton'
export default {
name: 'Role',
......@@ -177,8 +188,7 @@ export default {
nameParent: '删除',
resetName: '重置',
addName: '新增',
application: '申请领用',
exportName: '导出',
application:'申请领用',
updataName: '修改',
size: 'mini',
smallSize: 'small',
......@@ -186,15 +196,10 @@ export default {
addIcon: 'el-icon-plus',
exportIcon: 'el-icon-download',
resetIcon: '',
haspermi: ['sys:user:delete'],
resetHaspermi: ['sys:user:resetPwd'],
updateHaspermi: ['sys:role:update'],
addHaspermi: ['sys:role:add'],
exportHaspermi: ['sys:role:export'],
// TODO: 控制只读
isReadOnly: true,
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
......@@ -207,8 +212,8 @@ export default {
title: '',
// 是否显示弹出层
open: false,
// 是否显示弹出层(数据权限
openDataScope: false,
// 是否显示弹出层(数据详情
openDetails: false,
// 日期范围
// dateRange: [],
// 菜单表格数据
......@@ -217,70 +222,98 @@ export default {
menuNodeAll: false,
deptExpand: true,
deptNodeAll: false,
// 状态数据字典
statusOptions: [
{
dictLabel: '启用',
dictValue: '1'
},
{
dictLabel: '停用',
dictValue: '0'
}
],
// 数据范围选项
dataScopeOptions: [
{
value: '1',
label: '全部数据权限'
},
{
value: '2',
label: '自定数据权限'
},
{
value: '3',
label: '本部门数据权限'
},
{
value: '4',
label: '本部门及以下数据权限'
},
{
value: '5',
label: '仅本人数据权限'
}
],
// 菜单列表
menuOptions: [],
// 部门列表
tOptions: [],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
roleName: undefined,
roleKey: undefined,
deviceName: undefined,
deviceId: undefined,
LOT: undefined,
location: undefined,
ply: undefined,
state: undefined,
flag: undefined
},
// 表单参数
defaultProps: {},
// TODO: 表单参数
form: {
},
defaultProps: {
children: 'children',
label: 'label'
deviceName: '',
deviceId: '',
LOT: '',
location:'',
ply:'',
state:'',
flag: '1',
remark: '',
createTime: new Date(),
updataTime: new Date(),
createBy: ''
},
// TODO: 表单初始参数
formReset: {
deviceName: '',
deviceId: '',
LOT: '',
location:'',
ply:'',
state:'',
state:'',
flag: '1',
createTime: new Date(),
updataTime: new Date(),
createBy: ''
},
// TODO: 表单里的单项详情参数
singleDetails: {
deviceName: '',
deviceId: '',
LOT: '',
location:'',
ply:'',
state:'',
flag: '1',
createTime: new Date(),
updataTime: new Date(),
createBy: ''
},
// TODO: 模拟测试数据
simulateDeviceList: [{
deviceName: '设备1', deviceId: '0001', flag: 1, LOT: '0001', location:'XXX', ply:'YYY', createTime: new Date(), updataTime: new Date(), createBy: 'admin',state:'驳回',
}, {
deviceName: '设备2', deviceId: '0002', flag: 2, LOT: '0002', location:'XXX', ply:'YYY', createTime: new Date(), updataTime: new Date(), createBy: 'admin' ,state:'驳回',
},{
deviceName: '设备3', deviceId: '0003', flag: 2, LOT: '0003', location:'XXX', ply:'YYY', createTime: new Date(), updataTime: new Date(), createBy: 'admin' ,state:'驳回',
},{
deviceName: '设备4', deviceId: '0004', flag: 2, LOT: '0004', location:'XXX', ply:'YYY', createTime: new Date(), updataTime: new Date(), createBy: 'admin' ,state:'驳回',
},{
deviceName: '设备5', deviceId: '0005', flag: 2, LOT: '0005', location:'XXX', ply:'YYY', createTime: new Date(), updataTime: new Date(), createBy: 'admin' ,state:'待审核',
},{
deviceName: '设备6', deviceId: '0006', flag: 2, LOT: '0006', location:'XXX', ply:'YYY', createTime: new Date(), updataTime: new Date(), createBy: 'admin' ,state:'待审核',
},{
deviceName: '设备7', deviceId: '0007', flag: 2, LOT: '0007', location:'XXX', ply:'YYY', createTime: new Date(), updataTime: new Date(), createBy: 'admin' ,state:'待审核',
},{
deviceName: '设备8', deviceId: '0008', flag: 2, LOT: '0008', location:'XXX', ply:'YYY', createTime: new Date(), updataTime: new Date(), createBy: 'admin' ,state:'待审核',
},{
deviceName: '设备9', deviceId: '0009', flag: 2, LOT: '0009', location:'XXX', ply:'YYY', createTime: new Date(), updataTime: new Date(), createBy: 'admin' ,state:'通过',
},{
deviceName: '设备10', deviceId: '00010', flag: 2, LOT: '0010', location:'XXX', ply:'YYY', createTime: new Date(), updataTime: new Date(), createBy: 'admin' ,state:'通过',
},
],
// 表单校验
rules: {
roleName: [
deviceName: [
{ required: true, message: '请输入设备名称', trigger: 'blur' }
],
roleKey: [
{ required: true, message: '请输入设备来源', trigger: 'blur' }
deviceId: [
{ required: true, message: '请输入设备编码', trigger: 'blur' }
],
LOT: [
{ required: true, message: '请输入LOT', trigger: 'blur' }
],
roleSort: [
{ required: true, message: '请输入设备排序', trigger: 'blur' }
createBy: [
{ required: true, message: '请输入申请人', trigger: 'blur' }
]
},
deptOptions: []
......@@ -303,338 +336,140 @@ export default {
this.queryParams = { ...param }
}
this.getList()
// this.getDicts(dictCons['NORMAL_DISABLE']).then(response => {
// this.statusOptions = response.data;
// });
},
methods: {
/** 查询角色列表 */
getList() {
this.loading = true
listRole(this.queryParams).then(
response => {
this.roleList = response.rows
this.total = response.total
this.roleList = this.simulateDeviceList
console.log(this.roleList)
this.loading = false
}
)
},
/** 查询菜单树结构 */
getMenuTreeselect() {
menuTreeselect().then(response => {
this.menuOptions = response.data
})
},
/** 查询菜单列表 */
getMenuList(roleId) {
roleMenuTreeselectMC(roleId).then(response => {
this.menuList = this.handleTree(response.data.menus, 'businessId')
this.loading = false
})
},
/** 查询部门树结构 */
getDeptTreeselect() {
deptTreeselect().then(response => {
this.deptOptions = response.data
})
},
// 树状图节点点击选中事件
handleMenuCheckChange(data, check, subCheck) { // data为选中节点信息,check选中状态
if (data.children !== undefined && data.children !== null) { // 是否包含子节点
this.checkNode(data.children, check) // 调用checkNode方法
}
// // 获取所有被选中的节点信息
// const nodes = this.$refs.menu.getCheckedNodes(false, false)
// // 将获取到的信息赋值(根据自己的需求)
// this.custGroupDesc = nodes.map(item => item.CN_NAME)
// this.searchForm.custGroup = nodes.map(item => item.code)
},
// 选中所有下级节点
checkNode(data, check) {
// 遍历所有下级节点信息
data.forEach(item => {
// 通过节点信息设置选中状态
this.$refs.menu.setChecked(item, check, false)
// 是否包含下级节点,包含下级节点则选中所有下级节点
if (item.children !== undefined) {
this.checkNode(item.children, check)
}
})
},
// 所有菜单节点数据
getMenuAllCheckedKeys() {
// 目前被选中的菜单节点
const checkedKeys = this.$refs.menu.getHalfCheckedKeys()
// 半选中的菜单节点
const halfCheckedKeys = this.$refs.menu.getCheckedKeys()
checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys)
return checkedKeys
},
// 所有部门节点数据
getDeptAllCheckedKeys() {
// 目前被选中的部门节点
const checkedKeys = this.$refs.dept.getHalfCheckedKeys()
// // 半选中的部门节点
const halfCheckedKeys = this.$refs.dept.getCheckedKeys()
checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys)
return this.$refs.dept.getCheckedKeys()
},
/** 根据角色ID查询菜单树结构 */
getRoleMenuTreeselect(roleId) {
return roleMenuTreeselect(roleId).then(response => {
this.menuOptions = response.data.menus
return response
})
},
/** 根据角色ID和菜单ID查询部门树结构 */
getRoleDeptTreeselect(roleId, menuId) {
return roleDeptTreeselect(roleId, menuId).then(response => {
this.form.deptCheckStrictly = response.data.deptCheckStrictly
this.deptOptions = response.data.depts
this.form.dataScope = this.dataScopeOptions[response.data.dataScope - 1].value
return response
})
},
// 角色状态修改
handleStatusChange(row) {
const text = row.flag === '1' ? '启用' : '停用'
this.$confirm('是否确认操作?', '警告', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(function() {
return changeRoleStatus(row.businessId, row.flag)
}).then(() => {
this.$message({
message: text + '成功',
type: 'success'
})
}).catch(function() {
row.flag = row.flag === '0' ? '1' : '0'
})
},
// 取消按钮
cancel() {
this.open = false
this.reset()
},
// 取消按钮(数据权限)
cancelDataScope() {
this.openDataScope = false
this.reset()
},
// 表单重置
reset() {
if (this.$refs.menu !== undefined) {
this.$refs.menu.setCheckedKeys([])
}
this.menuExpand = false
this.menuNodeAll = false
this.deptExpand = true
this.deptNodeAll = false
// TODO: 将模拟数据的空对象赋值给表单对象,达成清空填写表单的效果
this.form = {
roleId: undefined,
businessId: undefined,
roleName: undefined,
roleKey: undefined,
roleSort: 0,
deviceName: '',
deviceId: '',
location:'',
ply:'',
state:'',
flag: '1',
menuIds: [],
menuName: undefined,
deptIds: [],
menuCheckStrictly: false,
deptCheckStrictly: false,
remark: undefined
createTime: new Date(),
updataTime: new Date(),
createBy: ''
}
this.resetForm('form')
},
/** 查询按钮操作 */
/** TODO: 查询按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery() {
// this.dateRange = []
this.resetForm('queryForm')
this.handleQuery()
},
/** TODO: 重置按钮操作 */
resetQuery() {},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.roleId)
this.single = selection.length !== 1
this.multiple = !selection.length
},
// // 树权限(父子联动)
// handleCheckedTreeConnect(value, type) {
// if (type === 'menu') {
// this.form.menuCheckStrictly = !!value
// } else if (type === 'dept') {
// this.form.deptCheckStrictly = !!value
// }
// },
// 树权限(全选/全不选)
handleCheckedTreeNodeAll(value, type) {
if (type === 'menu') {
this.$refs.menu.setCheckedNodes(value ? this.menuOptions : [])
} else if (type === 'dept') {
this.$refs.dept.setCheckedNodes(value ? this.deptOptions : [])
}
},
// 树权限(展开/折叠)
handleCheckedTreeExpand(value, type) {
if (type === 'menu') {
const treeList = this.menuOptions
for (let i = 0; i < treeList.length; i++) {
this.$refs.menu.store.nodesMap[treeList[i].id].expanded = value
}
} else if (type === 'dept') {
const treeList = this.deptOptions
for (let i = 0; i < treeList.length; i++) {
this.$refs.dept.store.nodesMap[treeList[i].id].expanded = value
}
}
},
/** 新增按钮操作 */
handleSelectionChange(selection) {},
/** TODO: 新增按钮操作 */
handleAdd() {
// TODO: 初始化新增对话框的状态
this.reset()
this.getMenuTreeselect()
this.open = true
this.title = '添加设备'
this.title = '申请领用设备'
this.open = !this.open
},
/** 申请领用按钮操作 */
handleApplication(){
this.reset()
this.getMenuTreeselect()
this.open = true
this.title = '申请'
// TODO: 获取所选行详情信息操作
handleDetail(row) {
this.singleDetails = this.formReset
this.singleDetails = row
this.title = '详情信息'
this.openDetails = !this.openDetails
},
/** 修改按钮操作 */
/** TODO: 修改按钮操作 */
handleUpdate(row) {
this.reset()
const roleId = row.businessId || this.ids
const roleMenu = this.getRoleMenuTreeselect(roleId)
getRole(roleId).then(response => {
this.form = response.data
this.open = true
this.getMenuTreeselect(roleId)
this.$nextTick(() => {
roleMenu.then(res => {
this.$refs.menu.setCheckedKeys(res.data.checkedKeys)
})
})
this.title = '修改申请'
})
const upddeviceName = row.deviceName
for (const pd of this.simulateDeviceList) {
if (pd.deviceName === upddeviceName) {
this.form = pd
}
}
this.open = true
},
/** 分配数据权限操作 选择菜单 */
handleMenu(row) {
/** TODO: 修改或增加list列表里的数据 */
submitForm: function() {
this.$refs['form'].validate(valid => {
if (valid) {
// TODO: 模拟测试数据的修改,可删除
for (const p of this.simulateDeviceList) {
if (p.deviceName === this.form.deviceName) {
this.simulateDeviceList = this.simulateDeviceList.map(obj =>
obj.deviceName === this.form.deviceName ? this.form : obj
)
this.msgSuccess('申请成功')
this.getList()
this.reset()
const roleId = row.businessId || this.ids
this.getMenuList(roleId) // 查询菜单列表树形显示
getRole(roleId).then(response => {
this.form = response.data
this.openDataScope = true
this.title = '分配数据权限'
})
},
/** 分配数据权限操作 */
handleDataScope(row) {
this.deptOptions = []
this.form.dataScope = undefined
const roleId = this.form.businessId
this.form.menuId = row.businessId
this.form.menuName = row.menuName
const roleDeptTreeselect = this.getRoleDeptTreeselect(roleId, this.form.menuId)
this.$nextTick(() => {
roleDeptTreeselect.then(res => {
this.$refs.dept.setCheckedKeys(res.data.checkedKeys)
})
})
this.title = '分配数据权限'
},
/** 提交按钮 */
submitForm() {
this.$message({
message: '提交成功',
type: 'success'
});
this.open = false
// this.$refs['form'].validate(valid => {
// if (valid) {
// this.form.menuCheckStrictly = false
// if (this.form.businessId !== undefined) {
// this.form.menuIds = this.getMenuAllCheckedKeys()
// updateRole(this.form).then(response => {
// this.msgSuccess('修改成功')
// this.open = false
// this.getList()
// })
// } else {
// this.form.menuIds = this.getMenuAllCheckedKeys()
// addRole(this.form).then(response => {
// this.msgSuccess('新增成功')
// this.open = false
// this.getList()
// })
// }
// }
// })
},
/** 提交按钮(数据权限) */
submitDataScope: function() {
if (this.form.businessId !== undefined && this.form.menuId !== undefined) {
this.form.deptIds = this.getDeptAllCheckedKeys()
dataScope(this.form).then(response => {
this.msgSuccess('修改成功')
this.openDataScope = false
this.open = !this.open
return
} else {
if (this.form !== undefined && this.form !== null) {
this.simulateDeviceList.push(this.form)
this.msgSuccess('申请成功')
this.getList()
this.reset()
this.open = !this.open
return
}
}
}
}
})
},
/** TODO: 关于模拟数据的 删除list数组所调用的删除方法,封装的函数如下 */
delDevice(delDeviceName) {
let tip = false
for (const pd0 of this.simulateDeviceList) {
console.log('This is pd0:', pd0)
if (pd0.deviceName === delDeviceName) {
this.simulateDeviceList = this.simulateDeviceList.filter(item => item.deviceName !== delDeviceName)
tip = true
break
}
}
return tip
},
/** 删除按钮操作 */
/** TODO:删除按钮操作 */
handleDelete(row) {
const roleIds = row.businessId || this.ids
this.$confirm('是否确认操作?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(function() {
return delRole(roleIds)
}).then(() => {
return this.delDevice(row.deviceName)
}).then(() => {
this.getList()
this.$message({
message: '删除成功',
type: 'success'
})
}).catch(function() {
})
},
/** 导出按钮操作 */
handleExport() {
const queryParams = this.queryParams
this.$confirm('是否确认操作?', '警告', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(function() {
return exportRole(queryParams).then(response => {
const blob = new Blob([response])
const downloadElement = document.createElement('a')
const href = window.URL.createObjectURL(blob)// 创建下载的链接
downloadElement.href = href
downloadElement.download = '角色信息' + '.xls' // 下载后文件名
document.body.appendChild(downloadElement)
downloadElement.click()// 点击下载
document.body.removeChild(downloadElement)// 下载完成移除元素
window.URL.revokeObjectURL(href)// 释放掉blob对象
// this.download(response.msg);
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
})
})
}
}
}
</script>
<style lang="scss" scoped>
.app-container {
font-size: 18px;
padding: 0;
......@@ -659,4 +494,20 @@ export default {
height: 12em;
width: 4px;
}
.aboutSingleDetails{
.el-form-item{
.el-input >>> .el-input__inner {
-webkit-appearance: none;
background-color: #FFF;
background-image: none;
border-radius: 4px;
border: 0;
width: 100%;
}
}
}
</style>
<template>
<div class="app-container">
<el-form v-show="showSearch" ref="queryForm" style="padding: 0 0 0 10px" :model="queryParams" :inline="true" label-width="68px">
<!-- <el-form-item label="登录地址" prop="ipaddr">-->
<!-- <el-input-->
<!-- v-model="queryParams.ipaddr"-->
<!-- placeholder="请输入登录地址"-->
<!-- clearable-->
<!-- :maxlength="30"-->
<!-- size="small"-->
<!-- @keyup.enter.native="handleQuery"-->
<!-- />-->
<!-- </el-form-item>-->
<el-form-item label="设备名称" prop="userName">
<!-- TODO: 基础工序管理-->
<el-form ref="queryForm" style="padding: 0 0 0 10px" :model="queryParams" :inline="true">
<el-form-item label="设备名称" prop="roleName">
<el-input
v-model="queryParams.username"
v-model="queryParams.deviceName"
placeholder="请输入设备名称"
clearable
:maxlength="30"
style="width: 240px;"
size="small"
style="width: 150px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="设备编码" prop="roleKey">
<el-input
v-model="queryParams.deviceId"
placeholder="请输入设备编码"
clearable
size="small"
style="width: 150px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<!-- <el-form-item label="登录状态" prop="status">-->
<!-- <el-select-->
<!-- v-model="queryParams.status"-->
<!-- placeholder="请选择登录状态"-->
<!-- clearable-->
<!-- size="small"-->
<!-- style="width: 240px"-->
<!-- >-->
<!-- <el-option-->
<!-- v-for="dict in statusOptions"-->
<!-- :key="dict.dictValue"-->
<!-- :label="dict.dictLabel"-->
<!-- :value="dict.dictValue"-->
<!-- />-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="登录时间">
<el-date-picker
v-model="queryParams.loginTime"
type="month"
<el-form-item label="LOT" >
<el-input
v-model="queryParams.LOT"
placeholder="请输入LOT"
clearable
size="small"
style="width: 170px"
value-format="yyyy-MM"
placeholder="请选择月份"
style="width: 150px"
@keyup.enter.native="handleQuery"
/>
</el-form-item> -->
</el-form-item>
<el-form-item>
<el-button type="primary" size="small" icon="el-icon-search" @click="handleQuery">查询</el-button>
</el-form-item>
<div style="float: right">
<el-form-item>
<!-- v-hasPermi="['zt:loginlog:delete']"-->
<!-- <el-button-->
<!-- type="danger"-->
<!-- size="small"-->
<!-- :disabled="multiple"-->
<!-- @click="handleDelete"-->
<!-- >删除</el-button>-->
<!-- <coolbutton :type="deletetypePrimary" :name="deleteName" :size="deleteSize" :disabled="multiple" @btn-click="handleDelete" />-->
<!-- v-hasPermi="['zt:loginlog:clear']"-->
<!-- <el-button
type="danger"
size="small"
:icon="delIcon"
@click="handleClean"
>清空</el-button> -->
<!-- <coolbutton :type="cleantypePrimary" :name="cleanName" :haspermi="clearHaspermi" :icon="delIcon" :size="cleanSize" @btn-click="handleClean" />-->
<!-- v-hasPermi="['zt:loginlog:export']"-->
<el-button
type="success"
size="small"
icon="el-icon-download"
@click="handleExport"
>导出</el-button>
<!-- <coolbutton :type="exporttypePrimary" :name="exportName" :icon="exportIcon" :size="exportSize" @btn-click="handleExport" />-->
<!-- <el-button size="mini" @click="resetQuery">重置</el-button>-->
<coolbutton style="padding: 8px 7px;" :type="typePrimary" :name="application" :size="smallSize" :icon="addIcon" @btn-click="handleAdd" />
</el-form-item>
</div>
</el-form>
<div class="placeholder" />
<div style="padding:10px">
<div class="mb12 font-small-bold">设备受入列表</div>
<el-table v-loading="loading" border :data="list" @selection-change="handleSelectionChange">
<!-- <el-table-column type="selection" width="55" align="center" />-->
<!-- &lt;!&ndash; <el-table-column type="index" label="序号" width="50" />&ndash;&gt;-->
<!-- <el-table-column label="访问编号" width="100" align="center" prop="infoId" show-overflow-tooltip>-->
<!-- <template slot-scope="scope">-->
<!-- {{ scope.row.infoId || '-' }}-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column label="用户名称" align="center" prop="userName" show-overflow-tooltip>-->
<!-- <template slot-scope="scope">-->
<!-- {{ scope.row.userName || '-' }}-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column label="登录地址" align="center" prop="ipaddr" show-overflow-tooltip>-->
<!-- <template slot-scope="scope">-->
<!-- {{ scope.row.ipaddr || '-' }}-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column label="操作信息" align="center" prop="msg" show-overflow-tooltip>-->
<!-- <template slot-scope="scope">-->
<!-- {{ scope.row.msg || '-' }}-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- &lt;!&ndash; <el-table-column label="登录地址" align="center" prop="ipaddr" width="130" :show-overflow-tooltip="true" />&ndash;&gt;-->
<!-- <el-table-column label="登录地点" align="center" prop="loginLocation" :show-overflow-tooltip="true" />-->
<!-- &lt;!&ndash; <el-table-column label="浏览器" align="center" prop="browser" show-overflow-tooltip>&ndash;&gt;-->
<!-- &lt;!&ndash; <template slot-scope="scope">&ndash;&gt;-->
<!-- &lt;!&ndash; {{ scope.row.browser || '-' }}&ndash;&gt;-->
<!-- &lt;!&ndash; </template>&ndash;&gt;-->
<!-- &lt;!&ndash; </el-table-column>&ndash;&gt;-->
<!-- &lt;!&ndash; <el-table-column label="操作系统" align="center" prop="os" show-overflow-tooltip>&ndash;&gt;-->
<!-- &lt;!&ndash; <template slot-scope="scope">&ndash;&gt;-->
<!-- &lt;!&ndash; {{ scope.row.os || '-' }}&ndash;&gt;-->
<!-- &lt;!&ndash; </template>&ndash;&gt;-->
<!-- &lt;!&ndash; </el-table-column>&ndash;&gt;-->
<!-- <el-table-column label="登录状态" align="center" prop="status" :formatter="statusFormat" />-->
<el-table-column type="index" width="55" label="序号" align="center" />
<!-- <el-table-column label="访问编号" align="center" prop="businessId" />-->
<el-table-column label="设备名称" align="center" prop="username" />
<el-table-column label="XXXX" align="center" prop="ipaddr" width="130" :show-overflow-tooltip="true" />
<el-table-column label="XXXX" align="center" prop="loginLocation" :show-overflow-tooltip="true" />
<!-- <el-table-column label="浏览器" align="center" prop="browser" />
<el-table-column label="操作系统" align="center" prop="os" />-->
<!-- <el-table-column label="登录状态" align="center" prop="status" :formatter="statusFormat" />-->
<el-table-column label="XXXX" align="center" prop="status">
<!-- TODO: 中间的分隔符号 -->
<div style="padding:5px 10px">
<!-- TODO: 以下为基础工序管理列表 -->
<div class="mb12 font-small-bold">设备领用列表</div>
<el-table v-loading="loading" border :data="roleList" @selection-change="handleSelectionChange">
<el-table-column type="index" label="序号" width="50" />
<el-table-column label="设备名称" prop="deviceName" :show-overflow-tooltip="true">
<template slot-scope="scope">
<span v-if="scope.row.status === '0'">失败</span>
<span v-if="scope.row.status === '1'">成功</span>
{{ scope.row.deviceName || '-' }}
</template>
</el-table-column>
<el-table-column label="提示信息" align="center">
<el-table-column label="设备编码" prop="deviceId">
<template slot-scope="scope">
{{ scope.row.msg || '-' }}
{{ scope.row.deviceId || '-' }}
</template>
</el-table-column>
<el-table-column label="时间" align="center" prop="loginTime" width="180" show-overflow-tooltip>
<el-table-column label="LOT" prop="LOT">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.loginTime) | transformDateByFormat('YYYY-MM-DD HH:mm:ss') }}</span>
{{ scope.row.deviceId || '-' }}
</template>
</el-table-column>
<el-table-column label="操作">
<el-table-column label="创建时间" :show-overflow-tooltip="true" align="center" prop="createTime">
<template slot-scope="scope">
<!-- <coolbutton :type="textPrimary" :name="deleteName" :size="deleteSize" @btn-click="handleDelete(scope.row.businessId)" />-->
<span>{{ scope.row.createTime | transformDateByFormat('YYYY-MM-DD HH:mm') }}</span>
</template>
</el-table-column>
<el-table-column label="创建人" prop="createBy">
<template slot-scope="scope">
{{ scope.row.createBy || '-' }}
</template>
</el-table-column>
<el-table-column label="操作" class-name="small-padding fixed-width" width="240px">
<template slot-scope="scope">
<el-button :type="typeParent" :size="size" @click="handleDetail(scope.row)">
详情
</el-button>
<el-button :type="typeParent" :size="size" @click="handleUpdate(scope.row)">
{{ updataName }}
</el-button>
<el-button
size="mini"
type="text"
size="small"
@click="handleDelete(scope.row.businessId)"
@click="handleDelete(scope.row)"
>删除</el-button>
</template>
</el-table-column>
......@@ -159,138 +98,166 @@
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.page"
:limit.sync="queryParams.rows"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 清空弹窗-->
<el-dialog
title="选择清空月份"
:visible.sync="clearVisible"
width="30%"
:before-close="handleClose"
>
<el-form ref="clear" :model="clearFrom" :rules="clearRule">
<el-form-item label="月份" prop="month">
<el-date-picker
v-model="clearFrom.month"
type="monthrange"
range-separator="至"
start-placeholder="开始月份"
end-placeholder="结束月份"
value-format="yyyy_MM"
:picker-options="endDatePicker"
@change="timechange"
/>
<!-- TODO: 添加或修改工序配置对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label=" 设备名称" prop="deviceName">
<el-input v-model.trim="form.deviceName" show-word-limit :maxlength="30" placeholder="请输入设备名称" />
</el-form-item>
<el-form-item label="设备编码" prop="deviceId">
<el-input v-model.trim="form.deviceId" show-word-limit :maxlength="30" placeholder="请输入设备编码" />
</el-form-item>
<el-form-item style="float: right;margin-top: 20px">
<el-button @click="clearVisible = false">取 消</el-button>
<el-button type="primary" @click="clear">确 定</el-button>
<el-form-item label="LOT" prop="LOT">
<el-input v-model.trim="form.LOT" show-word-limit :maxlength="30" placeholder="请输入LOT" />
</el-form-item>
<el-form-item label="创建人" prop="createBy">
<el-input v-model.trim="form.createBy" :maxlength="30" show-word-limit placeholder="请输入创建人" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancel">取 消</el-button>
<el-button type="primary" @click="submitForm">确 定</el-button>
</div>
</el-dialog>
<!-- 导出弹窗-->
<el-dialog
title="选择导出月份"
:visible.sync="exportVisible"
width="30%"
:before-close="handleClose"
>
<el-form ref="export" :model="exportFrom" :rules="exportRule">
<el-form-item label="月份" prop="month">
<el-date-picker
v-model="exportFrom.month"
type="monthrange"
range-separator="至"
start-placeholder="开始月份"
end-placeholder="结束月份"
value-format="yyyy_MM"
:picker-options="endDatePicker"
@change="timechange"
/>
<!-- TODO: 单项详情信息表单配置 -->
<el-dialog class="aboutSingleDetails" :title="title" :visible.sync="openDetails" width="700px" append-to-body>
<el-form ref="formDetails" :model="singleDetails" size="small" label-width="90px">
<el-form-item label="名称:" prop="deviceName">
<el-input v-model.trim="singleDetails.deviceName" :readonly="isReadOnly" />
</el-form-item>
<el-form-item style="float: right;margin-top: 20px">
<el-button @click="exportVisible = false">取 消</el-button>
<el-button type="primary" @click="exportSubmit">确 定</el-button>
<el-form-item label="工厂车间:" prop="deviceId">
<el-input v-model.trim="singleDetails.deviceId" :readonly="isReadOnly" />
</el-form-item>
<el-form-item label="创建时间:" prop="createTime">
<el-input v-model.trim="singleDetails.createTime" :readonly="isReadOnly" />
</el-form-item>
<el-form-item label="创建人:" prop="createBy">
<el-input v-model.trim="singleDetails.createBy" :readonly="isReadOnly" />
</el-form-item>
</el-form>
</el-dialog>
</div>
</template>
<script>
import { list, delLogininfo, cleanLogininfo, exportLogininfo } from '@/api/monitor/loginInfo'
import dictCons from '@/utils/dictCons'
import Template from '@/views/instance/Template'
// TODO: 导入外部已经封装好的button组件
import Coolbutton from '@/components/coolbutton'
export default {
name: 'LoginInfo',
components: { Template, Coolbutton },
name: 'Role',
components: { Coolbutton },
data() {
return {
endDatePicker: this.handelFixDate(),
// 自定义按钮
deletetypePrimary: 'danger',
textPrimary: 'text',
deleteName: '删除',
deleteSize: 'mini',
deleteDisabled: 'multiple',
cleantypePrimary: 'danger',
cleanName: '清空',
cleanSize: 'small',
exporttypePrimary: 'success',
exportName: '导出',
exportSize: 'small',
delIcon: 'el-icon-delete',
typeParent: 'text',
typePrimary: 'primary',
typeSuccess: 'success',
nameParent: '删除',
resetName: '重置',
addName: '新增',
application:'申请领用',
updataName: '修改',
size: 'mini',
smallSize: 'small',
delicon: 'el-icon-delete',
addIcon: 'el-icon-plus',
exportIcon: 'el-icon-download',
clearVisible: false,
exportVisible: false,
exportFrom: {},
exportRule: {
month: [
{ required: true, message: '请选择月份', trigger: 'change' }
]
},
resetIcon: '',
// TODO: 控制只读
isReadOnly: true,
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
clearFrom: {},
clearRule: {
month: [
{ required: true, message: '请选择月份', trigger: 'change' }
]
},
// 表格数据
list: [],
// 状态数据字典
statusOptions: [
{
dictLabel: '启用',
dictValue: '1'
},
{
dictLabel: '停用',
dictValue: '0'
}
],
// 角色表格数据
roleList: [],
// 弹出层标题
title: '',
// 是否显示弹出层
open: false,
// 是否显示弹出层(数据详情)
openDetails: false,
// 日期范围
dateRange: [],
// dateRange: [],
// 菜单表格数据
menuList: [],
menuExpand: false,
menuNodeAll: false,
deptExpand: true,
deptNodeAll: false,
// 查询参数
queryParams: {
page: 1,
rows: 10,
ipaddr: undefined,
username: undefined,
status: undefined,
loginTime: ''
}
pageNum: 1,
pageSize: 10,
deviceName: undefined,
deviceId: undefined,
LOT: undefined,
flag: undefined
},
defaultProps: {},
// TODO: 表单参数
form: {
deviceName: '',
deviceId: '',
LOT: '',
flag: '1',
remark: '',
createTime: new Date(),
updataTime: new Date(),
createBy: ''
},
// TODO: 表单初始参数
formReset: {
deviceName: '',
deviceId: '',
LOT: '',
flag: '1',
createTime: new Date(),
updataTime: new Date(),
createBy: ''
},
// TODO: 表单里的单项详情参数
singleDetails: {
deviceName: '',
deviceId: '',
LOT: '',
flag: '1',
createTime: new Date(),
updataTime: new Date(),
createBy: ''
},
// TODO: 模拟测试数据
simulateDeviceList: [{
deviceName: '挖掘机', deviceId: '0001', flag: 1, LOT: '0001', createTime: new Date(), updataTime: new Date(), createBy: '张三'
}, {
deviceName: '汽车', deviceId: '车间2', flag: 2, LOT: '0002', createTime: new Date(), updataTime: new Date(), createBy: '李四'
}],
// 表单校验
rules: {
deviceName: [
{ required: true, message: '请输入设备名称', trigger: 'blur' }
],
deviceId: [
{ required: true, message: '请输入设备编码', trigger: 'blur' }
],
LOT: [
{ required: true, message: '请输入LOT', trigger: 'blur' }
],
createBy: [
{ required: true, message: '请输入申请人', trigger: 'blur' }
]
},
deptOptions: []
}
},
/** 路由离开前存储筛选条件*/
......@@ -309,155 +276,176 @@ export default {
const param = JSON.parse(searchParams[path]) // 保留着的查询条件
this.queryParams = { ...param }
}
// this.queryParams.loginTime = this.$parseDate(new Date(), 'YYYY-MM-DD HH:mm:ss')
this.getList()
// this.getDicts(dictCons['COMMON_STATUS']).then(response => {
// this.statusOptions = response.data
// })
},
methods: {
// 清空和导出弹出框的日期选择器禁用当前月份之后的月份
handelFixDate() {
return {
disabledDate(time) {
// 如果想蕴含本月本月 - 8.64e7 * t 就不须要了,
// 如果想之前的不能抉择把 > 换成 <
return time.getTime() > Date.now()
}
}
},
/** 查询登录日志列表 */
/** 查询角色列表 */
getList() {
this.loading = true
// const query = Object.assign({}, this.queryParams)
// query.loginTime = query.loginTime ? this.$parseDate(new Date(query.loginTime), 'YYYY-MM-DD HH:mm:ss') : ''
list(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
this.list = response.rows
this.total = response.total
this.roleList = this.simulateDeviceList
console.log(this.roleList)
this.loading = false
})
},
handleClose() {
this.clearVisible = false
this.exportVisible = false
// 取消按钮
cancel() {
this.open = false
this.reset()
},
timechange(e) {
// 表单重置
reset() {
// TODO: 将模拟数据的空对象赋值给表单对象,达成清空填写表单的效果
this.form = {
deviceName: '',
deviceId: '',
flag: '1',
createTime: new Date(),
updataTime: new Date(),
createBy: ''
}
},
// 登录状态字典翻译
// statusFormat(row, column) {
// return this.selectDictLabel(this.statusOptions, row.status)
// },
/** 查询按钮操作 */
/** TODO: 查询按钮操作 */
handleQuery() {
this.queryParams.page = 1
this.queryParams.pageNum = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery() {
this.dateRange = ''
this.resetForm('queryForm')
this.handleQuery()
},
/** TODO: 重置按钮操作 */
resetQuery() {},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.businessId)
this.multiple = !selection.length
handleSelectionChange(selection) {},
/** TODO: 新增按钮操作 */
handleAdd() {
// TODO: 初始化新增对话框的状态
this.reset()
this.title = '添加工序'
this.open = !this.open
},
/** 删除按钮操作 */
handleDelete(data) {
this.$confirm('是否确认操作?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
// const id = this.ids.join(',')
const id = data
const query = {
deleteIds: id
// TODO: 获取所选行详情信息操作
handleDetail(row) {
this.singleDetails = this.formReset
this.singleDetails = row
this.title = '详情信息'
this.openDetails = !this.openDetails
},
/** TODO: 修改按钮操作 */
handleUpdate(row) {
this.reset()
this.title = '修改工序'
const upddeviceName = row.deviceName
for (const pd of this.simulateDeviceList) {
if (pd.deviceName === upddeviceName) {
this.form = pd
}
return delLogininfo(query)
}).then(() => {
this.getList()
this.$message.success('删除成功')
this.ids = []
this.multiple = true
}).catch(function() {})
}
this.open = true
},
clear() {
this.$refs['clear'].validate((valid) => {
/** TODO: 修改或增加list列表里的数据 */
submitForm: function() {
this.$refs['form'].validate(valid => {
if (valid) {
const that = this
const query = {
beginTime: that.clearFrom.month[0],
endTime: that.clearFrom.month[1]
}
cleanLogininfo(query).then(res => {
if (res.code === 200) {
that.getList()
that.$message.success('清空成功')
this.clearVisible = false
// TODO: 模拟测试数据的修改,可删除
for (const p of this.simulateDeviceList) {
if (p.deviceName === this.form.deviceName) {
this.simulateDeviceList = this.simulateDeviceList.map(obj =>
obj.deviceName === this.form.deviceName ? this.form : obj
)
this.msgSuccess('修改成功')
this.getList()
this.reset()
this.open = !this.open
return
} else {
that.$message.error(res.message)
if (this.form !== undefined && this.form !== null) {
this.simulateDeviceList.push(this.form)
this.msgSuccess('新增成功')
this.getList()
this.reset()
this.open = !this.open
return
}
}
}
})
}
})
},
/** 清空按钮操作 */
handleClean() {
this.clearVisible = true
this.clearFrom = {}
},
exportSubmit() {
this.$refs['export'].validate((valid) => {
if (valid) {
const that = this
const query = {
beginTime: that.exportFrom.month[0],
endTime: that.exportFrom.month[1]
/** TODO: 关于模拟数据的 删除list数组所调用的删除方法,封装的函数如下 */
delDevice(delDeviceName) {
let tip = false
for (const pd0 of this.simulateDeviceList) {
console.log('This is pd0:', pd0)
if (pd0.deviceName === delDeviceName) {
this.simulateDeviceList = this.simulateDeviceList.filter(item => item.deviceName !== delDeviceName)
tip = true
break
}
return exportLogininfo(query).then(response => {
const blob = new Blob([response])
const downloadElement = document.createElement('a')
const href = window.URL.createObjectURL(blob)// 创建下载的链接
downloadElement.href = href
downloadElement.download = '登录日志' + '.xls' // 下载后文件名
document.body.appendChild(downloadElement)
downloadElement.click()// 点击下载
document.body.removeChild(downloadElement)// 下载完成移除元素
window.URL.revokeObjectURL(href)// 释放掉blob对象
this.exportVisible = false
// this.download(response.msg)
})
}
})
return tip
},
/** 导出按钮操作 */
handleExport() {
this.exportVisible = true
this.exportFrom = {}
// const queryParams = Object.assign({}, this.queryParams)
// // queryParams.loginTime = queryParams.loginTime ? this.$parseDate(new Date(queryParams.loginTime), 'YYYY-MM-DD HH:mm:ss') : ''
// delete queryParams.page
// delete queryParams.rows
// queryParams.ids = this.ids.join(',') || null
// exportLogininfo(queryParams).then(response => {
// this.download(response.msg)
// }).catch(function() {})
/** TODO:删除按钮操作 */
handleDelete(row) {
this.$confirm('是否确认操作?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
return this.delDevice(row.deviceName)
}).then(() => {
this.getList()
this.$message({
message: '删除成功',
type: 'success'
})
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
})
})
}
}
}
</script>
<style lang="scss" scoped>
.app-container {
padding: 0;
<style lang="scss" scoped>
.app-container {
font-size: 18px;
.placeholder{
height:14px;
padding: 0;
.placeholder {
height: 1.3vh;
background-color: #F4F4F4;
margin-bottom:10px
margin-bottom: 10px
}
.table-drop {
vertical-align: 2px;
line-height: 20px;
margin-left: 15px
}
</style>
.el-switch {
margin-left: 15px;
}
}
.el-divider--vertical{
height: 12em;
width: 4px;
}
.aboutSingleDetails{
.el-form-item{
.el-input >>> .el-input__inner {
-webkit-appearance: none;
background-color: #FFF;
background-image: none;
border-radius: 4px;
border: 0;
width: 100%;
}
}
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment