协同宣发

project/sass/apps/Announce/AppAnnounce/components/Phone.vue

@@ -1,5 +1,6 @@
 <template>
   <div class="phone-container">
+    <img class="close" @click="$emit('close')" v-if="isShowClose" src="https://cdn.cunwuyun.cn/dvcp/announce/close.png" />
     <img class="phone" src="https://cdn.cunwuyun.cn/dvcp/announce/phone.png" />
     <img class="phone-wrapper" src="https://cdn.cunwuyun.cn/dvcp/announce/phone-wrapper.png" />
     <div class="right-content">
@@ -56,7 +57,17 @@
 
 <script>
   export default {
-    props: ['fileList', 'avatar', 'content']
+    props: ['fileList', 'avatar', 'content', 'isShowClose'],
+
+    watch: {
+      fileList (v) {
+        if (v.length) {
+          setTimeout(() => {
+            document.querySelector('.right-content').scrollTo(0, 999999)
+          }, 800)
+        }
+      }
+    },
   }
 </script>
 
@@ -75,6 +86,22 @@
       height: 647px;
     }
 
+    .close {
+      position: absolute;
+      top: 0;
+      right: 0;
+      z-index: 111;
+      width: 60px;
+      height: 60px;
+      cursor: pointer;
+      transition: all ease 0.5s;
+      transform: translate(100%, -50%);
+
+      &:hover {
+        opacity: 0.7;
+      }
+    }
+
     .phone-wrapper {
       position: absolute;
       left: 0;