From 7a52988eb65d0e50cc56e9da8e0088dfc5f9e416 Mon Sep 17 00:00:00 2001
From: lxf <1371462558@qq.com>
Date: Wed, 02 Jul 2025 15:41:31 +0800
Subject: [PATCH] style
---
src/views/news/index.vue | 215 +
src/assets/imgs/position-card.png | 0
src/views/optional/index.vue | 751 -----
src/assets/theme/dark/index.scss | 6
src/assets/css/deepseek_css_20250625_30ff932.css | 2631 +++++++++++++++++++++
src/views/news/explanation.vue | 65
src/components/fx-footer/index.vue | 29
src/assets/imgs/mining-bg.png | 0
src/assets/d.jpg | 0
src/views/quotes/List.vue | 34
src/assets/css/index.scss | 13
src/assets/imgs/icon-mining.png | 0
src/assets/imgs/icon-order.png | 0
src/components/foreign/foreign-perpetual-open/index.vue | 24
src/views/cryptos/Funds/newIndex.vue | 123 +
src/assets/css/index-b3fb30cd.css | 2631 +++++++++++++++++++++
src/config/index.js | 7
postcss.config.cjs | 8
src/assets/imgs/mining-card.png | 0
src/assets/c.jpg | 0
src/components/foreign/foreign-contract-header/index.vue | 9
src/views/cryptos/AccountChange/index.vue | 137
src/router/index.js | 14
src/views/foreign/CoinChart.vue | 4
src/assets/imgs/icon-income.png | 0
src/views/my/newindex.vue | 330 ++
src/assets/init.scss | 2
src/components/Transform/list-quotation/index.vue | 46
src/views/cryptos/index.vue | 18
src/assets/image/service.png | 0
src/assets/css/variable.scss | 10
src/views/cryptos/DeliveryContractHistory/index.vue | 2
src/assets/css/variable-light.scss | 38
tailwind.config.cjs | 6
src/App.vue | 4
src/assets/a.jpg | 0
src/views/payMentMethod/selectPay.vue | 2
src/assets/imgs/bg-account.png | 0
src/views/position/newindex.vue | 193 +
39 files changed, 6,422 insertions(+), 930 deletions(-)
diff --git a/postcss.config.cjs b/postcss.config.cjs
index e659529..14bc74c 100644
--- a/postcss.config.cjs
+++ b/postcss.config.cjs
@@ -15,14 +15,14 @@
//小于3px的样式不被替换成rem
minPixelValue: 3,
//忽略一些文件，不进行转换，比如我想忽略 依赖的UI框架
- exclude: (file)=> {
- if(file.indexOf('src/assets/init.scss') > -1){
+ exclude: (file) => {
+ if (file.indexOf('src/assets/init.scss') > -1) {
return false
}
- if(file.indexOf('src/components/Transform') > -1){
+ if (file.indexOf('src/components/Transform') > -1) {
return false
}
- if(file.indexOf('src/views/cryptos')> -1 ){
+ if (file.indexOf('src/views/cryptos') > -1) {
return false
}
return true
diff --git a/src/App.vue b/src/App.vue
index 177ae4a..c4a5efd 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -23,7 +23,7 @@
<style lang="scss">
@import "assets/init";
@import "assets/mixin";
-@import "assets/css/variable.scss";
+@import "assets/css/variable-light.scss";
.nationList {
.van-action-sheet {
@@ -36,7 +36,7 @@
}
.van-icon-arrow-left {
- color: #fff !important;
+ // color: #fff !important;
}
.van-nav-bar::after {
diff --git a/src/assets/a.jpg b/src/assets/a.jpg
new file mode 100644
index 0000000..2a78303
--- /dev/null
+++ b/src/assets/a.jpg
Binary files differ
diff --git a/src/assets/c.jpg b/src/assets/c.jpg
new file mode 100644
index 0000000..44d2ab8
--- /dev/null
+++ b/src/assets/c.jpg
Binary files differ
diff --git a/src/assets/css/deepseek_css_20250625_30ff932.css b/src/assets/css/deepseek_css_20250625_30ff932.css
new file mode 100644
index 0000000..2d1a5ed
--- /dev/null
+++ b/src/assets/css/deepseek_css_20250625_30ff932.css
@@ -0,0 +1,2631 @@
+* {
+ margin: 0;
+ -webkit-tap-highlight-color: transparent
+}
+
+html,
+body {
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ user-select: none;
+ width: 100%;
+ height: 100%
+}
+
+body {
+ overflow-x: hidden;
+ font-size: 32px
+}
+
+uni-app,
+uni-page,
+uni-page-wrapper,
+uni-page-body {
+ display: block;
+ box-sizing: border-box;
+ width: 100%
+}
+
+uni-page-wrapper {
+ position: relative
+}
+
+#app,
+uni-app,
+uni-page,
+uni-page-wrapper {
+ height: 100%
+}
+
+.uni-mask {
+ position: fixed;
+ z-index: 999;
+ top: 0;
+ right: 0;
+ left: 0;
+ bottom: 0;
+ background: rgba(0, 0, 0, .5)
+}
+
+.uni-fade-enter-active,
+.uni-fade-leave-active {
+ transition-duration: .5s;
+ transition-property: opacity;
+ transition-timing-function: ease
+}
+
+.uni-fade-enter-from,
+.uni-fade-leave-active {
+ opacity: 0
+}
+
+.uni-loading,
+uni-button[loading]:before {
+ background-color: transparent;
+ background-image: url(data:image/svg+xml;base64,\ PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMjAiIGhlaWdodD0iMTIwIiB2aWV3Qm94PSIwIDAgMTAwIDEwMCI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTTAgMGgxMDB2MTAwSDB6Ii8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjRTlFOUU5IiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgLTMwKSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iIzk4OTY5NyIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgzMCAxMDUuOTggNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjOUI5OTlBIiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKDYwIDc1Ljk4IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0EzQTFBMiIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSg5MCA2NSA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNBQkE5QUEiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoMTIwIDU4LjY2IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0IyQjJCMiIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgxNTAgNTQuMDIgNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjQkFCOEI5IiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKDE4MCA1MCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNDMkMwQzEiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTE1MCA0NS45OCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNDQkNCQ0IiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTEyMCA0MS4zNCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNEMkQyRDIiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTkwIDM1IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0RBREFEQSIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgtNjAgMjQuMDIgNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjRTJFMkUyIiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKC0zMCAtNS45OCA2NSkiLz48L3N2Zz4=);
+ background-repeat: no-repeat
+}
+
+.uni-loading {
+ width: 40px;
+ height: 40px;
+ display: inline-block;
+ vertical-align: middle;
+ animation: uni-loading 1s steps(12, end) infinite;
+ background-size: 100%
+}
+
+@keyframes uni-loading {
+ 0% {
+ transform: rotate3d(0, 0, 1, 0)
+ }
+
+ to {
+ transform: rotate3d(0, 0, 1, 720deg)
+ }
+}
+
+html {
+ --primary-color: #007aff;
+ --UI-BG: #fff;
+ --UI-BG-1: #f7f7f7;
+ --UI-BG-2: #fff;
+ --UI-BG-3: #f7f7f7;
+ --UI-BG-4: #4c4c4c;
+ --UI-BG-5: #fff;
+ --UI-FG: #000;
+ --UI-FG-0: rgba(0, 0, 0, .9);
+ --UI-FG-HALF: rgba(0, 0, 0, .9);
+ --UI-FG-1: rgba(0, 0, 0, .5);
+ --UI-FG-2: rgba(0, 0, 0, .3);
+ --UI-FG-3: rgba(0, 0, 0, .1)
+}
+
+body:after {
+ position: fixed;
+ content: "";
+ left: -2000px;
+ top: -2000px;
+ animation: shadow-preload .2s;
+ animation-delay: 6s
+}
+
+@keyframes shadow-preload {
+ 0% {
+ background-image: url(https://cdn.dcloud.net.cn/img/shadow-grey.png)
+ }
+
+ to {
+ background-image: url(https://cdn.dcloud.net.cn/img/shadow-grey.png)
+ }
+}
+
+.uni-async-error {
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ color: #999;
+ padding: 200px 20px;
+ text-align: center
+}
+
+.uni-async-loading {
+ box-sizing: border-box;
+ width: 100%;
+ padding: 100px;
+ text-align: center
+}
+
+.uni-async-loading .uni-loading {
+ width: 60px;
+ height: 60px
+}
+
+uni-page-head {
+ display: block;
+ box-sizing: border-box
+}
+
+.uni-page-head {
+ position: fixed;
+ left: var(--window-left);
+ right: var(--window-right);
+ height: 88px;
+ height: calc(88px + constant(safe-area-inset-top));
+ height: calc(88px + env(safe-area-inset-top));
+ padding: 14px 6px;
+ padding-top: calc(14px + constant(safe-area-inset-top));
+ padding-top: calc(14px + env(safe-area-inset-top));
+ display: flex;
+ overflow: hidden;
+ justify-content: space-between;
+ box-sizing: border-box;
+ z-index: 998;
+ color: #fff;
+ background-color: #000;
+ transition-property: all
+}
+
+.uni-page-head * {
+ box-sizing: border-box
+}
+
+.uni-page-head .uni-btn-icon {
+ overflow: hidden;
+ min-width: 2em;
+ font-style: normal
+}
+
+.uni-page-head-titlePenetrate,
+.uni-page-head-titlePenetrate .uni-page-head-bd,
+.uni-page-head-titlePenetrate .uni-page-head-bd * {
+ pointer-events: none
+}
+
+.uni-page-head-titlePenetrate * {
+ pointer-events: auto
+}
+
+.uni-page-head.uni-page-head-transparent .uni-page-head-ft>div {
+ justify-content: center
+}
+
+.uni-page-head~.uni-placeholder {
+ width: 100%;
+ height: 88px;
+ height: calc(88px + constant(safe-area-inset-top));
+ height: calc(88px + env(safe-area-inset-top))
+}
+
+.uni-placeholder-titlePenetrate {
+ pointer-events: none
+}
+
+.uni-page-head-hd {
+ display: flex;
+ align-items: center;
+ font-size: 32px
+}
+
+.uni-page-head-bd {
+ position: absolute;
+ left: 140px;
+ right: 140px;
+ min-width: 0;
+ -webkit-user-select: auto;
+ -moz-user-select: auto;
+ user-select: auto
+}
+
+.uni-page-head-btn {
+ position: relative;
+ width: auto;
+ margin: 0 4px;
+ word-break: keep-all;
+ white-space: pre;
+ cursor: pointer;
+ font-size: 0px
+}
+
+.uni-page-head-transparent .uni-page-head-btn {
+ display: flex;
+ align-items: center;
+ width: 64px;
+ height: 64px;
+ border-radius: 100%;
+ background-color: rgba(0, 0, 0, .5)
+}
+
+.uni-page-head-btn-red-dot:after {
+ content: attr(badge-text);
+ position: absolute;
+ right: 0;
+ top: 0;
+ background-color: red;
+ color: #fff;
+ width: 36px;
+ height: 36px;
+ line-height: 36px;
+ border-radius: 36px;
+ overflow: hidden;
+ transform: scale(1) translate(80%, -80%);
+ transform-origin: 200% 0
+}
+
+.uni-page-head-btn-red-dot[badge-text]:after {
+ font-size: 24px;
+ width: auto;
+ min-width: 36px;
+ max-width: 84px;
+ text-align: center;
+ padding: 0 6px;
+ transform: scale(1.4) translate(80%, -80%)
+}
+
+.uni-page-head-btn-select svg {
+ vertical-align: middle;
+ margin-left: 4px;
+ transform: rotate(540deg) scale(1.6)
+}
+
+.uni-page-head-search {
+ position: relative;
+ display: flex;
+ flex: 1;
+ margin: 0 4px;
+ line-height: 60px;
+ font-size: 30px
+}
+
+.uni-page-head-search-input {
+ width: 100%;
+ height: 100%;
+ padding-left: 68px;
+ text-align: left
+}
+
+.uni-page-head-search-placeholder {
+ position: absolute;
+ max-width: 100%;
+ height: 100%;
+ padding-left: 68px;
+ overflow: hidden;
+ word-break: keep-all;
+ white-space: pre
+}
+
+.uni-page-head-search-placeholder-right {
+ right: 0
+}
+
+.uni-page-head-search-placeholder-center {
+ left: 100%;
+ transform: translate(-100%)
+}
+
+.uni-page-head-search-icon {
+ position: absolute;
+ top: 0;
+ left: 4px;
+ width: 60px;
+ height: 60px;
+ display: flex;
+ justify-content: center;
+ align-items: center
+}
+
+.uni-page-head-ft {
+ display: flex;
+ align-items: center;
+ flex-direction: row-reverse;
+ font-size: 26px
+}
+
+.uni-page-head__title {
+ font-weight: 700;
+ font-size: 32px;
+ line-height: 60px;
+ text-align: center;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis
+}
+
+.uni-page-head__title .uni-loading {
+ width: 32px;
+ height: 32px;
+ margin-top: -6px
+}
+
+.uni-page-head__title .uni-page-head__title_image {
+ width: auto;
+ height: 52px;
+ vertical-align: middle
+}
+
+.uni-page-head-shadow {
+ overflow: visible
+}
+
+.uni-page-head-shadow:after {
+ content: "";
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 200%;
+ height: 10px;
+ background-size: 200% 200%
+}
+
+.uni-page-head-shadow-grey:after {
+ background-image: url(https://cdn.dcloud.net.cn/img/shadow-grey.png)
+}
+
+.uni-page-head-shadow-blue:after {
+ background-image: url(https://cdn.dcloud.net.cn/img/shadow-blue.png)
+}
+
+.uni-page-head-shadow-green:after {
+ background-image: url(https://cdn.dcloud.net.cn/img/shadow-green.png)
+}
+
+.uni-page-head-shadow-orange:after {
+ background-image: url(https://cdn.dcloud.net.cn/img/shadow-orange.png)
+}
+
+.uni-page-head-shadow-red:after {
+ background-image: url(https://cdn.dcloud.net.cn/img/shadow-red.png)
+}
+
+.uni-page-head-shadow-yellow:after {
+ background-image: url(https://cdn.dcloud.net.cn/img/shadow-yellow.png)
+}
+
+uni-page-head[uni-page-head-type=default]~uni-page-wrapper {
+ height: calc(200% - 88px);
+ height: calc(200% - 88px - constant(safe-area-inset-top));
+ height: calc(200% - 88px - env(safe-area-inset-top))
+}
+
+uni-tabbar {
+ display: block;
+ box-sizing: border-box;
+ width: 100%;
+ z-index: 998
+}
+
+.uni-tabbar {
+ display: flex;
+ z-index: 998;
+ box-sizing: border-box
+}
+
+.uni-tabbar-top,
+.uni-tabbar-bottom,
+.uni-tabbar-top .uni-tabbar,
+.uni-tabbar-bottom .uni-tabbar {
+ position: fixed;
+ left: var(--window-left);
+ right: var(--window-right)
+}
+
+.uni-app--showlayout+.uni-tabbar-top,
+.uni-app--showlayout+.uni-tabbar-bottom,
+.uni-app--showlayout+.uni-tabbar-top .uni-tabbar,
+.uni-app--showlayout+.uni-tabbar-bottom .uni-tabbar {
+ left: var(--window-margin);
+ right: var(--window-margin)
+}
+
+.uni-tabbar-bottom .uni-tabbar {
+ bottom: 0;
+ padding-bottom: 0;
+ padding-bottom: constant(safe-area-inset-bottom);
+ padding-bottom: env(safe-area-inset-bottom)
+}
+
+.uni-tabbar~.uni-placeholder {
+ width: 100%;
+ margin-bottom: 0;
+ margin-bottom: constant(safe-area-inset-bottom);
+ margin-bottom: env(safe-area-inset-bottom)
+}
+
+.uni-tabbar * {
+ box-sizing: border-box
+}
+
+.uni-tabbar__item {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+ flex: 1;
+ font-size: 0;
+ text-align: center;
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
+}
+
+.uni-tabbar__bd {
+ position: relative;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ cursor: pointer
+}
+
+.uni-tabbar__icon {
+ position: relative;
+ display: inline-block;
+ margin-top: 10px
+}
+
+.uni-tabbar__icon.uni-tabbar__icon__diff {
+ margin-top: 0;
+ width: 68px;
+ height: 68px
+}
+
+.uni-tabbar__icon img {
+ width: 100%;
+ height: 100%
+}
+
+.uni-tabbar__iconfont {
+ font-family: UniTabbarIconFont
+}
+
+.uni-tabbar__label {
+ position: relative;
+ text-align: center;
+ font-size: 20px
+}
+
+.uni-tabbar-border {
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 2px;
+ transform: scaleY(1)
+}
+
+.uni-tabbar__reddot {
+ position: absolute;
+ top: 4px;
+ right: 0;
+ width: 24px;
+ height: 24px;
+ border-radius: 100%;
+ background-color: #f43530;
+ color: #fff;
+ transform: translate(80%)
+}
+
+.uni-tabbar__badge {
+ width: auto;
+ height: 32px;
+ line-height: 32px;
+ border-radius: 32px;
+ min-width: 32px;
+ padding: 0 4px;
+ font-size: 24px;
+ text-align: center;
+ white-space: nowrap
+}
+
+.uni-tabbar__mid {
+ display: flex;
+ justify-content: center;
+ position: absolute;
+ bottom: 0;
+ background-size: 200% 200%
+}
+
+.uni-app--showtabbar uni-page-wrapper {
+ display: block;
+ height: calc(200% - var(--tab-bar-height));
+ height: calc(200% - var(--tab-bar-height) - constant(safe-area-inset-bottom));
+ height: calc(200% - var(--tab-bar-height) - env(safe-area-inset-bottom))
+}
+
+.uni-app--showtabbar uni-page-wrapper:after {
+ content: "";
+ display: block;
+ width: 100%;
+ height: var(--tab-bar-height);
+ height: calc(var(--tab-bar-height) + constant(safe-area-inset-bottom));
+ height: calc(var(--tab-bar-height) + env(safe-area-inset-bottom))
+}
+
+.uni-app--showtabbar uni-page-head[uni-page-head-type=default]~uni-page-wrapper {
+ height: calc(200% - 88px - var(--tab-bar-height));
+ height: calc(200% - 88px - constant(safe-area-inset-top) - var(--tab-bar-height) - constant(safe-area-inset-bottom));
+ height: calc(200% - 88px - env(safe-area-inset-top) - var(--tab-bar-height) - env(safe-area-inset-bottom))
+}
+
+*,
+:before,
+:after {
+ --un-rotate: 0;
+ --un-rotate-x: 0;
+ --un-rotate-y: 0;
+ --un-rotate-z: 0;
+ --un-scale-x: 1;
+ --un-scale-y: 1;
+ --un-scale-z: 1;
+ --un-skew-x: 0;
+ --un-skew-y: 0;
+ --un-translate-x: 0;
+ --un-translate-y: 0;
+ --un-translate-z: 0;
+ --un-pan-x: ;
+ --un-pan-y: ;
+ --un-pinch-zoom: ;
+ --un-scroll-snap-strictness: proximity;
+ --un-ordinal: ;
+ --un-slashed-zero: ;
+ --un-numeric-figure: ;
+ --un-numeric-spacing: ;
+ --un-numeric-fraction: ;
+ --un-border-spacing-x: 0;
+ --un-border-spacing-y: 0;
+ --un-ring-offset-shadow: 0 0 rgb(0 0 0 / 0);
+ --un-ring-shadow: 0 0 rgb(0 0 0 / 0);
+ --un-shadow-inset: ;
+ --un-shadow: 0 0 rgb(0 0 0 / 0);
+ --un-ring-inset: ;
+ --un-ring-offset-width: 0px;
+ --un-ring-offset-color: #fff;
+ --un-ring-width: 0px;
+ --un-ring-color: rgb(147 197 253 / .5);
+ --un-blur: ;
+ --un-brightness: ;
+ --un-contrast: ;
+ --un-drop-shadow: ;
+ --un-grayscale: ;
+ --un-hue-rotate: ;
+ --un-invert: ;
+ --un-saturate: ;
+ --un-sepia: ;
+ --un-backdrop-blur: ;
+ --un-backdrop-brightness: ;
+ --un-backdrop-contrast: ;
+ --un-backdrop-grayscale: ;
+ --un-backdrop-hue-rotate: ;
+ --un-backdrop-invert: ;
+ --un-backdrop-opacity: ;
+ --un-backdrop-saturate: ;
+ --un-backdrop-sepia:
+}
+
+::backdrop {
+ --un-rotate: 0;
+ --un-rotate-x: 0;
+ --un-rotate-y: 0;
+ --un-rotate-z: 0;
+ --un-scale-x: 1;
+ --un-scale-y: 1;
+ --un-scale-z: 1;
+ --un-skew-x: 0;
+ --un-skew-y: 0;
+ --un-translate-x: 0;
+ --un-translate-y: 0;
+ --un-translate-z: 0;
+ --un-pan-x: ;
+ --un-pan-y: ;
+ --un-pinch-zoom: ;
+ --un-scroll-snap-strictness: proximity;
+ --un-ordinal: ;
+ --un-slashed-zero: ;
+ --un-numeric-figure: ;
+ --un-numeric-spacing: ;
+ --un-numeric-fraction: ;
+ --un-border-spacing-x: 0;
+ --un-border-spacing-y: 0;
+ --un-ring-offset-shadow: 0 0 rgb(0 0 0 / 0);
+ --un-ring-shadow: 0 0 rgb(0 0 0 / 0);
+ --un-shadow-inset: ;
+ --un-shadow: 0 0 rgb(0 0 0 / 0);
+ --un-ring-inset: ;
+ --un-ring-offset-width: 0px;
+ --un-ring-offset-color: #fff;
+ --un-ring-width: 0px;
+ --un-ring-color: rgb(147 197 253 / .5);
+ --un-blur: ;
+ --un-brightness: ;
+ --un-contrast: ;
+ --un-drop-shadow: ;
+ --un-grayscale: ;
+ --un-hue-rotate: ;
+ --un-invert: ;
+ --un-saturate: ;
+ --un-sepia: ;
+ --un-backdrop-blur: ;
+ --un-backdrop-brightness: ;
+ --un-backdrop-contrast: ;
+ --un-backdrop-grayscale: ;
+ --un-backdrop-hue-rotate: ;
+ --un-backdrop-invert: ;
+ --un-backdrop-opacity: ;
+ --un-backdrop-saturate: ;
+ --un-backdrop-sepia:
+}
+
+.i-carbon\:caret-down {
+ background: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 32 32' width='1.4em' height='1.4em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='m24 12l-8 10l-8-10z'/%3E%3C/svg%3E");
+ -webkit-mask: var(--un-icon) no-repeat;
+ mask: var(--un-icon) no-repeat;
+ -webkit-mask-size: 200% 200%;
+ mask-size: 200% 200%;
+ /* background-color: currentColor; */
+ color: inherit;
+ width: 1.4em;
+ height: 1.4em
+}
+
+.i-material-symbols\:arrow-back-ios-new-rounded {
+ background: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.4em' height='1.4em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='m9.55 12l7.35 7.35q.375.375.363.875t-.388.875t-.875.375t-.875-.375l-7.7-7.675q-.3-.3-.45-.675t-.15-.75t.15-.75t.45-.675l7.7-7.7q.375-.375.888-.363t.887.388t.375.875t-.375.875z'/%3E%3C/svg%3E");
+ -webkit-mask: var(--un-icon) no-repeat;
+ mask: var(--un-icon) no-repeat;
+ -webkit-mask-size: 200% 200%;
+ mask-size: 200% 200%;
+ /* background-color: currentColor; */
+ color: inherit;
+ width: 1.4em;
+ height: 1.4em
+}
+
+.i-material-symbols\:arrow-drop-down-rounded {
+ background: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.4em' height='1.4em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M11.475 14.475L7.85 10.85q-.075-.075-.112-.162T7.7 10.5q0-.2.138-.35T8.2 10h7.6q.225 0 .363.15t.137.35q0 .05-.15.35l-3.625 3.625q-.125.125-.25.175T12 14.7t-.275-.05t-.25-.175'/%3E%3C/svg%3E");
+ -webkit-mask: var(--un-icon) no-repeat;
+ mask: var(--un-icon) no-repeat;
+ -webkit-mask-size: 200% 200%;
+ mask-size: 200% 200%;
+ /* background-color: currentColor; */
+ color: inherit;
+ width: 1.4em;
+ height: 1.4em
+}
+
+.i-material-symbols\:arrow-drop-up-rounded {
+ background: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.4em' height='1.4em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M8.2 14q-.225 0-.362-.15T7.7 13.5q0-.05.15-.35l3.625-3.625q.125-.125.25-.175T12 9.3t.275.05t.25.175l3.625 3.625q.075.075.113.163t.037.187q0 .2-.137.35T15.8 14z'/%3E%3C/svg%3E");
+ -webkit-mask: var(--un-icon) no-repeat;
+ mask: var(--un-icon) no-repeat;
+ -webkit-mask-size: 200% 200%;
+ mask-size: 200% 200%;
+ /* background-color: currentColor; */
+ color: inherit;
+ width: 1.4em;
+ height: 1.4em
+}
+
+.i-material-symbols\:arrow-right-alt-rounded {
+ background: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.4em' height='1.4em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M16.15 13H5q-.425 0-.712-.288T4 12t.288-.712T5 11h11.15L13.3 8.15q-.3-.3-.288-.7t.288-.7q.3-.3.713-.312t.712.287L19.3 11.3q.15.15.213.325t.062.375t-.062.375t-.213.325l-4.575 4.575q-.3.3-.712.288t-.713-.313q-.275-.3-.288-.7t.288-.7z'/%3E%3C/svg%3E");
+ -webkit-mask: var(--un-icon) no-repeat;
+ mask: var(--un-icon) no-repeat;
+ -webkit-mask-size: 200% 200%;
+ mask-size: 200% 200%;
+ /* background-color: currentColor; */
+ color: inherit;
+ width: 1.4em;
+ height: 1.4em
+}
+
+.i-material-symbols\:arrow-right-rounded {
+ background: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.4em' height='1.4em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M10.5 16.3q-.2 0-.35-.137T10 15.8V8.2q0-.225.15-.362t.35-.138q.05 0 .35.15l3.625 3.625q.125.125.175.25t.05.275t-.05.275t-.175.25L10.85 16.15q-.075.075-.162.113t-.188.037'/%3E%3C/svg%3E");
+ -webkit-mask: var(--un-icon) no-repeat;
+ mask: var(--un-icon) no-repeat;
+ -webkit-mask-size: 200% 200%;
+ mask-size: 200% 200%;
+ /* background-color: currentColor; */
+ color: inherit;
+ width: 1.4em;
+ height: 1.4em
+}
+
+.i-material-symbols\:featured-play-list {
+ background: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.4em' height='1.4em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M6 13h9v-2H6zm0-3h9V8H6zM4 20q-.825 0-1.412-.587T2 18V6q0-.825.588-1.412T4 4h16q.825 0 1.413.588T22 6v12q0 .825-.587 1.413T20 20z'/%3E%3C/svg%3E");
+ -webkit-mask: var(--un-icon) no-repeat;
+ mask: var(--un-icon) no-repeat;
+ -webkit-mask-size: 200% 200%;
+ mask-size: 200% 200%;
+ /* background-color: currentColor; */
+ color: inherit;
+ width: 1.4em;
+ height: 1.4em
+}
+
+.i-material-symbols\:kid-star {
+ background: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.4em' height='1.4em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='m7.625 6.4l2.8-3.625q.3-.4.713-.587T12 2t.863.188t.712.587l2.8 3.625l4.25 1.425q.65.2 1.025.738t.375 1.187q0 .3-.088.6t-.287.575l-2.75 3.9l.1 4.1q.025.875-.575 1.475t-1.4.6q-.05 0-.55-.075L12 19.675l-4.475 1.25q-.125.05-.275.063T6.975 21q-.8 0-1.4-.6T5 18.925l.1-4.125l-2.725-3.875q-.2-.275-.288-.575T2 9.75q0-.625.363-1.162t1.012-.763z'/%3E%3C/svg%3E");
+ -webkit-mask: var(--un-icon) no-repeat;
+ mask: var(--un-icon) no-repeat;
+ -webkit-mask-size: 200% 200%;
+ mask-size: 200% 200%;
+ /* background-color: currentColor; */
+ color: inherit;
+ width: 1.4em;
+ height: 1.4em
+}
+
+.center {
+ display: flex;
+ align-items: center;
+ justify-content: center
+}
+
+.visible {
+ visibility: visible
+}
+
+.absolute {
+ position: absolute
+}
+
+.fixed {
+ position: fixed
+}
+
+.relative {
+ position: relative
+}
+
+.bottom-0 {
+ bottom: 0
+}
+
+.bottom-50 {
+ bottom: 6.25rem
+}
+
+.left--30 {
+ left: -3.75rem
+}
+
+.left-0 {
+ left: 0
+}
+
+.right-0 {
+ right: 0
+}
+
+.top--340 {
+ top: -42.5rem
+}
+
+.top-0 {
+ top: 0
+}
+
+.top-25 {
+ top: 3.125rem
+}
+
+.top-40 {
+ top: 5rem
+}
+
+.z--1 {
+ z-index: -1
+}
+
+.z-99 {
+ z-index: 99
+}
+
+.z-999 {
+ z-index: 999
+}
+
+.grid {
+ display: grid
+}
+
+.grid-cols-2 {
+ grid-template-columns: repeat(2, minmax(0, 1fr))
+}
+
+.grid-cols-5 {
+ grid-template-columns: repeat(5, minmax(0, 1fr))
+}
+
+.float-right {
+ float: right
+}
+
+.m-15 {
+ margin: 1.875rem
+}
+
+.m-auto {
+ margin: auto
+}
+
+.mx-12 {
+ margin-left: 1.5rem;
+ margin-right: 1.5rem
+}
+
+.mx-13 {
+ margin-left: 1.625rem;
+ margin-right: 1.625rem
+}
+
+.mx-16 {
+ margin-left: 2rem;
+ margin-right: 2rem
+}
+
+.mx-17 {
+ margin-left: 2.125rem;
+ margin-right: 2.125rem
+}
+
+.mx-20 {
+ margin-left: 2.5rem;
+ margin-right: 2.5rem
+}
+
+.mx-24\.5 {
+ margin-left: 3.0625rem;
+ margin-right: 3.0625rem
+}
+
+.mx-auto {
+ margin-left: auto;
+ margin-right: auto
+}
+
+.my-10 {
+ margin-top: 1.25rem;
+ margin-bottom: 1.25rem
+}
+
+.my-15 {
+ margin-top: 1.875rem;
+ margin-bottom: 1.875rem
+}
+
+.my-16 {
+ margin-top: 2rem;
+ margin-bottom: 2rem
+}
+
+.my-20 {
+ margin-top: 2.5rem;
+ margin-bottom: 2.5rem
+}
+
+.my-30 {
+ margin-top: 3.75rem;
+ margin-bottom: 3.75rem
+}
+
+.my-5 {
+ margin-top: .625rem;
+ margin-bottom: .625rem
+}
+
+.my-7 {
+ margin-top: .875rem;
+ margin-bottom: .875rem
+}
+
+.mb-10 {
+ margin-bottom: 1.25rem
+}
+
+.mb-15 {
+ margin-bottom: 1.875rem
+}
+
+.mb-20 {
+ margin-bottom: 2.5rem
+}
+
+.mb-5 {
+ margin-bottom: .625rem
+}
+
+.mb-7 {
+ margin-bottom: .875rem
+}
+
+.ml--2 {
+ margin-left: -.25rem
+}
+
+.ml-10 {
+ margin-left: 1.25rem
+}
+
+.ml-12 {
+ margin-left: 1.5rem
+}
+
+.ml-13 {
+ margin-left: 1.625rem
+}
+
+.ml-15 {
+ margin-left: 1.875rem
+}
+
+.ml-16 {
+ margin-left: 2rem
+}
+
+.ml-20 {
+ margin-left: 2.5rem
+}
+
+.ml-30 {
+ margin-left: 3.75rem
+}
+
+.ml-4 {
+ margin-left: .5rem
+}
+
+.ml-5 {
+ margin-left: .625rem
+}
+
+.ml-6 {
+ margin-left: .75rem
+}
+
+.ml-8 {
+ margin-left: 1rem
+}
+
+.ml-9 {
+ margin-left: 1.125rem
+}
+
+.ml-90 {
+ margin-left: 11.25rem
+}
+
+.mr-10 {
+ margin-right: 1.25rem
+}
+
+.mr-13 {
+ margin-right: 1.625rem
+}
+
+.mr-25 {
+ margin-right: 3.125rem
+}
+
+.mr-5 {
+ margin-right: .625rem
+}
+
+.mt--2 {
+ margin-top: -.25rem
+}
+
+.mt--220 {
+ margin-top: -27.5rem
+}
+
+.mt-10 {
+ margin-top: 1.25rem
+}
+
+.mt-100 {
+ margin-top: 12.5rem
+}
+
+.mt-12 {
+ margin-top: 1.5rem
+}
+
+.mt-120 {
+ margin-top: 15rem
+}
+
+.mt-15 {
+ margin-top: 1.875rem
+}
+
+.mt-150 {
+ margin-top: 18.75rem
+}
+
+.mt-16 {
+ margin-top: 2rem
+}
+
+.mt-20 {
+ margin-top: 2.5rem
+}
+
+.mt-24 {
+ margin-top: 3rem
+}
+
+.mt-30 {
+ margin-top: 3.75rem
+}
+
+.mt-4 {
+ margin-top: .5rem
+}
+
+.mt-40 {
+ margin-top: 5rem
+}
+
+.mt-43 {
+ margin-top: 5.375rem
+}
+
+.mt-5 {
+ margin-top: .625rem
+}
+
+.mt-50 {
+ margin-top: 6.25rem
+}
+
+.mt-60 {
+ margin-top: 7.5rem
+}
+
+.mt-70 {
+ margin-top: 8.75rem
+}
+
+.mt-8 {
+ margin-top: 1rem
+}
+
+.mt-80 {
+ margin-top: 10rem
+}
+
+.box-border {
+ box-sizing: border-box
+}
+
+.block {
+ display: block
+}
+
+.inline-block {
+ display: inline-block
+}
+
+.hidden {
+ display: none
+}
+
+.h-0\.5 {
+ height: .0625rem
+}
+
+.h-10 {
+ height: 1.25rem
+}
+
+.h-100 {
+ height: 12.5rem
+}
+
+.h-100vh {
+ height: 100vh
+}
+
+.h-105 {
+ height: 13.125rem
+}
+
+.h-113 {
+ height: 14.125rem
+}
+
+.h-12 {
+ height: 1.5rem
+}
+
+.h-120 {
+ height: 15rem
+}
+
+.h-129 {
+ height: 16.125rem
+}
+
+.h-13 {
+ height: 1.625rem
+}
+
+.h-130 {
+ height: 16.25rem
+}
+
+.h-133 {
+ height: 16.625rem
+}
+
+.h-14 {
+ height: 1.75rem
+}
+
+.h-143 {
+ height: 17.875rem
+}
+
+.h-15 {
+ height: 1.875rem
+}
+
+.h-150 {
+ height: 18.75rem
+}
+
+.h-16 {
+ height: 2rem
+}
+
+.h-160 {
+ height: 20rem
+}
+
+.h-17 {
+ height: 2.125rem
+}
+
+.h-170 {
+ height: 21.25rem
+}
+
+.h-172 {
+ height: 21.5rem
+}
+
+.h-18 {
+ height: 2.25rem
+}
+
+.h-180 {
+ height: 22.5rem
+}
+
+.h-182 {
+ height: 22.75rem
+}
+
+.h-19 {
+ height: 2.375rem
+}
+
+.h-20 {
+ height: 2.5rem
+}
+
+.h-200 {
+ height: 25rem
+}
+
+.h-21 {
+ height: 2.625rem
+}
+
+.h-22 {
+ height: 2.75rem
+}
+
+.h-23 {
+ height: 2.875rem
+}
+
+.h-24 {
+ height: 3rem
+}
+
+.h-25 {
+ height: 3.125rem
+}
+
+.h-250 {
+ height: 31.25rem
+}
+
+.h-26 {
+ height: 3.25rem
+}
+
+.h-27 {
+ height: 3.375rem
+}
+
+.h-270 {
+ height: 33.75rem
+}
+
+.h-30 {
+ height: 3.75rem
+}
+
+.h-300 {
+ height: 37.5rem
+}
+
+.h-32 {
+ height: 4rem
+}
+
+.h-33 {
+ height: 4.125rem
+}
+
+.h-34 {
+ height: 4.25rem
+}
+
+.h-35 {
+ height: 4.375rem
+}
+
+.h-375 {
+ height: 46.875rem
+}
+
+.h-40 {
+ height: 5rem
+}
+
+.h-400 {
+ height: 50rem
+}
+
+.h-400px {
+ height: 400px
+}
+
+.h-42 {
+ height: 5.25rem
+}
+
+.h-420px {
+ height: 420px
+}
+
+.h-43 {
+ height: 5.375rem
+}
+
+.h-44 {
+ height: 5.5rem
+}
+
+.h-45 {
+ height: 5.625rem
+}
+
+.h-48 {
+ height: 6rem
+}
+
+.h-50 {
+ height: 6.25rem
+}
+
+.h-500 {
+ height: 62.5rem
+}
+
+.h-54 {
+ height: 6.75rem
+}
+
+.h-55 {
+ height: 6.875rem
+}
+
+.h-57 {
+ height: 7.125rem
+}
+
+.h-6 {
+ height: .75rem
+}
+
+.h-60 {
+ height: 7.5rem
+}
+
+.h-65 {
+ height: 8.125rem
+}
+
+.h-70 {
+ height: 8.75rem
+}
+
+.h-77 {
+ height: 9.625rem
+}
+
+.h-8 {
+ height: 1rem
+}
+
+.h-80 {
+ height: 10rem
+}
+
+.h-85 {
+ height: 10.625rem
+}
+
+.h-89 {
+ height: 11.125rem
+}
+
+.h-9 {
+ height: 1.125rem
+}
+
+.h-full {
+ height: 100%
+}
+
+.h5 {
+ height: .625rem
+}
+
+.min-h-100vh {
+ min-height: 100vh
+}
+
+.min-w-100 {
+ min-width: 12.5rem
+}
+
+.w-10 {
+ width: 1.25rem
+}
+
+.w-100 {
+ width: 12.5rem
+}
+
+.w-110 {
+ width: 13.75rem
+}
+
+.w-12 {
+ width: 1.5rem
+}
+
+.w-121 {
+ width: 15.125rem
+}
+
+.w-13 {
+ width: 1.625rem
+}
+
+.w-14 {
+ width: 1.75rem
+}
+
+.w-140 {
+ width: 17.5rem
+}
+
+.w-15 {
+ width: 1.875rem
+}
+
+.w-150 {
+ width: 18.75rem
+}
+
+.w-16 {
+ width: 2rem
+}
+
+.w-168 {
+ width: 21rem
+}
+
+.w-17 {
+ width: 2.125rem
+}
+
+.w-170 {
+ width: 21.25rem
+}
+
+.w-173 {
+ width: 21.625rem
+}
+
+.w-18 {
+ width: 2.25rem
+}
+
+.w-183 {
+ width: 22.875rem
+}
+
+.w-19 {
+ width: 2.375rem
+}
+
+.w-20 {
+ width: 2.5rem
+}
+
+.w-20\% {
+ width: 20%
+}
+
+.w-22 {
+ width: 2.75rem
+}
+
+.w-24 {
+ width: 3rem
+}
+
+.w-25 {
+ width: 3.125rem
+}
+
+.w-256 {
+ width: 32rem
+}
+
+.w-26 {
+ width: 3.25rem
+}
+
+.w-27 {
+ width: 3.375rem
+}
+
+.w-275 {
+ width: 34.375rem
+}
+
+.w-276 {
+ width: 34.5rem
+}
+
+.w-280 {
+ width: 35rem
+}
+
+.w-30 {
+ width: 3.75rem
+}
+
+.w-300 {
+ width: 37.5rem
+}
+
+.w-316 {
+ width: 39.5rem
+}
+
+.w-32 {
+ width: 4rem
+}
+
+.w-320 {
+ width: 40rem
+}
+
+.w-33 {
+ width: 4.125rem
+}
+
+.w-35 {
+ width: 4.375rem
+}
+
+.w-38 {
+ width: 4.75rem
+}
+
+.w-40 {
+ width: 5rem
+}
+
+.w-42 {
+ width: 5.25rem
+}
+
+.w-43 {
+ width: 5.375rem
+}
+
+.w-45 {
+ width: 5.625rem
+}
+
+.w-48 {
+ width: 6rem
+}
+
+.w-50 {
+ width: 6.25rem
+}
+
+.w-6 {
+ width: .75rem
+}
+
+.w-60 {
+ width: 7.5rem
+}
+
+.w-64 {
+ width: 8rem
+}
+
+.w-65 {
+ width: 8.125rem
+}
+
+.w-70 {
+ width: 8.75rem
+}
+
+.w-8 {
+ width: 1rem
+}
+
+.w-80 {
+ width: 10rem
+}
+
+.w-84\.5 {
+ width: 10.5625rem
+}
+
+.w-9 {
+ width: 1.125rem
+}
+
+.w-90 {
+ width: 11.25rem
+}
+
+.w-full {
+ width: 100%
+}
+
+.flex {
+ display: flex
+}
+
+.flex-1 {
+ flex: 1 1 0%
+}
+
+.flex-none {
+ flex: none
+}
+
+.flex-col {
+ flex-direction: column
+}
+
+.rotate-180 {
+ --un-rotate-x: 0;
+ --un-rotate-y: 0;
+ --un-rotate-z: 0;
+ --un-rotate: 360deg;
+ transform: translate(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotate(var(--un-rotate-z)) skew(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z))
+}
+
+.rotate-90 {
+ --un-rotate-x: 0;
+ --un-rotate-y: 0;
+ --un-rotate-z: 0;
+ --un-rotate: 180deg;
+ transform: translate(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotate(var(--un-rotate-z)) skew(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z))
+}
+
+.transform {
+ transform: translate(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotate(var(--un-rotate-z)) skew(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z))
+}
+
+.resize {
+ resize: both
+}
+
+.items-end {
+ align-items: flex-end
+}
+
+.items-center {
+ align-items: center
+}
+
+.justify-end {
+ justify-content: flex-end
+}
+
+.justify-center {
+ justify-content: center
+}
+
+.justify-between {
+ justify-content: space-between
+}
+
+.justify-around {
+ justify-content: space-around
+}
+
+.gap-10 {
+ gap: 1.25rem
+}
+
+.gap-y-5 {
+ row-gap: .625rem
+}
+
+.overflow-hidden {
+ overflow: hidden
+}
+
+.overflow-x-auto {
+ overflow-x: auto
+}
+
+.overflow-y-auto {
+ overflow-y: auto
+}
+
+.overflow-y-scroll {
+ overflow-y: scroll
+}
+
+.border,
+.border-1 {
+ border-width: 1px
+}
+
+.border-y-1 {
+ border-top-width: 1px;
+ border-bottom-width: 1px
+}
+
+.border-b-1 {
+ border-bottom-width: 1px
+}
+
+.border-\#22A3B6 {
+ --un-border-opacity: 1;
+ border-color: rgb(34 163 182 / var(--un-border-opacity))
+}
+
+.border-\#3348F6 {
+ --un-border-opacity: 1;
+ border-color: rgb(51 72 246 / var(--un-border-opacity))
+}
+
+.border-\#ccc {
+ --un-border-opacity: 1;
+ border-color: rgb(204 204 204 / var(--un-border-opacity))
+}
+
+.border-\#DDE0E4 {
+ --un-border-opacity: 1;
+ border-color: rgb(221 224 228 / var(--un-border-opacity))
+}
+
+.border-gray-400 {
+ --un-border-opacity: 1;
+ border-color: rgb(156 163 175 / var(--un-border-opacity))
+}
+
+.rounded-10 {
+ border-radius: 1.25rem
+}
+
+.rounded-11 {
+ border-radius: 1.375rem
+}
+
+.rounded-12 {
+ border-radius: 1.5rem
+}
+
+.rounded-14 {
+ border-radius: 1.75rem
+}
+
+.rounded-15 {
+ border-radius: 1.875rem
+}
+
+.rounded-18 {
+ border-radius: 2.25rem
+}
+
+.rounded-2 {
+ border-radius: .25rem
+}
+
+.rounded-20 {
+ border-radius: 2.5rem
+}
+
+.rounded-25 {
+ border-radius: 3.125rem
+}
+
+.rounded-4 {
+ border-radius: .5rem
+}
+
+.rounded-5 {
+ border-radius: .625rem
+}
+
+.rounded-7 {
+ border-radius: .875rem
+}
+
+.rounded-8 {
+ border-radius: 1rem
+}
+
+.rounded-full {
+ border-radius: 19998px
+}
+
+.rounded-l-4 {
+ border-top-left-radius: .5rem;
+ border-bottom-left-radius: .5rem
+}
+
+.rounded-r-4 {
+ border-top-right-radius: .5rem;
+ border-bottom-right-radius: .5rem
+}
+
+.rounded-t-12 {
+ border-top-left-radius: 1.5rem;
+ border-top-right-radius: 1.5rem
+}
+
+.rounded-t-20 {
+ border-top-left-radius: 2.5rem;
+ border-top-right-radius: 2.5rem
+}
+
+.border-dashed {
+ border-style: dashed
+}
+
+.border-solid {
+ border-style: solid
+}
+
+.border-y-solid {
+ border-top-style: solid;
+ border-bottom-style: solid
+}
+
+.border-b-dashed {
+ border-bottom-style: dashed
+}
+
+.bg-\#00CE73 {
+ --un-bg-opacity: 1;
+ background-color: rgb(0 206 115 / var(--un-bg-opacity))
+}
+
+.bg-\#22A3B6 {
+ --un-bg-opacity: 1;
+ background-color: rgb(34 163 182 / var(--un-bg-opacity))
+}
+
+.bg-\#333 {
+ --un-bg-opacity: 1;
+ background-color: rgb(51 51 51 / var(--un-bg-opacity))
+}
+
+.bg-\#3640f0 {
+ --un-bg-opacity: 1;
+ background-color: rgb(54 64 240 / var(--un-bg-opacity))
+}
+
+.bg-\#3a7ff6 {
+ --un-bg-opacity: 1;
+ background-color: rgb(58 127 246 / var(--un-bg-opacity))
+}
+
+.bg-\#8581f6 {
+ --un-bg-opacity: 1;
+ background-color: rgb(133 129 246 / var(--un-bg-opacity))
+}
+
+.bg-\#99A3AD {
+ --un-bg-opacity: 1;
+ background-color: rgb(153 163 173 / var(--un-bg-opacity))
+}
+
+.bg-\#9f9cff {
+ --un-bg-opacity: 1;
+ background-color: rgb(159 156 255 / var(--un-bg-opacity))
+}
+
+.bg-\#c3e6ff {
+ --un-bg-opacity: 1;
+ background-color: rgb(195 230 255 / var(--un-bg-opacity))
+}
+
+.bg-\#d8f0dd {
+ --un-bg-opacity: 1;
+ background-color: rgb(216 240 221 / var(--un-bg-opacity))
+}
+
+.bg-\#dcdfe6 {
+ --un-bg-opacity: 1;
+ background-color: rgb(220 223 230 / var(--un-bg-opacity))
+}
+
+.bg-\#de5d56 {
+ --un-bg-opacity: 1;
+ background-color: rgb(222 93 86 / var(--un-bg-opacity))
+}
+
+.bg-\#e9582b {
+ --un-bg-opacity: 1;
+ background-color: rgb(233 88 43 / var(--un-bg-opacity))
+}
+
+.bg-\#EEE {
+ --un-bg-opacity: 1;
+ background-color: rgb(238 238 238 / var(--un-bg-opacity))
+}
+
+.bg-\#F3F5FA {
+ --un-bg-opacity: 1;
+ background-color: rgb(243 245 250 / var(--un-bg-opacity))
+}
+
+.bg-\#F5F6F7 {
+ --un-bg-opacity: 1;
+ background-color: rgb(245 246 247 / var(--un-bg-opacity))
+}
+
+.bg-\#f5f7f9 {
+ --un-bg-opacity: 1;
+ background-color: rgb(245 247 249 / var(--un-bg-opacity))
+}
+
+.bg-\#F6F7FB {
+ --un-bg-opacity: 1;
+ background-color: rgb(246 247 251 / var(--un-bg-opacity))
+}
+
+.bg-\#FFFBDD {
+ --un-bg-opacity: 1;
+ background-color: rgb(255 251 221 / var(--un-bg-opacity))
+}
+
+.bg-\#FFFFFF1A {
+ --un-bg-opacity: .1;
+ background-color: rgb(255 255 255 / var(--un-bg-opacity))
+}
+
+.bg-black {
+ --un-bg-opacity: 1;
+ background-color: rgb(0 0 0 / var(--un-bg-opacity))
+}
+
+.bg-red-600 {
+ --un-bg-opacity: 1;
+ background-color: rgb(220 38 38 / var(--un-bg-opacity))
+}
+
+.bg-white {
+ --un-bg-opacity: 1;
+ background-color: rgb(255 255 255 / var(--un-bg-opacity))
+}
+
+.p-10 {
+ padding: 1.25rem
+}
+
+.p-12 {
+ padding: 1.5rem
+}
+
+.p-14 {
+ padding: 1.75rem
+}
+
+.p-15 {
+ padding: 1.875rem
+}
+
+.p-20 {
+ padding: 2.5rem
+}
+
+.p-3 {
+ padding: .375rem
+}
+
+.p-30 {
+ padding: 3.75rem
+}
+
+.p-5 {
+ padding: .625rem
+}
+
+.p-6 {
+ padding: .75rem
+}
+
+.px {
+ padding-left: .5rem;
+ padding-right: .5rem
+}
+
+.px-10 {
+ padding-left: 1.25rem;
+ padding-right: 1.25rem
+}
+
+.px-11 {
+ padding-left: 1.375rem;
+ padding-right: 1.375rem
+}
+
+.px-12 {
+ padding-left: 1.5rem;
+ padding-right: 1.5rem
+}
+
+.px-13 {
+ padding-left: 1.625rem;
+ padding-right: 1.625rem
+}
+
+.px-14 {
+ padding-left: 1.75rem;
+ padding-right: 1.75rem
+}
+
+.px-15 {
+ padding-left: 1.875rem;
+ padding-right: 1.875rem
+}
+
+.px-16 {
+ padding-left: 2rem;
+ padding-right: 2rem
+}
+
+.px-17 {
+ padding-left: 2.125rem;
+ padding-right: 2.125rem
+}
+
+.px-18 {
+ padding-left: 2.25rem;
+ padding-right: 2.25rem
+}
+
+.px-19 {
+ padding-left: 2.375rem;
+ padding-right: 2.375rem
+}
+
+.px-2 {
+ padding-left: .25rem;
+ padding-right: .25rem
+}
+
+.px-20 {
+ padding-left: 2.5rem;
+ padding-right: 2.5rem
+}
+
+.px-21 {
+ padding-left: 2.625rem;
+ padding-right: 2.625rem
+}
+
+.px-25 {
+ padding-left: 3.125rem;
+ padding-right: 3.125rem
+}
+
+.px-26 {
+ padding-left: 3.25rem;
+ padding-right: 3.25rem
+}
+
+.px-30 {
+ padding-left: 3.75rem;
+ padding-right: 3.75rem
+}
+
+.px-6 {
+ padding-left: .75rem;
+ padding-right: .75rem
+}
+
+.px-8 {
+ padding-left: 1rem;
+ padding-right: 1rem
+}
+
+.px-80 {
+ padding-left: 10rem;
+ padding-right: 10rem
+}
+
+.px-9 {
+ padding-left: 1.125rem;
+ padding-right: 1.125rem
+}
+
+.py-10 {
+ padding-top: 1.25rem;
+ padding-bottom: 1.25rem
+}
+
+.py-100 {
+ padding-top: 12.5rem;
+ padding-bottom: 12.5rem
+}
+
+.py-11 {
+ padding-top: 1.375rem;
+ padding-bottom: 1.375rem
+}
+
+.py-12 {
+ padding-top: 1.5rem;
+ padding-bottom: 1.5rem
+}
+
+.py-14 {
+ padding-top: 1.75rem;
+ padding-bottom: 1.75rem
+}
+
+.py-15 {
+ padding-top: 1.875rem;
+ padding-bottom: 1.875rem
+}
+
+.py-16 {
+ padding-top: 2rem;
+ padding-bottom: 2rem
+}
+
+.py-17 {
+ padding-top: 2.125rem;
+ padding-bottom: 2.125rem
+}
+
+.py-18 {
+ padding-top: 2.25rem;
+ padding-bottom: 2.25rem
+}
+
+.py-2 {
+ padding-top: .25rem;
+ padding-bottom: .25rem
+}
+
+.py-20 {
+ padding-top: 2.5rem;
+ padding-bottom: 2.5rem
+}
+
+.py-25 {
+ padding-top: 3.125rem;
+ padding-bottom: 3.125rem
+}
+
+.py-3 {
+ padding-top: .375rem;
+ padding-bottom: .375rem
+}
+
+.py-30 {
+ padding-top: 3.75rem;
+ padding-bottom: 3.75rem
+}
+
+.py-4 {
+ padding-top: .5rem;
+ padding-bottom: .5rem
+}
+
+.py-40 {
+ padding-top: 5rem;
+ padding-bottom: 5rem
+}
+
+.py-5 {
+ padding-top: .625rem;
+ padding-bottom: .625rem
+}
+
+.py-6 {
+ padding-top: .75rem;
+ padding-bottom: .75rem
+}
+
+.py-7 {
+ padding-top: .875rem;
+ padding-bottom: .875rem
+}
+
+.py-9 {
+ padding-top: 1.125rem;
+ padding-bottom: 1.125rem
+}
+
+.pb-10 {
+ padding-bottom: 1.25rem
+}
+
+.pb-100 {
+ padding-bottom: 12.5rem
+}
+
+.pb-130 {
+ padding-bottom: 16.25rem
+}
+
+.pb-15 {
+ padding-bottom: 1.875rem
+}
+
+.pb-16 {
+ padding-bottom: 2rem
+}
+
+.pb-20 {
+ padding-bottom: 2.5rem
+}
+
+.pb-30 {
+ padding-bottom: 3.75rem
+}
+
+.pb-40 {
+ padding-bottom: 5rem
+}
+
+.pb-50 {
+ padding-bottom: 6.25rem
+}
+
+.pb-60 {
+ padding-bottom: 7.5rem
+}
+
+.pb-80 {
+ padding-bottom: 10rem
+}
+
+.pr-5 {
+ padding-right: .625rem
+}
+
+.pt-10 {
+ padding-top: 1.25rem
+}
+
+.pt-16 {
+ padding-top: 2rem
+}
+
+.pt-20 {
+ padding-top: 2.5rem
+}
+
+.pt-23 {
+ padding-top: 2.875rem
+}
+
+.pt-24 {
+ padding-top: 3rem
+}
+
+.pt-28 {
+ padding-top: 3.5rem
+}
+
+.pt-30 {
+ padding-top: 3.75rem
+}
+
+.pt-40 {
+ padding-top: 5rem
+}
+
+.pt-50 {
+ padding-top: 6.25rem
+}
+
+.pt-90 {
+ padding-top: 11.25rem
+}
+
+.text-center {
+ text-align: center
+}
+
+.text-right {
+ text-align: right
+}
+
+.text-end {
+ text-align: end
+}
+
+.text-10 {
+ font-size: 1.25rem
+}
+
+.text-11 {
+ font-size: 1.375rem
+}
+
+.text-12 {
+ font-size: 1.5rem
+}
+
+.text-13 {
+ font-size: 1.625rem
+}
+
+.text-14 {
+ font-size: 1.75rem
+}
+
+.text-15 {
+ font-size: 1.875rem
+}
+
+.text-16 {
+ font-size: 2rem
+}
+
+.text-17 {
+ font-size: 2.125rem
+}
+
+.text-18 {
+ font-size: 2.25rem
+}
+
+.text-19 {
+ font-size: 2.375rem
+}
+
+.text-20 {
+ font-size: 2.5rem
+}
+
+.text-21 {
+ font-size: 2.625rem
+}
+
+.text-22 {
+ font-size: 2.75rem
+}
+
+.text-24 {
+ font-size: 3rem
+}
+
+.text-25 {
+ font-size: 3.125rem
+}
+
+.text-27 {
+ font-size: 3.375rem
+}
+
+.text-31 {
+ font-size: 3.875rem
+}
+
+.text-34 {
+ font-size: 4.25rem
+}
+
+.text-36 {
+ font-size: 4.5rem
+}
+
+.text-38 {
+ font-size: 4.75rem
+}
+
+.text-40 {
+ font-size: 5rem
+}
+
+.text-\#22A3B6 {
+ --un-text-opacity: 1;
+ color: rgb(34 163 182 / var(--un-text-opacity))
+}
+
+.text-\#3348F6 {
+ --un-text-opacity: 1;
+ color: rgb(51 72 246 / var(--un-text-opacity))
+}
+
+.text-\#33cd99,
+.text-quote-green {
+ --un-text-opacity: 1;
+ color: rgb(51 205 153 / var(--un-text-opacity))
+}
+
+.text-\#3640f0 {
+ --un-text-opacity: 1;
+ color: rgb(54 64 240 / var(--un-text-opacity))
+}
+
+.text-\#3a7ff6 {
+ --un-text-opacity: 1;
+ color: rgb(58 127 246 / var(--un-text-opacity))
+}
+
+.text-\#465aff {
+ --un-text-opacity: 1;
+ color: rgb(70 90 255 / var(--un-text-opacity))
+}
+
+.text-\#818894 {
+ --un-text-opacity: 1;
+ color: rgb(129 136 148 / var(--un-text-opacity))
+}
+
+.text-\#8c8c8c {
+ --un-text-opacity: 1;
+ color: rgb(140 140 140 / var(--un-text-opacity))
+}
+
+.text-\#9c9c9c {
+ --un-text-opacity: 1;
+ color: rgb(156 156 156 / var(--un-text-opacity))
+}
+
+.text-\#B3B8BF {
+ --un-text-opacity: 1;
+ color: rgb(179 184 191 / var(--un-text-opacity))
+}
+
+.text-\#de5d56 {
+ --un-text-opacity: 1;
+ color: rgb(222 93 86 / var(--un-text-opacity))
+}
+
+.text-\#FFE400 {
+ --un-text-opacity: 1;
+ color: rgb(255 228 0 / var(--un-text-opacity))
+}
+
+.text-black {
+ --un-text-opacity: 1;
+ color: rgb(0 0 0 / var(--un-text-opacity))
+}
+
+.text-blue {
+ --un-text-opacity: 1;
+ color: rgb(96 165 250 / var(--un-text-opacity))
+}
+
+.text-blue-500 {
+ --un-text-opacity: 1;
+ color: rgb(59 130 246 / var(--un-text-opacity))
+}
+
+.text-blue-600 {
+ --un-text-opacity: 1;
+ color: rgb(37 99 235 / var(--un-text-opacity))
+}
+
+.text-gray,
+.text-gray-400 {
+ --un-text-opacity: 1;
+ color: rgb(156 163 175 / var(--un-text-opacity))
+}
+
+.text-gray-500 {
+ --un-text-opacity: 1;
+ color: rgb(107 114 128 / var(--un-text-opacity))
+}
+
+.text-green {
+ --un-text-opacity: 1;
+ color: rgb(74 222 128 / var(--un-text-opacity))
+}
+
+.text-green-500 {
+ --un-text-opacity: 1;
+ color: rgb(34 197 94 / var(--un-text-opacity))
+}
+
+.text-orange {
+ --un-text-opacity: 1;
+ color: rgb(251 146 60 / var(--un-text-opacity))
+}
+
+.text-quote-red {
+ --un-text-opacity: 1;
+ color: rgb(233 88 43 / var(--un-text-opacity))
+}
+
+.text-red {
+ --un-text-opacity: 1;
+ color: rgb(248 113 113 / var(--un-text-opacity))
+}
+
+.text-white {
+ --un-text-opacity: 1;
+ color: rgb(255 255 255 / var(--un-text-opacity))
+}
+
+.font-400 {
+ font-weight: 400
+}
+
+.font-500,
+.font-medium {
+ font-weight: 500
+}
+
+.font-700,
+.font-bold {
+ font-weight: 700
+}
+
+.font-semibold {
+ font-weight: 600
+}
+
+.leading-15 {
+ line-height: 1.875rem
+}
+
+.leading-16 {
+ line-height: 2rem
+}
+
+.leading-20 {
+ line-height: 2.5rem
+}
+
+.leading-21 {
+ line-height: 2.625rem
+}
+
+.leading-22 {
+ line-height: 2.75rem
+}
+
+.leading-24 {
+ line-height: 3rem
+}
+
+.leading-25 {
+ line-height: 3.125rem
+}
+
+.leading-26 {
+ line-height: 3.25rem
+}
+
+.leading-28 {
+ line-height: 3.5rem
+}
+
+.leading-32 {
+ line-height: 4rem
+}
+
+.leading-34 {
+ line-height: 4.25rem
+}
+
+.leading-40 {
+ line-height: 5rem
+}
+
+.leading-42 {
+ line-height: 5.25rem
+}
+
+.leading-45 {
+ line-height: 5.625rem
+}
+
+.leading-50 {
+ line-height: 6.25rem
+}
+
+.leading-55 {
+ line-height: 6.875rem
+}
+
+.leading-77 {
+ line-height: 9.625rem
+}
+
+.underline {
+ text-decoration-line: underline
+}
+
+.backdrop-filter {
+ -webkit-backdrop-filter: var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
+ backdrop-filter: var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia)
+}
+
+.ease {
+ transition-timing-function: cubic-bezier(.4, 0, .2, 1)
+}
+
+:root,
+uni-page-body {
+ background-color: #fff;
+ color: #242629;
+ font-size: 1.75rem;
+ font-weight: 400;
+ font-family: PingFangSC, PingFang SC, sans-serif
+}
+
+body {
+ background-color: #fff
+}
+
+:root ::-webkit-scrollbar,
+uni-page-body ::-webkit-scrollbar {
+ display: none
+}
+
+.text_ellipsis {
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis
+}
+
+.status_bar {
+ padding-top: var(--status-bar-height)
+}
+
+.input-placeholder {
+ color: #b3b8bf;
+ font-size: 1.75rem;
+ font-weight: 400
+}
+
+.bg-quote-red {
+ background-color: #e9582b
+}
+
+.bg-quote-green {
+ background-color: #33cd99
+}
\ No newline at end of file
diff --git a/src/assets/css/index-b3fb30cd.css b/src/assets/css/index-b3fb30cd.css
new file mode 100644
index 0000000..593c18c
--- /dev/null
+++ b/src/assets/css/index-b3fb30cd.css
@@ -0,0 +1,2631 @@
+* {
+ margin: 0;
+ -webkit-tap-highlight-color: transparent
+}
+
+html,
+body {
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ user-select: none;
+ width: 100%;
+ height: 100%
+}
+
+body {
+ overflow-x: hidden;
+ font-size: 16px
+}
+
+uni-app,
+uni-page,
+uni-page-wrapper,
+uni-page-body {
+ display: block;
+ box-sizing: border-box;
+ width: 100%
+}
+
+uni-page-wrapper {
+ position: relative
+}
+
+#app,
+uni-app,
+uni-page,
+uni-page-wrapper {
+ height: 100%
+}
+
+.uni-mask {
+ position: fixed;
+ z-index: 999;
+ top: 0;
+ right: 0;
+ left: 0;
+ bottom: 0;
+ background: rgba(0, 0, 0, .5)
+}
+
+.uni-fade-enter-active,
+.uni-fade-leave-active {
+ transition-duration: .25s;
+ transition-property: opacity;
+ transition-timing-function: ease
+}
+
+.uni-fade-enter-from,
+.uni-fade-leave-active {
+ opacity: 0
+}
+
+.uni-loading,
+uni-button[loading]:before {
+ background-color: transparent;
+ background-image: url(data:image/svg+xml;base64,\ PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMjAiIGhlaWdodD0iMTIwIiB2aWV3Qm94PSIwIDAgMTAwIDEwMCI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTTAgMGgxMDB2MTAwSDB6Ii8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjRTlFOUU5IiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgLTMwKSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iIzk4OTY5NyIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgzMCAxMDUuOTggNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjOUI5OTlBIiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKDYwIDc1Ljk4IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0EzQTFBMiIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSg5MCA2NSA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNBQkE5QUEiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoMTIwIDU4LjY2IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0IyQjJCMiIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgxNTAgNTQuMDIgNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjQkFCOEI5IiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKDE4MCA1MCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNDMkMwQzEiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTE1MCA0NS45OCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNDQkNCQ0IiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTEyMCA0MS4zNCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNEMkQyRDIiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTkwIDM1IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0RBREFEQSIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgtNjAgMjQuMDIgNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjRTJFMkUyIiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKC0zMCAtNS45OCA2NSkiLz48L3N2Zz4=);
+ background-repeat: no-repeat
+}
+
+.uni-loading {
+ width: 20px;
+ height: 20px;
+ display: inline-block;
+ vertical-align: middle;
+ animation: uni-loading 1s steps(12, end) infinite;
+ background-size: 100%
+}
+
+@keyframes uni-loading {
+ 0% {
+ transform: rotate3d(0, 0, 1, 0)
+ }
+
+ to {
+ transform: rotate3d(0, 0, 1, 360deg)
+ }
+}
+
+html {
+ --primary-color: #007aff;
+ --UI-BG: #fff;
+ --UI-BG-1: #f7f7f7;
+ --UI-BG-2: #fff;
+ --UI-BG-3: #f7f7f7;
+ --UI-BG-4: #4c4c4c;
+ --UI-BG-5: #fff;
+ --UI-FG: #000;
+ --UI-FG-0: rgba(0, 0, 0, .9);
+ --UI-FG-HALF: rgba(0, 0, 0, .9);
+ --UI-FG-1: rgba(0, 0, 0, .5);
+ --UI-FG-2: rgba(0, 0, 0, .3);
+ --UI-FG-3: rgba(0, 0, 0, .1)
+}
+
+body:after {
+ position: fixed;
+ content: "";
+ left: -1000px;
+ top: -1000px;
+ animation: shadow-preload .1s;
+ animation-delay: 3s
+}
+
+@keyframes shadow-preload {
+ 0% {
+ background-image: url(https://cdn.dcloud.net.cn/img/shadow-grey.png)
+ }
+
+ to {
+ background-image: url(https://cdn.dcloud.net.cn/img/shadow-grey.png)
+ }
+}
+
+.uni-async-error {
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ color: #999;
+ padding: 100px 10px;
+ text-align: center
+}
+
+.uni-async-loading {
+ box-sizing: border-box;
+ width: 100%;
+ padding: 50px;
+ text-align: center
+}
+
+.uni-async-loading .uni-loading {
+ width: 30px;
+ height: 30px
+}
+
+uni-page-head {
+ display: block;
+ box-sizing: border-box
+}
+
+.uni-page-head {
+ position: fixed;
+ left: var(--window-left);
+ right: var(--window-right);
+ height: 44px;
+ height: calc(44px + constant(safe-area-inset-top));
+ height: calc(44px + env(safe-area-inset-top));
+ padding: 7px 3px;
+ padding-top: calc(7px + constant(safe-area-inset-top));
+ padding-top: calc(7px + env(safe-area-inset-top));
+ display: flex;
+ overflow: hidden;
+ justify-content: space-between;
+ box-sizing: border-box;
+ z-index: 998;
+ color: #fff;
+ background-color: #000;
+ transition-property: all
+}
+
+.uni-page-head * {
+ box-sizing: border-box
+}
+
+.uni-page-head .uni-btn-icon {
+ overflow: hidden;
+ min-width: 1em;
+ font-style: normal
+}
+
+.uni-page-head-titlePenetrate,
+.uni-page-head-titlePenetrate .uni-page-head-bd,
+.uni-page-head-titlePenetrate .uni-page-head-bd * {
+ pointer-events: none
+}
+
+.uni-page-head-titlePenetrate * {
+ pointer-events: auto
+}
+
+.uni-page-head.uni-page-head-transparent .uni-page-head-ft>div {
+ justify-content: center
+}
+
+.uni-page-head~.uni-placeholder {
+ width: 100%;
+ height: 44px;
+ height: calc(44px + constant(safe-area-inset-top));
+ height: calc(44px + env(safe-area-inset-top))
+}
+
+.uni-placeholder-titlePenetrate {
+ pointer-events: none
+}
+
+.uni-page-head-hd {
+ display: flex;
+ align-items: center;
+ font-size: 16px
+}
+
+.uni-page-head-bd {
+ position: absolute;
+ left: 70px;
+ right: 70px;
+ min-width: 0;
+ -webkit-user-select: auto;
+ -moz-user-select: auto;
+ user-select: auto
+}
+
+.uni-page-head-btn {
+ position: relative;
+ width: auto;
+ margin: 0 2px;
+ word-break: keep-all;
+ white-space: pre;
+ cursor: pointer;
+ font-size: 0px
+}
+
+.uni-page-head-transparent .uni-page-head-btn {
+ display: flex;
+ align-items: center;
+ width: 32px;
+ height: 32px;
+ border-radius: 50%;
+ background-color: rgba(0, 0, 0, .5)
+}
+
+.uni-page-head-btn-red-dot:after {
+ content: attr(badge-text);
+ position: absolute;
+ right: 0;
+ top: 0;
+ background-color: red;
+ color: #fff;
+ width: 18px;
+ height: 18px;
+ line-height: 18px;
+ border-radius: 18px;
+ overflow: hidden;
+ transform: scale(.5) translate(40%, -40%);
+ transform-origin: 100% 0
+}
+
+.uni-page-head-btn-red-dot[badge-text]:after {
+ font-size: 12px;
+ width: auto;
+ min-width: 18px;
+ max-width: 42px;
+ text-align: center;
+ padding: 0 3px;
+ transform: scale(.7) translate(40%, -40%)
+}
+
+.uni-page-head-btn-select svg {
+ vertical-align: middle;
+ margin-left: 2px;
+ transform: rotate(270deg) scale(.8)
+}
+
+.uni-page-head-search {
+ position: relative;
+ display: flex;
+ flex: 1;
+ margin: 0 2px;
+ line-height: 30px;
+ font-size: 15px
+}
+
+.uni-page-head-search-input {
+ width: 100%;
+ height: 100%;
+ padding-left: 34px;
+ text-align: left
+}
+
+.uni-page-head-search-placeholder {
+ position: absolute;
+ max-width: 100%;
+ height: 100%;
+ padding-left: 34px;
+ overflow: hidden;
+ word-break: keep-all;
+ white-space: pre
+}
+
+.uni-page-head-search-placeholder-right {
+ right: 0
+}
+
+.uni-page-head-search-placeholder-center {
+ left: 50%;
+ transform: translate(-50%)
+}
+
+.uni-page-head-search-icon {
+ position: absolute;
+ top: 0;
+ left: 2px;
+ width: 30px;
+ height: 30px;
+ display: flex;
+ justify-content: center;
+ align-items: center
+}
+
+.uni-page-head-ft {
+ display: flex;
+ align-items: center;
+ flex-direction: row-reverse;
+ font-size: 13px
+}
+
+.uni-page-head__title {
+ font-weight: 700;
+ font-size: 16px;
+ line-height: 30px;
+ text-align: center;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis
+}
+
+.uni-page-head__title .uni-loading {
+ width: 16px;
+ height: 16px;
+ margin-top: -3px
+}
+
+.uni-page-head__title .uni-page-head__title_image {
+ width: auto;
+ height: 26px;
+ vertical-align: middle
+}
+
+.uni-page-head-shadow {
+ overflow: visible
+}
+
+.uni-page-head-shadow:after {
+ content: "";
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 100%;
+ height: 5px;
+ background-size: 100% 100%
+}
+
+.uni-page-head-shadow-grey:after {
+ background-image: url(https://cdn.dcloud.net.cn/img/shadow-grey.png)
+}
+
+.uni-page-head-shadow-blue:after {
+ background-image: url(https://cdn.dcloud.net.cn/img/shadow-blue.png)
+}
+
+.uni-page-head-shadow-green:after {
+ background-image: url(https://cdn.dcloud.net.cn/img/shadow-green.png)
+}
+
+.uni-page-head-shadow-orange:after {
+ background-image: url(https://cdn.dcloud.net.cn/img/shadow-orange.png)
+}
+
+.uni-page-head-shadow-red:after {
+ background-image: url(https://cdn.dcloud.net.cn/img/shadow-red.png)
+}
+
+.uni-page-head-shadow-yellow:after {
+ background-image: url(https://cdn.dcloud.net.cn/img/shadow-yellow.png)
+}
+
+uni-page-head[uni-page-head-type=default]~uni-page-wrapper {
+ height: calc(100% - 44px);
+ height: calc(100% - 44px - constant(safe-area-inset-top));
+ height: calc(100% - 44px - env(safe-area-inset-top))
+}
+
+uni-tabbar {
+ display: block;
+ box-sizing: border-box;
+ width: 100%;
+ z-index: 998
+}
+
+.uni-tabbar {
+ display: flex;
+ z-index: 998;
+ box-sizing: border-box
+}
+
+.uni-tabbar-top,
+.uni-tabbar-bottom,
+.uni-tabbar-top .uni-tabbar,
+.uni-tabbar-bottom .uni-tabbar {
+ position: fixed;
+ left: var(--window-left);
+ right: var(--window-right)
+}
+
+.uni-app--showlayout+.uni-tabbar-top,
+.uni-app--showlayout+.uni-tabbar-bottom,
+.uni-app--showlayout+.uni-tabbar-top .uni-tabbar,
+.uni-app--showlayout+.uni-tabbar-bottom .uni-tabbar {
+ left: var(--window-margin);
+ right: var(--window-margin)
+}
+
+.uni-tabbar-bottom .uni-tabbar {
+ bottom: 0;
+ padding-bottom: 0;
+ padding-bottom: constant(safe-area-inset-bottom);
+ padding-bottom: env(safe-area-inset-bottom)
+}
+
+.uni-tabbar~.uni-placeholder {
+ width: 100%;
+ margin-bottom: 0;
+ margin-bottom: constant(safe-area-inset-bottom);
+ margin-bottom: env(safe-area-inset-bottom)
+}
+
+.uni-tabbar * {
+ box-sizing: border-box
+}
+
+.uni-tabbar__item {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+ flex: 1;
+ font-size: 0;
+ text-align: center;
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
+}
+
+.uni-tabbar__bd {
+ position: relative;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ cursor: pointer
+}
+
+.uni-tabbar__icon {
+ position: relative;
+ display: inline-block;
+ margin-top: 5px
+}
+
+.uni-tabbar__icon.uni-tabbar__icon__diff {
+ margin-top: 0;
+ width: 34px;
+ height: 34px
+}
+
+.uni-tabbar__icon img {
+ width: 100%;
+ height: 100%
+}
+
+.uni-tabbar__iconfont {
+ font-family: UniTabbarIconFont
+}
+
+.uni-tabbar__label {
+ position: relative;
+ text-align: center;
+ font-size: 10px
+}
+
+.uni-tabbar-border {
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 1px;
+ transform: scaleY(.5)
+}
+
+.uni-tabbar__reddot {
+ position: absolute;
+ top: 2px;
+ right: 0;
+ width: 12px;
+ height: 12px;
+ border-radius: 50%;
+ background-color: #f43530;
+ color: #fff;
+ transform: translate(40%)
+}
+
+.uni-tabbar__badge {
+ width: auto;
+ height: 16px;
+ line-height: 16px;
+ border-radius: 16px;
+ min-width: 16px;
+ padding: 0 2px;
+ font-size: 12px;
+ text-align: center;
+ white-space: nowrap
+}
+
+.uni-tabbar__mid {
+ display: flex;
+ justify-content: center;
+ position: absolute;
+ bottom: 0;
+ background-size: 100% 100%
+}
+
+.uni-app--showtabbar uni-page-wrapper {
+ display: block;
+ height: calc(100% - var(--tab-bar-height));
+ height: calc(100% - var(--tab-bar-height) - constant(safe-area-inset-bottom));
+ height: calc(100% - var(--tab-bar-height) - env(safe-area-inset-bottom))
+}
+
+.uni-app--showtabbar uni-page-wrapper:after {
+ content: "";
+ display: block;
+ width: 100%;
+ height: var(--tab-bar-height);
+ height: calc(var(--tab-bar-height) + constant(safe-area-inset-bottom));
+ height: calc(var(--tab-bar-height) + env(safe-area-inset-bottom))
+}
+
+.uni-app--showtabbar uni-page-head[uni-page-head-type=default]~uni-page-wrapper {
+ height: calc(100% - 44px - var(--tab-bar-height));
+ height: calc(100% - 44px - constant(safe-area-inset-top) - var(--tab-bar-height) - constant(safe-area-inset-bottom));
+ height: calc(100% - 44px - env(safe-area-inset-top) - var(--tab-bar-height) - env(safe-area-inset-bottom))
+}
+
+*,
+:before,
+:after {
+ --un-rotate: 0;
+ --un-rotate-x: 0;
+ --un-rotate-y: 0;
+ --un-rotate-z: 0;
+ --un-scale-x: 1;
+ --un-scale-y: 1;
+ --un-scale-z: 1;
+ --un-skew-x: 0;
+ --un-skew-y: 0;
+ --un-translate-x: 0;
+ --un-translate-y: 0;
+ --un-translate-z: 0;
+ --un-pan-x: ;
+ --un-pan-y: ;
+ --un-pinch-zoom: ;
+ --un-scroll-snap-strictness: proximity;
+ --un-ordinal: ;
+ --un-slashed-zero: ;
+ --un-numeric-figure: ;
+ --un-numeric-spacing: ;
+ --un-numeric-fraction: ;
+ --un-border-spacing-x: 0;
+ --un-border-spacing-y: 0;
+ --un-ring-offset-shadow: 0 0 rgb(0 0 0 / 0);
+ --un-ring-shadow: 0 0 rgb(0 0 0 / 0);
+ --un-shadow-inset: ;
+ --un-shadow: 0 0 rgb(0 0 0 / 0);
+ --un-ring-inset: ;
+ --un-ring-offset-width: 0px;
+ --un-ring-offset-color: #fff;
+ --un-ring-width: 0px;
+ --un-ring-color: rgb(147 197 253 / .5);
+ --un-blur: ;
+ --un-brightness: ;
+ --un-contrast: ;
+ --un-drop-shadow: ;
+ --un-grayscale: ;
+ --un-hue-rotate: ;
+ --un-invert: ;
+ --un-saturate: ;
+ --un-sepia: ;
+ --un-backdrop-blur: ;
+ --un-backdrop-brightness: ;
+ --un-backdrop-contrast: ;
+ --un-backdrop-grayscale: ;
+ --un-backdrop-hue-rotate: ;
+ --un-backdrop-invert: ;
+ --un-backdrop-opacity: ;
+ --un-backdrop-saturate: ;
+ --un-backdrop-sepia:
+}
+
+::backdrop {
+ --un-rotate: 0;
+ --un-rotate-x: 0;
+ --un-rotate-y: 0;
+ --un-rotate-z: 0;
+ --un-scale-x: 1;
+ --un-scale-y: 1;
+ --un-scale-z: 1;
+ --un-skew-x: 0;
+ --un-skew-y: 0;
+ --un-translate-x: 0;
+ --un-translate-y: 0;
+ --un-translate-z: 0;
+ --un-pan-x: ;
+ --un-pan-y: ;
+ --un-pinch-zoom: ;
+ --un-scroll-snap-strictness: proximity;
+ --un-ordinal: ;
+ --un-slashed-zero: ;
+ --un-numeric-figure: ;
+ --un-numeric-spacing: ;
+ --un-numeric-fraction: ;
+ --un-border-spacing-x: 0;
+ --un-border-spacing-y: 0;
+ --un-ring-offset-shadow: 0 0 rgb(0 0 0 / 0);
+ --un-ring-shadow: 0 0 rgb(0 0 0 / 0);
+ --un-shadow-inset: ;
+ --un-shadow: 0 0 rgb(0 0 0 / 0);
+ --un-ring-inset: ;
+ --un-ring-offset-width: 0px;
+ --un-ring-offset-color: #fff;
+ --un-ring-width: 0px;
+ --un-ring-color: rgb(147 197 253 / .5);
+ --un-blur: ;
+ --un-brightness: ;
+ --un-contrast: ;
+ --un-drop-shadow: ;
+ --un-grayscale: ;
+ --un-hue-rotate: ;
+ --un-invert: ;
+ --un-saturate: ;
+ --un-sepia: ;
+ --un-backdrop-blur: ;
+ --un-backdrop-brightness: ;
+ --un-backdrop-contrast: ;
+ --un-backdrop-grayscale: ;
+ --un-backdrop-hue-rotate: ;
+ --un-backdrop-invert: ;
+ --un-backdrop-opacity: ;
+ --un-backdrop-saturate: ;
+ --un-backdrop-sepia:
+}
+
+.i-carbon\:caret-down {
+ --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 32 32' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='m24 12l-8 10l-8-10z'/%3E%3C/svg%3E");
+ -webkit-mask: var(--un-icon) no-repeat;
+ mask: var(--un-icon) no-repeat;
+ -webkit-mask-size: 100% 100%;
+ mask-size: 100% 100%;
+ background-color: currentColor;
+ color: inherit;
+ width: 1.2em;
+ height: 1.2em
+}
+
+.i-material-symbols\:arrow-back-ios-new-rounded {
+ --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='m9.55 12l7.35 7.35q.375.375.363.875t-.388.875t-.875.375t-.875-.375l-7.7-7.675q-.3-.3-.45-.675t-.15-.75t.15-.75t.45-.675l7.7-7.7q.375-.375.888-.363t.887.388t.375.875t-.375.875z'/%3E%3C/svg%3E");
+ -webkit-mask: var(--un-icon) no-repeat;
+ mask: var(--un-icon) no-repeat;
+ -webkit-mask-size: 100% 100%;
+ mask-size: 100% 100%;
+ background-color: currentColor;
+ color: inherit;
+ width: 1.2em;
+ height: 1.2em
+}
+
+.i-material-symbols\:arrow-drop-down-rounded {
+ --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M11.475 14.475L7.85 10.85q-.075-.075-.112-.162T7.7 10.5q0-.2.138-.35T8.2 10h7.6q.225 0 .363.15t.137.35q0 .05-.15.35l-3.625 3.625q-.125.125-.25.175T12 14.7t-.275-.05t-.25-.175'/%3E%3C/svg%3E");
+ -webkit-mask: var(--un-icon) no-repeat;
+ mask: var(--un-icon) no-repeat;
+ -webkit-mask-size: 100% 100%;
+ mask-size: 100% 100%;
+ background-color: currentColor;
+ color: inherit;
+ width: 1.2em;
+ height: 1.2em
+}
+
+.i-material-symbols\:arrow-drop-up-rounded {
+ --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M8.2 14q-.225 0-.362-.15T7.7 13.5q0-.05.15-.35l3.625-3.625q.125-.125.25-.175T12 9.3t.275.05t.25.175l3.625 3.625q.075.075.113.163t.037.187q0 .2-.137.35T15.8 14z'/%3E%3C/svg%3E");
+ -webkit-mask: var(--un-icon) no-repeat;
+ mask: var(--un-icon) no-repeat;
+ -webkit-mask-size: 100% 100%;
+ mask-size: 100% 100%;
+ background-color: currentColor;
+ color: inherit;
+ width: 1.2em;
+ height: 1.2em
+}
+
+.i-material-symbols\:arrow-right-alt-rounded {
+ --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M16.15 13H5q-.425 0-.712-.288T4 12t.288-.712T5 11h11.15L13.3 8.15q-.3-.3-.288-.7t.288-.7q.3-.3.713-.312t.712.287L19.3 11.3q.15.15.213.325t.062.375t-.062.375t-.213.325l-4.575 4.575q-.3.3-.712.288t-.713-.313q-.275-.3-.288-.7t.288-.7z'/%3E%3C/svg%3E");
+ -webkit-mask: var(--un-icon) no-repeat;
+ mask: var(--un-icon) no-repeat;
+ -webkit-mask-size: 100% 100%;
+ mask-size: 100% 100%;
+ background-color: currentColor;
+ color: inherit;
+ width: 1.2em;
+ height: 1.2em
+}
+
+.i-material-symbols\:arrow-right-rounded {
+ --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M10.5 16.3q-.2 0-.35-.137T10 15.8V8.2q0-.225.15-.362t.35-.138q.05 0 .35.15l3.625 3.625q.125.125.175.25t.05.275t-.05.275t-.175.25L10.85 16.15q-.075.075-.162.113t-.188.037'/%3E%3C/svg%3E");
+ -webkit-mask: var(--un-icon) no-repeat;
+ mask: var(--un-icon) no-repeat;
+ -webkit-mask-size: 100% 100%;
+ mask-size: 100% 100%;
+ background-color: currentColor;
+ color: inherit;
+ width: 1.2em;
+ height: 1.2em
+}
+
+.i-material-symbols\:featured-play-list {
+ --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M6 13h9v-2H6zm0-3h9V8H6zM4 20q-.825 0-1.412-.587T2 18V6q0-.825.588-1.412T4 4h16q.825 0 1.413.588T22 6v12q0 .825-.587 1.413T20 20z'/%3E%3C/svg%3E");
+ -webkit-mask: var(--un-icon) no-repeat;
+ mask: var(--un-icon) no-repeat;
+ -webkit-mask-size: 100% 100%;
+ mask-size: 100% 100%;
+ background-color: currentColor;
+ color: inherit;
+ width: 1.2em;
+ height: 1.2em
+}
+
+.i-material-symbols\:kid-star {
+ --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='m7.625 6.4l2.8-3.625q.3-.4.713-.587T12 2t.863.188t.712.587l2.8 3.625l4.25 1.425q.65.2 1.025.738t.375 1.187q0 .3-.088.6t-.287.575l-2.75 3.9l.1 4.1q.025.875-.575 1.475t-1.4.6q-.05 0-.55-.075L12 19.675l-4.475 1.25q-.125.05-.275.063T6.975 21q-.8 0-1.4-.6T5 18.925l.1-4.125l-2.725-3.875q-.2-.275-.288-.575T2 9.75q0-.625.363-1.162t1.012-.763z'/%3E%3C/svg%3E");
+ -webkit-mask: var(--un-icon) no-repeat;
+ mask: var(--un-icon) no-repeat;
+ -webkit-mask-size: 100% 100%;
+ mask-size: 100% 100%;
+ background-color: currentColor;
+ color: inherit;
+ width: 1.2em;
+ height: 1.2em
+}
+
+.center {
+ display: flex;
+ align-items: center;
+ justify-content: center
+}
+
+.visible {
+ visibility: visible
+}
+
+.absolute {
+ position: absolute
+}
+
+.fixed {
+ position: fixed
+}
+
+.relative {
+ position: relative
+}
+
+.bottom-0 {
+ bottom: 0
+}
+
+.bottom-50 {
+ bottom: 3.125rem
+}
+
+.left--30 {
+ left: -1.875rem
+}
+
+.left-0 {
+ left: 0
+}
+
+.right-0 {
+ right: 0
+}
+
+.top--340 {
+ top: -21.25rem
+}
+
+.top-0 {
+ top: 0
+}
+
+.top-25 {
+ top: 1.5625rem
+}
+
+.top-40 {
+ top: 2.5rem
+}
+
+.z--1 {
+ z-index: -1
+}
+
+.z-99 {
+ z-index: 99
+}
+
+.z-999 {
+ z-index: 999
+}
+
+.grid {
+ display: grid
+}
+
+.grid-cols-2 {
+ grid-template-columns: repeat(2, minmax(0, 1fr))
+}
+
+.grid-cols-5 {
+ grid-template-columns: repeat(5, minmax(0, 1fr))
+}
+
+.float-right {
+ float: right
+}
+
+.m-15 {
+ margin: .9375rem
+}
+
+.m-auto {
+ margin: auto
+}
+
+.mx-12 {
+ margin-left: .75rem;
+ margin-right: .75rem
+}
+
+.mx-13 {
+ margin-left: .8125rem;
+ margin-right: .8125rem
+}
+
+.mx-16 {
+ margin-left: 1rem;
+ margin-right: 1rem
+}
+
+.mx-17 {
+ margin-left: 1.0625rem;
+ margin-right: 1.0625rem
+}
+
+.mx-20 {
+ margin-left: 1.25rem;
+ margin-right: 1.25rem
+}
+
+.mx-24\.5 {
+ margin-left: 1.53125rem;
+ margin-right: 1.53125rem
+}
+
+.mx-auto {
+ margin-left: auto;
+ margin-right: auto
+}
+
+.my-10 {
+ margin-top: .625rem;
+ margin-bottom: .625rem
+}
+
+.my-15 {
+ margin-top: .9375rem;
+ margin-bottom: .9375rem
+}
+
+.my-16 {
+ margin-top: 1rem;
+ margin-bottom: 1rem
+}
+
+.my-20 {
+ margin-top: 1.25rem;
+ margin-bottom: 1.25rem
+}
+
+.my-30 {
+ margin-top: 1.875rem;
+ margin-bottom: 1.875rem
+}
+
+.my-5 {
+ margin-top: .3125rem;
+ margin-bottom: .3125rem
+}
+
+.my-7 {
+ margin-top: .4375rem;
+ margin-bottom: .4375rem
+}
+
+.mb-10 {
+ margin-bottom: .625rem
+}
+
+.mb-15 {
+ margin-bottom: .9375rem
+}
+
+.mb-20 {
+ margin-bottom: 1.25rem
+}
+
+.mb-5 {
+ margin-bottom: .3125rem
+}
+
+.mb-7 {
+ margin-bottom: .4375rem
+}
+
+.ml--2 {
+ margin-left: -.125rem
+}
+
+.ml-10 {
+ margin-left: .625rem
+}
+
+.ml-12 {
+ margin-left: .75rem
+}
+
+.ml-13 {
+ margin-left: .8125rem
+}
+
+.ml-15 {
+ margin-left: .9375rem
+}
+
+.ml-16 {
+ margin-left: 1rem
+}
+
+.ml-20 {
+ margin-left: 1.25rem
+}
+
+.ml-30 {
+ margin-left: 1.875rem
+}
+
+.ml-4 {
+ margin-left: .25rem
+}
+
+.ml-5 {
+ margin-left: .3125rem
+}
+
+.ml-6 {
+ margin-left: .375rem
+}
+
+.ml-8 {
+ margin-left: .5rem
+}
+
+.ml-9 {
+ margin-left: .5625rem
+}
+
+.ml-90 {
+ margin-left: 5.625rem
+}
+
+.mr-10 {
+ margin-right: .625rem
+}
+
+.mr-13 {
+ margin-right: .8125rem
+}
+
+.mr-25 {
+ margin-right: 1.5625rem
+}
+
+.mr-5 {
+ margin-right: .3125rem
+}
+
+.mt--2 {
+ margin-top: -.125rem
+}
+
+.mt--220 {
+ margin-top: -13.75rem
+}
+
+.mt-10 {
+ margin-top: .625rem
+}
+
+.mt-100 {
+ margin-top: 6.25rem
+}
+
+.mt-12 {
+ margin-top: .75rem
+}
+
+.mt-120 {
+ margin-top: 7.5rem
+}
+
+.mt-15 {
+ margin-top: .9375rem
+}
+
+.mt-150 {
+ margin-top: 9.375rem
+}
+
+.mt-16 {
+ margin-top: 1rem
+}
+
+.mt-20 {
+ margin-top: 1.25rem
+}
+
+.mt-24 {
+ margin-top: 1.5rem
+}
+
+.mt-30 {
+ margin-top: 1.875rem
+}
+
+.mt-4 {
+ margin-top: .25rem
+}
+
+.mt-40 {
+ margin-top: 2.5rem
+}
+
+.mt-43 {
+ margin-top: 2.6875rem
+}
+
+.mt-5 {
+ margin-top: .3125rem
+}
+
+.mt-50 {
+ margin-top: 3.125rem
+}
+
+.mt-60 {
+ margin-top: 3.75rem
+}
+
+.mt-70 {
+ margin-top: 4.375rem
+}
+
+.mt-8 {
+ margin-top: .5rem
+}
+
+.mt-80 {
+ margin-top: 5rem
+}
+
+.box-border {
+ box-sizing: border-box
+}
+
+.block {
+ display: block
+}
+
+.inline-block {
+ display: inline-block
+}
+
+.hidden {
+ display: none
+}
+
+.h-0\.5 {
+ height: .03125rem
+}
+
+.h-10 {
+ height: .625rem
+}
+
+.h-100 {
+ height: 6.25rem
+}
+
+.h-100vh {
+ height: 100vh
+}
+
+.h-105 {
+ height: 6.5625rem
+}
+
+.h-113 {
+ height: 7.0625rem
+}
+
+.h-12 {
+ height: .75rem
+}
+
+.h-120 {
+ height: 7.5rem
+}
+
+.h-129 {
+ height: 8.0625rem
+}
+
+.h-13 {
+ height: .8125rem
+}
+
+.h-130 {
+ height: 8.125rem
+}
+
+.h-133 {
+ height: 8.3125rem
+}
+
+.h-14 {
+ height: .875rem
+}
+
+.h-143 {
+ height: 8.9375rem
+}
+
+.h-15 {
+ height: .9375rem
+}
+
+.h-150 {
+ height: 9.375rem
+}
+
+.h-16 {
+ height: 1rem
+}
+
+.h-160 {
+ height: 10rem
+}
+
+.h-17 {
+ height: 1.0625rem
+}
+
+.h-170 {
+ height: 10.625rem
+}
+
+.h-172 {
+ height: 10.75rem
+}
+
+.h-18 {
+ height: 1.125rem
+}
+
+.h-180 {
+ height: 11.25rem
+}
+
+.h-182 {
+ height: 11.375rem
+}
+
+.h-19 {
+ height: 1.1875rem
+}
+
+.h-20 {
+ height: 1.25rem
+}
+
+.h-200 {
+ height: 12.5rem
+}
+
+.h-21 {
+ height: 1.3125rem
+}
+
+.h-22 {
+ height: 1.375rem
+}
+
+.h-23 {
+ height: 1.4375rem
+}
+
+.h-24 {
+ height: 1.5rem
+}
+
+.h-25 {
+ height: 1.5625rem
+}
+
+.h-250 {
+ height: 15.625rem
+}
+
+.h-26 {
+ height: 1.625rem
+}
+
+.h-27 {
+ height: 1.6875rem
+}
+
+.h-270 {
+ height: 16.875rem
+}
+
+.h-30 {
+ height: 1.875rem
+}
+
+.h-300 {
+ height: 18.75rem
+}
+
+.h-32 {
+ height: 2rem
+}
+
+.h-33 {
+ height: 2.0625rem
+}
+
+.h-34 {
+ height: 2.125rem
+}
+
+.h-35 {
+ height: 2.1875rem
+}
+
+.h-375 {
+ height: 23.4375rem
+}
+
+.h-40 {
+ height: 2.5rem
+}
+
+.h-400 {
+ height: 25rem
+}
+
+.h-400px {
+ height: 400px
+}
+
+.h-42 {
+ height: 2.625rem
+}
+
+.h-420px {
+ height: 420px
+}
+
+.h-43 {
+ height: 2.6875rem
+}
+
+.h-44 {
+ height: 2.75rem
+}
+
+.h-45 {
+ height: 2.8125rem
+}
+
+.h-48 {
+ height: 3rem
+}
+
+.h-50 {
+ height: 3.125rem
+}
+
+.h-500 {
+ height: 31.25rem
+}
+
+.h-54 {
+ height: 3.375rem
+}
+
+.h-55 {
+ height: 3.4375rem
+}
+
+.h-57 {
+ height: 3.5625rem
+}
+
+.h-6 {
+ height: .375rem
+}
+
+.h-60 {
+ height: 3.75rem
+}
+
+.h-65 {
+ height: 4.0625rem
+}
+
+.h-70 {
+ height: 4.375rem
+}
+
+.h-77 {
+ height: 4.8125rem
+}
+
+.h-8 {
+ height: .5rem
+}
+
+.h-80 {
+ height: 5rem
+}
+
+.h-85 {
+ height: 5.3125rem
+}
+
+.h-89 {
+ height: 5.5625rem
+}
+
+.h-9 {
+ height: .5625rem
+}
+
+.h-full {
+ height: 100%
+}
+
+.h5 {
+ height: .3125rem
+}
+
+.min-h-100vh {
+ min-height: 100vh
+}
+
+.min-w-100 {
+ min-width: 6.25rem
+}
+
+.w-10 {
+ width: .625rem
+}
+
+.w-100 {
+ width: 6.25rem
+}
+
+.w-110 {
+ width: 6.875rem
+}
+
+.w-12 {
+ width: .75rem
+}
+
+.w-121 {
+ width: 7.5625rem
+}
+
+.w-13 {
+ width: .8125rem
+}
+
+.w-14 {
+ width: .875rem
+}
+
+.w-140 {
+ width: 8.75rem
+}
+
+.w-15 {
+ width: .9375rem
+}
+
+.w-150 {
+ width: 9.375rem
+}
+
+.w-16 {
+ width: 1rem
+}
+
+.w-168 {
+ width: 10.5rem
+}
+
+.w-17 {
+ width: 1.0625rem
+}
+
+.w-170 {
+ width: 10.625rem
+}
+
+.w-173 {
+ width: 10.8125rem
+}
+
+.w-18 {
+ width: 1.125rem
+}
+
+.w-183 {
+ width: 11.4375rem
+}
+
+.w-19 {
+ width: 1.1875rem
+}
+
+.w-20 {
+ width: 1.25rem
+}
+
+.w-20\% {
+ width: 20%
+}
+
+.w-22 {
+ width: 1.375rem
+}
+
+.w-24 {
+ width: 1.5rem
+}
+
+.w-25 {
+ width: 1.5625rem
+}
+
+.w-256 {
+ width: 16rem
+}
+
+.w-26 {
+ width: 1.625rem
+}
+
+.w-27 {
+ width: 1.6875rem
+}
+
+.w-275 {
+ width: 17.1875rem
+}
+
+.w-276 {
+ width: 17.25rem
+}
+
+.w-280 {
+ width: 17.5rem
+}
+
+.w-30 {
+ width: 1.875rem
+}
+
+.w-300 {
+ width: 18.75rem
+}
+
+.w-316 {
+ width: 19.75rem
+}
+
+.w-32 {
+ width: 2rem
+}
+
+.w-320 {
+ width: 20rem
+}
+
+.w-33 {
+ width: 2.0625rem
+}
+
+.w-35 {
+ width: 2.1875rem
+}
+
+.w-38 {
+ width: 2.375rem
+}
+
+.w-40 {
+ width: 2.5rem
+}
+
+.w-42 {
+ width: 2.625rem
+}
+
+.w-43 {
+ width: 2.6875rem
+}
+
+.w-45 {
+ width: 2.8125rem
+}
+
+.w-48 {
+ width: 3rem
+}
+
+.w-50 {
+ width: 3.125rem
+}
+
+.w-6 {
+ width: .375rem
+}
+
+.w-60 {
+ width: 3.75rem
+}
+
+.w-64 {
+ width: 4rem
+}
+
+.w-65 {
+ width: 4.0625rem
+}
+
+.w-70 {
+ width: 4.375rem
+}
+
+.w-8 {
+ width: .5rem
+}
+
+.w-80 {
+ width: 5rem
+}
+
+.w-84\.5 {
+ width: 5.28125rem
+}
+
+.w-9 {
+ width: .5625rem
+}
+
+.w-90 {
+ width: 5.625rem
+}
+
+.w-full {
+ width: 100%
+}
+
+.flex {
+ display: flex
+}
+
+.flex-1 {
+ flex: 1 1 0%
+}
+
+.flex-none {
+ flex: none
+}
+
+.flex-col {
+ flex-direction: column
+}
+
+.rotate-180 {
+ --un-rotate-x: 0;
+ --un-rotate-y: 0;
+ --un-rotate-z: 0;
+ --un-rotate: 180deg;
+ transform: translate(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotate(var(--un-rotate-z)) skew(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z))
+}
+
+.rotate-90 {
+ --un-rotate-x: 0;
+ --un-rotate-y: 0;
+ --un-rotate-z: 0;
+ --un-rotate: 90deg;
+ transform: translate(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotate(var(--un-rotate-z)) skew(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z))
+}
+
+.transform {
+ transform: translate(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotate(var(--un-rotate-z)) skew(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z))
+}
+
+.resize {
+ resize: both
+}
+
+.items-end {
+ align-items: flex-end
+}
+
+.items-center {
+ align-items: center
+}
+
+.justify-end {
+ justify-content: flex-end
+}
+
+.justify-center {
+ justify-content: center
+}
+
+.justify-between {
+ justify-content: space-between
+}
+
+.justify-around {
+ justify-content: space-around
+}
+
+.gap-10 {
+ gap: .625rem
+}
+
+.gap-y-5 {
+ row-gap: .3125rem
+}
+
+.overflow-hidden {
+ overflow: hidden
+}
+
+.overflow-x-auto {
+ overflow-x: auto
+}
+
+.overflow-y-auto {
+ overflow-y: auto
+}
+
+.overflow-y-scroll {
+ overflow-y: scroll
+}
+
+.border,
+.border-1 {
+ border-width: 1px
+}
+
+.border-y-1 {
+ border-top-width: 1px;
+ border-bottom-width: 1px
+}
+
+.border-b-1 {
+ border-bottom-width: 1px
+}
+
+.border-\#22A3B6 {
+ --un-border-opacity: 1;
+ border-color: rgb(34 163 182 / var(--un-border-opacity))
+}
+
+.border-\#3348F6 {
+ --un-border-opacity: 1;
+ border-color: rgb(51 72 246 / var(--un-border-opacity))
+}
+
+.border-\#ccc {
+ --un-border-opacity: 1;
+ border-color: rgb(204 204 204 / var(--un-border-opacity))
+}
+
+.border-\#DDE0E4 {
+ --un-border-opacity: 1;
+ border-color: rgb(221 224 228 / var(--un-border-opacity))
+}
+
+.border-gray-400 {
+ --un-border-opacity: 1;
+ border-color: rgb(156 163 175 / var(--un-border-opacity))
+}
+
+.rounded-10 {
+ border-radius: .625rem
+}
+
+.rounded-11 {
+ border-radius: .6875rem
+}
+
+.rounded-12 {
+ border-radius: .75rem
+}
+
+.rounded-14 {
+ border-radius: .875rem
+}
+
+.rounded-15 {
+ border-radius: .9375rem
+}
+
+.rounded-18 {
+ border-radius: 1.125rem
+}
+
+.rounded-2 {
+ border-radius: .125rem
+}
+
+.rounded-20 {
+ border-radius: 1.25rem
+}
+
+.rounded-25 {
+ border-radius: 1.5625rem
+}
+
+.rounded-4 {
+ border-radius: .25rem
+}
+
+.rounded-5 {
+ border-radius: .3125rem
+}
+
+.rounded-7 {
+ border-radius: .4375rem
+}
+
+.rounded-8 {
+ border-radius: .5rem
+}
+
+.rounded-full {
+ border-radius: 9999px
+}
+
+.rounded-l-4 {
+ border-top-left-radius: .25rem;
+ border-bottom-left-radius: .25rem
+}
+
+.rounded-r-4 {
+ border-top-right-radius: .25rem;
+ border-bottom-right-radius: .25rem
+}
+
+.rounded-t-12 {
+ border-top-left-radius: .75rem;
+ border-top-right-radius: .75rem
+}
+
+.rounded-t-20 {
+ border-top-left-radius: 1.25rem;
+ border-top-right-radius: 1.25rem
+}
+
+.border-dashed {
+ border-style: dashed
+}
+
+.border-solid {
+ border-style: solid
+}
+
+.border-y-solid {
+ border-top-style: solid;
+ border-bottom-style: solid
+}
+
+.border-b-dashed {
+ border-bottom-style: dashed
+}
+
+.bg-\#00CE73 {
+ --un-bg-opacity: 1;
+ background-color: rgb(0 206 115 / var(--un-bg-opacity))
+}
+
+.bg-\#22A3B6 {
+ --un-bg-opacity: 1;
+ background-color: rgb(34 163 182 / var(--un-bg-opacity))
+}
+
+.bg-\#333 {
+ --un-bg-opacity: 1;
+ background-color: rgb(51 51 51 / var(--un-bg-opacity))
+}
+
+.bg-\#3640f0 {
+ --un-bg-opacity: 1;
+ background-color: rgb(54 64 240 / var(--un-bg-opacity))
+}
+
+.bg-\#3a7ff6 {
+ --un-bg-opacity: 1;
+ background-color: rgb(58 127 246 / var(--un-bg-opacity))
+}
+
+.bg-\#8581f6 {
+ --un-bg-opacity: 1;
+ background-color: rgb(133 129 246 / var(--un-bg-opacity))
+}
+
+.bg-\#99A3AD {
+ --un-bg-opacity: 1;
+ background-color: rgb(153 163 173 / var(--un-bg-opacity))
+}
+
+.bg-\#9f9cff {
+ --un-bg-opacity: 1;
+ background-color: rgb(159 156 255 / var(--un-bg-opacity))
+}
+
+.bg-\#c3e6ff {
+ --un-bg-opacity: 1;
+ background-color: rgb(195 230 255 / var(--un-bg-opacity))
+}
+
+.bg-\#d8f0dd {
+ --un-bg-opacity: 1;
+ background-color: rgb(216 240 221 / var(--un-bg-opacity))
+}
+
+.bg-\#dcdfe6 {
+ --un-bg-opacity: 1;
+ background-color: rgb(220 223 230 / var(--un-bg-opacity))
+}
+
+.bg-\#de5d56 {
+ --un-bg-opacity: 1;
+ background-color: rgb(222 93 86 / var(--un-bg-opacity))
+}
+
+.bg-\#e9582b {
+ --un-bg-opacity: 1;
+ background-color: rgb(233 88 43 / var(--un-bg-opacity))
+}
+
+.bg-\#EEE {
+ --un-bg-opacity: 1;
+ background-color: rgb(238 238 238 / var(--un-bg-opacity))
+}
+
+.bg-\#F3F5FA {
+ --un-bg-opacity: 1;
+ background-color: rgb(243 245 250 / var(--un-bg-opacity))
+}
+
+.bg-\#F5F6F7 {
+ --un-bg-opacity: 1;
+ background-color: rgb(245 246 247 / var(--un-bg-opacity))
+}
+
+.bg-\#f5f7f9 {
+ --un-bg-opacity: 1;
+ background-color: rgb(245 247 249 / var(--un-bg-opacity))
+}
+
+.bg-\#F6F7FB {
+ --un-bg-opacity: 1;
+ background-color: rgb(246 247 251 / var(--un-bg-opacity))
+}
+
+.bg-\#FFFBDD {
+ --un-bg-opacity: 1;
+ background-color: rgb(255 251 221 / var(--un-bg-opacity))
+}
+
+.bg-\#FFFFFF1A {
+ --un-bg-opacity: .1;
+ background-color: rgb(255 255 255 / var(--un-bg-opacity))
+}
+
+.bg-black {
+ --un-bg-opacity: 1;
+ background-color: rgb(0 0 0 / var(--un-bg-opacity))
+}
+
+.bg-red-600 {
+ --un-bg-opacity: 1;
+ background-color: rgb(220 38 38 / var(--un-bg-opacity))
+}
+
+.bg-white {
+ --un-bg-opacity: 1;
+ background-color: rgb(255 255 255 / var(--un-bg-opacity))
+}
+
+.p-10 {
+ padding: .625rem
+}
+
+.p-12 {
+ padding: .75rem
+}
+
+.p-14 {
+ padding: .875rem
+}
+
+.p-15 {
+ padding: .9375rem
+}
+
+.p-20 {
+ padding: 1.25rem
+}
+
+.p-3 {
+ padding: .1875rem
+}
+
+.p-30 {
+ padding: 1.875rem
+}
+
+.p-5 {
+ padding: .3125rem
+}
+
+.p-6 {
+ padding: .375rem
+}
+
+.px {
+ padding-left: .25rem;
+ padding-right: .25rem
+}
+
+.px-10 {
+ padding-left: .625rem;
+ padding-right: .625rem
+}
+
+.px-11 {
+ padding-left: .6875rem;
+ padding-right: .6875rem
+}
+
+.px-12 {
+ padding-left: .75rem;
+ padding-right: .75rem
+}
+
+.px-13 {
+ padding-left: .8125rem;
+ padding-right: .8125rem
+}
+
+.px-14 {
+ padding-left: .875rem;
+ padding-right: .875rem
+}
+
+.px-15 {
+ padding-left: .9375rem;
+ padding-right: .9375rem
+}
+
+.px-16 {
+ padding-left: 1rem;
+ padding-right: 1rem
+}
+
+.px-17 {
+ padding-left: 1.0625rem;
+ padding-right: 1.0625rem
+}
+
+.px-18 {
+ padding-left: 1.125rem;
+ padding-right: 1.125rem
+}
+
+.px-19 {
+ padding-left: 1.1875rem;
+ padding-right: 1.1875rem
+}
+
+.px-2 {
+ padding-left: .125rem;
+ padding-right: .125rem
+}
+
+.px-20 {
+ padding-left: 1.25rem;
+ padding-right: 1.25rem
+}
+
+.px-21 {
+ padding-left: 1.3125rem;
+ padding-right: 1.3125rem
+}
+
+.px-25 {
+ padding-left: 1.5625rem;
+ padding-right: 1.5625rem
+}
+
+.px-26 {
+ padding-left: 1.625rem;
+ padding-right: 1.625rem
+}
+
+.px-30 {
+ padding-left: 1.875rem;
+ padding-right: 1.875rem
+}
+
+.px-6 {
+ padding-left: .375rem;
+ padding-right: .375rem
+}
+
+.px-8 {
+ padding-left: .5rem;
+ padding-right: .5rem
+}
+
+.px-80 {
+ padding-left: 5rem;
+ padding-right: 5rem
+}
+
+.px-9 {
+ padding-left: .5625rem;
+ padding-right: .5625rem
+}
+
+.py-10 {
+ padding-top: .625rem;
+ padding-bottom: .625rem
+}
+
+.py-100 {
+ padding-top: 6.25rem;
+ padding-bottom: 6.25rem
+}
+
+.py-11 {
+ padding-top: .6875rem;
+ padding-bottom: .6875rem
+}
+
+.py-12 {
+ padding-top: .75rem;
+ padding-bottom: .75rem
+}
+
+.py-14 {
+ padding-top: .875rem;
+ padding-bottom: .875rem
+}
+
+.py-15 {
+ padding-top: .9375rem;
+ padding-bottom: .9375rem
+}
+
+.py-16 {
+ padding-top: 1rem;
+ padding-bottom: 1rem
+}
+
+.py-17 {
+ padding-top: 1.0625rem;
+ padding-bottom: 1.0625rem
+}
+
+.py-18 {
+ padding-top: 1.125rem;
+ padding-bottom: 1.125rem
+}
+
+.py-2 {
+ padding-top: .125rem;
+ padding-bottom: .125rem
+}
+
+.py-20 {
+ padding-top: 1.25rem;
+ padding-bottom: 1.25rem
+}
+
+.py-25 {
+ padding-top: 1.5625rem;
+ padding-bottom: 1.5625rem
+}
+
+.py-3 {
+ padding-top: .1875rem;
+ padding-bottom: .1875rem
+}
+
+.py-30 {
+ padding-top: 1.875rem;
+ padding-bottom: 1.875rem
+}
+
+.py-4 {
+ padding-top: .25rem;
+ padding-bottom: .25rem
+}
+
+.py-40 {
+ padding-top: 2.5rem;
+ padding-bottom: 2.5rem
+}
+
+.py-5 {
+ padding-top: .3125rem;
+ padding-bottom: .3125rem
+}
+
+.py-6 {
+ padding-top: .375rem;
+ padding-bottom: .375rem
+}
+
+.py-7 {
+ padding-top: .4375rem;
+ padding-bottom: .4375rem
+}
+
+.py-9 {
+ padding-top: .5625rem;
+ padding-bottom: .5625rem
+}
+
+.pb-10 {
+ padding-bottom: .625rem
+}
+
+.pb-100 {
+ padding-bottom: 6.25rem
+}
+
+.pb-130 {
+ padding-bottom: 8.125rem
+}
+
+.pb-15 {
+ padding-bottom: .9375rem
+}
+
+.pb-16 {
+ padding-bottom: 1rem
+}
+
+.pb-20 {
+ padding-bottom: 1.25rem
+}
+
+.pb-30 {
+ padding-bottom: 1.875rem
+}
+
+.pb-40 {
+ padding-bottom: 2.5rem
+}
+
+.pb-50 {
+ padding-bottom: 3.125rem
+}
+
+.pb-60 {
+ padding-bottom: 3.75rem
+}
+
+.pb-80 {
+ padding-bottom: 5rem
+}
+
+.pr-5 {
+ padding-right: .3125rem
+}
+
+.pt-10 {
+ padding-top: .625rem
+}
+
+.pt-16 {
+ padding-top: 1rem
+}
+
+.pt-20 {
+ padding-top: 1.25rem
+}
+
+.pt-23 {
+ padding-top: 1.4375rem
+}
+
+.pt-24 {
+ padding-top: 1.5rem
+}
+
+.pt-28 {
+ padding-top: 1.75rem
+}
+
+.pt-30 {
+ padding-top: 1.875rem
+}
+
+.pt-40 {
+ padding-top: 2.5rem
+}
+
+.pt-50 {
+ padding-top: 3.125rem
+}
+
+.pt-90 {
+ padding-top: 5.625rem
+}
+
+.text-center {
+ text-align: center
+}
+
+.text-right {
+ text-align: right
+}
+
+.text-end {
+ text-align: end
+}
+
+.text-10 {
+ font-size: .625rem
+}
+
+.text-11 {
+ font-size: .6875rem
+}
+
+.text-12 {
+ font-size: .75rem
+}
+
+.text-13 {
+ font-size: .8125rem
+}
+
+.text-14 {
+ font-size: .875rem
+}
+
+.text-15 {
+ font-size: .9375rem
+}
+
+.text-16 {
+ font-size: 1rem
+}
+
+.text-17 {
+ font-size: 1.0625rem
+}
+
+.text-18 {
+ font-size: 1.125rem
+}
+
+.text-19 {
+ font-size: 1.1875rem
+}
+
+.text-20 {
+ font-size: 1.25rem
+}
+
+.text-21 {
+ font-size: 1.3125rem
+}
+
+.text-22 {
+ font-size: 1.375rem
+}
+
+.text-24 {
+ font-size: 1.5rem
+}
+
+.text-25 {
+ font-size: 1.5625rem
+}
+
+.text-27 {
+ font-size: 1.6875rem
+}
+
+.text-31 {
+ font-size: 1.9375rem
+}
+
+.text-34 {
+ font-size: 2.125rem
+}
+
+.text-36 {
+ font-size: 2.25rem
+}
+
+.text-38 {
+ font-size: 2.375rem
+}
+
+.text-40 {
+ font-size: 2.5rem
+}
+
+.text-\#22A3B6 {
+ --un-text-opacity: 1;
+ color: rgb(34 163 182 / var(--un-text-opacity))
+}
+
+.text-\#3348F6 {
+ --un-text-opacity: 1;
+ color: rgb(51 72 246 / var(--un-text-opacity))
+}
+
+.text-\#33cd99,
+.text-quote-green {
+ --un-text-opacity: 1;
+ color: rgb(51 205 153 / var(--un-text-opacity))
+}
+
+.text-\#3640f0 {
+ --un-text-opacity: 1;
+ color: rgb(54 64 240 / var(--un-text-opacity))
+}
+
+.text-\#3a7ff6 {
+ --un-text-opacity: 1;
+ color: rgb(58 127 246 / var(--un-text-opacity))
+}
+
+.text-\#465aff {
+ --un-text-opacity: 1;
+ color: rgb(70 90 255 / var(--un-text-opacity))
+}
+
+.text-\#818894 {
+ --un-text-opacity: 1;
+ color: rgb(129 136 148 / var(--un-text-opacity))
+}
+
+.text-\#8c8c8c {
+ --un-text-opacity: 1;
+ color: rgb(140 140 140 / var(--un-text-opacity))
+}
+
+.text-\#9c9c9c {
+ --un-text-opacity: 1;
+ color: rgb(156 156 156 / var(--un-text-opacity))
+}
+
+.text-\#B3B8BF {
+ --un-text-opacity: 1;
+ color: rgb(179 184 191 / var(--un-text-opacity))
+}
+
+.text-\#de5d56 {
+ --un-text-opacity: 1;
+ color: rgb(222 93 86 / var(--un-text-opacity))
+}
+
+.text-\#FFE400 {
+ --un-text-opacity: 1;
+ color: rgb(255 228 0 / var(--un-text-opacity))
+}
+
+.text-black {
+ --un-text-opacity: 1;
+ color: rgb(0 0 0 / var(--un-text-opacity))
+}
+
+.text-blue {
+ --un-text-opacity: 1;
+ color: rgb(96 165 250 / var(--un-text-opacity))
+}
+
+.text-blue-500 {
+ --un-text-opacity: 1;
+ color: rgb(59 130 246 / var(--un-text-opacity))
+}
+
+.text-blue-600 {
+ --un-text-opacity: 1;
+ color: rgb(37 99 235 / var(--un-text-opacity))
+}
+
+.text-gray,
+.text-gray-400 {
+ --un-text-opacity: 1;
+ color: rgb(156 163 175 / var(--un-text-opacity))
+}
+
+.text-gray-500 {
+ --un-text-opacity: 1;
+ color: rgb(107 114 128 / var(--un-text-opacity))
+}
+
+.text-green {
+ --un-text-opacity: 1;
+ color: rgb(74 222 128 / var(--un-text-opacity))
+}
+
+.text-green-500 {
+ --un-text-opacity: 1;
+ color: rgb(34 197 94 / var(--un-text-opacity))
+}
+
+.text-orange {
+ --un-text-opacity: 1;
+ color: rgb(251 146 60 / var(--un-text-opacity))
+}
+
+.text-quote-red {
+ --un-text-opacity: 1;
+ color: rgb(233 88 43 / var(--un-text-opacity))
+}
+
+.text-red {
+ --un-text-opacity: 1;
+ color: rgb(248 113 113 / var(--un-text-opacity))
+}
+
+.text-white {
+ --un-text-opacity: 1;
+ color: rgb(255 255 255 / var(--un-text-opacity))
+}
+
+.font-400 {
+ font-weight: 400
+}
+
+.font-500,
+.font-medium {
+ font-weight: 500
+}
+
+.font-700,
+.font-bold {
+ font-weight: 700
+}
+
+.font-semibold {
+ font-weight: 600
+}
+
+.leading-15 {
+ line-height: .9375rem
+}
+
+.leading-16 {
+ line-height: 1rem
+}
+
+.leading-20 {
+ line-height: 1.25rem
+}
+
+.leading-21 {
+ line-height: 1.3125rem
+}
+
+.leading-22 {
+ line-height: 1.375rem
+}
+
+.leading-24 {
+ line-height: 1.5rem
+}
+
+.leading-25 {
+ line-height: 1.5625rem
+}
+
+.leading-26 {
+ line-height: 1.625rem
+}
+
+.leading-28 {
+ line-height: 1.75rem
+}
+
+.leading-32 {
+ line-height: 2rem
+}
+
+.leading-34 {
+ line-height: 2.125rem
+}
+
+.leading-40 {
+ line-height: 2.5rem
+}
+
+.leading-42 {
+ line-height: 2.625rem
+}
+
+.leading-45 {
+ line-height: 2.8125rem
+}
+
+.leading-50 {
+ line-height: 3.125rem
+}
+
+.leading-55 {
+ line-height: 3.4375rem
+}
+
+.leading-77 {
+ line-height: 4.8125rem
+}
+
+.underline {
+ text-decoration-line: underline
+}
+
+.backdrop-filter {
+ -webkit-backdrop-filter: var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
+ backdrop-filter: var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia)
+}
+
+.ease {
+ transition-timing-function: cubic-bezier(.4, 0, .2, 1)
+}
+
+:root,
+uni-page-body {
+ background-color: #fff;
+ color: #242629;
+ font-size: .875rem;
+ font-weight: 400;
+ font-family: PingFangSC, PingFang SC, sans-serif
+}
+
+body {
+ background-color: #fff
+}
+
+:root ::-webkit-scrollbar,
+uni-page-body ::-webkit-scrollbar {
+ display: none
+}
+
+.text_ellipsis {
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis
+}
+
+.status_bar {
+ padding-top: var(--status-bar-height)
+}
+
+.input-placeholder {
+ color: #b3b8bf;
+ font-size: .875rem;
+ font-weight: 400
+}
+
+.bg-quote-red {
+ background-color: #e9582b
+}
+
+.bg-quote-green {
+ background-color: #33cd99
+}
\ No newline at end of file
diff --git a/src/assets/css/index.scss b/src/assets/css/index.scss
index e405769..30ff90c 100644
--- a/src/assets/css/index.scss
+++ b/src/assets/css/index.scss
@@ -2,7 +2,9 @@
@tailwind components;
@tailwind utilities;
-@import './variable.scss';
+// @import './variable.scss';
+@import './variable-light.scss';
+// @import './index-b3fb30cd.css';
/* overwite default */
:root {
@@ -23,9 +25,9 @@
--van-sidebar-selected-border-height: 44px !important;
--van-sidebar-selected-border-width: 2px !important;
--van-nav-bar-background: $mainBgColor !important;
- --van-nav-bar-title-text-color: #fff !important;
- --van-uploader-upload-background: #232C46 !important;
- --van-index-anchor-text-color: #fff !important;
+ --van-nav-bar-title-text-color: #333 !important;
+ --van-uploader-upload-background: #fff !important;
+ --van-index-anchor-text-color: #333 !important;
}
body {
@@ -82,4 +84,5 @@
width: 90px !important;
height: 90px !important;
opacity: 0.6;
-}
\ No newline at end of file
+}
+
diff --git a/src/assets/css/variable-light.scss b/src/assets/css/variable-light.scss
new file mode 100644
index 0000000..408c947
--- /dev/null
+++ b/src/assets/css/variable-light.scss
@@ -0,0 +1,38 @@
+// 白天主题色变量
+$mainBgColor: #fff;
+$mainTextColor: #333;
+$mainbgWhiteColor: #fff;
+
+$main_background: #fff; // 主背景色改为浅灰色
+$main2_background: #e8ebf0; // 次级背景色
+$text_color: #333; // 主要文字颜色改为深色
+$text_color1: #666; // 次要文字颜色
+$text_color2: #fff; // 白色文字保持不变
+$text_color3: #555; // 其他文字颜色
+$text_color4: #333;
+$text_color5: #999;
+$text_color6: #777;
+
+$tab_background: #fff; // tab背景改为白色
+$active_line: #1194F7; // 激活状态颜色保持不变
+$footer_background: #fff; // 底部改为白色
+$btn_main: #1194F7; // 主按钮颜色保持不变
+$color_main: #1194F7;
+$btn_background: #f0f2f5; // 按钮背景改为浅灰色
+$input_background: #fff; // 输入框背景改为白色
+$cont_background: #fff; // 内容区域背景
+$title_color: #444; // 标题颜色
+$line_color: #e0e0e0; // 线条颜色改为浅灰色
+$bg_dark: #f0f2f5;
+$border_color: #e0e0e0;
+$divi_line: #f0f0f0; // 分割线颜色
+
+// ... 其他变量保持类似的浅色调整 ...
+
+// 类名映射保持不变，会自动使用新的颜色变量
+.mainBackground{
+ background: $main_background;
+}
+.textColor{color:$text_color}
+.textColor1{color:$text_color1}
+// ... 其他类保持不变 ...
diff --git a/src/assets/css/variable.scss b/src/assets/css/variable.scss
index cfc66e1..34ec9e0 100644
--- a/src/assets/css/variable.scss
+++ b/src/assets/css/variable.scss
@@ -2,16 +2,16 @@
$mainTextColor: #fff;
$mainbgWhiteColor: #fff;
-$main_background:#131a2e; //主题色
+$main_background:#fff; //主题色
$main2_background:#1F233D; //主题浅色背景
-$text_color:#fff; //文字颜色
+$text_color:#333; //文字颜色
$text_color1:#868D9A; //文字浅色
-$text_color2:#fff; // 白色文字
+$text_color2:#333; // 白色文字
$text_color3:#CFD5EC; //
$text_color4:#333; //浅色标题背景文字颜色
$text_color5:#878A96; //
$text_color6:#B7BDD1; // 文字更浅色
-$tab_background:#27293B; //tab切换背景颜色
+$tab_background:#fff; //tab切换背景颜色
$active_line:#1194F7; //tab选中样式颜色
$footer_background:#252738; // 底部颜色
$btn_main: #1194F7; //主题色按钮
@@ -35,7 +35,7 @@
$c2c_background1: #27293B;
$c2c_tab_background:#27293B;
$c2c_tip_background: #131a2e;
-$selectSymbol_background: #131a2e; //自选与选择币种背景颜色
+$selectSymbol_background: #fff; //自选与选择币种背景颜色
$US_tab_background: #1D2439;
$US_tabActice_background: #112542;
$lable_color: #B6BDD4;
diff --git a/src/assets/d.jpg b/src/assets/d.jpg
new file mode 100644
index 0000000..7cac81e
--- /dev/null
+++ b/src/assets/d.jpg
Binary files differ
diff --git a/src/assets/image/service.png b/src/assets/image/service.png
new file mode 100644
index 0000000..49e7ed8
--- /dev/null
+++ b/src/assets/image/service.png
Binary files differ
diff --git a/src/assets/imgs/bg-account.png b/src/assets/imgs/bg-account.png
new file mode 100644
index 0000000..8192f64
--- /dev/null
+++ b/src/assets/imgs/bg-account.png
Binary files differ
diff --git a/src/assets/imgs/icon-income.png b/src/assets/imgs/icon-income.png
new file mode 100644
index 0000000..a03d9f4
--- /dev/null
+++ b/src/assets/imgs/icon-income.png
Binary files differ
diff --git a/src/assets/imgs/icon-mining.png b/src/assets/imgs/icon-mining.png
new file mode 100644
index 0000000..71c83c5
--- /dev/null
+++ b/src/assets/imgs/icon-mining.png
Binary files differ
diff --git a/src/assets/imgs/icon-order.png b/src/assets/imgs/icon-order.png
new file mode 100644
index 0000000..d4f85c2
--- /dev/null
+++ b/src/assets/imgs/icon-order.png
Binary files differ
diff --git a/src/assets/imgs/mining-bg.png b/src/assets/imgs/mining-bg.png
new file mode 100644
index 0000000..eeb5670
--- /dev/null
+++ b/src/assets/imgs/mining-bg.png
Binary files differ
diff --git a/src/assets/imgs/mining-card.png b/src/assets/imgs/mining-card.png
new file mode 100644
index 0000000..1b9eb2c
--- /dev/null
+++ b/src/assets/imgs/mining-card.png
Binary files differ
diff --git a/src/assets/imgs/position-card.png b/src/assets/imgs/position-card.png
new file mode 100644
index 0000000..fb251b4
--- /dev/null
+++ b/src/assets/imgs/position-card.png
Binary files differ
diff --git a/src/assets/init.scss b/src/assets/init.scss
index 3e3f006..b2a772e 100644
--- a/src/assets/init.scss
+++ b/src/assets/init.scss
@@ -58,7 +58,7 @@
$red: #F43368;
$green: #06CDA5;
$purple: #9A4DFD;
- $night: #131a2e;
+ $night: #f5f7fa;
// overwrite vant
.mining-pledge {
diff --git a/src/assets/theme/dark/index.scss b/src/assets/theme/dark/index.scss
index b7e6b74..ceb7636 100644
--- a/src/assets/theme/dark/index.scss
+++ b/src/assets/theme/dark/index.scss
@@ -1,9 +1,9 @@
-$main_background:#131a2e; //主题色
-$text_color:#fff; //文字颜色
+$main_background:#fff; //主题色
+$text_color:#333; //文字颜色
$text_color1:#868D9A; //文字浅色
$text_color2:#B7BDD1; // 资金页面所用对应
$text_color3:#CFD5EC; //
-$tab_background:#27293B; //tab切换背景颜色
+$tab_background:#fff; //tab切换背景颜色
$active_line:#1194F7; //tab选中样式颜色
$footer_background:#252738; // 底部颜色
$btn_main: #1194F7; //主题色按钮
diff --git a/src/components/Transform/list-quotation/index.vue b/src/components/Transform/list-quotation/index.vue
index 643a960..f5da2b7 100644
--- a/src/components/Transform/list-quotation/index.vue
+++ b/src/components/Transform/list-quotation/index.vue
@@ -1,27 +1,42 @@
<template>
<div class="list-quatation">
- <ex-tabs @tabs="onTabs"></ex-tabs>
+ <!-- <ex-tabs @tabs="onTabs"></ex-tabs> -->
<van-list>
- <van-cell>
+ <!-- <van-cell>
<div class="flex items-center w-full text-grey font-26">
<p class="left text-left">
<span>{{ $t('交易对') }}
- <!-- <img src="./icon-sort.png" alt="icon" class="w-13 h-22"/>-->
</span>
</p>
<p class="mid text-right">
{{ $t('最新价') }}
- <!-- <img src="./icon-sort.png" alt="icon" class="w-13 h-22 ml-5"/>-->
</p>
<p class="right text-right">
{{ active == 3 ? $t('成交额') : $t('24h涨跌幅') }}
- <!-- <img src="./icon-sort.png" alt="icon" class="w-13 h-22 ml-5"/>-->
</p>
</div>
- </van-cell>
+ </van-cell> -->
+
+ <div class="flex items-end justify-between">
+ <div class="block text-22 font-medium">行情</div>
+ <div class="relative text-13">
+ <!-- <div class="flex px-10 justify-between rounded-full bg-black text-white min-w-100 box-border">
+ <div class="block">貨幣</div>
+ <div class="i-material-symbols:arrow-drop-down-rounded"></div>
+ </div> -->
+ <!-- <div class="px-9 py-10 bg-black text-white flex flex-col absolute min-w-100 box-border top-25 rounded-11 leading-28" style="display: none;">
+ <div>貨幣</div>
+ <div>數字貨幣</div>
+ <div>期貨</div>
+ <div>收藏</div>
+ </div> -->
+ </div>
+ </div>
+
+
<transition-group :name="type" tag="div">
<div v-if="active == 0" :key="active">
- <van-cell v-for="item in listData" :key="item.id">
+ <van-cell v-for="item in listData" :key="item.id" style="background-color: #f0f0f0;margin-bottom: 10px;">
<ul class="flex justify-between w-full items-center" @click="onItemClick(item)">
<li class="flex items-center left">
<img
@@ -155,10 +170,14 @@
});
} else {
setStorage('symbol', item.symbol)
- this.$router.push({
- path: `/cryptos/perpetualContract/${item.symbol}`,
+ this.$router.push({
+ path: `/foreign/deliveryContract/${item.symbol}`,
query: { type: 'cryptos' }
});
+ // this.$router.push({
+ // path: `/cryptos/perpetualContract/${item.symbol}`,
+ // query: { type: 'cryptos' }
+ // });
}
},
handleImage(url) {
@@ -216,6 +235,7 @@
</script>
<style lang="scss" scoped>
@import "@/assets/init.scss";
+@import '@/assets/css/deepseek_css_20250625_30ff932.css';
#cryptos {
@@ -271,4 +291,12 @@
}
}
+
+.textColor {
+ color: #242629;
+}
+
+.text-grey{
+ // color: #8c8c8c;
+}
</style>
diff --git a/src/components/foreign/foreign-contract-header/index.vue b/src/components/foreign/foreign-contract-header/index.vue
index 980d273..8e1f008 100644
--- a/src/components/foreign/foreign-contract-header/index.vue
+++ b/src/components/foreign/foreign-contract-header/index.vue
@@ -4,10 +4,10 @@
<div class="contract-header">
<div class="pl-15 pr-15">
<div class="flex justify-start pt-10 pb-5 before">
- <img src="@/assets/image/icon_back_1.png" class="icon_back_1" alt="" @click="jump()">
+ <img src="@/assets/image/icon_back.png" class="icon_back_1" alt="" @click="jump()">
<div class="flex items-center font-14">
- <img src="@/assets/theme/dark/image/black-convert.png" alt="convert-img" class="w-18 h-18"
- @click="onSidebar">
+ <van-icon name="sort" @click="onSidebar" />
+ <!-- <img src="@/assets/theme/dark/image/black-convert.png" alt="convert-img" class="w-18 h-18" @click="onSidebar"> -->
<div class="flex pl-10 textColor font-700" @click="onSidebar">
<div class="font-35">{{ symbol.toUpperCase() || '--' }}</div>
<div class="ml-15">{{ $t('delivery') }}</div>
@@ -117,7 +117,8 @@
fetchList()
}
const fetchList = () => { // 获取行情
- _getQuotes(quotesStore.coins).then(data => {
+ // _getQuotes(quotesStore.coins).then(data => {
+ _getQuotes().then(data => {
list.value = data
if (timeout.value) {
clearTimeout(timeout.value)
diff --git a/src/components/foreign/foreign-perpetual-open/index.vue b/src/components/foreign/foreign-perpetual-open/index.vue
index c887c1f..e24bc38 100644
--- a/src/components/foreign/foreign-perpetual-open/index.vue
+++ b/src/components/foreign/foreign-perpetual-open/index.vue
@@ -19,24 +19,24 @@
:class="currentType == 'short' ? 'bg-red' : ''" @click="changeTab('short')">{{ $t('sell') }}</div>
</div>
<div class="flex justify-between h-30 items-center mt-10">
- <span class="textColor3 font-14">{{ $t('time') }}</span>
- <span class="textColor3">{{ timeStr }}</span>
+ <span class="textColor2 font-14">{{ $t('time') }}</span>
+ <span class="textColor2">{{ timeStr }}</span>
</div>
<div class="flex justify-between h-30 items-center">
- <span class="textColor3 font-14">{{ $t('tradingAssets') }}</span>
- <span class="textColor3 font-14" style="color:#d6cc62;">USD</span>
+ <span class="textColor2 font-14">{{ $t('tradingAssets') }}</span>
+ <span class="textColor2 font-14" style="color:#d6cc62;">USD</span>
</div>
<div class="flex justify-between h-30 items-center">
- <span class="textColor3 font-14">{{ $t('可用数量') }}</span>
- <span class="textColor3">{{ nan(initFutrue.amount) }}</span>
+ <span class="textColor2 font-14">{{ $t('可用数量') }}</span>
+ <span class="textColor2">{{ nan(initFutrue.amount) }}</span>
</div>
<div class="flex justify-between h-30 items-center mb-8">
- <span class="textColor3 font-14">{{ $t('transactionPeriod') }}</span>
+ <span class="textColor2 font-14">{{ $t('transactionPeriod') }}</span>
</div>
<div v-if="!initFutrue.para" class="h-40"></div>
<contract-futrue v-else :initFutrue="initFutrue" @paraId="onParaId" :key="initFutrue.para" />
<div class="flex justify-between h-30 items-center">
- <span class="textColor3 font-14">{{ $t('number') }}</span>
+ <span class="textColor2 font-14">{{ $t('number') }}</span>
</div>
</div>
<div class="flex items-center border-main h-38 lh-38 rounded-lg">
@@ -54,11 +54,11 @@
@click="selectMount(1, 3)">100%</span>
</div>
<div class="flex justify-between h-30 items-center mt-10">
- <span class="textColor3 font-24">{{ $t('minimumBuy') }}</span>
- <span class="textColor3">{{ initFutrue.para && initFutrue.para[0] ? initFutrue.para[paraIndex].buy_min
+ <span class="textColor2 font-24">{{ $t('minimumBuy') }}</span>
+ <span class="textColor2">{{ initFutrue.para && initFutrue.para[0] ? initFutrue.para[paraIndex].buy_min
: '' }}</span>
</div>
- <div class="flex font-24 textColor3 justify-between mt-10">
+ <div class="flex font-24 textColor2 justify-between mt-10">
<div>{{ $t('free') }}</div>
<div class="textColor">{{ ((form.amount * (initFutrue && initFutrue.para && initFutrue.para[0] ?
initFutrue.para[paraIndex].unit_fee
@@ -555,4 +555,6 @@
width: 92px;
}
}
+
+
</style>
diff --git a/src/components/fx-footer/index.vue b/src/components/fx-footer/index.vue
index 7ee7c3b..624c19e 100644
--- a/src/components/fx-footer/index.vue
+++ b/src/components/fx-footer/index.vue
@@ -1,10 +1,11 @@
<template>
<div class="relative z-30 footer">
+ <!-- 底部 bar -->
<van-tabbar route v-model="active" active-color="#1194F7" @change="changeIndex" fixed safe-area-inset-bottom>
- <van-tabbar-item name="optional" to="/optional">
- <span :class="[active === 'optional' ? 'active' : '']">{{ $t('Optional') }}</span>
+ <van-tabbar-item name="news" to="/news">
+ <span :class="[active === 'news' ? 'active' : '']">{{ $t('首页') }}</span>
<template #icon="props">
- <img :src="props.active ? icon.optional.active : icon.optional.inactive" />
+ <img :src="props.active ? icon.news.active : icon.news.inactive" />
</template>
</van-tabbar-item>
<van-tabbar-item name="quotes" to="/quotes">
@@ -13,7 +14,8 @@
<img :src="props.active ? icon.quotes.active : icon.quotes.inactive" />
</template>
</van-tabbar-item>
- <van-tabbar-item name="trade" to="/trade">
+ <!-- /foreign -->
+ <van-tabbar-item name="trade" to="/foreign/deliveryContract/USDSGD">
<span :class="[active === 'trade' ? 'active' : '']">{{ $t('trade') }}</span>
<template #icon="props">
<img :src="props.active ? icon.trade.active : icon.trade.inactive" />
@@ -25,12 +27,13 @@
<img :src="props.active ? icon.funds.active : icon.funds.inactive" />
</template>
</van-tabbar-item> -->
- <van-tabbar-item name="news" to="/news">
- <span :class="[active === 'news' ? 'active' : '']">{{ $t('news') }}</span>
+ <van-tabbar-item name="optional" to="/optional">
+ <span :class="[active === 'optional' ? 'active' : '']">{{ $t('资产') }}</span>
<template #icon="props">
- <img :src="props.active ? icon.news.active : icon.news.inactive" />
+ <img :src="props.active ? icon.optional.active : icon.optional.inactive" />
</template>
</van-tabbar-item>
+
<!-- <van-tabbar-item name="trade" to="/exchange">
<span>{{ $t('trade') }}</span>
<template #icon="props">
@@ -64,8 +67,10 @@
active.value = 'news'
} else if (route.path == "/my/index") {
active.value = 'mine'
-} else if (route.path == "/optional/index") {
+} else if (route.path == "/foreign/index") {
active.value = 'optional'
+}else if (route.path == "/foreign/deliveryContract/USDSGD") {
+ active.value = 'trade'
}else if (route.path == "/cryptos/funds") {
active.value = 'funds'
}
@@ -82,6 +87,8 @@
active.value = 'mine'
} else if (route.path == "/optional/index") {
active.value = 'optional'
+ }else if (route.path == "/foreign/deliveryContract/USDSGD") {
+ active.value = 'trade'
}
})
// 底部列表
@@ -122,15 +129,15 @@
}
:deep(.van-tabbar-item--active) {
- background-color: #12192F;
- color: $color_main !important;
+ // background-color: #12192F;
+ // color: $color_main !important;
}
.van-tabbar--fixed {
z-index: 10;
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
- background-color: #12192F;
+ background-color: #fff;
}
.van-tabbar--fixed::after {
diff --git a/src/config/index.js b/src/config/index.js
index b19d956..cb1ded3 100644
--- a/src/config/index.js
+++ b/src/config/index.js
@@ -34,11 +34,14 @@
export const defaultSeconds = 1 * 24 * 60 * 60 * 1000
// const ENV_DEV = 'zhapi.coinbtcs.com' // dev
-const ENV_DEV = 'openapi.yanshiz.com' // dev
+// const ENV_DEV = 'openapi.yanshiz.com' // dev
+const ENV_DEV = '192.168.10.18:8086' // dev
+
// const ENV_PRO = 'qheufhj.site' // app域名
// const ENV_PRO = window.location.hostname // 接口域名跟随 H5zhapi.coinbtcs.com
-const ENV_PRO = 'openapi.yanshiz.com' // 接口域名跟随 H5zhapi.coinbtcs.com
+// const ENV_PRO = 'openapi.yanshiz.com' // 接口域名跟随 H5zhapi.coinbtcs.com
+const ENV_PRO = '192.168.10.18:8086' // 接口域名跟随 H5zhapi.coinbtcs.com
let base_url = ''
let ws_url = ''
diff --git a/src/router/index.js b/src/router/index.js
index cd38f2e..84d3d15 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -62,9 +62,10 @@
requireAuth: true
},
redirect: '/trade/index',
- component: () => import('@/views/Layout.vue'),
+ component: () => import('@/views/foreign/CoinChart.vue'),
children: [
- { path: 'index', meta: { tarbar: true, keepAlive: true }, name: 'tradeIndex', component: () => import(/* webpackChunkName: "trade" */ /* webpackPrefetch: true */'@/views/trade/index.vue') },
+ { path: 'index', meta: { tarbar: true, keepAlive: true }, name: 'tradeIndex', component: () => import(/* webpackChunkName: "trade" */ /* webpackPrefetch: true */'@/views/foreign/CoinChart.vue') },
+ // { path: 'index', meta: { tarbar: true, keepAlive: true }, name: 'tradeIndex', component: () => import(/* webpackChunkName: "trade" */ /* webpackPrefetch: true */'@/views/trade/index.vue') },
// { path: 'detail', meta: { tarbar: true }, component: () => import(/* webpackChunkName: "quotes" */ /* webpackPrefetch: true */'@/views/quotes/Detail.vue') },
// { path: 'hotModules', meta: { tarbar: true }, component: () => import(/* webpackChunkName: "quotes" */ /* webpackPrefetch: true */'@/views/quotes/HotModules.vue') },
// { path: 'openTrade', meta: { tarbar: false }, component: () => import(/* webpackChunkName: "quotes" */ /* webpackPrefetch: true */'@/views/quotes/OpenTrade.vue') },
@@ -87,7 +88,7 @@
path: 'deliveryContract/:symbol',
name: 'deliveryContract',
component: () => import(/* webpackChunkName: "deliveryContract" */ /* webpackPrefetch: true */'@/views/foreign/foreignPerpetualContract/deliveryContract.vue'),
- meta: { keepAlive: true, tarbar: false, }
+ meta: { keepAlive: true, tarbar: true, }
},
{
//交割合约历史
@@ -106,7 +107,8 @@
},
component: () => import('@/views/Layout.vue'),
children: [
- { path: 'index', meta: { tarbar: false, keepAlive: true }, component: () => import('@/views/position/index.vue') },
+ { path: 'index', meta: { tarbar: false, keepAlive: true }, component: () => import('@/views/position/newindex.vue') },
+ // { path: 'index', meta: { tarbar: false, keepAlive: true }, component: () => import('@/views/position/index.vue') },
]
},
{
@@ -126,6 +128,7 @@
component: () => import('@/views/Layout.vue'),
children: [
{ path: 'index', meta: { tarbar: true, keepAlive: true }, component: () => import(/* webpackChunkName: "chart" */ /* webpackPrefetch: true */'@/views/news/index.vue') },
+ { path: 'explanation', meta: { tarbar: true, keepAlive: true }, component: () => import(/* webpackChunkName: "chart" */ /* webpackPrefetch: true */'@/views/news/explanation.vue') },
]
},
{
@@ -189,6 +192,7 @@
{ path: 'exchangeRate', meta: { tarbar: false, keepAlive: true }, component: () => import('@/views/cryptos/Exchange/exchangeRate.vue') },
{ path: 'accountChange', meta: { tarbar: false, keepAlive: true }, component: () => import('@/views/cryptos/AccountChange/index.vue') },
{ path: 'funds', meta: { tarbar: false, keepAlive: true }, component: () => import('@/views/cryptos/Funds/index.vue') },
+ { path: '/mining', meta: { tarbar: false, keepAlive: true }, component: () => import('@/views/cryptos/Funds/newIndex.vue') },
{ path: 'assetsCenter', meta: { tarbar: false, keepAlive: true }, component: () => import('@/views/cryptos/AssetsCenter/index.vue') },
{ path: 'trade/:symbol', name: 'trade', meta: { tarbar: false, keepAlive: true }, component: () => import('@/views/cryptos/Trade/index.vue') },
{ path: 'trendDetails/:symbol', name: 'tradeDetail', meta: { tarbar: false, keepAlive: true }, component: () => import('@/views/cryptos/TrendDetails/index.vue') },
@@ -558,7 +562,7 @@
component: () => import('@/views/Layout.vue'),
meta: { tarbar: true },
children: [
- { path: 'index', meta: { tarbar: true, }, component: () => import(/* webpackChunkName: "my" */ /* webpackPrefetch: true */'@/views/my/index.vue') }
+ { path: 'index', meta: { tarbar: true, }, component: () => import(/* webpackChunkName: "my" */ /* webpackPrefetch: true */'@/views/my/newindex.vue') }
]
},
{
diff --git a/src/views/cryptos/AccountChange/index.vue b/src/views/cryptos/AccountChange/index.vue
index 603d0f7..d0cc816 100644
--- a/src/views/cryptos/AccountChange/index.vue
+++ b/src/views/cryptos/AccountChange/index.vue
@@ -3,12 +3,25 @@
<div id="cryptos">
<div class="accountChange">
<assets-head :title="$t('账变记录')" />
- <van-tabs ref="tabs" v-model:active="active" swipeable @change="onChange" sticky>
- <van-tab :title="item.title" v-for="item in selectData" :key="item.title" :name="item.type">
+ <!-- <van-tabs ref="tabs" v-model:active="active" swipeable @change="onChange" sticky> -->
+ <!-- <van-tab :title="item.title" v-for="item in selectData" :key="item.title" :name="item.type"> -->
<van-list v-model:loading="loading" :loading-text="$t('加载中...')" :finished="finished"
- :finished-text="list.length ? $t('已经全部加载完毕') : ''" @load="onLoad" :offset="130" class="px-16">
- <div class="flex justify-between items-center record-list" v-for="(item, index) in list" :key="index">
- <div class="flex items-center">
+ :finished-text="list.length ? $t('已经全部加载完毕') : ''" @load="onLoad" :offset="130" class="pt-10 px-17" style="background: #fff;">
+ <div class="p-15 bg-#f5f7f9 rounded-10 mb-10" v-for="(item, index) in list" :key="index">
+ <div class="flex justify-between">
+ <span class="text-13 text-#8c8c8c">金額</span>
+ <span class="text-11 text-green">{{item.amount }} {{ item.wallet_type.toUpperCase() }}</span>
+ </div>
+ <div class="flex justify-between py-5">
+ <span class="text-13 text-#8c8c8c">分類</span>
+ <span class="text-11">{{category[item.category]}}</span>
+ </div>
+ <div class="flex justify-between">
+ <span class="text-13 text-#8c8c8c">日期</span>
+ <span class="text-11">{{ item.createTime }}</span>
+ </div>
+ </div>
+ <!-- <div class="flex items-center">
<img v-if="item.amount > 0" src="@/assets/image/assets-center/in.png" class="w-44 h-44 mr-20" />
<img v-else src="@/assets/image/assets-center/out.png" class="w-44 h-44 mr-20" />
<div>
@@ -20,15 +33,14 @@
<div class="font-32 text-right" :class="item.amount > 0 ? 'text-green' : 'text-red'">{{
item.amount }} {{ item.wallet_type.toUpperCase() }}</div>
<div class="text-grey font-28 mt-14">{{ item.createTimeStr }}</div>
- </div>
- </div>
+ </div> -->
<div class="flex flex-col justify-center pt-50 pb-20 items-center" v-if="!list.length && !loading">
<img src="@/assets/image/assets-center/no-data.png" alt="" class="w-100 h-100 no-data-img" />
<p class="text-grey mt-10">{{ $t('暂无记录') }}</p>
</div>
</van-list>
- </van-tab>
- </van-tabs>
+ <!-- </van-tab> -->
+ <!-- </van-tabs> -->
</div>
</div>
</template>
@@ -173,111 +185,8 @@
}
</script>
<style lang="scss" scoped>
-@import "@/assets/init.scss";
-
-#cryptos {
- :deep(.van-tabs__wrap) {
- // height: 88px !important;
- }
-
- :deep(.van-tabs__nav) {
- background: $tab_background;
- }
-
- :deep(.van-tabs__line) {
- bottom: 10px;
- }
-
- .accountChange {
- width: 100%;
- box-sizing: border-box;
-
- :deep(.van-tab--active .van-tab__text) {
- color: $text_color;
- }
-
- :deep(.van-tab__text) {
- color: $text_color1;
- }
- }
+// @import "@/assets/init.scss";
+@import "@/assets/css/deepseek_css_20250625_30ff932.css";
-
- // select样式
- .select-view {
- position: relative;
- width: 320px;
- }
-
- .select-box {
- width: 100%;
- height: 70px;
- line-height: 70px;
- background-color: $light-grey;
- cursor: pointer;
- }
-
- .option-box {
- position: absolute;
- left: 0;
- right: 0;
- top: 90px;
- width: 100%;
- background-color: $grey_bg;
- text-align: center;
- box-shadow: 0px 0px 3px 3px $grey_bg;
- border-radius: 4px;
- color: $text-color;
- z-index: 10;
- }
-
- .option-box>div {
- padding: 30px 0;
- }
-
- .option-box>div:hover {
- background-color: $grey_bg;
- }
-
- // 按钮
- .search-btn {
- width: 140px;
- height: 55px;
- line-height: 55px;
- text-align: center;
- border: none;
- outline: none;
- }
-
- .record-list {
- padding: 38px 30px;
- border-bottom: 1px solid $border_color;
- }
-
- .mt12 {
- margin-top: 12px;
- }
-
- .dividing-line {
- height: 10px;
- background-color: $divi_line;
-
- }
-
- .mtb30 {
- margin: 30px 0;
- }
-
- .select-icon {
- position: relative;
- bottom: 8px;
- }
-
- .accountChange {
- :deep(.van-tab__text) {
- font-size: 30px !important;
- }
- }
-
-}
</style>
diff --git a/src/views/cryptos/DeliveryContractHistory/index.vue b/src/views/cryptos/DeliveryContractHistory/index.vue
index 377fdbb..24e527c 100644
--- a/src/views/cryptos/DeliveryContractHistory/index.vue
+++ b/src/views/cryptos/DeliveryContractHistory/index.vue
@@ -273,7 +273,7 @@
}
.van-tabs__nav {
- background: $tab_background;
+ // background: $tab_background;
}
.van-tab--active {
diff --git a/src/views/cryptos/Funds/newIndex.vue b/src/views/cryptos/Funds/newIndex.vue
new file mode 100644
index 0000000..9412bee
--- /dev/null
+++ b/src/views/cryptos/Funds/newIndex.vue
@@ -0,0 +1,123 @@
+<template>
+ <div>
+ <assets-head :title="t('资金账户')" :back-func="backFunc" ></assets-head>
+
+ <div class="px-17">
+ <div class="flex items-center justify-between">
+ <div class="text-25 font-bold">Defi質押流動性挖礦</div>
+ <img class="w-64 h-57 ml-90 flex-none" src="@/assets/imgs/icon-mining.png" draggable="false">
+ </div>
+
+ <div class="h-182 mt-20 pt-28 px-19 box-border text-white bgimg">
+ <div class="flex justify-between items-center">
+ <div class="text-11">{{ t('托管金额') }}</div>
+ <img class="w-17 h-17" src="@/assets/imgs/icon-income.png" draggable="false">
+ </div>
+ <div class="text-34 font-bold mt-5 block">{{ statiscis.amount_sum || 0 }}</div>
+
+ <div class="flex justify-between my-20 text-center text-16">
+ <div>
+ <div>{{ t('累计收益') }}</div>
+ <div class="text-20">{{ statiscis.aready_profit || 0 }}</div>
+ </div>
+ <div>
+ <div>{{ t('预计日收益') }}</div>
+ <div class="text-20">{{ statiscis.today_profit || 0 }}</div>
+ </div>
+ <div>
+ <div>{{ t('托管订单') }}</div>
+ <div class="text-20">{{ statiscis.order_sum || 0 }}</div>
+ </div>
+ </div>
+ </div>
+
+ <div class="mt-15">
+ <div class="text-16">鎖倉挖礦</div>
+
+ <div class="mt-15">
+ <div class="h-100 box-border p-15 mb-10 bgimg1">
+ <div class="flex items-center justify-between">
+ <div class="text-17 font-bold">01</div>
+ <div class="text-16 font-bold">5天</div>
+ </div>
+ <div class="flex mt-5">
+ <div>
+ <div class="text-11">效益</div>
+ <div class="text-16">0.003% - 0.004%</div>
+ </div>
+ <div class="ml-30">
+ <div class="text-11">可投金額</div>
+ <div class="text-16">1000 - 100000</div>
+ </div>
+ </div>
+ </div>
+
+ <div class="h-100 box-border p-15 mb-10 bgimg1">
+ <div class="flex items-center justify-between">
+ <div class="text-17 font-bold">02</div>
+ <div class="text-16 font-bold">17天</div>
+ </div>
+ <div class="flex mt-5">
+ <div>
+ <div class="text-11">效益</div>
+ <div class="text-16">0.004% - 0.005%</div>
+ </div>
+ <div class="ml-30">
+ <div class="text-11">可投金額</div>
+ <div class="text-16">10000 - 10000000</div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
+
+</template>
+
+<script setup>
+import { financeStatics} from '@/service/financialManagement.api.js'
+import { ref, onMounted } from 'vue';
+import { useI18n } from 'vue-i18n';
+const { t } = useI18n();
+import { useRouter } from 'vue-router';
+const router = useRouter();
+
+const statiscis = ref({});
+
+onMounted(() => {
+ getFinancialData();
+});
+
+const backFunc = () => {
+ router.back();
+}
+
+
+const getFinancialData = () => {
+ // 获取理财数据
+ financeStatics().then(res => {
+ //console.log('理财统计', res)
+ statiscis.value = res
+ })
+}
+
+</script>
+
+<style lang="scss" scoped>
+@import '@/assets/css/deepseek_css_20250625_30ff932.css';
+
+.bgimg {
+ background: url('@/assets/imgs/mining-card.png') no-repeat;
+ background-size: 100% 100%;
+ background-repeat: no-repeat;
+}
+
+.bgimg1 {
+ background: url('@/assets/imgs/mining-bg.png') no-repeat;
+ background-size: 100% 100%;
+ background-repeat: no-repeat;
+}
+
+
+</style>
\ No newline at end of file
diff --git a/src/views/cryptos/index.vue b/src/views/cryptos/index.vue
index b72cdd5..a035f16 100644
--- a/src/views/cryptos/index.vue
+++ b/src/views/cryptos/index.vue
@@ -1,11 +1,11 @@
<template>
<div class="home">
<!-- <ex-header :unread_num="`${unreadMsg_num}`"></ex-header> -->
- <ioe-swiper />
- <div class="py-10">
+ <!-- <ioe-swiper /> -->
+ <!-- <div class="py-10"> -->
- <van-notice-bar class="font-26 textColor" left-icon="" :scrollable="false" background="transparent">
+ <!-- <van-notice-bar class="font-26 textColor" left-icon="" :scrollable="false" background="transparent">
<div slot="left-icon" class=" flex items-center more-img"><img class="w-20 h-20 more-img"
src="../../assets/Horn.png" alt="">
</div>
@@ -16,10 +16,10 @@
<div class="ml-20 flex items-center " slot="right-icon" @click.stop="$router.push('/cryptos/announce')"><img
class="w-20 h-20 more-img" src="../../assets/more.png" alt="">
</div>
- </van-notice-bar>
- </div>
- <cry-nav />
- <div class="quickly">
+ </van-notice-bar> -->
+ <!-- </div> -->
+ <!-- <cry-nav /> -->
+ <!-- <div class="quickly">
<div class="quickBox chongbi" :class="THEME == 'dark' ? 'dark' : 'white'"
@click="$router.push('/cryptos/recharge/rechargeList')">
<div class="left">
@@ -40,8 +40,8 @@
</div>
<div class="right"><img src="@/assets/theme/dark/image/goto.png" alt=""></div>
</div>
- </div>
- <ex-hot :listData="hList"></ex-hot>
+ </div> -->
+ <!-- <ex-hot :listData="hList"></ex-hot> -->
<list-quatation :listData="qList" />
<van-popup v-model:show="item.showPopUp" style="border-radius:10px;" :close-on-click-overlay="false"
v-for="item in popupNewsList" :key="item.id">
diff --git a/src/views/foreign/CoinChart.vue b/src/views/foreign/CoinChart.vue
index 82b986d..2169740 100644
--- a/src/views/foreign/CoinChart.vue
+++ b/src/views/foreign/CoinChart.vue
@@ -763,7 +763,7 @@
z-index: 10;
left: 0;
right: 0;
- bottom: 0px;
+ // bottom: 0px;
background: $black;
height: 70px;
width: 100%;
@@ -816,5 +816,5 @@
.collected-img {
width: 30px !important;
height: 20px !important;
-}
+}
</style>
\ No newline at end of file
diff --git a/src/views/my/newindex.vue b/src/views/my/newindex.vue
new file mode 100644
index 0000000..3f3dbe9
--- /dev/null
+++ b/src/views/my/newindex.vue
@@ -0,0 +1,330 @@
+<template>
+ <div class="pb-30">
+ <!-- 顶部用户信息卡片 -->
+ <div class="mt-20 mx-17 pt-24 px-14 flex h-120 box-border bgimg">
+ <div class="w-65 h-65 rounded-full"></div>
+ <div class="text-white flex-1 ml-9">
+ <div class="text-19 font-bold">{{userStore.userInfo.username}}</div>
+ <div class="flex">
+ <div class="text-10">ID: {{userStore.userInfo.usercode}}</div>
+ </div>
+ <div class="text-10 block">信用分: 100</div>
+ </div>
+ </div>
+
+ <!-- 账户详情部分 -->
+ <div class="mt-20 px-17">
+ <div class="text-22 font-medium">帳戶詳情</div>
+ <div class="mt-15 p-15 rounded-15 bg-#f5f7f9">
+ <div
+ v-for="(item, index) in accountItems"
+ :key="index"
+ class="flex items-center justify-between"
+ :class="{'mt-15': index > 0}"
+ >
+ <div class="flex items-center" @click="onRoute(item.path)">
+ <img :src="`/static/img/${item.icon}`" class="w-20 h-20">
+ <div class="ml-10">{{ item.title }}</div>
+ </div>
+ <div v-if="item.status" class="text-gray-400 text-12 py-5">
+ {{ item.status }}
+ </div>
+ <div v-else class="i-material-symbols:arrow-right-rounded text-20 text-gray-400">
+ <!---->
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <!-- 帮助和支持部分 -->
+ <div class="mt-20 px-17">
+ <div class="text-22 font-medium">幫助和支持</div>
+ <div class="mt-15 p-15 rounded-15 bg-#f5f7f9">
+ <div
+ v-for="(item, index) in helpItems"
+ :key="index"
+ class="flex items-center justify-between"
+ :class="{'mt-15': index > 0}"
+ >
+ <div v-if="item.button" class="flex items-center" @click="loginOut">
+ <img :src="`/static/img/${item.icon}`" class="w-20 h-20">
+ <div class="ml-10">{{ item.title }}</div>
+ </div>
+ <div v-else class="flex items-center" @click="onRoute(item.path)">
+ <img :src="`/static/img/${item.icon}`" class="w-20 h-20">
+ <div class="ml-10">{{ item.title }}</div>
+ </div>
+ <div class="i-material-symbols:arrow-right-rounded text-20 text-gray-400">
+ <!---->
+ </div>
+
+
+ </div>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script setup>
+import { reactive, onMounted, ref, computed } from 'vue';
+import { useRouter } from 'vue-router';
+import { _getIdentify, _getKycHighLevel, _logOut } from "@/service/user.api.js";
+import { useUserStore } from '@/store/user';
+import { useI18n } from "vue-i18n";
+import useClipboard from "vue-clipboard3";
+import { showToast } from "vant";
+import addBankIcon from '@/assets/image/userCenter/addBank.png'
+import kycHighStatusIcon from '@/assets/image/userCenter/kycHighStatus.png'
+import store from '@/store/store'
+const { t } = useI18n()
+const { toClipboard } = useClipboard();
+
+const router = useRouter()
+const userStore = useUserStore()
+const status = ref(null)
+const kycHighStatus = ref(null)
+
+// 账户详情选项数据
+const accountItems = ref([
+ // { icon: 'icon-option.png', title: '貨幣訂單' , path: '/position/index'},
+ { icon: 'icon-option.png', title: '現貨訂單' , path: '/position/index'},
+ { icon: 'icon-option.png', title: '帳單' , path:'/cryptos/accountChange'},
+ { icon: 'icon-wallet.png', title: '錢包', path: '/payMentMethod/list'},
+ { icon: 'icon-real.png', title: '實名認證', status: '未認證' , path: '/certificationCenter'},
+ { icon: 'icon-small-language.png', title: '語言', status: '中文繁體', path: '/language' },
+ { icon: 'icon-small-password.png', title: '修改密碼', path: '/changePassword'},
+ { icon: 'icon-small-password.png', title: '修改提現密碼', path: '/changeFundsPassword' }
+]);
+
+// 帮助和支持选项数据
+const helpItems = ref([
+ // { icon: 'icon-market.png', title: '市場模式' },
+ { icon: 'icon-service.png', title: '線上客服', path: '/customerService' },
+ // { icon: 'icon-service.png', title: '專屬客服' },
+ { icon: 'icon-about.png', title: '關於我們', path: '/aboutUs' },
+ // { icon: 'icon-logout.png', title: '下載 APP' },
+ { icon: 'icon-logout.png', title: '註銷', button: true }
+]);
+
+const state = reactive({
+ cellList: [
+ {
+ title: t('safe'), list: [
+ { icon: 'shield-o', title: t('safe'), path: '/safety' },
+ { icon: 'setting-o', title: t('changePassword'), path: '/changePassword' },
+ { icon: addBankIcon, title: t('AddPaymentMethod'), path: '/payMentMethod/list' }
+ ]
+ },
+ {
+ title: t('universal'), list: [
+ { icon: 'font-o', title: t('language'), path: '/language' },
+ { icon: 'service-o', title: t('onLineService'), path: '/customerService' },
+ { icon: 'idcard', title: t('authVerify'), path: '/certificationCenter', show: true },
+ { icon: 'todo-list-o', title: t('账变记录'), path: '/cryptos/accountChange' },
+ { icon: 'gold-coin-o', title: t('计价方式'), path: '/cryptos/exchangeRate' },
+ ]
+ }
+ ]
+})
+const onRoute = (path) => {
+ console.log(path)
+ router.push(path)
+}
+onMounted(() => {
+ if (userStore.userInfo && userStore.userInfo.token) {
+ getIdentify()
+ getKycHighLevel()
+ }
+})
+const cellList = computed(() => {
+ if (userStore.userInfo && userStore.userInfo.token) {
+ return [
+ // {
+ // title: t('safe'), list: [
+ // // { icon: 'shield-o', title: t('safe'), path: '/safety' },
+ // // { icon: 'setting-o', title: t('changePassword'), path: '/changePassword' },
+ // { icon: addBankIcon, title: t('AddPaymentMethod'), path: '/payMentMethod/list' }
+ // ]
+ // },
+ {
+ title: t('universal'), list: [
+ { icon: new URL('../../assets/image/assets-center/language.png', import.meta.url), title: t('language'), path: '/language' },
+ { icon: new URL('../../assets/image/assets-center/onLineService.png', import.meta.url), title: t('onLineService'), path: '/customerService' },
+ { icon: new URL('../../assets/image/assets-center/authVerify.png', import.meta.url), title: t('authVerify'), path: '/certificationCenter', show: true },
+ { icon: new URL('../../assets/image/assets-center/AdvancedCertification.png', import.meta.url), title: t('高级认证'), path: '/advancedCtf', show: true },
+ // { icon: 'todo-list-o', title: t('账变记录'), path: '/cryptos/accountChange' },
+ { icon: new URL('../../assets/image/assets-center/valuation.png', import.meta.url), title: t('计价方式'), path: '/cryptos/exchangeRate' },
+ { icon: new URL('../../assets/image/assets-center/AddPaymentMethod.png', import.meta.url), title: t('AddPaymentMethod'), path: '/payMentMethod/list' }
+ ]
+ },
+ // {
+ // title: t('用户'), list: [
+ // { icon: 'link-o', title: t('邀请推广'), path: '/promote' },
+ // ]
+ // },
+ {
+ title: t('更多'), list: [
+ { icon: new URL('../../assets/image/assets-center/help.png', import.meta.url), title: t('帮助中心'), path: '/helpCenter' },
+ { icon: new URL('../../assets/image/assets-center/aboutUs.png', import.meta.url), title: t('关于我们'), path: '/aboutUs' }
+ ]
+ }
+ ]
+ } else {
+ return [
+ {
+ title: t('universal'), list: [
+ { icon: new URL('../../assets/image/assets-center/help.png', import.meta.url), title: t('language'), path: '/language' },
+ // { icon: 'gold-coin-o', title: t('计价方式'), path: '/cryptos/exchangeRate' },
+ { icon: new URL('../../assets/image/assets-center/aboutUs.png', import.meta.url), title: t('onLineService'), path: '/customerService' },
+
+ ]
+ },
+ // {
+ // title: t('更多'), list: [
+ // { icon: 'question-o', title: t('帮助中心'), path: '/helpCenter' },
+ // { icon: 'user-o', title: t('关于我们'), path: '/aboutUs' }
+ // ]
+ // }
+ ]
+ }
+
+})
+const loginOut = () => {
+ _logOut({
+ token: userStore.userInfo.token
+ }).then(res => {
+ userStore.userInfo = {}
+ store.state.user.userInfo = {}
+ })
+}
+const getIdentify = () => {
+ _getIdentify().then(data => {
+ status.value = data.status
+ })
+}
+const getKycHighLevel = () => {
+ _getKycHighLevel().then((data) => {
+ kycHighStatus.value = data.status
+ })
+}
+const copy = async () => {
+ try {
+ await toClipboard(userStore.userInfo && userStore.userInfo.usercode);
+ showToast(t('copySuccess'));
+ } catch (e) {
+ console.error(e);
+ }
+}
+</script>
+
+<style lang="scss" scoped>
+// @import '@/assets/css/deepseek_css_20250625_30ff932.css';
+@import '@/assets/css/deepseek_css_20250625_30ff932.css';
+
+.bgimg {
+ background: url('@/assets/imgs/bg-account.png') 0% 0% / cover;
+}
+:deep(.van-cell-group__title) {
+ background: $main2_background !important;
+ padding: 12px 16px;
+}
+
+:deep(.van-cell-group) {
+ .van-icon {
+ display: flex;
+ align-items: center;
+ }
+}
+
+:deep(.van-cell) {
+ background: $mainBgColor;
+ border-bottom: 1px solid $border_color;
+
+ &:hover {
+ background: $mainBgColor;
+ }
+}
+
+:deep(.van-cell-group__title) {
+ background: $mainBgColor;
+}
+
+:deep(.van-nav-bar__content) {
+ background: $mainBgColor;
+}
+
+:deep(.van-icon) {
+ color: $text_color;
+}
+
+:deep(.van-cell__title) {
+ color: $text_color;
+}
+
+:deep(.van-cell:after) {
+ border: none;
+}
+
+:deep(.van-grid-item__content) {
+ background: $selectSymbol_background;
+}
+
+:deep(.van-grid-item__text) {
+ color: $text_color;
+ font-size: 13px;
+ height: 30px;
+}
+
+.my-index {
+ padding-bottom: 60px;
+}
+
+h1.title {
+ font-size: 22px;
+ line-height: 26px;
+}
+
+.sub-text {
+ padding: 10px 0;
+ color: $text_color1;
+ font-size: 12px;
+}
+
+.name {
+ font-size: 16px;
+ line-height: 20px;
+}
+
+.yellow {
+ color: #F5C421;
+}
+
+.red {
+ color: $red;
+}
+
+.green {
+ color: $green;
+}
+
+.id-text {
+ font-size: 14px;
+ font-weight: 700;
+}
+
+.grid-item-img {
+ width: 48px;
+ height: 48px;
+ margin-bottom: 5px;
+}
+
+.van-grid-main {
+ padding: 5px 0;
+}
+
+.cell-img {
+ width: 20px;
+ height: 20px;
+ margin-right: 10px;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/news/explanation.vue b/src/views/news/explanation.vue
new file mode 100644
index 0000000..d9c44d9
--- /dev/null
+++ b/src/views/news/explanation.vue
@@ -0,0 +1,65 @@
+<template>
+ <div>
+ <!-- 顶部导航栏 -->
+ <div class="status_bar fixed w-full top-0 left-0 h-44 flex items-center justify-between bg-white">
+ <div class="i-material-symbols:arrow-back-ios-new-rounded text-black ml-13 text-18"></div>
+ <div class="absolute top-0 left-0 w-full h-44 flex items-center justify-center z--1">
+ <div class="text-19 font-medium">新手指南</div>
+ </div>
+ </div>
+
+ <!-- 内容占位 -->
+ <div class="h-44"></div>
+
+ <!-- 内容区域 -->
+ <div class="p-15 text-16">
+ <h2>產品詳情</h2>
+ <p>1 用戶可以隨時查看股票、數位貨幣、期貨價格，線上交易更安全。</p>
+ <p>2 提供使用者最專業的K線，深度分析市場行情，為使用者投資提供參考。</p>
+ <p>3 支援USDT、ETH、BTC等線上兌換，掌握最前沿幣幣交易行情。</p>
+
+ <h2>開戶須知</h2>
+ <p>1、開立真實帳戶（註冊會員）前需仔細閱讀、查看我司《交易規則》和《風險揭露與告知》。</p>
+ <p>2.客戶開戶要求為：年滿18歲、具有完全民事行為能力的公民。</p>
+ <p>3、客戶應保管好自己的數位錢包，用於相互轉賬，並妥善保管銀行密碼和交易密碼，定期修改密碼，不得向任何人透露。</p>
+ <p>4、自行註冊，遵守「一人一帳戶規則」。</p>
+ <p>5.成功儲值公眾號後即可開始交易。</p>
+
+ <h2>交易須知</h2>
+ <p>1、申請經費後，隨時買賣；</p>
+ <p>2、帳戶撮合後，即可當日交易；</p>
+ <p>3、當資金接近虧損強警戒線時，需盡快補足保證金；若不及時補倉，可能被風控系統強制平倉；</p>
+ <p>4、當交易資金低於平倉線時，我們有權對您的帳戶實施止損操作；</p>
+ <p>方法一：透過平台買賣清單將您想買入的訂單進行買賣。</p>
+ <p>方法二：根據您的需求點擊發布按鈕發布買入或賣出訂單進行快速成交，系統會為您快速匹配買賣用戶。</p>
+ <p>注意：買入訂單15分鐘後如未支付，系統將自動取消訂單，請及時支付。</p>
+ <p>若當日取消訂單3次以上，則當日無法再次成交，次日恢復交易權限</p>
+
+ <h2>溫馨提示</h2>
+ <p>投資衍生品具有重大風險，並不適合所有投資者。</p>
+ <p>您並不擁有基礎資產或其相關權益。</p>
+ <p>我們建議您尋求獨立顧問的建議，以確保您在交易前充分了解所涉及的風險。</p>
+ <p>本網站僅提供一般訊息，並未考慮您的特定目標、需求和財務狀況。</p>
+ <p>因此，當您決定交易或繼續持有任何衍生產品時，應結合您的個人目標、需求和財務狀況進行考慮。</p>
+ <p>我們服務的所有細節和任何收費均包含在我們的金融服務指南中，該指南也可透過上述管道獲得。</p>
+ <p>我們的 CFD 目標市場確認函詳細說明了我們金融產品的適用群體。</p>
+ <p>在您決定交易或繼續持有任何金融產品之前，請務必閱讀我們的產品揭露聲明、資訊備忘錄（適用於 CMC Pro 使用者）和其他相關文件。</p>
+ <p>所有這些文件均可在 www.Thinkmarkets.info 上取得。</p>
+ <p>CMC Markets Asia Pacific Pty Ltd (ACN 100 058 213)，AFSL 編號 238054，差價合約發行人。</p>
+ <p>Apple、iPad 和 iPhone 是 Apple Inc. 在美國和其他國家的註冊商標。</p>
+ <p>App Store 是 Apple Inc. 的服務標誌。</p>
+ <p>Android 是 Google Inc. 的註冊商標。</p>
+ <p>© 2024 CMC Markets</p>
+ </div>
+ </div>
+</template>
+
+<script setup>
+// 可以在这里添加需要的逻辑
+</script>
+
+<style scoped>
+/* 可以在这里添加样式 */
+@import '@/assets/css/deepseek_css_20250625_30ff932.css';
+
+</style>
\ No newline at end of file
diff --git a/src/views/news/index.vue b/src/views/news/index.vue
index f92ea3f..185cf77 100644
--- a/src/views/news/index.vue
+++ b/src/views/news/index.vue
@@ -1,13 +1,13 @@
<template>
- <section class="inner-tab-container">
- <p class="title">{{ t('news') }}</p>
- <div class="news-container">
- <van-steps direction="vertical" :active="0" active-color="#fff">
- <van-step v-for="(item, index) in list" :key="item.uuid || index">
+ <!-- <section class="inner-tab-container"> -->
+ <!-- <p class="title">{{ t('news') }}</p> -->
+ <!-- <div class="news-container"> -->
+ <!-- <van-steps direction="vertical" :active="0" active-color="#fff"> -->
+ <!-- <van-step v-for="(item, index) in list" :key="item.uuid || index">
<p class="time">{{ item.createTime }}</p>
<p class="context">{{ item.description }}</p>
- </van-step>
- <!-- <van-step>
+ </van-step> -->
+ <!-- <van-step>
<p class="time">2023-06-15 11:30</p>
<p class="context">南非汇市：兰特兑美元走高，美国通胀报告发布后美元跌至约两周地点</p>
</van-step>
@@ -15,22 +15,141 @@
<p class="time">2023-06-14 14:20</p>
<p class="context">降息预期遭重挫败！CPI环比增速抬头 美联储抗通胀之路注定崎岖</p>
</van-step> -->
- </van-steps>
+ <!-- </van-steps> -->
+ <!-- </div> -->
+ <!-- </section> -->
+ <!-- 顶部用户信息栏 -->
+ <div class="flex items-center justify-between px-17 pt-10">
+ <div class="text-20 font-bold">{{ username }}</div>
+ <div class="flex items-center" @click="goToCustomerService">
+ <img class="w-30 h-30" src="@/assets/image/service.png" draggable="false">
+ <div class="w-45 h-45 rounded-full ml-12"></div>
</div>
- </section>
+ </div>
+
+
+ <!-- 热门货币卡片部分 -->
+ <div class="mt-10">
+ <div class="block text-22 font-medium px-17">熱門</div>
+ <div class="flex overflow-x-auto mt-10 px-17">
+ <!-- DOGE/USDT 卡片 -->
+ <div class="w-140 h-160 mr-10 flex-none rounded-15 text-black" v-for="(item, index) in hotItems" :key="item"
+ :class="index % 2 === 1 ? 'bg-#9f9cff' : 'bg-#d8f0dd'">
+ <div class="py-17 px-13">
+ <div class="font-bold block text-18">{{ item.name }}</div>
+ <div class="font-bold block text-20">{{ item.ask }}</div>
+ <div class="w-full h-50">
+ <div id="DOGEUSDT" class="w-full h-full"
+ style="user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);">
+ <!-- 图表容器保持不变 -->
+ </div>
+ </div>
+ <div class="flex justify-between">
+ <div class="py-2 px-8 rounded-full text-13 font-medium bg-white">{{item.change_ratio}}</div>
+ <span class="text-18">→</span>
+ </div>
+ </div>
+ </div>
+
+ <!-- 其他货币卡片保持相同转换模式... -->
+ </div>
+ </div>
+
+ <!-- 底部导航图标 -->
+ <div class="flex justify-between text-12 mt-20">
+ <div class="flex-1 flex flex-col items-center" @click="goToPage('/mining')">
+ <div class="w-40 h-40 rounded-full flex items-center justify-center">
+ <img class="w-33 h-33" src="@/assets/a.jpg" draggable="false">
+ </div>
+ <div class="text-center">理財</div>
+ </div>
+ <div class="flex-1 flex flex-col items-center">
+ <div class="w-40 h-40 rounded-full flex items-center justify-center">
+ <img class="w-33 h-33" src="@/assets/c.jpg" draggable="false">
+ </div>
+ <div class="text-center">模拟交易</div>
+ </div>
+ <div class="flex-1 flex flex-col items-center" @click="copyInviteLink">
+ <div class="w-40 h-40 rounded-full flex items-center justify-center">
+ <img class="w-33 h-33" src="@/assets/d.jpg" draggable="false">
+ </div>
+ <div class="text-center">好友邀请</div>
+ </div>
+ </div>
+
+ <!-- 新手指南部分 -->
+ <div class="mt-20 mx-17 h-50 rounded-5 bg-#d8f0dd font-500 flex items-center justify-between text-16 px-15" @click="goToExplanation">
+ <span>新手指南</span>
+ <div class="i-material-symbols:arrow-right-alt-rounded text-20"></div>
+ </div>
+
+
+
+
+
+
+
+ <div class="mt-20">
+ <div class="flex items-end justify-between px-17">
+ <span class="block text-22 font-medium">新聞</span>
+ </div>
+ <div class="px-17 mt-10">
+ <!-- 新闻条目1 -->
+ <div class="rounded-5 overflow-hidden mb-10" v-for="(t , i) in list" :key="t.dataId" >
+ <div class="bg-#f5f7f9 py-12 px-15 " @click="openOriginUrl(t.originUrl)">
+ <div class="flex" style="border-bottom: 1px solid rgb(209, 209, 209);">
+ <div class="text-12 h-70 flex-1 line3">{{ t.description }}</div>
+ <img class="w-90 h-55 flex-none rounded-10 ml-10"
+ :src="t.img"
+ draggable="false">
+ </div>
+ <div class="mt-5 text-10 text-#8c8c8c flex justify-between">
+ <span>{{t.createTime}}</span>
+ <div>全球股市</div>
+ </div>
+ </div>
+ </div>
+
+ </div>
+ </div>
</template>
<script setup>
import { ref, onMounted } from 'vue';
import { _getInformationList } from '@/service/etf.api'
+import {_getHomeList} from '@/service/cryptos.api'
+import { showToast } from 'vant'
import { useI18n } from 'vue-i18n'
+import { useRouter } from 'vue-router'
+const router = useRouter()
const { t } = useI18n()
const list = ref([])
+const hotItems = ref([]) // 热门
+const username = ref('')
+const usercode = ref('')
onMounted(async () => {
getInformationList()
+ getHomeList()
+
+ // 从localStorage获取用户信息
+ const user = JSON.parse(localStorage.getItem('user'))
+ console.log('user', user)
+ username.value = user.userInfo?.username || ''
+ usercode.value = user.userInfo?.usercode || ''
})
+
+const goToExplanation = () => {
+ goToPage('/news/explanation')
+}
+// 点击客服图标
+const goToCustomerService = () => {
+ goToPage('/customerService')
+}
+const goToPage = (path) => {
+ router.push(path)
+}
const getInformationList = () => {
_getInformationList().then(data => {
@@ -38,58 +157,38 @@
})
}
+const getHomeList = () => {
+ _getHomeList().then(data => {
+ hotItems.value = data.slice(0, 3) // 取前3条数据
+ })
+}
+
+// 添加跳转方法
+const openOriginUrl = (url) => {
+ window.open(url, '_blank')
+}
+
+const copyInviteLink = () => {
+ const inviteLink = 'https://www.thinkmarketga.com/#/pages/register?c=' + usercode.value // 替换为你的实际邀请链接
+ navigator.clipboard.writeText(inviteLink)
+ .then(() => {
+ // 可以添加提示，比如使用Toast组件
+ showToast({
+ message: '邀请链接已复制',
+ position: 'bottom',
+ })
+ })
+}
</script>
<style lang="scss" scoped>
-:deep(.van-steps) {
- background: $selectSymbol_background;
+@import '@/assets/css/deepseek_css_20250625_30ff932.css';
- .van-step__title {
- color: $text_color;
-
- .time {
- color: #747A8F;
- margin: 5px 0;
- }
-
- }
-
- .van-step__line {
- background-color: $border_color;
- }
-
- .van-icon-checked::before {
- content: '';
- background-color: #3478F6;
- width: 6px;
- height: 6px;
- box-shadow: 0 0 0px 4px #15284F;
- border-radius: 50%;
- }
-
- .van-step__circle {
- background-color: #3478F6;
- width: 6px;
- height: 6px;
- box-shadow: 0 0 0px 4px #15284F;
- }
-
- .van-step--vertical:not(:last-child):after {
- border-bottom-width: 1px;
- border-color: $border_color;
- }
-}
-
-.inner-tab-container {
- margin-top: 8px;
- padding: 0 12px 60px;
-
- .title {
- font-size: 16px;
- font-weight: 700;
- margin-bottom: 8px;
- }
-
- .news-container {}
+.line3{
+ display: -webkit-box;
+ -webkit-line-clamp: 3;
+ -webkit-box-orient: vertical;
+ overflow: hidden;
+ text-overflow: ellipsis;
}
</style>
\ No newline at end of file
diff --git a/src/views/optional/index.vue b/src/views/optional/index.vue
index fb75467..2b5bc5f 100644
--- a/src/views/optional/index.vue
+++ b/src/views/optional/index.vue
@@ -1,681 +1,104 @@
<template>
- <section class="pb-20">
- <div class="container-box">
- <header class="header">
- <div class="flex-l" @click="handleShowPopup">
- <div class="icon">
- <img src="@/assets/image/optional/left-icon.png" alt="">
- </div>
- <span class="title">{{ optionalType == 1 ? activeInfo.listName : optionalName }}</span>
- </div>
- <div class="icon-group">
- <!-- <div class="icon search" @click="onRoute('/optional/search')">
- <img src="@/assets/image/optional/search.png" alt="">
- </div> -->
- <!-- <div class="icon setting">
- <img src="@/assets/image/optional/setting.png" alt="" @click="onRoute('/optional/setting')">
- </div> -->
- </div>
- </header>
- <div class="has-data">
- <section class="option-container">
- <div class="flex-l" @click="onRoute('/optional/editGroupList')">
- <div class="icon">
- <img src="@/assets/image/optional/edit.png" alt="">
- </div>
- <span class="title">{{ t('editList') }}</span>
- </div>
- <div class="flex-r flex items-center">
- <span class="title">{{ t('最新价') }}</span>
- <div class="search flex items-center">
- <div class="filter-box ml-10">
- <div class="w-14 h-12 " :class="[sortVal == 1 ? 'icon_top1_active' : 'icon_top1']" @click="listSort(1)">
- </div>
- <div class="w-14 h-12" :class="[sortVal == 2 ? 'icon_top2_active' : 'icon_top2']" @click="listSort(2)">
- </div>
- </div>
- </div>
- </div>
- </section>
- <section class="market-container">
- <div class="symbol-table">
- <ul>
- <li class="flex" @click="itemClick(item)" v-for="(item, index) in itemList" :key="index">
- <div class="flex-l">
- <div class="flex-l-item logo">
- <img :src="`${HOST_URL}/symbol/${item.symbol_data}.png`" alt="">
- </div>
- <div class="flex-l-item name-title">
- <p v-if="item.type == 'cryptos'" class="name-short">{{ item.symbol_data.toUpperCase() }}</p>
- <p v-else class="name-short">{{ item.symbol }}</p>
- <p class="name">{{ item.name }}</p>
- </div>
- </div>
- <div class="flex-r">
- <div class="flex-r-item chart-box">
- <m-echarts :dataObj="item" :ratio="item.change_ratio" :index="index" />
- </div>
- <div class="flex-r-item data-box">
- <div class="data-item" :class="[item.change_ratio < 0 ? 'bg-red' : 'bg-green']">{{ item.close }}</div>
- <p class="value" :class="[item.change_ratio < 0 ? 'color-red' : 'color-green']">
- {{ item.change_ratio < 0 ? item.net_change : '+' + item.net_change }} {{
- item.change_ratio }}%</p>
- </div>
- </div>
- </li>
- </ul>
- </div>
- <!-- <div class="add-btn-group">
- <div class="add-icon icon">
- <img src="@/assets/image/optional/add.png" alt="">
- </div>
- <span @click="onRoute('/optional/search')">{{ t('addStock') }}</span>
- </div> -->
- </section>
+<div class="status_bar">
+ <div class="my-20 mx-17 h-172 box-border text-white pt-40 px-20 bgimglx">
+ <div class="text-17 font-medium block">帳戶總金額</div>
+ <div class="text-34 font-medium block">{{symbol}}</div>
+ <div class="flex items-center mt-20">
+ <div class="flex items-center rounded-14 bg-#3640f0 px-10">
+ <div class="text-13 font-bold">儲值</div>
</div>
- <!-- <div class="no-data" v-if="itemList.length == 0">
- <img src="@/assets/image/optional/no-data.png" alt="">
- <p class="text">{{ t('暂无股票') }}</p> -->
- <!-- <div class="add-btn">
- <span>+ {{ t('添加') }}</span>
- </div> -->
- <!-- </div> -->
- <van-popup overlay-class="left-modal" v-model:show="show" position="left"
- :style="{ width: '75%', height: '100%', background: '#1F233D' }" round safe-area-inset-top safe-area-inset-bottom>
- <div class="modal-inner-box">
- <p>{{ t('myPortfolio') }}</p>
- <div class="sidebar">
- <van-sidebar v-model="activeSideBarIndex">
- <!-- <van-sidebar-item @click="openType('all', 'ETF')" :title="t('全部股票')" /> -->
- <van-sidebar-item :title="`${item.listName}(${item.symbolCount})`" @click="openId(item)"
- v-for="(item, index) in optionalList" :key="index" />
- <!-- <van-sidebar-item @click="openType('indices', 'ETF')" :title="`ETF(${fixedData.indices || 0})`" /> -->
- <!-- <van-sidebar-item @click="openType('US-stocks', t('UsStocks'))"
- :title="`${t('UsStocks')}(${fixedData['US-stocks'] || 0})`" /> -->
- <van-sidebar-item @click="openType('cryptos', t('digitalCurrency'))"
- :title="`${t('digitalCurrency')}(${fixedData.cryptos || 0})`" />
- <!-- <van-sidebar-item @click="openType('forex', t('外汇'))" :title="`${t('外汇')}(${fixedData.forex || 0})`" /> -->
- </van-sidebar>
- </div>
- <footer class="footer-container">
- <!-- <div class="btn-group flex">
- <div class="btn-item flex-1" @click="onRoute('/optional/groupListManagement')">
- <div class="icon">
- <img src="@/assets/image/optional/edit.png" alt="">
- </div>
- <p>{{ t("managementPortfolio") }}</p>
- </div>
- <div class="line"></div>
- <div class="btn-item flex-1" @click="onRoute('/optional/groupAdd')">
- <div class="icon">
- <img src="@/assets/image/optional/add-icon.png" alt="">
- </div>
- <p>{{ t("addList") }}</p>
- </div>
- </div> -->
- </footer>
- </div>
- </van-popup>
+ <div class="flex items-center rounded-14 bg-#3640f0 px-10 ml-10">
+ <div class="text-13 font-bold">提現</div>
+ </div>
+ <div class="flex items-center rounded-14 bg-#3640f0 px-10 ml-10">
+ <div class="text-13 font-bold">兌換</div>
+ </div>
+ <div class="flex flex-1 justify-end">
+ <img src="@/assets/imgs/icon-order.png" class="w-14 h-15" draggable="false">
+ </div>
</div>
- </section>
+ </div>
+</div>
+
+<!-- 货币列表部分 -->
+<div class="pt-20 px-15">
+ <!-- DOGE 货币卡片 -->
+ <div
+ v-for="(currency, index) in currencies"
+ :key="index"
+ class="p-14 mb-15"
+ style="border: 0.5px solid rgb(243, 243, 243);"
+ >
+ <div class="text-14 title pb-10" style="border-bottom: 0.5px solid rgb(243, 243, 243);">
+ {{ currency.name }}
+ </div>
+ <div class="text-12 pt-10">
+ <div class="flex justify-between items-center">
+ <div style="color: rgb(150, 150, 150);">可用({{ currency.name }})</div>
+ <div class="title text-blue-600">{{ currency.mark_price }}</div>
+ </div>
+ <div class="my-16 flex justify-between items-center">
+ <div style="color: rgb(150, 150, 150);">處理中({{ currency.name }})</div>
+ <div>{{ 0 }}</div>
+ </div>
+ <div class="flex justify-between items-center">
+ <div style="color: rgb(150, 150, 150);">轉換(USDT)</div>
+ <div></div>
+ </div>
+ </div>
+ </div>
+
+</div>
+
+
</template>
-
+
<script setup>
-import { ref, onMounted, onBeforeUnmount } from 'vue';
-import { useUserStore } from '@/store/user';
-import { useRoute, useRouter } from 'vue-router';
-import { Popup, Sidebar, SidebarItem } from 'vant';
-import { _itemUserOptionalList, _itemUserOptionalListAdd, _listItemsById } from '@/service/quotes.api'
-import { _getQuotes, _listItemsByType } from '@/service/quotes.api'
-import { OPCIONA_LIST, CITAS_LIST, IS_LOAD } from '@/store/types.store'
-import { useQuotesStore } from '@/store/quotes.store'
-import { showLoadingToast, closeToast } from 'vant';
-import {
- contractOrder
-} from "@/service/trade.api.js";
-import { useI18n } from 'vue-i18n'
-import MEcharts from "@/components/ex-echarts/index.vue";
-import { HOST_URL } from '@/config'
+import { ref, onMounted } from 'vue';
+import { _getContractBySymbolType, _contractOrder } from '@/service/etf.api';
-const { t } = useI18n()
-const router = useRouter()
-const route = useRoute()
-const show = ref(false)
-const activeSideBarIndex = ref(0)
-const optionalList = ref([])
-const activeInfo = ref({})
-const itemList = ref([])
-const interval = ref(null)
-const fixedData = ref({})
-const optionalType = ref(1)
-const optionalName = ref('')
-const sortVal = ref(0)
-const quotesStore = useQuotesStore()
-const useStore = useUserStore();
-onMounted(async () => {
- // if (!useStore.userInfo.token) {
- // router.push('/login')
- // return false
- // }
- if (quotesStore.$state.isLoad === 1) {
- showLoadingToast({
- message: t('加载中...'),
- duration: 0
- });
- quotesStore[IS_LOAD](2)
- }
- await getMyCoinsList()
- itemList.value = quotesStore.$state.citasList
- IntervalFun()
+onMounted(() => {
+ getSymbol();
+ getOrderList();
+});
+// 货币数据
+const currencies = ref([
+ // {
+ // name: 'DOGE',
+ // mark_price: 0,
+ // },
+]);
-})
+const symbol = ref('0.00'); // 总金额
+// 总金额
+const getSymbol = async () => {
+ const response = await _getContractBySymbolType('cryptos');
+ symbol.value = response.money_contract || symbol.value;
+};
-const openType = (val, name) => {
- quotesStore[IS_LOAD](3)
- openByTypeItem(val, name)
-}
-const openId = (item) => {
- quotesStore[IS_LOAD](3)
- quotesStore[OPCIONA_LIST]([])
- quotesStore[CITAS_LIST]([])
- activeInfo.value = item
- byIdItem(item.listId)
- show.value = false
-}
-const handleShowPopup = () => {
- show.value = true;
-}
-
-const onRoute = (path) => {
- router.push(path)
-}
-//获取我的自选列表
-const getMyCoinsList = () => {
- let params = {}
- optionalList.value = []
- if (!useStore.userInfo.token) { //没登陆
- optionalType.value = 3
- optionalName.value = t('all')
- let obj = [
- { symbol: 'AAPL' },
- { symbol: 'MSFT' },
- { symbol: 'btcusdt' },
- { symbol: 'ethusdt' },
- { symbol: 'SH518880' },
- { symbol: '.IXIC' },
- { symbol: '.DJI' },
- ]
- quotesStore[OPCIONA_LIST](obj)
- activeSideBarIndex.value = 0
- } else {
- activeSideBarIndex.value = 1
- _itemUserOptionalList(params).then(data => {
- closeToast()
- fixedData.value = data.count
- optionalList.value = data.list || []
- if (optionalList.value.length > 0) {
- activeInfo.value = optionalList.value[0]
- byIdItem(activeInfo.value.listId)
- }
- })
- }
-}
-//根据id获取列表
-const byIdItem = (id) => {
- if (!useStore.userInfo.token) {
- return
- }
- optionalType.value = 1
- let obj = {
- id: id
- }
- if (quotesStore.$state.isLoad === 3) {
- showLoadingToast({
- message: t('加载中...'),
- duration: 0
- });
- quotesStore[IS_LOAD](2)
- }
- _listItemsById(obj).then((res) => {
- closeToast()
- let arry = []
- quotesStore[OPCIONA_LIST]([])
- res.map((item) => {
- let objData = {
- symbol: item.symbol
- }
- arry.push(objData)
- })
- console.log(arry, 222)
- quotesStore[OPCIONA_LIST](arry)
- if (arry.length == 0) {
- quotesStore[CITAS_LIST]([])
- }
- })
-}
-//根据type获取列表
-const openByTypeItem = (val, name) => {
- if (!useStore.userInfo.token) {
- return
- }
- if (quotesStore.$state.isLoad === 3) {
- showLoadingToast({
- message: t('加载中...'),
- duration: 0
- });
- quotesStore[IS_LOAD](2)
- }
- show.value = false
- if (val === 'all') {
- optionalType.value = 3
- optionalName.value = t('all')
- let obj = [
- { symbol: 'AAPL' },
- { symbol: 'MSFT' },
- { symbol: 'btcusdt' },
- { symbol: 'ethusdt' },
- { symbol: 'SH518880' },
- { symbol: '.IXIC' },
- { symbol: '.DJI' },
- ]
- quotesStore[OPCIONA_LIST](obj)
- activeSideBarIndex.value = 0
-
- } else {
- quotesStore[OPCIONA_LIST]([])
- quotesStore[CITAS_LIST]([])
- optionalType.value = 2
- optionalName.value = name
- let obj = {
- type: val
- }
- _listItemsByType(obj).then((res) => {
- closeToast()
- let arry = []
- quotesStore[OPCIONA_LIST]([])
- res.map((item) => {
- let objData = {
- symbol: item.symbol
- }
- arry.push(objData)
- })
- console.log(arry, 2222)
- quotesStore[OPCIONA_LIST](arry)
- if (arry.length == 0) {
- quotesStore[CITAS_LIST]([])
- }
- })
- }
-}
-
-// const openByIdItem = (item) => {
-// quotesStore[IS_LOAD](3)
-// quotesStore[OPCIONA_LIST]([])
-// quotesStore[CITAS_LIST]([])
-// activeInfo.value = item
-// byIdItem(item.listId)
-// show.value = false
-// }
-//跳转界面
-const itemClick = (item) => {
- console.log(item)
- if (item.type == "cryptos") { //跳转虚拟币
- router.push('/cryptos/trendDetails/' + item.symbol+'?isOptional=1')
- } else if (item.type == "indices") { //efg
- router.push('/quotes/detail?symbol=' + item.symbol+'&isOptional=1')
- } else if (item.type == "US-stocks") { //美股
- router.push('/quotes/usStockDetail?symbol=' + item.symbol+'&isOptional=1')
- } else {
- router.push('/foreign/coinChart?symbol=' + item.symbol+'&isOptional=1')
- }
-}
-//数字排序
-const orderListAsc = (filed, type = "asc") => {
- return (a, b) => {
- if (type == "asc") return parseFloat(a[filed]) > parseFloat(b[filed]) ? 1 : -1;
- return parseFloat(a[filed]) > parseFloat(b[filed]) ? -1 : 1;
+const getOrderList = async () => {
+ const params = {
+ type: 'orders',
+ page_no: 1,
+ page_size: 'all',
+ symbolType: 'cryptos'
};
-}
-const listSort = (val) => {
- sortVal.value = val
-}
-const IntervalFun = () => {
- interval.value = setInterval(() => {
- closeToast()
- if (quotesStore.$state.opcionalList.length > 0) {
- console.log(quotesStore.$state.opcionalList)
- _getQuotes(quotesStore.$state.opcionalList).then((data) => {
- itemList.value = data
- if (sortVal.value == 1) {
- itemList.value = itemList.value.sort(orderListAsc('close'))
- quotesStore[CITAS_LIST](itemList.value)
- } else {
- itemList.value = itemList.value.sort(orderListAsc('close', 'ask'))
- quotesStore[CITAS_LIST](itemList.value)
- }
- })
- } else {
- itemList.value = []
- }
- }, 2000)
-}
+ const response = await _contractOrder(params);
+ console.log(response, 'response')
+ // 处理订单数据
+ currencies.value = response
+};
-onBeforeUnmount(() => {
- if (interval.value) {
- console.log(interval.value)
- clearInterval(interval.value)
- }
-})
</script>
+
<style lang="scss" scoped>
-:deep(.van-sidebar) {
- width: 100%;
-}
+@import "@/assets/css/deepseek_css_20250625_30ff932.css";
-:deep(.van-sidebar-item) {
- background-color: $main2_background;
- color: $text_color;
- padding: 12px;
-}
-
-:deep(.van-sidebar-item--select) {
- background-color: #1C2946;
- color: $color_main;
-}
-
-.container-box {
- padding: 0 12px 50px 12px;
-
- .name-title {
- width: 100px;
- }
-
- .green {
- color: $green;
- }
-
- .red {
- color: $red;
- }
-
- .header {
- display: flex;
- height: 28px;
-
- .flex-l {
- flex: 1;
- display: inline-flex;
-
- .icon {
- display: inline-block;
- width: 24px;
- height: 28px;
- padding: 6px 4px;
-
- img {
- height: 16px;
- width: 12px;
- }
- }
- }
-
- .title {
- font-weight: 700;
- font-size: 20px;
- line-height: 28px;
- color: $mainTextColor;
- }
-
- .icon-group {
- width: 100px;
- text-align: right;
-
- .icon {
- display: inline-block;
- width: 28px;
- height: 28px;
- padding: 4px;
- margin-left: 16px;
- }
- }
-
-
- }
-
- .no-data {
- margin-top: 30%;
- display: flex;
- flex-direction: column;
- align-items: center;
-
- img {
- width: 98px;
- height: 108px;
- }
-
- .text {
- margin: 30px 0;
- font-size: 14px;
- color: #747A8F;
- }
-
- .add-btn {
- width: 134px;
- height: 38px;
- border: 1px solid #0083DA;
- border-radius: 6px;
- color: #0083DA;
- text-align: center;
- line-height: 36px;
- }
- }
-
- .option-container {
- margin-top: 20px;
- display: flex;
- justify-content: space-between;
- font-size: 12px;
- color: #747A8F;
-
- .flex-l {
- display: inline-flex;
- align-items: center;
-
- .icon {
- width: 20px;
- height: 20px;
- margin-right: 8px;
- }
- }
-
- .flex-r {
- display: inline-flex;
- align-items: center;
-
- .icon {
- width: 20px;
- height: 20px;
- margin-left: 8px;
- }
- }
- }
-
- .market-container {
- padding: 10px 0 60px;
-
- .symbol-table {
- line-height: 22px;
-
- li {
- padding: 16px 0;
- border-bottom: 1px solid $border_color;
- }
-
- .flex-l {
- display: flex;
- width: 130px;
- align-items: center;
-
- .logo {
- width: 28px;
- height: 28px;
- margin-right: 6px;
- }
-
- .name-short {
- font-weight: 600;
- font-size: 14px;
- }
-
- .name {
- font-size: 12px;
- color: #B8BDD1;
- }
- }
-
- .flex-r {
- display: flex;
- flex: 1;
- align-items: center;
- font-size: 12px;
- text-align: center;
-
- .flex-r-item {
- flex: 1;
- align-self: center;
- }
-
- .data-box {
- padding: 0 6px;
-
- .data-item {
- text-align: center;
- height: 24px;
- line-height: 24px;
- border-radius: 4px;
- color: $text_color;
- font-weight: 600;
- font-size: 14px;
- }
-
- .bg-red {
- background: $red;
- }
-
- .bg-green {
- background: $green;
- }
-
- .value {
- font-weight: 300;
- margin-top: 4px;
- }
-
- }
- }
- }
-
- .add-btn-group {
- display: flex;
- align-items: center;
- margin-top: 20px;
- font-size: 12px;
- line-height: 24px;
- color: $color_main;
-
- .icon {
- width: 16px;
- height: 16px;
- margin-right: 8px;
- }
- }
-
- }
-
- .modal-inner-box {
- padding: 30px 0 50px;
-
- >p {
- padding-left: 12px;
- font-weight: 700;
- font-size: 16px;
- }
-
- .sidebar {
- margin-top: 10px;
- width: 100%;
- }
- }
-
- .footer-container {
- position: absolute;
- width: 100%;
- bottom: 0px;
- border-top: 1px solid #2B314A;
-
- .line {
- margin: 10px 0;
- width: 1px;
- height: 40px;
- background-color: #2B314A;
- }
-
- .btn-item {
- display: flex;
- justify-content: center;
- align-items: center;
- font-size: 13px;
- height: 60px;
- }
-
- .icon {
- margin-right: 4px;
- width: 18px;
- height: 18px;
- }
- }
-
-}
-
-.color-red {
- color: $red;
-}
-
-.color-green {
- color: $green;
-}
-
-.filter-box {
- .icon_top1 {
- background: url('../../assets/image/icon_top1.png') no-repeat center;
- background-size: 100% 100%;
- width: 10px;
- height: 6px;
- }
-
- .icon_top2 {
- background: url('../../assets/image/icon_top2.png') no-repeat center;
- background-size: 100% 100%;
- margin-top: 1px;
- width: 10px;
- height: 6px;
- }
-
- .icon_top1_active {
- background: url('../../assets/image/icon_top3.png') no-repeat center;
- background-size: 100% 100%;
- width: 10px;
- height: 6px;
- }
-
- .icon_top2_active {
- background: url('../../assets/image/icon_top4.png') no-repeat center;
- background-size: 100% 100%;
- margin-top: 1px;
- width: 10px;
- height: 6px;
- }
+.bgimglx {
+ background: url('@/assets/imgs/position-card.png') no-repeat;
+ background-size: 100% 100%;
+ background-repeat: no-repeat;
}
</style>
\ No newline at end of file
diff --git a/src/views/payMentMethod/selectPay.vue b/src/views/payMentMethod/selectPay.vue
index beca529..45b8c5a 100644
--- a/src/views/payMentMethod/selectPay.vue
+++ b/src/views/payMentMethod/selectPay.vue
@@ -107,7 +107,7 @@
<style lang="scss" scoped>
.selectPay {
.index-anchor {
- background: #232C46;
+ background: #f5f7f9;
}
diff --git a/src/views/position/newindex.vue b/src/views/position/newindex.vue
new file mode 100644
index 0000000..0c8e41e
--- /dev/null
+++ b/src/views/position/newindex.vue
@@ -0,0 +1,193 @@
+<template>
+ <div class="pb-50">
+ <!-- 顶部导航栏 -->
+ <div class="status_bar fixed w-full top-0 left-0 h-44 flex items-center justify-between bg-white">
+ <div class="i-material-symbols:arrow-back-ios-new-rounded text-black ml-13 text-18" @click="handleBack"></div>
+ <div class="px-17"></div>
+
+ <div class="status_bar absolute top-0 left-0 w-full h-44 flex items-center justify-center z--1">
+ <div class="p-3 bg-#EEE rounded-full flex text-12 font-medium">
+ <span
+ class="block h-24 w-84.5 text-center leading-24 rounded-full cursor-pointer"
+ :class="activeTab === 'position' ? 'bg-#3640f0 text-white' : ''"
+ @click="switchTab('position')"
+ >
+ 持倉
+ </span>
+ <span
+ class="block h-24 w-84.5 text-center leading-24 rounded-full cursor-pointer"
+ :class="activeTab === 'history' ? 'bg-#3640f0 text-white' : ''"
+ @click="switchTab('history')"
+ >
+ 歷史
+ </span>
+ </div>
+ </div>
+ </div>
+ <div class="h-44"></div>
+
+ <!-- 订单列表 -->
+ <div class="pt-10 px-17">
+ <!-- 历史 -->
+ <div
+ v-for="(order, index) in orders"
+ :key="index"
+ class="py-20 px-15 rounded-15 bg-#f5f7f9 mb-10"
+ >
+ <div class="flex justify-between pb-10" style="border-bottom: 0.5px solid rgb(218, 218, 218);">
+ <span class="font-medium text-15">{{ order.pair }}</span>
+ <div class="text-end">
+ <span class="font-medium">{{ order.price }}<br></span>
+ <span class="text-11 font-medium" :class="order.type === 'sell' ? 'text-red' : 'text-blue'">
+ {{ order.type === 'sell' ? '拋售' : '購買' }}
+ </span>
+ </div>
+ </div>
+
+ <div class="mt-10 text-11 text-#8c8c8c">
+ <div class="flex justify-between">
+ <div class="flex-1 flex justify-between">
+ <span>金額</span>
+ <span class="text-black">{{ order.amount }}</span>
+ </div>
+ <div class="flex-1 flex justify-between ml-30">
+ <span>時長</span>
+ <span class="text-black">{{ order.duration }}</span>
+ </div>
+ </div>
+
+ <div class="flex" v-if="activeTab === 'history'">
+ <div class="flex justify-between mt-10 flex-1">
+ <span>結算價格</span>
+ <span :class="order.profit >= 0 ? 'text-green' : 'text-red'">{{ order.settlePrice }}</span>
+ </div>
+ <div class="flex justify-between mt-10 flex-1 ml-30">
+ <span>服務費</span>
+ <span :class="order.profit >= 0 ? 'text-green' : 'text-red'">{{ order.fee }}</span>
+ </div>
+ </div>
+
+ <div class="flex justify-between mt-10">
+ <span>下單時間</span>
+ <span class="text-black">{{ order.time }}</span>
+ </div>
+ </div>
+ </div>
+
+
+
+ <div class="text-center py-20" style="color: rgb(167, 166, 166);">已全部載入···</div>
+ </div>
+ </div>
+</template>
+
+<script setup>
+import { ref, reactive, onMounted, onBeforeUnmount } from "vue";
+import { showToast } from "vant";
+import {
+ useRouter,
+ useRoute
+} from 'vue-router';
+import { _ItemUserOptionalItemList } from '@/service/quotes.api'
+import {
+ contractOrder,
+ _contractApplyOrderCancel,
+ _contractOrderClose,
+ _contractApplyOrderList
+} from "@/service/trade.api.js";
+import { _getAllAssets, _getContractOrderAssets, _getEntrustOrderAssets } from "@/service/user.api.js";
+import { useI18n } from "vue-i18n";
+import { REQUEST_TIMER } from '@/config'
+
+const { t } = useI18n()
+const router = useRouter()
+const route = useRoute()
+
+const orders = ref([
+ {
+ pair: 'USD/CNH',
+ price: '7.31271',
+ type: 'sell',
+ amount: '10000',
+ duration: '300s',
+ settlePrice: '7.31225',
+ fee: '300',
+ profit: 1,
+ time: '2024-12-23 15:56:57'
+ },
+ {
+ pair: 'USD/CNH',
+ price: '7.29718',
+ type: 'sell',
+ amount: '5000',
+ duration: '300s',
+ settlePrice: '7.29675',
+ fee: '150',
+ profit: 1,
+ time: '2024-12-19 00:17:05'
+ },
+ {
+ pair: 'USD/HKD',
+ price: '7.76941',
+ type: 'buy',
+ amount: '10000',
+ duration: '300s',
+ settlePrice: '7.76899',
+ fee: '-300',
+ profit: -1,
+ time: '2024-12-18 09:25:02'
+ }
+])
+const activeTab = ref('position')
+const switchTab = (tab) => {
+ activeTab.value = tab
+ getHistoryOrders()
+}
+const list = ref([])
+const page = ref(1)
+// 添加获取历史订单方法
+const getHistoryOrders = () => {
+ let obj = {
+ type: activeTab.value, // 修改为历史订单类型
+ page_no: page.value,
+ page_size: 'all',
+ symbolType: 'forex'
+ }
+ contractOrder(obj).then((res) => {
+ list.value = res.data
+ // 处理历史订单数据...
+ })
+}
+
+// 持仓轮询
+// const interval = ref(null)
+onMounted(async () => {
+ switchTab('position') // 默认加载持仓
+
+ // interval.value = setInterval(() => {
+ // if (activeTab.value === 'position') {
+ // getHistoryOrders()
+ // }
+ // }, 2000)
+})
+
+// onBeforeUnmount(() => {
+// if (interval.value) {
+// clearInterval(interval.value)
+// }
+// })
+
+const handleBack = () => {
+ router.back()
+}
+
+
+
+
+
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/css/deepseek_css_20250625_30ff932.css";
+
+</style>
\ No newline at end of file
diff --git a/src/views/quotes/List.vue b/src/views/quotes/List.vue
index dc1c752..12a85cf 100644
--- a/src/views/quotes/List.vue
+++ b/src/views/quotes/List.vue
@@ -1,21 +1,21 @@
<template>
<section class="pb-fix">
- <div class="container-box">
- <header class="header">
- <div class="flex-l">
+ <!-- <div class="container-box"> -->
+ <!-- <header class="header"> -->
+ <!-- <div class="flex-l">
<span class="title">{{ t('quotes') }}</span>
</div>
<div class="icon-group">
<div class="icon search" @click="onRoute('/optional/search')">
<img src="@/assets/image/optional/search.png" alt="">
- </div>
+ </div> -->
<!-- <div class="icon setting">
<img src="@/assets/image/quotes/option.png" alt="" @click="onRoute('/optional/setting')">
</div> -->
- </div>
- </header>
- <section class="tab-container">
- <van-tabs v-model:active="tabActive" shrink @click-tab="onClickTab">
+ <!-- </div> -->
+ <!-- </header> -->
+ <!-- <section class="tab-container"> -->
+ <!-- <van-tabs v-model:active="tabActive" shrink @click-tab="onClickTab"> -->
<!-- <van-tab title="ETF">
<section v-if="tabActive === 0" class="etf-container">
<div class="kline-chart-container">
@@ -227,9 +227,9 @@
<div class="divider"></div>
</section>
</van-tab> -->
- <van-tab :title="t('加密货币')">
+ <!-- <van-tab :title="t('加密货币')"> -->
<Cryptos id="cryptos" />
- </van-tab>
+ <!-- </van-tab> -->
<!-- <van-tab :title="t('外汇')">
<Foreign v-if="tabActive === 2" />
</van-tab> -->
@@ -260,9 +260,9 @@
</div>
</div>
</van-tab> -->
- </van-tabs>
- </section>
- </div>
+ <!-- </van-tabs> -->
+ <!-- </section> -->
+ <!-- </div> -->
</section>
</template>
@@ -452,8 +452,9 @@
const getIndexCardInfo = () => {
_getETFItemList({
- type: 'indices',
- symbol: ['.DJI', '.INX', '.IXIC']
+ type: 'forex',
+ category: 'forex'
+ // symbol: ['.DJI', '.INX', '.IXIC']
}).then(data => {
indexCardInfo.value = data || []
})
@@ -470,7 +471,8 @@
const getETFItemList = () => {
_getETFItemList({
- type: 'indices'
+ type: 'forex',
+ category: 'forex'
}).then(data => {
if (data === null) {
data = []
diff --git a/tailwind.config.cjs b/tailwind.config.cjs
index ec64e40..7047b69 100644
--- a/tailwind.config.cjs
+++ b/tailwind.config.cjs
@@ -10,8 +10,8 @@
theme: {
extend: {
colors: {
- primary: '#1F2025', // 主色（文字等）
- gray: '#878A96', // 文字颜色
+ primary: '#ffffff', // 主色（文字等）
+ gray: '#333333', // 文字颜色
'btn-gray': '#F1F3F9', // 背景灰
'bd-gray': '#C3C4CD', // 下单border
up: '#06CDA5', // 升
@@ -23,6 +23,6 @@
extend: {},
},
plugins: [
-
+
],
}
--
Gitblit v1.9.3