WL/laws_weilai
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改搜索中心的问题

Browse Source
This commit is contained in:
qq787203167
2022-03-16 14:18:18 +08:00
parent 17d3c0c51d
commit eaa219a460
3 changed files with 352 additions and 288 deletions
Download Patch File Download Diff File Expand all files Collapse all files
jero-web/src/views/documentManage/library/docDetail/index.vue
-1
View File
@@ -235,7 +235,6 @@
}) })
}, },
pdfPreview(fileQuery) { pdfPreview(fileQuery) {
console.log(fileQuery)
let fileName = fileQuery.fileName let fileName = fileQuery.fileName
let index1 = fileName.lastIndexOf('.') let index1 = fileName.lastIndexOf('.')
let index2 = fileName.length let index2 = fileName.length
jero-web/src/views/documentTools/searchCenter/components/DocumentLibrary.vue
+351 -286
View File
@@ -1,89 +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" v-for="(item,index) in searchOption" :key="index"> <div class="text-left-wrap" v-for="(item,index) in searchOption" :key="index">
<div class="text-left-select" v-if="item.field_show_type == '0'"> <div class="text-left-select" v-if="item.field_show_type == '0'">
<span class="text-sel">{{item.db_field_txt}}</span> <span class="text-sel">{{item.db_field_txt}}</span>
<a-tree-select <a-tree-select
class="text-select" class="text-select"
v-model="queryParam[item.db_field_name]" v-model="queryParam[item.db_field_name]"
:maxTagCount="1" :maxTagCount="1"
:tree-data="item.tree" :tree-data="item.tree"
tree-checkable tree-checkable
:placeholder="$t('PleaseSelect')+item.db_field_txt" :placeholder="$t('PleaseSelect')+item.db_field_txt"
/> />
</div> </div>
<div class="text-left-select" v-if="item.field_show_type == '1' || item.field_show_type == '8' || <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'"> item.field_show_type == '9' || item.field_show_type == '10' || item.field_show_type == '11'">
<span class="text-sel">{{item.db_field_txt}}</span> <span class="text-sel">{{item.db_field_txt}}</span>
<a-input class="text-select" <a-input class="text-select"
v-model="queryParam[item.db_field_name]" v-model="queryParam[item.db_field_name]"
:placeholder="$t('PleaseEnter')+item.db_field_txt"/> :placeholder="$t('PleaseEnter')+item.db_field_txt"/>
</div> </div>
<div class="text-left-select" v-if="item.field_show_type == '2'"> <div class="text-left-select" v-if="item.field_show_type == '2'">
<span class="text-sel">{{item.db_field_txt}}</span> <span class="text-sel">{{item.db_field_txt}}</span>
<a-input-number class="text-select" :placeholder="$t('PleaseEnter')+item.db_field_txt" <a-input-number class="text-select" :placeholder="$t('PleaseEnter')+item.db_field_txt"
v-model="queryParam[item.db_field_name]" :min="1" :max="99999999"/> v-model="queryParam[item.db_field_name]" :min="1" :max="99999999"/>
</div> </div>
<div class="text-left-select" v-if="item.field_show_type == '3'"> <div class="text-left-select" v-if="item.field_show_type == '3'">
<span class="text-sel">{{item.db_field_txt}}</span> <span class="text-sel">{{item.db_field_txt}}</span>
<j-dict-select-tag class="text-select" v-model="queryParam[item.db_field_name]" <j-dict-select-tag class="text-select" v-model="queryParam[item.db_field_name]"
:placeholder="$t('PleaseSelect')+item.db_field_txt" :placeholder="$t('PleaseSelect')+item.db_field_txt"
:type="'select'" :type="'select'"
:triggerChange="false" :dictCode="item.dict_field"/> :triggerChange="false" :dictCode="item.dict_field"/>
</div> </div>
<div class="text-left-select" v-if="item.field_show_type == '4'"> <div class="text-left-select" v-if="item.field_show_type == '4'">
<span class="text-sel">{{item.db_field_txt}}</span> <span class="text-sel">{{item.db_field_txt}}</span>
<j-multi-select-tag class="text-select" v-model="queryParam[item.db_field_name]" <j-multi-select-tag class="text-select" v-model="queryParam[item.db_field_name]"
:placeholder="$t('PleaseSelect')+item.db_field_txt" :type="'select'" :placeholder="$t('PleaseSelect')+item.db_field_txt" :type="'select'"
:triggerChange="false" :dictCode="item.dict_field"/> :triggerChange="false" :dictCode="item.dict_field"/>
</div> </div>
<div class="text-left-select" v-if="item.field_show_type == '5'"> <div class="text-left-select" v-if="item.field_show_type == '5'">
<span class="text-sel">{{item.db_field_txt}}</span> <span class="text-sel">{{item.db_field_txt}}</span>
<a-date-picker class="text-select" <a-date-picker class="text-select"
:placeholder="$t('PleaseSelect')+item.db_field_txt" :placeholder="$t('PleaseSelect')+item.db_field_txt"
@change="dateChange(item.db_field_name)" @change="dateChange(item.db_field_name)"
v-model="queryParam[item.db_field_name]"/> v-model="queryParam[item.db_field_name]"/>
</div> </div>
<div class="text-left-select" v-if="item.field_show_type == '6'"> <div class="text-left-select" v-if="item.field_show_type == '6'">
<span class="text-sel">{{item.db_field_txt}}</span> <span class="text-sel">{{item.db_field_txt}}</span>
<a-range-picker class="text-select" v-model="queryParam[item.db_field_name]" <a-range-picker class="text-select" v-model="queryParam[item.db_field_name]"
:placeholder="$t('PleaseSelect')+item.db_field_txt" :placeholder="$t('PleaseSelect')+item.db_field_txt"
@change="onChange(item.db_field_name)"></a-range-picker> @change="onChange(item.db_field_name)"></a-range-picker>
</div> </div>
</div> </div>
<div class="table-page-search-submitButtons submitButtons"> <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" type="primary" @click="searchQuery">{{$t('query')}}</a-button>
<a-button class="box-button" style="margin-left: 8px" @click="searchReset">{{$t('reset')}} <a-button class="box-button" style="margin-left: 8px" @click="searchReset">{{$t('reset')}}
</a-button> </a-button>
</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>
<div class="text-right"> </div>
<div class="search-text-list"> <a-table
<div class="search-text-title"> v-if="isTrue"
<span>检索范围：</span> ref="table"
<span>纯电动</span> size="middle"
<div class="search-header-right"> :loading="loading"
<a-icon type="appstore" class="header-list" :title="$t('list')" :scroll="{x: true}"
:class="{'header-list-active':isTrue }" rowKey="id"
@click="selectListModel('list')"></a-icon> :data-source="dataSource"
<a-icon type="unordered-list" class="header-list" :title="$t('paragraph')" :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
:class="{'header-list-active':!isTrue }" :columns="columns"
@click="selectListModel('unord')"></a-icon> >
</div>
</div>
<a-table
v-if="isTrue"
ref="table"
size="middle"
:loading="loading"
:scroll="{x: true}"
rowKey="id"
:data-source="dataSource"
: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')}}
@@ -93,56 +93,78 @@
</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="serial_number" slot-scope="text,record">
<!-- <span slot="templateContent" slot-scope="text">--> <span v-html="record.serial_number"></span>
<!-- <j-ellipsis :value="text" :length="25"/>--> </span>
<!-- </span>--> <span slot="titleName" slot-scope="text,record">
</a-table> <span v-html="record.title"></span>
<div v-if="!isTrue" class="box-content"> </span>
<a-checkbox-group v-model="checkboxText"> <span slot="file_name" slot-scope="text,record">
<li v-for="item in conList" :key="item.id"> <a style="color:#21c9cc" @click="fileNameClick(record)">
<div style="margin-bottom: 10px;position: relative"> {{record.file_name && record.file_name.length > 0 ? '查看文件' : '--'}}
<a-checkbox :value="item.id" class="checkbox-left"></a-checkbox> </a>
<div class="text-text-right" </span>
@click="checkedClick(item)" file_name
:class="{ 'null-input':item.checked }"> <!-- 字符串超长截取省略号显示-->
<div class="text-header"> <!-- <span slot="templateContent" slot-scope="text">-->
<span>{{item.type}}</span> <!-- <j-ellipsis :value="text" :length="25"/>-->
<span>{{item.number}}</span> <!-- </span>-->
<span>{{item.title}}</span> </a-table>
</div> <div v-if="!isTrue" class="box-content">
<div class="text-content"> <a-checkbox-group v-model="checkboxText">
{{item.content}} <li v-for="item in conList" :key="item.id">
</div> <div style="margin-bottom: 10px;position: relative">
</div> <a-checkbox :value="item.id" class="checkbox-left"></a-checkbox>
</div> <div class="text-text-right"
</li> @click="checkedClick(item)"
</a-checkbox-group> :class="{ 'null-input':item.checked }">
<div class="text-header">
<span>{{item.type}}</span>
<span>{{item.number}}</span>
<span>{{item.title}}</span>
</div> </div>
<div class="page"> <div class="text-content">
<a-pagination {{item.content}}
: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>
</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>
<libraryPush </div>
:url="url"
ref="libraryPushRef"
/>
</div> </div>
<libraryPush
:url="url"
ref="libraryPushRef"
/>
<a-modal
title="查看文件"
:width="500"
:visible="visible"
@ok="visible=false"
@cancel="visible=false"
>
<p v-for="(item,index) in fileList" :key="index"
class="fileText" :title="item.fileName" @click="fileClick(item)">{{ item.fileName }}</p>
</a-modal>
</div>
</template> </template>
<script> <script>
import eventBUs from '../../../../common/event' import eventBUs from '../../../../common/event'
import { getAction, postAction } from '@/api/manage' import { getAction, postAction, downloadFile } from '@/api/manage'
import libraryPush from '@/components/libraryPush/index' import libraryPush from '@/components/libraryPush/index'
import moment from 'moment' import moment from 'moment'
@@ -155,6 +177,7 @@
return { return {
searchOption: [], searchOption: [],
queryParam: {}, queryParam: {},
visible: false,
dataSource: [], dataSource: [],
url: { url: {
queryCondition: 'search/document/queryCondition', queryCondition: 'search/document/queryCondition',
@@ -165,17 +188,20 @@
{ {
title: this.$t('standard'), title: this.$t('standard'),
align: 'center', align: 'center',
dataIndex: 'serial_number' dataIndex: 'serial_number',
scopedSlots: { customRender: 'serial_number' }
}, },
{ {
title: this.$t('title'), title: this.$t('title'),
align: 'center', align: 'center',
dataIndex: 'title' dataIndex: 'title',
scopedSlots: { customRender: 'titleName' }
}, },
{ {
title: this.$t('fileName'), title: this.$t('fileName'),
align: 'center', align: 'center',
dataIndex: 'fileName' dataIndex: 'file_name',
scopedSlots: { customRender: 'file_name' }
}, },
{ {
title: this.$t('status'), title: this.$t('status'),
@@ -258,7 +284,9 @@
total: 0, total: 0,
pageSize: 10, pageSize: 10,
pageNo: 1, pageNo: 1,
loading: false loading: false,
selectModel: '',
fileList: []
} }
}, },
watch: { watch: {
@@ -387,8 +415,9 @@
this.pageNo = 1 this.pageNo = 1
this.getInfoList() this.getInfoList()
}, },
searchData(data) { searchData(data, selectModel) {
this.queryParam = { ...data, ...this.queryParam } this.queryParam = { ...this.queryParam, ...data }
this.selectModel = selectModel
this.getInfoList() this.getInfoList()
}, },
getInfoList() { getInfoList() {
@@ -407,6 +436,11 @@
getAction(this.url.getInfoList, query).then((res) => { getAction(this.url.getInfoList, query).then((res) => {
if (res.success) { if (res.success) {
this.dataSource = res.result.records this.dataSource = res.result.records
this.dataSource.forEach((val) => {
if (val[this.selectModel] && val[this.selectModel].includes(this.queryParam[this.selectModel])) {
val[this.selectModel] = val[this.selectModel].replace(this.queryParam[this.selectModel], `<text style="color:#21c9cc">${this.queryParam[this.selectModel]}</text>`)
}
})
this.total = res.result.total this.total = res.result.total
this.loading = false this.loading = false
} else { } else {
@@ -418,191 +452,222 @@
this.pageNo = 1 this.pageNo = 1
this.queryParam = {} this.queryParam = {}
this.getInfoList() this.getInfoList()
},
fileNameClick(row) {
this.fileList = row.file_name || []
if (this.fileList.length > 0) {
this.visible = true
}
},
fileClick(fileQuery) {
let fileName = fileQuery.fileName
let index1 = fileName.lastIndexOf('.')
let index2 = fileName.length
let fileSuffix = fileName.substring(index1, index2)
if (fileSuffix == '.pdf') {
window.open('/pdf/web/viewer.html?file=' + encodeURIComponent('/jero-boot/sys/common/pdf/viewFile?id=' + fileQuery.id))
} else if (fileSuffix == '.docx') {
let url = window._CONFIG['onlinePreviewDomainURL'] + '?url=' + encodeURIComponent(this.downLoadFileUrl + '/' + fileQuery.id)
window.open(url, '_blank')
} else if (fileSuffix == '.xlsx' || fileSuffix == '.xls') {
let url = window._CONFIG['onlinePreviewDomainURL'] + '?url=' + encodeURIComponent(this.downLoadFileUrl + '/' + fileQuery.id)
window.open(url, '_blank')
} else {
downloadFile('/sys/common/download', fileQuery.fileName, { id: fileQuery.id })
}
} }
} }
} }
</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: flex-start; justify-content: space-between;
margin-bottom: 24px;
line-height: 32px;
.text-left { .text-sel {
width: 358px; font-size: 14px;
padding: 24px 24px 24px 0; font-weight: 400;
box-sizing: border-box; color: #000F16;
text-align: right;
.text-left-wrap { margin-right: 14px;
width: 83px;
.text-left-select { white-space: nowrap;
display: flex; overflow: hidden;
justify-content: space-between; text-overflow: ellipsis;
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 { .text-select {
width: 100%; flex: 1;
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 { .text-right {
float: left; width: 100%;
position: absolute; position: relative;
left: 0; padding: 26px 0 22px 24px;
top: 50%;
transform: translateY(-50%);
}
.text-text-right {
padding: 19px 28px;
box-sizing: border-box; box-sizing: border-box;
margin-left: 38px; border-left: 2px solid #E6E7EC;
}
.null-input { .search-text-title {
background-color: #F2F4F8; padding: 0 0 24px 0;
}
.text-header { span {
margin-bottom: 11px; font-size: 14px;
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;
}
}
} }
}
.text-content { .search-text-list {
font-size: 14px; ul {
font-weight: 400; padding: 0 0 0 18px;
color: #040B29; margin: 0;
opacity: 0.7;
}
.box-content { li {
padding: 0 0 0 8px; list-style: none;
box-sizing: border-box;
}
.page { .text-content {
text-align: right; font-size: 14px;
margin-top: 20px; font-weight: 400;
color: #040B29;
opacity: 0.8;
}
}
}
}
}
} }
}
.text-operation { .checkbox-left {
margin-right: 8px; float: left;
} position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
}
.submitButtons { .text-text-right {
text-align: center; 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;
}
.text-operation {
margin-right: 8px;
}
.submitButtons {
text-align: center;
}
.fileText {
width: 100%;
cursor: pointer;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
</style> </style>
jero-web/src/views/documentTools/searchCenter/index.vue
+1 -1
View File
@@ -82,7 +82,7 @@
onSearch(event) { onSearch(event) {
this.queryParam[this.selectModel] = event this.queryParam[this.selectModel] = event
if (this.$refs.DocumentLibraryRef){ if (this.$refs.DocumentLibraryRef){
this.$refs.DocumentLibraryRef.searchData(this.queryParam) this.$refs.DocumentLibraryRef.searchData(this.queryParam,this.selectModel)
} }
}, },
onChange(e){ onChange(e){