限时购设置商品功能完善

src/api/flashProductRelation.js

@@ -0,0 +1,28 @@
+import request from '@/utils/request'
+export function fetchList(params) {
+  return request({
+    url:'/flashProductRelation/list',
+    method:'get',
+    params:params
+  })
+}
+export function createFlashProductRelation(data) {
+  return request({
+    url:'/flashProductRelation/create',
+    method:'post',
+    data:data
+  })
+}
+export function deleteFlashProductRelation(id) {
+  return request({
+    url:'/flashProductRelation/delete/'+id,
+    method:'post'
+  })
+}
+export function updateFlashProductRelation(id,data) {
+  return request({
+    url:'/flashProductRelation/update/'+id,
+    method:'post',
+    data:data
+  })
+}

src/api/flashSession.js

@@ -1,35 +1,48 @@
 import request from '@/utils/request'
+
 export function fetchList(params) {
   return request({
-    url:'/flashSession/list',
-    method:'get',
-    params:params
+    url: '/flashSession/list',
+    method: 'get',
+    params: params
   })
 }
-export function updateStatus(id,params) {
+
+export function fetchSelectList(params) {
   return request({
-    url:'/flashSession/update/status/'+id,
-    method:'post',
-    params:params
+    url: '/flashSession/selectList',
+    method: 'get',
+    params: params
   })
 }
+
+export function updateStatus(id, params) {
+  return request({
+    url: '/flashSession/update/status/' + id,
+    method: 'post',
+    params: params
+  })
+}
+
 export function deleteSession(id) {
   return request({
-    url:'/flashSession/delete/'+id,
-    method:'post'
+    url: '/flashSession/delete/' + id,
+    method: 'post'
   })
 }
+
 export function createSession(data) {
   return request({
-    url:'/flashSession/create',
-    method:'post',
-    data:data
+    url: '/flashSession/create',
+    method: 'post',
+    data: data
   })
 }
-export function updateSession(id,data) {
+
+export function updateSession(id, data) {
   return request({
-    url:'/flashSession/update/'+id,
-    method:'post',
-    data:data
+    url: '/flashSession/update/' + id,
+    method: 'post',
+    data: data
   })
 }

src/router/index.js

@@ -214,6 +214,20 @@ export const constantRouterMap = [
         meta: {title: '秒杀时间段列表'},
         hidden:true
       },
+      {
+        path: 'selectSession',
+        name: 'selectSession',
+        component: () => import('@/views/sms/flash/selectSessionList'),
+        meta: {title: '秒杀时间段选择'},
+        hidden:true
+      },
+      {
+        path: 'flashProductRelation',
+        name: 'flashProductRelation',
+        component: () => import('@/views/sms/flash/productRelationList'),
+        meta: {title: '秒杀商品列表'},
+        hidden:true
+      },
       {
         path: 'coupon',
         name: 'coupon',

src/views/sms/flash/index.vue

@@ -67,7 +67,7 @@
           <template slot-scope="scope">
             <el-button size="mini"
                        type="text"
-                       @click="handleView(scope.$index, scope.row)">设置商品
+                       @click="handleSelectSession(scope.$index, scope.row)">设置商品
             </el-button>
             <el-button size="mini"
                        type="text"
@@ -275,6 +275,9 @@
           }
         })
       },
+      handleSelectSession(index,row){
+        this.$router.push({path:'/sms/selectSession',query:{flashPromotionId:row.id}})
+      },
       getList() {
         this.listLoading = true;
         fetchList(this.listQuery).then(response => {

src/views/sms/flash/productRelationList.vue

@@ -0,0 +1,311 @@
+<template> 
+  <div class="app-container">
+    <el-card class="operate-container" shadow="never">
+      <i class="el-icon-tickets"></i>
+      <span>数据列表</span>
+      <el-button size="mini" class="btn-add" @click="handleSelectProduct()" style="margin-left: 20px">添加</el-button>
+    </el-card>
+    <div class="table-container">
+      <el-table ref="productRelationTable"
+                :data="list"
+                style="width: 100%;"
+                v-loading="listLoading" border>
+        <el-table-column label="编号" width="100" align="center">
+          <template slot-scope="scope">{{scope.row.id}}</template>
+        </el-table-column>
+        <el-table-column label="商品名称" align="center">
+          <template slot-scope="scope">{{scope.row.product.name}}</template>
+        </el-table-column>
+        <el-table-column label="货号" width="140" align="center">
+          <template slot-scope="scope">NO.{{scope.row.product.productSn}}</template>
+        </el-table-column>
+        <el-table-column label="商品价格" width="100" align="center">
+          <template slot-scope="scope">￥{{scope.row.product.price}}</template>
+        </el-table-column>
+        <el-table-column label="剩余数量" width="100" align="center">
+          <template slot-scope="scope">{{scope.row.product.stock}}</template>
+        </el-table-column>
+        <el-table-column label="秒杀价格" width="100" align="center">
+          <template slot-scope="scope">
+            <p v-if="scope.row.flashPromotionPrice!==null">
+              ￥{{scope.row.flashPromotionPrice}}
+            </p>
+          </template>
+        </el-table-column>
+        <el-table-column label="秒杀数量" width="100" align="center">
+          <template slot-scope="scope">{{scope.row.flashPromotionCount}}</template>
+        </el-table-column>
+        <el-table-column label="限购数量" width="100" align="center">
+          <template slot-scope="scope">{{scope.row.flashPromotionLimit}}</template>
+        </el-table-column>
+        <el-table-column label="排序" width="100" align="center">
+          <template slot-scope="scope">{{scope.row.sort}}</template>
+        </el-table-column>
+        <el-table-column label="操作" width="100" align="center">
+          <template slot-scope="scope">
+            <el-button size="mini"
+                       type="text"
+                       @click="handleUpdate(scope.$index, scope.row)">编辑
+            </el-button>
+            <el-button size="mini"
+                       type="text"
+                       @click="handleDelete(scope.$index, scope.row)">删除
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <div class="pagination-container">
+      <el-pagination
+        background
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        layout="total, sizes,prev, pager, next,jumper"
+        :current-page.sync="listQuery.pageNum"
+        :page-size="listQuery.pageSize"
+        :page-sizes="[5,10,15]"
+        :total="total">
+      </el-pagination>
+    </div>
+    <el-dialog title="选择商品" :visible.sync="selectDialogVisible" width="50%">
+      <el-input v-model="dialogData.listQuery.keyword"
+                style="width: 250px;margin-bottom: 20px"
+                size="small"
+                placeholder="商品名称搜索">
+        <el-button slot="append" icon="el-icon-search" @click="handleSelectSearch()"></el-button>
+      </el-input>
+      <el-table :data="dialogData.list"
+                @selection-change="handleDialogSelectionChange" border>
+        <el-table-column type="selection" width="60" align="center"></el-table-column>
+        <el-table-column label="商品名称" align="center">
+          <template slot-scope="scope">{{scope.row.name}}</template>
+        </el-table-column>
+        <el-table-column label="货号" width="160" align="center">
+          <template slot-scope="scope">NO.{{scope.row.productSn}}</template>
+        </el-table-column>
+        <el-table-column label="价格" width="120" align="center">
+          <template slot-scope="scope">￥{{scope.row.price}}</template>
+        </el-table-column>
+      </el-table>
+      <div class="pagination-container">
+        <el-pagination
+          background
+          @size-change="handleDialogSizeChange"
+          @current-change="handleDialogCurrentChange"
+          layout="prev, pager, next"
+          :current-page.sync="dialogData.listQuery.pageNum"
+          :page-size="dialogData.listQuery.pageSize"
+          :page-sizes="[5,10,15]"
+          :total="dialogData.total">
+        </el-pagination>
+      </div>
+      <div style="clear: both;"></div>
+      <div slot="footer">
+        <el-button  size="small" @click="selectDialogVisible = false">取 消</el-button>
+        <el-button  size="small" type="primary" @click="handleSelectDialogConfirm()">确 定</el-button>
+      </div>
+    </el-dialog>
+    <el-dialog title="编辑秒杀商品信息"
+      :visible.sync="editDialogVisible"
+      width="40%">
+      <el-form :model="flashProductRelation"
+               ref="flashProductRelationForm"
+               label-width="150px" size="small">
+        <el-form-item label="商品名称：">
+          <span>{{flashProductRelation.product.name}}</span>
+        </el-form-item>
+        <el-form-item label="货号：">
+          <span>NO.{{flashProductRelation.product.productSn}}</span>
+        </el-form-item>
+        <el-form-item label="商品价格：">
+          <span>￥{{flashProductRelation.product.price}}</span>
+        </el-form-item>
+        <el-form-item label="秒杀价格：">
+          <el-input v-model="flashProductRelation.flashPromotionPrice" class="input-width">
+            <template slot="prepend">￥</template>
+          </el-input>
+        </el-form-item>
+        <el-form-item label="剩余数量：">
+          <span>{{flashProductRelation.product.stock}}</span>
+        </el-form-item>
+        <el-form-item label="秒杀数量：">
+          <el-input v-model="flashProductRelation.flashPromotionCount" class="input-width"></el-input>
+        </el-form-item>
+        <el-form-item label="限购数量：">
+          <el-input v-model="flashProductRelation.flashPromotionLimit" class="input-width"></el-input>
+        </el-form-item>
+        <el-form-item label="排序：">
+          <el-input v-model="flashProductRelation.sort" class="input-width"></el-input>
+        </el-form-item>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="editDialogVisible = false" size="small">取 消</el-button>
+        <el-button type="primary" @click="handleEditDialogConfirm()" size="small">确 定</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+<script>
+  import {fetchList,createFlashProductRelation,deleteFlashProductRelation,updateFlashProductRelation} from '@/api/flashProductRelation';
+  import {fetchList as fetchProductList} from '@/api/product';
+  const defaultListQuery = {
+    pageNum: 1,
+    pageSize: 5,
+    flashPromotionId: null,
+    flashPromotionSessionId: null
+  };
+  export default {
+    name:'flashPromotionProductRelationList',
+    data() {
+      return {
+        listQuery: Object.assign({}, defaultListQuery),
+        list: null,
+        total: null,
+        listLoading: false,
+        dialogVisible: false,
+        selectDialogVisible:false,
+        dialogData:{
+          list: null,
+          total: null,
+          multipleSelection:[],
+          listQuery:{
+            keyword: null,
+            pageNum: 1,
+            pageSize: 5
+          }
+        },
+        editDialogVisible:false,
+        flashProductRelation:{
+          product:{}
+        }
+      }
+    },
+    created(){
+      this.listQuery.flashPromotionId=this.$route.query.flashPromotionId;
+      this.listQuery.flashPromotionSessionId=this.$route.query.flashPromotionSessionId;
+      this.getList();
+    },
+    methods:{
+      handleSizeChange(val) {
+        this.listQuery.pageNum = 1;
+        this.listQuery.pageSize = val;
+        this.getList();
+      },
+      handleCurrentChange(val) {
+        this.listQuery.pageNum = val;
+        this.getList();
+      },
+      handleSelectProduct(){
+        this.selectDialogVisible=true;
+        this.getDialogList();
+      },
+      handleUpdate(index,row){
+        this.editDialogVisible = true;
+        this.flashProductRelation = Object.assign({},row);
+      },
+      handleDelete(index,row){
+        this.$confirm('是否要删除该商品?', '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }).then(() => {
+          deleteFlashProductRelation(row.id).then(response => {
+            this.$message({
+              type: 'success',
+              message: '删除成功!'
+            });
+            this.getList();
+          });
+        });
+      },
+      handleSelectSearch(){
+        this.getDialogList();
+      },
+      handleDialogSizeChange(val) {
+        this.dialogData.listQuery.pageNum = 1;
+        this.dialogData.listQuery.pageSize = val;
+        this.getDialogList();
+      },
+      handleDialogCurrentChange(val) {
+        this.dialogData.listQuery.pageNum = val;
+        this.getDialogList();
+      },
+      handleDialogSelectionChange(val){
+        this.dialogData.multipleSelection = val;
+      },
+      handleSelectDialogConfirm(){
+        if (this.dialogData.multipleSelection < 1) {
+          this.$message({
+            message: '请选择一条记录',
+            type: 'warning',
+            duration: 1000
+          });
+          return;
+        }
+        let selectProducts = [];
+        for (let i = 0; i < this.dialogData.multipleSelection.length; i++) {
+          selectProducts.push({
+            productId:this.dialogData.multipleSelection[i].id,
+            flashPromotionId:this.listQuery.flashPromotionId,
+            flashPromotionSessionId:this.listQuery.flashPromotionSessionId
+          });
+        }
+        this.$confirm('使用要进行添加操作?', '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }).then(() => {
+          createFlashProductRelation(selectProducts).then(response=>{
+            this.selectDialogVisible=false;
+            this.dialogData.multipleSelection=[];
+            this.getList();
+            this.$message({
+              type: 'success',
+              message: '添加成功!'
+            });
+          });
+        });
+      },
+      handleEditDialogConfirm(){
+        this.$confirm('是否要确认?', '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }).then(() => {
+            updateFlashProductRelation(this.flashProductRelation.id,this.flashProductRelation).then(response => {
+              this.$message({
+                message: '修改成功！',
+                type: 'success'
+              });
+              this.editDialogVisible =false;
+              this.getList();
+            })
+        })
+      },
+      getList() {
+        this.listLoading = true;
+        fetchList(this.listQuery).then(response => {
+          this.listLoading = false;
+          this.list = response.data.list;
+          this.total = response.data.total;
+        });
+      },
+      getDialogList(){
+        fetchProductList(this.dialogData.listQuery).then(response=>{
+          this.dialogData.list=response.data.list;
+          this.dialogData.total=response.data.total;
+        })
+      }
+    }
+  }
+</script>
+<style scoped>
+  .operate-container{
+    margin-top: 0;
+  }
+  .input-width{
+    width: 200px;
+  }
+</style>
+
+

src/views/sms/flash/selectSessionList.vue

@@ -0,0 +1,83 @@
+<template> 
+  <div class="app-container">
+    <el-card shadow="never" class="operate-container">
+      <i class="el-icon-tickets"></i>
+      <span>数据列表</span>
+    </el-card>
+    <div class="table-container">
+      <el-table ref="selectSessionTable"
+                :data="list"
+                style="width: 100%;"
+                v-loading="listLoading" border>
+        <el-table-column label="编号" width="100" align="center">
+          <template slot-scope="scope">{{scope.row.id}}</template>
+        </el-table-column>
+        <el-table-column label="秒杀时间段名称" align="center">
+          <template slot-scope="scope">{{scope.row.name}}</template>
+        </el-table-column>
+        <el-table-column label="每日开始时间" align="center">
+          <template slot-scope="scope">{{scope.row.startTime | formatTime}}</template>
+        </el-table-column>
+        <el-table-column label="每日结束时间" align="center">
+          <template slot-scope="scope">{{scope.row.endTime | formatTime}}</template>
+        </el-table-column>
+        <el-table-column label="商品数量" align="center">
+          <template slot-scope="scope">{{scope.row.productCount}}</template>
+        </el-table-column>
+        <el-table-column label="操作" align="center">
+          <template slot-scope="scope">
+            <el-button size="mini"
+                       type="text"
+                       @click="handleShowRelation(scope.$index, scope.row)">商品列表
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+  </div>
+</template>
+<script>
+  import {fetchSelectList} from '@/api/flashSession';
+  import {formatDate} from '@/utils/date';
+  export default {
+    name: 'selectSessionList',
+    data() {
+      return {
+        list: null,
+        listLoading: false
+      }
+    },
+    created() {
+      this.getList();
+    },
+    filters:{
+      formatTime(time) {
+        if (time == null || time === '') {
+          return 'N/A';
+        }
+        let date = new Date(time);
+        return formatDate(date, 'hh:mm:ss')
+      }
+    },
+    methods: {
+      handleShowRelation(index,row){
+        this.$router.push({path:'/sms/flashProductRelation',query:{
+          flashPromotionId:this.$route.query.flashPromotionId, flashPromotionSessionId:row.id}})
+      },
+      getList() {
+        this.listLoading = true;
+        fetchSelectList({flashPromotionId:this.$route.query.flashPromotionId}).then(response => {
+          this.listLoading = false;
+          this.list = response.data;
+        });
+      }
+    }
+  }
+</script>
+<style scoped>
+  .operate-container {
+    margin-top: 0;
+  }
+</style>
+
+