xhkjedu
/
xh_web_admin
Vērot 6
Pievienot zvaigznīti 0
Atdalīts 0
Kods Problēmas 0 Izmaiņu pieprasījumi 0 Laidieni 0 Vikivietne Aktivitāte
Pārlūkot izejas kodu

登录、用户管理

gzb
wangzhonglu pirms 1 gada
vecāks
5e05a76da3
revīzija
b840fa93de
13 mainītis faili ar 9948 papildinājumiem un 9 dzēšanām
Dalītais skats Rādīt salīdzināšanas statistiku
  1. 45
    0
      css/comm.css
  2. 46
    2
      index.html
  3. 0
    1
      js/index.js
  4. 6834
    0
      librarys/bootstrap@3.4.1/bootstrap.css
  5. 2580
    0
      librarys/bootstrap@3.4.1/bootstrap.js
  6. 0
    0
      sections/history.html
  7. 134
    0
      sections/login.html
  8. 0
    0
      sections/news.html
  9. 0
    0
      sections/school.html
  10. 0
    0
      sections/service.html
  11. 0
    0
      sections/trial.html
  12. 275
    0
      sections/user.html
  13. 34
    6
      utils/index.js

+ 45
- 0
css/comm.css Parādīt failu 

@@ -0,0 +1,45 @@
1 
+html,
2 
+body {
3 
+  margin: 0;
4 
+  padding: 0;
5 
+  user-select: none;
6 
+}
7 
+.my_theme_color {
8 
+  color: #2d8cf0;
9 
+}
10 
+.my_theme_bg {
11 
+  background-color: #2d8cf0;
12 
+}
13 
+.del_color {
14 
+  color: #ff001e;
15 
+}
16 
+.tip_modal {
17 
+  width: 400px;
18 
+}
19 
+.page_box {
20 
+  margin: 0 auto;
21 
+  margin-top: 16px;
22 
+  text-align: right;
23 
+}
24 
+.page_box > div {
25 
+  display: inline-block;
26 
+  margin-left: 6px;
27 
+  width: 30px;
28 
+  line-height: 30px;
29 
+  color: #666;
30 
+  text-align: center;
31 
+  border-radius: 4px;
32 
+  border: 1px solid #ccc;
33 
+  background-color: #fff;
34 
+  cursor: pointer;
35 
+}
36 
+.page_box .page_num:hover,
37 
+.page_box .page_num.selected {
38 
+  color: #fff;
39 
+  border: 1px solid #2d8cf0;
40 
+  background-color: #2d8cf0;
41 
+}
42 
+.page_box .page_prev.disabled,
43 
+.page_box .page_next.disabled {
44 
+  cursor: not-allowed;
45 
+}

+ 46
- 2
index.html Parādīt failu 

@@ -6,11 +6,55 @@
6 6 
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
7 7 
     <title>河南星火燎原软件科技有限公司</title>
8 8 
     <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon" />
9 
+    <link rel="stylesheet" href="./librarys/bootstrap@3.4.1/bootstrap.css" />
9 10 
     <link rel="stylesheet" href="./css/comm.css" />
10 
-    <link rel="stylesheet" href="./css/index.css" />
11 
+    <style>
12 
+      body {
13 
+        background-color: #fff;
14 
+      }
15 
+      .main_box {
16 
+        margin: 0 auto;
17 
+        margin-top: 150px;
18 
+        width: 1000px;
19 
+      }
20 
+      .main_box .main_item {
21 
+        display: inline-block;
22 
+        margin: 0 10px;
23 
+        width: calc(16% - 20px);
24 
+        border: 1px solid #999;
25 
+        box-shadow: 0 1px 6px #e8eaec;
26 
+        border-radius: 4px;
27 
+        line-height: 100px;
28 
+        font-size: 18px;
29 
+        font-weight: bold;
30 
+        text-align: center;
31 
+        border-color: #fff;
32 
+        cursor: pointer;
33 
+      }
34 
+    </style>
11 35 
   </head>
12 36 
   <body>
37 
+    <div class="main_box">
38 
+      <div class="main_item" data-url="user">用户信息</div>
39 
+      <div class="main_item" data-url="history">发展历程</div>
40 
+      <div class="main_item" data-url="service">服务案例</div>
41 
+      <div class="main_item" data-url="school">学校图标</div>
42 
+      <div class="main_item" data-url="trial">申请试用</div>
43 
+      <div class="main_item" data-url="news">新闻资讯</div>
44 
+    </div>
13 45 
     <script src="./librarys/jquery@1.12.4/jquery.min.js"></script>
14 
-    <script src="./js/index.js"></script>
46 
+    <script src="./utils/index.js"></script>
47 
+    <script>
48 
+      $(function () {
49 
+        if (!$.isLogin()) {
50 
+          window.location.href = "/sections/login.html";
51 
+          return;
52 
+        }
53 
+        $(".main_box").on("click", ".main_item", function () {
54 
+          let _url = $(this).data("url");
55 
+          window.location.href = "/sections/" + _url + ".html";
56 
+        });
57 
+      });
58 
+    </script>
15 59 
   </body>
16 60 
 </html>

+ 0
- 1
js/index.js Parādīt failu 

@@ -1 +0,0 @@
1 
-$(function () {});

+ 6834
- 0
librarys/bootstrap@3.4.1/bootstrap.css
Failā izmaiņas netiks attēlotas, jo tās ir par lielu
Parādīt failu


+ 2580
- 0
librarys/bootstrap@3.4.1/bootstrap.js
Failā izmaiņas netiks attēlotas, jo tās ir par lielu
Parādīt failu


css/index.css → sections/history.html Parādīt failu


+ 134
- 0
sections/login.html Parādīt failu 

@@ -0,0 +1,134 @@
1 
+<!DOCTYPE html>
2 
+<html lang="zh-cn">
3 
+  <head>
4 
+    <meta charset="UTF-8" />
5 
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
6 
+    <meta
7 
+      name="viewport"
8 
+      content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
9 
+    />
10 
+    <title>河南星火燎原软件科技有限公司</title>
11 
+    <link rel="shortcut icon" href="../favicon.ico" type="image/x-icon" />
12 
+    <link rel="stylesheet" href="../librarys/bootstrap@3.4.1/bootstrap.css" />
13 
+    <link rel="stylesheet" href="../css/comm.css" />
14 
+    <style>
15 
+      .loginFormBox {
16 
+        position: relative;
17 
+        margin: 0 auto;
18 
+        padding-top: 150px;
19 
+        width: 400px;
20 
+      }
21 
+    </style>
22 
+  </head>
23 
+  <body>
24 
+    <div class="loginFormBox">
25 
+      <form class="form-horizontal">
26 
+        <div class="form-group">
27 
+          <label for="inputLoginname" class="col-xs-2 control-label"
28 
+            >账号</label
29 
+          >
30 
+          <div class="col-xs-10">
31 
+            <input
32 
+              type="text"
33 
+              id="inputLoginname"
34 
+              class="form-control"
35 
+              placeholder="请输入账号"
36 
+            />
37 
+          </div>
38 
+        </div>
39 
+        <div class="form-group">
40 
+          <label for="inputPassword" class="col-xs-2 control-label">密码</label>
41 
+          <div class="col-xs-10">
42 
+            <input
43 
+              type="password"
44 
+              id="inputPassword"
45 
+              class="form-control"
46 
+              placeholder="请输入密码"
47 
+            />
48 
+          </div>
49 
+        </div>
50 
+        <div class="form-group">
51 
+          <div class="col-xs-offset-2 col-xs-10">
52 
+            <div class="checkbox">
53 
+              <label>
54 
+                <input
55 
+                  type="checkbox"
56 
+                  id="rememberInput"
57 
+                  checked
58 
+                />记住密码</label
59 
+              >
60 
+            </div>
61 
+          </div>
62 
+        </div>
63 
+        <div class="form-group">
64 
+          <div class="col-xs-offset-4 col-xs-10">
65 
+            <div class="btn btn-primary col-xs-4 my_theme_bg" id="loginBtn">登录</div>
66 
+          </div>
67 
+        </div>
68 
+      </form>
69 
+    </div>
70 
+    <script src="../librarys/jquery@1.12.4/jquery.min.js"></script>
71 
+    <script src="../utils/index.js"></script>
72 
+    <script>
73 
+      $(function () {
74 
+        let loginInfo = JSON.parse(localStorage.getItem("loginInfo"));
75 
+        if (loginInfo && $("#rememberInput").attr("checked")) {
76 
+          $("#inputLoginname").val(loginInfo.loginname);
77 
+          $("#inputPassword").val(loginInfo.loginpwd);
78 
+        }
79 
+        $("#rememberInput").click(function () {
80 
+          $("#rememberInput").attr(
81 
+            "checked",
82 
+            !$("#rememberInput").attr("checked")
83 
+          );
84 
+        });
85 
+        $("#loginBtn").click(function () {
86 
+          let inputLoginname = $("#inputLoginname").val();
87 
+          let inputPassword = $("#inputPassword").val();
88 
+          let rememberInput = $("#rememberInput").attr("checked");
89 
+          if (!inputLoginname) {
90 
+            alert("账号不能为空");
91 
+            return;
92 
+          }
93 
+          if (inputLoginname.length < 4 || inputLoginname.length > 18) {
94 
+            alert("账号长度为4~18个字符");
95 
+            return;
96 
+          }
97 
+          if (!inputPassword) {
98 
+            alert("密码不能为空");
99 
+            return;
100 
+          }
101 
+          if (inputPassword.length < 4 || inputPassword.length > 18) {
102 
+            alert("密码长度为6~16个字符");
103 
+            return;
104 
+          }
105 
+          let _url = $.baseUrl + "user/login";
106 
+          $.ajax({
107 
+            type: "POST",
108 
+            url: _url,
109 
+            dataType: "json",
110 
+            contentType: "application/json; charset=utf-8",
111 
+            data: JSON.stringify({
112 
+              loginname: inputLoginname,
113 
+              loginpwd: inputPassword
114 
+            }),
115 
+            success: function (data) {
116 
+              if (data.code === 0) {
117 
+                if (rememberInput) {
118 
+                  localStorage.setItem("loginInfo", JSON.stringify({
119 
+                    loginname: inputLoginname,
120 
+                    loginpwd: inputPassword
121 
+                  }));
122 
+                }
123 
+                localStorage.setItem("xhWebAdminUser", JSON.stringify(data.obj));
124 
+                window.location.href = "/index.html";
125 
+              } else {
126 
+                alert(data.msg);
127 
+              }
128 
+            },
129 
+          });
130 
+        });
131 
+      });
132 
+    </script>
133 
+  </body>
134 
+</html>

+ 0
- 0
sections/news.html Parādīt failu


+ 0
- 0
sections/school.html Parādīt failu


+ 0
- 0
sections/service.html Parādīt failu


+ 0
- 0
sections/trial.html Parādīt failu


+ 275
- 0
sections/user.html Parādīt failu 

@@ -0,0 +1,275 @@
1 
+<!DOCTYPE html>
2 
+<html lang="zh-cn">
3 
+  <head>
4 
+    <meta charset="UTF-8" />
5 
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
6 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
7 
+    <title>河南星火燎原软件科技有限公司</title>
8 
+    <link rel="shortcut icon" href="../favicon.ico" type="image/x-icon" />
9 
+    <link rel="stylesheet" href="../librarys/bootstrap@3.4.1/bootstrap.css" />
10 
+    <link rel="stylesheet" href="../css/comm.css" />
11 
+    <style>
12 
+      body {
13 
+        background-color: #fff;
14 
+      }
15 
+      .user_main {
16 
+        margin: 0 auto;
17 
+        margin-top: 50px;
18 
+        width: 1000px;
19 
+      }
20 
+      .user_main .table.table-bordered th {
21 
+        text-align: center;
22 
+        background-color: #f7f7f7;
23 
+      }
24 
+      .user_main .table.table-bordered td {
25 
+        text-align: center;
26 
+        background-color: #fff;
27 
+      }
28 
+      .user_main .table.table-bordered .action_btn {
29 
+        margin: 0 10px;
30 
+        cursor: pointer;
31 
+      }
32 
+      .user_main .table.table-bordered .action_show {
33 
+        display: block;
34 
+      }
35 
+      .user_main .table.table-bordered .action_hide {
36 
+        display: none;
37 
+      }
38 
+    </style>
39 
+  </head>
40 
+  <body>
41 
+    <div class="user_main">
42 
+      <table class="table table-bordered">
43 
+        <thead>
44 
+          <tr>
45 
+            <th>序号</th>
46 
+            <th>用户姓名</th>
47 
+            <th>登录账户</th>
48 
+            <th style="width: 110px">手机号</th>
49 
+            <th style="width: 70px">状态</th>
50 
+            <th>创建人姓名</th>
51 
+            <th style="width: 160px">创建时间</th>
52 
+            <th style="width: 140px">操作</th>
53 
+          </tr>
54 
+        </thead>
55 
+        <tbody class="userTableBody"></tbody>
56 
+      </table>
57 
+      <div class="user_page page_box">
58 
+        <!-- <div class="page_prev disabled">&lt;</div>
59 
+        <div data-page="1" class="page_num selected">1</div>
60 
+        <div class="page_num">2</div>
61 
+        <div class="page_next">&gt;</div> -->
62 
+      </div>
63 
+    </div>
64 
+    <!-- 修改用户弹窗 -->
65 
+    <div
66 
+      class="modal fade"
67 
+      id="userModifyModal"
68 
+      tabindex="-1"
69 
+      role="dialog"
70 
+      aria-labelledby="modifyTitle"
71 
+    >
72 
+      <div class="modal-dialog" role="document">
73 
+        <div class="modal-content">
74 
+          <div class="modal-header">
75 
+            <button
76 
+              type="button"
77 
+              class="close"
78 
+              data-dismiss="modal"
79 
+              aria-label="Close"
80 
+            >
81 
+              <span aria-hidden="true">&times;</span>
82 
+            </button>
83 
+            <h4 class="modal-title" id="modifyTitle">修改用户信息</h4>
84 
+          </div>
85 
+          <div class="modal-body">确定删除选中信息？</div>
86 
+          <div class="modal-footer">
87 
+            <div type="button" class="btn btn-default" data-dismiss="modal">
88 
+              关闭
89 
+            </div>
90 
+            <div type="button" class="btn btn-primary modify_save">保存</div>
91 
+          </div>
92 
+        </div>
93 
+      </div>
94 
+    </div>
95 
+    <!-- 删除用户弹窗 -->
96 
+    <div
97 
+      class="modal fade"
98 
+      id="userDelModal"
99 
+      tabindex="-1"
100 
+      role="dialog"
101 
+      aria-labelledby="delTitle"
102 
+    >
103 
+      <div class="modal-dialog tip_modal" role="document">
104 
+        <div class="modal-content">
105 
+          <div class="modal-header">
106 
+            <button
107 
+              type="button"
108 
+              class="close"
109 
+              data-dismiss="modal"
110 
+              aria-label="Close"
111 
+            >
112 
+              <span aria-hidden="true">&times;</span>
113 
+            </button>
114 
+            <h4 class="modal-title" id="delTitle">提示</h4>
115 
+          </div>
116 
+          <div class="modal-body">确定删除选中信息？</div>
117 
+          <div class="modal-footer">
118 
+            <div type="button" class="btn btn-default" data-dismiss="modal">
119 
+              关闭
120 
+            </div>
121 
+            <div type="button" class="btn btn-primary del_save">保存</div>
122 
+          </div>
123 
+        </div>
124 
+      </div>
125 
+    </div>
126 
+    <script src="../librarys/jquery@1.12.4/jquery.min.js"></script>
127 
+    <script src="../librarys/bootstrap@3.4.1/bootstrap.js"></script>
128 
+    <script src="../utils/index.js"></script>
129 
+    <script>
130 
+      $(function () {
131 
+        if (!$.isLogin()) {
132 
+          window.location.href = "/sections/login.html";
133 
+          return;
134 
+        }
135 
+        let userSearch = {
136 
+          page: 1,
137 
+          size: 10,
138 
+          userstate: 1,
139 
+          username: "",
140 
+          total: 0,
141 
+          list: [],
142 
+        };
143 
+        // 获取用户列表
144 
+        function getUserList() {
145 
+          $.ajax({
146 
+            type: "POST",
147 
+            url: $.baseUrl + "user/list",
148 
+            dataType: "json",
149 
+            contentType: "application/json; charset=utf-8",
150 
+            data: JSON.stringify({
151 
+              page: userSearch.page,
152 
+              size: userSearch.size,
153 
+              userstate: userSearch.userstate,
154 
+              username: userSearch.username,
155 
+            }),
156 
+            success: function (data) {
157 
+              if (data.code === 0) {
158 
+                userSearch.total = data.obj.total;
159 
+                userSearch.list = data.obj.list;
160 
+                console.log("getUserList", data);
161 
+                setTableHtml();
162 
+                setPageList();
163 
+              } else {
164 
+                userSearch.total = 0;
165 
+                userSearch.list = [];
166 
+                alert(data.msg);
167 
+              }
168 
+            },
169 
+          });
170 
+        }
171 
+        // 设置页码信息
172 
+        function setPageList() {
173 
+          let pageBoxHtml =
174 
+            '<div class="page_prev ' +
175 
+            (userSearch.page === 1 ? "disabled" : "") +
176 
+            '">&lt;</div>';
177 
+          for (
178 
+            let _pageIndex = 0;
179 
+            _pageIndex < Math.ceil(userSearch.total / userSearch.size);
180 
+            _pageIndex++
181 
+          ) {
182 
+            pageBoxHtml +=
183 
+              '<div data-page="' +
184 
+              (_pageIndex + 1) +
185 
+              '" class="page_num ' +
186 
+              (_pageIndex + 1 === userSearch.page ? "selected" : "") +
187 
+              '">' +
188 
+              (_pageIndex + 1) +
189 
+              "</div>";
190 
+          }
191 
+          pageBoxHtml +=
192 
+            '<div class="page_next ' +
193 
+            (userSearch.page === Math.ceil(userSearch.total / userSearch.size)
194 
+              ? "disabled"
195 
+              : "") +
196 
+            '">&gt;</div>';
197 
+          if (userSearch.total > 0) {
198 
+            $(".user_page.page_box").html(pageBoxHtml);
199 
+            $(".user_page.page_box").on("click", ".page_prev", function () {
200 
+              if (userSearch.page > 1) {
201 
+                userSearch.page--;
202 
+              }
203 
+            });
204 
+            $(".user_page.page_box").on("click", ".page_num", function () {});
205 
+            $(".user_page.page_box").on("click", ".page_next", function () {});
206 
+          } else {
207 
+            $(".user_page.page_box").html("");
208 
+          }
209 
+        }
210 
+        // 设置表格信息
211 
+        function setTableHtml() {
212 
+          let userTableBodyHtml = "";
213 
+          $.each(userSearch.list, function (_userIndex, _userItem) {
214 
+            userTableBodyHtml +=
215 
+              "<tr><td>" +
216 
+              (_userIndex + 1 + (userSearch.page - 1) * userSearch.size) +
217 
+              "</td><td>" +
218 
+              (_userItem.username ? _userItem.username : "") +
219 
+              "</td><td>" +
220 
+              _userItem.loginname +
221 
+              "</td><td>" +
222 
+              (_userItem.userphone ? _userItem.userphone : "") +
223 
+              "</td><td>" +
224 
+              (_userItem.userstate === 1 ? "正常" : "已删除") +
225 
+              "</td><td>" +
226 
+              (_userItem.createname ? _userItem.createname : "") +
227 
+              "</td><td>" +
228 
+              $.dateFormat(_userItem.createtime) +
229 
+              '</td><td><div class="' +
230 
+              (_userItem.userstate === 1 ? "action_show" : "action_hide") +
231 
+              '"><span class="my_theme_color action_btn modify_btn" data-userid="' +
232 
+              _userItem.userid +
233 
+              '">修改</span><span class="my_theme_color">|</span><span class="del_color action_btn del_btn" data-userid="' +
234 
+              _userItem.userid +
235 
+              '">删除</span></div></td></tr>';
236 
+          });
237 
+          $(".userTableBody").html(userTableBodyHtml);
238 
+          let modify_userid = null;
239 
+          let del_userid = null;
240 
+          $(".userTableBody").on("click", ".modify_btn", function () {
241 
+            $("#userModifyModal").modal("show");
242 
+            modify_userid = $(this).data("userid");
243 
+          });
244 
+          $("#userModifyModal .modify_save").on("click", function () {
245 
+            console.log("modify_userid", modify_userid);
246 
+          });
247 
+          $(".userTableBody").on("click", ".del_btn", function () {
248 
+            $("#userDelModal").modal("show");
249 
+            del_userid = $(this).data("userid");
250 
+          });
251 
+          $("#userDelModal .del_save").on("click", function () {
252 
+            $.ajax({
253 
+              type: "POST",
254 
+              url: $.baseUrl + "user/del",
255 
+              dataType: "json",
256 
+              contentType: "application/json; charset=utf-8",
257 
+              data: JSON.stringify({
258 
+                userid: del_userid,
259 
+              }),
260 
+              success: function (data) {
261 
+                $("#userDelModal").modal("hide");
262 
+                if (data.code === 0) {
263 
+                  getUserList();
264 
+                } else {
265 
+                  alert(data.msg);
266 
+                }
267 
+              },
268 
+            });
269 
+          });
270 
+        }
271 
+        getUserList();
272 
+      });
273 
+    </script>
274 
+  </body>
275 
+</html>

+ 34
- 6
utils/index.js Parādīt failu 

@@ -1,6 +1,6 @@
1 1 
 jQuery.extend({
2 2 
   baseUrl: "//xhwebapitest.xhkjedu.com/",
3 
-  showImageUrl: "//schoolstatictest.xhkjedu.com/static/",
3 
+  showImageUrl: "//xhwebstatictest.xhkjedu.com/",
4 4 
   //毫秒时间转换为yyyy-MM-dd
5 5 
   msToDateString: function (ms) {
6 6 
     let date = new Date(ms);

@@ -15,17 +15,45 @@ jQuery.extend({
15 15 
     }
16 16 
     return year + "-" + month + "-" + day;
17 17 
   },
18 
+  // 秒时间转换为yyyy-MM-dd HH:mm:ss
19 
+  dateFormat: function(unixtimestamp) {
20 
+    unixtimestamp = new Date(unixtimestamp * 1000);
21 
+    let year = 1900 + unixtimestamp.getYear();
22 
+    let month = "0" + (unixtimestamp.getMonth() + 1);
23 
+    let date = "0" + unixtimestamp.getDate();
24 
+    let hour = "0" + unixtimestamp.getHours();
25 
+    let minute = "0" + unixtimestamp.getMinutes();
26 
+    let second = "0" + unixtimestamp.getSeconds();
27 
+    return (
28 
+      year +
29 
+      "-" +
30 
+      month.substring(month.length - 2, month.length) +
31 
+      "-" +
32 
+      date.substring(date.length - 2, date.length) +
33 
+      " " +
34 
+      hour.substring(hour.length - 2, hour.length) +
35 
+      ":" +
36 
+      minute.substring(minute.length - 2, minute.length) +
37 
+      ":" +
38 
+      second.substring(second.length - 2, second.length)
39 
+    );
40 
+  },
18 41 
   // 读取url参数
19 
-  getQueryVariable: function(variable) {
42 
+  getQueryletiable: function(letiable) {
20 43 
     let query = window.location.search.substring(1);
21 44 
     query = decodeURI(query);
22 
-    let vars = query.split("&");
23 
-    for (let i = 0; i < vars.length; i++) {
24 
-      let pair = vars[i].split("=");
25 
-      if (pair[0] === variable) {
45 
+    let lets = query.split("&");
46 
+    for (let i = 0; i < lets.length; i++) {
47 
+      let pair = lets[i].split("=");
48 
+      if (pair[0] === letiable) {
26 49 
         return pair[1];
27 50 
       }
28 51 
     }
29 52 
     return false;
53 
+  },
54 
+  userInfo: JSON.parse(localStorage.getItem("xhWebAdminUser")) || {},
55 
+  isLogin: function () {
56 
+    let xhWebAdminUser = JSON.parse(localStorage.getItem("xhWebAdminUser"));
57 
+    return xhWebAdminUser ? true : false;
30 58 
   }
31 59 
 });

Rakstīt Priekšskatītījums
Notiek ielāde…
Atcelt
Saglabāt