Skip to content

ShopXO
ShopXO

纵之格 / ShopXO

通知 394
Star 16
Fork 11
ShopXO
ShopXO

前往新版Gitcode，体验更适合开发者的 AI 搜索 >>

提交 4c991c62 编写于 作者: G gongfuxiang
浏览文件
操作

可视化商品新增左图右文样式

上级 a10deff0
展开全部 隐藏空白更改
内联 并排
Showing with 1791 addition and 259 deletion
app/admin/controller/Design.php
浏览文件 @ 4c991c62
......@@ -77,38 +77,39 @@ class Design extends Base
// 模板数据
$assign = [
// 当前数据
'layout_data' => $layout_data,
'data' => $data,
'layout_data' => $layout_data,
'data' => $data,
// 页面列表
'pages_list' => BaseLayout::PagesList(),
'pages_list' => BaseLayout::PagesList(),
// 商品分类
'goods_category_list' => $goods_category,
'goods_category_list' => $goods_category,
// 商品搜索分类（分类）
'layout_goods_category' => $goods_category,
'layout_goods_category_field' => 'gci.category_id',
'layout_goods_category' => $goods_category,
'layout_goods_category_field' => 'gci.category_id',
// 品牌
'brand_list' => BrandService::CategoryBrand(),
'brand_list' => BrandService::CategoryBrand(),
// 静态数据
'border_style_type_list' => BaseLayout::$border_style_type_list,
'goods_view_list_show_style' => BaseLayout::$goods_view_list_show_style,
'many_images_view_list_show_style' => BaseLayout::$many_images_view_list_show_style,
'images_text_view_list_show_style' => BaseLayout::$images_text_view_list_show_style,
'border_style_type_list' => BaseLayout::$border_style_type_list,
'goods_view_list_show_style' => BaseLayout::$goods_view_list_show_style,
'many_images_view_list_show_style' => BaseLayout::$many_images_view_list_show_style,
'images_text_view_list_show_style' => BaseLayout::$images_text_view_list_show_style,
'images_magic_cube_view_list_show_style' => BaseLayout::$images_magic_cube_view_list_show_style,
// 首页商品排序规则
'goods_order_by_type_list' => MyConst('goods_order_by_type_list'),
'goods_order_by_rule_list' => MyConst('goods_order_by_rule_list'),
'goods_order_by_type_list' => MyConst('goods_order_by_type_list'),
'goods_order_by_rule_list' => MyConst('goods_order_by_rule_list'),
// 加载布局样式+管理
'is_load_layout' => 1,
'is_load_layout_admin' => 1,
'is_load_layout' => 1,
'is_load_layout_admin' => 1,
// 编辑器文件存放地址定义
'editor_path_type' => DesignService::AttachmentPathTypeValue($data['id']),
'editor_path_type' => DesignService::AttachmentPathTypeValue($data['id']),
];
MyViewAssign($assign);
return MyView();
......
app/layout/service/BaseLayout.php
浏览文件 @ 4c991c62
......@@ -35,6 +35,7 @@ class BaseLayout
// 商品样式类型
public static $goods_view_list_show_style = [
'routine' => '常规模式',
'leftright' => '左图右文',
'rolling' => '滚动模式',
];
......@@ -52,6 +53,28 @@ class BaseLayout
'rolling' => '滚动模式',
];
// 图片魔方样式类型
public static $images_magic_cube_view_list_show_style = [
'g1' => '1图',
'v2' => '2竖图',
'v3' => '3竖图',
'v4' => '4竖图',
'h2' => '2横图',
'h3' => '3横图',
'h4' => '4横图',
'lr12' => '1左右2',
'lr13' => '1左右3',
'lr21' => '2左右1',
'lr31' => '3左右1',
'tb12' => '1上下2',
'tb13' => '1上下3',
'tb21' => '2上下1',
'tb31' => '3上下1',
'lrv2h2'=> '2竖左右横2',
'lrh2v2'=> '2横左右竖2',
'g4' => '4图',
];
/**
* 配置处理-保存
* @author Devil
......@@ -127,9 +150,25 @@ class BaseLayout
}
break;
// 自定义html custom
case 'custom' :
$vss['config']['custom'] = empty($vss['config']['custom']) ? '' : base64_decode($vss['config']['custom']);
// 图片魔方 images-magic-cube
case 'images-magic-cube' :
foreach($vss['config']['data_list'] as &$imc)
{
$imc['images'] = ResourcesService::AttachmentPathHandle($imc['images']);
}
$key = 'content_images_';
foreach($vss['config'] as $mik=>$miv)
{
if(substr($mik, 0, strlen($key)) == $key)
{
$vss['config'][$mik] = ResourcesService::AttachmentPathHandle($miv);
}
}
break;
// 商品 goods
case 'goods' :
unset($vss['config']['data_list']);
break;
}
}
......@@ -165,12 +204,6 @@ class BaseLayout
{
foreach($config as &$v)
{
// 配置信息处理
if(!empty($v['config']))
{
$v['config']['frontend_config'] = empty($v['config']['frontend_config']) ? '' : self::FrontendConfigHandle($v['config']['frontend_config']);
}
// 布局类型
$v['value_arr'] = explode(':', $v['value']);
......@@ -179,12 +212,6 @@ class BaseLayout
{
foreach($v['children'] as &$vs)
{
// 配置信息处理
if(!empty($vs['config']))
{
$vs['config']['frontend_config'] = empty($vs['config']['frontend_config']) ? '' : self::FrontendConfigHandle($vs['config']['frontend_config']);
}
// 容器
if(!empty($vs['children']) && is_array($vs['children']))
{
......@@ -193,9 +220,6 @@ class BaseLayout
{
if(!empty($vss['value']) && !empty($vss['config']))
{
// 前端配置信息处理
$vss['config']['frontend_config'] = empty($vss['config']['frontend_config']) ? '' : self::FrontendConfigHandle($vss['config']['frontend_config']);
// 滚动配置
if(array_key_exists('view_list_show_style_value', $vss['config']))
{
......@@ -247,6 +271,22 @@ class BaseLayout
}
break;
// 图片魔方 images-magic-cube
case 'images-magic-cube' :
foreach($vss['config']['data_list'] as &$imc)
{
$imc['images'] = ResourcesService::AttachmentPathViewHandle($imc['images']);
}
$key = 'content_images_';
foreach($vss['config'] as $mik=>$miv)
{
if(substr($mik, 0, strlen($key)) == $key)
{
$vss['config'][$mik] = ResourcesService::AttachmentPathViewHandle($miv);
}
}
break;
// 商品
case 'goods' :
$p = [
......@@ -271,12 +311,6 @@ class BaseLayout
$res = self::GoodsDataList($p);
$vss['config']['data_list'] = $res['data'];
break;
// 自定义html
case 'custom' :
$vss['config']['custom'] = empty($vss['config']['custom']) ? '' : base64_encode(htmlspecialchars_decode($vss['config']['custom']));
break;
}
}
}
......@@ -384,6 +418,15 @@ class BaseLayout
}
break;
// 图片魔方 images-magic-cube
case 'images-magic-cube' :
foreach($vss['config']['data_list'] as &$imc)
{
$imc['images'] = ResourcesService::AttachmentPathViewHandle($imc['images']);
$imc['url'] = self::LayoutUrlValueHandle($imc['type'], $imc['value']);
}
break;
// 商品
case 'goods' :
$p = [
......@@ -494,9 +537,6 @@ class BaseLayout
}
}
// 前端配置处理
$config['frontend_config'] = empty($config['frontend_config']) ? '' : self::FrontendConfigHandle($config['frontend_config']);
// 滚动配置
if(array_key_exists('view_list_show_style_value', $config))
{
......@@ -717,35 +757,6 @@ class BaseLayout
return $url;
}
/**
* 前端配置处理
* @author Devil
* @blog http://gong.gg/
* @version 1.0.0
* @date 2021-06-18
* @desc description
* @param [array] $data [配偶者数据]
*/
public static function FrontendConfigHandle($data)
{
if(!empty($data) && is_array($data))
{
foreach($data as &$v)
{
if(is_array($v))
{
foreach($v as &$vs)
{
$vs = is_array($vs) ? $vs : (empty($vs) ? '' : urldecode($vs));
}
} else {
$v = is_array($v) ? $v : (empty($v) ? '' : urldecode($v));
}
}
}
return $data;
}
/**
* 商品搜索
* @author Devil
......
app/layout/view/base.html
浏览文件 @ 4c991c62
......@@ -36,6 +36,7 @@
<button type="button" draggable="true" class="am-btn am-btn-default am-radius am-btn-xs am-margin-xs" data-value="images">单图</button>
<button type="button" draggable="true" class="am-btn am-btn-default am-radius am-btn-xs am-margin-xs" data-value="many-images">多图</button>
<button type="button" draggable="true" class="am-btn am-btn-default am-radius am-btn-xs am-margin-xs" data-value="images-text">图文</button>
<button type="button" draggable="true" class="am-btn am-btn-default am-radius am-btn-xs am-margin-xs" data-value="images-magic-cube">图片魔方</button>
<button type="button" draggable="true" class="am-btn am-btn-default am-radius am-btn-xs am-margin-xs" data-value="video">视频</button>
<button type="button" draggable="true" class="am-btn am-btn-default am-radius am-btn-xs am-margin-xs" data-value="goods">商品</button>
<button type="button" draggable="true" class="am-btn am-btn-default am-radius am-btn-xs am-margin-xs" data-value="title">标题</button>
......@@ -100,6 +101,7 @@
data-custom-url-name="自定义链接"
data-custom-url-tips="请至少填写一个地址"
data-data-show-modal-tips="请选择数据展示模式"
data-data-show-modal-error-tips="展示模式有误"
>
{{if !empty($layout_data) and is_array($layout_data)}}
{{foreach $layout_data as $k=>$v}}
......@@ -111,7 +113,7 @@
<button type="button" class="am-btn am-btn-secondary am-radius am-btn-xs am-icon-square-o layout-submit layout-submit-set"> 布局设置</button>
<button type="button" class="am-btn am-btn-danger am-radius am-btn-xs am-icon-trash-o layout-submit layout-submit-del"> 布局移除</button>
</div>
<div class="layout-content-children {{if !empty($v['config']) and !empty($v['config']['frontend_config'])}}{{$v.config.frontend_config.ent}}{{/if}}" data-json="{{if !empty($v['config'])}}{{:urlencode(json_encode($v['config']))}}{{/if}}" style="{{if !empty($v['config']) and !empty($v['config']['frontend_config'])}}{{$v.config.frontend_config.style}}{{/if}}">
<div class="layout-content-children {{if !empty($v['config']) and !empty($v['config']['frontend_config'])}}{{$v.config.frontend_config.ent}}{{/if}}" data-json="{{if !empty($v['config'])}}{{:urlencode(base64_encode(json_encode($v['config'])))}}{{/if}}" style="{{if !empty($v['config']) and !empty($v['config']['frontend_config'])}}{{$v.config.frontend_config.style}}{{/if}}">
{{foreach $v.children as $ks=>$vs}}
{{if count($v['value_arr']) eq 1}}
{{include file="../../../layout/view/public/common/module_admin" /}}
......@@ -141,6 +143,9 @@
<!-- 侧边栏 - 模块配置 - 图文 -->
{{include file="../../../layout/view/public/offcanvas/offcanvas_module_config_images_text" /}}
<!-- 侧边栏 - 模块配置 - 图片魔方 -->
{{include file="../../../layout/view/public/offcanvas/offcanvas_module_config_images_magic_cube" /}}
<!-- 侧边栏 - 模块配置 - 视频 -->
{{include file="../../../layout/view/public/offcanvas/offcanvas_module_config_video" /}}
......
app/layout/view/form_back.html
浏览文件 @ 4c991c62
......@@ -23,6 +23,12 @@ function FormBackModuleConfigImagesText(e)
FormBackModuleConfigImagesTextHandle(e);
}
// 图片魔方选择回调处理
function FormBackModuleConfigImagesMagicCube(e)
{
FormBackModuleConfigImagesMagicCubeHandle(e);
}
// 视频选择回调处理
function FormBackModuleConfigVideo(e)
{
......
app/layout/view/public/content/images_magic_cube_show_style.html 0 → 100644
浏览文件 @ 4c991c62
<div class="config-view-show-style config-view-show-style-images-magic-cube">
{{foreach $images_magic_cube_view_list_show_style as $k=>$v}}
<label class="am-checkbox-inline">
<input type="radio" name="view_list_show_style" value="{{$k}}" data-am-ucheck />
<img src="{{$attachment_host}}/static/common/images/layout/{{$k}}.png" width="17" height="17" />
</label>
{{/foreach}}
<input type="hidden" name="view_list_show_style_value" value="" />
</div>
\ No newline at end of file
app/layout/view/public/content/images_text_show_style.html
浏览文件 @ 4c991c62
<div class="am-form-group am-form-group-refreshing">
<label>展示模式</label>
<div class="config-view-show-style">
{{foreach $images_text_view_list_show_style as $k=>$v}}
<label class="am-checkbox-inline">
<input type="radio" name="view_list_show_style" value="{{$k}}" data-am-ucheck {{if $k eq 'updown'}}checked{{/if}} /> {{$v}}
</label>
{{/foreach}}
<input type="hidden" name="view_list_show_style_value" value="" />
</div>
<div class="config-view-show-style">
{{foreach $images_text_view_list_show_style as $k=>$v}}
<label class="am-checkbox-inline">
<input type="radio" name="view_list_show_style" value="{{$k}}" data-am-ucheck /> {{$v}}
</label>
{{/foreach}}
<input type="hidden" name="view_list_show_style_value" value="" />
</div>
\ No newline at end of file
app/layout/view/public/content/many_images_show_style.html
浏览文件 @ 4c991c62
<div class="am-form-group am-form-group-refreshing">
<label>展示模式</label>
<div class="config-view-show-style">
{{foreach $many_images_view_list_show_style as $k=>$v}}
<label class="am-checkbox-inline">
<input type="radio" name="view_list_show_style" value="{{$k}}" data-am-ucheck {{if $k eq 'routine'}}checked{{/if}} /> {{$v}}
</label>
{{/foreach}}
<input type="hidden" name="view_list_show_style_value" value="" />
</div>
<div class="config-view-show-style">
{{foreach $many_images_view_list_show_style as $k=>$v}}
<label class="am-checkbox-inline">
<input type="radio" name="view_list_show_style" value="{{$k}}" data-am-ucheck {{if $k eq 'routine'}}checked{{/if}} /> {{$v}}
</label>
{{/foreach}}
<input type="hidden" name="view_list_show_style_value" value="" />
</div>
\ No newline at end of file
app/layout/view/public/offcanvas/offcanvas_module_config_goods.html
浏览文件 @ 4c991c62
......@@ -63,6 +63,9 @@
<div class="am-panel am-panel-default am-margin-top-lg">
<div class="am-panel-hd">内容样式</div>
<div class="am-panel-bd">
<!-- 展示模式 -->
{{include file="../../../layout/view/public/content/goods_show_style" /}}
<!-- 行展示数量 -->
{{include file="../../../layout/view/public/content/view_list_number" /}}
......@@ -83,9 +86,6 @@
<!-- 内边距 -->
{{include file="../../../layout/view/public/style/padding_4" key="_module" /}}
<!-- 展示模式 -->
{{include file="../../../layout/view/public/content/goods_show_style" /}}
</div>
</div>
......
app/layout/view/public/offcanvas/offcanvas_module_config_images_magic_cube.html 0 → 100644
浏览文件 @ 4c991c62
<!-- 侧边栏 - 模块配置 - 图文 -->
<div id="offcanvas-module-config-images-magic-cube" class="am-offcanvas module-offcanvas-container" data-default-images="{{$attachment_host}}/static/common/images/default-images-mini.png">
<div class="am-offcanvas-bar">
<div class="am-offcanvas-content am-padding-0">
<form class="am-form form-validation-module-offcanvas-images-magic-cube" request-type="sync" request-value="FormBackModuleConfigImagesMagicCube">
<!-- 展示模式 -->
<div class="am-panel am-panel-default">
<div class="am-panel-hd">展示模式<span class="am-form-group-label-tips-must">必选</span></div>
<div class="am-panel-bd">
{{include file="../../../layout/view/public/content/images_magic_cube_show_style" /}}
</div>
</div>
<!-- 内容 -->
<div class="am-panel am-panel-default">
<div class="am-panel-hd">内容设置<span class="am-form-group-label-tips-must">必传</span></div>
<div class="am-panel-bd">
<div class="config-images-magic-cube-container"></div>
<p class="am-text-center am-padding-vertical-sm am-text-grey tips-msg">请先选择展示模式</p>
</div>
</div>
<!-- 样式设置 -->
<div class="am-panel am-panel-default">
<div class="am-panel-hd">样式设置</div>
<div class="am-panel-bd">
<!-- 圆角、元素样式 -->
{{include file="../../../layout/view/public/style/border_radius" max="1000" key="_item" required="" /}}
<!-- 外边距、js取值使用 -->
{{include file="../../../layout/view/public/style/margin" key="" /}}
</div>
</div>
<div class="form-submit-container">
<button type="submit" class="am-btn am-btn-primary am-radius am-btn-xs am-btn-block" data-am-loading="{loadingText: '处理中...'}">确认</button>
</div>
</form>
</div>
</div>
</div>
\ No newline at end of file
app/layout/view/public/offcanvas/offcanvas_module_config_images_text.html
浏览文件 @ 4c991c62
......@@ -3,20 +3,20 @@
<div class="am-offcanvas-bar">
<div class="am-offcanvas-content am-padding-0">
<form class="am-form form-validation-module-offcanvas-images-text" request-type="sync" request-value="FormBackModuleConfigImagesText">
<!-- 展示模式 -->
<div class="am-panel am-panel-default">
<div class="am-panel-hd">内容设置<span class="am-form-group-label-tips-must">图片和标题必填一项</span></div>
<div class="am-panel-hd">展示模式<span class="am-form-group-label-tips-must">必选</span></div>
<div class="am-panel-bd">
<div class="config-images-text-container"></div>
<div class="business-operations-submit am-text-center am-block config-images-text-item-add">+添加图文</div>
{{include file="../../../layout/view/public/content/images_text_show_style" /}}
</div>
</div>
<!-- 内容样式 -->
<!-- 内容 -->
<div class="am-panel am-panel-default">
<div class="am-panel-hd">内容样式</div>
<div class="am-panel-hd">内容设置<span class="am-form-group-label-tips-must">图片和标题必填一项</span></div>
<div class="am-panel-bd">
<!-- 展示模式 -->
{{include file="../../../layout/view/public/content/images_text_show_style" /}}
<div class="config-images-text-container"></div>
<div class="business-operations-submit am-text-center am-block config-images-text-item-add">+添加图文</div>
</div>
</div>
......
app/layout/view/public/offcanvas/offcanvas_module_config_many_images.html
浏览文件 @ 4c991c62
......@@ -3,20 +3,21 @@
<div class="am-offcanvas-bar">
<div class="am-offcanvas-content am-padding-0">
<form class="am-form form-validation-module-offcanvas-many-images" request-type="sync" request-value="FormBackModuleConfigManyImages">
<!-- 展示模式 -->
<div class="am-panel am-panel-default">
<div class="am-panel-hd">内容设置<span class="am-form-group-label-tips-must">必传</span></div>
<div class="am-panel-hd">展示模式<span class="am-form-group-label-tips-must">必选</span></div>
<div class="am-panel-bd">
<div class="config-many-images-container"></div>
<div class="business-operations-submit am-text-center am-block config-many-images-item-add">+添加图片</div>
<!-- 展示模式 -->
{{include file="../../../layout/view/public/content/many_images_show_style" /}}
</div>
</div>
<!-- 内容样式 -->
<!-- 内容 -->
<div class="am-panel am-panel-default">
<div class="am-panel-hd">内容样式</div>
<div class="am-panel-hd">内容设置<span class="am-form-group-label-tips-must">必传</span></div>
<div class="am-panel-bd">
<!-- 展示模式 -->
{{include file="../../../layout/view/public/content/many_images_show_style" /}}
<div class="config-many-images-container"></div>
<div class="business-operations-submit am-text-center am-block config-many-images-item-add">+添加图片</div>
</div>
</div>
......
public/static/common/css/layout.admin.css
浏览文件 @ 4c991c62
......@@ -285,6 +285,14 @@
border-color: #ddd;
}
/**
* 图片魔方展示类型
*/
.config-view-show-style-images-magic-cube label:nth-child(7),
.config-view-show-style-images-magic-cube label:nth-child(13) {
margin-left: 0;
}
/**
* 表单小组合组件
*/
......@@ -566,9 +574,6 @@
.layout-category-choice .goods-category-choice-content ul li:not(:nth-child(-n+7)):last-child {
border-bottom: 0;
}
.layout-category-choice .goods-category-choice-content ul li:first-child {
border-bottom: 1px solid #dedede;
}
.layout-category-choice .goods-category-choice-content ul li a {
text-decoration: none;
}
......
public/static/common/css/layout.css
浏览文件 @ 4c991c62
......@@ -2,7 +2,7 @@
* 公共
*/
.layout-container [class*="am-u-"] {padding-left:0;padding-right:0;}
.layout-container a {text-decoration: none;color: #333;}
.layout-container a {text-decoration: none;}
.layout-container img {-webkit-transition: transform .3s ease-in;-moz-transition: transform .3s ease-in;-ms-transition: transform .3s ease-in;-o-transition: transform .3s ease-in;transition: transform .3s ease-in;}
.layout-container img:hover {transform: scale(1.03);-moz-transform: scale(1.03);-webkit-transform: scale(1.03);-o-transform: scale(1.03);-ms-transform: scale(1.03);}
......@@ -1929,4 +1929,12 @@
.module-fixed-doc-ent-width{width:100%}
.module-fixed-doc-ent-height{height:100%}
.module-fixed-doc-ent-auto{margin:0 auto}
.module-fixed-doc-ent-cover{object-fit:cover}
\ No newline at end of file
.module-fixed-doc-ent-cover{object-fit:cover}
/**
* 图片魔方
*/
.layout-module-images-magic-cube a img {
width: 100%;
height: 100%;
}
\ No newline at end of file
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或