@lambo-design/workflow-approve 1.0.0-beta.14 → 1.0.0-beta.141

package/src/styles/css/index.less

@@ -1,231 +1,397 @@
-.containers {
-  /*position: absolute;*/
-  background-color: #ffffff;
-  width: 100%;
-
-  .done-line .djs-visual > :nth-child(1) {
-    stroke: rgb(218, 246, 209) !important;
-  }
-
-  .done-point .djs-visual > :nth-child(1) {
-    fill: rgb(218, 246, 209) !important;
-  }
-
-  .done-task .djs-visual > :nth-child(1) {
-    fill: rgb(218, 246, 209) !important;
-  }
-
-  .todo-point .djs-visual > :nth-child(1) {
-    fill: rgb(258, 227, 180) !important;
-  }
-
-  .bjs-powered-by {
-    display: none;
-  }
-}
-
-.canvas {
-  width: 100%;
-  height: 100%;
-  margin-top: 0%;
-}
-
-.tooltip-text {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  display: inline-block;
-  max-width: 130px; /* 限制文本宽度 */
-}
-
-.portrait-lambo-indicator-card{
-  height: 100%;
-  position: relative;
-  overflow-y: auto;
-  margin-bottom: -10px;
-}
-.portrait-lambo-indicator-card::-webkit-scrollbar {
-  width: 5px;
-  height: 5px;
-}
-
-.portrait-lambo-indicator-card::-webkit-scrollbar-thumb {
-  background: linear-gradient(to bottom right, #bbbbbb 0%, #bbbbbb 100%);
-  border-radius: 5px;
-}
-.header-text {
-  display: flex;
-  font-size: 18px;
-  font-weight: bold;
-  color: black;
-}
-
-.process-history {
-  width: 100%;
-  overflow-y: auto;
-}
-
-.process-history::-webkit-scrollbar {
-  width: 5px;
-  height: 5px;
-}
-
-.process-history::-webkit-scrollbar-thumb {
-  background: linear-gradient(to bottom right, #bbbbbb 0%, #bbbbbb 100%);
-  border-radius: 5px;
-}
-
-.box {
-  overflow: hidden;
-  transition: height 0.3s ease;
-  height: auto;
-  width: auto;
-  margin-left: -15px;
-}
-
-.draw-enter-active, .draw-leave-active {
-
-}
-
-.draw-enter, .draw-leave-to {
-  height: 0;
-}
-.attach-name-style {
-  margin-bottom: -5px;
-  white-space: nowrap;
-  display: inline-block;
-  width: auto;
-  font-size: 14px;
-  color: #17233d;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-.arrow-button-container {
-  position: absolute;
-  z-index: 50;
-  width: 12px;
-  height: 50px;
-  border-radius: 4px;
-  border: none;
-  background-color: #cccccc;
-  color: white;
-  display: inline-block;
-  transition: 0.5s;
-  top: 50%;
-  transform: translateX(0)
-}
-.icon-class{
-  margin-top: 18px;
-}
-.attach-card{
-  border:solid;
-  border-width: thin;
-  border-color: #f1f1f1;
-  width: auto;
-  border-radius: 10px;
-  margin: 10px 0 10px 10px
-}
-.attach-avatar{
-  margin-right: 5px;
-  zoom: 150%
-}
-.arrow {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-
-.history-title {
-  font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
-  font-weight: bold;
-  color: #515a6e;
-  font-size: 14px;
-  margin: 0 1vh 0 -2vh;
-}
-
-.cicle{
-  margin-left: 12px;
-  width: 15px;
-  height: 15px;
-  border-radius: 50%;
-}
-
-.audit-name-style {
-  margin-bottom: -5px;
-  white-space: nowrap;
-  display: inline-block;
-  max-width: 100px;
-  font-size: 14px;
-  color: #17233d;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-.audit-audit-comment-style {
-  margin-bottom: -5px;
-  white-space: nowrap;
-  display: inline-block;
-  max-width: 260px;
-  font-size: 14px;
-  color: #17233d;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-.audit-date-style {
-  white-space: nowrap;
-  display: inline-block;
-  max-width: 100px;
-  font-size: 14px;
-  color: #808695;
-  margin-left: 10px;
-}
-
-.portrait-timeline-item {
-  margin-bottom: -10px !important;
-}
-
-.portrait-timeline {
-  margin: 0 0 0 0
-}
-
-.portrait-card {
-  background-color: #f1f1f1 !important;
-  border-radius: 10px !important;
-  width: auto;
-  margin-left: -15px;
-  margin-right: -25px;
-  margin-bottom: 5px;
-}
-
-.portrait-avatar-large {
-  background-color: #005aff !important;
-  margin: -15px 10px 0 10px;
-  zoom: 150%
-}
-
-.portrait-avatar-small {
-  background-color: #005aff !important;
-  margin: -30px 10px 0 5px;
-  zoom: 150%
-}
-
-.urging{
-  margin-top: -3px;
-  font-size: small;
-}
-
-.attach{
-  margin-top: -3px;
-  font-size: small;
-  margin-left: 130px
-}
-
-.portrait-audit-date-style{
-  white-space: nowrap;
-  max-width: 100px;
-  margin-top: 5px;
-  font-size: 12px;
-  color: #808695;
-}
+.containers {
+  /*position: absolute;*/
+  background-color: #ffffff;
+  width: 100%;
+
+  .done-line .djs-visual > :nth-child(1) {
+    stroke: rgb(218, 246, 209) !important;
+  }
+
+  .done-point .djs-visual > :nth-child(1) {
+    fill: rgb(218, 246, 209) !important;
+  }
+
+  .done-task .djs-visual > :nth-child(1) {
+    fill: rgb(218, 246, 209) !important;
+  }
+
+  .todo-point .djs-visual > :nth-child(1) {
+    fill: rgb(258, 227, 180) !important;
+  }
+
+  .bjs-powered-by {
+    display: none;
+  }
+}
+
+.canvas {
+  width: 100%;
+  height: 95%;
+  margin-top: 0%;
+}
+
+.tooltip-text {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  display: inline-block;
+  max-width: 130px; /* 限制文本宽度 */
+}
+
+.workflow-inHorizontal-content {
+  position: absolute;
+  top: 55px;
+  height: calc(100% - 50px);
+  display: flex;
+  flex-direction: column;
+  right: 0;
+  left: 0
+}
+
+.portrait-lambo-indicator-card {
+  height: 100%;
+  position: relative;
+  overflow-y: auto;
+  margin-bottom: -10px;
+}
+
+.portrait-lambo-indicator-card::-webkit-scrollbar {
+  width: 5px;
+  height: 5px;
+}
+
+.portrait-lambo-indicator-card::-webkit-scrollbar-thumb {
+  background: linear-gradient(to bottom right, #bbbbbb 0%, #bbbbbb 100%);
+  border-radius: 5px;
+}
+
+
+.resizable-content {
+  padding: 8px 24px;
+}
+.resizable-container {
+  position: relative;
+  width: 100%;
+  overflow-y: hidden;
+  transition: height 0.1s ease;
+  box-sizing: border-box;
+  border: 1px solid #e0e0e0;
+  border-radius: 8px;
+  background-color: white;
+}
+
+.resizer {
+  position: sticky;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 8px;
+  cursor: ns-resize;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background-color: transparent;
+  transition: background-color 0.2s;
+  z-index: 10;
+  margin: 0;
+  padding: 0;
+}
+
+.resizer:hover {
+  background-color: rgba(0, 0, 0, 0.05);
+}
+
+.resizer.resizing {
+  background-color: rgba(0, 0, 0, 0.1);
+}
+
+.resizer-handle {
+  width: 30px;
+  height: 2px;
+  background-color: #ccc;
+  border-radius: 1px;
+  transition: background-color 0.2s;
+}
+
+.resizer:hover .resizer-handle,
+.resizer.resizing .resizer-handle {
+  background-color: #666;
+}
+.process-info-header{
+  display: flex;
+  justify-content: space-between;
+  width: 100%;
+  font-weight: 600;
+}
+.process-info-hidden-header{
+  display: flex;
+  justify-content: space-between;
+  width: 100%;
+  font-weight: 600;
+  background-color: #f0f0f0;
+  border: 1px solid #e0e0e0;
+  border-radius: 16px;
+  padding: 16px;
+  margin-bottom: 100px;
+  &:hover{
+    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
+  }
+}
+.process-info-header-icon{
+  margin-right: 8px;
+  width: 20px;
+  &:hover{
+    background-color: #ccc;
+    border-radius: 4px;
+  }
+}
+.resizer-handle {
+  width: 30px;
+  height: 2px;
+  background-color: #ccc;
+  border-radius: 1px;
+  transition: background-color 0.2s;
+}
+
+.header-text {
+  display: flex;
+  font-size: 18px;
+  font-weight: bold;
+  color: black;
+}
+
+.process-history {
+  width: 100%;
+  overflow-y: auto;
+}
+
+.process-history::-webkit-scrollbar {
+  width: 5px;
+  height: 5px;
+}
+
+.process-history::-webkit-scrollbar-thumb {
+  background: linear-gradient(to bottom right, #bbbbbb 0%, #bbbbbb 100%);
+  border-radius: 5px;
+}
+
+.box {
+  overflow: hidden;
+  transition: height 0.3s ease;
+  height: auto;
+  width: auto;
+  margin-left: -15px;
+}
+
+.draw-enter-active, .draw-leave-active {
+
+}
+
+.draw-enter, .draw-leave-to {
+  height: 0;
+}
+
+.attach-name-style {
+  margin-bottom: -5px;
+  white-space: nowrap;
+  display: inline-block;
+  width: auto;
+  font-size: 14px;
+  color: #17233d;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.arrow-button-container {
+  position: absolute;
+  z-index: 50;
+  width: 12px;
+  height: 50px;
+  border-radius: 4px;
+  border: none;
+  background-color: #cccccc;
+  color: white;
+  display: inline-block;
+  transition: 0.5s;
+  top: 50%;
+  transform: translateX(0)
+}
+
+.icon-class {
+  margin-top: 18px;
+}
+
+.attach-card {
+  border: solid;
+  border-width: thin;
+  border-color: #f1f1f1;
+  width: auto;
+  border-radius: 10px;
+  margin: 10px 0 10px 10px
+}
+
+.attach-avatar {
+  margin-right: 5px;
+  zoom: 150%
+}
+
+.arrow {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.history-title {
+  font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
+  font-weight: bold;
+  color: #515a6e;
+  font-size: 14px;
+  margin: 0 1vh 0 -2vh;
+}
+
+.cicle {
+  margin-left: 12px;
+  width: 15px;
+  height: 15px;
+  border-radius: 50%;
+}
+
+.audit-name-style {
+  margin-bottom: -5px;
+  white-space: nowrap;
+  display: inline-block;
+  max-width: 100px;
+  font-size: 14px;
+  color: #17233d;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.audit-comment-style {
+  margin-bottom: -5px;
+  white-space: nowrap;
+  display: inline-block;
+  max-width: 260px;
+  font-size: 14px;
+  color: #17233d;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.audit-date-style {
+  white-space: nowrap;
+  display: inline-block;
+  max-width: 100px;
+  font-size: 14px;
+  color: #808695;
+  margin-left: 10px;
+}
+
+.portrait-timeline-item {
+  margin-bottom: -10px !important;
+}
+
+.portrait-timeline {
+  margin: 0 0 0 0
+}
+
+.portrait-card {
+  background-color: #f1f1f1 !important;
+  border-radius: 10px !important;
+  width: auto;
+  margin-left: -15px;
+  margin-right: -25px;
+  margin-bottom: 5px;
+}
+
+.portrait-avatar-large {
+  background-color: #005aff !important;
+  margin: -15px 10px 0 10px;
+  zoom: 150%
+}
+
+.portrait-avatar-small {
+  background-color: #005aff !important;
+  margin: -30px 10px 0 5px;
+  zoom: 150%
+}
+
+.urging {
+  margin-top: -3px;
+  font-size: small;
+}
+
+.attach {
+  margin-top: -3px;
+  font-size: small;
+  margin-left: 130px
+}
+
+.portrait-audit-date-style {
+  white-space: nowrap;
+  max-width: 100px;
+  margin-top: 5px;
+  font-size: 12px;
+  color: #808695;
+}
+
+.operating-instructions {
+  float: left;
+  font-size: 12px;
+  text-align: left;
+  color: #808695
+}
+
+.notes-div {
+  text-align: right;
+  float: right;
+}
+
+.notes-done-task {
+  display: inline-block;
+  width: 70px;
+  height: 25px;
+  font-size: 12px;
+  text-align: center;
+  padding-top: 3px;
+  border: 1px solid black;
+  border-radius: 5px;
+  margin-left: 10px;
+  margin-right: 10px;
+  background-color: rgb(218, 246, 209);
+}
+
+.notes-todo-task {
+  display: inline-block;
+  width: 70px;
+  height: 25px;
+  font-size: 12px;
+  text-align: center;
+  padding-top: 3px;
+  border: 1px solid black;
+  border-radius: 5px;
+  margin-left: 10px;
+  margin-right: 10px;
+  background-color: rgb(258, 227, 180);
+}
+
+.notes-none-task {
+  display: inline-block;
+  width: 70px;
+  height: 25px;
+  font-size: 12px;
+  text-align: center;
+  padding-top: 3px;
+  border: 1px solid black;
+  border-radius: 5px;
+  margin-left: 10px;
+  margin-right: 10px;
+}
+
+.reject-user-button {
+  margin-left: 20px;
+}
+
+.reject-attribute-card {
+  margin-top: 10px;
+}

package/src/utils/const.js

@@ -0,0 +1,36 @@
+export const NodeType = {
+  UserTask: 'userTask',
+  MultiNode: 'multiNode',
+  SequentialMultiNode: 'sequentialMultiNode'
+}
+
+// 流程信息按钮
+export const WorkflowInfoButtons = {
+  ProcessTrace: 'processTrace',// 流程跟踪图
+  AuditHistory: 'auditHistory',// 审批历史
+  AuditOpinion: 'auditOpinion',// 审批意见
+  AttachmentFile: 'attachmentFile',// 附件
+}
+
+// 流程操作按钮
+export const WorkflowOperationButtons = {
+  AuditTo30: 'auditTo30',// 通过
+  AuditTo70: 'auditTo70',// 驳回原点
+  AuditTo40: 'auditTo40',// 驳回上一节点
+  AuditTo90: 'auditTo90',// 驳回指定节点
+  AuditTo80: 'auditTo80',// 跳转指定节点
+  AuditTo82: 'auditTo82',// 转办
+  AuditTo50: 'auditTo50',// 人工终止
+  DelegateTask: 'delegateTask',// 委派
+  RevokeDelegateTask: 'revokeDelegateTask',// 撤回委派
+  AppointTask: 'appointTask',// 交回委派
+  AddMultitaskInstance: 'addMultitaskInstance',// 会签加签
+  ReductionMultitaskInstance: 'reductionMultitaskInstance',// 会签减签
+}
+
+// 流程流转控制按钮
+export const WorkflowControlButtons = {
+  RejectProcessControl: 'rejectProcessControl',// 允许驳回时控制流转
+  AppointHandler: 'appointHandler',// 指定下一环节的办理人
+  AppointTimeoutTime: 'appointTimeoutTime',// 指定下一环节办理时限（含预警时间）
+}