var frameui_vueextend = window.frameui_vueextend || {};
if (window.sparkmd5 == undefined) {
document.write("");
}
vue.mixin({
methods: {
//抽屉回调
opendrawercallback: function () {
var _this = this;
_this.drawerconfig.loading = false;
},
//抽屉公共方法
opendrawer: function (config) {
var _this = this;
_this.drawerconfig.loading = true;
this.drawerconfig.url = config.url;
this.drawerconfig.show = true;
this.drawerconfig.title = config.title;
},
//抽屉公共方法
closedrawer: function (refreshlist) {
parent.vue.drawerconfig.show = false;
if (refreshlist) {
try {
parent.vue.loaddata();
}
catch (err) {
console.log(err);
}
}
},
//弹出窗口
dialog: function (options) {
var vue = this;
var defaultparams = { title: "标题", url: "", data: {}, additionals: "", width: "100%", height: "100%", target: 'self', beforeexecute: "", shadeclose: true };
defaultparams = extend(defaultparams, options);
var canexecuting = true;
var beforeexecute = defaultparams.beforeexecute;
try {
if (typeof (beforeexecute) == "string") {
if (beforeexecute != "") {
canexecuting = eval(beforeexecute);
}
}
else if (typeof (beforeexecute) == "function") {
canexecuting = beforeexecute();
}
}
catch (err) {
canexecuting = false;
console.log(err)
}
if (canexecuting == false) { return; }
frameui_ui.dialog(defaultparams);
},
ajax: function (options) {
var loadinginstance = this.$loading();
var completefun = options.complete;
options.complete = function () {
if (completefun != undefined && typeof (completefun) == "function") {
completefun();
}
loadinginstance.close();
};
return ajax(options);
},
submit:function (options) {
var defaultparams = { type: "post", contenttype: "application/x-www-form-urlencoded;charset=utf-8", url: "", data: {}, async: true, beforeexecute: "", beforerequest: "", success: "", failtipstype: "notification", failcallback: "", showsuccessmsg: true, showfailmsg: true, confirmmsg: "", successmsg: "提交成功!", cancel: false, cancelmsg: "提交被取消" };
defaultparams = extend(defaultparams, options);
var confirmmsg = defaultparams.confirmmsg;
var successmsg = defaultparams.successmsg;
var async = defaultparams.async;
var beforeexecute = defaultparams.beforeexecute;
var beforerequest = defaultparams.beforerequest;
var successcallback = defaultparams.success;
var failcallback = defaultparams.failcallback;
var ajaxurl = defaultparams.url;
var showsuccessmsg = defaultparams.showsuccessmsg;
var showfailmsg = defaultparams.showfailmsg;
var failtipstype = defaultparams.failtipstype; //提交返回失败后的错误提示方式,采用notification组件或message组件方式
var canexecuting = true;
var data = defaultparams.data;
var cancel = defaultparams.cancel;
var vue = this;
if (cancel) {
vue.$notify({
title: '提示',
message: defaultparams.cancelmsg,
type: 'warning'
});
return;
}
if (ajaxurl == "") {
alert("url参数未设置!")
}
try {
if (typeof (beforeexecute) == "string") {
if (beforeexecute != "") {
canexecuting = eval(beforeexecute);
}
}
else if (typeof (beforeexecute) == "function") {
canexecuting = beforeexecute();
}
}
catch (err) {
console.log(err)
}
if (canexecuting == false) { return; }
if (confirmmsg != "") {
vue.$confirm(confirmmsg, '提示', {
confirmbuttontext: '确定',
cancelbuttontext: '取消',
type: 'warning',
callback: function (action, instance) {
switch (action) {
case "confirm":
request();
break;
case "cancel":
break;
case "close":
break;
}
}
})
}
else {
request();
}
function request() {
try {
if (typeof (beforerequest) == "string") {
if (beforerequest != "") {
canexecuting = eval(beforerequest);
}
}
else if (typeof (beforerequest) == "function") {
canexecuting = beforerequest();
}
}
catch (err) {
console.log(err)
}
if (canexecuting == false) { return; }
var callback = function (data) {
try {
if (typeof (successcallback) == "string") {
if (successcallback != "") {
eval(successcallback);
}
}
else if (typeof (successcallback) == "function") {
successcallback.call(vue, data);
}
}
catch (err) {
console.log(err)
}
}
var notifycallback = function (data) {
if (typeof (data) != "object") {
data = jsonparse(data);
}
if (data.state == 1) {
var delaycallback = 600;
if (showsuccessmsg) {
if (successmsg != "") {
successmsg = successmsg;
}
else if (data.msg != "") {
successmsg = data.msg;
}
vue.$notify({
title: '成功',
message: successmsg,
type: 'success',
position: 'top-right'
});
settimeout(function () { callback(data); }, delaycallback);
}
else {
callback(data);
}
}
else {
if (data.msg != "" && showfailmsg) {
if (failtipstype == "notification") {
vue.$notify({
title: '提示',
message: data.msg,
type: 'error',
position: 'top-left'
});
}
else {
vue.$message.error(data.msg);
}
}
try {
if (typeof (failcallback) == "string") {
if (failcallback != "") {
eval(failcallback);
}
}
else if (typeof (failcallback) == "function") {
failcallback(data);
}
}
catch (err) {
console.log(err)
}
}
}
var error = function () {
vue.$message.error("ajax http请求错误,请联系管理员处理!")
}
var ajaxoptions = { type: defaultparams.type, contenttype: defaultparams.contenttype, url: ajaxurl, data: data, async: async, error: error, success: function (data) { notifycallback(data); } }
vue.ajax(ajaxoptions);
}
},
}
})
//列表页外部的常用全局方法
var datalistexternal = {
methods: {
//对集合进行排序,支持多级数据集
updatexuhao: function (options) {
var defaultparams = { type: "", url: "", row: {}, datalist: [], keyfield: "id", sortfield: "xuhao", parentidfield: "parentid", childrenfield: "children" };
defaultparams = extend(defaultparams, options);
var vue = this;
var type = defaultparams.type;
var url = defaultparams.url;
var row = defaultparams.row;
var datalist = defaultparams.datalist;
//console.log(datalist)
var sortfield = defaultparams.sortfield;
var childrenfield = defaultparams.childrenfield;
var keyfield = defaultparams.keyfield;
var parentidfield = defaultparams.parentidfield;
var id = row[keyfield];
var parentid = row[parentidfield];//获取当前行的父级id
var previndex = 0;
var nextindex = 0;
var currentindex = 0;
var newdatalist = []; //构造一个新的数组,用于传输到后台,默认的数据属性太多没有必要都传递到后台去
//列表序号对调
var startsort = function (datalist) {
newdatalist = [];
//1、先整理顺序
datalist.foreach(function (item, index) {
var i = index + 1;
var currentparentid = item[parentidfield];
if (currentparentid == parentid)//同一级的数据才进行处理
{
item[sortfield] = i;
if (item[keyfield] == id) {
previndex = i - 1;
currentindex = i;
nextindex = i + 1;
}
}
});
//2、再进行顺序对调
datalist.foreach(function (item, index) {
var i = index + 1;
var currentparentid = item[parentidfield];
if (currentparentid == parentid)//同一级的数据才进行处理
{
switch (type) {
case "-":
case "up":
case -1:
if (previndex == i) {
item[sortfield] = i + 1;
}
if (currentindex == i && i > 1) {
item[sortfield] = i - 1;
}
break;
case "+":
case "down":
case 1:
if (currentindex == i && i < datalist.length) {
item[sortfield] = i + 1;
}
if (nextindex == i) {
item[sortfield] = i - 1;
}
break;
}
//重构减少http传输
var newrow = {}
newrow[keyfield] = item[keyfield];
newrow[sortfield] = item[sortfield]
newdatalist.push(newrow);
index++;
}
});
}
//对列表进行顺序排序
var resort = function (datalist, sortfield, nodefield) {
if (sortfield == undefined) {
sortfield = "xuhao"; //默认序号字段
}
if (nodefield == undefined) {
nodefield = "children"; //默认节点字段
}
datalist.sort(function (a, b) { return a[sortfield] - b[sortfield] });//1级排序
//树形数据继续对数据进行递归排序
datalist.some(function (item) {
if (parentid == item[parentidfield]) { //第一级或默认只有一级的情况
newdatalist = datalist; //新的数组,提交到服务器进行更新的数据
return true;
}
else //第一级找不到继续往下找
{
var childrenlist = item[nodefield];
if (array.isarray(childrenlist)) {
resort(childrenlist, sortfield, nodefield); //递归排序
}
}
});
};
if (type != "0" && type != "") {
resort(datalist, sortfield, childrenfield);
startsort(newdatalist);
}
resort(datalist, sortfield, childrenfield);
//console.log(datalist)
vue.submit({ url: url, data: { data: json.stringify(newdatalist) }, showsuccessmsg: false })
},
//获取选中列表的属性值,不填写属性默认读取id
getselectedpropertys: function (selecteditem, prop) {
if (!array.isarray(selecteditem)) {
throw "getselectedpropertys的第2个参数必须是数组"
}
if (prop == undefined) {
prop = "id";
}
var props = [];
selecteditem.map(function (item, index, ary) {
if (item[prop] != undefined) {
props.push(item[prop]);
}
})
return props.join();
},
//回调方法,设置列表页选中项目的属性
setselecteditem: function (datalist, selecteditems, setproperty, setvalue) {
var vue = this;
var selecteditem = [];
if (!array.isarray(deleteitems)) {
selecteditem.push(deleteitems);
}
else {
selecteditem = deleteitems;
}
var selectedids = [];
selecteditems.foreach(function (item) {
selectedids.push(item[key]);
});
datalist.foreach(function (item, index) {
if (selectedids.indexof(item[key]) >= 0) {
item[setproperty] = setvalue;
}
else {
vue.$set(item, setproperty, setvalue);
}
});
},
//删除列表项目的方法
deleteitem: function (datalist, deleteitems, key) {
if (key == undefined) {
key = "id";
}
var vue = this;
var selecteditem = [];
if (!array.isarray(deleteitems)) {
selecteditem.push(deleteitems);
}
else {
selecteditem = deleteitems;
}
var selectedids = [];
selecteditem.foreach(function (item) {
selectedids.push(item[key]);
});
datalist.foreach(function (item, index) {
if (selectedids.indexof(item[key]) >= 0) {
datalist.splice(index, 1);
}
if (item.children != undefined) {
vue.deleteitem(item.children, deleteitems);
}
});
},
//设置前的检测选中项目
checkselecteditems: function (selecteditem) {
if (selecteditem.length == 0) {
vue.$message.error("请选择要操作的项!")
return false;
}
return true;
}
}
};
vue.mixin(datalistexternal);
//百度编辑器
vue.component("ui-editor", {
props: {
value: { default: "" },
maxlength: { type: number, default: 0 },
action: { type: string, default: "/e/editoruploadapi/", required: false },
toolbars: { type: string, default: "normal", required: false },
height: { type: number, default: 300 },
config: { type: object, default: function () { return {} }, required: false },
data: { type: object, default: function () { return { guid:"",watermark:-1,maximagewidth:0,fieldname:"", tablename:"", fieldname:""} }, required: true },
},
data: function () {
return {
instanceid: "ueditorobject",
content: this.value,
ueditor: {},
}
},
methods: {
reset: function () { //编辑器重置为可视化模式,源码模式下修改无法获取到修改的内容
if (this.ueditor.querycommandstate('source') != 0) {
this.ueditor.execcommand('source');
vue.content = ueditor.getcontent();
vue.$emit("input", vue.content);
}
}
},
created: function () {
if (window["ueditorinstancenums"] == undefined) {
window["ueditorinstancenums"] = 1;
}
else {
window["ueditorinstancenums"] = window["ueditorinstancenums"] + 1;
}
this.instanceid = "ueditorobject" + window["ueditorinstancenums"];
},
mounted: function () {
var vue = this;
var defaultconfig = {
autoheightenabled: false,
serverurl: vue.action,
initialframewidth: null,
initialframeheight: vue.height, //初始化编辑器高度,默认320
toolbars: _ueditorzdyconfig[vue.toolbars]
};
var config = extend(vue.config, defaultconfig);
vue.ueditor = ue.geteditor(vue.instanceid, config);
var ueditor = vue.ueditor;
ueditor.ready(function () {
ueditor.execcommand("serverparam", vue.data);
ueditor.addlistener('blur', function () {
vue.content = ueditor.getcontent();
var currentlength = vue.content.strlength();
if (vue.maxlength > 0 && currentlength > vue.maxlength) {
vue.content = vue.content.left(vue.maxlength);
ueditor.setcontent(vue.content);
}
vue.$emit("input", vue.content);
});
});
},
template: ''
});
//id转文本组件
vue.component("el-input-convert", {
props: {
converturl: { type: string, default: "", required: false },
value: {//v-mode传递进来,内部不需要需用
type: number | undefined,
default: 0,
required: false
},
clearable: {
type: boolean,
default: false,
required: false
},
},
data: function () {
return {
name: "",
}
},
methods: {
getname: function () {
var vue = this;
var data = this.serverdata;
var defaultoptions = { async: true, type: "get", url: this.converturl, data: data, cache: true };
defaultoptions = extend(defaultoptions, this.config);
defaultoptions.success = function (data) {
if (data.name != null && data.name != undefined) {
vue.name = data.name;
}
};
if (defaultoptions.url == "") {
return;
}
vue.ajax(defaultoptions);
},
clearname: function () {
var vue = this;
vue.name = "";
vue.$emit('input', 0)
}
},
watch: {
converturl: {
handler: function (newname, oldname) {
if (newname != oldname) {
this.getname();
}
},
immediate: true,
deep: true
},
},
template: ''
});
//ui-page-panel
vue.component("ui-page-panel", {
props: {
value: {
type: object,
default: function () { return {} },
required: false
},
},
data: function () {
return {
pageinfo: this.value
}
},
watch: {
value: function (newvalue, oldvalue) {
this.pageinfo = newvalue;
}
},
methods: {
gopage: function (page) {
if (page != undefined) {
this.pageinfo.currentpage = page;
}
this.$emit("input", this.pageinfo);
this.$emit("change");
},
changepagesize: function () {
this.pageinfo.currentpage = 1;
this.$emit("input", this.pageinfo);
this.$emit("change");
},
},
computed: {
pageitem: function () {
var pageitem = [];
var pageinfo = this.pageinfo;
var currentpage = pageinfo.currentpage;
var recordcount = pageinfo.recordcount;
if (recordcount == 0) {
return [{ value: 1, text: "第1页" }];
}
var pagesize = pageinfo.pagesize;
var pagecount = 1;
if (recordcount % pagesize > 0) {
pagecount = math.floor(recordcount / pagesize) + 1;
}
else {
pagecount = recordcount / pagesize;
}
if (currentpage > pagecount) {
currentpage = pagecount;
}
pageinfo.pagecount = pagecount;
var startpage = currentpage - 10;
if (startpage < 1) {
startpage = 1;
}
var endpage = currentpage + 10;
if (endpage >= pagecount) {
endpage = pagecount;
}
for (var i = startpage; i <= endpage; i++) {
pageitem.push({ value: i, text: "第" + i + "页" });
}
if (startpage > 1) {
if (startpage > 2) {
pageitem.unshift({ value: startpage - 1, text: "..." });
}
pageitem.unshift({ value: 1, text: "首页" });
}
if (endpage < pagecount) {
if (endpage < pagecount - 1) {
pageitem.push({ value: endpage + 1, text: "..." });
}
pageitem.push({ value: pagecount, text: "尾页" });
}
return pageitem;
}
, pagesizeitem: function () {
var pageitem = [10, 15, 20, 30, 40, 50, 100];
var pagesize = this.pageinfo.pagesize;
if (pageitem.indexof(pagesize) < 0) {
pageitem.push(pagesize);
}
return pageitem.sort(function (a, b) { return a - b });
}
},
template: '\
'
});
//ui-verificationcode验证码组件
vue.component("ui-verification-code-image", {
props: {
src: { default: null },
},
data: function () {
return {
random: "",
autominutes: 10,//自动刷新分钟数
timer: null
}
},
created: function () {
this.autorefresh();
},
methods: {
change: function () {
var _this = this;
var r = math.floor(math.random() * 100000000);
var imgsrc = this.src;
if (imgsrc.indexof("?") < 0) {
r = "?" + r;
}
r = "&" + r;
this.random = r;
_this.autorefresh();
},
autorefresh: function () //定时刷新
{
var _this = this;
if (_this.timer != null) {
cleartimeout(_this.timer);
}
_this.timer = settimeout(function () { _this.change() }, (this.autominutes) * 60 * 1000);
}
},
template: ''
});
//上传文件共有属性方法
var _uploadmixinsdata_ = {
data: function () {
return {
dialogimageurl: '',
dialogvisible: false,
elementuifilelist: [],
hideupload: false,
acceptext: [".jpg", ".jpeg", ".png", ".gif"],
uploadbtnstate: false,
multiple: false,
watchfilelist: true, //从内到外改变时设置为false,避免死循环
watchvalue: true, //从内到外改变v-model时设置为false,避免死循环
}
},
props: {
data: {
type: object,
default: function () { return { filetype: "image" } },
required: false,
loadinginstance: null
},
btntxt: {
type: string,
default: "点击上传" //可选择array或string
},
disabled: {
type: boolean,
default: false,
required: false
},
returntype: {
type: string,
default: "array" //可选择array或string
},
value: {//v-mode传递进来,内部不需要
type: array | string | undefined,
default: function () { return [] },
required: false
},
action: {//----------接口地址
type: string,
default: '#'
},
accept: {
type: array | string,
default: [".jpg", ".jpeg", ".png", ".gif"],
required: false
},
limit: { //-------限制个数
type: number,
default: 5
},
disabled: { //------是否禁止
type: boolean,
default: false
},
maxsize: {//------------最大尺寸限制,0则不限制,单位kb
type: number,
default: 1
},
filelist: { //-------------数据源(数据绑定时实现双向绑定:file-list.sync)
type: array,
default: function () {
return [];
}
},
drag: { //-----------是否启动拖拽
type: boolean,
default: true
}
},
methods: {
formatfilelist: function (filelist, modelvalue) {//格式化filelist,以适应ui-element的规则
var newfilelist = [];
if (array.isarray(filelist)) {
filelist.foreach(function (item) {
newfilelist.push({ name: item.name || item.name, url: item.url || item.thumbnail || item.path,path: item.path });
});
}
if (newfilelist.length == 0 && !isnullorempty(modelvalue)) {
var valuearay = [];
if (array.isarray(modelvalue)) {
valuearay = modelvalue;
} else {
valuearay = modelvalue.split(",");
}
valuearay.foreach(function (fileitem) {
if (!isnullorempty(fileitem)) {
var filename = fileitem.split("/")[fileitem.split("/").length - 1];
newfilelist.push({ name: filename, url: fileitem, path: fileitem });
}
});
}
//console.log(newfilelist)
return newfilelist;
},
columndrop: function () { // 左右拖动
var _this = this;
var sortbox = _this.$refs.upload.queryselector('.el-upload-list');
if (sortbox != null && typeof (sortable) != "undefined") {
sortable.create(sortbox, {
handle: "",
onend: function (evt) {
var newindex = evt.newindex;
if (newindex == undefined) {
newindex = 0;
}
var oldindex = evt.oldindex;
var currrow = _this.elementuifilelist.splice(oldindex, 1)[0];
_this.elementuifilelist.splice(newindex, 0, currrow) // 调整顺序
_this.updateimgsrc(_this.elementuifilelist);
}
})
}
},
getfilelist: function () {
return this.elementuifilelist;
},
getimgsrc: function (file) {
var imageurl = file.localurl; //优先使用本地blob文件,ftp异步上传时候http图片不能实时返回
if (isnullorempty(imageurl)) {
imageurl = file.url
}
return imageurl;
},
//更新父级v-model
updateimgsrc: function (filelists) {
var _this = this;
var newdata = filelists.map(function (item) {
return item.url;
})
if (this.returntype == "string") {
newdata = newdata.join(",");
}
this.watchfilelist = false;
this.watchvalue = false;
this.$emit('input', newdata);
},
//下载文件。
downfile: function (file) {
//console.log(file)
console.log(file);
var url = file.path || file.url;
var filename = file.name;
if (isimage(url)) { //图片直接打开
window.open(url, "_blank");
}
else {//其他格式直接下载
window.open("/e/download?file=" + urlencode(url) + "&name=" + urlencode(filename), "_blank");
}
},
handleremove: function (file) { //-----------删除
var _this = this
_this.elementuifilelist.foreach(function (item, index) {
if (item.uid == file.uid) {
_this.elementuifilelist.splice(index, 1)
}
})
this.showuploadbthhandel();
this.updateimgsrc(_this.elementuifilelist);
},
handlepicturecardpreview: function (file) {//----------预览
//console.log("handlepicturecardpreview", file)
var imageurl = file.localurl; //本地bob文件
if (isnullorempty(imageurl)) {
imageurl = file.path || file.url;
}
this.dialogimageurl = imageurl;
this.dialogvisible = true;
},
onimageerror: function (err, file, filelist) {//-------上传失败,http服务器错误
//console.log("onimageerror")
this.elementuifilelist = filelist;
try {
this.$store.getters.chunkeduploadxhr.foreach(function (item) {
item.abort();
});
}
catch (err) {
}
if (err) {
this.$message.error(err);
}
},
onrequestover: function (response, file, filelist) { //--------http请求结束后的回调
//console.log("onrequestover----------", response, file, filelist)
this.showuploadbthhandel();
this.elementuifilelist = filelist;
if (!response.state) //response.state==0时表示已被服务器端终止上传并返回提示
{
this.handleremove(file);
this.$message.error(response.msg);
}
else {
//ftp异步上传时url还没有上传成功,导致图片打不开
file.localurl = file.url; //格式:blob:http://localhost:8800/78e7c95e-2fa8-4759-bb5b-78724b6f9f74
file.url = response.thumbnail || response.url;
file.path = response.url;
}
},
handleuploadrequest: function (uploadfile) {//自定义上传。
if (!uploadfile.file.allowupload) {
return;
}
//console.log("handleuploadrequest", uploadfile.file.allowupload, uploadfile)
var _this = this;
var uploadtasklist = _this.$uploadtasklist;
if (uploadtasklist == undefined) {
_this.$uploadtasklist = [];
uploadtasklist = _this.$uploadtasklist;
}
uploadfile.onprogress({ percent: 0 });//设置初始进度
if (uploadtasklist.length == 0) {
uploadtasklist.push(uploadfile);
_this.loadinginstance = _this.$loading();
startupload(uploadfile,_this);
}
else
{
uploadtasklist.push(uploadfile); //只加入任务队列,否则会导致多个文件同时上传导致未知的ajax冲突。
return;
}
function startupload(uploadfile,_this) {
//_this.elementuifilelist.push(uploadfile.file);//不能先添加,否则进度条不显示
var action = _this.action;
_this.uploadbypieces({
uploadfile: uploadfile,
piecesize: 2,//分片大小,单位mb
chunkurl: action,
fileurl: action,
progress: function (num, response) {
uploadfile.onprogress({ percent: num });
if (num == 100) {
uploadfile.onsuccess(response)//显示完成按钮小图标,会触发on-success对应的函数
//继续下一个任务
uploadtasklist.splice(0,1);
if (uploadtasklist.length > 0) {
startupload(uploadtasklist[0], _this);
} else
{
_this.loadinginstance.close();
}
}
},
success: function (data) {
//alert(_this.uploadtasklist.length)
//_this.elementuifilelist.push(uploadfile.file);//onsuccess后自动添加了
},
error: function (response) {
_this.loadinginstance.close();
uploadtasklist.foreach(function (item, index) {
var error = response.msg;
if (index > 0) {
error = "";
}
item.onerror(error);
});
uploadtasklist.splice(0, uploadtasklist.length);
}
})
}
},
uploadbypieces: function (_ref) {//分片上传
var _this = this;
var uploadingfile = _ref.uploadfile,
chunkurl = _ref.chunkurl,
fileurl = _ref.fileurl,
piecesize = _ref.piecesize,
progress = _ref.progress,
success = _ref.success,
error = _ref.error;
if (!uploadingfile) return; // 上传过程中用到的变量
var progressnum = 1; // 进度
var haserror = 0;//是否有报错
var successallcount = 0; // 上传成功的片数
// let currentallchunk = 0 // 当前上传的片数索引
var allchunk = 1; // 所有文件的chunk数之和
// 获取md5
var readfilemd5 = function (uploadfile) {
var filerederinstance = new filereader();
//var blob = uploadfile.file.slice(0, uploadfile.file.length);
filerederinstance.readasarraybuffer(uploadfile.file);
filerederinstance.addeventlistener("load", function (e) {
readchunkmd5(uploadfile);
}, false);
function loadnext() {
var start = currentchunk * chunksize,
end = ((start + chunksize) >= file.size) ? file.size : start + chunksize;
filereader.readasarraybuffer(blobslice.call(file, start, end));
}
};
var getchunkinfo = function getchunkinfo(file, currentchunk, chunksize) {
var start = currentchunk * chunksize;
var end = math.min(file.size, start + chunksize);
var chunk = file.slice(start, end);
return { start: start, end: end, chunk: chunk };
}; // 针对每个文件进行chunk处理
var readchunkmd5 = function (currentfile) {
var chunks = [];
var chunksmd5 = [];
var file = currentfile.file;
var blobslice = file.prototype.slice || file.prototype.mozslice || file.prototype.webkitslice;//
chunkidx = 0,
spark = new sparkmd5.arraybuffer(),
chunksize = piecesize * 1024 * 1024, // 单位字节
chunkcount = math.ceil(file.size / chunksize); // 总片数
filereader = new filereader();
allchunk = chunkcount;
filereader.onload = function (e) {
spark.append(e.target.result);
chunksmd5.push(sparkmd5.arraybuffer.hash(e.target.result));
chunkidx++;
if (chunkidx < chunkcount) {
loadnext();
} else {
//获取md5后,触发分片上传。
var md5 = spark.end();
currentfile.file.md5=md5;
startupload(0);
}
};
function loadnext() {
var start = chunkidx * chunksize,
end = ((start + chunksize) >= file.size) ? file.size : start + chunksize;
var currentchunk = blobslice.call(file, start, end);
chunks.push(currentchunk);
filereader.readasarraybuffer(currentchunk);
}
loadnext();
function startupload(i) {
try {
var currentchunk = chunks[i];
var chunkmd5 = chunksmd5[i];
uploadchunk(
currentfile,
{ chunkmd5: chunkmd5, chunk: currentchunk, currentchunk: i, chunkcount: chunkcount },
function () {
var nextidx = i + 1;
if (nextidx <= allchunk - 1) {
startupload(nextidx);
}
}
);
}
catch (err) {
error && error({ state: 0, msg:err.description });
}
}
};
// 更新进度
var progressfun = function progressfun(response) {
progressnum = math.ceil(successallcount / allchunk * 100);
progress(progressnum, response);
};
// 分片上传完毕后再请求api进行合并。
var uploadfile = function (currentfile, chuckscount) {
var data = _this.data;
data.filemd5 = currentfile.file.md5;
data.filename = currentfile.file.name;
data.ismerge = "true";
data.chunkscount = chuckscount;
ajax({
type: "post",
url: fileurl + "?merge=1",
data: data,
error: function (xhr) {
error && error({ state: 0, msg: "http error" });
},
success: function (res) {
if (res.state == 1) {
progressfun(res);
success && success(res);
} else
{
error && error(res);
}
}
});
};
var uploadchunk = function (currentfile,chunkinfo,nextcallback) {
var fetchform = new formdata();
fetchform.append("filename", currentfile.file.name);
fetchform.append("data", chunkinfo.chunk);
fetchform.append("filemd5", currentfile.file.md5);
fetchform.append("chunkscount", chunkinfo.chunkcount);
fetchform.append("chunkidx", chunkinfo.currentchunk);
fetchform.append("chunkmd5", chunkinfo.chunkmd5);
for (var key in _this.data) {
fetchform.append(key, _this.data[key]);
}
ajax({
type: 'post',
url: chunkurl,
data: fetchform,
processdata: false,
contenttype: false, // 注意这里应设为false
error: function (xhr) {
error && error({ state: 0, msg: "http error" });
},
success: function (responsedata) {
var tipsinfo = responsedata;
if (tipsinfo.state == 1) {
progressfun(responsedata);
successallcount++;
// 当分片上传完毕后
if (successallcount >= chunkinfo.chunkcount) {
if (chunkinfo.chunkcount == 1) {//分片只有一片时不要请求合并api,后端已经处理
progressfun(responsedata);
return;
}
else {
uploadfile(currentfile, successallcount);
}
}
else {
nextcallback && nextcallback();
}
}
else { //tipsinfo.state ==0
if (haserror == 0) {
haserror = 1;
}
error && error(responsedata);
}
}
});
};
readfilemd5(uploadingfile); // 开始执行代码
},
onchangeimageupload: function (file, filelist) { //-----------上传成功/失败,正在上传
//console.log("onchangeimageupload", file.status);
this.showuploadbthhandel();
this.updateimgsrc(filelist);
},
onlimitexceed: function (file, filelist) { //-----------超出上传个数
this.$message.error("最多只能上传" + this.limit + "个文件,请删除后再上传!");
},
beforeupload: function (file) { //--------上传之前校验
//console.log("beforeupload",file)
var _this = this;
file.allowupload = false;
if (file.size == 0) {
_this.$message.error("对不起,零字节文件不能上传!");
return false;
}
if (!_this.validatesize(file) && _this.maxsize > 0) {
var msg = "文件大小不能超过" + (_this.maxsize / 1024).tofixed(2) + "mb!"
if (_this.maxsize < 1024) {
msg = "文件大小不能超过" + _this.maxsize + "kb!";
}
_this.$message.error(msg);
return false;
}
if (!_this.validateext(file)) {
_this.$message.error("只能上传" + _this.acceptext.join(",") + "格式文件!");
return false;
}
file.allowupload = true;
return true;
},
validatesize: function (file, resolve, reject) { //---验证大小
var issizem = file.size / 1024 < this.maxsize;
return issizem ? true : false
},
validateext: function (file, resolve, reject) { //---验证格式
var filename = file.name;
var indexstart = filename.lastindexof(".");
var indexend = filename.length;
var fileext = filename.substring(indexstart, indexend);//后缀名
var arrayaccept = this.accept;
if (arrayaccept == "*") {
return true;
}
if (!array.isarray(arrayaccept)) {
arrayaccept = arrayaccept.split(",");
this.acceptext = arrayaccept;
}
return arrayaccept.indexof(fileext.tolowercase()) >= 0;
},
uploadonprogress: function (event, file, filelist) {
this.progress = event.percent; //调用默认的进度条percentage
},
showuploadbthhandel: function () { //上传按钮显示和隐藏控制
this.hideupload = this.elementuifilelist.length >= this.limit && this.limit > 0;
//console.log(this.elementuifilelist)
//console.log(this.limit)
if (this.hideupload) {
this.uploadbtnstate = true;
}
else {
this.uploadbtnstate = false;
}
}
},
created: function () {
if (this.limit > 1 || this.limit === 0) {
this.multiple = true;
}
},
mounted: function () {
if (this.limit > 1 || this.limit === 0) {
this.columndrop();
}
},
watch: {
filelist: {
handler: function (newval, oldval) {
if (this.watchfilelist) {
if (!equals(newval, oldval)) { //二次判断,避免组件之间互相影响
this.elementuifilelist = this.formatfilelist(newval, this.value);
this.showuploadbthhandel();
this.updateimgsrc(this.elementuifilelist);
}
} else {
this.watchfilelist = true;
}
},
immediate: true
}
, value: {
handler: function (newval, oldval) {
if (this.watchvalue) {
if (!equals(newval, oldval)) {//二次判断,避免组件之间互相影响
this.elementuifilelist = this.formatfilelist(this.filelist, newval);
this.showuploadbthhandel();
}
} else {
this.watchvalue = true;
}
},
immediate: true
}
}
}
//带缩约图显示
vue.component('ui-picture-upload', {
template: "" +
"" +
"
" +
"
" +
"
" +
"
" +
"
" +
"
" +
"
" +
"
",
mixins: [_uploadmixinsdata_],
})
//不带缩约图
vue.component('ui-file-upload', {
template: "" +
"{{btntxt}}" +
"
",
mixins: [_uploadmixinsdata_],
})
//tag标签
vue.component('ui-tag', {
template: "{{item}}" +
"" +
"{{buttontext}}",
data: function () {
return {
inputvisible: false,
inputvalue: '',
datalist: [],
}
},
props: {
value: { //-----------数据源
type: array | string,
default: []
},
closable: { //-------是否有关闭
type: boolean,
default: true
},
type: { //------------类型success/info/warning/danger
type: string,
default: ''
},
disabletransitions: { //------是否关闭动画
type: boolean,
default: false
},
hit: { //-----------是否有边框描边
type: boolean,
default: false
},
color: {//----------------背景色
type: string,
default: ''
},
size: { //------------尺寸medium / small / mini
type: string,
default: ''
},
effect: {//-----------主题dark / light / plain
type: string,
default: 'light'
},
buttontext: { //------------按钮文本
type: string,
default: '+添加'
},
returntype: {
type: string | array,
default: ''
}
},
created: function () {
this.handleinit(this.value);
},
methods: {
handleinit: function (model) {
//如果数据源不是数组则转换为数组
var _this = this;
var midlist;
if (model == undefined || model == null || model == "") {
midlist = [];
}
else if (!array.isarray(model)) {
midlist = model.split(',')
}
else {
midlist = model;
}
this.datalist.splice(0, this.datalist.length);
for (var i = 0; i < midlist.length; i++) {
var item = midlist[i];
if (!isnullorempty(item)) {
_this.datalist.push(item);
}
}
},
handleupdate: function (model) {
//当v-model更改后,通过此方法更新
this.handleinit(model);
this.returntypeflag(this.datalist);
},
handleclose: function (val) {
this.datalist.splice(this.datalist.indexof(val), 1);
this.returntypeflag(this.datalist)
},
handleclick: function (val) {
},
returntypeflag: function (datalist) {
//如果传递的v-model是数组,则返回数组,反之则返回逗号隔开的字符串
if (array.isarray(this.value)) {
this.$emit('input', datalist)
}
else {
this.$emit('input', datalist.join(","))
}
},
handleinputconfirm: function () {
var inputvalue = this.inputvalue;
if (inputvalue) {
this.datalist.push(inputvalue);
}
this.inputvisible = false;
this.inputvalue = '';
this.returntypeflag(this.datalist)
},
showinput: function () {
this.inputvisible = true;
//dom节点渲染完毕后执行
this.$nexttick(function () {
this.$refs.savetaginput.$refs.input.focus();
});
}
}
})
//级联共有属性
var _cascaderminix_ = {
data: function () {
return {
timer: null,
key: 0,
optionsmiddlelist: this.options, //optionslist的中间桥梁数据
selectedmiddlemodel: this.value,//selectedmodel的中间桥梁数据,频繁给selectedmodel赋值会频繁触发watch出现未知错误。
optionslist: this.options,
selectedmodel: this.value,
canupdate: true,//是否触发更新
watchvalue: true,
watchoptions: true,
cascaderkey: 0,
cascaderprops: this.props,//传递给el-cascader的props
}
},
props: {
options: { //----------数据源
type: array,
default: function () {
return [];
}
},
optionsurl: { //----------数据源请求地址,options和optionsurl只能定义一个
type: string,
default: ""
},
clearable: { //--------------输入框可清空
type: boolean,
default: true
},
props: {
type: object,
default: function () {
return {
expandtrigger: 'hover',
multiple: false,
label: 'label',
value: 'value',
remark: "",
children: "children"
}
}
},
value: { //----------默认选中值
type: string | number,
default: ''
},
placeholder: { //-----提示
type: string,
default: '请选择'
},
disabled: { //------是否禁用
type: boolean,
default: false
},
size: {
type: string,
default: ''
},
collapsetags: { //------多选情况下是否折叠
type: boolean,
default: false
}
},
methods: {
init: function () {
var _this = this;
_this.key = new date().gettime();
_this.formatoptions();
_this.formatvalue();//对数据进行转换
_this.loadoptions(_this.selectedmodel, _this.optionsurl);
_this.cascaderprops = deepcopy(_this.props);//深复制
_this.cascaderprops.label = "label";
_this.cascaderprops.value = "value";
_this.cascaderprops.children = "children";
},
formatoptions: function () {//格式化optionslist属性
var _this = this;
var props = _this.props;
props = extend({ label: "label", value: "value", remark: "", children: "children" }, props);
var lablefield = props.label; //label字段
var valuefield = props.value; //value字段
var remarkfield = props.remark; //remark字段
var optionslist = _this.optionsmiddlelist;
if (isnullorempty(optionslist)) {
optionslist = [];
}
if (!array.isarray(optionslist)) {
optionslist = [optionslist];
}
//对options数据进行格式化
optionslist.remove(function (item) { return isnullorempty(item) }); //移除空项目
optionslist.foreach(function (optionsitem, idx) {
if (typeof (optionsitem) == "string") //options是字符数组
{
optionslist[idx] = { label: optionsitem, value: optionsitem };
}
else {
if (!optionsitem.hasownproperty("label") && !isnullorempty(lablefield)) {
if (optionsitem.hasownproperty(lablefield)) {
optionsitem["label"] = optionsitem[lablefield];
}
else {
optionsitem["label"] = "props属性中未定义label属性";
}
}
if (!optionsitem.hasownproperty("value") && !isnullorempty(valuefield)) {
if (optionsitem.hasownproperty(valuefield)) {
optionsitem["value"] = optionsitem[valuefield];
} else {
optionsitem["value"] = 0;
}
}
if (!optionsitem.hasownproperty("remark") && !isnullorempty(remarkfield)) {
optionsitem["remark"] = optionsitem[remarkfield];
}
}
});
_this.optionslist = optionslist;
},
formatvalue: function () {//格式化v-model对应的value,以符合emement-ui的格式
var _this = this;
var selectedmodel = _this.selectedmiddlemodel;
var optionsnew = deepcopy(_this.optionslist);
//定义递归查找函数
function findvalueformoptions(options, value, emptyarray, selectedvaluearraynew, currentlevel) {
var findedsuccess = false;
for (var i = 0; i < options.length; i++) {
var item = options[i];
var parentvalue = item.parentvalue;
var itemvalue = item.value;
if (parentvalue == 0) {//重新从第一级开始找,清空arrayname。
emptyarray = [];
currentlevel = 0;
}
if (i == 0) {//循环的第一个
emptyarray.push(itemvalue)
} else {
emptyarray.splice(currentlevel, emptyarray.length - currentlevel, itemvalue); //从当前级别重新添加
}
var children = item.children;
if (itemvalue.tostring() == value.tostring()) {
selectedvaluearraynew.push(emptyarray);//复制避免互相影响
findedsuccess = true;
return true; //找到了返回,不需要再次循环查找
}
else if (array.isarray(children)) {
var thelevel = currentlevel + 1;
findedsuccess = findvalueformoptions(children, value, emptyarray, selectedvaluearraynew, thelevel);
if (findedsuccess) {
return true;
}
}
}
return findedsuccess;
}
//开发对数据进行转换
var selectedvaluearray = [];
if (array.isarray(selectedmodel)) {
selectedvaluearray = selectedmodel;
}
else if (typeof (selectedmodel) == "string") {
selectedvaluearray = selectedmodel.split(",");
}
else if (typeof (selectedmodel) == "number") {
selectedvaluearray.push(selectedmodel);
}
var selectedvaluearraynew = [];//转换为适合element-ui的格式
selectedvaluearray.foreach(function (item, index) {
findvalueformoptions(optionsnew, item, [], selectedvaluearraynew, 0);
});
if (_this.props.multiple) {
_this.selectedmodel = deepcopy(selectedvaluearraynew);
}
else {
if (selectedvaluearraynew.length > 0) {
_this.selectedmodel = selectedvaluearraynew[0];
}
else {
_this.selectedmodel = "";
}
}
},
updatemodelvalue: function (val) { //更新父级v-mode对应的value
var data = val
var selectedval;
if (this.props.multiple) {
if (array.isarray(this.value)) {
selectedval = [];
val.foreach(function (item, inx) {
selectedval.push(item[item.length - 1]);
});
} else {
selectedval = ''
val.foreach(function (item, inx) {
item.foreach(function (itemval, index) {
if (inx == val.length - 1) {
if (index == item.length - 1) {
selectedval += itemval
return
}
}
else {
if (inx != val.length - 1) {
if (index == item.length - 1) {
selectedval += itemval + ','
return
}
}
else {
if (index == item.length - 1) {
selectedval += itemval
return
}
}
}
})
})
}
}
else {
if (val.length == 0) {
selectedval = ''
}
else {
selectedval = val[val.length - 1]
}
}
this.$emit('input', selectedval);
this.$emit('change', selectedval);
this.watchvalue = false;
this.watchoptions = false;
},
loadoptions: function (selectedvalue, optionsurl) { //ajax 根据optionsurl地址获取选项数据
var _this = this;
var value = selectedvalue;
if (isnullorempty(value)) {
value = "";
} else if (array.isarray(value)) {
value = value.join(",");
}
if (!isnullorempty(optionsurl)) {
var props = extend({ value: value, label: "label", value: "value", remark: "" }, _this.props);
_this.ajax({
url: optionsurl,
data: { value: value, valuefield: props.value, labelfield: props.label },
success: function (responsedata) {
if (isnullorempty(responsedata)) {
responsedata = [];
}
_this.optionsmiddlelist = responsedata;
_this.formatoptions();//格式化选项
_this.formatvalue();//格式化数据
}
});
}
},
},
watch: {
options: {//监听options属性
handler: function (newval, oldval) {
//console.log("options-----改变")
var _this = this;
if (!equals(newval, oldval)) { //判断,避免object数据被父级组件变动影响
_this.optionsmiddlelist = newval;
if (isnullorempty(_this.optionsmiddlelist)) {
_this.optionsmiddlelist = [];
}
if (_this.timer != null) {
cleartimeout(_this.timer);
}
_this.timer = settimeout(function () { _this.init(); }, 100);//延迟执行,避免两个属性同时改变触发连多次
}
},
immediate: true,
},
value: { //监听value属性
handler: function (newval, oldval) {
//console.log("value-----改变")
var _this = this;
if (!_this.watchvalue) {//从内部触发的不监听,避免死循环
_this.watchvalue = true;
return;
}
if (!equals(newval, oldval)) {
_this.selectedmiddlemodel = newval;
if (isnullorempty(_this.selectedmiddlemodel)) {
_this.selectedmiddlemodel = [];
}
if (_this.timer != null) {
cleartimeout(_this.timer);
}
_this.timer = settimeout(function () { _this.init(); }, 100); //延迟执行,避免两个属性同时改变触发连多次
}
},
immediate: true,
},
},
}
// 级联多选单选
vue.component('ui-cascader', {
template: "",
mixins: [_cascaderminix_]
})
// 级联面板多选单选
vue.component('ui-cascader-panel', {
template: "",
mixins: [_cascaderminix_]
})
//下拉菜单,单选,多选共用
//-----公用属性方法
var _selectcheckbox_ = {
props: {
multiple: { //-----------true多选false单选
type: boolean,
default: false
},
clearable: { //--------------选择器清空,仅适用于单选
type: boolean,
default: true
},
filterable: { //
type: boolean,
default: false
},
options: { //选项,后期需要进行转换optionslist
type: array | object,
default: function () {
return [];
}
},
optionsurl: { // 获取options的地址。
type: string,
default: ""
},
size: {
type: string,
default: ''
},
value: { //------------默认选中
type: string | array | number,
default: function () {
return []
}
},
disabled: { //------------是否禁用
type: boolean,
default: false
},
multiplelimit: { //------------用户最多选择的个数,默认为0不限制
type: number,
default: 0
},
placeholder: { //----------------提示语句
type: string,
default: '请选择'
},
props: { //属性配置
type: object,
default: function () {
return { label: 'label', value: 'value', remark: "", children: "children", checkstrictly: false }
}
},
multiline: false, //v-model的值是否是采用换行分割。
data: {
type: object,
default: function () {
return {}
}
},
},
data: function () {
return {
key: 0, //prop options或value改变时同步修改key,重新渲染html
timer: null,//延迟定时器
ismultple: this.multiple,
optionsmiddlelist: [], //optionslist的中间桥梁
selectedmiddlemodel: "",//selectedmodel的中间桥梁数据
optionslist: [],
selectedmodel: "",
ispopup: false,//是否是弹出选择框
watchoptions: true, //是否监听options属性,避免内部改变时死循环
watchvalue: true,//是否监听value属性,避免组件内部改变时死循环
}
},
watch: {
value: { //监听value属性
handler: function (newval, oldval) {
//console.log("value 改变-------------");
var _this = this;
if (!_this.watchvalue) {
_this.watchvalue = true;
return;
}
if (!equals(newval, oldval)) { //判断是否相等,避免父级数据变动影响
_this.selectedmiddlemodel = newval;
if (isnullorempty(_this.selectedmiddlemodel)) {
_this.selectedmiddlemodel = "";
}
if (_this.timer != null) {
cleartimeout(_this.timer);
}
_this.timer = settimeout(function () { _this.init(); }, 100);//延迟执行,避免两个属性同时改变触发多次
}
},
immediate: true,
},
options: {//监听options属性
handler: function (newval, oldval) {
//console.log("options 改变-------------", newval, oldval, equals(newval, oldval));
var _this = this;
if (!equals(newval, oldval)) { //判断是否相等,避免父级数据变动影响
_this.optionsmiddlelist = newval;
if (isnullorempty(_this.optionsmiddlelist)) {
_this.optionsmiddlelist = [];
}
if (_this.timer != null) {
cleartimeout(_this.timer);
}
_this.timer = settimeout(function () { _this.init(); }, 100);//延迟执行,避免两个属性同时改变触发多次
}
},
immediate: true,
},
},
methods: {
init: function () {//初始化
var _this = this;
_this.key = new date().gettime();
if (_this.$options._componenttag && _this.$options._componenttag == "ui-select") {
_this.getoptionsslot();//导入select的自定义options
}
_this.formatoptions();//对选项进行格式化,兼容element格式
_this.formatvalue();//对数据进行转换
if (_this.ispopup) {//弹出选择器
if (!isnullorempty(_this.value)) {
if (array.isarray(_this.value) && _this.value.length == 0) {
return;
}
_this.loadoptions(_this.value, _this.optionsurl);
}
} else {
_this.loadoptions("", _this.optionsurl);
}
},
formatoptions: function () {//格式化optionslist属性
var _this = this;
var props = _this.props;
props = extend({ label: "label", value: "value", remark: "" }, props);
var lablefield = props.label; //label字段
var valuefield = props.value; //value字段
var remarkfield = props.remark; //remark字段
var optionslist = _this.optionsmiddlelist;
if (isnullorempty(optionslist)) {
optionslist = [];
}
if (!array.isarray(optionslist)) {
optionslist = [optionslist];
}
//对options数据进行格式化
optionslist.remove(function (item) { return isnullorempty(item) }); //移除空项目
optionslist.foreach(function (optionsitem, idx) {
if (typeof (optionsitem) == "string") //options是字符数组
{
optionslist[idx] = { label: optionsitem, value: optionsitem };
}
else {
if (!optionsitem.hasownproperty("label") && !isnullorempty(lablefield)) {
if (optionsitem.hasownproperty(lablefield)) {
optionsitem["label"] = optionsitem[lablefield];
}
else {
optionsitem["label"] = "props中未定义label属性";
}
}
if (!optionsitem.hasownproperty("value") && !isnullorempty(valuefield)) {
if (optionsitem.hasownproperty(valuefield)) {
optionsitem["value"] = optionsitem[valuefield];
} else {
optionsitem["value"] = 0;
}
}
if (!optionsitem.hasownproperty("remark") && !isnullorempty(remarkfield)) {
optionsitem["remark"] = optionsitem[remarkfield];
}
}
});
_this.optionslist = optionslist;
},
formatvalue: function () {//格式化v-model中的value数据
var _this = this;
var newmodel = [];//转换后的值,
var midmodel = _this.selectedmiddlemodel;
if (this.ismultple) {
if (isnullorempty(midmodel)) {
midmodel = [];
}
else if (typeof midmodel == 'object' || typeof midmodel == 'array') {
}
else {
if (_this.multiline) {
midmodel = midmodel.tostring().split(/[(\r\n)\r\n]+/);
} else {
midmodel = midmodel.tostring().split(',');
}
}
midmodel.foreach(function (val) {
_this.optionslist.foreach(function (item) {
if (item.value.tostring() == val.tostring()) {
newmodel.push(item.value)
}
})
})
}
else {
newmodel = "";
var thisvalue = midmodel;
if (isnullorempty(thisvalue)) {
thisvalue = "";
}
_this.optionslist.foreach(function (item) {
if (item.value.tostring() == thisvalue.tostring()) {
newmodel = item.value
}
})
}
_this.selectedmodel = newmodel;
},
updatemodelvalue: function (selectedtext) { //更新父级的v-model
var _this = this;
var selected = [];
if (_this.ismultple) {
if (!array.isarray(selectedtext)) {
if (isnullorempty(selectedtext)) {
selected = [];
}
else if (typeof (selectedtext) == "string") {
if (_this.multiline) {
selected = selectedtext.split(/[(\r\n)\r\n]+/);
}
else {
selected = selectedtext.split(",");
}
}
else {
selected.push(selectedtext);
}
}
else {
selected = selectedtext;
//console.log(selected)
}
}
else {
if (array.isarray(selectedtext)) {
if (selectedtext.length > 0) {
selected = selectedtext[0];
} else {
selected = "";
}
} else {
selected = selectedtext;
}
}
if (_this.ismultple && !array.isarray(_this.value)) {
//如果传递过来的v-model不是数组,那么就转为逗号隔开的字符串传回去。
if (typeof (this.value) == "number") {
selected = parseint(selected);
}
else {
if (_this.multiline) {
selected = selected.join("\r\n");
} else {
selected = selected.join();
}
}
}
this.$emit('input', selected) //----------回调父级的方法,改变v-model的值
this.$emit('change', selected) //----------回调父级的方法
this.watchoptions = false;
this.watchvalue = false;//从内到外的更新就暂停监听value,避免死循环
},
loadoptions: function (selectedvalue, optionsurl) { //ajax 根据optionsurl地址获取选项数据
var _this = this;
var value = selectedvalue;
if (isnullorempty(value)) {
value = "";
} else if (array.isarray(value)) {
value = value.join(",");
}
if (!isnullorempty(optionsurl)) {
var props = extend({ label: "label", value: "value", remark: "" }, _this.props);
var serverdata = extend({ value: value, valuefield: props.value, labelfield: props.label }, _this.data);
_this.ajax({
url: optionsurl,
data: serverdata,
success: function (responsedata) {
if (isnullorempty(responsedata)) {
responsedata = [];
};
if (!array.isarray(responsedata)) {
_this.optionsmiddlelist = [responsedata];
} else {
_this.optionsmiddlelist = responsedata;
}
_this.formatoptions();//对选项进行格式化,兼容element格式
_this.formatvalue();//对数据进行转换
}
});
}
},
}
}
//单选框
vue.component('ui-radio', {
template: "" +
"" +
"{{item.label}}",
mixins: [_selectcheckbox_],
props: {
multple: false, //重写属性
border: {
type: boolean,
default: false
},
size: {
type: string,
default: 'mini'
}
}
})
//下拉表单
vue.component('ui-select', {
template: "" +
"" +
"",
mixins: [_selectcheckbox_],
props: {
collapsetags: {//多选是否把标签收缩起来
type: boolean,
default: true
},
width: {
type: string,
default: 'auto'
}
},
methods: {
getoptionsslot: function () {
var _this = this;
//console.log(this.$slots.default);
if (this.$slots.default != undefined) {
this.$slots.default.foreach(function (item) {
if (item.data != undefined) {
_this.optionsmiddlelist.push(item.componentoptions.propsdata)
}
})
}
},
},
mounted: function () {
//如果值不存在选项中,则构造一个选项出来,否则下拉中会直接显示数字
var _this = this;
if (!this.multiple) {
if (_this.optionslist.findindex(function (item) { return item.value.tostring() == _this.selectedmodel.tostring() }) < 0) {
_this.selectedmodel = "";
//_this.updatemodelvalue("");
}
}
},
});
//多选框
vue.component('ui-checkbox', {
template: "" +
"{{item.label}}",
mixins: [_selectcheckbox_],
props: {
multiple: { //重写属性
type: boolean,
default: true
},
min: "",
max: "",
},
})
//数据选择框,配合ui-select-popup使用
vue.component('ui-select-popup-data', {
template: '\
\
\
\
\
\
\
\
搜索\
\
\
\
\
{{thtitle}}\
\
\
{{ scope.row.label }}{{scope.row.remark }}\
{{scope.row.label}}{{scope.row.remark}}\
\
\
\
\
\
确定\
关闭\
\
\
',
props: {
title: { //--------标题
type: string,
default: ''
},
width: {
type: string,//-------宽度
default: '50%'
},
value: { //------------默认选中值
type: array | string | number,
default: function () {
return [];
}
},
url: { //-----------api地址
type: string,
default: ''
},
height: { //-----------高度
type: string,
default: 'auto'
},
pageinfo: {
type: object,
default: function () {
return {}
}
},
multiple: {
type: boolean,
default: true
},
thtitle: {
type: string,
default: '标题'
},
datasource: {
type: array,
default: function () {
return [];
}
},
props: { //属性配置
type: object,
default: function () {
return { label: 'label', value: 'value', remark: "", children: "children", checkstrictly: false, showsearch: true }
}
}
},
data: function () {
return {
tabledata: [],
selectlist: [],
pageinfos: this.pageinfo,
showpagepanel: true,
showsearch: true,
classify: [],//分类
searchinfo: { keyword: "" },
loading: true,
dialogvisible: false,
selectionchangeflg: true,
newvalue: [],
cascaderkey: "",
}
},
methods: {
classifychange: function () {//分类改变
this.loaddata();
},
formatdatalist: function (datalist) { //对数据列表进行格式化,并设置对应属性
var _this = this;
var props = _this.props;
props = extend({ label: "label", value: "value", remark: "", children: "children", only: false, showsearch: true }, props);
var lablefield = props.label; //label字段
var valuefield = props.value; //value字段
var remarkfield = props.remark; //remark字段
var childrenfield = props.children;
var parentoptions = _this.$parent.optionslist; //获取父级下拉数据
var checkstrictly = props.checkstrictly;
_this.showsearch = props.showsearch;//控制搜索是否显示
function formatdatalist(list, parentlabel) { //对options数据进行格式化
list.foreach(function (optionsitem) {
if (!optionsitem.hasownproperty("label") && !isnullorempty(lablefield)) {
optionsitem["label"] = optionsitem[lablefield];
}
if (parentlabel != undefined) {
optionsitem["nodepath"] = parentlabel + ">" + optionsitem["label"];
} else {
optionsitem["nodepath"] = optionsitem["label"];
}
if (!optionsitem.hasownproperty("value") && !isnullorempty(valuefield)) {
optionsitem["value"] = optionsitem[valuefield];
}
if (!optionsitem.hasownproperty("remark") && !isnullorempty(remarkfield)) {
optionsitem["remark"] = optionsitem[remarkfield];
}
if (!optionsitem.hasownproperty("children") && !isnullorempty(childrenfield)) {
optionsitem["children"] = optionsitem[childrenfield];
}
var rowvalue = optionsitem["value"];
var idx = parentoptions.findindex(function (item) { return item.value.tostring() == rowvalue.tostring() });
if (idx >= 0) {
optionsitem.checked = true;
}
else {
optionsitem.checked = false;
}
var children = optionsitem["children"];
if (array.isarray(children)) {
if (checkstrictly == false) {
optionsitem.disabled = true;
}
formatdatalist(children, optionsitem["nodepath"]); //递归设置
}
});
}
if (array.isarray(datalist)) {
formatdatalist(datalist);
}
},
getrowkey: function (row) {
var props = this.props;
props = extend({ label: "label", value: "value" }, props);
return row["value"] || row[props.value];
},
loadclassify: function (responsedata) {
var _this = this;
if (_this.classify.length > 0) //获取分类,只执行一次
{
return;
}
_this.classify = responsedata.classify;
if (_this.classify == null || _this.classify == undefined) {
_this.classify = [];
}
else {
//构造v-model
_this.classify.foreach(function (item) {
item.model = "";
});
}
},
loaddata: function (callbacks) { //---------api
var _this = this;
var searchinfos = { label: '' }
var props = this.props;
props = extend({ label: "label", value: "value" }, props);
searchinfos[props.label] = _this.searchinfo.keyword;
var serverdata = extend(_this.$parent.data, searchinfos, _this.pageinfos);
//构造分类搜索
this.classify.foreach(function (item) {
serverdata[item.field] = item.model;
});
_this.ajax({
url: _this.url,
data: serverdata,
success: function (responsedata) {
if (!isnullorempty(responsedata)) {
var datalist;
if (array.isarray(responsedata)) {
datalist = responsedata;
} else if (array.isarray(responsedata.data)) {
datalist = responsedata.data;
}
if (!isnullorempty(responsedata.pageinfo)) {
_this.pageinfos = responsedata.pageinfo;
} else {
_this.showpagepanel = false;
}
_this.formatdatalist(datalist)
_this.tabledata = datalist;
_this.loading = false;
_this.loadclassify(responsedata);//加载分类
}
if (callbacks != undefined && typeof callbacks != 'object') {
callbacks()
}
}
});
},
loaddatasource: function () {//加载自定义数据源
var _this = this;
var datasource = json.parse(json.stringify(_this.datasource));
_this.formatdatalist(datasource);
_this.tabledata = datasource;
_this.loading = false;
_this.showpagepanel = false;
_this.showsearch = false;
},
checkedhandel: function (rows) { //点击选项触发
if (!this.multiple) {
function singlecheck(list) {
list.foreach(function (item) {
if (item.value.tostring() !== rows.value.tostring()) {
item.checked = false;
}
if (array.isarray(item.children)) {
singlecheck(item.children);
}
});
}
singlecheck(this.tabledata);
}
},
inits: function () { //----------打开窗口时执行回调
var _this = this;
var selectedmodel = deepcopy(this.$parent.selectedmodel);
if (_this.multiple) {
if (isnullorempty(selectedmodel)) {
selectedmodel = [];
} else if (array.isarray(selectedmodel)) {
_this.newvalue = selectedmodel;
} else {
selectedmodel = [];
}
}
else {
_this.newvalue[0] = selectedmodel;
}
if (array.isarray(_this.datasource) && _this.datasource.length > 0) {
_this.loaddatasource();
} else {
this.pageinfos = this.pageinfo;
this.loaddata(function () {
settimeout(function () {
}, 0);
});
}
},
confirmselect: function () { //--------确定按钮触发
var _this = this;
var options = json.parse(json.stringify(_this.$parent.optionslist));
var selectedvalue = [];
if (this.multiple) {
selectedvalue = _this.newvalue;
}
//console.log(selectedvalue);
function getselected(datalist) {
datalist.foreach(function (item) {
if (item.checked) {
selectedvalue.remove(function (selectedvalue) {
return selectedvalue.tostring() == item.value.tostring();
});
selectedvalue.push(item.value);
if (_this.multiple) {
options.remove(function (optionsitem) {
return optionsitem.value.tostring() == item.value.tostring();
});
}
else {
options.splice(0, options.length);
}
if (!isnullorempty(item.nodepath)) {
item.label = item.nodepath;
}
options.push(item);
}
else {
selectedvalue.remove(function (selectedvalue) {
return selectedvalue.tostring() == item.value.tostring();
});
options.remove(function (optionsitem) {
return optionsitem.value.tostring() == item.value.tostring();
});
}
var children = item["children"];
if (array.isarray(children)) {
getselected(children); //递归设置
}
});
}
getselected(this.tabledata);
if (this.multiple) {
}
else {
if (array.isarray(selectedvalue)) {
if (selectedvalue.length > 0) {
selectedvalue = selectedvalue[0];
} else {
selectedvalue = "";
}
}
}
_this.$emit('updateoptions', { options: options, selectedvalue: selectedvalue });//更新tagoptions
_this.$emit('input', selectedvalue)
_this.$emit('updatemodelvalue', selectedvalue);
_this.closeself();
},
closeself: function () { //------取消
this.dialogvisible = false
}
}
})
//弹出选择器
vue.component('ui-select-popup', {
template: '\
\
{{tagitem.label}}\
\
{{btntitle}}\
\
',
mixins: [_selectcheckbox_],
props: {
optionsurl: { //选中后转换的url,不设置则默认使用value和label对象,设置后将传递value参数到请求的url中获取
type: string,
default: ""
},
selectwidth: { //------下拉宽度
type: string,
default: '100%'
},
btntitle: { //-------按钮标题
type: string,
default: '选择'
},
title: { //----------顶部标题
type: string,
default: '选择界面'
},
url: { //---------数据源的地址
type: string,
default: ''
},
width: { //-----------对话框宽度
type: string,
default: '50%'
},
height: { //-----------对话框高度
type: string,
default: 'auto'
},
pageinfo: {
type: object,
default: function () {
return {}
}
},
collapsetags: {
type: boolean,
default: true
},
thtitle: {
type: string,
default: '选择'
},
datasource: {
type: array,
default: function () {
return [];
}
},
},
data: function () {
return {
ispopup: true, //重写data属性
dialogvisable: false,//---------显示对话框
serverdata: this.data, //额外需要带到服务器端的参数对象
}
},
watch: {
data: {//监听options属性
handler: function (newval, oldval) {
this.serverdata = newval;
},
immediate: false,
},
},
methods: {
opendialog: function () {
this.$refs.popupdialog.dialogvisible = true;
},
removetag: function (tagvalue) {
var _this = this;
var optionslist = deepcopy(_this.optionslist);
optionslist.remove(function (item) { return item.value.tostring() == tagvalue.tostring() });
var remainvalue = [];
optionslist.foreach(function (item) {
remainvalue.push(item.value);
});
_this.optionsmiddlelist = optionslist;
_this.selectedmiddlevalue = remainvalue;
_this.formatoptions();//格式化选项
_this.formatvalue();//格式化数据
_this.updatemodelvalue(remainvalue);//更新value
},
updateoptions: function (obj) { //弹出窗口选择后调用
var _this = this;
var newoptions = obj.options;
var selectedvalue = obj.selectedvalue;
if (isnullorempty(_this.optionsurl)) { //optionsurl未设置有效。
var _this = this;
_this.optionsmiddlelist = newoptions;
_this.formatoptions();//格式化选项
}
else {
_this.loadoptions(selectedvalue, _this.optionsurl);
}
},
}
})
//发送验证码
vue.component('ui-input-code', {
template: "\
{{btntitlenews}} \
",
data: function () {
return {
modeltext: '',
parameter: {},//--------api参数
sendcodeflag: true,//-------是否可以发送
btntitlenews: '',
delaysize: 120,//-----延迟秒数
btnloading: false,
}
},
created: function () {
this.modeltext = this.value;
this.btntitlenews = this.btntitle
},
props: {
placeholder: {
type: string,
default: '请输入验证码'
},
value: {
type: string,
default: ''
},
focustarget: {
type: string,
default: ''
},
btntitle: {
type: string,
default: '获取验证码'
},
type: {
type: string,
default: 'email'
},
urlapi: {
type: string, //---------获取发送api
default: '/e/smscode/send'
},
urlcode: { //-------获取tokenapi
type: string,
default: "/e/codebase/send"
},
account: { //---------获取手机号/email账号
type: string,
default: ''
},
maxlength:
{
type: number,
default: 6
}
},
methods: {
sendcode: function () { //-发送验证码
if (this.sendcodeflag) {
var _this = this
var validationflag = this.validationtext();
if (validationflag) {
this.sendcodeflag = false
this.btnloading = true
this.calltoken(function () {
_this.callapi(_this.type)
})
}
}
},
changecode: function (val) {//-------back-value
this.$emit('input', val)
},
calltoken: function (callbacks) { //----------获取token
var _this = this
_this.ajax({
url: _this.urlcode,
data: {},
async: true,
success: function (responsedata) {
_this.parameter.token = responsedata.token;
callbacks()
},
error: function () {
settimeout(function () {
_this.sendcodeflag = true
_this.btnloading = false
}, 1000)
_this.$message.error('接口调用失败。请联系开发人员');
}
});
},
timingdelay: function () { //--------定时器
var _this = this
var seconds = _this.delaysize;
var time = setinterval(function () {
if (seconds == _this.delaysize) {
_this.btnloading = false;
}
if (seconds <= 0) {
clearinterval(time)
_this.btntitlenews = _this.btntitle
_this.sendcodeflag = true
return;
}
_this.btntitlenews = seconds + '秒'
--seconds;
}, 1000)
},
callapi: function (type) { //------调用api
var _this = this
if (type == 'email') {
this.parameter.email = this.account;
}
else {
this.parameter.mobile = this.account;
}
_this.ajax({
url: _this.urlapi,
type: "post",
data: _this.parameter,
success: function (responsedata) {
if (responsedata.state == 1) {
_this.timingdelay()
}
else {
settimeout(function () {
_this.btnloading = false
_this.sendcodeflag = true
_this.$message.error(responsedata.msg);
}, 1000)
}
},
error: function () {
_this.btnloading = false
_this.sendcodeflag = true
//_this.$message.error(responsedata.msg);
}
});
},
focus: function () { //提示后获取焦点
var focustarget = this.focustarget;
if (focustarget == "") {
return;
}
var focustarget = document.queryselector(focustarget);
if (focustarget != null) {
focustarget.focus();
}
},
validationtext: function () { //----------验证文本
if (this.type == 'email') {
if (this.account == '' || this.account == null) {
this.focus();
this.$message.error('请填写邮箱账号!')
return false
}
var emailflag = isemail(this.account);
if (!emailflag) {
this.focus();
this.$message.error("邮箱账号填写错误,请重新填写!");
return false;
}
else {
return true;
}
}
if (this.type == 'mobile') {
if (this.account == '' || this.account == null) {
this.focus();
this.$message.error('请填写手机号码!')
return false
}
var mobileflag = ismobile(this.account);
if (!mobileflag) {
this.focus();
this.$message.error("手机号码填写错误,请重新填写!");
return false;
}
else {
return true;
}
}
}
}
})
//图标选择器
vue.component('icon-picker', {
template: '\
\
选择\
\
',
data: function () {
return {
iconlist: ["fa-address-book", "fa-address-book-o", "fa-address-card", "fa-address-card-o", "fa-adjust", "fa-american-sign-language-interpreting", "fa-anchor", "fa-archive", "fa-area-chart", "fa-arrows", "fa-arrows-h", "fa-arrows-v", "fa-asl-interpreting", "fa-assistive-listening-systems", "fa-asterisk", "fa-at", "fa-audio-description", "fa-automobile", "fa-balance-scale", "fa-ban", "fa-bank", "fa-bar-chart", "fa-bar-chart-o", "fa-barcode", "fa-bars", "fa-bath", "fa-bathtub", "fa-battery", "fa-battery-0", "fa-battery-1", "fa-battery-2", "fa-battery-3", "fa-battery-4", "fa-battery-empty", "fa-battery-full", "fa-battery-half", "fa-battery-quarter", "fa-battery-three-quarters", "fa-bed", "fa-beer", "fa-bell", "fa-bell-o", "fa-bell-slash", "fa-bell-slash-o", "fa-bicycle", "fa-binoculars", "fa-birthday-cake", "fa-blind", "fa-bluetooth", "fa-bluetooth-b", "fa-bolt", "fa-bomb", "fa-book", "fa-bookmark", "fa-bookmark-o", "fa-braille", "fa-briefcase", "fa-bug", "fa-building", "fa-building-o", "fa-bullhorn", "fa-bullseye", "fa-bus", "fa-cab", "fa-calculator", "fa-calendar", "fa-calendar-check-o", "fa-calendar-minus-o", "fa-calendar-o", "fa-calendar-plus-o", "fa-calendar-times-o", "fa-camera", "fa-camera-retro", "fa-car", "fa-caret-square-o-down", "fa-caret-square-o-left", "fa-caret-square-o-right", "fa-caret-square-o-up", "fa-cart-arrow-down", "fa-cart-plus", "fa-cc", "fa-certificate", "fa-check", "fa-check-circle", "fa-check-circle-o", "fa-check-square", "fa-check-square-o", "fa-child", "fa-circle", "fa-circle-o", "fa-circle-o-notch", "fa-circle-thin", "fa-clock-o", "fa-clone", "fa-close", "fa-cloud", "fa-cloud-download", "fa-cloud-upload", "fa-code", "fa-code-fork", "fa-coffee", "fa-cog", "fa-cogs", "fa-comment", "fa-comment-o", "fa-commenting", "fa-commenting-o", "fa-comments", "fa-comments-o", "fa-compass", "fa-copyright", "fa-creative-commons", "fa-credit-card", "fa-credit-card-alt", "fa-crop", "fa-crosshairs", "fa-cube", "fa-cubes", "fa-cutlery", "fa-dashboard", "fa-database", "fa-deaf", "fa-deafness", "fa-desktop", "fa-diamond", "fa-dot-circle-o", "fa-download", "fa-drivers-license", "fa-drivers-license-o", "fa-edit", "fa-ellipsis-h", "fa-ellipsis-v", "fa-envelope", "fa-envelope-o", "fa-envelope-open", "fa-envelope-open-o", "fa-envelope-square", "fa-eraser", "fa-exchange", "fa-exclamation", "fa-exclamation-circle", "fa-exclamation-triangle", "fa-external-link", "fa-external-link-square", "fa-eye", "fa-eye-slash", "fa-eyedropper", "fa-fax", "fa-feed", "fa-female", "fa-fighter-jet", "fa-file-archive-o", "fa-file-audio-o", "fa-file-code-o", "fa-file-excel-o", "fa-file-image-o", "fa-file-movie-o", "fa-file-pdf-o", "fa-file-photo-o", "fa-file-picture-o", "fa-file-powerpoint-o", "fa-file-sound-o", "fa-file-video-o", "fa-file-word-o", "fa-file-zip-o", "fa-film", "fa-filter", "fa-fire", "fa-fire-extinguisher", "fa-flag", "fa-flag-checkered", "fa-flag-o", "fa-flash", "fa-flask", "fa-folder", "fa-folder-o", "fa-folder-open", "fa-folder-open-o", "fa-frown-o", "fa-futbol-o", "fa-gamepad", "fa-gavel", "fa-gear", "fa-gears", "fa-gift", "fa-glass", "fa-globe", "fa-graduation-cap", "fa-group", "fa-hand-grab-o", "fa-hand-lizard-o", "fa-hand-paper-o", "fa-hand-peace-o", "fa-hand-pointer-o", "fa-hand-rock-o", "fa-hand-scissors-o", "fa-hand-spock-o", "fa-hand-stop-o", "fa-handshake-o", "fa-hard-of-hearing", "fa-hashtag", "fa-hdd-o", "fa-headphones", "fa-heart", "fa-heart-o", "fa-heartbeat", "fa-history", "fa-home", "fa-hotel", "fa-hourglass", "fa-hourglass-1", "fa-hourglass-2", "fa-hourglass-3", "fa-hourglass-end", "fa-hourglass-half", "fa-hourglass-o", "fa-hourglass-start", "fa-i-cursor", "fa-id-badge", "fa-id-card", "fa-id-card-o", "fa-image", "fa-inbox", "fa-industry", "fa-info", "fa-info-circle", "fa-institution", "fa-key", "fa-keyboard-o", "fa-language", "fa-laptop", "fa-leaf", "fa-legal", "fa-lemon-o", "fa-level-down", "fa-level-up", "fa-life-bouy", "fa-life-buoy", "fa-life-ring", "fa-life-saver", "fa-lightbulb-o", "fa-line-chart", "fa-location-arrow", "fa-lock", "fa-low-vision", "fa-magic", "fa-magnet", "fa-mail-forward", "fa-mail-reply", "fa-mail-reply-all", "fa-male", "fa-map", "fa-map-marker", "fa-map-o", "fa-map-pin", "fa-map-signs", "fa-meh-o", "fa-microchip", "fa-microphone", "fa-microphone-slash", "fa-minus", "fa-minus-circle", "fa-minus-square", "fa-minus-square-o", "fa-mobile", "fa-mobile-phone", "fa-money", "fa-moon-o", "fa-mortar-board", "fa-motorcycle", "fa-mouse-pointer", "fa-music", "fa-navicon", "fa-newspaper-o", "fa-object-group", "fa-object-ungroup", "fa-paint-brush", "fa-paper-plane", "fa-paper-plane-o", "fa-paw", "fa-pencil", "fa-pencil-square", "fa-pencil-square-o", "fa-percent", "fa-phone", "fa-phone-square", "fa-photo", "fa-picture-o", "fa-pie-chart", "fa-plane", "fa-plug", "fa-plus", "fa-plus-circle", "fa-plus-square", "fa-plus-square-o", "fa-podcast", "fa-power-off", "fa-print", "fa-puzzle-piece", "fa-qrcode", "fa-question", "fa-question-circle", "fa-question-circle-o", "fa-quote-left", "fa-quote-right", "fa-random", "fa-recycle", "fa-refresh", "fa-registered", "fa-remove", "fa-reorder", "fa-reply", "fa-reply-all", "fa-retweet", "fa-road", "fa-rocket", "fa-rss", "fa-rss-square", "fa-s15", "fa-search", "fa-search-minus", "fa-search-plus", "fa-send", "fa-send-o", "fa-server", "fa-share", "fa-share-alt", "fa-share-alt-square", "fa-share-square", "fa-share-square-o", "fa-shield", "fa-ship", "fa-shopping-bag", "fa-shopping-basket", "fa-shopping-cart", "fa-shower", "fa-sign-in", "fa-sign-language", "fa-sign-out", "fa-signal", "fa-signing", "fa-sitemap", "fa-sliders", "fa-smile-o", "fa-snowflake-o", "fa-soccer-ball-o", "fa-sort", "fa-sort-alpha-asc", "fa-sort-alpha-desc", "fa-sort-amount-asc", "fa-sort-amount-desc", "fa-sort-asc", "fa-sort-desc", "fa-sort-down", "fa-sort-numeric-asc", "fa-sort-numeric-desc", "fa-sort-up", "fa-space-shuttle", "fa-spinner", "fa-spoon", "fa-square", "fa-square-o", "fa-star", "fa-star-half", "fa-star-half-empty", "fa-star-half-full", "fa-star-half-o", "fa-star-o", "fa-sticky-note", "fa-sticky-note-o", "fa-street-view", "fa-suitcase", "fa-sun-o", "fa-support", "fa-tablet", "fa-tachometer", "fa-tag", "fa-tags", "fa-tasks", "fa-taxi", "fa-television", "fa-terminal", "fa-thermometer", "fa-thermometer-0", "fa-thermometer-1", "fa-thermometer-2", "fa-thermometer-3", "fa-thermometer-4", "fa-thermometer-empty", "fa-thermometer-full", "fa-thermometer-half", "fa-thermometer-quarter", "fa-thermometer-three-quarters", "fa-thumb-tack", "fa-thumbs-down", "fa-thumbs-o-down", "fa-thumbs-o-up", "fa-thumbs-up", "fa-ticket", "fa-times", "fa-times-circle", "fa-times-circle-o", "fa-times-rectangle", "fa-times-rectangle-o", "fa-tint", "fa-toggle-down", "fa-toggle-left", "fa-toggle-off", "fa-toggle-on", "fa-toggle-right", "fa-toggle-up", "fa-trademark", "fa-trash", "fa-trash-o", "fa-tree", "fa-trophy", "fa-truck", "fa-tty", "fa-tv", "fa-umbrella", "fa-universal-access", "fa-university", "fa-unlock", "fa-unlock-alt", "fa-unsorted", "fa-upload", "fa-user", "fa-user-circle", "fa-user-circle-o", "fa-user-o", "fa-user-plus", "fa-user-secret", "fa-user-times", "fa-users", "fa-vcard", "fa-vcard-o", "fa-video-camera", "fa-volume-control-phone", "fa-volume-down", "fa-volume-off", "fa-volume-up", "fa-warning", "fa-wheelchair", "fa-wheelchair-alt", "fa-wifi", "fa-window-close", "fa-window-close-o", "fa-window-maximize", "fa-window-minimize", "fa-window-restore", "fa-wrench"],
selectval: this.value,
dialogtablevisible: false,
}
},
props: {
value: {
type: string,
default: ""
},
},
computed: {
showpreview: function () //是否显示预览
{
return this.selectval != undefined && this.selectval != null && this.selectval != "";
},
},
methods: {
opendialog: function () {
this.dialogtablevisible = true;
},
setselected: function (iconname) //点击图标触发
{
if (iconname == undefined) {
iconname = "";
}
this.selectval = iconname;
this.$emit('input', iconname);
this.dialogtablevisible = false;
},
clearval: function () {
this.selectval = "";
this.$emit('input', "");
},
iconactive: function (iconname) {
if (iconname == undefined) {
iconname = "";
}
var _this = this;
if (iconname == _this.selectval) {
return { "color": "#409eff", "font-weight": "bold" };
}
},
iconclass: function (iconname) {
return [iconname];
},
}
});
//管理列表附件展示组件
vue.component('ui-list-attachment-display', {
template: '\
\
\
\
\
{{firstfile.name}}\
\
\
\
\
\
\
\
{{item.name}} \
\
\
\
\
\
\
\
\
{{item.name}}\
\
\
\
',
data: function () {
return {
imageloaded: false,//图片是否加载过
dialogvisible: false,//图片预览窗口
allfilelist: this.filelist,//所有图片
firstfile: [], //第一条记录
filelistwithoutfirst: [], //排除第一条记录的数组
onloadimageerror: "this.style.display='none'"
}
},
props: {
filelist: {//附件集合,格式[{name:'',url:''},{name:'',url:''}]
type: array,
default: function () {
return [];
}
},
displaytype: { //展示方式
type: string,
default: "file"
},
},
created: function () {
this.init();
},
computed: {
isimagelist: function () { //是否是图片类型附件
return this.displaytype == "image";
},
showfirst: function () {
return this.firstfile != undefined && this.firstfile.url != undefined && this.firstfile.url != undefined
},
showmore: function () {
return this.filelistwithoutfirst.length > 0;
}
},
methods: {
init: function () {
if (isnullorempty(this.allfilelist)) {
this.allfilelist = [];
}
if (this.allfilelist.length > 0) {
this.firstfile = this.allfilelist[0];
this.filelistwithoutfirst = this.allfilelist.slice(1);
}
},
loadimage: function (item) {
var img = new image();
img.src = item.url;
img.onload = function () {
item.url = img.src;
}
return item.url;
},
getthumbnail: function (file) { //获取缩略图路径
var thumbnail = file.thumbnail;
if (isnullorempty(thumbnail)) {
return file.url;
}
return thumbnail;
},
downfile: function (file) { //下载文件
var url = file.url;
var filename = file.name;
if (isimage(url)) { //图片直接打开
window.open(url, "_blank");
}
else {//其他格式直接下载
window.open("/e/download?file=" + urlencode(url) + "&name=" + urlencode(filename), "_blank");
}
},
openurl: function (file) {//打开文件。
var filename = file.name;
var url = file.url;
if (this.displaytype == "file") {
this.downfile(file);//非图片改为直接下载
}
else {
this.dialogvisible = true;
}
},
}
});
//自定义组件
vue.component('ui-script', {
template: "",
data: function () {
return {
istrue: false,
}
},
props: {
value: { //-----------数据源
type: array | string,
default: ""
},
src: { //js地址
type: array | string,
default: ""
},
componentname: { //组件名称
type: string,
default: ""
},
parameter: { //自定义json参数
type: object,
default: function () {
return {}
}
},
},
created: function () {
var _this = this;
var url = _this.src
if (url != undefined && url != null && url != "") {
var script = document.createelement("script");
script.type = "text/javascript";
script.src = url;
document.head.appendchild(script);
if (script.readystate) {
script.onreadystatechange = function () {
if (script.readystate == 'loaded' || script.readystate == 'complete') {
script.onreadystatechange = null;
_this.istrue = true;
}
};
} else {//其他浏览器
script.onload = function () {
_this.istrue = true;
};
}
}
},
methods: {
},
watch: {
value: {
handler: function (newval, oldval) {
this.$emit('input', newval)
},
immediate: true,
deep: true
},
},
})