source: pro-violet-viettel/docs/Space-update-logo/Space/frontend-user_profile.html @ 316

Last change on this file since 316 was 316, checked in by dungnv, 11 years ago
  • Property svn:mime-type set to text/plain
File size: 17.3 KB
Line 
1<!DOCTYPE html>
2<html lang="en">
3        <head>
4                <meta charset="utf-8" />
5                <title>SBG Online</title>
6
7                <meta name="description" content="overview &amp; stats" />
8                <meta name="viewport" content="width=device-width, initial-scale=1.0" />
9
10                <link href="assets/css/bootstrap.min.css" rel="stylesheet" />
11                <link rel="stylesheet" href="assets/css/font-awesome.min.css" />
12
13                <link rel="stylesheet" href="assets/css/ace-fonts.css" />
14
15                <link rel="stylesheet" href="assets/css/ace.min.css" />
16                <link rel="stylesheet" href="assets/css/ace-rtl.min.css" />
17                <link rel="stylesheet" href="assets/css/ace-skins.min.css" />
18
19                <script src="assets/js/ace-extra.min.js"></script>
20
21                <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
22
23                <!--[if lt IE 9]>
24                <script src="assets/js/html5shiv.js"></script>
25                <script src="assets/js/respond.min.js"></script>
26                <![endif]-->
27        </head>
28
29        <body>
30                <div class="navbar navbar-default navbar-fixed-top" id="navbar">
31                        <script type="text/javascript">
32                                try{ace.settings.check('navbar' , 'fixed')}catch(e){}
33                        </script>
34
35                        <div class="navbar-container" id="navbar-container">
36                                <div class="navbar-header pull-left">
37                                        <a href="#" class="navbar-brand">
38                                                <img src="assets/img/logo_soanbai_online_white.png" width="350" class="img-responsive">
39                                        </a><!-- /.brand -->
40                                </div><!-- /.navbar-header -->
41
42                                <div class="navbar-header pull-right" role="navigation">
43                                        <ul class="nav ace-nav">
44                                                <li>
45                                                        <a data-toggle="dropdown" href="#" class="dropdown-toggle">
46                                                                <img class="nav-user-photo" src="assets/avatars/user.jpg" alt="Admin's Photo" />
47                                                                <span class="user-info">
48                                                                        <small>Xin chào,</small>
49                                                                        Admin
50                                                                </span>
51
52                                                                <i class="icon-caret-down"></i>
53                                                        </a>
54
55                                                        <ul class="user-menu pull-right dropdown-menu dropdown-yellow dropdown-caret dropdown-close">
56                                                                <li>
57                                                                        <a href="frontend-user_profile.html">
58                                                                                <i class="icon-user"></i>
59                                                                                ThÃŽng tin cá nhân
60                                                                        </a>
61                                                                </li>
62
63                                                                <li class="divider"></li>
64
65                                                                <li>
66                                                                        <a href="frontend-index.html">
67                                                                                <i class="icon-off"></i>
68                                                                                Thoát
69                                                                        </a>
70                                                                </li>
71                                                        </ul>
72                                                </li>
73                                        </ul><!-- /.ace-nav -->
74                                </div><!-- /.navbar-header -->
75                        </div><!-- /.container -->
76                </div>
77
78                <div class="main-container" id="main-container">
79                        <script type="text/javascript">
80                                try{ace.settings.check('main-container' , 'fixed')}catch(e){}
81                        </script>
82
83                        <div class="main-container-inner">
84                                <a class="menu-toggler" id="menu-toggler" href="#">
85                                        <span class="menu-text"></span>
86                                </a>
87
88                                <div class="sidebar sidebar-fixed" id="sidebar">
89                                        <script type="text/javascript">
90                                                try{ace.settings.check('sidebar' , 'fixed')}catch(e){}
91                                        </script>
92
93                                        <div class="sidebar-shortcuts" id="sidebar-shortcuts">
94                                                <div class="sidebar-shortcuts-large" id="sidebar-shortcuts-large" style="line-height:normal">
95                                                        <div data-percent="66%" class="progress progress-striped active" style="margin-bottom:0">
96                                                                <div style="width:66%;" class="progress-bar"></div>
97                                                        </div>
98                                                        <span>66 GB / 100 GB</span>
99                                                </div>
100
101                                                <div class="sidebar-shortcuts-mini" id="sidebar-shortcuts-mini">
102                                                        <span class="btn btn-success"></span>
103
104                                                        <span class="btn btn-info"></span>
105
106                                                        <span class="btn btn-warning"></span>
107
108                                                        <span class="btn btn-danger"></span>
109                                                </div>
110                                        </div><!-- #sidebar-shortcuts -->
111
112                                        <nav class="navbar navbar-minimal animate open" role="navigation" style="background:transparent">
113                                                <ul class="navbar-menu animate">
114                                                        <li>
115                                                                <a href="#" class="animate">
116                                                                        <span class="desc animate"> Violet Online </span>
117                                                                        <img src="assets/img/logo_Violet.png" width="28" class="img-responsive pull-right">
118                                                                </a>
119                                                        </li>
120                                                        <li>
121                                                                <a href="http://space.violet.vn" class="animate">
122                                                                        <span class="desc animate"> Violet Space </span>
123                                                                        <img src="assets/img/logo_Violet_space_black_box.png" width="28" class="img-responsive pull-right">
124                                                                </a>
125                                                        </li>
126                                                        <li>
127                                                                <a href="#" class="animate">
128                                                                        <span class="desc animate"> Thanh toán </span>
129                                                                        <img src="assets/img/payment.png" width="28" class="img-responsive pull-right">
130                                                                </a>
131                                                        </li>
132                                                        <li>
133                                                                <a href="user_profile.html" class="animate">
134                                                                        <span class="desc animate"> ThÃŽng tin cá nhân </span>
135                                                                        <img src="assets/img/profile.png" width="28" class="img-responsive pull-right">
136                                                                </a>
137                                                        </li>
138                                                </ul>
139                                        </nav>
140
141                                        <ul class="logo-group list-inline">
142                                                <li><img src="assets/img/logo_Violet.png" width="64" class="img-responsive"></li>
143                                                <li><img src="assets/img/logo_viettel.png" width="64" class="img-responsive"></li>
144                                        </ul>
145                                </div>
146
147                               
148
149                                <div class="main-content">
150
151                                        <div class="page-content">
152                                                <div class="page-header">
153                                                        <h1>
154                                                                ThÃŽng tin cá nhân
155                                                                <small>
156                                                                        <i class="icon-double-angle-right"></i>
157                                                                        Admin
158                                                                </small>
159                                                        </h1>
160                                                </div><!-- /.page-header -->
161
162                                                <div class="row">
163                                                        <div class="col-xs-12">
164                                                                <!-- PAGE CONTENT BEGINS -->
165                                                                <div class="user-profile row" id="user-profile-3">
166                                                                        <div class="col-sm-offset-1 col-sm-10">
167
168                                                                                <form class="form-horizontal">
169                                                                                        <div class="tabbable">
170                                                                                                <ul class="nav nav-tabs padding-16">
171                                                                                                        <li class="active">
172                                                                                                                <a href="#edit-basic" data-toggle="tab">
173                                                                                                                        <i class="green icon-edit bigger-125"></i>
174                                                                                                                        ThÃŽng tin cá nhân
175                                                                                                                </a>
176                                                                                                        </li>
177
178                                                                                                        <li>
179                                                                                                                <a href="#edit-password" data-toggle="tab">
180                                                                                                                        <i class="blue icon-key bigger-125"></i>
181                                                                                                                        Đổi mật khẩu
182                                                                                                                </a>
183                                                                                                        </li>
184                                                                                                </ul>
185
186                                                                                                <div class="tab-content profile-edit-tab-content">
187                                                                                                        <div class="tab-pane in active" id="edit-basic">
188                                                                                                                <h4 class="header blue bolder smaller">ThÃŽng tin chung</h4>
189
190                                                                                                                <div class="row">
191                                                                                                                        <div class="col-xs-12 col-sm-4">
192                                                                                                                                <div class="ace-file-input ace-file-multiple"><input type="file"><a href="#" class="remove"><i class="icon-remove"></i></a></div>
193                                                                                                                        </div>
194
195                                                                                                                        <div class="vspace-xs"></div>
196
197                                                                                                                        <div class="col-xs-12 col-sm-8">
198                                                                                                                                <div class="form-group">
199                                                                                                                                        <label for="form-field-username" class="col-sm-4 control-label no-padding-right">Tài khoản</label>
200
201                                                                                                                                        <div class="col-sm-8">
202                                                                                                                                                <input type="text" value="0918273645" placeholder="Tài khoản" id="form-field-username" class="col-xs-12 col-sm-10" disabled>
203                                                                                                                                        </div>
204                                                                                                                                </div>
205
206                                                                                                                                <div class="space-4"></div>
207
208                                                                                                                                <div class="form-group">
209                                                                                                                                        <label for="form-field-first" class="col-sm-4 control-label no-padding-right">Họ và tên</label>
210
211                                                                                                                                        <div class="col-sm-8">
212                                                                                                                                                <input type="text" value="" placeholder="Họ" id="form-field-first" class="input-small">
213                                                                                                                                                <input type="text" value="" placeholder="Tên" id="form-field-last" class="input-small">
214                                                                                                                                        </div>
215                                                                                                                                </div>
216
217                                                                                                                                <div class="space-4"></div>
218
219                                                                                                                                <div class="form-group">
220                                                                                                                                        <label for="form-field-username" class="col-sm-4 control-label no-padding-right">Đơn vị</label>
221
222                                                                                                                                        <div class="col-sm-8">
223                                                                                                                                                <input type="text" placeholder="Đơn vị" id="form-field-username" class="col-xs-12 col-sm-10">
224                                                                                                                                        </div>
225                                                                                                                                </div>
226
227                                                                                                                                <div class="space-4"></div>
228
229                                                                                                                                <div class="form-group">
230                                                                                                                                        <label for="form-field-username" class="col-sm-4 control-label no-padding-right">Số tiền</label>
231
232                                                                                                                                        <div class="col-sm-8">
233                                                                                                                                                <input type="text" placeholder="Số tiền" id="form-field-username" class="col-xs-12 col-sm-10">
234                                                                                                                                        </div>
235                                                                                                                                </div>
236
237                                                                                                                                <div class="space-4"></div>
238
239                                                                                                                                <div class="form-group">
240                                                                                                                                        <label for="form-field-username" class="col-sm-4 control-label no-padding-right">Thời hạn sá»­ dụng dịch vụ</label>
241
242                                                                                                                                        <div class="col-sm-8">
243                                                                                                                                                <input type="text" value="1/10/2020" placeholder="" id="form-field-username" class="col-xs-12 col-sm-10" disabled>
244                                                                                                                                        </div>
245                                                                                                                                </div>
246                                                                                                                        </div>
247                                                                                                                </div>
248
249                                                                                                                <hr>
250                                                                                                                <div class="form-group">
251                                                                                                                        <label for="form-field-date" class="col-sm-3 control-label no-padding-right">Ngày sinh</label>
252
253                                                                                                                        <div class="col-sm-9">
254                                                                                                                                <div class="input-medium">
255                                                                                                                                        <div class="input-group">
256                                                                                                                                                <input type="text" placeholder="dd-mm-yyyy" data-date-format="dd-mm-yyyy" id="form-field-date" class="input-medium date-picker">
257                                                                                                                                                <span class="input-group-addon">
258                                                                                                                                                        <i class="icon-calendar"></i>
259                                                                                                                                                </span>
260                                                                                                                                        </div>
261                                                                                                                                </div>
262                                                                                                                        </div>
263                                                                                                                </div>
264
265                                                                                                                <div class="space-4"></div>
266
267                                                                                                                <div class="form-group">
268                                                                                                                        <label class="col-sm-3 control-label no-padding-right">Giới tính</label>
269
270                                                                                                                        <div class="col-sm-9">
271                                                                                                                                <label class="inline">
272                                                                                                                                        <input type="radio" class="ace" name="form-field-radio">
273                                                                                                                                        <span class="lbl"> Nam</span>
274                                                                                                                                </label>
275
276                                                                                                                                &nbsp; &nbsp; &nbsp;
277                                                                                                                                <label class="inline">
278                                                                                                                                        <input type="radio" class="ace" name="form-field-radio">
279                                                                                                                                        <span class="lbl"> Nữ</span>
280                                                                                                                                </label>
281                                                                                                                        </div>
282                                                                                                                </div>
283
284                                                                                                                <div class="space"></div>
285                                                                                                                <h4 class="header blue bolder smaller">ThÃŽng tin liên hệ</h4>
286
287                                                                                                                <div class="form-group">
288                                                                                                                        <label for="form-field-email" class="col-sm-3 control-label no-padding-right">Email</label>
289
290                                                                                                                        <div class="col-sm-9">
291                                                                                                                                <span class="input-icon input-icon-right">
292                                                                                                                                        <input type="email" value="" id="form-field-email">
293                                                                                                                                        <i class="icon-envelope"></i>
294                                                                                                                                </span>
295                                                                                                                        </div>
296                                                                                                                </div>
297
298                                                                                                                <div class="space-4"></div>
299
300                                                                                                                <div class="form-group">
301                                                                                                                        <label for="form-field-website" class="col-sm-3 control-label no-padding-right">Website</label>
302
303                                                                                                                        <div class="col-sm-9">
304                                                                                                                                <span class="input-icon input-icon-right">
305                                                                                                                                        <input type="url" value="" id="form-field-website">
306                                                                                                                                        <i class="icon-globe"></i>
307                                                                                                                                </span>
308                                                                                                                        </div>
309                                                                                                                </div>
310
311                                                                                                                <div class="space"></div>
312                                                                                                                <h4 class="header blue bolder smaller">Mạng xã hội</h4>
313
314                                                                                                                <div class="form-group">
315                                                                                                                        <label for="form-field-facebook" class="col-sm-3 control-label no-padding-right">Facebook</label>
316
317                                                                                                                        <div class="col-sm-9">
318                                                                                                                                <span class="input-icon">
319                                                                                                                                        <input type="text" id="form-field-facebook" value="">
320                                                                                                                                        <i class="icon-facebook blue"></i>
321                                                                                                                                </span>
322                                                                                                                        </div>
323                                                                                                                </div>
324
325                                                                                                                <div class="space-4"></div>
326
327                                                                                                                <div class="form-group">
328                                                                                                                        <label for="form-field-twitter" class="col-sm-3 control-label no-padding-right">Twitter</label>
329
330                                                                                                                        <div class="col-sm-9">
331                                                                                                                                <span class="input-icon">
332                                                                                                                                        <input type="text" id="form-field-twitter" value="">
333                                                                                                                                        <i class="icon-twitter light-blue"></i>
334                                                                                                                                </span>
335                                                                                                                        </div>
336                                                                                                                </div>
337
338                                                                                                                <div class="space-4"></div>
339
340                                                                                                                <div class="form-group">
341                                                                                                                        <label for="form-field-gplus" class="col-sm-3 control-label no-padding-right">Google+</label>
342
343                                                                                                                        <div class="col-sm-9">
344                                                                                                                                <span class="input-icon">
345                                                                                                                                        <input type="text" id="form-field-gplus" value="">
346                                                                                                                                        <i class="icon-google-plus red"></i>
347                                                                                                                                </span>
348                                                                                                                        </div>
349                                                                                                                </div>
350                                                                                                        </div>
351
352                                                                                                        <div class="tab-pane" id="edit-password">
353                                                                                                                <div class="space-10"></div>
354
355                                                                                                                <div class="form-group">
356                                                                                                                        <label for="form-field-pass1" class="col-sm-3 control-label no-padding-right">Mật khẩu mới</label>
357
358                                                                                                                        <div class="col-sm-9">
359                                                                                                                                <input type="password" id="form-field-pass1">
360                                                                                                                        </div>
361                                                                                                                </div>
362
363                                                                                                                <div class="space-4"></div>
364
365                                                                                                                <div class="form-group">
366                                                                                                                        <label for="form-field-pass2" class="col-sm-3 control-label no-padding-right">Nhập lại mật khẩu</label>
367
368                                                                                                                        <div class="col-sm-9">
369                                                                                                                                <input type="password" id="form-field-pass2">
370                                                                                                                        </div>
371                                                                                                                </div>
372                                                                                                        </div>
373                                                                                                </div>
374                                                                                        </div>
375
376                                                                                        <div class="clearfix form-actions">
377                                                                                                <div class="col-md-offset-3 col-md-9">
378                                                                                                        <button type="button" class="btn btn-info">
379                                                                                                                <i class="icon-ok bigger-110"></i>
380                                                                                                                Lưu lại
381                                                                                                        </button>
382
383                                                                                                        &nbsp; &nbsp;
384                                                                                                        <button type="reset" class="btn">
385                                                                                                                <i class="icon-undo bigger-110"></i>
386                                                                                                                Xóa hết
387                                                                                                        </button>
388                                                                                                </div>
389                                                                                        </div>
390                                                                                </form>
391                                                                        </div><!-- /span -->
392                                                                </div>
393
394                                                                <!-- PAGE CONTENT ENDS -->
395                                                        </div><!-- /.col -->
396                                                </div><!-- /.row -->
397                                        </div><!-- /.page-content -->
398                                </div><!-- /.main-content -->
399                        </div><!-- /.main-container-inner -->
400
401                        <a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse">
402                                <i class="icon-double-angle-up icon-only bigger-110"></i>
403                        </a>
404                </div><!-- /.main-container -->
405
406                <!-- basic scripts -->
407
408                <!--[if !IE]> -->
409
410                <script type="text/javascript">
411                        window.jQuery || document.write("<script src='assets/js/jquery-2.0.3.min.js'>"+"<"+"/script>");
412                </script>
413
414                <!-- <![endif]-->
415
416                <!--[if IE]>
417<script type="text/javascript">
418 window.jQuery || document.write("<script src='assets/js/jquery-1.10.2.min.js'>"+"<"+"/script>");
419</script>
420<![endif]-->
421
422                <script type="text/javascript">
423                        if("ontouchend" in document) document.write("<script src='assets/js/jquery.mobile.custom.min.js'>"+"<"+"/script>");
424                </script>
425                <script src="assets/js/bootstrap.min.js"></script>
426                <script src="assets/js/typeahead-bs2.min.js"></script>
427
428                <!-- page specific plugin scripts -->
429
430                <!--[if lte IE 8]>
431                  <script src="assets/js/excanvas.min.js"></script>
432                <![endif]-->
433
434                <script src="assets/js/jquery-ui-1.10.3.custom.min.js"></script>
435                <script src="assets/js/jquery.ui.touch-punch.min.js"></script>
436                <script src="assets/js/jquery.gritter.min.js"></script>
437                <script src="assets/js/bootbox.min.js"></script>
438                <script src="assets/js/jquery.slimscroll.min.js"></script>
439                <script src="assets/js/jquery.easy-pie-chart.min.js"></script>
440                <script src="assets/js/jquery.hotkeys.min.js"></script>
441                <script src="assets/js/bootstrap-wysiwyg.min.js"></script>
442                <script src="assets/js/select2.min.js"></script>
443                <script src="assets/js/date-time/bootstrap-datepicker.min.js"></script>
444                <script src="assets/js/fuelux/fuelux.spinner.min.js"></script>
445                <script src="assets/js/x-editable/bootstrap-editable.min.js"></script>
446                <script src="assets/js/x-editable/ace-editable.min.js"></script>
447                <script src="assets/js/jquery.maskedinput.min.js"></script>
448
449                <!-- ace scripts -->
450
451                <script src="assets/js/ace-elements.min.js"></script>
452                <script src="assets/js/ace.min.js"></script>
453
454                <!-- inline scripts related to this page -->
455
456                <script type="text/javascript">
457                        jQuery(function($) {
458                       
459                                ///////////////////////////////////////////
460                                $('#user-profile-3')
461                                .find('input[type=file]').ace_file_input({
462                                        style:'well',
463                                        btn_choose:'Hình đại diện',
464                                        btn_change:null,
465                                        no_icon:'icon-picture',
466                                        thumbnail:'large',
467                                        droppable:true,
468                                        before_change: function(files, dropped) {
469                                                var file = files[0];
470                                                if(typeof file === "string") {//files is just a file name here (in browsers that don't support FileReader API)
471                                                        if(! (/\.(jpe?g|png|gif)$/i).test(file) ) return false;
472                                                }
473                                                else {//file is a File object
474                                                        var type = $.trim(file.type);
475                                                        if( ( type.length > 0 && ! (/^image\/(jpe?g|png|gif)$/i).test(type) )
476                                                                        || ( type.length == 0 && ! (/\.(jpe?g|png|gif)$/i).test(file.name) )//for android default browser!
477                                                                ) return false;
478                       
479                                                        if( file.size > 110000 ) {//~100Kb
480                                                                return false;
481                                                        }
482                                                }
483                       
484                                                return true;
485                                        }
486                                })
487                                .end().find('button[type=reset]').on(ace.click_event, function(){
488                                        $('#user-profile-3 input[type=file]').ace_file_input('reset_input');
489                                })
490                                .end().find('.date-picker').datepicker().next().on(ace.click_event, function(){
491                                        $(this).prev().focus();
492                                })
493                       
494
495                                ////////////////////
496                                //change profile
497                                $('[data-toggle="buttons"] .btn').on('click', function(e){
498                                        var target = $(this).find('input[type=radio]');
499                                        var which = parseInt(target.val());
500                                        $('.user-profile').parent().addClass('hide');
501                                        $('#user-profile-'+which).parent().removeClass('hide');
502                                });
503                        });
504                </script>
505        </body>
506</html>
Note: See TracBrowser for help on using the repository browser.