Merge branch 'dev1.2.9' of http://192.168.3.207:8080/jianyu/page_bigmember_pc into dev1.2.9

src/components/report-data/ReportList.vue

@@ -275,12 +275,14 @@ export default {
 <style>
 .el-tooltip__popper.is-dark{
   max-width: 300px;
+  line-height: 18px;
 }
 </style>
 <style lang="scss" scoped>
   .info-list-group {
     width: 1000px;
     margin: 0 auto;
+    margin-top: 24px;
     padding: 0 20px;
     box-sizing: border-box;
     background: #fff;

src/components/selector/IndustrySelectorContent.vue

@@ -302,6 +302,9 @@ export default {
      * @param { Array | undefined } data 要恢复的数据
      */
     setIndustryState (data) {
+      if (Array.isArray(data)) {
+        return this.setBuyerclassState(data)
+      }
       // 设置全部按钮
       if (!data || Object.keys(data).length === 0) {
         // 其他全部设置不选中，全部按钮设置选中
@@ -332,6 +335,13 @@ export default {
         })
       }
     },
+    setBuyerclassState (data) {
+      this.getIndustryListMap.forEach(item => {
+        if (data.includes(item.name)) {
+          this.changeIndustryState(item)
+        }
+      })
+    },
     // 获取选中的数据
     getSelected () {
       const map = {}

src/components/selector/PopSelector.vue

@@ -147,9 +147,7 @@ export default {
       this.$set(this.selectInfo, 'origin', tempData.origin)
       this.$set(this.selectInfo, 'originMap', tempData.originMap)
       this.$set(this.selectInfo, 'popMap', tempData.popMap)
-      this.$nextTick(() => {
-        this.computRow()
-      })
+      this.computRow()
     },
     submitChange (type) {
       if (type) {
@@ -203,8 +201,10 @@ export default {
       }
     },
     computRow () {
-      $('.p-selector--group .p-selector--item').each(function () {
-        $(this).attr('data-row', parseInt($(this).position().top / 34))
+      this.$nextTick(() => {
+        $('.p-selector--group .p-selector--item').each(function () {
+          $(this).attr('data-row', parseInt($(this).position().top / 34))
+        })
       })
     },
     changePosition (e) {
@@ -253,8 +253,9 @@ export default {
           a_key: []
         }
 
+        const originItem = this.selectInfo.originMap[cname]
         this.selectInfo.popMap[cname].forEach(key => {
-          if (key.checked) {
+          if (key.checked || originItem.selectAll) {
             classify.a_key.push({
               key: key.key.split(' '),
               notkey: key.notkey ? key.notkey.split(' ') : null,
@@ -285,6 +286,56 @@ export default {
     getSelectedKeysWithClassifyName (name) {
       return this.selectInfo.originMap[name].selects || []
     },
+    // 选中的key的字符串数组，key用空格拼接
+    setState (keysList) {
+      for (const cname in this.selectInfo.popMap) {
+        const keysArr = this.selectInfo.popMap[cname]
+        if (Array.isArray(keysArr)) {
+          if (keysArr.length === 0) {
+            continue
+          } else {
+            keysArr.forEach(key => {
+              key.checked = keysList.includes(key.key)
+            })
+          }
+        }
+      }
+      this.refreshOriginMap()
+    },
+    refreshOriginMap () {
+      const classifySelectedState = []
+      for (const cname in this.selectInfo.popMap) {
+        const keysArr = this.selectInfo.popMap[cname]
+        if (!Array.isArray(keysArr)) {
+          continue
+        }
+
+        const selectedKeysArr = []
+        if (keysArr.length === 0) {
+          continue
+        } else {
+          keysArr.forEach(key => {
+            if (key.checked) {
+              selectedKeysArr.push(key.key)
+            }
+          })
+        }
+
+        const selectedCount = selectedKeysArr.length
+        this.selectInfo.originMap[cname].select = selectedCount > 0
+        this.selectInfo.originMap[cname].selectAll = selectedCount > 0 && selectedCount === keysArr.length
+        if (this.selectInfo.originMap[cname].selectAll) {
+          keysArr.forEach(key => (key.checked = false))
+        }
+        this.selectInfo.originMap[cname].selects = selectedKeysArr
+
+        classifySelectedState.push(this.selectInfo.originMap[cname])
+      }
+
+      if (classifySelectedState.indexOf(false) === -1) {
+        this.selectAllForTop()
+      }
+    },
     onChange (selected) {
       this.$emit('onChange', selected)
     }
@@ -409,8 +460,8 @@ export default {
           position: absolute;
           right: -2px;
           bottom: -2px;
-          width: 26px;
-          height: 26px;
+          width: 20px;
+          height: 20px;
           background-image: url(~@/assets/images/spec-active.png);
           background-repeat: no-repeat;
           background-size: contain;

src/components/selector/TimeSelector.vue

@@ -12,6 +12,7 @@
       ref="content"
       :selectorTime="selectorTime"
       :selectorType="selectorType"
+      :defaultSelectedKey="defaultSelectedKey"
       @onChange="onChange"
     />
   </selector-card>
@@ -34,7 +35,8 @@ export default {
     selectorTime: {
       type: String,
       default: 'default'
-    }
+    },
+    defaultSelectedKey: String
   },
   data () {
     return {}

src/components/selector/TimeSelectorContent.vue

@@ -14,7 +14,7 @@
         @click="clickTimeButton(item)"
       >{{ item.name }}</div>
     </div>
-    <div class="date-time-container">
+    <div class="date-time-container" :class="{ active: state.exact === 'exact' }">
       <el-date-picker
         v-model="dateTimePickerState.start"
         class="date-time-item left"
@@ -140,6 +140,10 @@ export default {
     selectorTime: {
       type: String,
       default: 'default' // default/sub/more
+    },
+    defaultSelectedKey: {
+      type: String,
+      default: 'all' // all/lately30/lately90...
     }
   },
   data () {
@@ -177,6 +181,11 @@ export default {
       }
     }
   },
+  computed: {
+    state () {
+      return this.getState()
+    }
+  },
   created () {
     this.calcLastTime()
   },
@@ -210,7 +219,7 @@ export default {
       //   exact: 'all'
       // }
       if (!data || Object.keys(data).length === 0) {
-        this.setTimeSelectListState('all')
+        this.setTimeSelectListState(this.defaultSelectedKey)
       } else {
         switch (data.exact) {
           case 'all':
@@ -231,6 +240,7 @@ export default {
           case 'exact': {
             if (!data.start || !data.end) break
             if (data.start < data.end) {
+              this.timeSelectList.forEach(v => (v.selected = false))
               this.dateTimePickerState.start = new Date(data.start)
               this.dateTimePickerState.end = new Date(data.end)
             }
@@ -250,14 +260,25 @@ export default {
         end: 0,
         exact: 'exact'
       }
+      const durations = {
+        hour1: 60 * 60 * 1000,
+        day1: 60 * 60 * 1000 * 24 * 1,
+        day7: 60 * 60 * 1000 * 24 * 7,
+        day30: 60 * 60 * 1000 * 24 * 30
+      }
       const selectButton = this.timeSelectList.find(item => item.selected)
       if (selectButton) {
         timeState.exact = selectButton.value
         Object.assign(timeState, this.calcNotExactTime(timeState.exact))
       } else {
         timeState.exact = 'exact'
-        timeState.start = this.dateTimePickerState.start.getTime()
-        timeState.end = this.dateTimePickerState.end.getTime()
+        if (this.dateTimePickerState.start) {
+          timeState.start = this.dateTimePickerState.start.getTime()
+        }
+        if (this.dateTimePickerState.end) {
+          // 结束时间为当天23:59:59
+          timeState.end = this.dateTimePickerState.end.getTime() + (durations.day1 - 1000)
+        }
       }
       return timeState
     },
@@ -316,11 +337,11 @@ export default {
           t.start = t.end - durations.day30
           break
         }
-        case 'lately90': { // 近3个月
+        case 'lately90': { // 近90天
           t.start = t.end - (durations.day30 * 3)
           break
         }
-        case 'lately180': { // 近6个月(近半年)
+        case 'lately180': { // 180天
           t.start = t.end - (durations.day30 * 6)
           break
         }
@@ -369,7 +390,7 @@ export default {
         this.setTimeSelectListState()
         this.onChange()
       } else if (!start && !end) { // start和end都没值
-        this.setTimeSelectListState('all')
+        this.setTimeSelectListState(this.defaultSelectedKey)
         this.onChange()
       }
     },
@@ -379,7 +400,7 @@ export default {
         this.setTimeSelectListState()
         this.onChange()
       } else if (!start && !end) { // start和end都没值
-        this.setTimeSelectListState('all')
+        this.setTimeSelectListState(this.defaultSelectedKey)
         this.onChange()
       }
     }
@@ -401,6 +422,17 @@ export default {
   }
   .date-time-container {
     display: flex;
+    padding: 6px;
+    background-color: #F4F5F7;
+    border-radius: 4px;
+    &.active {
+      background-color: #2CB7CA;
+      .date-time-item {
+        &.left::after {
+          background-color: #e0e0e0;
+        }
+      }
+    }
     .clear-icon {
       display: none;
     }
@@ -416,7 +448,7 @@ export default {
           content: '';
           position: absolute;
           width: 12px;
-          height: 1px;
+          height: 2px;
           top: 50%;
           right: -10px;
           transform: translate(100%,-50%);

src/components/work-desktop/Slidebar.vue

@@ -7,7 +7,7 @@
       ref="menu"
       @select="onMenuSelect"
     >
-      <el-menu-item index="我的主页" @click.native="$router.push('/')">
+      <el-menu-item index="我的主页" @click.native="toIndex">
         <i class="iconfont icon-hui7"></i>
         <span slot="title">我的主页</span>
       </el-menu-item>
@@ -128,7 +128,15 @@ export default {
         this.$refs.menu.activeIndex = this.defaultActive
       })
     },
+    toIndex () {
+      if (this.$route.name === 'desktop') return
+      const routeUrl = this.$router.resolve({
+        path: '/'
+      })
+      window.open(routeUrl.href)
+    },
     setDefaultActive () {
+      console.log(this.$route)
       if (this.$route.name === 'desktop') {
         this.defaultActive = '我的主页'
       } else if (this.$route.path.indexOf('report_analysis') !== -1) {

src/views/analysisReport/MarketAnalysis.vue

@@ -9,31 +9,31 @@
     <el-collapse-transition>
       <div class="market-filter-container pd-lr20" v-show="showMoreFilters" v-loading="loading">
         <PopSelector @onChange="changeKeys" ref="keySelector" selectorType="line" :showMoreKeyInfoWithCard="true">
-          <div slot="header">分析内容：</div>
+          <div slot="header" class="filter-label">分析内容：</div>
         </PopSelector>
         <div class="tip-container button-group bottom-divider">
           <div class="tip-text">注：如需新增分析内容，请完善您的订阅关键词组</div>
           <button class="button-submit" @click="toSubManage">订阅管理<i class="el-icon-arrow-right"></i></button>
         </div>
-        <TimeSelector class="bottom-divider" @onChange="changeTime" ref="timeSelector" selectorTime="more" selectorType="line">
-          <div slot="header">时间：</div>
+        <TimeSelector class="bottom-divider" @onChange="changeTime" ref="timeSelector" defaultSelectedKey="sinceYearBeforeLast" selectorTime="more" selectorType="line">
+          <div slot="header" class="filter-label">时间：</div>
         </TimeSelector>
         <AreaSelector class="bottom-divider" @onChange="changeArea" ref="areaSelector" selectorType="line">
-          <div slot="header">项目地区：</div>
+          <div slot="header" class="filter-label">项目地区：</div>
         </AreaSelector>
         <IndustrySelector class="bottom-divider" @onChange="changeIndustry" ref="industrySelector" selectorType="line">
-          <div slot="header">行业：</div>
+          <div slot="header" class="filter-label">行业：</div>
         </IndustrySelector>
         <IndustrySelector class="bottom-divider" @onChange="changeBuyer" ref="buyerclassSelector" dataType="buyer" selectorType="line">
-          <div slot="header">采购单位类型：</div>
+          <div slot="header" class="filter-label">采购单位类型：</div>
         </IndustrySelector>
         <div class="action-button-group flex-r-c center button-group">
           <button class="button-default" @click="resetFilters">重置</button>
-          <button class="button-submit" @click="confirmSubmit">确定</button>
+          <button class="button-submit" @click="confirmSubmit">开始分析</button>
         </div>
       </div>
     </el-collapse-transition>
-    <div class="bg-grey-h24"></div>
+    <div class="bg-grey-h24" v-if="loaded && analysisReportId"></div>
     <MarketAnalysisResult v-if="loaded && analysisReportId" :rid="analysisReportId" @loadedFilters="loadedFilters" @onEmpty="onEmpty" />
     <Empty v-if="loaded && !analysisReportId">对不起，没有匹配到相关信息，请修改您的分析条件</Empty>
   </div>
@@ -50,6 +50,7 @@ import MarketAnalysisResult from '@/views/analysisReport/MarketAnalysisResult.vu
 import Empty from '@/components/common/Empty.vue'
 import { mapState } from 'vuex'
 import { doReportAnalysis } from '@/api/modules/'
+import qs from 'qs'
 
 export default {
   name: 'analysis-report-filters',
@@ -66,6 +67,8 @@ export default {
   },
   data () {
     return {
+      timerId: '',
+      analysisDone: false, // 当前页面是否进行自己选择分析过
       showMoreFilters: true,
       loaded: false,
       loading: false,
@@ -87,7 +90,19 @@ export default {
     })
   },
   watch: {
-    bigKeywordsData: function () {
+    showMoreFilters (newVal) {
+      if (newVal) {
+        try {
+          if (this.timerId) clearTimeout(this.timerId)
+          this.timerId = setTimeout(() => {
+            this.$refs.keySelector.computRow()
+          }, 200)
+        } catch (error) {
+          console.log(error)
+        }
+      }
+    },
+    bigKeywordsData () {
       this.initKeyMap()
     }
   },
@@ -99,12 +114,17 @@ export default {
     this.initDefaultTime()
   },
   methods: {
+    changeUrl (id) {
+      const query = this.$route.query
+      query.id = id
+      history.replaceState({}, '', `?${qs.stringify(query)}`)
+    },
     getUrlQuery () {
       const { id } = this.$route.query
       if (id) {
         this.analysisReportId = id
-        this.loaded = true
         this.showMoreFilters = false
+        this.loaded = true
       }
     },
     getAllKeyMap () {
@@ -140,7 +160,7 @@ export default {
       const keys = this.filters.keys
       if (Array.isArray(keys) && keys.length) {
         return JSON.stringify(keys)
-      } else{
+      } else {
         const allKeys = this.getAllKeyMap()
         return JSON.stringify(allKeys)
       }
@@ -157,6 +177,7 @@ export default {
 
       this.loading = true
       this.loaded = false
+      this.analysisReportId = ''
 
       const { data, error_code: code } = await doReportAnalysis(query)
 
@@ -168,6 +189,7 @@ export default {
       }
     },
     showAnalysisResult (id) {
+      this.analysisDone = true
       this.analysisReportId = id
     },
     changeKeys () {
@@ -197,7 +219,6 @@ export default {
       this.filters.industry = item
     },
     changeBuyer (item) {
-      console.log(item)
       this.filters.buyerclass = this.formatIndustryMap(item).map(v => v.split('_')[1])
     },
     resetFilters () {
@@ -227,8 +248,67 @@ export default {
     onEmpty () {
       this.analysisReportId = ''
     },
+    // 整理数据，并赋值给filters
     loadedFilters (filters) {
-      console.log(filters)
+      // 当前页面分析过，则不恢复filters
+      if (this.analysisDone) return
+      if (filters.keys) {
+        this.filters.keys = filters.keys
+        this.restoreFilterKeys(filters.keys)
+      }
+      if (filters.selectTime) {
+        this.filters.selectTime = filters.selectTime
+      }
+      if (filters.selectTimeExtra) {
+        this.filters.selectTimeExtra = filters.selectTimeExtra
+      }
+      this.restoreFilterTimes(filters.selectTime, filters.selectTimeExtra)
+
+      if (filters.area) {
+        this.filters.area = filters.area
+        this.restoreFilterArea(filters.area)
+      }
+      if (filters.industry) {
+        this.filters.industry = filters.industry
+        this.restoreFilterIndustry(filters.industry)
+      }
+      if (filters.buyerclass) {
+        this.filters.buyerclass = filters.buyerclass
+        this.restoreFilterBuyerclass(filters.buyerclass)
+      }
+    },
+    restoreFilterKeys (keys) {
+      if (!Array.isArray(keys)) return
+      const keysArr = []
+      keys.forEach(classify => {
+        if (Array.isArray(classify.a_key)) {
+          classify.a_key.forEach(item => {
+            if (Array.isArray(item.appendkey)) {
+              item.key = item.key.concat(item.appendkey)
+            }
+            keysArr.push(item.key.join(' '))
+          })
+        }
+      })
+      this.$refs.keySelector.setState(keysArr)
+    },
+    restoreFilterTimes (selectTime, extra) {
+      const selectTimeArr = selectTime.split('-')
+      const struct = {
+        start: selectTimeArr[0] * 1000,
+        end: selectTimeArr[1] * 1000,
+        exact: extra ? extra : 'exact'
+      }
+      this.$refs.timeSelector.setState(struct)
+    },
+    restoreFilterArea (area) {
+      this.$refs.areaSelector.setCitySelected(area)
+    },
+    restoreFilterIndustry (i) {
+      this.$refs.industrySelector.setIndustryState(i)
+    },
+    restoreFilterBuyerclass (b) {
+      this.$refs.buyerclassSelector.setIndustryState(b)
     },
     toSubManage () {
       if (this.isSubCount) {
@@ -279,6 +359,10 @@ export default {
   padding: 0 20px;
 }
 .market {
+  &-filter-container {
+    border-top-left-radius: 4px;
+    border-top-right-radius: 4px;
+  }
   &-title {
     display: flex;
     align-items: center;
@@ -296,13 +380,23 @@ export default {
       justify-content: center;
       width: 24px;
       height: 18px;
-      background: #F4F5F7;
+      background-color: #F4F5F7;
       border-radius: 2px;
+      border: 1px solid transparent;
       cursor: pointer;
+      &:hover {
+        color: #2CB7CA;
+        border-color: #2CB7CA;
+      }
     }
   }
 }
 
+.filter-label {
+  color: #686868;
+  font-size: 14px;
+}
+
 .button-group {
   background-color: #fff;
   padding: 20px 0;

src/views/analysisReport/MarketAnalysisResult.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="market-analysis-result">
-    <div class="analysis-result-anchors pd-lr20">
+    <div class="analysis-result-anchors">
       <div class="analysis-dimensions analysis-wrap" v-fixed-nav>
         <div class="analysis-label">报告分析维度：</div>
         <div class="analysis-content">
@@ -53,12 +53,15 @@
             </div>
           </div>
           <!-- 项目规模分布 -->
-          <div class="sub-section project-scatter" v-if="sections.projectScatter.dataAlready">
+          <div class="sub-section project-scatter"
+            v-if="!sections.loaded.top3 || (sections.projectScatter.dataAlready && sections.loaded.top3)"
+            v-loading="!sections.loaded.top3">
             <div class="sub-section-header">
               <div class="sub-section-title">项目规模分布</div>
             </div>
             <div class="sub-section-content">
               <ProjectScatter
+                v-if="sections.projectScatter.dataAlready"
                 :chartData="sections.projectScatter.chartData"
                 :tableData="sections.projectScatter.tableData"
               />
@@ -86,71 +89,93 @@
             </div>
           </div>
           <!-- 地区分布 -->
-          <div class="sub-section area-scatter" v-if="sections.areaScatter.dataAlready">
+          <div class="sub-section area-scatter"
+            v-if="(!sections.loaded.top3 && notOneAreaFilter) || (sections.areaScatter.dataAlready && sections.loaded.top3 && notOneAreaFilter)"
+            v-loading="!sections.loaded.top3">
             <div class="sub-section-header">
               <div class="sub-section-title">地区分布</div>
             </div>
             <div class="sub-section-content">
               <MarketAreaScatter
+                v-if="sections.projectScatter.dataAlready"
                 :chartData="sections.areaScatter.chartData"
               />
             </div>
           </div>
           <div class="top3-table-list pd-lr20">
-            <div class="ar-table" v-if="sections.areaScatter.projectCountTop3">
+            <div class="ar-table"
+              v-if="!sections.loaded.top3 || (sections.areaScatter.projectCountTop3 && sections.loaded.top3)"
+              v-loading="!sections.loaded.top3">
               <p class="ar-table-title">项目数量TOP3地区的重点中标单位</p>
-              <Top3Table :tableData="sections.areaScatter.projectCountTop3" />
+              <Top3Table v-if="sections.areaScatter.projectCountTop3" :tableData="sections.areaScatter.projectCountTop3" />
             </div>
-            <div class="ar-table" v-if="sections.areaScatter.projectAmountTop3">
+            <div class="ar-table"
+              v-if="!sections.loaded.top3 || (sections.areaScatter.projectAmountTop3 && sections.loaded.top3)"
+              v-loading="!sections.loaded.top3">
               <p class="ar-table-title">项目金额TOP3地区的重点中标单位</p>
-              <Top3Table :tableData="sections.areaScatter.projectAmountTop3" />
+              <Top3Table v-if="sections.areaScatter.projectAmountTop3" :tableData="sections.areaScatter.projectAmountTop3" />
             </div>
           </div>
           <!-- 客户分布 -->
-          <div class="sub-section user-scatter" v-if="sections.userScatter.list.length">
+          <div class="sub-section user-scatter"
+            v-if="!sections.loaded.top3 || (sections.userScatter.list.length && sections.loaded.top3)"
+            v-loading="!sections.loaded.top3">
             <div class="sub-section-header">
               <div class="sub-section-title">客户分布</div>
             </div>
             <div class="sub-section-content">
-              <MarketUserScatter :chartData="sections.userScatter.list" />
+              <MarketUserScatter v-if="sections.userScatter.list.length" :chartData="sections.userScatter.list" />
             </div>
           </div>
           <div class="top3-table-list pd-lr20">
-            <div class="ar-table" v-if="sections.userScatter.projectCountTop3">
+            <div class="ar-table"
+              v-if="!sections.loaded.top3 || (sections.userScatter.projectCountTop3 && sections.loaded.top3)"
+              v-loading="!sections.loaded.top3">
               <p class="ar-table-title">项目数量TOP3客户类型的重点中标单位</p>
-              <Top3Table :tableData="sections.userScatter.projectCountTop3" />
+              <Top3Table v-if="sections.userScatter.projectCountTop3" :tableData="sections.userScatter.projectCountTop3" />
             </div>
-            <div class="ar-table" v-if="sections.userScatter.projectAmountTop3">
+            <div class="ar-table"
+              v-if="!sections.loaded.top3 || (sections.userScatter.projectAmountTop3 && sections.loaded.top3)"
+              v-loading="!sections.loaded.top3">
               <p class="ar-table-title">项目金额TOP3客户类型的重点中标单位</p>
-              <Top3Table :tableData="sections.userScatter.projectAmountTop3" />
+              <Top3Table v-if="sections.userScatter.projectAmountTop3" :tableData="sections.userScatter.projectAmountTop3" />
             </div>
           </div>
           <!-- 细分市场 -->
-          <div class="sub-section market-refine" v-if="sections.market.refine.dataAlready">
+          <div class="sub-section market-refine"
+            v-if="!sections.loaded.segment || (sections.market.refine.dataAlready && sections.loaded.segment)"
+            v-loading="!sections.loaded.segment">
             <div class="sub-section-header">
               <div class="sub-section-title">细分市场</div>
             </div>
             <div class="sub-section-content">
               <MarketSegment
+                v-if="sections.market.refine.dataAlready"
                 :projectCountData="sections.market.refine.projectCountData"
                 :projectAmountData="sections.market.refine.projectAmountData"
               />
             </div>
           </div>
           <div class="top3-table-list pd-lr20">
-            <div class="ar-table" v-if="sections.market.refine.projectCountTop3">
+            <div class="ar-table"
+              v-if="!sections.loaded.segment || (sections.market.refine.projectCountTop3 && sections.loaded.segment)"
+              v-loading="!sections.loaded.segment">
               <p class="ar-table-title">细分市场的重点中标单位-项目数量</p>
-              <Top3Table :tableData="sections.market.refine.projectCountTop3" />
+              <Top3Table v-if="sections.market.refine.projectCountTop3" :tableData="sections.market.refine.projectCountTop3" />
             </div>
-            <div class="ar-table" v-if="sections.market.refine.projectAmountTop3">
+            <div class="ar-table"
+              v-if="!sections.loaded.segment || (sections.market.refine.projectAmountTop3 && sections.loaded.segment)"
+              v-loading="!sections.loaded.segment">
               <p class="ar-table-title">细分市场的重点中标单位-项目金额</p>
-              <Top3Table :tableData="sections.market.refine.projectAmountTop3" />
+              <Top3Table v-if="sections.market.refine.projectAmountTop3" :tableData="sections.market.refine.projectAmountTop3" />
             </div>
           </div>
         </div>
       </section>
       <div class="bg-grey-h24" v-if="buyerclassSectionShow"></div>
-      <section class="analysis-result-section" v-if="buyerclassSectionShow">
+      <section class="analysis-result-section"
+        v-if="!sections.loaded.buyerWinner || (buyerclassSectionShow && sections.loaded.buyerWinner)"
+        v-loading="!sections.loaded.buyerWinner">
         <div class="analysis-result-title pd-lr20">采购单位</div>
         <div class="analysis-result-content sub-section-list">
           <!-- 采购规模分布 -->
@@ -159,42 +184,44 @@
               <div class="sub-section-title">采购规模分布</div>
             </div>
             <div class="sub-section-content">
-              <BuyerScaleScatter :chartData="sections.buyerclass.chartData" />
+              <BuyerScaleScatter v-if="buyerclassSectionShow" :chartData="sections.buyerclass.chartData" />
             </div>
           </div>
           <div class="top3-table-list pd-lr20">
             <div class="ar-table buyerclass-count-top3" v-if="sections.buyerclass.projectCountTop3">
               <p class="ar-table-title">项目数量TOP3采购单位及其重点合作中标单位</p>
-              <Top3Table :tableData="sections.buyerclass.projectCountTop3" />
+              <Top3Table v-if="buyerclassSectionShow" :tableData="sections.buyerclass.projectCountTop3" />
             </div>
             <div class="ar-table buyerclass-amount-top3" v-if="sections.buyerclass.projectAmountTop3">
               <p class="ar-table-title">采购金额TOP3采购单位及其重点合作中标单位</p>
-              <Top3Table :tableData="sections.buyerclass.projectAmountTop3" />
+              <Top3Table v-if="buyerclassSectionShow" :tableData="sections.buyerclass.projectAmountTop3" />
             </div>
           </div>
         </div>
       </section>
       <div class="bg-grey-h24" v-if="winnerSectionShow"></div>
-      <section class="analysis-result-section" v-if="winnerSectionShow">
+      <section class="analysis-result-section"
+        v-if="!sections.loaded.buyerWinner || (winnerSectionShow && sections.loaded.buyerWinner)"
+        v-loading="!sections.loaded.buyerWinner">
         <div class="analysis-result-title pd-lr20">中标单位</div>
         <div class="analysis-result-content sub-section-list">
           <!-- 中标规模分布 -->
-          <div class="sub-section winner-scatter" v-if="sections.winner.dataAlready">
+          <div class="sub-section winner-scatter">
             <div class="sub-section-header">
               <div class="sub-section-title">中标规模分布</div>
             </div>
             <div class="sub-section-content">
-              <BidderScaleScatter :chartData="sections.winner.chartData" />
+              <BidderScaleScatter v-if="sections.winner.dataAlready" :chartData="sections.winner.chartData" />
             </div>
           </div>
           <div class="top3-table-list pd-lr20">
-            <div class="ar-table winner-count-top3" v-if="sections.winner.projectCountTop3">
+            <div class="ar-table winner-count-top3">
               <p class="ar-table-title">项目数量TOP3中标单位及其重点合作采购单位</p>
-              <Top3Table :tableData="sections.winner.projectCountTop3" />
+              <Top3Table v-if="sections.winner.projectCountTop3" :tableData="sections.winner.projectCountTop3" />
             </div>
-            <div class="ar-table winner-amount-top3" v-if="sections.winner.projectAmountTop3">
+            <div class="ar-table winner-amount-top3">
               <p class="ar-table-title">中标金额TOP3中标单位及其重点合作采购单位</p>
-              <Top3Table :tableData="sections.winner.projectAmountTop3" />
+              <Top3Table v-if="sections.winner.projectAmountTop3" :tableData="sections.winner.projectAmountTop3" />
             </div>
           </div>
         </div>
@@ -332,6 +359,13 @@ export default {
         ]
       },
       sections: {
+        loaded: {
+          overview: false, // 1, 市场概括与时间分布
+          top10: false, // 2, 项目规模Top10
+          top3: false, // 3, 项目规模分布/地区规模分布/客户分布/地区分布及客户分布&Top3(table+chart)
+          segment: false, // 4, 细分市场
+          buyerWinner: false // 5, 采购单位/中标单位&Top3(table+chart)
+        },
         market: {
           overview: [],
           refine: {
@@ -406,6 +440,11 @@ export default {
     }
   },
   computed: {
+    notOneAreaFilter () {
+      const area = this.reportFilters.area
+      const showArea = area && (Object.keys(area).length > 1 || Object.keys(area).length === 0)
+      return showArea
+    },
     buyerclassSectionShow () {
       const winnerState = this.sections.buyerclass
       return winnerState.dataAlready && winnerState.projectCountTop3 && winnerState.projectAmountTop3
@@ -447,14 +486,10 @@ export default {
       const flagArr = [
         0, // 筛选条件
         // 1, // 市场概括与时间分布
-        2, // 项目规模分布
-        3, // 项目规模Top10
+        2, // 项目规模Top10
+        3, // 项目规模分布/地区规模分布/客户分布/地区分布及客户分布&Top3(table+chart)
         4, // 细分市场
-        5, // 采购单位
-        6, // 中标单位
-        7, // 地区规模分布
-        8, // 客户分布
-        9 // 地区分布及客户分布Top3
+        5 // 采购单位/中标单位&Top3(table+chart)
       ]
 
       flagArr.forEach(this.getReport)
@@ -494,30 +529,32 @@ export default {
         }
         // 时间分布
         this.sortTimeScatter(data)
+        this.sections.loaded.overview = true
       } else if (flag === 2) {
-        // 项目规模分布
-        this.sortProjectScatter(data.projectScale)
-      } else if (flag === 3) {
         // 项目规模Top10
         this.sortProjectTop10(data.ProjectTop10)
+        this.sections.loaded.top10 = true
+      } else if (flag === 3) {
+        // 项目规模分布/地区规模分布/客户分布/地区分布及客户分布&Top3(table+chart)
+        // 项目规模分布
+        this.sortProjectScatter(data.projectScale)
+        // 地区规模分布
+        this.sortAreaScatter(data.area_infos)
+        // 客户分布
+        this.sortUserScatter(data.customer_scale)
+        // 地区分布及客户分布Top3
+        this.sortAreaUserTop3(data)
+        this.sections.loaded.top3 = true
       } else if (flag === 4) {
         // 细分市场
         this.sortMarketRefineData(data)
+        this.sections.loaded.segment = true
       } else if (flag === 5) {
-        // 采购单位
+        // 采购单位/中标单位&Top3(table+chart)
         this.sortBuyerclassData(data)
-      } else if (flag === 6) {
         // 中标单位分析
         this.sortWinnerData(data)
-      } else if (flag === 7) {
-        // 地区规模分布
-        this.sortAreaScatter(data.area_infos)
-      } else if (flag === 8) {
-        // 客户分布
-        this.sortUserScatter(data.customer_scale)
-      } else if (flag === 9) {
-        // 地区分布及客户分布Top3
-        this.sortAreaUserTop3(data)
+        this.sections.loaded.buyerWinner = true
       }
     },
     formatSelectTime (value) {
@@ -590,18 +627,18 @@ export default {
       list[1].count = projectTotalMoney.count
       list[1].unit = projectTotalMoney.unit
 
-      list[1].ringRatio = profile.projctamount_ratio ? (profile.projctamount_ratio * 100).toFixed(4) : 0
+      list[1].ringRatio = profile.projctamount_ratio ? (profile.projctamount_ratio * 100).toFixed(2) : 0
       // 项目平均金额
       const projectAvgMoney = this.moneyUnit(profile.projectavgmoney ? profile.projectavgmoney : 0)
       list[2].count = projectAvgMoney.count
       list[2].unit = projectAvgMoney.unit
-      list[2].ringRatio = profile.projectavgmoney_ratio ? (profile.projectavgmoney_ratio * 100).toFixed(4) : 0
+      list[2].ringRatio = profile.projectavgmoney_ratio ? (profile.projectavgmoney_ratio * 100).toFixed(2) : 0
       // 中标单位数
       list[3].count = profile.winnercount ? profile.winnercount : 0
       list[3].ringRatio = profile.winnercount_ratio ? (profile.winnercount_ratio * 100).toFixed(2) : 0
       // 采购单位数
       list[4].count = profile.buyercount ? profile.buyercount : 0
-      list[4].ringRatio = profile.winnercount_ratio ? (profile.winnercount_ratio * 100).toFixed(2) : 0
+      list[4].ringRatio = profile.buyercount_ratio ? (profile.buyercount_ratio * 100).toFixed(2) : 0
 
       const totalCount = list.reduce((total, item) => item.count + total, 0)
 
@@ -846,7 +883,8 @@ export default {
       // }
 
       const areaChartData = {
-        columns: ['项目所在地', '项目数量', '项目金额'],
+        columns: ['项目所在地', '项目数量'],
+        sColumns: ['项目金额'],
         rows: []
       }
       let total = 0
@@ -855,13 +893,13 @@ export default {
         const field = {
           [areaChartData.columns[0]]: 'area',
           [areaChartData.columns[1]]: 'total',
-          [areaChartData.columns[2]]: 'amount'
+          [areaChartData.sColumns[0]]: 'amount'
         }
         areaList.forEach(item => {
           const row = {}
-          areaChartData.columns.forEach(column => {
+          areaChartData.columns.concat(areaChartData.sColumns).forEach(column => {
             if (field[column] === 'amount') {
-              row[column] = formatPrice(item[field[column]] / 10000)
+              row[column] = formatPrice(item[field[column]] / 10000) - 0
             } else {
               row[column] = item[field[column]]
             }
@@ -907,11 +945,11 @@ export default {
     },
     sorAreaTop3 (data) {
       const tableDataCount = {
-        columns: ['序号', '地区：项目数量(个)，占比', '前3中标单位：中标数量(个)，该地区占比'],
+        columns: ['序号', '地区：项目数量(个)，占比', '前3中标单位：中标数量(个)'], // ，该地区占比
         rows: []
       }
       const tableDataAmount = {
-        columns: ['序号', '地区：项目金额(万元)，占比', '前3中标单位：中标金额(万元)，该地区占比'],
+        columns: ['序号', '地区：项目金额(万元)，占比', '前3中标单位：中标金额(万元)'], // ，该地区占比
         rows: []
       }
 
@@ -924,12 +962,13 @@ export default {
                 index: index + 1,
                 name: item.name,
                 value: item.area_count + '个',
-                percent: formatPrice(item.area_scale * 100) + '%',
+                percent: item.area_scale ? `${formatPrice(item.area_scale * 100)}%` : '',
                 winner_id: w.id,
+                winner_type: 'winner', // 用于判断采购单位或者中标单位
                 winner_index: i + 1,
                 winner_name: w.winner,
                 winner_value: w.winner_total ? `${w.winner_total}个` : 0,
-                winner_percent: w.total_scale ? `${formatPrice(w.total_scale * 100)}%` : 0,
+                // winner_percent: w.total_scale ? `${formatPrice(w.total_scale * 100)}%` : 0,
                 rowspan: i === 0 ? item.winner.length : 0
               }
               tableDataCount.rows.push(row)
@@ -939,7 +978,7 @@ export default {
               index: index + 1,
               name: item.name,
               value: item.area_count + '个',
-              percent: formatPrice(item.area_scale * 100) + '%',
+              percent: item.area_scale ? `${formatPrice(item.area_scale * 100)}%` : '',
               rowspan: 1
             }
             tableDataCount.rows.push(row)
@@ -956,12 +995,13 @@ export default {
                 index: index + 1,
                 name: item.name,
                 value: formatPrice(item.area_amount / 10000) + '万元',
-                percent: formatPrice(item.area_scale * 100) + '%',
+                percent: item.area_scale ? `${formatPrice(item.area_scale * 100)}%` : '',
                 winner_id: w.id,
+                winner_type: 'winner',
                 winner_index: i + 1,
                 winner_name: w.winner,
-                winner_value: w.winner_amount ? `${formatPrice(w.winner_amount / 10000)}万元` : 0,
-                winner_percent: w.amount_scale ? `${formatPrice(w.amount_scale * 100)}%` : 0,
+                winner_value: w.winner_amount ? `${formatPrice(w.winner_amount / 10000)}万元` : '-',
+                // winner_percent: w.amount_scale ? `${formatPrice(w.amount_scale * 100)}%` : 0,
                 rowspan: i === 0 ? item.winner.length : 0
               }
               tableDataAmount.rows.push(row)
@@ -971,7 +1011,7 @@ export default {
               index: index + 1,
               name: item.name,
               value: formatPrice(item.area_amount / 10000) + '万元',
-              percent: formatPrice(item.area_scale * 100) + '%',
+              percent: item.area_scale ? `${formatPrice(item.area_scale * 100)}%` : '',
               rowspan: 1
             }
             tableDataAmount.rows.push(row)
@@ -988,11 +1028,11 @@ export default {
     },
     sorUserTop3 (data) {
       const tableDataCount = {
-        columns: ['序号', '客户类型：项目数量(个)，占比', '前3中标单位：中标数量(个)，该客户类型占比'],
+        columns: ['序号', '客户类型：项目数量(个)，占比', '前3中标单位：中标数量(个)'], // ，该客户类型占比
         rows: []
       }
       const tableDataAmount = {
-        columns: ['序号', '客户类型：项目金额(万元)，占比', '前3中标单位：中标金额(万元)，该客户类型占比'],
+        columns: ['序号', '客户类型：项目金额(万元)，占比', '前3中标单位：中标金额(万元)'], // ，该客户类型占比
         rows: []
       }
 
@@ -1005,12 +1045,13 @@ export default {
                 index: index + 1,
                 name: item.name,
                 value: item.buyclass_count + '个',
-                percent: formatPrice(item.buyclass_scale * 100) + '%',
+                percent: item.buyclass_scale ? `${formatPrice(item.buyclass_scale * 100)}%` : '',
                 winner_id: w.id,
+                winner_type: 'winner', // 用于判断采购单位或者中标单位
                 winner_index: i + 1,
                 winner_name: w.winner,
                 winner_value: w.winner_total ? `${w.winner_total}个` : 0,
-                winner_percent: w.total_scale ? `${formatPrice(w.total_scale * 100)}%` : 0,
+                // winner_percent: w.total_scale ? `${formatPrice(w.total_scale * 100)}%` : 0,
                 rowspan: i === 0 ? item.winner.length : 0
               }
               tableDataCount.rows.push(row)
@@ -1020,7 +1061,7 @@ export default {
               index: index + 1,
               name: item.name,
               value: item.area_count + '个',
-              percent: formatPrice(item.area_scale * 100) + '%',
+              percent: item.buyclass_scale ? `${formatPrice(item.buyclass_scale * 100)}%` : '',
               rowspan: 1
             }
             tableDataCount.rows.push(row)
@@ -1037,12 +1078,13 @@ export default {
                 index: index + 1,
                 name: item.name,
                 value: formatPrice(item.buyclass_amount / 10000) + '万元',
-                percent: formatPrice(item.buyclass_scale * 100) + '%',
+                percent: item.buyclass_scale ? `${formatPrice(item.buyclass_scale * 100)}%` : '',
                 winner_id: w.id,
+                winner_type: 'winner', // 用于判断采购单位或者中标单位
                 winner_index: i + 1,
                 winner_name: w.winner,
-                winner_value: w.winner_amount ? `${formatPrice(w.winner_amount / 10000)}万元` : 0,
-                winner_percent: w.amount_scale ? `${formatPrice(w.amount_scale * 100)}%` : 0,
+                winner_value: w.winner_amount ? `${formatPrice(w.winner_amount / 10000)}万元` : '-',
+                // winner_percent: w.amount_scale ? `${formatPrice(w.amount_scale * 100)}%` : 0,
                 rowspan: i === 0 ? item.winner.length : 0
               }
               tableDataAmount.rows.push(row)
@@ -1052,7 +1094,7 @@ export default {
               index: index + 1,
               name: item.name,
               value: formatPrice(item.area_amount / 10000) + '万元',
-              percent: formatPrice(item.area_scale * 100) + '%',
+              percent: item.buyclass_scale ? `${formatPrice(item.buyclass_scale * 100)}%` : '',
               rowspan: 1
             }
             tableDataAmount.rows.push(row)
@@ -1115,11 +1157,11 @@ export default {
     },
     sortRefineTop3 (data) {
       const tableDataCount = {
-        columns: ['序号', '细分市场：项目数量(个)，占比', '前3中标单位：中标数量(个)，该细分市场占比'],
+        columns: ['序号', '细分市场：项目数量(个)，占比', '前3中标单位：中标数量(个)'], // ，该细分市场占比
         rows: []
       }
       const tableDataAmount = {
-        columns: ['序号', '细分市场：项目金额(万元)，占比', '前3中标单位：中标金额(万元)，该细分市场占比'],
+        columns: ['序号', '细分市场：项目金额(万元)，占比', '前3中标单位：中标金额(万元)'], // ，该细分市场占比
         rows: []
       }
 
@@ -1132,11 +1174,13 @@ export default {
                 index: index + 1,
                 name: item.name,
                 value: item.total + '个',
+                percent: item.prop ? `${formatPrice(item.prop * 100)}%` : '',
                 winner_id: w.id,
+                winner_type: 'winner',
                 winner_index: i + 1,
                 winner_name: w.name,
                 winner_value: w.value ? `${w.value}个` : 0,
-                winner_percent: w.prop ? `${formatPrice(w.prop * 100)}%` : 0,
+                // winner_percent: w.prop ? `${formatPrice(w.prop * 100)}%` : 0,
                 rowspan: i === 0 ? item.totalTop.length : 0
               }
               tableDataCount.rows.push(row)
@@ -1146,6 +1190,7 @@ export default {
               index: index + 1,
               name: item.name,
               value: item.total + '个',
+              percent: item.prop ? `${formatPrice(item.prop * 100)}%` : '',
               rowspan: 1
             }
             tableDataCount.rows.push(row)
@@ -1162,11 +1207,13 @@ export default {
                 index: index + 1,
                 name: item.name,
                 value: formatPrice(item.amount / 10000) + '万元',
+                percent: item.prop ? `${formatPrice(item.prop * 100)}%` : '',
                 winner_id: w.id,
+                winner_type: 'winner',
                 winner_index: i + 1,
                 winner_name: w.name,
-                winner_value: w.value ? `${formatPrice(w.value / 10000)}万元` : 0,
-                winner_percent: w.prop ? `${formatPrice(w.prop * 100)}%` : 0,
+                winner_value: w.value ? `${formatPrice(w.value / 10000)}万元` : '-',
+                // winner_percent: w.prop ? `${formatPrice(w.prop * 100)}%` : 0,
                 rowspan: i === 0 ? item.amountTop.length : 0
               }
               tableDataAmount.rows.push(row)
@@ -1176,6 +1223,7 @@ export default {
               index: index + 1,
               name: item.name,
               value: formatPrice(item.amount / 10000) + '万元',
+              percent: item.prop ? `${formatPrice(item.prop * 100)}%` : '',
               rowspan: 1
             }
             tableDataAmount.rows.push(row)
@@ -1231,11 +1279,11 @@ export default {
     },
     sortBuyerclassTableData (data) {
       const dataCount = {
-        columns: ['序号', '采购单位：采购数量(个)，占比', '前3中标单位：中标数量(个)，占该采购单位'],
+        columns: ['序号', '采购单位：采购数量(个)', '前3中标单位：中标数量(个)'], // ，占比 | ，占该采购单位
         rows: []
       }
       const dataAmount = {
-        columns: ['序号', '采购单位：采购金额(万元)，占比', '前3中标单位：中标金额(万元)，占该采购单位'],
+        columns: ['序号', '采购单位：采购金额(万元)', '前3中标单位：中标金额(万元)'], // ，占比 |  ，占该采购单位
         rows: []
       }
 
@@ -1247,13 +1295,16 @@ export default {
               const row = {
                 index: index + 1,
                 name: item.name,
+                name_type: 'buyer',
+                name_id: item.name,
                 value: item.number + '个',
-                percent: formatPrice(item.accounted * 100) + '%',
+                // percent: item.accounted ? `${formatPrice(item.accounted * 100)}%` : '',
                 winner_id: w.id,
+                winner_type: 'winner',
                 winner_index: i + 1,
                 winner_name: w.name,
                 winner_value: w.number ? `${w.number}个` : 0,
-                winner_percent: w.accounted ? `${formatPrice(w.accounted * 100)}%` : 0,
+                // winner_percent: w.accounted ? `${formatPrice(w.accounted * 100)}%` : 0,
                 rowspan: i === 0 ? item.winnertop3.length : 0
               }
               dataCount.rows.push(row)
@@ -1262,8 +1313,10 @@ export default {
             const row = {
               index: index + 1,
               name: item.name,
+              name_type: 'buyer',
+              name_id: item.name,
               value: item.number + '个',
-              percent: formatPrice(item.accounted * 100) + '%',
+              // percent: item.accounted ? `${formatPrice(item.accounted * 100)}%` : '',
               rowspan: 1
             }
             dataCount.rows.push(row)
@@ -1279,13 +1332,16 @@ export default {
               const row = {
                 index: index + 1,
                 name: item.name,
+                name_type: 'buyer',
+                name_id: item.name,
                 value: formatPrice(item.amount / 10000) + '万元',
-                percent: formatPrice(item.accounted * 100) + '%',
+                // percent: item.accounted ? `${formatPrice(item.accounted * 100)}%` : '',
                 winner_id: w.id,
+                winner_type: 'winner',
                 winner_index: i + 1,
                 winner_name: w.name,
-                winner_value: w.amount ? `${formatPrice(w.amount / 10000)}万元` : 0,
-                winner_percent: w.accounted ? `${formatPrice(w.accounted * 100)}%` : 0,
+                winner_value: w.amount ? `${formatPrice(w.amount / 10000)}万元` : '-',
+                // winner_percent: w.accounted ? `${formatPrice(w.accounted * 100)}%` : 0,
                 rowspan: i === 0 ? item.winnertop3.length : 0
               }
               dataAmount.rows.push(row)
@@ -1294,8 +1350,10 @@ export default {
             const row = {
               index: index + 1,
               name: item.name,
+              name_type: 'buyer',
+              name_id: item.name,
               value: formatPrice(item.amount / 10000) + '万元',
-              percent: formatPrice(item.accounted * 100) + '%',
+              // percent: item.accounted ? `${formatPrice(item.accounted * 100)}%` : '',
               rowspan: 1
             }
             dataAmount.rows.push(row)
@@ -1352,11 +1410,11 @@ export default {
     },
     sortWinnerTableData (data) {
       const dataCount = {
-        columns: ['序号', '中标单位：中标数量(个)，占比', '前3采购单位：采购数量(个)，占该中标单位'],
+        columns: ['序号', '中标单位：中标数量(个)', '前3采购单位：采购数量(个)'], // ，占比 | ，占该中标单位
         rows: []
       }
       const dataAmount = {
-        columns: ['序号', '中标单位：中标金额(万元)，占比', '前3采购单位：采购金额(万元)，占该中标单位'],
+        columns: ['序号', '中标单位：中标金额(万元)', '前3采购单位：采购金额(万元)'], // ，占比 | ，占该中标单位
         rows: []
       }
 
@@ -1368,13 +1426,16 @@ export default {
               const row = {
                 index: index + 1,
                 name: item.name,
+                name_type: 'winner',
+                name_id: item.id,
                 value: item.number + '个',
-                percent: formatPrice(item.accounted * 100) + '%',
-                winner_id: w.id,
+                // percent: item.accounted ? `${formatPrice(item.accounted * 100)}%` : '',
+                winner_id: w.name,
+                winner_type: 'buyer',
                 winner_index: i + 1,
                 winner_name: w.name,
                 winner_value: w.number ? `${w.number}个` : 0,
-                winner_percent: w.accounted ? `${formatPrice(w.accounted * 100)}%` : 0,
+                // winner_percent: w.accounted ? `${formatPrice(w.accounted * 100)}%` : 0,
                 rowspan: i === 0 ? item.buyertop3.length : 0
               }
               dataCount.rows.push(row)
@@ -1384,7 +1445,9 @@ export default {
               index: index + 1,
               name: item.name,
               value: item.number + '个',
-              percent: formatPrice(item.accounted * 100) + '%',
+              name_type: 'winner',
+              name_id: item.id,
+              // percent: item.accounted ? `${formatPrice(item.accounted * 100)}%` : '',
               rowspan: 1
             }
             dataCount.rows.push(row)
@@ -1400,13 +1463,16 @@ export default {
               const row = {
                 index: index + 1,
                 name: item.name,
+                name_type: 'winner',
+                name_id: item.id,
                 value: formatPrice(item.amount / 10000) + '万元',
-                percent: formatPrice(item.accounted * 100) + '%',
-                winner_id: w.id,
+                // percent: formatPrice(item.accounted * 100) + '%',
+                winner_id: w.name,
+                winner_type: 'buyer',
                 winner_index: i + 1,
                 winner_name: w.name,
-                winner_value: w.amount ? `${formatPrice(w.amount / 10000)}万元` : 0,
-                winner_percent: w.accounted ? `${formatPrice(w.accounted * 100)}%` : 0,
+                winner_value: w.amount ? `${formatPrice(w.amount / 10000)}万元` : '-',
+                // winner_percent: w.accounted ? `${formatPrice(w.accounted * 100)}%` : 0,
                 rowspan: i === 0 ? item.buyertop3.length : 0
               }
               dataAmount.rows.push(row)
@@ -1415,8 +1481,10 @@ export default {
             const row = {
               index: index + 1,
               name: item.name,
+              name_type: 'winner',
+              name_id: item.id,
               value: formatPrice(item.amount / 10000) + '万元',
-              percent: formatPrice(item.accounted * 100) + '%',
+              // percent: formatPrice(item.accounted * 100) + '%',
               rowspan: 1
             }
             dataAmount.rows.push(row)
@@ -1472,7 +1540,12 @@ export default {
 <style lang="scss">
 .report-dropdown-menu {
   border-color: $color-text--highlight;
+  min-width: 100px;
   .el-dropdown-menu__item {
+    padding-left: 0;
+    padding-right: 0;
+    text-align: center;
+    white-space: nowrap;
     &:hover {
       color: $color-text--highlight;
     }
@@ -1560,12 +1633,12 @@ export default {
   }
 }
 
-.pd-lr20 {
-  padding: 0 20px;
+.el-loading-parent--relative {
+  min-height: 300px;
 }
 
-.market-analysis-result {
-  padding: 20px 0;
+.pd-lr20 {
+  padding: 0 20px;
 }
 
 i.el-icon-caret-bottom {
@@ -1575,6 +1648,11 @@ i.el-icon-caret-bottom {
   }
 }
 
+.analysis-result-anchors {
+  padding: 20px;
+  border-radius: 4px;
+}
+
 .analysis-wrap {
   display: flex;
   align-items: center;
@@ -1590,12 +1668,14 @@ i.el-icon-caret-bottom {
     font-size: 12px;
     .limit-time {
       color: #1d1d1d;
+      font-size: 14px;
     }
   }
 }
 
 .analysis-result-section {
   position: relative;
+  border-radius: 4px;
   .analysis-result-title {
     position: relative;
     display: flex;
@@ -1653,7 +1733,11 @@ i.el-icon-caret-bottom {
   .dimensions-options {
     position: relative;
     padding: 4px 14px;
+    color: #1D1D1D;
     border: 1px solid #E0E0E0;
+    &:not(:last-of-type) {
+      border-right: none;
+    }
     &:hover,
     &.highlight {
       color: #fff;

src/views/analysisReport/components/MarketAreaScatter.vue

@@ -43,7 +43,7 @@ export default {
     return {
       options: {
         height: '570px',
-        colors: ['#05a6f3'],
+        colors: ['#05A6F3', '#0BD991', '#FF9F40'],
         config: this.configArea
       }
     }

src/views/analysisReport/components/MarketLineChart.vue

@@ -40,6 +40,40 @@ export default {
   },
   methods: {
     configOptions (options) {
+      // 面积颜色-渐变
+      Object.assign(options.series[0], {
+        areaStyle: {
+          normal: {
+            color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              {
+                offset: 0,
+                color: 'rgba(42, 190, 209, 0.12)'
+              },
+              {
+                offset: 1,
+                color: 'rgba(42, 190, 209, 0)'
+              }
+            ], false)
+          }
+        }
+      })
+      Object.assign(options.series[1], {
+        areaStyle: {
+          normal: {
+            color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              {
+                offset: 0,
+                color: 'rgba(255, 159, 63, 0.12)'
+              },
+              {
+                offset: 1,
+                color: 'rgba(255, 159, 63, 0)'
+              }
+            ], false)
+          }
+        }
+      })
+
       options.tooltip.formatter = params => {
         let tip = `<div style="padding-top:2px;color:#9B9CA3;">${params[0].name}</div>`
         for (let i = 0; i < params.length; i++) {

src/views/analysisReport/components/MarketOverview.vue

@@ -8,14 +8,13 @@
         <div class="o-item-count">{{ item.count }}</div>
         <div
           class="o-item-percent flex-r-c center"
-          v-if="item.ringRatio"
+          v-show="overviewRateTotal"
           :class="{
-            'color-red': item.ringRatio >= 0,
+            'color-red': item.ringRatio > 0,
             'icon-reverse color-green': item.ringRatio < 0,
-          }"
-        >
-          <span class="o-item-percent-text">环比：{{ Math.abs(item.ringRatio) }}%</span>
-          <span class="el-icon-top"></span>
+          }">
+          <span class="o-item-percent-text">环比：{{ item.ringRatio ? (Math.abs(item.ringRatio) + '%') : '-' }}</span>
+          <span class="el-icon-top" v-if="item.ringRatio"></span>
         </div>
       </div>
     </div>
@@ -68,6 +67,17 @@ export default {
         ]
       }
     }
+  },
+  computed: {
+    overviewRateTotal () {
+      var total = 0
+      this.overviewList.forEach(function (item) {
+        if (item.ringRatio !== undefined && item.ringRatio !== null) {
+          total += item.ringRatio
+        }
+      })
+      return total
+    }
   }
 }
 </script>
@@ -96,6 +106,15 @@ export default {
     .o-item-percent {
       font-size: 16px;
       line-height: 20px;
+      color: #686868;
+      &.color {
+        &-red {
+          color: #FF3A20;
+        }
+        &-green {
+          color: #04B15E;
+        }
+      }
       &-text {
         margin-right: 2px;
       }
@@ -114,12 +133,5 @@ export default {
   line-height: 18px;
   text-align: center;
 }
-.color {
-  &-red {
-    color: #FF3A20;
-  }
-  &-green {
-    color: #04B15E;
-  }
-}
+
 </style>

src/views/analysisReport/components/MarketSegment.vue

@@ -89,7 +89,7 @@ export default {
         const suffix = type === 'count' ? '个' : '万元'
         options.xAxis[0].axisLabel.rotate = 60
         options.xAxis[0].axisLabel.formatter = name => {
-          if (name && name.length >= 4) {
+          if (name && name.length > 4) {
             return `${name.slice(0, 4)}...`
           } else {
             return name

src/views/analysisReport/components/MarketTop3Table.vue

@@ -28,7 +28,13 @@
         header-align="center"
         :label="tableData.columns[1]">
         <template slot-scope="scope">
-          <div class="area">{{ scope.row.name }}</div>
+          <div class="area" v-if="scope.row.name_type">
+            <el-link
+              :underline="false"
+              :disabled="!scope.row.name_id"
+              @click="toOtherPage(scope.row.name_id, scope.row.name_type)">{{ scope.row.name }}</el-link>
+          </div>
+          <div class="area" v-else>{{ scope.row.name }}</div>
           <div class="area-info">
             <span class="j-tag tag-lightblue" v-if="scope.row.value">{{ scope.row.value }}</span>
             <span class="j-tag tag-orange" v-if="scope.row.percent">{{ scope.row.percent }}</span>
@@ -39,9 +45,15 @@
         header-align="center"
         :label="tableData.columns[2]">
         <template slot-scope="scope">
-          <div class="area" v-if="scope.row.winner_name" @click="clickScope(scope)">
-            <span>{{ scope.row.winner_index }}. {{ scope.row.winner_name }}：</span>
-            <span v-if="scope.row.winner_value">{{ scope.row.winner_value }}</span>
+          <div class="area" v-if="scope.row.winner_name">
+            <span>
+              {{ scope.row.winner_index }}.&nbsp;
+              <el-link
+                :underline="false"
+                :disabled="!scope.row.winner_id"
+                @click="toOtherPage(scope.row.winner_id, scope.row.winner_type)">{{ scope.row.winner_name }}</el-link>
+            </span>
+            <span v-if="scope.row.winner_value">：{{ scope.row.winner_value }}</span>
             <span v-if="scope.row.winner_value && scope.row.winner_percent">，</span>
             <span v-if="scope.row.winner_percent">{{ scope.row.winner_percent }}</span>
           </div>
@@ -53,10 +65,11 @@
 </template>
 
 <script>
-import { Table, TableColumn } from 'element-ui'
+import { Table, TableColumn, Link } from 'element-ui'
 export default {
   name: 'market-top3-table',
   components: {
+    [Link.name]: Link,
     [Table.name]: Table,
     [TableColumn.name]: TableColumn
   },
@@ -103,8 +116,20 @@ export default {
     }
   },
   methods: {
-    clickScope (scope) {
-      console.log(scope)
+    toOtherPage (id, type) {
+      let routeUrl = {
+        url: ''
+      }
+      if (type === 'winner') {
+        routeUrl = this.$router.resolve({
+          path: `/svip/ent_ser_portrait/${id}`
+        })
+      } else if (type === 'buyer') {
+        routeUrl = this.$router.resolve({
+          path: `/unit_portrayal/${id}`
+        })
+      }
+      window.open(routeUrl.href)
     },
     objectSpanMethod ({ row, column, rowIndex, columnIndex }) {
       if (columnIndex === 0 || columnIndex === 1) {
@@ -119,6 +144,11 @@ export default {
 </script>
 <style lang="scss" scoped>
 ::v-deep {
-  // reset-ele-table
+  // reset-ele
+  .area {
+    a {
+      vertical-align: unset;
+    }
+  }
 }
 </style>

src/views/analysisReport/components/ProjectScatter.vue

@@ -69,9 +69,7 @@
           label="成交时间">
         </el-table-column>
         <el-table-column
-          align="center"
           header-align="center"
-          prop=""
           class-name="cursor"
           label="中标单位">
           <template slot-scope="scope">