SOURCE

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>云配送-报修处理</title>
</head>
<body>
    <div class="header">
        <div>报修处理</div>
        <div class="nav">
        <span>
        报修时间
        </span>
           
          <input type="date">
        <span>
        到    
        </span>   
        <input type="date">


        <button class="button" type="button">
        查询
        </button>

         <button class="button" type="button">
        报修处理
        </button>

         <button class="button" type="button">
        导出Excel
        </button>

         <button class="button" type="button">
        高级查询
        </button>

         <button class="button" type="button">
        微信回复
        </button>



        </div>
        

       <div class="context">
        <div>
            <table>
            <!-- 表头 -->
            <thead>
                <tr>
                    <th> <input type="checkbox"></th>
                    <th>状态</th>
                    <th>门店名称</th>
                    <th>报修日期</th>
                    <th>客户名称</th>
                    <th>地址</th>
                    <th>客户电话</th>
                    <th>报修信息</th>
                    <th>维修类型</th>
                    <th>预约时间</th>
                    <th>短信接受号码</th>
                    <th>维修方法</th>
                    <th>维修结果</th>
                    <th>维修费</th>
                    <th>维修人</th>
                    <th>照片</th>
                    <th>订单来源</th>
                    <th>回复时间</th>
                    <th>备注</th>
                   
                

                </tr>

                <tr>
                    <th> <input type="checkbox"></th>
                    <th>待维修</th>
                    <th>组别</th>
                    <th>2020/12/20</th>
                    <th>吕布</th>
                    <th>三国小沛</th>
                    <th>6653487</th>
                    <th>煤气瓶漏气</th>
                    <th>漏气</th>
                    <th>2020/12/21 12:31:06</th>
                    <th>17563523645</th>
                    <th>更换胶垫，阀门和管子连接处检查</th>
                    <th>已完成</th>
                    <th>50</th>
                    <th>郭攸</th>
                    <th>无</th>
                    <th>正常维修单</th>
                    <th>2020/12/21 12:40:06</th>
                    <th>客户操作不当导致漏气</th>
                </tr>
            </thead>


        </div>


    </div>

  


</body>
</html>

/* 分页样式 */

ul.page {
    display: inline-block;
    padding: 0;
    margin: 0;
}

ul.page li {
    display: inline;
    }

ul.page li a {
    color: black;
    float: left;
    padding: 8px 15px;
    text-decoration: none;
    transition: background-color .3s;
    border: 1px solid #ddd;
    margin: 0 4px;
}

ul.page li a.active {
    background-color: darkcyan;
    color: white;
    border: 1px solid darkcyan;
}

ul.page li a:hover:not(.active) {
    background-color: #ddd;
}