518 lines
16 KiB
Plaintext
518 lines
16 KiB
Plaintext
<template>
|
|
<div class="app-container">
|
|
<div class="ImageReviewTask-list app-container">
|
|
<el-row>
|
|
<el-col :span="12">
|
|
<el-card class="box-card">
|
|
<div slot="header" class="clearfix">
|
|
<span>Global1</span>
|
|
</div>
|
|
<el-collapse v-model="activeNames">
|
|
<el-collapse-item
|
|
title="Timepoint Efficacy Assessment"
|
|
name="TimepointEfficacy"
|
|
>
|
|
<el-table
|
|
ref="TimepointEfficacyTable"
|
|
:data="Global1VisitRS"
|
|
stripe
|
|
size="small"
|
|
>
|
|
<el-table-column type="index" width="60" />
|
|
<el-table-column
|
|
prop="VisitName"
|
|
label="Visit"
|
|
show-overflow-tooltip
|
|
min-width="120"
|
|
>
|
|
<template
|
|
slot-scope="scope"
|
|
>{{ scope.row.VisitName + ' ' }}
|
|
<el-button
|
|
type="text"
|
|
size="small"
|
|
@click="goCRF(scope.row)"
|
|
>CRF</el-button>
|
|
<el-button
|
|
type="text"
|
|
size="small"
|
|
@click="goVisitImage(scope.row)"
|
|
>Image</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="OverallResponse"
|
|
label="Timepoint Efficacy Assessment"
|
|
show-overflow-tooltip
|
|
min-width="100"
|
|
/>
|
|
|
|
<el-table-column
|
|
prop="Agree"
|
|
label="Agree or not"
|
|
show-overflow-tooltip
|
|
min-width="100"
|
|
>
|
|
<template slot-scope="scope">
|
|
<el-select
|
|
v-model="scope.row.GlobalRSSelect.Agree"
|
|
style="width: 100%"
|
|
size="small"
|
|
>
|
|
<!-- <el-option label="Please select" /> -->
|
|
<el-option :value="true" label="Agree" />
|
|
<el-option :value="false" label="Disagree" />
|
|
</el-select>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
prop="newRS"
|
|
label="Updated Timepoint Efficacy Assessment"
|
|
show-overflow-tooltip
|
|
min-width="100"
|
|
>
|
|
<template slot-scope="scope">
|
|
<el-select
|
|
v-model="scope.row.GlobalRSSelect.NewRS"
|
|
style="width: 100%"
|
|
size="small"
|
|
>
|
|
<!-- <el-option
|
|
v-for="item in VisitLymphNodeTargetList"
|
|
:key="item.value"
|
|
:label="item.TRORRES"
|
|
:value="item.TRORRES"
|
|
/> -->
|
|
<el-option value="test1" label="test1" />
|
|
<el-option value="test2" label="test2" />
|
|
</el-select>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
prop="Note"
|
|
label="Comments for This Timepoint"
|
|
min-width="100"
|
|
>
|
|
<template slot-scope="scope">
|
|
<el-input
|
|
v-model="scope.row.GlobalRSSelect.Note"
|
|
type="text"
|
|
placeholder=""
|
|
size="small"
|
|
:disabled="isReportSaved"
|
|
/>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-collapse-item>
|
|
|
|
<el-collapse-item
|
|
title="Comments for the Subject"
|
|
name="CommentsForSubject"
|
|
>
|
|
<el-input
|
|
v-model="SubjectNote1"
|
|
type="text"
|
|
placeholder=""
|
|
size="small"
|
|
:disabled="isReportSaved"
|
|
/>
|
|
</el-collapse-item>
|
|
|
|
<el-collapse-item
|
|
title="Previous Global Reads"
|
|
name="PreviousGlobalReads"
|
|
>
|
|
<el-table
|
|
ref="GlobalReadsTable"
|
|
:data="PreviousGlobalReadsList1"
|
|
stripe
|
|
size="small"
|
|
>
|
|
<el-table-column type="index" width="60" />
|
|
<el-table-column
|
|
prop="VisitName"
|
|
label="Visit"
|
|
show-overflow-tooltip
|
|
min-width="100"
|
|
/>
|
|
<el-table-column
|
|
prop="OverallResponse"
|
|
label="Timepoint Efficacy Assessment"
|
|
show-overflow-tooltip
|
|
min-width="100"
|
|
/>
|
|
</el-table>
|
|
</el-collapse-item>
|
|
</el-collapse>
|
|
</el-card>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-card class="box-card">
|
|
<div slot="header" class="clearfix">
|
|
<span>Global2</span>
|
|
</div>
|
|
<el-collapse v-model="activeNames">
|
|
<el-collapse-item
|
|
title="Timepoint Efficacy Assessment"
|
|
name="TimepointEfficacy"
|
|
>
|
|
<el-table
|
|
ref="TimepointEfficacyTable"
|
|
:data="Global2VisitRS"
|
|
stripe
|
|
size="small"
|
|
>
|
|
<el-table-column type="index" width="60" />
|
|
<el-table-column
|
|
prop="VisitName"
|
|
label="Visit"
|
|
show-overflow-tooltip
|
|
min-width="120"
|
|
>
|
|
<template
|
|
slot-scope="scope"
|
|
>{{ scope.row.VisitName + ' ' }}
|
|
<el-button
|
|
type="text"
|
|
size="small"
|
|
@click="goCRF(scope.row)"
|
|
>CRF</el-button>
|
|
<el-button
|
|
type="text"
|
|
size="small"
|
|
@click="goVisitImage(scope.row)"
|
|
>Image</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="OverallResponse"
|
|
label="Timepoint Efficacy Assessment"
|
|
show-overflow-tooltip
|
|
min-width="100"
|
|
/>
|
|
|
|
<el-table-column
|
|
prop="Agree"
|
|
label="Agree or not"
|
|
show-overflow-tooltip
|
|
min-width="100"
|
|
>
|
|
<template slot-scope="scope">
|
|
<el-select
|
|
v-model="scope.row.GlobalRSSelect.Agree"
|
|
style="width: 100%"
|
|
size="small"
|
|
>
|
|
<!-- <el-option label="Please select" /> -->
|
|
<el-option :value="true" label="Agree" />
|
|
<el-option :value="false" label="Disagree" />
|
|
</el-select>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
prop="newRS"
|
|
label="Updated Timepoint Efficacy Assessment"
|
|
show-overflow-tooltip
|
|
min-width="100"
|
|
>
|
|
<template slot-scope="scope">
|
|
<el-select
|
|
v-model="scope.row.GlobalRSSelect.NewRS"
|
|
style="width: 100%"
|
|
size="small"
|
|
>
|
|
<!-- <el-option
|
|
v-for="item in VisitLymphNodeTargetList"
|
|
:key="item.value"
|
|
:label="item.TRORRES"
|
|
:value="item.TRORRES"
|
|
/> -->
|
|
<el-option value="test1" label="test1" />
|
|
<el-option value="test2" label="test2" />
|
|
</el-select>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
prop="Note"
|
|
label="Comments for This Timepoint"
|
|
min-width="100"
|
|
>
|
|
<template slot-scope="scope">
|
|
<el-input
|
|
v-model="scope.row.GlobalRSSelect.Note"
|
|
type="text"
|
|
placeholder=""
|
|
size="small"
|
|
:disabled="isReportSaved"
|
|
/>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-collapse-item>
|
|
|
|
<el-collapse-item
|
|
title="Comments for the Subject"
|
|
name="CommentsForSubject"
|
|
>
|
|
<el-input
|
|
v-model="SubjectNote2"
|
|
type="text"
|
|
placeholder=""
|
|
size="small"
|
|
:disabled="isReportSaved"
|
|
/>
|
|
</el-collapse-item>
|
|
|
|
<el-collapse-item
|
|
title="Previous Global Reads"
|
|
name="PreviousGlobalReads"
|
|
>
|
|
<el-table
|
|
ref="GlobalReadsTable"
|
|
:data="PreviousGlobalReadsList2"
|
|
stripe
|
|
size="small"
|
|
>
|
|
<el-table-column type="index" width="60" />
|
|
<el-table-column
|
|
prop="VisitName"
|
|
label="Visit"
|
|
show-overflow-tooltip
|
|
min-width="100"
|
|
/>
|
|
<el-table-column
|
|
prop="OverallResponse"
|
|
label="Timepoint Efficacy Assessment"
|
|
show-overflow-tooltip
|
|
min-width="100"
|
|
/>
|
|
</el-table>
|
|
</el-collapse-item>
|
|
</el-collapse>
|
|
</el-card>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<div style="margin-top: 50px">
|
|
<el-form ref="basicInfoForm" size="small">
|
|
<el-row>
|
|
<el-col :span="12" :offset="6">
|
|
<el-form-item
|
|
prop="Qualified"
|
|
label="Which one do you prefer?"
|
|
label-width="200px"
|
|
:rules="[{ required: true, message: '', trigger: 'blur' }]"
|
|
>
|
|
<!-- v-model="reportResult.Qualified" -->
|
|
<el-radio-group v-model="adReport.SelectGlobalId" :disabled="isReportSaved">
|
|
<el-radio :label="dbAdInfo.Global1Id">Global1</el-radio>
|
|
<el-radio :label="dbAdInfo.Global2Id">Global2</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8" :offset="6">
|
|
<el-form-item label="Note: " prop="Note">
|
|
<el-input
|
|
v-model="adReport.AdNote"
|
|
type="textarea"
|
|
:rows="8"
|
|
placeholder="Please input Note"
|
|
>
|
|
<!-- v-model="textarea" -->
|
|
</el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row>
|
|
<el-form-item style="margin-left: 120px">
|
|
<el-button
|
|
type="primary"
|
|
style="float: left; margin-left: 500px"
|
|
:disabled="isReportSaved"
|
|
@click="AddADReport"
|
|
>Save</el-button>
|
|
</el-form-item>
|
|
</el-row>
|
|
</el-form>
|
|
</div>
|
|
</div>
|
|
<div v-if="dialogVisible">
|
|
<el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="90%">
|
|
<baseline-task v-if="rowVisitNum == 1" />
|
|
<visit-task
|
|
v-if="rowVisitNum != 1"
|
|
:global-row-visit-num="rowVisitNum"
|
|
:visit-tp-code="rowTpCode"
|
|
/>
|
|
</el-dialog>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
GetAdReport,
|
|
AddAdjudicationReport
|
|
} from '@/api/reading'
|
|
import BaselineTask from '../tp/baselineTask.vue'
|
|
import VisitTask from '../tp/visitTask.vue'
|
|
|
|
export default {
|
|
name: 'GlobalTask',
|
|
components: { VisitTask, BaselineTask },
|
|
data() {
|
|
return {
|
|
token: zzSessionStorage.getItem('TokenKey'),
|
|
pageAdInfo: '',
|
|
dbAdInfo: '',
|
|
isReportSaved: false,
|
|
|
|
activeNames: [
|
|
'TimepointEfficacy',
|
|
'CommentsForSubject',
|
|
'PreviousGlobalReads'
|
|
],
|
|
|
|
// Global1:'',
|
|
// Global2:'',
|
|
PreviousGlobalReadsList1: [],
|
|
PreviousGlobalReadsList2: [],
|
|
SubjectNote1: '',
|
|
SubjectNote2: '',
|
|
|
|
Global1VisitRS: [],
|
|
Global2VisitRS: [],
|
|
|
|
dialogVisible: false,
|
|
rowVisitNum: 0,
|
|
rowTpCode: '',
|
|
dialogTitle: '',
|
|
|
|
adReport: {
|
|
AdID: '',
|
|
SelectGlobalId: '',
|
|
AdNote: ''
|
|
},
|
|
|
|
timepointEfficacyList: [],
|
|
previousGlobalReadsList: []
|
|
}
|
|
},
|
|
|
|
created() {
|
|
this.pageAdInfo = this.$route.query
|
|
},
|
|
|
|
mounted() {
|
|
this.GetAdReport(this.pageAdInfo.Id)
|
|
},
|
|
|
|
methods: {
|
|
GetAdReport(id) {
|
|
GetAdReport(id).then((res) => {
|
|
this.PreviousGlobalReadsList1 = res.Result.Global1.PreviousGlobalReadsList
|
|
this.SubjectNote1 = res.Result.Global1.SubjectNote
|
|
this.Global1VisitRS = res.Result.Global1VisitRS
|
|
|
|
this.PreviousGlobalReadsList2 = res.Result.Global2.PreviousGlobalReadsList
|
|
this.SubjectNote2 = res.Result.Global2.SubjectNote
|
|
this.Global2VisitRS = res.Result.Global2VisitRS
|
|
|
|
this.dbAdInfo = res.Result.ADInfo
|
|
|
|
this.adReport.SelectGlobalId = this.dbAdInfo.SelectGlobalId
|
|
this.adReport.AdNote = this.dbAdInfo.AdNote
|
|
})
|
|
|
|
// getHistoryVisitRsList(
|
|
// this.globalInfo.TrialId,
|
|
// this.globalInfo.TrialCode,
|
|
// this.globalInfo.SubjectCode,
|
|
// this.globalInfo.WorkloadCode,
|
|
// this.globalInfo.VisitNum,
|
|
// this.globalInfo.Id
|
|
// ).then((res) => {
|
|
// this.timepointEfficacyList = res.Result
|
|
// })
|
|
},
|
|
|
|
// getPreviousGlobalReads() {
|
|
// getHistoryGlobalRsList(
|
|
// this.globalInfo.TrialId,
|
|
// this.globalInfo.SubjectCode,
|
|
// this.globalInfo.VisitNum,
|
|
// this.globalInfo.Id
|
|
// ).then((res) => {
|
|
// this.previousGlobalReadsList = res.Result.PreviousGlobalReadsList
|
|
// this.subjectNote = res.Result.SubjectNote
|
|
// })
|
|
// },
|
|
|
|
AddADReport() {
|
|
this.adReport.AdID = this.pageAdInfo.Id
|
|
|
|
AddAdjudicationReport(this.adReport).then(res => {
|
|
this.$message.success('Report saved successfully')
|
|
|
|
this.GetAdReport(this.pageAdInfo.Id)
|
|
})
|
|
},
|
|
|
|
goVisitImage(row) {
|
|
const routes = this.$router.resolve({
|
|
path: '/showdicom',
|
|
query: { tpCode: row.TpCode, visitNum: row.VisitNum, token: zzSessionStorage.getItem('TokenKey') }
|
|
})
|
|
window.setTimeout(function() {
|
|
window.open(routes.href, '_blank')
|
|
}, 1000)
|
|
},
|
|
|
|
goCRF(row) {
|
|
this.rowVisitNum = row.VisitNum
|
|
this.dialogVisible = true
|
|
this.rowTpCode = row.TpCode
|
|
this.dialogTitle =
|
|
this.globalInfo.TrialCode +
|
|
'/' +
|
|
this.globalInfo.SubjectCode +
|
|
'/' +
|
|
row.VisitName
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.ImageReviewTask-list {
|
|
// height: 100%;
|
|
|
|
.el-collapse-item.is-disabled .el-collapse-item__header {
|
|
color: black;
|
|
}
|
|
|
|
.el-collapse-item__header {
|
|
// background-color: #f0f0f0;
|
|
height: 40px;
|
|
line-height: 40px;
|
|
font-weight: bold;
|
|
padding: 0 5px;
|
|
}
|
|
|
|
// #footer {
|
|
// position: fixed;
|
|
// bottom: 30px;
|
|
// width: 100%;
|
|
// // height: 30px; /*脚部的高度*/
|
|
// // background: #6cf;
|
|
// clear: both;
|
|
// }
|
|
}
|
|
</style>
|