@web-utils/component 2.7.2 → 2.7.4

package/dist/index.css

@@ -12,18 +12,6 @@
   position: fixed;
   z-index: 10;
 }
-.avue-array__item {
-  margin-bottom: 5px;
-}
-.avue-array__input {
-  display: flex;
-}
-.avue-array__input .el-input {
-  flex: auto;
-}
-.avue-array__input .el-button {
-  margin-left: 5px;
-}
 .avue-article__title {
   margin-bottom: 15px;
   font-size: 32px;
@@ -2133,142 +2121,6 @@ body {
   transform: rotate(-40deg);
   opacity: .1;
 }
-.avue-draggable {
-  padding: 10px;
-  position: absolute;
-  cursor: move;
-  -webkit-tap-highlight-color: transparent;
-  user-select: none;
-}
-.avue-draggable__focus {
-  opacity: 0;
-  position: absolute !important;
-  top: 0;
-  left: 0;
-  z-index: -1024;
-}
-.avue-draggable__mask {
-  width: 100%;
-  height: 100%;
-  border: 0;
-  position: absolute;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
-  z-index: 1;
-}
-.avue-draggable--active {
-  cursor: move;
-  border: 1px dashed #09f;
-  background-color: #73aae580;
-}
-.avue-draggable--move {
-  opacity: .6;
-  background-color: #73aae580;
-}
-.avue-draggable--click {
-  cursor: pointer;
-}
-.avue-draggable__line--left {
-  position: absolute;
-  border-top: 1px dashed #09f;
-  width: 10000px;
-  height: 0;
-  top: 0;
-  transform: translate(-100%);
-}
-.avue-draggable__line--top {
-  position: absolute;
-  border-left: 1px dashed #09f;
-  width: 0;
-  height: 10000px;
-  left: 0;
-  transform: translateY(-100%);
-}
-.avue-draggable__line--label {
-  top: -5px;
-  left: -8px;
-  position: absolute;
-  padding: 5px;
-  transform: translate(-100%, -100%);
-  color: #09f;
-  font-size: 18px;
-  white-space: nowrap;
-  cursor: move;
-}
-.avue-draggable__menu {
-  position: absolute;
-  top: 0px;
-  left: 0px;
-  background-color: #409eff;
-  font-size: 25px;
-  color: #fff;
-  z-index: 9999;
-  cursor: pointer;
-}
-.avue-draggable__range {
-  position: absolute;
-  width: 10px;
-  height: 10px;
-  border-radius: 100%;
-  z-index: 9999;
-  background-color: #09f;
-}
-.avue-draggable__range--left,
-.avue-draggable__range--right {
-  top: 50%;
-  transform: translateY(-50%);
-}
-.avue-draggable__range--left:hover,
-.avue-draggable__range--right:hover {
-  cursor: ew-resize;
-}
-.avue-draggable__range--left {
-  left: -6px;
-}
-.avue-draggable__range--right {
-  right: -6px;
-}
-.avue-draggable__range--top,
-.avue-draggable__range--bottom {
-  left: 50%;
-  transform: translate(-50%);
-}
-.avue-draggable__range--top:hover,
-.avue-draggable__range--bottom:hover {
-  cursor: ns-resize;
-}
-.avue-draggable__range--top {
-  top: -6px;
-}
-.avue-draggable__range--bottom {
-  bottom: -6px;
-}
-.avue-draggable__range--bottom-right:hover,
-.avue-draggable__range--top-left:hover {
-  cursor: nwse-resize;
-}
-.avue-draggable__range--bottom-left:hover,
-.avue-draggable__range--top-right:hover {
-  cursor: nesw-resize;
-}
-.avue-draggable__range--top-right {
-  top: -6px;
-  right: -6px;
-}
-.avue-draggable__range--top-left {
-  top: -6px;
-  left: -6px;
-}
-.avue-draggable__range--bottom-right {
-  bottom: -6px;
-  right: -6px;
-}
-.avue-draggable__range--bottom-left {
-  bottom: -6px;
-  left: -6px;
-}
 .dynamic-table {
   display: flex;
   flex-direction: column;
@@ -2506,24 +2358,6 @@ body {
 .element-dialog.el-dialog .header-button:hover {
   background: #e34e55;
 }
-.avue-empty {
-  margin: 0 8px;
-  font-size: 14px;
-  line-height: 22px;
-  text-align: center;
-}
-.avue-empty__image {
-  height: 100px;
-  margin-bottom: 8px;
-}
-.avue-empty__image img {
-  height: 100%;
-  vertical-align: middle;
-  border-style: none;
-}
-.avue-empty__desc {
-  color: #000000a6;
-}
 .empty-view,
 .error-view {
   position: relative;
@@ -2947,6 +2781,18 @@ body {
     left: 60px;
   }
 }
+.avue-array__item {
+  margin-bottom: 5px;
+}
+.avue-array__input {
+  display: flex;
+}
+.avue-array__input .el-input {
+  flex: auto;
+}
+.avue-array__input .el-button {
+  margin-left: 5px;
+}
 .avue-checkbox .el-checkbox + .el-checkbox {
   margin-left: 0;
 }
@@ -3212,50 +3058,204 @@ body {
   position: static;
   margin-bottom: 53px;
 }
-.avue-dynamic__item {
-  margin-bottom: 10px;
-  width: 100%;
-  display: flex;
-  align-items: center;
-}
-.avue-dynamic__header {
-  padding-left: 40px;
-}
-.avue-dynamic__row {
-  position: relative;
-  border-top: 1px dashed #eee;
-  padding-top: 13px;
+.avue-draggable {
+  padding: 10px;
+  position: absolute;
+  cursor: move;
+  -webkit-tap-highlight-color: transparent;
+  user-select: none;
 }
-.avue-dynamic__row:first-child {
-  border-top: 0;
+.avue-draggable__focus {
+  opacity: 0;
+  position: absolute !important;
+  top: 0;
+  left: 0;
+  z-index: -1024;
 }
-.avue-dynamic__menu {
+.avue-draggable__mask {
+  width: 100%;
+  height: 100%;
+  border: 0;
   position: absolute;
+  top: 0;
   right: 0;
-  z-index: 1024;
-}
-.avue-dynamic__input {
-  margin-right: 8px;
-  width: 100%;
+  bottom: 0;
+  left: 0;
+  z-index: 1;
 }
-.avue-dynamic__button {
-  margin-bottom: 0 !important;
+.avue-draggable--active {
+  cursor: move;
+  border: 1px dashed #09f;
+  background-color: #73aae580;
 }
-.avue-form {
-  position: relative;
-  margin: 0 auto;
-  box-sizing: border-box;
+.avue-draggable--move {
+  opacity: .6;
+  background-color: #73aae580;
 }
-.avue-form__item--top {
-  display: flex;
-  flex-direction: column;
+.avue-draggable--click {
+  cursor: pointer;
 }
-.avue-form__item--top .el-form-item__label {
-  width: 100% !important;
-  text-align: left !important;
+.avue-draggable__line--left {
+  position: absolute;
+  border-top: 1px dashed #09f;
+  width: 10000px;
+  height: 0;
+  top: 0;
+  transform: translate(-100%);
 }
-.avue-form__item--top .el-form-item__content {
-  margin-left: 0 !important;
+.avue-draggable__line--top {
+  position: absolute;
+  border-left: 1px dashed #09f;
+  width: 0;
+  height: 10000px;
+  left: 0;
+  transform: translateY(-100%);
+}
+.avue-draggable__line--label {
+  top: -5px;
+  left: -8px;
+  position: absolute;
+  padding: 5px;
+  transform: translate(-100%, -100%);
+  color: #09f;
+  font-size: 18px;
+  white-space: nowrap;
+  cursor: move;
+}
+.avue-draggable__menu {
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  background-color: #409eff;
+  font-size: 25px;
+  color: #fff;
+  z-index: 9999;
+  cursor: pointer;
+}
+.avue-draggable__range {
+  position: absolute;
+  width: 10px;
+  height: 10px;
+  border-radius: 100%;
+  z-index: 9999;
+  background-color: #09f;
+}
+.avue-draggable__range--left,
+.avue-draggable__range--right {
+  top: 50%;
+  transform: translateY(-50%);
+}
+.avue-draggable__range--left:hover,
+.avue-draggable__range--right:hover {
+  cursor: ew-resize;
+}
+.avue-draggable__range--left {
+  left: -6px;
+}
+.avue-draggable__range--right {
+  right: -6px;
+}
+.avue-draggable__range--top,
+.avue-draggable__range--bottom {
+  left: 50%;
+  transform: translate(-50%);
+}
+.avue-draggable__range--top:hover,
+.avue-draggable__range--bottom:hover {
+  cursor: ns-resize;
+}
+.avue-draggable__range--top {
+  top: -6px;
+}
+.avue-draggable__range--bottom {
+  bottom: -6px;
+}
+.avue-draggable__range--bottom-right:hover,
+.avue-draggable__range--top-left:hover {
+  cursor: nwse-resize;
+}
+.avue-draggable__range--bottom-left:hover,
+.avue-draggable__range--top-right:hover {
+  cursor: nesw-resize;
+}
+.avue-draggable__range--top-right {
+  top: -6px;
+  right: -6px;
+}
+.avue-draggable__range--top-left {
+  top: -6px;
+  left: -6px;
+}
+.avue-draggable__range--bottom-right {
+  bottom: -6px;
+  right: -6px;
+}
+.avue-draggable__range--bottom-left {
+  bottom: -6px;
+  left: -6px;
+}
+.avue-dynamic__item {
+  margin-bottom: 10px;
+  width: 100%;
+  display: flex;
+  align-items: center;
+}
+.avue-dynamic__header {
+  padding-left: 40px;
+}
+.avue-dynamic__row {
+  position: relative;
+  border-top: 1px dashed #eee;
+  padding-top: 13px;
+}
+.avue-dynamic__row:first-child {
+  border-top: 0;
+}
+.avue-dynamic__menu {
+  position: absolute;
+  right: 0;
+  z-index: 1024;
+}
+.avue-dynamic__input {
+  margin-right: 8px;
+  width: 100%;
+}
+.avue-dynamic__button {
+  margin-bottom: 0 !important;
+}
+.avue-empty {
+  margin: 0 8px;
+  font-size: 14px;
+  line-height: 22px;
+  text-align: center;
+}
+.avue-empty__image {
+  height: 100px;
+  margin-bottom: 8px;
+}
+.avue-empty__image img {
+  height: 100%;
+  vertical-align: middle;
+  border-style: none;
+}
+.avue-empty__desc {
+  color: #000000a6;
+}
+.avue-form {
+  position: relative;
+  margin: 0 auto;
+  box-sizing: border-box;
+}
+.avue-form__item--top {
+  display: flex;
+  flex-direction: column;
+}
+.avue-form__item--top .el-form-item__label {
+  width: 100% !important;
+  text-align: left !important;
+}
+.avue-form__item--top .el-form-item__content {
+  margin-left: 0 !important;
 }
 .avue-form__item--left .el-form-item__label {
   text-align: left !important;
@@ -3314,6 +3314,566 @@ body {
 .avue-form__option i + i {
   margin-left: 10px;
 }
+.dic[data-v-24459f96] {
+  display: flex;
+  margin-bottom: 5px;
+}
+.el-tag[data-v-0922df2b] {
+  vertical-align: top;
+}
+.el-tag + .el-tag[data-v-0922df2b] {
+  margin-left: 5px;
+}
+.input-new-tag[data-v-0922df2b] {
+  width: 90px;
+  margin-left: 5px;
+  vertical-align: bottom;
+}
+.color-picker[data-v-0922df2b] {
+  left: 10px;
+  vertical-align: top;
+}
+.custom-tree-node[data-v-9953620c] {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  font-size: 14px;
+  padding-right: 8px;
+}
+.form-designer {
+  height: 100%;
+  background: #fff;
+  outline: 1px solid #e4e7ed;
+}
+.form-designer ::-webkit-scrollbar {
+  width: 0 !important;
+  height: 0 !important;
+}
+.form-designer ::-webkit-scrollbar-track {
+  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0) !important;
+  border-radius: 10px !important;
+  background-color: #0000 !important;
+}
+.form-designer ::-webkit-scrollbar-thumb {
+  border-radius: 10px !important;
+  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0) !important;
+  background-color: #fff !important;
+}
+.form-designer .fields-list {
+  padding: 10px 0;
+  width: 100%;
+  height: 100%;
+}
+.form-designer .fields-list .field-title {
+  padding: 8px 12px;
+  font-size: 13px;
+}
+.form-designer .fields-list ul {
+  position: relative;
+  overflow: hidden;
+  padding: 0 10px 10px;
+  margin: 0;
+}
+.form-designer .fields-list .field-label {
+  font-size: 12px;
+  display: block;
+  width: 47%;
+  line-height: 26px;
+  position: relative;
+  float: left;
+  left: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  margin: 1%;
+  color: #333;
+  border: 1px solid #f4f6fc;
+}
+.form-designer .fields-list .field-label:hover {
+  color: #409eff;
+  border: 1px dashed #409eff;
+}
+.form-designer .fields-list .field-label > a {
+  display: block;
+  cursor: move;
+  background: #f4f6fc;
+  border: 1px solid #f4f6fc;
+  color: #333;
+}
+.form-designer .fields-list .field-label > a .icon {
+  margin-right: 6px;
+  margin-left: 8px;
+  font-size: 14px;
+  display: inline-block;
+  vertical-align: middle;
+}
+.form-designer .fields-list .field-label > a span {
+  display: inline-block;
+  vertical-align: middle;
+}
+.form-designer .fields-list .field-label-disabled {
+  font-size: 12px;
+  display: block;
+  width: 48%;
+  line-height: 26px;
+  position: relative;
+  float: left;
+  left: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  margin: 1%;
+  color: #333;
+  border: 1px solid #f4f6fc;
+}
+.form-designer .fields-list .field-label-disabled:hover {
+  color: gray;
+  border: 1px dashed gray;
+}
+.form-designer .fields-list .field-label-disabled > a {
+  display: block;
+  cursor: not-allowed;
+  background: #f4f6fc;
+  border: 1px solid #f4f6fc;
+}
+.form-designer .fields-list .field-label-disabled > a .icon {
+  margin-right: 6px;
+  margin-left: 8px;
+  font-size: 14px;
+  display: inline-block;
+  vertical-align: middle;
+}
+.form-designer .fields-list .field-label-disabled > a span {
+  display: inline-block;
+  vertical-align: middle;
+}
+.form-designer .widget-container {
+  flex: 1;
+  border-left: 1px solid #e0e0e0;
+  border-right: 1px solid #e0e0e0;
+}
+.form-designer .widget-container .widget-container-header {
+  height: 45px !important;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  border-bottom: solid 2px #e4e7ed;
+}
+.form-designer .widget-container .el-main {
+  padding: 0;
+  position: relative;
+}
+.form-designer .widget-form-container {
+  height: 100%;
+  position: relative;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+}
+.form-designer .widget-form-container .el-form,
+.form-designer .widget-form-container .el-form .el-row {
+  height: 100%;
+}
+.form-designer .widget-form-container .widget-form-list {
+  height: 100%;
+  min-height: calc(100% - 45px);
+  padding-bottom: 50px;
+  overflow: hidden;
+  overflow-y: scroll;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-item {
+  min-height: 30px;
+  padding: 5px 10px 18px;
+  margin: 0;
+  position: relative;
+  border-left: 5px solid transparent;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-item.required .el-form-item__label:before {
+  content: "*";
+  color: #f56c6c;
+  margin-right: 4px;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-item:after {
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  top: 0;
+  display: block;
+  z-index: 1001;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-item:hover {
+  background: #ecf8ff;
+  cursor: move;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-item.active {
+  border-left: 3px solid #409eff;
+  background: #ecf5ff;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-item .widget-action-delete {
+  position: absolute;
+  right: 10px;
+  bottom: -32px;
+  z-index: 1002;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-item .widget-action-clone {
+  position: absolute;
+  right: 50px;
+  bottom: -32px;
+  z-index: 1002;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-table {
+  position: relative;
+  padding: 2px;
+  float: left;
+  width: 100%;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-table__content {
+  display: flex;
+  padding: 10px 5px;
+  width: 100%;
+  height: 100%;
+  overflow-y: hidden;
+  outline: 1px dashed #ccc;
+  outline-offset: -1px;
+  min-height: 103px;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-table__content::-webkit-scrollbar {
+  width: 6px !important;
+  height: 6px !important;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-table__content::-webkit-scrollbar-thumb {
+  background-color: #e5e7eb !important;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-table__content .ghost {
+  background: white;
+  border-left: 5px solid #409eff;
+  box-sizing: border-box;
+  font-size: 0;
+  content: "";
+  overflow: hidden;
+  padding: 0 !important;
+  position: relative;
+  outline: none 0;
+  height: 100%;
+  min-height: 90px;
+  width: 0 !important;
+  min-width: 0 !important;
+  margin: 1px 2px 0;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-table__item {
+  position: relative;
+  min-width: 33.3%;
+  width: 33.3%;
+  padding: 1px;
+  height: 100%;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-table__item.required .el-table__header .cell:before {
+  content: "*";
+  color: #f56c6c;
+  margin-right: 4px;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-table__item.active {
+  outline: 1px solid #409eff;
+  outline-offset: -1px;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-table__item:hover {
+  outline: 1px solid #409eff;
+  outline-offset: -1px;
+  cursor: move;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-table__item:after {
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  top: 0;
+  display: block;
+  content: "";
+  z-index: 1001;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-table__item .widget-table-action-delete {
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  z-index: 1002;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-table__item .widget-table-action-clone {
+  position: absolute;
+  right: 30px;
+  bottom: 0;
+  z-index: 1002;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-table__item .widget-table-action-clone i {
+  font-size: 10px;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-table__item .el-button--small.is-circle {
+  padding: 5px;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-table.active {
+  border-left: 3px solid #409eff;
+  background: #ecf5ff;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-table:hover {
+  background: #ecf8ff;
+  cursor: move;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-table .widget-action-delete {
+  position: absolute;
+  right: 10px;
+  bottom: -12px;
+  z-index: 1001;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-table .widget-action-clear {
+  position: absolute;
+  right: 50px;
+  bottom: -12px;
+  z-index: 1001;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-table .widget-action-clone {
+  position: absolute;
+  right: 90px;
+  bottom: -12px;
+  z-index: 1001;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-group {
+  position: relative;
+  width: 100%;
+  float: left;
+  padding: 2px;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-group__head {
+  margin: 10px;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-group__body {
+  min-height: 150px;
+  height: 100%;
+  outline: 1px dashed #ccc;
+  outline-offset: -1px;
+  overflow: hidden;
+  padding-bottom: 15px;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-group__body .ghost {
+  background: white;
+  border-left: 5px solid #409eff;
+  box-sizing: border-box;
+  font-size: 0;
+  content: "";
+  overflow: hidden;
+  padding: 0 !important;
+  position: relative;
+  outline: none 0;
+  height: 100%;
+  min-height: 57px;
+  width: 0 !important;
+  min-width: 0 !important;
+  margin: 1px 2px 0;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-group__item {
+  padding: 10px;
+  margin: 3px;
+  position: relative;
+  border-left: 5px solid transparent;
+  background: white;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-group__item.required .el-form-item__label:before {
+  content: "*";
+  color: #f56c6c;
+  margin-right: 4px;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-group__item.active {
+  outline: 1px solid #409eff;
+  outline-offset: -1px;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-group__item:hover {
+  outline: 1px solid #409eff;
+  outline-offset: -1px;
+  cursor: move;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-group__item:after {
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  top: 0;
+  display: block;
+  content: "";
+  z-index: 1001;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-group__item--delete {
+  position: absolute;
+  right: 0;
+  bottom: -24px;
+  z-index: 1002;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-group__item--clone {
+  position: absolute;
+  right: 34px;
+  bottom: -24px;
+  z-index: 1002;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-group.active {
+  border-left: 3px solid #409eff;
+  background: #ecf5ff;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-group:hover {
+  background: #ecf8ff;
+  cursor: move;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-group .widget-action-delete {
+  position: absolute;
+  right: 10px;
+  bottom: -12px;
+  z-index: 1001;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-group .widget-action-clear {
+  position: absolute;
+  right: 50px;
+  bottom: -12px;
+  z-index: 1001;
+}
+.form-designer .widget-form-container .widget-form-list .widget-form-group .widget-action-clone {
+  position: absolute;
+  right: 90px;
+  bottom: -12px;
+  z-index: 1001;
+}
+.form-designer .widget-form-container .widget-form-list .iconfont {
+  font-size: 13px;
+}
+.form-designer .widget-form-container .widget-form-list .el-button--small.is-circle {
+  padding: 7px;
+}
+.form-designer .widget-form-container .ghost {
+  background: white;
+  border-top: 5px solid #409eff;
+  box-sizing: border-box;
+  font-size: 0;
+  content: "";
+  overflow: hidden;
+  padding: 0 !important;
+  position: relative;
+  outline: none 0;
+  height: 0 !important;
+  width: 100%;
+  margin: 2px 0;
+}
+.form-designer .widget-config-container {
+  height: 100%;
+  padding-top: 5px;
+}
+.form-designer .widget-config-container .el-tabs {
+  height: 100%;
+}
+.form-designer .widget-config-container .el-tabs__header {
+  margin: 0;
+  height: 45px;
+  background: white;
+  z-index: 1000;
+}
+.form-designer .widget-config-container .el-tabs__content {
+  height: calc(100% - 45px);
+  overflow-y: scroll;
+}
+.form-designer .widget-config-container .widget-config .el-tabs__header {
+  position: relative;
+  display: block;
+  top: 0;
+  margin: 0;
+}
+.form-designer .widget-config-container .widget-config .el-tabs__content {
+  margin-top: 0;
+}
+.form-designer .widget-config-container .widget-config .ghost {
+  background: #fff;
+  border: 1px dashed #409eff;
+}
+.form-designer .widget-config-container .widget-config ul {
+  margin: 0;
+  padding: 0;
+}
+.form-designer .widget-config-container .widget-config ul li {
+  display: flex;
+  align-items: center;
+  width: 100%;
+}
+.form-designer .widget-config-container .widget-config ul li .ghost {
+  list-style: none;
+  font-size: 0;
+  height: 35px;
+}
+.form-designer .widget-config-container .avue-group__item {
+  padding: 0;
+}
+.form-designer .el-container {
+  height: 100%;
+}
+.form-designer .el-container .el-main {
+  height: calc(100% - 45px);
+}
+.form-designer .el-container .el-aside {
+  background: #fff;
+}
+.form-designer .danger {
+  color: #f56c6c;
+}
+.form-designer .warning {
+  color: #e6a23c;
+}
+.form-designer .el-input-number.is-controls-right .el-input-number__decrease {
+  border-left: none;
+}
+.form-designer .el-input-number.is-controls-right .el-input-number__increase {
+  border-left: none;
+  border-bottom: none;
+}
+.form-designer .el-date-editor,
+.form-designer .el-cascader,
+.form-designer .el-select,
+.form-designer .el-input-number {
+  width: 100%;
+}
+.form-designer .editor-fullscreen {
+  position: fixed !important;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 100% !important;
+  z-index: 1003;
+  padding: 20px;
+  box-sizing: border-box;
+  background: #fff;
+}
+.form-designer .editor-fullscreen i {
+  top: 20px !important;
+  left: 25px !important;
+}
+.afd-drawer-foot {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  padding: 20px;
+  display: flex;
+}
+.afd-drawer-foot button {
+  width: 50%;
+}
+.afd-drawer-foot > span {
+  display: inline-block;
+  width: 50%;
+}
+.afd-drawer-foot > span button {
+  width: 100%;
+}
+.afd-preview-form {
+  overflow-y: auto;
+  height: 83vh;
+}
 .avue-input-icon {
   display: flex;
   flex-wrap: wrap;