sannongzixunwang_web/components/home/foot.vue

<template>
    <footer class="index_foot">
        <div class="index_foot_name_box">
            <div class="index_foot_name">YOUQING</div>
            <div class="index_foot_name">友情链接</div>
            <div class="index_foot_name">LIANJIE</div>		
        </div>
        <div class="foot_img_box"> 
            <a :href="item.url" v-for="(item, index) in bottomLink" target="_blank">
                <img :src="item.logo_url" alt="">
            </a>
        </div>
        <div class="foot_frind_box">
            <span>友情链接</span>	 		
            <div>
                <a :href="item.url" v-for="(item, index) in bottomText" :key="index" target="_blank">{{ item.title }}</a>	
            </div>
        </div>
        <div class="call_us_box">
            <span v-for="(item, index) in bottomMenu" :key="index">
                <NuxtLink :to="{ path: `/specialList/${item.id}` }" target="_blank" v-if="item.type == 1">
                    {{ item.name }}
                </NuxtLink>
                <NuxtLink :to="{ path: `/speciaArticle/${item.id}` }" target="_blank" v-if="item.type == 0">
                    {{ item.name }}
                </NuxtLink>
            </span>
        </div>
        <div class="foot_text_box">
           <!-- <p>{{ bottomBase.statistics_onetext }} <a :href="'http://' + bottomBase.statistics_twourl">中农兴业</a> {{ bottomBase.statistics_twotext }}</p> -->
           <p>{{ bottomBase.statistics_onetext }} <a :href="bottomBase.record_number_url" target="_blank">中农兴业</a> {{ bottomBase.statistics_twotext }}</p>
            <p>{{ bottomBase.organizer }} <a :href="currentDomain" target="_blank">三农资讯网</a> {{ currentDomainUrl }} 版权所有。</p>
            <!-- <p><img :src="bottomBase.icp_number_img"><a :href="'http://' + bottomBase.statistics_twourl">{{ bottomBase.record_number }}</a> <a :href="'http://' + bottomBase.icp_number_url">{{ bottomBase.icp_number }}</a> </p> -->
            <p><a :href="bottomBase.record_number_url" target="_blank">{{ bottomBase.record_number }}</a> &nbsp;&nbsp; <img :src="bottomBase.icp_number_img"><a :href="bottomBase.icp_number_url" target="_blank">{{ bottomBase.icp_number }}</a> </p>
            <p>{{ bottomBase.email }}</p>
            <p>{{ bottomBase.company_address }}</p>
            <p>{{ bottomBase.contact_number }}</p>
        </div>
        <div class="foot_logo_out" >
            <a :href="'http://' + bottomBase.company_url" :title="bottomBase.company_name" target="_blank">
                <img :src="bottomBase.project_logo" class="floatLogoLeft" :alt="bottomBase.company_name">
            </a>
            <a :href="'http://' + bottomBase.project_url" :title="bottomBase.project_name" target="_blank">
                <img :src="bottomBase.company_logo" class="floatLogoRight" :alt="bottomBase.project_name">
            </a>
        </div>
        <div class="foot_last_img_box">
            <a :href="item.url" v-for="(item, index) in bottomphoto"  target="_blank">
                <img :src="item.logo_url" alt="">
            </a>
        </div>
 		</footer>	
</template>

<script setup>
//获得底部基本信息 start---------------------------------------->

//1.获得友情链接图片
const bottomLink = ref([])
async function getModelData1() {
    const { data: mkdata, error: mkdataError } =  requestData('/web/selectWebsiteLinks', {
        method: 'GET',
        query: {
            'type':1,
            'num':7,
        },
    });
    if (mkdataError.value) {
        //console.error('模块1数据上部分请求失败！', mkdataError.value);
    } else {
        if (mkdata.value) {
            bottomLink.value = mkdata.value.data;
        }
    }
}
getModelData1();
//2.获得友情链接文字
const bottomText = ref([])
async function getModelData2() {
    const { data: mkdata, error: mkdataError } =  requestData('/web/selectWebsiteLinks', {
        method: 'GET',
        query: {
            'type':2,
            'num':8,
        },
    });
    if (mkdataError.value) {
        //console.error('模块1数据上部分请求失败！', mkdataError.value);
    } else {
        if (mkdata.value) {
            bottomText.value = mkdata.value.data;
        }
    }
}
getModelData2();
//3.获得底部图片
const bottomphoto = ref([])
async function getModelData3() {
    const { data: mkdata, error: mkdataError } =  requestData('/web/selectWebsiteLinks', {
        method: 'GET',
        query: {
            'type':3,
            'num':4,
        },
    });
    if (mkdataError.value) {
        //console.error('模块1数据上部分请求失败！', mkdataError.value);
    } else {
        if (mkdata.value) {
            bottomphoto.value = mkdata.value.data;
        }
    }
}
getModelData3();
//4.获得底部导航
const bottomMenu = ref([])
async function getModelData4() {
    const { data: mkdata, error: mkdataError } =  requestData('/web/getWebsiteFooterCategory', {
        method: 'GET',
        query: {
        },
    });
    if (mkdataError.value) {
        //console.error('模块1数据上部分请求失败！', mkdataError.value);
    } else {
        if (mkdata.value) {
            bottomMenu.value = mkdata.value.data;
        }
    }
}
getModelData4();
//5.获得底部基本信息
const bottomBase = ref({})
async function getModelData5() {
    const { data: mkdata, error: mkdataError } =  requestData('/web/getWebsiteFootInfo', {
        method: 'GET',
        query: {
        },
    });
    if (mkdataError.value) {
        //console.error('模块1数据上部分请求失败！', mkdataError.value);
    } else {
        if (mkdata.value) {
            bottomBase.value = mkdata.value.data.website_foot;
        }
    }
}
getModelData5();

//6.获取当前域名
const currentDomain = ref('')
const currentDomainUrl = ref('')

const getDomain = () => {
    if (process.client) {
        const url = new URL(window.location.href)
        currentDomainUrl.value = url.hostname // 获取域名
        currentDomain.value = url.origin //协议和域名
    }
}
getDomain();
//获得底部基本信息 end---------------------------------------->
</script>

<style lang="less" scoped>
    @import '@/assets/css/foot.less';
</style>