2021-07-06 23:31:21 +08:00

479 lines
23 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>layui</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="../../../lib/layui-v2.5.5/css/layui.css" media="all">
<link rel="stylesheet" href="../../../css/public.css" media="all">
<style>
body {
background-color: #ffffff;
}
</style>
</head>
<body>
<div class="layui-form layuimini-form">
<div class="layui-container">
<div class="layui-row">
<div class="layui-col-md12">
<div class="layui-form-item">
<label class="layui-form-label required">订单名称</label>
<div class="layui-input-block">
<input type="text" name="OrderName" placeholder="请输入订单名称" value="" class="layui-input">
</div>
</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-md6">
<div class="layui-form-item">
<label class="layui-form-label required">供方</label>
<div class="layui-input-block">
<input type="text" name="materialNum" placeholder="请输入订单名称" value="" class="layui-input">
</div>
</div>
</div>
<div class="layui-col-md6">
<div class="layui-col-md6"></div>
<label class="layui-form-label required">需方</label>
<div class="layui-input-block">
<input type="text" name="materialNum" required lay-verify="required" lay-reqtext="订单名称不能为空"
placeholder="请输入订单名称" value="" class="layui-input">
</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-md6">
<div class="layui-form-item">
<label class="layui-form-label required">地址</label>
<div class="layui-input-block">
<input type="text" name="materialNum" required lay-verify="required" lay-reqtext="订单名称不能为空"
placeholder="请输入订单名称" value="" class="layui-input">
</div>
</div>
</div>
<div class="layui-col-md6">
<div class="layui-col-md6"></div>
<label class="layui-form-label required">地址</label>
<div class="layui-input-block">
<input type="text" name="materialNum" required lay-verify="required" lay-reqtext="订单名称不能为空"
placeholder="请输入订单名称" value="" class="layui-input">
</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-md6">
<div class="layui-form-item">
<label class="layui-form-label required">社会统一信用代码</label>
<div class="layui-input-block">
<input type="text" name="materialNum" required lay-verify="required" lay-reqtext="订单名称不能为空"
placeholder="请输入订单名称" value="" class="layui-input">
</div>
</div>
</div>
<div class="layui-col-md6">
<div class="layui-col-md6"></div>
<label class="layui-form-label required">社会统一信用代码</label>
<div class="layui-input-block">
<input type="text" name="materialNum" required lay-verify="required" lay-reqtext="订单名称不能为空"
placeholder="请输入订单名称" value="" class="layui-input">
</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-md6">
<div class="layui-form-item">
<label class="layui-form-label required">开户银行</label>
<div class="layui-input-block">
<input type="text" name="materialNum" required lay-verify="required" lay-reqtext="订单名称不能为空"
placeholder="请输入订单名称" value="" class="layui-input">
</div>
</div>
</div>
<div class="layui-col-md6">
<div class="layui-col-md6"></div>
<label class="layui-form-label required">开户银行</label>
<div class="layui-input-block">
<input type="text" name="materialNum" required lay-verify="required" lay-reqtext="订单名称不能为空"
placeholder="请输入订单名称" value="" class="layui-input">
</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-md6">
<div class="layui-form-item">
<label class="layui-form-label required">账号</label>
<div class="layui-input-block">
<input type="text" name="materialNum" required lay-verify="required" lay-reqtext="订单名称不能为空"
placeholder="请输入订单名称" value="" class="layui-input">
</div>
</div>
</div>
<div class="layui-col-md6">
<div class="layui-col-md6"></div>
<label class="layui-form-label required">账号</label>
<div class="layui-input-block">
<input type="text" name="materialNum" required lay-verify="required" lay-reqtext="订单名称不能为空"
placeholder="请输入订单名称" value="" class="layui-input">
</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-md6">
<div class="layui-form-item">
<label class="layui-form-label required">电话</label>
<div class="layui-input-block">
<input type="text" name="materialNum" required lay-verify="required" lay-reqtext="订单名称不能为空"
placeholder="请输入订单名称" value="" class="layui-input">
</div>
</div>
</div>
<div class="layui-col-md6">
<div class="layui-col-md6"></div>
<label class="layui-form-label required">电话</label>
<div class="layui-input-block">
<input type="text" name="materialNum" required lay-verify="required" lay-reqtext="订单名称不能为空"
placeholder="请输入订单名称" value="" class="layui-input">
</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-md6">
<div class="layui-form-item">
<label class="layui-form-label required">账号</label>
<div class="layui-input-block">
<input type="text" name="materialNum" required lay-verify="required" lay-reqtext="订单名称不能为空"
placeholder="请输入订单名称" value="" class="layui-input">
</div>
</div>
</div>
<div class="layui-col-md6">
<div class="layui-col-md6"></div>
<label class="layui-form-label required">账号</label>
<div class="layui-input-block">
<input type="text" name="materialNum" required lay-verify="required" lay-reqtext="订单名称不能为空"
placeholder="请输入订单名称" value="" class="layui-input">
</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-md6">
<div class="layui-form-item">
<label class="layui-form-label required">传真</label>
<div class="layui-input-block">
<input type="text" name="materialNum" required lay-verify="required" lay-reqtext="订单名称不能为空"
placeholder="请输入订单名称" value="" class="layui-input">
</div>
</div>
</div>
<div class="layui-col-md6">
<div class="layui-col-md6"></div>
<label class="layui-form-label required">传真</label>
<div class="layui-input-block">
<input type="text" name="materialNum" required lay-verify="required" lay-reqtext="订单名称不能为空"
placeholder="请输入订单名称" value="" class="layui-input">
</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-md6">
<div class="layui-form-item">
<label class="layui-form-label required">联系人</label>
<div class="layui-input-block">
<input type="text" name="materialNum" required lay-verify="required" lay-reqtext="订单名称不能为空"
placeholder="请输入订单名称" value="" class="layui-input">
</div>
</div>
</div>
<div class="layui-col-md6">
<div class="layui-col-md6"></div>
<label class="layui-form-label required">联系人</label>
<div class="layui-input-block">
<input type="text" name="materialNum" required lay-verify="required" lay-reqtext="订单名称不能为空"
placeholder="请输入订单名称" value="" class="layui-input">
</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-md6">
<div class="layui-form-item">
<label class="layui-form-label required">手机</label>
<div class="layui-input-block">
<input type="text" name="materialNum" required lay-verify="required" lay-reqtext="订单名称不能为空"
placeholder="请输入订单名称" value="" class="layui-input">
</div>
</div>
</div>
<div class="layui-col-md6">
<div class="layui-col-md6"></div>
<label class="layui-form-label required">手机</label>
<div class="layui-input-block">
<input type="text" name="materialNum" required lay-verify="required" lay-reqtext="订单名称不能为空"
placeholder="请输入订单名称" value="" class="layui-input">
</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-md6">
<div class="layui-form-item">
<label class="layui-form-label required">邮箱</label>
<div class="layui-input-block">
<input type="text" name="materialNum" required lay-verify="required" lay-reqtext="订单名称不能为空"
placeholder="请输入订单名称" value="" class="layui-input">
</div>
</div>
</div>
<div class="layui-col-md6">
<div class="layui-col-md6"></div>
<label class="layui-form-label required">邮箱</label>
<div class="layui-input-block">
<input type="text" name="materialNum" required lay-verify="required" lay-reqtext="订单名称不能为空"
placeholder="请输入订单名称" value="" class="layui-input">
</div>
</div>
</div>
</div>
</div>
<div class="layui-form-item">
<script type="text/html" id="toolbar">
<div class="layui-btn-container">
<button class="layui-btn layui-btn-normal layui-btn-sm data-add-btn" lay-event="addLine">添加</button>
<button class="layui-btn layui-btn-sm layui-btn-danger data-delete-btn" lay-event="deleteLine">删除</button>
</div>
</script>
<table class="layui-hide" id="addBOM" lay-filter="addBOM"></table>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button class="layui-btn layui-btn-normal" lay-submit lay-filter="saveBtn">确认保存</button>
</div>
</div>
</div>
<script src="../../../lib/layui-v2.5.5/layui.js" charset="utf-8"></script>
<script src="../../../js/md5/md5.js" charset="utf-8"></script>
<script src="../../../js/PublicParameters/PublicParameters.js" charset="utf-8"></script>
<script>
layui.config({
base: '../../../js/lay-module/'
}).extend({
tableEdit: 'tableEdit/tableEdit'
}).use(['table', 'tableEdit', 'form', 'layer'], function () {
var form = layui.form,
table = layui.table,
tableEdit = layui.tableEdit,
layer = layui.layer,
$ = layui.$;
//下拉选项json格式
var params = [
{ "value":"B", "name":"断路器" },
{ "value":"T", "name":"配电箱" },
{ "value":"K", "name":"墙壁开关" },
{ "value":"C", "name":"插座" },
{ "value":"Q", "name":"空调开关" },
{ "value":"P", "name":"指示灯、信号灯" },
{ "value":"W", "name":"物联网产品" },
{ "value":"J", "name":"继电器" }
];
var cols = table.render({
elem: '#addBOM',
skin: 'row', //边框风格
even: true, //开启隔行背景
data: [],
height: 'full-400',
toolbar: '#toolbar',
defaultToolbar: [],
cols: [[
{ type: "checkbox", width: 50 },
{ type: "numbers", title: '序号', width: 50 },
, {
field: 'danxuan', align: 'center', title: '单选', width: 120
, event: 'danxuan', config: { type: 'select', data: params, verify: true }
, templet: function (d) {
if (d.danxuan) {
if (d.danxuan.value) {
return d.danxuan.value;
}
return d.danxuan;
}
return ''
}
},
{ field: 'nameAndSpecs', width: 200, title: '名称及规格', align: "left", edit: "text" },
{ field: 'materials', width: 150, title: '材料', align: "left", edit: "text" },
{ field: 'suppliersName', width: 150, title: '供应商', align: "left", edit: "text" },
{ field: 'amountOfUnit', width: 100, title: '单台用量', align: "center", edit: "text" },
{ field: 'unit', width: 60, title: '单位', align: "center", edit: "text" },
{ field: 'price', width: 60, title: '单价', align: "center", edit: "text" },
{ field: 'amount', width: 80, title: '金额', align: "center", edit: "text" },
{ field: 'borrowings', width: 150, title: '借用件(共用属性)', align: "left", edit: "text" },
{ field: 'remark', width: 275, title: '备注', align: "left", edit: "text" },
]],
limit: 999,
page: false,
skin: 'line'
}).config.cols;
/**
* 参数cols是table.render({})中的cols属性值
* aop代理是基于event点击事件进行操作的
* 因此cols中务必开启event点击事件
**/
var aopTable = tableEdit.aopObj(cols); //获取一个aop对象
/**
* 注意:
* 1、 aopTable.on('tool(xxx)',function (obj) {})
* 2、 table.on('tool(yyy)',function (obj) {})
* 如果1中的xxx与2中的yyy字符串相同时
* 不能同时用,用了会造成后调用者覆盖前调用者。
* 应该直接用1来代替2因为1中包含了2中的事件。
* 如果不相同,则可以同时使用。
**/
aopTable.on('tool(addBOM)', function (obj) {
var field = obj.field; //单元格字段
var value = obj.value; //修改后的值
var data = obj.data; //当前行旧数据
var event = obj.event; //当前单元格事件属性值
var update = {};
update[field] = value;
//把value更新到行中
obj.update(update);
/**
*说白了此obj与table.on('tool(tableEvent)',function (obj) {})
*中的obj对象是同一个所以可以如此操作。
*
* */
});
/**
* toolbar监听事件
*/
table.on('toolbar(addBOM)', function (obj) {
if (obj.event === 'addLine') { // 监听添加操作
var Data = table.cache["addBOM"];
var datas = {
"danxuan": null, "accessoryCode": "", "nameAndSpecs": "", "materials": "", "suppliersName": "", "amountOfUnit": "",
"unit": "", "price": "", "amount": "", "borrowings": "", "remark": ""
}
Data.push(datas);
table.reload('addBOM', {
data: Data
});
$(window).on("resize", function () {
layer.full(index);
});
} else if (obj.event === 'deleteLine') { // 监听删除操作
var checkStatus = table.checkStatus('addBOM');
if (checkStatus.data.length == 0) {
layer.alert('请选择至少一条数据!');
return false;
}
var tableDT = table.cache["addBOM"];
var tableArr = [];
for (var i = 0; i < tableDT.length; i++) {//遍历表格缓存数组
var btnObj = tableDT[i];
if (btnObj.LAY_CHECKED) {//条件:选中
tableDT.splice(i, 1);//移除后后造成数组下标索引发生变化所以下面需要i--
i--;
}
}
tableArr = tableDT;
table.reload("addBOM", {
data: tableArr // 将新数据重新载入表格
});
}
});
//监听提交
form.on('submit(saveBtn)', function (data) {
layer.confirm('确认保存吗?', function () {
var apiUrl = GetWebApiUrl();
var CurrUserInfo = layui.sessionData('CurrUserInfo');
var materialNum = data.field.materialNum;
if (materialNum.length == 1) {
materialNum = '00' + materialNum;
}
else if (materialNum.length == 1) {
materialNum = '0' + materialNum;
}
$.ajax({
url: apiUrl + "/api/services/app/MaterialNumber/CreateMaterialNumber", //请求的url地址
dataType: "json", //返回格式为json
//async: false,//请求是否异步默认为异步这也是ajax重要特性
contentType: 'application/json',
data: JSON.stringify({
materialNum: materialNum,
remark: data.field.remark,
createTime: getDatetime(),
createUserID: CurrUserInfo.data.userid,
createUserName: CurrUserInfo.data.userName,
isDelete: 0
}), //参数值
type: "POST", //请求方式
success: function (req) {
//请求成功时处理
if (req.result.code == 1) {
layer.msg('保存成功', { time: 1000 }, function () {
// 关闭弹出层
var iframeIndex = parent.layer.getFrameIndex(window.name);
// 刷新父页面
window.parent.location.reload();
parent.layer.close(iframeIndex);
});
}
else if (req.result.code == 2) {
layer.msg(req.result.msg);
return false;
}
else {
layer.msg(req.result.msg);
return false;
}
},
error: function () {
/*错误信息处理*/
layer.msg("保存失败,请重试!");
return false;
},
});
return false;
});
return false;
});
});
</script>
</body>
</html>