<template>
  <Layout style="height: 100%" class="main">
    <Header>
      <div class="logo-v3">
        <div class="user-div-new">
          <Dropdown
            class="drop-down-v2"
            :transfer="true"
            @on-click="clickDropMenu"
          >
            <Row type="flex" justify="end">
              <Col span="20">
                <Row>
                  <div class="name-div">
                    <a href="javascript:void(0)" @click="handleOpen" style="color: white;">
                      {{ personData.name }}
                      <Icon type="ios-arrow-down"></Icon>
                    </a>
                  </div>
                </Row>
                <Row>
                  <div class="commit-div commit-title">
                    [{{ personData.company_name }}]
                  </div>
                </Row>
              </Col>
              <Col span="3" offset="1">
                <Avatar style="background-color: #db4b00">{{
                  personData.name
                }}</Avatar>
              </Col>
            </Row>
            <DropdownMenu slot="list">
              <div class="top-div">
                <div class="index-title3">{{ personData.name }}</div>
                <div class="index-title4">[{{ personData.company_name }}]</div>
                <!-- <div class="level-div index-title5">{{grade_level}}</div> -->
              </div>
              <div
                class="drop-item-v2"
                v-for="(item, index) in menuItemList"
                v-bind:key="index"
              >
                <DropdownItem :name="item.path">
                  <Row class="drop-item-div1">
                    <Col span="3" style="margin-right: 4px">
                      <img :src="item.url" />
                    </Col>
                    <Col span="16">
                      <div class="index-title3" style="float: left">
                        {{ item.label }}
                      </div>
                    </Col>
                  </Row>
                </DropdownItem>
              </div>
              <div style="float: left; margin-bottom: 5px; margin-top: 15px">
                <div
                  class="back-div index-title2"
                  @click="backTo('allHomePage')"
                >
                  返回主页
                </div>
                <img
                  :src="tcdlImg"
                  @click="logout()"
                  style="
                    width: 104px;
                    height: 30px;
                    float: left;
                    cursor: pointer;
                  "
                />
              </div>
            </DropdownMenu>
          </Dropdown>
        </div>
        <div
          class="header-line-right-item notice-container"
          :style="{
            'height': headerBarHeight,
            'position': 'absolute',
            'top': '20px',
            'left': '35vw',
            'color': 'white',
            'z-index': 1 }"
        >
          <div class="notice-item">
            <span class="line-menu"> 通知公告: </span>
          </div>
          <div
            class="header-line-left-box-item header-line-right-item"
            style="width: 34rem"
            @click="goRoute()"
          >
            <div class="marquee">
              <div class="marquee_box">
                <ul class="marquee_list" :class="{ marquee_top: animate }">
                  <li v-for="(item, i) in marqueeList" :key="i">
                    {{ item.content }}
                  </li>
                </ul>
              </div>
            </div>
          </div>
        </div>
        <!-- </div> -->
      </div>
    </Header>
    <img
      id="box"
      :src="imgUrl"
      @click="checkMenu()"
      :class="{ btn1: isCollapsed, btn2: !isCollapsed }"
    />
    <Layout class="new-menu">
      <Sider
        class="sider-menu-div"
        hide-trigger
        collapsible
        :collapsed-width="0"
        :width="220"
        :style="{
          background: '#ffffff',
          paddingTop: '13.5px',
          height: sliderH + 'px',
        }"
        style="overflow-y: scroll"
        v-model="isCollapsed"
        @on-collapse="aaa"
      >
        <qstb-menu :siderMenus="siderMenuList"></qstb-menu>
      </Sider>
      <Modal
        v-model="passwordInfo.show"
        title="修改密码"
        width="600"
        :closable="false"
        :mask-closable="false"
      >
        <Form
          label-position="right"
          :label-width="100"
          ref="passwordInfo"
          :model="passwordInfo"
          :rules="ruleInline"
        >
          <FormItem
            prop="oldpassword"
            label="旧密码："
            class="set-password-input"
          >
            <Input type="password" v-model="passwordInfo.oldpassword"></Input>
          </FormItem>
          <FormItem
            prop="newpassword"
            label="新密码："
            class="set-password-input"
          >
            <Input type="password" v-model="passwordInfo.newpassword"></Input>
          </FormItem>
          <FormItem
            prop="repassword"
            label="确认密码："
            class="set-password-input"
          >
            <Input type="password" v-model="passwordInfo.repassword"></Input>
          </FormItem>
        </Form>
        <div slot="footer">
          <div class="left-con" style="margin-top: 56px; height: 32px">
            <div class="search-btn" @click="setPassWord('passwordInfo')">
              确 认
            </div>
            <div class="remove-btn" @click="closePassWord('passwordInfo')">
              取 消
            </div>
          </div>
        </div>
      </Modal>
      <Layout
        class="content-layout-v3"
        :style="{
          overflow: 'hidden',
          height: 'calc(100vh - 90px)',
          overflowY: 'scroll',
          paddingTop: '24px',
          paddingRight: '16px',
          paddingLeft: '25px',
          background: '#f6f6f6;',
          paddingBottom: '16px',
        }"
      >
        <!-- <div class="tag-nav-wrapper">
          <new-tag-nav :value="$route" @input="handleClick" :list="tagNavList" @on-close="handleCloseTag"></new-tag-nav>
        </div> -->
        <Content
          :style="{
            paddingLeft: '0px',
            paddingTop: '0px',
            paddingRight: '0px',
            background: '#f6f6f6',
          }"
        >
          <keep-alive :include="cacheList">
            <router-view />
          </keep-alive>
        </Content>
      </Layout>
    </Layout>
  </Layout>
</template>

<script>
import {
  selectListPage
} from '@/api/contradiction.js'
import './index-copy.less'
import QstbMenu from './qstb-menu'
import rightImg from '@/assets/images/right.png'
import leftImg from '@/assets/images/left.png'
import logoutImg from '@/assets/images/logout.png'
import passwordImg from '@/assets/images/password.png'
import mmImg from '@/assets/images/密码图标.png'
import tcdlImg from '@/assets/images/退出登录.png'
import { mapMutations, mapActions, mapGetters } from 'vuex'
import { updatePwd } from '@/api/user'
import { mzMenulist, getMenuList } from '@/api/eventlist'
import ThreeMenu from './three-menu'
import { clearInterval } from 'timers'
import YiqingMenu from '@/view/view-page/indexv3/yiqing-menu/yiqing-menu'
import NewTagNav from '@/components/new-tag-nav'
import {
  getNewTagList,
  routeEqual,
  getMenuByRouter,
  localSave,
  localClear
} from '@/libs/util'
import { getRouterReq } from '@/api/routers'
import routers from '@/router/routers'
import { userLogOut } from '@/api/system'
export default {
  name: 'indexv3',
  components: {
    // MenuList,
    YiqingMenu,
    ThreeMenu,
    // device,
    QstbMenu,
    NewTagNav
  },
  data () {
    const validatePassCheck = (rule, value, callback) => {
      if (value !== this.passwordInfo.newpassword) {
        callback(new Error('确认密码与新密码不相同'))
      } else {
        callback()
      }
    }
    return {
      headerBarHeight: '80px',
      animate: false,
      marqueeList: [{ content: '公告内容1' }, { content: '公告内容2' }], //  通告内容
      siderMenuList: [],
      menuItemList: [
        {
          url: mmImg,
          label: '修改密码',
          path: 'setPasword'
        }
      ],
      mmImg,
      tcdlImg,
      visible: false,
      minZhengMenus: [],
      minZhengMenus1: [],
      minZhengMenus2: [],
      minZhengMenus3: [],
      isCollapsed: false,
      isCollapse: true,
      communityDetail: {
        imgShow: false
      },
      CommunityModal: false,
      upPicData: {
        fileName: 'label',
        filePath: 'grid/label'
      },
      company_grade: '',
      menuName: '',
      type: '',
      shuju: [],
      codeUrl: '',
      company_codes: '',
      loginCompanyType: '1', // 登录账号类型 1城市 2农村
      loginNames: '',
      modalDevice: false,
      modalDevice1: false,
      modalDevice3: true,
      disabledCodeBtn: false,
      htmllist: [],
      time: '',
      display_model1_obj1: { modal1: false, filepath: '', html: '' },
      timerInterval: null,
      collapsed: false,
      reloadItem: false,
      // logoTime,
      rightImg,
      leftImg,
      logoutImg,
      passwordImg,
      totalItemNum: 0,
      totalBMNum: 0,
      treeDataList: [],
      searchName: '',
      personData: {},
      routeList: [],
      passwordInfo: { show: false },
      display_model1_obj: { modal1: false, filepath: '' },
      maxH: `${document.documentElement.clientHeight}` - 90,
      btnH: `${document.documentElement.clientHeight}` / 2,
      sliderH: `${document.documentElement.clientHeight}` - 90,
      ruleInline: {
        oldpassword: [
          { required: true, message: '请填写旧密码', trigger: 'blur' }
        ],
        newpassword: [
          { required: true, message: '新密码不能为空', trigger: 'blur' },
          {
            type: 'string',
            min: 6,
            message: '密码长度不能少于6位',
            trigger: 'blur'
          }
        ],
        repassword: [
          { required: true, message: '请填写确认密码', trigger: 'blur' },
          {
            type: 'string',
            min: 6,
            message: '密码长度不能少于6位',
            trigger: 'blur'
          },
          { validator: validatePassCheck, trigger: 'blur' }
        ]
      },
      yiQingMenus: [],
      adList: [
        // { content: '全科社工们，系统喊你快来试用', ink: 'xx.com' }
      ],
      location_url: '',
      textArr: [],
      number: 0,
      tempTagNavList: [],
      imgUrl: leftImg,
      dataList: [],
      dataList1: [],
      dataList2: [],
      dataList3: [],
      menu_flag: false,
      menu_flag1: false,
      menu_flag2: false,
      menu_flag3: false,
      menuTitle: this.$store.state.user.menuName
    }
  },
  computed: {
    menuitemClasses: function () {
      return ['menu-item', this.isCollapsed ? 'collapsed-menu' : '']
    },
    text () {
      return {
        id: this.number,
        val: this.textArr[this.number]
      }
    },
    ...mapGetters(['errorCount']),
    tagNavList () {
      return this.$store.state.app.tagNavList
    },
    tagRouter () {
      return this.$store.state.app.tagRouter
    },
    userAvator () {
      return this.$store.state.user.avatorImgPath
    },
    cacheList () {
      const list = [
        'ParentView',
        ...(this.tagNavList.length
          ? this.tagNavList
            .filter((item) => !(item.meta && item.meta.notCache))
            .map((item) => item.name)
          : [])
      ]
      return list
    },
    local () {
      return this.$store.state.app.local
    },
    hasReadErrorPage () {
      return this.$store.state.app.hasReadErrorPage
    },
    unreadCount () {
      return this.$store.state.user.unreadCount
    },
    grade_level () {
      let company_grade = this.$store.state.user.severUserInfo.company_grade
      let grade_level = ''
      switch (company_grade) {
        case '2':
          grade_level = '市级账号'
          break
        case '3':
          grade_level = '区级账号'
          break
        case '4':
          grade_level = '街道账号'
          break
        case '5':
          grade_level = '街道账号'
          break
        case '6':
          grade_level = '社区账号'
          break
        default:
      }
      return grade_level
    },
    loginName () {
      return this.$store.state.user.severUserInfo.loginName
    },
    menuRoleTitle () {
      return this.$store.state.user.menuName
    }
  },
  created () {
    // 在页面加载时读取sessionStorage里的状态信息
    if (sessionStorage.getItem('store')) {
      this.$store.replaceState(
        Object.assign(
          {},
          this.$store.state,
          JSON.parse(sessionStorage.getItem('store'))
        )
      )
      console.log('ddddd')
    }
    // 在页面刷新时将vuex里的信息保存到sessionStorage里面
    window.addEventListener('beforeunload', () => {
      sessionStorage.setItem('store', JSON.stringify(this.$store.state))
    })
    // 获取通告
    selectListPage({ 'publish_status': 1 }).then(res => {
      if (res.data.errcode === 0) {
        this.marqueeList = res.data.data.results.map(item => {
          return {
            content: item.title
          }
        })
        return
      }
      this.$Message.error(res.data.errmsg)
    })
    setInterval(this.showMarquee, 5000)
  },
  methods: {
    // 点击通告跳转
    goRoute () {
      this.$router.push({
        path: '/sysnew/notice'
        // query: {
        //   idcard: row.gmsfhm
        // }
      })
    },
    showMarquee: function () {
      if (this.marqueeList instanceof Array) {
        this.animate = true
        setTimeout(() => {
          this.marqueeList.push(this.marqueeList[0])
          this.marqueeList.shift()
          this.animate = false
        }, 500)
      }
    },
    backTo (name) {
      this.$router.push({
        name: name
      })
    }, // 返回首页
    handleOpen () {
      this.visible = true
    },
    getSearchMenu (text) {
      this.getSearchList(text)
    },
    getSearchList (text) {
      let array = JSON.parse(JSON.stringify(this.dataList))
      let array1 = JSON.parse(JSON.stringify(this.dataList1))
      let array2 = JSON.parse(JSON.stringify(this.dataList2))
      let array3 = JSON.parse(JSON.stringify(this.dataList3))
      this.minZhengMenus = []
      this.minZhengMenus1 = []
      this.minZhengMenus2 = []
      this.minZhengMenus3 = []
      array.forEach((item) => {
        // 网格
        if (item.name.indexOf(text) !== -1) {
          this.minZhengMenus.push(item)
        }
      })
      if (this.minZhengMenus.length === 0) {
        this.menu_flag = false
      }
      array1.forEach((item) => {
        // 实名制
        if (text) {
          if (item.list) {
            item.list.forEach((element) => {
              if (text) {
                if (element.name.indexOf(text) !== -1) {
                  this.minZhengMenus1.push(item)
                }
              } else {
                this.minZhengMenus1.push(item)
              }
            })
          } else {
            if (item.name.indexOf(text) !== -1) {
              this.minZhengMenus1.push(item)
            }
          }
        } else {
          this.minZhengMenus1.push(item)
        }
      })
      if (this.minZhengMenus1.length === 0) {
        this.menu_flag1 = false
      }
      array2.forEach((item) => {
        //  全市通办
        if (text) {
          if (item.list) {
            item.list.forEach((element) => {
              if (text) {
                if (element.name.indexOf(text) !== -1) {
                  console.log(element.name, '相等')
                  this.minZhengMenus2.push(item)
                }
              } else {
                this.minZhengMenus2.push(item)
              }
            })
          } else {
            if (item.name.indexOf(text) !== -1) {
              this.minZhengMenus2.push(item)
            }
          }
        } else {
          this.minZhengMenus2.push(item)
        }
      })
      if (this.minZhengMenus2.length === 0) {
        this.menu_flag2 = false
      }
      array3.forEach((item) => {
        // 疫情
        if (text) {
          if (item.list) {
            item.list.forEach((element) => {
              if (text) {
                if (element.name.indexOf(text) !== -1) {
                  console.log(element.name, '相等')
                  this.minZhengMenus3.push(item)
                }
              } else {
                this.minZhengMenus3.push(item)
              }
            })
          } else {
            if (item.name.indexOf(text) !== -1) {
              this.minZhengMenus3.push(item)
            }
          }
        } else {
          this.minZhengMenus3.push(item)
        }
      })
      if (this.minZhengMenus3.length === 0) {
        this.menu_flag3 = false
      }
      this.$refs.menu.getSearchFlag(
        this.menu_flag,
        this.menu_flag1,
        this.menu_flag2,
        this.menu_flag3
      )
    }, // 搜索菜单
    mzMenulist (text) {
      // let menu_id = '3c649d25-f33c-11ea-88c8-0242ac11000f'
      let menu_id = ''
      if (window.location.href.indexOf('iviewys') !== -1) {
        menu_id = 'f782240b-c3ee-11ed-a868-0242c0a81f02'
      } else {
        menu_id = '3c649d25-f33c-11ea-88c8-0242ac11000f'
      }
      mzMenulist(menu_id).then((ret) => {
        if (ret.data.errcode === 0) {
          this.minZhengMenus = ret.data.data.list[0].list
          this.dataList = JSON.parse(JSON.stringify(this.minZhengMenus))
          this.minZhengMenus.forEach((item) => {
            if (item.path === this.$route.path) {
              this.menuName = item.name
            }
          })
          if (this.minZhengMenus.length === 0) {
            // 查不到数据说明没有权限，则显示暂无权限
            this.flag = true
          }
        }
      })
    },
    qstbMenulist (text) {
      // 全市通办
      console.log(this.menuRoleTitle, 'iddddd')
      this.siderMenuList = []
      let menu_id = ''
      if (this.loginName === 'admin') {
        // admin账号多传一个系统设置
        menu_id = this.menuRoleTitle + ',12aadfd4-41ea-11e7-b04c-ecf4bbcc9540'
      } else {
        menu_id = this.menuRoleTitle
      }
      getMenuList(menu_id).then((ret) => {
        if (ret.data.errcode === 0) {
          this.siderMenuList = ret.data.data
          // 判断是否是本地环境
          // if (window.location.href.indexOf('localhost') !== -1) {
          //   this.siderMenuList = ret.data.data
          // } else {
          //   let data = ret.data.data
          //   let itemsWithIdEqualToOne = data.filter(item => item.id === '6abe0f99-2e14-11ef-9b4b-0242c0a81f02')
          //   itemsWithIdEqualToOne.forEach((item, index) => {
          //     item.children.forEach((item1, index1) => {
          //       if (item1.id === 'c6c0ed6a-34fb-11ef-ac3f-0242c0a80202') {
          //         itemsWithIdEqualToOne[index].children.splice(index1, 1)
          //       }
          //     })
          //   })
          //   console.log(itemsWithIdEqualToOne)
          //   this.siderMenuList = itemsWithIdEqualToOne // 最终显示在左侧的菜单
          // }
          // if (this.menuTitle) { // 根据系统名称匹配菜单
          //   list.forEach(element => {
          //     if (this.menuTitle === element.name) {
          //       this.siderMenuList.push(element)
          //     }
          //     if (this.loginName === 'admin' && element.name === '系统设置') {
          //       this.siderMenuList.push(element)
          //     }
          //   })
          // }
          console.log(this.siderMenuList, '整理后菜单')
          this.minZhengMenus2 = ret.data.data.list
          // this.dataList2 = JSON.parse(JSON.stringify(this.minZhengMenus2))
          // this.minZhengMenus2.forEach(item => {
          //   if (item.path === this.$route.path) {
          //     this.menuName = item.name
          //   }
          // })
        }
      })
    },
    smzMenulist (text) {
      // 实名制
      // let menu_id = 'abf84050-12ca-11eb-b210-0242ac11000f'
      let menu_id = ''
      if (window.location.href.indexOf('iviewys') !== -1) {
        menu_id = '02eabddb-c3ef-11ed-a868-0242c0a81f02'
      } else {
        menu_id = 'abf84050-12ca-11eb-b210-0242ac11000f'
      }
      mzMenulist(menu_id).then((ret) => {
        if (ret.data.errcode === 0) {
          this.minZhengMenus1 = ret.data.data.list
          this.dataList1 = JSON.parse(JSON.stringify(this.minZhengMenus1))
          this.minZhengMenus1.forEach((item) => {
            if (item.path === this.$route.path) {
              this.menuName = item.name
            }
          })
        }
      })
    },
    yqfkMenulist (text) {
      // 疫情防控
      let menu_id = 'c4b9a902-a088-11ea-9adb-0242ac110002'
      mzMenulist(menu_id).then((ret) => {
        if (ret.data.errcode === 0) {
          this.minZhengMenus3 = ret.data.data.list[0].list
          this.dataList3 = JSON.parse(JSON.stringify(this.minZhengMenus3))
          this.minZhengMenus3.forEach((item) => {
            if (item.path === this.$route.path) {
              this.menuName = item.name
            }
          })
        }
      })
    },
    clickMenuList () {
      console.log('$$$$$')
      this.$refs.menu.open()
    },
    clickDropMenu (name) {
      if (name === 'logout') {
        this.logout()
      }
      if (name === 'setPasword') {
        this.passwordInfo.show = true
      }
      switch (name) {
        case 'logout':
          this.logout()
          break
        default:
      }
    },
    aaa (name) {
      console.log(name, '回调')
      if (name === true) {
        setTimeout(() => {
          this.imgUrl = this.rightImg
        }, 200)
      } else if (name === false) {
        setTimeout(() => {
          this.imgUrl = this.leftImg
        }, 200)
      }
    },
    clickMenu (item) {
      console.log(item, '%%%%%%')
      this.$router.push({
        path: item
      })
    },
    // 点击按钮，切换菜单的折叠与展开
    toggleCollapse () {
      this.isCollapse = !this.isCollapse
    },
    checkMenu (flag) {
      this.isCollapsed = !this.isCollapsed
      var box = document.getElementById('box')
      box.hidden = true
      setTimeout(() => {
        box.hidden = false
      }, 200)
      // box.offsetLeft = 180
      // box.remove()
    },
    clickMenu1 (flag) {
      this.isCollapse = true
    },
    handleClose (key, keyPath) {
      console.log(key, keyPath)
    },
    ...mapActions(['handleLogOut']),
    getNetworkIp () {
      let needHost = '' // 打开的host
      try {
        // 获得网络接口列表
        let network = os.networkInterfaces()
        for (let dev in network) {
          let iface = network[dev]
          for (let i = 0; i < iface.length; i++) {
            let alias = iface[i]
            if (
              alias.family === 'IPv4' &&
              alias.address !== '127.0.0.1' &&
              !alias.internal
            ) {
              needHost = alias.address
            }
          }
        }
      } catch (e) {
        needHost = 'localhost'
      }
      return needHost
    },
    logout () {
      this.handleLogOut().then(() => {
        clearInterval(this.timerInterval)
        userLogOut().then(res => {
          if (res.data.errcode === 0) {
            localClear()
          } else {
            this.$Message.error(res.errmsg)
          }
        })
        if (location.href.indexOf('qstb.mzj.shenyang.gov.cn') !== -1) {
          window.open('http://qstb.mzj.shenyang.gov.cn/#/login')
        } else {
          // 生产环境
          this.$router.push({ name: 'login' })
        }
      })
    },
    closePassWord (name) {
      this.passwordInfo.show = false
      this.$refs[name].resetFields()
    },
    setPassWord (name) {
      this.$refs[name].validate((valid) => {
        if (valid) {
          updatePwd(this.passwordInfo).then((res) => {
            if (res.data.data) {
              this.$Notice.success({
                title: '修改成功',
                desc: '修改密码后需要重新登录'
              })
              this.passwordInfo.show = false
              this.logout()
            } else {
              this.$Notice.error({ title: '修改失败', desc: res.data.errmsg })
            }
          })
        } else {
          this.$Notice.error({
            title: '信息错误',
            desc: '密码修改信息错误，请重新填写'
          })
        }
      })
    },
    searchList1 () {
      if (!this.searchName) {
        this.searchList()
      }
    },
    searchList () {
      this.reloadItem = true
      this.treeDataList.forEach((e1) => {
        e1.hidden = true
        if (e1.children) {
          let curNum1 = 0
          e1.children.forEach((e2) => {
            if (e2.children) {
              let curNum2 = 0
              e2.children.forEach((e3) => {
                e3.hidden = true
                if (e3.type_name.indexOf(this.searchName) >= 0) {
                  e3.hidden = false
                  curNum2++
                  curNum1++
                }
              })
              e2.hidden = true
              if (curNum2 > 0) {
                e2.count = curNum2
                e2.hidden = false
              }
            } else {
              e2.hidden = true
              if (e2.type_name.indexOf(this.searchName) >= 0) {
                e2.hidden = false
                curNum1++
              }
            }
          })
          if (curNum1 > 0) {
            e1.count = curNum1
            e1.hidden = false
          }
        } else {
          if (!this.searchName) {
            e1.hidden = false
          }
        }
      })
      this.$nextTick(() => {
        this.reloadItem = false
      })
    },
    ...mapMutations([
      'setBreadCrumb',
      'setTagNavList',
      'addTag',
      'setLocal',
      'setFirstMenuId',
      'setHomeRoute',
      'closeTag'
    ]),
    ...mapActions([
      'handleLogin',
      'getUnreadMessageCount',
      'getAjaxRouterData'
    ]),
    turnToPage (route) {
      // console.log(route, 'main/turnToPage')
      let { name, params, query } = {}
      if (typeof route === 'string') name = route
      else {
        name = route.name
        params = route.params
        query = route.query
      }
      if (name.indexOf('isTurnByHref_') > -1) {
        window.open(name.split('_')[1])
        return
      }
      this.$router.push({
        name,
        params,
        query
      })
    },
    handleCollapsedChange (state) {
      this.collapsed = state
    },
    handleCloseTag (res, type, route) {
      if (type !== 'others') {
        if (type === 'all') {
          this.turnToPage(this.$config.homeName)
        } else {
          if (routeEqual(this.$route, route)) {
            this.closeTag(route)
          }
        }
      }
      this.setTagNavList(res)
    },
    handleClick (item) {
      // console.log(item, '执行main/handleClick')
      this.turnToPage(item)
    },
    getRouterListData () {
      getRouterReq('222').then((res) => {
        let listData = getMenuByRouter(res.data, 'admin')
        this.menuList001 = listData
      })
    },
    groupMenuSelect (id, menusData) {
      // this.setFirstMenuId(id)
      localSave('first-menus-data', JSON.stringify(menusData))
      this.$store.dispatch('getAjaxRouterData', id)
    }
  },
  watch: {
    $route (newRoute) {
      console.log(newRoute, '第二是监听watch新的路由变化')
      let tempMenuList = this.menuList
      console.log(this.menuList, '获取当菜单数据')
      for (let key in tempMenuList) {
        let childData = tempMenuList[key].children
        if (
          tempMenuList[key].name &&
          tempMenuList[key].name === newRoute.name
        ) {
          console.log('ok11')
          newRoute.meta.title = tempMenuList[key].meta.title // 为了不在路由里面取名字写的循环
        } else {
          if (
            tempMenuList[key].children &&
            tempMenuList[key].children.length > 0
          ) {
            for (let k2 in childData) {
              let chid = childData[k2]
              if (chid.name === newRoute.name) {
                console.log('ok')
                newRoute.meta.title = chid.meta.title // 为了不在路由里面取名字写的循环
              }
            }
          }
        }
      }
      const { name, query, params, meta } = newRoute
      if (newRoute.meta.hide === true) {
        this.addTag({
          route: { name, query, params, meta },
          type: 'push'
        })
        this.setBreadCrumb(newRoute)
        this.tempTagNavList = []
        for (var i = 0; i < this.tagNavList.length; i++) {
          if (this.tagNavList[i].meta.hide === true) {
            this.tempTagNavList.push(this.tagNavList[i])
          }
        }
        this.setTagNavList(getNewTagList(this.tempTagNavList, newRoute))
      }
    },
    menuTitle (value) {
      console.log(value, '新值')
    }
  },
  mounted () {
    console.log(this.grade_level, this.menuTitle, this.menuRoleTitle, '登记')
    this.location_url = window.location.href
    // this.mzMenulist()
    this.qstbMenulist()
    // this.smzMenulist()
    // this.yqfkMenulist()
    this.setTagNavList()
    this.setHomeRoute(routers)
    const { name, params, query, meta } = this.$route
    this.addTag({
      route: { name, params, query, meta }
    })
    let severUserInfo = this.$store.state.user.severUserInfo
    this.company_grade = severUserInfo.company_grade
    this.loginCompanyType = severUserInfo.company_type
    this.company_codes = severUserInfo.company_code
    this.loginNames = severUserInfo.loginName
    this.personData.name = severUserInfo.name
    this.personData.company_name = severUserInfo.company_name
    this.routeList = this.$store.state.app.mainv3Nav
  }
}
</script>
<style lang="less" scoped>

// 平铺样式
.header-line-left-box-item {
  display: flex;
  justify-content: space-between;
  max-width: 900px;
  overflow: auto;
  white-space: nowrap;
}

/*滚动条样式*/
.header-line-left-box-item::-webkit-scrollbar {
  /*滚动条整体样式*/
  width: 6px;
  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}

.header-line-left-box-item::-webkit-scrollbar-thumb {
  /*滚动条里面小方块*/
  border-radius: 5px;
  box-shadow: inset005pxrgba(0, 0, 0, 0.2);
  background: rgba(255, 255, 255, 0.8);
}

.header-line-left-box-item::-webkit-scrollbar-track {
  /*滚动条里面轨道*/
  box-shadow: inset005pxrgba(0, 0, 0, 0.2);
  border-radius: 0;
  background: rgba(0, 0, 0, 0.1);
}
.header-line-right-item {
  display: flex;
  align-items: center;
  height: 100%;
  float: right;
  font-size: 14px;
  font-weight: 400;
  margin-left: 10px;
  cursor: pointer;
}
.marquee {
  width: 100%;
  align-items: center;
  display: flex;
  box-sizing: border-box;
  overflow: hidden;
}

.marquee_title {
  padding: 0 20px;
  font-size: 14px;
  border-right: 1px solid #d8d8d8;
  align-items: center;
}

.marquee_box {
  display: block;
  position: relative;
  width: 38rem;
  height: 30px;
  overflow: hidden;
}

.marquee_list {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
}

.marquee_top {
  transition: all 1s;
  margin-top: -30px;
}

.marquee_list li {
  height: 30px;
  line-height: 30px;
  font-size: 14px;
  padding-left: 20px;
}

.marquee_list li span {
  padding: 0 2px;
}
.new-menu
  .ivu-menu-light.ivu-menu-vertical
  .ivu-menu-item-active:not(.ivu-menu-submenu) {
  color: #b40001;
  background: white;
  z-index: 2;
  height: 45px;
  border-radius: 5px;
  background: #efefef;
  margin-left: 10px;
  margin-right: 10px;
  padding-left: 10px;
  padding-right: 0px;
}
.new-menu .ivu-menu-item:hover {
  color: #b40001;
  font-weight: bold;
}
.new-menu /deep/ .ivu-menu-vertical .ivu-menu-submenu-title:hover {
  color: #b40001;
}
.ivu-select-dropdown {
  padding: 5px 0 10px 0;
}
.ivu-dropdown-menu {
  min-width: 100px;
  width: 238px;
  padding: 5px 10px;
}
/deep/ .ivu-modal-header {
  border-bottom: 0px solid #e8eaec;
  padding: 30px 30px 0px 30px;
  line-height: 1;
}
/deep/ .ivu-modal-header-inner {
  font-family: "PingFang SC Bold";
  font-weight: 700;
  font-size: 14px;
  text-align: left;
  color: #b40001;
}
/deep/ .ivu-modal-footer {
  border-top: 0px solid #e8eaec;
  padding: 0px 30px 30px 30px;
  text-align: left;
}
/deep/ .ivu-modal-close {
  border-radius: 10px;
  background-color: #f6f4f4;
  right: 30px;
  top: 30px;
  width: 20px;
  height: 20px;
}
/deep/ .ivu-modal-close .ivu-icon-ios-close {
  font-size: 20px;
  top: 0px;
}
/deep/ .ivu-modal-body {
  padding: 14px 30px 5px 30px;
}
/deep/ .ivu-input {
  border: 1px solid #dcdee2;
  box-shadow: none;
}
/deep/ .ivu-input:hover {
  border: 1px solid #dcdee2;
  box-shadow: none;
}
/* 隐藏滑动条 */
.sider-menu-div::-webkit-scrollbar {
  display: none;
}
/* 隐藏滑动条 */
</style>
