topic header

 <template>
-  <div class="topic-head" :style="headStyle">
+  <div v-if="data.topicImageUrl" class="topic-head" :style="headStyle">
     <div class="center">
       <p class="desc">{{data.topicDesc}}</p>
       <div v-if="showAttAmount" class="att-amount">
@@ -17,6 +17,7 @@
       </div>
     </div>
   </div>
+  <div v-else class="topic-head-empty" :style="headStyle"></div>
 </template>
 
 <script>
@@ -70,7 +71,6 @@ export default {
 .topic-head {
   min-height: 360px;
   background-size: 100%;
-  background-image: linear-gradient(140deg, #7A88FF, #7AFFAF);
   box-sizing: border-box;
   position: relative;
   background-size: cover;

@@ -230,7 +230,9 @@ export default {
 
       let step = Math.round((scrollTop - 10) / (this._topicHeaderHeight - this._headerHeight) * 100);
 
-      this.headerAnimateStep = Math.max(Math.min(step, 100), 0);
+      if (this.topicInfo.topicImageUrl) {
+        this.headerAnimateStep = Math.max(Math.min(step, 100), 0);
+      }
 
       if (+get(item, 'data.dataType') === 1) {
         if (this._currentId !== item.data.articleId) {
@@ -252,6 +254,10 @@ export default {
           });
         }
 
+        if (!get(res, 'data.topicImageUrl')) {
+          this.headerAnimateStep = 100;
+        }
+
         if (this.$refs.scroll) {
           this.$refs.scroll.$el.scrollTop = 0;
           this.$refs.scroll.init();