<template>
  <div class="popup">
    <img class="icon" src="/img/icon/success.png" alt="极度证券">
    <div class="title">
      <!-- 报单成功 -->
      {{ $t('option.l93') }}
    </div>
    <div class="tip">
      <!-- 开仓订单已提交,请耐心等待系统成交 -->
      {{ $t('option.l94') }}
    </div>
    <div class="btn-box flex">
      <div class="btn ltn" @click="shareLink">
        <!-- 分享订单 -->
        {{ $t('option.l95') }}
      </div>
      <div class="btn rtn" @click="$router.push('/option-records/2')">
        <!-- 前往订单中心 -->
        {{ $t('option.l96') }}
      </div>
    </div>
  </div>
</template>
<script>
import NativeShare from 'nativeshare'
import { copyText } from '@/utils/index'
export default {
  methods: {
    cancel() {
      this.$emit('cancel')
    },
    shareLink() {
      try {
        this.nativeShare = new NativeShare()
        var shareData = {
          // title: '极度证券',
          // desc: '极度证券',
          // img: '',
          // 如果是微信该link的域名必须要在微信后台配置的安全域名之内的。
          link: window.location.href,
          icon: window.location.origin + '/logo.png',
        }
        this.nativeShare.setShareData(shareData)
        this.nativeShare.call()
      } catch (err) {
        copyText(window.location.href)
      }
    }
  }
}
</script>
<style lang="less" scoped>
.popup {
  padding: 26px 19px 24px;
  text-align: center;
  .icon {
    display: block;
    margin: 0 auto;
    width: 71px;
  }
  .title {
    padding-top: 15px;
    padding-bottom: 9px;
    font-size: 18px;
    font-weight: 600;
    color: #000000;
  }
  .tip {
    color: #A6A6A6;
    font-size: 14px;
    padding-bottom: 12px;
  }
}
.btn-box {
  padding: 14px 2px 0;
  font-size: 15px;
  font-weight: 600;
  .btn {
    flex: 1;
    text-align: center;
    line-height: 38px;
    border-radius: 6px;
    &+.btn {
      margin-left: 16px;
    }
  }
  .ltn {
    border: 1px solid #DEDEDE;
    color: #000;
  }
  .rtn {
    border: 1px solid var(--color-);
    color: #fff;
    background-color: var(--color-);
  }
}
</style>