<template>
    <el-dialog class="visual-about-dialog" title="" :visible.sync="visible" width="800px" append-to-body destroy-on-close :before-close="close">
      <div class="visual-about-header">
        <div>知识产权风控与组织记忆系统</div>
        <div>Intellectual property risk Control and organizational memory system</div>
      </div>
      <div class="visual-about-content">
        <p>专利制度是企业参与市场竞争特别是国际化竞争所不能绕开的，只有充分的、熟练的掌握并利用好专利制度，才能在市场竞争中游刃有余，进而取得最大化的商业利益、国家利益。</p>
        <p>知识产权分析是在专利制度的框架下，充分利用现有的产业和专利信息，运用大数据和专利分析的手段与方法进行分析、梳理、总结、判断，发现问题并给出解决问题的方案。</p>
        <p>本系统为用户提供了一种知识产权风控体系和组织记忆的操作思路和方法，通过解决企业具体问题场景的方式，为用户提供了具有可操作性的参考，并由此协助企业形成自主知识传承、叠加、不断衍化提升并且能够重复再应用的核心智谋知识系统。</p>
      </div>
      <div class="visual-about-footer">
        <div class="visual-about-footer-button" @click="handleClose">
          <img src="@/assets/visual/4921.png" alt="">
          <span>下次不再弹出</span>
        </div>
      </div>
    </el-dialog>
</template>
  
<script>
  export default {
    data() {
      return {
        visible: false
      }
    },
    mounted() {
    },
    methods: {
      open() {
        const o = this.$s.getStr('o')
        if (o) {
          return false
        }
        this.visible = true
      },
      close() {
        this.visible = false
      },
      handleClose() {
        this.close()
        this.$s.setStr('o', true)
      }
    }
  }
  </script>
  
  <style lang="scss">
  .visual-about-dialog {
    .el-dialog {
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      margin: 0 !important;
      border-radius: 20px;
      .el-dialog__headerbtn {
        width: 40px;
        height: 40px;
        border-radius: 10px;
        background: #deedff;
        border: 1px solid #fff;
        .el-dialog__close {
          color: #3084e5;
          font-weight: bold;
        }
      }
    }
    .visual-about-header {
      text-align: center;
      div:first-child {
        font-weight: bold;
        font-size: 28px;
        color: #3084e5;
      }
      div:last-child {
        font-weight: 600;
        font-size: 10px;
        letter-spacing: 0.07em;
        text-align: center;
        color: #33233e;
      }
    }
    .visual-about-content {
      margin-top: 30px;
      width: 760px;
      height: 280px;
      border-radius: 15px;
      background: transparent;
      border: 1px solid #e5e5e5;
      p {
        text-indent: 2em;
        margin: 20px;
        width: 719px;
        height: 52px;
        font-weight: 400;
        font-size: 16px;
        line-height: 30px;
        text-align: left;
        color: #33233e;
      }
    }
    .visual-about-footer {
      text-align: right;
      margin-top: 20px;
      height: 20px;
      .visual-about-footer-button {
        cursor: pointer;
        float: right;
        img {
          position: relative;
          top: 5px;
          right: 10px;
        }
        span {
          font-weight: 400;
          font-size: 16px;
          text-align: center;
          color: #33233e;
        }
      }
    }
  }
  </style>