diff --git a/src/api/ebiz/congratulation/congratulation.js b/src/api/ebiz/congratulation/congratulation.js
new file mode 100644
index 000000000..b5a72db76
--- /dev/null
+++ b/src/api/ebiz/congratulation/congratulation.js
@@ -0,0 +1,10 @@
+import request from '@/assets/js/utils/request'
+import getUrl from '@/assets/js/utils/get-url'
+
+export function getCongratulationList(data) {
+  return request({
+    url: getUrl('/data/performance/getAgentTop', 1),
+    method: 'post',
+    data
+  })
+}
diff --git a/src/router/ebiz/congratulation.js b/src/router/ebiz/congratulation.js
new file mode 100644
index 000000000..69b6c3f99
--- /dev/null
+++ b/src/router/ebiz/congratulation.js
@@ -0,0 +1,34 @@
+//保全 定义相关组件
+const congratulationTop = () => import('@/views/ebiz/congratulation/CongratulationTop')
+const congratulationList = () => import('@/views/ebiz/congratulation/CongratulationList')
+const congratulationPreview = () => import('@/views/ebiz/congratulation/CongratulationPreview')
+
+export default [
+  {
+    path: '/congratulation/congratulationTop',
+    name: 'congratulationTop',
+    component: congratulationTop,
+    meta: {
+      title: '上头条',
+      index: 1
+    }
+  },
+  {
+    path: '/congratulation/congratulationList',
+    name: 'congratulationList',
+    component: congratulationList,
+    meta: {
+      title: '大榜单',
+      index: 2
+    }
+  },
+  {
+    path: '/congratulation/congratulationPreview',
+    name: 'congratulationPreview',
+    component: congratulationPreview,
+    meta: {
+      title: '大榜单',
+      index: 3
+    }
+  }
+]
diff --git a/src/router/ebiz/index.js b/src/router/ebiz/index.js
index 599312aeb..7f6316185 100644
--- a/src/router/ebiz/index.js
+++ b/src/router/ebiz/index.js
@@ -11,6 +11,7 @@ import agentEenter from './agentEenter.js'
 import milestone from './milestone'
 import poster from './poster'
 import claims from './claims'
+import congratulation from './congratulation'
 import report from './report'
 import nbs from './nbs'
 import survey from './survey'
@@ -48,5 +49,6 @@ export default [
   ...question,
   ...preserve,
   ...performance,
-  ...attendance
+  ...attendance,
+  ...congratulation
 ] //根据需要进行删减
diff --git a/src/views/ebiz/congratulation/CongratulationList.vue b/src/views/ebiz/congratulation/CongratulationList.vue
new file mode 100644
index 000000000..ed4842d30
--- /dev/null
+++ b/src/views/ebiz/congratulation/CongratulationList.vue
@@ -0,0 +1,141 @@
+<template>
+  <div class="poster-list-container">
+    <!-- <van-sticky>
+      <van-tabs :line-width="45" v-model="active" @change="tabChange" sticky>
+        <van-tab :name="index" :title="item.name" v-for="(item, index) in posterTypeList" :key="index">-->
+    <!-- <img src="@/assets/images/u10199.png" /> -->
+    <!-- </van-tab>
+      </van-tabs>
+    </van-sticky> -->
+
+    <van-grid class="grid-box" :border="false" :column-num="3" :gutter="10">
+      <!-- <van-grid-item v-for="(item, index) in posterList" :key="index">
+        <img :src="item.posterNarrowUrl | urlFormat" @click="posterPreview(item.posterId, item.posterType)" />
+        <img src="@/assets/images/banner.png" @click="posterPreview(item.posterId)" />
+      </van-grid-item> -->
+      <van-grid-item v-for="(item, index) in 10" :key="index">
+        <img src="@/assets/images/banner.png" @click="posterPreview(item.posterId)" />
+      </van-grid-item>
+    </van-grid>
+    <!-- <van-pagination v-model="pageNum" :page-count="pageCount" @change="change" class="bottom-btn" style="background-color:#fff" v-if="pageCount - 1" /> -->
+    <!-- <van-pagination v-model="pageNum" :total-items="24" :items-per-page="5" /> -->
+  </div>
+</template>
+
+<script>
+import { Sticky, Grid, GridItem, Pagination } from 'vant'
+import { getPosterList } from '@/api/ebiz/poster/poster'
+import config from '@/config'
+export default {
+  name: 'posterList',
+  components: {
+    [Sticky.name]: Sticky,
+    [Grid.name]: Grid,
+    [GridItem.name]: GridItem,
+    [Pagination.name]: Pagination
+  },
+  data() {
+    return {
+      // posterTypeList: [], //贺报类型
+      active: '0',
+      posterType: 'congratulation',
+      srcUrl: '@/images/u10199.png',
+      pageNum: 1,
+      pageSize: 9,
+      posterList: [], // 贺报列表
+      pageCount: 1
+    }
+  },
+  created() {
+    // this.getPosterTypeList()
+    this.getPosterList()
+  },
+  methods: {
+    // 获取贺报类型
+    // async getPosterTypeList() {
+    //   let res = await getPosterType({})
+    //   if (res.result == 0) {
+    //     // this.posterTypeList = res.content.paterTypeList
+    //     // this.posterType = res.content.paterTypeList[0].code
+    //     this.getPosterList()
+    //   } else {
+    //     this.$toast(res.resultMessage)
+    //   }
+    // },
+    // 贺报列表查询
+    async getPosterList() {
+      let param = {
+        posterInfoDTO: {
+          posterType: this.posterType
+        },
+        pageNum: this.pageNum,
+        pageSize: this.pageSize
+      }
+
+      console.log(param)
+      let res = await getPosterList(param)
+      if (res.result == 0) {
+        this.pageCount = Math.ceil(res.pageInfo.total / 9)
+        this.posterList = res.pageInfo.list
+      } else {
+        this.$toast(res.resultMessage)
+      }
+    },
+    // tabChange(name, title) {
+    //   this.posterType = this.posterTypeList[name].code
+    //   this.pageNum= 1,
+    //   this.posterList=[],
+    //   this.pageCount = 1
+    //   this.getPosterList()
+    //   console.log(name, title)
+    // },
+    change() {
+      this.getPosterList()
+      console.log(this.pageNum)
+    },
+    posterPreview(id) {
+      this.$jump({
+        flag: 'h5',
+        extra: {
+          url: location.origin + `/#/congratulation/congratulationPreview?id=${id}`
+        },
+        routerInfo: {
+          path: `/congratulation/congratulationPreview?id=${id}`
+        }
+      })
+    }
+  },
+  filters: {
+    urlFormat(url) {
+      console.log((config.imgDomain + `/returnImageStream?a=b.jpg&imgPath=${url}`).replace(/\+/g, '%2B'))
+      return (config.imgDomain + `/returnImageStream?a=b.jpg&imgPath=${url}`).replace(/\+/g, '%2B')
+    }
+  }
+}
+</script>
+
+<style scoped>
+.grid-box {
+  margin-bottom: 10px;
+}
+
+.poster-list-container {
+  padding: 10px 0;
+}
+
+.poster-list-container img {
+  width: 100%;
+}
+.poster-list-container >>> .van-pagination__item--active {
+  background-color: #e9332e;
+}
+.poster-list-container >>> .van-pagination__item {
+  color: #e9332e;
+}
+.poster-list-container >>> .van-pagination__item--active {
+  color: #fff;
+}
+.poster-list-container >>> .van-pagination__item--disabled {
+  color: #7d7e80;
+}
+</style>
diff --git a/src/views/ebiz/congratulation/CongratulationPreview.vue b/src/views/ebiz/congratulation/CongratulationPreview.vue
new file mode 100644
index 000000000..d4c2d634e
--- /dev/null
+++ b/src/views/ebiz/congratulation/CongratulationPreview.vue
@@ -0,0 +1,73 @@
+<template>
+  <div class="poster-preview-container">
+    <div class="flex align-items-c justify-content-c top30 relative">
+      <img class="w300" :src="imgPath | urlFormat" alt="" />
+    </div>
+  </div>
+</template>
+
+<script>
+import { getPosterInfo } from '@/api/ebiz/poster/poster'
+// import { getAgentInfo } from '@/api/ebiz/my/my'
+import config from '@/config'
+export default {
+  name: 'congratulationPreview',
+  data() {
+    let isWeixin = this.$utils.device().isWeixin //判断环境
+    return {
+      srcUrl: '',
+      isWeixin,
+      id: '',
+      posterType: 'congratulation',
+      posterInfo: {},
+      userName: '', // 代理人姓名
+      userMobile: '', // 用户手机号
+      manageComName: '', // 公司名称
+      imgUrl: '', // 分享的图片
+      base64: '', // 分享的base64
+      imgPath: '',
+      isShow: false
+    }
+  },
+  async created() {
+    debugger
+    this.id = this.$route.query.id
+    if (this.isWeixin) {
+      localStorage.token = this.$route.query.token
+    }
+    // await this.getPosterDetail()
+  },
+  methods: {
+    async getPosterDetail() {
+      return new Promise((resolve, reject) => {
+        this.$toast.loading({
+          duration: 0, // 持续展示 toast
+          forbidClick: true, // 禁用背景点击
+          loadingType: 'spinner',
+          message: '加载中……'
+        })
+        getPosterInfo({
+          posterInfoDTO: {
+            posterId: this.id
+          }
+        }).then(res => {
+          if (res.result == 0) {
+            this.posterInfo = res.infoDTOList[0]
+            this.imgPath = this.posterInfo.posterUrl
+            resolve()
+          } else {
+            reject()
+          }
+        })
+      })
+    }
+  },
+  filters: {
+    urlFormat(url) {
+      return (config.imgDomain + `/returnImageStream?a=b.jpg&imgPath=${url}`).replace(/\+/g, '%2B')
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/ebiz/congratulation/CongratulationTop.vue b/src/views/ebiz/congratulation/CongratulationTop.vue
new file mode 100644
index 000000000..18a2e2052
--- /dev/null
+++ b/src/views/ebiz/congratulation/CongratulationTop.vue
@@ -0,0 +1,189 @@
+<!-- 上头条 -->
+<template>
+  <div>
+    <div class="congratulationTop text-center" v-show="showData.topList.length !== 0">
+      <van-row><van-col class="congratulationTitle" span="24">全国TOP30本月业绩排名</van-col></van-row>
+      <div class="rankWrapper">
+        <van-row class="rankTitle">
+          <van-col span="3">排名</van-col>
+          <van-col span="4">姓名</van-col>
+          <van-col span="7">分公司</van-col>
+          <van-col span="5">预收标保</van-col>
+          <van-col span="5">承保标保</van-col>
+        </van-row>
+        <template>
+          <van-row v-for="(item, index) in showData.topList" :key="item.code" class="rankLine" :class="{ top3: index <= 2 }">
+            <van-col class="rankCell bl" span="3">{{ index + 1 }}</van-col>
+            <van-col class="rankCell" span="4">{{ item.name }}</van-col>
+            <van-col class="rankCell" span="7">{{ item.comName }}</van-col>
+            <van-col class="rankCell" span="5">{{ item.ysbb }}</van-col>
+            <van-col class="rankCell" span="5">{{ item.bzbf }}</van-col>
+          </van-row>
+        </template>
+      </div>
+
+      <div class="deadline">
+        <span>数据截止时间:{{ deadline }}</span>
+        <span>单位:万元</span>
+      </div>
+      <van-row>
+        <van-col span="24" class="detail score">您的业绩</van-col>
+        <van-col span="20" offset="2" style="border-bottom: 1px solid #ff4040;"></van-col>
+        <van-col span="24" class="detail">您本月预收标保{{ showData.achievement.selfAdvanceStand }}万元</van-col>
+        <van-col span="24" class="detail">您本月承保标保{{ showData.achievement.selfAcceptStand }}万元</van-col>
+        <van-col span="24" class="detail">全系统排名第{{ showData.achievement.ranking }}名</van-col>
+        <van-col span="24" class="detail">距上一名差距{{ showData.achievement.previousGap }}元</van-col>
+      </van-row>
+      <van-button color="#ff4d4d" class="bottom-btn" @click="nextStep" v-no-more-click="1000">大单榜</van-button>
+    </div>
+    <van-loading v-if="showData.topList.length === 0" class="loading" size="24px" vertical>数据加载中...</van-loading>
+  </div>
+</template>
+
+<script>
+import { Col, Row, Loading } from 'vant'
+import { getCongratulationList } from '@/api/ebiz/congratulation/congratulation.js'
+import dateUtil from '@/assets/js/utils/date-utils.js'
+
+export default {
+  name: 'congratulationTop',
+  filters: {},
+  data() {
+    return {
+      showData: {
+        achievement: {
+          selfAdvanceStand: '',
+          selfAcceptStand: '',
+          ranking: '',
+          previousGap: ''
+        },
+        topList: []
+      }
+    }
+  },
+  computed: {
+    deadline() {
+      let now = new Date()
+      let deadlineTime = now.getTime() - 1000 * 3600
+      return dateUtil.formatDate(new Date(deadlineTime), 'yyyy-MM-dd HH:mm')
+    }
+  },
+  created() {
+    this.init()
+  },
+  methods: {
+    async init() {
+      let currMonth = dateUtil.formatDate(new Date(), 'yyyy-MM-dd')
+      let data = await getCongratulationList({ date: currMonth, queryType: 'm' })
+      let result = data.content
+      let topList = result.list.splice(0, 30)
+      topList.map(value => {
+        value.comName = value.comName.substr(12)
+        return value
+      })
+      this.showData.topList.push(...topList)
+      this.showData.achievement.selfAdvanceStand = result.ysbb
+      this.showData.achievement.selfAcceptStand = result.bzbf
+      this.showData.achievement.ranking = result.top
+      this.showData.achievement.previousGap = result.xcbf
+    },
+    nextStep() {
+      this.$jump({
+        flag: 'h5',
+        extra: {
+          url: location.origin + `/#/congratulation/congratulationList`
+        },
+        routerInfo: {
+          path: `/congratulation/congratulationList`
+        }
+      })
+    }
+  },
+  components: {
+    [Col.name]: Col,
+    [Row.name]: Row,
+    [Loading.name]: Loading
+  }
+}
+</script>
+
+<style scoped="scoped" lang="scss">
+$border: 1px solid #ff4040;
+
+.congratulationTop {
+  background-color: #fff;
+  height: 100vh;
+}
+
+.congratulationTitle {
+  height: 60px;
+  font-size: 30px;
+  text-shadow: 1px 1px 5px #333;
+}
+
+.rankTitle {
+  font-size: 14px;
+  position: sticky;
+  top: 0;
+}
+
+.rankTitle,
+.congratulationTitle {
+  background-color: #ff4040;
+  color: #ffffff;
+  line-height: 2em;
+}
+
+.rankLine {
+  font-size: 14px;
+  line-height: 2em;
+  border-top: $border;
+}
+
+.rankWrapper {
+  max-height: 300px;
+  overflow: auto;
+  margin-top: 3px;
+  border-bottom: $border;
+}
+
+.rankTable {
+  border-collapse: collapse;
+}
+
+.rankCell {
+  border-right: $border;
+}
+
+.deadline {
+  font-size: 14px;
+  display: flex;
+  justify-content: space-between;
+  line-height: 2em;
+}
+
+.detail {
+  color: #ff4040;
+  line-height: 2.5em;
+}
+
+.score {
+  text-shadow: 1px 1px 5px #000;
+  font-weight: bold;
+}
+
+.loading {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+
+.bl {
+  border-left: $border;
+}
+
+.top3 {
+  color: #ff9900;
+}
+</style>