YileUI - 关于我们

简述

关于我们页面界面,基于 版权号 + 去评分 + 版权信息 等内容项,可自行添加。


平台支持

App(nvue)App(vue)小程序H5


uni-app代码
<template>
    <view>
        <view>
            <image src="/static/logo2.png"></image>
            <text>版本号 10.2.00</text>
        </view>
        <view>
            <view @click="onHref(1)">
                <text>去评分</text>
                <yile-icons icon="right" color="#999" size="38rpx"></yile-icons>
            </view>
            <view @click="onHref(2)">
                <text>版权信息</text>
                <yile-icons icon="right" color="#999" size="38rpx"></yile-icons>
            </view>
            <view @click="onHref(3)">
                <text>服务协议</text>
                <yile-icons icon="right" color="#999" size="38rpx"></yile-icons>
            </view>
            <view @click="onHref(4)">
                <text>营业执照</text>
                <yile-icons icon="right" color="#999" size="38rpx"></yile-icons>
            </view>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {

            }
        },
        onLoad() {

        },
        methods: {
            onHref(type) {
                switch (type) {
                    case 1:
                        uni.showToast({
                            title: '跳转:去评分',
                            icon: "none"
                        });
                        break;
                    case 2:
                        uni.showToast({
                            title: '跳转:版权信息',
                            icon: "none"
                        });
                        break;
                    case 3:
                        uni.showToast({
                            title: '跳转:服务协议',
                            icon: "none"
                        });
                        break;
                    case 4:
                        uni.showToast({
                            title: '跳转:营业执照',
                            icon: "none"
                        });
                        break;
                }
            }
        }
    }
</script>

<style>
    page {
        background-color: #f8f8f8;
    }

    .about_con {
        background-color: #fff;

        .logo {
            display: flex;
            flex-direction: column;
            justify-content: center;
            text-align: center;
            padding: 50rpx 0 0;

            image {
                width: 130rpx;
                height: 130rpx;
                border-radius: 10rpx;
                margin: 0 auto 20rpx;
            }

            text {
                font-size: 29rpx;
                color: #999;
            }
        }

        .tool {
            display: flex;
            flex-direction: column;
            margin-top: 50rpx;
            padding: 0 0 0 3%;
            font-size: 32rpx;

            view {
                display: flex;
                flex-direction: row;
                justify-content: space-between;
                border-top: 1px solid #F7F7F7;
                line-height: 95rpx;
                padding: 0 3% 0 0;
            }
        }
    }
</style>