阅片页面表格内层问题,部分问题无法使用(截图、附件修改)
continuous-integration/drone/push Build is passing
Details
continuous-integration/drone/push Build is passing
Details
parent
5ef755249c
commit
eab207fc35
|
@ -21,7 +21,7 @@
|
|||
<el-table-column :prop="item.Id" :label="item.QuestionName" :key="item.Id"
|
||||
v-for="item of question.TableQuestions.Questions" show-overflow-tooltip :render-header="renderHeader">
|
||||
<template slot-scope="scope">
|
||||
<span v-if="item.Type === 'upload'">
|
||||
<span v-if="item.Type === 'upload' || item.Type === 'screenshot'">
|
||||
{{ scope.row[item.Id] === '' ? '' : scope.row[item.Id] ? scope.row[item.Id].split('|').length : '' }}
|
||||
</span>
|
||||
<span v-else-if="item.Type === 'number'">
|
||||
|
@ -82,7 +82,8 @@
|
|||
validator: question.Type === 'number' && !question.TypeValue ? validatorNumberInput : (rule, value, callback) => { callback() },
|
||||
trigger: ['blur', 'change']
|
||||
}
|
||||
]" :class="[question.Type === 'group' ? 'mb' : question.Type === 'upload' ? 'uploadWrapper' : '']">
|
||||
]"
|
||||
:class="[question.Type === 'group' ? 'mb' : question.Type === 'upload' || question.Type === 'screenshot' ? 'uploadWrapper' : '']">
|
||||
<!-- 输入框 -->
|
||||
<el-input v-if="question.Type === 'input'" v-model="questionForm[question.Id]"
|
||||
:disabled="question.TableQuestionType === 2 || readingTaskState === 2" />
|
||||
|
@ -237,18 +238,18 @@
|
|||
</el-input>
|
||||
</template>
|
||||
<!-- 上传图像 -->
|
||||
<el-upload v-if="question.Type === 'upload'" :disabled="readingTaskState === 2" action
|
||||
:accept="question.FileType" :limit="question.ImageCount === 0 ? 100 : question.ImageCount"
|
||||
:on-preview="handlePictureCardPreview"
|
||||
:before-upload="(file) => { return handleBeforeUpload(file, question.FileType) }"
|
||||
<el-upload v-if="question.Type === 'upload' || question.Type === 'screenshot'"
|
||||
:disabled="readingTaskState === 2" action :accept="question.FileType"
|
||||
:limit="question.ImageCount === 0 ? 100 : question.ImageCount" :on-preview="handlePictureCardPreview"
|
||||
:before-upload="(file) => { return handleBeforeUpload(file, question.FileType, question.Type) }"
|
||||
:http-request="uploadScreenshot" :on-remove="handleRemove" :file-list="fileList"
|
||||
:class="{ disabled: question.ImageCount === 0 ? false : fileList.length >= question.ImageCount }">
|
||||
<el-button slot="default" class="el-icon-plus" v-if="readingTaskState < 2">
|
||||
{{ this.$t('common:button:upload') }}
|
||||
</el-button>
|
||||
</el-upload>
|
||||
<viewer v-if="question.Type === 'upload' && imgVisible" :ref="imageUrl" style="margin:0 10px;"
|
||||
:images="[imageUrl]">
|
||||
<viewer v-if="(question.Type === 'upload' || question.Type === 'screenshot') && imgVisible" :ref="imageUrl"
|
||||
style="margin:0 10px;" :images="[imageUrl]">
|
||||
<img v-show="false" crossorigin="anonymous" :src="imageUrl" alt="Image">
|
||||
</viewer>
|
||||
</el-form-item>
|
||||
|
@ -275,24 +276,28 @@
|
|||
|
||||
</base-model> -->
|
||||
<!-- 预览文件 -->
|
||||
<el-dialog v-if="previewVisible" :visible.sync="previewVisible" :title="$t('common:button:preview')"
|
||||
<!-- <el-dialog v-if="previewVisible" :visible.sync="previewVisible" :title="$t('common:button:preview')"
|
||||
:fullscreen="true" append-to-body custom-class="base-dialog-wrapper">
|
||||
<div class="base-modal-body" style="border: 2px solid #ccc; padding: 10px">
|
||||
<PreviewFile v-if="previewVisible" :file-path="currentPath" :file-type="currentType" />
|
||||
</div>
|
||||
</el-dialog>
|
||||
</el-dialog> -->
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { deleteReadingRowAnswer, getQuestionCalculateRelation, submitTableQuestion, deleteCustomTag } from '@/api/trials'
|
||||
import QuestionTableFormItem from './QuestionTableFormItem'
|
||||
import BaseModel from '@/components/BaseModel'
|
||||
import PreviewFile from '@/components/PreviewFile/index'
|
||||
// import PreviewFile from '@/components/PreviewFile/index'
|
||||
import { mapGetters } from 'vuex'
|
||||
import DicomEvent from '@/views/trials/trials-panel/reading/dicoms/components/DicomEvent'
|
||||
export default {
|
||||
name: 'QuestionFormItem',
|
||||
components: { QuestionTableFormItem, BaseModel, PreviewFile },
|
||||
components: {
|
||||
QuestionTableFormItem,
|
||||
BaseModel,
|
||||
// PreviewFile
|
||||
},
|
||||
props: {
|
||||
isBaseline: {
|
||||
type: Boolean,
|
||||
|
@ -355,9 +360,9 @@ export default {
|
|||
digitPlaces: 2,
|
||||
CalculationTabelList: [],
|
||||
classArr: [],
|
||||
previewVisible: false,
|
||||
currentPath: '',
|
||||
currentType: '',
|
||||
// previewVisible: false,
|
||||
// currentPath: '',
|
||||
// currentType: '',
|
||||
markTableQuestions: [],
|
||||
parentQsId: ''
|
||||
}
|
||||
|
@ -441,12 +446,14 @@ export default {
|
|||
// }
|
||||
// }
|
||||
// }, 300)
|
||||
if (this.question.Type === 'upload') {
|
||||
if (this.question.Type === 'upload' || this.question.Type === 'screenshot') {
|
||||
if (this.questionForm[this.question.Id]) {
|
||||
this.urls = this.questionForm[this.question.Id].split('|')
|
||||
this.fileList = []
|
||||
this.urls.map((url, index) => {
|
||||
this.fileList.push({ name: `${this.$t('trials:emailManageCfg:title:fileName')}${index + 1}`, url: `${url}` })
|
||||
var index = url.lastIndexOf('.')
|
||||
var suffix = url.substring(index + 1, url.length)
|
||||
this.fileList.push({ name: `${this.$t('trials:emailManageCfg:title:fileName')}${index + 1}(${suffix})`, url: `${url}` })
|
||||
})
|
||||
}
|
||||
}
|
||||
|
@ -1249,9 +1256,11 @@ export default {
|
|||
spinner: 'el-icon-loading'
|
||||
})
|
||||
var fileName = param.file.name
|
||||
var index = fileName.lastIndexOf('.')
|
||||
var suffix = fileName.substring(index + 1, url.length)
|
||||
let file = await this.fileToBlob(param.file)
|
||||
let res = await this.OSSclient.put(`/${this.$route.query.trialId}/Customize/${this.visitTaskId}/${fileName}`, file)
|
||||
this.fileList.push({ name: `${this.$t('trials:emailManageCfg:title:fileName')}${this.fileList.length + 1}`, url: this.$getObjectName(res.url) })
|
||||
this.fileList.push({ name: `${this.$t('trials:emailManageCfg:title:fileName')}${this.fileList.length + 1}(${suffix})`, url: this.$getObjectName(res.url) })
|
||||
this.urls.push(this.$getObjectName(res.url))
|
||||
this.$emit("setFormItemData", { key: this.question.Id, val: this.urls.length > 0 ? this.urls.join('|') : '', question: this.question })
|
||||
this.$set(this.QuestionsForm, this.question.Id, this.urls.length > 0 ? this.urls.join('|') : '')
|
||||
|
@ -1267,7 +1276,10 @@ export default {
|
|||
// loading.close()
|
||||
// })
|
||||
},
|
||||
handleBeforeUpload(file, accept) {
|
||||
handleBeforeUpload(file, accept, type) {
|
||||
if (type === 'screenshot') {
|
||||
accept = '.png,.jpeg,.jpg'
|
||||
}
|
||||
// 检测文件类型是否符合要求
|
||||
if (this.checkFileSuffix(file.name, accept) || accept === '-1') {
|
||||
return true
|
||||
|
@ -1290,11 +1302,27 @@ export default {
|
|||
handlePictureCardPreview(file) {
|
||||
var suffix = file.url.substring(file.url.lastIndexOf(".") + 1)
|
||||
suffix = suffix ? suffix.toLowerCase() : ''
|
||||
if (suffix === 'doc' || suffix === 'docx' || suffix === 'pdf') {
|
||||
if (['ppt',
|
||||
'pptx',
|
||||
'doc',
|
||||
'docx',
|
||||
'xls',
|
||||
'xlsx'].includes(suffix)) {
|
||||
// window.open(this.OSSclientConfig.basePath + file.url,'_blank')
|
||||
this.currentPath = file.url
|
||||
this.currentType = suffix
|
||||
this.previewVisible = true
|
||||
this.$onlyOffice({
|
||||
path: file.url,
|
||||
type: suffix,
|
||||
title: file.name
|
||||
})
|
||||
// this.currentPath = file.url
|
||||
// this.currentType = suffix
|
||||
// this.previewVisible = true
|
||||
} else if (['pdf'].includes(suffix)) {
|
||||
this.$preview({
|
||||
path: file.url,
|
||||
type: 'pdf',
|
||||
title: file.name,
|
||||
})
|
||||
} else {
|
||||
this.imageUrl = this.OSSclientConfig.basePath + file.url
|
||||
this.imgVisible = true
|
||||
|
|
|
@ -11,7 +11,8 @@
|
|||
validator: question.Type === 'number' && !question.TypeValue ? validatorNumberInput : (rule, value, callback) => { callback() },
|
||||
trigger: ['blur', 'change']
|
||||
}
|
||||
]" :class="[question.Type === 'group' ? 'mb' : question.Type === 'upload' ? 'uploadWrapper' : '']">
|
||||
]"
|
||||
:class="[question.Type === 'group' ? 'mb' : question.Type === 'upload' || question.Type === 'screenshot' ? 'uploadWrapper' : '']">
|
||||
<!-- 输入框 -->
|
||||
<el-input v-if="question.Type === 'input'" v-model="questionForm[question.Id]"
|
||||
:disabled="question.TableQuestionType === 2 || (question.IsCopy && type === 'edit' && !isBaseline && questionForm.IsCurrentTaskAdd === 'False')" />
|
||||
|
@ -157,41 +158,20 @@
|
|||
</el-input>
|
||||
</template>
|
||||
<!-- 上传图像 -->
|
||||
<el-upload v-if="question.Type === 'upload'" action :accept="question.FileType"
|
||||
:limit="question.ImageCount === 0 ? 100 : question.ImageCount" :on-preview="handlePictureCardPreview"
|
||||
:before-upload="handleBeforeUpload" :http-request="uploadScreenshot" list-type="picture-card"
|
||||
:on-remove="handleRemove" :file-list="fileList"
|
||||
<el-upload v-if="question.Type === 'upload' || question.Type === 'screenshot'" :disabled="readingTaskState === 2"
|
||||
action :accept="question.FileType" :limit="question.ImageCount === 0 ? 100 : question.ImageCount"
|
||||
:on-preview="handlePictureCardPreview"
|
||||
:before-upload="(file) => { return handleBeforeUpload(file, question.FileType, question.Type) }"
|
||||
:http-request="uploadScreenshot" :on-remove="handleRemove" :file-list="fileList"
|
||||
:class="{ disabled: question.ImageCount === 0 ? false : fileList.length >= question.ImageCount }">
|
||||
<i slot="default" class="el-icon-plus" />
|
||||
<div slot="file" slot-scope="{file}">
|
||||
<viewer :ref="file.url" :images="[imageUrl]" style="
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
">
|
||||
<img class="el-upload-list__item-thumbnail" :src="OSSclientConfig.basePath + file.url"
|
||||
crossOrigin="anonymous" alt="" style="max-width: 100%; max-height: 100%" />
|
||||
<span class="el-upload-list__item-actions">
|
||||
<span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
|
||||
<i class="el-icon-zoom-in" />
|
||||
</span>
|
||||
|
||||
<span v-if="readingTaskState < 2" class="el-upload-list__item-delete" @click="handleRemove(file)">
|
||||
<i class="el-icon-delete" />
|
||||
</span>
|
||||
</span>
|
||||
</viewer>
|
||||
</div>
|
||||
<el-button slot="default" class="el-icon-plus" v-if="readingTaskState < 2">
|
||||
{{ this.$t('common:button:upload') }}
|
||||
</el-button>
|
||||
</el-upload>
|
||||
<el-dialog v-if="question.Type === 'upload'" append-to-body :visible.sync="imgVisible" width="600px">
|
||||
<el-image :src="imageUrl" width="100%">
|
||||
<div slot="placeholder" class="image-slot">
|
||||
{{ $t('trials:readingUnit:qsList:message:loading') }}<span class="dot">...</span>
|
||||
</div>
|
||||
</el-image>
|
||||
</el-dialog>
|
||||
<viewer v-if="(question.Type === 'upload' || question.Type === 'screenshot') && imgVisible" :ref="imageUrl"
|
||||
style="margin:0 10px;" :images="[imageUrl]">
|
||||
<img v-show="false" crossorigin="anonymous" :src="imageUrl" alt="Image">
|
||||
</viewer>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -298,12 +278,14 @@ export default {
|
|||
mounted() {
|
||||
var digitPlaces = Number(localStorage.getItem('digitPlaces'))
|
||||
this.digitPlaces = digitPlaces === -1 ? this.digitPlaces : digitPlaces
|
||||
if (this.question.Type === 'upload') {
|
||||
if (this.question.Type === 'upload' || this.question.Type === 'screenshot') {
|
||||
if (this.questionForm[this.question.Id]) {
|
||||
this.urls = this.questionForm[this.question.Id].split('|')
|
||||
this.fileList = []
|
||||
this.urls.map(url => {
|
||||
this.fileList.push({ name: '', url: `${url}` })
|
||||
this.urls.map((url, index) => {
|
||||
var index = url.lastIndexOf('.')
|
||||
var suffix = url.substring(index + 1, url.length)
|
||||
this.fileList.push({ name: `${this.$t('trials:emailManageCfg:title:fileName')}${index + 1}(${suffix})`, url: `${url}` })
|
||||
})
|
||||
}
|
||||
}
|
||||
|
@ -575,32 +557,33 @@ export default {
|
|||
text: 'Loading',
|
||||
spinner: 'el-icon-loading'
|
||||
})
|
||||
var trialId = this.$route.query.trialId
|
||||
var subjectId = this.$route.query.trialId
|
||||
var fileName = param.file.name
|
||||
var index = fileName.lastIndexOf('.')
|
||||
var suffix = fileName.substring(index + 1, fileName.length)
|
||||
var file = await this.fileToBlob(param.file)
|
||||
const res = await this.OSSclient.put(`/${trialId}/Read/${subjectId}/Visit/${param.file.name}`, file)
|
||||
this.fileList.push({ name: param.file.name, path: this.$getObjectName(res.url), url: this.$getObjectName(res.url) })
|
||||
let res = await this.OSSclient.put(`/${this.$route.query.trialId}/Customize/${this.visitTaskId}/${fileName}`, file)
|
||||
this.fileList.push({ name: `${this.$t('trials:emailManageCfg:title:fileName')}${this.fileList.length + 1}(${suffix})`, url: this.$getObjectName(res.url) })
|
||||
this.urls.push(this.$getObjectName(res.url))
|
||||
this.$emit('setFormItemData', { key: this.question.Id, val: this.urls.length > 0 ? this.urls.join('|') : '', question: this.question })
|
||||
loading.close()
|
||||
},
|
||||
handleBeforeUpload(file) {
|
||||
handleBeforeUpload(file, accept, type) {
|
||||
if (type === 'screenshot') {
|
||||
accept = '.png,.jpeg,.jpg'
|
||||
}
|
||||
// 检测文件类型是否符合要求
|
||||
if (this.checkFileSuffix(file.name)) {
|
||||
// this.fileList = []
|
||||
if (this.checkFileSuffix(file.name, accept) || accept === '-1') {
|
||||
return true
|
||||
} else {
|
||||
let msg = this.$t(
|
||||
"trials:readingUnit:qsList:message:imageFormat"
|
||||
).replace("xxx", this.question.FileType)
|
||||
const msg = this.$t('trials:adReview:title:msg4').replace('xxx', accept)
|
||||
this.$alert(msg)
|
||||
return false
|
||||
}
|
||||
},
|
||||
checkFileSuffix(fileName) {
|
||||
checkFileSuffix(fileName, accept) {
|
||||
var index = fileName.lastIndexOf('.')
|
||||
var suffix = fileName.substring(index + 1, fileName.length)
|
||||
if (this.question.FileType.toLocaleLowerCase().search(suffix.toLocaleLowerCase()) === -1) {
|
||||
if (accept.toLocaleLowerCase().search(suffix.toLocaleLowerCase()) === -1) {
|
||||
return false
|
||||
} else {
|
||||
return true
|
||||
|
@ -610,21 +593,46 @@ export default {
|
|||
handlePictureCardPreview(file) {
|
||||
var suffix = file.url.substring(file.url.lastIndexOf(".") + 1)
|
||||
suffix = suffix ? suffix.toLowerCase() : ''
|
||||
if (suffix === 'doc' || suffix === 'docx' || suffix === 'pdf') {
|
||||
window.open(this.OSSclientConfig.basePath + file.url, '_blank')
|
||||
if (['ppt',
|
||||
'pptx',
|
||||
'doc',
|
||||
'docx',
|
||||
'xls',
|
||||
'xlsx'].includes(suffix)) {
|
||||
// window.open(this.OSSclientConfig.basePath + file.url,'_blank')
|
||||
this.$onlyOffice({
|
||||
path: file.url,
|
||||
type: suffix,
|
||||
title: file.name
|
||||
})
|
||||
// this.currentPath = file.url
|
||||
// this.currentType = suffix
|
||||
// this.previewVisible = true
|
||||
} else if (['pdf'].includes(suffix)) {
|
||||
this.$preview({
|
||||
path: file.url,
|
||||
type: 'pdf',
|
||||
title: file.name,
|
||||
})
|
||||
} else {
|
||||
this.imageUrl = this.OSSclientConfig.basePath + file.url
|
||||
// this.imgVisible = true
|
||||
this.$refs[file.url].$viewer.show()
|
||||
this.imgVisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs[this.imageUrl].$viewer.show()
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
// 删除图片
|
||||
handleRemove(file, fileList) {
|
||||
this.imageUrl = ''
|
||||
this.fileList.splice(this.fileList.findIndex(f => f.url === file.url), 1)
|
||||
this.urls.splice(this.fileList.findIndex(f => f === file.url), 1)
|
||||
this.$emit('setFormItemData', { key: this.question.Id, val: this.urls.length > 0 ? this.urls.join('|') : '', question: this.question })
|
||||
if (file && file.status === "success") {
|
||||
this.imageUrl = ''
|
||||
this.fileList.splice(this.fileList.findIndex(f => f.url === file.url), 1)
|
||||
this.fileList.forEach((i, index) => {
|
||||
i.name = `${this.$t('trials:emailManageCfg:title:fileName')}${index + 1}`
|
||||
})
|
||||
this.urls.splice(this.fileList.findIndex(f => f === file.url), 1)
|
||||
this.$emit('setFormItemData', { key: this.question.Id, val: this.urls.length > 0 ? this.urls.join('|') : '', question: this.question })
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue