OOTextarea.js 5.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170
  1. MWF.xDesktop.requireApp('process.Xform', '$Input', null, false);
  2. MWF.xApplication.process.Xform.OOTextarea = MWF.APPOOTextarea = new Class({
  3. Implements: [Events],
  4. Extends: MWF.APP$Input,
  5. iconStyle: 'textFieldIcon',
  6. options: {
  7. "moduleEvents": ["load", "queryLoad", "postLoad"]
  8. },
  9. _loadNode: function () {
  10. // if (this.isReadonly() || this.json.showMode==="read"){
  11. // this._loadNodeRead();
  12. // }else{
  13. this._loadNodeEdit();
  14. // }
  15. },
  16. loadDescription: function () {
  17. this.node.setAttribute('placeholder', this.json.description || '');
  18. },
  19. _loadDomEvents: function(){
  20. Object.each(this.json.events, function(e, key){
  21. if (e.code){
  22. if (this.options.moduleEvents.indexOf(key)===-1){
  23. this.node.addEvent(key, function(event){
  24. return this.form.Macro.fire(e.code, this, event);
  25. }.bind(this));
  26. }
  27. }
  28. }.bind(this));
  29. },
  30. _loadNodeEdit: function () {
  31. this.node.set({
  32. 'id': this.json.id,
  33. 'MWFType': this.json.type,
  34. 'validity-blur': 'true',
  35. // "label-style": "width:6.2vw; min-width:5em; max-width:9em"
  36. });
  37. if (this.json.properties) {
  38. this.node.set(this.json.properties);
  39. }
  40. if (this.json.styles) {
  41. this.node.setStyles(this.json.styles);
  42. }
  43. if (this.json.label) {
  44. this.node.setAttribute('label', this.json.label);
  45. }
  46. if (this.json.showIcon != 'no' && !this.form.json.hideModuleIcon) {
  47. this.node.setAttribute('right-icon', 'edit');
  48. } else if (this.form.json.nodeStyleWithhideModuleIcon) {
  49. this.node.setAttribute('right-icon', '');
  50. }
  51. this.node.setAttribute('readonly', false);
  52. this.node.setAttribute('readmode', false);
  53. this.node.setAttribute('disabled', false);
  54. if (!this.isReadonly()){
  55. if (this.json.showMode === 'readonlyMode') {
  56. this.node.setAttribute('readonly', true);
  57. } else if (this.json.showMode === 'disabled') {
  58. this.node.setAttribute('disabled', true);
  59. } else if (this.json.showMode === 'read') {
  60. this.node.setAttribute('readmode', true);
  61. if (this.json.readModeEvents!=='yes'){
  62. this.node.setStyle('pointer-events', 'none');
  63. }
  64. } else {
  65. }
  66. }else{
  67. this.node.setAttribute('readmode', true);
  68. if (this.json.readModeEvents!=='yes'){
  69. this.node.setStyle('pointer-events', 'none');
  70. }
  71. }
  72. if (this.json.required){
  73. this.node.setAttribute("required", true);
  74. if (!this.json.validationConfig) this.json.validationConfig = [];
  75. var label = this.json.label ? `“${this.json.label.replace(/ /g, '')}”` : MWF.xApplication.process.Xform.LP.requiredHintField;
  76. this.json.validationConfig.push({
  77. status : "all",
  78. decision : "",
  79. valueType : "value",
  80. operateor : "isnull",
  81. value : "",
  82. prompt : MWF.xApplication.process.Xform.LP.requiredHint.replace('{label}', label),
  83. });
  84. }else{
  85. this.node.removeAttribute("required");
  86. }
  87. if (this.json.showMode){
  88. this.node.setAttribute("type", this.json.dataType);
  89. }
  90. if (this.json.autoSize==="no"){
  91. this.node.setAttribute("auto-size", false);
  92. }else{
  93. this.node.setAttribute("auto-size", true);
  94. }
  95. this.node.addEvent('change', function () {
  96. var v = this.getInputData('change');
  97. this.validationMode();
  98. this.validation()
  99. this._setBusinessData(v);
  100. this.fireEvent('change');
  101. }.bind(this));
  102. var inputNode = this.node;
  103. if (inputNode) inputNode.addEvent('input', function (e) {
  104. var v = e.target.get('value');
  105. this._setBusinessData(v);
  106. }.bind(this));
  107. this.node.addEvent('blur', function () {
  108. this.validation();
  109. }.bind(this));
  110. this.node.addEvent('keyup', function () {
  111. this.validationMode();
  112. }.bind(this));
  113. this.node.addEventListener('validity', (e) => {
  114. if (this.validationText) {
  115. e.target.setCustomValidity(this.validationText);
  116. }
  117. });
  118. },
  119. createModelNode: function () {
  120. this.modelNode = new Element('div', {'styles': this.form.css.modelNode}).inject(this.node, 'after');
  121. new Element('div', {
  122. 'styles': this.form.css.modelNodeTitle,
  123. 'text': MWF.xApplication.process.Xform.LP.ANNInput
  124. }).inject(this.modelNode);
  125. new Element('div', {
  126. 'styles': this.form.css.modelNodeContent,
  127. 'text': MWF.xApplication.process.Xform.LP.ANNInput
  128. }).inject(this.modelNode);
  129. },
  130. __setData: function(data, fireChange){
  131. var old = this.getInputData();
  132. this._setBusinessData(data);
  133. this.node.value = data;
  134. this.fieldModuleLoaded = true;
  135. if (fireChange && old!==data) this.fireEvent("change");
  136. this.moduleValueAG = null;
  137. },
  138. __setValue: function (value) {
  139. this.moduleValueAG = null;
  140. this._setBusinessData(value);
  141. this.node.set('value', value || '');
  142. this.fieldModuleLoaded = true;
  143. return value;
  144. },
  145. getInputData: function () {
  146. return this.node.value;
  147. },
  148. notValidationMode: function (text) {
  149. this.validationText = text;
  150. this.node.checkValidity();
  151. },
  152. validationMode: function () {
  153. this.validationText = '';
  154. this.node.unInvalidStyle();
  155. }
  156. });