Commit 49c56b0e by xueyuanyuan

提交

parent 2e3f1e7b
...@@ -44,8 +44,10 @@ header .home{ ...@@ -44,8 +44,10 @@ header .home{
header .home .fa-home{ header .home .fa-home{
margin-right: 10px; margin-right: 10px;
} }
header .left .fa-bars{ header .bar .fa-bars{
color: #fff; position: absolute;
left: -90px;
top: 5px;
} }
.main{ .main{
height: 1000px; height: 1000px;
......
.type-container{
background-color: #ECF0F5;
}
.type-container .subnav{
font-size: 16px;
font-weight: 700;
height: 58px;
line-height: 58px;
display: flex;
justify-content: space-around;
}
.type-container .subnav span{
font-weight: normal;
}
.subnav .colorspan{
color: #5199C3;
}
.subnav .phone{
display: inline-block;
width: 100px;
height: 20px;
line-height: 20px;
text-align: center;
color: #fff;
border-radius: 4px;
cursor: pointer;
background-color: #00C0EF;
font-weight: normal;
font-size: 14px;
}
.particulars{
padding: 0 60px;
}
.particulars span{
margin-right: 20px;
}
.title{
margin-bottom: 20px;
}
.particulars .bg{
display: block;
height: 15px;
width: 100%;
background-color: #DAE8F1;
margin: 10px 0;
}
.title select{
width: 130px;
height: 30px;
border-radius: 4px;
}
.beizhu{
background-color: #fff;
}
.beizhu span{
vertical-align: top;
}
.beizhu textarea{
width: 90%;
margin-left: 5px;
}
.type-container .btn{
width: 91%;
margin-left: 60px;
margin-top: 10px;
background-color: #00A65A;
border-color: #00A65A;
}
.table thead{
background-color: #DDE9F3;
}
\ No newline at end of file
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
<!-- Bootstrap 核心 CSS 文件 --> <!-- Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css"> <link rel="stylesheet" href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="./css/return-order.css"> <link rel="stylesheet" href="./css/return-order-index.css">
<script src="./js/jquery.min.js"></script> <script src="./js/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
</head> </head>
...@@ -17,15 +17,15 @@ ...@@ -17,15 +17,15 @@
<header> <header>
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row">
<div class="col-md-2"> <div class="col-xs-4 col-sm-4 col-md-3">
<a href="#" class="home"><i class="fa fa-home" aria-hidden="true"></i>YiDianLing.com</a> <a href="#" class="home"><i class="fa fa-home" aria-hidden="true"></i>YiDianLing.com</a>
</div> </div>
<div class="col-md-10"> <div class="col-xs-8 col-sm-8 col-md-9">
<div class="row"> <div class="row">
<div class="col-sm-2 col-md-3 col-lg-6"> <div class="col-sm-2 col-md-2 col-lg-5">
<a href="#" class="bar"><i class="fa fa-bars" aria-hidden="true"></i></a> <a href="#" class="bar"><i class="fa fa-bars" aria-hidden="true"></i></a>
</div> </div>
<div class="col-sm-10 col-md-9 col-lg-6 info"> <div class="col-sm-10 col-md-10 col-lg-7 info">
<a href="#">即将回收的客户<i class="circle">5</i></a> <a href="#">即将回收的客户<i class="circle">5</i></a>
<a href="#"><i class="fa fa-upload" aria-hidden="true"></i>上传</a> <a href="#"><i class="fa fa-upload" aria-hidden="true"></i>上传</a>
<a href="#"><i class="fa fa-upload" aria-hidden="true"></i>备用上传</a> <a href="#"><i class="fa fa-upload" aria-hidden="true"></i>备用上传</a>
...@@ -41,7 +41,7 @@ ...@@ -41,7 +41,7 @@
<div class="main"> <div class="main">
<div class="container-fluid main-container"> <div class="container-fluid main-container">
<div class="row"> <div class="row">
<div class="col-md-2 aside"> <div class="col-xs-6 col-sm-4 col-md-2 aside">
<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true"> <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
<div class="panel panel-default"> <div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingOne"> <div class="panel-heading" role="tab" id="headingOne">
...@@ -141,7 +141,7 @@ ...@@ -141,7 +141,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-10 digital-container"> <div class="col-xs-6 col-sm-8 col-md-10 digital-container">
<div class="subnav"> <div class="subnav">
<h3>工单类型</h3> <h3>工单类型</h3>
<button type="button" class="btn btn-default select">全部</button> <button type="button" class="btn btn-default select">全部</button>
......
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>回访工单</title>
<!-- Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="./css/return-order-index.css">
<link rel="stylesheet" href="./css/return-order-type.css">
<script src="./js/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
</head>
<body>
<!-- 头部 -->
<header>
<div class="container-fluid">
<div class="row">
<div class="col-xs-4 col-sm-4 col-md-3">
<a href="#" class="home"><i class="fa fa-home" aria-hidden="true"></i>YiDianLing.com</a>
</div>
<div class="col-xs-8 col-sm-8 col-md-9">
<div class="row">
<div class="col-sm-2 col-md-2 col-lg-5">
<a href="#" class="bar"><i class="fa fa-bars" aria-hidden="true"></i></a>
</div>
<div class="col-sm-10 col-md-10 col-lg-7 info">
<a href="#">即将回收的客户<i class="circle">5</i></a>
<a href="#"><i class="fa fa-upload" aria-hidden="true"></i>上传</a>
<a href="#"><i class="fa fa-upload" aria-hidden="true"></i>备用上传</a>
<a href="#"><i class="fa fa-upload" aria-hidden="true"></i>海外收款</a>
<a href="#" class="user-img"><img src="./images/avatar.jpg" alt="">admin</a>
</div>
</div>
</div>
</div>
</div>
</header>
<!-- 主体部分 -->
<div class="main">
<div class="container-fluid main-container">
<div class="row">
<!-- 左侧边栏 -->
<div class="col-xs-6 col-sm-4 col-md-2 aside">
<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingOne">
<h4 class="panel-title">
<a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
<i class="fa fa-user" aria-hidden="true"></i><span>
用户
</span>
<i class="fa fa-angle-left right" aria-hidden="true"></i>
</a>
</h4>
</div>
<div id="collapseOne" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
<div class="panel-body">
<a href="#">我的工作台</a>
<a href="#">我的工作台</a>
<a href="#">我的工作台</a>
<a href="#">我的工作台</a>
<a href="#">我的工作台</a>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingTwo">
<h4 class="panel-title">
<a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
<i class="fa fa-diamond" aria-hidden="true"></i>业务
<i class="fa fa-angle-left right" aria-hidden="true"></i>
</a>
</h4>
</div>
<div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
<div class="panel-body">
<a href="#">我的工作台</a>
<a href="#">我的工作台</a>
<a href="#">我的工作台</a>
<a href="#">我的工作台</a>
<a href="#">我的工作台</a>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingThree">
<h4 class="panel-title">
<a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
<i class="fa fa-user-secret" aria-hidden="true"></i>
专家<i class="fa fa-angle-left right" aria-hidden="true"></i>
</a>
</h4>
</div>
<div id="collapseThree" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree">
<div class="panel-body">
<a href="#">我的工作台</a>
<a href="#">我的工作台</a>
<a href="#">我的工作台</a>
<a href="#">我的工作台</a>
<a href="#">我的工作台</a>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingFour">
<h4 class="panel-title">
<a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
<i class="fa fa-bar-chart" aria-hidden="true"></i>
市场运营<i class="fa fa-angle-left right" aria-hidden="true"></i>
</a>
</h4>
</div>
<div id="collapseFour" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingFour">
<div class="panel-body">
<a href="#">我的工作台</a>
<a href="#">我的工作台</a>
<a href="#">我的工作台</a>
<a href="#">我的工作台</a>
<a href="#">我的工作台</a>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingFive">
<h4 class="panel-title">
<a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseFive" aria-expanded="false" aria-controls="collapseFive">
<i class="fa fa-bookmark" aria-hidden="true"></i>工单管理<i class="fa fa-angle-left right" aria-hidden="true"></i>
</a>
</h4>
</div>
<div id="collapseFive" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingFive">
<div class="panel-body">
<a href="#">我的工作台</a>
<a href="#">我的工作台</a>
<a href="#">我的工作台</a>
<a href="#">我的工作台</a>
<a href="#">我的工作台</a>
</div>
</div>
</div>
</div>
</div>
<div class="col-xs-6 col-sm-8 col-md-10 digital-container type-container">
<div class="subnav">
<p>订单号:<span class="colorspan">921348348925429</span></p>
<p>咨询师:<span class="colorspan">蓝奥</span></p>
<p>手机号:<a class="phone">查看手机号</a></p>
<p>接受客服:<span>范丽娜</span></p>
<p>回访人员(已分配):<span>范丽娜</span></p>
</div>
<div class="particulars">
<span class="bg"></span>
<div class="title">
<span>接通状态:</span>
<select name="on-state" >
<option value="">请选择</option>
<option value="">接通状态</option>
</select>
</div>
<div class="beizhu">
<span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;注:</span><textarea name="beizhu" id="" cols="150" rows="3"></textarea>
</div>
</div>
<div class="particulars">
<span class="bg"></span>
<div class="title">
<span>短信发送:</span>
<select name="on-state" >
<option value="">请选择</option>
<option value="">短信发送</option>
</select>
</div>
<div class="beizhu">
<span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;注:</span><textarea name="beizhu" id="" cols="150" rows="3"></textarea>
</div>
</div>
<div class="particulars">
<span class="bg"></span>
<div class="title">
<span>咨询效果:</span>
<select name="on-state" >
<option value="">请选择</option>
<option value="">咨询效果</option>
</select>
</div>
<div class="beizhu">
<span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;由:</span><textarea name="beizhu" id="" cols="150" rows="3"></textarea>
</div>
</div>
<button type="button" class="btn btn-primary">处理完成</button>
<!-- 操作记录 -->
<div class="operation-record particulars">
<h4>操作记录</h4>
<table class="table">
<thead>
<tr>
<th>时间</th>
<th>操作人</th>
<th>操作类型</th>
<th>操作内容</th>
</tr>
</thead>
<tbody>
<tr>
<td scope="row">2018-06-23 13:42:23</td>
<td>王丽品</td>
<td>分配</td>
<td>分配订单,回访人员改成:范丽娜</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<script>
$('.bar').click(function(){
$('.aside').toggleClass('visible');
$('.digital-container').toggleClass('width');
})
$('.nav-tabs a').click(function (e) {
e.preventDefault()
$(this).tab('show')
})
</script>
</body>
</html>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment