better-staridc-MNBT
1czdhx=1; //操作第几步的数字记录
2updhx=1; //表单第几个的数字记录
3bl_arr=[] //存放变量的数组
4
5function add_cz(czlx){ //添加操作
6 msloading('添加中,请稍后...'); // 加载圈显示
7 // 安全:白名单验证 czlx 字段,只允许预定义的操作类型
8 var allowedCzlx = ['xjwj','xjwjj','delwj','delwjj','setwj','drsql','gettj','setyxml','setwjt','setphp'];
9 if (allowedCzlx.indexOf(czlx) === -1) {
10 console.error('非法的操作类型:', czlx);
11 msloadingde();
12 return;
13 }
14 var funcName = 'gl_' + czlx;
15 if (typeof window[funcName] !== 'function') {
16 console.error('未找到操作处理函数:', funcName);
17 msloadingde();
18 return;
19 }
20 var ret = window[funcName]();
21 var tmp = document.createElement("div");
22 tmp.className="form-group nbvbk border border-cyan";
23 tmp.innerHTML= '<label for="web_site_icp">'+'第'+czdhx+'步操作:'+ret[0]+'</label><a href="#!" class="mdi mdi-delete float-right text-dark"></a>'+ret[1];
24 document.getElementById("tjdcznr").appendChild(tmp);
25 czdhx++; //步骤数字+1
26 msloadingde(); // 隐藏加载圈
27}
28
29function add_pt(czlx){ //添加表单(得有预览功能)
30 msloading('添加中,请稍后...'); // 加载圈显示
31 // 安全:白名单验证 czlx 字段,只允许预定义的表单类型
32 var allowedCzlx = ['input','dxk','dxks','urlxz','textarea','file','select','checkbox','radio'];
33 if (allowedCzlx.indexOf(czlx) === -1) {
34 console.error('非法的表单类型:', czlx);
35 msloadingde();
36 return;
37 }
38 var funcName = 'gs_' + czlx;
39 if (typeof window[funcName] !== 'function') {
40 console.error('未找到表单处理函数:', funcName);
41 msloadingde();
42 return;
43 }
44 var ret = window[funcName]();
45 var tmp = document.createElement("div");
46 tmp.className="nbvbks border border-purple";
47 tmp.innerHTML= '<label for="web_site_icp">表单:'+ret[0]+'</label><a href="#!" class="mdi mdi-delete float-right text-dark"></a>'+ret[1];
48 document.getElementById("inputs").appendChild(tmp);
49 updhx++; //步骤数字+1
50 qblup() //刷新全局可选择变量
51 msloadingde(); // 隐藏加载圈
52}
53
54
55
56function gl_xjwj(){
57 var lx='xjwj'; //操作类型:新建文件
58 var czmc='新建文件'; //这步操作的名称(用于显示)
59 var clname1='czf['+czdhx+'][cz]'; //cz是操作类型的意思
60 var clname2='czf['+czdhx+'][name]'; //name是文件名称
61 var clname3='czf['+czdhx+'][ml]'; //ml是文件存放目录
62 var retus='<input type="text" style="visibility:hidden" name="'+clname1+'" value="'+lx+'"/><input type="text" name="'+clname2+'" class="form-control" placeholder="新建文件的名称" required/><br/><input type="text" name="'+clname3+'" class="form-control" placeholder="新建文件的存放目录" required/>';
63 return [czmc,retus];
64}
65
66function gl_xjwjj(){
67 var lx='xjwjj'; //操作类型:新建文件夹
68 var czmc='新建文件夹'; //这步操作的名称(用于显示)
69 var clname1='czf['+czdhx+'][cz]'; //cz是操作类型的意思
70 var clname2='czf['+czdhx+'][name]'; //name是文件名称
71 var clname3='czf['+czdhx+'][ml]'; //ml是文件存放目录
72 var retus='<input type="text" style="visibility:hidden" name="'+clname1+'" value="'+lx+'"/><input type="text" name="'+clname2+'" class="form-control" placeholder="新建文件夹的名称" required/><br/><input type="text" name="'+clname3+'" class="form-control" placeholder="新建文件夹的存放目录" required/>';
73 return [czmc,retus];
74}
75
76function gl_delwj(){
77 var lx='delwj'; //操作类型:删除文件
78 var czmc='删除文件'; //这步操作的名称(用于显示)
79 var clname1='czf['+czdhx+'][cz]'; //cz是操作类型的意思
80 var clname2='czf['+czdhx+'][name]'; //naem该文件的名称
81 var clname3='czf['+czdhx+'][ml]'; //ml该文件的所在目录
82 var retus='<input type="text" style="visibility:hidden" name="'+clname1+'" value="'+lx+'"/><input type="text" name="'+clname2+'" class="form-control" placeholder="该文件的名称" required/><br/><input type="text" name="'+clname3+'" class="form-control" placeholder="该文件的所在目录" required/>';
83 return [czmc,retus];
84}
85
86function gl_delwjj(){
87 var lx='delwjj'; //操作类型:删除文件夹
88 var czmc='删除文件夹'; //这步操作的名称(用于显示)
89 var clname1='czf['+czdhx+'][cz]'; //cz是操作类型的意思
90 var clname2='czf['+czdhx+'][name]'; //naem该文件夹的名称
91 var clname3='czf['+czdhx+'][ml]'; //ml该文件夹的所在目录
92 var retus='<input type="text" style="visibility:hidden" name="'+clname1+'" value="'+lx+'"/><input type="text" name="'+clname2+'" class="form-control" placeholder="该文件夹的名称" required/><br/><input type="text" name="'+clname3+'" class="form-control" placeholder="该文件夹的所在目录" required/>';
93 return [czmc,retus];
94}
95
96function gl_setwj(){
97 var lx='setwj'; //操作类型:修改文件内容
98 var czmc='修改文件内容'; //这步操作的名称(用于显示)
99 var clname1='czf['+czdhx+'][cz]'; //cz是操作类型的意思
100 var clname2='czf['+czdhx+'][name]'; //naem该文件的名称
101 var clname3='czf['+czdhx+'][ml]'; //ml该文件夹的所在目录
102 var clname4='czf['+czdhx+'][nr]'; //nr该文件修改后的内容
103 var retus='<input type="text" style="visibility:hidden" name="'+clname1+'" value="'+lx+'"/><input type="text" name="'+clname2+'" class="form-control" placeholder="该文件的名称" required/><br/><input type="text" name="'+clname3+'" class="form-control" placeholder="该文件的所在目录" required/><br/><textarea type="text" name="'+clname4+'" class="form-control" placeholder="修改后的内容" rows="15"></textarea>';
104 return [czmc,retus];
105}
106
107function gl_drsql(){
108 var lx='drsql'; //操作类型:导入数据库
109 var czmc='导入数据库文件'; //这步操作的名称(用于显示)
110 var clname1='czf['+czdhx+'][cz]'; //cz是操作类型的意思
111 var clname2='czf['+czdhx+'][name]'; //naem该数据库文件的名称
112 var clname3='czf['+czdhx+'][ml]'; //ml该文件的的所在目录
113 var retus='<input type="text" style="visibility:hidden" name="'+clname1+'" value="'+lx+'"/><input type="text" name="'+clname2+'" class="form-control" placeholder="该数据库文件的名称" required/><br/><input type="text" name="'+clname3+'" class="form-control" placeholder="该数据库文件的所在目录" required/>';
114 return [czmc,retus];
115}
116
117function gl_gettj(){
118 var lx='gettj'; //操作类型:访问URL
119 var czmc='GET提交'; //这步操作的名称(用于显示)
120 var clname1='czf['+czdhx+'][cz]'; //cz是操作类型的意思
121 var clname2='czf['+czdhx+'][url]'; //url是要访问的域名
122 var clname3='czf['+czdhx+'][get]'; //get是要提交的内容
123 var retus='<input type="text" style="visibility:hidden" name="'+clname1+'" value="'+lx+'"/><input type="text" name="'+clname2+'" class="form-control" placeholder="要访问的域名(写法请看下方介绍)" required/><br/><input type="text" name="'+clname3+'" class="form-control" placeholder="要提交的内容(写法请看下方介绍)" required/>';
124 return [czmc,retus];
125}
126
127
128function gl_setyxml(){
129 var lx='setyxml'; //操作类型:设置运行目录
130 var czmc='设置运行目录'; //这步操作的名称(用于显示)
131 var clname1='czf['+czdhx+'][cz]'; //cz是操作类型的意思
132 var clname2='czf['+czdhx+'][lj]'; //lj是路径
133 var retus='<input type="text" style="visibility:hidden" name="'+clname1+'" value="'+lx+'"/><input type="text" name="'+clname2+'" class="form-control" placeholder="请输入文件夹名称(仅限根目录下的一级文件夹)" required/>';
134 return [czmc,retus];
135}
136
137
138function gl_setwjt(){
139 var lx='setwjt'; //操作类型:设置伪静态
140 var czmc='设置伪静态'; //这步操作的名称(用于显示)
141 var clname1='czf['+czdhx+'][cz]'; //cz是操作类型的意思
142 var clname2='czf['+czdhx+'][nr]'; //nr是内容
143 var retus='<input type="text" style="visibility:hidden" name="'+clname1+'" value="'+lx+'"/><textarea type="text" name="'+clname2+'" class="form-control" placeholder="伪静态内容" rows="15"></textarea>';
144 return [czmc,retus];
145}
146
147function gl_setphp(){
148 var lx='setphp'; //操作类型:设置PHP版本
149 var czmc='设置PHP版本'; //这步操作的名称(用于显示)
150 var clname1='czf['+czdhx+'][cz]'; //cz是操作类型的意思
151 var clname2='czf['+czdhx+'][php]'; //php是PHP版本号
152 var retus='<input type="text" style="visibility:hidden" name="'+clname1+'" value="'+lx+'"/><input type="text" name="'+clname2+'" class="form-control" placeholder="PHP版本号,如:74/80/81/82(支持 [sf_变量名] 引用用户表单)" required/>';
153 return [czmc,retus];
154}
155
156
157
158
159
160function gs_input(){
161 var lx='input'; //操作类型:表单
162 var czmc='一个表单'; //这步操作的名称(用于显示)
163 var clname1='bdf['+updhx+'][cz]'; //cz是操作类型的意思
164 var clname2='bdf['+updhx+'][ltaler]'; //ltaler是左上角文字提示
165 var clname3='bdf['+updhx+'][blx]'; //blx是选择的变量
166 var clname4='bdf['+updhx+'][isnr]'; //isnr是输入框内部显示的文字
167 var clname5='bdf['+updhx+'][bt]'; //bt是是否必填
168 var clname6='bdf['+updhx+'][cdxz]'; //cdxz是长度限制
169 var clname7='bdf['+updhx+'][srlx]'; //srlx是输入类型
170 var tmp = document.createElement("div");
171 var retus='<input type="text" style="visibility:hidden" name="'+clname1+'" value="'+lx+'"/><div class="form-row dspj"><div class="col-12 col-md-6 dspj"><input type="text" class="form-control" placeholder="左上角显示的提示文字" name="'+clname2+'"></div><div class="col-12 col-md-6 dspj"><select class="custom-select" id="blxz" name="'+clname3+'"><option>变量选择</option><option>新建一个变量</option></select></div></div><div class="form-row dspj"><div class="col-12 col-md-6 dspj"><input type="text" class="form-control" placeholder="输入框内部显示的提示文字" name="'+clname4+'"></div><div class="col-12 col-md-6 dspj"><select class="custom-select" name="'+clname5+'"><option>是否必填</option><option>是</option><option>否</option></select></div></div><div class="form-row dspj"><div class="col-12 col-md-6 dspj"><input type="number" class="form-control" placeholder="长度限制 最多可以输入多少个字符" name="'+clname6+'"></div><div class="col-12 col-md-6 dspj"><select class="custom-select" name="'+clname7+'"><option>输入类型</option><option>文本</option><option>数字</option></select></div></div>';
172 return [czmc,retus];
173}
174
175function gs_dxk(){
176 var lx='dxk'; //操作类型:单选框
177 var czmc='单选框'; //这步操作的名称(用于显示)
178 var clname1='bdf['+updhx+'][cz]'; //cz是操作类型的意思
179 var clname2='bdf['+updhx+'][ltaler]'; //ltaler是左上角文字提示
180 var clname3='bdf['+updhx+'][blx]'; //blx是选择的变量
181 var clname4='bdf['+updhx+'][xknr]'; //xknr是选框内容
182 var tmp = document.createElement("div");
183 var retus='<input type="text" style="visibility:hidden" name="'+clname1+'" value="'+lx+'"/><div class="form-row dspj"><div class="col-12 col-md-6 dspj"><input type="text" class="form-control" placeholder="左上角显示的提示文字" name="'+clname2+'"></div><div class="col-12 col-md-6 dspj"><select class="custom-select" id="blxz" name="'+clname3+'"><option>变量选择</option><option>新建一个变量</option></select></div><div class="col-12 col-md-12 dspj"><textarea type="text" style="display:none" value="" name="'+clname4+'"></textarea><select class="custom-select" id="dxknradd"><option>单选框内容</option><option>添加一个选项</option><option>↓↓以下选项会展示给用户↓↓</option></select></div></div></div>';
184 return [czmc,retus];
185}
186
187function gs_dxks(){
188 var lx='dxks'; //操作类型:多选框
189 var czmc='多选框'; //这步操作的名称(用于显示)
190 var clname1='bdf['+updhx+'][cz]'; //cz是操作类型的意思
191 var clname2='bdf['+updhx+'][ltaler]'; //ltaler是左上角文字提示
192 var clname3='bdf['+updhx+'][blx]'; //blx是选择的变量
193 var clname4='bdf['+updhx+'][xknr]'; //xknr是选框内容
194 var tmp = document.createElement("div");
195 var retus='<input type="text" style="visibility:hidden" name="'+clname1+'" value="'+lx+'"/><div class="form-row dspj"><div class="col-12 col-md-6 dspj"><input type="text" class="form-control" placeholder="左上角显示的提示文字" name="'+clname2+'"></div><div class="col-12 col-md-6 dspj"><select class="custom-select" id="blxz" name="'+clname3+'"><option>变量选择</option><option>新建一个变量</option></select></div><div class="col-12 col-md-12 dspj"><textarea type="text" style="display:none" value="" name="'+clname4+'"></textarea><select multiple class="custom-select" id="dxknradd"><option>多选框内容</option><option>添加一个选项</option><option>↓↓以下选项会展示给用户↓↓</option></select></div></div></div>';
196 return [czmc,retus];
197}
198
199function gs_urlxz(){
200 var lx='urlxz'; //操作类型:域名选择
201 var czmc='域名选择'; //这步操作的名称(用于显示)
202 var clname1='bdf['+updhx+'][cz]'; //cz是操作类型的意思
203 var clname2='bdf['+updhx+'][ltaler]'; //ltaler是左上角文字提示
204 var clname3='bdf['+updhx+'][blx]'; //blx是选择的变量
205 var clname4='bdf['+updhx+'][urlxml]'; //urlxml是选框内容
206 var clname5='bdf['+updhx+'][bt]'; //bt是是否必填
207 var tmp = document.createElement("div");
208 var retus='<input type="text" style="visibility:hidden" name="'+clname1+'" value="'+lx+'"/><div class="form-row dspj"><div class="col-12 col-md-6 dspj"><input type="text" class="form-control" placeholder="左上角显示的提示文字" name="'+clname2+'"></div><div class="col-12 col-md-6 dspj"><select class="custom-select" id="blxz" name="'+clname3+'"><option>变量选择</option><option>新建一个变量</option></select></div></div><div class="form-row dspj"><div class="col-12 col-md-6 dspj"><select class="custom-select" name="'+clname4+'"><option>能选择的域名</option><option>无限制</option><option>绑定了子目录的</option><option>未绑定子目录的</option></select></div><div class="col-12 col-md-6 dspj"><select class="custom-select" name="'+clname5+'"><option>是否必选</option><option>是</option><option>否</option></select></div></div><small>单选,将在用户填写表单时让用户选择主机已经绑定的域名</small></div>';
209 return [czmc,retus];
210}
211
212
213
214function qblup(){ //全局变量更新
215var ysyblarr=[];
216var ysyblarr2={};
217$("select[id='blxz']").each(function(){ //获取已经使用的变量
218if($(this).val()=='新建一个变量'){
219ysyblarr.push('变量选择');
220}else{
221ysyblarr.push($(this).val()); //判断用
222ysyblarr2[$(this).val()]=this; //获取用
223}
224});
225var bls='<option>变量选择</option>'
226$.each(bl_arr,function(i,va){ //循环当前所有变量
227if($.inArray(va,ysyblarr)=='-1'){ //没有被使用的变量
228//未被使用的变量
229bls+='<option>'+this+'</option>'
230}else{
231//已经被使用的变量
232}
233})
234bls+='<option>新建一个变量</option>'
235$("select[id='blxz']").html(bls);
236
237$.each(ysyblarr2,function(is,vai){ //循环当前所有变量
238if(is!='变量选择' && is!='新建一个变量'){
239$(vai).append('<option>'+is+'</option>');
240}
241})
242
243//给予值
244var adts=0;
245$("select[id='blxz']").each(function(){
246$(this).find("option:contains('"+ysyblarr[adts]+"')").attr("selected",true);
247adts++;
248});
249}
250
251$(function(){
252
253$("#inputs").on("change","select[id='dxknradd']",function(){
254if($(this).val() instanceof Array){
255if($(this).val().length>1){
256return;
257}
258}
259var dqxxk=this;
260if($(this).val()=='添加一个选项'){
261 $.confirm({
262 title: '新增一个单选框选项',
263 content: '<div class="form-group p-1 mb-0">' +
264 ' <label class="control-label">选项名</label>' +
265 ' <input autofocus="" type="text" id="input-bls" placeholder="请输入选项名" class="form-control">' +
266 '<br/>'+
267 '</div>',
268 buttons: {
269 sayMyName: {
270 text: '确定',
271 btnClass: 'btn-orange',
272 action: function() {
273 var input = this.$content.find('input#input-bls');
274 if (!$.trim(input.val())) {
275 $.alert({
276 title: '提示',
277 content: "选项名字段不能为空为空。",
278 type: 'red'
279 });
280 return false;
281 } else {
282 $(dqxxk).append('<option>'+input.val()+'</option>');
283 var inputsr=$(dqxxk).parent().children()[0];
284 var ynr=inputsr.value;
285 $(inputsr).val(ynr+'<option>'+input.val()+'</option>'); //添加到隐藏表单中
286 $(dqxxk).val("单选框内容");
287 }
288 }
289 },
290 '取消': function() {}
291 }
292 });
293}else if($(this).val()!='单选框内容' && $(this).val()!='多选框内容' && $(this).val()!='↓↓以下选项会展示给用户↓↓'){
294 $.confirm({
295 title: '提示',
296 content: '确认删除选项 ['+$(dqxxk).val()+'] 吗?',
297 buttons: {
298 sayMyName: {
299 text: '确定',
300 btnClass: 'btn-orange',
301 action: function() {
302 var valiue=$(dqxxk).val();
303 $(dqxxk).find("option:contains('"+$(dqxxk).val()+"')").remove();
304 var inputsr=$(dqxxk).parent().children()[0];
305 var ynr=inputsr.value;
306 var thhr = ynr.replace('<option>'+valiue+'</option>', "");
307 $(inputsr).val(thhr);
308 //替换隐藏input中的op
309 }
310 },
311 '取消': function() {}
312 }
313 });
314}
315})
316
317
318
319//变量选择
320$("#inputs").on("change",'select[id="blxz"]',function(){
321var xznr=$(this).val();
322if(xznr=='新建一个变量'){
323 $.confirm({
324 title: '新建一个变量',
325 content: '<div class="form-group p-1 mb-0">' +
326 ' <label class="control-label">变量名</label>' +
327 ' <input autofocus="" type="text" id="input-bls" placeholder="请输入新变量的变量名" class="form-control">' +
328 '<br/><small>变量名可随意输入,变量是在替换数据时使用的,用户在部署程序时系统会弹出一个对话窗让用户填写您添加的表单(未添加任何表单则不会弹出对话窗),用户填写完成后您可以在添加操作时(仅限修改文件内容和GET提交)输入特定文本( [sf_变量名] )即可在系统执行部署操作时将这些特定文本替换为用户输入的数据!</small>'+
329 '</div>',
330 buttons: {
331 sayMyName: {
332 text: '确定',
333 btnClass: 'btn-orange',
334 action: function() {
335 var input = this.$content.find('input#input-bls');
336 if (!$.trim(input.val())) {
337 $.alert({
338 title: '提示',
339 content: "新的变量字段不能为空为空。",
340 type: 'red'
341 });
342 return false;
343 } else {
344 if($.inArray(input.val(),bl_arr)!='-1'){
345 $.alert({
346 title: '提示',
347 content: "变量已存在!",
348 type: 'red'
349 });
350 return false;
351 }
352 bl_arr.push(input.val());
353 //更新全局变量下拉
354 qblup();
355 }
356 }
357 },
358 '取消': function() {qblup();}
359 }
360 });
361}else{
362//已选择变量,更新全局变量下拉
363qblup();
364}
365})
366
367//表单操作-表单删除
368
369$("#inputs").on("mouseover mouseout",'a.mdi-delete',function () { //鼠标移动上去修改样式名
370$(this).closest('.text-dark').toggleClass("text-danger");
371$(this).closest('.mdi-delete').toggleClass("mdi-delete-empty");
372})
373
374$("#inputs").on("click","a.mdi-delete",function(){ //删除一行操作
375$(this).parent().addClass("animated bounce fadeOutRight");
376var bq=$(this).parent();
377setTimeout(function() {
378bq.remove(); //删除一个操作
379var sybq=$("#inputs").children(); //获取所有子标签
380if(sybq.length==0){
381updhx=1; //无操作标签,重置操作步骤
382}
383}, 400);
384})
385
386
387//安装时的操作-步骤删除
388
389$("#tjdcznr").on("mouseover mouseout",'a.mdi-delete',function () { //鼠标移动上去修改样式名
390$(this).closest('.text-dark').toggleClass("text-danger");
391$(this).closest('.mdi-delete').toggleClass("mdi-delete-empty");
392})
393
394$("#tjdcznr").on("click","a.mdi-delete",function(){ //删除一行操作
395$(this).parent().addClass("animated bounce fadeOutRight");
396var bq=$(this).parent();
397setTimeout(function() {
398bq.remove(); //删除一个操作
399var sybq=$("#tjdcznr").children(); //获取所有子标签
400if(sybq.length!=0){
401var xhcs=1;
402$.each(sybq,function(){ //循环
403var csd=$($(this).children()[0])[0].innerText; //获取子标签(label)的内容
404var dre=csd.replace(/[\d]+/,xhcs) //替换数字
405$($(this).children()[0]).html(dre); //显示的操作步骤修改
406xhcs++;
407})
408}else{
409czdhx=1; //无操作标签,重置操作步骤
410}
411}, 400);
412})
413
414})