Merge branch 'shf' of https://sinanoaq.cn:8888/r/ztqt into shf

shj

2022-03-22 9d8e977c3593837dca24e829202d186cc56f3cff

Merge branch 'shf' of https://sinanoaq.cn:8888/r/ztqt into shf

 src/router/index.js

@@ -53,6 +53,24 @@
        hidden: true
    },
    {
        path: '/productionEquipment',
        // 重大生产设备
        component: () => import('@/views/productionEquipment'),
        hidden: true
    },
    {
        path: '/instrumentData',
        // 重大仪表实时数据
        component: () => import('@/views/instrumentData'),
        hidden: true
    },
    {
        path: '/equipmentAlarm',
        // 设备报警信息
        component: () => import('@/views/equipmentAlarm'),
        hidden: true
    },
    {
        path: '/',
        component: Layout,
        redirect: '/doublePreventAction/doublePreventAction/riskLevelManage/index/doublePreventAction/riskLevelManage/analyseUnit/index',
@@ -63,7 +81,6 @@
                name: 'Dashboard1',
                meta: { title: '首页', icon: 'el-icon-dash', noCache: true, affix: true }
            }

        ],
        hidden: true
    },

 src/views/equipmentAlarm/index.vue

对比新文件
@@ -0,0 +1,360 @@
<template>
    <div class="app-container">
        <div class="filter-container">
            <div class="basic_search">
                <span>设备名称：</span>
                <el-input v-model="name" style="width:200px">
                </el-input>
            </div>
            <div class="basic_search">
                <span style="margin-left: 20px;">状态：</span>
                <el-select v-model="state" placeholder="请选择状态">
                    <el-option label="未处理" value="shanghai"></el-option>
                    <el-option label="已处理" value="beijing"></el-option>
                </el-select>
            </div>
            <el-button class="filter-item" style="margin-left: 10px;" type="primary" icon="el-icon-refresh" @click="refreshHandle">刷新</el-button>
            <el-button class="filter-item" style="margin-left: 10px;" type="primary" icon="el-icon-plus" @click="showCreateHandle">新增</el-button>
            <el-button class="filter-item" type="primary" icon="el-icon-search" @click="queryHandle" />
        </div>
        <div class="table_content">
            <el-table
                v-loading="listLoading"
                :key="tableKey"
                :data="roleData"
                border
                fit
                highlight-current-row
                style="width: 100%;"
            >
                <el-table-column label="设备名称" prop="name" align="center">
                    <template slot-scope="scope">
                        <span>{{ scope.row.name }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="状态" prop="state" align="center">
                    <template slot-scope="scope">
                        <span>{{ scope.row.state }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="报警时间" prop="time" align="center">
                    <template slot-scope="scope">
                        <span>{{ scope.row.time }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="报警信息" prop="information" align="center">
                    <template slot-scope="scope">
                        <span>{{ scope.row.information }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="备注" prop="remarks" align="center">
                    <template slot-scope="scope">
                        <span>{{ scope.row.remarks }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="操作" align="center" width="280" class-name="small-padding fixed-width">
                    <template slot-scope="scope">
                        <el-button type="primary" size="mini" @click="showEditHandle(scope.row)">编辑</el-button>
                        <el-button type="danger" size="mini" @click="deleteHandle(scope.row)">删除</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <br>
        </div>
        <el-dialog :title="dialogStatus==='create'?'新增':'编辑'" :visible.sync="dialogFormVisible" :modal-append-to-body="false" :close-on-click-modal="false" width="700px">
            <el-form ref="dataForm" :rules="dataFormRules" :model="dataForm" label-position="right" label-width="120px" style="margin-left:50px;margin-right:50px;" element-loading-text="保存中...">
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="设备名称" prop="name">
                            <el-input v-model.trim="dataForm.name"/>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="状态" prop="state">
                            <el-select v-model="dataForm.state" placeholder="请选择状态">
                                <el-option label="未处理" value="shanghai"></el-option>
                                <el-option label="已处理" value="beijing"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="仪表量上限" prop="volume">
                            <el-input v-model.trim="dataForm.volume"/>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="报警时间" prop="time">
                            <el-input v-model.trim="dataForm.time"/>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="24">
                        <el-form-item label="报警信息" prop="information">
                            <el-input type="textarea" v-model.trim="dataForm.information"/>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="24">
                        <el-form-item label="备注" prop="remarks">
                            <el-input type="textarea" v-model.trim="dataForm.remarks"/>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible = false">取消</el-button>
                <el-button type="primary" @click="dialogStatus==='create'?createHandle():updateHandle()">确认</el-button>
            </div>
        </el-dialog>
        <div style="clear: both;"/>
    </div>
</template>

<script>
    import { mapGetters } from 'vuex'
    import { roleList, createRole, deleteRole, updateRole, getRole, updateRolePermission} from '@/api/role'
    import { permissionList } from '@/api/permission'
    import { parseTime, computePageCount } from '@/utils'
    import { parseError } from '@/utils/messageDialog'
    import Cookies from 'js-cookie'
    import { Message, MessageBox } from 'element-ui'
    import { initRouter } from '@/utils/router'
    export default {
        name: 'RoleTable',
        filters: {
        },
        computed: {
            ...mapGetters([
                'userType'
            ])
        },
        data() {
            return {
                tableKey: 0,
                roleData: null,
                listLoading: true,
                dataForm: {
                    state: '',
                    name:'',
                    volume:'',
                    information:'',
                    time:'',
                    remarks: ''
                },
                queryForm: {
                    name: ''
                },
                dialogFormVisible: false,
                dialogStatus: '',
                dataFormRules: {
                    name: [{ required: true, message: '角色名不能为空', trigger: 'blur' }]
                },
                treeLoading: false,
                selectAllFlag: false,
                hasMenuTree: [],
                editRolePermId: '',
                company:'',
                region:'',
            }
        },
        created() {
            this.getRoleList()
        },
        methods: {
            getRoleList() {
                const _this = this
                const params = {}
                const userName = Cookies.get('userName')
                params['operator'] = userName
                for (const i in _this.queryForm) {
                    if (_this.queryForm[i] != undefined && _this.queryForm[i].toString() != '') {
                        params[i] = _this.queryForm[i]
                    }
                }
                _this.listLoading = true
                roleList(params).then(response => {
                    const res = response.data
                    if (res.code == 200) {
                        _this.roleData = res.result
                    } else {
                        parseError({ error: res.message, vm: _this })
                    }
                    _this.listLoading = false
                }).catch(error => {
                    _this.listLoading = false
                    parseError({ error: error, vm: _this })
                })
            },
            createHandle: function() {
                const _this = this
                this.$refs['dataForm'].validate((valid) => {
                    if (valid) {
                        const userName = Cookies.get('userName')
                        _this.dataForm['operator'] =userName
                        createRole(_this.dataForm).then(response => {
                            const res = response.data
                            if (res.code == 200) {
                                _this.dialogFormVisible = false
                                _this.$message({
                                    message: '创建成功',
                                    type: 'success'
                                })
                                _this.getRoleList()
                            } else {
                                parseError({ error: res.message, vm: _this })
                            }
                        }).catch(error => {
                            parseError({ error: error, vm: _this })
                        })
                    }
                })
            },
            deleteHandle: function(row) {
                const _this = this
                MessageBox.confirm('确定删除角色' + row.name + '信息', '确定删除', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    _this.deleteAction(row)
                }).catch(() => {
                    console.log('已取消删除')
                })
            },
            deleteAction: function(row) {
                const _this = this
                const params = {}
                params['id'] = row.id
                const userName = Cookies.get('userName')
                params['operator'] = userName
                deleteRole(params).then(response => {
                    const res = response.data
                    if (res.code == 200) {
                        _this.$message({
                            message: '删除成功',
                            type: 'success'
                        })
                        _this.getRoleList()
                    } else {
                        parseError({ error: res.message, vm: _this })
                    }
                }).catch(error => {
                    parseError({ error: error, vm: _this })
                })
            },
            refreshHandle: function() {
                this.getRoleList()
            },
            queryHandle: function() {
                this.getRoleList()
            },
            resetDataForm() {
                this.dataForm = {
                    name: '',
                    id: '',
                }
            },
            showCreateHandle() {
                this.resetDataForm()
                this.dialogStatus = 'create'
                this.dialogFormVisible = true
                this.$nextTick(() => {
                    this.$refs['dataForm'].clearValidate()
                })
            },
            updateHandle() {
                this.$refs['dataForm'].validate((valid) => {
                    const _this = this
                    if (valid) {
                        const userName = Cookies.get('userName')
                        _this.dataForm['operator'] = userName
                        updateRole(_this.dataForm).then(response => {
                            const res = response.data
                            if (res.code == 200) {
                                _this.dialogFormVisible = false
                                _this.$message({
                                    message: '更新成功',
                                    type: 'success'
                                })
                                _this.getRoleList()
                            } else {
                                parseError({ error: res.message, vm: _this })
                            }
                        }).catch(error => {
                            parseError({ error: error, vm: _this })
                        })
                    }
                })
            },
            showEditHandle: function(row) {
                this.resetDataForm()
                this.dialogStatus = 'editor'
                this.dataForm.name = row.name
                this.dataForm.id = row.id
                this.dialogFormVisible = true
                this.$nextTick(() => {
                    this.$refs['dataForm'].clearValidate()
                })
            },
            handleSizeChange: function(val) {
                this.getRoleList()
            },
            handleCurrentChange: function(val) {
                this.getRoleList()
            },
            getPermissionList() {
                const _this = this
                const params = {}
                params['userId'] = Cookies.get('userId')
                permissionList(params).then(response => {
                    const res = response.data
                    if (res.code == 200) {
                    } else {
                        parseError({ error: res.message, vm: _this })
                    }
                })
            },
            setNodeChecked(nodeId) {
                const node = this.$refs.menuTree.getNode(nodeId)
                if (!node.checked) {
                    this.$refs.menuTree.setChecked(nodeId, true)
                }
                if (node) {
                    if (node.data.parentid == 0 || node.data.parentid) {
                        this.setNodeChecked(node.data.parentid)
                    }
                }
            },
            cancelNodeChecked(nodeId) {
                const checkNodes = this.$refs.menuTree.getCheckedNodes()
                const childNode = []
                for (const checkNode of checkNodes) {
                    if (checkNode.parentid == nodeId) {
                        childNode.push(checkNode)
                    }
                }
                if (childNode.length > 0) {
                    for (const child of childNode) {
                        this.$refs.menuTree.setChecked(child.id, false)
                        this.cancelNodeChecked(child.id)
                    }
                }
            }
        }
    }
</script>
<style scoped>
    .basic_search{
        display:inline-block;
        padding-bottom: 10px;
    }
    .filter-container .filter-item{
        margin-bottom: 0;
    }
</style>

 src/views/instrumentData/index.vue

对比新文件
@@ -0,0 +1,375 @@
<template>
    <div class="app-container">
        <div class="filter-container">
            <div class="basic_search">
                <span>设备名称：</span>
                <el-input v-model="name" style="width:200px">
                </el-input>
            </div>
            <div class="basic_search">
                <span style="margin-left: 20px;">设备编号：</span>
                <el-select v-model="state" placeholder="请选择设备编号">
                    <el-option label="设备1" value="shanghai"></el-option>
                    <el-option label="设备2" value="beijing"></el-option>
                </el-select>
            </div>
            <el-button class="filter-item" style="margin-left: 10px;" type="primary" icon="el-icon-refresh" @click="refreshHandle">刷新</el-button>
            <el-button class="filter-item" style="margin-left: 10px;" type="primary" icon="el-icon-plus" @click="showCreateHandle">新增</el-button>
            <el-button class="filter-item" type="primary" icon="el-icon-search" @click="queryHandle" />
        </div>
        <div class="table_content">
            <el-table
                v-loading="listLoading"
                :key="tableKey"
                :data="roleData"
                border
                fit
                highlight-current-row
                style="width: 100%;"
            >
                <el-table-column label="设备编号" prop="number" align="center">
                    <template slot-scope="scope">
                        <span>{{ scope.row.number }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="设备名称" prop="name" align="center">
                    <template slot-scope="scope">
                        <span>{{ scope.row.name }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="仪表量程下限" prop="lowerLimit" align="center">
                    <template slot-scope="scope">
                        <span>{{ scope.row.lowerLimit }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="仪表量程上限" prop="upperLimit" align="center">
                    <template slot-scope="scope">
                        <span>{{ scope.row.upperLimit }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="高高液位报警值" prop=" highHighLiquid " align="center">
                    <template slot-scope="scope">
                        <span>{{ scope.row.highHighLiquid }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="高液位报警值" prop="highLiquid" align="center">
                    <template slot-scope="scope">
                        <span>{{ scope.row.highLiquid }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="低液位报警值" prop="lowliquid" align="center">
                    <template slot-scope="scope">
                        <span>{{ scope.row.lowliquid }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="低低液位报警值" prop="lowLowliquid" align="center">
                    <template slot-scope="scope">
                        <span>{{ scope.row.lowLowliquid }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="操作" align="center" width="280" class-name="small-padding fixed-width">
                    <template slot-scope="scope">
                        <el-button type="primary" size="mini" @click="showEditHandle(scope.row)">编辑</el-button>
                        <el-button type="danger" size="mini" @click="deleteHandle(scope.row)">删除</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <br>
        </div>
        <el-dialog :title="dialogStatus==='create'?'新增':'编辑'" :visible.sync="dialogFormVisible" :modal-append-to-body="false" :close-on-click-modal="false" width="700px">
            <el-form ref="dataForm" :rules="dataFormRules" :model="dataForm" label-position="right" label-width="120px" style="margin-left:50px;margin-right:50px;" element-loading-text="保存中...">
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="设备编号" prop="number">
                            <el-select v-model="dataForm.number" placeholder="请选择设备标号">
                                <el-option label="设备1" value="shanghai"></el-option>
                                <el-option label="设备2" value="beijing"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="仪表量下限" prop="volume">
                            <el-input v-model.trim="dataForm.volume"/>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="仪表量上限" prop="volume">
                            <el-input v-model.trim="dataForm.volume"/>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="高高液位报警值" prop="highHighLiquid">
                            <el-input v-model.trim="dataForm.highHighLiquid"/>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="高液位报警值" prop="highLiquid">
                            <el-input v-model.trim="dataForm.highLiquid"/>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="低液位报警值" prop="lowliquid">
                            <el-input v-model.trim="dataForm.lowliquid"/>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="低低液位报警值" prop="lowLowliquid">
                            <el-input v-model.trim="dataForm.lowLowliquid"/>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible = false">取消</el-button>
                <el-button type="primary" @click="dialogStatus==='create'?createHandle():updateHandle()">确认</el-button>
            </div>
        </el-dialog>
        <div style="clear: both;"/>
    </div>
</template>

<script>
    import { mapGetters } from 'vuex'
    import { roleList, createRole, deleteRole, updateRole, getRole, updateRolePermission} from '@/api/role'
    import { permissionList } from '@/api/permission'
    import { parseTime, computePageCount } from '@/utils'
    import { parseError } from '@/utils/messageDialog'
    import Cookies from 'js-cookie'
    import { Message, MessageBox } from 'element-ui'
    import { initRouter } from '@/utils/router'
    export default {
        name: 'RoleTable',
        filters: {
        },
        computed: {
            ...mapGetters([
                'userType'
            ])
        },
        data() {
            return {
                tableKey: 0,
                roleData: null,
                listLoading: true,
                dataForm: {
                    number: '',
                    name:'',
                    id: ''
                },
                queryForm: {
                    name: ''
                },
                dialogFormVisible: false,
                dialogStatus: '',
                dataFormRules: {
                    name: [{ required: true, message: '角色名不能为空', trigger: 'blur' }]
                },
                treeLoading: false,
                selectAllFlag: false,
                hasMenuTree: [],
                editRolePermId: '',
                company:'',
                region:'',
            }
        },
        created() {
            this.getRoleList()
        },
        methods: {
            getRoleList() {
                const _this = this
                const params = {}
                const userName = Cookies.get('userName')
                params['operator'] = userName
                for (const i in _this.queryForm) {
                    if (_this.queryForm[i] != undefined && _this.queryForm[i].toString() != '') {
                        params[i] = _this.queryForm[i]
                    }
                }
                _this.listLoading = true
                roleList(params).then(response => {
                    const res = response.data
                    if (res.code == 200) {
                        _this.roleData = res.result
                    } else {
                        parseError({ error: res.message, vm: _this })
                    }
                    _this.listLoading = false
                }).catch(error => {
                    _this.listLoading = false
                    parseError({ error: error, vm: _this })
                })
            },
            createHandle: function() {
                const _this = this
                this.$refs['dataForm'].validate((valid) => {
                    if (valid) {
                        const userName = Cookies.get('userName')
                        _this.dataForm['operator'] =userName
                        createRole(_this.dataForm).then(response => {
                            const res = response.data
                            if (res.code == 200) {
                                _this.dialogFormVisible = false
                                _this.$message({
                                    message: '创建成功',
                                    type: 'success'
                                })
                                _this.getRoleList()
                            } else {
                                parseError({ error: res.message, vm: _this })
                            }
                        }).catch(error => {
                            parseError({ error: error, vm: _this })
                        })
                    }
                })
            },
            deleteHandle: function(row) {
                const _this = this
                MessageBox.confirm('确定删除角色' + row.name + '信息', '确定删除', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    _this.deleteAction(row)
                }).catch(() => {
                    console.log('已取消删除')
                })
            },
            deleteAction: function(row) {
                const _this = this
                const params = {}
                params['id'] = row.id
                const userName = Cookies.get('userName')
                params['operator'] = userName
                deleteRole(params).then(response => {
                    const res = response.data
                    if (res.code == 200) {
                        _this.$message({
                            message: '删除成功',
                            type: 'success'
                        })
                        _this.getRoleList()
                    } else {
                        parseError({ error: res.message, vm: _this })
                    }
                }).catch(error => {
                    parseError({ error: error, vm: _this })
                })
            },
            refreshHandle: function() {
                this.getRoleList()
            },
            queryHandle: function() {
                this.getRoleList()
            },
            resetDataForm() {
                this.dataForm = {
                    name: '',
                    id: '',
                }
            },
            showCreateHandle() {
                this.resetDataForm()
                this.dialogStatus = 'create'
                this.dialogFormVisible = true
                this.$nextTick(() => {
                    this.$refs['dataForm'].clearValidate()
                })
            },
            updateHandle() {
                this.$refs['dataForm'].validate((valid) => {
                    const _this = this
                    if (valid) {
                        const userName = Cookies.get('userName')
                        _this.dataForm['operator'] = userName
                        updateRole(_this.dataForm).then(response => {
                            const res = response.data
                            if (res.code == 200) {
                                _this.dialogFormVisible = false
                                _this.$message({
                                    message: '更新成功',
                                    type: 'success'
                                })
                                _this.getRoleList()
                            } else {
                                parseError({ error: res.message, vm: _this })
                            }
                        }).catch(error => {
                            parseError({ error: error, vm: _this })
                        })
                    }
                })
            },
            showEditHandle: function(row) {
                this.resetDataForm()
                this.dialogStatus = 'editor'
                this.dataForm.name = row.name
                this.dataForm.id = row.id
                this.dialogFormVisible = true
                this.$nextTick(() => {
                    this.$refs['dataForm'].clearValidate()
                })
            },
            handleSizeChange: function(val) {
                this.getRoleList()
            },
            handleCurrentChange: function(val) {
                this.getRoleList()
            },
            getPermissionList() {
                const _this = this
                const params = {}
                params['userId'] = Cookies.get('userId')
                permissionList(params).then(response => {
                    const res = response.data
                    if (res.code == 200) {
                    } else {
                        parseError({ error: res.message, vm: _this })
                    }
                })
            },
            setNodeChecked(nodeId) {
                const node = this.$refs.menuTree.getNode(nodeId)
                if (!node.checked) {
                    this.$refs.menuTree.setChecked(nodeId, true)
                }
                if (node) {
                    if (node.data.parentid == 0 || node.data.parentid) {
                        this.setNodeChecked(node.data.parentid)
                    }
                }
            },
            cancelNodeChecked(nodeId) {
                const checkNodes = this.$refs.menuTree.getCheckedNodes()
                const childNode = []
                for (const checkNode of checkNodes) {
                    if (checkNode.parentid == nodeId) {
                        childNode.push(checkNode)
                    }
                }
                if (childNode.length > 0) {
                    for (const child of childNode) {
                        this.$refs.menuTree.setChecked(child.id, false)
                        this.cancelNodeChecked(child.id)
                    }
                }
            }
        }
    }
</script>
<style scoped>
    .basic_search{
        display:inline-block;
        padding-bottom: 10px;
    }
    .filter-container .filter-item{
        margin-bottom: 0;
    }
</style>

 src/views/login/index.vue

@@ -1,7 +1,7 @@
<template>
    <div class="login-container">
        <div class="title-one">
            <span>拜城县众泰煤焦化有限公司</span>
            <span>拜城县众泰煤焦化有限公司1</span>
        </div>
        <div class="title-two">
            <span>智能化安全管理技术平台</span>

 src/views/productionEquipment/index.vue

对比新文件
@@ -0,0 +1,352 @@
<template>
    <div class="app-container">
        <div class="filter-container">
            <div class="basic_search">
                <span>设备名称：</span>
                <el-input v-model="name" style="width:200px">
                </el-input>
            </div>
            <div class="basic_search">
                <span style="margin-left: 20px;">状态：</span>
                <el-select v-model="state" placeholder="请选择状态">
                    <el-option label="在用" value="shanghai"></el-option>
                    <el-option label="废弃" value="beijing"></el-option>
                </el-select>
            </div>
            <el-button class="filter-item" style="margin-left: 10px;" type="primary" icon="el-icon-refresh" @click="refreshHandle">刷新</el-button>
            <el-button class="filter-item" style="margin-left: 10px;" type="primary" icon="el-icon-plus" @click="showCreateHandle">新增</el-button>
            <el-button class="filter-item" type="primary" icon="el-icon-search" @click="queryHandle" />
        </div>
        <div class="table_content">
            <el-table
                v-loading="listLoading"
                :key="tableKey"
                :data="roleData"
                border
                fit
                highlight-current-row
                style="width: 100%;"
            >
                <el-table-column label="设备编号" prop="number" align="center">
                    <template slot-scope="scope">
                        <span>{{ scope.row.number }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="设备名称" prop="name" align="center">
                    <template slot-scope="scope">
                        <span>{{ scope.row.name }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="状态" prop="state" align="center">
                    <template slot-scope="scope">
                        <span>{{ scope.row.state }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="容积" prop="volume" align="center">
                    <template slot-scope="scope">
                        <span>{{ scope.row.volume }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="负责人" prop="responsible" align="center">
                    <template slot-scope="scope">
                        <span>{{ scope.row.responsible }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="操作" align="center" width="280" class-name="small-padding fixed-width">
                    <template slot-scope="scope">
                        <el-button type="primary" size="mini" @click="showEditHandle(scope.row)">编辑</el-button>
                        <el-button type="danger" size="mini" @click="deleteHandle(scope.row)">删除</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <br>
        </div>
        <el-dialog :title="dialogStatus==='create'?'新增':'编辑'" :visible.sync="dialogFormVisible" :modal-append-to-body="false" :close-on-click-modal="false" width="700px">
            <el-form ref="dataForm" :rules="dataFormRules" :model="dataForm" label-position="right" label-width="100px" style="margin-left:50px;width:500px;" element-loading-text="保存中...">
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="设备编号" prop="number">
                            <el-input v-model.trim="dataForm.number"/>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="设备名称" prop="name">
                            <el-input v-model.trim="dataForm.name"/>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="状态:" prop="state">
<!--                            <el-select v-model.trim="dataForm.region" placeholder="请选择状态" multiple style="width:100%;" clearable>-->
<!--                                <el-option label="在用"/>-->
<!--                                <el-option label="废弃"/>-->
<!--                            </el-select>-->
                            <el-select v-model="dataForm.state" placeholder="请选择状态">
                                <el-option label="在用" value="shanghai"></el-option>
                                <el-option label="废弃" value="beijing"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="容积" prop="volume">
                            <el-input v-model.trim="dataForm.volume"/>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="负责人" prop="responsible">
                            <el-input v-model.trim="dataForm.responsible"/>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible = false">取消</el-button>
                <el-button type="primary" @click="dialogStatus==='create'?createHandle():updateHandle()">确认</el-button>
            </div>
        </el-dialog>
        <div style="clear: both;"/>
    </div>
</template>

<script>
    import { mapGetters } from 'vuex'
    import { roleList, createRole, deleteRole, updateRole, getRole, updateRolePermission} from '@/api/role'
    import { permissionList } from '@/api/permission'
    import { parseTime, computePageCount } from '@/utils'
    import { parseError } from '@/utils/messageDialog'
    import Cookies from 'js-cookie'
    import { Message, MessageBox } from 'element-ui'
    import { initRouter } from '@/utils/router'
    export default {
        name: 'RoleTable',
        filters: {
        },
        computed: {
            ...mapGetters([
                'userType'
            ])
        },
        data() {
            return {
                tableKey: 0,
                roleData: null,
                listLoading: true,
                dataForm: {
                    number: '',
                    name:'',
                    id: ''
                },
                queryForm: {
                    name: ''
                },
                dialogFormVisible: false,
                dialogStatus: '',
                dataFormRules: {
                    name: [{ required: true, message: '角色名不能为空', trigger: 'blur' }]
                },
                treeLoading: false,
                selectAllFlag: false,
                hasMenuTree: [],
                editRolePermId: '',
                company:'',
                region:'',
            }
        },
        created() {
            this.getRoleList()
        },
        methods: {
            getRoleList() {
                const _this = this
                const params = {}
                const userName = Cookies.get('userName')
                params['operator'] = userName
                for (const i in _this.queryForm) {
                    if (_this.queryForm[i] != undefined && _this.queryForm[i].toString() != '') {
                        params[i] = _this.queryForm[i]
                    }
                }
                _this.listLoading = true
                roleList(params).then(response => {
                    const res = response.data
                    if (res.code == 200) {
                        _this.roleData = res.result
                    } else {
                        parseError({ error: res.message, vm: _this })
                    }
                    _this.listLoading = false
                }).catch(error => {
                    _this.listLoading = false
                    parseError({ error: error, vm: _this })
                })
            },
            createHandle: function() {
                const _this = this
                this.$refs['dataForm'].validate((valid) => {
                    if (valid) {
                        const userName = Cookies.get('userName')
                        _this.dataForm['operator'] =userName
                        createRole(_this.dataForm).then(response => {
                            const res = response.data
                            if (res.code == 200) {
                                _this.dialogFormVisible = false
                                _this.$message({
                                    message: '创建成功',
                                    type: 'success'
                                })
                                _this.getRoleList()
                            } else {
                                parseError({ error: res.message, vm: _this })
                            }
                        }).catch(error => {
                            parseError({ error: error, vm: _this })
                        })
                    }
                })
            },
            deleteHandle: function(row) {
                const _this = this
                MessageBox.confirm('确定删除角色' + row.name + '信息', '确定删除', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    _this.deleteAction(row)
                }).catch(() => {
                    console.log('已取消删除')
                })
            },
            deleteAction: function(row) {
                const _this = this
                const params = {}
                params['id'] = row.id
                const userName = Cookies.get('userName')
                params['operator'] = userName
                deleteRole(params).then(response => {
                    const res = response.data
                    if (res.code == 200) {
                        _this.$message({
                            message: '删除成功',
                            type: 'success'
                        })
                        _this.getRoleList()
                    } else {
                        parseError({ error: res.message, vm: _this })
                    }
                }).catch(error => {
                    parseError({ error: error, vm: _this })
                })
            },
            refreshHandle: function() {
                this.getRoleList()
            },
            queryHandle: function() {
                this.getRoleList()
            },
            resetDataForm() {
                this.dataForm = {
                    name: '',
                    id: '',
                }
            },
            showCreateHandle() {
                this.resetDataForm()
                this.dialogStatus = 'create'
                this.dialogFormVisible = true
                this.$nextTick(() => {
                    this.$refs['dataForm'].clearValidate()
                })
            },
            updateHandle() {
                this.$refs['dataForm'].validate((valid) => {
                    const _this = this
                    if (valid) {
                        const userName = Cookies.get('userName')
                        _this.dataForm['operator'] = userName
                        updateRole(_this.dataForm).then(response => {
                            const res = response.data
                            if (res.code == 200) {
                                _this.dialogFormVisible = false
                                _this.$message({
                                    message: '更新成功',
                                    type: 'success'
                                })
                                _this.getRoleList()
                            } else {
                                parseError({ error: res.message, vm: _this })
                            }
                        }).catch(error => {
                            parseError({ error: error, vm: _this })
                        })
                    }
                })
            },
            showEditHandle: function(row) {
                this.resetDataForm()
                this.dialogStatus = 'editor'
                this.dataForm.name = row.name
                this.dataForm.id = row.id
                this.dialogFormVisible = true
                this.$nextTick(() => {
                    this.$refs['dataForm'].clearValidate()
                })
            },
            handleSizeChange: function(val) {
                this.getRoleList()
            },
            handleCurrentChange: function(val) {
                this.getRoleList()
            },
            getPermissionList() {
                const _this = this
                const params = {}
                params['userId'] = Cookies.get('userId')
                permissionList(params).then(response => {
                    const res = response.data
                    if (res.code == 200) {
                    } else {
                        parseError({ error: res.message, vm: _this })
                    }
                })
            },
            setNodeChecked(nodeId) {
                const node = this.$refs.menuTree.getNode(nodeId)
                if (!node.checked) {
                    this.$refs.menuTree.setChecked(nodeId, true)
                }
                if (node) {
                    if (node.data.parentid == 0 || node.data.parentid) {
                        this.setNodeChecked(node.data.parentid)
                    }
                }
            },
            cancelNodeChecked(nodeId) {
                const checkNodes = this.$refs.menuTree.getCheckedNodes()
                const childNode = []
                for (const checkNode of checkNodes) {
                    if (checkNode.parentid == nodeId) {
                        childNode.push(checkNode)
                    }
                }
                if (childNode.length > 0) {
                    for (const child of childNode) {
                        this.$refs.menuTree.setChecked(child.id, false)
                        this.cancelNodeChecked(child.id)
                    }
                }
            }
        }
    }
</script>
<style scoped>
    .basic_search{
        display:inline-block;
        padding-bottom: 10px;
    }
    .filter-container .filter-item{
        margin-bottom: 0;
    }
</style>