YileUI - 设置页面

简述

设置页面界面，内容项可根据自行需要添加修改。

平台支持

<template>
    <view>
        <view>
            <view @click="onHref('/pages/my/about/about')">
                <image src="/static/icon/color.png"></image>
                <label>帐号与安全</label>
                <yile-icons icon="right" color="#999" size="38rpx"></yile-icons>
            </view>
            <view @click="onHref('/pages/my/about/about')">
                <image src="/static/icon/slider.png"></image>
                <label>支付设置</label>
                <yile-icons icon="right" color="#999" size="38rpx"></yile-icons>
            </view>
        </view>
        <view>
            <view @click="onHref('/pages/my/about/about')">
                <image src="/static/icon/getcode.png"></image>
                <label>新消息通知</label>
                <yile-icons icon="right" color="#999" size="38rpx"></yile-icons>
            </view>
            <view @click="onHref('/pages/my/about/about')">
                <image src="/static/icon/steps.png"></image>
                <label>功能管理</label>
                <yile-icons icon="right" color="#999" size="38rpx"></yile-icons>
            </view>
            <view @click="onHref('/pages/my/about/about')">
                <image src="/static/icon/format.png"></image>
                <label>皮肤中心</label>
                <yile-icons icon="right" color="#999" size="38rpx"></yile-icons>
            </view>
            <view @click="onHref('/pages/my/about/about')">
                <image src="/static/icon/storage.png"></image>
                <label>隐私</label>
                <yile-icons icon="right" color="#999" size="38rpx"></yile-icons>
            </view>
            <view @click="onHref('/pages/my/about/about')">
                <image src="/static/icon/tag.png"></image>
                <label>通用</label>
                <yile-icons icon="right" color="#999" size="38rpx"></yile-icons>
            </view>
        </view>
        <view>
            <view @click="onHref('/pages/my/about/about')">
                <image src="/static/icon/feedback.png"></image>
                <label>反馈与投诉</label>
                <yile-icons icon="right" color="#999" size="38rpx"></yile-icons>
            </view>
            <view @click="onHref('/pages/my/about/about')">
                <image src="/static/icon/about.png"></image>
                <label>关于</label>
                <text>版本号 10.2.0</text>
                <yile-icons icon="right" color="#999" size="38rpx"></yile-icons>
            </view>
        </view>
        <button>登录其他帐号</button>
        <button>退出登录</button>
    </view>
</template>

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

            }
        },
        onLoad() {

        },
        methods: {
            onHref(url) {
                uni.navigateTo({
                    url: url
                }) 
            }
        }
    }
</script>

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

    .tool_con {
        box-sizing: border-box;
        width: 94%;
        margin: 25rpx 3% 0;
        background-color: #fff;
        border-radius: 15rpx;
        padding: 0 0 0 3%;
        font-size: 32rpx;

        view {
            display: flex;
            flex-direction: row;
            align-items: center;
            border-bottom: 1px solid #F7F7F7;
            line-height: 95rpx;
            padding: 0 3% 0 0;

            image {
                width: 50rpx;
                height: 50rpx;
            }

            label {
                margin-left: 25rpx;
                flex: 1;
            }
            
            .mess{
                margin-right: 10rpx;
                color: #999;
                font-size: 30rpx;
            }
        }
    }

    .btn {
        box-sizing: border-box;
        width: 94%;
        margin: 25rpx 3% 0;
        background-color: #fff;
        border-radius: 15rpx;
        font-size: 32rpx;
        line-height: 100rpx;
    }

    .btn::after {
        border: 0;
    }
</style>