Merge branch 'main' of https://git.yuzhankeji.cn/TmOct5/BlockChainH5

apis/interfaces/user.js

@@ -0,0 +1,60 @@
+
+/**
+ * Web唐明明
+ * 匆匆数载恍如梦，岁月迢迢华发增。
+ * 碌碌无为枉半生，一朝惊醒万事空。
+ * moduleName: 区块链
+ */
+
+import { request } from '../index'
+
+// 节点中心-用户信息
+const userIndex = () => {
+	return request({
+		url: 'user/web'
+	})
+}
+
+// 节点中心-公告
+const userNotice = () => {
+	return request({
+		url: 'articles/notice'
+	})
+}
+
+// 专属客服
+const userCustomer = () => {
+	return request({
+		url: 'user/services'
+	})
+}
+
+// 帮助中心
+const userHelp = () => {
+	return request({
+		url: 'articles/helps'
+	})
+}
+
+// 服务条款
+const userClause = () => {
+	return request({
+		url: 'articles/service'
+	})
+}
+
+// 邀请好友
+const userInvite = () => {
+	return request({
+		url: 'articles/invite'
+	})
+}
+
+export {
+    userIndex,
+	userNotice,
+    userCustomer,
+    userHelp,
+    userClause,
+    userInvite
+}

pages.json

@@ -20,6 +20,27 @@
 		"style": {
 			"navigationBarTitleText": "节点中心"
 		}
+	}, {
+		"path": "pages/user/code",
+		"name": "userCode",
+		"auth": true,
+		"style": {
+			"navigationBarTitleText": "邀请好友"
+		}
+	}, {
+		"path": "pages/user/help",
+		"name": "userHelp",
+		"auth": true,
+		"style": {
+			"navigationBarTitleText": "帮助中心"
+		}
+	}, {
+		"path": "pages/user/clause",
+		"name": "userClause",
+		"auth": true,
+		"style": {
+			"navigationBarTitleText": "服务条款"
+		}
 	}, {
 		"path": "pages/instrument/basics",
 		"name": "instrumentBasics",
@@ -140,4 +161,4 @@
 	"easycom": {
 		"^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
 	}
-}
+}

pages/user/clause.vue

@@ -0,0 +1,46 @@
+<template>
+	<view>
+        <view class="clauseCont">
+            <rich-text :nodes="clauseData"></rich-text>
+        </view>
+	</view>
+</template>
+
+<script>
+    import { userClause } from '@/apis/interfaces/user'
+	export default {
+		data() {
+			return {
+				clauseData: []   //服务条款
+			};
+		},
+        onLoad() {
+            // 获取服务条款
+            this.clauseInfo()
+        },
+        methods: {
+            // 服务条款
+            clauseInfo(){
+                userClause().then(res => {
+                    this.clauseData = res.content.replace(/\<img/gi, '<img style="max-width:100%; height:auto; vertical-align: top;"')
+                }).catch(err => {
+                    uni.showToast({
+                        icon: 'none',
+                        title: err.message
+                    })
+                })
+            },
+        }
+	}
+</script>
+
+<style lang="scss">
+    page {
+        background-color: $uni-bg-color;
+    }
+    .clauseCont {
+        padding: $padding + 10 $padding * 2;
+        width: 100%;
+        box-sizing: border-box;
+    }
+</style>

pages/user/code.vue

@@ -0,0 +1,281 @@
+<template>
+	<view>
+        <view class="codeContent">
+            <!-- 邀请码图 -->
+            <view class="codeBack">
+                <image class="codeBack-img" src="/static/user/user-codeIcon.png" mode="widthFix"></image>
+                <view class="codeBack-avatar">
+                    <image src="/static/user/call.png" mode="aspectFill"></image>
+                    <view class="">
+                        张慢慢
+                    </view>
+                </view>
+                <view class="codeBack-top">
+                    <view class="codeBack-title">
+                        您的邀请码
+                    </view>
+                    <view class="codeBack-number">
+                        8012568
+                    </view>
+                    <view class="codeBack-copy" @click="copyCenter(inviteData.invite)">
+                        复制
+                    </view>
+                </view>
+                <view class="codeBack-yard">
+                    <image class="codeBack-yard-img" src="/static/user/wallet-code.png" mode="widthFix"></image>
+                    <view class="codeBack-yard-name">
+                        扫码识别链商星球
+                    </view>
+                    <view class="codeBack-yard-tips">
+                        加入链商星球享受能量球权益
+                    </view>
+                </view>
+            </view>
+        </view>
+	</view>
+</template>
+
+<script>
+    import { userInvite } from '@/apis/interfaces/user'
+	export default {
+		data() {
+			return {
+				inviteData: {} //二维码信息
+			};
+		},
+        onLoad() {
+            // 获取二维码
+            this.inviteInfo()
+        },
+        methods:{
+            // 二维码
+            inviteInfo(){
+                userInvite().then(res => {
+                    this.inviteData = res
+                }).catch(err => {
+                    uni.showToast({
+                        icon: 'none',
+                        title: err.message
+                    })
+                })
+            },
+            
+            // 复制邀请码
+            copyCenter(e) {
+                console.log('ddd')
+                let copyNo = e
+                uni.vibrateShort({
+                    success: () => {
+                        uni.setClipboardData({
+                            data    : copyNo,   
+                            success : res=> {
+                                uni.showToast({
+                                    title   : '复制成功',
+                                    icon    :'none',
+                                    duration: 3000
+                                });
+                            }
+                        })
+                    }
+                })
+            },
+            
+            // 分享微信好友
+            friend(scene) {
+                uni.share({
+					provider: 'weixin',
+					title: '我正在使用ocChain',
+					scene: scene,
+					href: 'https://live.funnyzhibo.com/blockdownload',
+					imageUrl: 'https://live.funnyzhibo.com/oc-chain.png',
+					summary: '邀请您一起加入，邀请码' + this.inviteData.invite,
+					complete: res=> {
+						console.log(res)
+					}
+				})
+            }
+        }
+	}
+</script>
+
+<style>
+    page {
+        background-image: linear-gradient(to top, #7c52fc, #976dff);
+    }
+</style>
+
+<style lang="scss">
+    // 背景
+    .codeImg {
+        width: 100%;
+        height: 100%;
+    }
+    
+    // 内容
+    .codeContent {
+        position: absolute;
+        left: 0;
+        top: 0;
+        width: 100%;
+        padding: 120rpx 80rpx 40rpx;
+        box-sizing: border-box;
+        text-align: center;
+        .titleImg {
+            max-width: 100%;
+        }
+        .codeBack {
+            background-color: $uni-bg-color;
+            border-radius: $uni-border-radius-lg;
+            position: relative;
+            margin: $margin * 2 0 $margin * 2.5;
+            overflow: hidden;
+            &::after, &::before {
+                position: absolute;
+                background-color: #8c62fe;
+                content: '';
+                top: 266px;
+                width: 40rpx;
+                height: 40rpx;
+                border-radius: $uni-border-radius-circle;
+            }
+            &::after {
+                left: -20rpx;
+            }
+            &::before {
+                right: -20rpx;
+            }
+            .codeBack-img {
+                position: absolute;
+                width: 100%;
+                height: 100%;
+                left: 0;
+                top: 0;
+            }
+            .codeBack-top {
+                width: 100%;
+                padding: $padding;
+                height: 150px;
+                box-sizing: border-box;
+                position: relative;
+                .codeBack-title {
+                    color: #7c52fc
+                }
+                .codeBack-number {
+                    font-size: 60rpx;
+                    color: #7c52fc;
+                    text-transform:uppercase;
+                    font-weight: 700;
+                    margin: $margin - 10 0 $margin;
+                }
+                .codeBack-copy {
+                    font-size: $title-size-lg;
+                    display: inline-block;
+                    background: linear-gradient(to right, #f9c869, #eca824);
+                    color: #fff;
+                    padding: 15rpx $padding * 2;
+                    border-radius: $uni-border-radius-lg;
+                    margin-bottom: $margin * 2;
+                }
+                .codeBack-tips {
+                    .codeBack-tips-text {
+                        color: #7c52fc;
+                        font-weight: 700;
+                    }
+                    .codeBack-tips-label {
+                        margin-top: $margin;
+                        border-radius: $uni-border-radius-lg;
+                        display: inline-block;
+                        background-color: #fbeec9;
+                        font-size: $title-size-sm;
+                        padding: 0 $padding + 12;
+                        height: 56rpx;
+                        line-height: 56rpx;
+                        color: #9f7d42;
+                    }
+                }
+            }
+            .codeBack-avatar {
+                margin-top: $margin * 2;
+                image {
+                    width: 140rpx;
+                    height: 140rpx;
+                    border-radius: 50%;
+                    margin-bottom: $margin;
+                }
+            }
+            .codeBack-yard {
+                padding: $padding $padding * 4 $padding * 2;
+                text-align: center;
+                position: relative;
+                font-size: $title-size-lg;
+                &::after {
+                    position: absolute;
+                    content: '';
+                    left: 50rpx;
+                    top: 0;
+                    width: calc(100% - 100rpx);
+                    border-top: #cccbd0 2rpx dashed;
+                }
+                .codeBack-yard-img {
+                    max-width: 80%;
+                }
+                .codeBack-yard-name {
+                    color: #a0a1a3;
+                    margin-bottom: $margin - 10;
+                }
+                .codeBack-yard-tips {
+                    color: #7c52fc
+                }
+            }
+        }
+        
+        .codeRule {
+            background-color: $uni-bg-color;
+            border-radius: $radius;
+            padding: $padding + 10;
+            .codeRule-title {
+                font-size: $uni-font-size-lg + 4;
+                color: #7c52fc;
+                font-weight: 700;
+                margin-bottom: $margin + 10;
+            }
+            .codeRule-list {
+                text-align: left;
+                font-size: $title-size-m;
+                line-height: 38rpx;
+                text {
+                    display: block;
+                    margin-bottom: $margin - 5;
+                    color: #7c52fc;
+                }
+            }
+        }
+    }
+    
+    // 分享途径
+    .codeShare {
+        position: fixed;
+        left: 0;
+        bottom: 0;
+        z-index: 9;
+        background-color: $uni-bg-color;
+        box-sizing: border-box;
+		height: 200rpx;
+        width: 100%;
+        display: flex;
+		justify-items: center;
+		align-items:center;
+        .codeShare-label {
+            width: 50%;
+            text-align: center;
+            font-size: $uni-font-size-sm;
+            color: $text-gray;
+            image {
+                width: $uni-img-size-lg - 10;
+                height: $uni-img-size-lg - 10;
+                display: flex;
+                margin: 0 auto $margin - 10;
+            }
+        }
+    }
+</style>

pages/user/help.vue

@@ -0,0 +1,118 @@
+<template>
+	<view>
+        <view class="helpCont">
+            <view class="helpCont-list" :class="{active : item.spread}" v-for="(item, index) in helpList" :key="index" @click="showClick(item, index)">
+                <view class="helpCont-name">
+                    <view class="helpCont-tips">{{ index + 1 }}</view>
+                    {{ item.title }}
+                    <image class="helpCont-img" src="/static/user/user-more.png" :class="{active : item.spread}" mode="aspectFill"></image>
+                </view>
+                <view class="helpCont-text">
+                    {{ item.description }}
+                </view>
+            </view>
+        </view>
+	</view>
+</template>
+
+<script>
+    import { userHelp } from '@/apis/interfaces/user'
+	export default {
+		data() {
+			return {
+				helpList: [],   //帮助中心列表
+                showList: false // 显示子内容
+			};
+		},
+        onLoad() {
+            // 获取帮助中心
+            this.helpInfo()
+        },
+        methods: {
+            // 帮助中心
+            helpInfo(){
+                userHelp().then(res => {
+                    console.log(res)
+                    res.forEach((value, index) => {
+                        res[index].spread = false
+                        res[0].spread = true
+                    });
+                    this.helpList = res
+                }).catch(err => {
+                    uni.showToast({
+                        icon: 'none',
+                        title: err.message
+                    })
+                })
+            },
+            
+            // 展开帮助中心-内容
+            showClick(item, index) {
+                this.helpList.forEach(i => {
+                    if (i.spread !== this.helpList[index].spread) {
+                        i.spread = false;
+                    }
+                })
+                item.spread = !item.spread
+            }
+        }
+	}
+</script>
+
+<style lang="scss">
+    .helpCont {
+        margin: $margin;
+        background-color: $uni-bg-color;
+        padding: $padding + 10 $padding + 10 5rpx $padding + 10;
+        box-sizing: border-box;
+        border-radius: $radius;
+        .helpCont-list {
+            margin-bottom: $margin;
+            border-bottom: 1rpx solid #f3f3f3;
+            font-size: $uni-font-size-base;
+            height: 60rpx;
+            overflow: hidden;
+            &.active {
+                height: auto;
+            }
+            &:last-child {
+                border-bottom: none;
+                margin-bottom: 0;
+            }
+            .helpCont-name {
+                font-weight: 700;
+                display: flex;
+                line-height: 40rpx;
+                margin-bottom: $margin;
+                position: relative;
+                .helpCont-tips {
+                    width: 40rpx;
+                    height: 40rpx;
+                    line-height: 40rpx;
+                    margin-right: 10rpx;
+                    text-align: center;
+                    background-image: linear-gradient(to left, #7c52fc, #976dff);
+                    color: $uni-text-color-inverse;
+                    transform: scale(0.83);
+                     border-radius: $uni-border-radius-base;
+                }
+                .helpCont-img {
+                    position: absolute;
+                    right: 0;
+                    top: 8rpx;
+                    width: 26rpx;
+                    height: 26rpx;
+                    &.active {
+                        transform:rotate(90deg);
+                    }
+                }
+            }
+            .helpCont-text {
+                font-size: $title-size-sm;
+                line-height: 40rpx;
+                color: $text-gray;
+                padding-bottom: $padding;
+            }
+        }
+    }
+</style>

scss/globa.scss

@@ -26,6 +26,8 @@ $title-size-sm: 26rpx;
 // 模块圆角
 $radius: 20rpx;
 $radius-sm: 10rpx;
+$radius-lg: 12rpx;
+$radius-m: 10rpx;
 
 // 模块边距
 $margin: 30rpx;