{"version":3,"file":"C0Mcysl9.js","sources":["../../../../pages/stock_trade.vue"],"sourcesContent":["<script setup>\nconst { locale } = useI18n()\nconst lang = useI18n().locale.value;\nconst isEn = computed(() => {\n  if (locale.value == 'en') {\n    return true\n  } else {\n    return false\n  }\n})\nconst isPC = ref(true)\nonMounted(() => {\n  isPC.value = useDeviceType().value=='pc'\n})\n</script>\n\n<template>\n  <div>\n    <div w-full bg-cover h-550 lt-xl:(h-275) bg-center\n      :style=\"{ backgroundImage: 'url(' + (isPC? stock_trade.cn.banner:stock_trade.cn.m_banner) + ')' }\">\n      <div mwc relative h-full>\n        <div text-left text-white pt-115 mb-99 lt-xl:(pt-64 mb-68) :class=\"{'mb-40!':isEn}\">\n          <p text-40 fw l-n mb-37 text-sand lt-xl:(text-18 mb-10) :class=\"{ 'lt-xl:text-16!': isEn }\">{{\n            $t('securities_business') }}</p>\n          <p titz max-w-500 lt-xl:(text-13 max-w-260)>{{ $t('Invest_in_Hong_Kong_And_US_stocks')}}</p>\n\n        </div>\n        <div>\n          <!-- <button btn-accent>{{ $t(\"open_account\") }}</button> -->\n        </div>\n      </div>\n    </div>\n    <!-- // 投资港美股，开启环球投资新时代 -->\n    <div>\n      <div w-full bg-cover h-full bg-center bg-no-repeat :style=\"{ backgroundImage: 'url(' + index.cn.banner1 + ')' }\"\n        overflow-auto>\n        <div class=\"licensed-broker\" h-50 text-36 line-height-50 mt-104 lt-xl:(mt-10  pl-16 pr-16 text-18)>{{ $t('tzgmgkqqqxsd') }}</div>\n        <div class=\"introduce-warp\" mt-20 mb-100 lt-xl:(mb-50 mt-10)>\n          <div class=\"introduce-company\" w-230 bg-cover h-199 lt-xl:(h-175 w-175) bg-center>\n            <div mt-50>\n              <div flex justify-center>\n                <img w-39 h-42 lt-xl:(w-27 h-31) :src=\"stock_trade.cn.company1\" alt=\"\">\n              </div>\n              <div text-20 lt-xl:(text-16) class=\"introduce-title\" mt-16 text-center>{{ $t('yzbdmxgs') }}</div>\n              <div text-12  class=\"introduce-content\" p-16 text-center>{{ $t('yzbdmxgsjs') }}</div>\n            </div>\n          </div>\n          <div class=\"introduce-company\" w-230 bg-cover h-199 lt-xl:(h-175 w-175) bg-center>\n            <div mt-50>\n              <div flex justify-center>\n                <img w-39 h-42 lt-xl:(w-27 h-31) :src=\"stock_trade.cn.company2\" alt=\"\">\n              </div>\n              <div text-20 lt-xl:(text-16) class=\"introduce-title\" mt-16 text-center>{{ $t('tzpzdy') }}</div>\n              <div text-12 class=\"introduce-content\" p-16 text-center>{{ $t('tzpzdyjs') }}</div>\n            </div>\n          </div>\n          <div class=\"introduce-company\" w-230 bg-cover h-199 lt-xl:(h-175 w-175) bg-center>\n            <div mt-50>\n              <div flex justify-center>\n                <img w-39 h-42 lt-xl:(w-27 h-31) :src=\"stock_trade.cn.company3\" alt=\"\">\n              </div>\n              <div text-20 lt-xl:(text-16) class=\"introduce-title\" mt-16 text-center>{{ $t('t0lhjy') }}</div>\n              <div text-12 class=\"introduce-content\" p-16 text-center>{{ $t('t0lhjyjs') }}</div>\n            </div>\n          </div>\n          <div class=\"introduce-company\" w-230 bg-cover h-199 lt-xl:(h-175 w-175) bg-center>\n            <div mt-50>\n              <div flex justify-center>\n                <img w-39 h-42 lt-xl:(w-27 h-31) :src=\"stock_trade.cn.company4\" alt=\"\">\n              </div>\n              <div text-20 lt-xl:(text-16) class=\"introduce-title\" mt-16 text-center>{{ $t('zdwsjgyg') }}</div>\n              <div text-12 class=\"introduce-content\" p-16 text-center>{{ $t('zdwsjgygjs') }}</div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n\n\n    <!-- // 美股的介绍，这里是美股的介绍 -->\n\n    <div pyx lt-xl:(pt-18)>\n      <div mwc>\n        <div class=\"stock-market\" text-36 lt-xl:(text-18)>{{ $t('mgjs') }}</div>\n        <div class=\"market-content\" text-18 mt-24 lt-xl:(text-12)>{{ $t('mgjsnr') }}</div>\n        <!-- <div class=\"market-feature\" font-size-36 mt-40>{{ $t('mgts') }}</div> -->\n        <ul f-c-b flex-wrap flex-row items-stretch mt-23>\n          <li class=\"group\" bg-no-repeat\n            :style=\"{ backgroundImage:  'url(' + (isPC? stock_trade.cn.stock1:stock_trade.cn.m1_banner) + ')', backgroundSize: 'cover' }\"\n            bds-palebluishgray px-30 w=\"32%\" h-495 pt-220 pb-44 mb-20 relative hover:(bg-accent text-black) lt-xl:(px-15\n            pt-120 h-240 mb-15) lt-xl:w='100%' cp :class=\"{ 'pt-30!': isEn }\">\n            <NuxtLink external>\n              <p titc l-n mb-25 lt-xl:mb-15 :class=\"{ 'xl:text-20': isEn }\">{{ $t('qqjjzb') }}</p>\n              <p titm lt-xl:mb-10 :class=\"{ 'xl:text-16': isEn }\">{{ $t('qqjjzjs') }}</p>\n\n            </NuxtLink>\n          </li>\n          <li class=\"group\" bg-no-repeat\n            :style=\"{ backgroundImage: 'url(' + (isPC? stock_trade.cn.stock2:stock_trade.cn.m2_banner) + ')', backgroundSize: 'cover' }\"\n            bds-palebluishgray px-30 w=\"32%\" h-495 pt-220 pb-44 mb-20 relative hover:(bg-accent text-black) lt-xl:(px-15\n            pt-120 h-240 mb-15) lt-xl:w='100%' cp :class=\"{ 'pt-30!': isEn }\">\n            <NuxtLink external>\n              <p titc l-n mb-25 lt-xl:mb-15 :class=\"{ 'xl:text-20': isEn }\">{{ $t('tzgdxz') }}</p>\n              <p titm lt-xl:mb-10 :class=\"{ 'xl:text-16': isEn }\">{{ $t('tzgdxzjs') }}</p>\n\n            </NuxtLink>\n          </li>\n          <li class=\"group\" bg-no-repeat\n            :style=\"{ backgroundImage: 'url(' + (isPC? stock_trade.cn.stock3:stock_trade.cn.m3_banner) + ')', backgroundSize: 'cover' }\"\n            bds-palebluishgray px-30 w=\"32%\" h-495 pt-220 pb-44 mb-20 relative hover:(bg-accent text-black) lt-xl:(px-15\n            pt-120 h-240 mb-15) lt-xl:w='100%' cp :class=\"{ 'pt-30!': isEn }\">\n            <NuxtLink external>\n              <p titc l-n mb-25 lt-xl:mb-15 :class=\"{ 'xl:text-20': isEn }\">{{ $t('zjmkjd') }}</p>\n              <p titm lt-xl:mb-10 :class=\"{ 'xl:text-16': isEn }\">{{ $t('zjmkjdjs') }}</p>\n\n            </NuxtLink>\n          </li>\n\n        </ul>\n      </div>\n    </div>\n\n\n    <!-- // 港股的介绍，这里是香港的股票介绍 -->\n\n    <div pyx class=\"bull-market\" lt-xl:(pt-18)>\n      <div mwc>\n        <div class=\"stock-market\" text-36 lt-xl:(text-18) >{{ $t('gdjs') }}</div>\n        <div class=\"market-content\" text-18 mt-24 lt-xl:(text-12)>{{ $t('gdjsnr') }}</div>\n        <!-- <div class=\"market-feature\" font-size-36 mt-40>{{ $t('mgts') }}</div> -->\n        <ul f-c-b flex-wrap flex-row items-stretch mt-23>\n          <li class=\"group\" bg-no-repeat\n            :style=\"{ backgroundImage:  'url(' + (isPC? stock_trade.cn.stock1:stock_trade.cn.m4_banner) + ')', backgroundSize: 'cover' }\"\n            bds-palebluishgray px-30 w=\"32%\" h-495 pt-220 pb-44 mb-20 relative hover:(bg-accent text-black) lt-xl:(px-15\n            pt-120 h-240 mb-15) lt-xl:w='100%' cp :class=\"{ 'pt-30!': isEn }\">\n            <NuxtLink external>\n              <p titc l-n mb-25 lt-xl:mb-15 :class=\"{ 'xl:text-20': isEn }\">{{ $t('ywdjyzkjxf') }}</p>\n              <p titm lt-xl:mb-10 :class=\"{ 'xl:text-16': isEn }\">{{ $t('ywdjyzkjxfjs') }}</p>\n\n            </NuxtLink>\n          </li>\n          <li class=\"group\" bg-no-repeat\n            :style=\"{ backgroundImage: 'url(' + (isPC? stock_trade.cn.stock2:stock_trade.cn.m5_banner) + ')', backgroundSize: 'cover' }\"\n            bds-palebluishgray px-30 w=\"32%\" h-495 pt-220 pb-44 mb-20 relative hover:(bg-accent text-black) lt-xl:(px-15\n            pt-130 h-240 mb-15) lt-xl:w='100%' cp :class=\"{ 'pt-30!': isEn }\">\n            <NuxtLink external>\n              <p titc l-n mb-25 lt-xl:mb-15 :class=\"{ 'xl:text-20': isEn }\">{{ $t('gdt0jyzd') }}</p>\n              <p titm lt-xl:mb-10 :class=\"{ 'xl:text-16': isEn }\">{{ $t('gdt0jyzdjs') }}</p>\n\n            </NuxtLink>\n          </li>\n          <li class=\"group\" bg-no-repeat\n            :style=\"{ backgroundImage: 'url(' + (isPC? stock_trade.cn.stock3:stock_trade.cn.m6_banner) + ')', backgroundSize: 'cover' }\"\n            bds-palebluishgray px-30 w=\"32%\" h-495 pt-220 pb-44 mb-20 relative hover:(bg-accent text-black) lt-xl:(px-15\n            pt-120 h-240 mb-15) lt-xl:w='100%' cp :class=\"{ 'pt-30!': isEn }\">\n            <NuxtLink external>\n              <p titc l-n mb-25 lt-xl:mb-15 :class=\"{ 'xl:text-20': isEn }\">{{ $t('gxaqdtzsc') }}</p>\n              <p titm lt-xl:mb-10 :class=\"{ 'xl:text-16': isEn }\">{{ $t('gxaqdtzscjs') }}</p>\n\n            </NuxtLink>\n          </li>\n\n        </ul>\n      </div>\n    </div>\n    <!-- //沪股通介绍 -->\n\n    <div pyx lt-xl:(pt-18)>\n      <div mwc>\n        <div class=\"stock-market\" text-36 lt-xl:(text-18)>{{ $t('aghsgt') }}</div>\n        <div class=\"market-content\" text-18 mt-24 lt-xl:(text-12)>{{ $t('aghsgtjs') }}</div>\n        <!-- <div class=\"market-feature\" font-size-36 mt-40>{{ $t('mgts') }}</div> -->\n        <div  bg-contain h-220 mt-24 lt-xl:(h-240 bg-cover)\n          :style=\"{ backgroundImage: 'url(' + (isPC? stock_trade.cn.stock5:stock_trade.cn.m7_banner) + ')', backgroundRepeat:'no-repeat' }\">\n          <div mwc relative h-full lt-xl:(pl-8 pr-8)>\n            <div  pt-35 pl-16 mb-20 text-left lt-xl:(pl-0)>\n              <p w=\"50%\" font-size-16 titm lt-xl:(mb-0 mt-90 pr-0 text-12 pl-0) lt-xl:w=\"100%\"  :class=\"{ 'xl:text-16': isEn }\">{{ $t('hgtsgtjs') }}</p>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n\n    <!-- // 牛熊证 -->\n\n    <div pyx class=\"bull-market\" lt-xl:(pt-18)>\n      <div mwc >\n        <div class=\"stock-market\" text-36 lt-xl:(text-18)>{{ $t('nxzjs') }}</div>\n        <div class=\"market-content\" text-18 mt-24 lt-xl:(text-12)>{{ $t('nxzjnr') }}</div>\n        <!-- <div class=\"market-feature\" font-size-36 mt-40>{{ $t('mgts') }}</div> -->\n        <div  bg-contain h-220 mt-24 lt-xl:(h-270 bg-cover)\n          :style=\"{ backgroundImage: 'url(' + (isPC? stock_trade.cn.stock4:stock_trade.cn.m8_banner) + ')', backgroundRepeat:'no-repeat' }\">\n          <div mwc relative h-full lt-xl:(pl-8 pr-8)>\n            <div  pt-35 pl-16  mb-20 text-left t-xl:(pl-0)>\n              <p w=\"55%\" font-size-16  titm lt-xl:(mb-0 mt-90 pr-0 text-12 pl-0) lt-xl:w=\"100%\" :class=\"{ 'xl:text-16': isEn }\">{{ $t('nxzdyzyysqz') }}</p>\n\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n\n    <!-- <div v-if=\"lang !== 'cn'\" mt-90 w-full bg-cover h-470 bg-center bg-no-repeat :style=\"{ backgroundImage: 'url(' + index.cn.banner12 + ')' }\"\n        overflow-auto>\n\n        <div mwc>\n          <div class=\"invest-globally\" font-size-36 line-height-50>{{ $t('tzqqjzzj') }}</div>\n          <div class=\"capital-account\" font-size-18 line-height-32 mt-30>\n            {{ $t('tzqqjzzjjs') }}<span\n              class=\"stock-content\"> {{ $t('tzqqjzzjj1') }}</span>{{ $t('tzqqjzzjj3') }}\n          </div>\n          <ul f-c mb-24 lt-xl:(mb-20 f-c-b) mt-60>\n            <li mr-16 lt-xl:mr-0>\n              <button btn-inkgray class=\"more-detail\">{{  $t('learn_more') }}</button>\n            </li>\n            <li mr-16 lt-xl:mr-0>\n              <a-popover :overlay-inner-style=\"{ padding: 0 }\">\n                <template #content>\n                  <a-qrcode error-level=\"H\" value=\"https://apps.apple.com/hk/app/sptrader-pro-hd/id1043451438\"\n                    :bordered=\"false\" />\n                </template>\n                <div f-c cp>\n                  <button btn-inkgray>iPhone{{ $t('download') }}</button>\n                </div>\n              </a-popover>\n            </li>\n            <li mr-16 lt-xl:mr-0>\n              <a-popover :overlay-inner-style=\"{ padding: 0 }\">\n                <template #content>\n                  <a-qrcode error-level=\"H\"\n                    value=\"https://play.google.com/store/apps/details?id=hk.com.sharppoint.spmobile.sptraderprohd\"\n                    :bordered=\"false\" />\n                </template>\n                <div f-c cp>\n                  <button btn-inkgray>Android{{ $t('download') }}</button>\n                </div>\n              </a-popover>\n\n            </li>\n            <li>\n              <a href=\"https://spsystem.biz/download/temp/EP/FRT/sptrader_forthright_setup_r87911.zip\">\n                <button btn-inkgray>PC{{ $t('download') }}</button>\n              </a>\n            </li>\n          </ul>\n        </div>\n\n\n      </div> -->\n  </div>\n</template>\n<style lang=\"less\" scoped>\n.licensed-broker {\n\n// height: 3.125rem;\nfont-family: PingFangSC, PingFang SC;\n\n// font-size: 2.25rem;\ncolor: #1D2228;\n// line-height: 3.125rem;\ntext-align: center;\nfont-style: normal;\n}\n\n.licensed-broker-content {\n\n// height: 1.25rem;\nfont-family: PingFangSC, PingFang SC;\nfont-weight: 300;\n\ncolor: #373B50;\n\ntext-align: center;\nfont-style: normal;\n}\n\n.introduce-warp {\ndisplay: flex;\nflex-wrap: wrap;\nalign-items: center;\ngap: 2rem;\njustify-content: center;\n\n}\n.introduce-company {\nheight: 232px;\nbackground: #FFFFFF;\nbox-shadow: 0px 2px 4px 0px rgba(0,0,0,0.06);\nborder-radius: 2px;\n}\n.introduce-title {\nfont-family: PingFangSC, PingFang SC;\nfont-weight: 600;\n\ncolor: #1D2228;\nfont-style: normal;\n}\n.introduce-content {\n\nfont-family: PingFangSC, PingFang SC;\nfont-weight: 400;\nfont-size: 12px;\ncolor: #1D2228;\n\n\nfont-style: normal;\n}\n.stock-market {\n\nfont-family: PingFangSC, PingFang SC;\nfont-weight: 600;\n\ncolor: #333333;\n\ntext-align: left;\nfont-style: normal;\n}\n.market-content {\n\nfont-family: PingFangSC, PingFang SC;\nfont-weight: 400;\n\ncolor: #333333;\n\ntext-align: left;\nfont-style: normal;\n}\n.market-feature{\n\nfont-family: PingFangSC, PingFang SC;\nfont-weight: 600;\nfont-size: 36px;\ncolor: #333333;\ntext-align: left;\nfont-style: normal;\n}\n.invest-globally {\n\nfont-family: PingFangSC, PingFang SC;\nfont-weight: 600;\n\ncolor: #504137;\n\n\nfont-style: normal;\n}\n\n.capital-account {\n\nfont-family: PingFangSC, PingFang SC;\nfont-weight: 400;\n\ncolor: #333333;\n\ntext-align: left;\nfont-style: normal;\n}\n\n.more-detail {\nborder: 1px solid #AA7322;\ncolor: #AA7322;\n// line-height: 38px;\nbackground-color: #ffffff;\n}\n.bull-market {\n  background: #F9F9FA;\n}\n</style>\n"],"names":["locale","useI18n","isEn","computed","isPC","ref","onMounted","useDeviceType"],"mappings":"8hGACA,KAAM,CAAE,OAAAA,CAAQ,EAAGC,EAAS,EACfA,EAAS,EAAC,OAAO,MAC9B,MAAMC,EAAOC,EAAS,IAChBH,EAAO,OAAS,IAKrB,EACKI,EAAOC,EAAI,EAAI,EACrB,OAAAC,EAAU,IAAM,CACdF,EAAK,MAAQG,EAAe,EAAC,OAAO,IACtC,CAAC"}