UI: Formulário para criação de banner tipo A v1

[gustavorps]

Já possuo parte do código mas ainda não enviei para o pull request nesse diretório

Como rodar:

# shell
cd site/components/form-adv
python3 -m http.server
# Serving HTTP on 0.0.0.0 port 8000 (http://0.0.0.0:8000/) ...

Histórias de Usuário

Gerar banner em poucas etapas
Como um webmaster que gerencia um website relacionado a saúde, eu quero "embedar" uma página/componente que seja possível gerar um banner de pedido de doação em poucas etapas através de um dispositivo móvel ou desktop

Exemplo

Comentários

@mikaelhadler dá essa moral mora nós. Qualquer duvida só me comentar na issue

[verneck]

irá fazer com vue.js? @mikaelhadler @gustavorps

[mikaelhadler]

exatamente @verneck .

[mikaelhadler]

Gostaria de poder utilizar um recurso diferente do atual para a estilização dos componentes.

Gosto muito da proposta do Bulma.io, como ele fornece vários componentes pré prontos para resoluções full width e full height acho que seria bem prático utilizar junto do Full Page conforme vocês já vem utilizando.

Em uma primeira proposta, vou submeter com os recursos que me são mais confortáveis e vamos ajustando conforme os PR. @gustavorps @verneck

[gustavorps]

Gostaria de poder utilizar um recurso diferente do atual para a estilização dos componentes.

Gosto muito da proposta do Bulma.io, como ele fornece vários componentes pré prontos para resoluções full width e full height acho que seria bem prático utilizar junto do Full Page conforme vocês já vem utilizando.

Em uma primeira proposta, vou submeter com os recursos que me são mais confortáveis e vamos ajustando conforme os PR. @gustavorps @verneck

@mikaelhadler
Sinta-se livre em utilizar o recursos que preferir.
Vou atualizar a issue com uma pegada de História do Usuário

Gerar banner em poucas etapas
Como um webmaster que gerencia um website relacionado a saúde, eu quero "embedar" uma página/componente que seja possível gerar um banner de pedido de doação em poucas etapas através de um dispositivo móvel ou desktop

[gustavorps]

@mikaelhadler

Só relembrando que futuro a proposta é gerar repositórios específicos as plataformas e linguagens, algo do tipo:

• hematopy-client-vuejs
• hematopy-client-ng
• hematopy-client-polymer
• hematopy-client-react-web
• hematopy-client-react-native
• hematopy-client-python
• hematopy-client-js
• hematopy-client-java
• hematopy-client-swift

Mas no momento pode fazer as coisas com vue.js no diretório site/components/COMPONENT_NAME-vuejs

Por enquanto vamos centralizar o components no diretório site/components/COMPONENT_NAME para facilitar o pull request e criar muitos repositórios

[verneck]

Gostaria de poder utilizar um recurso diferente do atual para a estilização dos componentes.

Gosto muito da proposta do Bulma.io, como ele fornece vários componentes pré prontos para resoluções full width e full height acho que seria bem prático utilizar junto do Full Page conforme vocês já vem utilizando.

Em uma primeira proposta, vou submeter com os recursos que me são mais confortáveis e vamos ajustando conforme os PR. @gustavorps @verneck

Já usei e uso o bulma.io e gosto demais dele, por mim tudo bem de usa-lo.

[mikaelhadler]

@gustavorps @verneck Por favor, gostaria de confirmar se todas informações do formulário são requiridas para criação de um banner, se não, quais são ?

[gustavorps]

@gustavorps @verneck Por favor, gostaria de confirmar se todas informações do formulário são requiridas para criação de um banner, se não, quais são ?

Todas informações do formulário são requiridas, vide POST multipart/form-data abaixo:

curl --request POST \
  --url https://hematopy-dev-gustavorps.herokuapp.com/api/v1/donations \
  --header 'Content-Type: multipart/form-data' \
  --form 'recipient_image=@/path/of/recipient_image.jpg' \
  --form 'recipient_name=JOSÉ MARIA PEREIRA SOUZA ARUDINO DO SANTOS' \
  --form 'recipient_bloodType=A+' \
  --form 'location_name=Hemoes' \
  --form 'location_streetAddress=Av. Mal. Campos, 1468' \
  --form 'location_addressDistrict=Nazareth' \
  --form 'location_addressLocality=Vitória' \
  --form 'location_addressRegion=ES' \
  --form 'location_postalCode=29047-100'

Nota: esse são os campos da nova versão e não da atual

[mikaelhadler]

• Create a project client with vue-cli

  • Eslint ( Standard )
  • Unit Test ( Mocha, Chai )
  • Sass

• Create a mock rest

  • Include json-server in package.json
  • Create db.json with recipient model
  • Create npm script to run mock server

• Create file-upload component

• Create navegation component

• Create errors component

• Create hematopy-form component

  • Create input's

• Create a style component with sass

  • All component with a style scoped
  • Create a library with hematopy-style in npm

[verneck]

massa @mikaelhadler

[verneck]

@mikaelhadler você já criou o form, certo?

[mikaelhadler]

@gustavorps Hey dude, bad news,

'You have exceeded your daily request quota for this API. If you did not set a custom daily request quota, verify your project has an active billing account: http://g.co/dev/maps-no-account For more information on usage limits and the Google Maps JavaScript API services please see: https://developers.google.com/maps/documentation/javascript/usage'

So, i believe what it's not a option available, right ?

How wes to continue feature location ?

[mikaelhadler]

@gustavorps I not sure, but i believe if you register your credit card, the limit of requests its greater, but, i have one idea, if the limit Google Place API exceed , just use another component with another resource for location, for example Via Cep, it's a good idea? : ]

[gustavorps]

@mikaelhadler I will send you a API Key for Google Maps and Places

[mikaelhadler]

@gustavorps Okay dude, thanks.

[gustavorps]

@mikaelhadler the oficial fields to create a donation with the development endpoint
Sorry about the chances, any question mention me.

curl --request POST \
  --url https://hematopy-dev-gustavorps.herokuapp.com/api/v1/donations \
  --header 'Content-Type: multipart/form-data' \
  --form 'type=BloodDonation \
  --form 'recipient_image=@/path/to/image/on/your/computer.png' \
  --form 'recipient_name=JOSÉ MARIA PEREIRA SOUZA ARUDINO DO SANTOS' \
  --form 'recipient_bloodtype=A+' \
  --form 'location_name=Hemoes' \
  --form 'location_address_street=Av. Mal. Campos' \
  --form 'location_address_number=1468' \
  --form 'location_address_district=Nazareth' \
  --form 'location_address_locality=Vitória' \
  --form 'location_address_region=ES' \
  --form 'location_address_postal_code=29047-100'

Have fun