diff --git a/src/assets/images/Index/card_buttons.png b/src/assets/images/Index/card_buttons.png
new file mode 100644
index 0000000..41491a5
Binary files /dev/null and b/src/assets/images/Index/card_buttons.png differ
diff --git a/src/assets/images/Index/card_status.png b/src/assets/images/Index/card_status.png
new file mode 100644
index 0000000..8e125b3
Binary files /dev/null and b/src/assets/images/Index/card_status.png differ
diff --git a/src/assets/images/Index/double_button.png b/src/assets/images/Index/double_button.png
new file mode 100644
index 0000000..32feb5f
Binary files /dev/null and b/src/assets/images/Index/double_button.png differ
diff --git a/src/components/index.js b/src/components/index.js
index 104b317..e1cc1b3 100644
--- a/src/components/index.js
+++ b/src/components/index.js
@@ -13,6 +13,8 @@ import vTabGroup from "@/components/v-tab-group";
 import vTabMode from "@/components/v-tab-mode";
 import vEcharts from "@/components/v-echars";
 import vBtn from "@/components/v-btn";
+import vCardButton from "@/components/v-card-button";
+import vDoubleButton from "@/components/v-double-button";
 import vLabelCtx from "@/components/v-label-ctx"
 import vLabelTable from "@/components/v-label-table"
 import vPagination from "@/components/v-pagination"
@@ -31,6 +33,8 @@ export default {
                 vTabMode,
                 vEcharts,
                 vBtn,
+                vCardButton,
+                vDoubleButton,
                 vLabelCtx,
                 vLabelTable,
                 vPagination,
diff --git a/src/components/v-card-button/index.vue b/src/components/v-card-button/index.vue
new file mode 100644
index 0000000..440f8df
--- /dev/null
+++ b/src/components/v-card-button/index.vue
@@ -0,0 +1,69 @@
+<!--
+ * @Author: your name
+ * @Date: 2021-10-09 18:03:53
+ * @LastEditTime: 2021-10-12 14:15:27
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/components/v-btn/index.vue
+-->
+
+<template>
+    <div class="v-btn-card">
+            <a style="margin-left: 24px; margin-top:8px" @click="edit" class="card-edit">编辑</a>
+            <a-popconfirm @confirm="del" @cancel="cancel"> 
+                <div slot="title" style="color: white">此操作将删除数据，是否继续？</div>  
+                <a style="margin-left: 34px; margin-top:8px" @click="del" class="card-delete">删除</a>
+            </a-popconfirm>
+        
+    </div>
+</template>
+
+<script>
+export default {
+    name: "v-btn-card",
+    methods: {
+        edit() {
+            this.$emit('edit')
+        },
+        del() {
+            this.$emit('del')
+        },
+        cancel() {
+
+        }
+    }
+}
+</script>
+
+<style lang="less" scoped>
+.v-btn-card {
+    display: inline-block;
+    background-image: url('../../assets/images/Index/card_buttons.png');
+    background-repeat: no-repeat;
+    background-size: cover;
+    height: 28px;
+    width: 140px;
+    // border: 2px solid;
+    border-image: linear-gradient(180deg, rgba(69, 149, 230, 1), rgba(0, 172, 255, 0)) 2 2;
+
+    display: flex;
+    font-weight: 600;
+    font-size: 20px;
+
+    
+    .card-edit {
+        font-size: 12px;
+        font-family: PingFang-SC-Bold, PingFang-SC;
+        font-weight: bold;
+        color: #63AECC;
+        line-height: 12px;
+    }
+    .card-delete {
+        font-size: 12px;
+        font-family: PingFang-SC-Bold, PingFang-SC;
+        font-weight: bold;
+        color: #CC5B41;
+        line-height: 12px;
+    }
+}
+</style>
diff --git a/src/components/v-double-button/index.vue b/src/components/v-double-button/index.vue
new file mode 100644
index 0000000..4154407
--- /dev/null
+++ b/src/components/v-double-button/index.vue
@@ -0,0 +1,79 @@
+<!--
+ * @Author: your name
+ * @Date: 2021-10-09 18:03:53
+ * @LastEditTime: 2021-10-12 14:15:27
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/components/v-btn/index.vue
+-->
+
+<template>
+    <div class="v-btn-card">
+            <a @click="left" class="card-edit">
+                {{title[0]}}
+            </a>
+            <a @click="right" class="card-delete">
+                {{title[1]}}
+            </a>
+    </div>
+</template>
+
+<script>
+export default {
+    name: "v-double-button",
+    props: {
+        title: {
+            type: Array,
+            default: ['','']
+        }
+    },
+    methods: {
+        left() {
+            this.$emit('left')
+        },
+        right() {
+            this.$emit('right')
+        },
+        cancel() {
+
+        }
+    }
+}
+</script>
+
+<style lang="less" scoped>
+.v-btn-card {
+    display: inline-block;
+    background-image: url('../../assets/images/Index/double_button.png');
+    background-repeat: no-repeat;
+    background-size: cover;
+    width: 400px;
+    height: 48px;
+    // border: 2px solid;
+    border-image: linear-gradient(180deg, rgba(69, 149, 230, 1), rgba(0, 172, 255, 0)) 2 2;
+
+    display: flex;
+    justify-content: space-around; /*环绕*/
+    font-weight: 600;
+    font-size: 20px;
+
+    .card-edit {
+        margin-top: 12px;
+        font-size: 20px;
+        font-family: PingFang-SC-Bold, PingFang-SC;
+        font-weight: bold;
+        color: #63AECC;
+        line-height: 20px;
+        letter-spacing: 2px;
+    }
+    .card-delete {
+        margin-top: 12px;
+        font-size: 20px;
+        font-family: PingFang-SC-Bold, PingFang-SC;
+        font-weight: bold;
+        color: #63AECC;
+        line-height: 20px;
+        letter-spacing: 2px;
+    }
+}
+</style>
diff --git a/src/router/index.js b/src/router/index.js
index ddab119..6ab3d04 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -42,6 +42,7 @@ import SaleRank from "@/views/SaleRank"
 import ThemeAnalize from "@/views/ThemeAnalize"
 import ThemeData from "@/views/ThemeData"
 import ThemeBoard from "@/views/ThemeBoard"
+import ThemeComparison from "@/views/ThemeComparison"
 import iSwitchEvent from "@/lycomponents/iSwitchEvent"
 const router = [
     {
@@ -326,6 +327,12 @@ const router = [
                 desc: "数据看板",
                 component: ThemeBoard
             },
+            {
+                path: '/ThemeComparison',
+                name: "ThemeComparison",
+                desc: "主题对比",
+                component: ThemeComparison
+            },
         ]
     },
    
diff --git a/src/styles/antd.less b/src/styles/antd.less
index 61a0b62..9c14817 100644
--- a/src/styles/antd.less
+++ b/src/styles/antd.less
@@ -369,7 +369,7 @@ li.ant-calendar-time-picker-select-option-selected {
 }
 
 .ant-tabs-card > .ant-tabs-content > .ant-tabs-tabpane {
-  background: rgb(26, 38, 65) !important;
+  // background: rgb(26, 38, 65) !important;
   padding-bottom: 22px;
 }
 
@@ -394,6 +394,14 @@ li.ant-calendar-time-picker-select-option-selected {
   }
 }
 
+.ant-tabs-nav-scroll {
+  background: rgb(16, 35, 63) !important;
+  height: 56px;
+}
+.ant-tabs-extra-content {
+  background: rgb(16, 35, 63) !important;
+}
+
 .ant-descriptions-row {
   border-color: #63AECC !important;
 }
diff --git a/src/views/BrandComparison/index.vue b/src/views/BrandComparison/index.vue
index c3b3bad..bbbb2d5 100644
--- a/src/views/BrandComparison/index.vue
+++ b/src/views/BrandComparison/index.vue
@@ -28,7 +28,6 @@ export default {
         };
     },
     created() {
-        console.log(this.getBcStatus)
         this.hasData = this.getBcStatus;
     },
     mounted() {},
diff --git a/src/views/EventInsight/industryTOPHE/index.vue b/src/views/EventInsight/industryTOPHE/index.vue
index b49745a..8f06485 100644
--- a/src/views/EventInsight/industryTOPHE/index.vue
+++ b/src/views/EventInsight/industryTOPHE/index.vue
@@ -11,8 +11,9 @@
     <div>
     <div class="hpo-outter" v-loading="loadTop">
         <v-label-div title="热点事件传播导向">
-            <v-btn @click="goPath">事件对比</v-btn>
-            <v-btn @click="goTheme">主题分析</v-btn>
+            <!-- <v-btn @click="goPath">事件对比</v-btn>
+            <v-btn @click="goTheme">主题分析</v-btn> -->
+            <v-double-button @left="goPath" @right="goTheme" :title="['事件对比','主题分析']"></v-double-button>
         </v-label-div>
         <div class="hpo-inner">
             <v-echarts @getData="clickEchars" :opt="opt"></v-echarts>
diff --git a/src/views/ThemeAnalize/index.vue b/src/views/ThemeAnalize/index.vue
index c0101ec..a3d2c9a 100644
--- a/src/views/ThemeAnalize/index.vue
+++ b/src/views/ThemeAnalize/index.vue
@@ -1,29 +1,33 @@
 <template>
   <div class="d-container">
       <div class="d-outer">
-          <div class="d-inner">
-              <v-label-div title="主题分析">
+          <div class="ds-inner">
+              <v-label-div style="background: #010B19" title="主题分析">
                   <v-btn @click="goBack">返回事件洞察</v-btn>
               </v-label-div>
               <div class="card-container">
                   <a-tabs type="card" @change=handlerChangeTheme>
                       <template slot="tabBarExtraContent">
-                          <a-button @click="handlerAdd">新增</a-button>
+                          <a-button @click="handlerAdd" type="primary">新增主题</a-button>
+                          <!-- <a-button @click="handlerCompare" type="primary" style="margin: 0px 16px 0px 16px">主题对比</a-button> -->
                       </template>
                       <a-tab-pane class="tab-pane" key="0" tab="我的主题">
                           <div class="card-items" v-for="(item, index) in myThemeArr" :key="index">
                               <div class="card-item-top">
-                                  <a-button type="primary" v-if="item.isCom">进行中</a-button>
-                                  <a-button v-else disabled>已完成</a-button>
-                                  <a-button-group style="float: right">
+                                  <div class="card-uncomp" v-if="item.isCom">
+                                      <span style="margin-top: 5px">进行中</span>
+                                  </div>
+                                  <div class="card-completed" v-else>已完成</div>
+                                  <!-- <a-button-group style="float: right">
                                       <a-button type="primary" @click="handlerEdit(item.guids)">编辑</a-button>
                                       <a-popconfirm @confirm="handlerDel(item.guids)" @cancel="cancel"> 
                                         <div slot="title" style="color: white">此操作将删除数据，是否继续？</div>  
                                         <a-button type="primary">删除</a-button>
                                       </a-popconfirm>
-                                  </a-button-group>
+                                  </a-button-group> -->
+                                  <v-card-button @edit="handlerEdit(item.guids)" @del="handlerDel(item.guids)"></v-card-button>
                               </div>
-                              <div class="card-item-data" @click="toThemeData(item.guids)">
+                              <div class="card-item-data" @click="toThemeData(item.guids,item.name)">
                                   <div class="cid-title">
                                       {{item.name}}
                                   </div>
@@ -48,7 +52,7 @@
                                       </a-popconfirm>
                                   </a-button-group>
                               </div>
-                              <div class="card-item-data" @click="toThemeData(item.guids)">
+                              <div class="card-item-data" @click="toThemeData(item.guids,item.name)">
                                   <div class="cid-title">
                                       {{item.name}}
                                   </div>
@@ -79,28 +83,42 @@
                       <div class="modal-container" >
                           <div class="modal-form">
                               <a-form-model :model="addForm" :label-col="{span : 4}" :wrapper-col="{span : 18}">
-                                  <v-label-div title="名称设置"></v-label-div>
+                                  <v-label-div :showLine="false" title="名称设置"></v-label-div>
                                   <a-form-model-item label="主题名称"><a-input placeholder="请输入主题名称" v-model="addForm.Name"></a-input></a-form-model-item>
                                   <a-form-model-item label="监测周期">
                                       <a-range-picker style="width: 360px" show-time v-model="selTime" :disabled-date="disabledDate" @calendarChange="calendarPriceRangeChange" valueFormat="YYYY-MM-DD HH:mm:ss" @ok="handlerChangeTime">
                                             <a-icon slot="suffixIcon" type="calendar" />
                                       </a-range-picker>
                                   </a-form-model-item>
-                                  <v-label-div title="分析词设置">
+                                  <v-label-div :showLine="false" title="分析词设置">
                                       <v-tab-mode :active="activeAnd" style="margin-right: 42px" :btns="['必选词和的关系', '主题词或的关系']" @change="handlerHH"></v-tab-mode>
                                   </v-label-div>
                                       <div v-if="mode == 0">
-                                          <a-form-model-item label="必选词"><a-input placeholder="请输入分析关键词，多个词用，隔开，最多支持5个" @change="doCombo" v-model="addForm.DetailsData[0].AnalyzeWord"></a-input></a-form-model-item>
-                                          <a-form-model-item label="可选词"><a-input placeholder="请输入可选词，多个词用，隔开，最多支持5个" @change="doCombo" v-model="addForm.DetailsData[0].HuoWord"></a-input></a-form-model-item>
-                                          <a-form-model-item label="排除词"><a-input placeholder="请输入排除词，多个词用，隔开，最多支持5个" v-model="addForm.DetailsData[0].PaiChu"></a-input></a-form-model-item>
+                                          <a-form-model-item label="必选词"><a-input placeholder="请输入分析关键词，多个词用，隔开，最多支持5个" @change="doCombo" v-model="addForm.DetailsData[0].AnalyzeWord"></a-input>
+                                            <div class="modal-tips">（必选词逗号间是和的关系）</div>
+                                          </a-form-model-item>
+                                          <a-form-model-item label="可选词"><a-input placeholder="请输入可选词，多个词用，隔开，最多支持5个" @change="doCombo" v-model="addForm.DetailsData[0].HuoWord"></a-input>
+                                            <div class="modal-tips">（可选词与必选词是或的关系）</div>
+                                          </a-form-model-item>
+                                          <a-form-model-item label="排除词"><a-input placeholder="请输入排除词，多个词用，隔开，最多支持5个" v-model="addForm.DetailsData[0].PaiChu"></a-input>
+                                            <div class="modal-tips">（例如必选词为大众，排除词为人民大众，搜索结果将不会含有人民大众的数据）</div>
+                                          </a-form-model-item>
                                       </div>
                                       <div v-if="mode == 1">
-                                          <a-form-model-item label="主体词"><a-input placeholder="请输入主体词，多个词用，隔开，最多支持5个" @change="doCombo2" v-model="addForm.DetailsData[0].AnalyzeWord"></a-input></a-form-model-item>
-                                          <a-form-model-item label="关键词组一"><a-input placeholder="请输入关键词，多个词用，隔开，最多支持5个" @change="doCombo2" v-model="addForm.DetailsData[0].HuoWord"></a-input></a-form-model-item>
-                                          <a-form-model-item label="关键词组二"><a-input placeholder="请输入关键词，多个词用，隔开，最多支持5个" @change="doCombo2" v-model="addForm.DetailsData[0].HuoWord1"></a-input></a-form-model-item>
-                                          <a-form-model-item label="排除词"><a-input placeholder="请输入排除词，多个词用，隔开，最多支持5个" v-model="addForm.DetailsData[0].PaiChu"></a-input></a-form-model-item>
+                                          <a-form-model-item label="主体词"><a-input placeholder="请输入主体词，多个词用，隔开，最多支持5个" @change="doCombo2" v-model="addForm.DetailsData[0].AnalyzeWord"></a-input>
+                                            <div class="modal-tips">（主体词逗号之间是或的关系）</div>
+                                          </a-form-model-item>
+                                          <a-form-model-item label="关键词组一"><a-input placeholder="请输入关键词，多个词用，隔开，最多支持5个" @change="doCombo2" v-model="addForm.DetailsData[0].HuoWord"></a-input>
+                                            <div class="modal-tips">（主体词与关键词组是或的关系）</div>
+                                          </a-form-model-item>
+                                          <a-form-model-item label="关键词组二"><a-input placeholder="请输入关键词，多个词用，隔开，最多支持5个" @change="doCombo2" v-model="addForm.DetailsData[0].HuoWord1"></a-input>
+                                            <div class="modal-tips">（主体词与关键词组是或的关系）</div>
+                                          </a-form-model-item>
+                                          <a-form-model-item label="排除词"><a-input placeholder="请输入排除词，多个词用，隔开，最多支持5个" v-model="addForm.DetailsData[0].PaiChu"></a-input>
+                                            <div class="modal-tips">（例如主体为大众，排除词为人民大众，搜索结果将不会含有人民大众的数据）</div>
+                                          </a-form-model-item>
                                       </div>
-                                  <v-label-div title="定向监测"></v-label-div>
+                                  <v-label-div :showLine="false" title="定向监测"></v-label-div>
                                   <a-form-model-item label="媒体">
                                       <a-textarea placeholder="请输入媒体名称，多个词用，隔开，最多支持5个" v-model="addForm.DetailsData[0].Source"></a-textarea>
                                   </a-form-model-item>
@@ -134,16 +152,16 @@
                       <div class="modal-container" >
                           <div class="modal-form">
                               <a-form-model :model="addForm" :label-col="{span : 4}" :wrapper-col="{span : 18}">
-                                  <v-label-div title="名称设置"></v-label-div>
+                                  <v-label-div :showLine="false" title="名称设置"></v-label-div>
                                   <a-form-model-item label="主题名称"><a-input placeholder="请输入主题名称" v-model="addForm.Name"></a-input></a-form-model-item>
                                   <a-form-model-item label="监测周期">
                                       <a-range-picker show-time style="width: 360px" v-model="selTime" :disabled-date="disabledDate" @calendarChange="calendarPriceRangeChange" valueFormat="YYYY-MM-DD HH:mm:ss" @ok="handlerChangeTime">
                                             <a-icon slot="suffixIcon" type="calendar" />
                                       </a-range-picker>
                                   </a-form-model-item>
-                                  <v-label-div title="分析词设置"></v-label-div>
+                                  <v-label-div :showLine="false" title="分析词设置"></v-label-div>
                                   <a-form-model-item label="分析词"><a-textarea placeholder="请输入分析词" v-model="addForm.DetailsData[0].AnalyzeWord"></a-textarea></a-form-model-item>
-                                  <v-label-div title="定向监测"></v-label-div>
+                                  <v-label-div :showLine="false" title="定向监测"></v-label-div>
                                   <a-form-model-item label="媒体">
                                       <a-textarea placeholder="请输入媒体名称，多个词用，隔开，最多支持5个" v-model="addForm.DetailsData[0].Source"></a-textarea>
                                   </a-form-model-item>
@@ -244,14 +262,14 @@ export default {
 .d-outer {
     padding: 0px 16px 16px 16px;
 }
-.d-inner {
+.ds-inner {
     width: 100%;
     // height: 960px;
     border: 2px solid #0F2A4D;
-    background: rgba(6, 21, 41, 0.4);
+    background: #010B19;
 }
 .card-container {
-    background: rgba(6, 21, 41, 0.4);
+    background: #010B19;
     overflow: hidden;
     padding: 16px;
 }
@@ -264,13 +282,39 @@ export default {
 .card-items {
     width: 446px;
     height: 240px;
-    background: linear-gradient(180deg, rgba(0, 136, 201, 0.6), rgba(0, 28, 67, 0.6));
+    border: 2px solid #0F2A4D;
     border-radius: 4px;
     margin-top: 16px;
     margin-right: 16px;
-    border: 2px solid rgba(0, 145, 255, 0.6);
+    background: #010B19;
     .card-item-top {
         width: 100%;
+        display: flex;
+        justify-content: space-between;
+        .card-uncomp {
+            color: #63AECC;
+            width: 95px;
+            height: 28px;
+            border-radius: 0px 0px 0px 1px;
+            background-repeat: no-repeat;
+            background-size: cover;
+            background-image: url('../../assets/images/Index/card_status.png');
+            display: -webkit-box;
+            -webkit-box-align: center;/*兼容FSafari、Chrome */
+            -webkit-box-pack: center;/*兼容FSafari、Chrome */
+        };
+        .card-completed {
+            color: rgb(71, 114, 145);
+            width: 95px;
+            height: 28px;
+            background-repeat: no-repeat;
+            background-size: cover;
+            border-radius: 0px 0px 0px 1px;
+            background-image: url('../../assets/images/Index/card_status.png');
+            display: -webkit-box;
+            -webkit-box-align: center;/*兼容FSafari、Chrome */
+            -webkit-box-pack: center;/*兼容FSafari、Chrome */
+        }
     }
     .card-item-data {
         width: 100%;
@@ -296,7 +340,7 @@ export default {
     }
 }
 .modal-outter {
-    background: rgb(28, 39, 65);
+    background: rgb(18, 35, 65);
     .modal-top {
         padding: 16px;
     }
@@ -333,4 +377,10 @@ export default {
     line-height: 64px;
     margin-top: 16px;
 }
+.modal-tips {
+    float: right;
+    font-weight: 400;
+    color: #63AECC;
+    line-height: 12px
+}
 </style>
\ No newline at end of file
diff --git a/src/views/ThemeAnalize/tbEvent.js b/src/views/ThemeAnalize/tbEvent.js
index c84008f..4e4a906 100644
--- a/src/views/ThemeAnalize/tbEvent.js
+++ b/src/views/ThemeAnalize/tbEvent.js
@@ -205,7 +205,7 @@ export default {
         }
     },
     //前往详情页
-    toThemeData(guids) {
+    toThemeData(guids,name) {
         let obj = {
             token: this.getToken,
             Guids: guids
@@ -221,6 +221,7 @@ export default {
                     path: '/ThemeData',
                     query: {
                         sGuid: guids,
+                        name: name
                     },
                 }
             )
@@ -239,4 +240,12 @@ export default {
     disabledDate(current) {
         return false;
     },
+    //主题对比
+    handlerCompare() {
+        this.$router.push(
+            {
+                path: '/ThemeComparison'
+            }
+        )
+    }
 }
\ No newline at end of file
diff --git a/src/views/ThemeBoard/BloggerArea/index.vue b/src/views/ThemeBoard/BloggerArea/index.vue
index 8e1b6e3..9cd0817 100644
--- a/src/views/ThemeBoard/BloggerArea/index.vue
+++ b/src/views/ThemeBoard/BloggerArea/index.vue
@@ -83,7 +83,7 @@ export default {
         }
         .ba-d2 {
             width: 420px;
-            height: 100%;
+            height: 90%;
             margin-left: 16px;
         }
     }
diff --git a/src/views/ThemeBoard/WordCloud/index.vue b/src/views/ThemeBoard/WordCloud/index.vue
index f1e1409..9e17d09 100644
--- a/src/views/ThemeBoard/WordCloud/index.vue
+++ b/src/views/ThemeBoard/WordCloud/index.vue
@@ -115,8 +115,9 @@ export default {
     margin-left: 16px;
     overflow: hidden;
     .wc-inner {
-        width: 100%;
-        height: calc(100% - 48px);
+        width: 80%;
+        height: calc(80% - 48px);
+        margin: 48px 0px 0px 64px;
     }
 }
 </style>
\ No newline at end of file
diff --git a/src/views/ThemeBoard/index.vue b/src/views/ThemeBoard/index.vue
index 03b86a9..a240e9c 100644
--- a/src/views/ThemeBoard/index.vue
+++ b/src/views/ThemeBoard/index.vue
@@ -3,10 +3,16 @@
       <div class="d-outter">
           <div class="d-outter-d1">
               <v-label-div title="主题概述">
-                  <v-btn @click="goDownload">下载</v-btn>
-                  <v-btn @click="goBack">返回</v-btn>
+                  <!-- <v-btn @click="goDownload">下载</v-btn>
+                  <v-btn @click="goBack">返回</v-btn> -->
+                  <v-double-button @left="goDownload" @right="goBack" :title="['下载','返回']">
+
+                  </v-double-button>
               </v-label-div>
               <div class="s1">
+                  {{title}}
+              </div>
+              <div class="s2">
                   {{themeObj.title}}
               </div>
               <!-- <div class="s2">
@@ -82,11 +88,13 @@ export default {
                     getSummarize: '',
                     getAffections: {Msg: '',sBase64: ''},
                 }
-            }
+            },
+            title: ''
         }
     },
     created() {
         this.form = Object.assign({},{token: this.getToken},this.$route.query)
+        this.title = this.$route.query.name
         this.downloadForm.sGuid = this.$route.query.sGuid;
         this.getTitleData();
     },
diff --git a/src/views/ThemeComparison/ThemeCompare.vue b/src/views/ThemeComparison/ThemeCompare.vue
new file mode 100644
index 0000000..5cbf438
--- /dev/null
+++ b/src/views/ThemeComparison/ThemeCompare.vue
@@ -0,0 +1,162 @@
+<!--
+ * @Author: your name
+ * @Date: 2021-11-05 13:56:24
+ * @LastEditTime: 2021-12-16 10:03:29
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/views/BrandComparison/BrandBeginComparte.vue
+-->
+<template>
+    <div class="d-container">
+        <div class="bbc-inner">
+            <brandCompateHeader ref="brandRef" @del="handlerDel"></brandCompateHeader>
+             <div class="mbc-inner">
+                <v-label-div title="品牌推荐">
+                </v-label-div>
+                <div class="mbc-dd">
+                    <ul class="mb-ul">
+                        <li class="mbc-d-item" :class="chooseArr.includes(item) ? 'liActive': ''" v-for="(item,index) in brands" :key="index" @click="handlerBrand(item)">{{item.brandname}}</li>
+                    </ul>
+                    <div style="clear: both"></div>
+                </div>
+            </div>
+            <div class="beCpm-footer" @click="handlerSubmit">
+                开始对比
+            </div>
+        </div> 
+    </div>
+</template>
+
+<script>
+import {getRecommendSeries} from "@/api/comm"
+import brandCompateHeader from "./brandCompateHeader"
+export default {
+    name: "BrandBeginComparte",
+    components: {
+        brandCompateHeader
+    },
+    inject: ['reload'],
+    data() {
+        return {
+            form: {
+                token: "",
+                sType: 'brand'
+            },
+            chooseArr: [null, null, null, null, null, null],
+            brands: [],
+        }
+    },
+    created() {
+        this.form.token = this.getToken;
+        this.getData();
+    },
+    methods: {
+        // 获取推荐品牌
+        getData() {
+            let obj = Object.assign({}, this.form);
+            getRecommendSeries(obj).then(res => {
+                let data = res.data || [];
+                this.brands = data;
+            })
+        },
+        // 选择默认的车型
+        handlerBrand(row) {
+            for(let i = 0; i < this.chooseArr.length; i++) {
+                let n = this.chooseArr.findIndex(ele =>{
+                    return ele && ele.brandname === row.brandname
+                })
+              
+                if(!this.chooseArr[i] && n === -1) {
+                    this.chooseArr[i] = row;
+                    let obj = this.$refs.brandRef.brands[i]
+                    obj.name = row.brandname;
+                    obj.isDel = true;
+                    return;
+                }
+            }    
+        },
+         // 删除
+        handlerDel(n) {
+            this.chooseArr[n] = null;
+        },
+        // 开始对比
+        handlerSubmit() {
+            let arr = this.$refs.brandRef.brands || [];
+            let filterArr = arr.filter((ele) => {
+                 return ele.name;
+            });
+            if(filterArr.length < 2) {
+                this.$message.warning('至少2个品牌进行对比');
+                return;
+            }
+            this.setBComparison(filterArr);
+            this.setBcStatus(true);
+            this.reload()
+        }
+    }
+}
+</script>
+
+<style lang="less" scoped>
+.bbc-inner {
+    padding: 0px 16px 16px 16px;
+}
+.mbc-inner {
+    width: 100%;
+    height: 488px;
+    border: 2px solid #0f2a4d;
+    margin-top: 16px;
+    .mbc-dd {
+        width: 100%;
+        height: calc(100% - 48px);
+        .mb-ul {
+            width: 100%;
+            height: 100%;
+            margin: 0;
+            padding: 0;
+            list-style: none;
+            li {
+                float: left;
+                width: 295px;
+                height: 89px;
+                background-color: #0f2b47;
+                margin-left: 16px;
+                margin-top: 16px;
+                color: #fff;
+                text-align: center;
+                border-radius: 2px;
+                border: 1px solid transparent;
+                line-height: 89px;
+                font-size: 20px;
+                font-weight: 500;
+                cursor: pointer;
+                &:hover {
+                    border: 1px solid #0058e6;
+                }
+            }
+            .liActive {
+                color: #0058e6;
+                border: 1px solid #0058e6;
+            }
+        }
+    }
+}
+.beCpm-footer {
+    position: relative;
+    width: 354px;
+    height: 64px;
+    background-image: url("../../assets/images/login/img_dlan_nor.png");
+    background-repeat: no-repeat;
+    background-size: cover;
+    bottom: 0px;
+    left: 50%;
+    transform: translate(-50%);
+    cursor: pointer;
+    color: #63aecc;
+    font-size: 24px;
+    font-weight: bold;
+    text-align: center;
+    line-height: 64px;
+    margin-top: 16px;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/ThemeComparison/index.vue b/src/views/ThemeComparison/index.vue
new file mode 100644
index 0000000..84811d2
--- /dev/null
+++ b/src/views/ThemeComparison/index.vue
@@ -0,0 +1,15 @@
+<template>
+    <div class="d-container">
+        
+    </div>
+</template>
+
+<script>
+export default {
+    name: "ThemeComparison"
+}
+</script>
+
+<style lang="less">
+
+</style>
\ No newline at end of file
diff --git a/src/views/ThemeData/index.vue b/src/views/ThemeData/index.vue
index 7deca35..c2e3175 100644
--- a/src/views/ThemeData/index.vue
+++ b/src/views/ThemeData/index.vue
@@ -29,16 +29,16 @@
                     <a-checkbox-group v-model="diaoXing" :disabled="noClick" :options="plainOptions5" @change="(val) => onChange(val, 'diaoXing')" />
                 </div>
                 <div class="d-inner-d1">
-                    <span class="s1">关键词：</span>
+                    <span class="s3">关键词：</span>
                     <a-select v-model="form.sTitleType"  style="width: 80px" @change="handlerSearchMode">
                         <a-select-option :style="{ color: '#fff' }" v-for="item in plainOptions2" :value="item.key" :key="item.key">
                             {{ item.value }}
                         </a-select-option>
                     </a-select>
                     <a-input-search style="width: 250px" placeholder="请输入关键词" enter-button v-model="searchTitle" @search="onSearch"></a-input-search>
-                    <span class="s2">时间排序：</span>
+                    <span class="s4">时间排序：</span>
                     <v-tab-group :value="gValue" :style="{ background: 'transparent' }" :btns="btnTimes" @change="handlerSxTime"></v-tab-group>
-                    <span class="s2">去重筛选：</span>
+                    <span class="s4">去重筛选：</span>
                     <v-tab-group :value="gValue2" :style="{ background: 'transparent' }" :btns="btnTimes2" @change="handlerTime2"></v-tab-group>
                 </div>
                 <div class="d-inner-d2">
@@ -249,6 +249,17 @@ export default {
             color: #fff;
             margin-left: 24px;
         }
+        .s3 {
+            font-size: 14px;
+            color: #fff;
+            margin-top: 6px;
+        }
+        .s4 {
+            font-size: 14px;
+            color: #fff;
+            margin-left: 24px;
+            margin-top: 6px;
+        }
     }
     .d-inner-d2 {
         display: flex;
diff --git a/src/views/ThemeData/tableEvent.js b/src/views/ThemeData/tableEvent.js
index e63a198..034b9d3 100644
--- a/src/views/ThemeData/tableEvent.js
+++ b/src/views/ThemeData/tableEvent.js
@@ -87,7 +87,8 @@ export default {
                 sEndTime: this.form.sEndTime,
                 sTimeType: this.form.sTimeType,
                 sQuDao: this.form.sQuDao,
-                sQingGan: this.form.sQingGan
+                sQingGan: this.form.sQingGan,
+                name: this.$route.query.name,
             }
         })
     },