很折腾人的编程,被折磨了一个星期,问题在于我把问题想复杂了,总想尽量满足用户的需求,尽可能把多种要求都加进来,多考虑用户可能出现的变动需求。
合同文件的编辑,内容可以有很多的选项,可以是:
1、系统自动执行;
2、手工输入;
3、列表选择;
4、单选;
上面是第一次考虑并完成的内容,后面还需要加入其他的内容:
1、列表可以有多种,比如单选列值、单选列出所有项目并方框标识选中项目、选中出现输入窗口补全后续信息等等;
2、手工输入如何记忆不同用户的输入并在后续填写相关内容中出现;
3、系统函数如何依赖外部注入;
4、如何插入表格并以用户选择的方式取值;
5、如何插入图片;
......
目前完成的界面:
主要代码,表格的值装载:
form.on('submit(formStep2)', function (data) {
//如果项目列表数大于0并且选择了项目则继续
if(selectPorjectRowObj){
//判断有无数据记录
$.ajax({
url:'ZTBCommon.php',
data:{
"OP":"IsExist",
"strWhere":"c01='"+selectPorjectRowObj['data']['c02']+"' and c13="+selectPorjectRowObj['data']['c01']+" and c15='"+selectPorjectRowObj['data']['c14']+"' ",
"strTable":"FileItemValue",
},
type:'POST',
datetype:'json',
async:false,//不能异步
success:function (data) {
console.log(data['data']);
if(data!='OK'){
console.log('创建!');
//没有则创建
$.ajax({
url:'ZTBUserZBFile.php',
data:{
"OP":"createUserEditList",
"Year":selectPorjectRowObj['data']['c01'],
"Project":selectPorjectRowObj['data']['c02'],
"ProjectChild":selectPorjectRowObj['data']['c14']
},
type:'POST',
datetype:'json',
async:false,//不能异步
success:function (data) { },
error:function(data){ console.log('错误:'+data);}
});
}
}
});
//得到招标文件编辑条款的信息
console.log(selectPorjectRowObj['data']['c01']+"|"+selectPorjectRowObj['data']['c02']+"|"+selectPorjectRowObj['data']['c14']);
table.render({
elem: '#projectEditInfo',
url: 'ZTBUserZBFile.php',
method:'POST',
where:{
"OP":"userEditList",
"Year":selectPorjectRowObj['data']['c01'],
"Project":selectPorjectRowObj['data']['c02'],
"ProjectChild":selectPorjectRowObj['data']['c14']
},
toolbar: '#toolbarDemo',
defaultToolbar: ['exports'],
cols: [[
{type: 'numbers', width: 80, title: '行号',hide:true},
{field: 'c03', width: 70, title: '序号', align: "center"},
{field: 'c13', width: 80, title: '年度',hide:true},
{field: 'c01', width: 240, title: '项目名称',hide:true},
{field: 'c15', width: 200, title: '子项目名称',hide:true},
{field: 'c02', width: 240, title: '用户名称',hide:true},
{field: 'c06', width: 200, title: '书签名称'},
{field: 'c07', width: 120, title: '样式大类'},
{field: 'c08', width: 180, title: '样式小类',hide:true},
{field: 'c04', width: 200, title: '样式名称',hide:true},
{field: 'c11', width: 450, title: '输入的内容', event:'userInput',templet:'#convertInputStype'},
{field: 'c09', width: 90, title: '强制录入',templet:'#switchTpl', unresize: true},
{field: 'c10', width: 120, title: '完成输入',templet:'#checkboxTpl', unresize: true},
{field: 'c12', width: 100, title: '内容标记',hide:true},
{field: 'c14', width: 90, title: '是否可编辑',templet:'#switchTp2', unresize: true},
{field: 'c17', width: 100, title: '样式内容',hide:true},
{field: 'c18', width: 100, title: '样式标记',hide:true},
{field: 'c19', width: 150, title: '实际内容',hide:true}
]],
page: false,
skin: 'gird',
done: function (res, curr, count) {
tableTotalCount=res.data.length;
let isFirstTime=false;
let sTemp='';
//如果是第一次,则需要执行系统函数:循环提取表格中的行记录,执行系统函数并且赋值
$.ajax({
url:'ZTBCommon.php',
data:{
"OP":"getProjectNameFromEditTable",
"Year":selectPorjectRowObj['data']['c01'],
"Project":selectPorjectRowObj['data']['c02'],
"ProjectChild":selectPorjectRowObj['data']['c14']
},
type:'POST',
datetype:'json',
async:false,//不能异步
success:function (data) {
if(data['data']=='' || data['data']==null){ isFirstTime=true; }
},
error:function(data){
console.log(data);
}
});
if(isFirstTime){
for (let i=0;i<res.data.length;i++){
$("#projectEditInfo").next().find("tbody tr[data-index='" +i +"'] td[data-field='c12'] div").html(i);//改变值
if(res.data[i]['c07']=='系统函数'){
$.ajax({
url:'ZTBCommon.php',
data:{
"OP":"ZTBSysFunction",
"ItemType":res.data[i]['c08'],
"ItemName":res.data[i]['c04'],
"Year":selectPorjectRowObj['data']['c01'],
"Project":selectPorjectRowObj['data']['c02'],
"ProjectChild":selectPorjectRowObj['data']['c14']
},
type:'POST',
async:true,
success:function (data) {
if(data['data']){
$("#projectEditInfo").next().find("tbody tr[data-index='" +i +"'] td[data-field='c11'] div").html(data['data']);//改变值
$("#projectEditInfo").next().find("tbody tr[data-index='" +i +"'] td[data-field='c11'] div").css('color','blue');//改变值
table.cache.projectEditInfo[i].c11=data['data'];
$("#projectEditInfo").next().find("tbody tr[data-index='" +i +"'] td[data-field='c19'] div").html(data['data']);//改变值
$("#projectEditInfo").next().find("tbody tr[data-index='" +i +"'] td[data-field='c19'] div").css('color','blue');//改变值
}
}
});
}
}
}
$(".layui-table-body, .layui-table-box, .layui-table-cell").css('overflow', 'visible');
}
});
//写信息
document.getElementById("lbl_1").innerText=selectPorjectRowObj['data']['c01'];
document.getElementById("lbl_2").innerText=selectPorjectRowObj['data']['c02'];
document.getElementById("lbl_3").innerText=selectPorjectRowObj['data']['c14'];
step.next('#stepForm');
}
return false;
});
模板语法:
<script type="text/html" id="convertInputStype">
{{#
var selectList='';
var strPSP='';
var optionList='';
switch(d.c07){
case '手工输入':
strPSP="<div class='layui-input-inline'><input type='text' id='Dcinput"+d.c03+"' value='"+d.c19+"' class='layui-input' lay-filter='DCinput' onkeypress='keyboardInput(event)'></div>";
return strPSP;
break;
case '列表':
selectList=d.c17.split('|');
strPSP="<div class='layui-input-inline' style='width: 300px;'><select lay-filter='DCselect' id='DCselect'+d.c03>";
for (var i=0 ; i<selectList.length ; i++ ) {
if(d.c19==selectList[i]){
strPSP = strPSP + "<option value='" + selectList[i] + "' layui-this selected>" + selectList[i] + "</option>" ;
}else{
strPSP = strPSP + "<option value='" + selectList[i] + "'>" + selectList[i] + "</option>" ;
}
}
strPSP=strPSP+"</select></div>";
return strPSP;
break;
case '二选一':
optionList=d.c18.split('|');
if(d.c19==optionList[0]){
strPSP = "<div class='layui-input-inline'><input type='radio' name='Dc"+d.c03+"' id='DcA"+d.c03+"' value='"+optionList[0]+"' title='"+optionList[0]+"' lay-filter='Dcradio' checked='checked'> <input type='radio' name='Dc"+d.c03+"' id='DcB"+d.c03+"' value='"+optionList[1]+"' title='"+optionList[1]+"'></div>";
}else{
strPSP = "<div class='layui-input-inline'><input type='radio' name='Dc"+d.c03+"' id='DcA"+d.c03+"' value='"+optionList[0]+"' title='"+optionList[0]+"' lay-filter='Dcradio'> <input type='radio' name='Dc"+d.c03+"' id='DcB"+d.c03+"' value='"+optionList[1]+"' title='"+optionList[1]+"' checked='checked'></div>";
}
return strPSP;
break;
default:
return d.c11;
break;
}
}}
</script>
程序虽然完成了绝大多数的功能,但是越写越感到鸡肋,因为程序就是动态生成一个Word文件,感觉没有必要这么来完成了,不想写了。
唉,白费了这么一阵子的劲。