DetailTextField.js 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169
  1. /**
  2. *
  3. */
  4. Ext.define('erp.view.core.form.DetailTextField', {
  5. extend: 'Ext.form.FieldSet',
  6. id: 'dfield',
  7. alias: 'widget.detailtextfield',
  8. autoScroll:true,
  9. minHeight: 220,
  10. collapsible: true,
  11. title: '',
  12. style: 'background:#f1f1f1;',
  13. margin: '2 2 2 2',
  14. tfnumber: 0,
  15. initComponent: function() {
  16. this.columnWidth = 1;//强制占一行
  17. this.cls = '';
  18. this.callParent(arguments);
  19. this.items.items[0].name = this.name;
  20. this.setTitle('<img src="' + basePath + 'resource/images/icon/detail.png" width=20 height=20/>&nbsp;&nbsp;'+this.fieldLabel);
  21. },
  22. layout:'column',
  23. items: [{
  24. xtype: 'hidden',//该隐藏字段的值(附件在FilePath表的ID,用;隔开)将被保存到数据库
  25. // id: 'file-hidden',
  26. value: '',
  27. fieldLabel: ''
  28. },{
  29. xtype: 'form',
  30. columnWidth: 1,
  31. frame: false,
  32. autoScroll:true,
  33. minHeight: 220,
  34. bodyStyle: 'background:#f1f1f1;',
  35. bbar:[ {
  36. iconCls: 'x-button-icon-add',
  37. id: 'add',
  38. text: '添加记录',
  39. handler: function(btn){
  40. btn.ownerCt.ownerCt.ownerCt.addItem(Ext.create('Ext.form.field.Text', {
  41. xtype: 'textfield',
  42. name: 'text' + ++btn.ownerCt.ownerCt.ownerCt.tfnumber,
  43. id: 'text' + btn.ownerCt.ownerCt.ownerCt.tfnumber,
  44. columnWidth: 0.95,
  45. labelWidth: 50,
  46. value: '',
  47. fieldLabel: '第&nbsp;' + btn.ownerCt.ownerCt.ownerCt.tfnumber +'&nbsp;条',
  48. fieldStyle: 'background:#f0f0f0;border-bottom-style: 1px solid #8B8970;padding:2px 2px;vertical-align:middle;border-top:none;border-right:none;color:#CD661D;border-bottom-style:1px solid;border-left:none; ',
  49. listeners:{
  50. change: function(){
  51. var s = '';
  52. for(var i=1; i<=btn.ownerCt.ownerCt.ownerCt.tfnumber; i++){
  53. if(Ext.getCmp('text'+i).value != null && Ext.getCmp('text'+i).value.toString().trim() != ''){
  54. s += Ext.getCmp('text'+i).value + '==###==';
  55. }
  56. }
  57. btn.ownerCt.ownerCt.ownerCt.value = s;
  58. }
  59. }
  60. }));
  61. btn.ownerCt.ownerCt.ownerCt.addItem(Ext.create('Ext.button.Button', {
  62. text: '清&nbsp;空',
  63. name: 'btn' + btn.ownerCt.ownerCt.ownerCt.tfnumber,
  64. id: 'btn' + btn.ownerCt.ownerCt.ownerCt.tfnumber,
  65. columnWidth: 0.05,
  66. index: btn.ownerCt.ownerCt.ownerCt.tfnumber,
  67. handler: function(btn){
  68. Ext.getCmp('text'+btn.index).setValue('');
  69. }
  70. }));
  71. }
  72. }]
  73. }],
  74. setValue: function(value){
  75. this.value = value;
  76. },
  77. getValue: function(){
  78. var value = '';
  79. for(var i=1; i<=this.tfnumber; i++){
  80. if(Ext.getCmp('text'+i).value != null && Ext.getCmp('text'+i).value.toString().trim() != ''){
  81. value += Ext.getCmp('text'+i).value + '==###==';
  82. }
  83. }
  84. return value;
  85. },
  86. clean: function(index){
  87. Ext.getCmp('text'+index).setValue('');
  88. },
  89. listeners : {
  90. afterrender: function(f){
  91. var me = this;
  92. if(f.value != null && f.value.toString().trim() != ''){
  93. var text = f.value.split('==###==');
  94. me.tfnumber = text.length-1;
  95. for(var i=1; i<=me.tfnumber; i++){
  96. me.addItem(Ext.create('Ext.form.field.Text', {
  97. xtype: 'textfield',
  98. name: 'text' + i,
  99. labelWidth: 50,
  100. id: 'text' + i,
  101. columnWidth: 0.95,
  102. value: text[i-1],
  103. fieldLabel: '第&nbsp;' + i +'&nbsp;条',
  104. fieldStyle: 'background:#f0f0f0;border-bottom-style: 1px solid #8B8970;padding:2px 2px;vertical-align:middle;border-top:none;border-right:none;color:#CD661D;border-bottom-style:1px solid;border-left:none; ',
  105. listeners:{
  106. change: function(){
  107. var s = '';
  108. for(var i=1; i<=me.tfnumber; i++){
  109. if(Ext.getCmp('text'+i).value != null && Ext.getCmp('text'+i).value.toString().trim() != ''){
  110. s += Ext.getCmp('text'+i).value + '==###==';
  111. }
  112. }
  113. me.value = s;
  114. }
  115. }
  116. }));
  117. me.addItem(Ext.create('Ext.button.Button', {
  118. text: '清&nbsp;空',
  119. name: 'btn' + i,
  120. id: 'btn' + i,
  121. index: i,
  122. columnWidth: 0.05,
  123. handler: function(btn){
  124. Ext.getCmp('text'+btn.index).setValue('');
  125. }
  126. }));
  127. }
  128. } else {
  129. me.tfnumber = 3;
  130. for(var i=1; i<=me.tfnumber; i++){
  131. me.addItem(Ext.create('Ext.form.field.Text', {
  132. xtype: 'textfield',
  133. name: 'text' + i,
  134. id: 'text' + i,
  135. labelWidth: 50,
  136. columnWidth: 0.95,
  137. value: '',
  138. fieldLabel: '第&nbsp;' + i +'&nbsp;条',
  139. fieldStyle: 'background:#f0f0f0;border-bottom-style: 1px solid #8B8970;padding:2px 2px;vertical-align:middle;border-top:none;border-right:none;color:#CD661D;border-bottom-style:1px solid;border-left:none; ',
  140. listeners:{
  141. change: function(){
  142. var s = '';
  143. for(var i=1; i<=me.tfnumber; i++){
  144. if(Ext.getCmp('text'+i).value != null && Ext.getCmp('text'+i).value.toString().trim() != ''){
  145. s += Ext.getCmp('text'+i).value + '==###==';
  146. }
  147. }
  148. me.value = s;
  149. }
  150. }
  151. }));
  152. me.addItem(Ext.create('Ext.button.Button', {
  153. text: '清&nbsp;空',
  154. name: 'btn' + i,
  155. id: 'btn' + i,
  156. index: i,
  157. columnWidth: 0.05,
  158. handler: function(btn){
  159. Ext.getCmp('text'+btn.index).setValue('');
  160. }
  161. }));
  162. }
  163. }
  164. }
  165. },
  166. addItem: function(item){
  167. this.add(item);
  168. }
  169. });