kkc-go/file/static/NavigationBar.tmpl

<script src="/api/static/js/handler.js"></script>
<div class="nav-top"></div>
<div class="navigation-bar">
    <div class="nav-body">
        <div class="nav-logo">
            <img src="/api/static/image/logo.png" alt="logo" onclick="JumpRouter('/','')"/>
        </div>
        <div class="nav-search">
            <form action="/search" target="_blank" name="form">
                <div class="nav-search-div">
                    <input class="search-input" type="text" name="key" placeholder="搜索商品名称"/>
                </div>
                <!--          点击-->
                <div class="search-btn" onclick="form.submit();">
                    <div class="search-btn-icon">
                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" data-v-6fbb019e="">
                            <path fill="currentColor"
                                  d="m795.904 750.72 124.992 124.928a32 32 0 0 1-45.248 45.248L750.656 795.904a416 416 0 1 1 45.248-45.248zM480 832a352 352 0 1 0 0-704 352 352 0 0 0 0 704"></path>
                        </svg>
                    </div>
                </div>
            </form>
        </div>
        <div class="nav-user">
            <div class="nav-user-icon" onclick="clickAvatar()">
                <div class="nav-user-icon-bg">
                    <svg id="not-login" style="width: 24px;height: 24px"
                         xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024">
                        <path fill="currentColor"
                              d="M512 512a192 192 0 1 0 0-384 192 192 0 0 0 0 384m0 64a256 256 0 1 1 0-512 256 256 0 0 1 0 512m320 320v-96a96 96 0 0 0-96-96H288a96 96 0 0 0-96 96v96a32 32 0 1 1-64 0v-96a160 160 0 0 1 160-160h448a160 160 0 0 1 160 160v96a32 32 0 1 1-64 0"></path>
                    </svg>
                    <img id="logged-in" style="display: none" alt="6"/>
                </div>
                <span id="login-name">登录</span>
            </div>
            <div class="login-body" id="login-body" style="display: none">
                <div class="login-center" id="login-center" style="display: none">
                    <div class="login-content">
                        <div class="login-image"></div>
                        <form>
                            <div class="login-from">
                                <div class="login-select">
                                    <div class="login-select-item select-item" id="phone-tab">
                                        <span>手机号登录</span>
                                    </div>
                                    <div class="login-select-item select-item" id="email-tab">
                                        <span>邮箱登录</span>
                                    </div>
                                    <div class="login-select-item select-item" id="wx-tab">
                                        <span>微信扫码登录</span>
                                    </div>
                                    <div class="select-item2" id="select-bar"></div>
                                </div>

                                <div class="login-type-phone" id="phone-section">
                                    <div class="login-phone">
                                        <div class="login-phone-input">
                                            <input name="username" id="phone-input" autocomplete="off"
                                                   placeholder="手机号码"/>
                                        </div>
                                    </div>
                                    <div class="login-phone-code">
                                        <div class="login-phone-code-input">
                                            <input name="password" id="phone-code-input" autocomplete="off"
                                                   placeholder="验证码"/>
                                        </div>
                                        <div class="login-phone-code-btn" id="send-code-btn">发送验证码</div>
                                    </div>
                                    <div class="login-btn" id="phone-login-btn">
                                        <div class="login-btn-div">登录</div>
                                    </div>
                                </div>

                                <div class="login-type-email" id="email-section">
                                    <div class="login-email">
                                        <div class="login-email-input">
                                            <input name="username" id="email-input" autocomplete="off"
                                                   placeholder="邮箱"/>
                                        </div>
                                        <div class="login-email-input">
                                            <input name="password" id="email-password-input" autocomplete="off"
                                                   type="password" placeholder="密码"/>
                                        </div>
                                    </div>
                                    <div class="login-btn" id="email-login-btn">
                                        <div class="login-btn-div">登录</div>
                                    </div>
                                </div>

                                <div class="login-type-wx" id="wx-section">
                                    <div class="login-wx-refresh" id="refresh-wx-code">
                                        <div class="login-wx-refresh-icon">
                                            <span>刷新二维码</span>
                                        </div>
                                    </div>
                                    <div class="login-wx-tip">
                                        <span>微信登录</span>
                                    </div>
                                    <div class="login-wx-image"></div>
                                    <div class="login-wx-tip">
                                        <span>请使用微信扫码登录</span>
                                    </div>
                                </div>

                                <span class="login-register-btn" onclick="openLoginBody('register')">注册</span>
                            </div>
                        </form>
                    </div>
                </div>
                <div id="register-center" class="register-center" style="display: none">
                    <div class="register-content" >
                        <form>
                            <div class="register-content-title">
                                注册
                            </div>
                            <div class="register-content-input">
                                <label>
                                    <input name="username" id="username" placeholder="请输入邮箱" type="text"/>
                                </label>
                            </div>
                            <div class="register-content-input">
                                <label>
                                    <input name="password" id="password" type="password" placeholder="请输入密码"/>
                                </label>
                            </div>
                            <div class="register-content-input">
                                <label>
                                    <input name="requirePassword" id="requirePassword" type="password"
                                           placeholder="请输入密码"/>
                                </label>
                            </div>
                            <div class="register-content-input">
                                <label>
                                    <input name="phone" id="phone" placeholder="请输入手机号" type="text"/>
                                </label>
                            </div>
                            <div class="register-content-code">
                                <div class="register-content-code-input">
                                    <label>
                                        <input name="username" id="code" placeholder="请输入验证码" type="text"/>
                                    </label>
                                </div>
                                <div class="register-content-code-btn" id="send-register-code">
                                    发送验证码
                                </div>
                            </div>
                            <div class="register-content-submit" id="register-btn">
                                注册
                            </div>
                        </form>
                    </div>
                </div>
                <div class="login-body-shield" onclick="closeLoginBody()"></div>
            </div>
        </div>
    </div>
</div>