irc_web/.svn/pristine/9d/9d052d685b7aa3dbb8caeb01c0c...

308 lines
9.9 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<div v-loading="loading">
<div style="padding: 0 20px;">
<div class="info-content" v-html="crcMessageInfo.TalkContent" />
</div>
<div>
<div style="padding: 10px;background: #f3f3f3;border-radius: 10px;margin-top: 10px">
<div style="display:flex;margin-bottom: 10px;justify-content: space-between;align-items: center">
<div>
<!-- 请准确核实后录入当前访视的实际影像检查记录: -->
{{ $t('trials:consistencyCheck:title:message20') }}
</div>
<!-- 添加 -->
<el-button type="primary" size="mini" @click="addMsg">{{ $t('trials:consistencyCheck:title:add') }}</el-button>
</div>
<el-table
:data="msgList"
>
<el-table-column type="index" width="40" />
<!-- 检查日期 -->
<el-table-column
prop=""
:label="$t('trials:consistencyCheck:title:studyDate')"
show-overflow-tooltip
>
<template slot-scope="scope">
{{ scope.row.StudyDate }}
</template>
</el-table-column>
<!-- 检查类型 -->
<el-table-column
prop=""
:label="$t('trials:consistencyCheck:title:studyModality')"
show-overflow-tooltip
>
<template slot-scope="scope">
{{ scope.row.Modality }}
</template>
</el-table-column>
<!-- 已提交 -->
<el-table-column
prop=""
:label="$t('trials:consistencyCheck:title:submitted')"
show-overflow-tooltip
>
<template slot-scope="scope">
{{ $fd('YesOrNo', scope.row.IsJoin) }}
</template>
</el-table-column>
<!-- 实际存在 -->
<el-table-column
prop=""
:label="$t('trials:consistencyCheck:title:existed')"
show-overflow-tooltip
>
<template slot-scope="scope">
<el-switch
v-model="scope.row.IsCheck"
:disabled="!scope.row.IsJoin"
@change="compareStudy"
/>
</template>
</el-table-column>
<el-table-column
prop=""
width="100px"
:label="$t('common:action:action')"
fixed="right"
>
<template slot-scope="scope">
<!-- 删除 -->
<el-button
:disabled="scope.row.IsJoin"
size="small"
type="text"
@click="moveMsg(scope.$index)"
>
{{ $t('trials:consistencyCheck:title:delete') }}
</el-button>
</template>
</el-table-column>
</el-table>
<el-form
ref="revenusForm"
size="small"
label-width="400px"
:label-position="'top'"
:rules="rules"
:model="form"
>
<!-- IRC与实际情况影像检查不一致的原因为 -->
<el-form-item v-if="isLackOf" :label="$t('trials:consistencyCheck:title:title1')" prop="reason">
<el-checkbox-group v-model="form.reason" style="display: flex;flex-direction: column">
<el-checkbox style="display: block" label="EDC按疗效评估数据记录影像检查信息;">
{{ $t('trials:consistencyCheck:title:message9') }}
</el-checkbox>
<el-checkbox style="display: block" label="EDC录入错误;">
{{ $t('trials:consistencyCheck:title:message10') }}
</el-checkbox>
<el-checkbox style="display: block" label="IRC数据上传错误申请回退并重新上传;">
{{ $t('trials:consistencyCheck:title:message11') }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
</el-form>
</div>
</div>
<div class="function">
<!-- 发送 -->
<el-button
type="primary"
@click="handleReply"
>
{{ $t('trials:consistencyCheck:button:sendMessage') }}
</el-button>
</div>
<!-- 添加检查 -->
<el-dialog
v-if="studyVisible"
v-dialogDrag
:visible.sync="studyVisible"
:close-on-click-modal="false"
append-to-body
custom-class="base-dialog-wrapper"
:width="'500px'"
:title="$t('trials:consistencyCheck:title:addStudy')"
>
<el-form>
<div class="base-dialog-body">
<!-- 检查日期 -->
<el-form-item label-width="80px" :label="$t('trials:consistencyCheck:title:studyDate')">
<el-date-picker
v-model="typeInfo.StudyDate"
style="width: 100%"
type="date"
value-format="yyyy-MM-dd"
/>
</el-form-item>
<!-- 检查类型 -->
<el-form-item label-width="80px" :label="$t('trials:consistencyCheck:title:studyModality')">
<el-select
v-model="typeInfo.Modality"
style="width: 100%"
>
<el-option v-for="item of $d.Modality" :label="item.raw.Value" :value="item.value" />
</el-select>
</el-form-item>
</div>
<div class="base-dialog-footer" style="text-align:right;margin-top:10px;">
<el-form-item style="text-align:right;">
<el-button size="small" type="primary" @click="handleCancel"> {{ $t('common:button:cancel') }}</el-button>
<el-button size="small" type="primary" @click="handleSave">
{{ $t('common:button:save') }}
</el-button>
</el-form-item>
</div>
</el-form>
</el-dialog>
</div>
</template>
<script>
export default {
name: 'CrcSendMessage',
props: {
crcMessageInfo: {
type: Object,
default() {
return {
TalkContent: null
}
}
}
},
data() {
return {
loading: false,
msgList: [],
studyVisible: false,
typeInfo: {
StudyDate: null,
Modality: null,
IsJoin: false,
IsCheck: true
},
isLackOf: false,
EDCList: [],
IRCList: [],
form: {
reason: []
},
rules: {
reason: [{ required: true, message: this.$t('common:ruleMessage:select'), trigger: ['blur', 'change'] }]
}
}
},
mounted() {
this.crcMessageInfo.ParamInfoList.forEach(v => {
this.msgList.push({ ...v, IsJoin: true, Ischeck: false })
})
this.compareStudy()
},
methods: {
compareStudy() {
var isLackOf = false
this.IRCList = []
this.msgList.forEach(v => {
if (v.IsJoin !== v.IsCheck) {
isLackOf = true
this.IRCList.push(v)
}
})
this.isLackOf = isLackOf
},
handleCancel() {
this.studyVisible = false
this.typeInfo = {
StudyDate: null,
Modality: null
}
},
handleSave() {
if (!this.typeInfo.StudyDate || !this.typeInfo.Modality) {
this.$message.error(this.$t('trials:consistencyCheck:title:title2'))// '请选择检查日期和检查类型'
return
}
this.msgList.push({ ...this.typeInfo })
this.compareStudy()
this.studyVisible = false
this.typeInfo = {
StudyDate: null,
Modality: null,
IsJoin: false,
IsCheck: true
}
},
closeLoading() {
this.loading = false
},
addMsg() {
this.studyVisible = true
},
moveMsg(index) {
// '确定删除该条检查记录?'
this.$confirm(this.$t('trials:consistencyCheck:title:title3')).then(res => {
this.msgList.splice(index, 1)
this.compareStudy()
})
},
handleReply() {
if (this.msgList.length === 0) {
// '请录入真实的检查情况'
this.$message.error(this.$t('trials:consistencyCheck:title:title4'))
return
}
this.$refs.revenusForm.validate((valid) => {
if (!valid) return
var TalkContent = ''
// '经核实,该受试者当前访视的实际影像检查如下:<br>'
TalkContent += `${this.$t('trials:consistencyCheck:title:title5')}<br>`
this.msgList.forEach((v, i) => {
// `${i + 1}.${v.StudyDate}的${v.Modality}影像检查<br>`
let msg = this.$t('trials:consistencyCheck:title:title6').replace('yyyy', v.StudyDate)
msg = msg.replace('xxx', v.Modality)
TalkContent += `${i + 1}. ${msg}<br>`
})
if (this.isLackOf) {
TalkContent += '<br>'
// 'IRC与实际情况不一致影像检查如下<br>'
TalkContent += `${this.$t('trials:consistencyCheck:title:title7')}<br>`
this.IRCList.forEach((v, i) => {
let msg = this.$t('trials:consistencyCheck:title:title6').replace('yyyy', v.StudyDate)
msg = msg.replace('xxx', v.Modality)
TalkContent += `${i + 1}.${msg}${v.IsJoin && !v.IsCheck ? this.$t('trials:consistencyCheck:title:title8') : this.$t('trials:consistencyCheck:title:title9')}<br>`
})
if (this.form.reason.length > 0) {
TalkContent += '<br>'
// 'IRC与实际情况影像检查不一致的原因为<br>'
TalkContent += `${this.$t('trials:consistencyCheck:title:title10')}<br>`
this.form.reason.forEach((v, i) => {
TalkContent += `${i + 1}.${v}<br>`
})
}
} else {
// `<br>IRC与实际情况影像检查一致`
TalkContent += `<br>${this.$t('trials:consistencyCheck:title:title11')}`
}
console.log(TalkContent)
this.$emit('sendMessage', TalkContent, this.closeLoading)
})
}
}
}
</script>
<style scoped>
.function{
margin-top: 10px;
text-align: right;
}
>>>.el-form--label-top .el-form-item__label{
padding-bottom: 0;
padding-top: 20px;
}
</style>