@using PageAdmin.Utils;
@{
    string lastTime = null, lastIp = null, logins = null;
    dynamic userData = ViewBag.CurrentUserData;
    if (userData != null)
    {
        lastTime = userData.LastDate.ToString("yyyy-MM-dd HH:mm:ss");
        lastIp = userData.LastIp.ToString();
        logins = userData.Logins.ToString();
    }
    CurrentUser user = (CurrentUser)ViewBag.CurrentUser;
    int bindEmailState = (int)ViewBag.EmailBindState;
    int bindMobileState = (int)ViewBag.MobileBindState;
    string securityLevel = "低";
    if (bindEmailState == 1 && bindMobileState == 1)
    {
        securityLevel = "高";
    }
    else if (bindEmailState == 1 || bindMobileState == 1)
    {
        securityLevel = "中";
    }

}
<link rel="stylesheet" href="~/Incs/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="~/Areas/Member/Css/Home.css?v4.0.10.4" type="text/css">
<style>
    .table tbody tr:hover > td {background-color:white;}
</style>
<div class="main clearfix" id="main" v-cloak>
    <div class="account-info clearfix">
        <div class="account-left">
            <a href="javascript:void(0)" v-on:click="dialogVisible=true"><el-avatar :size="65" :src="avatar" alt="我的头像"></el-avatar></a>
            <el-dialog title=""
                       :visible.sync="dialogVisible"
                       width="400px">
                <img :src="avatar" style="max-width:100%;max-height:100%"/>
            </el-dialog>
        </div>
        <div class="account-body">
               <span class="account-name">欢迎您，@(ViewBag.NickName)</span>
                <el-tooltip class="item" effect="dark" content="用户资料修改" placement="right-start">
                    <a href="@Url.ActionUrl("UserInfo","MyLogin")"><span class="el-icon-edit-outline"></span></a>
                </el-tooltip>
            <p>
                <span>用户组：@ViewBag.MemberGroupName</span>
                @if (!string.IsNullOrEmpty(ViewBag.DepartmentName))
                {<span>&nbsp;所属部门：@ViewBag.DepartmentName </span>}
            </p>
            <p>
                这是您第 @logins 次登录，上次登录日期：@lastTime，登录Ip：@lastIp
            </p>
            <p class="security">
                <i class="fa fa-shield fa-lg"></i><span>安全等级：@securityLevel</span>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <i class="fa fa-envelope fa-lg @(bindEmailState==1?"":"no-bind")"></i><span>@(bindEmailState == 1 ? "已认证" : "未认证")</span>
                &nbsp;&nbsp;&nbsp;&nbsp;
                <i class="fa fa-mobile-phone fa-lg fa-2 @(bindMobileState==1?"":"no-bind")"></i><span>@(bindMobileState == 1 ? "已认证" : "未认证")</span>
            </p>
        </div>
    </div>

    <div class="panel" v-if="dataList.length>0">
        <div class="panel-heading clearfix">
            <span class="left">网站公告</span>
        </div>
        <div class="panel-body list-body">
            <ul id="noticeList" class="title-list">
                <li class="item clearfix" v-for="item in dataList">
                    <a class="title" :href="item.Url" target="_blank"><i class="fa fa-angle-right" aria-hidden="true"></i> {{item.Title}} <span class="date">/ {{item.Thedate}}</span></a>
                </li>
            </ul>
        </div>
    </div>
    <div class="panel security-info">
        <div class="panel-heading">账户安全</div>
        <div class="panel-body">
            <table class="table">
                <tr>
                    <td align="center" width="10%">
                        <i class="el-icon-check"></i>
                    </td>
                    <td><strong>登录密码</strong></td>
                    <td width="40%">安全性高的密码可以使帐号更安全,建议您定期更换密码。</td>
                    <td align="center">已设置</td>
                    <td align="center"><a href="@Url.Action("ModifyPassword","MyLogin",new { area = "member" })" class="text-blue">修改密码</a></td>
                </tr>
                <tr>
                    <td align="center" width="10%">
                        <i class=" @(bindEmailState==1?"el-icon-check": "el-icon-close")"></i>
                    </td>
                    <td><strong>邮箱绑定</strong></td>
                    <td width="40%">邮箱将是您的最基本账户资料，在保证安全的同时还可以使用邮箱登录。</td>
                    <td align="center">@(bindEmailState == 1 ? "已认证" : "未认证")</td>
                    <td align="center">
                        <a href="@Url.Action("EmailBind","MyLogin",new { area = "member" })">
                            <el-button type="primary" size="small">
                                @(bindEmailState == 1 ? "修改绑定" : "立即认证")
                            </el-button>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td align="center" width="10%">
                        <i class="@(bindMobileState==1?"el-icon-check": "el-icon-close")"></i>
                    </td>
                    <td><strong>手机绑定</strong></td>
                    <td width="40%">绑定手机并认证后，您的手机号可以直接用于登录、找回密码等。</td>
                    <td align="center">@(bindMobileState == 1 ? "已认证" : "未认证")</td>
                    <td align="center">
                        <a href="@Url.Action("MobileBind","MyLogin",new { area = "member" })">
                            <el-button type="primary" size="small">
                                @(bindMobileState == 1 ? "修改绑定" : "立即认证")
                            </el-button>
                        </a>
                    </td>
                </tr>
            </table>
        </div>
    </div>
</div>
<script type="text/javascript">
    var vue = new Vue({
        el: "#main",
        data: {
            dialogVisible: false,
            avatar:"@Html.Raw(ViewBag.Avatar)",
            dataList: [],
        },
        created: function(){
            if (isNullOrEmpty(this.avatar))
            {
                this.avatar = "/areas/member/css/images/DefaultAvatar.png";
            }
        },
        methods: {
        }
    });
    function loadData() {
        vue.ajax({
            url: "@Url.ActionUrl("GetWebNotice")",
            data: { number: 6},
            success: function (data) {
                vue.dataList = data
            }
        });
    }
    loadData();

    function fillInformation()
        {
             //弹出完善资料页面
            var defaultoption = {
                url: "@Url.ActionUrl("UserInfo", "MyLogin")?isDialog=1",
                            title: "",
                            shadeClose:false,
                            shade: 0.2,
                            target: "top",
                            width: "80%",
                            height: "80%",
                            closeBtn:false
                        };

            vue.dialog(defaultoption);
        }
       //1、检测资料完善
        var loginedMustFillInformation = @ViewBag.LoginedMustFillInformation;
        if (loginedMustFillInformation == 1)
        {
            vue.ajax({
                url: '@Url.ActionUrl("CheckMustFillInformation")', success: function (responseData) {
                    if (responseData.State == 0) {
                        fillInformation();
                    }
                }
            });
        }
</script>
