This commit is contained in:
2025-10-29 15:32:26 +08:00
parent d90614805b
commit b7462657cd
78921 changed files with 2753938 additions and 71 deletions

View File

@@ -0,0 +1,28 @@
<?php
namespace addon\postertemplate\api\controller;
use addon\postertemplate\model\PosterTemplate as PosterTemplateModel;
use app\api\controller\BaseApi;
/**
* 海报模板 控制器
*/
class Postertemplate extends BaseApi
{
/**
* 海报模板列表
* @return mixed
*/
public function lists()
{
$page_index = input('page', 1);
$page_size = input('page_size', PAGE_LIST_ROWS);
$poster_template_model = new PosterTemplateModel();
$res = $poster_template_model->getPosterTemplatePageList([ [ 'site_id', '=', $this->site_id ] ], $page_index, $page_size);
return $res;
}
}

View File

@@ -0,0 +1,30 @@
<?php
return [
// 自定义模板页面类型,格式:[ 'title' => '页面类型名称', 'name' => '页面标识', 'path' => '页面路径', 'value' => '页面数据json格式' ]
'template' => [],
// 后台自定义组件——装修
'util' => [],
// 自定义页面路径
'link' => [],
// 自定义图标库
'icon_library' => [],
// uni-app 组件,格式:[ 'name' => '组件名称/文件夹名称', 'path' => '文件路径/目录路径' ]多个逗号隔开自定义组件名称前缀必须是diy-,也可以引用第三方组件
'component' => [],
// uni-app 页面,多个逗号隔开
'pages' => [],
// 模板信息,格式:'title' => '模板名称', 'name' => '模板标识', 'cover' => '模板封面图', 'preview' => '模板预览图', 'desc' => '模板描述'
'info' => [],
// 主题风格配色格式可以自由定义扩展【在uni-app中通过this.themeStyle... 获取定义的颜色字段例如this.themeStyle.main_color】
'theme' => [],
// 自定义页面数据,格式:[ 'title' => '页面名称', 'name' => "页面标识", 'value' => [页面数据json格式] ]
'data' => []
];

View File

@@ -0,0 +1,20 @@
<?php
// 事件定义文件
return [
'bind' => [
],
'listen' => [
//展示活动
'ShowPromotion' => [
'addon\postertemplate\event\ShowPromotion',
],
'PosterTemplate' => [
'addon\postertemplate\event\PosterTemplate',
]
],
'subscribe' => [
],
];

View File

@@ -0,0 +1,13 @@
<?php
return [
'name' => 'postertemplate',
'title' => '商品海报',
'description' => '多样化的商品海报模板库',
'type' => 'tool', //插件类型 system :系统插件(自动安装), promotion:扩展营销插件 tool:工具插件
'status' => 1,
'author' => '',
'version' => '5.3.1',
'version_no' => '525231212001',
'content' => '',
];

View File

@@ -0,0 +1,40 @@
<?php
// +----------------------------------------------------------------------
// | 平台端菜单设置
// +----------------------------------------------------------------------
return [
[
'name' => 'ADDON_POSTERTEMPLATE',
'title' => '商品海报',
'url' => 'postertemplate://shop/postertemplate/lists',
'parent' => 'PROMOTION_TOOL',
'is_show' => 1,
'is_control' => 1,
'is_icon' => 0,
'picture' => 'addon/postertemplate/poster.jpg',
'picture_select' => 'addon/postertemplate/poster_selected.jpg',
'sort' => 100,
'child_list' => [
[
'name' => 'ADDON_POSTERTEMPLATE_LIST',
'title' => '海报列表',
'url' => 'postertemplate://shop/postertemplate/lists',
'is_show' => 1,
],
[
'name' => 'ADDON_POSTERTEMPLATE_ADD',
'title' => '新增海报',
'url' => 'postertemplate://shop/postertemplate/addpostertemplate',
'is_show' => 0,
],
[
'name' => 'ADDON_POSTERTEMPLATE_EDIT',
'title' => '编辑海报',
'url' => 'postertemplate://shop/postertemplate/editpostertemplate',
'is_show' => 0,
],
],
]
];

View File

@@ -0,0 +1 @@
SET NAMES 'utf8';

View File

@@ -0,0 +1 @@
SET NAMES 'utf8';

View File

@@ -0,0 +1,17 @@
<?php
namespace addon\postertemplate\event;
/**
* 应用安装
*/
class Install
{
/**
* 执行安装
*/
public function handle()
{
return success();
}
}

View File

@@ -0,0 +1,25 @@
<?php
namespace addon\postertemplate\event;
use addon\postertemplate\model\PosterTemplate as PosterTemplateModel;
/**
* 活动展示
*/
class PosterTemplate
{
/**
* 活动展示
*
* @return
*/
public function handle($params)
{
$poster_template_model = new PosterTemplateModel();
$poster_list = $poster_template_model ->getPosterTemplateList([['site_id', '=', $params['site_id']],['template_status','=',1]],'template_id,poster_name,site_id');
return $poster_list;
}
}

View File

@@ -0,0 +1,38 @@
<?php
namespace addon\postertemplate\event;
/**
* 活动展示
*/
class ShowPromotion
{
/**
* 活动展示
* @return array
*/
public function handle()
{
$data = [
'shop' => [
[
//插件名称
'name' => 'postertemplate',
//店铺端展示分类 shop:营销活动 member:互动营销
'show_type' => 'tool',
//展示主题
'title' => '商品海报',
//展示介绍
'description' => '多样化的商品海报模板库',
//展示图标
'icon' => 'addon/postertemplate/icon.png',
//跳转链接
'url' => 'postertemplate://shop/postertemplate/lists',
]
]
];
return $data;
}
}

View File

@@ -0,0 +1,17 @@
<?php
namespace addon\postertemplate\event;
/**
* 应用卸载
*/
class UnInstall
{
/**
* 执行卸载
*/
public function handle()
{
return success();
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1,193 @@
<?php
namespace addon\postertemplate\model;
use app\model\BaseModel;
/**
* 海报模板
*/
class PosterTemplate extends BaseModel
{
//默认模板数据
const DEFAULT_TEMPLATE = [
'template_id' => 0,
'template_type' => 'goods',
'poster_name' => '',
'background' => '',
//二维码
'qrcode_type' => '',
'qrcode_width' => 80,
'qrcode_height' => 80,
'qrcode_top' => 540,
'qrcode_left' => 260,
//json数据
'template_json' => [
//头像
'headimg_is_show' => 1,
'headimg_shape' => 'circle',
'headimg_width' => 30,
'headimg_height' => 30,
'headimg_top' => 30,
'headimg_left' => 20,
//昵称
'nickname_is_show' => 1,
'nickname_color' => '#000000',
'nickname_font_size' => 14,
'nickname_width' => 150,
'nickname_height' => 14,
'nickname_top' => 36,
'nickname_left' => 60,
//商品图片
'goods_img_is_show' => 1,
'goods_img_top' => 233,
'goods_img_left' => 19,
'goods_img_width' => 300,
'goods_img_height' => 300,
//商品名称
'goods_name_is_show' => 1,
'goods_name_color' => '#000000',
'goods_name_font_size' => 14,
'goods_name_top' => 174,
'goods_name_left' => 40,
'goods_name_width' => 200,
'goods_name_height' => 30,
//商品销售价
'goods_price_is_show' => 1,
'goods_price_color' => '#FF4544',
'goods_price_font_size' => 18,
'goods_price_width' => 100,
'goods_price_height' => 14,
'goods_price_top' => 568,
'goods_price_left' => 28,
//商品划线价
'goods_market_price_is_show' => 1,
'goods_market_price_color' => '#000000',
'goods_market_price_font_size' => 14,
'goods_market_price_width' => 100,
'goods_market_price_height' => 14,
'goods_market_price_top' => 572,
'goods_market_price_left' => 108,
//店铺名称
'store_name_is_show' => 1,
'store_name_color' => '#000000',
'store_name_font_size' => 14,
'store_name_width' => 80,
'store_name_height' => 20,
'store_name_top' => 44,
'store_name_left' => 270,
//店铺logo
'store_logo_is_show' => 1,
'store_logo_width' => 60,
'store_logo_height' => 25,
'store_logo_top' => 21,
'store_logo_left' => 270,
]
];
/**
* 添加海报模板
* @param array $condition
* @param int $page
* @param int $page_size
* @param string $field
* @param string $order
* @return array
*/
public function addPosterTemplate($data)
{
$res = model('poster_template')->add($data);
if ($res === false) {
return $this->error('', 'RESULT_ERROR');
}
return $this->success($res);
}
/**
* 编辑海报模板
* @param $data
* @param $condition
* @return array
*/
public function editPosterTemplate($data, $condition)
{
$res = model('poster_template')->update($data, $condition);
if ($res === false) {
return $this->error('', 'SAVE_FAIL');
}
return $this->success($res);
}
/**
* 删除海报模板
* @param array $condition
* @param int $page
* @param int $page_size
* @param string $field
* @param string $order
* @return array
*/
public function deletePosterTemplate($condition)
{
$res = model('poster_template')->delete($condition);
if ($res === false) {
return $this->error('', 'RESULT_ERROR');
}
return $this->success($res);
}
/**
* 获取海报模板信息
* @param array $condition
* @param string $field
* @return array
*/
public function getPosterTemplateInfo($condition = [], $field = '*')
{
$info = model('poster_template')->getInfo($condition, $field);
return $this->success($info);
}
/**
* 获取海报模板列表
* @param array $condition
* @param string $field
* @param string $order
* @param null $limit
* @return array
*/
public function getPosterTemplateList($condition = [], $field = '*', $order = 'create_time desc')
{
$list = model('poster_template')->getList($condition, $field, $order);
return $this->success($list);
}
/**
* 获取海报模板分页列表
* @param array $condition
* @param int $page
* @param int $page_size
* @param string $field
* @param string $order
* @return array
*/
public function getPosterTemplatePageList($condition = [], $page = 1, $page_size = PAGE_LIST_ROWS, $field = '*', $order = 'create_time desc')
{
$list = model('poster_template')->pageList($condition, $field, $order, $page, $page_size);
return $this->success($list);
}
/*************************** 模板默认数据 ********************************/
public function getMubanInfo($condition = [], $field = '*', $alias = 'a', $join = [])
{
$list = model('poster_muban')->getInfo($condition, $field, $alias, $join);
return $this->success($list);
}
public function getMubanList($condition = [], $field = '*')
{
$list = model('poster_muban')->getList($condition, $field);
return $this->success($list);
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 716 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 726 B

View File

@@ -0,0 +1,386 @@
<?php
namespace addon\postertemplate\shop\controller;
use addon\postertemplate\model\PosterTemplate as PosterTemplateModel;
use app\model\system\Site;
use app\model\upload\Upload;
use app\shop\controller\BaseShop;
use extend\Poster as PosterExtend;
/**
* 海报模板 控制器
*/
class Postertemplate extends BaseShop
{
/**
* 海报模板列表
* @return mixed
*/
public function lists()
{
if (request()->isJson()) {
$page_index = input('page', 1);
$page_size = input('page_size', PAGE_LIST_ROWS);
$search_text = input('search_text', '');
$condition = [ [ 'site_id', '=', $this->site_id ] ];
$condition[] = [ 'template_type', '=', 'goods' ];
if (!empty($search_text)) {
$condition[] = [ 'poster_name', 'like', '%' . $search_text . '%' ];
}
$poster_template_model = new PosterTemplateModel();
$res = $poster_template_model->getPosterTemplatePageList($condition, $page_index, $page_size);
return $res;
} else {
return $this->fetch('poster_template/lists');
}
}
/**
* 添加海报模板
* @return mixed
*/
public function addPosterTemplate()
{
$poster_template_model = new PosterTemplateModel();
if (request()->isJson()) {
$default_template = PosterTemplateModel::DEFAULT_TEMPLATE;
$add_data = [];
$template_json = [];
foreach ($default_template as $field => $field_value) {
if ($field == 'template_json') {
foreach ($default_template[ 'template_json' ] as $json_field => $json_field_value) {
$template_json[ $json_field ] = input($json_field, $json_field_value);
}
} else {
$add_data[ $field ] = input($field, $field_value);
}
}
unset($add_data[ 'template_id' ]);
$add_data[ 'site_id' ] = $this->site_id;
$add_data[ 'template_json' ] = json_encode($template_json, true);
return $poster_template_model->addPosterTemplate($add_data);
} else {
//模板信息
$muban_id = input('muban_id', 0);
$muban_info = $muban_info = $poster_template_model->getMubanInfo([ [ 'muban_id', '=', $muban_id ] ])[ 'data' ];
if (!empty($muban_info)) {
$template_info = $muban_info;
$template_info[ 'template_json' ] = json_decode($template_info[ 'template_json' ], true);
$template_info[ 'template_id' ] = 0;
} else {
$template_info = PosterTemplateModel::DEFAULT_TEMPLATE;
}
$template_info = array_merge($template_info, $template_info[ 'template_json' ]);
unset($template_info[ 'template_json' ]);
$this->assign('template_info', $template_info);
//站点信息
$site_model = new Site();
$site_info = $site_model->getSiteInfo([ [ "site_id", "=", $this->site_id ] ], 'site_name,logo')[ 'data' ];
$this->assign('site_data', $site_info);
return $this->fetch('poster_template/add');
}
}
/**
* 添加海报模板
* @return mixed
*/
public function editPosterTemplate()
{
$template_id = input('template_id', '');
$poster_template_model = new PosterTemplateModel();
if (request()->isJson()) {
$default_template = PosterTemplateModel::DEFAULT_TEMPLATE;
$edit_data = [];
$template_json = [];
foreach ($default_template as $field => $field_value) {
if ($field == 'template_json') {
foreach ($default_template[ 'template_json' ] as $json_field => $json_field_value) {
$template_json[ $json_field ] = input($json_field, $json_field_value);
}
} else {
$edit_data[ $field ] = input($field, $field_value);
}
}
unset($edit_data[ 'template_id' ]);
$edit_data[ 'site_id' ] = $this->site_id;
$edit_data[ 'template_json' ] = json_encode($template_json, true);
return $poster_data = $poster_template_model->editPosterTemplate($edit_data, [
[ 'template_id', '=', $template_id ],
[ 'site_id', '=', $this->site_id ]
]);
} else {
//模板信息
$template_info = $poster_template_model->getPosterTemplateInfo([
[ 'site_id', '=', $this->site_id ],
[ 'template_id', '=', $template_id ],
], '*')[ 'data' ];
$template_info = array_merge($template_info, json_decode($template_info[ 'template_json' ], true));
if (empty($template_info)) $this->error('模板信息有误');
unset($template_info[ 'template_json' ]);
$this->assign('template_info', $template_info);
//站点信息
$site_model = new Site();
$site_info = $site_model->getSiteInfo([ [ "site_id", "=", $this->site_id ] ], 'site_name,logo');
$this->assign('site_data', $site_info[ 'data' ]);
return $this->fetch('poster_template/add');
}
}
/**
* 获取海报模板预览
* @return mixed
*/
public function posterTemplateDetail()
{
$template_id = input('template_id', '');
$condition = [
[ 'template_id', '=', $template_id ],
[ 'site_id', '=', $this->site_id ]
];
$poster_template_model = new PosterTemplateModel();
$poster_data = $poster_template_model->getPosterTemplateInfo($condition);
if (empty($poster_data[ 'data' ])) {
return $poster_template_model->error(null, '模板信息有误');
}
$poster_data[ 'data' ][ 'template_json' ] = json_decode($poster_data[ 'data' ][ 'template_json' ], true);
$site_model = new Site();
$site_info = $site_model->getSiteInfo([ [ "site_id", "=", $this->site_id ] ]);
$poster_width = 720;
$poster_height = 1280;
$poster = new PosterExtend($poster_width, $poster_height);
$ground = [
[
'action' => 'setBackground', // 设背景色
'data' => [ 255, 255, 255 ]
],
];
$fontRate = 0.725; // 20px 等于 14.5磅,换算比率 1px = 0.725磅
$option = [
[
'action' => 'imageText', // 写入店铺名称
'data' => [
$site_info[ 'data' ][ 'site_name' ],
$poster_data[ 'data' ][ 'template_json' ][ 'store_name_font_size' ] * $fontRate * 2,
hex2rgb($poster_data[ 'data' ][ 'template_json' ][ 'store_name_color' ]),
$poster_data[ 'data' ][ 'template_json' ][ 'store_name_left' ] * 2,
( $poster_data[ 'data' ][ 'template_json' ][ 'store_name_top' ] + $poster_data[ 'data' ][ 'template_json' ][ 'store_name_font_size' ] ) * 2,
$poster_data[ 'data' ][ 'template_json' ][ 'store_name_width' ] * 2,
$poster_data[ 'data' ][ 'template_json' ][ 'store_name_height' ] * 2,
0,
$poster_data[ 'data' ][ 'template_json' ][ 'store_name_is_show' ]
]
],
[
'action' => 'imageCopy', // 店铺logo
'data' => [
!empty($site_info[ 'data' ][ 'logo_square' ]) ? $site_info[ 'data' ][ 'logo_square' ] : getUrl() . '/app/shop/view/public/img/shop_logo.png',
$poster_data[ 'data' ][ 'template_json' ][ 'store_logo_left' ] * 2,
$poster_data[ 'data' ][ 'template_json' ][ 'store_logo_top' ] * 2,
$poster_data[ 'data' ][ 'template_json' ][ 'store_logo_width' ] * 2,
$poster_data[ 'data' ][ 'template_json' ][ 'store_logo_height' ] * 2,
'square',
0,
$poster_data[ 'data' ][ 'template_json' ][ 'store_logo_is_show' ]
]
],
[
'action' => 'imageCopy', // 写入商品图
'data' => [
getUrl() . '/public/static/img/goods_template.png',
$poster_data[ 'data' ][ 'template_json' ][ 'goods_img_left' ] * 2,
$poster_data[ 'data' ][ 'template_json' ][ 'goods_img_top' ] * 2,
$poster_data[ 'data' ][ 'template_json' ][ 'goods_img_width' ] * 2,
$poster_data[ 'data' ][ 'template_json' ][ 'goods_img_height' ] * 2,
!empty($poster_data[ 'data' ][ 'template_json' ][ 'goods_img_shape' ]) ? $poster_data[ 'data' ][ 'template_json' ][ 'goods_img_shape' ] : 'square',
0,
$poster_data[ 'data' ][ 'template_json' ][ 'goods_img_is_show' ]
]
],
[
'action' => 'imageText', // 写入商品名称
'data' => [
'商品名称-商品名称-商品名称',
$poster_data[ 'data' ][ 'template_json' ][ 'goods_name_font_size' ] * $fontRate * 2,
hex2rgb($poster_data[ 'data' ][ 'template_json' ][ 'goods_name_color' ]),
$poster_data[ 'data' ][ 'template_json' ][ 'goods_name_left' ] * 2,
( $poster_data[ 'data' ][ 'template_json' ][ 'goods_name_top' ] + $poster_data[ 'data' ][ 'template_json' ][ 'goods_name_font_size' ] ) * 2 + 10,
$poster_data[ 'data' ][ 'template_json' ][ 'goods_name_width' ] * 2,
$poster_data[ 'data' ][ 'template_json' ][ 'goods_name_height' ] * 2,
0,
$poster_data[ 'data' ][ 'template_json' ][ 'goods_name_is_show' ]
]
],
[
'action' => 'imageCopy', // 写入商品二维码
'data' => [
getUrl() . '/public/static/img/caner_erweima.png',
$poster_data[ 'data' ][ 'qrcode_left' ] * 2,
$poster_data[ 'data' ][ 'qrcode_top' ] * 2,
$poster_data[ 'data' ][ 'qrcode_width' ] * 2,
$poster_data[ 'data' ][ 'qrcode_height' ] * 2,
'square',
0,
1
]
],
[
'action' => 'imageText', // 写入商品价格
'data' => [
'¥' . '100.00',
$poster_data[ 'data' ][ 'template_json' ][ 'goods_price_font_size' ] * $fontRate * 2,
hex2rgb($poster_data[ 'data' ][ 'template_json' ][ 'goods_price_color' ]),
$poster_data[ 'data' ][ 'template_json' ][ 'goods_price_left' ] * 2,
( $poster_data[ 'data' ][ 'template_json' ][ 'goods_price_top' ] + $poster_data[ 'data' ][ 'template_json' ][ 'goods_price_font_size' ] ) * 2,
$poster_data[ 'data' ][ 'template_json' ][ 'goods_price_width' ] * 2,
$poster_data[ 'data' ][ 'template_json' ][ 'goods_price_height' ] * 2,
0,
$poster_data[ 'data' ][ 'template_json' ][ 'goods_price_is_show' ]
]
],
[
'action' => 'imageText', // 写入商品划线价格
'data' => [
'¥' . '199.00',
$poster_data[ 'data' ][ 'template_json' ][ 'goods_market_price_font_size' ] * $fontRate * 2,
hex2rgb($poster_data[ 'data' ][ 'template_json' ][ 'goods_market_price_color' ]),
$poster_data[ 'data' ][ 'template_json' ][ 'goods_market_price_left' ] * 2,
( $poster_data[ 'data' ][ 'template_json' ][ 'goods_market_price_top' ] + $poster_data[ 'data' ][ 'template_json' ][ 'goods_market_price_font_size' ] ) * 2,
$poster_data[ 'data' ][ 'template_json' ][ 'goods_market_price_width' ] * 2,
$poster_data[ 'data' ][ 'template_json' ][ 'goods_market_price_height' ] * 2,
0,
$poster_data[ 'data' ][ 'template_json' ][ 'goods_market_price_is_show' ]
]
],
[
'action' => 'imageText', // 写入线
'data' => [
'一一一一',
$poster_data[ 'data' ][ 'template_json' ][ 'goods_market_price_font_size' ] * $fontRate * 2,
hex2rgb($poster_data[ 'data' ][ 'template_json' ][ 'goods_market_price_color' ]),
$poster_data[ 'data' ][ 'template_json' ][ 'goods_market_price_left' ] * 2 - 5,
( $poster_data[ 'data' ][ 'template_json' ][ 'goods_market_price_top' ] + $poster_data[ 'data' ][ 'template_json' ][ 'goods_market_price_font_size' ] ) * 2,
$poster_data[ 'data' ][ 'template_json' ][ 'goods_market_price_width' ] * 2,
$poster_data[ 'data' ][ 'template_json' ][ 'goods_market_price_height' ] * 2,
0,
$poster_data[ 'data' ][ 'template_json' ][ 'goods_market_price_is_show' ]
]
],
];
$member_option = [
[
'action' => 'imageCopy', // 写入用户头像
'data' => [
getUrl() . '/public/static/img/default_img/head.png',
$poster_data[ 'data' ][ 'template_json' ][ 'headimg_left' ] * 2,
$poster_data[ 'data' ][ 'template_json' ][ 'headimg_top' ] * 2,
$poster_data[ 'data' ][ 'template_json' ][ 'headimg_width' ] * 2,
$poster_data[ 'data' ][ 'template_json' ][ 'headimg_height' ] * 2,
!empty($poster_data[ 'data' ][ 'template_json' ][ 'headimg_shape' ]) ? $poster_data[ 'data' ][ 'template_json' ][ 'headimg_shape' ] : 'square',
0,
$poster_data[ 'data' ][ 'template_json' ][ 'headimg_is_show' ]
]
],
[
'action' => 'imageText', // 写入分享人昵称
'data' => [
'用户昵称',
$poster_data[ 'data' ][ 'template_json' ][ 'nickname_font_size' ] * $fontRate * 2,
hex2rgb($poster_data[ 'data' ][ 'template_json' ][ 'nickname_color' ]),
$poster_data[ 'data' ][ 'template_json' ][ 'nickname_left' ] * 2,
( $poster_data[ 'data' ][ 'template_json' ][ 'nickname_top' ] + $poster_data[ 'data' ][ 'template_json' ][ 'nickname_font_size' ] ) * 2,
$poster_data[ 'data' ][ 'template_json' ][ 'nickname_width' ] * 2,
$poster_data[ 'data' ][ 'template_json' ][ 'nickname_height' ] * 2,
0,
$poster_data[ 'data' ][ 'template_json' ][ 'nickname_is_show' ]
]
],
];
if (!empty($poster_data[ 'data' ][ 'background' ])) {
list($width, $height, $type, $attr) = getimagesize(img(trim($poster_data[ 'data' ][ 'background' ])));
$height = 720 * $height / $width;
$back_ground = [
[
'action' => 'imageCopy', // 写入背景图
'data' => [
img($poster_data[ 'data' ][ 'background' ]),
0,
0,
720,
$height,
'square',
0,
1
]
],
];
} else {
$back_ground = [
[
'action' => 'setBackground', // 设背景色
'data' => [ 255, 255, 255 ]
],
];
}
$option = array_merge($ground, $back_ground, $option, $member_option);
$option_res = $poster->create($option);
if (is_array($option_res)) return $option_res;
$pic_name = rand(10000, 99999);
$res = $option_res->jpeg('upload/poster/goods', 'goods_' . $pic_name);
if ($res[ 'code' ] == 0) {
$upload = new Upload($this->site_id);
$res = $upload->fileCloud($res[ 'data' ][ 'path' ]);
}
return $res;
}
/**
* 删除海报模板
* @return mixed
*/
public function delPosterTemplate()
{
if (request()->isJson()) {
$template_ids = input('template_ids', '');
$condition = [
[ 'template_id', 'in', $template_ids ],
[ 'site_id', '=', $this->site_id ],
];
$poster_template_model = new PosterTemplateModel();
$res = $poster_template_model->deletePosterTemplate($condition);
return $res;
}
}
/**
* 编辑模板状态啊
* @return array
*/
public function editstatus()
{
if (request()->isJson()) {
$template_id = input('template_id', 0);
$template_status = input('template_status', 0);
$condition = [
[ 'template_id', 'in', $template_id ],
[ 'site_id', '=', $this->site_id ]
];
$data = [ 'template_status' => $template_status ];
$poster_template_model = new PosterTemplateModel();
$res = $poster_template_model->editPosterTemplate($data, $condition);
return $res;
}
}
}

View File

@@ -0,0 +1,520 @@
<style>
.layui-layout-admin .layui-body .body-content{min-height: initial;padding-top: 0;padding-bottom: 0;margin: 0;}
.layui-form-label.mid{width: 100px;}
.layui-form-label.mid+.layui-input-block{margin-left: 100px;}
.new-mid{margin-left: -20px !important;}
.poster-form{display: flex;background: #eee;}
.poster-left{width: 400px;height: 800px;background: #FFFFFF;padding: 10px 30px 10px 10px;}
.poster-left-header{font-size: 18px;border-bottom: 1px solid #eee;padding: 0 0 10px 0;margin: 0 0 10px 0;}
.poster-left-header1{font-size: 18px;padding: 0 0 10px 0;}
.poster-left-header2{font-size: 18px;padding: 0 0 10px 0;}
.layui-input-block{margin-left: 0;}
.poster-headimg,.poster-name{display: flex;}
.poster-right{width: 360px;height: 640px;opacity: 0.9;margin: 20px 0 0 271px;background-color: #fff;}
.tips{width: 153px;height: 16px;font-size: 12px;font-family: Microsoft YaHei;font-weight: 400;color: #909399;padding-left: 100px;}
.album-img-select{height: 30px;line-height: 30px;margin: 0 0 5px 20px;}
.upload-img-block{width: 300px;height: 100px;}
.upload{top: 50% !important;height: 100px;}
.form-row{padding-top: 20px;}
.poster-tips{background: #fff;width: 280px;margin-left: 320px;padding: 20px 20px;border: 1px solid #e8e8e8;border-right: none;}
.set-tips{font-size: 16px;font-family: Microsoft YaHei;font-weight: bolder;color: #303133;line-height: 22px;}
.content{font-size: 12px;font-family: Microsoft YaHei;font-weight: 400;color: #909399;line-height: 22px;margin-top: 10px;}
.goods-info{width: 340px;height: 354px;border-radius: 10px;margin: 50px 15px 20px;}
.goods_name{/*border-radius: 15px;*/font-family: Microsoft YaHei;font-weight: 400;line-height: 26px;text-align: left;margin: 30px 25px;}
.goods_img{border-radius: 5px;}
.goods_price-info{width: 310px;height: 80px;border-radius: 10px;margin: 0 15px;padding: 15px;}
.goods_price{font-size: 18px;font-family: Microsoft YaHei;font-weight: 400;color: #FF4544;display: inline-block;width: 75px;height: 20px;}
.goods_market_price{font-size: 12px;font-family: Microsoft YaHei;font-weight: 400;text-decoration: line-through;color: #999999;display: inline-block;margin-top: 6px;}
.layui-nav-more1{width: 7px;height: 7px;border-width: 1px;border-color: #333 #333 transparent transparent;border-style: solid;transform: rotate(135deg);top: 16px;right: 16px;margin-top: 7px;}
.layui-nav-more2{width: 7px;height: 7px;border-width: 1px;border-color: #333 #333 transparent transparent;border-style: solid;transform: rotate(135deg);top: 16px;right: 16px;margin-top: 7px;}
.layui-new-more1{transform: rotate(45deg);}
.layui-new-more2{transform: rotate(45deg);}
.layui-colorpicker{margin-left: 15px;}
.form-row{position: fixed;bottom: 0px;left: 180px;width: 89.7%;background: #fff;padding: 10px 0;}
.layui-colorpicker-main-input .layui-btn{padding: 0 10px;}
.circle{border-radius: 50%;}
.upload img{margin-top: 20px;}
.img_prev{margin-top: 0 !important;}
.layui-layout-admin.admin-style-2 .form-row{text-align: center;}
.layui-layout-admin.admin-style-2 .layui-body .body-content{padding: 0;}
</style>
<div class="layui-form add-poster">
<div class="poster-form">
<div id="view" style="display: flex;"></div>
<div class="poster-tips">
<div class="set-tips">海报设置说明</div>
<div class="content">
1. 用户头像,用户昵称这两个元素需要空出<br>
2. 裂变海报其他部分皆可自定义设计<br>
3. 可自行拖拉设置相应元素的大小
</div>
</div>
</div>
<div class="form-row">
<button class="layui-btn" lay-submit lay-filter="save_poster">保存</button>
<input type="hidden" name="template_id" value='{notempty name="$template_data"}{$template_data.template_id}{/notempty}'>
<button class="layui-btn layui-btn-primary" onclick="back()">返回</button>
</div>
</div>
<script type="text/html" id="poster_left">
<div class="poster-left">
<div class="poster-left-header">基础设置</div>
<div class="layui-form-item">
<label class="layui-form-label mid"><span class="required">*</span></label>
<div class="layui-input-block mid">
<input type="text" class="layui-input" lay-verify="required" placeholder="请输入海报名称" name="poster_name" value="{{d.poster_name || ''}}"/>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label short-label mid"><span class="required">*</span></label>
<div class="layui-input-block mid">
<div class="upload-img-block icon">
<div class="upload-img-box {{d.background ? 'hover' : ''}}" >
<div class="upload-default" id="posterImg">
{{# if (d.background) { }}
<div id="preview_posterImg" class="preview_img">
<img layer-src src='{{ ns.img(d.background) }}' class="img_prev" data-id="qr_img"/>
<p style="width: 300px;"></p>
</div>
{{# } else { }}
<div class="upload">
<i class="iconfont iconshangchuan"></i>
<p>点击上传</p>
</div>
{{# } }}
</div>
<div class="operation">
<div style="position: absolute; top: -10px; left: 110px;">
<i title="图片预览" class="iconfont iconreview js-preview"></i>
<i title="删除图片" class="layui-icon layui-icon-delete js-delete"></i>
</div>
<div class="replace_img js-replace">点击替换</div>
</div>
<input type="hidden" lay-verify="background" name="background" value='{{d.background}}' />
</div>
</div>
</div>
</div>
<div class="tips">建议图片尺寸720*1280px</div>
<div class="layui-form-item poster-headimg">
<div class="layui-form album-img-select">
<input type="checkbox" name="switch" lay-filter="headimg" value="" lay-skin="primary" {{d.headimg_is_show == '1' ? 'checked' : ''}}>
</div>
<label class="layui-form-label mid" style="text-align: left;">用户头像</label>
<div class="layui-input-block mid new-mid">
<div class="layui-input-block">
<input type="radio" lay-filter="headimg" name="shop_status" value="circle" title="圆形" {{d.headimg_shape == 'circle' ? 'checked' : ''}}>
<input type="radio" lay-filter="headimg" name="shop_status" value="square" title="方形" {{d.headimg_shape == 'square' ? 'checked' : ''}}>
</div>
</div>
</div>
<div class="layui-form-item poster-name">
<div class="layui-form album-img-select">
<input type="checkbox" name="check[]" lay-filter="nickname" value="" lay-skin="primary" {{d.nickname_is_show == '1' ? 'checked' : ''}}>
</div>
<label class="layui-form-label mid" style="text-align: left;">用户昵称</label>
<div class="layui-input-block mid new-mid">
<div class="poster-name-box">
<div class="layui-form poster-select len-short" lay-filter="poster-select">
<select name="" lay-filter="nickname">
{{# for (var font_index = 14; font_index <= 36; font_index++) { }}
{{# if (font_index == d.nickname_font_size) { }}
<option value="{{font_index}}" selected>{{font_index}}px</option>
{{# } else { }}
<option value="{{font_index}}">{{font_index}}px</option>
{{# } }}
{{# } }}
</select>
</div>
</div>
</div>
<div class="layui-form poster_color_nickname">
颜色
<div>
<input type="hidden" name="color" id="friendfission-all-input">
<div class="friendfission-all"></div>
</div>
</div>
</div>
<div style="display: flex; justify-content: space-between; border-bottom: 1px solid #eee;">
<div class="poster-left-header1">商品信息设置</div>
<div class="layui-nav-more1"></div>
</div>
<div class="layer-form">
<div class="layui-form-item poster-headimg">
<div class="layui-form album-img-select">
<input type="checkbox" name="check[]" lay-filter="goods_img" value="" lay-skin="primary" {{d.goods_img_is_show == '1' ? 'checked' : ''}}>
</div>
<label class="layui-form-label mid" style="text-align: left;">商品图</label>
</div>
<div class="layui-form-item poster-name">
<div class="layui-form album-img-select">
<input type="checkbox" name="check[]" lay-filter="goods_name" value="" lay-skin="primary" {{d.goods_name_is_show == '1' ? 'checked' : ''}}>
</div>
<label class="layui-form-label mid" style="text-align: left;">商品名称</label>
<div class="layui-input-block mid new-mid">
<div class="poster-name-box">
<div class="layui-form poster-select len-short" lay-filter="poster-select">
<select name="" lay-filter="goods_name">
{{# for (var font_index = 14; font_index <= 36; font_index++) { }}
{{# if (font_index == d.goods_name_font_size) { }}
<option value="{{font_index}}" selected>{{font_index}}px</option>
{{# } else { }}
<option value="{{font_index}}">{{font_index}}px</option>
{{# } }}
{{# } }}
</select>
</div>
</div>
</div>
<div class="layui-form poster_color_goods_name">
颜色
<div>
<input type="hidden" name="color" id="friendfission-all-input">
<div class="friendfission-all"></div>
</div>
</div>
</div>
<div class="layui-form-item poster-name">
<div class="layui-form album-img-select">
<input type="checkbox" name="check[]" value="" lay-filter="goods_price" lay-skin="primary" {{d.goods_price_is_show == '1' ? 'checked' : ''}}>
</div>
<label class="layui-form-label mid" style="text-align: left;">商品价格</label>
<div class="layui-input-block mid new-mid">
<div class="poster-name-box">
<div class="layui-form poster-select len-short" lay-filter="poster-select">
<select name="" lay-filter="goods_price">
{{# for (var font_index = 14; font_index <= 36; font_index++) { }}
{{# if (font_index == d.goods_price_font_size) { }}
<option value="{{font_index}}" selected>{{font_index}}px</option>
{{# } else { }}
<option value="{{font_index}}">{{font_index}}px</option>
{{# } }}
{{# } }}
</select>
</div>
</div>
</div>
<div class="layui-form poster_color_goods_price">
颜色
<div>
<input type="hidden" name="color" id="friendfission-all-input">
<div class="friendfission-all"></div>
</div>
</div>
</div>
<div class="layui-form-item poster-name">
<div class="layui-form album-img-select">
<input type="checkbox" name="check[]" value="" lay-filter="goods_market_price" lay-skin="primary" {{d.goods_market_price_is_show == '1' ? 'checked' : ''}}>
</div>
<label class="layui-form-label mid" style="text-align: left;">商品划线价</label>
<div class="layui-input-block mid new-mid">
<div class="poster-name-box">
<div class="layui-form poster-select len-short" lay-filter="poster-select">
<select name="" lay-filter="goods_market_price">
{{# for (var font_index = 14; font_index <= 36; font_index++) { }}
{{# if (font_index == d.goods_market_price_font_size) { }}
<option value="{{font_index}}" selected>{{font_index}}px</option>
{{# } else { }}
<option value="{{font_index}}">{{font_index}}px</option>
{{# } }}
{{# } }}
</select>
</div>
</div>
</div>
<div class="layui-form poster_color_goods_market_price">
颜色
<div>
<input type="hidden" name="color" id="friendfission-all-input">
<div class="friendfission-all"></div>
</div>
</div>
</div>
</div>
<div style="display: flex; justify-content: space-between; border-bottom: 1px solid #eee;">
<div class="poster-left-header2">店铺信息设置</div>
<div class="layui-nav-more2"></div>
</div>
<div class="layer-form2">
<div class="layui-form-item poster-headimg">
<div class="layui-form album-img-select">
<input type="checkbox" name="check[]" lay-filter="store_logo" value="" lay-skin="primary" {{d.store_logo_is_show == '1' ? 'checked' : ''}}>
</div>
<label class="layui-form-label mid" style="text-align: left;">店铺logo</label>
</div>
<div class="layui-form-item poster-name">
<div class="layui-form album-img-select">
<input type="checkbox" name="check[]" value="" lay-filter="store_name" lay-skin="primary" {{d.store_name_is_show == '1' ? 'checked' : ''}}>
</div>
<label class="layui-form-label mid" style="text-align: left;">店铺名称</label>
<div class="layui-input-block mid new-mid">
<div class="poster-name-box">
<div class="layui-form poster-select len-short" lay-filter="poster-select">
<select name="" lay-filter="store_name">
{{# for (var font_index = 14; font_index <= 36; font_index++) { }}
{{# if (font_index == d.store_name_font_size) { }}
<option value="{{font_index}}" selected>{{font_index}}px</option>
{{# } else { }}
<option value="{{font_index}}">{{font_index}}px</option>
{{# } }}
{{# } }}
</select>
</div>
</div>
</div>
<div class="layui-form poster_color_store_name">
颜色
<div>
<input type="hidden" name="color" id="friendfission-all-input">
<div class="friendfission-all"></div>
</div>
</div>
</div>
</div>
</div>
<div class="poster-right design-sketch" style="position: relative;border: 1px solid #d6d6d6;
{notempty name='$template_data.background'}background-image:url({:img($template_data.background)}); background-size: 100%; background-repeat: no-repeat;{/notempty}
{{# if (d.background) { }}background-image:url(/{{ d.background }});background-size: 100%;background-repeat: no-repeat;{{# } }}
">
<div class="headimg {{d.headimg_is_show == '1' ? '' : 'layui-hide'}}" style="position:absolute;top: {{d.headimg_top}}px; left: {{d.headimg_left}}px; width: {{d.headimg_width}}px; height: {{d.headimg_height}}px;">
<img alt="" class="{{d.headimg_shape == 'circle' ? 'circle' : ''}}" src="__STATIC__/img/caner1.png" width="100%" />
</div>
<div class="nickname {{d.nickname_is_show == '1' ? '' : 'layui-hide'}}" style="position:absolute;top: {{d.nickname_top}}px; left: {{d.nickname_left}}px; width: {{d.nickname_width}}px; color: {{d.nickname_color}}; font-size: {{d.nickname_font_size}}px;">
<span class="design-text">用户昵称</span>
</div>
<div style="margin: 10px;">
<div class="store_logo {{d.store_logo_is_show == '1' ? '' : 'layui-hide'}}" style="position:absolute;top: {{d.store_logo_top}}px; left: {{d.store_logo_left}}px; width: {{d.store_logo_width}}px; height: {{d.store_logo_height}}px;">
<img src='{:img($site_data.logo)}' width="100%" />
</div>
<div class="store_name {{d.store_name_is_show == '1' ? '' : 'layui-hide'}}" style="position:absolute;top: {{d.store_name_top}}px; color: {{d.store_name_color}}; left: {{d.store_name_left}}px; width: {{d.store_name_width}}px; height: {{d.store_name_height}}px; font-size: {{d.store_name_font_size}}px;">
<span class="design-text">{$site_data.site_name}</span>
</div>
</div>
<div class="goods-info">
<div class="goods_name {{d.goods_name_is_show == '1' ? '' : 'layui-hide'}}" style="top: {{d.goods_name_top}}px; color: {{d.goods_name_color}}; left: {{d.goods_name_left}}px; width: {{d.goods_name_width}}px; height: {{d.goods_name_height}}px; font-size: {{d.goods_name_font_size}}px;">
<p>商品名称-商品名称-商品名称</p>
</div>
<div class="goods_img {{d.goods_img_is_show == '1' ? '' : 'layui-hide'}}" style="top: {{d.goods_img_top}}px; left: {{d.goods_img_left}}px; width: {{d.goods_img_width}}px; height: {{d.goods_img_height}}px;">
<img src="__STATIC__/img/goods_template.png">
</div>
</div>
<div class="price-info" style="display: flex; justify-content: space-between;">
<div>
<div class="goods_price {{d.goods_price_is_show == '1' ? '' : 'layui-hide'}}" style="top: {{d.goods_price_top}}px; left: {{d.goods_price_left}}px; width: {{d.goods_price_width}}px; height: {{d.goods_price_height}}px; color: {{d.goods_price_color}}; font-size: {{d.goods_price_font_size}}px;">
<p>100.00</p>
</div>
<span class="goods_market_price poster_lineprice {{d.goods_market_price_is_show == '1' ? '' : 'layui-hide'}}" style="top: {{d.goods_market_price_top}}px; left: {{d.goods_market_price_left}}px; width: {{d.goods_market_price_width}}px; height: {{d.goods_market_price_height}}px; color: {{d.goods_market_price_color}}; font-size: {{d.goods_market_price_font_size}}px;">
<p>199.00</p>
</span>
</div>
<div class="qrcode" style="top: {{d.qrcode_top}}px; left: {{d.qrcode_left}}px; height: {{d.qrcode_height}}px; width: {{d.qrcode_width}}px;">
<img alt="" src="__STATIC__/img/caner_erweima.png" width="100%" />
</div>
</div>
</div>
</script>
<script src="STATIC_JS/tdrag.js"></script>
<script>
var form, laytpl, laypage, laydate, colorpicker, repeat_flag = false;
var poster_detail = JSON.parse('{:json_encode($template_info)}');
layui.use(['form', 'laytpl', 'colorpicker'], function() {
form = layui.form;
laytpl = layui.laytpl;
colorpicker = layui.colorpicker;
form.render();
laytpl($("#poster_left").html()).render(poster_detail, function(html) {
$('#view').html(html);
form.render();
new Upload({
elem: '#posterImg',
data: {},
callback: function(res) {
if (res.code >= 0) {
$('.poster-right').css({
"background-image": `url('${ns.img(res.data.pic_path)}')`,
"background-size": "100%",
"background-repeat": "no-repeat"
});
poster_detail.background = res.data.pic_path;
$("input[name='background']").val(res.data.pic_path);
}
},
deleteCallback: function() {
poster_detail.background = '';
$("input[name='background']").val('')
}
});
});
//是否显示的控制
var checkbox_field_arr = ['headimg', 'nickname', 'goods_img', 'goods_name', 'goods_price', 'goods_market_price', 'store_name', 'store_logo'];
checkbox_field_arr.forEach(function(field_name, index){
form.on('checkbox('+ field_name +')', function(data) {
poster_detail[field_name + '_is_show'] = data.elem.checked ? '1' : '0';
if (data.elem.checked) {
$("."+ field_name).removeClass("layui-hide");
} else {
$("."+ field_name).addClass("layui-hide");
}
})
});
//字体大小控制
var font_field_arr = ['nickname', 'goods_name', 'goods_price', 'goods_market_price', 'store_name'];
font_field_arr.forEach(function(field_name, index){
form.on('select('+ field_name +')', function(data) {
poster_detail[field_name + '_font_size'] = data.value;
$("."+ field_name).css("font-size", data.value + "px")
});
});
//字体颜色控制
var color_field_arr = ['nickname', 'goods_name', 'goods_price', 'goods_market_price', 'store_name'];
color_field_arr.forEach(function(field_name, index){
colorpicker.render({
elem: '.poster_color_' + field_name, //绑定元素
color: poster_detail[field_name + '_color'],
done: function(color) {
$("."+ field_name).css("color", color);
poster_detail[field_name + '_color'] = color;
}
});
});
//圆角控制
var shape_field_arr = ['headimg'];
shape_field_arr.forEach(function(field_name, index){
form.on('radio('+ field_name +')', function(data) {
let shape = data.value;
poster_detail[field_name + '_shape'] = shape;
if(shape == 'circle'){
$("."+ field_name +" img").addClass('circle');
}else{
$("."+ field_name +" img").removeClass('circle');
}
})
});
//拖拽控制
var drag_field_arr = ['headimg', 'nickname', 'qrcode', 'goods_img', 'goods_name', 'goods_price', 'goods_market_price','store_name', 'store_logo'];
drag_field_arr.forEach((field_name, index) => {
$(`.${field_name}`).Tdrag({
scope: '.design-sketch',
cbChange: function(obj, self) {
poster_detail[field_name + '_top'] = parseFloat($(self.$element).css('top'));
poster_detail[field_name + '_left'] =parseFloat($(self.$element).css('left'));
poster_detail[field_name + '_width'] = parseFloat($(self.$element).css('width'));
poster_detail[field_name + '_height'] = parseFloat($(self.$element).css('height'));
},
cbEnd: function (obj, self) {
poster_detail[field_name + '_top'] = parseFloat($(self.$element).css('top'));
poster_detail[field_name + '_left'] =parseFloat($(self.$element).css('left'));
poster_detail[field_name + '_width'] = parseFloat($(self.$element).css('width'));
poster_detail[field_name + '_height'] = parseFloat($(self.$element).css('height'));
}
});
});
form.verify({
background: function(value){
if(!value){
return '请上传海报背景';
}
}
});
/**
* 监听提交
*/
form.on('submit(save_poster)', function(data) {
poster_detail.poster_name = data.field.poster_name;
if (repeat_flag) return false;
repeat_flag = true;
$.ajax({
url: ns.url("postertemplate://shop/postertemplate/"+ (poster_detail['template_id'] ? 'edit' : 'add') +"postertemplate"),
data:poster_detail,
dataType: 'JSON', //服务器返回json格式数据
type: 'POST', //HTTP请求类型
success: function(res) {
repeat_flag = false;
if(res.code == 0){
layer.confirm(poster_detail['template_id'] ? '编辑成功' : '添加成功',{
title: '操作提示',
btn: ['返回列表',poster_detail['template_id'] ? '继续编辑' : '继续添加'],
closeBtn: 0,
yes: function(index, layero) {
location.hash = ns.hash("postertemplate://shop/postertemplate/lists");
layer.close(index);
},btn2: function(index, layero) {
listenerHash(); // 刷新页面
layer.close(index);
}
})
} else {
layer.msg(res.message);
}
}
});
});
});
function back() {
location.hash = ns.hash("postertemplate://shop/postertemplate/lists");
localStorage.removeItem("poster_data");
}
$('body').off('click', '.layui-nav-more1').on('click', '.layui-nav-more1', function() {
$(this).addClass('layui-new-more1');
$('.layer-form').css("display", 'none');
});
$('body').off('click', '.layui-new-more1').on('click', '.layui-new-more1', function() {
$(this).removeClass('layui-new-more1');
$('.layer-form').css("display", 'block');
});
$('body').off('click', '.layui-nav-more2').on('click', '.layui-nav-more2', function() {
$(this).addClass('layui-new-more2');
$('.layer-form2').css("display", 'none');
});
$('body').off('click', '.layui-new-more2').on('click', '.layui-new-more2', function() {
$(this).removeClass('layui-new-more2');
$('.layer-form2').css("display", 'block');
});
$('body').off('click', '.js-delete').on('click', '.js-delete', function() {
$('.poster-right').css("background-image", 'none');
})
</script>

View File

@@ -0,0 +1,339 @@
<style type="text/css">
.iconadd_light {
font-size: 40px;
}
.good-poster {
width: 240px;
height: 413px;
margin:0 0 10px 30px;
text-align: center;
position: relative;
cursor: pointer;
}
</style>
<div class="layui-collapse tips-wrap" style="margin-top: 10px;">
<div class="layui-colla-item">
<h2 class="layui-colla-title">操作提示</h2>
<ul class="layui-colla-content layui-show">
<li>商品海报,在商品分享时的海报样式时为商家提供丰富的海报模板,可自定义设置,也可使用本商城提供的模板</li>
<li>使用商品海报,需要在商品添加、编辑中对商品海报选项进行选择。</li>
<li>分享商品海报,客户可以在手机端的商品详情中分享时获取商品海报图片。</li>
</ul>
</div>
</div>
<div class="single-filter-box top">
<button class="layui-btn add-button" onclick="add()">添加海报</button>
</div>
<div class="screen layui-collapse" lay-filter="selection_panel">
<div class="layui-colla-item">
<form class="layui-colla-content layui-form layui-show">
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">海报名称:</label>
<div class="layui-input-inline">
<input type="text" name="search_text" placeholder="请输入海报名称" class="layui-input" autocomplete="off">
</div>
</div>
</div>
<div class="form-row">
<button type="button" class="layui-btn" lay-filter="search" lay-submit>筛选</button>
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
</div>
</form>
</div>
</div>
<div class="layui-tab table-tab" lay-filter="manjian_tab">
<div class="layui-tab-content">
<!-- 列表 -->
<table id="poster_list" lay-filter="poster_list"></table>
</div>
</div>
<script type="text/html" id="qr_img">
<div class='table-title'>
<div class='title-pic'>
<img layer-src src="{{ns.img()}}" onerror="this.src = '{:img('public/static/img/default_img/head.png')}' ">
</div>
</div>
</script>
<script type="text/html" id="poster_status">
<div class='table-title'>
{{# if(d.template_status == 0){ }}
<div class='title-pic' style="text-align:left">未启用</div>
{{# }else{ }}
<div class='title-pic text-color' style="text-align:left">启用</div>
{{# } }}
</div>
</script>
<!-- 操作 -->
<script type="text/html" id="operation">
<div class="table-btn">
<a class="layui-btn" lay-event="detail">预览</a>
<a class="layui-btn" lay-event="edit">编辑</a>
{{# if(d.template_status==0){ }}
<a class="layui-btn" lay-event="start">启用</a>
<a class="layui-btn" lay-event="delete">删除</a>
{{# }else{ }}
<a class="layui-btn" lay-event="close">关闭</a>
{{# } }}
</div>
</script>
<script type="text/html" id="add">
<div style="display: flex;">
<div>
<div style="width: 240px; height: 413px; border: 1px dashed #ff791a; color: #ff791a; text-align: center; line-height: 413px; cursor: pointer; display: inline-block;" onclick="toAdd()">
<i class="iconfont iconadd_light"></i>
</div>
<div style="text-align: center; margin-top: 10px;">自定义海报</div>
</div>
<div style="display: inline-block; position: relative;">
<div style="display: flex;">
{{# d.forEach(function(item, index){ }}
<li class="good-poster" onclick="toAdd({{ item.muban_id }})">
<span class="iconfont" ></span>
<img data-id="1" style="width: 100%;" src="{{ item.image }}">
<span style="color: #000000; font-size: 14px;">{{ item.name }}</span>
<div class="js-zhezhao" ></div>
</li>
{{# }) }}
</div>
</div>
</div>
</script>
<!-- 详情弹框html -->
<script type="text/html" id="detail">
<img layer-src src="{{ns.img(d)}}" style="width: 360px; height: 640px;" />
</script>
<script>
var laytpl,template_id,table,form,element,repeat_flag = false;
layui.use(['form', 'element', 'laytpl'], function() {
form = layui.form;
element = layui.element;
laytpl = layui.laytpl;
form.render();
table = new Table({
elem: '#poster_list',
url: ns.url("postertemplate://shop/postertemplate/lists"),
cols: [
[ {
field: 'poster_name',
title: '海报名称',
unresize: 'false',
width: '15%',
}, {
field: 'template_status',
title: '海报状态',
unresize: 'false',
width: '60%',
templet: '#poster_status'
}, {
title: '操作',
toolbar: '#operation',
unresize: 'false',
align:'right'
}]
]
});
/**
* 监听工具栏操作
*/
table.tool(function(obj) {
var data = obj.data;
switch (obj.event) {
case 'detail': //预览
detailPoster(data.template_id);
break;
case 'edit': //编辑
location.hash = ns.hash("postertemplate://shop/postertemplate/editpostertemplate", {
"template_id": data.template_id
});
break;
case 'delete': //删除
deletePoster(data.template_id, data.template_status);
break;
case 'close': //关闭
close(data.template_id);
break;
case 'start': //启用
start(data.template_id);
break;
}
});
/**
* 删除
*/
function deletePoster(template_ids, template_status) {
if (template_status == 1) {
return layer.msg('请先关闭海报后再删除');
}
layer.confirm('确定要删除该海报吗?', function(index) {
if (repeat_flag) return false;
repeat_flag = true;
layer.close(index);
$.ajax({
url: ns.url("postertemplate://shop/postertemplate/delpostertemplate"),
data: {
template_ids: template_ids
},
dataType: 'JSON',
type: 'POST',
success: function(res) {
repeat_flag = false;
layer.msg(res.message);
if (res.code == 0) {
table.reload({
page: {
curr: 1
},
});
}
}
});
}, function() {
layer.close();
});
}
/**
* 关闭
*/
function close(template_id) {
layer.confirm('确定关闭吗?', function(index) {
if (repeat_flag) return false;
repeat_flag = true;
layer.close(index);
$.ajax({
url: ns.url("postertemplate://shop/postertemplate/editstatus"),
data: {
template_id: template_id,
template_status: 0
},
dataType: 'JSON',
type: 'POST',
success: function(res) {
repeat_flag = false;
layer.msg(res.message);
if (res.code == 0) {
table.reload();
}
}
});
});
}
/**
* 预览
*/
function detailPoster(template_id) {
if (repeat_flag) return false;
repeat_flag = true;
$.ajax({
url: ns.url("postertemplate://shop/postertemplate/postertemplatedetail"),
data: {
template_id: template_id,
},
dataType: 'JSON',
type: 'POST',
success: function(res) {
repeat_flag = false;
if (res.code >= 0) {
laytpl($("#detail").html()).render(res.data, function(html) {
layer.open({
type: 1,
shadeClose: true,
shade: 0.3,
offset: 'auto',
fixed: false,
title: "预览",
area: ['400px', '760px'],
btn: ['退出'],
content: html,
skin: 'detail'
});
})
}else{
layer.msg(res.message || '操作错误');
}
}
});
}
/**
* 开启
*/
function start(template_id) {
layer.confirm('确定启用吗?', function(index) {
if (repeat_flag) return false;
repeat_flag = true;
layer.close(index);
$.ajax({
url: ns.url("postertemplate://shop/postertemplate/editstatus"),
data: {
template_id: template_id,
template_status: 1
},
dataType: 'JSON',
type: 'POST',
success: function(res) {
repeat_flag = false;
layer.msg(res.message);
if (res.code == 0) {
table.reload();
}
}
});
});
}
/**
* 搜索功能
*/
form.on('submit(search)', function(data) {
table.reload({
page: {
curr: 1
},
where: data.field
});
});
});
function add() {
var mubanList = [
{muban_id: 1, name:'商品海报1', image:"SHOP_IMG/poster1.png"},
{muban_id: 2, name:'商品海报2', image:"SHOP_IMG/poster2.png"},
{muban_id: 3, name:'商品海报3', image:"SHOP_IMG/poster3.png"},
];
laytpl($("#add").html()).render(mubanList, function(html) {
layer.open({
type: 1,
shadeClose: true,
shade: 0.3,
offset: 'auto',
fixed: false,
title: "添加海报",
area: ['1100px', '560px'],
btnAlign: 'c',
content: html,
skin: 'add',
});
})
}
function toAdd(muban_id) {
location.hash = ns.hash("postertemplate://shop/postertemplate/addpostertemplate", {muban_id:muban_id});
}
</script>

Binary file not shown.

After

Width:  |  Height:  |  Size: 37 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 61 KiB