레드마인 유형별 색상 적용하기

적당한 플러그인을 찾을 수 없어 Redmine Custom JS를 활용하여 아래 그림 처럼 색상을 적용합니다.

 

1. Alternate 테마에서 적용

2. Redmine Custom JS plugin 설치

3. Redmine Custom JS plugin 설정 화면에서 아래 코드 적용

 
$(function(){
    const config = [
    {
        className : 'status',
        styles : [
            { "text" : "해결", "backgroundColor" : '#7fe5f0'},
            { "text" : "진행중", "backgroundColor" : '#7fffd4'},
            { "text" : "정보부족", "backgroundColor" : '#ff6666', "color" : "white"},
            { "text" : "대기", "backgroundColor" : '#fff68f'},
            { "text" : "완료", "backgroundColor" : '#ccc'},
        ]
    },
    {
        className : 'tracker',
        styles : [
            { "text" : "오류", "color" : '#ff6666', 'fontWeight' : 'bold'},
            { "text" : "신규", "color" : '#5ac18e', 'fontWeight' : 'bold'},
            { "text" : "유지", "color" : '#4ca3dd', 'fontWeight' : 'bold'},
            { "text" : "문서", 'fontWeight' : 'bold'},
        ]
    }
    ];
    
    config.forEach( colorSet => {
        $('.' + colorSet.className).each( function(){
            let text = $(this).text();    
            let style = colorSet.styles.filter( style => text.indexOf( style.text) > -1);
            if( style && style.length > 0){
                style = style[0];
                $(this).css( style);

                $(this).css('padding', '3px');  
            }
        });
    });

    // progress show %
    $('table[class*=progress-]').each( function(){
        let percentage = 0;
        $(this)[0].className.split(' ').forEach( className => { 
            if( className.startsWith('progress-'))
                percentage = parseInt( className.split('-')[1]);
        });
        if( percentage > 0){
            if( percentage < 50){
                $(this).find('td:nth-child(2)').css('overflow', 'visible').html( percentage + '%');
            }else
                $(this).find('td:first').css('overflow', 'visible').html( percentage + '%');
        }
    });
    console.log('Custom JS Loaded.');
});