EnforcementCode-2.0/zdxt-web-client/zdxt-enforcement-code-app/fordelete/non-law/enterpriseScanPreview.vue

<template>
    <div class="home app_content">

        <span class="tohome" @click="toEnforceHomeView"><i class="van-badge__wrapper van-icon van-icon-wap-home-o"></i></span>
        <!-- 中间 -->
        <div class="warp_body">
            <div class="white-body">
                <div class="tabs">
                    <ul>
                        <li v-for='(item,index) in data.list' :key="index" @click='check(index)' :class="{ active: index === data.TabId }">
                            <span v-if="index === 0"> {{item.title}}</span>
                            <span v-else-if="index === 1 && data.warningInfo.warningLevel ==0" class="warn-tab"> {{item.title}}</span>
                            <span v-else-if="index === 1 && data.warningInfo.warningLevel==1" class="warn-tab level1"> {{item.title}}</span>
                            <span v-else-if="index === 1 && data.warningInfo.warningLevel==2" class="warn-tab level2"> {{item.title}}</span>
                            <span v-else-if="index === 1 && data.warningInfo.warningLevel==3" class="warn-tab level3"> {{item.title}}</span>
                            <span v-else-if="index === 1" class="warn-tab"> {{item.title}}</span>
                        </li>
                    </ul>
                </div>
                <div v-if="data.TabId == 0">
                    <enterpriseBaseInfo :enterpriseNumber="data.enterpriseNumber"></enterpriseBaseInfo>
                </div>
                <div v-if="data.TabId == 1">
                    <enterpriseWarningInfo :enterpriseNumber="data.enterpriseNum"></enterpriseWarningInfo>
                </div>

            </div>
        </div>
    </div>
    <div class="addinfo" @click="toSign">登记</div>
</template>

<script setup name="Home">
    import {getEnterpriseMerchantAuthorization} from '@/api/Home';
    import {queryEarlyWarning} from '../../api/enforce';
    import {getEnterpriseInformation} from '../../api/enterprise'
    import enterpriseBaseInfo from './enterpriseBaseInfo.vue'
    import enterpriseWarningInfo from './enterpriseWarningInfo.vue'

    import {Tab, Tabs} from 'vant';

    const {useCommon} = $globalStore;
    const router = useRouter();
    //路由参数
    const route = useRoute();
    let freshMap = reactive({
        refreshLoad: false, // 是否刷新
        listLoading: false, // 是否加载中
        listFinished: false, // 是否加载完成标识
    });
    const data = reactive({
        enterpriseNumber: "",
        enterpriseAddress: "",
        warningInfo: {},
        enterpriseNum:"",
        searchParam: {
          enterpriseNumber:"",
          warnType: 0,
        },
        status: 0,
        TabId: 0,
        list: [
            {
                title: '企业画像',
                value: '0'
            },
            {
                title: '历史活动',
                value: '1'
            },
        ],
        reason: route?.query?.reason,
        checkCss: route?.query?.checkCss,
        isNoScan: route?.query?.isNoScan,
    });

    const check = (index) => {
        console.log("点击切换tab", index);
        data.TabId = index;
    };

    // 返回首页
    const toEnforceHomeView = () => {
        router.push({
            path: "/enforceHome",
        });
    };

    const toSign = () => {
        router.push({
            path: "/non-sign",
            query: {
                enterpriseNumber: data.enterpriseNumber,
                reason: data.reason,
                checkCss: data.checkCss,
                isNoScan: data.isNoScan,
            }
        });
    };

    onMounted(() => {
      console.log(route?.query?.enterpriseNumber);
        getEnterpriseInformation(route?.query?.enterpriseNumber, success => {
            if (success.success) {
                data.searchParam.enterpriseNumber = success.data.enterpriseNumber;
                data.searchParam.warnType = 1;
                //加密统一信用代码数据
                // data.enterpriseNumber = success.data.salt;   // 之前因为统一信用码重复, 所以用的盐, 现在设了唯一键了.
                data.enterpriseNumber = success.data.enterpriseNumber;
                //未加密
                data.enterpriseNum = success.data.enterpriseNumber;
                useCommon.SET_USER_ENTERPRISE_NUMBER(success.data.enterpriseNumber);
            }
        }, error => {})
    })
</script>

<style lang="less" scoped>
    .home {
        display: flex;
        flex-direction: column;
        height: 100%;
        overflow: hidden;
        background-color: #ebf3fb;

        .warp_body {
            position: relative;
            background-image: linear-gradient(to bottom, #ebf3fb, transparent);
        }

        .white-body {
            margin: 0 3%;
            width: 94%;
            min-height: 100vh;
            background-color: #fff;
            border-radius: 0.27rem;
        }
    }

    .tohome {
        position: absolute;
        top: 1.25%;
        right: 5%;
        font-size: 0.5rem;
    }

    .tabs {
        padding: 3% 3% 0;
        width: 94%;
        height: 1.25rem;
        box-sizing: content-box;
    }

    .tabs ul {
        display: flex;
        width: 100%;
        height: 100%;
        font-size: 0.4rem;
        line-height: 1.25rem;
        text-align: center;
        align-content: center;
        justify-items: center;
    }

    .tabs ul li {
        float: left;
        width: 50%;
        height: 100%;
    }

    .tabs ul li span {
        display: block;
        width: 100%;
        height: 100%;
        color: #4aa1f9;
        background: url("../../assets/images/tab_bg1_1.png") no-repeat;
        background-size: 100% 100%;
    }

    .tabs ul li.active span {
        background: url("../../assets/images/tab_bg1.png") no-repeat;
        background-size: 100% 100%;
        color: #fff;
    }

    .tabs ul li span.warn-tab {
        margin-left: -2%;
        background: url("../../assets/images/tab_bg.png") no-repeat;
        background-size: 100% 100%;
    }

    .tabs ul li.active span.warn-tab {
        background: url("../../assets/images/tab_bg_1.png") no-repeat;
        background-size: 100% 100%;
        color: #fff;
    }

    .tabs ul li span.level1 {
        background: url("../../assets/images/tab_shine_red.gif") no-repeat !important;
        background-size: 100% 100% !important;
        color: #fff !important;
    }

    .tabs ul li span.level2 {
        background: url("../../assets/images/tab_shine_org.gif") no-repeat !important;
        background-size: 100% 100% !important;
        color: #fff !important;
    }

    .tabs ul li span.level3 {
        background: url("../../assets/images/tab_shine_yel.gif") no-repeat !important;
        background-size: 100% 100% !important;
        color: #fff !important;
    }

    .addinfo {
        position: absolute;
        bottom: 3%;
        right: 2%;
        z-index: 99999;
        width: 1.5rem;
        height: 1.5rem;
        background-color: #1367fe;
        border-radius: 50%;
        box-shadow: 0 0 0.27rem #1367fe;
        color: #fff;
        font-size: 0.4rem;
        text-align: center;
        vertical-align: middle;
        padding-top: 0.45rem;
        box-sizing: border-box;
    }

</style>