udxcms 1.0.1

package/dist/components/basicComponents/AdsBanner.vue

@@ -0,0 +1,148 @@
+<!--
+ * @Author: Sneed
+ * @Date: 2020-10-23 22:54:26
+ * @LastEditTime: 2020-11-30 18:22:48
+ * @LastEditors: Lewis
+ * @Description: 
+-->
+<!--
+ * @Author: Sneed
+-->
+<template>
+    <swiper class="banner" ref="mySwiper" :options="swiperOptions" :style="{height}">
+        <div class='banner-container' v-if='isSolt'>
+            <swiper-slide class="banner-list" v-for='(item, index) in swiperList' :key='index'>
+                <div class='banner-img' :style="{backgroundImage: 'url('+ item.img +')'}" @click='goUrl(item.linkUrl)'></div> 
+            </swiper-slide>
+        </div>
+        <div class='banner-container' v-else>
+            <slot></slot>
+        </div>
+        <div class="swiper-pagination" slot="pagination" v-if='showPage'></div>
+    </swiper>
+</template>
+
+<script>
+    import { Swiper, SwiperSlide, directive } from 'vue-awesome-swiper'
+    import 'swiper/css/swiper.css'
+    export default {
+        name: 'carrousel',
+        props: {
+            bannerList_h5: {
+                type: Array,
+                default: () => []
+            },
+            bannerList: {
+                type: Array,
+                default: () => []
+            },
+            height: {
+                type: String,
+                default: '480px'
+            },
+            screenWidth: {
+                type: Number,
+                defulat: 0
+            },
+            showPage: {
+                type: Boolean,
+                default: true
+            },
+            isSolt: {
+                type: Boolean,
+                default: false
+            }
+        },
+        components: {
+            Swiper,
+            SwiperSlide
+        },
+        directives: {
+            swiper: directive
+        },
+        data() {
+            return {
+            }
+        },
+        computed: {
+            swiperList() {
+                return this.bannerList_h5.length == 0 ? this.bannerList : (this.screenWidth < 789 ? this.bannerList_h5 : this.bannerList)
+            },
+            swiper() {
+                return this.$refs.mySwiper.$swiper
+            },
+            swiperOptions() {
+                return {
+                    pagination: {
+                        el: '.swiper-pagination'
+                    },
+                    paginationType: 'custom',
+                    paginationCustomRender: function ( swiper, current, total ) {
+                        var _html = '';
+                        for ( var i = 1; i <= total; i++ ) {
+                            if ( current == i ) {
+                                _html += '<span class="swiper-pagination-customs swiper-pagination-customs-active"></span>';
+                            } else {
+                                _html += '<span class="swiper-pagination-customs"></span>';
+                            }
+                        }
+                        return _html; //返回所有的页码html
+                    },
+                    progressbarFillClass : 'my-pagination-progressbar-fill',
+                    watchOverflow: true
+                }
+            }
+        },
+        created() {
+        },
+        mounted() {
+            this.swiper.slideTo(0, 1000, false)
+        },
+        methods: {
+            goUrl(url) {
+                url && window.open(url, 'ads')
+            }
+        }
+    }
+</script>
+<style lang="less" scoped>
+    .banner {
+        width: 100%;
+        height: 480px;
+        .banner-list {
+            width: 100%;
+            height: 100%;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            .banner-img {
+                height: 100%;
+                width: 100%;
+                background-position: center;
+                background-size: cover;
+                background-repeat: no-repeat;
+            }
+        }
+    }
+    
+</style>
+<style lang="less">
+    .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active {
+        display: inline-block;
+        width: 40px;
+        height: 4px;
+        border-radius: 0px;
+        opacity: 1;
+    }
+    .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet{
+        width: 4px;
+        height: 4px;
+        opacity: 1;
+        margin: 0 10px;
+        background: #ffffff;
+        border-radius: 0;
+    }
+    .swiper-pagination-fraction, .swiper-pagination-custom, .swiper-container-horizontal > .swiper-pagination-bullets {
+        bottom: 35px;
+    }
+</style>

package/dist/components/basicComponents/AreaSelect.vue

@@ -0,0 +1,30 @@
+<template>
+    <div >
+        <div :class="{'header-nav':true,active:active}">
+            
+        </div>
+    </div>
+</template>
+<script>
+import _ from 'lodash';
+export default {
+    name: "Header",
+    props: {
+    },
+    computed: {
+
+    },
+    data() {
+        return {
+            active: false,
+            show: true
+        }
+    },
+    created() {
+    },
+    methods: {
+    }
+}
+</script>
+<style lang="less" scoped>
+</style>

package/dist/components/basicComponents/BaseMenu.vue

@@ -0,0 +1,130 @@
+<template>
+    <div class="base-menu">
+        <!-- <router-link
+            v-for="item in menus"
+            :key="item.id"
+            :to="item.click_url"
+            class="menu-item"
+            >{{ item.bar_name }}</router-link
+        > -->
+        <a v-for="item in menus" :key="item.id"  class="menu-item router-link-exact-active" @click='goUrl(item.click_url)'>
+            {{ item.bar_name }}
+        </a>
+      <a v-if="isMerchant" class="menu-item router-link-exact-active" @click='goUrl("/marketing/merchant")'>
+        {{$t('marketing_navigation_commission_sharing')}}
+      </a>
+    </div>
+</template>
+
+<script>
+import {isMerchant} from "../../api/common";
+
+export default {
+    name: "BaseMenu",
+    data () {
+      return {
+        isMerchant: false
+      }
+    },
+    props: {
+        // 菜单类型：user,portfolio
+        menuType: {
+            type: String,
+            default: "user",
+        },
+        // 没业务需求，暂时不支持修改，后续可扩展。
+        mode: {
+            type: String,
+            default: "vertical",
+        },
+    },
+    computed: {
+        account() {
+            return this.$store.getters.account || "";
+        },
+        token() {
+            return this.$store.state.user.token;
+        },
+        accountIsCustody() {
+            return this.$store.getters.accountIsCustody;
+        },
+        allMenus() {
+            return this.$store.state.navigation[this.menuType];
+        },
+        menus() {
+            // type
+            // COMMON("公共"),
+            // MANAGED("托管"),
+            // UNMANAGED("非托管"),
+            if (!this.account) return [];
+            let result = this.allMenus.filter((item) => item.type === "COMMON");
+            if (this.accountIsCustody) {
+                result = result.concat(
+                    this.allMenus.filter((item) => item.type === "MANAGED")
+                );
+            } else {
+                result = result.concat(
+                    this.allMenus.filter((item) => item.type === "UNMANAGED")
+                );
+            }
+            return result.sort((a, b) => a.sort - b.sort);
+        }
+    },
+    watch: {
+      account: {
+        immediate: true,
+        handler (val) {
+          if (val && this.menuType === 'portfolio') {
+            this.checkIsMerchant()
+          } else {
+            this.isMerchant = false
+          }
+        }
+      }
+    },
+    methods: {
+        goUrl(path) {
+            console.log('path:', path)
+            sessionStorage.setItem('portfoilType', this.menuType)
+            this.$store.commit('setMenuChange')
+            this.$router.push(path);
+        },
+        async checkIsMerchant() {
+          const data = await isMerchant({},{
+            chain_id: this.$store.state.chainId,
+            layer: "L2",
+          }).then(res => res.data).catch(e => false);
+          this.isMerchant = data;
+        }
+    }
+};
+</script>
+
+<style lang="less">
+.base-menu {
+    // background: var(--popup-bg);
+    // z-index: 999;
+    // border-radius: var(--border-radius-base);
+    // box-shadow: var(--box-shadow-base);
+    // overflow: hidden;
+
+    .menu-item {
+        height: var(--menu-item-height);
+        line-height: var(--menu-item-height);
+        font-size: var(--menu-item-font-size);
+        padding: 0 16px;
+        display: flex;
+        align-items: center;
+        color: var(--text-color);
+        white-space: nowrap;
+        &:hover {
+            color: var(--link-color);
+            background-color: var(--select-item-bg);
+        }
+    }
+    .menu-span {
+        width: 100%;
+        height: 100%;
+    }
+}
+</style>

package/dist/components/basicComponents/BasePopup.vue

@@ -0,0 +1,27 @@
+<template>
+    <div class="base-popup">
+        <slot />
+    </div>
+</template>
+
+<script>
+/**
+ * 基础弹窗组件，支持插槽数据。
+ */
+export default {
+    name: "BasePopup",
+};
+</script>
+
+<style lang="less">
+.base-popup {
+    background: var(--popup-bg);
+    z-index: 999;
+    border-radius: var(--border-radius-base);
+    box-shadow: var(--box-shadow-base);
+    overflow: hidden;
+
+    position: absolute;
+    left: 0;
+}
+</style>

package/dist/components/basicComponents/CustomDate.vue

@@ -0,0 +1,117 @@
+<template>
+    <span>{{ showDate }}</span>
+</template>
+
+<script>
+import dayjs from "dayjs";
+export default {
+    name: "CustomDate",
+    components: {
+    },
+    props: {
+        // 展示类型：1：月日  2：月日 时分  3：年月日  4：年月日 时分  5年月日 时分秒
+        type: {
+            type: Number,
+            default: () => 3,
+        },
+        date: {
+            type: String,
+            default: () => null,
+        },
+        lang: {
+            type: String,
+            default: () => '',
+        },
+    },
+    data() {
+        return {
+        }
+    },
+    computed: {
+        storeLang() {
+            return this.$store.state.language
+        },
+        // https://wiki.everylink.ai/pages/viewpage.action?pageId=16450914
+        showDate() {
+            if (this.date) {
+                let res = '';
+                let langRes = this.lang || this.storeLang;
+                const monthArr = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];
+                const date = this.date;
+                const year = dayjs.utc(date).year();
+                let month = dayjs.utc(date).month();
+                let day = dayjs.utc(date).date();
+                let hour = dayjs.utc(date).hour();
+                let minute = dayjs.utc(date).minute();
+                const enMonth = monthArr[month];
+                month = month < 10 ? ('0' + month) : month;
+                day = day < 10 ? ('0' + day) : day;
+                hour = hour < 10 ? ('0' + hour) : hour;
+                minute = minute < 10 ? ('0' + minute) : minute;
+                switch (this.type) {
+                    case 1:
+                        {
+                            if (['zh_CN', 'ja_JP'].includes(langRes)) {
+                                res = `${month}月${day}日`
+                            } else {
+                                res = `${enMonth} ${day}`
+                            }
+                        }
+                        break;
+                    case 2:
+                        {
+                            
+                            if (['zh_CN', 'ja_JP'].includes(langRes)) {
+                                // res = dayjs.utc(date).format('YYYY-MM月DD日 HH:mm').split('-')[1];
+                                res = `${month}月${day}日 ${hour}:${minute}`
+                            } else {
+                                res = `${enMonth} ${day},${hour}:${minute} ${hour >= 12 ? 'PM' : 'AM'}`
+                            }
+                        }
+                        break;
+                    case 3:
+                        if (['zh_CN', 'ja_JP'].includes(langRes)) {
+                            res = dayjs.utc(date).format('YYYY年MM月DD日');
+                        } else {
+                            res = dayjs.utc(date).format('MM/DD/YYYY');
+                        }
+                        break;
+                    case 4:
+                        {
+                            if (['zh_CN', 'ja_JP'].includes(langRes)) {
+                                res = dayjs.utc(date).format('YYYY年MM月DD日 HH:mm');
+                            } else {
+                                res = `${enMonth} ${day},${year},${hour}:${minute} ${hour >= 12 ? 'PM' : 'AM'}`
+                            }
+                        }
+                        break;
+                    case 5:
+                        res = dayjs.utc(date).format('YYYY-MM-DD HH:mm:ss');
+                        break;
+                        
+                    default:
+                        res = dayjs.utc(date).format('YYYY-MM-DD HH:mm:ss');
+                        break;
+                }
+                return res;
+            }
+            return ''
+        }
+    },
+    watch: {
+    },
+    mounted() {
+
+    },
+
+    methods: {
+
+    },
+
+};
+</script>
+
+
+<style lang="less" scoped>
+
+</style>