API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Apr 27th, 2017
78
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 21.32 KB | None | 0 0
raw download clone embed print report
  1. <form class="form user-form clearfix" (ngSubmit)="addCE(formAddCE.value)" [formGroup]="formAddCE" novalidate
  2. autocomplete="off">
  3. <div
  4. class="col-sm-14 col-lg-10 col-xs-14 col-sm-offset-1 col-md-12 col-lg-offset-3 col-md-offset-2 col-xs-offset-1 content-padding-global form-client-col">
  5. <!-- Geral -->
  6. <div class="row cad-geral">
  7. <div class="col-lg-16 col-md-16 col-sm-16 col-xs-16">
  8. <h3>Geral</h3>
  9. </div>
  10. <div class="col-lg-3 col-md-3 col-sm-3 col-xs-16">
  11. <div class="form-group"
  12. [ngClass]="{'showInputMsg':formAddCE.controls.cpf.errors && formAddCE.controls.cpf.errors.showWarning}">
  13. <label for="cpf">CPF</label>
  14. <input
  15. type="tel"
  16. class="form-control input-layout"
  17. id="cpf"
  18. #cpfEl
  19. maxlength="14"
  20. app-ui-cpf
  21. [formControl]="formAddCE.get('cpf')"
  22. [(ngModel)]="selectedClient.cpf"/>
  23. <app-control-messages [cpfInput]="cpfElForValidation"
  24. [element]="cpfEl"
  25. [control]="formAddCE.controls.cpf"></app-control-messages>
  26. </div>
  27. </div>
  28.  
  29. <div class="col-lg-5 col-md-5 col-sm-13 col-xs-16">
  30. <div class="form-group"
  31. [ngClass]="{'showInputMsg':formAddCE.controls.nome.errors && formAddCE.controls.nome.errors.showWarning}">
  32. <label for="nome" class="label-invalid-required">Nome</label>
  33. <input
  34. type="text"
  35. class="form-control input-layout"
  36. id="nome"
  37. #nomeEl
  38. [(ngModel)]="selectedClient.nome"
  39. [formControl]="formAddCE.get('nome')"
  40. (blur)="makeNick(selectedClient.nome)"/>
  41. <app-control-messages [element]="nomeEl"
  42. [control]="formAddCE.controls.nome"></app-control-messages>
  43. </div>
  44. </div>
  45.  
  46. <div class="col-lg-3 col-md-3 col-sm-8 col-xs-8">
  47. <div class="form-group">
  48. <label for="apelido">Apelido</label>
  49. <input
  50. type="text"
  51. class="form-control input-layout"
  52. id="apelido"
  53. [formControl]="formAddCE.get('apelido')"
  54. [(ngModel)]="selectedClient.apelido"/>
  55. </div>
  56. </div>
  57.  
  58. <div class="col-lg-3 col-md-3 col-sm-5 col-xs-5">
  59. <div class="form-group">
  60. <label for="nascimento">Nascimento</label>
  61. <datetime id="nascimento"
  62. #dataEl
  63. (dateChange)="$event? touched = true: touched=false"
  64. [timepicker]="false" placeholder="Digite ou selecione uma data"
  65. [datepicker]="datepickerOpts" [(ngModel)]="selectedClient.nascimento"
  66. [formControl]="formAddCE.get('nascimento')"></datetime>
  67. </div>
  68. </div>
  69.  
  70. <div class="col-lg-2 col-md-2 col-sm-3 col-xs-3">
  71. <div class="form-group">
  72. <label class="label-invalid-required">Sexo</label>
  73. <table>
  74. <tr>
  75. <td>
  76. <div class="radio radio-darkblue">
  77. <input id="sexo_m" type="radio" [formControl]="formAddCE.get('sexo')"
  78. [(ngModel)]="selectedClient.sexo" name="sexo"
  79. value="M">
  80. <label class="fake-check" for="sexo_m">M</label>
  81. </div>
  82. </td>
  83. <td>
  84. <div class="radio radio-darkblue">
  85. <input id="sexo_f" type="radio" [(ngModel)]="selectedClient.sexo"
  86. [formControl]="formAddCE.get('sexo')" name="sexo"
  87. value="F">
  88. <label class="fake-check" for="sexo_f">F</label>
  89. </div>
  90. </td>
  91. </tr>
  92. </table>
  93. </div>
  94. </div>
  95.  
  96. </div><!-- Geral -->
  97.  
  98. <!-- Emails -->
  99. <div class="row cad-emails">
  100. <div class="col-lg-16 col-md-16 col-sm-16 col-xs-16">
  101. <h3>Emails</h3>
  102.  
  103. <!-- Emails Repeat Start -->
  104. <div class="row animHeight"
  105. *ngFor="let item of formAddCE.controls.emails.controls; let i = index">
  106. <div class="col-lg-1 col-md-1 col-sm-1 col-xs-2">
  107. <div class="form-group">
  108. <label>
  109. <a href tabindex="-1"
  110. (click)="selectedClient.emailPreferencial=i; $event.preventDefault()"
  111. [ngClass]="{'icon icon-estrela icon-check': selectedClient.emailPreferencial == i, 'icon icon-estrela-vazada icon-uncheck': selectedClient.emailPreferencial != i}">
  112. </a>
  113. </label>
  114. </div>
  115. </div>
  116. <div formArrayName="emails">
  117. <div [ngClass]="{'fadeItem':item.excluir}" class="col-lg-9 col-md-14 col-sm-14 col-xs-12">
  118. <div class="form-group"
  119. [ngClass]="{'showInputMsg':item.controls.email.errors && item.controls.email.errors.showWarning}">
  120. <label for="emails_{{i}}">Email</label>
  121. <input
  122. type="text"
  123. id="emails_{{i}}"
  124. #emailEl
  125. app-ui-mailgun
  126. (didYoumean)="makHint.hint['emails'+i]=$event"
  127. class="form-control input-layout"
  128. [(ngModel)]="selectedClient.emails['emails'+i]"
  129. [formControl]="item.controls.email"
  130. autocapitalize="off"/>
  131. <app-mailgun-hint [ctrl]="item.controls.email"
  132. [index]="i" #makHint></app-mailgun-hint>
  133. <app-control-messages [element]="emailEl"
  134. [control]="item.controls.email"></app-control-messages>
  135. </div>
  136. </div>
  137. </div>
  138.  
  139. <div class="col-lg-1 col-md-1 col-sm-1 col-xs-2">
  140. <div class="form-group">
  141. <label class="edit-form-pop">
  142. <template #popTemplate>
  143. <ul class="action-links">
  144. <li><a class="action" (click)="removeEmail(i)">{{(item.excluir) ? 'Cancelar excluir':'Excluir'}}</a>
  145. </li>
  146. </ul>
  147. </template>
  148. <a #pop="bs-popover" href (click)="$event.preventDefault()" class="icon icon-info-dots"
  149. [popover]="popTemplate"
  150. placement="left"
  151. triggers="click"></a>
  152. </label>
  153. </div>
  154. </div>
  155. </div>
  156. <!-- Emails Repeat End -->
  157. <div class="row">
  158. <div class="col-lg-16 col-md-16 col-sm-16 col-xs-16">
  159. <div class="form-group">
  160. <a href tabindex="-1" (click)="addEmail(); $event.preventDefault()"
  161. class="icon-mais-bold add-item text-nowrap">Adicionar
  162. email</a>
  163. </div>
  164. </div>
  165. </div>
  166.  
  167. </div>
  168. </div><!-- Emails -->
  169.  
  170. <!-- Telefones -->
  171. <div class="row cad-telefones">
  172. <div class="col-lg-16 col-md-16 col-sm-16 col-xs-16">
  173. <h3>Telefones</h3>
  174.  
  175. <!-- Telefones Repeat Start -->
  176. <div class="row animHeight" *ngFor="let item of formAddCE.controls.telefones.controls; let i = index">
  177. <div class="col-lg-1 col-md-1 col-sm-1 col-xs-2">
  178. <div class="form-group">
  179. <label>
  180. <a href tabindex="-1"
  181. (click)="selectedClient.telefonePreferencial=i; $event.preventDefault()"
  182. [ngClass]="{'icon icon-estrela icon-check': selectedClient.telefonePreferencial == i, 'icon icon-estrela-vazada icon-uncheck': selectedClient.telefonePreferencial != i }">
  183. </a>
  184. </label>
  185. </div>
  186. </div>
  187.  
  188. <div formArrayName="telefones">
  189. <div [ngClass]="{'fadeItem':item.excluir}" class="col-lg-9 col-md-9 col-sm-12 col-xs-12">
  190. <div class="row">
  191. <div class="col-lg-3 col-md-3 col-sm-3 col-xs-3">
  192. <div class="form-group"
  193. [ngClass]="{'showInputMsg':item.controls.ddd.errors && item.controls.ddd.errors.showWarning}">
  194. <label for="ddd_{{i}}"
  195. [ngClass]="{'label-invalid-required': isRequiredTel(item.controls)}">DDD</label>
  196. <input
  197. type="tel"
  198. class="form-control input-layout"
  199. id="ddd_{{i}}"
  200. [required]="isRequiredTel(item.controls)"
  201. [(ngModel)]="selectedClient.telefones['ddd'+i]"
  202. maxlength="2"
  203. #dddEl
  204. [formControl]="item.controls.ddd"
  205. (keyup)="dddKeyUp($event, 'telnumero_'+i, item.controls.ddd.value)"
  206. ui-digits/>
  207. <app-control-messages [element]="dddEl"
  208. [control]="item.controls.ddd"></app-control-messages>
  209. </div>
  210. </div>
  211.  
  212. <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
  213. <div class="form-group"
  214. [ngClass]="{'showInputMsg':item.controls.telefone.errors && item.controls.telefone.errors.showWarning}">
  215. <label for="telnumero_{{i}}"
  216. [ngClass]="{'label-invalid-required': isRequiredTel(item.controls)}">Telefone</label>
  217. <input
  218. #telEl
  219. type="tel"
  220. class="form-control input-layout"
  221. id="telnumero_{{i}}"
  222. [required]="isRequiredTel(item.controls)"
  223. [(ngModel)]="selectedClient.telefones['numero'+i]"
  224. maxlength="10"
  225. (blur)="updateTelefoneValidity()"
  226. [formControl]="item.controls.telefone"
  227. (keydown)="selectedClient.telefones['tipo'+i] = autoCelClass(selectedClient.telefones['numero'+i])"
  228. app-ui-phone/>
  229. <app-control-messages [element]="telEl"
  230. [telInput]="telElForValidation"
  231. [ddd]="item.controls.ddd"
  232. [control]="item.controls.telefone"></app-control-messages>
  233. </div>
  234. </div>
  235.  
  236. <div class="col-lg-7 col-md-7 col-sm-7 col-xs-7">
  237. <div class="form-group"
  238. [ngClass]="{'showInputMsg':item.controls.tipo.errors && item.controls.tipo.errors.showWarning}">
  239. <label
  240. for="tipotel_{{i}}"
  241. [ngClass]="{'label-invalid-required': isRequiredTel(item.controls)}">Tipo</label>
  242. <ng-selectize id="tipotel_{{i}}" [config]="configTipo"
  243. [options]="optionsTipoTel"
  244. [placeholder]="'Escolha'"
  245. #tipoTelEl
  246. [formControl]="item.controls.tipo"
  247. [required]="isRequiredTel(item.controls)"
  248. [(ngModel)]="selectedClient.telefones['tipo'+i]"></ng-selectize>
  249. <app-control-messages [element]="tipoTelEl"
  250. [itemClass]="'ui-validation-message-combo-box'"
  251. [control]="item.controls.tipo"></app-control-messages>
  252. </div>
  253. </div>
  254. </div>
  255. </div>
  256. </div>
  257.  
  258. <div class="col-lg-1 col-md-1 col-sm-1 col-xs-2">
  259. <div class="form-group">
  260. <label class="edit-form-pop">
  261. <template #popTemplate>
  262. <ul class="action-links">
  263. <li><a class="action" (click)="removeTelefone(i)">Excluir</a>
  264. </li>
  265. </ul>
  266. </template>
  267. <a #pop="bs-popover" href (click)="$event.preventDefault()" class="icon icon-info-dots"
  268. [popover]="popTemplate"
  269. placement="left"
  270. triggers="click"></a>
  271. </label>
  272. </div>
  273. </div>
  274. </div>
  275. <!-- Telefones Repeat End -->
  276. <div class="row">
  277. <div class="col-lg-16 col-md-16 col-sm-16 col-xs-16">
  278. <div class="form-group">
  279. <a href tabindex="-1" (click)="addTelefone(); $event.preventDefault()"
  280. class="icon-mais-bold add-item text-nowrap">Adicionar
  281. Telefone</a>
  282. </div>
  283. </div>
  284. </div>
  285.  
  286. </div>
  287. </div><!-- Telefones -->
  288.  
  289. <!-- Endereços -->
  290. <div class="row cad-telefones">
  291. <div class="col-lg-16 col-md-16 col-sm-16 col-xs-16">
  292. <h3>Endereços</h3>
  293.  
  294. <!-- Endereços Repeat Start -->
  295. <div class="row animHeight" *ngFor="let item of formAddCE.controls.enderecos.controls; let i = index">
  296. <div class="col-lg-1 col-md-1 col-sm-1 col-xs-2">
  297. <div class="form-group">
  298. <label>
  299. <a href tabindex="-1"
  300. (click)="selectedClient.enderecoPreferencial=1; $event.preventDefault()"
  301. [ngClass]="{'icon icon-estrela icon-check': selectedClient.enderecoPreferencial == i, 'icon icon-estrela-vazada icon-uncheck': selectedClient.enderecoPreferencial != i }">
  302. </a>
  303. </label>
  304. </div>
  305. </div>
  306.  
  307. <div [ngClass]="{'fadeItem':item.excluir}" class="col-lg-14 col-md-14 col-sm-14 col-xs-12">
  308. <div class="row">
  309.  
  310. <!-- Tipo Endereço -->
  311. <div class="col-lg-3 col-md-3 col-sm-4 col-xs-6">
  312. <div class="form-group"
  313. [ngClass]="{'showInputMsg':formAddCE.controls.enderecos.errors && formAddCE.controls.enderecos.errors.showWarning}">
  314. <label for="tipoend_{{i}}"
  315. [ngClass]="{'label-invalid-required':requiredAdress(item)}">Tipo</label>
  316. <ng-selectize *ngIf="item.controls.tipo" id="tipoend_{{i}}" [config]="configTipo"
  317. [options]="optionsTipoEndereco"
  318. [formControl]="item.controls.tipo"
  319. [required]="requiredAdress(item)"></ng-selectize>
  320. </div>
  321. </div>
  322.  
  323. <!-- Cep -->
  324. <div class="col-lg-3 col-md-3 col-sm-3 col-xs-7">
  325. <div class="form-group"
  326. [ngClass]="{'showInputMsg':formAddCE.controls.enderecos.errors && formAddCE.controls.enderecos.errors.showWarning}">
  327. <label for="cep_{{i}}"
  328. [ngClass]="{'label-invalid-required':requiredAdress(item)}">CEP</label>
  329. <input
  330. type="tel"
  331. name="cep_{{i}}"
  332. class="form-control input-layout"
  333. id="cep_{{i}}"
  334. maxlength="9"
  335. [formControl]="item.controls.cep"
  336. [(ngModel)]="selectedClient.enderecos['cep'+i]"
  337. [required]="requiredAdress(item)"/>
  338. </div>
  339. </div>
  340.  
  341. <!-- Estado -->
  342. <div class="col-lg-1 col-md-1 col-sm-2 col-xs-3">
  343. <div class="form-group"
  344. [ngClass]="{'showInputMsg':formAddCE.controls.enderecos.errors && formAddCE.controls.enderecos.errors.showWarning}">
  345. <label [ngClass]="{'label-invalid-required':requiredAdress(item)}"
  346. for="{{ 'estado'+i }}">UF</label>
  347. <input [formControl]="item.controls.uf"
  348. [typeahead]="states"
  349. [required]="requiredAdress(item)"
  350. [(ngModel)]="selectedClient.enderecos['estado'+i]"
  351. id="{{ 'estado'+i }}"
  352. typeaheadMinLength="0"
  353. class="form-control input-layout">
  354. </div>
  355. </div>
  356.  
  357. <!-- Cidade -->
  358. <div class="col-lg-4 col-md-4 col-sm-4 col-xs-8">
  359. <div class="form-group"
  360. [ngClass]="{'showInputMsg':formAddCE.controls.enderecos.errors && formAddCE.controls.enderecos.errors.showWarning}">
  361. <label for="cidade_{{i}}"
  362. [ngClass]="{'label-invalid-required':requiredAdress(item)}">Cidade</label>
  363. <input [typeahead]="cities"
  364. id="cidade_{{i}}"
  365. [formControl]="item.controls.cidade"
  366. [required]="requiredAdress(item)"
  367. [(ngModel)]="selectedClient.enderecos['cidade'+i]"
  368. typeaheadMinLength="0"
  369. class="form-control input-layout">
  370. </div>
  371. </div>
  372.  
  373. <!-- Bairro -->
  374. <div class="col-lg-5 col-md-5 col-sm-3 col-xs-8">
  375. <div class="form-group">
  376. <label for="bairro[{{i}}]">Bairro</label>
  377. <input [typeahead]="bairros"
  378. id="bairro[{{i}}]"
  379. [formControl]="item.controls.bairro"
  380. [(ngModel)]="selectedClient.enderecos['bairro'+i]"
  381. typeaheadMinLength="0"
  382. class="form-control input-layout">
  383. </div>
  384. </div>
  385. </div>
  386. <div class="row">
  387. <!-- Tipo Logradouro -->
  388. <div class="col-lg-2 col-md-2 col-sm-3 col-xs-5">
  389. <div class="form-group">
  390. <label for="tipoLogradouro_{{i}}">Tipo</label>
  391. <input [typeahead]="tipoLogradouro"
  392. id="tipoLogradouro_{{i}}"
  393. [formControl]="item.controls.tipoLogradouro"
  394. [(ngModel)]="selectedClient.enderecos['tipoLogradouro'+i]"
  395. typeaheadMinLength="0"
  396. class="form-control input-layout">
  397. </div>
  398. </div>
  399.  
  400. <!-- Logradouro -->
  401. <div class="col-lg-8 col-md-8 col-sm-10 col-xs-8">
  402. <div class="form-group">
  403. <label for="logradouro_{{i}}">Logradouro</label>
  404. <input
  405. type="text"
  406. id="logradouro_{{i}}"
  407. class="form-control input-layout"
  408. [formControl]="item.controls.logradouro"
  409. [(ngModel)]="selectedClient.enderecos['logradouro'+i]"
  410. maxlength="1000"/>
  411. </div>
  412. </div>
  413.  
  414. <!-- Número -->
  415. <div ui-fix-tel-inputs class="col-lg-2 col-md-2 col-sm-3 col-xs-3">
  416. <div class="form-group">
  417. <label for="endnumero_{{i}}">Número</label>
  418. <input
  419. type="tel"
  420. data-text="true"
  421. class="form-control input-layout"
  422. id="endnumero_{{i}}"
  423. [formControl]="item.controls.numero"
  424. [(ngModel)]="selectedClient.enderecos['endNumero'+i]"
  425. maxlength="30">
  426. </div>
  427. </div>
  428.  
  429. <!-- Complemento -->
  430. <div class="col-lg-4 col-md-4 col-sm-16 col-xs-16">
  431. <div class="form-group">
  432. <label for="complemento_{{i}}">Complemento</label>
  433. <input
  434. type="text"
  435. class="form-control input-layout"
  436. id="complemento_{{i}}"
  437. [formControl]="item.controls.complemento"
  438. [(ngModel)]="selectedClient.enderecos['complemento'+i]"
  439. maxlength="30">
  440. </div>
  441. </div>
  442. </div>
  443. </div>
  444.  
  445. <div class="col-lg-1 col-md-1 col-sm-1 col-xs-2">
  446. <div class="form-group">
  447. <label class="edit-form-pop">
  448. <template #popTemplate>
  449. <ul class="action-links">
  450. <li><a class="action" (click)="removeEndereco(i)">Excluir</a>
  451. </li>
  452. </ul>
  453. </template>
  454. <a #pop="bs-popover" href (click)="$event.preventDefault()" class="icon icon-info-dots"
  455. [popover]="popTemplate"
  456. placement="left"
  457. triggers="click"></a>
  458. </label>
  459. </div>
  460. </div>
  461. </div>
  462. <!-- Endereços Repeat End -->
  463.  
  464. <div class="row">
  465. <div class="col-lg-16 col-md-16 col-sm-16 col-xs-16">
  466. <div class="form-group">
  467. <a href tabindex="-1" (click)="addEndereco(); $event.preventDefault()"
  468. class="icon-mais-bold add-item text-nowrap">Adicionar
  469. Endereço</a>
  470. </div>
  471. </div>
  472. </div>
  473.  
  474. </div>
  475. </div><!-- Endereços -->
  476. </div>
  477. <div class="user-footer">
  478. <div class="col-lg-16 col-md-16 col-sm-16 col-xs-16 text-right">
  479. <div class="btn-user-row">
  480. <button type="button" (click)="cadCancel()" class="btn btn-default btn-md">Cancelar</button>
  481. <ui-set-touched
  482. [btnText]="'clientes.clienteNovo.adicionar' | translate"
  483. [canSend]="formAddCE.valid"
  484. [form]="formAddCE"
  485. [btnType]="'submit'"></ui-set-touched>
  486. </div>
  487. </div>
  488. </div>
  489. </form>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!