@cloud-app-dev/vidc 1.0.12 → 1.0.16

package/es/WorkerFlow/index.css

@@ -0,0 +1,728 @@
+.worker-flow-container {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  position: relative;
+}
+.worker-flow-design {
+  width: 100%;
+  height: 100%;
+  background-color: #f5f5f7;
+  overflow: auto;
+  z-index: 1;
+}
+.worker-flow-design .box-scale {
+  transform: scale(1);
+  display: inline-block;
+  position: relative;
+  width: 100%;
+  padding: 54.5px 0;
+  -webkit-box-align: start;
+  -ms-flex-align: start;
+  align-items: flex-start;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  min-width: -webkit-min-content;
+  min-width: -moz-min-content;
+  min-width: min-content;
+  background-color: #f5f5f7;
+  -webkit-transform-origin: 0 0 0;
+  transform-origin: 0 0 0;
+}
+.worker-flow-design .ie-polyfill-container {
+  display: -ms-grid;
+  -ms-grid-columns: min-content;
+}
+.worker-flow-design .add-node-btn-box {
+  width: 240px;
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-box-flex: 1;
+  -ms-flex-positive: 1;
+  position: relative;
+}
+.worker-flow-design .add-node-btn-box:before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  z-index: -1;
+  margin: auto;
+  width: 2px;
+  height: 100%;
+  background-color: #cacaca;
+}
+.worker-flow-design .node-wrap {
+  flex-direction: column;
+  -webkit-box-pack: start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  -webkit-box-flex: 1;
+  -ms-flex-positive: 1;
+  padding: 0 50px;
+  position: relative;
+}
+.worker-flow-design .branch-wrap,
+.worker-flow-design .node-wrap {
+  display: inline-flex;
+  width: 100%;
+}
+.worker-flow-design .branch-box-wrap {
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 270px;
+  width: 100%;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+}
+.worker-flow-design .branch-box {
+  display: flex;
+  overflow: visible;
+  min-height: 180px;
+  height: auto;
+  border-bottom: 2px solid #ccc;
+  border-top: 2px solid #ccc;
+  position: relative;
+  margin-top: 15px;
+}
+.worker-flow-design .branch-box .col-box {
+  background: #f5f5f7;
+}
+.worker-flow-design .branch-box .col-box:before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 0;
+  margin: auto;
+  width: 2px;
+  height: 100%;
+  background-color: #cacaca;
+}
+.worker-flow-design .add-branch {
+  border: none;
+  outline: none;
+  user-select: none;
+  justify-content: center;
+  font-size: 12px;
+  padding: 0 10px;
+  height: 30px;
+  line-height: 30px;
+  border-radius: 15px;
+  color: #3296fa;
+  background: #fff;
+  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
+  position: absolute;
+  top: -16px;
+  left: 50%;
+  transform: translateX(-50%);
+  transform-origin: center center;
+  cursor: pointer;
+  z-index: 1;
+  display: inline-flex;
+  align-items: center;
+  -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+}
+.worker-flow-design .add-branch:hover {
+  transform: translateX(-50%) scale(1.1);
+  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.1);
+}
+.worker-flow-design .add-branch:active {
+  transform: translateX(-50%);
+  box-shadow: none;
+}
+.worker-flow-design .col-box {
+  display: inline-flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  flex-direction: column;
+  -webkit-box-align: center;
+  align-items: center;
+  position: relative;
+}
+.worker-flow-design .condition-node {
+  min-height: 220px;
+}
+.worker-flow-design .condition-node,
+.worker-flow-design .condition-node-box {
+  display: inline-flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  flex-direction: column;
+  -webkit-box-flex: 1;
+}
+.worker-flow-design .condition-node-box {
+  padding-top: 30px;
+  padding-right: 50px;
+  padding-left: 50px;
+  -webkit-box-pack: center;
+  justify-content: center;
+  -webkit-box-align: center;
+  align-items: center;
+  flex-grow: 1;
+  position: relative;
+}
+.worker-flow-design .condition-node-box:before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  margin: auto;
+  width: 2px;
+  height: 100%;
+  background-color: #cacaca;
+}
+.worker-flow-design .auto-judge {
+  position: relative;
+  width: 220px;
+  min-height: 72px;
+  background: #fff;
+  border-radius: 4px;
+  padding: 14px 19px;
+  cursor: pointer;
+}
+.worker-flow-design .auto-judge:after {
+  pointer-events: none;
+  content: '';
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  z-index: 2;
+  border-radius: 4px;
+  border: 1px solid transparent;
+  transition: all 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
+  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1);
+}
+.worker-flow-design .auto-judge.active:after,
+.worker-flow-design .auto-judge:active:after,
+.worker-flow-design .auto-judge:hover:after {
+  border: 1px solid #3296fa;
+  box-shadow: 0 0 6px 0 rgba(50, 150, 250, 0.3);
+}
+.worker-flow-design .auto-judge.active .worker-flow-node-del,
+.worker-flow-design .auto-judge:active .worker-flow-node-del,
+.worker-flow-design .auto-judge:hover .worker-flow-node-del {
+  display: block;
+}
+.worker-flow-design .auto-judge.error:after {
+  border: 1px solid #f25643;
+  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1);
+}
+.worker-flow-design .auto-judge .title-wrapper {
+  font-size: 12px;
+  color: #15bc83;
+  text-align: left;
+  line-height: 16px;
+  display: flex;
+  justify-content: space-between;
+}
+.worker-flow-design .auto-judge .title-wrapper .editable-title {
+  display: inline-block;
+  max-width: 120px;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+.worker-flow-design .auto-judge .title-wrapper .priority-title {
+  display: inline-block;
+  margin-right: 10px;
+  color: rgba(25, 31, 37, 0.56);
+}
+.worker-flow-design .auto-judge .title-wrapper .priority-button {
+  display: inline-block;
+  height: 28px;
+  margin-right: 10px;
+  border: 1px solid rgba(0, 0, 0, 0.15);
+  border-radius: 4px;
+  color: rgba(0, 0, 0, 0.65);
+}
+.worker-flow-design .auto-judge .title-wrapper .priority-button div {
+  display: inline-block;
+}
+.worker-flow-design .auto-judge .title-wrapper .priority-button .priority-content {
+  padding: 0 8px;
+  font-size: 12px;
+  line-height: 28px;
+  border-left: 1px solid rgba(0, 0, 0, 0.15);
+  border-right: 1px solid rgba(0, 0, 0, 0.15);
+}
+.worker-flow-design .auto-judge .placeholder {
+  color: #bfbfbf;
+}
+.worker-flow-design .auto-judge .content {
+  font-size: 14px;
+  color: #191f25;
+  text-align: left;
+  margin-top: 6px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 3;
+  -webkit-box-orient: vertical;
+}
+.worker-flow-design .auto-judge .sort-left,
+.worker-flow-design .auto-judge .sort-right {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  display: none;
+  z-index: 1;
+}
+.worker-flow-design .auto-judge .sort-left {
+  left: 0;
+  border-right: 1px solid #f6f6f6;
+}
+.worker-flow-design .auto-judge .sort-right {
+  right: 0;
+  border-left: 1px solid #f6f6f6;
+}
+.worker-flow-design .auto-judge:hover .sort-left,
+.worker-flow-design .auto-judge:hover .sort-right {
+  display: flex;
+  align-items: center;
+}
+.worker-flow-design .auto-judge .sort-left:hover,
+.worker-flow-design .auto-judge .sort-right:hover {
+  background: #efefef;
+}
+.worker-flow-design .add-node-btn {
+  user-select: none;
+  width: 240px;
+  padding: 26px 0 32px;
+  display: flex;
+  -webkit-box-pack: center;
+  justify-content: center;
+  flex-shrink: 0;
+  -webkit-box-flex: 1;
+  flex-grow: 1;
+  position: relative;
+}
+.worker-flow-design .add-node-btn .add-popover {
+  width: 410px;
+  position: absolute;
+  z-index: 10;
+  left: 65%;
+  top: calc(50% - 15px);
+  background-color: #fff;
+  border: 1px solid #ddd;
+  padding: 20px 20px 10px 20px;
+  border-radius: 4px;
+}
+.worker-flow-design .add-node-btn .btn {
+  outline: none;
+  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
+  width: 26px;
+  height: 26px;
+  background: #3296fa;
+  border-radius: 50%;
+  position: relative;
+  border: none;
+  line-height: 26px;
+  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+  color: white;
+  font-size: 24px;
+  text-align: center;
+  padding: 0;
+  cursor: pointer;
+}
+.worker-flow-design .add-node-btn .btn .iconfont {
+  color: #fff;
+  font-size: 16px;
+}
+.worker-flow-design .add-node-btn .btn:hover {
+  transform: scale(1.3);
+  box-shadow: 0 13px 27px 0 rgba(0, 0, 0, 0.1);
+}
+.worker-flow-design .add-node-btn .btn:active {
+  transform: none;
+  background: #1e83e9;
+  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
+}
+.worker-flow-design .end-node {
+  border-radius: 50%;
+  font-size: 14px;
+  color: rgba(25, 31, 37, 0.4);
+  text-align: left;
+}
+.worker-flow-design .end-node .end-node-circle {
+  width: 10px;
+  height: 10px;
+  margin: auto;
+  border-radius: 50%;
+  background: #dbdcdc;
+}
+.worker-flow-design .end-node .end-node-text {
+  margin-top: 5px;
+  text-align: center;
+}
+.worker-flow-design .zoom {
+  display: flex;
+  position: absolute;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: justify;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  height: 40px;
+  width: 125px;
+  right: 40px;
+  margin-top: 30px;
+  z-index: 10;
+}
+.worker-flow-design .zoom-in,
+.worker-flow-design .zoom-out {
+  width: 30px;
+  height: 30px;
+  background: #fff;
+  color: #c1c1cd;
+  cursor: pointer;
+  background-size: 100%;
+  background-repeat: no-repeat;
+}
+.worker-flow-design .zoom-out {
+  background-image: url(https://gw.alicdn.com/tfs/TB1s0qhBHGYBuNjy0FoXXciBFXa-90-90.png);
+}
+.worker-flow-design .zoom-out.disabled {
+  opacity: 0.5;
+}
+.worker-flow-design .zoom-in {
+  background-image: url(https://gw.alicdn.com/tfs/TB1UIgJBTtYBeNjy1XdXXXXyVXa-90-90.png);
+}
+.worker-flow-design .zoom-in.disabled {
+  opacity: 0.5;
+}
+.worker-flow-design .tools {
+  position: absolute;
+  left: 40px;
+  top: 30px;
+  z-index: 1;
+}
+.auto-judge:hover .editable-title,
+.node-wrap-box:hover .editable-title {
+  border-bottom: 1px dashed #fff;
+}
+.auto-judge:hover .editable-title.editing,
+.node-wrap-box:hover .editable-title.editing {
+  text-decoration: none;
+  border: 1px solid #d9d9d9;
+}
+.auto-judge:hover .editable-title {
+  border-color: #15bc83;
+}
+.editable-title {
+  line-height: 15px;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  border-bottom: 1px dashed transparent;
+  flex: 1;
+}
+.editable-title:hover {
+  border-bottom: 1px dashed #fff;
+}
+.editable-title-input {
+  flex: none;
+  height: 18px;
+  padding-left: 4px;
+  text-indent: 0;
+  font-size: 12px;
+  line-height: 18px;
+  z-index: 1;
+  color: #333 !important;
+  flex: 1;
+}
+.editable-title-input:hover {
+  text-decoration: none;
+}
+.node-wrap-box {
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  width: 220px;
+  min-height: 72px;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  background: #fff;
+  border-radius: 4px;
+  cursor: pointer;
+}
+.node-wrap-box:after {
+  pointer-events: none;
+  content: '';
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  z-index: 2;
+  border-radius: 4px;
+  border: 1px solid transparent;
+  transition: all 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
+  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1);
+}
+.node-wrap-box.active:after,
+.node-wrap-box:active:after,
+.node-wrap-box:hover:after {
+  border: 1px solid #3296fa;
+  box-shadow: 0 0 6px 0 rgba(50, 150, 250, 0.3);
+}
+.node-wrap-box.active .worker-flow-node-del,
+.node-wrap-box:active .worker-flow-node-del,
+.node-wrap-box:hover .worker-flow-node-del {
+  display: block;
+}
+.node-wrap-box.error:after {
+  border: 1px solid #f25643;
+  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1);
+}
+.node-wrap-box .title {
+  position: relative;
+  display: flex;
+  align-items: center;
+  padding-left: 10px;
+  padding-right: 40px;
+  width: 100%;
+  height: 30px;
+  line-height: 30px;
+  font-size: 12px;
+  color: #fff;
+  text-align: left;
+  background: #576a95;
+  border-radius: 4px 4px 0 0;
+}
+.node-wrap-box .title .iconfont {
+  font-size: 12px;
+  margin-right: 5px;
+}
+.node-wrap-box .placeholder {
+  color: #bfbfbf;
+}
+.node-wrap-box .content {
+  position: relative;
+  font-size: 14px;
+  padding: 16px 10px;
+}
+.condition-node .content .text,
+.node-wrap-box .content .text {
+  display: flex;
+  align-items: center;
+}
+.condition-node .content .text span,
+.node-wrap-box .content .text span {
+  flex: 1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.condition-node .content .text .anticon,
+.node-wrap-box .content .text .anticon {
+  font-size: 18px;
+  color: var(--icon);
+}
+.node-wrap-box .content .arrow {
+  position: absolute;
+  right: 10px;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 20px;
+  height: 14px;
+  font-size: 14px;
+  color: #979797;
+}
+.node-wrapper-box-new {
+  padding: 12px 10px;
+}
+.node-wrapper-box-new .actions {
+  margin-top: 11px;
+  text-align: right;
+}
+.node-wrapper-box-new .ant-btn {
+  margin-left: 8px;
+}
+.node-wrap-box:before {
+  content: '';
+  position: absolute;
+  top: -12px;
+  left: 50%;
+  -webkit-transform: translateX(-50%);
+  transform: translateX(-50%);
+  width: 0;
+  height: 4px;
+  border-style: solid;
+  border-width: 8px 6px 4px;
+  border-color: #cacaca transparent transparent;
+  background: #f5f5f7;
+}
+.node-wrap-box.start-node {
+  cursor: unset;
+}
+.node-wrap-box.start-node:before {
+  content: none;
+}
+.add-node-popover {
+  min-height: 160px;
+}
+.add-node-popover-header {
+  position: relative;
+  margin-bottom: 15px;
+}
+.add-node-popover-close {
+  cursor: pointer;
+  position: absolute;
+  top: 5px;
+  right: 5px;
+  color: rgba(0, 0, 0, 0.25);
+}
+.add-node-popover-body {
+  width: 400px;
+  display: flex;
+  flex-wrap: wrap;
+}
+.worker-flow-node-del {
+  position: absolute;
+  right: 10px;
+  top: 8px;
+  cursor: pointer;
+  font-size: 16px;
+  color: #fff;
+  display: none;
+}
+.add-node-popover-item {
+  width: 180px;
+  margin-right: 10px;
+  cursor: pointer;
+  text-align: center;
+  color: #191f25 !important;
+  display: flex;
+  align-items: center;
+  background-color: #fafafa;
+  margin-bottom: 10px;
+}
+.add-node-popover-item span:last-child {
+  padding-left: 10px;
+}
+.add-node-popover-item .item-wrapper {
+  user-select: none;
+  display: inline-block;
+  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+  padding: 5px;
+}
+.add-node-popover-item .item-wrapper .anticon {
+  font-size: 30px;
+  background: #fff;
+  padding: 10px;
+  border-radius: 6px;
+}
+.add-node-popover-item:hover {
+  background: #fff;
+  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+}
+.top-left-cover-line {
+  left: -1px;
+}
+.top-left-cover-line,
+.top-right-cover-line {
+  position: absolute;
+  height: 3px;
+  width: 50%;
+  background-color: #f5f5f7;
+  top: -2px;
+}
+.top-right-cover-line {
+  right: -1px;
+}
+.bottom-left-cover-line {
+  left: -1px;
+}
+.bottom-left-cover-line,
+.bottom-right-cover-line {
+  position: absolute;
+  height: 3px;
+  width: 50%;
+  background-color: #f5f5f7;
+  bottom: -2px;
+}
+.bottom-right-cover-line {
+  right: -1px;
+}
+.user-select-type-wrapper .user-select-type-group {
+  display: flex;
+  justify-content: space-around;
+  padding: 20px 20px 0 20px;
+}
+.user-select-type-wrapper .user-select-type1 {
+  padding-top: 20px;
+}
+.user-select-component .user-select-tools {
+  padding: 20px;
+}
+.user-select-component .user-select-tools .ant-btn {
+  margin-right: 20px;
+}
+.user-select-component .user-select-tools .placeholder {
+  color: #999;
+}
+.user-select-component .user-list-wrapper {
+  padding: 0 20px 20px 20px;
+}
+.users-handle-type-content {
+  padding: 20px;
+  border-top: 1px solid var(--bd-color);
+}
+.users-handle-type-content .handle-title {
+  font-size: var(--fs);
+  font-weight: bold;
+  color: #000000;
+  padding-bottom: 20px;
+}
+.users-handle-type-content .users-handle-type-group {
+  display: flex;
+  justify-content: space-between;
+}
+.user-select-modal-content {
+  display: flex;
+  background-color: #fff;
+  height: 480px;
+}
+.user-select-modal-content > div {
+  flex: 1;
+}
+.user-form-table .ant-table-thead > tr > th,
+.user-form-table .ant-table-tbody > tr > td,
+.user-form-table .ant-table tfoot > tr > th,
+.user-form-table .ant-table tfoot > tr > td {
+  padding: 10px;
+}

package/es/WorkerFlow/index.d.ts

@@ -0,0 +1,8 @@
+import { WorkerFlowRequest, WorkerFlowFormType } from './interface';
+import './index.less';
+interface IWorkFlowProps {
+    data: WorkerFlowRequest;
+    form?: WorkerFlowFormType[];
+}
+declare function WorkFlow({ data: _data, form }: IWorkFlowProps): JSX.Element;
+export default WorkFlow;