irc_web/.svn/pristine/f9/f9abf263c760e907dc4753f7196...

336 lines
9.0 KiB
Plaintext

<template>
<div class="app-container">
<div class="ImageReviewTask-list app-container">
<el-collapse v-model="activeNames">
<el-collapse-item
title="Timepoint Efficacy Assessment"
name="TimepointEfficacy"
>
<el-table
ref="TimepointEfficacyTable"
:data="timepointEfficacyList"
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="subjectNote"
type="text"
placeholder=""
size="small"
:disabled="isReportSaved"
/>
</el-collapse-item>
<el-collapse-item
title="Previous Global Reads"
name="PreviousGlobalReads"
>
<el-table
ref="GlobalReadsTable"
:data="previousGlobalReadsList"
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>
<div id="footer">
<el-button
type="primary"
style="float: left; margin-left: 500px"
:disabled="isReportSaved"
@click="AddGlobalReport"
>Save</el-button>
<!-- <el-button
type="primary"
style="float: left; margin-left: 600px"
:disabled="isReportSaved"
@click="submiteReport"
>Submit Report</el-button
> -->
</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 {
getHistoryVisitRsList,
getHistoryGlobalRsList,
AddGlobalReport
} from '@/api/reading'
import BaselineTask from '../tp/baselineTask.vue'
import VisitTask from '../tp/visitTask.vue'
export default {
name: 'GlobalTask',
components: { VisitTask, BaselineTask },
data() {
return {
isReportSaved: false,
pageTPInfo: '',
activeNames: [
'TimepointEfficacy',
'CommentsForSubject',
'PreviousGlobalReads'
],
subjectNote: '',
subjectCode: '',
dialogVisible: false,
rowVisitNum: 0,
rowTpCode: '',
dialogTitle: '',
globalInfo: {},
timepointEfficacyList: [],
previousGlobalReadsList: []
}
},
created() {
this.globalInfo = this.$route.query
},
mounted() {
this.getTimepointEfficacy()
this.getPreviousGlobalReads()
},
methods: {
getTimepointEfficacy() {
getHistoryVisitRsList(
this.globalInfo.TrialId,
this.globalInfo.SubjectId,
this.globalInfo.VisitNum,
this.globalInfo.Id,
this.globalInfo.WorkloadCode
).then((res) => {
this.timepointEfficacyList = res.Result
})
},
getPreviousGlobalReads() {
getHistoryGlobalRsList(
this.globalInfo.TrialId,
this.globalInfo.SubjectId,
this.globalInfo.VisitNum,
this.globalInfo.Id
).then((res) => {
this.previousGlobalReadsList = res.Result.PreviousGlobalReadsList
this.subjectNote = res.Result.SubjectNote
})
},
AddGlobalReport() {
var globalData = {}
globalData.GlobalId = this.globalInfo.Id
globalData.SubjectNote = this.subjectNote
globalData.SubjectCode = this.globalInfo.SubjectCode
globalData.SubjectId = this.globalInfo.SubjectId
globalData.GlobalRSReportList = []
this.timepointEfficacyList.forEach((element) => {
globalData.GlobalRSReportList.push({
GlobalId: this.globalInfo.Id,
TpCode: element.TpCode,
VisitNum: element.VisitNum,
Agree: element.GlobalRSSelect.Agree,
NewRS: element.GlobalRSSelect.NewRS,
Note: element.GlobalRSSelect.Note
})
})
AddGlobalReport(globalData).then((res) => {
this.$message.success('Report saved successfully')
// this.isReportSaved = true
this.getTimepointEfficacy()
this.getPreviousGlobalReads()
})
},
goVisitImage(row) {
const token = zzSessionStorage.getItem('TokenKey')
const routes = this.$router.resolve({
path: '/showdicom',
query: { tpCode: row.TpCode, visitNum: row.VisitNum, studyId: row.StudyId, type: 'Global', token: token }
})
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;
}
// .el-collapse-item__wrap {
// padding: 0 5px;
// }
// .el-collapse {
// margin-bottom: 100px;
// }
// .toolbar {
// margin: 5px 0px;
// .mr {
// margin-right: 5px;
// width: 130px;
// }
// }
#footer {
position: fixed;
bottom: 30px;
width: 100%;
// height: 30px; /*脚部的高度*/
// background: #6cf;
clear: both;
}
}
</style>