浏览器提示

src/App.vue

@@ -1,11 +1,59 @@
 <template>
   <div id="app">
     <router-view />
+    <div class="userAgentTips" v-if="userAgentTipShow">
+        <img src="./assets/userAgentWarning.png" width="32px" />
+        <span>当前浏览器可能与网站不兼容！建议使用 chrome 浏览器获得最佳使用体验。 </span>
+        <img src="./assets/userAgentClose.png" width="16px" @click="handleClickUserAgent" />
+    </div>
   </div>
 </template>
 
 <script>
 export default {
   name: "App",
+  data() {
+    return {
+      userAgentTipShow: false,
+    };
+  },
+  created() {
+    this.handleUserAgentRoot()
+  },
+  methods:{
+      // 判断是否为chrome浏览器 
+      handleUserAgentRoot(){
+          if(!sessionStorage.getItem("useragent_root_close") && navigator.userAgent.indexOf('Chrome') == -1){
+              this.userAgentTipShow = true
+          }
+      },
+      handleClickUserAgent(){
+          sessionStorage.setItem("useragent_root_close", true);
+          this.userAgentTipShow = false
+      },
+  }
 };
 </script>
+<style lang="scss" scoped>
+.userAgentTips{
+    position: fixed;
+    top: 62px;
+    left: 50%;
+    // width: 624px;
+    margin-left: -312px;
+    background: #FFFFFF;
+    border-radius: 8px;
+    padding: 12px 16px 12px 8px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    font-size: 16px;
+    line-height: 24px;
+    :nth-child(1){
+        margin-right: 8px;
+    }
+    :nth-child(3){
+        cursor: pointer;
+    }
+}
+</style>

src/components/inputModules/common/Header.vue

@@ -202,6 +202,7 @@ export default {
       Cookies.remove("session_id");
       Cookies.remove("user_code");
       Cookies.remove("user_type");
+      sessionStorage.removeItem("useragent_root_close");
       this.userShow = false;
       this.userMessage = null;
       window.location.href = "/";