@andersonalmeidax0/webcomponents 0.1.45 → 0.1.47
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/XDateSelect.jsx +1 -1
- package/XInput.jsx +9 -3
- package/XSelect.jsx +2 -1
- package/form1.html +0 -0
- package/form2.html +250 -0
- package/jzcomponents/XFormEdit.jsx +14 -6
- package/jzcomponents/XTableRead.jsx +10 -2
- package/package.json +1 -1
- package/releasenotes.txt +2 -0
package/XDateSelect.jsx
CHANGED
|
@@ -13,7 +13,7 @@ class XDateSelect extends React.Component {
|
|
|
13
13
|
render() {
|
|
14
14
|
return (
|
|
15
15
|
<input type="date" disabled={this.props.disabled}
|
|
16
|
-
value={this.props.defaultValue}
|
|
16
|
+
value={(this.props.defaultValue instanceof Date)?this.props.defaultValue.toISOString().slice(0, 10):this.props.defaultValue.split("T")[0]}
|
|
17
17
|
onChange={this.toggleChange} />
|
|
18
18
|
);
|
|
19
19
|
}
|
package/XInput.jsx
CHANGED
|
@@ -50,18 +50,24 @@ var nOk = (nStr);
|
|
|
50
50
|
* localvalue: é o
|
|
51
51
|
* onKeypress
|
|
52
52
|
* ********************************************************* */
|
|
53
|
+
|
|
54
|
+
|
|
55
|
+
|
|
53
56
|
class XInputExternal extends React.Component {
|
|
54
57
|
constructor(props) {
|
|
55
58
|
super(props);
|
|
56
59
|
var valid=true;
|
|
57
60
|
var localValue=this.props.value;
|
|
58
|
-
|
|
61
|
+
this.log('XInputExternal.ctor localvalue:['+localValue+']');
|
|
59
62
|
if(this.props.type==='number') {
|
|
60
63
|
valid= isNumeric(this.props.value);
|
|
61
64
|
localValue=nm2v(this.props.value);
|
|
62
65
|
}
|
|
63
66
|
this.state={valid:valid,localValue:localValue}
|
|
64
67
|
}
|
|
68
|
+
|
|
69
|
+
log = (x) => {/*console.log(x)*/}
|
|
70
|
+
|
|
65
71
|
style1 = (valid) => {
|
|
66
72
|
//return {all: 'unset', border: '2px solid red;', padding:'2px 2px', margin: '2px 0;', xboxSizing: 'border-box', width:'100px',borderBottom:'1px red',borderStyle:'1px red',backgroundSize:'100px',background:'rgb(202,202,255)'};
|
|
67
73
|
//return {all: 'unset', width:(this.props.width?this.props.width:100)+'px', boxSizing: 'border-box', border: '1px solid #a0a0a0', padding:'4px 2px', margin: '4px 2px',background:'rgb(255,255,255)'};
|
|
@@ -99,7 +105,7 @@ class XInputExternal extends React.Component {
|
|
|
99
105
|
}
|
|
100
106
|
|
|
101
107
|
componentDidMount = () => {
|
|
102
|
-
|
|
108
|
+
this.log('XInputExternal.didmount localvalue:['+this.state.localValue+']');
|
|
103
109
|
|
|
104
110
|
}
|
|
105
111
|
|
|
@@ -117,7 +123,7 @@ class XInputExternal extends React.Component {
|
|
|
117
123
|
<React.Fragment>
|
|
118
124
|
<input id={this.props.id} style={this.style1(this.state.valid)} readOnly={this.props.readOnly}
|
|
119
125
|
defaultValue={this.state.localValue} value={this.state.localValue} onChange={this.onChangeCheckInterceptor}
|
|
120
|
-
onKeyDown ={(e)=>{if (e.keyCode === 13){
|
|
126
|
+
onKeyDown ={(e)=>{if (e.keyCode === 13){this.log('Xint.onKEnter');this.props.onEnterKey();/*this.setState({localValue:''})*/; }}} />
|
|
121
127
|
{(this.state.valid)?'':'(invalid)'}
|
|
122
128
|
</React.Fragment>
|
|
123
129
|
); else
|
package/XSelect.jsx
CHANGED
|
@@ -40,12 +40,13 @@ class XSelect3 extends React.Component {
|
|
|
40
40
|
else
|
|
41
41
|
return (
|
|
42
42
|
<div >
|
|
43
|
-
<span id={'Last_'+this.props.id} style={{visibility: 'hidden'}} >{TEST_UI_AUX&&this.props.list[this.props.list.length-1].id}</span>
|
|
44
43
|
<select id={this.props.id} style={{width:(this.props.width?this.props.width:300)+'px'}} disabled={this.props.disabled} onChange={this.evt} value={this.state.value} >
|
|
44
|
+
|
|
45
45
|
{this.props.list.map(function(v){
|
|
46
46
|
return <option key={v.id} value={v.id}>{v.descr}</option>;
|
|
47
47
|
})}
|
|
48
48
|
</select>
|
|
49
|
+
<span id={'Last_'+this.props.id} style={{display:'none',visibility: 'hidden'}} >{TEST_UI_AUX&&this.props.list[this.props.list.length-1].id}</span>
|
|
49
50
|
</div>
|
|
50
51
|
)
|
|
51
52
|
else
|
package/form1.html
ADDED
|
File without changes
|
package/form2.html
ADDED
|
@@ -0,0 +1,250 @@
|
|
|
1
|
+
<html lang="en"><head>
|
|
2
|
+
<script type="module">import { injectIntoGlobalHook } from "/@react-refresh";
|
|
3
|
+
injectIntoGlobalHook(window);
|
|
4
|
+
window.$RefreshReg$ = () => {};
|
|
5
|
+
window.$RefreshSig$ = () => (type) => type;</script>
|
|
6
|
+
|
|
7
|
+
<script type="module" src="/@vite/client"></script>
|
|
8
|
+
|
|
9
|
+
<meta charset="UTF-8">
|
|
10
|
+
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
11
|
+
<title>App</title>
|
|
12
|
+
|
|
13
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
14
|
+
<link rel="stylesheet" href="/css/basic2.css">
|
|
15
|
+
|
|
16
|
+
<link rel="stylesheet" href="/css/font-awesome.ander.css">
|
|
17
|
+
|
|
18
|
+
<title></title>
|
|
19
|
+
<style>
|
|
20
|
+
pre {
|
|
21
|
+
white-space: pre-wrap;
|
|
22
|
+
word-wrap: break-word; /* IE 5.5+ */
|
|
23
|
+
}
|
|
24
|
+
label{
|
|
25
|
+
float: left;
|
|
26
|
+
width: 5%;
|
|
27
|
+
}
|
|
28
|
+
</style></head>
|
|
29
|
+
|
|
30
|
+
<body id="main">
|
|
31
|
+
<header>
|
|
32
|
+
<div style="display: flex; padding: 0.6em;">
|
|
33
|
+
<div style="display: flex; width: 50%;">
|
|
34
|
+
<h1>MobileCRM</h1>
|
|
35
|
+
</div>
|
|
36
|
+
<div style="display: flex; width: 50%; justify-content: right;">
|
|
37
|
+
<h2> rafael.barros@gmail.com <i class="fa fa-user"></i> | <button>Logout</button></h2>
|
|
38
|
+
</div>
|
|
39
|
+
</div>
|
|
40
|
+
</header>
|
|
41
|
+
<nav>
|
|
42
|
+
<aside>
|
|
43
|
+
<ul>Menu: <li><a href="/index.html" class="active"><span class="item">Home</span></a></li>
|
|
44
|
+
<li><a href="/index.html#pageCliente" class="active"><span class="item">Meus Dados</span></a></li>
|
|
45
|
+
<li><a href="/index.html#pagePedidos" class="active"><span class="item">Meus Pedidos</span></a></li>
|
|
46
|
+
<li><a href="/index.html#pageChat" class="active"><span class="item">ChatBot</span></a></li>
|
|
47
|
+
</ul>
|
|
48
|
+
<details>
|
|
49
|
+
<summary></summary>
|
|
50
|
+
<p>cid:wcrm-client</p>
|
|
51
|
+
<p>role:</p>
|
|
52
|
+
<p>tenantid2:</p>
|
|
53
|
+
</details>
|
|
54
|
+
</aside>
|
|
55
|
+
</nav>
|
|
56
|
+
<main>
|
|
57
|
+
<section>
|
|
58
|
+
<h1>Meus dados</h1>
|
|
59
|
+
<h3></h3>
|
|
60
|
+
<fieldset class="vertical">
|
|
61
|
+
<h6></h6>
|
|
62
|
+
<h3>Cliente</h3><label style="float: left;width: 10%;"> _id </label><input id="FORM_undefined_F0" class="card"
|
|
63
|
+
value="68b7571d8f53c879e171b6f4" style="width: 150px;"> <br><label> cpf </label><input
|
|
64
|
+
id="FORM_undefined_F1" class="card" value="123123123" style="width: 150px;"> <br><label> nome
|
|
65
|
+
</label><input id="FORM_undefined_F2" class="card" value="Rafael Barros" style="width: 150px;"> <br><label>
|
|
66
|
+
email </label><input id="FORM_undefined_F3" class="card" value="rafael.barros@gmail.com"
|
|
67
|
+
style="width: 150px;"> <br><label> sub </label><input id="FORM_undefined_F4" class="card"
|
|
68
|
+
value=":83de60e5-ba03-4628-aa70-e904fc8d9b57" style="width: 150px;"> <br><label> ativo
|
|
69
|
+
</label><input id="FORM_undefined_F5" class="card" value="true" style="width: 150px;"> <br><label>
|
|
70
|
+
contatoPrincipal </label><input id="FORM_undefined_F6" class="card" value="5511972188783"
|
|
71
|
+
style="width: 150px;"> <br><label> pwd </label><input id="FORM_undefined_F7" class="card"
|
|
72
|
+
value="1234" style="width: 150px;"> <br>
|
|
73
|
+
<div xclassname="card">
|
|
74
|
+
<div>Enderecos</div><button id="Novo_FORM_undefined_F8" type="button" class="btn--raised tooltip"
|
|
75
|
+
data-text="Novo_FORM_undefined_F8">New </button><span> </span>
|
|
76
|
+
<h6></h6>
|
|
77
|
+
<div xstyle="[object Object]">
|
|
78
|
+
<table class="hoverable" xwidth="99%" xstyle="[object Object]">
|
|
79
|
+
<thead>
|
|
80
|
+
<tr class="table-header">
|
|
81
|
+
<th></th>
|
|
82
|
+
<th x="center" align="left"> <b>tipo</b></th>
|
|
83
|
+
<th x="center" align="left"> <b>logradouro</b></th>
|
|
84
|
+
<th x="center" align="left"> <b>numero</b></th>
|
|
85
|
+
<th x="center" align="left"> <b>complemento</b></th>
|
|
86
|
+
<th x="center" align="left"> <b>bairro</b></th>
|
|
87
|
+
<th x="center" align="left"> <b>cidade</b></th>
|
|
88
|
+
<th x="center" align="left"> <b>uf</b></th>
|
|
89
|
+
<th x="center" align="left"> <b>cep</b></th>
|
|
90
|
+
<th x="center" align="left"> <b>pais</b></th>
|
|
91
|
+
<th align="center"><b></b></th>
|
|
92
|
+
</tr>
|
|
93
|
+
</thead>
|
|
94
|
+
<tbody>
|
|
95
|
+
<tr>
|
|
96
|
+
<td align="center" class="nudge--left "> 1. </td>
|
|
97
|
+
<td align="left">
|
|
98
|
+
<div><select
|
|
99
|
+
id="FORM_undefined_F8_R0_C0" style="width: 300px;">
|
|
100
|
+
<option value="Comercial">Comercial</option>
|
|
101
|
+
<option value="Residencial">Residencial</option>
|
|
102
|
+
</select><span id="Last_FORM_undefined_F8_R0_C0" style="display:none;visibility:hidden;">Residencial</span></div>
|
|
103
|
+
</td>
|
|
104
|
+
<td align="left"><input id="FORM_undefined_F8_R0_C1" value="Avenida Paulista" style="width: 150px;">
|
|
105
|
+
</td>
|
|
106
|
+
<td align="left"><input id="FORM_undefined_F8_R0_C2" value="1578" style="width: 150px;"></td>
|
|
107
|
+
<td align="left"><input id="FORM_undefined_F8_R0_C3" value="Sala 99" style="width: 150px;"></td>
|
|
108
|
+
<td align="left"><input id="FORM_undefined_F8_R0_C4" value="Bela Vista" style="width: 150px;"></td>
|
|
109
|
+
<td align="left"><input id="FORM_undefined_F8_R0_C5" value="São Paulo" style="width: 150px;"></td>
|
|
110
|
+
<td align="left">
|
|
111
|
+
<div><span id="Last_FORM_undefined_F8_R0_C6" style="visibility: hidden;">TO</span><select
|
|
112
|
+
id="FORM_undefined_F8_R0_C6" style="width: 300px;">
|
|
113
|
+
<option value="AC">Acre</option>
|
|
114
|
+
<option value="AL">Alagoas</option>
|
|
115
|
+
<option value="AP">Amapá</option>
|
|
116
|
+
<option value="AM">Amazonas</option>
|
|
117
|
+
<option value="BA">Bahia</option>
|
|
118
|
+
<option value="CE">Ceará</option>
|
|
119
|
+
<option value="DF">Distrito Federal</option>
|
|
120
|
+
<option value="ES">Espírito Santo</option>
|
|
121
|
+
<option value="GO">Goías</option>
|
|
122
|
+
<option value="MA">Maranhão</option>
|
|
123
|
+
<option value="MT">Mato Grosso</option>
|
|
124
|
+
<option value="MS">Mato Grosso do Sul</option>
|
|
125
|
+
<option value="MG">Minas Gerais</option>
|
|
126
|
+
<option value="PA">Pará</option>
|
|
127
|
+
<option value="PB">Paraíba</option>
|
|
128
|
+
<option value="PR">Paraná</option>
|
|
129
|
+
<option value="PE">Pernambuco</option>
|
|
130
|
+
<option value="PI">Piauí</option>
|
|
131
|
+
<option value="RJ">Rio de Janeiro</option>
|
|
132
|
+
<option value="RN">Rio Grande do Norte</option>
|
|
133
|
+
<option value="RS">Rio Grande do Sul</option>
|
|
134
|
+
<option value="RO">Rondônia</option>
|
|
135
|
+
<option value="RR">Roraima</option>
|
|
136
|
+
<option value="SC">Santa Catarina</option>
|
|
137
|
+
<option value="SP">São Paulo</option>
|
|
138
|
+
<option value="SE">Sergipe</option>
|
|
139
|
+
<option value="TO">Tocantins</option>
|
|
140
|
+
</select></div>
|
|
141
|
+
</td>
|
|
142
|
+
<td align="left"><input id="FORM_undefined_F8_R0_C7" value="01310-200" style="width: 150px;"></td>
|
|
143
|
+
<td align="left">
|
|
144
|
+
<div><span id="Last_FORM_undefined_F8_R0_C8" style="visibility: hidden;">Outros</span><select
|
|
145
|
+
id="FORM_undefined_F8_R0_C8" style="width: 300px;">
|
|
146
|
+
<option value="Brasil">Brasil</option>
|
|
147
|
+
<option value="Outros">Outros</option>
|
|
148
|
+
</select></div>
|
|
149
|
+
</td>
|
|
150
|
+
<td align="left"><button id="Del_0_FORM_undefined_F8" class="btn--flat nudge--right"><i
|
|
151
|
+
class="fa fa-trash"></i>Delete</button></td>
|
|
152
|
+
</tr>
|
|
153
|
+
</tbody>
|
|
154
|
+
</table>
|
|
155
|
+
</div>
|
|
156
|
+
<p></p>
|
|
157
|
+
<p id="Total_FORM_undefined_F8" style="visibility: hidden;">1</p>
|
|
158
|
+
</div>
|
|
159
|
+
<div xclassname="card">
|
|
160
|
+
<div>Solicitacoes</div><button id="Novo_FORM_undefined_F9" type="button" class="btn--raised tooltip"
|
|
161
|
+
data-text="Novo_FORM_undefined_F9">New </button><span> </span>
|
|
162
|
+
<h6></h6>
|
|
163
|
+
<div xstyle="[object Object]">
|
|
164
|
+
<table class="hoverable" xwidth="99%" xstyle="[object Object]">
|
|
165
|
+
<thead>
|
|
166
|
+
<tr class="table-header">
|
|
167
|
+
<th></th>
|
|
168
|
+
<th x="center" align="left"> <b>seq</b></th>
|
|
169
|
+
<th x="center" align="left"> <b>data</b></th>
|
|
170
|
+
<th x="center" align="left"> <b>codtiposolic</b></th>
|
|
171
|
+
<th x="center" align="left"> <b>tiposolicitacao</b></th>
|
|
172
|
+
<th x="center" align="left"> <b>extra1</b></th>
|
|
173
|
+
<th x="center" align="left"> <b>extra2</b></th>
|
|
174
|
+
<th align="center"><b></b></th>
|
|
175
|
+
</tr>
|
|
176
|
+
</thead>
|
|
177
|
+
<tbody>
|
|
178
|
+
<tr>
|
|
179
|
+
<td align="center" class="nudge--left "> 1. </td>
|
|
180
|
+
<td align="left">NAtr:seq</td>
|
|
181
|
+
<td align="left"><input type="date" value="2025-11-08"></td>
|
|
182
|
+
<td align="left">NAtr:codtiposolic</td>
|
|
183
|
+
<td align="left">NAtr:tiposolicitacao</td>
|
|
184
|
+
<td align="left"><input id="FORM_undefined_F9_R0_C4" value="visita" style="width: 150px;"></td>
|
|
185
|
+
<td align="left"><input id="FORM_undefined_F9_R0_C5" value="2023-12-10"
|
|
186
|
+
style="width: 150px;"></td>
|
|
187
|
+
<td align="left"><button id="Del_0_FORM_undefined_F9" class="btn--flat nudge--right"><i
|
|
188
|
+
class="fa fa-trash"></i>Delete</button></td>
|
|
189
|
+
</tr>
|
|
190
|
+
<tr>
|
|
191
|
+
<td align="center" class="nudge--left "> 2. </td>
|
|
192
|
+
<td align="left" id="FORM_undefined_F9_R1_C0">0 </td>
|
|
193
|
+
<td align="left"><input type="date" value="2025-11-08T21:33:31.479Z"></td>
|
|
194
|
+
<td align="left">
|
|
195
|
+
<div><span id="Last_FORM_undefined_F9_R1_C2" style="visibility: hidden;">4</span><select
|
|
196
|
+
id="FORM_undefined_F9_R1_C2" style="width: 300px;">
|
|
197
|
+
<option value="0">Reemissão de Boleto</option>
|
|
198
|
+
<option value="1">Mudança Endereço de Correspondência</option>
|
|
199
|
+
<option value="2">Histórico de Pagamento</option>
|
|
200
|
+
<option value="3">Ata de Reunião</option>
|
|
201
|
+
<option value="4">Outras Solicitacoes</option>
|
|
202
|
+
</select></div>
|
|
203
|
+
</td>
|
|
204
|
+
<td align="left">0</td>
|
|
205
|
+
<td align="left"><input id="FORM_undefined_F9_R1_C4" value="visita" style="width: 150px;"></td>
|
|
206
|
+
<td align="left"><input id="FORM_undefined_F9_R1_C5" value="2023-12-10T00:00:00"
|
|
207
|
+
style="width: 150px;"></td>
|
|
208
|
+
<td align="left"><button id="Del_1_FORM_undefined_F9" class="btn--flat nudge--right"><i
|
|
209
|
+
class="fa fa-trash"></i>Delete</button></td>
|
|
210
|
+
</tr>
|
|
211
|
+
</tbody>
|
|
212
|
+
</table>
|
|
213
|
+
</div>
|
|
214
|
+
<p></p>
|
|
215
|
+
<p id="Total_FORM_undefined_F9" style="visibility: hidden;">2</p>
|
|
216
|
+
</div>
|
|
217
|
+
<div xclassname="card">
|
|
218
|
+
<div>Carrinho</div><button id="Novo_FORM_undefined_F10" type="button" class="btn--raised tooltip"
|
|
219
|
+
data-text="Novo_FORM_undefined_F10">New </button><span> </span>
|
|
220
|
+
<h6></h6>
|
|
221
|
+
<div xstyle="[object Object]">
|
|
222
|
+
<table class="hoverable" xwidth="99%" xstyle="[object Object]">
|
|
223
|
+
<thead>
|
|
224
|
+
<tr class="table-header">
|
|
225
|
+
<th></th>
|
|
226
|
+
<th x="center" align="left"> <b>codpprod</b></th>
|
|
227
|
+
<th x="center" align="left"> <b>Produto</b></th>
|
|
228
|
+
<th x="center" align="left"> <b>Codigo</b></th>
|
|
229
|
+
<th x="center" align="left"> <b>Preço</b></th>
|
|
230
|
+
<th x="center" align="left"> <b>Qtd</b></th>
|
|
231
|
+
<th x="center" align="left"> <b>Preço Total</b></th>
|
|
232
|
+
<th align="center"><b></b></th>
|
|
233
|
+
</tr>
|
|
234
|
+
</thead>
|
|
235
|
+
<tbody></tbody>
|
|
236
|
+
</table>
|
|
237
|
+
</div>
|
|
238
|
+
<p></p>
|
|
239
|
+
<p id="Total_FORM_undefined_F10" style="visibility: hidden;">0</p>
|
|
240
|
+
</div>
|
|
241
|
+
</fieldset>
|
|
242
|
+
<div> </div>
|
|
243
|
+
<fieldset class="actions"><button id="Save_FORM_undefined" class="primary shadowed small"> Salvar </button><span>
|
|
244
|
+
</span><span> </span></fieldset>
|
|
245
|
+
<h5 style="color: red;"></h5>
|
|
246
|
+
</section>
|
|
247
|
+
</main>
|
|
248
|
+
</body>
|
|
249
|
+
|
|
250
|
+
</html>
|
|
@@ -39,6 +39,13 @@ class XFormEdit extends React.Component {
|
|
|
39
39
|
//this.props.notifyChangeFn();
|
|
40
40
|
}
|
|
41
41
|
|
|
42
|
+
capitalize = (text) => {
|
|
43
|
+
if (typeof text !== 'string' || text.length === 0) {
|
|
44
|
+
return text;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
return text[0].toUpperCase() + text.substring(1);
|
|
48
|
+
}
|
|
42
49
|
|
|
43
50
|
render() {
|
|
44
51
|
if (!this.props.metadata.fields)
|
|
@@ -53,7 +60,7 @@ class XFormEdit extends React.Component {
|
|
|
53
60
|
if (v.type === 'l') /*list*/ {
|
|
54
61
|
return <React.Fragment key={i}>
|
|
55
62
|
<div xclassName="card">
|
|
56
|
-
<div>{v.label}
|
|
63
|
+
<div>{this.capitalize(v.label)}:</div>
|
|
57
64
|
<XSelect3 list={v.lov} value={this.props.formData[v.attr]} disabled={v.readOnly} onChange={(ev) => this.props.formData[v.attr] = ev.target.value} />
|
|
58
65
|
<br />
|
|
59
66
|
<p> </p>
|
|
@@ -64,7 +71,8 @@ class XFormEdit extends React.Component {
|
|
|
64
71
|
if (v.type === 'a') /* array */ {
|
|
65
72
|
return (
|
|
66
73
|
<React.Fragment key={i}>
|
|
67
|
-
<div
|
|
74
|
+
<div>
|
|
75
|
+
<div>{this.capitalize(v.label)}:</div>
|
|
68
76
|
<JZInPlaceListComponent _id={this.props.id + '_F' + i} textlabels={true} list={this.props.formData[v.attr]} listConfig={v.listConfig} newItemFN={v.newItemFN} />
|
|
69
77
|
</div>
|
|
70
78
|
</React.Fragment>)
|
|
@@ -73,7 +81,7 @@ class XFormEdit extends React.Component {
|
|
|
73
81
|
if (v.type === 'd') /* date */ {
|
|
74
82
|
return (
|
|
75
83
|
<React.Fragment key={i}>
|
|
76
|
-
<div className=""><div>{v.label}
|
|
84
|
+
<div className=""><div>{this.capitalize(v.label)}:</div>
|
|
77
85
|
<XDateSelect id={this.props.id + '_F' + i} width={v.width} label={v.label} disabled={v.readOnly} value={this.props.formData[v.attr]} onChange={(v) => this.props.formData[v.attr] = v} />
|
|
78
86
|
</div>
|
|
79
87
|
</React.Fragment>)
|
|
@@ -82,7 +90,7 @@ class XFormEdit extends React.Component {
|
|
|
82
90
|
if (v.type === 'c') /* check */ {
|
|
83
91
|
return (
|
|
84
92
|
<React.Fragment key={i}>
|
|
85
|
-
<div className=""><div>{v.label}
|
|
93
|
+
<div className=""><div>{this.capitalize(v.label)}:</div>
|
|
86
94
|
<XCheckbox id={this.props.id + '_F' + i} width={v.width} label={v.label} disabled={v.readOnly} value={this.props.formData[v.attr]} onChange={(v) => this.props.formData[v.attr] = v} />
|
|
87
95
|
</div>
|
|
88
96
|
</React.Fragment>)
|
|
@@ -91,7 +99,7 @@ class XFormEdit extends React.Component {
|
|
|
91
99
|
if (v.type === 'file') /* file */ {
|
|
92
100
|
return (
|
|
93
101
|
<React.Fragment key={i}>
|
|
94
|
-
<div className=""><div>{v.label}
|
|
102
|
+
<div className=""><div>{this.capitalize(v.label)}:</div>
|
|
95
103
|
<p>{this.props.formData[v.attr]?this.props.formData[v.attr]:"No file selected"}</p>
|
|
96
104
|
<XButton id={this.props.id + '_F' + i} attachFile={true} disabled={v.readOnly} onClick={(e)=>{this.props.formData[v.attr]=e.target.files[0].name;this.props.formData.filedata=e.target.files[0]}} textlabel='Select File'></XButton>
|
|
97
105
|
</div>
|
|
@@ -99,7 +107,7 @@ class XFormEdit extends React.Component {
|
|
|
99
107
|
} else
|
|
100
108
|
return (
|
|
101
109
|
<React.Fragment key={i} >{DEBUG_ID2 && '[' + this.props.id + '_F' + i + ']'}
|
|
102
|
-
<XInputExternal type={v.type == 'n' ? 'number' : ''} id={this.props.id + '_F' + i} width={v.width} label={v.label} readOnly={v.readOnly} value={this.props.formData[v.attr]} /*onChangeNew={(value)=>this.props.formData[v.attr]=ev.target.value}*/ onChangeNew={this.inputChangeNew} context={{ item: this.props.formData, v: v }} />
|
|
110
|
+
<XInputExternal type={v.type == 'n' ? 'number' : ''} id={this.props.id + '_F' + i} width={v.width} label={this.capitalize(v.label)+":"} readOnly={v.readOnly} value={this.props.formData[v.attr]} /*onChangeNew={(value)=>this.props.formData[v.attr]=ev.target.value}*/ onChangeNew={this.inputChangeNew} context={{ item: this.props.formData, v: v }} />
|
|
103
111
|
</React.Fragment>)
|
|
104
112
|
}
|
|
105
113
|
})}
|
|
@@ -99,6 +99,12 @@ function nfmtM(n) {
|
|
|
99
99
|
this.evtRefresh();
|
|
100
100
|
}
|
|
101
101
|
|
|
102
|
+
capitalize = (text) => {
|
|
103
|
+
if (typeof text !== 'string' || text.length === 0) {
|
|
104
|
+
return text;
|
|
105
|
+
}
|
|
106
|
+
}
|
|
107
|
+
|
|
102
108
|
render () {
|
|
103
109
|
return (
|
|
104
110
|
<React.Fragment>
|
|
@@ -110,14 +116,16 @@ function nfmtM(n) {
|
|
|
110
116
|
<tr key={'header'+this.props.id} className="table-header">
|
|
111
117
|
<th key={'0'+this.props.id}></th>
|
|
112
118
|
{this.props.metadata.fields.filter((item)=>{return(item.show)}).map((v)=> {
|
|
113
|
-
return <th key={v.label+this.props.id} x='center' align={v.align} className={v.className} > <b>{v.label}</b></th>
|
|
119
|
+
return <th key={v.label+this.props.id} x='center' align={v.align} className={v.className} > <b>{this.capitalize(v.label)}</b></th>
|
|
114
120
|
})}
|
|
115
121
|
<th key={'actions'} align='center'><b></b></th>
|
|
116
122
|
</tr>
|
|
117
123
|
</thead>
|
|
118
124
|
<tbody>
|
|
119
125
|
{this.props.list.map((item,index,arr)=> {
|
|
120
|
-
return <XTableCell key={index} item={item} index={index} lastIndex={arr.length} {...this.props} notifyChangeFn={this.cellChanged} api={this.props.api} /> })
|
|
126
|
+
return <XTableCell key={index} item={item} index={index} lastIndex={arr.length} {...this.props} notifyChangeFn={this.cellChanged} api={this.props.api} /> })
|
|
127
|
+
}
|
|
128
|
+
{(this.props.list.length==0)&&<tr><td></td></tr>}
|
|
121
129
|
</tbody>
|
|
122
130
|
</table>
|
|
123
131
|
</div>
|
package/package.json
CHANGED
package/releasenotes.txt
CHANGED
|
@@ -20,6 +20,8 @@ WebComponents
|
|
|
20
20
|
0.1.28: show errors / show stack unescape
|
|
21
21
|
0.1.31: restAdapter: call validate from dto
|
|
22
22
|
0.1.40: searchComp & searchAdapter
|
|
23
|
+
0.1.45: search, errors, onKey13, validate
|
|
24
|
+
0.1.47: capitalize, tableembpty, label com ":", select align, bug date
|
|
23
25
|
|
|
24
26
|
npm login
|
|
25
27
|
npm publish --access public
|