front-end/ghsApp/src/admin/shop/renewSuccess.vue

<template>
    <view class="app-content">
      <view class="billing_box_bg">
        <view class="top-view"> </view>
        <view class="result-view">
          <view :class="['iconfont', 'iconchenggong']"></view>
          <view class="result-title">支付成功</view>
          <view class="result-title" v-if="type == 0">已延长到：{{ deadline?deadline.substr(0,10):'' }}</view>
          <button class="admin-button-com big" style="width:45vw;margin-top:20upx;" @click="goBack">返回</button>
        </view>
      </view>
    </view>
  </template>
  <script>
  import { mapGetters } from "vuex";
  import {currentShop} from "@/api/shop";
  export default {
    name: "renewSuccess",
    data() {
      return {
        deadline:'',
        type:0
      }
    },
    onLoad () {
      this.type = this.option.type?this.option.type:0
    },
    methods: {
      goBack(){
        uni.navigateBack({delta:1})
      },
      init(){
        let that = this
        currentShop().then(res => {
          if(res.code == 1){
            that.deadline = res.data.deadline
          }
        })
      }
    }
  };
  </script>
  <style lang="scss" scoped>
  .go-back{
      width: 80%;
      height: 80upx;
      color: #FFFFFF;
      margin-top: 50upx;
      background: #3385FF;
      border-radius: 10upx;
      font-size:30upx;
  }
  .title{
      font-weight:700;
      margin-bottom:30upx;
      font-size:30upx;
  }
  .product-area{
      width:730upx;
      height:90upx;
      display:flex;
      align-items:center;
      .first-area{
          border-bottom:1upx solid #e4e2e2;
          position:relative;
      width:550upx;
          .name{
              width:280upx;
              overflow: hidden;
              text-overflow:ellipsis;
              white-space: nowrap;
              display:inline-block;
              font-weight:bold;
              font-size:28upx;
          }
          .cg-cost{
              font-weight:bold;
              font-size:27upx;
              color:red;
              position:absolute;
              left:480upx;
              top:8upx;
          }
          .cost-price{
              font-weight:bold;
              font-size:27upx;
              color:blue;
              position:absolute;
              left:515upx;
              top:18upx;
          }
          input{
              border:1upx solid #cccccc;
              display:inline-block;
              width:135upx;
              margin-left:10upx;
              margin-right:30upx;
              text-align:center;
              font-size:30upx;
          }
      }
      .second-area{
          float:left;
          color:#646464;
          margin-top:10upx;
          .one{
              color:red;
          }
          .two{
              color:#CCCCCC;
          }
      }
  }
  .billing_box_bg {
    position: relative;
    padding: 30upx 30upx;
    display: flex;
    flex-direction: column;
    background-color: #f5f5f5;
    .top-view {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 299upx;
      background: #3385ff;
      border-radius: 0upx 0upx 83upx 83upx;
    }
    .result-view {
      position: relative;
      display: flex;
      flex-direction: column;
      align-items: center;
      padding: 30upx 70upx 70upx 70upx;
      width: 100%;
      background: #ffffff;
      border-radius: 20upx;
      z-index: 1;
      .iconchenggong {
        font-size: 170upx;
        color: $mainColor1;
      }
      .result-title {
        margin: 20upx 0 50upx;
        font-size: 32upx;
      }
      .close_btn {
        line-height: 88upx;
        text-align: center;
        width: 550upx;
        height: 88upx;
        border: 1px solid #dddddd;
        border-radius: 8upx;
        font-size: 32upx;
        color: #666;
      }
    }
    .admin-button-com {
      margin-bottom: 20upx;
      width: 100%;
    }
  }
  </style>