vue主页

<template>
  <el-container class="el-cus-container" height="80px">
    <el-header class="el-cus-header" v-show="!maximize">
      <el-row :gutter="20" type="flex">
        <el-col :span="6">
          <span class="logo"></span>
          <span :class="expand?'menu-show':'menu-hide'" class="menu" @click="expand = !expand"></span>
        </el-col>
        <el-col :span="18">
          <span class="list">
            <span class="list" @click="createTab('任务中心','taskCenter')">任务中心</span>
          </span>
          <span class="list">
            Hi, {{userName}}
          </span>
          <span class="list" @click="dialogRole = true" v-if="roleLists.length">
            <i class="iconfont icon-role"></i> {{currentRoleName}}
          </span>
          <span class="list" @click="fullscreen">
            <i class="iconfont icon-quanping"></i>全屏</span>
          <span class="list" @click="logout">
            <i class="iconfont icon-logout"></i>退出</span>
        </el-col>
      </el-row>
    </el-header>

    <el-container class="el-cus-content">
      <el-aside class="el-cus-aside" v-show="!(maximize||!expand)" width="580px" :style="asideStyle">
        <nav-menu>
          <nav-menu-item v-for="(item,index) in menus" :key="item.moduleId" :item="item" :index="index" @selected="selected" @click="addShortcutMenu" :size="menus.length" />
        </nav-menu>
      </el-aside>
      <el-main :class="!(maximize||!expand)?'el-cus-main':'el-cus-main-max'">
        <el-tabs type="border-card" closable @tab-click="handleClick" @tab-remove="handleRemove" :active-name="tab" :style="tabsStyle">
          <el-tab-pane v-for="item in tabs" :key="item.title" :label="item.title" :name="item.title">
            <div :is="item.content" @page="createTab" :btns="item.btns"></div>
          </el-tab-pane>
        </el-tabs>
      </el-main>
    </el-container>

    <el-dialog title="选择角色" :visible.sync="dialogRole">
      <el-select v-model="currentRoleIdTemp" placeholder="请选择角色" style="display:block">
        <el-option v-for="item in roleLists" :key="item.roleId" :label="item.roleName" :value="item.roleId">
          <span style="float: left">{{ item.roleName }}</span>
        </el-option>
      </el-select>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogRole = false">取 消</el-button>
        <el-button type="primary" @click="switchRole">确 定</el-button>
      </span>
    </el-dialog>

    <el-dialog title="编辑快捷入口" :visible.sync="dialogMenu" width="550px" center>
      <div>
        <el-transfer v-model="shortcutMenus" :data="systemMenus" :titles="['系统菜单','快捷入口']" :props="{key: 'moduleId',label: 'moduleName'}"></el-transfer>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogMenu = false">取 消</el-button>
        <el-button type="primary" @click="dialogMenu = false">确 定</el-button>
      </span>
    </el-dialog>
  </el-container>

</template>

<script>
import navMenu from './navMenu'
import navMenuItem from './navMenuItem'
import store from 'store'
import getSelectBaseData from 'common/js/getSelectBaseData.js'

const homePage = {
  title: '首页',
  name: '首页',
  content: 'homePage',
  btns: {}
}

export default {
  data() {
    return {
      expand: true,
      maximize: false,
      clientHeight: document.documentElement.clientHeight,
      headerHeight: 45,
      tabs: [homePage],
      tab: '首页',
      menus: [
        {
          badge: 0,
          childModules: [],
          moduleCode: 'hos_Seting',
          moduleIcon: 'iconfont icon-structrue',
          moduleId: 0,
          moduleName: '\u5feb\u6377\u5165\u53e3',
          parent: null,
          parentId: 2,
          sort: 4
        }
      ],
      shortcutMenus: [],
      menuComponent: {
        首页: 'homePage',
        数据字典: 'dataDictionary',
        角色列表: 'roleList',
        用户列表: 'userList',
        功能列表: 'functionList',
        我的测试页面: 'myTest',
        iframe模式打开: 'iframeContent',
        静态资源列表: 'staticModuleList',
        接口联调入口: 'rapCompare', //模块太大，请按需放开
        报关批次管理: 'cusbatchMng',
        计量单位校验维护: 'calibrationUnit',
        同步审核管理: 'synchAudit',
        商品编码管理: 'productList',
        跨境申报限制: 'cbeDeclareLimite',
        '商品编码列表(跨境电商)': 'crossGoodsList',
        计量单位列表: 'expUnitCodeList',
        申报要素管理列表: 'hsCodeElementsList',
        个人物品税号管理列表: 'personalHSCodeList',
        汇率设置管理: 'exchangeSetting',
        敏感资料管理: 'sensitiveList',
        报关部门管理: 'customDept',
        台湾统编码管理: 'unionNoList',
        税金类别对应付款方式管理: 'taxSortPayment',
        规格型号: 'specificationModel',
        经营单位管理: 'businessUnit',
        经营单位匹配方式管理: 'businessUnitMatch',
        大陆税金管理: 'taxDLManager',
        电商税金账号管理: 'taxAcct',
        大客户标识: 'customerVipSign',
        地区时差管理: 'areaTimeDifference',
        地区基础管理: 'areaManage',
        省市区代码管理: 'provinceCodeManage',
        车次管理: 'carNumberManage',
        港澳台商品税金管理: 'gattaxList',
        报关类型管理: 'customTypeList',
        批次车次对应地区管理: 'carBatchAreaManage',
        税金模板管理: 'abroadTaxModelManager',
        税金日志管理: 'taxLog',
        税金汇总: 'taxSummary',
        国际税金导入: 'abroadTaxImport',
        税金模板管理: 'abroadTaxModelManager',
        品名设置: 'GDescBak',
        单词设置: 'AuditWord',
        未替换品名统计: 'UnAuditWord',
        自动记录配置: 'AutoConfig',
        未审核品名: 'GDescUnAudit',
        海外税金查询: 'taxAbroad',
        清关计划: 'pregatePlan',
        清关任务: 'pregateTask',
        风险品名配置管理: 'sensitiveGoods',
        香港关务费用: 'hkAddFee',
        台湾关务费用: 'twAddFee',
        苹果DEC费用: 'apAddFee',
        EDI报关管理: 'ediReport',
        DIY模板配置: 'DIYTemplateConfiguration',
        D类税金管理: 'dTypeTax',
        逐票审改: 'reviewReferenceSingle',
        风险品名配置管理: 'sensitiveGoods',
        批量审改: 'customDataBatch',
        审单翻译处理: 'examTranslateHandle',
        证件数据管理: 'identityManage',
        图片下载: 'imageDownload',
        图片下载日志: 'imageDownloadLog',
        天猫品名匹配基础配置表管理: 'tmallAccs',
        统计未审运单: 'noAuditWaybillt',
        品名搜索: 'searchName',
        排货白名单: 'deliveryGoodsWhitelist',
        排货黑名单: 'deliveryGoodsBlacklist',
        清关能力: 'cusClearAbility',
        国际件组合口岸配置: 'abroadLabel',
        虚拟收寄信息: 'dummySRInfo',
        调重幅度配置: 'adjustWeightRange',
        调重规则配置: 'adjustRule',
        EDI按钮配置: 'ediBtnConfig',
        批量导出配置: 'batchExportConfig',
        件种配置表: 'expKindConfig',
        件种判断条件维护: 'expKindJudge',
        图片上传: 'imageUpload',
        图片上传日志: 'imageUploadLog',
        台湾件容器查询: 'queryTwContainer',
        台湾件车辆容器查询: 'queryTwVehicle',
        出口: 'exportExp',
        邮政编码管理: 'postManage',
        排货结果查询: 'scheduleGoodsResult',
        任务列表: 'taskList',
        进口: 'importExp',
        D类运单审核: 'dTypeAuditList',
        新快件系统配置: 'expConfig',
        打印报关单: 'printCustomsDeclaration',
        报关单模板配置: 'customsDeclarationPrintConf',
        汇总纳税查询: 'exp306Query',
        报关单税费查询: 'exp310Query',
        报关处理: 'customsManage',
        自动转口岸: 'toportVehicle',
        申报: 'toportDeclare',
        天猫关务品名: 'tmallCustom',
        口岸批量审改: 'portDataBatchModify',
        口岸逐票审改: 'portDataSignleModify',
        任务中心: 'taskCenter',
        短信发送模板配置: 'smsConfig',
        发送短信: 'sendSms',
        理货规则配置: 'tallyRule',
	公司管理:'companyManage',
  统计:'totalCustomManage',
        车牌航班管理:'carAndFlight',
   派件贴纸查询:'billTranslation',
	口岸自扣规则配置:'autoDetainedRule'
      },
      openedElement: [],
      roleLists: [],
      currentRoleIdTemp: '',
      dialogRole: false,
      dialogMenu: false,
      isMiniMenu: false
    }
  },
  beforeCreate() {
    this.$httpExt()
      .get('admin/checkLogin')
      .then(
        response => {
          let data = response.result
          this.$store.commit('setUserName', data.userName)
          this.getRoles()
          /**初始化埋点 */
          SfGather.uid = data.userName
          SfGather.init()
          //手动上报事件  pc登陆
          this.$sfgather().addUserEvent('pc_login')
          //加载公用下拉框的基础数据
          getSelectBaseData.getData(this)
        },
        response => {
          this.$notify.error({
            title: '异常',
            message: response.msg
          })
        }
      )
  },
  computed: {
    forwardModule() {
      return this.$store.state.global.forwardModule
    },
    asideStyle() {
      let maxHeight = this.clientHeight - 80 + 'px'
      let overflowY = 'auto'
      return {
        maxHeight,
        overflowY
      }
    },
    currentRoleName() {
      for (let i = 0; i < this.roleLists.length; i++) {
        if (this.roleLists[i].roleId == this.currentRoleId)
          return this.roleLists[i].roleName
      }
    },
    userName() {
      return this.$store.state.global.userName
    },
    currentRoleId() {
      return this.$store.state.global.roleId
    },
    systemMenus() {
      var childMenus = new Array()
      this.menus.forEach(item => {
        childMenus = childMenus.concat(item.childModules)
        if (item.childModules.length > 0) {
          item.childModules.forEach(childItem => {
            childMenus = childMenus.concat(childItem.childModules)
          })
        }
      })
      return childMenus
    },
    tabsStyle() {
      let height = this.clientHeight - this.headerHeight - 20 - 20 + 'px'
      let width = '100%'
      return {
        height,
        width
      }
    }
  },
  created() {
    let that = this
    this.$nextTick(function() {
      window.addEventListener('keyup', function(e) {
        // that.headerHeight = 45
        // that.maximize =
        //   that.maximize && e.code === 'Escape' ? false : that.maximize
      })
      document.addEventListener('fullscreenchange', function(e) {
        let isFullscreen =
          document.fullscreenElement ||
          document.mozFullScreenElement ||
          document.webkitFullscreenElement
        if (!isFullscreen) {
          that.headerHeight = 45
        }
        that.maximize = isFullscreen && that.maximize
      })
      document.addEventListener('mozfullscreenchange', function(event) {
        let isFullscreen =
          document.fullscreenElement ||
          document.mozFullScreenElement ||
          document.webkitFullscreenElement
        if (!isFullscreen) {
          that.headerHeight = 45
        }
        that.maximize = isFullscreen && that.maximize
      })
      document.addEventListener('webkitfullscreenchange', function(event) {
        let isFullscreen =
          document.fullscreenElement ||
          document.mozFullScreenElement ||
          document.webkitFullscreenElement
        if (!isFullscreen) {
          that.headerHeight = 45
        }
        that.maximize = isFullscreen && that.maximize
      })
      document.addEventListener('msfullscreenchange', function(event) {
        let isFullscreen =
          document.fullscreenElement ||
          document.mozFullScreenElement ||
          document.webkitFullscreenElement
        if (!isFullscreen) {
          that.headerHeight = 45
        }
        that.maximize = isFullscreen && that.maximize
      })
    })
  },
  mounted() {
    let that = this
    this.$nextTick(function() {
      window.addEventListener('resize', function(e) {
        that.clientHeight = document.documentElement.clientHeight
      })
    })
    
    function banBackSpace(e){
    	
    	var ev = e || window.event;//获取event对象 
			var obj = ev.target || ev.srcElement;//获取事件源 
			
			var t = obj.type || obj.getAttribute('type');//获取事件源类型 
			
			//获取作为判断条件的事件类型 
			var vReadOnly = obj.getAttribute('readonly'); 
			var vEnabled = obj.getAttribute('enabled'); 
			
			
			//处理null值情况  增加处理下拉选择框有编辑的情况
			vReadOnly = (vReadOnly == 'readonly') ? true:(vReadOnly == null) ? false : vReadOnly; 
			vEnabled = (vEnabled == null) ? true : vEnabled; 
			
			//当敲Backspace键时，事件源类型为密码或单行、多行文本的， 
			//并且readonly属性为true或enabled属性为false的，则退格键失效 
			var flag=(ev.keyCode == 8 && (t=="password" || t=="text" || t=="textarea") 
			&& (vReadOnly==true || vEnabled!=true))?true:false; 
			
			//当敲Backspace键时，事件源类型非密码或单行、多行文本的，则退格键失效 
			var flagStatus=(ev.keyCode == 8 && t != "password" && t != "text" && t != "textarea") 
			?true:false;
			
			//判断 
			if(flagStatus){ 
			return false;
			} 
			if(flag){ 
			return false;
			} 
    	
    }
    
    //禁止后退键 作用于Firefox、Opera 
		document.onkeypress=banBackSpace; 
		//禁止后退键 作用于IE、Chrome 
		document.onkeydown=banBackSpace; 
  },
  methods: {
    fullscreen() {
      if (document.documentElement.requestFullscreen) {
        document.documentElement.requestFullscreen()
      } else if (document.mozRequestFullScreen) {
        document.documentElement.mozRequestFullScreen()
      } else if (document.documentElement.msRequestFullscreen) {
        document.documentElement.msRequestFullscreen()
      } else if (document.documentElement.webkitRequestFullscreen) {
        document.documentElement.webkitRequestFullScreen()
      }
      this.headerHeight = 0
      this.maximize = true
    },
    searchId(data, str) {
      for (var i = 0; i < data.length; i++) {
        if (data[i].moduleName === str) {
          return data[i].moduleId
        } else if (data[i].childModules.length > 0) {
          var temp = this.searchId(data[i].childModules, str)
          if (temp) {
            return temp
          }
        }
      }
      return ''
    },
    queryBtns(moduleId, tabObjIntabs) {
      //根据moduleId获取按钮权限
      this.$httpExt()
        .get('admin/queryPageBtn', {
          moduleId: moduleId,
          roleId: this.currentRoleId
        })
        .then(
          response => {
            var data = response
            if (data.result.length == 0) {
              return
            }
            var obj = {}
            for (let i = 0; i < data.result.length; i++) {
              obj[data.result[i]] = true
            }
            tabObjIntabs.btns = obj
          },
          response => {
            this.$notify.error({
              title: '异常',
              message: response.msg
            })
          }
        )
    },
    getRoles() {
      //根据userId获取角色列表
      this.$httpExt()
        .get('admin/queryRoles')
        .then(
          response => {
            var data = response
            if (data.result.length == 0) {
              return
            }
            this.roleLists = data.result
            //显示默认角色
            let hasDefault = false
            for (let i = 0; i < this.roleLists.length; i++) {
              if (this.roleLists[i].isDefault == 1) {
                this.$store.commit('setRoleId', this.roleLists[i].roleId)
                hasDefault = true
              }
            }
            //若没有默认角色，设置角色为第一个
            if (hasDefault == false) {
              this.$store.commit('setRoleId', this.roleLists[0].roleId)
            }

            this.currentRoleIdTemp = this.currentRoleId
            this.getMenu()
          },
          response => {
            this.$notify.error({
              title: '异常',
              message: response.msg
            })
          }
        )
    },
    switchRole() {
      this.$store.commit('setRoleId', this.currentRoleIdTemp)
      this.getMenu()
      this.dialogRole = false
      this.tabs = [homePage]
      this.tab = '首页'
    },
    getQueryString(name) {
      var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i')
      var r = window.location.search.substr(1).match(reg)
      if (r != null) return r[2]
      return null
    },
    getMenu() {
      this.$httpExt()
        .get('admin/queryMenus', {
          roleId: this.currentRoleId
        })
        .then(
          response => {
            var data = response
            this.menus = this.menus.concat(data.result)
            var page = decodeURI(this.getQueryString('p'))
            if (page !== 'null') {
              var moduleId = this.searchId(this.menus, page)
              moduleId && this.selected(page, moduleId)
            }
          },
          respons => {
            this.$notify.error({
              title: '异常',
              message: response.msg
            })
          }
        )
    },
    renderTab(h, tab) {
      return h('span', [
        `${tab.title} `,
        h('i', {
          class: ['el-icon-close']
        })
      ])
    },
    selected(tab, moduleId) {
      /*对tab的切换进行埋点  当做是页面的跳转进行处理*/
      var pageName = tab + '_' + moduleId
      this.$sfgather().track_pageview(pageName)
      for (let [index, item] of this.tabs.entries()) {
        if (item.title == tab) {
          this.tab = tab
          return
        }
      }
      var content = this.menuComponent[tab]
      this.tabs.push({
        title: tab,
        name: tab,
        content: content,
        btns: {}
      })
      this.tab = tab
      this.queryBtns(moduleId, this.tabs[this.tabs.length - 1]) //查询新页面的按钮权限
    },
    addShortcutMenu() {
      this.dialogMenu = true
    },
    handleClick(tab, event) {
      this.tab = tab.name
    },
    handleRemove(targetName) {
      let tabs = this.tabs
      let activeName = this.tab
      if (activeName === targetName) {
        tabs.forEach((tab, index) => {
          if (tab.name === targetName) {
            let nextTab = tabs[index + 1] || tabs[index - 1]
            if (nextTab) {
              activeName = nextTab.name
            }
          }
        })
      }

      this.tab = activeName
      this.tabs = tabs.filter(tab => tab.name !== targetName)
    },
    over(event) {
      var panel = this.$el.querySelector('.panel-top').parentNode
      if (panel.className.indexOf('mini-menu') != -1) {
        event.currentTarget.querySelector('.el-menu').style.display = 'block'
      }
    },
    out(event) {
      var panel = this.$el.querySelector('.panel-top').parentNode
      if (panel.className.indexOf('mini-menu') != -1) {
        event.currentTarget.querySelector('.el-menu').style.display = 'none'
      }
    },
    logout() {
      this.$confirm('你确定退出登录么？', '退出提示', {
        type: 'warning'
      })
        .then(() => {
          //debugger
          this.$delAllCookie()
          window.location.href = this.$store.state.global.url + 'admin/logout'
        })
        .catch(() => {})
    },
    createTab(t, c) {
      let flag = false
      for (let [index, item] of this.tabs.entries()) {
        if (item.title == t) {
          this.tabs.splice(index, 1, {
            title: t,
            name: t,
            content: c,
            btns: {}
          })
          flag = true
          break
        }
      }
      if (!flag) {
        this.tabs.push({
          title: t,
          name: t,
          content: c,
          btns: {}
        })
      }
      this.tab = t
    }
  },
  watch: {
    forwardModule() {
      let moduleName = this.$store.state.global.forwardModule.moduleName
      let moduleId = this.$store.state.global.forwardModule.moduleId
      this.selected(moduleName, moduleId)
    }
  },
  components: {
    navMenu,
    navMenuItem,
    homePage: function(resolve) {
      require(['../homePage/homePage'], resolve)
    },
    dataDictionary: function(resolve) {
      require(['../backstageManage/dataDictionary'], resolve)
    },
    roleList: function(resolve) {
      require(['../userManage/roleList'], resolve)
    },
    userList: function(resolve) {
      require(['../userManage/userList'], resolve)
    },
    functionList: function(resolve) {
      require(['../userManage/functionList'], resolve)
    },
    myTest: function(resolve) {
      require(['../baseInfo/myTest'], resolve)
    },
    iframeContent: function(resolve) {
      require(['../example/iframe'], resolve)
    },
    staticModuleList: function(resolve) {
      require(['../staticResource/staticModuleList'], resolve)
    },
    rapCompare: function(resolve) {
      require(['../tool/rapCompare'], resolve)
    },
    cusbatchMng: function(resolve) {
      require(['../baseInfo/cusbatchManage/cusbatchMng'], resolve)
    },
    calibrationUnit: function(resolve) {
      require(['../baseInfo/cusbatchManage/calibrationUnit'], resolve)
    },
    synchAudit: function(resolve) {
      require(['../baseInfo/synchAudit'], resolve)
    },
    productList: function(resolve) {
      require(['../baseInfo/goodsCode/productList'], resolve)
    },
    crossGoodsList: function(resolve) {
      require(['../baseInfo/goodsCode/crossGoodsList'], resolve)
    },
    expUnitCodeList: function(resolve) {
      require(['../baseInfo/goodsCode/expUnitCodeList'], resolve)
    },
    personalHSCodeList: function(resolve) {
      require(['../baseInfo/goodsCode/personalHSCodeList'], resolve)
    },
    exchangeSetting: function(resolve) {
      require(['../baseInfo/exchangeSetting'], resolve)
    },
    hsCodeElementsList: function(resolve) {
      require(['../baseInfo/goodsCode/hsCodeElementsList'], resolve)
    },
    cbeDeclareLimite: function(resolve) {
      require(['../baseInfo/cbeDeclareLimite'], resolve)
    },
    unionNoList: function(resolve) {
      require(['../baseInfo/unionNoList'], resolve)
    },
    autoSingleTrialList: function(resolve) {
      require(['../baseInfo/autoSingleTrialList'], resolve)
    },
    sensitiveList: function(resolve) {
      require(['../baseInfo/sensitiveList'], resolve)
    },
    customDept: function(resolve) {
      require(['../baseInfo/customDept'], resolve)
    },
    taxSortPayment: function(resolve) {
      require(['../baseInfo/tax/taxSortPayment'], resolve)
    },
    taxAcct: function(resolve) {
      require(['../baseInfo/tax/taxAcct'], resolve)
    },
    specificationModel: function(resolve) {
      require(['../baseInfo/specificationModel'], resolve)
    },
    businessUnit: function(resolve) {
      require(['../baseInfo/businessUnit/businessUnit'], resolve)
    },
    businessUnitMatch: function(resolve) {
      require(['../baseInfo/businessUnit/businessUnitMatch'], resolve)
    },
    taxDLManager: function(resolve) {
      require(['../taxManager/taxDLManager'], resolve)
    },
    areaManage: function(resolve) {
      require(['../baseInfo/areaManage/areaManage'], resolve)
    },
    provinceCodeManage: function(resolve) {
      require(['../baseInfo/areaManage/provinceCodeManage'], resolve)
    },
    carNumberManage: function(resolve) {
      require(['../baseInfo/carNumberManage/carNumberManage'], resolve)
    },
    gattaxList: function(resolve) {
      require(['../baseInfo/gattaxList'], resolve)
    },
    customTypeList: function(resolve) {
      require(['../baseInfo/customTypeList'], resolve)
    },
    carBatchAreaManage: function(resolve) {
      require(['../baseInfo/carNumberManage/carBatchAreaManage'], resolve)
    },
    abroadTaxModelManager: function(resolve) {
      require(['../taxManager/abroad/abroadTaxModelManager'], resolve)
    },
    taxLog: function(resolve) {
      require(['../taxManager/taxLog'], resolve)
    },
    taxSummary: function(resolve) {
      require(['../taxManager/taxSummary'], resolve)
    },
    abroadTaxImport: function(resolve) {
      require(['../taxManager/abroad/abroadTaxImport'], resolve)
    },
    AuditWord: function(resolve) {
      require(['../baseInfo/autoSignleTrial/AuditWord'], resolve)
    },
    GDescBak: function(resolve) {
      require(['../baseInfo/autoSignleTrial/GDescBak'], resolve)
    },
    UnAuditWord: function(resolve) {
      require(['../baseInfo/autoSignleTrial/UnAuditWord'], resolve)
    },
    AutoConfig: function(resolve) {
      require(['../baseInfo/autoSignleTrial/AutoConfig'], resolve)
    },
    GDescUnAudit: function(resolve) {
      require(['../baseInfo/autoSignleTrial/GDescUnAudit'], resolve)
    },
    taxAbroad: function(resolve) {
      require(['../taxManager/taxAbroad'], resolve)
    },
    pregatePlan: function(resolve) {
      require(['../taskManager/pregatePlan'], resolve)
    },
    pregateTask: function(resolve) {
      require(['../taskManager/pregateTask'], resolve)
    },
    customerVipSign: function(resolve) {
      require(['../baseInfo/customerVipSign'], resolve)
    },
    areaTimeDifference: function(resolve) {
      require(['../baseInfo/areaTimeDifference'], resolve)
    },
    sensitiveGoods: function(resolve) {
      require(['../baseInfo/sensitiveGoods'], resolve)
    },
    hkAddFee: function(resolve) {
      require(['../taxManager/hkAddFee'], resolve)
    },
    twAddFee: function(resolve) {
      require(['../taxManager/twAddFee'], resolve)
    },
    apAddFee: function(resolve) {
      require(['../taxManager/apAddFee'], resolve)
    },
    ediReport: function(resolve) {
      require(['../reviewService/ediReport'], resolve)
    },
    dTypeTax: function(resolve) {
      require(['../taxManager/dTypeTax/dTypeTaxIndex'], resolve)
    },
    reviewReferenceSingle: function(resolve) {
      require(['../reviewService/reviewReferenceSingle'], resolve)
    },
    sensitiveGoods: function(resolve) {
      require(['../baseInfo/sensitiveGoods'], resolve)
    },
    customDataBatch: function(resolve) {
      require(['../reviewService/customDataBatch'], resolve)
    },
    examTranslateHandle: function(resolve) {
      require(['../reviewService/examTranslateHandle'], resolve)
    },
    identityManage: function(resolve) {
      require(['../autoReview/identityManage'], resolve)
    },
    imageDownload: function(resolve) {
      require(['../reviewService/imageDownload'], resolve)
    },
    imageDownloadLog: function(resolve) {
      require(['../reviewService/imageDownloadLog'], resolve)
    },
    tmallAccs: function(resolve) {
      require(['../baseInfo/tmallAccs'], resolve)
    },
    noAuditWaybillt: function(resolve) {
      require(['../reviewService/noAuditWaybillt'], resolve)
    },
    searchName: function(resolve) {
      require(['../baseInfo/searchName'], resolve)
    },
    abroadLabel: function(resolve) {
      require(['../baseInfo/abroadLabel'], resolve)
    },
    dummySRInfo: function(resolve) {
      require(['../baseInfo/reviewConfigure/dummySRInfo'], resolve)
    },
    adjustWeightRange: function(resolve) {
      require(['../baseInfo/reviewConfigure/adjustWeightRange'], resolve)
    },
    adjustRule: function(resolve) {
      require(['../baseInfo/reviewConfigure/adjustRule'], resolve)
    },
    deliveryGoodsWhitelist: function(resolve) {
      require(['../baseInfo/deliveryGoods/whitelist'], resolve)
    },
    deliveryGoodsBlacklist: function(resolve) {
      require(['../baseInfo/deliveryGoods/blacklist'], resolve)
    },
    cusClearAbility: function(resolve) {
      require(['../baseInfo/deliveryGoods/cusClearAbility'], resolve)
    },
    ediBtnConfig: function(resolve) {
      require(['../reviewService/ediBtnConfig'], resolve)
    },
    batchExportConfig: function(resolve) {
      require(['../reviewService/batchExportConfig'], resolve)
    },
    expKindConfig: function(resolve) {
      require(['../baseInfo/expKindConfig'], resolve)
    },
    expKindJudge: function(resolve) {
      require(['../baseInfo/expKindJudge'], resolve)
    },
    imageUpload: function(resolve) {
      require(['../image/imageUpload'], resolve)
    },
    imageUploadLog: function(resolve) {
      require(['../image/imageUploadLog'], resolve)
    },
    queryTwContainer: function(resolve) {
      require(['../queryContainer/queryTwContainer'], resolve)
    },
    queryTwVehicle: function(resolve) {
      require(['../queryContainer/queryTwVehicle'], resolve)
    },
    exportExp: function(resolve) {
      require(['../expManager/exportExp'], resolve)
    },
    postManage: function(resolve) {
      require(['../baseInfo/postManage'], resolve)
    },
    scheduleGoodsResult: function(resolve) {
      require(['../reviewService/scheduleGoodsResult'], resolve)
    },
    taskList: function(resolve) {
      require(['../fdtp2/taskManager/declareTaskList'], resolve)
    },
    importExp: function(resolve) {
      require(['../expManager/importExp'], resolve)
    },
    dTypeAuditList: function(resolve) {
      require(['../dType/dTypeAuditList'], resolve)
    },
    expConfig: function(resolve) {
      require(['../baseInfo/expConfig'], resolve)
    },
    printCustomsDeclaration: function(resolve) {
      require(['../expManager/printCustomsDeclaration'], resolve)
    },
    customsDeclarationPrintConf: function(resolve) {
      require(['../expManager/customsDeclarationPrintConf'], resolve)
    },
    exp306Query: function(resolve) {
      require(['../expManager/exp306Query'], resolve)
    },
    exp310Query: function(resolve) {
      require(['../expManager/exp310Query'], resolve)
    },
    customsManage: function(resolve) {
      require(['../expManager/customsManage'], resolve)
    },
    toportVehicle: function(resolve) {
      require(['../reviewService/toportVehicle'], resolve)
    },
    toportDeclare: function(resolve) {
      require(['../reviewService/toportDeclare'], resolve)
    },
    tmallCustom: function(resolve) {
      require(['../reviewService/tmallCustom'], resolve)
    },
    portDataBatchModify: function(resolve) {
      require(['../expManager/portDataBatchModify'], resolve)
    },
    portDataSignleModify: function(resolve) {
      require(['../expManager/portDataSignleModify'], resolve)
    },
    taskCenter: function(resolve) {
      require(['../taskCenter/taskCenter'], resolve)
    },
    smsConfig: function(resolve) {
      require(['../baseInfo/smsConfig'], resolve)
    },
    sendSms: function(resolve) {
      require(['../reviewService/sendSms'], resolve)
    },
    tallyRule: function(resolve) {
      require(['../baseInfo/tally/tallyRule'], resolve)
    },
	companyManage: function(resolve){
      require(['../baseInfo/companyManage'], resolve)
    },
	totalCustomManage: function(resolve){
      require(['../reviewService/totalCustomManage'], resolve)
    },
    carAndFlight: function(resolve){
    	require(['../baseInfo/carAndFlight'], resolve)
    },
    billTranslation: function(resolve){
    	require(['../reviewService/billTranslation'], resolve)
    },
	autoDetainedRule: function(resolve){
      require(['../baseInfo/autoDetainedRule'], resolve)
     }
  }
}
</script>
<style lang="less" scoped>
.el-table thead tr th {
  text-align: center;
  background: #f5f7fa;
}

body {
  background: #f5f7fa;
  margin: 0;
  padding: 0;
  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB,
    Microsoft YaHei, SimSun, sans-serif;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  overflow: hidden;
}

.el-cus-container {
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  //width: 100%;
  background: #f5f5f5;
  position: absolute;
  overflow: hidden;
}

.el-cus-header {
  border-bottom: 1px solid #d1dbe8;
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.12);
  padding: 0px 20px 0px 0px;
  // padding-top: 10px;
  // height: 45px !important;
  background: #fff;
}

.el-cus-header .logo {
  width: 230px;
  height: 60px;
  // margin-top: -8px;
  // margin-left: -20px;
  float: left;
  background: url('../../common/images/logo.png') center no-repeat;
  background-size: 230px 60px;
}

.el-cus-header .menu {
  margin-left: 5px;
  width: 30px;
  height: 60px;
  vertical-align: middle;
  float: left;
  background: url('../../common/images/menu-toggle.png') center no-repeat;
  background-size: 30px 27px;
}

.menu-show {
  animation-name: icon-rotate-show;
  animation-duration: 0.5s;
  animation-timing-function: linear;
  transform: rotate(0deg);
}

.menu-hide {
  animation-name: icon-rotate-hide;
  animation-duration: 0.5s;
  animation-timing-function: linear;
  transform: rotate(180deg);
}

@keyframes icon-rotate-show {
  from {
    transform: rotate(180deg);
  }
  to {
    transform: rotate(0deg);
  }
}

@keyframes icon-rotate-hide {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(180deg);
  }
}

.el-cus-header .list {
  color: #333;
  cursor: pointer;
  margin-right: 5px;
  font-size: 14px;
}

.el-cus-header .list:hover {
  color: #409eff;
}

.el-cus-header .list i {
  font-weight: 700;
}

.el-cus-header > .el-row {
  line-height: 60px;
  vertical-align: middle;
  text-align: right;
  &:first-child {
    text-align: left;
  }
  &:last-child {
    text-align: right;
  }
}

.el-cus-content {
  overflow: hidden;
  padding-top: 20px;
}

.el-cus-aside {
  overflow: hidden;
}

.el-cus-main {
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  overflow: hidden;
  margin-left: -330px;
  padding-top: 0px;
  padding-left: 0px;
  padding-right: 20px;
}

.el-cus-main-max {
  overflow: hidden;
  padding-top: 0px;
}

.el-cus-aside::-webkit-scrollbar {
  background: transparent;
}
</style>