$().ready(function() {
//学员物料
load();
//getMenuTreeData();
validateRule();
});
$.validator.setDefaults({
submitHandler : function() {
test();
//save();
}
});
//table 改为可编辑
function load() {
$('#exampleTable').bootstrapTable('destroy');//这里必须要添加这个销毁,否则新增、修改、查看的切换可编辑列表中的数据可能加载出现问题。
$('#exampleTable').bootstrapTable('destroy');
$('#exampleTable')
.bootstrapTable(
{
method : 'get', // 服务器数据的请求方式 get or post
url : "/studentmanage/studentinfo/getMaterialListByHallId", // 服务器数据的加载地址
// showRefresh : true,
// showToggle : true,
// showColumns : true,
editable:true,//开启编辑模式
clickToSelect: true,
iconSize : 'outline',
toolbar : '#exampleToolbar',
striped : true, // 设置为true会有隔行变色效果
dataType : "json", // 服务器返回的数据类型
//pagination : true, // 设置为true会在底部显示分页条
// queryParamsType : "limit",
// //设置为limit则会发送符合RESTFull格式的参数
singleSelect : false, // 设置为true将禁止多选
// contentType : "application/x-www-form-urlencoded",
// //发送到服务器的数据编码类型
pageSize : 10, // 如果设置了分页,每页数据条数
pageNumber : 1, // 如果设置了分布,首页页码
//search : true, // 是否显示搜索框
showColumns : false, // 是否显示内容下拉框(选择显示的列)
sidePagination : "server", // 设置在哪里进行分页,可选值为"client" 或者 "server"
queryParams : function(params) {
return {
//说明:传入后台的参数包括offset开始索引,limit步长,sort排序列,order:desc或者,以及所有列的键值对
limit: params.limit,
offset:params.offset,
studentId:$('#studentId').val(),
studentName:$('#studentName').val(),
hallId:$('#hallId option:selected').val(),
levelId:$('#levelId').val(),
classId:$('#classId').val()
};
},
// //请求服务器数据时,你可以通过重写参数的方式添加一些额外的参数,例如 toolbar 中的参数 如果
// queryParamsType = 'limit' ,返回参数必须包含
// limit, offset, search, sort, order 否则, 需要包含:
// pageSize, pageNumber, searchText, sortName,
// sortOrder.
// 返回false将会终止请求
columns : [
//因要求保留学生过往更改信息,删除学生信息时要同时删除以往记录,所以此模块去除批量删除功能
{
checkbox : true
},
{
field: 'materialId',
title: '序号',
editable: false,
formatter:function(value,row,index){
return index+1;
}
},
{
field : 'materialName',
title : '物料名称' ,
},
{
field : 'num',
title : '剩余库存' ,
},
{
field : 'lqnum',
title : '领取数量' ,
formatter: function (value, row, index) {
return " <input id='"+row.materialId+"' type='number' name='lqnum' value='0' />";
}
}
],
});
}
//测试是否获取到数据
function test(){
var a= $('#exampleTable').bootstrapTable('getSelections');
var idbuffer = "";
var valbuffer = "";
var allbuffer="";
for(var i = 0; i < a.length; i++){
//先输入数据和剩余检验
var sy=a[i].num;
var lq=$('#'+a[i].materialId+'').val();
//alert(lq)
if(lq>sy){
alert("数据有误,请检查输入领取数据是否超过剩余库存");
return false;
}
//数据隐藏传送
var name=a[i].materialName;
var id=a[i].materialId;
var val=$("#"+id+"").val();
//alert("选中的id===="+id+"输入的指数据=="+val);
idbuffer+=id+",";
valbuffer+=val+",";
allbuffer+="["+name+"]"+"[数量:"+val+"]";
}
$("#ids").val(idbuffer);
$("#nums").val(valbuffer);
$("#detail").val(allbuffer);
$("#materialId").val(idbuffer);
}
function getMenuTreeData() {
$.ajax({
type : "GET",
url : "/studentmanage/studentinfo/tree",///studentmanage/studentinfo
success : function(menuTree) {
loadMenuTree(menuTree);
}
});
}
function loadMenuTree(menuTree) {
$('#menuTree').jstree({
'core' : {
'data' : menuTree
},
"checkbox" : {
"three_state" : true,
},
"plugins" : [ "wholerow", "checkbox" ]
});
//$('#menuTree').jstree("open_all");
}
function getAllSelectNodes() {
var ref = $('#menuTree').jstree(true); // 获得整个树
menuIds = ref.get_selected(); // 获得所有选中节点的,返回值为数组
$("#menuTree").find(".jstree-undetermined").each(function(i, element) {
menuIds.push($(element).closest('.jstree-node').attr("id"));
});
}
function save() {
var form = new FormData(document.getElementById("signupForm"));
$.ajax({
cache : true,
type : "POST",
url : "/studentmanage/studentinfo/save",
data :form, //$('#signupForm').serialize(),// 你的formid
async : false,
error : function(request) {
parent.layer.alert("Connection error");
},
success : function(data) {
if (data.code == 0) {
parent.layer.msg("操作成功");
parent.reLoad();
var index = parent.layer.getFrameIndex(window.name); // 获取窗口索引
parent.layer.close(index);
} else {
parent.layer.alert(data.msg)
}
}
});
}
function validateRule() {
var icon = "<i class='fa fa-times-circle'></i> ";
$("#signupForm").validate({
rules : {
studentName : {
required : true
},
studentSex : "required",
studentAge : "required",
studentBirth : {
required : true
},
hallId : "required",
levelId : "required",
classId : "required",
studentCard : {
//required : true,
//minlength : 18,
maxlength : 18
},
studentContact : {
required : true
},
studentFiduciary : {
required : true
},
studentJoinMethod : {
//required : true
},
studentSchool : {
required : true
},
studentQq : {
// required : true
}
},
messages : {
studentName : {
required : icon + "请输入姓名"
},
studentSex : icon + "请选择性别",
studentAge : icon + "请选择年龄",
studentBirth : {
required : icon + "请选择生日"
},
hallId : icon + "请选择道馆",
levelId : icon + "请选择段位级别",
classId : icon + "请选择班级",
studentCard : {
required : icon + "请输入身份证号",
minlength : icon + "请输入十八位正确身份证号码",
maxlength : icon + "请输入十八位正确身份证号码",
},
studentContact : {
required : icon + "请输入联系方式"
},
studentFiduciary : {
required : icon + "请填写协议人姓名"
},
studentJoinMethod : {
required : icon + "请填写加入方式"
},
studentSchool : {
required : icon + "请填写学校"
},
studentQq : {
required : icon + "请输入QQ"
}
}
})
}
/
/**
* tinyImgUpload
* @param ele [string] [生成组件的元素的选择器]
* @param options [Object] [对组件设置的基本参数]
* options具体参数如下
* path 图片上传的地址路径 必需
* onSuccess(res) 文件上传成功后的回调 参数为返回的文本 必需
* onFailure(res) 文件上传失败后的回调 参数为返回的文本 必需
* @return [function] [执行图片上传的函数]
* 调用方法
* tinyImgUpload('div', options)
*/
function tinyImgUpload(ele, options) {
// 判断容器元素合理性并且添加基础元素
var eleList = document.querySelectorAll(ele);
if(eleList.length == 0){
console.log('绑定的元素不存在');
return;
}else if(eleList.length>1){
console.log('请绑定唯一元素');
return;
}else {
eleList[0].innerHTML ='<div id="img-container" >'+
'<div class="img-up-add img-item"> <span class="img-add-icon">+</span> </div>'+
'<input type="file" name="files" id="img-file-input" multiple>'+
'</div>';
var ele = eleList[0].querySelector('#img-container');
ele.files = []; // 当前上传的文件数组
}
// 为添加按钮绑定点击事件,设置选择图片的功能
var addBtn = document.querySelector('.img-up-add');
addBtn.addEventListener('click',function () {
document.querySelector('#img-file-input').value = null;
document.querySelector('#img-file-input').click();
return false;
},false)
//判断文件格式和大小
function check(evt){
var filename=evt.target.files[0].name;
var size=evt.target.files[0].size/1024/1024;
if(size>1){
alert("请输入1M以内的图片");
return false;
}
var flag = false; //状态
var arr = ["jpg","png","gif"];
//取出上传文件的扩展名
var index = filename.lastIndexOf(".");
var ext = filename.substr(index+1);
//循环比较
for(var i=0;i<arr.length;i++)
{
if(ext == arr[i])
{
flag = true; //一旦找到合适的,立即退出循环
break;
}
}
//条件判断
if(flag)
{
}else
{
alert("请输入相关格式的文件");
return false;
}
//
}
// 预览图片
//处理input选择的图片
function handleFileSelect(evt) {
check(evt);
var files = evt.target.files;
for(var i=0, f; f=files[i];i++){
// 过滤掉非图片类型文件
if(!f.type.match('image.*')){
continue;
}
// 过滤掉重复上传的图片
var tip = false;
for(var j=0; j<(ele.files).length; j++){
if((ele.files)[j].name == f.name){
tip = true;
break;
}
}
if(!tip){
// 图片文件绑定到容器元素上
ele.files.push(f);
var reader = new FileReader();
reader.onload = (function (theFile) {
return function (e) {
var oDiv = document.createElement('div');
oDiv.className = 'img-thumb img-item';
// 向图片容器里添加元素
oDiv.innerHTML = '<img class="thumb-icon" width="100px;" height="100px;" src="'+e.target.result+'" />'+
'<a href="javscript:;" class="img-remove">x</a>'
ele.insertBefore(oDiv, addBtn);
};
})(f);
reader.readAsDataURL(f);
}
}
}
document.querySelector('#img-file-input').addEventListener('change', handleFileSelect, false);
// 删除图片
function removeImg(evt) {
if(evt.target.className.match(/img-remove/)){
console.log('3',ele.files);
// 获取删除的节点的索引
function getIndex(ele){
if(ele && ele.nodeType && ele.nodeType == 1) {
var oParent = ele.parentNode;
var oChilds = oParent.children;
for(var i = 0; i < oChilds.length; i++){
if(oChilds[i] == ele)
return i;
}
}else {
return -1;
}
}
// 根据索引删除指定的文件对象
var index = getIndex(evt.target.parentNode);
ele.removeChild(evt.target.parentNode);
if(index < 0){
return;
}else {
ele.files.splice(index, 1);
}
console.log('4',ele.files);
}
}
ele.addEventListener('click', removeImg, false);
// 上传图片
function uploadImg() {
var a= $('#exampleTable').bootstrapTable('getSelections');
if(a.length<1){
alert("请选择至少一条数据");
return false;
}
var idbuffer = "";
var valbuffer = "";
var allbuffer="";
for(var i = 0; i < a.length; i++){
//先输入数据和剩余检验
var sy=a[i].num;
var lq=$('#'+a[i].materialId+'').val();
//alert(lq)
if(parseInt(lq)>parseInt(sy)){
alert("数据有误,请检查输入领取数据是否超过剩余库存");
return false;
}
if( parseInt(lq)==0){
alert("数据有误,请检查输入一个领取数据");
return false;
}
if( parseInt(lq)<0){
alert("数据有误,请检查输入一个正领取数据");
return false;
}
if(lq==0||lq=="0"){
alert("数据有误,请检查输入一个领取数据");
return false;
}
//数据隐藏传送
var name=a[i].materialName;
var id=a[i].materialId;
var val=$("#"+id+"").val();
//alert("选中的id===="+id+"输入的指数据=="+val);
idbuffer+=id+",";
valbuffer+=val+",";
allbuffer+="["+name+"]"+"[数量:"+val+"]";
}
$("#ids").val(idbuffer);
$("#nums").val(valbuffer);
$("#detail").val(allbuffer);
$("#materialId").val(idbuffer);
//alert("bufferid===="+idbuffer+"valbuffer==="+valbuffer);
设定校验
var studentName=$("#studentName").val();
if(studentName==null||studentName==''){
layer.alert("请输入姓名")
return false;
}
if(ele.files.length>1){
layer.alert("请添加一张图片")
return false;
}
var studentSex=$("#studentSex").val();
if(studentSex==null||studentSex==''){
layer.alert("请选择性别")
return false;
}
var studentAge=$("#studentAge").val();
if(studentAge==null||studentAge==''){
layer.alert("请选择年龄")
return false;
}
var studentBirth=$("#studentBirth").val();
if(studentBirth==null||studentBirth==''){
layer.alert("请选择生日")
return false;
}
var hallId=$("#hallId").val();
if(hallId==null||hallId==''){
layer.alert("请选择道馆")
return false;
}
var levelId=$("#levelId").val();
if(levelId==null||levelId==''){
layer.alert("请选择段位级别")
return false;
}
var classId=$("#classId").val();
if(classId==null||classId==''){
layer.alert("请选择班级")
return false;
}
var studentCard=$("#studentCard").val();
// if(studentCard==null||studentCard==''){
// layer.alert("请输入十八位正确身份证号码")
// return false;
// }
var studentContact=$("#studentContact").val();
if(studentContact==null||studentContact==''){
layer.alert("请输入联系方式")
return false;
}
var studentFiduciary=$("#studentFiduciary").val();
if(studentFiduciary==null||studentFiduciary==''){
layer.alert("请填写协议人姓名")
return false;
}
var studentSchool=$("#studentSchool").val();
if(studentSchool==null||studentSchool==''){
layer.alert("请填写学校")
return false;
}
var materialId=$("#materialId").val();
if(materialId==null||materialId==''){
layer.alert("请选择物料信息")
return false;
}
//
var formData = new FormData($("#signupForm")[0]);
for(var a=0;a<ele.files.length-1;a++){
formData.append('files', ele.files[a]);
}
for(var i=0, f; f=ele.files[i]; i++){
} console.log('1',ele.files);
console.log('2',formData);
$.ajax({
url : "/studentmanage/studentinfo/save",
type: 'POST',
data: formData,
async: false,
cache: false,
contentType: false,
processData: false,
success: function (data) {
if (data.code == 0) {
ClearForm() ;
// layer.msg("操作成功!",{icon:1,time:6000});
layer.msg("操作成功");
history.go(0) ;
// location.reload() ;
} else {
layer.alert(data.msg)
}
window.location.href="/studentmanage/studentinfo";
},
error: function (returndata) {
layer.alert("保存失败")
}
});
}
return uploadImg;
}
//
function ClearForm() {
var objId = document.getElementById("signupForm");
if (objId == undefined) {
return;
}
for (var i = 0; i < objId.elements.length; i++) {
if (objId.elements[i].type == "text") {
objId.elements[i].value = "";
}
else if (objId.elements[i].type == "password") {
objId.elements[i].value = "";
}
else if (objId.elements[i].type == "radio") {
objId.elements[i].checked = false;
}
else if (objId.elements[i].type == "checkbox") {
objId.elements[i].checked = false;
}
else if (objId.elements[i].type == "select-one") {
objId.elements[i].options[0].selected = true;
}
else if (objId.elements[i].type == "select-multiple") {
for (var j = 0; j < objId.elements[i].options.length; j++) {
objId.elements[i].options[j].selected = false;
}
}
else if (objId.elements[i].type == "textarea") {
objId.elements[i].value = "";
}
}
}