Skip to content

o2oa
o2oa

ghsby / o2oa
落后 Fork 源项目 2880 个版本

Fork自 浙江兰德纵横网络技术股份有限公司 / o2oa

通知 1
Star 1
Fork 0
o2oa
o2oa

体验新版 GitCode，发现更多精彩内容 >>

提交 a4bb07d5 编写于 作者: 蔡 蔡祥熠
浏览文件
操作

Merge branch 'feature/form.element_colorpicker' into 'wrdp' 

Merge of feature/form.element_colorpicker 表单增加element颜色选择器 to wrdp

See merge request o2oa/o2oa!6357
上级 6aa691a9 99b0c85c
隐藏空白更改
内联 并排
Showing with 463 addition and 9 deletion
o2web/source/x_component_process_FormDesigner/$Main/bottom/tools-element.json
浏览文件 @ a4bb07d5
......@@ -79,6 +79,11 @@
"text": MWF.xApplication.process.FormDesigner.LP.modules.el_rate,
"className": "Elrate"
},
"elcolorpicker": {
"fontIcon": "el-icon-help",
"text": MWF.xApplication.process.FormDesigner.LP.modules.el_colorpicker,
"className": "Elcolorpicker"
},
"elcommon": {
"fontIcon": "el-icon-full-screen",
"text": MWF.xApplication.process.FormDesigner.LP.modules.el_common,
......
o2web/source/x_component_process_FormDesigner/$Main/default/tools-element.json
浏览文件 @ a4bb07d5
......@@ -79,6 +79,11 @@
"text": MWF.xApplication.process.FormDesigner.LP.modules.el_rate,
"className": "Elrate"
},
"elcolorpicker": {
"fontIcon": "el-icon-help",
"text": MWF.xApplication.process.FormDesigner.LP.modules.el_colorpicker,
"className": "Elcolorpicker"
},
"elcommon": {
"fontIcon": "el-icon-full-screen",
"text": MWF.xApplication.process.FormDesigner.LP.modules.el_common,
......
o2web/source/x_component_process_FormDesigner/Module/Elcolorpicker.js 0 → 100644
浏览文件 @ a4bb07d5
MWF.xApplication.process.FormDesigner.Module = MWF.xApplication.process.FormDesigner.Module || {};
MWF.xDesktop.requireApp("process.FormDesigner", "Module.$ElElement", null, false);
MWF.xApplication.process.FormDesigner.Module.Elcolorpicker = MWF.FCElcolorpicker = new Class({
Extends: MWF.FC$ElElement,
Implements: [Options, Events],
options: {
"style": "default",
"propertyPath": "../x_component_process_FormDesigner/Module/Elcolorpicker/elcolorpicker.html"
},
_initModuleType: function(){
this.className = "Elcolorpicker";
this.moduleType = "element";
this.moduleName = "elcolorpicker";
},
_createElementHtml: function(){
var html = "<el-color-picker";
html += " disabled";
html += " :readonly=\"isReadonly\"";
html += " :size=\"size\"";
if (this.json.elProperties){
Object.keys(this.json.elProperties).forEach(function(k){
if (this.json.elProperties[k]) html += " "+k+"=\""+this.json.elProperties[k]+"\"";
}, this);
}
html += " :style=\"elStyles\">";
if (this.json.vueSlot) html += this.json.vueSlot;
html += "</el-color-picker>";
return html;
},
_createCopyNode: function(){
this.copyNode = new Element("div", {
"styles": this.css.moduleNodeShow
});
this.copyNode.addEvent("selectstart", function(){
return false;
});
},
_getCopyNode: function(){
if (!this.copyNode) this._createCopyNode();
this.copyNode.setStyle("display", "inline-block");
return this.copyNode;
},
setPropertyName: function(){
// if (this.json.name){
// var input = this.node.getElement("input");
// if (input) input.set("value", this.json.name);
// }
},
setPropertyId: function(){
// if (!this.json.name){
// var input = this.node.getElement("input");
// if (input) input.set("value", this.json.id);
// }
}
});
o2web/source/x_component_process_FormDesigner/Module/Elcolorpicker/default/css.wcss 0 → 100644
浏览文件 @ a4bb07d5
{
"moduleNodeMove": {
"border-radius": "5px",
"border": "1px solid #ffa200",
"overflow": "hidden",
"margin": "3px",
"-webkit-user-select": "none",
"-moz-user-select": "none",
"position": "absolute",
"z-index": 10002,
"opacity": 0.7,
"cursor": "move",
"height": "26px",
"line-height": "26px",
"padding": "0 10px",
"display": "block"
},
"moduleNodeShow": {
"border": "1px solid #333",
"margin": "3px",
"-webkit-user-select": "none",
"-moz-user-select": "none",
"position": "static",
"top": "auto",
"left": "auto",
"width": "18px",
"height": "2px",
"opacity": 0.5,
"display": "inline-block",
"background": "#ffa200"
},
"moduleNode": {
"border-radius": "5px",
"border-top": "1px dashed #999",
"border-left": "1px dashed #999",
"border-right": "1px dashed #999",
"border-bottom": "1px dashed #999",
"overflow": "hidden",
"cursor": "pointer",
"margin": "3px",
"-webkit-user-select": "none",
"-moz-user-select": "none",
"position": "static",
"top": "auto",
"left": "auto",
"opacity": 1,
"display": "inline-block"
},
"moduleNodeError": {
"border-radius": "5px",
"border-top": "1px dashed #999",
"border-left": "1px dashed #999",
"border-right": "1px dashed #999",
"border-bottom": "1px dashed #999",
"height": "40px",
"width": "200px",
"overflow": "hidden",
"cursor": "pointer",
"margin": "3px",
"-webkit-user-select": "none",
"-moz-user-select": "none",
"position": "static",
"top": "auto",
"left": "auto",
"opacity": 1,
"display": "inline-block"
},
"buttonIcon": {
"height": "26px",
"cursor": "pointer",
"border": "0px",
"margin": "0px"
}
}
o2web/source/x_component_process_FormDesigner/Module/Elcolorpicker/elcolorpicker.html 0 → 100644
浏览文件 @ a4bb07d5
<div style="background-color: #FFF; overflow: hidden">
<div title="{{$.lp.base}}" class="MWFTab">
<table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
<tr>
<td class="editTableTitle">{{$.lp.id}}:</td>
<td class="editTableValue"><input type="text" name="id" value="text{$.id}" class="editTableInput"/></td>
</tr>
<tr>
<td class="editTableTitle">{{$.lp.name}}:</td>
<td class="editTableValue"><input type="text" name="name" value="text{$.name}" class="editTableInput"/></td>
</tr>
<tr>
<td class="editTableTitle">{{$.lp.readonly}}:</td>
<td class="editTableValue">
<input type="radio" name="isReadonly" value="true" text{($.isReadonly)?'checked':''}/>{{$.lp.yes}}
<input type="radio" name="isReadonly" value="false" text{(!$.isReadonly)?'checked':''}/>{{$.lp.no}}
</td>
</tr>
<tr>
<td class="editTableTitle">{{$.lp.disabled}}:</td>
<td class="editTableValue">
<input type="radio" name="disabled" value="true" text{($.disabled)?'checked':''}/>{{$.lp.yes}}
<input type="radio" name="disabled" value="false" text{(!$.disabled)?'checked':''}/>{{$.lp.no}}
</td>
</tr>
</table>
<table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
<tr>
<td class="editTableTitle">{{$.lp.size}}:</td>
<td class="editTableValue">
<input type="radio" name="size" value="default" text{(!$.size || $.size==='default')?'checked':''}/>default
<input type="radio" name="size" value="medium" text{($.size==='medium')?'checked':''}/>medium
<input type="radio" name="size" value="small" text{($.size==='small')?'checked':''}/>small
<input type="radio" name="size" value="mini" text{($.size==='mini')?'checked':''}/>mini
</td>
</tr>
<tr>
<td class="editTableTitle">{{$.lp.showAlpha}}:</td>
<td class="editTableValue">
<input type="radio" name="showAlpha" value="true" text{($.showAlpha)?'checked':''}
onclick="if (this.checked){
$('text{$.pid}colorFormatHexSpan').setStyle('display', 'none');
if( $('text{$.pid}colorFormatHex').checked ){
$('text{$.pid}colorFormatRgb').click();
}
}"/>{{$.lp.yes}}
<input type="radio" name="showAlpha" value="false" text{(!$.showAlpha)?'checked':''}
onclick="if (this.checked){
$('text{$.pid}colorFormatHexSpan').setStyle('display', '');
}"/>{{$.lp.no}}
</td>
</tr>
</table>
<div>
<table>
<tr>
<td class="editTableTitle">{{$.lp.colorFormat}}:</td>
<td class="editTableValue">
<span id="text{$.pid}colorFormatHexSpan" style="display: text{($.showAlpha) ? 'none':''};">
<input id="text{$.pid}colorFormatHex" type="radio" name="colorFormat" value="hex" text{(!$.colorFormat || $.colorFormat==='hex')?'checked':''}/>hex
</span>
<input id="text{$.pid}colorFormatRgb" type="radio" name="colorFormat" value="rgb" text{($.colorFormat==='rgb')?'checked':''}/>rgb
<input type="radio" name="colorFormat" value="hsl" text{($.colorFormat==='hsl')?'checked':''}/>hsl
<input type="radio" name="colorFormat" value="hsv" text{($.colorFormat==='hsv')?'checked':''}/>hsv
</td>
</tr>
</table>
</div>
<div class="MWFMaplist" name="elStyles" title="{{$.lp.style}}"></div>
<div class="MWFMaplist" name="elProperties" title="{{$.lp.attribute}}"></div>
<table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
<tr>
<td class="editTableTitle">{{$.lp.compute}}:</td>
<td class="editTableValue">
<input type="radio" name="compute" value="create" text{(!$.compute || $.compute=='create')?'checked':''}/>{{$.lp.create}}
<input type="radio" name="compute" value="save" text{($.compute=='save')?'checked':''}/>{{$.lp.save}}
<input type="radio" name="compute" value="show" text{($.compute=='show')?'checked':''}/>{{$.lp.show}}
</td>
</tr>
</table>
<div class="MWFScriptArea" name="defaultValue" title="{{$.lp.defaultValue}} (S)"></div>
<div class="MWFValidation" name="validationConfig"></div>
<div class="MWFScriptArea" name="validation" title="{{$.lp.verificationScript}} (S)"></div>
</div>
<div title="Vue" class="MWFTab">
<div onclick="var node = this.getNext(); node.setStyle('display', ((node.getStyle('display')!='none') ? 'none': 'block'))" style="cursor: pointer; height:24px; padding-left: 5px; line-height: 24px; background-color: #EEE; border-bottom: 1px solid #999;font-weight:bold;">Vue Data</div>
<div style="display: text{($.vueData && $.vueData.code) ? 'block': 'none'}" class="MWFScriptArea" name="vueData" title="Vue Data (S)"></div>
<div onclick="var node = this.getNext(); node.setStyle('display', ((node.getStyle('display')!='none') ? 'none': 'block'))" style="cursor: pointer; height:24px; padding-left: 5px; line-height: 24px; background-color: #EEE; border-bottom: 1px solid #999;font-weight:bold;">Vue Method</div>
<div div style="display: text{($.vueMethods && $.vueMethods.code) ? 'block': 'none'}" class="MWFScriptArea" name="vueMethods" title="Vue Methods (S)"></div>
<div onclick="var node = this.getNext(); node.setStyle('display', ((node.getStyle('display')!='none') ? 'none': 'block'))" style="cursor: pointer; height:24px; padding-left: 5px; line-height: 24px; background-color: #EEE; border-bottom: 1px solid #999;font-weight:bold;">Vue CSS</div>
<div div style="display: text{($.vueCss && $.vueCss.code) ? 'block': 'none'}" class="MWFCssArea" name="vueCss" title="Vue Css (S)"></div>
<div onclick="var node = this.getNext(); node.setStyle('display', ((node.getStyle('display')!='none') ? 'none': 'block'))" style="cursor: pointer; height:24px; padding-left: 5px; line-height: 24px; background-color: #EEE; border-bottom: 1px solid #999;font-weight:bold;">Vue Slots</div>
<div style="display: text{($.vueSlot) ? 'block' : 'none'}">
<div class="MWFHtmlEditorArea" name="vueSlot" title="Input Slot (HTML)"></div>
</div>
</div>
<div title="{{$.lp.section}}" class="MWFTab">
<table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
<tr>
<td class="editTableTitle">{{$.lp.enableSection}}:</td>
<td class="editTableValue">
<input onclick="if (this.checked){ $('text{$.pid}sectionByEditArea').setStyle('display', 'block')}" type="radio" name="section" value="yes" text{($.section=='yes')?'checked':''}/>{{$.lp.yes}}
<input onclick="if (this.checked){ $('text{$.pid}sectionByEditArea').setStyle('display', 'none')}" type="radio" name="section" value="no" text{($.section!='yes')?'checked':''}/>{{$.lp.no}}
</td>
</tr>
</table>
<div id="text{$.pid}sectionByEditArea" style="display: text{($.section=='yes')?'block':'none'};">
<table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
<tr>
<td class="editTableTitle">{{$.lp.sectionBy}}:</td>
<td class="editTableValue">
<input class="editTableRadio" onclick="if (this.checked){ $('text{$.pid}sectionByScriptEditArea').setStyle('display', 'none');}" name="sectionBy" text{(($.sectionBy=='person') || ($.sectionBy!='unit' && $.sectionBy!='activity' && $.sectionBy!='script'))?'checked':''} type="radio" value="person"/>{{$.lp.handler}}<br/>
<input class="editTableRadio" onclick="if (this.checked){ $('text{$.pid}sectionByScriptEditArea').setStyle('display', 'none');}" name="sectionBy" text{($.sectionBy=='unit')?'checked':''} type="radio" value="unit"/>{{$.lp.handlerUnit}}<br/>
<input class="editTableRadio" onclick="if (this.checked){ $('text{$.pid}sectionByScriptEditArea').setStyle('display', 'none');}" name="sectionBy" text{($.sectionBy=='activity')?'checked':''} type="radio" value="activity"/>{{$.lp.activityId}}<br/>
<input class="editTableRadio" onclick="if (this.checked){ $('text{$.pid}sectionByScriptEditArea').setStyle('display', 'none');}" name="sectionBy" text{($.sectionBy=='splitValue')?'checked':''} type="radio" value="splitValue"/>{{$.lp.splitValue}}<br/>
<input class="editTableRadio" onclick="if (this.checked){ $('text{$.pid}sectionByScriptEditArea').setStyle('display', 'block');}" name="sectionBy" text{($.sectionBy=='script')?'checked':''} type="radio" value="script"/>{{$.lp.script}}<br/>
</td>
</tr>
</table>
<div id="text{$.pid}sectionByScriptEditArea" style="display: text{($.sectionBy=='script')?'block':'none'};">
<div class="MWFScriptArea" name="sectionByScript" title="{{$.lp.sectionBy}} (S)"></div>
</div>
</div>
</div>
<div title="{{$.lp.event}}" class="MWFTab">
<div class="MWFEventsArea" name="events"></div>
</div>
<div title="HTML" class="MWFTab">
<div class="MWFHTMLArea" style="width:100%; height:400px; border:0px;font-family: Verdana, Geneva, sans-serif; font-size:14px"></div>
</div>
<div title="JSON" class="MWFTab">
<div class="MWFJSONArea" style="font-family: Verdana, Geneva, sans-serif; font-size:14px"></div>
</div>
</div>
o2web/source/x_component_process_FormDesigner/Module/Elcolorpicker/template.json 0 → 100644
浏览文件 @ a4bb07d5
{
"id": "",
"name": "",
"type": "Elcolorpicker",
"description": "",
"isReadonly" : false,
"disabled": false,
"showAlpha": false,
"colorFormat": "hex",
"vueData": {},
"vueMethods": {},
"vueCss": {},
"vueSlot": "",
"elProperties": {},
"elStyles": {},
"events": {
"queryLoad": {
"code": "",
"html": ""
},
"postLoad": {
"code": "",
"html": ""
},
"load": {
"code": "",
"html": ""
},
"change": {
"code": "",
"html": ""
},
"click": {
"code": "",
"html": ""
},
"dblclick": {
"code": "",
"html": ""
},
"keydown": {
"code": "",
"html": ""
},
"keypress": {
"code": "",
"html": ""
},
"keyup": {
"code": "",
"html": ""
},
"mousedown": {
"code": "",
"html": ""
},
"mousemove": {
"code": "",
"html": ""
},
"mouseout": {
"code": "",
"html": ""
},
"mouseover": {
"code": "",
"html": ""
},
"mouseup": {
"code": "",
"html": ""
},
"focus": {
"code": "",
"html": ""
},
"blur": {
"code": "",
"html": ""
}
},
"properties": {},
"class": "",
"styles": {},
"container": ""
}
o2web/source/x_component_process_FormDesigner/Module/Elrate.js
浏览文件 @ a4bb07d5
......@@ -49,15 +49,15 @@ MWF.xApplication.process.FormDesigner.Module.Elrate = MWF.FCElrate = new Class({
return this.copyNode;
},
setPropertyName: function(){
if (this.json.name){
var input = this.node.getElement("input");
if (input) input.set("value", this.json.name);
}
// if (this.json.name){
// var input = this.node.getElement("input");
// if (input) input.set("value", this.json.name);
// }
},
setPropertyId: function(){
if (!this.json.name){
var input = this.node.getElement("input");
if (input) input.set("value", this.json.id);
}
// if (!this.json.name){
// var input = this.node.getElement("input");
// if (input) input.set("value", this.json.id);
// }
}
});
o2web/source/x_component_process_FormDesigner/Module/Elrate/template.json
浏览文件 @ a4bb07d5
......@@ -4,6 +4,7 @@
"type": "Elrate",
"description": "",
"isReadonly" : false,
"disabled": false,
"allowHalf": false,
"max" : 5,
"lowThreshold": 2,
......
o2web/source/x_component_process_FormDesigner/Module/Package.js
浏览文件 @ a4bb07d5
......@@ -71,4 +71,5 @@ MWF.xDesktop.requireApp("process.FormDesigner", "Module.Eltime", null, false);
MWF.xDesktop.requireApp("process.FormDesigner", "Module.Eldate", null, false);
MWF.xDesktop.requireApp("process.FormDesigner", "Module.Eldatetime", null, false);
MWF.xDesktop.requireApp("process.FormDesigner", "Module.Elrate", null, false);
MWF.xDesktop.requireApp("process.FormDesigner", "Module.Elcolorpicker", null, false);
MWF.xDesktop.requireApp("process.FormDesigner", "Module.SmartBI", null, false);
\ No newline at end of file
o2web/source/x_component_process_FormDesigner/lp/en.js
浏览文件 @ a4bb07d5
......@@ -351,6 +351,7 @@ MWF.xApplication.process.FormDesigner.LP = {
"el_date": "Date",
"el_datetime": "Datetime",
"el_rate": "Rate",
"el_colorpicker": "ColorPicker",
"el_common": "Common",
"importer": "DataImporter",
......@@ -554,6 +555,10 @@ MWF.xApplication.process.FormDesigner.LP = {
"showScore": "Show Score",
"textColor": "Text Color",
"textContent": "Text Content",
"showAlpha": "Show Alpha",
"colorFormat": "Color Format",
"selectStyle": "Select Style",
"options": "Options",
"optionScript": "Options Script",
......
o2web/source/x_component_process_FormDesigner/lp/zh-cn.js
浏览文件 @ a4bb07d5
......@@ -351,6 +351,7 @@ MWF.xApplication.process.FormDesigner.LP = {
"el_date": "日期",
"el_datetime": "日期时间",
"el_rate": "评分",
"el_colorpicker": "颜色选择",
"el_common": "通用",
"importer": "数据导入",
......@@ -554,6 +555,9 @@ MWF.xApplication.process.FormDesigner.LP = {
"textColor": "文本颜色",
"textContent": "文本内容",
"showAlpha": "显示透明度",
"colorFormat": "颜色格式",
"selectStyle": "Select样式",
"options": "可选值",
"optionScript": "可选值脚本",
......
o2web/source/x_component_process_Xform/Elcolorpicker.js 0 → 100644
浏览文件 @ a4bb07d5
o2.xDesktop.requireApp("process.Xform", "$Elinput", null, false);
/** @class Elinput 基于Element UI的输入框组件。
* @example
* //可以在脚本中获取该组件
* //方法1：
* var input = this.form.get("name"); //获取组件
* //方法2
* var input = this.target; //在组件事件脚本中获取
* @extends MWF.xApplication.process.Xform.$Module
* @o2category FormComponents
* @o2range {Process|CMS|Portal}
* @hideconstructor
*/
MWF.xApplication.process.Xform.Elcolorpicker = MWF.APPElcolorpicker = new Class(
/** @lends o2.xApplication.process.Xform.Elcolorpicker# */
{
Implements: [Events],
Extends: MWF.APP$Elinput,
options: {
"moduleEvents": ["load", "queryLoad", "postLoad"],
"elEvents": ["change"]
},
_appendVueData: function(){
if (!this.json.isReadonly) this.json.isReadonly = false;
if (!this.json.disabled) this.json.disabled = false;
if (!this.json.showAlpha) this.json.showAlpha = false;
if (!this.json.colorFormat) {
if( this.json.showAlpha ){
this.json.colorFormat = "hex";
}else{
this.json.colorFormat = "rgb";
}
}
},
// appendVueExtend: function(app){
// if (!app.methods) app.methods = {};
// app.methods.$loadElEvent = function(ev){
// this.validationMode();
// if (ev==="change") this._setBusinessData(this.getInputData());
// if (this.json.events && this.json.events[ev] && this.json.events[ev].code){
// this.form.Macro.fire(this.json.events[ev].code, this, event);
// }
// }.bind(this);
// },
_createElementHtml: function(){
var html = "<el-color-picker";
html += " v-model=\""+this.json.$id+"\"";
html += " :readonly=\"isReadonly\"";
html += " :disabled=\"disabled\"";
html += " :show-alpha=\"showAlpha\"";
html += " :color-format=\"colorFormat\"";
this.options.elEvents.forEach(function(k){
html += " @"+k+"=\"$loadElEvent_"+k.camelCase()+"\"";
});
if (this.json.elProperties){
Object.keys(this.json.elProperties).forEach(function(k){
if (this.json.elProperties[k]) html += " "+k+"=\""+this.json.elProperties[k]+"\"";
}, this);
}
if (this.json.elStyles) html += " :style=\"elStyles\"";
html += ">";
if (this.json.vueSlot) html += this.json.vueSlot;
html += "</el-color-picker>";
return html;
}
});
o2web/source/x_component_process_Xform/Elrate.js
浏览文件 @ a4bb07d5
......@@ -57,6 +57,7 @@ MWF.xApplication.process.Xform.Elrate = MWF.APPElrate = new Class(
// }.bind(this);
// },
_createElementHtml: function(){
debugger;
var html = "<el-rate";
html += " v-model=\""+this.json.$id+"\"";
html += " :readonly=\"isReadonly\"";
......
o2web/source/x_component_process_Xform/Log.js
浏览文件 @ a4bb07d5
......@@ -1459,7 +1459,6 @@ MWF.xApplication.process.Xform.Log = MWF.APPLog = new Class(
this.form.Macro.environment.list = null;
flag = this.form.Macro.exec(this.json.filterScript.code, this);
}else{
debugger;
var isExactMatch = function (property) {
return property && o2.typeOf(property)==="array" && property.length && property[0] === "yes";
};
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或