[layout] panel administracyjny Opcje

[kilab]

Witam,

Przybierałem się ostatnio do ujednolicenia wykonywanych projektów od strony panelu ale przybranie się było ciężkie. Od wczoraj siedzę przeziębiony w domu więc postanowiłem jakoś ten czas wykorzystać.

I zmusiłem się wreszcie do stworzenia panelu administracyjnego, który obsługiwałby wszystkie funkcje zarządzania. Staram się więc stworzyć obsługę wszystkich elementów żeby w przyszłości już nic nie dorabiać.
Zastanawiam się nad zwijaniem i rozwijaniem poszczególnych bloków w lewej kolumnie, ale czy jest sense ukrywania pozostałych elementów przy jednym aktywnym?

Więc proszę o ogólne oceny, porady, jak również informacje o tym, co jeszcze powinienem dodać żeby za jakiś czasu nie było niespodzianki

http://kilab.pl/tmp/panel/

PS. Zamierzam udostępnić layout za darmo, jak tylko go skończę, więc jeśli ktoś byłby chętny, za kilka dni będzie można pobrać

[Damiankossek]

Szczerze mi sie nawet podoba ale musialbym go poddac delikatnemu tuningowi :-)
A co do rozwijanych belek po lewej to jak najbardziej poniewaz jak bedzie wiecej modulow to delikanty syf i chaos sie zrobi
Hmm komunikaty error,success i warning chyba z Magento zaporzyczyles ?

Jezeli wydasz wersje finalna to z checia zaimplementuje w moim przyszlym Panelu ktory z biegiem wolnego czasu powoli buduje :-)

[kilab]

Z tabelkami masz rację, na razie nie przewiduję więcej opcji, ale jednak z czasem może się nazbierać. Do zrobienia

Z Magento nigdy styczności nie miałem, ale taki styl jak ja zrobiłem jest dość popularny, szczególnie ikony FamFam ;P

[Damiankossek]

W kazdym badz razie czekam na finala Fajnie ze udostepniasz ...

[ShadowD]

Możesz dać paczkę tych ikon? Czy to są z
http://www.famfamfam.com/lab/icons/

Tylko przerobione na 1 kolor?

[kilab]

Początkowo były FamFam (zostały przy ostrzeżeniach), ale wgrałem nowe z http://pc.de/icons/

Przy okazji, bloki w lewej kolumnie schowane

Ten post edytował kilab 26.03.2012, 22:22:47

[ShadowD]

http://screenup.pl/?l=6LG4TMW

Pomarańczowe cyfry do wymiany lub do zrobienia czegoś z nimi, są nie czytelne i krzywo "poupychane", popraw bo szkoda. Ogólnie w dobrą stronę, ale za mało pokazujesz - przemyśl co jeszcze by się przydało, jakiś edytor wizualny skrojony do potrzeb, może jakieś "wielo-ikonowe" pole, tabele itd. Dodatkowo popracował bym z formami tab by jakoś je zmienić, pola do jednokrotnego wyboru mogły by być jednym blokiem tak jak na tel z andkiem lub jabłkiem takie połączone tak i nie i suwak jako całość który się przesuwa i pod zaznacza wybraną opcję. Ogólnie to co masz to początek i to dobry! :-)

[kilab]

O właśnie, tabeli brakuje! Dodane do kolejki, formularze też przerobię bo coś mi nie gra w nich, elementy stronicowania

Edytor odpuszczę sobie bo nie chcę nikomu narzucać żadnego konkretnego jeśli skorzysta z szablonu. Poprawię tylko te formy.

ShadowD, możesz wyjaśnić co miałem na myśli z:

jakieś "wielo-ikonowe" pole

Trochę otępiony jestem I przy okazji z jakiej przeglądarki korzystasz bo zauważyłem na screenie, że napis na nagłówku boxa nie jest na środku

Jestem też ciekaw jak to wygląda pod Windowsem, IE to pewnie wcale zabił układ Nie mam niestety i na razie jeszcze nie sprawdzałem

Ale to wieczorem, dzisiaj pokorzystam trochę z pogody

Ten post edytował kilab 27.03.2012, 10:11:03

[ShadowD]

Ff.11 pod win

[kilab]

Dzięki

Tabele zrobione, formularz poprawiony, strona logowania: http://kilab.pl/tmp/panel/login.html

Wciąż czekam na kolejne sugestie

[ShadowD]

Dla niektórych buttonów masz podkreślenie na hover, a na innych nie - popraw, mi leży lepiej brak podkreślenia.

Inny kolor podświetlenie wiersza w tabeli (hover) lub dla 2n daj mniej szary, osobiści zastosował bym oba - zmniejszył odcień szarości (powinno tylko lekko się wyróżniać) a podświetlenie może lekki żółty?

Dodatkowo może czas na logo?

[kilab]

Podkreślenie buttonów mi umknęło, raz jeszcze dzięki

Poprawiłem też te tła dla komórek, faktycznie za duży kontrast był. A z tym logo to, że wstawić czy jak?

[apathedosheu]

Kilab, wykonujesz kawał dobrej roboty jest po prostu hipnotajzing. Czekam na download.

[kilab]

Właściwie to już można pobrać tutaj, jak coś dorobię to poinformuję

[xxdrago]

No mi się podoba pięknie pobrałem własnie. Mógłbyś podpowiedzieć jaką funkcje użyłeś aby zrobić to pokaż/ukryj w menu?

[kilab]

A dziękuję

Do ukrycia wszystkich boksów funkcja hide, do pokazania boksu aktywnej strony analogicznie funkcja show
A po kliknięciu to już tylko slideToggle

Ten post edytował kilab 5.04.2012, 22:39:04

[markonix]

Pobrane i użyte w projekcie

Bardzo fajne i przejrzyste.
Moja propozycja to zapamiętywanie rozwiniętej sekcji z lewej strony.
Można to zrobić spokojnie w samym jQuery i dodać jako integralną część szablonu.
W tym momencie rozwijanie zawsze pierwszej sekcji jest po kilku minutach troszkę denerwujące.

Jak nie będziesz miał na to czasu to na pewno sam takową funkcje dopiszę.

[kilab]

@markonix, rozwijanie boksa zrobiłem w php, rozwija się sekcja dla danej strony, inaczej się nad tym nie zastanawiałem. Dla mnie o coś takiego chodziło i tak zrobiłem

[markonix]

Wydaje mi się, że elastyczniejsze jest zrobiebienie tego po stronie frontendu.
Poza tym ublubiona zakładka zawsze będzie rozwinięta nawet po kilku dniach oraz od razu funkcjonalność będzie wbudowana w szablon.

Można też połączyć obie metody ale to już by była przesada.
Jedyny minus jaki mi przychodzi do głowy na rzecz PHP to wejście na konkretną podstronę prosto z historii - choć to też można by obsłużyć

Możesz pokazać kod PHP, którym "otwierasz" zakładki?

[PHP] pobierz, plaintext 
<script type="text/javascript">
$(function(){
 
	$(".box .h_title").not(this).next("ul").hide("normal");
 
	var cookie = $.cookie('menu_array');
	if (cookie != null) {
		$('.box ul').each(function(index) {
			if (cookie.match('-' + index + '-')) {
	    	$(this).show('normal');
	    }
		});		
	} else {
		$(".box .h_title").not(this).next("#home").show("normal");
	}
 
	$(".box").children(".h_title").click( function() { 
		$(this).next("ul").slideToggle(function() {		
			var cookie = '';
			$('.box ul').each(function(index) {
		    if ($(this).is(':visible'))
		    	cookie = cookie + '-' + index + '-' ;
			});			
			$.cookie('menu_array', cookie, { expires: 31 });				
		});
	});
 
});
</script>
[PHP] pobierz, plaintext 

Plugin do ciasteczek:
https://github.com/carhartl/jquery-cookie/b...query.cookie.js

Ten post edytował markonix 9.04.2012, 16:04:17

[kilab]

Każda lista (ul) w bloku ma id. Pobieram id strony z adresu i switchem sprawdzam aktualną sekcję.

[PHP] pobierz, plaintext 
<script type="text/javascript">
$(function(){
	$(".box .h_title").not(this).next("ul").hide("normal");
	<?php
	switch($modul){
		case 'informacje' : $modul_a = $modul; break;
		case 'ogloszenia' : $modul_a = $modul; break;
		case '...' : $modul_a = $modul; break;
		case '...' : $modul_a = $modul; break;
		default : $modul_a = 'home'; break;
	}
	?>
	$(".box .h_title").not(this).next("#<?=$modul_a ?>").show("normal");
	$(".box").children(".h_title").click( function() { $(this).next("ul").slideToggle(); });
});
</script>
[PHP] pobierz, plaintext 

Ten post edytował kilab 9.04.2012, 16:26:43