ufutx_love_mp/src/pages/users/freeze.wpy

<template>
    <view class="wrapper font_28">
        <view class="m_fre f-fcc f-fdc">
            <image class="defaultIcon" src="https://image.fulllinkai.com/202108/27/20047ad98fe3054f2ab6f1ba71633493.png" mode="aspectFit" v-if="frozen_state == 1"></image>
            <image class="defaultIcon" src="https://image.fulllinkai.com/202108/30/4f5aaabe98d9132c6b3b41ff0cd92b98.png" mode="aspectFit" v-else></image>
            <view class="font_36 color-333 bold text-center" style="padding: 20rpx 0 60rpx;">{{frozen_state == 1?'解锁登录状态':'解锁已过期'}}</view>
            <view class="color-666 font_30" v-if="frozen_state == 1">
                <view>Hi！{{nickName}}，好久不见～</view>
                <view>你的账号目前为冻结状态，快来「立即解锁」</view>
                <view>你的登录状态吧！</view>
            </view>
            <view class="color-666 font_30" v-else>可以联系客服，帮助你解锁喔</view>
            <view class="openButton font_32 white" @tap="clickUnfrozen" v-if="frozen_state == 1">立即解锁</view>
            <view class="openButton font_32 white" @tap="clickPhone" v-else>联系客服</view>
        </view>
        <view class="cu-modal {{modalName=='freezeModal'?'show':''}}" catchtap="modalTipsCts">
            <view class="cu-dialog">
                <image class="u_moImg" src="https://image.fulllinkai.com/202108/27/2174fe572025a3cedd6f5aeee116162a.png" mode="aspectFit"></image>
                <view class="font_32 color-333" style="padding: 40rpx 0;">现在完善你的单身资料，立即帮你重新匹配的优质异性喔</view>
                <view class="m_bu font_32 f-fcc">
                    <view class="u_bu_ho color-999 f-fcc" @tap="goto('/pages/tabBar/home')">进入首页</view>
                    <view class="u_bu_la f-fcc white" @tap="goto('/pages/users/unmarriV2')">完善资料</view>
                </view>
                <!-- <view class="actions bg-img" @tap.stop="hideModal" style="background-image: url({{'https://images.ufutx.com/202103/15/1033c7b52cacddcebe999cefc6ad2c9b.png'}})"></view> -->
            </view>
        </view>
    </view>
</template>

<script>
    import wepy from '@wepy/core'
    import { service } from '../../config.js'
    import base from '../../mixins/base'
    import https from '../../mixins/https'

     wepy.page({
         mixins: [https, base],
        data: {
            modalName: '',
            user_id: '',
            frozen_state: 1,
            nickName: '',
            userInfo: ''
        },

        async onLoad(e) {
            this.user_id = wx.getStorageSync('user_id')
            wx.hideLoading()
            this.userInfo = wx.getStorageSync('userInfo')
            this.frozen_state = this.$app.$options.globalData.frozen_state
            console.log(this.userInfo, 'userInfo')
            if (this.userInfo) {
                this.nickName = this.userInfo.name
            }
        },

        onShow() {

        },

        onPullDownRefresh() {

        },

        onReachBottom() {

        },

        methods: {
            hideModal() {
                this.modalName = ''
            },
            clickUnfrozen() {
                this.unfrozen()
            },
            clickPhone() {
                wx.makePhoneCall({
                    phoneNumber: '18194063294'
                })
            },
            goto(url) {
                this.modalName = ''
                if (url == '/pages/tabBar/home') {
                    this.$gotoTab(url)
                }
                this.$redirectTo(url)
            },
            unfrozen() {
            let data = {

                }
                this.$put({url: `${service.host}/unfrozen/user/${this.user_id}`, data}).then(({code, data}) => {
                            if (code == 0) {
                                vm.modalName = 'freezeModal'
                            }
                })
                // that.$put({url: `${service.host}/unfrozen/user/${that.user_id}`}).then(({code, data}) => {
                //         if (code == 0) {
                //             that.modalName = 'freezeModal'
                //         }
                // })
            }
        }
    })

</script>

<style lang="less">

  page{
    background: white;
  }
  .wrapper {
    height: 100vh;
    .m_fre {
      position: relative;
      top: 50%;
      transform: translateY(-50%);
      padding-bottom: 200rpx;
      .defaultIcon{
        width: 224rpx;
        height: 236rpx;
      }
      .openButton{
        width: 480rpx;
        height: 80rpx;
        background-image: linear-gradient(to left,#FF85A5,#FF5380);
        border-radius: 100rpx;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 80rpx auto 0;
      }
    }
  }
  .cu-modal {
    .cu-dialog {
      width: 600rpx;
      // height: 500rpx;
      background: #ffffff;
      border-radius: 32rpx;
      position: relative;
      overflow: visible;
      padding: 50rpx;

    }
    .actions {
      position: absolute;
      bottom: -100rpx;
      left: 0;
      right: 0;
      margin: auto;
      width: 48rpx;
      height: 48rpx;
    }
    .u_moImg {
      width: 364rpx;
      height: 232rpx;
    }
    .m_bu {
      .u_bu_la,
      .u_bu_ho {
        width: 200rpx;
        height: 72rpx;
        border-radius: 100rpx;
      }
      .u_bu_ho {
        border: 2rpx solid #D8D8D8;
      }
      .u_bu_la {
        background: #FF5380;
        margin-left: 48rpx;
      }
    }
  }
</style>
<config>
    {
    navigationBarTitleText: '福恋系统',
    navigationStyle: 'custom',
    enablePullDownRefresh: false,
    backgroundColorTop: '#ffffff',
    backgroundColorBottom: '#ffffff',
    usingComponents: {
    }
    }
</config>