1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
| <!-- 货币指数差价合约（CFD） -->
| <template>
| <menu-layout :collapseList="menu2List">
| <template v-slot:content>
| <section class="section1">
| <p class="text-4xl font-semibold mb-4">{{ t("m2-product-7-s1-t1") }}</p>
| <p class="desc-color leading-normal">{{ t("m2-product-7-s1-d1") }}</p>
| </section>
| <p class="desc-color leading-normal my-8">
| {{ t("m2-product-7-s1-d2") }}
| </p>
| <el-table :data="tableData" style="width: 100%" class="self-table">
| <el-table-column
| v-for="(item, index) in tableList"
| :key="index"
| :prop="item.prop"
| :label="t(`m2-product-7-s2-h${index + 1}`)"
| />
| </el-table>
| </template>
| </menu-layout>
| </template>
|
| <script setup>
| import { useRoute, useRouter } from "vue-router";
| import { useI18n } from "vue-i18n";
| import { menu2List } from "@/utils/path";
| const route = useRoute();
| const { t } = useI18n();
|
| const tableList = [
| {
| prop: "product",
| },
| {
| prop: "symbol",
| },
| {
| prop: "size",
| },
| {
| prop: "change",
| },
| {
| prop: "lever",
| },
| {
| prop: "margin",
| },
| ];
| const tableData = [
| {
| product: "US Dollar Index",
| symbol: "USDX",
| size: "100",
| change: "6",
| lever: "5:1",
| margin: "1%",
| },
| {
| product: "Euro Index",
| symbol: "EURX",
| size: "100",
| change: "1",
| lever: "5:1",
| margin: "1%",
| },
| {
| product: "Japanese Yen Index",
| symbol: "JPYX",
| size: "100",
| change: "1",
| lever: "5:1",
| margin: "1%",
| },
| ];
|
| const gotoPage = () => {};
| </script>
| <style lang="scss" scoped>
| .section1 {
| border-bottom: 1px solid #d8dee1;
| padding-bottom: 12px;
| }
| </style>
|
|
