feat(促销管理): 添加限时直降和第N件优惠功能

manager/src/api/promotion.js

@@ -283,6 +283,12 @@ export const getCouponReceiveList = (params) => {
   return getRequest("/promotion/coupon/received", params);
 };
 
+export const getFlashDiscountList = (params) => getRequest("/promotion/flashDiscount", params);
+export const getFlashDiscountDetail = (id) => getRequest(`/promotion/flashDiscount/${id}`);
+export const updateFlashDiscountStatus = (id, params) => putRequest(`/promotion/flashDiscount/status/${id}`, params);
+export const deleteFlashDiscount = (id) => deleteRequest(`/promotion/flashDiscount/${id}`);
+export const getNthItemDiscountList = (params) => getRequest("/promotion/nthItemDiscount", params);
+
 // 现金礼品卡活动分页
 export const getGiftCardCashActivityPage = (params) => {
   return getRequest("/promotion/giftCardCash/activity", params);

manager/src/router/router.js

@@ -313,6 +313,18 @@ export const otherRouter = {
       name: "full-discount-detail",
       component: () => import("@/views/promotions/full-discount/full-discount-detail.vue")
     },
+    {
+      path: "promotions/flash-discount",
+      title: "限时直降",
+      name: "flash-discount",
+      component: () => import("@/views/promotions/flash-discount/flash-discount.vue")
+    },
+    {
+      path: "promotions/nth-item-discount",
+      title: "第N件优惠",
+      name: "nth-item-discount",
+      component: () => import("@/views/promotions/nth-item-discount/nth-item-discount.vue")
+    },
     {
       path: "promotions/seckill/manager-seckill-add",
       title: "编辑秒杀活动",

manager/src/views/promotions/flash-discount/flash-discount.vue

@@ -0,0 +1,36 @@
+<template>
+  <div>
+    <el-card>
+      <el-form inline @keyup.enter="load">
+        <el-form-item label="活动名称"><el-input v-model="query.promotionName" clearable /></el-form-item>
+        <el-form-item><el-button type="primary" @click="load">搜索</el-button></el-form-item>
+      </el-form>
+    </el-card>
+    <el-card class="mt_10">
+      <el-table v-loading="loading" :data="rows" border>
+        <el-table-column prop="promotionName" label="活动名称" />
+        <el-table-column prop="storeName" label="店铺" />
+        <el-table-column prop="startTime" label="开始" width="170" />
+        <el-table-column prop="endTime" label="结束" width="170" />
+        <el-table-column prop="promotionStatus" label="状态" width="100" />
+      </el-table>
+      <el-pagination class="mt_10" v-model:current-page="query.pageNumber" :total="total" @current-change="load" />
+    </el-card>
+  </div>
+</template>
+<script>
+import { getFlashDiscountList } from "@/api/promotion.js";
+export default {
+  data() { return { loading: false, rows: [], total: 0, query: { pageNumber: 1, pageSize: 20 } }; },
+  mounted() { this.load(); },
+  methods: {
+    load() {
+      this.loading = true;
+      getFlashDiscountList(this.query).then((res) => {
+        this.loading = false;
+        if (res.success) { this.rows = res.result.records; this.total = res.result.total; }
+      });
+    },
+  },
+};
+</script>

manager/src/views/promotions/nth-item-discount/nth-item-discount.vue

@@ -0,0 +1,38 @@
+<template>
+  <div>
+    <el-card>
+      <el-form inline @keyup.enter="load">
+        <el-form-item label="活动名称"><el-input v-model="query.promotionName" clearable /></el-form-item>
+        <el-form-item><el-button type="primary" @click="load">搜索</el-button></el-form-item>
+      </el-form>
+    </el-card>
+    <el-card class="mt_10">
+      <el-table v-loading="loading" :data="rows" border>
+        <el-table-column prop="promotionName" label="活动名称" />
+        <el-table-column prop="storeName" label="店铺" />
+        <el-table-column prop="nthNum" label="第N件" width="80" />
+        <el-table-column prop="discountType" label="优惠方式" width="100" />
+        <el-table-column prop="startTime" label="开始" width="170" />
+        <el-table-column prop="endTime" label="结束" width="170" />
+        <el-table-column prop="promotionStatus" label="状态" width="100" />
+      </el-table>
+      <el-pagination class="mt_10" v-model:current-page="query.pageNumber" :total="total" @current-change="load" />
+    </el-card>
+  </div>
+</template>
+<script>
+import { getNthItemDiscountList } from "@/api/promotion.js";
+export default {
+  data() { return { loading: false, rows: [], total: 0, query: { pageNumber: 1, pageSize: 20 } }; },
+  mounted() { this.load(); },
+  methods: {
+    load() {
+      this.loading = true;
+      getNthItemDiscountList(this.query).then((res) => {
+        this.loading = false;
+        if (res.success) { this.rows = res.result.records; this.total = res.result.total; }
+      });
+    },
+  },
+};
+</script>

seller/src/api/promotion.js

@@ -182,3 +182,18 @@ export const updateFullDiscount = (id, params) => {
 export const getCouponReceiveList = (params) => {
     return getRequest("/promotion/coupon/received", params);
 };
+
+// ========== 限时直降 ==========
+export const getFlashDiscountList = (params) => getRequest('/promotion/flashDiscount', params)
+export const getFlashDiscountDetail = (id) => getRequest(`/promotion/flashDiscount/${id}`)
+export const saveFlashDiscount = (params) => postRequest('/promotion/flashDiscount', params, { 'Content-type': 'application/json' })
+export const editFlashDiscount = (params) => putRequest('/promotion/flashDiscount', params, { 'Content-type': 'application/json' })
+export const deleteFlashDiscount = (id) => deleteRequest(`/promotion/flashDiscount/${id}`)
+export const updateFlashDiscountStatus = (id, params) => putRequest(`/promotion/flashDiscount/status/${id}`, params)
+
+// ========== 第N件优惠 ==========
+export const getNthItemDiscountList = (params) => getRequest('/promotion/nthItemDiscount', params)
+export const getNthItemDiscountDetail = (id) => getRequest(`/promotion/nthItemDiscount/${id}`)
+export const saveNthItemDiscount = (params) => postRequest('/promotion/nthItemDiscount', params, { 'Content-type': 'application/json' })
+export const editNthItemDiscount = (params) => putRequest('/promotion/nthItemDiscount', params, { 'Content-type': 'application/json' })
+export const updateNthItemDiscountStatus = (id, params) => putRequest(`/promotion/nthItemDiscount/status/${id}`, params)

seller/src/router/router.js

@@ -139,6 +139,18 @@ export const otherRouter = {
       name: "full-discount-detail",
       component: () => import("@/views/promotion/full-discount/full-discount-add.vue")
     },
+    {
+      path: "flash-discount-add",
+      title: "限时直降",
+      name: "flash-discount-add",
+      component: () => import("@/views/promotion/flash-discount/flash-discount-add.vue")
+    },
+    {
+      path: "nth-item-discount-add",
+      title: "第N件优惠",
+      name: "nth-item-discount-add",
+      component: () => import("@/views/promotion/nth-item-discount/nth-item-discount-add.vue")
+    },
     {
       path: "export-order-deliver",
       title: "发货",

seller/src/views/promotion/flash-discount/flash-discount-add.vue

@@ -0,0 +1,104 @@
+<template>
+  <div>
+    <el-card>
+      <el-form ref="form" :model="form" label-width="120px">
+        <el-form-item label="活动名称" required>
+          <el-input v-model="form.promotionName" style="width: 320px" />
+        </el-form-item>
+        <el-form-item label="活动时间" required>
+          <el-date-picker v-model="form.rangeTime" type="datetimerange" style="width: 360px" />
+        </el-form-item>
+        <el-form-item label="限购数量">
+          <el-input-number v-model="form.limitNum" :min="0" /> <span class="tip">0 表示不限</span>
+        </el-form-item>
+        <el-form-item label="活动说明">
+          <el-input v-model="form.description" type="textarea" style="width: 360px" />
+        </el-form-item>
+        <el-form-item label="活动商品">
+          <el-button type="primary" @click="openGoods">选择商品</el-button>
+          <el-table v-if="form.promotionGoodsList.length" :data="form.promotionGoodsList" border class="mt_10">
+            <el-table-column prop="goodsName" label="商品" />
+            <el-table-column prop="originalPrice" label="原价" width="100" />
+            <el-table-column label="活动价" width="140">
+              <template #default="{ row }">
+                <el-input-number v-model="row.price" :min="0.01" :precision="2" />
+              </template>
+            </el-table-column>
+          </el-table>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="submit">保存</el-button>
+          <el-button @click="$router.back()">返回</el-button>
+        </el-form-item>
+      </el-form>
+    </el-card>
+    <liliDialog ref="liliDialog" @selectedGoodsData="selectedGoods" />
+  </div>
+</template>
+
+<script>
+import { getFlashDiscountDetail, saveFlashDiscount, editFlashDiscount } from "@/api/promotion.js";
+
+export default {
+  data() {
+    return {
+      form: {
+        promotionName: "",
+        rangeTime: [],
+        limitNum: 0,
+        description: "",
+        scopeType: "PORTION_GOODS",
+        promotionGoodsList: [],
+      },
+    };
+  },
+  mounted() {
+    if (this.$route.query.id) {
+      getFlashDiscountDetail(this.$route.query.id).then((res) => {
+        if (res.success) {
+          Object.assign(this.form, res.result);
+          this.form.rangeTime = [new Date(res.result.startTime), new Date(res.result.endTime)];
+        }
+      });
+    }
+  },
+  methods: {
+    openGoods() {
+      this.$refs.liliDialog.open("goods");
+    },
+    selectedGoods(list) {
+      list.forEach((g) => {
+        if (!this.form.promotionGoodsList.find((i) => i.skuId === g.id)) {
+          this.form.promotionGoodsList.push({
+            skuId: g.id,
+            goodsId: g.goodsId,
+            goodsName: g.goodsName,
+            originalPrice: g.price,
+            price: g.price,
+            quantity: g.quantity,
+          });
+        }
+      });
+    },
+    submit() {
+      const payload = { ...this.form };
+      if (payload.rangeTime && payload.rangeTime.length === 2) {
+        payload.startTime = payload.rangeTime[0];
+        payload.endTime = payload.rangeTime[1];
+      }
+      const req = payload.id ? editFlashDiscount(payload) : saveFlashDiscount(payload);
+      req.then((res) => {
+        if (res.success) {
+          this.$Message.success("保存成功");
+          this.$router.back();
+        }
+      });
+    },
+  },
+};
+</script>
+
+<style scoped>
+.tip { margin-left: 8px; color: #999; }
+.mt_10 { margin-top: 10px; }
+</style>

seller/src/views/promotion/flash-discount/flash-discount.vue

@@ -0,0 +1,111 @@
+<template>
+  <div class="search">
+    <el-card>
+      <el-form ref="searchForm" :model="searchForm" inline label-width="70px" class="search-form" @keyup.enter="handleSearch">
+        <el-form-item label="活动名称" prop="promotionName">
+          <el-input v-model="searchForm.promotionName" placeholder="请输入活动名称" clearable style="width: 240px" />
+        </el-form-item>
+        <el-form-item label="活动状态" prop="promotionStatus">
+          <el-select v-model="searchForm.promotionStatus" placeholder="请选择" clearable style="width: 240px">
+            <el-option label="未开始" value="NEW" />
+            <el-option label="已开始" value="START" />
+            <el-option label="已结束" value="END" />
+            <el-option label="已关闭" value="CLOSE" />
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="handleSearch">搜索</el-button>
+          <el-button type="primary" @click="goAdd">新建活动</el-button>
+        </el-form-item>
+      </el-form>
+    </el-card>
+    <el-card>
+      <el-table v-loading="loading" border :data="data" class="mt_10">
+        <el-table-column prop="promotionName" label="活动名称" min-width="140" />
+        <el-table-column prop="startTime" label="开始时间" width="170" />
+        <el-table-column prop="endTime" label="结束时间" width="170" />
+        <el-table-column label="状态" width="100">
+          <template #default="{ row }">
+            <el-tag :type="statusType(row.promotionStatus)">{{ statusText(row.promotionStatus) }}</el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" width="160" fixed="right">
+          <template #default="{ row }">
+            <a class="link-text" @click="goEdit(row)">编辑</a>
+            <span class="op-split">|</span>
+            <a class="link-text" @click="toggleStatus(row)">关闭</a>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="mt_10" style="display: flex; justify-content: flex-end">
+        <el-pagination
+          v-model:current-page="searchForm.pageNumber"
+          v-model:page-size="searchForm.pageSize"
+          :total="total"
+          layout="total, prev, pager, next"
+          @current-change="getDataList"
+        />
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import { getFlashDiscountList, updateFlashDiscountStatus, getFlashDiscountDetail, saveFlashDiscount, editFlashDiscount } from "@/api/promotion.js";
+
+export default {
+  data() {
+    return {
+      loading: false,
+      total: 0,
+      data: [],
+      searchForm: { pageNumber: 1, pageSize: 20, sort: "createTime", order: "desc" },
+    };
+  },
+  mounted() {
+    this.getDataList();
+  },
+  methods: {
+    statusText(s) {
+      return { NEW: "未开始", START: "进行中", END: "已结束", CLOSE: "已关闭" }[s] || s;
+    },
+    statusType(s) {
+      return { NEW: "info", START: "success", END: "danger", CLOSE: "danger" }[s] || "info";
+    },
+    handleSearch() {
+      this.searchForm.pageNumber = 1;
+      this.getDataList();
+    },
+    getDataList() {
+      this.loading = true;
+      getFlashDiscountList(this.searchForm).then((res) => {
+        this.loading = false;
+        if (res.success) {
+          this.data = res.result.records;
+          this.total = res.result.total;
+        }
+      });
+    },
+    goAdd() {
+      this.$router.push({ name: "flash-discount-add" });
+    },
+    goEdit(row) {
+      this.$router.push({ name: "flash-discount-add", query: { id: row.id } });
+    },
+    toggleStatus(row) {
+      updateFlashDiscountStatus(row.id).then((res) => {
+        if (res.success) {
+          this.$Message.success("操作成功");
+          this.getDataList();
+        }
+      });
+    },
+  },
+};
+</script>
+
+<style scoped>
+.link-text { color: #409eff; cursor: pointer; }
+.op-split { margin: 0 8px; color: #dcdfe6; }
+.mt_10 { margin-top: 10px; }
+</style>

seller/src/views/promotion/nth-item-discount/nth-item-discount-add.vue

@@ -0,0 +1,113 @@
+<template>
+  <div>
+    <el-card>
+      <el-form ref="form" :model="form" label-width="120px">
+        <el-form-item label="活动名称" required>
+          <el-input v-model="form.promotionName" style="width: 320px" />
+        </el-form-item>
+        <el-form-item label="活动时间" required>
+          <el-date-picker v-model="form.rangeTime" type="datetimerange" style="width: 360px" />
+        </el-form-item>
+        <el-form-item label="第N件" required>
+          <el-input-number v-model="form.nthNum" :min="2" />
+          <span class="tip">例如 2 表示第 2 件享受优惠</span>
+        </el-form-item>
+        <el-form-item label="优惠方式" required>
+          <el-select v-model="form.discountType" style="width: 200px">
+            <el-option label="半价" value="HALF" />
+            <el-option label="免单" value="FREE" />
+            <el-option label="打折" value="RATE" />
+          </el-select>
+        </el-form-item>
+        <el-form-item v-if="form.discountType === 'RATE'" label="折扣" required>
+          <el-input-number v-model="form.discountValue" :min="0.1" :max="9.9" :precision="1" />
+          <span class="tip">如 8 表示 8 折</span>
+        </el-form-item>
+        <el-form-item label="活动说明">
+          <el-input v-model="form.description" type="textarea" style="width: 360px" />
+        </el-form-item>
+        <el-form-item label="活动商品">
+          <el-button type="primary" @click="openGoods">选择商品</el-button>
+          <el-table v-if="form.promotionGoodsList.length" :data="form.promotionGoodsList" border class="mt_10">
+            <el-table-column prop="goodsName" label="商品" />
+            <el-table-column prop="originalPrice" label="原价" width="100" />
+          </el-table>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="submit">保存</el-button>
+          <el-button @click="$router.back()">返回</el-button>
+        </el-form-item>
+      </el-form>
+    </el-card>
+    <liliDialog ref="liliDialog" @selectedGoodsData="selectedGoods" />
+  </div>
+</template>
+
+<script>
+import { getNthItemDiscountDetail, saveNthItemDiscount, editNthItemDiscount } from "@/api/promotion.js";
+
+export default {
+  data() {
+    return {
+      form: {
+        promotionName: "",
+        rangeTime: [],
+        nthNum: 2,
+        discountType: "HALF",
+        discountValue: 8,
+        description: "",
+        scopeType: "PORTION_GOODS",
+        promotionGoodsList: [],
+      },
+    };
+  },
+  mounted() {
+    if (this.$route.query.id) {
+      getNthItemDiscountDetail(this.$route.query.id).then((res) => {
+        if (res.success) {
+          Object.assign(this.form, res.result);
+          this.form.rangeTime = [new Date(res.result.startTime), new Date(res.result.endTime)];
+        }
+      });
+    }
+  },
+  methods: {
+    openGoods() {
+      this.$refs.liliDialog.open("goods");
+    },
+    selectedGoods(list) {
+      list.forEach((g) => {
+        if (!this.form.promotionGoodsList.find((i) => i.skuId === g.id)) {
+          this.form.promotionGoodsList.push({
+            skuId: g.id,
+            goodsId: g.goodsId,
+            goodsName: g.goodsName,
+            originalPrice: g.price,
+            price: g.price,
+            quantity: g.quantity,
+          });
+        }
+      });
+    },
+    submit() {
+      const payload = { ...this.form };
+      if (payload.rangeTime && payload.rangeTime.length === 2) {
+        payload.startTime = payload.rangeTime[0];
+        payload.endTime = payload.rangeTime[1];
+      }
+      const req = payload.id ? editNthItemDiscount(payload) : saveNthItemDiscount(payload);
+      req.then((res) => {
+        if (res.success) {
+          this.$Message.success("保存成功");
+          this.$router.back();
+        }
+      });
+    },
+  },
+};
+</script>
+
+<style scoped>
+.tip { margin-left: 8px; color: #999; }
+.mt_10 { margin-top: 10px; }
+</style>

seller/src/views/promotion/nth-item-discount/nth-item-discount.vue

@@ -0,0 +1,118 @@
+<template>
+  <div class="search">
+    <el-card>
+      <el-form ref="searchForm" :model="searchForm" inline label-width="70px" class="search-form" @keyup.enter="handleSearch">
+        <el-form-item label="活动名称" prop="promotionName">
+          <el-input v-model="searchForm.promotionName" placeholder="请输入活动名称" clearable style="width: 240px" />
+        </el-form-item>
+        <el-form-item label="活动状态" prop="promotionStatus">
+          <el-select v-model="searchForm.promotionStatus" placeholder="请选择" clearable style="width: 240px">
+            <el-option label="未开始" value="NEW" />
+            <el-option label="已开始" value="START" />
+            <el-option label="已结束" value="END" />
+            <el-option label="已关闭" value="CLOSE" />
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="handleSearch">搜索</el-button>
+          <el-button type="primary" @click="goAdd">新建活动</el-button>
+        </el-form-item>
+      </el-form>
+    </el-card>
+    <el-card>
+      <el-table v-loading="loading" border :data="data" class="mt_10">
+        <el-table-column prop="promotionName" label="活动名称" min-width="140" />
+        <el-table-column prop="nthNum" label="第N件" width="80" />
+        <el-table-column label="优惠方式" width="100">
+          <template #default="{ row }">{{ discountTypeText(row.discountType) }}</template>
+        </el-table-column>
+        <el-table-column prop="startTime" label="开始时间" width="170" />
+        <el-table-column prop="endTime" label="结束时间" width="170" />
+        <el-table-column label="状态" width="100">
+          <template #default="{ row }">
+            <el-tag :type="statusType(row.promotionStatus)">{{ statusText(row.promotionStatus) }}</el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" width="160" fixed="right">
+          <template #default="{ row }">
+            <a class="link-text" @click="goEdit(row)">编辑</a>
+            <span class="op-split">|</span>
+            <a class="link-text" @click="toggleStatus(row)">关闭</a>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="mt_10" style="display: flex; justify-content: flex-end">
+        <el-pagination
+          v-model:current-page="searchForm.pageNumber"
+          v-model:page-size="searchForm.pageSize"
+          :total="total"
+          layout="total, prev, pager, next"
+          @current-change="getDataList"
+        />
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import { getNthItemDiscountList, updateNthItemDiscountStatus } from "@/api/promotion.js";
+
+export default {
+  data() {
+    return {
+      loading: false,
+      total: 0,
+      data: [],
+      searchForm: { pageNumber: 1, pageSize: 20, sort: "createTime", order: "desc" },
+    };
+  },
+  mounted() {
+    this.getDataList();
+  },
+  methods: {
+    statusText(s) {
+      return { NEW: "未开始", START: "进行中", END: "已结束", CLOSE: "已关闭" }[s] || s;
+    },
+    statusType(s) {
+      return { NEW: "info", START: "success", END: "danger", CLOSE: "danger" }[s] || "info";
+    },
+    discountTypeText(t) {
+      return { HALF: "半价", FREE: "免单", RATE: "打折" }[t] || t;
+    },
+    handleSearch() {
+      this.searchForm.pageNumber = 1;
+      this.getDataList();
+    },
+    getDataList() {
+      this.loading = true;
+      getNthItemDiscountList(this.searchForm).then((res) => {
+        this.loading = false;
+        if (res.success) {
+          this.data = res.result.records;
+          this.total = res.result.total;
+        }
+      });
+    },
+    goAdd() {
+      this.$router.push({ name: "nth-item-discount-add" });
+    },
+    goEdit(row) {
+      this.$router.push({ name: "nth-item-discount-add", query: { id: row.id } });
+    },
+    toggleStatus(row) {
+      updateNthItemDiscountStatus(row.id).then((res) => {
+        if (res.success) {
+          this.$Message.success("操作成功");
+          this.getDataList();
+        }
+      });
+    },
+  },
+};
+</script>
+
+<style scoped>
+.link-text { color: #409eff; cursor: pointer; }
+.op-split { margin: 0 8px; color: #dcdfe6; }
+.mt_10 { margin-top: 10px; }
+</style>