安图前端代码

orderArea.html 4.2KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>工单地区</title>
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <script src="../Script/Common/huayi.load.js"></script>
  8. <script src="../Script/Common/huayi.config.js"></script>
  9. <link rel="stylesheet" href="../css/laydate/need/laydate.css" />
  10. <!--<link href="../css/Table/table1.css" rel="stylesheet" />-->
  11. <link rel="stylesheet" href="../css/init.css" />
  12. <!--<script src="../My97DatePicker/WdatePicker.js"></script>-->
  13. <style>
  14. table td {
  15. word-break: break-all;
  16. word-wrap: break-word;
  17. }
  18. .add_time input{
  19. width: 50%;
  20. }
  21. .laydate-icon{
  22. height: initial!important;
  23. }
  24. table#list{
  25. font-size: 12px;
  26. margin-top: 20px;
  27. }
  28. table#list thead tr td {
  29. background: #1ab394;
  30. color: #fff;
  31. }
  32. </style>
  33. </head>
  34. <body class="gray-bg">
  35. <div class="daoHang clearfix">
  36. <div class="dhLeft" >
  37. <sapn><i class="syIcon"></i>位置:<a href="javaScript:;" id="ReIndex">首页</a>&gt;<a href="javaScript:;">报表管理</a>&gt;<a href="" style="color: #000;">工单地区</a></sapn>
  38. </div>
  39. <div class="dhRight">
  40. <a href="#" title="刷新"><i class="fa fa-refresh"></i></a>
  41. </div>
  42. </div>
  43. <div class="wrapper wrapper-content animated fadeInRight">
  44. <div class="toolBox">
  45. <div class="th-bar clearfix">
  46. <div class="pull-left">
  47. <div class="form-inline">
  48. <div class="form-group">
  49. <input type="text" class="form-control laydate-icon" id="startTime" placeholder="开始时间"/>
  50. </div>
  51. <div class="form-group">
  52. <input type="text" class="form-control laydate-icon" id="endTime" placeholder="结束时间"/>
  53. </div>
  54. </div>
  55. </div>
  56. <div class="pull-right">
  57. <button class="btns search">搜索</button>
  58. <a href="" class="btns export">导出</a>
  59. </div>
  60. </div>
  61. </div>
  62. <div style="width: 100%;padding: 10px;">
  63. <table id="list" class="table table-bordered text-center table-hover" style="width: 100%;">
  64. <thead>
  65. </thead>
  66. <tbody class="tbody">
  67. </tbody>
  68. </table>
  69. </div>
  70. </div>
  71. <script src="../css/laydate/laydate.js"></script>
  72. <script>
  73. $(document).ready(function () {
  74. /*日期选择*/
  75. laydate.skin('molv');
  76. /*开始日期*/
  77. laydate({
  78. elem: '#startTime',
  79. event: 'focus'
  80. });
  81. laydate({
  82. elem: '#endTime',
  83. event: 'focus'
  84. });
  85. /*搜索*/
  86. $(".search").click(function () {
  87. initTable();
  88. })
  89. //导出
  90. $('.export').click(function() {
  91. dcexcel(this);
  92. })
  93. function dcexcel(obj) {
  94. var dpt = "";
  95. var url = huayi.config.callcenter_url + "GDPos/ExportExcel?token=" + $.cookie("token");
  96. url += "&stime=" + $('#startTime').val() + "&endtime=" + $('#endTime').val();
  97. obj.href = url;
  98. }
  99. initTable();
  100. })
  101. //表内数据
  102. function initTable() {
  103. $('#list tbody').html('');
  104. $('#list thead').html('');
  105. $.ajax({
  106. type:'get',
  107. url:huayi.config.callcenter_url+"GDPos/GetDataList",
  108. async:true,
  109. dataType:'json',
  110. data:{
  111. token:$.cookie("token"),
  112. stime:$('#startTime').val(),
  113. endtime:$('#endTime').val()
  114. },
  115. success:function(res){
  116. var thead=res.data.colname;
  117. var thead_trs='<tr>'
  118. $(thead).each(function(i,n){
  119. thead_trs +='<td>' + n + '</td>'
  120. })
  121. thead_trs +='</tr>';
  122. $('#list thead').append(thead_trs);
  123. var tbody=res.data.dt;
  124. $(tbody).each(function(k,g){
  125. var str="";
  126. str='<tr>'
  127. $.each(g,function(k,val){
  128. str +='<td>' + val + '</td>'
  129. })
  130. str +='</tr>';
  131. $('#list tbody').append(str);
  132. })
  133. }
  134. })
  135. }
  136. </script>
  137. </body>
  138. </html>