<template>
  <div class="layout-row-main">
      <div class="layout-col-tree">
        <div v-loading="dataLoading" class="padding-top-bottom" style="background-color: #fff;border: 1px solid #ECEDEF;box-shadow: 0 1px 1px rgba(99,99,99,.05);border-radius:4px;">
        <catalog-tree :data="stats" ref="ctree" :node-active.sync="active" :is-menu="true" :props="defaultProps" @current-change="handleNodeClick"></catalog-tree>
        </div>
      </div>
      <div class="layout-col-detail">
        <router-view></router-view>
      </div>
  </div>
</template>

<script>
import CatalogTree from '@src/components/catalogTree/CatalogTree.vue'
export default {
  components: {
    'catalog-tree': CatalogTree
  },
  data() {
    return {
      dataLoading: true,
      stats: [{'ID': 1, 'parentID': 0, 'name': '总体情况', 'target': '/stat/summary', 'children': [{'ID': 2, 'parentID': 1, 'name': '综合报告', 'target': '/stat/summary', 'children': ''}, {'ID': 3, 'parentID': 1, 'name': '全站点击量', 'target': '/stat/site', 'children': ''}, {'ID': 4, 'parentID': 1, 'name': '时段分布', 'target': '/stat/hour', 'children': ''}, {'ID': 5, 'parentID': 1, 'name': '最近访问记录', 'target': '/stat/lastVisit', 'children': ''}, {'ID': 6, 'parentID': 1, 'name': '入口分析', 'target': '/stat/entrance', 'children': ''}, {'ID': 7, 'parentID': 1, 'name': '出口分析', 'target': '/stat/exit', 'children': ''}, {'ID': 8, 'parentID': 1, 'name': '被访主机分析', 'target': '/stat/host', 'children': ''}, {'ID': 9, 'parentID': 1, 'name': '区域分布', 'target': '/stat/district', 'children': ''}, {'ID': 10, 'parentID': 1, 'name': '在线人数', 'target': '/stat/onlineVisitor', 'children': ''}]}, {'ID': 11, 'parentID': 0, 'name': '访问量排行', 'target': '/stat/catalogHit', 'children': [{'ID': 12, 'parentID': 11, 'name': '栏目点击排行', 'target': '/stat/catalogHit', 'children': ''}, {'ID': 13, 'parentID': 11, 'name': '内容点击排行', 'target': '/stat/contentHit', 'children': ''}, {'ID': 14, 'parentID': 11, 'name': 'URL点击排行', 'target': '/stat/urlHit', 'children': ''}, {'ID': 15, 'parentID': 11, 'name': '菜单点击排行', 'target': '/stat/menuHit', 'children': ''}]}, {'ID': 16, 'parentID': 0, 'name': '忠诚度分析', 'target': '/stat/visitDepth', 'children': [{'ID': 17, 'parentID': 16, 'name': '访问深度', 'target': '/stat/visitDepth', 'children': ''}, {'ID': 18, 'parentID': 16, 'name': '访问频度', 'target': '/stat/visitFreq', 'children': ''}, {'ID': 19, 'parentID': 16, 'name': '回头率', 'target': '/stat/returningRate', 'children': ''}, {'ID': 20, 'parentID': 16, 'name': '停留时间', 'target': '/stat/stickTime', 'children': ''}]}, {'ID': 21, 'parentID': 0, 'name': '点击量来源', 'target': '/stat/source', 'children': [{'ID': 22, 'parentID': 21, 'name': '来源组成', 'target': '/stat/source', 'children': ''}, {'ID': 23, 'parentID': 21, 'name': '搜索引擎', 'target': '/stat/searchEngine', 'children': ''}, {'ID': 24, 'parentID': 21, 'name': '来源网站', 'target': '/stat/referer', 'children': ''}, {'ID': 25, 'parentID': 21, 'name': '关键字分析', 'target': '/stat/keyword', 'children': ''}]}, {'ID': 26, 'parentID': 0, 'name': '客户端情况', 'target': '/stat/OS', 'children': [{'ID': 27, 'parentID': 26, 'name': '操作系统', 'target': '/stat/OS', 'children': ''}, {'ID': 28, 'parentID': 26, 'name': '浏览器', 'target': '/stat/browser', 'children': ''}, {'ID': 29, 'parentID': 26, 'name': '语言', 'target': '/stat/language', 'children': ''}, {'ID': 30, 'parentID': 26, 'name': '屏幕分辨率', 'target': '/stat/screen', 'children': ''}, {'ID': 31, 'parentID': 26, 'name': '屏幕色深', 'target': '/stat/colorDepth', 'children': ''}, {'ID': 32, 'parentID': 26, 'name': '是否支持Applet', 'target': '/stat/javaEnabled', 'children': ''}, {'ID': 33, 'parentID': 26, 'name': 'Flash版本', 'target': '/stat/flashVersion', 'children': ''}, {'ID': 34, 'parentID': 26, 'name': '是否允许Cookie', 'target': '/stat/cookieEnabled', 'children': ''}]}, {'ID': 35, 'parentID': 0, 'name': '内容发布统计', 'target': '/stat/statByCatalog', 'children': [{'ID': 36, 'parentID': 35, 'name': '按栏目统计', 'target': '/stat/statByCatalog', 'children': ''}, {'ID': 37, 'parentID': 35, 'name': '按维度统计', 'target': '/stat/statByDimension', 'children': ''}, {'ID': 38, 'parentID': 35, 'name': '按角色统计', 'target': '/stat/statByRole', 'children': ''}, {'ID': 39, 'parentID': 35, 'name': '按用户统计', 'target': '/stat/statByUser', 'children': ''}]}, {'ID': 40, 'parentID': 0, 'name': '广告统计', 'target': '', 'children': [{'ID': 41, 'parentID': 40, 'name': '最近点击记录', 'target': '/stat/lastHit', 'children': ''}, {'ID': 42, 'parentID': 40, 'name': '广告点击率', 'target': '/stat/advertise', 'children': ''}, {'ID': 43, 'parentID': 40, 'name': '版位点击率', 'target': '/stat/position', 'children': ''}, {'ID': 44, 'parentID': 40, 'name': '区域分布', 'target': '/stat/adDistrict', 'children': ''}]}, {'ID': 45, 'parentID': 0, 'name': '会员登录情况', 'target': '', 'children': [{'ID': 46, 'parentID': 45, 'name': '会员登录统计', 'target': '/stat/memberLoginStat', 'children': ''}]}, {'ID': 47, 'parentID': 0, 'name': '收藏统计', 'target': '', 'children': [{'ID': 48, 'parentID': 47, 'name': '会员收藏统计', 'target': '/stat/memberFavoriteStat', 'children': ''}, {'ID': 49, 'parentID': 47, 'name': '内容收藏统计', 'target': '/stat/contentFavoriteStat', 'children': ''}]}, {'ID': 50, 'parentID': 0, 'name': '评论统计', 'target': '', 'children': [{'ID': 51, 'parentID': 50, 'name': '表情统计', 'target': '/stat/commentFace', 'children': ''}, {'ID': 52, 'parentID': 50, 'name': '星级评分统计', 'target': '/stat/commentScore', 'children': ''}, {'ID': 53, 'parentID': 50, 'name': '顶/踩统计', 'target': '/stat/commentSupport', 'children': ''}]}, {'ID': 54, 'parentID': 0, 'name': '内容绩效统计', 'target': '', 'children': [{'ID': 55, 'parentID': 54, 'name': '内容绩效统计', 'target': '/stat/assessStat', 'children': ''}]}],
      currentStat: {},
      defaultProps: {
        children: 'children',
        label: 'name',
        key: 'ID'
      },
      active: ''
    }
  },
  methods: {
    handleNodeClick(stat) {
      let target = stat.target ? stat.target : stat.children[0].target
      const path = target.replace(/:\w+\??/g, '')
      this.$router.push({path: path})
    }
  },
  mounted() {
    let path = location.hash.substring(1)
    if (path === '/stat' || path === '/stat/') {
      path = '/stat/summary'
      this.$router.replace('/stat/summary')
    }
    let itemChild = ''
    let item = this.stats.find(val => {
      if (val.target && path.indexOf(val.target) > -1) {
        return true
      }
      if (!itemChild) {
        itemChild = val.children.find(c => path.indexOf(c.target) > -1)
      }
      return false
    })
    this.active = item ? item.ID : itemChild.ID
    this.dataLoading = false
  }
}
</script>
