<template>
    <div style="display: inline-block;">
        <el-button v-if="type=='button'" type="info" @click="handleClick">帮助文档</el-button>
        <a v-if="type!='button'" :href="docPath" class="help-link" target="_blank">帮助文档</a>
    </div>
</template>

<script>
export default {
    name: "ApDocLink",
    props: {
        code: {
            type: String,
            required: true
        },
        type: {
            type: String,
            default: 'button',
        }
    },
    data() {
        let docPath = location.origin + "/#pm/doc?code=" + this.code
        return {
            docPath: docPath
        }
    },
    methods: {
        handleClick() {
            let routeData = this.$router.resolve({
                path: '/pm/doc', query: {code: this.code}
            });
            window.open(routeData.href, '_blank');
        }
    }
}
</script>

<style scoped>
.help-link {
    color: #0066cc;
    text-decoration: none;
    font-weight: normal;
    transition: color 0.3s ease;
    text-decoration: underline;
}

.help-link:hover {
    color: #004499; /* 悬停时颜色变深 */
}
</style>
