123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <title>新增用户</title>
- <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
- <script src="../../../admin/index.js" door type="text/javascript" charset="utf-8"></script>
- <style type="text/css">
- .ui-required:before {
- content: "*";
- color: red;
- vertical-align: middle;
- }
- #roleSelectViwe .layui-form-item {
- margin-bottom: 0
- }
- #roleSelectViwe .layui-input-inline {
- width: calc(100% - 110px);
- margin-right: 0;
- }
- .region {
- padding-left: 10px;
- height: 38px;
- line-height: 38px;
- background-color: #fff;
- border-radius: 2px;
- border: 1px solid #e6e6e6;
- width: 100% !important;
- width: calc(100% - 132px) !important;
- }
- .userTip {
- color: #666;
- font-size: 12px;
- }
- .userTip b {
- color: #333;
- }
- </style>
- <script type="text/html" id="typeHtmlTpl">
- <option value="">请选择</option>
- {{# if(!d.list){d.list = []}; layui.each(d.list, function(index, item){ }}
- <option value="{{item.id}}">{{item.name}}</option>
- {{# }); }}
- </script>
- </head>
- <body>
- <form class="layui-form" action="" lay-filter="addForm" style="padding: 20px 30px 0 0">
- <div class="layui-form-item" style="margin-bottom:5px">
- <div class="layui-input-block" style="min-height: 20px;">
- <span class="userTip">为避免账号名称重复,建议账号名称增加单位或区域的字母缩写,例如:<b>James_GY</b></span>
- </div>
- </div>
- <div class="layui-form-item">
- <label class="layui-form-label ui-required">账号</label>
- <div class="layui-input-block">
- <input type="text" name="name" lay-verify="required|nickname|checkName" maxlength="30" placeholder="请输入账号"
- autocomplete="on" class="layui-input">
- </div>
- </div>
- <div class="layui-form-item">
- <div class="layui-inline">
- <label class="layui-form-label ui-required">姓名</label>
- <div class="layui-input-inline">
- <input type="text" name="realName" lay-verify="required" maxlength="10" placeholder="请输入姓名" autocomplete="on"
- class="layui-input">
- </div>
- </div>
- <div class="layui-inline">
- <label class="layui-form-label">性别</label>
- <div class="layui-input-inline">
- <input type="radio" name="sex" value="男" title="男" checked />
- <input type="radio" name="sex" value="女" title="女" />
- </div>
- </div>
- </div>
- <div class="layui-form-item">
- <label class="layui-form-label ui-required">角色</label>
- <div class="layui-input-block">
- <select name="roles" lay-verify="required" lay-filter="roles" id="rolesView" placeholder="请选择"></select>
- </div>
- </div>
- <div class="layui-form-item">
- <label class="layui-form-label">手机号码</label>
- <div class="layui-input-block">
- <input type="text" name="phone" lay-verify="phoneNumber" placeholder="请输入手机号码" maxLength="11" autocomplete="on"
- class="layui-input">
- </div>
- </div>
- <div class="layui-form-item">
- <label class="layui-form-label ui-required">登录密码</label>
- <div class="layui-input-block">
- <input type="password" id="L_pass" name="pwd" lay-verify="password" placeholder="请输入密码" autocomplete="off" class="layui-input">
- </div>
- </div>
- <div class="layui-form-item">
- <label class="layui-form-label ui-required">确认密码</label>
- <div class="layui-input-block">
- <input type="password" lay-verify="resspaword" placeholder="请再次输入密码" autocomplete="off" class="layui-input">
- </div>
- </div>
- <div class="layui-form-item layui-hide">
- <button class="layui-btn" lay-submit lay-filter="formSubmit" id="formSubmit">保存</button>
- </div>
- </form>
- <script type="text/javascript">
- layui.config({
- base: "../../../admin/js/layuiPlugins/"
- }).use(["form", 'layer', 'cascade', 'laytpl', 'jquery'], function() {
- var form = layui.form,
- $ = layui.$,
- layer = layui.layer,
- laytpl = layui.laytpl,
- $ = layui.jquery,
- cascade = layui.cascade;
- var user = {
- id: (JSON.stringify(location.searchObj()) != "{}") ? location.searchObj().id || null : null, //带参传入ID
- roleTableDataId: "roleDataList", //数据ID
- currentUser: {}, //当前表单数据
- roleDataListPort: {
- roles: "roleDataList"
- }, //角色数据接口
- update_user: "userAddNew", //新增修改接口
- select_user: "select_user", //查询用户
- roleSelectView: "#roleSelectViwe", //角色列表下拉容器
- formLayFilter: "addForm", //表单容器
- closeModal: function() { //关闭当前窗口
- parent.layer.close(parent.layer.getFrameIndex(window.name));
- }
- };
- //类型下拉列表模板
- function typeTpl(obj) {
- laytpl(typeHtmlTpl.innerHTML).render(obj, function(html) {
- $(obj.elem).html(html);
- form.render();
- });
- }
- //初始化
- user.main = function() {
- var _this = this;
- if (this.id) {
- _this.getCurrent(_this.id); //获取并初始化表单角色信息
- } else {
- _this.initialization();
- }
- return this;
- };
- //初始化
- user.initialization = function() {
- var _this = this;
- //初始化角色权限下拉
- $.ajax({
- url: _this.roleDataListPort.roles + '?flag=1',
- success: function(res) {
- typeTpl({
- elem: "#rolesView",
- list: res.data
- });
- form.val(_this.formLayFilter, _this.currentUser);
- }
- });
- //监听提交
- form.on('submit(formSubmit)', function(obj) {
- //必须return false;
- return _this.fusionData(obj.field).submitInfo(); //获取选中权限变数组,提交变化===下拉
- });
- return _this;
- };
- //获取当前信息
- user.getCurrent = function(id) {
- var _this = this;
- $.ajax({
- url: this.select_user,
- data: {
- id: id || this.id //当前ID
- },
- success: function(res) {
- $('#provinceId').text(res.data[0].provinceName || '');
- $('#cityId').text(res.data[0].cityName || '');
- $('#countyId').text(res.data[0].countyName || '');
- _this.currentUser = res.data[0];
- _this.initialization().formVal();
- }
- });
- return this;
- };
- //表单赋值
- user.formVal = function() {
- var _this = this;
- form.val(this.formLayFilter, this.currentUser);
- return this;
- };
- //合并表单内容
- user.fusionData = function(obj) {
- this.currentUser = $.extend(this.currentUser, obj);
- if (this.currentUser.id) {
- delete this.currentUser.password;
- }
- this.currentUser.roles = [this.currentUser.roles];
- return this;
- };
- //提交新增修改
- user.submitInfo = function() {
- var _this = this;
- this.currentUser.userId = this.currentUser.id;
- $.ajax({
- type: this.id ? 'PUT' : 'POST',
- url: this.update_user,
- data: JSON.stringify(this.currentUser),
- contentType: 'application/json',
- success: function(res) {
- if (!(res.code - 0)) {
- parent.layer.msg(res.msg, {
- icon: 1
- });
- parent.layui.table.reload('userDataTable');
- _this.closeModal();
- } else {
- layer.msg(res.msg, {
- icon: 2
- });
- }
- }
- });
- return false;
- };
- user.main();
- //验证规则
- form.verify({
- nickname: function(value) {
- if (!new RegExp("^[a-zA-Z][a-zA-Z0-9_]*$").test(value)) {
- return '用户名必须以英文字母开头,只能包含英文字母、数字、下划线';
- }
- if (/(^\_)|(\__)|(\_+$)/.test(value)) {
- return '用户名首尾不能出现下划线\'_\'';
- }
- },
- checkName: function(value) {
- if (user.currentUser.name != value) {
- var msg = '用户名已经存在',
- code = false;
- $.ajax({
- url: "userList",
- async: false,
- timeout: 10000,
- data: {
- name: value
- },
- success: function(res) {
- if ((res.code - 0) == 7) {
- parent.window.location.href = window.hywa.jumpPage.login;
- }
- code = !!res.total;
- }
- });
- if (code) {
- return msg;
- }
- }
- },
- phoneNumber: function(value) {
- if (value) {
- if (!(/^1[3|4|5|7|8]\d{9}$/).test(value)) {
- return '请输入正确的手机号码';
- }
- }
- return false;
- },
- password: function(value) {
- if (location.searchObj().id) {
- if (value) {
- if (!(/^[\S]{6,12}$/).test(value)) {
- return '密码必须6到12位,且不能出现空格';
- }
- }
- return false;
- }
- if (!(/^[\S]{6,12}$/).test(value)) {
- return '密码必须6到12位,且不能出现空格';
- }
- },
- resspaword: function(value) {
- var pass = $('#L_pass').val();
- if (value != pass) {
- return '两次密码不一致';
- }
- },
- ageLength: [
- /^[0-9]{0,2}$/,
- '年龄必须0到2位,且只能是数字'
- ],
- jobLength: [
- /^[a-z\A-Z\u4e00-\u9fa5_]{0,10}$/,
- '职务必须是0-10位,且不包含特殊字符与数字'
- ],
- workUnit: [
- /^[0-9\a-z\A-Z\u4e00-\u9fa5_]{0,25}$/,
- '工作单位必须是0-25位,且不包含特殊字符'
- ],
- vcode: [
- /^[\w]{4,5}$/,
- '验证码不符合规则'
- ]
- });
- });
- </script>
- </body>
- </html>
|