{extend name="common/base"/}
<!-- 主体 -->
{block name="style"}
<style>
    .footer{
        display: none;
    }

    .form-title {
        background-color: rgb(241, 241, 241);
        color: #5f5f5f;
        border-color: rgb(241, 241, 241);
    }

    .layui-table td {
        border-width: 1px;
        border-style: solid;
        border-color: #e2e2e2;
    }
    
    .annex li{
        padding: 0 1vw 0 1vw;
        border-right: 1px solid #e2e2e2;
    }
    
    .annex p{
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        width: 7vw;
        font-weight: 500 !important;
    }
    
    .annex img{
        height: auto !important;
    }
    
</style>
{/block}

{block name="body"}
<form class="layui-form p-4">
    <h3 class="pb-3">编辑合同</h3>
    <table class="layui-table layui-table-form">
        {gt name="$detail.pid" value="0"}
        <tr>
            <td class="layui-td-gray form-title">母合同名称</td>
            <td colspan="5">{$detail.pname}</td>
        </tr>
        {/gt}
        <tr>
            <td class="layui-td-gray form-title">合同名称<font>*</font></td>
            <td colspan="3"><input type="text" name="name" value="{$detail.name}" lay-verify="required"
                                   lay-reqText="请输入合同名称" autocomplete="off" placeholder="请输入合同名称"
                                   class="layui-input"></td>
            <td class="layui-td-gray form-title">合同性质</td>
            <td>
                {eq name="$detail.type" value="1" }普通合同{/eq}
                {eq name="$detail.type" value="2" }框架合同{/eq}
                {eq name="$detail.type" value="3" }补充协议{/eq}
                {eq name="$detail.type" value="4" }其他合同{/eq}
            </td>
        </tr>
        <tr>
            <td class="layui-td-gray form-title">签约主体<span style="font-size:12px;">(乙方)</span><font>*</font></td>
            <td>
                <input type="text" name="subject_name" autocomplete="off" value="{$detail.subject_name}"  lay-verify="required" lay-reqText="请输入客户名称" placeholder="请输入客户名称" class="layui-input">
            </td>
            <td class="layui-td-gray form-title">合同编号<font>*</font></td>
            <td>
                <input type="text" name="code" value="{$detail.code}" autocomplete="off" lay-verify="required"
                       lay-reqText="请输入合同编号" placeholder="请输入合同编号" class="layui-input">
            </td>
            <td class="layui-td-gray form-title">合同类别<font>*</font></td>
            <td>
                <select name="cate_id" lay-verify="required" lay-reqText="请选择合同类别">
                    <option value="">请选择合同类别</option>
                    {volist name="cate" id="v"}
                    <option value="{$v.id}" {eq name="$v.id" value="$detail.cate_id" } selected {/eq}>{$v.title}</option>
                    {/volist}
                </select>
            </td>
        </tr>
        <tr>
            <td class="layui-td-gray form-title">客户名称<span style="font-size:12px;">(甲方)</span><font>*</font></td>
            <td>
                <input type="text" name="customer" autocomplete="off" value="{$detail.customer}"  lay-verify="required" lay-reqText="请输入客户名称" placeholder="请输入客户名称" class="layui-input">
            </td>

            <td class="layui-td-gray form-title">签约客户代表</td>
            <td>
                <input type="text" name="customer_name" value="{$detail.customer_name}" autocomplete="off" lay-verify="required" lay-reqText="请输入客户代表姓名" placeholder="请输入客户代表姓名" class="layui-input">
            </td>
            <td class="layui-td-gray form-title">客户联系电话<font>*</font></td>
            <td>
                <input type="text" name="customer_mobile" value="{$detail.customer_mobile}" autocomplete="off" lay-verify="required" lay-reqText="请输入客户联系电话" placeholder="请输入客户联系电话" class="layui-input">
            </td>
        </tr>
        <tr>
            <td class="layui-td-gray-2 form-title">客户联系地址</td>
            <td colspan="3">
                <input type="text" name="customer_address" value="{$detail.customer_address}" autocomplete="off" placeholder="请输入客户联系地址" class="layui-input">
            </td>
            <td class="layui-td-gray-2 form-title">合同始止日期<font>*</font></td>
            <td>
                <div id="barDate" class="layui-input-inline">
                    <div class="layui-input-inline" style="width:110px; margin-bottom:0">
                        <input type="text" class="layui-input" id="start_time" placeholder="选择时间区间" readonly name="start_time" value="{$detail.start_time}" readonly lay-verify="required" lay-reqText="请选择合同开始时间">
                    </div>
                    ~
                    <div class="layui-input-inline" style="width:110px;margin-bottom:0">
                        <input type="text" class="layui-input" id="end_time" placeholder="选择时间区间" readonly name="end_time" value="{$detail.end_time}" readonly lay-verify="required" lay-reqText="请选择合同结束时间">
                    </div>
                </div>
            </td>
        </tr>
        {neq name="$detail.type" value="2"}
        <tr>
            <td class="layui-td-gray form-title">合同金额{eq name="$detail.type" value="1"}<font>*</font>{/eq}</td>
            <td>
                <input type="text" name="cost" value="{$detail.cost}" {eq name="$detail.type" value="1" } lay-verify="required|number" {/eq} lay-reqText="请输入合同金额，数字" placeholder="请输入合同金额，数字" autocomplete="off" class="layui-input">
            </td>
            <td class="layui-td-gray form-title">是否含税</td>
            <td>
                <input type="radio" name="is_tax" value="1" title="是" {eq name="$detail.is_tax" value="1" } checked{/eq} lay-filter="tax">
                <input type="radio" name="is_tax" value="0" title="否" {eq name="$detail.is_tax" value="0" } checked{/eq} lay-filter="tax">
            </td>
            <td class="layui-td-gray form-title">税点(百分比)</td>
            <td>
                <input type="text" name="tax" value="{$detail.tax}"
                <input type="text" name="tax" value="" lay-verify="number" placeholder="请输入税点，数字" autocomplete="off" class="layui-input" {eq name="$detail.is_tax" value="0" } style="display:none;" {/eq}>
            </td>
        </tr>
        {/neq}
        <tr>
            <td colspan="6"><strong>签订信息</strong></td>
        </tr>
        <tr>
            <td class="layui-td-gray-2 form-title">合同签订人<font>*</font></td>
            <td>
                <div class="layui-input-inline" style="width:50%;">
                    <input type="text" name="sign_name" value="{$detail.sign_name}" autocomplete="off" readonly lay-verify="required" lay-reqText="请选择合同签订人" placeholder="请选择合同签订人" class="layui-input picker-one">
                </div>
                <!--<div class="layui-input-inline gray" style="width:42%;" id="sign_department">
                    部门：{/$detail.sign_department}
                </div>
                <input type="hidden" name="sign_uid" value="{$detail.sign_uid}">
                <input type="hidden" name="sign_did" value="{$detail.sign_did}">-->
            </td>
            <td class="layui-td-gray-2 form-title">合同签订时间<font>*</font></td>
            <td>
                <input type="text" name="sign_time" value="{$detail.sign_time}" readonly lay-verify="required" lay-reqText="请选择合同签订日期" placeholder="请选择合同签订日期" class="layui-input tool-time">
            </td>
            <td class="layui-td-gray-2 form-title">合同制定人<font>*</font></td>
            <td>
                <input type="text" name="prepared_name" value="{$detail.prepared_name}" autocomplete="off" readonly placeholder="请选择合同制定人" class="layui-input picker-one">
                <input type="hidden" name="prepared_uid" value="{$detail.prepared_uid}" lay-verify="required" lay-reqText="请选择合同制定人">
            </td>
        </tr>
        <tr>
            <td class="layui-td-gray-2 form-title">合同保管人<font>*</font></td>
            <td>
                <input type="text" name="keeper_name" value="{$detail.keeper_name}" autocomplete="off" readonly placeholder="请选择合同保管人" class="layui-input picker-one">
                <input type="hidden" name="keeper_uid" value="{$detail.keeper_uid}" lay-verify="required" lay-reqText="请选择合同保管人">
            </td>
            <td class="layui-td-gray form-title">合同共享人员</td>
            <td colspan="3">
                <input type="text" name="share_names" value="{$detail.share_names}" autocomplete="off" readonly placeholder="请选择共享人员" class="layui-input picker-more">
                <input type="hidden" name="share_ids" value="{$detail.share_ids}">
            </td>
        </tr>


        <tr>
            <th colspan="9" style="text-align:left;"><strong>补充附件</strong></th>
        </tr>
        <tr>
            <th class="form-title" style="text-align:center !important;">
                <button type="button" class="layui-btn layui-btn-sm" id="uploadBtn"><i
                        class="layui-icon"></i>附件上传
                </button>
            </th>
            <th colspan="8" style="line-height:inherit">
                <div id="fileBox" class="annex" style="display: flex;">
                    {:fileCard($detail.file_array_other)}
                </div>
            </th>
        </tr>

        <tr>
            <td colspan="6"><strong>备注信息</strong></td>
        </tr>
        <tr>
            <td colspan="6">
                <textarea name="remark" placeholder="请输入备注信息" class="layui-textarea">{$detail.remark}</textarea>
            </td>
        </tr>
    </table>
    <div class="py-3">
        <input type="hidden" name="id" value="{$detail.id}">
        <input type="hidden" name="scene" value="edit">
        <button class="layui-btn layui-btn-normal" lay-submit="" lay-filter="webform">立即提交</button>
        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
    </div>
</form>
{/block}
<!-- /主体 -->

<!-- 脚本 -->
{block name="script"}
<script>
    const moduleInit = ['tool', 'employeepicker', 'oaTool'];
    const contract_id = '{$detail.id}';
    function gouguInit() {
        var form = layui.form, tool = layui.tool, table = layui.table, laydate = layui.laydate, oaTool = layui.oaTool,
            employeepicker = layui.employeepicker;
        //日期范围
        laydate.render({
            elem: '#barDate',
            range: ['#start_time', '#end_time'],
            rangeLinked: true
        });

        //相关附件上传
        var file_ids = [];
        oaTool.addFile({
            type: 1,
            isSave: true,
            ajaxDelete: function (file_id) {
                let callback = function (e) {
                    layer.msg(e.msg);
                    if (e.code == 0) {
                        $("#" + file_id + "").remove();
                    }
                }
                tool.delete("/admin/contract.api/delete_file", {id: file_id}, callback);
            },
            ajaxSave: function (res) {

                let callback = function (e) {
                    layer.msg(e.msg);
                    if (e.code == 0) {
                        location.reload();
                    }
                }
                tool.post("/admin/contract.api/add_file", {
                    'contract_id': contract_id,
                    'file_id': res.data.id,
                    'file_name': res.data.name
                }, callback);

            }
        });



        //radio选择
        form.on('radio(tax)', function (data) {
            if (data.value == 0) {
                $('[name="tax"]').val('0').hide();
            } else {
                $('[name="tax"]').val('').show();
            }
        });

        //监听提交
        form.on('submit(webform)', function (data) {
            if (data.field.type == 1 && data.field.cost == '') {
                layer.msg('请完善合同金额');
                return false;
            }
            if (data.field.is_tax == 1 && data.field.tax == '') {
                layer.msg('请完善税点');
                return false;
            }
            if (data.field.is_tax == 1 && data.field.cost == '') {
                layer.msg('请完善金额');
                return false;
            }
            let callback = function (e) {
                layer.msg(e.msg);
                if (e.code == 0) {
                    tool.sideClose(1000);
                }
            }
            tool.post("/admin/contract.index/edit", data.field, callback);
            return false;
        });

    }
</script>
{/block}
<!-- /脚本 -->