625 行
27 KiB
HTML
可执行文件
625 行
27 KiB
HTML
可执行文件
<!--[1.8.50]-->
|
|
<style>
|
|
.el-table thead th {
|
|
background: #f5f7fa;
|
|
}
|
|
|
|
.cover-box {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
}
|
|
|
|
.el-table--radio {
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
font-weight: normal;
|
|
}
|
|
</style>
|
|
|
|
<div id="GroupListApp" v-cloak>
|
|
<!--搜索及操作内容-->
|
|
<el-form label-width="100px" size="small">
|
|
<el-form-item label="基本设置">
|
|
<el-form-item label="是否开启拼团" label-width="100px" style="width: 200px;display: inline-block">
|
|
<el-switch @change="switchGroupState"
|
|
:disabled="!operate.storeOnOrOff"
|
|
v-model="group_status"
|
|
inactive-value="2"
|
|
active-value="1">
|
|
</el-switch>
|
|
</el-form-item>
|
|
<el-form-item label="是否在首页展示" label-width="130px" style="width: 200px;display: inline-block">
|
|
<template slot="label">
|
|
<el-tooltip class="item"
|
|
effect="dark"
|
|
placement="top-start">
|
|
<div slot="content">
|
|
<p>该设置仅针对普通版商城有效</p>
|
|
</div>
|
|
<div>是否在首页展示<i class="el-icon-warning-outline"></i></div>
|
|
</el-tooltip>
|
|
</template>
|
|
<el-switch @change="switchHomeShowState"
|
|
:disabled="!operate.homeShowOrHide"
|
|
v-model="home_group_status"
|
|
inactive-value="2"
|
|
active-value="1">
|
|
</el-switch>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
<el-form-item label="活动状态搜索">
|
|
<el-radio-group v-model="searchForm.type" @change="handleCurrentChange(1)" size="small">
|
|
<el-radio-button label="1">所有活动</el-radio-button>
|
|
<el-radio-button label="2">未开始</el-radio-button>
|
|
<el-radio-button label="3">进行中</el-radio-button>
|
|
<el-radio-button label="4">已结束</el-radio-button>
|
|
<el-radio-button label="5">已失效</el-radio-button>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
<!--搜索、新增-->
|
|
<div style="display: flex;justify-content: space-between">
|
|
<el-form-item label="关键词搜索">
|
|
<el-input placeholder="请输入关键词"
|
|
v-model="searchForm.keyword"
|
|
oninput="value=this.value.trim(' ')"
|
|
type="text"
|
|
clearable
|
|
style="width: 300px"
|
|
@keydown.enter.exact.native.prevent="handleCurrentChange(1)"
|
|
class="input-with-select">
|
|
<el-select v-model="searchForm.keyword_type"
|
|
style="width: 100px"
|
|
background slot="prepend">
|
|
<el-option label="活动名称" value="1"></el-option>
|
|
<el-option label="商品名称" value="2"></el-option>
|
|
<el-option label="商品条码" value="3"></el-option>
|
|
<el-option label="商品货号" value="4"></el-option>
|
|
</el-select>
|
|
</el-input>
|
|
<el-button type="primary" @click="handleCurrentChange(1)">搜索</el-button>
|
|
</el-form-item>
|
|
<!--更多操作-->
|
|
<el-form-item>
|
|
<el-button type="primary" plain
|
|
v-if="operate.add"
|
|
@click="addGroup()">新增活动
|
|
</el-button>
|
|
<el-button type="primary" plain
|
|
v-if="operate.setCover"
|
|
@click="showSetCoverDialog=true">设置封面
|
|
</el-button>
|
|
</el-form-item>
|
|
</div>
|
|
</el-form>
|
|
<div style="max-width: calc(100vw - 208px);margin-top: 0;">
|
|
<el-table border :data="groupList"
|
|
style="width: 100%"
|
|
size="small"
|
|
:stripe="true" max-height="670">
|
|
<el-table-column align="center" fixed type="index" label="序号" width="50"></el-table-column>
|
|
<el-table-column align="center" prop="act_name" label="活动名称" min-width="130px"
|
|
show-overflow-tooltip></el-table-column>
|
|
<el-table-column align="center" prop="goods_name" label="商品名称" min-width="130px"
|
|
show-overflow-tooltip></el-table-column>
|
|
<el-table-column align="center" prop="goods_number" label="商品货号" min-width="80px"
|
|
show-overflow-tooltip></el-table-column>
|
|
<el-table-column align="center" prop="goods_code" label="商品条码" min-width="120px"
|
|
show-overflow-tooltip></el-table-column>
|
|
<el-table-column align="center" prop="act_time" label="活动起止时间" min-width="260px"
|
|
show-overflow-tooltip></el-table-column>
|
|
<el-table-column align="center" prop="sell_number" label="售出数量" min-width="80px"
|
|
show-overflow-tooltip></el-table-column>
|
|
<el-table-column align="center" prop="act_num" label="活动库存" min-width="80px"
|
|
show-overflow-tooltip></el-table-column>
|
|
<el-table-column align="center" prop="type_name" label="状态" min-width="80px"
|
|
show-overflow-tooltip></el-table-column>
|
|
|
|
<el-table-column align="center" fixed="right" label="操作" width="160px">
|
|
<template slot-scope="scope">
|
|
<template v-if="scope.row.act_type==1||scope.row.act_type==2">
|
|
<el-button v-if="operate.update"
|
|
@click="editGroup(scope.row.id)"
|
|
type="text" style="color: #67c23a" size="mini">编辑
|
|
</el-button>
|
|
<el-button v-if="operate.update"
|
|
@click="editStock(scope.row)"
|
|
type="text" size="mini">库存设置
|
|
</el-button>
|
|
<el-button v-if="operate.ban" style="color: #aaa"
|
|
@click="cancelGroup(scope.row.id)"
|
|
type="text" size="mini">取消
|
|
</el-button>
|
|
</template>
|
|
<template v-else>
|
|
<el-button v-if="operate.see" @click="seeDetail(scope.row.id)"
|
|
type="text" size="mini">查看
|
|
</el-button>
|
|
<el-button v-if="operate.recovery&&scope.row.act_num>0 && platform_type == 1"
|
|
@click="recovery(scope.row.id)"
|
|
type="text" size="mini">恢复库存
|
|
</el-button>
|
|
<el-button v-else-if="operate.delete" @click="delGroup(scope.row.id)"
|
|
type="text" size="mini" style="color: #aaa">删除
|
|
</el-button>
|
|
</template>
|
|
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
<el-pagination
|
|
@size-change="handleSizeChange"
|
|
@current-change="handleCurrentChange"
|
|
:current-page="searchForm.page"
|
|
:page-sizes="[10, 15, 20, 25, 30, 35, 40, 45, 50, 60, 70, 80, 90, 100]"
|
|
:page-size="10"
|
|
layout="total, sizes, prev, pager, next, jumper"
|
|
:total="currentLen">
|
|
</el-pagination>
|
|
</div>
|
|
|
|
<!-- 封面 -->
|
|
<el-dialog :append-to-body="true" :visible.sync="showSetCoverDialog" :close-on-click-modal="false" :width="'600px'">
|
|
<div class="cover-box">
|
|
<p>封面图</p>
|
|
<div class="el-upload el-upload--picture-card el-upload-list--picture-card upload-img-auto"
|
|
style="margin-right: 0"
|
|
@click="showSelectImage=true">
|
|
<i v-if="!xcx_group_cover" class="el-icon-plus"></i>
|
|
<img v-else class="el-upload-list__item-thumbnail img-auto"
|
|
:src="xcx_group_cover">
|
|
</div>
|
|
<p class="tips">建议大小690*280</p>
|
|
</div>
|
|
|
|
<div class="center" style="margin-top: 50px">
|
|
<el-button type="primary" size="medium" @click="saveCover">保存</el-button>
|
|
</div>
|
|
</el-dialog>
|
|
<!-- 选择图片 -->
|
|
<el-dialog title="选择图片" :append-to-body="true" :close-on-click-modal="false" :visible.sync="showSelectImage"
|
|
custom-class="select-image-el-dialog" :top="'50px'">
|
|
<template-select-image :can-select-num="1" @selectfile="selectFile"></template-select-image>
|
|
</el-dialog>
|
|
|
|
<!--库存设置-->
|
|
<el-dialog :title="stockForm.act_name+' - 库存设置'" :append-to-body="true" :close-on-click-modal="false"
|
|
:visible.sync="stockSetDialog" :width="stockForm.attribute_state==1?'500px':'700px'">
|
|
<template v-if="stockForm.attribute_state==1">
|
|
<el-form label-width="100px" size="small">
|
|
<el-form-item label="商品库存:">
|
|
<span>{{stockForm.goods_num}}</span>
|
|
<span style="color: #999;font-size: 12px;padding-left: 30px">该库存不包含拼团活动库存</span>
|
|
</el-form-item>
|
|
<el-form-item label="活动库存:">
|
|
<span>{{stockForm.act_num}}</span>
|
|
</el-form-item>
|
|
<el-form-item label="操作:">
|
|
<el-radio v-model="stockForm.type" :label="1">增加库存</el-radio>
|
|
<el-radio v-model="stockForm.type" :label="2">减少库存</el-radio>
|
|
</el-form-item>
|
|
<el-form-item label="数量:">
|
|
<el-input style="width: 150px"
|
|
v-model="stockForm.operate_num"
|
|
oninput="value=this.value.replace(/^[0]|\D/,'')"
|
|
placeholder="请输入操作数量"></el-input>
|
|
</el-form-item>
|
|
</el-form>
|
|
<span slot="footer" class="dialog-footer">
|
|
<el-button type="primary" size="small" @click="sureSetStock(null)">确 定</el-button>
|
|
</span>
|
|
</template>
|
|
<div v-else>
|
|
<el-table border :data="stockSkuList"
|
|
style="width: 100%"
|
|
size="small"
|
|
:stripe="true" max-height="670">
|
|
<el-table-column align="center" fixed type="index" label="序号" width="50"></el-table-column>
|
|
<el-table-column align="center" prop="sku_name" label="规格名称" min-width="100px"
|
|
show-overflow-tooltip></el-table-column>
|
|
<el-table-column align="center" prop="act_num" label="活动库存" min-width="80px"
|
|
show-overflow-tooltip></el-table-column>
|
|
<el-table-column align="center" prop="goods_num" label="系统库存" min-width="80px"
|
|
show-overflow-tooltip></el-table-column>
|
|
<el-table-column align="center" prop="type_name" label="操作类型" min-width="100px">
|
|
<template slot-scope="scope">
|
|
<el-radio class="el-table--radio" v-model="scope.row.type" :label="1">增加库存</el-radio>
|
|
<el-radio class="el-table--radio" v-model="scope.row.type" :label="2">减少库存</el-radio>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column align="center" fixed="right" label="操作" width="180px">
|
|
<template slot-scope="scope">
|
|
<el-input v-model="scope.row.operate_num"
|
|
oninput="value=this.value.replace(/^[0]|\D/,'')"
|
|
size="mini" placeholder="操作数量">
|
|
<el-button background
|
|
size="mini" slot="append"
|
|
@click="sureSetStock(scope.$index)">保存
|
|
</el-button>
|
|
</el-input>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</div>
|
|
</el-dialog>
|
|
|
|
</div>
|
|
|
|
<script>
|
|
var GroupListApp = new Vue({
|
|
el: '#GroupListApp',
|
|
data() {
|
|
return {
|
|
platform_type:1,
|
|
searchForm: {
|
|
keyword: '',
|
|
keyword_type: '1',
|
|
type: '1',
|
|
page: 1,
|
|
limit: 10,
|
|
},
|
|
groupList: [],//活动列表
|
|
currentLen: 0,//活动筛选的总数量
|
|
showSetCoverDialog: false,//是否显示封面设置弹框
|
|
operate: {},//操作权限
|
|
showSelectImage: false,//是否显示选择图片
|
|
|
|
cover_id: '',//封面图地址
|
|
xcx_group_cover: '',//封面图地址
|
|
group_status: '2',//是否开启拼团
|
|
home_group_status: '2',//是否在首页显示
|
|
stockSetDialog: false,//是否显示库存设置
|
|
stockForm: {},
|
|
stockSkuList: [],//操作规格库存的数据
|
|
}
|
|
},
|
|
methods: {
|
|
//商户平台类型 1默认系统 2微礼平台
|
|
getPlatformType(){
|
|
$.ajax({
|
|
url:'/index.php/Retail/Goods/getPlatformType',
|
|
type:"post",
|
|
data:{},
|
|
success:(res)=>{
|
|
this.platform_type = res.platform_type
|
|
}
|
|
})
|
|
},
|
|
//开启拼团
|
|
switchGroupState() {
|
|
$.ajax({
|
|
url: "{:U('storeOnOrOff')}",
|
|
type: "POST",
|
|
data: {
|
|
state: this.group_status,
|
|
},
|
|
success: (res) => {
|
|
if (res.status == 1) {
|
|
this.$message.success(res.msg)
|
|
} else {
|
|
this.group_status = this.group_status == 2 ? '1' : '2';
|
|
this.$message.warning(res.msg)
|
|
}
|
|
}
|
|
})
|
|
},
|
|
//开启首页展示
|
|
switchHomeShowState() {
|
|
$.ajax({
|
|
url: "{:U('homeShowOrHide')}",
|
|
type: "POST",
|
|
data: {
|
|
status: this.home_group_status,
|
|
},
|
|
success: (res) => {
|
|
if (res.status == 1) {
|
|
this.$message.success(res.msg)
|
|
} else {
|
|
this.home_group_status = this.home_group_status == 2 ? '1' : '2';
|
|
this.$message.warning(res.msg)
|
|
}
|
|
}
|
|
})
|
|
},
|
|
//选择封面图片
|
|
selectFile(item) {
|
|
this.showSelectImage = false;
|
|
if (item.length) {
|
|
this.cover_id = item[0].id;
|
|
this.xcx_group_cover = item[0].path;
|
|
}
|
|
},
|
|
//保存封面图
|
|
saveCover() {
|
|
if (!this.cover_id) {
|
|
return this.$message.warning('您未修改图片');
|
|
}
|
|
$.ajax({
|
|
url: "{:U('add_group_cover')}",
|
|
type: "post",
|
|
data: {
|
|
cover_id: this.cover_id,
|
|
xcx_group_cover: this.xcx_group_cover,
|
|
},
|
|
success: (res) => {
|
|
if (res.status == 1) {
|
|
this.showSetCoverDialog = false;
|
|
this.$message.success(res.msg);
|
|
} else {
|
|
this.$message.error(res.msg);
|
|
}
|
|
}
|
|
})
|
|
},
|
|
//新增活动
|
|
addGroup() {
|
|
layer.open({
|
|
type: 2,
|
|
title: "新增拼团活动",
|
|
content: "/index.php/Retail/Group/create",
|
|
area: ["calc(100% - 160px)", "calc(100% - 65px)"],
|
|
offset: 'rb',
|
|
resize: false,
|
|
shade: 0,
|
|
move: false,
|
|
end: () => {
|
|
this.getData();
|
|
}
|
|
})
|
|
},
|
|
//编辑活动
|
|
editGroup(id) {
|
|
layer.open({
|
|
type: 2,
|
|
content: "{:U('edit')}?id=" + id,
|
|
title: "编辑活动",
|
|
area: ['calc(100% - 160px)', 'calc(100% - 65px)'],
|
|
shade: 0,
|
|
offset: 'rb',
|
|
end: () => {
|
|
this.getData();
|
|
}
|
|
})
|
|
},
|
|
//取消活动
|
|
cancelGroup(id) {
|
|
this.$confirm("确定取消此活动吗?活动取消后不可恢复,请重新设置", "温馨提示", {
|
|
confirmButtonText: '确定',
|
|
cancelButtonText: '取消',
|
|
type: 'info'
|
|
}).then(() => {
|
|
$.ajax({
|
|
url: "/index.php/Retail/Group/ban",
|
|
type: "POST",
|
|
data: {id: id},
|
|
success: (res) => {
|
|
if (res.status == 1) {
|
|
this.$message.success(res.msg);
|
|
this.getData();
|
|
} else {
|
|
this.$message.error(res.msg);
|
|
}
|
|
}
|
|
})
|
|
}).catch(() => {
|
|
})
|
|
},
|
|
//查看活动详情
|
|
seeDetail(id) {
|
|
layer.open({
|
|
type: 2,
|
|
content: "{:U('see')}?id=" + id,
|
|
title: "活动详情",
|
|
area: ['calc(100% - 160px)', 'calc(100% - 65px)'],
|
|
shade: 0,
|
|
offset: 'rb',
|
|
})
|
|
},
|
|
//修改库存前
|
|
editStock(item) {
|
|
this.stockForm = JSON.parse(JSON.stringify(item));
|
|
this.stockSkuList = [];
|
|
//规格商品
|
|
if (item.attribute_state == 2) {
|
|
$.ajax({
|
|
url: '/index.php/Retail/Group/getGroupSkuList',
|
|
type: 'post',
|
|
data: {
|
|
id: item.id,
|
|
},
|
|
success: (res) => {
|
|
if (res.status == 1) {
|
|
this.stockSkuList = res.data;
|
|
} else {
|
|
this.$message.error(res.msg);
|
|
}
|
|
}
|
|
})
|
|
}
|
|
this.stockSetDialog = true;
|
|
},
|
|
//确认保存库存修改
|
|
sureSetStock(index) {
|
|
let item = {};
|
|
if (this.stockForm.attribute_state == 1) {
|
|
item = {
|
|
id: this.stockForm.id,
|
|
type: this.stockForm.type,
|
|
operate_num: this.stockForm.operate_num,
|
|
goods_num: this.stockForm.goods_num,
|
|
act_num: this.stockForm.act_num,
|
|
};
|
|
} else {
|
|
item = {
|
|
id: this.stockForm.id,
|
|
sku_id: this.stockSkuList[index].sku_id,
|
|
group_sku_id: this.stockSkuList[index].id,
|
|
type: this.stockSkuList[index].type,
|
|
operate_num: this.stockSkuList[index].operate_num,
|
|
goods_num: this.stockSkuList[index].goods_num,
|
|
act_num: this.stockSkuList[index].act_num,
|
|
}
|
|
}
|
|
if (!item.type) {
|
|
return this.$message.warning('请选择操作的类型');
|
|
}
|
|
if (!item.operate_num) {
|
|
return this.$message.warning('请设置操作库存');
|
|
}
|
|
if (item.type == 1 && item.goods_num * 1 < item.operate_num * 1) {
|
|
return this.$message.warning('增加的数量不能大于系统库存');
|
|
} else if (item.type == 2 && item.act_num * 1 < item.operate_num * 1) {
|
|
return this.$message.warning('减少的数量不能大于活动剩余库存');
|
|
}
|
|
this.$confirm("确认对该活动的库存进行操作吗？", "温馨提示", {
|
|
confirmButtonText: '确定',
|
|
cancelButtonText: '取消',
|
|
type: 'info'
|
|
}).then(() => {
|
|
$.ajax({
|
|
url: "/index.php/Retail/Group/updateGroupInventory",
|
|
type: "POST",
|
|
data: item,
|
|
success: (res) => {
|
|
if (res.status == 1) {
|
|
this.$message.success(res.msg);
|
|
if (this.stockForm.attribute_state == 1) this.stockSetDialog = false;
|
|
this.getData();
|
|
} else {
|
|
this.$message.error(res.msg);
|
|
}
|
|
}
|
|
})
|
|
}).catch(() => {
|
|
})
|
|
},
|
|
//恢复库存
|
|
recovery(id) {
|
|
this.$confirm("确定恢复商品库存吗?", "温馨提示", {
|
|
confirmButtonText: '确定',
|
|
cancelButtonText: '取消',
|
|
type: 'info'
|
|
}).then(() => {
|
|
$.ajax({
|
|
url: "{:U('recovery')}",
|
|
type: "POST",
|
|
data: {id: id},
|
|
success: (res) => {
|
|
if (res.status == 1) {
|
|
this.$message.success(res.msg);
|
|
this.getData();
|
|
} else if (res.status == 2) {
|
|
this.$message.warning(res.msg);
|
|
} else {
|
|
this.$message.error(res.msg);
|
|
}
|
|
}
|
|
})
|
|
}).catch(() => {
|
|
})
|
|
},
|
|
//删除活动
|
|
delGroup(id) {
|
|
this.$confirm("确定删除此活动吗?", "温馨提示", {
|
|
confirmButtonText: '删除',
|
|
cancelButtonText: '取消',
|
|
type: 'info'
|
|
}).then(() => {
|
|
$.ajax({
|
|
url: "{:U('delete')}",
|
|
type: "POST",
|
|
data: {id: id},
|
|
success: (res) => {
|
|
if (res.status == 1) {
|
|
this.$message.success(res.msg);
|
|
this.getData();
|
|
} else {
|
|
this.$message.error(res.msg);
|
|
}
|
|
}
|
|
})
|
|
}).catch(() => {
|
|
})
|
|
},
|
|
//切换每页数量
|
|
handleSizeChange(val) {
|
|
this.searchForm.limit = val;
|
|
this.searchForm.page = 1;
|
|
this.getData();
|
|
},
|
|
//切换页数
|
|
handleCurrentChange(val) {
|
|
this.searchForm.page = val;
|
|
this.getData();
|
|
},
|
|
//获取拼团活动列表
|
|
getData() {
|
|
$.ajax({
|
|
url: "/index.php/Retail/Group/getGroupList",
|
|
type: 'POST',
|
|
data: this.searchForm,
|
|
success: (res) => {
|
|
if (res.status == 1) {
|
|
this.groupList = [];
|
|
this.groupList = res.data;
|
|
this.currentLen = parseInt(res.count);
|
|
} else {
|
|
this.$alert(res.msg);
|
|
}
|
|
},
|
|
error: () => {
|
|
|
|
}
|
|
});
|
|
},
|
|
//获取基本配置
|
|
getInitData() {
|
|
$.ajax({
|
|
url: '/index.php/Retail/Group/index',
|
|
type: "post",
|
|
data: {},
|
|
success: (res) => {
|
|
if (res.status == 1) {
|
|
this.cover_id = res.data.xcx_group_cover_id;
|
|
this.xcx_group_cover = res.data.xcx_group_cover;
|
|
this.group_status = res.data.group_status;
|
|
this.home_group_status = res.data.home_group_status;
|
|
}
|
|
}
|
|
})
|
|
},
|
|
//获取操作权限
|
|
getOperate() {
|
|
var auth_list = {
|
|
add: '/index.php/Retail/Group/add',
|
|
update: '/index.php/Retail/Group/update',
|
|
see: '/index.php/Retail/Group/see',
|
|
ban: '/index.ph`p/Retail/Group/ban',
|
|
recovery: '/index.php/Retail/Group/recovery',
|
|
setCover: '/index.php/Retail/Group/xcx_group_cover',
|
|
storeOnOrOff: '/index.php/Retail/Group/storeOnOrOff',
|
|
homeShowOrHide: '/index.php/Retail/Group/homeShowOrHide',
|
|
};
|
|
$.ajax({
|
|
url: '/index.php/Retail/Component/checkOperateAuth',
|
|
type: "post",
|
|
data: {
|
|
auth_list: JSON.stringify(auth_list),
|
|
},
|
|
success: (res) => {
|
|
if (res.status == 1) {
|
|
this.operate = res.data;
|
|
}
|
|
}
|
|
})
|
|
},
|
|
},
|
|
created() {
|
|
this.getPlatformType();
|
|
this.getOperate();
|
|
this.getInitData();
|
|
this.getData();
|
|
},
|
|
})
|
|
</script>
|