headerSeach.vue 3.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283
  1. <script setup lang="ts">
  2. import {auto} from "@popperjs/core";
  3. </script>
  4. <template>
  5. <div>
  6. <!--黑条-->
  7. <div class="header bg-#F5F5F5" :class="showSeach ? 'headerfixed' : ''">
  8. <div class="headerCon acea-row row-between-wrapper">
  9. <div class="flex-y-center text-12px">
  10. <div class="mr-30px flex-y-center">
  11. <nuxt-link :to="{ path: '/' }" class="flex-y-center"
  12. ><span class="iconfont icon-shangchengshouye inline-block"></span>商城首页</nuxt-link
  13. >
  14. </div>
  15. <el-popover
  16. v-if="pcHomeCon && pcHomeCon.goPhoneQrCodeType"
  17. :width="auto"
  18. :minWidth="auto"
  19. popper-style="box-shadow: rgb(14 18 22 / 35%) 0px 10px 38px -10px, rgb(14 18 22 / 20%) 0px 10px 20px -15px; padding: 20px;"
  20. >
  21. <template #reference>
  22. <div class="flex-y-center mobileMall">
  23. <span class="iconfont icon-shoujishangcheng inline-block"></span>手机商城
  24. </div>
  25. </template>
  26. <template #default>
  27. <div class="acea-row">
  28. <div v-if="pcHomeCon.goPhoneQrCodeType.includes('1')">
  29. <div :class="pcHomeCon.goPhoneQrCodeType.includes('2')?'mr-26px':''">
  30. <div class="borderSol-eee w-80px h-80px flex-center b-rd-4px mb-10px">
  31. <el-image :src="wechatQrcode" class="w-72px h-72px"></el-image>
  32. </div>
  33. <div class="font-400 text-12px text-#333 w-80px text-center">小程序商城</div>
  34. </div>
  35. </div>
  36. <div v-if="pcHomeCon.goPhoneQrCodeType.includes('2')">
  37. <div class="borderSol-eee w-80px h-80px flex-center b-rd-4px mb-10px">
  38. <qrcode-vue :value="indexDomain" :size="72" level="H" />
  39. </div>
  40. <div class="font-400 text-12px text-#333 w-80px text-center">H5商城</div>
  41. </div>
  42. </div>
  43. </template>
  44. </el-popover>
  45. </div>
  46. <div class="user acea-row row-middle">
  47. <div v-if="!userStore.isLogin" class="item" @click="handlerLogin">登录/注册</div>
  48. <div v-else class="acea-row row-middle" @click.stop="handlerNuxtLink('/users/user_info', 11)">
  49. <span class="line1 font-color" style="max-width: 135px">Hi,{{ userStore.userInfo.nickName }}</span>
  50. <p class="ml-10px item" @click.stop="handleHeaderLogout">退出</p>
  51. </div>
  52. <div class="item" @click="handlerNuxtLink('/users/order_list', 1)">我的订单</div>
  53. <div class="item" @click="handlerNuxtLink('/users/collect_products', 3)">我的收藏</div>
  54. <el-dropdown class="user">
  55. <span class="el-dropdown-link text-12px item">
  56. 商户入驻
  57. <el-icon class="el-icon--right">
  58. <arrow-down />
  59. </el-icon>
  60. </span>
  61. <template #dropdown>
  62. <el-dropdown-menu>
  63. <el-dropdown-item class="text-12px" @click="handlerNuxtLink('/merchant/merchant_settled', 0)"
  64. >商户入驻</el-dropdown-item
  65. >
  66. <el-dropdown-item class="text-12px" @click="handlerNuxtLink('/merchant/application_record', 0)"
  67. >申请记录</el-dropdown-item
  68. >
  69. </el-dropdown-menu>
  70. </template>
  71. </el-dropdown>
  72. </div>
  73. </div>
  74. </div>
  75. </div>
  76. </template>
  77. <style scoped lang="scss">
  78. </style>