优化弹出框

@@ -99,11 +99,11 @@ export default {
   }
 
   .action-sheet-move-enter-active {
-    transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
+    transition: all 0.4s cubic-bezier(0, 0.96, 0.14, 1.06);
   }
 
   .action-sheet-move-leave-active {
-    transition: all 0.1s linear;
+    transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
   }
 
   .action-sheet-mask-enter,
@@ -154,12 +154,8 @@ export default {
   }
 
   .yoho-action-sheet {
-    .yoho-popup-mask {
-      background-color: #f5f5f5;
-    }
-
     .yoho-popup-container {
-      border-radius: 15PX 15PX 0 0;
+      border-radius: 8PX 8PX 0 0;
       overflow: hidden;
     }
   }

@@ -2,7 +2,10 @@
   <div class="comment-list">
     <div class="comment-content-flex">
       <div class="comment-content">
-        <Scroll ref="scroll" :data="commentList" :options="scrollOption" @pulling-up="onPullingUp">
+        <div class="loading" v-if="firstLoading">
+          <Loading></Loading>
+        </div>
+        <Scroll v-else ref="scroll" :data="commentList" :options="scrollOption" @pulling-up="onPullingUp">
           <CommentItem
             v-for="comment in commentList"
             :key="comment.parentComment.id"
@@ -16,7 +19,7 @@
         </Scroll>
       </div>
     </div>
-    <div class="comment-footer">
+    <div class="comment-footer" v-if="!firstLoading">
       <CommentPlaceholder
         class="comment-input"
         :dest-id="destId"
@@ -33,7 +36,7 @@
 
 <script>
 import CommentItem from './comment-item.vue';
-import {Scroll} from 'cube-ui';
+import {Scroll, Loading} from 'cube-ui';
 import {get} from 'lodash';
 import {createNamespacedHelpers} from 'vuex';
 const {mapActions} = createNamespacedHelpers('comment');
@@ -53,6 +56,7 @@ export default {
     return {
       page: 1,
       commentList: [],
+      firstLoading: true,
       scrollOption: {
         bounce: false,
         pullUpLoad: {
@@ -79,11 +83,17 @@ export default {
       if (result.code === 200) {
         const comments = get(result, 'data.commentInfos', []);
 
+        this.$emit('on-page-change', {
+          page: this.page,
+          size: result.data.total
+        });
         if (this.page === 1) {
-          this.commentList = comments;
-          this.$nextTick(() => {
-            this.$emit('on-page-ready', {success: true});
+          await new Promise((r) => {
+            setTimeout(() => {
+              r();
+            }, 400);
           });
+          this.commentList = comments;
         } else {
           this.commentList = this.commentList.concat(comments);
         }
@@ -92,11 +102,10 @@ export default {
         } else {
           dirty = false;
         }
-        this.$emit('on-page-change', {
-          page: this.page,
-          size: result.data.total
-        });
+        this.firstLoading = false;
+        this.$nextTick(() => {
           this.$refs.scroll.forceUpdate(dirty);
+        });
       } else {
         this.$createToast && this.$createToast({
           txt: result.message || '服务器开小差了',
@@ -119,6 +128,7 @@ export default {
     async init() {
       this.page = 1;
       this.commentList = [];
+      this.firstLoading = true;
       this.fetchComments(true);
     },
     async onReply({commentId}) {
@@ -141,11 +151,19 @@ export default {
       }
     }
   },
-  components: {Scroll, CommentItem}
+  components: {Scroll, CommentItem, Loading}
 };
 </script>
 
 <style scoped lang="scss">
+.loading {
+  width: 100%;
+  height: 200px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
 .comment-list {
   width: 100%;
   height: 100%;

@@ -40,8 +40,7 @@
         :article-id="articleId"
         :pos-id="posId"
         @on-close="onClose"
-        @on-comment="onActionComment"
-        @on-page-ready="onPageReady"></Comment>
+        @on-comment="onActionComment"></Comment>
     </YohoActionSheet>
     <MoreActionSheet transfer ref="moreAction" @on-follow="onFollow" @on-delete="onDelete"></MoreActionSheet>
   </div>
@@ -142,6 +141,10 @@ export default {
         }
         this.showCommentActioning = true;
         this.$refs.comment.init();
+        this.$refs.commentAction.show();
+        setTimeout(() => {
+          this.showCommentActioning = false;
+        }, 300);
       });
     },
     onShowMore({article, index}) {

@@ -5,7 +5,7 @@
       <span class="name">{{data.name}}</span>
     </div>
     <div class="opts">
-      <WidgetFollow v-bind="data"></WidgetFollow>
+      <WidgetFollow v-if="data.authorUid" v-bind="data"></WidgetFollow>
     </div>
   </div>
 </template>

 <template>
   <div class="article">
     <ArticleBar class="header" @on-close="onClose"></ArticleBar>
-
     <div class="body" v-if="fetchStatus">
-      <Loading class="loading"></Loading>
+      <div class="loading">
+        <Loading></Loading>
+      </div>
     </div>
     <ArticleBody v-else ref="body" :articleId="grassId" class="body"></ArticleBody>
-
     <ArticleFooter class="footer"
-       v-if="articleDetail"
+       v-if="articleDetail && !fetchStatus"
        v-bind="articleDetail.footer"
        @on-comment-click="onCommentClick"
        @on-close="onClose">
@@ -96,6 +96,8 @@ export default {
 <style lang="scss" scoped>
 
 .loading {
+  width: 100%;
+  height: 200px;
   display: flex;
   align-items: center;
   justify-content: center;

@@ -168,7 +168,7 @@ export default {
 
     const processContents = guangProcess.processArticleDetail(content.data);
 
-    await sleep.sleep(200);
+    await sleep.sleep(400);
     commit(Types.GUANG_ARTICLE_CONTENT, processContents.finalDetail);
     commit(Types.GUANG_DETAIL_PRODUCT_LIST, processContents.allgoods);