After Width: | Height: | Size: 730 KiB |
After Width: | Height: | Size: 997 B |
After Width: | Height: | Size: 133 KiB |
After Width: | Height: | Size: 6.8 KiB |
After Width: | Height: | Size: 7.9 KiB |
After Width: | Height: | Size: 6.9 KiB |
After Width: | Height: | Size: 419 B |
@ -1,30 +1,50 @@ |
||||
export const messages = { |
||||
"zh": { |
||||
i18n: { |
||||
breadcrumb: "国际化产品", |
||||
tips: "通过切换语言按钮,来改变当前内容的语言。", |
||||
btn: "切换英文", |
||||
title1: "常用用法", |
||||
p1: "要是你把你的秘密告诉了风,那就别怪风把它带给树。", |
||||
p2: "没有什么比信念更能支撑我们度过艰难的时光了。", |
||||
p3: "只要能把自己的事做好,并让自己快乐,你就领先于大多数人了。", |
||||
title2: "组件插值", |
||||
info: "Element组件需要国际化,请参考 {action}。", |
||||
value: "文档" |
||||
} |
||||
}, |
||||
"en": { |
||||
i18n: { |
||||
breadcrumb: "International Products", |
||||
tips: "Click on the button to change the current language. ", |
||||
btn: "Switch Chinese", |
||||
title1: "Common usage", |
||||
p1: "If you reveal your secrets to the wind you should not blame the wind for revealing them to the trees.", |
||||
p2: "Nothing can help us endure dark times better than our faith. ", |
||||
p3: "If you can do what you do best and be happy, you're further along in life than most people.", |
||||
title2: "Component interpolation", |
||||
info: "The default language of Element is Chinese. If you wish to use another language, please refer to the {action}.", |
||||
value: "documentation" |
||||
} |
||||
'zh': { |
||||
column: { |
||||
classification: '所属分类', |
||||
label: '主题', |
||||
titlePlaceholder: '请输入搜索内容', |
||||
selectPlaceholder: '请选择', |
||||
all: '不限', |
||||
hot: '热点内容', |
||||
latestNews: '最新资讯', |
||||
views: '浏览', |
||||
download: '下载', |
||||
attachmentDownload: '附件下载', |
||||
editor: '编辑', |
||||
auditor: '审核', |
||||
comingSoon: '即将召开', |
||||
alreadyHeld: '已经召开', |
||||
content: '内容介绍', |
||||
time: '时间', |
||||
address: '地址', |
||||
online: '线上', |
||||
speaker: '主讲人', |
||||
series: '演讲系列', |
||||
} |
||||
}, |
||||
'en': { |
||||
column: { |
||||
classification: 'Type', |
||||
label: 'Topic', |
||||
titlePlaceholder: 'Please enter the search content', |
||||
selectPlaceholder: 'Please Select', |
||||
all: 'All', |
||||
hot: 'Most View', |
||||
latestNews: 'Latest News', |
||||
views: 'Views', |
||||
download: 'Download', |
||||
attachmentDownload: 'Attachment Download', |
||||
edit: 'Editor', |
||||
auditor: 'Auditor', |
||||
comingSoon: 'Coming Soon', |
||||
alreadyHeld: 'Already Held', |
||||
content: 'Abstract', |
||||
time: 'Time', |
||||
address: 'Location', |
||||
online: 'Online', |
||||
speaker: 'Speaker', |
||||
series: 'Series' |
||||
} |
||||
} |
||||
}; |
@ -0,0 +1,164 @@ |
||||
<template> |
||||
<div class="wrap"> |
||||
<div class="articles"> |
||||
<div class="top"> |
||||
<div class="search"> |
||||
<input ref="search" type="text" :placeholder="$t('column.titlePlaceholder')" v-model="title"> |
||||
<i class="icon"> |
||||
<img src="@/assets/images/search-white.png" alt=""> |
||||
</i> |
||||
</div> |
||||
<p class="result">包含 “{{ title }}” 的搜索结果</p> |
||||
</div> |
||||
|
||||
<ul v-if="articles.length" class="list"> |
||||
<li v-for="(item, i) in articles" :key="i"> |
||||
<h6 @click="toArtice(item)">{{ item.title }}</h6> |
||||
<div class="des" v-html="item.mainBody"></div> |
||||
<Breadcrumb :data.sync="item.routes"/> |
||||
</li> |
||||
</ul> |
||||
<div v-else class="none"> |
||||
<img src="@/assets/images/none.png" alt=""> |
||||
<p class="text">没有找到您搜索的内容,您可尝试搜索其他关键词。</p> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import { mapState, mapMutations } from 'vuex' |
||||
import Setting from '@/setting' |
||||
import Util from '@/libs/util' |
||||
import mixins from '@/mixins/article' |
||||
import Breadcrumb from '@/components/breadcrumb' |
||||
export default { |
||||
mixins: [mixins], |
||||
data() { |
||||
return { |
||||
title: this.$store.state.content.keyword, |
||||
searchTimer: null, |
||||
articles: [], |
||||
} |
||||
}, |
||||
components: { |
||||
Breadcrumb |
||||
}, |
||||
watch: { |
||||
title() { |
||||
clearTimeout(this.searchTimer) |
||||
this.searchTimer = setTimeout(() => { |
||||
this.getArticle() |
||||
}, 500) |
||||
} |
||||
}, |
||||
mounted() { |
||||
this.getArticle() |
||||
}, |
||||
methods: { |
||||
...mapMutations('content', [ |
||||
'setKeyword' |
||||
]), |
||||
// 查询文章列表 |
||||
getArticle() { |
||||
this.setKeyword('') |
||||
this.$post(this.api.newlyPublishedArticles, { |
||||
siteId: this.$route.query.siteId || this.site, |
||||
pageNum: 1, |
||||
pageSize: 1000, |
||||
title: this.title |
||||
}).then(({ data }) => { |
||||
const list = Util.removeTag(data.records) |
||||
// 添加面包屑参数 |
||||
list.map(e => { |
||||
e.routes = [ |
||||
{ |
||||
name: e.columnName, |
||||
query: { |
||||
id: e.columnId |
||||
} |
||||
}, |
||||
{ |
||||
name: e.title |
||||
} |
||||
] |
||||
}) |
||||
this.articles = list |
||||
}).catch(res => {}) |
||||
}, |
||||
} |
||||
}; |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.wrap { |
||||
background: url(../../assets/images/result-bg1.png) no-repeat, |
||||
url(../../assets/images/result-bg2.png) bottom right/auto no-repeat; |
||||
background-color: #fff; |
||||
} |
||||
.articles { |
||||
width: 1000px; |
||||
padding-top: 47px; |
||||
margin: 0 auto; |
||||
} |
||||
.top { |
||||
display: flex; |
||||
align-items: center; |
||||
.result { |
||||
font-size: 18px; |
||||
color: #969696; |
||||
} |
||||
} |
||||
.search { |
||||
display: inline-flex; |
||||
height: 62px; |
||||
margin-right: 30px; |
||||
border-radius: 6px; |
||||
overflow: hidden; |
||||
input { |
||||
width: 510px; |
||||
padding: 0 20px; |
||||
font-size: 18px; |
||||
color: #333; |
||||
border: 0; |
||||
outline: none; |
||||
background: #F7F7F7; |
||||
} |
||||
.icon { |
||||
display: inline-flex; |
||||
justify-content: center; |
||||
align-items: center; |
||||
width: 62px; |
||||
height: 62px; |
||||
background: #1583FF; |
||||
border-radius: 0px 6px 6px 0px; |
||||
} |
||||
} |
||||
.list { |
||||
li { |
||||
margin-top: 60px; |
||||
} |
||||
h6 { |
||||
margin-bottom: 10px; |
||||
font-size: 22px; |
||||
color: #1583FF; |
||||
line-height: 30px; |
||||
cursor: pointer; |
||||
} |
||||
.des { |
||||
font-size: 18px; |
||||
line-height: 36px; |
||||
color: #333; |
||||
@include mul-ellipsis(2); |
||||
} |
||||
} |
||||
.none { |
||||
margin-top: 118px; |
||||
text-align: center; |
||||
.text { |
||||
margin-top: 59px; |
||||
font-size: 18px; |
||||
color: #333; |
||||
} |
||||
} |
||||
</style> |
@ -1,67 +1,38 @@ |
||||
/** |
||||
* 业务配置 |
||||
* */ |
||||
const url = location.host; |
||||
const isDev = process.env.NODE_ENV === 'development' // 开发环境
|
||||
let host = `${location.origin}/` |
||||
if (isDev) { |
||||
host = 'http://192.168.31.136:10000/' // 测试服
|
||||
// host = 'https://31k70639y6.zicp.fun/' // 测试服
|
||||
// host = 'http://192.168.31.51:10000/' // 榕
|
||||
// host = 'http://192.168.31.137:10000/' // 赓
|
||||
} |
||||
const isDev = process.env.NODE_ENV === 'development' // 开发环境
|
||||
let host = `${location.origin}/` |
||||
if (isDev) { |
||||
host = 'http://192.168.31.136:10000/' // 测试服
|
||||
// host = 'https://31k70639y6.zicp.fun/' // 测试服
|
||||
// host = 'http://192.168.31.51:10000/' // 榕
|
||||
host = 'http://192.168.31.116:10000/' // 赓
|
||||
} |
||||
|
||||
const Setting = { |
||||
/** |
||||
* 基础配置 |
||||
* */ |
||||
titleSuffix: '粒子研究院', // 网页标题的后缀
|
||||
routerMode: "hash", // 路由模式,可选值为 history 或 hash
|
||||
showProgressBar: true, // 页面切换时,是否显示模拟的进度条
|
||||
apiBaseURL: host, // 接口请求地址
|
||||
autoLogoutTime: 3600000, // 长时间未操作,自动退出登录时间
|
||||
modalDuration: 3, // 接口请求返回错误时,弹窗的持续时间,单位:秒
|
||||
errorModalType: "Message", // 接口请求返回错误时,弹窗的类型,可选值为 Message 或 Notice
|
||||
cookiesExpires: 1, // Cookies 默认保存时间,单位:天
|
||||
tokenExpires: 1296000000, // token在localStorage的时间(毫秒)
|
||||
isDev, |
||||
/** |
||||
* 路由白名单 |
||||
* */ |
||||
whiteList: ['/login', '/redirect'], |
||||
/** |
||||
* localStorage里保存的token的key |
||||
*/ |
||||
tokenKey: "IASF_client_token", |
||||
/** |
||||
* localStorage里保存的vuex的key |
||||
*/ |
||||
storeKey: "IASF_client_store", |
||||
/** |
||||
* 默认密码 |
||||
*/ |
||||
initialPassword: "111aaa", |
||||
/** |
||||
* 多语言配置 |
||||
* */ |
||||
i18n: { |
||||
// 默认语言
|
||||
default: "zh", |
||||
// 是否根据用户电脑配置自动设置语言(仅第一次有效)
|
||||
auto: false |
||||
}, |
||||
/** |
||||
* 布局配置 |
||||
* */ |
||||
layout: {}, |
||||
/** |
||||
* 功能配置 |
||||
* */ |
||||
// 相同路由,不同参数间进行切换,是否强力更新
|
||||
sameRouteForceUpdate: false, |
||||
// 是否使用动态路由(即角色权限,开启了的话就会取后端返回的权限树来显示头部导肮和页面按钮)
|
||||
dynamicRoute: true |
||||
}; |
||||
|
||||
export default Setting; |
||||
const Setting = { |
||||
/** |
||||
* 基础配置 |
||||
* */ |
||||
titleSuffix: '粒子研究院', // 网页标题的后缀
|
||||
routerMode: "hash", // 路由模式,可选值为 history 或 hash
|
||||
apiBaseURL: host, // 接口请求地址
|
||||
autoLogoutTime: 3600000, // 长时间未操作,自动退出登录时间
|
||||
modalDuration: 3, // 接口请求返回错误时,弹窗的持续时间,单位:秒
|
||||
errorModalType: "Message", // 接口请求返回错误时,弹窗的类型,可选值为 Message 或 Notice
|
||||
isDev, |
||||
/** |
||||
* 路由白名单 |
||||
* */ |
||||
whiteList: [], |
||||
/** |
||||
* 英文站点id数组 |
||||
* */ |
||||
enIds: [1, 4, 6], |
||||
/** |
||||
* localStorage里保存的vuex的key |
||||
*/ |
||||
storeKey: "IASF_client_store" |
||||
}; |
||||
|
||||
export default Setting; |
||||
|