5 changed files with 706 additions and 466 deletions
-
188src/views/collectReorganizi/collectionLibrary/module/blukEditing/index.vue
-
208src/views/collectReorganizi/collectionLibrary/module/bulkImport/index.vue
-
499src/views/collectReorganizi/collectionLibrary/module/collectHeader.vue
-
51src/views/collectReorganizi/collectionLibrary/module/fileNumberAdjustment/index.vue
-
226src/views/collectReorganizi/collectionLibrary/module/uploadOriginal/index.vue
@ -0,0 +1,188 @@ |
|||
<template> |
|||
<!--批量修改--> |
|||
<el-dialog class="upload-dialog" title="批量修改" :close-on-click-modal="false" :modal-append-to-body="false" append-to-body :visible.sync="bulkEditingVisible"> |
|||
<div class="setting-dialog"> |
|||
<div class="bulk-editing-container"> |
|||
<el-form ref="editForm" :model="editForm" :rules="editRules" label-width="100px"> |
|||
<el-form-item label="修改字段" prop="fieldItem"> |
|||
<el-select v-model="editForm.fieldItem" placeholder="请选择" style="width: 360px;"> |
|||
<el-option |
|||
v-for="item in fieldItemOptions" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
/> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="修改方式" prop="type"> |
|||
<el-select v-model="editForm.type" placeholder="请选择" style="width: 360px;"> |
|||
<el-option |
|||
v-for="item in editTypeOptions" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
/> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item v-if="editForm.type === '替换'" label="查询内容" prop="content"> |
|||
<el-input v-model="editForm.queryContent" style="width: 360px;" /> |
|||
</el-form-item> |
|||
<el-form-item label="更新内容" prop="content"> |
|||
<el-input v-if="editForm.fieldItem !== '2' && editForm.fieldItem !== '3'" v-model="editForm.content" style="width: 360px;" /> |
|||
<el-select v-if="editForm.fieldItem === '2'" v-model="editForm.content" placeholder="请选择" style="width: 360px;"> |
|||
<el-option |
|||
v-for="item in fieldOptions" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
/> |
|||
</el-select> |
|||
<el-date-picker |
|||
v-if="editForm.fieldItem === '3'" |
|||
v-model="editForm.content" |
|||
type="date" |
|||
placeholder="选择日期" |
|||
style="width: 360px;" |
|||
/> |
|||
</el-form-item> |
|||
</el-form> |
|||
</div> |
|||
<div slot="footer" class="dialog-footer"> |
|||
<el-button type="text" @click="bulkEditingVisible = false">取消</el-button> |
|||
<el-button type="primary" @click.native="onSubmitBlukEditing('editForm')">确定</el-button> |
|||
</div> |
|||
</div> |
|||
</el-dialog> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: 'BlukEditing', |
|||
components: { }, |
|||
mixins: [], |
|||
data() { |
|||
return { |
|||
// 批量修改 |
|||
bulkEditingVisible: false, |
|||
editForm: { |
|||
fieldItem: '', |
|||
type: '填充', |
|||
queryContent: '', |
|||
content: '' |
|||
}, |
|||
fieldItemOptions: [ |
|||
{ |
|||
value: '1', |
|||
label: '非字典项&&文本' |
|||
}, |
|||
{ |
|||
value: '2', |
|||
label: '字典项' |
|||
}, |
|||
{ |
|||
value: '3', |
|||
label: '日期' |
|||
}, |
|||
{ |
|||
value: '4', |
|||
label: '数字' |
|||
} |
|||
], |
|||
editTypeOptions: [], |
|||
fieldOptions: [ |
|||
{ |
|||
value: '字典项1', |
|||
label: '字典项1' |
|||
} |
|||
] |
|||
} |
|||
}, |
|||
computed: { |
|||
editRules() { |
|||
const validateRule = { |
|||
fieldItem: [ |
|||
{ required: true, message: '请选择修改字段', trigger: 'change' } |
|||
], |
|||
type: [ |
|||
{ required: true, message: '请选择修改方式', trigger: 'change' } |
|||
], |
|||
queryContent: [ |
|||
{ required: true, message: '请输入', trigger: 'blur' } |
|||
], |
|||
content: [ |
|||
{ required: true } |
|||
] |
|||
} |
|||
if (this.editForm.fieldItem === '2') { |
|||
this.$set(validateRule, 'content', [ |
|||
{ required: true, message: '请选择需更新内容得字典项', trigger: 'change' } |
|||
]) |
|||
} else if (this.editForm.fieldItem === '3') { |
|||
this.$set(validateRule, 'content', [ |
|||
{ type: 'date', required: true, message: '请选择日期', trigger: 'change' } |
|||
]) |
|||
} else { |
|||
this.$set(validateRule, 'content', [ |
|||
{ required: true, message: '请输入更新内容', trigger: 'blur' } |
|||
]) |
|||
} |
|||
return validateRule |
|||
} |
|||
}, |
|||
watch: { |
|||
'editForm.fieldItem'(newVal) { |
|||
this.$refs.editForm.clearValidate() |
|||
this.editForm.content = '' |
|||
this.editForm.type = '填充' |
|||
if (newVal === '1') { |
|||
this.editTypeOptions = [{ |
|||
value: '填充', |
|||
label: '填充' |
|||
}, |
|||
{ |
|||
value: '替换', |
|||
label: '替换' |
|||
}] |
|||
} else if (newVal === '2' || newVal === '3') { |
|||
this.editTypeOptions = [{ |
|||
value: '填充', |
|||
label: '填充' |
|||
}] |
|||
} else if (newVal === '4') { |
|||
this.editTypeOptions = [{ |
|||
value: '填充', |
|||
label: '填充' |
|||
}, |
|||
{ |
|||
value: '替换', |
|||
label: '替换' |
|||
}, |
|||
{ |
|||
value: '增加', |
|||
label: '增加' |
|||
}, |
|||
{ |
|||
value: '减少', |
|||
label: '减少' |
|||
}] |
|||
} |
|||
} |
|||
}, |
|||
methods: { |
|||
onSubmitBlukEditing(formName) { |
|||
this.$refs[formName].validate((valid) => { |
|||
if (valid) { |
|||
this.$message('submit!') |
|||
this.bulkEditingVisible = false |
|||
} else { |
|||
console.log('error submit!!') |
|||
return false |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang='scss' scoped> |
|||
</style> |
|||
@ -0,0 +1,208 @@ |
|||
<template> |
|||
<!-- 批量导入 --> |
|||
<el-dialog title="批量导入" :close-on-click-modal="false" :modal-append-to-body="false" append-to-body :visible.sync="bulkImportVisible"> |
|||
<div class="setting-dialog"> |
|||
<div class="bulk-import-item"> |
|||
<h4 class="bulk-import-title1">下载模板</h4> |
|||
<a class="template-name" href="/path/to/file.pdf" download><i class="iconfont icon-xiazai" />文书档案（案卷）</a> |
|||
</div> |
|||
<div class="bulk-import-item"> |
|||
<h4 class="bulk-import-title2">上传导入</h4> |
|||
<el-form ref="form" :model="form" :rules="rules" label-width="110px"> |
|||
<el-form-item label="上传Excel" prop="file"> |
|||
<div class="input-import"> |
|||
<input ref="excelInput" type="file" @change="handleFileExcel"> |
|||
<div class="upload-excel"><i class="iconfont icon-shangchuan2" />选择文件</div> |
|||
</div> |
|||
<div v-for="item in excelList" :key="item.name" class="file-list"> |
|||
<i class="iconfont icon-xiaowenjian" /> |
|||
{{ item.name }} |
|||
</div> |
|||
</el-form-item> |
|||
<el-form-item label="导入类型" prop="type"> |
|||
<el-select v-model="form.type" placeholder="请选择" style="width: 560px;"> |
|||
<el-option |
|||
v-for="item in typeOptions" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
/> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="重复验证字段" prop="fields"> |
|||
<el-select v-model="form.fields" multiple placeholder="请选择" style="width: 560px;"> |
|||
<el-option |
|||
v-for="item in fieldsOptions" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
/> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="导入"> |
|||
<el-button class="import-submit" type="primary" @click="onSubmitImport('form')">上传并导入</el-button> |
|||
</el-form-item> |
|||
</el-form> |
|||
</div> |
|||
<div class="chapter-tip"> |
|||
<p>注意事项</p> |
|||
<span>模板中第一行为表单字段名称，从第二行开始填写需要导入的数据。</span> |
|||
<span>数据之间不能有空行。（若存在空行，仅会导入空行以上的数据）</span> |
|||
</div> |
|||
</div> |
|||
</el-dialog> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: 'BulkImport', |
|||
components: { }, |
|||
mixins: [], |
|||
data() { |
|||
return { |
|||
// 批量导入 |
|||
bulkImportVisible: false, |
|||
rules: { |
|||
name: [ |
|||
{ required: true, message: '请输入活动名称', trigger: 'blur' }, |
|||
{ min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' } |
|||
] |
|||
}, |
|||
form: { |
|||
file: '', |
|||
type: '', |
|||
fields: [] |
|||
}, |
|||
excelList: [], |
|||
typeOptions: [ |
|||
{ |
|||
value: '追加', |
|||
label: '追加' |
|||
} |
|||
], |
|||
fieldsOptions: [ |
|||
{ |
|||
value: '字段1', |
|||
label: '字段1' |
|||
} |
|||
] |
|||
} |
|||
}, |
|||
created() { |
|||
}, |
|||
mounted() { |
|||
}, |
|||
methods: { |
|||
handleFileExcel(event) { |
|||
const files = event.target.files |
|||
const file = files[0] // 获取上传的文件 |
|||
const allowedExtensions = /(\.xlsx)$/i // 定义允许上传的文件格式，这里只限制为xlsx格式 |
|||
if (!allowedExtensions.exec(file.name)) { |
|||
this.$message.warning('只能上传Excel文件！') // 弹出提示信息 |
|||
event.target.value = '' // 清空文件输入框内容 |
|||
return false |
|||
} |
|||
for (let i = 0; i < files.length; i++) { |
|||
this.excelList = [] |
|||
this.excelList.push(files[i]) |
|||
} |
|||
}, |
|||
onSubmitImport(formName) { |
|||
this.$refs[formName].validate((valid) => { |
|||
if (valid) { |
|||
this.$message('submit!') |
|||
} else { |
|||
console.log('error submit!!') |
|||
return false |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang='scss' scoped> |
|||
.input-import{ |
|||
position: relative; |
|||
margin-top: 16px; |
|||
width: 104px; |
|||
height: 32px; |
|||
& input{ |
|||
position: absolute; |
|||
left: 0; |
|||
top: 0; |
|||
height: 32px; |
|||
opacity: 0; |
|||
} |
|||
} |
|||
.upload-excel{ |
|||
width: 104px; |
|||
height: 32px; |
|||
line-height: 32px; |
|||
font-size: 14px; |
|||
color: #fff; |
|||
text-align: center; |
|||
border-radius: 3px; |
|||
background: #1F55EB; |
|||
& i{ |
|||
font-size: 13px; |
|||
} |
|||
} |
|||
|
|||
.input-import{ |
|||
margin-top: 0; |
|||
} |
|||
.upload-excel{ |
|||
color: #545B65; |
|||
border: 1px solid #E6E8ED; |
|||
background-color: transparent; |
|||
} |
|||
|
|||
.bulk-import-item{ |
|||
padding: 0 0 30px 10px; |
|||
h4{ |
|||
padding-left: 38px; |
|||
font-size: 16px; |
|||
line-height: 32px; |
|||
color: #0C0E1E; |
|||
&.bulk-import-title1{ |
|||
background: url("~@/assets/images/collect/import1.png") no-repeat left center; |
|||
background-size: 24px 24px; |
|||
} |
|||
&.bulk-import-title2{ |
|||
margin-bottom: 16px; |
|||
background: url("~@/assets/images/collect/import2.png") no-repeat left center; |
|||
background-size: 24px 24px; |
|||
|
|||
} |
|||
} |
|||
.template-name{ |
|||
padding-left: 38px; |
|||
font-size: 14px; |
|||
line-height: 30px; |
|||
color: #0348F3; |
|||
i{ |
|||
font-size: 12px; |
|||
} |
|||
} |
|||
.import-submit{ |
|||
color: #fff; |
|||
background: #1F55EB; |
|||
} |
|||
.file-list{ |
|||
font-size: 12px; |
|||
color: #A6ADB6; |
|||
i{ |
|||
font-size: 12px; |
|||
color: #A6ADB6; |
|||
} |
|||
} |
|||
} |
|||
.chapter-tip{ |
|||
margin-top: 10px; |
|||
} |
|||
|
|||
::v-deep .el-dialog .el-dialog__body .el-form-item .el-form-item__content{ |
|||
width: 560px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,51 @@ |
|||
<template> |
|||
<!-- 档号调整 --> |
|||
<div> |
|||
<el-dialog class="tip-dialog" title="提示" :close-on-click-modal="false" :modal-append-to-body="false" append-to-body :visible.sync="adjustmentTipVisible"> |
|||
<div class="setting-dialog"> |
|||
<div class="tip-content"> |
|||
<p class="tipMsg">您未勾选条目，否则直接选择所有条目</p> |
|||
<span>你是否还要继续?</span> |
|||
</div> |
|||
<div slot="footer" class="dialog-footer"> |
|||
<el-button type="text" @click="adjustmentTipVisible = false">取消</el-button> |
|||
<el-button type="primary" @click.native="handleComfireAdjustment">确定</el-button> |
|||
</div> |
|||
</div> |
|||
</el-dialog> |
|||
|
|||
<el-dialog title="档案调整" :close-on-click-modal="false" :modal-append-to-body="false" append-to-body :visible.sync="adjustmentVisible"> |
|||
<div slot="footer" class="dialog-footer"> |
|||
<el-button type="text" @click="moveVisible = false">取消</el-button> |
|||
<el-button type="primary">确定</el-button> |
|||
</div> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: 'FileNumberAadjustment', |
|||
components: { }, |
|||
mixins: [], |
|||
data() { |
|||
return { |
|||
adjustmentTipVisible: false, |
|||
adjustmentVisible: false |
|||
} |
|||
}, |
|||
created() { |
|||
}, |
|||
mounted() { |
|||
}, |
|||
methods: { |
|||
handleComfireAdjustment() { |
|||
this.adjustmentTipVisible = false |
|||
this.adjustmentVisible = true |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang='scss' scoped> |
|||
</style> |
|||
@ -0,0 +1,226 @@ |
|||
<template> |
|||
<div> |
|||
<!-- 原文上传 --> |
|||
<el-dialog class="upload-dialog" :title="uploadTitle" :close-on-click-modal="false" :modal-append-to-body="false" append-to-body :visible.sync="uploadVisible"> |
|||
<div class="setting-dialog"> |
|||
<div class="upload-container"> |
|||
<i v-if="fileList.length === 0" class="iconfont icon-tianjiawenjian upload-icon" /> |
|||
<div v-for="item in fileList" :key="item.name" class="file-list"> |
|||
<i class="iconfont icon-xiaowenjian" /> |
|||
{{ item.name }} |
|||
<i class="el-icon-close" @click="deleteFile(item)" /> |
|||
</div> |
|||
<div class="upload-input"> |
|||
<input ref="fileInput" :key="key" type="file" @change="handleFileChange"> |
|||
<div class="upload-zip"><i class="iconfont icon-shangchuan2" />点击上传</div> |
|||
</div> |
|||
<!-- <div class="el-upload__tip">上传限制文件类型：zip</div> --> |
|||
<div v-if="uploadType === 1" class="el-upload__tip">上传限制文件大小：最大10GB/个</div> |
|||
</div> |
|||
<div slot="footer" class="dialog-footer"> |
|||
<el-button type="text" @click="uploadVisible = false">取消</el-button> |
|||
<el-button type="primary" @click="handleUploadConfirm">保存</el-button> |
|||
</div> |
|||
</div> |
|||
</el-dialog> |
|||
|
|||
<!-- 上传详情 --> |
|||
<el-dialog title="上传详情" :close-on-click-modal="false" :modal-append-to-body="false" append-to-body :visible.sync="uploadDetialVisible"> |
|||
<div class="setting-dialog"> |
|||
<div class="upload-detail"> |
|||
<el-table :data="uploadDetailData" style="width: 100%"> |
|||
<el-table-column prop="number" label="编号" width="120" /> |
|||
<el-table-column prop="operator" label="操作人" width="120" /> |
|||
<el-table-column prop="operationType" label="操作类型" width="120" /> |
|||
<el-table-column prop="file" label="文件" width="160" /> |
|||
<el-table-column prop="createDate" label="操作时间" width="200" /> |
|||
<el-table-column prop="conclusion" label="结论" width="200"> |
|||
<template slot-scope="scope"> |
|||
<div>成功 {{ scope.row.successNumber }} 条; 失败 {{ scope.row.failNumber }} 条</div> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
<!--分页组件--> |
|||
<el-pagination |
|||
:current-page="page.page" |
|||
:total="page.total" |
|||
:page-size="page.size" |
|||
:pager-count="5" |
|||
layout="total, prev, pager, next, sizes" |
|||
@size-change="handleSizeChange" |
|||
@current-change="handleCurrentPage" |
|||
/> |
|||
</div> |
|||
</div> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: 'UploadOriginal', |
|||
components: {}, |
|||
mixins: [], |
|||
data() { |
|||
return { |
|||
// 上传 |
|||
uploadVisible: false, |
|||
uploadTitle: '普通上传', |
|||
key: 0, |
|||
file: null, |
|||
fileList: [], |
|||
uploadType: 0, |
|||
// 上传详情 |
|||
uploadDetialVisible: false, |
|||
uploadDetailData: [ |
|||
{ |
|||
number: '上传编号001 ', |
|||
operator: 'admin', |
|||
operationType: '原文目录上传', |
|||
file: ' xxxxx目录.zip', |
|||
createDate: '2016-09-21 08:50:08', |
|||
successNumber: '6', |
|||
failNumber: '4' |
|||
} |
|||
], |
|||
page: { |
|||
page: 1, |
|||
size: 10, |
|||
total: 0 |
|||
} |
|||
} |
|||
}, |
|||
created() { |
|||
}, |
|||
mounted() { |
|||
}, |
|||
methods: { |
|||
// input-upload change |
|||
handleFileChange(event) { |
|||
const files = event.target.files |
|||
this.file = files[0] |
|||
this.key++ |
|||
let maxMessage |
|||
let maxSize |
|||
if (this.uploadType === 0) { |
|||
maxSize = 10 * 1024 * 1024 |
|||
maxMessage = '上传文件大小不能超过 10MB!' |
|||
} else { |
|||
maxSize = 10 * 1024 * 1024 * 1024 |
|||
maxMessage = '上传文件大小不能超过 10GB!' |
|||
} |
|||
if (this.file && this.file.size > maxSize) { |
|||
this.$message.warning(maxMessage) |
|||
this.fileList = [] |
|||
event.target.value = '' |
|||
return false |
|||
} |
|||
if (this.fileList.length !== 0) { |
|||
const existingFile = this.fileList.some(file => file.name === this.file.name) |
|||
if (existingFile) { |
|||
this.$message.warning('文件已存在') |
|||
return false |
|||
} |
|||
} |
|||
for (let i = 0; i < files.length; i++) { |
|||
// this.fileList = [] |
|||
this.fileList.push(files[i]) |
|||
} |
|||
}, |
|||
// delt file |
|||
deleteFile(file) { |
|||
const index = this.fileList.indexOf(file) |
|||
this.fileList.splice(index, 1) |
|||
// this.$confirm('此操作将清空所选数据, 是否继续?', '提示', { |
|||
// confirmButtonText: '确定', |
|||
// cancelButtonText: '取消', |
|||
// type: 'warning' |
|||
// }).then(() => { |
|||
// const index = this.fileList.indexOf(file) |
|||
// this.fileList.splice(index, 1) |
|||
// this.file = null |
|||
// this.$message({ |
|||
// type: 'success', |
|||
// message: '删除成功!' |
|||
// }) |
|||
// }).catch(() => { |
|||
// this.$message({ |
|||
// type: 'info', |
|||
// message: '已取消删除' |
|||
// }) |
|||
// }) |
|||
}, |
|||
handleUploadConfirm() { |
|||
this.uploadVisible = false |
|||
this.uploadDetialVisible = true |
|||
}, |
|||
handleSizeChange(size) { |
|||
this.page.size = size |
|||
this.page.page = 1 |
|||
}, |
|||
handleCurrentPage(val) { |
|||
this.page.page = val |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang='scss' scoped> |
|||
.upload-dialog { |
|||
::v-deep .el-dialog{ |
|||
width: 536px; |
|||
} |
|||
} |
|||
.upload-container{ |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
justify-content: center; |
|||
width: 496px; |
|||
min-height: 178px; |
|||
padding: 12px; |
|||
border-radius: 3px; |
|||
background: #EDEFF3; |
|||
border: 1px dashed #BCC2C7; |
|||
.upload-icon{ |
|||
font-size: 32px; |
|||
color: #1F55EB; |
|||
} |
|||
.el-upload__tip{ |
|||
font-size: 12px; |
|||
color: #A6ADB6; |
|||
} |
|||
.file-list{ |
|||
font-size: 12px; |
|||
line-height: 24px; |
|||
color: #545B65; |
|||
} |
|||
} |
|||
|
|||
.upload-input{ |
|||
position: relative; |
|||
margin-top: 16px; |
|||
width: 104px; |
|||
height: 32px; |
|||
& input{ |
|||
position: absolute; |
|||
left: 0; |
|||
top: 0; |
|||
height: 32px; |
|||
opacity: 0; |
|||
} |
|||
} |
|||
.upload-zip{ |
|||
width: 104px; |
|||
height: 32px; |
|||
line-height: 32px; |
|||
font-size: 14px; |
|||
color: #fff; |
|||
text-align: center; |
|||
border-radius: 3px; |
|||
background: #1F55EB; |
|||
& i{ |
|||
font-size: 13px; |
|||
} |
|||
} |
|||
</style> |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue