simple-coder/templates/frontend/reactjs/view/admin/home.html

tool to generate code and framework

<script id ='MainTemplate' type="text/simple-template">
<div class="panel panel-default ">
    <div class="panel panel-default">
        <div class="panel-heading clearfix">
            <div class="pull-right">
                    <div class="btn-group">
                    <button type="button" class="btn btn-sm btn-default dropdown-toggle" data-toggle="dropdown">
                        按属性排序 <span class="caret"></span>
                    </button>
                    <ul class="dropdown-menu pull-right" role="menu">
                        <li><a href="#">按名称</a></li>
                        <li><a href="#">按描述</a></li>
                        <li><a href="#">恢复缺省排序</a></li>
                    </ul>
                </div>
            </div>
            <div class="pull-left">
                <a href="#add">
                <button class="btn btn-sm btn-primary" data-toggle="modal" data-target="#newPopUp" data-backdrop="static">
                    <span class="glyphicon glyphicon-plus"></span>新增
                </button>
                    </a>
                <button class="btn btn-sm btn-danger btn-rows-remove"><span class="glyphicon glyphicon-remove"></span>删除</button>
            </div>
        </div>
        <!--the end of panel-heading-->


        <table id="List" class="table table-bordered table-hover cc">
            <thead>
            <tr class="">
                <td class="text-center">
                    <input type="checkbox" class ="checked-all-unchecked"/></td>


                <?
                var  columns = [];
                var  fieldDefines = [];
                for (var field in data.moduleDefine){
                    var fieldDef = data.moduleDefine[field];
                    var keyName     = field;
                    var displayName = fieldDef.dName;
                    var fieldName   = fieldDef.dName;
                    var type        = fieldDef.type;
                    var refer       = fieldDef.refer;
                    if (refer){
                        if (refer.map=="ManyToMany"){
                        }else{
                            if (refer.mapField){
                                 keyName = field + "." + refer.mapField;
                            }else{
                                 keyName = field + ".name";
                            }
                             columns.push(keyName);
                             fieldDefines.push({"name":field,show:fieldDef.show});
                        }
                    }else{
                          columns.push(keyName);
                          fieldDefines.push({"name":field,show:fieldDef.show});
                    }


              if (fieldDef.show){ ?>
                <td><?=fieldName?></td>
                <?}}?>
                <td class="col-lg-3">操作</td>
            </tr>
            </thead>
            <tbody>
<%_.each(data,function(v,k){

            %>


            <tr>
                <td class="text-center">
                    <input type="checkbox" name="checkbox" value="<%=v.id%>"/></td>
                <? for (var i=0;i< columns.length;i++){ ?>

                     <? if (fieldDefines[i].show=="image"){ ?>
                <% if (v.<?-fieldDefines[i].name ?>){ %>
                <td><img src="<%=v.<?=fieldDefines[i].name?>%>" style="heigth:50px;width:50px" /></td>
                <%}else{%>
                <td>No IMAGE</td>
                <%}%>
                      <?}else if(!fieldDefines[i].show){
                        continue;
                      }else{?>
                <% if (v.<?-fieldDefines[i].name ?>){ %>
                <td><%=v.<?=columns[i]?>%></td>
                <%}else{%>
                <td>N/A</td>
                <%}%>
                      <?}?>


                <?}?>

                <td>


                    <a  href="#info?id=<%=v.id%>" class="btn  btn-xs btn-info">
                        <span class="glyphicon glyphicon-list"></span>详情
                    </a>
                    <a  href="#edit?id=<%=v.id%>" class="btn  btn-xs btn-primary">
                        <span class="glyphicon glyphicon-pencil"></span>编辑
                    </a>
                    <a  href="#" class="btn  btn-xs btn-warning btn-row-remove" data-id="<%=v.id%>" >
                        <span class="glyphicon glyphicon-remove"></span>删除
                    </a>
                    <a  href="#add" class="btn  btn-xs btn-primary">
                        <span class="glyphicon glyphicon-plus"></span>新增
                    </a>


                </td>
            </tr>
            <%});%>
            </tbody>
        </table>
    </div>
    <ul class="pager">

        <li><a href="#">上一页</a></li>
        <li><a href="#">下一页</a></li>

    </ul>

</div>

<div class="modal small hide fade" id="remvoePopUp" role="dialog">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">脳</button>
        <h3 id="myModalLabel">Delete Confirmation</h3>
    </div>
    <div class="modal-body">
        <p class="error-text"><i class="icon-warning-sign modal-icon"></i>Are you sure you want to delete the data?</p>
    </div>
    <div class="modal-footer">
        <button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
        <button class="btn btn-danger" data-dismiss="modal">Delete</button>
    </div>
</div>
    </script>