/*协议*/
<template>
  <div class="protocol">
    <div class="container">
      <div class="content">
        <h3 class="title">{{title}}</h3>
        <p v-for="list in content" :key="list">{{list}}</p>
        <div class="btn">
          <el-button
            type="danger"
            size="small"
            class="agree-btn"
            @click.native.prevent="Agree"
          >我已阅读并同意</el-button>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { request } from '@/utils/request'
export default {
  name: 'Protocol',
  data() {
    return {
      title: '注册协议',
      content: []
    }
  },
  created() {
    let params = {
      transCode: 'C00020',
      type: 'P001'
    }
    request(params)
      .then(res => {
        this.content = res.content.split('\n')
      })
      .catch(err => {})
  },
  methods: {
    //阅读并同意
    Agree() {
      this.$router.go(-1)
    }
  }
}
</script>

<style lang="scss" scoped>
@import '@/styles/variables.scss';
@import '@/styles/mixin.scss';
.protocol {
  padding: 50px 0;
  @include w_h(100%, 100%);
  background: $color_f5;
  .container {
    @include w_h(100%, 100%);
    .content {
      padding: 0 $pad;
      @include w_h(100%, 100%);
      overflow-y: scroll;
      .title {
        margin-bottom: 20px;
        font-size: 16px;
        text-align: center;
        color: $color_6;
      }
      p {
        margin-bottom: 10px;
        font-size: 14px;
        color: $color_9;
        text-align: justify;
        word-wrap: break-word;
        text-indent: 28px;
      }
      .btn {
        @include w_h();
        @include flex(center);
        .agree-btn {
          margin: 20px auto;
        }
      }
    }
  }
}
</style>