二维码

README.md

@@ -62,6 +62,8 @@
 
 ​	My_CenterTheTitle -- 居中标题 两侧带有居中蓝线
 
+​	My_NavTabs -- 自定义tabs切换
+
 ​	My_TwoDimensionalCode -- 二维码
 
 # 缓存

app.json

@@ -62,7 +62,8 @@
         "My_pageReachBottom": "/components/My_pageReachBottom/index",
         "van-transition": "@vant/weapp/transition/index",
         "My_DisplayBox": "/components/My_DisplayBox/index",
-        "My_VerticalBox": "/components/My_VerticalBox/index"
+        "My_VerticalBox": "/components/My_VerticalBox/index",
+        "My_NavTabs": "/components/My_NavTabs/index"
     },
     "window": {
         "backgroundTextStyle": "light",

components/My_NavTabs/index.js

@@ -0,0 +1,40 @@
+// components/My_NavTabs/index.js
+Component({
+    /**
+     * 组件的属性列表
+     */
+    properties: {
+        tabsList: {
+            type: Array
+        },
+        tabsIndex: {
+            type: Number,
+            value: 0
+        },
+        setIndex: {
+            type: Function
+        }
+    },
+
+    /**
+     * 组件的初始数据
+     */
+    data: {
+
+    },
+
+    /**
+     * 组件的方法列表
+     */
+    methods: {
+        setTabsIndex(e) {
+            const {
+                index
+            } = e.target.dataset;
+            this.setData({
+                tabsIndex: index
+            })
+            this.triggerEvent("setIndex",index)
+        }
+    }
+})

components/My_NavTabs/index.json

@@ -0,0 +1,4 @@
+{
+    "component": true,
+    "usingComponents": {}
+}

components/My_NavTabs/index.wxml

@@ -0,0 +1,5 @@
+<view class="tabs_box">
+    <view class="tbas_list" bindtap="setTabsIndex">
+        <view wx:for="{{tabsList}}" data-index="{{index}}" class="{{tabsIndex==index?'active':''}}">{{item}}</view>
+    </view>
+</view>

components/My_NavTabs/index.wxss

@@ -0,0 +1,44 @@
+.tabs_box {
+    display: flex;
+    align-items: flex-end;
+    justify-content: space-between;
+    width: 100vw;
+    height: 100rpx;
+    background: #FFFFFF;
+}
+
+.tbas_list {
+    display: flex;
+    font-size: 28rpx;
+    margin-left: 44rpx;
+}
+
+.tbas_list>view {
+    margin-left: 32rpx;
+    line-height: 32rpx;
+    height: 60rpx;
+}
+
+.tbas_list>view:first-child {
+    margin-left: 0;
+}
+
+.active {
+    position: relative;
+    font-size: 32rpx;
+    font-weight: 600;
+    color: #4BBECF;
+}
+
+.active::before {
+    position: absolute;
+    content: '';
+    display: block;
+    width: 60rpx;
+    height: 6rpx;
+    background: #4DC2D4;
+    border-radius: 3rpx;
+    bottom: 0;
+    left: 50%;
+    transform: translate(-50%,0);
+}

components/My_TwoDimensionalCode/index.js

@@ -4,7 +4,16 @@ Component({
      * 组件的属性列表
      */
     properties: {
-
+        title: {
+            type: String
+        },
+        codeName: {
+            type: String
+        },
+        imageUrl: {
+            type: String,
+            value: 'https://bwj.obs.cn-east-2.myhuaweicloud.com:443/202112101639101631143B33e18617.png'
+        }
     },
 
     /**
@@ -18,6 +27,49 @@ Component({
      * 组件的方法列表
      */
     methods: {
-
+        /* 预览大图 */
+        preViewImage() {
+            const url = [this.data.imageUrl];
+            wx.previewImage({
+                urls: url,
+            })
+        },
+        /* 下载二维码 */
+        download() {
+            wx.downloadFile({
+                url: this.data.imageUrl,
+                success: function (res) {
+                    const tempFilePath = res.tempFilePath;
+                    // 保存文件
+                    wx.saveFile({
+                        tempFilePath,
+                        success: function (res) {
+                            const savedFilePath = res.savedFilePath;
+                            // 打开文件
+                            wx.openDocument({
+                                filePath: savedFilePath,
+                                success: function (res) {
+                                    console.log(res)
+                                },
+                            });
+                        },
+                        fail: function (err) {
+                            console.log('保存失败：', err)
+                            wx.showToast({
+                                title: '保存失败',
+                                icon: "none"
+                            })
+                        }
+                    });
+                },
+                fail: function (err) {
+                    console.log('下载失败：', err);
+                    wx.showToast({
+                        title: '下载失败',
+                        icon: "none"
+                    })
+                },
+            });
+        }
     }
-})
+})

components/My_TwoDimensionalCode/index.wxml

@@ -1,2 +1,7 @@
-<My_DisplayBox title="请求列表" isMore="{{false}}">
+<My_DisplayBox title="{{title}}" isMore="{{false}}">
+    <image slot="display-box-img" class="display-title_image" src="/static/icon-05.png" mode="aspectFit"></image>
+    <view class="two-code" bindtap="preViewImage">
+        <image src="{{imageUrl}}" mode="aspectFit"></image>
+    </view>
+    <view class="two-code-text">{{codeName}}<text catchtap="download">下载</text></view>
 </My_DisplayBox>

components/My_TwoDimensionalCode/index.wxss

@@ -1 +1,31 @@
-/* components/My_TwoDimensionalCode/index.wxss */
+/* 展示区域title image */
+.display-title_image {
+    width: 32rpx;
+    height: 32rpx;
+    margin: 0 6rpx;
+}
+
+.two-code {
+    width: 510rpx;
+    height: 510rpx;
+    margin: 54rpx auto 20rpx;
+}
+
+.two-code>image {
+    width: 100%;
+    height: 100%;
+}
+
+.two-code-text {
+    font-size: 28rpx;
+    color: #000000;
+    text-align: center;
+    padding-bottom: 60rpx;
+}
+
+.two-code-text>text {
+    font-weight: 600;
+    color: #4DC2D4;
+    margin-left: 16rpx;
+    text-decoration: underline;
+}

pages/businessPartner/applyFor.js

@@ -17,6 +17,8 @@ Page({
         scrolltolowerThrottle: true, //下拉触底截流
         pageNumber: 1, //请求分页
         pageTotal: 1, //总页数
+        tabsList: ['商户二维码', '加入请求'], //tabs
+        tabsIndex: 0, //tabs 选中下标
     },
     /**
      * 生命周期函数--监听页面加载
@@ -24,6 +26,14 @@ Page({
     onLoad: function (options) {
         this.getList();
     },
+    /* tabs切换页面 */
+    setIndex({
+        detail
+    }) {
+        this.setData({
+            tabsIndex:detail
+        })
+    },
     /* 下拉触底 */
     scrolltolower() {
         if (!this.data.scrolltolowerThrottle) return;
@@ -32,6 +42,7 @@ Page({
         })
         if (this.data.pageTotal > this.data.pageNumber) this.getList();
     },
+    /* 获得列表 */
     getList() {
         _Http.basic({
             "accesstoken": wx.getStorageSync('userData').token,
@@ -151,6 +162,7 @@ Page({
         const {
             index
         } = e.currentTarget.dataset;
+        this.closeTheDropDown();
         if (index == this.data.showBtn) return;
         this.setData({
             pattern: false,
@@ -163,7 +175,8 @@ Page({
             dropDownList: !this.data.dropDownList
         })
     },
-    hiddenDropDown() {
+    /* 点击遮罩层关闭 */
+    closeTheDropDown() {
         this.setData({
             dropDownList: false
         })

pages/businessPartner/applyFor.json

@@ -1,5 +1,6 @@
 {
   "usingComponents": {
-    "My_DisplayBox": "/components/My_DisplayBox/index"
+    "My_DisplayBox": "/components/My_DisplayBox/index",
+    "My_TwoDimensionalCode": "/components/My_TwoDimensionalCode/index"
   }
 }

pages/businessPartner/applyFor.wxml

@@ -1,8 +1,12 @@
-<My_DisplayBox title="请求列表" isMore="{{false}}">
+<!-- tabs -->
+<My_NavTabs tabsList="{{tabsList}}" bindsetIndex="setIndex"></My_NavTabs>
+<!-- 二维码 -->
+<My_TwoDimensionalCode wx:if="{{tabsIndex==0}}" title="商户二维码" codeName="合作二维码"></My_TwoDimensionalCode>
+<!-- 列表 -->
+<My_DisplayBox wx:else title="请求列表" isMore="{{false}}">
     <image slot="display-box-img" class="display-title_image" src="/static/icon-05.png" mode="aspectFit"></image>
     <scroll-view class="list-scroll-view" scroll-y bindscrolltolower="scrolltolower">
-    <!-- requestList -->
-        <view class="company-data" wx:for="{{2}}" data-index="{{index}}" bindtap="showBtnIndex">
+        <view class="company-data" wx:for="{{requestList}}" data-index="{{index}}" bindtap="showBtnIndex">
             <image class="company-data-image" src="{{item.attinfos[0].fobsurl}}"></image>
             <view class="company-data-brandName u-line-1">
                 {{item.fbrand}}
@@ -14,8 +18,7 @@
                     <van-button data-index="{{index}}" custom-class="custom-class-company-data" catchtap="ratify">同意</van-button>
                 </view>
                 <!-- 下拉选择 -->
-                <view wx:else class="pattern">
-                    <input type="text" disabled="{{!dropDownList}}" readonly bindfocus="chooseCooperationMode" bindblur="hiddenDropDown" style="width: 100%; height: 100%;position: absolute; opacity: 0;" />
+                <view wx:else class="pattern" catchtap="chooseCooperationMode">
                     选择合作方式
                     <van-icon name="arrow-down" />
                     <van-transition show="{{dropDownList}}" class="pattern-item-box" name="fade-down">
@@ -29,4 +32,4 @@
         <My_pageReachBottom loadMore="{{scrolltolowerThrottle==true}}" dummyStatus="{{requestList.length>1}}"></My_pageReachBottom>
     </scroll-view>
 </My_DisplayBox>
-<view wx:if="{{dropDownList}}" style="height: 100vh; width: 100vw; position: absolute; top: 0; left: 0; background: #000; opacity: 0.3; z-index: 0;" bindtap="closeTheDropDown"></view>
+<view wx:if="{{dropDownList}}" style="height: 100vh; width: 100vw; position: absolute; top: 0; left: 0; z-index: 0;" bindtap="closeTheDropDown"></view>

pages/businessPartner/applyFor.wxss

@@ -20,6 +20,7 @@
     padding-bottom: 20rpx;
     border-bottom: 2rpx solid rgba(151, 151, 151, .1);
     margin-bottom: 20rpx;
+    z-index: 99;
 }
 
 .company-data-image {
@@ -28,6 +29,7 @@
     border-radius: 10rpx;
     margin-right: 20rpx;
     background-color: royalblue;
+    z-index: 99;
 }
 
 .company-data-brandName {
@@ -36,6 +38,7 @@
     align-items: center;
     font-size: 28rpx;
     color: #000000;
+    z-index: 99;
 }
 
 .company-data-but {
@@ -57,12 +60,12 @@
     text-shadow: 0px 0px 12px rgba(0, 0, 0, 0.1);
 }
 
-.jujue{ 
+.jujue {
     background: linear-gradient(180deg, #D3D3D3 0%, #A7A8A8 100%) !important;
 }
 
 /* 选择合作方式 */
-.pattern{
+.pattern {
     position: relative;
     display: flex;
     justify-content: center;
@@ -73,14 +76,16 @@
     height: 46rpx;
     border-radius: 10rpx;
     border: 2rpx solid #4BBECF;
+    z-index: 99;
 }
-.pattern-item-box{
-    position:absolute;
+
+.pattern-item-box {
+    position: absolute;
     width: 100%;
     top: 65rpx;
 }
 
-.pattern-item{
+.pattern-item {
     width: 100%;
     background-color: #ffffff;
     border: 2rpx solid #e8e8e8;
@@ -89,20 +94,20 @@
     box-shadow: 0 0 8rpx 0 rgba(0, 0, 0, 0.1);
 }
 
-.pattern-item>view{
+.pattern-item>view {
     line-height: 50rpx;
     text-align: center;
     color: rgba(0, 0, 0, 0.5);
 }
 
-.pattern-item::after{
+.pattern-item::after {
     position: absolute;
     content: '';
     display: block;
     width: 15rpx;
     height: 15rpx;
-    background-color:#fff;
-    transform:rotate(45deg);
+    background-color: #fff;
+    transform: rotate(45deg);
     border: 2rpx solid #e8e8e8;
     border-bottom: 0;
     border-right: 0;

pages/login/index.js

@@ -106,7 +106,8 @@ Page({
         /* 发送请求 */
         _Http.login({
             "phonenumber": this.data.fphonenumber,
-            "password": utilMd5.hexMD5(this.data.password)
+            "password": utilMd5.hexMD5(this.data.password),
+            "client":"wechat_customer"
         }).then(res => {
             console.log(res)
             /* 结果验证 */
@@ -340,7 +341,8 @@ Page({
             "errTips.fphonenumber": true
         })
         _Http.getPassword({
-            "phonenumber": this.data.fphonenumber
+            "phonenumber": this.data.fphonenumber,
+            "client":"wechat_customer"
         }).then(res => {
             console.log(res)
             this.setData({