|
|
|
|
@ -1,338 +1,341 @@ |
|
|
|
|
<template> |
|
|
|
|
<div v-show="loaded" v-loading="loading" |
|
|
|
|
:class="['wrap', { activity: info.listStyleId === 15, party: info.listStyleId === 68 }]"> |
|
|
|
|
<div class="banner fadeInUp"> |
|
|
|
|
<img width="100%" height="280" :src="info.columnBanner" alt="" /> |
|
|
|
|
<div class="texts"> |
|
|
|
|
<p class="text">{{ info.columnName }}</p> |
|
|
|
|
<p class="sub">{{ info.subtitle }}</p> |
|
|
|
|
<div :class="['wrap', { activity: info.listStyleId === 15, party: info.listStyleId === 68 }]"> |
|
|
|
|
<div v-show="loaded" v-loading="loading"> |
|
|
|
|
<div class="banner fadeInUp"> |
|
|
|
|
<img width="100%" height="280" :src="info.columnBanner" alt="" /> |
|
|
|
|
<div class="texts"> |
|
|
|
|
<p class="text">{{ info.columnName }}</p> |
|
|
|
|
<p class="sub">{{ info.subtitle }}</p> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="column-wrap"> |
|
|
|
|
<div class="article"> |
|
|
|
|
<div class="left"> |
|
|
|
|
<!-- 文章：侧边栏+搜索+新闻列表 --> |
|
|
|
|
<div v-if="info.listStyleId === 10" class="forms"> |
|
|
|
|
<div class="item"> |
|
|
|
|
<span class="label">{{ $t('column.classification') }}：</span> |
|
|
|
|
<el-select v-model="form.classificationId" @change="filter"> |
|
|
|
|
<el-option :label="$t('column.all')" :value="null"></el-option> |
|
|
|
|
<el-option v-for="item in classifications" :key="item.id" :label="item.classificationName" |
|
|
|
|
:value="item.id"> |
|
|
|
|
</el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</div> |
|
|
|
|
<div class="item"> |
|
|
|
|
<span class="label">{{ $t('column.label') }}：</span> |
|
|
|
|
<el-select ref="search" v-model="lableId" multiple @change="filter"> |
|
|
|
|
<el-option v-for="item in labels" :key="item.id" :label="item.labelName" :value="item.id"> </el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</div> |
|
|
|
|
<div class="search"> |
|
|
|
|
<input type="text" :placeholder="$t('column.titlePlaceholder')" v-model="form.title" /> |
|
|
|
|
<div class="column-wrap"> |
|
|
|
|
<div class="article"> |
|
|
|
|
<div class="left"> |
|
|
|
|
<!-- 文章：侧边栏+搜索+新闻列表 --> |
|
|
|
|
<div v-if="info.listStyleId === 10" class="forms"> |
|
|
|
|
<div class="item"> |
|
|
|
|
<span class="label">{{ $t('column.classification') }}：</span> |
|
|
|
|
<el-select v-model="form.classificationId" @change="filter"> |
|
|
|
|
<el-option :label="$t('column.all')" :value="null"></el-option> |
|
|
|
|
<el-option v-for="item in classifications" :key="item.id" :label="item.classificationName" |
|
|
|
|
:value="item.id"> |
|
|
|
|
</el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</div> |
|
|
|
|
<div class="item"> |
|
|
|
|
<span class="label">{{ $t('column.label') }}：</span> |
|
|
|
|
<el-select ref="search" v-model="lableId" multiple @change="filter"> |
|
|
|
|
<el-option v-for="item in labels" :key="item.id" :label="item.labelName" :value="item.id"> |
|
|
|
|
</el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</div> |
|
|
|
|
<div class="search"> |
|
|
|
|
<input type="text" :placeholder="$t('column.titlePlaceholder')" v-model="form.title" /> |
|
|
|
|
|
|
|
|
|
<!-- <i class="icon"> |
|
|
|
|
<!-- <i class="icon"> |
|
|
|
|
<img src="@/assets/images/search-white.png" alt="" /> |
|
|
|
|
</i> --> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<!-- 侧导航+新闻列表(含文章概述) --> |
|
|
|
|
<div v-if="info.listStyleId === 12" class="forms"> |
|
|
|
|
<div class="item"> |
|
|
|
|
<span class="label">{{ $t('column.classification') }}：</span> |
|
|
|
|
<el-select v-model="form.classificationId" @change="filter"> |
|
|
|
|
<el-option :label="$t('column.all')" :value="null"></el-option> |
|
|
|
|
<el-option v-for="item in classifications" :key="item.id" :label="item.classificationName" |
|
|
|
|
:value="item.id"> |
|
|
|
|
</el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</div> |
|
|
|
|
<div class="item"> |
|
|
|
|
<span class="label">{{ $t('column.label') }}：</span> |
|
|
|
|
<el-select ref="search" v-model="lableId" multiple @change="filter"> |
|
|
|
|
<el-option v-for="item in labels" :key="item.id" :label="item.labelName" :value="item.id"> </el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</div> |
|
|
|
|
<div class="search"> |
|
|
|
|
<input type="text" :placeholder="$t('column.titlePlaceholder')" v-model="form.title" /> |
|
|
|
|
<!-- <i class="icon"> |
|
|
|
|
<!-- 侧导航+新闻列表(含文章概述) --> |
|
|
|
|
<div v-if="info.listStyleId === 12" class="forms"> |
|
|
|
|
<div class="item"> |
|
|
|
|
<span class="label">{{ $t('column.classification') }}：</span> |
|
|
|
|
<el-select v-model="form.classificationId" @change="filter"> |
|
|
|
|
<el-option :label="$t('column.all')" :value="null"></el-option> |
|
|
|
|
<el-option v-for="item in classifications" :key="item.id" :label="item.classificationName" |
|
|
|
|
:value="item.id"> |
|
|
|
|
</el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</div> |
|
|
|
|
<div class="item"> |
|
|
|
|
<span class="label">{{ $t('column.label') }}：</span> |
|
|
|
|
<el-select ref="search" v-model="lableId" multiple @change="filter"> |
|
|
|
|
<el-option v-for="item in labels" :key="item.id" :label="item.labelName" :value="item.id"> |
|
|
|
|
</el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</div> |
|
|
|
|
<div class="search"> |
|
|
|
|
<input type="text" :placeholder="$t('column.titlePlaceholder')" v-model="form.title" /> |
|
|
|
|
<!-- <i class="icon"> |
|
|
|
|
<img src="@/assets/images/search-white.png" alt="" /> |
|
|
|
|
</i> --> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<!-- 会议活动：筛选+会议活动列表 --> |
|
|
|
|
<div v-if="info.listStyleId === 15" class="forms"> |
|
|
|
|
<ul class="switch"> |
|
|
|
|
<li v-for="(item, i) in convokeTypes" :key="i" :class="{ active: item.id === form.convokeType }" |
|
|
|
|
@click="switchChange(item)"> |
|
|
|
|
{{ item.name }} |
|
|
|
|
</li> |
|
|
|
|
</ul> |
|
|
|
|
<div class="item"> |
|
|
|
|
<span class="label">{{ $t('column.classification') }}：</span> |
|
|
|
|
<el-select v-model="form.classificationId" @change="filter"> |
|
|
|
|
<el-option :label="$t('column.all')" :value="null"></el-option> |
|
|
|
|
<el-option v-for="item in classifications" :key="item.id" :label="item.classificationName" |
|
|
|
|
:value="item.id"> |
|
|
|
|
</el-option> |
|
|
|
|
</el-select> |
|
|
|
|
<!-- 会议活动：筛选+会议活动列表 --> |
|
|
|
|
<div v-if="info.listStyleId === 15" class="forms"> |
|
|
|
|
<ul class="switch"> |
|
|
|
|
<li v-for="(item, i) in convokeTypes" :key="i" :class="{ active: item.id === form.convokeType }" |
|
|
|
|
@click="switchChange(item)"> |
|
|
|
|
{{ item.name }} |
|
|
|
|
</li> |
|
|
|
|
</ul> |
|
|
|
|
<div class="item"> |
|
|
|
|
<span class="label">{{ $t('column.classification') }}：</span> |
|
|
|
|
<el-select v-model="form.classificationId" @change="filter"> |
|
|
|
|
<el-option :label="$t('column.all')" :value="null"></el-option> |
|
|
|
|
<el-option v-for="item in classifications" :key="item.id" :label="item.classificationName" |
|
|
|
|
:value="item.id"> |
|
|
|
|
</el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
<div class="contents"> |
|
|
|
|
<el-tree |
|
|
|
|
v-if="columns.length && columns.find(e => e.children.length) && !isFilter && showNav && info.listStyleId !== 15" |
|
|
|
|
class="columns" ref="leftColumn" :data="columns" highlight-current :expand-on-click-node="false" |
|
|
|
|
default-expand-all :props="defaultProps" node-key="id" icon-class="el-icon-arrow-down" |
|
|
|
|
@node-click="(item) => columnClick(item, 1)" @current-change="(item) => columnClick(item, 1)"> |
|
|
|
|
<span class="custom-tree-node" slot-scope="{ node, data }" style="padding-left: 10px;"> |
|
|
|
|
<span :title="node.label">{{ node.label }}</span> |
|
|
|
|
</span> |
|
|
|
|
</el-tree> |
|
|
|
|
|
|
|
|
|
<template v-if="articles.length && !loading"> |
|
|
|
|
<!-- 列表样式选的是列表详情，则直接显示最新一篇文章的详情 --> |
|
|
|
|
<div v-if="info.listStyleId === 77" class="detail"> |
|
|
|
|
|
|
|
|
|
<template v-if="article.articleTemplate != 72 && article.articleTemplate != 80"> |
|
|
|
|
<h2>{{ article.title }}</h2> |
|
|
|
|
<!-- <div class="meta">{{ article.source && article.source + ' | ' }} {{ article.author && article.author + ' | ' }} {{ article.releaseTime }}</div> |
|
|
|
|
<div class="contents"> |
|
|
|
|
<el-tree |
|
|
|
|
v-if="columns.length && columns.find(e => e.children.length) && !isFilter && showNav && info.listStyleId !== 15" |
|
|
|
|
class="columns" ref="leftColumn" :data="columns" highlight-current :expand-on-click-node="false" |
|
|
|
|
default-expand-all :props="defaultProps" node-key="id" icon-class="el-icon-arrow-down" |
|
|
|
|
@node-click="(item) => columnClick(item, 1)" @current-change="(item) => columnClick(item, 1)"> |
|
|
|
|
<span class="custom-tree-node" slot-scope="{ node, data }" style="padding-left: 10px;"> |
|
|
|
|
<span :title="node.label">{{ node.label }}</span> |
|
|
|
|
</span> |
|
|
|
|
</el-tree> |
|
|
|
|
|
|
|
|
|
<template v-if="articles.length && !loading"> |
|
|
|
|
<!-- 列表样式选的是列表详情，则直接显示最新一篇文章的详情 --> |
|
|
|
|
<div v-if="info.listStyleId === 77" class="detail"> |
|
|
|
|
|
|
|
|
|
<template v-if="article.articleTemplate != 72 && article.articleTemplate != 80"> |
|
|
|
|
<h2>{{ article.title }}</h2> |
|
|
|
|
<!-- <div class="meta">{{ article.source && article.source + ' | ' }} {{ article.author && article.author + ' | ' }} {{ article.releaseTime }}</div> |
|
|
|
|
<div class="meta">{{ article.edit && $t('column.edit') + '：' + article.edit }} {{ article.audit && ' | ' + $t('column.auditor') + '：' + article.audit }} {{ article.label && ' | ' + $t('column.label') + '：' + article.label }}</div> --> |
|
|
|
|
</template> |
|
|
|
|
<p v-if="article.summary" class="brief">{{ article.summary }}</p> |
|
|
|
|
<div class="des" v-html="article.mainBody"></div> |
|
|
|
|
<div v-if="article.fileList && article.fileList.length" class="annex"> |
|
|
|
|
<h6>{{ $t('column.attachmentDownload') }}</h6> |
|
|
|
|
<ul class="files"> |
|
|
|
|
<li v-for="(file, i) in article.fileList" :key="i"> |
|
|
|
|
<span class="name">{{ file.fileName }}</span> |
|
|
|
|
<span class="download" @click="download(file)">{{ $t('column.download') }}</span> |
|
|
|
|
</li> |
|
|
|
|
</ul> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
</div> |
|
|
|
|
<template v-else> |
|
|
|
|
<template v-if="info.listStyleId === 12"> |
|
|
|
|
<div class="article-wrap"> |
|
|
|
|
<ul class="articles"> |
|
|
|
|
<li v-for="(item, i) in articles" :key="i" :class="{ 'news-notice': info.listStyleId === 55 }" |
|
|
|
|
class="readDetail" @click="toArtice(item)"> |
|
|
|
|
<template v-if="info.listStyleId === 55"> |
|
|
|
|
<div class="releaseTime"> |
|
|
|
|
<p class="d">{{ item.date }}</p> |
|
|
|
|
<p class="m">{{ item.month }}</p> |
|
|
|
|
</div> |
|
|
|
|
<div class="news-title">{{ item.title }}</div> |
|
|
|
|
</template> |
|
|
|
|
<template v-else> |
|
|
|
|
<img class="pic" :src="item.titleImg" alt="" |
|
|
|
|
onerror="javascript:this.src='./images/1.png?id=1';" /> |
|
|
|
|
<div class="texts"> |
|
|
|
|
<p v-if="(item.listStyleId === 10 || item.listStyleId === 15) && item.classificationName" |
|
|
|
|
class="type"> |
|
|
|
|
{{ item.classificationName }} |
|
|
|
|
</p> |
|
|
|
|
<h6 class="titleDes">{{ item.title }}</h6> |
|
|
|
|
<template v-if="item.listStyleId === 11 || item.listStyleId == 12"> |
|
|
|
|
<span class="meta">{{ item.releaseTime }}</span> |
|
|
|
|
<div class="des" v-html="item.mainBody"></div> |
|
|
|
|
</template> |
|
|
|
|
<span v-if="item.listStyleId === 10" class="meta">{{ item.releaseTime }} {{ item.labelName |
|
|
|
|
&& ' | ' + |
|
|
|
|
item.labelName }}</span> |
|
|
|
|
<template v-if="item.listStyleId === 15 || item.listStyleId === 16"> |
|
|
|
|
<div v-if="item.keynoteSpeaker" class="meta m-b-10"> |
|
|
|
|
<img class="icon" src="@/assets/images/mine.png" alt="" /> {{ item.keynoteSpeaker }} |
|
|
|
|
</div> |
|
|
|
|
<div v-if="item.activityStartTime" class="meta m-b-10"> |
|
|
|
|
<img class="icon" src="@/assets/images/time.png" alt="" /> |
|
|
|
|
{{ item.activityStartTime }} |
|
|
|
|
</div> |
|
|
|
|
<div v-if="item.offlineLocation" class="meta m-b-10"> |
|
|
|
|
<img class="icon" src="@/assets/images/location.png" alt="" /> {{ item.offlineLocation |
|
|
|
|
}} |
|
|
|
|
</div> |
|
|
|
|
<div v-if="item.onlineLocation" class="meta"> |
|
|
|
|
<img class="icon" src="@/assets/images/online.png" alt="" /> {{ item.onlineLocation }} |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
<el-button type="primary" class="readDetailBtn">{{ $t('column.readDetail') }}</el-button> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
</template> |
|
|
|
|
</li> |
|
|
|
|
</ul> |
|
|
|
|
<div v-if="articles.length" class="pagination"> |
|
|
|
|
<el-pagination background @current-change="currentChange" :current-page="page" |
|
|
|
|
:page-size="pageSize" layout="total, prev, pager, next" :total="total"></el-pagination> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
<template v-else-if="info.listStyleId === 11 || info.listStyleId === 15 || info.listStyleId === 10"> |
|
|
|
|
<div class="article-wrap"> |
|
|
|
|
<ul class="articles"> |
|
|
|
|
<li v-for="(item, i) in articles" :key="i" :class="{ 'news-notice': info.listStyleId === 55 }" |
|
|
|
|
@click="toArtice(item)"> |
|
|
|
|
<template v-if="info.listStyleId === 55"> |
|
|
|
|
<div class="releaseTime"> |
|
|
|
|
<p class="d">{{ item.date }}</p> |
|
|
|
|
<p class="m">{{ item.month }}</p> |
|
|
|
|
</div> |
|
|
|
|
<div class="news-title">{{ item.title }}</div> |
|
|
|
|
</template> |
|
|
|
|
<template v-else> |
|
|
|
|
<div class="texts leftBox"> |
|
|
|
|
<p v-if="(item.listStyleId === 10 || item.listStyleId === 15 || item.listStyleId === 11) && item.classificationName" |
|
|
|
|
class="type"> |
|
|
|
|
{{ item.classificationName }} |
|
|
|
|
</p> |
|
|
|
|
<h6 class="titleDes">{{ item.title }}</h6> |
|
|
|
|
<template v-if="item.listStyleId === 11 || item.listStyleId == 12"> |
|
|
|
|
<span class="meta">{{ item.releaseTime }} |
|
|
|
|
<template v-if="item.labelName != ''"> |
|
|
|
|
| {{ item.labelName }} |
|
|
|
|
</template> |
|
|
|
|
</span> |
|
|
|
|
</template> |
|
|
|
|
<span v-if="item.listStyleId === 10" class="meta">{{ item.releaseTime }} {{ item.labelName |
|
|
|
|
&& ' | ' + |
|
|
|
|
item.labelName }}</span> |
|
|
|
|
<template v-if="item.listStyleId === 15 || item.listStyleId === 16"> |
|
|
|
|
<div v-if="item.keynoteSpeaker" class="meta m-b-10"> |
|
|
|
|
<img class="icon" src="@/assets/images/mine.png" alt="" /> {{ item.keynoteSpeaker }} |
|
|
|
|
</div> |
|
|
|
|
<div v-if="item.activityStartTime" class="meta m-b-10"> |
|
|
|
|
<img class="icon" src="@/assets/images/time.png" alt="" /> |
|
|
|
|
{{ item.activityStartTime }} |
|
|
|
|
</div> |
|
|
|
|
<div v-if="item.offlineLocation" class="meta m-b-10"> |
|
|
|
|
<img class="icon" src="@/assets/images/location.png" alt="" /> {{ item.offlineLocation |
|
|
|
|
}} |
|
|
|
|
</div> |
|
|
|
|
<div v-if="item.onlineLocation" class="meta"> |
|
|
|
|
<img class="icon" src="@/assets/images/online.png" alt="" /> {{ item.onlineLocation }} |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
</div> |
|
|
|
|
<img class="pic" :src="item.titleImg" alt="" |
|
|
|
|
onerror="javascript:this.src='./images/1.png?id=1';" /> |
|
|
|
|
</template> |
|
|
|
|
</template> |
|
|
|
|
<p v-if="article.summary" class="brief">{{ article.summary }}</p> |
|
|
|
|
<div class="des" v-html="article.mainBody"></div> |
|
|
|
|
<div v-if="article.fileList && article.fileList.length" class="annex"> |
|
|
|
|
<h6>{{ $t('column.attachmentDownload') }}</h6> |
|
|
|
|
<ul class="files"> |
|
|
|
|
<li v-for="(file, i) in article.fileList" :key="i"> |
|
|
|
|
<span class="name">{{ file.fileName }}</span> |
|
|
|
|
<span class="download" @click="download(file)">{{ $t('column.download') }}</span> |
|
|
|
|
</li> |
|
|
|
|
</ul> |
|
|
|
|
<div v-if="articles.length" class="pagination"> |
|
|
|
|
<el-pagination background @current-change="currentChange" :current-page="page" |
|
|
|
|
:page-size="pageSize" layout="total, prev, pager, next" :total="total"></el-pagination> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
</div> |
|
|
|
|
<template v-else> |
|
|
|
|
<div class="article-wrap"> |
|
|
|
|
<ul :class="['articles', { media: info.listStyleId === 74 }]"> |
|
|
|
|
<li v-for="(item, i) in articles" :key="i" |
|
|
|
|
:class="{ 'news-notice': info.listStyleId === 55, 'org': info.listStyleId === 68 }" |
|
|
|
|
class="overDetail" @click="toArtice(item)"> |
|
|
|
|
<template v-if="info.listStyleId === 55"> |
|
|
|
|
<div class="releaseTime"> |
|
|
|
|
<p class="d">{{ item.date }}</p> |
|
|
|
|
<p class="m">{{ item.month }}</p> |
|
|
|
|
</div> |
|
|
|
|
<div class="news-title">{{ item.title }}</div> |
|
|
|
|
</template> |
|
|
|
|
<template v-else> |
|
|
|
|
<img v-if="info.listStyleId !== 74" class="pic" :src="item.titleImg" alt="" |
|
|
|
|
onerror="javascript:this.src='./images/1.png?id=1';" /> |
|
|
|
|
|
|
|
|
|
<template v-else-if="item.fileList"> |
|
|
|
|
<!-- <el-image class="media-pic" |
|
|
|
|
<template v-if="info.listStyleId === 12"> |
|
|
|
|
<div class="article-wrap"> |
|
|
|
|
<ul class="articles"> |
|
|
|
|
<li v-for="(item, i) in articles" :key="i" :class="{ 'news-notice': info.listStyleId === 55 }" |
|
|
|
|
class="readDetail" @click="toArtice(item)"> |
|
|
|
|
<template v-if="info.listStyleId === 55"> |
|
|
|
|
<div class="releaseTime"> |
|
|
|
|
<p class="d">{{ item.date }}</p> |
|
|
|
|
<p class="m">{{ item.month }}</p> |
|
|
|
|
</div> |
|
|
|
|
<div class="news-title">{{ item.title }}</div> |
|
|
|
|
</template> |
|
|
|
|
<template v-else> |
|
|
|
|
<img class="pic" :src="item.titleImg" alt="" |
|
|
|
|
onerror="javascript:this.src='./images/1.png?id=1';" /> |
|
|
|
|
<div class="texts"> |
|
|
|
|
<p v-if="(item.listStyleId === 10 || item.listStyleId === 15) && item.classificationName" |
|
|
|
|
class="type"> |
|
|
|
|
{{ item.classificationName }} |
|
|
|
|
</p> |
|
|
|
|
<h6 class="titleDes">{{ item.title }}</h6> |
|
|
|
|
<template v-if="item.listStyleId === 11 || item.listStyleId == 12"> |
|
|
|
|
<span class="meta">{{ item.releaseTime }}</span> |
|
|
|
|
<div class="des" v-html="item.mainBody"></div> |
|
|
|
|
</template> |
|
|
|
|
<span v-if="item.listStyleId === 10" class="meta">{{ item.releaseTime }} {{ item.labelName |
|
|
|
|
&& ' | ' + |
|
|
|
|
item.labelName }}</span> |
|
|
|
|
<template v-if="item.listStyleId === 15 || item.listStyleId === 16"> |
|
|
|
|
<div v-if="item.keynoteSpeaker" class="meta m-b-10"> |
|
|
|
|
<img class="icon" src="@/assets/images/mine.png" alt="" /> {{ item.keynoteSpeaker }} |
|
|
|
|
</div> |
|
|
|
|
<div v-if="item.activityStartTime" class="meta m-b-10"> |
|
|
|
|
<img class="icon" src="@/assets/images/time.png" alt="" /> |
|
|
|
|
{{ item.activityStartTime }} |
|
|
|
|
</div> |
|
|
|
|
<div v-if="item.offlineLocation" class="meta m-b-10"> |
|
|
|
|
<img class="icon" src="@/assets/images/location.png" alt="" /> {{ item.offlineLocation |
|
|
|
|
}} |
|
|
|
|
</div> |
|
|
|
|
<div v-if="item.onlineLocation" class="meta"> |
|
|
|
|
<img class="icon" src="@/assets/images/online.png" alt="" /> {{ item.onlineLocation }} |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
<el-button type="primary" class="readDetailBtn">{{ $t('column.readDetail') }}</el-button> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
</template> |
|
|
|
|
</li> |
|
|
|
|
</ul> |
|
|
|
|
<div v-if="articles.length" class="pagination"> |
|
|
|
|
<el-pagination background @current-change="currentChange" :current-page="page" |
|
|
|
|
:page-size="pageSize" layout="total, prev, pager, next" :total="total"></el-pagination> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
<template v-else-if="info.listStyleId === 11 || info.listStyleId === 15 || info.listStyleId === 10"> |
|
|
|
|
<div class="article-wrap"> |
|
|
|
|
<ul class="articles"> |
|
|
|
|
<li v-for="(item, i) in articles" :key="i" :class="{ 'news-notice': info.listStyleId === 55 }" |
|
|
|
|
@click="toArtice(item)"> |
|
|
|
|
<template v-if="info.listStyleId === 55"> |
|
|
|
|
<div class="releaseTime"> |
|
|
|
|
<p class="d">{{ item.date }}</p> |
|
|
|
|
<p class="m">{{ item.month }}</p> |
|
|
|
|
</div> |
|
|
|
|
<div class="news-title">{{ item.title }}</div> |
|
|
|
|
</template> |
|
|
|
|
<template v-else> |
|
|
|
|
<div class="texts leftBox"> |
|
|
|
|
<p v-if="(item.listStyleId === 10 || item.listStyleId === 15 || item.listStyleId === 11) && item.classificationName" |
|
|
|
|
class="type"> |
|
|
|
|
{{ item.classificationName }} |
|
|
|
|
</p> |
|
|
|
|
<h6 class="titleDes">{{ item.title }}</h6> |
|
|
|
|
<template v-if="item.listStyleId === 11 || item.listStyleId == 12"> |
|
|
|
|
<span class="meta">{{ item.releaseTime }} |
|
|
|
|
<template v-if="item.labelName != ''"> |
|
|
|
|
| {{ item.labelName }} |
|
|
|
|
</template> |
|
|
|
|
</span> |
|
|
|
|
</template> |
|
|
|
|
<span v-if="item.listStyleId === 10" class="meta">{{ item.releaseTime }} {{ item.labelName |
|
|
|
|
&& ' | ' + |
|
|
|
|
item.labelName }}</span> |
|
|
|
|
<template v-if="item.listStyleId === 15 || item.listStyleId === 16"> |
|
|
|
|
<div v-if="item.keynoteSpeaker" class="meta m-b-10"> |
|
|
|
|
<img class="icon" src="@/assets/images/mine.png" alt="" /> {{ item.keynoteSpeaker }} |
|
|
|
|
</div> |
|
|
|
|
<div v-if="item.activityStartTime" class="meta m-b-10"> |
|
|
|
|
<img class="icon" src="@/assets/images/time.png" alt="" /> |
|
|
|
|
{{ item.activityStartTime }} |
|
|
|
|
</div> |
|
|
|
|
<div v-if="item.offlineLocation" class="meta m-b-10"> |
|
|
|
|
<img class="icon" src="@/assets/images/location.png" alt="" /> {{ item.offlineLocation |
|
|
|
|
}} |
|
|
|
|
</div> |
|
|
|
|
<div v-if="item.onlineLocation" class="meta"> |
|
|
|
|
<img class="icon" src="@/assets/images/online.png" alt="" /> {{ item.onlineLocation }} |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
</div> |
|
|
|
|
<img class="pic" :src="item.titleImg" alt="" |
|
|
|
|
onerror="javascript:this.src='./images/1.png?id=1';" /> |
|
|
|
|
</template> |
|
|
|
|
</li> |
|
|
|
|
</ul> |
|
|
|
|
<div v-if="articles.length" class="pagination"> |
|
|
|
|
<el-pagination background @current-change="currentChange" :current-page="page" |
|
|
|
|
:page-size="pageSize" layout="total, prev, pager, next" :total="total"></el-pagination> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
<template v-else> |
|
|
|
|
<div class="article-wrap"> |
|
|
|
|
<ul :class="['articles', { media: info.listStyleId === 74 }]"> |
|
|
|
|
<li v-for="(item, i) in articles" :key="i" |
|
|
|
|
:class="{ 'news-notice': info.listStyleId === 55, 'org': info.listStyleId === 68 }" |
|
|
|
|
class="overDetail" @click="toArtice(item)"> |
|
|
|
|
<template v-if="info.listStyleId === 55"> |
|
|
|
|
<div class="releaseTime"> |
|
|
|
|
<p class="d">{{ item.date }}</p> |
|
|
|
|
<p class="m">{{ item.month }}</p> |
|
|
|
|
</div> |
|
|
|
|
<div class="news-title">{{ item.title }}</div> |
|
|
|
|
</template> |
|
|
|
|
<template v-else> |
|
|
|
|
<img v-if="info.listStyleId !== 74" class="pic" :src="item.titleImg" alt="" |
|
|
|
|
onerror="javascript:this.src='./images/1.png?id=1';" /> |
|
|
|
|
|
|
|
|
|
<template v-else-if="item.fileList"> |
|
|
|
|
<!-- <el-image class="media-pic" |
|
|
|
|
:style="{backgroundImage: 'url(https://huorantech.com/iasf/sysFiles/preview/1706961813193707521)'}" |
|
|
|
|
src="https://huorantech.com/iasf/sysFiles/preview/1706961813193707521" |
|
|
|
|
:preview-src-list="['https://huorantech.com/iasf/sysFiles/preview/1706961813193707521']"> |
|
|
|
|
</el-image> --> |
|
|
|
|
<video |
|
|
|
|
v-if="Util.isVideo(item.fileList[0].fileName.substring(item.fileList[0].fileName.lastIndexOf('.') + 1))" |
|
|
|
|
class="media-video" controls x5-playsinline x5-video-player-type="h5" |
|
|
|
|
:poster="isIphone ? 'https://huorantech.com/images/about/12.png' : ''" preload> |
|
|
|
|
<source :src="item.fileList[0].filePath" type="video/mp4"> |
|
|
|
|
您的浏览器不支持 video 标签。 |
|
|
|
|
</video> |
|
|
|
|
<el-image v-else class="media-pic" :src="item.fileList[0].filePath" |
|
|
|
|
:preview-src-list="[item.fileList[0].filePath]"> |
|
|
|
|
</el-image> |
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
<div class="texts"> |
|
|
|
|
<p v-if="(item.listStyleId === 10 || item.listStyleId === 15) && item.classificationName" |
|
|
|
|
class="type"> |
|
|
|
|
{{ item.classificationName }} |
|
|
|
|
</p> |
|
|
|
|
<h6 class="titleDes" :title="item.title">{{ item.title }}</h6> |
|
|
|
|
<template |
|
|
|
|
v-if="item.listStyleId === 11 || item.listStyleId == 12 || item.listStyleId == 68"> |
|
|
|
|
<span class="meta">{{ item.releaseTime }}</span> |
|
|
|
|
<div class="des" v-html="item.mainBody"></div> |
|
|
|
|
<video |
|
|
|
|
v-if="Util.isVideo(item.fileList[0].fileName.substring(item.fileList[0].fileName.lastIndexOf('.') + 1))" |
|
|
|
|
class="media-video" controls x5-playsinline x5-video-player-type="h5" |
|
|
|
|
:poster="isIphone ? 'https://huorantech.com/images/about/12.png' : ''" preload> |
|
|
|
|
<source :src="item.fileList[0].filePath" type="video/mp4"> |
|
|
|
|
您的浏览器不支持 video 标签。 |
|
|
|
|
</video> |
|
|
|
|
<el-image v-else class="media-pic" :src="item.fileList[0].filePath" |
|
|
|
|
:preview-src-list="[item.fileList[0].filePath]"> |
|
|
|
|
</el-image> |
|
|
|
|
</template> |
|
|
|
|
<span v-if="item.listStyleId === 10" class="meta">{{ item.releaseTime }} {{ item.labelName |
|
|
|
|
&& ' | ' + |
|
|
|
|
item.labelName }}</span> |
|
|
|
|
<template v-if="item.listStyleId === 15 || item.listStyleId === 16"> |
|
|
|
|
<div v-if="item.keynoteSpeaker" class="meta m-b-10"> |
|
|
|
|
<img class="icon" src="@/assets/images/mine.png" alt="" /> {{ item.keynoteSpeaker }} |
|
|
|
|
</div> |
|
|
|
|
<div v-if="item.activityStartTime" class="meta m-b-10"> |
|
|
|
|
<img class="icon" src="@/assets/images/time.png" alt="" /> |
|
|
|
|
{{ item.activityStartTime }} |
|
|
|
|
</div> |
|
|
|
|
<div v-if="item.offlineLocation" class="meta m-b-10"> |
|
|
|
|
<img class="icon" src="@/assets/images/location.png" alt="" /> {{ item.offlineLocation |
|
|
|
|
}} |
|
|
|
|
</div> |
|
|
|
|
<div v-if="item.onlineLocation" class="meta"> |
|
|
|
|
<img class="icon" src="@/assets/images/online.png" alt="" /> {{ item.onlineLocation }} |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
<el-button v-if="item.listStyleId === 15 || item.listStyleId == 68" type="primary" |
|
|
|
|
class="readDetailBtn">{{ |
|
|
|
|
$t('column.readDetail') }}</el-button> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
</li> |
|
|
|
|
</ul> |
|
|
|
|
<div v-if="total > articles.length" class="pagination"> |
|
|
|
|
<el-pagination background @current-change="currentChange" :current-page="page" |
|
|
|
|
:page-size="pageSize" layout="total, prev, pager, next" :total="total"></el-pagination> |
|
|
|
|
|
|
|
|
|
<div class="texts"> |
|
|
|
|
<p v-if="(item.listStyleId === 10 || item.listStyleId === 15) && item.classificationName" |
|
|
|
|
class="type"> |
|
|
|
|
{{ item.classificationName }} |
|
|
|
|
</p> |
|
|
|
|
<h6 class="titleDes" :title="item.title">{{ item.title }}</h6> |
|
|
|
|
<template |
|
|
|
|
v-if="item.listStyleId === 11 || item.listStyleId == 12 || item.listStyleId == 68"> |
|
|
|
|
<span class="meta">{{ item.releaseTime }}</span> |
|
|
|
|
<div class="des" v-html="item.mainBody"></div> |
|
|
|
|
</template> |
|
|
|
|
<span v-if="item.listStyleId === 10" class="meta">{{ item.releaseTime }} {{ item.labelName |
|
|
|
|
&& ' | ' + |
|
|
|
|
item.labelName }}</span> |
|
|
|
|
<template v-if="item.listStyleId === 15 || item.listStyleId === 16"> |
|
|
|
|
<div v-if="item.keynoteSpeaker" class="meta m-b-10"> |
|
|
|
|
<img class="icon" src="@/assets/images/mine.png" alt="" /> {{ item.keynoteSpeaker }} |
|
|
|
|
</div> |
|
|
|
|
<div v-if="item.activityStartTime" class="meta m-b-10"> |
|
|
|
|
<img class="icon" src="@/assets/images/time.png" alt="" /> |
|
|
|
|
{{ item.activityStartTime }} |
|
|
|
|
</div> |
|
|
|
|
<div v-if="item.offlineLocation" class="meta m-b-10"> |
|
|
|
|
<img class="icon" src="@/assets/images/location.png" alt="" /> {{ item.offlineLocation |
|
|
|
|
}} |
|
|
|
|
</div> |
|
|
|
|
<div v-if="item.onlineLocation" class="meta"> |
|
|
|
|
<img class="icon" src="@/assets/images/online.png" alt="" /> {{ item.onlineLocation }} |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
<el-button v-if="item.listStyleId === 15 || item.listStyleId == 68" type="primary" |
|
|
|
|
class="readDetailBtn">{{ |
|
|
|
|
$t('column.readDetail') }}</el-button> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
</li> |
|
|
|
|
</ul> |
|
|
|
|
<div v-if="total > articles.length" class="pagination"> |
|
|
|
|
<el-pagination background @current-change="currentChange" :current-page="page" |
|
|
|
|
:page-size="pageSize" layout="total, prev, pager, next" :total="total"></el-pagination> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
</template> |
|
|
|
|
</template> |
|
|
|
|
</template> |
|
|
|
|
<div v-else class="none"> |
|
|
|
|
<img src="@/assets/images/none.png" alt=""> |
|
|
|
|
<p class="text">{{ $t('column.comming') }}</p> |
|
|
|
|
<div v-else class="none"> |
|
|
|
|
<img src="@/assets/images/none.png" alt=""> |
|
|
|
|
<p class="text">{{ $t('column.comming') }}</p> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<!-- <template v-if="info.listStyleId !== 77 && info.listStyleId !== 74"> --> |
|
|
|
|
<template v-if="info.listStyleId !== 77 && info.listStyleId !== 74"> |
|
|
|
|
<!-- 选择了“列表样式”，不用显示右侧部分 --> |
|
|
|
|
<div class="right"> |
|
|
|
|
<p class="l-title">{{ $t('column.hot') }}</p> |
|
|
|
|
<ul class="list"> |
|
|
|
|
<li v-for="(item, i) in hots" :key="i" :title="item.title" @click="toArtice(item)"> |
|
|
|
|
<p class="text">{{ item.title }}</p> |
|
|
|
|
<span class="date">{{ item.releaseTime }}</span> |
|
|
|
|
</li> |
|
|
|
|
</ul> |
|
|
|
|
|
|
|
|
|
<p class="l-title">{{ $t('column.latestNews') }}</p> |
|
|
|
|
<ul class="list"> |
|
|
|
|
<li v-for="(item, i) in news" :key="i" :title="item.title" @click="toArtice(item)"> |
|
|
|
|
<p class="text">{{ item.title }}</p> |
|
|
|
|
<span class="date">{{ item.releaseTime }}</span> |
|
|
|
|
</li> |
|
|
|
|
</ul> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
</div> |
|
|
|
|
<!-- <template v-if="info.listStyleId !== 77 && info.listStyleId !== 74"> --> |
|
|
|
|
<template v-if="info.listStyleId !== 77 && info.listStyleId !== 74"> |
|
|
|
|
<!-- 选择了“列表样式”，不用显示右侧部分 --> |
|
|
|
|
<div class="right"> |
|
|
|
|
<p class="l-title">{{ $t('column.hot') }}</p> |
|
|
|
|
<ul class="list"> |
|
|
|
|
<li v-for="(item, i) in hots" :key="i" :title="item.title" @click="toArtice(item)"> |
|
|
|
|
<p class="text">{{ item.title }}</p> |
|
|
|
|
<span class="date">{{ item.releaseTime }}</span> |
|
|
|
|
</li> |
|
|
|
|
</ul> |
|
|
|
|
|
|
|
|
|
<p class="l-title">{{ $t('column.latestNews') }}</p> |
|
|
|
|
<ul class="list"> |
|
|
|
|
<li v-for="(item, i) in news" :key="i" :title="item.title" @click="toArtice(item)"> |
|
|
|
|
<p class="text">{{ item.title }}</p> |
|
|
|
|
<span class="date">{{ item.releaseTime }}</span> |
|
|
|
|
</li> |
|
|
|
|
</ul> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
|
