From 1af96425139da435fe26fbfed8f0f5f30907d2b4 Mon Sep 17 00:00:00 2001
From: testadmin <dev@example.com>
Date: Tue, 28 Apr 2026 23:35:00 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20NFT=E9=BB=91=E5=B1=8F=E4=BF=AE=E5=A4=8D+?=
 =?UTF-8?q?=E5=85=85=E5=80=BC=E6=A8=A1=E5=9D=97=E9=87=8D=E5=86=99+?=
 =?UTF-8?q?=E5=B8=82=E5=9C=BA=E9=A1=B5USDC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/view/chartBox.vue        |  186 +++
 src/view/deposit.vue         |  588 ++++++++++
 src/view/indexHeader.vue     | 2134 ++++++++++++++++++++++++++++++++++
 src/view/market - 副本.vue |  756 ++++++++++++
 src/view/market.vue          |  785 +++++++++++++
 src/view/marketQuotaion.vue  | 1632 ++++++++++++++++++++++++++
 src/view/marketb.vue         |  416 +++++++
 src/view/tvBase.vue          |  478 ++++++++
 8 files changed, 6975 insertions(+)
 create mode 100644 src/view/chartBox.vue
 create mode 100644 src/view/deposit.vue
 create mode 100644 src/view/indexHeader.vue
 create mode 100644 src/view/market - 副本.vue
 create mode 100644 src/view/market.vue
 create mode 100644 src/view/marketQuotaion.vue
 create mode 100644 src/view/marketb.vue
 create mode 100644 src/view/tvBase.vue

diff --git a/src/view/chartBox.vue b/src/view/chartBox.vue
new file mode 100644
index 0000000..e281be2
--- /dev/null
+++ b/src/view/chartBox.vue
@@ -0,0 +1,186 @@
+<template>
+  <div style="width: 100%">
+    <v-chart :options="polar" :style="'width: ' + width + ';height:' + height + ';'" />
+  </div>
+</template>
+<script>
+import ECharts from "vue-echarts"; // 在 webpack 环境下指向 components/ECharts.vue
+import echarts from "echarts";
+
+export default {
+  props: {
+    symbol: {
+      type: String,
+      default: "",
+    },
+    period: {
+      type: String,
+      default: "1day",
+    },
+    count: {
+      type: Number,
+      default: 7,
+    },
+    color: {
+      type: String,
+      default: "up",
+    },
+    width: {
+      type: String,
+      default: "150px",
+    },
+    height: {
+      type: String,
+      default: "50px",
+    },
+    useTestData: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  name: "ChartBox",
+  data() {
+    console.log("颜色", this.color);
+    return {
+      books: ["book0", "book1"],
+      msg: "this is BookList",
+      polar: {
+        animation: true,
+        left: 0,
+        right: 0,
+        top: 0,
+        bottom: 0,
+        xAxis: {
+          type: "category",
+          data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
+          splitLine: false,
+          show: false,
+        },
+        yAxis: {
+          type: "value",
+          splitLine: false,
+          show: false,
+        },
+        series: [
+          {
+            data: [120, 132, 101, 134, 90, 230, 210],
+            type: "line",
+            symbol: "none",
+            smooth: true,
+            areaStyle: {
+              normal: {
+                color: {
+                  x: 0,
+                  y: 0,
+                  x2: 0,
+                  y2: 1,
+                  colorStops: [
+                    {
+                      offset: 0,
+                      color: this.color == "up" ? "#00f0ff" : "rgba(255,73,74,0.9)", // 0% 处的颜色，修复透明度值
+                    },
+                    {
+                      offset: 0.7,
+                      color:
+                        this.color == "up" ? "rgba(53,182,90,0)" : "rgba(255,73,74,0)", // 100% 处的颜色
+                    },
+                  ],
+                  globalCoord: false, // 缺省为 false
+                },
+              },
+            },
+            itemStyle: {
+              normal: {
+                color: this.color == "up" ? "#00f0ff" : "#ff494a", //折线点的颜色
+                lineStyle: {
+                  color: this.color == "up" ? "#00f0ff" : "#ff494a", //折线的颜色
+                  width: 0.4,
+                },
+              },
+            },
+          },
+        ],
+      },
+    };
+  },
+  components: {
+    "v-chart": ECharts,
+  },
+  methods: {
+    updateChart() {
+      // 更新图表颜色
+      this.polar.series[0].itemStyle.normal.color =
+        this.color == "up" ? "#00f0ff" : "#ff494a";
+      this.polar.series[0].itemStyle.normal.lineStyle.color =
+        this.color == "up" ? "#00f0ff" : "#ff494a";
+      this.polar.series[0].areaStyle.normal.color.colorStops[0].color =
+        this.color == "up" ? "#00f0ff" : "rgba(255,73,74,0.9)";
+      this.polar.series[0].areaStyle.normal.color.colorStops[1].color =
+        this.color == "up" ? "rgba(53,182,90,0)" : "rgba(255,73,74,0)";
+    },
+  },
+  watch: {
+    color(val) {
+      this.updateChart();
+    },
+  },
+  created() {
+    this.updateChart();
+  },
+  mounted() {
+    if (this.useTestData) {
+      console.log("使用测试数据");
+      return;
+    }
+
+    // 如果没有提供symbol，则使用测试数据
+    if (!this.symbol) {
+      console.warn("Chart Warning: No symbol provided, using test data");
+      return;
+    }
+
+    let that = this;
+    let now = parseInt(new Date().valueOf() / 1000);
+    let start = now - 3600 * 24 * 7;
+    this.$http
+      .get("/api/currency/new_timeshar", {
+        params: {
+          symbol: this.symbol + "/USDC",
+          from: start,
+          to: parseInt(new Date().valueOf() / 1000),
+          period: this.period,
+        },
+      })
+      .then((res) => {
+        if (res.data && res.data.data && res.data.data.length > 0) {
+          let rsp = res.data;
+          let invoke = rsp.data.reverse().slice(0, this.count).reverse();
+          let data = [];
+          let data1 = [];
+          invoke.forEach((x) => {
+            data.push(x.id);
+            data1.push(x.close);
+          });
+
+          // 确保data1中有数据再进行处理
+          if (data1.length > 0) {
+            let min = Math.min.apply(null, data1);
+            for (let i = 0; i < data1.length; i++) {
+              data1[i] = data1[i] - min;
+            }
+            console.log("data=====", data);
+            that.polar.xAxis.data = data;
+            that.polar.series[0].data = data1;
+          } else {
+            console.error("Chart Error: No data points found");
+          }
+        } else {
+          console.error("Chart Error: Invalid or empty response data");
+        }
+      })
+      .catch((error) => {
+        console.error("Chart Error:", error);
+      });
+  },
+};
+</script>
diff --git a/src/view/deposit.vue b/src/view/deposit.vue
new file mode 100644
index 0000000..5b37809
--- /dev/null
+++ b/src/view/deposit.vue
@@ -0,0 +1,588 @@
+<template>
+	<div>
+		<indexHeader></indexHeader>
+		<secondaryHead :text="$t('deposit.title')"></secondaryHead>
+
+		<div class="deposit-page bit-center-wrap">
+			<div class="deposit-title">{{ $t('deposit.title') }}</div>
+
+			<div class="deposit-main">
+				<div class="deposit-left">
+					<div class="form-group">
+						<label>{{ $t('deposit.selectCurrency') }}</label>
+						<el-select v-model="selectedCurrency" @change="onCurrencyChange" :placeholder="$t('deposit.selectCurrency')" class="currency-select">
+							<el-option v-for="name in currencyNames" :key="name" :value="name" :label="name">
+								<div class="currency-option">
+									<img v-if="getCurrencyLogo(name)" :src="$utils.isBaseUrl(getCurrencyLogo(name))" class="coin-logo" />
+									<span>{{ name }}</span>
+								</div>
+							</el-option>
+						</el-select>
+					</div>
+
+					<div class="form-group" v-if="depositAddress">
+						<label>{{ $t('deposit.depositTo') }}: <span class="wallet-label">{{ $t('deposit.walletAccount') }}</span></label>
+					</div>
+
+					<div class="chain-tags" v-if="availableChains.length > 1">
+						<label>{{ $t('deposit.selectChain') }}</label>
+						<div class="tags-row">
+							<span v-for="(chain, idx) in availableChains" :key="idx"
+								class="chain-tag" :class="{ active: selectedChainIndex === idx }"
+								@click="selectedChainIndex = idx">
+								{{ chain.chainName }}
+							</span>
+						</div>
+					</div>
+					<div class="chain-tags" v-else-if="availableChains.length === 1">
+						<label>{{ $t('deposit.network') }}</label>
+						<div class="tags-row">
+							<span class="chain-tag active">{{ availableChains[0].chainName }}</span>
+						</div>
+					</div>
+
+					<div class="qr-section" v-if="depositAddress">
+						<div class="qr-container">
+							<div class="qr-frame">
+								<img :src="qrCodeUrl" class="qr-img" alt="QR Code" />
+							</div>
+							<button class="save-qr-btn" @click="saveQrCode">{{ $t('deposit.saveQr') }}</button>
+						</div>
+						<div class="deposit-warnings">
+							<div class="warning-item">
+								<span class="dot"></span>
+								<span>{{ $t('deposit.warning1', { currency: selectedCurrency, chain: chainDisplayName }) }}</span>
+							</div>
+							<div class="warning-item">
+								<span class="dot"></span>
+								<span>{{ $t('deposit.warning2', { currency: selectedCurrency }) }}</span>
+							</div>
+							<div class="warning-item">
+								<span class="dot"></span>
+								<span>{{ $t('deposit.warning3') }}</span>
+							</div>
+							<div class="warning-item">
+								<span class="dot"></span>
+								<span>{{ $t('deposit.warning4') }}</span>
+							</div>
+						</div>
+					</div>
+
+					<div class="address-box" v-if="depositAddress">
+						<label>{{ $t('deposit.depositAddress') }}</label>
+						<div class="address-row">
+							<span class="address-text">{{ depositAddress }}</span>
+							<span class="copy-btn" @click="copyAddress">
+								<i class="el-icon-document-copy"></i>
+							</span>
+						</div>
+					</div>
+
+					<div class="no-address" v-if="!loading && !depositAddress && selectedCurrency">
+						<p>{{ $t('deposit.addressUnavailable') }}</p>
+					</div>
+				</div>
+			</div>
+
+			<div class="deposit-records">
+				<div class="records-header">
+					<span class="records-title">{{ $t('deposit.rechargeRecord') }}</span>
+				</div>
+				<div class="records-table" v-if="recData.length > 0">
+					<div class="table-header">
+						<span class="col col-currency">{{ $t('deposit.selectCurrency') }}</span>
+						<span class="col col-amount">{{ $t('deposit.amount') }}</span>
+						<span class="col col-time">{{ $t('deposit.time') }}</span>
+						<span class="col col-address">{{ $t('deposit.address') }}</span>
+						<span class="col col-hash">{{ $t('deposit.hash') }}</span>
+						<span class="col col-status">{{ $t('deposit.status') }}</span>
+					</div>
+					<div class="table-row" v-for="(item, index) in recData" :key="index">
+						<span class="col col-currency">{{ item.name }}</span>
+						<span class="col col-amount">{{ item.amount }}</span>
+						<span class="col col-time">{{ item.created_at }}</span>
+						<span class="col col-address" :title="item.address">{{ item.address ? item.address.substring(0,10) + '...' : '-' }}</span>
+						<span class="col col-hash" :title="item.hash || item.txid">{{ (item.hash || item.txid) ? (item.hash || item.txid).substring(0,10) + '...' : '-' }}</span>
+						<span class="col col-status" :class="{'status-ok': item.status == 1, 'status-pending': item.status == 0, 'status-fail': item.status == 2}">
+							{{ item.status == 1 ? $t('deposit.statusSuccess') : item.status == 2 ? $t('deposit.statusFailed') : $t('deposit.statusPending') }}
+						</span>
+					</div>
+				</div>
+				<div class="no-data" v-else>{{ $t('deposit.noRecords') }}</div>
+				<el-pagination v-if="recTotal > recLimit"
+					layout="prev, pager, next"
+					:total="recTotal"
+					:page-size="recLimit"
+					:current-page.sync="recPage"
+					@current-change="fetchRecords"
+					class="pagination">
+				</el-pagination>
+			</div>
+		</div>
+
+		<indexFooter></indexFooter>
+	</div>
+</template>
+
+<script>
+import indexHeader from "@/view/indexHeader";
+import indexFooter from "@/view/indexFooter";
+import secondaryHead from "@/components/secondaryHead";
+
+export default {
+	name: "deposit",
+	components: { indexHeader, indexFooter, secondaryHead },
+	data() {
+		return {
+			loading: true,
+			rechargeList: [],
+			currencyGroups: {},
+			currencyNames: [],
+			selectedCurrency: "",
+			selectedChainIndex: 0,
+			recData: [],
+			recPage: 1,
+			recTotal: 0,
+			recLimit: 10,
+		};
+	},
+	computed: {
+		availableChains() {
+			return this.currencyGroups[this.selectedCurrency] || [];
+		},
+		currentItem() {
+			return this.availableChains[this.selectedChainIndex] || {};
+		},
+		depositAddress() {
+			return this.currentItem.address_erc || this.currentItem.address_omni || "";
+		},
+		qrCodeUrl() {
+			if (!this.depositAddress) return "";
+			return "/api/qrcode?text=" + encodeURIComponent(this.depositAddress);
+		},
+		chainDisplayName() {
+			return this.currentItem.chainName || this.currentItem.name || "";
+		},
+	},
+	created() {
+		this.fetchRechargeData();
+		if (localStorage.getItem("token")) {
+			this.fetchRecords();
+		}
+	},
+	methods: {
+		fetchRechargeData() {
+			this.loading = true;
+			this.$http({
+				url: "/api/currency/recharge",
+				method: "get",
+				headers: { Authorization: localStorage.getItem("token") },
+			}).then((res) => {
+				this.loading = false;
+				if (res.data.type === "ok") {
+					this.rechargeList = res.data.message.recharge || [];
+					this.processRechargeData(this.rechargeList);
+				}
+			}).catch(() => { this.loading = false; });
+		},
+
+		processRechargeData(list) {
+			var groups = {};
+			list.forEach(function(item) {
+				if (item.status != 1) return;
+				var parts = item.name.split("-");
+				var baseName = parts[0];
+				var chainName = parts.length > 1 ? parts[1] : item.name;
+				if (!groups[baseName]) groups[baseName] = [];
+				groups[baseName].push(Object.assign({}, item, { baseName: baseName, chainName: chainName }));
+			});
+			this.currencyGroups = groups;
+			this.currencyNames = Object.keys(groups);
+			if (this.currencyNames.length > 0) {
+				this.selectedCurrency = this.currencyNames[0];
+				this.selectedChainIndex = 0;
+			}
+		},
+
+		getCurrencyLogo(name) {
+			var chains = this.currencyGroups[name];
+			if (chains && chains.length > 0 && chains[0].logo) {
+				return chains[0].logo;
+			}
+			return "";
+		},
+
+		onCurrencyChange() {
+			this.selectedChainIndex = 0;
+		},
+
+		copyAddress() {
+			var input = document.createElement("input");
+			input.value = this.depositAddress;
+			document.body.appendChild(input);
+			input.select();
+			document.execCommand("copy");
+			input.remove();
+			this.$message.success(this.$t("deposit.copySuccess"));
+		},
+
+		saveQrCode() {
+			window.open(this.qrCodeUrl, "_blank");
+		},
+
+		fetchRecords() {
+			this.$http({
+				url: "/api/recharge/log?page=" + this.recPage + "&limit=" + this.recLimit + "&lang=" + (localStorage.getItem("lang") || "en"),
+				method: "get",
+				headers: { Authorization: localStorage.getItem("token") },
+			}).then((res) => {
+				if (res.data.type === "ok") {
+					this.recData = res.data.message.data || [];
+					this.recTotal = res.data.message.total || 0;
+				}
+			});
+		},
+	},
+};
+</script>
+
+<style scoped>
+.deposit-page {
+	padding: 20px 0 60px;
+	min-height: 70vh;
+}
+
+.deposit-title {
+	font-size: 22px;
+	font-weight: bold;
+	margin-bottom: 24px;
+	color: #fff;
+}
+
+.deposit-main {
+	display: flex;
+	gap: 30px;
+}
+
+.deposit-left {
+	flex: 1;
+	background: #111a2e;
+	border: 1px solid #1e2d45;
+	border-radius: 12px;
+	padding: 30px;
+}
+
+.form-group {
+	margin-bottom: 20px;
+}
+
+.form-group label {
+	display: block;
+	font-size: 14px;
+	color: #8a94a6;
+	margin-bottom: 8px;
+}
+
+.wallet-label {
+	color: #00cce1;
+}
+
+.currency-select {
+	width: 100%;
+}
+
+.currency-option {
+	display: flex;
+	align-items: center;
+	gap: 10px;
+}
+
+.coin-logo {
+	width: 24px;
+	height: 24px;
+	border-radius: 50%;
+}
+
+.chain-tags {
+	margin-bottom: 20px;
+}
+
+.chain-tags label {
+	display: block;
+	font-size: 14px;
+	color: #8a94a6;
+	margin-bottom: 8px;
+}
+
+.tags-row {
+	display: flex;
+	gap: 10px;
+	flex-wrap: wrap;
+}
+
+.chain-tag {
+	padding: 6px 18px;
+	border-radius: 6px;
+	border: 1px solid #2a3a55;
+	color: #8a94a6;
+	font-size: 13px;
+	cursor: pointer;
+	transition: all 0.2s;
+	user-select: none;
+}
+
+.chain-tag:hover {
+	border-color: #00cce1;
+	color: #00cce1;
+}
+
+.chain-tag.active {
+	background: rgba(0, 204, 225, 0.12);
+	color: #00cce1;
+	border-color: #00cce1;
+}
+
+.qr-section {
+	display: flex;
+	gap: 30px;
+	margin-bottom: 24px;
+	align-items: flex-start;
+}
+
+.qr-container {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	gap: 12px;
+}
+
+.qr-frame {
+	padding: 12px;
+	background: #fff;
+	border-radius: 8px;
+	display: inline-block;
+}
+
+.qr-img {
+	width: 160px;
+	height: 160px;
+	display: block;
+}
+
+.save-qr-btn {
+	padding: 8px 24px;
+	border-radius: 20px;
+	border: none;
+	background: linear-gradient(135deg, #42C18D, #47B487);
+	color: #fff;
+	font-size: 13px;
+	cursor: pointer;
+	transition: opacity 0.2s;
+}
+
+.save-qr-btn:hover {
+	opacity: 0.85;
+}
+
+.deposit-warnings {
+	flex: 1;
+}
+
+.warning-item {
+	display: flex;
+	align-items: flex-start;
+	gap: 8px;
+	margin-bottom: 12px;
+	font-size: 13px;
+	color: #ff6b6b;
+	line-height: 1.5;
+}
+
+.warning-item .dot {
+	width: 6px;
+	height: 6px;
+	border-radius: 50%;
+	background: #ff6b6b;
+	margin-top: 6px;
+	flex-shrink: 0;
+}
+
+.address-box {
+	margin-bottom: 20px;
+}
+
+.address-box label {
+	display: block;
+	font-size: 14px;
+	color: #8a94a6;
+	margin-bottom: 8px;
+}
+
+.address-row {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	background: #0d1421;
+	border: 1px solid #1e2d45;
+	border-radius: 8px;
+	padding: 12px 16px;
+}
+
+.address-text {
+	font-size: 13px;
+	color: #fff;
+	word-break: break-all;
+	flex: 1;
+	margin-right: 12px;
+}
+
+.copy-btn {
+	cursor: pointer;
+	color: #00cce1;
+	font-size: 18px;
+	transition: opacity 0.2s;
+}
+
+.copy-btn:hover {
+	opacity: 0.7;
+}
+
+.no-address {
+	text-align: center;
+	padding: 40px 20px;
+	color: #8a94a6;
+}
+
+.deposit-records {
+	margin-top: 30px;
+	background: #111a2e;
+	border: 1px solid #1e2d45;
+	border-radius: 12px;
+	padding: 24px;
+}
+
+.records-header {
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+	margin-bottom: 16px;
+}
+
+.records-title {
+	font-size: 16px;
+	font-weight: bold;
+	color: #fff;
+}
+
+.records-table {
+	width: 100%;
+}
+
+.table-header, .table-row {
+	display: flex;
+	padding: 12px 0;
+	border-bottom: 1px solid #1e2d45;
+}
+
+.table-header {
+	color: #8a94a6;
+	font-size: 13px;
+}
+
+.table-row {
+	color: #fff;
+	font-size: 13px;
+}
+
+.table-row:last-child {
+	border-bottom: none;
+}
+
+.col { flex: 1; padding: 0 4px; }
+.col-currency { flex: 0.6; }
+.col-amount { flex: 0.8; }
+.col-time { flex: 1.2; }
+.col-address { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.col-hash { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.col-status { flex: 0.6; text-align: center; }
+
+.status-ok { color: #42C18D; }
+.status-pending { color: #f0ad4e; }
+.status-fail { color: #ff4040; }
+
+.no-data {
+	text-align: center;
+	padding: 40px;
+	color: #8a94a6;
+	font-size: 14px;
+}
+
+.pagination {
+	margin-top: 16px;
+	text-align: center;
+}
+
+/* Dark theme overrides for Element UI */
+.deposit-page >>> .el-select .el-input__inner {
+	background-color: #0d1421;
+	border-color: #1e2d45;
+	color: #fff;
+}
+
+.deposit-page >>> .el-select .el-input__inner:focus {
+	border-color: #00cce1;
+}
+
+.deposit-page >>> .el-pagination .btn-prev,
+.deposit-page >>> .el-pagination .btn-next,
+.deposit-page >>> .el-pagination .el-pager li {
+	background: #0d1421;
+	color: #8a94a6;
+	border: 1px solid #1e2d45;
+}
+
+.deposit-page >>> .el-pagination .el-pager li.active {
+	color: #00cce1;
+	border-color: #00cce1;
+}
+
+/* Mobile responsive */
+@media screen and (max-width: 800px) {
+	.deposit-title {
+		display: none;
+	}
+
+	.deposit-main {
+		flex-direction: column;
+	}
+
+	.deposit-left {
+		border: none;
+		background: transparent;
+		padding: 10px 0;
+	}
+
+	.qr-section {
+		flex-direction: column;
+		align-items: center;
+	}
+
+	.deposit-warnings {
+		margin-top: 16px;
+	}
+
+	.col-time, .col-address, .col-hash {
+		display: none;
+	}
+
+	.col-currency { flex: 1; }
+	.col-amount { flex: 1; }
+	.col-status { flex: 0.8; }
+
+	.deposit-records {
+		background: transparent;
+		border: none;
+		padding: 10px 0;
+	}
+}
+</style>
diff --git a/src/view/indexHeader.vue b/src/view/indexHeader.vue
new file mode 100644
index 0000000..938281d
--- /dev/null
+++ b/src/view/indexHeader.vue
@@ -0,0 +1,2134 @@
+<template>
+  <!--  -->
+  <div class="head" :class="{ regular: regular }">
+    <div class="hd-left">
+      <div class="hl-item" style="padding: 0 0">
+        <router-link to="/">
+          <img
+            class="logo"
+            style="display: block; margin-top: 2px"
+            :src="$utils.isBaseUrl(siteConfig.site_logo)"
+          />
+        </router-link>
+      </div>
+
+      <div class="hl-item" id="h-tabs">
+        <div class="h-item h-active">{{ $t("indexHeader.交易") }}</div>
+        <div class="h-item" @click="goPages('/')">NFT</div>
+      </div>
+      <div class="fgx"><span style="opacity: 0">1</span></div>
+      <div class="hl-item" @click="goPages('aiIndex')">AI</div>
+      <div class="hl-item">
+        <el-popover placement="bottom" width="180" trigger="hover">
+          <div class="jylist">
+            <div
+              class="jy-item"
+              @click="goPages(item.url)"
+              v-for="(item, index) in trafficList"
+              :key="index"
+            >
+              <template v-if="index == 0">
+                <svg
+                  width="24"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  xmlns="http://www.w3.org/2000/svg"
+                  class="svg-class"
+                >
+                  <path
+                    d="M19 2H5C4.20435 2 3.44129 2.31607 2.87868 2.87868C2.31607 3.44129 2 4.20435 2 5V19C2 19.7956 2.31607 20.5587 2.87868 21.1213C3.44129 21.6839 4.20435 22 5 22H19C19.7956 22 20.5587 21.6839 21.1213 21.1213C21.6839 20.5587 22 19.7956 22 19V5C22 4.20435 21.6839 3.44129 21.1213 2.87868C20.5587 2.31607 19.7956 2 19 2ZM20 19C20 19.2652 19.8946 19.5196 19.7071 19.7071C19.5196 19.8946 19.2652 20 19 20H5C4.73478 20 4.48043 19.8946 4.29289 19.7071C4.10536 19.5196 4 19.2652 4 19V5C4 4.73478 4.10536 4.48043 4.29289 4.29289C4.48043 4.10536 4.73478 4 5 4H19C19.2652 4 19.5196 4.10536 19.7071 4.29289C19.8946 4.48043 20 4.73478 20 5V19Z"
+                  ></path>
+                  <path
+                    d="M7.15635 15.63C6.91946 15.8669 6.59817 16 6.26316 16C5.92815 16 5.60686 15.8669 5.36997 15.63C5.13308 15.3931 5 15.0719 5 14.7368C5 14.4018 5.13308 14.0805 5.36997 13.8437C5.60686 13.6068 5.92815 13.4737 6.26316 13.4737L8.78947 10.9474C8.78947 10.6124 8.92256 10.2911 9.15944 10.0542C9.39633 9.81729 9.71762 9.68421 10.0526 9.68421C10.3876 9.68421 10.7089 9.81729 10.9458 10.0542C11.1827 10.2911 11.3158 10.6124 11.3158 10.9474L12.7726 12.4295H12.9074L15.9474 9.38947C15.9433 9.34747 15.9433 9.30516 15.9474 9.26316C15.9474 9.01333 16.0215 8.76911 16.1602 8.56139C16.299 8.35366 16.4963 8.19176 16.7271 8.09615C16.9579 8.00055 17.2119 7.97553 17.457 8.02427C17.702 8.07301 17.9271 8.19332 18.1037 8.36997C18.2804 8.54663 18.4007 8.7717 18.4494 9.01673C18.4982 9.26176 18.4731 9.51574 18.3775 9.74655C18.2819 9.97736 18.12 10.1746 17.9123 10.3134C17.7046 10.4522 17.4604 10.5263 17.2105 10.5263L14.1453 13.6168V13.6842C14.1453 14.0192 14.0122 14.3405 13.7753 14.5774C13.5384 14.8143 13.2171 14.9474 12.8821 14.9474C12.5471 14.9474 12.2258 14.8143 11.9889 14.5774C11.752 14.3405 11.6189 14.0192 11.6189 13.6842V13.6168L10.2632 12.2611H10.0695H9.87579L7.52632 14.6105C7.53043 14.6525 7.53043 14.6948 7.52632 14.7368C7.52632 15.0719 7.39323 15.3931 7.15635 15.63Z"
+                  ></path>
+                </svg>
+              </template>
+              <template v-if="index == 1">
+                <svg
+                  width="24"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  xmlns="http://www.w3.org/2000/svg"
+                  class="svg-class"
+                >
+                  <path
+                    d="M21.22 12C21.7178 11.4524 21.9956 10.7401 22 10C22 9.20435 21.6839 8.44129 21.1213 7.87868C20.5587 7.31607 19.7956 7 19 7H13.82C13.9797 6.54818 14.0289 6.06466 13.9634 5.58993C13.8979 5.11519 13.7196 4.66306 13.4435 4.27138C13.1674 3.8797 12.8014 3.55988 12.3763 3.33868C11.9512 3.11748 11.4792 3.00135 11 3H5C4.20435 3 3.44129 3.31607 2.87868 3.87868C2.31607 4.44129 2 5.20435 2 6C2.00441 6.74005 2.28221 7.45236 2.78 8C2.28805 8.55002 2.01607 9.26207 2.01607 10C2.01607 10.7379 2.28805 11.45 2.78 12C2.28805 12.55 2.01607 13.2621 2.01607 14C2.01607 14.7379 2.28805 15.45 2.78 16C2.28221 16.5476 2.00441 17.2599 2 18C2 18.7956 2.31607 19.5587 2.87868 20.1213C3.44129 20.6839 4.20435 21 5 21H19C19.5778 20.9969 20.1423 20.8271 20.6259 20.5108C21.1094 20.1946 21.4914 19.7455 21.7259 19.2174C21.9603 18.6894 22.0373 18.1049 21.9476 17.5341C21.8578 16.9633 21.6052 16.4306 21.22 16C21.712 15.45 21.9839 14.7379 21.9839 14C21.9839 13.2621 21.712 12.55 21.22 12ZM11 19H5C4.73478 19 4.48043 18.8946 4.29289 18.7071C4.10536 18.5196 4 18.2652 4 18C4 17.7348 4.10536 17.4804 4.29289 17.2929C4.48043 17.1054 4.73478 17 5 17H11C11.2652 17 11.5196 17.1054 11.7071 17.2929C11.8946 17.4804 12 17.7348 12 18C12 18.2652 11.8946 18.5196 11.7071 18.7071C11.5196 18.8946 11.2652 19 11 19ZM11 15H5C4.73478 15 4.48043 14.8946 4.29289 14.7071C4.10536 14.5196 4 14.2652 4 14C4 13.7348 4.10536 13.4804 4.29289 13.2929C4.48043 13.1054 4.73478 13 5 13H11C11.2652 13 11.5196 13.1054 11.7071 13.2929C11.8946 13.4804 12 13.7348 12 14C12 14.2652 11.8946 14.5196 11.7071 14.7071C11.5196 14.8946 11.2652 15 11 15ZM11 11H5C4.73478 11 4.48043 10.8946 4.29289 10.7071C4.10536 10.5196 4 10.2652 4 10C4 9.73478 4.10536 9.48043 4.29289 9.29289C4.48043 9.10536 4.73478 9 5 9H11C11.2652 9 11.5196 9.10536 11.7071 9.29289C11.8946 9.48043 12 9.73478 12 10C12 10.2652 11.8946 10.5196 11.7071 10.7071C11.5196 10.8946 11.2652 11 11 11ZM11 7H5C4.73478 7 4.48043 6.89464 4.29289 6.70711C4.10536 6.51957 4 6.26522 4 6C4 5.73478 4.10536 5.48043 4.29289 5.29289C4.48043 5.10536 4.73478 5 5 5H11C11.2652 5 11.5196 5.10536 11.7071 5.29289C11.8946 5.48043 12 5.73478 12 6C12 6.26522 11.8946 6.51957 11.7071 6.70711C11.5196 6.89464 11.2652 7 11 7ZM19.69 18.71C19.6014 18.8035 19.4942 18.8776 19.3755 18.9275C19.2567 18.9774 19.1288 19.0021 19 19H13.82C14.0598 18.3549 14.0598 17.6451 13.82 17H19C19.2652 17 19.5196 17.1054 19.7071 17.2929C19.8946 17.4804 20 17.7348 20 18C19.9981 18.133 19.9698 18.2643 19.9165 18.3862C19.8633 18.5082 19.7863 18.6182 19.69 18.71ZM19.69 14.71C19.6014 14.8035 19.4942 14.8776 19.3755 14.9275C19.2567 14.9774 19.1288 15.0021 19 15H13.82C14.0598 14.3549 14.0598 13.6451 13.82 13H19C19.2652 13 19.5196 13.1054 19.7071 13.2929C19.8946 13.4804 20 13.7348 20 14C19.9981 14.133 19.9698 14.2643 19.9165 14.3862C19.8633 14.5082 19.7863 14.6182 19.69 14.71ZM19.69 10.71C19.6014 10.8035 19.4942 10.8776 19.3755 10.9275C19.2567 10.9774 19.1288 11.0021 19 11H13.82C14.0598 10.3549 14.0598 9.6451 13.82 9H19C19.2652 9 19.5196 9.10536 19.7071 9.29289C19.8946 9.48043 20 9.73478 20 10C19.9981 10.133 19.9698 10.2643 19.9165 10.3862C19.8633 10.5082 19.7863 10.6182 19.69 10.71Z"
+                  ></path>
+                </svg>
+              </template>
+              <template v-if="index == 2">
+                <svg
+                  width="24"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  xmlns="http://www.w3.org/2000/svg"
+                  class="svg-class"
+                >
+                  <path
+                    d="M21 12.004H18V3.00397C18.0007 2.82776 17.9548 2.6545 17.867 2.50172C17.7792 2.34894 17.6526 2.22208 17.5 2.13397C17.348 2.04621 17.1755 2 17 2C16.8245 2 16.652 2.04621 16.5 2.13397L13.5 3.85397L10.5 2.13397C10.348 2.04621 10.1755 2 10 2C9.82447 2 9.65203 2.04621 9.50001 2.13397L6.50001 3.85397L3.50001 2.13397C3.34799 2.04621 3.17554 2 3.00001 2C2.82447 2 2.65203 2.04621 2.50001 2.13397C2.3474 2.22208 2.22079 2.34894 2.13299 2.50172C2.04518 2.6545 1.99931 2.82776 2.00001 3.00397V19.004C2.00001 19.7996 2.31608 20.5627 2.87869 21.1253C3.4413 21.6879 4.20436 22.004 5.00001 22.004H19C19.7957 22.004 20.5587 21.6879 21.1213 21.1253C21.6839 20.5627 22 19.7996 22 19.004V13.004C22 12.7388 21.8947 12.4844 21.7071 12.2969C21.5196 12.1093 21.2652 12.004 21 12.004ZM5.00001 20.004C4.73479 20.004 4.48044 19.8986 4.2929 19.7111C4.10536 19.5235 4.00001 19.2692 4.00001 19.004V4.73397L6.00001 5.87397C6.15435 5.95459 6.32589 5.99669 6.50001 5.99669C6.67413 5.99669 6.84567 5.95459 7.00001 5.87397L10 4.15397L13 5.87397C13.1543 5.95459 13.3259 5.99669 13.5 5.99669C13.6741 5.99669 13.8457 5.95459 14 5.87397L16 4.73397V19.004C16.0027 19.3451 16.0636 19.6833 16.18 20.004H5.00001ZM20 19.004C20 19.2692 19.8947 19.5235 19.7071 19.7111C19.5196 19.8986 19.2652 20.004 19 20.004C18.7348 20.004 18.4804 19.8986 18.2929 19.7111C18.1054 19.5235 18 19.2692 18 19.004V14.004H20V19.004Z"
+                  ></path>
+                  <path
+                    d="M13.5767 8H6.02394V9.82339H8.88864V12.5034H10.712V9.82339H13.5767V8Z"
+                  ></path>
+                  <path
+                    d="M9.81817 12.7907C7.44841 12.7907 5.52715 12.4156 5.52715 11.9529C5.52715 11.4903 7.44833 11.1152 9.81817 11.1152C12.1879 11.1152 14.1091 11.4903 14.1091 11.9529C14.1091 12.4156 12.1879 12.7907 9.81817 12.7907ZM14.6363 12.0926C14.6363 11.4959 12.4792 11.0123 9.81817 11.0123C7.15728 11.0123 5 11.4959 5 12.0926C5 12.618 6.67271 13.0557 8.88925 13.1527V17H10.7125V13.1542C12.9461 13.0603 14.6363 12.6207 14.6363 12.0926Z"
+                  ></path>
+                </svg>
+              </template>
+              <template v-if="index == 3">
+                <svg
+                  xmlns="http://www.w3.org/2000/svg"
+                  width="24"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  class="svg-class"
+                >
+                  <path
+                    d="M17 6C16.4477 6 16 5.55228 16 5C16 4.44772 16.4477 4 17 4C17.5523 4 18 4.44772 18 5C18 5.55228 17.5523 6 17 6ZM17 8C18.6569 8 20 6.65685 20 5C20 3.34315 18.6569 2 17 2C15.3431 2 14 3.34315 14 5C14 6.65685 15.3431 8 17 8ZM8 13C8 12.4477 7.55228 12 7 12C6.44772 12 6 12.4477 6 13C6 13.5523 6.44772 14 7 14C7.55228 14 8 13.5523 8 13ZM10 13C10 14.6569 8.65685 16 7 16C5.34315 16 4 14.6569 4 13C4 11.3431 5.34315 10 7 10C8.65685 10 10 11.3431 10 13ZM17 11C15.8954 11 15 11.8954 15 13H13C13 10.7909 14.7909 9 17 9C19.2091 9 21 10.7909 21 13H19C19 11.8954 18.1046 11 17 11ZM5 21C5 19.8954 5.89543 19 7 19C8.10457 19 9 19.8954 9 21H11C11 18.7909 9.20914 17 7 17C4.79086 17 3 18.7909 3 21H5Z"
+                  ></path>
+                  <path
+                    d="M3 7C3 4.79086 4.79086 3 7 3H10V5H7C5.89543 5 5 5.89543 5 7V9H3V7Z"
+                  ></path>
+                  <path
+                    d="M21 17C21 19.2091 19.2091 21 17 21H14V19H17C18.1046 19 19 18.1046 19 17V15H21V17Z"
+                  ></path>
+                </svg>
+              </template>
+              <template v-if="index == 4">
+                <svg
+                  width="24"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  xmlns="http://www.w3.org/2000/svg"
+                  class="svg-class"
+                >
+                  <g clip-path="url(#clip0_525_10280)">
+                    <path
+                      d="M7.9773 5.031C8.4028 4.98912 8.83089 5.00256 9.25742 5.00049C11.3275 5.00101 13.3971 4.99998 15.4667 5.00101C16.4361 5.01497 17.4298 5.22074 18.2529 5.75223C18.8201 6.11879 19.29 6.6296 19.624 7.21485C19.7988 7.50283 19.9218 7.81769 20.0624 8.12273C20.5991 9.37441 21.0613 10.6582 21.4501 11.9631C21.811 13.1993 22.1165 14.4592 22.2246 15.7455C22.2965 16.7118 22.2758 17.7376 21.8291 18.6206C21.4899 19.3031 20.8168 19.8015 20.0635 19.9209C19.2063 20.0491 18.3087 20.044 17.4815 19.7596C16.9929 19.5849 16.5385 19.314 16.1585 18.9598C15.49 18.3808 15.0774 17.5525 14.3526 17.0334C14.2161 16.9522 14.0822 16.8328 13.9147 16.8401C12.7297 16.8432 11.5442 16.8339 10.3592 16.8447C9.78839 17.0856 9.36858 17.5608 8.95239 18.0013C8.4664 18.5338 7.95817 19.0648 7.32432 19.4225C6.35751 19.9871 5.19061 20.0853 4.09868 19.9447C3.42864 19.8734 2.78702 19.5254 2.39151 18.9763C1.87346 18.266 1.74163 17.356 1.74318 16.4978C1.75869 14.7518 2.21521 13.0473 2.72291 11.3882C3.09051 10.244 3.5005 9.11229 3.98391 8.01105C4.23052 7.43562 4.52884 6.87104 4.96313 6.41349C5.72727 5.56455 6.85539 5.12251 7.9773 5.031ZM8.29165 6.79245C7.63866 6.82865 6.96396 7.00184 6.46143 7.44182C5.94648 7.87921 5.71486 8.53375 5.4517 9.13452C4.71651 10.9322 4.08886 12.7841 3.72385 14.695C3.5827 15.4963 3.4731 16.3168 3.57081 17.1296C3.62355 17.4522 3.68766 17.81 3.9441 18.0395C4.04802 18.1429 4.20105 18.1646 4.34013 18.1838C4.9228 18.251 5.53236 18.2551 6.08763 18.0437C6.7282 17.8069 7.18731 17.2759 7.63969 16.7899C8.16705 16.2083 8.74196 15.6406 9.45957 15.2983C9.7036 15.1768 9.95953 15.0491 10.2392 15.0574C11.4982 15.0553 12.7566 15.0579 14.015 15.0564C14.1566 15.0579 14.3019 15.0543 14.4384 15.0982C15.2491 15.3681 15.9191 15.9415 16.4537 16.5929C16.858 17.0624 17.2039 17.6099 17.7504 17.9304C18.3511 18.2763 19.0781 18.2577 19.744 18.1719C19.9746 18.1496 20.1622 17.977 20.2501 17.7696C20.474 17.2733 20.4688 16.7139 20.4538 16.1809C20.3856 14.9649 20.0992 13.7731 19.7657 12.6057C19.3547 11.2103 18.8635 9.83714 18.2684 8.50945C18.0606 8.02346 17.7519 7.5628 17.3026 7.26966C16.735 6.88914 16.0339 6.78263 15.3633 6.78367C13.0063 6.78987 10.6487 6.77333 8.29165 6.79245Z"
+                    ></path>
+                    <path
+                      d="M8.31631 8.57696C8.66116 8.46373 9.07735 8.63021 9.23866 8.95799C9.30897 9.08053 9.33482 9.2227 9.33121 9.36281C9.33017 9.76091 9.33069 10.1595 9.33069 10.5581C9.77067 10.5638 10.2112 10.5504 10.6517 10.5643C11.0637 10.5814 11.4127 10.9712 11.3781 11.3838C11.3662 11.7648 11.0317 12.0963 10.6522 12.1128C10.2122 12.1226 9.7717 12.1118 9.33121 12.1175C9.32707 12.5435 9.33586 12.9695 9.32759 13.3955C9.30949 13.8479 8.83332 14.1995 8.3949 14.0992C8.04126 14.0397 7.76466 13.7093 7.76156 13.3521C7.75742 12.94 7.76208 12.5285 7.76001 12.1164C7.32985 12.1143 6.89918 12.1195 6.46851 12.1143C6.04767 12.104 5.68524 11.7002 5.72815 11.2789C5.75245 10.8952 6.09523 10.57 6.47937 10.5618C6.9059 10.5545 7.33347 10.5612 7.76001 10.5587C7.76156 10.1419 7.75846 9.72472 7.76104 9.30801C7.76001 8.97609 7.99938 8.66898 8.31631 8.57696Z"
+                    ></path>
+                    <path
+                      d="M14.6 9.26663C14.9273 9.18287 15.285 9.23612 15.5761 9.40674C16.0497 9.67765 16.302 10.2764 16.1578 10.8042C16.0078 11.4391 15.3176 11.8713 14.6807 11.7374C14.0959 11.6449 13.6285 11.0953 13.6337 10.5028C13.6192 9.9315 14.0458 9.39588 14.6 9.26663Z"
+                    ></path>
+                    <path
+                      d="M16.8318 11.4669C17.1994 11.3717 17.6073 11.4498 17.9134 11.6747C18.3306 11.9715 18.5333 12.5345 18.389 13.0277C18.2401 13.6031 17.6502 14.0111 17.0608 13.9552C16.4647 13.9263 15.9332 13.4263 15.8784 12.8302C15.8008 12.2207 16.2351 11.6059 16.8318 11.4669Z"
+                    ></path>
+                  </g>
+                  <defs>
+                    <clipPath id="clip0_525_10280">
+                      <rect width="24" height="24"></rect>
+                    </clipPath>
+                  </defs>
+                </svg>
+              </template>
+
+              <div class="r-tetx">
+                <div class="r-t">{{ item.title }}</div>
+
+                <p class="r-s">{{ item.desc }}</p>
+              </div>
+            </div>
+          </div>
+
+          <div slot="reference" style="background: transparent">
+            <span class="jy-text">{{ $t("indexHeader.交易中心") }}</span>
+            <i class="el-icon-caret-bottom"></i>
+          </div>
+        </el-popover>
+      </div>
+
+      <div class="hl-item" @click="goPages('documentary')">
+        {{ $t("indexHeader.跟单") }}
+      </div>
+      <div class="hl-item">
+        <el-popover placement="bottom" width="180" trigger="hover">
+          <div class="jylist">
+            <div class="jy-item" @click="goPages('borrowMoney')">
+              <svg
+                width="24"
+                height="24"
+                viewBox="0 0 24 24"
+                xmlns="http://www.w3.org/2000/svg"
+                class="svg-class"
+              >
+                <path
+                  d="M22 17H2C1.73478 17 1.48043 17.1054 1.29289 17.2929C1.10536 17.4804 1 17.7348 1 18C1 18.2652 1.10536 18.5196 1.29289 18.7071C1.48043 18.8946 1.73478 19 2 19H22C22.2652 19 22.5196 18.8946 22.7071 18.7071C22.8946 18.5196 23 18.2652 23 18C23 17.7348 22.8946 17.4804 22.7071 17.2929C22.5196 17.1054 22.2652 17 22 17ZM22 21H2C1.73478 21 1.48043 21.1054 1.29289 21.2929C1.10536 21.4804 1 21.7348 1 22C1 22.2652 1.10536 22.5196 1.29289 22.7071C1.48043 22.8946 1.73478 23 2 23H22C22.2652 23 22.5196 22.8946 22.7071 22.7071C22.8946 22.5196 23 22.2652 23 22C23 21.7348 22.8946 21.4804 22.7071 21.2929C22.5196 21.1054 22.2652 21 22 21ZM6 7C5.80222 7 5.60888 7.05865 5.44443 7.16853C5.27998 7.27841 5.15181 7.43459 5.07612 7.61732C5.00043 7.80004 4.98063 8.00111 5.01921 8.19509C5.0578 8.38907 5.15304 8.56725 5.29289 8.70711C5.43275 8.84696 5.61093 8.9422 5.80491 8.98079C5.99889 9.01937 6.19996 8.99957 6.38268 8.92388C6.56541 8.84819 6.72159 8.72002 6.83147 8.55557C6.94135 8.39112 7 8.19778 7 8C7 7.73478 6.89464 7.48043 6.70711 7.29289C6.51957 7.10536 6.26522 7 6 7ZM20 1H4C3.20435 1 2.44129 1.31607 1.87868 1.87868C1.31607 2.44129 1 3.20435 1 4V12C1 12.7956 1.31607 13.5587 1.87868 14.1213C2.44129 14.6839 3.20435 15 4 15H20C20.7956 15 21.5587 14.6839 22.1213 14.1213C22.6839 13.5587 23 12.7956 23 12V4C23 3.20435 22.6839 2.44129 22.1213 1.87868C21.5587 1.31607 20.7956 1 20 1ZM21 12C21 12.2652 20.8946 12.5196 20.7071 12.7071C20.5196 12.8946 20.2652 13 20 13H4C3.73478 13 3.48043 12.8946 3.29289 12.7071C3.10536 12.5196 3 12.2652 3 12V4C3 3.73478 3.10536 3.48043 3.29289 3.29289C3.48043 3.10536 3.73478 3 4 3H20C20.2652 3 20.5196 3.10536 20.7071 3.29289C20.8946 3.48043 21 3.73478 21 4V12ZM12 5C11.4067 5 10.8266 5.17595 10.3333 5.50559C9.83994 5.83524 9.45542 6.30377 9.22836 6.85195C9.0013 7.40013 8.94189 8.00333 9.05764 8.58527C9.1734 9.16721 9.45912 9.70176 9.87868 10.1213C10.2982 10.5409 10.8328 10.8266 11.4147 10.9424C11.9967 11.0581 12.5999 10.9987 13.1481 10.7716C13.6962 10.5446 14.1648 10.1601 14.4944 9.66671C14.8241 9.17336 15 8.59334 15 8C15 7.20435 14.6839 6.44129 14.1213 5.87868C13.5587 5.31607 12.7956 5 12 5ZM12 9C11.8022 9 11.6089 8.94135 11.4444 8.83147C11.28 8.72159 11.1518 8.56541 11.0761 8.38268C11.0004 8.19996 10.9806 7.99889 11.0192 7.80491C11.0578 7.61093 11.153 7.43275 11.2929 7.29289C11.4327 7.15304 11.6109 7.0578 11.8049 7.01921C11.9989 6.98063 12.2 7.00043 12.3827 7.07612C12.5654 7.15181 12.7216 7.27998 12.8315 7.44443C12.9414 7.60888 13 7.80222 13 8C13 8.26522 12.8946 8.51957 12.7071 8.70711C12.5196 8.89464 12.2652 9 12 9ZM18 7C17.8022 7 17.6089 7.05865 17.4444 7.16853C17.28 7.27841 17.1518 7.43459 17.0761 7.61732C17.0004 7.80004 16.9806 8.00111 17.0192 8.19509C17.0578 8.38907 17.153 8.56725 17.2929 8.70711C17.4327 8.84696 17.6109 8.9422 17.8049 8.98079C17.9989 9.01937 18.2 8.99957 18.3827 8.92388C18.5654 8.84819 18.7216 8.72002 18.8315 8.55557C18.9414 8.39112 19 8.19778 19 8C19 7.73478 18.8946 7.48043 18.7071 7.29289C18.5196 7.10536 18.2652 7 18 7Z"
+                ></path>
+              </svg>
+              <div class="r-tetx">
+                <div class="r-t">{{ $t("indexHeader.DeFi借幣") }}</div>
+                <p class="r-s">{{ $t("indexHeader.借貸交易, 放大收益") }}</p>
+              </div>
+            </div>
+
+            <div class="jy-item" @click="goPages('portfolio')">
+              <svg
+                width="24"
+                height="24"
+                viewBox="0 0 24 24"
+                xmlns="http://www.w3.org/2000/svg"
+                class="svg-class"
+              >
+                <path
+                  d="M17.0009 7.00087C16.5385 5.79663 15.7825 4.72705 14.8016 3.88934C13.8206 3.05164 12.6459 2.47239 11.3841 2.20424C10.1223 1.93609 8.81357 1.98754 7.57674 2.35393C6.33992 2.72032 5.21428 3.39002 4.30215 4.30215C3.39002 5.21428 2.72032 6.33992 2.35393 7.57674C1.98754 8.81357 1.93609 10.1223 2.20424 11.3841C2.47239 12.6459 3.05164 13.8206 3.88934 14.8016C4.72705 15.7825 5.79663 16.5385 7.00087 17.0009C7.46323 18.2051 8.21924 19.2747 9.20017 20.1124C10.1811 20.9501 11.3558 21.5294 12.6176 21.7975C13.8794 22.0657 15.1882 22.0142 16.425 21.6478C17.6618 21.2814 18.7875 20.6117 19.6996 19.6996C20.6117 18.7875 21.2814 17.6618 21.6478 16.425C22.0142 15.1882 22.0657 13.8794 21.7975 12.6176C21.5294 11.3558 20.9501 10.1811 20.1124 9.20017C19.2747 8.21924 18.2051 7.46323 17.0009 7.00087ZM15.4009 8.60087C15.4731 8.9766 15.5099 9.35827 15.5109 9.74087C15.5088 10.1922 15.4551 10.6418 15.3509 11.0809L12.9109 8.66087C13.35 8.55663 13.7996 8.50295 14.2509 8.50087C14.6335 8.50182 15.0151 8.53865 15.3909 8.61087L15.4009 8.60087ZM14.4609 13.0009C14.0622 13.5682 13.5682 14.0622 13.0009 14.4609L9.54087 11.0009C9.93951 10.4335 10.4335 9.93951 11.0009 9.54087L14.4609 13.0009ZM6.46087 14.4609C5.76807 13.9816 5.18903 13.356 4.76471 12.6283C4.34039 11.9006 4.08115 11.0885 4.00533 10.2495C3.92952 9.4105 4.03898 8.56511 4.32597 7.7731C4.61296 6.98108 5.07047 6.26181 5.66614 5.66614C6.26181 5.07047 6.98108 4.61296 7.7731 4.32597C8.56511 4.03898 9.4105 3.92952 10.2495 4.00533C11.0885 4.08115 11.9006 4.34039 12.6283 4.76471C13.356 5.18903 13.9816 5.76807 14.4609 6.46087H14.2109C12.1563 6.47409 10.1908 7.30162 8.74541 8.76195C7.30007 10.2223 6.49288 12.1962 6.50087 14.2509C6.50087 14.3309 6.51087 14.4209 6.51087 14.5009L6.46087 14.4609ZM8.56087 15.3509C8.48865 14.9751 8.45182 14.5935 8.45087 14.2109C8.45295 13.7596 8.50663 13.31 8.61087 12.8709L11.0409 15.3009C10.6018 15.4051 10.1522 15.4588 9.70087 15.4609C9.33618 15.4701 8.97139 15.4466 8.61087 15.3909L8.56087 15.3509ZM14.2509 20.0009C13.3149 19.9991 12.3934 19.7697 11.5659 19.3324C10.7384 18.8951 10.0297 18.2631 9.50087 17.4909H9.75087C11.8038 17.4882 13.772 16.6722 15.2245 15.2216C16.677 13.7709 17.4956 11.8038 17.5009 9.75087C17.5009 9.67087 17.5009 9.58087 17.5009 9.50087C18.5167 10.1938 19.2836 11.1942 19.689 12.3551C20.0944 13.5161 20.117 14.7764 19.7534 15.9511C19.3898 17.1257 18.6592 18.1529 17.6688 18.8818C16.6785 19.6107 15.4805 20.0029 14.2509 20.0009Z"
+                ></path>
+              </svg>
+              <div class="r-tetx">
+                <div class="r-t">{{ $t("indexHeader.投資組合") }}</div>
+                <p class="r-s">{{ $t("indexHeader.涉及兩種加密貨幣的組合收益") }}</p>
+              </div>
+            </div>
+          </div>
+          <div slot="reference" style="background: transparent">
+            <span class="jy-text">{{ $t("indexHeader.金融理财") }}</span>
+            <i class="el-icon-caret-bottom"></i>
+          </div>
+        </el-popover>
+      </div>
+      <div class="hl-item">
+        <el-popover placement="bottom" width="180" trigger="hover">
+          <div class="jylist">
+            <div class="jy-item" @click="goPages('marketQuotaion')">
+              <svg
+                width="24"
+                height="24"
+                viewBox="0 0 24 24"
+                xmlns="http://www.w3.org/2000/svg"
+                class="svg-class"
+              >
+                <path
+                  d="M6 13H2C1.73478 13 1.48043 13.1054 1.29289 13.2929C1.10536 13.4804 1 13.7348 1 14V22C1 22.2652 1.10536 22.5196 1.29289 22.7071C1.48043 22.8946 1.73478 23 2 23H6C6.26522 23 6.51957 22.8946 6.70711 22.7071C6.89464 22.5196 7 22.2652 7 22V14C7 13.7348 6.89464 13.4804 6.70711 13.2929C6.51957 13.1054 6.26522 13 6 13ZM5 21H3V15H5V21ZM22 9H18C17.7348 9 17.4804 9.10536 17.2929 9.29289C17.1054 9.48043 17 9.73478 17 10V22C17 22.2652 17.1054 22.5196 17.2929 22.7071C17.4804 22.8946 17.7348 23 18 23H22C22.2652 23 22.5196 22.8946 22.7071 22.7071C22.8946 22.5196 23 22.2652 23 22V10C23 9.73478 22.8946 9.48043 22.7071 9.29289C22.5196 9.10536 22.2652 9 22 9ZM21 21H19V11H21V21ZM14 1H10C9.73478 1 9.48043 1.10536 9.29289 1.29289C9.10536 1.48043 9 1.73478 9 2V22C9 22.2652 9.10536 22.5196 9.29289 22.7071C9.48043 22.8946 9.73478 23 10 23H14C14.2652 23 14.5196 22.8946 14.7071 22.7071C14.8946 22.5196 15 22.2652 15 22V2C15 1.73478 14.8946 1.48043 14.7071 1.29289C14.5196 1.10536 14.2652 1 14 1ZM13 21H11V3H13V21Z"
+                ></path>
+              </svg>
+              <div class="r-tetx">
+                <div class="r-t">{{ $t("indexHeader.市场行情") }}</div>
+                <p class="r-s">{{ $t("indexHeader.全網交易市場數據") }}</p>
+              </div>
+            </div>
+            <div class="jy-item" @click="goPages('news')">
+              <svg
+                width="24"
+                height="24"
+                viewBox="0 0 24 24"
+                xmlns="http://www.w3.org/2000/svg"
+                class="svg-class"
+              >
+                <path
+                  d="M17 11H16C15.7348 11 15.4804 11.1054 15.2929 11.2929C15.1054 11.4804 15 11.7348 15 12C15 12.2652 15.1054 12.5196 15.2929 12.7071C15.4804 12.8946 15.7348 13 16 13H17C17.2652 13 17.5196 12.8946 17.7071 12.7071C17.8946 12.5196 18 12.2652 18 12C18 11.7348 17.8946 11.4804 17.7071 11.2929C17.5196 11.1054 17.2652 11 17 11ZM17 15H16C15.7348 15 15.4804 15.1054 15.2929 15.2929C15.1054 15.4804 15 15.7348 15 16C15 16.2652 15.1054 16.5196 15.2929 16.7071C15.4804 16.8946 15.7348 17 16 17H17C17.2652 17 17.5196 16.8946 17.7071 16.7071C17.8946 16.5196 18 16.2652 18 16C18 15.7348 17.8946 15.4804 17.7071 15.2929C17.5196 15.1054 17.2652 15 17 15ZM11 9H17C17.2652 9 17.5196 8.89464 17.7071 8.70711C17.8946 8.51957 18 8.26522 18 8C18 7.73478 17.8946 7.48043 17.7071 7.29289C17.5196 7.10536 17.2652 7 17 7H11C10.7348 7 10.4804 7.10536 10.2929 7.29289C10.1054 7.48043 10 7.73478 10 8C10 8.26522 10.1054 8.51957 10.2929 8.70711C10.4804 8.89464 10.7348 9 11 9ZM21 3H7C6.73478 3 6.48043 3.10536 6.29289 3.29289C6.10536 3.48043 6 3.73478 6 4V7H3C2.73478 7 2.48043 7.10536 2.29289 7.29289C2.10536 7.48043 2 7.73478 2 8V18C2 18.7956 2.31607 19.5587 2.87868 20.1213C3.44129 20.6839 4.20435 21 5 21H18C19.0609 21 20.0783 20.5786 20.8284 19.8284C21.5786 19.0783 22 18.0609 22 17V4C22 3.73478 21.8946 3.48043 21.7071 3.29289C21.5196 3.10536 21.2652 3 21 3ZM6 18C6 18.2652 5.89464 18.5196 5.70711 18.7071C5.51957 18.8946 5.26522 19 5 19C4.73478 19 4.48043 18.8946 4.29289 18.7071C4.10536 18.5196 4 18.2652 4 18V9H6V18ZM20 17C20 17.5304 19.7893 18.0391 19.4142 18.4142C19.0391 18.7893 18.5304 19 18 19H7.82C7.93642 18.6793 7.9973 18.3411 8 18V5H20V17ZM11 13H12C12.2652 13 12.5196 12.8946 12.7071 12.7071C12.8946 12.5196 13 12.2652 13 12C13 11.7348 12.8946 11.4804 12.7071 11.2929C12.5196 11.1054 12.2652 11 12 11H11C10.7348 11 10.4804 11.1054 10.2929 11.2929C10.1054 11.4804 10 11.7348 10 12C10 12.2652 10.1054 12.5196 10.2929 12.7071C10.4804 12.8946 10.7348 13 11 13ZM11 17H12C12.2652 17 12.5196 16.8946 12.7071 16.7071C12.8946 16.5196 13 16.2652 13 16C13 15.7348 12.8946 15.4804 12.7071 15.2929C12.5196 15.1054 12.2652 15 12 15H11C10.7348 15 10.4804 15.1054 10.2929 15.2929C10.1054 15.4804 10 15.7348 10 16C10 16.2652 10.1054 16.5196 10.2929 16.7071C10.4804 16.8946 10.7348 17 11 17Z"
+                ></path>
+              </svg>
+              <div class="r-tetx">
+                <div class="r-t">{{ $t("indexHeader.更多新聞") }}</div>
+                <p class="r-s">{{ $t("indexHeader.全網交易市場數據") }}</p>
+              </div>
+            </div>
+            <!-- <div class="jy-item" @click="goPages('/')">
+							<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" class="svg-class">
+								<g id="Frame">
+									<path id="Vector"
+										d="M9.3824 6.38509C9.32189 6.32189 9.25005 6.27175 9.17097 6.23754C9.0919 6.20333 9.00715 6.18572 8.92155 6.18572C8.83596 6.18572 8.75121 6.20333 8.67213 6.23754C8.59306 6.27175 8.52122 6.32189 8.46071 6.38509L7.99986 6.86627C7.75541 7.1215 7.42387 7.26489 7.07817 7.26489C6.73246 7.26489 6.40092 7.1215 6.15647 6.86627C5.91202 6.61104 5.77469 6.26487 5.77469 5.90391C5.77469 5.54296 5.91202 5.19679 6.15647 4.94155L9.82575 1.10978C10.6942 0.903895 11.6028 0.989037 12.4223 1.35311C13.2418 1.71718 13.9306 2.34167 14.3907 3.13782C14.8509 3.93397 15.059 4.8613 14.9856 5.78802C14.9121 6.71475 14.5608 7.59373 13.9815 8.30006L12.6077 9.75274L9.3824 6.38509ZM2.24043 2.29568C2.91475 1.59186 3.79668 1.14606 4.74367 1.03034C5.69066 0.914618 6.64736 1.13574 7.45909 1.65796L5.23536 3.9798C4.75325 4.48156 4.47828 5.16033 4.46921 5.871C4.46015 6.58167 4.71772 7.26784 5.18686 7.78282C5.656 8.2978 6.29948 8.60071 6.97972 8.6268C7.65996 8.65289 8.32299 8.40008 8.82705 7.92243L8.92155 7.82863L11.6861 10.7151L8.92155 13.6016C8.67716 13.8567 8.34573 14 8.00015 14C7.65457 14 7.32314 13.8567 7.07875 13.6016L2.24043 8.54979C1.44619 7.72041 1 6.59559 1 5.42273C1 4.24988 1.44619 3.12506 2.24043 2.29568Z">
+									</path>
+								</g>
+							</svg>
+							<div class="r-tetx">
+								<div class="r-t">慈善</div>
+								<p class="r-s">幫助 貢獻 回饋</p>
+							</div>
+						</div> -->
+          </div>
+          <div slot="reference" style="background: transparent">
+            <span class="jy-text">{{ $t("indexHeader.发现") }}</span>
+            <i class="el-icon-caret-bottom"></i>
+          </div>
+        </el-popover>
+      </div>
+      <div class="hl-item">
+        <el-popover placement="bottom" width="180" trigger="hover">
+          <div class="jylist">
+            <div class="jy-item" @click="goPages('invitation')">
+              <svg
+                width="24"
+                height="24"
+                viewBox="0 0 24 24"
+                xmlns="http://www.w3.org/2000/svg"
+                class="svg-class"
+              >
+                <path
+                  d="M12.3 12.22C12.8336 11.7581 13.2616 11.1869 13.5549 10.545C13.8482 9.90316 14 9.20571 14 8.5C14 7.17392 13.4732 5.90215 12.5355 4.96447C11.5979 4.02678 10.3261 3.5 9 3.5C7.67392 3.5 6.40215 4.02678 5.46447 4.96447C4.52678 5.90215 4 7.17392 4 8.5C3.99999 9.20571 4.1518 9.90316 4.44513 10.545C4.73845 11.1869 5.16642 11.7581 5.7 12.22C4.30014 12.8539 3.11247 13.8775 2.27898 15.1685C1.4455 16.4596 1.00147 17.9633 1 19.5C1 19.7652 1.10536 20.0196 1.29289 20.2071C1.48043 20.3946 1.73478 20.5 2 20.5C2.26522 20.5 2.51957 20.3946 2.70711 20.2071C2.89464 20.0196 3 19.7652 3 19.5C3 17.9087 3.63214 16.3826 4.75736 15.2574C5.88258 14.1321 7.4087 13.5 9 13.5C10.5913 13.5 12.1174 14.1321 13.2426 15.2574C14.3679 16.3826 15 17.9087 15 19.5C15 19.7652 15.1054 20.0196 15.2929 20.2071C15.4804 20.3946 15.7348 20.5 16 20.5C16.2652 20.5 16.5196 20.3946 16.7071 20.2071C16.8946 20.0196 17 19.7652 17 19.5C16.9985 17.9633 16.5545 16.4596 15.721 15.1685C14.8875 13.8775 13.6999 12.8539 12.3 12.22ZM9 11.5C8.40666 11.5 7.82664 11.3241 7.33329 10.9944C6.83994 10.6648 6.45542 10.1962 6.22836 9.64805C6.0013 9.09987 5.94189 8.49667 6.05764 7.91473C6.1734 7.33279 6.45912 6.79824 6.87868 6.37868C7.29824 5.95912 7.83279 5.6734 8.41473 5.55764C8.99667 5.44189 9.59987 5.5013 10.1481 5.72836C10.6962 5.95542 11.1648 6.33994 11.4944 6.83329C11.8241 7.32664 12 7.90666 12 8.5C12 9.29565 11.6839 10.0587 11.1213 10.6213C10.5587 11.1839 9.79565 11.5 9 11.5ZM18.74 11.82C19.38 11.0993 19.798 10.2091 19.9438 9.25634C20.0896 8.30362 19.9569 7.32907 19.5618 6.45C19.1666 5.57093 18.5258 4.8248 17.7165 4.30142C16.9071 3.77805 15.9638 3.49974 15 3.5C14.7348 3.5 14.4804 3.60536 14.2929 3.79289C14.1054 3.98043 14 4.23478 14 4.5C14 4.76522 14.1054 5.01957 14.2929 5.20711C14.4804 5.39464 14.7348 5.5 15 5.5C15.7956 5.5 16.5587 5.81607 17.1213 6.37868C17.6839 6.94129 18 7.70435 18 8.5C17.9986 9.02524 17.8593 9.5409 17.5961 9.99542C17.3328 10.4499 16.9549 10.8274 16.5 11.09C16.3517 11.1755 16.2279 11.2977 16.1404 11.4447C16.0528 11.5918 16.0045 11.7589 16 11.93C15.9958 12.0998 16.0349 12.2678 16.1137 12.4183C16.1924 12.5687 16.3081 12.6967 16.45 12.79L16.84 13.05L16.97 13.12C18.1754 13.6917 19.1923 14.596 19.901 15.7263C20.6096 16.8566 20.9805 18.1659 20.97 19.5C20.97 19.7652 21.0754 20.0196 21.2629 20.2071C21.4504 20.3946 21.7048 20.5 21.97 20.5C22.2352 20.5 22.4896 20.3946 22.6771 20.2071C22.8646 20.0196 22.97 19.7652 22.97 19.5C22.9782 17.9654 22.5938 16.4543 21.8535 15.1101C21.1131 13.7659 20.0413 12.6333 18.74 11.82Z"
+                ></path>
+              </svg>
+              <div class="r-tetx">
+                <div class="r-t">{{ $t("indexHeader.分享好友") }}</div>
+                <p class="r-s">{{ $t("indexHeader.邀請好友獲得獎勵") }}</p>
+              </div>
+            </div>
+
+            <div class="jy-item" @click="goPages('activityIndex')">
+              <svg
+                width="24"
+                height="24"
+                viewBox="0 0 24 24"
+                xmlns="http://www.w3.org/2000/svg"
+                class="svg-class"
+              >
+                <path
+                  d="M20.8701 17.25L18.1601 12.57C18.7146 11.5515 19.0035 10.4097 19.0001 9.25C19.0001 7.39348 18.2626 5.61301 16.9498 4.30025C15.6371 2.9875 13.8566 2.25 12.0001 2.25C10.1436 2.25 8.36308 2.9875 7.05033 4.30025C5.73757 5.61301 5.00007 7.39348 5.00007 9.25C4.99663 10.4097 5.28553 11.5515 5.84007 12.57L3.13007 17.25C3.04213 17.4023 2.99592 17.5751 2.99609 17.751C2.99627 17.9269 3.04282 18.0996 3.13106 18.2517C3.2193 18.4039 3.34611 18.53 3.49868 18.6175C3.65125 18.705 3.8242 18.7507 4.00007 18.75H6.87007L8.33007 21.21C8.37929 21.2915 8.4399 21.3656 8.51007 21.43C8.69545 21.6087 8.9426 21.709 9.20007 21.71H9.34007C9.49104 21.6893 9.63529 21.6345 9.76181 21.5495C9.88833 21.4646 9.99377 21.3519 10.0701 21.22L12.0001 17.9L13.9301 21.25C14.0075 21.38 14.1134 21.4908 14.2399 21.5739C14.3663 21.6571 14.51 21.7104 14.6601 21.73H14.8001C15.061 21.7316 15.3122 21.6311 15.5001 21.45C15.5673 21.3893 15.6247 21.3184 15.6701 21.24L17.1301 18.78H20.0001C20.1763 18.7807 20.3495 18.7348 20.5023 18.647C20.6551 18.5592 20.782 18.4326 20.8701 18.28C20.9635 18.1245 21.0129 17.9464 21.0129 17.765C21.0129 17.5836 20.9635 17.4055 20.8701 17.25ZM9.19007 18.78L8.30007 17.29C8.21244 17.1422 8.08818 17.0194 7.9393 16.9336C7.79041 16.8478 7.62192 16.8018 7.45007 16.8H5.72007L7.15007 14.32C8.1348 15.2689 9.37589 15.9085 10.7201 16.16L9.19007 18.78ZM12.0001 14.25C11.0112 14.25 10.0445 13.9568 9.22222 13.4073C8.39998 12.8579 7.75911 12.077 7.38068 11.1634C7.00224 10.2498 6.90322 9.24445 7.09615 8.27455C7.28907 7.30464 7.76528 6.41373 8.46454 5.71447C9.1638 5.0152 10.0547 4.539 11.0246 4.34607C11.9945 4.15315 12.9999 4.25216 13.9135 4.6306C14.8271 5.00904 15.608 5.6499 16.1574 6.47215C16.7068 7.29439 17.0001 8.26109 17.0001 9.25C17.0001 10.5761 16.4733 11.8479 15.5356 12.7855C14.5979 13.7232 13.3262 14.25 12.0001 14.25ZM16.5501 16.8C16.3782 16.8018 16.2097 16.8478 16.0609 16.9336C15.912 17.0194 15.7877 17.1422 15.7001 17.29L14.8101 18.78L13.2901 16.13C14.6296 15.8734 15.866 15.2343 16.8501 14.29L18.2801 16.77L16.5501 16.8Z"
+                ></path>
+              </svg>
+              <div class="r-tetx">
+                <div class="r-t">{{ $t("indexHeader.活動大廳") }}</div>
+                <p class="r-s">{{ $t("indexHeader.豐厚獎勵, 應有盡有") }}</p>
+              </div>
+            </div>
+          </div>
+          <div slot="reference" style="background: transparent">
+            <span class="jy-text">{{ $t("indexHeader.活动大厅") }}</span>
+            <i class="el-icon-caret-bottom"></i>
+          </div>
+        </el-popover>
+      </div>
+
+      <!-- 
+			<div class="hl-item" @click="goPages('marketQuotaion')">{{$t('homeContent.market')}}</div>
+			<div class="hl-item" @click="goPages('change')">{{$t('zjde38')}} </div>
+			<div class="hl-item" @click="goPages('mx-defi')"> {{$t('zjde39')}}</div> -->
+      <!-- <div class="hl-item" @click="goPages('help')"> {{$t('zjde40')}}</div>
+			<div class="hl-item" @click="goPages('message')"> {{$t('zjde41')}}</div> -->
+    </div>
+    <div class="hd-right">
+      <!-- <div class="hr-item">
+
+
+				<el-popover placement="bottom" width="220" trigger="hover">
+					<div class="jylist" style="padding: 0.8rem;">
+						<img style="width: 100%;" :src="$utils.isBaseUrl(siteConfig.down_logo)" />
+						<div style="text-align: center; margin-top: 0.5rem; font-size: 1rem;"> {{$t('zjde42')}}</div>
+					</div>
+					<div slot="reference" style="background: transparent; display: flex; align-items: center;">
+						<img class="hi-icon" src="../assets/xz.png" />
+						<span class="jy-text"> {{$t('zjde43')}}</span>
+
+
+					</div>
+				</el-popover>
+
+			</div>
+			<div class="hr-item dfdf" @click="switchSkins">
+				<i class="el-icon-sunny hi-icon" v-if="night==1 " style="font-size: 24px;"></i>
+				<i class="el-icon-moon hi-icon" v-else style="font-size: 24px;"></i>
+				<i class="el-icon-arrow-down"></i>
+
+			</div> -->
+
+      <div class="dlzc" v-if="account_number.length <= 0">
+        <div @click="goPages('login')" class="dc-item">
+          {{ $t("indexHeader.log_in") }}
+        </div>
+        <!-- <div @click="goPages('register')" class="dc-item zc">{{$t('indexHeader.sign_up')}}</div> -->
+      </div>
+      <template v-else>
+        <div class="hr-item">
+          <el-popover placement="bottom" width="300" trigger="hover">
+            <div class="userList">
+              <!-- <div class="ul-item">
+								{{account_number}}
+							</div> -->
+              <div
+                class="ul-item ul-item11"
+                @click="goPages('overviewAssets')"
+                style="fill: rgb(255, 255, 255)"
+              >
+                <svg
+                  width="24"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  xmlns="http://www.w3.org/2000/svg"
+                  class="svg-class"
+                >
+                  <path
+                    d="M19 2H5C4.20435 2 3.44129 2.31607 2.87868 2.87868C2.31607 3.44129 2 4.20435 2 5V19C2 19.7956 2.31607 20.5587 2.87868 21.1213C3.44129 21.6839 4.20435 22 5 22H19C19.7956 22 20.5587 21.6839 21.1213 21.1213C21.6839 20.5587 22 19.7956 22 19V5C22 4.20435 21.6839 3.44129 21.1213 2.87868C20.5587 2.31607 19.7956 2 19 2ZM20 19C20 19.2652 19.8946 19.5196 19.7071 19.7071C19.5196 19.8946 19.2652 20 19 20H5C4.73478 20 4.48043 19.8946 4.29289 19.7071C4.10536 19.5196 4 19.2652 4 19V5C4 4.73478 4.10536 4.48043 4.29289 4.29289C4.48043 4.10536 4.73478 4 5 4H19C19.2652 4 19.5196 4.10536 19.7071 4.29289C19.8946 4.48043 20 4.73478 20 5V19Z"
+                  ></path>
+                  <path
+                    d="M16.5 10.75V12.25C16.5 13.4925 14.485 14.5 12 14.5C9.515 14.5 7.5 13.4925 7.5 12.25V10.75C7.5 11.9925 9.515 13 12 13C14.485 13 16.5 11.9925 16.5 10.75ZM7.5 13.25C7.5 14.4925 9.515 15.5 12 15.5C14.485 15.5 16.5 14.4925 16.5 13.25V14.75C16.5 15.9925 14.485 17 12 17C9.515 17 7.5 15.9925 7.5 14.75V13.25ZM12 12C9.515 12 7.5 10.9925 7.5 9.75C7.5 8.5075 9.515 7.5 12 7.5C14.485 7.5 16.5 8.5075 16.5 9.75C16.5 10.9925 14.485 12 12 12Z"
+                  ></path>
+                </svg>
+                <span>{{ $t("indexHeader.資產中心") }}</span>
+              </div>
+              <div
+                class="ul-item ul-item11"
+                @click="goPages('deposit')"
+                style="fill: rgb(255, 255, 255)"
+              >
+                <svg
+                  width="24"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  xmlns="http://www.w3.org/2000/svg"
+                  class="svg-class"
+                >
+                  <path
+                    d="M19 2H5C4.20435 2 3.44129 2.31607 2.87868 2.87868C2.31607 3.44129 2 4.20435 2 5V19C2 19.7956 2.31607 20.5587 2.87868 21.1213C3.44129 21.6839 4.20435 22 5 22H19C19.7956 22 20.5587 21.6839 21.1213 21.1213C21.6839 20.5587 22 19.7956 22 19V5C22 4.20435 21.6839 3.44129 21.1213 2.87868C20.5587 2.31607 19.7956 2 19 2ZM20 19C20 19.2652 19.8946 19.5196 19.7071 19.7071C19.5196 19.8946 19.2652 20 19 20H5C4.73478 20 4.48043 19.8946 4.29289 19.7071C4.10536 19.5196 4 19.2652 4 19V5C4 4.73478 4.10536 4.48043 4.29289 4.29289C4.48043 4.10536 4.73478 4 5 4H19C19.2652 4 19.5196 4.10536 19.7071 4.29289C19.8946 4.48043 20 4.73478 20 5V19Z"
+                  ></path>
+                  <path
+                    d="M16.0279 8.95612C16.2549 9.18312 16.3566 9.3895 16.333 9.57527C16.3094 9.76104 16.1824 9.96909 15.9521 10.1994L15.4574 10.6941C15.2323 10.9192 14.9941 11.1601 14.7429 11.4167C14.4917 11.6733 14.2458 11.922 14.0049 12.1628L13.4317 12.736C13.2328 12.9349 13.0947 13.1135 13.0175 13.2718C12.9402 13.4302 12.9772 13.5797 13.1283 13.7204C13.2364 13.8285 13.3622 13.9594 13.5056 14.1133C13.649 14.2672 13.7774 14.4009 13.8909 14.5144C14.0801 14.7035 14.1506 14.8735 14.1025 15.0243C14.0544 15.1751 13.8896 15.2669 13.6083 15.2996C13.3215 15.327 12.983 15.3601 12.5927 15.3991C12.2024 15.4381 11.8042 15.4769 11.3979 15.5156C10.9917 15.5544 10.5908 15.5932 10.1952 15.6321C9.79955 15.6709 9.45043 15.7066 9.1478 15.739C8.86104 15.7663 8.65825 15.7232 8.53943 15.6096C8.42061 15.496 8.37233 15.3038 8.3946 15.0329C8.41146 14.7566 8.43684 14.4313 8.47075 14.0568C8.50466 13.6824 8.54102 13.2948 8.57983 12.8938C8.61863 12.4929 8.65486 12.0973 8.68852 11.7069C8.72217 11.3165 8.75249 10.9673 8.77949 10.6593C8.81137 10.3247 8.90378 10.1161 9.05669 10.0335C9.20961 9.95082 9.38335 10.0068 9.57792 10.2014L9.7806 10.404C9.85627 10.4797 9.93594 10.5568 10.0196 10.6352C10.1033 10.7137 10.1857 10.7908 10.2666 10.8665C10.3476 10.9423 10.4179 11.0099 10.4773 11.0693C10.6177 11.1992 10.7447 11.2425 10.8583 11.1991C10.972 11.1557 11.0969 11.0659 11.233 10.9298C11.3848 10.778 11.5823 10.5777 11.8257 10.329C12.069 10.0802 12.3242 9.82239 12.5912 9.55541C12.8581 9.28843 13.1159 9.02796 13.3645 8.77398C13.613 8.52 13.8159 8.31449 13.9729 8.15745C14.041 8.08939 14.117 8.02413 14.2011 7.96165C14.2852 7.89917 14.3776 7.8581 14.4784 7.83843C14.5791 7.81877 14.6856 7.82579 14.7978 7.85949C14.91 7.89319 15.0256 7.9695 15.1445 8.0884C15.2904 8.23433 15.4323 8.37354 15.57 8.50605C15.7078 8.63855 15.8604 8.78857 16.0279 8.95612Z"
+                  ></path>
+                </svg>
+                <span>{{ $t("indexHeader.充值") }}</span>
+              </div>
+              <div
+                class="ul-item ul-item11"
+                @click="goPages('withdrawDeposit')"
+                style="fill: rgb(255, 255, 255)"
+              >
+                <svg
+                  width="24"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  xmlns="http://www.w3.org/2000/svg"
+                  class="svg-class"
+                >
+                  <path
+                    d="M19 2H5C4.20435 2 3.44129 2.31607 2.87868 2.87868C2.31607 3.44129 2 4.20435 2 5V19C2 19.7956 2.31607 20.5587 2.87868 21.1213C3.44129 21.6839 4.20435 22 5 22H19C19.7956 22 20.5587 21.6839 21.1213 21.1213C21.6839 20.5587 22 19.7956 22 19V5C22 4.20435 21.6839 3.44129 21.1213 2.87868C20.5587 2.31607 19.7956 2 19 2ZM20 19C20 19.2652 19.8946 19.5196 19.7071 19.7071C19.5196 19.8946 19.2652 20 19 20H5C4.73478 20 4.48043 19.8946 4.29289 19.7071C4.10536 19.5196 4 19.2652 4 19V5C4 4.73478 4.10536 4.48043 4.29289 4.29289C4.48043 4.10536 4.73478 4 5 4H19C19.2652 4 19.5196 4.10536 19.7071 4.29289C19.8946 4.48043 20 4.73478 20 5V19Z"
+                  ></path>
+                  <path
+                    d="M8.09315 15.1611C7.86615 14.9341 7.76446 14.7277 7.78809 14.5419C7.81172 14.3561 7.9387 14.1481 8.16903 13.9178L8.66373 13.4231C8.88883 13.198 9.12697 12.9571 9.37816 12.7005C9.62935 12.4439 9.87534 12.1952 10.1161 11.9544L10.6894 11.3812C10.8883 11.1823 11.0264 11.0037 11.1036 10.8453C11.1809 10.687 11.1439 10.5375 10.9928 10.3968C10.8847 10.2887 10.7589 10.1577 10.6155 10.0039C10.4721 9.85002 10.3437 9.71633 10.2302 9.60283C10.041 9.41367 9.97048 9.24368 10.0186 9.09287C10.0667 8.94206 10.2315 8.85029 10.5128 8.81755C10.7996 8.79022 11.1381 8.75707 11.5284 8.71809C11.9187 8.67912 12.3169 8.64027 12.7232 8.60155C13.1294 8.56283 13.5303 8.52403 13.9259 8.48514C14.3215 8.44625 14.6707 8.4106 14.9733 8.37821C15.2601 8.35088 15.4628 8.394 15.5817 8.50759C15.7005 8.62117 15.7488 8.81341 15.7265 9.08429C15.7096 9.36058 15.6842 9.68593 15.6503 10.0603C15.6164 10.4348 15.5801 10.8224 15.5413 11.2233C15.5025 11.6243 15.4662 12.0199 15.4326 12.4103C15.3989 12.8007 15.3686 13.1499 15.3416 13.4579C15.3097 13.7925 15.2173 14.0011 15.0644 14.0837C14.9115 14.1664 14.7377 14.1104 14.5432 13.9158L14.3405 13.7132C14.2648 13.6375 14.1851 13.5604 14.1015 13.482C14.0178 13.4035 13.9354 13.3264 13.8544 13.2507C13.7735 13.1749 13.7032 13.1073 13.6438 13.0479C13.5034 12.918 13.3764 12.8747 13.2628 12.9181C13.1491 12.9615 13.0242 13.0513 12.8881 13.1874C12.7363 13.3392 12.5388 13.5395 12.2954 13.7882C12.0521 14.0369 11.7969 14.2948 11.5299 14.5618C11.263 14.8288 11.0052 15.0892 10.7566 15.3432C10.508 15.5972 10.3052 15.8027 10.1482 15.9597C10.0801 16.0278 10.0041 16.0931 9.91997 16.1555C9.83587 16.218 9.74345 16.2591 9.64272 16.2788C9.54198 16.2984 9.4355 16.2914 9.32327 16.2577C9.21105 16.224 9.09548 16.1477 8.97657 16.0288C8.83065 15.8829 8.68881 15.7436 8.55108 15.6111C8.41334 15.4786 8.2607 15.3286 8.09315 15.1611Z"
+                  ></path>
+                </svg>
+                <span>{{ $t("indexHeader.提現") }}</span>
+              </div>
+              <div
+                class="ul-item ul-item11"
+                @click="goPages('change')"
+                style="fill: rgb(255, 255, 255)"
+              >
+                <svg
+                  width="24"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  xmlns="http://www.w3.org/2000/svg"
+                  class="svg-class"
+                >
+                  <path
+                    d="M19 2H5C4.20435 2 3.44129 2.31607 2.87868 2.87868C2.31607 3.44129 2 4.20435 2 5V19C2 19.7956 2.31607 20.5587 2.87868 21.1213C3.44129 21.6839 4.20435 22 5 22H19C19.7956 22 20.5587 21.6839 21.1213 21.1213C21.6839 20.5587 22 19.7956 22 19V5C22 4.20435 21.6839 3.44129 21.1213 2.87868C20.5587 2.31607 19.7956 2 19 2ZM20 19C20 19.2652 19.8946 19.5196 19.7071 19.7071C19.5196 19.8946 19.2652 20 19 20H5C4.73478 20 4.48043 19.8946 4.29289 19.7071C4.10536 19.5196 4 19.2652 4 19V5C4 4.73478 4.10536 4.48043 4.29289 4.29289C4.48043 4.10536 4.73478 4 5 4H19C19.2652 4 19.5196 4.10536 19.7071 4.29289C19.8946 4.48043 20 4.73478 20 5V19Z"
+                  ></path>
+                  <path
+                    d="M8.09315 15.1611C7.86615 14.9341 7.76446 14.7277 7.78809 14.5419C7.81172 14.3561 7.9387 14.1481 8.16903 13.9178L8.66373 13.4231C8.88883 13.198 9.12697 12.9571 9.37816 12.7005C9.62935 12.4439 9.87534 12.1952 10.1161 11.9544L10.6894 11.3812C10.8883 11.1823 11.0264 11.0037 11.1036 10.8453C11.1809 10.687 11.1439 10.5375 10.9928 10.3968C10.8847 10.2887 10.7589 10.1577 10.6155 10.0039C10.4721 9.85002 10.3437 9.71633 10.2302 9.60283C10.041 9.41367 9.97048 9.24368 10.0186 9.09287C10.0667 8.94206 10.2315 8.85029 10.5128 8.81755C10.7996 8.79022 11.1381 8.75707 11.5284 8.71809C11.9187 8.67912 12.3169 8.64027 12.7232 8.60155C13.1294 8.56283 13.5303 8.52403 13.9259 8.48514C14.3215 8.44625 14.6707 8.4106 14.9733 8.37821C15.2601 8.35088 15.4628 8.394 15.5817 8.50759C15.7005 8.62117 15.7488 8.81341 15.7265 9.08429C15.7096 9.36058 15.6842 9.68593 15.6503 10.0603C15.6164 10.4348 15.5801 10.8224 15.5413 11.2233C15.5025 11.6243 15.4662 12.0199 15.4326 12.4103C15.3989 12.8007 15.3686 13.1499 15.3416 13.4579C15.3097 13.7925 15.2173 14.0011 15.0644 14.0837C14.9115 14.1664 14.7377 14.1104 14.5432 13.9158L14.3405 13.7132C14.2648 13.6375 14.1851 13.5604 14.1015 13.482C14.0178 13.4035 13.9354 13.3264 13.8544 13.2507C13.7735 13.1749 13.7032 13.1073 13.6438 13.0479C13.5034 12.918 13.3764 12.8747 13.2628 12.9181C13.1491 12.9615 13.0242 13.0513 12.8881 13.1874C12.7363 13.3392 12.5388 13.5395 12.2954 13.7882C12.0521 14.0369 11.7969 14.2948 11.5299 14.5618C11.263 14.8288 11.0052 15.0892 10.7566 15.3432C10.508 15.5972 10.3052 15.8027 10.1482 15.9597C10.0801 16.0278 10.0041 16.0931 9.91997 16.1555C9.83587 16.218 9.74345 16.2591 9.64272 16.2788C9.54198 16.2984 9.4355 16.2914 9.32327 16.2577C9.21105 16.224 9.09548 16.1477 8.97657 16.0288C8.83065 15.8829 8.68881 15.7436 8.55108 15.6111C8.41334 15.4786 8.2607 15.3286 8.09315 15.1611Z"
+                  ></path>
+                </svg>
+                <span>{{ $t("indexHeader.金融卡提現") }}</span>
+              </div>
+              <div
+                class="ul-item ul-item11"
+                @click="goPages('orderTransfer')"
+                style="fill: rgb(255, 255, 255)"
+              >
+                <svg
+                  width="24"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  xmlns="http://www.w3.org/2000/svg"
+                  class="svg-class"
+                >
+                  <path
+                    d="M19 2H5C4.20435 2 3.44129 2.31607 2.87868 2.87868C2.31607 3.44129 2 4.20435 2 5V19C2 19.7956 2.31607 20.5587 2.87868 21.1213C3.44129 21.6839 4.20435 22 5 22H19C19.7956 22 20.5587 21.6839 21.1213 21.1213C21.6839 20.5587 22 19.7956 22 19V5C22 4.20435 21.6839 3.44129 21.1213 2.87868C20.5587 2.31607 19.7956 2 19 2ZM20 19C20 19.2652 19.8946 19.5196 19.7071 19.7071C19.5196 19.8946 19.2652 20 19 20H5C4.73478 20 4.48043 19.8946 4.29289 19.7071C4.10536 19.5196 4 19.2652 4 19V5C4 4.73478 4.10536 4.48043 4.29289 4.29289C4.48043 4.10536 4.73478 4 5 4H19C19.2652 4 19.5196 4.10536 19.7071 4.29289C19.8946 4.48043 20 4.73478 20 5V19Z"
+                  ></path>
+                  <path
+                    d="M14.5502 7.56352L14.5502 7.56351L14.5491 7.5629C12.6266 6.47837 10.2771 6.77612 8.65 8.1307V7.5C8.65 7.32728 8.59199 7.17557 8.48321 7.06679C8.37443 6.95801 8.22272 6.9 8.05 6.9C7.87728 6.9 7.72557 6.95801 7.61679 7.06679C7.50801 7.17557 7.45 7.32728 7.45 7.5V9.75C7.45 9.92272 7.50801 10.0744 7.61679 10.1832C7.72557 10.292 7.87728 10.35 8.05 10.35H10.3C10.4727 10.35 10.6244 10.292 10.7332 10.1832C10.842 10.0744 10.9 9.92272 10.9 9.75C10.9 9.57728 10.842 9.42557 10.7332 9.31679C10.6244 9.20801 10.4727 9.15 10.3 9.15H9.34094C10.0565 8.47591 11.0071 8.1 12 8.1C14.1448 8.1 15.9 9.85523 15.9 12C15.9 12.1727 15.958 12.3244 16.0668 12.4332C16.1756 12.542 16.3273 12.6 16.5 12.6C16.6727 12.6 16.8244 12.542 16.9332 12.4332C17.042 12.3244 17.1 12.1727 17.1 12C17.1 10.1644 16.1311 8.48146 14.5502 7.56352ZM13.6 12C13.6 11.0948 12.9052 10.4 12 10.4C11.0948 10.4 10.4 11.0948 10.4 12C10.4 12.9052 11.0948 13.6 12 13.6C12.9052 13.6 13.6 12.9052 13.6 12ZM15.95 13.65H13.7C13.5273 13.65 13.3756 13.708 13.2668 13.8168C13.158 13.9256 13.1 14.0773 13.1 14.25C13.1 14.4227 13.158 14.5744 13.2668 14.6832C13.3756 14.792 13.5273 14.85 13.7 14.85H14.6591C13.9435 15.5241 12.9929 15.9 12 15.9C9.85523 15.9 8.1 14.1448 8.1 12C8.1 11.8273 8.04199 11.6756 7.93321 11.5668C7.82443 11.458 7.67272 11.4 7.5 11.4C7.32728 11.4 7.17557 11.458 7.06679 11.5668C6.95801 11.6756 6.9 11.8273 6.9 12C6.9 14.8052 9.19477 17.1 12 17.1C13.2508 17.1 14.4105 16.6461 15.35 15.8261V16.5C15.35 16.6727 15.408 16.8244 15.5168 16.9332C15.6256 17.042 15.7773 17.1 15.95 17.1C16.1227 17.1 16.2744 17.042 16.3832 16.9332C16.492 16.8244 16.55 16.6727 16.55 16.5V14.25C16.55 13.8884 16.2486 13.65 15.95 13.65Z"
+                    stroke="#ECECFF"
+                    stroke-width="0.2"
+                  ></path>
+                </svg>
+                <span>{{ $t("indexHeader.劃轉") }}</span>
+              </div>
+              <div
+                class="ul-item ul-item11"
+                @click="goPages('UOrder')"
+                style="fill: rgb(255, 255, 255)"
+              >
+                <svg
+                  width="24"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  xmlns="http://www.w3.org/2000/svg"
+                  class="svg-class"
+                >
+                  <path
+                    d="M15 14H9C8.73478 14 8.48043 14.1054 8.29289 14.2929C8.10536 14.4804 8 14.7348 8 15C8 15.2652 8.10536 15.5196 8.29289 15.7071C8.48043 15.8946 8.73478 16 9 16H15C15.2652 16 15.5196 15.8946 15.7071 15.7071C15.8946 15.5196 16 15.2652 16 15C16 14.7348 15.8946 14.4804 15.7071 14.2929C15.5196 14.1054 15.2652 14 15 14ZM15 10H11C10.7348 10 10.4804 10.1054 10.2929 10.2929C10.1054 10.4804 10 10.7348 10 11C10 11.2652 10.1054 11.5196 10.2929 11.7071C10.4804 11.8946 10.7348 12 11 12H15C15.2652 12 15.5196 11.8946 15.7071 11.7071C15.8946 11.5196 16 11.2652 16 11C16 10.7348 15.8946 10.4804 15.7071 10.2929C15.5196 10.1054 15.2652 10 15 10ZM17 4H15.82C15.6137 3.41645 15.2319 2.911 14.7271 2.55294C14.2222 2.19488 13.6189 2.00174 13 2H11C10.3811 2.00174 9.7778 2.19488 9.27293 2.55294C8.76807 2.911 8.38631 3.41645 8.18 4H7C6.20435 4 5.44129 4.31607 4.87868 4.87868C4.31607 5.44129 4 6.20435 4 7V19C4 19.7956 4.31607 20.5587 4.87868 21.1213C5.44129 21.6839 6.20435 22 7 22H17C17.7956 22 18.5587 21.6839 19.1213 21.1213C19.6839 20.5587 20 19.7956 20 19V7C20 6.20435 19.6839 5.44129 19.1213 4.87868C18.5587 4.31607 17.7956 4 17 4ZM10 5C10 4.73478 10.1054 4.48043 10.2929 4.29289C10.4804 4.10536 10.7348 4 11 4H13C13.2652 4 13.5196 4.10536 13.7071 4.29289C13.8946 4.48043 14 4.73478 14 5V6H10V5ZM18 19C18 19.2652 17.8946 19.5196 17.7071 19.7071C17.5196 19.8946 17.2652 20 17 20H7C6.73478 20 6.48043 19.8946 6.29289 19.7071C6.10536 19.5196 6 19.2652 6 19V7C6 6.73478 6.10536 6.48043 6.29289 6.29289C6.48043 6.10536 6.73478 6 7 6H8V7C8 7.26522 8.10536 7.51957 8.29289 7.70711C8.48043 7.89464 8.73478 8 9 8H15C15.2652 8 15.5196 7.89464 15.7071 7.70711C15.8946 7.51957 16 7.26522 16 7V6H17C17.2652 6 17.5196 6.10536 17.7071 6.29289C17.8946 6.48043 18 6.73478 18 7V19Z"
+                  ></path>
+                </svg>
+                <span>{{ $t("indexHeader.訂單中心") }} </span>
+              </div>
+              <div
+                class="ul-item ul-item11"
+                @click="goPages('change')"
+                style="fill: rgb(255, 255, 255)"
+              >
+                <svg
+                  width="24"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  xmlns="http://www.w3.org/2000/svg"
+                  class="svg-class"
+                >
+                  <g id="Education / book">
+                    <path
+                      id="Vector"
+                      d="M18 2H8C6.93913 2 5.92172 2.42143 5.17157 3.17157C4.42143 3.92172 4 4.93913 4 6V18C4 19.0609 4.42143 20.0783 5.17157 20.8284C5.92172 21.5786 6.93913 22 8 22H18C18.5304 22 19.0391 21.7893 19.4142 21.4142C19.7893 21.0391 20 20.5304 20 20V4C20 3.46957 19.7893 2.96086 19.4142 2.58579C19.0391 2.21071 18.5304 2 18 2ZM6 6C6 5.46957 6.21071 4.96086 6.58579 4.58579C6.96086 4.21071 7.46957 4 8 4H18V14H8C7.29504 14.003 6.60399 14.1964 6 14.56V6ZM8 20C7.46957 20 6.96086 19.7893 6.58579 19.4142C6.21071 19.0391 6 18.5304 6 18C6 17.4696 6.21071 16.9609 6.58579 16.5858C6.96086 16.2107 7.46957 16 8 16H18V20H8ZM10 8H14C14.2652 8 14.5196 7.89464 14.7071 7.70711C14.8946 7.51957 15 7.26522 15 7C15 6.73478 14.8946 6.48043 14.7071 6.29289C14.5196 6.10536 14.2652 6 14 6H10C9.73478 6 9.48043 6.10536 9.29289 6.29289C9.10536 6.48043 9 6.73478 9 7C9 7.26522 9.10536 7.51957 9.29289 7.70711C9.48043 7.89464 9.73478 8 10 8Z"
+                    ></path>
+                  </g>
+                </svg>
+                <span>{{ $t("indexHeader.地址簿") }} </span>
+              </div>
+            </div>
+            <div slot="reference" class="popover-i">
+              <div
+                class="svg-container icon-svg recharge"
+                style="fill: rgb(255, 255, 255)"
+              >
+                <svg
+                  width="16"
+                  height="16"
+                  viewBox="0 0 16 16"
+                  xmlns="http://www.w3.org/2000/svg"
+                  class="svg-class"
+                >
+                  <g id="Frame 1171274954">
+                    <g id="wallet_fill">
+                      <path
+                        d="M1 3.5C1 2.67157 1.65979 2 2.47368 2H12.7895C13.6034 2 14.2632 2.67157 14.2632 3.5V4.25H9.8421C7.80737 4.25 6.15789 5.92893 6.15789 8C6.15789 10.0711 7.80737 11.75 9.8421 11.75H14.2632V12.5C14.2632 13.3284 13.6034 14 12.7895 14H2.47368C1.65979 14 1 13.3284 1 12.5V3.5Z"
+                      ></path>
+                      <path
+                        fill-rule="evenodd"
+                        clip-rule="evenodd"
+                        d="M7.63158 8C7.63158 6.75736 8.62126 5.75 9.8421 5.75H13.5263C14.3402 5.75 15 6.42157 15 7.25V8.75C15 9.57843 14.3402 10.25 13.5263 10.25H9.8421C8.62126 10.25 7.63158 9.24264 7.63158 8ZM10.5789 8C10.5789 8.41421 10.2491 8.75 9.8421 8.75C9.43516 8.75 9.10526 8.41421 9.10526 8C9.10526 7.58579 9.43516 7.25 9.8421 7.25C10.2491 7.25 10.5789 7.58579 10.5789 8Z"
+                      ></path>
+                    </g>
+                  </g>
+                </svg>
+              </div>
+            </div>
+          </el-popover>
+        </div>
+
+        <div class="hr-item">
+          <el-popover placement="bottom" width="300" trigger="hover">
+            <div class="userList">
+              <div class="ul-item">
+                {{ account_number }}
+              </div>
+              <div
+                class="ul-item ul-item11"
+                @click="goPages('center')"
+                style="fill: rgb(255, 255, 255)"
+              >
+                <svg
+                  width="24"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  fill="none"
+                  xmlns="http://www.w3.org/2000/svg"
+                  class="svg-class"
+                >
+                  <path
+                    d="M19.63 3.64836C19.5138 3.55438 19.3781 3.48763 19.2327 3.45302C19.0873 3.41841 18.9361 3.41681 18.79 3.44836C17.7214 3.6723 16.6183 3.67515 15.5486 3.45674C14.4789 3.23833 13.4653 2.80327 12.57 2.17836C12.4026 2.06223 12.2037 2 12 2C11.7963 2 11.5974 2.06223 11.43 2.17836C10.5348 2.80327 9.52108 3.23833 8.45137 3.45674C7.38166 3.67515 6.27857 3.6723 5.21001 3.44836C5.06394 3.41681 4.91267 3.41841 4.76731 3.45302C4.62194 3.48763 4.48618 3.55438 4.37001 3.64836C4.25399 3.74247 4.16053 3.86139 4.0965 3.99637C4.03247 4.13135 3.9995 4.27896 4.00001 4.42836V11.8784C3.99912 13.3121 4.34078 14.7253 4.99654 16.0003C5.6523 17.2753 6.60319 18.3752 7.77001 19.2084L11.42 21.8084C11.5894 21.9289 11.7921 21.9937 12 21.9937C12.2079 21.9937 12.4106 21.9289 12.58 21.8084L16.23 19.2084C17.3968 18.3752 18.3477 17.2753 19.0035 16.0003C19.6592 14.7253 20.0009 13.3121 20 11.8784V4.42836C20.0005 4.27896 19.9675 4.13135 19.9035 3.99637C19.8395 3.86139 19.746 3.74247 19.63 3.64836ZM18 11.8784C18.0008 12.9931 17.7353 14.0919 17.2257 15.0834C16.716 16.0748 15.977 16.9302 15.07 17.5784L12 19.7684L8.93001 17.5784C8.02304 16.9302 7.28399 16.0748 6.77435 15.0834C6.26472 14.0919 5.99924 12.9931 6.00001 11.8784V5.57836C8.09643 5.75779 10.196 5.27138 12 4.18836C13.804 5.27138 15.9036 5.75779 18 5.57836V11.8784ZM13.54 9.58836L10.85 12.2884L9.96001 11.3884C9.7717 11.2001 9.51631 11.0943 9.25001 11.0943C8.9837 11.0943 8.72831 11.2001 8.54001 11.3884C8.3517 11.5767 8.24591 11.8321 8.24591 12.0984C8.24591 12.3647 8.3517 12.6201 8.54001 12.8084L10.14 14.4084C10.233 14.5021 10.3436 14.5765 10.4654 14.6272C10.5873 14.678 10.718 14.7042 10.85 14.7042C10.982 14.7042 11.1127 14.678 11.2346 14.6272C11.3564 14.5765 11.467 14.5021 11.56 14.4084L15 10.9984C15.1883 10.8101 15.2941 10.5547 15.2941 10.2884C15.2941 10.0221 15.1883 9.76666 15 9.57836C14.8117 9.39005 14.5563 9.28426 14.29 9.28426C14.0237 9.28426 13.7683 9.39005 13.58 9.57836L13.54 9.58836Z"
+                    fill="#ECECFF"
+                  ></path>
+                </svg>
+                <span>{{ $t("indexHeader.安全中心") }}</span>
+              </div>
+
+              <div
+                class="ul-item ul-item11"
+                @click="goPages('transferLog')"
+                style="fill: rgb(255, 255, 255)"
+              >
+                <svg
+                  width="24"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  xmlns="http://www.w3.org/2000/svg"
+                  class="svg-class"
+                >
+                  <path
+                    d="M19 2H5C4.20435 2 3.44129 2.31607 2.87868 2.87868C2.31607 3.44129 2 4.20435 2 5V19C2 19.7956 2.31607 20.5587 2.87868 21.1213C3.44129 21.6839 4.20435 22 5 22H19C19.7956 22 20.5587 21.6839 21.1213 21.1213C21.6839 20.5587 22 19.7956 22 19V5C22 4.20435 21.6839 3.44129 21.1213 2.87868C20.5587 2.31607 19.7956 2 19 2ZM20 19C20 19.2652 19.8946 19.5196 19.7071 19.7071C19.5196 19.8946 19.2652 20 19 20H5C4.73478 20 4.48043 19.8946 4.29289 19.7071C4.10536 19.5196 4 19.2652 4 19V5C4 4.73478 4.10536 4.48043 4.29289 4.29289C4.48043 4.10536 4.73478 4 5 4H19C19.2652 4 19.5196 4.10536 19.7071 4.29289C19.8946 4.48043 20 4.73478 20 5V19Z"
+                  ></path>
+                  <path
+                    d="M8.09315 15.1611C7.86615 14.9341 7.76446 14.7277 7.78809 14.5419C7.81172 14.3561 7.9387 14.1481 8.16903 13.9178L8.66373 13.4231C8.88883 13.198 9.12697 12.9571 9.37816 12.7005C9.62935 12.4439 9.87534 12.1952 10.1161 11.9544L10.6894 11.3812C10.8883 11.1823 11.0264 11.0037 11.1036 10.8453C11.1809 10.687 11.1439 10.5375 10.9928 10.3968C10.8847 10.2887 10.7589 10.1577 10.6155 10.0039C10.4721 9.85002 10.3437 9.71633 10.2302 9.60283C10.041 9.41367 9.97048 9.24368 10.0186 9.09287C10.0667 8.94206 10.2315 8.85029 10.5128 8.81755C10.7996 8.79022 11.1381 8.75707 11.5284 8.71809C11.9187 8.67912 12.3169 8.64027 12.7232 8.60155C13.1294 8.56283 13.5303 8.52403 13.9259 8.48514C14.3215 8.44625 14.6707 8.4106 14.9733 8.37821C15.2601 8.35088 15.4628 8.394 15.5817 8.50759C15.7005 8.62117 15.7488 8.81341 15.7265 9.08429C15.7096 9.36058 15.6842 9.68593 15.6503 10.0603C15.6164 10.4348 15.5801 10.8224 15.5413 11.2233C15.5025 11.6243 15.4662 12.0199 15.4326 12.4103C15.3989 12.8007 15.3686 13.1499 15.3416 13.4579C15.3097 13.7925 15.2173 14.0011 15.0644 14.0837C14.9115 14.1664 14.7377 14.1104 14.5432 13.9158L14.3405 13.7132C14.2648 13.6375 14.1851 13.5604 14.1015 13.482C14.0178 13.4035 13.9354 13.3264 13.8544 13.2507C13.7735 13.1749 13.7032 13.1073 13.6438 13.0479C13.5034 12.918 13.3764 12.8747 13.2628 12.9181C13.1491 12.9615 13.0242 13.0513 12.8881 13.1874C12.7363 13.3392 12.5388 13.5395 12.2954 13.7882C12.0521 14.0369 11.7969 14.2948 11.5299 14.5618C11.263 14.8288 11.0052 15.0892 10.7566 15.3432C10.508 15.5972 10.3052 15.8027 10.1482 15.9597C10.0801 16.0278 10.0041 16.0931 9.91997 16.1555C9.83587 16.218 9.74345 16.2591 9.64272 16.2788C9.54198 16.2984 9.4355 16.2914 9.32327 16.2577C9.21105 16.224 9.09548 16.1477 8.97657 16.0288C8.83065 15.8829 8.68881 15.7436 8.55108 15.6111C8.41334 15.4786 8.2607 15.3286 8.09315 15.1611Z"
+                  ></path>
+                </svg>
+                <span>{{ $t("indexHeader.身份認證") }}</span>
+              </div>
+              <div
+                class="ul-item ul-item11"
+                @click="goPages('invitation')"
+                style="fill: rgb(255, 255, 255)"
+              >
+                <svg
+                  width="24"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  fill="none"
+                  xmlns="http://www.w3.org/2000/svg"
+                  class="svg-class"
+                >
+                  <path
+                    d="M18.0006 14.0011C17.4098 14.005 16.8272 14.1397 16.2946 14.3956C15.7621 14.6515 15.2929 15.0222 14.9206 15.4811L9.82064 13.1311C10.0604 12.3968 10.0604 11.6053 9.82064 10.8711L14.9206 8.52109C15.5223 9.24706 16.361 9.73717 17.2888 9.90493C18.2166 10.0727 19.1738 9.90732 19.9916 9.43799C20.8093 8.96867 21.435 8.22557 21.7582 7.33983C22.0814 6.4541 22.0813 5.48267 21.7579 4.597C21.4346 3.71132 20.8088 2.96833 19.991 2.49916C19.1731 2.02998 18.2158 1.86478 17.2881 2.03271C16.3603 2.20065 15.5217 2.69091 14.9202 3.41699C14.3187 4.14306 13.993 5.05827 14.0006 6.00109C14.0036 6.23932 14.0271 6.47686 14.0706 6.71109L8.79064 9.14109C8.22772 8.59067 7.51488 8.21861 6.74144 8.07152C5.968 7.92443 5.16836 8.00886 4.44269 8.31422C3.71702 8.61959 3.0976 9.13231 2.66204 9.78815C2.22648 10.444 1.99414 11.2138 1.99414 12.0011C1.99414 12.7884 2.22648 13.5582 2.66204 14.214C3.0976 14.8699 3.71702 15.3826 4.44269 15.688C5.16836 15.9933 5.968 16.0778 6.74144 15.9307C7.51488 15.7836 8.22772 15.4115 8.79064 14.8611L14.0706 17.2911C14.0271 17.5253 14.0036 17.7629 14.0006 18.0011C14.0006 18.7922 14.2352 19.5656 14.6748 20.2234C15.1143 20.8812 15.739 21.3939 16.4699 21.6966C17.2008 21.9994 18.0051 22.0786 18.781 21.9242C19.5569 21.7699 20.2697 21.3889 20.8291 20.8295C21.3885 20.2701 21.7694 19.5574 21.9238 18.7815C22.0781 18.0055 21.9989 17.2013 21.6962 16.4704C21.3934 15.7395 20.8807 15.1147 20.2229 14.6752C19.5651 14.2357 18.7918 14.0011 18.0006 14.0011ZM18.0006 4.00109C18.3962 4.00109 18.7829 4.11839 19.1118 4.33815C19.4407 4.55791 19.697 4.87027 19.8484 5.23572C19.9998 5.60118 20.0394 6.00331 19.9622 6.39127C19.885 6.77923 19.6946 7.1356 19.4149 7.4153C19.1351 7.69501 18.7788 7.88549 18.3908 7.96266C18.0029 8.03983 17.6007 8.00023 17.2353 7.84885C16.8698 7.69747 16.5575 7.44113 16.3377 7.11223C16.1179 6.78333 16.0006 6.39665 16.0006 6.00109C16.0006 5.47066 16.2114 4.96195 16.5864 4.58688C16.9615 4.2118 17.4702 4.00109 18.0006 4.00109ZM6.00064 14.0011C5.60508 14.0011 5.2184 13.8838 4.8895 13.664C4.5606 13.4443 4.30425 13.1319 4.15288 12.7665C4.0015 12.401 3.9619 11.9989 4.03907 11.6109C4.11624 11.2229 4.30672 10.8666 4.58642 10.5869C4.86613 10.3072 5.2225 10.1167 5.61046 10.0395C5.99842 9.96235 6.40055 10.002 6.76601 10.1533C7.13146 10.3047 7.44381 10.5611 7.66358 10.89C7.88334 11.2188 8.00064 11.6055 8.00064 12.0011C8.00064 12.5315 7.78993 13.0402 7.41485 13.4153C7.03978 13.7904 6.53107 14.0011 6.00064 14.0011ZM18.0006 20.0011C17.6051 20.0011 17.2184 19.8838 16.8895 19.664C16.5606 19.4443 16.3043 19.1319 16.1529 18.7665C16.0015 18.401 15.9619 17.9989 16.0391 17.6109C16.1162 17.2229 16.3067 16.8666 16.5864 16.5869C16.8661 16.3072 17.2225 16.1167 17.6105 16.0395C17.9984 15.9623 18.4006 16.002 18.766 16.1533C19.1315 16.3047 19.4438 16.5611 19.6636 16.8899C19.8833 17.2188 20.0006 17.6055 20.0006 18.0011C20.0006 18.5315 19.7899 19.0402 19.4149 19.4153C19.0398 19.7904 18.5311 20.0011 18.0006 20.0011Z"
+                    fill="#ECECFF"
+                  ></path>
+                </svg>
+                <span>{{ $t("indexHeader.分享好友") }}</span>
+              </div>
+              <div
+                class="ul-item ul-item11"
+                @click="loginOut"
+                style="fill: rgb(255, 255, 255)"
+              >
+                <svg
+                  width="24"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  fill="none"
+                  xmlns="http://www.w3.org/2000/svg"
+                  class="svg-class"
+                >
+                  <path
+                    d="M4 12C4 12.2652 4.10536 12.5196 4.29289 12.7071C4.48043 12.8946 4.73478 13 5 13H12.59L10.29 15.29C10.1963 15.383 10.1219 15.4936 10.0711 15.6154C10.0203 15.7373 9.9942 15.868 9.9942 16C9.9942 16.132 10.0203 16.2627 10.0711 16.3846C10.1219 16.5064 10.1963 16.617 10.29 16.71C10.383 16.8037 10.4936 16.8781 10.6154 16.9289C10.7373 16.9797 10.868 17.0058 11 17.0058C11.132 17.0058 11.2627 16.9797 11.3846 16.9289C11.5064 16.8781 11.617 16.8037 11.71 16.71L15.71 12.71C15.801 12.6149 15.8724 12.5028 15.92 12.38C16.02 12.1365 16.02 11.8635 15.92 11.62C15.8724 11.4972 15.801 11.3851 15.71 11.29L11.71 7.29C11.6168 7.19676 11.5061 7.1228 11.3842 7.07234C11.2624 7.02188 11.1319 6.99591 11 6.99591C10.8681 6.99591 10.7376 7.02188 10.6158 7.07234C10.4939 7.1228 10.3832 7.19676 10.29 7.29C10.1968 7.38324 10.1228 7.49393 10.0723 7.61575C10.0219 7.73757 9.99591 7.86814 9.99591 8C9.99591 8.13186 10.0219 8.26243 10.0723 8.38425C10.1228 8.50607 10.1968 8.61676 10.29 8.71L12.59 11H5C4.73478 11 4.48043 11.1054 4.29289 11.2929C4.10536 11.4804 4 11.7348 4 12ZM17 2H7C6.20435 2 5.44129 2.31607 4.87868 2.87868C4.31607 3.44129 4 4.20435 4 5V8C4 8.26522 4.10536 8.51957 4.29289 8.70711C4.48043 8.89464 4.73478 9 5 9C5.26522 9 5.51957 8.89464 5.70711 8.70711C5.89464 8.51957 6 8.26522 6 8V5C6 4.73478 6.10536 4.48043 6.29289 4.29289C6.48043 4.10536 6.73478 4 7 4H17C17.2652 4 17.5196 4.10536 17.7071 4.29289C17.8946 4.48043 18 4.73478 18 5V19C18 19.2652 17.8946 19.5196 17.7071 19.7071C17.5196 19.8946 17.2652 20 17 20H7C6.73478 20 6.48043 19.8946 6.29289 19.7071C6.10536 19.5196 6 19.2652 6 19V16C6 15.7348 5.89464 15.4804 5.70711 15.2929C5.51957 15.1054 5.26522 15 5 15C4.73478 15 4.48043 15.1054 4.29289 15.2929C4.10536 15.4804 4 15.7348 4 16V19C4 19.7956 4.31607 20.5587 4.87868 21.1213C5.44129 21.6839 6.20435 22 7 22H17C17.7956 22 18.5587 21.6839 19.1213 21.1213C19.6839 20.5587 20 19.7956 20 19V5C20 4.20435 19.6839 3.44129 19.1213 2.87868C18.5587 2.31607 17.7956 2 17 2Z"
+                    fill="#ECECFF"
+                  ></path>
+                </svg>
+                <span>{{ $t("indexHeader.退出登錄") }}</span>
+              </div>
+            </div>
+            <div slot="reference" class="popover-i">
+              <div
+                class="svg-container icon-svg recharge"
+                style="fill: rgb(255, 255, 255)"
+              >
+                <svg
+                  width="16"
+                  height="16"
+                  viewBox="0 0 16 16"
+                  xmlns="http://www.w3.org/2000/svg"
+                  class="svg-class"
+                >
+                  <g id="Frame" clip-path="url(#clip0_17736_13110)">
+                    <path
+                      id="Vector"
+                      d="M4.11778 5.41116C4.25056 5.97351 4.49281 6.5042 4.83069 6.97293C5.16857 7.44166 5.59547 7.83925 6.08701 8.143C6.57855 8.44675 7.1251 8.6507 7.69546 8.74323C8.26582 8.83575 8.84883 8.81502 9.41118 8.68224C9.97353 8.54945 10.5042 8.3072 10.973 7.96931C11.4417 7.63143 11.8393 7.20453 12.143 6.71299C12.4468 6.22145 12.6507 5.6749 12.7432 5.10454C12.8358 4.53418 12.815 3.95119 12.6822 3.38884C12.5494 2.82649 12.3072 2.2958 11.9693 1.82707C11.6314 1.35834 11.2045 0.960749 10.713 0.657002C10.2215 0.353254 9.6749 0.149296 9.10454 0.0567736C8.53417 -0.0357488 7.95117 -0.0150238 7.38882 0.117765C6.82647 0.250553 6.29577 0.492805 5.82705 0.830689C5.35832 1.16857 4.96073 1.59547 4.65698 2.08701C4.35324 2.57855 4.14928 3.1251 4.05677 3.69546C3.96425 4.26582 3.98498 4.84882 4.11778 5.41116Z"
+                    ></path>
+                    <path
+                      id="Vector_2"
+                      d="M10.8942 9.59961H5.10583C2.28605 9.59961 0 11.6591 0 14.2021V15.661C0 15.8484 0.167675 15.9996 0.375498 15.9996H15.6245C15.8323 15.9996 16 15.8484 16 15.661V14.2021C16 11.6591 13.7139 9.59961 10.8942 9.59961Z"
+                    ></path>
+                  </g>
+                  <defs>
+                    <clipPath id="clip0_17736_13110">
+                      <rect width="16" height="16"></rect>
+                    </clipPath>
+                  </defs>
+                </svg>
+              </div>
+            </div>
+          </el-popover>
+        </div>
+      </template>
+
+      <div class="hr-item" v-if="false">
+        <el-popover placement="bottom" width="300" trigger="hover">
+          <div class="userList">
+            <div class="ul-item">
+              {{ account_number }}
+            </div>
+            <div class="ul-item" @click="goPages('change')">{{ $t("zjde44") }}</div>
+            <div class="ul-item" @click="goPages('invitation')">{{ $t("zjde45") }}</div>
+            <div class="ul-item" @click="goPages('UOrder')">{{ $t("zjde46") }}</div>
+            <div class="ul-item" @click="goPages('transferLog')">{{ $t("zjde47") }}</div>
+            <div class="ul-item" @click="goPages('credit')">{{ $t("zjde48") }}</div>
+            <div class="ul-item ul-item2">
+              <div class="text-box" @click="secondaryShow = !secondaryShow">
+                <span class="text"> {{ $t("zjde49") }}</span>
+                <i class="el-icon-arrow-down"></i>
+              </div>
+              <div class="menu-box colorfs" v-show="secondaryShow">
+                <div class="mb-item" @click="goPages('modifyPassword')">
+                  {{ $t("zjde50") }}
+                </div>
+                <div class="mb-item" @click="goPages('setTransactionPassword')">
+                  {{ $t("zjde51") }}
+                </div>
+              </div>
+            </div>
+            <div class="ul-item" @click="loginOut">{{ $t("zjde52") }}</div>
+            <div class="ul-item" @click="loginOut">{{ $t("zjde53") }}</div>
+          </div>
+          <div slot="reference" class="popover-i">
+            <img class="hi-icon" src="../assets/tx.png" />
+            <span> {{ $t("zjde54") }}</span>
+          </div>
+        </el-popover>
+      </div>
+
+      <div class="cd" @click="kefu">
+        <svg
+          width="16"
+          height="16"
+          viewBox="0 0 16 16"
+          xmlns="http://www.w3.org/2000/svg"
+          class="svg-class"
+        >
+          <g id="Vector">
+            <path
+              d="M14.5218 5.72703C14.2979 2.53356 11.4782 0 8.04314 0C4.6225 0 1.81305 2.51177 1.56754 5.68541C0.64715 6.06391 0.00102724 6.94476 0.00102724 7.96928V10.5167C0.00102724 11.8851 1.15562 12.9988 2.57422 12.9988H3.56549C4.08012 12.9988 4.49718 12.5965 4.49718 12.1001V6.38593C4.49718 5.88952 4.08012 5.48724 3.56549 5.48724H3.46379C3.79969 3.40154 5.7247 1.79737 8.04314 1.79737C10.3616 1.79737 12.2876 3.40154 12.6225 5.48724H12.4355C11.9209 5.48724 11.5039 5.88952 11.5039 6.38593V12.1001C11.5039 12.4251 11.6836 12.7094 11.9517 12.867C11.3436 13.4367 10.3749 14.0877 9.00873 14.274C8.83828 14.1517 8.63152 14.0857 8.41911 14.0857H7.74011C7.19158 14.0857 6.74782 14.5147 6.74782 15.0429C6.74782 15.572 7.1926 16 7.74011 16H8.41911C8.71289 16 8.97689 15.8761 9.15871 15.68C11.7576 15.353 13.2378 13.7122 13.7822 12.973C15.0334 12.8056 16 11.7691 16 10.5177V7.96928C15.999 6.97845 15.3929 6.12435 14.5218 5.72703Z"
+            ></path>
+            <path
+              d="M15.9178 7.35596C15.8232 7.00233 15.649 6.6731 15.4078 6.39161C15.1666 6.11011 14.8641 5.88322 14.5218 5.72703C14.2979 2.53356 11.4782 0 8.04314 0C4.6225 0 1.81305 2.51177 1.56754 5.68541C0.64715 6.06391 0.00102724 6.94476 0.00102724 7.96928V10.5167C0.00102724 11.8851 1.15562 12.9988 2.57422 12.9988H3.56549C4.08012 12.9988 4.49718 12.5965 4.49718 12.1001V6.38593C4.49718 5.88952 4.08012 5.48724 3.56549 5.48724H3.46379C3.79969 3.40154 5.7247 1.79737 8.04314 1.79737C10.3616 1.79737 12.2876 3.40154 12.6225 5.48724H12.4355C11.9209 5.48724 11.5039 5.88952 11.5039 6.38593V12.1001C11.5039 12.218 11.5285 12.3299 11.5706 12.433C13.4936 11.2014 15.019 9.43572 15.9178 7.35596Z"
+            ></path>
+            <path
+              d="M8.04212 0C4.62147 0 1.81202 2.51177 1.56651 5.68541C0.646122 6.06391 0 6.94476 0 7.96928V10.1511C0.615306 10.2472 1.24705 10.2977 1.89009 10.2977C2.78582 10.2977 3.65794 10.2006 4.49615 10.0163V6.38593C4.49615 5.88952 4.0791 5.48724 3.56446 5.48724H3.46276C3.79867 3.40154 5.72368 1.79737 8.04212 1.79737C9.89728 1.79737 11.4997 2.82487 12.2383 4.3032C12.5896 3.66708 12.8803 2.99529 13.1022 2.29477C11.9117 0.896706 10.0863 0 8.04212 0Z"
+            ></path>
+            <path
+              d="M8.04212 1.79737C8.12738 1.79737 8.21161 1.80035 8.29584 1.80431C8.70673 1.28115 9.07139 0.722319 9.38367 0.132772C8.94232 0.0446647 8.49282 0.00017744 8.04212 0C4.62147 0 1.81202 2.51177 1.56651 5.68541C1.29301 5.79814 1.04203 5.95607 0.824859 6.15209C1.74936 6.00842 2.63688 5.76071 3.47509 5.42086C3.84078 3.36785 5.74936 1.79737 8.04212 1.79737Z"
+            ></path>
+          </g>
+        </svg>
+      </div>
+
+      <div class="cd">
+        <svg
+          width="16"
+          height="16"
+          viewBox="0 0 16 16"
+          xmlns="http://www.w3.org/2000/svg"
+          class="svg-class"
+        >
+          <g id="Frame" clip-path="url(#clip0_16986_10702)">
+            <path
+              id="Vector"
+              d="M9.47195 13.8119C9.62875 14.0304 9.71955 14.288 9.71955 14.5643C9.71955 15.3573 8.97035 16 8.04674 16C7.12274 16 6.37394 15.3573 6.37394 14.5639C6.37394 14.3188 6.44514 14.0878 6.57154 13.8864L6.62154 13.8123H9.47195V13.8119ZM12.9516 4.28411V7.01894C13.0212 7.90791 13.7876 9.20704 14.6244 9.75416C15.6004 10.4379 15.2516 12.5573 14.206 12.6942H2.00832C0.728321 12.5128 0.30992 10.5986 1.52032 9.75416C2.38273 9.17152 2.82913 8.22323 2.98433 7.01894V4.28411C4.02993 -1.66475 12.4636 -1.18632 12.9516 4.28411ZM9.99995 6.24392H5.99994C5.89385 6.24392 5.79211 6.28503 5.71709 6.35822C5.64208 6.4314 5.59994 6.53066 5.59994 6.63416C5.59994 6.73766 5.64208 6.83692 5.71709 6.9101C5.79211 6.98329 5.89385 7.0244 5.99994 7.0244H9.99995C10.106 7.0244 10.2078 6.98329 10.2828 6.9101C10.3578 6.83692 10.4 6.73766 10.4 6.63416C10.4 6.53066 10.3578 6.4314 10.2828 6.35822C10.2078 6.28503 10.106 6.24392 9.99995 6.24392Z"
+            ></path>
+            <circle id="Ellipse 2410" cx="13" cy="13" r="3"></circle>
+          </g>
+          <defs>
+            <clipPath id="clip0_16986_10702">
+              <rect width="16" height="16"></rect>
+            </clipPath>
+          </defs>
+        </svg>
+      </div>
+
+      <div class="cd" @click="goPages('activityIndex')">
+        <svg
+          width="16"
+          height="16"
+          viewBox="0 0 16 16"
+          xmlns="http://www.w3.org/2000/svg"
+          class="svg-class"
+        >
+          <path
+            id="Vector"
+            d="M8.819 9.59912L14.4042 9.59992V13.6C14.4043 14.2121 14.171 14.8012 13.7521 15.2466C13.3333 15.692 12.7605 15.9601 12.151 15.996L12.0106 16H8.819V9.59912ZM7.22322 9.59992V16H4.03166C3.42111 16 2.83362 15.7661 2.3894 15.3462C1.94517 14.9262 1.6778 14.3519 1.64198 13.7408L1.63799 13.6V9.59992H7.22322ZM12.9281 0.598203C13.9079 1.46461 13.793 2.58143 13.1053 3.59024H13.6055C14.2158 3.58976 14.8031 3.82306 15.2475 4.24242C15.6918 4.66178 15.9596 5.23551 15.996 5.84627L16 5.98787L15.996 6.13027C15.9616 6.71715 15.7136 7.27097 15.299 7.68668C14.8844 8.10238 14.3321 8.35104 13.7468 8.3855L13.6063 8.3895H2.4303C1.80189 8.40064 1.19443 8.16294 0.739674 7.72795C0.284914 7.29296 0.0195143 6.69576 0.00103374 6.06585C-0.0174468 5.43595 0.212481 4.82413 0.640953 4.36309C1.06942 3.90205 1.66189 3.62896 2.28987 3.60304L2.4303 3.59904H2.94733C2.24678 2.57903 2.1263 1.46701 3.11409 0.596603C3.80267 -0.0130048 4.83753 -0.151406 5.89314 0.167798C6.76842 0.459801 7.50567 0.979008 8.0235 1.64142C8.54213 0.979008 9.28337 0.458201 10.1674 0.161398C11.2015 -0.150606 12.2244 -0.0130047 12.9281 0.598203ZM4.1673 1.79822C3.8673 2.06222 4.14496 2.72783 4.90375 3.40064C4.96755 3.45695 5.02196 3.52312 5.06493 3.59664L7.20726 3.59504L7.20487 3.57904C7.04848 2.74303 6.37027 2.01342 5.40962 1.69342C4.86545 1.52861 4.40108 1.59102 4.1673 1.79742V1.79822ZM10.6502 1.68622C9.66875 2.01582 8.98895 2.75183 8.83416 3.59424L10.9757 3.59184C11.0197 3.51745 11.0755 3.45071 11.1409 3.39424C11.8941 2.74223 12.1749 2.06622 11.8765 1.80222C11.6316 1.58942 11.1744 1.52781 10.6502 1.68622Z"
+          ></path>
+        </svg>
+      </div>
+      <div class="cd" @click="srShow = !srShow">
+        <img v-if="regular" src="../assets/cd1.png" />
+        <img v-else src="../assets/cd2.png" />
+      </div>
+
+      <div class="hr-item2 hr-item"></div>
+
+      <div class="hr-item" @click="kefu">
+        <svg
+          width="16"
+          height="16"
+          viewBox="0 0 16 16"
+          xmlns="http://www.w3.org/2000/svg"
+          class="svg-class"
+        >
+          <g id="Vector">
+            <path
+              d="M14.5218 5.72703C14.2979 2.53356 11.4782 0 8.04314 0C4.6225 0 1.81305 2.51177 1.56754 5.68541C0.64715 6.06391 0.00102724 6.94476 0.00102724 7.96928V10.5167C0.00102724 11.8851 1.15562 12.9988 2.57422 12.9988H3.56549C4.08012 12.9988 4.49718 12.5965 4.49718 12.1001V6.38593C4.49718 5.88952 4.08012 5.48724 3.56549 5.48724H3.46379C3.79969 3.40154 5.7247 1.79737 8.04314 1.79737C10.3616 1.79737 12.2876 3.40154 12.6225 5.48724H12.4355C11.9209 5.48724 11.5039 5.88952 11.5039 6.38593V12.1001C11.5039 12.4251 11.6836 12.7094 11.9517 12.867C11.3436 13.4367 10.3749 14.0877 9.00873 14.274C8.83828 14.1517 8.63152 14.0857 8.41911 14.0857H7.74011C7.19158 14.0857 6.74782 14.5147 6.74782 15.0429C6.74782 15.572 7.1926 16 7.74011 16H8.41911C8.71289 16 8.97689 15.8761 9.15871 15.68C11.7576 15.353 13.2378 13.7122 13.7822 12.973C15.0334 12.8056 16 11.7691 16 10.5177V7.96928C15.999 6.97845 15.3929 6.12435 14.5218 5.72703Z"
+            ></path>
+            <path
+              d="M15.9178 7.35596C15.8232 7.00233 15.649 6.6731 15.4078 6.39161C15.1666 6.11011 14.8641 5.88322 14.5218 5.72703C14.2979 2.53356 11.4782 0 8.04314 0C4.6225 0 1.81305 2.51177 1.56754 5.68541C0.64715 6.06391 0.00102724 6.94476 0.00102724 7.96928V10.5167C0.00102724 11.8851 1.15562 12.9988 2.57422 12.9988H3.56549C4.08012 12.9988 4.49718 12.5965 4.49718 12.1001V6.38593C4.49718 5.88952 4.08012 5.48724 3.56549 5.48724H3.46379C3.79969 3.40154 5.7247 1.79737 8.04314 1.79737C10.3616 1.79737 12.2876 3.40154 12.6225 5.48724H12.4355C11.9209 5.48724 11.5039 5.88952 11.5039 6.38593V12.1001C11.5039 12.218 11.5285 12.3299 11.5706 12.433C13.4936 11.2014 15.019 9.43572 15.9178 7.35596Z"
+            ></path>
+            <path
+              d="M8.04212 0C4.62147 0 1.81202 2.51177 1.56651 5.68541C0.646122 6.06391 0 6.94476 0 7.96928V10.1511C0.615306 10.2472 1.24705 10.2977 1.89009 10.2977C2.78582 10.2977 3.65794 10.2006 4.49615 10.0163V6.38593C4.49615 5.88952 4.0791 5.48724 3.56446 5.48724H3.46276C3.79867 3.40154 5.72368 1.79737 8.04212 1.79737C9.89728 1.79737 11.4997 2.82487 12.2383 4.3032C12.5896 3.66708 12.8803 2.99529 13.1022 2.29477C11.9117 0.896706 10.0863 0 8.04212 0Z"
+            ></path>
+            <path
+              d="M8.04212 1.79737C8.12738 1.79737 8.21161 1.80035 8.29584 1.80431C8.70673 1.28115 9.07139 0.722319 9.38367 0.132772C8.94232 0.0446647 8.49282 0.00017744 8.04212 0C4.62147 0 1.81202 2.51177 1.56651 5.68541C1.29301 5.79814 1.04203 5.95607 0.824859 6.15209C1.74936 6.00842 2.63688 5.76071 3.47509 5.42086C3.84078 3.36785 5.74936 1.79737 8.04212 1.79737Z"
+            ></path>
+          </g>
+        </svg>
+      </div>
+
+      <div class="hr-item">
+        <svg
+          width="16"
+          height="16"
+          viewBox="0 0 16 16"
+          xmlns="http://www.w3.org/2000/svg"
+          class="svg-class"
+        >
+          <g id="Frame" clip-path="url(#clip0_17736_13082)">
+            <path
+              id="Vector"
+              d="M9.47189 13.8119C9.62869 14.0304 9.71949 14.288 9.71949 14.5643C9.71949 15.3573 8.97029 16 8.04668 16C7.12268 16 6.37388 15.3573 6.37388 14.5639C6.37388 14.3188 6.44508 14.0878 6.57148 13.8864L6.62148 13.8123H9.47189V13.8119ZM12.9515 4.28411V7.01894C13.0211 7.90791 13.7875 9.20704 14.6243 9.75416C15.6003 10.4379 15.2515 12.5573 14.2059 12.6942H2.00826C0.72826 12.5128 0.309859 10.5986 1.52026 9.75416C2.38267 9.17152 2.82907 8.22323 2.98427 7.01894V4.28411C4.02987 -1.66475 12.4635 -1.18632 12.9515 4.28411ZM9.99989 6.24392H5.99988C5.89379 6.24392 5.79205 6.28503 5.71703 6.35822C5.64202 6.4314 5.59988 6.53066 5.59988 6.63416C5.59988 6.73766 5.64202 6.83692 5.71703 6.9101C5.79205 6.98329 5.89379 7.0244 5.99988 7.0244H9.99989C10.106 7.0244 10.2077 6.98329 10.2827 6.9101C10.3577 6.83692 10.3999 6.73766 10.3999 6.63416C10.3999 6.53066 10.3577 6.4314 10.2827 6.35822C10.2077 6.28503 10.106 6.24392 9.99989 6.24392Z"
+            ></path>
+          </g>
+          <defs>
+            <clipPath id="clip0_17736_13082">
+              <rect width="16" height="16"></rect>
+            </clipPath>
+          </defs>
+        </svg>
+      </div>
+      <div class="hr-item">
+        <el-popover placement="bottom" trigger="click">
+          <div class="langue-popover">
+            <div class="lp-item">
+              <!-- <div class="li-h"> {{$t('zjde55')}}</div> -->
+              <div class="li-cn">
+                <div
+                  class="iv-item"
+                  v-for="(item, index) in langList"
+                  :key="index"
+                  @click="set_lang(item.src, item.text, item.lang)"
+                >
+                  <!-- <img class="ii-icon" :src="require(`../assets/lang${index+1}.png`)"> -->
+                  <img class="ii-icon" :src="item.src" />
+                  <span class="ii-text">{{ item.text }}</span>
+                  <div class="xz">
+                    <i
+                      v-if="langObj.lang == item.lang"
+                      class="el-icon-check"
+                      style="color: #f29807; font-size: 25px"
+                    ></i>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <!-- <div class="lp-item lp-item2">
+							<div class="li-h"> {{$t('zjde56')}}</div>
+							<div class="li-cn">
+								<div class="iv-item" v-for="(item,index) in currencyList" :key="index"
+									@click="huilv(item)">
+									<span style="margin-right: .5rem;">{{item.symbol}}</span>
+									<span class="ii-text">{{item.text}}</span>
+									<div class="xz">
+										<i v-if="hlObj.type==item.type" class="el-icon-check"
+											style="color: #f29807; font-size: 25px;"></i>
+									</div>
+								</div>
+							</div>
+						</div> -->
+          </div>
+          <div slot="reference" class="popover-i">
+            <!-- <img style="width: 24px; margin-right: 10px;" :src="langObj.src" />
+						<span>{{langObj.text}}</span> -->
+
+            <svg
+              width="16"
+              height="16"
+              viewBox="0 0 16 16"
+              xmlns="http://www.w3.org/2000/svg"
+              class="svg-class"
+            >
+              <g id="Frame" clip-path="url(#clip0_17736_13116)">
+                <path
+                  id="Vector"
+                  d="M8 0C12.4182 0 16 3.58182 16 8C16 12.4182 12.4182 16 8 16C3.58182 16 0 12.4182 0 8C0 3.58182 3.58182 0 8 0ZM8 1.45455C7.14044 1.45455 6.28929 1.62385 5.49516 1.95279C4.70103 2.28173 3.97947 2.76386 3.37166 3.37166C2.76386 3.97947 2.28173 4.70103 1.95279 5.49516C1.62385 6.28929 1.45455 7.14044 1.45455 8C1.45455 8.85956 1.62385 9.71071 1.95279 10.5048C2.28173 11.299 2.76386 12.0205 3.37166 12.6283C3.97947 13.2361 4.70103 13.7183 5.49516 14.0472C6.28929 14.3762 7.14044 14.5455 8 14.5455C9.73596 14.5455 11.4008 13.8558 12.6283 12.6283C13.8558 11.4008 14.5455 9.73596 14.5455 8C14.5455 6.26404 13.8558 4.59918 12.6283 3.37166C11.4008 2.14415 9.73596 1.45455 8 1.45455Z"
+                ></path>
+                <path
+                  id="Vector_2"
+                  d="M8.00001 0C10.424 2.38764 11.6364 5.05455 11.6364 8C11.6364 10.9455 10.424 13.6124 8.00001 16C5.57601 13.6124 4.36365 10.9455 4.36365 8C4.36365 5.05455 5.57601 2.38764 8.00001 0ZM8.00001 2.15564L7.82401 2.37818C6.47565 4.12291 5.81819 5.98546 5.81819 8C5.81819 10.0145 6.47565 11.8771 7.82401 13.6218L8.00001 13.8436L8.17601 13.6218C9.46547 11.9527 10.1236 10.1753 10.1782 8.26182L10.1818 8C10.1818 5.98618 9.52437 4.12291 8.17601 2.37818L8.00001 2.15564Z"
+                ></path>
+                <path
+                  id="Vector_3"
+                  d="M0.727295 7.27246H15.2728V8.72701H0.727295V7.27246Z"
+                ></path>
+              </g>
+              <defs>
+                <clipPath id="clip0_17736_13116">
+                  <rect width="16" height="16"></rect>
+                </clipPath>
+              </defs>
+            </svg>
+          </div>
+        </el-popover>
+      </div>
+    </div>
+
+    <div class="sidebar" :class="{ srShow: srShow }">
+      <div class="sr-head">
+        <template v-if="account_number.length <= 0">
+          <div @click="goPages('login')" class="sh-item dl">
+            {{ $t("indexHeader.log_in") }}
+          </div>
+          <div @click="goPages('register')" class="sh-item">
+            {{ $t("indexHeader.sign_up") }}
+          </div>
+        </template>
+        <img
+          class="logo"
+          style="height: 30px; width: auto"
+          :src="$utils.isBaseUrl(siteConfig.site_logo)"
+        />
+        <!-- <div v-else style="color: #fff;"> {{account_number}}</div> -->
+        <i class="el-icon-close csds" @click="srShow = !srShow"></i>
+      </div>
+
+      <div class="tel-nav">
+        <div class="tn-item" v-if="account_number.length > 0">
+          <span class="tm-title">
+            {{ account_number }}
+          </span>
+        </div>
+
+        <a href="#/" class="tn-item">
+          <p class="tm-title">
+            <svg
+              width="16"
+              height="16"
+              viewBox="0 0 16 16"
+              xmlns="http://www.w3.org/2000/svg"
+              class="svg-class"
+            >
+              <g id="Frame 1171274954">
+                <path
+                  id="Union"
+                  d="M8.93333 1.29867C8.38025 0.900445 7.61975 0.900444 7.06667 1.29867L1.62222 5.21867C1.23052 5.50069 1 5.9433 1 6.41333V13.5067C1 14.3314 1.69645 15 2.55556 15H5.58889C6.0614 15 6.44444 14.6323 6.44444 14.1787V10.52C6.44444 9.69526 7.14089 9.02667 8 9.02667C8.85911 9.02667 9.55556 9.69526 9.55556 10.52V14.1787C9.55556 14.6323 9.9386 15 10.4111 15H13.4444C14.3036 15 15 14.3314 15 13.5067V6.41333C15 5.9433 14.7695 5.50069 14.3778 5.21867L8.93333 1.29867Z"
+                ></path>
+              </g>
+            </svg>
+            <span>
+              {{ $t("indexHeader.首頁") }}
+            </span>
+          </p>
+        </a>
+        <div class="tn-item" @click="goPages('deposit')">
+          <p class="tm-title">
+            <svg
+              width="16"
+              height="16"
+              viewBox="0 0 16 16"
+              xmlns="http://www.w3.org/2000/svg"
+              class="svg-class"
+            >
+              <g id="Frame 1171274954">
+                <g id="wallet_fill">
+                  <path
+                    d="M1 3.5C1 2.67157 1.65979 2 2.47368 2H12.7895C13.6034 2 14.2632 2.67157 14.2632 3.5V4.25H9.8421C7.80737 4.25 6.15789 5.92893 6.15789 8C6.15789 10.0711 7.80737 11.75 9.8421 11.75H14.2632V12.5C14.2632 13.3284 13.6034 14 12.7895 14H2.47368C1.65979 14 1 13.3284 1 12.5V3.5Z"
+                  ></path>
+                  <path
+                    fill-rule="evenodd"
+                    clip-rule="evenodd"
+                    d="M7.63158 8C7.63158 6.75736 8.62126 5.75 9.8421 5.75H13.5263C14.3402 5.75 15 6.42157 15 7.25V8.75C15 9.57843 14.3402 10.25 13.5263 10.25H9.8421C8.62126 10.25 7.63158 9.24264 7.63158 8ZM10.5789 8C10.5789 8.41421 10.2491 8.75 9.8421 8.75C9.43516 8.75 9.10526 8.41421 9.10526 8C9.10526 7.58579 9.43516 7.25 9.8421 7.25C10.2491 7.25 10.5789 7.58579 10.5789 8Z"
+                  ></path>
+                </g>
+              </g>
+            </svg>
+            <span>
+              {{ $t("indexHeader.充值") }}
+            </span>
+          </p>
+        </div>
+        <div class="tn-item" @click="srShow2 = true">
+          <p class="tm-title">
+            <svg
+              width="16"
+              height="16"
+              viewBox="0 0 16 16"
+              xmlns="http://www.w3.org/2000/svg"
+              class="svg-class"
+            >
+              <g id="Frame" clip-path="url(#clip0_17736_13116)">
+                <path
+                  id="Vector"
+                  d="M8 0C12.4182 0 16 3.58182 16 8C16 12.4182 12.4182 16 8 16C3.58182 16 0 12.4182 0 8C0 3.58182 3.58182 0 8 0ZM8 1.45455C7.14044 1.45455 6.28929 1.62385 5.49516 1.95279C4.70103 2.28173 3.97947 2.76386 3.37166 3.37166C2.76386 3.97947 2.28173 4.70103 1.95279 5.49516C1.62385 6.28929 1.45455 7.14044 1.45455 8C1.45455 8.85956 1.62385 9.71071 1.95279 10.5048C2.28173 11.299 2.76386 12.0205 3.37166 12.6283C3.97947 13.2361 4.70103 13.7183 5.49516 14.0472C6.28929 14.3762 7.14044 14.5455 8 14.5455C9.73596 14.5455 11.4008 13.8558 12.6283 12.6283C13.8558 11.4008 14.5455 9.73596 14.5455 8C14.5455 6.26404 13.8558 4.59918 12.6283 3.37166C11.4008 2.14415 9.73596 1.45455 8 1.45455Z"
+                ></path>
+                <path
+                  id="Vector_2"
+                  d="M8.00001 0C10.424 2.38764 11.6364 5.05455 11.6364 8C11.6364 10.9455 10.424 13.6124 8.00001 16C5.57601 13.6124 4.36365 10.9455 4.36365 8C4.36365 5.05455 5.57601 2.38764 8.00001 0ZM8.00001 2.15564L7.82401 2.37818C6.47565 4.12291 5.81819 5.98546 5.81819 8C5.81819 10.0145 6.47565 11.8771 7.82401 13.6218L8.00001 13.8436L8.17601 13.6218C9.46547 11.9527 10.1236 10.1753 10.1782 8.26182L10.1818 8C10.1818 5.98618 9.52437 4.12291 8.17601 2.37818L8.00001 2.15564Z"
+                ></path>
+                <path
+                  id="Vector_3"
+                  d="M0.727295 7.27246H15.2728V8.72701H0.727295V7.27246Z"
+                ></path>
+              </g>
+              <defs>
+                <clipPath id="clip0_17736_13116">
+                  <rect width="16" height="16"></rect>
+                </clipPath>
+              </defs>
+            </svg>
+            <span>
+              {{ langObj.text }}
+            </span>
+          </p>
+          <img style="width: 28px" :src="langObj.src" />
+        </div>
+        <div class="tn-item" @click="goPages('aiIndex')">
+          <p class="tm-title">
+            <svg
+              width="16"
+              height="16"
+              viewBox="0 0 16 16"
+              xmlns="http://www.w3.org/2000/svg"
+              class="svg-class"
+            >
+              <g id="Frame">
+                <path
+                  id="Vector"
+                  d="M13.486 12.89L13.082 12.29L14.295 11.588V4.365L10.665 2.258L11.013 1.658L15 3.963V11.991L13.486 12.89ZM1.706 8.72H1V4.01L8.146 0L9.754 0.9L9.396 1.555L8.136 0.805L1.706 4.412V8.722V8.72ZM7.995 16L1 12.037V10.08H1.705V11.635L7.995 15.195L12.075 12.89L12.433 13.49L7.995 16ZM7.543 4.665L5.983 3.756V3.204L8.051 1.995L10.063 3.204V3.756L8.549 4.656L8.502 5.208L8.051 4.908L7.543 5.208V4.665ZM10.721 8.272V6.473L9.161 5.573V5.021L11.172 3.869L13.241 5.021V7.381L11.172 8.534L10.721 8.272ZM5.982 12.787V10.482L6.434 10.182L7.994 11.082L9.602 10.182L10.053 10.436V12.796L7.985 14.005L5.982 12.787ZM10.721 11.887V10.08L10.213 9.78L10.721 9.527V8.974L11.172 9.274L12.733 8.374L13.241 8.628V10.988L11.172 12.141L10.721 11.888V11.887ZM5.983 9.18V6.82L8.052 5.667L10.064 6.82V9.18L7.995 10.333L5.983 9.18ZM2.758 10.98L2.805 8.62L3.257 8.366L4.817 9.266L5.325 8.966V9.519L5.833 9.819L5.325 10.071V11.879L4.817 12.132L2.758 10.98ZM2.758 7.373L2.805 5.013L4.874 3.86L6.886 5.013V5.565L5.326 6.465V8.216L4.817 8.516L2.758 7.373Z"
+                ></path>
+              </g>
+            </svg>
+            <span>
+              {{ $t("indexHeader.AI策略交易") }}
+            </span>
+          </p>
+        </div>
+        <div class="tn-item" @click="telejShow = !telejShow">
+          <p class="tm-title">
+            <svg
+              width="16"
+              height="16"
+              viewBox="0 0 16 16"
+              xmlns="http://www.w3.org/2000/svg"
+              class="svg-class"
+            >
+              <g id="Frame">
+                <path
+                  id="Vector"
+                  d="M7.14709 8.51244L8.95087 10.3135L10.6929 8.57408C10.7952 8.47196 10.9367 8.40848 11.093 8.40848H14.9877C14.9954 8.27324 15 8.13708 15 7.99969C15 4.13384 11.862 1 7.99094 1C4.28911 1 1.25764 3.86642 1 7.49798H4.32781L6.30416 5.52458C6.41028 5.41871 6.55414 5.35925 6.70413 5.35925C6.85412 5.35925 6.99798 5.41871 7.1041 5.52458L9.308 7.72523C9.40768 7.83248 9.46185 7.97415 9.45912 8.12045C9.45639 8.26676 9.39697 8.40631 9.29336 8.50978C9.18975 8.61326 9.05001 8.67259 8.90351 8.67532C8.75701 8.67804 8.61515 8.62395 8.50775 8.5244L6.70398 6.72334L4.96223 8.46276C4.90972 8.51529 4.84735 8.55695 4.77869 8.58537C4.71003 8.61379 4.63643 8.6284 4.56211 8.62836H1.01044C1.32857 12.1998 4.33241 15 7.99094 15C11.3326 15 14.1276 12.6644 14.8299 9.53886H11.3277L9.3516 11.5123C9.24543 11.6181 9.10153 11.6776 8.95148 11.6776C8.80144 11.6776 8.65753 11.6181 8.55136 11.5123L6.34746 9.31162C6.24134 9.20572 6.18169 9.06206 6.18163 8.91225C6.18158 8.76243 6.24111 8.61873 6.34715 8.51275C6.45319 8.40677 6.59704 8.3472 6.74706 8.34714C6.89708 8.34709 7.04097 8.40655 7.14709 8.51244Z"
+                ></path>
+              </g>
+            </svg>
+            <span>
+              {{ $t("indexHeader.交易中心") }}
+            </span>
+          </p>
+          <svg
+            width="8"
+            height="8"
+            viewBox="0 0 8 8"
+            xmlns="http://www.w3.org/2000/svg"
+            class="svg-class"
+          >
+            <g id="三角形">
+              <path id="Vector 1859" d="M7 4L2 0V8L7 4Z"></path>
+            </g>
+          </svg>
+        </div>
+
+        <div>
+          <div
+            v-if="telejShow"
+            class="ej-item"
+            @click="goPages(item.url)"
+            v-for="(item, index) in trafficList"
+            :key="index"
+          >
+            {{ item.title }}
+          </div>
+        </div>
+
+        <div class="tn-item" @click="goPages('documentary')">
+          <p class="tm-title">
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              width="16"
+              height="16"
+              viewBox="0 0 20 20"
+              class="svg-class"
+            >
+              <path
+                d="M9.02265 17.1427V19.0474H0.9959C0.445879 19.0474 0 18.6138 0 18.1029V0.944563C0 0.422901 0.448616 0 1.00101 0H13.6334C13.8898 0 14.1363 0.0984462 14.3222 0.275008L18.7339 4.46617C18.9326 4.65497 19.0451 4.91706 19.0451 5.19116V11.4285H17.0403V4.71423H14.0302V1.90474H2.00503V17.1427H9.02265ZM10.4934 16.6329L14.0378 20L19 15.286L17.5822 13.9391L14.0378 17.3063L11.9112 15.286L10.4934 16.6329Z"
+              ></path>
+              <path d="M4.00997 5.66658H15.0351V8.57132H4.00997V5.66658Z"></path>
+              <path d="M4.00997 9.47604H15.0351V11.4284H4.00997V9.47604Z"></path>
+              <path d="M4.00997 12.3332H15.0351V14.2855H4.00997V12.3332Z"></path>
+            </svg>
+            <span>
+              {{ $t("indexHeader.跟单") }}
+            </span>
+          </p>
+        </div>
+        <div class="tn-item" @click="goPages('/')">
+          <p class="tm-title">
+            <svg
+              width="16"
+              height="16"
+              viewBox="0 0 16 16"
+              xmlns="http://www.w3.org/2000/svg"
+              class="svg-class"
+            >
+              <g id="Frame">
+                <g id="Vector">
+                  <path
+                    d="M10.7533 8.22222H14.3467C14.7075 8.22222 15 8.56716 15 8.99259V13.2296C15 13.6551 14.7075 14 14.3467 14H10.7533C10.3925 14 10.1 13.6551 10.1 13.2296V8.99259C10.1 8.56716 10.3925 8.22222 10.7533 8.22222Z"
+                  ></path>
+                  <path
+                    d="M1 3.88889C1 4.65507 1.295 5.38987 1.8201 5.93164C2.3452 6.47341 3.05739 6.77778 3.8 6.77778C4.54261 6.77778 5.2548 6.47341 5.7799 5.93164C6.305 5.38987 6.6 4.65507 6.6 3.88889C6.6 3.12271 6.305 2.38791 5.7799 1.84614C5.2548 1.30436 4.54261 1 3.8 1C3.05739 1 2.3452 1.30436 1.8201 1.84614C1.295 2.38791 1 3.12271 1 3.88889Z"
+                  ></path>
+                  <path
+                    d="M14.3 4.61111H8.7C8.31341 4.61111 8 4.44943 8 4.25C8 4.05057 8.31341 3.88889 8.7 3.88889H14.3C14.6866 3.88889 15 4.05057 15 4.25C15 4.44943 14.6866 4.61111 14.3 4.61111Z"
+                  ></path>
+                  <path
+                    d="M14.371 4.61111C14.2883 4.61123 14.2065 4.5945 14.1302 4.56187C14.0538 4.52924 13.9845 4.48137 13.9262 4.421L12.3842 2.83011C12.1386 2.57666 12.1386 2.16576 12.3842 1.91231C12.6299 1.65886 13.0282 1.65886 13.2738 1.91231L14.8158 3.5032C15.0614 3.75665 15.0614 4.16755 14.8158 4.421C14.7574 4.48137 14.6881 4.52924 14.6118 4.56187C14.5354 4.59449 14.4536 4.61123 14.371 4.61111Z"
+                  ></path>
+                  <path
+                    d="M12.829 6.77778C12.7464 6.7779 12.6646 6.76116 12.5882 6.72854C12.5119 6.69591 12.4426 6.64804 12.3842 6.58767C12.1386 6.33421 12.1386 5.92332 12.3842 5.66987L13.9262 4.07898C14.1718 3.82553 14.5701 3.82553 14.8158 4.07898C15.0614 4.33243 15.0614 4.74333 14.8158 4.99678L13.2738 6.58767C13.2155 6.64803 13.1461 6.69591 13.0698 6.72853C12.9935 6.76116 12.9116 6.77789 12.829 6.77778Z"
+                  ></path>
+                  <path
+                    d="M6.67 11.8333H1.63C1.28207 11.8333 1 11.6717 1 11.4722C1 11.2728 1.28207 11.1111 1.63 11.1111H6.67C7.01793 11.1111 7.3 11.2728 7.3 11.4722C7.3 11.6717 7.01793 11.8333 6.67 11.8333Z"
+                  ></path>
+                  <path
+                    d="M1.629 11.8333C1.54638 11.8334 1.46456 11.8167 1.38823 11.7841C1.3119 11.7515 1.24258 11.7036 1.18424 11.6432C0.938586 11.3898 0.938586 10.9789 1.18424 10.7254L2.72619 9.1345C2.9718 8.88109 3.3701 8.88109 3.61576 9.1345C3.86141 9.38791 3.86141 9.79886 3.61576 10.0523L2.07381 11.6432C2.01546 11.7036 1.94613 11.7514 1.86979 11.7841C1.79346 11.8167 1.71163 11.8334 1.629 11.8333Z"
+                  ></path>
+                  <path
+                    d="M3.17095 14C3.08834 14.0001 3.00651 13.9834 2.93018 13.9507C2.85385 13.9181 2.78453 13.8702 2.72619 13.8099L1.18424 12.219C0.938586 11.9656 0.938586 11.5546 1.18424 11.3012C1.42985 11.0478 1.82815 11.0478 2.07381 11.3012L3.61576 12.8921C3.86141 13.1455 3.86141 13.5564 3.61576 13.8099C3.55741 13.8702 3.48807 13.9181 3.41174 13.9507C3.33541 13.9834 3.25358 14.0001 3.17095 14Z"
+                  ></path>
+                </g>
+              </g>
+            </svg>
+            <span> NFT </span>
+          </p>
+        </div>
+        <div class="tn-item" @click="jrlcShow = !jrlcShow">
+          <p class="tm-title">
+            <svg
+              width="16"
+              height="16"
+              viewBox="0 0 16 16"
+              xmlns="http://www.w3.org/2000/svg"
+              class="svg-class"
+            >
+              <g id="Frame">
+                <path
+                  id="Vector"
+                  d="M2.32843 11.1947C2.00224 11.1947 1.73695 11.46 1.73695 11.7862C1.73695 12.1124 2.00079 12.3777 2.32843 12.3777H12.6677C12.9939 12.3777 13.2578 12.1124 13.2578 11.7862C13.2578 11.46 12.9939 11.1947 12.6677 11.1947H12.5199V5.87554H12.6677C12.8301 5.87554 12.9635 5.74217 12.9635 5.57979C12.9635 5.41742 12.8315 5.28549 12.6677 5.28549H2.32843C2.16606 5.28549 2.03414 5.41742 2.03414 5.57979C2.03414 5.74217 2.16606 5.87554 2.32843 5.87554H2.4763V11.1933H2.32843V11.1947ZM9.5668 5.87554H11.3398V11.1933H9.5668V5.87554ZM6.6123 5.87554H8.38384V11.1933H6.6123V5.87554ZM3.65781 5.87554H5.43079V11.1933H3.65781V5.87554ZM1.59053 4.84186H13.4085C13.7347 4.84186 14 4.57656 14 4.25036C14 3.99086 13.8333 3.77049 13.5999 3.69075L7.74017 1.05219C7.58651 0.982603 7.40964 0.982603 7.25597 1.05219L1.34843 3.7125C1.09473 3.82703 0.954106 4.10249 1.01354 4.37504C1.07153 4.6476 1.31218 4.84186 1.59053 4.84186ZM13.4071 12.8184H1.59198C1.26579 12.8184 1.0005 13.0838 1.0005 13.4099C1.0005 13.7361 1.26434 14 1.59198 14H13.4071C13.7333 14 13.9986 13.7347 13.9986 13.4099C13.9971 13.0838 13.7333 12.8184 13.4071 12.8184Z"
+                ></path>
+              </g>
+            </svg>
+            <span>
+              {{ $t("indexFooter.金融理財") }}
+            </span>
+          </p>
+          <svg
+            width="8"
+            height="8"
+            viewBox="0 0 8 8"
+            xmlns="http://www.w3.org/2000/svg"
+            class="svg-class"
+          >
+            <g id="三角形">
+              <path id="Vector 1859" d="M7 4L2 0V8L7 4Z"></path>
+            </g>
+          </svg>
+        </div>
+        <div v-if="jrlcShow">
+          <div class="ej-item" @click="goPages('borrowMoney')">
+            {{ $t("indexHeader.DeFi借幣") }}
+          </div>
+          <div class="ej-item" @click="goPages('portfolio')">
+            {{ $t("indexHeader.投資組合") }}
+          </div>
+        </div>
+        <div class="tn-item" @click="goPages('overviewAssets')">
+          <p class="tm-title">
+            <svg
+              width="20"
+              height="20"
+              viewBox="0 0 20 20"
+              xmlns="http://www.w3.org/2000/svg"
+              class="svg-class"
+            >
+              <g id="Frame">
+                <g id="Vector">
+                  <path
+                    d="M10.5208 16.9792H8.24846V15.0461L4.35885 12.8625C4.33304 12.8485 4.31129 12.8271 4.29599 12.8006C4.28069 12.7741 4.27243 12.7436 4.27212 12.7123V8.47129L2.58788 7.51629L3.68404 5.46797L5.49942 6.49713L9.305 4.36089C9.3296 4.34708 9.35691 4.33987 9.38462 4.33987C9.41232 4.33987 9.43963 4.34708 9.46423 4.36089L11.3798 5.4363H15.976C15.8299 5.29897 15.6693 5.18092 15.4975 5.08464L10.5523 2.30777C10.1914 2.10554 9.79103 2 9.38471 2C8.9784 2 8.57801 2.10554 8.21712 2.30777L3.27077 5.08464C2.48692 5.52464 2 6.3688 2 7.28796V12.7121C2 13.6311 2.48692 14.4752 3.27077 14.9154L8.21692 17.6921C8.57388 17.8922 8.96956 17.9977 9.37147 17.9999C9.77338 18.0021 10.17 17.901 10.5288 17.7048V15.0417L10.5208 15.0463V16.9792Z"
+                  ></path>
+                  <path
+                    d="M8.24846 9.96358H9.31923L8.8175 9.02775L9.38942 8.70296L5.49942 6.49713L4.35885 7.13755C4.33304 7.15153 4.31129 7.17294 4.29599 7.19944C4.28069 7.22594 4.27243 7.2565 4.27212 7.28775V8.47129L8.24846 10.7259V9.96358Z"
+                  ></path>
+                  <path
+                    d="M4.35885 7.13755L5.49942 6.49713L3.68404 5.46797L2.58788 7.51629L4.27212 8.47129V7.28775C4.27243 7.2565 4.28069 7.22594 4.29599 7.19944C4.31129 7.17294 4.33304 7.15153 4.35885 7.13755ZM10.3746 8.14337L9.38942 8.70296L9.98308 9.0392L9.48827 9.96357H10.5208V10.7313L13.0213 9.31108H10.3746V8.14337Z"
+                  ></path>
+                  <path
+                    d="M9.31923 9.96358L9.48827 9.96357L9.98308 9.0392L9.38942 8.70296L8.8175 9.02775L9.31923 9.96358ZM9.40385 10.1213L8.88654 11.0877L8.24846 10.7259V15.0461L9.305 15.6392C9.3296 15.653 9.35691 15.6602 9.38462 15.6602C9.41232 15.6602 9.43963 15.653 9.46423 15.6392L10.5208 15.0463V10.7313L9.91538 11.075L9.40385 10.1213Z"
+                  ></path>
+                  <path
+                    d="M9.305 15.6392L8.24846 15.0461V16.9792H10.5208V15.0463L9.46423 15.6392C9.43963 15.653 9.41232 15.6602 9.38462 15.6602C9.35691 15.6602 9.3296 15.653 9.305 15.6392ZM8.24846 9.96358V10.7259L8.88654 11.0877L9.40385 10.1213L9.31923 9.96358H8.24846ZM9.48827 9.96357L9.40385 10.1213L9.91538 11.075L10.5208 10.7313V9.96357H9.48827Z"
+                  ></path>
+                  <path
+                    d="M9.40385 10.1213L9.48827 9.96357L9.31923 9.96358L9.40385 10.1213ZM14.4971 9.31108V8.47296L13.0213 9.31108H14.4971Z"
+                  ></path>
+                  <path
+                    d="M15.976 5.4363H11.3798L13.2721 6.4988L15.0852 5.46901L16.1831 7.5165L14.4971 8.47296V9.31108L16.7692 9.31108V7.28796C16.7692 6.57401 16.4746 5.90547 15.976 5.4363Z"
+                  ></path>
+                  <path
+                    d="M10.3746 9.31108H13.0213L14.4971 8.47296L14.4969 7.28796C14.4966 7.25671 14.4883 7.22615 14.473 7.19965C14.4577 7.17315 14.436 7.15173 14.4102 7.13775L13.271 6.49817L10.3746 8.14337V9.31108Z"
+                  ></path>
+                  <path
+                    d="M14.4969 7.28796L14.4971 8.47296L16.1821 7.51588L15.0842 5.46839L13.271 6.49817L14.4102 7.13775C14.436 7.15173 14.4577 7.17315 14.473 7.19965C14.4883 7.22615 14.4966 7.25671 14.4969 7.28796Z"
+                  ></path>
+                  <path
+                    d="M16.2769 12.0804C15.4038 11.814 14.9231 11.3334 14.9231 11.3334C14.9231 11.3334 14.4423 11.814 13.5692 12.0804C12.5212 12.4002 11.8462 12.2856 11.8462 12.2856C11.8462 12.2856 11.8544 13.1515 12.0923 14.68C12.3462 16.3125 13.1385 17.2531 13.7538 17.6131C14.4206 18.0031 14.9231 18 14.9231 18C14.9231 18 15.4256 18.0031 16.0923 17.6131C16.7077 17.2531 17.4996 16.3129 17.7538 14.6802C17.9917 13.1515 18 12.2856 18 12.2856C18 12.2856 17.325 12.4002 16.2769 12.0804Z"
+                  ></path>
+                </g>
+              </g>
+            </svg>
+            <span>
+              {{ $t("indexHeader.資產中心") }}
+            </span>
+          </p>
+        </div>
+
+        <!-- 	<div class="tn-item" @click="grzxShow =!grzxShow">
+					<span class="tm-title">
+						{{$t('zjde54')}}
+					</span>
+					<i v-if="grzxShow" class="el-icon-arrow-up fssdf"></i>
+					<i v-else class="el-icon-arrow-down fssdf"></i>
+
+				</div>
+
+
+				<div v-if="grzxShow">
+
+					<div class="ej-item" @click="goPages('change')"> {{$t('zjde44')}} </div>
+					<div class="ej-item" @click="goPages('invitation')"> {{$t('zjde45')}} </div>
+					<div class="ej-item" @click="goPages('UOrder')"> {{$t('zjde46')}}</div>
+					<div class="ej-item" @click="goPages('transferLog')"> {{$t('zjde47')}}</div>
+					<div class="ej-item" @click="goPages('credit')"> {{$t('zjde48')}}</div>
+					<div class="ej-item ul-item2">
+						<div class="text-box" @click="secondaryShow=!secondaryShow">
+							<span class="text"> {{$t('zjde49')}}</span>
+							<i class="el-icon-arrow-down" style="margin-left: 0.5rem;"></i>
+
+						</div>
+						<div class="menu-box colorfs" v-show="secondaryShow">
+							<div class="mbs-item" @click="goPages('modifyPassword')"> {{$t('zjde50')}}</div>
+							<div class="mbs-item" @click="goPages('setTransactionPassword')"> {{$t('zjde51')}}</div>
+						</div>
+					</div>
+					<div class="ej-item" @click="loginOut"> {{$t('zjde52')}}</div>
+					<div class="ej-item" @click="loginOut"> {{$t('zjde53')}}</div>
+
+
+				</div> -->
+        <!-- 	<div v-if="telejShow" class="ej-item" @click="goPages(item.url)" v-for="(item,index) in trafficList"
+					:key="index">
+				
+					{{item.title}}
+				</div> -->
+
+        <!-- 
+				<div class="tn-item" @click="telejShow =!telejShow">
+					<span class="tm-title">
+						{{$t('zjde37')}}
+					</span>
+					<i v-if="telejShow" class="el-icon-arrow-up fssdf"></i>
+					<i v-else class="el-icon-arrow-down fssdf"></i>
+
+				</div>
+				<div v-if="telejShow" class="ej-item" @click="goPages(item.url)" v-for="(item,index) in trafficList"
+					:key="index">
+
+					{{item.title}}
+				</div>
+				<div class="tn-item" @click="goPages('marketQuotaion')">
+					<span class="tm-title">
+						{{$t('homeContent.market')}}
+					</span>
+				</div>
+				<div class="tn-item" @click="goPages('change')">
+					<span class="tm-title">
+						{{$t('zjde38')}}
+					</span>
+				</div>
+				<div class="tn-item" @click="goPages('mx-defi')">
+					<span class="tm-title">
+						{{$t('zjde39')}}
+					</span>
+				</div>
+				<div class="tn-item" @click="goPages('help')">
+					<span class="tm-title">
+						{{$t('zjde40')}}
+					</span>
+				</div>
+				<div class="tn-item" @click="goPages('message')">
+					<span class="tm-title">
+						{{$t('zjde41')}}
+					</span>
+				</div>
+
+				<div class="tn-item" @click="goPages('download2')">
+					<span class="tm-title">
+						{{$t('zjde163')}}
+					</span>
+				</div>
+				<div class="tn-item" @click="loginOut">
+					<span class="tm-title">
+						{{$t('zjde52')}}
+					</span>
+				</div>
+				<div class="tn-item" @click="srShow2=true">
+					<span class="tm-title" style="align-items: center;display: flex;">
+						<img style="width: 24px; margin-right: 10px;" :src="langObj.src" />
+						<span>{{langObj.text}}</span>
+					</span>
+				</div>
+				<div class="tn-item" @click="srShow3 = !srShow3">
+					<span class="tm-title">
+						{{$t('zjde56')}}
+					</span>
+				</div> -->
+
+        <div class="tcdl" v-if="account_number" @click="loginOut">{{ $t("zjde53") }}</div>
+      </div>
+    </div>
+    <div class="sidebar" :class="{ srShow: srShow2 }">
+      <div class="sr-head">
+        <div class="xzyy" style="color: #fff">{{ $t("zjde55") }}</div>
+        <i class="el-icon-close csds" @click="srShow2 = !srShow2"></i>
+      </div>
+      <div class="tel-nav">
+        <div
+          class="tn-item"
+          style="justify-content: inherit"
+          v-for="(item, index) in langList"
+          @click="set_lang(item.src, item.text, item.lang)"
+        >
+          <img style="width: 24px; margin-right: 10px" :src="item.src" />
+          <span class="tm-title">
+            {{ item.text }}
+          </span>
+        </div>
+      </div>
+    </div>
+    <div class="sidebar" :class="{ srShow: srShow3 }">
+      <div class="sr-head">
+        <div class="xzyy" style="color: #fff">{{ $t("zjde56") }}</div>
+        <i class="el-icon-close csds" @click="srShow3 = !srShow3"></i>
+      </div>
+      <div class="li-cn" style="margin-top: 2rem">
+        <div
+          class="iv-item"
+          v-for="(item, index) in currencyList"
+          :key="index"
+          @click="huilv(item)"
+          style="color: #999; margin-bottom: 0.8rem"
+        >
+          <span style="margin-right: 0.5rem">{{ item.symbol }}</span>
+          <span class="ii-text">{{ item.text }}</span>
+          <div class="xz">
+            <i
+              v-if="hlObj.type == item.type"
+              class="el-icon-check"
+              style="color: #f29807; font-size: 25px"
+            ></i>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div
+      id="customerSmall"
+      class="customer-small"
+      @click="kefu"
+      v-if="siteConfig.zxkf_url"
+    >
+      <div class="red-point">
+        <!-- <i class="el-icon-headset hrth"></i>
+				<span class="title-kf">{{$t('zjde160')}}</span> -->
+        <!-- <img src="../../static/imgs/kf.jpg" class="fss" /> -->
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "indexHeader",
+  data() {
+    return {
+      jrlcShow: false,
+      grzxShow: false,
+      srShow3: false,
+      srShow2: false,
+      srShow: false,
+      telejShow: false,
+      secondaryShow: false,
+      siteConfig: {},
+      account_number: "",
+      regular: false,
+
+      trafficList: [
+        {
+          title: this.$t("indexHeader.option"),
+          desc: this.$t("indexHeader.option_desc"),
+          url: "secondDealCenter",
+        },
+        {
+          title: this.$t("indexHeader.现货"),
+          desc: this.$t("indexHeader.多品类,快速交易"),
+          url: "dealCenter",
+        },
+        {
+          title: this.$t("indexHeader.合约"),
+          desc: this.$t("indexHeader.USDC永续合约外汇期货"),
+          url: "leverdealCenter",
+        },
+        {
+          title: "C2C",
+          desc: this.$t("indexHeader.前往C2C交易"),
+          url: "c2cMerchant",
+        },
+        {
+          title: this.$t("indexHeader.模拟交易"),
+          desc: this.$t("indexHeader.零风险,交易数字货币"),
+          url: "/",
+        },
+        {
+          title: this.$t("indexHeader.loan"),
+          desc: this.$t("indexHeader.loan_desc"),
+          url: "loan",
+        },
+        {
+          title: this.$t("indexHeader.ieo"),
+          desc: this.$t("indexHeader.ieo_desc"),
+          url: "ieo",
+        },
+        {
+          title: this.$t("indexHeader.credit_ieo"),
+          desc: this.$t("indexHeader.credit_ieo_desc"),
+          url: "creditCenter",
+        },
+        {
+          title: this.$t("indexHeader.options_trade"),
+          desc: this.$t("indexHeader.options_trade_desc"),
+          url: "optionTrade",
+        },
+      ],
+
+      sc: this.$t("zjde37"),
+      langList: [
+        // {
+        // 	type: '',
+        // 	text: 'English'
+        // },
+        // {
+        // 	type: '',
+        // 	text: '简体中文'
+        // },
+        // {
+        // 	type: '',
+        // 	text: '繁体中文'
+        // },
+        // {
+        // 	type: '',
+        // 	text: 'Spanish'
+        // },
+        // {
+        // 	type: '',
+        // 	text: '日语'
+        // },
+        // {
+        // 	type: '',
+        // 	text: 'ไทย'
+        // }
+        {
+          src: require("@/assets/lang1.png"),
+          text: this.$t("lang.en"),
+          lang: "en",
+        },
+        {
+          src: require("@/assets/lang2.png"),
+          text: this.$t("lang.zh"),
+          lang: "zh",
+        },
+        {
+          src: require("@/assets/lang3.png"),
+          text: this.$t("lang.hk"),
+          lang: "hk",
+        },
+        {
+          src: require("@/assets/images/Korea.png"),
+          text: this.$t("lang.kr"),
+          lang: "kr",
+        },
+        {
+          src: require("@/assets/lang5.png"),
+          text: this.$t("lang.jp"),
+          lang: "jp",
+        },
+        {
+          src: require("@/assets/lang4.png"),
+          text: this.$t("lang.spa"),
+          lang: "spa",
+        },
+        {
+          src: require("@/assets/images/Germany.png"),
+          text: this.$t("zjde228"),
+          lang: "de",
+        },
+        {
+          src: require("@/assets/images/France.png"),
+          text: this.$t("zjde229"),
+          lang: "fra",
+        },
+        {
+          src: require("@/assets/images/Italy.png"),
+          text: this.$t("zjde230"),
+          lang: "it",
+        },
+        {
+          src: require("@/assets/images/dej.jpg"),
+          text: this.$t("zjde231"),
+          lang: "drj",
+        },
+        // {
+        //     src: require('@/assets/images/jp.png'),
+        //     text: this.$t('lang.fra'),
+        //     lang: 'fra'
+        // },
+        // {
+        //     src: require('@/assets/images/jp.png'),
+        //     text: this.$t('lang.it'),
+        //     lang: 'it'
+        // }
+      ],
+      currencyList: this.$t("zjde58"),
+      langObj: {},
+      night: 1,
+      hlObj: {},
+    };
+  },
+  created() {
+    var lan = window.localStorage.getItem("locale") || "zh";
+    this.night = localStorage.getItem("night_mode") || 1;
+
+    this.langObj = this.langList.filter((item) => item.lang == lan)[0];
+    let hl = localStorage.getItem("hlType") || "USD";
+    console.log("this.night", hl);
+    this.hlObj = this.currencyList.filter((item) => item.type == hl)[0];
+  },
+  mounted() {
+    // console.log('this.$route.meta', this.$route.meta)
+    // this.regular = this.$route.meta.head || false
+    this.account_number = localStorage.getItem("accountNum") || "";
+    this.getConfig();
+  },
+  watch: {
+    $route: {
+      handler(val, oldVal) {
+        let list = this.$t("zjde57");
+        // if (val.name == "secondDealCenter") {
+        // 						this.sc = this.$t('zjde37')
+        // 					} else
+        if (val.name == "leverdealCenter") {
+          this.sc = list[1].title;
+        } else if (val.name == "dealCenter") {
+          this.sc = list[2].title;
+        } else {
+          this.sc = this.$t("zjde37");
+        }
+        this.regular = val.meta.head || false;
+      },
+      immediate: true,
+      deep: true,
+    },
+  },
+  methods: {
+    huilv(item) {
+      this.hlObj = item;
+      window.localStorage.setItem("hlType", item.type);
+      window.location.reload();
+    },
+    switchSkins() {
+      window.localStorage.setItem("night_mode", this.night == 0 ? 1 : 0);
+      window.location.reload();
+    },
+    getConfig() {
+      this.$http({
+        url: "/api/getSiteConfig",
+      }).then((res) => {
+        this.siteConfig = res.data.message;
+      });
+    },
+    goPages(name) {
+      this.srShow = false;
+      if (name === '/' || name === 'home') {
+        this.$router.push({ path: '/' });
+      } else {
+        this.$router.push({ name: name });
+      }
+    },
+    // 退出登录
+    loginOut() {
+      this.$message({
+        message: this.$t("czcc"),
+        type: "success",
+      });
+      // console.log("out");
+      localStorage.removeItem("token");
+      localStorage.removeItem("accountNum");
+      localStorage.clear();
+      this.$router.push({
+        name: "login",
+      });
+    },
+    set_lang(img, text, lang) {
+      this.srShow2 = false;
+      this.langObj.lang = lang;
+      var l = window.localStorage.getItem("locale") || "zh";
+      if (l == lang) {
+        return;
+      } else {
+        window.localStorage.setItem("locale", lang);
+        this.$i18n.locale = lang;
+
+        window.localStorage.setItem("lang", lang);
+        window.location.reload();
+      }
+    },
+    kefu() {
+      // const newWindow = window.open('www.baidu.com', '', 'width=400,height=200');
+      let width = 400;
+      let height = 400;
+      var curScreenWidth = document.documentElement.clientWidth;
+      if (curScreenWidth < 800) {
+        let width = 200;
+        let height = 200;
+      }
+      // 获取屏幕尺寸
+      var screenWidth = window.screen.width;
+      var screenHeight = window.screen.height;
+
+      // 计算位置
+      var left = screenWidth - width;
+      var top = screenHeight - height;
+
+      window.open(
+        this.siteConfig.zxkf_url,
+        "",
+        `height=${height},width=${width},left=${left},top=${top},toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,status=no`
+      );
+    },
+  },
+};
+</script>
+
+<style lang="scss">
+.svg-class {
+  fill: #fff;
+}
+
+#h-tabs {
+  background-color: #0e0f18;
+  border: 1px solid #1a1b24;
+  border-radius: 6px;
+  cursor: pointer;
+  padding: 0 0;
+  margin: 0 30px 0 10px;
+
+  .h-item {
+    padding: 0 1.33333vw;
+    color: #888;
+    min-width: 50px;
+    height: 32px;
+    line-height: 32px;
+  }
+
+  .h-active {
+    background-color: #1a1b24;
+    color: #fff;
+  }
+}
+
+.fgx {
+  width: 2px;
+  height: 14px;
+  background: #363751;
+  margin-right: 20px;
+  display: block;
+  position: relative;
+}
+
+.jylist {
+  .jy-item {
+    display: flex;
+    // text-align: center;
+    font-size: 1rem;
+    padding: 1rem 0;
+    cursor: pointer;
+    padding: 10px 20px;
+
+    .r-tetx {
+      margin-left: 10px;
+
+      .r-t {
+        font-size: 16px;
+      }
+
+      .r-s {
+        margin-top: 6px;
+        font-size: 0.85rem;
+        color: #888;
+      }
+    }
+
+    &:hover {
+      color: #000;
+      border-radius: 5px;
+      background: linear-gradient(90deg, #00e3ff 0%, #089 100%);
+
+      .r-s {
+        color: #00373e;
+      }
+
+      .svg-class {
+        fill: #000;
+      }
+    }
+  }
+}
+
+.fss {
+  width: 60px;
+  height: 60px;
+  border-radius: 50%;
+}
+
+.head {
+  cursor: pointer;
+  // background: red;
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+  padding: 0.8rem 1.2%;
+  z-index: 999;
+  position: fixed;
+  left: 0;
+  right: 0;
+  top: 0;
+  background: rgba(0, 0, 0, 0.16);
+  backdrop-filter: blur(13px);
+
+  .hd-left {
+    display: flex;
+    align-items: center;
+    flex: 1;
+    color: #fff;
+
+    .hl-item {
+      margin-right: 10px;
+      font-size: 14px;
+      text-align: center;
+      cursor: pointer;
+      justify-content: center;
+      display: flex;
+      align-items: center;
+      white-space: nowrap;
+      min-width: 40px;
+      padding: 0 8px;
+      // max-width: 100px;
+
+      .logo {
+        height: 1.97rem;
+        // height: 24px;
+      }
+    }
+  }
+
+  .jy-text {
+    color: #fff;
+    font-size: 1rem;
+  }
+
+  .hd-right {
+    width: 40%;
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+
+    color: #999;
+
+    .hr-item {
+      white-space: nowrap;
+      margin-left: 2%;
+      font-size: 1rem;
+      display: flex;
+      align-items: center;
+
+      .hi-icon {
+        width: 24px;
+        margin-right: 10px;
+      }
+    }
+
+    .dlzc {
+      display: flex;
+      align-items: center;
+
+      .dc-item {
+        // padding: .8rem 1.8rem;
+        // font-size: 1rem;
+        // border-radius: 6px;
+        background: rgba(0, 0, 0, 0.5);
+        border: 1px solid #fff;
+        color: #fff;
+
+        flex: none;
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        border-radius: 100px;
+        min-width: 64px;
+        height: 28px;
+        line-height: 13px;
+        font-size: 12px;
+        margin-left: 10px;
+      }
+
+      .zc {
+        // background-color: #f5f5f5;
+        background: #fff;
+        color: #05040b;
+      }
+    }
+
+    .hr-item2 {
+      width: 2px;
+      height: 14px;
+      background: #363751;
+      margin-left: 4%;
+      margin-right: 2.5%;
+      // width: 1px;
+      // height: 20px;
+      // background: rgba(255, 255, 255, 0.6);
+    }
+  }
+}
+
+// .regular {
+// 	position: absolute;
+// 	top: 0;
+// 	left: 0;
+// }
+
+.userList {
+}
+
+.ul-item {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0.875rem;
+  font-size: 1rem;
+  cursor: pointer;
+}
+
+.ul-item:hover {
+  color: #f29807;
+}
+
+.ul-item11 {
+  justify-content: flex-start;
+  padding: 15px 20px;
+}
+
+.ul-item11 span {
+  margin-left: 10px;
+  font-size: 16px;
+}
+
+.ul-item .text-box {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.ul-item2 {
+  flex-direction: column;
+}
+
+.menu-box {
+  font-size: 0.85rem;
+}
+
+.mb-item {
+  text-align: center;
+  margin-top: 0.5rem;
+}
+
+.mb-item:hover {
+  color: #f29807;
+}
+
+.popover-i {
+  background: transparent;
+  display: flex;
+  align-items: center;
+}
+
+.langue-popover {
+  display: flex;
+  font-size: 1rem;
+
+  color: #666;
+  // padding: 0.75rem;
+  padding-left: 20px;
+}
+
+.li-h {
+}
+
+.lp-item {
+  // padding: 0.75rem 0 0.75rem 0;
+  // height: 30rem;
+  // overflow-y: auto;
+}
+
+.li-cn {
+  // margin-top: 1rem;
+}
+
+.iv-item {
+  padding: 0.5rem 4rem 0.5rem 0;
+  display: flex;
+  align-items: center;
+  position: relative;
+  cursor: pointer;
+}
+
+.ii-icon {
+  width: 1.4rem;
+  height: 1.4rem;
+  margin-right: 0.5rem;
+}
+
+.lp-item2 {
+  margin-left: 1rem;
+  padding-left: 1.5rem;
+  padding-right: 1rem;
+  border-left: 1px solid #ccc;
+}
+
+.xz {
+  position: absolute;
+  top: 50%;
+  right: 0rem;
+  transform: translateY(-50%);
+}
+
+.day .head .hd-right .dlzc .zc {
+  background: #fff;
+}
+
+.cd {
+  display: none;
+}
+
+#customerSmall {
+  position: fixed;
+  bottom: 15vh;
+  right: 10px;
+
+  z-index: 100;
+  // padding: 0.8rem 1rem;
+  cursor: pointer;
+  border-radius: 50%;
+  // border-radius: 1.875rem;
+  // background: linear-gradient(90deg, #dae580, #82c3ae);
+  box-shadow: 0 0 0.9375rem rgba(0, 0, 0, 0.16);
+}
+
+.red-point {
+  font-size: 1.2rem;
+  display: flex;
+  align-items: center;
+}
+
+.hrth {
+  font-size: 1.4rem;
+}
+
+.title-kf {
+  color: #fff;
+  margin-left: 0.5rem;
+}
+
+.sidebar {
+  position: fixed;
+  width: 100%;
+  top: 0;
+  left: -100%;
+  bottom: 0;
+  background: #000;
+  padding: 20px 2rem;
+  font-size: 1.2rem;
+  z-index: 999999;
+  transition: all 0.3s;
+  z-index: 9999;
+  height: 100vh;
+}
+
+.srShow {
+  left: 0%;
+}
+
+.sr-head {
+  display: flex;
+}
+
+.tel-nav {
+  margin-top: 1.5rem;
+  height: 80vh;
+  overflow: auto;
+}
+
+.sh-item {
+  background: #1f2e38;
+  color: #fff;
+  padding: 0.6rem 1rem;
+  margin-right: 2rem;
+  border-radius: 4px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
+  color: #fff;
+  border-radius: 0.125rem;
+}
+
+.dl {
+  background: #00f0ff;
+}
+
+.ej-item {
+  font-size: 1rem;
+  margin-bottom: 2rem;
+  color: #999;
+  padding-left: 30px;
+}
+
+.mbs-item {
+  font-size: 1rem;
+  margin-top: 2rem;
+  color: #999;
+  padding-left: 1rem;
+}
+
+.csds {
+  margin-left: auto;
+  font-size: 2rem;
+  color: #fff;
+}
+
+.tn-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 2rem;
+}
+
+.tm-title {
+  color: #fff;
+  display: flex;
+  align-items: center;
+}
+
+.tm-title > span {
+  margin-left: 10px;
+}
+
+.tel-nav::-webkit-scrollbar {
+  display: none;
+}
+
+.tel-nav {
+  scrollbar-width: none;
+}
+
+.fssdf {
+  color: #fff;
+  font-size: 1.5rem;
+  background: none;
+}
+
+.tcdl {
+  height: 3rem;
+  position: absolute;
+  bottom: 1.25rem;
+  left: 0;
+  right: 0;
+  margin: 0 1rem;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background: #00f0ff;
+  border-radius: 0.25rem;
+  font-size: 1.2rem;
+  color: #000;
+}
+
+@media screen and (max-width: 800px) {
+  .fgx,
+		.head .hd-left .hl-item,
+		// .head .hd-right .dlzc .dc-item,
+		.head .hd-right .hr-item {
+    display: none;
+  }
+
+  .head .hd-right .dfdf,
+  .head .hd-right .dlzc .zc,
+  .head .hd-left .hl-item:first-child {
+    display: flex;
+  }
+
+  .head .hd-right .dlzc .zc {
+    margin-left: 2rem;
+  }
+
+  .head .hd-right .hr-item {
+    font-size: 0.875rem;
+  }
+
+  .head .hd-right .hr-item,
+  .head .hd-right .dlzc .zc {
+    color: #999;
+  }
+
+  .cd {
+    display: flex;
+    align-items: center;
+    color: #999;
+    font-size: 2rem;
+    margin-left: 1.5rem;
+  }
+
+  .regular .hd-right .hr-item {
+    color: #fff;
+  }
+
+  .cd img {
+    width: 2rem;
+    height: 2rem;
+  }
+
+  .head {
+    padding: 0.8rem 3%;
+    background: #000;
+  }
+
+  .head .hd-right {
+    width: 60%;
+  }
+}
+</style>
diff --git a/src/view/market - 副本.vue b/src/view/market - 副本.vue
new file mode 100644
index 0000000..90656a5
--- /dev/null
+++ b/src/view/market - 副本.vue	
@@ -0,0 +1,756 @@
+<template>
+	<div class="market" style="height: 100%;">
+
+		<div class="ssk">
+			<el-input placeholder="搜索" size="small" prefix-icon="el-icon-search" v-model="input1">
+			</el-input>
+		</div>
+
+
+		<!-- <div class="cm-tabs-group">
+
+
+			<span class="cm-tab" :class="{'active-btn-bg':cmtabsCurrent == 100}" @click="cmTab(100)">
+				<span>{{$t('zx')}}</span>
+			</span>
+
+			<span class="cm-tab" :class="{'active-btn-bg':cmtabsCurrent == item.id}" v-for="(item,index) in cmtabs"
+				@click="cmTab(item.id)" :key="index">{{item.pcname}}</span>
+
+
+		</div> -->
+
+
+
+
+
+		<div class="tabs-box">
+			<el-tabs v-model="tabsName" @tab-click="handleClick">
+
+
+
+				<el-tab-pane v-for="(item,index) in tabsList" :label="item.text" :name="item.type"></el-tab-pane>
+
+			</el-tabs>
+		</div>
+		<div class="tbs2">
+			<div class="tb2itme" :class="{'tb2itmeAvtive':tabsName2==item.type}" v-for="(item,index) in tabsList2[tabsName]"
+				@click="handleClick2(item.type)">{{item.text}}</div>
+		</div>
+
+
+		<div class="m_filter">
+
+
+
+
+
+			<div class="tabtitle fColor1 ft14 curPer flex">
+				<!-- <span>JNB</span>
+        <span>JNB</span>-->
+				<!-- <span v-for="(tab,index) in tabList " :key="index" :class="index==index1?'active':''"  @click="changeType(index,tab.name,tab.id)">{{tab.name}}</span> -->
+			</div>
+		</div>
+		<div class="coin-title clear" v-if="false">
+			<div>
+				<span style="color:#00a4d8;">{{ $t('market.currency') }}</span>
+				<!--<img src="../assets/images/select0.png" alt>-->
+			</div>
+			<div>
+				<span>{{ $t('market.lastprice') }}</span>
+				<!--<img src="../assets/images/select0.png" alt>-->
+			</div>
+			<div>
+				<span>{{ $t('market.change') }}</span>
+				<!--<img src="../assets/images/select0.png" alt>-->
+			</div>
+		</div>
+		<!-- <div class="line"></div> -->
+		<div class="coin-wrap scroll sdgvs" style="height: 90%; overflow: auto;">
+			<!-- :class="index==index2?'active_p':''" -->
+			<!-- <li class="currency_p" v-for="(item,index) in marketList " :key="index"
+				@click="quota_shift(index,item.legal_id,item.legal_name,item.currency_name,item.currency_id,item.change,item.lever_share_num)"
+				v-if="item.is_display == 1" v-show="item.currency_name!='USDC'">
+				<div style="white-space: nowrap; display: flex; justify-content: space-between; padding-right: 2rem;">
+
+					<div class="cscs">
+						<img :src="$utils.isBaseUrl(item.logo)" style="width: 24px; height: 24px;">
+						<div class="c-sdwa">
+							<span>{{ item.currency_name }} / USDC
+
+								<img src="@/assets/116.png" />
+							</span>
+							<span>{{ item.type }}</span>
+
+						</div>
+					</div>
+					<span>{{ item.now_price|toFixedN(4) }}</span>
+					<span
+						:class="{'green':item.change>=0,'red':item.change<0}">{{ (item.change - 0).toFixed(2) }}%</span>
+				</div>
+			</li> -->
+
+
+
+			<div class="hq-item" v-for="(item,index) in marketList " :key="index"
+				@click="quota_shift(index,item.legal_id,item.legal_name,item.currency_name,item.currency_id,item.change,item.lever_share_num,item.logo)">
+
+				<div>
+					<i class="el-icon-star-on" style="font-size: 16px;"></i>
+				</div>
+				<div class="cscs">
+					<img :src="$utils.isBaseUrl(item.logo)" class="asd-logo">
+					<div class="c-sdwa">
+						<div class="fghf">{{ item.currency_name }} / USDC
+
+							<img class="qklx-img" src="@/assets/116.png" />
+						</div>
+						<div class="qklx">{{ item.type }}</div>
+
+					</div>
+				</div>
+				<div class="dsd-right">
+					<span class="dr-s">{{ item.now_price|toFixedN(4) }}</span>
+					<span class="dr-x" :class="{'green2':item.change>=0}">{{ (item.change - 0).toFixed(2) }}%</span>
+				</div>
+			</div>
+
+
+		</div>
+	</div>
+</template>
+
+<script>
+	export default {
+		name: "market",
+		data() {
+			return {
+				tabsList: [{
+						type: '0',
+						text: "自選"
+					},
+					{
+						type: '1',
+						text: "現貨"
+					},
+					{
+						type: '2',
+						text: "合約"
+					},
+					{
+						type: '3',
+						text: "期權"
+					}
+				],
+				tabsName: '0',
+				tabsList2: [
+					[],
+
+					[{
+						type: '1',
+						text: "數字貨幣"
+					}],
+					[{
+
+							type: '1',
+							text: "數字貨幣"
+						},
+						{
+							type: '2',
+							text: "外匯"
+						},
+						{
+							type: '3',
+							text: "美股"
+						},
+						{
+							type: '4',
+							text: "韓股"
+						},
+					],
+					[{
+
+							type: '1',
+							text: "數字貨幣"
+						},
+						{
+							type: '2',
+							text: "外匯"
+						},
+						{
+							type: '3',
+							text: "美股"
+						},
+						{
+							type: '4',
+							text: "韓股"
+						},
+						{
+							type: '7',
+							text: "港股"
+						},
+						{
+							type: '5',
+							text: "ETF"
+						},
+						{
+							type: '6',
+							text: "NFT"
+						},
+					]
+				],
+				tabsName2: 1,
+				input1: "",
+				ids: 0,
+				isShow: 0,
+				tabList: [],
+				marketList: [],
+				newData: ["MTS", "$0.076128", "-1.11%"],
+				legal_index: this.$route.params.legal_index,
+				currency_index: this.$route.params.currency_index,
+				tradeDatas: "",
+				index2: 0,
+				index1: 0,
+				dataList: [],
+				selectedId: "",
+				shareNum: '',
+				cmtabs: [],
+				cmtabsCurrent: 0,
+				quotationList: []
+			};
+		},
+		filters: {
+			toFixedN(val, n) {
+				return (val - 0).toFixed(n);
+			}
+		},
+		created: function() {
+			this.socket(localStorage.getItem("token"));
+			let that = this;
+			//法币列表
+			this.$http({
+					url: "/api/" + "currency/quotation_new",
+					method: "get",
+					data: {},
+					headers: {
+						Authorization: localStorage.getItem("token")
+					}
+				}).then(res => {
+					if (res.data.type == "ok") {
+						that.tabList = res.data.message;
+						var msg = res.data.message;
+						var arr_quota = [];
+						let index = 0;
+						let indexs = 0;
+						if (!localStorage.getItem("index1")) {
+							index = that.index1;
+						} else {
+							index = localStorage.getItem("index1");
+							that.index1 = localStorage.getItem("index1");
+						}
+						if (!localStorage.getItem("index2")) {
+							indexs = that.index2;
+						} else {
+							indexs = localStorage.getItem("index2");
+							that.index2 = localStorage.getItem("index2");
+						}
+						that.marketList = res.data.message[index].quotation;
+						that.selectedId = res.data.message[index].quotation[that.index2].legal_id;
+						that.dataList = res.data.message;
+						that.shareNum = res.data.message[index].quotation[that.index2].lever_share_num;
+						window.localStorage.setItem("shareNum", that.shareNum);
+						//默认法币id和name
+						if (!localStorage.getItem("legal_id") && !localStorage.getItem("currency_id") && !
+							localStorage.getItem("legal_name") && !localStorage.getItem("currency_name")) {
+							that.currency_name = msg[index].quotation[indexs].currency_name;
+							that.currency_id = msg[index].quotation[indexs].currency_id;
+							window.localStorage.setItem(
+								"currency_name",
+								msg[index].quotation[indexs].currency_name
+							);
+							window.localStorage.setItem(
+								"legal_id",
+								msg[index].quotation[indexs].legal_id
+							);
+							window.localStorage.setItem(
+								"currency_id",
+								msg[index].quotation[indexs].currency_id
+							);
+							window.localStorage.setItem(
+								"lever_currency_name",
+								msg[index].quotation[indexs].currency_name
+							);
+							window.localStorage.setItem(
+								"lever_legal_id",
+								msg[index].quotation[indexs].legal_id
+							);
+							window.localStorage.setItem(
+								"lever_currency_id",
+								msg[index].quotation[indexs].currency_id
+							);
+						} else {
+							that.currency_name = window.localStorage.getItem("currency_name");
+							that.currency_id = window.localStorage.getItem("currency_id");
+						}
+					}
+				})
+				.catch(error => {
+					console.log(error);
+				});
+			if (
+				window.localStorage.getItem("index2") &&
+				window.localStorage.getItem("index1")
+			) {
+				this.index2 = window.localStorage.getItem("index2");
+				this.index1 = window.localStorage.getItem("index1");
+			}
+		},
+		mounted() {
+			var that = this;
+			eventBus.$on("toNew", function(data) {
+				//    console.log(data);
+				if (data) {
+					var newprice = data.newprice;
+					var cname = data.istoken;
+					var newup = Number(data.newup).toFixed(2);
+					// console.log(newup)
+					if (newup >= 0) {
+						newup = "+" + Number(newup).toFixed(2) + "%";
+						$("span[data-name='" + cname + "']")
+							.next()
+							.css("color", "#55a067");
+					} else {
+						newup = newup + "%";
+						$("span[data-name='" + cname + "']")
+							.next()
+							.css("color", "#cc4951");
+					}
+					$("span[data-name='" + cname + "']")
+						.html("$" + newprice)
+						.next()
+						.html(newup);
+				}
+			});
+
+			eventBus.$on('updateDaymarkey', res => {
+
+				// console.log(res,'接受到更新数据');
+				if (res !== undefined && res.currency_id !== undefined) {
+					for (let i = 0; i < that.marketList.length; i++) {
+						if (that.marketList[i] == undefined) {
+							console.log(i);
+						} else {
+							if (that.marketList[i].currency_id == res.currency_id && res.legal_id == 3) {
+								that.marketList[i].now_price = res.close;
+								that.marketList[i].change = res.change;
+							}
+						}
+					}
+				} else {
+					console.log('没有的', res);
+				}
+			});
+
+			// this.marketSocket();
+		},
+		methods: {
+			handleClick(item) {
+				console.log('indsd', item.index)
+				this.tabsName = item.index
+				this.tabsName2 = '1'
+			},
+			handleClick2(index) {
+
+				this.tabsName2 = index
+			},
+			changeType(index, currency, currency_id) {
+				this.index1 = index;
+				this.index2 = null;
+				$(".currency_p p").removeClass("active_p");
+
+				this.isShow = index;
+				this.ids = "a";
+				//    this.currency_name = currency;
+				//    this.currency_id = currency_id;
+				this.marketList = this.dataList[index].quotation;
+			},
+			getSymbols(callback) {
+				if (this.address.length <= 0) {
+					return false;
+				}
+				this.$http({
+						url: "/api/" + "wallet/list?user_id=" + this.address || "",
+						type: "GET"
+					})
+					.then(res => {
+						if (res.data.type == "ok") {
+							this.accountInfo = res.data.message;
+							this.dataList = res.data.message.list;
+
+							callback && callback();
+						} else {}
+					})
+					.catch(error => {
+						return error;
+					});
+			},
+
+			marketSocket() {
+				var that = this;
+				that.$socket.emit("login", localStorage.getItem("user_id"));
+				that.sockets.subscribe("daymarket", msg => {
+					if (msg.type == "daymarket") {
+						for (var i = 0; i < that.quotationList.length; i++) {
+							if (
+								that.quotationList[i].legal_id == msg.legal_id &&
+								that.quotationList[i].currency_id == msg.currency_id
+							) {
+								that.quotationList[i].now_price = msg.now_price;
+								// that.quotationList[i].spread = msg.spread;
+								that.quotationList[i].change = msg.change;
+								that.quotationList[i].volume = msg.volume;
+							}
+						}
+					}
+				});
+			},
+			//币种切换
+			quota_shift(idx, id, legal_name, currency_name, currency_id, change, shareNum, logo) {
+				window.localStorage.setItem("downUp", change);
+				window.localStorage.setItem("legal_id_cur", currency_id);
+
+				window.localStorage.setItem("index1", this.index1);
+				window.localStorage.setItem("index2", idx);
+				window.localStorage.setItem("shareNum", shareNum);
+				window.localStorage.setItem("bzlogo", logo);
+				this.ids = idx;
+				var tradeDatas = {
+					currency_id: currency_id,
+					legal_id: id,
+					currency_name: currency_name,
+					leg_name: legal_name
+				};
+				window.localStorage.setItem("legal_id", id);
+				window.localStorage.setItem("currency_id", currency_id);
+				window.localStorage.setItem("legal_name", legal_name);
+				window.localStorage.setItem("currency_name", currency_name);
+				var symbol = currency_name + "/" + legal_name;
+				window.localStorage.setItem("symbol", symbol);
+				location.reload();
+				//向兄弟组件传数据
+				//    eventBus.$emit('toTrade',tradeDatas);
+				//    eventBus.$emit('toExchange',tradeDatas)
+			},
+
+			//socket连接封装
+			socket(token) {
+				var that = this;
+				//console.log("socket");
+				that.$socket.emit("login", localStorage.getItem("user_id"));
+				that.sockets.subscribe("kline", msg => {
+					if (msg.type == 'kline' && msg.period == '1min') {
+
+
+
+						for (var i = 0; i < that.marketList.length; i++) {
+							if (that.marketList[i].legal_id == msg.legal_id && that.marketList[i]
+								.currency_id == msg.currency_id) {
+								// console.log('旧数据',that.quotationList[i].now_price)
+								// console.log('wss新数据',msg.now_price)
+								// console.log('------------------------')
+								that.marketList[i].now_price = msg.close;
+								// that.quotationList[i].change = msg.change;
+								// that.marketList[i].change = (((msg.close - msg.open) / msg.open) * 100).toFixed(2);
+								// that.marketList[i].volume = msg.volume;
+								// that.marketList[i].high = msg.high;
+								// that.marketList[i].low = msg.low;
+
+							}
+						}
+
+					}
+				})
+				that.sockets.subscribe("daymarket", msg => {
+					if (msg.type == "daymarket") {
+						for (var i = 0; i < that.marketList.length; i++) {
+							if (that.marketList[i].legal_id == msg.legal_id && that.marketList[i]
+								.currency_id == msg.currency_id) {
+								that.marketList[i].change = msg.change;
+								that.marketList[i].volume = msg.volume * 15;
+								that.marketList[i].high = msg.high;
+								that.marketList[i].low = msg.low;
+							}
+						}
+					}
+				});
+
+			}
+		}
+	};
+</script>
+
+<style scoped lang="scss">
+	.m_title {
+		height: 55px;
+		padding: 15px 30px;
+		line-height: 25px;
+		position: relative;
+	}
+
+	.sadfs {}
+
+	.m_search input {
+		border-radius: 3px;
+		background: transparent;
+		border: 1px solid #52688c;
+		line-height: 25px;
+	}
+
+	/* .m_search{position: absolute;width: 146px;right: 20px;top: -4px;height: 26px;border-radius: 3px;padding: 4px 8px 4px 0;} */
+	/* .m_search input{position: absolute;left: 0;top: 10px;z-index: 2;width: 100%;padding: 5px 40px 5px 8px;height: 26px;border-radius: 3px;background: transparent;border: 1px solid #52688c;} */
+	.m_search img {
+		width: 16px;
+		height: 15px;
+		position: absolute;
+		right: 35px;
+		top: 20px;
+		z-index: 123;
+	}
+
+	/* .m_filter{padding: 10px 0 15px;} */
+	.m_filter {
+		font-size: 14px;
+	}
+
+	.tabtitle {
+		padding: 0 25px;
+	}
+
+	.tabtitle span {
+		text-align: center;
+		margin-right: 25px;
+	}
+
+	.coin-title div {
+		width: 33.3%;
+		height: 36px;
+		line-height: 36px;
+		text-align: center;
+		float: left;
+		color: #637085;
+		font-size: 12px;
+	}
+
+	.coin-title img {
+		vertical-align: middle;
+		margin-top: -3px;
+	}
+
+	.line {
+		width: 100%;
+		margin: 0px auto;
+		border-bottom: 1px solid rgb(48, 59, 75);
+	}
+
+	.coin-wrap {
+		height: auto;
+		overflow: hidden;
+	}
+
+	.coin-wrap li {
+		height: 39.2px;
+		line-height: 39.2px;
+		cursor: pointer;
+		font-size: 0.875rem;
+		color: #333;
+	}
+
+	.coin-wrap li span {
+		display: block;
+		// width: 33%;
+		// float: left;
+		text-align: center;
+	}
+
+	.coin-wrap li span:last-child {
+		color: #666;
+	}
+
+	.coin-title {
+		div:first-child {
+			text-indent: 20px;
+			text-align: left;
+		}
+	}
+
+	.currency_p {
+		p {
+			span:first-child {
+				text-align: left;
+				text-indent: 20px;
+			}
+		}
+	}
+
+	/* .coin-wrap li:nth-child(odd){background-color: #181b2a;} */
+	.green {
+		color: #00f0ff;
+	}
+
+	.coin-wrap li p {
+		overflow: hidden;
+	}
+
+	.active_p {
+		background-color: #2b3648;
+	}
+
+	.coin-wrap li p:hover {
+
+		background: rgba(0, 164, 261, 0.1);
+	}
+
+	.sdgvs {
+		padding-bottom: 100px;
+	}
+
+	.cscs {
+		display: flex;
+		margin-left: 5px;
+		align-items: center;
+	}
+
+	.c-sdwa {
+		display: flex;
+		flex-direction: column;
+	}
+
+	.hq-item {
+		display: flex;
+		align-items: center;
+		padding: 16px;
+	}
+
+	.asd-logo {
+		width: 24px;
+		height: 24px;
+		margin-right: 4px;
+		border-radius: 50%;
+		background-color: #000000;
+	}
+
+	.dsd-right {
+		margin-left: auto;
+		display: flex;
+		flex-direction: column;
+		align-items: flex-end;
+
+	}
+
+	.dsd-right .dr-s {
+		font-size: 14px;
+		color: #fff;
+	}
+
+	.dsd-right .dr-x {
+		color: red;
+	}
+
+	.dsd-right .green2 {
+		color: #00f0ff;
+	}
+
+	.fghf {
+		font-size: 14px;
+		color: #fff;
+	}
+
+	.qklx {
+		color: #888888;
+	}
+
+	.ssk {
+		padding: 20px 30px 10px;
+		color: #fff;
+		// height: 32px;
+	}
+
+	.tabs-box {
+		padding: 0 30px;
+		border-bottom: 1px solid #232437;
+	}
+
+	.market ::v-deep {
+
+		.el-input__inner {
+			background: transparent !important;
+			color: #fff !important;
+		}
+
+		.el-tabs__item {
+			font-size: 14px !important;
+			font-weight: 500 !important;
+		}
+
+		.el-tabs__nav-wrap::after {
+
+			height: 1px;
+
+		}
+
+		.el-tabs__header {
+			margin-bottom: 0;
+		}
+
+
+		.el-tabs__active-bar {
+			background-color: #fff;
+		}
+	}
+
+	.tbs2 {
+		display: flex;
+		padding: 10px 12px;
+		white-space: nowrap;
+		overflow-y: auto;
+	}
+
+	/* 滚动条轨道样式 */
+	.tbs2::-webkit-scrollbar {
+		// width: 2px; /* 设置滚动条宽度 */
+		height: 6px;
+	}
+
+	/* 滚动条滑块样式 */
+	.tbs2::-webkit-scrollbar-thumb {
+		background-color: #888;
+		/* 设置滑块背景颜色 */
+		border-radius: 4px;
+		/* 设置滑块圆角 */
+	}
+
+	.tb2itme {
+		cursor: pointer;
+		color: #888;
+		background-color: unset;
+		margin-right: 20px;
+		font-size: 14px;
+	}
+
+	.tb2itmeAvtive {
+		color: #fff;
+	}
+
+	@media screen and (max-width: 800px) {
+		.sdgvs {
+			padding-bottom: 20px;
+		}
+	}
+
+	.day {
+		.coin-wrap li {
+
+			color: #ced0d4;
+		}
+	}
+</style>
\ No newline at end of file
diff --git a/src/view/market.vue b/src/view/market.vue
new file mode 100644
index 0000000..411335a
--- /dev/null
+++ b/src/view/market.vue
@@ -0,0 +1,785 @@
+<template>
+  <div class="market" style="height: 100%">
+    <div class="ssk">
+      <el-input
+        :placeholder="$t('zjde152')"
+        @input="inputChange"
+        size="small"
+        prefix-icon="el-icon-search"
+        v-model="sousuo"
+      >
+      </el-input>
+    </div>
+
+    <div class="cm-tabs-group">
+      <span
+        class="cm-tab"
+        :class="{ 'active-btn-bg': cmtabsCurrent == item.id }"
+        v-for="(item, index) in cmtabs"
+        @click="cmTab(item.id)"
+        :key="index"
+        >{{ item.pcname }}</span
+      >
+    </div>
+
+    <!-- <div class="tabs-box">
+			<el-tabs v-model="tabsName" @tab-click="handleClick">
+
+
+
+				<el-tab-pane v-for="(item,index) in tabsList" :label="item.text" :name="item.type"></el-tab-pane>
+
+			</el-tabs>
+		</div>
+		<div class="tbs2">
+			<div class="tb2itme" :class="{'tb2itmeAvtive':tabsName2==item.type}" v-for="(item,index) in tabsList2[tabsName]"
+				@click="handleClick2(item.type)">{{item.text}}</div>
+		</div> -->
+
+    <div class="m_filter">
+      <div class="tabtitle fColor1 ft14 curPer flex">
+        <!-- <span>JNB</span>
+        <span>JNB</span>-->
+        <!-- <span v-for="(tab,index) in tabList " :key="index" :class="index==index1?'active':''"  @click="changeType(index,tab.name,tab.id)">{{tab.name}}</span> -->
+      </div>
+    </div>
+    <div class="coin-title clear" v-if="false">
+      <div>
+        <span style="color: #00a4d8">{{ $t("market.currency") }}</span>
+        <!--<img src="../assets/images/select0.png" alt>-->
+      </div>
+      <div>
+        <span>{{ $t("market.lastprice") }}</span>
+        <!--<img src="../assets/images/select0.png" alt>-->
+      </div>
+      <div>
+        <span>{{ $t("market.change") }}</span>
+        <!--<img src="../assets/images/select0.png" alt>-->
+      </div>
+    </div>
+    <!-- <div class="line"></div> -->
+    <div class="coin-wrap scroll sdgvs" style="height: 90%; overflow: auto; color: #fff">
+      <!-- :class="index==index2?'active_p':''" -->
+      <!-- <li class="currency_p" v-for="(item,index) in marketList " :key="index"
+				@click="quota_shift(index,item.legal_id,item.legal_name,item.currency_name,item.currency_id,item.change,item.lever_share_num)"
+				v-if="item.is_display == 1" v-show="item.currency_name!='USDC'">
+				<div style="white-space: nowrap; display: flex; justify-content: space-between; padding-right: 2rem;">
+
+					<div class="cscs">
+						<img :src="$utils.isBaseUrl(item.logo)" style="width: 24px; height: 24px;">
+						<div class="c-sdwa">
+							<span>{{ item.currency_name }} / USDC
+
+								<img src="@/assets/116.png" />
+							</span>
+							<span>{{ item.type }}</span>
+
+						</div>
+					</div>
+					<span>{{ item.now_price|toFixedN(4) }}</span>
+					<span
+						:class="{'green':item.change>=0,'red':item.change<0}">{{ (item.change - 0).toFixed(2) }}%</span>
+				</div>
+			</li> -->
+      <div
+        class="hq-item"
+        v-for="(item, index) in cmtabsCurrent == 100 ? intersection : quotationList"
+        :key="index"
+        @click="
+          goTrade(
+            item.legal_id,
+            item.currency_id,
+            item.legal_name,
+            item.currency_name,
+            item.now_price,
+            item.change,
+            item.volume,
+            item.cny_price,
+            item.logo,
+            item.id
+          )
+        "
+      >
+        <div @click.stop="addZX(item, iszx(item.currency_id))">
+          <i
+            class="el-icon-star-on"
+            :style="{ color: iszx(item.currency_id) ? '#f0c163' : '' }"
+            style="font-size: 16px"
+          ></i>
+        </div>
+        <div class="cscs">
+          <img :src="$utils.isBaseUrl(item.logo)" class="asd-logo" />
+          <div class="c-sdwa">
+            <div class="fghf">
+              {{ item.currency_name }} / USDC
+
+              <img class="qklx-img" src="@/assets/116.png" />
+            </div>
+            <div class="qklx">{{ item.type }}</div>
+          </div>
+        </div>
+        <div class="dsd-right">
+          <span class="dr-s">{{ item.now_price | toFixedN(4) }}</span>
+          <span class="dr-x" :class="{ green2: item.change >= 0 }"
+            >{{ (item.change - 0).toFixed(2) }}%</span
+          >
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "market",
+  filters: {
+    numFilters: function (value, num) {
+      if (!value) {
+        return "0.0000";
+      }
+      value = (value - 0).toFixed(parseInt(num)).toString();
+      return value.slice(0) + " ";
+    },
+  },
+  data() {
+    return {
+      rlist: [
+        {
+          title: this.$t("zjde60"),
+        },
+        {
+          title: this.$t("zjde61"),
+        },
+      ],
+      tindex: 1,
+      sousuo: "",
+      dqIndex: 0,
+      hot: [],
+      increase: [],
+      quotation: [],
+      quotation2: [],
+      loginFlag: false,
+      lang: "en",
+      price: 12312.22,
+      share_bit: 121325.55,
+      share_ethereum: 12318978.77,
+      trade: 318978.77,
+      night_mode: 0,
+      intersection: [],
+      zix: [],
+      cmtabs: [],
+      cmtabsCurrent: 0,
+      quotationList: [],
+    };
+  },
+
+  created() {
+    this.night_mode = localStorage.getItem("night_mode") || 0;
+    this.lang = window.localStorage.getItem("lang");
+
+    let t = localStorage.getItem("token");
+    t && (this.loginFlag = true);
+
+    this.getMarket();
+    this.getRange();
+    this.getQuotation();
+    this.connect();
+  },
+  watch: {},
+  // mounted() {
+
+  // },
+  methods: {
+    cmTab(index) {
+      this.cmtabsCurrent = index;
+      if (index != 100) {
+        this.getList2();
+      }
+      window.localStorage.setItem("cmtabsCurrent", index);
+    },
+    getMarket() {
+      let duizhao = {
+        外汇: this.$t("homeContent.外汇"),
+        美股: this.$t("homeContent.美股"),
+        期货: this.$t("homeContent.期货"),
+        数字货币: this.$t("homeContent.数字货币"),
+      };
+      this.$http({
+        url: "/api/currency/bclass",
+        method: "get",
+      }).then((res) => {
+        if (res.data.code == 1) {
+          var data = res.data.data;
+          data = data.filter((item) => item.pcname === "数字货币");
+          for (const item of data) {
+            const { pcname = "" } = item;
+            if (duizhao[pcname]) {
+              item["pcname"] = duizhao[pcname];
+            }
+          }
+          this.cmtabs = data;
+          let cmtabsCurrent = window.localStorage.getItem("cmtabsCurrent");
+          const validIds = this.cmtabs.map((i) => String(i.id));
+          if (cmtabsCurrent && validIds.includes(String(cmtabsCurrent))) {
+            this.cmtabsCurrent = cmtabsCurrent;
+          } else if (this.cmtabs.length > 0) {
+            this.cmtabsCurrent = this.cmtabs[0].id;
+          }
+
+          this.getList2();
+
+          // console.log('data23454',data)
+        }
+      });
+    },
+    getList2() {
+      layer.load();
+      this.$http({
+        url: `/api/currency/quotation_huang?is_class=${this.cmtabsCurrent}`,
+        method: "get",
+      }).then((res) => {
+        let quotation = res.data.message[0].quotation;
+        this.quotationList = [...quotation];
+        //todo
+        this.$mitt.$emit("currenyChange", quotation);
+        layer.closeAll();
+      });
+    },
+
+    iszx(id) {
+      if (this.intersection.length == 0) return false;
+      let zss = this.intersection.filter((item) => item.currency_id == id);
+
+      return zss.length ? true : false;
+    },
+    getList() {
+      this.$http({
+        url: `/api/optional/list`,
+        method: "get",
+        headers: {
+          Authorization: localStorage.getItem("token") || "",
+        },
+      }).then((res) => {
+        // console.log('自选', res.data.message)
+        this.zix = res.data.message;
+        let intersection = [];
+
+        this.quotation2.forEach((obj1) => {
+          let obj2 = res.data.message.find((obj) => obj.currency_id === obj1.currency_id);
+          if (obj2) {
+            intersection.push(obj1);
+          }
+        });
+        // console.log('intersection', intersection)
+        this.intersection = intersection;
+
+        // this.orderList = res.data.message.order_list
+        // this.dataList = res.data.message
+      });
+    },
+    addZX(item, flas) {
+      // this.$http.post("api/optional/add", {
+      // 	currency_id: item.currency_id,
+      // 	Authorization: localStorage.getItem("token") || ""
+
+      // }).then(res => {
+      // 	if (res.data.type == "ok") {
+
+      // 	} else {
+      // 		// layer.msg(res.message);
+      // 	}
+      // });
+      console.log("flas", flas);
+      layer.load();
+      if (flas) {
+        this.$http({
+          url: `/api/optional/del`,
+          method: "post",
+          data: {
+            id: this.zix.filter((val) => val.currency_id == item.currency_id)[0].id,
+          },
+          headers: {
+            Authorization: localStorage.getItem("token") || "",
+          },
+        }).then((res) => {
+          layer.closeAll();
+          this.getList();
+          // this.orderList = res.data.message.order_list
+          // this.dataList = res.data.message
+        });
+      } else {
+        this.$http({
+          url: `/api/optional/add`,
+          method: "post",
+          data: {
+            currency_id: item.currency_id,
+          },
+          headers: {
+            Authorization: localStorage.getItem("token") || "",
+          },
+        }).then((res) => {
+          layer.closeAll();
+          this.getList();
+          // this.orderList = res.data.message.order_list
+          // this.dataList = res.data.message
+        });
+      }
+    },
+    zfdf(index) {
+      this.tindex = index;
+    },
+    inputChange(e) {
+      // .indexOf(e) != -1
+      if (e) {
+        let data = this.quotation2.filter((item) => item.currency_name.includes(e));
+        this.quotationList = data;
+      } else {
+        this.quotationList = this.quotation2;
+      }
+    },
+    getQuotation() {
+      const that = this;
+      this.$http.get("api/currency/quotation_new", {}).then((res) => {
+        if (res.data.type == "ok") {
+          that.quotation = res.data.message[0].quotation;
+          that.quotation2 = res.data.message[0].quotation;
+          this.getList();
+        } else {
+          // layer.msg(res.message);
+        }
+      });
+    },
+    getRange() {
+      const that = this;
+      this.$http.get("api/currency/rangeNew", {}).then((res) => {
+        if (res.data.type == "ok") {
+          that.hot = res.data.message.hot;
+          that.increase = res.data.message.increase;
+        } else {
+          // layer.msg(res.message);
+        }
+      });
+    },
+    //去币币交易页
+    goTrade(
+      l_id,
+      c_id,
+      l_name,
+      c_name,
+      now_price,
+      change,
+      volume,
+      cny_price,
+      logo,
+      leverTradeId
+    ) {
+      console.log(
+        "111",
+        l_id,
+        c_id,
+        l_name,
+        c_name,
+        now_price,
+        change,
+        volume,
+        cny_price,
+        logo,
+        leverTradeId
+      );
+      window.localStorage.setItem("currency_id", c_id);
+      window.localStorage.setItem("legal_id", l_id);
+      window.localStorage.setItem("currency_name", c_name);
+      window.localStorage.setItem("legal_name", l_name);
+      window.localStorage.setItem("symbol", c_name + "/" + l_name);
+      window.localStorage.setItem("bzlogo", logo);
+      window.localStorage.setItem("leverTradeId", leverTradeId);
+      window.localStorage.setItem("cmtabsCurrent", this.cmtabsCurrent);
+      // console.log('logo',logo)
+      // this.$router.push('/leverdealCenter')
+      location.reload();
+    },
+    connect() {
+      var that = this;
+      that.$socket.emit("login", localStorage.getItem("user_id"));
+      that.sockets.subscribe("kline", (msg) => {
+        // console.log(msg.type);
+        if (msg.type == "kline" && msg.period == "1min") {
+          for (var i = 0; i < that.quotationList.length; i++) {
+            if (
+              that.quotationList[i].legal_id == msg.legal_id &&
+              that.quotationList[i].currency_id == msg.currency_id
+            ) {
+              that.quotationList[i].now_price = msg.close * 1;
+              // that.quotation[i].change = (((msg.close - msg.open) / msg.open) * 100).toFixed(2)
+              // that.quotation[i].volume = msg.volume * 1;
+              // that.quotation[i].high = msg.high * 1;
+              // that.quotation[i].low = msg.low * 1;
+            }
+          }
+
+          for (var i = 0; i < that.hot.length; i++) {
+            if (
+              that.hot[i].legal_id == msg.legal_id &&
+              that.hot[i].currency_id == msg.currency_id
+            ) {
+              that.hot[i].now_price = msg.close * 1;
+              // that.quotation[i].change = (((msg.close - msg.open) / msg.open) * 100).toFixed(2)
+              // that.quotation[i].volume = msg.volume * 1;
+              // that.quotation[i].high = msg.high * 1;
+              // that.quotation[i].low = msg.low * 1;
+            }
+          }
+          for (var i = 0; i < that.increase.length; i++) {
+            if (
+              that.increase[i].legal_id == msg.legal_id &&
+              that.increase[i].currency_id == msg.currency_id
+            ) {
+              that.increase[i].now_price = msg.close * 1;
+              // that.quotation[i].change = (((msg.close - msg.open) / msg.open) * 100).toFixed(2)
+              // that.quotation[i].volume = msg.volume * 1;
+              // that.quotation[i].high = msg.high * 1;
+              // that.quotation[i].low = msg.low * 1;
+            }
+          }
+        }
+      });
+      this.sockets.subscribe("daymarket", (msg) => {
+        if (msg.type == "daymarket") {
+          for (var i = 0; i < that.quotationList.length; i++) {
+            if (
+              that.quotationList[i].legal_id == msg.legal_id &&
+              that.quotationList[i].currency_id == msg.currency_id
+            ) {
+              that.quotationList[i].volume = msg.volume * 15;
+              that.quotationList[i].high = msg.high * 1;
+              that.quotationList[i].low = msg.low * 1;
+              that.quotationList[i].change = msg.change;
+            }
+          }
+          for (var i = 0; i < that.hot.length; i++) {
+            if (
+              that.hot[i].legal_id == msg.legal_id &&
+              that.hot[i].currency_id == msg.currency_id
+            ) {
+              that.hot[i].volume = msg.volume * 15;
+              that.hot[i].high = msg.high * 1;
+              that.hot[i].low = msg.low * 1;
+              that.hot[i].change = msg.change;
+            }
+          }
+          for (var i = 0; i < that.increase.length; i++) {
+            if (
+              that.increase[i].legal_id == msg.legal_id &&
+              that.increase[i].currency_id == msg.currency_id
+            ) {
+              that.increase[i].volume = msg.volume * 15;
+              that.increase[i].high = msg.high * 1;
+              that.increase[i].low = msg.low * 1;
+              that.increase[i].change = msg.change;
+            }
+          }
+        }
+      });
+    },
+  },
+};
+</script>
+
+<style scoped lang="scss">
+.m_title {
+  height: 55px;
+  padding: 15px 30px;
+  line-height: 25px;
+  position: relative;
+}
+
+.sadfs {
+}
+
+.m_search input {
+  border-radius: 3px;
+  background: transparent;
+  border: 1px solid #52688c;
+  line-height: 25px;
+}
+
+/* .m_search{position: absolute;width: 146px;right: 20px;top: -4px;height: 26px;border-radius: 3px;padding: 4px 8px 4px 0;} */
+/* .m_search input{position: absolute;left: 0;top: 10px;z-index: 2;width: 100%;padding: 5px 40px 5px 8px;height: 26px;border-radius: 3px;background: transparent;border: 1px solid #52688c;} */
+.m_search img {
+  width: 16px;
+  height: 15px;
+  position: absolute;
+  right: 35px;
+  top: 20px;
+  z-index: 123;
+}
+
+/* .m_filter{padding: 10px 0 15px;} */
+.m_filter {
+  font-size: 14px;
+}
+
+.tabtitle {
+  padding: 0 25px;
+}
+
+.tabtitle span {
+  text-align: center;
+  margin-right: 25px;
+}
+
+.coin-title div {
+  width: 33.3%;
+  height: 36px;
+  line-height: 36px;
+  text-align: center;
+  float: left;
+  color: #637085;
+  font-size: 12px;
+}
+
+.coin-title img {
+  vertical-align: middle;
+  margin-top: -3px;
+}
+
+.line {
+  width: 100%;
+  margin: 0px auto;
+  border-bottom: 1px solid rgb(48, 59, 75);
+}
+
+.coin-wrap {
+  height: auto;
+  overflow: hidden;
+}
+
+.coin-wrap li {
+  height: 39.2px;
+  line-height: 39.2px;
+  cursor: pointer;
+  font-size: 0.875rem;
+  color: #333;
+}
+
+.coin-wrap li span {
+  display: block;
+  // width: 33%;
+  // float: left;
+  text-align: center;
+}
+
+.coin-wrap li span:last-child {
+  color: #666;
+}
+
+.coin-title {
+  div:first-child {
+    text-indent: 20px;
+    text-align: left;
+  }
+}
+
+.currency_p {
+  p {
+    span:first-child {
+      text-align: left;
+      text-indent: 20px;
+    }
+  }
+}
+
+/* .coin-wrap li:nth-child(odd){background-color: #181b2a;} */
+.green {
+  color: #00f0ff;
+}
+
+.coin-wrap li p {
+  overflow: hidden;
+}
+
+.active_p {
+  background-color: #2b3648;
+}
+
+.coin-wrap li p:hover {
+  background: rgba(0, 164, 261, 0.1);
+}
+
+.sdgvs {
+  padding-bottom: 100px;
+}
+
+.cscs {
+  display: flex;
+  margin-left: 5px;
+  align-items: center;
+}
+
+.c-sdwa {
+  display: flex;
+  flex-direction: column;
+}
+
+.hq-item {
+  display: flex;
+  align-items: center;
+  padding: 16px;
+}
+
+.asd-logo {
+  width: 24px;
+  height: 24px;
+  margin-right: 4px;
+  border-radius: 50%;
+  background-color: #000000;
+}
+
+.dsd-right {
+  margin-left: auto;
+  display: flex;
+  flex-direction: column;
+  align-items: flex-end;
+}
+
+.dsd-right .dr-s {
+  font-size: 14px;
+  color: #fff;
+}
+
+.dsd-right .dr-x {
+  color: red;
+}
+
+.dsd-right .green2 {
+  color: #00f0ff;
+}
+
+.fghf {
+  font-size: 14px;
+  color: #fff;
+}
+
+.qklx {
+  color: #888888;
+}
+
+.ssk {
+  padding: 20px 30px 10px;
+  color: #fff;
+  // height: 32px;
+}
+
+.tabs-box {
+  padding: 0 30px;
+  border-bottom: 1px solid #232437;
+}
+
+.market ::v-deep {
+  .el-input__inner {
+    background: transparent !important;
+    color: #fff !important;
+  }
+
+  .el-tabs__item {
+    font-size: 14px !important;
+    font-weight: 500 !important;
+  }
+
+  .el-tabs__nav-wrap::after {
+    height: 1px;
+  }
+
+  .el-tabs__header {
+    margin-bottom: 0;
+  }
+
+  .el-tabs__active-bar {
+    background-color: #fff;
+  }
+}
+
+.tbs2 {
+  display: flex;
+  padding: 10px 12px;
+  white-space: nowrap;
+  overflow-y: auto;
+}
+
+/* 滚动条轨道样式 */
+.tbs2::-webkit-scrollbar {
+  // width: 2px; /* 设置滚动条宽度 */
+  height: 6px;
+}
+
+/* 滚动条滑块样式 */
+.tbs2::-webkit-scrollbar-thumb {
+  background-color: #888;
+  /* 设置滑块背景颜色 */
+  border-radius: 4px;
+  /* 设置滑块圆角 */
+}
+
+.tb2itme {
+  cursor: pointer;
+  color: #888;
+  background-color: unset;
+  margin-right: 20px;
+  font-size: 14px;
+}
+
+.tb2itmeAvtive {
+  color: #fff;
+}
+
+.cm-tabs-group {
+  display: flex;
+  align-items: center;
+  border-bottom: 1px solid #31323f;
+  margin-bottom: 10px;
+  overflow-y: auto;
+}
+
+.cm-tabs-group::-webkit-scrollbar {
+  height: 6px;
+  width: 10px;
+  background-color: #333;
+}
+
+.cm-tabs-group::-webkit-scrollbar-thumb {
+  background-color: #666;
+  border-radius: 10px;
+  min-width: 20px;
+}
+
+.cm-tab {
+  height: 39px;
+  display: flex;
+
+  align-items: center;
+  justify-content: center;
+  white-space: nowrap;
+  font-size: 14px;
+  color: #888;
+  text-align: center;
+  padding: 2px 8px 0;
+  cursor: pointer;
+}
+
+.active-btn-bg {
+  color: #fff;
+  border-bottom: 1px solid #fff;
+}
+
+@media screen and (max-width: 800px) {
+  .sdgvs {
+    padding-bottom: 20px;
+  }
+}
+
+.day {
+  .coin-wrap li {
+    color: #ced0d4;
+  }
+}
+</style>
diff --git a/src/view/marketQuotaion.vue b/src/view/marketQuotaion.vue
new file mode 100644
index 0000000..a80e018
--- /dev/null
+++ b/src/view/marketQuotaion.vue
@@ -0,0 +1,1632 @@
+<template>
+  <!-- :class="night_mode==1?'dfdfd':'afsfs'"> -->
+  <div class="sdffsf afsfs">
+    <indexHeader></indexHeader>
+
+    <div class="quotes-page">
+      <div class="cm-card-title">
+        <img
+          class="icon-square"
+          style="width: 18px; height: 18px"
+          src="@/assets/127.png"
+        />
+        <span class="text fade-in-right">市場行情</span>
+      </div>
+
+      <div class="title">加密貨幣行情</div>
+      <div class="base">
+        <div class="item no-vw">
+          <div class="title">漲幅排行</div>
+          <div class="list">
+            <template v-for="(item, index) in increase">
+              <div
+                class="list-item"
+                v-if="index < 6"
+                :key="index"
+                @click="
+                  goTrade(
+                    item.legal_id,
+                    item.currency_id,
+                    item.legal_name,
+                    item.currency_name,
+                    item.now_price,
+                    item.change,
+                    item.volume,
+                    item.cny_price,
+                    item.logo
+                  )
+                "
+              >
+                <div class="coin">
+                  <img
+                    class="lazy-img iconhtth"
+                    alt=""
+                    :src="$utils.isBaseUrl(item.logo)"
+                  />
+                  <div class="name">{{ item.name }}</div>
+                </div>
+                <div class="price">${{ item.now_price }}</div>
+                <div class="percent" :class="item.change < 0 ? 'red' : 'green'">
+                  {{
+                    parseFloat(item.change) >= 0
+                      ? "+" + (item.change - 0).toFixed(2)
+                      : (item.change - 0).toFixed(2)
+                  }}%
+                </div>
+              </div>
+            </template>
+          </div>
+        </div>
+        <div class="item no-vw">
+          <div class="title">熱門幣種</div>
+          <div class="list">
+            <template v-for="(item, index) in quotation">
+              <div
+                class="list-item"
+                v-if="index < 6"
+                :key="index"
+                @click="
+                  goTrade(
+                    item.legal_id,
+                    item.currency_id,
+                    item.legal_name,
+                    item.currency_name,
+                    item.now_price,
+                    item.change,
+                    item.volume,
+                    item.cny_price,
+                    item.logo,
+                    item.id
+                  )
+                "
+              >
+                <div class="coin">
+                  <img
+                    class="lazy-img iconhtth"
+                    alt=""
+                    :src="$utils.isBaseUrl(item.logo)"
+                  />
+                  <div class="name">{{ item.currency_name }}</div>
+                </div>
+                <div class="price">${{ item.now_price }}</div>
+                <div class="percent" :class="item.change < 0 ? 'red' : 'green'">
+                  {{
+                    parseFloat(item.change) >= 0
+                      ? "+" + (item.change - 0).toFixed(2)
+                      : (item.change - 0).toFixed(2)
+                  }}%
+                </div>
+              </div>
+            </template>
+          </div>
+        </div>
+      </div>
+      <div class="tab-base">
+        <div class="cm-tabs-group">
+          <span
+            class="cm-tab"
+            :class="{ 'active-btn-bg': cmtabsCurrent == 100 }"
+            @click="cmTab(100)"
+          >
+            <!-- <i class="el-icon-star-on"></i> -->
+
+            <span>{{ $t("zx") }}</span>
+          </span>
+
+          <span
+            class="cm-tab"
+            :class="{ 'active-btn-bg': cmtabsCurrent == item.id }"
+            v-for="(item, index) in cmtabs"
+            @click="cmTab(item.id)"
+            :key="index"
+            >{{ item.pcname }}</span
+          >
+
+          <!-- <i class="cm-tab active-btn-bg"
+						:style="{transform: `translate(${cmtabsCurrent * 149.5 }px, 4px)`}"></i> -->
+        </div>
+        <div class="search">
+          <el-input @input="inputChange" :placeholder="$t('zjde152')" v-model="sousuo">
+            <i slot="prefix" class="el-input__icon el-icon-search"></i>
+          </el-input>
+        </div>
+      </div>
+      <!----><!---->
+
+      <div id="root">
+        <div class="d-flex ada" v-if="false">
+          <div class="price-container home-tickers" style="margin-top: 3rem">
+            <div
+              style="
+                display: flex;
+                justify-content: space-between;
+                margin-bottom: 20px;
+                align-items: center;
+              "
+            >
+              <div class="dbt">{{ $t("homeContent.market") }}</div>
+              <div>
+                <el-input
+                  @input="inputChange"
+                  :placeholder="$t('zjde152')"
+                  v-model="sousuo"
+                >
+                  <i slot="prefix" class="el-input__icon el-icon-search"></i>
+                </el-input>
+              </div>
+            </div>
+            <div class="rm">
+              <div
+                class="rm-item"
+                @click="
+                  goTrade(
+                    item.legal_id,
+                    item.currency_id,
+                    item.legal_name,
+                    item.currency_name,
+                    item.now_price,
+                    item.change,
+                    item.volume,
+                    item.cny_price,
+                    item.logo,
+                    item.id
+                  )
+                "
+                v-for="(item, index) in quotation2"
+                :key="index"
+                v-if="index <= 3"
+              >
+                <div class="hqzb">
+                  <div class="hb1">{{ item.currency_name }} / {{ item.legal_name }}</div>
+                  <div class="hb2">{{ item.now_price }}</div>
+
+                  <div class="hb3">≈ $ {{ item.now_price }}</div>
+                  <div class="hb4">
+                    <p class="tl change" :class="item.change < 0 ? 'red' : 'green'">
+                      {{
+                        parseFloat(item.change) >= 0
+                          ? "+" + (item.change - 0).toFixed(2)
+                          : (item.change - 0).toFixed(2)
+                      }}%
+                    </p>
+                    <p class="cscs" style="white-space: nowrap">
+                      {{ $t("zjde65") }}
+                      <!-- {{(item.volume / 1000000).toFixed(2)}}M -->
+                      {{ $processingPrices(item.volume * item.now_price) }}
+                    </p>
+                  </div>
+                </div>
+
+                <div class="trendt">
+                  <chart-box
+                    :symbol="item.currency_name"
+                    :color="item.change < 0 ? 'down' : 'up'"
+                    :count="100"
+                    period="1min"
+                    width="120px"
+                    height="50px"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="price-wrapper">
+        <div id="price-container" class="price-container flex">
+          <div id="table-root" style="width: 100%">
+            <div class="d-flex">
+              <div class="trade-tabs-container">
+                <div class="ant-tabs ant-tabs-top" style="width: 100%">
+                  <div class="tabs-list" v-if="false">
+                    <div class="ts-i" :class="{ tiav: tindex == 0 }" @click="zfdf(0)">
+                      <i class="el-icon-star-on"></i>
+
+                      <span>{{ $t("zx") }}</span>
+                    </div>
+                    <div class="ts-i" :class="{ tiav: tindex == 1 }" @click="zfdf(1)">
+                      {{ $t("zjde59") }}
+                    </div>
+                  </div>
+                  <div class="ant-tabs-content-holder">
+                    <!-- style="flex: 2.5;" -->
+                    <div class="home-tickers" style="width: 100%">
+                      <div class="home-table">
+                        <div class="coinbox rbom">
+                          <div class="flex classfity txtgray">
+                            <div class="flex">
+                              <span>{{ $t("accountaEntrust.currency") }}</span>
+                              <p class="flex column between"></p>
+                            </div>
+                            <div class="flex" style="justify-content: center !important">
+                              <span>{{ $t("zjde63") }}</span>
+                              <p class="flex column between"></p>
+                            </div>
+                            <div
+                              class="flex telHide"
+                              style="justify-content: center !important"
+                            >
+                              <span>{{ $t("marketQuotaion.cycle") }}</span>
+                              <p class="flex column between"></p>
+                            </div>
+                            <div
+                              class="flex telHide"
+                              style="justify-content: center !important"
+                            >
+                              <span>{{ $t("marketQuotaion.high") }}</span>
+                            </div>
+                            <div
+                              class="flex telHide"
+                              style="justify-content: center !important"
+                            >
+                              <span>{{ $t("marketQuotaion.low") }}</span>
+                            </div>
+                            <div
+                              class="flex telHide"
+                              style="justify-content: center !important"
+                            >
+                              <span>{{ $t("zjde65") }}</span>
+                            </div>
+                            <div class="flex" style="justify-content: center !important">
+                              <span
+                                style="
+                                  text-align: center;
+                                  display: block;
+                                  width: 100%;
+                                  height: 100%;
+                                "
+                                >{{ $t("marketQuotaion.market_trading") }}</span
+                              >
+                            </div>
+                          </div>
+                          <div>
+                            <div
+                              class="flex coinlist alcenter curPer hove1"
+                              v-for="(item, index) in cmtabsCurrent == 100
+                                ? intersection
+                                : quotationList"
+                              :key="index"
+                              @click="
+                                goTrade(
+                                  item.legal_id,
+                                  item.currency_id,
+                                  item.legal_name,
+                                  item.currency_name,
+                                  item.now_price,
+                                  item.change,
+                                  item.volume,
+                                  item.cny_price,
+                                  item.logo,
+                                  item.id
+                                )
+                              "
+                              v-show="item.currency_name != 'USDC'"
+                            >
+                              <p
+                                class="flex alcenter"
+                                style="align-items: center"
+                                @click.stop="addZX(item, iszx(item.currency_id))"
+                              >
+                                <i
+                                  :style="{
+                                    color: iszx(item.currency_id) ? '#f0c163' : '',
+                                  }"
+                                  class="el-icon-star-on"
+                                  style="font-size: 18px"
+                                ></i>
+                                <img
+                                  :src="$utils.isBaseUrl(item.logo)"
+                                  style="
+                                    width: 24px;
+                                    height: 24px;
+                                    object-fit: cover;
+                                    border-radius: 50%;
+                                  "
+                                />
+                                <span class="" style="margin-left: 5px"
+                                  >{{ item.currency_name }} / {{ item.legal_name }}</span
+                                >
+                              </p>
+                              <p style="justify-content: center !important">
+                                <span class="m22">${{ item.now_price }}</span>
+                              </p>
+                              <p
+                                class="tl change m22 telHide"
+                                :class="item.change < 0 ? 'red' : 'green'"
+                                style="justify-content: center !important"
+                              >
+                                <span
+                                  >{{
+                                    parseFloat(item.change) >= 0
+                                      ? "+" + (item.change - 0).toFixed(2)
+                                      : (item.change - 0).toFixed(2)
+                                  }}%</span
+                                >
+                              </p>
+                              <p
+                                class="m22 telHide"
+                                style="justify-content: center !important"
+                              >
+                                ${{ item.high || "0.00" | numFilters(4) }}
+                              </p>
+                              <p
+                                class="m22 telHide"
+                                style="justify-content: center !important"
+                              >
+                                ${{ item.low || "0.00" | numFilters(4) }}
+                              </p>
+                              <p
+                                class="m22 telHide"
+                                style="justify-content: center !important"
+                              >
+                                <!-- {{item.volume}} -->
+                                <!-- {{Number(item.volume) >1000? ((item.volume / 1000000).toFixed(4) + 'M'):( Number(item.volume )).toFixed(4) }} -->
+                                {{ $processingPrices(item.volume * item.now_price) }}
+                              </p>
+                              <p class="m22" style="justify-content: center !important">
+                                <span class="sdsdghg">
+                                  {{ $t("marketQuotaion.trade") }}
+                                </span>
+                              </p>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div class="atch-right" style="flex: 1" v-if="false">
+                      <div class="top-list-wrapper">
+                        <div class="top-container">
+                          <div style="margin-bottom: 1rem" class="sdd">
+                            {{ $t("homeContent.market") }}
+                          </div>
+                          <div class="top-title">
+                            <div
+                              class="tt-item"
+                              :class="{ tuAvtive: index == dqIndex }"
+                              v-for="(item, index) in rlist"
+                              :key="index"
+                              @click="dqIndex = index"
+                            >
+                              {{ item.title }}
+                            </div>
+                            <!-- <div class="tt-item">成交榜</div> -->
+                            <!-- {{$t("marketQuotaion.top_gainers")}} -->
+                          </div>
+                          <div class="top-list-content">
+                            <div class="top-list_body spcszc">
+                              <div class="bzfl">
+                                <div class="bi-item bi-l">{{ $t("zjde62") }}</div>
+                                <div class="bi-item">{{ $t("zjde63") }}</div>
+                                <div class="bi-item bi-r">
+                                  {{ dqIndex == 0 ? $t("zjde64") : $t("zjde64") }}
+                                </div>
+                              </div>
+
+                              <div
+                                class="bzfl"
+                                v-for="(item, index) in dqIndex == 0 ? increase : hot"
+                                :key="index"
+                                v-show="item.name != 'USDC'"
+                              >
+                                <div class="bi-item bi-l">{{ item.name }}/USDC</div>
+                                <div class="bi-item">${{ item.now_price }}</div>
+                                <div
+                                  v-show="dqIndex == 0"
+                                  class="bi-item bi-r"
+                                  :class="item.change < 0 ? 'red' : 'green'"
+                                >
+                                  {{
+                                    parseFloat(item.change) >= 0
+                                      ? "+" + (item.change - 0).toFixed(2)
+                                      : (item.change - 0).toFixed(2)
+                                  }}%
+                                </div>
+                                <div
+                                  style="text-align: right"
+                                  v-show="dqIndex == 1"
+                                  class="bi-item"
+                                >
+                                  <!-- ${{(item.volume /1000).toFixed(2)}}K -->
+                                  {{ $processingPrices(item.volume * item.now_price) }}
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                        <!-- <div class="top-container">
+												<div class="top-title">{{$t("marketQuotaion.popular_currencies")}}</div>
+												<div class="top-list-content">
+													<div class="top-list_body">
+														<div style="width: 50%;" v-for="(item,index) in hot" :key="index">
+															<a href="javascript:void(0);" class="top-list-item">
+																<div class="list-item-left">
+																	<img :src="item.logo" class="price-coin-item-icon">
+																	<div class="price-coin-item-title">{{item.name}}</div>
+																</div>
+																<span class="price-coin-item-volume">${{item.now_price}}</span>
+																<div class="top-comp_change-rate" :class="item.change<0?'red':'green'">{{
+										                            parseFloat(item.change) >= 0 ? '+' + (item.change - 0).toFixed(2) : (item.change -
+										                            0).toFixed(2)
+										                            }}%</div>
+															</a>
+														</div>
+													</div>
+												</div>
+											</div> -->
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <indexFooter :current="1"></indexFooter>
+  </div>
+</template>
+<script>
+import indexHeader from "@/view/indexHeader";
+import indexFooter from "@/view/indexFooter";
+import ChartBox from "@/view/chartBox";
+
+export default {
+  name: "marketQuotaion",
+  filters: {
+    numFilters: function (value, num) {
+      if (!value) {
+        return "0.0000";
+      }
+      value = (value - 0).toFixed(parseInt(num)).toString();
+      return value.slice(0) + " ";
+    },
+  },
+  data() {
+    return {
+      rlist: [
+        {
+          title: this.$t("zjde60"),
+        },
+        {
+          title: this.$t("zjde61"),
+        },
+      ],
+      tindex: 1,
+      sousuo: "",
+      dqIndex: 0,
+      hot: [],
+      increase: [],
+      quotation: [],
+      quotation2: [],
+      loginFlag: false,
+      lang: "en",
+      price: 12312.22,
+      share_bit: 121325.55,
+      share_ethereum: 12318978.77,
+      trade: 318978.77,
+      night_mode: 0,
+      intersection: [],
+      zix: [],
+      cmtabs: [],
+      cmtabsCurrent: 0,
+      quotationList: [],
+    };
+  },
+  components: {
+    indexHeader,
+    indexFooter,
+    ChartBox,
+  },
+  created() {
+    this.night_mode = localStorage.getItem("night_mode") || 0;
+    this.lang = window.localStorage.getItem("lang");
+    let t = localStorage.getItem("token");
+    t && (this.loginFlag = true);
+    this.getMarket();
+  },
+  mounted() {
+    this.getRange();
+    this.getQuotation();
+    this.connect();
+  },
+  methods: {
+    cmTab(index) {
+      this.cmtabsCurrent = index;
+      if (index != 100) {
+        this.getList2();
+      }
+    },
+    getMarket() {
+      let duizhao = {
+        外汇: this.$t("homeContent.外汇"),
+        美股: this.$t("homeContent.美股"),
+        期货: this.$t("homeContent.期货"),
+        数字货币: this.$t("homeContent.数字货币"),
+      };
+      this.$http({
+        url: "/api/currency/bclass",
+        method: "get",
+      }).then((res) => {
+        if (res.data.code == 1) {
+          var data = res.data.data;
+
+          for (const item of data) {
+            const { pcname = "" } = item;
+            if (duizhao[pcname]) {
+              item["pcname"] = duizhao[pcname];
+            }
+          }
+          this.cmtabs = data;
+          this.cmtabsCurrent = this.cmtabs[0].id;
+          this.getList2();
+
+          // console.log('data23454',data)
+        }
+      });
+    },
+    getList2() {
+      layer.load();
+      this.$http({
+        url: `/api/currency/quotation_huang?is_class=${this.cmtabsCurrent}`,
+        method: "get",
+      }).then((res) => {
+        this.quotationList = res.data.message[0].quotation;
+        // console.log('9999',res.data.message[0].quotation)
+        layer.closeAll();
+      });
+    },
+
+    iszx(id) {
+      if (this.intersection.length == 0) return false;
+      let zss = this.intersection.filter((item) => item.currency_id == id);
+
+      return zss.length ? true : false;
+    },
+    getList() {
+      this.$http({
+        url: `/api/optional/list`,
+        method: "get",
+        headers: {
+          Authorization: localStorage.getItem("token") || "",
+        },
+      }).then((res) => {
+        console.log("自选", res.data.message);
+        this.zix = res.data.message;
+        let intersection = [];
+
+        this.quotation2.forEach((obj1) => {
+          let obj2 = res.data.message.find((obj) => obj.currency_id === obj1.currency_id);
+          if (obj2) {
+            intersection.push(obj1);
+          }
+        });
+        console.log("intersection", intersection);
+        this.intersection = intersection;
+        // this.orderList = res.data.message.order_list
+        // this.dataList = res.data.message
+      });
+    },
+    addZX(item, flas) {
+      // this.$http.post("api/optional/add", {
+      // 	currency_id: item.currency_id,
+      // 	Authorization: localStorage.getItem("token") || ""
+
+      // }).then(res => {
+      // 	if (res.data.type == "ok") {
+
+      // 	} else {
+      // 		// layer.msg(res.message);
+      // 	}
+      // });
+      console.log("flas", flas);
+      layer.load();
+      if (flas) {
+        this.$http({
+          url: `/api/optional/del`,
+          method: "post",
+          data: {
+            id: this.zix.filter((val) => val.currency_id == item.currency_id)[0].id,
+          },
+          headers: {
+            Authorization: localStorage.getItem("token") || "",
+          },
+        }).then((res) => {
+          layer.closeAll();
+          this.getList();
+          // this.orderList = res.data.message.order_list
+          // this.dataList = res.data.message
+        });
+      } else {
+        this.$http({
+          url: `/api/optional/add`,
+          method: "post",
+          data: {
+            currency_id: item.currency_id,
+          },
+          headers: {
+            Authorization: localStorage.getItem("token") || "",
+          },
+        }).then((res) => {
+          layer.closeAll();
+          this.getList();
+          // this.orderList = res.data.message.order_list
+          // this.dataList = res.data.message
+        });
+      }
+    },
+    zfdf(index) {
+      this.tindex = index;
+    },
+    inputChange(e) {
+      // .indexOf(e) != -1
+      if (e) {
+        let data = this.quotation2.filter((item) => item.currency_name.includes(e));
+        this.quotationList = data;
+      } else {
+        this.quotationList = this.quotation2;
+      }
+    },
+    getQuotation() {
+      const that = this;
+      this.$http.get("api/currency/quotation_new", {}).then((res) => {
+        if (res.data.type == "ok") {
+          that.quotation = res.data.message[0].quotation;
+          that.quotation2 = res.data.message[0].quotation;
+          this.getList();
+        } else {
+          // layer.msg(res.message);
+        }
+      });
+    },
+    getRange() {
+      const that = this;
+      this.$http.get("api/currency/rangeNew", {}).then((res) => {
+        if (res.data.type == "ok") {
+          that.hot = res.data.message.hot;
+          that.increase = res.data.message.increase;
+        } else {
+          // layer.msg(res.message);
+        }
+      });
+    },
+    //去币币交易页
+    goTrade(
+      l_id,
+      c_id,
+      l_name,
+      c_name,
+      now_price,
+      change,
+      volume,
+      cny_price,
+      logo,
+      leverTradeId
+    ) {
+      window.localStorage.setItem("currency_id", c_id);
+      window.localStorage.setItem("legal_id", l_id);
+      window.localStorage.setItem("currency_name", c_name);
+      window.localStorage.setItem("legal_name", l_name);
+      window.localStorage.setItem("symbol", c_name + "/" + l_name);
+      window.localStorage.setItem("bzlogo", logo);
+      window.localStorage.setItem("leverTradeId", leverTradeId);
+      window.localStorage.setItem("cmtabsCurrent", this.cmtabsCurrent);
+      this.$router.push("/leverdealCenter");
+    },
+    connect() {
+      var that = this;
+      that.$socket.emit("login", localStorage.getItem("user_id"));
+      that.sockets.subscribe("kline", (msg) => {
+        // console.log(msg.type);
+        if (msg.type == "kline" && msg.period == "1min") {
+          for (var i = 0; i < that.quotationList.length; i++) {
+            if (
+              that.quotationList[i].legal_id == msg.legal_id &&
+              that.quotationList[i].currency_id == msg.currency_id
+            ) {
+              that.quotationList[i].now_price = msg.close * 1;
+              // that.quotation[i].change = (((msg.close - msg.open) / msg.open) * 100).toFixed(2)
+              // that.quotation[i].volume = msg.volume * 1;
+              // that.quotation[i].high = msg.high * 1;
+              // that.quotation[i].low = msg.low * 1;
+            }
+          }
+
+          for (var i = 0; i < that.hot.length; i++) {
+            if (
+              that.hot[i].legal_id == msg.legal_id &&
+              that.hot[i].currency_id == msg.currency_id
+            ) {
+              that.hot[i].now_price = msg.close * 1;
+              // that.quotation[i].change = (((msg.close - msg.open) / msg.open) * 100).toFixed(2)
+              // that.quotation[i].volume = msg.volume * 1;
+              // that.quotation[i].high = msg.high * 1;
+              // that.quotation[i].low = msg.low * 1;
+            }
+          }
+          for (var i = 0; i < that.increase.length; i++) {
+            if (
+              that.increase[i].legal_id == msg.legal_id &&
+              that.increase[i].currency_id == msg.currency_id
+            ) {
+              that.increase[i].now_price = msg.close * 1;
+              // that.quotation[i].change = (((msg.close - msg.open) / msg.open) * 100).toFixed(2)
+              // that.quotation[i].volume = msg.volume * 1;
+              // that.quotation[i].high = msg.high * 1;
+              // that.quotation[i].low = msg.low * 1;
+            }
+          }
+        }
+      });
+      this.sockets.subscribe("daymarket", (msg) => {
+        if (msg.type == "daymarket") {
+          for (var i = 0; i < that.quotationList.length; i++) {
+            if (
+              that.quotationList[i].legal_id == msg.legal_id &&
+              that.quotationList[i].currency_id == msg.currency_id
+            ) {
+              that.quotationList[i].volume = msg.volume * 15;
+              that.quotationList[i].high = msg.high * 1;
+              that.quotationList[i].low = msg.low * 1;
+              that.quotationList[i].change = msg.change;
+            }
+          }
+          for (var i = 0; i < that.hot.length; i++) {
+            if (
+              that.hot[i].legal_id == msg.legal_id &&
+              that.hot[i].currency_id == msg.currency_id
+            ) {
+              that.hot[i].volume = msg.volume * 15;
+              that.hot[i].high = msg.high * 1;
+              that.hot[i].low = msg.low * 1;
+              that.hot[i].change = msg.change;
+            }
+          }
+          for (var i = 0; i < that.increase.length; i++) {
+            if (
+              that.increase[i].legal_id == msg.legal_id &&
+              that.increase[i].currency_id == msg.currency_id
+            ) {
+              that.increase[i].volume = msg.volume * 15;
+              that.increase[i].high = msg.high * 1;
+              that.increase[i].low = msg.low * 1;
+              that.increase[i].change = msg.change;
+            }
+          }
+        }
+      });
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+#root {
+  // background: #151926;
+}
+
+.ada ::v-deep .el-input__inner {
+  border: 1px solid #e7e9ed !important;
+  background: none !important;
+  height: 35px;
+  line-height: 35px;
+  color: #999 !important;
+}
+
+.ada ::v-deep .el-input__icon {
+  line-height: 35px;
+}
+
+.price-container {
+  // background-color: #151926;
+  // min-width: 1280px;
+  // max-width: 1620px;
+  // flex-direction: column;
+  margin: 0 auto;
+  // padding: 0 74px;
+  // width: 75%;
+}
+
+.price-market-container {
+  display: flex;
+  flex-direction: column;
+  padding-bottom: 64px;
+}
+
+#root h1,
+#root h2,
+#root h3,
+#root h4,
+#root h5,
+#root h6 {
+  margin-top: 0;
+  margin-bottom: 0.5em;
+  color: rgba(0, 0, 0, 0.85);
+  font-weight: 500;
+}
+
+.price-container .price-market-title {
+  color: #fff !important;
+}
+
+.price-market-title {
+  font-family: Gate_Sans Medium !important;
+  font-weight: 500;
+  font-size: 24px !important;
+  line-height: 24px !important;
+  color: #fff !important;
+  margin-top: 56px !important;
+  margin-bottom: 24px !important;
+}
+
+.price-market-list {
+  display: flex;
+  margin-bottom: 0 !important;
+  align-items: center;
+}
+
+.price-container .price-market-list li {
+  color: #989fb3;
+}
+
+.price-market-list li {
+  margin-right: 32px;
+  font-size: 14px;
+  line-height: 14px;
+  color: #989fb3;
+}
+
+.top-list-wrapper {
+  display: flex;
+  padding-bottom: 56px;
+}
+
+.top-list-wrapper .top-container:first-child {
+  margin-right: 24px;
+}
+
+.top-list-wrapper .top-container {
+  flex: 1;
+}
+
+.top-container {
+  // background: #1f2433;
+  // border-radius: 8px;
+  // padding-top: 28px;
+}
+
+.top-list-wrapper .top-title {
+  font-size: 1rem;
+  color: #ccc;
+  padding: 0.8125rem 0;
+  display: flex;
+  justify-content: center;
+}
+
+.tt-item {
+  padding: 0 2rem;
+  cursor: pointer;
+}
+
+.tuAvtive {
+  color: #f0c163;
+}
+
+.top-list-content {
+  display: flex;
+  flex-wrap: wrap;
+  margin-top: 8px;
+}
+
+.top-list_body {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+}
+
+#root a {
+  text-decoration: none;
+  background-color: transparent;
+  outline: none;
+  cursor: pointer;
+  transition: color 0.3s;
+  -webkit-text-decoration-skip: objects;
+}
+
+#root a,
+#root area,
+#root button,
+#root input:not([type="range"]),
+#root label,
+#root select,
+#root summary,
+#root textarea {
+  touch-action: manipulation;
+}
+
+.top-list-content .top-list-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  flex-wrap: wrap;
+  padding: 12px 16px;
+  margin-bottom: 8px;
+}
+
+.list-item {
+  cursor: pointer;
+}
+
+.top-list-item .list-item-left {
+  display: flex;
+  align-items: center;
+}
+
+#root img {
+  vertical-align: middle;
+  border-style: none;
+}
+
+.top-list-item .list-item-left .price-coin-item-icon {
+  width: 24px;
+  height: 24px;
+  background: #c2c4cc;
+  margin-right: 8px;
+  border-radius: 50%;
+  overflow: hidden;
+}
+
+.price-coin-item-title {
+  font-family: Gate_Sans Medium;
+  font-weight: 500;
+  font-size: 16px;
+  line-height: 24px;
+  color: #fff;
+  word-break: break-word;
+  padding-right: 8px;
+  min-width: 89px;
+  flex: 97;
+}
+
+.price-coin-item-volume {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  font-family: Gate_Sans Medium;
+  font-weight: 500;
+  font-size: 14px;
+  line-height: 150%;
+  color: #fff;
+  padding-right: 8px;
+  max-width: 109px;
+  word-wrap: break-word;
+  flex: 109;
+}
+
+.top-comp_change-rate {
+  font-family: Gate_Sans Medium;
+  font-weight: 500;
+  font-size: 14px;
+  line-height: 150%;
+  word-wrap: break-word;
+}
+
+.price-wrapper {
+  width: 100%;
+  // background: #151926;
+}
+
+.price-container {
+  // background-color: #151926;
+  // min-width: 1280px;
+  // max-width: 1620px;
+  // flex-direction: column;
+  // margin: 0 auto;
+  // padding: 0 74px;
+}
+
+.trade-tabs-container {
+  width: 100%;
+  padding: 0;
+  display: flex;
+}
+
+.price-container .ant-tabs {
+  overflow: visible;
+}
+
+.ant-tabs-bottom,
+.ant-tabs-top {
+  flex-direction: column;
+}
+
+.ant-tabs {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  color: rgba(0, 0, 0, 0.85);
+  font-size: 14px;
+  font-variant: tabular-nums;
+  line-height: 1.5715;
+  list-style: none;
+  font-feature-settings: "tnum";
+  display: flex;
+  overflow: hidden;
+}
+
+.price-container .ant-tabs-top > .ant-tabs-nav {
+  background-color: #151926 !important;
+  position: sticky;
+  top: 0;
+  z-index: 3;
+  overflow: hidden;
+  margin-bottom: 24px;
+  background: #fff;
+  overflow: visible;
+}
+
+.ant-tabs-bottom > .ant-tabs-nav,
+.ant-tabs-bottom > div > .ant-tabs-nav,
+.ant-tabs-top > .ant-tabs-nav,
+.ant-tabs-top > div > .ant-tabs-nav {
+  margin: 0 0 16px;
+}
+
+.ant-tabs > .ant-tabs-nav,
+.ant-tabs > div > .ant-tabs-nav {
+  position: relative;
+  display: flex;
+  flex: none;
+  align-items: center;
+}
+
+.trade-tabs-container .ant-tabs > .ant-tabs-nav .ant-tabs-nav-wrap,
+.trade-tabs-container .ant-tabs > div > .ant-tabs-nav .ant-tabs-nav-wrap {
+  overflow: visible;
+}
+
+.ant-tabs > .ant-tabs-nav .ant-tabs-nav-wrap,
+.ant-tabs > div > .ant-tabs-nav .ant-tabs-nav-wrap {
+  position: relative;
+  display: inline-block;
+  display: flex;
+  flex: auto;
+  align-self: stretch;
+  overflow: hidden;
+  white-space: nowrap;
+  transform: translate(0);
+}
+
+.ant-tabs > .ant-tabs-nav .ant-tabs-nav-list,
+.ant-tabs > div > .ant-tabs-nav .ant-tabs-nav-list {
+  position: relative;
+  display: flex;
+  transition: transform 0.3s;
+}
+
+.price-container .ant-tabs-tab {
+  font-family: Gate_Sans Medium;
+  font-weight: 500;
+  font-size: 24px;
+  line-height: 24px;
+  padding: 0;
+  color: #303440 !important;
+  margin-right: 32px !important;
+  height: 48px;
+  padding-top: 8px;
+  align-items: flex-start;
+}
+
+.ant-tabs-tab {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  padding: 12px 0;
+  font-size: 14px;
+  background: transparent;
+  border: 0;
+  outline: none;
+  cursor: pointer;
+  color: #d9d9d9 !important;
+}
+
+.ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn {
+  color: #1890ff;
+  text-shadow: 0 0 0.25px currentColor;
+  color: #fff;
+  font-size: 24px;
+}
+
+.ant-tabs-tab-btn,
+.ant-tabs-tab-remove {
+  outline: none;
+  transition: all 0.3s;
+}
+
+.ant-tabs-content-holder {
+  flex: auto;
+  display: flex;
+}
+
+.ant-tabs-content-holder .bit-center-wrap {
+  width: 100% !important;
+}
+
+.el-footer-content {
+  width: 1239px;
+  margin: 0 auto;
+}
+
+.ant-tabs .coinbox {
+  // background-color: #1f2433;
+  // border-radius: 8px;
+  // border-right: 1px solid #222b39;
+  // border: none;
+}
+
+.ft12 {
+  font-size: 12px;
+}
+
+.ant-tabs-content-holder .coinbox .flex {
+  display: flex;
+}
+
+.ant-tabs-content-holder .coinbox .classfity {
+  background-color: #1f2433;
+  padding: 0.8125rem 1.5625rem;
+  color: #fff;
+  font-size: 1rem;
+}
+
+.ant-tabs-content-holder .coinbox .classfity > div {
+  flex: 1;
+  display: flex;
+  justify-content: left;
+}
+
+// .ant-tabs .coinbox {
+// 	background-color: #1f2433;
+// 	border-radius: 8px;
+// }
+
+.alcenter {
+  align-items: center;
+}
+
+.curPer {
+  cursor: pointer;
+}
+
+.ant-tabs-content-holder .coinbox .coinlist > p {
+  flex: 1;
+}
+
+.ant-tabs-content-holder .coinbox .coinlist p {
+  // line-height: 50px;
+  font-size: 14px;
+  font-family: Arial;
+  text-align: center;
+  display: flex;
+  justify-content: left;
+}
+
+.m22 {
+  font-size: 1rem !important;
+}
+
+.ant-tabs-content-holder .coinbox .coinlist {
+  padding: 1.6rem 1.5625rem;
+  color: #fff;
+  font-size: 15px;
+  font-weight: 700;
+  border-bottom: 0.0625rem solid #1e2632;
+}
+
+.jiaoyiBut {
+  color: #f0c163;
+  text-align: center;
+  display: block;
+}
+
+.rm {
+  display: flex;
+}
+
+.rm-item {
+  flex: 1;
+  padding: 1.25rem;
+  background-color: rgba(255, 255, 255, 0.02);
+  border-radius: 0.375rem;
+  display: flex;
+  align-items: center;
+  color: #fff;
+  justify-content: space-between;
+}
+
+.rm-item:not(:first-child) {
+  margin-left: 1.25rem;
+}
+
+.hqzb {
+}
+
+.hb1 {
+  font-size: 1rem;
+}
+
+.hb2 {
+  font-size: 1.625rem;
+  font-weight: bold;
+  margin: 0.3rem 0;
+}
+
+.hb3 {
+  font-size: 0.875rem;
+  color: #ccc;
+}
+
+.hb4 {
+  margin-top: 0.5rem;
+  display: flex;
+  font-size: 0.875rem;
+}
+
+.hb4 .tl {
+  margin-right: 0.5rem;
+}
+
+.tabs-list {
+  display: flex;
+  padding: 2.5rem 0;
+  cursor: pointer;
+}
+
+.ts-i {
+  margin-right: 1.875rem;
+  font-size: 1rem;
+  color: #ccc;
+}
+
+.sdsdghg {
+  border: 1px solid #fff;
+  padding: 4px 30px;
+  border-radius: 30px;
+}
+
+.tiav {
+  color: #f0c163;
+}
+
+.bzfl {
+  display: flex;
+  // justify-content: space-between;
+
+  width: 100%;
+  margin-bottom: 0.75rem;
+}
+
+.bi-item {
+  flex: 1;
+  text-align: center;
+}
+
+.bi-l {
+  text-align: left;
+}
+
+.bi-r {
+  text-align: right;
+}
+
+.spcszc {
+  padding: 1.25rem;
+  font-size: 1rem;
+  color: #ccc;
+}
+
+.dbt {
+  font-size: 32px;
+  font-weight: 700;
+  color: #fff;
+}
+
+.sdffsf .dbt {
+  color: #000;
+}
+
+.sdffsf .rm-item {
+  color: #000;
+}
+
+.sdffsf .cscs {
+  color: #999;
+}
+
+.sdffsf .ant-tabs-content-holder .coinbox .classfity {
+  background-color: #fafafa;
+  color: #333;
+}
+
+.sdffsf .ant-tabs-content-holder .coinbox .coinlist {
+  border-bottom: 0.0625rem solid #eaecef;
+}
+
+.sdffsf .ant-tabs .coinbox {
+  // border-right: 1px solid #eaecef;
+}
+
+.sdffsf .top-list-wrapper .top-title {
+  background-color: #fafafa;
+  color: #666;
+}
+
+.sdffsf .spcszc {
+  color: #666;
+}
+
+.sdffsf .ada {
+  background: #f5f5f5;
+  padding-bottom: 1rem;
+}
+
+.dfdfd {
+  background: #fff;
+}
+
+.afsfs {
+  .ada {
+    background: #0c1018;
+  }
+
+  .rm-item,
+  .dbt {
+    color: #fff;
+  }
+
+  .top-list-wrapper .top-title,
+  .ant-tabs-content-holder .coinbox .classfity {
+    //
+    background: #1c222c;
+    color: #fff;
+  }
+
+  .ant-tabs .coinbox {
+    // border-right: 0.0625rem solid #222b39;
+  }
+
+  .ant-tabs-content-holder .coinbox .coinlist {
+    border-bottom: 0.0625rem solid #222b39;
+  }
+
+  .spcszc {
+    color: #babdc0;
+  }
+}
+
+.sdd {
+  display: none;
+}
+
+// ;;;;;;;;
+.quotes-page {
+  padding: 62px 70px 109px;
+  margin: 0px auto;
+  color: #fff;
+}
+
+.quotes-page .base {
+  color: #fff;
+}
+
+.quotes-page .title {
+  height: 45px;
+  font-style: normal;
+  font-weight: 700;
+  font-size: 30px;
+  line-height: 45px;
+}
+
+.base {
+  margin-top: 65px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.base .item.no-vw {
+  // height: 220px;
+  width: calc(50% - 15px);
+  padding: 26px 20px;
+  border-radius: 12px;
+  border: 2px solid #2c2c3e;
+}
+
+.base .item.no-vw .title {
+  font-style: normal;
+  font-weight: 700;
+  font-size: 20px;
+  line-height: 30px;
+}
+
+.base .list {
+  margin-top: 15px;
+  display: flex;
+  flex-flow: column wrap;
+  align-items: flex-start;
+  justify-content: flex-start;
+  height: 130px;
+}
+
+.base .list .list-item:nth-of-type(1) {
+  margin-right: 40px;
+}
+
+.base .list .list-item .price,
+.base .list .list-item .percent {
+  width: 33.333%;
+  font-weight: 700;
+  font-size: 15px;
+  line-height: 22px;
+  text-align: right;
+}
+
+.base .list .list-item .coin {
+  width: 33.333%;
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+}
+
+.base .list .list-item .green {
+  color: rgb(0, 186, 140);
+}
+
+.base .list .list-item {
+  width: calc(50% - 20px);
+  margin: 9px 0px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+}
+
+.base .list .list-item .coin .iconhtth {
+  width: 24px;
+  height: 24px;
+  margin-right: 9px;
+}
+
+.quotes-page .tab-base {
+  margin-top: 42px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.cm-tabs-start-line {
+  height: 39px;
+  position: relative;
+  margin: 0 15px;
+  border-bottom: 1px solid #ebebeb;
+  display: flex;
+  flex-wrap: initial;
+  flex-direction: initial;
+  align-items: center;
+  justify-content: initial;
+}
+
+.cm-tabs-group {
+  display: flex;
+  align-items: center;
+  border-bottom: 1px solid #31323f;
+  margin-bottom: 30px;
+}
+
+.cm-tab {
+  height: 39px;
+  display: flex;
+
+  align-items: center;
+  justify-content: center;
+
+  font-size: 14px;
+  color: #888;
+  text-align: center;
+  padding: 2px 10px 0;
+  cursor: pointer;
+}
+
+.active-btn-bg {
+  color: #fff;
+  border-bottom: 1px solid #fff;
+}
+
+.search ::v-deep .el-input__inner {
+  background: transparent;
+  border: 1px solid #222b39;
+  border-radius: 30px;
+  // height: 30px;
+}
+
+// ;;;;;;;;
+
+@media screen and (max-width: 800px) {
+  .ada {
+    display: none;
+  }
+
+  .price-container {
+    width: 100%;
+  }
+
+  .ant-tabs-content-holder {
+    flex-direction: column-reverse;
+  }
+
+  .tabs-list {
+    display: none;
+  }
+
+  .price-wrapper .top-list-wrapper .top-container {
+    margin-right: 0;
+  }
+
+  .atch-right {
+    background-color: #f5f5f5;
+    padding: 1rem;
+  }
+
+  .coinbox .telHide {
+    display: none !important;
+  }
+
+  // .home-tickers{
+  // 	display: none;
+  // }
+  .afsfs .atch-right {
+    background: none;
+  }
+
+  .sdd {
+    display: block;
+  }
+
+  .afsfs .sdd {
+    color: #fff;
+  }
+
+  .top-list-wrapper {
+    padding-bottom: 1rem;
+  }
+
+  .quotes-page {
+    padding: 30px 20px 10px;
+    margin: 0px auto;
+    color: #fff;
+  }
+
+  .quotes-page .title,
+  .quotes-page .base {
+    display: none;
+  }
+
+  .quotes-page .tab-base {
+    margin-top: 20px;
+
+    flex-direction: column-reverse;
+  }
+  .search {
+    width: 100%;
+    margin-bottom: 10px;
+  }
+  .ant-tabs-content-holder .coinbox .coinlist {
+    padding: 1rem 0rem;
+    color: #fff;
+    font-size: 12px;
+    font-weight: 500;
+  }
+}
+
+.day .ada ::v-deep .el-input__inner {
+  border: 1px solid #2c313e !important;
+}
+</style>
diff --git a/src/view/marketb.vue b/src/view/marketb.vue
new file mode 100644
index 0000000..9a2c1d4
--- /dev/null
+++ b/src/view/marketb.vue
@@ -0,0 +1,416 @@
+<template>
+    <div class="market" style="height: 100%;">
+      <div class="m_filter">
+        <div class="tabtitle fColor1 ft14 curPer flex">
+          <!-- <span>JNB</span>
+          <span>JNB</span>-->
+          <!-- <span v-for="(tab,index) in tabList " :key="index" :class="index==index1?'active':''"  @click="changeType(index,tab.name,tab.id)">{{tab.name}}</span> -->
+        </div>
+      </div>
+      <div class="coin-title clear">
+        <div>
+          <span style="color:#00a4d8;">{{ $t('market.currency') }}</span>
+          <!--<img src="../assets/images/select0.png" alt>-->
+        </div>
+        <div>
+          <span>{{ $t('market.lastprice') }}</span>
+          <!--<img src="../assets/images/select0.png" alt>-->
+        </div>
+        <div>
+          <span>{{ $t('market.change') }}</span>
+          <!--<img src="../assets/images/select0.png" alt>-->
+        </div>
+      </div>
+      <div class="line"></div>
+      <ul class="coin-wrap scroll" style="height: 90%; overflow: auto; padding-bottom: 100px;">
+        <li
+            class="currency_p"
+            v-for="(item,index) in marketList "
+            :class="index==index2?'active_p':''"
+            :key="index"
+            @click="quota_shift(index,item.legal_id,item.legal_name,item.currency_name,item.currency_id,item.change,item.lever_share_num)"
+            v-if="item.is_display == 1">
+          <p>
+            <span>{{ item.currency_name }}</span>
+            <span>{{ item.now_price|toFixedN(4) }}</span>
+            <span :class="{'green':item.change>=0,'red':item.change<0}">{{ (item.change - 0).toFixed(2) }}%</span>
+          </p>
+        </li>
+      </ul>
+    </div>
+  </template>
+  
+  <script>
+  export default {
+    name: "market",
+    data() {
+      return {
+        ids: 0,
+        isShow: 0,
+        tabList: [],
+        marketList: [],
+        newData: ["MTS", "$0.076128", "-1.11%"],
+        legal_index: this.$route.params.legal_index,
+        currency_index: this.$route.params.currency_index,
+        tradeDatas: "",
+        index2: 0,
+        index1: 0,
+        dataList: [],
+        selectedId: "",
+        shareNum: ''
+      };
+    },
+    filters: {
+      toFixedN(val, n) {
+        return (val - 0).toFixed(n);
+      }
+    },
+    created: function () {
+      this.socket(localStorage.getItem("token"));
+      let that = this;
+      //法币列表
+      this.$http({
+        url: "/api/" + "currency/quotation_new",
+        method: "get",
+        data: {},
+        headers: {Authorization: localStorage.getItem("token")}
+      }).then(res => {
+            if (res.data.type == "ok") {
+              that.tabList = res.data.message;
+              var msg = res.data.message;
+              var arr_quota = [];
+              let index = 0;
+              let indexs = 0;
+              if (!localStorage.getItem("index1")) {
+                index = that.index1;
+              } else {
+                index = localStorage.getItem("index1");
+                that.index1 = localStorage.getItem("index1");
+              }
+              if (!localStorage.getItem("index2")) {
+                indexs = that.index2;
+              } else {
+                indexs = localStorage.getItem("index2");
+                that.index2 = localStorage.getItem("index2");
+              }
+              that.marketList = res.data.message[index].quotation;
+              that.selectedId = res.data.message[index].quotation[that.index2].legal_id;
+              that.dataList = res.data.message;
+              that.shareNum = res.data.message[index].quotation[that.index2].lever_share_num;
+              window.localStorage.setItem("shareNum", that.shareNum);
+              //默认法币id和name
+              if (!localStorage.getItem("legal_id") && !localStorage.getItem("currency_id") && !localStorage.getItem("legal_name") && !localStorage.getItem("currency_name")) {
+                that.currency_name = msg[index].quotation[indexs].currency_name;
+                that.currency_id = msg[index].quotation[indexs].currency_id;
+                window.localStorage.setItem(
+                    "currency_name",
+                    msg[index].quotation[indexs].currency_name
+                );
+                window.localStorage.setItem(
+                    "legal_id",
+                    msg[index].quotation[indexs].legal_id
+                );
+                window.localStorage.setItem(
+                    "currency_id",
+                    msg[index].quotation[indexs].currency_id
+                );
+                window.localStorage.setItem(
+                    "lever_currency_name",
+                    msg[index].quotation[indexs].currency_name
+                );
+                window.localStorage.setItem(
+                    "lever_legal_id",
+                    msg[index].quotation[indexs].legal_id
+                );
+                window.localStorage.setItem(
+                    "lever_currency_id",
+                    msg[index].quotation[indexs].currency_id
+                );
+              } else {
+                that.currency_name = window.localStorage.getItem("currency_name");
+                that.currency_id = window.localStorage.getItem("currency_id");
+              }
+            }
+          })
+          .catch(error => {
+            console.log(error);
+          });
+      if (
+          window.localStorage.getItem("index2") &&
+          window.localStorage.getItem("index1")
+      ) {
+        this.index2 = window.localStorage.getItem("index2");
+        this.index1 = window.localStorage.getItem("index1");
+      }
+    },
+    mounted() {
+      var that = this;
+      eventBus.$on("toNew", function (data) {
+        //    console.log(data);
+        if (data) {
+          var newprice = data.newprice;
+          var cname = data.istoken;
+          var newup = Number(data.newup).toFixed(2);
+          // console.log(newup)
+          if (newup >= 0) {
+            newup = "+" + Number(newup).toFixed(2) + "%";
+            $("span[data-name='" + cname + "']")
+                .next()
+                .css("color", "#55a067");
+          } else {
+            newup = newup + "%";
+            $("span[data-name='" + cname + "']")
+                .next()
+                .css("color", "#cc4951");
+          }
+          $("span[data-name='" + cname + "']")
+              .html("$" + newprice)
+              .next()
+              .html(newup);
+        }
+      });
+  
+      eventBus.$on('updateDaymarkey', res => {
+  
+        // console.log(res,'接受到更新数据');
+        if (res !== undefined && res.currency_id !== undefined) {
+          for (let i = 0; i < that.marketList.length; i++) {
+            if (that.marketList[i] == undefined) {
+              console.log(i);
+            } else {
+              if (that.marketList[i].currency_id == res.currency_id && res.legal_id==3) {
+                that.marketList[i].now_price = res.close;
+                that.marketList[i].change = res.change;
+              }
+            }
+          }
+        } else {
+          console.log('没有的', res);
+        }
+      });
+  
+      // this.marketSocket();
+    },
+    methods: {
+      changeType(index, currency, currency_id) {
+        this.index1 = index;
+        this.index2 = null;
+        $(".currency_p p").removeClass("active_p");
+  
+        this.isShow = index;
+        this.ids = "a";
+        //    this.currency_name = currency;
+        //    this.currency_id = currency_id;
+        this.marketList = this.dataList[index].quotation;
+      },
+      getSymbols(callback) {
+        if (this.address.length <= 0) {
+          return false;
+        }
+        this.$http({
+          url: "/api/" + "wallet/list?user_id=" + this.address || "",
+          type: "GET"
+        })
+            .then(res => {
+              if (res.data.type == "ok") {
+                this.accountInfo = res.data.message;
+                this.dataList = res.data.message.list;
+  
+                callback && callback();
+              } else {
+              }
+            })
+            .catch(error => {
+              return error;
+            });
+      },
+  
+      marketSocket() {
+        var that = this;
+        that.$socket.emit("login", localStorage.getItem("user_id"));
+        that.sockets.subscribe("daymarket", msg => {
+          if (msg.type == "daymarket") {
+            for (var i = 0; i < that.quotationList.length; i++) {
+              if (
+                  that.quotationList[i].legal_id == msg.legal_id &&
+                  that.quotationList[i].currency_id == msg.currency_id
+              ) {
+                that.quotationList[i].now_price = msg.now_price;
+                // that.quotationList[i].spread = msg.spread;
+                that.quotationList[i].change = msg.change;
+                that.quotationList[i].volume = msg.volume;
+              }
+            }
+          }
+        });
+      },
+      //币种切换
+      quota_shift(idx, id, legal_name, currency_name, currency_id, change, shareNum) {
+        window.localStorage.setItem("downUp", change);
+        window.localStorage.setItem("legal_id_cur", currency_id);
+  
+        window.localStorage.setItem("index1", this.index1);
+        window.localStorage.setItem("index2", idx);
+        window.localStorage.setItem("shareNum", shareNum);
+        this.ids = idx;
+        var tradeDatas = {
+          currency_id: currency_id,
+          legal_id: id,
+          currency_name: currency_name,
+          leg_name: legal_name
+        };
+        window.localStorage.setItem("legal_id", id);
+        window.localStorage.setItem("currency_id", currency_id);
+        window.localStorage.setItem("legal_name", legal_name);
+        window.localStorage.setItem("currency_name", currency_name);
+        var symbol = currency_name + "/" + legal_name;
+        window.localStorage.setItem("symbol", symbol);
+        location.reload();
+        //向兄弟组件传数据
+        //    eventBus.$emit('toTrade',tradeDatas);
+        //    eventBus.$emit('toExchange',tradeDatas)
+      },
+  
+      //socket连接封装
+      socket(token) {
+        var that = this;
+        //console.log("socket");
+        that.$socket.emit("login", localStorage.getItem("user_id"));
+        that.$socket.on("daymarket", msg => {
+          if (msg.type == "daymarket") {
+            if (that.selectedId && that.selectedId == msg.legal_id) {
+              let lists = that.marketList;
+              for (let i in lists) {
+                if (lists[i].currency_id == msg.currency_id) {
+                  that.marketList[i].volume = msg.volume;
+                  that.marketList[i].now_price = msg.now_price;
+                  that.marketList[i].change = msg.change;
+                }
+              }
+            }
+          }
+        });
+  
+      }
+    }
+  };
+  </script>
+  
+  <style scoped lang="scss">
+  .m_title {
+    height: 55px;
+    padding: 15px 30px;
+    line-height: 25px;
+    position: relative;
+  }
+  
+  .m_search input {
+    border-radius: 3px;
+    background: transparent;
+    border: 1px solid #52688c;
+    line-height: 25px;
+  }
+  
+  /* .m_search{position: absolute;width: 146px;right: 20px;top: -4px;height: 26px;border-radius: 3px;padding: 4px 8px 4px 0;} */
+  /* .m_search input{position: absolute;left: 0;top: 10px;z-index: 2;width: 100%;padding: 5px 40px 5px 8px;height: 26px;border-radius: 3px;background: transparent;border: 1px solid #52688c;} */
+  .m_search img {
+    width: 16px;
+    height: 15px;
+    position: absolute;
+    right: 35px;
+    top: 20px;
+    z-index: 123;
+  }
+  
+  /* .m_filter{padding: 10px 0 15px;} */
+  .m_filter {
+    font-size: 14px;
+  }
+  
+  .tabtitle {
+    padding: 0 25px;
+  }
+  
+  .tabtitle span {
+    text-align: center;
+    margin-right: 25px;
+  }
+  
+  .coin-title div {
+    width: 33.3%;
+    height: 36px;
+    line-height: 36px;
+    text-align: center;
+    float: left;
+    color: #637085;
+    font-size: 12px;
+  }
+  
+  .coin-title img {
+    vertical-align: middle;
+    margin-top: -3px;
+  }
+  
+  .line {
+    width: 100%;
+    margin: 0px auto;
+    border-bottom: 1px solid rgb(48, 59, 75);
+  }
+  
+  .coin-wrap {
+    height: auto;
+    overflow: hidden;
+  }
+  
+  .coin-wrap li {
+    height: 39.2px;
+    line-height: 39.2px;
+    cursor: pointer;
+    font-size: 12px;
+    color: #cdd6e4;
+  }
+  
+  .coin-wrap li span {
+    display: block;
+    width: 33%;
+    float: left;
+    text-align: center;
+  }
+  
+  .coin-wrap li span:last-child {
+    color: #cc4951;
+  }
+  
+  .coin-title{
+    div:first-child{
+      text-indent: 20px;
+      text-align: left;
+    }
+  }
+  .currency_p{
+    p{
+      span:first-child{
+        text-align: left;
+        text-indent: 20px;
+      }
+    }
+  }
+  
+  /* .coin-wrap li:nth-child(odd){background-color: #181b2a;} */
+  .coin-wrap li span.green {
+    color: #55a067;
+  }
+  
+  .coin-wrap li p {
+    overflow: hidden;
+  }
+  
+  .active_p {
+    background-color: #2b3648;
+  }
+  
+  .coin-wrap li p:hover {
+    background-color: #2b3648;
+  }
+  </style>
+  
\ No newline at end of file
diff --git a/src/view/tvBase.vue b/src/view/tvBase.vue
new file mode 100644
index 0000000..2640df4
--- /dev/null
+++ b/src/view/tvBase.vue
@@ -0,0 +1,478 @@
+<template>
+	<div class="k-line-area bg-1d1d29">
+		<Handicap ></Handicap>
+		<div class="xh-mian">
+			<div class="x-left" >
+				<tv-top></tv-top>
+			</div>
+			<div class="x-rtght">
+				<div class="xr-head">
+					<div class="xr-l">
+						<div class="kx" >
+							<klineChart></klineChart>
+						</div>
+
+						<div class="xd">
+
+							<trade :lastPrice="lastPrice" :leverTradeId="leverTradeId"
+					:currencyName="currencyName"></trade>
+						</div>
+					</div>
+					<div class="ss-right">
+
+						<div class="tabs-box">
+							<el-tabs v-model="hlIndex" @tab-click="handleClick">
+								<el-tab-pane v-for="(item,index) in htlist" :label="item.text"
+									:name="item.type"></el-tab-pane>
+
+							</el-tabs>
+						</div>
+						<!-- <tv-top></tv-top> -->
+						<exchange style="width: 100%;" v-if="hlIndex==0"></exchange>
+
+						<trade2 style="width: 100%;" v-if="hlIndex==1"></trade2>
+
+					</div>
+				</div>
+
+
+
+
+				<div class="order-list">
+
+
+
+
+					<transactions :leverTradeId="leverTradeId" v-if="leverTradeId"></transactions>
+				</div>
+			</div>
+
+
+		</div>
+
+
+
+
+		<div class="new-tb" v-if="false" >
+			<div class="kx" style="display: flex; flex-direction: column;" v-if="hlIndex==3 || pcshow">
+				<div class="by">{{$t('zjde79')}}</div>
+				<div id="tv_chart_container" style="flex: 1;">
+					<klineChart></klineChart>
+				</div>
+				<!-- <div class="subplot-box">
+					<div class="sx-item" :class="{hpAvtive:subplot==item.text}" v-for="(item,index) in subplotList" @click="setSubIndicator(item.text)">{{item.text}}</div>
+				</div> -->
+			</div>
+			<div class="Handicap">
+				<div class="hp-top">
+					<div @click="hlIndex=3" class="ht-i djasdjh" :class="{hpAvtive:hlIndex==3}">{{$t('zjde79')}}</div>
+
+
+					<div @click="zfdf(index)" class="ht-i" v-for="(item,index) in htlist"
+						:class="{hpAvtive:hlIndex==index}">{{item.text}}</div>
+
+				</div>
+
+				<exchange style="width: 100%;" v-if="hlIndex==0"></exchange>
+
+				<trade2 style="width: 100%;" v-if="hlIndex==1"></trade2>
+
+			</div>
+			<!-- <levertrade style="width: 25rem;"></levertrade> -->
+			<div class="dsads">
+				<trade style="width: 100%;" :lastPrice="lastPrice" :leverTradeId="leverTradeId"
+					:currencyName="currencyName"></trade>
+			</div>
+		</div>
+
+
+	</div>
+</template>
+<script>
+	import market from '@/view/market';
+	import exchange from "@/view/lever/lever_exchange";
+	import trade from "@/mhyjy/second-trade";
+	import TvTop from '@/view/tvTop.vue'
+	import trade2 from '@/view/complete';
+	import Handicap from "@/components/Handicap"
+	import klineChart from "@/components/klineChart"
+	import transactions from "@/mhyjy/second_transactions";
+
+	import {
+		init,
+		dispose,
+		indicator,
+		paint,
+
+	} from 'klinecharts'
+	let instance;
+	export default {
+		name: "tv",
+		components: {
+			market,
+			exchange,
+			trade,
+			trade2,
+			Handicap,
+			klineChart,
+			TvTop,
+			transactions
+		},
+		props: {
+			leverTradeId: {
+				type: Number,
+				required: true
+			},
+		},
+		filters: {
+			toFixedN(val, n) {
+				return (val - 0).toFixed(n);
+			}
+		},
+		data() {
+			return {
+				htlist: [{
+						text: this.$t('zjde80')
+					},
+					{
+						text: this.$t('zjde81')
+					}
+				],
+				hlIndex: 0,
+				pcshow: true,
+				showMarketlist: false,
+				widget: null,
+				symbolInfo: null,
+				feed: null,
+				wsEx: null,
+				ws: null,
+				lists: [],
+				newData: '',
+				symbol: '',
+				priceScale: 10000,
+				histime: '',
+				leftName: "",
+				rightName: "",
+				lastPrice: "0.0000",
+				change: '0.00',
+				highPrice: '0.0000',
+				lowPrice: '0.0000',
+				volumn: '0.00',
+				rateNum: 1,
+				loadingK: false,
+				chart: null,
+
+
+			}
+
+		},
+		created() {
+			var curScreenWidth = document.documentElement.clientWidth;
+			if (curScreenWidth < 800) {
+				this.hlIndex = 3
+			} else {
+				this.pcshow = true
+			}
+			this.symbol = window.localStorage.getItem('symbol');
+
+			this.leftName = window.localStorage.getItem("legal_name") || "";
+			this.rightName = window.localStorage.getItem("currency_name") || "";
+			this.currencyId = window.localStorage.getItem("legal_id");
+			this.legalId = window.localStorage.getItem("currency_id");
+			// this.init(this.legalId, this.currencyId);
+			this.downUp = window.localStorage.getItem("downUp");
+
+		},
+		sockets: {},
+		computed: {
+			listenState() { //监听交易对
+				return this.symbol;
+			}
+		},
+		watch: {
+			listenState: function(a, b) { //监听交易对
+				if (a != b && b != '') {
+					this.widget.setSymbol(a, localStorage.getItem('tim'), function onReadyCallback() {}) //切换币种
+					// this.$store.state.symbol=b
+				}
+			}
+		},
+		mounted() {
+			instance = this;
+			// this.createWidget();
+
+		},
+		destroyed() {
+			this.removeWidget();
+		},
+		beforeDestroy() {
+
+		},
+
+		methods: {
+
+
+			handleClick(item) {
+				// console.log('indsd', item.index)
+				// this.tabsName = item.index
+				// this.tabsName2 = '1'
+				this.hlIndex = item.index
+				var curScreenWidth = document.documentElement.clientWidth;
+				if (curScreenWidth < 800) {
+				
+					this.pcshow = false
+				}
+			},
+
+			zfdf(index) {
+				this.hlIndex = index
+				var curScreenWidth = document.documentElement.clientWidth;
+				if (curScreenWidth < 800) {
+
+					this.pcshow = false
+				}
+			},
+			showMarketList() {
+				this.showMarketlist = !0
+			},
+			closeMarketList() {
+				this.showMarketlist = !1
+			},
+			connect(real) { //封装推送数据
+
+			},
+
+
+			createWidget() {
+				let _this = this;
+
+				this.$nextTick(() => {
+
+					this.chart = init('tv_chart_container')
+					this.chart.createIndicator('VOL')
+
+					let to = new Date().getTime()
+					let form = new Date().getTime() - (60 * 1000)
+					this.$http({
+						url: `/api/currency/new_timeshar?from=${form}&to=${to}&symbol=BTC/USDC&period=1min`,
+						method: 'get',
+
+					}).then(res => {
+						let data = res.data.data
+						let list = data.map(item => {
+							return {
+								close: item.close,
+								high: item.high,
+								low: item.low,
+								open: item.open,
+								timestamp: item.time,
+								volume: item.volume
+							}
+						})
+
+						this.kList = list
+						this.chart.applyNewData(list)
+						this.updateData2()
+
+					})
+
+					// 为图表添加数据
+				})
+			},
+			setSubIndicator(name) {
+				this.subplot = name
+				this.chart.createIndicator(name)
+			},
+
+			// 更新数据
+			updateData2() {
+				console.log('触发了', )
+				this.sockets.subscribe('kline', msg => {
+					if (msg.type == 'kline') {
+						if (msg.symbol == localStorage.getItem('symbol')) {
+
+							let data = this.kList[this.kList.length - 1]
+							data.close = msg.close
+							this.chart.updateData(data)
+						}
+					}
+				})
+			},
+
+
+			createFeed() {
+
+			},
+			updateData(data) {
+				if (data) {
+					this.$emit('real-time', data);
+				}
+			},
+
+			updateWidget(item) {
+
+			},
+			removeWidget() {
+
+			},
+			overrides() {}
+		},
+
+
+	}
+</script>
+<style lang="scss" scoped>
+	.info-wrap {
+		// line-height: 50px;
+		padding-left: 20px;
+		display: flex;
+		font-size: 0.85rem;
+		color: #c7cce6;
+		padding: 0.9rem 0;
+		border: 1px solid #dcdcdc;
+	}
+
+	.info-wrap .bz {
+		font-size: 1rem;
+		color: #ccc;
+		border-right: 1px solid #dcdcdc;
+		display: flex;
+		align-items: center;
+		flex-direction: row;
+		padding: 0 1.5rem;
+		margin-right: 1rem;
+	}
+
+	.info-wrap .rmyg {
+		padding: 0 2rem;
+		text-align: center;
+		display: flex;
+		flex-direction: column;
+		justify-content: center;
+	}
+
+	.rmyg .jg {
+		font-size: 1.2rem;
+		font-weight: bold;
+	}
+
+	.info-wrap div span {
+		// line-height: 20px;
+	}
+
+	.asd {
+		margin-top: 0.8rem;
+	}
+
+	.new-tb {
+		display: flex;
+	}
+
+	.kx {
+		flex: 1;
+		border-right: 0.0625rem solid #2c2c3e;
+	}
+
+	.by {
+		color: #333;
+		font-size: 1rem;
+		padding: 1rem 1.5rem;
+		border-bottom: 0.0625rem solid #2c2c3e;
+	}
+
+	.Handicap {
+		width: 23rem;
+	}
+
+	.hp-top {
+		display: flex;
+		font-size: 1rem;
+		padding: 1rem 1.5rem;
+		border-bottom: 0.0625rem solid #2c2c3e;
+		color: #999;
+		cursor: pointer;
+	}
+
+	.dsads {
+		width: 25rem;
+	}
+
+	.ht-i {
+		flex: 1;
+		text-align: center;
+	}
+
+	.djasdjh {
+		display: none;
+	}
+
+
+	.subplot-box {
+		display: flex;
+		padding: 2rem 1rem;
+		font-size: 1rem;
+		color: #999;
+		cursor: pointer;
+	}
+
+	@media screen and (max-width: 800px) {
+		.new-tb {
+			flex-direction: column;
+		}
+.xd{
+	
+}
+		.djasdjh {
+			display: block;
+		}
+
+		.Handicap {
+			width: 100%;
+		}
+
+		.dsads {
+			width: 100%;
+		}
+
+		.kx {
+			order: 2;
+		}
+
+		.Handicap {
+			order: 1;
+		}
+
+		.dsads {
+			order: 3;
+		}
+
+		.by {
+			display: none;
+		}
+
+	}
+
+	.hpAvtive {
+		color: #f0c163;
+	}
+
+	.sx-item {
+		margin-right: 1rem;
+	}
+
+	.day {
+		.kx {
+			border-right: 0.0625rem solid #2c313e;
+		}
+
+		.hp-top,
+		.by {
+			border-color: #2c313e;
+		}
+
+		.by {
+			color: #fff;
+		}
+
+	}
+</style>
\ No newline at end of file