zentaopms/module/block/view/guide.html.php
2023-05-16 10:47:08 +08:00

192 lines
10 KiB
PHP

<style>
.block-guide .panel-body {padding: 0; height: 286px;}
.block-guide .tutorialBtn {margin-right: 10px;}
.block-guide .tutorialBtn, .block-guide a.tutorialBtn:hover {color: #FFF; background: #FF9F46;}
.block-guide .flowchart {padding: 20px 24px 20px 24px;}
.block-guide .panel-body .table-row {height: 100%; border-top: 1px solid #EEE;}
.block-guide .col-nav {border-right: 1px solid #EBF2FB; width: 130px; padding: 0;}
.block-guide .nav-secondary > li {position: relative;}
.block-guide .nav-secondary > li.active {background: #FFF;}
.block-guide .nav-secondary > li > a {font-size: 14px; color: #838A9D; position: relative; box-shadow: none; padding-left: 20px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; transition: all .2s;}
.block-guide .nav-secondary > li > a:hover {box-shadow: none;}
.block-guide .nav-secondary > li > a:first-child {padding-right: 36px;}
.block-guide .nav-secondary > li.active > a:first-child {color: #3C4353; background: transparent; box-shadow: none;}
.block-guide .nav-secondary > li.active > a:first-child:before {content: ''; display: block; left: -1px; top: 10px; bottom: 10px; width: 4px; background: #2E7FFF; position: absolute;}
.block-guide .nav-secondary > li > a > span.btn-view {position: absolute; top: 0; right: 0; bottom: 0; padding: 8px; width: 36px; text-align: center; opacity: 0;}
.block-guide .nav-secondary > li:hover > a > span.btn-view {opacity: 1;}
.block-guide .nav-secondary > li.switch-icon {display: none;}
.block-guide .tab-pane h4 {color: #0B0F18;}
.block-guide .tab-pane .dataTitle {font-size: 12px; color: #5E626D;}
.block-guide .tab-pane .app-client .col,
.block-guide .tab-pane .app-qrcode .col {width: 100%;}
.block-guide .tab-pane .app-client .menu {margin-top: 10px;}
.block-guide .tab-pane .os-and-desc {padding-left: 0;}
.block-guide .tab-pane .app-client .tree-menu li {line-height: 56px; border: 1px solid #EDEEF2; padding-left: 0; white-space: nowrap}
.block-guide .tab-pane .app-client .tree-menu li:nth-child(2) {border-top: none; border-bottom: none;}
.block-guide .tab-pane .app-client .tree-menu li a.iframe {display: flex;}
.block-guide .tab-pane .app-client .tree-menu li .avatar {background: #E6EAF1; width: 24px; height: 24px; margin-top: 16px; margin-right: 5px;}
.block-guide .tab-pane .app-client .tree-menu li .avatar img {padding: 6px;}
.block-guide .tab-pane .app-client .client-desc {padding-top: 12px;}
.block-guide .tab-pane .app-client .client-desc img {height: 195px;}
.block-guide .tab-pane .app-qrcode .col-md-12 {padding-left: 0; padding-top: 10px;}
.block-guide .tab-pane .app-qrcode .qrcode-down img {padding-top: 16px;}
.block-guide .tab-pane .app-qrcode .qrcode-down .text-primary {padding-top: 10px;}
.block-guide .tab-pane {height: 100%;}
<?php if(common::checkNotCN()):?>
.block-guide .col-nav {width: 215px;}
<?php endif;?>
</style>
<script>
<?php $blockNavId = 'nav-' . $blockID; ?>
$(function()
{
var $block = $('#block<?php echo $blockID;?>');
var $nav = $block.find('#<?php echo $blockNavId;?>');
var visionPosition = "<?php echo 'visionPosition-' . $blockID;?>";
var themePosition = "<?php echo 'themePosition-' . $blockID;?>";
var systemModePosition = "<?php echo 'systemModePosition-' . $blockID;?>";
$nav.on('click', '.switch-icon', function(e)
{
var isPrev = $(this).is('.prev');
var $activeItem = $nav.children('.active');
var $next = $activeItem[isPrev ? 'prev' : 'next']('li:not(.switch-icon)');
if ($next.length) $next.find('a[data-toggle="tab"]').trigger('click');
else $nav.children('li:not(.switch-icon)')[isPrev ? 'last' : 'first']().find('a[data-toggle="tab"]').trigger('click');
e.preventDefault();
});
$nav.find('li').click(function()
{
if($(this).attr('id') == 'flowchart')
{
$('.block-guide .tutorialBtn').removeClass('hidden');
}
else
{
$('.block-guide .tutorialBtn').addClass('hidden');
}
if($(this).attr('id') !== 'visionSwitch') removePosition(visionPosition);
if($(this).attr('id') !== 'themeSwitch') removePosition(themePosition);
if($(this).attr('id') !== 'systemMode') removePosition(systemModePosition);
})
if(localStorage.getItem(visionPosition) && Number(localStorage.getItem(visionPosition)))
{
var scrollTopNum = Number(localStorage.getItem(visionPosition));
$block.scrollTop('#guideBody', scrollTopNum);
$block.find('#visionSwitch > a').click();
window.scrollTo(0, scrollTopNum);
}
else if(localStorage.getItem(themePosition) && Number(localStorage.getItem(themePosition)))
{
var scrollTopNum = Number(localStorage.getItem(themePosition));
$block.scrollTop('#guideBody', scrollTopNum);
$block.find('#themeSwitch > a').click();
window.scrollTo(0, scrollTopNum);
}
else if(localStorage.getItem(systemModePosition) && Number(localStorage.getItem(systemModePosition)))
{
var scrollTopNum = Number(localStorage.getItem(systemModePosition));
$block.scrollTop('#guideBody', scrollTopNum);
$block.find('#systemMode > a').click();
window.scrollTo(0, scrollTopNum);
}
else
{
$block.find('#flowchart > a').click();
}
/**
* Remove position.
*
* @param string $key
* @access public
* @return void
*/
function removePosition(key)
{
localStorage.getItem(key) && localStorage.removeItem(key);
}
});
</script>
<div class="panel-body" id="guideBody">
<div class="table-row">
<div class="col col-nav">
<ul class="nav nav-stacked nav-secondary scrollbar-hover guide-nav" id='<?php echo $blockNavId;?>'>
<?php foreach($lang->block->guideTabs as $tab => $tabName):?>
<?php if(strpos($tab, 'download') !== false and (!isset($config->xxserver->installed) or !$config->xuanxuan->turnon)) continue;?>
<?php if($tab == 'downloadMoblie' and common::checkNotCN()) continue;?>
<?php if(($tab == 'preference' or $tab == 'systemMode') and $this->config->vision == 'lite') continue;?>
<?php if($tab == 'systemMode' and !common::hasPriv('custom', 'mode')) continue;?>
<?php if($tab == 'preference' and !common::hasPriv('my', 'preference')) continue;?>
<?php if($tab == 'visionSwitch' and !strpos($app->user->visions, ',')) continue;?>
<li id="<?php echo $tab;?>">
<a href="###" title="<?php echo $tabName?>" data-target='<?php echo "#tab3{$blockNavId}Content{$tab}";?>' data-toggle="tab">
<?php echo $tabName;?>
<span class='btn-view'><i class='icon-arrow-right text-primary'></i><span>
</a>
</li>
<?php endforeach;?>
</ul>
</div>
<div class="col tab-content">
<div class="tab-pane fade active in" id='<?php echo "tab3{$blockNavId}Contentflowchart";?>'>
<?php include 'flowchart.html.php';?>
</div>
<div class="tab-pane fade" id='<?php echo "tab3{$blockNavId}ContentsystemMode";?>'>
<?php include 'systemmodeswitch.html.php';?>
</div>
<div class="tab-pane fade" id='<?php echo "tab3{$blockNavId}ContentvisionSwitch";?>'>
<?php include 'visionswitch.html.php';?>
</div>
<div class="tab-pane fade" id='<?php echo "tab3{$blockNavId}ContentthemeSwitch";?>'>
<?php include 'themeswitch.html.php';?>
</div>
<div class="tab-pane fade" id='<?php echo "tab3{$blockNavId}Contentpreference";?>'>
<?php include 'preference.html.php';?>
</div>
<div class="tab-pane fade" id='<?php echo "tab3{$blockNavId}ContentdownloadClient";?>'>
<div class='table-row app-client'>
<div class="col-4">
<div class='col'><h4><?php echo $lang->block->zentaoclient->common;?></h4></div>
<div class="col dataTitle"><?php echo $lang->block->zentaoclient->desc;?></div>
<div class='col pull-left col-md-12 os-and-desc'>
<nav class="menu pull-left col-md-3" data-ride="menu">
<ul class="tree tree-menu" data-ride="tree">
<?php foreach($lang->block->zentaoclient->edition as $edition => $editionName):?>
<li><?php echo html::a($this->createLink('misc', 'downloadClient', "action=getPackage&os=$edition", '', true), '<div class="avatar has-img avatar-circle">' . html::image($config->webRoot . "theme/default/images/guide/edition_{$edition}.png") . "</div> $editionName", '', 'class="iframe"');?></li>
<?php endforeach;?>
</ul>
</nav>
<div class="pull-left col-md-9 client-desc">
<?php echo html::image($config->webRoot . 'theme/default/images/guide/' . (common::checkNotCN() ? 'client_en.png' : 'client_cn.png'));?>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id='<?php echo "tab3{$blockNavId}ContentdownloadMoblie";?>'>
<div class='table-row app-qrcode'>
<div class="col-4">
<div class='col'><h4><?php echo $lang->block->zentaoapp->common;?></h4></div>
<div class="col dataTitle"><?php echo $lang->block->zentaoapp->desc;?></div>
<div class='col pull-left col-md-12'>
<div class="pull-left col-md-8 os-and-desc">
<div class="col-md-4"><?php echo html::image($config->webRoot . 'theme/default/images/guide/app_index.png');?></div>
<div class="col-md-4"><?php echo html::image($config->webRoot . 'theme/default/images/guide/app_execution.png');?></div>
<div class="col-md-4"><?php echo html::image($config->webRoot . 'theme/default/images/guide/app_statistic.png');?></div>
</div>
<div class="pull-left col-md-4 text-center qrcode-down">
<div><?php echo html::image($config->webRoot . 'theme/default/images/main/mobile_qrcode.png');?></div>
<div class="text-center text-primary"><?php echo $lang->block->zentaoapp->downloadTip;?></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>