377 lines
9.0 KiB
HTML
377 lines
9.0 KiB
HTML
{extend name="common/base"/}
|
||
<!-- 主体 -->
|
||
{block name="body"}
|
||
<style>
|
||
.layui-input-inline{
|
||
width:35% !important;
|
||
}
|
||
.layui-input-inline .layui-form-item{
|
||
display:flex;
|
||
}
|
||
.layui-input-inline .layui-form-item .layui-form-label{
|
||
width:30%;
|
||
}
|
||
.layui-input-block{
|
||
margin-left:unset !important;
|
||
width:75%;
|
||
}
|
||
#seleform{
|
||
border-color: #eee;
|
||
background-color: #fff;
|
||
color:#a39f9f;
|
||
width:100%;
|
||
}
|
||
</style>
|
||
<div class="p-3">
|
||
<form id="filterform" class="layui-form gg-form-bar border-t border-x">
|
||
<div class="layui-form-item">
|
||
|
||
|
||
<div class="layui-input-inline">
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">商品分类</label>
|
||
<div class="layui-input-block">
|
||
<input id="store_cate" type="hidden" readonly="readonly" name="store_cate">
|
||
<button id="seleform" lay-filter="seleform" class="layui-btn">请选择</button>
|
||
<div id="removeselect"><i class="bi-x-lg" style="position: absolute;right:2px;top:10px;z-index: 9;cursor:pointer;"></i></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<div class="layui-input-inline" style="width:300px;">
|
||
<input type="text" name="keywords" placeholder="请输入关键字" class="layui-input" autocomplete="off" />
|
||
</div>
|
||
<button class="layui-btn layui-btn-normal" lay-submit="" lay-filter="searchform">提交搜索</button>
|
||
</form>
|
||
<table class="layui-hide" id="store_product" lay-filter="store_product"></table>
|
||
</div>
|
||
|
||
|
||
|
||
<script type="text/html" id="barDemo">
|
||
<div class="layui-btn-group"><a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="read">采购</a><a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="joincar">加入购物车</a></div>
|
||
</script>
|
||
|
||
{/block}
|
||
<!-- /主体 -->
|
||
<!-- 脚本 -->
|
||
{block name="script"}
|
||
<script>
|
||
const moduleInit = ['tool'];
|
||
function gouguInit() {
|
||
var table = layui.table,tool = layui.tool, form = layui.form;
|
||
layui.pageTable = table.render({
|
||
elem: '#store_product',
|
||
title: '商品表列表',
|
||
toolbar: '#toolbarDemo',
|
||
url: '/admin/store_product/index',
|
||
page: true,
|
||
limit: 20,
|
||
cellMinWidth: 300,
|
||
cols: [
|
||
[
|
||
{
|
||
fixed: 'left',
|
||
field: 'product_id',
|
||
title: '编号',
|
||
align: 'center',
|
||
width: 80
|
||
},{
|
||
field: 'shangjia',
|
||
title: '商家',
|
||
align: 'center',
|
||
width: 100
|
||
},{
|
||
field: 'image',
|
||
title: '商品图片',
|
||
align: 'center',
|
||
width: 100,
|
||
templet: '<div><img src="{{ d.image }}" style="width:30px; height:30px;"></div>',
|
||
},{
|
||
field: 'store_name',
|
||
title: '商品名称',
|
||
align: 'center',
|
||
width: 100
|
||
},{
|
||
field: 'store_info',
|
||
title: '商品简介',
|
||
align: 'center',
|
||
width: 100
|
||
},{
|
||
field: 'stock',
|
||
title: '总库存',
|
||
align: 'center',
|
||
width: 100
|
||
},{
|
||
field: 'keyword',
|
||
title: '关键字',
|
||
align: 'center',
|
||
width: 100
|
||
},{
|
||
field: 'brand_id',
|
||
title: '品牌 id',
|
||
align: 'center',
|
||
width: 100
|
||
},{
|
||
field: 'cate_id',
|
||
title: '分类',
|
||
align: 'center',
|
||
width: 100
|
||
},{
|
||
field: 'unit_name',
|
||
title: '单位名',
|
||
align: 'center',
|
||
width: 100
|
||
},{
|
||
field: 'sales',
|
||
title: '销量',
|
||
align: 'center',
|
||
width: 100
|
||
},{
|
||
field: 'price',
|
||
title: '最低价格',
|
||
align: 'center',
|
||
width: 100
|
||
},{
|
||
field: 'cost',
|
||
title: '成本价',
|
||
align: 'center',
|
||
width: 100
|
||
},{
|
||
field: 'ot_price',
|
||
title: '原价',
|
||
align: 'center',
|
||
width: 100
|
||
}, {
|
||
fixed: 'right',
|
||
field: 'right',
|
||
title: '操作',
|
||
toolbar: '#barDemo',
|
||
width: 136,
|
||
align: 'center'
|
||
}
|
||
]
|
||
]
|
||
});
|
||
|
||
//监听表头工具栏事件
|
||
table.on('toolbar(store_product)', function(obj){
|
||
if (obj.event === 'add') {
|
||
tool.side("/admin/store_product/add");
|
||
return false;
|
||
}
|
||
});
|
||
|
||
//监听表格行工具事件
|
||
table.on('tool(store_product)', function(obj) {
|
||
var data = obj.data;
|
||
if (obj.event === 'read') {
|
||
// tool.side('/admin/store_product/buy?product_id='+obj.data.product_id);
|
||
var index = layer.open({
|
||
type: 2,
|
||
title: '购买商品',
|
||
shadeClose: true,
|
||
shade: false,
|
||
maxmin: false, //开启最大化最小化按钮
|
||
area: ['1000px', '800px'],
|
||
content: '/admin/store_product/buy?product_id='+obj.data.product_id
|
||
});
|
||
}
|
||
else if (obj.event === 'edit') {
|
||
tool.side('/admin/store_product/edit?product_id='+obj.data.product_id);
|
||
}
|
||
else if (obj.event === 'joincar') {
|
||
layer.open({
|
||
type: 1,
|
||
area: ["400px", "200px"],
|
||
title: "加入购物车",
|
||
content: "<input type=\"text\" name=\"number\" lay-verify=\"required|number\" placeholder=\"输入加入购物车数量\" lay-reqtext=\"请输入数字\" autocomplete=\"off\" class=\"layui-input\" id='carnum' min='1 '>",
|
||
btn: ['确定', '关闭'],
|
||
yes: function (index, layero) {
|
||
//ajax。必填参数，'options':请求参数，对象，'callback':成功回调函数
|
||
// 单击之后提交按钮不可选,防止重复提交
|
||
var DISABLED = 'layui-btn-disabled';
|
||
// 增加样式
|
||
$('.layui-layer-btn0').addClass(DISABLED);
|
||
// 增加属性
|
||
$('.layui-layer-btn0').attr('disabled', 'disabled');
|
||
let options = {
|
||
url: '/admin/store_product/joincar',
|
||
type: 'get',
|
||
data: {
|
||
product_id: obj.data.product_id,
|
||
cart_num:$('#carnum').val(),
|
||
is_new:1,
|
||
}
|
||
};
|
||
|
||
let callback = function(res) {
|
||
if (res.code == 200) {
|
||
layer.msg('加入成功',{time:2000,icon:6});
|
||
// 关闭所有层
|
||
setTimeout(function () {
|
||
layer.closeAll();
|
||
}, 2000);
|
||
}else{
|
||
layer.msg(res.msg,{time:2000,icon:2});
|
||
$('.layui-layer-btn0').removeClass(DISABLED);
|
||
$('.layui-layer-btn0').removeAttr('disabled');
|
||
}
|
||
}
|
||
tool.ajax(options, callback);
|
||
},
|
||
cancel: function (layer_window) {
|
||
// 关闭弹出框页面
|
||
layer.close(layer_window);
|
||
}
|
||
});
|
||
}
|
||
else if (obj.event === 'del') {
|
||
layer.confirm('确定要删除该记录吗?', {
|
||
icon: 3,
|
||
title: '提示'
|
||
}, function(index) {
|
||
let callback = function (e) {
|
||
layer.msg(e.msg);
|
||
if (e.code == 0) {
|
||
obj.del();
|
||
}
|
||
}
|
||
tool.delete("/admin/store_product/del", { product_id: data.product_id }, callback);
|
||
layer.close(index);
|
||
});
|
||
}
|
||
return false;
|
||
});
|
||
|
||
// 商户商品分类搜索
|
||
layui.use(['rate','dropdown', 'util', 'layer', 'table'], function(){
|
||
var dropdown = layui.dropdown
|
||
,util = layui.util
|
||
,layer = layui.layer
|
||
,rate = layui.rate
|
||
// ,table = layui.table
|
||
,$ = layui.jquery;
|
||
|
||
var $ = layui.$, active = {
|
||
reload: function(){
|
||
let dataRload = getformdata();
|
||
//执行重载
|
||
table.reload('store_product', {
|
||
page: {
|
||
curr: 1 //重新从第 1 页开始
|
||
}
|
||
,where: {
|
||
...dataRload
|
||
}
|
||
});
|
||
},
|
||
};
|
||
|
||
//商户商品分类菜单
|
||
$.ajax({
|
||
url: '/admin/api/getAllList',
|
||
method: "get",
|
||
data: {},
|
||
success: function(res) {
|
||
if (res.code!==0)return ;
|
||
|
||
//高级演示 - 各种组合
|
||
dropdown.render({
|
||
elem: '#seleform'
|
||
,isAllowSpread: false //禁止菜单组展开收缩
|
||
,style: 'width: 200px' //定义宽度，默认自适应
|
||
,id: 'test777' //定义唯一索引
|
||
,title: 'title1'
|
||
,data: res.data
|
||
,click: function(item){
|
||
$('#seleform').text(item.title);
|
||
$('#seleform').css({color:'rgba(0,0,0,.85)'});
|
||
$('#store_cate').val(item.id);
|
||
|
||
active['reload'] ? active['reload'].call(this) : '';
|
||
}
|
||
});
|
||
},
|
||
fail:function(){}
|
||
});
|
||
|
||
|
||
|
||
//基础效果
|
||
rate.render({
|
||
elem: '#is_good'
|
||
})
|
||
|
||
|
||
|
||
|
||
//监听搜索提交
|
||
form.on('submit(searchform)', function(data) {
|
||
layui.pageTable.reload({
|
||
where: {
|
||
...data.field
|
||
},
|
||
page: {
|
||
curr: 1
|
||
}
|
||
});
|
||
return false;
|
||
});
|
||
|
||
//监听select提交
|
||
form.on('select(seleform)', function(data) {
|
||
active['reload'] ? active['reload'].call(this) : '';
|
||
return false;
|
||
});
|
||
|
||
//监听removeselect点击
|
||
$('#removeselect').on('click', function(){
|
||
$('#seleform').text('请选择');
|
||
$('#seleform').css({color:'#a39f9f'});
|
||
$('#store_cate').val('');
|
||
active['reload'] ? active['reload'].call(this) : '';
|
||
return false;
|
||
});
|
||
|
||
// tab 状态列表切换
|
||
$('.site-demo-active').on('click', function(){
|
||
var othis = $(this), type = othis.data('type');
|
||
$('#protype').val(this.getAttribute('type'));
|
||
active[type] ? active[type].call(this, othis) : '';
|
||
});
|
||
|
||
});
|
||
|
||
// //监听搜索提交
|
||
// form.on('submit(searchform)', function(data) {
|
||
// layui.pageTable.reload({
|
||
// where: {
|
||
// keywords: data.field.keywords
|
||
// },
|
||
// page: {
|
||
// curr: 1
|
||
// }
|
||
// });
|
||
// return false;
|
||
// });
|
||
|
||
// 获取表单所有参数
|
||
function getformdata() {
|
||
var form = $('#filterform').serializeArray();
|
||
|
||
var data = new Array();
|
||
for(let i=0;i<form.length; i++){
|
||
data[form[i].name] = form[i].value;
|
||
}
|
||
|
||
return data;
|
||
}
|
||
|
||
|
||
}
|
||
</script>
|
||
{/block}
|
||
<!-- /脚本 --> |