meteteme/projectmanager
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
hero920103
2025-06-25 10:53:11 +08:00
commit 9f374011ae
1240 changed files with 181139 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/reimbursement/common.php
+12
View File
@@ -0,0 +1,12 @@
<?php
/**
* @copyright Copyright (c) 2023-2024 美天智能科技
* @author 李志强
* @link http://www.meteteme.com
*/
/**
======================
*模块数据获取公共文件
======================
*/
use think\facade\Db;
app/reimbursement/controller/Index.php
+539
View File
@@ -0,0 +1,539 @@
<?php
/**
* @copyright Copyright (c) 2023-2024 美天智能科技
* @link http://www.meteteme.com
* @author 李志强
*/
declare(strict_types=1);
namespace app\reimbursement\controller;
use app\base\BaseController;
use app\model\Reimbursement as ReimbursementList;
use app\model\ReimbursementCategory;
use app\model\Admin;
use app\model\ReimbursementOrder as ReimbursementOrderList;
use app\model\Project as ProjectList;
use app\model\Department as DepartmentList;
use app\reimbursement\validate\ReimbursementCheck;
use think\facade\Db;
use think\facade\View;
use think\facade\Response;
class Index extends BaseController
{
public function index()
{
if (request()->isAjax()) {
$param = get_params();
$admin = $this->uid;
$rows = empty($param['limit']) ? get_md_contentconfig('app.page_size') : $param['limit'];
$list = ReimbursementOrderList::withoutField('')
->where('delete_time', null)
->where('creater', $admin) // 只显示creater等于$admin的数据
->order('order')
->order('id', 'desc')
->paginate($rows, false, ['query' => $param])
->each(function ($item, $key) {
$ro = ReimbursementOrderList::where(['id' => $item->id])->find();
$item->order = $ro['order'];
$item->total = $ro['total'];
$item->department = DepartmentList::where('id', $ro['department'])->value('title');
$item->project = ProjectList::where('id', $ro['project'])->value('name_short');
$item->creater = Admin::where('id', $ro['creater'])->value('name');
$item->status = $ro['status'];
$item->remark = $ro['remark'];
})
->filter(function ($item) {
return $item->delete_time === null;
});
return table_assign(0, '', $list);
} else {
return view();
}
}
//获取报销列表
public function getReimbursementlist()
{
$list = ReimbursementOrderList::order('id', 'desc')
->whereNull('delete_time')
->select()
->map(function ($item) {
// 查询 department 的名称
$department = DepartmentList::where('id', $item->department)->value('title');
// 查询 creater 的名称
$creater = Admin::where('id', $item->creater)->value('name');
// 将 project 和 cate 名称赋值到当前项
$item->department = $department;
$item->creater = $creater;
return $item;
});
return json(['data' => $list, 'code' => 0, 'msg' => '获取账单成功']);
}
// 获取账单详情
public function getorderviewdetail($pid)
{
// 获取符合条件的记录列表
$list = ReimbursementList::where('pid', $pid)
->whereNull('delete_time')
->order('id', 'desc')
->select()
->map(function ($item) {
// 查询 project 的名称
$project = ProjectList::where('id', $item->project)->value('name_short');
// 查询 cate 的名称
$cate = ReimbursementCategory::where('id', $item->cate)->value('name');
// 将 project 和 cate 名称赋值到当前项
$item->project = $project;
$item->cate = $cate;
return $item;
});
return json(['data' => $list, 'code' => 0, 'msg' => '获取账单详情成功']);
}
// 获取报销内容
public function getreimbursementdetail($id)
{
// 获取符合条件的记录列表
$detail = ReimbursementList::where('id', $id)
->whereNull('delete_time')
->order('id', 'desc')
->select()
->map(function ($item) {
// 查询 project 的名称
$project = ProjectList::where('id', $item->project)->value('name_short');
// 查询 cate 的名称
$cate = ReimbursementCategory::where('id', $item->cate)->value('name');
// 将 project 和 cate 名称赋值到当前项
$item->project = $project;
$item->cate = $cate;
return $item;
});
return json(['data' => $detail, 'code' => 0, 'msg' => '获取报销成功']);
}
//添加条目
public function additem()
{
$param = get_params();
if (request()->isPost()) {
// 新增逻辑
$param['create_time'] = date('Y-m-d H:i:s', time());
$param['admin_id'] = $this->uid;
$sid = ReimbursementList::strict(false)->field(true)->insertGetId($param);
if ($sid) {
add_log('add', $sid, $param);
// 从报销列表中重新计算总值
$total = ReimbursementList::where('pid', $param['pid'])->sum('price');
$param['total'] = $total;
// 更新 ReimbursementOrderList，将重新计算的总值更新到对应的 pid=id 的 total 字段中
ReimbursementOrderList::where('id', $param['pid'])->strict(false)->update(['total' => $total]);
return json(["code" => 2, "msg" => "添加成功"]); // 返回JSON格式数据
} else {
return json(["code" => -2, "msg" => "添加失败"]); // 返回JSON格式数据
}
} else {
$id = isset($param['id']) ? $param['id'] : 0;
if ($id > 0) {
$reimbursementLists = ReimbursementList::where('id', $id)
->field('id, pid, times, department, project, cate, price, creater, haveticket, tickets, remark, create_time')
->find();
if (empty($reimbursementLists)) {
return json(["code" => 1, "msg" => "信息不存在"]); // 返回JSON格式数据
}
View::assign('sid', $reimbursementLists);
}
View::assign('id', $id);
return view();
}
}
//编辑条目
public function edititem($id)
{
$param = get_params();
// 编辑逻辑
$reimbursementLists = ReimbursementList::where('id', $param['id'])
->field('id, pid, times, department, project, cate, price, creater, haveticket, tickets, remark, create_time')
->find();
if ($reimbursementLists) {
// 获取项目名称
$project = ProjectList::where('id', $reimbursementLists['project'])->value('name_short');
// 获取部门名称
$department = DepartmentList::where('id', $reimbursementLists['department'])->value('title');
// 获取创建者名称
$creater = Admin::where('id', $reimbursementLists['creater'])->value('name');
if ($project) {
$reimbursementLists['project'] = $project;
}
if ($department) {
$reimbursementLists['department'] = $department;
}
if ($creater) {
$reimbursementLists['creater'] = $creater;
}
View::assign('detail', $reimbursementLists);
} else {
return json(["code" => 1, "msg" => "信息不存在"]); // 返回JSON格式数据
}
$param['update_time'] = date('Y-m-d H:i:s', time());
$param['update_time'] = date('Y-m-d', time());
$res = ReimbursementList::where('id', $param['id'])->strict(false)->field(true)->update($param);
if ($res) {
add_log('edit', $param['id'], $param, $reimbursementLists);
return json(["code" => 0, "msg" => "编辑成功"]); // 返回JSON格式数据
} else {
return json(["code" => -1, "msg" => "编辑失败"]); // 返回JSON格式数据
}
}
//添加
public function add()
{
$param = get_params();
if (request()->isPost()) {
if (!empty($param['id']) && $param['id'] > 0) {
$ro = (new ReimbursementOrderList())->detail($param['id']);
$param['update_time'] = time();
$res = ReimbursementOrderList::where('id', $param['id'])->strict(false)->field(true)->update($param);
if ($res) {
add_log('edit', $param['id'], $param, $ro);
}
return to_assign();
} else {
$param['create_time'] = date('Y-m-d H:i:s', time());
$param['admin_id'] = $this->uid;
$param['creater'] = $this->uid;
$param['status'] = '未报销'; // 添加状态字段赋值
$sid = ReimbursementOrderList::strict(false)->field(true)->insertGetId($param);
if ($sid) {
add_log('add', $sid, $param);
$log_data = array(
'module' => 'plans',
// 'id' => $sid,
'new_content' => $param['order'],
'field' => 'new',
'action' => 'add',
'admin_id' => $this->uid,
'create_time' => time(),
);
Db::name('Log')->strict(false)->field(true)->insert($log_data);
}
return to_assign(2, '添加成功！');
}
} else {
$id = isset($param['id']) ? $param['id'] : 0;
if ($id > 0) {
$detail = (new ReimbursementOrderList())->detail($id);
if (empty($detail)) {
return to_assign(1, '1.信息不存在');
}
View::assign('detail', $detail);
}
View::assign('id', $id);
return view();
}
}
//查看
public function view($id)
{
$reimbursementOrder = ReimbursementOrderList::where('id', $id)
->field('id, order, total, department, project, creater, remark, status, lock, create_time')
->find();
// print_r($reimbursementOrder);
if ($reimbursementOrder) {
// 获取项目名称
$project = ProjectList::where('id', $reimbursementOrder['project'])->value('name_short');
// 获取部门名称
$department = DepartmentList::where('id', $reimbursementOrder['department'])->value('title');
// 获取创建者名称
$creater = Admin::where('id', $reimbursementOrder['creater'])->value('name');
// print_r($creater);
if ($project) {
$reimbursementOrder['project'] = $project;
}
if ($department) {
$reimbursementOrder['department'] = $department;
}
if ($creater) {
$reimbursementOrder['creater'] = $creater;
}
if ($reimbursementOrder) {
View::assign('detail', $reimbursementOrder);
} else {
View::assign('message', '没有详细数据');
}
}
return view();
}
// 查看报销详情
public function viewitem($id)
{
$reimbursementLists = ReimbursementList::where('pid', $id)
->whereNull('delete_time')
->order('times', 'desc')
->select();
foreach ($reimbursementLists as $item) {
$cateName = ReimbursementCategory::where('id', $item->cate)->value('name');
$projectName = ProjectList::where('id', $item->project)->value('name_short');
$item->cate = $cateName;
$item->project = $projectName;
}
return json(["code" => 0, "data" => $reimbursementLists]);
}
//删除
public function delete()
{
$request = request();
if ($request->isDelete() || $request->isAjax()) {
$id = get_params("id");
$detail = ReimbursementList::where('id', $id)->find();
if (ReimbursementList::where('id', $id)->update(['delete_time' => date('Y-m-d H:i:s')]) !== false) {
$log_data = array(
'module' => 'reimbursement',
'field' => 'delete',
'action' => 'delete',
'admin_id' => $this->uid,
'old_content' => '',
'new_content' => $detail['id'],
'create_time' => time(),
);
Db::name('Log')->strict(false)->field(true)->insert($log_data);
return to_assign(0, "删除成功");
} else {
return to_assign(0, "删除失败");
}
} else {
return to_assign(1, "错误的请求");
}
}
//批量删除
public function batch_delete()
{
$request = request();
if ($request->isDelete() || $request->isAjax()) {
$ids = get_params("ids");
foreach ($ids as $id) {
$detail = ReimbursementOrderList::where('id', $id)->find();
if (ReimbursementOrderList::where('id', $id)->update(['delete_time' => date('Y-m-d H:i:s')]) !== false) {
$log_data = array(
'module' => 'reimbursement',
'field' => 'delete',
'action' => 'delete',
'admin_id' => $this->uid,
'old_content' => '',
'new_content' => $detail['id'],
'create_time' => time(),
);
Db::name('Log')->strict(false)->field(true)->insert($log_data);
}
}
return to_assign(0, "批量删除成功");
} else {
return to_assign(1, "错误的请求");
}
}
//获取项目列表
public function getproject()
{
$pageNumber = $_GET['page'] ?? 1; // 获取当前页码，默认为第1页
$pageSize = 50; // 每页显示的数据条数
$totalRecords = ProjectList::where('delete_time', null)->count(); // 获取总记录数
$totalPages = ceil($totalRecords / $pageSize); // 计算总页数
$offset = ($pageNumber - 1) * $pageSize; // 计算偏移量
$projects = ProjectList::limit($offset, $pageSize)->order('id', 'desc')->column('name_short', 'id');
$formattedProjects = [];
foreach ($projects as $id => $project) {
$formattedProjects[] = ["id" => $id, "project" => $project];
}
return json(["code" => 0, "count" => $totalRecords, "data" => $formattedProjects, "pages" => $totalPages]);
}
//获取项目列表
public function getdepartment()
{
$pageNumber = $_GET['page'] ?? 1; // 获取当前页码，默认为第1页
$pageSize = 10; // 每页显示的数据条数
$totalRecords = DepartmentList::count(); // 获取总记录数
$totalPages = ceil($totalRecords / $pageSize); // 计算总页数
$offset = ($pageNumber - 1) * $pageSize; // 计算偏移量
$departments = DepartmentList::limit($offset, $pageSize)->order('id', 'desc')->column('title', 'id');
$formattedDepartments = [];
foreach ($departments as $id => $department) {
$formattedDepartments[] = ["id" => $id, "department" => $department];
}
return json(["code" => 0, "count" => $totalRecords, "data" => $formattedDepartments, "pages" => $totalPages]);
}
//获取报销类别
public function reimcate()
{
$pageNumber = $_GET['page'] ?? 1; // 获取当前页码，默认为第1页
$pageSize = 50; // 每页显示的数据条数
$totalRecords = ReimbursementCategory::count(); // 获取总记录数
$totalPages = ceil($totalRecords / $pageSize); // 计算总页数
$offset = ($pageNumber - 1) * $pageSize; // 计算偏移量
$reimcates = ReimbursementCategory::limit($offset, $pageSize)->order('id', 'desc')->column('name', 'id');
$formattedReimcates = [];
foreach ($reimcates as $id => $reimcate) {
$formattedReimcates[] = ["id" => $id, "cate" => $reimcate];
}
return json(["code" => 0, "count" => $totalRecords, "data" => $formattedReimcates, "pages" => $totalPages]);
}
//获取创建者
public function getcreater()
{
$createrId = $this->uid;
$createrName = Admin::where('id', $createrId)->value('name');
header('Content-Type: application/json');
echo json_encode([
'createrId' => $createrId,
'createrName' => $createrName,
]);
exit;
}
//编辑报销状态
public function editstatus($id, $status)
{
$validStatus = ['未报销', '已报销'];
if (in_array($status, $validStatus)) {
ReimbursementOrderList::where('id', $id)->update(['status' => $status]);
return json(["code" => 0, "msg" => "状态修改成功"]);
} else {
return json(["code" => 1, "msg" => "无效的状态值"]);
}
}
public function editdetailitem($id)
{
$reimbursementLists = ReimbursementList::where('id', $id)
->field('id, pid, times, department, project, cate, price, creater, haveticket, tickets, remark, create_time')
->find();
// print_r($reimbursementLists);
if ($reimbursementLists) {
// 获取发生时间
$times = $reimbursementLists['times'];
// 获取部门名称
$department = DepartmentList::where('id', $reimbursementLists['department'])->value('title');
// 获取创建者名称
$creater = Admin::where('id', $reimbursementLists['creater'])->value('name');
// print_r($creater);
if ($times) {
$timesDate = date('Y年m月d日', strtotime($times));
$reimbursementLists['times'] = $timesDate;
}
if ($department) {
$reimbursementLists['department'] = $department;
}
if ($creater) {
$reimbursementLists['creater'] = $creater;
}
if ($reimbursementLists) {
View::assign('detail', $reimbursementLists);
} else {
View::assign('message', '没有详细数据');
}
}
return view();
// return $reimbursementLists;
}
//编辑锁定状态
public function editlock($id, $lock)
{
$validStatus = ['未锁定', '锁定'];
if (in_array($lock, $validStatus)) {
ReimbursementOrderList::where('id', $id)->update(['lock' => $lock]);
return json(["code" => 0, "msg" => "状态修改成功"]);
} else {
return json(["code" => 1, "msg" => "无效的状态值"]);
}
}
//增加费用类型（app端）
public function addexpensetype()
{
$param = get_params();
if (request()->isPost()) {
$sid = ReimbursementCategory::strict(false)->field(true)->insertGetId($param);
if ($sid) {
add_log('add', $sid, $param);
return json(["code" => 0, "msg" => "添加成功"]); // 返回JSON格式数据
} else {
return json(["code" => 1, "msg" => "添加失败"]); // 返回JSON格式数据
}
} else {
$id = isset($param['id']) ? $param['id'] : 0;
if ($id > 0) {
$businessinfoLists = ReimbursementCategory::where('id', $id)
->field('id, name')
->find();
if (empty($businessinfoLists)) {
return json(["code" => 1, "msg" => "信息不存在"]); // 返回JSON格式数据
}
}
json(["code" => 0, "msg" => "编辑成功"]); // 返回JSON格式数据
}
}
}
app/reimbursement/controller/Nav.php
+24
View File
@@ -0,0 +1,24 @@
<?php
/**
* @copyright Copyright (c) 2023-2024 美天智能科技
* @author 李志强
* @link http://www.meteteme.com
*/
declare(strict_types=1);
namespace app\application\controller;
use app\base\BaseController;
use app\model\Application as ApplicationList;
use app\application\validate\ApplicationCheck;
use think\exception\ValidateException;
use think\facade\Db;
use think\facade\View;
class Nav extends BaseController
{
public function index(){
return view();
}
}
app/reimbursement/event.php
+5
View File
@@ -0,0 +1,5 @@
<?php
// 这是系统自动生成的event定义文件
return [
];
app/reimbursement/middleware.php
+16
View File
@@ -0,0 +1,16 @@
<?php
/**
* @copyright Copyright (c) 2023-2024 美天智能科技
* @author 李志强
* @link http://www.meteteme.com
*/
// 这是系统自动生成的middleware定义文件
return [
//开启session中间件
'think\middleware\SessionInit',
//验证勾股DEV是否完成安装
\app\home\middleware\Install::class,
//允许跨域的请求
\think\middleware\AllowCrossDomain::class,
];
app/reimbursement/validate/ReimbursementCheck.php
+32
View File
@@ -0,0 +1,32 @@
<?php
namespace app\application\validate;
use think\facade\Db;
use think\Validate;
class ReimbursementCheck extends Validate
{
// 自定义验证规则
protected function checkOne($value, $rule, $data = [])
{
// $count = Db::name('Application')->where(['id' => $data['name'], 'delete_time' => 0])->count();
// return $count == 0 ? true : false;
}
protected $rule = [
'maincontact' => 'require|checkOne',
'id' => 'require',
];
protected $message = [
// 'name.require' => '联系人姓名不能为空',
// 'name.checkOne' => '同样的商务信息已经存在',
// 'maincontact.checkOne' => '同样的商务信息已经存在',
'id.require' => '缺少更新条件',
];
protected $scene = [
// 'add' => ['name'],
'edit' => ['id'],
];
}
app/reimbursement/view/index/add copy.html
+242
View File
@@ -0,0 +1,242 @@
<style>
.layui-table-cell {
overflow: visible;
text-overflow: inherit;
height: auto !important;
line-height: 38px;
}
.layui-table-box {
min-height: 400px !important;
}
.layui-table-body {
height: 400px;
}
</style>
<form class="layui-form page-content p-4">
<h3 class="h3-title">新建报销</h3>
<div class="p-4 border-b">
<h3 class="h3-title hover">
<span>基本信息</span>
</h3>
</div>
<div class="layui-row border-b">
<table class="layui-table layui-table-form">
<tr>
<td class="layui-td-gray-2">账单编号<font>*</font>
</td>
<td>
<input type="text" name="order" lay-verify="required" disabled class="layui-input"
value="{{ generateBillNumber() }}" />
</td>
<td class="layui-td-gray-2">隶属部门<font>*</font>
</td>
<td colspan="3">
<select name="department" lay-verify="required" lay-reqText="请选择项目类型" class="layui-select" lay-search=""
lay-filter="department"></select>
</td>
</tr>
<tr>
<td class="layui-td-gray-2">隶属项目<font>*</font>
</td>
<td colspan="4">
<select name="project" lay-verify="required" lay-reqText="请选择项目类型" class="layui-select" lay-search=""
lay-filter="project"></select>
</td>
</tr>
<tr>
<td class="layui-td-gray-2">备注
</td>
<td colspan="4">
<textarea name="schedule" lay-verify="" lay-reqText="请输入" placeholder="请输入备注" class="layui-textarea" value=""
rows="1"></textarea>
</td>
</tr>
</table>
</div>
<div class="p-4 border-b">
<h3 class="h3-title hover">
<span>报销信息</span>
<button class="layui-btn layui-btn-normal" id="addRowBtn">增加条目</button>
</h3>
</div>
<div class="layui-row border-b">
<table class="layui-table" id="editableTable"></table>
</div>
<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>
<!-- 模态框 -->
<div id="myModal" style="display:none;">
<div class="layui-form layui-form-pane" style="padding: 20px;">
<!-- 在这里放置你的表单内容 -->
<div class="layui-form-item">
<label class="layui-form-label">报销类别</label>
<div class="layui-input-block">
<select name="reimcate" lay-verify="required">
<option value=""></option>
<!-- 这里放置报销类别的选项 -->
</select>
</div>
</div>
<!-- 其他表单项 -->
</div>
</div>
<script>
//生成账单编号
function generateBillNumber() {
var currentDate = new Date();
var year = currentDate.getFullYear().toString().slice(-2);
var month = ('0' + (currentDate.getMonth() + 1)).slice(-2);
var day = ('0' + currentDate.getDate()).slice(-2);
var hours = ('0' + currentDate.getHours()).slice(-2);
var minutes = ('0' + currentDate.getMinutes()).slice(-2);
var seconds = ('0' + currentDate.getSeconds()).slice(-2);
var milliseconds = ('00' + currentDate.getMilliseconds()).slice(-3);
return year + month + day + hours + minutes + seconds + milliseconds;
}
// 修改生成账单编号的函数，直接设置到对应的input元素的value属性上
function setBillNumber() {
var billNumber = generateBillNumber();
document.querySelector('input[name="order"]').value = billNumber;
}
// 调用函数设置账单编号
setBillNumber();
</script>
<script>
layui.use(["form", "layer", "table", "jquery"], function () {
var form = layui.form,
layer = layui.layer,
table = layui.table,
$ = layui.jquery;
// 初始化表格
var editableTable = table.render({
elem: '#editableTable',
cols: [[
{
field: 'cate', title: '报销类别', templet: function (d) {
return `<select name="reimcate${d.LAY_INDEX}" class="layui-select" lay-filter="reimcateSelects"></select>`;
}
},
{ field: 'price', title: '报销金额', edit: 'text' },
{ field: 'haveticket', title: '是否有票', edit: 'text' },
{ field: 'tickets', title: '发票查看', edit: 'text' },
{ field: 'remark', title: '备注', edit: 'text' },
{ fixed: 'right', title: "操作", align: "center", toolbar: "#barDemo" },
]],
data: []
});
// 点击按钮打开模态框
$("#addRowBtn").on("click", function (event) {
event.preventDefault(); // 阻止默认的点击行为
layer.open({
type: 2,
title: '新增条目',
shade: 0.8,
area: ['70%', '90%'], // 宽高
content: '/reimbursement/index/additem',//
success: function (layero, index) {
// 弹出层加载成功后的回调，可在此处进行其他操作
}
});
});
// 获取项目类别
fetch("/reimbursement/index/getproject")
.then((response) => response.json())
.then((data) => {
var select = document.querySelector('select[name="project"]');
select.innerHTML = '<option value="">请选择项目类型</option>';
data.data.forEach((project) => {
var option = document.createElement("option");
option.value = project.id;
option.innerText = project.project;
select.appendChild(option);
});
form.render("select");
})
.catch((error) => {
console.error("Error:", error);
});
// 获取部门
fetch("/reimbursement/index/getdepartment")
.then((response) => response.json())
.then((data) => {
var select = document.querySelector('select[name="department"]');
select.innerHTML = '<option value="">请选择项目类型</option>';
data.data.forEach((department) => {
var option = document.createElement("option");
option.value = department.id;
option.innerText = department.department;
select.appendChild(option);
});
form.render("select");
})
.catch((error) => {
console.error("Error:", error);
});
// 获取报销类别
// fetch("/reimbursement/index/reimcate")
// .then((response) => response.json())
// .then((data) => {
// var select = document.querySelector('select[name="reimcate"]');
// select.innerHTML = '<option value="">请选择项目类型</option>';
// data.data.forEach((reimcate) => {
// var option = document.createElement("option");
// option.value = reimcate.id;
// option.innerText = reimcate.reimcate;
// select.appendChild(option);
// });
// form.render("select");
// })
// .catch((error) => {
// console.error("Error:", error);
// });
// 监听提交事件
form.on("submit(webform)", function (data) {
// 发送请求并处理响应
fetch("/reimbursement/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 === 2) {
setTimeout(function () {
document.querySelector("form").reset(); // Reset the form
location.reload(); // 刷新页面
}, 1000);
}
});
return false;
});
});
</script>
<script type="text/html" id="barDemo">
<a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="delete">删除</a>
</script>
app/reimbursement/view/index/add.html
+158
View File
@@ -0,0 +1,158 @@
<form class="layui-form page-content p-4">
<h3 class="h3-title">新建报销</h3>
<div class="p-4 border-b">
<h3 class="h3-title hover">
<span>基本信息</span>
</h3>
</div>
<div class="layui-row border-b">
<table class="layui-table layui-table-form">
<tr>
<td class="layui-td-gray-2">账单编号<font>*</font>
</td>
<td>
<input type="text" name="order" lay-verify="required" disabled class="layui-input"
value="{{ generateBillNumber() }}" />
</td>
<td class="layui-td-gray-2">隶属部门<font>*</font>
</td>
<td colspan="3">
<select name="department" lay-verify="required" lay-reqText="请选择项目类型" class="layui-select" lay-search=""
lay-filter="department"></select>
</td>
</tr>
<tr>
<td class="layui-td-gray-2">创建者
</td>
<td colspan="4">
<input type="hidden" name="creater" lay-verify="required" disabled class="layui-input" value="" />
<input type="text" name="creatername" required disabled class="layui-input" value="" />
</td>
</tr>
<tr>
<td class="layui-td-gray-2">备注
</td>
<td colspan="4">
<textarea name="schedule" lay-verify="" lay-reqText="请输入" placeholder="请输入备注" class="layui-textarea" value=""
rows="1"></textarea>
</td>
</tr>
</table>
</div>
<div class="pt-1">
<button class="layui-btn layui-btn-normal" lay-submit="" lay-filter="webform">
立即提交
</button>
</div>
</form>
<script>
//生成账单编号
function generateBillNumber() {
var currentDate = new Date();
var year = currentDate.getFullYear().toString().slice(-2);
var month = ('0' + (currentDate.getMonth() + 1)).slice(-2);
var day = ('0' + currentDate.getDate()).slice(-2);
var hours = ('0' + currentDate.getHours()).slice(-2);
var minutes = ('0' + currentDate.getMinutes()).slice(-2);
var seconds = ('0' + currentDate.getSeconds()).slice(-2);
var milliseconds = ('00' + currentDate.getMilliseconds()).slice(-3);
return year + month + day + hours + minutes + seconds + milliseconds;
}
// 修改生成账单编号的函数，直接设置到对应的input元素的value属性上
function setBillNumber() {
var billNumber = generateBillNumber();
document.querySelector('input[name="order"]').value = billNumber;
}
// 调用函数设置账单编号
setBillNumber();
</script>
<script>
layui.use(["form"], function () {
var form = layui.form;
// 获取项目类别
// fetch("/reimbursement/index/getproject")
// .then((response) => response.json())
// .then((data) => {
// var select = document.querySelector('select[name="project"]');
// select.innerHTML = '<option value="">请选择项目类型</option>';
// data.data.forEach((project) => {
// var option = document.createElement("option");
// option.value = project.id;
// option.innerText = project.project;
// select.appendChild(option);
// });
// form.render("select");
// })
// .catch((error) => {
// console.error("Error:", error);
// });
// 获取部门
fetch("/reimbursement/index/getdepartment")
.then((response) => response.json())
.then((data) => {
var select = document.querySelector('select[name="department"]');
select.innerHTML = '<option value="">请选择项目类型</option>';
data.data.forEach((department) => {
var option = document.createElement("option");
option.value = department.id;
option.innerText = department.department;
select.appendChild(option);
});
form.render("select");
})
.catch((error) => {
console.error("Error:", error);
});
// 获取创建者
const apiUrl = '/reimbursement/index/getcreater';
fetch(apiUrl)
.then(response => {
if (!response.ok) {
throw new Error('接口反馈有误！');
}
return response.json();
})
.then(data => {
// 假设返回的数据中创建者的名字存储在 data.createrId
document.querySelector('input[name="creater"]').value = data.createrId;
document.querySelector('input[name="creatername"]').value = data.createrName;
})
.catch(error => {
console.error('获取操作出现问题:', error);
});
// 监听提交事件
form.on("submit(webform)", function (data) {
// 发送请求并处理响应
fetch("/reimbursement/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 === 2) {
setTimeout(function () {
document.querySelector("form").reset(); // Reset the form
location.reload(); // 刷新页面
}, 1000);
}
});
return false;
});
});
</script>
app/reimbursement/view/index/additem.html
+385
View File
@@ -0,0 +1,385 @@
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title></title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<link rel="stylesheet" href="/static/assets/gougu/css/gougu.css">
<!-- <link rel="stylesheet" href="/static/assets/gougu/css/layout.css"> -->
<style>
.close {
width: 100%;
height: 80px;
display: flex;
align-items: center;
justify-content: center;
}
</style>
</head>
<body>
<form action="">
<div class="page-content">
<div class="p-4 border-b">
<h3 class="h3-title hover">
<span>增加报销</span>
</h3>
<!-- pid等参数 -->
<input type="text" name="pid" lay-verify="" class="layui-input" value="" id="pid" style="display: none;" />
<input type="text" name="department" lay-verify="" class="layui-input" value="" id="department"
style="display: none;" />
<input type="text" name="project" lay-verify="" class="layui-input" value="" id="project"
style="display: none;" />
<input type="text" name="dates" lay-verify="" class="layui-input" value="" id="dates" style="display: none;" />
</div>
<div class="layui-row border-b">
<table class="layui-table layui-table-form">
<tr>
<td class="layui-td-gray-2">费用类型
</td>
<td>
<select name="cate" lay-verify="required" lay-reqText="请选择费用类型" class="layui-select" lay-search
lay-filter="cate" style="width: 100%;" id="cate"></select>
</td>
<td class="layui-td-gray-2">隶属项目
</td>
<td>
<select name="project" lay-verify="required" class="layui-select" lay-search=""
lay-filter="project" style="width: 100%;" id="project"></select>
</td>
</tr>
<tr>
<td class="layui-td-gray-2">报销金额
</td>
<td>
<input type="text" name="price" lay-verify="" lay-reqText="请填入报销金额，例如：52.00"
placeholder="请填入报销金额，例如：52.00" class="layui-input" value="" id="price" />
</td>
<td class="layui-td-gray-2">是否有票
</td>
<td>
<select name="haveticket" lay-verify="required" lay-reqText="请选择" class="layui-select" lay-search
lay-filter="haveticket" style="width: 100%;">
<option value="">请选择</option>
<option value="无">无</option>
<option value="有">有</option>
</select>
</td>
</tr>
<tr>
<td class="layui-td-gray-2">发生时间
</td>
<td>
<div class="layui-input-inline">
<input type="text" name="times" class="layui-input" id="times" placeholder="yyyy年MM月dd日">
</div>
</td>
</tr>
<tr>
<td class="layui-td-gray-2">上传票据
</td>
<td colspan="4">
<input type="hidden" name="tickets" id="ticketsInput" value="">
<div id="no-ticket-msg" style="color: red;">当前无票，不可上传</div>
<div class="layui-upload-drag" style="display: block;" id="ID-upload-demo-drag">
<i class="layui-icon layui-icon-upload"></i>
<div>点击上传，或将文件拖拽到此处</div>
<div class="layui-hide" id="tickets">
<hr> <img src="{{#tickets}}" alt="上传成功后渲染" style="max-width: 100%">
</div>
</div>
</td>
</tr>
<tr>
<td class="layui-td-gray-2">上传附件
</td>
<td colspan="4">
<div class="layui-upload">
<button type="button" class="layui-btn layui-btn-normal" id="uploadfile">选择多文件</button>
<div class="layui-upload-list">
<table class="layui-table">
<colgroup>
<col style="min-width: 100px;">
<col width="150">
<col width="260">
<col width="150">
</colgroup>
<thead>
<th>文件名</th>
<th>大小</th>
<th>上传进度</th>
<th>操作</th>
</thead>
<tbody id="update"></tbody>
</table>
</div>
<button type="button" class="layui-btn" id="uploadfileaction">开始上传</button>
</div>
</td>
</tr>
<tr>
<td class="layui-td-gray-2">备注
</td>
<td colspan="4">
<input type="text" name="remark" lay-verify="" lay-reqText="" placeholder="" class="layui-input" value=""
id="remark" />
</td>
</tr>
</table>
</div>
</div>
<div class="close">
<button class="layui-btn layui-btn-normal" lay-submit="" lay-filter="webform">
立即提交
</button>
</div>
</form>
</body>
<script>
// 获取URL参数中的pid的值
const urlParams = new URLSearchParams(window.location.search);
const pidValue = urlParams.get('pid');
const departmentValue = urlParams.get('department');
const projectValue = urlParams.get('project');
// 将获取的日期时间数据格式转换为日期数据格式
const datesValue = urlParams.get('dates');
const dates = new Date(datesValue);
console.log(dates);
const formattedDate = dates.toISOString().split('T')[0];
// 将pid的值设置给id为pid的input元素
document.getElementById('pid').value = pidValue;
document.getElementById('department').value = departmentValue;
document.getElementById('project').value = projectValue;
document.getElementById('dates').value = formattedDate;
// 获取是否有票选择框元素
const haveticketSelect = document.querySelector('select[name="haveticket"]');
// 获取上传票据区域元素
const uploadSection = document.querySelector('#ID-upload-demo-drag');
// 获取无票提示信息元素
const noTicketMsg = document.getElementById('no-ticket-msg');
// 初始隐藏上传票据区域
uploadSection.style.display = 'none';
// 监听是否有票选择框的change事件
haveticketSelect.addEventListener('change', function () {
// 如果选择了有票
if (haveticketSelect.value === '有') {
// 显示上传票据区域
uploadSection.style.display = 'block';
// 隐藏无票提示信息
noTicketMsg.style.display = 'none';
} else {
// 否则隐藏上传票据区域
uploadSection.style.display = 'none';
// 显示无票提示信息
noTicketMsg.style.display = 'block';
}
});
</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 form = layui.form;
var layer = layui.layer;
var upload = layui.upload;
var element = layui.element;
var laydate = layui.laydate;
upload.render({
elem: '#ID-upload-demo-drag',
url: '/api/index/upload',
done: function (res) {
layer.msg('上传成功');
// 将图片路径赋值给隐藏的 input 元素
document.getElementById('ticketsInput').value = res.data.filepath;
console.log(res);
}
});
// 获取项目类别
fetch("/reimbursement/index/getproject")
.then((response) => response.json())
.then((data) => {
var select = document.querySelector('select[name="project"]');
select.innerHTML = '<option value=""></option>';
data.data.forEach((project) => {
var option = document.createElement("option");
option.value = project.id;
option.innerText = project.project;
select.appendChild(option);
});
form.render("select");
})
.catch((error) => {
console.error("Error:", error);
});
//渲染日期选择
laydate.render({
elem: '#times',
format: 'yyyy年MM月dd日',
done: function(value){
console.log('您选择的日期是：' + value);
times = value.replace(/年|月/g, '-').replace('日', '');
}
});
// 上传附件渲染
// 制作多文件上传表格
var uploadListIns = upload.render({
elem: '#uploadfile',
elemList: $('#update'),
url: '/api/index/upload',
accept: 'file',
multiple: true,
number: 3,
auto: false,
bindAction: '#uploadfileaction',
choose: function (obj) {
var that = this;
var files = this.files = obj.pushFile();
// 读取本地文件
obj.preview(function (index, file, result) {
var tr = $('<tr id="upload-' + index + '">' +
'<td>' + file.name + '</td>' +
'<td>' + (file.size / 1024).toFixed(1) + 'kb</td>' +
'<td><div class="layui-progress" lay-filter="progress-demo-' + index + '"><div class="layui-progress-bar" lay-percent=""></div></div></td>' +
'<td>' +
'<button class="layui-btn layui-btn-xs demo-reload layui-hide">重传</button>' +
'<button class="layui-btn layui-btn-xs layui-btn-danger demo-delete">删除</button>' +
'</td>' +
'</tr>');
// 单个重传
tr.find('.demo-reload').on('click', function () {
obj.upload(index, file);
});
// 删除
tr.find('.demo-delete').on('click', function () {
delete files[index];
tr.remove();
// 清空 input file 值，以免删除后出现同名文件不可选
uploadListIns.config.elem.next()[0].value = '';
});
$('#update').append(tr);
element.render('progress');
});
},
done: function (res, index, upload) {
var that = this;
var tr = $('#update').find('tr#upload-' + index);
var tds = tr.children();
tds.eq(3).html('');
delete this.files[index];
return;
//}
this.error(index, upload);
},
allDone: function (obj) {
console.log(obj);
},
error: function (index, upload) {
var that = this;
var tr = $('#update').find('tr#upload-' + index);
var tds = tr.children();
// 显示重传
tds.eq(3).find('.demo-reload').removeClass('layui-hide');
},
progress: function (n, elem, e, index) {
element.progress('progress-demo-' + index, n + '%');
}
});
// 获取费用类型
fetch("/reimbursement/index/reimcate")
.then((response) => response.json())
.then((data) => {
var select = document.querySelector('select[name="cate"]');
select.innerHTML = '<option value="">请选择费用类型</option>';
data.data.forEach((cate) => {
var option = document.createElement("option");
option.value = cate.id;
option.innerText = cate.cate;
select.appendChild(option);
});
form.render("select");
})
.catch((error) => {
console.error("Error:", error);
});
//监听提交结果
form.on("submit(webform)", function (data) {
fetch("/reimbursement/index/additem", {
method: "POST",
body: JSON.stringify({
pid: document.getElementById('pid').value,
project: document.querySelector('select[name="project"]').value,
department: document.getElementById('department').value,
cate: document.querySelector('select[name="cate"]').value,
haveticket: document.querySelector('select[name="haveticket"]').value,
price: document.getElementById('price').value,
remark:document.getElementById('remark').value,
times: times,
// 使用隐藏的 input 元素的值
tickets: document.getElementById('ticketsInput').value,
}),
headers: {
"Content-Type": "application/json",
},
})
.then((response) => response.json())
.then((result) => {
// 显示提示消息
layer.msg(result.msg, {
time: 1000,
end: function () {
// 检查后端返回的 code，如果等于 2 则关闭 #additem 的 layer
if (result.code === 2) {
var index = window.parent.layer.getFrameIndex(window.name);
window.parent.layer.close(index);
// 向父页面返回值999
if (window.parent.opener) {
window.parent.opener.returnValue = 999;
console.log(window.parent.opener.returnValue);
} else {
console.log("No parent opener found.");
}
}
}
});
});
return false;
});
}
</script>
<script type="text/html" id="barDemo">
<a class="layui-btn layui-btn-xs " lay-event="edit">编辑</a>
<a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="delete">删除</a>
</script>
<script src="/static/assets/layui/layui.js"></script>
<script src="/static/assets/gougu/gouguInit.js"></script>
app/reimbursement/view/index/edit.html
+121
View File
@@ -0,0 +1,121 @@
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title></title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<link rel="stylesheet" href="/layui/css/layui.css" media="all" />
<style>
body{margin: 10px;}
</style>
</head>
<body class="childrenBody">
<form class="layui-form changePwd">
<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 type="text/javascript" src="/layui/layui.js"></script>
<script type="text/javascript" src="/js/jquery-3.3.1.min.js"></script>
<script>
$(function(){
var id = $("#id").val();
if(id != ""){
$.ajax({
url: "/user/queryById",
data:{"id":id},
dataType:"json",
success: function(data){
$("#name").val(data.name);
$("#age").val(data.age);
$("input[name='sex']").eq(data.sex).attr("checked",'checked');
},error:function(){
}
});
}
})
function layerclose() {
layui.use(['layer' ], function() {
var layer = layui.layer;
var index=parent.layer.getFrameIndex(window.name);//获取当前弹出层的层级
parent.layer.close(index);//关闭弹出层
location.reload();//刷新父页面
})
}
layui.use(['form','layer' ], function() {
var form = layui.form;
var layer = layui.layer;
// 添加验证规则
form.verify({
name : function(value, item) {
value = value.trim();
if (value.length < 0) {
return "请输入教师名称";
}
}
});
form.on('submit(*)', function(data) {
var index = layer.msg('提交中，请稍候',{icon: 16,time:false,shade:0.8});
var d = data.field;
var url = "/user/add";
if(d.id != ""){
url = "/user/edit";
}
$.ajax({
url: url,
data:d,
dataType:"text",
success: function(data){
layer.close(index);
if(data == 0){
layer.msg("保存成功！");
parent.queryTea();
parent.close();
}else{
layer.msg("保存失败！");
}
},error:function(){
layer.close(index);
layer.msg("保存失败！");
}
});
return false;
});
});
</script>
</body>
</html>
app/reimbursement/view/index/editdetailitem.html
+349
View File
@@ -0,0 +1,349 @@
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title></title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<link rel="stylesheet" href="/static/assets/gougu/css/gougu.css">
<style>
.close {
width: 100%;
height: 80px;
display: flex;
align-items: center;
justify-content: center;
}
</style>
</head>
<body>
<form action="">
<div class="page-content">
<div class="p-4 border-b">
<h3 class="h3-title hover">
<span>项目编号 - </span><span>{$detail.id}</span>
</h3>
<input type="text" name="pid" lay-verify="" class="layui-input" value="{$detail.pid}" id="pid"
style="display: none;"/>
<input type="text" name="department" lay-verify="" class="layui-input" value="{$detail.department}"
id="department" style="display: none;"/>
<input type="text" name="project" lay-verify="" class="layui-input" value="{$detail.project}"
id="project" style="display: none;"/>
<input type="text" name="dates" lay-verify="" class="layui-input" value="" id="dates"
style="display: none;"/>
<input type="text" name="id" lay-verify="" class="layui-input" value="{$detail.id}" id="id"
style="display: none;"/>
</div>
<div class="layui-row border-b">
<table class="layui-table layui-table-form">
<tr>
<td class="layui-td-gray-2">费用类型</td>
<td>
<select name="cate" lay-verify="required" lay-reqText="请选择费用类型" class="layui-select"
lay-search lay-filter="cate" style="width: 100%;" id="cate">
<option value="">请选择费用类型</option>
</select>
</td>
<td class="layui-td-gray-2">隶属项目</td>
<td>
<select name="project" lay-verify="required" lay-reqText="请选择隶属项目" class="layui-select"
lay-search lay-filter="cate" style="width: 100%;" id="project">
<option value="">请选择隶属项目</option>
</select>
</td>
</tr>
<tr>
<td class="layui-td-gray-2">报销金额</td>
<td>
<input type="text" name="price" lay-verify="" lay-reqText="请填入报销金额，例如：52.00"
placeholder="请填入报销金额，例如：52.00" class="layui-input" value="{$detail.price}"
id="price"/>
</td>
<td class="layui-td-gray-2">是否有票</td>
<td>
<select name="haveticket" lay-verify="required" lay-reqText="请选择" class="layui-select"
lay-search lay-filter="haveticket" style="width: 100%;">
<option value="无">无</option>
<option value="有">有</option>
</select>
</td>
</tr>
<tr>
<td class="layui-td-gray-2">发生时间</td>
<td>
<div class="layui-input-inline">
<input type="text" name="times" class="layui-input" id="times" placeholder="yyyy年MM月dd日"
value="{$detail.times}">
</div>
</td>
</tr>
<tr>
<td class="layui-td-gray-2">上传票据</td>
<td colspan="4">
<input type="hidden" name="tickets" id="ticketsInput" value="{$detail.tickets}">
<div id="no-ticket-msg" style="color: red;">当前无票，不可上传</div>
<div class="layui-upload-drag" style="display: block;" id="ID-upload-demo-drag">
<i class="layui-icon layui-icon-upload"></i>
<div>点击上传，或将文件拖拽到此处</div>
<div class="layui-hide" id="tickets">
<hr>
<img src="{#tickets}" alt="上传成功后渲染" style="max-width: 100%">
</div>
</div>
</td>
</tr>
<tr>
<td class="layui-td-gray-2">上传附件</td>
<td colspan="4">
<div class="layui-upload">
<button type="button" class="layui-btn layui-btn-normal" id="uploadfile">选择多文件</button>
<div class="layui-upload-list">
<table class="layui-table">
<colgroup>
<col style="min-width: 100px;">
<col width="150">
<col width="260">
<col width="150">
</colgroup>
<thead>
<th>文件名</th>
<th>大小</th>
<th>上传进度</th>
<th>操作</th>
</thead>
<tbody id="update"></tbody>
</table>
</div>
<button type="button" class="layui-btn" id="uploadfileaction">开始上传</button>
</div>
</td>
</tr>
<tr>
<td class="layui-td-gray-2">备注</td>
<td colspan="4">
<input type="text" name="remark" lay-verify="" lay-reqText="" placeholder=""
class="layui-input" value="{$detail.remark}" id="remark"/>
</td>
</tr>
</table>
</div>
</div>
<div class="close">
<button class="layui-btn layui-btn-normal" lay-filter="webform" lay-submit="">
立即提交
</button>
</div>
</form>
</body>
<script>
const moduleInit = ["tool", "gouguEdit", "gouguComment"];
function gouguInit() {
var table = layui.table;
var tool = layui.tool;
var dropdown = layui.dropdown;
var $ = layui.jquery;
var form = layui.form;
var layer = layui.layer;
var upload = layui.upload;
var element = layui.element;
var laydate = layui.laydate;
upload.render({
elem: '#ID-upload-demo-drag',
url: '/api/index/upload',
done: function (res) {
layer.msg('上传成功');
// 将图片路径赋值给隐藏的 input 元素
document.getElementById('ticketsInput').value = res.data.filepath;
console.log(res);
}
});
// 获取项目类别
fetch("/reimbursement/index/getproject")
.then((response) => response.json())
.then((data) => {
var select = document.querySelector('select[name="project"]');
select.innerHTML = '<option value="">请选择项目类型</option>';
data.data.forEach((project) => {
var option = document.createElement("option");
option.value = project.id;
option.innerText = project.project;
select.appendChild(option);
});
select.value = '{$detail.project}';
form.render("select");
})
.catch((error) => {
console.error("Error:", error);
});
//渲染日期选择
// laydate.render({
// elem: '#times',
// format: 'yyyy年MM月dd日',
// done: function (value) {
// console.log('您选择的日期是：' + value);
// times = value.replace(/年|月/g, '-').replace('日', '');
// }
// });
// 上传附件渲染
// 制作多文件上传表格
var uploadListIns = upload.render({
elem: '#uploadfile',
elemList: $('#update'),
url: '/api/index/upload',
accept: 'file',
multiple: true,
number: 3,
auto: false,
bindAction: '#uploadfileaction',
choose: function (obj) {
var that = this;
var files = this.files = obj.pushFile();
// 读取本地文件
obj.preview(function (index, file, result) {
var tr = $('<tr id="upload-' + index + '">' +
'<td>' + file.name + '</td>' +
'<td>' + (file.size / 1024).toFixed(1) + 'kb</td>' +
'<td><div class="layui-progress" lay-filter="progress-demo-' + index + '"><div class="layui-progress-bar" lay-percent=""></div></div></td>' +
'<td>' +
'<button class="layui-btn layui-btn-xs demo-reload layui-hide">重传</button>' +
'<button class="layui-btn layui-btn-xs layui-btn-danger demo-delete">删除</button>' +
'</td>' +
'</tr>');
// 单个重传
tr.find('.demo-reload').on('click', function () {
obj.upload(index, file);
});
// 删除
tr.find('.demo-delete').on('click', function () {
delete files[index];
tr.remove();
// 清空 input file 值，以免删除后出现同名文件不可选
uploadListIns.config.elem.next()[0].value = '';
});
$('#update').append(tr);
element.render('progress');
});
},
done: function (res, index, upload) {
var that = this;
var tr = $('#update').find('tr#upload-' + index);
var tds = tr.children();
tds.eq(3).html('');
delete this.files[index];
return;
//}
this.error(index, upload);
},
allDone: function (obj) {
console.log(obj);
},
error: function (index, upload) {
var that = this;
var tr = $('#update').find('tr#upload-' + index);
var tds = tr.children();
// 显示重传
tds.eq(3).find('.demo-reload').removeClass('layui-hide');
},
progress: function (n, elem, e, index) {
element.progress('progress-demo-' + index, n + '%');
}
});
// 获取费用类型
fetch("/reimbursement/index/reimcate")
.then((response) => response.json())
.then((data) => {
var select = document.querySelector('select[name="cate"]');
select.innerHTML = '<option value="">请选择费用类型</option>';
data.data.forEach((cate) => {
var option = document.createElement("option");
option.value = cate.id;
option.innerText = cate.cate;
select.appendChild(option);
});
select.value = '{$detail.cate}';
form.render("select");
})
.catch((error) => {
console.error("Error:", error);
});
//监听提交结果
form.on("submit(webform)", function (data) {
fetch("/reimbursement/index/edititem", {
method: "POST",
body: JSON.stringify({
id: document.getElementById('id').value,
pid: document.getElementById('pid').value,
project: document.querySelector('select[name="project"]').value,
department: document.getElementById('department').value,
cate: document.querySelector('select[name="cate"]').value,
haveticket: document.querySelector('select[name="haveticket"]').value,
price: document.getElementById('price').value,
remark: document.getElementById('remark').value,
times: document.getElementById('times').value,
tickets: document.getElementById('ticketsInput').value,
}),
headers: {
"Content-Type": "application/json",
},
})
.then((response) => response.json())
.then((result) => {
layer.msg(result.msg, {
time: 1000,
end: function () {
if (result.code === 0) {
var index = window.parent.layer.getFrameIndex(window.name);
window.parent.layer.close(index);
window.parent.layui.table.reload('reimbursementdetail'); // 刷新表格
}
}
});
});
return false;
});
}
</script>
<script>
// 获取是否有票选择框元素
const haveticketSelect = document.querySelector('select[name="haveticket"]');
// 获取上传票据区域元素
const uploadSection = document.querySelector('#ID-upload-demo-drag');
// 获取无票提示信息元素
const noTicketMsg = document.getElementById('no-ticket-msg');
// 初始隐藏上传票据区域
uploadSection.style.display = 'none';
// 监听是否有票选择框的change事件
haveticketSelect.addEventListener('change', function () {
// 如果选择了有票
if (haveticketSelect.value === '有') {
// 显示上传票据区域
uploadSection.style.display = 'block';
// 隐藏无票提示信息
noTicketMsg.style.display = 'none';
} else {
// 否则隐藏上传票据区域
uploadSection.style.display = 'none';
// 显示无票提示信息
noTicketMsg.style.display = 'block';
}
});
</script>
<script src="/static/assets/layui/layui.js"></script>
<script src="/static/assets/gougu/gouguInit.js"></script>
app/reimbursement/view/index/index.html
+257
View File
@@ -0,0 +1,257 @@
{extend name="../../base/view/common/base" /}
<!-- 主体 -->
{block name="breadcrumb"}
<span class="layui-breadcrumb">
<a href="http://www.meteteme.com/" target="_blank">江苏美天科技</a>
<a href="/application/nav/index"><cite>应用</cite></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-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>
</div>
<table class="layui-hide" id="reimbursement" lay-filter="reimbursement"></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("/reimbursement/index/add");
});
layui.table.on('checkbox(reimbursement)', function (obj) {
var checkStatus = layui.table.checkStatus('reimbursement');
var data = checkStatus.data;
// 修改开始：计算合计金额并显示
var totalPrice = data.reduce((acc, curr) => acc + parseFloat(curr.price || 0), 0).toFixed(2); // 确保结果为两位小数
document.getElementById('total-price').innerText = '合计金额：￥' + totalPrice;
// 修改结束
});
//查看详情唤醒view界面
table.on('tool(reimbursement)', function (obj) {
var data = obj.data; // 获取当前行的数据
// console.log(data);
if (obj.event === 'view') {
var id = data.id; // 获取当前行数据的id
// console.log(id);
// 使用layer弹出层来显示详情页面
layui.layer.open({
type: 2, // iframe层
title: '报销详情',
shadeClose: true,
shade: 0.8,
area: ['70%', '90%'], // 宽高
content: '/reimbursement/index/view?id=' + id,
end: function () {
// 弹出层关闭时刷新当前页面
layui.table.reload('reimbursement');
}
});
} else if (obj.event === 'delete') {
layui.layer.confirm(
"确定删除该条数据吗？",
{ icon: 3, title: "提示" },
function (index) {
$.post(
"/reimbursement/index/delete",
{ id: data.id },
function (res) {
if (res.code === 1) {
layui.layer.confirm("该表单含有内部数据，确定要删除吗？", { icon: 3, title: "提示" }, function (innerIndex) {
$.post(
"/reimbursement/index/delete",
{ id: data.id },
function (innerRes) {
if (innerRes.code === 1) {
layui.layer.msg("删除成功");
obj.del(); // 删除行数据
} else {
layui.layer.msg(innerRes.msg);
}
}
);
layui.layer.close(innerIndex);
});
} else if (res.code === 0) {
layui.layer.msg("删除成功");
obj.del(); // 删除行数据
} else {
layui.layer.msg(res.msg);
}
}
);
layui.layer.close(index);
}
);
}
});
//批量删除数据
$("#batch_delete").on("click", function () {
var checkStatus = table.checkStatus('reimbursement');
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(
"/reimbursement/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);
}
);
});
// 重载表格
function loadTableData() {
layui.pageTable.reload();
}
// 渲染表格
layui.pageTable = layui.table.render({
elem: "#reimbursement",
toolbar: '#toolbarDemo',
defaultToolbar: ['filter', 'exports', 'print', {
title: '计划列表',
layEvent: 'LAYTABLE_TIPS',
icon: 'layui-icon-tips'
}],
cellMinWidth: 80,
url: "/reimbursement/index/index", // 数据接口
page: true,
limit: 50,
// totalRow: true,
cols: [
[
{ type: 'checkbox' },
{ field: 'id', width: 80, title: '编号', sort: true, align: "center", totalRowText: '合计：' },
{
field: "order",
title: "账单编号",
align: "center",
width: 180,
rowspan: 2,
templet: function (d) {
var html =
'<span class="a1-' + d.order + '">' + d.order + "</span>";
return html;
},
},
{
field: "create_time",
title: "创建时间",
align: "center",
width: 180,
rowspan: 2,
},
{
field: "status",
title: "报销状态",
align: "center",
width: 120,
rowspan: 2,
},
{
field: "lock",
title: "账单状态",
align: "center",
width: 120,
rowspan: 2,
},
{
field: "department",
title: "隶属部门",
align: "center",
width: 120,
rowspan: 2,
},
{
field: "total",
title: "报销金额",
width: 120,
align: "center",
rowspan: 2,
},
{
field: "creater",
title: "创建者",
width: 120,
align: "center",
rowspan: 2,
},
{
field: "remark",
title: "备注",
align: "center",
rowspan: 2,
},
{
fixed: 'right',
title: "操作",
align: "center",
width: 220,
minWidth: 220,
toolbar: "#barDemo",
},
],
],
});
// 每隔5秒刷新表格数据
// setInterval(function () {
// loadTableData();
// }, 5000);
}
</script>
<script type="text/html" id="barDemo">
<a class="layui-btn layui-btn-xs " id="view" lay-event="view">查看详情</a>
<a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="delete">删除</a>
</script>
{/block}
app/reimbursement/view/index/view.html
+428
View File
@@ -0,0 +1,428 @@
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title></title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<link rel="stylesheet" href="/static/assets/gougu/css/gougu.css">
<style>
.close {
width: 100%;
height: 80px;
display: flex;
align-items: center;
justify-content: center;
}
#statusSelect,
#lockSelect {
display: inline-block;
width: 150px;
}
.status-button {
display: inline-block;
margin-left: 20px;
}
</style>
</head>
<body>
<div class="page-content">
<div class="p-4 border-b">
<h3 class="h3-title hover">
<span>基本信息</span>
</h3>
</div>
<input type="text" value="{$detail.id}" id="pid" style="display: none;">
<div class="layui-row border-b">
<table class="layui-table layui-table-form">
<tr>
<td class="layui-td-gray-2">账单号
</td>
<td>
{$detail.order}
</td>
<td class="layui-td-gray-2">创建时间
</td>
<td>
{$detail.create_time}
</td>
</tr>
<tr>
<td class="layui-td-gray-2">隶属部门
</td>
<td>
{$detail.department}
</td>
<td class="layui-td-gray-2">报销状态
</td>
<td>
{$detail.status}
<a href="javascript:;" onclick="editstatus('{$detail.id}')" style="margin-left: 20px;">修改</a>
</td>
</tr>
<tr>
<td class="layui-td-gray-2">创建者
</td>
<td>
{$detail.creater}
</td>
<td class="layui-td-gray-2">账单状态
</td>
<td>
{$detail.lock}
<a href="javascript:;" onclick="editlock('{$detail.id}')" style="margin-left: 20px;">修改</a>
</td>
</tr>
<tr>
<td class="layui-td-gray-2">备注
</td>
<td colspan="4">
{$detail.remark}
</td>
</tr>
</table>
</div>
<div class="p-4 border-b">
<h3 class="h3-title hover">
<span>详细信息</span>
<span>
<a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="additem" id="additem">增加报销</a>
<a class="layui-btn layui-btn-xs" lay-event="edititem" id="edititem">编辑</a>
<a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="delete" id="delete">删除</a>
</span>
</h3>
</div>
<div class="layui-row border-b">
<table class="layui-table layui-table-form" id="reimbursementdetail"></table>
</div>
</div>
<div class="close">
<button class="layui-btn" onclick="printPage()">打印本页</button>
<button class="layui-btn layui-bg-blue" id="refresh">刷新</button>
</div>
</body>
<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;
var pid = document.getElementById('pid').value;
var project = "{$detail.project}";
var department = "{$detail.department}";
var lock = "{$detail.lock}";
var dates = "{$detail.create_time}";
var currentStatus = "{$detail.status}";
// var id = pid;
// 检查状态并设置按钮状态
if (currentStatus === "已报销") {
$("#additem").prop("disabled", true).addClass("layui-btn-disabled");
$("#edititem").prop("disabled", true).addClass("layui-btn-disabled");
$("#delete").prop("disabled", true).addClass("layui-btn-disabled");
}
//增加报销
$("#additem").on("click", function () {
// 只有在未报销状态下才允许增加报销
if (currentStatus === "已报销") return;
var layerIndex = layui.layer.open({
type: 2,
title: '增加报销',
shadeClose: true,
shade: 0.8,
area: ['70%', '90%'],
content: '/reimbursement/index/additem?pid=' + pid + '&project=' + project + '&department=' + department + '&dates=' + dates,
end: function () {
// 弹出层关闭时刷新当前页面
layui.table.reload('reimbursementdetail');
}
});
});
//修改报销
$("#edititem").on("click", function () {
// 只有在未报销状态下才允许编辑
if (currentStatus === "已报销") return;
var checkStatus = layui.table.checkStatus('reimbursementdetail'); // 获取选中行的状态
var data = checkStatus.data; // 获取选中的数据
if (data.length === 0) {
layer.msg('请先选择要编辑的项'); // 如果没有选中项，提示用户
return;
}
var id = data[0].id; // 获取第一个选中项的 ID
console.log(id);
var layerIndex = layui.layer.open({
type: 2,
title: '编辑报销',
shadeClose: true,
shade: 0.8,
area: ['70%', '90%'],
content: '/reimbursement/index/edititem?id=' + id,
end: function () {
// 弹出层关闭时刷新当前页面
layui.table.reload('reimbursementdetail');
}
});
});
//删除报销
$("#delete").on("click", function () {
// 只有在未报销状态下才允许删除
if (currentStatus === "已报销") return;
layui.layer.confirm("确定删除该内容吗？", {icon: 3, title: "提示"}, function (index) {
var checkStatus = layui.table.checkStatus('reimbursementdetail'); // 获取选中行的状态
var data = checkStatus.data; // 获取选中的数据
if (data.length === 0) {
layer.msg('请先选择要删除的项'); // 如果没有选中项，提示用户
return;
}
var id = data[0].id; // 获取第一个选中项的 ID
$.post("/reimbursement/index/delete", {id: id}, function (res) {
if (res.code === 0) {
layui.layer.msg(res.msg);
layui.table.reload('reimbursementdetail'); // 刷新表格
} else {
layui.layer.msg(res.msg);
}
});
layui.layer.close(index);
});
});
//刷新表格
$("#refresh").on("click", function () {
layui.table.reload('reimbursementdetail', {
url: '/reimbursement/index/viewitem?id=' + pid, // 替换为你的数据接口URL
page: {
curr: 1 // 重新从第一页开始加载
}
});
});
//渲染表格
layui.pageTable = layui.table.render({
elem: "#reimbursementdetail",
// toolbar: '#toolbarDemo',
cellMinWidth: 80,
url: "/reimbursement/index/viewitem?id=" + pid,// 数据接口
page: true,
limit: 50,
totalRow: true,
filter: "reimbursementdetail",
cols: [
[
{type: 'checkbox',},
{
field: 'id',
width: 100,
title: '编号',
sort: true,
align: "center",
totalRowText: '合计：',
},
{
field: "times",
title: "发生日期",
width: 120,
align: "center",
rowspan: 2,
templet: function (d) {
return '<span>' + d.times + "</span>";
},
},
{
field: "cate",
title: "报销类别",
width: 120,
align: "center",
rowspan: 2,
templet: function (d) {
return '<span>' + d.cate + "</span>";
},
},
{
field: "project",
title: "隶属项目",
width: 180,
align: "center",
rowspan: 2,
sort: true,
templet: function (d) {
return '<span>' + (d.project !== null && d.project !== undefined ? d.project : '无') + "</span>";
},
},
{
field: "price",
title: "报销金额",
align: "center",
rowspan: 2,
templet: function (d) {
return '<span>' + d.price + "</span>";
},
totalRow: true, // 添加此行以计算总计
},
{
field: "haveticket",
title: "是否有票",
width: 120,
align: "center",
rowspan: 2,
templet: function (d) {
return '<span>' + d.haveticket + "</span>";
},
},
{
field: "tickets",
title: "发票查看",
align: "center",
rowspan: 2,
templet: function (d) {
if (d.tickets) {
return `<span><img src="${d.tickets}" alt="" style="cursor: pointer;" onclick="viewImage('${d.tickets}')"></span>`;
} else {
return "<span>无</span>";
}
},
},
{
field: "remark",
title: "备注",
align: "center",
rowspan: 2,
templet: function (d) {
if (d.remark) {
return '<span>' + d.remark + "</span>";
} else {
return "";
}
},
},
],
],
});
}
</script>
<script src="/static/assets/layui/layui.js"></script>
<script src="/static/assets/gougu/gouguInit.js"></script>
<script>
//打印数据
function printPage() {
var content = document.querySelector('.page-content').innerHTML;
var originalContent = document.body.innerHTML;
document.body.innerHTML = content;
window.print();
document.body.innerHTML = originalContent;
}
//发票查看大图
function viewImage(src) {
var img = new Image();
img.src = src;
var imgHtml = "<img src='" + src + "' style='width:100%;'/>";
layer.open({
type: 1,
shade: 0.8,
title: false,
area: ['80%', '80%'],
content: imgHtml,
});
}
//修改报销状态
function editstatus(id) {
layui.use('layer', function () {
var layer = layui.layer;
var id = document.getElementById('pid').value;
var currentStatus = "{$detail.status}";
layer.open({
type: 1,
title: '修改报销状态',
content: '<div style="padding: 20px;">' +
'<select id="statusSelect" lay-filter="statusSelect" class="layui-input">' +
'<option value="未报销" ' + (currentStatus === '未报销' ? 'selected' : '') + '>未报销</option>' +
'<option value="已报销" ' + (currentStatus === '已报销' ? 'selected' : '') + '>已报销</option>' +
'</select>' +
'<button class="layui-btn layui-btn-sm" onclick="updateStatus(' + id + ')" style="margin-left: 20px;">确定</button>' +
'</div>'
});
});
}
//修改账单状态
function editlock(id) {
var id = document.getElementById('pid').value;
// console.log(id);
var currentlock = "{$detail.lock}";
layui.use('layer', function () {
var layer = layui.layer;
layer.open({
type: 1,
title: '修改账单状态',
content: '<div style="padding: 20px; display: flex; align-items: center;">' +
'<select id="lockSelect" class="layui-input">' +
'<option value="未锁定" ' + (currentlock === '未锁定' ? 'selected' : '') + '>未锁定</option>' +
'<option value="锁定" ' + (currentlock === '锁定' ? 'selected' : '') + '>锁定</option>' +
'</select>' +
'<button class="layui-btn layui-btn-sm" onclick="updatelocks(' + id + ')" style="margin-left: 20px;">确定</button>' +
'</div>'
});
});
}
//更新报销状态接口
function updateStatus(id) {
var status = $('#statusSelect').val();
$.ajax({
url: '/reimbursement/index/editstatus',
type: 'POST',
data: {id: id, status: status},
success: function (response) {
if (response.code === 0) {
layer.closeAll();
layer.msg(response.msg, {icon: 1});
} else {
layer.msg(response.msg, {icon: 2});
}
},
error: function () {
layer.msg('请求失败', {icon: 2});
}
});
}
//更新账单状态接口
function updatelocks(id) {
var lock = $('#lockSelect').val();
$.ajax({
url: '/reimbursement/index/editlock',
type: 'POST',
data: {id: id, lock: lock},
success: function (response) {
if (response.code === 0) {
layer.closeAll();
layer.msg(response.msg, {icon: 1});
} else {
layer.msg(response.msg, {icon: 2});
}
},
error: function () {
layer.msg('请求失败', {icon: 2});
}
});
}
</script>
app/reimbursement/view/nav/index.html
+43
View File
@@ -0,0 +1,43 @@
{extend name="../../base/view/common/base" /}
<!-- 主体 -->
{block name="breadcrumb"}
<span class="layui-breadcrumb">
<a href="http://www.meteteme.com/" target="_blank">江苏美天科技</a>
<a href="/application/nav/index"><cite>应用</cite></a>
</span>
{/block}
{block name="body"}
<div class="table-content p-3">
<div class="layui-form-bar border-t border-x" style="display: flex; justify-content: center;align-items: center;height: 94vh !important;">
<div class="btn_l">
<button class="layui-btn diy-button">
<strong>文件中转</strong>
<p>服务器内部资源跳转外部</p>
</button>
</div>
<div class="btn_r">
<button class="layui-btn diy-button layui-bg-purple">
<strong>报销管理</strong>
<p>存储员工报销数据电子档</p>
</button>
</div>
</div>
</div>
{/block}
<!-- /主体 -->
<!-- 脚本 -->
{block name="script"}
<script>
//跳转文件中转
$('.btn_l button').click(function(){
window.location.href = '/picbed/index/index';
});
//跳转Demos管理
$('.btn_r button').click(function(){
window.location.href = '/reimbursement/index/index';
});
</script>
{/block}
<!-- /脚本 -->