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

<template>
    <div class="home app_content">
        <!-- 导航栏 -->
        <!-- <div class="header_body">
      <header-nav
                :slefBack="true"
                @goBack="goBack"
                :titelText="`企业详情`"
      >
            </header-nav>
        </div>-->

        <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' @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/enterprise';
    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: "",
        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 boutiqueAttr = reactive({
        columnNum: 4,
        itemClass: "boutique_item",
        goodsCradclass: "boutique-crad",
    }); // 商品卡片展示

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

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

    const toSign = () => {
        router.push({
            path: "/sign",
            query: {
                enterpriseNumber: data.enterpriseNumber,
                // isNoScan: false,

                reason: data.reason,
                checkCss: data.checkCss,
                isNoScan: data.isNoScan,
            }
        });
    };

    const toEnterpriseBaseInfo = async () => {
        router.push({
            path: "/enterpriseBaseInfo",
            query: {
                enterpriseNumber: data.enterpriseNumber
            }
        });
    };

    const toEnterpriseWarningInfo = async () => {
        router.push({
            path: "/enterpriseWarningInfo",
            query: {
                enterpriseNumber: data.enterpriseNumber
            }
        });
    };

    const toRegistrationListView = async () => {
        router.push({
            path: "/enterprise/registrationList",
        });
    }
    const toComplaintView = async () => {
        router.push({
            path: "/enterprise/complaint",
        });
    }

    // 触底加载
    const onLoad = () => {
        // recommendGoods(true);
    };

    onMounted(() => {
        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);
                //查询企业历史执法案件
                queryEarlyWarning(data.searchParam, success => {
                    if (success.data.length > 0) {
                        data.warningInfo = success.data[0];
                    }
                }, error => {
                })
            }
        }, error => {

        })
        // 没看懂这一部分的意义, 但是影响到查询性能了, 先干掉, 并把里面的复制挪到上面去
        // getEnterpriseMerchantAuthorization({merchantTel: useCommon.phonenumber}, success => {
        //     if (success.data != null && success.data.length > 0) {
        //         useCommon.SET_USER_ENTERPRISE_NUMBER(success.data[0].enterpriseNumber);
        //     }
        // }, error => {
        // })
    })
    // 返回
    const goBack = () => {
        router.go(-1);
    };
</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>