1552 lines
62 KiB
JavaScript
1552 lines
62 KiB
JavaScript
/*
|
||
* Author: 众产® https://ciy.cn/code
|
||
* Version: 0.2.8
|
||
*/
|
||
'use strict';
|
||
var ciycmpfunc = {};
|
||
ciyfn.file_uploads = function (maxcount, files, opn, fn) {
|
||
fn = fn || {};
|
||
var upcnt = 0;
|
||
console.log(files, opn);
|
||
for (var fi in files) {
|
||
if (typeof files[fi] != "object")
|
||
continue;
|
||
(function (gfile, tmt) {
|
||
setTimeout(function () {
|
||
upcnt++;
|
||
if (upcnt > maxcount)
|
||
return;
|
||
if (opn.maxkb > 0 && gfile.size > opn.maxkb * 1024)
|
||
return ciyfn.toast('不能上传大于' + opn.maxkb + 'KB 的文件<br/>当前文件大小: ' + toint(gfile.size / 1024) + 'KB');
|
||
var fext = ciyfn.file_ext(gfile.name);
|
||
if (opn.type) {
|
||
if (opn.type.indexOf(fext) == -1)
|
||
return ciyfn.toast('只能上传' + opn.type.join(',') + '文件');
|
||
}
|
||
var fread = new FileReader();
|
||
fread.readAsDataURL(gfile);
|
||
fread.onload = function () {
|
||
if (!ciyfn.isimg(fext))
|
||
return uploadfile(gfile);
|
||
var img = new Image();
|
||
img.src = fread.result;
|
||
img.onload = function () {
|
||
var width = 0;
|
||
var height = 0;
|
||
if (opn.imgwidth > 0) {
|
||
if (opn.imgwidth == opn.imgheight) {
|
||
width = height = Math.min(img.width, img.height, opn.imgwidth);
|
||
} else if (img.width > opn.imgwidth) {
|
||
width = opn.imgwidth;
|
||
if (opn.imgheight > 0)
|
||
height = opn.imgheight;
|
||
else
|
||
height = width * img.height / img.width;
|
||
}
|
||
}
|
||
var zipjpg = opn.zipjpg;
|
||
if (zipjpg > 0 && opn.zipext) {
|
||
if (opn.zipext.indexOf(fext) == -1)
|
||
zipjpg = 0;
|
||
}
|
||
if (width == 0 && zipjpg == 0 && !opn.watertext && !opn.fn_imgdraw)
|
||
return uploadfile(gfile);
|
||
if (width == 0) {
|
||
width = img.width;
|
||
height = img.height;
|
||
}
|
||
|
||
var canvas = document.createElement("canvas");
|
||
var ctx = canvas.getContext("2d");
|
||
var attrw = document.createAttribute("width");
|
||
attrw.nodeValue = width;
|
||
var attrh = document.createAttribute("height");
|
||
attrh.nodeValue = height;
|
||
canvas.setAttributeNode(attrw);
|
||
canvas.setAttributeNode(attrh);
|
||
ctx.drawImage(img, 0, 0, width, height);
|
||
if (typeof (opn.fn_imgdraw) == 'function')
|
||
opn.fn_imgdraw(canvas, ctx, img);
|
||
|
||
if (opn.watertext) {
|
||
ctx.font = opn.waterfont;
|
||
var fontheight = ctx.measureText('啊').width * 1.2;
|
||
var lines = opn.watertext.split('|');
|
||
var y = height - fontheight * lines.length;
|
||
for (var i in lines) {
|
||
ctx.fillStyle = '#000000';
|
||
ctx.fillText(lines[i], fontheight + 1, y + 1);
|
||
ctx.fillText(lines[i], fontheight - 1, y - 1);
|
||
ctx.fillStyle = '#fffdea';
|
||
ctx.fillText(lines[i], fontheight, y);
|
||
y += fontheight;
|
||
}
|
||
}
|
||
var name = gfile.name;
|
||
if (zipjpg > 0) {
|
||
var U = canvas.toDataURL("image/jpeg", zipjpg/100);
|
||
if (fext != 'JPG')
|
||
name = gfile.name + '.jpg';
|
||
}
|
||
else
|
||
var U = canvas.toDataURL();
|
||
var i = U.split(","),
|
||
I = i[0].match(/:(.*?);/)[1],
|
||
F = atob(i[1]),
|
||
J = F.length,
|
||
H = new Uint8Array(J);
|
||
while (J--) {
|
||
H[J] = F.charCodeAt(J)
|
||
}
|
||
uploadfile(new File([new Blob([H], { type: I })], name));
|
||
}
|
||
function uploadfile(gfile) {
|
||
var now = new Date();
|
||
var fext = ciyfn.file_ext(gfile.name);
|
||
var pathfile = opn.path + '/';
|
||
if (opn.fname)
|
||
pathfile += opn.fname + '.' + fext.toLowerCase() + '&rep=true';
|
||
else
|
||
pathfile += ciyfn.topad0(now.getHours()) + ciyfn.topad0(now.getMinutes()) + ciyfn.topad0(now.getSeconds()) + '_' + (1000 + Math.round(Math.random() * 8000)) + '.' + fext.toLowerCase();
|
||
if (opn.stor == '/') {
|
||
var postdata = new FormData();
|
||
postdata.append('file', gfile, gfile.name);
|
||
var xhr = new XMLHttpRequest();
|
||
xhr.open("POST", opn.action + ".upload&pathfile=" + pathfile, true);
|
||
xhr.setRequestHeader('ciyauth', ciyfn.getstorage('_' + ciy_vars.tokenfield));
|
||
xhr.setRequestHeader("X-Custom-Header", "CustomValue");
|
||
xhr.onload = function () {
|
||
var data = xhr.responseText;
|
||
var ind = data.indexOf('{');
|
||
if (ind > 0)
|
||
data = data.substring(ind);
|
||
var json = ciyfn.tojson(data);
|
||
if (json.code != 1) {
|
||
if (typeof (fn.fail) == 'function')
|
||
fn.fail(json, gfile);
|
||
return;
|
||
}
|
||
var newauth = xhr.getResponseHeader(ciy_vars.tokenfield);
|
||
if (newauth)
|
||
ciyfn.setstorage('_' + ciy_vars.tokenfield, newauth);
|
||
if (typeof (fn.success) == 'function')
|
||
fn.success(json.url, gfile);
|
||
};
|
||
xhr.onerror = function () {
|
||
if (typeof (fn.fail) == 'function')
|
||
fn.fail({ errmsg: '上传失败，网络连接异常' }, gfile);
|
||
};
|
||
xhr.upload.onprogress = function (event) {
|
||
if (typeof (fn.progress) != 'function')
|
||
return;
|
||
if (!event.lengthComputable)
|
||
return;
|
||
fn.progress(Math.round(event.loaded * 100 / event.total), gfile);
|
||
};
|
||
xhr.send(postdata);
|
||
} else {
|
||
ciyfn.callfunc(opn.action + ".s3&pathfile=" + pathfile + "&storselect=" + opn.stor, {}, function (json) {
|
||
var xhr = new XMLHttpRequest();
|
||
xhr.upload.addEventListener("progress", function (N) {
|
||
if (N.lengthComputable) {
|
||
var pct = Math.round(N.loaded * 100 / N.total);
|
||
if (typeof (fn.progress) == 'function')
|
||
fn.progress(pct, gfile);
|
||
}
|
||
}, false);
|
||
xhr.open(json.method, json.url, true);
|
||
for (var i in json.headers) {
|
||
xhr.setRequestHeader(i, json.headers[i]);
|
||
}
|
||
xhr.onreadystatechange = function () {
|
||
if (xhr.readyState == 4 && xhr.status == 200) {
|
||
if (typeof (fn.success) == 'function')
|
||
fn.success(opn.stor + pathfile, gfile);
|
||
} else if (xhr.status != 200) {
|
||
if (typeof (fn.fail) == 'function')
|
||
fn.fail({ errmsg: '云存储上传失败:' + xhr.status }, gfile);
|
||
}
|
||
};
|
||
xhr.send(gfile);
|
||
});
|
||
}
|
||
}
|
||
}
|
||
}, tmt);
|
||
})(files[fi], 1 + fi * 1050);
|
||
}
|
||
}
|
||
ciycmpfunc.ciydatetime = function (opn) {
|
||
var thos = this;
|
||
this.onchange = opn.onchange;
|
||
opn.initevent = opn.initevent || opn.dom.hasattr('initevent');
|
||
opn.hasmore = opn.hasmore || opn.dom.hasattr('hasmore');
|
||
opn.placeholder = ciyfn.lang(opn.placeholder || opn.dom.attr('placeholder') || '请选择');
|
||
opn.mindate = tostamp(opn.mindate || opn.dom.attr('mindate') || 0);
|
||
opn.maxdate = tostamp(opn.maxdate || opn.dom.attr('maxdate') || 0);
|
||
opn.type = opn.type || opn.dom.attr('type') || 'date';
|
||
opn.inpwidth = '7em';
|
||
if (opn.type == 'datetime')
|
||
opn.inpwidth = '9.5em';
|
||
else if (opn.type == 'month')
|
||
opn.inpwidth = '5em';
|
||
var csstxt = '';
|
||
csstxt += 'ciy-datetime>._pulldt{user-select: none;position: fixed;top: 0;left: 0;right: 0;bottom: 0;display:none;z-index:100000;}';
|
||
csstxt += 'ciy-datetime>._pulldt.top>._dt{flex-direction: column-reverse;}';
|
||
csstxt += 'ciy-datetime>._pulldt.top>._mainsel{flex-direction: column-reverse;}';
|
||
csstxt += 'ciy-datetime>._pulldt.top>._dt>._timebtn{align-items: flex-end;}';
|
||
csstxt += 'ciy-datetime>._pulldt.top>._dt>._timebtn>._timerit{flex-direction: column-reverse;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt{display: flex;flex-direction: column;width: 25em;padding: 0.5em;position: fixed;background:var(--bg1);box-shadow: rgb(204 204 204) 1px 1px 2px;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel{display: flex;flex-direction: column;height: 19em;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._timebtn{display: flex;text-align:center;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._timebtn>._time{width: 5.5em;border: 1px solid var(--bg4);border-radius: 0.5em;margin: 0 0.2em;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._timebtn>._time.active{border: 1px solid var(--man5);}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._timebtn>._time>div{height:3em;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._timebtn>._timerit{display: flex;flex-direction: column;margin-left:auto;text-align: right;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._timebtn>._timedate>div>._year{font-size:1.3em;padding: 0.4em 0;line-height: 1em;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._timebtn>._time>span{font-size:0.8em;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._timebtn>._time>div>span{font-size: 2em;padding-top: 0.3em;display: block;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>div>._dateyear{display: flex;flex-wrap: wrap;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>div>._dateyear>div{width: 33.3%;padding: 0.5em;line-height: 1.3em;text-align: center;font-size: 1.5em;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>div>._dateyear>div>span{font-size: 0.5em;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>div>._dateyear>div.active{color:var(--man5);}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>div>._yeararrow{display: flex;justify-content: space-around;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>div>._yeararrow>div{font-size:2em;cursor:pointer;letter-spacing: -0.6em;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>div>._datemonth{display: flex;flex-wrap: wrap;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>div>._datemonth>div{width: 33.3%;padding: 0.5em;line-height: 1.55em;text-align: center;font-size: 1.5em;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>div>._datemonth>div>span{font-size: 0.5em;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>div>._datemonth>div.active{color:var(--man5);}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>div>.monthme{min-width: 2.5em;text-align: right;white-space: nowrap;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>._datehour{display: flex;flex-wrap: wrap;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>._datehour>div{width: 16.66%;padding: 0.5em;line-height: 2em;text-align: center;font-size: 1.5em;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>._datehour>div.active{color:var(--man5);}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>._dateminute1{display: flex;flex-wrap: wrap;padding: 2em 0;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>._dateminute1>div{width: 16.66%;padding: 0.5em;line-height: 1.65em;text-align: center;font-size: 1.5em;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>._dateminute1>div.active{color:var(--man5);}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>._dateminute2{display: flex;flex-wrap: wrap;padding-top:2em;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>._dateminute2>div{width: 20%;padding: 0.5em;line-height: 1.65em;text-align: center;font-size: 1.5em;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>._dateminute2>div.active{color:var(--man5);}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>div>._datehead{display: flex;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>div>._datehead>div{flex:1;text-align:center;font-weight:bold;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>div>._daterow{display: flex;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>div>._daterow>div.allow{flex:1;text-align:center;border:1px solid transparent;border-radius: 0.5em;transition: all 0.3s;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>div>._daterow>div.disable{flex:1;text-align:center;border:1px solid transparent;color:var(--bg5);}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>div>._daterow>span{flex:1;}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>div>._daterow>div.allow:hover{border:1px solid var(--man4);}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>div>._daterow>div.allow.selected{border:1px solid var(--man6);color:var(--man5);}';
|
||
csstxt += 'ciy-datetime>._pulldt>._dt>._mainsel>div>.arrow{font-size:2em;cursor:pointer;}';
|
||
opn.dom.setstyle('ciy_datetime', csstxt);
|
||
var html = '';
|
||
html += '<input name="' + opn.name + '" type="hidden"/>';
|
||
html += '<input ' + (opn.hasmore ? 'name="' + opn.name + '_dt"' : '') + ' type="text" placeholder="' + opn.placeholder + '" autocomplete="off" style="width:' + opn.inpwidth + '"/>';
|
||
html += '<div class="_pulldt"><div class="_dt"><div class="_timebtn"></div><div class="_mainsel"></div></div></div>';
|
||
opn.dom.html(html);
|
||
var valuedom = opn.dom.children(0);
|
||
var valnamedom = opn.dom.children(1);
|
||
var pulldom = opn.dom.children(2);
|
||
var dtdom = pulldom.children(0);
|
||
var timebtndom = dtdom.children(0);
|
||
var mainseldom = dtdom.children(1);
|
||
var lishow = false;
|
||
var dtimeshow = new Date();//界面日期
|
||
var dtimevalue = new Date();//选中时间
|
||
var styear = 0;
|
||
this.setvalue = function (newvalue, from) {
|
||
if (newvalue !== undefined) {
|
||
this.value = tostamp(newvalue);
|
||
}
|
||
var dat = '';
|
||
if (opn.type == 'datetime') {
|
||
dat = ciyfn.todatetime(this.value, 'Y-m-d H:i', '');
|
||
if (dat)
|
||
this.value = tostamp(dat + ':00');
|
||
}
|
||
else if (opn.type == 'month') {
|
||
dat = ciyfn.todatetime(this.value, 'Y-m', '');
|
||
if (dat)
|
||
this.value = tostamp(dat + '-1 00:00:00');
|
||
} else {
|
||
dat = ciyfn.todatetime(this.value, 'Y-m-d', '');
|
||
if (dat)
|
||
this.value = tostamp(dat + ' 00:00:00');
|
||
}
|
||
valuedom.val(this.value);
|
||
valnamedom.val(dat);
|
||
if (this.value != 0) {
|
||
dtimeshow = new Date(this.value * 1000);
|
||
dtimevalue = new Date(this.value * 1000);
|
||
}
|
||
if (from && typeof (this.onchange) == 'function')
|
||
this.onchange({ name: opn.name, dom: opn.dom, from: from, value: this.value });
|
||
}
|
||
this.setvalue(opn.value, opn.initevent ? 'init' : '');
|
||
valnamedom.on('click', function (e) {
|
||
thos.showdt();
|
||
});
|
||
valnamedom.on('keydown', function (e) {
|
||
thos.hidedt();
|
||
});
|
||
valnamedom.on('blur', function (e) {
|
||
var val = tostamp(e.currentTarget.value);
|
||
if (val == thos.value)
|
||
return;
|
||
thos.value = val;
|
||
thos.setvalue(undefined, 'blur');
|
||
});
|
||
pulldom.on('click', function (e) {
|
||
e.stopPropagation();
|
||
thos.hidedt();
|
||
});
|
||
dtdom.on('click', function (e) {
|
||
e.stopPropagation();
|
||
});
|
||
dtdom.on('click', '._daterow>div.allow', function (e) {
|
||
var currdom = $5(e.currentTarget);
|
||
var year = toint(currdom.attr('data-year'));
|
||
if (year == 0)
|
||
return;
|
||
dtimeshow.setFullYear(year);
|
||
dtimeshow.setMonth(currdom.attr('data-month') - 1);
|
||
dtimeshow.setDate(currdom.attr('data-date'));
|
||
dtimevalue.setFullYear(year);
|
||
dtimevalue.setMonth(currdom.attr('data-month') - 1);
|
||
dtimevalue.setDate(currdom.attr('data-date'));
|
||
|
||
if (opn.type == 'datetime') {
|
||
$5('._daterow>div', dtdom).removeClass('selected');
|
||
currdom.addClass('selected');
|
||
}
|
||
else {
|
||
thos.value = tostamp(dtimevalue);
|
||
thos.hidedt();
|
||
thos.setvalue(undefined, 'click');
|
||
}
|
||
});
|
||
dtdom.on('click', '.yearprev', function (e) {
|
||
dtimeshow.setFullYear(dtimeshow.getFullYear() - 1);
|
||
showdate();
|
||
});
|
||
dtdom.on('click', '.yearnext', function (e) {
|
||
dtimeshow.setFullYear(dtimeshow.getFullYear() + 1);
|
||
showdate();
|
||
});
|
||
dtdom.on('click', '.yearme', function (e) {
|
||
styear = Math.floor(dtimeshow.getFullYear() / 10) * 10;
|
||
showdate('year');
|
||
});
|
||
dtdom.on('click', '.yprev', function (e) {
|
||
styear -= 10;
|
||
showdate('year');
|
||
});
|
||
dtdom.on('click', '.ynext', function (e) {
|
||
styear += 10;
|
||
showdate('year');
|
||
});
|
||
dtdom.on('click', '._dateyear>div', function (e) {
|
||
var year = toint(e.currentTarget.getAttribute('data-year'));
|
||
dtimeshow.setFullYear(year);
|
||
dtimevalue.setFullYear(year);
|
||
if (opn.type == 'month')
|
||
showdate('month');
|
||
else
|
||
showdate();
|
||
});
|
||
dtdom.on('click', '.monthprev', function (e) {
|
||
dtimeshow.setMonth(dtimeshow.getMonth() - 1);
|
||
showdate();
|
||
});
|
||
dtdom.on('click', '.monthnext', function (e) {
|
||
dtimeshow.setMonth(dtimeshow.getMonth() + 1);
|
||
showdate();
|
||
});
|
||
dtdom.on('click', '.monthme', function (e) {
|
||
showdate('month');
|
||
});
|
||
dtdom.on('click', '._datemonth>div', function (e) {
|
||
var month = toint(e.currentTarget.getAttribute('data-month'));
|
||
if (opn.type == 'month') {
|
||
dtimevalue.setDate(1);
|
||
dtimevalue.setMonth(month - 1);
|
||
thos.value = tostamp(dtimevalue);
|
||
thos.hidedt();
|
||
thos.setvalue(undefined, 'done');
|
||
return;
|
||
}
|
||
dtimeshow.setMonth(month - 1);
|
||
dtimevalue.setMonth(month - 1);
|
||
if (dtimevalue.getMonth() == month) {
|
||
dtimevalue.setDate(1);
|
||
dtimevalue.setMonth(month - 1);
|
||
dtimeshow.setDate(1);
|
||
dtimeshow.setMonth(month - 1);
|
||
}
|
||
showdate();
|
||
});
|
||
dtdom.on('click', '._timedate', function (e) {
|
||
showdate();
|
||
});
|
||
dtdom.on('click', '._timehour', function (e) {
|
||
showhour();
|
||
});
|
||
dtdom.on('click', '._timeminute', function (e) {
|
||
showminute();
|
||
});
|
||
dtdom.on('click', '._datehour>div', function (e) {
|
||
var hour = toint(e.currentTarget.getAttribute('data-hour'));
|
||
dtimeshow.setHours(hour);
|
||
dtimevalue.setHours(hour);
|
||
showhour();
|
||
});
|
||
dtdom.on('click', '._dateminute1>div', function (e) {
|
||
var minute = toint(e.currentTarget.getAttribute('data-minute1')) + (dtimevalue.getMinutes() % 10);
|
||
dtimeshow.setMinutes(minute);
|
||
dtimevalue.setMinutes(minute);
|
||
showminute();
|
||
});
|
||
dtdom.on('click', '._dateminute2>div', function (e) {
|
||
var minute = toint(e.currentTarget.getAttribute('data-minute2')) + toint(dtimevalue.getMinutes() / 10) * 10;
|
||
dtimeshow.setMinutes(minute);
|
||
dtimevalue.setMinutes(minute);
|
||
showminute();
|
||
});
|
||
dtdom.on('click', '.totime', function (e) {
|
||
dtimeshow = new Date();
|
||
dtimevalue = new Date();
|
||
$5('._timehour>div', dtdom).html('<span>' + ciyfn.todatetime(dtimevalue, 'H') + '</span>');
|
||
$5('._timeminute>div', dtdom).html('<span>' + ciyfn.todatetime(dtimevalue, 'i') + '</span>');
|
||
showdate();
|
||
});
|
||
dtdom.on('click', '.tomonth', function (e) {
|
||
dtimevalue.setFullYear(new Date().getFullYear());
|
||
dtimevalue.setMonth(new Date().getMonth());
|
||
dtimeshow = dtimevalue;
|
||
showdate('month');
|
||
});
|
||
dtdom.on('click', '.today', function (e) {
|
||
dtimeshow = new Date();
|
||
dtimevalue = new Date();
|
||
dtimevalue.setHours(0);
|
||
dtimevalue.setMinutes(0);
|
||
dtimevalue.setSeconds(0);
|
||
showdate();
|
||
});
|
||
dtdom.on('click', '.btn.clear', function (e) {
|
||
thos.value = 0;
|
||
thos.hidedt();
|
||
thos.setvalue(undefined, 'clear');
|
||
});
|
||
dtdom.on('click', '.btn.done', function (e) {
|
||
thos.value = tostamp(dtimevalue);
|
||
thos.hidedt();
|
||
thos.setvalue(undefined, 'done');
|
||
});
|
||
this.hidedt = function () {
|
||
if (!lishow)
|
||
return;
|
||
window.removeEventListener('scroll', thos.hidedt);
|
||
lishow = false;
|
||
pulldom.hide('up', 0.3);
|
||
}
|
||
this.showdt = function () {
|
||
if (opn.type == 'datetime') {
|
||
var html = '';
|
||
html += '<div class="_time _timedate"><div><div class="_year">' + ciyfn.todatetime(dtimevalue, 'Y') + '</div><div style="line-height:1em;">' + ciyfn.todatetime(dtimevalue, 'm-d') + '</div></div><span>' + ciyfn.lang('选择日期') + '</span></div>'
|
||
html += '<div class="_time _timehour"><div><span>' + ciyfn.todatetime(dtimevalue, 'H') + '</span></div><span>' + ciyfn.lang('选择小时') + '</span></div>'
|
||
html += '<div class="_time _timeminute"><div><span>' + ciyfn.todatetime(dtimevalue, 'i') + '</span></div><span>' + ciyfn.lang('选择分钟') + '</span></div>'
|
||
html += '<div class="_timerit"><div><a class="btn sm done">' + ciyfn.lang('完成') + '</a></div><div><a class="btn sm def clear">' + ciyfn.lang('清空') + '</a></div></div>'
|
||
timebtndom.html(html);
|
||
showdate();
|
||
} else if (opn.type == 'month') {
|
||
showdate('month');
|
||
} else {
|
||
showdate();
|
||
}
|
||
if (!lishow) {
|
||
lishow = true;
|
||
window.addEventListener('scroll', thos.hidedt);
|
||
}
|
||
pulldom.css({ display: 'block' });
|
||
var valpos = valnamedom.rect();
|
||
var lef = valpos.left;
|
||
var winwidth = opn.dom.winwidth();
|
||
var winheight = opn.dom.winheight();
|
||
if (lef + dtdom.width() + 20 > winwidth)
|
||
lef = winwidth - dtdom.width() - 20;
|
||
if (lef < 20)
|
||
lef = 20;
|
||
if (winheight < valpos.top + valpos.height + dtdom.height()) {
|
||
pulldom.addClass('top');
|
||
dtdom.css({ top: 'auto', bottom: (winheight - valpos.top) + 'px', left: lef + 'px' });
|
||
} else {
|
||
pulldom.removeClass('top');
|
||
dtdom.css({ bottom: 'auto', top: (valpos.top + valpos.height) + 'px', left: lef + 'px' });
|
||
}
|
||
pulldom.show('up', 0.1);
|
||
}
|
||
function showdate(op) { //op: month，year
|
||
$5('._timedate>div', dtdom).html('<div class="_year">' + ciyfn.todatetime(dtimevalue, 'Y') + '</div><div style="line-height:1em;">' + ciyfn.todatetime(dtimevalue, 'm-d') + '</div>');
|
||
$5('._time', dtdom).removeClass('active');
|
||
$5('._timedate', dtdom).addClass('active');
|
||
var year = dtimeshow.getFullYear();
|
||
var month = dtimeshow.getMonth() + 1;
|
||
var html = '';
|
||
html += '<div style="display:flex;">';
|
||
html += '<div class="arrow yearprev" style="margin-left:0.5em;">﹤</div><div class="yearme">' + year + ' ' + ciyfn.lang('年') + '</div><div class="arrow yearnext">﹥</div>';
|
||
if (opn.type != 'month')
|
||
html += '<div class="arrow monthprev" style="margin-left:1em;">﹤</div><div class="monthme">' + month + ' ' + ciyfn.lang('月') + '</div><div class="arrow monthnext">﹥</div>';
|
||
if (opn.type == 'datetime')
|
||
html += '<div class="totime" style="margin-left:auto;margin-right:1em;">' + ciyfn.lang('此刻') + '</div>';
|
||
else if (opn.type == 'month')
|
||
html += '<div class="tomonth" style="margin-left:auto;">' + ciyfn.lang('本月') + '<a class="btn sm def clear" style="margin-left:1em;">' + ciyfn.lang('清空') + '</a></div>';
|
||
else
|
||
html += '<div class="today" style="margin-left:auto;margin-right:1em;">' + ciyfn.lang('今天') + '</div><a class="btn sm def clear" style="position:absolute;right:0.5em;bottom:0.5em;">' + ciyfn.lang('清空') + '</a>';
|
||
html += '</div>';
|
||
html += '<div>';
|
||
if (op == 'year') {
|
||
html += '<div class="_yeararrow"><div class="yprev">﹤﹤</div><div class="ynext">﹥﹥</div></div>';
|
||
html += '<div class="_dateyear">';
|
||
for (var i = styear; i < styear + 12; i++) {
|
||
if (year == i)
|
||
html += '<div class="active" data-year="' + i + '">' + i + '</div>';
|
||
else
|
||
html += '<div data-year="' + i + '">' + i + '</div>';
|
||
}
|
||
html += '</div>';
|
||
}
|
||
else if (op == 'month') {
|
||
html += '<div class="_datemonth">';
|
||
for (var i = 1; i <= 12; i++) {
|
||
if (month == i)
|
||
html += '<div class="active" data-month="' + i + '">' + i + '<span>' + ciyfn.lang('月') + '</span></div>';
|
||
else
|
||
html += '<div data-month="' + i + '">' + i + '<span>' + ciyfn.lang('月') + '</span></div>';
|
||
}
|
||
html += '</div>';
|
||
} else {
|
||
html += '<div class="_datehead"><div>' + ciyfn.lang('日') + '</div><div>' + ciyfn.lang('一') + '</div><div>' + ciyfn.lang('二') + '</div><div>' + ciyfn.lang('三') + '</div><div>' + ciyfn.lang('四') + '</div><div>' + ciyfn.lang('五') + '</div><div>' + ciyfn.lang('六') + '</div></div>';
|
||
var weekday = new Date(year, month - 1, 1).getDay();
|
||
var days = new Date(year, month, 0).getDate();
|
||
for (var i = 0; i < 6; i++) {
|
||
html += '<div class="_daterow">';
|
||
for (var j = 0; j < 7; j++) {
|
||
var daynum = i * 7 + j - weekday + 1;
|
||
if (daynum >= 1 && daynum <= days) {
|
||
html += '<div data-year="' + year + '" data-month="' + month + '" data-date="' + daynum + '" class="';
|
||
var divday = new Date(year, month - 1, daynum);
|
||
if (opn.mindate > 0 && divday < new Date(opn.mindate * 1000))
|
||
html += 'disable';
|
||
else {
|
||
if (opn.maxdate > 0 && divday > new Date(opn.maxdate * 1000))
|
||
html += 'disable';
|
||
else
|
||
html += 'allow';
|
||
}
|
||
if (daynum == dtimevalue.getDate() && dtimeshow.getMonth() == dtimevalue.getMonth() && dtimeshow.getFullYear() == dtimevalue.getFullYear())
|
||
html += ' selected">' + daynum + '</div>';
|
||
else
|
||
html += '">' + daynum + '</div>';
|
||
} else {
|
||
html += '<span> </span>';
|
||
}
|
||
}
|
||
html += '</div>';
|
||
}
|
||
html += '</div>';
|
||
}
|
||
mainseldom.html(html);
|
||
}
|
||
function showhour() {
|
||
$5('._timehour>div>span', dtdom).html(ciyfn.todatetime(dtimevalue, 'H'));
|
||
$5('._time', dtdom).removeClass('active');
|
||
$5('._timehour', dtdom).addClass('active');
|
||
var hour = dtimevalue.getHours();
|
||
var html = '';
|
||
html += '<div class="_datehour">';
|
||
for (var i = 0; i < 24; i++) {
|
||
if (hour == i)
|
||
html += '<div class="active" data-hour="' + i + '">' + i + '</div>';
|
||
else
|
||
html += '<div data-hour="' + i + '">' + i + '</div>';
|
||
}
|
||
html += '</div>';
|
||
mainseldom.html(html);
|
||
}
|
||
function showminute() {
|
||
$5('._timeminute>div>span', dtdom).html(ciyfn.todatetime(dtimevalue, 'i'));
|
||
$5('._time', dtdom).removeClass('active');
|
||
$5('._timeminute', dtdom).addClass('active');
|
||
var minute = dtimevalue.getMinutes();
|
||
var html = '';
|
||
html += '<div class="_dateminute1">';
|
||
for (var i = 0; i < 60; i += 10) {
|
||
if (toint(minute / 10) * 10 == i)
|
||
html += '<div class="active" data-minute1="' + i + '">' + i + '</div>';
|
||
else
|
||
html += '<div data-minute1="' + i + '">' + i + '</div>';
|
||
}
|
||
html += '</div>';
|
||
html += '<div class="ciy-hr"></div>';
|
||
html += '<div class="_dateminute2">';
|
||
for (var i = 0; i < 10; i++) {
|
||
if (minute % 10 == i)
|
||
html += '<div class="active" data-minute2="' + i + '">' + i + '</div>';
|
||
else
|
||
html += '<div data-minute2="' + i + '">' + i + '</div>';
|
||
}
|
||
html += '</div>';
|
||
mainseldom.html(html);
|
||
}
|
||
}
|
||
ciycmpfunc.ciydaterange = function (opn) {
|
||
var thos = this;
|
||
this.onchange = opn.onchange;
|
||
opn.initevent = opn.initevent || opn.dom.hasattr('initevent');
|
||
opn.hasmore = opn.hasmore || opn.dom.hasattr('hasmore');
|
||
opn.type = opn.type || opn.dom.attr('type') || 'date'; //date/datetime
|
||
var html = '';
|
||
html += '<input name="' + opn.name + '" type="hidden"/>';
|
||
html += '<div style="display:flex;">';
|
||
html += '<ciy-datetime ' + (opn.hasmore ? 'com="' + opn.name + '_st" hasmore' : '') + '></ciy-datetime>';
|
||
html += '<div class="noselect" style="padding:0 0.2em;">~</div>';
|
||
html += '<ciy-datetime ' + (opn.hasmore ? 'com="' + opn.name + '_end" hasmore' : '') + '></ciy-datetime>';
|
||
html += '</div>';
|
||
opn.dom.html(html);
|
||
var valuedom = opn.dom.children(0);
|
||
var rangedom = opn.dom.children(1);
|
||
var valname1dom = rangedom.children(0);
|
||
var valname2dom = rangedom.children(2);
|
||
var rangevalue = [0, 0];
|
||
var format = 'Y-m-d';
|
||
if (opn.type == 'datetime')
|
||
format = 'Y-m-d H:i:00';
|
||
this.setvalue = function (newvalue, from) {
|
||
if (newvalue !== undefined) {
|
||
if (newvalue.indexOf('~') >= 0) {
|
||
var arr = newvalue.split('~');
|
||
rangevalue[0] = tostamp(arr[0]);
|
||
rangevalue[1] = tostamp(arr[1]);
|
||
valname1dom.val(rangevalue[0]);
|
||
valname2dom.val(rangevalue[1]);
|
||
}
|
||
}
|
||
if (rangevalue[0] != 0 && rangevalue[1] != 0) {
|
||
if (rangevalue[0] > rangevalue[1]) {
|
||
var tmp = rangevalue[0];
|
||
rangevalue[0] = rangevalue[1];
|
||
rangevalue[1] = tmp;
|
||
valname1dom.val(rangevalue[0]);
|
||
valname2dom.val(rangevalue[1]);
|
||
}
|
||
}
|
||
var val = '';
|
||
if (rangevalue[0] != 0 || rangevalue[1] != 0) {
|
||
if (rangevalue[0] != 0)
|
||
val = ciyfn.todatetime(rangevalue[0], format, '');
|
||
val += '~';
|
||
if (rangevalue[1] != 0)
|
||
val += ciyfn.todatetime(rangevalue[1], format, '');
|
||
}
|
||
this.value = val;
|
||
valuedom.val(this.value);
|
||
if (from && typeof (this.onchange) == 'function')
|
||
this.onchange({ name: opn.name, dom: opn.dom, from: from, value: this.value });
|
||
}
|
||
ciycmp({
|
||
dom: valname1dom, type: opn.type, onchange: function (e) {
|
||
rangevalue[0] = e.value;
|
||
thos.setvalue(undefined, 'selectdt1');
|
||
}
|
||
});
|
||
ciycmp({
|
||
dom: valname2dom, type: opn.type, onchange: function (e) {
|
||
rangevalue[1] = e.value;
|
||
thos.setvalue(undefined, 'selectdt2');
|
||
}
|
||
});
|
||
this.setvalue(opn.value, opn.initevent ? 'init' : '');
|
||
}
|
||
ciycmpfunc.ciyswitch = function (opn) {
|
||
var thos = this;
|
||
this.onchange = opn.onchange;
|
||
opn.initevent = opn.initevent || opn.dom.hasattr('initevent');
|
||
opn.hasmore = opn.hasmore || opn.dom.hasattr('hasmore');
|
||
opn.y = opn.y || opn.dom.attr('y') || '✔';
|
||
opn.n = opn.n || opn.dom.attr('n') || '✘';
|
||
var html = '';
|
||
html += '<input type="hidden" name="' + opn.name + '">';
|
||
html += '<div style="cursor: pointer;position: relative;display: inline-block;height: 2.4em;color: var(--e-switchtxt);background: var(--e-inputbg);border: 0.2em solid var(--e-inputbg);border-radius: 1.2em;box-shadow: var(--e-inputshadow);">';
|
||
html += '<div class="y tran5 noselect txt-nowrap" style="height: 2em;line-height: 2em;padding-right:2.2em;padding-left: 0.5em;">' + ciyfn.lang(opn.y) + '</div>';
|
||
html += '<div class="n tran5 noselect txt-nowrap txt-right" style="height: 2em;line-height: 2em;padding-left:1.6em;padding-right: 0.5em;margin-top: -2em;">' + ciyfn.lang(opn.n) + '</div>';
|
||
html += '<i class="chk tran5" style="opacity:0; position: absolute;left: 0;top: 0.2em;width: 1.2em;height: 1.2em;border-radius: 100%;border: 0.2em solid var(--e-inputbr);box-shadow: var(--e-inputshadow);"></i></div>';
|
||
if (opn.hasmore)
|
||
html += '<input type="hidden" name="' + opn.name + '_name">';
|
||
opn.dom.html(html).css({ verticalAlign: 'middle' });
|
||
var valuedom = opn.dom.children(0);
|
||
var valnamedom = opn.dom.children(2);
|
||
this.setvalue = function (newvalue, from) {
|
||
if (newvalue !== undefined) {
|
||
if (newvalue === 1 || newvalue === '1' || newvalue === true || newvalue === 'true')
|
||
this.value = 1;
|
||
else
|
||
this.value = 2;
|
||
}
|
||
valuedom.val(this.value);
|
||
if (opn.hasmore)
|
||
valnamedom.val(this.value == 1 ? opn.y : opn.n);
|
||
$5('.y', opn.dom).css({ opacity: this.value == 1 ? 1 : 0 });
|
||
$5('.n', opn.dom).css({ opacity: this.value == 1 ? 0 : 1 });
|
||
$5('i', opn.dom).css({ opacity: 1, background: thos.value == 1 ? 'var(--man5)' : 'var(--e-inputbg)', marginLeft: thos.value == 1 ? 'calc(' + opn.dom.width() + 'px - 2.1em)' : '0.2em' });
|
||
if (from && typeof (this.onchange) == 'function')
|
||
this.onchange({ name: opn.name, dom: opn.dom, from: from, value: this.value });
|
||
}
|
||
this.setvalue(opn.value, opn.initevent ? 'init' : '');
|
||
opn.dom.on('click', function () {
|
||
thos.value = (thos.value == 1 ? 2 : 1);
|
||
thos.setvalue(undefined, 'click');
|
||
});
|
||
}
|
||
ciycmpfunc.ciyradio = function (opn) {
|
||
var thos = this;
|
||
this.onchange = opn.onchange;
|
||
opn.initevent = opn.initevent || opn.dom.hasattr('initevent');
|
||
opn.hasmore = opn.hasmore || opn.dom.hasattr('hasmore');
|
||
opn.hasline = opn.hasline || opn.dom.hasattr('hasline');
|
||
opn.chkuse = opn.chkuse || opn.dom.hasattr('chkuse');
|
||
opn.all = opn.all || opn.dom.attr('all') || '';
|
||
opn.minwidth = opn.minwidth || opn.dom.attr('minwidth') || 'auto';
|
||
if (typeof (opn.fn_item) !== 'function')
|
||
opn.fn_item = function (range, thos) { return range.name; };
|
||
//opn.fn_item 定制显示项
|
||
var html = '';
|
||
html += '<input type="hidden" name="' + opn.name + '">';
|
||
html += '<div style="' + (opn.hasline ? '' : 'display:flex;flex-wrap: wrap;') + 'gap: 0.5em;"></div>';
|
||
if (opn.hasmore)
|
||
html += '<input type="hidden" name="' + opn.name + '_name">';
|
||
opn.dom.html(html);
|
||
var valuedom = opn.dom.children(0);
|
||
var showdom = opn.dom.children(1);
|
||
var valnamedom = opn.dom.children(2);
|
||
this.setvalue = function (newvalue, from) {
|
||
if (this.range == null)
|
||
return console.error('ciy_radio range null', opn.name);
|
||
if (newvalue !== undefined) {
|
||
this.value = newvalue;
|
||
}
|
||
|
||
var html = '';
|
||
var selname = '';
|
||
for (var i in this.range) {
|
||
var range = this.range[i];
|
||
if (opn.chkuse && range.isuse == 2)
|
||
continue;
|
||
if (opn.filter && range[opn.filter.field] != opn.filter.value)
|
||
continue;
|
||
html += '<div class="ciy-radio" style="cursor: pointer;min-width: ' + opn.minwidth + ';" data-id="' + range.id + '">';
|
||
if (this.value == range.id) {
|
||
html += '<i class="tran5" style="display: inline-block;margin-right: 0.2em;width: 0.8em;height: 0.8em;border-radius: 100%;box-shadow: var(--e-inputshadow);vertical-align: text-bottom;background: var(--man5);border: 0.2em solid var(--e-inputbr);animation: ciy-scale 0.2s;"></i>';
|
||
selname = range.name;
|
||
}
|
||
else
|
||
html += '<i class="tran5" style="display: inline-block;margin-right: 0.2em;width: 0.8em;height: 0.8em;border-radius: 100%;box-shadow: var(--e-inputshadow);vertical-align: text-bottom;background: var(--e-inputbg);border: 0.2em solid var(--e-inputbg);"></i>';
|
||
html += '<span class="noselect">' + opn.fn_item(range, thos) + '</span>';
|
||
html += '</div>';
|
||
}
|
||
showdom.html(html);
|
||
valuedom.val(this.value);
|
||
if (opn.hasmore)
|
||
valnamedom.val(selname);
|
||
if (from && typeof (this.onchange) == 'function')
|
||
this.onchange({ name: opn.name, dom: opn.dom, from: from, value: this.value });
|
||
}
|
||
this.setrange = function (newrange) {
|
||
this.range = ciyfn.getdictdata(newrange);
|
||
if (this.range == null)
|
||
return console.error('ciy_radio range null', opn.name);
|
||
if (opn.all) {
|
||
this.range.unshift({ id: '', name: opn.all + '', _nofilter: true });
|
||
}
|
||
if (this.value !== undefined)
|
||
this.setvalue();
|
||
}
|
||
this.setrange(opn.range);
|
||
this.setvalue(opn.value, opn.initevent ? 'init' : '');
|
||
showdom.on('click', '.ciy-radio', function (e) {
|
||
thos.value = $5(e.currentTarget).attr('data-id') || '';
|
||
thos.setvalue(undefined, 'click');
|
||
});
|
||
}
|
||
ciycmpfunc.ciycheckbox = function (opn) {
|
||
var thos = this;
|
||
this.onchange = opn.onchange;
|
||
opn.initevent = opn.initevent || opn.dom.hasattr('initevent');
|
||
opn.hasmore = opn.hasmore || opn.dom.hasattr('hasmore');
|
||
opn.hasline = opn.hasline || opn.dom.hasattr('hasline');
|
||
opn.chkuse = opn.chkuse || opn.dom.hasattr('chkuse');
|
||
opn.range = opn.range || opn.dom.attr('range');
|
||
opn.minwidth = opn.minwidth || opn.dom.attr('minwidth') || '';
|
||
if (opn.dom.attr('text')) {
|
||
opn.range = [{ id: 'chk', name: opn.dom.attr('text') }];
|
||
}
|
||
if (typeof (opn.fn_item) !== 'function')
|
||
opn.fn_item = function (range, thos) { return range.name; };
|
||
var html = '';
|
||
html += '<input type="hidden" name="' + opn.name + '">';
|
||
html += '<div style="' + (opn.hasline ? '' : 'display:inline-flex;flex-wrap: wrap;') + 'gap: 0.5em;"></div>';
|
||
if (opn.hasmore) {
|
||
html += '<input type="hidden" name="' + opn.name + '_name">';
|
||
html += '<input type="hidden" name="' + opn.name + '_noid">';
|
||
html += '<input type="hidden" name="' + opn.name + '_noname">';
|
||
}
|
||
opn.dom.html(html);
|
||
var valuedom = opn.dom.children(0);
|
||
var showdom = opn.dom.children(1);
|
||
var nowvalue = [];
|
||
var clkvalue = '';
|
||
this.setvalue = function (newvalue, from) {
|
||
if (this.range == null)
|
||
return console.error('ciy_checkbox range null', opn.name);
|
||
if (newvalue !== undefined) {
|
||
if (newvalue == '__ALL__') {
|
||
for (var i in this.range) {
|
||
nowvalue.push(this.range[i].id);
|
||
}
|
||
} else {
|
||
var vals = (newvalue + '').split(',');
|
||
nowvalue = [];
|
||
for (var i in vals) {
|
||
if (!vals[i])
|
||
continue;
|
||
nowvalue.push(vals[i] + '');
|
||
}
|
||
}
|
||
var html = '';
|
||
var selnames = [];
|
||
for (var i in this.range) {
|
||
var range = this.range[i];
|
||
if (opn.chkuse && range.isuse == 2)
|
||
continue;
|
||
if (opn.filter && range[opn.filter.field] != opn.filter.value)
|
||
continue;
|
||
html += '<div class="ciy-checkbox" style="cursor: pointer;min-width: ' + opn.minwidth + ';" data-id="' + range.id + '">';
|
||
if (nowvalue.indexOf(range.id + '') > -1) {
|
||
html += '<i class="tran5 checked" style="display: inline-block;margin-right: 0.2em;width: 0.8em;height: 0.8em;border-radius: 0.3em;box-shadow: var(--e-inputshadow);vertical-align: text-bottom;background: var(--man5);border: 0.2em solid var(--e-inputbr);' + (clkvalue == range.id ? 'animation: ciy-scale 0.2s;' : '') + '"></i>';
|
||
selnames.push(range.name);
|
||
} else
|
||
html += '<i class="tran5" style="display: inline-block;margin-right: 0.2em;width: 0.8em;height: 0.8em;border-radius: 0.3em;box-shadow: var(--e-inputshadow);vertical-align: text-bottom;background: var(--e-inputbg);border: 0.2em solid var(--e-inputbg);"></i>';
|
||
html += '<span class="noselect">' + opn.fn_item(range, thos) + '</span>';
|
||
html += '</div>';
|
||
}
|
||
showdom.html(html);
|
||
}
|
||
var itemdoms = showdom.children();
|
||
for (var i = 0; i < itemdoms.length; i++) {
|
||
var chkdom = $5(itemdoms[i]);
|
||
var id = chkdom.attr('data-id');
|
||
var idom = $5('i', chkdom);
|
||
if (idom.hasClass('checked')) {
|
||
if (nowvalue.indexOf(id) == -1)
|
||
idom.removeClass('checked').css({ background: 'var(--e-inputbg)', border: '0.2em solid var(--e-inputbg)', animation: null });
|
||
} else {
|
||
if (nowvalue.indexOf(id) > -1)
|
||
idom.addClass('checked').css({ background: 'var(--man5)', border: '0.2em solid var(--e-inputbr)', animation: 'ciy-scale 0.2s' });
|
||
}
|
||
}
|
||
this.value = nowvalue.length > 0 ? ',' + nowvalue.join(',') + ',' : '';
|
||
valuedom.val(this.value); //两边加逗号，便于字符串like检索。但规模化后应避免like检索。
|
||
if (opn.hasmore) {
|
||
var selnames = [];
|
||
var selnoid = [];
|
||
var selnonames = [];
|
||
for (var i = 0; i < itemdoms.length; i++) {
|
||
var id = itemdoms[i].getAttribute('data-id');
|
||
var range = null;
|
||
for (var ri in this.range) {
|
||
if (this.range[ri].id == id)
|
||
range = this.range[ri];
|
||
}
|
||
if (range == null)
|
||
continue;
|
||
if (nowvalue.indexOf(id) > -1)
|
||
selnames.push(range.name);
|
||
else {
|
||
selnoid.push(range.id);
|
||
selnonames.push(range.name);
|
||
}
|
||
}
|
||
opn.dom.children(2).val(selnames.join(','));
|
||
opn.dom.children(3).val(selnoid.join(','));
|
||
opn.dom.children(4).val(selnonames.join(','));
|
||
}
|
||
if (from && typeof (this.onchange) == 'function')
|
||
this.onchange({ name: opn.name, dom: opn.dom, from: from, value: this.value });
|
||
}
|
||
this.setrange = function (newrange) {
|
||
this.range = ciyfn.getdictdata(newrange);
|
||
if (this.range == null)
|
||
return console.error('ciy_checkbox range null', opn.name);
|
||
if (this.value !== undefined)
|
||
this.setvalue();
|
||
}
|
||
this.setrange(opn.range);
|
||
this.setvalue(opn.value, opn.initevent ? 'init' : '');
|
||
showdom.on('click', '.ciy-checkbox', function (e) {
|
||
clkvalue = $5(e.currentTarget).attr('data-id') || '';
|
||
var ind = nowvalue.indexOf(clkvalue);
|
||
if (ind > -1)
|
||
nowvalue.splice(ind, 1);
|
||
else
|
||
nowvalue.push(clkvalue);
|
||
thos.setvalue(undefined, 'click');
|
||
if (typeof (opn.fn_click) == 'function')
|
||
opn.fn_click({ name: opn.name, value: clkvalue });
|
||
});
|
||
}
|
||
ciycmpfunc.ciyselect = function (opn) {
|
||
var thos = this;
|
||
this.onchange = opn.onchange;
|
||
opn.initevent = opn.initevent || opn.dom.hasattr('initevent');
|
||
opn.hasmore = opn.hasmore || opn.dom.hasattr('hasmore');
|
||
opn.chkuse = opn.chkuse || opn.dom.hasattr('chkuse');
|
||
opn.minsearch = toint(opn.minsearch || opn.dom.attr('minsearch') || 0);
|
||
opn.all = opn.all || opn.dom.attr('all') || '';
|
||
opn.range = opn.range || opn.dom.attr('range');
|
||
opn.minwidth = opn.minwidth || opn.dom.attr('minwidth') || '';
|
||
opn.placeholder = ciyfn.lang(opn.placeholder || opn.dom.attr('placeholder') || '请选择');
|
||
if (typeof (opn.fn_li) != 'function')
|
||
opn.fn_li = function (range, thos) { return ciyfn.lang(range.name) };
|
||
var csstxt = '';
|
||
csstxt += 'ciy-select{display: block;user-select:none;}';
|
||
csstxt += 'ciy-select.mini{display: inline-block;}';
|
||
csstxt += 'ciy-select>._show{display: flex;align-items: center;position: relative;height: 2.1em;line-height: 2.1em;vertical-align: top;width: 100%;cursor: pointer;min-height: 2.4em;color: var(--txt8);background-color: var(--bg1);border: 1px solid var(--bg6);border-radius: 4px;}';
|
||
csstxt += 'ciy-select>._show>i{width: 1em;height: 1em;margin-right:0.5em;background-image: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTAyNCAxMDI0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTExNC4wNDg0OTkgNTk2LjkyNDE4MWwzMzcuNTI2MjkzIDMzNy41MjYyOTNjMzMuMzcwMDE1IDMzLjM3MDAxNSA4Ny40NzkzNzcgMzMuMzcwMDE1IDEyMC44NDkzOTIgMGwzMzcuNTI2MjkzLTMzNy41MjYyOTNMMTE0LjA0ODQ5OSA1OTYuOTI0MTgxek01NzIuNDI0MTg0IDg4LjQ5NzU2N2MtMzMuMzcwMDE1LTMzLjM3MDAxNS04Ny40NzkzNzctMzMuMzcwMDE1LTEyMC44NDkzOTIgMEwxMTQuMDU2Njg2IDQyNi4wMjQ4ODNsNzk1Ljg4NTYwNiAwTDU3Mi40MjQxODQgODguNDk3NTY3eiIgZmlsbD0iIzc3Nzc3NyI+PC9wYXRoPjwvc3ZnPg==");}';
|
||
csstxt += 'ciy-select>._pullul{position: fixed;top: 0;left: 0;right: 0;bottom: 0;display:none;z-index:100000;}';
|
||
csstxt += 'ciy-select>._pullul>ul{display: inline-flex;height: auto;flex-direction: column;position: fixed;overflow: auto;background:var(--bg1);box-shadow: rgb(204 204 204) 1px 1px 2px;border-radius: 5px;}';
|
||
csstxt += 'ciy-select>._pullul input{position: fixed;border-radius: 3px;line-height:1.5em;padding-left:0.5em;border:1px solid var(--bg4);border-radius:0;}';
|
||
csstxt += 'ciy-select>._pullul input:focus{box-shadow:none;border:1px solid var(--bg4);}';
|
||
csstxt += 'ciy-select>._pullul input::placeholder{color:var(--bg4);}';
|
||
csstxt += 'ciy-select>._pullul>ul>li{white-space: nowrap;line-height:1.3em;padding:0.5em 1em;border-left: 4px solid var(--bg1);background:var(--bg1);color:var(--txt9);cursor:pointer;}';
|
||
csstxt += 'ciy-select>._pullul>ul>li.selected{background:var(--bg3);border-left: 4px solid var(--man4);}';
|
||
csstxt += 'ciy-select>._pullul>ul>li:hover{background:var(--bg5);border-left: 4px solid var(--bg4);}';
|
||
opn.dom.setstyle('ciy_select', csstxt);
|
||
var html = '';
|
||
html += '<input name="' + opn.name + '" value="" type="hidden"/>';
|
||
html += '<div class="_show"><div class="flex1 txt-over txt-left" style="padding: 0 0.5em;' + (opn.minwidth ? 'min-width:' + opn.minwidth + ';' : '') + '"></div><i></i></div>';
|
||
html += '<div class="_pullul">';
|
||
html += '<input type="text" act="search" placeholder="' + ciyfn.lang('输入文字或拼音筛选') + '"/>';
|
||
html += '<ul></ul>';
|
||
html += '</div>';
|
||
if (opn.hasmore && opn.name)
|
||
html += '<input name="' + opn.name + '_name" value="" type="hidden"/>';
|
||
opn.dom.html(html);
|
||
if (opn.minwidth)
|
||
opn.dom.addClass('mini');
|
||
var valuedom = opn.dom.children(0);
|
||
var showmaindom = opn.dom.children(1);
|
||
var showdom = showmaindom.children(0);
|
||
var ulpdom = opn.dom.children(2);
|
||
var searchdom = ulpdom.children(0);
|
||
var uldom = ulpdom.children(1);
|
||
var valnamedom = opn.dom.children(3);
|
||
var lishow = false;
|
||
this.setvalue = function (newvalue, from) {
|
||
if (this.range == null)
|
||
return console.error('ciy_select range null', opn.name);
|
||
if (newvalue !== undefined) {
|
||
this.value = newvalue;
|
||
}
|
||
var range = null;
|
||
for (var i in this.range) {
|
||
if (this.value == this.range[i].id) {
|
||
range = this.range[i];
|
||
break;
|
||
}
|
||
}
|
||
if (range != null) {
|
||
showdom.html(range.name);
|
||
showdom.attr('title', range.name);
|
||
valuedom.val(range.id);
|
||
valnamedom.val(range.name);
|
||
} else {
|
||
showdom.html('<span style="color:var(--txt1);">' + opn.placeholder + '</span>');
|
||
showdom.attr('title', '');
|
||
valuedom.val('');
|
||
valnamedom.val('');
|
||
}
|
||
if (from && typeof (this.onchange) == 'function')
|
||
this.onchange({ name: opn.name, dom: opn.dom, from: from, value: this.value });
|
||
}
|
||
this.setrange = function (newrange, badd) {
|
||
var ranges = ciyfn.getdictdata(newrange);
|
||
if (ranges == null)
|
||
return console.error('ciy_select range null', opn.name);
|
||
if (!badd)
|
||
this.range = [];
|
||
for (var i in ranges) {
|
||
if (opn.chkuse && ranges[i].isuse == 2)
|
||
continue;
|
||
if (!ranges[i]._nofilter && opn.filter && ranges[i][opn.filter.field] != opn.filter.value)
|
||
continue;
|
||
ranges[i].name = ranges[i].name + '';
|
||
this.range.push(ranges[i]);
|
||
}
|
||
if (opn.first && typeof (opn.first) == 'object') {
|
||
opn.first._nofilter = true;
|
||
this.range.unshift(opn.first);
|
||
}
|
||
if (opn.all) {
|
||
this.range.unshift({ id: '', name: opn.all + '', _nofilter: true });
|
||
}
|
||
if (ciyfn.topinyin) {
|
||
for (var i in this.range)
|
||
this.range[i]._py = ciyfn.topinyin(this.range[i].name);
|
||
}
|
||
if (this.value !== undefined)
|
||
this.setvalue();
|
||
}
|
||
this.setrange(opn.range);
|
||
this.setvalue(opn.value, opn.initevent ? 'init' : '');
|
||
showmaindom.on('click', function (e) {
|
||
searchdom.val('');
|
||
thos.showoption();
|
||
searchdom[0].focus();
|
||
});
|
||
searchdom.on('keydown', function (e) {
|
||
if (e.keyCode != 13) return;
|
||
e.preventDefault();
|
||
if (uldom.children().length == 1)
|
||
selectli(uldom.children(0));
|
||
return false;
|
||
});
|
||
searchdom.on('keyup', function (e) {
|
||
if (e.keyCode == 13) return;
|
||
thos.showoption();
|
||
});
|
||
uldom.on('click', function (e) {
|
||
if (e.target.tagName !== 'LI') return;
|
||
selectli(e.target);
|
||
});
|
||
ulpdom.on('click', function (e) {
|
||
thos.hideoption();
|
||
});
|
||
function selectli(lidom) {
|
||
thos.value = $5(lidom).attr('data-id') || '';
|
||
thos.hideoption();
|
||
thos.setvalue(undefined, 'select');
|
||
}
|
||
function panelrect() {
|
||
var pos = showmaindom.rect();
|
||
var ulwidth = uldom.rect().width;
|
||
var ulheight = 2;
|
||
for (var i = 0; i < uldom.children().length; i++) {
|
||
ulheight += uldom.children(i).rect().height;
|
||
}
|
||
var twidth = showmaindom.rect().width;
|
||
var gulwidth = Math.max(145, ulwidth, twidth);
|
||
|
||
var lef = pos.left;
|
||
var lefw = $5(opn.dom).winwidth() - lef - 5;
|
||
if (gulwidth > lefw)
|
||
lef -= gulwidth - lefw;
|
||
if (lef <= 0)
|
||
lef = 0;
|
||
uldom.css({ left: lef + 'px', width: gulwidth + 'px' });
|
||
searchdom.css({ left: lef + 'px', width: gulwidth + 'px' });
|
||
var searchheight = 0;
|
||
if (thos.range.length > opn.minsearch) {
|
||
searchheight = searchdom.rect().height;
|
||
searchdom.css({ display: 'block' });
|
||
searchdom[0].focus();
|
||
} else {
|
||
searchdom.css({ display: 'none' });
|
||
}
|
||
if (window.innerHeight * 0.6 > (pos.top)) {
|
||
// 下方显示
|
||
var hei = pos.top + showmaindom.rect().height;
|
||
if (hei < 0)
|
||
hei = 0;
|
||
if (searchheight > 0)
|
||
searchdom.css({ top: hei + 'px' });
|
||
uldom.css({ top: (hei + searchheight) + 'px' });
|
||
hei = window.innerHeight - hei - 20 - searchheight;
|
||
uldom.css({ height: (ulheight > hei ? hei : ulheight) + 'px', flexDirection: 'column' });
|
||
} else {
|
||
// 上方显示
|
||
var hei = pos.top;
|
||
if (searchheight > 0)
|
||
searchdom.css({ top: (hei - searchheight - 3) + 'px' });
|
||
uldom.css({ flexDirection: 'column-reverse' });
|
||
if (ulheight > hei) {
|
||
uldom.css({ top: '3px', height: (hei - searchheight - 6) + 'px' });
|
||
} else {
|
||
uldom.css({ top: (hei - ulheight - searchheight - 3) + 'px', height: ulheight + 'px' });
|
||
}
|
||
}
|
||
ulpdom.css({ display: 'block', opacity: 1 });
|
||
}
|
||
this.hideoption = function () {
|
||
if (!lishow)
|
||
return;
|
||
window.removeEventListener('scroll', thos.hideoption);
|
||
lishow = false;
|
||
ulpdom.aniout('translateY(30px)', 0.2);
|
||
}
|
||
this.showoption = function () {
|
||
var keystr = searchdom.val();
|
||
var html = '';
|
||
var id = valuedom.val();
|
||
for (var i in thos.range) {
|
||
if ((thos.range[i].name.toUpperCase().indexOf(keystr.toUpperCase()) == -1) && (tostr(thos.range[i]._py).indexOf(keystr.toUpperCase()) == -1))
|
||
continue;
|
||
html += '<li class="txt-left';
|
||
if (thos.range[i].id == id)
|
||
html += ' selected';
|
||
html += '" data-id="' + thos.range[i].id + '">';
|
||
html += opn.fn_li(thos.range[i], thos);
|
||
html += '</li>';
|
||
}
|
||
uldom.html(html);
|
||
if (!lishow) {
|
||
lishow = true;
|
||
ulpdom.css({ opacity: 0, display: 'block' });
|
||
window.addEventListener('scroll', thos.hideoption);
|
||
}
|
||
panelrect();
|
||
}
|
||
}
|
||
ciycmpfunc.ciyinputbet = function (opn) {
|
||
var thos = this;
|
||
this.onchange = opn.onchange;
|
||
opn.initevent = opn.initevent || opn.dom.hasattr('initevent');
|
||
opn.hasmore = opn.hasmore || opn.dom.hasattr('hasmore');
|
||
opn.inpstyle = opn.inpstyle || opn.dom.attr('inpstyle') || '';
|
||
opn.bets = ciyfn.split(opn.bet || opn.dom.attr('bet'), '.');
|
||
opn.units = ciyfn.split(opn.unit || opn.dom.attr('unit'), '.');
|
||
if (opn.bets.length < opn.units.length)
|
||
opn.units.splice(opn.bets.length);
|
||
if (opn.bets.length > opn.units.length)
|
||
opn.bets.splice(opn.units.length);
|
||
if (opn.bets.length == 0) {
|
||
opn.bets = [1];
|
||
opn.units = [''];
|
||
}
|
||
opn.betidx = 0;
|
||
for (var i = 0; i < opn.bets.length; i++) {
|
||
opn.bets[i] = toint(opn.bets[i]);
|
||
if (opn.bets[i] < 1)
|
||
opn.bets[i] = 1;
|
||
if (opn.units[i].substring(0, 1) == '*') {
|
||
opn.betidx = i;
|
||
opn.units[i] = opn.units[i].substring(1);
|
||
}
|
||
}
|
||
opn.width = opn.width || opn.dom.attr('width') || '6em';
|
||
opn.align = opn.align || opn.dom.attr('align') || 'right';
|
||
var html = '';
|
||
html += '<input type="hidden" name="' + opn.name + '"/>';
|
||
html += '<input type="text"';
|
||
if (opn.hasmore)
|
||
html += ' name="' + opn.name + '_num"';
|
||
html += ' style="width:' + opn.width + ';text-align:' + opn.align + ';' + opn.inpstyle + '" />';
|
||
if (opn.hasmore)
|
||
html += '<input type="hidden" name="' + opn.name + '_unit" value="' + opn.unit + '"/>';
|
||
if (opn.units.length > 1)
|
||
html += '<ciy-select minsearch="100" style="' + opn.inpstyle + '"></ciy-select>';
|
||
if (opn.units.length == 1)
|
||
html += '<span style="padding-left: 0.3em;">' + opn.units[0] + '</span>';
|
||
opn.dom.html(html).css({ display: 'inline-flex', alignItems: 'center' });
|
||
if (opn.units.length > 1) {
|
||
var ranges = [];
|
||
for (var i = 0; i < opn.units.length; i++)
|
||
ranges.push({ id: i, name: opn.units[i] });
|
||
ciycmp({
|
||
dom: $5('ciy-select', opn.dom), range: ranges, onchange: function (e) {
|
||
opn.betidx = toint(e.value);
|
||
thos.value = tofloat(showinpdom.val()) * opn.bets[opn.betidx];
|
||
thos.setvalue(undefined, 'unit');
|
||
}
|
||
});
|
||
}
|
||
var valuedom = opn.dom.children(0);
|
||
var showinpdom = opn.dom.children(1);
|
||
var showinpunitdom = null;
|
||
if (opn.hasmore)
|
||
showinpunitdom = opn.dom.children(2);
|
||
this.setvalue = function (newvalue, from) {
|
||
if (newvalue !== undefined) {
|
||
this.value = toint(newvalue);
|
||
for (var i = opn.bets.length - 1; i >= 0; i--) {
|
||
if (this.value / opn.bets[i] >= 0.1) {
|
||
if ((opn.bets[i] >= 1000 && this.value % parseInt(opn.bets[i] / 1000) == 0) || i < opn.betidx) {
|
||
opn.betidx = i;
|
||
break;
|
||
}
|
||
}
|
||
if (this.value != 0 && this.value % opn.bets[i] == 0) {
|
||
opn.betidx = i;
|
||
break;
|
||
}
|
||
}
|
||
$5('ciy-select', opn.dom).val(opn.betidx);
|
||
if (newvalue !== '')
|
||
showinpdom.val(this.value * 1.0 / opn.bets[opn.betidx]);
|
||
else
|
||
showinpdom.val('');
|
||
}
|
||
if (showinpunitdom)
|
||
showinpunitdom.val(opn.units[opn.betidx]);
|
||
valuedom.val(this.value);
|
||
if (from && typeof (this.onchange) == 'function')
|
||
this.onchange({ name: opn.name, dom: opn.dom, from: from, value: this.value });
|
||
}
|
||
this.setvalue(opn.value, opn.initevent ? 'init' : '');
|
||
showinpdom.on('keyup', function () {
|
||
thos.value = tofloat(showinpdom.val()) * opn.bets[opn.betidx];
|
||
thos.setvalue(undefined, 'keyup');
|
||
});
|
||
}
|
||
ciycmpfunc.ciyupload = function (opn) { // v2
|
||
var thos = this;
|
||
this.onchange = opn.onchange;
|
||
opn.initevent = opn.initevent || opn.dom.hasattr('initevent');
|
||
opn.hasmore = opn.hasmore || opn.dom.hasattr('hasmore');
|
||
opn.stor = opn.stor || opn.dom.attr('stor') || ciy_vars.storselect;
|
||
opn.num = toint(opn.num || opn.dom.attr('num') || 1);
|
||
if (opn.num < 1)
|
||
opn.num = 1;
|
||
opn.type = opn.type || opn.dom.attr('type');
|
||
if (opn.type)
|
||
opn.type = opn.type.toUpperCase().split(',');
|
||
opn.imgwidth = toint(opn.imgwidth || opn.dom.attr('imgwidth'));
|
||
opn.imgheight = toint(opn.imgheight || opn.dom.attr('imgheight'));
|
||
opn.maxsize = toint(opn.maxsize || opn.dom.attr('maxsize'));
|
||
opn.zipjpg = toint(opn.zipjpg || opn.dom.attr('zipjpg'));
|
||
opn.zipext = opn.zipext || opn.dom.attr('zipext') || 'jpg,png,webp';
|
||
if (opn.zipext)
|
||
opn.zipext = opn.zipext.toUpperCase().split(',');
|
||
opn.waterfont = opn.waterfont || opn.dom.attr('waterfont') || '28px Arial';
|
||
opn.watertext = opn.watertext || opn.dom.attr('watertext') || '';
|
||
//opn.fn_imgdraw 图片绘制回调
|
||
opn.showwh = opn.showwh || opn.dom.attr('showwh') || '100px'; //显示宽高
|
||
opn.action = opn.action || opn.dom.attr('action');
|
||
if (!opn.action) {
|
||
opn.action = "/z/?func=" + ciy_vars.uploadurl;
|
||
}
|
||
var now = new Date();
|
||
opn.path = opn.path || opn.dom.attr('path') || 'nopath';
|
||
opn.path = opn.path.replace('{Y}', now.getFullYear()).replace('{m}', ciyfn.topad0(now.getMonth() + 1)).replace('{d}', ciyfn.topad0(now.getDate()));
|
||
opn.valname = opn.valname || opn.dom.attr('valname') || '';
|
||
var csstxt = '';
|
||
csstxt += 'ciy-upload{display:flex;align-items:center}';
|
||
csstxt += '.ciy-upload>div>.item,.ciy-upload>div>.add{display:flex;justify-content: center;align-items: center;background:var(--bg1);margin: 0 0.3em 0.3em 0;position:relative;border-radius:0.5em;background-size:contain;background-position:center center;background-repeat:no-repeat;border:1px solid var(--bg6);overflow:hidden;}';
|
||
csstxt += '.ciy-upload>div>.add>svg{width: 50%;opacity:0.6;transition:all .3s;}';
|
||
csstxt += '.ciy-upload>div>.add .progress{position: absolute;bottom: 0;right: 0;left: 0;height: 0%;background: #71c0e9;}';
|
||
csstxt += '.ciy-upload>div>.item a{color:#00000055;white-space: nowrap;}';
|
||
csstxt += '.ciy-upload>div>.item i{cursor:pointer;position: absolute;top: 0;right: 0;width: 1.2em;height: 1.2em;background-image: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTAyNCAxMDI0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTUxMiAwQzIyNy44NCAwIDAgMjI3Ljg0IDAgNTEyczIyNy44NCA1MTIgNTEyIDUxMmMyODQuMDk2IDAgNTEyLTIyNy44NCA1MTItNTEyUzc5Ni4wOTYgMCA1MTIgMEw1MTIgMHpNNzY4IDY5Ni4zMiA2OTYuMjU2IDc2OCA1MTIgNTgzLjY4IDMyNy42MTYgNzY4IDI1NiA2OTYuMzIgNDQwLjI1NiA1MTIgMjU2IDMyNy42OCAzMjcuNjE2IDI1NiA1MTIgNDQwLjMyIDY5Ni4yNTYgMjU2IDc2OCAzMjcuNjggNTgzLjYxNiA1MTIgNzY4IDY5Ni4zMiA3NjggNjk2LjMyek03NjggNjk2LjMyIiBmaWxsPSIjZDgxZTA2Ij48L3BhdGg+PC9zdmc+");}';
|
||
opn.dom.setstyle('ciy_upload', csstxt);
|
||
function upfiles(files) {
|
||
var progressdom = $5('.add .progress', showuploaddom);
|
||
ciyfn.file_uploads(opn.num - nowvalue.length, files, opn, {
|
||
success: function (url, file) {
|
||
progressdom.css({ height: '0%' });
|
||
nowvalue.push(url);
|
||
nowvalname.push(file.name);
|
||
thos.setvalue(undefined, 'add.' + opn.stor);
|
||
}
|
||
, fail: function (err) {
|
||
progressdom.css({ height: '0%' });
|
||
ciyfn.alert(err.errmsg);
|
||
}
|
||
, progress: function (pct) {
|
||
progressdom.css({ height: pct + "%" });
|
||
}
|
||
});
|
||
}
|
||
var html = '';
|
||
html += '<input type="hidden" name="' + opn.name + '"/>';
|
||
html += '<div class="ciy-upload"><div style="display:flex;flex-wrap: wrap;align-items: center;width:100%;height:100%;"></div></div>';
|
||
html += '<input type="file" style="display:none"' + (opn.num > 1 ? ' multiple' : '') + ' />';
|
||
if (opn.hasmore)
|
||
html += '<input type="hidden" name="' + opn.name + '_file"/>';
|
||
opn.dom.html(html);
|
||
var valuedom = opn.dom.children(0);
|
||
var showpdom = opn.dom.children(1);
|
||
var showuploaddom = showpdom.children(0);
|
||
var filedom = opn.dom.children(2);
|
||
var valnamedom = opn.dom.children(3);
|
||
this.setvalue = function (newvalue, from) {
|
||
if (newvalue !== undefined) {
|
||
var vals = newvalue.split("~");
|
||
var valnames = [];
|
||
if (from == 'init')
|
||
valnames = opn.valname.split("~");
|
||
nowvalue = [];
|
||
nowvalname = [];
|
||
for (var i = 0; i < opn.num; i++) {
|
||
if (!vals[i])
|
||
continue;
|
||
nowvalue.push(vals[i]);
|
||
nowvalname.push(valnames[i] ? valnames[i] : '');
|
||
}
|
||
}
|
||
var html = '';
|
||
for (var x in nowvalue) {
|
||
var val = nowvalue[x];
|
||
var realval = ciyfn.file_stor(val);
|
||
var ext = ciyfn.file_ext(val);
|
||
html += '<div class="item" title="' + nowvalname[x] + '" style="width:' + opn.showwh + ';height:' + opn.showwh + ';';
|
||
if (ciyfn.isimg(ext))
|
||
html += 'background-image:url(\'' + realval + '\');';
|
||
html += '">';
|
||
if (ciyfn.isimg(ext)) {
|
||
html += '<a href="' + realval + '" target="_blank" style="position: absolute;bottom: 0.2em;right: 0.2em;transform: scale(0.5);transform-origin: bottom right;line-height: 1em;">' + ext + '</a>';
|
||
} else {
|
||
html += '<a href="' + realval + '" target="_blank" style="font-size:calc(' + opn.showwh + ' / 3);">' + ext + '</a>';
|
||
}
|
||
html += '<i data-idx="' + x + '"></i></div>';
|
||
}
|
||
if (nowvalue.length < opn.num) {
|
||
var tip = '';
|
||
if (opn.num > 1) {
|
||
tip += '最多上传' + opn.num + '个\n';
|
||
tip += '还能上传' + (opn.num - nowvalue.length) + '个\n';
|
||
}
|
||
if (opn.type)
|
||
tip += '可上传' + opn.type.join(',') + '\n';
|
||
html += '<div class="add" title="' + tip + '" style="width:' + opn.showwh + ';height:' + opn.showwh + ';"><div class="progress"></div><svg viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M960 576a192 192 0 0 1-192 192 32 32 0 0 1 0-64 128 128 0 0 0 0-256h-32a224 224 0 0 0-448 0H256a128 128 0 0 0 0 256 32 32 0 0 1 0 64 192 192 0 0 1-24.96-384 287.36 287.36 0 0 1 561.92 0A192 192 0 0 1 960 576zM534.4 489.6a30.72 30.72 0 0 0-44.8 0L376.32 602.24a32 32 0 1 0 45.44 45.44l58.24-58.24V832a32 32 0 0 0 64 0V589.44l58.24 58.24a32 32 0 1 0 45.44-45.44z" fill="#1296db"></path></svg></div>';
|
||
}
|
||
showuploaddom.html(html);
|
||
this.value = nowvalue.join('~');
|
||
valuedom.val(this.value);
|
||
valnamedom.val(nowvalname.join('~'));
|
||
if (from == 'init' && !opn.initevent)
|
||
return;
|
||
if (typeof (this.onchange) == 'function')
|
||
this.onchange({ name: opn.name, dom: opn.dom, from: from, value: this.value });
|
||
}
|
||
var nowvalue = [];
|
||
var nowvalname = [];
|
||
this.setvalue(opn.value, 'init');
|
||
var enablepaste = false;
|
||
showuploaddom.on('click', 'i', function (e) {
|
||
var idx = toint($5(e.currentTarget).attr('data-idx'));
|
||
nowvalue.splice(idx, 1);
|
||
nowvalname.splice(idx, 1);
|
||
thos.setvalue(undefined, 'delete');
|
||
});
|
||
showuploaddom.on('click', '.add', function () {
|
||
filedom.trigger('click');
|
||
});
|
||
filedom.on('change', function (e) {
|
||
upfiles(e.currentTarget.files);
|
||
});
|
||
showuploaddom.on('mouseenter', function (e) {
|
||
enablepaste = true;
|
||
$5('.add>svg', showuploaddom).css({ opacity: 1 });
|
||
window.focus();
|
||
});
|
||
showuploaddom.on('mouseleave', function (e) {
|
||
enablepaste = false;
|
||
$5('.add>svg', showuploaddom).css({ opacity: 0.6 });
|
||
});
|
||
showuploaddom.on('dragover', function (e) {
|
||
e.preventDefault();
|
||
});
|
||
opn.dom.on('drop', function (e) {
|
||
e.preventDefault();
|
||
upfiles(e.dataTransfer.files);
|
||
});
|
||
$5(document).on('paste', function (e) {
|
||
if (!enablepaste)
|
||
return;
|
||
if (!e.clipboardData)
|
||
return console.warn('Cannot support clipboard pasting');
|
||
if (!e.clipboardData.items)
|
||
return console.warn('Paste clipboard without item');
|
||
var len = e.clipboardData.items.length;
|
||
var files = [];
|
||
for (var i = 0; i < len; i++) {
|
||
if (e.clipboardData.items[i].type.indexOf("image") == -1)
|
||
continue;
|
||
var blob = e.clipboardData.items[i].getAsFile();
|
||
files.push(blob);
|
||
}
|
||
upfiles(files);
|
||
});
|
||
}
|
||
ciycmpfunc.ciytextarea = function (opn) {
|
||
var thos = this;
|
||
this.onchange = opn.onchange;
|
||
opn.initevent = opn.initevent || opn.dom.hasattr('initevent');
|
||
opn.inpstyle = opn.inpstyle || opn.dom.attr('inpstyle') || '';
|
||
opn.total = opn.total || opn.dom.attr('total') || '';
|
||
opn.tab = opn.tab || opn.dom.attr('tab') || ' ';
|
||
opn.autoheight = opn.autoheight || opn.dom.hasattr('autoheight') || false;
|
||
opn.minheight = opn.minheight || opn.dom.attr('minheight') || '5em';
|
||
var html = '';
|
||
html += '<textarea name="' + opn.name + '" style="tab-size:4;transition:all 0.3s;padding:0.5em;line-height: 1.6em;min-height:' + opn.minheight + ';' + opn.inpstyle + '" ></textarea>';
|
||
html += '<span style="line-height: 1.3em;min-height: 1em;display: block;text-align: right;padding: 0;font-size: 0.8em;position: relative;"></span>';
|
||
opn.dom.html(html);
|
||
var valuedom = opn.dom.children(0);
|
||
var showtotaldom = opn.dom.children(1);
|
||
this.autoheight = function () {
|
||
if (!opn.autoheight)
|
||
return;
|
||
valuedom[0].style.overflow = 'hidden';
|
||
valuedom[0].style.resize = 'none';
|
||
valuedom[0].style.height = 'auto';
|
||
valuedom[0].style.height = valuedom[0].scrollHeight + 'px';
|
||
}
|
||
this.setvalue = function (newvalue, from) {
|
||
if (newvalue !== undefined) {
|
||
this.value = newvalue + '';
|
||
valuedom.val(this.value);
|
||
}
|
||
thos.autoheight();
|
||
var totaltxt = tostr(opn.total).replace('{word}', this.value.length).replace('{line}', this.value.split('\n').length);
|
||
if (totaltxt)
|
||
showtotaldom.show().html(totaltxt);
|
||
else
|
||
showtotaldom.hide();
|
||
if (from && typeof (this.onchange) == 'function')
|
||
this.onchange({ name: opn.name, dom: opn.dom, from: from, value: this.value });
|
||
}
|
||
this.setvalue(opn.value, opn.initevent ? 'init' : '');
|
||
valuedom.on('keyup', function (e) {
|
||
thos.value = valuedom.val();
|
||
thos.setvalue(undefined, 'keyup');
|
||
if (e.key == "@") {
|
||
if (typeof (opn.popfn) == 'function') {
|
||
opn.popfn(e);
|
||
}
|
||
}
|
||
});
|
||
valuedom.on('keydown', function (e) {
|
||
if (e.keyCode == 9 && opn.tab) {
|
||
e.preventDefault();
|
||
var indent = opn.tab;
|
||
if (e.shiftKey) {
|
||
var start = valuedom[0].selectionStart;
|
||
var end = valuedom[0].selectionEnd;
|
||
var selected = window.getSelection().toString();
|
||
var lines = selected.split('\n');
|
||
var newlines = [];
|
||
for (var i = 0; i < lines.length; i++) {
|
||
var line = lines[i];
|
||
if (line.length >= indent.length && line.substring(0, indent.length) == indent)
|
||
line = line.substring(indent.length);
|
||
newlines.push(line);
|
||
}
|
||
selected = newlines.join('\n');
|
||
valuedom.val(valuedom.val().substring(0, start) + selected + valuedom.val().substring(end));
|
||
valuedom[0].setSelectionRange(start, start + selected.length);
|
||
thos.autoheight();
|
||
} else {
|
||
var val = valuedom.val();
|
||
var start = valuedom[0].selectionStart;
|
||
var end = valuedom[0].selectionEnd;
|
||
var selected = window.getSelection().toString();
|
||
if (start != end && val[end - 1] == '\n') {
|
||
end--;
|
||
selected = selected.substring(0, selected.length - 1);
|
||
}
|
||
selected = indent + selected.replace(/\n/g, '\n' + indent);
|
||
valuedom.val(val.substring(0, start) + selected + val.substring(end));
|
||
if (start == end)
|
||
valuedom[0].selectionStart = valuedom[0].selectionEnd = start + selected.length;
|
||
else
|
||
valuedom[0].setSelectionRange(start, start + selected.length);
|
||
thos.autoheight();
|
||
}
|
||
}
|
||
if (e.keyCode == 13) {
|
||
//自动给组件增加高度，自适应高度
|
||
// setTimeout(function () {
|
||
// valuedom.css('height', height + 10);
|
||
// }, 100);
|
||
|
||
var currpos = valuedom[0].selectionStart;
|
||
var val = valuedom.val();
|
||
var line = val.substring(val.lastIndexOf('\n', currpos - 1) + 1, currpos);
|
||
if (line.length == 0)
|
||
return;
|
||
var space = '';
|
||
var spaces = 0;
|
||
while (line[spaces] == ' ' || line[spaces] == '\t') {
|
||
space += line[spaces];
|
||
spaces++;
|
||
}
|
||
if (spaces == 0)
|
||
return;
|
||
e.preventDefault();
|
||
valuedom.val(val.substring(0, currpos) + '\n' + space + val.substring(currpos));
|
||
var newpos = currpos + 1 + space.length;
|
||
valuedom[0].setSelectionRange(newpos, newpos);
|
||
thos.autoheight();
|
||
}
|
||
});
|
||
}
|
||
function ciycmp(opn) {
|
||
opn.dom = $5(opn.dom);
|
||
if (opn.dom.length == 0)
|
||
return;
|
||
opn.value = opn.value || opn.dom.attr('value') || '';
|
||
opn.name = opn.name || opn.dom.attr('com') || '';
|
||
var node = opn.dom.node().replace('ciy-', 'ciy');
|
||
if (!ciycmpfunc[node]) {
|
||
console.warn(node + '组件不存在');
|
||
return null;
|
||
}
|
||
var cths = new ciycmpfunc[node](opn);
|
||
if (!cths) {
|
||
console.warn(node + '组件初始化失败');
|
||
return null;
|
||
}
|
||
opn.dom[0].ciycmp = cths;
|
||
return cths;
|
||
}
|
||
/*
|
||
*****ciycmp.js*****
|
||
datetime 时间日期选择器
|
||
daterange 日期范围选择器
|
||
switch 开关
|
||
radio 单选
|
||
checkbox 复选
|
||
select 下拉选择，带搜索
|
||
upload 上传文件，拖入文件/粘贴截图/水印图/压缩缩小图
|
||
textarea 多行文本框，带统计、tab加空格、首行自动加空格
|
||
|
||
*****ciycmp2.js*****
|
||
selcas 联级select
|
||
selmulti 下拉多选，带搜索
|
||
inputbet 倍数数字输入
|
||
inputunitedit 三级单位
|
||
inputcyc 时间周期
|
||
md 简化Markdown编辑器
|
||
map 弹出地图选择经纬度
|
||
|
||
|
||
|
||
|
||
https://element-plus.org/zh-CN/component/overview.html
|
||
参考element及其他前端库样式。
|
||
原生实现，不依赖vue等第三方。
|
||
|
||
|
||
slider 滑块(表单)
|
||
aninum 动态数值动效
|
||
inputnumber 计数器(表单)
|
||
rate 评分(表单)
|
||
inputcolor 颜色选择器(表单)
|
||
notify 通知叠加
|
||
steps 步骤
|
||
swiper 轮播
|
||
timeline 时间线
|
||
drawer 侧边抽屉
|
||
calendar 日历显示
|
||
calwork 日历工作分布
|
||
seltransfer 穿梭框(表单) 重写
|
||
skeleton 骨架
|
||
seltree 树形选择(表单)
|
||
selmultitree 多选树形选择(表单)
|
||
selcas2 箭头式联级选择(表单)
|
||
*/ |