diff --git a/src/api/coupon.js b/src/api/coupon.js
new file mode 100644
index 0000000..d7c4b17
--- /dev/null
+++ b/src/api/coupon.js
@@ -0,0 +1,79 @@
+import request from '@/utils/request'
+
+/**
+ * 获取优惠券列表
+ * @returns
+ */
+export function getTbShopCoupon(params) {
+  return request({
+    url: '/api/tbShopCoupon',
+    method: 'get',
+    params: {
+      ...params
+    }
+  })
+}
+
+/**
+ * 获取优惠券详情
+ * @returns
+ */
+export function getTbShopCouponInfo(id) {
+  return request({
+    url: '/api/tbShopCoupon/' + id,
+    method: 'get',
+    params: {}
+  })
+}
+
+/**
+ * 增加优惠券
+ * @returns
+ */
+export function addTbShopCoupon(params) {
+  return request({
+    url: '/api/tbShopCoupon',
+    method: 'post',
+    data: {
+      ...params
+    }
+  })
+}
+
+/**
+ * 删除优惠券
+ * @returns
+ */
+export function delTbShopCoupon(params) {
+  return request({
+    url: '/api/tbShopCoupon',
+    method: 'delete',
+    data: params
+  })
+}
+
+/**
+ * 获取领取列表
+ * @returns
+ */
+export function queryReceive(params) {
+  return request({
+    url: '/api/tbShopCoupon/queryReceive',
+    method: 'post',
+    data: {
+      ...params
+    }
+  })
+}
+
+/**
+ * 获取领取列表
+ * @returns
+ */
+export function delReceive(params) {
+  return request({
+    url: '/api/tbShopCoupon/receive',
+    method: 'delete',
+    data: params
+  })
+}
diff --git a/src/views/coupon_manage/add_coupon.vue b/src/views/coupon_manage/add_coupon.vue
new file mode 100644
index 0000000..d253601
--- /dev/null
+++ b/src/views/coupon_manage/add_coupon.vue
@@ -0,0 +1,407 @@
+<!-- eslint-disable vue/no-use-v-if-with-v-for -->
+<template>
+  <div class="app-container">
+    <div class="tab">
+      <div v-for="(item,index) in tabList" v-if="(form.id&&form.type == item.type)||!form.id" :key="index" class="tab_item" :class="{active: form.type == item.type}" @click="tabClick(item)"> {{ item.name }} <span class="bor" /></div>
+    </div>
+    <!-- 优惠券 -->
+    <div v-if="form.type == 1" class="content">
+      <el-form ref="form" :model="form" :rules="rules" label-width="120px" label-position="left">
+        <el-form-item label="优惠卷卷名" prop="title">
+          <el-input v-model="form.title" placeholder="" style="width: 289px;" />
+        </el-form-item>
+        <el-form-item label="使用门槛">
+          <el-input v-model="form.fullAmount" type="number" placeholder="" style="width: 180px;margin-right: 66px;">
+            <template slot="prepend">满</template>
+            <template slot="append">元</template>
+          </el-input>
+          <el-input v-model="form.discountAmount" type="number" placeholder="" style="width: 180px;">
+            <template slot="prepend">减</template>
+            <template slot="append">元</template>
+          </el-input>
+        </el-form-item>
+
+        <el-form-item label="有效期类型">
+          <el-radio-group v-model="form.validityType">
+            <el-radio v-for="item in couponEnum.validityType" :key="item.value" :label="item.value">
+              {{ item.label }}
+            </el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item v-if="form.validityType == 'custom'" label="有效时间" prop="validEndTime">
+          <el-date-picker
+            v-model="validityTime"
+            type="daterange"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+            :default-time="['06:00:00', '23:59:59']"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            @change="validityChange"
+          />
+        </el-form-item>
+        <!-- <el-form-item label="使用门槛" prop="daysToTakeEffect">
+          <el-input v-model="form.daysToTakeEffect" placeholder="" style="width: 200px;">
+            <template slot="prepend">隔</template>
+            <template slot="append">天生效</template>
+          </el-input>
+        </el-form-item> -->
+        <el-form-item label="可用周期" prop="userDays">
+          <el-checkbox-group v-model="form.userDays">
+            <el-checkbox v-for="(city,index) in couponEnum.cycle" :key="index" :label="city.label" @change="userDayChagne">{{ city.label }}</el-checkbox>
+          </el-checkbox-group>
+        </el-form-item>
+        <el-form-item label="指定时间段">
+          <el-radio-group v-model="form.useTimeType">
+            <el-radio v-for="item in couponEnum.useTimeType" :key="item.value" :label="item.value">
+              {{ item.label }}
+            </el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item v-if="form.useTimeType == 'custom'" label="指定时间段" prop="useEndTime">
+          <el-time-picker
+            v-model="useTime"
+            is-range
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+            :default-time="['00:00:00', '23:59:59']"
+            value-format="HH:mm"
+            @change="useTimeChange"
+          />
+        </el-form-item>
+        <el-form-item label="发放数量" prop="number">
+          <el-input v-model="form.number" type="number" placeholder="" style="width: 200px;" />
+        </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>
+    </div>
+    <!-- 商品券 -->
+    <div v-if="form.type == 2" class="content">
+      <el-form ref="form" :model="form" :rules="rules" label-width="120px" label-position="left">
+        <el-form-item label="商品卷卷名" prop="title">
+          <el-input v-model="form.title" placeholder="" style="width: 289px;" />
+        </el-form-item>
+        <el-form-item label="发放数量" prop="number">
+          <el-input v-model="form.number" type="number" placeholder="" style="width: 289px;" />
+        </el-form-item>
+        <el-form-item label="使用门槛">
+          全额满<el-input v-model="form.fullAmount" placeholder="" style="width: 100px;margin: 0 23px;"><template slot="suffix">元</template></el-input>可用
+        </el-form-item>
+        <el-form-item label="赠送商品" prop="products">
+          <div>
+            <el-button type="primary" icon="el-icon-plus" @click="$refs.shopListRef.show([...form.products])">
+              添加 </el-button>
+          </div>
+          <div class="shop_list">
+            <div
+              v-for="(item, index) in form.products"
+              :key="item.id"
+              class="item_wrap"
+            >
+              <div class="name">{{ item.name }}</div>
+              <el-input v-model="item.num" placeholder="请填写数量" style="width: 100px;" />
+              <div class="del" @click="form.products.splice(index, 1)">删除</div>
+            </div>
+          </div>
+        </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>
+    </div>
+    <shopList ref="shopListRef" @success="slectShop" />
+  </div>
+</template>
+
+<script>
+import couponEnum from './couponEnum'
+import shopList from '@/components/shopList'
+import { addTbShopCoupon, getTbShopCouponInfo } from '@/api/coupon'
+export default {
+  components: { shopList },
+  data() {
+    const validateProduct = (rule, value, callback) => {
+      if (!this.form.products.length) {
+        callback(new Error('请选择商品'))
+      } else {
+        callback()
+      }
+    }
+    return {
+      tabList: [
+        { name: '新增优惠券', type: 1 },
+        { name: '新增商品券', type: 2 }
+      ],
+      tabActive: 1,
+      couponEnum,
+      dialogVisible: false,
+      loading: false,
+      validityTime: [],
+      useTime: ['06:00:00', '23:59:59'],
+      form: {
+        id: '',
+        shopId: '',
+        type: '1',
+        title: '',
+        fullAmount: null,
+        discountAmount: null,
+        validityType: 'fixed',
+        validStartTime: '',
+        validEndTime: '',
+        userDays: [],
+        useTimeType: 'all',
+        useStartTime: '',
+        useEndTime: '',
+        products: [],
+        number: ''
+      },
+      rules: {
+        title: [
+          {
+            required: true,
+            message: '填写券名',
+            trigger: 'blur'
+          }
+        ],
+        daysToTakeEffect: [
+          {
+            required: true,
+            message: '填写生效天数',
+            trigger: 'blur'
+          }
+        ],
+        userDays: [
+          {
+            required: true,
+            message: '选择可用周期',
+            trigger: 'change'
+          }
+        ],
+        validEndTime: [
+          {
+            required: true,
+            message: '选择有效时间段',
+            trigger: 'change'
+          }
+        ],
+        useEndTime: [
+          {
+            required: true,
+            message: '选择指定时间段',
+            trigger: 'change'
+          }
+        ],
+        products: [
+          {
+            required: true,
+            validator: validateProduct,
+            trigger: 'change'
+          }
+        ],
+        number: [
+          {
+            required: true,
+            message: '填写发放数量',
+            trigger: 'blur'
+          }
+        ]
+      },
+      resetForm: ''
+    }
+  },
+  mounted() {
+    this.resetForm = { ...this.form }
+    this.form.type = this.$route.query.type
+    this.form.useStartTime = this.useTime[0]
+    this.form.useEndTime = this.useTime[1]
+    if (this.$route.query.id) { this.form.id = this.$route.query.id; this.getCouponInfo(this.$route.query.id) }
+  },
+  methods: {
+    /**
+     * 切换类型
+     * @param item
+     */
+    tabClick(item) {
+      console.log(item)
+      this.form.type = item.type
+      this.$refs.form.resetFields()
+    },
+
+    /**
+     * 获取优惠券详情
+     */
+    async getCouponInfo(id) {
+      const resInfo = await getTbShopCouponInfo(id)
+      this.form = resInfo
+      if (resInfo.validityType === 'custom') {
+        this.validityTime = [resInfo.validStartTime, resInfo.validEndTime]
+      }
+      if (resInfo.useTimeType === 'custom') {
+        this.useTime = [resInfo.useStartTime, resInfo.useEndTime]
+      }
+      this.form.userDays = this.form.userDays.split(',')
+    },
+
+    /**
+     * 选择可用周期
+     */
+    userDayChagne(e) {
+      console.log(this.form.userDays)
+    },
+
+    /**
+     * 有效期选择
+     * @param e
+     */
+    validityChange(e) {
+      this.form.validStartTime = e[0]
+      this.form.validEndTime = e[1]
+    },
+
+    /**
+     * 指定时间段选择
+     * @param e
+     */
+    useTimeChange(e) {
+      this.form.useStartTime = e[0]
+      this.form.useEndTime = e[1]
+    },
+
+    /**
+     * 选择商品
+     * @param res
+     */
+    slectShop(res) {
+      if (res.length <= 0) {
+        return
+      }
+      this.form.products = []
+      if (this.form.products.length) {
+        res.map(async item => {
+          if (!await this.checkShop(item.id)) {
+            this.form.products.push({
+              id: item.id,
+              name: item.name,
+              num: null
+            })
+          }
+        })
+      } else {
+        this.form.products.push({
+          id: res[0].id,
+          name: res[0].name,
+          num: null
+        })
+      }
+    },
+
+    /**
+     * 判断是否存在重复商品
+     * @param id
+     */
+    checkShop(id) {
+      let falg = false
+      this.form.products.map(item => {
+        // eslint-disable-next-line eqeqeq
+        if (item.id == id) {
+          falg = true
+        }
+      })
+      return falg
+    },
+
+    /**
+     * 提交
+     */
+    onSubmitHandle() {
+      console.log(this.form)
+      this.$refs.form.validate(async valid => {
+        if (valid) {
+          try {
+            this.loading = true
+            if (!this.form.shopId) { this.form.shopId = localStorage.getItem('shopId') }
+            this.form.userDays = this.form.userDays.toString()
+            // eslint-disable-next-line no-unused-vars
+            const res = await addTbShopCoupon(this.form)
+            this.$store.dispatch('tagsView/delView', this.$route) // 关闭当前页
+            this.$router.replace({ name: 'coupon_list' }) // 要打开的页面
+            this.$notify({
+              title: '成功',
+              message: `${this.form.id ? '编辑' : '添加'}成功`,
+              type: 'success'
+            })
+            this.loading = false
+          } catch (error) {
+            this.loading = false
+            console.log(error)
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.tab{
+  display: flex;
+  margin-bottom: 30px;
+  padding-top: 40px;
+  padding-left: 10px;
+  .tab_item{
+    margin-right: 64px;
+    font-weight: 400;
+    font-size: 16px;
+    color: #666666;
+    cursor: pointer;
+    .bor{
+      display: block;
+      width: 56px;
+      height: 6px;
+      background-color: transparent;
+      border-radius: 3px 3px 3px 3px;
+      margin: 5px auto 0;
+    }
+  }
+  .active{
+    color: #3F9EFF;
+    .bor{
+      background-color: #3F9EFF;
+    }
+  }
+
+}
+.content{
+  font-weight: 400;
+  font-size: 16px;
+  color: #666666;
+}
+.shop_list {
+    display: flex;
+    flex-wrap: wrap;
+    margin-top: 15px;
+    .item_wrap {
+        $size: 80px;
+        display: flex;
+        align-items: center;
+        .name {
+            width: $size;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+        }
+        .del{
+          font-weight: 400;
+          font-size: 14px;
+          color: #3F9EFF;
+          margin-left: 11px;
+        }
+    }
+}
+</style>
diff --git a/src/views/coupon_manage/components/addCoupon.vue b/src/views/coupon_manage/components/addCoupon.vue
deleted file mode 100644
index fa12b7a..0000000
--- a/src/views/coupon_manage/components/addCoupon.vue
+++ /dev/null
@@ -1,277 +0,0 @@
-<template>
-    <div>
-        <el-dialog title="添加优惠券" :visible.sync="dialogVisible" @close="reset">
-            <el-form ref="form" :model="form" :rules="rules" label-width="120px" label-position="left">
-                <el-form-item label="优惠卷名称" prop="title">
-                    <el-input v-model="form.title" placeholder="请输入优惠卷名称" style="width: 200px;"></el-input>
-                </el-form-item>
-                <el-form-item label="类型">
-                    <el-radio-group v-model="form.classType">
-                        <el-radio :label="item.value" v-for="item in couponEnum.classType" :key="item.value">
-                            {{ item.label }}
-                        </el-radio>
-                    </el-radio-group>
-                </el-form-item>
-                <el-form-item label="选择商品" v-if="form.classType == 'product'" prop="classType">
-                    <div>
-                        <el-button type="primary" icon="el-icon-plus" @click="$refs.shopListRef.show([...productIds])">
-                            添加商品
-                        </el-button>
-                    </div>
-                    <div class="shop_list">
-                        <div class="item_wrap" v-for="(item, index) in productIds" :key="item.id"
-                            @click="productIds.splice(index, 1)">
-                            <div class="item" :data-index="index + 1">
-                                <el-image :src="item.coverImg" style="width: 100%;height: 100%;"></el-image>
-                            </div>
-                            <div class="name">{{ item.name }}</div>
-                        </div>
-                    </div>
-                </el-form-item>
-                <el-form-item label="优惠类型">
-                    <el-radio-group v-model="form.type">
-                        <el-radio :label="item.value" v-for="item in couponEnum.type" :key="item.value">
-                            {{ item.label }}
-                        </el-radio>
-                    </el-radio-group>
-                </el-form-item>
-                <el-form-item label="满减限制" v-if="form.type == '0'">
-                    <el-input-number v-model="form.limitAmount" controls-position="right" :min="0"></el-input-number>
-                </el-form-item>
-                <el-form-item label="折扣" v-if="form.type == '1'">
-                    <el-input-number v-model="form.ratio" controls-position="right" :min="1"></el-input-number>
-                </el-form-item>
-                <el-form-item label="优惠券面额">
-                    <el-input-number v-model="form.amount" controls-position="right" :min="0"></el-input-number>
-                </el-form-item>
-                <el-form-item label="发放数量">
-                    <el-input-number v-model="form.number" controls-position="right" :min="1"></el-input-number>
-                </el-form-item>
-                <el-form-item label="限领数量">
-                    <el-input-number v-model="form.limitNumber" controls-position="right" :min="1"></el-input-number>
-                </el-form-item>
-                <el-form-item label="有效期">
-                    <el-radio-group v-model="form.effectType">
-                        <el-radio :label="item.value" v-for="item in couponEnum.effectType" :key="item.value">
-                            {{ item.label }}
-                        </el-radio>
-                    </el-radio-group>
-                </el-form-item>
-                <el-form-item label="有效时间" v-if="form.effectType == 1">
-                    <el-date-picker v-model="selectTime" type="daterange" range-separator="至" start-placeholder="开始日期"
-                        end-placeholder="结束日期" :default-time="['00:00:00', '23:59:59']"
-                        value-format="yyyy-MM-dd HH:mm:ss">
-                    </el-date-picker>
-                </el-form-item>
-                <el-form-item label="状态">
-                    <el-switch v-model="form.status" :active-value="1" :inactive-value="0"></el-switch>
-                </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>
-        </el-dialog>
-        <shopList ref="shopListRef" @success="slectShop" />
-    </div>
-</template>
-
-<script>
-import couponEnum from './../couponEnum'
-import shopList from '@/components/shopList'
-import { tbMerchantCoupon } from '@/api/shop'
-export default {
-    components: { shopList },
-    data() {
-        const validateProduct = (rule, value, callback) => {
-            if (!this.productIds.length) {
-                callback(new Error('请选择商品'))
-            } else {
-                callback()
-            }
-        }
-        return {
-            couponEnum,
-            dialogVisible: false,
-            loading: false,
-            selectTime: [],
-            form: {
-                id: '',
-                title: '',
-                classType: 'product',
-                type: '0',
-                limitAmount: '',
-                ratio: '1',
-                amount: '',
-                number: '1',
-                limitNumber: '1',
-                effectType: '0',
-                fromTime: '',
-                toTime: '',
-                relationIds: '',
-                status: 1
-            },
-            rules: {
-                title: [
-                    {
-                        required: true,
-                        message: ' ',
-                        trigger: 'blur'
-                    }
-                ],
-                classType: [
-                    {
-                        required: true,
-                        validator: validateProduct,
-                        trigger: 'change'
-                    }
-                ]
-            },
-            resetForm: '',
-            productIds: []
-        }
-    },
-    mounted() {
-        this.resetForm = { ...this.form }
-    },
-    methods: {
-        // 选择商品
-        slectShop(res) {
-            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
-        },
-        // 提交
-        onSubmitHandle() {
-            console.log(this.form)
-            this.$refs.form.validate(async valid => {
-                if (valid) {
-                    try {
-                        this.loading = true
-                        this.form.shopId = localStorage.getItem('shopId')
-                        this.form.fromTime = this.selectTime[0] || ''
-                        this.form.toTime = this.selectTime[1] || ''
-
-                        let arr = []
-                        if (this.form.classType == 'product') {
-                            arr = this.productIds.map(item => item.id)
-                        }
-
-                        this.form.relationIds = arr.join(',')
-
-                        let res = await tbMerchantCoupon(this.form, 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)
-                    }
-                }
-            })
-        },
-        show(obj) {
-            this.dialogVisible = true
-            if (obj && obj.id) {
-                this.form = { ...obj }
-            }
-        },
-        close() {
-            this.dialogVisible = false
-        },
-        reset() {
-            this.form = { ...this.resetForm }
-        }
-    }
-}
-</script>
-
-<style scoped lang="scss">
-.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 .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/coupon_manage/components/coupon_details.vue b/src/views/coupon_manage/components/coupon_details.vue
new file mode 100644
index 0000000..e36e8ba
--- /dev/null
+++ b/src/views/coupon_manage/components/coupon_details.vue
@@ -0,0 +1,289 @@
+<template>
+  <div>
+    <el-dialog title="领取详情" :visible.sync="dialogVisible" width="70%" @close="reset">
+      <div class="search">
+        <el-form :model="query" inline label-position="left">
+          <el-form-item>
+            <el-input v-model="query.value" placeholder="用户ID/用户昵称/用户手机" style="width: 180px;" />
+          </el-form-item>
+          <el-form-item>
+            <el-select v-model="query.status" placeholder="选择状态" style="width: 154px;">
+              <el-option
+                v-for="item in stateList"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item />
+          <el-form-item label="领取时间">
+            <el-date-picker
+              v-model="queryTime"
+              type="daterange"
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              :default-time="['00:00:00', '23:59:59']"
+              value-format="yyyy-MM-dd HH:mm:ss"
+              @change="queryTimeChange"
+            />
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" @click="getTableData">查询</el-button>
+            <!-- <el-button v-loading="downloadLoading" icon="el-icon-download" @click="downloadHandle">
+              <span v-if="!downloadLoading">导出</span>
+              <span v-else>下载中...</span>
+            </el-button> -->
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="head-container">
+        <el-table v-loading="loading" :data="tableData.data">
+
+          <el-table-column label="用户ID" prop="id" />
+          <el-table-column label="用户名" prop="name" />
+          <el-table-column label="领取时间" prop="receiveTime" />
+          <el-table-column label="使用时间" prop="useTime" />
+          <el-table-column label="获得来源" prop="source" />
+          <el-table-column label="状态" align="status">
+            <template v-slot="scope">
+              <div style="display: flex;align-items: center;">
+                <div v-if="scope.row.overNum == scope.row.num" style="width: 30px;color: #FAAD14;">未使用</div>
+                <div v-if="scope.row.num!=0&&scope.row.overNum != scope.row.num">{{ scope.row.overNum }}/{{ scope.row.num }}</div>
+                <div v-if="scope.row.overNum == 0" style="color: #52C41A;">已使用</div>
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column label="使用门店" prop="tableName" />
+          <el-table-column label="操作" width="150">
+            <template v-slot="scope">
+              <el-popconfirm title="确定删除吗？" @confirm="delTableHandle([scope.row.id])">
+                <el-button
+                  slot="reference"
+                  type="text"
+                  icon="el-icon-delete"
+                  style="color: #FF4D4F;"
+                >删除</el-button>
+              </el-popconfirm>
+            </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"
+          layout="total, sizes, prev, pager, next, jumper"
+          @current-change="paginationChange"
+          @size-change="sizeChange"
+        />
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { queryReceive, delReceive } from '@/api/coupon'
+
+export default {
+  // eslint-disable-next-line vue/require-prop-types
+  props: ['couponId'],
+  data() {
+    return {
+      dialogVisible: false,
+      downloadLoading: false,
+      loading: false,
+      stateList: [
+        { label: '未使用', value: 0 },
+        { label: '已使用', value: 1 }
+      ],
+      queryTime: [],
+      query: {
+        couponId: '',
+        value: '',
+        status: 0,
+        startTime: '',
+        endTime: '',
+        page: 1,
+        size: 10
+      },
+      resetQuery: null,
+      tableData: {
+        data: [],
+        page: 0,
+        size: 10,
+        loading: false,
+        total: 0
+      }
+    }
+  },
+  mounted() {
+    this.resetQuery = { ...this.query }
+  },
+  methods: {
+    /**
+     * 查询
+     */
+    async getTableData() {
+      // eslint-disable-next-line no-unused-vars, prefer-const
+      console.log(this.couponId)
+
+      // eslint-disable-next-line no-unused-vars, prefer-const
+      let res = await queryReceive({
+        shopId: localStorage.getItem('shopId'),
+        couponId: this.query.couponId,
+        value: this.query.value,
+        status: this.query.status,
+        startTime: this.query.startTime,
+        endTime: this.query.endTime,
+        page: this.query.page,
+        size: this.query.size
+      })
+      this.tableData.loading = false
+      this.tableData.data = res.content
+      this.tableData.total = res.totalElements
+    },
+
+    /**
+     * 时间选择监听
+     */
+    queryTimeChange(e) {
+      this.query.startTime = e[0]
+      this.query.endTime = e[1]
+    },
+
+    /**
+     * 删除优惠券
+     * @param id
+     */
+    async delTableHandle(id) {
+      // eslint-disable-next-line no-undef
+      const delRes = await delReceive(id)
+      console.log(delRes)
+      this.getTableData()
+    },
+
+    /**
+     * 打开详情
+     * @param obj
+     */
+    show(obj) {
+      console.log(obj)
+      this.dialogVisible = true
+      this.query.couponId = obj.id
+      this.getTableData()
+    },
+    // 分页大小改变
+    sizeChange(e) {
+      this.tableData.size = e
+      this.getTableData()
+    },
+    // 分页回调
+    paginationChange(e) {
+      this.tableData.page = e - 1
+      this.getTableData()
+    },
+    /**
+     * 关闭详情
+     */
+    close() {
+      this.dialogVisible = false
+    },
+
+    /**
+     * 导出Excel
+     */
+    async downloadHandle() {
+      try {
+        this.downloadLoading = true
+        // eslint-disable-next-line no-undef
+        const file = await summaryTableDownload({
+          startTime: this.query.createdAt[0],
+          endTime: this.query.createdAt[1]
+        })
+        // eslint-disable-next-line no-undef
+        downloadFile(file, '数据', 'xlsx')
+        this.downloadLoading = false
+      } catch (error) {
+        this.downloadLoading = false
+        console.log(error)
+      }
+    },
+    reset() {
+      this.query = { ...this.resetQuery }
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.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 .1s ease-in-out;
+            }
+        }
+
+        .name {
+            width: $size;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+        }
+    }
+}
+</style>
diff --git a/src/views/coupon_manage/couponEnum.js b/src/views/coupon_manage/couponEnum.js
index 9bf81ab..f4cbaf5 100644
--- a/src/views/coupon_manage/couponEnum.js
+++ b/src/views/coupon_manage/couponEnum.js
@@ -1,32 +1,51 @@
 export default {
-    classType: [
-        {
-            value: 'product',
-            label: '商品券'
-        },
-        {
-            value: 'common',
-            label: '通用券'
-        }
-    ],
-    type: [
-        {
-            value: '0',
-            label: '满减'
-        },
-        {
-            value: '1',
-            label: '折扣'
-        }
-    ],
-    effectType: [
-        {
-            value: '0',
-            label: '一直有效'
-        },
-        {
-            value: '1',
-            label: '时限有效'
-        }
-    ]
-}
\ No newline at end of file
+  classType: [
+    {
+      value: 'product',
+      label: '商品券'
+    },
+    {
+      value: 'common',
+      label: '通用券'
+    }
+  ],
+  type: [
+    {
+      value: '0',
+      label: '满减'
+    },
+    {
+      value: '1',
+      label: '折扣'
+    }
+  ],
+  cycle: [
+    { label: '周一' },
+    { label: '周二' },
+    { label: '周三' },
+    { label: '周四' },
+    { label: '周五' },
+    { label: '周六' },
+    { label: '周七' }
+  ],
+  validityType: [
+    {
+      value: 'fixed',
+      label: '领券后有效期内可用'
+    },
+    {
+      value: 'custom',
+      label: '固定有效期范围内可用'
+    }
+  ],
+  useTimeType: [
+    {
+      value: 'all',
+      label: '全时段可用'
+    },
+    {
+      value: 'custom',
+      label: '指定时间段'
+    }
+  ]
+}
diff --git a/src/views/coupon_manage/coupon_list.vue b/src/views/coupon_manage/coupon_list.vue
index 9c9b65a..7a7d802 100644
--- a/src/views/coupon_manage/coupon_list.vue
+++ b/src/views/coupon_manage/coupon_list.vue
@@ -1,118 +1,161 @@
 <template>
-    <div class="app-container">
-        <div class="head-container">
-            <el-button type="primary" icon="el-icon-plus" @click="$refs.addCoupon.show()">
-                添加优惠券
-            </el-button>
-        </div>
-        <div class="head-container">
-            <el-table :data="tableData.data" v-loading="tableData.loading">
-                <el-table-column label="优惠券名称" prop="title"></el-table-column>
-                <el-table-column label="类型" prop="classType">
-                    <template v-slot="scope">
-                        {{ scope.row.classType | classTypeFilter }}
-                    </template>
-                </el-table-column>
-                <el-table-column label="优惠类型" prop="type">
-                    <template v-slot="scope">
-                        {{ scope.row.type | typeFilter }}
-                    </template>
-                </el-table-column>
-                <el-table-column label="折扣" prop="ratio"></el-table-column>
-                <el-table-column label="面额" prop="amount"></el-table-column>
-                <el-table-column label="满减限制" prop="limitAmount"></el-table-column>
-                <el-table-column label="发放数量" prop="number"></el-table-column>
-                <el-table-column label="限领数量" prop="limitNumber"></el-table-column>
-                <el-table-column label="剩余数量" prop="leftNumber"></el-table-column>
-                <el-table-column label="有效期" prop="effectType">
-                    <template v-slot="scope">
-                        {{ scope.row.effectType | effectTypeFilter }}
-                    </template>
-                </el-table-column>
-                <el-table-column label="开始时间" prop="fromTime"></el-table-column>
-                <el-table-column label="到期时间" prop="toTime"></el-table-column>
-                <el-table-column label="商品列表" prop="relationIds" width="200">
-                    <template v-slot="scope">
-                        <div style="display: flex;" v-if="scope.row.classType == 'product'">
-                            <el-image :src="scope.row.coverImg" style="width: 30px;height: 30px;"></el-image>
-                            <span style="margin-left: 10px;">{{ scope.row.name }}</span>
-                        </div>
-                    </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" @size-change="sizeChange"
-                layout="total, sizes, prev, pager, next, jumper"></el-pagination>
-        </div>
-        <addCoupon ref="addCoupon" @success="resetHandle" />
+  <div class="app-container">
+    <div class="head-container">
+      <!-- <el-button type="primary" icon="el-icon-plus" @click="$refs.addCoupon.show()">
+        添加优惠券
+      </el-button> -->
+      <el-button type="primary" icon="el-icon-plus" @click="$router.push({name: 'add_coupon', query: {type:1}})">
+        添加优惠券
+      </el-button>
     </div>
+    <div class="head-container">
+      <el-table v-loading="tableData.loading" :data="tableData.data">
+        <el-table-column label="ID" prop="id" />
+        <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="有效期">
+          <template v-slot="scope">
+            {{ `领券后${scope.row.validDays}天过期` }}
+          </template>
+        </el-table-column> -->
+        <el-table-column label="用户领取方式">
+          <template v-slot="scope">
+            {{ `无` }}
+          </template>
+        </el-table-column>
+        <el-table-column label="总发放数量" prop="number" />
+        <el-table-column label="已领取" align="center">
+          <template v-slot="scope">
+            <div style="display: flex;align-items: center;">
+              <div style="width: 30px;">{{ scope.row.number-scope.row.leftNumber }}</div>
+              <div style="margin: 0 10px;">|</div>
+              <div style="color: #3F9EFF;cursor: pointer;flex-shrink: 0;" @click="couponDetailsOpen(scope.row)">详情</div>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="已使用" prop="useNumber" />
+        <el-table-column label="剩余" prop="leftNumber" />
+        <el-table-column label="操作" width="150">
+          <template v-slot="scope">
+            <el-button type="text" icon="el-icon-edit" @click="$router.push({name: 'add_coupon', query: {type:scope.row.type ,id: scope.row.id}} )">编辑</el-button>
+            <el-popconfirm title="确定删除吗？" @confirm="delTableHandle([scope.row.id])">
+              <el-button
+                slot="reference"
+                type="text"
+                icon="el-icon-delete"
+                style="margin-left: 20px !important;"
+              >删除</el-button>
+            </el-popconfirm>
+          </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"
+        layout="total, sizes, prev, pager, next, jumper"
+        @current-change="paginationChange"
+        @size-change="sizeChange"
+      />
+    </div>
+    <couponDetails ref="couponDetails" @success="resetHandle" />
+  </div>
 </template>
 
 <script>
 import couponEnum from './couponEnum'
-import addCoupon from './components/addCoupon.vue'
-import { tbMerchantCouponGet } from '@/api/shop'
+import couponDetails from './components/coupon_details.vue'
+import { getTbShopCoupon, delTbShopCoupon } from '@/api/coupon'
 export default {
-    components: { addCoupon },
-    data() {
-        return {
-            tableData: {
-                data: [],
-                page: 0,
-                size: 10,
-                loading: false,
-                total: 0
-            }
-        }
+  // eslint-disable-next-line vue/no-unused-components
+  components: { couponDetails },
+  filters: {
+
+    typeFilter(value) {
+      // eslint-disable-next-line eqeqeq
+      return couponEnum.type.find(item => item.value == value).label
     },
-    filters: {
-        classTypeFilter(value) {
-            return couponEnum.classType.find(item => item.value == value).label
-        },
-        typeFilter(value) {
-            return couponEnum.type.find(item => item.value == value).label
-        },
-        effectTypeFilter(value) {
-            return couponEnum.effectType.find(item => item.value == value).label
-        }
-    },
-    mounted() {
-        this.getTableData()
-    },
-    methods: {
-        // 重置查询
-        resetHandle() {
-            this.page = 0
-            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 tbMerchantCouponGet({
-                    page: this.tableData.page,
-                    size: this.tableData.size,
-                    shopId: localStorage.getItem('shopId')
-                })
-                this.tableData.loading = false
-                this.tableData.data = res.content
-                this.tableData.total = res.totalElements
-            } catch (error) {
-                console.log(error)
-            }
-        }
+    effectTypeFilter(value) {
+      // eslint-disable-next-line eqeqeq
+      return couponEnum.effectType.find(item => item.value == value).label
     }
+  },
+  data() {
+    return {
+      tableData: {
+        data: [],
+        page: 0,
+        size: 10,
+        loading: false,
+        total: 0
+      },
+      couponId: null
+    }
+  },
+  mounted() {
+    this.getTableData()
+  },
+  methods: {
+    // 是否允许修改商品
+    toPath(path, row) {
+      this.$router.push({ path: path, query: row })
+    },
+    // 重置查询
+    resetHandle() {
+      this.page = 0
+      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,
+          shopId: localStorage.getItem('shopId')
+        })
+        this.tableData.loading = false
+        this.tableData.data = res.content
+        this.tableData.total = res.totalElements
+        console.log(this.tableData)
+      } catch (error) {
+        console.log(error)
+      }
+    },
+
+    /**
+     * 查看领取详情
+     */
+    couponDetailsOpen(row) {
+      this.$refs.couponDetails.show(row)
+      this.couponId = row.id
+    },
+
+    /**
+     * 删除优惠券
+     * @param id
+     */
+    async delTableHandle(id) {
+      const delRes = await delTbShopCoupon(id)
+      console.log(delRes)
+      this.getTableData()
+    }
+  }
 }
-</script>
\ No newline at end of file
+</script>