工作半年总结 -web前端

<form id="searchForm" name="searchForm" action="/admin/user/index">
    <input type="hidden" name="page" id="page" value="@paginator.getPage()"/>
    <input type="hidden" name="pageSize"  value="@paginator.getPageSize()"/>
</form>
<div class="bs-docs-section-6em">
    <ul class="nav nav-tabs">
        <li class="active"><a href="#" ><span class="glyphicon glyphicon-th-list" ></span> .。。管理</a></li>
        <div class="pull-right f-margin-top-f60px">
            <a data-func="add" class="btn glyphicon glyphicon-plus" data-toggle="modal" data-target="#bs-modal-add">添加</a>
        </div>

    </ul>
    <table class="table table-striped  table-bordered table-hover" id="overall">
        <thead >
        <tr>
            <th>XXXX</th>
            <th>XXXX/th>
            <th>XXX</th>
            <th>XXX</th>
            <th>XXXX</th>
            <th>XXXX</th>
            <th  ><p  align="center">操作</p></th>
        </tr>
        </thead>
        <tbody>
        @for(mapEntry<-list){
        <tr>
        <td>@mapEntry.getCmsUserId()</td>
        <td>DummyCmsUserName </td>
        <td>@mapEntry.getUserId()</td>
            @if(u != null){
                <td>@u.get(0).get(mapEntry.getUserId().toString())</td>
            }else{
                <td>&nbsp;</td>
            }
            <td>@UserVerifiedType.getFromCode(mapEntry.getVerifiedType().toString()).getMsg()</td>
            <td>@mapEntry.getRecommendReason()</td>

        <td><input  class="btn "   type="button"   data-toggle="modal" id = "@mapEntry.getUserCmsUserId()" data-target="#bs-modal-edit"    value="编辑" />
            <input  class="btn "   type="button"   data-toggle="modal" id = "@mapEntry.getUserCmsUserId()" data-target="#bs-modal-delete"      value="删除" />
             @if(mapEntry.getIsTop()==0){ <input  class="btn "   type="button"   data-toggle="modal" _top="@mapEntry.getIsTop()" id = "@mapEntry.getUserCmsUserId()" data-target="#bs-modal-istop"    value="置顶"   />
            }else{
              <input  class="btn  "   type="button"   data-toggle="modal" _top="@mapEntry.getIsTop()"  id = "@mapEntry.getUserCmsUserId()" style="  font-weight:bold"data-target="#bs-modal-istop"   value="取消"   />
            }
        </td>

        }
        </tr>
        </tbody>
        </table>
    <script src='@routes.Assets.at("/javascripts/userTheme.js")' type="text/javascript"></script>
    @Page(paginator)
<div id="bs-modal-istop" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">置顶</h4>
            </div>
            <div class="modal-body">
                <p></p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary" func="istop">确认</button>
            </div>
        </div>
    </div>
</div>
<div id="bs-modal-error" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">出错啦!</h4>
            </div>
            <div class="modal-body">
                <p></p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">确认</button>
            </div>
        </div>
    </div>
</div>
<div id="bs-modal-add" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h4 class="modal-title">添加关联</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal">

                    <div class="form-group">
                        <label for="cmsUserId" class="col-lg-3 control-label">户ID:</label>
                        <div class="col-lg-4">
                            <input type="text" class="form-control" id="cmsUserId" placeholder="户ID">
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="userId" class="col-lg-3 control-label">ID:</label>
                        <div class="col-lg-4">
                            <input type="text" class="form-control " id="userId" placeholder="ID">  <a data-func="search" class=" form-control btn glyphicon glyphicon-search" data-toggle="modal" data-target="#bs-modal-search "></a>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="reason" class="col-lg-3 control-label">ccc:</label>
                        <div class="col-lg-4">
                            <textarea id="reason" cols="24" rows="5"></textarea>
                        </div>
                    </div>

                    <div id="dropdownSatus" class="form-group" data-selectedid="2333">
                        <label for="verifiedType"  class="col-lg-3 control-label" >类型:</label>
                        <div class="col-lg-4 form-control-static">
                            <select  name="collocation_division" id = "verifiedType">
                            @for(c <- verifiedType){
                            <option value="@c.getCode" >@c.getMsg</option>
                            }
                        </select>
                        </div>

                    </div>
                </form>

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" func="confirm">保存</button>
            </div>
        </div>
    </div>
</div>
<div id="bs-modal-edit" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h4 class="modal-title">修改关联</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal">

                    <div class="form-group">
                        <label for="cmsUserId_edit" class="col-lg-3 control-label">ID:</label>
                        <div class="col-lg-4">
                            <input type="text" class="form-control" id="cmsUserId_edit" placeholder="ID">
                            <input type="hidden"  name ="userCmsUserId" id="userCmsUserId" >
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="userId_edit" class="col-lg-3 control-label">ID:</label>
                        <div class="col-lg-4">
                            <input type="text" class="form-control" id="userId_edit" placeholder="ID"><a data-func="search" class=" form-control btn glyphicon glyphicon-search" data-toggle="modal" data-target="#bs-modal-search-edit "></a>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="reason_edit" class="col-lg-3 control-label">由:</label>
                        <div class="col-lg-4">
                            <textarea id="reason_edit" cols="24" rows="5"></textarea>
                        </div>
                    </div>

                    <div id="dropdownSatus_edit" class="form-group" data-selectedid="2333">
                        <label for="verifiedType_edit"  class="col-lg-3 control-label" ></label>
                        <div class="col-lg-4 form-control-static">
                            <select  name="collocation_division" id = "verifiedType_edit" orteus="true" >
                                @for(c <- verifiedType){
                                <option value="@c.getCode" >@c.getMsg</option>
                                }
                            </select>
                        </div>

                    </div>
                </form>

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" func="confirm">保存</button>
            </div>
        </div>
    </div>
</div>
<div id="bs-modal-delete" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">删除!</h4>
            </div>
            <div class="modal-body">
                <p>确定要删除该关联关系么?</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-danger" func="confirm">删除</button>
            </div>
        </div>
    </div>
</div>
<div id="bs-modal-search" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h4 class="modal-title">查找</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal">

                    <div class="form-group">
                        <label for="cmsUserId" class="col-lg-3 control-label">用户名:</label>
                        <div class="col-lg-4">
                            <input type="text" class="form-control" id="username" placeholder="用户名">
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="userId" class="col-lg-3 control-label">密码:</label>
                        <div class="col-lg-4">
                            <input type="text" class="form-control" id="password" placeholder="密码">
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" func="confirm">查询</button>
            </div>
        </div>
    </div>
</div>
<div id="bs-modal-search-edit" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                    <h4 class="modal-title">查找真实用户ID</h4>
                </div>
                <div class="modal-body">
                    <form class="form-horizontal">

                        <div class="form-group">
                            <label for="cmsUserId" class="col-lg-3 control-label">用户名:</label>
                            <div class="col-lg-4">
                                <input type="text" class="form-control" id="username_edit" placeholder="用户名">
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="userId" class="col-lg-3 control-label">密码:</label>
                            <div class="col-lg-4">
                                <input type="text" class="form-control" id="password_edit" placeholder="密码">
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="button" class="btn btn-primary" func="confirm">查询</button>
                </div>
            </div>
        </div>
    </div>
    </div>

<script>

    var _id;
     var msg ;
      var _top;
    $('#bs-modal-istop').on('show.bs.modal' , function(event){
             _id = $( event.relatedTarget ).attr("id");
              _top =  $( event.relatedTarget ).attr("_top");
             if(_top == 0) {msg ="确定将该搭配师置顶么?";
             }else{
             msg = "确定要取消置顶么?";
             }
              $('#bs-modal-istop .modal-body p').text( msg );
            });
     $('#bs-modal-istop').on( 'hidden.bs.modal' , function(){
            _id = '';

        });

   $('#bs-modal-istop [func="istop"]' ).on( 'click' , function(){
            var _url = '/admin/user/isTop?id='+_id;
                $.ajax( {
                    url     : _url,
                    dataType: 'json',
                    success : function( rtn ){
                        if( rtn.code == 200 ){
                        $('#searchForm').submit();
                        }else{
                          $('#bs-modal-istop').modal('hide');
                            showError( rtn.msg );

                        }
                    },
                    fail    : function( rtn ){
                   $('#bs-modal-istop').modal('hide');
                        showError( rtn.msg );
                    }
                } );
      });


        $('#bs-modal-add').on('show.bs.modal' , function(event){
        hideAndRmoveAllTips( $('#bs-modal-add .modal-body') );
        });
         $('#bs-modal-add [func="confirm"]' ).on( 'click' , function(){
          hideAndRmoveAllTips( $('#bs-modal-add .modal-body') );
          var _userId  = $('#userId').val().trim();
          var _cmsUserId =$('#cmsUserId').val().trim();
          var _reason = $('#reason').val().trim();
          var _type = document.getElementById("verifiedType").value;

            if(_userId != '' &&  _cmsUserId != '' && _reason != '' ){
                  var _url = '/admin/user/addData';
                        $.ajax( {
                            url     : _url,
                            data    :{
                             userId: _userId,
                             cmsUserId:_cmsUserId,
                             recommendReason:_reason,
                             verifiedType:_type
                            },
                            dataType: 'json',
                            success : function( rtn ){
                                if( rtn.code == 200 ){
                                gotoPage(1);
                                }else{
                                  $('#bs-modal-add').modal('hide');
                                    showError( rtn.msg );

                                }
                            },
                            fail    : function( rtn ){
                           $('#bs-modal-add').modal('hide');
                                showError( rtn.msg );
                            }
                        } );
             }
            else{
                     if( _userId == '' ){
                                addAndshowTips( $('#userId'), '“用户ID”不能为空!');
                     }
                     if( _cmsUserId == '' ){
                                addAndshowTips( $('#cmsUserId'), '“马甲ID”不能为空!');
                     }
                     if( _reason == '' ){
                                addAndshowTips( $('#reason'), '“推荐理由”不能为空!');
                     }
             }
      });

        function selectSetValue(val,obj){
          for(var i=0;i<obj.options.length;i++)
          {
            if(obj.options[i].text==val)
            {
             obj.options[i].selected=true;

            break;
            }
          }
        }

       $('#bs-modal-edit').on('show.bs.modal' , function(event){
        hideAndRmoveAllTips( $('#bs-modal-edit .modal-body') );
         var btn = $( event.relatedTarget );
           var cmsUserId = btn.closest('tr' ).find('td').eq(0).text();
           var userId = btn.closest('tr' ).find('td').eq(2).text();
           var verifiedType = btn.closest('tr' ).find('td').eq(4).text();
           var recommendReason = btn.closest('tr' ).find('td').eq(5).text();
           $('#userId_edit').val(userId);
           $('#cmsUserId_edit').val(cmsUserId);
           $('#verifiedType_edit').val(verifiedType);
           $('#reason_edit').val(recommendReason);
           $('#userCmsUserId').val(btn.attr('id'));
           var sel=document.getElementById('verifiedType_edit');
           selectSetValue(verifiedType,sel)

        });



         $('#bs-modal-edit [func="confirm"]' ).on( 'click' , function(){
          hideAndRmoveAllTips( $('#bs-modal-edit .modal-body') );
          var _userId  = $('#userId_edit').val().trim();
          var _cmsUserId =$('#cmsUserId_edit').val().trim();
          var _reason = $('#reason_edit').val().trim();
          var _type = document.getElementById("verifiedType_edit").value;

            if(_userId != '' &&  _cmsUserId != '' && _reason != '' ){
                  var _url = '/admin/user/updateData';
                        $.ajax( {
                            url     : _url,
                            data    :{
                             userId: _userId,
                             cmsUserId:_cmsUserId,
                             recommendReason:_reason,
                             userCmsUserId:$('#userCmsUserId').val().trim(),
                             verifiedType:_type
                            },
                            dataType: 'json',
                            success : function( rtn ){
                                if( rtn.code == 200 ){
                                $('#searchForm').submit();
                                }else{
                                  $('#bs-modal-edit').modal('hide');
                                    showError( rtn.msg );

                                }
                            },
                            fail    : function( rtn ){
                           $('#bs-modal-edit').modal('hide');
                                showError( rtn.msg );
                            }
                        } );
             }
            else{
                     if( _userId == '' ){
                                addAndshowTips( $('#userId_edit'), '“用户ID”不能为空!');
                     }
                     if( _cmsUserId == '' ){
                                addAndshowTips( $('#cmsUserId_edit'), '“马甲ID”不能为空!');
                     }
                     if( _reason == '' ){
                                addAndshowTips( $('#reason_edit'), '“推荐理由”不能为空!');
                     }
             }
      });
    var deleteBtn;
       $('#bs-modal-delete').on('show.bs.modal' , function(event){
        deleteBtn = $( event.relatedTarget );
       });

    $('#bs-modal-delete').on('hidden.bs.modal' , function(event){
            deleteBtn = {};
           });
   $('#bs-modal-delete [func="confirm"]' ).on( 'click' , function(){
          var _id = deleteBtn.attr('id');
                  var _url = '/admin/user/delete';
                        $.ajax( {
                            url     : _url,
                            data    :{
                             userCmsUserId:_id
                            },
                            dataType: 'json',
                            success : function( rtn ){
                                if( rtn.code == 200 ){
                                $('#searchForm').submit();
                                }else{
                                  $('#bs-modal-delete').modal('hide');
                                    showError( rtn.msg );

                                }
                            },
                            fail    : function( rtn ){
                           $('#bs-modal-delete').modal('hide');
                                showError( rtn.msg );
                            }
                        } );
      });
  $('#bs-modal-search').on('show.bs.modal' , function(event){
         hideAndRmoveAllTips( $('#bs-modal-search .modal-body') );
       });
 $('#bs-modal-search [func="confirm"]' ).on( 'click' , function(){
                hideAndRmoveAllTips( $('#bs-modal-search .modal-body') );
                 var _username = $('#username').val();
                 var _password = $('#password').val();
                  var _url = '/admin/user/search';
                        $.ajax( {
                            url     : _url,
                            data    :{
                             username:_username,
                             password:_password
                            },
                            dataType: 'json',
                            success : function( rtn ){
                                if( rtn.code == 200 ){
                                   $('#bs-modal-search').modal('hide');
                                   $('#userId').val(rtn.data);
                                }else{
                                 addAndshowError( $('#bs-modal-search .modal-body'),rtn.msg);
                                }
                            },
                            fail    : function( rtn ){
                       addAndshowError( $('#bs-modal-search .modal-body'),rtn.msg);
                            }
                        } );
      });

 $('#bs-modal-search-edit').on('show.bs.modal' , function(event){
         hideAndRmoveAllTips( $('#bs-modal-search-edit .modal-body') );
       });
 $('#bs-modal-search-edit [func="confirm"]' ).on( 'click' , function(){
                 hideAndRmoveAllTips( $('#bs-modal-search-edit .modal-body') );
                 var _username = $('#username_edit').val();
                 var _password = $('#password_edit').val();
                  var _url = '/admin/user/search';
                        $.ajax( {
                            url     : _url,
                            data    :{
                             username:_username,
                             password:_password
                            },
                            dataType: 'json',
                            success : function( rtn ){
                                if( rtn.code == 200 ){
                                   $('#bs-modal-search-edit').modal('hide');
                                   $('#userId_edit').val(rtn.data);
                                }else{
                                 addAndshowError( $('#bs-modal-search-edit .modal-body'),rtn.msg);

                                }
                            },
                            fail    : function( rtn ){
                          addAndshowError( $('#bs-modal-search-edit .modal-body'),rtn.msg);
                            }
                        } );
      });

    function gotoPage(page){
        $("#page").val(page);
        $("#searchForm").submit();
    }
    function addAndshowTips( obj , msg ){
                var _str = '<div class="col-lg-4 alertWrapper"><div class="alert alert-danger f-margin-bottom-0" role="alert">'+ msg +'</div></div>';
                obj.closest('.form-group').append( _str );
           }
    function hideAndRmoveAllTips( wrap ){
                wrap.find('.alertWrapper').remove();
            }
    function addAndshowError( wrap , msg ){
                var _str = '<div class="alert alert-danger alertWrapper" role="alert">'+ msg +'</div>';
                wrap.append( _str );
            }

          function showError( msg ){
        $('#bs-modal-error').on('show.bs.modal' , function(){
            $('#bs-modal-error .modal-body p').text( msg );
        });
        $('#bs-modal-error').modal('show');
    };

</script>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值