[update] 增加一期首页组件

This commit is contained in:
lideqin
2023-11-29 16:35:50 +08:00
parent 1285771c8d
commit 8546bb2007
9 changed files with 165 additions and 4 deletions
+7 -3
View File
@@ -1,8 +1,8 @@
@font-face {
font-family: "iconfont"; /* Project id 4236293 */
src: url('iconfont.woff2?t=1700186751229') format('woff2'),
url('iconfont.woff?t=1700186751229') format('woff'),
url('iconfont.ttf?t=1700186751229') format('truetype');
src: url('iconfont.woff2?t=1701245888202') format('woff2'),
url('iconfont.woff?t=1701245888202') format('woff'),
url('iconfont.ttf?t=1701245888202') format('truetype');
}
.iconfont {
@@ -13,6 +13,10 @@
-moz-osx-font-smoothing: grayscale;
}
.icon-nav-bottom:before {
content: "\e760";
}
.icon-a-moxingkuaisuchaifen1:before {
content: "\e60a";
}
File diff suppressed because one or more lines are too long
+7
View File
@@ -5,6 +5,13 @@
"css_prefix_text": "icon-",
"description": "",
"glyphs": [
{
"icon_id": "3525796",
"name": "nav-bottom",
"font_class": "nav-bottom",
"unicode": "e760",
"unicode_decimal": 59232
},
{
"icon_id": "38153617",
"name": "moxingkuaisuchaifen 1",
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

@@ -0,0 +1,150 @@
<template>
<div class="analysis-box">
<div class="content-box">
<img class="logo-img" src="../../../assets/image/analysisLogo.png"/>
<div class="search-box">
<a-input-group compact class="search-input-group">
<a-select v-model="resourceType" :dropdownMatchSelectWidth="false">
<a-select-option value="all">{{ $t('dashboard.generalSearch.all')}}</a-select-option>
<a-select-option v-for="item in resourceTypeOptions" :key="item.value" :value="item.value">
{{ item.title }}
</a-select-option>
<i slot="suffixIcon" class="iconfont icon-nav-bottom"></i>
</a-select>
<a-input v-model="searchValue" :placeholder="$t('pleaseEnter')">
<i slot="prefix" class="iconfont icon-Searchbar_Search_icon"></i>
<!--<a-icon type="search" />-->
</a-input>
</a-input-group>
<a-button type="primary" @click="toSearchWindow('title')">标题检索</a-button>
<a-button type="primary" @click="toSearchWindow('fullText')">全文检索</a-button>
<a-button type="primary" ghost @click="toAdvancedSearch">高级检索</a-button>
</div>
<p class="tips-p">全球法规标准搜索</p>
</div>
</div>
</template>
<script>
import { ajaxGetDictItems } from '@/api/api'
export default {
name: 'FirstStageCard',
data () {
return {
resourceTypeOptions: [], // 资源类型下拉框数据
resourceType: 'all', // 资源类型
searchValue: '' // 检索内容
}
},
mounted () {
this.initResourceTypeOptions()
},
methods: {
// 获取资源类型下拉框数据
initResourceTypeOptions () {
ajaxGetDictItems('resource_type').then(res => {
if (res.success) {
this.resourceTypeOptions = res.result
}
})
},
// 点击跳转到一般检索页
toSearchWindow (type) {
const { href } = this.$router.resolve({
path: '/generalSearch',
query: {
type: type,
resourceType: this.resourceType,
searchValue: this.searchValue
}
})
window.open(href, '_blank')
},
// 点击跳转到高级检索页
toAdvancedSearch () {
const { href } = this.$router.resolve({
path: '/advancedSearch'
})
window.open(href, '_blank')
}
}
}
</script>
<style scoped lang="less">
@import '~@assets/less/common.less';
.analysis-box {
width: 100%;
height: calc(@page-content-h - 20px);
background-image: url("../../../assets/image/analysisBack.png");
background-repeat: no-repeat;
//background-size: 100% 100%;
background-size: cover;
background-position: center center;
padding-top: calc(@page-content-h * 0.2);
}
.content-box {
width: 70%;
margin: 0 auto;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
.logo-img {
width: 222px;
}
.tips-p {
margin-top: 24px;
font-size: 16px;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #86909C;
line-height: 22px;
}
}
.search-box {
width: 100%;
height: 56px;
margin-top: 60px;
display: flex;
gap: 10px;
.search-input-group {
height: 56px;
flex: 1;
display: flex;
/deep/ .ant-select-selection {
height: 100%;
border-color: @primary-color;
color: @primary-color;
.ant-select-selection__rendered {
height: 100%;
line-height: 54px;
margin-right: 38px;
}
.ant-select-arrow-icon {
font-size: 18px;
color: @primary-color;
}
.ant-select-arrow {
margin-top: -9px;
}
}
/deep/ .ant-input-prefix {
color: @primary-color;
left: 18px;
}
/deep/ .ant-input {
height: 56px;
border-color: @primary-color;
padding-left: 40px;
}
}
/deep/ .ant-btn {
height: 56px;
}
}
</style>