kehulist.html 5.0 KB
<include file="public@header" />
<style>
  /*分页样式*/
  .pagination{text-align:center;margin-top:20px;margin-bottom: 20px;}
  .pagination li{margin:0px 10px; border:1px solid #e6e6e6;padding: 3px 8px;display: inline-block;}
  .pagination .active{background-color: #dd1a20;color: #fff;}
  .pagination .disabled{color:#aaa;}
</style>
</head>
<body>
  <table class="table table-bordered" style="margin:10px 10px;">
    <caption>客户资料列表</caption>
    <thead>
      <tr>
        <th>ID</th>
        <th>姓名</th>
        <th>电话</th>
        <th>邮箱</th>
        <th>状态</th>
        <th>操作</th>
      </tr>
    </thead>
    <tbody>
      <volist name="data" id="vo">
        <tr class="tr{$vo.id}">
          <td>{$vo.id}</td>
          <td>{$vo.name}</td>
          <td>{$vo.phone}</td>
          <td>{$vo.email}</td>
          <td>

              <if condition="$vo.status eq 0">
                <span style="color: green;">未处理</span>
              <else />
                <span style="color: red;">已处理</span>
              </if>

          </td>
          <td>
            <button type="button" class="btn btn-default" data-toggle="modal" data-target="#myModal" onclick="look({$vo.id})">查看</button>
            <button type="button" class="btn btn-default" onclick="del({$vo.id})">删除</button>
          </td>
        </tr>
      </volist>
    </tbody>
  </table>
  <div class="pagination">
    {$data->render()}
  </div>

  <!--查看模态框-->
  <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
      <div class="modal-dialog">
          <div class="modal-content">
              <div class="modal-header">
                  <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                  <h4 class="modal-title" id="myModalLabel">查看客户资料</h4>
              </div>
              <div class="modal-body">

                  <div class="input-group" style="margin-top: 5px;">
                      <span class="input-group-addon">姓名:</span>
                      <input type="text" class="form-control" value="" disabled="disabled" name="name">
                  </div>
                  <div class="input-group" style="margin-top: 5px;">
                      <span class="input-group-addon">电话:</span>
                      <input type="text" class="form-control" value="" disabled="disabled" name="phone">
                  </div>
                  <div class="input-group" style="margin-top: 5px;">
                      <span class="input-group-addon">邮箱:</span>
                      <input type="text" class="form-control" value="" disabled="disabled" name="email">
                  </div>
                  <div class="input-group" style="margin-top: 5px;">
                      <span class="input-group-addon">内容:</span>

                      <textarea style="width: 500px;height: 150px;" disabled="disabled" id="content"></textarea>
                  </div>
                 <div class="radio">
                     <label>
                         <input type="radio" name="optionsRadios" id="optionsRadios1" value="0" class="wei" > 未处理
                     </label>

                 </div>
                 <div class="radio">
                     <label>
                         <input type="radio" name="optionsRadios" id="optionsRadios1" value="1" class="yi" > 已处理
                     </label>
                 </div>
                  <input type="hidden" name="id" value="">
              </div>
              <div class="modal-footer">
                  <button type="button" class="btn btn-default guanbi" data-dismiss="modal">关闭</button>
                  <button type="button" class="btn btn-primary" onclick="subm()">提交更改</button>
              </div>
          </div><!-- /.modal-content -->
      </div><!-- /.modal -->
  </div>
<script>

  //点击查看
  function look(id){

    $.post("{:url('Kehu/khlook')}", {id:id}, function(data) {
      shuju = JSON.parse(data);
      $("input[name='id']").val(shuju.id);
      $("input[name='name']").val(shuju.name);
      $("input[name='phone']").val(shuju.phone);
      $("input[name='email']").val(shuju.email);
      $('#content').val(shuju.content);
      if(shuju.status == 0){
        $('.wei').prop('checked','true');
      }else{
        $('.yi').prop('checked','true');
      }
    });

  }

  //提交更改
  function subm(){

   id = $("input[name='id']").val();
   status = $("input[name='optionsRadios']:checked").val();
   $.post("{:url('Kehu/khup')}", {id:id,status:status}, function(data) {
      /*$('.guanbi').trigger('click');*/
      window.location.reload();
   });
  }

  //删除客户
  function del(id){

    ccc = window.confirm('是否删除客户资料?');
    if(ccc){
       $.post("{:url('Kehu/khdel')}", {id:id}, function(data) {
          if(data){
             $('.tr'+id).remove();
          }
      });
    }



  }

</script>

</body>
</html>