details.ftl 18.8 KB
<!DOCTYPE html>
<html lang="en">
<#include "../common/head.ftl"/>
<body class="no-skin">
<#include "../common/top.ftl" />
    <div class="main-container ace-save-state" id="main-container">
		<#include "../common/left.ftl" />
		<!-- /section:basics/sidebar -->
		<div class="main-content">
			<div class="main-content-inner">
				<!-- #section:basics/content.breadcrumbs -->
				<div class="breadcrumbs ace-save-state" id="breadcrumbs">
					<ul class="breadcrumb">
						<li>
							<i class="ace-icon fa fa-home home-icon"></i>
							<a href="#">项目详情</a>
                            <input type="hidden" value="${(thisproject.id)?c}" id="currentProjectId">
						</li>

					</ul><!-- /.breadcrumb -->
				</div>

				<!-- /section:basics/content.breadcrumbs -->
                <div class="page-content">
                    <div class="row">
                        <div class="col-xs-12">
                            <div class="widget-box">
                                <div class="widget-body">
                                    <div class="widget-main">
                                        <div class="col-xs-50 input-box">
                                        <h4 >项目内容</h4>
                                        </div>
                                        </br>
                                        <blockquote>
                                        <div class="form-group">
                                            <div class="col-xs-50 input-box">
                                                <h5>名称:</h5>
                                                <blockquote>
                                                <div class="col-xs-50 input-box">
                                                    <span id="projectsName" style="display:inline-block;width:100%;word-wrap:break-word;white-space:normal; background-color: #f3f3f3">加载中...</span>
                                                    <a href="#" role="button" data-target="#projectsNameModal" data-toggle="modal" onclick="getProjectId();">修改</a>
                                                </div>
                                                    </blockquote>
                                            </div>
                                            <hr />
                                            <div class="col-xs-50 input-box">
                                                <h5>详情描述:</h5>
                                                <blockquote>
                                                <div class="col-xs-50 input-box">
                                                    <span id="projectsRemark" style="display:inline-block;width:100%;word-wrap:break-word;white-space:normal; background-color: #f3f3f3">加载中...</span>
                                                    <a href="#" role="button" data-target="#projectsRemarkModal" data-toggle="modal" onclick="getProjectId();">修改</a>
                                                </div>
                                                    </blockquote>
                                            </div>
                                            <hr />
                                            <div class="col-xs-50 input-box">
										        <h5>创建时间:</h5>
                                                <blockquote>
                                                <div class="col-xs-50 input-box">
                                                    <span id="projectsStart" style="display:inline-block;width:100%;word-wrap:break-word;background-color: #f3f3f3">加载中...</span>
                                                </div>
                                                    </blockquote>
                                            </div>
                                        </div>
                                            </blockquote>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div><!-- /.page-content -->

                    <div class="hr hr-18 dotted hr-double"></div>

                    <div class="row">
                        <div class="col-xs-12">
                            <div class="widget-box">
                                <div class="widget-body">
                                    <div class="widget-main">
                                        <h4>人员配置</h4>
                                        </br>
                                        <blockquote>
                                        <div class="form-group">
                                            <div class="col-xs-50 input-box">
                                                <h5>创建人:</h5>
                                                <blockquote>
                                                <div class="col-xs-50 input-box">
                                                    <span id="createMan" style="display:inline-block;width:100%;word-wrap:break-word;white-space:normal; background-color: #f3f3f3">加载中...</span>
                                                </div>
                                                    </blockquote>
                                            </div>
                                            <hr />
                                            <div class="col-xs-50 input-box">
                                                <h5>关联人员:</h5>
                                                <blockquote>
                                                <div class="col-xs-50 input-box">
                                                    <div id = "salesMans" style="display:inline-block;width:100%;word-wrap:break-word;white-space:normal; background-color: #f3f3f3">加载中...</div>
                                                    <a href="#" role="button" data-target="#projectsSalesDeleteForm" data-toggle="modal" onclick="getProjectId();">删除</a>
                                                    <a href="#" role="button" data-target="#projectsSalesAddForm" data-toggle="modal" onclick="getProjectId();">新增</a>
                                                </div>
                                                    </blockquote>
                                            </div>
                                            <hr />
                                            <div class="col-xs-50 input-box">
                                                <h5>客户对接人员:</h5>
                                                <blockquote>
                                                <div class="col-xs-50 input-box">
                                                    <div id="dockingMans" style="display:inline-block;width:100%;word-wrap:break-word;background-color: #f3f3f3">加载中...</div>
                                                    <a href="#" role="button" data-target="#projectsDockingDeleteForm" data-toggle="modal" onclick="getProjectId();">删除</a>
                                                    <a href="#" role="button" data-target="#projectsDockingAddModal" data-toggle="modal" onclick="getProjectId();">新增</a>
                                                </div>
                                                    </blockquote>
                                            </div>
                                        </div>
                                            </blockquote>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div><!-- /.page-content -->

                    <div class="hr hr-18 dotted hr-double"></div>

                    <div class="row">
                        <div class="col-xs-12">
                            <div class="widget-box">
                                <div class="widget-body">
                                    <div class="widget-main">
                                        <h4>跟踪记录 <a href="#" role="button" data-target="#projectsTracksAddForm" data-toggle="modal" onclick="getProjectId();"><font size="2" color="red">[新建]</font></a></h4>
                                        <!-- /section:basics/content.breadcrumbs -->
                                        <div class="page-content">
                                            <div class="row">
                                                <div class="col-xs-12">
                                                    <div class="row">
                                                        <div class="col-xs-12">
                                                            <table id="simple-table-tracks" class="table  table-bordered table-hover">
                                                                <thead>
                                                                <tr>
                                                                    <th class="center">编号</th>
                                                                    <th class="center">添加人</th>
                                                                    <th class="center">跟踪内容</th>
                                                                    <th class="center">创建时间</th>
                                                                    <th class="center">预期完成时间</th>
                                                                    <th class="center">当前状态</th>
                                                                    <th class="center">结果描述</th>
                                                                    <th class="center">结果</th>
                                                                    <th class="center">结束时间</th>
                                                                    <th class="center">编辑</th>
                                                                </tr>
                                                                </thead>
                                                                <tbody>

                                                                </tbody>
                                                                <tfoot></tfoot>
                                                            </table>
                                                        </div><!-- /.span -->
                                                    </div><!-- /.row -->
                                                    <!-- PAGE CONTENT ENDS -->
                                                </div><!-- /.col -->
                                            </div><!-- /.row -->
                                        </div><!-- /.page-content -->
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div><!-- /.page-content -->
                </div>
			</div>
		</div><!-- /.main-content -->

		<#include "../common/footer.ftl"/>
        <#include "projects_name_model.ftl"/>
        <#include "projects_remark_model.ftl"/>
        <#include "projects_sales_delete_model.ftl"/>
        <#include "projects_sales_add_model.ftl"/>
        <#include "projects_docking_delete_model.ftl"/>
        <#include "projects_docking_add_model.ftl"/>
        <#include "projects_tracks_add_model.ftl"/>
        <#include "projects_tracks_model.ftl"/>
    </div><!-- /.main-container -->
<#include "../common/footscripts.ftl"/>
<script type="text/javascript">
    var projectId = $('#currentProjectId').val();
    var projectsName;
    var projectsRemark;
	$(document).ready(function() {
        var table = $('#simple-table-tracks').DataTable({
            ajax: {
                url: "/trackingRecords/trackingRecordsList",
                type:"GET",
                //dataSrc : "list",//这个参数是自己封装的json里面的key
                data: {projectId:projectId}
            },
            serverSide : true,//开启服务器模式:启用服务器分页
            pageLength: 10,//每页显示十条数据
            bPaginate: false, //翻页功能
            bLengthChange: false, //改变每页显示数据数量
            bFilter: false, //过滤功能
            bSort: false, //排序功能
            Info: true,//页脚信息
            bAutoWidth: false,//自动宽度
            bJQueryUI: false,
            bStateSave : false,
            aLengthMenu: [[10, 25, 50], [10, 25, 100]],
            sDom: "<'row-fluid inboxHeader'<'span6'<'dt_actions'>l><'span6'f>r>t<'row-fluid inboxFooter'<'span6'i><'span6'p>>",
            oLanguage: {//下面是一些汉语翻译
                "sSearch": "搜索",
                "sLengthMenu": "每页显示 _MENU_ 条记录",
                "sZeroRecords": "没有检索到数据",
                "sInfo": "显示 _START_ 至 _END_ 条 &nbsp;&nbsp;共 _TOTAL_ 条",
                "sInfoFiltered": "(筛选自 _MAX_ 条数据)",
                "sInfoEmtpy": "没有数据",
                "sProcessing": "正在加载数据...",
                //"sProcessing": "<img src='{{rootUrl}}global/img/ajaxLoader/loader01.gif' />", //这里是给服务器发请求后到等待时间显示的 加载gif
                "oPaginate":
                {
                    "sFirst": "首页",
                    "sPrevious": "前一页",
                    "sNext": "后一页",
                    "sLast": "末页"
                }
            },
            columns: [ //这个属性下的设置会应用到所有列,按顺序没有是空
                {
                    "data": 'id',
                    "sClass" : "center"
                },
                {
                    "data": 'usersName',
                    "sDefaultContent" : "",
                    "sClass" : "center"
                },
                {
                    "data": 'content',
                    "sDefaultContent" : "",
                    "sClass" : "center"
                },
                {
                    "mDataProp": function (obj) {
                        return getMyDate(obj.startTime);
                    },
                    "sDefaultContent": "",
                    "sClass": "center"
                },
                {
                    "data": 'expectTimeStr',
                    "sDefaultContent" : "",
                    "sClass" : "center"
                },
                {
                    "data": 'state',
                    "sDefaultContent" : "",
                    "sClass" : "center"
                },
                {
                    "data": 'remark',
                    "sDefaultContent" : "",
                    "sClass" : "center"
                },
                {
                    "data": 'result',
                    "sDefaultContent" : "",
                    "sClass" : "center"
                },
                {
                    "mDataProp": function (obj) {
                        return getMyDate(obj.endTime);
                    },
                    "sDefaultContent": "",
                    "sClass": "center"
                },
                {
                    "data": 'id',
                    "sDefaultContent" : "",
                    "render": function (data, type, row, meta) {
                        return '<a href="#" role="button" class="btn btn-minier btn-white btn-info" data-target="#projectsTracksForm" data-toggle="modal" onclick="getId('+ '\'' + data + '\'' + ');">编辑</a>';
                    },
                    "sClass" : "center"
                }
            ],
            aoColumnDefs: [
                { "bVisible": false, "aTargets": [ 0 ] }
            ],
            bProcessing: true, //开启读取服务器数据时显示正在加载中……特别是大数据量的时候,开启此功能比较好
            sPaginationType: "full_numbers"

        });
		getProjectContent();
        getPersonnel();
    });
    function getProjectContent(){
        $.ajax({
            url: "/projects/projectContent",
            data:{projectId:projectId},
            type: "POST",
            dataType:'json',
            async : false,
            traditional: true,//这里设置为true
            success:function(data){
                projectsName= data.projectName;
                projectsRemark = data.remark;
                $("#projectsName").html(projectsName);
                $("#projectsRemark").html(projectsRemark);
                var date = new Date(data.startTime);
                var y = date.getFullYear();
                var m = date.getMonth() + 1;
                m = m < 10 ? ('0' + m) : m;
                var d = date.getDate();
                d = d < 10 ? ('0' + d) : d;
                var h = date.getHours();
                h = h < 10 ? ('0' + h) : h;
                var minute = date.getMinutes();
                var second = date.getSeconds();
                minute = minute < 10 ? ('0' + minute) : minute;
                second = second < 10 ? ('0' + second) : second;

                $("#projectsStart").html(y + '-' + m + '-' + d+' '+h+':'+minute+':'+second);
            }
        });
    }
    function getPersonnel(){
        $.ajax({
            url: "/projects/personnel",
            data:{projectId:projectId},
            type: "POST",
            dataType:'json',
            async : false,
            traditional: true,//这里设置为true
            success:function(data){
                $("#createMan").html("姓名: "+data.name+",  联系号码: "+data.mobile);
                if(data.personnelSales!= null) {
                    var salesMans = '';
                    for (let i = 0; i < data.personnelSales.length; i++) {
                        salesMans += "<div>姓名: " + data.personnelSales[i].name + ",  联系号码: " + data.personnelSales[i].mobile + "</div>"
                    }
                    $("#salesMans").html(salesMans);
                }else{
                    $("#salesMans").html("无联系人");
                }

                let dockingMans='';
                if(data.personnelDocking!= null) {
                    for (let j = 0; j < data.personnelDocking.length; j++) {
                        dockingMans += "<div>姓名: " + data.personnelDocking[j].name + ",  职务: " + data.personnelDocking[j].position + ",  性别: " + data.personnelDocking[j].gender + ",  联系号码: " + data.personnelDocking[j].mobile + "</div>";
                    }
                    $("#dockingMans").html(dockingMans);
                }else{
                    $("#dockingMans").html("无联系人");
                }
            }
        });
    }
    function getProjectId(){
        $("#mode_projectId").val(projectId);
        $("#mode_projectsName").val(projectsName);
        $("#mode_projectsRemark").val(projectsRemark);
    }
    function getId(id){
        alert(id);
        $("#mode_id").val(id);
    }
</script>
</body>
</html>