You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
351 lines
11 KiB
351 lines
11 KiB
<link href="__CDN__/assets/addons/qingdong/css/common.css?v={$Think.config.site.version}" rel="stylesheet">
|
|
|
|
<style type="text/css">
|
|
.btn-list {
|
|
position: fixed;
|
|
right: 40px;
|
|
}
|
|
.div-flex {
|
|
display: flex
|
|
}
|
|
.div-flex .form-group {
|
|
margin-right: 50px;
|
|
text-align: center;
|
|
line-height: 25px;
|
|
margin-bottom: 0;
|
|
}
|
|
.tab-pane {
|
|
border: 1px solid #F6F6F6;
|
|
}
|
|
.i-color {
|
|
font-size: 34px;margin-right: 10px;color: #86C3FF;
|
|
}
|
|
.thumbnail {
|
|
display: flow-root;
|
|
width: max-content;
|
|
}
|
|
.thumbnail img {
|
|
width: 50px;
|
|
float: left;
|
|
padding: 5px;
|
|
}
|
|
.text-color{
|
|
color:#777;
|
|
}
|
|
</style>
|
|
<style type="text/css">
|
|
.examine_title{
|
|
font-size: 14px;
|
|
color: #333;
|
|
-webkit-box-flex: 1;
|
|
-ms-flex: 1;
|
|
flex: 1;
|
|
display: block;
|
|
height: 30px;
|
|
}
|
|
.examine_box{
|
|
padding-left:20px;
|
|
position: relative;
|
|
}
|
|
.examine_box .newicon{
|
|
position: absolute;
|
|
left:0;
|
|
top:0;
|
|
z-index: 2;
|
|
}
|
|
.examine_box .xian{
|
|
width:1px;
|
|
height:100%;
|
|
background:#e6e6e6;
|
|
position: absolute;
|
|
left:4px;
|
|
top:10px;
|
|
z-index: 1;
|
|
}
|
|
.examine_box .examine_bg{
|
|
position: relative;
|
|
margin-top: 15px;
|
|
border-radius: 4px;
|
|
background-color: #f7f8fa;
|
|
font-size: 12px;
|
|
color: #929293;
|
|
padding: 8px;
|
|
line-height: 18px;
|
|
}
|
|
.rowbox{
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
align-items: center;
|
|
}
|
|
.stafflist{
|
|
width: 70px;text-align: center;float: left;
|
|
}
|
|
.stafflist-right{
|
|
width: 30px;text-align: center;float: left;margin: 0 20px;
|
|
|
|
}
|
|
.stafflist-right:last-child{
|
|
display: none;
|
|
}
|
|
.stafflist img{
|
|
width: 40px;
|
|
height: 40px;
|
|
margin: 10px;
|
|
border-radius:50%;
|
|
}
|
|
</style>
|
|
<style>
|
|
/* 使用弹性居中布局让所有分部居中水平排列 */
|
|
.steps {
|
|
padding: 20px;
|
|
display: flex;
|
|
justify-content: center;
|
|
width:100%;
|
|
}
|
|
|
|
/* 进度线宽，4份，25% */
|
|
.step {
|
|
width: 25%;
|
|
height: 20px;
|
|
}
|
|
|
|
/* 进度线和序号，使用弹性居中布局让序号和进度线居中 */
|
|
.step-progress {
|
|
display: flex;
|
|
justify-content: center;
|
|
}
|
|
|
|
/* 文本居中 */
|
|
.step-text {
|
|
width: 100%;
|
|
margin-top: 10px;
|
|
text-align: center;
|
|
}
|
|
|
|
/* 进度线 */
|
|
.step-line {
|
|
width: 100%;
|
|
height: 9px;
|
|
margin-top: 7px;
|
|
background-color: #cccccc;
|
|
}
|
|
|
|
/* 数字序号 */
|
|
.step-num {
|
|
width: 18px;
|
|
height: 18px;
|
|
line-height: 17px;
|
|
/* 圆角背景 */
|
|
border-radius: 50%;
|
|
color: #ffffff;
|
|
font-size: 16px;
|
|
/* 序号居中显示 */
|
|
text-align: center;
|
|
background-color: #cccccc;
|
|
border: 2px solid #cccccc;
|
|
/* 使用相对于父元素定位，强行回到原来的位置 */
|
|
position: absolute;
|
|
}
|
|
|
|
/* 使用渐变背景处理两边 */
|
|
.step-progress.right div{
|
|
background: linear-gradient(to right, #cccccc 0%, #cccccc 50%, transparent 51%, transparent 100%);
|
|
}
|
|
|
|
.step-progress.left div{
|
|
background: linear-gradient(to left, #cccccc 0%, #cccccc 50%, transparent 51%, transparent 100%);
|
|
}
|
|
|
|
/* 完成效果 */
|
|
.step-progress.done div{
|
|
background: #4395ff;
|
|
}
|
|
.step-progress.done span{
|
|
background-color: #4395ff;
|
|
border: 2px solid #4395ff;
|
|
}
|
|
|
|
/* 完成效果左右两边特制 */
|
|
.step-progress.right.done div{
|
|
background: linear-gradient(to right, #4395ff 0%, #4395ff 50%, transparent 51%, transparent 100%);
|
|
}
|
|
|
|
.step-progress.left.done div{
|
|
background: linear-gradient(to left, #4395ff 0%, #4395ff 50%, transparent 51%, transparent 100%);
|
|
}
|
|
</style>
|
|
|
|
<div class="panel panel-default panel-intro">
|
|
<input type="hidden" name="ids" id="ids" value="{$ids}"/>
|
|
<div class="div-flex">
|
|
<i class="fa fa-address-card i-color"></i>
|
|
<div style="line-height: 35px"><b>{$row.name}</b></div>
|
|
<div class="btn-list">
|
|
<a class="btn btn-success btn-status" data-id="{$row.id}">推进商机</a>
|
|
<a class="btn btn-success btn-edit" data-id="{$row.id}">编辑</a>
|
|
<a class="btn btn-success btn-transfer" data-id="{$row.id}"
|
|
data-title="转移商机" >转移</a>
|
|
<a class="btn btn-danger btn-danger btn-del" id="dels">删除</a>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="div-flex" style="margin-top: 20px">
|
|
|
|
|
|
<div class="form-group">
|
|
<span class="text-muted">客户名称</span>
|
|
<p>{if condition="isset($row.customer.name)"}{$row.customer.name}{/if}</p>
|
|
</div>
|
|
<div class="form-group">
|
|
<span class="text-muted">商机金额（元）</span>
|
|
<p>{$row.money}</p>
|
|
</div>
|
|
<div class="form-group">
|
|
<span class="text-muted">预计成交时间</span>
|
|
<p>{$row.expect_time}</p>
|
|
</div>
|
|
<div class="form-group">
|
|
<span class="text-muted">下次联系时间</span>
|
|
<p>{$row.next_time}</p>
|
|
</div>
|
|
<div class="form-group">
|
|
<span class="text-muted">负责人</span>
|
|
<p>{if condition="isset($row.owner_staff.name)"}{$row.owner_staff.name}{/if}</p>
|
|
</div>
|
|
</div>
|
|
<div class="div-flex" style="margin-bottom:30px;">
|
|
<!-- 步骤进度条 -->
|
|
<div class="steps">
|
|
<!-- 第一部分 -->
|
|
<div class="step">
|
|
<div class="step-progress left {if condition='$row.type egt 0'} done {/if}">
|
|
<div class="step-line"></div>
|
|
<span class="step-num">1</span>
|
|
</div>
|
|
<div class="step-text">
|
|
<span>初期沟通</span>
|
|
</div>
|
|
</div>
|
|
<!-- 第二部分 -->
|
|
<div class="step">
|
|
<div class="step-progress {if condition='$row.type egt 1'} done {/if}">
|
|
<div class="step-line"></div>
|
|
<span class="step-num">2</span>
|
|
</div>
|
|
<div class="step-text">
|
|
<span>立项跟踪</span>
|
|
</div>
|
|
</div>
|
|
<!-- 第三部分 -->
|
|
<div class="step">
|
|
<div class="step-progress {if condition='$row.type egt 2'} done {/if}">
|
|
<div class="step-line"></div>
|
|
<span class="step-num">3</span>
|
|
</div>
|
|
<div class="step-text">
|
|
<span>方案/报价</span>
|
|
</div>
|
|
</div>
|
|
<!-- 第四部分 -->
|
|
<div class="step">
|
|
<div class="step-progress {if condition='$row.type egt 3'} done {/if}">
|
|
<div class="step-line"></div>
|
|
<span class="step-num">4</span>
|
|
</div>
|
|
<div class="step-text">
|
|
<span>谈判审核</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="step">
|
|
<div class="step-progress right {if condition='$row.type egt 4'} done {/if}">
|
|
<div class="step-line"></div>
|
|
<span class="step-num">5</span>
|
|
</div>
|
|
<div class="step-text">
|
|
<span>{if condition='$row.type eq 5'} 输单 {elseif condition='$row.type eq 6'} 无效 {else\} 赢单 {/if}</span>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
</div>
|
|
<div>
|
|
|
|
<ul class="nav nav-tabs" role="tablist">
|
|
<li role="presentation" class="active"><a href="#record" aria-controls="home" role="tab" data-toggle="tab">跟进记录</a></li>
|
|
<li role="presentation"><a href="#basic" aria-controls="profile" role="tab" data-toggle="tab">基本信息</a></li>
|
|
<li role="presentation"><a href="#secord" aria-controls="profile" role="tab" data-toggle="tab">产品信息</a></li>
|
|
<li role="presentation"><a href="#third" aria-controls="profile" role="tab" data-toggle="tab">合同信息</a></li>
|
|
<li role="presentation"><a href="#four" aria-controls="profile" role="tab" data-toggle="tab">推进历史</a></li>
|
|
|
|
</ul>
|
|
|
|
<div class="tab-content" style="overflow-y: scroll;height:565px">
|
|
<div role="tabpanel" class="tab-pane fade active in panel-body" id="record">
|
|
|
|
<div id="toolbar_records" class="toolbar">
|
|
{:build_toolbar('refresh')}
|
|
<a class="btn btn-success btn-dialog {:$auth->check('qingdong/contract/record/add')?'':'hide'}"
|
|
data-url="qingdong/customer/business/record?ids={$row.id}" data-title="新建跟进" data-refresh="true" data-area=["90%","90%"]>新建跟进</a>
|
|
</div>
|
|
<table id="records" class="table table-striped table-bordered table-hover table-nowrap"
|
|
width="100%">
|
|
</table>
|
|
</div>
|
|
<div role="tabpanel" class="tab-pane fade panel-body form-horizontal" id="basic">
|
|
|
|
|
|
<div class="form-group">
|
|
<div class="col-xs-6 col-sm-5">
|
|
<div class="form-group col-sm-10">
|
|
<span class="text-muted">客户名称:</span>
|
|
<span class="text-black">{$row.customer.name}</span>
|
|
</div>
|
|
</div>
|
|
{include file="qingdong/common/form_detail" /}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div role="tabpanel" class="tab-pane fade panel-body form-horizontal" id="secord">
|
|
|
|
<div id="toolbar_secord" class="toolbar">
|
|
{:build_toolbar('refresh')}
|
|
</div>
|
|
<table id="product" class="table table-striped table-bordered table-hover table-nowrap"
|
|
width="100%">
|
|
</table>
|
|
</div>
|
|
|
|
<div role="tabpanel" class="tab-pane fade panel-body form-horizontal" id="third">
|
|
|
|
<div id="toolbar_third" class="toolbar">
|
|
{:build_toolbar('refresh')}
|
|
<a class="btn btn-success btn-dialog {:$auth->check('qingdong/customer/contract/add')?'':'hide'}"
|
|
data-url="qingdong/customer/contract/add?business_id={$row.id}&customer_id={$row.customer_id}" data-title="新建合同" data-refresh="true" data-area=["90%","90%"] >新建合同</a>
|
|
</div>
|
|
<table id="contract" class="table table-striped table-bordered table-hover table-nowrap"
|
|
width="100%">
|
|
</table>
|
|
</div>
|
|
|
|
<div role="tabpanel" class="tab-pane fade panel-body form-horizontal" id="four">
|
|
|
|
<div id="toolbar_four" class="toolbar">
|
|
{:build_toolbar('refresh')}
|
|
</div>
|
|
<table id="history" class="table table-striped table-bordered table-hover table-nowrap"
|
|
width="100%">
|
|
</table>
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|