mall-web-ssr/components/store/home/Certificate.vue

<template>
  <div class="brand" style="padding-top: 25px;">
    <div class="brand-content">
      <div class="title"><span>资质证明</span></div>
     <!-- <div class="info">
        <div><span>注册地址&nbsp;:&nbsp;</span><span>深圳市南山区高新技术园英唐大厦一楼</span></div>
        <div><span>注册号&nbsp;:&nbsp;</span><span>834631</span></div>
        <div><span>企业类型&nbsp;:&nbsp;</span><span>民营企业</span></div>
        <div><span>官网地址&nbsp;:&nbsp;</span><span>http://www.worldshine.net/profile.html</span></div>
      </div>-->
    </div>
    <qualification-certificate></qualification-certificate>
  </div>
</template>
<script>
  import QualificationCertificate from './QualificationCertificate.vue'
  export default {
    name: 'certificate-self',
    data () {
      return {
        type: 0
      }
    },
    filters: {
      introduceFilter: function (title) {
        if (title === '') {
          return title
        }
        let len = 0
        let index = 0
        for (let i = 0; i < title.length; i++) {
          if (index === 0 && title.charAt(i).charCodeAt(0) > 255) {
            len = len + 2
          } else {
            len++
          }
          if (len > 240) {
            index = i
            break
          }
        }
        if (index > 0) {
          return title.substring(0, index) + '...'
        } else {
          return title
        }
      }
    },
    components: {
      QualificationCertificate
    }
  }
</script>
<style  lang="scss" scoped>
  .brand{
    min-width: 1190px;
    background: #ece9ec;
    .brand-content{
      width: 1190px;
      padding: 0px;
      margin: 0 auto;
      background: #fff;
      .title {
        width: 100%;
        padding: 13px 0px;
        margin-top: 9px;
        margin-bottom: 25px;
        border-bottom: 1px solid #edf0f4;
        span{
          display: inline-block;
          height: 23px;
          line-height: 23px;
          color: #666;
          padding-left: 10px;
          border-left: 3px solid #366ad0;
        }
      }
      .info{
        margin: 0 auto;
        padding: 32px 0px;
        >div{
          display: table-cell;
          width: 200px;
          text-align: center;
          &:first-child,&:last-child{
            width: 395px;
          }
          span:first-child{
            font-size: 12px;
            color: #666;
          }
          span:last-child{
            font-size: 12px;
            color: #333;
          }
        }
      }
    }
  }
</style>