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.
simple-yewu/frontend/web/phone.html

136 lines
5.3 KiB

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset='utf-8'>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>汇盈帮手</title>
<link href="/assets/js/plugins/layui/css/layui.css" rel="stylesheet">
</head>
<body>
<div class="layui-card" style="padding-top: 20px;">
<div class="layui-card-body">
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">本机号码</label>
<div class="layui-input-inline" style="width: 200px;">
<input type="text" name="tel" id="local-phone" placeholder="请输入本机电话号码" class="layui-input" readonly>
</div>
</div>
<div class="layui-inline">
<button class="layui-btn" onclick="setLocalPhone()">重设电话</button>
<button class="layui-btn" onclick="window.location.reload();">刷新</button>
</div>
</div>
</div>
</div>
<div class="layui-card" style="padding-top: 20px;">
<div class="layui-card-header">车辆信息</div>
<div class="layui-card-body">
<table class="layui-table">
<tbody>
<tr><td>车牌号</td><td id="car_no"></td></tr>
<tr><td>车架号</td><td id="car_frame_no"></td></tr>
<tr><td>发动机号</td><td id="engine_no"></td></tr>
<tr><td>厂牌型号</td><td id="factory_model"></td></tr>
</tbody>
</table>
</div>
</div>
<div class="layui-card" style="padding-top: 20px;">
<div class="layui-card-header">联系人信息</div>
<div class="layui-card-body">
<table id="phone-list" lay-filter="phoneList"></table>
</div>
</div>
<script src="/assets/js/plugins/layui/layui.js"></script>
<script src="/js/jquery.min.js"></script>
<script src="/assets/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
<script src="/assets/js/plugins/bootstrap-table/bootstrap-table-mobile.min.js"></script>
<script src="/assets/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
<script type="text/html" id="barDemo">
<a class="layui-btn layui-btn-xs" lay-event="call">拨号</a>
</script>
<script>
var localPhone = localStorage.getItem('local_phone');
var params = getRequest();
layui.use('table',function(){
if(!localPhone){
setLocalPhone();
}
$('#local-phone').val(localPhone);
$.get('/phone/phone-list',params,function(ret){
if(ret.success) {
var car_info = ret['data']['car_info'];
var phone_list = ret['data']['phones'];
$('#car_no').html(car_info['car_no']);
$('#car_frame_no').html(car_info['car_frame_no']);
$('#engine_no').html(car_info['engine_no']);
$('#factory_model').html(car_info['factory_model']);
layui.table.render({
elem: '#phone-list',
data: phone_list,
cols: [[ //表头
{field: 'name', title: '姓名', width:150},
{field: 'phone', title: '电话', width: 150},
{fixed: 'right', titlel: '操作', width: 80, align: 'center', toolbar: '#barDemo'}
]],
});
layui.table.on('tool(phoneList)', function(obj){
var data = obj.data;
if (obj.event === 'call') {
if(data.phone == ''){
layer.msg("手机号码有误,不能拨号");
return false;
}
$.get('/phone/web-ax-out', {
'caller': localPhone,
'called': data.phone,
'user_id': params['user_id']
}, function (obj) {
if (obj.success) {
var number = obj.msg;
window.location.href = 'tel://' + number;
} else {
alert(obj.msg);
}
}, 'json');
}
});
} else {
alert(ret.msg);
}
})
});
function setLocalPhone(){
layer.prompt({
title: '请输入本机电话号码',
btn: ['提交'],
closeBtn: false,
}, function(value, index, elem){
if(!(/^1[3456789]\d{9}$/.test(value))){
layer.msg("手机号码有误,请重填");
return false;
}
localPhone = value;
localStorage.setItem('local_phone',localPhone);
$('#local-phone').val(localPhone);
layer.close(index);
});
}
function getRequest() {
var url = location.search;
var params = {};
if (url.indexOf("?") != -1) {
var strs = url.substr(1).split("&");
for(let i = 0; i < strs.length; i ++) {
params[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]);
}
}
return params;
}
</script>
</body>
</html>