@longhongguo/form-create-ant-design-vue 3.3.4 → 3.3.7

package/auto-import.js

@@ -26,7 +26,8 @@ import {
   Spin,
   Transfer,
   Image,
-  Table
+  Table,
+  Alert
 } from 'ant-design-vue'
 
 export default function install(formCreate) {
@@ -61,5 +62,6 @@ export default function install(formCreate) {
     app.component(Transfer.name) || app.use(Transfer)
     app.component(Image.name) || app.use(Image)
     app.component(Table.name) || app.use(Table)
+    app.component(Alert.name) || app.use(Alert)
   })
 }

package/dist/form-create.css

@@ -26,6 +26,438 @@
   display: none !important;
 }
 
+/* 预览模式样式增强 */
+
+.form-create.is-preview .ant-form-item {
+  margin-bottom: 8px !important;
+}
+
+.form-create.is-preview .form-create .ant-form-item {
+  margin-bottom: 8px !important;
+}
+
+.form-create.is-preview .ant-form-item.ant-form-item-with-help {
+  margin-bottom: 4px !important;
+}
+
+.form-create.is-preview
+  .form-create
+  .ant-form-item
+  .ant-form-item.ant-form-item-with-help {
+  margin-bottom: -8px !important;
+}
+
+/* 移除组件边框 */
+.form-create.is-preview .ant-input,
+.form-create.is-preview .ant-input-number,
+.form-create.is-preview .ant-select-selector,
+.form-create.is-preview .ant-picker,
+.form-create.is-preview .ant-cascader-picker,
+.form-create.is-preview .ant-input-password,
+.form-create.is-preview .ant-textarea,
+.form-create.is-preview .ant-upload,
+.form-create.is-preview .ant-upload-list,
+.form-create.is-preview .ant-upload-list-item,
+.form-create.is-preview .ant-input-wrapper,
+.form-create.is-preview .ant-input-affix-wrapper,
+.form-create.is-preview .ant-input-group-wrapper,
+.form-create.is-preview .ant-input-group {
+  border: none !important;
+  box-shadow: none !important;
+  background: transparent !important;
+}
+
+.form-create.is-preview .ant-input:focus,
+.form-create.is-preview .ant-input-number:focus,
+.form-create.is-preview .ant-select-focused .ant-select-selector,
+.form-create.is-preview .ant-picker:focus,
+.form-create.is-preview .ant-cascader-picker:focus,
+.form-create.is-preview .ant-input-password:focus,
+.form-create.is-preview .ant-textarea:focus,
+.form-create.is-preview .ant-input-wrapper:focus,
+.form-create.is-preview .ant-input-affix-wrapper:focus,
+.form-create.is-preview .ant-input-affix-wrapper-focused {
+  border: none !important;
+  box-shadow: none !important;
+  outline: none !important;
+}
+
+.form-create.is-preview .ant-input:hover,
+.form-create.is-preview .ant-input-number:hover,
+.form-create.is-preview .ant-select:hover .ant-select-selector,
+.form-create.is-preview .ant-picker:hover,
+.form-create.is-preview .ant-cascader-picker:hover,
+.form-create.is-preview .ant-input-password:hover,
+.form-create.is-preview .ant-textarea:hover,
+.form-create.is-preview .ant-input-wrapper:hover,
+.form-create.is-preview .ant-input-affix-wrapper:hover {
+  border: none !important;
+  box-shadow: none !important;
+}
+
+/* 预览模式：移除所有 input 相关元素的边框（更全面的覆盖） */
+.form-create.is-preview .ant-input-affix-wrapper,
+.form-create.is-preview .ant-input-affix-wrapper:hover,
+.form-create.is-preview .ant-input-affix-wrapper-focused,
+.form-create.is-preview .ant-input-affix-wrapper-disabled,
+.form-create.is-preview .ant-input-wrapper .ant-input,
+.form-create.is-preview .ant-input-group-addon,
+.form-create.is-preview .ant-input-group .ant-input,
+.form-create.is-preview input.ant-input,
+.form-create.is-preview textarea.ant-input {
+  border: none !important;
+  border-width: 0 !important;
+  box-shadow: none !important;
+  outline: none !important;
+  background: transparent !important;
+}
+
+/* 隐藏字数限制等提示信息 */
+.form-create.is-preview .ant-input-character-count,
+.form-create.is-preview .ant-textarea-character-count,
+.form-create.is-preview .ant-form-item-explain,
+.form-create.is-preview .ant-form-item-extra,
+.form-create.is-preview .ant-form-item-feedback-icon,
+.form-create.is-preview
+  .ant-form-item-has-feedback
+  .ant-form-item-children-icon {
+  display: none !important;
+}
+
+/* 隐藏必填标记 */
+.form-create.is-preview
+  .ant-form-item-label
+  > label.ant-form-item-required::before,
+.form-create.is-preview label.ant-form-item-required::before {
+  display: none !important;
+}
+
+/* 隐藏帮助图标和提示 */
+.form-create.is-preview .ant-form-item-label .anticon,
+.form-create.is-preview .ant-form-item-label .fc-icon {
+  display: none !important;
+}
+
+/* 预览模式：禁用所有交互 */
+.form-create.is-preview * {
+  pointer-events: none !important;
+}
+
+/* 预览模式：允许 textarea 交互（用于复制文本） */
+.form-create.is-preview textarea.ant-input {
+  pointer-events: auto !important;
+  user-select: text !important;
+  -webkit-user-select: text !important;
+  -moz-user-select: text !important;
+  -ms-user-select: text !important;
+  cursor: text !important;
+}
+
+/* 预览模式：允许富文本编辑器容器滚动 */
+.form-create.is-preview .w-e-text-container {
+  pointer-events: auto !important;
+  overflow-y: auto !important;
+  overflow-x: hidden !important;
+}
+
+.form-create.is-preview .w-e-text {
+  pointer-events: auto !important;
+  overflow-y: auto !important;
+  overflow-x: hidden !important;
+  cursor: default !important;
+  /* 确保可以滚动 */
+  -webkit-overflow-scrolling: touch !important;
+}
+
+/* 预览模式：允许 upload 组件的预览功能（整个列表项可以点击预览） */
+.form-create.is-preview .ant-upload-list-item {
+  pointer-events: auto !important;
+}
+
+/* 预览模式：允许 upload 组件中的预览相关元素 */
+.form-create.is-preview .ant-upload-list-item-thumbnail,
+.form-create.is-preview .ant-upload-list-item-thumbnail *,
+.form-create.is-preview .ant-upload-list-item-name,
+.form-create.is-preview .ant-upload-list-item-preview,
+.form-create.is-preview .ant-upload-list-item-preview-icon,
+.form-create.is-preview .ant-upload-list-item-actions-preview,
+.form-create.is-preview .ant-upload-list-item-actions .anticon-eye,
+.form-create.is-preview .ant-upload-list-item-info,
+.form-create.is-preview .ant-upload-list-item-info > span,
+.form-create.is-preview
+  .ant-upload-picture-card
+  .ant-upload-list-item-thumbnail,
+.form-create.is-preview
+  .ant-upload-picture-card
+  .ant-upload-list-item-thumbnail
+  * {
+  pointer-events: auto !important;
+  cursor: pointer !important;
+}
+
+/* 预览模式：允许 image 组件的预览功能 */
+.form-create.is-preview .ant-image,
+.form-create.is-preview .ant-image-img,
+.form-create.is-preview .ant-image-mask,
+.form-create.is-preview .ant-image-mask-info {
+  pointer-events: auto !important;
+  cursor: pointer !important;
+}
+
+/* 预览模式：允许图片预览弹窗可以交互 */
+.form-create.is-preview .ant-modal,
+.form-create.is-preview .ant-modal-wrap,
+.form-create.is-preview .ant-modal-mask,
+.form-create.is-preview .ant-modal-content,
+.form-create.is-preview .ant-modal-close,
+.form-create.is-preview .ant-modal-header,
+.form-create.is-preview .ant-modal-body,
+.form-create.is-preview .ant-modal-footer {
+  pointer-events: auto !important;
+}
+
+/* 预览模式：隐藏 upload 组件的上传按钮 */
+.form-create.is-preview .ant-upload-select,
+.form-create.is-preview .ant-upload-select-picture-card {
+  display: none !important;
+}
+
+/* 预览模式：阻止 upload 组件中的删除和其他操作按钮（优先级更高） */
+.form-create.is-preview .ant-upload-list-item-actions-delete,
+.form-create.is-preview .ant-upload-list-item-actions-upload,
+.form-create.is-preview .ant-upload-list-item-actions-download,
+.form-create.is-preview .ant-upload-list-item-actions .anticon-delete,
+.form-create.is-preview .ant-upload-list-item-actions .anticon-close,
+.form-create.is-preview .ant-upload-list-item-actions-item .anticon-delete,
+.form-create.is-preview .ant-upload-list-item-actions-item-delete,
+.form-create.is-preview .ant-upload-list-item-actions-item-upload,
+.form-create.is-preview .ant-upload-list-item-remove {
+  pointer-events: none !important;
+  cursor: not-allowed !important;
+}
+
+/* 预览模式：防止组件显示为禁用状态（不置灰） */
+.form-create.is-preview .ant-input,
+.form-create.is-preview .ant-input-number,
+.form-create.is-preview .ant-select,
+.form-create.is-preview .ant-picker,
+.form-create.is-preview .ant-cascader,
+.form-create.is-preview .ant-input-password,
+.form-create.is-preview .ant-textarea,
+.form-create.is-preview .ant-radio,
+.form-create.is-preview .ant-checkbox,
+.form-create.is-preview .ant-switch,
+.form-create.is-preview .ant-slider,
+.form-create.is-preview .ant-rate,
+.form-create.is-preview .ant-upload,
+.form-create.is-preview .ant-btn {
+  opacity: 1 !important;
+  color: inherit !important;
+  background-color: transparent !important;
+}
+
+/* 预览模式：CusSelect 组件保持正常外观，不置灰 */
+.form-create.is-preview .fc-cus-select,
+.form-create.is-preview .fc-cus-select-selector,
+.form-create.is-preview .fc-cus-select-selection-item,
+.form-create.is-preview .fc-cus-select-selection-placeholder {
+  opacity: 1 !important;
+  color: inherit !important;
+  background-color: transparent !important;
+}
+
+/* 预览模式：移除 CusSelect 选择器的边框 */
+.form-create.is-preview .fc-cus-select-selector {
+  border: none !important;
+  box-shadow: none !important;
+}
+
+/* 预览模式：隐藏 CusSelect 的箭头和清除按钮 */
+.form-create.is-preview .fc-cus-select-arrow,
+.form-create.is-preview .fc-cus-select-clear {
+  display: none !important;
+}
+
+/* 预览模式：隐藏选择器的下拉箭头 */
+.form-create.is-preview .ant-select-arrow,
+.form-create.is-preview .ant-select-suffix {
+  display: none !important;
+}
+
+/* 预览模式：隐藏日期选择器的图标 */
+.form-create.is-preview .ant-picker-suffix,
+.form-create.is-preview .ant-picker-suffix .anticon {
+  display: none !important;
+}
+
+/* 预览模式：隐藏其他输入框的清除按钮和图标 */
+.form-create.is-preview .ant-input-clear-icon,
+.form-create.is-preview .ant-input-number-handler,
+.form-create.is-preview .ant-input-number-handler-wrap {
+  display: none !important;
+}
+
+/* 预览模式：防止输入框显示为禁用状态的灰色 */
+.form-create.is-preview .ant-input[disabled],
+.form-create.is-preview .ant-input-number[disabled],
+.form-create.is-preview .ant-select-disabled,
+.form-create.is-preview .ant-picker-disabled,
+.form-create.is-preview .ant-textarea[disabled] {
+  opacity: 1 !important;
+  color: inherit !important;
+  background-color: transparent !important;
+  cursor: default !important;
+}
+
+/* 预览模式：textarea 自适应高度且只读可复制 */
+.form-create.is-preview textarea.ant-input,
+.form-create.is-preview .ant-textarea {
+  /* 允许文本选择，用于复制 */
+  user-select: text !important;
+  -webkit-user-select: text !important;
+  -moz-user-select: text !important;
+  -ms-user-select: text !important;
+  /* 允许交互，用于复制 */
+  pointer-events: auto !important;
+  cursor: text !important;
+  /* 移除滚动条（因为内容会自适应显示） */
+  overflow: hidden !important;
+  overflow-y: hidden !important;
+  overflow-x: hidden !important;
+  /* 确保只读状态下仍可正常显示和选择 */
+  resize: none !important;
+  /* 确保 textarea 能够根据内容自动调整高度 */
+  box-sizing: border-box !important;
+  /* 移除固定高度限制，让 JavaScript 动态设置 */
+  min-height: auto !important;
+  max-height: none !important;
+}
+
+/* 预览模式：textarea 只读状态样式 */
+.form-create.is-preview textarea.ant-input[readonly],
+.form-create.is-preview .ant-textarea[readonly] {
+  opacity: 1 !important;
+  color: inherit !important;
+  background-color: transparent !important;
+  cursor: text !important;
+}
+
+/* 预览模式：防止选择器显示为禁用状态 */
+.form-create.is-preview .ant-select-disabled .ant-select-selector {
+  opacity: 1 !important;
+  color: inherit !important;
+  background-color: transparent !important;
+  cursor: default !important;
+}
+
+/* 预览模式：防止日期选择器显示为禁用状态 */
+.form-create.is-preview .ant-picker-disabled {
+  opacity: 1 !important;
+  color: inherit !important;
+  background-color: transparent !important;
+  cursor: default !important;
+}
+
+/* 预览模式：富文本编辑器样式 */
+.form-create.is-preview .w-e-text-container {
+  border: none !important;
+  box-shadow: none !important;
+  background: transparent !important;
+  /* 移除高度限制，让内容自适应 */
+  height: auto !important;
+  min-height: auto !important;
+  max-height: none !important;
+}
+
+.form-create.is-preview .w-e-toolbar {
+  display: none !important;
+}
+
+.form-create.is-preview .w-e-text {
+  border: none !important;
+  box-shadow: none !important;
+  background: transparent !important;
+  /* 移除高度限制，让内容自适应 */
+  height: auto !important;
+  min-height: auto !important;
+  max-height: none !important;
+}
+
+/* 富文本内容只读：允许选择文本和点击链接，但禁止编辑 */
+.form-create.is-preview .w-e-text p,
+.form-create.is-preview .w-e-text div,
+.form-create.is-preview .w-e-text span,
+.form-create.is-preview .w-e-text li,
+.form-create.is-preview .w-e-text ul,
+.form-create.is-preview .w-e-text ol,
+.form-create.is-preview .w-e-text h1,
+.form-create.is-preview .w-e-text h2,
+.form-create.is-preview .w-e-text h3,
+.form-create.is-preview .w-e-text h4,
+.form-create.is-preview .w-e-text h5,
+.form-create.is-preview .w-e-text h6,
+.form-create.is-preview .w-e-text table,
+.form-create.is-preview .w-e-text tr,
+.form-create.is-preview .w-e-text td,
+.form-create.is-preview .w-e-text th {
+  /* 允许文本选择，用于复制 */
+  user-select: text !important;
+  -webkit-user-select: text !important;
+  -moz-user-select: text !important;
+  -ms-user-select: text !important;
+  /* 阻止编辑，但不阻止交互 */
+  pointer-events: auto !important;
+}
+
+/* 允许链接可以点击 */
+.form-create.is-preview .w-e-text a {
+  pointer-events: auto !important;
+  cursor: pointer !important;
+  user-select: text !important;
+  -webkit-user-select: text !important;
+  -moz-user-select: text !important;
+  -ms-user-select: text !important;
+  text-decoration: underline !important;
+}
+
+/* 允许图片可以查看 */
+.form-create.is-preview .w-e-text img {
+  pointer-events: auto !important;
+  user-select: none !important;
+  -webkit-user-select: none !important;
+  -moz-user-select: none !important;
+  -ms-user-select: none !important;
+}
+
+/* 禁止编辑：通过 contenteditable 属性控制 */
+.form-create.is-preview .w-e-text {
+  user-select: text !important;
+  -webkit-user-select: text !important;
+  -moz-user-select: text !important;
+  -ms-user-select: text !important;
+}
+
+/* 预览模式：禁用按钮点击 */
+.form-create.is-preview .ant-btn {
+  pointer-events: none !important;
+  cursor: default !important;
+}
+
+/* 预览模式：禁用选择器下拉 */
+.form-create.is-preview .ant-select-dropdown {
+  display: none !important;
+}
+
+/* 预览模式：禁用日期选择器弹窗 */
+.form-create.is-preview .ant-picker-dropdown {
+  display: none !important;
+}
+
+/* 预览模式：禁用级联选择器下拉 */
+.form-create.is-preview .ant-cascader-dropdown {
+  display: none !important;
+}
+
 .fc-form-footer {
   margin-top: 12px;
 }