feat:企业画像-新增下载报告，头部UI优化

apps/bigmember_pc/src/views/portrayal/EntPortrayal.vue

@@ -6,32 +6,38 @@
   >
     <div class="ent-header">
       <div class="name">{{ entName }}</div>
-      <div class="ent_option" v-if="!isBIPage">
-        <div class="u-follow" style="margin-right: 10px" @click="openShare">
-          <span class="icon_share"></span>
-          <span class="follow_text">转给同事</span>
-        </div>
-        <EntFollowStar :id="eId" @followSuccess="followSuccess" />
-        <div style="margin-left: 10px" @click="setClickClaim" v-if="showClaim">
-          <div class="u-follow">
+      <div class="handle-option">
+        <div class="ent_option" v-if="!isBIPage">
+          <div class="u-follow" @click="openShare">
+            <span class="icon_share"></span>
+            <span class="follow_text">转给同事</span>
+          </div>
+          <EntFollowStar class="ml-10" :id="eId" @followSuccess="followSuccess" />
+          <div class="ml-10" @click="setClickClaim" v-if="showClaim">
+            <div class="u-follow">
             <span
               :class="{
                 icon_claim_yes: claim.claimed,
                 icon_claim_no: !claim.claimed
               }"
             ></span>
-            <span class="follow_text">{{
-              claim.claimed ? '取消认领' : '认领'
-            }}</span>
+              <span class="follow_text">{{
+                  claim.claimed ? '取消认领' : '认领'
+                }}</span>
+            </div>
+          </div>
+          <div class="u-follow download-report-button ml-10" @click="downloadReport">
+            <img src="@/assets/images/icon/download.png" alt="">
+            <span class="follow_text">下载报告</span>
           </div>
         </div>
-      </div>
-      <div class="ent_option" v-else>
-        <crm-action
-          :ent-info="ajaxEntInfo"
-          :ename="entName"
-          :params="crmParams"
-        ></crm-action>
+        <div class="ent_option" v-else>
+          <crm-action
+            :ent-info="ajaxEntInfo"
+            :ename="entName"
+            :params="crmParams"
+          ></crm-action>
+        </div>
       </div>
       <!-- 未登录不展示，bi下不展示 -->
       <div class="action-right-container" v-if="!isBIPage">
@@ -140,6 +146,7 @@
                 :entId="eId"
                 @onPageChange="onLimitChange"
                 :seachisHide="showConf13 ? false : true"
+                :backFilter="backBidInfoParams"
                 @searchClick="
                   emptyText =
                     '对不起，没有匹配到相关信息，<br>修改时间范围或换个搜索词试试吧'
@@ -249,6 +256,35 @@
         </div>
       </div>
     </div>
+    <!--页面底部下载提示-->
+    <download-bottom-tip
+      v-if="activeName === '5'"
+      typeText="企业分析报告"
+      :hasPower="isConf4"
+      @goFreeExperience="goVipBuy"
+      @downloadReport="downloadReport"
+    >
+      <template #download-text>
+        下载企业分析报告
+      </template>
+      <template #free-text>
+        开通在线查看权限
+      </template>
+    </download-bottom-tip>
+    <!--下载报告弹窗-->
+    <report-download-dialog
+      v-if="reportDownloadConfig.visible"
+      :entId="eId"
+      :entName="entName"
+      type="procurementUnit"
+      :options="reportDownloadConfig"
+      :total-data="proData"
+      :empty-show="emptyShow && !loading"
+      :page-loading="loading"
+      :backFilter="bidInfoParams"
+      :canSelect="canSelect"
+      @scrollChange="handleClick('5')"
+    ></report-download-dialog>
     <CheckUserDialog />
     <!-- 分享弹窗 -->
     <shareBox ref="shareBox"></shareBox>
@@ -272,6 +308,8 @@ import { mapState } from 'vuex'
 import { Dialog, Input, TabPane, Tabs } from 'element-ui'
 import { dateFormatter, getAssetsFile, moneyUnit } from '@/utils'
 import CheckUserDialog from '@/components/dialog/CheckUserDialog'
+import ReportDownloadDialog from '@/views/portrayal/components/EntReportDownloadDialog.vue'
+import DownloadBottomTip from '@/components/download-report/DownloadBottomTip.vue'
 import tdk from '@/utils/mixins/set-tdk.js'
 import {
   getEntWinnerSelect,
@@ -306,7 +344,9 @@ export default {
     EntFollowStar,
     DynamicList,
     shareBox,
-    crmAction
+    crmAction,
+    ReportDownloadDialog,
+    DownloadBottomTip
   },
   props: {
     // 加密企业id
@@ -442,7 +482,10 @@ export default {
         pageSize: 5,
         pageNum: 1
       },
+      // 中标动态筛选条件
       bidInfoParams: {},
+      // 回显的筛选条件
+      backBidInfoParams: {},
       canSelect: {},
       isActive: false,
       chartShowArr: [],
@@ -455,12 +498,18 @@ export default {
       },
       emptyText: '暂无数据',
       scrollEcho: true,
-      timer_: null
+      timer_: null,
+      // 下载报告弹窗配置
+      reportDownloadConfig: {
+        visible: false,
+        hasPower: false
+      }
     }
   },
   provide() {
     return {
-      entInfo: this.entInfo
+      entInfo: this.entInfo,
+      backPageFilter: this.backPageFilter
     }
   },
   watch: {
@@ -673,7 +722,6 @@ export default {
       this.loading = data
     },
     showEmpty(data) {
-      console.log(data)
       this.chartShowArr = data
     },
     // 点击切换
@@ -722,6 +770,11 @@ export default {
       this.ScreenParams = Object.assign(this.ScreenParams, this.bidInfoParams)
       this.dynamicKey = new Date().getTime()
     },
+    // 报告下载筛选条件变更后--回显筛选项
+    backPageFilter (data) {
+      this.backBidInfoParams = JSON.parse(data)
+      this.onLimitChange(data)
+    },
     getSelect() {
       getEntWinnerSelect({ entId: this.eId }).then((res) => {
         if (res.error_code === 0) {
@@ -842,6 +895,15 @@ export default {
       if (list && !this.tabsNum.ContactListnum) {
         this.tabsNum.ContactListnum = list.length
       }
+    },
+    // 下载报告
+    downloadReport () {
+      this.reportDownloadConfig.hasPower = this.isConf4
+      this.reportDownloadConfig.visible = true
+    },
+    // 开通超级订阅
+    goVipBuy () {
+      window.open('/swordfish/page_big_pc/free/svip/buy?type=buy')
     }
   }
 }
@@ -868,16 +930,26 @@ export default {
     > .content-main {
       max-width: 920px;
     }
+    .ent-follow{
+      .follow_text {
+        font-size:13px;
+        line-height: 20px;
+      }
+    }
   }
 
   .ent-header {
     position: relative;
-    display: flex;
-    justify-content: space-between;
+
     align-items: center;
-    padding: 32px 40px;
+    padding: 20px 40px 12px;
     background: #fff;
     line-height: 36px;
+    .handle-option{
+      display: flex;
+      justify-content: right;
+      height: 44px;
+    }
 
     .ent_option {
       display: flex;
@@ -890,6 +962,8 @@ export default {
     }
 
     .follow_text {
+      font-size:13px;
+      line-height: 20px;
       margin-left: 4px;
     }
 
@@ -911,11 +985,10 @@ export default {
 
     .icon_share {
       display: flex;
-      width: 20px;
-      height: 20px;
+      width: 18px;
+      height: 18px;
       background: url('~@/assets/images/icon/share.png') no-repeat;
       background-size: contain;
-      margin-right: 4px;
     }
 
     .u-follow {
@@ -924,11 +997,11 @@ export default {
       cursor: pointer;
 
       .follow_text {
-        font-size: 14px;
+        font-size: 13px;
         font-family: Microsoft YaHei, Microsoft YaHei-Regular;
         font-weight: 400;
         color: #686868;
-        line-height: 22px;
+        line-height: 20px;
       }
     }
   }
@@ -1122,6 +1195,12 @@ export default {
       }
     }
   }
+  .download-report-button{
+    img{
+      width:20px;
+      height: 20px;
+    }
+  }
 }
 
 .p-l-r-32 {
@@ -1140,6 +1219,9 @@ export default {
 .p-r-32 {
   padding-right: 32px;
 }
+.ml-10{
+  margin-left: 10px;
+}
 ::v-deep {
   .ent-phone-list table {
     width: 100%;
@@ -1160,8 +1242,8 @@ export default {
 
 .action-right-container {
   position: absolute;
-  top: 0;
-  right: 0;
+  top: 20px;
+  right: 40px;
   z-index: 99;
   border-radius: 4px;
 }