<!-- 第三步：确认订单 -->

<template>
  <div class="confirm">
    <div class="info-title">
      <i class="selftmreg_shuxian"></i>
      <h4>
        商标信息
        <span class="edit">
          <i class="el-icon-edit"></i>
          <b>编辑</b>
        </span>
      </h4>
    </div>
    <div class="brand-info">
      <p>
        <strong>商标类型：</strong>
        <span>文字图标</span>
      </p>
      <p>
        <strong>商标名称：</strong>
        <span>gongsibao</span>
      </p>
      <p>
        <strong>商标图样：</strong>
        <img src="http://temp.im/104x104/ff5a5f/fff" alt />
      </p>
      <p>
        <strong>商标类别：</strong>
        <span class="detail-type">
          <i>15 类 乐器</i>
          <br />
          <b>150001 手风琴</b>
          <b>150008 钢琴</b>
          <b>150011 小六角手风琴</b>
          <b>150013 低音提琴（乐器）</b>
          <b>150016 大号（号）</b>
          <b>150019 小铃帽（乐器）</b>
        </span>
      </p>
    </div>

    <div class="info-title">
      <i class="selftmreg_shuxian"></i>
      <h4>
        申请人及联系人信息
        <span class="edit" @click="goSteptwo">
          <i class="el-icon-edit"></i>
          <b>编辑</b>
        </span>
      </h4>
    </div>
    <div class="user-info">
      <ul>
        <li>
          <strong>申请人类型：</strong>
          <span>企业</span>
        </li>
        <li>
          <strong>公司名称：</strong>
          <span>company name</span>
        </li>
        <li>
          <strong>邮政编码：</strong>
          <span>463800</span>
        </li>
        <li>
          <strong>公司地址：</strong>
          <span>company address</span>
        </li>
        <li>
          <strong>联系人：</strong>
          <span>reqr</span>
        </li>
        <li>
          <strong>联系电话：</strong>
          <span>13525897326</span>
        </li>
        <li>
          <strong>电子邮箱：</strong>
          <span>12e3r@qq.com</span>
        </li>
        <li>
          <strong>信用编码：</strong>
          <span>91110000551350971K</span>
        </li>
      </ul>
    </div>

    <div class="info-title">
      <i class="selftmreg_shuxian"></i>
      <h4>订单备注</h4>
    </div>
    <!-- 文本域 -->
    <el-input
      type="textarea"
      :rows="2"
      placeholder="如有特殊需要，请填写订单备注"
      v-model="textarea"
    ></el-input>
  </div>
</template>

<script>
export default {
  data() {
    return {
      textarea: ""
    };
  },
  methods: {
    // click未生效
    goSteptwo() {
      console.log(222);
      // 去第二步骤的页面
    }
  }
};
</script>

<style lang="scss" scoped>
.info-title {
  .selftmreg_shuxian {
    width: 3px;
    height: 15px;
    background-color: #0989c5;
    display: inherit;
    float: left;
    margin-top: 4px;
    margin-right: 10px;
  }
  h4 {
    font-size: 16px;
    font-family: PingFangSC;
    font-weight: 400;
    color: rgba(83, 83, 83, 1);
    margin-bottom: 15px;
  }
}
// 编辑图文
.edit {
  color: #409efe;
}

// 商标信息
.brand-info {
  p {
    margin-bottom: 23px;
    strong {
      width: 120px;
      display: inline-block;
      text-align: right;
      color: rgb(99, 101, 105);
    }
    span {
      font-size: 14px;
      font-weight: 400;
      color: #333;
    }
    span.detail-type {
      display: inline-block;
      width: 900px;
      vertical-align: top;
      i {
        font-size: 14px;
        font-weight: 600;
        display: inline-block;
        padding-bottom: 10px;
      }
      b {
        font-size: 14px;
        font-weight: 400;
        margin-right: 20px;
        text-align: left;
        color: #333;
      }
    }
    img {
      display: inline-block;
      border: 2px dashed rgb(233, 233, 233);
      vertical-align: top;
    }
  }
}

// 申请人及联系人信息
.user-info {
  ul {
    li {
      display: inline-block;
      width: 50%;
      padding-bottom: 23px;
      strong {
        width: 120px;
        display: inline-block;
        text-align: right;
        color: rgb(99, 101, 105);
      }
      span {
        font-size: 14px;
        font-weight: 400;
        color: #333;
      }
    }
  }
}

// 订单备注  样式没加上！！
.confirm div.el-textarea textarea.el-textarea__inner {
  border-radius: 0;
  min-width: 980px;
  height: 82px;
  resize: none;
  border: 1px solid #d6daeb;
}
</style>
