티스토리 뷰

 

 

 

api response 에서 받아온 두개의 밀리세컨드의 차를 구한 뒤 나온 밀리세컨드 값을 처리하면서 HH:MM:SS 시분초로 나타내는 두가지 방법

 this.$http.get('/report/details', {
        params: {
            'startDate': this.search.sDate ? this.$moment(this.search.sDate).format('YYYYMMDD') : '',
            'endDate': this.search.eDate ? this.$moment(this.search.eDate).format('YYYYMMDD'): '',
        }
    }).then(response => {
        const item = response.data;
        const approvedDtime = item.map(data => data.approvedDtime);
        const studyDtime = item.map(data => data.studyDtime);
        const actualDurations = approvedDtime.map((time, index) => time - studyDtime[index]);

        this.items = item.map((item, index) => ({
            ...item,
            tat: actualDurations[index]
        }));

        this.sumarizeCriteria.search = this.search;
        this.sumarizeCriteria.search.modality = encodeURI(modalityList);
        this.sumarizeCriteria.reportId = this.reportId;
    });
},

 

 

2.  밀리세컨 변환메서드 from stackoverflow

{
    field: 'tat', label: 'TAT',
    tdClass: 'text-right',
    thClass: 'text-center',
    formatFn: (value) => this.convertTat(value)
},
convertTat (millisec) {
    let seconds = (millisec / 1000).toFixed(0);
    let minutes = Math.floor(seconds / 60);
    let hours = '';
    if (minutes > 59) {
        hours = Math.floor(minutes / 60);
        hours = (hours >= 10) ? hours : '0' + hours;
        minutes = minutes - (hours * 60);
        minutes = (minutes >= 10) ? minutes : '0' + minutes;
    }
    seconds = Math.floor(seconds % 60);
    seconds = (seconds >= 10) ? seconds : '0' + seconds;
    if (hours !== '') {
        return hours + ':' + minutes + ':' + seconds;
    }
    return minutes + ':' + seconds;
},

 

 

 

3. moment 라이브러리 사용해서 간단히 처리. 단순히 포멧만 정해주는 moment.format()이 아닌

밀리세컨드를 시간단위로 변환해주는 moment.duration() 을 사용해야한다. 

{
    field: 'tat', label: 'TAT',
    tdClass: 'text-right',
    thClass: 'text-center',
    formatFn: (value) => {
        const duration = this.$moment.duration(value);
        const hours = Math.floor(duration.asHours());
        const minutes = duration.minutes();
        const seconds = duration.seconds();
        return `${hours}:${minutes}:${seconds}`;
    }
},

'Vue.js' 카테고리의 다른 글

multi-select 사용시 v-model 사용상 주의점  (0) 2024.10.29
vue에서 숫자만 입력하기  (0) 2024.08.26