@chaoswise/business 0.0.9 → 0.0.10

package/lib/AggregateSearch/components/CloseAllIcon/assets/Close-Circle-Fill.svg

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="12px" height="12px" viewBox="0 0 12 12" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>Icon/Fill/Close-Circle-Fill</title>
+    <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="聚合搜索框" transform="translate(-1278.000000, -2867.000000)">
+            <rect fill="#FFFFFF" x="0" y="0" width="1920" height="3346"></rect>
+            <g id="7" opacity="0.800000012" transform="translate(120.000000, 2665.000000)">
+                <g id="搜索框备份-2" transform="translate(0.000000, 194.000000)">
+                    <path d="M1214.00697,0.5 C1214.41913,0.5 1214.7922,0.667699564 1215.06223,0.938862019 C1215.33288,1.21063804 1215.5,1.58624721 1215.5,2.00138927 L1215.5,2.00138927 L1215.5,45.9986107 C1215.5,46.4131621 1215.33227,46.7885021 1215.0616,47.0603047 C1214.79133,47.3317133 1214.41826,47.5 1214.00697,47.5 L1214.00697,47.5 L1.99303181,47.5 C1.58086837,47.5 1.20779551,47.3323004 0.937765379,47.061138 C0.667124252,46.789362 0.5,46.4137528 0.5,45.9986107 L0.5,45.9986107 L0.5,2.00138927 C0.5,1.58683787 0.667729281,1.2114979 0.938396858,0.939695326 C1.20867209,0.668286734 1.58174111,0.5 1.99303181,0.5 L1.99303181,0.5 L1214.00697,0.5 Z" id="Rectangle-26-Copy-23备份" stroke="#FF4D4F" fill="#FFFFFF"></path>
+                    <g id="Icon/Fill/Close-Circle-Fill" transform="translate(1158.000000, 8.000000)" fill="#000000">
+                        <rect id="矩形" fill-rule="nonzero" opacity="0" x="0" y="0" width="12" height="12"></rect>
+                        <path d="M6,0.75 C3.10078125,0.75 0.75,3.10078125 0.75,6 C0.75,8.89921875 3.10078125,11.25 6,11.25 C8.89921875,11.25 11.25,8.89921875 11.25,6 C11.25,3.10078125 8.89921875,0.75 6,0.75 Z M7.93828125,7.99453125 L7.16484375,7.99101563 L6,6.60234375 L4.83632812,7.98984375 L4.06171875,7.99335937 C4.01015625,7.99335937 3.96796875,7.95234375 3.96796875,7.89960937 C3.96796875,7.87734375 3.97617188,7.85625 3.99023438,7.83867187 L5.51484375,6.02226562 L3.99023438,4.20703125 C3.97617188,4.18945312 3.96796875,4.16835937 3.96796875,4.14609375 C3.96796875,4.09453125 4.01015625,4.05234375 4.06171875,4.05234375 L4.83632813,4.05585938 L6,5.44453125 L7.16367187,4.05703125 L7.93710937,4.05351563 C7.98867187,4.05351563 8.03085937,4.09453125 8.03085937,4.14726563 C8.03085937,4.16953125 8.02265625,4.190625 8.00859375,4.20820313 L6.48632812,6.0234375 L8.00976562,7.83984375 C8.02382813,7.85742188 8.03203125,7.87851562 8.03203125,7.90078125 C8.03203125,7.95234375 7.98984375,7.99453125 7.93828125,7.99453125 Z" id="形状" fill-opacity="0.25"></path>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>

package/lib/AggregateSearch/components/CloseAllIcon/index.js

@@ -0,0 +1,6 @@
+import React from "react";
+import CloseAllIconSvg from "./assets/Close-Circle-Fill.svg";
+var CloseAllIcon = function CloseAllIcon() {
+  return /*#__PURE__*/React.createElement(CloseAllIconSvg, null);
+};
+export default CloseAllIcon;

package/lib/AggregateSearch/components/DropDown/index.js

@@ -411,7 +411,10 @@ var DropDown = function DropDown(props) {
     return _historyDelete.apply(this, arguments);
   }
   var menu = /*#__PURE__*/React.createElement("div", {
-    className: "aggregate-drop-down-wrap"
+    className: "aggregate-drop-down-wrap",
+    onClick: function onClick(e) {
+      e.stopPropagation();
+    }
   }, /*#__PURE__*/React.createElement("div", {
     className: "aggregate-drop-down"
   }, keyOptionValueNotEmpty && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {

package/lib/AggregateSearch/components/SwitchBtn/index.less

@@ -1,7 +1,7 @@
 .aggregate-search-switch-btn {
   border: @border-width-base @border-style-base @input-border-color;
   border-left: none;
-  min-height: 26px;
+  min-height: 28px;
   cursor: pointer;
   background: rgba(0, 0, 0, 0.02);
   border-radius: 0 2px 2px 0;
@@ -10,6 +10,6 @@
   align-items: flex-start;
   align-self: stretch; // 使得高度和父元素一致
   img{
-    transform: translateY(7px);
+    transform: translateY(8px);
   }
 }

package/lib/AggregateSearch/index.js

@@ -71,7 +71,8 @@ var AggregateSearch = function AggregateSearch(_ref) {
     onHelpClick = _ref$onHelpClick === void 0 ? function () {} : _ref$onHelpClick,
     mode = _ref.mode,
     _ref$defaultMode = _ref.defaultMode,
-    defaultMode = _ref$defaultMode === void 0 ? "tag" : _ref$defaultMode;
+    defaultMode = _ref$defaultMode === void 0 ? "tag" : _ref$defaultMode,
+    placeholder = _ref.placeholder;
   // 输入模式
   var _useState = useState(defaultMode),
     _useState2 = _slicedToArray(_useState, 2),
@@ -87,6 +88,11 @@ var AggregateSearch = function AggregateSearch(_ref) {
     setSelValue = _useState4[1];
   var container = useRef(null);
   var containerWrapperRef = useRef(null);
+  // 是否可编辑，若点击编辑区域外内容则不可编辑 todo：用于修复聚焦bug
+  var _useState5 = useState(true),
+    _useState6 = _slicedToArray(_useState5, 2),
+    contentEditable = _useState6[0],
+    setContentEditable = _useState6[1];
   // 是否正在输入中文
   var isComposing = useRef(false);
   var handleSyntaxCheck = /*#__PURE__*/function () {
@@ -167,7 +173,12 @@ var AggregateSearch = function AggregateSearch(_ref) {
             // 计算当前光标位置(纯文本模式)
             planeTextPosition = getCursorPosition(container.current); // 将纯文本模式转为html模式（语法解析器）
             htmlString = genHtmlAndSyntaxCheckResByString(inputStr);
-            container.current.innerHTML = htmlString;
+            if (!htmlString.trim()) {
+              // 修复空状态placeholder
+              container.current.innerHTML = "";
+            } else {
+              container.current.innerHTML = htmlString;
+            }
             // 找到格式化后的光标位置
             if (planeTextPosition !== null) {
               _getCursorNodeAndInde3 = getCursorNodeAndIndex(container.current, planeTextPosition), targetNode = _getCursorNodeAndInde3.targetNode, targetIndex = _getCursorNodeAndInde3.targetIndex; // 设置光标位置
@@ -227,8 +238,14 @@ var AggregateSearch = function AggregateSearch(_ref) {
   // 监听点击事件(container以外的地方）
   useEffect(function () {
     var handleClick = function handleClick(e) {
-      if (container.current && !container.current.contains(e.target)) {
+      // 可编辑文本框边框线e.target !== containerWrapperRef.current
+      if (container.current && !container.current.contains(e.target) && e.target !== containerWrapperRef.current) {
         setVisible(false);
+        setContentEditable(false);
+      } else {
+        var _container$current;
+        setContentEditable(true);
+        (_container$current = container.current) === null || _container$current === void 0 || _container$current.focus();
       }
     };
     document.addEventListener("click", handleClick);
@@ -250,9 +267,18 @@ var AggregateSearch = function AggregateSearch(_ref) {
     }
     handleValueChange(container.current.innerText, mode);
   };
+  var onKeyDown = function onKeyDown(e) {
+    var keyCode = e.keyCode;
+    if (keyCode === 13) {
+      // 回车阻止默认的换行行为
+      e.preventDefault();
+      onChange(e.target.innerText);
+      setVisible(false);
+    }
+  };
   return /*#__PURE__*/React.createElement(DropDown, {
     onHelpClick: onHelpClick,
-    visible: visible && curMode === "tag",
+    visible: contentEditable && visible && curMode === "tag",
     keyOption: {
       value: dropStatus.key.isShow ? dropStatus.key.value : null,
       fetchFuc: fetchKeyList,
@@ -297,8 +323,11 @@ var AggregateSearch = function AggregateSearch(_ref) {
     ref: containerWrapperRef
   }, /*#__PURE__*/React.createElement("div", {
     spellCheck: false,
-    onCompositionEnd: function onCompositionEnd() {
-      return isComposing.current = false;
+    onCompositionEnd: function onCompositionEnd(e) {
+      isComposing.current = false;
+      // 输入中文结束再触发一次，保证文本框对应内容与当前返回值一致，选项效果不会丢失
+      handleValueChange(e.target.innerText);
+      onChange(e.target.innerText);
     },
     onCompositionStart: function onCompositionStart() {
       return isComposing.current = true;
@@ -306,12 +335,14 @@ var AggregateSearch = function AggregateSearch(_ref) {
     className: "aggregate-search-input",
     ref: container,
     "data-attr": "container",
-    contentEditable: true,
+    "data-placeholder": placeholder,
+    contentEditable: contentEditable,
     suppressContentEditableWarning: true,
     onPaste: textInit // 只粘贴纯文本 去除html标签
     ,
     onInput: onInput,
-    onFocus: onFocus
+    onFocus: onFocus,
+    onKeyDown: onKeyDown
   }), /*#__PURE__*/React.createElement(SwitchBtn, {
     onChange: onModeChange,
     mode: mode || selMode
@@ -345,6 +376,10 @@ AggregateSearch.propTypes = {
   /**
    * 删除历史记录回调，需要返回promise，async(id)=>Boolean
    */
-  onHistoryDelete: PropTypes.func
+  onHistoryDelete: PropTypes.func,
+  /**
+   * 内容为空提示
+   */
+  placeholder: PropTypes.string
 };
 export default AggregateSearch;

package/lib/AggregateSearch/index.less

@@ -25,8 +25,8 @@
     position: relative;
     padding: 0 10px;
     flex: 1;
-    min-height: 26px;
-    line-height: 24px;
+    min-height: 28px;
+    line-height: 26px;
     border: @border-width-base @border-style-base @input-border-color;
     border-radius: @border-radius-base 0 0 @border-radius-base;
 
@@ -41,20 +41,20 @@
     }
 
     &:empty:before {
-      content: '搜索指标标识、维度、或通过筛选区筛选指标';
+      content: attr(data-placeholder);
       font-size: 12px;
       color: rgba(0, 0, 0, 0.45);
       line-height: 20px;
     }
 
-    &:focus:before {
-      content: none;
+    &:not(.syntax-error):focus:before { // 需要排除掉syntax-error的样式不然报错内容丢失
+      content: ""; // 不能为none，否则placeholder不显示
     }
 
     .tag-box {
       position: relative;
       background: #FFFFFF;
-      border: 1px solid #E3E3E3;
+      border: @border-width-base @border-style-base #E3E3E3;
       border-radius: 2px;
       height: 18px;
       line-height: 16px;
@@ -92,6 +92,9 @@
       .tag-con-match {
         color: #FA8C16;
       }
+      &:not(.syntax-error):has(.tag-con-keyword_AND_OR:only-child){
+        border-color: transparent;
+      }
     }
   }
 }
@@ -99,8 +102,8 @@
 
 .syntax-error {
   // 语法错误，高亮样式
-  border: 1px solid #FF4D4F !important;
-
+  border: @border-width-base @border-style-base @red-5 !important;
+  box-shadow: none !important;
   &:hover {
 
     // 伪类展示属性值
@@ -108,16 +111,17 @@
       content: attr(data-error);
       position: absolute;
       white-space: nowrap;
-      bottom: 26px;
+      bottom: 28px;
       left: -1px;
       height: 20px;
       line-height: 20px;
       background: #FFF1F0;
-      border: 1px solid #FF4D4F;
+      border: @border-width-base @border-style-base @red-5;
       border-radius: 0 0 2px 2px;
       font-size: 12px;
-      color: #FF4D4F;
+      color: @red-5;
       padding: 0 10px;
+      min-width: 100px;
     }
   }
 }

package/lib/AggregateSearch/utils/index.js

@@ -122,9 +122,13 @@ export var genHtmlAndSyntaxCheckResByString = function genHtmlAndSyntaxCheckResB
       var hasMatch = matchIndex !== -1;
       html = tokenList.map(function (token, index) {
         var genClassName = function genClassName(typeClass) {
-          return classNames(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
-            "tag-con": true
-          }, typeClass, true), "tag-con-key", hasMatch ? index < matchIndex : false), "tag-con-key-last", matchIndex ? index === matchIndex - 1 : false), "tag-con-value", hasMatch ? index > matchIndex : false));
+          return classNames(typeClass, {
+            "tag-con": true,
+            // [typeClass]: true,
+            "tag-con-key": hasMatch ? index < matchIndex : false,
+            "tag-con-key-last": matchIndex ? index === matchIndex - 1 : false,
+            "tag-con-value": hasMatch ? index > matchIndex : false
+          });
         };
         var genDataType = function genDataType(index) {
           if (hasMatch) {
@@ -139,7 +143,7 @@ export var genHtmlAndSyntaxCheckResByString = function genHtmlAndSyntaxCheckResB
           return "key";
         };
         var dataType = genDataType(index);
-        var getEleProps = function getEleProps(type) {
+        var getEleProps = function getEleProps(type, text) {
           var typeMap = _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, TOKEN_TYPES.MATCH, {
             tagName: "span",
             props: {
@@ -150,7 +154,7 @@ export var genHtmlAndSyntaxCheckResByString = function genHtmlAndSyntaxCheckResB
           }), TOKEN_TYPES.KEYWORD, {
             tagName: "span",
             props: {
-              "class": genClassName("tag-con-keyword"),
+              "class": genClassName(text === "AND" || text === "OR" ? "tag-con-keyword tag-con-keyword_AND_OR" : "tag-con-keyword"),
               "data-attr": "keyword",
               "data-type": dataType
             }
@@ -173,7 +177,7 @@ export var genHtmlAndSyntaxCheckResByString = function genHtmlAndSyntaxCheckResB
         };
         var type = token.type,
           text = token.text;
-        var curProps = getEleProps(type);
+        var curProps = getEleProps(type, text);
         var elePropsString = Object.entries(curProps.props).map(function (_ref) {
           var _ref2 = _slicedToArray(_ref, 2),
             key = _ref2[0],

package/lib/PropertyControlViewer/assets/doCommon.less

@@ -1,79 +1,75 @@
-.wrapper {
-  // width: 150px;
-  height: 20px;
-  font-size: 12px;
-
-  .wrapper-inner {
-    float: left;
-    max-width: 85px;
+.form-properties-box {
+  .wrapper {
     height: 20px;
-    line-height: 18px;
-    margin-right: 2px;
-    margin-bottom: 4px;
-    padding: 0 5px;
-    background: #fafafa;
-    border: 1px solid #d9d9d9;
-    border-radius: 2px;
-    cursor: pointer;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
+    font-size: 12px;
 
-  .wrapper-inner:last-child {
-    margin-right: 0;
-  }
+    .wrapper-inner {
+      float: left;
+      max-width: 85px;
+      height: 20px;
+      line-height: 18px;
+      margin-right: 2px;
+      margin-bottom: 4px;
+      padding: 0 5px;
+      background: #fafafa;
+      border: 1px solid #d9d9d9;
+      border-radius: 2px;
+      cursor: pointer;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
 
-  .wrapper-inner-fixed {
-    float: left;
-    // width: 30px;
-    height: 20px;
-    line-height: 18px;
-    margin-right: 2px;
-    padding: 0 6px;
-    background: #fafafa;
-    border: 1px solid #d9d9d9;
-    border-radius: 2px;
-    cursor: pointer;
+    .wrapper-inner:last-child {
+      margin-right: 0;
+    }
+
+    .wrapper-inner-fixed {
+      float: left;
+      height: 20px;
+      line-height: 18px;
+      margin-right: 2px;
+      padding: 0 6px;
+      background: #fafafa;
+      border: 1px solid #d9d9d9;
+      border-radius: 2px;
+      cursor: pointer;
+    }
   }
-}
 
-.ant-popover-inner-content:nth-child(4n) {
-  margin-right: 0px;
-}
+  .@{ant-prefix}-popover-inner-content:nth-child(4n) {
+    margin-right: 0px;
+  }
 
-.inner {
-  max-width: 450px;
-  font-size: 12px;
+  .inner {
+    max-width: 450px;
+    font-size: 12px;
 
-  .ant-popover-inner-content {
-    float: left;
-    // max-width: 85px;
-    height: 20px;
-    line-height: 18px;
-    background: #fafafa;
-    border: 1px solid #d9d9d9;
-    border-radius: 2px;
-    padding: 0 6px;
-    margin: 0 2px 4px 0;
-    cursor: pointer;
-    // overflow: hidden;
-    // text-overflow: ellipsis;
-    // white-space: nowrap;
+    .@{ant-prefix}-popover-inner-content {
+      float: left;
+      height: 20px;
+      line-height: 18px;
+      background: #fafafa;
+      border: 1px solid #d9d9d9;
+      border-radius: 2px;
+      padding: 0 6px;
+      margin: 0 2px 4px 0;
+      cursor: pointer;
+    }
   }
-}
 
-.inner:after {
-  /*伪元素是行内元素 正常浏览器清除浮动方法*/
-  content: "";
-  display: block;
-  height: 0;
-  clear: both;
-  visibility: hidden;
-}
+  .inner:after {
+    /*伪元素是行内元素 正常浏览器清除浮动方法*/
+    content: "";
+    display: block;
+    height: 0;
+    clear: both;
+    visibility: hidden;
+  }
 
   .tag-wrapper-inner {
     .@{ant-prefix}-popover-inner-content {
       padding: 8px !important;
     }
+  }
 }

package/lib/PropertyControlViewer/assets/doSelect.less

@@ -1,81 +1,74 @@
-.ciWrapper {
-  // width: 150px;
-  height: 28px;
-  font-size: 12px;
-  display: flex;
-  // align-items: center;
-  // margin-left: -6px;
+.form-properties-box {
+  .ciWrapper {
+    height: 28px;
+    font-size: 12px;
+    display: flex;
 
-  .wrapper-inner {
-    float: left;
-    max-width: 85px;
-    height: 20px;
-    line-height: 18px;
-    margin-right: 2px;
-    // margin-bottom: 4px;
-    background: #fafafa;
-    border: 1px solid #d9d9d9;
-    border-radius: 2px;
-    cursor: pointer;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
+    .wrapper-inner {
+      float: left;
+      max-width: 85px;
+      height: 20px;
+      line-height: 18px;
+      margin-right: 2px;
+      background: #fafafa;
+      border: 1px solid #d9d9d9;
+      border-radius: 2px;
+      cursor: pointer;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
 
-  .wrapper-inner:last-child {
-    margin-right: 0;
-  }
+    .wrapper-inner:last-child {
+      margin-right: 0;
+    }
 
-  .wrapper-inner-fixed {
-    float: left;
-    // width: 30px;
-    height: 20px;
-    line-height: 18px;
-    margin-right: 2px;
-    padding: 0 6px;
-    background: #fafafa;
-    border: 1px solid #d9d9d9;
-    border-radius: 2px;
-    cursor: pointer;
+    .wrapper-inner-fixed {
+      float: left;
+      height: 20px;
+      line-height: 18px;
+      margin-right: 2px;
+      padding: 0 6px;
+      background: #fafafa;
+      border: 1px solid #d9d9d9;
+      border-radius: 2px;
+      cursor: pointer;
+    }
   }
-}
 
-.ant-popover-inner-content:nth-child(4n) {
-  margin-right: 0px;
-}
+  .@{ant-prefix}-popover-inner-content:nth-child(4n) {
+    margin-right: 0px;
+  }
 
-.inner {
-  max-width: 450px;
-  font-size: 12px;
+  .inner {
+    max-width: 450px;
+    font-size: 12px;
 
-  .ant-popover-inner-content {
-    float: left;
-    // max-width: 85px;
-    height: 20px;
-    line-height: 18px;
-    background: #fafafa;
-    border: 1px solid #d9d9d9;
-    border-radius: 2px;
-    padding: 0 6px;
-    margin: 0 2px 4px 0;
-    cursor: pointer;
-    // overflow: hidden;
-    // text-overflow: ellipsis;
-    // white-space: nowrap;
+    .@{ant-prefix}-popover-inner-content {
+      float: left;
+      height: 20px;
+      line-height: 18px;
+      background: #fafafa;
+      border: 1px solid #d9d9d9;
+      border-radius: 2px;
+      padding: 0 6px;
+      margin: 0 2px 4px 0;
+      cursor: pointer;
+    }
   }
-}
 
-.inner:after {
-  /*伪元素是行内元素 正常浏览器清除浮动方法*/
-  content: "";
-  display: block;
-  height: 0;
-  clear: both;
-  visibility: hidden;
-}
+  .inner:after {
+    /*伪元素是行内元素 正常浏览器清除浮动方法*/
+    content: "";
+    display: block;
+    height: 0;
+    clear: both;
+    visibility: hidden;
+  }
 
   .tag-wrapper-inner {
     .@{ant-prefix}-popover-inner-content {
       padding: 8px !important;
     }
-  }
+  }
+}

package/lib/PropertyControlViewer/assets/index.less

@@ -1,94 +1,93 @@
-.ci-detail-user {
-  width: 100%;
-  display: flex;
-  flex-wrap: wrap;
-  // line-height: 28px;
+@uploda-card-width : 88px;
+@uploda-card-height : 88px;
 
-  .ci-detail-user-item {
+.form-properties-box {
+  .ci-detail-user {
+    width: 100%;
     display: flex;
-    // align-items: center;
+    flex-wrap: wrap;
+
+    .ci-detail-user-item {
+      display: flex;
+    }
+
+    .ci-detail-user-name {
+      width: calc(100% - 32px);
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+
+    .ci-detail-avatar {
+      color: #fff;
+      background-color: #008dff;
+      margin-right: 8px;
+    }
+  }
+
+  .ci-detail-user-group {
+    width: 100%;
+
+    .user-group-item {
+      font-weight: 600;
+      background: #008dff;
+      color: #fff;
+      display: inline-block;
+      height: 25px;
+      padding: 0 5px;
+      border-radius: 10px;
+      margin-right: 5px;
+    }
   }
 
-  .ci-detail-user-name {
-    width: calc(100% - 32px);
+  .desBox {
+    width: 100%;
+    height: 100%;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
   }
 
-  .ci-detail-avatar {
-    color: #fff;
-    background-color: #008dff;
-    margin-right: 8px;
-  }
-}
-
-.ci-detail-user-group {
-  width: 100%;
-
-  .user-group-item {
-    font-weight: 600;
-    background: #008dff;
-    color: #fff;
-    display: inline-block;
-    height: 25px;
-    padding: 0 5px;
-    // line-height: 25px;
-    border-radius: 10px;
-    margin-right: 5px;
+  .doTextArea {
+    width: 100%;
+    line-height: 20px;
+    min-height: 50;
   }
-}
-
-.desBox {
-  width: 100%;
-  height: 100%;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-.doTextArea {
-  width: 100%;
-  line-height: 20px;
-  min-height: 50;
-}
 
-@uploda-card-width : 88px;
-@uploda-card-height : 88px;
 
-.ci-detail-image {
+  .ci-detail-image {
 
     .@{ant-prefix}-upload-list-item-uploading-text {
       text-align: center;
     }
 
     .@{ant-prefix}-upload.@{ant-prefix}-upload-select-picture-card {
-      width: @uploda-card-width !important;
-      height: @uploda-card-height !important;
+      width: @uploda-card-width  !important;
+      height: @uploda-card-height  !important;
     }
 
     .@{ant-prefix}-upload-list-picture-card .@{ant-prefix}-upload-list-item {
-      width: @uploda-card-width !important;
-      height: @uploda-card-height !important;
+      width: @uploda-card-width  !important;
+      height: @uploda-card-height  !important;
     }
 
     .@{ant-prefix}-upload-list-picture-card-container {
-      width: @uploda-card-width !important;
-      height: @uploda-card-height !important;
+      width: @uploda-card-width  !important;
+      height: @uploda-card-height  !important;
     }
 
     .@{ant-prefix}-upload-list {
       padding: 0 !important;
       background-color: #fff !important;
     }
-}
+  }
 
 
-.ci-detail-file {
+  .ci-detail-file {
 
-  .cw-upload-drag_ {
-    margin-top: 0 !important;
-  }
+    .cw-upload-drag_ {
+      margin-top: 0 !important;
+    }
 
     .@{ant-prefix}-upload-list {
       background-color: white;
@@ -99,9 +98,9 @@
       margin-top: 4px !important;
     }
 
-}
+  }
 
-.ci-detail-quote-card {
+  .ci-detail-quote-card {
 
     .@{ant-prefix}-card-body {
       padding: 3px;
@@ -120,70 +119,71 @@
       font-weight: normal;
     }
 
-  .ci-detail-quote-card-title {
-    width: 100%;
-    height: 28px;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
+    .ci-detail-quote-card-title {
+      width: 100%;
+      height: 28px;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+    }
+
+    .ci-detail-quote-card-title-span {
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+      font-size: 12px;
+    }
+
+  }
+
+  .ci-detail-quote-list {
+    .@{ant-prefix}-list-item {
+      margin-bottom: 12px !important;
+    }
   }
 
-  .ci-detail-quote-card-title-span {
+  .ci-table-view {
+    width: 100%;
     overflow: hidden;
     white-space: nowrap;
     text-overflow: ellipsis;
-    font-size: 12px;
   }
 
-}
+  //u为范围-点阵图
+  .unit-bitmap-box {
 
-.ci-detail-quote-list {
-    .@{ant-prefix}-list-item {
-      margin-bottom: 12px !important;
+    .lattice {
+      cursor: pointer;
+      float: left;
+      display: block;
+      width: 26px;
+      height: 26px;
+      margin: 2px 4px 2px 0px;
+      padding: 0;
+      color: rgba(0, 0, 0, .65);
+      line-height: 26px;
+      text-align: center;
+      background: #E8E8E8;
+      border: 1px solid transparent;
+      border-radius: 2px;
+      -webkit-transition: background .3s ease;
+      transition: background .3s ease;
     }
-}
-
-.ci-table-view {
-  width: 100%;
-  overflow: hidden;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-}
-
-//u为范围-点阵图
-.unit-bitmap-box {
-
-  .lattice {
-    cursor: pointer;
-    float: left;
-    display: block;
-    width: 26px;
-    height: 26px;
-    margin: 2px 4px 2px 0px;
-    padding: 0;
-    color: rgba(0, 0, 0, .65);
-    line-height: 26px;
-    text-align: center;
-    background: #E8E8E8;
-    border: 1px solid transparent;
-    border-radius: 2px;
-    -webkit-transition: background .3s ease;
-    transition: background .3s ease;
-  }
 
-  .locked_lattice {
-    color: rgba(0, 0, 0, .25);
-    background: #f5f5f5;
-    border: 1px solid transparent;
-    border-radius: 0;
-    cursor: not-allowed;
-  }
+    .locked_lattice {
+      color: rgba(0, 0, 0, .25);
+      background: #f5f5f5;
+      border: 1px solid transparent;
+      border-radius: 0;
+      cursor: not-allowed;
+    }
 
-  .usaged_lattice {
-    color: #fff;
-    background: #1890FF;
-    border: 1px solid transparent;
-    border-radius: 0;
-  }
+    .usaged_lattice {
+      color: #fff;
+      background: #1890FF;
+      border: 1px solid transparent;
+      border-radius: 0;
+    }
 
+  }
 }

package/lib/PropertyControlViewer/components/TagShowMoreList/index.less

@@ -1,104 +1,106 @@
-.wrapper {
-  height: 28px;
-  font-size: 12px;
-  display: flex;
-  align-items: center;
+.form-properties-box {
+  .wrapper {
+    height: 28px;
+    font-size: 12px;
+    display: flex;
+    align-items: center;
 
-  .wrapper-inner {
-    float: left;
-    height: 20px;
-    line-height: 20px;
-    margin-right: 8px;
-    background: #fafafa;
-    border: 1px solid #d9d9d9;
-    border-radius: 2px;
-    cursor: pointer;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
+    .wrapper-inner {
+      float: left;
+      height: 20px;
+      line-height: 20px;
+      margin-right: 8px;
+      background: #fafafa;
+      border: 1px solid #d9d9d9;
+      border-radius: 2px;
+      cursor: pointer;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
 
-  .wrapper-inner:last-child {
-    margin-right: 0;
+    .wrapper-inner:last-child {
+      margin-right: 0;
+    }
+
+    .wrapper-inner-fixed {
+      float: left;
+      height: 20px;
+      line-height: 20px;
+      margin-right: 2px;
+      padding: 0px 6px;
+      background: #fafafa;
+      border: 1px solid #d9d9d9;
+      border-radius: 2px;
+      cursor: pointer;
+    }
+
+    &.edit-wrapper {
+      .wrapper-inner {
+        height: 28px;
+        line-height: 28px;
+      }
+
+      .wrapper-inner-fixed {
+        height: 28px;
+        line-height: 28px;
+      }
+    }
   }
 
-  .wrapper-inner-fixed {
-    float: left;
-    height: 20px;
-    line-height: 20px;
-    margin-right: 2px;
-    padding: 0px 6px;
-    background: #fafafa;
-    border: 1px solid #d9d9d9;
-    border-radius: 2px;
-    cursor: pointer;
+  .@{ant-prefix}-popover-inner-content:nth-child(4n) {
+    margin-right: 0px;
   }
 
-  &.edit-wrapper {
-    .wrapper-inner {
-      height: 28px;
-      line-height: 28px;
-    }
+  .inner {
+    max-width: 220px;
+    font-size: 12px;
 
-    .wrapper-inner-fixed {
+    .@{ant-prefix}-popover-inner-content {
+      // float: left;
+      // max-width: 85px;
       height: 28px;
       line-height: 28px;
+      background: #fafafa;
+      border: 1px solid #d9d9d9;
+      border-radius: 2px;
+      // padding: 0 6px;
+      margin-bottom: 2px;
+      cursor: pointer;
+      // overflow: hidden;
+      // text-overflow: ellipsis;
+      // white-space: nowrap;
     }
   }
-}
-
-.ant-popover-inner-content:nth-child(4n) {
-  margin-right: 0px;
-}
 
-.inner {
-  max-width: 220px;
-  font-size: 12px;
-
-  .ant-popover-inner-content {
-    // float: left;
-    // max-width: 85px;
-    height: 28px;
-    line-height: 28px;
-    background: #fafafa;
-    border: 1px solid #d9d9d9;
-    border-radius: 2px;
-    // padding: 0 6px;
-    margin-bottom: 2px;
-    cursor: pointer;
-    // overflow: hidden;
-    // text-overflow: ellipsis;
-    // white-space: nowrap;
+  .inner:after {
+    /*伪元素是行内元素 正常浏览器清除浮动方法*/
+    content: "";
+    display: block;
+    height: 0;
+    clear: both;
+    visibility: hidden;
   }
-}
 
-.inner:after {
-  /*伪元素是行内元素 正常浏览器清除浮动方法*/
-  content: "";
-  display: block;
-  height: 0;
-  clear: both;
-  visibility: hidden;
-}
 
-
-.ellipsis-box {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
+  .ellipsis-box {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
 
 
-.tag-ci-detail-avatar {
-  color: #fff;
-  background-color: #008dff;
-  margin-right: 8px;
-  font-size: 10px !important;
-  margin-top: -2px;
-}
+  .tag-ci-detail-avatar {
+    color: #fff;
+    background-color: #008dff;
+    margin-right: 8px;
+    font-size: 10px !important;
+    margin-top: -2px;
+  }
 
   .tag-wrapper-inner {
     .@{ant-prefix}-popover-inner-content {
       padding: 8px !important;
     }
-  }
+  }
+}

package/lib/PropertyControlViewer/index.less

@@ -1,117 +1,34 @@
-.simpleColBox {
-  height: 100%;
-  width: 100%;
+.form-properties-box {
   display: flex;
+  flex-wrap: wrap;
   justify-content: space-between;
-  margin-bottom: 24px
-}
-
-.form_box {
-    .cw-form-item-label-horizontal {
-      >label {
-        width: 100%;
 
-        .cw-form-item-typography-label {
-          word-break: break-all !important;
-          flex: 1;
-        }
-      }
-    }
-
-    .@{ant-prefix}-checkbox-wrapper+.@{ant-prefix}-checkbox-wrapper {
-      margin-right: 8px;
-      margin-left: 0px;
-    }
+  .@{ant-prefix}-form-item {
+    padding-bottom: 0px !important;
+    margin-bottom: 16px !important;
   }
 
-.attrDetailLabel {
-  display: flex;
-  width: 100%;
-  margin-bottom: 24px;
-
-  .name {
-    width: 85px;
-    margin-right: 6px;
-    display: flex;
-    justify-content: space-between;
-    // align-items: center;
-    .label {
-      display: -webkit-box;
-      -webkit-line-clamp: 2;
-      -webkit-box-orient: vertical;
-      overflow: hidden;
-      word-wrap: break-word;
-      word-break: break-all;
-      width: 95%;
-    }
-    .symbol {
-      flex: 1;
-    }
+  .@{ant-prefix}-collapse {
+    width: 100%;
   }
 
-  .content {
-    flex: 1;
-  }
-}
-
-.CHECKBOX_form {
-    .@{ant-prefix}-form-item-control {
-      align-items: center !important;
-      display: flex !important;
-    }
-}
-
-.RACK_UNIT_form {
-  height: 28px !important;
-}
-
-.form-box-label-uni-icon {
-  padding-left: 10px;
-}
-
-.form-box-label-question-icon {
-  padding-left: 6px;
-}
-
-.form-properties-box {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: space-between;
-
+  .CM-DB-form-item-box:last-child {
     .@{ant-prefix}-form-item {
-      padding-bottom: 0px !important;
-      margin-bottom: 16px !important;
-    }
-
-    .@{ant-prefix}-collapse {
-      width: 100%;
+      margin-bottom: 0 !important;
     }
   }
 
-.form-properties-box {
-    .CM-DB-form-item-box:last-child {
-      .@{ant-prefix}-form-item {
-        margin-bottom: 0 !important;
-      }
-    }
-}
-
-.table-label {
-    .@{ant-prefix}-form-item-label {
-      width: 100% !important;
-      margin-bottom: 6px;
-
-      & label::after {
-        display: none;
-      }
-    }
+  .@{ant-prefix}-typography {
+    margin-bottom: 0 !important;
+  }
 
+  .view_table {
     .@{ant-prefix}-form-item-control-wrapper {
-      display: none;
+      width: calc(100% - 110px);
     }
-}
+  }
 
-.form-box {
+  .form_box {
     .cw-form-item-label-horizontal {
       >label {
         width: 100%;
@@ -123,69 +40,67 @@
       }
     }
 
-    .@{ant-prefix}-checkbox-wrapper {
+    .@{ant-prefix}-checkbox-wrapper+.@{ant-prefix}-checkbox-wrapper {
       margin-right: 8px;
-      margin-left: 0px !important;
+      margin-left: 0px;
     }
+  }
 
-    .@{ant-prefix}-form-item-control-wrapper {
-      width: calc(100% - 110px);
-      overflow: hidden;
-
-      .@{ant-prefix}-form-item-children {
-        width: 100%;
-        display: inline-block;
-
-        .@{ant-prefix}-switch {
-          max-width: 100%;
+  .attrDetailLabel {
+    display: flex;
+    width: 100%;
+    margin-bottom: 24px;
+
+    .name {
+      width: 85px;
+      margin-right: 6px;
+      display: flex;
+      justify-content: space-between;
+
+      // align-items: center;
+      .label {
+        display: -webkit-box;
+        -webkit-line-clamp: 2;
+        -webkit-box-orient: vertical;
+        overflow: hidden;
+        word-wrap: break-word;
+        word-break: break-all;
+        width: 95%;
+      }
 
-          .switchLabelBox {
-            max-width: 100%;
-            overflow: hidden;
-            text-overflow: ellipsis;
-            white-space: nowrap;
-          }
-        }
+      .symbol {
+        flex: 1;
       }
     }
-}
-
-
-.ciunitbitmap-content-box {
-  max-width: 320px;
-  display: flex;
-
-  .ciunitbitmap-modal-icon-box {
-    width: 24px;
-    height: 24px;
-    background-color: rgb(230, 247, 255);
-    border-radius: 50%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
 
-    .ciunitbitmap-modal-icon {
-      font-size: 12px;
-      color: rgb(25, 133, 255);
+    .content {
+      flex: 1;
     }
   }
 
-  .ciunitbitmap-content-text {
-    margin-left: 6px;
+  .ciunitbitmap-content-box {
+    max-width: 320px;
     display: flex;
-    align-items: center;
-  }
-}
 
-
-.form-properties-view-box {
-    .@{ant-prefix}-typography {
-      margin-bottom: 0 !important;
+    .ciunitbitmap-modal-icon-box {
+      width: 24px;
+      height: 24px;
+      background-color: rgb(230, 247, 255);
+      border-radius: 50%;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+
+      .ciunitbitmap-modal-icon {
+        font-size: 12px;
+        color: rgb(25, 133, 255);
+      }
     }
 
-  .view_table {
-      .@{ant-prefix}-form-item-control-wrapper {
-        width: calc(100% - 110px);
-      }
+    .ciunitbitmap-content-text {
+      margin-left: 6px;
+      display: flex;
+      align-items: center;
+    }
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@chaoswise/business",
-  "version": "0.0.9",
+  "version": "0.0.10",
   "description": "业务组件库",
   "keywords": [
     "ui",
@@ -104,5 +104,6 @@
   "publishConfig": {
     "access": "public"
   },
-  "license": "MIT"
+  "license": "MIT",
+  "gitHead": "5fe209921911217d8936eb4c50323a70dc954282"
 }