diff --git a/src/api/account/table.ts b/src/api/account/table.ts
index 0991f28..7e3b3ca 100644
--- a/src/api/account/table.ts
+++ b/src/api/account/table.ts
@@ -34,7 +34,7 @@ const API = {
   delete(id: number | string) {
     return request({
       url: `${baseURL}`,
-      method: "post",
+      method: "delete",
       data: { id },
     });
   }
diff --git a/src/components/coupon/index.vue b/src/components/coupon/index.vue
new file mode 100644
index 0000000..b2c65e2
--- /dev/null
+++ b/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>
\ No newline at end of file
diff --git a/src/main.ts b/src/main.ts
index b14ea03..a358819 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -8,6 +8,8 @@ import "element-plus/theme-chalk/dark/css-vars.css";
 // 暗黑模式自定义变量
 import "@/styles/dark/css-vars.css";
 import "@/styles/index.scss";
+//辅助工具类
+import "@/styles/util.scss";
 import "uno.css";
 // 自动为某些默认事件（如 touchstart、wheel 等）添加 { passive: true },提升滚动性能并消除控制台的非被动事件监听警告
 import "default-passive-events";
diff --git a/src/styles/util.scss b/src/styles/util.scss
new file mode 100644
index 0000000..4f2478a
--- /dev/null
+++ b/src/styles/util.scss
@@ -0,0 +1,384 @@
+.u-relative,
+.u-rela,
+.relative {
+	position: relative;
+}
+
+.u-absolute,
+.u-abso,
+.absolute {
+	position: absolute;
+}
+
+.u-fixed,
+.u-fix {
+	position: fixed;
+}
+
+// nvue不能用标签命名样式，不能放在微信组件中，否则微信开发工具会报警告，无法使用标签名当做选择器
+/* #ifndef APP-NVUE */
+image {
+	display: inline-block;
+}
+
+// 在weex，也即nvue中，所有元素默认为border-box
+view,
+text {
+	box-sizing: border-box;
+}
+
+/* #endif */
+
+.u-font-xs {
+	font-size: 11px;
+}
+
+.u-font-sm {
+	font-size: 13px;
+}
+
+.u-font-md {
+	font-size: 14px;
+}
+
+.u-font-lg {
+	font-size: 15px;
+}
+
+.u-font-xl {
+	font-size: 17px;
+}
+
+.flex {
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+}
+
+.u-flex {
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+}
+
+.u-flex-wrap {
+	flex-wrap: wrap;
+}
+
+.u-flex-nowrap {
+	flex-wrap: nowrap;
+}
+
+.free-price {
+	text-decoration: line-through;
+	color: #999;
+}
+.cur-pointer{
+	cursor: pointer;
+}
+.u-col-center {
+	align-items: center;
+}
+
+.u-col-top {
+	align-items: flex-start;
+}
+
+.u-col-bottom {
+	align-items: flex-end;
+}
+
+.u-row-center {
+	justify-content: center;
+}
+
+.u-row-left {
+	justify-content: flex-start;
+}
+
+.u-row-right {
+	justify-content: flex-end;
+}
+
+.u-row-between {
+	justify-content: space-between;
+}
+
+.u-row-around {
+	justify-content: space-around;
+}
+
+.u-text-left {
+	text-align: left;
+}
+
+.u-text-center {
+	text-align: center;
+}
+
+.u-text-right {
+	text-align: right;
+}
+
+.u-flex-col {
+	display: flex;
+	flex-direction: column;
+}
+
+// 定义flex等分
+@for $i from 0 through 12 {
+	.u-flex-#{$i} {
+		flex: $i;
+	}
+}
+
+// 定义字体(px)单位，小于20都为px单位字体
+@for $i from 9 to 20 {
+	.u-font-#{$i} {
+		font-size: $i + px;
+	}
+}
+
+// 定义字体(rpx)单位，大于或等于20的都为rpx单位字体
+@for $i from 20 through 40 {
+	.u-font-#{$i} {
+		font-size: $i + px;
+	}
+}
+
+// 定义内外边距，历遍1-80
+@for $i from 0 through 80 {
+
+	// 只要双数和能被5除尽的数
+	@if $i % 2==0 or $i % 5==0 {
+
+		// 得出：u-margin-30或者u-m-30
+		.u-margin-#{$i},
+		.u-m-#{$i} {
+			margin: $i + px !important;
+		}
+
+		// 得出：u-padding-30或者u-p-30
+		.u-padding-#{$i},
+		.u-p-#{$i} {
+			padding: $i + px !important;
+		}
+
+		@each $short, $long in l left, t top, r right, b bottom {
+
+			// 缩写版，结果如： u-m-l-30
+			// 定义外边距
+			.u-m-#{$short}-#{$i} {
+				margin-#{$long}: $i + px !important;
+			}
+
+			// 定义内边距
+			.u-p-#{$short}-#{$i} {
+				padding-#{$long}: $i + px !important;
+			}
+
+			// 完整版，结果如：u-margin-left-30
+			// 定义外边距
+			.u-margin-#{$long}-#{$i} {
+				margin-#{$long}: $i + px !important;
+			}
+
+			// 定义内边距
+			.u-padding-#{$long}-#{$i} {
+				padding-#{$long}: $i + px !important;
+			}
+		}
+	}
+}
+
+// 重置nvue的默认关于flex的样式
+.u-reset-nvue {
+	flex-direction: row;
+	align-items: center;
+}
+
+/* start--文本行数限制--start */
+.u-line-1 {
+	overflow: hidden;
+	white-space: nowrap;
+	text-overflow: ellipsis;
+}
+
+.u-line-2 {
+	-webkit-line-clamp: 2;
+}
+
+.u-line-3 {
+	-webkit-line-clamp: 3;
+}
+
+.u-line-4 {
+	-webkit-line-clamp: 4;
+}
+
+.u-line-5 {
+	-webkit-line-clamp: 5;
+}
+
+.u-line-2,
+.u-line-3,
+.u-line-4,
+.u-line-5 {
+	overflow: hidden;
+	word-break: break-all;
+	text-overflow: ellipsis;
+	display: -webkit-box; // 弹性伸缩盒
+	-webkit-box-orient: vertical; // 设置伸缩盒子元素排列方式
+}
+
+/* end--文本行数限制--end */
+
+
+/* start--不同颜色文字--start */
+.color-333 {
+	color: #333;
+}
+
+.color-666 {
+	color: #666;
+}
+
+.color-999 {
+	color: #999;
+}
+
+.color-red {
+	color: rgb(250, 85, 85);
+}
+
+
+/* end--不同颜色文字--end */
+
+.tranistion {
+	transition: all .3s ease-in-out;
+}
+
+.tranistion-1 {
+	transition: all .1s ease-in-out;
+}
+
+.tranistion-2 {
+	transition: all .2s ease-in-out;
+}
+
+.font-bold {
+	font-weight: 700;
+}
+
+.font-600 {
+	font-weight: 600;
+}
+
+.bg-gray {
+	background-color: #F9F9F9;
+}
+
+.w-full {
+	width: 100%;
+}
+
+.gap-10 {
+	gap: 10px;
+}
+
+.gap-20 {
+	gap: 20px;
+}
+
+.color-aaa {
+	color: #aaa;
+}
+
+.color-000 {
+	color: #000;
+}
+
+.color-fff {
+	color: #fff;
+}
+
+.bg-fff {
+	background-color: #fff;
+}
+
+.bg-gray {
+	background-color: #F9F9F9;
+}
+
+.overflow-hide {
+	overflow: hidden;
+}
+
+.no-wrap {
+	white-space: nowrap;
+}
+
+.border-r-12 {
+	border-radius: 12px;
+}
+
+.border-r-18 {
+	border-radius: 18px;
+}
+
+.border-top {
+	border-top: 1px solid #E5E5E5;
+}
+
+.border-bottom {
+	border-bottom: 1px solid #E5E5E5;
+}
+
+.scale7 {
+	transform: scale(0.7);
+}
+
+.position-all {
+	left: 0;
+	right: 0;
+	top: 0;
+	bottom: 0;
+}
+
+.lh16 {
+	line-height: 16px;
+}
+
+.default-box-padding {
+	padding: 16px 14px;
+}
+
+.zIndex-999 {
+	z-index: 999;
+}
+
+.icon-default-size {
+	width: 14px;
+	height: 14px;
+}
+
+.filter-gray {
+	filter: grayscale(1);
+}
+.youhui-tips.el-tooltip__popper {
+	background: #fff;
+	min-width: 150px;
+	border-radius: 4px;
+	border: 1px solid #ebeef5 !important;
+	padding: 12px;
+	color: #606266;
+	line-height: 1.4;
+	text-align: justify;
+	font-size: 14px;
+	box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+	word-break: break-all;
+  }
+  .youhui-tips.el-tooltip__popper[x-placement^="top"] .popper__arrow:after,
+  .youhui-tips.el-tooltip__popper[x-placement^="top"] .popper__arrow {
+  border-top-color: #fff;
+}
\ No newline at end of file
diff --git a/src/utils/request.ts b/src/utils/request.ts
index b095c7d..a7cc189 100644
--- a/src/utils/request.ts
+++ b/src/utils/request.ts
@@ -8,7 +8,7 @@ import router from "@/router";
 const service = axios.create({
   baseURL: import.meta.env.VITE_APP_BASE_API,
   timeout: 50000,
-  headers: { "Content-Type": "application/json;charset=utf-8" },
+  headers: { "Content-Type": "application/json;charset=utf-8", platformType: 'WEB' },
   paramsSerializer: (params) => qs.stringify(params),
 });
 
diff --git a/src/views/tool/table/components/addEara.vue b/src/views/tool/table/components/addEara.vue
index 58a9afc..b8902e4 100644
--- a/src/views/tool/table/components/addEara.vue
+++ b/src/views/tool/table/components/addEara.vue
@@ -1,73 +1,82 @@
 <template>
-    <el-dialog :title="form.id ? '编辑区域' : '添加区域'" :visible.sync="dialogVisible" @close="reset">
-        <el-form ref="form" :model="form" :rules="rules" label-width="120px" label-position="left">
-            <el-form-item label="区域名称" prop="name">
-                <el-input v-model="form.name" placeholder="请输入区域名称"></el-input>
-            </el-form-item>
-        </el-form>
-        <span slot="footer" class="dialog-footer">
-            <el-button @click="dialogVisible = false">取 消</el-button>
-            <el-button type="primary" @click="onSubmitHandle">确 定</el-button>
-        </span>
-    </el-dialog>
+  <el-dialog :title="form.id ? '编辑区域' : '添加区域'" v-model="dialogVisible" @close="reset">
+    <el-form ref="refForm" :model="form" :rules="rules" label-width="120px" label-position="left">
+      <el-form-item label="区域名称" prop="name">
+        <el-input v-model="form.name" placeholder="请输入区域名称"></el-input>
+      </el-form-item>
+      <el-form-item label="排序" prop="sort">
+        <el-input-number v-model="form.sort" placeholder="请输入排序"></el-input-number>
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button @click="dialogVisible = false">取 消</el-button>
+        <el-button type="primary" @click="onSubmitHandle">确 定</el-button>
+      </span>
+    </template>
+  </el-dialog>
 </template>
 
-<script>
-import { tbShopArea } from '@/api/table'
-export default {
-    data() {
-        return {
-            dialogVisible: false,
-            form: {
-                id: '',
-                name: ''
-            },
-            rules: {
-                name: [
-                    {
-                        required: true,
-                        message: '请输入区域名称',
-                        trigger: 'blur'
-                    }
-                ]
-            }
-        }
+<script setup>
+import APi from "@/api/account/shopArea";
+
+let dialogVisible = ref(false);
+const form = reactive({
+  name: "",
+});
+const rules = reactive({
+  name: [
+    {
+      required: true,
+      message: "请输入区域名称",
+      trigger: "blur",
     },
-    methods: {
-        onSubmitHandle() {
-            this.$refs.form.validate(async valid => {
-                if (valid) {
-                    try {
-                        let res = await tbShopArea({
-                            ...this.form,
-                            shopId: localStorage.getItem('shopId')
-                        }, this.form.id ? 'put' : 'post')
-                        this.$emit('success', res)
-                        this.close()
-                        this.$notify({
-                            title: '成功',
-                            message: `${this.form.id ? '编辑' : '添加'}成功`,
-                            type: 'success'
-                        });
-                    } catch (error) {
-                        console.log(error)
-                    }
-                }
-            })
-        },
-        show(obj) {
-            this.dialogVisible = true
-            if (obj && obj.id) {
-                this.form = JSON.parse(JSON.stringify(obj))
-            }
-        },
-        close() {
-            this.dialogVisible = false
-        },
-        reset() {
-            this.form.id = ''
-            this.form.name = ''
-        }
+  ],
+  sort: [
+    {
+      required: true,
+      message: "请输入排序",
+      trigger: "blur",
+    },
+  ],
+});
+
+const emits = defineEmits(["success"]);
+const refForm = ref(null);
+function onSubmitHandle() {
+  refForm.value.validate(async (valid) => {
+    if (valid) {
+      try {
+        let res = !form.id ? await APi.add(form) : await APi.edit(form);
+        emits("success", res);
+        close();
+        ElNotification({
+          title: "成功",
+          message: `${form.id ? "编辑" : "添加"}成功`,
+          type: "success",
+        });
+      } catch (error) {
+        console.log(error);
+      }
     }
+  });
 }
+function show(obj) {
+  dialogVisible.value = true;
+  if (obj && obj.id) {
+    Object.assign(form, obj);
+  }
+}
+function close() {
+  dialogVisible.value = false;
+}
+function reset() {
+  form.id = "";
+  form.name = "";
+  form.sort = "";
+}
+defineExpose({
+  show,
+  close,
+});
 </script>
\ No newline at end of file
diff --git a/src/views/tool/table/components/addTable.vue b/src/views/tool/table/components/addTable.vue
index feb542f..719066e 100644
--- a/src/views/tool/table/components/addTable.vue
+++ b/src/views/tool/table/components/addTable.vue
@@ -1,21 +1,13 @@
 <template>
   <el-dialog
     :title="form.id ? '编辑台桌' : '添加台桌'"
-    :visible.sync="dialogVisible"
+    v-model="dialogVisible"
     @open="tbShopAreaGet"
     @close="reset"
   >
-    <el-form
-      ref="form"
-      :model="form"
-      :rules="rules"
-      label-width="120px"
-      label-position="left"
-    >
+    <el-form ref="refForm" :model="form" :rules="rules" label-width="120px" label-position="left">
       <el-form-item label="选择区域" prop="areaId">
-        <el-select v-model="form.areaId" placeholder="请选择区域"
-        @change="selectChange($event, 'form' , 'areaId')"
-        >
+        <el-select v-model="form.areaId" placeholder="请选择区域">
           <el-option
             :label="item.name"
             :value="item.id"
@@ -34,202 +26,172 @@
           ></el-option>
         </el-select>
       </el-form-item>
-      <el-form-item label="台桌标识"  prop="sign">
+      <el-form-item label="台桌标识" prop="sign" v-if="!form.id">
         <div class="u-flex">
-            <div class="u-flex" style="width: 57px;">
-                  <el-input
-              v-model="form.sign"
-              placeholder="A"
-            ></el-input>
-            </div>
-      
-          <div class="u-flex u-m-l-30" >
-            <div class="u-flex">
-                <div class="u-m-r-4">起始</div>
-                <el-input v-model="form.start" style="width: 57px;" placeholder="请输入起始值" >
-          </el-input>
+          <div class="u-flex" style="width: 57px">
+            <el-input v-model="form.sign" placeholder="A"></el-input>
+          </div>
 
+          <div class="u-flex u-m-l-30">
+            <div class="u-flex">
+              <div class="u-m-r-4">起始</div>
+              <el-input
+                v-model="form.start"
+                style="width: 57px"
+                placeholder="请输入起始值"
+              ></el-input>
+            </div>
+
+            <div
+              style="background-color: #d9d9d9; height: 1px; width: 32px; border-radius: 1px"
+              class="u-m-l-16 u-m-r-16"
+            ></div>
+            <div class="u-flex">
+              <span class="u-m-r-4">结束</span>
+              <el-input
+                v-model="form.end"
+                style="width: 57px"
+                placeholder="请输入结束值"
+              ></el-input>
             </div>
-           
-          <div
-            style="
-              background-color: #D9D9D9;
-              height: 1px;
-              width: 32px;
-              border-radius: 1px;
-            "
-            class="u-m-l-16 u-m-r-16"
-          ></div>
-          <div class="u-flex">
-            <span class="u-m-r-4">结束</span>
-            <el-input v-model="form.end" style="width: 57px;" placeholder="请输入结束值">
-                
-          </el-input>
           </div>
-       
-          </div>
-       
         </div>
       </el-form-item>
+      <el-form-item label="台桌名称" prop="name" v-if="form.id">
+        <el-input v-model="form.name" placeholder="请输入台桌名称"></el-input>
+      </el-form-item>
       <el-form-item label="客座数">
         <el-input-number
-          v-model="form.capacity"
+          v-model="form.maxCapacity"
           :min="0"
           controls-position="right"
         ></el-input-number>
       </el-form-item>
       <el-form-item label="清台管理">
         <el-radio-group v-model="form.autoClear">
-          <el-radio-button :label="0">手动清台</el-radio-button>
-          <el-radio-button :label="1">自动清台</el-radio-button>
+          <el-radio-button :value="0">手动清台</el-radio-button>
+          <el-radio-button :value="1">自动清台</el-radio-button>
         </el-radio-group>
       </el-form-item>
-      <el-form-item label="网络预定开关">
-        <el-switch
-          v-model="form.isPredate"
-          :active-value="1"
-          :inactive-value="2"
-        ></el-switch>
+      <el-form-item v-if="form.id" label="网络预定开关">
+        <el-switch v-model="form.isPredate" :active-value="1" :inactive-value="2"></el-switch>
       </el-form-item>
-      <el-form-item label="类型">
-        <el-radio-group v-model="form.type">
-          <el-radio-button :label="0">低消</el-radio-button>
-          <el-radio-button :label="2">计时</el-radio-button>
-        </el-radio-group>
-      </el-form-item>
-      <el-form-item label="最低消费" v-if="form.type == 0">
+      <el-form-item v-if="form.id" label="网络预定台桌支付金额">
         <el-input-number
-          v-model="form.amount"
-          :min="0"
-          controls-position="right"
-        ></el-input-number>
-      </el-form-item>
-      <el-form-item label="每小时收费" v-if="form.type == 2">
-        <el-input-number
-          v-model="form.perhour"
+          v-model="form.predateAmount"
           :min="0"
           controls-position="right"
         ></el-input-number>
       </el-form-item>
     </el-form>
-    <span slot="footer" class="dialog-footer">
-      <el-button @click="dialogVisible = false">取 消</el-button>
-      <el-button type="primary" :loading="loading" @click="onSubmitHandle"
-        >确 定</el-button
-      >
-    </span>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button @click="close">取 消</el-button>
+        <el-button type="primary" :loading="loading" @click="onSubmitHandle">确 定</el-button>
+      </span>
+    </template>
   </el-dialog>
 </template>
 
-<script>
-import { tbShopTable, tbShopAreaGet ,$fastCreateTable} from "@/api/table";
-export default {
-  data() {
-    return {
-      dialogVisible: false,
-      resetForm: "",
-      loading: false,
-      status: [
-        { value: "pending", name: "挂单中" },
-        { value: "using", name: "开台中" },
-        { value: "paying", name: "结算中" },
-        { value: "idle", name: "空闲" },
-        { value: "subscribe", name: "预定" },
-        { value: "closed", name: "关台" },
-        // {value:'opening',name:'开台中'},
-        { value: "cleaning", name: "台桌清理中" },
-      ],
-      form: {
-        id: "",
-        areaId: "",
-        sign:'',
-        start:1,
-        end:10,
-        capacity: 0,
-        isPredate: 1,
-        type: 2,
-        perhour: 0,
-        amount: 0,
-        autoClear: 1,
-      },
-      rules: {
-        areaId: [
-          {
-            required: true,
-            message: "请选择区域",
-            trigger: ["blur","change"],
-          },
-        ],
-        sign: [
-          {
-            required: true,
-            message: "请输入台桌标识",
-            trigger: ["blur","change"],
-          },
-        ],
-      },
-      areaList: [],
-    };
-  },
-  mounted() {
-    this.resetForm = { ...this.form };
-  },
-  methods: {
-    //解决selectc值改变后未验证问题
-    selectChange($event, ref, type) {
-      this.$refs[ref][0].validateField(type)
+<script setup>
+import shopAreaApi from "@/api/account/shopArea";
+import tableApi from "@/api/account/table";
+let dialogVisible = ref(false);
+let resetForm = {};
+let loading = ref(false);
+let status = [
+  { value: "pending", name: "挂单中" },
+  { value: "using", name: "开台中" },
+  { value: "paying", name: "结算中" },
+  { value: "idle", name: "空闲" },
+  { value: "subscribe", name: "预定" },
+  { value: "closed", name: "关台" },
+  // {value:'opening',name:'开台中'},
+  { value: "cleaning", name: "台桌清理中" },
+];
+
+const form = reactive({
+  areaId: "",
+  sign: "",
+  start: 1,
+  end: 10,
+  maxCapacity: 0,
+  autoClear: 1,
+  isPredate: "",
+  predateAmount: "",
+});
+const rules = {
+  areaId: [
+    {
+      required: true,
+      message: "请选择区域",
+      trigger: ["blur", "change"],
     },
-    onSubmitHandle() {
-      this.$refs.form.validate(async (valid) => {
-        if (valid) {
-          this.loading = true;
-          try {
-            let res = await $fastCreateTable(
-              {
-                ...this.form,
-                qrcode: this.form.tableId,
-                shopId: localStorage.getItem("shopId"),
-              },
-              this.form.id ? "put" : "post"
-            );
-            this.$emit("success", res);
-            this.close();
-            this.$notify({
-              title: "成功",
-              message: `${this.form.id ? "编辑" : "添加"}成功`,
-              type: "success",
-            });
-            this.loading = false;
-          } catch (error) {
-            this.loading = false;
-            console.log(error);
-          }
-        }
-      });
+  ],
+  sign: [
+    {
+      required: true,
+      message: "请输入台桌标识",
+      trigger: ["blur", "change"],
     },
-    show(obj) {
-      this.dialogVisible = true;
-      if (obj && obj.id) {
-        this.form = JSON.parse(JSON.stringify(obj));
-      }
-    },
-    close() {
-      this.dialogVisible = false;
-    },
-    reset() {
-      this.form = { ...this.resetForm };
-    },
-    // 获取区域
-    async tbShopAreaGet() {
+  ],
+};
+let areaList = ref([]);
+onMounted(() => {
+  resetForm = { ...form };
+});
+
+//解决selectc值改变后未验证问题
+const refForm = ref(null);
+const emits = defineEmits(["success"]);
+function onSubmitHandle() {
+  refForm.value.validate(async (valid) => {
+    if (valid) {
+      loading.value = true;
       try {
-        const { content } = await tbShopAreaGet({
-          shopId: localStorage.getItem("shopId"),
+        let res = form.id ? await tableApi.edit(form) : await tableApi.add(form);
+        console.log(res);
+        emits("success", res);
+        close();
+        ElNotification({
+          title: "成功",
+          message: `${form.id ? "编辑" : "添加"}成功`,
+          type: "success",
         });
-        this.areaList = content;
+        loading.value = false;
       } catch (error) {
+        loading.value = false;
         console.log(error);
       }
-    },
-  },
-};
+    }
+  });
+}
+function show(obj) {
+  dialogVisible.value = true;
+  if (obj && obj.id) {
+    Object.assign(form, obj);
+  }
+}
+function close() {
+  dialogVisible.value = false;
+}
+function reset() {
+  delete form.id;
+  Object.assign(form, resetForm);
+  console.log(form);
+}
+// 获取区域
+async function tbShopAreaGet() {
+  try {
+    const data = await shopAreaApi.getList({});
+    areaList.value = data.records;
+  } catch (error) {
+    console.log(error);
+  }
+}
+
+defineExpose({
+  show,
+  close,
+});
 </script>
\ No newline at end of file
diff --git a/src/views/tool/table/index.vue b/src/views/tool/table/index.vue
index 41a40c8..f1c28a6 100644
--- a/src/views/tool/table/index.vue
+++ b/src/views/tool/table/index.vue
@@ -1 +1,497 @@
-<template></template>
\ No newline at end of file
+<template>
+  <div class="app-container">
+    <el-tabs v-model="tableArea.tabsSel" type="card" @tab-click="tabClick">
+      <el-tab-pane label="全部" name="" />
+      <el-tab-pane
+        v-for="item in tableArea.tabs"
+        :key="item.id"
+        :label="item.name"
+        :name="`${item.id}`"
+      >
+        <template #label>
+          <div class="">
+            <span>
+              {{ item.name }}
+            </span>
+            <el-icon style="margin: 0 10px" @click="addEaraShow(item)"><EditPen /></el-icon>
+            <el-popconfirm title="确定删除吗？" @confirm="delArea(item.id)">
+              <template #reference>
+                <el-icon><Delete /></el-icon>
+              </template>
+            </el-popconfirm>
+          </div>
+        </template>
+      </el-tab-pane>
+    </el-tabs>
+
+    <div class="">
+      <el-button icon="plus" @click="addEaraShow()">添加区域</el-button>
+      <el-button type="primary" icon="plus" @click="addTableShow()">添加台桌</el-button>
+      <el-button type="primary" icon="download" @click="downloadTableCpde">下载桌台码</el-button>
+      <el-button type="primary" icon="download" @click="downloadShopCpde">下载店铺码</el-button>
+    </div>
+
+    <div class="u-flex u-p-b-15 u-font-14 u-m-t-16">
+      <div v-for="(item, key) in status" :key="key" class="state u-m-r-24">
+        <span
+          class="dot"
+          :style="{
+            backgroundColor: status[key] ? status[key].type : '',
+          }"
+        />
+        {{ item.label }}
+      </div>
+    </div>
+
+    <!-- 列表 -->
+    <div class="head-container">
+      <div v-loading="loading" class="table_list">
+        <div
+          v-for="item in tableList"
+          :key="item.id"
+          class="item"
+          :style="{ 'background-color': status[item.status].type }"
+        >
+          <div class="new-top flex u-row-between">
+            <div class="u-flex u-flex-1 u-p-r-10">
+              <span class="name u-line-1" style="max-width: 50px">
+                {{ item.name }}
+              </span>
+              <span class="u-font-14 u-line-1">丨{{ areaMap[item.areaId] || "" }}</span>
+            </div>
+            <el-dropdown trigger="click" @command="tableComman($event, item)">
+              <el-icon color="#fff" class="cur-pointer"><More /></el-icon>
+              <template #dropdown>
+                <el-dropdown-menu>
+                  <el-dropdown-item command="edit">
+                    <i class="i el-icon-edit" />
+                    <span>编辑</span>
+                  </el-dropdown-item>
+                  <el-dropdown-item command="del">
+                    <i class="i el-icon-delete" />
+                    <span>删除</span>
+                  </el-dropdown-item>
+                </el-dropdown-menu>
+              </template>
+            </el-dropdown>
+          </div>
+          <div class="box">
+            <div class="top">
+              <div v-if="item.status == 'subscribe'">
+                <div class="row row1" style="align-items: flex-start">
+                  <span style="font-size: 14px; color: #333">
+                    {{ item.bookingInfo.createUserName }}订{{ item.bookingInfo.bookingPerson }}「{{
+                      item.bookingInfo.gender == 1 ? "先生" : "女士"
+                    }}」
+                  </span>
+                  <div
+                    class="state"
+                    style="font-size: 12px; color: #666; display: flex; align-items: center"
+                  >
+                    <img
+                      style="width: 16px; height: 16px; filter: contrast(0.5)"
+                      src="@/assets/images/perpole.png"
+                      alt=""
+                    />
+
+                    {{ item.bookingInfo.bookingTime.substring(11, 19) }}
+                  </div>
+                </div>
+                <div class="row">
+                  <span style="font-size: 14px; color: #333; margin-top: 5px">
+                    {{ item.bookingInfo.phoneNumber }}
+                  </span>
+                </div>
+              </div>
+
+              <div v-else class="u-font-18 font-600 total-price">
+                <span
+                  v-if="item.status == 'using'"
+                  class="cur-pointer"
+                  @click="diancanShow(item, 'isAddGoods')"
+                >
+                  ¥{{ item.totalAmount || 0 }}「{{ item.productNum }}件」
+                </span>
+                <!-- <span v-else class="color-fff">|</span> -->
+              </div>
+              <div class="row btn-group" style="margin-top: 10px">
+                <template v-if="item.status == 'subscribe'">
+                  <el-button
+                    type="success"
+                    :disabled="!item.tableId || item.status === 'closed'"
+                    @click="markStatus(item, -1)"
+                  >
+                    取消预约
+                  </el-button>
+                </template>
+                <template v-if="item.status == 'subscribe' && item.bookingInfo.status == 20">
+                  <el-button
+                    type="success"
+                    :disabled="!item.tableId || item.status === 'closed'"
+                    @click="markStatus(item, 10)"
+                  >
+                    到店
+                  </el-button>
+                </template>
+                <template
+                  v-if="
+                    item.status == 'idle' ||
+                    (item.status == 'subscribe' && item.bookingInfo.status == 10)
+                  "
+                >
+                  <el-button
+                    type="primary"
+                    :disabled="!item.tableId || item.status === 'closed'"
+                    @click="diancanShow(item)"
+                  >
+                    点餐
+                  </el-button>
+                </template>
+                <template v-else-if="item.status != 'idle' && item.status != 'subscribe'">
+                  <template v-if="item.status == 'using'">
+                    <el-button
+                      :disabled="!item.tableId || item.status === 'closed'"
+                      @click="diancanShow(item, 'isAddGoods')"
+                    >
+                      加菜
+                    </el-button>
+                    <el-button
+                      type="danger"
+                      :disabled="!item.tableId || item.status === 'closed'"
+                      @click="diancanShow(item, 'isPayOrder')"
+                    >
+                      结账
+                    </el-button>
+                  </template>
+                  <template v-else-if="item.status == 'closed'">
+                    <el-button type="info" disabled>已关台</el-button>
+                  </template>
+                  <template v-else-if="item.status == 'cleaning'">
+                    <el-button
+                      type="info"
+                      :style="{
+                        backgroundColor: status[item.status].type,
+                        borderColor: status[item.status].type,
+                      }"
+                      @click="cleanTableHandle(item)"
+                    >
+                      清台
+                    </el-button>
+                  </template>
+                  <template v-else>
+                    <el-button type="info" disabled>点餐</el-button>
+                  </template>
+                </template>
+              </div>
+            </div>
+            <div
+              class="u-flex u-col-bottom bottom u-row-between color-666"
+              :class="{ 'opacity-0': item.status == 'closed' }"
+            >
+              <div class="u-flex u-col-center">
+                <img
+                  style="width: 16px; height: 16px; filter: contrast(0.5)"
+                  src="@/assets/images/perpole.png"
+                  alt=""
+                />
+                <span class="u-m-t-4 u-font-12 u-m-l-2">
+                  {{ item.useNum || 0 }}/{{ item.maxCapacity }}
+                </span>
+              </div>
+              <div v-if="item.status == 'using'" class="u-flex">
+                <img
+                  style="width: 16px; height: 16px; filter: contrast(0.5)"
+                  src="@/assets/images/shalou.png"
+                  alt=""
+                />
+                <span class="u-m-t-4 u-font-12">{{ formatTime(item.durationTime) }}</span>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="empty_wrap">
+          <el-empty v-if="!tableList.length" description="空空如也~" />
+        </div>
+      </div>
+    </div>
+
+    <!-- 弹窗 -->
+    <addEara ref="refAddEara" @success="areainit" />
+    <addTable ref="refAddTable" @success="tableinit" />
+  </div>
+</template>
+
+<script setup>
+import status from "./status.js";
+
+import shopAreaApi from "@/api/account/shopArea";
+import tableApi from "@/api/account/table";
+import addEara from "./components/addEara.vue";
+import addTable from "./components/addTable.vue";
+
+let loading = ref(false);
+//工具方法
+function formatTime(milliseconds) {
+  console.log(milliseconds);
+  if (!milliseconds) {
+    return "";
+  }
+  const days = Math.floor(milliseconds / (1000 * 60 * 60 * 24));
+  const hours = Math.floor((milliseconds % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
+  const minutes = Math.floor((milliseconds % (1000 * 60 * 60)) / (1000 * 60));
+  return `${days ? days + "天" : ""} ${hours ? hours + "时" : ""} ${minutes + "分"}`;
+}
+
+function downloadTableCpde() {}
+function downloadShopCpde() {}
+
+// 台桌
+
+/**
+ * 编辑/删除
+ * @param command
+ * @param item
+ */
+function tableComman(command, item) {
+  if (command === "edit") {
+    return refAddTable.value.show(item);
+  }
+  if (command === "del") {
+    ElMessageBox.confirm("是否删除" + item.name + "台桌", "提示", {
+      confirmButtonText: "确定",
+      cancelButtonText: "取消",
+      type: "warning",
+    })
+      .then(async () => {
+        await tableApi.delete(item.id);
+        ElMessage.success("删除成功");
+        tableInit();
+      })
+      .catch(() => {});
+    return;
+  }
+}
+
+const refAddTable = ref(null);
+function addTableShow(item) {
+  refAddTable.value.show(item);
+}
+
+const tableList = ref([]);
+const tablequery = reactive({
+  page: 1,
+  size: 100,
+});
+
+async function tableInit() {
+  const res = await tableApi.getList({ ...tablequery, areaId: tableArea.tabsSel });
+  tableList.value = res.records;
+}
+
+// 区域
+let areaMap = ref({});
+const refAddEara = ref(null);
+function addEaraShow(item) {
+  refAddEara.value.show(item);
+}
+const tabVlaue = ref("");
+const tabs = ref([]);
+const tableArea = reactive({
+  tabs: [],
+  tabsSel: "",
+});
+watch(
+  () => tableArea.tabsSel,
+  () => {
+    tableInit();
+  }
+);
+//区域删除
+function delArea(id) {
+  shopAreaApi.delete(id).then((res) => {
+    ElMessage.success("删除成功");
+    areainit();
+  });
+}
+//区域列表初始化
+async function areainit() {
+  const res = await shopAreaApi.getList();
+  console.log(res);
+  tableArea.tabs = res.records;
+  areaMap.value = res.records.reduce((prve, cur) => {
+    prve[cur.id] = cur.name;
+    return prve;
+  }, {});
+}
+
+const tabClick = (tab) => {
+  console.log(tab);
+};
+init();
+function init() {
+  areainit();
+  tableInit();
+}
+onMounted(() => {});
+</script>
+
+<style lang="scss" scoped>
+.el-tabs {
+  margin-bottom: 0;
+}
+</style>
+<style scoped lang="scss">
+.cur-pointer {
+  cursor: pointer;
+}
+.opacity-0 {
+  opacity: 0;
+}
+.icon {
+  margin-left: 10px;
+}
+::v-deep .btn-group .el-button {
+  width: 100%;
+}
+::v-deep .el-dropdown-menu__item {
+  line-height: 36px;
+  padding: 0 20px;
+  min-width: 60px;
+  text-align: center;
+}
+.state {
+  display: flex;
+  align-items: center;
+
+  .dot {
+    $size: 8px;
+    width: $size;
+    height: $size;
+    border-radius: 50%;
+    margin-right: $size;
+  }
+}
+.table_list {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 20px;
+  min-height: 150px;
+
+  .empty_wrap {
+    flex: 1;
+    display: flex;
+    justify-content: center;
+  }
+  .btn-group {
+    display: flex;
+    gap: 10px;
+  }
+
+  .item {
+    padding: 1px;
+    overflow: hidden;
+    border: 1px solid #ddd;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    border-radius: 6px;
+    background-color: #1890ff;
+    max-width: 210px;
+    min-width: 190px;
+    &.using {
+      background-color: rgb(250, 85, 85);
+    }
+    &.closed {
+      background-color: rgb(221, 221, 221);
+      filter: grayscale(1);
+    }
+    .total-price {
+      line-height: 35px;
+      height: 35px;
+      &:hover {
+        text-decoration: underline;
+      }
+    }
+    .new-top {
+      height: 30px;
+      color: #fff;
+      padding: 0 12px;
+    }
+    .name {
+      font-size: 16px;
+      line-height: 30px;
+      margin-right: 10px;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+    .box {
+      height: 100%;
+      background-color: #fff;
+      border-radius: 3px 3px 6px 6px;
+      display: flex;
+      flex-direction: column;
+      justify-content: flex-end;
+    }
+    .bottom {
+      border-top: 1px solid #f7f7fa;
+      padding: 6px 15px;
+    }
+    .top {
+      padding: 10px;
+      background-color: #fff;
+      flex: 1;
+      border-radius: 3px 3px 0 0;
+      display: flex;
+      flex-direction: column;
+      justify-content: flex-end;
+      .row {
+        display: flex;
+        gap: 10px;
+
+        .tips {
+          font-size: 12px;
+        }
+
+        &.row1 {
+          justify-content: space-between;
+          font-size: 14px;
+        }
+      }
+    }
+
+    .btm {
+      border-top: 1px solid #ddd;
+      background-color: #efefef;
+      display: flex;
+      border-radius: 0 0 6px 6px;
+      .btm_item {
+        flex: 1;
+        height: 40px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        position: relative;
+
+        &:hover {
+          cursor: pointer;
+        }
+
+        &:nth-child(1) {
+          &::before {
+            content: "";
+            height: 50%;
+            border-right: 1px solid #ddd;
+            position: absolute;
+            top: 25%;
+            right: 0;
+          }
+        }
+
+        .i {
+          color: #666;
+        }
+      }
+    }
+  }
+}
+</style>
diff --git a/src/views/user/active/components/addActive.vue b/src/views/user/active/components/addActive.vue
new file mode 100644
index 0000000..742b947
--- /dev/null
+++ b/src/views/user/active/components/addActive.vue
@@ -0,0 +1,327 @@
+<template>
+  <div>
+    <el-dialog :title="form.id ? '编辑活动' : '添加活动'" v-model="dialogVisible" @close="reset">
+      <el-form ref="form" :model="form" :rules="rules" label-width="120px" label-position="left">
+        <el-form-item label="充值">
+          <el-input
+            style="width: 220px"
+            placeholder="请输入金额"
+            v-model="form.amount"
+            @input="(v) => (form.amount = v.replace(/^(0+)|[^\d]+/g, ''))"
+          >
+            <template #prepend>满</template>
+            <template #append>元</template>
+          </el-input>
+        </el-form-item>
+        <el-form-item label="赠送">
+          <div style="display: flex">
+            <el-input
+              style="width: 220px"
+              placeholder="请输入金额"
+              v-model="form.giftAmount"
+              @input="(v) => (form.giftAmount = v.replace(/^(0+)|[^\d]+/g, ''))"
+            >
+              <template #prepend>赠</template>
+              <template #append>元</template>
+            </el-input>
+            <el-input
+              style="margin-left: 20px; width: 220px"
+              placeholder="请输入金额"
+              v-model="form.giftPoints"
+              @input="(v) => (form.giftPoints = v.replace(/^(0+)|[^\d]+/g, ''))"
+            >
+              <template #prepend>赠</template>
+              <template #append>积分</template>
+            </el-input>
+          </div>
+        </el-form-item>
+        <el-form-item label="是否使用优惠券">
+          <el-switch v-model="form.isGiftCoupon" :active-value="1" :inactive-value="0"></el-switch>
+        </el-form-item>
+        <el-form-item label="数量">
+          <el-input-number v-model="form.num" controls-position="right" :min="1"></el-input-number>
+        </el-form-item>
+        <el-form-item label="选择优惠劵" v-if="form.isGiftCoupon == 1">
+          <div>
+            <el-button
+              type="primary"
+              icon="el-icon-plus"
+              @click="$refs.coupon.show([...productIds])"
+            >
+              添加优惠劵
+            </el-button>
+          </div>
+          <div class="shop_list">
+            <div
+              class="item_wrap"
+              style="display: flex; align-items: center; margin-top: 6px"
+              v-for="(item, index) in productIds"
+              :key="index"
+            >
+              <div class="name">{{ item.title }}</div>
+
+              <el-button type="text" @click="productIds = []" style="margin-left: 20px">
+                删除
+              </el-button>
+            </div>
+          </div>
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button @click="dialogVisible = false">取 消</el-button>
+          <el-button type="primary" :loading="loading" @click="onSubmitHandle">确 定</el-button>
+        </span>
+      </template>
+    </el-dialog>
+    <coupon ref="coupon" @success="slectShop" />
+  </div>
+</template>
+
+<script>
+import handselTypes from "../handselTypes";
+// import { activate, storageupActivate } from '@/api/shop'
+import coupon from "@/components/coupon/index.vue";
+import activeApi from "@/api/account/activate";
+import { ElNotification } from "element-plus";
+export default {
+  components: { coupon },
+  data() {
+    return {
+      dialogVisible: false,
+      loading: false,
+      handselTypes: handselTypes,
+      form: {
+        id: "",
+        amount: "",
+        giftAmount: "",
+        giftPoints: "",
+        isGiftCoupon: 0,
+        couponId: "",
+        num: 1,
+      },
+      productIds: [],
+      resetForm: "",
+      rules: {
+        minNum: [
+          {
+            required: true,
+            message: " ",
+            trigger: "blur",
+          },
+        ],
+        maxNum: [
+          {
+            required: true,
+            message: " ",
+            trigger: "blur",
+          },
+        ],
+      },
+    };
+  },
+  mounted() {
+    this.resetForm = { ...this.form };
+  },
+  methods: {
+    slectShop(res) {
+      console.log(res, 11);
+      // if (this.productIds.length) {
+      //     res.map(async item => {
+      //         if (!await this.checkShop(item.id)) {
+      //             this.productIds.push({ ...item })
+      //         }
+      //     })
+      // } else {
+      this.productIds = res;
+      // }
+    },
+    // 判断是否存在重复商品
+    checkShop(id) {
+      let falg = false;
+      this.productIds.map((item) => {
+        if (item.id == id) {
+          falg = true;
+        }
+      });
+      return falg;
+    },
+    checkIfNum(item) {
+      item.num = item.num.toString().replace(/\D/g, "");
+    },
+    // 确认选择商品分类
+    classifySuccess(e) {
+      this.form.config.categoryList = e;
+    },
+    onSubmitHandle() {
+      console.log(this.form);
+      if (this.form.amount == "") {
+        this.$message({
+          message: "充值金额不能为空",
+          type: "warning",
+        });
+        return false;
+      }
+      if (this.form.isGiftCoupon == 1) {
+        if (this.productIds.length == 0) {
+          this.$message({
+            message: "请选择优惠劵",
+            type: "warning",
+          });
+          return false;
+        }
+        this.form.couponId = this.productIds[0].id;
+      } else {
+        this.form.couponId = "";
+        this.form.couponName = "";
+        this.productIds = [];
+      }
+      // let arr = []
+      // this.productIds.forEach(ele => {
+      //     arr.push({
+      //         productId: ele.id,
+      //         num: ele.num
+      //     })
+      // })
+      this.$refs.form.validate(async (valid) => {
+        if (valid) {
+          try {
+            this.loading = true;
+            let res = this.form.id
+              ? await activeApi.edit(this.form)
+              : await activeApi.add(this.form);
+            this.$emit("success", res);
+            this.close();
+            ElNotification({
+              title: "成功",
+              message: `${this.form.id ? "编辑" : "添加"}成功`,
+              type: "success",
+            });
+            this.loading = false;
+          } catch (error) {
+            this.loading = false;
+            console.log(error);
+          }
+        }
+      });
+    },
+    async show(obj) {
+      this.productIds = [];
+      this.dialogVisible = true;
+      if (obj && obj.id) {
+        this.form = { ...obj };
+        // 留着以后说不定多个优惠劵
+        // let res = await activate(obj.id)
+        // this.productIds = res
+        if (obj.couponId) {
+          this.productIds = [{ title: obj.couponName, id: obj.couponId }];
+        }
+        console.log(obj, "调试1");
+      }
+    },
+    close() {
+      this.dialogVisible = false;
+    },
+    reset() {
+      this.form = { ...this.resetForm };
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.labelbox {
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  font-family: Source Han Sans CN, Source Han Sans CN;
+  font-weight: 400;
+  font-size: 12px;
+  color: #666666;
+  width: 130px;
+  background: #f7f7fa;
+  border-radius: 2px 2px 2px 2px;
+  border: 1px solid #dddfe6;
+  padding: 0 10px;
+
+  input {
+    border: none !important;
+  }
+}
+
+.labelboxss {
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  font-family: Source Han Sans CN, Source Han Sans CN;
+  font-weight: 400;
+  font-size: 14px;
+  color: #666666;
+}
+
+.shop_list {
+  // display: flex;/
+  // flex-wrap: wrap;
+
+  .item_wrap {
+    $size: 80px;
+
+    .item {
+      $radius: 4px;
+      width: $size;
+      height: $size;
+      border-radius: $radius;
+      overflow: hidden;
+      position: relative;
+      margin-right: 10px;
+      margin-top: 10px;
+
+      &:hover {
+        cursor: pointer;
+      }
+
+      &::after {
+        content: attr(data-index);
+        font-size: 12px;
+        height: 20px;
+        display: flex;
+        padding: 0 10px;
+        border-radius: 0 0 $radius 0;
+        align-items: center;
+        background-color: rgba(0, 0, 0, 0.3);
+        backdrop-filter: blur(10px);
+        color: #fff;
+        position: absolute;
+        top: 0;
+        left: 0;
+        z-index: 10;
+      }
+
+      &::before {
+        content: "删除";
+        font-size: 12px;
+        width: 100%;
+        height: 20px;
+        display: flex;
+        padding: 0 10px;
+        align-items: center;
+        justify-content: center;
+        background-color: rgba(0, 0, 0, 0.3);
+        backdrop-filter: blur(10px);
+        color: #fff;
+        position: absolute;
+        bottom: 0;
+        left: 0;
+        z-index: 10;
+        transition: all 0.1s ease-in-out;
+      }
+    }
+
+    .name {
+      width: $size;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/user/active/components/downloadQR.vue b/src/views/user/active/components/downloadQR.vue
new file mode 100644
index 0000000..6101b7d
--- /dev/null
+++ b/src/views/user/active/components/downloadQR.vue
@@ -0,0 +1,73 @@
+<template>
+  <div class="downloadQR" v-show="isshow">
+    <div class="box">
+      <img :src="imgUrl" style="width: 300px; height: 300px" alt="" />
+      <div class="btnStyle">
+        <el-button type="primary" @click="isshow = false">取消</el-button>
+        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+        <a :href="imgUrl"><el-button type="primary" @click="downImg">下载</el-button></a>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+// import { getwxacode } from '@/api/shop'
+
+export default {
+  data() {
+    return {
+      isshow: false,
+      imgUrl: "",
+    };
+  },
+  mounted() {},
+  methods: {
+    show() {
+      this.getlist();
+    },
+    async getlist() {
+      let res = await getwxacode({
+        shopId: localStorage.getItem("shopId"),
+      });
+      this.isshow = true;
+
+      this.imgUrl = res;
+    },
+    downImg() {
+      // window.location.href()
+      window.URL.revokeObjectURL(this.imgUrl);
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.downloadQR {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background-color: rgba($color: #000000, $alpha: 0.6);
+  width: 100%;
+  height: 100%;
+  position: fixed;
+  left: 0;
+  top: 0;
+  z-index: 9999;
+
+  .box {
+    padding: 20px;
+    border-radius: 3px;
+    height: 400px;
+    width: 340px;
+    background-color: #fff;
+    display: flex;
+    // align-items: center;
+    // justify-content: center;
+    flex-direction: column;
+  }
+
+  .btnStyle {
+    margin-top: 20px;
+    text-align: center;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/user/active/handselTypes.js b/src/views/user/active/handselTypes.js
new file mode 100644
index 0000000..427354b
--- /dev/null
+++ b/src/views/user/active/handselTypes.js
@@ -0,0 +1,10 @@
+export default [
+  {
+    label: "固定金额",
+    value: "GD"
+  },
+  {
+    label: "比例",
+    value: "RATIO"
+  }
+];
diff --git a/src/views/user/active/index.vue b/src/views/user/active/index.vue
index 30653d4..145338f 100644
--- a/src/views/user/active/index.vue
+++ b/src/views/user/active/index.vue
@@ -1,155 +1,147 @@
 <template>
   <div class="app-container">
-    <!-- 列表 -->
-    <!-- 搜索 -->
-    <page-search
-      ref="searchRef"
-      :search-config="searchConfig"
-      @query-click="handleQueryClick"
-      @reset-click="handleResetClick"
-    />
-    <!-- 列表 -->
-    <page-content
-      ref="contentRef"
-      :content-config="contentConfig"
-      @add-click="handleAddClick"
-      @edit-click="handleEditClick"
-      @export-click="handleExportClick"
-      @search-click="handleSearchClick"
-      @toolbar-click="handleToolbarClick"
-      @operat-click="handleOperatClick"
-      @filter-change="handleFilterChange"
-    >
-      <template #status="scope">
-        <el-tag :type="scope.row[scope.prop] == 1 ? 'success' : 'info'">
-          {{ scope.row[scope.prop] == 1 ? "启用" : "禁用" }}
-        </el-tag>
-      </template>
-      <template #options="scope">
-        {{ returnOptionsLabel(scope.prop, scope.row[scope.prop]) }}
-      </template>
-      <template #bol="scope">
-        {{ scope.row[scope.prop] ? "是" : "否" }}
-      </template>
-      <template #gender="scope">
-        <el-tag
-          :type="
-            scope.row[scope.prop] == null
-              ? 'info'
-              : scope.row[scope.prop] == 1
-              ? 'success'
-              : 'warning'
-          "
-        >
-          {{ scope.row[scope.prop] === null ? "未知" : scope.row[scope.prop] == 1 ? "男" : "女" }}
-        </el-tag>
-      </template>
-      <template #user="scope">
-        <div class="flex align-center">
-          <el-avatar :src="scope.row.headImg" />
-          <el-tag>{{ scope.row.nickName }}</el-tag>
-        </div>
-      </template>
-      <template #link="scope">
-        <el-link>{{ scope.row[scope.prop] }}</el-link>
-      </template>
-      <template #mobile="scope">
-        <el-text>{{ scope.row[scope.prop] }}</el-text>
-        <copy-button
-          v-if="scope.row[scope.prop]"
-          :text="scope.row[scope.prop]"
-          style="margin-left: 2px"
-        />
-      </template>
-    </page-content>
-
-    <!-- 新增 -->
-    <page-modal
-      ref="addModalRef"
-      :modal-config="addModalConfig"
-      @submit-click="handleSubmitClick"
-      @formDataChange="formDataChange"
-    ></page-modal>
-
-    <!-- 编辑 -->
-    <page-modal
-      ref="editModalRef"
-      :modal-config="editModalConfig"
-      @submit-click="handleSubmitClick"
-      @formDataChange="formDataChange"
-    ></page-modal>
+    <div class="head-container">
+      <el-button type="primary" icon="plus" @click="$refs.addActive.show()">添加活动</el-button>
+      <el-button type="primary" icon="download" @click="$refs.downloadQR.show()">
+        下载会员充值二维码
+      </el-button>
+      <div style="margin-top: 35px; font-size: 16px; color: #333">
+        允许充值自定义金额：
+        <el-switch
+          v-model="shopInfo.isCustom"
+          active-value="1"
+          inactive-value="0"
+          size="large"
+          @change="customStatusChange"
+        ></el-switch>
+      </div>
+    </div>
+    <div class="head-container">
+      <el-table :data="tableData.data" v-loading="tableData.loading">
+        <el-table-column label="店铺ID" prop="shopId"></el-table-column>
+        <el-table-column label="充值金额" prop="amount"></el-table-column>
+        <el-table-column label="赠送金额" prop="giftAmount"></el-table-column>
+        <el-table-column label="赠送积分" prop="giftPoints"></el-table-column>
+        <el-table-column label="是否使用优惠券" prop="isUseCoupon">
+          <template v-slot="scope">
+            {{ scope.row.isUseCoupon == 1 ? "是" : "否" }}
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" width="120">
+          <template v-slot="scope">
+            <el-button type="text" icon="edit" @click="$refs.addActive.show(scope.row)">
+              编辑
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <div class="head-container">
+      <el-pagination
+        :total="tableData.total"
+        :current-page="tableData.page + 1"
+        :page-size="tableData.size"
+        @current-change="paginationChange"
+        layout="total"
+      ></el-pagination>
+    </div>
+    <addActive ref="addActive" @success="getTableData" />
+    <QR ref="downloadQR"></QR>
   </div>
 </template>
 
-<script setup >
-import usePage from "@/components/CURD/usePage";
-import addModalConfig from "./config/add";
-import contentConfig from "./config/content";
-import editModalConfig from "./config/edit";
-import searchConfig from "./config/search";
-import { returnOptionsLabel } from "./config/config";
-const editMoneyModalRef = ref(null);
-const {
-  searchRef,
-  contentRef,
-  addModalRef,
-  editModalRef,
-  handleQueryClick,
-  handleResetClick,
-  // handleAddClick,
-  // handleEditClick,
-  handleSubmitClick,
-  handleExportClick,
-  handleSearchClick,
-  handleFilterChange,
-} = usePage();
-
-// 修改金额表单类型
-function formDataChange(type, val) {
-  console.log(type, val);
-}
-
-// 新增
-async function handleAddClick() {
-  addModalRef.value?.setModalVisible();
-}
-// 获取优惠券
-async function getCouponList() {}
-// 编辑
-async function handleEditClick(row) {
-  editModalRef.value?.handleDisabled(false);
-  editModalRef.value?.setModalVisible();
-  // 根据id获取数据进行填充
-  // const data = await VersionApi.getFormData(row.id);
-  editModalRef.value?.setFormData({ ...row, headImg: row.headImg ? [row.headImg] : "" });
-}
-
-// 其他工具栏
-function handleToolbarClick(name) {
-  console.log(name);
-  if (name === "custom1") {
-    ElMessage.success("点击了自定义1按钮");
-  }
-}
-
-// 其他操作列
-async function handleOperatClick(data) {
-  const row = data.row;
-  if (data.name == "more") {
-    if (data.command === "change-money") {
-      editMoneyModalRef.value.setModalVisible();
-      editMoneyModalRef.value.setFormData({ ...row, headImg: row.headImg ? [row.headImg] : "" });
-      return;
-    }
-    return;
-  }
-}
-
-// 切换示例
-const isA = ref(true);
+<script>
+import handselTypes from "./handselTypes";
+import addActive from "./components/addActive.vue";
+import QR from "./components/downloadQR.vue";
+import activeApi from "@/api/account/activate";
+import dayjs from "dayjs";
+export default {
+  components: {
+    addActive,
+    QR,
+  },
+  data() {
+    return {
+      query: {
+        shopId: "",
+      },
+      tableData: {
+        data: [],
+        page: 0,
+        size: 10,
+        loading: false,
+        total: 0,
+      },
+      shopInfo: {
+        isCustom: "0",
+      },
+    };
+  },
+  filters: {
+    handselTypeFilter(value) {
+      return handselTypes.find((item) => item.value == value).label;
+    },
+    timeFilter(s) {
+      return dayjs(s).format("YYYY-MM-DD HH:mm:ss");
+    },
+  },
+  mounted() {
+    this.getTableData();
+  },
+  methods: {
+    // 切换状态
+    async statusChange(e, row) {
+      if (row.couponName) {
+        try {
+          this.tableData.loading = true;
+          const data = { ...row };
+          data.isUseCoupon = e;
+          console.log(data.isUseCoupon);
+          await storageupActivate(data);
+          this.getTableData();
+        } catch (error) {
+          console.log(error);
+          this.tableData.loading = false;
+        }
+      } else {
+        console.log(22);
+        this.$message({
+          message: "请选择优惠劵",
+          type: "warning",
+        });
+        return false;
+      }
+    },
+    // 重置查询
+    resetHandle() {
+      this.query.name = "";
+      this.query.type = "";
+      this.getTableData();
+    },
+    // 分页回调
+    paginationChange(e) {
+      this.tableData.page = e - 1;
+      this.getTableData();
+    },
+    // 获取商品列表
+    async getTableData() {
+      this.tableData.loading = true;
+      try {
+        const res = await activeApi.getList({});
+        this.tableData.loading = false;
+        this.tableData.data = res;
+        this.tableData.total = res.length;
+      } catch (error) {
+        console.log(error);
+      }
+    },
+    customStatusChange() {
+      this.updateShopInfo();
+    },
+    async updateShopInfo() {
+      await tbShopInfoPut(this.shopInfo);
+    },
+  },
+};
 </script>
-<style scoped>
-.align-center {
-  align-items: center;
-}
-</style>