Commit 1edf88eb authored by xishifeng's avatar xishifeng

客户列表,商铺详情添加

parent 24f8bd9a
...@@ -101,7 +101,7 @@ ...@@ -101,7 +101,7 @@
<div class="fl">房东:</div> <div class="fl">房东:</div>
<div class="fl"> <div class="fl">
<ul class="oh phone-list"> <ul class="oh phone-list">
<li class="fl oh" v-for="(item, index) in d.landlord_phone" :key="index"><span>{{item.name+'-'+hidePhone(item.phone)}}</span><a href="javascript:;" class="call-tel-btn" @click="callHide(item.phone)">拨打</a></li> <li class="fl oh" v-for="(item, index) in d.landlord_phone" :key="index"><span>{{item.name+'-'+hidePhone(item.phone)}}</span><a href="javascript:;" class="call-tel-btn" @click="showModal1(item)">拨打</a></li>
</ul> </ul>
</div> </div>
</td> </td>
...@@ -142,7 +142,7 @@ ...@@ -142,7 +142,7 @@
<section v-show="dataCode!=200"></section> <section v-show="dataCode!=200"></section>
</main> </main>
<div id="call_modal"> <div id="call_modal" v-show="modalShow1">
<div class="call-modal-main"> <div class="call-modal-main">
<p class="call-modal-main-title">选择本机手机号</p> <p class="call-modal-main-title">选择本机手机号</p>
<ol id="call_modal_phone_list"> <ol id="call_modal_phone_list">
...@@ -156,21 +156,19 @@ ...@@ -156,21 +156,19 @@
<p class="call-modal-main-tip">请确认选择的手机号和本机号码相同,否则提示为空号</p> <p class="call-modal-main-tip">请确认选择的手机号和本机号码相同,否则提示为空号</p>
</div> </div>
<div class="call-btn-area"> <div class="call-btn-area">
<div id="call_btn_cancel">取消</div> <div id="call_btn_cancel" @click="modalShow1=false">取消</div>
<div id="call_btn_ok">确认</div> <div id="call_btn_ok" v-show="!isCallFlag" @click="showModal2">确认</div>
<div id="call_btn_ok_temp">等待拨打 ing</div> <div id="call_btn_ok_temp" v-show="isCallFlag">等待拨打 ing</div>
</div> </div>
</div> </div>
<div class="modal-area" v-show="maskShowFlag"> <div class="modal-area" v-show="modalShow2">
<div class="call-hide-area" v-show="callShowFlag"> <div class="call-hide-area">
<p>请使用{{user_info_obj.phone}}的手机拨打该虚拟号:</p> <p>请使用{{selectPhone}}的手机拨打该虚拟号:</p>
<p>(使用其他手机号拨打是打不通的)</p> <p>(使用其他手机号拨打是打不通的)</p>
<p>{{telHide}}</p> <p>{{telHide}}</p>
<p> <textarea v-model.trim="content" placeholder="请输入房源跟进信息(必填)"></textarea>
<a href="javascript:;" @click="releaseTel">没打通</a> <p><a href="javascript:;" @click="saveGenjin">保存</a></p>
<a href="javascript:;" @click="maskShowFlag=false">已拨打</a>
</p>
</div> </div>
</div> </div>
</div> </div>
......
...@@ -717,7 +717,8 @@ ...@@ -717,7 +717,8 @@
<td> <td>
<span class="fore-span">电话:</span> <span class="fore-span">电话:</span>
<span class="fore-span cus_phone"></span> <span class="fore-span cus_phone"></span>
<a class="fore-span btn-primary user_call" href="#modal-call" data-toggle="modal">拨打</a> <!--<a class="fore-span btn-primary user_call" href="#modal-call" data-toggle="modal">拨打</a>-->
<a class="fore-span btn-primary user_call" >拨打</a>
</td> </td>
</tr> </tr>
<tr> <tr>
...@@ -1116,6 +1117,60 @@ ...@@ -1116,6 +1117,60 @@
</div> </div>
<!-- /.modal --> <!-- /.modal -->
</div> </div>
<!--拨打电话弹框相关-->
<div id="call_modal">
<div class="call-modal-main">
<p class="call-modal-main-title">选择本机手机号</p>
<ol id="call_modal_phone_list">
<li class="call-select"><input placeholder="请输入本机手机号" maxlength="11" type="tel" id="call_modal_phone_self" readonly="" />
<div class="call-edit-icon">完成</div>
<div class="call-submit-ing-icon">提交中ing</div>
<div class="call-select-icon"><img src="/app/images/ic_duigou_gre.png" /></div>
</li>
</ol>
<div id="add_phone_btn">增加手机号</div>
<p class="call-modal-main-tip">请确认选择的手机号和本机号码相同,否则提示为空号</p>
</div>
<div class="call-btn-area">
<div id="call_btn_cancel">取消</div>
<div id="call_btn_ok">确认</div>
<div id="call_btn_ok_temp">等待拨打 ing</div>
</div>
</div>
<!--/拨打电话弹框相关-->
<div id="genjin_modal">
<div class="genjin-modal-main">
<div class="call-hide-area">
<p>请使用<span></span>的手机拨打该虚拟号:</p>
<p>(使用其他手机号拨打是打不通的)</p>
<p></p>
</div>
<div class="genjin-content-area"><textarea placeholder="请输入跟进信息" id="content"></textarea></div>
<div class="genjin-mark-area">
<div class="genjin-mark-area-putong">
<div class="genjin-mark-area-title">普通标签:(必选)</div>
<div class="genjin-mark-area-alink"></div>
</div>
<div class="genjin-mark-area-zhuangtai">
<div class="genjin-mark-area-title">状态标签:(必选)</div>
<div class="genjin-mark-area-alink">
<a data-markid="-1">无效</a>
<a data-markid="1">已租</a>
<a data-markid="0">求租</a>
</div>
</div>
</div>
<div class="genjin-submit-area">
<a href="javascript:;" id="btn_save">提交</a>
<a href="javascript:;" id="btn_save_temp">正在保存...</a>
</div>
</div>
<div id="close_btn"><img src="/app/images/ic_cha.png" /></div>
</div>
<!--客户编辑--> <!--客户编辑-->
<div class="modal fade" id="modal-record-edit" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal fade" id="modal-record-edit" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog modal-body-details"> <div class="modal-dialog modal-body-details">
......
客户列表
view-->member-->user_list.html
\ No newline at end of file
...@@ -65,7 +65,6 @@ tbody>tr:nth-of-type(16){ ...@@ -65,7 +65,6 @@ tbody>tr:nth-of-type(16){
} }
.call-hide-area{ .call-hide-area{
width: 400px; width: 400px;
height: 300px;
background-color: white; background-color: white;
padding: 20px; padding: 20px;
} }
...@@ -75,7 +74,7 @@ tbody>tr:nth-of-type(16){ ...@@ -75,7 +74,7 @@ tbody>tr:nth-of-type(16){
.call-hide-area>p:nth-of-type(3){ .call-hide-area>p:nth-of-type(3){
text-align: center; text-align: center;
font-size: 38px; font-size: 38px;
line-height: 180px; line-height: 80px;
} }
.call-hide-area>p:nth-of-type(4){ .call-hide-area>p:nth-of-type(4){
display: flex; display: flex;
...@@ -92,6 +91,13 @@ tbody>tr:nth-of-type(16){ ...@@ -92,6 +91,13 @@ tbody>tr:nth-of-type(16){
background-color: #286090; background-color: #286090;
color: white; color: white;
} }
.call-hide-area>textarea{
display: block;
width: 100%;
height: 200px;
border: 1px dotted #333;
margin-bottom: 30px;
}
/*拨打电话模态框*/ /*拨打电话模态框*/
html{ html{
...@@ -105,13 +111,12 @@ html{ ...@@ -105,13 +111,12 @@ html{
width: 100%; width: 100%;
height: 100%; height: 100%;
z-index: 102; z-index: 102;
display: none;
} }
.call-modal-main{ .call-modal-main{
width: 6.6rem; width: 6.6rem;
height: 6.54rem; height: 6.54rem;
padding: .4rem .3rem; padding: .4rem .3rem;
margin-top: 2.8rem; margin-top: 1.8rem;
margin-left: calc(50vw - 182px); margin-left: calc(50vw - 182px);
background-color: white; background-color: white;
font-size: .3rem; font-size: .3rem;
...@@ -224,6 +229,5 @@ html{ ...@@ -224,6 +229,5 @@ html{
background-color: #ccc; background-color: #ccc;
color: white; color: white;
margin-left: .3rem; margin-left: .3rem;
display: none;
} }
...@@ -8,10 +8,15 @@ require(['vue', 'css!style/shop_detail_pc.css', 'jquery0325', 'common'], functio ...@@ -8,10 +8,15 @@ require(['vue', 'css!style/shop_detail_pc.css', 'jquery0325', 'common'], functio
data: { data: {
user_info_obj, user_info_obj,
dataCode: '', dataCode: '',
maskShowFlag: false, //弹出窗层是否显示 modalShow2: false, //第二个弹出框是否显示
callShowFlag: false, //拨打电话弹出窗层是否显示 modalShow1: false,//第一个弹出框是否显示
isCallFlag: false,//是否正在拨打
isGenjinSave: false,//是否正在保存跟进
selectPhone: '',//所选中的号码
telHide: '', //拨打隐号返回的号码 telHide: '', //拨打隐号返回的号码
activeLandlordPhone: '', //当前点击的房东号码 activeLandlordPhone: '', //当前点击的房东号码
activeLandlordName: '',//当前点击的房东姓名
content: '',//跟进的内容,填写
d: {} d: {}
}, },
created: function() { created: function() {
...@@ -54,8 +59,8 @@ require(['vue', 'css!style/shop_detail_pc.css', 'jquery0325', 'common'], functio ...@@ -54,8 +59,8 @@ require(['vue', 'css!style/shop_detail_pc.css', 'jquery0325', 'common'], functio
}, },
mounted: function() { mounted: function() {
var _thisV = this; var _thisV = this;
$('#call_modal_phone_self').val(localStorage.getItem('userphone')); _thisV.$nextTick(function(){
$('#call_modal_phone_self').val(user_info_obj.phone);
//拨打电话模态框,获取电话列表 //拨打电话模态框,获取电话列表
_thisV.user_info_obj.id && $.ajax({ _thisV.user_info_obj.id && $.ajax({
type: 'GET', type: 'GET',
...@@ -97,22 +102,10 @@ require(['vue', 'css!style/shop_detail_pc.css', 'jquery0325', 'common'], functio ...@@ -97,22 +102,10 @@ require(['vue', 'css!style/shop_detail_pc.css', 'jquery0325', 'common'], functio
}); });
var _doc = $(document); var _doc = $(document);
var _genjinModal = $('#genjin_modal'),//跟进模态框dom var _genjinCloseBtn = $('#close_btn'),//跟进模态框关闭按钮
_callModal = $('#call_modal'),//拨打电话模态框dom
_markAreaObj = $('.genjin-mark-area-zhuangtai>.genjin-mark-area-alink'),//跟进标签列表状态标签区域dom
_markAreaObj2 = $('.genjin-mark-area-putong>.genjin-mark-area-alink'),//跟进标签列表普通标签区域dom
_beizhuObj = $('#content'),//跟进的备注内容
_genjinCloseBtn = $('#close_btn'),//跟进模态框关闭按钮
_btnSave = $('#btn_save'),//跟进的保存按钮
_btnSaveTemp = $('#btn_save_temp'),//跟进保存按钮临时
_userId = Number(localStorage.getItem('userid')),//当前用户id
isCallFlag = true,//是否是电话跟进,默认不是
_addPhoneBtn = $('#add_phone_btn'),//添加电话按钮 _addPhoneBtn = $('#add_phone_btn'),//添加电话按钮
_addPhoneListObj = $('#call_modal_phone_list'),//添加电话列表对象dom _addPhoneListObj = $('#call_modal_phone_list');//添加电话列表对象dom
_userPhone = localStorage.getItem('userphone'),//当前用户的手机号 //输入手机号,点完成的事件
_selectPhone = '',//拨号列表里选择的号码,也是当前用户对应的手机号,可能和_userPhone是一样的
_customerPhone = '',//当前客户的手机号
_backPhone = '';//绑定之后返回的号码
_doc.on('click', '#call_modal_phone_list>li>.call-edit-icon', function(e) { _doc.on('click', '#call_modal_phone_list>li>.call-edit-icon', function(e) {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
...@@ -160,19 +153,8 @@ require(['vue', 'css!style/shop_detail_pc.css', 'jquery0325', 'common'], functio ...@@ -160,19 +153,8 @@ require(['vue', 'css!style/shop_detail_pc.css', 'jquery0325', 'common'], functio
} }
}); });
}); });
//拨打电话模态框,取消按钮点击事件
$('#call_btn_cancel').click(function(e) {
e.preventDefault();
e.stopPropagation();
_callModal.hide();
});
//点击头部区域拨打电话出现弹窗部分
$('.call-tel-btn').click(function(e) {
e.preventDefault();
e.stopPropagation();
_callModal.show();
});
//选中当前行的电话的事件
_doc.on('click', '#call_modal_phone_list>li', function(e) { _doc.on('click', '#call_modal_phone_list>li', function(e) {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
...@@ -183,6 +165,8 @@ require(['vue', 'css!style/shop_detail_pc.css', 'jquery0325', 'common'], functio ...@@ -183,6 +165,8 @@ require(['vue', 'css!style/shop_detail_pc.css', 'jquery0325', 'common'], functio
}; };
}; };
}); });
//点击添加手机号的事件
_addPhoneBtn.click(function(e) { _addPhoneBtn.click(function(e) {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
...@@ -194,161 +178,114 @@ require(['vue', 'css!style/shop_detail_pc.css', 'jquery0325', 'common'], functio ...@@ -194,161 +178,114 @@ require(['vue', 'css!style/shop_detail_pc.css', 'jquery0325', 'common'], functio
_addPhoneListObj.append('<li class="call-add"><input placeholder="请输入本机手机号" maxlength="11" type="tel" /><div class="call-edit-icon">完成</div><div class="call-submit-ing-icon">提交中ing</div><div class="call-select-icon"><img src="/app/images/ic_duigou_gre.png" /></div></li>').find('.call-add>input').focus(); _addPhoneListObj.append('<li class="call-add"><input placeholder="请输入本机手机号" maxlength="11" type="tel" /><div class="call-edit-icon">完成</div><div class="call-submit-ing-icon">提交中ing</div><div class="call-select-icon"><img src="/app/images/ic_duigou_gre.png" /></div></li>').find('.call-add>input').focus();
}; };
}); });
});
_doc.on('click', '#call_modal_phone_list>li>.call-edit-icon', function(e) {
e.preventDefault();
e.stopPropagation();
var _this = $(this),
_phoneTemp = $.trim(_this.prev().val());
if(!is_mobile(_phoneTemp)) {
layerTipsX('请输入正确的手机号码');
return false;
};
$.ajax({
type: 'POST',
url: ServerHostTempC + '/broker/agentsPhone',
data: {
'AuthToken': _token,
'agents_id': _userId,
'phone': _phoneTemp
}, },
timeout: 30000, methods: {
dataType: 'json', hidePhone(t) {
beforeSend: function() { return hideTel(t);
_this.hide();
_this.next().show();
}, },
success: function(data) { signRule() {
if(typeof data === 'object') { let _this = this;
if(data.code == 200) { return '付' + _this.d.payment_month + '押' + _this.d.deposit_month + ' ' + _this.d.age_limit + '年';
_this.prev().attr('readonly', 'readonly').parent().removeClass('call-add').addClass('call-select').siblings().removeClass('call-select');
_addPhoneBtn.show();
} else {
layerTipsX(data['msg']);
};
} else {
layerTipsX('数据错误');
};
}, },
error: function() { showModal1(t) {
layerTipsX('error'); let _this = this;
_this.activeLandlordPhone = t.phone;
_this.activeLandlordName = t.name;
_this.modalShow1 = true;
}, },
complete: function(xhr, textStatus) { //点击拨打,调用隐号接口
_this.next().hide(); showModal2() {
_this.parent().hasClass('call-add') && _this.show(); let _this = this;
if(textStatus === 'timeout') { if(_this.isCallFlag) {
layerTipsX('请求超时');
};
}
});
});
var _callFlag = true;
$('#call_btn_ok').click(function(e) {
e.preventDefault();
e.stopPropagation();
if(!_callFlag) {
return false; return false;
}; };
_this.$nextTick(function(){
var _beizhuObj = $('#content');//跟进的备注内容
var _selectObj = $('.call-select'); var _selectObj = $('.call-select');
if(_selectObj.length != 1) { if(_selectObj.length != 1) {
layerTipsX('选择出错'); layerTipsX('选择出错');
return false; return false;
} else { } else {
_selectPhone = $.trim(_selectObj.find('input').val()); _this.selectPhone = $.trim(_selectObj.find('input').val());
}; };
if(_selectPhone && _customerPhone) {
$.ajax({ $.ajax({
type: 'POST', type: 'post',
url: ServerHostTempC + '/broker/bindAXB', url: ServerHostTempC + '/broker/bindAXB',
//url: '/index/bindAXB',
data: { data: {
'AuthToken': _token, 'phone_a': _this.selectPhone,
'phone_a': _selectPhone, 'phone_b': _this.activeLandlordPhone,
'phone_b': _customerPhone 'AuthToken': _this.user_info_obj.AuthToken
}, },
timeout: 30000, timeout: 30000,
dataType: 'json', dataType: 'json',
beforeSend: function() { beforeSend: function() {
_callFlag = false; _this.isCallFlag = true;
$('#call_btn_ok').hide();
$('#call_btn_ok_temp').show();
}, },
success: function(data) { success: function(_data) {
if(typeof data === 'object') { if(_data['code'] == '200') {
if(data.code == 200) { _this.telHide = _data.data.phone;
_backPhone = data['data']['phone']; console.log(_this.telHide);
console.log(_backPhone); _this.modalShow1 = false;
Compatible({ _this.modalShow2 = true;
paraIos: {
'route': 'call',
'phone': _backPhone
},
fnAndroid: function() {
window.android.onPhoneCall(_backPhone);
},
fn: function() {
console.warn('error');
}
});
_callModal.hide(); //拨打电话模态框隐藏
_genjinCloseBtn.hide(); //跟进模态框关闭按钮隐藏
_markAreaObj2.parent().show(); //普通跟进标签列表显示
_beizhuObj.val(''); //清空跟进输入框内容 _beizhuObj.val(''); //清空跟进输入框内容
_markAreaObj2.find('a').removeClass('genjin-mark-active'); //清空普通跟进标签选择数据
setTimeout(function() {
_genjinModal.show(); //跟进模态框打开
}, 1000);
} else {
layerTipsX(data['msg']);
};
} else { } else {
layerTipsX('数据错误'); layerTipsX(_data['msg']);
}; }
}, },
error: function() { error: function() {
layerTipsX('error'); layerTipsX('enter error');
}, },
complete: function(xhr, textStatus) { complete: function(xhr, textStatus) {
$('#call_btn_ok_temp').hide(); _this.isCallFlag = false;
$('#call_btn_ok').show();
_callFlag = true;
if(textStatus === 'timeout') { if(textStatus === 'timeout') {
layerTipsX('请求超时'); //处理超时的逻辑
layerTipsX('请求超时,请重试');
}; };
} }
}); });
};
}); });
}, },
methods: { saveGenjin() {
hidePhone(t) {
return hideTel(t);
},
signRule() {
let _this = this; let _this = this;
return '付' + _this.d.payment_month + '押' + _this.d.deposit_month + ' ' + _this.d.age_limit + '年'; if(!_this.isGenjinSave){
}, if(_this.content == ''){
//点击拨打,调用隐号接口 layerTipsX('跟进内容为空');
callHide(t) { return false;
let _this = this; };
_this.activeLandlordPhone = t; /***
// _this.maskShowFlag = true; agent_id true int 经纪人id
// _this.callShowFlag = true; agent_phone true string 经纪人手机号
agent_name true string 经纪人名
house_id true int 楼盘id
follow_up_info true string 跟进内容
landlord_phone false string 房东手机号
landlord_name false string 备注
*****/
$.ajax({ $.ajax({
type: 'post', type: 'post',
url: '/index/bindAXB', url: ServerHostTempC + 'broker/addShopFollowUp',
data: { data: {
'phone_a': _this.user_info_obj.phone, 'agent_id': _this.user_info_obj.id,
'phone_b': t, 'agent_phone': _this.user_info_obj.phone,
'AuthToken': _this.user_info_obj.AuthToken 'agent_name': _this.user_info_obj.name,
'house_id': _this.d.id,
'follow_up_info': _this.content,
'landlord_phone': _this.activeLandlordPhone,
'landlord_name': _this.activeLandlordName
}, },
timeout: 30000, timeout: 30000,
dataType: 'json', dataType: 'json',
beforeSend: function() {}, beforeSend: function() {
_this.isGenjinSave = true;
},
success: function(_data) { success: function(_data) {
if(_data['code'] == '200') { if(_data['code'] == '200') {
_this.telHide = _data.data.data.phone; alert('保存成功');
_this.modalShow2 = false;
} else { } else {
layerTipsX(_data['msg']); layerTipsX(_data['msg']);
} }
...@@ -357,12 +294,14 @@ require(['vue', 'css!style/shop_detail_pc.css', 'jquery0325', 'common'], functio ...@@ -357,12 +294,14 @@ require(['vue', 'css!style/shop_detail_pc.css', 'jquery0325', 'common'], functio
layerTipsX('enter error'); layerTipsX('enter error');
}, },
complete: function(xhr, textStatus) { complete: function(xhr, textStatus) {
_this.isGenjinSave = false;
if(textStatus === 'timeout') { if(textStatus === 'timeout') {
//处理超时的逻辑 //处理超时的逻辑
layerTipsX('请求超时,请重试'); layerTipsX('请求超时,请重试');
}; };
} }
}); });
}
}, },
//点击未打通,释放号码的接口 //点击未打通,释放号码的接口
releaseTel() { releaseTel() {
...@@ -371,7 +310,7 @@ require(['vue', 'css!style/shop_detail_pc.css', 'jquery0325', 'common'], functio ...@@ -371,7 +310,7 @@ require(['vue', 'css!style/shop_detail_pc.css', 'jquery0325', 'common'], functio
type: 'post', type: 'post',
url: '/index/agentsUnBind', url: '/index/agentsUnBind',
data: { data: {
'phone_a': _this.user_info_obj.phone, //经纪人手机号 'phone_a': _this.selectPhone, //经纪人手机号
'phone_b': _this.activeLandlordPhone, //客户手机号 'phone_b': _this.activeLandlordPhone, //客户手机号
'phone_x': _this.telHide, //中间号 'phone_x': _this.telHide, //中间号
'AuthToken': _this.user_info_obj.AuthToken 'AuthToken': _this.user_info_obj.AuthToken
...@@ -381,8 +320,7 @@ require(['vue', 'css!style/shop_detail_pc.css', 'jquery0325', 'common'], functio ...@@ -381,8 +320,7 @@ require(['vue', 'css!style/shop_detail_pc.css', 'jquery0325', 'common'], functio
beforeSend: function() {}, beforeSend: function() {},
success: function(_data) { success: function(_data) {
if(_data['code'] == '200') { if(_data['code'] == '200') {
_this.maskShowFlag = false; //_this.modalShow2 = false;
_this.callShowFlag = false;
} else { } else {
layerTipsX(_data['msg']); layerTipsX(_data['msg']);
} }
......
@charset "utf-8";
/*拨打电话模态框*/
html{
font-size: 55.2px;
}
#call_modal{
position: fixed;
background-color: rgba(0,0,0,.7);
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 1100;
display: none;
}
.call-modal-main{
width: 6.6rem;
/*height: 6.54rem;*/
padding: .4rem .3rem;
margin-top: 2.8rem;
margin-left: calc(50vw - 182px);
background-color: white;
font-size: .3rem;
box-sizing: border-box;
}
.call-modal-main>p.call-modal-main-title{
font-size: .3rem;
color: #333;
text-align: center;
padding-bottom: .3rem;
}
.call-modal-main>p.call-modal-main-tip{
font-size: .24rem;
color: #F13D2F;
text-align: center;
padding-top: .3rem;
}
.call-modal-main>ol{
list-style: none;
padding: 0;
padding-bottom: .3rem;
}
.call-modal-main>ol>li{
height: .8rem;
line-height: .8rem;
background-color: #f0f0f0;
margin-bottom: .3rem;
box-sizing: border-box;
padding: 0 .2rem;
cursor: pointer;
}
.call-modal-main>ol>li>input{
float: left;
line-height: .8rem;
height: .8rem;
width: 3.5rem;
font-size: .28rem;
color: #333;
border: none;
background-color: transparent;
}
.call-modal-main>ol>li>div{
float: right;
}
.call-modal-main>ol>li>.call-select-icon{
overflow: hidden;
padding-top: .23rem;
display: none;
}
.call-modal-main>ol>li>.call-select-icon>img{
float: left;
width: .34rem;
height: .34rem;
}
.call-modal-main>ol>li>.call-edit-icon,
.call-modal-main>ol>li>.call-submit-ing-icon{
width: .8rem;
height: .5rem;
line-height: .5rem;
border-radius: .14rem;
text-align: center;
font-size: .24rem;
color: white;
background-color: #F13D2F;
margin-top: .15rem;
display: none;
cursor: pointer;
}
.call-modal-main>ol>li>.call-submit-ing-icon{
width: 1.2rem;
background-color: #333;
}
.call-modal-main>ol>li.call-select>.call-select-icon,
.call-modal-main>ol>li.call-add>.call-edit-icon{
display: block;
}
.call-modal-main>ol>li.call-select>.call-edit-icon,
.call-modal-main>ol>li.call-add>.call-select-icon{
display: none!important;
}
.call-modal-main>div{
text-align: center;
color: #FF9419;
box-sizing: border-box;
border: 1px solid #FF9419;
line-height: .8rem;
height: .8rem;
}
.call-btn-area{
overflow: hidden;
margin-left: calc(50vw - 182px);
margin-top: .3rem;
}
.call-btn-area>div{
float: left;
width: 3.15rem;
height: .8rem;
line-height: .8rem;
border-radius: .08rem;
text-align: center;
font-size: .32rem;
}
.call-btn-area>div#call_btn_cancel{
background-color: white;
color: #FF9419;
}
.call-btn-area>div#call_btn_ok{
background-color: #FF9419;
color: white;
margin-left: .3rem;
}
.call-btn-area>div#call_btn_ok_temp{
background-color: #ccc;
color: white;
margin-left: .3rem;
display: none;
}
/*跟进模态框区域*/
.call-hide-area{
width: 100%;
background-color: white;
padding: .3rem;
}
.call-hide-area>p:nth-of-type(1){
font-size: .36rem;
}
.call-hide-area>p:nth-of-type(3){
text-align: center;
font-size: .36rem;
line-height: .8rem;
}
#genjin_modal{
position: fixed;
background-color: rgba(0,0,0,.7);
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 1101;
display: none;
}
.genjin-modal-main{
width: 6.6rem;
/*height: 5.8rem;*/
padding: .4rem .3rem;
/*margin-top: 4.6rem;*/
margin-top: 2.5rem;
margin-left: calc(50vw - 182px);
background-color: white;
font-size: .3rem;
box-sizing: border-box;
}
.genjin-content-area{
overflow: hidden;
padding-bottom: .15rem;
}
.genjin-content-area>textarea{
width: 100%;
font-size: 0.26rem;
color: #999;
border: 1px dashed #e6e6e6;
box-sizing: border-box;
min-height: 3rem;
height: auto;
overflow-y: auto;
padding: 0.3rem;
float: left;
}
.genjin-mark-area{
overflow: hidden;
padding-bottom: .15rem;
/*display: none;*/
}
.genjin-mark-area-title{
font-size: .24rem;
}
.genjin-mark-area-alink{
overflow: hidden;
}
.genjin-mark-area-alink>a{
float: left;
height: .6rem;
border-radius: .08rem;
box-sizing: border-box;
border: 1px solid #ccc;
padding: 0 .2rem;
line-height: .6rem;
font-size: .24rem;
margin: .15rem;
color: #999;
cursor: pointer;
}
/*.genjin-mark-area-alink>a+a{
margin-left: .3rem;
}*/
.genjin-mark-area-alink>a.genjin-mark-active{
background-color: #FF9419;
color: white;
border: 1px solid #FF9419;
}
.genjin-submit-area{}
.genjin-submit-area>a{
border-radius: 0.15rem;
color: white;
font-size: 0.36rem;
height: 0.9rem;
line-height: 0.9rem;
text-align: center;
width: 6rem;
display: block;
}
.genjin-submit-area>#btn_save{
background-color: #ff9419;
}
.genjin-submit-area>#btn_save_temp{
background-color: #ccc;
display: none;
}
#close_btn{
overflow: hidden;
width: .38rem;
height: .38rem;
margin-top: .5rem;
margin-left: 3.56rem;
display: none;
}
#close_btn>img{
float: left;
width: 100%;
height: 100%;
}
\ No newline at end of file
define(['doT', 'text!temp/user_template_tpl.html', 'ckfinder', 'ckfinderStart', 'css!style/home.css', "datetimepicker", 'pagination', 'bootstrapJs','blow-up'], function(doT, template) { define(['doT', 'text!temp/user_template_tpl.html', 'ckfinder', 'ckfinderStart', 'css!style/home.css', 'css!style/call_genjin_modal.css', "datetimepicker", 'pagination', 'bootstrapJs','blow-up'], function(doT, template) {
var user_info_obj = JSON.parse(decodeURIComponent(localStorage.getItem('pcUserInfo'))); //读取缓存
console.log(user_info_obj);
var _doc = $(document),
_token = user_info_obj.AuthToken,
_customerId = getUrlParam('customerId');
var _genjinModal = $('#genjin_modal'),//跟进模态框dom
_callModal = $('#call_modal'),//拨打电话模态框dom
_markAreaObj = $('.genjin-mark-area-zhuangtai>.genjin-mark-area-alink'),//跟进标签列表状态标签区域dom
_markAreaObj2 = $('.genjin-mark-area-putong>.genjin-mark-area-alink'),//跟进标签列表普通标签区域dom
_beizhuObj = $('#content'),//跟进的备注内容
_genjinCloseBtn = $('#close_btn'),//跟进模态框关闭按钮
_btnSave = $('#btn_save'),//跟进的保存按钮
_btnSaveTemp = $('#btn_save_temp'),//跟进保存按钮临时
_userId = Number(user_info_obj.id),//当前用户id
isCallFlag = true,//是否是电话跟进,默认不是
_addPhoneBtn = $('#add_phone_btn'),//添加电话按钮
_addPhoneListObj = $('#call_modal_phone_list'),//添加电话列表对象dom
_userPhone = user_info_obj.phone,//当前用户的手机号
_selectPhone = '',//拨号列表里选择的号码,也是当前用户对应的手机号,可能和_userPhone是一样的
_customerPhone = '',//当前客户的手机号
_backPhone = '';//绑定之后返回的号码
var user = { var user = {
pageNo: 1, pageNo: 1,
/*第几页*/ /*第几页*/
...@@ -14,6 +37,7 @@ define(['doT', 'text!temp/user_template_tpl.html', 'ckfinder', 'ckfinderStart', ...@@ -14,6 +37,7 @@ define(['doT', 'text!temp/user_template_tpl.html', 'ckfinder', 'ckfinderStart',
agent_id2: 0, agent_id2: 0,
agent_id_infor: 0, agent_id_infor: 0,
isAjaxSaving: false, isAjaxSaving: false,
customerInfo: {},
init: function() { init: function() {
//初始化dot //初始化dot
$("body").append(template); $("body").append(template);
...@@ -456,6 +480,439 @@ define(['doT', 'text!temp/user_template_tpl.html', 'ckfinder', 'ckfinderStart', ...@@ -456,6 +480,439 @@ define(['doT', 'text!temp/user_template_tpl.html', 'ckfinder', 'ckfinderStart',
_this.parent().prev().val(_this.html()).attr('data-id', _this.attr('data-id')); _this.parent().prev().val(_this.html()).attr('data-id', _this.attr('data-id'));
_this.parent().html('').hide(); _this.parent().html('').hide();
}); });
//拨打电话相关
//跟进模态框,列表标签的点击事件
_doc.on('click', '.genjin-mark-area-alink>a', function(e){
e.preventDefault();
e.stopPropagation();
var _this = $(this);
if(!_this.hasClass('genjin-mark-active')){
_this.addClass('genjin-mark-active').siblings().removeClass('genjin-mark-active');
};
if(_this.attr('data-markid') == '1'){
//如果选择了未打通,则直接关闭
if(_this.parent().parent().index() === 0){
//只有在.genjin-mark-area-putong,电话跟进特有,下的标签才会隐藏
genjinSave('sp1');
return false;
}
};
});
//跟进的提交按钮点击事件
_btnSave.click(function(e){
e.preventDefault();
e.stopPropagation();
genjinSave();
});
function genjinSave(type){
var _genjinMarkOBj = $('.genjin-mark-area-zhuangtai .genjin-mark-active'),
_genjinMarkOBj2 = $('.genjin-mark-area-putong .genjin-mark-active'),
_beizhuObjVal = $.trim(_beizhuObj.val()),
_isFreeFlag = true;//是否释放
//取消自动关闭
// if((_genjinMarkOBj2.attr('data-markid') == '1') || (_genjinMarkOBj2.attr('data-markid') == '4')){
// //如果选择了未打通,或取消拨打,则直接关闭
// if(isCallFlag&&_isFreeFlag){
// //释放
// freePhone();
// };
// _genjinModal.hide();//跟进模态框关闭
// return false;
// };
if((_genjinMarkOBj2.attr('data-markid') == '1') || (_genjinMarkOBj2.attr('data-markid') == '4')){
}else{
if(_genjinMarkOBj.length == 0){
layerTipsX('请选择状态跟进标签');
return false;
};
};
var _data = {
'AuthToken': _token,
'content': _beizhuObjVal,
'user_id': _customerId,
'agent_id': _userId,
'user_status': _genjinMarkOBj.attr('data-markid')
};
if(type === 'sp1'){
if(_beizhuObjVal){
}else{
_data['content'] = '未打通';
};
if(_genjinMarkOBj.length == 0){
_data['user_status'] = user.customerInfo.user_status;
};
};
if(isCallFlag){
//电话跟进
if(_genjinMarkOBj2.length == 0){
layerTipsX('请选择普通跟进标签');
return false;
}else{
_data['labels_id'] = _genjinMarkOBj2.attr('data-markid');
_data['type'] = 0;
(_genjinMarkOBj2.attr('data-free') == 0) && (_isFreeFlag = false);
}
}else{
//普通跟进
if(_beizhuObjVal == ''){
layerTipsX('请填写跟进信息');
return false;
}else{
_data['type'] = 1;
}
};
$.ajax({
type: 'POST',
url: ServerHostTempC + '/broker/add_phone_follow_up',
data: _data,
timeout: 30000,
dataType: 'json',
beforeSend: function() {
_btnSave.hide();
_btnSaveTemp.css('display','block');
},
success: function(data) {
if(typeof data === 'object') {
if (data.code == 200) {
if(isCallFlag&&_isFreeFlag){
//释放
freePhone();
}else{
layer.open({
content: '提交成功',
btn: ['确定'],
yes: function(_index){
location.reload();
layer.close(_index);
}
});
};
}else {
layerTipsX(data['msg']);
};
}else{
layerTipsX('数据错误');
};
},
error: function() {
layerTipsX('error');
},
complete: function(xhr, textStatus){
_btnSaveTemp.hide();
_btnSave.css('display','block');
if(textStatus === 'timeout'){
layerTipsX('请求超时');
};
}
});
}
function freePhone(obj){
$.ajax({
type: 'POST',
url: ServerHostTempC + '/index/agentsUnBind',
data: {
'AuthToken': _token,
'phone_x': _backPhone,
'phone_a': _selectPhone,
'user_id': user.customerInfo.user_id
},
timeout: 30000,
dataType: 'json',
beforeSend: function() {},
success: function(data) {
if(typeof data === 'object') {
if (data.code == 200) {
console.log('释放成功');
layer.open({
content: '提交成功',
btn: ['确定'],
yes: function(_index){
location.reload();
layer.close(_index);
}
});
}else {
layerTipsX(data['msg']);
};
}else{
layerTipsX('数据错误');
};
},
error: function() {
layerTipsX('error');
},
complete: function(xhr, textStatus){
if(textStatus === 'timeout'){
layerTipsX('请求超时');
};
}
});
};
//获取跟进标签列表信息
console.log(_userId);
_userId && $.ajax({
type: 'GET',
url: ServerHostTempC + '/broker/getULabelsListApp',
data: {
'AuthToken': _token
},
timeout: 30000,
dataType: 'json',
beforeSend: function() {},
success: function(data) {
if(typeof data === 'object') {
if (data.code == 200) {
var _htmlTemp = '';
$.each(data['data']['list'], function(i, item) {
_htmlTemp += '<a data-markid="{1}" data-free="{2}">{0}</a>'.stringFormatObj({
'0':item['name'],
'1':item['id'],
'2':item['free']
});
});
_markAreaObj2.html(_htmlTemp);
}else {
layerTipsX(data['msg']);
};
}else{
layerTipsX('数据错误');
};
},
error: function() {
layerTipsX('error');
},
complete: function(xhr, textStatus){
if(textStatus === 'timeout'){
layerTipsX('请求超时');
};
}
});
//拨打电话模态框,获取电话列表
_userId && $.ajax({
type: 'GET',
url: ServerHostTempC + '/broker/agentsPhone',
data: {
'AuthToken': _token,
'agents_id': _userId
},
timeout: 30000,
dataType: 'json',
beforeSend: function() {},
success: function(data) {
if(typeof data === 'object') {
if (data.code == 200) {
var _htmlTemp = '';
$.each(data['data'], function(i, item) {
_htmlTemp += '<li class="{0}"><input placeholder="请输入本机手机号" maxlength="11" type="tel" value="{1}" {2} /><div class="call-edit-icon">完成</div><div class="call-submit-ing-icon">提交中ing</div><div class="call-select-icon"><img src="/app/images/ic_duigou_gre.png" /></div></li>'.stringFormatObj({
'0': '',
'1': item['phone'],
'2': 'readonly',
});
});
$('.call-modal-main>ol').append(_htmlTemp);
}else {
layerTipsX(data['msg']);
};
}else{
layerTipsX('数据错误');
};
},
error: function() {
layerTipsX('error');
},
complete: function(xhr, textStatus){
if(textStatus === 'timeout'){
layerTipsX('请求超时');
};
}
});
//拨打电话模态框,取消按钮点击事件
_doc.on('click', '#call_btn_cancel', function(e){
e.preventDefault();
e.stopPropagation();
_callModal.hide();
});
_doc.on('click', '#call_list_open_btn', function(e){
e.preventDefault();
e.stopPropagation();
_callModal.show();
});
_doc.on('click','#call_modal_phone_list>li',function(e){
e.preventDefault();
e.stopPropagation();
var _this = $(this);
if(_this.find('input')[0].readOnly){
if(!_this.hasClass('call-select')){
_this.addClass('call-select').siblings().removeClass('call-select');
};
};
});
_addPhoneBtn.click(function(e){
e.preventDefault();
e.stopPropagation();
if(_addPhoneListObj.find('li').length>=3){
layerTipsX('可添加的号码最多为3');
return false;
}else{
_addPhoneBtn.hide();
_addPhoneListObj.append('<li class="call-add"><input placeholder="请输入本机手机号" maxlength="11" type="tel" /><div class="call-edit-icon">完成</div><div class="call-submit-ing-icon">提交中ing</div><div class="call-select-icon"><img src="/app/images/ic_duigou_gre.png" /></div></li>').find('.call-add>input').focus();
};
});
_doc.on('click', '#call_modal_phone_list>li>.call-edit-icon', function(e){
e.preventDefault();
e.stopPropagation();
var _this = $(this),
_phoneTemp = $.trim(_this.prev().val());
if(!is_mobile(_phoneTemp)){
layerTipsX('请输入正确的手机号码');
return false;
};
$.ajax({
type: 'POST',
url: ServerHostTempC + '/broker/agentsPhone',
data: {
'AuthToken': _token,
'agents_id': _userId,
'phone': _phoneTemp
},
timeout: 30000,
dataType: 'json',
beforeSend: function() {
_this.hide();
_this.next().show();
},
success: function(data) {
if(typeof data === 'object') {
if (data.code == 200) {
_this.prev().attr('readonly','readonly').parent().removeClass('call-add').addClass('call-select').siblings().removeClass('call-select');
_addPhoneBtn.show();
}else {
layerTipsX(data['msg']);
};
}else{
layerTipsX('数据错误');
};
},
error: function() {
layerTipsX('error');
},
complete: function(xhr, textStatus){
_this.next().hide();
_this.parent().hasClass('call-add') && _this.show();
if(textStatus === 'timeout'){
layerTipsX('请求超时');
};
}
});
});
var _callFlag = true;
_doc.on('click', '#call_btn_ok', function(e){
e.preventDefault();
e.stopPropagation();
if(!_callFlag){
return false;
};
var _selectObj = $('.call-select');
if(_selectObj.length != 1){
layerTipsX('选择出错');
return false;
}else{
_selectPhone = $.trim(_selectObj.find('input').val());
};
if(_selectPhone && user.customerInfo.user_phone){
$.ajax({
type: 'POST',
url: '/index/bindAXB',
data: {
'AuthToken': _token,
'phone_a': _selectPhone,
'user_id': user.customerInfo.user_id
},
timeout: 30000,
dataType: 'json',
beforeSend: function() {
_callFlag = false;
$('#call_btn_ok').hide();
$('#call_btn_ok_temp').show();
},
success: function(data) {
if(typeof data === 'object') {
if (data.code == 200) {
_backPhone = data['data']['phone'];
console.log(_backPhone);
$('.call-hide-area>p:nth-of-type(1)>span').html(_selectPhone);
$('.call-hide-area>p:nth-of-type(3)').html(_backPhone);
_beizhuObj.val('');//清空跟进输入框内容
_markAreaObj.find('a').removeClass('genjin-mark-active');//清空状态跟进标签选择数据
_markAreaObj2.find('a').removeClass('genjin-mark-active');//清空普通跟进标签选择数据
_callModal.hide();
_genjinModal.show();//跟进模态框打开
}else {
layerTipsX(data['msg']);
};
}else{
layerTipsX('数据错误');
};
},
error: function() {
layerTipsX('error');
},
complete: function(xhr, textStatus){
$('#call_btn_ok_temp').hide();
$('#call_btn_ok').show();
_callFlag = true;
if(textStatus === 'timeout'){
layerTipsX('请求超时');
};
}
});
};
});
//拨打电话相关
}, },
addphone: function(obj) {//新增客户 input赋值 addphone: function(obj) {//新增客户 input赋值
var user_ht = $(obj).html(); var user_ht = $(obj).html();
...@@ -623,6 +1080,11 @@ define(['doT', 'text!temp/user_template_tpl.html', 'ckfinder', 'ckfinderStart', ...@@ -623,6 +1080,11 @@ define(['doT', 'text!temp/user_template_tpl.html', 'ckfinder', 'ckfinderStart',
}); });
}, },
user_Call: function() { //客户详情 点击拨打按钮 user_Call: function() { //客户详情 点击拨打按钮
$('#call_modal_phone_self').val(user_info_obj.phone);
_callModal.show();
},
user_Call_Ori: function() { //客户详情 点击拨打按钮
var user_info_obj = JSON.parse(decodeURIComponent(localStorage.getItem('pcUserInfo'))); //读取缓存 var user_info_obj = JSON.parse(decodeURIComponent(localStorage.getItem('pcUserInfo'))); //读取缓存
console.log(user_info_obj); console.log(user_info_obj);
var params = {}; var params = {};
...@@ -640,7 +1102,6 @@ define(['doT', 'text!temp/user_template_tpl.html', 'ckfinder', 'ckfinderStart', ...@@ -640,7 +1102,6 @@ define(['doT', 'text!temp/user_template_tpl.html', 'ckfinder', 'ckfinderStart',
if(data.code == 200) { if(data.code == 200) {
console.log(data.data.data.phone); console.log(data.data.data.phone);
$('#phone_title2').html(data.data.data.phone); $('#phone_title2').html(data.data.data.phone);
// $("#modal-record").modal('hide');
} else { } else {
alert(data.msg) alert(data.msg)
} }
...@@ -824,6 +1285,7 @@ define(['doT', 'text!temp/user_template_tpl.html', 'ckfinder', 'ckfinderStart', ...@@ -824,6 +1285,7 @@ define(['doT', 'text!temp/user_template_tpl.html', 'ckfinder', 'ckfinderStart',
$(".firstlogin_time").html(data.data.user_info.first_login_time);//第一次登陆时间 $(".firstlogin_time").html(data.data.user_info.first_login_time);//第一次登陆时间
$(".sex").val(data.data.user_info.sex); //性别 $(".sex").val(data.data.user_info.sex); //性别
$(".user_vip2").val(data.data.user_info.vip); //是否vip $(".user_vip2").val(data.data.user_info.vip); //是否vip
user.customerInfo = data.data.user_info;
$(".cus_phone").html(hideTel(data.data.user_info.user_phone)); //电话 $(".cus_phone").html(hideTel(data.data.user_info.user_phone)); //电话
$(".cus_date").html(data.data.user_info.create_time); //创建时间 $(".cus_date").html(data.data.user_info.create_time); //创建时间
$(".referrer_user").html(data.data.user_info.referrer_user); //上传时间 $(".referrer_user").html(data.data.user_info.referrer_user); //上传时间
......
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