[update] 文档拆分的弹框拆分出来
This commit is contained in:
lideqin
@@ -28,12 +28,12 @@
|
||||
</a>
|
||||
</tempalte>
|
||||
<span slot="detailClick" slot-scope="text, record">
|
||||
<a class="textName" :title="text" @click="detailClick(record)">
|
||||
<a class="text-name" :title="text" @click="detailClick(record)">
|
||||
{{text}}
|
||||
</a>
|
||||
</span>
|
||||
<span slot="detail" slot-scope="text">
|
||||
<span class="textName" :title="text">
|
||||
<span class="text-name" :title="text">
|
||||
{{text}}
|
||||
</span>
|
||||
</span>
|
||||
@@ -47,6 +47,9 @@
|
||||
{{text}}
|
||||
</span>
|
||||
</span>
|
||||
<span slot="showContent" slot-scope="text, record" class="item-solt">
|
||||
<span class="content-show" href="javascript:;" @click="showContent(text,record)">{{record.iterms_conditions&&record.iterms_conditions!=='null'?record.iterms_conditions.replace(/<.*?>/ig, ' ') : ''}}</span>
|
||||
</span>
|
||||
</a-table>
|
||||
</div>
|
||||
</template>
|
||||
@@ -192,7 +195,7 @@ export default {
|
||||
align: 'left',
|
||||
ellipsis: true,
|
||||
width: 215
|
||||
},
|
||||
}
|
||||
// {
|
||||
// title: this.$t('operation'),
|
||||
// align: 'center',
|
||||
@@ -275,6 +278,12 @@ export default {
|
||||
this.columns[index].scopedSlots = {
|
||||
customRender: 'urlClick'
|
||||
}
|
||||
} else if (res.db_field_name === 'iterms_conditions') {
|
||||
// 拆分文档详情页的条款内容点击可预览
|
||||
this.columns[index].width = 500
|
||||
this.columns[index].scopedSlots = {
|
||||
customRender: 'showContent'
|
||||
}
|
||||
} else {
|
||||
this.columns[index].scopedSlots = {
|
||||
customRender: 'detailText'
|
||||
@@ -348,6 +357,9 @@ export default {
|
||||
},
|
||||
urlClick (item) {
|
||||
window.open(item)
|
||||
},
|
||||
showContent (item) {
|
||||
this.$emit('showContent', item)
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -358,7 +370,7 @@ export default {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.textName {
|
||||
.text-name {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
display: -webkit-box;
|
||||
@@ -370,4 +382,8 @@ export default {
|
||||
text-justify: inter-ideograph;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.item-solt {
|
||||
cursor: pointer;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -0,0 +1,198 @@
|
||||
<template>
|
||||
<a-modal
|
||||
v-model="visible"
|
||||
:maskClosable="false"
|
||||
:footer="[]"
|
||||
:title="title"
|
||||
@cancel="handlePreImgCancel">
|
||||
<a-upload-dragger
|
||||
:accept="accept"
|
||||
:disabled="disabled"
|
||||
class="split-upload-list"
|
||||
name="file"
|
||||
:file-list="myFileList"
|
||||
:multiple="true"
|
||||
:action='uploadAction'
|
||||
:headers="headers"
|
||||
:list-type="listType"
|
||||
@preview="preview"
|
||||
:before-upload="beforeUpload"
|
||||
:remove="remove"
|
||||
@change="handleChange">
|
||||
<p>
|
||||
<a-icon class="action-upload" type="cloud-upload" />
|
||||
</p>
|
||||
<p class="ant-upload-text" style="font-size: 14px;line-height: 30px;margin-left: 5px;">{{this.$t('clickUpload')}}</p>
|
||||
</a-upload-dragger>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Vue from 'vue'
|
||||
import { ACCESS_TOKEN } from '@/store/mutation-types'
|
||||
|
||||
export default {
|
||||
name: 'SplitAddClauseUploadImage',
|
||||
props: [
|
||||
'disabled',
|
||||
'accept',
|
||||
'title',
|
||||
'listType'
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
visible: false,
|
||||
uploadAction: window._CONFIG.domianURL + '/split/sarFileSplitItems/upload',
|
||||
downLoadFileUrl: window._CONFIG.domianPreviewURL + '/sys/common/static',
|
||||
fileList: [],
|
||||
myFileList: [],
|
||||
headers: '',
|
||||
previewImage: {},
|
||||
uploadFileFlag: 0
|
||||
}
|
||||
},
|
||||
created () {
|
||||
const token = Vue.ls.get(ACCESS_TOKEN)
|
||||
this.headers = { 'X-Access-Token': token }
|
||||
this.containerId = 'container-ty-' + new Date().getTime()
|
||||
},
|
||||
methods: {
|
||||
open () {
|
||||
this.visible = true
|
||||
},
|
||||
perentHandleFunc (data) {
|
||||
this.myFileList = data
|
||||
if (data && data.length > 0) {
|
||||
this.myFileList.forEach((res) => {
|
||||
res.name = res.fileName
|
||||
res.uid = res.id
|
||||
})
|
||||
} else {
|
||||
this.myFileList = []
|
||||
}
|
||||
},
|
||||
beforeUpload (file) {
|
||||
let fileFlag = false
|
||||
// console.log('accept',this.accept,file)
|
||||
this.fileTypeSatus = false
|
||||
const fileTypes = this.accept.split('/')
|
||||
const fileNowTypes = file.type.split('/')
|
||||
fileFlag = (fileTypes[0] === fileNowTypes[0])
|
||||
// console.log('filetype',fileFlag)
|
||||
if (!fileFlag) {
|
||||
this.$message.warning(this.$t('fileFormatIncorrect'))
|
||||
this.fileTypeSatus = false
|
||||
} else {
|
||||
// let thisFileType = this.thisFileType.replace(/\s+/g, "");
|
||||
if (this.uploadFileFlag < 20) {
|
||||
this.uploadFileFlag++
|
||||
}
|
||||
|
||||
this.fileTypeSatus = true
|
||||
this.$message.destroy()
|
||||
// 207M.doc文件大小超出100MB限制, 请压缩或降低文件质量!
|
||||
this.errorMessage = file.name + '文件大小超出1000MB限制, 请压缩或降低文件质量!'
|
||||
}
|
||||
},
|
||||
remove () {
|
||||
this.fileTypeSatus = true
|
||||
},
|
||||
handleChange (info) {
|
||||
const { file, fileList } = 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 > 1000000000) {
|
||||
this.$message.error(this.errorMessage)
|
||||
} else {
|
||||
if (status === 'error') {
|
||||
this.uploadFileFlag--
|
||||
this.$emit('uploadSuccess', this.fileList)
|
||||
this.$message.destroy()
|
||||
this.$message.error(`${info.file.name} ` + this.$t('fileUploadFailed'))
|
||||
} else if (status === 'removed') {
|
||||
this.uploadFileFlag--
|
||||
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, fileList)
|
||||
if (this.uploadFileFlag === 0) {
|
||||
this.visible = false
|
||||
}
|
||||
if (this.myFileList.length > 0) {
|
||||
this.$message.destroy()
|
||||
this.$message.success(`${info.file.name} ` + this.$t('deletedSuccessfully'))
|
||||
}
|
||||
} else if (status === 'done') {
|
||||
this.uploadFileFlag--
|
||||
this.fileList = []
|
||||
this.myFileList = info.fileList
|
||||
console.log('listLength11111', info.fileList.length)
|
||||
if (info.fileList.length > 20) {
|
||||
this.$message.destroy()
|
||||
this.$message.error(this.$t('uploadMaximumATime'))
|
||||
info.fileList.splice(20)
|
||||
this.myFileList = info.fileList
|
||||
this.myFileList.forEach((res) => {
|
||||
if (res.response) {
|
||||
this.fileList.push(res.response.result)
|
||||
} else {
|
||||
this.fileList.push(res)
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.myFileList.forEach((res) => {
|
||||
if (res.response) {
|
||||
this.fileList.push(res.response.result)
|
||||
} else {
|
||||
this.fileList.push(res)
|
||||
}
|
||||
})
|
||||
// console.log('file111111',this.fileList,fileList,file,this.uploadFileFlag)
|
||||
this.$emit('uploadSuccess', file, this.fileList, fileList)
|
||||
if (this.uploadFileFlag === 0) {
|
||||
this.visible = false
|
||||
}
|
||||
// console.log('uplossss',this.fileList,fileList)
|
||||
if (this.myFileList.length > 0) {
|
||||
this.$message.destroy()
|
||||
this.$message.success(`${info.file.name} ` + this.$t('uploadSuccessful'))
|
||||
}
|
||||
}
|
||||
} else if (status === 'uploading') {
|
||||
// this.uploadFileFlag++
|
||||
this.myFileList = info.fileList
|
||||
// this.$message.success(`${info.file.name} 文件上传成功。`);
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
resetFileList () {
|
||||
this.myFileList = []
|
||||
this.fileList = []
|
||||
},
|
||||
preview (file) {
|
||||
// console.log('file111',file)
|
||||
this.previewImage = file.response.path
|
||||
},
|
||||
handlePreImgCancel () {
|
||||
this.visible = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -5,10 +5,10 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import '@/../public/ueditor/ueditor.config.js'
|
||||
import '@/../public/ueditor/ueditor.all.js'
|
||||
import '@/../public/ueditor/lang/zh-cn/zh-cn.js'
|
||||
import '@/../public/ueditor/lang/en/en.js'
|
||||
import '../../../public/ueditor/ueditor.config.js'
|
||||
import '../../../public/ueditor/ueditor.all.js'
|
||||
import '../../../public/ueditor/lang/zh-cn/zh-cn.js'
|
||||
import '../../../public/ueditor/lang/en/en.js'
|
||||
|
||||
export default {
|
||||
name: 'UEditor',
|
||||
@@ -62,7 +62,7 @@ export default {
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
UEDITOR_CONFIG.UEDITOR_HOME_URL = '../../public/ueditor/'
|
||||
UEDITOR_CONFIG.UEDITOR_HOME_URL = '../../../public/ueditor/'
|
||||
// 初始化UE
|
||||
this.editor = UE.delEditor('editor')
|
||||
this.editor = UE.getEditor('editor', this.config)
|
||||
|
||||
Reference in New Issue
Block a user