mall-web-ssr/components/applyPurchase/articleThree.vue

<template>
  <div class="article_three">
    <div class="get_business">
      <a @click="showRemindBox = true">查看 》</a>
    </div>
    <!--弹出框-->
    <el-dialog
      :visible.sync="showRemindBox">
      <div class="content">
        <span @click="showRemindBox = false">×</span>
        <img src="/images/applyPurchase/dialog_banner.png">
        <a @click="Maintenance()">去维护个人产品 》</a>
      </div>
    </el-dialog>
  </div>
</template>
<script>
  export default {
    data () {
      return {
        showRemindBox: false
      }
    },
    computed: {
      user () {
        return this.$store.state.option.user
      }
    },
    methods: {
      Maintenance () {
        if (!this.user.logged) {
          this.$message.error('请先登录')
        } else {
          let isSelf = true
          let tempEnterprise = {}
          let ens = this.user.data.enterprises
          if (ens && ens.length) {
            ens.forEach(function (item) {
              if (item.current) {
                isSelf = false
                tempEnterprise = item
              }
            })
          } else {
            isSelf = true
          }
          if (isSelf) {
            this.$message.error('请先点击【卖家中心】升级成为卖家')
          } else {
            if (tempEnterprise.isVendor === 313) {
              window.location.href = '/vendor#/vendor_upload?type=self'
            } else {
              this.$message.error('请先点击【卖家中心】升级成为卖家')
            }
          }
        }
      }
    }
  }
</script>
<style lang="scss">
  .el-dialog--small{
    width:1190px;
    .el-dialog__header{
      display:none;
    }
    .el-dialog__body{
      padding:0;
      .content{
        position:relative;
        span{
          position:absolute;
          top:15px;
          right:25px;
          display:inline-block;
          width:32px;
          height:32px;
          cursor:pointer;
          line-height: 26px;
          font-size:36px;
          color:#fff;
          background: #999999;
          border-radius:50%;
          text-align: center;
        }
        a{
          position:absolute;
          top: 1525px;
          left: 215px;
          display:inline-block;
          width:135px;
          height:30px;
          line-height: 30px;
          color:#eee;
          background: #2496f1;
          border-radius:5px;
          text-align: center;
        }
        img{
          width:100%;
        }
      }
    }
  }
  .article_three{
    position:relative;
    border-radius:5px;
    border:1px solid #d2d2d2;
    margin-bottom:20px;
    .get_business{
      padding-top:275px;
      height:340px;
      background: url(/images/applyPurchase/business_banner.png)no-repeat center;
      > a{
        width: 130px;
        height: 30px;
        line-height: 30px;
        background: #2496f1;
        color: #fdfdfd;
        font-size: 14px;
        display: block;
        border-radius: 3px;
        cursor: pointer;
        text-align: center;
        margin:0 auto;
      }
    }

  }
</style>