| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>呼叫明细报表</title>
- <script src="../Script/Common/huayi.load.js"></script>
- <script src="../Script/Common/huayi.config.js"></script>
- <link href="../css/bootstrap.min.css" />
- <link href="../css/init.css" rel="stylesheet" />
- <link rel="stylesheet" href="../css/boot/bootstrap-table.css" />
- <style>
- .kpi-top {
- background: #f3f3f4;
- padding: 10px 20px;
- margin: 30px 0;
- }
-
- .topCon {
- float: left;
- margin-left: 70px;
- }
-
- .kpi-content h2 {
- font-size: 18px;
- margin-bottom: 20px;
- }
-
- .kpi-content {
- width: 90%;
- margin: 0 auto;
- }
-
- .kpi-table table {
- font-size: 12px;
- }
-
- .kpi-table table thead tr td {
- background: #1ab394;
- color: #fff;
- font-size: 14px;
- }
- #table1 thead tr{
- background-color: rgb(26,179,148);
- color: #fff;
- }
- </style>
- </head>
- <body class="gray-bg">
- <div class="hwkpi">
- <div class="daoHang clearfix">
- <div class="dhLeft">
- <sapn><i class="syIcon"></i>位置:
- <a id="ReIndex" href="javaScript:;">首页</a>>
- <a href="javaScript:;">报表分析</a>>
- <a href="javaScript:;">业务数据分析</a>>
- <a href="" class="nowPosition">回访报表</a>
- </sapn>
- </div>
- </div>
- <div class="kpi-top clearfix form-inline">
- <div class="topCon">
- 查询日期:
- <input type="text" class="form-control" id="startTime" style="margin-right: 20px;"/>
- 工单类型:
- <select class="form-control" id="gdlx">
- <option value="0">请选择</option>
- <option value="1">咨询</option>
- <option value="2">投诉</option>
- <option value="3">抽检</option>
- <option value="4">建议及其他</option>
- </select>
- <button class="btns sear">搜索</button>
- </div>
- </div>
- <div class="kpi-content">
- <div class="kpi-table">
- <table id="table1" data-row-style="rowStyle" data-query-params="queryParams">
- <thead>
- <tr>
- <th data-field="评分维度" data-align="center">评分维度</th>
- <th data-field="非常满意(9-10)" data-align="center">非常满意(9-10)</th>
- <th data-field="满意(7-8)" data-align="center">满意(7-8)</th>
- <th data-field="一般(5-6)" data-align="center">一般(5-6)</th>
- <th data-field="不满意(5分以下)" data-align="center">不满意(5分以下)</th>
- </tr>
- </thead>
- </table>
- </div>
- </div>
- </div>
- <script src="../js/laydate/laydate.js"></script>
- <script>
- var token = $.cookie("token"),
- endtime='' , //结束时间
- stime='' ; //开始时间
- var $tableLeft1 = $('#table1');
- $(function() {
- laydate.render({
- elem: '#startTime',
- range: '~',
- theme: '#1ab394'
- });
- Ajax();
- //搜索事件
- $(".sear").click(function() {
- $('.thTable tbody').html('');
- Ajax();
- });
- });
-
- function Ajax() {
- //销毁表格
- $tableLeft1.bootstrapTable('destroy');
- //初始化表格,动态从服务器加载数据
- $tableLeft1.bootstrapTable({
- method: "get", //使用get请求到服务器获取数据
- url: huayi.config.callcenter_url + "WOReport/GetVisiteSatisfiedReport",
- contentType: 'application/x-www-form-urlencoded',
- striped: true, //表格显示条纹
- pagination: false, //启动分页
- pageSize: 10, //每页显示的记录数
- pageNumber: 1, //当前第几页
- pageList: [5, 30, 50, 100], //记录数可选列表
- search: false, //是否启用查询
- showColumns: false, //显示下拉框勾选要显示的列
- showRefresh: false, //显示刷新按钮
- sidePagination: "server", //表示服务端请求
- //设置为undefined可以获取pageNumber,pageSize,searchText,sortName,sortOrder
- //设置为limit可以获取limit, offset, search, sort, order
- queryParamsType: "undefined",
- responseHandler: function(res) {
- //格式化数据
- return {
- // "total": res.total, //总页数
- "rows": res//数据
- };
- },
- queryParams: function queryParams(params) { //设置查询参数
- var param = {
- // export:0,
- stime:$('#startTime').val() && $('#startTime').val().split(' ~ ')[0],
- endtime:$('#startTime').val() && $('#startTime').val().split(' ~ ')[1],
- type:$('#gdlx').val(),
- token: token
- };
- return param;
- },
- onLoadSuccess: function() { //加载成功时执行
- // layer.msg("加载成功");
- },
- onLoadError: function() { //加载失败时执行
- //layer.msg("加载数据失败", { time: 1500, icon: 2 });
- }
- });
- }
- </script>
- </body>
- </html>
|