<template>
    <view class="container">
        <view class="about">
            <view class="content">
                <view class="qrcode">
                    <image src="@/static/logo.png"></image>
                    <text class="tip">{{userinfo.username}}</text>
                </view>
                <view class="desc">
                    {{config.about.slogan}}
                </view>

                <view class="uni-card">
                    <view class="uni-list">
                        <view class="uni-list-cell-divider">

                        </view>
                        <!-- #ifndef APP-PLUS -->
                        <navigator v-for="item in menus" :url="item.url" class="uni-list-cell"
                            hover-class="uni-list-cell-hover">
                            <view class="uni-list-cell-navigate uni-navigate-right">
                                {{item.title}}
                            </view>
                        </navigator>
                        <!-- #endif -->
                        <!-- #ifdef APP-PLUS -->
                        <view v-for="item in menus" class="uni-list-cell" hover-class="uni-list-cell-hover"
                            @click="go(item.url)">
                            <view class="uni-list-cell-navigate uni-navigate-right">
                                {{item.title}}
                            </view>
                        </view>
                        <!-- #endif -->
                        <button type="primary" @click="reload">加载数据资源</button>
                    </view>
                </view>

                <!-- #ifdef APP-PLUS -->
                <button type="primary" @click="share">分享</button>
                <!-- #endif -->
            </view>
            <!-- #ifdef APP-PLUS -->
            <view class="version">
                当前版本：{{version}}
            </view>
            <!-- #endif -->
        </view>
    </view>
</template>

<script>
    import utils from "@/utils/common.js";
    import config from "@/config/ctms.config.js";
    import ctms from '@/apis/ctms/index.js';

    export default {
        data() {
            return {
                userinfo: {},
                menus: {
                    orderpre: {
                        title: '我的询价',
                        url: '../orderpre/list/list'
                    },
                    order: {
                        title: '运单记录',
                        url: '../order/list/list'
                    },
                    news: {
                        title: '资讯报道',
                        url: '../news/list/list'
                    },
                    about: {
                        title: '关于App',
                        url: '../about/about'
                    },
                    login: {
                        title: '切换登陆',
                        url: '../login/login'
                    }
                },
                version: '',
                config: {}
            }
        },
        onLoad() {
            var configApp = getApp().globalData.config;
            //使用扩展运算符合并对象
            var _cfg = {
                ...configApp,
                ...config
            };
            this.config = _cfg;
            this.version = _cfg.version;
        },
        onShow() {
            this.userinfo = ctms.user.getInfo();
        },

        methods: {
            // #ifdef APP-PLUS
            save() {
                uni.showActionSheet({
                    itemList: ['保存图片到相册'],
                    success: () => {
                        plus.gallery.save(
                            'https://public.hiluker.com/luker_fm2.png',
                            function() {
                                uni.showToast({
                                    title: '保存成功',
                                    icon: 'none'
                                });
                            },
                            function() {
                                uni.showToast({
                                    title: '保存失败，请重试！',
                                    icon: 'none'
                                });
                            });
                    }
                });
            },
            share(e) {
                var msg = "运车助手"
                plus.share.sendWithSystem();
                uni.shareWithSystem({
                    summary: "安邮车联运车平台，一个专门服务于汽车托运的系统，致力于推动轿运市场标准化、现代化发展。",
                    href: "http://ctms.hiluker.cn",
                    success() {
                        // 分享完成，请注意此时不一定是成功分享
                    },
                    fail() {
                        // 分享失败
                    }
                })
            },
            // #endif

            go(e) {
                uni.navigateTo({
                    url: e
                });
            },
            reload() {
                uni.switchTab({
                    url: '../tabbar/me/index'
                })
            }
        }
    }
</script>

<style>
    page,
    view {
        display: flex;
    }

    page {
        min-height: 100%;
        background-color: #FFFFFF;
    }

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

    .about {
        flex-direction: column;
        flex: 1;
    }

    .content {
        flex: 1;
        padding: 30rpx;
        flex-direction: column;
        justify-content: center;
    }

    .qrcode {
        display: flex;
        align-items: center;
        flex-direction: column;
    }

    .qrcode .tip {
        margin-top: 20rpx;
    }

    .desc {
        margin-top: 30rpx;
        display: block;
    }

    .code {
        color: #e96900;
        background-color: #f8f8f8;
    }

    button {
        width: 100%;
        margin-top: 40rpx;
    }

    .version {
        height: 80rpx;
        line-height: 80rpx;
        justify-content: center;
        color: #ccc;
    }

    .source {
        margin-top: 30rpx;
        flex-direction: column;
    }

    .source-list {
        flex-direction: column;
    }

    .link {
        color: #007AFF;
    }

    .uni-list-cell-navigate {
        position: unset;
    }

    navigator {
        color: #000000;
    }

    .uni-navigator.uni-list-cell-navigate.uni-navigate-right:after {
        font-family: uniicons;
        content: '\e583';
        position: relative;
        right: 0.75rem;
        top: 50%;
        color: #bbb;
        transform: translateY(-50%);
        width: 15rpx;
        height: 24rpx;
    }

    .uni-list .uni-list-cell:last-child::after {
        height: 1px;
    }

    .uni-list-cell::after {
        position: absolute;
        z-index: 3;
        right: 0;
        bottom: 0;
        left: 0.9375rem;
        height: 1px;
        content: '';
        transform: scaleY(.5);
        background-color: #c8c7cc;
    }
</style>