修改搜索中心细节问题
This commit is contained in:
qq787203167
@@ -0,0 +1,501 @@
|
||||
<template>
|
||||
<div class="search-con-text">
|
||||
<div class="search-text-wrap">
|
||||
<div class="text-left">
|
||||
<div class="text-left-wrap">
|
||||
<div class="text-left-select" v-for="item in searchOption" :key="item.id">
|
||||
<span class="text-sel">{{item.value}}</span>
|
||||
<a-select class="text-select" :default-value="item.option[0].value" style="width: 120px"
|
||||
@change="handleChange">
|
||||
<a-select-option v-for="opt in item.option" :value="opt.value">
|
||||
{{opt.value}}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
<div class="text-left-select">
|
||||
<span class="text-sel">发布日期</span>
|
||||
<a-date-picker class="text-select" @change="onChange"/>
|
||||
</div>
|
||||
<div class="text-left-select">
|
||||
<span class="text-sel">标准实施日期</span>
|
||||
<a-date-picker class="text-select" @change="onChange"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-right">
|
||||
<div class="search-text-list">
|
||||
<div class="search-text-title">
|
||||
<span>检索范围：</span>
|
||||
<span>纯电动</span>
|
||||
<div class="search-header-right">
|
||||
<a-icon type="appstore" class="header-list" :title="$t('list')" :class="{'header-list-active':isTrue }"
|
||||
@click="selectListModel('list')"></a-icon>
|
||||
<a-icon type="unordered-list" class="header-list" :title="$t('paragraph')"
|
||||
:class="{'header-list-active':!isTrue }"
|
||||
@click="selectListModel('unord')"></a-icon>
|
||||
</div>
|
||||
</div>
|
||||
<a-table
|
||||
v-if="isTrue"
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:data-source="tableData"
|
||||
:row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
|
||||
:columns="columns"
|
||||
>
|
||||
<!-- 字符串超长截取省略号显示-->
|
||||
<!-- <span slot="templateContent" slot-scope="text">-->
|
||||
<!-- <j-ellipsis :value="text" :length="25"/>-->
|
||||
<!-- </span>-->
|
||||
</a-table>
|
||||
<div v-if="!isTrue" class="box-content">
|
||||
<a-checkbox-group v-model="checkboxText">
|
||||
<li v-for="item in conList" :key="item.id">
|
||||
<div style="margin-bottom: 10px;position: relative">
|
||||
<a-checkbox :value="item.id" class="checkbox-left"></a-checkbox>
|
||||
<div class="text-text-right"
|
||||
@click="checkedClick(item)"
|
||||
:class="{ 'null-input':item.checked }">
|
||||
<div class="text-header">
|
||||
<span>{{item.type}}</span>
|
||||
<span>{{item.number}}</span>
|
||||
<span>{{item.title}}</span>
|
||||
</div>
|
||||
<div class="text-content">
|
||||
{{item.content}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</a-checkbox-group>
|
||||
</div>
|
||||
<div class="page">
|
||||
<a-pagination
|
||||
:show-total="total => $t('total')+` ${total} `+$t('strip')"
|
||||
show-quick-jumper
|
||||
show-size-changer
|
||||
:page-size.sync="pageSize"
|
||||
:total="total"
|
||||
@change="pageOnChange"
|
||||
@showSizeChange="SizeChange"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'DocumentLibrary',
|
||||
data() {
|
||||
return {
|
||||
searchOption: [
|
||||
{
|
||||
id: 1,
|
||||
label: 'categary',
|
||||
value: '适用区域',
|
||||
option: [
|
||||
{
|
||||
label: 'china',
|
||||
value: '中国'
|
||||
},
|
||||
{
|
||||
label: 'english',
|
||||
value: '英国'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
label: 'type',
|
||||
value: '类别',
|
||||
option: [
|
||||
{
|
||||
label: 'china',
|
||||
value: '中国'
|
||||
},
|
||||
{
|
||||
label: 'english',
|
||||
value: '英国'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
label: 'stand',
|
||||
value: '标准体系',
|
||||
option: [
|
||||
{
|
||||
label: 'china',
|
||||
value: '中国'
|
||||
},
|
||||
{
|
||||
label: 'english',
|
||||
value: '英国'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
label: 'state',
|
||||
value: '状态',
|
||||
option: [
|
||||
{
|
||||
label: 'china',
|
||||
value: '中国'
|
||||
},
|
||||
{
|
||||
label: 'english',
|
||||
value: '英国'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
label: 'trial',
|
||||
value: '适用范围',
|
||||
option: [
|
||||
{
|
||||
label: 'china',
|
||||
value: '中国'
|
||||
},
|
||||
{
|
||||
label: 'english',
|
||||
value: '英国'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
label: 'funArea',
|
||||
value: '功能领域',
|
||||
option: [
|
||||
{
|
||||
label: 'china',
|
||||
value: '中国'
|
||||
},
|
||||
{
|
||||
label: 'english',
|
||||
value: '英国'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
label: 'techArea',
|
||||
value: '技术领域',
|
||||
option: [
|
||||
{
|
||||
label: 'china',
|
||||
value: '中国'
|
||||
},
|
||||
{
|
||||
label: 'english',
|
||||
value: '英国'
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
tableData: [],
|
||||
columns: [
|
||||
{
|
||||
title: '编号',
|
||||
align: 'center',
|
||||
dataIndex: 'templateCode'
|
||||
},
|
||||
{
|
||||
title: '标题',
|
||||
align: 'center',
|
||||
dataIndex: 'templateName'
|
||||
},
|
||||
{
|
||||
title: '文件名称',
|
||||
align: 'center',
|
||||
dataIndex: 'template'
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
align: 'center',
|
||||
dataIndex: 'templateCon',
|
||||
sorter: (a, b) => a.age - b.age
|
||||
},
|
||||
{
|
||||
title: '适用地区',
|
||||
align: 'center',
|
||||
dataIndex: 'templateCont',
|
||||
sorter: (a, b) => a.age - b.age
|
||||
},
|
||||
{
|
||||
title: '功能领域',
|
||||
align: 'center',
|
||||
dataIndex: 'templateContent1'
|
||||
},
|
||||
{
|
||||
title: '技术领域',
|
||||
align: 'center',
|
||||
dataIndex: 'templateContent2'
|
||||
}
|
||||
],
|
||||
selectedRowKeys: [],
|
||||
isTrue: true,
|
||||
checkboxText: [],
|
||||
conList: [
|
||||
{
|
||||
id: 1,
|
||||
type: '文档库',
|
||||
number: 'GB20999-2019',
|
||||
title: '内饰件阻燃特性',
|
||||
content: '区域:东亚 国家/地区:中国 标准性质:-- 标准状态:现行 内容摘要: 标准文: 标准类别:-- 标准号: 1229导入-中国市场11-中国市场11 标准名称:1229导入-中国市场11 标准英文名称:Englist 发布日期:2021-12-26 实施日期:2021-12-30 新定型车实施日期:2021-12-26 新生产车实施日期:-- 注册登记车实施日期:-- 在产车实施日期:-- 适用认证:公告, 发布部门: 代替标准号:1229导入 被代替标准号:1229导入-中国市场11 采用国际标准号: 采标程度:-- 适用车型:M1,M2,M3, 能源种类:汽油,纯电, 起草单位: 起草人: 关键词: 备注:-- 责任部门:-- 所属专业领域:-- '
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
type: '文档库',
|
||||
number: 'GB20999-2019',
|
||||
title: '内饰件阻燃特性',
|
||||
content: '区域:东亚 国家/地区:中国 标准性质:-- 标准状态:现行 内容摘要: 标准文: 标准类别:-- 标准号: 1229导入-中国市场11-中国市场11 标准名称:1229导入-中国市场11 标准英文名称:Englist 发布日期:2021-12-26 实施日期:2021-12-30 新定型车实施日期:2021-12-26 新生产车实施日期:-- 注册登记车实施日期:-- 在产车实施日期:-- 适用认证:公告, 发布部门: 代替标准号:1229导入 被代替标准号:1229导入-中国市场11 采用国际标准号: 采标程度:-- 适用车型:M1,M2,M3, 能源种类:汽油,纯电, 起草单位: 起草人: 关键词: 备注:-- 责任部门:-- 所属专业领域:-- '
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
type: '文档库',
|
||||
number: 'GB20999-2019',
|
||||
title: '内饰件阻燃特性',
|
||||
content: '区域:东亚 国家/地区:中国 标准性质:-- 标准状态:现行 内容摘要: 标准文: 标准类别:-- 标准号: 1229导入-中国市场11-中国市场11 标准名称:1229导入-中国市场11 标准英文名称:Englist 发布日期:2021-12-26 实施日期:2021-12-30 新定型车实施日期:2021-12-26 新生产车实施日期:-- 注册登记车实施日期:-- 在产车实施日期:-- 适用认证:公告, 发布部门: 代替标准号:1229导入 被代替标准号:1229导入-中国市场11 采用国际标准号: 采标程度:-- 适用车型:M1,M2,M3, 能源种类:汽油,纯电, 起草单位: 起草人: 关键词: 备注:-- 责任部门:-- 所属专业领域:-- '
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
type: '文档库',
|
||||
number: 'GB20999-2019',
|
||||
title: '内饰件阻燃特性',
|
||||
content: '区域:东亚 国家/地区:中国 标准性质:-- 标准状态:现行 内容摘要: 标准文: 标准类别:-- 标准号: 1229导入-中国市场11-中国市场11 标准名称:1229导入-中国市场11 标准英文名称:Englist 发布日期:2021-12-26 实施日期:2021-12-30 新定型车实施日期:2021-12-26 新生产车实施日期:-- 注册登记车实施日期:-- 在产车实施日期:-- 适用认证:公告, 发布部门: 代替标准号:1229导入 被代替标准号:1229导入-中国市场11 采用国际标准号: 采标程度:-- 适用车型:M1,M2,M3, 能源种类:汽油,纯电, 起草单位: 起草人: 关键词: 备注:-- 责任部门:-- 所属专业领域:-- '
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
type: '文档库',
|
||||
number: 'GB20999-2019',
|
||||
title: '内饰件阻燃特性',
|
||||
content: '区域:东亚 国家/地区:中国 标准性质:-- 标准状态:现行 内容摘要: 标准文: 标准类别:-- 标准号: 1229导入-中国市场11-中国市场11 标准名称:1229导入-中国市场11 标准英文名称:Englist 发布日期:2021-12-26 实施日期:2021-12-30 新定型车实施日期:2021-12-26 新生产车实施日期:-- 注册登记车实施日期:-- 在产车实施日期:-- 适用认证:公告, 发布部门: 代替标准号:1229导入 被代替标准号:1229导入-中国市场11 采用国际标准号: 采标程度:-- 适用车型:M1,M2,M3, 能源种类:汽油,纯电, 起草单位: 起草人: 关键词: 备注:-- 责任部门:-- 所属专业领域:-- '
|
||||
}
|
||||
],
|
||||
total: 0,
|
||||
pageSize: 10,
|
||||
pageNo: 1
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
checkboxText: function(value) {
|
||||
this.conList.forEach(val => {
|
||||
val.checked = false
|
||||
})
|
||||
if (value.length > 0) {
|
||||
this.conList.forEach(val => {
|
||||
value.forEach(res => {
|
||||
if (res === val.id) {
|
||||
val.checked = true
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
this.conList = [...this.conList]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleChange() {
|
||||
|
||||
},
|
||||
onChange(date, dateString) {
|
||||
// console.log(date, dateString);
|
||||
},
|
||||
selectListModel(val) {
|
||||
this.isTrue = val == 'list' ? true : false
|
||||
},
|
||||
onSelectChange() {
|
||||
|
||||
},
|
||||
checkedClick(item) {
|
||||
if (item.checked) {
|
||||
this.checkboxText = this.checkboxText.filter(res => {
|
||||
return res !== item.id
|
||||
})
|
||||
} else {
|
||||
this.checkboxText.push(item.id)
|
||||
}
|
||||
},
|
||||
pageOnChange(page, pageSize) {
|
||||
this.pageNo = page
|
||||
},
|
||||
SizeChange(page, pageSize) {
|
||||
this.pageSize = pageSize
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.checkbox-left .ant-checkbox-inner {
|
||||
width: 18px !important;
|
||||
height: 18px !important;
|
||||
line-height: 18px !important;
|
||||
}
|
||||
</style>
|
||||
<style lang="less" scoped>
|
||||
|
||||
.search-con-text {
|
||||
|
||||
.search-text-wrap {
|
||||
margin-top: -27px;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
|
||||
.text-left {
|
||||
width: 358px;
|
||||
padding: 24px 24px 24px 0;
|
||||
box-sizing: border-box;
|
||||
|
||||
.text-left-wrap {
|
||||
|
||||
.text-left-select {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 24px;
|
||||
line-height: 32px;
|
||||
|
||||
.text-sel {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #000F16;
|
||||
text-align: right;
|
||||
margin-right: 14px;
|
||||
width: 83px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.text-select {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.text-right {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
padding: 26px 0 22px 24px;
|
||||
box-sizing: border-box;
|
||||
border-left: 2px solid #E6E7EC;
|
||||
|
||||
.search-text-title {
|
||||
padding: 0 0 24px 0;
|
||||
|
||||
span {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #040B29;
|
||||
}
|
||||
|
||||
.search-header-right {
|
||||
float: right;
|
||||
margin-top: -7px;
|
||||
|
||||
a-icon {
|
||||
|
||||
border: 1px solid rgba(0, 0, 0, 0.65);
|
||||
cursor: pointer;
|
||||
padding: 2px 5px;
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
a-icon:last-child {
|
||||
border-right: 1px solid rgba(0, 0, 0, 0.65);
|
||||
}
|
||||
|
||||
.header-list {
|
||||
font-size: 20px;
|
||||
border: 1px solid gray;
|
||||
border-radius: 3px;
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
.header-list:hover {
|
||||
color: #00B3BE;
|
||||
border: 1px solid #00B3BE;
|
||||
}
|
||||
|
||||
.header-list-active {
|
||||
border: 1px solid #00B3BE;
|
||||
color: #00B3BE;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search-text-list {
|
||||
ul {
|
||||
padding: 0 0 0 18px;
|
||||
margin: 0;
|
||||
|
||||
li {
|
||||
list-style: none;
|
||||
|
||||
.text-content {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #040B29;
|
||||
opacity: 0.8;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.checkbox-left {
|
||||
float: left;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.text-text-right {
|
||||
padding: 19px 28px;
|
||||
box-sizing: border-box;
|
||||
margin-left: 38px;
|
||||
}
|
||||
|
||||
.null-input {
|
||||
background-color: #F2F4F8;
|
||||
}
|
||||
|
||||
.text-header {
|
||||
margin-bottom: 11px;
|
||||
|
||||
span {
|
||||
margin-right: 52px;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
color: #040B29;
|
||||
}
|
||||
}
|
||||
|
||||
.text-content {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #040B29;
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.box-content {
|
||||
padding: 0 0 0 8px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.page {
|
||||
text-align: right;
|
||||
margin-top: 20px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,181 @@
|
||||
<template>
|
||||
<div class="box">
|
||||
<div class="search-text-title">
|
||||
<span>检索范围：</span>
|
||||
<span>纯电动</span>
|
||||
<!-- <div class="search-header-right" v-if="showList">-->
|
||||
<!-- <!– <a-icon type="appstore" />–>-->
|
||||
<!-- <a-icon :type="item.type" v-for="item in listOption" class="header-list"-->
|
||||
<!-- :class="{'header-list-active':selectList.indexOf(item.value) !== -1 }"-->
|
||||
<!-- @click="selectListModel(item.value)"-->
|
||||
<!-- ></a-icon>-->
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
<a-checkbox-group v-model="checkboxText">
|
||||
<li v-for="item in conList" :key="item.id">
|
||||
<div style="margin-bottom: 10px;position: relative">
|
||||
<a-checkbox :value="item.id" class="checkbox-left"></a-checkbox>
|
||||
<div class="text-text-right"
|
||||
@click="checkedClick(item)"
|
||||
:class="{ 'null-input':item.checked }">
|
||||
<div class="text-header">
|
||||
<span>{{item.type}}</span>
|
||||
<span>{{item.number}}</span>
|
||||
<span>{{item.title}}</span>
|
||||
</div>
|
||||
<div class="text-content">
|
||||
{{item.content}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</a-checkbox-group>
|
||||
<div class="page">
|
||||
<a-pagination
|
||||
:show-total="total => $t('total')+` ${total} `+$t('strip')"
|
||||
show-quick-jumper
|
||||
show-size-changer
|
||||
:page-size.sync="pageSize"
|
||||
:total="total"
|
||||
@change="pageOnChange"
|
||||
@showSizeChange="SizeChange"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'whole',
|
||||
data() {
|
||||
return {
|
||||
checkboxText: [],
|
||||
conList: [
|
||||
{
|
||||
id: 1,
|
||||
type: '文档库',
|
||||
number: 'GB20999-2019',
|
||||
title: '内饰件阻燃特性',
|
||||
content: '区域:东亚 国家/地区:中国 标准性质:-- 标准状态:现行 内容摘要: 标准文: 标准类别:-- 标准号: 1229导入-中国市场11-中国市场11 标准名称:1229导入-中国市场11 标准英文名称:Englist 发布日期:2021-12-26 实施日期:2021-12-30 新定型车实施日期:2021-12-26 新生产车实施日期:-- 注册登记车实施日期:-- 在产车实施日期:-- 适用认证:公告, 发布部门: 代替标准号:1229导入 被代替标准号:1229导入-中国市场11 采用国际标准号: 采标程度:-- 适用车型:M1,M2,M3, 能源种类:汽油,纯电, 起草单位: 起草人: 关键词: 备注:-- 责任部门:-- 所属专业领域:-- '
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
type: '文档库',
|
||||
number: 'GB20999-2019',
|
||||
title: '内饰件阻燃特性',
|
||||
content: '区域:东亚 国家/地区:中国 标准性质:-- 标准状态:现行 内容摘要: 标准文: 标准类别:-- 标准号: 1229导入-中国市场11-中国市场11 标准名称:1229导入-中国市场11 标准英文名称:Englist 发布日期:2021-12-26 实施日期:2021-12-30 新定型车实施日期:2021-12-26 新生产车实施日期:-- 注册登记车实施日期:-- 在产车实施日期:-- 适用认证:公告, 发布部门: 代替标准号:1229导入 被代替标准号:1229导入-中国市场11 采用国际标准号: 采标程度:-- 适用车型:M1,M2,M3, 能源种类:汽油,纯电, 起草单位: 起草人: 关键词: 备注:-- 责任部门:-- 所属专业领域:-- '
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
type: '文档库',
|
||||
number: 'GB20999-2019',
|
||||
title: '内饰件阻燃特性',
|
||||
content: '区域:东亚 国家/地区:中国 标准性质:-- 标准状态:现行 内容摘要: 标准文: 标准类别:-- 标准号: 1229导入-中国市场11-中国市场11 标准名称:1229导入-中国市场11 标准英文名称:Englist 发布日期:2021-12-26 实施日期:2021-12-30 新定型车实施日期:2021-12-26 新生产车实施日期:-- 注册登记车实施日期:-- 在产车实施日期:-- 适用认证:公告, 发布部门: 代替标准号:1229导入 被代替标准号:1229导入-中国市场11 采用国际标准号: 采标程度:-- 适用车型:M1,M2,M3, 能源种类:汽油,纯电, 起草单位: 起草人: 关键词: 备注:-- 责任部门:-- 所属专业领域:-- '
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
type: '文档库',
|
||||
number: 'GB20999-2019',
|
||||
title: '内饰件阻燃特性',
|
||||
content: '区域:东亚 国家/地区:中国 标准性质:-- 标准状态:现行 内容摘要: 标准文: 标准类别:-- 标准号: 1229导入-中国市场11-中国市场11 标准名称:1229导入-中国市场11 标准英文名称:Englist 发布日期:2021-12-26 实施日期:2021-12-30 新定型车实施日期:2021-12-26 新生产车实施日期:-- 注册登记车实施日期:-- 在产车实施日期:-- 适用认证:公告, 发布部门: 代替标准号:1229导入 被代替标准号:1229导入-中国市场11 采用国际标准号: 采标程度:-- 适用车型:M1,M2,M3, 能源种类:汽油,纯电, 起草单位: 起草人: 关键词: 备注:-- 责任部门:-- 所属专业领域:-- '
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
type: '文档库',
|
||||
number: 'GB20999-2019',
|
||||
title: '内饰件阻燃特性',
|
||||
content: '区域:东亚 国家/地区:中国 标准性质:-- 标准状态:现行 内容摘要: 标准文: 标准类别:-- 标准号: 1229导入-中国市场11-中国市场11 标准名称:1229导入-中国市场11 标准英文名称:Englist 发布日期:2021-12-26 实施日期:2021-12-30 新定型车实施日期:2021-12-26 新生产车实施日期:-- 注册登记车实施日期:-- 在产车实施日期:-- 适用认证:公告, 发布部门: 代替标准号:1229导入 被代替标准号:1229导入-中国市场11 采用国际标准号: 采标程度:-- 适用车型:M1,M2,M3, 能源种类:汽油,纯电, 起草单位: 起草人: 关键词: 备注:-- 责任部门:-- 所属专业领域:-- '
|
||||
}
|
||||
],
|
||||
total: 0,
|
||||
pageSize: 10,
|
||||
pageNo: 1
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
checkboxText: function(value) {
|
||||
this.conList.forEach(val => {
|
||||
val.checked = false
|
||||
})
|
||||
if (value.length > 0) {
|
||||
this.conList.forEach(val => {
|
||||
value.forEach(res => {
|
||||
if (res === val.id) {
|
||||
val.checked = true
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
this.conList = [...this.conList]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
checkedClick(item) {
|
||||
if (item.checked) {
|
||||
this.checkboxText = this.checkboxText.filter(res => {
|
||||
return res !== item.id
|
||||
})
|
||||
} else {
|
||||
this.checkboxText.push(item.id)
|
||||
}
|
||||
},
|
||||
pageOnChange(page, pageSize) {
|
||||
this.pageNo = page
|
||||
},
|
||||
SizeChange(page, pageSize) {
|
||||
this.pageSize = pageSize
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.box {
|
||||
padding: 0 0 0 18px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.checkbox-left {
|
||||
float: left;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.text-text-right {
|
||||
padding: 19px 28px;
|
||||
box-sizing: border-box;
|
||||
margin-left: 38px;
|
||||
}
|
||||
|
||||
.null-input {
|
||||
background-color: #F2F4F8;
|
||||
}
|
||||
|
||||
.search-text-title {
|
||||
margin-bottom: 22px;
|
||||
}
|
||||
|
||||
.text-header {
|
||||
margin-bottom: 11px;
|
||||
|
||||
span {
|
||||
margin-right: 52px;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
color: #040B29;
|
||||
}
|
||||
}
|
||||
|
||||
.text-content {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #040B29;
|
||||
opacity: 0.7;
|
||||
}
|
||||
.page {
|
||||
text-align: right;
|
||||
margin-top: 20px;
|
||||
}
|
||||
</style>
|
||||
@@ -4,12 +4,7 @@
|
||||
<div class="search-center-wrap">
|
||||
<div class="search-detail">
|
||||
<div class="search-detail-wrap">
|
||||
<!-- <div class="search-detail-title">搜索内容</div>-->
|
||||
<!-- <a-input placeholder="请输入搜索内容" />-->
|
||||
<!-- <a-button type="primary">搜索</a-button>-->
|
||||
<!-- <a-button>清空</a-button>-->
|
||||
|
||||
<a-input-group compact v-if="showList">
|
||||
<a-input-group class="input-group" compact v-if="active === $t('DocumentLibrary')">
|
||||
<a-select default-value="Option1">
|
||||
<a-select-option value="Option1">
|
||||
标题
|
||||
@@ -26,107 +21,29 @@
|
||||
></a-input-search>
|
||||
</a-input-group>
|
||||
<a-input-search
|
||||
v-else
|
||||
allowClear
|
||||
v-else-if="active === $t('whole')"
|
||||
class="inputSearch"
|
||||
allow-clear
|
||||
placeholder="请输入搜索内容"
|
||||
@search="onSearch"
|
||||
></a-input-search>
|
||||
<!-- <a-button @click="searchReset(1)" style="margin-left: 20px" icon="redo">重置</a-button>-->
|
||||
<!-- <a href="javascript:;">结果中检索</a>-->
|
||||
</div>
|
||||
</div>
|
||||
<div class="search-center-content">
|
||||
<div class="search-con-header">
|
||||
<div class="search-header-left">
|
||||
<a-tabs :default-active-key="$t('whole')" @change="callback">
|
||||
<a-tabs :default-active-key="active" @change="callback">
|
||||
<a-tab-pane :key="$t('whole')" :tab="$t('whole')"></a-tab-pane>
|
||||
<a-tab-pane :key="$t('DocumentLibrary')" :tab="$t('DocumentLibrary')" force-render>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane :key="$t('KnowledgeDatabase')" :tab="$t('KnowledgeDatabase')"></a-tab-pane>
|
||||
<a-tab-pane :key="$t('DocumentComparisonLibrary')" :tab="$t('DocumentComparisonLibrary')"></a-tab-pane>
|
||||
<a-tab-pane :key="$t('weekly')" :tab="$t('weekly')"></a-tab-pane>
|
||||
<!-- <a-tab-pane :key="$t('KnowledgeDatabase')" :tab="$t('KnowledgeDatabase')"></a-tab-pane>-->
|
||||
<!-- <a-tab-pane :key="$t('DocumentComparisonLibrary')" :tab="$t('DocumentComparisonLibrary')"></a-tab-pane>-->
|
||||
<!-- <a-tab-pane :key="$t('weekly')" :tab="$t('weekly')"></a-tab-pane>-->
|
||||
</a-tabs>
|
||||
</div>
|
||||
</div>
|
||||
<div class="search-con-text">
|
||||
<div class="search-text-wrap">
|
||||
<div class="text-left" v-if="searchShow">
|
||||
<div class="text-left-wrap">
|
||||
<div class="text-left-select" v-for="item in searchOption" :key="item.id">
|
||||
<span class="text-sel">{{item.value}}</span>
|
||||
<a-select class="text-select" :default-value="item.option[0].value" style="width: 120px"
|
||||
@change="handleChange">
|
||||
<a-select-option v-for="opt in item.option" :value="opt.value">
|
||||
{{opt.value}}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
<div class="text-left-date">
|
||||
<span class="data-fb">发布日期</span>
|
||||
<a-date-picker @change="onChange"/>
|
||||
</div>
|
||||
<div class="text-left-date">
|
||||
<span class="data-fb">标准实施日期</span>
|
||||
<a-date-picker @change="onChange"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-right" :class="{'text-right-right':searchShow}">
|
||||
<div class="search-text-title">
|
||||
<span>检索范围：</span>
|
||||
<span>纯电动</span>
|
||||
<div class="search-header-right" v-if="showList">
|
||||
<!-- <a-icon type="appstore" />-->
|
||||
<a-icon :type="item.type" v-for="item in listOption" class="header-list"
|
||||
:class="{'header-list-active':selectList.indexOf(item.value) !== -1 }"
|
||||
@click="selectListModel(item.value)"
|
||||
></a-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div class="search-text-list">
|
||||
<a-table
|
||||
v-if="searchShow"
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:data-source="tableData"
|
||||
:row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
|
||||
:columns="columns"
|
||||
>
|
||||
<!-- 字符串超长截取省略号显示-->
|
||||
<span slot="templateContent" slot-scope="text">
|
||||
<j-ellipsis :value="text" :length="25"/>
|
||||
</span>
|
||||
</a-table>
|
||||
|
||||
<ul v-if="!searchShow">
|
||||
<a-checkbox-group v-model="checkboxText">
|
||||
<li v-for="item in conList" :key="item.id">
|
||||
<div style="margin-bottom: 10px;position: relative">
|
||||
<a-checkbox :value="item.id" class="checkbox-left"></a-checkbox>
|
||||
<div class="text-text-right"
|
||||
@click="checkedClick(item)"
|
||||
:class="{ 'null-input':item.checked }">
|
||||
<div class="text-header">
|
||||
<span>{{item.type}}</span>
|
||||
<span>{{item.number}}</span>
|
||||
<span>{{item.title}}</span>
|
||||
</div>
|
||||
<div class="text-content">
|
||||
{{item.content}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</a-checkbox-group>
|
||||
</ul>
|
||||
<a-pagination size="small" :total="50" class="paginationbox" :show-total="total => `总共 ${total} 条`"
|
||||
show-size-changer show-quick-jumper/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<whole v-if="active === $t('whole')"/>
|
||||
<DocumentLibrary v-else-if="active === $t('DocumentLibrary')"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -134,307 +51,28 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import whole from './components/whole'
|
||||
import DocumentLibrary from './components/DocumentLibrary'
|
||||
|
||||
export default {
|
||||
name: 'searchCenter',
|
||||
components: {
|
||||
whole,
|
||||
DocumentLibrary
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
selectedRowKeys: [],
|
||||
isNullInput: false,
|
||||
columns: [
|
||||
{
|
||||
title: '编号',
|
||||
align: 'center',
|
||||
dataIndex: 'templateCode'
|
||||
},
|
||||
{
|
||||
title: '标题',
|
||||
align: 'center',
|
||||
dataIndex: 'templateName'
|
||||
},
|
||||
{
|
||||
title: '文件名称',
|
||||
align: 'center',
|
||||
dataIndex: 'templateContent'
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
align: 'center',
|
||||
dataIndex: 'templateContent',
|
||||
sorter: (a, b) => a.age - b.age
|
||||
},
|
||||
{
|
||||
title: '适用地区',
|
||||
align: 'center',
|
||||
dataIndex: 'templateContent',
|
||||
sorter: (a, b) => a.age - b.age
|
||||
},
|
||||
{
|
||||
title: '功能领域',
|
||||
align: 'center',
|
||||
dataIndex: 'templateContent'
|
||||
},
|
||||
{
|
||||
title: '技术领域',
|
||||
align: 'center',
|
||||
dataIndex: 'templateContent'
|
||||
}
|
||||
],
|
||||
options: [
|
||||
{
|
||||
label: 'all',
|
||||
value: '全部'
|
||||
},
|
||||
{
|
||||
label: 'library',
|
||||
value: '文档库'
|
||||
}, {
|
||||
label: 'questions',
|
||||
value: '知识问题库'
|
||||
},
|
||||
{
|
||||
label: 'contract',
|
||||
value: '文档对比库'
|
||||
}, {
|
||||
label: 'report',
|
||||
value: '法规月报'
|
||||
}
|
||||
],
|
||||
selectOption: '全部',
|
||||
showList: false,
|
||||
showbox: false,
|
||||
listOption: [
|
||||
{
|
||||
label: 'list',
|
||||
value: '列表',
|
||||
type: 'appstore'
|
||||
},
|
||||
{
|
||||
label: 'graph',
|
||||
value: '段落',
|
||||
type: 'unordered-list'
|
||||
}
|
||||
],
|
||||
selectList: '列表',
|
||||
conList: [
|
||||
{
|
||||
id: 1,
|
||||
type: '文档库',
|
||||
number: 'GB20999-2019',
|
||||
title: '内饰件阻燃特性',
|
||||
content: '区域:东亚 国家/地区:中国 标准性质:-- 标准状态:现行 内容摘要: 标准文: 标准类别:-- 标准号: 1229导入-中国市场11-中国市场11 标准名称:1229导入-中国市场11 标准英文名称:Englist 发布日期:2021-12-26 实施日期:2021-12-30 新定型车实施日期:2021-12-26 新生产车实施日期:-- 注册登记车实施日期:-- 在产车实施日期:-- 适用认证:公告, 发布部门: 代替标准号:1229导入 被代替标准号:1229导入-中国市场11 采用国际标准号: 采标程度:-- 适用车型:M1,M2,M3, 能源种类:汽油,纯电, 起草单位: 起草人: 关键词: 备注:-- 责任部门:-- 所属专业领域:-- '
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
type: '文档库',
|
||||
number: 'GB20999-2019',
|
||||
title: '内饰件阻燃特性',
|
||||
content: '区域:东亚 国家/地区:中国 标准性质:-- 标准状态:现行 内容摘要: 标准文: 标准类别:-- 标准号: 1229导入-中国市场11-中国市场11 标准名称:1229导入-中国市场11 标准英文名称:Englist 发布日期:2021-12-26 实施日期:2021-12-30 新定型车实施日期:2021-12-26 新生产车实施日期:-- 注册登记车实施日期:-- 在产车实施日期:-- 适用认证:公告, 发布部门: 代替标准号:1229导入 被代替标准号:1229导入-中国市场11 采用国际标准号: 采标程度:-- 适用车型:M1,M2,M3, 能源种类:汽油,纯电, 起草单位: 起草人: 关键词: 备注:-- 责任部门:-- 所属专业领域:-- '
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
type: '文档库',
|
||||
number: 'GB20999-2019',
|
||||
title: '内饰件阻燃特性',
|
||||
content: '区域:东亚 国家/地区:中国 标准性质:-- 标准状态:现行 内容摘要: 标准文: 标准类别:-- 标准号: 1229导入-中国市场11-中国市场11 标准名称:1229导入-中国市场11 标准英文名称:Englist 发布日期:2021-12-26 实施日期:2021-12-30 新定型车实施日期:2021-12-26 新生产车实施日期:-- 注册登记车实施日期:-- 在产车实施日期:-- 适用认证:公告, 发布部门: 代替标准号:1229导入 被代替标准号:1229导入-中国市场11 采用国际标准号: 采标程度:-- 适用车型:M1,M2,M3, 能源种类:汽油,纯电, 起草单位: 起草人: 关键词: 备注:-- 责任部门:-- 所属专业领域:-- '
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
type: '文档库',
|
||||
number: 'GB20999-2019',
|
||||
title: '内饰件阻燃特性',
|
||||
content: '区域:东亚 国家/地区:中国 标准性质:-- 标准状态:现行 内容摘要: 标准文: 标准类别:-- 标准号: 1229导入-中国市场11-中国市场11 标准名称:1229导入-中国市场11 标准英文名称:Englist 发布日期:2021-12-26 实施日期:2021-12-30 新定型车实施日期:2021-12-26 新生产车实施日期:-- 注册登记车实施日期:-- 在产车实施日期:-- 适用认证:公告, 发布部门: 代替标准号:1229导入 被代替标准号:1229导入-中国市场11 采用国际标准号: 采标程度:-- 适用车型:M1,M2,M3, 能源种类:汽油,纯电, 起草单位: 起草人: 关键词: 备注:-- 责任部门:-- 所属专业领域:-- '
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
type: '文档库',
|
||||
number: 'GB20999-2019',
|
||||
title: '内饰件阻燃特性',
|
||||
content: '区域:东亚 国家/地区:中国 标准性质:-- 标准状态:现行 内容摘要: 标准文: 标准类别:-- 标准号: 1229导入-中国市场11-中国市场11 标准名称:1229导入-中国市场11 标准英文名称:Englist 发布日期:2021-12-26 实施日期:2021-12-30 新定型车实施日期:2021-12-26 新生产车实施日期:-- 注册登记车实施日期:-- 在产车实施日期:-- 适用认证:公告, 发布部门: 代替标准号:1229导入 被代替标准号:1229导入-中国市场11 采用国际标准号: 采标程度:-- 适用车型:M1,M2,M3, 能源种类:汽油,纯电, 起草单位: 起草人: 关键词: 备注:-- 责任部门:-- 所属专业领域:-- '
|
||||
}
|
||||
],
|
||||
searchOption: [
|
||||
{
|
||||
id: 1,
|
||||
label: 'categary',
|
||||
value: '适用区域',
|
||||
option: [
|
||||
{
|
||||
label: 'china',
|
||||
value: '中国'
|
||||
},
|
||||
{
|
||||
label: 'english',
|
||||
value: '英国'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
label: 'type',
|
||||
value: '类别',
|
||||
option: [
|
||||
{
|
||||
label: 'china',
|
||||
value: '中国'
|
||||
},
|
||||
{
|
||||
label: 'english',
|
||||
value: '英国'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
label: 'stand',
|
||||
value: '标准体系',
|
||||
option: [
|
||||
{
|
||||
label: 'china',
|
||||
value: '中国'
|
||||
},
|
||||
{
|
||||
label: 'english',
|
||||
value: '英国'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
label: 'state',
|
||||
value: '状态',
|
||||
option: [
|
||||
{
|
||||
label: 'china',
|
||||
value: '中国'
|
||||
},
|
||||
{
|
||||
label: 'english',
|
||||
value: '英国'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
label: 'trial',
|
||||
value: '适用范围',
|
||||
option: [
|
||||
{
|
||||
label: 'china',
|
||||
value: '中国'
|
||||
},
|
||||
{
|
||||
label: 'english',
|
||||
value: '英国'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
label: 'funArea',
|
||||
value: '功能领域',
|
||||
option: [
|
||||
{
|
||||
label: 'china',
|
||||
value: '中国'
|
||||
},
|
||||
{
|
||||
label: 'english',
|
||||
value: '英国'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
label: 'techArea',
|
||||
value: '技术领域',
|
||||
option: [
|
||||
{
|
||||
label: 'china',
|
||||
value: '中国'
|
||||
},
|
||||
{
|
||||
label: 'english',
|
||||
value: '英国'
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
searchShow: false,
|
||||
checkboxText: []
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
checkboxText: function(value) {
|
||||
this.conList.forEach(val => {
|
||||
val.checked = false
|
||||
})
|
||||
if (value.length > 0) {
|
||||
this.conList.forEach(val => {
|
||||
value.forEach(res => {
|
||||
if (res === val.id) {
|
||||
val.checked = true
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
this.conList = [...this.conList]
|
||||
active: this.$t('whole'),
|
||||
showList: false
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
checkedClick(item) {
|
||||
if (item.checked) {
|
||||
this.checkboxText = this.checkboxText.filter(res => {
|
||||
return res !== item.id
|
||||
})
|
||||
} else {
|
||||
this.checkboxText.push(item.id)
|
||||
}
|
||||
console.log(this.checkboxText)
|
||||
},
|
||||
selectModel(value) {
|
||||
this.selectOption = value
|
||||
if (value == '文档库') {
|
||||
this.showList = true
|
||||
} else {
|
||||
this.showList = false
|
||||
}
|
||||
},
|
||||
callback(key) {
|
||||
console.log(key)
|
||||
this.selectOption = key
|
||||
// if(key =='全部' || key =='知识问题库' || key =='文档对比库' || key =='周报') {
|
||||
// this.showbox = true
|
||||
// }else{
|
||||
// this.showbox = false
|
||||
// this.showList=true
|
||||
// }
|
||||
if (key == '文档库') {
|
||||
this.showList = true
|
||||
} else {
|
||||
this.showList = false
|
||||
}
|
||||
if (key == '段落') {
|
||||
this.searchShow = true
|
||||
} else {
|
||||
this.searchShow = false
|
||||
}
|
||||
this.active = key
|
||||
},
|
||||
onSearch() {
|
||||
|
||||
},
|
||||
selectListModel(value) {
|
||||
this.selectList = value
|
||||
if (value == '段落') {
|
||||
this.searchShow = true
|
||||
} else {
|
||||
this.searchShow = false
|
||||
}
|
||||
},
|
||||
handleChange() {
|
||||
|
||||
},
|
||||
onChange(date, dateString) {
|
||||
// console.log(date, dateString);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -450,14 +88,6 @@
|
||||
.search-center {
|
||||
/*background-color: #ffffff;*/
|
||||
|
||||
.null-input {
|
||||
background-color: #F2F4F8;
|
||||
}
|
||||
|
||||
.no-null-input {
|
||||
/*background-color: rgba(255, 255, 255, 0.8);*/
|
||||
}
|
||||
|
||||
.search-center-wrap {
|
||||
margin: 10px;
|
||||
|
||||
@@ -473,20 +103,6 @@
|
||||
margin-right: 10px;
|
||||
line-height: 32px;
|
||||
}
|
||||
|
||||
input {
|
||||
min-width: 300px;
|
||||
margin-right: 30px;
|
||||
}
|
||||
|
||||
button {
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
a {
|
||||
width: 140px;
|
||||
line-height: 32px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -504,202 +120,43 @@
|
||||
margin-right: 10px;
|
||||
padding: 4px 20px;
|
||||
}
|
||||
|
||||
.search-header-item:hover {
|
||||
color: #1890FF;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.search-header-item-active {
|
||||
background: #1890FF;
|
||||
border-radius: 15px;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.search-header-item-active:hover {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search-con-text {
|
||||
|
||||
.search-text-wrap {
|
||||
margin-top: -27px;
|
||||
/*background: #ffffff;*/
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
|
||||
.text-left {
|
||||
width: 358px;
|
||||
padding: 24px 24px 24px 0;
|
||||
box-sizing: border-box;
|
||||
|
||||
.text-left-wrap {
|
||||
|
||||
.text-left-select {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 24px;
|
||||
line-height: 32px;
|
||||
|
||||
.text-sel {
|
||||
//span{
|
||||
// float: right;
|
||||
//}
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #000F16;
|
||||
text-align: right;
|
||||
margin-right: 14px;
|
||||
min-width: 83px;
|
||||
}
|
||||
|
||||
.text-select {
|
||||
flex: 1;
|
||||
//margin-top: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.text-left-date {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
line-height: 32px;
|
||||
margin: 23px 0;
|
||||
|
||||
span.data-fb {
|
||||
text-align: right;
|
||||
margin-right: 14px;
|
||||
min-width: 84px;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #000F16;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.text-right {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
padding: 26px 0 22px 0;
|
||||
box-sizing: border-box;
|
||||
|
||||
.search-text-title {
|
||||
padding: 0 0 22px 0;
|
||||
|
||||
span {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #040B29;
|
||||
}
|
||||
|
||||
.search-header-right {
|
||||
float: right;
|
||||
margin-top: -2px;
|
||||
|
||||
a-icon {
|
||||
|
||||
border: 1px solid rgba(0, 0, 0, 0.65);
|
||||
cursor: pointer;
|
||||
padding: 2px 5px;
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
a-icon:last-child {
|
||||
border-right: 1px solid rgba(0, 0, 0, 0.65);
|
||||
}
|
||||
|
||||
.header-list {
|
||||
font-size: 20px;
|
||||
border: 1px solid gray;
|
||||
border-radius: 3px;
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
.header-list:hover {
|
||||
color: #00B3BE;
|
||||
}
|
||||
|
||||
.header-list-active {
|
||||
border: 1px solid #00B3BE;
|
||||
color: #00B3BE;
|
||||
}
|
||||
|
||||
.header-list-active:hover {
|
||||
color: gray;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.search-text-list {
|
||||
ul {
|
||||
padding: 0 0 0 18px;
|
||||
margin: 0;
|
||||
|
||||
li {
|
||||
list-style: none;
|
||||
//background: #f6f6f6;
|
||||
//border: 1px solid #000000;
|
||||
//border-radius: 10px;
|
||||
/*padding: 10px;*/
|
||||
|
||||
.text-header {
|
||||
margin-bottom: 11px;
|
||||
|
||||
span {
|
||||
margin-right: 52px;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
color: #040B29;
|
||||
}
|
||||
}
|
||||
|
||||
.text-content {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #040B29;
|
||||
opacity: 0.8;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.paginationbox {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-pagination {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.checkbox-left {
|
||||
float: left;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
.inputSearch {
|
||||
width: 400px;
|
||||
}
|
||||
|
||||
.text-text-right {
|
||||
padding: 19px 28px;
|
||||
box-sizing: border-box;
|
||||
margin-left: 38px;
|
||||
.input-group {
|
||||
width: 488px;
|
||||
}
|
||||
|
||||
.text-right-right {
|
||||
border-left: 2px solid #E6E7EC;
|
||||
padding: 24px 0 24px 24px !important;
|
||||
box-sizing: border-box;
|
||||
</style>
|
||||
<style>
|
||||
.inputSearch .ant-input {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
}
|
||||
.input-group .ant-select-selection{
|
||||
width: 88px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
padding: 0 0 0 6px;
|
||||
}
|
||||
.input-group .ant-select-selection__rendered{
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
}
|
||||
.input-group .ant-input{
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
}
|
||||
.input-group .ant-select-arrow{
|
||||
right: 15px;
|
||||
}
|
||||
.input-group .ant-select{
|
||||
background: #F6F7FA;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user