模块优化

This commit is contained in:
pushuo 2022-07-19 20:22:58 +08:00
parent 689c3c62f6
commit 32f0e836d1
12 changed files with 169 additions and 9 deletions

View File

@ -19,7 +19,7 @@ class DesignController extends Controller
public function index(Request $request): View
{
$data = [
'editors' => ['editor-slide_show', 'editor-image401', 'editor-tab_product'],
'editors' => ['editor-slide_show', 'editor-image401', 'editor-tab_product', 'editor-image100'],
'languages' => LanguageRepo::all(),
'design_settings' => system_setting('base.design_setting'),
];

View File

@ -21,6 +21,7 @@ class Header extends Component
$this->addLink('会员管理', admin_route('customers.index'), equal_route('admin.customers.index'));
// $this->addLink('营销管理', admin_route('home.index'), equal_route('admin.promotions.index'));
$this->addLink('插件管理', admin_route('plugins.index'), equal_route('admin.plugins.index'));
$this->addLink('首页装修', admin_route('design.index'), equal_route('admin.design.index'));
$this->addLink('系统设置', admin_route('home.index'), equal_route('admin.settings.index'));
}

View File

@ -0,0 +1,44 @@
<?php
/**
* Render.php
*
* @copyright 2022 opencart.cn - All Rights Reserved
* @link http://www.guangdawangluo.com
* @author Edward Yang <yangjin@opencart.cn>
* @created 2022-07-08 17:09:15
* @modified 2022-07-08 17:09:15
*/
namespace Beike\Admin\View\DesignBuilders;
use Illuminate\View\Component;
use Illuminate\Contracts\View\View;
class Image100 extends Component
{
/**
* Create a new component instance.
*
* @return void
*/
public function __construct()
{
}
/**
* Get the view / contents that represent the component.
*
* @return View
*/
public function render(): View
{
$data['register'] = [
'code' => 'image100',
'sort' => 0,
'name' => '单图模块',
'icon' => '&#xe634;',
];
return view('admin::pages.design.module.image100', $data);
}
}

View File

@ -43,6 +43,8 @@ class DesignService
return self::handleSlideShow($content);
} elseif ($moduleCode == 'image401') {
return self::handleImage401($content);
} elseif ($moduleCode == 'image100') {
return self::handleImage401($content);
} elseif ($moduleCode == 'tab_product') {
return self::handleTabProducts($content);
}
@ -84,6 +86,7 @@ class DesignService
}
$content['images'] = self::handleImages($images);
$content['full'] = $content['full'] ?? false;
return $content;
}
@ -109,6 +112,7 @@ class DesignService
}
}
$content['tabs'] = $tabs;
$content['title'] = $content['title'][current_language_code()];
return $content;
}
@ -138,6 +142,7 @@ class DesignService
$images[$index]['link']['link'] = self::handleLink($type, $value);
}
}
return $images;
}

View File

@ -56,9 +56,10 @@ body.page-design .design-box .design-head > div {
text-align: center;
font-size: 0.8rem;
transition: all 0.2s ease-in-out;
border-right: 1px solid #5692ff;
}
body.page-design .design-box .design-head > div.save-btn {
border-left: 1px solid #5692ff;
body.page-design .design-box .design-head > div:last-of-type {
border-right: none;
}
body.page-design .design-box .design-head > div i {
margin-right: 7px;

View File

@ -852,6 +852,10 @@ body.page-account-address .addresses-wrap .item .address-bottom a, body.page-che
background-color: #eb4802;
}
.module-image-plus .container-fluid {
padding-right: 0;
padding-left: 0;
}
.module-image-plus .module-image-plus-top {
display: flex;
}

View File

@ -49,9 +49,10 @@ body.page-design {
text-align: center;
font-size: .8rem;
transition: all .2s ease-in-out;
border-right: 1px solid #5692ff;
&.save-btn {
border-left: 1px solid #5692ff;
&:last-of-type {
border-right: none;
}
i {

View File

@ -26,8 +26,9 @@
<div class="sidebar-edit-wrap" id="app" v-cloak>
<div class="design-head">
<template v-if="design.editType == 'add'">
<div @click="exitDesign"><i class="el-icon-switch-button"></i>退出</div>
<div @click="saveButtonClicked" class="save-btn"><i class="el-icon-check"></i>保存</div>
<div @click="exitDesign"><i class="el-icon-switch-button"></i>返回</div>
<div @click="viewHome"><i class="el-icon-view"></i>查看页面</div>
<div @click="saveButtonClicked"><i class="el-icon-check"></i>保存</div>
</template>
<template v-else>
<div @click="showAllModuleButtonClicked"><i class="el-icon-back"></i>返回</div>
@ -197,7 +198,11 @@
},
exitDesign() {
location = '/';
history.back();
},
viewHome() {
window.open('/');
},
showAllModuleButtonClicked() {

View File

@ -0,0 +1,76 @@
<template id="module-editor-image100-template">
<div class="image-edit-wrapper">
<div class="module-editor-row">设置</div>
<div class="module-edit-group">
<div class="module-edit-title">是否全屏</div>
<el-switch v-model="module.full"></el-switch>
</div>
<div class="module-editor-row">内容</div>
<div class="module-edit-group">
<div class="module-edit-title">选择图片</div>
<div class="">
<div class="pb-images-top">
<pb-image-selector v-model="module.images[0].image"></pb-image-selector>
<div class="tag">建议尺寸: 1920 x 500</div>
</div>
<link-selector v-model="module.images[0].link"></link-selector>
</div>
</div>
</div>
</template>
<script type="text/javascript">
Vue.component('module-editor-image100', {
template: '#module-editor-image100-template',
props: ['module'],
data: function () {
return {
//
}
},
watch: {
module: {
handler: function (val) {
this.$emit('on-changed', val);
},
deep: true
}
},
created: function () {
//
},
methods: {
}
});
setTimeout(() => {
const make = {
style: {
background_color: ''
},
floor: languagesFill(''),
full: true,
images: [
{
image: languagesFill('/demo/banner-2.png'),
show: true,
link: {
type: 'product',
value:''
}
}
]
}
let register = @json($register);
register.make = make;
app.source.modules.push(register)
}, 100)
</script>

View File

@ -1,6 +1,11 @@
@charset "UTF-8";
.module-image-plus {
.container-fluid {
padding-right: 0;
padding-left: 0;
}
.module-image-plus-top {
display: flex;

View File

@ -0,0 +1,18 @@
<section class="module-item {{ $design ? 'module-item-design' : ''}}" id="module-{{ $module_id }}">
@if ($design)
<div class="module-edit">
<div class="edit-wrap">
<div class=""><i class="bi bi-chevron-down"></i></div>
<div class=""><i class="bi bi-chevron-up"></i></div>
<div class="delete"><i class="bi bi-x-lg"></i></div>
<div class="edit"><i class="bi bi-pencil-square"></i></div>
</div>
</div>
@endif
<div class="module-image-plus module-info mb-5">
<div class="container{{ $content['full'] ? '-fluid' : '' }}">
<a class="col-12"><img src="{{ $content['images'][0]['image'] }}" class="img-fluid"></a>
</div>
</div>
</section>

View File

@ -10,7 +10,7 @@
</div>
@endif
<div class="module-info module-tab-product">
<div class="module-title">推荐商品模块</div>
<div class="module-title">{{ $content['title'] }}</div>
<div class="container">
@if ($content['tabs'])
<div class="nav justify-content-center mb-3">