<template>
|
<div class="bannerbg chuany-width100 h-[450px] flex items-center">
|
<div
|
class="content text-white font-['Source_Han_Sans_SC'] font-bold text-[50px] leading-[80px] tracking-[11%] capitalize ">
|
<p class="pb-3">川印集团——</p>
|
<p>专注品质，成就卓越</p>
|
</div>
|
</div>
|
<div class="w-100 chuany-font14 chuany-text-black coreshop-bg-white pt-16 mb-16">
|
<p class="font-['Source_Code_Pro'] font-semibold text-[36px] leading-[50px] tracking-[5%] text-center align-middle capitalize" style="color:#000;">建设中的川印集团“二期工厂”</p>
|
<div class="flex items-center justify-center w-[100%]">
|
<el-image style="width: 1077px; height: 548px" :src="dev1" class=" content mt-10 mb-16"></el-image>
|
</div>
|
</div>
|
<div class="w-100 chuany-font14 chuany-text-black pt-6 mb-16">
|
<p class="font-['Source_Code_Pro'] font-semibold text-[36px] leading-[50px] tracking-[5%] text-center align-middle capitalize" style="color:#000;">舒适、惬意的入闱环境</p>
|
<div class="flex items-center justify-center w-[100%]">
|
<el-image :src="dev2" style="width: 1077px; height: 640px" class=" content mt-12 mr-auto"></el-image>
|
</div>
|
<p class="text-center font-['Source_Han_Sans_SC'] font-normal text-[20px] leading-[27.2px] tracking-[4%] capitalize text-[#696969] mt-6">客户接待中心</p>
|
<div class="flex items-center justify-center w-[100%]">
|
<el-image :src="dev3" style="width: 1077px; height: 490.64px" class=" content mt-12 mr-auto"></el-image>
|
</div>
|
<p class="text-center font-['Source_Han_Sans_SC'] font-normal text-[20px] leading-[27.2px] tracking-[4%] capitalize text-[#696969] mt-6">客户接待中心</p>
|
<div class="flex items-center justify-center w-[100%]">
|
<el-image :src="dev4" style="width: 1077px; height: 549.92px" class=" content mt-12 mr-auto"></el-image>
|
</div>
|
<p class="text-center font-['Source_Han_Sans_SC'] font-normal text-[20px] leading-[27.2px] tracking-[4%] capitalize text-[#696969] mt-6">国家统一考试试卷印制车间</p>
|
<div class="flex items-center justify-center w-[100%]">
|
<el-image :src="dev5" style="width: 1077px; height: 932.88px" class=" content mt-12 mr-auto"></el-image>
|
</div>
|
<p class="text-center font-['Source_Han_Sans_SC'] font-normal text-[20px] leading-[27.2px] tracking-[4%] capitalize text-[#696969] mt-6">涉密文件资料印制车间</p>
|
</div>
|
<div class="w-100 chuany-font14 chuany-text-black coreshop-bg-white pt-16 pb-16">
|
<p class="font-['Source_Code_Pro'] font-semibold text-[36px] leading-[50px] tracking-[5%] text-center align-middle capitalize" style="color:#000;">传统合院与现代建筑的融合 每一栋建筑都是网红艺术品</p>
|
<div class="flex items-center justify-center w-[100%]">
|
<el-image :src="dev6" style="width: 1077px; height: 689.34px" class=" content mt-12 mr-auto"></el-image>
|
</div>
|
<p class="text-center font-['Source_Han_Sans_SC'] font-normal text-[20px] leading-[27.2px] tracking-[4%] capitalize text-[#696969] mt-6">入闱专家活动中心</p>
|
<div class="flex items-center justify-center w-[100%]">
|
<el-image :src="dev7" style="width: 1077px; height: 628.4px" class=" content mt-12 mr-auto"></el-image>
|
</div>
|
<p class="text-center font-['Source_Han_Sans_SC'] font-normal text-[20px] leading-[27.2px] tracking-[4%] capitalize text-[#696969] mt-6">入闱服务大厅</p>
|
<div class="w-[1077px] flex flex-wrap items-center justify-between" style="margin: 0 auto;">
|
<div v-for="(item, index) in images" :key="index">
|
<el-image :src="item.url" style="width: 334.28px; height: 273.55px" class=" content mt-12 mr-auto"></el-image>
|
<p class="text-center font-['Source_Han_Sans_SC'] font-normal text-[20px] leading-[27.2px] tracking-[4%] capitalize text-[#696969] mt-3">{{ item.name }}</p>
|
</div>
|
</div>
|
</div>
|
<div class="w-100 chuany-font14 chuany-text-black pt-16 mb-16">
|
<p class="font-['Source_Code_Pro'] font-semibold text-[36px] leading-[50px] tracking-[5%] text-center align-middle capitalize" style="color:#000;">毗邻黑龙滩天然氧吧 100亩超大入闱场所</p>
|
<p class="w-[977px] font-['Source_Han_Sans_SC'] font-normal text-[20px] leading-[38px] tracking-[4%] text-center capitalize text-[#696969] p-10" style="margin: 0 auto;">垂钓、厨艺、咖啡、蔬菜、四季水果自由采摘；
|
游泳、健身、瑜伽、棋牌、KTV、书画室，配套齐全；
|
篮球、网球、羽毛球、乒乓球、绿道，应有尽有；
|
中央空调、地暖、新风、净水配套所有房间和设施！
|
清新、清净、清爽，
|
把入闱变成度假！</p>
|
<div class="w-[1077px] flex flex-wrap items-center justify-between" style="margin: 0 auto;">
|
<div v-for="(item, index) in imageskaoshi" :key="index">
|
<el-image :src="item.url" :class="item.url.includes('1')?'w-[1077px] h-[427px]':'w-[526.12px] h-[303.57px]'" class=" content mt-10 mr-auto"></el-image>
|
<p class="text-center font-['Source_Han_Sans_SC'] font-normal text-[20px] leading-[27.2px] tracking-[4%] capitalize text-[#696969] mt-3">{{ item.name }}</p>
|
</div>
|
</div>
|
|
</div>
|
</template>
|
|
<script setup>
|
import usbanner from '@/static/img/usbanner.png'
|
import contentimg from '@/static/img/content-img.png'
|
const { $meth } = getCurrentInstance().appContext.config.globalProperties
|
import { articleInfo } from '@/api/text.js'
|
const { $route } = getCurrentInstance().appContext.config.globalProperties
|
import $store from "@/store/index.js";
|
|
import dev1 from '@/static/img/dev1.png'
|
import dev2 from '@/static/img/dev2.png'
|
import dev3 from '@/static/img/dev3.png'
|
import dev4 from '@/static/img/dev4.png'
|
import dev5 from '@/static/img/dev5.png'
|
import dev6 from '@/static/img/dev6.png'
|
import dev7 from '@/static/img/dev7.png'
|
import devs1 from '@/static/img/devs1.png'
|
import devs2 from '@/static/img/devs2.png'
|
import devs3 from '@/static/img/devs3.png'
|
import devs4 from '@/static/img/devs4.png'
|
import devs5 from '@/static/img/devs5.png'
|
import devs6 from '@/static/img/devs6.png'
|
import devs7 from '@/static/img/devs7.png'
|
import devs8 from '@/static/img/devs8.png'
|
import devs9 from '@/static/img/devs9.png'
|
import kaoshi1 from '@/static/img/kaoshi1.png'
|
import kaoshi2 from '@/static/img/kaoshi2.png'
|
import kaoshi3 from '@/static/img/kaoshi3.png'
|
import kaoshi4 from '@/static/img/kaoshi4.png'
|
import kaoshi5 from '@/static/img/kaoshi5.png'
|
|
const data = reactive({
|
activeName: "1",
|
gettab4: {}
|
})
|
const images = ref([{
|
url: devs1,
|
name: "电梯厅"
|
}, {
|
url: devs2,
|
name: "楼层走廊"
|
},
|
{
|
url: devs3,
|
name: "棋牌室"
|
},{
|
url: devs4,
|
name: "自助餐厅"
|
},{
|
url: devs5,
|
name: "带队领导套房"
|
},{
|
url: devs6,
|
name: "入闱老师住房"
|
},{
|
url: devs7,
|
name: "健身房"
|
}, {
|
url: devs8,
|
name: "瑜伽室"
|
}, {
|
url: devs9,
|
name: "书画室"
|
}
|
])
|
const imageskaoshi = ref([{
|
url: kaoshi1,
|
name: "考试命题中心（一）"
|
}, {
|
url: kaoshi2,
|
name: "考试命题中心（二）"
|
},
|
{
|
url: kaoshi3,
|
name: "考试命题中心（三）"
|
},{
|
url: kaoshi4,
|
name: "考试命题中心（四）"
|
},{
|
url: kaoshi5,
|
name: "考试命题中心（五）"
|
}
|
])
|
onMounted(() => {
|
|
articleInfos(1)
|
});
|
const handleClick = (el) => {//tab切换
|
console.log("el:", el.props.name)
|
data.gettab4 = {}
|
if (el.props.name == 1 || el.props.name == 4) {
|
articleInfos(el.props.name)
|
}
|
|
}
|
const articleInfos = (el) => {
|
articleInfo({ id: el }).then(res => {
|
if (res.status == true) {
|
data.gettab4 = res.data.contentBody
|
|
//
|
} else {
|
$message({
|
message: res.msg,
|
grouping: true,
|
type: 'error',
|
})
|
}
|
})
|
|
}
|
</script>
|
<style scoped>
|
.demo-tabs>.el-tabs__content {
|
padding: 32px;
|
color: #6b778c;
|
font-size: 32px;
|
font-weight: 600;
|
}
|
|
.jianjietab p {
|
margin-top: 15px;
|
margin-bottom: 15px;
|
line-height: 2.5em;
|
}
|
|
.phonetab {
|
padding: 100px;
|
}
|
|
.bannerbg {
|
background:
|
linear-gradient(90deg, #0e61ce 10%, rgba(108, 160, 255, 0.5) 100%),
|
url('@/static/img/usbanner.png') center/cover no-repeat;
|
}
|
|
.my-icon {
|
cursor: pointer;
|
}
|
|
.my-icon:hover {
|
color: #fff;
|
/* 滑过变蓝色，自定义颜色值 */
|
}
|
</style>
|
