{"version":3,"file":"SideNavigation.d634f9ba.js","sources":["../../../../src/layouts/components/header/src/SideNavigation.vue"],"sourcesContent":["<script lang=\"ts\" setup>\r\nimport { useTgCustomer } from '~/hooks/useTgCustomer'\r\nimport { useUserInfo } from '~/composables/app'\r\nimport { hasToken } from '~/utils'\r\nimport { useSwapShow } from '~/composables/app/useSwapShow'\r\n\r\nconst { enableExchange } = useSwapShow()\r\nconst visible = ref(false)\r\nconst isLogout = ref(false)\r\nconst tgLink = useTgCustomer()\r\nconst { userInfo, clearInfo } = useUserInfo()\r\nfunction handleLogout() {\r\n  visible.value = false\r\n  isLogout.value = true\r\n}\r\n\r\nconst loadLogout = ref(false)\r\nasync function logout() {\r\n  if (hasToken()) {\r\n    try {\r\n      loadLogout.value = true\r\n      await apis.authLogout(undefined)\r\n      clearInfo()\r\n      loadLogout.value = false\r\n      aMessage.success($t('zvpQimqzEbDu2UpIa73yP'))\r\n      isLogout.value = false\r\n    }\r\n    catch {\r\n      console.log('注销Token失败')\r\n      loadLogout.value = false\r\n    }\r\n  }\r\n}\r\n</script>\r\n\r\n<template>\r\n  <div class=\"side-nav-wrapper\">\r\n    <div class=\"open-btn text-left p-[5px] pl0\" data-test-id=\"ac14\" @click=\"visible = true\">\r\n      <i class=\"icon i-fluent-mdl2:numbered-list-text text-[22px]\" />\r\n    </div>\r\n    <ClientOnly>\r\n      <ADrawer v-model:open=\"visible\" rootClassName=\"side-nav-drawer\" :closable=\"false\" placement=\"left\">\r\n        <ul class=\"nav-list\" data-test-id=\"4026\" @click=\"visible = false\">\r\n          <li class=\"item log\">\r\n            <div class=\"link\">\r\n              <i class=\"icon i-local:logo-1\" />\r\n              <span class=\"title\">Feee.io</span>\r\n            </div>\r\n          </li>\r\n          <li v-if=\"userInfo\" class=\"mb-10px\">\r\n            <a class=\"info\" :href=\"`/console?lang=${$t('console-lang')}`\" data-test-id=\"dCLJ\">\r\n              <div>\r\n                <i class=\"icon i-local:user?mask !text-[#e2e8f2] mr-0.2em\" />\r\n                <span class=\"text !text-14px w-110px overflow-hidden text-ellipsis whitespace-nowrap\">\r\n                  {{ userInfo?.account }}\r\n                </span>\r\n              </div>\r\n              <div>\r\n                <i class=\"icon i-local:pocket?mask !text-[#e2e8f2] mr-0.2em\" />\r\n                <span class=\"text !text-14px\">{{ fixed(userInfo?.trx_money, 2) }} TRX</span>\r\n              </div>\r\n            </a>\r\n          </li>\r\n          <li v-else class=\"login\">\r\n            <a :href=\"`/console?lang=${$t('console-lang')}`\" data-test-id=\"xdtl\">{{ $t('vTL9tlsWzbAAgQHYbEYMq') }}</a>\r\n          </li>\r\n          <li class=\"item\">\r\n            <NuxtLink class=\"link\" :to=\"localePath('/')\">\r\n              <i class=\"icon i-local:home-s1?mask\" />\r\n              <span class=\"text\">{{ $t('tXRmdyXSXwjXI1ckkd-W4') }}</span>\r\n            </NuxtLink>\r\n          </li>\r\n          <li class=\"item\">\r\n            <NuxtLink class=\"link\" :to=\"localePath('/c2c')\">\r\n              <i class=\"icon i-local:deal-s1?mask\" />\r\n              <span class=\"text\">{{ $t('yiSrOfcmDFQ4S_64vwKmE') }}</span>\r\n              <img src=\"~/assets/icons/hot-s1.svg\" class=\"w-[35px] ml2\" alt=\"\">\r\n            </NuxtLink>\r\n          </li>\r\n          <li class=\"item\">\r\n            <NuxtLink class=\"link\" :to=\"localePath('/b2c')\">\r\n              <i class=\"icon i-local:energy-s1?mask\" />\r\n              <span class=\"text\">{{ $t('syeMRIeBr3TkMUaTmUyEH') }}</span>\r\n            </NuxtLink>\r\n          </li>\r\n          <!-- <li class=\"item\" v-if=\"enableExchange\">\r\n            <NuxtLink class=\"link\" :to=\"localePath('/swap')\">\r\n              <i class=\"icon i-local:swap-s1?mask\" />\r\n              <span class=\"text\">{{ $t('t1QZ_e94a6URx3hw3ARVe') }}</span>\r\n            </NuxtLink>\r\n          </li> -->\r\n          <li class=\"item\" data-test-id=\"n03e\" @click=\"globalModal.Recommend?.open()\">\r\n            <span class=\"link\">\r\n              <i class=\"icon i-local:praise-s1?mask\" />\r\n              <span class=\"text\">{{ $t('s6hGj36jqP0Qyb57_CW9M') }}</span>\r\n            </span>\r\n          </li>\r\n          <li class=\"item announcement\">\r\n            <NuxtLink class=\"link\" :to=\"localePath('/announcement')\">\r\n              <i class=\"icon i-local:char-s1?mask\" />\r\n              <span class=\"text\">{{ $t('dTKmOOljwW8ju5qOEXBtv') }}</span>\r\n            </NuxtLink>\r\n          </li>\r\n          <li class=\"item agent\">\r\n            <NuxtLink class=\"link\" :to=\"localePath('/agent')\">\r\n              <i class=\"icon i-local:char-s1?mask\" />\r\n              <span class=\"text\">{{ $t('uwy65LAgioLBtO-8l_7nS') }}</span>\r\n            </NuxtLink>\r\n          </li>\r\n          <li class=\"item agent\">\r\n            <NuxtLink class=\"link\" :to=\"localePath('/blog')\">\r\n              <i class=\"icon i-ph:newspaper-clipping-fill\" />\r\n              <span class=\"text\">{{ $t('1J6d94jQiyf2iQ5ynjsR') }}</span>\r\n            </NuxtLink>\r\n          </li>\r\n          <li class=\"item\">\r\n            <a class=\"link\" :href=\"`/doc/${$t('doc-lang')}`\" data-test-id=\"NT5P\">\r\n              <i class=\"icon i-iconamoon:file-document-fill other bg-[#8098bf]\" />\r\n              <span class=\"text\">{{ $t('3p7uB1VlYHERPyaVAlCT7') }}</span>\r\n            </a>\r\n          </li>\r\n          <li class=\"item\">\r\n            <a class=\"link\" :href=\"tgLink\" data-test-id=\"c34N\">\r\n              <i class=\"icon i-local:service-s1?mask\" />\r\n              <span class=\"text\">{{ $t('33AuKcdUY0B9RsFRtbSSz') }}</span></a>\r\n          </li>\r\n        </ul>\r\n        <div v-if=\"userInfo\" class=\"logout\" data-test-id=\"ikle\" @click=\"handleLogout\">{{ $t('jz9d6i6ySneWChWaGl') }}</div>\r\n      </ADrawer>\r\n    </ClientOnly>\r\n    <AModal\r\n      v-model:open=\"isLogout\"\r\n      :footer=\"null\"\r\n      destroyOnClose\r\n      :closable=\"true\"\r\n      :maskClosable=\"false\"\r\n      wrapClassName=\"ant-cover__basic-modal\"\r\n      centered\r\n      :title=\"$t('mxo0cnGrkxXuDuAchSx')\"\r\n    >\r\n      <div class=\"mx-auto mt-[32px]\">\r\n        <p class=\"text-18px text-text text-center\">{{ $t('vgSxF2KG5obiPgZv4sK0') }}</p>\r\n        <div class=\"flex justify-center items-center mt4 gap4\">\r\n          <AButton class=\"cancel-btn flex-1\" data-test-id=\"jy3k\" @click=\"isLogout = false\">{{ $t('hAns2WaHjEPbTgBxlqXn') }}</AButton>\r\n          <AButton class=\"comfirm-btn flex-1\" :loading=\"loadLogout\" data-test-id=\"khk9\" @click=\"logout()\">{{ $t('UENBgObobQIqSj65k6uBN') }}</AButton>\r\n        </div>\r\n      </div>\r\n    </AModal>\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"scss\" scoped>\r\n.nav-list {\r\n  .item {\r\n    background: url('@/assets/icons/arrow-s1.svg') no-repeat;\r\n    background-position: calc(100% - 10px) center;\r\n\r\n    .text {\r\n      --uno: 'text-[#e2e8f2] text-16px';\r\n    }\r\n\r\n    &:hover, &:active {\r\n      .text {\r\n        color: var(--highlight);\r\n      }\r\n    }\r\n\r\n    .link {\r\n      --uno: 'flex items-center h-50px rounded-6px p-[0_10px]';\r\n    }\r\n\r\n    .icon {\r\n      --uno: 'block mr-0.4em w-1.2em h1.2em text-[#8098bf]';\r\n\r\n      &.other {\r\n        --uno: 'bg-bg-icon_light';\r\n      }\r\n    }\r\n\r\n    .decorated {\r\n      --uno: 'block ml-0.2em';\r\n    }\r\n  }\r\n\r\n  .log {\r\n    --uno: 'mb-16px';\r\n\r\n    background: url('@/assets/icons/back-s1.svg') no-repeat;\r\n    background-position: right;\r\n\r\n    .link {\r\n      padding: 0;\r\n    }\r\n\r\n    .icon {\r\n      --uno: 'text-28px';\r\n\r\n    }\r\n\r\n    .title {\r\n      --uno: 'ml-5px text-18px font-bold text-[#e2e8f2]';\r\n    }\r\n  }\r\n\r\n  .info{\r\n    --uno: 'block items-center pl-12px py-10px text-[#e2e8f2]';\r\n\r\n    position: relative;\r\n    font-size: 14px;\r\n    background: linear-gradient(80deg, #2a47ab, #266ef1);\r\n    border-radius: 10px;\r\n\r\n    &:hover{\r\n      background: linear-gradient(90deg, rgb(38 109 241) 10%, rgb(7 171 180) 80%);\r\n    }\r\n\r\n    &::after{\r\n      position: absolute;\r\n      top: 50%;\r\n      right: 0;\r\n      width: 20px;\r\n      height: 20px;\r\n      content: '';\r\n      background: url('@/assets/icons/arrow-s2.svg') no-repeat calc(100% - 10px) center;\r\n      transform: translateY(-50%);\r\n    }\r\n\r\n    >div{\r\n      --uno: 'h-30px flex items-center';\r\n    }\r\n  }\r\n\r\n  .login{\r\n    --uno: 'text-center h-40px lh-40px border-rd-10px text-[#e2e8f2] mb-10px';\r\n\r\n    a{\r\n      --uno: 'block items-center pl-12px text-[#e2e8f2] text-14px border-rd-10px';\r\n\r\n      background: linear-gradient(90deg, rgb(38 110 241) 10%, rgb(7 171 180) 83%);\r\n    }\r\n  }\r\n}\r\n\r\n.logout{\r\n  --uno: 'bg-[#202c52] text-[#e2e8f2] border-rd-10px py-14px text-center mt-10px cursor-pointer';\r\n\r\n  &:hover{\r\n    box-shadow: 0 2px 0 #000;\r\n  }\r\n}\r\n\r\n.router-link-active {\r\n  --uno: 'bg-[var(--mobile-active-bg)]';\r\n}\r\n</style>\r\n\r\n<style lang=\"scss\">\r\n.side-nav-drawer {\r\n  .ant-drawer-content-wrapper {\r\n    --uno: '!w-65% min-w-200px max-w-300px';\r\n  }\r\n\r\n  .ant-drawer-body {\r\n    --uno: 'p-0';\r\n\r\n    background: #1a2342;\r\n  }\r\n}\r\n</style>\r\n"],"names":["useSwapShow","visible","ref","isLogout","tgLink","useTgCustomer","userInfo","clearInfo","useUserInfo","handleLogout","value","loadLogout","async","hasToken","apis","authLogout","aMessage","success","$t","e","console","log"],"mappings":"suEAMuCA,IACjC,MAAAC,EAAUC,GAAI,GACdC,EAAWD,GAAI,GACfE,EAASC,KACTC,SAAEA,EAAAC,UAAUA,GAAcC,IAChC,SAASC,KACPR,EAAQS,OAAQ,EAChBP,EAASO,OAAQ,CACnB,CAEM,MAAAC,GAAaT,GAAI,mxGACvBU,iBACE,GAAIC,IACE,IACFF,GAAWD,OAAQ,QACbI,EAAKC,gBAAW,OAEtBJ,GAAWD,OAAQ,EACVM,EAAAC,QAAQC,EAAG,0BACpBf,EAASO,OAAQ,CAAA,CAEb,MAAAS,GACJC,QAAQC,IAAI,aACZV,GAAWD,OAAQ,CACrB,CAEJ"}