Options
All
  • Public
  • Public/Protected
  • All
Menu

Class DesignerRenderBase

设计器界面渲染渲染基类

Hierarchy

Implements

Index

Constructors

Methods

Constructors

constructor

  • Returns DesignerRenderBase

Methods

Protected doClearContainer

  • doClearContainer(): void

  • Returns void

Protected doGetCmpItemCss

  • doGetCmpItemCss(): any

  • 获取组件的css

    Returns any

Protected doGetCmpToolBarCss

  • doGetCmpToolBarCss(): Object

  • 获取组件导航css

    Returns Object

Protected doInitEvent

  • doInitEvent(): void

  • Returns void

Protected doRenderCmpsFromGroup

  • doRenderCmpsFromGroup(groupId: string): void

  • Parameters

    • groupId: string

    Returns void

Protected doRenderGroupFormTopGroup

  • doRenderGroupFormTopGroup(topGroupId: string): void

  • Parameters

    • topGroupId: string

    Returns void

Protected getContainerElem

  • getContainerElem(): JQuery<HTMLElement>

  • Returns JQuery<HTMLElement>

getCss

  • getCss(): { @global: { @keyframes linearGradientMove: { 100%: { background-position: string } }; @keyframes load: { 0%,40%,100%: { transform: string }; 20%: { transform: string } } }; Designer: { & *: { &::-webkit-scrollbar: { height: string; width: string }; &::-webkit-scrollbar-thumb: { border-radius: string }; &::-webkit-scrollbar-track: { border-radius: string }; box-sizing: string; outline: string; scrollbar-width: string }; & .focus-border: { border: string }; & .focus-border-blue: { border-color: string }; & .focus-border-white: { border-color: string }; & .right-menu: { & a: { color: string; text-decoration: string }; & li: { &:hover: { background: string; color: string }; color: string; cursor: string; padding: string }; background-color: string; border: string; box-shadow: string; color: string; display: string; line-height: string; margin: string; padding: string; position: string; width: string }; & .row-fluid: { -moz-box-shadow: string; -moz-box-sizing: string; -webkit-box-shadow: string; -webkit-box-sizing: string; background-color: string; border-radius: string; box-shadow: string; box-sizing: string; position: string }; & .yh-designer-canvas-container [xtype] *:focus: { animation: string; border: string; border-color: string }; & .yh-designer-component-attr-item: { & .layui-input,& .yh-input: { &:focus: { border-color: string; border-right-width: string; box-shadow: string; outline: string }; &:hover: { border-color: string; outline: string }; border-radius: string; height: string }; & .yh-designer-form-label: { color: string; font-weight: string } }; & .yh-designer-component-container: any; & .yh-designer-component-toolbar: Object; & .yh-designer-disable-child-fouse: { & *: { pointer-events: string } }; & .yh-designer-header: { & .layui-form-onswitch: { background-color: string; border-color: string }; & .yh-button: { margin-right: string }; & .yh-designer-toolbar: { & .yh-designer-toolbar-left: {}; & .yh-designer-toolbar-right: { & #page-state: { color: string; font-weight: string; margin-right: string; vertical-align: string }; float: string }; background-color: string; border-bottom: string; padding: string } }; & .yh-designer-right: { & .layui-tab: { & .layui-tab-title: { & .layui-this:after: { border-bottom: string }; & li: {} }; height: string; margin: number }; & .yh-designer-component-attribute: { & .yh-designer-attr-container: { padding-left: string }; & .yh-designer-component-attr-item: { margin-bottom: string }; & .yh-designer-form-label: { display: string; float: string; padding: string; padding-bottom: string; padding-left: string; text-align: string; width: string }; & .yh-designer-form-label-help: { &:hover: { color: string }; cursor: string; font-size: string; margin-left: string }; & .yh-designer-input-box: { display: string; position: string }; border-left: string; float: string; height: string; margin-top: string; overflow: string; padding-bottom: string; padding-left: string; text-align: string }; -moz-transition: string; -ms-transition: string; -o-transition: string; -webkit-transition: string; background: string; bottom: string; padding: string; position: string; right: string; top: string; transition: string; width: string; z-index: string }; & .zlui-icon-gongs: { cursor: string }; & .zlui-icon-gongs:hover: { color: string }; .yh-designer-canvas-container: {}; cursor: string; min-height: string } }

  • 获取css样式

    Returns { @global: { @keyframes linearGradientMove: { 100%: { background-position: string } }; @keyframes load: { 0%,40%,100%: { transform: string }; 20%: { transform: string } } }; Designer: { & *: { &::-webkit-scrollbar: { height: string; width: string }; &::-webkit-scrollbar-thumb: { border-radius: string }; &::-webkit-scrollbar-track: { border-radius: string }; box-sizing: string; outline: string; scrollbar-width: string }; & .focus-border: { border: string }; & .focus-border-blue: { border-color: string }; & .focus-border-white: { border-color: string }; & .right-menu: { & a: { color: string; text-decoration: string }; & li: { &:hover: { background: string; color: string }; color: string; cursor: string; padding: string }; background-color: string; border: string; box-shadow: string; color: string; display: string; line-height: string; margin: string; padding: string; position: string; width: string }; & .row-fluid: { -moz-box-shadow: string; -moz-box-sizing: string; -webkit-box-shadow: string; -webkit-box-sizing: string; background-color: string; border-radius: string; box-shadow: string; box-sizing: string; position: string }; & .yh-designer-canvas-container [xtype] *:focus: { animation: string; border: string; border-color: string }; & .yh-designer-component-attr-item: { & .layui-input,& .yh-input: { &:focus: { border-color: string; border-right-width: string; box-shadow: string; outline: string }; &:hover: { border-color: string; outline: string }; border-radius: string; height: string }; & .yh-designer-form-label: { color: string; font-weight: string } }; & .yh-designer-component-container: any; & .yh-designer-component-toolbar: Object; & .yh-designer-disable-child-fouse: { & *: { pointer-events: string } }; & .yh-designer-header: { & .layui-form-onswitch: { background-color: string; border-color: string }; & .yh-button: { margin-right: string }; & .yh-designer-toolbar: { & .yh-designer-toolbar-left: {}; & .yh-designer-toolbar-right: { & #page-state: { color: string; font-weight: string; margin-right: string; vertical-align: string }; float: string }; background-color: string; border-bottom: string; padding: string } }; & .yh-designer-right: { & .layui-tab: { & .layui-tab-title: { & .layui-this:after: { border-bottom: string }; & li: {} }; height: string; margin: number }; & .yh-designer-component-attribute: { & .yh-designer-attr-container: { padding-left: string }; & .yh-designer-component-attr-item: { margin-bottom: string }; & .yh-designer-form-label: { display: string; float: string; padding: string; padding-bottom: string; padding-left: string; text-align: string; width: string }; & .yh-designer-form-label-help: { &:hover: { color: string }; cursor: string; font-size: string; margin-left: string }; & .yh-designer-input-box: { display: string; position: string }; border-left: string; float: string; height: string; margin-top: string; overflow: string; padding-bottom: string; padding-left: string; text-align: string }; -moz-transition: string; -ms-transition: string; -o-transition: string; -webkit-transition: string; background: string; bottom: string; padding: string; position: string; right: string; top: string; transition: string; width: string; z-index: string }; & .zlui-icon-gongs: { cursor: string }; & .zlui-icon-gongs:hover: { color: string }; .yh-designer-canvas-container: {}; cursor: string; min-height: string } }

    • @global: { @keyframes linearGradientMove: { 100%: { background-position: string } }; @keyframes load: { 0%,40%,100%: { transform: string }; 20%: { transform: string } } }
      • @keyframes linearGradientMove: { 100%: { background-position: string } }
        • 100%: { background-position: string }
          • background-position: string
      • @keyframes load: { 0%,40%,100%: { transform: string }; 20%: { transform: string } }
        • 0%,40%,100%: { transform: string }
          • transform: string
        • 20%: { transform: string }
          • transform: string
    • Designer: { & *: { &::-webkit-scrollbar: { height: string; width: string }; &::-webkit-scrollbar-thumb: { border-radius: string }; &::-webkit-scrollbar-track: { border-radius: string }; box-sizing: string; outline: string; scrollbar-width: string }; & .focus-border: { border: string }; & .focus-border-blue: { border-color: string }; & .focus-border-white: { border-color: string }; & .right-menu: { & a: { color: string; text-decoration: string }; & li: { &:hover: { background: string; color: string }; color: string; cursor: string; padding: string }; background-color: string; border: string; box-shadow: string; color: string; display: string; line-height: string; margin: string; padding: string; position: string; width: string }; & .row-fluid: { -moz-box-shadow: string; -moz-box-sizing: string; -webkit-box-shadow: string; -webkit-box-sizing: string; background-color: string; border-radius: string; box-shadow: string; box-sizing: string; position: string }; & .yh-designer-canvas-container [xtype] *:focus: { animation: string; border: string; border-color: string }; & .yh-designer-component-attr-item: { & .layui-input,& .yh-input: { &:focus: { border-color: string; border-right-width: string; box-shadow: string; outline: string }; &:hover: { border-color: string; outline: string }; border-radius: string; height: string }; & .yh-designer-form-label: { color: string; font-weight: string } }; & .yh-designer-component-container: any; & .yh-designer-component-toolbar: Object; & .yh-designer-disable-child-fouse: { & *: { pointer-events: string } }; & .yh-designer-header: { & .layui-form-onswitch: { background-color: string; border-color: string }; & .yh-button: { margin-right: string }; & .yh-designer-toolbar: { & .yh-designer-toolbar-left: {}; & .yh-designer-toolbar-right: { & #page-state: { color: string; font-weight: string; margin-right: string; vertical-align: string }; float: string }; background-color: string; border-bottom: string; padding: string } }; & .yh-designer-right: { & .layui-tab: { & .layui-tab-title: { & .layui-this:after: { border-bottom: string }; & li: {} }; height: string; margin: number }; & .yh-designer-component-attribute: { & .yh-designer-attr-container: { padding-left: string }; & .yh-designer-component-attr-item: { margin-bottom: string }; & .yh-designer-form-label: { display: string; float: string; padding: string; padding-bottom: string; padding-left: string; text-align: string; width: string }; & .yh-designer-form-label-help: { &:hover: { color: string }; cursor: string; font-size: string; margin-left: string }; & .yh-designer-input-box: { display: string; position: string }; border-left: string; float: string; height: string; margin-top: string; overflow: string; padding-bottom: string; padding-left: string; text-align: string }; -moz-transition: string; -ms-transition: string; -o-transition: string; -webkit-transition: string; background: string; bottom: string; padding: string; position: string; right: string; top: string; transition: string; width: string; z-index: string }; & .zlui-icon-gongs: { cursor: string }; & .zlui-icon-gongs:hover: { color: string }; .yh-designer-canvas-container: {}; cursor: string; min-height: string }
      • & *: { &::-webkit-scrollbar: { height: string; width: string }; &::-webkit-scrollbar-thumb: { border-radius: string }; &::-webkit-scrollbar-track: { border-radius: string }; box-sizing: string; outline: string; scrollbar-width: string }
        • &::-webkit-scrollbar: { height: string; width: string }
          • height: string
          • width: string
        • &::-webkit-scrollbar-thumb: { border-radius: string }
          • border-radius: string
        • &::-webkit-scrollbar-track: { border-radius: string }
          • border-radius: string
        • box-sizing: string
        • outline: string
        • scrollbar-width: string
      • & .focus-border: { border: string }
        • border: string
      • & .focus-border-blue: { border-color: string }
        • border-color: string
      • & .focus-border-white: { border-color: string }
        • border-color: string
      • & .right-menu: { & a: { color: string; text-decoration: string }; & li: { &:hover: { background: string; color: string }; color: string; cursor: string; padding: string }; background-color: string; border: string; box-shadow: string; color: string; display: string; line-height: string; margin: string; padding: string; position: string; width: string }
        • & a: { color: string; text-decoration: string }
          • color: string
          • text-decoration: string
        • & li: { &:hover: { background: string; color: string }; color: string; cursor: string; padding: string }
          • &:hover: { background: string; color: string }
            • background: string
            • color: string
          • color: string
          • cursor: string
          • padding: string
        • background-color: string
        • border: string
        • box-shadow: string
        • color: string
        • display: string
        • line-height: string
        • margin: string
        • padding: string
        • position: string
        • width: string
      • & .row-fluid: { -moz-box-shadow: string; -moz-box-sizing: string; -webkit-box-shadow: string; -webkit-box-sizing: string; background-color: string; border-radius: string; box-shadow: string; box-sizing: string; position: string }
        • -moz-box-shadow: string
        • -moz-box-sizing: string
        • -webkit-box-shadow: string
        • -webkit-box-sizing: string
        • background-color: string
        • border-radius: string
        • box-shadow: string
        • box-sizing: string
        • position: string
      • & .yh-designer-canvas-container [xtype] *:focus: { animation: string; border: string; border-color: string }
        • animation: string
        • border: string
        • border-color: string
      • & .yh-designer-component-attr-item: { & .layui-input,& .yh-input: { &:focus: { border-color: string; border-right-width: string; box-shadow: string; outline: string }; &:hover: { border-color: string; outline: string }; border-radius: string; height: string }; & .yh-designer-form-label: { color: string; font-weight: string } }
        • & .layui-input,& .yh-input: { &:focus: { border-color: string; border-right-width: string; box-shadow: string; outline: string }; &:hover: { border-color: string; outline: string }; border-radius: string; height: string }
          • &:focus: { border-color: string; border-right-width: string; box-shadow: string; outline: string }
            • border-color: string
            • border-right-width: string
            • box-shadow: string
            • outline: string
          • &:hover: { border-color: string; outline: string }
            • border-color: string
            • outline: string
          • border-radius: string
          • height: string
        • & .yh-designer-form-label: { color: string; font-weight: string }
          • color: string
          • font-weight: string
      • & .yh-designer-component-container: any
      • & .yh-designer-component-toolbar: Object
      • & .yh-designer-disable-child-fouse: { & *: { pointer-events: string } }
        • & *: { pointer-events: string }
          • pointer-events: string
      • & .yh-designer-header: { & .layui-form-onswitch: { background-color: string; border-color: string }; & .yh-button: { margin-right: string }; & .yh-designer-toolbar: { & .yh-designer-toolbar-left: {}; & .yh-designer-toolbar-right: { & #page-state: { color: string; font-weight: string; margin-right: string; vertical-align: string }; float: string }; background-color: string; border-bottom: string; padding: string } }
        • & .layui-form-onswitch: { background-color: string; border-color: string }
          • background-color: string
          • border-color: string
        • & .yh-button: { margin-right: string }
          • margin-right: string
        • & .yh-designer-toolbar: { & .yh-designer-toolbar-left: {}; & .yh-designer-toolbar-right: { & #page-state: { color: string; font-weight: string; margin-right: string; vertical-align: string }; float: string }; background-color: string; border-bottom: string; padding: string }
          • & .yh-designer-toolbar-left: {}
          • & .yh-designer-toolbar-right: { & #page-state: { color: string; font-weight: string; margin-right: string; vertical-align: string }; float: string }
            • & #page-state: { color: string; font-weight: string; margin-right: string; vertical-align: string }
              • color: string
              • font-weight: string
              • margin-right: string
              • vertical-align: string
            • float: string
          • background-color: string
          • border-bottom: string
          • padding: string
      • & .yh-designer-right: { & .layui-tab: { & .layui-tab-title: { & .layui-this:after: { border-bottom: string }; & li: {} }; height: string; margin: number }; & .yh-designer-component-attribute: { & .yh-designer-attr-container: { padding-left: string }; & .yh-designer-component-attr-item: { margin-bottom: string }; & .yh-designer-form-label: { display: string; float: string; padding: string; padding-bottom: string; padding-left: string; text-align: string; width: string }; & .yh-designer-form-label-help: { &:hover: { color: string }; cursor: string; font-size: string; margin-left: string }; & .yh-designer-input-box: { display: string; position: string }; border-left: string; float: string; height: string; margin-top: string; overflow: string; padding-bottom: string; padding-left: string; text-align: string }; -moz-transition: string; -ms-transition: string; -o-transition: string; -webkit-transition: string; background: string; bottom: string; padding: string; position: string; right: string; top: string; transition: string; width: string; z-index: string }
        • & .layui-tab: { & .layui-tab-title: { & .layui-this:after: { border-bottom: string }; & li: {} }; height: string; margin: number }
          • & .layui-tab-title: { & .layui-this:after: { border-bottom: string }; & li: {} }
            • & .layui-this:after: { border-bottom: string }
              • border-bottom: string
            • & li: {}
          • height: string
          • margin: number
        • & .yh-designer-component-attribute: { & .yh-designer-attr-container: { padding-left: string }; & .yh-designer-component-attr-item: { margin-bottom: string }; & .yh-designer-form-label: { display: string; float: string; padding: string; padding-bottom: string; padding-left: string; text-align: string; width: string }; & .yh-designer-form-label-help: { &:hover: { color: string }; cursor: string; font-size: string; margin-left: string }; & .yh-designer-input-box: { display: string; position: string }; border-left: string; float: string; height: string; margin-top: string; overflow: string; padding-bottom: string; padding-left: string; text-align: string }
          • & .yh-designer-attr-container: { padding-left: string }
            • padding-left: string
          • & .yh-designer-component-attr-item: { margin-bottom: string }
            • margin-bottom: string
          • & .yh-designer-form-label: { display: string; float: string; padding: string; padding-bottom: string; padding-left: string; text-align: string; width: string }
            • display: string
            • float: string
            • padding: string
            • padding-bottom: string
            • padding-left: string
            • text-align: string
            • width: string
          • & .yh-designer-form-label-help: { &:hover: { color: string }; cursor: string; font-size: string; margin-left: string }
            • &:hover: { color: string }
              • color: string
            • cursor: string
            • font-size: string
            • margin-left: string
          • & .yh-designer-input-box: { display: string; position: string }
            • display: string
            • position: string
          • border-left: string
          • float: string
          • height: string
          • margin-top: string
          • overflow: string
          • padding-bottom: string
          • padding-left: string
          • text-align: string
        • -moz-transition: string
        • -ms-transition: string
        • -o-transition: string
        • -webkit-transition: string
        • background: string
        • bottom: string
        • padding: string
        • position: string
        • right: string
        • top: string
        • transition: string
        • width: string
        • z-index: string
      • & .zlui-icon-gongs: { cursor: string }
        • cursor: string
      • & .zlui-icon-gongs:hover: { color: string }
        • color: string
      • .yh-designer-canvas-container: {}
      • cursor: string
      • min-height: string

getDesigner

  • getDesigner(): any

  • Returns any

Private getGroupsByTopGroup

  • getGroupsByTopGroup(topGroupId: string): any[]

  • Parameters

    • topGroupId: string

    Returns any[]

Protected getGroupsElem

  • getGroupsElem(): JQuery<HTMLElement>

  • Returns JQuery<HTMLElement>

getHtml

  • getHtml(): string

  • 获取html

    Returns string

Protected groupRenderBuilder

Protected renderBuilder

renderComponentGroups

  • renderComponentGroups(): void

  • 渲染组件组

    Returns void

renderComponentItems

  • renderComponentItems(): void

  • 渲染组件

    Returns void

Generated using TypeDoc