FE_bankTeaching/src/components/needBefore/index.vue

<template>
    <!-- 这个组件需求变更比较大，但无疑是非常优秀的一个组件。比如一个业务需要的只是电脑录入的两个页面，这个组件可以做到把其他模块页面都关了，也可以做到提示这个模块不需要做，
    也可以做到提示做这个模块之前需要做什么，然后经理说这些功能都不需要。现在这个组件先鸟尽弓藏吧，反正以后如果要这些需求了启用这个组件就行了。 -->
    <!-- <div class="flex mt-8 ml-12 text-xl title"> -->
    <div v-if="!this.unNeed" class="h-full w-full flex items-stretch">
        <h1 class="leading-loose cursor-pointer text-center h-48 w-full bg-red-100 hover:bg-red-400 text-5xl antialiased hover:underline items-center" @click="goto">请完成上一个步骤!</h1>
    </div>
    <div v-else class="h-full w-full flex">
        <h1 class="leading-loose cursor-pointer text-center h-48 w-full bg-blue-100 hover:bg-blue-400 text-5xl antialiased hover:underline items-center" @click="goto2">您无需完成该操作!</h1>
    </div>
</template>

<script>

const obj = {
    // 'consumerClient': '/counter/list/manage/consumerClient',
    // 'currentAccount/openAccount': '/counter/list/manage/currentAccount',
    // 'currentAccount/deposit': '/counter/list/manage/currentAccount'
    'consumerClient': '客户信息 -> 个人客户信息建立',
    'corporateClient': '客户信息 -> 公司客户信息建立',
    'currentAccount/openAccount': '活期业务 -> 开户',
    'currentAccount/deposit': '活期业务 -> 存款',
    'currentAccount/withdrawal': '活期业务 -> 取款',
    'currentAccount/transferAccounts': '活期业务 -> 转账',
    'currentAccount/settle': '活期业务 -> 结清',
    'currentAccount/Cancell': '活期业务 -> 销户',
    'timeDeposit/openAccount': '整存整取 -> 开户',
    'timeDeposit/deposit': '整存整取 -> 存款',
    'timeDeposit/withdrawal': '整存整取 -> 取款',
    'timeDeposit/deposit': '整存整取 -> 存款',
    'business/openAccount': '公司业务 -> 开户'
}

import {mapGetters} from 'vuex'
export default {
    props: {
        moduleName: {
            type: String,
            require: true
        },
        unNeed: {
            type: Boolean,
            default: false
        }
    },
    created() {
        if(this.unNeed) {
            // this.$message({
            //     message: '您无需完成该操作！',
            //     type: 'info'
            // });
        }else {
            this.$message({
                message: '请先完成' + obj[this.moduleName],
                type: 'warning'
            });
        }
        
    },
    methods: {
        goto() {
            // this.$router.push(obj[this.moduleName])
            this.$message({
                message: '请先完成' + obj[this.moduleName],
                type: 'warning'
            });
        },
        goto2() {
            this.$message({
                message: '您无需完成该操作！',
                type: 'warning'
            });
        },
    },
    computed: {
        ...mapGetters({
            needsModule: 'system/needsModule',
        })
    }
}
</script>

<style scoped lang='scss'>
</style>