<template>
  <div class="infosbox">
    <div class="box">
      <links></links>
      <div class="textbox">
        <div class="infobox">
          <div class="info">
            <div class="title">主办单位：</div>
            <div class="text">{{ configurationdata && configurationdata.company }}</div>
          </div>
          <div class="info">
            <div class="title">单位电话：</div>
            <div class="text">{{ configurationdata && configurationdata.phone }}</div>
          </div>
          <div class="info">
            <div class="title">单位地址：</div>
            <div class="text">{{ configurationdata && configurationdata.address }}</div>
          </div>
          <div class="info">
            <div class="title">单位邮编：</div>
            <div class="text">{{ configurationdata && configurationdata.postcode }}</div>
          </div>
          <div class="info">
            <div class="title">备案号：</div>
            <div class="text">{{ configurationdata && configurationdata.record }}</div>
          </div>
          <a class="info" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=22010502000540"  style="text-decoration:none;">
            <img src="../../assets/foot/ga.png" alt="公安备案" class="ga">
            <div class="text">吉公网安备：22010502000540</div>
          </a>
        </div>
        <img src="../../assets/foot/sy.png" alt="事业单位" class="sydw" @click="btnuri">
      </div>
    </div>
  </div>
</template>

<script>
import links from './links.vue'
import { createNamespacedHelpers } from 'vuex'
const { mapActions: configmapActions, mapState: configmapState } = createNamespacedHelpers('webconfig')
export default {
  components: {
    links
  },
  data () {
    return {}
  },
  methods: {
    ...configmapActions(['configurationquery']),
    btnuri () {
      window.open('https://bszs.conac.cn/sitename?method=show&id=524ADCB53D406989E053012819AC8466')
    }
  },
  mounted () {
    this.configurationquery()
  },
  computed: {
    ...configmapState(['configurationdata'])
  }
}
</script>

<style lang="less" scoped>
.infosbox {
  width: 100%;
  height: 250px;
  background: #ebebeb;
  .box {
    width: 80%;
    margin: 0 auto;
  }
  .infobox {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    padding-top: 25px;
    .info {
      width: 49%;
      display: flex;
      margin-top: 5px;
      .title {
        width: 15%;
        text-align: left;
        color: #666;
        font-size: 0.8em;
      }
      .ga {
        width: 3%;
        margin-right: 1%;
      }
      .text {
        width: 70%;
        text-align: left;
        color: #666;
        font-size: 0.8em;
      }
    }
  }
  .textbox {
    display: flex;
  }
  .sydw {
    display: block;
    margin: 2% 0 0 -10%;
    height: 4em;
  }
}
</style>
