<template>
    <div class="home_wrapper">
        <div class="head_main">
            <div class="location">

              <div class="address"><i class="icon"></i>{{deptName}}</div>

              <div class="address">{{bookName}}</div>

            </div>
            <div class="exit_btn" @click="$router.push({name:'sunVillageInfoLogin'})">
                <i class="icon"></i>
            </div>
        </div>
        <div class="index_info">
            <div class="title"></div>
            <div class="nav_list">

              <!--党务-->
              <router-link
                v-for="(item,idx) in xsgsList"
                :key="item.id"
                :to="{name:item.menuUrl,query:{type:'code',typeX:item.urlPara}}"
                class="nav_item"
              >
                <img :src="require('@/assets/images/sunVillage_info/' + item.menuIcon)">
              </router-link>

<!--              &lt;!&ndash;村务&ndash;&gt;-->
<!--              <router-link :to="{name:'sunVillageInfoListContract',query:{type:'code',typeX:'3'}}" class="nav_item n2">-->
<!--                <img src="../../assets/images/sunVillage_info/index_code_btn_7.png">-->
<!--              </router-link>-->

<!--              &lt;!&ndash;财务&ndash;&gt;-->
<!--              <router-link :to="{name:'sunVillageInfoListFinance',query:{type:'code'}}" class="nav_item n1">-->
<!--                <img src="../../assets/images/sunVillage_info/index_code_btn_1.png">-->
<!--              </router-link>-->

<!--              &lt;!&ndash;零工&ndash;&gt;-->
<!--              <router-link :to="{name:'sunVillageInfoListTourists',query:{type:'code'}}" class="nav_item n2">-->
<!--                <img src="../../assets/images/sunVillage_info/index_code_btn_2.png">-->
<!--              </router-link>-->

<!--              &lt;!&ndash;合同&ndash;&gt;-->
<!--              <router-link :to="{name:'sunVillageInfoListContract',query:{type:'code',typeX:'1'}}" class="nav_item n1">-->
<!--                <img src="../../assets/images/sunVillage_info/index_code_btn_5.png">-->
<!--              </router-link>-->

<!--              &lt;!&ndash;村庄图&ndash;&gt;-->
<!--              <router-link :to="{name:'sunVillageInfoListPhoto',query:{type:'code'}}" class="nav_item n2">-->
<!--                <img src="../../assets/images/sunVillage_info/index_code_btn_4.png">-->
<!--              </router-link>-->

<!--              &lt;!&ndash;重大事项&ndash;&gt;-->
<!--              <router-link :to="{name:'sunVillageInfoListIssues',query:{type:'code'}}" class="nav_item n1">-->
<!--                <img src="../../assets/images/sunVillage_info/index_code_btn_3.png">-->
<!--              </router-link>-->

            </div>
        </div>
        <div :class="{'footer':xsgsList.length < 9 , 'footer2':xsgsList.length > 8}">
            {{configValue == ""?'技术支持：北京农燊高科信息技术有限公司':configValue}}
        </div>
      <img src="../../assets/images/sunVillage_info/index_btn_green.png" class="fixed_btn" @click="goCode">
    </div>
</template>
<script>
  import {bookInfo, nologinMenus} from "@/api/sunVillage_info/fixedAssets";
  import { sysConfig } from "@/api/homesteadSurvey/index";
  import Cookies from "js-cookie";
  export default {
    name: "sunVillageInfoIndexCode",
    data() {
      return {
        xsgsList:[],
        deptIdOptions:[],
        villageVisbile:false,
        showBookList:false,
        deptName:'',
        //选中的值
        villageValue: "",
        //省市区区级list
        hcAreaInfoOption: [],
        hcAreaInfoFieldName: {
          text: "label",
          value: "value",
          children: "children",
        },
        bookName:'',
        queryParams: {
          pageNum: 1,
          pageSize: 100,
        },
        //账套列表
        bookVisbile:false,
        bookList:[],
        bookName:"",
        bookId:"",
        book:"",

        configValue:''
      };
    },
    created() {
      console.log(this.$store)

      if(this.$route.query.bookId){
        bookInfo(this.$route.query.bookId).then((res) => {
          if (res.code == 200) {
            let seconds = 3600;

            let expires = new Date(new Date() * 1 + seconds * 1000);
            Cookies.set("bookName", res.data.bookName, {
              expires: expires,
            });
            Cookies.set("deptName", res.data.deptName, {
              expires: expires,
            });
            this.deptName = res.data.deptName;
            this.bookName = res.data.bookName;
          }
        });
        Cookies.set("bookId", this.$route.query.bookId, {
          expires: 30,
        });
      }
      Cookies.set("deptId", this.$route.query.deptId, {
        expires: 30,
      });

      let query = {
        identityType:1
      }
      nologinMenus(query).then((res) => {
        if (res.code == 200) {
          this.xsgsList = res.data[0].menus;
        }
      });
      let params={
        configKey: "system.company.name"}
      sysConfig(params).then((res) => {
        if (res.code == 200) {
          this.configValue = res.rows[0].configValue;
        }
      });
    },
    methods: {
      goCode(){
        if (Cookies.get('user')){
          this.$router.push({path:'/sunVillage_info/index_code_rights'})
        }else{
          this.$router.push({path:'/sunVillage_info/login_code'})
        }
      }
    },
  }
</script>
<style scoped lang="scss">
  .fixed_btn{
    position: fixed;
    right: 0;
    width: 40PX;
    bottom: 15%;
    border-top-left-radius: 115PX;
    border-bottom-left-radius: 115PX;
    box-shadow: 0px 2px 5px #ccc;
  }
.home_wrapper{
    background: #f1f2f2;
    width: 100vw;
    min-height: 100vh;
    .head_main{
        height: 340px;
        background: url('../../assets/images/sunVillage_info/index_head_red.png') no-repeat;
        background-size: 100% 100%;
        position: relative;
        .location{
            height: 42px;
            line-height: 42px;
            position: absolute;
            left: 38px;
            top: 72px;
            display: flex;
            .address{
                padding:0 18px;
                background:rgba(255,255,255,0.75);
                border-radius: 42px;
                font-size: 28px;
                color: #3f3d56;
                margin-right: 12px;
                display: flex;
                align-items:center;
                .icon{
                    display: block;
                    width: 20px;
                    height: 26px;
                    background: url('../../assets/images/sunVillage_info/index_icon_1.png') no-repeat;
                    background-size: 100% 100%;
                    margin-right: 10px;
                }
            }
        }
        .exit_btn{
            width: 61px;
            height: 61px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            position: absolute;
            top: 64px;
            right: 36px;
            .icon{
                width: 100%;
                height: 100%;
                background: url('../../assets/images/sunVillage_info/login_head_h_green.png') no-repeat;
                background-size: 100% 100%;
            }
        }
    }
    .index_info{
        padding-top: 4.1vh;
        .title{
            width: 521px;
            height: 52px;
            background: url('../../assets/images/sunVillage_info/index_title2.png') no-repeat;
            background-size: 100% 100%;
            margin:0 auto;
        }
      .nav_list{
        margin-top: 6vh;
        padding:0 30px;
        display: flex;
        flex-flow: wrap;
        margin-bottom: 40PX;
        .nav_item{
          width: calc(50% - 10px);
          /*height: 180px;*/
          border-radius: 30px;
          font-size: 24px;
          color: #3f3d56;
          text-align: center;
          display: flex;
          align-items: center;
          justify-content: center;
          margin-bottom: 20px;
          img{
            width: 100%;
          }
          &:nth-child(even){
            margin-left: 20px;
          }
        }
      }
    }
    .footer{
        position: absolute;
        bottom: 5.5vh;
        width: 100%;
        font-size: 22px;
        color: #3f3d56;
        text-align: center;
    }
    .footer2{
        width: 100%;
        font-size: 22px;
        color: #3f3d56;
        text-align: center;
        margin-top: 15PX;
        padding-bottom: 30PX;
    }
}
</style>
