@cloudbase/weda-ui 3.5.2-mp → 3.5.3

package/dist/web/components/formdetail/index.css

@@ -0,0 +1,491 @@
+.form-detail-wrap {
+  width: 100%;
+}
+.form-detail-wrap .form-detail-content-wrap {
+  border: 1px solid #dcdcdc;
+  margin-top: 12px;
+}
+.form-detail-wrap
+  .form-detail-content-wrap
+  .form-detail-group-header-container {
+  height: 48px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  background: #f1f2f5;
+  padding: 13px 20px;
+  border-bottom: 1px solid #dcdcdc;
+}
+.form-detail-wrap
+  .form-detail-content-wrap
+  .form-detail-group-header-container
+  .form-detail-title-container {
+  display: flex;
+  color: rgba(0, 0, 0, 0.9);
+}
+.form-detail-wrap .form-detail-content-wrap .form-detail-header-text {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  color: rgba(0, 0, 0, 0.9);
+  flex: 1;
+}
+.form-detail-wrap
+  .form-detail-content-wrap
+  .form-detail-group-content-container {
+  padding: 15px 16px;
+}
+.form-detail-wrap .form-detail-add-button,
+.form-detail-wrap .form-detail-delete-button {
+  cursor: pointer;
+  color: #0052d9;
+  font-size: 14px;
+}
+
+.form-detail-wrap .form-detail-add-button {
+  padding: 8px 16px 16px 16px;
+  display: inline-flex;
+  align-items: center;
+}
+.form-detail-wrap .form-detail-add-button > .weda-ui {
+  vertical-align: baseline;
+  padding-right: 5px;
+  line-height: 1;
+}
+.h5-form-detail-wrap {
+  width: 100%;
+}
+.h5-form-detail-wrap .form-detail-content-wrap {
+  margin: 0;
+  border: none;
+}
+.h5-form-detail-wrap
+  .form-detail-content-wrap
+  .form-detail-group-header-container {
+  height: 40px;
+  border: none;
+}
+.h5-form-detail-wrap
+  .form-detail-content-wrap
+  .form-detail-group-content-container {
+  width: 100%;
+  padding: 0;
+}
+.form-detail-wrap .form-detail-title-index {
+  padding-left: 5px;
+}
+.form-detail-wrap .form-detail-title-index::before {
+  content: '(';
+}
+.form-detail-wrap .form-detail-title-index::after {
+  content: ')';
+}
+.h5-form-detail-wrap .form-detail-add-button {
+  font-size: 16px;
+  line-height: 1;
+}
+.h5-form-detail-wrap
+  .form-detail-content-wrap
+  .form-detail-group-header-container {
+  position: relative;
+}
+.h5-form-detail-wrap
+  .form-detail-content-wrap
+  .form-detail-group-header-container::before {
+  content: '';
+  width: 100%;
+  position: absolute;
+  height: 1px;
+  background: #f1f2f5;
+  top: -1px;
+  left: 0;
+  z-index: 5;
+}
+.h5-form-detail-wrap
+  .form-detail-content-wrap
+  .form-detail-group-header-container::after {
+  content: '';
+  width: 100%;
+  position: absolute;
+  height: 1px;
+  background: #f1f2f5;
+  bottom: -1px;
+  left: 0;
+  z-index: 5;
+}
+/* 子表单样式更新 */
+.form-detail-wrap {
+  display: block;
+  overflow: auto;
+}
+.form-detail-wrap.h5-form-detail-wrap {
+  padding: 0 5px;
+}
+.form-detail-wrap.h5-form-detail-wrap .form-detail-content-wrap {
+  border: 1px solid #dcdcdc;
+  border-bottom: none;
+  border-top: none;
+  position: relative;
+}
+.form-detail-wrap.h5-form-detail-wrap .form-detail-content-wrap:first-child {
+  border-top: 1px solid #dcdcdc;
+}
+.form-detail-wrap.h5-form-detail-wrap .form-detail-content-wrap::after {
+  content: '';
+  width: 100%;
+  position: absolute;
+  height: 1px;
+  background: #dcdcdc;
+  bottom: 0px;
+  left: 0;
+  z-index: 5;
+}
+.form-detail-wrap.h5-form-detail-wrap
+  .form-detail-content-wrap
+  .form-detail-group-header-container::before {
+  display: none;
+}
+.form-detail-group-parent-container {
+  flex: 1;
+}
+.form-detail-wrap.h5-form-detail-wrap .form-detail-group-label-container {
+  padding: 16px 16px 16px 11px;
+  display: flex;
+  align-items: center;
+  font-size: 16px;
+  width: auto;
+}
+
+.form-detail-group-label-container {
+  padding: 7px 4px 7px 0;
+  width: 102px;
+}
+.form-detail-wrap
+  .form-detail-content-wrap
+  .form-detail-group-header-container {
+  padding: 13px 15px;
+}
+.form-detail-wrap .form-detail-title-index {
+  padding-left: 0;
+}
+
+/* 子表单禁用样式 */
+.form-detail-wrap.disabled .form-detail-delete-button,
+.form-detail-wrap.disabled .form-detail-add-button {
+  cursor: not-allowed;
+  color: #bbd3fb;
+}
+.form-detail-wrap.disabled .form-detail-delete-button .wd-typography,
+.form-detail-wrap.disabled .form-detail-add-button .wd-typography {
+  cursor: not-allowed;
+  color: #bbd3fb;
+}
+.form-detail-wrap.disabled .form-detail-add-button .t-icon {
+  color: #bbd3fb !important;
+}
+.form-detail-wrap.disabled .form-detail-group-content-container {
+  cursor: not-allowed;
+}
+.form-detail-wrap.disabled .form-detail-group-content-container > div {
+  pointer-events: none;
+}
+.form-detail-wrap.disabled
+  .form-detail-group-content-container
+  .weui-uploader__input {
+  z-index: -1;
+}
+.form-detail-wrap.readOnly .form-detail-delete-button,
+.form-detail-wrap.readOnly .form-detail-add-button {
+  display: none;
+}
+.form-detail-wrap.readOnly .weui-uploader__input-box > input {
+  display: none;
+}
+
+.form-detail-wrap.readOnly .form-detail-group-content-container > div {
+  pointer-events: none;
+}
+
+/* 兼容旧的子表单样式,不能采用flex布局 */
+
+.pc-form-detail-wrap .form-detail-group-parent-container {
+  float: right;
+  width: calc(100% - 102px);
+}
+.pc-form-detail-wrap .form-detail-group-label-container {
+  float: left;
+  width: 102px;
+}
+.wedatea2td-form--vertical
+  .form-detail-wrap.pc-form-detail-wrap
+  .form-detail-group-parent-container {
+  float: unset;
+  width: 100%;
+}
+.wedatea2td-form--vertical
+  .form-detail-wrap.pc-form-detail-wrap
+  .form-detail-group-label-container {
+  float: unset;
+  width: 100%;
+}
+
+.wd-form--vertical-left
+  .form-detail-wrap.pc-form-detail-wrap
+  .form-detail-group-parent-container,
+.wd-form--vertical-right
+  .form-detail-wrap.pc-form-detail-wrap
+  .form-detail-group-parent-container {
+  float: unset;
+  width: 100%;
+}
+.wd-form--vertical-left
+  .form-detail-wrap.pc-form-detail-wrap
+  .form-detail-group-label-container {
+  float: unset;
+  width: 100%;
+}
+.wd-form--vertical-right
+  .form-detail-wrap.pc-form-detail-wrap
+  .form-detail-group-label-container {
+  float: unset;
+  width: 100%;
+  text-align: right;
+}
+
+.wd-form--vertical-right
+  .weda-ui.gsd-h5-react-formitem.form-detail-wrap.pc-form-detail-wrap
+  .form-detail-group-label-container,
+.wd-form--vertical-left
+  .weda-ui.gsd-h5-react-formitem.form-detail-wrap.pc-form-detail-wrap
+  .form-detail-group-label-container {
+  width: auto;
+}
+
+/* 升级后组件样式兼容 */
+.form-detail-wrap .form-detail-add-button .wd-typography,
+.form-detail-wrap .form-detail-delete-button .wd-typography {
+  color: #0052d9;
+  margin-bottom: 0;
+}
+
+/* 增加表格样式 */
+.form-detail-wrap.form-detail-table
+  .form-detail-content-wrap
+  .form-detail-group-header-container {
+  display: none;
+}
+.form-detail-table .weda-formcells__pc .wedatea2td-form__label {
+  display: none;
+}
+.wedatea2td-form .form-detail-table .wedatea2td-form__label {
+  display: none;
+}
+.form-detail-wrap.form-detail-table
+  .form-detail-content-wrap
+  .form-detail-group-content-container {
+  padding: 0;
+  border-bottom: 1px solid #dcdcdc;
+}
+.form-detail-wrap.form-detail-table
+  .form-detail-content-wrap
+  .form-detail-group-content-container:last-child {
+  border-bottom: none;
+}
+.form-detail-wrap.form-detail-table .weda-ui .wedatea2td-form__controls {
+  padding: 0;
+}
+.form-detail-wrap.form-detail-list .wd-grid-col.wd-g-align-self-auto {
+  width: 100%;
+  flex: 0 0 auto;
+}
+.form-detail-wrap.form-detail-list .form-detail-table-header-container {
+  display: none;
+}
+
+.form-detail-wrap.form-detail-list .form-detail-table-delete-btn-container {
+  display: none;
+}
+
+.form-detail-wrap.form-detail-list
+  .weda-ui.weda-input
+  .weui-flex__item
+  .weui-cell_form {
+  padding: 0 16px;
+}
+.form-detail-wrap.form-detail-list .form-detail-content-wrap {
+  overflow: hidden;
+}
+.form-detail-wrap.form-detail-list
+  .form-detail-content-wrap
+  .form-detail-group-header-container {
+  border-top: 1px solid #dcdcdc;
+}
+.form-detail-wrap.form-detail-list .form-detail-content-wrap {
+  border-top: none;
+  border-bottom: none;
+}
+.form-detail-wrap.form-detail-list
+  .form-detail-content-wrap
+  .form-detail-group-content-container:last-child {
+  border-bottom: 1px solid #dcdcdc;
+}
+.form-detail-wrap.form-detail-list.h5-form-detail-wrap
+  .form-detail-content-wrap:first-child {
+  border-top: none;
+}
+.form-detail-wrap.form-detail-list.pc-form-detail-wrap
+  .form-detail-content-wrap {
+  margin-top: 0;
+}
+.form-detail-wrap.form-detail-list .wd-grid-col.tableIndexContainer {
+  display: none;
+}
+.form-detail-wrap .form-detail-content-wrap .wd-grid-row {
+  margin: 0;
+}
+
+.form-detail-wrap.form-detail-table
+  .form-detail-group-parent-container
+  .wd-grid-col-lg {
+  min-width: 240px;
+  width: 240px;
+}
+
+.form-detail-wrap.form-detail-table
+  .form-detail-group-parent-container
+  .wd-grid-col-lg.formimageuploader,
+.form-detail-wrap.form-detail-table
+  .form-detail-group-parent-container
+  .wd-grid-col-lg.formuploadfile {
+  min-width: 360px;
+}
+.form-detail-wrap.form-detail-table
+  .form-detail-group-parent-container
+  .wd-grid-col-lg.formswitch {
+  min-width: 120px;
+  width: 120px;
+}
+.form-detail-wrap.form-detail-table
+  .form-detail-group-parent-container
+  .wd-grid-col-lg.formrichtext {
+  min-width: 570px;
+}
+.form-detail-wrap.form-detail-table .form-detail-group-content-container {
+  flex-flow: nowrap;
+  margin: 0;
+}
+.form-detail-wrap.form-detail-table .wd-form-detail-content-container {
+  width: max-content;
+  max-width: 100%;
+  min-width: 100%;
+  display: block;
+  overflow: auto;
+  border-left: 1px solid #dcdcdc;
+  border-right: 1px solid #dcdcdc;
+  border-bottom: 1px solid #dcdcdc;
+  margin-bottom: 8px;
+  border-radius: 5px;
+  overflow-y: hidden;
+  position: relative;
+  z-index: 0;
+}
+.form-detail-wrap.form-detail-table .form-detail-content-wrap {
+  margin-top: 0;
+  border: none;
+  width: fit-content;
+  min-width: 100%;
+}
+.form-detail-table .form-detail-table-header-container {
+  background-color: #f3f3f3;
+  width: max-content;
+  min-width: 100%;
+  position: relative;
+  border-top: 1px solid #dcdcdc;
+  border-top-left-radius: 5px;
+  border-top-right-radius: 5px;
+  font-weight: 600;
+}
+.form-detail-table .wd-grid-col.form-detail-table-option-container,
+.form-detail-table .wd-grid-col.form-detail-table-delete-btn-container {
+  flex: 1 0 0%;
+  width: 140px;
+  max-width: 140px;
+  position: sticky;
+  right: 0;
+  z-index: 1;
+  align-items: center;
+  display: flex;
+}
+.form-detail-table .wd-grid-col.tableIndexContainer {
+  width: 60px;
+  max-width: 60px;
+  align-items: center;
+  display: flex;
+  justify-content: center;
+}
+.form-detail-table
+  .form-detail-table-header-container
+  .form-detail-group-content-container
+  .wd-grid-col {
+  padding: 12px;
+}
+.form-detail-table
+  .form-detail-content-wrap
+  .form-detail-group-content-container
+  .wd-grid-col {
+  padding: 16px 12px;
+}
+.form-detail-table .tableHeaderCellContainer {
+  display: flex;
+  position: relative;
+}
+.form-detail-table .tableHeaderCellContainer .tableFieldRequired {
+  color: #e34d59;
+  position: absolute;
+  left: -10px;
+}
+.form-detail-table .wd-grid-col.form-detail-table-option-container {
+  background-color: #f3f3f3;
+  z-index: 2;
+}
+.form-detail-table .wd-grid-col.form-detail-table-delete-btn-container {
+  background-color: #fff;
+}
+.form-detail-table.scroll
+  .wd-grid-col.form-detail-table-option-container::before,
+.form-detail-table.scroll
+  .wd-grid-col.form-detail-table-delete-btn-container
+  ::before {
+  content: '';
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: -25px;
+  width: 25px;
+  box-shadow: inset -8px 0 4px -7px rgb(0 0 0 / 10%);
+}
+
+.form-detail-wrap.form-detail-table.readOnly
+  .form-detail-table-delete-btn-container,
+.form-detail-wrap.form-detail-table.readOnly
+  .form-detail-table-option-container {
+  display: none;
+}
+
+.form-detail-wrap.form-detail-table
+  .form-detail-group-parent-container
+  .wd-grid-col-lg.formrichtext
+  .bf-content {
+  height: 161px;
+}
+.form-detail-wrap .wd-grid-row > div {
+  margin: 0;
+}
+
+.form-detail-wrap.form-detail-table .weda-ui.gsd-h5-react-formitem > .weda-ui {
+  padding: 0;
+}
+
+.form-detail-wrap.form-detail-table .wd-form-item {
+  margin: 0;
+}

package/dist/web/components/formdetail/index.d.ts

@@ -0,0 +1,36 @@
+import React from 'react';
+import type { CommonPropsType, ICompRef } from '../../types';
+import type { DataType } from '../../../configs/components/wd-form-detail';
+export interface PropsType extends CommonPropsType {
+    name?: string;
+    value?: any;
+    isPureArray?: boolean;
+    disabled: boolean;
+    readOnly: boolean;
+    fieldAuth: string;
+    hasInitValue: boolean;
+}
+import './style';
+type TCompRef = ICompRef<{
+    addition: () => void;
+    remove: (key: string) => void;
+}>;
+export declare const reorderContext: (data: any, name: any, isPureArray: any) => any;
+export declare const newContextItem: (childFormItem: any, name: any, isPureArray: any) => {
+    index: number;
+    _id: string;
+};
+export declare const changeHandle: ({ type, name, data, childFormItem, isPureArray, params, }: {
+    type: any;
+    name: any;
+    data: any;
+    childFormItem: any;
+    isPureArray: any;
+    params: any;
+}) => any;
+declare const FormDetailCom: React.ForwardRefExoticComponent<WdFormDetailProps & React.RefAttributes<TCompRef>>;
+export default FormDetailCom;
+export interface WdFormDetailProps extends CommonPropsType, DataType {
+    wrapClassName?: string;
+    groupClassName?: string;
+}