<div class="layui-tab-content" style="position:absolute">
<div class="layui-tab-item layui-show">
<form class="layui-form" lay-filter="sale" id="sale">
<div class="layui-form-item">
<label class="layui-form-label">客户</label>
<div class="layui-input-block customerA" >
<select id="customer" name="customer" lay-filter="customer" lay-verify="required">
<option value=""></option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">金额</label>
<div class="layui-input-block">
<input type="text" lay-verify="required|number" name="money" autocomplete="off"
placeholder="请输入金额"
class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">手机号</label>
<div class="layui-input-block">
<input type="text" lay-verify="required|phone" name="phone" autocomplete="off"
placeholder="请输入手机号"
class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">商品</label>
<div class="layui-input-block">
<input type="text" lay-verify="required" name="goods" autocomplete="off" placeholder="请输入商品"
class="layui-input">
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<input type="hidden" value="" name="remark" lay-verify="title" autocomplete="off"
placeholder="备注"
class="layui-input">
</div>
</div>
<div style="position:fixed; right:20px; bottom:20px;z-index:99;">
<button type="submit" class="layui-btn layui-btn-normal" lay-submit="" lay-filter="demo1">二维码支付
</button>
</div>
</form>
</div>
<div class="layui-tab-item">
<form class="layui-form" id="servicePay" lay-filter="servicePay">
<div class="layui-form-item">
<label class="layui-form-label ">客户</label>
<div class="layui-input-block customerB">
<select name="customer" id="customer1" lay-filter="customer1" lay-verify="required">
<option value=""></option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">金额</label>
<div class="layui-input-block">
<input type="text" name="money" lay-verify="required|number" autocomplete="off"
placeholder="请输入金额"
class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">手机号</label>
<div class="layui-input-block">
<input type="text" name="phone" lay-verify="required|phone" autocomplete="off"
placeholder="请输入手机号"
class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">服务费类别</label>
<div class="layui-input-block" >
<input type="text" id="serviceType" name="serviceType" lay-verify="required" autocomplete="off" placeholder="请选择服务费类别"
class="layui-input">
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<input type="hidden" name="remark" lay-verify="title" autocomplete="off" placeholder="备注"
value="" class="layui-input">
</div>
</div>
<div style="position:fixed; right:20px; bottom:20px;z-index:99;">
<button type="submit" class="layui-btn layui-btn-normal" lay-submit="" lay-filter="demo1">二维码支付
</button>
</div>
</form>
</div>
layui.use(['element', 'layer', 'form'], function () {
var $ = layui.jquery, layer = layui.layer, form = layui.form;
$("#customer").next().find('input').removeAttr("readonly");
$("#customer1").next().find('input').removeAttr("readonly");
function isSetOver(a) {
var flag = true;
$("#"+a).next().find('input').on('compositionstart', function () {
flag = false;
});
$("#"+a).next().find('input').on('compositionend', function () {
flag = true;
});
return flag;
}
$("#serviceType").click(function () {
console.log(1)
layer.open({
type: 2
, id: 'serviceType1'
, area: ['280px', '330px']
, title: '服务费类别选择'
, zIndex: 998
, content: 'serviceType.html'
, success: function (layero, index) {
}
, shade: 0.2
});
});
function myFun() {
var b = isSetOver("customer");
var params = $(this).val();
setTimeout(function () {
if (b) {
if (params.length >= 2) {
$.ajax({
type: "post",
url: "cloud-letter/customer/get",
dataType: 'json',
data: {qymc: params},
async: false,
success: function (d) {
var data=d.data;
if (data.length!=0){
selectCreate("customer",data,params);
$("#customer").next().find('input').removeAttr("readonly");
$("#customer1").next().find('input').removeAttr("readonly");
$("#customer").next().find('input').val(params);
setTimeout(function () {
$("#customer").next().find('input').click();
$("#customer").next().find('input').focus();
},0)
}
}
});
}
}
},0);
}
function myFunB() {
var b = isSetOver("customer1");
var params = $(this).val();
setTimeout(function () {
if (b) {
if (params.length >= 2) {
$.ajax({
type: "post",
url: "cloud-letter/customer/get",
dataType: 'json',
data: {qymc: params},
async: false,
success: function (d) {
var data=d.data;
if (data.length!=0){
selectCreate("customer1",data,params);
$("#customer1").next().find('input').removeAttr("readonly");
$("#customer").next().find('input').removeAttr("readonly");
$("#customer1").next().find('input').val(params);
setTimeout(function () {
$("#customer1").next().find('input').click();
$("#customer1").next().find('input').focus();
},0)
}
}
});
}
}
},0);
}
$(document).on('keyup', '.customerA input', myFun);
$(document).on('keyup', '.customerB input', myFunB);
var selectCreate = function(filter, options,params) {
var ELEM = '.layui-form';
var CLASS = 'layui-form-select';
var DISABLED = 'layui-disabled';
var othis = $('[lay-filter="' + filter +'"]');
var hasRender = othis.next('.'+CLASS);
var arr = [];
layui.each(options,
function(index, item){
if(arr.length === 0){
arr.push('<option value="" ></option>');
}
arr.push('<option value="' + item.cust_id + '"' + '>' + item.cust_name + '</option>');
});
arr.length === 0 && arr.push('<option value="" class="' + DISABLED + '">没有选项</option>');
hasRender[0] && hasRender.remove();
othis.empty();
othis.append(arr.join(''));
form.render('select');
};
form.on('submit(demo1)', function (data) {
data.field["userInfoCode"] = getUrlData().code;
layer.alert(JSON.stringify(data.field), {
title: '最终提交信息'
});
layer.open({
type: 2
, id: 'layerDemo'
, area: ['280px', '330px']
, title: '二维码支付'
, fixed: true
, zIndex: 999
, content: 'qrCode.html'
, success: function (layero, index) {
var iframe = window['layui-layer-iframe' + index];
}
, shade: 0.2
});
return false;
});