修改搜索中心细节问题
This commit is contained in:
qq787203167
@@ -11,6 +11,8 @@
|
|||||||
import enquireScreen from '@/utils/device'
|
import enquireScreen from '@/utils/device'
|
||||||
import moment from 'moment'
|
import moment from 'moment'
|
||||||
import 'moment/locale/zh-cn'
|
import 'moment/locale/zh-cn'
|
||||||
|
import Vue from 'vue'
|
||||||
|
import { mapGetters } from 'vuex'
|
||||||
|
|
||||||
moment.locale('zh-cn')
|
moment.locale('zh-cn')
|
||||||
|
|
||||||
@@ -79,13 +81,15 @@
|
|||||||
watch: {
|
watch: {
|
||||||
$route: function(val) {
|
$route: function(val) {
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.$watermark.set('fanqiangqiang 范强强')
|
this.$watermark.set(this.userInfo().updateBy + ' ' + this.userInfo().username)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {},
|
computed: {},
|
||||||
|
|
||||||
methods: {}
|
methods: {
|
||||||
|
...mapGetters(['userInfo'])
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<style>
|
<style>
|
||||||
|
|||||||
@@ -506,5 +506,6 @@ module.exports = {
|
|||||||
Processing:'Processing',
|
Processing:'Processing',
|
||||||
See:'See',
|
See:'See',
|
||||||
labelNameCannotDuplicate:'Label name cannot be duplicate',
|
labelNameCannotDuplicate:'Label name cannot be duplicate',
|
||||||
|
list:'list',
|
||||||
|
paragraph:'paragraph',
|
||||||
}
|
}
|
||||||
@@ -510,5 +510,7 @@ module.exports = {
|
|||||||
Processing:'办理',
|
Processing:'办理',
|
||||||
See:'查看',
|
See:'查看',
|
||||||
labelNameCannotDuplicate:'标签名称不能重复',
|
labelNameCannotDuplicate:'标签名称不能重复',
|
||||||
|
list:'列表',
|
||||||
|
paragraph:'段落',
|
||||||
|
|
||||||
}
|
}
|
||||||
@@ -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-center-wrap">
|
||||||
<div class="search-detail">
|
<div class="search-detail">
|
||||||
<div class="search-detail-wrap">
|
<div class="search-detail-wrap">
|
||||||
<!-- <div class="search-detail-title">搜索内容</div>-->
|
<a-input-group class="input-group" compact v-if="active === $t('DocumentLibrary')">
|
||||||
<!-- <a-input placeholder="请输入搜索内容" />-->
|
|
||||||
<!-- <a-button type="primary">搜索</a-button>-->
|
|
||||||
<!-- <a-button>清空</a-button>-->
|
|
||||||
|
|
||||||
<a-input-group compact v-if="showList">
|
|
||||||
<a-select default-value="Option1">
|
<a-select default-value="Option1">
|
||||||
<a-select-option value="Option1">
|
<a-select-option value="Option1">
|
||||||
标题
|
标题
|
||||||
@@ -26,107 +21,29 @@
|
|||||||
></a-input-search>
|
></a-input-search>
|
||||||
</a-input-group>
|
</a-input-group>
|
||||||
<a-input-search
|
<a-input-search
|
||||||
v-else
|
v-else-if="active === $t('whole')"
|
||||||
allowClear
|
class="inputSearch"
|
||||||
|
allow-clear
|
||||||
placeholder="请输入搜索内容"
|
placeholder="请输入搜索内容"
|
||||||
@search="onSearch"
|
@search="onSearch"
|
||||||
></a-input-search>
|
></a-input-search>
|
||||||
<!-- <a-button @click="searchReset(1)" style="margin-left: 20px" icon="redo">重置</a-button>-->
|
|
||||||
<!-- <a href="javascript:;">结果中检索</a>-->
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="search-center-content">
|
<div class="search-center-content">
|
||||||
<div class="search-con-header">
|
<div class="search-con-header">
|
||||||
<div class="search-header-left">
|
<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('whole')" :tab="$t('whole')"></a-tab-pane>
|
||||||
<a-tab-pane :key="$t('DocumentLibrary')" :tab="$t('DocumentLibrary')" force-render>
|
<a-tab-pane :key="$t('DocumentLibrary')" :tab="$t('DocumentLibrary')" force-render>
|
||||||
</a-tab-pane>
|
</a-tab-pane>
|
||||||
<a-tab-pane :key="$t('KnowledgeDatabase')" :tab="$t('KnowledgeDatabase')"></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('DocumentComparisonLibrary')" :tab="$t('DocumentComparisonLibrary')"></a-tab-pane>-->
|
||||||
<a-tab-pane :key="$t('weekly')" :tab="$t('weekly')"></a-tab-pane>
|
<!-- <a-tab-pane :key="$t('weekly')" :tab="$t('weekly')"></a-tab-pane>-->
|
||||||
</a-tabs>
|
</a-tabs>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="search-con-text">
|
<whole v-if="active === $t('whole')"/>
|
||||||
<div class="search-text-wrap">
|
<DocumentLibrary v-else-if="active === $t('DocumentLibrary')"/>
|
||||||
<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>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -134,307 +51,28 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import whole from './components/whole'
|
||||||
|
import DocumentLibrary from './components/DocumentLibrary'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'searchCenter',
|
name: 'searchCenter',
|
||||||
|
components: {
|
||||||
|
whole,
|
||||||
|
DocumentLibrary
|
||||||
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
selectedRowKeys: [],
|
active: this.$t('whole'),
|
||||||
isNullInput: false,
|
showList: 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]
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
methods: {
|
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) {
|
callback(key) {
|
||||||
console.log(key)
|
this.active = 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
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
onSearch() {
|
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 {
|
.search-center {
|
||||||
/*background-color: #ffffff;*/
|
/*background-color: #ffffff;*/
|
||||||
|
|
||||||
.null-input {
|
|
||||||
background-color: #F2F4F8;
|
|
||||||
}
|
|
||||||
|
|
||||||
.no-null-input {
|
|
||||||
/*background-color: rgba(255, 255, 255, 0.8);*/
|
|
||||||
}
|
|
||||||
|
|
||||||
.search-center-wrap {
|
.search-center-wrap {
|
||||||
margin: 10px;
|
margin: 10px;
|
||||||
|
|
||||||
@@ -473,20 +103,6 @@
|
|||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
line-height: 32px;
|
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;
|
margin-right: 10px;
|
||||||
padding: 4px 20px;
|
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 {
|
.inputSearch {
|
||||||
float: left;
|
width: 400px;
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
top: 50%;
|
|
||||||
transform: translateY(-50%);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.text-text-right {
|
.input-group {
|
||||||
padding: 19px 28px;
|
width: 488px;
|
||||||
box-sizing: border-box;
|
|
||||||
margin-left: 38px;
|
|
||||||
}
|
}
|
||||||
|
</style>
|
||||||
.text-right-right {
|
<style>
|
||||||
border-left: 2px solid #E6E7EC;
|
.inputSearch .ant-input {
|
||||||
padding: 24px 0 24px 24px !important;
|
height: 40px;
|
||||||
box-sizing: border-box;
|
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>
|
</style>
|
||||||
Reference in New Issue
Block a user