index.html 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124
  1. <style>
  2. .profile-avatar-container {
  3. position: relative;
  4. width: 100px;
  5. margin: 0 auto;
  6. }
  7. .profile-avatar-container .profile-user-img {
  8. width: 100px;
  9. height: 100px;
  10. }
  11. .profile-avatar-container .profile-avatar-text {
  12. display: none;
  13. }
  14. .profile-avatar-container:hover .profile-avatar-text {
  15. display: block;
  16. position: absolute;
  17. height: 100px;
  18. width: 100px;
  19. background: #444;
  20. opacity: .6;
  21. color: #fff;
  22. top: 0;
  23. left: 0;
  24. line-height: 100px;
  25. text-align: center;
  26. }
  27. .profile-avatar-container button {
  28. position: absolute;
  29. top: 0;
  30. left: 0;
  31. width: 100px;
  32. height: 100px;
  33. opacity: 0;
  34. }
  35. </style>
  36. <div class="row animated fadeInRight">
  37. <div class="col-md-3"></div>
  38. <div class="col-md-6">
  39. <div class="box box-success">
  40. <div class="panel-heading">
  41. {:__('Profile')}
  42. </div>
  43. <div class="panel-body">
  44. <form id="update-form" role="form" data-toggle="validator" method="POST" action="{:url('general.profile/update')}">
  45. {:token()}
  46. <input type="hidden" id="c-avatar" name="row[avatar]" value="{$admin.avatar|htmlentities}"/>
  47. <div class="box-body box-profile">
  48. <div class="profile-avatar-container">
  49. <img class="profile-user-img img-responsive img-circle plupload" src="{$admin.avatar|cdnurl|htmlentities}" alt="">
  50. <div class="profile-avatar-text img-circle">{:__('Click to edit')}</div>
  51. <button id="plupload-avatar" class="plupload" data-input-id="c-avatar"><i class="fa fa-upload"></i> {:__('Upload')}</button>
  52. </div>
  53. <h3 class="profile-username text-center">{$admin.nickname|htmlentities}</h3>
  54. <p class="text-muted text-center">{$admin.email|htmlentities}</p>
  55. <div class="form-group">
  56. <label for="username" class="control-label">{:__('Username')}:</label>
  57. <input type="text" class="form-control" id="username" name="row[username]" value="{$admin.username|htmlentities}" disabled/>
  58. </div>
  59. <div class="form-group">
  60. <label for="username" class="control-label">{:__('Institution')}:</label>
  61. <input type="text" class="form-control" id="institution" value="{$admin.institution.my_institution_name}" disabled/>
  62. </div>
  63. <div class="form-group">
  64. <label for="email" class="control-label">{:__('Email')}:</label>
  65. <input type="text" class="form-control" id="email" name="row[email]" value="{$admin.email|htmlentities}" data-rule="required;email"/>
  66. </div>
  67. <div class="form-group">
  68. <label for="nickname" class="control-label">{:__('Nickname')}:</label>
  69. <input type="text" class="form-control" id="nickname" name="row[nickname]" value="{$admin.nickname|htmlentities}" data-rule="required"/>
  70. </div>
  71. <div class="form-group">
  72. <label for="password" class="control-label">{:__('Password')}:</label>
  73. <input type="password" class="form-control" id="password" placeholder="{:__('Leave password blank if dont want to change')}"
  74. autocomplete="new-password" name="row[password]" value=""
  75. data-rule="required;password;"
  76. data-rule-password="[/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[\s\S]{8,16}$/, '至少8-16个字符,至少1个大写字母,1个小写字母和1个数字']"
  77. />
  78. </div>
  79. <div class="form-group">
  80. <button type="submit" class="btn btn-success">{:__('Submit')}</button>
  81. <button type="reset" class="btn btn-default">{:__('Reset')}</button>
  82. </div>
  83. </div>
  84. </form>
  85. </div>
  86. </div>
  87. </div>
  88. <!-- <div class="col-md-8">-->
  89. <!-- <div class="panel panel-default panel-intro panel-nav">-->
  90. <!-- <div class="panel-heading">-->
  91. <!-- <ul class="nav nav-tabs">-->
  92. <!-- <li class="active"><a href="#one" data-toggle="tab"><i class="fa fa-list"></i> {:__('Admin log')}</a></li>-->
  93. <!-- </ul>-->
  94. <!-- </div>-->
  95. <!-- <div class="panel-body">-->
  96. <!-- <div id="myTabContent" class="tab-content">-->
  97. <!-- <div class="tab-pane fade active in" id="one">-->
  98. <!-- <div class="widget-body no-padding">-->
  99. <!-- <div id="toolbar" class="toolbar">-->
  100. <!-- {:build_toolbar('refresh')}-->
  101. <!-- </div>-->
  102. <!-- <table id="table" class="table table-striped table-bordered table-hover" width="100%">-->
  103. <!-- </table>-->
  104. <!-- </div>-->
  105. <!-- </div>-->
  106. <!-- </div>-->
  107. <!-- </div>-->
  108. <!-- </div>-->
  109. <!-- </div>-->
  110. </div>