serenitybrasil / SerenityBrasil

Local para estudos da plataforma Serenity - Brasil e América Latina
8 stars 2 forks source link

DEIXAR A APARECENCIA DO LOOKUP EDITOR MELHOR #119

Open Mondaii opened 5 years ago

Mondaii commented 5 years ago

DEIXAR A APARECENCIA DO LOOKUP EDITOR MELHOR

07/05/2019 00:07 - Euclides Serenity Recife PE: Coloquei um lookupEditor no Dashboard do sistema, mas queria deixar a aparecia dele melhor 07/05/2019 00:08 - Euclides Serenity Recife PE: Alguém sabe onde eu devo ajustar isso? 07/05/2019 00:08 - Euclides Serenity Recife PE: 2019-05-07 - 1

07/05/2019 00:08 - Euclides Serenity Recife PE: Esse LookupEditor está na página _Layout.cshtml 07/05/2019 06:03 - Julierme Felix Serenity: Tem que mexer no CSS dele 07/05/2019 07:03 - Euclides Serenity Recife PE: Onde? 07/05/2019 08:00 - Euclides Serenity Recife PE: esta assim atualmente 07/05/2019 08:01 - Euclides Serenity Recife PE: 2019-05-07 - 2

07/05/2019 08:35 - Rolemberg Filho: Bom dia @558187272495 . Geralmente o CSS do serenity fica no arquivo site.less 07/05/2019 08:38 - Julierme Felix Serenity: 2019-05-07 - 3

07/05/2019 08:38 - Julierme Felix Serenity: 2019-05-07 - 4

07/05/2019 08:41 - Rolemberg Filho: 2019-05-07 - 5

07/05/2019 08:41 - Rolemberg Filho: Não consigo ver aqui pois estou no cel 07/05/2019 08:42 - Euclides Serenity Recife PE: Já tentei isso 07/05/2019 08:42 - Euclides Serenity Recife PE: vou tentar isso 07/05/2019 08:42 - Rolemberg Filho: Printa a tela desse dropdownlist 07/05/2019 08:46 - Julierme Felix Serenity: use a mesma classe o user-menu 07/05/2019 08:57 - Euclides Serenity Recife PE: o negócio é que esse LookupEditor é exibido lá através de jQuery. 07/05/2019 08:57 - Euclides Serenity Recife PE: Assim é como está ficando: 07/05/2019 08:57 - Euclides Serenity Recife PE: 2019-05-07 - 6

07/05/2019 08:58 - Euclides Serenity Recife PE: Esse ó html do controle 07/05/2019 08:58 - Euclides Serenity Recife PE: 2019-05-07 - 7

07/05/2019 08:59 - Euclides Serenity Recife PE: Lá no fim do _Layout.cshtml o javascript pra incluir o Lookup 07/05/2019 08:59 - Euclides Serenity Recife PE: 2019-05-07 - 8

07/05/2019 08:59 - Euclides Serenity Recife PE: Funciona, aparece o lookup, mas ele fica bem feio. 07/05/2019 08:59 - Euclides Serenity Recife PE: Eu queria deixar ele mais agradável. 07/05/2019 09:46 - Fábio de Mello Luiz FATEC: vc pode enviar uma cópia do _Layout.cshtml ? 07/05/2019 09:46 - Euclides Serenity Recife PE: agora 07/05/2019 09:46 - Euclides Serenity Recife PE: vou só desfazer os meus testes aqui, 1 minuto 07/05/2019 09:48 - Euclides Serenity Recife PE:

07/05/2019 09:51 - Julierme Felix Serenity: voce pode definir o css no layout 07/05/2019 09:51 - Julierme Felix Serenity: 2019-05-07 - 10

07/05/2019 09:52 - Julierme Felix Serenity: 2019-05-07 - 11

07/05/2019 09:52 - Julierme Felix Serenity: 2019-05-07 - 12

07/05/2019 09:58 - Julierme Felix Serenity: ou cria por exemplo uma classe chamada entidade 07/05/2019 09:58 - Julierme Felix Serenity: 2019-05-07 - 13

07/05/2019 09:58 - Julierme Felix Serenity: 2019-05-07 - 14

07/05/2019 09:58 - Julierme Felix Serenity: 2019-05-07 - 15

07/05/2019 10:17 - Fábio de Mello Luiz FATEC: Obrigado 07/05/2019 10:26 - Euclides Serenity Recife PE: vou tentar isso 07/05/2019 10:26 - Euclides Serenity Recife PE: disponha 07/05/2019 11:20 - Julierme Felix Serenity: Prezados, Achei interessante esse botão que oculta a barra dos filtros. 07/05/2019 11:20 - Julierme Felix Serenity: 2019-05-07 - 16

07/05/2019 11:21 - Julierme Felix Serenity: nesse exemplo a grid é visualizada sem a barra dos filtro e ao clicar no botão aparece a barra. 07/05/2019 11:21 - Julierme Felix Serenity: 2019-05-07 - 17

07/05/2019 11:22 - Julierme Felix Serenity: Exibi e oculta também a barra 07/05/2019 11:41 - Fábio de Mello Luiz FATEC: 2019-05-07 - 18

07/05/2019 11:41 - Fábio de Mello Luiz FATEC: 2019-05-07 - 19

07/05/2019 11:45 - Julierme Felix Serenity: show 07/05/2019 11:46 - Julierme Felix Serenity: lembrando que essa alteração afeta a todos 07/05/2019 11:46 - Euclides Serenity Recife PE: essa alteração vai interferir em todo o sistema? 07/05/2019 11:46 - Euclides Serenity Recife PE: olha ai... 07/05/2019 11:46 - Euclides Serenity Recife PE: não acho que seja uma boa fazer isso. 07/05/2019 11:47 - Julierme Felix Serenity: creio que o melhor é fazer um arquivo css a parte 07/05/2019 11:47 - Julierme Felix Serenity: e usar o bundles 07/05/2019 11:47 - Julierme Felix Serenity: coloque o bundles somente na pagina que necessitar o usar aquele arquivo css. 07/05/2019 11:49 - Euclides Serenity Recife PE: eu sou muito ruim nessa área, vc está falando grego pra mim 07/05/2019 11:49 - Julierme Felix Serenity: 2019-05-07 - 20

07/05/2019 11:49 - +55 12 98283-2454: muito bom! só não acho interessante você alterar diretamente no arquivo bootstap.css. O ideal seria você reescrever essa classe ".dropdown-menu" e colocar em um arquivo css seu, com mais precedência. Porque além de quebrar suas alterações caso vocês atualizem o bootstrap, quando vocês subirem pra produção vai usar o bootstrap.min.css e não vai ter suas alterações. A não ser que vc minifique o arquivo novamente. 07/05/2019 11:50 - Julierme Felix Serenity: 2019-05-07 - 21

07/05/2019 21:17 - Euclides Serenity Recife PE: Então pessoal, consegui desenrolar as paradas por aqui. Vou descrever como foi feito pra vocês por que acho que pode ser útil a todos em algum momento. Se aguentem ai sem escrever por um momento, até eu terminar de postar as fotos. 07/05/2019 21:17 - Euclides Serenity Recife PE: 2019-05-07 - 22

07/05/2019 21:19 - Euclides Serenity Recife PE: Para ajustar a largura do LookupEditor que eu coloquei no topo a direita, na barra de navegação eu apenas ajustei o css do componente conforme o print ai embaixo: 07/05/2019 21:19 - Euclides Serenity Recife PE: 2019-05-07 - 23

07/05/2019 21:19 - Euclides Serenity Recife PE:

<style type="text/css">
        .select2-container {
            width: 150px;
        }
    </style>

07/05/2019 21:19 - Euclides Serenity Recife PE: Eu sei, não é a melhor solução, mas serviu por enquanto. Vou procurar outras formas de melhorar isso em outro momento. 07/05/2019 21:21 - Euclides Serenity Recife PE: 2019-05-07 - 24

07/05/2019 21:22 - Euclides Serenity Recife PE: Esse trecho:

data-id-entidade="@(entidade != null ? entidade.EntidadeId : null) eu uso pra definir o id da Entidade que eu estou usando e poder acessar essa propriedade via javascript 07/05/2019 21:23 - Euclides Serenity Recife PE: 2019-05-07 - 25

07/05/2019 21:24 - Euclides Serenity Recife PE:

Declarei uma variável  para pegar o LookupEditor do html
var $listaEntidades = $('#listaEntidades');
07/05/2019 21:25 - Euclides Serenity Recife PE: Inclui o evento onChange no LookupEditor:

lookup.change(a => {
                let entidade = lookup.selectedItem;

                $.post("@Url.Action("Entidade", "Dashboard")", { entidade: entidade }, function (data) {
                    console.log(data);
                });
            });

07/05/2019 21:25 - Euclides Serenity Recife PE: Aqui eu pego o item selecionado:

let entidade = lookup.selectedItem; 07/05/2019 21:26 - Euclides Serenity Recife PE: E aqui eu chamo um método lá no controler pra jogar o item selecionado na variável de sessão: $.post("@Url.Action("Entidade", "Dashboard")", { entidade: entidade }, function (data) { 07/05/2019 21:26 - Euclides Serenity Recife PE: Essa função tem um retorno, eu não vou precisar disso, apenas joguei o retorno no console: console.log(data); 07/05/2019 21:27 - Euclides Serenity Recife PE: Esta mensagem foi apagada 07/05/2019 21:28 - Euclides Serenity Recife PE: 2019-05-07 - 26

07/05/2019 21:29 - Euclides Serenity Recife PE: Também tem um retorno, que eu não preciso, por isso joguei um isOk = true 07/05/2019 21:31 - Euclides Serenity Recife PE: Dessa forma, toda vez que a página é carregada, eu verifico se a variável de sessão está preenchida e seto o LookupEditor com o valor da variável de sessão.

Então, mesmo que eu mude de página, o lookup sempre está exibindo a Entidade que o usuário deixou selecionada. 07/05/2019 21:31 - Euclides Serenity Recife PE: Essa informação vai servir para ser usada como parâmetro e como filtro em todo o sistema. Sempre que eu for gravar alguma coisa eu pego a entidade dai, sempre que eu for exibir uma lista eu pego a entidade dai também. 07/05/2019 21:33 - Euclides Serenity Recife PE: É parecido com o tutorial de MultiEmpresas do Volkan, mas nesse caso é apenas uma Empresa, que atende diversas outras, e os usuários podem fazer parte de mais de uma empresa ao mesmo tempo. O controle é para contextualizar as ações que ele está fazendo. 07/05/2019 21:34 - Euclides Serenity Recife PE: Pronto, é isso ai. 07/05/2019 21:34 - Euclides Serenity Recife PE: espero que tenham entendido e que seja útil pra vocês de alguma forma. 07/05/2019 21:36 - Rolemberg Filho: show! 07/05/2019 21:36 - Rolemberg Filho: parabéns! 07/05/2019 21:36 - Rolemberg Filho: Permita-me uma sugestão no caso do dropdown? 07/05/2019 21:37 - Rolemberg Filho: aliás 07/05/2019 21:37 - Rolemberg Filho: tira um print da tela pra ver como ficou o dropdown? 07/05/2019 21:39 - Euclides Serenity Recife PE: 2019-05-07 - 27

07/05/2019 21:40 - Euclides Serenity Recife PE:

07/05/2019 21:40 - Euclides Serenity Recife PE: Pessoal, eu sei que isso é bem básico mesmo, e tem muito mais de MVC e JavaScript ai do que de Serenity, mas apesar de bastante experiência com Serenity, eu tenho pouca com MVC. 07/05/2019 21:43 - Euclides Serenity Recife PE: O que seria? 07/05/2019 21:44 - Rolemberg Filho: seria sobre onde colocar o style 07/05/2019 21:45 - Euclides Serenity Recife PE: Eu queria deixar ele com a aparência do Bootstrap, mas como eu uso jQuery pra jogar o lookupEditor lá, as classes são as do Select2. Eu dei uma olhada na internet, achei alguns stilos pra deixar essa versão do Select2 mais atraente, só que precisava incluir uma cacetada de css 07/05/2019 21:46 - Rolemberg Filho: dá para colocar dentro de Content/site/site.plenae.less 07/05/2019 21:46 - Rolemberg Filho: e copia a classe .dropdown-menu 07/05/2019 21:46 - Euclides Serenity Recife PE: E como eu estou fazendo isso no _Layout.cshtml, que é usado no sistema todo, acho que eu ia acabar desgraçando tudo, não sei... 07/05/2019 21:47 - Euclides Serenity Recife PE: vou verificar isso quando tiver menos coisas pra concluir 07/05/2019 21:47 - Rolemberg Filho: só que aí renomeia para .entidade 07/05/2019 21:47 - Euclides Serenity Recife PE: ah, saquei. 07/05/2019 21:47 - Euclides Serenity Recife PE: pode ser. 07/05/2019 21:47 - Rolemberg Filho: fiz há pouco aqui, e não reverbera no sistema 07/05/2019 21:47 - Euclides Serenity Recife PE: eu nem pensei nisso. rsrs 07/05/2019 21:48 - Euclides Serenity Recife PE: tava testando um monte de coisa lá, e ficava mais na mão, mas obrigado pela sugestão, vou mudar sim 07/05/2019 21:48 - Rolemberg Filho: WhatsApp Image 2019-05-07 at 21 48 33

07/05/2019 21:49 - Rolemberg Filho: WhatsApp Image 2019-05-07 at 21 49 52

07/05/2019 21:50 - Euclides Serenity Recife PE: valeu 07/05/2019 21:51 - Rolemberg Filho: só lembrando que nesse caso, como criei um arquivo .less novo, tenho que referenciar ele no arquivo site.less 07/05/2019 21:51 - Rolemberg Filho: WhatsApp Image 2019-05-07 at 21 51 09

07/05/2019 21:54 - Julierme Felix Serenity: Show 07/05/2019 21:54 - Julierme Felix Serenity: Muito nom 07/05/2019 21:54 - Julierme Felix Serenity: Bom 07/05/2019 21:54 - Julierme Felix Serenity: Coloque no nosso wiki 07/05/2019 22:18 - Ricardo Oliveira Serenity MS: 👏👏🤜🏻 07/05/2019 22:30 - Euclides Serenity Recife PE: Gente, to com outro problema agora! kkk 07/05/2019 22:31 - Euclides Serenity Recife PE: Muito inocente que eu sou, achei que implementar o filtro no repositório ia dar cabo de só exibir naquela lista as entidades que o usuário pertence. Me enganei. 07/05/2019 22:39 - Euclides Serenity Recife PE: cada usuário pode estar em uma ou mais Entidades. 07/05/2019 22:40 - Euclides Serenity Recife PE: WhatsApp Image 2019-05-07 at 22 40 18

07/05/2019 22:40 - Euclides Serenity Recife PE: Eu implementei o repositório 07/05/2019 22:41 - Euclides Serenity Recife PE: WhatsApp Image 2019-05-07 at 22 41 04

07/05/2019 22:41 - Euclides Serenity Recife PE: Para os forms, deu bom. Mas no list do CSHTML deu ruim! 07/05/2019 22:43 - Euclides Serenity Recife PE: WhatsApp Image 2019-05-07 at 22 43 29

07/05/2019 22:44 - Euclides Serenity Recife PE: Quando é no _Layout.cshtml o lookup obtém seus itens sem passar pelo repositório. 07/05/2019 22:44 - Euclides Serenity Recife PE: Se alguém tiver alguma luz, eu agradeço. Por hoje, deu pra mim. 08/05/2019 08:31 - Julierme Felix Serenity: Vai ter que criar uma classe xyxLookup e ali fazer o filtro 08/05/2019 08:32 - Julierme Felix Serenity: nesse exemplo com user admin vejo todos os bairros 08/05/2019 08:32 - Julierme Felix Serenity: WhatsApp Image 2019-05-08 at 08 32 41

08/05/2019 08:33 - Julierme Felix Serenity: WhatsApp Image 2019-05-08 at 08 33 13

08/05/2019 08:35 - Julierme Felix Serenity: exemplo da classe 08/05/2019 08:35 - Julierme Felix Serenity: WhatsApp Image 2019-05-08 at 08 35 41

08/05/2019 08:56 - Rolemberg Filho: Tipo conceito de multi tenant, não é?

DEIXAR A APARECENCIA DO LOOKUP EDITOR MELHOR - FIM