增加台桌管理页面，活动管理页面

src/components/coupon/index.vue

@@ -0,0 +1,183 @@
+<template>
+  <el-dialog title="选择优惠劵" top="5vh" :visible.sync="dialogVisible">
+    <div class="head-container">
+      <el-table ref="table" :data="tableData.list" height="500" v-loading="tableData.loading">
+        <!-- <el-table-column type="selection" width="55" align="center" v-if="!radio"></el-table-column> -->
+        <el-table-column label="名称" prop="title" />
+        <el-table-column label="使用门槛">
+          <template v-slot="scope">
+            {{
+              `满${scope.row.fullAmount}${
+                scope.row.discountAmount ? "减" + scope.row.discountAmount + "元" : ""
+              }`
+            }}
+          </template>
+        </el-table-column>
+        <el-table-column label="总发放数量" prop="number" />
+        <el-table-column label="已使用" prop="useNumber" />
+        <el-table-column label="剩余" prop="leftNumber" />
+        <el-table-column label="操作">
+          <template v-slot="scope">
+            <el-button type="primary" @click="selectHandle(scope.row)">选择</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <el-pagination
+      :total="tableData.total"
+      :current-page="tableData.page + 1"
+      :page-size="tableData.size"
+      @current-change="paginationChange"
+      @size-change="sizeChange"
+      layout="total, sizes, prev, pager, next, jumper"
+    ></el-pagination>
+    <span slot="footer" class="dialog-footer" v-if="!radio">
+      <el-button @click="dialogVisible = false">取 消</el-button>
+      <el-button type="primary" @click="confirmHandle">确 定</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+// import { getTbShopCoupon, delTbShopCoupon } from '@/api/coupon'
+export default {
+  props: {
+    // 是否为单选
+    radio: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  data() {
+    return {
+      dialogVisible: false,
+      searhForm: {
+        name: "",
+        category: "",
+      },
+      categoryList: [],
+      tableData: {
+        page: 0,
+        size: 10,
+        total: 0,
+        loading: false,
+        list: [],
+      },
+      goods: [],
+    };
+  },
+  methods: {
+    // 单选商品
+    selectHandle(row) {
+      this.$emit("success", [{ ...row }]);
+      this.close();
+    },
+    // 确定选商品
+    confirmHandle() {
+      let res = this.$refs.table.selection;
+      this.$emit("success", res);
+      this.close();
+    },
+    // 重置查询
+    resetHandle() {
+      this.searhForm.name = "";
+      this.searhForm.category = "";
+      this.tableData.page = 0;
+      this.tableData.size = 10;
+      this.tableData.list = [];
+      this.getTableData();
+    },
+    // 分页大小改变
+    sizeChange(e) {
+      this.tableData.size = e;
+      this.getTableData();
+    },
+    // 分页回调
+    paginationChange(e) {
+      this.tableData.page = e - 1;
+      this.getTableData();
+    },
+    // 商品列表
+    async getTableData() {
+      this.tableData.loading = true;
+      try {
+        const res = await getTbShopCoupon({
+          page: this.tableData.page,
+          size: this.tableData.size,
+          name: this.searhForm.name,
+          categoryId: this.searhForm.category,
+          shopId: localStorage.getItem("shopId"),
+          sort: "id",
+        });
+        this.tableData.list = res.content;
+        this.tableData.total = res.totalElements;
+
+        if (this.goods.length) {
+          this.$nextTick(() => {
+            this.selection();
+          });
+        }
+        setTimeout(() => {
+          this.tableData.loading = false;
+        }, 500);
+      } catch (error) {
+        console.log(error);
+      }
+    },
+    // 商品分类
+    async tbShopCategoryGet() {
+      try {
+        const res = await getTbShopCoupon({
+          page: 0,
+          size: 100,
+          sort: "id",
+          shopId: localStorage.getItem("shopId"),
+        });
+        this.categoryList = res.content;
+      } catch (error) {
+        console.log(error);
+      }
+    },
+    async show(goods, categoryId) {
+      this.dialogVisible = true;
+      if (goods && goods.length) {
+        this.goods = goods;
+      } else {
+        this.goods = [];
+      }
+      this.resetHandle();
+
+      console.log(categoryId);
+
+      if (categoryId) {
+        this.searhForm.category = categoryId;
+      }
+
+      console.log(this.searhForm);
+    },
+    close() {
+      this.dialogVisible = false;
+    },
+    selection() {
+      this.goods.forEach((row) => {
+        this.tableData.list.forEach((item, index) => {
+          if (row.id == item.id) {
+            this.$refs.table.toggleRowSelection(this.tableData.list[index]);
+          }
+        });
+      });
+    },
+  },
+};
+</script>
+
+<style scoped lang="scss">
+.shop_info {
+  display: flex;
+  align-items: center;
+
+  span {
+    margin-left: 10px;
+  }
+}
+</style>