193 lines
8.9 KiB
HTML
193 lines
8.9 KiB
HTML
{layout name="layout2" /}
|
||
<link rel="stylesheet" href="/static/admin/css/goods.css" media="all">
|
||
<div class="">
|
||
<div class="layui-tab-content layui-form">
|
||
<div class="layui-tab-item goods-content layui-show">
|
||
<div class="layui-card-body" pad15>
|
||
<div lay-filter="">
|
||
<input type="hidden" name="id" value="{$moment.id|default=''}">
|
||
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span class="form-label-asterisk">*</span>标题：</label>
|
||
<div class="layui-input-block">
|
||
<input type="text" name="title" lay-verify="custom_required" lay-verType="tips"
|
||
autocomplete="off"
|
||
switch-tab="0" verify-msg="请输入标题" placeholder="请输入标题"
|
||
value="{$moment.title|default=''}"
|
||
class="layui-input">
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span class="form-label-asterisk">*</span>员工：</label>
|
||
<div class="layui-input-block">
|
||
<select name="sid" lay-verType="" placeholder="请选择员工" switch-tab="0" verify-msg="请选择员工">
|
||
<option value="">请选择员工</option>
|
||
{foreach $staff as $key=>$vo}
|
||
<option value="{$vo.id}" {if $moment.sid == $vo.id}selected{/if}>{$vo.name}</option>
|
||
{/foreach}
|
||
</select>
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span class="form-label-asterisk">*</span>产品：</label>
|
||
<div class="layui-input-block">
|
||
<select name="goods_id" lay-verType="" placeholder="请选择关联产品" switch-tab="0" verify-msg="请选择关联产品">
|
||
<option value="">请选择关联产品</option>
|
||
{foreach $goods as $key=>$vo}
|
||
<option value="{$vo.id}" {if $moment.goods_id == $vo.id}selected{/if}>{$vo.name}</option>
|
||
{/foreach}
|
||
</select>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">显示状态：</label>
|
||
<div class="layui-input-inline">
|
||
<input type="radio" name="state" value="1" title="显示" {if $moment.state == 1}checked{/if}>
|
||
<input type="radio" name="state" value="2" title="不显示" {if $moment.state == 2}checked{/if}>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item" style="margin-bottom: 0px">
|
||
<label class="layui-form-label"><span class="form-label-asterisk">*</span>图片：</label>
|
||
<div style="min-height:80px;">
|
||
<ul style="list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 10px;">
|
||
{notempty name='images'}
|
||
{foreach $images as $key=>$img}
|
||
<li class="goods-li">
|
||
<input name="goods_image[]" type="hidden" value="{$imagePaths[$key]}">
|
||
<img class="goods-img goods_image" src="{$img}">
|
||
<a class="goods-img-del-x" style="display: none;">x</a>
|
||
</li>
|
||
{/foreach}
|
||
{/notempty}
|
||
</ul>
|
||
<div class="goods-img-add" lay-verify="goods_image" lay-verType="tips" switch-tab="0" verify-msg="选择图片" style="margin-top: 10px;"></div>
|
||
</div>
|
||
<br>
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">内容详情</label>
|
||
<div class="layui-input-block">
|
||
<textarea name="content" id="content" lay-verify="content" class="field-content">{$moment.content|default=''|raw}</textarea>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item layui-hide">
|
||
<input type="button" lay-submit lay-filter="edit-submit" id="edit-submit" value="确认">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!---------------------------------html模板---------------------------------->
|
||
<script type="text/html" id="template-goods-image">
|
||
<li class="goods-li">
|
||
<input name="goods_image[]" type="hidden" value="{image-src}">
|
||
<img class="goods-img goods_image" src="{image-src}">
|
||
<a class="goods-img-del-x" style="display: none;">x</a></li>
|
||
</script>
|
||
|
||
<script type="text/javascript">
|
||
layui.config({
|
||
version:"{$front_version}",
|
||
base: '/static/plug/layui-admin/dist/layuiadmin/' //静态资源所在路径
|
||
}).extend({
|
||
index: 'lib/index' //主入口模块
|
||
}).use(['index', 'element', 'form', 'like', 'likeedit'], function () {
|
||
var $ = layui.$;
|
||
var like = layui.like;
|
||
var form = layui.form;
|
||
var likeedit = layui.likeedit;
|
||
|
||
//------------------------基本信息----------------------------------
|
||
//图片事件
|
||
$(document).on('mouseenter', '.goods-li', function () {
|
||
$(this).children().last().show();
|
||
});
|
||
$(document).on('mouseleave', '.goods-li', function () {
|
||
$(this).children().last().hide();
|
||
});
|
||
$(document).on('click', '.goods-li', function () {
|
||
var src = $(this).children('img').attr('src');
|
||
like.showImg(src,600);
|
||
});
|
||
|
||
$(document).on('click', '.goods-img-del-x', function () {
|
||
$(this).parent().remove();
|
||
return false;
|
||
});
|
||
|
||
like.imageUpload('.goods-img-add', function (uris, element) {
|
||
// 多图片上传逻辑（最多8张）
|
||
var count = element.prev().children().length;
|
||
count = !count ? 0 : count;
|
||
if (count + uris.length > 8) {
|
||
layer.msg('最多只能选中8张图片');
|
||
return;
|
||
}
|
||
uris = uris.reverse();
|
||
for(var i in uris){
|
||
var uri = uris[i];
|
||
if (!uri) continue; // 跳过无效的 uri
|
||
|
||
var template_goods_image = $('#template-goods-image').html();
|
||
if (!template_goods_image) {
|
||
console.error('模板 template-goods-image 不存在');
|
||
continue;
|
||
}
|
||
|
||
// 获取文件路径（用于 hidden input）
|
||
var filePath = like.getUrlFileName ? like.getUrlFileName(uri, '{$storageUrl}') : uri;
|
||
if (!filePath) {
|
||
filePath = uri; // 如果 getUrlFileName 返回 undefined，使用原始 uri
|
||
}
|
||
|
||
// 先替换 input 中的 {image-src}，再替换 img 中的 {image-src}
|
||
var html = template_goods_image.replace('{image-src}', filePath);
|
||
html = html.replace('{image-src}', uri);
|
||
element.prev().append(html);
|
||
}
|
||
}, true);
|
||
|
||
likeedit.set({
|
||
uploadImage: {
|
||
url: "{:url('file/image')}",
|
||
type: 'post'
|
||
}
|
||
});
|
||
var likeedit_index = likeedit.build('content'); //建立编辑器
|
||
|
||
// 设置编辑器内容（编辑模式）
|
||
{notempty name='moment.content'}
|
||
likeedit.setContent(likeedit_index, '{$moment.content|raw}');
|
||
{/notempty}
|
||
|
||
form.verify({
|
||
content: function () {
|
||
likeedit.sync(likeedit_index)
|
||
},
|
||
custom_required: function (value, item) {
|
||
if (!value) {
|
||
return $(item).attr('verify-msg');
|
||
}
|
||
},
|
||
goods_image: function (value, item) {
|
||
// 检查是否有上传的图片
|
||
var imageCount = $('input[name="goods_image[]"]').filter(function() {
|
||
return $(this).val() != '';
|
||
}).length;
|
||
if (imageCount == 0) {
|
||
return $(item).attr('verify-msg');
|
||
}
|
||
}
|
||
});
|
||
|
||
form.render();
|
||
});
|
||
</script>
|
||
|