udxcms 1.0.10 → 1.0.12

package/dist/components/pageComponents/index/component/DexFooter.vue

@@ -0,0 +1,141 @@
+<!--
+ * @Author: Sneed
+ * @Date: 2020-10-23 22:54:26
+ * @LastEditTime: 2021-12-31 15:50:46
+ * @LastEditors: Lewis
+ * @Description:
+-->
+<!--
+ * @Author: Sneed
+-->
+<template>
+	<div class="footer">
+		<div class="footer-container">
+			<div class="logo-wrapper">
+				<div class="logo">
+					<img :src="logoSrc + '/' + lang + '/w72.png'" />
+				</div>
+				<p>Next Exchange, Next Bitcoin.</p>
+			</div>
+			<div class="link-wrapper">
+				<a
+					v-for="(item, index) in linkArr"
+					:href="item.site_url"
+					:key="index"
+					>{{ item.name }}</a
+				>
+			</div>
+		</div>
+	</div>
+</template>
+<script>
+import config from "../../../../config/index";
+export default {
+	name: "DexFooter",
+	computed: {
+		logoSrc() {
+			let path =
+				this.$t("site_common_logo_base_url") +
+				(window.location.host.indexOf(config.localHostIp) == -1
+					? window.location.hostname
+					: config.testSite);
+			return path;
+		},
+	},
+	data() {
+		return {
+			sitePath: config.sitePath,
+			siteLogo: config.siteLogo,
+			lang: localStorage.getItem("language") || config.baseLanguage,
+			linkArr: [],
+		};
+	},
+	mounted() {
+		this.getMediasFunc();
+	},
+	methods: {
+		getMediasFunc() {
+			this.linkArr =
+				this.$t("media_common_media_channel") !=
+				"media_common_media_channel"
+					? JSON.parse(this.$t("media_common_media_channel"))
+					: [];
+		},
+	},
+};
+</script>
+<style lang="less" scoped>
+.footer {
+	border-top: 1px solid var(--border-line-color);
+	background: var(--footer-bg);
+    overflow: hidden;
+	.footer-container {
+		margin: 60px 20px;
+		// display: flex;
+        // justify-content: space-between;
+        display: grid;
+        gap: 40px;
+	}
+	.logo-wrapper {
+		width: 260px;
+		.logo {
+			width: 132px;
+			height: auto;
+			min-height: 40px;
+			display: flex;
+			align-items: center;
+            margin-bottom: 24px;
+			img{
+				max-width: 100%;
+			}
+		}
+		p {
+            font-family: FontBold;
+			font-weight: bold;
+			font-size: 17px;
+			line-height: 21px;
+		}
+	}
+	.link-wrapper {
+        display: grid;
+        grid-template-columns: repeat(2, 1fr);
+        gap: 10px;
+		a {
+			height: 40px;
+			line-height: 40px;
+			// width: 150px;
+			display: block;
+			color: var(--footer-color);
+			// margin-bottom: 30px;
+			overflow: hidden;
+			font-family: FontMedium;
+            text-align: center;
+		}
+	}
+}
+
+@media screen and (min-width: 768px) {
+	.footer {
+        .footer-container {
+            grid-template-columns: repeat(2, 1fr);
+        }
+		.link-wrapper {
+			display: flex;
+			flex-wrap: wrap;
+			a{
+				width: 150px;
+			}
+		}
+	}
+}
+
+@media screen and (min-width: 1200px) {
+	.footer {
+        .footer-container {
+            margin: 60px auto;
+			padding: 0 48px;
+            grid-template-columns: 0.5fr 1fr;
+        }
+	}
+}
+</style>

package/dist/components/pageComponents/index/component/SubComfirm.vue

@@ -0,0 +1,128 @@
+<!--
+ * @Author:
+ * @Date: 2020-12-14 19:41:50
+ * @LastEditTime: 2021-08-26 15:52:31
+ * @LastEditors: Lewis
+ * @Description:
+-->
+<template>
+    <div class='sub-confim'>
+        <div class='title'>{{title || innerTitle}}</div>
+        <div class='flex-v sub-conts'>
+            <div class='loading' v-if='loading'>
+                <img :src="require('../../../../assets/img/loading.png')" alt="">
+            </div>
+            <div class='title content'>{{content}}</div>
+            <div class='sub-btns'>
+                <button class='sub-btn opcHover' @click='sureFunc(0)'>{{cancelText || innerCancel}}</button>
+                <button class='sub-btn active' @click='sureFunc(1)'>{{sureText || innerSure}}</button>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+    export default {
+        name: 'SubComfirm',
+        props: {
+            loading: {
+                type: Boolean,
+                default: false
+            },
+            title: {
+                type: String,
+                default: ''
+            },
+            content: {
+                type: String,
+                default: ''
+            },
+            sureText: {
+                type: String,
+                default: ''
+            },
+            cancelText: {
+                type: String,
+                default: ''
+            }
+        },
+        data() {
+            return {
+                innerTitle: this.$t('common_base_confirmation'),
+                innerSure: this.$t('user_common_sure'),
+                innerCancel: this.$t('user_common_cancel')
+            }
+        },
+        methods: {
+            sureFunc(val) {
+                this.$emit('callFunc', val)
+            }
+        }
+    }
+</script>
+
+<style lang="less" scoped>
+    .sub-confim {
+        margin-top: -10px;
+        width:360px;
+        min-height: 220px;
+        .loading {
+            text-align: center;
+            padding-bottom: 6px;
+            img {
+                display: inline-block;
+                width: 24px;
+                height: 24px;
+                animation:around 1s  step-start infinite;
+            }
+        }
+        .title {
+            font-size: 24px;
+            font-family: Font;
+            text-align: center;
+            color: var(--text-color-secondary);
+            line-height: 24px;
+        }
+        .sub-conts {
+            margin: 28px 0 0px 0;
+            min-height: 160px;
+            max-height: 160px;
+        }
+        .content {
+            font-size: 16px;
+            line-height: 24px;
+        }
+        .sub-btn {
+            width: 124px;
+            height: 48px;
+            border: 1px solid var(--border-color-base);
+            border-radius: 6px;
+            text-align: center;
+            line-height: 48px;
+            font-size: 16px;
+            color: var(--text-color);
+        }
+        .sub-btn.active {
+            color: white;
+            background: var(--primary-bg-color);
+            margin-left: 24px;
+        }
+    }
+    @keyframes around {
+        0% {
+            transform: rotate(0deg);
+        }
+        25% {
+            transform: rotate(90deg);
+        }
+        50% {
+            transform: rotate(180deg);
+        }
+        75% {
+            transform: rotate(270deg);
+        }
+        100% {
+            transform: rotate(360deg);
+        }
+    }
+</style>

package/dist/components/pageComponents/index/component/bridge-page.vue

@@ -0,0 +1,82 @@
+<template>
+    <div class="bridge-container">
+        <!-- Header -->
+        <div class="visible-pc" v-show="showItem.includes('header')">
+			<Header/>
+		</div>
+		<div class="visible-h5" v-show="showItem.includes('header')">
+			<Top class="top" />
+		</div>
+        <!-- top -->
+        <div class='bridge-center container' v-show="showItem.includes('content')">
+            <div class='bridge-content'>
+                <div class='bridge-history'>
+                    <slot></slot>
+                </div>
+            </div>
+        </div> 
+        <div class='footer' v-show="showItem.includes('footer')">
+            <div class='bridge-footer-content'>
+                <img src="../../../../assets/component_img/index-bridge/footer-img.png" alt="">
+                <!-- <div class='line'>|</div>
+                <div>Terms of Service</div> -->
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+    export default {
+        name: 'bridge-history',
+        props: {
+            showItem: {
+                type: Array,
+                default: () => {
+                    return ['header', 'content', 'footer']
+                }
+            }
+        },
+        data() {
+            return {
+
+            }
+        }
+    }
+</script>
+
+<style lang="less" scoped>
+    .bridge-container {
+        min-height: 100vh;
+        display: flex;
+        flex-direction: column;
+        background-image: url('../../../../assets/component_img/index-bridge/index-bg.png');
+        background-position: center center;
+        background-repeat: no-repeat;
+        background-size: 100% 100%;
+        .bridge-center {
+            flex: 1;
+            overflow: auto; 
+            .bridge-content {
+                width: 705px;
+                margin: 0 auto;
+            }
+        }
+        .footer {
+            padding-bottom: 44px;
+            .bridge-footer-content {
+                display: flex;
+                justify-content: center;
+                font-size: 16px;
+                font-family: Font;
+                align-items: center;
+                img {
+                    height: 28px;
+                    width: auto;
+                }
+                .line {
+                    margin: 0 22px;
+                }
+            }
+        }
+    }
+</style>

package/dist/components/pageComponents/index/component/campaigns-item.vue

@@ -0,0 +1,129 @@
+<template>
+    <div class='p-x-trending-item'>
+        <div class='p-x-trending-item-bg' :style="{background: 'url(' + campaignsData.bg +')'}">
+            <div class='p-x-trending-item-logo' :style="{backgroundColor: campaignsData.logoColor}">
+                <span :style="{color: campaignsData.starColor || 'inhert'}">★</span>
+                <span :style="{color: campaignsData.starColor || 'inhert'}">★</span>
+            </div>
+        </div>
+        <div class='p-x-trending-item-title'>{{campaignsData.title}}</div>
+        <div class='p-x-trending-item-subtitle'>{{campaignsData.subtitle}}</div>
+        <div class='p-x-trending-item-tags'>
+            <div :class="['tag', item.active && 'active']" v-for='(item, index) in campaignsData.tags' :key='index'>{{item.name}}</div>
+        </div>
+        <div class='p-x-trending-item-mark-icon'>
+            <img :src="campaignsData.icon" alt="" />
+        </div>
+    </div>
+</template>
+
+<script>
+    export default {
+        name: 'campaigns-item',
+        props: {
+            campaignsData: {
+                type: Object,
+                default: () => {
+                    return {
+                        tags: [{
+                            name: 'whitellst',
+                            active: true
+                        }, {
+                            name: '100 Points',
+                            active: false
+                        }] 
+                    }
+                }
+            }
+        },
+        data() {
+            return {
+
+            }
+        }
+    }
+</script>
+
+<style lang="less" scoped>
+    .p-x-trending-item {
+        position: relative;
+        padding: 5px  5px 10px 5px;
+        border: 1px solid #A5FF87;
+        border-radius: 14px;
+        background: #020702;
+        transition: transform .3s;
+        &:hover {
+            transform: scale(1.07);
+        }
+        .p-x-trending-item-mark-icon {
+            position: absolute;
+            z-index: 2;
+            right: -1px;
+            bottom: -1px;
+            img {
+                border-top-left-radius: 14px;
+                border-bottom-right-radius: 14px;
+                width: 28px;
+                height: 28px;
+            }
+        }
+    }
+    .p-x-trending-item-bg {
+        padding-top: 48%;
+        position: relative;
+        background-position: center top;
+        background-repeat: no-repeat;
+        border-radius: 10px;
+        .p-x-trending-item-logo {
+            position: absolute;
+            right: 25px;
+            bottom: 0;
+            transform: translateY(50%);
+            height: 40px;
+            width: 40px;
+            border: 5px solid #020702;
+            border-radius: 50%;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            span:first-child {
+                margin-right: 4px;
+            }
+            span {
+                font-size: 10px;
+            }
+        }
+    }
+    .p-x-trending-item-title {
+        padding: 5px 10px;
+        font-size: 16px;
+        font-family: MFont;
+        color: #999999;
+    }
+    .p-x-trending-item-subtitle {
+        margin-top: 4px;
+        padding: 5px 10px;
+        font-size: 18px;
+        color: white;
+        font-family: MFont;
+    }
+    .p-x-trending-item-tags {
+        display: flex;
+        padding: 12px 10px;
+        .tag {
+            padding: 10px 17px;
+            border-radius: 5px;
+            color: #5AF8BE;
+            border: 1px solid #5AF8BE;
+            font-family: MFont;
+            font-size: 12px;
+            line-height: 1;
+            margin-right: 10px;
+            &.active {
+                border: 1px solid #A5FF87;
+                background: #A5FF87;
+                color: #000000;
+            }
+        }
+    }
+</style>

package/dist/components/pageComponents/index/component/exbang-two.vue

@@ -0,0 +1,75 @@
+<!--
+ * @Descripttion: 
+ * @version: 
+ * @Author: 
+ * @Date: 2021-04-22 15:44:32
+ * @LastEditors: Lewis
+ * @LastEditTime: 2021-08-06 00:52:27
+-->
+<template>
+    <div class='exbang-two'>
+        <div class='title'>
+            The world’s fastest decentralized trading engine based on heterogeneous dual chains.
+        </div>
+        <img src="require('../../../assets/component_img/exbang-two.png" alt="" class='center-img'>
+        <div class='btns'>
+            <button>TRADE NOW</button>
+            <button class='rbtn'>LEARN MORE</button>
+        </div>
+    </div>
+</template>
+
+<script>
+    export default {
+        
+    }
+</script>
+
+<style lang="less" scoped>
+    .exbang-two {
+        position: relative;
+        height: 100%;
+        display: flex;
+        align-content: center;
+        flex-wrap: wrap;
+        justify-content: center;
+    }
+    .btns {
+        width: 100%;
+        text-align: center;
+        margin-top: 10px;
+        button {
+            width: 256px;
+            height: 48px;
+            line-height: 48px;
+            border-radius: 24px;
+            text-align: center;
+            font-size: 16px;
+            font-family: Font;
+            
+            text-align: center;
+            color: #ffffff;
+            background: rgba(0,0,0,0.3);
+        }
+        .rbtn {
+            margin-left: 52px;
+            background: rgba(255,255,255,0.5);
+            color: #ffffff;
+        }
+    }
+    .title {
+        font-size: 32px;
+        font-family: FontSemiBold;
+        text-align: center;
+        color: #ffffff;
+        line-height: 44px;
+        width: 50%;
+        margin: 0 auto;
+    }
+    .center-img {
+        display: block;
+        width: auto;
+        height: 60vh;
+        margin: 20px auto;
+    }
+</style>

package/dist/components/pageComponents/index/component/space-item.vue

@@ -0,0 +1,119 @@
+<template>
+    <div :class="['space-item', 'space-item-' + type]" :style="{backgroundImage: 'url('+ spaceData.bg+')'}" @click='checkDetail'>
+        <img :src="spaceData.logo" alt="" class='logo'>
+        <div class='p-x-discover-item-content'>
+            <div class='p-x-discover-item-title'>{{spaceData.title}}</div>
+            <div class='p-x-discover-item-tag' v-for='(item, index) in spaceData.tags' :key='index'>{{item.name}}</div>
+            <div class='p-x-discover-item-num' v-if='type == 2'>
+                <img :src="spaceData.userIcon" alt="">
+                <span>{{spaceData.num}}</span>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+    export default {
+        name: 'space-item',
+        props: {
+            spaceData: {
+                type: Object,
+                default: () => {
+                    return {
+                        tags: []
+                    }
+                }
+            },
+            type: {
+                type: String | Number,
+                default: 1
+            }
+        },
+        data() {
+            return {
+
+            }
+        },
+        methods: {
+            checkDetail() {
+                this.$router.push({
+                    path: '/space/detail'
+                })
+            }
+        }
+    }
+</script>
+
+<style lang="less" scoped>
+    .space-item {
+        display: flex;
+        height: 100px;
+        border-radius: 10px;
+        border: 1px solid #A5FF87;
+        padding: 19px 15px;
+        cursor: pointer;
+        transition: transform .3s;
+        &:hover {
+            transform: scale(1.07);
+        }
+        .logo {
+            width: 60px;
+            height: 60px;
+        }
+        .p-x-discover-item-content {
+            padding-left: 10px;
+            display: flex;
+            flex-wrap: wrap;
+            align-content: center;
+            .p-x-discover-item-title {
+                font-size: 16px;
+                font-family: MFontMedium;
+                color: white;
+                width: 100%;
+            }
+            .p-x-discover-item-tag {
+                padding: 4px 13px;
+                border-radius: 5px;
+                background: #272B2E;
+                font-size: 12px;
+                color: white;
+                margin-top: 6px;
+            }
+        }
+        &.space-item-2 {
+            display: block;
+            height: 180px;
+            background-repeat: no-repeat;
+            background-size: 100% 100%;
+            .logo {
+                width: 90px;
+                height: 90px;
+                border: 2px solid #A5FF87;
+                border-radius: 50%;
+            }
+            .p-x-discover-item-content {
+                margin-left: 0;
+                margin-top: 12px;
+                display: block;
+                .p-x-discover-item-tag {
+                    display: inline-block;
+                    margin-right: 15px;
+                }
+                .p-x-discover-item-num {
+                    display: inline-block;
+                    margin-top: 10px;
+                    img {
+                        width: 12px;
+                        height: 12px;
+                        margin-right: 4px;
+                        font-family: MFont;
+                    }
+                    span {
+                        font-size: 12px;
+                        font-family: MFont;
+                    }
+                }
+            }
+        }
+    }
+</style>

package/dist/index.d.ts

@@ -1,6 +1,7 @@
 import * as cmsComponents from './components';
 import * as cmsRouter from './router';
 import * as cmsStore from './store';
+import * as localStorageConstant from './libs/localStorageConstant';
 /**
  * 设置事件事务中心
  * @param {Object} events - 事件对象
@@ -19,6 +20,7 @@ export { cmsStore };
 export * as api from './api';
 export * from './utils';
 export * from './api';
+export { localStorageConstant };
 /**
  * 初始化 UDX CMS 相关功能
  * 此方法可用于执行 UDX CMS 的初始化逻辑