wxd / MShopWeApp

Commit 8c7e6d8bfaeab2495e299e1e45722dacb292b903

Authored by iceling
1 parent 155b069b

明细,更换手机，我的会员排版

Inline Side-by-side
Showing 12 changed files with 1244 additions and 0 deletions
pages/user/Change_phone/Change_phone.js 0 → 100644
  View file @8c7e6d8
  1 +
  2 +var a = getApp(),
  3 + r = a.globalData.setting,
  4 + t = a.request,
  5 + s = require("../../../utils/common.js"),
  6 + util = require("../../../utils/util.js");
  7 +Page({
  8 +
  9 + /**
  10 + * 页面的初始数据
  11 + */
  12 + data: {
  13 + iurl: r.imghost,
  14 + inputxphone:false,
  15 + phone:0,
  16 + },
  17 + /**
  18 + * 生命周期函数--监听页面加载
  19 + */
  20 + onLoad: function (options) {
  21 + this.setData({
  22 + phone: options.mobile
  23 + })
  24 + },
  25 + go: function (e) {
  26 + this.setData({
  27 + inputxphone: true
  28 + })
  29 + },
  30 + /**
  31 + * 生命周期函数--监听页面初次渲染完成
  32 + */
  33 + onReady: function () {
  34 +
  35 + },
  36 +
  37 + /**
  38 + * 生命周期函数--监听页面显示
  39 + */
  40 + onShow: function () {
  41 +
  42 + },
  43 +
  44 + /**
  45 + * 生命周期函数--监听页面隐藏
  46 + */
  47 + onHide: function () {
  48 +
  49 + },
  50 +
  51 + /**
  52 + * 生命周期函数--监听页面卸载
  53 + */
  54 + onUnload: function () {
  55 +
  56 + },
  57 +
  58 + /**
  59 + * 页面相关事件处理函数--监听用户下拉动作
  60 + */
  61 + onPullDownRefresh: function () {
  62 +
  63 + },
  64 +
  65 + /**
  66 + * 页面上拉触底事件的处理函数
  67 + */
  68 + onReachBottom: function () {
  69 +
  70 + },
  71 +
  72 + /**
  73 + * 用户点击右上角分享
  74 + */
  75 + onShareAppMessage: function () {
  76 +
  77 + }
  78 +})
0 79 \ No newline at end of file
... ...
pages/user/Change_phone/Change_phone.json 0 → 100644
  View file @8c7e6d8
  1 +{
  2 + "navigationBarTitleText": "更换手机",
  3 + "usingComponents": {}
  4 +}
0 5 \ No newline at end of file
... ...
pages/user/Change_phone/Change_phone.wxml 0 → 100644
  View file @8c7e6d8
  1 +<view class="container">
  2 + <!-- 手机logo -->
  3 + <view class="flex-center phone_logo">
  4 + <image src="{{iurl}}/miniapp/images/userinfo/phone_logo.png"></image>
  5 + </view>
  6 +
  7 + <view class="fs30">
  8 + <!-- 手机号码 -->
  9 + <view class="flex-vertical phone">
  10 + <image src="{{iurl}}/miniapp/images/userinfo/phone.png"></image>
  11 + <block wx:if="{{inputxphone==false}}">
  12 + <view class="inphone">{{phone}}</view>
  13 + </block>
  14 + <block wx:else>
  15 + <input class="inphone" placeholder="输入新手机号" type="number" maxlength="11"/>
  16 + </block>
  17 + </view>
  18 +
  19 + <!-- 发送手机验证码 -->
  20 + <view class="flex-vertical code">
  21 + <image src="{{iurl}}/miniapp/images/userinfo/code.png"></image>
  22 + <input placeholder="请输入验证码" type="number" maxlength="10" />
  23 + <view class="flex-center Obtain">
  24 + <view>获取验证码</view>
  25 + </view>
  26 + </view>
  27 + </view>
  28 +
  29 + <!-- 提示语 -->
  30 + <view class="Tips fs28">
  31 + <view>温馨提示:</view>
  32 + <view>1.更换手机号后下次可使用新手机号登录。
  33 + </view>
  34 + <view>2.为保障数据安全，如遇旧手机遗失可联系商家进行解绑。
  35 + </view>
  36 + <view>3.收到验证码而非本人操作时请及时更改密码。
  37 + </view>
  38 + </view>
  39 +
  40 + <view class="flex-center go fs32" bindtap="go">
  41 + <view class="flex-center lower">
  42 + <block wx:if="{{inputxphone==false}}">
  43 + <view>下一步</view>
  44 + </block>
  45 + <block wx:else>
  46 + <view>确定更换</view>
  47 + </block>
  48 + </view>
  49 + </view>
  50 +
  51 +
  52 +</view>
0 53 \ No newline at end of file
... ...
pages/user/Change_phone/Change_phone.wxss 0 → 100644
  View file @8c7e6d8
  1 +page {
  2 + height: 100%;
  3 +}
  4 +
  5 +.container {
  6 + padding: 0rpx 55rpx;
  7 + border-top: 6rpx solid rgb(245, 245, 245);
  8 +}
  9 +
  10 +.phone_logo {
  11 + height: 400rpx;
  12 +}
  13 +
  14 +.phone_logo image {
  15 + width: 145rpx;
  16 + height: 230rpx;
  17 +}
  18 +
  19 +.phone,.code{
  20 + border-bottom: 2rpx solid rgb(234, 234, 234);
  21 + height: 95rpx;
  22 +}
  23 +
  24 +.phone image {
  25 + width: 60rpx;
  26 + height: 60rpx;
  27 +}
  28 +
  29 +.phone .inphone {
  30 + margin-left: 50rpx;
  31 + color: rgb(153, 153, 153);
  32 +}
  33 +
  34 +.code image {
  35 + width: 70rpx;
  36 + height: 60rpx;
  37 +}
  38 +
  39 +.code input {
  40 + margin-left: 50rpx;
  41 + color: rgb(153, 153, 153);
  42 +}
  43 +
  44 +.code .Obtain {
  45 + width: 250rpx;
  46 + height: 60rpx;
  47 + border-left: 2rpx solid rgb(234, 234, 234);
  48 +}
  49 +
  50 +.phone, .code, .Tips {
  51 + padding-left: 30rpx;
  52 +}
  53 +
  54 +.Tips {
  55 + margin-top: 50rpx;
  56 + line-height: 50rpx;
  57 + color: rgb(153, 153, 153);
  58 +}
  59 +
  60 +.go {
  61 + width: 100%;
  62 + margin-top: 90rpx;
  63 +}
  64 +
  65 +.lower {
  66 + width: 430rpx;
  67 + height: 75rpx;
  68 + background-color: rgb(214, 1, 33);
  69 + border-radius: 40rpx;
  70 + color: rgb(255, 255, 255);
  71 +}
... ...
pages/user/Detailed/Detailed.js 0 → 100644
  View file @8c7e6d8
  1 +var e = function (e) {
  2 + return e && e.__esModule ? e : {
  3 + default: e
  4 + };
  5 +}(require("../../../utils/LoadMore.js")),
  6 + t = getApp(),
  7 + a = t.request,
  8 + o = t.globalData.setting,
  9 + os = o,
  10 + i = require("../../../utils/util.js"),
  11 + ut = i,
  12 + s = require("../../../utils/common.js"),
  13 + n = new e.default();
  14 +var regeneratorRuntime = require('../../../utils/runtime.js');
  15 +var api = require('../../../api/api.js');
  16 +Page({
  17 +
  18 + /**
  19 + * 页面的初始数据
  20 + */
  21 + data: {
  22 + url: o.imghost,
  23 + },
  24 +
  25 + /**
  26 + * 生命周期函数--监听页面加载
  27 + */
  28 + onLoad: function (options) {
  29 +
  30 + },
  31 +
  32 + /**
  33 + * 生命周期函数--监听页面初次渲染完成
  34 + */
  35 + onReady: function () {
  36 +
  37 + },
  38 +
  39 + /**
  40 + * 生命周期函数--监听页面显示
  41 + */
  42 + onShow: function () {
  43 +
  44 + },
  45 +
  46 + /**
  47 + * 生命周期函数--监听页面隐藏
  48 + */
  49 + onHide: function () {
  50 +
  51 + },
  52 +
  53 + /**
  54 + * 生命周期函数--监听页面卸载
  55 + */
  56 + onUnload: function () {
  57 +
  58 + },
  59 +
  60 + /**
  61 + * 页面相关事件处理函数--监听用户下拉动作
  62 + */
  63 + onPullDownRefresh: function () {
  64 +
  65 + },
  66 +
  67 + /**
  68 + * 页面上拉触底事件的处理函数
  69 + */
  70 + onReachBottom: function () {
  71 +
  72 + },
  73 +
  74 + /**
  75 + * 用户点击右上角分享
  76 + */
  77 + onShareAppMessage: function () {
  78 +
  79 + }
  80 +})
0 81 \ No newline at end of file
... ...
pages/user/Detailed/Detailed.json 0 → 100644
  View file @8c7e6d8
  1 +{
  2 + "navigationBarTitleText": "邀请明细",
  3 + "usingComponents": {}
  4 +}
0 5 \ No newline at end of file
... ...
pages/user/Detailed/Detailed.wxml 0 → 100644
  View file @8c7e6d8
  1 +<view>
  2 + <view class="flex-space-between fs28 title">
  3 + <view class="flex-vertical Nickname">
  4 + <view>会员昵称
  5 + </view>
  6 + </view>
  7 + <view class="flex-center phone">
  8 + <view>手机号码</view>
  9 + </view>
  10 + <view class="flex-center reward">
  11 + <view>奖励明细</view>
  12 + </view>
  13 + </view>
  14 +
  15 + <!-- 奖励详情 -->
  16 + <view class="flex-space-between fs28 maxvalue" wx:for="11111111">
  17 +
  18 + <view class="flex-vertical Nicknamevalue">
  19 + <view class="ellipsis-1">秋天的雨冬天的雪
  20 + </view>
  21 + </view>
  22 + <view class="flex-center phonevalue">
  23 + <view>15260677445
  24 + </view>
  25 + </view>
  26 + <view class="flex-center rewardvalue">
  27 + <view>+30
  28 + </view>
  29 + </view>
  30 + </view>
  31 +
  32 +</view>
  33 +
  34 +<!-- 没有明细 -->
  35 +<view class="empty_order">
  36 + <view class="flex-level">
  37 + <image src="{{url}}miniapp/images/order/empty_order.png"></image>
  38 + </view>
  39 + <view class="flex-level fs30 xc-ash">暂无邀请明细</view>
  40 + <view class="flex-level">
  41 + <navigator url="/pages/index/index/index" bindtap="goto">
  42 + <view class="flex-center fs28 white">去邀请</view>
  43 + </navigator>
  44 + </view>
  45 +</view>
0 46 \ No newline at end of file
... ...
pages/user/Detailed/Detailed.wxss 0 → 100644
  View file @8c7e6d8
  1 +.title {
  2 + background-color: rgb(238, 238, 238);
  3 + height: 65rpx;
  4 + color: rgb(153, 153, 153);
  5 +}
  6 +
  7 +.Nickname {
  8 + width: 200rpx;
  9 + padding-left: 50rpx;
  10 +}
  11 +
  12 +.reward {
  13 + width: 250rpx;
  14 +}
  15 +
  16 +.phone {
  17 + width: 250rpx;
  18 +}
  19 +
  20 +.maxvalue {
  21 + border-bottom: 1rpx solid rgb(242, 242, 242);
  22 +}
  23 +
  24 +.Nicknamevalue {
  25 + height: 85rpx;
  26 + width: 190rpx;
  27 + padding-left: 60rpx;
  28 +}
  29 +
  30 +.phonevalue {
  31 + width: 250rpx;
  32 +}
  33 +
  34 +.rewardvalue {
  35 + width: 250rpx;
  36 + color: rgb(215, 0, 38);
  37 +}
  38 +/*无明细*/
  39 +.empty_order image {
  40 + width: 329rpx;
  41 + height: 229rpx;
  42 + margin-top: 202rpx;
  43 +}
  44 +
  45 +.empty_order .xc-ash {
  46 + margin-top: 10rpx;
  47 + font-weight: 600px;
  48 +}
  49 +
  50 +.empty_order navigator {
  51 + margin-top: 60rpx;
  52 + border-radius: 40rpx;
  53 +}
  54 +
  55 +.empty_order navigator view {
  56 + width: 247rpx;
  57 + height: 56rpx;
  58 + background-color: rgb(255, 72, 72);
  59 + border-radius: 40rpx;
  60 +}
0 61 \ No newline at end of file
... ...
pages/user/plus/plus.js 0 → 100644
  View file @8c7e6d8
  1 +var e = function(e) {
  2 + return e && e.__esModule ? e : {
  3 + default: e
  4 + };
  5 + }(require("../../../utils/LoadMore.js")),
  6 + t = getApp(),
  7 + a = t.request,
  8 + o = t.globalData.setting,
  9 + os = o,
  10 + i = require("../../../utils/util.js"),
  11 + ut = i,
  12 + s = require("../../../utils/common.js"),
  13 + n = new e.default();
  14 +var regeneratorRuntime = require('../../../utils/runtime.js');
  15 +var api = require('../../../api/api.js');
  16 +Page({
  17 +
  18 + /**
  19 + * 页面的初始数据
  20 + */
  21 + data: {
  22 + images: [o.imghost + "/miniapp/images/plus/card_one.jpg", o.imghost + "/miniapp/images/plus/card_two.jpg", o.imghost + "/miniapp/images/plus/card_three.jpg"],
  23 + currentId: 0,
  24 + url: o.imghost,
  25 + j: false,
  26 + screenWidth: 0,
  27 + screenheight: 0,
  28 + canvasHidden: true,
  29 + shareImgPath: null,
  30 + plusCard: "",
  31 + imagePath: "",
  32 + isshare: 0,
  33 + },
  34 + swiperChange: function(e) {
  35 + var currentId = e.detail.current;
  36 + this.setData({
  37 + currentId: currentId
  38 + })
  39 +
  40 + },
  41 + /**
  42 + * 生命周期函数--监听页面加载
  43 + */
  44 + onLoad: function(options) {
  45 + var that = this;
  46 + //获取用户设备信息，屏幕宽度
  47 + wx.getSystemInfo({
  48 + success: res => {
  49 + that.setData({
  50 + screenWidth: res.screenWidth
  51 + })
  52 + }
  53 + })
  54 + this.getPlusCardType();
  55 +
  56 +
  57 + },
  58 + //获取卡类
  59 + getPlusCardType: function(e) {
  60 + var storid = o.stoid;
  61 + var th = this;
  62 + getApp().request.promiseGet("/api/weshop/plus/vip/mem/bership/list?" + "storeId=" + storid, {}).then(res => {
  63 + th.setData({
  64 + plusCard: res.data.data
  65 + })
  66 + })
  67 +
  68 + },
  69 + /**
  70 + * 生命周期函数--监听页面初次渲染完成
  71 + */
  72 + saveImageToPhotosAlbum: function() {
  73 + var th = this;
  74 + var unit = th.data.screenWidth / 750 * 1.35;
  75 + const ctx = wx.createCanvasContext('myCanvas');
  76 + //设置画板显示，才能开始绘图
  77 + th.setData({
  78 + canvasHidden: false
  79 + })
  80 + ctx.drawImage("../../../images/plus/share/mackground.png", 0, 0,554 * unit,899 * unit);
  81 + ctx.drawImage("../../../images/userinfo/user_head.jpg", 60 * unit, 20 * unit, 60 * unit, 60 * unit);
  82 + ctx.setFontSize(26 * unit);
  83 + ctx.setFillStyle("rgb(0,0,0)");
  84 + ctx.setTextAlign('left')
  85 + ctx.fillText("钱巧玲", 136 * unit, 65 * unit, 110 * unit);
  86 +
  87 + ctx.setFontSize(22 * unit);
  88 + ctx.setFillStyle("rgb(255,255,255)");
  89 + ctx.fillText("强烈推荐", 400 * unit, 60 * unit);
  90 +
  91 +
  92 + ctx.setStrokeStyle("rgb(255,255,255)");
  93 + ctx.setLineDash([5 * unit, 5 * unit], 5 * unit);
  94 + ctx.beginPath();
  95 + ctx.moveTo(0, 120 * unit);
  96 + ctx.lineTo(554 * unit, 120 * unit);
  97 + ctx.stroke();
  98 +
  99 + ctx.setStrokeStyle("rgb(218,194,169)");
  100 + ctx.beginPath();
  101 + ctx.moveTo(0, 420 * unit);
  102 + ctx.lineTo(554 * unit, 420 * unit);
  103 + ctx.stroke();
  104 +
  105 + // 卡图片
  106 + ctx.drawImage("../../../images/plus/share/one.jpg", 55 * unit, 170 * unit, 444 * unit, 205 * unit);
  107 + ctx.setFontSize(26 * unit);
  108 + ctx.setFillStyle("white");
  109 + ctx.fillText("PLUSI会员", 80 * unit, 215 * unit);
  110 + ctx.setFontSize(18 * unit);
  111 + ctx.setFillStyle("white");
  112 + ctx.fillText("开通会员年卡仅199元", 80 * unit, 240 * unit);
  113 +
  114 + ctx.setFontSize(18 * unit);
  115 + ctx.setFillStyle("white");
  116 + ctx.fillText("立即开通", 360 * unit, 215 * unit);
  117 +
  118 + ctx.drawImage("../../../images/userinfo/user_head.jpg", 80 * unit, 315 * unit, 40 * unit, 40 * unit);
  119 +
  120 + ctx.setFontSize(14 * unit);
  121 + ctx.setFillStyle("white");
  122 + ctx.fillText("根据大家购买数据，您成为超级会员预计可省￥2899元", 130 * unit, 345 * unit);
  123 +
  124 + ctx.setFontSize(22 * unit);
  125 + ctx.setFillStyle("rgb(198,165,126)");
  126 + ctx.fillText("超级VIP权益", 90 * unit, 475 * unit);
  127 +
  128 + ctx.setFontSize(20 * unit);
  129 + ctx.setFillStyle("rgb(198,165,126)");
  130 + ctx.fillText("超级会员专属权益", 90 * unit, 505 * unit);
  131 + ctx.drawImage("../../../images/plus/share/Ancrown.png", 395 * unit, 435 * unit, 80 * unit, 80 * unit);
  132 +
  133 + ctx.setFontSize(22 * unit);
  134 + ctx.setFillStyle("rgb(198,165,126)");
  135 + ctx.fillText("超级VIP标识", 90 * unit, 580 * unit);
  136 +
  137 + ctx.setFontSize(20 * unit);
  138 + ctx.setFillStyle("rgb(198,165,126)");
  139 + ctx.fillText("彰显尊贵身份的象征", 90 * unit, 610 * unit);
  140 + ctx.drawImage("../../../images/plus/share/Identification.png", 395 * unit, 545 * unit, 80 * unit, 80 * unit);
  141 +
  142 + ctx.setFontSize(22 * unit);
  143 + ctx.setFillStyle("rgb(198,165,126)");
  144 + ctx.fillText("超级VIP价格", 90 * unit, 695 * unit);
  145 +
  146 + ctx.setFontSize(20 * unit);
  147 + ctx.setFillStyle("rgb(198,165,126)");
  148 + ctx.fillText("享受专属会员超低价", 90 * unit, 725 * unit);
  149 + ctx.drawImage("../../../images/plus/share/money.png", 395 * unit, 660 * unit, 80 * unit, 80 * unit);
  150 +
  151 + ctx.drawImage("../../../images/userinfo/user_head.jpg", 100 * unit, 760 * unit, 100 * unit, 100 * unit);
  152 +
  153 + ctx.setFontSize(20 * unit);
  154 + ctx.setFillStyle("rgb(198,165,126)");
  155 + ctx.fillText("解锁新权益 精彩享不停", 220 * unit, 800 * unit);
  156 +
  157 + ctx.setFontSize(20 * unit);
  158 + ctx.setFillStyle("rgb(198,165,126)");
  159 + ctx.fillText("长按识别二维码,立即开通", 220 * unit, 840 * unit);
  160 +
  161 +
  162 + //绘制图片
  163 + ctx.draw(false, wx.canvasToTempFilePath({
  164 + x: 0,
  165 + y: 0,
  166 + width: 750,
  167 + height: 1217,
  168 + destWidth: 1.2 * 750 * 750 / th.data.screenWidth,
  169 + destHeight: 1.2 * 1217 * 750 / th.data.screenWidth,
  170 + canvasId: 'myCanvas',
  171 + success: function(res) {
  172 + var tempFilePath = res.tempFilePath;
  173 + th.setData({
  174 + imagePath: tempFilePath,
  175 + maskHidden: false,
  176 + canvasHidden: true,
  177 + isshare: 1
  178 + });
  179 + wx.previewImage({
  180 + urls: [tempFilePath],
  181 + })
  182 + }
  183 + }))
  184 +
  185 + },
  186 + /**
  187 + * 生命周期函数--监听页面显示
  188 + */
  189 + onShow: function() {
  190 + var goods_list = this.selectComponent("#goods_list"); //组件的id
  191 + goods_list.get_list();
  192 + },
  193 +
  194 + /**
  195 + * 生命周期函数--监听页面隐藏
  196 + */
  197 + onHide: function() {
  198 +
  199 + },
  200 +
  201 + /**
  202 + * 生命周期函数--监听页面卸载
  203 + */
  204 + onUnload: function() {
  205 +
  206 + },
  207 +
  208 + /**
  209 + * 页面相关事件处理函数--监听用户下拉动作
  210 + */
  211 + onPullDownRefresh: function() {
  212 +
  213 + },
  214 +
  215 + /**
  216 + * 页面上拉触底事件的处理函数
  217 + */
  218 + onReachBottom: function() {
  219 + var goods_list = this.selectComponent("#goods_list"); //组件的id
  220 + goods_list.get_list();
  221 + this.setData({
  222 + j: true
  223 + })
  224 + },
  225 +
  226 + /**
  227 + * 用户点击右上角分享
  228 + */
  229 + onShareAppMessage: function() {
  230 +
  231 + },
  232 + //开通会员
  233 + Opening: function() {
  234 + this.setData({
  235 + j: true
  236 + })
  237 + },
  238 + //返回会员页面
  239 + OpeningClose: function() {
  240 + this.setData({
  241 + j: false
  242 + })
  243 + }
  244 +
  245 +})
0 246 \ No newline at end of file
... ...
pages/user/plus/plus.json 0 → 100644
  View file @8c7e6d8
  1 +{
  2 + "usingComponents": {
  3 + "pop_txt": "/components/userqy_pop_up/userqy_pop_up",
  4 + "goods_recommend": "/components/goods_list/goods_list"
  5 + },
  6 + "navigationBarTitleText": "我的会员"
  7 +}
0 8 \ No newline at end of file
... ...
pages/user/plus/plus.wxml 0 → 100644
  View file @8c7e6d8
  1 +<!-- 我的会员背景图片 -->
  2 +<view>
  3 + <image class="Member_bk" src="{{url}}/miniapp/images/plus/page_bk.png"></image>
  4 +</view>
  5 +
  6 +<view class="plus">
  7 + <!-- 开通会员模块 -->
  8 + <view class="Opening_plus">
  9 + <view class="Opening_bk">
  10 + <image src="{{url}}/miniapp/images/plus/card_bk.png"></image>
  11 + </view>
  12 + <view class="swiper">
  13 + <block wx:if="{{j}}">
  14 + <!-- 未开通会员swiper-item -->
  15 + <swiper current="{{currentId}}" current-item-id="{{currentId}}" next-margin="55rpx" previous-margin="55rpx" bindchange="swiperChange">
  16 +
  17 + <swiper-item class="flex" item-id="{{index}}" data-item-id="{{index}}" wx:for="{{plusCard}}">
  18 + <view class="Membership {{currentId==index?'enlarge':''}}" style=" background-image: url({{item.CardImg}});color:{{item.CardColor}}">
  19 +
  20 + <view class="flex-space-between Membership_go">
  21 + <view>
  22 + <view class="fs32">{{item.CardName}}</view>
  23 + <view class="fs24 Membership_remarks">开通会员年卡仅199元</view>
  24 + </view>
  25 + <view class="Opening fs24 xc-black" bindtap="Opening">立即开通
  26 + </view>
  27 +
  28 + </view>
  29 +
  30 + <view class="flex-vertical-between consumption">
  31 +
  32 + <view class="flex-vertical fs22">
  33 + <image class="Member" src="{{url}}/miniapp/images/plus/privilege_o.png"></image>
  34 + <view>根据大家购买数据，您成为超级会员预计可省￥2899元
  35 + </view>
  36 + </view>
  37 + </view>
  38 + </view>
  39 + </swiper-item>
  40 + </swiper>
  41 + </block>
  42 + <block wx:else>
  43 + <!-- 已开通 -->
  44 +
  45 +
  46 +
  47 +
  48 + <view class="MemberPlus" style=" background-image: url({{url}}/miniapp/images/plus/card_one.jpg);">
  49 +
  50 + <view class="flex-space-between">
  51 + <view>
  52 + <view class="fs36" style="font-weight:bold">PLUSI会员</view>
  53 + <view class="fs22">开通会员年卡仅199元</view>
  54 + </view>
  55 + <view class="renew fs28">立即续费
  56 + </view>
  57 +
  58 + </view>
  59 +
  60 + <view class="flex-vertical-between xs fs24">
  61 +
  62 + <view class="flex">
  63 + <image class="privilege" src="{{url}}/miniapp/images/plus/privilege_o.png"></image>
  64 + <view>正在享受PLUSI会员特权
  65 + </view>
  66 + </view>
  67 + <view class="flex-vertical" bindtap="saveImageToPhotosAlbum">
  68 + <view>邀请新朋友</view>
  69 + <image class="share" src="{{url}}/miniapp/images/plus/Forward.png"></image>
  70 + </view>
  71 + </view>
  72 +
  73 + </view>
  74 +
  75 +
  76 + </block>
  77 + <view wx:if="{{j==false}}" class="flex-vertical-between Invitation fs30">
  78 +
  79 + <view class="flex">
  80 + 已邀请
  81 + <view class="Invitation_count">3人</view>
  82 + 可提现
  83 + <view class="Invitation_my">66元</view>
  84 + </view>
  85 +
  86 + <view class="flex">
  87 + <view class="Detailed flex-center">
  88 + <navigator url="/pages/user/Detailed/Detailed">明细</navigator>
  89 + </view>
  90 + <view class="Invitation_Cash">立即提现</view>
  91 +
  92 + </view>
  93 +
  94 + </view>
  95 +
  96 + </view>
  97 +
  98 +
  99 + </view>
  100 +
  101 + <!-- 会员礼遇 -->
  102 + <view class="Courtesy">
  103 +
  104 + <!-- 标题 -->
  105 + <view class="flex-center" style="width:100%;height:200rpx;">
  106 + <view>
  107 + <view wx:if="{{false}}" class="Courtesy_title flex-center fs36">开通PLUSI会员尊享礼遇
  108 + </view>
  109 + <view wx:else class="Courtesy_title flex-center fs36">PLUSI会员尊享礼遇 </view>
  110 +
  111 +
  112 + <view class="flex-center">
  113 + <image class="Courtesy_image" src="{{url}}/miniapp/images/plus/Courtesy.png"></image>
  114 +
  115 + <view wx:if="{{false}}" class="Courtesy_can fs24">PLUSI会员可享以下特权
  116 + </view>
  117 + <view wx:else class="Courtesy_can fs24">解锁新权益 精彩享不停
  118 + </view>
  119 +
  120 + <image class="Courtesy_image" src="{{url}}/miniapp/images/plus/Courtesy.png"></image>
  121 + </view>
  122 + </view>
  123 + </view>
  124 +
  125 + <!-- 会员权益内容 -->
  126 + <view class="Courtesy_comment fs24">
  127 +
  128 + <view class="flex">
  129 + <view>1、</view>
  130 + <view>可以领取880元黑卡专享礼包</view>
  131 + </view>
  132 + <view class="flex-center">
  133 + <image class="t-c Equity_image" src="../../../images/plus/purchase_Bk.png"></image>
  134 + </view>
  135 + <view class="flex">
  136 + <view>2、</view>
  137 + <view>可以领取880元黑卡专享礼包</view>
  138 + </view>
  139 +
  140 + <view class="flex">
  141 + <view>3、</view>
  142 + <view>可以领取880元黑卡专享礼包</view>
  143 + </view>
  144 + </view>
  145 + </view>
  146 +
  147 + <!-- 好物推荐 -->
  148 + <!-- 好物推荐 -->
  149 + <view class="title">
  150 + <!-- 标题 -->
  151 + <view>
  152 + <!-- 中文名标题 -->
  153 + <view class="China flex-level">
  154 + <view class="line flex-vertical">
  155 + <view class="one"></view>
  156 + <view class="two"></view>
  157 + <view class="three"></view>
  158 + </view>
  159 +
  160 + <view class="Recommend flex-level" bindtap="requestList">好物推荐</view>
  161 +
  162 + <view class="line flex-vertical">
  163 + <view class="three"></view>
  164 + <view class="two"></view>
  165 + <view class="one"></view>
  166 + </view>
  167 + </view>
  168 +
  169 + <!-- 英文标题 -->
  170 + <view class="english flex-center">
  171 + <view class="silk"></view>
  172 + <view class="esh five-level-word">GOOD HOT THING</view>
  173 + <view class="silk"></view>
  174 + </view>
  175 +
  176 + </view>
  177 + <!-- 商品列表组件 -->
  178 + <goods_recommend id="goods_list"></goods_recommend>
  179 + <!-- 商品列表 -->
  180 +
  181 + </view>
  182 +
  183 +</view>
  184 +
  185 +<!-- 开通会员弹窗 -->
  186 +<view wx:if="{{false}}" class="Disgraceful flex-center">
  187 + <!-- 蒙尘 -->
  188 + <view bindtap="OpeningClose"></view>
  189 +
  190 + <!-- 弹框 -->
  191 + <view class="Member_purchase">
  192 + <view class="rel purchase_Bk" style="background-image: url({{url}}/miniapp/images/plus/card_one.jpg);">
  193 + <image class="abs write" src="../../../images/plus/write.png"></image>
  194 + </view>
  195 + <view class="fs26 inf_com">
  196 + <view class="fs36 flex-level perfect">请完善下面信息</view>
  197 + <view class="fillin">
  198 + <!-- 输入推荐人手机号 -->
  199 + <view class="flex ai_and Enter_phone">
  200 + <image class="phone_image" src="../../../images/plus/Invitation_code.png" ></image>
  201 + <view class="phone">
  202 + <input placeholder="请输入邀请码(推荐人手机号)" type="number" maxlength="30"/>
  203 + </view>
  204 + </view>
  205 +
  206 + <!-- 输入营业员 -->
  207 + <view class="flex ai_and enter_SalesClerk">
  208 + <image class="SalesClerk_image" src="../../../images/plus/Sales_Clerk.png" ></image>
  209 + <view class="SalesClerk">
  210 + <input placeholder="请输入营业员" maxlength="30"/>
  211 + </view>
  212 + </view>
  213 + <!-- 确认购买 -->
  214 + <view class="flex-center">
  215 + <view class="flex-center purchase" style="background-image:url({{url}}/miniapp/images/plus/card_one.jpg);">
  216 + 确认购买
  217 + </view>
  218 + </view>
  219 + </view>
  220 + </view>
  221 + <view class="flex-level">
  222 + <image class="purchaseClose" bindtap="OpeningClose" src="../../../images/plus/Close.png"></image>
  223 + </view>
  224 + </view>
  225 +
  226 +</view>
  227 +
  228 +<!-- 画布 -->
  229 +
  230 +<canvas canvas-id='myCanvas' style="width:750rpx;height:1217rpx;"></canvas>
  231 +<!-- 分享图片
  232 +<view class="mc" wx:if="{{false}}" bindtap="isshare">
  233 +<!-- 蒙尘 -->
  234 + <!-- <image src="{{imagePath}}" style="width:400rpx;height:400rpx;"></image>
  235 +</view> -->
  236 +<warn id="warn"></warn>
0 237 \ No newline at end of file
... ...
pages/user/plus/plus.wxss 0 → 100644
  View file @8c7e6d8
  1 +page {
  2 + width: 100%;
  3 + height: 100%;
  4 + z-index: 3;
  5 + overflow-x: hidden;
  6 +}
  7 +.plus{
  8 + overflow-x: hidden;
  9 +}
  10 +.Member_bk {
  11 + position: absolute;
  12 + z-index: 0;
  13 + width: 100%;
  14 + height: 100%;
  15 +}
  16 +
  17 +.Opening_bk image {
  18 + position: absolute;
  19 + z-index: 2;
  20 + width: 100%;
  21 + height: 320rpx;
  22 +}
  23 +
  24 +.swiper {
  25 + width: 100%;
  26 + padding-top: 60rpx;
  27 +}
  28 +
  29 +swiper {
  30 + align-items: center;
  31 + display: flex;
  32 + justify-content: center;
  33 + height: 275rpx;
  34 +}
  35 +
  36 +.swiper image {
  37 + width: 490rpx;
  38 + height: 100%;
  39 + border-radius: 20rpx;
  40 +}
  41 +
  42 +.swiper, .Courtesy, .title {
  43 + position: relative;
  44 + z-index: 3;
  45 +}
  46 +
  47 +.Courtesy_image {
  48 + width: 50rpx;
  49 + height: 25rpx;
  50 + margin-top: 8rpx;
  51 +}
  52 +
  53 +.Courtesy_title {
  54 + color: rgb(173, 137, 79);
  55 + font-weight: bold;
  56 + margin-bottom: 10rpx;
  57 + letter-spacing: 2rpx;
  58 +}
  59 +
  60 +.Courtesy_can {
  61 + margin: 0rpx 7rpx;
  62 + color: rgb(94, 93, 91);
  63 + font-weight: bold;
  64 +}
  65 +
  66 +.Courtesy_comment {
  67 + padding: 0rpx 31rpx;
  68 +}
  69 +
  70 +.Equity_image {
  71 + width: 490rpx;
  72 + height: 175rpx;
  73 + margin: 20rpx 0rpx;
  74 +}
  75 +
  76 +/* 热门好物 */
  77 +
  78 +.title .China {
  79 + width: 100%;
  80 + margin-top: 60rpx;
  81 + margin-bottom: 10rpx;
  82 + line-height: 0rpx;
  83 +}
  84 +
  85 +.title .China .line view {
  86 + width: 2rpx;
  87 +}
  88 +
  89 +.title .China .line {
  90 + height: 40rpx;
  91 + color: rgb(51, 51, 51);
  92 +}
  93 +
  94 +.title .China .line view {
  95 + border-left: 3rpx solid #000;
  96 + margin-left: 5rpx;
  97 +}
  98 +
  99 +.title .China .line .one {
  100 + height: 23rpx;
  101 +}
  102 +
  103 +.title .China .line .two {
  104 + height: 15rpx;
  105 +}
  106 +
  107 +.title .China .line .three {
  108 + height: 18rpx;
  109 +}
  110 +
  111 +.title .China .Recommend {
  112 + margin: 0rpx 20rpx;
  113 + font-size: 28rpx;
  114 + line-height: 39rpx;
  115 + font-weight: bold;
  116 +}
  117 +
  118 +.title .english .silk {
  119 + width: 214rpx;
  120 + height: 2rpx;
  121 + background-color: #000;
  122 +}
  123 +
  124 +.title .english .esh {
  125 + margin: 0rpx 15rpx;
  126 +}
  127 +
  128 +.Membership {
  129 + width: 575rpx;
  130 + height: 275rpx;
  131 + margin: 0 auto;
  132 + transform: scale(0.9);
  133 + border-radius: 18rpx;
  134 + box-shadow: 0rpx 0rpx 2rpx #888;
  135 + background-size: 100%;
  136 + padding: 0rpx 31rpx;
  137 + color: #ffa786;
  138 +}
  139 +
  140 +.enlarge {
  141 + transform: scale(1);
  142 +}
  143 +
  144 +.Membership_go {
  145 + margin-top: 50rpx;
  146 +}
  147 +
  148 +.Membership_Opening {
  149 + width: 150rpx;
  150 + height: 40rpx;
  151 + border-radius: 30rpx;
  152 + text-align: center;
  153 + line-height: 40rpx;
  154 + background-color: rgb(255, 167, 135);
  155 + color: #000;
  156 +}
  157 +
  158 +.Membership .Member {
  159 + width: 30rpx;
  160 + height: 30rpx;
  161 + margin-right: 5rpx;
  162 +}
  163 +
  164 +.Membership .Opening {
  165 + width: 160rpx;
  166 + height: 45rpx;
  167 + border-radius: 20rpx;
  168 + background-color: rgb(237, 189, 150);
  169 + line-height: 45rpx;
  170 + text-align: center;
  171 + margin-top: 2rpx;
  172 +}
  173 +
  174 +.Invitation {
  175 + padding: 0rpx 31rpx;
  176 + box-shadow: 0rpx 0rpx 10rpx #888;
  177 + height: 95rpx;
  178 + background-color: rgb(255, 255, 255);
  179 + z-index: 6;
  180 + position: relative;
  181 + margin-top: -15rpx;
  182 +}
  183 +
  184 +.Invitation .Invitation_count, .Invitation_my {
  185 + color: rgb(237, 189, 153);
  186 +}
  187 +
  188 +.Invitation .Invitation_Cash {
  189 + width: 150rpx;
  190 + height: 45rpx;
  191 + line-height: 45rpx;
  192 + text-align: center;
  193 + border-radius: 25rpx;
  194 + margin-left: 30rpx;
  195 + background-color: rgb(237, 189, 150);
  196 + color: rgb(255, 255, 255);
  197 +}
  198 +
  199 +.Invitation .Detailed {
  200 + color: rgb(237, 189, 150);
  201 + text-decoration:underline;
  202 +}
  203 +
  204 +.consumption {
  205 + margin-top: 95rpx;
  206 + font-size: 18rpx;
  207 +}
  208 +
  209 +.Membership_remarks {
  210 + margin-top: 2rpx;
  211 +}
  212 +
  213 +.MemberPlus {
  214 + width: 618rpx;
  215 + height: 290rpx;
  216 + border-radius: 18rpx;
  217 + box-shadow: 0rpx 0rpx 10rpx #888;
  218 + margin: 0rpx 35rpx;
  219 + color: #ffa786;
  220 + padding: 0rpx 31rpx;
  221 + padding-top: 60rpx;
  222 + background-size: 100%;
  223 +}
  224 +
  225 +.Member_sp {
  226 + height: 325rpx;
  227 +}
  228 +
  229 +.renew {
  230 + width: 190rpx;
  231 + height: 50rpx;
  232 + border-radius: 18rpx;
  233 + background-color: rgb(237, 189, 150);
  234 + text-align: center;
  235 + line-height: 50rpx;
  236 + color: #000;
  237 + margin-top: 7rpx;
  238 +}
  239 +
  240 +.xs {
  241 + margin-top: 130rpx;
  242 +}
  243 +
  244 +.MemberPlus .share {
  245 + width: 30rpx;
  246 + height: 30rpx;
  247 + margin-left: 7rpx;
  248 +}
  249 +
  250 +.MemberPlus .privilege {
  251 + width: 30rpx;
  252 + height: 30rpx;
  253 + margin-right: 7rpx;
  254 +}
  255 +
  256 +.Disgraceful {
  257 + position: fixed;
  258 + left: 0;
  259 + top: 0;
  260 + right: 0;
  261 + bottom: 0;
  262 + z-index: 11;
  263 + background: rgba(0, 0, 0, 0.4);
  264 + width: 100%;
  265 + height: 100%;
  266 +}
  267 +
  268 +.ddd {
  269 + border-radius: 20rpx;
  270 +}
  271 +
  272 +.Member_purchase {
  273 + width: 610rpx;
  274 + margin-top: 20rpx;
  275 +}
  276 +
  277 +.purchase_Bk {
  278 + width: 100%;
  279 + height: 225rpx;
  280 + background-size: 100%;
  281 +}
  282 +
  283 +.write {
  284 + width: 280rpx;
  285 + height: 275rpx;
  286 + bottom: 20rpx;
  287 + left: 185rpx;
  288 +}
  289 +
  290 +.inf_com {
  291 + background-color: rgb(255, 255, 255);
  292 + padding: 0rpx 85rpx;
  293 +}
  294 +
  295 +.perfect {
  296 + padding-top: 30rpx;
  297 + padding-bottom: 65rpx;
  298 +}
  299 +
  300 +.fillin {
  301 + color: rgb(208, 208, 208);
  302 +}
  303 +
  304 +.Enter_phone {
  305 + border-bottom: 1rpx solid rgb(153, 153, 153);
  306 + margin-bottom: 35rpx;
  307 +}
  308 +
  309 +.phone_image {
  310 + width: 60rpx;
  311 + height: 60rpx;
  312 + margin-bottom: 5rpx;
  313 +}
  314 +
  315 +.phone {
  316 + margin-left: 15rpx;
  317 + color: #000;
  318 +}
  319 +
  320 +.enter_SalesClerk {
  321 + border-bottom: 1rpx solid rgb(153, 153, 153);
  322 +}
  323 +
  324 +.SalesClerk_image {
  325 + width: 60rpx;
  326 + height: 60rpx;
  327 + margin-bottom: 5rpx;
  328 +}
  329 +
  330 +.SalesClerk {
  331 + margin-left: 15rpx;
  332 + color: #000;
  333 +}
  334 +
  335 +.purchase {
  336 + width: 250rpx;
  337 + height: 50rpx;
  338 + border-radius: 25rpx;
  339 + color: rgb(255, 255, 255);
  340 + margin: 55rpx 0rpx;
  341 +}
  342 +
  343 +.purchaseClose {
  344 + width: 70rpx;
  345 + height: 70rpx;
  346 + border-radius: 50%;
  347 + margin-top: 60rpx;
  348 +}
  349 +
  350 +input {
  351 + overflow: visible;
  352 + width: 360rpx;
  353 +}
  354 +.mc{
  355 + position: fixed;
  356 + width: 100%;
  357 + height: 100%;
  358 + z-index: 7;
  359 + top: 0rpx;
  360 + left: 0rpx;
  361 + background-color: rgba(0,0,0,0.4);
  362 +}
0 363 \ No newline at end of file
... ...