Merge branch 'dev' of 47.94.45.65:angelo/web-zk-h5 into test

components/share/DefaultSharePage.vue

@@ -1,57 +1,42 @@
 <template>
   <view class="default-share-page">
     <!-- 背景图片，替代CSS background -->
-    <image
+    <img
       class="share-bg-image"
-      src="/static/images/share-bg.jpg"
-      mode="scaleToFill"
+      src="@/static/images/share-bg.jpg"
       crossorigin="anonymous"
       @load="onBackgroundImageLoad"
       @error="onBackgroundImageError"
-    ></image>
-
-    <view class="share-wrapper">
-      <view class="portal-frame" :class="{ 'is-loaded': isLoaded }">
-        <!-- 二维码样式区域 - 用户自定义样式位置 -->
-        <view class="qr-code-outer">
-          <image
-            class="qr-code"
-            :src="qrCodeImage"
-            mode="aspectFit"
-            v-if="qrCodeImage"
-          ></image>
-          <view v-else class="qr-code-placeholder">
-            <view class="loader"></view>
-          </view>
-        </view>
-
-        <!-- 会员编号样式区域 - 用户自定义样式位置 -->
-        <text
-          class="member-code-text"
-          style="
-            font-size: 30rpx;
-            color: #fff;
-            font-weight: bold;
-            margin-top: 20rpx;
-          "
-          >{{ desensitization(userInfo.memberCode) }}</text
-        >
-
-        <!-- 下载按钮 - 仅在非微信环境显示 -->
-        <button
-          v-if="!isWechat && shareButtonShow"
-          class="share-button"
-          @click="sharePage"
-        >
-          保存图片并分享
-        </button>
+    />
+    <view class="qr-code-outer">
+      <image
+        class="qr-code"
+        :src="qrCodeImage"
+        mode="aspectFit"
+        v-if="qrCodeImage"
+      ></image>
+      <view v-else class="qr-code-placeholder">
+        <view class="loader"></view>
       </view>
     </view>
+    <view class="member-code-outer">
+      <text
+        class="member-code-text"
+        style="
+          font-size: 20rpx;
+          color: #fff;
+          font-weight: bold;
+          margin-top: 20rpx;
+        "
+        >{{ desensitization(userInfo.memberCode) }}</text
+      >
+    </view>
   </view>
 </template>
 
 <script>
 import html2canvas from 'html2canvas'
+import { snapdom } from '@zumer/snapdom'
 
 export default {
   name: 'DefaultSharePage',
@@ -108,7 +93,7 @@ export default {
         return
       }
 
-      uni.showLoading({ title: '加载中...', mask: true })
+      uni.showLoading({ title: '加载中...' })
 
       try {
         this.shareButtonShow = false
@@ -145,30 +130,23 @@ export default {
               return
             }
 
-            console.log(
-              '开始html2canvas截取，容器尺寸:',
-              element.offsetWidth,
-              'x',
-              element.offsetHeight
-            )
-
+            const scale = 3
             html2canvas(element, {
               useCORS: true,
-              allowTaint: true,
+              // allowTaint: true,
               backgroundColor: null,
-              scale: 2,
-              dpi: 400,
-              logging: true,
+              scale,
+              // canvas,
               width: element.offsetWidth,
               height: element.offsetHeight,
-              windowWidth: element.offsetWidth,
-              windowHeight: element.offsetHeight,
-              scrollX: 0,
-              scrollY: 0,
-              x: 0,
-              y: 0,
             })
               .then(canvas => {
+                const context = canvas.getContext('2d')
+                // context.scale(2, 2)
+                context.mozImageSmoothingEnabled = false
+                context.webkitImageSmoothingEnabled = false
+                context.msImageSmoothingEnabled = false
+                context.imageSmoothingEnabled = false
                 const dataUrl = canvas.toDataURL('image/jpeg', 1)
                 this.$emit('share-generated', dataUrl)
                 resolve()
@@ -191,8 +169,9 @@ export default {
 <style lang="scss" scoped>
 .default-share-page {
   position: relative;
-  width: 100%;
-  height: 100%;
+  width: 600rpx;
+  height: 1296rpx;
+  // height: 100%;
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -203,8 +182,9 @@ export default {
   position: absolute;
   top: 0;
   left: 0;
-  width: 100%;
-  height: 100%;
+  width: 600rpx;
+  height: 1296rpx;
+  // height: 100%;
   z-index: 1;
 }
 
@@ -238,8 +218,8 @@ export default {
 
 /* 二维码样式区域 - 用户自定义样式位置 */
 .qr-code-outer {
-  width: 400rpx;
-  height: 400rpx;
+  width: 140rpx;
+  height: 140rpx;
   background: rgba(255, 255, 255, 0.98);
   border-radius: 20rpx;
   box-shadow: 0px 8rpx 20rpx rgba(50, 50, 90, 0.06);
@@ -249,6 +229,13 @@ export default {
   justify-content: center;
   padding: 12rpx;
   box-sizing: border-box;
+  position: absolute;
+  // bottom: 460rpx;
+  left: 374rpx;
+  top: 708rpx;
+  // right: 130rpx;
+
+  z-index: 10;
 }
 
 .qr-code,
@@ -286,6 +273,16 @@ export default {
 .member-code-text {
   /* 用户可以在这里自定义会员编号的样式 */
 }
+.member-code-outer {
+  position: absolute;
+  top: 1086rpx;
+  left: 246rpx;
+  // width: 300rpx;
+  text-align: center;
+  // background: rgb(217, 24, 25);
+  border-radius: 20rpx;
+  z-index: 10;
+}
 
 /* 下载按钮样式 */
 .share-button {

components/withdrawalGuide/index.vue

@@ -14,48 +14,56 @@
       <view class="guide-text">
         <text>尊敬的经销商伙伴们：</text>
         <text
-          >为了让大家顺利快捷地提现，符合法律法规的要求，现需完成提现绑定操作，步骤如下，按序操作即可：</text
+          >为保障大家能够顺利、快捷地进行提现操作，同时积极响应并符合十一后国家法律法规的最新要求，现需各位经销商伙伴完成提现绑定操作。以下是详细的操作步骤，请大家按照顺序依次进行：</text
         >
       </view>
       <view class="guide-steps">
         <view class="step-item">
           <text class="step-number">1.</text>
           <text class="step-text"
-            >微信扫码后，用实际收款人本人手机号登录；</text
+            >扫码进入签约页面：使用微信扫描指定二维码，进入相关操作界面后，点击“去签约”。</text
           >
         </view>
         <view class="step-item">
           <text class="step-number">2.</text>
           <text class="step-text"
-            >点击 "继续签约"，上传本人身份证照片完成实名认证；</text
+            >在线签约：在跳转的页面中，找到并点击“在线签约”选项。同意隐私政策：仔细阅读隐私政策申明，确认无误后，点击“同意并继续”。</text
           >
         </view>
         <view class="step-item">
           <text class="step-number">3.</text>
           <text class="step-text"
-            >进入合同页面，选择 "默认印章"，输入收到的验证码完成签约；</text
+            >绑定手机号码：输入绑卡人的手机号码，获取验证码，将收到的验证码准确输入后，点击“下一步”。</text
           >
         </view>
         <view class="step-item">
           <text class="step-number">4.</text>
           <text class="step-text"
-            >返回首页点击 "提现"（若显示 "开户"，下拉刷新页面即可）；</text
+            >上传身份证照片：可选择现场拍摄身份证正反面照片，或从手机相册中选取已保存的身份证正反面照片进行上传，上传完成后点击“下一步”。</text
           >
         </view>
         <view class="step-item">
           <text class="step-number">5.</text>
           <text class="step-text"
-            >进入绑卡页面，完成银行卡绑定后即可操作提现。</text
+            >输入银行卡号：准确输入银行卡号，系统将提示“签约成功”，随后自动跳转到协议页面。</text
+          >
+        </view>
+        <view class="step-item">
+          <text class="step-number">6.</text>
+          <text class="step-text"
+            >完成手写签名：在协议页面的最下方，进行手写签名操作，签名完成后即完成整个签约流程。</text
           >
         </view>
       </view>
       <view class="guide-footer">
-        <text>请大家尽快办理，有疑问可随时联系我们，感谢配合！</text>
+        <text
+          >请大家务必尽快办理提现绑定操作，以免影响后续的提现业务。若在操作过程中遇到任何疑问或困难，可随时与我们联系，我们将竭诚为大家提供帮助。感谢大家的理解与配合！</text
+        >
       </view>
       <view class="qr-code-section">
         <image
           class="qr-code-image"
-          src="https://bd-qd.oss-cn-beijing.aliyuncs.com/online_tmp/appletCode.png"
+          src="@/static/images/qr-code.png"
           mode="aspectFit"
         />
       </view>
@@ -82,8 +90,9 @@ export default {
 
 <style lang="scss" scoped>
 .withdrawal-guide-content {
-  padding: 0rpx 32rpx 32rpx;
-
+  padding: 0rpx 20rpx 20rpx;
+  height: 80vh;
+  overflow-y: auto;
   .guide-title {
     font-size: 32rpx;
     font-weight: bold;

pages/mine/balance/withdrawal.vue

@@ -145,10 +145,10 @@
       请先绑定默认银行卡
     </u-modal>
     <!-- 提现引导弹窗 -->
-    <!-- <WithdrawalGuide
+    <WithdrawalGuide
       :show="showWithdrawalGuide"
       @confirm="onWithdrawalGuideConfirm"
-    /> -->
+    />
   </view>
 </template>
 
@@ -261,20 +261,23 @@ export default {
       this.$refs.uForm
         .validate()
         .then(res => {
+          if (!this.dataForm.pkBank) {
+            return
+          }
           bal.addWithdraw(this.dataForm).then(res => {
             if (res.code == 200) {
               this.$refs.uToast.show({
                 message: res.msg || '提现成功',
                 type: 'success',
               })
-              setTimeout(() => {
-                uni.navigateBack()
-              }, 500)
+              // setTimeout(() => {
+              //   uni.navigateBack()
+              // }, 500)
 
               // 显示提现引导弹窗
-              // setTimeout(() => {
-              //   this.showWithdrawalGuide = true
-              // }, 300)
+              setTimeout(() => {
+                this.showWithdrawalGuide = true
+              }, 300)
             }
           })
         })
@@ -292,9 +295,6 @@ export default {
       if (!this.dataForm.cashAmount) {
         uni.$u.toast('请先输入金额')
         return
-      } else if (!this.dataForm.pkAccount) {
-        uni.$u.toast('请先选择账户')
-        return
       }
       bal
         .getWidthdrawShow({

pages/mine/share/index.vue

@@ -28,10 +28,7 @@
       />
 
       <!-- 微信环境全屏图片显示 -->
-      <view
-        class="wechat-fullscreen-overlay"
-        v-show="(isWechat || userInfo.sharePosterImage) && generatedImageUrl"
-      >
+      <view class="wechat-fullscreen-overlay" v-show="generatedImageUrl">
         <img
           class="fullscreen-image"
           :src="generatedImageUrl"
@@ -41,6 +38,7 @@
         />
       </view>
     </view>
+    <view v-show="!generatedImageUrl" class="mask-loading"></view>
     <cl-tabbar class="tabbar" :current="2" />
   </view>
 </template>
@@ -154,16 +152,7 @@ export default {
       })
       uni.hideLoading()
 
-      if (this.isWechat) {
-        // 微信环境：设置图片供长按保存
-        this.generatedImageUrl = dataUrl
-      } else {
-        // 普通浏览器环境
-        if (this.isSpecialScene) {
-          // 特殊场景：设置图片供长按保存（没有下载按钮）
-          this.generatedImageUrl = dataUrl
-        }
-      }
+      this.generatedImageUrl = dataUrl
     },
 
     // 下载图片
@@ -211,7 +200,6 @@ export default {
 .fullscreen-image {
   width: 100vw;
   height: 100%;
-  object-fit: cover;
   margin: 0;
   padding: 0;
   border: none;
@@ -240,4 +228,13 @@ export default {
     height: 80px !important;
   }
 }
+.mask-loading {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100vw;
+  height: 100vh;
+  z-index: 1000;
+  background-color: #fff;
+}
 </style>

pages/shareArea/hiList.vue

@@ -89,16 +89,16 @@ export default {
       pkParent: '',
       goodList: [],
       placeParent: '',
-      activeTab: 41, // 默认选中精品专区
+      activeTab: 43, // 默认选中商城专区
       tabs: [
-        {
-          label: '精品专区',
-          value: 41,
-        },
         {
           label: '商城专区',
           value: 43,
         },
+        {
+          label: '精品专区',
+          value: 41,
+        },
       ],
     }
   },
@@ -176,54 +176,81 @@ export default {
   flex-direction: column;
 }
 
-// Tab选项卡样式
+// Tab选项卡样式 - 简约大气设计
 .tab-container {
-  background: #ffffff;
-  padding: 20rpx 24rpx 0;
+  // background: #ffffff;
+  padding: 0;
   position: relative;
   z-index: 4;
 
+  // 顶部装饰线
+  &::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    height: 3rpx;
+    background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
+  }
+
   .tab-wrapper {
     display: flex;
-    justify-content: center;
     position: relative;
+    // background: #ffffff;
+    // padding: 32rpx 24rpx 24rpx;
 
     .tab-item {
-      flex: none;
+      flex: 1;
       position: relative;
       cursor: pointer;
-      margin: 0 32rpx;
-      padding: 16rpx 0;
+      padding: 24rpx 32rpx;
+      text-align: center;
+      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
 
       .tab-text {
-        font-size: 30rpx;
+        font-size: 32rpx;
         font-weight: 500;
-        color: #9ca3af;
+        color: #64748b;
         transition: all 0.3s ease;
+        position: relative;
+        z-index: 2;
       }
 
       .tab-line {
-        position: absolute;
-        bottom: 0;
-        left: 0;
-        right: 0;
-        height: 3rpx;
-        background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
-        border-radius: 2rpx;
-        animation: slideIn 0.3s ease;
+        display: none;
+      }
+
+      // 悬停效果
+      &:hover:not(.tab-active) {
+        .tab-text {
+          color: #475569;
+          transform: translateY(-1rpx);
+        }
       }
 
       &.tab-active {
+        background: rgba(102, 126, 234, 0.08);
+
         .tab-text {
-          color: #1f2937;
+          color: #667eea;
           font-weight: 600;
         }
+
+        // 选中指示器 - 底部完整宽度线条
+        &::after {
+          content: '';
+          position: absolute;
+          bottom: 0;
+          left: 0;
+          right: 0;
+          height: 3rpx;
+          background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
+        }
       }
 
       &:active {
-        .tab-text {
-          transform: scale(0.95);
-        }
+        transform: scale(0.98);
       }
     }
   }
@@ -607,84 +634,4 @@ export default {
 .goodList_i:nth-child(n + 6) {
   animation-delay: 0.6s;
 }
-
-// 响应式优化
-@media (max-width: 750rpx) {
-  .tab-container {
-    padding: 24rpx 16rpx 0;
-
-    .tab-wrapper {
-      .tab-item {
-        margin: 0 24rpx;
-        padding: 12rpx 0;
-
-        .tab-text {
-          font-size: 28rpx;
-        }
-      }
-    }
-  }
-
-  .goodList {
-    .goodList_i {
-      padding: 24rpx;
-
-      .cover {
-        width: 200rpx;
-        height: 200rpx;
-      }
-
-      .goodList_ir {
-        margin-left: 20rpx;
-
-        .tit1 {
-          font-size: 28rpx;
-        }
-
-        .goodList_ib {
-          .price-container {
-            .price {
-              font-size: 32rpx;
-            }
-          }
-        }
-
-        .quantity-section {
-          .quantity-control {
-            .quantity-btn {
-              width: 50rpx;
-              height: 50rpx;
-
-              .quantity-icon {
-                font-size: 28rpx;
-              }
-            }
-
-            .quantity-display {
-              min-width: 70rpx;
-              height: 50rpx;
-
-              .quantity-text {
-                font-size: 24rpx;
-              }
-            }
-          }
-        }
-
-        .toBuy {
-          padding: 14rpx 20rpx;
-          font-size: 22rpx;
-          min-width: 100rpx;
-        }
-
-        .sold-out-section {
-          .sold-out-btn {
-            padding: 14rpx 28rpx;
-            font-size: 22rpx;
-          }
-        }
-      }
-    }
-  }
-}
 </style>