| | |
|---|
| | | backgroundPosition: 'center center', |
|---|
| | | backgroundSize: '100% 100%' |
|---|
| | | }"> |
|---|
| | | <div class="absolute top-0 left-1/2 -translate-x-1/2 h-full px-[16px] flex items-center justify-between"> |
|---|
| | | <div class="absolute top-0 left-1/2 -translate-x-1/2 h-full px-[16px] flex items-center justify-between tabWrapper" > |
|---|
| | | <div class="flex flex-col items-center cursor-pointer relative" @click="onHomeClick('home')"> |
|---|
| | | <div class="flex items-center"> |
|---|
| | | <img class="w-[20px] h-[20px]" :src="getImageUrl(activeTab === 'home' ? 'home_active.png' : 'home.png')" alt=""> |
|---|
| | |
|---|
| | | </div> |
|---|
| | | <div class="flex flex-col items-center ml-[78px] cursor-pointer relative" @click="onHomeClick('xietong')"> |
|---|
| | | <div class="flex items-center"> |
|---|
| | | <img class="w-[20px] h-[20px]" :src="getImageUrl(activeTab === 'xietong' ? 'zhihui_active.png' : 'zhihui.png')" alt=""> |
|---|
| | | <img class="w-[20px] h-[20px]" :src="getImageUrl(activeTab === 'xietong' ? 'xietong_active.png' : 'xietong.png')" alt=""> |
|---|
| | | <div class="text-[20px] text-[#C8C8C8] ml-[8px]" :class="{'text-[#FFBF00]': activeTab === 'xietong'}">协同平台</div> |
|---|
| | | </div> |
|---|
| | | <img class="w-[116px] h-[8px] absolute bottom-[-4px]" :src="getImageUrl('home_line.png')" alt="" v-if="activeTab === 'xietong'"> |
|---|
| | |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | <style lang="scss" scoped> |
|---|
| | | .tabWrapper { |
|---|
| | | margin-left: 150px; |
|---|
| | | } |
|---|
| | | </style> |
|---|
