|
@@ -1,356 +1,27 @@
|
|
|
<template>
|
|
|
- <div class="app-container">
|
|
|
- <el-tabs v-model="tabsCurrent" @tab-click="changeTopTabs">
|
|
|
-
|
|
|
- <el-tab-pane label="活动管理" name="activity">
|
|
|
- <div class="mymain-container">
|
|
|
- <div class="btn-group clearfix" style="margin-bottom: 20px">
|
|
|
- <div class="fl">
|
|
|
- <el-button size="small" type="primary" icon="el-icon-plus" @click="addOrEdit('add')">添加秒杀活动</el-button>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="tabs-container clearfix">
|
|
|
- <div class="fl">
|
|
|
- <el-tabs v-model="activityTypeCurrent" type="card" @tab-click="getActivityListByScreen">
|
|
|
- <el-tab-pane label="全部" name="0"></el-tab-pane>
|
|
|
- <el-tab-pane label="未开始" name="1"></el-tab-pane>
|
|
|
- <el-tab-pane label="进行中" name="2"></el-tab-pane>
|
|
|
- <el-tab-pane label="已结束" name="3"></el-tab-pane>
|
|
|
- </el-tabs>
|
|
|
- </div>
|
|
|
- <div class="fr">
|
|
|
- <el-date-picker
|
|
|
- v-model="activityScreenForm.activityDate"
|
|
|
- @change="getActivityListByScreen"
|
|
|
- type="daterange"
|
|
|
- size="small"
|
|
|
- style="margin-right: 20px; width: 260px !important;"
|
|
|
- value-format="yyyy-MM-dd"
|
|
|
- range-separator="至"
|
|
|
- start-placeholder="活动开始时间"
|
|
|
- end-placeholder="活动结束时间">
|
|
|
- </el-date-picker>
|
|
|
- <el-input placeholder="请输入活动名称进行搜索" v-model="activityScreenForm.keyword" size="small" style="width: 240px; margin-top: 10px;" clearable>
|
|
|
- <el-button slot="append" icon="el-icon-search" size="small" @click="getActivityListByScreen"></el-button>
|
|
|
- </el-input>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="table">
|
|
|
- <el-table v-loading="activity_listLoading" :data="activity_dataList" element-loading-text="Loading" border fit stripe>
|
|
|
- <el-table-column align="center" label="活动名称" prop="secKillName" min-width="120"></el-table-column>
|
|
|
- <el-table-column align="center" label="参与产品数量" prop="specCount" min-width="120"></el-table-column>
|
|
|
- <el-table-column align="center" label="活动时间" min-width="200">
|
|
|
- <template slot-scope="scope">
|
|
|
- {{ scope.row.startTime | dateToDayFilter }} 至 {{ scope.row.endTime | dateToDayFilter }}
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column align="center" label="参与场次" prop="stages" width="280">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-tag v-for="(item, index) in scope.row.stages" :key="index" size="small">{{item.name}}点</el-tag>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column align="center" label="商户" prop="companyName" min-width="120"></el-table-column>
|
|
|
- <el-table-column align="center" label="状态">
|
|
|
- <template slot-scope="scope">
|
|
|
- {{ scope.row.activityStatus | SEC_KILL_CURRENT_STATUS_FILTER }}
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column align="center" label="操作" width="180">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-button type="text" @click="addOrEdit('edit', scope.row.secKillId)">编辑</el-button>
|
|
|
- <template>
|
|
|
- <el-popconfirm v-if="scope.row.status" style="margin-left: 10px;" title="确定关闭吗?" @confirm="changeActivityStatus(scope.row.secKillId, 0)" >
|
|
|
- <el-button slot="reference" type="text">关闭</el-button>
|
|
|
- </el-popconfirm>
|
|
|
- <el-popconfirm v-else style="margin-left: 10px;" title="确定开启吗?" @confirm="changeActivityStatus(scope.row.secKillId, 1)" >
|
|
|
- <el-button slot="reference" type="text">开启</el-button>
|
|
|
- </el-popconfirm>
|
|
|
- </template>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- </div>
|
|
|
- <div class="pagination clearfix">
|
|
|
- <div class="fr">
|
|
|
- <el-pagination
|
|
|
- @size-change="handleActivitySizeChange"
|
|
|
- @current-change="handleActivityCurrentChange"
|
|
|
- :current-page="activity_currentPage"
|
|
|
- :page-sizes="[10, 20, 30, 50]"
|
|
|
- :page-size="10"
|
|
|
- layout="total, sizes, prev, pager, next, jumper"
|
|
|
- :total="activity_listTotal">
|
|
|
- </el-pagination>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- </el-tab-pane>
|
|
|
-
|
|
|
-
|
|
|
- <el-tab-pane label="商品管理" name="goods">
|
|
|
- <div class="mymain-container">
|
|
|
- <div class="tabs-container clearfix">
|
|
|
- <div class="fl">
|
|
|
- <el-tabs v-model="goodsTypeCurrent" type="card" @tab-click="getSeckillGoodsListByScreen">
|
|
|
- <el-tab-pane label="全部" name="0"></el-tab-pane>
|
|
|
- <el-tab-pane label="未开始" name="1"></el-tab-pane>
|
|
|
- <el-tab-pane label="进行中" name="2"></el-tab-pane>
|
|
|
- <el-tab-pane label="已结束" name="3"></el-tab-pane>
|
|
|
- <el-tab-pane label="已关闭" name="4"></el-tab-pane>
|
|
|
- </el-tabs>
|
|
|
- </div>
|
|
|
- <div class="fr">
|
|
|
- <el-input placeholder="请输入商品名称进行搜索" v-model="goodsScreenForm.keyword" size="small" style="width: 240px; margin-top: 10px;" clearable>
|
|
|
- <el-button slot="append" icon="el-icon-search" size="small" @click="getSeckillGoodsListByScreen"></el-button>
|
|
|
- </el-input>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="table">
|
|
|
- <el-table v-loading="goods_listLoading" :data="goods_dataList" element-loading-text="Loading" border fit stripe>
|
|
|
- <el-table-column align="center" label="商品名称" prop="goodsName" min-width="200"></el-table-column>
|
|
|
- <el-table-column align="center" label="商品图片" prop="imgUrl" width="80">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-image style="width: 50px; height: 50px;" :src="scope.row.imgUrl" :preview-src-list="[scope.row.imgUrl]" fit="cover"></el-image>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column align="center" label="活动时间" prop="startTime" min-width="240">
|
|
|
- <template slot-scope="scope">
|
|
|
- <div>开始时间:{{scope.row.startTime}}</div>
|
|
|
- <div>结束时间:{{scope.row.endTime}}</div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column align="center" label="返佣" prop="amount"></el-table-column>
|
|
|
- <el-table-column align="center" label="秒杀价" prop="price"></el-table-column>
|
|
|
- <el-table-column align="center" label="状态">
|
|
|
- <template slot-scope="scope">
|
|
|
- {{ scope.row.status | SEC_KILL_CURRENT_STATUS_FILTER }}
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
-
|
|
|
- <el-table-column align="center" label="操作" width="180">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-popconfirm title="确定删除吗?" @confirm="deleteGoods(scope.row.secKillSpecId)" >
|
|
|
- <el-button slot="reference" type="text">删除</el-button>
|
|
|
- </el-popconfirm>
|
|
|
- <template>
|
|
|
- <el-popconfirm v-if="scope.row.status == 1 || scope.row.status == 2" style="margin-left: 10px;" title="确定关闭吗?" @confirm="changeGoodsStatus(scope.row.secKillSpecId, 0)" >
|
|
|
- <el-button slot="reference" type="text">关闭</el-button>
|
|
|
- </el-popconfirm>
|
|
|
- <el-popconfirm v-if="scope.row.status == 4" style="margin-left: 10px;" title="确定开启吗?" @confirm="changeGoodsStatus(scope.row.secKillSpecId, 1)" >
|
|
|
- <el-button slot="reference" type="text">开启</el-button>
|
|
|
- </el-popconfirm>
|
|
|
- </template>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- </div>
|
|
|
- <div class="pagination clearfix">
|
|
|
- <div class="fr">
|
|
|
- <el-pagination
|
|
|
- @size-change="handleGoodsSizeChange"
|
|
|
- @current-change="handleGoodsCurrentChange"
|
|
|
- :current-page="goods_currentPage"
|
|
|
- :page-sizes="[10, 20, 30, 50]"
|
|
|
- :page-size="10"
|
|
|
- layout="total, sizes, prev, pager, next, jumper"
|
|
|
- :total="goods_listTotal">
|
|
|
- </el-pagination>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </el-tab-pane>
|
|
|
- </el-tabs>
|
|
|
- </div>
|
|
|
+ <zj-page-container>
|
|
|
+ <div style="box-sizing: border-box;padding: 5px 20px 0;height: 45px;overflow: hidden;">
|
|
|
+ <el-tabs v-model="type">
|
|
|
+ <el-tab-pane label="活动管理" name="hdgl"></el-tab-pane>
|
|
|
+ <el-tab-pane label="商品管理" name="spgl"></el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+ </div>
|
|
|
+ <zj-page-fill>
|
|
|
+ <index1 v-if="type == 'hdgl'" key="hdgl" />
|
|
|
+ <index2 v-if="type == 'spgl'" key="spgl" />
|
|
|
+ </zj-page-fill>
|
|
|
+ </zj-page-container>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { getActivityList, getSeckillGoodsList, closeActivityStatus, openActivityStatus, closeGoodsStatus, openGoodsStatus, deleteGoods } from '@/api/seckill'
|
|
|
-
|
|
|
+import index1 from "./index_1.vue"
|
|
|
+import index2 from "./index_2.vue"
|
|
|
export default {
|
|
|
+ components: { index1, index2 },
|
|
|
data() {
|
|
|
return {
|
|
|
- tabsCurrent: 'activity',
|
|
|
- activity_dataList: null, // 列表数据
|
|
|
- activity_listLoading: true, // 列表加载loading
|
|
|
- activity_currentPage: 1, // 当前页码
|
|
|
- activity_pageSize: 10, // 每页数量
|
|
|
- activity_listTotal: 0, // 列表总数
|
|
|
- activityTypeCurrent: 0,
|
|
|
- activityScreenForm: {
|
|
|
- keyword: '',
|
|
|
- activityDate: '',
|
|
|
- },
|
|
|
-
|
|
|
- goods_dataList: null, // 列表数据
|
|
|
- goods_listLoading: true, // 列表加载loading
|
|
|
- goods_currentPage: 1, // 当前页码
|
|
|
- goods_pageSize: 10, // 每页数量
|
|
|
- goods_listTotal: 0, // 列表总数
|
|
|
- goodsTypeCurrent: 0,
|
|
|
- goodsScreenForm: {
|
|
|
- keyword: ''
|
|
|
- }
|
|
|
+ type: "hdgl",
|
|
|
}
|
|
|
},
|
|
|
- created() {
|
|
|
- this.getActivityList();
|
|
|
- },
|
|
|
- methods: {
|
|
|
- // 切换顶部tabs
|
|
|
- changeTopTabs() {
|
|
|
- if(this.tabsCurrent == 'activity') {
|
|
|
- this.getActivityList();
|
|
|
- }else {
|
|
|
- this.getSeckillGoodsList();
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- // 获取活动列表
|
|
|
- getActivityList() {
|
|
|
- getActivityList({
|
|
|
- pageNum: this.activity_currentPage,
|
|
|
- pageSize: this.activity_pageSize,
|
|
|
- keyword: this.activityScreenForm.keyword,
|
|
|
- status: this.activityTypeCurrent,
|
|
|
- startTime: this.activityScreenForm.activityDate ? this.activityScreenForm.activityDate[0] + ' 00:00:00' : '',
|
|
|
- endTime: this.activityScreenForm.activityDate ? this.activityScreenForm.activityDate[1] + ' 23:59:59' : '',
|
|
|
- }).then(res => {
|
|
|
- this.activity_dataList = res.data.records;
|
|
|
- this.activity_listTotal = res.data.total;
|
|
|
- this.activity_listLoading = false;
|
|
|
- })
|
|
|
- },
|
|
|
-
|
|
|
- // 筛选后重新获取列表
|
|
|
- getActivityListByScreen() {
|
|
|
- this.activity_currentPage = 1;
|
|
|
- this.getActivityList();
|
|
|
- },
|
|
|
-
|
|
|
- // 更改活动列表每页数量
|
|
|
- handleActivitySizeChange(val) {
|
|
|
- this.activity_pageSize = val;
|
|
|
- this.activity_currentPage = 1;
|
|
|
- this.getActivityList();
|
|
|
- },
|
|
|
-
|
|
|
- // 更改活动列表当前页
|
|
|
- handleActivityCurrentChange(val) {
|
|
|
- this.activity_currentPage = val;
|
|
|
- this.getActivityList();
|
|
|
- },
|
|
|
-
|
|
|
- // 获取商品列表
|
|
|
- getSeckillGoodsList() {
|
|
|
- getSeckillGoodsList({
|
|
|
- pageNum: this.goods_currentPage,
|
|
|
- pageSize: this.goods_pageSize,
|
|
|
- keyword: this.goodsScreenForm.keyword,
|
|
|
- status: this.goodsTypeCurrent,
|
|
|
- }).then(res => {
|
|
|
- this.goods_dataList = res.data.records;
|
|
|
- this.goods_listTotal = res.data.total;
|
|
|
- this.goods_listLoading = false;
|
|
|
- })
|
|
|
- },
|
|
|
-
|
|
|
- // 筛选后重新获取列表
|
|
|
- getSeckillGoodsListByScreen() {
|
|
|
- this.goods_currentPage = 1;
|
|
|
- this.getSeckillGoodsList();
|
|
|
- },
|
|
|
-
|
|
|
- // 更改商品列表每页数量
|
|
|
- handleGoodsSizeChange(val) {
|
|
|
- this.goods_pageSize = val;
|
|
|
- this.goods_currentPage = 1;
|
|
|
- this.getSeckillGoodsList();
|
|
|
- },
|
|
|
-
|
|
|
- // 更改商品列表当前页
|
|
|
- handleGoodsCurrentChange(val) {
|
|
|
- this.goods_currentPage = val;
|
|
|
- this.getSeckillGoodsList();
|
|
|
- },
|
|
|
-
|
|
|
- // 添加活动
|
|
|
- addOrEdit(type, id) {
|
|
|
- if(type == 'add') {
|
|
|
- this.$router.push({
|
|
|
- name:"seckill_add",
|
|
|
- query: {}
|
|
|
- })
|
|
|
- }else {
|
|
|
- this.$router.push({
|
|
|
- name:"seckill_add",
|
|
|
- query: {
|
|
|
- id
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- // 操作 - 更改活动状态(type: 禁用0,启用1)
|
|
|
- changeActivityStatus(id, type) {
|
|
|
- if(type == 0) {
|
|
|
- closeActivityStatus({secKillId: id}).then(res => {
|
|
|
- this.getActivityList();
|
|
|
- this.$successMsg();
|
|
|
- })
|
|
|
- }else {
|
|
|
- openActivityStatus({secKillId: id}).then(res => {
|
|
|
- this.getActivityList();
|
|
|
- this.$successMsg();
|
|
|
- })
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- // 操作 - 更改商品状态(type: 禁用0,启用1)
|
|
|
- changeGoodsStatus(id, type) {
|
|
|
- if(type == 0) {
|
|
|
- closeGoodsStatus({secKillSpecId: id}).then(res => {
|
|
|
- this.getSeckillGoodsList();
|
|
|
- this.$successMsg();
|
|
|
- })
|
|
|
- }else {
|
|
|
- openGoodsStatus({secKillSpecId: id}).then(res => {
|
|
|
- this.getSeckillGoodsList();
|
|
|
- this.$successMsg();
|
|
|
- })
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- // 操作 - 删除商品
|
|
|
- deleteGoods(id) {
|
|
|
- deleteGoods({secKillSpecId: id}).then(res => {
|
|
|
- this.getSeckillGoodsList();
|
|
|
- this.$successMsg();
|
|
|
- })
|
|
|
- },
|
|
|
-
|
|
|
- },
|
|
|
-
|
|
|
}
|
|
|
</script>
|
|
|
-
|
|
|
-<style scoped>
|
|
|
- .app-container >>> .el-tabs__header {
|
|
|
- margin-bottom: 0;
|
|
|
- }
|
|
|
- .app-container >>> .el-tabs__nav-wrap::after {
|
|
|
- background: none;
|
|
|
- }
|
|
|
- .app-container >>> #tab-activity, .app-container >>> #tab-goods {
|
|
|
- font-size: 16px;
|
|
|
- }
|
|
|
- .table >>> .el-tag {
|
|
|
- margin-right: 6px;
|
|
|
- }
|
|
|
- .table >>> .el-tag:last-child {
|
|
|
- margin-right: 0;
|
|
|
- }
|
|
|
-</style>
|