[+] BO : new display of module list in all BO tabs

This commit is contained in:
vAugagneur
2013-01-21 17:46:40 +01:00
parent 0b177232a3
commit 517e90da43
12 changed files with 473 additions and 46 deletions
+56 -2
View File
@@ -194,7 +194,7 @@ a.module_toggle_all{color: #268CCD;}
.multishop_toolbar .chzn-container .chzn-results .shop{padding-left: 30px;background-color: #EAF2FC;}
/*toolbarBox*/
.toolbarBox { background-color: #F8F8F8; border: 1px solid #CCCCCC; margin-bottom:10px; padding: 5px 0; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px;}
.toolbarBox { background-color: #F8F8F8; border: 1px solid #CCCCCC; margin-bottom:10px; padding: 5px 0; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px;position:relative}
.toolbarBox .pageTitle { margin-left:10px; line-height:48px}
.toolbarBox .pageTitle h3 {font-size: 2em; font-weight: normal; line-height: 52px; margin: 0; padding: 0; text-shadow:0 1px 0 #fff;}
.toolbarBox ul.cc_button {float:right;margin:0 5px 0 0;padding:0;}
@@ -233,6 +233,32 @@ a.module_toggle_all{color: #268CCD;}
.toolbarBox .process-icon-standardRefund{ background-image: url('../img/process-icon-standard-refund.png');}
.toolbarBox .process-icon-help{ background-image: url('../img/process-icon-help.png');}
.toolbarBox .process-icon-help-new{ background-image: url('../img/process-icon-help-new.png');}
.toolbarBox .process-icon-modules-list{ background-image: url('../img/process-icon-modules-list.png');}
.toolbarBox #modules_list_container {
background: none repeat scroll 0 0 #FFF;
border: solid 1px #CCC;
display: block;
float: right;
height: auto;
width: 300px;
position: absolute;
right: 13px;
top: 63px;
z-index: 100;
padding: 10px;
box-shadow: 1px 5px 5px #CCCCCC;
-moz-box-shadow: 1px 5px 10px #CCCCCC;
-webkit-box-shadow: 1px 5px 10px #CCCCCC;
}
.toolbarBox #modules_list_container #modules_list_container_tab {margin-top: 10px;width: auto;height: auto; }
.toolbarBox #modules_list_container #modules_list_container_tab table {width: 100%;border-spacing: 0px; }
.toolbarBox #modules_list_container #modules_list_container_tab tr { height: auto}
.toolbarBox #modules_list_container #modules_list_container_tab tr.rowalt {background-color: #EEE}
.toolbarBox #modules_list_container #modules_list_container_tab #tab_module_switch {margin-bottom: 10px;}
.toolbarBox #modules_list_container #modules_list_loader {margin-top: 10px}
div.fix-toolbar {border-bottom: 1px solid #E0E0E0;position:fixed;top:0;opacity:0.9;z-index:500;}
@@ -423,7 +449,7 @@ form#product_form h4 { font-size:18px; font-weight:normal;}
#moduleContainer .table tr th { height:40px;}
#moduleContainer .table tr td { font-size:12px; vertical-align:top; padding: 5px 7px 0; border-top:1px solid #ccc; border-bottom:none;}
#moduleContainer .table tr:first-child {border-top:1px solid #ccc}
#moduleContainer .table tr td .imgm {width:32px;}
#moduleContainer .table tr td .imgm , #modules_list_container_tab .imgm {width:32px;}
#moduleContainer .moduleDesc { font-size:12px; position:relative; margin-bottom:10px;}
#moduleContainer .moduleDesc h3 { color:#3A6EA7; margin:0;}
#moduleContainer .moduleDesc .metadata { float:left; display:block; margin:5px 0;}
@@ -446,6 +472,34 @@ form#product_form h4 { font-size:18px; font-weight:normal;}
#moduleContainer .moduleGridDesc h3 { color:#3A6EA7; margin:0;}
#moduleContainer ul.listing-grid-module li select { position:absolute; top:0; right:0px; }
/*TAB MODULES LIST*/
#modules_list_container_tab table tr th { height:40px;}
#modules_list_container_tab table tr td { font-size:12px; padding: 3px 3px 3px; border-top:1px solid #ccc; border-bottom:none;}
#modules_list_container_tab table tr td tr td {border: none}
#modules_list_container_tab table tr:first-child {border-top:1px solid #ccc}
#modules_list_container_tab .imgm {width:32px;}
#modules_list_container_tab .moduleDesc { font-size:12px; margin-bottom:10px;}
#modules_list_container_tab .moduleDesc h3 { color:#3A6EA7;margin: 0;font-size: 1.1em;text-align: left}
#modules_list_container_tab .moduleDesc .metadata { float:left; display:block; margin:5px 0;}
#modules_list_container_tab .moduleDesc .metadata dl { float:left; margin:0; padding-right:10px;}
#modules_list_container_tab .moduleDesc .metadata dl dt, .moduleDesc .metadata dl dd { float:left; margin:0; padding:0;}
#modules_list_container_tab .moduleDesc .metadata dl dd { padding-right:10px;}
#modules_list_container_tab .moduleDesc .metadata dl dt { font-weight:bold; padding-right:5px;}
#modules_list_container_tab .moduleDesc p.desc { color:#666; font-family: Georgia; font-style: italic; font-size:12px; display:block; clear:both;text-align: left}
#modules_list_container_tab .setup {background-color:#6db300; font-weight:bold; font-size:10px; color:#fff; text-transform:uppercase; position:relative; left:10px; padding:0px 4px; display: inline-block; border-radius:3px;}
#modules_list_container_tab .setup.non-install { background-color:#ec7000;}
#modules_list_container_tab .setup.must-have { background-color: #ec7000;}
#modules_list_container_tab .setup.off{ background-color:#ccc;}
#modules_list_container_tab .row-actions-module span { padding-right:5px;}
#modules_list_container_tab .row-actions-module span a { font-size:12px;}
#modules_list_container_tab ul.listing-grid-module { position:relative; margin:0; padding:0;}
#modules_list_container_tab ul.listing-grid-module li { float:left; border:1px solid #ccc; width:400px; min-height:30px; margin:10px; padding:5px; border-radius:4px;}
#modules_list_container_tab .moduleGridDesc { position:relative; display:block; height:30px;}
#modules_list_container_tab .moduleGridDesc h3 { color:#3A6EA7; margin:0;}
#modules_list_container_tab ul.listing-grid-module li select { position:absolute; top:0; right:0px; }
#modules_list_container_tab table tr td.tab_modules_actions_row { height: 20px}
/*MODULE POSITION*/
.blocLiveEdit { float:right; clear:right; background-color: #EBEDF4; border: 1px solid #C2C4D9;display: block; width:250px;}
.blocLiveEdit h2 { background: transparent url('../img/live_edit.png') no-repeat scroll 10px 10px; height: 40px; line-height: 50px;margin: 0; padding: 0 10px; text-indent: 40px;}
Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB

@@ -1,12 +1,10 @@
<div id="productBox">
{include file='controllers/modules/header.tpl'}
<ul class="view-modules">
<li class="button normal-view"><a href="index.php?controller={$smarty.get.controller|htmlentities}&token={$smarty.get.token|htmlentities}"><img src="themes/default/img/modules_view_layout_sidebar.png" alt="{l s='Normal view'}" border="0" /><span>{l s='Normal view'}</span></a></li>
<li class="button favorites-view-disabled"><img src="themes/default/img/modules_view_table_select_row.png" alt="{l s='Favorites view'}" border="0" /><span>{l s='Favorites view'}</span></li>
</ul>
<div id="container">
<div id="moduleContainer" style="padding:0px;margin:0px;padding-top:15px">
@@ -16,6 +14,7 @@
<col width="240px">
<col width="">
<col width="140px">
<col width="250px">
<col width="180px">
<col width="70px">
<col width="70px">
@@ -27,6 +26,7 @@
<th>{l s='Module Name'}</th>
<th>{l s='Description'}</th>
<th>{l s='Status'}</th>
<th>{l s='Tab'}</th>
<th>{l s='Categories:'}</th>
<th>{l s='Interest'}</th>
<th>{l s='Favorite'}</th>
@@ -40,6 +40,22 @@
<td><span class="moduleName">{$module->displayName}</span></td>
<td><span class="moduleFavDesc">{$module->description|truncate:80:'...'}</span></td>
<td>{if isset($module->id) && $module->id gt 0}<span class="setup">{l s='Installed'}</span>{else}<span class="setup non-install">{l s='Not Installed'}</span>{/if}</td>
<td>
{assign var="module_name" value=$module->name}
<select class="chosen" multiple="multiple">
{foreach $tabs AS $t}
{if $t.active}
<option {if isset($tab_modules_preferences.$module_name) && in_array($t.id_tab, $tab_modules_preferences.$module_name)} selected="selected" {/if} class="group" value="{$t.id_tab}">{if $t.name eq ''}{$t.class_name}{else}{$t.name}{/if}</option>
{foreach from=$t.sub_tabs item=t2}
{if $t2.active}
{assign var="id_tab" value=$t.id_tab}
<option {if isset($tab_modules_preferences.$module_name) && in_array($t2.id_tab, $tab_modules_preferences.$module_name)} selected="selected" {/if} value="{$t2.id_tab}">&nbsp;&nbsp;&nbsp;{if $t2.name eq ''}{$t2.class_name}{else}{$t2.name|escape:'htmlall':'UTF-8'}{/if}</option>
{/if}
{/foreach}
{/if}
{/foreach}
</select>
</td>
<td>{$module->categoryName}</td>
<td>
<select name="i_{$module->name}" class="moduleFavorite" style="width:50px">
@@ -0,0 +1,112 @@
{*
* 2007-2013 PrestaShop
*
* NOTICE OF LICENSE
*
* This source file is subject to the Academic Free License (AFL 3.0)
* that is bundled with this package in the file LICENSE.txt.
* It is also available through the world-wide-web at this URL:
* http://opensource.org/licenses/afl-3.0.php
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to http://www.prestashop.com for more information.
*
* @author PrestaShop SA <contact@prestashop.com>
* @copyright 2007-2013 PrestaShop SA
* @license http://opensource.org/licenses/afl-3.0.php Academic Free License (AFL 3.0)
* International Registered Trademark & Property of PrestaShop SA
*}
<tr class="{$class_row}">
<td>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td valign="top">
<img class="imgm" alt="" src="{if isset($module->image)}{$module->image}{else}../modules/{$module->name}/{$module->logo}{/if}">
</td>
<td>
<div class="moduleDesc" id="anchor{$module->name|ucfirst}">
<h3>{$module->displayName} {$module->version}
{if isset($module->type) && $module->type == 'addonsMustHave'}
<span class="setup must-have">{l s='Must Have'}</span>
{/if}
</h3>
<p class="desc">
{if isset($module->description) && $module->description ne ''}
{$module->description|truncate:100:'…'}
{else}
&nbsp;
{/if}
</p>
</div>
</td>
</tr>
<tr>
<td class="tab_modules_actions_row">
{if isset($module->type) && $module->type == 'addonsMustHave'}
<a href="{$module->addons_buy_url}" target="_blank" class="button updated">
<span><img src="../img/admin/cart_addons.png">&nbsp;&nbsp;{displayPrice price=$module->price currency=$module->id_currency}</span></a>
{else}
<a {if isset($module->id) && $module->id gt 0 && !empty($module->options.uninstall_onclick)}onclick="{$module->options.uninstall_onclick}"{/if} href="{if isset($module->id) && $module->id gt 0}{$module->options.uninstall_url}{else}{$module->options.install_url}{/if}" class="button installed">
<span>{if isset($module->id) && $module->id gt 0}{l s='Uninstall'}{else}{l s='Install'}{/if}</span>
</a>
{/if}
</td>
<td class="tab_modules_actions_row">
<div class="row-actions-module">
{if !isset($module->not_on_disk)}
{$module->optionsHtml}
<a href="#" class="button action_tab_module" data-option="select_{$module->name}" class="button">Valider</a>
{else}&nbsp;{/if}
</div>
</td>
</tr>
</table>
</td>
<!--
<td>
<img class="imgm" alt="" src="{if isset($module->image)}{$module->image}{else}../modules/{$module->name}/{$module->logo}{/if}">
<div>
{if isset($module->type) && $module->type == 'addonsMustHave'}
<a href="{$module->addons_buy_url}" target="_blank" class="button updated">
<span><img src="../img/admin/cart_addons.png">&nbsp;&nbsp;{displayPrice price=$module->price currency=$module->id_currency}</span></a>
{else}
<a {if isset($module->id) && $module->id gt 0 && !empty($module->options.uninstall_onclick)}onclick="{$module->options.uninstall_onclick}"{/if} href="{if isset($module->id) && $module->id gt 0}{$module->options.uninstall_url}{else}{$module->options.install_url}{/if}" class="button installed">
<span>{if isset($module->id) && $module->id gt 0}{l s='Uninstall'}{else}{l s='Install'}{/if}</span>
</a>
{/if}
</div>
</td>
<td>
<div class="moduleDesc" id="anchor{$module->name|ucfirst}">
<h3>{$module->displayName} {$module->version}
{if isset($module->type) && $module->type == 'addonsMustHave'}
<span class="setup must-have">{l s='Must Have'}</span>
{/if}
</h3>
<p class="desc">
{if isset($module->description) && $module->description ne ''}
{$module->description|truncate:100:'…'}
{else}
&nbsp;
{/if}
</p>
<div class="row-actions-module" style="float:right">
{if !isset($module->not_on_disk)}
{$module->optionsHtml}
<a href="#" class="button action_tab_module" data-option="select_{$module->name}" class="button">Valider</a>
{else}&nbsp;{/if}
</div>
</div>
</td>
</tr>
-->
@@ -0,0 +1,57 @@
{*
* 2007-2013 PrestaShop
*
* NOTICE OF LICENSE
*
* This source file is subject to the Academic Free License (AFL 3.0)
* that is bundled with this package in the file LICENSE.txt.
* It is also available through the world-wide-web at this URL:
* http://opensource.org/licenses/afl-3.0.php
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to http://www.prestashop.com for more information.
*
* @author PrestaShop SA <contact@prestashop.com>
* @copyright 2007-2013 PrestaShop SA
* @license http://opensource.org/licenses/afl-3.0.php Academic Free License (AFL 3.0)
* International Registered Trademark & Property of PrestaShop SA
*}
{if isset($tab_modules_list) && !empty($tab_modules_list)}
<script type="text/javascript">
$(document).ready(function() {
$('.action_tab_module').each( function (){
$(this).click(function () {
option = $('#'+$(this).data('option')+' :selected');
/* if ($(option).data('onclick')) */
window.location.href = $(option).data('href');
return false;
});
});
});
</script>
<div id="tab_module_switch">
<a href="#" onclick="$('#tab_modules_list_not_installed').hide();$('#tab_modules_list_installed').show();return false;" class="button">{l s='Installed'}</a>
<a href="#" onclick="$('#tab_modules_list_installed').hide();$('#tab_modules_list_not_installed').show();return false;" class="button">{l s='Not Installed'}</a>
</div>
<table id="tab_modules_list_installed">
{foreach from=$tab_modules_list.installed item=module}
{include file='controllers/modules/tab_module_line.tpl' class_row={cycle values=",rowalt"}}
{/foreach}
</table>
<table id="tab_modules_list_not_installed" style="display:none">
{foreach from=$tab_modules_list.not_installed item=module}
{include file='controllers/modules/tab_module_line.tpl' class_row={cycle values=",rowalt"}}
{/foreach}
</table>
{else}
<b>{l s='No modules available in this section.'}</b>
{/if}
<p><b><a href="{$admin_module_favorites_view}" style="color:#666">{l s='Click here to choose which modules to display here'}</a></b></p>
@@ -33,6 +33,15 @@
<span class="process-icon-{if isset($btn.imgclass)}{$btn.imgclass}{else}{$k}{/if} {if isset($btn.class)}{$btn.class}{/if}" ></span>
<div {if isset($btn.force_desc) && $btn.force_desc == true } class="locked" {/if}>{$btn.desc}</div>
</a>
{if $k == 'modules-list'}
<div id="modules_list_container" style="display:none">
<div style="float:right;top:-5px">
<a href="#" onclick="$('#modules_list_container').slideUp();return false;"><img alt="X" src="../img/admin/close.png"></a>
</div>
<div id="modules_list_loader"><img src="../img/loader.gif" alt="" border="0"></div>
<div id="modules_list_container_tab" style="display:none;"></div>
</div>
{/if}
</li>
{/foreach}
</ul>
@@ -107,6 +116,41 @@
}
{/block}
}
var modules_list_loaded = false;
$('.process-icon-modules-list').parent('a').click( function (){
$('#modules_list_container').slideDown();
if (!modules_list_loaded)
{
$.ajax({
type:"POST",
url : '{$admin_module_ajax_url}',
async: true,
data : {
ajax : "1",
controller : "AdminModules",
action : "getTabModulesList",
tab_modules_list : '{$tab_modules_list}'
},
success : function(data)
{
$('#modules_list_container_tab').html(data).slideDown();
$('#modules_list_loader').hide();
modules_list_loaded = true;
},
error: function(res,textStatus,jqXHR)
{
}
});
}
else
{
$('#modules_list_container_tab').slideDown();
$('#modules_list_loader').hide();
}
return false;
});
});
//]]>
</script>