admin-add.html 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>添加管理员</title>
  5. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  6. <meta name="viewport"
  7. content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
  8. <!-- 所有的 css & js 资源 -->
  9. <link rel="stylesheet" href="https://unpkg.com/element-ui@2.13.0/lib/theme-chalk/index.css">
  10. <link rel="stylesheet" href="../../static/sa.css">
  11. <script src="https://unpkg.com/vue@2.6.10/dist/vue.min.js"></script>
  12. <script src="https://unpkg.com/element-ui@2.13.0/lib/index.js"></script>
  13. <script src="https://unpkg.com/http-vue-loader@1.4.2/src/httpVueLoader.js"></script>
  14. <script src="https://unpkg.com/jquery@3.4.1/dist/jquery.min.js"></script>
  15. <script src="https://www.layuicdn.com/layer-v3.1.1/layer.js"></script>
  16. <script src="../../static/sa.js"></script>
  17. <script src="../../static/kj/upload-util.js"></script>
  18. </head>
  19. <body>
  20. <div class="vue-box" style="display: none;" :style="'display: block;'">
  21. <!-- 参数栏 -->
  22. <div class="c-panel">
  23. <h4 class="c-title">添加用户</h4>
  24. <el-form>
  25. <!-- 防止密码框被填充 -->
  26. <div style="height: 0px; overflow: hidden;">
  27. <el-input></el-input>
  28. <el-input type="password"></el-input>
  29. </div>
  30. <sa-item type="text" name="姓名" v-model="m.nickname" br need></sa-item>
  31. <sa-item style="display: inline;" type="text" name="手机号" v-model="m.phone" br need></sa-item>
  32. <span style="display: inline;">即登录账号</span>
  33. <div class="c-item">
  34. <label class="c-label"><span style="color: red;">*</span>部门:</label>
  35. <el-select v-model="deptIds" multiple :disabled="currentUser.deptId!=='9999999'">
  36. <el-option label="请选择" v-for="(item,index) in deptList" :key="item.id" :label="item.name"
  37. :value="item.id"></el-option>
  38. </el-select>
  39. </div>
  40. <sa-item type="password" name="密码" v-model="m.password" br need></sa-item>
  41. <sa-item name="角色" br>
  42. <el-select v-model="m.roleId">
  43. <el-option label="请选择" :value="0" disabled></el-option>
  44. <el-option v-for="role in roleList" :key="role.id" :label="role.name" :value="role.id">
  45. </el-option>
  46. </el-select>
  47. </sa-item>
  48. <sa-item name="" br>
  49. <el-button type="primary" icon="el-icon-plus" @click="ok()">保存</el-button>
  50. </sa-item>
  51. </el-form>
  52. </div>
  53. </div>
  54. <script>
  55. var app = new Vue({
  56. components: {
  57. "sa-item": httpVueLoader('../../sa-frame/com/sa-item.vue')
  58. },
  59. el: '.vue-box',
  60. data: {
  61. sa: sa, // 超级对象
  62. m: {
  63. id: 0,
  64. name: '',
  65. deptId:'',
  66. avatar: '',
  67. password: '',
  68. roleId: 0
  69. },
  70. roleList: [],
  71. deptList: [],
  72. currentUser: sa.$sys.getCurrUser(),
  73. deptIds: [],
  74. },
  75. methods: {
  76. getDeptList() {
  77. sa.ajax('/TbDept/getList', {
  78. pageNo: 1,
  79. pageSize: 100
  80. }, function(resp) {
  81. let list = resp.data;
  82. let deptId = this.currentUser.deptId;
  83. if (deptId != '9999999') {
  84. //this.m.deptId = deptId;
  85. this.deptIds = deptId.split(',');
  86. }
  87. this.deptList = list;
  88. }.bind(this))
  89. },
  90. // 修改
  91. ok: function() {
  92. // 表单校验
  93. let m = this.m;
  94. m.deptId = this.deptIds.join(",");
  95. sa.checkNull(m.nickname, '请输入姓名');
  96. let phone = m.phone;
  97. if (!sa.isPhone(phone)) {
  98. sa.error('请输入正确的手机号');
  99. return;
  100. }
  101. sa.checkNull(m.password, '请输入密码');
  102. sa.checkNull(m.roleId, '请选择角色');
  103. // 添加
  104. sa.ajax('/admin/add', m, function(res) {
  105. sa.alert('增加成功', this.clean);
  106. parent.app.f5(); // 刷新父页面列表
  107. sa.closeCurrIframe();
  108. }.bind(this));
  109. },
  110. getRoleList() {
  111. sa.ajax('/role/getList', function(res) {
  112. this.roleList = res.data; // 数据
  113. }.bind(this), {
  114. msg: null
  115. });
  116. }
  117. },
  118. mounted: function() {
  119. // 加载角色
  120. this.getRoleList();
  121. this.getDeptList();
  122. }
  123. })
  124. </script>
  125. </body>
  126. </html>