jeecg t:datagrid列表使用进度条progressbar控件

稍微摸索了一下，在列表中显示进度条。如下图所示：

 

 

闲话少说，直接上代码：

<t:datagrid name="taskMgrList" checkbox="false" fitColumns="false"
			title="进度" treegrid="true" actionUrl="tController.dotaskGrid" idField="id" fit="true" queryMode="group" onDblClick="editRecord" pagination="true" pageSize="10">

<t:dgCol title="进度" field="taskProgress"   treefield="fieldMap.taskProgress" formatterjs="progressFormatter"  queryMode="single" width="120"></t:dgCol>
</t:datagrid>

主要是使用了formatterjs这个属性，扩展，也就是调用easyUI的formatter这个属性。

function progressFormatter(value, rowData, rowIndex) {
		var color = "red";
		if (value <= 30) {
		} else if (value <= 70) {
			color = "#EABA0A";
		} else {
			color = "#53CA22";
		}

		var htmlstr = '<div id="p" class="easyui-progressbar progressbar easyui-fluid" data-options="value:' + value + '" style="width: 100%; height: 22px;background-color:#ffecda">' +
			'<div class="progressbar-text" style="width: 99%; height: 20px; line-height: 20px;">' + value + '%</div>' +
			'<div class="progressbar-value" style="width: ' + value + '%; height: 20px; line-height: 20px;">' +
			'<div class="progressbar-text" style="width: 99%; height: 21px; line-height: 20px;background-color:' + color + '">' + value + '%</div></div></div>';

		return htmlstr;
	}

以上就是实现进度条的全部代码。