<template>
  <div class="main">
    <div style="height: 70px;">
      <div class="header">
        <div class="header-message">
          <a href="javascript:void(0);" style="text-decoration: none;"><img :src="message" style="width: 20px;height: 20px" alt=""/></a>
        </div>
        <div style="color: #FFFFFF;float: left;margin-left: 10px">|</div>
        <div style="float: left;margin-left: 10px;margin-top: -5px;">
          <Avatar >{{severUserInfo.name}}</Avatar>
        </div>
        <div style="color: #FFFFFF;float: left;margin-left: 10px">欢迎您，{{severUserInfo.name}}</div>
        <div style="color: #0C1F5D;float: left;margin-left: 10px">|</div>
        <div style="color: #0C1F5D;float: left;margin-left: 10px;margin-right: 58px;" @click="modal10 = true">
          <a href="javascript:void(0);" style="text-decoration: none;color: white;">
            退出
            <img :src="exit"  alt="" style="margin-left: 10px;width: 20px;height: 20px"/>
          </a>
        </div>
      </div>
    </div>
    <div class="body">
      <!-- 矛盾纠纷 -->
      <div class="menus" @click="skipTo('contradictionmyWorkbench', '6abe0f99-2e14-11ef-9b4b-0242c0a81f02,0d101144-2a50-11f0-bf22-0242ac110002,0c46f5bc-2a17-11f0-bf22-0242ac110002,17e5e1a9-cccd-11f0-8e0b-fa163eb6e42a,548193ad-cc09-11f0-8e0b-fa163eb6e42a,84a62a17-2bb5-11f0-bf22-0242ac110002,6210f6cf-2bb9-11f0-bf22-0242ac110002,5c6619c9-e8e7-11ef-bd30-0242c0a81f03,f29089c3-f4e0-11ef-acc3-0242c0a81f03,328fa2e1-18f6-11f0-86a6-0242ac110002,0e213e9f-f9a4-11ef-92d1-0242ac110002')">
        <a href="javascript:void(0);">
          <!-- <img :src="mdjf" alt=""> -->
          <img :src="img2" alt="">
        </a>
      </div>
      <!-- 可视化专题 -->
      <div class="menus" v-if="showMK&&user_level!=='6'&&user_level!=='5' && showWGGL" @click="goOutUrl('大屏')">
        <a href="javascript:void(0);">
          <!-- <img :src="zfyq" alt=""> -->
          <img :src="img3" alt="">
        </a>
      </div>
      <!-- 特殊人员 -->
      <div class="menus" v-if="(showWGGL && user_level!=='6' ) || isChangchun" @click="skipTo('key-groups', '3753eb01-f4e9-11ef-acc3-0242c0a81f03,dd7a9f56-545e-11ef-ba43-fa163ec31b70')">
        <a href="javascript:void(0);">
          <!-- <img :src="tsry" alt=""> -->
          <img :src="img4" alt="">
        </a>
      </div>
      <!-- 命案管理 -->
      <div class="menus" v-if="showMK&&user_level!=='6'&&user_level!=='5' && showWGGL">
        <a href="javascript:void(0);">
          <!-- <img :src="magl" alt="" @click="skipTo('murderManagementList', '4492cbdd-3777-11ef-ac3f-0242c0a80202')"> -->
          <img :src="img5" alt="" @click="skipTo('murder-case-management', '0e69d0ad-f4e9-11ef-acc3-0242c0a81f03,4492cbdd-3777-11ef-ac3f-0242c0a80202')">
        </a>
      </div>
      <!-- 网格管理 -->
      <div class="menus" v-if="showWGGL">
        <a href="javascript:void(0);" class="menu_item" @click="goOutUrl('网格')">
          <!-- <img :src="wggl" alt=""> -->
          <img :src="img1" alt="">
        </a>
      </div>
      <!-- 诉求事件 -->
      <!-- <div class="menus">
        <a href="javascript:void(0);" >
          <img :src="sqsj" alt="" @click="skipTo('incidentEventSearchList', '7d403632-5a1b-11ef-a7fe-0242c0a81f03')">
        </a>
      </div> -->
    </div>
    <Modal id="tcdl" v-model="modal10" @on-ok="logout" width="350" class-name="vertical-center-modal">
      <p>您确定要退出登录吗？</p>
    </Modal>
  </div>
</template>
<script>
import message from '@/assets/images/all-home-page/消息图标.png'
import exit from '@/assets/images/all-home-page/退出图标.png'
import img1 from '@/assets/images/all-home-page/img1.png'
import img2 from '@/assets/images/all-home-page/img2.png'
import img3 from '@/assets/images/all-home-page/img3.png'
import img4 from '@/assets/images/all-home-page/img4.png'
import img5 from '@/assets/images/all-home-page/img5.png'
// import wggl from '@/assets/images/all-home-page/组 388.png'
// import mdjf from '@/assets/images/all-home-page/组 389.png'
import sqsj from '@/assets/images/all-home-page/组 390.png'
// import magl from '@/assets/images/all-home-page/组 391.png'
// import tsry from '@/assets/images/all-home-page/组 392.png'
// import zfyq from '@/assets/images/all-home-page/组 393.png'
import { mapActions } from 'vuex'
import { localClear } from '@/libs/util'
import { selectRoleMenuList, getIsHXOffice } from '@/api/contradiction.js'
import { userLogOut } from '@/api/system'
export default {
  name: 'homePage',
  data () {
    return {
      severUserInfo: this.$store.state.user.severUserInfo,
      message,
      exit,
      // wggl,
      // mdjf,
      img1,
      img2,
      img3,
      img4,
      img5,
      sqsj,
      // magl,
      // tsry,
      // zfyq,
      modal10: false,
      domain: '',
      showMK: false,
      user_level: '',
      showWGGL: true, // 新增变量控制网格管理的显示
      isChangchun: false
    }
  },
  created () {
    this.user_level = this.$store.state.user.severUserInfo.company_grade
    console.log(this.user_level, 'this.user_level')
    selectRoleMenuList().then(res => {
      if (res.data.errcode === 0) {
        res.data.data.forEach(item => {
          console.log(item, 'item')
          if (item.name === '命案管理') {
            this.showMK = true
          }
        })
      } else {
        this.$Message.error(res.errmsg)
      }
    })
    // 获取当前用户信息 如果是省级 则直接跳转到 矛盾
    // if (this.severUserInfo.company_grade === '2') {
    //   this.$router.push({
    //     name: 'contradictionmyWorkbench'
    //   })
    // } else {
    // }
  },
  computed: {
  },
  methods: {
    ...mapActions([
      'handleLogOut',
      'getRoleData'
    ]),
    skipTo (url, name) {
      this.getRoleData({ name }).then(res => {
        console.log('赋值成功')
      })
      if (url === 'contradictionmyWorkbench') {
        // this.$router.push({ name: url, query: { id: this.severUserInfo.id } })
        // this.$router.push({
        //   path: '/contradiction/contradictionList'
        // })
        // if (this.severUserInfo.company_grade === '2') { // 管理员admin
        //   this.$router.push({
        //     name: 'contradictionmyWorkbench'
        //   })
        // } else {
        //   this.$router.push({
        //     name: 'contradictionmyWorkbench'
        //   })
        // }
        if (this.showWGGL) { // 判断是否是横向部门 如果是横向部门 跳转到待办页面 其他的跳转到首页
          this.$router.push({
            name: 'contradictionmyWorkbench'
          })
        } else {
          this.$router.push({
            path: '/contradiction/register?type=3'
          })
        }
      } else {
        this.$router.push({ name: url })
      }
    },
    goOutUrl (url) {
      if (url === '大屏') {
        // localtion.href = `http://${domain}/screen-md`
        // window.open(`http://jilinmdjf.lngov.top:8088/screen-md`, '_blank')
        // this.$router.push({
        //   path: '/analyzeRouter'
        // })
        // 获取目标路由的完整路径
        const routePath = this.$router.resolve({ path: '/analyzeRouter' }).href
        // 使用 window.open 在新标签页打开
        window.open(routePath, '_blank')
      } else if (url === '网格') {
        window.open(`http://${this.domain}/zfw-grid/#/someuser`, '_blank')
      } else {
        // location.href = url
        window.open(url, '_blank')
      }
    },
    logout () {
      this.handleLogOut().then(() => {
        clearInterval(this.timerInterval)
        userLogOut().then(res => {
          if (res.data.errcode === 0) {
            localClear()
          } else {
            this.$Message.error(res.errmsg)
          }
        })
        // this.token = localStorage.getItem('token')
        // localStorage.setItem('token', this.token)
        this.$router.push({
          name: 'login'
        })
      })
    }
  },
  mounted () {
    // 获取当前域名
    this.domain = window.location.host
    console.log(this.domain)
    // 判断是否为长春账号（根据层级链或机构ID判断）
    try {
      const info = this.$store.state.user.otherUserInfo || {}
      console.log(info, 'info')
      const areaId = info.area_id || ''

      if (areaId.startsWith('2201')) {
        this.isChangchun = true
      }
    } catch (e) {
      this.isChangchun = false
    }
    // 查询是否需要隐藏网格管理
    getIsHXOffice().then(res => {
      if (res.data.errcode === 0) {
        // 如果返回true，则隐藏网格管理
        this.showWGGL = !res.data.data
      }
    }).catch(err => {
      console.error('查询失败:', err)
    })
  }
}
</script>
<style scoped lang="less">
.main {
  width: 100%;
  height: 100%;
  background-size: 100% 100%;
  background-position: center;
  position: relative;
  background-image: url("../../assets/images/all-home-page/main-background1.png");
}
.header {
  padding-top: 34px;
  float: right;
}
.body {
  width: 95%;
  height: 28%;
  position: relative;
  padding: 0 15px;
  top: 51.5%;
  border-radius: 20px;
  background: #fff;
  border: 1px solid #f2f2f2;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
}
.header-message {
  width: 20px;
  height: 20px;
  float: left;
}
.hd-img-responsive {
  display:block;
  max-width:100%;
  width: 100%;
  height:100%;
  margin: 0 auto;
}
.menus{
  padding: 30px 15px;
  //margin-left: 30px;
  //flex: 1;
  height: 100%;
  width: 25%;
  //margin-left: 30px;
}
.menus img{
  width: 100%;
  height: 100%;
}
.menus {
  transition: all 0.3s;
}
.menus:hover {
  transform: scale(1.1);
}
</style>
