<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <meta name="format-detection" content="telephone=no"/>
    <title>精准导购系统企业号应用</title>
    <link rel="stylesheet" href="/static/css/wechat/weui.min.css"/>
    <link rel="stylesheet" type="text/css" href="/static/css/wechat/iconfont/iconfont.css"/>
    <link rel="stylesheet" href="/static/css/wechat/style.css">
</head>

<body ontouchstart>
<input type="hidden" id="userId" th:value="${userId}"/>
<input type="hidden" id="customerId" th:value="${customer.id}"/>
<input type="hidden" id="projectId" th:value="${customerProject.id}"/>

<header>
    <div class="header">
        <a href="javascript:history.go(-1);" class="btn-a-back"><i class="iconfont">&#xe61f;</i></a>
        <h2>中瑞星湖名堤第二次</h2>
    </div>
</header>

<!--弹出选择-->
<div class="weui-mask" id="iosMask" style="display: none"></div>
<div class="weui-actionsheet" id="recordedStatusSelect">
    <div class="weui-actionsheet__menu">
        <div class="weui-actionsheet__cell" filterValue="0">无效</div>
        <div class="weui-actionsheet__cell" filterValue="1">有效</div>
    </div>
</div>

<div class="weui-actionsheet" id="loanStatusSelect">
    <div class="weui-actionsheet__menu">
        <div class="weui-actionsheet__cell" filterValue="0">未办理</div>
        <div class="weui-actionsheet__cell" filterValue="1">申请中</div>
        <div class="weui-actionsheet__cell" filterValue="2">已下款</div>
        <div class="weui-actionsheet__cell" filterValue="3">被拒绝</div>
        <div class="weui-actionsheet__cell" filterValue="4">全款支付</div>
    </div>
</div>

<div class="weui-actionsheet" id="statusSelect">
    <div class="weui-actionsheet__menu">
        <div class="weui-actionsheet__cell" filterValue="1">约看</div>
        <div class="weui-actionsheet__cell" filterValue="2">到访</div>
        <div class="weui-actionsheet__cell" filterValue="3">认筹</div>
        <div class="weui-actionsheet__cell" filterValue="4">认购</div>
        <div class="weui-actionsheet__cell" filterValue="5">签约</div>
        <div class="weui-actionsheet__cell" filterValue="6">退房</div>
    </div>
</div>

<div class="weui-cells__title">基本信息</div>
<div class="weui-cells weui-cells_form">
    <div class="weui-cell">
        <div class="weui-cell__hd"><label class="weui-label">姓名</label></div>
        <div class="weui-cell__bd">
            <input id="customerName" class="weui-input" type="text" th:value="${customer.name}"/>
        </div>
    </div>
    <div class="weui-cell">
        <div class="weui-cell__hd"><label class="weui-label">手机号</label></div>
        <div class="weui-cell__bd">
            <input class="weui-input" type="tel" th:value="${customer.phone}" readonly="readonly"/>
        </div>
    </div>
    <div class="weui-cell">
        <div class="weui-cell__hd"><label class="weui-label">客户类型</label></div>
        <div class="weui-cell__bd" th:switch="${customer.customerSourceType}">
            <input class="weui-input" type="text" th:case="1" value="常规" readonly="readonly"/>
            <input class="weui-input" type="text" th:case="2" value="抢客" readonly="readonly"/>
            <input class="weui-input" type="text" th:case="3" value="营销" readonly="readonly"/>
        </div>
    </div>
    <div class="weui-cell">
        <div class="weui-cell__hd"><label class="weui-label">置业顾问</label></div>
        <div class="weui-cell__bd">
            <input class="weui-input" type="tel" th:value="${customer.managerName}" readonly="readonly"/>
        </div>
    </div>
</div>
<div class="weui-cells__title">意向信息</div>
<div class="weui-cells weui-cells_form">
    <div class="weui-cell">
        <div class="weui-cell__hd"><label class="weui-label">需求面积</label></div>
        <div class="weui-cell__bd">
            <input id="requireArea" class="weui-input" type="text" th:value="${customerProject.requireArea}"/>
        </div>
    </div>
    <div class="weui-cell">
        <div class="weui-cell__hd"><label class="weui-label">需求房号</label></div>
        <div class="weui-cell__bd">
            <input id="requireHouse" class="weui-input" type="num" th:value="${customerProject.requireHouse}"/>
        </div>
    </div>
    <div class="weui-cell">
        <div class="weui-cell__hd"><label class="weui-label">意向房型</label></div>
        <div class="weui-cell__bd">
            <input id="requireHouseType" class="weui-input" type="text" th:value="${customerProject.requireHouseType}"/>
        </div>
    </div>
    <div class="weui-cell">
        <div class="weui-cell__hd"><label class="weui-label">总价预算</label></div>
        <div class="weui-cell__bd">
            <input id="requirePrice" class="weui-input" type="num" th:value="${customerProject.requirePrice}"/>
        </div>
    </div>
</div>
<div class="weui-cells__title">案场状态信息</div>
<div class="weui-cells weui-cells_form">
    <div class="weui-cell">
        <div class="weui-cell__hd">
            <label for="" class="weui-label">案场顾问</label>
        </div>
        <div class="weui-cell__bd">
            <input id="consultantName" class="weui-input" type="text" th:value="${customerProject.consultantName}"/>
        </div>
    </div>
    <div class="weui-cell">
        <div class="weui-cell__hd">
            <label for="" class="weui-label">案场顾问电话</label>
        </div>
        <div class="weui-cell__bd">
            <input id="consultantPhone" class="weui-input" type="tel" th:value="${customerProject.consultantPhone}"/>
        </div>
    </div>
    <div class="weui-cell">
        <div class="weui-cell__hd">
            <label for="" class="weui-label">案场报备</label>
        </div>
        <input type="hidden" id="recordedStatus" th:value="${customerProject.recordedStatus}"/>
        <div class="weui-cell__bd" th:switch="${customerProject.recordedStatus}" onclick="selectStatus('1')">
            <input class="weui-input" id="recordedStatusName" type="text" th:case="0" value="无效" readonly="readonly"/>
            <input class="weui-input" id="recordedStatusName" type="text" th:case="1" value="有效" readonly="readonly"/>
            <input class="weui-input" id="recordedStatusName" type="text" th:case="*" value="待定" readonly="readonly"/>
        </div>
    </div>
    <div class="weui-cell">
        <div class="weui-cell__hd">
            <label for="" class="weui-label">贷款状态</label>
        </div>
        <input type="hidden" id="loanStatus" th:value="${customerProject.loanStatus}"/>
        <div class="weui-cell__bd" th:switch="${customerProject.loanStatus}" onclick="selectStatus('2')">
            <input class="weui-input" id="loanStatusName" type="text" th:case="0" value="未办理" readonly="readonly"/>
            <input class="weui-input" id="loanStatusName" type="text" th:case="1" value="申请中" readonly="readonly"/>
            <input class="weui-input" id="loanStatusName" type="text" th:case="2" value="已下款" readonly="readonly"/>
            <input class="weui-input" id="loanStatusName" type="text" th:case="3" value="被拒绝" readonly="readonly"/>
            <input class="weui-input" id="loanStatusName" type="text" th:case="4" value="全款支付" readonly="readonly"/>
            <input class="weui-input" id="loanStatusName" type="text" th:case="*" value="待定" readonly="readonly"/>
        </div>
    </div>
    <div class="weui-cell">
        <div class="weui-cell__hd">
            <label for="" class="weui-label">客户状态</label>
        </div>
        <input type="hidden" id="status" th:value="${customerProject.status}"/>
        <div class="weui-cell__bd " th:switch="${customerProject.status}" onclick="selectStatus('3')">
            <input class="weui-input" id="statusName" type="text" th:case="1" value="约看" readonly="readonly"/>
            <input class="weui-input" id="statusName" type="text" th:case="2" value="到访" readonly="readonly"/>
            <input class="weui-input" id="statusName" type="text" th:case="3" value="认筹" readonly="readonly"/>
            <input class="weui-input" id="statusName" type="text" th:case="4" value="认购" readonly="readonly"/>
            <input class="weui-input" id="statusName" type="text" th:case="5" value="签约" readonly="readonly"/>
            <input class="weui-input" id="statusName" type="text" th:case="6" value="退房" readonly="readonly"/>
            <input class="weui-input" id="statusName" type="text" th:case="*" value="待定" readonly="readonly"/>
        </div>
    </div>
    <div class="weui-cell">
        <div class="weui-cell__hd">
            <label for="" class="weui-label">到访次数</label>
        </div>
        <div class="weui-cell__bd">
            <input class="weui-input" type="num" th:value="${customerProject.visitTime}" readonly="readonly"/>
        </div>
    </div>
    <a class="weui-cell weui-cell_access"
       th:href="@{/project/modifyremark(customerId=${customer.id},
       customerProjectId=${customerProject.id},remark=${customerProject.remark})}">
        <div class="weui-cell__hd"><label class="weui-label">备注信息</label></div>
        <div class="weui-cell__bd">
            <input class="weui-input" type="text"
                   th:value="${customerProject.remark}"
                   readonly="readonly"/>
        </div>
        <div class="weui-cell__ft"></div>
    </a>
    <a class="weui-cell weui-cell_access bg-gray gray"
       th:href="@{/project/statuschangelogs(customerId=${customer.id},projectId=${customerProject.projectId})}">
        <div class="weui-cell__bd">
            <p>状态变更记录</p>
        </div>
        <div class="weui-cell__ft"></div>
    </a>
    <!--<a class="weui-cell weui-cell_access bg-gray gray" href="状态变更记录.html">-->
    <!--<div class="weui-cell__bd">-->
    <!--<p>状态变更记录</p>-->
    <!--</div>-->
    <!--<div class="weui-cell__ft"></div>-->
    <!--</a>-->
</div>
<div class="p40">
    <a class="weui-btn weui-btn_blue" href="javascript:" id="showToast">保存</a>
</div>

<!--提交成功提示-->
<div id="toast" style="display: none;">
    <div class="weui-mask_transparent"></div>
    <div class="weui-toast">
        <i class="weui-icon-success-no-circle weui-icon_toast"></i>
        <p class="weui-toast__content">提交成功</p>
    </div>
</div>
</body>
<script type="text/javascript" src="/static/js/jquery.min.js"></script>
<script type="text/javascript" src="/static/js/statistics.js"></script>
<script type="text/javascript">
    $(function () {
        $('#showToast').on('click', function () {
            saveCustomerProject();
        });
    });

    function saveCustomerProject() {
        $.ajax({
            url: "/project/reportcustomer",
            data: {
                userId: $("#userId").val(),
                customerId: $("#customerId").val(),
                projectId: $("#projectId").val(),
                customerName: $("#customerName").val(),
                consultantName: $("#consultantName").val(),
                consultantPhone: $("#consultantPhone").val(),
                recordedStatus: $("#recordedStatus").val(),
                loanStatus: $("#loanStatus").val(),
                requireArea: $("#requireArea").val(),
                requireHouse: $("#requireHouse").val(),
                requireHouseType: $("#requireHouseType").val(),
                requirePrice: $("#requirePrice").val()
            },
            type: "post",
            success: function (data) {
                if (data.result == "1") {
                    // 提交成功提示
                    var $toast = $('#toast');
                    if ($toast.css('display') != 'none') return;

                    $toast.fadeIn(100);
                    setTimeout(function () {
                        $toast.fadeOut(100);
                    }, 2000);
                }
            }
        });
    }

    function selectStatus(_type) {
        var $iosMask = $('#iosMask');

        function hideActionSheet($this) {
            $this.removeClass('weui-actionsheet_toggle');
            $iosMask.fadeOut(200);
        }

        var $selectFilter;
        switch (_type) {
            case "1":
                $selectFilter = $('#recordedStatusSelect');
                break;
            case "2":
                $selectFilter = $('#loanStatusSelect');
                break;
            case "3":
                $selectFilter = $('#statusSelect');
                break;
            default:
                break;
        }
        $selectFilter.addClass('weui-actionsheet_toggle');
        $iosMask.fadeIn(200);
        $iosMask.on('click', function () {
            hideActionSheet($selectFilter)
        });
        $('.weui-actionsheet__cell').on('click', function () {
            var filterId = $(this).parents(".weui-actionsheet").attr("id");
            var key = filterId.substring(0, filterId.indexOf("Select"));
            var value = $(this).attr("filterValue");
            $("#" + key).val(value);
            $("#" + key + "Name").val($(this).html());
            hideActionSheet($selectFilter)
        });
    }
</script>
</html>
