做工单模块

This commit is contained in:
2025-06-25 17:41:48 +08:00
parent 6b78ee29cf
commit 4536b129ae
25 changed files with 1322 additions and 567 deletions
+100
View File
@@ -0,0 +1,100 @@
<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" lay-verify="" lay-reqText="请输入" placeholder="请输入遇到的问题" class="layui-textarea"
value=""></textarea>
</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"], function () {
var laydate = layui.laydate;
var form = layui.form,
layer = layui.layer;
laydate.render({
elem: '#start_time',
});
laydate.render({
elem: '#end_time',
});
// 获取项目名称
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) {
// 发送请求并处理响应
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>
+132
View File
@@ -0,0 +1,132 @@
<form class="layui-form page-content p-4" lay-filter="webform">
<input type="hidden" name="id" id="id" value="<?php echo isset($detail['id']) ? $detail['id'] : ''; ?>">
<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="solve" lay-verify="required" lay-reqText="请选择处理人" class="layui-select" lay-search=""
lay-filter="solve"></select>
</td>
<td class="layui-td-gray-2">工单状态<font>*</font>
</td>
<td colspan="3">
<select name="status" lay-verify="required" lay-reqText="请选择工单状态" class="layui-select">
<option value="">请选择工单状态</option>
<option value="1">解决中</option>
<option value="2">已解决</option>
<option value="3">已关闭</option>
</select>
</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>
<!-- <input type="hidden" name="id" id="id" th:value="${id}">
<div class="layui-form-item">
<label class="layui-form-label">姓名</label>
<div class="layui-input-block">
<input type="text" name="name" value="" placeholder="姓名" id="name" lay-verify="required|name" class="layui-input pwd">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">性别</label>
<div class="layui-input-block">
<input type="radio" name="sex" value="0" title="女" checked="">
<input type="radio" name="sex" value="1" title="男" >
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">年龄</label>
<div class="layui-input-block">
<input type="text" name="age" value="" placeholder="年龄" id="age" class="layui-input pwd">
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button class="layui-btn" lay-submit="" lay-filter="*">保存</button>
<button type="button" class="layui-btn layui-btn-primary" onclick="layerclose();">关闭</button>
</div>
</div> -->
</form>
<script>
// 获取URL参数id
function getQueryId() {
var match = window.location.pathname.match(/\/edit\/id\/(\d+)/);
return match ? match[1] : '';
}
var id = getQueryId();
// 赋值给input(如果不是php渲染,也可保留此段,防止页面未渲染id时赋值)
document.addEventListener("DOMContentLoaded", function() {
var idInput = document.getElementById('id');
if (idInput && !idInput.value) {
idInput.value = id;
}
});
layui.use(["form", "layer"], function () {
var form = layui.form,
layer = layui.layer;
// 渲染处理人下拉框并设置默认值
var detail = <?php echo json_encode(isset($detail) ? $detail : []); ?>;
fetch("/api/index/getallstaff")
.then((response) => response.json())
.then((data) => {
var select = document.querySelector('select[name="solve"]');
select.innerHTML = '<option value="">请选择处理人</option>';
data.data.forEach((solve) => {
var option = document.createElement("option");
option.value = solve.id;
option.innerText = solve.name;
// 设置选中
if (detail.solve && String(detail.solve) === String(solve.id)) {
option.selected = true;
}
select.appendChild(option);
});
form.render("select");
// 渲染默认值(工单状态)
if (detail && typeof detail.status !== "undefined") {
form.val("webform", {
"status": detail.status
});
}
})
.catch((error) => {
console.error("Error:", error);
});
// 监听提交事件
form.on("submit(webform)", function (data) {
// 发送请求并处理响应
fetch("/workorder/index/edit/" + id, {
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 === 2) {
setTimeout(function () {
var index = parent.layer.getFrameIndex(window.name);
parent.layer.close(index);
parent.location.reload(); // 刷新父页面
}, 1000);
}
});
return false;
});
});
</script>
+363
View File
@@ -0,0 +1,363 @@
{extend name="../../base/view/common/base" /}
<!-- 主体 -->
{block name="breadcrumb"}
<span class="layui-breadcrumb">
<a href="http://www.meteteme.com/" target="_blank">江苏美天科技</a>
<a><cite>年度工单</cite></a>
</span>
{/block} {block name="body"}
<div class="table-content p-3">
<div class="table_bar sticky-bar">
<div class="layui-form-bar border-t border-x">
<button class="layui-btn layui-btn-normal layui-btn-sm add-new">+ 新建工单</button>
<button class="layui-btn layui-btn-sm" id="refresh-btn">刷新</button>
<button class="layui-btn layui-btn-sm" id="batch_delete">批量删除</button>
<!-- <div class="layui-inline">
<input class="layui-input search-input" id="search-input" type="text" placeholder="请输入搜索内容">
</div>
<button class="layui-btn" id="search-btn">搜索</button> -->
</div>
<div class="cateselect layui-form-bar border-x">
<!-- <form class="layui-form" action="" id="filter-form">
<div class="layui-form-item">
<label class="layui-form-label">工单年份</label>
<div class="layui-input-inline">
<select name="year" lay-verify=""></select>
</div>
<label class="layui-form-label">重要程度</label>
<div class="layui-input-inline">
<select name="important" lay-verify="">
<option value="">请选择</option>
<option value="1">★</option>
<option value="2">★★</option>
<option value="3">★★★</option>
<option value="4">★★★★</option>
<option value="5">★★★★★</option>
</select>
</div>
<label class="layui-form-label">项目类型</label>
<div class="layui-input-inline">
<select name="cate" lay-verify=""></select>
</div>
<label class="layui-form-label">负责人</label>
<div class="layui-input-inline">
<input class="layui-input search-input" id="search-responsible" type="text" placeholder="请输入负责人">
</div>
</div>
<div class="layui-form-item">
<div style="width: 100%;height: 10px;"></div>
<label class="layui-form-label">项目名称</label>
<div class="layui-input-inline">
<input class="layui-input search-input" id="search-name" type="text" placeholder="请输入项目名称">
</div>
<div class="layui-input-inline">
<button class="layui-btn" lay-submit lay-filter="filterSearch" id="search-btn">筛选</button>
<button class="layui-btn layui-btn-normal" lay-submit lay-filter="filterSearch"
id="search-reload">清除</button>
</div>
</div>
</form> -->
</div>
</div>
<table class="layui-hide" id="workorder" lay-filter="workorder"></table>
<span id="total-price"></span>
</div>
{/block}
<!-- 脚本 -->
{block name="script"}
<script>
const moduleInit = ["tool", "gouguEdit", "gouguComment"];
function gouguInit() {
var table = layui.table;
var tool = layui.tool;
var dropdown = layui.dropdown;
var $ = layui.jquery;
var layer = layui.layer;
// 刷新按钮
$("#refresh-btn").on("click", function () {
location.reload();
});
//新增工单按钮
$(".add-new").on("click", function () {
tool.open("/workorder/index/add");
});
//获取项目类型
// function getprojectcate() {
// $.get("/workorder/index/getprojectcate", function (data) {
// var selectCate = $("select[name='cate']");
// selectCate.empty(); // 清空下拉框
// selectCate.append('<option value=""></option>'); // 添加空选项
// data.data.forEach(function (cate) {
// selectCate.append('<option value="' + cate.id + '">' + cate.cate + '</option>'); // 修改为 cate.id
// });
// layui.form.render('select'); // 重新渲染下拉框
// });
// }
// 调用项目类型
// getprojectcate();
// 删除单条数据
table.on("tool(workorder)", function (obj) {
var data = obj.data;
if (obj.event === "delete") {
layui.layer.confirm(
"确定删除该工单吗?",
{ icon: 3, title: "提示" },
function (index) {
$.post(
"/workorder/index/delete",
{ id: data.id },
function (res) {
if (res.code === 0) {
layui.layer.msg(res.msg);
obj.del(); // 删除表格中的对应行数据
} else {
layui.layer.msg(res.msg);
}
}
);
layui.layer.close(index);
}
);
}
});
//批量删除数据
$("#batch_delete").on("click", function () {
var checkStatus = table.checkStatus('workorder');
var data = checkStatus.data;
var ids = data.map(item => item.id);
if (ids.length === 0) {
layui.layer.msg("请选择要删除的数据");
return;
}
layui.layer.confirm(
"确定删除选中的工单吗?",
{ icon: 3, title: "提示" },
function (index) {
$.post(
"/workorder/index/batch_delete",
{ ids: ids },
function (res) {
if (res.code === 0) {
layui.layer.msg("批量删除成功");
loadTableData(); // 重新加载表格数据
} else {
layui.layer.msg(res.msg);
}
}
);
layui.layer.close(index);
}
);
});
//查看详情唤醒view界面
table.on('tool(workorder)', function (obj) {
var data = obj.data; // 获取当前行的数据
if (obj.event === 'view') {
var id = data.id; // 获取当前行数据的id
tool.open('/workorder/index/view/id/' + id, '工单详情');
} else if (obj.event === 'edit') {
var id = data.id;
tool.open('/workorder/index/edit/id/' + id, '处理工单');
}
});
//重载表格
function loadTableData() {
layui.pageTable.reload();
}
//渲染表格
layui.pageTable = layui.table.render({
elem: "#workorder",
toolbar: '#toolbarDemo',
defaultToolbar: ['filter', 'exports', 'print', {
title: '工单列表',
layEvent: 'LAYTABLE_TIPS',
icon: 'layui-icon-tips'
}],
cellMinWidth: 80,
url: "/workorder/index/index", // 数据接口
page: true,
limit: 50,
totalRow: true,
cols: [
[
{ type: 'checkbox' },
{ field: 'id', width: 80, title: '编号', sort: true, align: "center", totalRowText: '合计:' },
{
field: "project_id",
title: "隶属项目",
align: "center",
width: 180,
rowspan: 2,
templet: function (d) {
var html =
'<span>' + d.project_id + "</span>";
return html;
},
},
{
field: "content",
title: "项目问题",
align: "center",
minWidth: 180,
rowspan: 2,
templet: function (d) {
var html =
'<span>' + d.content + "</span>";
return html;
},
},
{
field: "status",
title: "工单状态",
width: 120,
align: "center",
rowspan: 2,
templet: function (d) {
var statusMap = {
0: "未解决",
1: "解决中",
2: "已解决",
3: "已关闭"
};
var statusText = statusMap[d.status] !== undefined ? statusMap[d.status] : d.status;
var html = '<span class="gdzt gd-' + d.status + '">' + statusText + "</span>";
return html;
},
},
{
field: "solve",
title: "分派处理人",
align: "center",
width: 120,
rowspan: 2,
templet: function (d) {
if (d.solve) {
var html = '<span>' + d.solve + "</span>";
return html;
} else {
return "-";
}
},
},
{
field: "creater",
title: "提交人",
align: "center",
width: 120,
rowspan: 2,
templet: function (d) {
var html =
'<span>' + d.creater + "</span>";
return html;
},
},
{
field: "contact",
title: "联系方式",
align: "center",
width: 140,
rowspan: 2,
templet: function (d) {
if (d.contact) {
var html = '<span>' + d.contact + "</span>";
return html;
} else {
return "-";
}
},
},
{
field: "remark",
title: "备注",
align: "center",
rowspan: 2,
templet: function (d) {
if (d.remark) {
var html = '<span>' + d.remark + "</span>";
return html;
} else {
return "-";
}
},
},
{
field: "sub_time",
title: "提交时间",
align: "center",
width: 180,
rowspan: 2,
templet: function (d) {
var html =
'<span>' + d.sub_time + "</span>";
return html;
},
},
{
fixed: 'right',
title: "操作",
align: "center",
width: 280,
minWidth: 220,
toolbar: "#barDemo",
},
],
],
});
}
</script>
<script type="text/html" id="barDemo">
<a class="layui-btn layui-btn-sm " id="view" lay-event="view">查看详情</a>
<!-- <button class="layui-btn layui-btn-sm" lay-event="view">查看详情</button> -->
<!-- <a class="layui-btn layui-btn-sm " data-href="/workorder/index/view/id/' + d.id + '" style="display: flex;justify-content: center;align-items: center;">查看详情</a> -->
<a class="layui-btn layui-btn-primary layui-border-blue layui-btn-sm" lay-event="edit">处理工单</a>
<a class="layui-btn layui-btn-primary layui-border layui-btn-sm" lay-event="delete">删除</a>
</script>
<style>
.gdzt{
padding: 3px 5px;
border-radius: 4px;
}
.gd-0{
color:#555 ;
background-color: #eee;
}
.gd-1{
color:#fff ;
background-color: #1e9fff;
}
.gd-2{
color:#fff ;
background-color: #16b777;
}
.gd-3{
color:#fff ;
background-color: #a233c6 ;
}
</style>
{/block}