manager/my-worker
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

新增前端vue

Browse Source
This commit is contained in:
gaoxq
2025-12-12 12:37:03 +08:00
parent 0ce726551c
commit 9790941264
11 changed files with 1042 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
web-api/src/main/java/com/jeesite/modules/biz/dao/BizCalendarFlowDao.java Normal file
View File

@@ -0,0 +1,15 @@
package com.jeesite.modules.biz.dao;
import com.jeesite.common.dao.CrudDao;
import com.jeesite.common.mybatis.annotation.MyBatisDao;
import com.jeesite.modules.biz.entity.BizCalendarFlow;
/**
* 日程流程DAO接口
* @author gaoxq
* @version 2025-12-12
*/
@MyBatisDao(dataSourceName="work")
public interface BizCalendarFlowDao extends CrudDao<BizCalendarFlow> {
}

60
web-api/src/main/java/com/jeesite/modules/biz/entity/BizCalendarFlow.java Normal file
View File

@@ -0,0 +1,60 @@
package com.jeesite.modules.biz.entity;
import java.io.Serializable;
import java.util.Date;
import com.jeesite.common.mybatis.annotation.JoinTable;
import com.jeesite.common.mybatis.annotation.JoinTable.Type;
import com.fasterxml.jackson.annotation.JsonFormat;
import jakarta.validation.constraints.NotNull;
import jakarta.validation.constraints.NotBlank;
import jakarta.validation.constraints.Size;
import com.jeesite.common.entity.DataEntity;
import com.jeesite.common.mybatis.annotation.Column;
import com.jeesite.common.mybatis.annotation.Table;
import com.jeesite.common.mybatis.mapper.query.QueryType;
import lombok.Data;
import lombok.EqualsAndHashCode;
import java.io.Serial;
/**
* 日程流程Entity
*
* @author gaoxq
* @version 2025-12-12
*/
@EqualsAndHashCode(callSuper = true)
@Table(name = "biz_calendar_flow", alias = "a", label = "日程流程信息", columns = {
@Column(name = "create_time", attrName = "createTime", label = "记录时间", isQuery = false),
@Column(name = "calendar_flow_id", attrName = "calendarFlowId", label = "主键标识", isPK = true),
@Column(name = "schedule_id", attrName = "scheduleId", label = "日程标识"),
@Column(name = "operation_user", attrName = "operationUser", label = "操作人", isQuery = false),
@Column(name = "operation_type", attrName = "operationType", label = "操作类型", isQuery = false),
@Column(name = "status_name", attrName = "statusName", label = "操作状态", isQuery = false),
@Column(name = "flow_content", attrName = "flowContent", label = "流程内容", isQuery = false),
}, orderBy = "a.calendar_flow_id DESC"
)
@Data
public class BizCalendarFlow extends DataEntity<BizCalendarFlow> implements Serializable {
@Serial
private static final long serialVersionUID = 1L;
private Date createTime; // 记录时间
private String calendarFlowId; // 主键标识
private String scheduleId; // 日程标识
private String operationUser; // 操作人
private String operationType; // 操作类型
private String statusName; // 操作状态
private String flowContent;
public BizCalendarFlow() {
this(null);
}
public BizCalendarFlow(String id) {
super(id);
}
}

78
web-api/src/main/java/com/jeesite/modules/biz/service/BizCalendarFlowService.java Normal file
View File

@@ -0,0 +1,78 @@
package com.jeesite.modules.biz.service;
import java.util.List;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;
import com.jeesite.common.entity.Page;
import com.jeesite.common.service.CrudService;
import com.jeesite.modules.biz.entity.BizCalendarFlow;
import com.jeesite.modules.biz.dao.BizCalendarFlowDao;
/**
* 日程流程Service
* @author gaoxq
* @version 2025-12-12
*/
@Service
public class BizCalendarFlowService extends CrudService<BizCalendarFlowDao, BizCalendarFlow> {
/**
* 获取单条数据
* @param bizCalendarFlow 主键
*/
@Override
public BizCalendarFlow get(BizCalendarFlow bizCalendarFlow) {
return super.get(bizCalendarFlow);
}
/**
* 查询分页数据
* @param bizCalendarFlow 查询条件
* @param bizCalendarFlow page 分页对象
*/
@Override
public Page<BizCalendarFlow> findPage(BizCalendarFlow bizCalendarFlow) {
return super.findPage(bizCalendarFlow);
}
/**
* 查询列表数据
* @param bizCalendarFlow 查询条件
*/
@Override
public List<BizCalendarFlow> findList(BizCalendarFlow bizCalendarFlow) {
return super.findList(bizCalendarFlow);
}
/**
* 保存数据（插入或更新）
* @param bizCalendarFlow 数据对象
*/
@Override
@Transactional
public void save(BizCalendarFlow bizCalendarFlow) {
super.save(bizCalendarFlow);
}
/**
* 更新状态
* @param bizCalendarFlow 数据对象
*/
@Override
@Transactional
public void updateStatus(BizCalendarFlow bizCalendarFlow) {
super.updateStatus(bizCalendarFlow);
}
/**
* 删除数据
* @param bizCalendarFlow 数据对象
*/
@Override
@Transactional
public void delete(BizCalendarFlow bizCalendarFlow) {
super.delete(bizCalendarFlow);
}
}

102
web-api/src/main/java/com/jeesite/modules/biz/web/BizCalendarFlowController.java Normal file
View File

@@ -0,0 +1,102 @@
package com.jeesite.modules.biz.web;
import jakarta.servlet.http.HttpServletRequest;
import jakarta.servlet.http.HttpServletResponse;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.validation.annotation.Validated;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import com.jeesite.common.config.Global;
import com.jeesite.common.entity.Page;
import com.jeesite.common.web.BaseController;
import com.jeesite.modules.biz.entity.BizCalendarFlow;
import com.jeesite.modules.biz.service.BizCalendarFlowService;
import java.util.List;
/**
* 日程流程Controller
*
* @author gaoxq
* @version 2025-12-12
*/
@Controller
@RequestMapping(value = "${adminPath}/biz/calendarFlow")
public class BizCalendarFlowController extends BaseController {
private final BizCalendarFlowService bizCalendarFlowService;
public BizCalendarFlowController(BizCalendarFlowService bizCalendarFlowService) {
this.bizCalendarFlowService = bizCalendarFlowService;
}
/**
* 获取数据
*/
@ModelAttribute
public BizCalendarFlow get(String calendarFlowId, boolean isNewRecord) {
return bizCalendarFlowService.get(calendarFlowId, isNewRecord);
}
/**
* 查询列表
*/
@RequestMapping(value = {"list", ""})
public String list(BizCalendarFlow bizCalendarFlow, Model model) {
model.addAttribute("bizCalendarFlow", bizCalendarFlow);
return "modules/biz/bizCalendarFlowList";
}
/**
* 查询列表数据
*/
@RequestMapping(value = "listData")
@ResponseBody
public Page<BizCalendarFlow> listData(BizCalendarFlow bizCalendarFlow, HttpServletRequest request, HttpServletResponse response) {
bizCalendarFlow.setPage(new Page<>(request, response));
Page<BizCalendarFlow> page = bizCalendarFlowService.findPage(bizCalendarFlow);
return page;
}
/**
* 查看编辑表单
*/
@RequestMapping(value = "form")
public String form(BizCalendarFlow bizCalendarFlow, Model model) {
model.addAttribute("bizCalendarFlow", bizCalendarFlow);
return "modules/biz/bizCalendarFlowForm";
}
/**
* 保存数据
*/
@PostMapping(value = "save")
@ResponseBody
public String save(@Validated BizCalendarFlow bizCalendarFlow) {
bizCalendarFlowService.save(bizCalendarFlow);
return renderResult(Global.TRUE, text("保存日程流程成功！"));
}
/**
* 删除数据
*/
@RequestMapping(value = "delete")
@ResponseBody
public String delete(BizCalendarFlow bizCalendarFlow) {
bizCalendarFlowService.delete(bizCalendarFlow);
return renderResult(Global.TRUE, text("删除日程流程成功！"));
}
@RequestMapping(value = "listAll")
@ResponseBody
public List<BizCalendarFlow> listAll(BizCalendarFlow bizCalendarFlow) {
return bizCalendarFlowService.findList(bizCalendarFlow);
}
}

16
web-api/src/main/java/com/jeesite/modules/biz/web/BizCalendarScheduleController.java
View File

@@ -3,8 +3,12 @@ package com.jeesite.modules.biz.web;
import java.util.List;
import com.jeesite.modules.app.utils.vDate;
import com.jeesite.modules.biz.entity.BizCalendarFlow;
import com.jeesite.modules.biz.service.BizCalendarFlowService;
import com.jeesite.modules.sys.entity.User;
import com.jeesite.modules.sys.utils.DictUtils;
import com.jeesite.modules.sys.utils.UserUtils;
import jakarta.annotation.Resource;
import jakarta.servlet.http.HttpServletRequest;
import jakarta.servlet.http.HttpServletResponse;
@@ -38,6 +42,10 @@ import com.jeesite.modules.biz.service.BizCalendarScheduleService;
@RequestMapping(value = "${adminPath}/biz/calendarSchedule")
public class BizCalendarScheduleController extends BaseController {
@Resource
private BizCalendarFlowService flowService;
private final BizCalendarScheduleService bizCalendarScheduleService;
public BizCalendarScheduleController(BizCalendarScheduleService bizCalendarScheduleService) {
@@ -91,11 +99,19 @@ public class BizCalendarScheduleController extends BaseController {
@PostMapping(value = "save")
@ResponseBody
public String save(@Validated BizCalendarSchedule bizCalendarSchedule) {
boolean isReachable = bizCalendarSchedule.getIsNewRecord();
User user = UserUtils.getUser();
User fUser = UserUtils.getByLoginCode(bizCalendarSchedule.getParticipantUser());
BizCalendarFlow calendarFlow = new BizCalendarFlow();
calendarFlow.setScheduleId(bizCalendarSchedule.getScheduleId());
calendarFlow.setOperationType(isReachable ? "新增" : "变更");
calendarFlow.setOperationUser(isReachable ? user.getUserName() : fUser.getUserName());
calendarFlow.setFlowContent(bizCalendarSchedule.getContent());
calendarFlow.setStatusName(DictUtils.getDictLabel("todo_status", bizCalendarSchedule.getUstatus(), "0"));
bizCalendarSchedule.setCreatorUser(user.getLoginCode());
bizCalendarSchedule.setParticipantName(fUser.getUserName());
bizCalendarSchedule.setUpdateTime(vDate.getUpdateTime(bizCalendarSchedule.getIsNewRecord()));
flowService.save(calendarFlow);
bizCalendarScheduleService.save(bizCalendarSchedule);
return renderResult(Global.TRUE, text("保存日程信息成功！"));
}

15
web-api/src/main/resources/mappings/modules/biz/BizCalendarFlowDao.xml Normal file
View File

@@ -0,0 +1,15 @@
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.jeesite.modules.biz.dao.BizCalendarFlowDao">
<!-- 查询数据
<select id="findList" resultType="BizCalendarFlow">
SELECT ${sqlMap.column.toSql()}
FROM ${sqlMap.table.toSql()}
<where>
${sqlMap.where.toSql()}
</where>
ORDER BY ${sqlMap.order.toSql()}
</select> -->
</mapper>

38
web-vue/packages/biz/api/biz/calendarFlow.ts Normal file
View File

@@ -0,0 +1,38 @@
/**
* Copyright (c) 2013-Now http://jeesite.com All rights reserved.
* No deletion without permission, or be held responsible to law.
* @author gaoxq
*/
import { defHttp } from '@jeesite/core/utils/http/axios';
import { useGlobSetting } from '@jeesite/core/hooks/setting';
import { BasicModel, Page } from '@jeesite/core/api/model/baseModel';
const { adminPath } = useGlobSetting();
export interface BizCalendarFlow extends BasicModel<BizCalendarFlow> {
createTime: string; // 记录时间
calendarFlowId: string; // 主键标识
scheduleId: string; // 日程标识
operationUser?: string; // 操作人
operationType?: string; // 操作类型
statusName?: string; // 操作状态
flowContent?: string; // 流程内容
}
export const bizCalendarFlowList = (params?: BizCalendarFlow | any) =>
defHttp.get<BizCalendarFlow>({ url: adminPath + '/biz/calendarFlow/list', params });
export const bizCalendarFlowListAll = (params?: BizCalendarFlow | any) =>
defHttp.get<BizCalendarFlow[]>({ url: adminPath + '/biz/calendarFlow/listAll', params });
export const bizCalendarFlowListData = (params?: BizCalendarFlow | any) =>
defHttp.post<Page<BizCalendarFlow>>({ url: adminPath + '/biz/calendarFlow/listData', params });
export const bizCalendarFlowForm = (params?: BizCalendarFlow | any) =>
defHttp.get<BizCalendarFlow>({ url: adminPath + '/biz/calendarFlow/form', params });
export const bizCalendarFlowSave = (params?: any, data?: BizCalendarFlow | any) =>
defHttp.postJson<BizCalendarFlow>({ url: adminPath + '/biz/calendarFlow/save', params, data });
export const bizCalendarFlowDelete = (params?: BizCalendarFlow | any) =>
defHttp.get<BizCalendarFlow>({ url: adminPath + '/biz/calendarFlow/delete', params });

508
web-vue/packages/core/layouts/views/desktop/workbench/components/calendar/flow.vue Normal file
View File

@@ -0,0 +1,508 @@
<!--
* Copyright (c) 2013-Now http://jeesite.com All rights reserved.
* No deletion without permission, or be held responsible to law.
* @author gaoxq
-->
<template>
<BasicModal
v-bind="$attrs"
title="流程明细"
:showFooter="true"
:showOkBtn="false"
@register="registerModal"
width="70%"
class="calendar-flow-modal"
destroyOnClose
>
<!-- 主容器 -->
<div class="flow-container">
<!-- 表格滚动容器 -->
<div class="table-scroll-container">
<!-- 表格包装器 -->
<div class="table-wrapper">
<table class="flow-table">
<!-- 表头 -->
<thead class="table-header">
<tr>
<th class="col-time">记录时间</th>
<th class="col-user">操作人</th>
<th class="col-type">操作类型</th>
<th class="col-status">操作状态</th>
<th class="col-content">流程内容</th>
</tr>
</thead>
<tbody class="table-body">
<!-- 空数据处理 -->
<tr v-if="listData.length === 0" class="empty-row">
<td colspan="5" class="empty-text">暂无流程记录</td>
</tr>
<tr v-else v-for="(item, index) in listData" :key="index" class="table-row">
<td class="col-time">
<div class="cell-content">{{ item.createTime }}</div>
</td>
<td class="col-user">
<div class="cell-content">{{ item.operationUser }}</div>
</td>
<td class="col-type">
<div class="cell-content">{{ item.operationType }}</div>
</td>
<td class="col-status">
<div class="cell-content">{{ item.statusName }}</div>
</td>
<td class="col-content">
<div
class="cell-content content-tooltip"
@mouseenter="showFullContent(item.flowContent, $event)"
@mouseleave="hideFullContent"
>
{{ item.flowContent }}
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<!-- 自定义悬浮提示框 - 保留原始格式 -->
<div
v-if="showTooltip"
class="custom-tooltip"
:style="{
top: `${tooltipTop}px`,
left: `${tooltipLeft}px`,
zIndex: 9999
}"
>
<!-- 使用pre标签保留原始格式 -->
<pre class="tooltip-content">{{ fullContent }}</pre>
<div class="tooltip-arrow"></div>
</div>
</BasicModal>
</template>
<script lang="ts" setup name="ViewsBizCalendarFlowList">
import { ref } from 'vue';
import { useMessage } from '@jeesite/core/hooks/web/useMessage';
import { BasicModal, useModalInner } from '@jeesite/core/components/Modal';
import { BizCalendarFlow, bizCalendarFlowListAll } from '@jeesite/biz/api/biz/calendarFlow';
const listData = ref<BizCalendarFlow[]>([]);
// 悬浮提示相关状态
const showTooltip = ref(false);
const fullContent = ref('');
const tooltipTop = ref(0);
const tooltipLeft = ref(0);
// 显示全部内容 - 保留原始格式
const showFullContent = (content: string, event: MouseEvent) => {
// 内容为空或无截断时不显示提示
if (!content) return;
const target = event.target as HTMLElement;
// 判断内容是否被截断（容器宽度 < 内容宽度）
if (target.scrollWidth <= target.clientWidth) return;
// 直接赋值原始内容，不做任何格式化处理
fullContent.value = content;
// 定位提示框（鼠标位置偏移，避免遮挡鼠标）
tooltipTop.value = event.clientY + 10;
tooltipLeft.value = event.clientX + 10;
showTooltip.value = true;
};
// 隐藏提示框
const hideFullContent = () => {
showTooltip.value = false;
fullContent.value = '';
};
const [registerModal, { closeModal }] = useModalInner(async (data) => {
try {
if (!data) return;
const params = { ...data };
// 清空旧数据
listData.value = [];
// 获取新数据
const res = await bizCalendarFlowListAll(params);
listData.value = res || [];
} catch (error) {
console.error('Calendar flow load error:', error);
}
});
</script>
<style scoped>
/* 重置基础样式 */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
/* 模态框整体样式 - 修复深度选择器警告 */
.calendar-flow-modal :deep(.ant-modal) {
top: 20px;
}
.calendar-flow-modal :deep(.ant-modal-content) {
border-radius: 12px;
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
border: none;
}
.calendar-flow-modal :deep(.ant-modal-header) {
border-bottom: 1px solid #e8f4f8;
padding: 20px 24px;
border-radius: 12px 12px 0 0;
text-align: center; /* 标题容器居中 */
}
.calendar-flow-modal :deep(.ant-modal-title) {
font-size: 18px;
font-weight: 600;
color: #1f2937;
line-height: 1.5;
display: inline-block; /* 标题文字居中 */
width: 100%;
}
.calendar-flow-modal :deep(.ant-modal-body) {
padding: 0;
background-color: #f9fafb;
border-radius: 0 0 12px 12px;
}
.calendar-flow-modal :deep(.ant-modal-footer) {
padding: 16px 24px;
border-top: 1px solid #e8f4f8;
background-color: #ffffff;
border-radius: 0 0 12px 12px;
text-align: center; /* 底部按钮区域居中 */
}
/* 主容器样式 */
.flow-container {
background-color: #e8f4f8;
padding: 24px;
border-radius: 10px;
min-height: 60vh;
width: 100%;
text-align: center; /* 容器内容居中 */
}
/* 表格滚动容器 - 核心优化 */
.table-scroll-container {
width: 100%;
height: 60vh;
background: #ffffff;
border-radius: 8px;
box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
overflow: hidden;
position: relative;
margin: 0 auto; /* 容器水平居中 */
}
/* 表格包装器 */
.table-wrapper {
width: 100%;
height: 100%;
overflow-y: auto;
/* 滚动条偏移，避免遮挡最后一列 */
padding-right: 6px;
}
/* 自定义滚动条 */
.table-wrapper::-webkit-scrollbar {
width: 6px;
position: absolute;
right: 0;
}
.table-wrapper::-webkit-scrollbar-track {
background: #f8f9fa;
border-radius: 3px;
margin: 8px 0;
}
.table-wrapper::-webkit-scrollbar-thumb {
background: #c1c7cd;
border-radius: 3px;
transition: background 0.2s;
}
.table-wrapper::-webkit-scrollbar-thumb:hover {
background: #a0a6ac;
}
/* 表格样式 - 核心修复 */
.flow-table {
width: 100%;
border-collapse: collapse;
font-size: 14px;
color: #333;
table-layout: fixed; /* 关键：固定表格布局，确保列宽生效 */
background-color: #ffffff;
margin: 0 auto; /* 表格水平居中 */
}
/* 表头样式 - 固定表头 */
.table-header {
position: sticky;
top: 0;
z-index: 100;
background-color: #f0f8fb;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.03);
}
.table-header tr {
height: 56px;
}
.table-header th {
padding: 16px 12px; /* 减少内边距，确保省略号显示 */
color: #2d3748;
font-weight: 600;
text-align: center; /* 表头文字居中 */
border-bottom: 2px solid #e8f4f8;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
/* 列宽定义 - 精确控制 */
.col-time { width: 18%; }
.col-user { width: 15%; }
.col-type { width: 18%; }
.col-status { width: 15%; }
.col-content { width: 34%; }
/* 表体样式 */
.table-body {
width: 100%;
}
/* 数据行样式 */
.table-row {
height: 52px;
transition: background-color 0.2s;
}
.table-row:hover {
background-color: #f8fafc;
}
.table-row td {
padding: 14px 12px; /* 减少内边距，确保省略号显示 */
border-bottom: 1px solid #f1f5f9;
color: #4a5568;
text-align: center; /* 表格内容居中 */
vertical-align: middle; /* 垂直居中 */
/* 关键：td必须设置overflow，确保子元素省略号生效 */
overflow: hidden;
}
/* 核心：单元格内容容器 - 确保省略号显示 */
.cell-content {
width: 100%;
height: 100%;
white-space: nowrap; /* 强制单行 */
overflow: hidden; /* 隐藏超出内容 */
text-overflow: ellipsis; /* 显示省略号 */
display: inline-block; /* 关键：确保宽度生效 */
line-height: 1.4; /* 行高适配 */
padding: 0 4px; /* 少量内边距，避免文字贴边 */
}
/* 首列样式强化 */
.col-time .cell-content {
color: #2d3748;
font-weight: 500;
}
/* 流程内容容器 - 悬浮提示基础样式 */
.content-tooltip {
cursor: pointer;
position: relative;
/* 禁用原生提示 */
pointer-events: auto;
}
/* 空数据样式 */
.empty-row {
height: 120px;
}
.empty-text {
padding: 40px 0;
color: #718096;
font-size: 14px;
text-align: center; /* 空数据提示居中 */
font-weight: 400;
}
/* 自定义悬浮提示框样式 - 适配原始格式 */
.custom-tooltip {
position: fixed;
background: #1f2937;
color: #ffffff;
padding: 12px 16px;
border-radius: 8px;
max-width: 500px; /* 加宽适配原始格式内容 */
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
font-size: 14px;
line-height: 1.6;
z-index: 9999;
animation: fadeIn 0.2s ease-in-out;
/* 防止内容溢出 */
max-height: 400px;
overflow-y: auto;
}
/* 保留原始格式的内容样式 */
.tooltip-content {
font-family: "Consolas", "Monaco", "Courier New", monospace; /* 等宽字体更适合展示原始格式 */
white-space: pre-wrap; /* 保留换行和空格，自动换行 */
word-wrap: break-word;
color: #e5e7eb;
margin: 0;
padding: 0;
}
/* 提示框滚动条样式 */
.custom-tooltip::-webkit-scrollbar {
width: 4px;
}
.custom-tooltip::-webkit-scrollbar-track {
background: #2d3748;
border-radius: 2px;
}
.custom-tooltip::-webkit-scrollbar-thumb {
background: #4a5568;
border-radius: 2px;
}
/* 提示框箭头 */
.tooltip-arrow {
position: absolute;
bottom: 100%;
left: 10px;
width: 0;
height: 0;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-bottom: 8px solid #1f2937;
}
/* 淡入动画 */
@keyframes fadeIn {
from {
opacity: 0;
transform: translateY(5px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
/* 响应式适配 */
@media (max-width: 1200px) {
.calendar-flow-modal {
width: 80% !important;
}
.custom-tooltip {
max-width: 400px;
}
}
@media (max-width: 768px) {
.calendar-flow-modal {
width: 95% !important;
}
.flow-container {
padding: 16px;
min-height: 70vh;
}
.table-scroll-container {
height: 70vh;
}
.flow-table {
font-size: 13px;
}
.table-header th, .table-row td {
padding: 12px 8px;
}
.table-header tr {
height: 50px;
}
.table-row {
height: 48px;
}
.custom-tooltip {
max-width: 300px;
font-size: 13px;
max-height: 300px;
}
}
/* 适配暗黑模式（可选） */
@media (prefers-color-scheme: dark) {
.flow-container {
background-color: #1e293b;
}
.table-scroll-container {
background-color: #273449;
}
.table-header {
background-color: #2d3b55;
}
.table-row:hover {
background-color: #334155;
}
.table-header th {
color: #e2e8f0;
border-bottom-color: #334155;
}
.table-row td {
color: #cbd5e1;
border-bottom-color: #334155;
}
.col-time .cell-content {
color: #f1f5f9;
}
.empty-text {
color: #94a3b8;
}
.custom-tooltip {
background: #334155;
}
.tooltip-arrow {
border-bottom-color: #334155;
}
.tooltip-content {
color: #f1f5f9;
}
}
</style>

4
web-vue/packages/core/layouts/views/desktop/workbench/components/calendar/form.vue
View File

@@ -8,7 +8,7 @@
v-bind="$attrs"
:showFooter="true"
:okAuth="'biz:calendarSchedule:edit'"
@register="registerDrawer"
@register="registerModal"
@ok="handleSubmit"
width="60%"
>
@@ -156,7 +156,7 @@
baseColProps: { md: 24, lg: 12 },
});
const [registerDrawer, { setModalProps, closeModal }] = useModalInner(async (data) => {
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
setModalProps({ loading: true });
await resetFields();
const res = await bizCalendarScheduleForm(data);

35
web-vue/packages/core/layouts/views/desktop/workbench/components/calendar/list.vue
View File

@@ -17,7 +17,9 @@
</a>
</template>
</BasicTable>
<InputForm @register="registerDrawer" @success="handleSuccess" />
<FlowForm @register="registerFlowModal" @success="handleSuccess" />
<ViewForm @register="registerViewModal" @success="handleSuccess" />
<InputForm @register="registerEditModal" @success="handleSuccess" />
<FormImport @register="registerImportModal" @success="handleSuccess" />
</div>
</template>
@@ -34,6 +36,8 @@
import { bizCalendarScheduleDelete, bizCalendarScheduleListData } from '@jeesite/biz/api/biz/calendarSchedule';
import { useModal } from '@jeesite/core/components/Modal';
import { FormProps } from '@jeesite/core/components/Form';
import ViewForm from './view.vue';
import FlowForm from './flow.vue';
import InputForm from './form.vue';
import FormImport from './formImport.vue';
import { useUserStore } from '@jeesite/core/store/modules/user';
@@ -215,7 +219,18 @@
title: t('编辑'),
onClick: handleForm.bind(this, { scheduleId: record.scheduleId }),
auth: 'biz:calendarSchedule:edit',
ifShow: record.ustatus !== '9'
ifShow: record.ustatus !== '9'
},
{
icon: 'simple-line-icons:eye',
title: t('查看'),
onClick: viewForm.bind(this, { scheduleId: record.scheduleId }),
ifShow: record.ustatus == '9'
},
{
icon: 'ant-design:node-expand-outlined',
title: t('流程'),
onClick: flowForm.bind(this, { scheduleId: record.scheduleId }),
},
],
};
@@ -242,10 +257,22 @@
await getForm().setFieldsValue(record.value);
});
const [registerDrawer, { openModal }] = useModal();
const [registerModal, { openModal }] = useModal();
const [registerViewModal, { openModal: openViewModal }] = useModal();
const [registerEditModal, { openModal: openEditModal }] = useModal();
const [registerFlowModal, { openModal: openFlowModal }] = useModal();
function handleForm(record: Recordable) {
openModal(true, record);
openEditModal(true, record);
}
function viewForm(record: Recordable) {
openViewModal(true, record);
}
function flowForm(record: Recordable) {
openFlowModal(true, record);
}
async function handleExport() {

176
web-vue/packages/core/layouts/views/desktop/workbench/components/calendar/view.vue Normal file
View File

@@ -0,0 +1,176 @@
<!--
* Copyright (c) 2013-Now http://jeesite.com All rights reserved.
* No deletion without permission, or be held responsible to law.
* @author gaoxq
-->
<template>
<BasicModal
v-bind="$attrs"
:showFooter="true"
:showOkBtn="false"
@register="registerModal"
width="60%"
>
<template #title>
<Icon :icon="getTitle.icon" class="m-1 pr-1" />
<span> {{ getTitle.value }} </span>
</template>
<BasicForm @register="registerForm" />
</BasicModal>
</template>
<script lang="ts" setup name="ViewsBizCalendarScheduleForm">
import { ref, unref, computed } from 'vue';
import { useI18n } from '@jeesite/core/hooks/web/useI18n';
import { useMessage } from '@jeesite/core/hooks/web/useMessage';
import { router } from '@jeesite/core/router';
import { Icon } from '@jeesite/core/components/Icon';
import { BasicForm, FormSchema, useForm } from '@jeesite/core/components/Form';
import { BasicModal, useModalInner } from '@jeesite/core/components/Modal';
import { BizCalendarSchedule, bizCalendarScheduleSave, bizCalendarScheduleForm } from '@jeesite/biz/api/biz/calendarSchedule';
const emit = defineEmits(['success', 'register']);
const { t } = useI18n('biz.calendarSchedule');
const { showMessage } = useMessage();
const { meta } = unref(router.currentRoute);
const record = ref<BizCalendarSchedule>({} as BizCalendarSchedule);
const getTitle = computed(() => ({
icon: meta.icon || 'i-ant-design:book-outlined',
value: t('查看日程信息'),
}));
const inputFormSchemas: FormSchema<BizCalendarSchedule>[] = [
{
label: t('日程标题'),
field: 'title',
component: 'Input',
componentProps: {
maxlength: 255,
},
required: true,
dynamicDisabled: true,
colProps: { md: 24, lg: 24 },
},
{
label: t('日程编号'),
field: 'scheduleNo',
component: 'Input',
componentProps: {
maxlength: 64,
},
required: true,
dynamicDisabled: true,
},
{
label: t('通知人员'),
field: 'participantUser',
fieldLabel: 'participantName',
component: 'ListSelect',
componentProps: {
selectType: 'userSelect',
},
required: true,
dynamicDisabled: true,
},
{
label: t('日程内容'),
field: 'content',
component: 'InputTextArea',
colProps: { md: 24, lg: 24 },
dynamicDisabled: true,
},
{
label: t('开始时间'),
field: 'startTime',
component: 'DatePicker',
componentProps: {
format: 'YYYY-MM-DD HH:mm',
showTime: { format: 'HH:mm' },
},
required: true,
dynamicDisabled: true,
},
{
label: t('结束时间'),
field: 'endTime',
component: 'DatePicker',
componentProps: {
format: 'YYYY-MM-DD HH:mm',
showTime: { format: 'HH:mm' },
},
required: true,
dynamicDisabled: true,
},
{
label: t('是否全天'),
field: 'allDay',
component: 'Select',
componentProps: {
dictType: 'is_day',
allowClear: true,
},
required: true,
dynamicDisabled: true,
},
{
label: t('优先等级'),
field: 'priority',
component: 'Select',
componentProps: {
dictType: 'priority',
allowClear: true,
},
required: true,
dynamicDisabled: true,
},
{
label: t('提醒时间'),
field: 'remindTime',
component: 'DatePicker',
componentProps: {
format: 'YYYY-MM-DD HH:mm',
showTime: { format: 'HH:mm' },
},
dynamicDisabled: true,
},
{
label: t('日程状态'),
field: 'ustatus',
component: 'Select',
componentProps: {
dictType: 'todo_status',
allowClear: true,
},
required: true,
dynamicDisabled: true,
},
{
label: t('日程地点'),
field: 'location',
component: 'Input',
componentProps: {
maxlength: 512,
},
colProps: { md: 24, lg: 24 },
dynamicDisabled: true,
},
];
const [registerForm, { resetFields, setFieldsValue, validate }] = useForm<BizCalendarSchedule>({
labelWidth: 120,
schemas: inputFormSchemas,
baseColProps: { md: 24, lg: 12 },
});
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
setModalProps({ loading: true });
await resetFields();
const res = await bizCalendarScheduleForm(data);
record.value = (res.bizCalendarSchedule || {}) as BizCalendarSchedule;
record.value.__t = new Date().getTime();
await setFieldsValue(record.value);
setModalProps({ loading: false });
});
</script>