<template>
    <a
        v-if="myLinkFlag === 3"
        :href="filter_link(link)"
        :target="target">
        <slot></slot>
    </a>
    <router-link
        v-else-if="myLinkFlag === 2"
        :to="link"
        :target="target">
        <slot></slot>
    </router-link>
    <div v-else>
        <slot></slot>
    </div>
</template>

<script>
import { serializeQueryParams } from 'nimble-lib';
import filterLink from '../../../Filters/filterLink';

export default {

    name: 'NuLink',

    props: {
        to: {},
        target: {
            default: ''
        }
    },

    data() {
        return {
            link: '' // 1为div;2为路由;3为a标签
        };
    },

    computed: {
        /**
         * // 1为div;2为路由;3为a标签
         * @returns {Object|String}
         */
        myLinkFlag() {
            let linkFlag = 0; // 0为没处理；1为div;2为路由;3为a标签
            let isALink = false;
            let _to = this.to;
            if (_to === undefined || _to === null) {
                linkFlag = 1;
            }
            let vue = this.constructor;
            let isRouter = !!(vue.component('router-link') || vue.component('routerLink') || vue.component('RouterLink')) || false;
            if (_to instanceof Object) {
                if (_to.path || (!_to.path && !_to.name)) {
                    _to.path = formatUrl(_to.path);
                    isALink = getIsAlink(_to.path) || !isRouter;
                    if (isALink) {
                        let _query = (_to.path && serializeQueryParams(_to.query, /\?/.test(_to.path) ? '&' : '?')) || '';
                        _to = _to.path + _query;
                    }
                }
            } else if (typeof _to === 'string') {
                _to = formatUrl(_to);
                isALink = getIsAlink(_to) || !isRouter;
            } else {
                isALink = true;
                _to = _to || '';
            }
            if (!linkFlag) {
                if (isALink) {
                    linkFlag = 3;
                } else {
                    linkFlag = 2;
                }
            }
            this.link = _to;
            return linkFlag;
            /**
             * 获取是否为a链接
             * @param {string} url url
             * @returns {boolean}
             */
            function getIsAlink(url) {
                let res = false;
                if (!url || /https?:\/\//.test(url)) {
                    res = true;
                }
                return res;
            }
            /**
             * 格式化url
             * @param {string} url url
             * @returns {string}
             */
            function formatUrl(url) {
                url = (url || '') + '';
                let _origin = new RegExp(location.origin.replace(/([/:.])/g, '\\$1'));
                url = url.replace(_origin, url);
                return url;
            }
        }
    },
    methods: {
        filter_link(...args) {
            let vue = this.constructor;
            let _filterLink = vue.filter('filter_link') || filterLink;
            this.filter_link = _filterLink;
            return _filterLink(...args);
        }
    }
};
</script>
