ZQ/laws-sinotruk-client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[add] 文档拆分模块

Browse Source
This commit is contained in:
lideqin
2023-08-15 18:20:08 +08:00
parent ff0570abd2
commit 74ac8c07d0
11 changed files with 929 additions and 132 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/customField/Search.vue
+69 -63
View File
@@ -1,8 +1,8 @@
<template>
<a-form layout="inline" @keyup.enter.native="searchQuery">
<a-row :gutter="24">
<a-col :md="6" :sm="8" v-for="(item,index) in searchList" :key="index" style="line-height: 48px">
<template v-if="index < 3">
<a-col :md="(24 / (minLength + 1))" :sm="(24 / minLength)" v-for="(item,index) in searchList" :key="index" style="line-height: 48px">
<template v-if="index < minLength">
<!-- 树形选择器 -->
<div class="box-title-text" v-if="item.field_show_type === FieldType.TREE.value">
<div class="title-text" :title="item.db_field_txt">
@@ -87,7 +87,7 @@
<!-- </div>-->
</template>
<template v-if="index >= 3 && toggleSearchStatus">
<template v-if="index >= minLength && toggleSearchStatus">
<div class="box-title-text" v-if="item.field_show_type === FieldType.TREE.value">
<div class="title-text" :title="item.db_field_txt">
<span>{{item.db_field_txt}}</span>
@@ -165,14 +165,14 @@
</a-col>
<span style="float: right;overflow: hidden;margin-right: 11px" class="table-page-search-submitButtons">
<a-col :md="6" :sm="24">
<a-col :md="6" :sm="24">
<a @click="handleToggleSearch" v-if="searchList.length > 3">
{{ !toggleSearchStatus ? $t('open') : $t('putAway') }}
<a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
</a>
<a-button class="box-button" style="margin-left: 8px" @click="searchReset">{{$t('reset')}}</a-button>
<a-button class="box-button" style="margin-left: 8px" type="primary" @click="searchQuery">{{$t('query')}}</a-button>
</a-col>
<a-button class="box-button" style="margin-left: 8px" @click="searchReset">{{$t('reset')}}</a-button>
<a-button class="box-button" style="margin-left: 8px" type="primary" @click="searchQuery">{{$t('query')}}</a-button>
</a-col>
</span>
</a-row>
</a-form>
@@ -183,6 +183,7 @@ import { getAction } from '@/api/manage'
import JDictSelectTag from '../dict/JDictSelectTag'
import JMultiSelectTag from '../dict/JMultiSelectTag'
import { FieldType } from '../../enums/commonEnums'
import eventBus from '@/common/event'
export default {
name: 'Search',
@@ -198,12 +199,16 @@ export default {
type: String,
default: ''
},
searchQueryList: {
type: Array,
default: () => {
return []
}
minLength: {
type: Number,
default: 3
}
// searchQueryList: {
// type: Array,
// default: () => {
// return []
// }
// }
},
data () {
return {
@@ -230,20 +235,20 @@ export default {
field_show_type: '1',
tree: []
},
{
db_field_name: 'state',
db_field_txt: '状态',
dict_field: 'state',
field_show_type: '3',
tree: []
},
{
db_field_name: 'region',
db_field_txt: '适用地区',
dict_field: 'region',
field_show_type: '4',
tree: []
},
// {
// db_field_name: 'state',
// db_field_txt: '状态',
// dict_field: 'state',
// field_show_type: '3',
// tree: []
// },
// {
// db_field_name: 'region',
// db_field_txt: '适用地区',
// dict_field: 'region',
// field_show_type: '4',
// tree: []
// },
// {
// db_field_name: 'technology_territory',
// db_field_txt: '技术领域',
@@ -251,36 +256,36 @@ export default {
// field_show_type: '0',
// tree: []
// },
{
db_field_name: 'issue_time',
db_field_txt: '发布日期',
dict_field: '',
field_show_type: '5',
tree: []
},
{
db_field_name: 'xin1_che1_xing2_shi2_shi1_ri4_qi1',
db_field_txt: '新车型实施日期',
dict_field: '',
field_show_type: '5',
tree: []
},
{
db_field_name: 'implement_time',
db_field_txt: '在产车实施日期',
dict_field: '',
field_show_type: '5',
tree: []
}
// {
// db_field_name: 'issue_time',
// db_field_txt: '发布日期',
// dict_field: '',
// field_show_type: '5',
// tree: []
// },
// {
// db_field_name: 'xin1_che1_xing2_shi2_shi1_ri4_qi1',
// db_field_txt: '新车型实施日期',
// dict_field: '',
// field_show_type: '5',
// tree: []
// },
// {
// db_field_name: 'implement_time',
// db_field_txt: '在产车实施日期',
// dict_field: '',
// field_show_type: '5',
// tree: []
// }
]
},
methods: {
searchQuery () {
this.$emit('searchQuery', JSON.parse(JSON.stringify(this.queryParam)))
eventBus.$emit('searchQuery', JSON.parse(JSON.stringify(this.queryParam)))
},
searchReset () {
this.queryParam = {}
this.$emit('searchQuery', JSON.parse(JSON.stringify(this.queryParam)))
eventBus.$emit('searchQuery', JSON.parse(JSON.stringify(this.queryParam)))
},
// 获取查询条件列表
getSearch () {
@@ -290,20 +295,21 @@ export default {
getAction(this.url.getSearchList, params).then((res) => {
if (res.success) {
this.searchList = res.result
if (this.searchQueryList && this.searchQueryList.length > 0) {
for (let i = 0; i < this.searchList.length; i++) {
if (this.searchList[i].db_field_name === 'issue_time') {
this.searchList.splice(i, 1)
i--
}
// db_field_name 说明可以被代替位置？？
if (this.searchList[i].db_field_name === 'title') {
const data = this.searchList[i + 1]
this.searchList[i + 1] = this.searchQueryList[0]
this.searchList.push(data)
}
}
}
// if (this.searchQueryList && this.searchQueryList.length > 0) {
// for (let i = 0; i < this.searchList.length; i++) {
// // 是要去掉这个字段的搜索？？
// if (this.searchList[i].db_field_name === 'issue_time') {
// this.searchList.splice(i, 1)
// i--
// }
// // db_field_name 说明可以被代替位置？？
// if (this.searchList[i].db_field_name === 'title') {
// const data = this.searchList[i + 1]
// this.searchList[i + 1] = this.searchQueryList[0]
// this.searchList.push(data)
// }
// }
// }
}
})
},
src/components/customField/TableData.vue
+56 -42
View File
@@ -1,19 +1,18 @@
<template>
<div style="height: 100%">
<div class="box" v-if="isTrue">
<a-table
class="table"
rowKey="id"
:row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
:pagination="ipagination"
:scroll="{x: '100%'}"
:components="drag(columns,'columns')"
:data-source="dataSource"
:loading="loading"
:rowClassName="rowClassName"
:columns="columns"
@change="tableOnChange"
>
<div class="box" v-if="isTrue">
<a-table
class="table"
rowKey="id"
:row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange, type: selectionType }"
:pagination="ipagination"
:scroll="{x: '100%'}"
:components="drag(columns,'columns')"
:data-source="dataSource"
:loading="loading"
:rowClassName="rowClassName"
:columns="columns"
@change="tableOnChange"
>
<span slot="operation" slot-scope="text, record">
<a v-for="(ol, index) in operationList" :key="index" @click="operationClick(ol,record)">
<span v-if="ol.text === $t('cancelCollection')" v-has="ol.has" class="text">
@@ -27,29 +26,34 @@
</span>
</a>
</span>
<span slot="detailClick" slot-scope="text,record">
<span slot="detailClick" slot-scope="text, record">
<a class="textName" :title="text" @click="detailClick(record)">
{{text}}
</a>
</span>
<!-- <span slot="urlClick" slot-scope="text,record">-->
<!-- <a class="text" :title="text" @click="urlClick(text)">-->
<!-- {{text}}-->
<!-- </a>-->
<!-- </span>-->
<!-- <span slot="detailText" slot-scope="text,record">-->
<!-- <span class="text" :title="text">-->
<!-- {{text}}-->
<!-- </span>-->
<!-- </span>-->
</a-table>
</div>
<span slot="detail" slot-scope="text">
<span class="textName" :title="text">
{{text}}
</span>
</span>
<!-- <span slot="urlClick" slot-scope="text,record">-->
<!-- <a class="text" :title="text" @click="urlClick(text)">-->
<!-- {{text}}-->
<!-- </a>-->
<!-- </span>-->
<!-- <span slot="detailText" slot-scope="text,record">-->
<!-- <span class="text" :title="text">-->
<!-- {{text}}-->
<!-- </span>-->
<!-- </span>-->
</a-table>
</div>
</template>
<script>
import { ResizeColumnProvide, ResizeHeader } from '@/mixins/header'
import { getAction, postAction } from '@/api/manage'
import eventBus from '@/common/event'
export default {
name: 'TableData',
@@ -73,10 +77,19 @@ export default {
type: String,
default: ''
},
// 表格选择是单选还是多选
selectionType: {
type: String,
default: 'checkbox'
},
// 是否显示操作；默认不显示
showAction: {
type: Boolean,
default: false
},
type: {
type: String,
default: ''
}
},
data () {
@@ -104,7 +117,7 @@ export default {
}
},
mounted () {
this.$on('searchQuery', search => {
eventBus.$on('searchQuery', search => {
Object.keys(search).forEach(res => {
if (search[res] instanceof Array) {
search[res] = search[res].join(',')
@@ -114,7 +127,7 @@ export default {
this.getData()
this.getTableList()
})
this.$on('searchReset', target => {
eventBus.$on('searchReset', target => {
this.searchParams = {}
this.selectedRowKeys = []
this.getData()
@@ -179,13 +192,13 @@ export default {
ellipsis: true,
width: 215
},
{
title: this.$t('operation'),
align: 'center',
fixed: 'right',
width: 200,
scopedSlots: { customRender: 'operation' }
}
// {
// title: this.$t('operation'),
// align: 'center',
// fixed: 'right',
// width: 200,
// scopedSlots: { customRender: 'operation' }
// }
]
this.dataSource = [
{
@@ -204,8 +217,8 @@ export default {
this.isTrue = true
},
beforeDestroy () {
this.$off('searchQuery')
this.$off('searchReset')
eventBus.$off('searchQuery')
eventBus.$off('searchReset')
this.$off('searchGetData')
},
methods: {
@@ -287,6 +300,7 @@ export default {
...this.searchParams,
orderBy: this.orderBy,
orderByField: this.orderByField,
type: this.type,
pageNo: pageNo,
pageSize: pageSize
}
@@ -306,9 +320,9 @@ export default {
}
})
},
onSelectChange (value) {
this.selectedRowKeys = value
this.$emit('onSelectChange', value)
onSelectChange (selectedRowKeys, selectedRows) {
this.selectedRowKeys = selectedRowKeys
this.$emit('onSelectChange', selectedRowKeys, selectedRows)
},
operationClick (ol, item) {
this.$emit(ol.clickEvent, item)
src/components/splitUpload/SplitUpload.vue
+150
View File
@@ -0,0 +1,150 @@
<template>
<div class="split-import-upload">
<a-upload
accept=".zip"
:disabled="disabled"
class="ant-upload-list"
name="file"
:list-type="listType"
:file-list="myFileList"
:multiple="false"
:action="uploadAction"
:headers="headers"
:before-upload="beforeUpload"
:remove='remove'
@change="handleChange">
<div class="operator-text">
<a-icon type="export" :rotate="-90"/>
拆分文件
</div>
</a-upload>
</div>
</template>
<script>
import Vue from 'vue'
import { ACCESS_TOKEN } from '@/store/mutation-types'
export default {
name: 'SplitUpload',
props: ['disabled', 'listType'],
data () {
return {
visible: false,
uploadAction: window._CONFIG.domianURL + '/sys/common/upload',
myFileList: [],
fileList: [],
fileTypeStatus: false,
headers: {}
}
},
created () {
const token = Vue.ls.get(ACCESS_TOKEN)
this.headers = { 'X-Access-Token': token }
},
methods: {
beforeUpload (file, fileList) {
console.log('file', this.accept, file, fileList, this.myFileList)
this.fileTypeSatus = false
if (this.myFileList && this.myFileList.length >= 1) {
this.$message.warning(this.$t('onlyOnefileUploaded'))
return false
} else {
const suffix = file.name.split('.')
const acceptSuffix = suffix[suffix.length - 1]
if (acceptSuffix.toLowerCase() === 'zip') {
this.fileTypeSatus = true
this.$message.destroy()
// 207M.doc文件大小超出100MB限制, 请压缩或降低文件质量!
this.errorMessage = file.name + '文件大小超出100MB限制, 请压缩或降低文件质量!'
// }
}
}
},
remove () {
this.fileTypeSatus = true
},
handleChange (info) {
const { file } = info
const status = info.file.status
info.fileList.forEach((val, index) => {
if (val.response && !val.response.result) {
this.$message.error(val.response.message)
info.fileList.splice(index, 1)
}
})
if (this.fileTypeSatus) {
if (file.size > 100000000) {
this.$message.error(this.errorMessage)
} else {
if (status === 'error') {
this.$emit('uploadSuccess', this.fileList)
this.$message.destroy()
this.$message.error(`${info.file.name}` + this.$t('fileUploadFailed'))
} else if (status === 'removed') {
this.myFileList = info.fileList
this.fileList = []
this.myFileList.forEach((res) => {
if (res.response) {
this.fileList.push(res.response.result)
} else {
this.fileList.push(res)
}
})
this.$emit('uploadSuccess', this.fileList)
this.$message.destroy()
this.$message.success(`${info.file.name}` + this.$t('deletedSuccessfully'))
} else if (status === 'done') {
this.fileList = []
this.myFileList = info.fileList
this.myFileList.forEach((res) => {
if (res.response) {
this.fileList.push(res.response.result)
} else {
this.fileList.push(res)
}
})
if (this.myFileList.length > 0) {
this.$emit('uploadSuccess', this.fileList)
this.$message.destroy()
this.$message.success(`${info.file.name}` + this.$t('uploadSuccessful'))
}
} else if (status === 'uploading') {
this.myFileList = info.fileList
this.$emit('uploadSuccess')
}
}
} else if (!this.fileTypeSatus && this.myFileList.length < 1) {
this.$message.warning(this.$t('typeCannotUploaded'))
}
}
}
}
</script>
<style scoped lang="less">
.split-import-upload {
/deep/ .ant-upload-list-item {
position: relative;
height: 22px;
margin-top: -22px;
font-size: 14px;
margin-right: 100px;
}
/deep/ .ant-upload-list-item-info {
span {
display: flex;
justify-content: start;
text-align: right;
.ant-upload-list-item-name {
margin-right: 20px;
max-width: 800px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
}
}
}
</style>