指數 + 燈號範例

Widget程式碼範例

<div class="chart_content">
    <p>可自訂widget說明(可省略)</p>
    <!-- 指數 + 燈號 -->
    <div class="info_block">
        <div class="info">
            <span class="info_title">標題</span>
            <span class="info_value">指數</span>
        </div>
        <div class="info">
            <span class="info_title">標題</span>
            <!-- 紅燈 -->
            <span class="info_light red">指數</span>
        </div>
        <div class="info">
            <span class="info_title">標題</span>
            <!-- 綠色 -->
            <span class="info_light green">指數</span>
        </div>
        <div class="info">
            <span class="info_title">標題</span>
            <!-- 黃色 -->
            <span class="info_light yellow">指數</span>
        </div>
        <div class="info">
            <span class="info_title">標題</span>
            <!-- 灰色 -->
            <span class="info_light gray">指數</span>
        </div>
    </div>
</div>

指數 + 燈號

update:

Lorem ipsum dolor sit amet, consectetur adipisicing elit

設備 D09
產能效率 78%
運行 正常
當前加工刀具 T02
設備 D10
剩餘壽命 53
設備 D09
設備 D09

指數 + 燈號

update:

Lorem ipsum dolor sit amet, consectetur adipisicing elit

設備 D09
產能效率 78%
運行 正常
當前加工刀具 T02
設備 D10
剩餘壽命 53
設備 D09
設備 D09

指數 + 燈號

update:
設備 D09
設備 D09
設備 D09
設備 D09
設備 D09
設備 D09
設備 D09
設備 D09

指數 + 燈號

update:
設備 D09
產能效率 78%
OEE 81%
當前加工刀具 T02
健康值 65
剩餘壽命 53
設備 D09
設備 D09

指數 + 燈號

update:
設備 D09
產能效率 78%
OEE 81%
當前加工刀具 T02
健康值 65
剩餘壽命 53
設備 D09
設備 D09

指數 + 燈號

update:
設備 D09
產能效率 78%
運行 正常
當前加工刀具 T02
設備 D10
剩餘壽命 53
設備 D09
設備 D09

指數 + 燈號

update:
設備 D09
產能效率 78%
運行 正常
當前加工刀具 T02
設備 D10
剩餘壽命 53
設備 D09
設備 D09

指數 + 燈號

update:
設備 D09
產能效率 78%
運行 正常
當前加工刀具 T02
設備 D10
剩餘壽命 53
設備 D09
設備 D09

指數 + 燈號

update:
設備 D09
產能效率 78%
OEE 81%
當前加工刀具 T02
健康值 65
剩餘壽命 53
設備 D09
設備 D09

指數 + 燈號

update:
設備 D09
產能效率 78%
運行 正常
當前加工刀具 T02
設備 D10
剩餘壽命 53
設備 D09
設備 D09

指數 + 燈號

update:
設備 D09
產能效率 78%
OEE 81%
當前加工刀具 T02
健康值 65
剩餘壽命 53
設備 D09
設備 D09