fj-dc-ui/.svn/pristine/79/792e2c3ca2e73d46762fe72a74068974ac33007b.svn-base

<template>
  <div class="user-manage" style="width: 100%; height: 100%;">
    <div class="search-wrapper">
      <el-form ref="form" :inline="true" label-width="80px">
        <el-form-item label="菜单名称">
          <el-input v-model="searchObj.menuName" clearable></el-input>
        </el-form-item>
        <el-button type="primary" @click="getMenuList()">查询</el-button>
        <el-button type="primary" @click="toaddMenu()">添加</el-button>
      </el-form>
    </div>
    <el-table
      :data="menusList"
      border
      stripe
      :height="tableHeight"
      style="width: 100%;">
      <el-table-column
        prop="parentName"
        label="父菜单">
      </el-table-column>
      <el-table-column
        prop="menuName"
        label="菜单名称">
      </el-table-column>
      <!-- <el-table-column
        prop="ownerSystem"
        label="所属系统"
        width="220">
        <template slot-scope="scope">
          {{systemFilter(scope.row.ownerSystem)}}
        </template>
      </el-table-column> -->
      <el-table-column
        prop="sortLevel"
        label="菜单等级">
      </el-table-column>
      <el-table-column
        prop="sequence"
        label="菜单排序">
      </el-table-column>
      <el-table-column
        prop="href"
        label="超链接">
      </el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button
            size="mini"
            @click="handleEdit(scope.row)">编辑</el-button>
          <el-button
            size="mini"
            type="danger"
            @click="handleDelete(scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-pagination
      background
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page.sync="searchObj.pageNum"
      :page-sizes="[10, 20, 300, 40]"
      :page-size="searchObj.pageSize"
      layout="total, prev, pager, next"
      :total="total"
      style="margin: 10px auto">
    </el-pagination>
    <el-dialog :title="dialogTitle" :visible.sync="dialogFormVisible">
      <el-form :model="editMenu" label-width="120px">
        <el-form-item label="菜单名称">
          <el-input v-model="editMenu.menuName" auto-complete="off"></el-input>
        </el-form-item>
        <el-form-item label="父菜单">
          <el-input v-model="parentName" @focus="showMenuTree = true" auto-complete="off" clearable></el-input>
          <tree-x
          v-if="showMenuTree"
          @closeTree='closeTree'
          :treeInfos='menuList'
          :isChecked= "'tree'"
          :defaultProps="defaultProps"
          @sendMenuInfo="sendMenuInfo"></tree-x>
        </el-form-item>
        <el-form-item label="菜单排序">
          <el-input v-model="editMenu.sequence" auto-complete="off"></el-input>
        </el-form-item>
        <el-form-item label="菜单等级">
          <el-input v-model="editMenu.sortLevel" auto-complete="off"></el-input>
        </el-form-item>
        <el-form-item label="超链接">
          <el-input v-model="editMenu.href" auto-complete="off"></el-input>
        </el-form-item>
<!--        <el-form-item label="归属系统" v-if="dialogTitle == '添加'">-->
<!--          <el-select v-model="editMenu.ownerSystem" placeholder="请选择">-->
<!--            <el-option :label="system.name" :value="system.value" v-for="(system,index) in privDict.systemFlag" :key="index"></el-option>-->
<!--          </el-select>-->
<!--        </el-form-item>-->
        <el-form-item label="所属应用">
          <el-select v-model="editMenu.ownApp" multiple placeholder="请选择">
            <el-option :label="app.label" :value="app.value" v-for="(app,index) in ownAppOptions" :key="index"></el-option>
            <el-option label="日常检查" value="3"  key="3" v-if="isChengDu"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="权限标识" v-if="dialogTitle == '添加'">
          <el-input v-model="editMenu.code" auto-complete="off"></el-input>
        </el-form-item>
        <el-form-item label="是否叶子结点" v-if="dialogTitle == '添加'">
          <el-select v-model="editMenu.flagLeaf" placeholder="请选择">
            <el-option label="是" value="1"></el-option>
            <el-option label="否" value="0"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="updateMenuInfo">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
  import request from '../../utils/gw_ajax_request.js'
  import treeX from '../../widgets/treeX.vue'
  import {getTrees} from '../../utils/gw_treeDataTransfer.js'
  export default {
    data(){
      return {
        tableHeight: window.innerHeight - 210,
        menuData : 'user',
        menusList: [],
        total:0,
        searchObj: {
          menuName: '',
          pageSize: 20,
          pageNum: 1
        },
        editMenu:{
          menuName: '',
          id: '',
          parentId: '',
          sequence: '',
          sortLevel: '',
          href: '',
          code: '',
          ownerSystem: '',
          flagLeaf: '',
          ownApp: []
        },
        parentName: '',
        menuList: [],
        saveUrl: '',
        defaultProps:{
          children: 'children',
          label: 'menuName'
        },
        privDict: {},
        showMenuTree: false,
        dialogFormVisible: false,
        dialogTitle: '修改',
        ownAppOptions: [
          {label: '督查系统',value: '1'},
          {label: '稽察系统',value: '2'}
        ]
      }
    },
    components:{
      'tree-x': treeX
    },
    computed:{
      persId(){
        return localStorage.getItem('userid') ? localStorage.getItem('userid') : ''
      },
      isChengDu(){
          var path = window.location.href;
          return path.indexOf("221.237.107.122")>-1
      }
    },
    mounted(){
      this.getMenuList()
      this.getDict()
    },
    methods:{
      getMenuList(){
        this.searchObj['userId'] = this.persId
        request.post('/sys/menus/list-by-user',this.searchObj).then((res)=>{
            if(res.success){
              this.menusList = res.data.list
              this.total = res.data.total
            }else{
              this.$message.warning(res.message)
            }
        }).catch(error=>{
          this.$message.error(error)
        })
      },
      getMenusList(){
        request.post('/sys/menus/list-by-user',{'userId': this.persId,'pageSize': 500}).then(res=>{
          if(res.success){
            this.menuList = res.data.list
            this.menuList.forEach(ele=>{
              if(!ele.parentId){
                ele.parentId = '0'
              }
            })
            this.menuList = getTrees(this.menuList,'0')
            console.log(this.menuList)
          }
        }).catch(error=>{

        })
      },
      handleEdit(rowData){
        this.dialogTitle = '修改'
        let row = {}
        Object.assign(row,rowData)
        this.editMenu = row
        this.parentName = row.parentName
        this.editMenu.ownApp = this.editMenu.ownApp ? this.editMenu.ownApp.split(',') : this.editMenu.ownApp
        this.saveUrl = `/sys/menus/update-menu-priv`
        this.getMenusList()
        this.dialogFormVisible = true
      },
      toaddMenu(){
        this.dialogTitle = '添加'
        for(var obj in this.editMenu){
          this.editMenu[obj] = ''
        }
        this.editMenu.ownApp = []
        this.parentName = ''
        this.saveUrl = `/sys/menus/insert-menu-priv`
        this.getMenusList()
        delete this.editMenu.id
        this.dialogFormVisible = true
      },
      updateMenuInfo(){
        this.editMenu.privUri = this.editMenu.href
        this.editMenu.ownApp = this.editMenu.ownApp ? this.editMenu.ownApp.join(',') : this.editMenu.ownApp
        this.editMenu.parentId = this.editMenu.parentId == '' || this.editMenu.parentId == '0' || this.parentName == '' ? 0 : this.editMenu.parentId
        this.editMenu['parentName'] = this.parentName ? this.parentName : ''
        this.editMenu.ownerSystem = "DC_ALL";
          request.post(this.saveUrl,this.editMenu).then(res=>{
          if(res.success){
            this.$message.success('保存成功')
            this.getMenuList()
            this.editMenu.parentId = ''
            this.dialogFormVisible = false
          }else{
            this.$message.warning(res.message)
          }
        }).catch(error=>{
          // this.$message.error(error)
        })
      },
      handleDelete(rowData){
        this.$confirm('确认删除当前权限?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          request.post(`/sys/menus/delete-menu-priv/${rowData.id}`).then(res=>{
            if(res.success){
              this.getMenuList()
              this.$message({
                type: 'success',
                message: '删除成功!'
              });
            }
          }).catch(error=>{

          })
        }).catch(() => {
        });
      },
      getDict(){
        request.get(`/sys/privs/getSysFlagByUserId?userId=${this.persId}`).then(res=>{
          if(res.success){
            this.privDict['systemFlag'] = res.data
          }else{
            this.$message.warning(res.message)
          }
        }).catch(error=>{
            this.$message.warning(res.message)
        })
      },
      systemFilter(item){
        let system
        this.privDict.systemFlag.forEach(ele=>{
          if(item == ele.value){
            system = ele.name
          }
        })
        return system
      },
      sendMenuInfo(data){
        this.editMenu.parentId = data.id
        this.parentName = data.menuName
      },
      closeTree(val){
        this.showMenuTree = val
      },
      handleSizeChange(val) {
        this.searchObj.pageSize = val
        this.getMenuList()
      },
      handleCurrentChange(val) {
        this.searchObj.pageNum = val
        this.getMenuList()
      }
    }
  }
</script>

<style scoped lang='scss'>
.user-manage{
  padding: 20px;
  box-sizing: border-box;
  .search-wrapper{

  }
}
</style>