129 lines
4.2 KiB
HTML

<form class="layui-form page-content p-4">
<h3 class="h3-title">新建工单</h3>
<table class="layui-table layui-table-form">
<tr>
<td class="layui-td-gray-2">项目名称<font>*</font>
</td>
<td>
<select name="project_id" lay-verify="required" lay-reqText="请选择项目名称" class="layui-select" lay-search=""
lay-filter="project_id"></select>
</td>
<td class="layui-td-gray-2">问题类型<font>*</font>
</td>
<td colspan="3">
<input type="text" name="problemtype" lay-verify="" lay-reqText="请输入问题类型" placeholder="请输入问题类型,例如:页面闪退"
class="layui-input" value="" />
</td>
</tr>
<tr>
<td class="layui-td-gray-2">问题描述<font>*</font>
</td>
<td colspan="4">
<!-- <textarea name="content" id="content" lay-verify="" lay-reqText="请输入" placeholder="请输入遇到的问题" class="layui-textarea"
value=""></textarea> -->
<textarea id="content" name="content" style="display:none;"></textarea>
<div id="docContent"></div>
</td>
</tr>
<tr>
<td class="layui-td-gray-2">备注
</td>
<td colspan="4">
<textarea name="remark" lay-verify="" lay-reqText="请输入" placeholder="请输入备注" class="layui-textarea"
value=""></textarea>
</td>
</tr>
</table>
<div class="pt-1">
<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>
layui.use(["form", "layer", "editormd", "tool", "laydate", "dropdown", "employeepicker"], function () {
const form = layui.form,
layer = layui.layer,
editor = layui.editormd,
tool = layui.tool,
laydate = layui.laydate,
dropdown = layui.dropdown,
employeepicker = layui.employeepicker;
// 渲染编辑器
form.render();
var edit = editor.render('docContent', {
markdown: $('#content').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,
});
// 获取项目名称
fetch("/reimbursement/index/getproject")
.then((response) => response.json())
.then((data) => {
var select = document.querySelector('select[name="project_id"]');
select.innerHTML = '<option value="">请选择项目名称</option>';
data.data.forEach((project_id) => {
var option = document.createElement("option");
option.value = project_id.id;
option.innerText = project_id.project;
select.appendChild(option);
});
form.render("select");
})
.catch((error) => {
console.error("Error:", error);
});
// 监听提交事件
form.on("submit(webform)", function (data) {
// 把 docContent-html-code 赋值给 content
data.field.content = data.field['docContent-html-code'] || '';
// 删除不需要的字段
delete data.field['docContent-html-code'];
delete data.field['docContent-markdown-doc'];
// 发送请求并处理响应
fetch("/workorder/index/add", {
method: "POST",
body: JSON.stringify(data.field),
headers: {
"Content-Type": "application/json",
},
})
.then((response) => response.json())
.then((result) => {
layer.msg(result.msg);
if (result.code === 0) {
setTimeout(function () {
var index = parent.layer.getFrameIndex(window.name);
parent.layer.close(index);
parent.location.reload(); // 刷新父页面
}, 1000);
}
});
return false;
});
});
</script>
<style>
#docContent img{
padding: 20px;
}
.pt-1{
margin-top: 15px;
}
</style>