puti
/
snd-escloud


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993
							<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
      layout:decorate="~{admin/common/common}">
<head>
    <title>编辑内容</title>
</head>

<body layout:fragment="content">
<style>
    .col-sm-2 {
        width: 13.666667%
    }

    .error {
        text-align: left !important;
        display: block;
    }

    .width-180 {
        width: 180px
    }

    .width-80 {
        width: 80px
    }

    .width-25 {
        width: 25px
    }

    .btn-primary {
        margin-top: 10px
    }

    .line {
        display: block;
        text-align: left;
        background-color: #fff;
        color: #333;
        border-bottom: 1px solid #0a6999;
        border-color: #fff;
        border-bottom: 1px solid #0a6999;
        margin-top: 10px;
        vertical-align: middle;
        padding: 4px 12px;
        height: 31px;
        line-height: 31px;
        font-size: 14px;
        font-weight: bold;
    }

    .margin-top-10 {
        margin-top: 10px;
    }
</style>
<article class="page-container">
    <form class="form form-horizontal" id="form-contract-edit">
        <input type="hidden" name="is_tenancy" id="is_tenancy" th:value="${contract.is_tenancy}"/>
        <input type="hidden" name="is_property" id="is_property" th:value="${contract.is_property}"/>
        <input type="hidden" name="is_parking" id="is_parking" th:value="${contract.is_parking}"/>
        <input type="hidden" name="is_water" id="is_water" th:value="${contract.is_water}"/>
        <input type="hidden" name="is_electric" id="is_electric" th:value="${contract.is_electric}"/>
        <div class="line">基本信息</div>
        <input type="hidden" th:id="contract_id" th:name="contract_id" th:value="${contract.id}"/>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>合同编号：</label>
            <div class="formControls col-xs-8 col-sm-4">
                <input type="text" required
                       maxlength="45" class="input-text readonly "  th:name="contract_no"
                       th:value="${contract.contract_no}" disabled/>
            </div>

            <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>企业名称：</label>
            <div class="formControls col-xs-8 col-sm-4">
                <input type="text" style="width:74%" required placeholder="点击查找按钮查找公司"
                       maxlength="45" class="input-text readonly " id="company_name" th:name="company_name"
                       th:value="${contract.company_name}" disabled/>
                <input type="hidden" th:name="company_id" th:value="${contract.company_id}"/>
            </div>
        </div>

        <div class="row cl" th:each="companyContact,iterStat:${contract.companyContacts}" th:object="${companyContact}">
            <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>联系人：</label>
            <div class="formControls col-xs-8 col-sm-4">
                <input type="text" class="input-text readonly" required maxlength="45" disabled
                       th:value="*{contact}"/>
            </div>

            <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>联系电话：</label>
            <div class="formControls col-xs-8 col-sm-4">
                <input type="text" class="input-text readonly" required maxlength="45" disabled
                       th:value="*{phone}"/>

            </div>
        </div>


        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>合同生效日：</label>
            <div class="formControls col-xs-8 col-sm-4">
                <input type="text" th:name="contract_start_date" disabled
                       th:value="${contract.contract_start_date}"
                       id="datemin" class="input-text readonly">
            </div>

            <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>合同到期日：</label>
            <div class="formControls col-xs-8 col-sm-4">
                <input type="text" th:name="contract_end_date" disabled th:value="${contract.contract_end_date}"
                       id="datemax" class="input-text readonly">
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>单位地址：</label>
            <div class="formControls col-xs-8 col-sm-4">
                <input type="text" class="input-text readonly" disabled maxlength="45" th:name="location"
                       th:value="${contract.location}"/>
            </div>

            <!-- <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>经营范围：</label>
            <div class="formControls col-xs-8 col-sm-4">
                <input type="text" class="input-text" required  maxlength="45" th:name="business" th:value="${contract.business}"/>

            </div> -->
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2"><span>合同上传：</span></label>
            <div class="formControls col-xs-8 col-sm-9">
                <div class="uploader-thum-container">
                    <div id="fileListPre" class="uploader-list">
                        <th:block th:unless="${contract.fileDown.file_url} == null">
                            <a th:href="${fileUrl} + ${contract.fileDown.file_url}" target="_blank">[[${contract.fileDown.file_name}]]</a>
                        </th:block>
                    </div>
                    <input type="hidden" name="file_url" id="img" th:value="${contract.fileDown.file_url}"/>
                </div>
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2">备注：</label>
            <div class="formControls col-xs-8 col-sm-9">
            	<textarea name="" cols="" rows="" th:name="remark" disabled class="textarea readonly"
                          placeholder="说点什么..."
                          dragonfly="true" onKeyUp="$.Huitextarealength(this,200)">[[${contract.remark}]]</textarea>
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2">选择需要填写的模块：</label>
            <input type="checkbox" class="type is_tenancy" value="1" th:checked="${contract.is_tenancy}" th:text="房屋租赁"
                   onclick="selectModal(this)">
            <input type="checkbox" class="type is_water" value="2" th:checked="${contract.is_water}" th:text="水费"
                   onclick="selectModal(this)">
            <input type="checkbox" class="type is_electric" value="3" th:checked="${contract.is_electric}" th:text="电费"
                   onclick="selectModal(this)">
            <input type="checkbox" class="type is_property" value="4" th:checked="${contract.is_property}" th:text="物业费"
                   onclick="selectModal(this)">
            <input type="checkbox" class="type is_parking" value="5" th:checked="${contract.is_parking}" th:text="停车费"
                   onclick="selectModal(this)">
        </div>

        <div id="tenancy_fee">
            <div class="line">房屋租赁</div>
            <div class="row cl">
                <div class="formControls col-xs-8 col-sm-12">
                    <div id="tenancy_fee_add"><i class="Hui-iconfont" onclick="addFloorLine()">&#xe600;</i></div>

                    <table class="table table-border table-bordered table-bg table-hover">
                        <thead>
                        <tr class="text-c">
                            <th>楼栋</th>
                            <th>层</th>
                            <th>可用面积(平方米)</th>
                            <th>面积(平方米)</th>
                            <th>单价(元/月/平方米)</th>
                            <th>备注</th>
                            <!-- <th width="100">操作</th> -->
                        </tr>
                        </thead>
                        <tbody class="add_floor_line">
                        <tr class="text-c ">
                            <td>
                                <div class="formControls col-sm-12 text-left">
                            <span class="select-box">
                                <input type="hidden" class="floor_id" th:name="buildLives[0].floor_id"/>
                                    <select class="select build_number" th:name="buildLives[0].build_number"
                                            onchange="setAttr(this);">
                                        <option value="">--请选择--</option>
                                        <option th:attr="floor_id=${item.id}"
                                                th:each="item : ${buildings}" th:value="${item.build_number}"
                                                th:text="${item.build_number}">
                                        </option>
                                    </select>
                            </span>
                                </div>
                            </td>
                            <td>
                                <div class="formControls col-sm-12 text-left">
                             <span class="select-box">
                                <select class="select floor" th:name="buildLives[0].floor"
                                        onchange="setAreaPrice(this);">
                                    <option value="">--请选择--</option>
                                </select>
                             </span>
                                </div>
                            </td>
                            <td>
                                <div class="formControls col-sm-12 text-left">
                                    <span class=" remain_area"></span>
                                </div>
                            </td>
                            <td>
                                <div class="formControls col-sm-12 text-left">
                                    <input type="text" class="input-text use_area" number="true"
                                           min="0" max="99999.9999" th:name="buildLives[0].use_area"
                                           onchange="getPaidFee();getTotalArea();"/>
                                </div>
                            </td>
                            <td>
                                <div class="formControls col-sm-12 text-left">
                                    <input type="text" class="input-text pay" max="999.99" number="true"
                                           min="0"
                                           th:name="buildLives[0].pay" onchange="getPaidFee()"/>
                                </div>
                            </td>
                            <td>
                                <div class="formControls col-sm-12 text-left">
                                    <input type="text" class="input-text remarks" maxlength="255"
                                           th:name="buildLives[0].remarks"/>
                                </div>
                            </td>
                            <!-- <td class="icon_font"></td> -->
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>已收房租：</label>
                <div class="formControls col-xs-8 col-sm-4">
                    <div class="col-sm-6 nopadding">
                        <input type="text" class="input-text width-180" style="width:50%" th:id="paid_tenancy_month"
                               digits="true"
                               th:name="paid_tenancy_month" maxlength="2" th:value="${contract.paid_tenancy_month}"
                               onchange="getPaidFee()"/><span> 个月，</span>
                    </div>
                    <div class="col-sm-6 nopadding">
                        <span>共</span>
                        <input type="text" class="input-text width-180 disabled" disabled="disabled" style="width:74%"
                               th:id="paid_tenancy" maxlength="20" number="true" min="0"
                               th:name="paid_tenancy" th:value="${contract.paid_tenancy}"/><span
                            style="margin-left:3px"> 元</span>
                    </div>
                </div>
                <label class="form-label col-xs-4 col-sm-2">总面积(m²)：</label>
                <div class="formControls col-xs-8 col-sm-4">
                    <input type="hidden" th:name="area" id="area"/>
                    <span id="total_area">[[${contract.area}]]</span>
                </div>

            </div>
            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>押金(元)：</label>
                <div class="formControls col-xs-8 col-sm-4">
                    <input type="text" class="input-text" maxlength="10" number="true" min="0" max="99999.9999"
                           th:name="deposit_fee" th:value="${contract.deposit_fee}" onchange="isfloat2Fn(value)"/>
                </div>
                <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>收款周期：</label>
                <div class="formControls col-xs-8 col-sm-4">
                    <input type="text" class="input-text width-180" th:id="tenancy_payment_cycle"
                           th:value="${contract.tenancy_payment_cycle}"
                           th:name="tenancy_payment_cycle"/><span>月一次</span>
                </div>
            </div>
        </div>

        <div id="water_fee">
            <div class="line">水费</div>
            <div class="row cl">

                <div class="formControls col-xs-8 col-sm-12">
                    <div id="water_fee_add"><i class="Hui-iconfont hand" onclick="addWaterLine()">&#xe600;</i></div>
                    <table class="table table-border table-bordered table-bg table-hover">
                        <thead>
                        <tr class="text-c">
                            <th>水表</th>
                            <th>初始读数</th>
                            <th class="width-25">操作</th>
                        </tr>
                        </thead>
                        <tbody class="add_water_line">
                        <tr class="text-c " th:if="${#lists.isEmpty(contractWaters)}">
                            <td>
                                <div class="formControls col-sm-12 text-left">
                                    <select id="water_select_0" class="water_select"
                                            th:name="contractWaterList[0].water_id" onchange="checkWaterName(this)">
                                        <option value="">--请选择--</option>
                                        <option th:each="item : ${waters}" th:attr="is_common=${item.is_common}"
                                                th:value="${item.id}">
                                            [[*{item.name}]]  <span class="ml_5" th:if="${item.is_common}">共用</span>
                                        </option>
                                    </select>
                                </div>
                            </td>
                            <td>
                                <div class="formControls col-sm-12 text-left">
                                    <input type="text" class="input-text start_water_meter_count"
                                           maxlength="10" number="true" min="0"
                                           th:name="contractWaterList[0].start_water_meter_count"/>
                                </div>
                            </td>
                            <!-- <td><input type="text" class="input-text water_price"
                                        maxlength="20" number="true" min="0" th:name="contractWaterList[0].water_price"/></td> -->
                            <td class="icon_font"></td>
                        </tr>
                        <tr class="text-c " th:unless="${#lists.isEmpty(contractWaters)}"
                            th:each="water,iterStat : ${contractWaters}" th:object="${water}">
                            <td>
                                <div class="formControls col-sm-12 text-left">
                                    <select th:id="'water_select_'+${iterStat.index}" class="water_select"
                                            th:name="'contractWaterList['+${iterStat.index}+'].water_id'"
                                            onchange="checkWaterName(this)">
                                        <option value="">--请选择--</option>
                                        <option th:each="item : ${waters}" th:attr="is_common=${item.is_common}"
                                                th:value="${item.id}" th:selected="${item.id}==*{water_id}">
                                            [[${item.name}]]  <span class="ml_5" th:if="${item.is_common}">共用</span>
                                        </option>
                                    </select>
                                </div>
                            </td>
                            <td>
                                <div class="formControls col-sm-12 text-left">
                                    <input type="text" class="input-text start_water_meter_count"
                                           maxlength="10" number="true" min="0" th:value="*{start_water_meter_count}"
                                           th:name="'contractWaterList['+${iterStat.index}+'].start_water_meter_count'"/>
                                </div>
                            </td>
                            <td class="icon_font"></td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>

        <div id="electric_fee">
            <div class="line">电费</div>
            <div class="row cl">

                <div class="formControls col-xs-8 col-sm-12">
                    <div id="electric_fee_add"><i class="Hui-iconfont hand" onclick="addElectricLine()">&#xe600;</i>
                    </div>
                    <table class="table table-border table-bordered table-bg table-hover">
                        <thead>
                        <tr class="text-c">
                            <th>电表</th>
                            <th>初始读数</th>
                            <th>初始峰值读数</th>
                            <th>初始平峰读数</th>
                            <th>初始谷值读数</th>
                            <th class="width-25">操作</th>
                        </tr>
                        </thead>
                        <tbody class="add_electric_line">
                        <tr th:if="${#lists.isEmpty(contractElectrics)}" class="text-c ">
                            <td>
                                <div class="formControls col-sm-12 text-left">
                                    <select id="electric_select_0" class="electric_select"
                                            th:name="contractElectrics[0].electric_id"
                                            onchange="checkElectricName(this)">
                                        <option value="">--请选择--</option>
                                        <option th:each="item : ${electrics}"
                                                th:attr="is_common=${item.is_common},is_peak=${item.is_peak}"
                                                th:value="${item.id}">
                                            [[${item.name}]]  <span class="ml_5" th:if="${item.is_peak}">峰平谷值电表</span>
                                            <span class="ml_5" th:unless="${item.is_peak}">通用电表</span><span class="ml_5" th:if="${item.is_common}">共用</span>
                                        </option>
                                    </select>
                                </div>
                            </td>

                            <td class="commonElectric">
                                <div class="formControls col-sm-12 text-left">
                                    <input type="text" class="input-text start_electric_meter_count"
                                           maxlength="10" number="true" min="0"
                                           th:name="contractElectrics[0].start_electric_meter_count"/>
                                </div>
                            </td>
                            <td class="peakValleyElectric">
                                <div class="formControls col-sm-12 text-left">
                                    <input type="text" class="input-text start_electric_peak_count"
                                           disabled number="true" min="0" max="99999.9999"
                                           th:name="contractElectrics[0].start_electric_peak_count"
                                           onchange="isfloat4Fn(value)"/>
                                </div>
                            </td>
                            <td class="peakValleyElectric">
                                <div class="formControls col-sm-12 text-left">
                                    <input type="text" class="input-text start_electric_flat_count"
                                           disabled number="true" min="0" max="99999.9999"
                                           th:name="contractElectrics[0].start_electric_flat_count"
                                           onchange="isfloat4Fn(value)"/>
                                </div>
                            </td>
                            <td class="peakValleyElectric">
                                <div class="formControls col-sm-12 text-left">
                                    <input type="text" class="input-text start_electric_valley_count"
                                           disabled number="true" min="0" max="99999.9999"
                                           th:name="contractElectrics[0].start_electric_valley_count"
                                           onchange="isfloat4Fn(value)"/>
                                </div>
                            </td>
                            <!-- <td><input type="text" class="input-text electric_price"
                                        maxlength="20" number="true" min="0"  th:name="contractElectrics[0].electric_price"/></td>
                             -->
                            <td class="icon_font"></td>
                        </tr>
                        <tr class="text-c " th:unless="${#lists.isEmpty(contractElectrics)}"
                            th:each="electric,iterStat : ${contractElectrics}" th:object="${electric}">
                            <td>
                                <div class="formControls col-sm-12 text-left">
                                    <select th:id="'electric_select_'+${iterStat.index}" class="electric_select"
                                            th:name="'contractElectrics['+${iterStat.index}+'].electric_id'"
                                            onchange="checkElectricName(this)">
                                        <option value="">--请选择--</option>
                                        <option th:each="item : ${electrics}" th:selected="${item.id}==*{electric_id}"
                                                th:attr="is_common=${item.is_common},is_peak=${item.is_peak}"
                                                th:value="${item.id}">
                                            [[${item.name}]]  <span class="ml_5" th:if="${item.is_peak}">峰平谷值电表</span>
                                            <span class="ml_5" th:unless="${item.is_peak}">通用电表</span><span class="ml_5" th:if="${item.is_common}">共用</span>
                                        </option>
                                    </select>
                                </div>
                            </td>

                            <td class="commonElectric">
                                <div class="formControls col-sm-12 text-left">
                                    <input type="text" class="input-text start_electric_meter_count"
                                           maxlength="10" number="true" min="0" th:value="*{start_electric_meter_count}"
                                           th:name="'contractElectrics['+${iterStat.index}+'].start_electric_meter_count'"/>
                                </div>
                            </td>
                            <td class="peakValleyElectric">
                                <div class="formControls col-sm-12 text-left">
                                    <input type="text" class="input-text start_electric_peak_count"
                                           disabled number="true" min="0" max="99999.9999"
                                           th:value="*{start_electric_peak_count}"
                                           th:name="'contractElectrics['+${iterStat.index}+'].start_electric_peak_count'"
                                           onchange="isfloat4Fn(value)"/>
                                </div>
                            </td>
                            <td class="peakValleyElectric">
                                <div class="formControls col-sm-12 text-left">
                                    <input type="text" class="input-text start_electric_flat_count"
                                           disabled number="true" min="0" max="99999.9999"
                                           th:value="*{start_electric_flat_count}"
                                           th:name="'contractElectrics['+${iterStat.index}+'].start_electric_flat_count'"
                                           onchange="isfloat4Fn(value)"/>
                                </div>
                            </td>
                            <td class="peakValleyElectric">
                                <div class="formControls col-sm-12 text-left">
                                    <input type="text" class="input-text start_electric_valley_count"
                                           disabled number="true" min="0" max="99999.9999"
                                           th:value="*{start_electric_valley_count}"
                                           th:name="'contractElectrics['+${iterStat.index}+'].start_electric_valley_count'"
                                           onchange="isfloat4Fn(value)"/>
                                </div>
                            </td>
                            <td class="icon_font"></td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <div id="property_fee">
            <div class="line">物业费用</div>
            <div class="row cl">
                <div class="formControls col-xs-8 col-sm-12">
                    <table class="table table-border table-bordered table-bg table-hover">
                        <thead>
                        <tr class="text-c">
                            <th>费用项</th>
                            <th>价格</th>
                            <th>面积</th>
                            <th>收款周期</th>
                            <th width="300">说明</th>
                        </tr>
                        </thead>
                        <tbody>

                        <tr class="text-c">
                            <td>
                                物业费
                            </td>
                            <td>
                                <div class="formControls col-sm-12 text-left">
                                    <input type="text" class="input-text  width-80" number="true" min="0"
                                           max="99999.9999" th:value="${property.price}"
                                           th:name="contractProperty.price"
                                           onchange="isfloat4Fn(value)"/>元/月/平方米
                                </div>
                            </td>
                            <td>
                                <div class="formControls col-sm-12 text-left">
                                    <input type="text" class="input-text  width-80" maxlength="10" number="true"
                                           min="0" th:value="${property.number}" th:name="contractProperty.number"/>/平方米
                                </div>
                            </td>
                            <td>
                                <div class="formControls col-sm-12 text-left">
                                    <input type="text" class="input-text width-80" digits="true" range="[1,12]"
                                           th:name="contractProperty.payment_cycle"
                                           th:value="${property.payment_cycle}"/><span>月一次</span>
                                </div>
                            </td>
                            <td>
                                <div class="formControls col-sm-12 text-left">
                                    <input type="text" class="input-text" maxlength="45"
                                           th:name="contractProperty.remarks" th:value="${property.remarks}"/>
                                </div>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <div id="parking_fee">
            <div class="line">停车费用</div>
            <div class="row cl">
                <div class="formControls col-xs-8 col-sm-12">
                    <!-- <div><i class="Hui-iconfont" onclick="addParkingLine()">&#xe600;</i></div>  -->
                    <table class="table table-border table-bordered table-bg table-hover">
                        <thead>
                        <tr class="text-c">
                            <th>费用项</th>
                            <th>价格</th>
                            <th>数量</th>
                            <th>收款周期</th>
                            <th width="300">说明</th>
                            <!--<th>操作</th>-->
                        </tr>
                        </thead>

                        <tbody class="add_parking_line">
                        <tr class="text-c ">
                            <td>
                                停车费
                            </td>
                            <td>
                                <div class="formControls col-sm-12 text-left">
                                    <input type="text" class="input-text  width-80 price" number="true" min="0"
                                           max="99999.9999" th:name="contractParking.price" th:value="${parking.price}"
                                           onchange="isfloat4Fn(value)"/>元/月/个
                                </div>
                            </td>
                            <td>
                                <div class="formControls col-sm-12 text-left">
                                    <input type="text" class="input-text  width-80 number" maxlength="10"
                                           number="true" min="0" th:name="contractParking.number"
                                           th:value="${parking.number}"/>/个
                                </div>
                            </td>
                            <td>
                                <div class="formControls col-sm-12 text-left">
                                    <input type="text" class="input-text width-80 payment_cycle" digits="true"
                                           range="[1,12]"
                                           th:name="contractParking.payment_cycle"
                                           th:value="${parking.payment_cycle}"/><span>月一次</span>
                                </div>
                            </td>
                            <td>
                                <div class="formControls col-sm-12 text-left">
                                    <input type="text" class="input-text remarks" maxlength="45"
                                           th:name="contractParking.remarks" th:value="${parking.remarks}"/>
                                </div>
                            </td>
                            <!--<td class="icon_font"><i class='Hui-iconfont' onclick='removeLine(this)'>&#xe6a1;</i></td>-->
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>缴费日期前</label>
            <div class="formControls col-xs-8 col-sm-4">
                <input type="text" class="input-text width-180 readonly" required disabled th:id="remind_day" th:value="${contract.remind_day}"
                       th:name="remind_day"/><span>天提醒</span>
            </div>
        </div>

        <div class="row cl">
            <div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-2">
                <button class="btn btn-primary radius" type="submit"><i class="Hui-iconfont">&#xe632;</i> 保存
                </button>
                <button onClick="removeIframe();" class="btn margin-top-10 btn-default radius" type="button">&nbsp;&nbsp;取消&nbsp;&nbsp;</button>
            </div>
        </div>
    </form>
</article>
<script type="text/javascript" th:src="@{/js/build/contract/contract_edit_modal.js}"></script>
<script th:inline="javascript">

    $("#electric_fee").hide();
    $("#water_fee").hide();
    $("#property_fee").hide();
    $("#parking_fee").hide();
    $("#tenancy_fee").hide();

    var options = {
        uploadBtnId: '#filePicker',
        picturePreId: 'fileListPre',
        hiddenPictureUrl: 'img',
        hiddenPictureName: 'imgName',
//        accept : {
//            title : 'Images',
//            extensions : 'gif,jpg,jpeg,bmp,png',
//            mimeTypes : 'image/gif,image/jpg,image/jpeg,image/bmp,image/png'
//        },
        width: 81,
        height: 81,
        fileSizeLimit: 100 * 1024 * 1024,
        fileSingleSizeLimit: 100 * 1024 * 1024
//		fileNumLimit: 1
    };

    var webUploadPicture = new $WebUploadDoc(options);
    webUploadPicture.init();

    $(document).ready(function () {
        initDisabled();
        $(".water_select").each(function (index, obj) {
            initWaterSelect(index);
        });
        $(".electric_select").each(function (index, obj) {
            initElectricSelect(index);
        });
    });

    function initDisabled() {
        if ($("input[name='is_tenancy']").val() == 'true') {
            $(".is_tenancy").attr("disabled", "disabled");
            $(".is_tenancy").addClass("disabled", "disabled");
            $("#tenancy_fee").show();
            $("#tenancy_fee").find("input").attr("disabled", "disabled").addClass("disabled", "disabled").end()
                .find("select").attr("disabled", "disabled").addClass("disabled", "disabled").end()
                .find("#tenancy_fee_add").hide();
        }
        if ($("input[name='is_water']").val() == 'true') {
            $(".is_water").attr("disabled", "disabled");
            $(".is_water").addClass("disabled", "disabled");
            $("#water_fee").show();
            $("#water_fee").find("input").attr("disabled", "disabled").addClass("disabled", "disabled").end()
                .find("select").attr("disabled", "disabled").addClass("disabled", "disabled").end()
                .find("#water_fee_add").hide();
        }
        if ($("input[name='is_electric']").val() == 'true') {
            $(".is_electric").attr("disabled", "disabled");
            $(".is_electric").addClass("disabled", "disabled");
            $("#electric_fee").show();
            $("#electric_fee").find("input").attr("disabled", "disabled").addClass("disabled", "disabled").end()
                .find("select").attr("disabled", "disabled").addClass("disabled", "disabled").end()
                .find("#electric_fee_add").hide();
        }
        if ($("input[name='is_property']").val() == 'true') {
            $(".is_property").attr("disabled", "disabled");
            $(".is_property").addClass("disabled", "disabled");
            $("#property_fee").show();
            $("#property_fee").find("input").attr("disabled", "disabled").addClass("disabled", "disabled").end()
                .find("select").attr("disabled", "disabled").addClass("disabled", "disabled").end()
        }
        if ($("input[name='is_parking']").val() == 'true') {
            $(".is_parking").attr("disabled", "disabled");
            $(".is_parking").addClass("disabled", "disabled");
            $("#parking_fee").show();
            $("#parking_fee").find("input").attr("disabled", "disabled").addClass("disabled", "disabled").end()
                .find("select").attr("disabled", "disabled").addClass("disabled", "disabled").end()
        }
    }
    function initWaterSelect(index) {
        $("#water_select_" + index).select2({
            width: '150px',
            language: {
                noResults: function (params) {
              	  return "暂无数据";
                }
           }
        });
    }
    function initElectricSelect(index) {
        $("#electric_select_" + index).select2({
            width: '150px',
            language: {
                noResults: function (params) {
              	  return "暂无数据";
                }
           }
        });
    }
    /**
     * 取消
     */
    function removeIframe() {
        var index = parent.layer.getFrameIndex(window.name);
        parent.layer.close(index);
    }

    $(function () {
        // 日期表单初始化
        laydate.render({
            elem: '#datemax'
        });
        laydate.render({
            elem: '#datemin'
        });

        addFloorLine([[${buildLives}]]);
    });

    function addFloorLine(buildLives) {
        if (buildLives.length!=0) {
            for (var i = 0; i < buildLives.length; i++) {
                var length = i;
                var html = "<i class='Hui-iconfont' onclick='removeLine(this)'>&#xe6a1;</i>";
                $(".add_floor_line  tr:eq(0)").clone().insertAfter($('.add_floor_line>tr').eq(-1))
                    .find(".floor_id").removeAttr("name").attr("name", "buildLives[" + i + "].floor_id").val(buildLives[i].floor_id).end()
                    .find(".build_number").removeAttr("name").attr("name", "buildLives[" + i + "].build_number").val(buildLives[i].build_number).end()
                    .find(".floor").removeAttr("name").attr("name", "buildLives[" + i + "].floor").val(buildLives[i].floor).end()
                    .find(".use_area").removeAttr("name").attr("name", "buildLives[" + i + "].use_area").val(buildLives[i].use_area).end()
                    .find(".pay").removeAttr("name").attr("name", "buildLives[" + i + "].pay").val(buildLives[i].pay).end()
                    .find(".remarks").removeAttr("name").attr("name", "buildLives[" + i + "].remarks").val(buildLives[i].remarks).end();
                    //.find(".icon_font").html(html).end();
                $('#layui-layer2').height(48);
                //给楼栋楼层赋值
                setAttr($(".add_floor_line tr:eq(" + (1 + length) + ")").find(".build_number"), buildLives[i].floor);
            }
            $(".add_floor_line tr:eq(0)").remove();
        }
    }

    function addElectricLine() {
        var length = $(".add_electric_line  tr").length;
        var html = "<i class='Hui-iconfont' onclick='removeLine(this)'>&#xe6a1;</i>";
        $(".add_electric_line  tr:eq(0)").clone().insertAfter($('.add_electric_line>tr').eq(-1))
            .find(".start_electric_meter_count").removeAttr("name").attr("name", "contractElectrics[" + length + "].start_electric_meter_count").val("").end()
            .find(".start_electric_peak_count").removeAttr("name").attr("name", "contractElectrics[" + length + "].start_electric_peak_count").val("").end()
            .find(".start_electric_flat_count").removeAttr("name").attr("name", "contractElectrics[" + length + "].start_electric_flat_count").val("").end()
            .find(".start_electric_valley_count").removeAttr("name").attr("name", "contractElectrics[" + length + "].start_electric_valley_count").val("").end()
            .find(".electric_select").removeAttr("name").removeAttr("id").attr("name", "contractElectrics[" + length + "].electric_id")
            .attr("id", "electric_select_" + length).end()
            .find("span").remove().end()
            .find(".icon_font").html(html).end();
        var waterLength = $(".add_water_line  tr").length;
        if (length >= waterLength) {
            $('#layui-layer2').height(48);
        }
        initElectricSelect(length);
    }

    function addWaterLine() {
        var length = $(".add_water_line  tr").length;
        var html = "<i class='Hui-iconfont' onclick='removeLine(this)'>&#xe6a1;</i>";
        $(".add_water_line  tr:eq(0)").clone().insertAfter($('.add_water_line>tr').eq(-1))
            .find(".start_water_meter_count").removeAttr("name").attr("name", "contractWaterList[" + length + "].start_water_meter_count").val("").end()
            .find(".water_select").removeAttr("name").removeAttr("id").attr("name", "contractWaterList[" + length + "].water_id")
            .attr("id", "water_select_" + length).end()
            .find("span").remove().end()
            .find(".icon_font").html(html).end();
        var electricLength = $(".add_electric_line  tr").length;
        if (length >= electricLength) {
            $('#layui-layer2').height(48);
        }
        initWaterSelect(length);
    }
    function removeLine(obj) {
        if ($(obj).parents("tbody").find("tr").length == 1) {
            sadMessage("仅剩最后一行，不能删除！");
        } else {
            $(obj).parent().parent().remove();
        }
    }

    //obj:楼栋下拉框 ， floorValue：楼层值
    function setAttr(obj, floorValue) {
        if ($(obj).find("option:selected").attr("floor_id")) {
            $(".floor_id").val($(obj).find("option:selected").attr("floor_id"));
            $(obj).parent().parent().parent().next().find(".floor").html("<option>请选择</option>");
            $.ajax({
                type: "get",
                dataType: "json",
                url: pagePath + "/build/contract/findFloor/" + $(obj).find("option:selected").attr("floor_id"),
                success: function (result) {
                    if (result.success) {
                        var html = "";
                        var remain_area = "";
                        $.each(result.obj, function (index, item) {
                            html += "<option pay='" + item.pay + "' remain_area='" + item.remain_area + "' value='" + item.floor + "'>" + item.floor + "</option>";
                            if (floorValue && floorValue == item.floor) {
                                remain_area = item.remain_area;
                            }
                        });
                        $(obj).parents("tr").find(".floor").append(html);

                        if (floorValue) {
                            $(obj).parents("tr").find(".floor").val(floorValue);
                            $(obj).parents("tr").find(".remain_area").text(remain_area);
                        }

                    } else {
                        errorMessage(result.message);
                    }
                },
                error: function () {
                    errorMessage('系统错误!');
                }
            });
        } else {
            $(obj).parent().parent().parent().next().find(".floor").html("<option>请选择</option>");
            $(obj).parent().parent().parent().next().next().find(".use_area").val("");
            $(obj).parent().parent().parent().next().next().find(".remain_area").text("");
            $(obj).parent().parent().parent().next().next().next().find(".pay").val("");
        }

    }

    function setAreaPrice(obj) {
        $(obj).parent().parent().parent().next().find(".use_area").val($(obj).find("option:selected").attr("remain_area"));
        $(obj).parent().parent().parent().next().find(".remain_area").text($(obj).find("option:selected").attr("remain_area"));
        getTotalArea();
    }

    function getTotalArea() {
        var totalArea = 0;
        $(".add_floor_line").find(".use_area").each(function () {
            totalArea += parseFloat($(this).val() == "" ? 0 : $(this).val());
        });
        $("#total_area").text(totalArea);
        $("#area").val(totalArea);
    }

    function getPaidFee() {
        var totalMonthFee = 0.0;
        $(".add_floor_line").find("tr").each(function () {
            var floorArea = parseFloat($(this).find(".use_area").val() == "" ? 0 : $(this).find(".use_area").val());
            var floorPay = parseFloat($(this).find(".pay").val() == "" ? 0 : $(this).find(".pay").val());
            totalMonthFee += (floorArea * floorPay);
        });
        var paid_tenancy = parseFloat($("#paid_tenancy_month").val() == "" ? 0 : $("#paid_tenancy_month").val()) * totalMonthFee;
        $("#paid_tenancy").val(paid_tenancy.toFixed(2));
    }

    function checkWaterName(obj) {
        var index = $(".add_water_line tr").index($(obj).parents("tr"));
        $(".add_water_line tr:not(:eq(" + index + "))").find(".water_select").each(function (i, item) {
            if ($(this).val() != "" && $(obj).val() == $(this).val()) {
                errorMessage("水表名称不能重复！");
                $("#" + $(obj).attr("id")).val("").trigger("change");
            }
        });
        var flag = $(obj).find("option:selected").attr("is_common");
        if (flag == 'true') {
            $(obj).parents("tr").find(".start_water_meter_count").removeAttr("required").attr("disabled", "disabled").val("");
        } else {
            $(obj).parents("tr").find(".start_water_meter_count").removeAttr("disabled").attr("required");
        }

    }

    function checkElectricName(obj) {
        var index = $(".add_electric_line tr").index($(obj).parents("tr"));
        $(".add_electric_line tr:not(:eq(" + index + "))").find(".electric_select").each(function (i, item) {
            if ($(this).val() != "" && $(obj).val() == $(this).val()) {
                errorMessage("电表名称不能重复！");
                $("#" + $(obj).attr("id")).val("").trigger("change");
            }
        });
        var is_common = $(obj).find("option:selected").attr("is_common");
        var is_peak = $(obj).find("option:selected").attr("is_peak");
        if (is_peak == "true") {
            $(obj).parents("tr").find(".commonElectric").find("input").each(function () {
                $(this).val("");
                $(this).attr("disabled", "disabled");
            });
            $(obj).parents("tr").find(".peakValleyElectric").find("input").each(function () {
                $(this).attr("required", "true");
                if (is_common == 'false') {
                    $(this).removeAttr("disabled");
                }
            });
        } else {
            $(obj).parents("tr").find(".peakValleyElectric").find("input").each(function () {
                $(this).val("");
                $(this).attr("disabled", "disabled");
            });
            $(obj).parents("tr").find(".commonElectric").find("input").each(function () {
                if (is_common == 'false') {
                    $(this).removeAttr("disabled");
                }
            });
        }

    }

    function isfloat4Fn(val) {
        if (/^\d+(\.\d{1,4})?$/.test(String(val)) == false) {
            errorMessage("小数点后最多4位小数");
        }
    }

    function isfloat2Fn(val) {
        if (/^\d+(\.\d{1,2})?$/.test(String(val)) == false) {
            errorMessage("小数点后最多2位小数");
        }
    }
    //查看已用面积，更改面积不能小于已用面积
    function checkUseArea(obj) {
        var use_area = $(obj).attr("use_area");
        if ($(obj).val() - use_area < 0) {
            sadMessage("楼层已用面积" + use_area + "平方米，不能小于已用面积！");
            $(obj).val("");
        }
    }

    function selectModal(obj) {
        var flag = $(obj).prop("checked");
        var val = $(obj).val();
        if (flag) {
            if (val == "1") {
                $("#tenancy_fee").show();
                $("#is_tenancy").val(true);
                $("#tenancy_fee").find("input").attr("required", true).end()
                    .find("select").attr("required", true).end()
                    .find("input[type='hidden']").removeAttr("required").end()
                    .find(".remarks").removeAttr("required").end();
            } else if (val == "2") {
                $("#water_fee").show();
                $("#is_water").val(true);
                $("#water_fee").find("input").attr("required", true).end()
                    .find("input[type='hidden']").removeAttr("required").end()
                    .find("select").attr("required", true).end();
            } else if (val == "3") {
                $("#electric_fee").show();
                $("#is_electric").val(true);
                $("#electric_fee").find("select").attr("required", true).end();
            } else if (val == "4") {
                $("#property_fee").show();
                $("#is_property").val(true);
                $("#property_fee").find("input").attr("required", true).end()
                    .find("input[type='hidden']").removeAttr("required").end()
                    .find("input[name='contractProperty.remarks']").removeAttr("required").end();
            } else if (val == "5") {
                $("#parking_fee").show();
                $("#is_parking").val(true);
                $("#parking_fee").find("input").attr("required", true).end()
                    .find("input[type='hidden']").removeAttr("required").end()
                    .find("input[name='contractParking.remarks']").removeAttr("required").end();
            }
            $('#layui-layer2').height(200);
        } else {
            if (val == "1") {
                $("#tenancy_fee").hide();
                $("#is_tenancy").val(false);
                $("#tenancy_fee").find("select").removeAttr("required").end()
                    .find("input").removeAttr("required").end();
            } else if (val == "2") {
                $("#water_fee").hide();
                $("#is_water").val(false);
                $("#water_fee").find("select").removeAttr("required").end()
                    .find("input").removeAttr("required").end();
            } else if (val == "3") {
                $("#electric_fee").hide();
                $("#is_electric").val(false);
                $("#electric_fee").find("select").removeAttr("required").end()
                    .find("input").removeAttr("required").end();
            } else if (val == "4") {
                $("#property_fee").hide();
                $("#is_property").val(false);
                $("#property_fee").find("select").removeAttr("required").end()
                    .find("input").removeAttr("required").end();
            } else if (val == "5") {
                $("#parking_fee").hide();
                $("#is_parking").val(false);
                $("#parking_fee").find("select").removeAttr("required").end()
                    .find("input").removeAttr("required").end();
            }
        }

    }
</script>
</body>
</html>