P102.html 8.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta name="renderer" content="webkit">
  5. <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
  6. <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
  7. <meta http-equiv="pragma" content="no-cache">
  8. <meta http-equiv="Cache" content="no-cache">
  9. <meta http-equiv="cache-control" content="no-cache, must-revalidate">
  10. <meta http-equiv="expires" content="0">
  11. <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  12. <title>用户管理</title>
  13. <link rel="stylesheet" href="../css/index.css">
  14. <link rel="stylesheet" href="../css/style.css">
  15. <link rel="stylesheet" href="../css/iconfont.css">
  16. <link rel="stylesheet" href="../css/tablema.css">
  17. <script src="../js/vue.min.js"></script>
  18. <script src="../js/index.js"></script>
  19. <script src="../js/jquery.min.js"></script>
  20. <script type="text/javascript">
  21. document.write('<script src="../assets/init.js?id='+(new Date().getTime())+'" type="text/javascript" charset="utf-8"><\/script>');
  22. </script>
  23. <script>
  24. checkLogin();
  25. </script>
  26. </head>
  27. <body>
  28. <div id="app" v-cloak class="padding-sm">
  29. <div>
  30. <div class="flex align-center margin-bottom-sm">
  31. <div>
  32. <el-input placeholder="请输入关键词" v-model="inpKey" @input="Search">
  33. <i slot="prefix" class="el-input__icon el-icon-search"></i>
  34. </el-input>
  35. </div>
  36. <div class="tableTool">
  37. <el-button type="primary" size="small" class="margin-left-sm">查询</el-button>
  38. <el-button type="success" size="small" @click="newAdd">新增</el-button>
  39. </div>
  40. </div>
  41. <el-table class="elTable" :data="tableData" border :header-cell-style="{background:'#082041',color:'#fff'}"
  42. v-loading="loading">
  43. <el-table-column align="center" prop="userId" label="用户编号"> </el-table-column>
  44. <el-table-column align="center" prop="userName" label="用户账号"> </el-table-column>
  45. <el-table-column align="center" prop="nickName" label="用户昵称"> </el-table-column>
  46. <el-table-column align="center" prop="dept.deptName" label="部门"></el-table-column>
  47. <el-table-column align="center" prop="phonenumber" label="手机号码"> </el-table-column>
  48. <el-table-column align="center" prop="status" label="状态">
  49. <template slot-scope="scope">
  50. <el-switch
  51. :value="scope.row.status == 0"
  52. disabled
  53. active-color="#13ce66"
  54. inactive-color="#ff4949">
  55. </el-switch>
  56. </template>
  57. </el-table-column>
  58. <el-table-column align="center" prop="createTime" label="创建时间"> </el-table-column>
  59. <el-table-column
  60. align="center"
  61. width="180"
  62. label="操作">
  63. <template slot-scope="scope" v-if="!scope.row.admin">
  64. <el-button type="text" size="small" @click="Edit(scope.row)" class="text-green"><i class="el-icon-edit"></i>编辑</el-button>
  65. <el-button type="text" size="small" @click="Delete(scope.row)" class="text-red"><i class="el-icon-delete"></i>删除</el-button>
  66. <el-button type="text" size="small" @click="RePwd(scope.row)" class="text-sray"><i class="el-icon-key"></i>密码</el-button>
  67. </template>
  68. </el-table-column>
  69. </el-table>
  70. </div>
  71. <div style="background-color: #06162d;" class="margin-tb-sm padding-xs">
  72. <el-pagination
  73. @current-change="handleCurrentChange"
  74. :current-page="curPage"
  75. background
  76. :page-size="20"
  77. layout="total, prev, pager, next, jumper"
  78. :total="allTotal">
  79. </el-pagination>
  80. </div>
  81. <el-dialog title="用户信息" :visible.sync="dialogVisible" width="60%">
  82. <div class="flex br" style="text-align: center;">
  83. <div class="_Form">
  84. <div class="flex align-center">
  85. <div><span class="text-red">*</span>用户昵称</div>
  86. <div><el-input v-model="nowForm.nickName" placeholder="用户昵称"></el-input></div>
  87. </div>
  88. <div class="flex align-center">
  89. <div>手机号码</div>
  90. <div><el-input v-model="nowForm.phonenumber" placeholder="手机号码"></el-input></div>
  91. </div>
  92. <div class="flex align-center" v-if="nowForm.userId == undefined">
  93. <div><span class="text-red">*</span>用户账号</div>
  94. <div><el-input v-model="nowForm.userName" placeholder="用户账号" :readonly="readonlyInput" @focus="cancelReadOnly()"></el-input></div>
  95. </div>
  96. <div class="flex align-center">
  97. <div>用户性别</div>
  98. <div>
  99. <el-select v-model="nowForm.sex" placeholder="请选择" style="width: 100%;">
  100. <el-option
  101. v-for="item in sexOptions"
  102. :key="item.dictValue"
  103. :label="item.dictLabel"
  104. :value="item.dictValue">
  105. </el-option>
  106. </el-select>
  107. </div>
  108. </div>
  109. <div class="flex align-center" style="border: none;">
  110. <div>岗位</div>
  111. <div>
  112. <el-select v-model="nowForm.postIds[0]"
  113. clearable @clear="clearSel('postIds')"
  114. placeholder="请选择" style="width: 100%;">
  115. <el-option
  116. v-for="item in postOptions"
  117. :key="item.postId"
  118. :label="item.postName"
  119. :value="item.postId">
  120. </el-option>
  121. </el-select>
  122. </div>
  123. </div>
  124. </div>
  125. <div class="_Form" style="border: none;">
  126. <div class="flex align-center">
  127. <div>归属部门</div>
  128. <div>
  129. <el-select v-model="parentName.deptName"
  130. ref="conSelect" style="width: 100%;">
  131. <el-option>
  132. <el-tree
  133. ref="tree"
  134. node-key="id"
  135. :data="deptOptions"
  136. :props="defaultProps"
  137. @node-click="nodeClick"
  138. />
  139. </el-option>
  140. </el-select>
  141. </div>
  142. </div>
  143. <div class="flex align-center">
  144. <div>邮箱</div>
  145. <div><el-input type="text" v-model="nowForm.email" placeholder="邮箱" :readonly="readonlyInput" @focus="cancelReadOnly()"></el-input></div>
  146. </div>
  147. <div class="flex align-center" v-if="nowForm.userId == undefined">
  148. <div><span class="text-red">*</span>用户密码</div>
  149. <div><el-input type="password" v-model="nowForm.password" placeholder="用户密码" :readonly="readonlyInput" @focus="cancelReadOnly()"></el-input></div>
  150. </div>
  151. <div class="flex align-center">
  152. <div>状态</div>
  153. <div class="text-left">
  154. <el-radio v-model="nowForm.status" label="0">正常</el-radio>
  155. <el-radio v-model="nowForm.status" label="1">停用</el-radio>
  156. </div>
  157. </div>
  158. <div class="flex align-center" style="border: none;">
  159. <div><span class="text-red">*</span>角色</div>
  160. <div>
  161. <el-select v-model="nowForm.roleIds[0]"
  162. clearable @clear="clearSel('roleIds')"
  163. placeholder="请选择" style="width: 100%;">
  164. <el-option
  165. v-for="item in roleOptions"
  166. :key="item.roleId"
  167. :label="item.roleName"
  168. :value="item.roleId">
  169. </el-option>
  170. </el-select>
  171. </div>
  172. </div>
  173. </div>
  174. </div>
  175. <div class="padding-sm text-center">
  176. <el-button size="small" @click="dialogVisible = false;">取消</el-button>
  177. <el-button size="small" type="success" @click="conFirm">提交</el-button>
  178. </div>
  179. </el-dialog>
  180. <el-dialog title="提示" :visible.sync="pwdDialog" width="40%">
  181. <div>
  182. <div>请输入"{{ pwdInfo.pwdName }}"的新密码</div>
  183. <div class="margin-tb-sm"><el-input type="text" v-model="pwdInfo.newPwd" placeholder="用户新密码" :readonly="readonlyInput" @focus="cancelReadOnly()"></el-input></div>
  184. </div>
  185. <div class="text-right">
  186. <el-button size="small" @click="pwdDialog = false">取 消</el-button>
  187. <el-button size="small" type="success" @click="conPwd">确 定</el-button>
  188. </div>
  189. </el-dialog>
  190. </div>
  191. <script type="text/javascript">
  192. document.write('<script src="../assets/userManage.js?id='+(new Date().getTime())+'" type="text/javascript" charset="utf-8"><\/script>');
  193. </script>
  194. </body>
  195. </html>