{extend name="../../base/view/common/base" /}
<!-- 主体 -->
{block name="body"}
<form class="layui-form p-page">
	<h3 class="pb-3">新建项目</h3>
	<table class="layui-table layui-table-form">
		<tr>
			<td class="layui-td-gray">项目名称<font>*</font></td>
			<td><input type="text" name="name" lay-verify="required" lay-reqText="请输入项目名称" placeholder="请输入项目名称" class="layui-input" value="{$detail.name}"></td>
			<td class="layui-td-gray">项目类别<font>*</font></td>
			<td>
				<select name="cate_id" lay-verify="required" lay-reqText="请选择项目类别">
					<option value="">请选择</option>
					{volist name = ":get_base_data('ProjectCate')" id="vo"}
					<option value="{$vo.id}" {eq name="$vo.id" value="$detail.cate_id"} selected{/eq}>{$vo.title}</option>
					{/volist}
				</select>
			</td>
		</tr>
		<tr>
			<td class="layui-td-gray">负责人<font>*</font></td>
			<td>
				<input type="text" name="director_name" placeholder="请选择项目负责人" readonly class="layui-input picker-admin" value="{$detail.director_name}" lay-verify="required" readonly lay-reqText="请选择项目负责人">
				<input type="hidden" name="director_uid" value="{$detail.director_uid}">
			</td>
			<td class="layui-td-gray">计划周期<span style="color: red">*</span></td>
			<td><input type="text" name="range_time" value="{$detail.start_time|date='Y-m-d'} 到 {$detail.end_time|date='Y-m-d'}" class="layui-input tool-time" data-range="到" readonly placeholder="开始 到 结束" lay-verify="required" lay-reqText="请选择计划完成周期"></td>
		</tr>
		<tr>
			<td class="layui-td-gray">关联合同</td>
			<td colspan="3">
				<input type="text" class="layui-input picker-oa" data-types="contract" name="contract_name" placeholder="请选择需要关联的合同" readonly value="{$detail.contract_name|default=''}">		
				<input type="hidden" class="layui-input" name="contract_id" value="{$detail.contract_id}">
			</td>
		</tr>
		<tr>
			<td class="layui-td-gray">项目简介</td>
			<td colspan="3">
				<textarea name="content" class="layui-textarea">{$detail.content|default=''}</textarea>
			</td>
		</tr>
		<tr>
			<td colspan="4"><strong>项目阶段</strong><span style="color: red">*</span></td>
		</tr>
		<tr>
			<td colspan="4">
				<table id="stepTable" class="layui-table layui-table-min" style="margin:0">
					<tr>
						<th width="60">序号</th>
						<th width="200">阶段名称</th>
						<th width="80">阶段负责人</th>
						<th width="180">阶段成员</th>
						<th width="162">阶段周期</th>
						<th>阶段说明</th>
						<th width="60">操作</th>
					</tr>
					{volist name="$detail.step_array" id="vo" key="k"}
					<tr class="step-tr">
						<td class="step-key">第 <strong>{$k}</strong> 阶段</td>
						<td><input type="text" name="step_title[]" value="{$vo.title}" class="layui-input" lay-verify="required" lay-reqText="请输入阶段名称"></td>
						<td>
							<input type="text" value="{$vo.director_name}" class="layui-input layui-input-readonly picker-admin" lay-verify="required" lay-reqText="请选择阶段负责人" readonly>
							<input type="hidden" name="step_director_uid[]" value="{$vo.director_uid}" readonly>
						</td>
						<td>
							<input type="text" value="{$vo.unames}" class="layui-input layui-input-readonly picker-admin" data-type="2">
							<input type="hidden" name="step_uids[]" value="{$vo.uids}">
						</td>
						<td><input type="text" name="step_cycle_time[]" value="{$vo.start_time|date='Y-m-d'} 到 {$vo.end_time|date='Y-m-d'}" class="layui-input layui-input-readonly tool-time" data-range="到" lay-verify="required" lay-reqText="请选择阶段周期" readonly></td>
						<td><input type="text" name="step_remark[]" value="{$vo.remark|default=''}" class="layui-input"></td>
						<td>
							<input type="hidden" name="step_id[]" value="{$vo.id}" class="layui-input">
							<a class="layui-btn layui-btn-danger layui-btn-xs" data-id="{$vo.id}">删除</a>
						</td>
					</tr>
					{/volist}
				</table>
				<div class="pt-2">
					<span class="layui-btn layui-btn-sm" id="stepAdd">+ 添加阶段</span>
				</div>
			</td>
		</tr>
	</table>
	<div class="pt-3">
		<input type="hidden" name="id" value="{$detail.id|default=0}"/>
		<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>
	var moduleInit = ['tool','oaPicker'];

	function gouguInit() {
		var form = layui.form, tool = layui.tool,laydate = layui.laydate;
		//添加阶段信息表格
		$('#stepAdd').on('click',function(){
			var html = '';
			html += '<tr class="step-tr">\
						<td class="step-key">第 <strong>0</strong> 阶段</td>\
						<td><input type="text" name="step_title[]" value="" class="layui-input" lay-verify="required" lay-reqText="请输入阶段名称"></td>\
						<td>\
							<input type="text" value="" class="layui-input layui-input-readonly picker-admin" lay-verify="required" lay-reqText="请选择阶段负责人" readonly>\
							<input type="hidden" name="step_director_uid[]" value="0" readonly>\
						</td>\
						<td>\
							<input type="text" value="" class="layui-input layui-input-readonly picker-admin" data-type="2">\
							<input type="hidden" name="step_uids[]" value="">\
						</td>\
						<td><input type="text" name="step_cycle_time[]" value="" class="layui-input layui-input-readonly tool-time" data-range="到" lay-verify="required" lay-reqText="请选择服务周期" readonly></td>\
						<td><input type="text" name="step_remark[]" value="" class="layui-input"></td>\
						<td>\
							<input type="hidden" name="step_id[]" value="0" class="layui-input">\
							<a class="layui-btn layui-btn-danger layui-btn-xs" data-id="0">删除</a>\
						</td>\
					</tr>';
			$('#stepTable').append(html).find('.tr-none').remove();
			$('#stepTable').find('.step-key').each(function(index,item){
				$(this).html('第 <strong>'+(index+1)+'</strong> 阶段');
			})
			form.render();
		});
		$('#stepTable').on('click','.layui-btn-danger',function(){
			if($('.step-tr').length<2){
				layer.msg('至少保留一个项目阶段');
				return false;
			}
			let that=$(this);
			let id = that.data('id');
			if(id==0){
				that.parents('.step-tr').remove();
				$('#stepTable').find('.step-key').each(function(index,item){
					$(this).html('第 <strong>'+(index+1)+'</strong> 阶段');
				})
			}
			else{
				layer.confirm('确定要删除该项目阶段吗?', { icon: 3, title: '提示' }, function (index) {
					let callback = function (e) {
						layer.msg(e.msg);
						if (e.code == 0) {
							that.parents('.step-tr').remove();
							$('#stepTable').find('.step-key').each(function(index,item){
								$(this).html('第 <strong>'+(index+1)+'</strong> 阶段');
							})
						}
					}
					tool.delete("/project/api/step_del", { id: id }, callback);
					layer.close(index);
				});
			}
		});
		//监听提交
		form.on('submit(webform)', function (data) {
			let callback = function (e) {
				layer.msg(e.msg);
				if (e.code == 0) {
					tool.sideClose(1000);
				}
			}
			tool.post("/project/index/add", data.field, callback);
			return false;
		});
	}
</script>
{/block}
<!-- /脚本 -->