diff --git a/src/router/ebiz/institutionalPerform.js b/src/router/ebiz/institutionalPerform.js
index d6f75f023..00093131d 100644
--- a/src/router/ebiz/institutionalPerform.js
+++ b/src/router/ebiz/institutionalPerform.js
@@ -9,6 +9,7 @@ const ServiceDepartOffice = () => import('@/views/ebiz/institutionalPerform/Serv
 const RegionalOffice = () => import('@/views/ebiz/institutionalPerform/RegionalOffice')
 
 const InstitutionalManpower = () => import('@/views/ebiz/institutionalPerform/InstitutionalManpower')
+const institutionalPerform = () => import('@/views/ebiz/institutionalPerform/institutionalPerform')
 export default [
   // 分公司
   {
@@ -91,20 +92,21 @@ export default [
     }
   },
   {
-    //活动人力
-    path: '/institutionalPerform/institutionalManpower/:manageLv/:manageCode',
+    path: '/institutionalPerform/InstitutionalManpower/:manageLv/:manageCode',
     name: 'InstitutionalManpower',
     component: InstitutionalManpower,
     meta: {
       title: '机构业绩',
       index: 1
     }
-    // children: [
-    //   {
-    //     path: '/:manageCode',
-    //     component: InstitutionalManpower,
-    //     name: 'InstitutionalManpower1'
-    //   }
-    // ]
+  },
+  {
+    path: '/institutionalPerform/InstitutionalPerform/:manageLv/:manageCode',
+    name: 'institutionalPerform',
+    component: institutionalPerform,
+    meta: {
+      title: '机构业绩',
+      index: 1
+    }
   }
 ]
diff --git a/src/views/ebiz/institutionalPerform/InstitutionalManpower/index.vue b/src/views/ebiz/institutionalPerform/InstitutionalManpower/index.vue
index 8c00cfa2b..b9b8c4e79 100644
--- a/src/views/ebiz/institutionalPerform/InstitutionalManpower/index.vue
+++ b/src/views/ebiz/institutionalPerform/InstitutionalManpower/index.vue
@@ -124,7 +124,10 @@ export default {
     reload () {
       this.manageLv=this.$route.params.manageLv;
     this.manageCode=this.$route.params.manageCode
-  
+     this.queryColumns.forEach(() => {
+         
+          this.items.push('0')
+        })
     this.getlComPremDetil()
     },
     formatterYear(type, val) {
@@ -138,7 +141,7 @@ export default {
       if (name == 0) {
         //this.curMainType = '02'
         this.$router.push({
-          path: '/institutionalPerform/UnderOffice'
+          path: '/institutionalPerform/InstitutionalPerform/02/8645'
         })
       } 
      
diff --git a/src/views/ebiz/institutionalPerform/institutionalPerform/components/Selectors.vue b/src/views/ebiz/institutionalPerform/institutionalPerform/components/Selectors.vue
new file mode 100644
index 000000000..d8abc55db
--- /dev/null
+++ b/src/views/ebiz/institutionalPerform/institutionalPerform/components/Selectors.vue
@@ -0,0 +1,199 @@
+<template>
+  <div>
+    <van-tabs @click="onClickRabs" type="card" class="pl20 pr20 pt10 pb10 bg-red1">
+      <van-tab title="实时"></van-tab>
+      <van-tab @click="showDatePicker = true" title="日"></van-tab>
+      <van-tab title="月"></van-tab>
+      <van-tab title="年"></van-tab>
+    </van-tabs>
+    <div class="p10 pl40 pr40">
+      <!-- 年月日选择 -->
+
+      <van-row>
+        <van-col span="3">
+          <img :src="require('@/assets/images/ebiz/calendar.png')" />
+        </van-col>
+        <van-col class="fs14 mp2" span="9" @click="showMonthPicker = true"><span v-if="showText">截至</span>{{ timeVal }}</van-col>
+        <van-col span="3">
+          <img style="margin-top: 2px;" :src="require('@/assets/images/ebiz/point.png')" />
+        </van-col>
+        <van-col span="9">
+          <span class="fs14" @click="showPicker = true">{{ sortTypeText }}</span>
+        </van-col>
+        <van-popup v-model="showPicker" position="bottom">
+          <van-picker show-toolbar :columns="queryColumns" @confirm="onConfirm" @cancel="showPicker = false" />
+        </van-popup>
+      </van-row>
+    </div>
+    <!-- 时间选择器 -->
+    <!-- 日 -->
+    <van-popup v-model="showDatePicker" position="bottom">
+      <van-datetime-picker
+        v-model="currentDate"
+        type="date"
+        :min-date="minDate"
+        :max-date="maxDate"
+        @confirm="onConfirmDate"
+        @cancel="showDatePicker = false"
+      />
+    </van-popup>
+    <!-- 月 -->
+    <van-popup v-model="showMonthPicker" position="bottom">
+      <van-datetime-picker
+        v-model="currentMonthDate"
+        type="year-month"
+        :min-date="minDate"
+        :max-date="maxDate"
+        :formatter="formatter"
+        @confirm="onConfirmDate"
+        @cancel="showMonthPicker = false"
+      />
+    </van-popup>
+    <!-- 年 -->
+    <van-popup v-model="showYearPicker" position="bottom">
+      <van-picker v-model="currentYearDate" show-toolbar :columns="YearColumns" @confirm="onConfirmDate" @cancel="showYearPicker = false" />
+    </van-popup>
+    <!-- /时间选择器 -->
+  </div>
+</template>
+
+<script>
+let newArr = []
+import Vue from 'vue'
+import util from '@/views/ebiz/institutionalPerform/InstitutionalManpower/components/js/util'
+export default {
+  data() {
+    return {
+      timeVal: '',
+      shitimeVal: '',
+      sortTypeText: '预收保费',
+      showText: true,
+      showPicker: false,
+      YearColumns: ['2020', '2019'],
+      minDate: new Date(2019, 0, 1),
+      maxDate: new Date(2020, 10, 1),
+      currentMonthDate: new Date(),
+      currentYearDate: new Date(),
+      currentDate: new Date(),
+      // 年月日选择器
+      showDatePicker: false,
+      showMonthPicker: false,
+      showYearPicker: false
+    }
+  },
+  components: {},
+  name: 'Selectors',
+  props: {
+    queryColumns: {
+      type: Array,
+      default: ''
+    }
+  },
+  created() {
+    this.getCurrentDate()
+  },
+
+  methods: {
+    onClickRabs(name, title) {
+      this.curTab = name
+      if (name == 1) {
+        this.showDatePicker = true
+      } else if (name == 2) {
+        this.showMonthPicker = true
+      } else if (name == 3) {
+        this.showYearPicker = true
+      } else {
+        // "截至"文字显示出来
+        this.showText = true
+        // 实时的时候date清空
+        this.dateType = 'now'
+        this.dateVal = ''
+        // 左侧时间实时赋值
+        this.timeVal = this.shitimeVal
+        // 调接口
+
+        this.$emit('getQueryType', this.dateType)
+      }
+    },
+    formatter(type, val) {
+      if (type === 'year') {
+        return `${val}年`
+      } else if (type === 'month') {
+        return `${val}月`
+      }
+      return val
+    },
+    //修改月、天的格式，保持两位数显示
+    add0(m) {
+      return m < 10 ? '0' + m : m
+    },
+    dateFormat(time) {
+      // 时间格式化 2019-09-08
+      let year = time.getFullYear()
+      let month = time.getMonth() + 1
+      let day = util.getLastDay(year, time.getMonth())
+      return year + '-' + this.add0(month) + '-' + this.add0(day)
+    },
+    onConfirm(value, index) {
+      this.sortTypeText = value
+      // switch (value) {
+      //   case this.queryColumns[0]:
+      //     this.sortType = '1'
+      //     break
+      //   case this.queryColumns[1]:
+      //     this.sortType = '2'
+      //     break
+      //   case this.queryColumns[2]:
+      //     this.sortType = '3'
+      //     break
+      //   case this.queryColumns[3]:
+      //     this.sortType = '4'
+      //     break
+      // }
+      this.$emit('getSortType', index + 1)
+      this.showPicker = false
+    },
+    getCurrentDate() {
+      var timeStr = ''
+      var curDate = new Date()
+      var curMonth = curDate.getMonth() + 1 //获取当前月份(0-11,0代表1月)
+      var curDay = curDate.getDate() //获取当前日(1-31)
+
+      var curHour = curDate.getHours() //获取当前小时数(0-23)
+      var curMinute = curDate.getMinutes() // 获取当前分钟数(0-59)
+      var curSec = curDate.getSeconds() //获取当前秒数(0-59)
+      if (curHour < 10) {
+        if (curMinute < 10) {
+          timeStr += ' 0' + curHour + ':0' + curMinute
+        } else {
+          timeStr += ' 0' + curHour + ':' + curMinute
+        }
+      } else {
+        if (curMinute < 10) {
+          timeStr += ' ' + curHour + ':0' + curMinute
+        } else {
+          timeStr += ' ' + curHour + ':' + curMinute
+        }
+      }
+      // 一直在获取时间
+      this.shitimeVal = this.add0(curMonth) + '-' + this.add0(curDay) + timeStr
+      // 存页面上值得一个变量
+      this.timeVal = this.shitimeVal
+    },
+    dateFormat(time) {
+      // 时间格式化 2019-09-08
+      let year = time.getFullYear()
+      let month = time.getMonth() + 1
+      let day = time.getDate()
+      return year + '-' + this.add0(month) + '-' + this.add0(day)
+    },
+    onConfirmDate(value, index) {
+      // 月
+      this.getCurrentDate()
+      this.$emit('getDateVal', this.dateVal)
+      this.showDatePicker = this.showMonthPicker = this.showYearPicker = false
+    }
+  }
+}
+</script>
+<style lang="scss" scoped></style>
diff --git a/src/views/ebiz/institutionalPerform/institutionalPerform/components/js/util.js b/src/views/ebiz/institutionalPerform/institutionalPerform/components/js/util.js
new file mode 100644
index 000000000..c9ad87785
--- /dev/null
+++ b/src/views/ebiz/institutionalPerform/institutionalPerform/components/js/util.js
@@ -0,0 +1,15 @@
+export default {
+  add0(m) {
+    return m < 10 ? '0' + m : m
+  },
+  getLastDay(y, m) {
+    y = y || new Date().getFullYear()
+    m = m || new Date().getMonth()
+    return new Date(y, m + 1, 0).getDate()
+  },
+  getMonthLastDay(y, m) {
+    y = y || new Date().getFullYear()
+    m = m || new Date().getMonth()
+    return y + '-' + this.add0(m + 1) + '-' + new Date(y, m + 1, 0).getDate()
+  }
+}
diff --git a/src/views/ebiz/institutionalPerform/institutionalPerform/css/InstitutionalManpower.scss b/src/views/ebiz/institutionalPerform/institutionalPerform/css/InstitutionalManpower.scss
new file mode 100644
index 000000000..0d9c95f28
--- /dev/null
+++ b/src/views/ebiz/institutionalPerform/institutionalPerform/css/InstitutionalManpower.scss
@@ -0,0 +1,8 @@
+.van-row {
+  line-height: 1.6rem;
+}
+.van-tabs__nav--card .van-tab {
+  &:last-child {
+    border-right: none !important;
+  }
+}
diff --git a/src/views/ebiz/institutionalPerform/institutionalPerform/index.vue b/src/views/ebiz/institutionalPerform/institutionalPerform/index.vue
new file mode 100644
index 000000000..5fdfe4c6e
--- /dev/null
+++ b/src/views/ebiz/institutionalPerform/institutionalPerform/index.vue
@@ -0,0 +1,378 @@
+<template>
+  <div v-cloak class="container">
+    <!-- <van-nav-bar left-text="机构业绩" left-arrow @click-left="onBack">
+      <template #right>
+        <img @click="getlComPremDetil" :src="refreshLogo" />
+      </template> -->
+    </van-nav-bar>
+    <!-- 业绩和人力 -->
+    <van-tabs @click="onClickMain" v-model="active" type="card" class="p0 title">
+      <van-tab title="机构业绩排名"></van-tab>
+      <van-tab title="机构人力排名"></van-tab>
+    </van-tabs>
+    <Selectors @getQueryType="getQueryType" @getDateVal="getDateVal" @getSortType="getSortType" :queryColumns="queryColumns"></Selectors>
+    <div class="layer-box">
+      <div class="layer">
+        <table class="fs14" style="table-layout:fixed;padding-left: 4.1em;">
+          <tr class="title">
+            <th class="td-1" style="height: 1.3em;">排名</th>
+            <th class="td-2">机构</th>
+            <th>{{ queryColumns[0]}}</th>
+            <th>{{ queryColumns[1]}}</th>
+            <th>{{ queryColumns[2]}}</th>
+            <th>{{ queryColumns[3]}}</th>
+
+            <th>{{ queryColumns[4]}}</th>
+
+            <th v-if="manageLv != '07'">操作</th>
+          </tr>
+          <tr >
+            <td class="td-1 white" style="width:3.2em;height: 1.3em;">1</td>
+            <td class="td-2">合计</td>
+            <td >{{ items[0]| toFixed(2) }}</td>
+            <td>{{ items[1]| toFixed(2) }}</td>
+            <td>{{ items[2]| toFixed(2) }}</td>
+            <td>{{ items[3]| toFixed(2) }}</td>
+             <td>{{ items[4]| toFixed(2) }}</td>
+           
+          </tr>
+          <tr v-for="(item, index) in tableData" :key="index">
+            <td class="td-1"><div>{{ index + 1 }}</div></td>
+            <td >
+              <div style="width:10em">{{ item.name }}</div>
+            </td>
+             <td>{{ item.ysbb| toFixed(2) }}</td>
+            <td>{{ item.bzbf| toFixed(2) }}</td>
+            <td>{{ item.cbbf| toFixed(2) }}</td>
+            <td>{{ item.ysjs| toFixed(2) }}</td>
+            <td>{{ item.cbjs| toFixed(2) }}</td>
+           
+            <td v-if="manageLv != '07'">
+              <span  @click="toDetail(item.code)" class="red1">查看</span>
+            </td>
+          </tr>
+        </table>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+// import { XTable } from 'vux'
+import Selectors from '@/views/ebiz/institutionalPerform/institutionalPerform/components/Selectors'
+import util from '@/views/ebiz/institutionalPerform/InstitutionalManpower/components/js/util'
+import { branchOfficeApi } from '@/api/ebiz/branchOffice/branchOffice'
+
+import { Tabs, Tab } from 'vant'
+export default {
+  name: 'InstitutionalManpower',
+  components: {
+    Selectors,
+    [Tabs.name]: Tabs,
+    [Tab.name]: Tab
+  },
+  data() {
+    return {
+      sortType: '1',
+      queryType:'now',
+      manageCode: '8645',
+      manageLv: '02',
+      tableData: [],
+      items: [],
+      bzbfTotol: 0,
+      queryColumns: ['预收保费','承保标保 ', '承保保费', '预收件数', '承保件数'],
+      active: 0,
+      // 当前的机构编码
+      curCode: '',
+      dateType: 'm',
+      dateVal: '',
+      curTab: '',
+      shitimeVal: '',
+      curMainType: '02'
+    }
+  },
+   filters: {
+    toFixed(value) {
+      return Number(value).toFixed(2)
+    }
+  },
+  watch: {
+     '$route' (to, from) {
+    this.reload()
+    },
+    tableData(value) {
+         
+      if (value)  {
+        let sum1 = 0
+        let sum2 = 0
+        let sum3 = 0
+        let sum4 = 0
+        let sum5 = 0
+        this.tableData.forEach(item => {
+          sum1 = Number(sum1) + Number(item.ysbb)
+          sum2 = Number(sum2) + Number(item.bzbf)
+          sum3 = Number(sum3) + Number(item.cbbf)
+          sum4 = Number(sum4) + Number(item.ysjs)
+          sum5 = Number(sum5) + Number(item.cbjs)
+          this.items = [sum1, sum2, sum3, sum4,sum5]
+        })
+        this.items = this.items.map(item => {
+          return item
+        })
+      }
+    }
+  },
+  methods: {
+    reload () {
+      this.manageLv=this.$route.params.manageLv;
+    this.manageCode=this.$route.params.manageCode
+    this.queryColumns.forEach(() => {
+         
+          this.items.push('0.00')
+        })
+    this.getlComPremDetil()
+    },
+    formatterYear(type, val) {
+      if (type === 'year') {
+        return val + '年'
+      }
+      return val
+    },
+
+    onClickMain(name) {
+      if (name == 1) {
+        //this.curMainType = '02'
+        this.$router.push({
+          path: '/institutionalPerform/InstitutionalManpower/02/8645'
+        })
+      } 
+     
+    },
+
+    toDetail(manageCode) {
+     
+    
+      let manageLv = '0' + (Number(this.manageLv) + 1)
+      // this.manageCode = manageCode
+       console.log(`/institutionalPerform/institutionalManpower/${manageLv}/${manageCode}`)
+      
+       this.$router.push(`/institutionalPerform/institutionalPerform/${manageLv}/${manageCode}`) ;
+         this.manageLv=this.$route.params.manageLv;
+    this.manageCode=this.$route.params.manageCode
+    console.log('this.manageLv',this.manageLv)
+    this.getlComPremDetil()
+       
+    },
+
+    getCurrentDate() {
+      var timeStr = ''
+      var curDate = new Date()
+      var curMonth = curDate.getMonth() + 1 //获取当前月份(0-11,0代表1月)
+      var curDay = curDate.getDate() //获取当前日(1-31)
+
+      var curHour = curDate.getHours() //获取当前小时数(0-23)
+      var curMinute = curDate.getMinutes() // 获取当前分钟数(0-59)
+      var curSec = curDate.getSeconds() //获取当前秒数(0-59)
+      if (curHour < 10) {
+        if (curMinute < 10) {
+          timeStr += ' 0' + curHour + ':0' + curMinute
+        } else {
+          timeStr += ' 0' + curHour + ':' + curMinute
+        }
+      } else {
+        if (curMinute < 10) {
+          timeStr += ' ' + curHour + ':0' + curMinute
+        } else {
+          timeStr += ' ' + curHour + ':' + curMinute
+        }
+      }
+      // 一直在获取时间
+      this.shitimeVal = this.add0(curMonth) + '-' + this.add0(curDay) + timeStr
+      // 存页面上值得一个变量
+      this.timeVal = this.shitimeVal
+    },
+
+    onBack() {
+      this.$router.go(-1)
+    },
+    getQueryType(value) {
+      console.log(value, 'value')
+      this.queryType = value
+     
+      this.getlComPremDetil()
+    },
+    getSortType(value) {
+      console.log(value, 'value')
+      this.sortType = value.toString()
+     
+      this.getlComPremDetil()
+    },
+    getDateVal(value) {
+      this.dateVal = value
+     
+      this.getlComPremDetil()
+    },
+    //获取列表
+    getlComPremDetil() {
+      let $this = this
+      let data = {
+        manageLv: this.manageLv,
+        manageCode: this.manageCode,
+        sortType: this.sortType,
+        queryType: this.queryType,
+        date: this.dateVal, // 2020-07-31
+        type: '01'
+      }
+
+      if(this.queryType=='now'){
+      delete data['date']
+      }
+      // 去除对象里面是空的属性
+      for (var key in data) {
+        if (data[key] === '') {
+          delete data[key]
+        }
+      }
+      branchOfficeApi(data)
+        .then(res => {
+          if (res.result == 0) {
+            //console.log(res.content.list)
+            this.tableData = res.content.list
+          }
+        })
+        .catch(err => {})
+    },
+       
+  },
+
+  mounted() {
+    //  this.timeVal=this.$route.query.timeVal||""
+    //  this.showText=this.$route.query.showText
+
+    // this.getCurrentDate()
+    // setInterval(this.getCurrentDate, 1000 * 60)
+
+    this.dateVal = util.getMonthLastDay()
+     this.reload()
+  }
+}
+</script>
+<style lang="scss">
+@import '@/assets/sass/variables.scss';
+.container {
+  .van-row{
+    line-height: 25px;
+  }
+   .van-tabs__nav--card .van-tab {
+    background-color: #fff;
+    border-right: 1px solid #fff;
+  }
+  .van-tabs__nav--card .van-tab.van-tab--active {
+    color: $red1;
+    background-color: #fff;
+  }
+  .van-tabs__nav--card .van-tab {
+    color: #232020;
+    background-color: #e6e6e6;
+    border-right: 1px solid #8e8d8d;
+      &:last-child {
+      border-right: none !important;
+    }
+
+  }
+  .van-nav-bar .van-icon,
+  .van-nav-bar__text {
+    color: #232020;
+  }
+  .slide-box {
+    display: -webkit-box;
+    overflow-x: scroll;
+    -webkit-overflow-scrolling: touch;
+  }
+  table.gridtable {
+    font-family: verdana, arial, sans-serif;
+    font-size: 11px;
+    color: #333333;
+    border-width: 1px;
+    border-color: #666666;
+    border-collapse: collapse;
+  }
+     table .title th {
+   
+    padding: 5px 10px;
+
+   
+  }
+    table td {
+     text-align: right;
+    padding:8px;
+   &:nth-child(2){
+     text-align: center;
+   }
+   
+  }
+  table .title th {
+    color: #fff;
+    padding: 5px 10px;
+
+    white-space: nowrap;
+    border-width: 1px;
+    border-color: #666666;
+    background-color: $red1;
+    border-top: 0;
+    border-left: 0;
+    border-right: 0;
+  }
+ 
+ 
+  table {
+    border: 0;
+  }
+  .title .van-tabs__nav--card {
+    margin: 0;
+    border: 1px solid #bdbdbd;
+    border-left: none;
+    border-right: none;
+  }
+  .title .van-tabs__nav--card .van-tab {
+    background-color: transparent;
+  }
+  // 固定表头
+  td,
+  th {
+    /* color: #333;
+            font-size: 14px;
+            border-right: 1px solid #333;
+            line-height: 30px; */
+    /* box-sizing: border-box; */
+    background: #fff;
+  }
+  .layer-box {
+    width: 100%;
+    overflow: hidden;
+    position: relative;
+  }
+  .layer {
+    width: 100%;
+    overflow: hidden;
+    overflow-x: scroll;
+  }
+  .td-1 {
+    position: absolute;
+    padding: 2.13333vw;
+    left: 0;
+    z-index: 2;
+    width: 3em;
+    height: 2.57em;
+    div{
+      position: absolute;
+      transform: translate(-50%, -50%);
+    left: 50%;
+    top: 50%;
+    }
+  }
+    .td-2 {
+  
+  }
+}
+</style>