Commit 173265e5 authored by lei's avatar lei

2025.06.18修改

parent ae9bc87c
...@@ -2,15 +2,26 @@ ...@@ -2,15 +2,26 @@
<template> <template>
<header class="header"> <header class="header">
<div <div class="banner" @mouseover="stopCarousel" @mouseout="startCarousel">
class="banner"
@mouseover="stopCarousel"
@mouseout="startCarousel"
>
<div class="banner-bg"> <div class="banner-bg">
<el-carousel height="520px" :interval="carouselInterval" arrow="never" :loop="true" indicator-position="inside"> <el-carousel
height="520px"
:interval="carouselInterval"
arrow="never"
:loop="true"
indicator-position="inside"
>
<el-carousel-item v-for="item in bannerList" :key="item.id"> <el-carousel-item v-for="item in bannerList" :key="item.id">
<div style="width: 100%;height: 100%;background-size: cover;background-repeat: no-repeat;background-position: center;" :style="{backgroundImage:`url(${baseApi}${item.url})`}"></div> <div
style="
width: 100%;
height: 100%;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
"
:style="{ backgroundImage: `url(${baseApi}${item.url})` }"
></div>
</el-carousel-item> </el-carousel-item>
</el-carousel> </el-carousel>
</div> </div>
...@@ -22,7 +33,7 @@ ...@@ -22,7 +33,7 @@
<div v-if="logo" class="logo"> <div v-if="logo" class="logo">
<img :src="logo" alt="Logo" class="logo-image" /> <img :src="logo" alt="Logo" class="logo-image" />
</div> </div>
<div class="search-bar" v-show="show"> <div class="search-bar" v-show="show">
<div class="search-input"> <div class="search-input">
<el-input <el-input
...@@ -46,7 +57,7 @@ ...@@ -46,7 +57,7 @@
> >
</div> --> </div> -->
</div> </div>
<HorizontalMenu :activeIndex="activeIndex" class="header-menu"/> <HorizontalMenu :activeIndex="activeIndex" class="header-menu" />
</div> </div>
</header> </header>
</template> </template>
...@@ -70,7 +81,7 @@ export default { ...@@ -70,7 +81,7 @@ export default {
}, },
bannerImage: { bannerImage: {
type: String, type: String,
default:require("~/static/images/banner.png"), default: require("~/static/images/banner.png"),
}, },
logo: { logo: {
type: String, type: String,
...@@ -87,7 +98,7 @@ export default { ...@@ -87,7 +98,7 @@ export default {
isHover: false, isHover: false,
searchKeyword: "", searchKeyword: "",
keywords: this.initialKeywords.slice(), // Add your keywords here keywords: this.initialKeywords.slice(), // Add your keywords here
searchCon: '', searchCon: "",
total: 0, total: 0,
carouselInterval: 5000, carouselInterval: 5000,
query: { query: {
...@@ -95,42 +106,40 @@ export default { ...@@ -95,42 +106,40 @@ export default {
pageSize: 10, pageSize: 10,
searchCon: null, searchCon: null,
}, },
bannerList:[], bannerList: [],
}; };
}, },
created(){ created() {
this.bannerData(); this.bannerData();
this.pvAdd(); this.pvAdd();
this.uvAdd(); this.uvAdd();
}, },
methods: { methods: {
stopCarousel() { stopCarousel() {
this.carouselInterval = 0; this.carouselInterval = 0;
}, },
startCarousel() { startCarousel() {
this.carouselInterval = 5000; this.carouselInterval = 5000;
}, },
handleSearch() { handleSearch() {
if(this.query.searchCon){ if (this.query.searchCon) {
this.$router.push({ this.$router.push({
path: `/Search?search=${this.query.searchCon}`, path: `/Search?search=${this.query.searchCon}`,
}); });
}else{ } else {
this.$message({ this.$message({
message: "请输入要查询的内容", message: "请输入要查询的内容",
type: "error", type: "error",
}); });
return return;
} }
}, },
keywordClick(keyword){ keywordClick(keyword) {
this.$router.push({ this.$router.push({
path: `/Search?search=${keyword}`, path: `/Search?search=${keyword}`,
}); });
}, },
async bannerData(){ async bannerData() {
try { try {
let that = this; let that = this;
const response = await sendRequest( const response = await sendRequest(
...@@ -142,24 +151,18 @@ export default { ...@@ -142,24 +151,18 @@ export default {
console.error("Error fetching data:", error); console.error("Error fetching data:", error);
} }
}, },
async pvAdd(){ async pvAdd() {
try { try {
let that = this; let that = this;
const response = await sendRequest( const response = await sendRequest(`/business/screening/pv`, "get");
`/business/screening/pv`,
"get"
);
} catch (error) { } catch (error) {
console.error("Error fetching data:", error); console.error("Error fetching data:", error);
} }
}, },
async uvAdd(){ async uvAdd() {
try { try {
let that = this; let that = this;
const response = await sendRequest( const response = await sendRequest(`/business/screening/uv`, "get");
`/business/screening/uv`,
"get"
);
} catch (error) { } catch (error) {
console.error("Error fetching data:", error); console.error("Error fetching data:", error);
} }
...@@ -182,17 +185,17 @@ export default { ...@@ -182,17 +185,17 @@ export default {
height: 520px; height: 520px;
// background: url(~/static/images/banner.png) no-repeat center; // background: url(~/static/images/banner.png) no-repeat center;
// background-size: cover; // background-size: cover;
.ysjszx{ .ysjszx {
position: absolute; position: absolute;
right: 0; right: 0;
bottom: -4px; bottom: -4px;
} }
.banner-bg{ .banner-bg {
position: absolute; position: absolute;
width: 100%; width: 100%;
height: 100%; height: 100%;
left:0; left: 0;
top:0; top: 0;
right: 0; right: 0;
bottom: 0; bottom: 0;
z-index: 0; z-index: 0;
...@@ -206,7 +209,7 @@ export default { ...@@ -206,7 +209,7 @@ export default {
} }
.logo { .logo {
width: 245px; width: 350px;
height: 73px; height: 73px;
position: absolute; position: absolute;
top: 30px; top: 30px;
...@@ -230,7 +233,7 @@ export default { ...@@ -230,7 +233,7 @@ export default {
overflow: hidden; overflow: hidden;
span { span {
cursor: pointer; cursor: pointer;
color:#fff; color: #fff;
&:first-child { &:first-child {
cursor: context-menu; cursor: context-menu;
} }
...@@ -262,39 +265,37 @@ export default { ...@@ -262,39 +265,37 @@ export default {
font-size: 24px; font-size: 24px;
} }
::v-deep .el-input__inner { ::v-deep .el-input__inner {
background-color: rgb(1 82 147 / 30%); background-color: rgb(1 82 147 / 30%);
background-image: none; background-image: none;
border: 1px solid rgb(1 82 147 / 30%); border: 1px solid rgb(1 82 147 / 30%);
height: 50px; height: 50px;
line-height: 50px; line-height: 50px;
color:#fff; color: #fff;
&::-webkit-input-placeholder { &::-webkit-input-placeholder {
color: #fff; color: #fff;
} }
} }
} }
.header-menu{ .header-menu {
position: absolute; position: absolute;
bottom:0; bottom: 0;
left:0; left: 0;
right: 0; right: 0;
} }
::v-deep .el-carousel__indicators--horizontal{ ::v-deep .el-carousel__indicators--horizontal {
bottom: 86px; bottom: 86px;
z-index: 77; z-index: 77;
} }
::v-deep .el-carousel__button{ ::v-deep .el-carousel__button {
width: 8px; width: 8px;
height: 8px; height: 8px;
border-radius: 50%; border-radius: 50%;
} }
::v-deep .el-carousel__indicator--horizontal{ ::v-deep .el-carousel__indicator--horizontal {
padding: 12px 6px; padding: 12px 6px;
} }
.inner{ .inner {
height: 50%; height: 50%;
} }
</style> </style>
...@@ -16,11 +16,11 @@ export default { ...@@ -16,11 +16,11 @@ export default {
link: [ link: [
// { rel: 'stylesheet', href: 'https://a.amap.com/jsapi_demos/static/demo-center/css/demo-center.css' }, // { rel: 'stylesheet', href: 'https://a.amap.com/jsapi_demos/static/demo-center/css/demo-center.css' },
{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }, { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' },
{ rel: 'stylesheet', href: 'https://cdn.jsdelivr.net/npm/swiper/swiper-bundle.min.css' }, { rel: 'stylesheet', href: '/css/swiper-bundle.min.css' },
], ],
script: [ script: [
{ src: 'https://cdn.jsdelivr.net/npm/swiper/swiper-bundle.min.js', body: true }, { src: 'js/swiper-bundle.min.js', body: true },
{ {
type: 'text/javascript', type: 'text/javascript',
src: '/js/sj.js', src: '/js/sj.js',
...@@ -31,7 +31,7 @@ export default { ...@@ -31,7 +31,7 @@ export default {
src: '/js/echarts.min.js', src: '/js/echarts.min.js',
body: true, body: true,
}, },
{ src: '/js/font.js', body: true }, { src: '/js/font.js', body: true },
// { src: '/js/qrcode.js', body: true }, // { src: '/js/qrcode.js', body: true },
// { src: '~plugins/amap.js', ssr: false } // { src: '~plugins/amap.js', ssr: false }
...@@ -79,14 +79,15 @@ export default { ...@@ -79,14 +79,15 @@ export default {
}, },
env: { env: {
VUE_APP_File_VIEW: "https://cfkyw-package.oss-cn-beijing.aliyuncs.com", VUE_APP_File_VIEW: "https://cfkyw-package.oss-cn-beijing.aliyuncs.com",
API_URL: process.env.API_URL || '/prod-api', // API_URL: "http://192.168.2.16:12051/chkq" || '/prod-api',
API_URL: "https://www.cfkyw.com.cn/prod-api" || '/prod-api',
GLOBAL_VARIABLE: { GLOBAL_VARIABLE: {
company:{ company: {
name:'赤峰矿业(集团)有限责任公司', name: '赤峰矿业(集团)有限责任公司',
phone:'(0476)567 8669', phone: '(0476)567 8669',
email:'50215148258@qq.com', email: '50215148258@qq.com',
address:'松山区长胜路与玉龙大街交叉口南100米', address: '松山区长胜路与玉龙大街交叉口南100米',
contacts:'吕先生' contacts: '吕先生'
} }
} }
}, },
......
<template> <template>
<div class="news cfkqbg"> <div class="news cfkqbg">
<BackToTopButton /> <BackToTopButton />
<Header :activeIndex="99"/> <Header :activeIndex="99" />
<div class="m2zrCon m2pubCon background-attachment"> <div class="m2zrCon m2pubCon background-attachment">
<div class="container"> <div class="container">
<div class="inner"> <div class="inner">
...@@ -28,9 +28,11 @@ ...@@ -28,9 +28,11 @@
<div class="news-detail-file" v-if="content.file"> <div class="news-detail-file" v-if="content.file">
相关文件: 相关文件:
<p v-for="(file, index) in content.file" :key="index"> <p v-for="(file, index) in content.file" :key="index">
<a :href="`/prod-api${file}`" target="_blank">{{ <a
content.fileName[index] :href="`https://cfkyw-package.oss-cn-beijing.aliyuncs.com/${file}`"
}}</a> target="_blank"
>{{ content.fileName[index] }}</a
>
</p> </p>
<el-divider></el-divider> <el-divider></el-divider>
...@@ -96,6 +98,13 @@ export default { ...@@ -96,6 +98,13 @@ export default {
"get" "get"
); );
this.content = response.data; this.content = response.data;
// 进行字符串替换操作
if (response.data.chkqCaContent) {
this.content.chkqCaContent = response.data.chkqCaContent.replace(
/\/prod-api/g,
"https://cfkyw-package.oss-cn-beijing.aliyuncs.com/"
);
}
this.pageTitle = response.data.chkqCaTitle; this.pageTitle = response.data.chkqCaTitle;
} catch (error) { } catch (error) {
console.error("Error fetching data:", error); console.error("Error fetching data:", error);
...@@ -152,4 +161,4 @@ export default { ...@@ -152,4 +161,4 @@ export default {
width: 1250px; width: 1250px;
} }
} }
</style> </style>
\ No newline at end of file
<template> <template>
<div class="news cfkqbg"> <div class="news cfkqbg">
<BackToTopButton /> <BackToTopButton />
<Header :activeIndex="99"/> <Header :activeIndex="99" />
<div class="m2zrCon m2pubCon background-attachment"> <div class="m2zrCon m2pubCon background-attachment">
<div class="container"> <div class="container">
<div class="inner"> <div class="inner">
<div class="news-breadcrumb"> <div class="news-breadcrumb">
<el-breadcrumb separator-class="el-icon-arrow-right"> <el-breadcrumb separator-class="el-icon-arrow-right">
<el-breadcrumb-item :to="{ path: '/' }" <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
>首页</el-breadcrumb-item
>
<el-breadcrumb-item>有色金属产业链</el-breadcrumb-item> <el-breadcrumb-item>有色金属产业链</el-breadcrumb-item>
<el-breadcrumb-item>{{ pageTitle }}</el-breadcrumb-item> <el-breadcrumb-item>{{ pageTitle }}</el-breadcrumb-item>
</el-breadcrumb> </el-breadcrumb>
</div> </div>
</div> </div>
<div class="inner news-con"> <div class="inner news-con">
<div class="news-detail-title">{{ content.ippTitle }}</div> <div class="news-detail-title">{{ content.ippTitle }}</div>
<el-divider></el-divider> <el-divider></el-divider>
<div v-html="content.ippContent" class="detail-content"></div> <div v-html="content.ippContent" class="detail-content"></div>
...@@ -24,9 +21,11 @@ ...@@ -24,9 +21,11 @@
<div class="news-detail-file" v-if="content.file"> <div class="news-detail-file" v-if="content.file">
相关文件: 相关文件:
<p v-for="(file, index) in content.file" :key="index"> <p v-for="(file, index) in content.file" :key="index">
<a :href="`/prod-api${file}`" target="_blank">{{ <a
content.fileName[index] :href="`https://cfkyw-package.oss-cn-beijing.aliyuncs.com/${file}`"
}}</a> target="_blank"
>{{ content.fileName[index] }}</a
>
</p> </p>
<el-divider></el-divider> <el-divider></el-divider>
...@@ -92,6 +91,13 @@ export default { ...@@ -92,6 +91,13 @@ export default {
"get" "get"
); );
this.content = response.data; this.content = response.data;
// 进行字符串替换操作
if (response.data.chkqCaContent) {
this.content.chkqCaContent = response.data.chkqCaContent.replace(
/\/prod-api/g,
"https://cfkyw-package.oss-cn-beijing.aliyuncs.com/"
);
}
this.pageTitle = response.data.ippTitle; this.pageTitle = response.data.ippTitle;
} catch (error) { } catch (error) {
console.error("Error fetching data:", error); console.error("Error fetching data:", error);
...@@ -128,49 +134,46 @@ export default { ...@@ -128,49 +134,46 @@ export default {
} }
.news-detail-title { .news-detail-title {
margin-bottom: 20px; margin-bottom: 20px;
} }
.detailbro-info{ .detailbro-info {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
.news-detail-share { .news-detail-share {
font-size: 16px; font-size: 16px;
margin-bottom: 0px; margin-bottom: 0px;
span{ span {
display: inline-block; display: inline-block;
margin-right: 10px; margin-right: 10px;
} }
a{ a {
display: inline-block; display: inline-block;
padding: 0; padding: 0;
margin: 0 4px; margin: 0 4px;
height: 26px; height: 26px;
width: 26px; width: 26px;
} }
#wx{ #wx {
background: url(~/static/images/cf_bshare_icon01.png) no-repeat center; background: url(~/static/images/cf_bshare_icon01.png) no-repeat center;
} }
#wb{ #wb {
background: url(~/static/images/cf_bshare_icon02.png) no-repeat center; background: url(~/static/images/cf_bshare_icon02.png) no-repeat center;
} }
#kj{ #kj {
background: url(~/static/images/cf_bshare_icon03.png) no-repeat center; background: url(~/static/images/cf_bshare_icon03.png) no-repeat center;
} }
} }
.detail-content p { .detail-content p {
font-size: 16px; font-size: 16px;
width: 100%; width: 100%;
} }
} }
.el-divider--horizontal{ .el-divider--horizontal {
margin-top: 10px; margin-top: 10px;
} }
.news-con{ .news-con {
box-shadow: 3px 3px 6px 2px rgba(0, 0, 0, .2); box-shadow: 3px 3px 6px 2px rgba(0, 0, 0, 0.2);
padding:60px; padding: 60px;
} }
@media (min-width: 1200px) { @media (min-width: 1200px) {
.inner { .inner {
...@@ -182,8 +185,7 @@ export default { ...@@ -182,8 +185,7 @@ export default {
width: 1250px; width: 1250px;
} }
} }
.cfkqbg{ .cfkqbg {
background: none; background: none;
} }
</style>
</style>
\ No newline at end of file
<template> <template>
<div class="news cfkqbg"> <div class="news cfkqbg">
<BackToTopButton /> <BackToTopButton />
<Header :activeIndex="99"/> <Header :activeIndex="99" />
<div class="m2zrCon m2pubCon background-attachment"> <div class="m2zrCon m2pubCon background-attachment">
<div class="container"> <div class="container">
<div class="inner"> <div class="inner">
<div class="news-breadcrumb"> <div class="news-breadcrumb">
<el-breadcrumb separator-class="el-icon-arrow-right"> <el-breadcrumb separator-class="el-icon-arrow-right">
<el-breadcrumb-item :to="{ path: '/' }" <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
>首页</el-breadcrumb-item
>
<el-breadcrumb-item>矿业研发招商政策</el-breadcrumb-item> <el-breadcrumb-item>矿业研发招商政策</el-breadcrumb-item>
<el-breadcrumb-item>{{ pageTitle }}</el-breadcrumb-item> <el-breadcrumb-item>{{ pageTitle }}</el-breadcrumb-item>
</el-breadcrumb> </el-breadcrumb>
</div> </div>
</div> </div>
<div class="inner news-con"> <div class="inner news-con">
<div class="news-detail-title">{{ content.ippTitle }}</div> <div class="news-detail-title">{{ content.ippTitle }}</div>
<!-- <div class="news-detail-share"> <!-- <div class="news-detail-share">
<span>来源:{{ content.newsOrigin }}</span> <span>来源:{{ content.newsOrigin }}</span>
...@@ -29,9 +26,11 @@ ...@@ -29,9 +26,11 @@
<div class="news-detail-file" v-if="content.file"> <div class="news-detail-file" v-if="content.file">
相关文件: 相关文件:
<p v-for="(file, index) in content.file" :key="index"> <p v-for="(file, index) in content.file" :key="index">
<a :href="`/prod-api${file}`" target="_blank">{{ <a
content.fileName[index] :href="`https://cfkyw-package.oss-cn-beijing.aliyuncs.com/${file}`"
}}</a> target="_blank"
>{{ content.fileName[index] }}</a
>
</p> </p>
<el-divider></el-divider> <el-divider></el-divider>
...@@ -97,6 +96,13 @@ export default { ...@@ -97,6 +96,13 @@ export default {
"get" "get"
); );
this.content = response.data; this.content = response.data;
// 进行字符串替换操作
if (response.data.ippContent) {
this.content.ippContent = response.data.ippContent.replace(
/\/prod-api/g,
"https://cfkyw-package.oss-cn-beijing.aliyuncs.com/"
);
}
this.pageTitle = response.data.ippTitle; this.pageTitle = response.data.ippTitle;
} catch (error) { } catch (error) {
console.error("Error fetching data:", error); console.error("Error fetching data:", error);
...@@ -133,49 +139,46 @@ export default { ...@@ -133,49 +139,46 @@ export default {
} }
.news-detail-title { .news-detail-title {
margin-bottom: 20px; margin-bottom: 20px;
} }
.detailbro-info{ .detailbro-info {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
.news-detail-share { .news-detail-share {
font-size: 16px; font-size: 16px;
margin-bottom: 0px; margin-bottom: 0px;
span{ span {
display: inline-block; display: inline-block;
margin-right: 10px; margin-right: 10px;
} }
a{ a {
display: inline-block; display: inline-block;
padding: 0; padding: 0;
margin: 0 4px; margin: 0 4px;
height: 26px; height: 26px;
width: 26px; width: 26px;
} }
#wx{ #wx {
background: url(~/static/images/cf_bshare_icon01.png) no-repeat center; background: url(~/static/images/cf_bshare_icon01.png) no-repeat center;
} }
#wb{ #wb {
background: url(~/static/images/cf_bshare_icon02.png) no-repeat center; background: url(~/static/images/cf_bshare_icon02.png) no-repeat center;
} }
#kj{ #kj {
background: url(~/static/images/cf_bshare_icon03.png) no-repeat center; background: url(~/static/images/cf_bshare_icon03.png) no-repeat center;
} }
} }
.detail-content p { .detail-content p {
font-size: 16px; font-size: 16px;
width: 100%; width: 100%;
} }
} }
.el-divider--horizontal{ .el-divider--horizontal {
margin-top: 10px; margin-top: 10px;
} }
.news-con{ .news-con {
box-shadow: 3px 3px 6px 2px rgba(0, 0, 0, .2); box-shadow: 3px 3px 6px 2px rgba(0, 0, 0, 0.2);
padding:60px; padding: 60px;
} }
@media (min-width: 1200px) { @media (min-width: 1200px) {
.inner { .inner {
...@@ -187,8 +190,7 @@ export default { ...@@ -187,8 +190,7 @@ export default {
width: 1250px; width: 1250px;
} }
} }
.cfkqbg{ .cfkqbg {
background: none; background: none;
} }
</style>
</style>
\ No newline at end of file
<template> <template>
<div class="news cfkqbg"> <div class="news cfkqbg">
<BackToTopButton /> <BackToTopButton />
<Header :activeIndex="6"/> <Header :activeIndex="6" />
<!-- <QRCodeComponent text="https://www.example.com" /> --> <!-- <QRCodeComponent text="https://www.example.com" /> -->
<div class="m2zrCon m2pubCon background-attachment"> <div class="m2zrCon m2pubCon background-attachment">
<div class="container"> <div class="container">
<div class="inner"> <div class="inner">
<div class="news-breadcrumb"> <div class="news-breadcrumb">
<el-breadcrumb separator-class="el-icon-arrow-right"> <el-breadcrumb separator-class="el-icon-arrow-right">
<el-breadcrumb-item :to="{ path: '/' }" <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
>首页</el-breadcrumb-item <el-breadcrumb-item>新闻资讯</el-breadcrumb-item>
> <el-breadcrumb-item>{{ pageTitle }}</el-breadcrumb-item>
<el-breadcrumb-item>新闻资讯</el-breadcrumb-item> </el-breadcrumb>
<el-breadcrumb-item>{{ pageTitle }}</el-breadcrumb-item>
</el-breadcrumb>
</div>
</div> </div>
</div>
<div class="inner news-con"> <div class="inner news-con">
<div class="news-detail-title">{{ content.newsTitle }}</div> <div class="news-detail-title">{{ content.newsTitle }}</div>
<div class="detailbro-info "> <div class="detailbro-info">
<div class="news-detail-share"> <div class="news-detail-share">
<span>发布时间:{{ content.releaseTime }}</span> <span>发布时间:{{ content.releaseTime }}</span>
<span>来源:{{ content.newsOrigin }}</span> <span>来源:{{ content.newsOrigin }}</span>
...@@ -27,11 +24,24 @@ ...@@ -27,11 +24,24 @@
</div> </div>
<div class="news-detail-share"> <div class="news-detail-share">
<span>分享到:</span> <span>分享到:</span>
<a title="分享到QQ好友" id="wx" class="cup bshare-qqim" @click="shareQQ();"></a> <a
<a title="分享到新浪微博" id="wb" class="cup bshare-sinaminiblog" @click="shareWb();"></a> title="分享到QQ好友"
<a title="分享到QQ空间" id="kj" class="cup bshare-qzone" @click="shareQQzone();"></a> id="wx"
class="cup bshare-qqim"
@click="shareQQ()"
></a>
<a
title="分享到新浪微博"
id="wb"
class="cup bshare-sinaminiblog"
@click="shareWb()"
></a>
<a
title="分享到QQ空间"
id="kj"
class="cup bshare-qzone"
@click="shareQQzone()"
></a>
</div> </div>
<!-- <span>分享:<span @click="shareQQ">qq</span></span> --> <!-- <span>分享:<span @click="shareQQ">qq</span></span> -->
</div> </div>
...@@ -41,9 +51,11 @@ ...@@ -41,9 +51,11 @@
<div class="news-detail-file" v-if="content.file"> <div class="news-detail-file" v-if="content.file">
相关文件: 相关文件:
<p v-for="(file, index) in content.file" :key="index"> <p v-for="(file, index) in content.file" :key="index">
<a :href="`/prod-api${file}`" target="_blank">{{ <a
content.fileName[index] :href="`https://cfkyw-package.oss-cn-beijing.aliyuncs.com/${file}`"
}}</a> target="_blank"
>{{ content.fileName[index] }}</a
>
</p> </p>
<el-divider></el-divider> <el-divider></el-divider>
...@@ -57,7 +69,7 @@ ...@@ -57,7 +69,7 @@
<script> <script>
import axios from "axios"; import axios from "axios";
import { shareQQzone,qq } from "~/utils/tyler"; import { shareQQzone, qq } from "~/utils/tyler";
import CustomHeader from "~/components/CustomHeader.vue"; import CustomHeader from "~/components/CustomHeader.vue";
// import QRCodeComponent from "~/components/QRCodeComponent.vue"; // import QRCodeComponent from "~/components/QRCodeComponent.vue";
import sendRequest from "~/utils/request.js"; import sendRequest from "~/utils/request.js";
...@@ -103,15 +115,20 @@ export default { ...@@ -103,15 +115,20 @@ export default {
this.pageView(this.$route.query.id); this.pageView(this.$route.query.id);
}, },
methods: { methods: {
shareQQzone(){ shareQQzone() {
shareQQzone({title:this.pageTitle}) shareQQzone({ title: this.pageTitle });
}, },
shareQQ(){ shareQQ() {
qq({title:this.pageTitle}) qq({ title: this.pageTitle });
}, },
shareWb(){ shareWb() {
let currUrl = window.location.href; let currUrl = window.location.href;
window.open('http://service.weibo.com/share/share.php?url=' + currUrl + '&title=' + this.pageTitle); window.open(
"http://service.weibo.com/share/share.php?url=" +
currUrl +
"&title=" +
this.pageTitle
);
}, },
async fetchData() { async fetchData() {
try { try {
...@@ -121,6 +138,10 @@ export default { ...@@ -121,6 +138,10 @@ export default {
"get" "get"
); );
this.content = response.data; this.content = response.data;
this.content.newsContent = response.data.newsContent.replace(
/\/prod-api/g,
"https://cfkyw-package.oss-cn-beijing.aliyuncs.com"
);
this.pageTitle = response.data.newsTitle; this.pageTitle = response.data.newsTitle;
} catch (error) { } catch (error) {
console.error("Error fetching data:", error); console.error("Error fetching data:", error);
...@@ -157,49 +178,46 @@ export default { ...@@ -157,49 +178,46 @@ export default {
} }
.news-detail-title { .news-detail-title {
margin-bottom: 20px; margin-bottom: 20px;
} }
.detailbro-info{ .detailbro-info {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
.news-detail-share { .news-detail-share {
font-size: 16px; font-size: 16px;
margin-bottom: 0px; margin-bottom: 0px;
span{ span {
display: inline-block; display: inline-block;
margin-right: 10px; margin-right: 10px;
} }
a{ a {
display: inline-block; display: inline-block;
padding: 0; padding: 0;
margin: 0 4px; margin: 0 4px;
height: 26px; height: 26px;
width: 26px; width: 26px;
} }
#wx{ #wx {
background: url(~/static/images/cf_bshare_icon01.png) no-repeat center; background: url(~/static/images/cf_bshare_icon01.png) no-repeat center;
} }
#wb{ #wb {
background: url(~/static/images/cf_bshare_icon02.png) no-repeat center; background: url(~/static/images/cf_bshare_icon02.png) no-repeat center;
} }
#kj{ #kj {
background: url(~/static/images/cf_bshare_icon03.png) no-repeat center; background: url(~/static/images/cf_bshare_icon03.png) no-repeat center;
} }
} }
.detail-content p { .detail-content p {
font-size: 16px; font-size: 16px;
width: 100%; width: 100%;
} }
} }
.el-divider--horizontal{ .el-divider--horizontal {
margin-top: 10px; margin-top: 10px;
} }
.news-con{ .news-con {
box-shadow: 3px 3px 6px 2px rgba(0, 0, 0, .2); box-shadow: 3px 3px 6px 2px rgba(0, 0, 0, 0.2);
padding:60px; padding: 60px;
} }
@media (min-width: 1200px) { @media (min-width: 1200px) {
.inner { .inner {
...@@ -211,8 +229,7 @@ export default { ...@@ -211,8 +229,7 @@ export default {
width: 1250px; width: 1250px;
} }
} }
.cfkqbg{ .cfkqbg {
background: none; background: none;
} }
</style>
</style>
\ No newline at end of file
<template> <template>
<div class="goods-list"> <div class="goods-list">
<BackToTopButton /> <BackToTopButton />
<Header :activeIndex="5"/> <Header :activeIndex="5" />
<CommonDialog <CommonDialog
:show="dialogVisible" :show="dialogVisible"
@close-dialog="handleCloseDialog" @close-dialog="handleCloseDialog"
:omDemandName="omDemandName" :omDemandName="omDemandName"
/> />
<div class="wrapper"> <div class="wrapper">
<h1 style="font-size: 16px;"><span style="cursor: pointer;" @click="herfSup">供求信息</span> > 产品列表>{{ categoryName }}</h1> <h1 style="font-size: 16px">
<span style="cursor: pointer" @click="herfSup">供求信息</span> >
产品列表>{{ categoryName }}
</h1>
<article> <article>
<section class="infomation"> <section class="infomation">
<div class="table"> <div class="table">
<div class="search"> <div class="search">
<!-- <div class="input-search"> <!-- <div class="input-search">
<el-input placeholder="请输入产品名称" v-model="searchForm.name" class="input-with-select" @keyup.enter.native="handleSearch(searchForm.productName)" prefix-icon="el-icon-search"> <el-input placeholder="请输入产品名称" v-model="searchForm.name" class="input-with-select" @keyup.enter.native="handleSearch(searchForm.productName)" prefix-icon="el-icon-search">
...@@ -50,7 +51,11 @@ ...@@ -50,7 +51,11 @@
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="二级类目" prop="industryLe2" v-if="searchForm.industryLe1"> <el-form-item
label="二级类目"
prop="industryLe2"
v-if="searchForm.industryLe1"
>
<el-select <el-select
v-model="searchForm.industryLe2" v-model="searchForm.industryLe2"
placeholder="二级类目" placeholder="二级类目"
...@@ -65,7 +70,6 @@ ...@@ -65,7 +70,6 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button <el-button
type="primary" type="primary"
...@@ -74,24 +78,30 @@ ...@@ -74,24 +78,30 @@
@click="handleQuery" @click="handleQuery"
>搜索</el-button >搜索</el-button
> >
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery" <el-button
icon="el-icon-refresh"
size="mini"
@click="resetQuery"
>重置</el-button >重置</el-button
> >
</el-form-item> </el-form-item>
</el-form> </el-form>
</div> </div>
<div class="list" v-if="productList"> <div class="list" v-if="productList">
<ul> <ul>
<li v-for="(item, index) in productList" :key="index"> <li v-for="(item, index) in productList" :key="index">
<div @click="goto(item.id)"> <div @click="goto(item.id)">
<img :src="`${baseApi}${item.appearanceImg&&item.appearanceImg[0]}`" alt="" /> <img
:src="`${baseApi}${
item.appearanceImg && item.appearanceImg[0]
}`"
alt=""
/>
</div> </div>
<h2 @click="goto(item.id)">{{item.productName}}</h2> <h2 @click="goto(item.id)">{{ item.productName }}</h2>
<h4 @click="openDia(item.productName)">联系平台</h4> <h4 @click="openDia(item.productName)">联系平台</h4>
</li> </li>
</ul> </ul>
</div> </div>
<div class="list" v-if="!productList">暂无数据</div> <div class="list" v-if="!productList">暂无数据</div>
</div> </div>
...@@ -123,9 +133,9 @@ export default { ...@@ -123,9 +133,9 @@ export default {
}, },
data() { data() {
return { return {
goodsName:'', goodsName: "",
categoryName:'', categoryName: "",
showCategoryName:false, showCategoryName: false,
baseApi: process.env.VUE_APP_File_VIEW, baseApi: process.env.VUE_APP_File_VIEW,
dialogVisible: false, dialogVisible: false,
omDemandName: "cs", omDemandName: "cs",
...@@ -135,9 +145,8 @@ export default { ...@@ -135,9 +145,8 @@ export default {
commonCode4hangye: [], commonCode4hangye: [],
productList: [], productList: [],
searchForm: {}, searchForm: {},
allLevel:[], allLevel: [],
productTypeList:[], productTypeList: [],
}; };
}, },
watch: { watch: {
...@@ -147,7 +156,7 @@ export default { ...@@ -147,7 +156,7 @@ export default {
}, },
deep: true, deep: true,
}, },
'searchForm.industryLe1'(newVal) { "searchForm.industryLe1"(newVal) {
// 当一级类目变化时,清空二级类目 // 当一级类目变化时,清空二级类目
// this.searchForm.industryLe2 = null; // this.searchForm.industryLe2 = null;
}, },
...@@ -164,12 +173,11 @@ export default { ...@@ -164,12 +173,11 @@ export default {
: []; : [];
}, },
}, },
created(){ created() {
this.resetForm(); this.resetForm();
}, },
async mounted() { async mounted() {
await this.getProductTypeList(); // 确保类型数据加载完成 await this.getProductTypeList(); // 确保类型数据加载完成
if (this.$route.query.industryLe2) { if (this.$route.query.industryLe2) {
// 如果 industryLe2 存在,优先使用 industryLe2 // 如果 industryLe2 存在,优先使用 industryLe2
...@@ -183,8 +191,8 @@ export default { ...@@ -183,8 +191,8 @@ export default {
); );
if (found) { if (found) {
// 找到对应的父级类目 industryLe1 并赋值 // 找到对应的父级类目 industryLe1 并赋值
this.$set(this.searchForm, 'industryLe1', firstLevel.id); this.$set(this.searchForm, "industryLe1", firstLevel.id);
this.$set(this.searchForm, 'industryLe2', industryLe2); this.$set(this.searchForm, "industryLe2", industryLe2);
console.log("industryLe1:", this.searchForm.industryLe1); console.log("industryLe1:", this.searchForm.industryLe1);
console.log("industryLe2:", this.searchForm.industryLe2); console.log("industryLe2:", this.searchForm.industryLe2);
...@@ -194,38 +202,45 @@ export default { ...@@ -194,38 +202,45 @@ export default {
} }
} else if (this.$route.query.industryLe1) { } else if (this.$route.query.industryLe1) {
// 如果 industryLe2 不存在,使用 industryLe1 // 如果 industryLe2 不存在,使用 industryLe1
this.$set(this.searchForm, 'industryLe1', Number(this.$route.query.industryLe1)); this.$set(
this.searchForm,
"industryLe1",
Number(this.$route.query.industryLe1)
);
} }
this.getCommoncode(); this.getCommoncode();
this.getProductList(); this.getProductList();
}, },
methods: { methods: {
resetQuery(){ resetQuery() {
this.resetForm(); this.resetForm();
}, },
resetForm(){ resetForm() {
this.searchForm = { this.searchForm = {
industryLe1: null, industryLe1: null,
industryLe2: null, industryLe2: null,
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10,
productName: null, productName: null,
} };
}, },
goto(id) { goto(id) {
this.$router.push({ path: `/Supply/det?id=${id}` }); this.$router.push({ path: `/Supply/det?id=${id}` });
}, },
le1Change(){this.searchForm.industryLe2 = null;}, le1Change() {
handleQuery(){}, this.searchForm.industryLe2 = null;
async handleSearch(){ },
await sendRequest( handleQuery() {},
"/business/equipmentProducts/listAll?name=" + this.searchForm.productName, async handleSearch() {
await sendRequest(
"/business/equipmentProducts/listAll?name=" +
this.searchForm.productName,
"get" "get"
); );
this.getProductList(this.searchForm.productName); this.getProductList(this.searchForm.productName);
}, },
herfSup(){ herfSup() {
this.$router.push({ this.$router.push({
path: `/Supply`, path: `/Supply`,
}); });
...@@ -237,31 +252,27 @@ export default { ...@@ -237,31 +252,27 @@ export default {
async getProductTypeList() { async getProductTypeList() {
const result = await sendRequest( const result = await sendRequest(
"/business/commodityCategory/tree", "/business/commodityCategory/tree",
"get", "get"
); );
this.productTypeList = result.data || []; this.productTypeList = result.data || [];
}, },
async getHangyeList() { async getHangyeList() {
const result = await sendRequest( const result = await sendRequest(
"/business/commodityCategory/list", "/business/commodityCategory/list",
"get" "get"
); );
if (result.rows && result.rows.length) { if (result.rows && result.rows.length) {
this.allLevel = result.rows; this.allLevel = result.rows;
} }
}, },
async getProductList() { async getProductList() {
let form={ let form = {
productName:this.searchForm.productName, productName: this.searchForm.productName,
};
} if (this.searchForm.industryLe2) {
if(this.searchForm.industryLe2){ form.industry = this.searchForm.industryLe2;
form.industry = this.searchForm.industryLe2 } else {
}else{ form.industry = this.searchForm.industryLe1;
form.industry = this.searchForm.industryLe1
} }
const result = await sendRequest( const result = await sendRequest(
"/business/equipmentProducts/listAll", "/business/equipmentProducts/listAll",
...@@ -296,7 +307,7 @@ export default { ...@@ -296,7 +307,7 @@ export default {
dictLabel: "全部", dictLabel: "全部",
dictValue: "", dictValue: "",
}); });
this.mapSearchCommonCode(); this.mapSearchCommonCode();
}, },
}, },
...@@ -306,8 +317,8 @@ export default { ...@@ -306,8 +317,8 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
$color: #479aff; $color: #479aff;
$border-color: #f1f1f1; $border-color: #f1f1f1;
.goods-list{ .goods-list {
background-color:#F3F3F3; background-color: #f3f3f3;
} }
.vertical-center { .vertical-center {
display: flex; display: flex;
...@@ -349,9 +360,14 @@ $border-color: #f1f1f1; ...@@ -349,9 +360,14 @@ $border-color: #f1f1f1;
color: #333333; color: #333333;
line-height: 35px; line-height: 35px;
cursor: pointer; cursor: pointer;
width: 216px;
display: block;
padding: 0px 18px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
} }
h3 { h3 {
font-size: 20px; font-size: 20px;
font-family: Source Han Sans CN; font-family: Source Han Sans CN;
font-weight: 400; font-weight: 400;
...@@ -390,9 +406,9 @@ $border-color: #f1f1f1; ...@@ -390,9 +406,9 @@ $border-color: #f1f1f1;
.search { .search {
width: 100%; width: 100%;
margin-bottom: 20px; margin-bottom: 20px;
border-bottom: 3px solid #F3F3F3; border-bottom: 3px solid #f3f3f3;
padding: 30px; padding: 30px;
.input-search{ .input-search {
width: 30%; width: 30%;
} }
...@@ -432,11 +448,10 @@ $border-color: #f1f1f1; ...@@ -432,11 +448,10 @@ $border-color: #f1f1f1;
border-radius: 5px; border-radius: 5px;
&.active { &.active {
font-weight: bold; font-weight: bold;
background: #EEEEEE; background: #eeeeee;
} }
&:hover{ &:hover {
background: rgba(238, 238, 238,.5); background: rgba(238, 238, 238, 0.5);
} }
} }
} }
......
...@@ -11,7 +11,8 @@ ...@@ -11,7 +11,8 @@
:title="conDia.lifeCycleName" :title="conDia.lifeCycleName"
:visible.sync="showConfirmButton" :visible.sync="showConfirmButton"
width="30%" width="30%"
center> center
>
<span> <span>
{{ conDia.intro }} {{ conDia.intro }}
</span> </span>
...@@ -25,10 +26,16 @@ ...@@ -25,10 +26,16 @@
label-position="right" label-position="right"
> >
<el-form-item label="姓名:" prop="omContactName"> <el-form-item label="姓名:" prop="omContactName">
<el-input v-model="formDia.omContactName" placeholder="请输入联系人姓名"></el-input> <el-input
v-model="formDia.omContactName"
placeholder="请输入联系人姓名"
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="联系方式:" prop="omContactTel"> <el-form-item label="联系方式:" prop="omContactTel">
<el-input v-model="formDia.omContactTel" placeholder="请输入联系方式"></el-input> <el-input
v-model="formDia.omContactTel"
placeholder="请输入联系方式"
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="留言内容:" prop="omInquiryContent"> <el-form-item label="留言内容:" prop="omInquiryContent">
<el-input <el-input
...@@ -37,8 +44,10 @@ ...@@ -37,8 +44,10 @@
placeholder="请输入留言内容" placeholder="请输入留言内容"
></el-input> ></el-input>
</el-form-item> </el-form-item>
<el-form-item style="display: flex;justify-content: center;"> <el-form-item style="display: flex; justify-content: center">
<el-button type="primary" @click="formSub('formDia')">我要留言</el-button> <el-button type="primary" @click="formSub('formDia')"
>我要留言</el-button
>
</el-form-item> </el-form-item>
</el-form> </el-form>
</div> </div>
...@@ -54,103 +63,61 @@ ...@@ -54,103 +63,61 @@
</div> </div>
<article class="content_three"> <article class="content_three">
<div class="bd container_new"> <div class="bd container_new">
<div class="zzbl" style="display: block"> <div
<!-- 轮播详情模块 --> class="zzbl"
<div class="swiper mySwiper2 swiper-initialized swiper-vertical"> @mouseenter="clearAutoPlay"
@mouseleave="startAutoPlay"
>
<!-- 左侧导航菜单 -->
<div class="nav-menu">
<div <div
class="swiper-wrapper" v-for="(item, index) in lifeServiceList"
id="certificationList" :key="item.lifeCycleId"
aria-live="polite" :class="[
style=" 'menu-item',
transition-duration: 0ms; { active: currentLifeServiceItemIndex === index },
transition-delay: 0ms; ]"
transform: translate3d(0px, 0px, 0px); @click="handleMenuClick(index)"
"
> >
<div <img
class="swiper-slide" v-if="currentLifeServiceItemIndex === index"
style="height: 435px; margin-bottom: 10px" :src="`${baseApi}${item.revealIcon}`"
v-for="item1 in lifeServiceList" />
:key="item1.lifeCycleId" <img v-else :src="`${baseApi}${item.hiddenIcon}`" />
>
<div <span>{{ item.lifeCycleName }}</span>
style="
overflow-y: scroll;
display: flex;
max-height: 430px;
justify-content: space-evenly;
flex-wrap: wrap;
width: 100%;
"
>
<div
v-for="(item1, index) in item1.children"
:key="item1.lifeCycleId"
class="items-class"
>
<img
src="~/static/images/technicalDocking/circle.png"
alt=""
/>
<span @click="showTip(item1)">{{ item1.lifeCycleName }}</span>
</div>
<div class="items-class" v-if="item1.children.length % 2 == 1"></div>
</div>
</div>
</div> </div>
<div
class="swiper-button-next"
tabindex="0"
role="button"
aria-label="Next slide"
aria-controls="certificationList"
aria-disabled="false"
></div>
<div
class="swiper-button-prev swiper-button-disabled"
tabindex="-1"
role="button"
aria-label="Previous slide"
aria-controls="certificationList"
aria-disabled="true"
></div>
<span
class="swiper-notification"
aria-live="assertive"
aria-atomic="true"
></span>
</div> </div>
<div class="swiper mySwiper">
<div <!-- 右侧内容区域 -->
class="swiper-wrapper" <div class="content-area">
id="certificationOrg" <!-- 添加v-if确保数据加载完成 -->
style=" <template
transition-duration: 0ms; v-if="lifeServiceList[currentLifeServiceItemIndex]?.children"
transition-delay: 0ms;
transform: translate3d(0px, 0px, 0px);
"
> >
<div <div
class="swiper-slide" v-for="(subItem, subIndex) in lifeServiceList[
v-for="(item, index) in lifeServiceList" currentLifeServiceItemIndex
:key="item.lifeCycleId" ].children"
:key="subItem.lifeCycleId"
class="content-item"
> >
<!-- @click="currentLifeServiceItemIndex=index" --> <img src="~/static/images/technicalDocking/circle.png" />
<span <span @click="showTip(subItem)">{{
subItem.lifeCycleName
> }}</span>
<!-- <img :src="`${baseApi}${item.revealIcon}`" alt="" /> -->
<img :src="`${baseApi}${currentLifeServiceItemIndex===index ? item.revealIcon : item.hiddenIcon}`" alt="" />
{{
item.lifeCycleName
}}</span
>
</div> </div>
<!-- 添加占位元素保持双数布局 -->
</div> <div
v-if="
lifeServiceList[currentLifeServiceItemIndex].children
.length %
2 ===
1
"
class="content-item placeholder"
></div>
</template>
</div> </div>
</div> </div>
</div> </div>
...@@ -170,70 +137,82 @@ ...@@ -170,70 +137,82 @@
<div class="mt30"></div> <div class="mt30"></div>
<div class="tec-com"> <div class="tec-com">
<div class="swiper mySwiper3 swiper-initialized swiper-horizontal"> <div class="swiper mySwiper3 swiper-initialized swiper-horizontal">
<div
class="swiper-wrapper"
id="certificationList"
aria-live="polite"
style="
transition-duration: 0ms;
transition-delay: 0ms;
transform: translate3d(0px, 0px, 0px);
"
>
<div <div
class="swiper-wrapper" class="swiper-slide"
id="certificationList" style="height: 435px; margin-bottom: 10px"
aria-live="polite" v-for="(item, index) in unitList"
style=" :key="index"
transition-duration: 0ms;
transition-delay: 0ms;
transform: translate3d(0px, 0px, 0px);
"
> >
<div
class="swiper-slide"
style="height: 435px; margin-bottom: 10px"
v-for="(item, index) in unitList"
:key="index"
>
<ul> <ul>
<!-- <li v-for="item in unitList" :key="item.chkqCompanyId"><img :src="`${baseApi}${item.chkqCompanyLogo}`" alt="" @click="goto(item.chkqCompanyId)"></li> --> <!-- <li v-for="item in unitList" :key="item.chkqCompanyId"><img :src="`${baseApi}${item.chkqCompanyLogo}`" alt="" @click="goto(item.chkqCompanyId)"></li> -->
<li v-for="(subItem, index) in item" :key="index" @click="goto(subItem.id)"> <li
<div class="top"> v-for="(subItem, index) in item"
<div class="left"> :key="index"
<!-- <img :src="`${baseApi}${subItem.caseAvatarList.length ? subItem.caseAvatarList[0] : ''}`" /> --> @click="goto(subItem.id)"
<img :src="subItem.caseAvatarList&&subItem.caseAvatarList.length ? baseApi+subItem.caseAvatarList[0] : ''" /> >
</div> <div class="top">
<div class="right"> <div class="left">
<p>{{ subItem.commodityName }}</p> <!-- <img :src="`${baseApi}${subItem.caseAvatarList.length ? subItem.caseAvatarList[0] : ''}`" /> -->
<p> <img
<span>{{ subItem.commoditySign }}</span> :src="
</p> subItem.caseAvatarList &&
<p> subItem.caseAvatarList.length
<span>{{ subItem.registeredAddress }}</span> ? baseApi + subItem.caseAvatarList[0]
</p> : ''
</div> "
/>
</div> </div>
<div class="bottom"> <div class="right">
<p class="ellipsis">主营业务:{{ subItem.commodityBusiness }}</p> <p>{{ subItem.commodityName }}</p>
<p>
<span>{{ subItem.commoditySign }}</span>
</p>
<p>
<span>{{ subItem.registeredAddress }}</span>
</p>
</div> </div>
</li> </div>
</ul> <div class="bottom">
</div> <p class="ellipsis">
主营业务:{{ subItem.commodityBusiness }}
</p>
</div>
</li>
</ul>
</div> </div>
<div
class="swiper-button-next"
tabindex="0"
role="button"
aria-label="Next slide"
aria-controls="certificationList"
aria-disabled="false"
></div>
<div
class="swiper-button-prev swiper-button-disabled"
tabindex="-1"
role="button"
aria-label="Previous slide"
aria-controls="certificationList"
aria-disabled="true"
></div>
<span
class="swiper-notification"
aria-live="assertive"
aria-atomic="true"
></span>
</div> </div>
<div
class="swiper-button-next"
tabindex="0"
role="button"
aria-label="Next slide"
aria-controls="certificationList"
aria-disabled="false"
></div>
<div
class="swiper-button-prev swiper-button-disabled"
tabindex="-1"
role="button"
aria-label="Previous slide"
aria-controls="certificationList"
aria-disabled="true"
></div>
<span
class="swiper-notification"
aria-live="assertive"
aria-atomic="true"
></span>
</div>
</div> </div>
</section> </section>
</article> </article>
...@@ -262,6 +241,7 @@ export default { ...@@ -262,6 +241,7 @@ export default {
data() { data() {
return { return {
timer: null, // 新增定时器实例
currentLifeServiceItemIndex: 0, currentLifeServiceItemIndex: 0,
items: [ items: [
{ id: 1, text: "Item 1" }, { id: 1, text: "Item 1" },
...@@ -296,9 +276,9 @@ export default { ...@@ -296,9 +276,9 @@ export default {
expertTypeIcons: ["banpo", "kancha", "kuangchu", "map-ruler", "shaixuan"], expertTypeIcons: ["banpo", "kancha", "kuangchu", "map-ruler", "shaixuan"],
dialogVisible: false, dialogVisible: false,
formDia: { omSource: 1, omStatus: "N", omDemandName: null }, formDia: { omSource: 1, omStatus: "N", omDemandName: null },
showConfirmButton:false, showConfirmButton: false,
conDia:{}, conDia: {},
formDia:{ omSource: 1, omStatus: "N" }, formDia: { omSource: 1, omStatus: "N" },
rules: { rules: {
omContactName: [ omContactName: [
{ required: true, message: "请输入姓名", trigger: "blur" }, { required: true, message: "请输入姓名", trigger: "blur" },
...@@ -318,84 +298,41 @@ export default { ...@@ -318,84 +298,41 @@ export default {
omInquiryContent: [ omInquiryContent: [
{ required: true, message: "请输入需求内容", trigger: "blur" }, { required: true, message: "请输入需求内容", trigger: "blur" },
], ],
}, },
}; };
}, },
mounted() { mounted() {
var VUE = this this.startAutoPlay();
this.$nextTick(() => {
this.$wow.init({ animateClass: "animate__animated" });
setTimeout(() => {
var swiper = new Swiper(".mySwiper", {
spaceBetween: 10,
slidesPerView: 5,
freeMode: true,
watchSlidesProgress: true,
direction: "vertical",
on: {
tap: function (swiperEle, event) {
// alert('你碰了Swiper');
const clickedIndex = swiperEle.clickedIndex; // 获取被点击的索引
if (clickedIndex !== undefined) {
swiper.slideTo(clickedIndex, 300, true); // 滑动到点击的那一项,带有动画效果
VUE.currentLifeServiceItemIndex = clickedIndex
}
},
slideChange: function(){
// alert('改变了,activeIndex为'+this.activeIndex);
VUE.currentLifeServiceItemIndex = this.activeIndex
},
},
});
var swiper2 = new Swiper(".mySwiper2", {
spaceBetween: 10,
direction: "vertical",
navigation: {
nextEl: ".swiper-button-next",
prevEl: ".swiper-button-prev",
},
thumbs: {
swiper: swiper,
},
on: {
tap: function (swiperEle, event) {
// alert('你碰了Swiper');
const clickedIndex = swiperEle.clickedIndex; // 获取被点击的索引
if (clickedIndex !== undefined) {
VUE.currentLifeServiceItemIndex = clickedIndex
}
},
slideChange: function(){
// alert('改变了,activeIndex为'+this.activeIndex);
VUE.currentLifeServiceItemIndex = this.activeIndex
},
},
});
var swiper3 = new Swiper(".mySwiper3", {
spaceBetween: 10,
direction: "horizontal",
navigation: {
nextEl: ".swiper-button-next",
prevEl: ".swiper-button-prev",
},
});
}, 1200);
});
this.getUnitTypeList(); this.getUnitTypeList();
this.getExpertList(); this.getExpertList();
this.getLifeCycleList(); this.getLifeCycleList();
}, },
beforeDestroy() {
this.clearAutoPlay(); // 组件销毁时清除定时器
},
methods: { methods: {
startAutoPlay() {
this.timer = setInterval(() => {
this.currentLifeServiceItemIndex =
(this.currentLifeServiceItemIndex + 1) % this.lifeServiceList.length;
}, 3000);
},
clearAutoPlay() {
if (this.timer) {
clearInterval(this.timer);
this.timer = null;
}
},
handleMenuClick(index) {
this.currentLifeServiceItemIndex = index;
this.clearAutoPlay(); // 点击时暂停自动播放
},
showTip(item) { showTip(item) {
console.log(item,'item') console.log(item, "item");
this.showConfirmButton = true; this.showConfirmButton = true;
this.conDia = item; this.conDia = item;
this.omDemandName = item.lifeCycleName this.omDemandName = item.lifeCycleName;
this.formDia.omDemandName = item.lifeCycleName this.formDia.omDemandName = item.lifeCycleName;
}, },
goto(id) { goto(id) {
this.$router.push({ path: `/TechnicalDocking/TecCom?id=${id}` }); this.$router.push({ path: `/TechnicalDocking/TecCom?id=${id}` });
...@@ -404,7 +341,6 @@ export default { ...@@ -404,7 +341,6 @@ export default {
this.formDia = { omSource: 1, omStatus: "N" }; this.formDia = { omSource: 1, omStatus: "N" };
this.dialogVisible = true; this.dialogVisible = true;
this.formDia.omDemandName = val; this.formDia.omDemandName = val;
}, },
handleCloseDialog(newState) { handleCloseDialog(newState) {
this.dialogVisible = newState; this.dialogVisible = newState;
...@@ -487,9 +423,6 @@ export default { ...@@ -487,9 +423,6 @@ export default {
this.unitList.push(unitsTemp.slice(i, i + 6)); this.unitList.push(unitsTemp.slice(i, i + 6));
} }
console.log(this.unitList); console.log(this.unitList);
} }
}, },
async getExpertList() { async getExpertList() {
...@@ -522,17 +455,17 @@ export default { ...@@ -522,17 +455,17 @@ export default {
}, },
async formSub(formName) { async formSub(formName) {
let that = this; let that = this;
if(this.verificationCode !== this.inVerificationCode) { if (this.verificationCode !== this.inVerificationCode) {
this.$message({ this.$message({
message: "请输入正确验证码", message: "请输入正确验证码",
type: "error", type: "error",
}); });
return return;
} }
try { try {
let that = this; let that = this;
that.formDia.omSubmitTime = this.getCurrentFormattedTime(); that.formDia.omSubmitTime = this.getCurrentFormattedTime();
const valid = await new Promise(resolve => { const valid = await new Promise((resolve) => {
this.$refs[formName].validate(resolve); this.$refs[formName].validate(resolve);
}); });
...@@ -551,7 +484,7 @@ export default { ...@@ -551,7 +484,7 @@ export default {
}); });
that.formDia = { omSource: 1, omStatus: "N" }; that.formDia = { omSource: 1, omStatus: "N" };
that.showConfirmButton = false that.showConfirmButton = false;
} else { } else {
that.$message({ that.$message({
message: "请求失败,请重试", message: "请求失败,请重试",
...@@ -599,22 +532,21 @@ export default { ...@@ -599,22 +532,21 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.content_three { .content_three {
height: 635px;
margin-top: 41px; margin-top: 41px;
overflow: hidden;
// background-color: rgb(242, 246, 248); // background-color: rgb(242, 246, 248);
background: linear-gradient(180deg, #EAF2F8 0%, #F7F7F7 100%); background: linear-gradient(180deg, #eaf2f8 0%, #f7f7f7 100%);
// background: url(../images/content_three_bd_bj.png) no-repeat center bottom; // background: url(../images/content_three_bd_bj.png) no-repeat center bottom;
} }
.content_three .bd { .content_three .bd {
height: 584px; padding: 40px 0px;
margin-bottom: 10px; margin-bottom: 10px;
} }
.content_three .zzbl { .zzbl {
display: flex;
gap: 30px;
margin-top: 30px; margin-top: 30px;
height: 470px;
// background-color: #ffffff; // background-color: #ffffff;
// background-color: linear-gradient(180deg, #EAF2F8 0%, #F7F7F7 100%); // background-color: linear-gradient(180deg, #EAF2F8 0%, #F7F7F7 100%);
background-color: #fff; background-color: #fff;
...@@ -626,140 +558,130 @@ export default { ...@@ -626,140 +558,130 @@ export default {
position: relative; position: relative;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
.mySwiper2 { padding: 20px;
position: absolute; .nav-menu {
left: 40px;
top: 30px;
width: 750px;
padding-left: 370px;
height: 435px;
img {
width: 8px;
height: 8px;
background: #ffffff;
border-radius: 50%;
border: 1px solid #0777d1;
}
span {
}
.swiper-button-next {
width: 85px;
height: 44px;
display: block;
position: absolute;
background: url(~/static/images/technicalDocking/zzbl_next.png) no-repeat
center;
top: 390px;
left: 3px;
}
.swiper-button-prev {
width: 94px;
height: 44px;
display: block;
position: absolute;
background: url(~/static/images/technicalDocking/zzbl_prev.png) no-repeat
center;
top: 390px;
left: 80px;
}
}
.swiper-button-next:after,
.swiper-button-prev:after {
font-family: swiper-icons;
font-size: 0px;
text-transform: none !important;
letter-spacing: 0;
font-variant: initial;
line-height: 1;
}
.mySwiper {
left: 30px;
top: 30px;
width: 368px; width: 368px;
height: 340px; .menu-item {
z-index: 1; height: 60px;
position: absolute; background: url(~/static/images/technicalDocking/zzbl_hd_li.png) no-repeat;
.swiper-slide { padding-left: 30px;
float: left; display: flex;
width: 368px; align-items: center;
height: 60px !important; cursor: pointer;
line-height: 60px;
background: url(~/static/images/technicalDocking/zzbl_hd_li.png) no-repeat &.active {
left center; background: url(~/static/images/technicalDocking/zzbl_hd_li_on.png)
no-repeat;
span {
color: #fff;
}
}
span { span {
font-size: 18px;
color: #5C5C5C;
display: block;
padding-left: 30px;
padding-right: 5px;
font-family: Microsoft YaHei;
box-sizing: border-box; box-sizing: border-box;
color: #5c5c5c;
cursor: pointer; cursor: pointer;
display: block;
font-family: Microsoft YaHei;
font-size: 18px;
overflow: hidden; overflow: hidden;
padding-left: 30px;
padding-right: 5px;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
} }
img { img {
width: 19px; width: 19px;
height: 18px;
margin-right: 10px; margin-right: 10px;
} }
} }
.swiper-slide-thumb-active { }
background: url(~/static/images/technicalDocking/zzbl_hd_li_on.png)
no-repeat left center; .content-area {
flex: 1;
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20px;
max-height: 430px; // 添加固定高度
overflow-y: auto; // 添加滚动条
.content-item {
display: flex;
align-items: center;
padding: 10px;
// 添加具体尺寸
height: 38px;
padding: 0 10px;
img {
background: #fff;
border: 1px solid #0777d1;
border-radius: 50%;
height: 8px;
width: 8px;
}
span { span {
color: #ffffff; box-sizing: border-box;
font-weight: bold; color: #5c5c5c;
cursor: pointer;
display: block;
float: left;
font-family: "pingguocu";
font-size: 18px;
font-weight: 300;
margin-left: 10px;
max-width: 300px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
&:hover {
color: #436ee4;
}
}
&.placeholder {
visibility: hidden; // 隐藏占位元素
} }
} }
} }
} }
// 砖家列表轮播样式 // 砖家列表轮播样式
.mySwiper3 { .mySwiper3 {
.swiper-slide{ .swiper-slide {
li{ li {
&:hover{ &:hover {
cursor: pointer; cursor: pointer;
} }
} }
} }
.swiper-button-next {
background: url(~/static/images/technicalDocking/swiper3next.png) no-repeat
center;
top: 160px;
right: 0px;
width: 27px;
} .swiper-button-next {
.swiper-button-prev { background: url(~/static/images/technicalDocking/swiper3next.png) no-repeat
top: 160px; center;
left: 0px; top: 160px;
right: 0px;
width: 27px; width: 27px;
background: url(~/static/images/technicalDocking/swiper3prev.png) no-repeat
center;
// top: 390px;
// left: 80px;
}
} }
.swiper-button-prev {
.swiper-button-next:after, top: 160px;
.swiper-button-prev:after { left: 0px;
font-family: swiper-icons; width: 27px;
font-size: 0px; background: url(~/static/images/technicalDocking/swiper3prev.png) no-repeat
text-transform: none !important; center;
letter-spacing: 0; // top: 390px;
font-variant: initial; // left: 80px;
line-height: 1;
} }
}
.swiper-button-next:after,
.swiper-button-prev:after {
font-family: swiper-icons;
font-size: 0px;
text-transform: none !important;
letter-spacing: 0;
font-variant: initial;
line-height: 1;
}
</style> </style>
<style lang="scss" scoped> <style lang="scss" scoped>
...@@ -807,7 +729,7 @@ $color: #479aff; ...@@ -807,7 +729,7 @@ $color: #479aff;
background-color: #fff; background-color: #fff;
// background-image: url(~/static/images/NEWER/bg_service2.png); // background-image: url(~/static/images/NEWER/bg_service2.png);
background-size: cover; background-size: cover;
height: 660px; height: 780px;
background-repeat: no-repeat; background-repeat: no-repeat;
margin-bottom: -3px; margin-bottom: -3px;
@extend .commonMarker; @extend .commonMarker;
...@@ -829,7 +751,6 @@ $color: #479aff; ...@@ -829,7 +751,6 @@ $color: #479aff;
} }
} }
article { article {
section { section {
display: flex; display: flex;
justify-content: center; justify-content: center;
...@@ -1303,8 +1224,8 @@ $color: #479aff; ...@@ -1303,8 +1224,8 @@ $color: #479aff;
width: 398px; width: 398px;
margin-bottom: 20px; margin-bottom: 20px;
height: 143px; height: 143px;
box-shadow: 0px 8px 16px 2px rgba(40,40,40,0.25); box-shadow: 0px 8px 16px 2px rgba(40, 40, 40, 0.25);
img { img {
width: 80px; width: 80px;
height: 80px; height: 80px;
...@@ -1315,7 +1236,7 @@ $color: #479aff; ...@@ -1315,7 +1236,7 @@ $color: #479aff;
display: flex; display: flex;
padding-top: 10px; padding-top: 10px;
// padding-left: 10px; // padding-left: 10px;
.right{ .right {
margin-right: 30px; margin-right: 30px;
width: 260px; width: 260px;
} }
...@@ -1323,7 +1244,6 @@ $color: #479aff; ...@@ -1323,7 +1244,6 @@ $color: #479aff;
margin-bottom: 7px; margin-bottom: 7px;
} }
p:nth-child(1) { p:nth-child(1) {
font-size: 18px; font-size: 18px;
font-weight: bold; font-weight: bold;
white-space: nowrap; white-space: nowrap;
...@@ -1339,9 +1259,10 @@ $color: #479aff; ...@@ -1339,9 +1259,10 @@ $color: #479aff;
} }
p:nth-child(3) { p:nth-child(3) {
color: rgb(107, 107, 107); color: rgb(107, 107, 107);
span{ span {
display: block; display: block;
background: url(~/static/images/technicalDocking/location.png) no-repeat; background: url(~/static/images/technicalDocking/location.png)
no-repeat;
background-position: 0px 2px; background-position: 0px 2px;
text-indent: 20px; text-indent: 20px;
color: rgb(126, 126, 126); color: rgb(126, 126, 126);
...@@ -1378,11 +1299,11 @@ $color: #479aff; ...@@ -1378,11 +1299,11 @@ $color: #479aff;
} }
} }
::v-deep .el-dialog__header{ ::v-deep .el-dialog__header {
border-bottom: 1px solid #efefef !important; border-bottom: 1px solid #efefef !important;
} }
.items-class{ .items-class {
flex: 0 0 35%; flex: 0 0 35%;
box-sizing: border-box; box-sizing: border-box;
padding: 0px; padding: 0px;
display: flex; display: flex;
...@@ -1391,23 +1312,22 @@ $color: #479aff; ...@@ -1391,23 +1312,22 @@ $color: #479aff;
margin-bottom: 28px; margin-bottom: 28px;
max-width: 250px; max-width: 250px;
height: 38px; height: 38px;
span{ span {
float: left; float: left;
font-size: 18px; font-size: 18px;
color: #5c5c5c; color: #5c5c5c;
font-weight: 300; font-weight: 300;
margin-left: 10px; margin-left: 10px;
display: block; display: block;
font-family: 'pingguocu'; font-family: "pingguocu";
box-sizing: border-box; box-sizing: border-box;
cursor: pointer; cursor: pointer;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
max-width: 300px; max-width: 300px;
&:hover{ &:hover {
color: rgb(67, 110, 228); color: rgb(67, 110, 228);
} }
} }
} }
......
<template> <template>
<div> <div>
<BackToTopButton /> <BackToTopButton />
<Header :activeIndex="2"/> <Header :activeIndex="2" />
<CommonDialog <CommonDialog
:show="dialogVisible" :show="dialogVisible"
@close-dialog="handleCloseDialog" @close-dialog="handleCloseDialog"
...@@ -11,9 +11,7 @@ ...@@ -11,9 +11,7 @@
<article> <article>
<div class="part part6"> <div class="part part6">
<div class="part-tit"> <div class="part-tit">
<h3 class="part-title"> <h3 class="part-title"><span>重点矿业权</span><span>推荐</span></h3>
<span>重点矿业权</span><span>推荐</span>
</h3>
</div> </div>
<div class="mt20"></div> <div class="mt20"></div>
<div class="top-zd"> <div class="top-zd">
...@@ -40,7 +38,7 @@ ...@@ -40,7 +38,7 @@
/> />
</el-select> </el-select>
</div> </div>
<div class="tableWrapper" v-show="currentIndex4overview===0"> <div class="tableWrapper" v-show="currentIndex4overview === 0">
<div <div
class="item" class="item"
v-for="(item, index1) in suggestList1" v-for="(item, index1) in suggestList1"
...@@ -82,7 +80,19 @@ ...@@ -82,7 +80,19 @@
}} }}
</p> </p>
<p>资源储量:{{ item.reservesScale || "-" }}</p> <p>资源储量:{{ item.reservesScale || "-" }}</p>
<img class="mining-tag" :src="baseApi+getValueByIdAndField(KqTagList,Number(item.miningLable[0]),'picUrl')" alt="" v-if="item.miningLable&&item.miningLable.length>0"> <img
class="mining-tag"
:src="
baseApi +
getValueByIdAndField(
KqTagList,
Number(item.miningLable[0]),
'picUrl'
)
"
alt=""
v-if="item.miningLable && item.miningLable.length > 0"
/>
</div> </div>
<!-- <p>整体转让</p> --> <!-- <p>整体转让</p> -->
<!-- <div class="item-right"> <!-- <div class="item-right">
...@@ -91,9 +101,8 @@ ...@@ -91,9 +101,8 @@
<div @click="openDia(item.websiteMiningTitle)">联系我们</div> <div @click="openDia(item.websiteMiningTitle)">联系我们</div>
</div> --> </div> -->
</div> </div>
</div> </div>
<div class="tableWrapper" v-show="currentIndex4overview===1"> <div class="tableWrapper" v-show="currentIndex4overview === 1">
<div <div
class="item" class="item"
v-for="(item, index1) in suggestList2" v-for="(item, index1) in suggestList2"
...@@ -134,7 +143,19 @@ ...@@ -134,7 +143,19 @@
}} }}
</p> </p>
<p>资源储量:{{ item.reservesScale || "-" }}</p> <p>资源储量:{{ item.reservesScale || "-" }}</p>
<img class="mining-tag" :src="baseApi+getValueByIdAndField(KqTagList,Number(item.miningLable[0]),'picUrl')" alt="" v-if="item.miningLable&&item.miningLable.length>0"> <img
class="mining-tag"
:src="
baseApi +
getValueByIdAndField(
KqTagList,
Number(item.miningLable[0]),
'picUrl'
)
"
alt=""
v-if="item.miningLable && item.miningLable.length > 0"
/>
</div> </div>
<!-- <p>整体转让</p> --> <!-- <p>整体转让</p> -->
<!-- <div class="item-right"> <!-- <div class="item-right">
...@@ -144,7 +165,6 @@ ...@@ -144,7 +165,6 @@
</div> --> </div> -->
</div> </div>
</div> </div>
</div> </div>
</article> </article>
</div> </div>
...@@ -166,7 +186,7 @@ ...@@ -166,7 +186,7 @@
<script> <script>
// import Footer from '../../../components/Footer.vue' // import Footer from '../../../components/Footer.vue'
import sendRequest from "~/utils/request.js"; import sendRequest from "~/utils/request.js";
import { getDictLabelFromVal,filterByFields } from "~/utils/tyler"; import { getDictLabelFromVal, filterByFields } from "~/utils/tyler";
import Footer from "~/components/Footer.vue"; import Footer from "~/components/Footer.vue";
import BackToTopButton from "~/components/BackToTopButton.vue"; import BackToTopButton from "~/components/BackToTopButton.vue";
import HorizontalMenu from "~/components/header/HorizontalMenu.vue"; import HorizontalMenu from "~/components/header/HorizontalMenu.vue";
...@@ -183,13 +203,13 @@ export default { ...@@ -183,13 +203,13 @@ export default {
}, },
data() { data() {
return { return {
page:{ page: {
pageNum:1, pageNum: 1,
pageSize:9 pageSize: 9,
}, },
total:0, total: 0,
minType:'', minType: "",
minTypeList:[], minTypeList: [],
dialogVisible: false, dialogVisible: false,
omDemandName: "cs", omDemandName: "cs",
suggestList: [], suggestList: [],
...@@ -208,10 +228,9 @@ export default { ...@@ -208,10 +228,9 @@ export default {
mineListTotal: 0, mineListTotal: 0,
searchForm: { searchForm: {
isRecommendation: "Y", isRecommendation: "Y",
minType:'全部', minType: "全部",
}, },
KqTagList:[], KqTagList: [],
}; };
}, },
watch: {}, watch: {},
...@@ -232,24 +251,25 @@ export default { ...@@ -232,24 +251,25 @@ export default {
methods: { methods: {
getDictLabelFromVal, getDictLabelFromVal,
getValueByIdAndField(arr, id, field) { getValueByIdAndField(arr, id, field) {
const result = arr.find(item => item.id === id); const result = arr.find((item) => item.id === id);
return result ? result[field] : null; return result ? result[field] : null;
}, },
changePage(pageNum) { changePage(pageNum) {
console.log(pageNum ) console.log(pageNum);
this.page.pageNum = pageNum; this.page.pageNum = pageNum;
if(this.currentIndex4overview ===0){ if (this.currentIndex4overview === 0) {
this.suggestList1 = filterByFields(this.suggestList,[{chkqType:"采矿权"}]).slice((pageNum-1)*9, pageNum*9); this.suggestList1 = filterByFields(this.suggestList, [
{ chkqType: "采矿权" },
}else if(this.currentIndex4overview ===1){ ]).slice((pageNum - 1) * 9, pageNum * 9);
this.suggestList2 = filterByFields(this.suggestList,[{chkqType:"探矿权"}]).slice((pageNum-1)*9, pageNum*9); } else if (this.currentIndex4overview === 1) {
this.suggestList2 = filterByFields(this.suggestList, [
{ chkqType: "探矿权" },
]).slice((pageNum - 1) * 9, pageNum * 9);
} }
}, },
clickVolume(id, index) { clickVolume(id, index) {
const url = `/Transaction/minDet?id=${id}`; const url = `/Transaction/minDet?id=${id}`;
window.open(url, '_blank'); // '_blank' 表示在新标签页中打开 window.open(url, "_blank"); // '_blank' 表示在新标签页中打开
}, },
openDia(val) { openDia(val) {
this.dialogVisible = true; this.dialogVisible = true;
...@@ -259,18 +279,22 @@ export default { ...@@ -259,18 +279,22 @@ export default {
return arr.slice(0, num); return arr.slice(0, num);
}, },
changeSuggest(index, item) { changeSuggest(index, item) {
this.searchForm.minType = '全部' this.searchForm.minType = "全部";
let that = this; let that = this;
console.log(index, item); console.log(index, item);
this.page.pageNum = 1; this.page.pageNum = 1;
this.currentIndex4overview = index; this.currentIndex4overview = index;
this.suggestType = item.dictValue; this.suggestType = item.dictValue;
if(index===0){ if (index === 0) {
that.total = filterByFields(that.suggestList,[{chkqType:"采矿权"}]).length; that.total = filterByFields(that.suggestList, [
}else if(index === 1){ { chkqType: "采矿权" },
that.total = filterByFields(that.suggestList,[{chkqType:"探矿权"}]).length; ]).length;
} else if (index === 1) {
that.total = filterByFields(that.suggestList, [
{ chkqType: "探矿权" },
]).length;
} }
this.changePage(this.page.pageNum) this.changePage(this.page.pageNum);
}, },
handleCloseDialog(newState) { handleCloseDialog(newState) {
this.dialogVisible = newState; this.dialogVisible = newState;
...@@ -284,47 +308,54 @@ export default { ...@@ -284,47 +308,54 @@ export default {
this.suggestList2 = []; this.suggestList2 = [];
// 根据所选矿种类型过滤数据 // 根据所选矿种类型过滤数据
if (val === '全部') { if (val === "全部") {
// 显示所有数据 // 显示所有数据
this.suggestList1 = filterByFields(this.suggestList, [{ chkqType: "采矿权" }]); this.suggestList1 = filterByFields(this.suggestList, [
this.suggestList2 = filterByFields(this.suggestList, [{ chkqType: "探矿权" }]); { chkqType: "采矿权" },
]);
this.suggestList2 = filterByFields(this.suggestList, [
{ chkqType: "探矿权" },
]);
} else { } else {
// 根据所选矿种类型过滤 // 根据所选矿种类型过滤
this.suggestList1 = filterByFields(this.suggestList, [{ chkqType: "采矿权", miningTypes: val }]); this.suggestList1 = filterByFields(this.suggestList, [
this.suggestList2 = filterByFields(this.suggestList, [{ chkqType: "探矿权", miningTypes: val }]); { chkqType: "采矿权", miningTypes: val },
]);
this.suggestList2 = filterByFields(this.suggestList, [
{ chkqType: "探矿权", miningTypes: val },
]);
} }
// 更新总条目数,确保分页组件正确显示 // 更新总条目数,确保分页组件正确显示
if (this.currentIndex4overview === 0) { if (this.currentIndex4overview === 0) {
this.total = this.suggestList1.length; this.total = this.suggestList1.length;
// 分页处理:提取当前页的数据 // 分页处理:提取当前页的数据
this.suggestList1 = this.suggestList1.slice((this.page.pageNum - 1) * this.page.pageSize, this.page.pageNum * this.page.pageSize); this.suggestList1 = this.suggestList1.slice(
(this.page.pageNum - 1) * this.page.pageSize,
this.page.pageNum * this.page.pageSize
);
} else if (this.currentIndex4overview === 1) { } else if (this.currentIndex4overview === 1) {
this.total = this.suggestList2.length; this.total = this.suggestList2.length;
// 分页处理:提取当前页的数据 // 分页处理:提取当前页的数据
this.suggestList2 = this.suggestList2.slice((this.page.pageNum - 1) * this.page.pageSize, this.page.pageNum * this.page.pageSize); this.suggestList2 = this.suggestList2.slice(
(this.page.pageNum - 1) * this.page.pageSize,
this.page.pageNum * this.page.pageSize
);
} }
console.log(`当前页码: ${this.page.pageNum}, 总条目数: ${this.total}`); console.log(`当前页码: ${this.page.pageNum}, 总条目数: ${this.total}`);
}, },
async getKqTag() { async getKqTag() {
const result = await sendRequest( const result = await sendRequest("business/miningTag/listAll", "get", {
"business/miningTag/listAll", pageNum: 1,
"get", pageSize: 999,
{ });
pageNum:1,
pageSize:999,
}
);
this.KqTagList = result.rows; this.KqTagList = result.rows;
}, },
async mineralType() { async mineralType() {
const result = await sendRequest( const result = await sendRequest("business/mineralType/list", "get");
"business/mineralType/list" ,
"get",
);
this.minTypeList = result.rows; this.minTypeList = result.rows;
this.minTypeList.unshift({name:'全部'}) this.minTypeList.unshift({ name: "全部" });
}, },
async getSuggestList() { async getSuggestList() {
let that = this; let that = this;
...@@ -337,16 +368,22 @@ export default { ...@@ -337,16 +368,22 @@ export default {
this.suggestList = result.data.rows; this.suggestList = result.data.rows;
// 分别初始化 suggestList1 和 suggestList2 // 分别初始化 suggestList1 和 suggestList2
this.suggestList1 = filterByFields(this.suggestList, [{ chkqType: "采矿权" }]).slice( this.suggestList1 = filterByFields(this.suggestList, [
{ chkqType: "采矿权" },
]).slice(
(that.page.pageNum - 1) * that.page.pageSize, (that.page.pageNum - 1) * that.page.pageSize,
that.page.pageNum * that.page.pageSize that.page.pageNum * that.page.pageSize
); );
this.suggestList2 = filterByFields(this.suggestList, [{ chkqType: "探矿权" }]).slice( this.suggestList2 = filterByFields(this.suggestList, [
{ chkqType: "探矿权" },
]).slice(
(that.page.pageNum - 1) * that.page.pageSize, (that.page.pageNum - 1) * that.page.pageSize,
that.page.pageNum * that.page.pageSize that.page.pageNum * that.page.pageSize
); );
this.total = filterByFields(this.suggestList, [{ chkqType: "采矿权" }]).length; this.total = filterByFields(this.suggestList, [
{ chkqType: "采矿权" },
]).length;
return Promise.resolve(); return Promise.resolve();
}, },
...@@ -369,18 +406,18 @@ $border-color: #f1f1f1; ...@@ -369,18 +406,18 @@ $border-color: #f1f1f1;
.part6 { .part6 {
padding-top: 30px; padding-top: 30px;
position: relative; position: relative;
.tableWrapper { .tableWrapper {
width: 99%; width: 99%;
margin: 0 auto; margin: 0 auto;
overflow: hidden; overflow: hidden;
box-sizing: border-box; box-sizing: border-box;
margin-bottom: 20px; margin-bottom: 20px;
.block{ .block {
width: 100%; width: 100%;
} }
} }
.suggestype { .suggestype {
overflow: hidden; overflow: hidden;
margin-bottom: 20px; margin-bottom: 20px;
...@@ -571,10 +608,9 @@ body { ...@@ -571,10 +608,9 @@ body {
border-bottom: 1px solid #f3f3f3; border-bottom: 1px solid #f3f3f3;
box-sizing: border-box; box-sizing: border-box;
} }
} }
.top-zd{ .top-zd {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
......
<template> <template>
<div> <div>
<BackToTopButton /> <BackToTopButton />
<Header :activeIndex="2"/> <Header :activeIndex="2" />
<CommonDialog <CommonDialog
:show="dialogVisible" :show="dialogVisible"
@close-dialog="handleCloseDialog" @close-dialog="handleCloseDialog"
...@@ -11,9 +11,7 @@ ...@@ -11,9 +11,7 @@
<article> <article>
<div class="part part6"> <div class="part part6">
<div class="part-tit"> <div class="part-tit">
<h3 class="part-title"> <h3 class="part-title"><span>重点矿业权</span><span>推荐</span></h3>
<span>重点矿业权</span><span>推荐</span>
</h3>
</div> </div>
<div class="mt20"></div> <div class="mt20"></div>
<div class="top-zd"> <div class="top-zd">
...@@ -40,10 +38,10 @@ ...@@ -40,10 +38,10 @@
/> />
</el-select> </el-select>
</div> </div>
<div class="tableWrapper" v-show="currentIndex4overview===0"> <div class="tableWrapper">
<div <div
class="item" class="item"
v-for="(item, index1) in suggestList1" v-for="(item, index1) in suggestList"
:key="index1" :key="index1"
@click="clickVolume(item.id)" @click="clickVolume(item.id)"
> >
...@@ -82,7 +80,19 @@ ...@@ -82,7 +80,19 @@
}} }}
</p> </p>
<p>资源储量:{{ item.reservesScale || "-" }}</p> <p>资源储量:{{ item.reservesScale || "-" }}</p>
<img class="mining-tag" :src="baseApi+getValueByIdAndField(KqTagList,Number(item.miningLable[0]),'picUrl')" alt="" v-if="item.miningLable&&item.miningLable.length>0"> <img
class="mining-tag"
:src="
baseApi +
getValueByIdAndField(
KqTagList,
Number(item.miningLable[0]),
'picUrl'
)
"
alt=""
v-if="item.miningLable && item.miningLable.length > 0"
/>
</div> </div>
<!-- <p>整体转让</p> --> <!-- <p>整体转让</p> -->
<!-- <div class="item-right"> <!-- <div class="item-right">
...@@ -91,10 +101,8 @@ ...@@ -91,10 +101,8 @@
<div @click="openDia(item.websiteMiningTitle)">联系我们</div> <div @click="openDia(item.websiteMiningTitle)">联系我们</div>
</div> --> </div> -->
</div> </div>
<div v-if="suggestList1.length&&suggestList1.length% 2 != 0" class="item" style="visibility: hidden;">
</div>
</div> </div>
<div class="tableWrapper" v-show="currentIndex4overview===1"> <!-- <div class="tableWrapper" v-show="currentIndex4overview === 1">
<div <div
class="item" class="item"
v-for="(item, index1) in suggestList2" v-for="(item, index1) in suggestList2"
...@@ -135,28 +143,34 @@ ...@@ -135,28 +143,34 @@
}} }}
</p> </p>
<p>资源储量:{{ item.reservesScale || "-" }}</p> <p>资源储量:{{ item.reservesScale || "-" }}</p>
<img class="mining-tag" :src="baseApi+getValueByIdAndField(KqTagList,Number(item.miningLable[0]),'picUrl')" alt="" v-if="item.miningLable&&item.miningLable.length>0"> <img
class="mining-tag"
:src="
baseApi +
getValueByIdAndField(
KqTagList,
Number(item.miningLable[0]),
'picUrl'
)
"
alt=""
v-if="item.miningLable && item.miningLable.length > 0"
/>
</div> </div>
<!-- <p>整体转让</p> -->
<!-- <div class="item-right">
<p>面议</p>
<div @click="clickVolume(item.id)">查看详情</div>
<div @click="openDia(item.websiteMiningTitle)">联系我们</div>
</div> -->
</div> </div>
</div> </div> -->
</div> </div>
</article> </article>
</div> </div>
<div class="inner">
<!-- 加载状态提示 --> <el-pagination
<div class="loading-more" v-if="loading"> layout="prev, pager, next"
<i class="el-icon-loading"></i> :current-page="searchForm.pageNum"
<span>加载更多...</span> @current-change="changePage"
</div> :page-size="searchForm.pageSize"
<div class="no-more" v-if="!loading && !hasMore"> :total="total"
<span>没有更多内容了</span> >
</el-pagination>
</div> </div>
<Footer></Footer> <Footer></Footer>
...@@ -166,7 +180,7 @@ ...@@ -166,7 +180,7 @@
<script> <script>
// import Footer from '../../../components/Footer.vue' // import Footer from '../../../components/Footer.vue'
import sendRequest from "~/utils/request.js"; import sendRequest from "~/utils/request.js";
import { getDictLabelFromVal,filterByFields } from "~/utils/tyler"; import { getDictLabelFromVal, filterByFields } from "~/utils/tyler";
import Footer from "~/components/Footer.vue"; import Footer from "~/components/Footer.vue";
import BackToTopButton from "~/components/BackToTopButton.vue"; import BackToTopButton from "~/components/BackToTopButton.vue";
import HorizontalMenu from "~/components/header/HorizontalMenu.vue"; import HorizontalMenu from "~/components/header/HorizontalMenu.vue";
...@@ -183,18 +197,14 @@ export default { ...@@ -183,18 +197,14 @@ export default {
}, },
data() { data() {
return { return {
page:{ page: {},
pageNum:1, total: 0,
pageSize:9 minType: "",
}, minTypeList: [],
total:0,
minType:'全部',
minTypeList:[],
dialogVisible: false, dialogVisible: false,
omDemandName: "cs", omDemandName: "cs",
suggestList: [], suggestList: [],
suggestList1: [], suggestListShow: [],
suggestList2: [],
suggestType: 2, suggestType: 2,
baseApi: process.env.VUE_APP_File_VIEW, //"/prod-api", baseApi: process.env.VUE_APP_File_VIEW, //"/prod-api",
currentIndex4overview: 0, currentIndex4overview: 0,
...@@ -208,12 +218,11 @@ export default { ...@@ -208,12 +218,11 @@ export default {
mineListTotal: 0, mineListTotal: 0,
searchForm: { searchForm: {
isRecommendation: "Y", isRecommendation: "Y",
minType:'全部', minType: "全部",
pageNum: 1,
pageSize: 9,
}, },
KqTagList:[], KqTagList: [],
loading: false, // 是否正在加载
hasMore: true, // 是否还有更多内容
}; };
}, },
watch: {}, watch: {},
...@@ -222,7 +231,6 @@ export default { ...@@ -222,7 +231,6 @@ export default {
this.$wow.init({ animateClass: "animate__animated" }); this.$wow.init({ animateClass: "animate__animated" });
}); });
console.log("路由信息", this.$route.query);
this.suggestType = this.$route.query.id; this.suggestType = this.$route.query.id;
this.currentIndex4overview = this.$route.query.index * 1; this.currentIndex4overview = this.$route.query.index * 1;
...@@ -230,35 +238,19 @@ export default { ...@@ -230,35 +238,19 @@ export default {
this.getKqTag(); this.getKqTag();
this.getCommoncode(); this.getCommoncode();
this.mineralType(); this.mineralType();
// 添加滚动事件监听
window.addEventListener('scroll', this.handleScroll);
},
beforeDestroy() {
// 移除滚动事件监听
window.removeEventListener('scroll', this.handleScroll);
}, },
methods: { methods: {
getDictLabelFromVal, getDictLabelFromVal,
getValueByIdAndField(arr, id, field) { getValueByIdAndField(arr, id, field) {
const result = arr.find(item => item.id === id); const result = arr.find((item) => item.id === id);
return result ? result[field] : null; return result ? result[field] : null;
}, },
changePage(pageNum) { changePage(pageNum) {
console.log(pageNum ) this.getSuggestList();
this.page.pageNum = pageNum;
if(this.currentIndex4overview ===0){
this.suggestList1 = filterByFields(this.suggestList,[{chkqType:"采矿权"}]).slice((pageNum-1)*9, pageNum*9);
}else if(this.currentIndex4overview ===1){
this.suggestList2 = filterByFields(this.suggestList,[{chkqType:"探矿权"}]).slice((pageNum-1)*9, pageNum*9);
}
}, },
clickVolume(id, index) { clickVolume(id, index) {
const url = `/Transaction/minDet?id=${id}`; const url = `/Transaction/minDet?id=${id}`;
window.open(url, '_blank'); // '_blank' 表示在新标签页中打开 window.open(url, "_blank"); // '_blank' 表示在新标签页中打开
}, },
openDia(val) { openDia(val) {
this.dialogVisible = true; this.dialogVisible = true;
...@@ -268,81 +260,30 @@ export default { ...@@ -268,81 +260,30 @@ export default {
return arr.slice(0, num); return arr.slice(0, num);
}, },
changeSuggest(index, item) { changeSuggest(index, item) {
this.searchForm.minType = '全部' this.searchForm.dictLabel = item.dictLabel;
let that = this;
console.log(index, item);
this.page.pageNum = 1;
this.currentIndex4overview = index; this.currentIndex4overview = index;
this.suggestType = item.dictValue; this.getSuggestList();
// 重置加载状态
this.loading = false;
this.hasMore = true;
if(index === 0){
that.total = filterByFields(that.suggestList, [{chkqType:"采矿权"}]).length;
} else if(index === 1){
that.total = filterByFields(that.suggestList, [{chkqType:"探矿权"}]).length;
}
this.changePage(this.page.pageNum);
}, },
handleCloseDialog(newState) { handleCloseDialog(newState) {
this.dialogVisible = newState; this.dialogVisible = newState;
}, },
handleChange(val) { handleChange(val) {
// 重置当前页码到第一页 this.searchForm.minType = val;
this.page.pageNum = 1; this.getSuggestList();
// 初始化 suggestList1 和 suggestList2
this.suggestList1 = [];
this.suggestList2 = [];
// 根据所选矿种类型过滤数据
if (val === '全部') {
// 显示所有数据
this.suggestList1 = filterByFields(this.suggestList, [{ chkqType: "采矿权" }]);
this.suggestList2 = filterByFields(this.suggestList, [{ chkqType: "探矿权" }]);
} else {
// 根据所选矿种类型过滤
this.suggestList1 = filterByFields(this.suggestList, [{ chkqType: "采矿权", miningTypes: val }]);
this.suggestList2 = filterByFields(this.suggestList, [{ chkqType: "探矿权", miningTypes: val }]);
}
// 更新总条目数,确保分页组件正确显示
if (this.currentIndex4overview === 0) {
this.total = this.suggestList1.length;
// 分页处理:提取当前页的数据
this.suggestList1 = this.suggestList1.slice((this.page.pageNum - 1) * this.page.pageSize, this.page.pageNum * this.page.pageSize);
} else if (this.currentIndex4overview === 1) {
this.total = this.suggestList2.length;
// 分页处理:提取当前页的数据
this.suggestList2 = this.suggestList2.slice((this.page.pageNum - 1) * this.page.pageSize, this.page.pageNum * this.page.pageSize);
}
console.log(`当前页码: ${this.page.pageNum}, 总条目数: ${this.total}`);
}, },
async getKqTag() { async getKqTag() {
const result = await sendRequest( const result = await sendRequest("business/miningTag/listAll", "get", {
"business/miningTag/listAll", pageNum: 1,
"get", pageSize: 999,
{ });
pageNum:1,
pageSize:999,
}
);
this.KqTagList = result.rows; this.KqTagList = result.rows;
}, },
async mineralType() { async mineralType() {
const result = await sendRequest( const result = await sendRequest("business/mineralType/list", "get");
"business/mineralType/list" ,
"get",
);
this.minTypeList = result.rows; this.minTypeList = result.rows;
this.minTypeList.unshift({name:'全部'}) this.minTypeList.unshift({ name: "全部" });
}, },
async getSuggestList() { async getSuggestList() {
let that = this;
const result = await sendRequest( const result = await sendRequest(
"business/templateData/recommendMiningRights", "business/templateData/recommendMiningRights",
"get", "get",
...@@ -350,19 +291,7 @@ export default { ...@@ -350,19 +291,7 @@ export default {
); );
this.suggestList = result.data.rows; this.suggestList = result.data.rows;
this.total = result.data.total;
// 分别初始化 suggestList1 和 suggestList2
this.suggestList1 = filterByFields(this.suggestList, [{ chkqType: "采矿权" }]).slice(
(that.page.pageNum - 1) * that.page.pageSize,
that.page.pageNum * that.page.pageSize
);
this.suggestList2 = filterByFields(this.suggestList, [{ chkqType: "探矿权" }]).slice(
(that.page.pageNum - 1) * that.page.pageSize,
that.page.pageNum * that.page.pageSize
);
this.total = filterByFields(this.suggestList, [{ chkqType: "采矿权" }]).length;
return Promise.resolve(); return Promise.resolve();
}, },
async getCommoncode() { async getCommoncode() {
...@@ -372,43 +301,7 @@ export default { ...@@ -372,43 +301,7 @@ export default {
"get" "get"
); );
this.commonCode4mineRightType = mineRight.data; this.commonCode4mineRightType = mineRight.data;
}, console.log(this.commonCode4mineRightType, "1111");
handleScroll() {
// 获取滚动条滚动的距离
const scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
// 获取文档总高度
const scrollHeight = document.documentElement.scrollHeight || document.body.scrollHeight;
// 获取窗口的高度
const clientHeight = document.documentElement.clientHeight || document.body.clientHeight;
// 判断是否滚动到底部
if (scrollTop + clientHeight >= scrollHeight - 10) {
this.loadMoreData();
}
},
async loadMoreData() {
if (this.loading || !this.hasMore) {
return;
}
this.loading = true;
this.page.pageNum++;
let newList = [];
if(this.currentIndex4overview ===0){
newList = filterByFields(this.suggestList,[{chkqType:"采矿权"}]).slice((this.page.pageNum-1)*9, this.page.pageNum*9);
this.suggestList1 = [...this.suggestList1, ...newList];
}else if(this.currentIndex4overview ===1){
newList = filterByFields(this.suggestList,[{chkqType:"探矿权"}]).slice((this.page.pageNum-1)*9, this.page.pageNum*9);
this.suggestList2 = [...this.suggestList2, ...newList];
}
// 检查是否还有更多数据
if (newList.length < 9) {
this.hasMore = false;
}
this.loading = false;
}, },
}, },
}; };
...@@ -421,18 +314,18 @@ $border-color: #f1f1f1; ...@@ -421,18 +314,18 @@ $border-color: #f1f1f1;
.part6 { .part6 {
padding-top: 30px; padding-top: 30px;
position: relative; position: relative;
.tableWrapper { .tableWrapper {
width: 99%; width: 99%;
margin: 0 auto; margin: 0 auto;
overflow: hidden; overflow: hidden;
box-sizing: border-box; box-sizing: border-box;
margin-bottom: 20px; margin-bottom: 20px;
.block{ .block {
width: 100%; width: 100%;
} }
} }
.suggestype { .suggestype {
overflow: hidden; overflow: hidden;
margin-bottom: 20px; margin-bottom: 20px;
...@@ -623,29 +516,10 @@ body { ...@@ -623,29 +516,10 @@ body {
border-bottom: 1px solid #f3f3f3; border-bottom: 1px solid #f3f3f3;
box-sizing: border-box; box-sizing: border-box;
} }
} }
.top-zd{ .top-zd {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
</style>
/* 加载更多样式 */
.loading-more {
display: flex;
justify-content: center;
align-items: center;
padding: 10px 0;
color: #999;
font-size: 14px;
}
.no-more {
display: flex;
justify-content: center;
padding: 10px 0;
color: #999;
font-size: 14px;
}
</style>
\ No newline at end of file
This source diff could not be displayed because it is too large. You can view the blob instead.
<template> <template>
<div class="home"> <div class="home">
<dragDialog v-if="isModalVisible" @close-dialog="closeModal"/> <dragDialog v-if="isModalVisible" @close-dialog="closeModal" />
<div class="leave-msg" v-if="!isModalVisible" @click="openModal"> <div class="leave-msg" v-if="!isModalVisible" @click="openModal">
<div style="font-size: 32px;"><i class="el-icon-service"></i></div> <div style="font-size: 32px"><i class="el-icon-service"></i></div>
<div>留言</div> <div>留言</div>
</div> </div>
<!-- <BackToTopButton /> --> <!-- <BackToTopButton /> -->
<Header :activeIndex="0"/> <Header :activeIndex="0" />
<CommonDialog <CommonDialog
:show="dialogVisible" :show="dialogVisible"
@close-dialog="handleCloseDialog" @close-dialog="handleCloseDialog"
:omDemandName="omDemandName" :omDemandName="omDemandName"
/> />
<SideBarBox :show="true" :boxArr="sideBarItems"></SideBarBox> <SideBarBox :show="true" :boxArr="sideBarItems"></SideBarBox>
<div class="inner por marquee-out" v-if="marqueeData"> <div class="inner por marquee-out" v-if="marqueeData">
<img src="@/static/images/tout.png" alt=""> <img src="@/static/images/tout.png" alt="" />
<el-carousel height="40px" direction="vertical" arrow="never" indicator-position="none" :interval="5000"> <el-carousel
height="40px"
direction="vertical"
arrow="never"
indicator-position="none"
:interval="5000"
>
<el-carousel-item v-for="item in marqueeData" :key="item.id"> <el-carousel-item v-for="item in marqueeData" :key="item.id">
<p class="pmd-con" :title="item.pmdTitle">{{ item.pmdTitle }}</p> <p class="pmd-con" :title="item.pmdTitle">{{ item.pmdTitle }}</p>
</el-carousel-item> </el-carousel-item>
</el-carousel> </el-carousel>
</div> </div>
<div class="inner"> <div class="inner">
<div class="part part3" id="part3"> <div class="part part3" id="part3">
<div class="part-tit"> <div class="part-tit">
<h3 class="part-title"> <h3 class="part-title"><span>矿产资源</span><span>信息概览</span></h3>
<span>矿产资源</span><span>信息概览</span>
</h3>
<!-- <h6>中国有色金属之乡</h6> --> <!-- <h6>中国有色金属之乡</h6> -->
</div> </div>
<div class="part3-top"> <div class="part3-top">
<div class="part3-top-left" v-if="topTabIndex !== null"> <div class="part3-top-left" v-if="topTabIndex !== null">
<div
<div v-for="(item, index) in topTabData" v-show="topTabIndex === item.sort"> v-for="(item, index) in topTabData"
v-show="topTabIndex === item.sort"
>
<el-carousel <el-carousel
indicator-position="outside" indicator-position="outside"
:autoplay="true" :autoplay="true"
height="376px" height="376px"
:arrow="item.imagePathList&&item.imagePathList.length>1?'always':'never'" :arrow="
item.imagePathList && item.imagePathList.length > 1
? 'always'
: 'never'
"
> >
<el-carousel-item v-for="(img,j) in item.imagePathList" :key="j"> <el-carousel-item
v-for="(img, j) in item.imagePathList"
:key="j"
>
<div> <div>
<img :src="`${baseApi}${img}`" alt="" style="width: 100%;height: 376px;object-fit:cover"/> <img
:src="`${baseApi}${img}`"
alt=""
style="width: 100%; height: 376px; object-fit: cover"
/>
</div> </div>
</el-carousel-item> </el-carousel-item>
</el-carousel> </el-carousel>
</div> </div>
</div> </div>
...@@ -58,16 +72,24 @@ ...@@ -58,16 +72,24 @@
v-for="(item, index) in topTabData" v-for="(item, index) in topTabData"
:key="item.id" :key="item.id"
@mouseover="changeTab(item.sort)" @mouseover="changeTab(item.sort)"
:class="{ 'active-tab': Number(item.sort) == Number(topTabIndex) }" :class="{
'active-tab': Number(item.sort) == Number(topTabIndex),
}"
> >
<p>{{ item.title }}</p> <p>{{ item.title }}</p>
</li> </li>
</ul> </ul>
<div class="part3-top-content" v-for="(item, index) in topTabData" v-show="item.sort == topTabIndex" :key="item.id"> <div
class="part3-top-content"
v-for="(item, index) in topTabData"
v-show="item.sort == topTabIndex"
:key="item.id"
>
<div> <div>
<div class="disc"> <div class="disc">
<p v-for="des in splitStringByBackslashN(item.descriptions)">{{ des }}</p> <p v-for="des in splitStringByBackslashN(item.descriptions)">
{{ des }}
</p>
</div> </div>
</div> </div>
</div> </div>
...@@ -78,9 +100,7 @@ ...@@ -78,9 +100,7 @@
<div class="inner"> <div class="inner">
<div class="part part4" id="part4"> <div class="part part4" id="part4">
<div class="part-tit"> <div class="part-tit">
<h3 class="part-title"> <h3 class="part-title"><span>一平台</span><span>四中心</span></h3>
<span>一平台</span><span>四中心</span>
</h3>
<!-- <h6>中国有色金属之乡</h6> --> <!-- <h6>中国有色金属之乡</h6> -->
</div> </div>
<ul class="pt"> <ul class="pt">
...@@ -89,12 +109,12 @@ ...@@ -89,12 +109,12 @@
:key="index" :key="index"
@click="gotoPt(item.link)" @click="gotoPt(item.link)"
> >
<div class="tit"> <div class="tit">
<img :src="`${item.url}`" alt="" /> <img :src="`${item.url}`" alt="" />
<span>{{ item.tit }}</span> <span>{{ item.tit }}</span>
</div> </div>
<div class="eng">{{ item.eng }}</div> <div class="eng">{{ item.eng }}</div>
<p class="subtit">{{ item.subtit }}</p> <p class="subtit">{{ item.subtit }}</p>
<!-- <span class="subtit">{{ item.subtit }}</span> --> <!-- <span class="subtit">{{ item.subtit }}</span> -->
</li> </li>
</ul> </ul>
...@@ -103,9 +123,7 @@ ...@@ -103,9 +123,7 @@
<div class="partot" id="partot"> <div class="partot" id="partot">
<div class="inner"> <div class="inner">
<div class="part-tit"> <div class="part-tit">
<h3 class="part-title"> <h3 class="part-title"><span>赤峰矿业</span><span>集团</span></h3>
<span>赤峰矿业</span><span>集团</span>
</h3>
</div> </div>
</div> </div>
<div class="inner"> <div class="inner">
...@@ -115,15 +133,23 @@ ...@@ -115,15 +133,23 @@
class="section-right jingjizonglan" class="section-right jingjizonglan"
v-if="currentIndex4overview === 0" v-if="currentIndex4overview === 0"
> >
<el-carousel trigger="click" height="530px" arrow="hover" :interval="15000" :key="new Date().getTime()"> <el-carousel
trigger="click"
height="530px"
arrow="hover"
:interval="15000"
:key="new Date().getTime()"
>
<el-carousel-item> <el-carousel-item>
<div class="jituan_part1_item1"> <div class="jituan_part1_item1">
<div class="left"> <div class="left">
<p> <p>
矿业经济是赤峰市名符其实的支柱产业和重要的经济命脉,为进一步加强矿产资源勘查与开发。推动矿业经济做大做强,赤峰市委市政府加快培育全市矿业资源龙头企业,打造资本运营及投融资平台,2015年7月矿业公司应运而生,2017年赤峰矿业(集团) 有限责任公司正式成立,全面承担履行储备矿权、投资开发、矿业服务职责使命。 矿业经济是赤峰市名符其实的支柱产业和重要的经济命脉,为进一步加强矿产资源勘查与开发。推动矿业经济做大做强,赤峰市委市政府加快培育全市矿业资源龙头企业,打造资本运营及投融资平台,2015年7月矿业公司应运而生,2017年赤峰矿业(集团)
有限责任公司正式成立,全面承担履行储备矿权、投资开发、矿业服务职责使命。
</p> </p>
<p> <p>
赤峰矿业集团作为赤峰市政府发展、服务矿业经济的重要平台,注册资金1亿元,下设三个子公司(仁泰非金属、亿泰有色金属、贵金属) ,目前经营管理矿权49宗(其中非金属19宗、有色金属24宗、贵金属6宗)。 赤峰矿业集团作为赤峰市政府发展、服务矿业经济的重要平台,注册资金1亿元,下设三个子公司(仁泰非金属、亿泰有色金属、贵金属)
,目前经营管理矿权49宗(其中非金属19宗、有色金属24宗、贵金属6宗)。
</p> </p>
<img <img
src="@/static/images/home/jituan_part1_item1-1.png" src="@/static/images/home/jituan_part1_item1-1.png"
...@@ -142,31 +168,50 @@ ...@@ -142,31 +168,50 @@
<div class="jituan_part1_item2"> <div class="jituan_part1_item2">
<div class="top"> <div class="top">
<div class="itemInfo"> <div class="itemInfo">
<div class="headerTitle"><img src="@/static/images/home/jituan_part1_item2-1-1.png" alt=""><span>探矿勘查一批</span></div> <div class="headerTitle">
<img
src="@/static/images/home/jituan_part1_item2-1-1.png"
alt=""
/><span>探矿勘查一批</span>
</div>
<p> <p>
围绕战略矿种、优势矿种、新能源矿种,引进大型矿业企业进行风险探矿、合作开发,力争到2025年,重要矿产资源储量稳步增长,完成探矿50万延长米,新增有色金属矿石储量2亿吨以上。 围绕战略矿种、优势矿种、新能源矿种,引进大型矿业企业进行风险探矿、合作开发,力争到2025年,重要矿产资源储量稳步增长,完成探矿50万延长米,新增有色金属矿石储量2亿吨以上。
</p> </p>
</div> </div>
<div class="itemInfo"> <div class="itemInfo">
<div class="headerTitle"><img src="@/static/images/home/jituan_part1_item2-1-2.png" alt=""><span>合作开发一批</span></div> <div class="headerTitle">
<img
src="@/static/images/home/jituan_part1_item2-1-2.png"
alt=""
/><span>合作开发一批</span>
</div>
<p> <p>
对赤峰矿业集团经营管理的资源条件好、权属清晰的49宗矿业权,与有实力的国企民企合作开发。对由于企业资金短缺不能办理采矿权延续手续、探转采等相关手续的矿山企业,引进资金实力雄厚的大型企业合作开发,通过矿业权重组等方式联手开发。 对赤峰矿业集团经营管理的资源条件好、权属清晰的49宗矿业权,与有实力的国企民企合作开发。对由于企业资金短缺不能办理采矿权延续手续、探转采等相关手续的矿山企业,引进资金实力雄厚的大型企业合作开发,通过矿业权重组等方式联手开发。
</p> </p>
</div> </div>
<div class="itemInfo"> <div class="itemInfo">
<div class="headerTitle"><img src="@/static/images/home/jituan_part1_item2-1-3.png" alt=""><span>矿权整合一批</span></div> <div class="headerTitle">
<img
src="@/static/images/home/jituan_part1_item2-1-3.png"
alt=""
/><span>矿权整合一批</span>
</div>
<p> <p>
鼓励企业采取购买兼并、投资入股等方式,对小矿,小矿密集区,大矿小开的矿区进行整合。“十四五”期间,重点推进17个整合区,整含区面积约665平方公里。矿山总数由760个压减到680个以内,大中型矿山占比达到25%。 鼓励企业采取购买兼并、投资入股等方式,对小矿,小矿密集区,大矿小开的矿区进行整合。“十四五”期间,重点推进17个整合区,整含区面积约665平方公里。矿山总数由760个压减到680个以内,大中型矿山占比达到25%。
</p> </p>
</div> </div>
<div class="itemInfo"> <div class="itemInfo">
<div class="headerTitle"><img src="@/static/images/home/jituan_part1_item2-1-4.png" alt=""><span>招商引资一批</span></div> <div class="headerTitle">
<img
src="@/static/images/home/jituan_part1_item2-1-4.png"
alt=""
/><span>招商引资一批</span>
</div>
<p> <p>
引进大型矿业集团,通过并购重组等多种方式,盘活471个停产采矿权、453个探矿权,深度参与 资源开发利用,着眼矿业上下游产业短板,开展产业补链延链招商,构建健全完善的产业链条。 引进大型矿业集团,通过并购重组等多种方式,盘活471个停产采矿权、453个探矿权,深度参与
资源开发利用,着眼矿业上下游产业短板,开展产业补链延链招商,构建健全完善的产业链条。
</p> </p>
</div> </div>
</div> </div>
<div class="bottom"> <div class="bottom">
<img <img
...@@ -211,17 +256,20 @@ ...@@ -211,17 +256,20 @@
<ul> <ul>
<li <li
class="por" class="por"
v-for="item in IndustryChainList" :key="item.id" v-for="item in IndustryChainList"
:key="item.id"
@click="gotoIndustryChain(item.id)" @click="gotoIndustryChain(item.id)"
> >
<div class="productItem"> <div class="productItem">
<div class="left"> <div class="left">
<img :src="baseApi+item.ippPic" alt=""> <img :src="baseApi + item.ippPic" alt="" />
</div> </div>
<div class="right"> <div class="right">
<div class="top"> <div class="top">
<P>{{item.ippTitle}}</P> <P>{{ item.ippTitle }}</P>
<p v-if="item.releaseTime">{{formatDate(item.releaseTime)}}</p> <p v-if="item.releaseTime">
{{ formatDate(item.releaseTime) }}
</p>
</div> </div>
<p class="bottom" v-html="item.ippContent"></p> <p class="bottom" v-html="item.ippContent"></p>
</div> </div>
...@@ -236,17 +284,22 @@ ...@@ -236,17 +284,22 @@
<ul> <ul>
<li <li
class="por" class="por"
v-for="(item, index) in zhengceList" :key="index" v-for="(item, index) in zhengceList"
:key="index"
@click="gotoInvestmentPolicy(item.id)" @click="gotoInvestmentPolicy(item.id)"
> >
<div class="productItem"> <div class="productItem">
<div class="left"> <div class="left">
<img :src="`${baseApi}${item.ippPic}`" alt="" srcset="" /> <img
:src="`${baseApi}${item.ippPic}`"
alt=""
srcset=""
/>
</div> </div>
<div class="right"> <div class="right">
<div class="top"> <div class="top">
<P>{{item.ippTitle}}</P> <P>{{ item.ippTitle }}</P>
<p>{{formatDate(item.createTime)}}</p> <p>{{ formatDate(item.createTime) }}</p>
</div> </div>
<p class="bottom" v-html="item.ippContent"></p> <p class="bottom" v-html="item.ippContent"></p>
</div> </div>
...@@ -256,10 +309,18 @@ ...@@ -256,10 +309,18 @@
<div class="mt20"></div> <div class="mt20"></div>
</div> </div>
</div> </div>
<div class="section-right" v-show="currentIndex4overview === 3"> <div class="section-right" v-show="currentIndex4overview === 3">
<div class="part2-video"> <div class="part2-video">
<video v-if="videoData&&videoData.length>0" :poster="`${baseApi}${videoData[0].image}`" controls name="media"> <video
<source :src="`${baseApi}${videoData[0].videoPath}`" type="video/mp4"> v-if="videoData && videoData.length > 0"
:poster="`${baseApi}${videoData[0].image}`"
controls
name="media"
>
<source
:src="`${baseApi}${videoData[0].videoPath}`"
type="video/mp4"
/>
</video> </video>
</div> </div>
</div> </div>
...@@ -280,32 +341,23 @@ ...@@ -280,32 +341,23 @@
</section> </section>
</div> </div>
</div> </div>
<div class="mt40" ></div> <div class="mt40"></div>
<div class="inner"> <div class="inner">
<div class="part part5" id="part5"> <div class="part part5" id="part5">
<div class="part-tit"> <div class="part-tit">
<h3 class="part-title"> <h3 class="part-title"><span>推介</span><span>专题</span></h3>
<span>推介</span><span>专题</span>
</h3>
</div> </div>
<div class="mt30"></div> <div class="mt30"></div>
<CarouselIndex :arr="listComprehensiveAssemblyData"/> <CarouselIndex :arr="listComprehensiveAssemblyData" />
</div> </div>
</div> </div>
<div class="mt40" ></div> <div class="mt40"></div>
<div class="inner"> <div class="inner">
<div class="part part6" id="part6"> <div class="part part6" id="part6">
<div class="part-tit"> <div class="part-tit">
<h3 class="part-title"> <h3 class="part-title"><span>矿权</span><span>交易</span></h3>
<span>矿权</span><span>交易</span>
</h3>
</div> </div>
<div class="tc-tabs"> <div class="tc-tabs">
<ul class="suggestype"> <ul class="suggestype">
...@@ -320,8 +372,13 @@ ...@@ -320,8 +372,13 @@
</ul> </ul>
<a class="lookMore" @click="go2detail">查看更多>></a> <a class="lookMore" @click="go2detail">查看更多>></a>
</div> </div>
<div class="tableWrapper" v-show="currentIndexKQoverview===0"> <div class="tableWrapper" v-show="currentIndexKQoverview === 0">
<div class="item" v-for="(item, index1) in suggestList1" :key="index1" @click="clickVolume(item.id)"> <div
class="item"
v-for="(item, index1) in suggestList1"
:key="index1"
@click="clickVolume(item.id)"
>
<div class="img-box"> <div class="img-box">
<img <img
v-if="item.websiteMiningImage" v-if="item.websiteMiningImage"
...@@ -345,13 +402,29 @@ ...@@ -345,13 +402,29 @@
{{ item.averageQuality || "-" }} {{ item.averageQuality || "-" }}
</p> </p>
<p>资源储量:{{ item.reservesScale || "-" }}</p> <p>资源储量:{{ item.reservesScale || "-" }}</p>
<img class="mining-tag" :src="baseApi+getValueByIdAndField(KqTagList,Number(item.miningLable[0]),'picUrl')" alt="" v-if="item.miningLable&&item.miningLable.length>0"> <img
class="mining-tag"
:src="
baseApi +
getValueByIdAndField(
KqTagList,
Number(item.miningLable[0]),
'picUrl'
)
"
alt=""
v-if="item.miningLable && item.miningLable.length > 0"
/>
</div> </div>
</div> </div>
</div> </div>
<div class="tableWrapper" v-show="currentIndexKQoverview===1" > <div class="tableWrapper" v-show="currentIndexKQoverview === 1">
<div class="item" v-for="(item, index1) in suggestList2" :key="index1" @click="clickVolume(item.id)"> <div
class="item"
v-for="(item, index1) in suggestList2"
:key="index1"
@click="clickVolume(item.id)"
>
<div class="img-box"> <div class="img-box">
<img <img
class="left-img" class="left-img"
...@@ -372,33 +445,38 @@ ...@@ -372,33 +445,38 @@
</p> </p>
<p :title="item.averageQuality"> <p :title="item.averageQuality">
品位指标:{{ item.averageQuality || "-" }} 品位指标:{{ item.averageQuality || "-" }}
</p> </p>
<p>资源储量:{{ item.reservesScale || "-" }}</p> <p>资源储量:{{ item.reservesScale || "-" }}</p>
<img class="mining-tag" :src="baseApi+getValueByIdAndField(KqTagList,Number(item.miningLable[0]),'picUrl')" alt="" v-if="item.miningLable&&item.miningLable.length>0"> <img
class="mining-tag"
:src="
baseApi +
getValueByIdAndField(
KqTagList,
Number(item.miningLable[0]),
'picUrl'
)
"
alt=""
v-if="item.miningLable && item.miningLable.length > 0"
/>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="mt40" ></div> <div class="mt40"></div>
<div class="part part7" id="part7"> <div class="part part7" id="part7">
<div class="part-tit"> <div class="part-tit">
<h3 class="part-title"> <h3 class="part-title"><span>金融</span><span>服务</span></h3>
<span>金融</span><span>服务</span>
</h3>
</div> </div>
<div class="jr" @click="goto('/Business')"></div> <div class="jr" @click="goto('/Business')"></div>
</div> </div>
<div class="mt40" ></div> <div class="mt40"></div>
<div class="part part8" id="part8"> <div class="part part8" id="part8">
<div class="part-tit"> <div class="part-tit">
<h3 class="part-title"> <h3 class="part-title"><span>技术</span><span>服务</span></h3>
<span>技术</span><span>服务</span>
</h3>
</div> </div>
<div class="mt20" ></div> <div class="mt20"></div>
<div class="jsfw" @click="goto('/technicalDocking')"></div> <div class="jsfw" @click="goto('/technicalDocking')"></div>
</div> </div>
</div> </div>
...@@ -407,16 +485,14 @@ ...@@ -407,16 +485,14 @@
<ul> <ul>
<li v-for="item in friendlyLinkList" :key="item.id"> <li v-for="item in friendlyLinkList" :key="item.id">
<a :href="item.chkqLinkUrl" target="_blank"> <a :href="item.chkqLinkUrl" target="_blank">
<img :src="baseApi+item.image" :alt="item.chkqLinkname"> <img :src="baseApi + item.image" :alt="item.chkqLinkname" />
</a> </a>
</li> </li>
</ul> </ul>
</div> </div>
</div> </div>
<Footer></Footer> <Footer></Footer>
</div> </div>
</template> </template>
...@@ -427,7 +503,7 @@ import { ...@@ -427,7 +503,7 @@ import {
generateCarouselItems, generateCarouselItems,
extractContent, extractContent,
formatDate, formatDate,
filterByFields filterByFields,
} from "~/utils/tyler"; } from "~/utils/tyler";
import Footer from "~/components/Footer.vue"; import Footer from "~/components/Footer.vue";
...@@ -439,8 +515,8 @@ import CommonDialog from "~/components/dialog/CommonDialog.vue"; ...@@ -439,8 +515,8 @@ import CommonDialog from "~/components/dialog/CommonDialog.vue";
import HorizontalMenu from "~/components/header/HorizontalMenu.vue"; import HorizontalMenu from "~/components/header/HorizontalMenu.vue";
import Header from "~/components/header/Header.vue"; import Header from "~/components/header/Header.vue";
import CarouselIndex from "~/components/CarouselIndex.vue"; import CarouselIndex from "~/components/CarouselIndex.vue";
import SideBarBox from '@/components/SideBarBox.vue'; import SideBarBox from "@/components/SideBarBox.vue";
import dragDialog from '@/components/dialog/dragDialog.vue'; import dragDialog from "@/components/dialog/dragDialog.vue";
export default { export default {
head: { head: {
script: [ script: [
...@@ -468,19 +544,62 @@ export default { ...@@ -468,19 +544,62 @@ export default {
zhengceList: [], zhengceList: [],
videoSrc: null, videoSrc: null,
// currentIndex4overview: 3, // currentIndex4overview: 3,
currentIndexKQoverview:0, currentIndexKQoverview: 0,
sideBarItems: [ // 定义侧边栏数组 sideBarItems: [
// 定义侧边栏数组
// { id: 1, name: '资源概览',urlDef:require("~/static/images/sideLink/part1.png"),urlAct:require("~/static/images/sideLink/part1-act.png"), anchor: 'part1' }, // { id: 1, name: '资源概览',urlDef:require("~/static/images/sideLink/part1.png"),urlAct:require("~/static/images/sideLink/part1-act.png"), anchor: 'part1' },
{ id: 3, name: '矿产资/源概览',urlDef:require("~/static/images/sideLink/part4.png"),urlAct:require("~/static/images/sideLink/part4-act.png"), anchor: 'part3' }, {
{ id: 4, name: '一平台/四中心',urlDef:require("~/static/images/sideLink/part2.png"),urlAct:require("~/static/images/sideLink/part2-act.png"), anchor: 'part4' }, id: 3,
{ id: 5, name: '赤峰矿/业集团',urlDef:require("~/static/images/sideLink/part5.png"),urlAct:require("~/static/images/sideLink/part5-act.png"), anchor: 'partot' }, name: "矿产资/源概览",
urlDef: require("~/static/images/sideLink/part4.png"),
urlAct: require("~/static/images/sideLink/part4-act.png"),
anchor: "part3",
},
{
id: 4,
name: "一平台/四中心",
urlDef: require("~/static/images/sideLink/part2.png"),
urlAct: require("~/static/images/sideLink/part2-act.png"),
anchor: "part4",
},
{
id: 5,
name: "赤峰矿/业集团",
urlDef: require("~/static/images/sideLink/part5.png"),
urlAct: require("~/static/images/sideLink/part5-act.png"),
anchor: "partot",
},
// { id: 2, name: '宣传片',urlDef:require("~/static/images/sideLink/part3.png"),urlAct:require("~/static/images/sideLink/part3-act.png"), anchor: 'part2' }, // { id: 2, name: '宣传片',urlDef:require("~/static/images/sideLink/part3.png"),urlAct:require("~/static/images/sideLink/part3-act.png"), anchor: 'part2' },
{ id: 6, name: '推介专题',urlDef:require("~/static/images/sideLink/part6.png"),urlAct:require("~/static/images/sideLink/part6-act.png"), anchor: 'part5' }, {
{ id: 7, name: '矿权交易',urlDef:require("~/static/images/sideLink/part7.png"),urlAct:require("~/static/images/sideLink/part7-act.png"), anchor: 'part6' }, id: 6,
{ id: 8, name: '金融服务',urlDef:require("~/static/images/sideLink/part8.png"),urlAct:require("~/static/images/sideLink/part8-act.png"), anchor: 'part7' }, name: "推介专题",
{ id: 9, name: '技术服务',urlDef:require("~/static/images/sideLink/part9.png"),urlAct:require("~/static/images/sideLink/part9-act.png"), anchor: 'part8' }, urlDef: require("~/static/images/sideLink/part6.png"),
urlAct: require("~/static/images/sideLink/part6-act.png"),
anchor: "part5",
},
{
id: 7,
name: "矿权交易",
urlDef: require("~/static/images/sideLink/part7.png"),
urlAct: require("~/static/images/sideLink/part7-act.png"),
anchor: "part6",
},
{
id: 8,
name: "金融服务",
urlDef: require("~/static/images/sideLink/part8.png"),
urlAct: require("~/static/images/sideLink/part8-act.png"),
anchor: "part7",
},
{
id: 9,
name: "技术服务",
urlDef: require("~/static/images/sideLink/part9.png"),
urlAct: require("~/static/images/sideLink/part9-act.png"),
anchor: "part8",
},
], ],
overviewTypes: [ overviewTypes: [
{ {
...@@ -554,30 +673,34 @@ export default { ...@@ -554,30 +673,34 @@ export default {
{ {
tit: "矿业权交易中心", tit: "矿业权交易中心",
link: "/Transaction", link: "/Transaction",
eng:"Mining Rights Trading center", eng: "Mining Rights Trading center",
url: require("~/static/images/newHome/oficon1.png"), url: require("~/static/images/newHome/oficon1.png"),
subtit: "充分发挥两个发现(发现投资方、发现优质矿权),为投资方提供优质矿权,深入了解矿权详情,为矿权人寻找优质投资方,拓宽社会投资渠道,助力矿山加速生产", subtit:
"充分发挥两个发现(发现投资方、发现优质矿权),为投资方提供优质矿权,深入了解矿权详情,为矿权人寻找优质投资方,拓宽社会投资渠道,助力矿山加速生产",
}, },
{ {
tit: "金融投融资服务中心", tit: "金融投融资服务中心",
eng:"Financial Investment Center", eng: "Financial Investment Center",
link: "/Business", link: "/Business",
url: require("~/static/images/newHome/oficon2.png"), url: require("~/static/images/newHome/oficon2.png"),
subtit: "助力投资方、矿权人及社会人士资金回笼,提供多项金融支持、担保服务,助推实体经济发展", subtit:
"助力投资方、矿权人及社会人士资金回笼,提供多项金融支持、担保服务,助推实体经济发展",
}, },
{ {
tit: "专业技术服务中心", tit: "专业技术服务中心",
eng:"Professional Technical Center", eng: "Professional Technical Center",
link: "/technicalDocking", link: "/technicalDocking",
url: require("~/static/images/newHome/oficon3.png"), url: require("~/static/images/newHome/oficon3.png"),
subtit: "提供矿业全生命周期服务,从探矿到闭坑,全产业链一站式解决方案。内增外拓,助力矿山专业化、健康化发展", subtit:
"提供矿业全生命周期服务,从探矿到闭坑,全产业链一站式解决方案。内增外拓,助力矿山专业化、健康化发展",
}, },
{ {
tit: "矿业信息发布中心", tit: "矿业信息发布中心",
eng:"Mining lrormation Release Center", eng: "Mining lrormation Release Center",
link: '/Supply', link: "/Supply",
url: require("~/static/images/newHome/oficon4.png"), url: require("~/static/images/newHome/oficon4.png"),
subtit: "进一步推动矿山行业发展,消除信息差,实现信息对等。涵盖矿山行业衍生产业链信息,供求服务信息实现公开透明,信息聚集的专业化平台", subtit:
"进一步推动矿山行业发展,消除信息差,实现信息对等。涵盖矿山行业衍生产业链信息,供求服务信息实现公开透明,信息聚集的专业化平台",
}, },
], ],
miningData: [ miningData: [
...@@ -629,9 +752,7 @@ export default { ...@@ -629,9 +752,7 @@ export default {
], ],
topTabMiningIndex: 0, topTabMiningIndex: 0,
activeMap: "", activeMap: "",
topTabData: [ topTabData: [{ id: 1, descriptions: "", title: "", sort: 1 }],
{id:1,descriptions:'',title:'',sort:1}
],
topTabIndex: 1, topTabIndex: 1,
topCon1: "", topCon1: "",
topTabData1: [ topTabData1: [
...@@ -679,12 +800,12 @@ export default { ...@@ -679,12 +800,12 @@ export default {
listComprehensiveAssemblyData: [], listComprehensiveAssemblyData: [],
recommendedTopicData: [], recommendedTopicData: [],
suggestList: [], suggestList: [],
suggestList1:[], suggestList1: [],
suggestList2:[], suggestList2: [],
suggestType: 2, suggestType: 2,
currentIndex4overview: 0, currentIndex4overview: 0,
commonCode4mineRightType:[], commonCode4mineRightType: [],
commonCode4mineRightType4TJ:[], commonCode4mineRightType4TJ: [],
searchMap4label: [ searchMap4label: [
{ {
name: "矿权类型", name: "矿权类型",
...@@ -717,13 +838,12 @@ export default { ...@@ -717,13 +838,12 @@ export default {
dictData: [], dictData: [],
searchKey: "explorationProgress", searchKey: "explorationProgress",
}, },
], ],
// 有色金属 // 有色金属
IndustryChainList:[], IndustryChainList: [],
marqueeData:undefined, marqueeData: undefined,
KqTagList:[], KqTagList: [],
videoData:[], videoData: [],
}; };
}, },
head() { head() {
...@@ -751,7 +871,7 @@ export default { ...@@ -751,7 +871,7 @@ export default {
this.getZhengceList(); this.getZhengceList();
this.getKqTag(); this.getKqTag();
this.getVideo() this.getVideo();
this.marqueeFun(); this.marqueeFun();
}); });
}, },
...@@ -765,7 +885,7 @@ export default { ...@@ -765,7 +885,7 @@ export default {
this.isModalVisible = false; this.isModalVisible = false;
}, },
getValueByIdAndField(arr, id, field) { getValueByIdAndField(arr, id, field) {
const result = arr.find(item => item.id === id); const result = arr.find((item) => item.id === id);
return result ? result[field] : null; return result ? result[field] : null;
}, },
splitStringByBackslashN(inputString) { splitStringByBackslashN(inputString) {
...@@ -792,7 +912,7 @@ export default { ...@@ -792,7 +912,7 @@ export default {
"/business/mineralResourcesConfig/list", "/business/mineralResourcesConfig/list",
"get", "get",
{ {
isDisplay:"Y" isDisplay: "Y",
} }
); );
this.topTabData = [...result.rows]; this.topTabData = [...result.rows];
...@@ -800,10 +920,7 @@ export default { ...@@ -800,10 +920,7 @@ export default {
this.topTabIndex = result.rows[0].sort; this.topTabIndex = result.rows[0].sort;
}, },
async getVideo() { async getVideo() {
const result = await sendRequest( const result = await sendRequest("/business/video/list", "get");
"/business/video/list",
"get"
);
this.videoData = result.rows; this.videoData = result.rows;
}, },
async getZhengceList() { async getZhengceList() {
...@@ -811,7 +928,19 @@ export default { ...@@ -811,7 +928,19 @@ export default {
"/business/investmentPromotionPolicy/list?pageNum=1&pageSize=10000", "/business/investmentPromotionPolicy/list?pageNum=1&pageSize=10000",
"get" "get"
); );
this.zhengceList = result.rows; this.zhengceList = result.rows.map((item) => {
if (item.ippPic) {
item.ippPic = item.ippPic.replace(
/\/prod-api/g,
"https://cfkyw-package.oss-cn-beijing.aliyuncs.com"
);
item.ippContent = item.ippContent.replace(
/\/prod-api/g,
"https://cfkyw-package.oss-cn-beijing.aliyuncs.com"
);
}
return item;
});
}, },
async getSuggestList() { async getSuggestList() {
const result = await sendRequest( const result = await sendRequest(
...@@ -823,25 +952,39 @@ export default { ...@@ -823,25 +952,39 @@ export default {
} }
); );
this.suggestList = result.data.rows; this.suggestList = result.data.rows;
this.suggestList1 = this.sliceArray(filterByFields(this.suggestList,[{chkqType:"采矿权"}]),6); this.suggestList1 = this.sliceArray(
this.suggestList2 = this.sliceArray(filterByFields(this.suggestList,[{chkqType:"探矿权"}]),6); filterByFields(this.suggestList, [{ chkqType: "采矿权" }]),
6
);
this.suggestList2 = this.sliceArray(
filterByFields(this.suggestList, [{ chkqType: "探矿权" }]),
6
);
}, },
async getIndustryChain() { async getIndustryChain() {
const result = await sendRequest( const result = await sendRequest(
"/business/nonFerrousMetalIndustryChain/list?pageNum=1&pageSize=10000", "/business/nonFerrousMetalIndustryChain/list?pageNum=1&pageSize=10000",
"get" "get"
); );
this.IndustryChainList = result.rows; this.IndustryChainList = result.rows.map((item) => {
if (item.ippPic) {
item.ippPic = item.ippPic.replace(
/\/prod-api/g,
"https://cfkyw-package.oss-cn-beijing.aliyuncs.com"
);
item.ippContent = item.ippContent.replace(
/\/prod-api/g,
"https://cfkyw-package.oss-cn-beijing.aliyuncs.com"
);
}
return item;
});
}, },
async getKqTag() { async getKqTag() {
const result = await sendRequest( const result = await sendRequest("business/miningTag/listAll", "get", {
"business/miningTag/listAll", pageNum: 1,
"get", pageSize: 999,
{ });
pageNum:1,
pageSize:999,
}
);
this.KqTagList = result.rows; this.KqTagList = result.rows;
}, },
sliceArray(arr, num) { sliceArray(arr, num) {
...@@ -860,9 +1003,9 @@ export default { ...@@ -860,9 +1003,9 @@ export default {
goToCon(id) { goToCon(id) {
this.$router.push({ path: `/recommend/subject?id=${id}` }); this.$router.push({ path: `/recommend/subject?id=${id}` });
}, },
clickVolume(id, index) { clickVolume(id, index) {
const url = `/Transaction/minDet?id=${id}`; const url = `/Transaction/minDet?id=${id}`;
window.open(url, '_blank'); // '_blank' 表示在新标签页中打开 window.open(url, "_blank"); // '_blank' 表示在新标签页中打开
}, },
formatDate(timestamp) { formatDate(timestamp) {
const date = new Date(Date.parse(timestamp.split(" ")[0])); const date = new Date(Date.parse(timestamp.split(" ")[0]));
...@@ -897,27 +1040,26 @@ export default { ...@@ -897,27 +1040,26 @@ export default {
}, },
gotoPt(link) { gotoPt(link) {
// console.log(link) // console.log(link)
if(link){ if (link) {
this.$router.push({ this.$router.push({
path: link, path: link,
}); });
}else{ } else {
this.$message({ this.$message({
message: "开发中,敬请期待", message: "开发中,敬请期待",
type: "error", type: "error",
}); });
} }
}, },
gotoIndustryChain(id){ gotoIndustryChain(id) {
this.$router.push({ this.$router.push({
path: `/IndustryChain?id=${id}`, path: `/IndustryChain?id=${id}`,
}); });
}, },
gotoInvestmentPolicy(id){ gotoInvestmentPolicy(id) {
this.$router.push({ this.$router.push({
path: `/InvestmentPolicy?id=${id}`, path: `/InvestmentPolicy?id=${id}`,
}); });
}, },
changeTabMining(id) { changeTabMining(id) {
this.topTabMiningIndex = id; this.topTabMiningIndex = id;
...@@ -1078,15 +1220,11 @@ export default { ...@@ -1078,15 +1220,11 @@ export default {
return item; return item;
}); });
}, },
async marqueeFun(){ async marqueeFun() {
const marquee = await sendRequest( const marquee = await sendRequest("/system/paomadeng/listAll", "get", {
"/system/paomadeng/listAll", pmdType: "1",
"get", isDisplay: "Y",
{ });
pmdType:'1',
isDisplay:'Y'
}
);
this.marqueeData = marquee.rows; this.marqueeData = marquee.rows;
}, },
}, },
...@@ -1122,9 +1260,9 @@ export default { ...@@ -1122,9 +1260,9 @@ export default {
justify-content: center; justify-content: center;
& > li { & > li {
background: #fff; background: #fff;
border: 1px solid rgba(43, 101, 165, .12); border: 1px solid rgba(43, 101, 165, 0.12);
border-radius: 5px; border-radius: 5px;
box-shadow: 0 0 5px 0 hsla(0, 0%, 52%, .2); box-shadow: 0 0 5px 0 hsla(0, 0%, 52%, 0.2);
color: #3369f3; color: #3369f3;
cursor: pointer; cursor: pointer;
font-size: 16px; font-size: 16px;
...@@ -1132,7 +1270,7 @@ export default { ...@@ -1132,7 +1270,7 @@ export default {
margin: 28px 30px; margin: 28px 30px;
position: relative; position: relative;
text-transform: uppercase; text-transform: uppercase;
transition: all .5s ease; transition: all 0.5s ease;
width: 161px; width: 161px;
display: flex; display: flex;
align-items: center; align-items: center;
...@@ -1143,12 +1281,10 @@ export default { ...@@ -1143,12 +1281,10 @@ export default {
font-weight: 400; font-weight: 400;
color: #3c3c3c; color: #3c3c3c;
line-height: 23px; line-height: 23px;
} }
&.on { &.on {
background: #2677d0; background: #2677d0;
border: 1px solid rgba(43, 101, 165, .12); border: 1px solid rgba(43, 101, 165, 0.12);
color: #fff; color: #fff;
&::before { &::before {
content: ""; content: "";
...@@ -1239,7 +1375,7 @@ export default { ...@@ -1239,7 +1375,7 @@ export default {
color: #3f69f8; color: #3f69f8;
font-size: 20px; font-size: 20px;
} }
&::after{ &::after {
content: ""; content: "";
position: absolute; position: absolute;
left: 0px; left: 0px;
...@@ -1249,18 +1385,18 @@ export default { ...@@ -1249,18 +1385,18 @@ export default {
background: url("~/static/images/zcjd_img4.png") no-repeat; background: url("~/static/images/zcjd_img4.png") no-repeat;
background-size: 100%; background-size: 100%;
} }
&::before{ &::before {
content: ""; content: "";
position: absolute; position: absolute;
right: 0px; right: 0px;
top: 5px; top: 5px;
width: 142px; width: 142px;
height: 27px; height: 27px;
background: url("~/static/images/container-title-right.png") no-repeat center; background: url("~/static/images/container-title-right.png")
no-repeat center;
background-size: 100%; background-size: 100%;
} }
} }
} }
h1 { h1 {
color: #136fd0; color: #136fd0;
...@@ -1530,7 +1666,7 @@ export default { ...@@ -1530,7 +1666,7 @@ export default {
position: relative; position: relative;
min-width: 444px; min-width: 444px;
height: 520px; height: 520px;
margin: 34px 60px 0 0px; margin: 34px 60px 0 0px;
img.line1 { img.line1 {
display: block; display: block;
width: 80px; width: 80px;
...@@ -1566,13 +1702,12 @@ export default { ...@@ -1566,13 +1702,12 @@ export default {
margin-top: 54px; margin-top: 54px;
margin-left: 30px; margin-left: 30px;
> p { > p {
font-weight: bold; font-weight: bold;
color: #3f69f8; color: #3f69f8;
line-height: 31px; line-height: 31px;
font-size: 17px; font-size: 17px;
position: relative; position: relative;
// &::before{ // &::before{
// content: ""; // content: "";
// position: absolute; // position: absolute;
...@@ -1585,7 +1720,6 @@ export default { ...@@ -1585,7 +1720,6 @@ export default {
// } // }
} }
ul { ul {
width: 195px; width: 195px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
...@@ -1600,13 +1734,13 @@ export default { ...@@ -1600,13 +1734,13 @@ export default {
text-align: center; text-align: center;
word-spacing: 3px; word-spacing: 3px;
color: #666666; color: #666666;
background: #E8F1FA; background: #e8f1fa;
margin-bottom: 12px; margin-bottom: 12px;
box-shadow: 0px 2px 6px 0px rgba(43,101,165,0.2); box-shadow: 0px 2px 6px 0px rgba(43, 101, 165, 0.2);
border-radius: 5px; border-radius: 5px;
cursor: pointer; cursor: pointer;
&.map-active { &.map-active {
color:#fff; color: #fff;
background: #0f78e6; background: #0f78e6;
} }
} }
...@@ -1642,7 +1776,7 @@ export default { ...@@ -1642,7 +1776,7 @@ export default {
.data-item { .data-item {
display: grid; display: grid;
grid-template-columns: 6fr 3fr 2fr; grid-template-columns: 6fr 3fr 2fr;
.ziyuan{ .ziyuan {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
...@@ -1659,7 +1793,7 @@ export default { ...@@ -1659,7 +1793,7 @@ export default {
display: flex; display: flex;
justify-content: start; justify-content: start;
// width: 55%; // width: 55%;
letter-spacing: .2em; letter-spacing: 0.2em;
.data-item-con { .data-item-con {
font-size: 16px; font-size: 16px;
margin-right: 35px; margin-right: 35px;
...@@ -1697,14 +1831,14 @@ export default { ...@@ -1697,14 +1831,14 @@ export default {
} }
} }
.part2-video { .part2-video {
// width: 80%; // width: 80%;
margin: 0 30px; margin: 0 30px;
overflow: hidden; overflow: hidden;
video { video {
width: 100%; width: 100%;
height: 100%; height: 100%;
}
} }
}
.part3 { .part3 {
// padding: 20px; // padding: 20px;
margin-top: 0; margin-top: 0;
...@@ -1761,61 +1895,58 @@ export default { ...@@ -1761,61 +1895,58 @@ export default {
} }
} }
.part3-top-content { .part3-top-content {
width: 100%; width: 100%;
height: 100%; height: 100%;
padding:10px 0; padding: 10px 0;
box-sizing: border-box; box-sizing: border-box;
background-color: #fafafa; background-color: #fafafa;
overflow: hidden; overflow: hidden;
position: relative; position: relative;
&::before{ &::before {
content: ""; content: "";
position: absolute; position: absolute;
left:20px; left: 20px;
top:34px; top: 34px;
width: 1px; width: 1px;
height: 272px; height: 272px;
background: #dae3ee; background: #dae3ee;
z-index: 2; z-index: 2;
} }
&::after{ &::after {
content: ""; content: "";
position: absolute; position: absolute;
left:20px; left: 20px;
bottom:27px; bottom: 27px;
width: 272px; width: 272px;
height: 1px; height: 1px;
background: #dae3ee; background: #dae3ee;
z-index: 2; z-index: 2;
} }
} }
.part3-top-content > div { .part3-top-content > div {
width: 100%; width: 100%;
height: 100%; height: 100%;
overflow: hidden; overflow: hidden;
padding:20px 30px 40px 45px; padding: 20px 30px 40px 45px;
box-sizing: border-box; box-sizing: border-box;
position: relative; position: relative;
::after{ ::after {
content: ""; content: "";
position: absolute; position: absolute;
width: 25px; width: 25px;
height: 25px; height: 25px;
left:7px; left: 7px;
top:0px; top: 0px;
background: url("~/static/images/icon1.png"); background: url("~/static/images/icon1.png");
} }
} }
.part3-top-content > div .disc{ .part3-top-content > div .disc {
width: 100%; width: 100%;
height: 100%; height: 100%;
overflow: hidden; overflow: hidden;
overflow-y: scroll; overflow-y: scroll;
} }
.part3-top-content > div p { .part3-top-content > div p {
font-size: 16px; font-size: 16px;
...@@ -1824,7 +1955,7 @@ export default { ...@@ -1824,7 +1955,7 @@ export default {
line-height: 30px; line-height: 30px;
width: 100%; width: 100%;
} }
::-webkit-scrollbar{ ::-webkit-scrollbar {
display: none; display: none;
} }
} }
...@@ -1905,7 +2036,6 @@ export default { ...@@ -1905,7 +2036,6 @@ export default {
// background: url("~/static/images/newHome/p4bg.png") no-repeat center; // background: url("~/static/images/newHome/p4bg.png") no-repeat center;
background-size: 100%; background-size: 100%;
.inner { .inner {
} }
} }
.eco-chart { .eco-chart {
...@@ -1933,7 +2063,7 @@ export default { ...@@ -1933,7 +2063,7 @@ export default {
padding-right: 20px; padding-right: 20px;
box-sizing: border-box; box-sizing: border-box;
// margin: 0 8px; // margin: 0 8px;
.tit{ .tit {
margin-top: 20px; margin-top: 20px;
display: flex; display: flex;
align-items: center; align-items: center;
...@@ -1947,20 +2077,18 @@ export default { ...@@ -1947,20 +2077,18 @@ export default {
font-size: 26px; font-size: 26px;
color: #fff; color: #fff;
font-weight: bold; font-weight: bold;
letter-spacing: .1em; letter-spacing: 0.1em;
} }
} }
.eng{ .eng {
font-size: 16px; font-size: 16px;
color:#fff; color: #fff;
font-weight: normal; font-weight: normal;
} }
p.subtit { p.subtit {
margin-top: 40px; margin-top: 40px;
width:70% ; width: 70%;
font-size: 14px; font-size: 14px;
color: #fff; color: #fff;
text-align: justify; text-align: justify;
...@@ -1982,8 +2110,8 @@ export default { ...@@ -1982,8 +2110,8 @@ export default {
background: url("~/static/images/newHome/of4.png") no-repeat center; background: url("~/static/images/newHome/of4.png") no-repeat center;
background-size: 100%; background-size: 100%;
} }
&:hover{ &:hover {
background-size:110%; background-size: 110%;
} }
} }
} }
...@@ -2113,7 +2241,7 @@ export default { ...@@ -2113,7 +2241,7 @@ export default {
.friendship-link ul > li { .friendship-link ul > li {
width: 30%; width: 30%;
height: 98px; height: 98px;
border:1px solid #f3f3f3; border: 1px solid #f3f3f3;
margin-top: 20px; margin-top: 20px;
padding: 10px 20px; padding: 10px 20px;
box-sizing: border-box; box-sizing: border-box;
...@@ -2123,11 +2251,11 @@ export default { ...@@ -2123,11 +2251,11 @@ export default {
border-radius: 6px; border-radius: 6px;
background-color: #fff; background-color: #fff;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1); box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1);
img{ img {
width: 100%; width: 100%;
height: 78px; height: 78px;
object-fit: fill; object-fit: fill;
} }
} }
.friendship-link ul > li > a { .friendship-link ul > li > a {
width: 100%; width: 100%;
...@@ -2140,11 +2268,8 @@ export default { ...@@ -2140,11 +2268,8 @@ export default {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
</style> </style>
<style lang="scss" scoped> <style lang="scss" scoped>
@keyframes marquee { @keyframes marquee {
0% { 0% {
left: 100%; left: 100%;
...@@ -2165,31 +2290,30 @@ export default { ...@@ -2165,31 +2290,30 @@ export default {
white-space: nowrap; white-space: nowrap;
animation: marquee 20s linear infinite; animation: marquee 20s linear infinite;
font-size: 20px; font-size: 20px;
color:#11549d; color: #11549d;
} }
} }
.marquee:hover .noticeInfo{ .marquee:hover .noticeInfo {
animation-play-state: paused; animation-play-state: paused;
} }
@keyframes blink { @keyframes blink {
0% { 0% {
opacity: 1; opacity: 1;
} }
50% { 50% {
opacity: 0; opacity: 0;
} }
100% { 100% {
opacity: 1; opacity: 1;
} }
} }
.leave-msg{ .leave-msg {
position: fixed; position: fixed;
width: 88px; width: 88px;
height: 72px; height: 72px;
background-color: #fff; background-color: #fff;
bottom:calc(50% - 340px); bottom: calc(50% - 340px);
right: 20px; right: 20px;
z-index: 20; z-index: 20;
cursor: pointer; cursor: pointer;
...@@ -2207,14 +2331,16 @@ export default { ...@@ -2207,14 +2331,16 @@ export default {
box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, 0.12); box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, 0.12);
border-radius: 8px; border-radius: 8px;
border: 1px solid rgba(0, 0, 0, 0.05); border: 1px solid rgba(0, 0, 0, 0.05);
i{color:#0f78e6;font-weight: bold;} i {
&:hover{ color: #0f78e6;
font-weight: bold;
}
&:hover {
background-color: #0f78e6; background-color: #0f78e6;
color: #fff; color: #fff;
i{color:#fff;} i {
color: #fff;
}
} }
} }
</style>
</style>
\ No newline at end of file
/**
* Swiper 11.2.8
* Most modern mobile touch slider and framework with hardware accelerated transitions
* https://swiperjs.com
*
* Copyright 2014-2025 Vladimir Kharlampidi
*
* Released under the MIT License
*
* Released on: May 23, 2025
*/
@font-face {
font-family: swiper-icons;
src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA");
font-weight: 400;
font-style: normal;
}
:root {
--swiper-theme-color: #007aff;
}
:host {
position: relative;
display: block;
margin-left: auto;
margin-right: auto;
z-index: 1;
}
.swiper {
margin-left: auto;
margin-right: auto;
position: relative;
overflow: hidden;
list-style: none;
padding: 0;
z-index: 1;
display: block;
}
.swiper-vertical > .swiper-wrapper {
flex-direction: column;
}
.swiper-wrapper {
position: relative;
width: 100%;
height: 100%;
z-index: 1;
display: flex;
transition-property: transform;
transition-timing-function: var(
--swiper-wrapper-transition-timing-function,
initial
);
box-sizing: content-box;
}
.swiper-android .swiper-slide,
.swiper-ios .swiper-slide,
.swiper-wrapper {
transform: translate3d(0px, 0, 0);
}
.swiper-horizontal {
touch-action: pan-y;
}
.swiper-vertical {
touch-action: pan-x;
}
.swiper-slide {
flex-shrink: 0;
width: 100%;
height: 100%;
position: relative;
transition-property: transform;
display: block;
}
.swiper-slide-invisible-blank {
visibility: hidden;
}
.swiper-autoheight,
.swiper-autoheight .swiper-slide {
height: auto;
}
.swiper-autoheight .swiper-wrapper {
align-items: flex-start;
transition-property: transform, height;
}
.swiper-backface-hidden .swiper-slide {
transform: translateZ(0);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.swiper-3d.swiper-css-mode .swiper-wrapper {
perspective: 1200px;
}
.swiper-3d .swiper-wrapper {
transform-style: preserve-3d;
}
.swiper-3d {
perspective: 1200px;
}
.swiper-3d .swiper-cube-shadow,
.swiper-3d .swiper-slide {
transform-style: preserve-3d;
}
.swiper-css-mode > .swiper-wrapper {
overflow: auto;
scrollbar-width: none;
-ms-overflow-style: none;
}
.swiper-css-mode > .swiper-wrapper::-webkit-scrollbar {
display: none;
}
.swiper-css-mode > .swiper-wrapper > .swiper-slide {
scroll-snap-align: start start;
}
.swiper-css-mode.swiper-horizontal > .swiper-wrapper {
scroll-snap-type: x mandatory;
}
.swiper-css-mode.swiper-vertical > .swiper-wrapper {
scroll-snap-type: y mandatory;
}
.swiper-css-mode.swiper-free-mode > .swiper-wrapper {
scroll-snap-type: none;
}
.swiper-css-mode.swiper-free-mode > .swiper-wrapper > .swiper-slide {
scroll-snap-align: none;
}
.swiper-css-mode.swiper-centered > .swiper-wrapper::before {
content: "";
flex-shrink: 0;
order: 9999;
}
.swiper-css-mode.swiper-centered > .swiper-wrapper > .swiper-slide {
scroll-snap-align: center center;
scroll-snap-stop: always;
}
.swiper-css-mode.swiper-centered.swiper-horizontal
> .swiper-wrapper
> .swiper-slide:first-child {
margin-inline-start: var(--swiper-centered-offset-before);
}
.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper::before {
height: 100%;
min-height: 1px;
width: var(--swiper-centered-offset-after);
}
.swiper-css-mode.swiper-centered.swiper-vertical
> .swiper-wrapper
> .swiper-slide:first-child {
margin-block-start: var(--swiper-centered-offset-before);
}
.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper::before {
width: 100%;
min-width: 1px;
height: var(--swiper-centered-offset-after);
}
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 10;
}
.swiper-3d .swiper-slide-shadow {
background: rgba(0, 0, 0, 0.15);
}
.swiper-3d .swiper-slide-shadow-left {
background-image: linear-gradient(
to left,
rgba(0, 0, 0, 0.5),
rgba(0, 0, 0, 0)
);
}
.swiper-3d .swiper-slide-shadow-right {
background-image: linear-gradient(
to right,
rgba(0, 0, 0, 0.5),
rgba(0, 0, 0, 0)
);
}
.swiper-3d .swiper-slide-shadow-top {
background-image: linear-gradient(
to top,
rgba(0, 0, 0, 0.5),
rgba(0, 0, 0, 0)
);
}
.swiper-3d .swiper-slide-shadow-bottom {
background-image: linear-gradient(
to bottom,
rgba(0, 0, 0, 0.5),
rgba(0, 0, 0, 0)
);
}
.swiper-lazy-preloader {
width: 42px;
height: 42px;
position: absolute;
left: 50%;
top: 50%;
margin-left: -21px;
margin-top: -21px;
z-index: 10;
transform-origin: 50%;
box-sizing: border-box;
border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
border-radius: 50%;
border-top-color: transparent;
}
.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,
.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader {
animation: swiper-preloader-spin 1s infinite linear;
}
.swiper-lazy-preloader-white {
--swiper-preloader-color: #fff;
}
.swiper-lazy-preloader-black {
--swiper-preloader-color: #000;
}
@keyframes swiper-preloader-spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.swiper-virtual .swiper-slide {
-webkit-backface-visibility: hidden;
transform: translateZ(0);
}
.swiper-virtual.swiper-css-mode .swiper-wrapper::after {
content: "";
position: absolute;
left: 0;
top: 0;
pointer-events: none;
}
.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after {
height: 1px;
width: var(--swiper-virtual-size);
}
.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after {
width: 1px;
height: var(--swiper-virtual-size);
}
:root {
--swiper-navigation-size: 44px;
}
.swiper-button-next,
.swiper-button-prev {
position: absolute;
top: var(--swiper-navigation-top-offset, 50%);
width: calc(var(--swiper-navigation-size) / 44 * 27);
height: var(--swiper-navigation-size);
margin-top: calc(0px - (var(--swiper-navigation-size) / 2));
z-index: 10;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
color: var(--swiper-navigation-color, var(--swiper-theme-color));
}
.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
opacity: 0.35;
cursor: auto;
pointer-events: none;
}
.swiper-button-next.swiper-button-hidden,
.swiper-button-prev.swiper-button-hidden {
opacity: 0;
cursor: auto;
pointer-events: none;
}
.swiper-navigation-disabled .swiper-button-next,
.swiper-navigation-disabled .swiper-button-prev {
display: none !important;
}
.swiper-button-next svg,
.swiper-button-prev svg {
width: 100%;
height: 100%;
object-fit: contain;
transform-origin: center;
}
.swiper-rtl .swiper-button-next svg,
.swiper-rtl .swiper-button-prev svg {
transform: rotate(180deg);
}
.swiper-button-prev,
.swiper-rtl .swiper-button-next {
left: var(--swiper-navigation-sides-offset, 10px);
right: auto;
}
.swiper-button-next,
.swiper-rtl .swiper-button-prev {
right: var(--swiper-navigation-sides-offset, 10px);
left: auto;
}
.swiper-button-lock {
display: none;
}
.swiper-button-next:after,
.swiper-button-prev:after {
font-family: swiper-icons;
font-size: var(--swiper-navigation-size);
text-transform: none !important;
letter-spacing: 0;
font-variant: initial;
line-height: 1;
}
.swiper-button-prev:after,
.swiper-rtl .swiper-button-next:after {
content: "prev";
}
.swiper-button-next,
.swiper-rtl .swiper-button-prev {
right: var(--swiper-navigation-sides-offset, 10px);
left: auto;
}
.swiper-button-next:after,
.swiper-rtl .swiper-button-prev:after {
content: "next";
}
.swiper-pagination {
position: absolute;
text-align: center;
transition: 0.3s opacity;
transform: translate3d(0, 0, 0);
z-index: 10;
}
.swiper-pagination.swiper-pagination-hidden {
opacity: 0;
}
.swiper-pagination-disabled > .swiper-pagination,
.swiper-pagination.swiper-pagination-disabled {
display: none !important;
}
.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction {
bottom: var(--swiper-pagination-bottom, 8px);
top: var(--swiper-pagination-top, auto);
left: 0;
width: 100%;
}
.swiper-pagination-bullets-dynamic {
overflow: hidden;
font-size: 0;
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
transform: scale(0.33);
position: relative;
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
transform: scale(1);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
transform: scale(1);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
transform: scale(0.33);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
transform: scale(0.33);
}
.swiper-pagination-bullet {
width: var(
--swiper-pagination-bullet-width,
var(--swiper-pagination-bullet-size, 8px)
);
height: var(
--swiper-pagination-bullet-height,
var(--swiper-pagination-bullet-size, 8px)
);
display: inline-block;
border-radius: var(--swiper-pagination-bullet-border-radius, 50%);
background: var(--swiper-pagination-bullet-inactive-color, #000);
opacity: var(--swiper-pagination-bullet-inactive-opacity, 0.2);
}
button.swiper-pagination-bullet {
border: none;
margin: 0;
padding: 0;
box-shadow: none;
-webkit-appearance: none;
appearance: none;
}
.swiper-pagination-clickable .swiper-pagination-bullet {
cursor: pointer;
}
.swiper-pagination-bullet:only-child {
display: none !important;
}
.swiper-pagination-bullet-active {
opacity: var(--swiper-pagination-bullet-opacity, 1);
background: var(--swiper-pagination-color, var(--swiper-theme-color));
}
.swiper-pagination-vertical.swiper-pagination-bullets,
.swiper-vertical > .swiper-pagination-bullets {
right: var(--swiper-pagination-right, 8px);
left: var(--swiper-pagination-left, auto);
top: 50%;
transform: translate3d(0px, -50%, 0);
}
.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0;
display: block;
}
.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-vertical
> .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
top: 50%;
transform: translateY(-50%);
width: 8px;
}
.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic
.swiper-pagination-bullet,
.swiper-vertical
> .swiper-pagination-bullets.swiper-pagination-bullets-dynamic
.swiper-pagination-bullet {
display: inline-block;
transition: 0.2s transform, 0.2s top;
}
.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets
.swiper-pagination-bullet {
margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px);
}
.swiper-horizontal
> .swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
left: 50%;
transform: translateX(-50%);
white-space: nowrap;
}
.swiper-horizontal
> .swiper-pagination-bullets.swiper-pagination-bullets-dynamic
.swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic
.swiper-pagination-bullet {
transition: 0.2s transform, 0.2s left;
}
.swiper-horizontal.swiper-rtl
> .swiper-pagination-bullets-dynamic
.swiper-pagination-bullet {
transition: 0.2s transform, 0.2s right;
}
.swiper-pagination-fraction {
color: var(--swiper-pagination-fraction-color, inherit);
}
.swiper-pagination-progressbar {
background: var(
--swiper-pagination-progressbar-bg-color,
rgba(0, 0, 0, 0.25)
);
position: absolute;
}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
background: var(--swiper-pagination-color, var(--swiper-theme-color));
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
transform: scale(0);
transform-origin: left top;
}
.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
transform-origin: right top;
}
.swiper-horizontal > .swiper-pagination-progressbar,
.swiper-pagination-progressbar.swiper-pagination-horizontal,
.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,
.swiper-vertical
> .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
width: 100%;
height: var(--swiper-pagination-progressbar-size, 4px);
left: 0;
top: 0;
}
.swiper-horizontal
> .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-vertical,
.swiper-vertical > .swiper-pagination-progressbar {
width: var(--swiper-pagination-progressbar-size, 4px);
height: 100%;
left: 0;
top: 0;
}
.swiper-pagination-lock {
display: none;
}
.swiper-scrollbar {
border-radius: var(--swiper-scrollbar-border-radius, 10px);
position: relative;
touch-action: none;
background: var(--swiper-scrollbar-bg-color, rgba(0, 0, 0, 0.1));
}
.swiper-scrollbar-disabled > .swiper-scrollbar,
.swiper-scrollbar.swiper-scrollbar-disabled {
display: none !important;
}
.swiper-horizontal > .swiper-scrollbar,
.swiper-scrollbar.swiper-scrollbar-horizontal {
position: absolute;
left: var(--swiper-scrollbar-sides-offset, 1%);
bottom: var(--swiper-scrollbar-bottom, 4px);
top: var(--swiper-scrollbar-top, auto);
z-index: 50;
height: var(--swiper-scrollbar-size, 4px);
width: calc(100% - 2 * var(--swiper-scrollbar-sides-offset, 1%));
}
.swiper-scrollbar.swiper-scrollbar-vertical,
.swiper-vertical > .swiper-scrollbar {
position: absolute;
left: var(--swiper-scrollbar-left, auto);
right: var(--swiper-scrollbar-right, 4px);
top: var(--swiper-scrollbar-sides-offset, 1%);
z-index: 50;
width: var(--swiper-scrollbar-size, 4px);
height: calc(100% - 2 * var(--swiper-scrollbar-sides-offset, 1%));
}
.swiper-scrollbar-drag {
height: 100%;
width: 100%;
position: relative;
background: var(--swiper-scrollbar-drag-bg-color, rgba(0, 0, 0, 0.5));
border-radius: var(--swiper-scrollbar-border-radius, 10px);
left: 0;
top: 0;
}
.swiper-scrollbar-cursor-drag {
cursor: move;
}
.swiper-scrollbar-lock {
display: none;
}
.swiper-zoom-container {
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
}
.swiper-zoom-container > canvas,
.swiper-zoom-container > img,
.swiper-zoom-container > svg {
max-width: 100%;
max-height: 100%;
object-fit: contain;
}
.swiper-slide-zoomed {
cursor: move;
touch-action: none;
}
.swiper .swiper-notification {
position: absolute;
left: 0;
top: 0;
pointer-events: none;
opacity: 0;
z-index: -1000;
}
.swiper-free-mode > .swiper-wrapper {
transition-timing-function: ease-out;
margin: 0 auto;
}
.swiper-grid > .swiper-wrapper {
flex-wrap: wrap;
}
.swiper-grid-column > .swiper-wrapper {
flex-wrap: wrap;
flex-direction: column;
}
.swiper-fade.swiper-free-mode .swiper-slide {
transition-timing-function: ease-out;
}
.swiper-fade .swiper-slide {
pointer-events: none;
transition-property: opacity;
}
.swiper-fade .swiper-slide .swiper-slide {
pointer-events: none;
}
.swiper-fade .swiper-slide-active {
pointer-events: auto;
}
.swiper-fade .swiper-slide-active .swiper-slide-active {
pointer-events: auto;
}
.swiper.swiper-cube {
overflow: visible;
}
.swiper-cube .swiper-slide {
pointer-events: none;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
z-index: 1;
visibility: hidden;
transform-origin: 0 0;
width: 100%;
height: 100%;
}
.swiper-cube .swiper-slide .swiper-slide {
pointer-events: none;
}
.swiper-cube.swiper-rtl .swiper-slide {
transform-origin: 100% 0;
}
.swiper-cube .swiper-slide-active,
.swiper-cube .swiper-slide-active .swiper-slide-active {
pointer-events: auto;
}
.swiper-cube .swiper-slide-active,
.swiper-cube .swiper-slide-next,
.swiper-cube .swiper-slide-prev {
pointer-events: auto;
visibility: visible;
}
.swiper-cube .swiper-cube-shadow {
position: absolute;
left: 0;
bottom: 0px;
width: 100%;
height: 100%;
opacity: 0.6;
z-index: 0;
}
.swiper-cube .swiper-cube-shadow:before {
content: "";
background: #000;
position: absolute;
left: 0;
top: 0;
bottom: 0;
right: 0;
filter: blur(50px);
}
.swiper-cube .swiper-slide-next + .swiper-slide {
pointer-events: auto;
visibility: visible;
}
.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-bottom,
.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-left,
.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-right,
.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top {
z-index: 0;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.swiper.swiper-flip {
overflow: visible;
}
.swiper-flip .swiper-slide {
pointer-events: none;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
z-index: 1;
}
.swiper-flip .swiper-slide .swiper-slide {
pointer-events: none;
}
.swiper-flip .swiper-slide-active,
.swiper-flip .swiper-slide-active .swiper-slide-active {
pointer-events: auto;
}
.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-bottom,
.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-left,
.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-right,
.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-top {
z-index: 0;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.swiper-creative .swiper-slide {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
overflow: hidden;
transition-property: transform, opacity, height;
}
.swiper.swiper-cards {
overflow: visible;
}
.swiper-cards .swiper-slide {
transform-origin: center bottom;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
overflow: hidden;
}
This source diff could not be displayed because it is too large. You can view the blob instead.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment