Merge branch 'master' into cpq-dev

src/views/adweb/seo/SeoKeywordsRankList.vue

@@ -5,9 +5,10 @@
         <div class="choose-site">
           <span class="t1">站点：</span>
           <select-site @set-site-info="changeSite" selectWidth="300px" />
-          <span style="margin-left: 16px" class="t1"
-            >{{ selectSiteInfo.planName && selectSiteInfo.planType !== 'STATIONCONSTRUCTION' ? selectSiteInfo.planName : '暂无SEO推广套餐~' }}
-            <a-popover placement="bottom" v-show="selectSiteInfo.planName && selectSiteInfo.planType !== 'STATIONCONSTRUCTION'">
+          <span style="margin-left: 16px" class="t1">{{ selectSiteInfo.planName && selectSiteInfo.planType !==
+            'STATIONCONSTRUCTION' ? selectSiteInfo.planName : '暂无SEO推广套餐~' }}
+            <a-popover placement="bottom"
+              v-show="selectSiteInfo.planName && selectSiteInfo.planType !== 'STATIONCONSTRUCTION'">
               <template #content>
                 <span> 指定关键词数：{{ comprehenInfo.planAppointKeywordNum }}&nbsp; </span>
                 <span> 长尾关键词数：{{ comprehenInfo.planLongTailKeywordNum }}&nbsp; </span>
@@ -16,10 +17,7 @@
               </template>
               <img
                 src="https://cutomer-static-bucket.s3.cn-northwest-1.amazonaws.com.cn/public/material/220803883dfy/document/changjianwenti_1676606434975.png"
-                alt="issue"
-                width="25px"
-                height="25px"
-              />
+                alt="issue" width="25px" height="25px" />
             </a-popover>
           </span>
         </div>
@@ -57,60 +55,77 @@
     </a-row>
 
     <a-row class="r3" type="flex" :gutter="16">
-      <a-col :span="12">
+      <a-col :span="8">
         <div class="wrap">
           <p class="t1">指定关键词排名</p>
           <div class="content">
             <div class="d1"><img src="../../../assets/seo/NO1.svg" />1-10位</div>
-            <div class="d2"
-              ><a @click="getTableInfoRank(3, 1)">{{ rankInfo.appointKeyword.firstNum }}</a
-              >个
+            <div class="d2"><a @click="getTableInfoRank(3, 1)">{{ rankInfo.appointKeyword.firstNum }}</a>个
             </div>
           </div>
           <div class="content">
             <div class="d1"><img src="../../../assets/seo/NO2.svg" />11-30位</div>
-            <div class="d2"
-              ><a @click="getTableInfoRank(7, 1)">{{ rankInfo.appointKeyword.secondNum }}</a
-              >个
+            <div class="d2"><a @click="getTableInfoRank(7, 1)">{{ rankInfo.appointKeyword.secondNum }}</a>个
             </div>
           </div>
           <div class="content">
             <div class="d1"><img src="../../../assets/seo/NO3.svg" />31-100位</div>
-            <div class="d2"
-              ><a @click="getTableInfoRank(8, 1)">{{ rankInfo.appointKeyword.thirdType }}</a
-              >个
+            <div class="d2"><a @click="getTableInfoRank(8, 1)">{{ rankInfo.appointKeyword.thirdType }}</a>个
             </div>
           </div>
         </div>
       </a-col>
-      <a-col :span="12">
+      <a-col :span="8">
         <div class="wrap">
           <p class="t1">长尾关键词排名</p>
           <div class="content">
             <div class="d1"><img src="../../../assets/seo/NO1.svg" />1-10位</div>
             <div class="d2">
-              <a @click="longGetTableInfoRank(3)">{{ rankInfo.longTailKeyword.firstNum }}</a
-              >个
+              <a @click="longGetTableInfoRank(3)">{{ rankInfo.longTailKeyword.firstNum }}</a>个
             </div>
           </div>
           <div class="content">
             <div class="d1"><img src="../../../assets/seo/NO2.svg" />11-30位</div>
-            <div class="d2"
-              ><a @click="longGetTableInfoRank(7)">{{ rankInfo.longTailKeyword.secondNum }}</a
-              >个
+            <div class="d2"><a @click="longGetTableInfoRank(7)">{{ rankInfo.longTailKeyword.secondNum }}</a>个
             </div>
           </div>
           <div class="content">
             <div class="d1"><img src="../../../assets/seo/NO3.svg" />31-100位</div>
-            <div class="d2"
-              ><a @click="longGetTableInfoRank(8)">{{ rankInfo.longTailKeyword.thirdType }}</a
-              >个
+            <div class="d2"><a @click="longGetTableInfoRank(8)">{{ rankInfo.longTailKeyword.thirdType }}</a>个
             </div>
           </div>
         </div>
       </a-col>
+      <a-col :span="8">
+        <div class="wrap">
+          <p class="t1">服务情况</p>
+          <div class="content">
+            <div class="d1"><img src="../../../assets/seo/dachengshijian.svg"/>达成时间</div>
+            <div class="d2 d3"><span>{{
+                rankInfo.serverTime.reachStandardTime != null ? rankInfo.serverTime.reachStandardTime.substring(0,10) : '-'
+              }}</span></div>
+          </div>
+          <template v-if=" rankInfo.serverTime.planServiceEndStatus === 1">
+            <div class="content">
+              <div class="d1"><img src="../../../assets/seo/dachengtianshu.svg"/>服务天数</div>
+              <div class="d2 d3"><span>{{getServiceDays(rankInfo.serverTime.planStartTime)}}</span>天</div>
+            </div>
+          </template>
+          <template v-else>
+            <div class="content">
+              <div class="d1"><img src="../../../assets/seo/dachengtianshu.svg"/>达成天数</div>
+              <div class="d2 d3"><span>{{
+                  rankInfo.serverTime.reachStandardDays | filtr_null  }}</span>天</div>
+            </div>
+          </template>
+          <div class="content">
+            <div class="d1"><img src="../../../assets/seo/shengyufuwutianshu.svg"/>剩余服务天数</div>
+            <div class="d2 d3"><span>{{
+                rankInfo.serverTime.remainServerDays | filtr_null}}</span>天</div>
+          </div>
+        </div>
+      </a-col>
     </a-row>
-    <a-row />
     <a-row class="r4">
       <a-card title="指定关键词" :bordered="false" style="width: 100%">
         <a-col :span="24">
@@ -125,31 +140,23 @@
               </ul>
             </a-col>
             <a-col :span="16" style="text-align: right">
-              <a-button
-                type="link"
-                @click="rankingClick"
-                :style="
-                  rankingButtonStatus == false ? 'border-style: none;color: black !important;' : 'border-style: none;color: #544BEB !important;'
-                "
-              >
+              <a-button type="link" @click="rankingClick" :style="rankingButtonStatus == false ? 'border-style: none;color: black !important;' : 'border-style: none;color: #544BEB !important;'
+                ">
                 按排名
                 <a-icon :type="rankingButtonArrow" v-if="rankingButtonStatus" />
               </a-button>
-              <a-button
-                type="link"
-                :style="
-                  wordsButtonStatus == false
-                    ? 'margin-right: 16px;border-style: none;color: black !important;'
-                    : 'margin-right: 16px;border-style: none;color: #544BEB !important;'
-                "
-                @click="wordsClick"
-              >
+              <a-button type="link" :style="wordsButtonStatus == false
+                  ? 'margin-right: 16px;border-style: none;color: black !important;'
+                  : 'margin-right: 16px;border-style: none;color: #544BEB !important;'
+                " @click="wordsClick">
                 按字数
                 <a-icon :type="wordsButtonArrow" v-if="wordsButtonStatus" />
               </a-button>
 
               <a-input placeholder="请输入关键词" style="width: 200px; margin-right: 8px" v-model:value="keywords" />
-              <a-button type="primary" preIcon="ant-design:search-outlined" style="margin-right: 8px" @click="setTable"> 查询 </a-button>
+              <a-button type="primary" preIcon="ant-design:search-outlined" style="margin-right: 8px" @click="setTable">
+                查询
+              </a-button>
 
               <a-button ghost type="primary" preIcon="ant-design:reload-outlined" @click="searchReset"> 重置 </a-button>
 
@@ -159,18 +166,9 @@
         </a-col>
 
         <a-col :span="24">
-          <a-table
-            ref="table"
-            size="middle"
-            :scroll="{ x: true }"
-            rowKey="id"
-            :columns="columns"
-            :dataSource="dataSource"
-            :pagination="ipagination"
-            :loading="loading"
-            class="j-table-force-nowrap"
-            @change="handleTableChange"
-          >
+          <a-table ref="table" size="middle" :scroll="{ x: true }" rowKey="id" :columns="columns"
+            :dataSource="dataSource" :pagination="ipagination" :loading="loading" class="j-table-force-nowrap"
+            @change="handleTableChange">
             <template #bodyCell="{ column, record, index, text }">
               <template v-if="column.key === 'rowIndex'">
                 {{ (ipagination.current - 1) * ipagination.pageSize + index + 1 }}
@@ -185,20 +183,25 @@
 
               <template class="tag" v-if="column.key === 'tag'">
                 <a-popover v-if="text != 0" placement="bottom" overlayClassName="self-pop">
-                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 1 && text <= 10" src="../../../assets/seo/NO1.svg" />
-                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 11 && text <= 20" src="../../../assets/seo/NO2.svg" />
-                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 21 && text <= 30" src="../../../assets/seo/NO3.svg" />
+                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 1 && text <= 10"
+                    src="../../../assets/seo/NO1.svg" />
+                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 11 && text <= 20"
+                    src="../../../assets/seo/NO2.svg" />
+                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 21 && text <= 30"
+                    src="../../../assets/seo/NO3.svg" />
                   <template #content>
                     <p style="margin-bottom: 0">第{{ parseInt((text - 1) / 10) + 1 }}页，总排名{{ text }}</p>
                   </template>
                   <span style="cursor: default; margin-left: 5px">{{ text }}</span>
                 </a-popover>
                 <span v-else>
-                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 1 && text <= 10" src="../../../assets/seo/NO1.svg" />
-                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 11 && text <= 20" src="../../../assets/seo/NO2.svg" />
-                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 21 && text <= 30" src="../../../assets/seo/NO3.svg" />
-                  {{ text }}</span
-                >
+                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 1 && text <= 10"
+                    src="../../../assets/seo/NO1.svg" />
+                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 11 && text <= 20"
+                    src="../../../assets/seo/NO2.svg" />
+                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 21 && text <= 30"
+                    src="../../../assets/seo/NO3.svg" />
+                  {{ text }}</span>
               </template>
               <template v-if="column.key === 'action'">
                 <a-button size="small" @click="gotoSearch(record.keywords)" type="primary">去查询 </a-button>
@@ -223,72 +226,61 @@
               </ul>
             </a-col>
             <a-col :span="16" style="text-align: right">
-              <a-button
-                type="link"
-                @click="longRankingClick"
-                :style="
-                  longRankingButtonStatus == false ? 'border-style: none;color: black !important;' : 'border-style: none;color: #544BEB !important;'
-                "
-              >
+              <a-button type="link" @click="longRankingClick" :style="longRankingButtonStatus == false ? 'border-style: none;color: black !important;' : 'border-style: none;color: #544BEB !important;'
+                ">
                 按排名
                 <a-icon :type="longRankingButtonArrow" v-if="longRankingButtonStatus" />
               </a-button>
-              <a-button
-                type="link"
-                :style="
-                  longWordsButtonStatus == false
-                    ? 'margin-right: 16px;border-style: none;color: black !important;'
-                    : 'margin-right: 16px;border-style: none;color: #544BEB !important;'
-                "
-                @click="longWordsClick"
-              >
+              <a-button type="link" :style="longWordsButtonStatus == false
+                  ? 'margin-right: 16px;border-style: none;color: black !important;'
+                  : 'margin-right: 16px;border-style: none;color: #544BEB !important;'
+                " @click="longWordsClick">
                 按字数
                 <a-icon :type="longWordsButtonArrow" v-if="longWordsButtonStatus" />
               </a-button>
 
               <a-input placeholder="请输入关键词" style="width: 200px; margin-right: 8px" v-model:value="longKeywords" />
 
-              <a-button type="primary" preIcon="ant-design:search-outlined" style="margin-right: 8px" @click="longSetTable"> 查询 </a-button>
+              <a-button type="primary" preIcon="ant-design:search-outlined" style="margin-right: 8px"
+                @click="longSetTable">
+                查询 </a-button>
 
-              <a-button ghost type="primary" preIcon="ant-design:reload-outlined" @click="longSearchReset"> 重置 </a-button>
+              <a-button ghost type="primary" preIcon="ant-design:reload-outlined" @click="longSearchReset"> 重置
+              </a-button>
               <!--              <a-button ghost type="primary"  @click="handleExportXlsLU('关键词排名',2)" style="margin-left: 8px" :loading="longExcelLoading">导出Excel</a-button>-->
             </a-col>
           </a-row>
         </a-col>
 
         <a-col :span="24">
-          <a-table
-            ref="table"
-            size="middle"
-            :scroll="{ x: true }"
-            rowKey="id"
-            :columns="longColumns"
-            :dataSource="longDataSource"
-            :pagination="longIpagination"
-            :loading="longLoading"
-            class="j-table-force-nowrap"
-            @change="handleLongTableChange"
-          >
+          <a-table ref="table" size="middle" :scroll="{ x: true }" rowKey="id" :columns="longColumns"
+            :dataSource="longDataSource" :pagination="longIpagination" :loading="longLoading"
+            class="j-table-force-nowrap" @change="handleLongTableChange">
             <template #bodyCell="{ column, record, index, text }">
               <template v-if="column.key === 'rowIndex'">
                 {{ (longIpagination.current - 1) * longIpagination.pageSize + index + 1 }}
               </template>
               <template class="tag" v-if="column.key === 'tag'">
                 <a-popover v-if="text != 0" placement="bottom" overlayClassName="self-pop">
-                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 1 && text <= 10" src="../../../assets/seo/NO1.svg" />
-                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 11 && text <= 20" src="../../../assets/seo/NO2.svg" />
-                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 21 && text <= 30" src="../../../assets/seo/NO3.svg" />
+                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 1 && text <= 10"
+                    src="../../../assets/seo/NO1.svg" />
+                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 11 && text <= 20"
+                    src="../../../assets/seo/NO2.svg" />
+                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 21 && text <= 30"
+                    src="../../../assets/seo/NO3.svg" />
                   <template #content>
                     <p style="margin-bottom: 0">第{{ parseInt((text - 1) / 10) + 1 }}页，总排名{{ text }}</p>
                   </template>
                   <span style="cursor: default; margin-left: 5px">{{ text }}</span>
                 </a-popover>
                 <span v-else>
-                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 1 && text <= 10" src="../../../assets/seo/NO1.svg" />
-                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 11 && text <= 20" src="../../../assets/seo/NO2.svg" />
-                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 21 && text <= 30" src="../../../assets/seo/NO3.svg" />
-                  {{ text }}</span
-                >
+                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 1 && text <= 10"
+                    src="../../../assets/seo/NO1.svg" />
+                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 11 && text <= 20"
+                    src="../../../assets/seo/NO2.svg" />
+                  <img style="width: 18px; position: relative; top: -2px" v-if="text >= 21 && text <= 30"
+                    src="../../../assets/seo/NO3.svg" />
+                  {{ text }}</span>
               </template>
               <template slot="action" v-if="column.key === 'action'">
                 <a-button size="small" @click="gotoSearch(record.keywords)" type="primary">去查询 </a-button>
@@ -302,910 +294,910 @@
 </template>
 
 <script lang="js">
-  import { getAction, downFile } from '@/api/manage/manage';
-  import selectSite from '@/components/Adweb/selectSite.vue';
-  import { filterObj } from '/@/utils/common/compUtils';
-
-  export default {
-    name: 'SeoKeywordsRankList',
-    components: {
-      selectSite,
-    },
-    data() {
-      return {
-        siteinfo: [],
-        subscriptionId: '',
-        selectSiteInfo: {},
-        siteCode: '',
-        planId: '',
-        columns: [
-          {
-            title: '序号',
-            dataIndex: 'rowIndex',
-            key: 'rowIndex',
-            width: 40,
-            align: 'center',
-            fixed: 'left',
-          },
-          {
-            title: '关键词',
-            dataIndex: 'keywords',
-            key: 'keywords',
-            fixed: 'left',
-            width: 350,
-          },
-        ],
-        longColumns: [
-          {
-            title: '序号',
-            dataIndex: 'rowIndex',
-            key: 'rowIndex',
-            width: 40,
-            align: 'center',
-            fixed: 'left',
-          },
-          {
-            title: '关键词',
-            dataIndex: 'keywords',
-            key: 'keywords',
-            fixed: 'left',
-            width: 350,
-          },
-        ],
-        show: 1,
-        keywordType: undefined,
-        keywords: '',
-        url: {
-          list: '/seo/seoKeywords/keywordList',
-        },
-        ipagination: {
-          pageSize: 10,
-          pageSizeOptions: ['10', '15', '30', '50'],
-        },
-        disableMixinCreated: true,
-        comprehenInfo: {},
-        rankInfo: {
-          appointKeyword: {},
-          longTailKeyword: {},
-          serverTime: {},
-        },
-        excelLoading: false,
-        queryParam: {
-          buttonColmn: 'words',
-          buttonSort: 'asc',
-        },
-        baseInfo: {
-          createTime: '',
-        },
-        routerQuery: {},
-        /* 排序参数 */
-        isorter: {
-          column: 'keywords',
-          order: 'desc',
-        },
-        rankingButtonArrow: 'arrow-up',
-        wordsButtonArrow: 'arrow-up',
-        rankingButtonStatus: false,
-        wordsButtonStatus: true,
-        longIpagination: {
-          current: 1,
-          pageSize: 10,
-          pageSizeOptions: ['10', '15', '30', '50'],
-          showTotal: (total, range) => {
-            return range[0] + '-' + range[1] + ' 共' + total + '条';
-          },
-          showQuickJumper: true,
-          showSizeChanger: true,
-          total: 0,
+import { getAction, downFile } from '@/api/manage/manage';
+import selectSite from '@/components/Adweb/selectSite.vue';
+import { filterObj } from '/@/utils/common/compUtils';
+
+export default {
+  name: 'SeoKeywordsRankList',
+  components: {
+    selectSite,
+  },
+  data() {
+    return {
+      siteinfo: [],
+      subscriptionId: '',
+      selectSiteInfo: {},
+      siteCode: '',
+      planId: '',
+      columns: [
+        {
+          title: '序号',
+          dataIndex: 'rowIndex',
+          key: 'rowIndex',
+          width: 40,
+          align: 'center',
+          fixed: 'left',
         },
-        longQueryParam: {
-          buttonColmn: 'words',
-          buttonSort: 'asc',
+        {
+          title: '关键词',
+          dataIndex: 'keywords',
+          key: 'keywords',
+          fixed: 'left',
+          width: 350,
         },
-        dataSource: [],
-        longDataSource: [],
-        longLoading: false,
-        longExcelLoading: false,
-        longKeywords: '',
-        longShow: 1,
-        /* 排序参数 */
-        longIsorter: {
-          column: 'keywords',
-          order: 'desc',
+      ],
+      longColumns: [
+        {
+          title: '序号',
+          dataIndex: 'rowIndex',
+          key: 'rowIndex',
+          width: 40,
+          align: 'center',
+          fixed: 'left',
         },
-        longRankingButtonArrow: 'arrow-up',
-        longWordsButtonArrow: 'arrow-up',
-        longRankingButtonStatus: false,
-        longWordsButtonStatus: true,
-        /* 筛选参数 */
-        filters: {},
-      };
-    },
-    watch: {
-      '$route.query': {
-        handler: function (val) {
-          this.routerQuery = val;
+        {
+          title: '关键词',
+          dataIndex: 'keywords',
+          key: 'keywords',
+          fixed: 'left',
+          width: 350,
         },
-        immediate: true, // 初次变化立即查询
+      ],
+      show: 1,
+      keywordType: undefined,
+      keywords: '',
+      url: {
+        list: '/seo/seoKeywords/keywordList',
       },
-    },
-    mounted() {
-      this.siteCode = localStorage.getItem('siteCode');
-      this.getSiteInfo();
-    },
-
-    methods: {
-      filterOption(input, option) {
-        return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0;
+      ipagination: {
+        pageSize: 10,
+        pageSizeOptions: ['10', '15', '30', '50'],
       },
-      getAllInfo() {
-        this.getComprehenInfo();
+      disableMixinCreated: true,
+      comprehenInfo: {},
+      rankInfo: {
+        appointKeyword: {},
+        longTailKeyword: {},
+        serverTime: {},
       },
-      resetAllInfo() {
-        this.comprehenInfo = {};
-        this.rankInfo.appointKeyword = {};
-        this.rankInfo.longTailKeyword = {};
-        this.rankInfo.serverTime = {};
-        this.dataSource = [];
-        this.ipagination.current = 1;
-        this.ipagination.total = 0;
-        this.longDataSource = [];
-        this.longIpagination.current = 1;
-        this.longIpagination.total = 0;
+      excelLoading: false,
+      queryParam: {
+        buttonColmn: 'words',
+        buttonSort: 'asc',
       },
-
-      //由于页面的业务关联很多，故将所有的查询条件封装
-      setTableQuery() {
-        this.queryParam.siteCode = this.siteCode;
-        if (this.show == 3) {
-          this.queryParam.rankStart = '1';
-          this.queryParam.rankEnd = '10';
-        } else if (this.show == 4) {
-          this.queryParam.rankStart = '1';
-          this.queryParam.rankEnd = '30';
-        } else if (this.show == 5) {
-          this.queryParam.rankStart = '1';
-          this.queryParam.rankEnd = '50';
-        } else if (this.show == 6) {
-          this.queryParam.rankStart = '1';
-          this.queryParam.rankEnd = '100';
-        } else if (this.show == 7) {
-          this.queryParam.rankStart = '11';
-          this.queryParam.rankEnd = '30';
-        } else if (this.show == 8) {
-          this.queryParam.rankStart = '31';
-          this.queryParam.rankEnd = '100';
-        } else {
-          this.queryParam.rankStart = undefined;
-          this.queryParam.rankEnd = undefined;
-        }
-        this.queryParam.keywordType = this.keywordType;
-        this.queryParam.keywords = this.keywords;
-        this.loadData(1);
+      baseInfo: {
+        createTime: '',
       },
-      setTable() {
-        this.queryParam.reachStandard = undefined;
-        this.setTableQuery();
+      routerQuery: {},
+      /* 排序参数 */
+      isorter: {
+        column: 'keywords',
+        order: 'desc',
       },
-
-      searchReset() {
-        this.show = 1;
-        this.queryParam.reachStandard = undefined;
-        this.keywords = '';
-        this.rankingButtonStatus = false;
-        this.rankingButtonArrow = '';
-        this.wordsButtonStatus = true;
-        this.wordsButtonArrow = 'arrow-up';
-
-        this.queryParam.buttonColmn = 'words';
-        this.queryParam.buttonSort = 'desc';
-        this.setTableQuery();
+      rankingButtonArrow: 'arrow-up',
+      wordsButtonArrow: 'arrow-up',
+      rankingButtonStatus: false,
+      wordsButtonStatus: true,
+      longIpagination: {
+        current: 1,
+        pageSize: 10,
+        pageSizeOptions: ['10', '15', '30', '50'],
+        showTotal: (total, range) => {
+          return range[0] + '-' + range[1] + ' 共' + total + '条';
+        },
+        showQuickJumper: true,
+        showSizeChanger: true,
+        total: 0,
       },
-
-      loadData(arg) {
-        let that = this;
-        let a = [];
-        if (arg === 1) {
-          this.ipagination.current = 1;
-        }
-        var params = this.getQueryParams(); //查询条件
-        params.subscriptionId = that.subscriptionId;
-        params.keywordType = 1;
-        this.loading = true;
-        getAction(this.url.list, params).then((res) => {
-          if (res.success) {
-            let alldata = res.result.records;
-            if (alldata.length > 0) {
-              for (let i in alldata) {
-                let rankInfo = alldata[i].rankInfo;
-                a.push({
-                  id: alldata[i].id,
-                  keywords: alldata[i].keywords,
-                  keywordType: alldata[i].keywordType,
-                  keywordsLength: alldata[i].keywordsLength,
-                  rankInfo: rankInfo,
-                  ...rankInfo,
-                });
-              }
-              this.dataSource = a;
-              this.getTableColums();
-              this.ipagination.total = res.result.total;
-            } else {
-              this.dataSource = a;
-              this.ipagination.total = 0;
-            }
-          }
-          if (res.code === 510) {
-            // createMessage.warning(res.message)
-          }
-          this.loading = false;
-        });
+      longQueryParam: {
+        buttonColmn: 'words',
+        buttonSort: 'asc',
       },
-
-      //先执行获取site信息，只有在获取到siteCode之后，才能执行以下方法
-      getSiteInfo() {
-        let that = this;
-        let data = {
-          siteCode: that.siteCode,
-        };
-        getAction('/seo/seoKeywordsRank/getSubscriptionIdBySiteCode', data).then(function (res) {
-          if (res.code == 200) {
-            that.subscriptionId = res.result[0].id ?? '';
-            that.planId = res.result[0].planId ?? '';
-          }
-        });
+      dataSource: [],
+      longDataSource: [],
+      longLoading: false,
+      longExcelLoading: false,
+      longKeywords: '',
+      longShow: 1,
+      /* 排序参数 */
+      longIsorter: {
+        column: 'keywords',
+        order: 'desc',
       },
+      longRankingButtonArrow: 'arrow-up',
+      longWordsButtonArrow: 'arrow-up',
+      longRankingButtonStatus: false,
+      longWordsButtonStatus: true,
+      /* 筛选参数 */
+      filters: {},
+    };
+  },
+  watch: {
+    '$route.query': {
+      handler: function (val) {
+        this.routerQuery = val;
+      },
+      immediate: true, // 初次变化立即查询
+    },
+  },
+  mounted() {
+    this.siteCode = localStorage.getItem('siteCode');
+    this.getSiteInfo();
+  },
+
+  methods: {
+    filterOption(input, option) {
+      return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0;
+    },
+    getAllInfo() {
+      this.getComprehenInfo();
+    },
+    resetAllInfo() {
+      this.comprehenInfo = {};
+      this.rankInfo.appointKeyword = {};
+      this.rankInfo.longTailKeyword = {};
+      this.rankInfo.serverTime = {};
+      this.dataSource = [];
+      this.ipagination.current = 1;
+      this.ipagination.total = 0;
+      this.longDataSource = [];
+      this.longIpagination.current = 1;
+      this.longIpagination.total = 0;
+    },
 
-      handleTableChange(pagination, filters, sorter) {
-        //分页、排序、筛选变化时触发
-        //TODO 筛选
-        if (Object.keys(sorter).length > 0 && sorter.column) {
-          this.isorter.column = sorter.field;
-          this.isorter.order = 'ascend' === sorter.order ? 'asc' : 'desc';
-        } else {
-          this.isorter.column = '';
-          this.isorter.order = '';
+    //由于页面的业务关联很多，故将所有的查询条件封装
+    setTableQuery() {
+      this.queryParam.siteCode = this.siteCode;
+      if (this.show == 3) {
+        this.queryParam.rankStart = '1';
+        this.queryParam.rankEnd = '10';
+      } else if (this.show == 4) {
+        this.queryParam.rankStart = '1';
+        this.queryParam.rankEnd = '30';
+      } else if (this.show == 5) {
+        this.queryParam.rankStart = '1';
+        this.queryParam.rankEnd = '50';
+      } else if (this.show == 6) {
+        this.queryParam.rankStart = '1';
+        this.queryParam.rankEnd = '100';
+      } else if (this.show == 7) {
+        this.queryParam.rankStart = '11';
+        this.queryParam.rankEnd = '30';
+      } else if (this.show == 8) {
+        this.queryParam.rankStart = '31';
+        this.queryParam.rankEnd = '100';
+      } else {
+        this.queryParam.rankStart = undefined;
+        this.queryParam.rankEnd = undefined;
+      }
+      this.queryParam.keywordType = this.keywordType;
+      this.queryParam.keywords = this.keywords;
+      this.loadData(1);
+    },
+    setTable() {
+      this.queryParam.reachStandard = undefined;
+      this.setTableQuery();
+    },
+
+    searchReset() {
+      this.show = 1;
+      this.queryParam.reachStandard = undefined;
+      this.keywords = '';
+      this.rankingButtonStatus = false;
+      this.rankingButtonArrow = '';
+      this.wordsButtonStatus = true;
+      this.wordsButtonArrow = 'arrow-up';
+
+      this.queryParam.buttonColmn = 'words';
+      this.queryParam.buttonSort = 'desc';
+      this.setTableQuery();
+    },
+
+    loadData(arg) {
+      let that = this;
+      let a = [];
+      if (arg === 1) {
+        this.ipagination.current = 1;
+      }
+      var params = this.getQueryParams(); //查询条件
+      params.subscriptionId = that.subscriptionId;
+      params.keywordType = 1;
+      this.loading = true;
+      getAction(this.url.list, params).then((res) => {
+        if (res.success) {
+          let alldata = res.result.records;
+          if (alldata.length > 0) {
+            for (let i in alldata) {
+              let rankInfo = alldata[i].rankInfo;
+              a.push({
+                id: alldata[i].id,
+                keywords: alldata[i].keywords,
+                keywordType: alldata[i].keywordType,
+                keywordsLength: alldata[i].keywordsLength,
+                rankInfo: rankInfo,
+                ...rankInfo,
+              });
+            }
+            this.dataSource = a;
+            this.getTableColums();
+            this.ipagination.total = res.result.total;
+          } else {
+            this.dataSource = a;
+            this.ipagination.total = 0;
+          }
         }
-        this.ipagination = pagination;
-        this.loadData();
-      },
-      getQueryParams() {
-        //获取查询条件
-        let sqp = {};
-        if (this.superQueryParams) {
-          sqp['superQueryParams'] = encodeURI(this.superQueryParams);
-          sqp['superQueryMatchType'] = this.superQueryMatchType;
+        if (res.code === 510) {
+          // createMessage.warning(res.message)
         }
-        var param = Object.assign(sqp, this.queryParam, this.isorter, this.filters);
-        param.field = this.getQueryField();
-        param.pageNo = this.ipagination.current;
-        param.pageSize = this.ipagination.pageSize;
-        return filterObj(param);
-      },
-      getQueryField() {
-        //TODO 字段权限控制
-        var str = 'id,';
-        this.columns.forEach(function (value) {
-          str += ',' + value.dataIndex;
-        });
-        return str;
-      },
+        this.loading = false;
+      });
+    },
 
-      //切换站点
-      changeSite(selectedSiteInfo) {
-        this.selectSiteInfo = selectedSiteInfo;
-        this.siteCode = selectedSiteInfo.code;
-        this.getSiteInfo();
-        this.keywordType = undefined;
-        this.queryParam.reachStandard = undefined;
-        this.keywords = '';
-        this.show = 1;
-        localStorage.setItem('siteCode', this.siteCode);
-        this.resetAllInfo();
-        this.getAllInfo();
-      },
+    //先执行获取site信息，只有在获取到siteCode之后，才能执行以下方法
+    getSiteInfo() {
+      let that = this;
+      let data = {
+        siteCode: that.siteCode,
+      };
+      getAction('/seo/seoKeywordsRank/getSubscriptionIdBySiteCode', data).then(function (res) {
+        if (res.code == 200) {
+          that.subscriptionId = res.result[0].id ?? '';
+          that.planId = res.result[0].planId ?? '';
+        }
+      });
+    },
 
-      //获取关键词等五个指标
-      getComprehenInfo() {
-        let that = this;
-        let d = {
-          siteCode: that.siteCode,
-          planId: that.planId ? that.planId : '',
-        };
-        getAction('/seo/seoKeywordsRank/comprehensiveInfo', d)
-          .then((res) => {
-            if (res.code == 200) {
-              that.comprehenInfo = res.result;
-            }
-          })
-          .finally(() => {
-            this.getRankInfo();
-            this.setTableQuery();
-            this.longSetTableQuery();
-          });
-      },
+    handleTableChange(pagination, filters, sorter) {
+      //分页、排序、筛选变化时触发
+      //TODO 筛选
+      if (Object.keys(sorter).length > 0 && sorter.column) {
+        this.isorter.column = sorter.field;
+        this.isorter.order = 'ascend' === sorter.order ? 'asc' : 'desc';
+      } else {
+        this.isorter.column = '';
+        this.isorter.order = '';
+      }
+      this.ipagination = pagination;
+      this.loadData();
+    },
+    getQueryParams() {
+      //获取查询条件
+      let sqp = {};
+      if (this.superQueryParams) {
+        sqp['superQueryParams'] = encodeURI(this.superQueryParams);
+        sqp['superQueryMatchType'] = this.superQueryMatchType;
+      }
+      var param = Object.assign(sqp, this.queryParam, this.isorter, this.filters);
+      param.field = this.getQueryField();
+      param.pageNo = this.ipagination.current;
+      param.pageSize = this.ipagination.pageSize;
+      return filterObj(param);
+    },
+    getQueryField() {
+      //TODO 字段权限控制
+      var str = 'id,';
+      this.columns.forEach(function (value) {
+        str += ',' + value.dataIndex;
+      });
+      return str;
+    },
 
-      //获取三个list的数据
-      getRankInfo() {
-        let that = this;
-        let d = {
-          siteCode: that.siteCode,
-          subscriptionId: that.subscriptionId ? that.subscriptionId : '',
-        };
-        getAction('/seo/seoKeywordsRank/getRankInfo', d).then((res) => {
+    //切换站点
+    changeSite(selectedSiteInfo) {
+      this.selectSiteInfo = selectedSiteInfo;
+      this.siteCode = selectedSiteInfo.code;
+      this.getSiteInfo();
+      this.keywordType = undefined;
+      this.queryParam.reachStandard = undefined;
+      this.keywords = '';
+      this.show = 1;
+      localStorage.setItem('siteCode', this.siteCode);
+      this.resetAllInfo();
+      this.getAllInfo();
+    },
+
+    //获取关键词等五个指标
+    getComprehenInfo() {
+      let that = this;
+      let d = {
+        siteCode: that.siteCode,
+        planId: that.planId ? that.planId : '',
+      };
+      getAction('/seo/seoKeywordsRank/comprehensiveInfo', d)
+        .then((res) => {
           if (res.code == 200) {
-            this.rankInfo.appointKeyword = res.result.appointKeyword;
-            this.rankInfo.longTailKeyword = res.result.longTailKeyword;
-            this.rankInfo.serverTime = res.result.serverTime;
+            that.comprehenInfo = res.result;
           }
+        })
+        .finally(() => {
+          this.getRankInfo();
+          this.setTableQuery();
+          this.longSetTableQuery();
         });
-      },
+    },
 
-      //动态处理表格列
-      getTableColums() {
-        let that = this;
-        that.columns = [
-          {
-            title: '序号',
-            dataIndex: 'rowIndex',
-            key: 'rowIndex',
-            width: 40,
-            align: 'center',
-            fixed: 'left',
-            scopedSlots: { customRender: 'dataNo' },
-          },
-          {
-            title: '关键词',
-            dataIndex: 'keywords',
-            key: 'keywords',
-            fixed: 'left',
-            scopedSlots: { customRender: 'keywords' },
-            width: 350,
-          },
-        ];
-        let obj = that.dataSource[0].rankInfo;
-        let dateInfo = Object.keys(obj);
-        dateInfo.sort().reverse();
-        for (let i in dateInfo) {
-          that.columns.push({
-            title: dateInfo[i],
-            dataIndex: dateInfo[i],
-            key: dateInfo[i],
-            scopedSlots: { customRender: 'tag' },
-            align: 'center',
-          });
+    //获取三个list的数据
+    getRankInfo() {
+      let that = this;
+      let d = {
+        siteCode: that.siteCode,
+        subscriptionId: that.subscriptionId ? that.subscriptionId : '',
+      };
+      getAction('/seo/seoKeywordsRank/getRankInfo', d).then((res) => {
+        if (res.code == 200) {
+          this.rankInfo.appointKeyword = res.result.appointKeyword;
+          this.rankInfo.longTailKeyword = res.result.longTailKeyword;
+          this.rankInfo.serverTime = res.result.serverTime;
         }
+      });
+    },
+
+    //动态处理表格列
+    getTableColums() {
+      let that = this;
+      that.columns = [
+        {
+          title: '序号',
+          dataIndex: 'rowIndex',
+          key: 'rowIndex',
+          width: 40,
+          align: 'center',
+          fixed: 'left',
+          scopedSlots: { customRender: 'dataNo' },
+        },
+        {
+          title: '关键词',
+          dataIndex: 'keywords',
+          key: 'keywords',
+          fixed: 'left',
+          scopedSlots: { customRender: 'keywords' },
+          width: 350,
+        },
+      ];
+      let obj = that.dataSource[0].rankInfo;
+      let dateInfo = Object.keys(obj);
+      dateInfo.sort().reverse();
+      for (let i in dateInfo) {
         that.columns.push({
-          title: '操作',
-          dataIndex: 'action',
-          key: 'action',
+          title: dateInfo[i],
+          dataIndex: dateInfo[i],
+          key: dateInfo[i],
+          scopedSlots: { customRender: 'tag' },
           align: 'center',
-          scopedSlots: { customRender: 'action' },
-          fixed: 'right',
-          width: 50,
         });
-      },
+      }
+      that.columns.push({
+        title: '操作',
+        dataIndex: 'action',
+        key: 'action',
+        align: 'center',
+        scopedSlots: { customRender: 'action' },
+        fixed: 'right',
+        width: 50,
+      });
+    },
 
-      //点击排名数量事件
-      getTableInfoRank(d, keywordType) {
-        this.show = d;
-        this.queryParam.reachStandard = undefined;
-        if (keywordType) {
-          this.keywordType = keywordType;
-        }
-        this.setTableQuery();
-      },
+    //点击排名数量事件
+    getTableInfoRank(d, keywordType) {
+      this.show = d;
+      this.queryParam.reachStandard = undefined;
+      if (keywordType) {
+        this.keywordType = keywordType;
+      }
+      this.setTableQuery();
+    },
 
-      //点击第一行五个指标的种类
-      changeKeywordType() {
-        this.queryParam.reachStandard = 1;
-        this.queryParam.rankStart = undefined;
-        this.queryParam.rankEnd = undefined;
-        this.show = 1;
-        this.setTableQuery();
-      },
+    //点击第一行五个指标的种类
+    changeKeywordType() {
+      this.queryParam.reachStandard = 1;
+      this.queryParam.rankStart = undefined;
+      this.queryParam.rankEnd = undefined;
+      this.show = 1;
+      this.setTableQuery();
+    },
 
-      //表格内的去查询按钮
-      gotoSearch(word) {
-        window.open('http://google-proxy.adwebcloud.com/search?q=' + word, '_blank');
-      },
+    //表格内的去查询按钮
+    gotoSearch(word) {
+      window.open('http://google-proxy.adwebcloud.com/search?q=' + word, '_blank');
+    },
+
+    handleExportXlsLU(fileName, keywordType) {
+      let that = this;
+      let param = {
+        siteCode: that.queryParam.siteCode,
+        subscriptionId: that.subscriptionId ? that.subscriptionId : '',
+        keywordType: keywordType,
+      };
+      if (param.siteCode === '') {
+        // createMessage.warning("请先选择站点！");
+        return;
+      }
+      if (keywordType == 1) {
+        this.excelLoading = true;
+      } else {
+        this.longExcelLoading = true;
+      }
 
-      handleExportXlsLU(fileName, keywordType) {
-        let that = this;
-        let param = {
-          siteCode: that.queryParam.siteCode,
-          subscriptionId: that.subscriptionId ? that.subscriptionId : '',
-          keywordType: keywordType,
-        };
-        if (param.siteCode === '') {
-          // createMessage.warning("请先选择站点！");
+      downFile('/seo/seoKeywords/exportExcel', param).then((data) => {
+        if (keywordType === 1) {
+          this.excelLoading = false;
+        } else {
+          this.longExcelLoading = false;
+        }
+        if (!data) {
+          console.log(321);
+          // createMessage.warning("文件下载失败")
           return;
         }
-        if (keywordType == 1) {
-          this.excelLoading = true;
+        if (data.size === 0) {
+          console.log(111);
+          // createMessage.warning("当前站点未有关键词数据，文件导出失败")
+          return;
+        }
+        if (typeof window.navigator.msSaveBlob !== 'undefined') {
+          window.navigator.msSaveBlob(new Blob([data], { type: 'application/vnd.ms-excel' }), fileName + '.xlsx');
         } else {
-          this.longExcelLoading = true;
+          let url = window.URL.createObjectURL(new Blob([data], { type: 'application/vnd.ms-excel' }));
+          let link = document.createElement('a');
+          link.style.display = 'none';
+          link.href = url;
+          link.setAttribute('download', fileName + '.xlsx');
+          document.body.appendChild(link);
+          link.click();
+          document.body.removeChild(link); //下载完成移除元素
+          window.URL.revokeObjectURL(url); //释放掉blob对象
         }
+      });
+    },
 
-        downFile('/seo/seoKeywords/exportExcel', param).then((data) => {
-          if (keywordType === 1) {
-            this.excelLoading = false;
-          } else {
-            this.longExcelLoading = false;
-          }
-          if (!data) {
-            console.log(321);
-            // createMessage.warning("文件下载失败")
-            return;
-          }
-          if (data.size === 0) {
-            console.log(111);
-            // createMessage.warning("当前站点未有关键词数据，文件导出失败")
-            return;
-          }
-          if (typeof window.navigator.msSaveBlob !== 'undefined') {
-            window.navigator.msSaveBlob(new Blob([data], { type: 'application/vnd.ms-excel' }), fileName + '.xlsx');
-          } else {
-            let url = window.URL.createObjectURL(new Blob([data], { type: 'application/vnd.ms-excel' }));
-            let link = document.createElement('a');
-            link.style.display = 'none';
-            link.href = url;
-            link.setAttribute('download', fileName + '.xlsx');
-            document.body.appendChild(link);
-            link.click();
-            document.body.removeChild(link); //下载完成移除元素
-            window.URL.revokeObjectURL(url); //释放掉blob对象
-          }
-        });
-      },
-
-      //按排名排序
-      rankingClick() {
-        let that = this;
-        if (that.rankingButtonStatus == false) {
-          that.rankingButtonStatus = true;
-          that.rankingButtonArrow = 'arrow-up';
-          that.wordsButtonStatus = false;
-          that.wordsButtonArrow = '';
-
-          that.queryParam.buttonColmn = 'ranking';
-          that.queryParam.buttonSort = 'asc';
-        } else if (that.rankingButtonStatus == true && that.rankingButtonArrow == 'arrow-up') {
-          that.rankingButtonArrow = 'arrow-down';
-
-          that.queryParam.buttonColmn = 'ranking';
-          that.queryParam.buttonSort = 'desc';
-        } else if (that.rankingButtonArrow == 'arrow-down') {
-          that.rankingButtonStatus = false;
-          that.queryParam.buttonColmn = '';
-          that.queryParam.buttonSort = '';
-        }
-        that.setTableQuery();
-      },
+    //按排名排序
+    rankingClick() {
+      let that = this;
+      if (that.rankingButtonStatus == false) {
+        that.rankingButtonStatus = true;
+        that.rankingButtonArrow = 'arrow-up';
+        that.wordsButtonStatus = false;
+        that.wordsButtonArrow = '';
+
+        that.queryParam.buttonColmn = 'ranking';
+        that.queryParam.buttonSort = 'asc';
+      } else if (that.rankingButtonStatus == true && that.rankingButtonArrow == 'arrow-up') {
+        that.rankingButtonArrow = 'arrow-down';
+
+        that.queryParam.buttonColmn = 'ranking';
+        that.queryParam.buttonSort = 'desc';
+      } else if (that.rankingButtonArrow == 'arrow-down') {
+        that.rankingButtonStatus = false;
+        that.queryParam.buttonColmn = '';
+        that.queryParam.buttonSort = '';
+      }
+      that.setTableQuery();
+    },
 
-      //按字数排序
-      wordsClick() {
-        let that = this;
-        if (that.wordsButtonStatus == false) {
-          that.wordsButtonStatus = true;
-          that.wordsButtonArrow = 'arrow-up';
-          that.rankingButtonStatus = false;
-          that.rankingButtonArrow = '';
-
-          that.queryParam.buttonColmn = 'words';
-          that.queryParam.buttonSort = 'asc';
-        } else if (that.wordsButtonStatus == true && that.wordsButtonArrow == 'arrow-up') {
-          that.wordsButtonArrow = 'arrow-down';
-
-          that.queryParam.buttonColmn = 'words';
-          that.queryParam.buttonSort = 'desc';
-        } else if (that.wordsButtonArrow == 'arrow-down') {
-          that.wordsButtonStatus = false;
-          that.queryParam.buttonColmn = '';
-          that.queryParam.buttonSort = '';
-        }
-        that.setTableQuery();
-      },
+    //按字数排序
+    wordsClick() {
+      let that = this;
+      if (that.wordsButtonStatus == false) {
+        that.wordsButtonStatus = true;
+        that.wordsButtonArrow = 'arrow-up';
+        that.rankingButtonStatus = false;
+        that.rankingButtonArrow = '';
+
+        that.queryParam.buttonColmn = 'words';
+        that.queryParam.buttonSort = 'asc';
+      } else if (that.wordsButtonStatus == true && that.wordsButtonArrow == 'arrow-up') {
+        that.wordsButtonArrow = 'arrow-down';
+
+        that.queryParam.buttonColmn = 'words';
+        that.queryParam.buttonSort = 'desc';
+      } else if (that.wordsButtonArrow == 'arrow-down') {
+        that.wordsButtonStatus = false;
+        that.queryParam.buttonColmn = '';
+        that.queryParam.buttonSort = '';
+      }
+      that.setTableQuery();
+    },
 
-      //-----一下全是长尾词列表功能方法
-      longLoadData(arg) {
-        let that = this;
-        let a = [];
-        if (arg === 1) {
-          this.longIpagination.current = 1;
-        }
-        var params = this.getLongQueryParams(); //查询条件
-        params.subscriptionId = that.subscriptionId;
-        params.keywordType = 2;
-        this.longLoading = true;
-        getAction(this.url.list, params).then((res) => {
-          if (res.success) {
-            let alldata = res.result.records;
-            if (alldata.length > 0) {
-              for (let i in alldata) {
-                let rankInfo = alldata[i].rankInfo;
-                a.push({
-                  id: alldata[i].id,
-                  keywords: alldata[i].keywords,
-                  keywordType: alldata[i].keywordType,
-                  keywordsLength: alldata[i].keywordsLength,
-                  rankInfo: rankInfo,
-                  ...rankInfo,
-                });
-              }
-              this.longDataSource = a;
-              this.longGetTableColums();
-              this.longIpagination.total = res.result.total;
-            } else {
-              this.longDataSource = a;
-              this.longIpagination.total = 0;
+    //-----一下全是长尾词列表功能方法
+    longLoadData(arg) {
+      let that = this;
+      let a = [];
+      if (arg === 1) {
+        this.longIpagination.current = 1;
+      }
+      var params = this.getLongQueryParams(); //查询条件
+      params.subscriptionId = that.subscriptionId;
+      params.keywordType = 2;
+      this.longLoading = true;
+      getAction(this.url.list, params).then((res) => {
+        if (res.success) {
+          let alldata = res.result.records;
+          if (alldata.length > 0) {
+            for (let i in alldata) {
+              let rankInfo = alldata[i].rankInfo;
+              a.push({
+                id: alldata[i].id,
+                keywords: alldata[i].keywords,
+                keywordType: alldata[i].keywordType,
+                keywordsLength: alldata[i].keywordsLength,
+                rankInfo: rankInfo,
+                ...rankInfo,
+              });
             }
+            this.longDataSource = a;
+            this.longGetTableColums();
+            this.longIpagination.total = res.result.total;
+          } else {
+            this.longDataSource = a;
+            this.longIpagination.total = 0;
           }
-          if (res.code === 510) {
-            // createMessage.warning(res.message)
-          }
-          this.longLoading = false;
-        });
-      },
-
-      //动态处理表格列
-      longGetTableColums() {
-        let that = this;
-        that.longColumns = [
-          {
-            title: '序号',
-            dataIndex: 'rowIndex',
-            key: 'rowIndex',
-            width: 40,
-            align: 'center',
-            fixed: 'left',
-            scopedSlots: { customRender: 'dataNo' },
-          },
-          {
-            title: '关键词',
-            dataIndex: 'keywords',
-            key: 'keywords',
-            fixed: 'left',
-            scopedSlots: { customRender: 'keywords' },
-            width: 350,
-            // sorter: (a, b) => a.keywords - b.keywords,
-            // defaultSortOrder: 'ascend',
-          },
-          // {
-          //   title: '关键词长度',
-          //   dataIndex: 'keywordsLength',
-          //   key: 'keywordsLength',
-          //   fixed: 'left',
-          //   width: 40,
-          //   scopedSlots: { customRender: 'keywordsLength' },
-          // },
-        ];
-        let obj = that.longDataSource[0].rankInfo;
-        let dateInfo = Object.keys(obj);
-        dateInfo.sort().reverse();
-        for (let i in dateInfo) {
-          that.longColumns.push({
-            title: dateInfo[i],
-            dataIndex: dateInfo[i],
-            key: dateInfo[i],
-            scopedSlots: { customRender: 'tag' },
-            align: 'center',
-          });
         }
+        if (res.code === 510) {
+          // createMessage.warning(res.message)
+        }
+        this.longLoading = false;
+      });
+    },
+
+    //动态处理表格列
+    longGetTableColums() {
+      let that = this;
+      that.longColumns = [
+        {
+          title: '序号',
+          dataIndex: 'rowIndex',
+          key: 'rowIndex',
+          width: 40,
+          align: 'center',
+          fixed: 'left',
+          scopedSlots: { customRender: 'dataNo' },
+        },
+        {
+          title: '关键词',
+          dataIndex: 'keywords',
+          key: 'keywords',
+          fixed: 'left',
+          scopedSlots: { customRender: 'keywords' },
+          width: 350,
+          // sorter: (a, b) => a.keywords - b.keywords,
+          // defaultSortOrder: 'ascend',
+        },
+        // {
+        //   title: '关键词长度',
+        //   dataIndex: 'keywordsLength',
+        //   key: 'keywordsLength',
+        //   fixed: 'left',
+        //   width: 40,
+        //   scopedSlots: { customRender: 'keywordsLength' },
+        // },
+      ];
+      let obj = that.longDataSource[0].rankInfo;
+      let dateInfo = Object.keys(obj);
+      dateInfo.sort().reverse();
+      for (let i in dateInfo) {
         that.longColumns.push({
-          title: '操作',
-          dataIndex: 'action',
-          key: 'action',
+          title: dateInfo[i],
+          dataIndex: dateInfo[i],
+          key: dateInfo[i],
+          scopedSlots: { customRender: 'tag' },
           align: 'center',
-          scopedSlots: { customRender: 'action' },
-          fixed: 'right',
-          width: 50,
         });
-      },
+      }
+      that.longColumns.push({
+        title: '操作',
+        dataIndex: 'action',
+        key: 'action',
+        align: 'center',
+        scopedSlots: { customRender: 'action' },
+        fixed: 'right',
+        width: 50,
+      });
+    },
 
-      //由于页面的业务关联很多，故将所有的查询条件封装
-      longSetTableQuery() {
-        let that = this;
-        that.longQueryParam.siteCode = this.siteCode;
-        console.log(that.longQueryParam);
-        if (that.longShow == 3) {
-          that.longQueryParam.rankStart = '1';
-          that.longQueryParam.rankEnd = '10';
-        } else if (that.longShow == 4) {
-          that.longQueryParam.rankStart = '1';
-          that.longQueryParam.rankEnd = '30';
-        } else if (that.longShow == 5) {
-          that.longQueryParam.rankStart = '1';
-          that.longQueryParam.rankEnd = '50';
-        } else if (that.longShow == 6) {
-          that.longQueryParam.rankStart = '1';
-          that.longQueryParam.rankEnd = '100';
-        } else if (that.longShow == 7) {
-          that.longQueryParam.rankStart = '11';
-          that.longQueryParam.rankEnd = '30';
-        } else if (that.longShow == 8) {
-          that.longQueryParam.rankStart = '31';
-          that.longQueryParam.rankEnd = '100';
-        } else {
-          that.longQueryParam.rankStart = undefined;
-          that.longQueryParam.rankEnd = undefined;
-        }
-        that.longQueryParam.keywords = that.longKeywords;
-        that.longLoadData(1);
-      },
+    //由于页面的业务关联很多，故将所有的查询条件封装
+    longSetTableQuery() {
+      let that = this;
+      that.longQueryParam.siteCode = this.siteCode;
+      console.log(that.longQueryParam);
+      if (that.longShow == 3) {
+        that.longQueryParam.rankStart = '1';
+        that.longQueryParam.rankEnd = '10';
+      } else if (that.longShow == 4) {
+        that.longQueryParam.rankStart = '1';
+        that.longQueryParam.rankEnd = '30';
+      } else if (that.longShow == 5) {
+        that.longQueryParam.rankStart = '1';
+        that.longQueryParam.rankEnd = '50';
+      } else if (that.longShow == 6) {
+        that.longQueryParam.rankStart = '1';
+        that.longQueryParam.rankEnd = '100';
+      } else if (that.longShow == 7) {
+        that.longQueryParam.rankStart = '11';
+        that.longQueryParam.rankEnd = '30';
+      } else if (that.longShow == 8) {
+        that.longQueryParam.rankStart = '31';
+        that.longQueryParam.rankEnd = '100';
+      } else {
+        that.longQueryParam.rankStart = undefined;
+        that.longQueryParam.rankEnd = undefined;
+      }
+      that.longQueryParam.keywords = that.longKeywords;
+      that.longLoadData(1);
+    },
 
-      longSetTable() {
-        this.longQueryParam.reachStandard = undefined;
-        this.longSetTableQuery();
-      },
+    longSetTable() {
+      this.longQueryParam.reachStandard = undefined;
+      this.longSetTableQuery();
+    },
 
-      longSearchReset() {
-        this.longShow = 1;
-        this.longQueryParam.reachStandard = undefined;
-        this.longKeywords = '';
-        this.longRankingButtonStatus = false;
-        this.longRankingButtonArrow = '';
-        this.longWordsButtonStatus = true;
-        this.longWordsButtonArrow = 'arrow-up';
-        this.longQueryParam.buttonColmn = 'words';
-        this.longQueryParam.buttonSort = 'asc';
-        this.longSetTableQuery();
-      },
+    longSearchReset() {
+      this.longShow = 1;
+      this.longQueryParam.reachStandard = undefined;
+      this.longKeywords = '';
+      this.longRankingButtonStatus = false;
+      this.longRankingButtonArrow = '';
+      this.longWordsButtonStatus = true;
+      this.longWordsButtonArrow = 'arrow-up';
+      this.longQueryParam.buttonColmn = 'words';
+      this.longQueryParam.buttonSort = 'asc';
+      this.longSetTableQuery();
+    },
 
-      //点击排名数量事件
-      longGetTableInfoRank(d) {
-        this.longShow = d;
-        this.longQueryParam.reachStandard = undefined;
-        this.longSetTableQuery();
-      },
+    //点击排名数量事件
+    longGetTableInfoRank(d) {
+      this.longShow = d;
+      this.longQueryParam.reachStandard = undefined;
+      this.longSetTableQuery();
+    },
 
-      //点击第一行五个指标的种类
-      longChangeKeywordType() {
-        this.longQueryParam.reachStandard = 1;
-        this.longQueryParam.rankStart = undefined;
-        this.longQueryParam.rankEnd = undefined;
-        this.longShow = 1;
-        this.longSetTableQuery();
-      },
+    //点击第一行五个指标的种类
+    longChangeKeywordType() {
+      this.longQueryParam.reachStandard = 1;
+      this.longQueryParam.rankStart = undefined;
+      this.longQueryParam.rankEnd = undefined;
+      this.longShow = 1;
+      this.longSetTableQuery();
+    },
 
-      handleLongTableChange(pagination, filters, sorter) {
-        //分页、排序、筛选变化时触发
-        //TODO 筛选
-        if (Object.keys(sorter).length > 0 && sorter.column) {
-          this.longIsorter.column = sorter.field;
-          this.longIsorter.order = 'ascend' == sorter.order ? 'asc' : 'desc';
-        } else {
-          this.longIsorter.column = '';
-          this.longIsorter.order = '';
-        }
-        this.longIpagination = pagination;
-        this.longLoadData();
-      },
+    handleLongTableChange(pagination, filters, sorter) {
+      //分页、排序、筛选变化时触发
+      //TODO 筛选
+      if (Object.keys(sorter).length > 0 && sorter.column) {
+        this.longIsorter.column = sorter.field;
+        this.longIsorter.order = 'ascend' == sorter.order ? 'asc' : 'desc';
+      } else {
+        this.longIsorter.column = '';
+        this.longIsorter.order = '';
+      }
+      this.longIpagination = pagination;
+      this.longLoadData();
+    },
 
-      getLongQueryParams() {
-        //获取查询条件
-        let sqp = {};
-        var param = Object.assign(sqp, this.longQueryParam, this.longIsorter, this.filters);
-        param.field = this.getLongQueryField();
-        param.pageNo = this.longIpagination.current;
-        param.pageSize = this.longIpagination.pageSize;
-        return filterObj(param);
-      },
-      getLongQueryField() {
-        //TODO 字段权限控制
-        var str = 'id,';
-        this.longColumns.forEach(function (value) {
-          str += ',' + value.dataIndex;
-        });
-        return str;
-      },
+    getLongQueryParams() {
+      //获取查询条件
+      let sqp = {};
+      var param = Object.assign(sqp, this.longQueryParam, this.longIsorter, this.filters);
+      param.field = this.getLongQueryField();
+      param.pageNo = this.longIpagination.current;
+      param.pageSize = this.longIpagination.pageSize;
+      return filterObj(param);
+    },
+    getLongQueryField() {
+      //TODO 字段权限控制
+      var str = 'id,';
+      this.longColumns.forEach(function (value) {
+        str += ',' + value.dataIndex;
+      });
+      return str;
+    },
 
-      //按排名排序
-      longRankingClick() {
-        let that = this;
-        if (that.longRankingButtonStatus == false) {
-          that.longRankingButtonStatus = true;
-          that.longRankingButtonArrow = 'arrow-up';
-          that.longWordsButtonStatus = false;
-          that.longWordsButtonArrow = '';
-
-          that.longQueryParam.buttonColmn = 'ranking';
-          that.longQueryParam.buttonSort = 'asc';
-        } else if (that.longRankingButtonStatus == true && that.longRankingButtonArrow == 'arrow-up') {
-          that.longRankingButtonArrow = 'arrow-down';
-
-          that.longQueryParam.buttonColmn = 'ranking';
-          that.longQueryParam.buttonSort = 'desc';
-        } else if (that.longRankingButtonArrow == 'arrow-down') {
-          that.longRankingButtonStatus = false;
-          that.longQueryParam.buttonColmn = '';
-          that.longQueryParam.buttonSort = '';
-        }
-        that.longSetTableQuery();
-      },
+    //按排名排序
+    longRankingClick() {
+      let that = this;
+      if (that.longRankingButtonStatus == false) {
+        that.longRankingButtonStatus = true;
+        that.longRankingButtonArrow = 'arrow-up';
+        that.longWordsButtonStatus = false;
+        that.longWordsButtonArrow = '';
+
+        that.longQueryParam.buttonColmn = 'ranking';
+        that.longQueryParam.buttonSort = 'asc';
+      } else if (that.longRankingButtonStatus == true && that.longRankingButtonArrow == 'arrow-up') {
+        that.longRankingButtonArrow = 'arrow-down';
+
+        that.longQueryParam.buttonColmn = 'ranking';
+        that.longQueryParam.buttonSort = 'desc';
+      } else if (that.longRankingButtonArrow == 'arrow-down') {
+        that.longRankingButtonStatus = false;
+        that.longQueryParam.buttonColmn = '';
+        that.longQueryParam.buttonSort = '';
+      }
+      that.longSetTableQuery();
+    },
 
-      //按字数排序
-      longWordsClick() {
-        let that = this;
-        if (that.longWordsButtonStatus == false) {
-          that.longWordsButtonStatus = true;
-          that.longWordsButtonArrow = 'arrow-up';
-          that.longRankingButtonStatus = false;
-          that.longRankingButtonArrow = '';
-
-          that.longQueryParam.buttonColmn = 'words';
-          that.longQueryParam.buttonSort = 'asc';
-        } else if (that.longWordsButtonStatus == true && that.longWordsButtonArrow == 'arrow-up') {
-          that.longWordsButtonArrow = 'arrow-down';
-
-          that.longQueryParam.buttonColmn = 'words';
-          that.longQueryParam.buttonSort = 'desc';
-        } else if (that.longWordsButtonArrow == 'arrow-down') {
-          that.longWordsButtonStatus = false;
-          that.longQueryParam.buttonColmn = '';
-          that.longQueryParam.buttonSort = '';
-        }
-        that.longSetTableQuery();
-      },
+    //按字数排序
+    longWordsClick() {
+      let that = this;
+      if (that.longWordsButtonStatus == false) {
+        that.longWordsButtonStatus = true;
+        that.longWordsButtonArrow = 'arrow-up';
+        that.longRankingButtonStatus = false;
+        that.longRankingButtonArrow = '';
+
+        that.longQueryParam.buttonColmn = 'words';
+        that.longQueryParam.buttonSort = 'asc';
+      } else if (that.longWordsButtonStatus == true && that.longWordsButtonArrow == 'arrow-up') {
+        that.longWordsButtonArrow = 'arrow-down';
+
+        that.longQueryParam.buttonColmn = 'words';
+        that.longQueryParam.buttonSort = 'desc';
+      } else if (that.longWordsButtonArrow == 'arrow-down') {
+        that.longWordsButtonStatus = false;
+        that.longQueryParam.buttonColmn = '';
+        that.longQueryParam.buttonSort = '';
+      }
+      that.longSetTableQuery();
     },
-  };
+  },
+};
 </script>
 
 <style lang="less">
-  .self-pop {
-    .ant-popover-inner-content {
-      background: rgb(245, 243, 254);
+.self-pop {
+  .ant-popover-inner-content {
+    background: rgb(245, 243, 254);
 
-      p {
-        font-size: 13px;
-      }
+    p {
+      font-size: 13px;
     }
+  }
 
-    .ant-popover-arrow {
-      border-color: rgb(245, 243, 254) !important;
-    }
+  .ant-popover-arrow {
+    border-color: rgb(245, 243, 254) !important;
   }
+}
 </style>
 
 <style lang="less" scoped>
-  .r1 {
-    .choose-site {
-      display: flex;
-    }
+.r1 {
+  .choose-site {
+    display: flex;
+  }
 
-    .t1 {
-      font-size: 18px;
-    }
+  .t1 {
+    font-size: 18px;
+  }
 
-    .ant-calendar-picker {
-      margin-right: 20px;
-    }
+  .ant-calendar-picker {
+    margin-right: 20px;
+  }
 
-    /deep/ .ant-btn {
-      background: transparent;
-      margin-right: 10px;
+  /deep/ .ant-btn {
+    background: transparent;
+    margin-right: 10px;
 
-      &.active {
-        color: @primary-color;
-      }
+    &.active {
+      color: @primary-color;
     }
   }
+}
 
-  .r2 {
-    background: #fff;
-    padding: 30px;
-    margin: 10px;
+.r2 {
+  background: #fff;
+  padding: 30px;
+  margin: 10px;
 
-    .ant-col {
-      text-align: center;
-      color: #000;
+  .ant-col {
+    text-align: center;
+    color: #000;
 
-      img {
-        width: 13px;
-        margin: -3px 5px 0 0;
-      }
+    img {
+      width: 13px;
+      margin: -3px 5px 0 0;
+    }
 
-      .t1 {
-        font-size: 14px;
-      }
+    .t1 {
+      font-size: 14px;
+    }
 
-      .t2 {
-        font-size: 27px;
-        margin-bottom: 0;
-        font-weight: 500;
-      }
+    .t2 {
+      font-size: 27px;
+      margin-bottom: 0;
+      font-weight: 500;
     }
   }
+}
 
-  .r3 {
-    padding-left: 10px;
-    padding-right: 10px;
-    padding-bottom: 10px;
+.r3 {
+  padding-left: 10px;
+  padding-right: 10px;
+  padding-bottom: 10px;
 
-    .wrap {
-      padding: 20px;
-      background: #fff;
+  .wrap {
+    padding: 20px;
+    background: #fff;
 
-      .t1 {
-        color: #000;
-        font-size: 14px;
-        font-weight: 500;
-      }
+    .t1 {
+      color: #000;
+      font-size: 14px;
+      font-weight: 500;
+    }
 
-      .content {
-        display: block;
-        overflow: hidden;
-        line-height: 1;
-        border-bottom: 1px solid #ddd;
-        padding: 20px 0;
+    .content {
+      display: block;
+      overflow: hidden;
+      line-height: 1;
+      border-bottom: 1px solid #ddd;
+      padding: 20px 0;
 
-        &:last-child {
-          border-bottom: none;
-          padding-bottom: 0;
-        }
+      &:last-child {
+        border-bottom: none;
+        padding-bottom: 0;
+      }
 
-        .d1 {
-          float: left;
-          width: 50%;
-          line-height: 25px;
-          color: #000;
+      .d1 {
+        float: left;
+        width: 50%;
+        line-height: 25px;
+        color: #000;
 
-          img {
-            width: 15px;
-            margin: -4px 5px 0 0;
-          }
+        img {
+          width: 15px;
+          margin: -4px 5px 0 0;
         }
+      }
 
-        .d2 {
-          float: right;
-          width: 50%;
-          text-align: right;
+      .d2 {
+        float: right;
+        width: 50%;
+        text-align: right;
 
-          &.d3 {
-            span {
-              color: #000;
-            }
+        &.d3 {
+          span {
+            color: #000;
           }
+        }
 
-          a {
-            font-size: 25px;
-            font-weight: 500;
-          }
+        a {
+          font-size: 25px;
+          font-weight: 500;
         }
       }
     }
   }
+}
+
+.r4 {
+  padding: 20px;
+  margin-left: 10px;
+  margin-right: 10px;
+  background: #fff;
+
+  .table-tool-wrap {
+    margin-bottom: 15px;
+
+    ul {
+      list-style-type: none;
+      display: block;
+      overflow: hidden;
+      margin: 0;
+      padding: 0;
+
+      li {
+        float: left;
+        margin: 0 10px;
+        color: #333;
+        font-size: 14px;
+        font-weight: 500;
+        cursor: pointer;
+        text-decoration: underline;
 
-  .r4 {
-    padding: 20px;
-    margin-left: 10px;
-    margin-right: 10px;
-    background: #fff;
-
-    .table-tool-wrap {
-      margin-bottom: 15px;
-
-      ul {
-        list-style-type: none;
-        display: block;
-        overflow: hidden;
-        margin: 0;
-        padding: 0;
-
-        li {
-          float: left;
-          margin: 0 10px;
-          color: #333;
-          font-size: 14px;
-          font-weight: 500;
-          cursor: pointer;
-          text-decoration: underline;
-
-          &.active {
-            color: @primary-color;
-          }
+        &.active {
+          color: @primary-color;
         }
       }
     }
   }
+}
 </style>

src/views/adweb/subscribePlan/SubscribePlan.data.ts

@@ -4,7 +4,7 @@ export const columns: BasicColumn[] = [
   {
     title: '套餐类型',
     align: 'left',
-    dataIndex: 'marketType_dictText',
+    dataIndex: 'planType_dictText',
   },
   {
     title: '套餐名称',
@@ -16,13 +16,13 @@ export const columns: BasicColumn[] = [
     align: 'center',
     dataIndex: 'keywordCount',
     customRender: function({text, record})  {
-      if (record.marketType == 'SEO') {
+      if (record.planType == 'SEO') {
         return text + '个'
-      } else if (record.marketType == 'ARTICLE') {
+      } else if (record.planType == 'ARTICLE') {
         return text + '篇'
-      } else if (record.marketType == 'PSEUDOORIGINAL') {
+      } else if (record.planType == 'PSEUDOORIGINAL') {
         return text + '次'
-      }else if (record.marketType == 'STATIONCONSTRUCTION') {
+      }else if (record.planType == 'STATIONCONSTRUCTION') {
         return text + '个'
       }
     }
@@ -52,7 +52,7 @@ export const columns: BasicColumn[] = [
 
 // 高级查询数据
 export const superQuerySchema = {
-  marketType: {title: '套餐类型', order: 0, view: 'list', type: 'string'},
+  planType: {title: '套餐类型', order: 0, view: 'list', type: 'string'},
   planName: {title: '套餐名称', order: 1, view: 'text', type: 'string'},
   keywordCount: {title: '关键词数量', order: 2, view: 'number', type: 'number'},
   target: {title: '关键词达标目标', order: 3, view: 'number', type: 'number'},

src/views/adweb/subscribePlan/SubscribePlanList.vue

@@ -5,9 +5,9 @@
       <a-form ref="formRef" @keyup.enter.native="searchQuery" :model="queryParam" :label-col="labelCol" :wrapper-col="wrapperCol">
         <a-row :gutter="24">
           <a-col :lg="6">
-            <a-form-item name="marketType">
+            <a-form-item name="planType">
               <template #label><span title="套餐类型">套餐类型</span></template>
-              <j-dict-select-tag v-model:value="queryParam.marketType" dictCode="dict_market_type" placeholder="请选择套餐类型" allow-clear />
+              <j-dict-select-tag v-model:value="queryParam.planType" dictCode="dict_plan_type" placeholder="请选择套餐类型" allow-clear />
             </a-form-item>
           </a-col>
           <a-col :lg="6">
@@ -60,13 +60,13 @@
       <template #bodyCell="{ column, record, index, text }">
 
 <!--       自定义列 -->
-        <template v-if="column.key == 'marketType_dictText'">
-          <template v-if="record.marketType == 'SEO'">
+        <template v-if="column.key == 'planType_dictText'">
+          <template v-if="record.planType == 'SEO'">
             <a-tag color="green">
               {{ text }}
             </a-tag>
           </template>
-          <template v-else-if="record.marketType == 'PSEUDOORIGINAL'">
+          <template v-else-if="record.planType == 'PSEUDOORIGINAL'">
             <a-tag color="cyan">
               {{ text }}
             </a-tag>
@@ -86,18 +86,18 @@
       </template>
     </BasicTable>
     <!-- 表单区域 -->
-    <SeoMarketPlanModal ref="registerModal" @success="handleSuccess" />
+    <SubscribePlanModal ref="registerModal" @success="handleSuccess" />
 <!--    <IntegrityCheckingDrawer ref="integrityCheckingDrawer" />-->
   </div>
 </template>
 
-<script lang="ts" name="adweb-seoMarketPlan" setup>
+<script lang="ts" name="adweb-subscribePlan" setup>
   import { reactive, ref } from 'vue';
   import { BasicTable, TableAction } from '/src/components/Table';
   import { useListPage } from '/src/hooks/system/useListPage';
   import { columns, superQuerySchema } from './SubscribePlan.data';
   import { batchDelete, deleteOne, getExportUrl, getImportUrl, list } from './SubscribePlan.api';
-  import SeoMarketPlanModal from './components/SubscribePlanModal.vue';
+  import SubscribePlanModal from './components/SubscribePlanModal.vue';
   // import IntegrityCheckingDrawer from './components/IntegrityCheckingDrawer.vue';
 
   import { useUserStore } from '/src/store/modules/user';

src/views/adweb/subscribePlan/components/IntegrityCheckingDrawer.vue

@@ -170,7 +170,7 @@
           return;
         }
         this.loading = true;
-        postAction('/serp/seoMarketPlan/saveTemplate', {
+        postAction('/adweb/subscribePlan/saveTemplate', {
           checkList: JSON.stringify(d),
           planId: this.id,
         })
@@ -190,7 +190,7 @@
       showDrawer(id) {
         let that = this;
         that.id = id;
-        getAction('/serp/seoMarketPlan/integrityChecking?planId=' + id)
+        getAction('/adweb/subscribePlan/integrityChecking?planId=' + id)
           .then((res) => {
             if (res.success) {
               that.data = res.result;

src/views/adweb/subscribePlan/components/SubscribePlanForm.vue

@@ -5,8 +5,8 @@
         <a-form ref="formRef" class="antd-modal-form" :labelCol="labelCol" :wrapperCol="wrapperCol">
           <a-row>
             <a-col :span="24">
-              <a-form-item label="套餐类型" v-bind="validateInfos.marketType">
-                <j-dict-select-tag v-model:value="formData.marketType" dictCode="dict_market_type" placeholder="请选择套餐类型" allow-clear />
+              <a-form-item label="套餐类型" v-bind="validateInfos.planType">
+                <j-dict-select-tag v-model:value="formData.planType" dictCode="dict_plan_type" placeholder="请选择套餐类型" allow-clear />
               </a-form-item>
             </a-col>
             <a-col :span="24">
@@ -100,7 +100,7 @@
   const emit = defineEmits(['register', 'ok']);
   const formData = reactive<Record<string, any>>({
     id: '',
-    marketType: '',
+    planType: '',
     planName: '',
     keywordCount: undefined,
     target: undefined,
@@ -119,7 +119,7 @@
   const confirmLoading = ref<boolean>(false);
   //表单验证
   const validatorRules = reactive({
-    marketType: [{ required: true, message: '请输入套餐类型!' }],
+    planType: [{ required: true, message: '请输入套餐类型!' }],
     planName: [{ required: true, message: '请输入套餐名称!' }],
     keywordCount: [{ required: true, message: '请输入关键词数量!' }],
     target: [{ required: true, message: '请输入关键词达标目标!' }],

src/views/adweb/subscribePlan/components/SubscribePlanModal.vue

@@ -8,13 +8,13 @@
     @cancel="handleCancel"
     cancelText="关闭"
   >
-    <SeoMarketPlanForm ref="registerForm" @ok="submitCallback" :formDisabled="disableSubmit" :formBpm="false" />
+    <SubscribePlanForm ref="registerForm" @ok="submitCallback" :formDisabled="disableSubmit" :formBpm="false" />
   </j-modal>
 </template>
 
 <script lang="ts" setup>
   import { ref, nextTick, defineExpose } from 'vue';
-  import SeoMarketPlanForm from './SubscribePlanForm.vue';
+  import SubscribePlanForm from './SubscribePlanForm.vue';
   import JModal from '/src/components/Modal/src/JModal/JModal.vue';
 
   const title = ref<string>('');

src/views/adweb/theme/components/AdwebCreateSite.vue

@@ -43,7 +43,7 @@
                 />
               </a-col>
               <a-col :span="3">
-                <router-link :to="{ path: '/deliver/serp/seoMarketPlan/list', query: { from: 'themeList' } }">
+                <router-link :to="{ path: '/system/subscribePlan', query: { from: 'themeList' } }">
                   <a-button type="primary" block>新增</a-button>
                 </router-link>
               </a-col>

src/views/dashboard/Analysis/homePage/adweb3Home.vue

@@ -137,36 +137,71 @@
               </div>
               <!--              </router-link>-->
             </a-col>
-            <a-col :span="4" class="border-right">
+            <template v-if="planType=='SEO'">
+              <a-col :span="4" class="border-right">
               <div class="wrap blue">
                 <a-spin :spinning="coreInfoLoading">
                   <div class="fr">
-                    <p class="title">本周流量</p>
-                    <p>{{ formatNumber(thisWeekData.totalUsers) }}</p>
+                    <p class="title">SEO目标达成数</p>
+                    <p>{{ formatNumber(appointWordCount) }}</p>
                   </div>
                 </a-spin>
               </div>
-            </a-col>
-            <a-col :span="4" class="border-right">
-              <div class="wrap blue">
-                <a-spin :spinning="coreInfoLoading">
-                  <div class="fr">
-                    <p class="title">本月流量</p>
-                    <p>{{ formatNumber(thisMonthData.totalUsers) }}</p>
-                  </div>
-                </a-spin>
-              </div>
-            </a-col>
-            <a-col :span="4">
+              </a-col>
+              <a-col :span="4" class="border-right">
+                <div class="wrap blue">
+                  <a-spin :spinning="coreInfoLoading">
+                    <div class="fr">
+                      <p class="title">实际达成数</p>
+                      <p>{{ formatNumber(currentAchieveCount) }}</p>
+                    </div>
+                  </a-spin>
+                </div>
+              </a-col>
+              <a-col :span="4">
+                <div class="wrap blue">
+                  <a-spin :spinning="coreInfoLoading">
+                    <div class="fr">
+                      <p class="title">目标达成率</p>
+                      <p>{{ achievePercent }}</p>
+                    </div>
+                  </a-spin>
+                </div>
+              </a-col>
+            </template>
+            <template v-else>
+              <a-col :span="4" class="border-right">
               <div class="wrap blue">
                 <a-spin :spinning="coreInfoLoading">
                   <div class="fr">
-                    <p class="title">累计流量</p>
-                    <p>{{ formatNumber(allTimeData.totalUsers) }}</p>
+                    <p class="title">本周流量</p>
+                    <p>{{ formatNumber(thisWeekData.totalUsers) }}</p>
                   </div>
                 </a-spin>
               </div>
-            </a-col>
+              </a-col>
+              <a-col :span="4" class="border-right">
+                <div class="wrap blue">
+                  <a-spin :spinning="coreInfoLoading">
+                    <div class="fr">
+                      <p class="title">本月流量</p>
+                      <p>{{ formatNumber(thisMonthData.totalUsers) }}</p>
+                    </div>
+                  </a-spin>
+                </div>
+              </a-col>
+              <a-col :span="4">
+                <div class="wrap blue">
+                  <a-spin :spinning="coreInfoLoading">
+                    <div class="fr">
+                      <p class="title">累计流量</p>
+                      <p>{{ formatNumber(allTimeData.totalUsers) }}</p>
+                    </div>
+                  </a-spin>
+                </div>
+              </a-col>
+            </template>
+            
             <a-col :span="24" style="margin-top: 10px">
               <a-table
                 class="ant-table-striped"
@@ -333,6 +368,7 @@
   const averageVisitPage = ref(0);
   const bounceRate = ref(0);
   const conversionRate = ref(0);
+  const planType = ref(null);
 
   const isShow = ref(false);
 
@@ -366,7 +402,7 @@
   }
 
   //获取基础信息
-  function getBaseInfo() {
+  const getBaseInfo = () => {
     let d = {
       siteCode: siteCode.value,
     };
@@ -377,11 +413,24 @@
         baseInfo = res.result;
         current.value = baseInfo.siteStatus;
         isShow.value = true;
+        planType.value = baseInfo.planType;
+        if (planType.value == "SEO") {
+          getAction('/seo/seoKeywordsRank/comprehensiveInfo?siteCode='+ siteCode.value).then(function (res) {
+            if (res.code == 200) {
+              currentAchieveCount.value = (res.result.achievedAppointKeywordNum || 0) + 
+                                     (res.result.achievedLongTailKeywordNum || 0);
+              appointWordCount.value = (res.result.planKeywordNum || 0) + 
+                                   (res.result.planLongTailKeywordNum || 0);
+              achievePercent.value = appointWordCount.value > 0 ? 
+                                    ((currentAchieveCount.value / appointWordCount.value) * 100).toFixed(2) + '%' : '0%';
+            }
+          });
+        }
       } else {
         createMessage.error('获取站点基础信息失败，请刷新重试');
       }
     });
-  }
+  };
 
   const yesterdayData = ref({});
   const todayData = ref({});