网站首页 网站源码
website
站点相关全部源代码,隐藏了一些关于服务器的信息
@model MemberModel
@using Microsoft.Extensions.Configuration
@inject IConfiguration Configuration

@{
    Layout = null;
    var baseAddress = Configuration["CDNBaseAddress"];
    var scriptsAddress = Configuration["CustomScript"];
    var version = DateTime.Now.ToString("yyyyMMddHHmmss");
}

<!DOCTYPE html>
<html lang="zh-Hans">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
    <title>@User.Identity?.Name - 个人中心</title>
    <environment include="Development">
        <link rel="stylesheet"
              href="@baseAddress/../member_version_2_0/css/member.css?_t=@version">
        <link rel="stylesheet"
              href="@baseAddress/../member_version_2_0/css/dark-mode.css?_t=@version">
        <link rel="stylesheet"
              href="@baseAddress/font-awesome/css/font-awesome.css">
    </environment>
    <environment exclude="Development">
        <link href="@baseAddress/../member_version_2_0/css/global-member.min.css?version=@Program.Version" rel="stylesheet">
    </environment>
    <link rel="stylesheet" href="@baseAddress/../library/cherry-markdown/cherry-markdown.css">
    <link href="@baseAddress/css/version_2_0/markdown_version_2_0.css" rel="stylesheet">
    <link href="@baseAddress/../library/prism/prism.css" rel="stylesheet" />

</head>
<body class="member-body">
<!-- 手机端菜单切换按钮 -->
<button class="menu-toggle" id="menuToggle">
    <i class="fa fa-bars"></i>
</button>

<!-- 手机端遮罩层 -->
<div class="sidebar-overlay" id="sidebarOverlay"></div>

<!-- 面包屑导航 -->
<div class="breadcrumb-container">
    <div class="breadcrumb">
        <a href="/">首页</a>
        <span class="separator">/</span>
        <a href="#profile">个人中心</a>
        <span class="separator">/</span>
        <span class="current" id="currentPageTitle">基本设置</span>
    </div>
</div>

<!-- 主容器 -->
<div class="member-container">
    <!-- 侧边栏导航 -->
    <div class="member-sidebar">
        <div class="user-profile">
            <div class="avatar-container">
                <img src="@Model.UserInfo.Avatar" alt="@Model.UserInfo.Id" class="user-avatar" id="userAvatar">
                <div class="avatar-upload">
                    <i class="fa fa-camera"></i>
                </div>
            </div>
            <h3 class="user-name" id="userName">@Model.UserInfo.Id</h3>
            <p class="user-email" id="userEmail">@Model.UserInfo.Sign</p>
        </div>

        <nav class="member-nav">
            <ul>
                <li class="nav-item active" data-page="profile">
                    <a href="#profile">
                        <i class="fa fa-user"></i>
                        <span>基本设置</span>
                    </a>
                </li>
                <li class="nav-item" data-page="articles">
                    <a href="#articles">
                        <i class="fa fa-file-text"></i>
                        <span>我的文章</span>
                    </a>
                </li>
                <li class="nav-item" data-page="mumbles">
                    <a href="#mumbles">
                        <i class="fa fa-comment"></i>
                        <span>我的碎碎念</span>
                    </a>
                </li>
                <li class="nav-item" data-page="timeline">
                    <a href="#timeline">
                        <i class="fa fa-clock-o"></i>
                        <span>我的时间轴</span>
                    </a>
                </li>
                <li class="nav-item" data-page="photos">
                    <a href="#photos">
                        <i class="fa fa-image"></i>
                        <span>我的相册</span>
                    </a>
                </li>
            </ul>
        </nav>
    </div>

    <!-- 主内容区域 -->
    <div class="member-content">
        <!-- 基本设置页面 -->
        <div class="content-page active" id="profile-page">
            <div class="page-header">
                <h2><i class="fa fa-user"></i> 基本设置</h2>
            </div>

            <div class="profile-form">
                <div class="form-group">
                    <label>账号</label>
                    <input type="text" class="form-control" id="account" readonly>
                </div>

                <div class="form-group">
                    <label>昵称 <span class="required">*</span></label>
                    <input type="text" class="form-control" id="nickname" placeholder="请输入昵称">
                </div>

                <div class="form-group">
                    <label>性别</label>
                    <select class="form-control" id="gender">
                        <option value="">请选择</option>
                        <option value="Man">男</option>
                        <option value="Wuman">女</option>
                    </select>
                </div>

                <div class="form-group">
                    <label>签名</label>
                    <textarea class="form-control" id="signature" rows="3" placeholder="请输入个人签名"></textarea>
                </div>

                <div class="form-group">
                    <label>头像</label>
                    <div class="avatar-upload-area">
                        <div class="avatar-preview">
                            <img src="@Model.UserInfo.Avatar" alt="头像预览" id="avatarPreview">
                        </div>
                        <div class="upload-controls">
                            <button type="button" class="btn btn-primary" id="uploadAvatar">
                                <i class="fa fa-upload"></i> 上传头像
                            </button>
                            <input type="file" id="avatarFile" accept="image/*" style="display: none;">
                        </div>
                    </div>
                </div>

                <div class="form-group">
                    <label>双因素验证</label>
                    <div class="two-factor-section">
                        <div class="two-factor-status" id="twoFactorStatus">
                            <span class="status-text">未绑定</span>
                            <button type="button" class="btn btn-success" id="bindTwoFactor">
                                <i class="fa fa-shield"></i> 绑定双因素验证
                            </button>
                        </div>

                        <div class="two-factor-modal" id="twoFactorModal" style="display: none;">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <h3>双因素验证设置</h3>
                                    <button type="button" class="close-btn" id="closeTwoFactorModal">
                                        <i class="fa fa-times"></i>
                                    </button>
                                </div>
                                <div class="modal-body">
                                    <div class="qr-section">
                                        <div class="qr-code" id="qrCode">
                                            <!-- 二维码将在这里显示 -->
                                        </div>
                                        <div class="secret-key">
                                            <label>密钥:</label>
                                            <input type="text" class="form-control" id="secretKey" readonly>
                                            <button type="button" class="btn btn-sm btn-secondary" id="copySecretKey">
                                                <i class="fa fa-copy"></i> 复制
                                            </button>
                                        </div>
                                    </div>
                                    <div class="pin-section">
                                        <label>请输入6位PIN码:</label>
                                        <input type="text" class="form-control" id="pinCode" maxlength="6"
                                               placeholder="000000">
                                    </div>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-secondary" id="cancelTwoFactor">取消</button>
                                    <button type="button" class="btn btn-primary" id="confirmTwoFactor">确认绑定
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="form-actions">
                    <button type="button" class="btn btn-primary" id="saveProfile">
                        <i class="fa fa-save"></i> 保存设置
                    </button>
                    <button type="button" class="btn btn-danger" id="logout">
                        <i class="fa fa-sign-out"></i> 退出登录
                    </button>
                </div>
            </div>
        </div>

        <!-- 我的文章页面 -->
        <div class="content-page" id="articles-page">
            <div class="page-header">
                <h2><i class="fa fa-file-text"></i> 我的文章</h2>
                <button type="button" class="btn btn-primary" id="newArticle">
                    <i class="fa fa-plus"></i> 发布文章
                </button>
            </div>

            <div class="search-section">
                <div class="search-form">
                    <div class="search-group">
                        <input type="text" class="form-control" id="articleTitleSearch" placeholder="搜索标题">
                    </div>
                    <div class="search-group">
                        <select class="form-control" id="articleTagSearch">
                            <option value="">所有标签</option>
                            @foreach (var item in Model.ArticleTags)
                            {
                                <option value="@item">@item</option>
                            }
                        </select>
                    </div>
                    <button type="button" class="btn btn-primary" id="searchArticles">
                        <i class="fa fa-search"></i> 搜索
                    </button>
                </div>
            </div>

            <div class="table-container">
                <table class="data-table" id="articlesTable">
                    <thead>
                    <tr>
                        <th>标题</th>
                        <th>简介</th>
                        <th>标签</th>
                        <th>查看量</th>
                        <th>评论量</th>
                        <th>发布时间</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody id="articlesTableBody">
                    <!-- 文章数据将在这里动态加载 -->
                    </tbody>
                </table>
            </div>

            <!-- 手机端卡片布局 -->
            <div class="mobile-cards" id="articlesMobileCards">
                <!-- 手机端文章卡片将在这里动态加载 -->
            </div>

            <!-- 分页 -->
            <div class="pagination-container">
                <nav aria-label="文章分页">
                    <ul class="pagination" id="articlesPagination">
                        <!-- 分页将在这里动态生成 -->
                    </ul>
                </nav>
            </div>
        </div>

        <!-- 我的碎碎念页面 -->
        <div class="content-page" id="mumbles-page">
            <div class="page-header">
                <h2><i class="fa fa-comment"></i> 我的碎碎念</h2>
                <button type="button" class="btn btn-primary" id="newMumble">
                    <i class="fa fa-plus"></i> 发布碎碎念
                </button>
            </div>

            <div class="search-section">
                <div class="search-form">
                    <div class="search-group">
                        <input type="text" class="form-control" id="mumbleContentSearch" placeholder="搜索内容">
                    </div>
                    <button type="button" class="btn btn-primary" id="searchMumbles">
                        <i class="fa fa-search"></i> 搜索
                    </button>
                </div>
            </div>

            <div class="table-container">
                <table class="data-table" id="mumblesTable">
                    <thead>
                    <tr>
                        <th>内容</th>
                        <th>点赞数</th>
                        <th>评论数</th>
                        <th>发布时间</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody id="mumblesTableBody">
                    <!-- 碎碎念数据将在这里动态加载 -->
                    </tbody>
                </table>
            </div>

            <!-- 手机端卡片布局 -->
            <div class="mobile-cards" id="mumblesMobileCards">
                <!-- 手机端碎碎念卡片将在这里动态加载 -->
            </div>

            <!-- 分页 -->
            <div class="pagination-container">
                <nav aria-label="碎碎念分页">
                    <ul class="pagination" id="mumblesPagination">
                        <!-- 分页将在这里动态生成 -->
                    </ul>
                </nav>
            </div>
        </div>

        <!-- 我的时间轴页面 -->
        <div class="content-page" id="timeline-page">
            <div class="page-header">
                <h2><i class="fa fa-clock-o"></i> 我的时间轴</h2>
                <button type="button" class="btn btn-primary" id="newTimeline">
                    <i class="fa fa-plus"></i> 发布时间轴
                </button>
            </div>

            <div class="search-section">
                <div class="search-form">
                    <div class="search-group">
                        <input type="text" class="form-control" id="timelineSearch" placeholder="搜索标题/内容">
                    </div>
                    <button type="button" class="btn btn-primary" id="searchTimeline">
                        <i class="fa fa-search"></i> 搜索
                    </button>
                </div>
            </div>

            <div class="table-container">
                <table class="data-table" id="timelineTable">
                    <thead>
                    <tr>
                        <th>标题</th>
                        <th>内容</th>
                        <th>时间轴日期</th>
                        <th>更多链接</th>
                        <th>发布时间</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody id="timelineTableBody">
                    <!-- 时间轴数据将在这里动态加载 -->
                    </tbody>
                </table>
            </div>

            <!-- 手机端卡片布局 -->
            <div class="mobile-cards" id="timelineMobileCards">
                <!-- 手机端时间轴卡片将在这里动态加载 -->
            </div>

            <!-- 分页 -->
            <div class="pagination-container">
                <nav aria-label="时间轴分页">
                    <ul class="pagination" id="timelinePagination">
                        <!-- 分页将在这里动态生成 -->
                    </ul>
                </nav>
            </div>
        </div>

        <!-- 我的相册页面 -->
        <div class="content-page" id="photos-page">
            <div class="page-header">
                <h2><i class="fa fa-image"></i> 我的相册</h2>
                <button type="button" class="btn btn-primary" id="uploadPhoto">
                    <i class="fa fa-plus"></i> 上传照片
                </button>
            </div>

            <div class="search-section">
                <div class="search-form">
                    <div class="search-group">
                        <select class="form-control" id="photoTagSearch">
                            <option value="">所有标签</option>
                            @foreach (var item in Model.PictureTags)
                            {
                                <option value="@item">@item</option>
                            }
                        </select>
                    </div>
                    <div class="search-group">
                        <input type="text" class="form-control" id="photoDescSearch" placeholder="搜索描述">
                    </div>
                    <button type="button" class="btn btn-primary" id="searchPhotos">
                        <i class="fa fa-search"></i> 搜索
                    </button>
                </div>
            </div>

            <div class="photos-grid" id="photosGrid">
                <!-- 照片网格将在这里动态加载 -->
            </div>

            <!-- 手机端相册网格 -->
            <div class="mobile-photos-grid" id="photosMobileGrid">
                <!-- 手机端照片卡片将在这里动态加载 -->
            </div>

            <!-- 分页 -->
            <div class="pagination-container">
                <nav aria-label="相册分页">
                    <ul class="pagination" id="photosPagination">
                        <!-- 分页将在这里动态生成 -->
                    </ul>
                </nav>
            </div>
        </div>
    </div>
</div>

<!-- 发布/编辑模态框 -->
<div class="modal-overlay" id="publishModal" style="display: none;">
    <div class="modal-content large">
        <div class="modal-header">
            <h3 id="modalTitle">发布内容</h3>
            <button type="button" class="close-btn" id="closeModal">
                <i class="fa fa-times"></i>
            </button>
        </div>
        <div class="modal-body" id="modalBody">
            <!-- 动态内容 -->
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-secondary" id="cancelPublish">取消</button>
            <button type="button" class="btn btn-primary" id="confirmPublish">发布</button>
        </div>
    </div>
</div>

<!-- 确认删除模态框 -->
<div class="modal-overlay" id="deleteModal" style="display: none;">
    <div class="modal-content">
        <div class="modal-header">
            <h3>确认删除</h3>
            <button type="button" class="close-btn" id="closeDeleteModal">
                <i class="fa fa-times"></i>
            </button>
        </div>
        <div class="modal-body">
            <p>确定要删除这个项目吗?此操作无法撤销。</p>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-secondary" id="cancelDelete">取消</button>
            <button type="button" class="btn btn-danger" id="confirmDelete">确认删除</button>
        </div>
    </div>
</div>

<!-- 加载提示 -->
<div class="loading-overlay" id="loadingOverlay" style="display: none;">
    <div class="loading-spinner">
        <i class="fa fa-spinner fa-spin"></i>
        <p>加载中...</p>
    </div>
</div>

<script src="@baseAddress/lib/jquery/jquery.min.js"></script>
<script src="@baseAddress/../library/cherry-markdown/cherry-markdown.min.js"></script>
<script src="@baseAddress/lib/moment/moment.min.js?version=2.29.1"></script>
<script src="@baseAddress/lib/moment/moment-with-locales.min.js?version=2.29.1"></script>
<script src="@baseAddress/lib/showdown/showdown.min.js"></script>
<script src="@baseAddress/../library/prism/prism.js"></script>
<environment include="Development">
    <script src="@scriptsAddress/member.js?_t=@version"></script>
</environment>
<environment exclude="Development">
    <script src="@scriptsAddress/member.min.js?_t=@Program.Version"></script>
</environment>
</body>
</html> 
loading