Home Explore Help
Register Sign In
LiuQin
/
CinemaDemo
3
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

用户界面头像使用dropdown；增加空的用户会员界面；微调common和bootstrap部分样式

lt14 7 years ago
parent
b73c028c48
commit
586c351920
9 changed files with 101 additions and 32 deletions
Split View Show Diff Stats
  1. 5 0
      src/main/java/com/example/cinema/controller/ViewController.java
  2. 1 1
      src/main/resources/static/css/bootstrap.css
  3. 1 0
      src/main/resources/static/css/common.css
  4. 2 3
      src/main/resources/static/js/request.js
  5. 11 6
      src/main/resources/templates/userBuy.html
  6. 12 7
      src/main/resources/templates/userHome.html
  7. 43 0
      src/main/resources/templates/userMember.html
  8. 14 9
      src/main/resources/templates/userMovie.html
  9. 12 6
      src/main/resources/templates/userMovieDetail.html

+ 5 - 0
src/main/java/com/example/cinema/controller/ViewController.java
View File 

@@ -67,4 +67,9 @@ public class ViewController {
 
     public String getUserBuy() {
 
         return "userBuy";
 
     }
 
+
 
+    @RequestMapping(value = "/user/member")
 
+    public String getUserMember() {
 
+        return "userMember";
 
+    }
 
 }

+ 1 - 1
src/main/resources/static/css/bootstrap.css
View File 

@@ -3530,7 +3530,7 @@ tbody.collapse.in {
 
   z-index: 1000;
 
   display: none;
 
   float: left;
 
-  min-width: 160px;
 
+  min-width: 110px;
 
   padding: 5px 0;
 
   margin: 2px 0 0;
 
   list-style: none;

+ 1 - 0
src/main/resources/static/css/common.css
View File 

@@ -104,6 +104,7 @@ ul {
 
     border-top: 1px solid #ccc;
 
 }
 
 .nav-user-container {
 
+    padding: 0px 5px 0px 5px;
 
     text-align: center;
 
     color: #fff;
 
 }

+ 2 - 3
src/main/resources/static/js/request.js
View File 

@@ -32,15 +32,14 @@ $(document).ready(function () {
 
     }, true);
 
 
     $('.avatar-lg').attr('title','退出登录');
 
-    $('.avatar-sm').attr('title','退出登录');
 
+    $('#logout').attr('title','退出登录');
 
 
     $('.avatar-lg').click(function () {
 
         confirm('确认要退出登录吗？') && postRequest('/logout',null,function (res) {
 
             window.location.href='/index';
 
         });
 
     });
 
-
 
-    $('.avatar-sm').click(function () {
 
+    $('#logout').click(function () {
 
         confirm('确认要退出登录吗？') && postRequest('/logout',null,function (res) {
 
              window.location.href='/index';
 
         });

+ 11 - 6
src/main/resources/templates/userBuy.html
View File 

@@ -3,14 +3,13 @@
 
 <head>
 
     <meta charset="UTF-8">
 
     <title>购票</title>
 
-    <!-- 引入css样式文件 -->
 
-    <link rel="stylesheet" type="text/css" href="/css/common.css"/>
 
-
 
     <!-- Bootstrap 核心 CSS 文件 -->
 
     <link rel="stylesheet" type="text/css" href="/css/bootstrap.css"/>
 
     <!-- font-asesome图标库 -->
 
     <link rel="stylesheet" type="text/css" href="/css/font-awesome.min.css"/>
 
 
+    <!-- 引入css样式文件 -->
 
+    <link rel="stylesheet" type="text/css" href="/css/common.css"/>
 
 
     <!-- 引入js脚本文件 -->
 
     <!-- jquery -->
 
@@ -28,9 +27,15 @@
 
         <li role="presentation"><a href="/user/movie">电影</a></li>
 
         <li role="presentation"><a href="#">购票</a></li>
 
     </ul>
 
-    <div class="nav-user-container">
 
-        <img class="avatar-sm" src="/images/defaultAvatar.jpg" />
 
-        <span class="gray-text" style="vertical-align: middle">用户A</span>
 
+    <div class="btn-group">
 
+        <button class="nav-user-container btn dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
+            <img class="avatar-sm" src="/images/defaultAvatar.jpg" />
 
+            <span class="gray-text" style="vertical-align: middle">用户A&nbsp;<span class="caret"></span></span>
 
+        </button>
 
+        <ul class="dropdown-menu">
 
+            <li><a href="/user/member">会员信息</a></li>
 
+            <li id="logout"><a href="#">登出</a></li>
 
+        </ul>
 
     </div>
 
 </div>
 
 暂时没内容，点击导航 ' 电影 ' 看看吧

+ 12 - 7
src/main/resources/templates/userHome.html
View File 

@@ -3,15 +3,14 @@
 
 <head>
 
     <meta charset="UTF-8">
 
     <title>电影</title>
 
-    <!-- 引入css样式文件 -->
 
-    <link rel="stylesheet" type="text/css" href="/css/common.css"/>
 
-    <link rel="stylesheet" type="text/css" href="/css/userHome.css"/>
 
-
 
     <!-- Bootstrap 核心 CSS 文件 -->
 
     <link rel="stylesheet" type="text/css" href="/css/bootstrap.css"/>
 
     <!-- font-asesome图标库 -->
 
     <link rel="stylesheet" type="text/css" href="/css/font-awesome.min.css"/>
 
 
+    <!-- 引入css样式文件 -->
 
+    <link rel="stylesheet" type="text/css" href="/css/common.css"/>
 
+    <link rel="stylesheet" type="text/css" href="/css/userHome.css"/>
 
 
     <!-- 引入js脚本文件 -->
 
     <!-- jquery -->
 
@@ -30,9 +29,15 @@
 
             <li role="presentation"><a href="/user/movie">电影</a></li>
 
             <li role="presentation"><a href="/user/buy">购票</a></li>
 
         </ul>
 
-        <div class="nav-user-container">
 
-            <img class="avatar-sm" src="/images/defaultAvatar.jpg" />
 
-            <span class="gray-text" style="vertical-align: middle">用户A</span>
 
+        <div class="btn-group">
 
+            <button class="nav-user-container btn dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
+                <img class="avatar-sm" src="/images/defaultAvatar.jpg" />
 
+                <span class="gray-text" style="vertical-align: middle">用户A&nbsp;<span class="caret"></span></span>
 
+            </button>
 
+            <ul class="dropdown-menu">
 
+                <li><a href="/user/member">会员信息</a></li>
 
+                <li id="logout"><a href="#">登出</a></li>
 
+            </ul>
 
         </div>
 
     </div>
 
     暂时没内容，点击导航 ' 电影 ' 看看吧

+ 43 - 0
src/main/resources/templates/userMember.html
View File 

@@ -0,0 +1,43 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <title>购票</title>
 
+    <!-- Bootstrap 核心 CSS 文件 -->
 
+    <link rel="stylesheet" type="text/css" href="/css/bootstrap.css"/>
 
+    <!-- font-asesome图标库 -->
 
+    <link rel="stylesheet" type="text/css" href="/css/font-awesome.min.css"/>
 
+
 
+    <!-- 引入css样式文件 -->
 
+    <link rel="stylesheet" type="text/css" href="/css/common.css"/>
 
+
 
+    <!-- 引入js脚本文件 -->
 
+    <!-- jquery -->
 
+    <script src="/js/jquery.js"></script>
 
+    <!-- Bootstrap 核心 JavaScript 文件 -->
 
+    <script src="/js/bootstrap.js"></script>
 
+    <script src="/js/request.js"></script>
 
+
 
+</head>
 
+<body>
 
+<div class="nav-top-container">
 
+    <div class="nav-logo title">NJU-Se电影购票系统</div>
 
+    <ul class="nav nav-pills">
 
+        <li role="presentation"><a href="/user/home">首页</a></li>
 
+        <li role="presentation"><a href="/user/movie">电影</a></li>
 
+        <li role="presentation"><a href="/user/buy">购票</a></li>
 
+    </ul>
 
+    <div class="btn-group">
 
+        <button class="nav-user-container btn dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
+            <img class="avatar-sm" src="/images/defaultAvatar.jpg" />
 
+            <span class="gray-text" style="vertical-align: middle">用户A&nbsp;<span class="caret"></span></span>
 
+        </button>
 
+        <ul class="dropdown-menu">
 
+            <li><a href="#">会员信息</a></li>
 
+            <li id="logout"><a href="#">登出</a></li>
 
+        </ul>
 
+    </div>
 
+</div>
 
+暂时没内容，点击导航 ' 电影 ' 看看吧
 
+</body>
 
+</html>

+ 14 - 9
src/main/resources/templates/userMovie.html
View File 

@@ -3,17 +3,16 @@
 
 <head>
 
     <meta charset="UTF-8">
 
     <title>电影</title>
 
-    <!-- 引入css样式文件 -->
 
-    <link rel="stylesheet" type="text/css" href="/css/common.css"/>
 
-    <link rel="stylesheet" type="text/css" href="/css/movieList.css"/>
 
-    <link rel="stylesheet" type="text/css" href="/css/userMovie.css"/>
 
-
 
-
 
     <!-- Bootstrap 核心 CSS 文件 -->
 
     <link rel="stylesheet" type="text/css" href="/css/bootstrap.css"/>
 
     <!-- font-asesome图标库 -->
 
     <link rel="stylesheet" type="text/css" href="/css/font-awesome.min.css"/>
 
 
+    <!-- 引入css样式文件 -->
 
+    <link rel="stylesheet" type="text/css" href="/css/common.css"/>
 
+    <link rel="stylesheet" type="text/css" href="/css/movieList.css"/>
 
+    <link rel="stylesheet" type="text/css" href="/css/userMovie.css"/>
 
+
 
     <!-- 引入js脚本文件 -->
 
     <!-- jquery -->
 
     <script src="/js/jquery.js"></script>
 
@@ -30,9 +29,15 @@
 
             <li role="presentation" class="active"><a href="#">电影</a></li>
 
             <li role="presentation"><a href="/user/buy">购票</a></li>
 
         </ul>
 
-        <div class="nav-user-container">
 
-            <img class="avatar-sm" src="/images/defaultAvatar.jpg" />
 
-            <span class="gray-text" style="vertical-align: middle">用户A</span>
 
+        <div class="btn-group">
 
+            <button class="nav-user-container btn dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
+                <img class="avatar-sm" src="/images/defaultAvatar.jpg" />
 
+                <span class="gray-text" style="vertical-align: middle">用户A&nbsp;<span class="caret"></span></span>
 
+            </button>
 
+            <ul class="dropdown-menu">
 
+                <li><a href="/user/member">会员信息</a></li>
 
+                <li id="logout"><a href="#">登出</a></li>
 
+            </ul>
 
         </div>
 
     </div>
 
     <div class="content-container">

+ 12 - 6
src/main/resources/templates/userMovieDetail.html
View File 

@@ -3,14 +3,14 @@
 
 <head>
 
     <meta charset="UTF-8">
 
     <title>电影详情</title>
 
-    <!-- 引入css样式文件 -->
 
-    <link rel="stylesheet" type="text/css" href="/css/common.css"/>
 
-    <link rel="stylesheet" type="text/css" href="/css/movieDetail.css"/>
 
     <!-- Bootstrap 核心 CSS 文件 -->
 
     <link rel="stylesheet" type="text/css" href="/css/bootstrap.css"/>
 
     <!-- font-asesome图标库 -->
 
     <link rel="stylesheet" type="text/css" href="/css/font-awesome.min.css"/>
 
 
+    <!-- 引入css样式文件 -->
 
+    <link rel="stylesheet" type="text/css" href="/css/common.css"/>
 
+    <link rel="stylesheet" type="text/css" href="/css/movieDetail.css"/>
 
 
     <!-- 引入js脚本文件 -->
 
     <!-- jquery -->
 
@@ -28,9 +28,15 @@
 
             <li role="presentation" class="active"><a href="/user/movie">电影</a></li>
 
             <li role="presentation"><a href="/user/buy">购票</a></li>
 
         </ul>
 
-        <div class="nav-user-container">
 
-            <img class="avatar-sm" src="/images/defaultAvatar.jpg" />
 
-            <span class="gray-text" style="vertical-align: middle">用户A</span>
 
+        <div class="btn-group">
 
+            <button class="nav-user-container btn dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
+                <img class="avatar-sm" src="/images/defaultAvatar.jpg" />
 
+                <span class="gray-text" style="vertical-align: middle">用户A&nbsp;<span class="caret"></span></span>
 
+            </button>
 
+            <ul class="dropdown-menu">
 
+                <li><a href="/user/member">会员信息</a></li>
 
+                <li id="logout"><a href="#">登出</a></li>
 
+            </ul>
 
         </div>
 
     </div>
 
     <div class="content-container">