<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>后台管理系统</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<link rel="shortcut icon" th:href="@{/images/logo.jpg}"/>
<link rel="stylesheet" th:href="@{/js/layui/css/layui.css}">
<link rel="stylesheet" th:href="@{/js/layui/css/admin.css}">
<link rel="stylesheet" th:href="@{/js/upload_img/css/index.css}">
<script type="text/javascript" th:src="@{/js/jquery-3.3.1.min.js}"></script>
<script th:src="@{/js/layui/layui.js}" charset="utf-8"></script>
<link rel="stylesheet" th:href="@{/js/ueditor/themes/default/css/ueditor.css}" type="text/css"/>
<script type="text/javascript" th:src="@{/js/ueditor/ueditor.config.js}"></script>
<script type="text/javascript" th:src="@{/js/ueditor/ueditor.all.js}"></script>
<script type="text/javascript" th:src="@{/js/ueditor/lang/zh-cn/zh-cn.js}"></script>
<script src="http://www.jq22.com/jquery/jquery-1.7.1.js"></script>
<style>
.layui-form-label {
width: 80px;
}
#editor {
height: 600px;
width: 700px;
}
</style>
</head>
<body>
<div class="layui-form" style="padding: 20px 0 0 0;">
<form id="formId" onsubmit="return false;">
<div class="layui-form-item">
<label class="layui-form-label"><span style="color: red">*</span>商品名称</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" name="sname" id="sname" th:value="${obj.sname}">
</div>
<label class="layui-form-label"><span style="color: red">*</span>分类</label>
<div class="layui-input-inline">
<select name="goodsClassPid" id="catalogid" lay-filter="catalogid" lay-search>
<option th:each="list:${goodsClassList}" th:value="${list.id}"
th:text="${list.sname }"
th:selected="${list.id}==${obj.catalogid}"></option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span style="color: red">*</span>原价</label>
<div class="layui-input-inline">
<input type="number" step="0.01" class="layui-input" name="doldprice" id="doldprice"
th:value="${obj.doldprice}">
</div>
<label class="layui-form-label"><span style="color: red">*</span>售价</label>
<div class="layui-input-inline">
<input type="number" step="0.01" class="layui-input" name="dsaleprice" id="dsaleprice" th:value="${obj.dsaleprice}">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span style="color: red">*</span>商品产地</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" name="sfactory" id="sfactory"
th:value="${obj.sfactory}">
</div>
<label class="layui-form-label"><span style="color: red">*</span>商品编码</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" name="spcode" id="spcode" th:value="${obj.spcode}">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span style="color: red">*</span>保存条件</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" name="scondition" id="scondition"
th:value="${obj.scondition}">
</div>
<label class="layui-form-label"><span style="color: red">*</span>净重规格</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" name="specs" id="specs" th:value="${obj.specs}">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span style="color: red">*</span>商品单位</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" name="sunit" id="sunit" th:value="${obj.sunit}">
</div>
<label class="layui-form-label"><span style="color: red">*</span>商品简介</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" name="sduction" id="sduction" th:value="${obj.sduction}">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span style="color: red">*</span>积分上限</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" name="iintanum" id="iintanum"
th:value="${obj.iintanum}">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">
<span style="color: red">*</span>商品图片
</label>
<div class="layui-input-inline" style="width: 700px">
<div class="main">
<div id="showimg">
<ul id="showui">
</ul>
<div id="showinput">
</div>
</div>
<br>
<a class="layui-btn layui-btn" onclick="uploadImg()"><i class="layui-icon layui-icon-add-1"></i>选择图片</a>
<input style="display: none" type="file" id="upgteimg" value=""
accept="image/jpg,image/jpeg,image/png,image/bmp" multiple/>
</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span style="color: red"></span>商品详情</label>
<div class="layui-input-inline" id="sdetail" style="width:70%">
<script id="editor" name="detailContent" th:utext="${obj.sdetail}" type="text/plain"
style="width:100%;height:500px;"></script>
</div>
</div>
<button class="layui-btn" style="display: none;" id="saveBtn" onclick="save()">保存</button>
</form>
</div>
<script type="text/javascript" th:src="@{/js/upload_img/js/updateimg.js}"></script>
<script>
var id = '[[${id}]]';
var ue = UE.getEditor('editor');
UE.Editor.prototype._bkGetActionUrl = UE.Editor.prototype.getActionUrl;
UE.Editor.prototype.getActionUrl = function (action) {
if (action == 'uploadimage' || action == 'uploadscrawl' || action == 'uploadimage') {
return "https://qpxdnyy.com/product/uploads";
// return "https://127.0.0.1/goods/uploads";
} else if (action == 'listimage') {
return this._bkGetActionUrl.call(this, action);
} else {
return this._bkGetActionUrl.call(this, action);
}
}
$(function () {
if (id) {
// getGoodsInfo(goodsId);
showImg('[[${obj.ssharepic}]]');
}
});
function save() {
if ($("#formId input[name='sname']").val() == '') {
layer.msg("名称不能为空!");
return false;
}
if ($("#formId input[name='sfactory']").val() == '') {
layer.msg("产地不能为空!");
return false;
}
if ($("#formId input[name='spcode']").val() == '') {
layer.msg("编码不能为空!");
return false;
}
if ($("#formId input[name='scondition']").val() == '') {
layer.msg("条件不能为空!");
return false;
}
if ($("#formId input[name='sduction']").val() == '') {
layer.msg("简介不能为空!");
return false;
}
if ($("#formId input[name='specs']").val() == '') {
layer.msg("规格不能为空!");
return false;
}
if (!$("#dsaleprice").val()) {
layer.msg("售价不能为空!");
return false;
}
if ($("#dsaleprice").val() == 0) {
layer.msg("售价不能为0!");
return false;
}
if (!$("#doldprice").val()) {
layer.msg("原价不能为空!");
return false;
}
if (!$("#catalogid").val()) {
layer.msg("分类不能为空!");
return false;
}
var dsaleprice = $("#formId input[name='dsaleprice']").val();
//var reg = /^(?!0+(?:\.0+)?$)(?:[1-9]\d*|0)(?:\.\d{1,2})?$/;
var reg = /^[0-9]+([.]{1}[0-9]{1,2})?$/;
if (dsaleprice == '' || !reg.test(dsaleprice)) {
layer.msg("售价不合法!", {icon: 5});
return false;
}
var content = UE.getEditor('editor').getContent();
if (content == '') {
layer.msg("商品详情不能为空!", {icon: 5});
return false;
}
var form = document.querySelector("#formId");
var formdata = new FormData(form);
var catalogid = $("#catalogid").val();
formdata.append("catalogid", catalogid);
formdata.append("sdetail", content);
formdata.append("istatus", 1);
formdata.append("itype", 10);
var goodsImgArr = [dataArr.length];
for (var i = 0; i < dataArr.length; i++) {
goodsImgArr[i] = dataArr[i].base64;
}
formdata.append("goodsImgArr", goodsImgArr);
formdata.append("id", id);
$.ajax({
url: "add",
data: formdata,
type: "POST",
dataType: "json",
processData: false,
contentType: false,
success: function (result) {
if (result.code == 100) {
layer.msg(result.msg, {icon: 6, time: 1000}, function () {
closeLayer();
parent.layui.table.reload('tableId');
});
} else {
layer.msg(result.msg, {icon: 5});
}
}
});
}
function showImg(goodsImgs) {
var arr = goodsImgs.split(",");
for (var i = 0; i < arr.length; i++) {
var imgMsg = {
name: randomString(5), //获取文件名
base64: arr[i], //reader.readAsDataURL方法执行完后，base64数据储存在reader.result里
}
dataArr.push(imgMsg);
currentReViewImgIndex = i;
var showui = document.getElementById("showui");
result = '<div class="showdiv"><img class="left" src="/js/upload_img/img/Arrow_left.svg" /><img class="center" src="/js/upload_img/img/delete.svg" /><img class="right" src="/js/upload_img/img/Arrow_right.svg" /></div><img id="img' + currentReViewImgIndex + randomString(1) + randomString(2) + randomString(5) + '" class="showimg" src="' + arr[i] + '" />';
var li = document.createElement('li');
li.innerHTML = result;
showui.appendChild(li);
}
}
function uploadImg() {
$("#upgteimg").click();
}
layui.use('form', function () {
var form = layui.form;
form.render();
});
function closeLayer() {
var index = parent.layer.getFrameIndex(window.name);
//关闭当前frame
parent.layer.close(index);
}
function chioceImage(i) {
$('#file' + i).trigger("click");
}
</script>
</body>
</html>