458 lines
		
	
	
		
			14 KiB
		
	
	
	
		
			Plaintext
		
	
	
			
		
		
	
	
			458 lines
		
	
	
		
			14 KiB
		
	
	
	
		
			Plaintext
		
	
	
| <template>
 | |
|   <BaseContainer>
 | |
|     <template slot="search-container">
 | |
|       <el-form :inline="true">
 | |
|         <!-- Name -->
 | |
|         <el-form-item :label="$t('trials:stats:form:name')">
 | |
|           <el-input
 | |
|             v-model="listQuery.ReviewerName"
 | |
|             disabled
 | |
|           />
 | |
|         </el-form-item>
 | |
|         <!-- Source -->
 | |
|         <el-form-item class="my_multiple" :label="$t('trials:stats:form:source')">
 | |
|           <el-select v-model="listQuery.WorkLoadFromStatus" style="width: 140px" class="handle-select" multiple clearable>
 | |
|             <el-option
 | |
|               v-for="item in statusOption"
 | |
|               :key="item.value"
 | |
|               :label="item.label"
 | |
|               :value="item.value"
 | |
|             />
 | |
|           </el-select>
 | |
|         </el-form-item>
 | |
|         <!-- Begin Month -->
 | |
|         <el-form-item :label="$t('trials:stats:form:beginMonth')">
 | |
|           <el-date-picker
 | |
|             v-model="listQuery.SearchBeginDateTime"
 | |
|             type="month"
 | |
|             value-format="yyyy-MM"
 | |
|             format="yyyy-MM"
 | |
|             :picker-options="beginPickerOption"
 | |
|           />
 | |
|         </el-form-item>
 | |
|         <!-- End Month -->
 | |
|         <el-form-item :label="$t('trials:stats:form:endMonth')">
 | |
|           <el-date-picker
 | |
|             v-model="listQuery.SearchEndDateTime"
 | |
|             type="month"
 | |
|             value-format="yyyy-MM"
 | |
|             format="yyyy-MM"
 | |
|             :picker-options="endpickerOption"
 | |
|           />
 | |
|         </el-form-item>
 | |
|         <el-form-item>
 | |
|           <!-- 查询 -->
 | |
|           <el-button type="primary" icon="el-icon-search" @click="handleSearch">
 | |
|             {{ $t('common:button:search') }}
 | |
|           </el-button>
 | |
|           <!-- 重置 -->
 | |
|           <el-button type="primary" icon="el-icon-refresh-left" @click="handleReset">
 | |
|             {{ $t('common:button:reset') }}
 | |
|           </el-button>
 | |
|         </el-form-item>
 | |
|       </el-form>
 | |
|     </template>
 | |
| 
 | |
|     <template slot="main-container">
 | |
|       <el-table
 | |
|         v-loading="listLoading"
 | |
|         v-adaptive="{bottomOffset:55}"
 | |
|         size="small"
 | |
|         height="100"
 | |
|         :data="list"
 | |
|         :cell-style="cellColor"
 | |
|         row-key="RowGuid"
 | |
|         lazy
 | |
|         border
 | |
|         :load="load"
 | |
|         :tree-props="{ hasChildren: 'hasChildren' }"
 | |
|       >
 | |
|         <el-table-column width="60" />
 | |
|         <!-- Month -->
 | |
|         <el-table-column :label="$t('trials:stats:table:month')" min-width="120" show-overflow-tooltip>
 | |
|           <template slot-scope="scope">
 | |
|             <div v-show="ShowMonthSelect(scope.row.DataFrom)">{{ scope.row.WorkTimeStr }}</div>
 | |
|           </template>
 | |
|         </el-table-column>
 | |
|         <!-- Source -->
 | |
|         <el-table-column
 | |
|           prop="DataFrom"
 | |
|           :label="$t('trials:stats:form:source')"
 | |
|           min-width="150"
 | |
|           show-overflow-tooltip
 | |
|         >
 | |
|           <template slot-scope="scope">{{ scope.row.DataFrom===0?'Reviewer':scope.row.DataFrom===1?'Client':'Reconciled' }}</template>
 | |
|         </el-table-column>
 | |
| 
 | |
|         <el-table-column
 | |
|           prop="Training"
 | |
|           :label="$t('trials:enrolledReviews:table:training')"
 | |
|           min-width="75"
 | |
|           show-overflow-tooltip
 | |
|         />
 | |
|         <el-table-column
 | |
|           prop="RefresherTraining"
 | |
|           :label="$t('trials:enrolledReviews:table:refresherTraining')"
 | |
|           min-width="130"
 | |
|           show-overflow-tooltip
 | |
|         />
 | |
|         <el-table-column :label="$t('trials:enrolledReviews:table:tp')" align="center">
 | |
|           <el-table-column
 | |
|             prop="Timepoint"
 | |
|             :label="$t('trials:enrolledReviews:table:tpRegular')"
 | |
|             min-width="80"
 | |
|             show-overflow-tooltip
 | |
|           />
 | |
| 
 | |
|           <el-table-column
 | |
|             prop="TimepointIn48H"
 | |
|             :label="$t('trials:enrolledReviews:table:tp48H')"
 | |
|             min-width="90"
 | |
|             show-overflow-tooltip
 | |
|           />
 | |
|           <el-table-column
 | |
|             prop="TimepointIn24H"
 | |
|             :label="$t('trials:enrolledReviews:table:tp24H')"
 | |
|             min-width="90"
 | |
|             show-overflow-tooltip
 | |
|           />
 | |
|         </el-table-column>
 | |
|         <el-table-column
 | |
|           :label="$t('trials:enrolledReviews:table:ad')"
 | |
|           align="center"
 | |
|         >
 | |
|           <el-table-column
 | |
|             prop="Adjudication"
 | |
|             :label="$t('trials:enrolledReviews:table:adRegular')"
 | |
|             min-width="80"
 | |
|             show-overflow-tooltip
 | |
|           />
 | |
| 
 | |
|           <el-table-column
 | |
|             prop="AdjudicationIn48H"
 | |
|             :label="$t('trials:enrolledReviews:table:ad48H')"
 | |
|             min-width="90"
 | |
|             show-overflow-tooltip
 | |
|           />
 | |
|           <el-table-column
 | |
|             prop="AdjudicationIn24H"
 | |
|             :label="$t('trials:enrolledReviews:table:ad24H')"
 | |
|             min-width="90"
 | |
|             show-overflow-tooltip
 | |
|           />
 | |
|         </el-table-column>
 | |
|         <el-table-column
 | |
|           prop="Global"
 | |
|           :label="$t('trials:enrolledReviews:table:gl')"
 | |
|           min-width="100"
 | |
|           show-overflow-tooltip
 | |
|         />
 | |
| 
 | |
|         <el-table-column
 | |
|           prop="Downtime"
 | |
|           :label="$t('trials:enrolledReviews:table:downtime')"
 | |
|           min-width="90"
 | |
|           show-overflow-tooltip
 | |
|         />
 | |
| 
 | |
|         <el-table-column :label="$t('common:action:action')" width="150" fixed="right">
 | |
|           <template slot-scope="scope">
 | |
|             <div v-if="scope.row.hasChildren">
 | |
|               <!-- Add -->
 | |
|               <el-button
 | |
|                 circle
 | |
|                 icon="el-icon-plus"
 | |
|                 :disabled="scope.row.IsLock"
 | |
|                 :title="$t('trials:stats:action:add')"
 | |
|                 @click="handleAdd(scope.row)"
 | |
|               />
 | |
|             </div>
 | |
|             <div v-else>
 | |
|               <!-- Edit -->
 | |
|               <el-button
 | |
|                 circle
 | |
|                 icon="el-icon-edit-outline"
 | |
|                 :title="$t('trials:stats:action:edit')"
 | |
|                 :disabled="scope.row.IsLock"
 | |
|                 @click="handleUpdate(scope.row)"
 | |
|               />
 | |
|               <!-- 重置 -->
 | |
|               <el-button
 | |
|                 v-if="scope.row.DataFrom"
 | |
|                 circle
 | |
|                 :title="$t('trials:stats:action:reset')"
 | |
|                 icon="el-icon-refresh"
 | |
|                 :disabled="scope.row.Id==guidEmpty|| scope.row.Id==null || scope.row.IsLock"
 | |
|                 @click="handleDelete(scope.row)"
 | |
|               />
 | |
|               <!-- 删除 -->
 | |
|               <el-button
 | |
|                 v-if="(!scope.row.DataFrom)"
 | |
|                 circle
 | |
|                 :title="$t('trials:stats:action:del')"
 | |
|                 icon="el-icon-delete"
 | |
|                 :disabled="scope.row.IsLock"
 | |
|                 @click="handleDelete(scope.row)"
 | |
|               />
 | |
|             </div>
 | |
|           </template>
 | |
|         </el-table-column>
 | |
|       </el-table>
 | |
|     </template>
 | |
|     <el-dialog
 | |
|       ref="dialog__wrapper"
 | |
|       :key="timer"
 | |
|       v-dialogDrag
 | |
|       size="small"
 | |
|       :visible.sync="dialogVisible"
 | |
|       width="40%"
 | |
|       :title="title"
 | |
|       :close-on-click-modal="false"
 | |
|     >
 | |
|       <add-workload
 | |
|         :id="Id"
 | |
|         :trial-id="trialId"
 | |
|         :doctor-id="doctorId"
 | |
|         :trial-expedited-state="expeditedState"
 | |
|         :info="row"
 | |
|         :year-month="yearMonth"
 | |
|         @handleClose="handleClose"
 | |
|         @setTitle="setTitle"
 | |
|       />
 | |
|     </el-dialog>
 | |
|   </BaseContainer>
 | |
| </template>
 | |
| <script>
 | |
| import { getDoctorWorkLoadList, getReviewerWorkLoadListDetail, getTrialExpeditedState, deleteWorkLoad } from '@/api/trials'
 | |
| import '@/directive/dialogDrag'
 | |
| require('@/utils/formatter')
 | |
| import BaseContainer from '@/components/BaseContainer'
 | |
| import AddWorkload from './components/AddWorkload'
 | |
| const getListQueryDefault = () => {
 | |
|   return {
 | |
|     TrialId: '',
 | |
|     DoctorId: '',
 | |
|     WorkLoadFromStatus: [0, 1, 2],
 | |
|     SearchBeginDateTime: new Date(new Date().setMonth(new Date().getMonth() - 3)).format('yyyy-MM'),
 | |
|     SearchEndDateTime: new Date().format('yyyy-MM'),
 | |
|     PageIndex: 1,
 | |
|     PageSize: 20,
 | |
|     Asc: false,
 | |
|     SortField: ''
 | |
|   }
 | |
| }
 | |
| export default {
 | |
|   name: 'Stats',
 | |
|   components: { BaseContainer, AddWorkload },
 | |
|   data() {
 | |
|     return {
 | |
|       list: [],
 | |
|       listQuery: getListQueryDefault(),
 | |
|       statusOption: this.$d.WorkLoadStatusOption,
 | |
|       listLoading: false,
 | |
|       beginPickerOption: {
 | |
|         disabledDate: time => {
 | |
|           if (this.listQuery.SearchEndDateTime) {
 | |
|             return time.getTime() > new Date(this.listQuery.SearchEndDateTime).getTime()
 | |
|           } else {
 | |
|             return time.getTime() > Date.now()
 | |
|           }
 | |
|         }
 | |
|       },
 | |
|       endpickerOption: {
 | |
|         disabledDate: time => {
 | |
|           const _now = Date.now()
 | |
|           return time.getTime() > _now
 | |
|         }
 | |
|       },
 | |
|       expeditedState: 0,
 | |
|       dialogVisible: false,
 | |
|       Id: '',
 | |
|       trialId: '',
 | |
|       doctorId: '',
 | |
|       title: '',
 | |
|       row: {},
 | |
|       timer: '',
 | |
|       yearMonth: '',
 | |
|       maps: new Map(),
 | |
|       guidEmpty: '00000000-0000-0000-0000-000000000000',
 | |
|       trialCode: ''
 | |
|     }
 | |
|   },
 | |
|   mounted() {
 | |
|     this.trialCode = this.$route.query.trialCode
 | |
|     this.trialId = this.$route.query.trialId
 | |
|     this.listQuery.TrialCode = this.trialCode
 | |
|     this.listQuery.ReviewerName = this.$route.query.doctorName
 | |
|     this.doctorId = this.$route.query.doctorId
 | |
|     this.initPage()
 | |
|     this.getExpeditedState()
 | |
|   },
 | |
|   methods: {
 | |
|     initPage() {
 | |
|       this.listLoading = true
 | |
|       this.listQuery.DoctorId = this.$route.query.doctorId
 | |
|       this.listQuery.TrialId = this.$route.query.trialId
 | |
|       this.listQuery.TrialCode = this.trialCode
 | |
|       this.listQuery.ReviewerName = this.$route.query.doctorName
 | |
|       getDoctorWorkLoadList(this.listQuery).then(res => {
 | |
|         this.listLoading = false
 | |
|         const { CurrentPageData } = res.Result
 | |
|         CurrentPageData.forEach(function(item) {
 | |
|           item.DataFrom === 0 ? item.hasChildren = true : ''
 | |
|         })
 | |
|         this.list = CurrentPageData
 | |
|       }).catch(() => { this.listLoading = false })
 | |
|     },
 | |
|     handleReset() {
 | |
|       this.listQuery = getListQueryDefault()
 | |
|       this.initPage()
 | |
|     },
 | |
|     handleSearch() {
 | |
|       this.listQuery.PageIndex = 1
 | |
|       this.initPage()
 | |
|     },
 | |
|     handleAdd(row) {
 | |
|       this.timer = new Date().getTime()
 | |
|       this.title = this.$t('trials:stats:dialogTitle:add')
 | |
|       this.Id = ''
 | |
|       this.row = { ...row }
 | |
|       this.yearMonth = row.YearMonthStr
 | |
|       this.dialogVisible = true
 | |
|     },
 | |
|     handleUpdate(row) {
 | |
|       this.row = {}
 | |
|       this.timer = new Date().getTime()
 | |
|       this.title = this.$t('trials:stats:dialogTitle:edit')
 | |
|       this.Id = row.Id
 | |
|       this.dialogVisible = true
 | |
|       this.row = { ...row }
 | |
|       if (row.DataFrom === 2) {
 | |
|         var clientData = this.list.find(item => item.DataFrom === 1 && item.WorkTimeStr === row.WorkTimeStr)
 | |
|         this.row.clientData = clientData
 | |
|       }
 | |
|     },
 | |
|     handleDelete(row) {
 | |
|       let str = ''
 | |
|       if (row.DataFrom === 0) {
 | |
|         str = this.$t('trials:stats:message:del')
 | |
|       } else {
 | |
|         str = this.$t('trials:stats:message:reset')
 | |
|       }
 | |
|       this.$confirm(str, {
 | |
|         type: 'warning',
 | |
|         distinguishCancelAndClose: true
 | |
|       })
 | |
|         .then(() => {
 | |
|           deleteWorkLoad(row.Id, this.trialId).then(res => {
 | |
|             if (res.IsSuccess) {
 | |
|               this.initPage()
 | |
|               this.$message.success(this.$t('common:message:deletedSuccessfully'))
 | |
|             }
 | |
|           })
 | |
|         })
 | |
|     },
 | |
|     handleClose() {
 | |
|       this.dialogVisible = false
 | |
|       this.initPage()
 | |
|     },
 | |
|     load(tree, treeNode, resolve, type) {
 | |
|       const YearMonthStr = tree.YearMonthStr
 | |
|       this.maps.set(YearMonthStr, { tree, treeNode, resolve })
 | |
|       const param = {
 | |
|         TrialId: this.trialId,
 | |
|         DoctorId: this.$route.query.doctorId,
 | |
|         YearMonthStr: tree.WorkTimeStr
 | |
|       }
 | |
|       getReviewerWorkLoadListDetail(param).then(res => {
 | |
|         if (res.IsSuccess) {
 | |
|           if (res.Result) {
 | |
|             const data = res.Result
 | |
|             const nodes = res.Result.map(v => {
 | |
|               return { ...v, hasChildren: v.level <= 2 }
 | |
|             })
 | |
|             resolve(nodes)
 | |
|             if (data.length > 0) {
 | |
|               this.reFlashTbl(data)
 | |
|               this.$message.success(this.$t('common:message:savedSuccessfully'))
 | |
|             }
 | |
|           }
 | |
|         }
 | |
|       })
 | |
|     },
 | |
|     reFlashTbl(data) {
 | |
|       for (let i = 0; i < this.list.length; i++) {
 | |
|         if (this.list[i].YearMonthStr === data[0].YearMonthStr && this.list[i].DataFrom === 0) {
 | |
|           let Training = 0
 | |
|           let Timepoint = 0
 | |
|           let TimepointIn24H = 0
 | |
|           let TimepointIn48H = 0
 | |
|           let Adjudication = 0
 | |
|           let AdjudicationIn24H = 0
 | |
|           let AdjudicationIn48H = 0
 | |
|           let Global = 0
 | |
|           let Downtime = 0
 | |
|           for (let j = 0; j < data.length; j++) {
 | |
|             Training = data[j].Training + Training
 | |
|             Timepoint = data[j].Timepoint + Timepoint
 | |
|             TimepointIn24H = data[j].TimepointIn24H + TimepointIn24H
 | |
|             TimepointIn48H = data[j].TimepointIn48H + TimepointIn48H
 | |
|             Adjudication = data[j].Adjudication + Adjudication
 | |
|             AdjudicationIn24H = data[j].AdjudicationIn24H + AdjudicationIn24H
 | |
|             AdjudicationIn48H = data[j].AdjudicationIn48H + AdjudicationIn48H
 | |
|             Global = data[j].Global + Global
 | |
|             Downtime = data[j].Downtime + Downtime
 | |
|           }
 | |
|           this.list[i].Training = Training
 | |
|           this.list[i].Timepoint = Timepoint
 | |
|           this.list[i].TimepointIn24H = TimepointIn24H
 | |
|           this.list[i].TimepointIn48H = TimepointIn48H
 | |
|           this.list[i].Adjudication = Adjudication
 | |
|           this.list[i].AdjudicationIn24H = AdjudicationIn24H
 | |
|           this.list[i].AdjudicationIn48H = AdjudicationIn48H
 | |
|           this.list[i].Global = Global
 | |
|           this.list[i].Downtime = Downtime
 | |
|           break
 | |
|         }
 | |
|       }
 | |
|     },
 | |
|     getExpeditedState() {
 | |
|       const id = this.$route.query.trialId
 | |
|       getTrialExpeditedState(id).then(res => { this.expeditedState = res.Result })
 | |
|     },
 | |
|     ShowMonthSelect(dataFrom) {
 | |
|       return Math.min(...this.listQuery.WorkLoadFromStatus) === dataFrom
 | |
|     },
 | |
|     cellColor({ row, column, rowIndex, columnIndex }) {
 | |
|       if (row.DataFrom === 1) {
 | |
|         return {
 | |
|           color: '#0099cc'
 | |
|         }
 | |
|       } else if (row.DataFrom === 2) {
 | |
|         return {
 | |
|           color: '#f56c6c'
 | |
|         }
 | |
|       }
 | |
|     },
 | |
|     setTitle(title) {
 | |
|       this.title = this.$t('trials:stats:dialogTitle:edit')
 | |
|     }
 | |
|   }
 | |
| }
 | |
| </script>
 | |
| <style lang="scss" scoped>
 | |
|   .stats-container{
 | |
|     padding: 5px 10px;
 | |
|     margin-top: 10px;
 | |
|     height: 100%;
 | |
|     .handle-select {
 | |
|       width: 300px;
 | |
|       margin-right: 10px;
 | |
|       margin-bottom: 5px;
 | |
|     }
 | |
|     .stats-list{
 | |
|       height: calc(100% - 80px);
 | |
|     }
 | |
|   }
 | |
| </style>
 |