修改搜索中心
This commit is contained in:
@@ -1,53 +1,89 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="search-con-text">
|
<div class="search-con-text">
|
||||||
<div class="search-text-wrap">
|
<div class="search-text-wrap">
|
||||||
<div class="text-left">
|
<div class="text-left">
|
||||||
<div class="text-left-wrap">
|
<div class="text-left-wrap" v-for="(item,index) in searchOption" :key="index">
|
||||||
<div v-for="item in searchOption" :key="item.id">
|
<div class="text-left-select" v-if="item.field_show_type == '0'">
|
||||||
<div class="text-left-select">
|
<span class="text-sel">{{item.db_field_txt}}</span>
|
||||||
<span class="text-sel">{{item.value}}</span>
|
<a-tree-select
|
||||||
<a-select class="text-select" :default-value="item.option[0].value" style="width: 120px"
|
class="text-select"
|
||||||
@change="handleChange">
|
v-model="queryParam[item.db_field_name]"
|
||||||
<a-select-option v-for="opt in item.option" :value="opt.value">
|
:maxTagCount="1"
|
||||||
{{opt.value}}
|
:tree-data="item.tree"
|
||||||
</a-select-option>
|
tree-checkable
|
||||||
</a-select>
|
:placeholder="$t('PleaseSelect')+item.db_field_txt"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="text-left-select" v-if="item.field_show_type == '1' || item.field_show_type == '8' ||
|
||||||
|
item.field_show_type == '9' || item.field_show_type == '10' || item.field_show_type == '11'">
|
||||||
|
<span class="text-sel">{{item.db_field_txt}}</span>
|
||||||
|
<a-input class="text-select"
|
||||||
|
v-model="queryParam[item.db_field_name]"
|
||||||
|
:placeholder="$t('PleaseEnter')+item.db_field_txt"/>
|
||||||
|
</div>
|
||||||
|
<div class="text-left-select" v-if="item.field_show_type == '2'">
|
||||||
|
<span class="text-sel">{{item.db_field_txt}}</span>
|
||||||
|
<a-input-number class="text-select" :placeholder="$t('PleaseEnter')+item.db_field_txt"
|
||||||
|
v-model="queryParam[item.db_field_name]" :min="1" :max="99999999"/>
|
||||||
|
</div>
|
||||||
|
<div class="text-left-select" v-if="item.field_show_type == '3'">
|
||||||
|
<span class="text-sel">{{item.db_field_txt}}</span>
|
||||||
|
<j-dict-select-tag class="text-select" v-model="queryParam[item.db_field_name]"
|
||||||
|
:placeholder="$t('PleaseSelect')+item.db_field_txt"
|
||||||
|
:type="'select'"
|
||||||
|
:triggerChange="false" :dictCode="item.dict_field"/>
|
||||||
|
</div>
|
||||||
|
<div class="text-left-select" v-if="item.field_show_type == '4'">
|
||||||
|
<span class="text-sel">{{item.db_field_txt}}</span>
|
||||||
|
<j-multi-select-tag class="text-select" v-model="queryParam[item.db_field_name]"
|
||||||
|
:placeholder="$t('PleaseSelect')+item.db_field_txt" :type="'select'"
|
||||||
|
:triggerChange="false" :dictCode="item.dict_field"/>
|
||||||
|
</div>
|
||||||
|
<div class="text-left-select" v-if="item.field_show_type == '5'">
|
||||||
|
<span class="text-sel">{{item.db_field_txt}}</span>
|
||||||
|
<a-date-picker class="text-select"
|
||||||
|
:placeholder="$t('PleaseSelect')+item.db_field_txt"
|
||||||
|
@change="dateChange(item.db_field_name)"
|
||||||
|
v-model="queryParam[item.db_field_name]"/>
|
||||||
|
</div>
|
||||||
|
<div class="text-left-select" v-if="item.field_show_type == '6'">
|
||||||
|
<span class="text-sel">{{item.db_field_txt}}</span>
|
||||||
|
<a-range-picker class="text-select" v-model="queryParam[item.db_field_name]"
|
||||||
|
:placeholder="$t('PleaseSelect')+item.db_field_txt"
|
||||||
|
@change="onChange(item.db_field_name)"></a-range-picker>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="table-page-search-submitButtons submitButtons">
|
||||||
|
<a-button class="box-button" type="primary" @click="searchQuery">{{$t('query')}}</a-button>
|
||||||
|
<a-button class="box-button" style="margin-left: 8px" @click="searchReset">{{$t('reset')}}
|
||||||
|
</a-button>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="text-right">
|
||||||
|
<div class="search-text-list">
|
||||||
<div class="text-left-select">
|
<div class="search-text-title">
|
||||||
<span class="text-sel">发布日期</span>
|
<span>检索范围:</span>
|
||||||
<a-date-picker class="text-select" @change="onChange"/>
|
<span>纯电动</span>
|
||||||
</div>
|
<div class="search-header-right">
|
||||||
<div class="text-left-select">
|
<a-icon type="appstore" class="header-list" :title="$t('list')"
|
||||||
<span class="text-sel">标准实施日期</span>
|
:class="{'header-list-active':isTrue }"
|
||||||
<a-date-picker class="text-select" @change="onChange"/>
|
@click="selectListModel('list')"></a-icon>
|
||||||
</div>
|
<a-icon type="unordered-list" class="header-list" :title="$t('paragraph')"
|
||||||
</div>
|
:class="{'header-list-active':!isTrue }"
|
||||||
</div>
|
@click="selectListModel('unord')"></a-icon>
|
||||||
<div class="text-right">
|
</div>
|
||||||
<div class="search-text-list">
|
</div>
|
||||||
<div class="search-text-title">
|
<a-table
|
||||||
<span>检索范围:</span>
|
v-if="isTrue"
|
||||||
<span>纯电动</span>
|
ref="table"
|
||||||
<div class="search-header-right">
|
size="middle"
|
||||||
<a-icon type="appstore" class="header-list" :title="$t('list')" :class="{'header-list-active':isTrue }"
|
:loading="loading"
|
||||||
@click="selectListModel('list')"></a-icon>
|
:scroll="{x: true}"
|
||||||
<a-icon type="unordered-list" class="header-list" :title="$t('paragraph')"
|
rowKey="id"
|
||||||
:class="{'header-list-active':!isTrue }"
|
:data-source="tableData"
|
||||||
@click="selectListModel('unord')"></a-icon>
|
:row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
|
||||||
</div>
|
:columns="columns"
|
||||||
</div>
|
>
|
||||||
<a-table
|
|
||||||
v-if="isTrue"
|
|
||||||
ref="table"
|
|
||||||
size="middle"
|
|
||||||
:scroll="{x: true}"
|
|
||||||
rowKey="id"
|
|
||||||
:data-source="tableData"
|
|
||||||
:row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
|
|
||||||
:columns="columns"
|
|
||||||
>
|
|
||||||
<span slot="operation" slot-scope="record">
|
<span slot="operation" slot-scope="record">
|
||||||
<a @click="Collection(record)" class="text-operation">
|
<a @click="Collection(record)" class="text-operation">
|
||||||
{{!record.collectFlag || record.collectFlag == 0 ? $t('Collection') :$t('CancelCollection')}}
|
{{!record.collectFlag || record.collectFlag == 0 ? $t('Collection') :$t('CancelCollection')}}
|
||||||
@@ -57,57 +93,58 @@
|
|||||||
</a>
|
</a>
|
||||||
<a @click="handleCompare(record)" class="text-operation"> {{$t('Push')}}</a>
|
<a @click="handleCompare(record)" class="text-operation"> {{$t('Push')}}</a>
|
||||||
</span>
|
</span>
|
||||||
<!-- 字符串超长截取省略号显示-->
|
<!-- 字符串超长截取省略号显示-->
|
||||||
<!-- <span slot="templateContent" slot-scope="text">-->
|
<!-- <span slot="templateContent" slot-scope="text">-->
|
||||||
<!-- <j-ellipsis :value="text" :length="25"/>-->
|
<!-- <j-ellipsis :value="text" :length="25"/>-->
|
||||||
<!-- </span>-->
|
<!-- </span>-->
|
||||||
</a-table>
|
</a-table>
|
||||||
<div v-if="!isTrue" class="box-content">
|
<div v-if="!isTrue" class="box-content">
|
||||||
<a-checkbox-group v-model="checkboxText">
|
<a-checkbox-group v-model="checkboxText">
|
||||||
<li v-for="item in conList" :key="item.id">
|
<li v-for="item in conList" :key="item.id">
|
||||||
<div style="margin-bottom: 10px;position: relative">
|
<div style="margin-bottom: 10px;position: relative">
|
||||||
<a-checkbox :value="item.id" class="checkbox-left"></a-checkbox>
|
<a-checkbox :value="item.id" class="checkbox-left"></a-checkbox>
|
||||||
<div class="text-text-right"
|
<div class="text-text-right"
|
||||||
@click="checkedClick(item)"
|
@click="checkedClick(item)"
|
||||||
:class="{ 'null-input':item.checked }">
|
:class="{ 'null-input':item.checked }">
|
||||||
<div class="text-header">
|
<div class="text-header">
|
||||||
<span>{{item.type}}</span>
|
<span>{{item.type}}</span>
|
||||||
<span>{{item.number}}</span>
|
<span>{{item.number}}</span>
|
||||||
<span>{{item.title}}</span>
|
<span>{{item.title}}</span>
|
||||||
|
</div>
|
||||||
|
<div class="text-content">
|
||||||
|
{{item.content}}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
</a-checkbox-group>
|
||||||
</div>
|
</div>
|
||||||
<div class="text-content">
|
<div class="page">
|
||||||
{{item.content}}
|
<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>
|
||||||
</li>
|
</div>
|
||||||
</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>
|
<libraryPush
|
||||||
|
:url="url"
|
||||||
|
ref="libraryPushRef"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
<libraryPush
|
|
||||||
:url="url"
|
|
||||||
ref="libraryPushRef"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import eventBUs from '../../../../common/event'
|
import eventBUs from '../../../../common/event'
|
||||||
import { getAction, postAction } from '@/api/manage'
|
import { getAction, postAction } from '@/api/manage'
|
||||||
import libraryPush from '@/components/libraryPush/index'
|
import libraryPush from '@/components/libraryPush/index'
|
||||||
|
import moment from 'moment'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'DocumentLibrary',
|
name: 'DocumentLibrary',
|
||||||
@@ -116,117 +153,14 @@
|
|||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
searchOption: [
|
searchOption: [],
|
||||||
{
|
queryParam: {},
|
||||||
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: [
|
tableData: [
|
||||||
{}
|
{}
|
||||||
],
|
],
|
||||||
url: {
|
url: {
|
||||||
|
queryCondition: 'search/document/queryCondition',
|
||||||
|
getInfoList: 'search/document/getInfoList',
|
||||||
pullMessage: 'document/bussDocumentLibraryEO/pullMessage'//推送
|
pullMessage: 'document/bussDocumentLibraryEO/pullMessage'//推送
|
||||||
},
|
},
|
||||||
columns: [
|
columns: [
|
||||||
@@ -325,7 +259,8 @@
|
|||||||
],
|
],
|
||||||
total: 0,
|
total: 0,
|
||||||
pageSize: 10,
|
pageSize: 10,
|
||||||
pageNo: 1
|
pageNo: 1,
|
||||||
|
loading: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
@@ -345,12 +280,13 @@
|
|||||||
this.conList = [...this.conList]
|
this.conList = [...this.conList]
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getCondition()
|
||||||
|
this.getInfoList()
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
handleChange() {
|
handleChange() {
|
||||||
|
|
||||||
},
|
|
||||||
onChange(date, dateString) {
|
|
||||||
// console.log(date, dateString);
|
|
||||||
},
|
},
|
||||||
selectListModel(val) {
|
selectListModel(val) {
|
||||||
this.isTrue = val == 'list' ? true : false
|
this.isTrue = val == 'list' ? true : false
|
||||||
@@ -369,10 +305,12 @@
|
|||||||
},
|
},
|
||||||
pageOnChange(page, pageSize) {
|
pageOnChange(page, pageSize) {
|
||||||
this.pageNo = page
|
this.pageNo = page
|
||||||
|
this.getInfoList()
|
||||||
},
|
},
|
||||||
SizeChange(page, pageSize) {
|
SizeChange(page, pageSize) {
|
||||||
this.pageNo = 1
|
this.pageNo = 1
|
||||||
this.pageSize = pageSize
|
this.pageSize = pageSize
|
||||||
|
this.getInfoList()
|
||||||
},
|
},
|
||||||
//收藏按钮
|
//收藏按钮
|
||||||
Collection(val) {
|
Collection(val) {
|
||||||
@@ -425,187 +363,246 @@
|
|||||||
this.$refs.libraryPushRef.visible = true
|
this.$refs.libraryPushRef.visible = true
|
||||||
this.$refs.libraryPushRef.tableKey = item.id.split(',')
|
this.$refs.libraryPushRef.tableKey = item.id.split(',')
|
||||||
})
|
})
|
||||||
}
|
},
|
||||||
|
dateChange(item) {
|
||||||
|
this.queryParam[item] = moment(this.queryParam[item]).format('YYYY-MM-DD')
|
||||||
|
},
|
||||||
|
onChange(item) {
|
||||||
|
let dateOne = moment(this.queryParam[item][0]).format('YYYY-MM-DD')
|
||||||
|
let dateTwo = moment(this.queryParam[item][1]).format('YYYY-MM-DD')
|
||||||
|
this.queryParam[item] = [dateOne, dateTwo]
|
||||||
|
},
|
||||||
|
getCondition() {
|
||||||
|
let query = {
|
||||||
|
flag: 1,
|
||||||
|
searchFlag: 0
|
||||||
|
}
|
||||||
|
getAction(this.url.queryCondition, query).then((res) => {
|
||||||
|
if (res.success) {
|
||||||
|
this.searchOption = res.result
|
||||||
|
} else {
|
||||||
|
this.searchOption = []
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
searchQuery() {
|
||||||
|
this.pageNo = 1
|
||||||
|
this.getInfoList()
|
||||||
|
},
|
||||||
|
searchData(data) {
|
||||||
|
this.queryParam = { ...data, ...this.queryParam }
|
||||||
|
},
|
||||||
|
getInfoList() {
|
||||||
|
let queryParam = JSON.parse(JSON.stringify(this.queryParam))
|
||||||
|
Object.keys(queryParam).forEach(val => {
|
||||||
|
if (queryParam[val] instanceof Array) {
|
||||||
|
queryParam[val] = queryParam[val].join(',')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
let query = {
|
||||||
|
pageNo: this.pageNo,
|
||||||
|
pageSize: this.pageSize,
|
||||||
|
...queryParam
|
||||||
|
}
|
||||||
|
this.loading = true
|
||||||
|
getAction(this.url.getInfoList, query).then((res) => {
|
||||||
|
if (res.success) {
|
||||||
|
this.dataSource = res.result.records
|
||||||
|
this.total = res.result.total
|
||||||
|
this.loading = false
|
||||||
|
} else {
|
||||||
|
this.loading = false
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
searchReset(){
|
||||||
|
this.pageNo = 1
|
||||||
|
this.queryParam = {}
|
||||||
|
this.getInfoList()
|
||||||
|
},
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
.table .ant-table-column-title {
|
.table .ant-table-column-title {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ant-table td {
|
.ant-table td {
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
.checkbox-left .ant-checkbox-inner {
|
.checkbox-left .ant-checkbox-inner {
|
||||||
width: 18px !important;
|
width: 18px !important;
|
||||||
height: 18px !important;
|
height: 18px !important;
|
||||||
line-height: 18px !important;
|
line-height: 18px !important;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
|
|
||||||
.search-con-text {
|
.search-con-text {
|
||||||
|
|
||||||
.search-text-wrap {
|
.search-text-wrap {
|
||||||
margin-top: -27px;
|
margin-top: -27px;
|
||||||
height: 100%;
|
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;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: flex-start;
|
||||||
margin-bottom: 24px;
|
|
||||||
line-height: 32px;
|
|
||||||
|
|
||||||
.text-sel {
|
.text-left {
|
||||||
font-size: 14px;
|
width: 358px;
|
||||||
font-weight: 400;
|
padding: 24px 24px 24px 0;
|
||||||
color: #000F16;
|
box-sizing: border-box;
|
||||||
text-align: right;
|
|
||||||
margin-right: 14px;
|
.text-left-wrap {
|
||||||
width: 83px;
|
|
||||||
white-space: nowrap;
|
.text-left-select {
|
||||||
overflow: hidden;
|
display: flex;
|
||||||
text-overflow: ellipsis;
|
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-select {
|
.text-right {
|
||||||
flex: 1;
|
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;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.text-right {
|
.checkbox-left {
|
||||||
width: 100%;
|
float: left;
|
||||||
position: relative;
|
position: absolute;
|
||||||
padding: 26px 0 22px 24px;
|
left: 0;
|
||||||
|
top: 50%;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-text-right {
|
||||||
|
padding: 19px 28px;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
border-left: 2px solid #E6E7EC;
|
margin-left: 38px;
|
||||||
|
}
|
||||||
|
|
||||||
.search-text-title {
|
.null-input {
|
||||||
padding: 0 0 24px 0;
|
background-color: #F2F4F8;
|
||||||
|
}
|
||||||
|
|
||||||
span {
|
.text-header {
|
||||||
font-size: 14px;
|
margin-bottom: 11px;
|
||||||
font-weight: 400;
|
|
||||||
|
span {
|
||||||
|
margin-right: 52px;
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: bold;
|
||||||
color: #040B29;
|
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 {
|
.text-content {
|
||||||
float: left;
|
font-size: 14px;
|
||||||
position: absolute;
|
font-weight: 400;
|
||||||
left: 0;
|
color: #040B29;
|
||||||
top: 50%;
|
opacity: 0.7;
|
||||||
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 {
|
.box-content {
|
||||||
font-size: 14px;
|
padding: 0 0 0 8px;
|
||||||
font-weight: 400;
|
box-sizing: border-box;
|
||||||
color: #040B29;
|
}
|
||||||
opacity: 0.7;
|
|
||||||
}
|
|
||||||
|
|
||||||
.box-content {
|
.page {
|
||||||
padding: 0 0 0 8px;
|
text-align: right;
|
||||||
box-sizing: border-box;
|
margin-top: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.page {
|
.text-operation {
|
||||||
text-align: right;
|
margin-right: 8px;
|
||||||
margin-top: 20px;
|
}
|
||||||
}
|
.submitButtons{
|
||||||
|
text-align: center;
|
||||||
.text-operation {
|
}
|
||||||
margin-right: 8px;
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
@@ -5,12 +5,11 @@
|
|||||||
<div class="search-detail">
|
<div class="search-detail">
|
||||||
<div class="search-detail-wrap">
|
<div class="search-detail-wrap">
|
||||||
<a-input-group class="input-group" compact v-if="active === $t('DocumentLibrary')">
|
<a-input-group class="input-group" compact v-if="active === $t('DocumentLibrary')">
|
||||||
<a-select default-value="Option1">
|
<a-select v-model="selectModel">
|
||||||
<a-select-option value="Option1">
|
<a-select-option :value="item.db_field_name"
|
||||||
标题
|
@change="selectChange"
|
||||||
</a-select-option>
|
v-for="(item,index) in searchOption" :key="index">
|
||||||
<a-select-option value="Option2">
|
{{item.db_field_txt}}
|
||||||
Option2
|
|
||||||
</a-select-option>
|
</a-select-option>
|
||||||
</a-select>
|
</a-select>
|
||||||
<a-input-search
|
<a-input-search
|
||||||
@@ -42,8 +41,8 @@
|
|||||||
</a-tabs>
|
</a-tabs>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<whole v-if="active === $t('whole')"/>
|
<whole :url="url" v-if="active === $t('whole')"/>
|
||||||
<DocumentLibrary v-else-if="active === $t('DocumentLibrary')"/>
|
<DocumentLibrary ref="DocumentLibraryRef" v-else-if="active === $t('DocumentLibrary')"/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -53,6 +52,7 @@
|
|||||||
<script>
|
<script>
|
||||||
import whole from './components/whole'
|
import whole from './components/whole'
|
||||||
import DocumentLibrary from './components/DocumentLibrary'
|
import DocumentLibrary from './components/DocumentLibrary'
|
||||||
|
import { getAction, postAction, deleteAction, downloadFile } from '@/api/manage'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'searchCenter',
|
name: 'searchCenter',
|
||||||
@@ -63,16 +63,45 @@
|
|||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
active: this.$t('whole'),
|
active: this.$t('whole'),
|
||||||
showList: false
|
showList: false,
|
||||||
|
url: {
|
||||||
|
queryCondition: 'search/document/queryCondition'
|
||||||
|
},
|
||||||
|
selectModel: '',
|
||||||
|
queryParam: {}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getCondition()
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
callback(key) {
|
callback(key) {
|
||||||
this.active = key
|
this.active = key
|
||||||
},
|
},
|
||||||
onSearch() {
|
onSearch(event) {
|
||||||
|
this.queryParam[this.selectModel] = event
|
||||||
|
if (this.$refs.DocumentLibraryRef){
|
||||||
|
this.$refs.DocumentLibraryRef.searchData(this.queryParam)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
selectChange(event) {
|
||||||
|
console.log(event)
|
||||||
|
},
|
||||||
|
getCondition() {
|
||||||
|
let query = {
|
||||||
|
flag: 1,
|
||||||
|
searchFlag: 1
|
||||||
|
}
|
||||||
|
getAction(this.url.queryCondition, query).then((res) => {
|
||||||
|
if (res.success) {
|
||||||
|
this.searchOption = res.result || []
|
||||||
|
if (this.searchOption.length > 0) {
|
||||||
|
this.selectModel = this.searchOption[0].db_field_name
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
this.searchOption = []
|
||||||
|
}
|
||||||
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -139,24 +168,29 @@
|
|||||||
height: 40px;
|
height: 40px;
|
||||||
line-height: 40px;
|
line-height: 40px;
|
||||||
}
|
}
|
||||||
.input-group .ant-select-selection{
|
|
||||||
|
.input-group .ant-select-selection {
|
||||||
width: 88px;
|
width: 88px;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
line-height: 40px;
|
line-height: 40px;
|
||||||
padding: 0 0 0 6px;
|
padding: 0 0 0 6px;
|
||||||
}
|
}
|
||||||
.input-group .ant-select-selection__rendered{
|
|
||||||
|
.input-group .ant-select-selection__rendered {
|
||||||
height: 40px;
|
height: 40px;
|
||||||
line-height: 40px;
|
line-height: 40px;
|
||||||
}
|
}
|
||||||
.input-group .ant-input{
|
|
||||||
|
.input-group .ant-input {
|
||||||
height: 40px;
|
height: 40px;
|
||||||
line-height: 40px;
|
line-height: 40px;
|
||||||
}
|
}
|
||||||
.input-group .ant-select-arrow{
|
|
||||||
|
.input-group .ant-select-arrow {
|
||||||
right: 15px;
|
right: 15px;
|
||||||
}
|
}
|
||||||
.input-group .ant-select{
|
|
||||||
|
.input-group .ant-select {
|
||||||
background: #F6F7FA;
|
background: #F6F7FA;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
Reference in New Issue
Block a user