1

src/views/IPO/components/IpoHeader.vue

@@ -15,6 +15,10 @@
             <div class="search" @click="handlesearch">
                 <img src="@/assets/1x/1x/source2.png" alt="找不到图片">
             </div>
+            <div class="langWrap">
+               <img src="@/assets/1x/source1.png" @click="handleShowLang" class="second">
+               <Lang  ref="lang" class="lang"/>
+             </div>
         </div>
         <!-- <div class="downLoad">
             <div class="report">{{ $t(i18n.global.t('ipo.report')) }}</div>
@@ -31,9 +35,11 @@ export default {
 
 <script lang="ts" setup>
 import i18n from '@/locales'
-import { getCurrentInstance } from 'vue'
+import { getCurrentInstance ,onMounted,onUnmounted} from 'vue'
 import Drawer from '@/views/login/modelComponents/Drawer.vue'
 import { ref } from 'vue'
+import Lang from "@/views/login/components/Lang.vue";
+const lang = ref()
 const drawer = ref(false)
 const { proxy } = (getCurrentInstance() as any)
 const handlesearch = ()=>{
@@ -45,9 +51,46 @@ const handleDrawer = (done: () => void) => {
 const openDrawer = () => {
     drawer.value = true;
 }
+const handleShowLang=(e:any)=>{
+console.log(1111)
+  e.stopPropagation()
+    lang.value.showLang = !lang.value.showLang
+}
+onMounted(() => {
+    document.documentElement.onclick = function () {
+        if (!lang.value.showLang) return
+        lang.value.showLang = false
+    }
+})
+onUnmounted(() => {
+    document.documentElement.onclick = null
+})
 </script>
 
 <style lang="scss" scoped>
+ .langWrap{
+    //   position: absolute;
+    // //   top:-20px;
+    //   left: 260px;
+    //   display: flex;
+    //   align-items: end;
+    position: relative;
+    margin-left: 15px;
+      .second {
+      
+            width: 32px;
+            height: 36px;
+            margin-top: 4px;
+            &:hover {
+                transform: scale(1.2);
+            }
+        }
+    }
+    .lang{
+        position: absolute;
+        top:50px;
+        left: -50px;
+    }
 .headerWrap {
     display: flex;
     justify-content: space-between;
@@ -63,6 +106,7 @@ const openDrawer = () => {
         display: flex;
         justify-content: space-between;
         width: fit-content;
+         position: relative;
         .menu{
     display: none;
     @media screen and (max-width: 768px){
@@ -79,7 +123,7 @@ const openDrawer = () => {
               transform: translateX(-60rem);
             }
         }
-
+        
         .search {
             margin-top: 5px;
             background-color: #fff;