2025-06-25 10:53:11 +08:00

215 lines
7.2 KiB
HTML

<form class="layui-form page-content p-4">
<h3 class="ms_title">新建任务</h3>
<table class="layui-table layui-table-form">
<tr>
<!-- 任务主题 -->
<td class="layui-td-gray">任务主题<font> *</font>
</td>
<td>
<input type="text" name="title" lay-verify="required" lay-reqText="请输入任务主题" placeholder="请输入任务主题"
class="layui-input" value="">
</td>
<!-- 任务优先级 -->
<td class="layui-td-gray">优先级<span style="color: red"> *</span></td>
<td>
<select name="priority" lay-verify="required" lay-reqText="请选择优先级">
<option value="1" selected></option>
<option value="2"></option>
<option value="3"></option>
<option value="4">紧急</option>
</select>
</td>
</tr>
<tr>
<!-- 任务性质 -->
<td class="layui-td-gray">任务性质<span style="color: red"> *</span></td>
<td>
<select name="is_bug" lay-verify="required" lay-reqText="请选择任务性质">
<option value="2">优化建议(OPTIMIZATION)</option>
<option value="1">问题缺陷(BUG)</option>
<option value="0">普通任务(TASK)</option>
</select>
</td>
<!-- 任务类型 -->
<td class="layui-td-gray">任务类型<span style="color: red"> *</span></td>
<td>
<select name="type" lay-verify="required" lay-reqText="请选择任务类型">
{volist name="type" id="vo"}
<option value="{$vo.id}">{$vo.title}</option>
{/volist}
</select>
</td>
</tr>
<tr>
<!-- 工作类型 -->
<td class="layui-td-gray">工作类型<span style="color: red"> *</span></td>
<td>
<select name="cate" lay-verify="required" lay-reqText="请选择工作类型">
{volist name="cate" id="vo"}
<option value="{$vo.id}">{$vo.title}</option>
{/volist}
</select>
</td>
<!-- 关联项目 -->
<td class="layui-td-gray">关联项目</td>
<td>
<select id="projectId" name="project_id" lay-filter="project_id">
{volist name=":get_project()" id="v"}
<option value="{$v.id}">{$v.name}</option>
{/volist}
</select>
</td>
</tr>
<tr>
<!-- 结束日期 -->
<td class="layui-td-gray-2">预计结束日期<span style="color: red"> *</span></td>
<td>
<input type="text" id="end_time" name="end_time" readonly lay-verify="required" lay-reqText="请选择结束时间"
placeholder="请选择时间" class="layui-input" value="">
</td>
<!-- 工时预估 -->
<td class="layui-td-gray">工时预估</td>
<td>
<input type="text" name="plan_hours" lay-reqText="请填写预估工时" placeholder="请填写预估工时" class="layui-input"
value="">
</td>
</tr>
<tr>
<!-- 任务指派给谁 -->
<td class="layui-td-gray">指派给<span style="color: red"> *</span></td>
<td>
<input type="hidden" name="director_uid" readonly value="">
<input type="text" name="director_name" placeholder="请选择" readonly class="layui-input" value="">
</td>
{empty name="$project_id"}
<td class="layui-td-gray">协作人</td>
<td>
<input type="hidden" name="assist_admin_ids" readonly value="">
<input type="text" name="assist_admin_names" placeholder="请选择" readonly class="layui-input" value="">
</td>
{else/}
<td class="layui-td-gray">协作人</td>
<td>
<input type="hidden" name="project_id" readonly value="{$project_id}">
<input type="hidden" name="assist_admin_ids" readonly value="">
<input type="text" name="assist_admin_names" placeholder="请选择" readonly class="layui-input" value="">
</td>
{/empty}
</tr>
</table>
<div>
<div class="ms_title">详细描述<span style="color: red"> *</span></div>
<div>
<textarea id="mdContent" style="display:none;"></textarea>
<div id="docContent"></div>
</div>
</div>
<div style="padding: 10px 0">
<input type="hidden" name="id" value="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>
<script>
function openInit() {
const form = layui.form, layer = layui.layer, editor = layui.editormd, tool = layui.tool, laydate = layui.laydate, dropdown = layui.dropdown, employeepicker = layui.employeepicker;
//select按照倒序排列数据显示
// 获取<select>元素
const projectIdSelect = document.getElementById("projectId");
// 获取所有<option>元素
const options = Array.from(projectIdSelect.options);
// 按照value属性对<option>元素进行降序排序
options.sort((a, b) => b.value - a.value);
// 清除<select>元素的内容
projectIdSelect.innerHTML = '';
// 将排序后的<option>元素添加回<select>元素
options.forEach(option => projectIdSelect.appendChild(option));
// 设置第一个显示的<option>元素为默认选择
projectIdSelect.selectedIndex = 0;
//渲染编辑器
form.render();
var edit = editor.render('docContent', {
markdown: $('#mdContent').val(),
imageUploadURL: "/api/index/md_upload",
lineNumbers: false,
toolbarIcons: function () {
return [
"undo", "redo", "bold", "del", "italic", "quote", "h1", "h2", "h3", "h4", "h5",
"list-ul", "list-ol", "hr", "link", "reference-link", "image", "code", "code-block", "table", "watch", "fullscreen"
];
},
// height: window.innerHeight - 500,
});
// 预计结束日期为当前时间+2T
var currentDate = new Date();
currentDate.setDate(currentDate.getDate() + 2);
var currentDateTime = currentDate.toISOString().slice(0, 10);
$('#end_time').val(currentDateTime);
//日期范围
laydate.render({
elem: '#end_time'
});
//选择负责人弹窗
$('.page-content').on('click', '[name="director_name"]', function () {
var ids = $('[name="director_uid"]').val(), names = $('[name="director_name"]').val();
employeepicker.init({
ids: ids,
names: names,
type: 0,
department_url: "/api/index/get_department_tree",
employee_url: "/api/index/get_employee",
callback: function (ids, names, dids, departments) {
$('[name="director_uid"]').val(ids);
$('[name="director_name"]').val(names);
}
});
});
//选择协作人人弹窗
$('.page-content').on('click', '[name="assist_admin_names"]', function () {
var ids = $('[name="assist_admin_ids"]').val(), names = $('[name="assist_admin_names"]').val(), assist_admin_id_array = [], assist_admin_name_array = [];
if (ids.length > 0) {
assist_admin_id_array = ids.split(',');
assist_admin_name_array = names.split(',');
}
employeepicker.init({
ids: assist_admin_id_array,
names: assist_admin_name_array,
department_url: "/api/index/get_department_tree",
employee_url: "/api/index/get_employee",
type: 1,
callback: function (ids, names, dids, departments) {
$('[name="assist_admin_ids"]').val(ids);
$('[name="assist_admin_names"]').val(names);
}
});
});
//监听提交
form.on('submit(webform)', function (data) {
let callback = function (e) {
layer.msg(e.msg);
if (e.code == 0) {
tool.close(1000);
if (layui.taskTable) {
layui.taskTable.reload();
}
}
}
tool.post("/task/index/add", data.field, callback);
tool.close(500);
return false;
});
}
</script>