diff --git a/src/api/activity.ts b/src/api/activity.ts
new file mode 100644
index 0000000..c1559e6
--- /dev/null
+++ b/src/api/activity.ts
@@ -0,0 +1,58 @@
+
+import request from '@/utils/request'
+
+export interface IActivityData {
+  _id?: string
+  shop: string
+  name: string
+  desc?: string
+  qtypes: string[]
+  qcount: number
+  repeatType: number
+  eventDays: number[]
+  beginTime: number[]
+  prepareTime: number
+  active: number
+}
+
+export const defaultActivityData: IActivityData = {
+  active: 0,
+  beginTime: [],
+  eventDays: [],
+  name: '',
+  prepareTime: 0,
+  qcount: 0,
+  qtypes: [],
+  repeatType: 0,
+  shop: ''
+
+}
+
+export const getActivitys = (params: any) =>
+  request({
+    url: '/activitys',
+    method: 'post',
+    params
+  })
+
+export const getActivity = (id: string, params: any) =>
+  request({
+    url: `/activity/${id}`,
+    method: 'get',
+    params
+  })
+
+
+export const saveActivity = (data: any) =>
+  request({
+    url: '/activity/save',
+    method: 'post',
+    data
+  })
+
+export const deleteActivity = (id: string) =>
+  request({
+    url: `/activity/${id}/delete`,
+    method: 'post'
+  })
+
diff --git a/src/lang/en.ts b/src/lang/en.ts
index 1d35a4b..8cc69de 100644
--- a/src/lang/en.ts
+++ b/src/lang/en.ts
@@ -84,7 +84,10 @@ export default {
     game_setting: 'Game Setting',
     game: 'Game',
     game_list: 'Game List',
-    game_edit: 'Game Info'
+    game_edit: 'Game Info',
+    activity_list: 'Activity List',
+    create_activity: 'New Activity',
+    edit_activity: 'Edit Activity'
   },
   navbar: {
     logOut: 'Log Out',
diff --git a/src/lang/zh.ts b/src/lang/zh.ts
index d25fc4c..20127d9 100644
--- a/src/lang/zh.ts
+++ b/src/lang/zh.ts
@@ -84,7 +84,10 @@ export default {
     game_setting: '游戏设置',
     game: '游戏信息',
     game_list: '游戏列表',
-    game_edit: '编辑游戏'
+    game_edit: '编辑游戏',
+    activity_list: '活动列表',
+    create_activity: '新建活动',
+    edit_activity: '编辑活动'
   },
   navbar: {
     logOut: '退出登录',
diff --git a/src/router/modules/shop.ts b/src/router/modules/shop.ts
index 489cb1d..e84e4cf 100644
--- a/src/router/modules/shop.ts
+++ b/src/router/modules/shop.ts
@@ -29,7 +29,38 @@ const shopRoutes: RouteConfig = {
         permissions: ['question:read'],
         icon: 'game'
       }
-    }
+    },
+    {
+      path: 'activity_list',
+      component: () => import('@/views/activity/list.vue'),
+      name: 'ActivityList',
+      meta: {
+        title: 'activity_list',
+        permissions: ['activity:read'],
+        icon: 'list'
+      }
+    },
+    {
+      path: 'activity_new',
+      component: () => import('@/views/activity/edit.vue'),
+      name: 'CreateActivity',
+      meta: {
+        title: 'create_activity',
+        icon: 'edit',
+        hidden: true
+      }
+    },
+    {
+      path: 'activity_edit/:id',
+      component: () => import('@/views/activity/edit.vue'),
+      name: 'ActivityEditor',
+      meta: {
+        title: 'edit_activity',
+        permissions: ['question:read'],
+        elicon: 'el-icon-arrow-right',
+        hidden: true
+      }
+    },
   ]
 }
 
diff --git a/src/views/activity/edit.vue b/src/views/activity/edit.vue
new file mode 100644
index 0000000..ee2a5de
--- /dev/null
+++ b/src/views/activity/edit.vue
@@ -0,0 +1,236 @@
+<template>
+  <div class="app-container">
+    <el-form
+        ref="postForm"
+        :model="postForm"
+        :rules="rules"
+        label-width="121px"
+        class="form-container"
+    >
+      <el-form-item label="店铺" prop="key">
+        <el-select
+            v-model="postForm.shop"
+            placeholder="选择店铺"
+            name="shop"
+            required
+            class="w100"
+        >
+          <el-option
+              v-for="item in allDepts"
+              :key="item._id"
+              :label="item.name"
+              :value="item._id"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item
+          style="margin-bottom: 40px;"
+          label="活动名称:"
+          prop="name"
+      >
+        <el-input
+            v-model="postForm.name"
+            placeholder="输入活动名称"
+            name="name"
+            required
+        />
+      </el-form-item>
+      <el-form-item
+          style="margin-bottom: 40px;"
+          label="活动简介:"
+          prop="desc"
+      >
+        <el-input
+            v-model="postForm.desc"
+            placeholder="输入活动简介"
+            name="desc"
+            required
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button
+            type="primary"
+            @click="submitForm"
+        >
+          保存
+        </el-button>
+        <el-button @click="onCancel">
+          取消
+        </el-button>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script lang="ts">
+import { Component, Vue } from 'vue-property-decorator'
+import { AppModule } from '@/store/modules/app'
+import { TagsViewModule, ITagView } from '@/store/modules/tags-view'
+import MaterialInput from '@/components/MaterialInput/index.vue'
+import Sticky from '@/components/Sticky/index.vue'
+import UploadImage from '@/components/UploadImage/index.vue'
+import RegionPicker from '@/components/RegionPicker/index.vue'
+import { Form } from 'element-ui'
+import { defaultShopData, getShop, getShops, saveShop } from '@/api/shop'
+import { addressToLoc, IAreaData, queryArea } from '@/api/map'
+import { defaultActivityData, getActivity, saveActivity } from '@/api/activity'
+
+@Component({
+  name: 'ActivityEditor',
+  components: {
+    MaterialInput,
+    Sticky,
+    UploadImage,
+    RegionPicker
+  }
+})
+export default class extends Vue {
+
+  private validateRequire = (rule: any, value: string, callback: Function) => {
+    if (value === '') {
+      if (rule.field === 'imageURL') {
+        this.$message({
+          message: 'Upload cover image is required',
+          type: 'error'
+        })
+      } else {
+        this.$message({
+          message: rule.field + ' 是必填的',
+          type: 'error'
+        })
+      }
+      callback(new Error(rule.field + ' 是必填的'))
+    } else {
+      callback()
+    }
+  }
+
+
+  private postForm = Object.assign({}, defaultActivityData)
+  private loading = false
+  private querying = false
+  private allDepts = []
+  private rules = {
+    name: [{ validator: this.validateRequire }],
+  }
+
+  private tempTagView?: ITagView
+
+
+  get lang() {
+    return AppModule.language
+  }
+
+
+  created() {
+    const id = this.$route.params?.id
+    if (id) {
+      this.fetchData(id)
+    }
+    this.tempTagView = Object.assign({}, this.$route)
+    this.getRemoteDeptList()
+  }
+
+  deactivated() {
+  }
+
+  activated() {
+  }
+
+  private async fetchData(id: string) {
+    try {
+      const { data } = await getActivity(id, { /* Your params here */ })
+      console.log(data)
+      this.postForm = data
+      // Just for test
+      const title = this.lang === 'zh' ? '编辑活动' : 'Edit Activity'
+      // Set tagsview title
+      this.setTagsViewTitle(title)
+      // Set page title
+      this.setPageTitle(title)
+    } catch (err) {
+      console.error(err)
+    }
+  }
+
+  private setTagsViewTitle(title: string) {
+    const tagView = this.tempTagView
+    if (tagView) {
+      tagView.title = `${title}-${this.postForm._id}`
+      TagsViewModule.updateVisitedView(tagView)
+    }
+  }
+
+  private setPageTitle(title: string) {
+    document.title = `${title} - ${this.postForm._id}`
+  }
+
+  private async submitForm() {
+    const form = <Form>this.$refs.postForm
+    try {
+      await form.validate()
+      this.loading = true
+      const { data } = await saveActivity(this.postForm)
+      this.postForm = data
+      this.loading = false
+      this.$notify({
+        title: 'Success',
+        message: 'The post save successfully',
+        type: 'success',
+        duration: 2000
+      })
+    } catch (err) {
+      console.error('Submit Error!')
+      return false
+    }
+  }
+  private async onCancel() {
+    try {
+      await this.$confirm('确认不保存当前活动信息?', 'Warning', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+      this.$store.dispatch("delView", this.$route)
+      this.$router.go(-1)
+    } catch (e) {
+
+    }
+
+  }
+  private async getRemoteDeptList() {
+    const { data } = await getShops({ })
+    if (!data.records) return
+    this.allDepts = data.records
+  }
+
+
+}
+</script>
+
+<style lang="scss" scoped>
+.createPost-container {
+  position: relative;
+
+  .createPost-main-container {
+    padding: 40px 45px 20px 50px;
+
+    .postInfo-container {
+      position: relative;
+      @include clearfix;
+      margin-bottom: 10px;
+
+      .postInfo-container-item {
+        float: left;
+      }
+    }
+  }
+
+  .word-counter {
+    width: 40px;
+    position: absolute;
+    right: 10px;
+    top: 0;
+  }
+}
+</style>
diff --git a/src/views/activity/list.vue b/src/views/activity/list.vue
new file mode 100644
index 0000000..ce43ea1
--- /dev/null
+++ b/src/views/activity/list.vue
@@ -0,0 +1,279 @@
+<template>
+  <div class="app-container">
+    <!-- filter -->
+    <el-form ref="filterForm" :inline="true" :model="filterForm" class="filter">
+      <el-form-item label="关键字" prop="key">
+        <el-input v-model="filterForm.key" placeholder="关键字"/>
+      </el-form-item>
+      <el-form-item label="店铺" prop="key">
+        <el-select
+            v-model="filterForm.shop"
+            placeholder="选择店铺"
+            name="shop"
+            required
+            class="w100"
+        >
+          <el-option
+              v-for="item in allDepts"
+              :key="item._id"
+              :label="item.name"
+              :value="item._id"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" @click="search">查询</el-button>
+        <el-button @click="resetFilterForm">重置</el-button>
+      </el-form-item>
+    </el-form>
+    <router-link to="/shop/activity_new">
+      <el-button
+          type="primary"
+          icon="el-icon-edit"
+      >
+        添加
+      </el-button>
+    </router-link>
+    <el-table
+        v-loading="listLoading"
+        :data="list"
+        border
+        fit
+        highlight-current-row
+        style="width: 100%;margin-top:30px;"
+    >
+      <el-table-column
+          width="180px"
+          align="center"
+          label="添加时间"
+      >
+        <template slot-scope="{row}">
+          <span>{{ row.createdAt | parseTime }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+          label="店铺"
+          prop="shop"
+          :formatter = "formatDept"
+      >
+      </el-table-column>
+      <el-table-column
+          min-width="200px"
+          label="名称"
+      >
+        <template slot-scope="{row}">
+          <router-link
+              :to="'/shop/activity_edit/'+row._id"
+              class="link-type"
+          >
+            <span>{{ row.name }}</span>
+          </router-link>
+        </template>
+      </el-table-column>
+
+      <el-table-column
+          label="是否启用"
+          prop="active"
+          :formatter="formatBool"
+      >
+      </el-table-column>
+
+      <el-table-column
+          align="center"
+          width="180"
+          label="操作"
+          fixed="right"
+      >
+        <template slot-scope="scope">
+          <router-link :to="'/shop/activity_edit/'+scope.row._id">
+            <el-button
+                type="primary"
+                size="small"
+                icon="el-icon-edit"
+            >
+              编辑
+            </el-button>
+          </router-link>
+          <el-button
+              type="danger"
+              size="small"
+              style="margin-left: 10px"
+              @click="handleDelete(scope)"
+          >
+            {{ $t('permission.delete') }}
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+        v-show="total>0"
+        :total="total"
+        :page.sync="listQuery.page"
+        :limit.sync="listQuery.limit"
+        @pagination="getList"
+    />
+  </div>
+</template>
+
+<script lang="ts">
+import { Component, Vue } from 'vue-property-decorator'
+import { IShopData } from '@/api/types'
+import Pagination from '@/components/Pagination/index.vue'
+import { deleteShop, getShops } from '@/api/shop'
+import { parseTime } from '@/utils'
+import { Form } from 'element-ui'
+import {
+  deleteQuestion, getAllCategory,
+  getAllTags,
+  getQuestions,
+  IQuestionData
+} from '@/api/question'
+import { deleteActivity, getActivitys } from '@/api/activity'
+
+@Component({
+  name: 'ActivityList',
+  components: {
+    Pagination
+  },
+  filters: {
+    parseTime: (timestamp: string) => {
+      return parseTime(timestamp)
+    },
+    parseDate: (timestamp: string) => {
+      if (!timestamp) {
+        return '-'
+      }
+      return parseTime(timestamp, '{y}-{m}-{d}')
+    },
+    formatCount: (count: string) => {
+      if (!count) {
+        return 0
+      }
+      return count
+    }
+  }
+})
+
+export default class extends Vue {
+  private total = 0
+  private list: IQuestionData[] = []
+  private listLoading = true
+  private allDepts = []
+  private listQuery = {
+    page: 1,
+    limit: 20,
+    key: '',
+    shop: '',
+  }
+  private typeOptions: any[] = []
+  private tagSet: Set<string> = new Set()
+  private tagOptions: string[] = []
+  private filterForm = {
+    key: '',
+    shop: ''
+  }
+
+  created() {
+    this.getList()
+    this.getRemoteDeptList()
+    this.getRemoteCategory()
+  }
+
+
+  private async getList() {
+    this.listLoading = true
+    const { data } = await getActivitys(this.listQuery)
+    this.listLoading = false
+    this.list = data.records
+    this.total = data.total
+  }
+
+  private async handleDelete(scope: any) {
+    const { $index, row } = scope
+    await this.$confirm('确认删除该记录?', 'Warning', {
+      confirmButtonText: '确定',
+      cancelButtonText: '取消',
+      type: 'warning'
+    })
+    await deleteActivity(row._id)
+    this.list.splice($index, 1)
+    this.$message({
+      type: 'success',
+      message: '删除成功!'
+    })
+  }
+
+  private search() {
+    this.filterData()
+  }
+
+  private filterData() {
+    this.listQuery.key = this.filterForm.key
+    this.listQuery.shop = this.filterForm.shop
+    this.listQuery.page = 1
+    this.getList()
+  }
+
+  private resetFilterForm() {
+    const ref = <Form>this.$refs.filterForm
+    ref.resetFields()
+  }
+  private async getRemoteDeptList() {
+    const { data } = await getShops({ })
+    if (!data.records) return
+    this.allDepts = data.records
+  }
+  private async getRemoteTags() {
+    let { data } = await getAllTags()
+    console.log(data)
+    this.tagSet = new Set(data)
+    this.tagOptions = data
+  }
+
+  private async getRemoteCategory() {
+    let {data} = await getAllCategory()
+    for (let cat of data) {
+      let subArr = []
+      for (let s of cat.children) {
+        subArr.push({
+          value: s._id,
+          label: s.name
+        })
+      }
+      this.typeOptions.push({
+        value: cat._id,
+        label: cat.name,
+        children: subArr
+      })
+    }
+  }
+  private formatDept(row: number, column: number, cellValue: string, index: number) {
+    let result = '未指定'
+    for (const dep of this.allDepts) {
+      if (dep._id == cellValue) {
+        result = dep.name
+        break
+      }
+    }
+    return result
+  }
+  private formatBool(row: number, column: number, cellValue: boolean, index: number) {
+    return cellValue? '是' : '否'
+  }
+
+}
+</script>
+
+<style lang="scss" scoped>
+.edit-input {
+  padding-right: 100px;
+}
+
+.cancel-btn {
+  position: absolute;
+  right: 15px;
+  top: 10px;
+}
+
+</style>