|
|
|
@ -14,7 +14,7 @@ |
|
|
|
<div class="menu" v-show="isOpen"> |
|
|
|
<div class="coinselect" @click="coinhandelMenu" :class="{ 'active': coinisOpen }"> |
|
|
|
<div class="cointxt"> |
|
|
|
金币产品 |
|
|
|
{{ t('cash.goldProduct') }} |
|
|
|
</div> |
|
|
|
<span class="coin-arrow"> |
|
|
|
<el-icon> |
|
|
|
@ -23,12 +23,12 @@ |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
<div class="coinoption" v-show="coinisOpen"> |
|
|
|
<el-radio v-model="selectedValue" label="金币充值" size="large" /> |
|
|
|
<el-radio v-model="selectedValue" :label="t('cash.coinRecharge')" size="large" /> |
|
|
|
</div> |
|
|
|
<div class="product"> |
|
|
|
<div class="coinselect" @click="producthandelMenu" :class="{ 'active': productisOpen }"> |
|
|
|
<div class="cointxt"> |
|
|
|
软件产品 |
|
|
|
{{ t('cash.softwareProduct') }} |
|
|
|
</div> |
|
|
|
<span class="coin-arrow"> |
|
|
|
<el-icon> |
|
|
|
@ -38,7 +38,7 @@ |
|
|
|
</div> |
|
|
|
<div class="productOption" v-show="productisOpen"> |
|
|
|
<hr class="line"> |
|
|
|
<div class="checktxt">软件</div> |
|
|
|
<div class="checktxt">{{ t('cash.software') }}</div> |
|
|
|
<div class="marketprodut"> |
|
|
|
<div class="fistlevel" v-for="(menu, index) in menuData" :key="menu.name" @click="clickmenu(index)" |
|
|
|
:class="{ 'selected': menu.options.includes(selectedValue) }"> |
|
|
|
@ -61,7 +61,7 @@ |
|
|
|
</div> |
|
|
|
<hr class="line"> |
|
|
|
<div class="ai"> |
|
|
|
<div class="checktxt">AI机构探测神器</div> |
|
|
|
<div class="checktxt">{{ t('cash.aiService.aiDetectionTool') }}</div> |
|
|
|
<hr class="line"> |
|
|
|
<el-radio-group v-model="selectedValue"> |
|
|
|
<el-radio v-for="ai in AIProduct" :key="ai" :label="ai" :value="ai"> |
|
|
|
@ -70,7 +70,7 @@ |
|
|
|
</el-radio-group> |
|
|
|
</div> |
|
|
|
<div class="ai"> |
|
|
|
<div class="checktxt">超级机构探测神器</div> |
|
|
|
<div class="checktxt">{{ t('cash.aiService.superDetectionTool') }}</div> |
|
|
|
<hr class="line"> |
|
|
|
<el-radio-group v-model="selectedValue"> |
|
|
|
<el-radio v-for="ai in superProduct" :key="ai" :label="ai" :value="ai"> |
|
|
|
@ -79,7 +79,7 @@ |
|
|
|
</el-radio-group> |
|
|
|
</div> |
|
|
|
<div class="ai"> |
|
|
|
<div class="checktxt">其他</div> |
|
|
|
<div class="checktxt">{{ t('cash.other') }}</div> |
|
|
|
<hr class="line"> |
|
|
|
<el-radio-group v-model="selectedValue"> |
|
|
|
<el-radio v-for="ai in InfoFee" :key="ai" :label="ai" :value="ai"> |
|
|
|
@ -95,7 +95,10 @@ |
|
|
|
<script setup> |
|
|
|
import { ref, watch, onMounted, computed, onUnmounted, nextTick } from 'vue'; |
|
|
|
import { ArrowDown } from '@element-plus/icons-vue'; |
|
|
|
// 国际化 |
|
|
|
import { useI18n } from 'vue-i18n' |
|
|
|
|
|
|
|
const { t } = useI18n() |
|
|
|
|
|
|
|
const searchData = ref('') |
|
|
|
const isOpen = ref(false) |
|
|
|
@ -103,7 +106,7 @@ const coinisOpen = ref(false) |
|
|
|
const productisOpen = ref(false) |
|
|
|
const selectedItem = ref('') |
|
|
|
const dropdownRef = ref(null) |
|
|
|
const placeholder = ref('请选择产品') |
|
|
|
const placeholder = ref(t('common_add.productNamePlaceholder')) |
|
|
|
|
|
|
|
const handelMenu = () => { |
|
|
|
isOpen.value = !isOpen.value |
|
|
|
@ -135,53 +138,115 @@ watch(selectedValue, (newVal) => { |
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
const AIProduct = ['AI机构追踪', 'AI机构出击', 'AI机构资金', 'AI机构活跃度','AI机构探测神器'] |
|
|
|
const superProduct = ['超级机构透视', '超级机构伏击', '超级机构猎杀', '超级机构脉搏', '超级机构罗盘','超级机构探测神器'] |
|
|
|
const InfoFee = ['静态信息费', '博股会员','HC信息费'] |
|
|
|
const AIProduct = [ |
|
|
|
t('cash.aiService.aiTracking'), |
|
|
|
t('cash.aiService.aiAttack'), |
|
|
|
t('cash.aiService.aiFunds'), |
|
|
|
t('cash.aiService.aiActivity'), |
|
|
|
t('cash.aiService.aiDetectionTool') |
|
|
|
] |
|
|
|
const superProduct = [ |
|
|
|
t('cash.aiService.superPerspective'), |
|
|
|
t('cash.aiService.superAmbush'), |
|
|
|
t('cash.aiService.superHunting'), |
|
|
|
t('cash.aiService.superPulse'), |
|
|
|
t('cash.aiService.superCompass'), |
|
|
|
t('cash.aiService.superDetectionTool') |
|
|
|
] |
|
|
|
const InfoFee = [ |
|
|
|
t('cash.staticInfoFee'), |
|
|
|
t('cash.BGmember'), |
|
|
|
t('cash.HC') |
|
|
|
] |
|
|
|
// 使用多语言字段重新构建menuData |
|
|
|
const menuData = [ |
|
|
|
{ |
|
|
|
name: '美股', |
|
|
|
options: ['美股软件', '美股金卡', '美股套餐'] |
|
|
|
name: t('cash.softwareMenu.usStock'), |
|
|
|
options: [ |
|
|
|
t('cash.softwareMenu.usStockSoftware'), |
|
|
|
t('cash.softwareMenu.usStockGoldCard'), |
|
|
|
t('cash.softwareMenu.usStockPackage') |
|
|
|
] |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: '港股', |
|
|
|
options: ['港股软件', '港股金卡', '港股套餐'] |
|
|
|
name: t('cash.softwareMenu.hkStock'), |
|
|
|
options: [ |
|
|
|
t('cash.softwareMenu.hkStockSoftware'), |
|
|
|
t('cash.softwareMenu.hkStockGoldCard'), |
|
|
|
t('cash.softwareMenu.hkStockPackage') |
|
|
|
] |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: 'A股', |
|
|
|
options: ['A股软件', 'A股金卡', 'A股套餐'] |
|
|
|
name: t('cash.softwareMenu.aStock'), |
|
|
|
options: [ |
|
|
|
t('cash.softwareMenu.aStockSoftware'), |
|
|
|
t('cash.softwareMenu.aStockGoldCard'), |
|
|
|
t('cash.softwareMenu.aStockPackage') |
|
|
|
] |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: '新加坡股', |
|
|
|
options: ['新加坡股软件', '新加坡股金卡', '新加坡股套餐'] |
|
|
|
name: t('cash.softwareMenu.singaporeStock'), |
|
|
|
options: [ |
|
|
|
t('cash.softwareMenu.singaporeStockSoftware'), |
|
|
|
t('cash.softwareMenu.singaporeStockGoldCard'), |
|
|
|
t('cash.softwareMenu.singaporeStockPackage') |
|
|
|
] |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: '马股', |
|
|
|
options: ['马股软件', '马股金卡', '马股套餐'] |
|
|
|
name: t('cash.softwareMenu.malaysiaStock'), |
|
|
|
options: [ |
|
|
|
t('cash.softwareMenu.malaysiaStockSoftware'), |
|
|
|
t('cash.softwareMenu.malaysiaStockGoldCard'), |
|
|
|
t('cash.softwareMenu.malaysiaStockPackage') |
|
|
|
] |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: '日本股', |
|
|
|
options: ['日本股软件', '日本股金卡', '日本股套餐'] |
|
|
|
name: t('cash.softwareMenu.japanStock'), |
|
|
|
options: [ |
|
|
|
t('cash.softwareMenu.japanStockSoftware'), |
|
|
|
t('cash.softwareMenu.japanStockGoldCard'), |
|
|
|
t('cash.softwareMenu.japanStockPackage') |
|
|
|
] |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: '泰股', |
|
|
|
options: ['泰股软件', '泰股金卡', '泰股套餐'] |
|
|
|
name: t('cash.softwareMenu.thailandStock'), |
|
|
|
options: [ |
|
|
|
t('cash.softwareMenu.thailandStockSoftware'), |
|
|
|
t('cash.softwareMenu.thailandStockGoldCard'), |
|
|
|
t('cash.softwareMenu.thailandStockPackage') |
|
|
|
] |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: '越南股', |
|
|
|
options: ['越南股软件', '越南股金卡', '越南股套餐'] |
|
|
|
name: t('cash.softwareMenu.vietnamStock'), |
|
|
|
options: [ |
|
|
|
t('cash.softwareMenu.vietnamStockSoftware'), |
|
|
|
t('cash.softwareMenu.vietnamStockGoldCard'), |
|
|
|
t('cash.softwareMenu.vietnamStockPackage') |
|
|
|
] |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: '印尼股', |
|
|
|
options: ['印尼股软件', '印尼股金卡', '印尼股套餐'] |
|
|
|
name: t('cash.softwareMenu.indonesiaStock'), |
|
|
|
options: [ |
|
|
|
t('cash.softwareMenu.indonesiaStockSoftware'), |
|
|
|
t('cash.softwareMenu.indonesiaStockGoldCard'), |
|
|
|
t('cash.softwareMenu.indonesiaStockPackage') |
|
|
|
] |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: '韩国股', |
|
|
|
options: ['韩国股软件', '韩国股金卡', '韩国股套餐'] |
|
|
|
name: t('cash.softwareMenu.koreaStock'), |
|
|
|
options: [ |
|
|
|
t('cash.softwareMenu.koreaStockSoftware'), |
|
|
|
t('cash.softwareMenu.koreaStockGoldCard'), |
|
|
|
t('cash.softwareMenu.koreaStockPackage') |
|
|
|
] |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: '台湾股', |
|
|
|
options: ['台湾股软件', '台湾股金卡', '台湾股套餐'] |
|
|
|
name: t('cash.softwareMenu.taiwanStock'), |
|
|
|
options: [ |
|
|
|
t('cash.softwareMenu.taiwanStockSoftware'), |
|
|
|
t('cash.softwareMenu.taiwanStockGoldCard'), |
|
|
|
t('cash.softwareMenu.taiwanStockPackage') |
|
|
|
] |
|
|
|
} |
|
|
|
]; |
|
|
|
//全局事件实现点击外部关闭选项 |
|
|
|
@ -325,7 +390,7 @@ defineExpose({ resetSelect }); |
|
|
|
z-index: 100; |
|
|
|
|
|
|
|
.coinselect { |
|
|
|
width: 100px; |
|
|
|
width: 126px; |
|
|
|
height: 20px; |
|
|
|
border: 1px solid #175BE5; |
|
|
|
padding: 5px 0 5px 12px; |
|
|
|
@ -333,7 +398,7 @@ defineExpose({ resetSelect }); |
|
|
|
border-radius: 5px; |
|
|
|
|
|
|
|
.cointxt { |
|
|
|
width: 70px; |
|
|
|
width: 100px; |
|
|
|
height: 100%; |
|
|
|
display: flex; |
|
|
|
justify-content: center; |
|
|
|
|