|
|
@@ -0,0 +1,480 @@
|
|
|
+<template>
|
|
|
+<div>
|
|
|
+ <el-card class="box-card" style="height: calc(100vh - 92px);">
|
|
|
+ <div slot="header" style="height: 20px;">
|
|
|
+ <span style="float: left;">
|
|
|
+ <i class="icon icon-table2"></i>
|
|
|
+ </span>
|
|
|
+ <el-breadcrumb class="heading" style="float: left; margin-left: 5px">
|
|
|
+ <el-breadcrumb-item :to="{ path: '/' }">平台首页</el-breadcrumb-item>
|
|
|
+ <el-breadcrumb-item :to="{ path: '/system/module' }">菜单管理</el-breadcrumb-item>
|
|
|
+ </el-breadcrumb>
|
|
|
+ <span style="float: right;">
|
|
|
+ <el-button size="mini" type="primary" style="margin-left:10px; margin-top: -4px;" @click="opendatadialog(1,null,-1);resetForm('moduleform')">新增菜单</el-button>
|
|
|
+ </span>
|
|
|
+ <el-form ref="form" :inline="true" style="float: right; margin-top: -10px">
|
|
|
+ <el-form-item label="菜单名称">
|
|
|
+ <el-input size="mini" style="width: 165px;" v-model="keyword" placeholder="请输入菜单名称"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-dropdown split-button type="primary" size="mini" @click="seachdata" @command="searchCommand">
|
|
|
+ 查询
|
|
|
+ <el-dropdown-menu slot="dropdown">
|
|
|
+ <!-- <el-dropdown-item command="search">高级查询</el-dropdown-item> -->
|
|
|
+ <el-dropdown-item command="clear">查询重置</el-dropdown-item>
|
|
|
+ </el-dropdown-menu>
|
|
|
+ </el-dropdown>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-tree highlight-current="true" :expand-on-click-node="true" node-key="id" :data="moduletreelist" :props="orgtreeprops" :default-expanded-keys="userdepartment"
|
|
|
+ @node-click="orgtreeNodeClick" ref="orgmanagetree">
|
|
|
+ </el-tree>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="18">
|
|
|
+ <el-table :data="tablelist" border>
|
|
|
+ <el-table-column label="操作" width="70" align="center">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <template v-if="scope.row.Parentid !== 0">
|
|
|
+ <el-button size="small" type="text" @click="opendatadialog(2,scope.row,scope.$index);resetForm('moduleform')" icon="el-icon-edit"
|
|
|
+ title="编辑"></el-button>
|
|
|
+ <el-button size="small" type="text" @click="deletedata(scope.row)" icon="el-icon-delete" title="删除" style="margin-left: 3px"></el-button>
|
|
|
+ <!--暂时隐藏-->
|
|
|
+ <el-button v-if="1==2" size="small" type="success" @click="permission(scope.row)">权限</el-button>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="Fullname" align="center" label="菜单名称" show-overflow-tooltip></el-table-column>
|
|
|
+ <el-table-column prop="Parentname" align="center" label="上级菜单" show-overflow-tooltip></el-table-column>
|
|
|
+ <el-table-column prop="NavigateUrl" align="center" label="菜单地址" show-overflow-tooltip></el-table-column>
|
|
|
+ <el-table-column prop="ImageIndex" align="center" label="菜单图标" show-overflow-tooltip></el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <!--分页-->
|
|
|
+ <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" :page-sizes="[10, 15, 20, 25]"
|
|
|
+ :page-size="size" layout="total, sizes, prev, pager, next, jumper" :total="currentItemCount">
|
|
|
+ </el-pagination>
|
|
|
+ </el-card>
|
|
|
+ <!--新增、编辑组织信息-->
|
|
|
+ <el-dialog :title="dialogtitle" :visible.sync="datadialogVisible" top="5vh">
|
|
|
+ <el-form :model="moduleform" :rules="rulesorganize" ref="moduleform">
|
|
|
+ <el-form-item label="上级菜单" label-width="120px" required>
|
|
|
+ <el-cascader :options="moduletreelist" :props="orgtreeprops" change-on-select :show-all-levels="false" v-model="selectedorg"
|
|
|
+ placeholder="请选择菜单"></el-cascader>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="菜单名称" prop="fullname" label-width="120px">
|
|
|
+ <el-input v-model="moduleform.fullname" auto-complete="off"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="菜单地址" prop="NavigateUrl" label-width="120px">
|
|
|
+ <el-input v-model="moduleform.NavigateUrl" auto-complete="off"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="菜单图标" prop="ImageIndex" label-width="120px">
|
|
|
+ <el-input v-model="moduleform.ImageIndex" auto-complete="off"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="datadialogVisible = false">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="savedata('moduleform')">确 定</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <el-dialog :title="permissiondialogtitle" :visible.sync="permissiondatadialogVisible" top="5vh">
|
|
|
+ <el-form ref="alertform">
|
|
|
+ <el-form-item>
|
|
|
+ <div style="margin-left:1px;border:1px #CCCCCC solid;overflow:auto;height:300px;">
|
|
|
+ <el-checkbox-group v-model="binddevices">
|
|
|
+ <el-checkbox v-for="item in devices" :label="item.Id" :key="item.Id" style="margin-left:15px;">{{item.Code}}</el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+ </div>
|
|
|
+ <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" style="margin-left:15px;">全选</el-checkbox>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer" class="dialog-footer" style="margin-top:-35px;">
|
|
|
+ <el-button @click="permissiondatadialogVisible = false">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="savepermission()">确 定</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import {
|
|
|
+ mapGetters
|
|
|
+ } from 'vuex'
|
|
|
+ export default {
|
|
|
+ name: 'organize',
|
|
|
+
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ downloading: true,
|
|
|
+ selectedNode: 0,
|
|
|
+ currentItemCount: 0,
|
|
|
+ currentPage: 1,
|
|
|
+ size: 10,
|
|
|
+ tablelist: [], // 处理分页用
|
|
|
+ keyword: '',
|
|
|
+ parentid: '',
|
|
|
+ datadialogVisible: false,
|
|
|
+ dialogtitle: '',
|
|
|
+ moduleform: {
|
|
|
+ parentid: 0,
|
|
|
+ fullname: '',
|
|
|
+ description: '',
|
|
|
+ NavigateUrl:'',
|
|
|
+ ImageIndex:'',
|
|
|
+ id: 0
|
|
|
+ },
|
|
|
+ rulesorganize: {
|
|
|
+ fullname: [{
|
|
|
+ required: true,
|
|
|
+ message: '请输入菜单名称',
|
|
|
+ trigger: 'blur'
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ operatingitem: 0,
|
|
|
+ permissiondialogtitle: '',
|
|
|
+ permissiondatadialogVisible: false,
|
|
|
+ binddevices: [],
|
|
|
+ devices: [],
|
|
|
+ devicesallid: [],
|
|
|
+ isIndeterminate: true,
|
|
|
+ checkAll: false,
|
|
|
+ update: true,
|
|
|
+ childArr: [],
|
|
|
+ parentArr: [],
|
|
|
+ // 级联选项
|
|
|
+ options: [],
|
|
|
+ currentOrgan: '请选择菜单',
|
|
|
+ havechild: false,
|
|
|
+ // 数据传输
|
|
|
+ currId: 0,
|
|
|
+ currOrganName: '',
|
|
|
+ moduletreelist: [],
|
|
|
+ orgtreeprops: {
|
|
|
+ value: 'id',
|
|
|
+ label: 'Fullname',
|
|
|
+ children: 'children'
|
|
|
+ },
|
|
|
+ selectedorg: [],
|
|
|
+ userdepartment: []
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ created() {
|
|
|
+ // initial data
|
|
|
+ this.initData()
|
|
|
+ this.getmoduletreelist()
|
|
|
+ },
|
|
|
+ updated() {},
|
|
|
+ watch: {},
|
|
|
+ computed: mapGetters({
|
|
|
+ authUser: 'authUser'
|
|
|
+ }),
|
|
|
+ methods: {
|
|
|
+ initData() {
|
|
|
+ let _this = this
|
|
|
+ // paginate
|
|
|
+ let params = {
|
|
|
+ _currentPage: this.currentPage,
|
|
|
+ _size: this.size,
|
|
|
+ keyword: this.keyword,
|
|
|
+ parentid: this.parentid,
|
|
|
+ }
|
|
|
+ // request
|
|
|
+ this.$axios.get('/module/listbandparentname', {
|
|
|
+ params
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ console.log("======res.data.items1=====",res.data.items)
|
|
|
+ // response
|
|
|
+ _this.tablelist = res.data.items
|
|
|
+ _this.currentItemCount = res.data.currentItemCount
|
|
|
+ _this.downloading = false
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ // handle error
|
|
|
+ console.error(err)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getmoduletreelist() {
|
|
|
+ let _this = this
|
|
|
+ // request
|
|
|
+ _this.$axios.get('/module/list', {
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ console.log("======res.data.items2=====",res.data.items)
|
|
|
+ _this.moduletreelist = window.toolfun_gettreejson(res.data.items, 'Id', 'Parentid', 'Id,Fullname')
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ // handle error
|
|
|
+ console.error(err)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ orgtreeNodeClick(data) {
|
|
|
+ this.parentid = data.id + ''
|
|
|
+ this.currentPage = 1
|
|
|
+ this.initData()
|
|
|
+ },
|
|
|
+ seachdata() {
|
|
|
+ this.currentPage = 1
|
|
|
+ this.initData()
|
|
|
+ },
|
|
|
+ permission(v) {
|
|
|
+ this.binddevices = []
|
|
|
+ this.permissiondialogtitle = '权限设置'
|
|
|
+ this.permissiondatadialogVisible = true
|
|
|
+ this.currId = v.Id
|
|
|
+ this.currOrganName = v.Fullname
|
|
|
+ this.$axios.get('/equipment/bindequipment/' + this.currId, null)
|
|
|
+ .then(res => {
|
|
|
+ // response
|
|
|
+ for (var i = 0; i < res.data.items.length; i++) {
|
|
|
+ this.binddevices.push(res.data.items[i].Id)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ // handle error
|
|
|
+ console.error(err)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ savepermission() {
|
|
|
+ let _this = this
|
|
|
+ _this.$axios.put('/equipment/permission/' + this.currId, {
|
|
|
+ EquipmentIds: this.binddevices + '',
|
|
|
+ OrganizeName: this.currOrganName
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ // response
|
|
|
+ if (res.data.code === 0) {
|
|
|
+ _this.$message({
|
|
|
+ type: 'success',
|
|
|
+ message: res.data.message
|
|
|
+ })
|
|
|
+ _this.permissiondatadialogVisible = false
|
|
|
+ } else {
|
|
|
+ _this.$message({
|
|
|
+ type: 'warning',
|
|
|
+ message: res.data.message
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(() => {})
|
|
|
+ },
|
|
|
+ handleSizeChange(value) {
|
|
|
+ this.size = value
|
|
|
+ this.currentPage = 1
|
|
|
+ this.initData()
|
|
|
+ },
|
|
|
+ handleCurrentChange(value) {
|
|
|
+ this.currentPage = value
|
|
|
+ this.initData()
|
|
|
+ },
|
|
|
+ jstimehandle(val) {
|
|
|
+ val = val.replace('T', ' ')
|
|
|
+ return val.substring(0, 19)
|
|
|
+ },
|
|
|
+ opendatadialog(item, v, index) {
|
|
|
+ this.operatingitem = item
|
|
|
+ this.datadialogVisible = true
|
|
|
+ this.clearorganizeform()
|
|
|
+ let _this = this
|
|
|
+ if (item === 1) {
|
|
|
+ _this.dialogtitle = `新增菜单`
|
|
|
+ if (this.parentid !== '') {
|
|
|
+ this.$axios.get('/module/parentlist/' + this.parentid, {})
|
|
|
+ .then(res => {
|
|
|
+ if (res.data.code === 0) {
|
|
|
+ // 选中状态
|
|
|
+ _this.selectedorg = []
|
|
|
+ let pidarr = res.data.message.split(',')
|
|
|
+ for (var i = pidarr.length - 1; i >= 0; i--) {
|
|
|
+ if (pidarr[i] !== '0') {
|
|
|
+ _this.selectedorg.push(parseInt(pidarr[i]))
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ _this.$message({
|
|
|
+ type: 'warning',
|
|
|
+ message: '出现错误!'
|
|
|
+ })
|
|
|
+ this.datadialogVisible = false
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ // handle error
|
|
|
+ console.error(err)
|
|
|
+ })
|
|
|
+ }
|
|
|
+ } else if (item === 2) {
|
|
|
+ this.$axios.get('/module/parentlist/' + v.Parentid, {})
|
|
|
+ .then(res => {
|
|
|
+ if (res.data.code === 0) {
|
|
|
+ _this.dialogtitle = `编辑菜单信息(${v.Fullname})`
|
|
|
+ _this.moduleform.parentid = v.Parentid
|
|
|
+ _this.moduleform.fullname = v.Fullname
|
|
|
+ _this.moduleform.description = v.Description
|
|
|
+ _this.moduleform.id = v.Id
|
|
|
+ _this.moduleform.NavigateUrl = v.NavigateUrl
|
|
|
+ _this.moduleform.ImageIndex =v.ImageIndex
|
|
|
+ _this.selectedorg.push(parseInt(v.Parentid))
|
|
|
+ } else {
|
|
|
+ _this.$message({
|
|
|
+ type: 'warning',
|
|
|
+ message: '出现错误!'
|
|
|
+ })
|
|
|
+ this.datadialogVisible = false
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ // handle error
|
|
|
+ console.error(err)
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ savedata(formName) {
|
|
|
+ let _this = this
|
|
|
+ this.$refs[formName].validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ _this.moduleform.parentid = parseInt(_this.selectedorg[_this.selectedorg.length - 1])
|
|
|
+ if (_this.moduleform.parentid === 0) {
|
|
|
+ _this.$message({
|
|
|
+ type: 'warning',
|
|
|
+ message: '请选择上一级组织!'
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (_this.moduleform.parentid === _this.moduleform.id) {
|
|
|
+ _this.$message({
|
|
|
+ type: 'warning',
|
|
|
+ message: '上一级组织不能为自身数据!'
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (_this.operatingitem === 1) {
|
|
|
+ _this.$axios.post('module/', _this.moduleform)
|
|
|
+ .then(res => {
|
|
|
+ // response
|
|
|
+ if (res.data.code === 0) {
|
|
|
+ _this.$message({
|
|
|
+ type: 'success',
|
|
|
+ message: res.data.message
|
|
|
+ })
|
|
|
+ _this.datadialogVisible = false
|
|
|
+ this.initData()
|
|
|
+ // 重新加载tree数据
|
|
|
+ _this.getmoduletreelist()
|
|
|
+ } else {
|
|
|
+ _this.$message({
|
|
|
+ type: 'warning',
|
|
|
+ message: res.data.message
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ // handle error
|
|
|
+ console.error(err)
|
|
|
+ })
|
|
|
+ } else if (_this.operatingitem === 2) {
|
|
|
+ _this.$axios.put('module/' + _this.moduleform.id, _this.moduleform)
|
|
|
+ .then(res => {
|
|
|
+ // response
|
|
|
+ if (res.data.code === 0) {
|
|
|
+ _this.$message({
|
|
|
+ type: 'success',
|
|
|
+ message: res.data.message
|
|
|
+ })
|
|
|
+ _this.datadialogVisible = false
|
|
|
+ // 更新界面
|
|
|
+ _this.initData()
|
|
|
+ // 重新加载tree数据
|
|
|
+ _this.getmoduletreelist()
|
|
|
+ } else {
|
|
|
+ _this.$message({
|
|
|
+ type: 'warning',
|
|
|
+ message: res.data.message
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(() => {})
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ deletedata(val) {
|
|
|
+ let _this = this
|
|
|
+ _this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ _this.$axios.delete('module/' + val.Id, null)
|
|
|
+ .then(res => {
|
|
|
+ // response
|
|
|
+ if (res.data.code === 0) {
|
|
|
+ _this.$message({
|
|
|
+ type: 'success',
|
|
|
+ message: res.data.message
|
|
|
+ })
|
|
|
+ // 更新界面
|
|
|
+ _this.initData()
|
|
|
+ // 重新加载tree数据
|
|
|
+ _this.getmoduletreelist()
|
|
|
+ } else {
|
|
|
+ _this.$message({
|
|
|
+ type: 'warning',
|
|
|
+ message: res.data.message
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(() => {})
|
|
|
+ }).catch(() => {})
|
|
|
+ },
|
|
|
+ resetForm(formName) {
|
|
|
+ //this.$refs[formName].resetFields()
|
|
|
+ },
|
|
|
+ clearorganizeform() {
|
|
|
+ this.moduleform = {
|
|
|
+ parentid: 0,
|
|
|
+ fullname: '',
|
|
|
+ description: '',
|
|
|
+ NavigateUrl:'',
|
|
|
+ ImageIndex:'',
|
|
|
+ id: 0
|
|
|
+ }
|
|
|
+ },
|
|
|
+ searchCommand(command) {
|
|
|
+ if (command == 'clear') {
|
|
|
+ this.clearSearch()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ clearSearch() {
|
|
|
+ this.keyword = ''
|
|
|
+ this.initData()
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+ .el-pagination {
|
|
|
+ margin: 1rem 0 2rem;
|
|
|
+ text-align: right;
|
|
|
+ }
|
|
|
+
|
|
|
+ .triggerone {
|
|
|
+ font-size: 13px;
|
|
|
+ margin-left: 80px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .plab {
|
|
|
+ font-size: 13px;
|
|
|
+ color: #999;
|
|
|
+ }
|
|
|
+
|
|
|
+</style>
|