{extend name="public:form" /}
{block name="body"}
<div class="layui-row">
<div class="layui-col-md12">
<div class="layui-card">
<form class="layui-form">
<div class="layui-form-box">
<div class="layui-form-head">
<div class="layui-form-item">
<label class="layui-form-label">
电表所属基站/资源点信息
</label>
</div>
</div>
<div class="layui-form-body">
<div class="layui-row">
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
基站编号
</label>
<div class="layui-input-inline">
<input type="text" name="station_sp_code" autocomplete="off"
class="layui-input" value="{$station.station_sp_code}" disabled="disabled">
</div>
</div>
</div>
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
基站名称
</label>
<div class="layui-input-inline">
<input type="text" name="station_name" autocomplete="off" class="layui-input" value={$station.station_name}
disabled="disabled">
</div>
</div>
</div>
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
项目编号
</label>
<div class="layui-input-inline">
<input type="text" name="project_number" autocomplete="off"
class="layui-input" value="{$station.proj_number}" disabled="disabled">
</div>
</div>
</div>
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
区域
</label>
<div class="layui-input-inline">
<input type="text" name="area_name" autocomplete="off"
class="layui-input" value="{$station.area_name}" disabled="disabled">
</div>
</div>
</div>
</div>
</div>
</div>
</form>
<form class="layui-form">
<div class="layui-form-box">
<input type="hidden" name="station_id" value='{$station.station_id}'>
<div class="layui-form-head">
<div class="layui-form-item">
<label class="layui-form-label">
新增电表信息
</label>
</div>
</div>
<div class="layui-form-body">
<div class="layui-row">
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>电表类型
</label>
<div class="layui-input-inline">
<select name="electric_type" id="electric_type" lay-filter="change">
{volist name="eType" id="item"}
<option value="{$item.id}" {if $item.id == 1} selected="selected" {/if}>{$item.name}</option>
{/volist}
</select>
</div>
</div>
</div>
{if $station.operator_name == '中国移动' || $station.operator_name == '移动'}
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
二维码
</label>
<div class="layui-input-inline">
<input type="text" id="qr_code" name="qr_code"
autocomplete="off" class="layui-input">
</div>
</div>
</div>
{/if}
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
电表备注
</label>
<div class="layui-input-inline">
<input type="text" id="electric_remark" name="electric_remark"
autocomplete="off" class="layui-input">
</div>
</div>
</div>
<div class="layui-col-md5">
<div class="layui-form-item">
<label for="electric_number" class="layui-form-label">
<span class="x-red">*</span>电表识别号
</label>
<div class="layui-input-inline">
<input type="text" id="electric_number" name="electric_number"
lay-verify="required" autocomplete="off" class="layui-input" oninput="sliceDom(this,20)" lay-verType="tips">
</div>
</div>
</div>
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
缴费号
</label>
<div class="layui-input-inline">
<input type="number" oninput="sliceDom(this,10)" id="pay_number" name="pay_number" autocomplete="off" class="layui-input" lay-verType="tips" >
</div>
</div>
</div>
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>倍率
</label>
<div class="layui-input-inline">
<input type="number" oninput="sliceDom(this,6)" id="multiple" name="multiple" lay-verify="required"
autocomplete="off" class="layui-input" lay-verType="tips">
</div>
</div>
</div>
<div class="layui-col-md5">
<div class="layui-form-item">
<label for="init_degree" class="layui-form-label">
<span class="x-red">*</span>电表初始度数
</label>
<div class="layui-input-inline">
<input type="number" oninput="sliceDom(this,6)" id="init_degree" name="init_degree" lay-verify="required"
autocomplete="off" value="0" class="layui-input" lay-verType="tips">
</div>
</div>
</div>
<div class="layui-col-md5 layui-hide">
<div class="layui-form-item">
<label for="init_amount" class="layui-form-label">
<span class="x-red">*</span>初始充值金额
</label>
<div class="layui-input-inline">
<input type="text" oninput="sliceDom(this,8)" id="init_amount" name="init_amount" lay-verify="required"
autocomplete="off" value="0" class="layui-input" lay-verType="tips">
</div>
</div>
</div>
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>首次查表日期
</label>
<div class="layui-input-inline">
<input type="text" id="first_cp_date" name="first_cp_date" lay-verify="required" autocomplete="off" class="layui-input" lay-verType="tips">
</div>
</div>
</div>
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>抄表单单价
</label>
<div class="layui-input-inline">
<input type="text" maxlength="5" id="unit_price" name="unit_price" lay-verify="required" autocomplete="off" class="layui-input" lay-verType="tips">
</div>
<div class="layui-form-mid layui-word-aux">
元/度
</div>
</div>
</div>
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>是否协议价
</label>
<div class="layui-input-inline">
<select name="is_protocol" id="is_protocol" lay-filter="protocol">
<option value="1" >是</option>
<option value="0" selected="selected">否</option>
</select>
</div>
<input type="hidden" name="protocol_id" value="">
</div>
</div>
<div class="layui-col-md5 layui-hide">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>协议价
</label>
<div class="layui-input-inline">
<input type="text" name="protocol_price"
placeholder="请填写协议价格" oninput="sliceDom(this,5)" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">
元/度
</div>
</div>
</div>
<div class="layui-col-md5 layui-hide">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>上传协议
</label>
<div class="layui-input-inline">
<button type="button" class="layui-btn" id="upload_protocol_btn">
<i class="layui-icon"></i>上传/预览
</button>
</div>
</div>
</div>
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>缴费周期
</label>
<div class="layui-input-inline">
<input type="number" oninput="sliceDom(this,2)" id="pay_cycle" name="pay_cycle" lay-verify="required"
autocomplete="off" class="layui-input" lay-verType="tips">
</div>
<div class="layui-form-mid layui-word-aux">
月
</div>
</div>
</div>
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>业务员
</label>
<div class="layui-input-inline">
<select name="staff_id">
{foreach $users as $u}
{if $u['id'] == $uid}
<option value="{$u['id']}" selected="selected">{$u['name']}</option>
{else /}
<option value="{$u['id']}">{$u['name']}</option>
{/if}
{/foreach}
</select>
</div>
</div>
</div>
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>电表地址
</label>
<div class="layui-input-inline">
<input type="text" id="address" name="address" lay-verify="required" autocomplete="off" class="layui-input" lay-verType="tips">
</div>
</div>
</div>
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>电表照片附件
</label>
<div class="layui-input-inline">
<button type="button" class="layui-btn" id="electric_annex_button">
<i class="layui-icon"></i>电表照片附件
</button>
<input type="hidden" id="electric_annex" name="photo_id" value="">
<a href="#" target="_blank" class="layui-btn layui-hide">
<i class="layui-icon"></i>预览
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="layui-form-box">
<div class="layui-form-head">
<div class="layui-form-item">
<label class="layui-form-label">
所属机房信息
</label>
</div>
</div>
<div class="layui-form-body">
<div class="layui-row">
<div class="layui-col-md5">
<div class="layui-form-item">
<label for="contact" class="layui-form-label">
<span class="x-red">*</span>甲方联系人
</label>
<div class="layui-input-inline">
<input type="text" id="contact" name="contact" lay-verify="required" autocomplete="off" class="layui-input" lay-verType="tips">
</div>
</div>
</div>
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>甲方联系方式
</label>
<div class="layui-input-inline">
<input type="number" oninput="sliceDom(this,11)" id="contact_tel" name="contact_tel" lay-verify="required"
autocomplete="off" class="layui-input" lay-verType="tips">
</div>
</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>机房位置
</label>
<div class="layui-input-inline">
<input type="text" id="room_position" name="room_position"
autocomplete="off" class="layui-input" lay-verType="tips">
</div>
</div>
</div>
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>物业位置
</label>
<div class="layui-input-inline">
<input type="text" id="property_position" name="property_position" autocomplete="off" class="layui-input">
</div>
</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>收款单位
</label>
<div class="layui-input-inline">
<input type="text" id="receive" name="receive" autocomplete="off" class="layui-input">
</div>
</div>
</div>
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>出租单位名称
</label>
<div class="layui-input-inline">
<input type="text" id="rent" name="rent" autocomplete="off" class="layui-input">
</div>
</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
备注
</label>
<div class="layui-input-block">
<textarea class="layui-textarea" name="engineroom_remark"></textarea>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="layui-form-box">
<div class="layui-form-head">
<div class="layui-form-item">
<label class="layui-form-label">
合同信息
</label>
</div>
</div>
<div class="layui-form-body">
<div class="layui-row">
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>合同编号
</label>
<div class="layui-input-inline">
<input type="text" id="contract_number" name="contract_number"
lay-verify="checkContractNumb|required" autocomplete="off" class="layui-input" lay-verType="tips">
</div>
</div>
</div>
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>确认合同日期
</label>
<div class="layui-input-inline">
<input type="text" id="contract_confirm_date" name="contract_confirm_date"
lay-verify="required" autocomplete="off" class="layui-input" lay-verType="tips">
</div>
</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>合同有效时间
</label>
<div class="layui-input-inline">
<input type="number" id="period" name="period" autocomplete="off" class="layui-input" oninput="sliceDom(this,3)">
</div>
<div class="layui-form-mid layui-word-aux">
月
</div>
</div>
</div>
</div>
</div>
</div>
<div class="layui-form-item text-center">
<button class="layui-btn" lay-filter="add" lay-submit="">
保存
</button>
<a class="layui-btn" href="/em">
返回
</a>
</div>
</form>
</div>
</div>
</div>
{/block}
{block name="js"}
<script>
//限制输入长度
function sliceDom(dom,len){
if(dom.value.length>len)
return dom.value = dom.value.slice(0,len)
}
//初始化Layui控件
layui.use(['form', 'layer', 'laydate', 'upload'],
function () {
$ = layui.jquery;
var form = layui.form,
layer = layui.layer,
laydate = layui.laydate,
upload = layui.upload;
//渲染date类型字段
laydate.render({
elem: '#first_cp_date', // 第一次抄表
trigger: 'click'
});
laydate.render({
elem: '#contract_confirm_date',//合同确认时间
trigger: 'click'
});
//预览图片
function preview(src,width='70%'){
let $json = null;
$json = {"data": [{"pid": 1, "src": src}]}
layer.photos({
photos: $json,
area:[width]
});
}
//消息提示
function layMsg(msg,type=6,time=1000){
layer.msg(msg,{
icon: type,
time: time,
});
}
form.verify({
checkContractNumb: function(value, item){
if(! new RegExp('^[a-zA-Z]+-[a-zA-Z0-9-]+$').test(value)){
return '合同编号格式不正确';
}
}
})
//添加电表
form.on('submit(add)',
function (data) {
$.ajax({
url: '/em_add',
method: "POST",
data: data.field,
dataType: "json",
success: function (data) {
if (data.status == 1) {
layer.msg(data.message,{icon: 6,time: 1000 },
function(){
xadmin.close();
// 可以对父窗口进行刷新
xadmin.father_reload();
});
} else {
layer.msg(data.message,{icon: 5,time: 1000 })
}
}
});
return false;
});
//供电局表字段隐藏
form.on('select(change)', function (data) {
//类型与字段隐藏
var $payNumb = $('#pay_number');
var $initAmount = $('#init_amount');
var $type = data.value;
switch ($type){
case "1": //供电局插卡表,显示缴费号,隐藏初始金额
$payNumb.parents('.layui-col-md5').removeClass('layui-hide');
$initAmount.parents('.layui-col-md5').addClass('layui-hide');
break;
case "2": //供电局插卡表,显示缴费号,显示初始金额
$payNumb.parents('.layui-col-md5').removeClass('layui-hide');
$initAmount.parents('.layui-col-md5').removeClass('layui-hide');
break;
case "3": //非供电局普通表,不显示缴费号,不显示初始金额
$payNumb.parents('.layui-col-md5').addClass('layui-hide');
$initAmount.parents('.layui-col-md5').addClass('layui-hide');
break;
case "4": //非供电局插卡表,不显示缴费号,显示初始金额
$payNumb.parents('.layui-col-md5').addClass('layui-hide');
$initAmount.parents('.layui-col-md5').removeClass('layui-hide');
break;
}
})
//协议相关字段切换
form.on('select(protocol)', function (data) {
//如果选择了有协议
var $isProt = $("#is_protocol");
if(data.value == 1){
$isProt.parents('.layui-col-md5')
.next().removeClass('layui-hide')
.next().removeClass('layui-hide')
} else {
$isProt.parents('.layui-col-md5')
.next().addClass('layui-hide')
.next().addClass('layui-hide')
}
})
//上传电表照片
var uploadEa = upload.render({
elem: '#electric_annex_button' ,
url: '/upAnnex',
field: 'annex_file',
done: function (res) {
if(res.status == 1){
layMsg(res.message)
//将电表照片的ID填写
var $photoId = $("input[name='photo_id']")
$photoId.val(res.data.id)
var $a = $photoId.next('a');
$a.removeClass('layui-hide')
$a.attr('href',res.data.src);
}
else {
layMsg(res.message,5)
return;
}
}
});
//协议先关设置
/* ---------------------------------------------------------------- */
// 打开添加协议窗口
var $upProtModalPreview = ''; //open layer index
var $upProt = $("#upload_protocol_btn") //点击触发的按钮
var $upProtModal = $("#protocol_modal") //层
$upProt.on('click',function(){
//打开模块
$upProtModal.removeClass('layui-hide')
$upProtModalPreview = layer.open({
title:'上传协议',
type:1,
content:$upProtModal,
area:['1000px'],
yes:function(){
$upProtModal.addClass('layui-hide') //关闭层之后隐藏层
},
end:function(){
$upProtModal.addClass('layui-hide') //关闭层之后隐藏层
}
})
})
//初始化date字段
laydate.render({
elem: '#contract_sign_date',
trigger: 'click'
})
//时间合理设置
laydate.render({
elem: '#contract_start_date',
trigger: 'click',
done: function(value, date, endDate){
$('#contract_end_date').removeClass('layui-disabled').attr('disabled',false);
laydate.render({
elem: '#contract_end_date',
trigger: 'click',
min:value
})
}
})
//协议图片上传
var uploadEn = upload.render({
elem: '#upload_protocol_file_btn' , //控件按钮
url: '/upProtocol',
field: 'upProtocol',
done: function (res) {
if(res.status == 1){
$("#protocol_contract_file").val(res.data.id)
//预览
$("#protocol_preview").removeClass('layui-hide')
$("#protocol_preview").attr('href',res.data.src);
layer.msg(res.message, {icon: 6})
} else {
layer.msg(res.message, {icon: 5})
}
}
})
//提交协议表单到合同表
form.on('submit(protocol)',function(data){
$.ajax({
url: '/em_add_protocol',
method:"POST",
dataType: "json",
data: data.field,
success:function(data){
if(data.status == 1){
layer.msg(data.message, {icon: 1,time: 2000 },
function(){
//设置上传之后的协议合同ID
$("input[name='protocol_id']").val(data.data)
layer.close($upProtModalPreview)
});
} else {
layMsg(data.message,2000)
}
}
})
return false;
})
})
function close() {
//关闭当前frame
xadmin.close();
// 可以对父窗口进行刷新
xadmin.father_reload();
}
</script>
{/block}
{block name="modal"}
<div class="layui-fluid layui-hide" id="protocol_modal">
<div class="layui-row">
<div class="layui-card-body">
<form class="layui-form layui-col-space5">
<input type="hidden" name="contract_type" value="2">
<div class="layui-form-box">
<div class="layui-form-head">
<div class="layui-form-item">
<label class="layui-form-label">
添加电表协议
</label>
</div>
</div>
<div class="layui-form-body no-border">
<div class="layui-row">
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>协议名称
</label>
<div class="layui-input-inline">
<input type="text" name="contract_name" placeholder="协议名称" class="layui-input" lay-verify="required" autocomplete="off" lay-verType="tips">
</div>
</div>
</div>
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>协议编号
</label>
<div class="layui-input-inline">
<input type="text" name="contract_number" lay-verify="contract_number" placeholder="协议编号" autocomplete="off" class="layui-input" lay-verify="required" lay-verType="tips">
</div>
</div>
</div>
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>开始时间
</label>
<div class="layui-input-inline layui-show-xs-block">
<input type="text" id="contract_start_date" name="contract_start_date" placeholder="开始时间" class="layui-input" lay-verify="required" autocomplete="off" lay-verType="tips">
</div>
</div>
</div>
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>结束时间
</label>
<div class="layui-input-inline layui-show-xs-block">
<input type="text" id="contract_end_date" name="contract_end_date" placeholder="结束时间" class="layui-input layui-disabled" disabled="disabled" lay-verify="required" autocomplete="off" lay-verType="tips">
</div>
</div>
</div>
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>签订日期
</label>
<div class="layui-input-inline layui-show-xs-block">
<input type="text" id="contract_sign_date" name="contract_sign_date" placeholder="签订日期" class="layui-input" lay-verify="required" lay-verType="tips" autocomplete="off">
</div>
</div>
</div>
<div class="layui-col-md5">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>上传协议文件
</label>
<div class="layui-input-inline layui-show-xs-block">
<button type="button" class="layui-btn" id="upload_protocol_file_btn">
<i class="layui-icon"></i>上传协议文件
</button>
<input type="hidden" id="protocol_contract_file" name="contract_file" value="">
<!-- <button type="button" class="layui-btn layui-hide" id="protocol_preview">
<i class="layui-icon"></i>
</button> -->
<a href="#" target="_blank" class="layui-btn layui-hide" id="protocol_preview"><i class="layui-icon"></i></a>
</div>
</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-md6">
<div class="layui-form-item">
<label class="layui-form-label">
<span class="x-red">*</span>备注
</label>
<div class="layui-input-inline layui-show-xs-block">
<textarea name="contract_remark" placeholder="备注" class="layui-textarea" autocomplete="off"></textarea>
</div>
</div>
</div>
</div>
<div class="layui-row">
<div class="layiui-col-md12">
<div class="layui-form-item">
<label class="layui-form-label"></label>
<div class="layui-input-inline layui-show-xs-block">
<button class="layui-btn" lay-submit="" lay-filter="protocol">
添加</button>
</div>
</div>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
{/block}