@deot/vc-components 1.0.22 → 1.0.24

package/dist/index.umd.cjs

@@ -14700,7 +14700,7 @@
 	  },
 	  width: {
 	    type: Number,
-	    default: 300
+	    default: 600
 	  },
 	  height: {
 	    type: Number,
@@ -14726,6 +14726,8 @@
 	  maskStyle: [Object, String],
 	  wrapperClass: [Object, String],
 	  wrapperStyle: [Object, String],
+	  contentStyle: [Object, String],
+	  contentClass: [Object, String],
 	  closeWithCancel: {
 	    type: Boolean,
 	    default: true
@@ -14885,7 +14887,8 @@
 	          "class": "vc-drawer__content-container"
 	        }, [vue.createVNode(Scroller, {
 	          "native": false,
-	          "contentClass": "vc-drawer__content"
+	          "contentClass": [props.contentClass, 'vc-drawer__content'],
+	          "contentStyle": props.contentStyle
 	        }, {
 	          default: () => [typeof props.content === 'string' ? vue.createVNode("div", {
 	            "innerHTML": props.content
@@ -15177,7 +15180,10 @@
 	    type: String,
 	    default: "right"
 	  },
-	  contentStyle: String
+	  contentStyle: [Object, String],
+	  contentClass: [Object, String],
+	  labelStyle: [Object, String],
+	  labelClass: [Object, String]
 	};
 
 	class Validator {
@@ -15384,10 +15390,13 @@
 	  });
 	  const labelStyle = vue.computed(() => {
 	    const labelWidth = props.labelWidth === 0 || props.labelWidth ? props.labelWidth : isNest.value ? 0 : form.props.labelWidth;
-	    return {
-	      width: labelPosition.value !== "top" && labelWidth && labelWidth > 0 ? `${labelWidth}px` : "auto",
-	      textAlign: labelPosition.value === "top" ? "left" : labelPosition.value
-	    };
+	    return [
+	      {
+	        width: labelPosition.value !== "top" && labelWidth && labelWidth > 0 ? `${labelWidth}px` : "auto",
+	        textAlign: labelPosition.value === "top" ? "left" : labelPosition.value
+	      },
+	      props.labelStyle
+	    ];
 	  });
 	  const contentStyle = vue.computed(() => {
 	    const labelWidth = props.labelWidth === 0 || props.labelWidth ? props.labelWidth : form.props.labelWidth;
@@ -15599,14 +15608,14 @@
 	      })];
 	      return vue.createVNode("div", {
 	        "class": ['vc-form-item', classes.value]
-	      }, [vue.createVNode("div", {
+	      }, [(label || slots.label) && vue.createVNode("div", {
 	        "style": labelStyle.value,
-	        "class": "vc-form-item__label",
+	        "class": ['vc-form-item__label', props.labelClass],
 	        "for": labelFor
 	      }, [vue.createVNode("label", null, [label || slots.label?.()])]), vue.createVNode("div", {
 	        "class": "vc-form-item__wrapper"
 	      }, [vue.createVNode("div", {
-	        "class": "vc-form-item__content",
+	        "class": ['vc-form-item__content', props.contentClass],
 	        "style": contentStyle.value
 	      }, [slots.default?.(), slots.error ? slots.error({
 	        show: showError.value,
@@ -17060,10 +17069,14 @@
 	    validator: (v) => /(small|medium|large)/.test(v),
 	    default: "small"
 	  },
+	  contentStyle: [Object, String],
 	  contentClass: [Object, String],
 	  width: {
 	    type: Number
 	  },
+	  height: {
+	    type: Number
+	  },
 	  mask: {
 	    type: Boolean,
 	    default: true
@@ -17155,6 +17168,9 @@
 	    const x = vue.ref(0);
 	    const y = vue.ref(0);
 	    const isActive = vue.ref(false);
+
+	    // 注: 服务端渲染为0, 在客服端激活前，展示端存在问题【高度不定】
+	    const MAX_HEIGHT = IS_SERVER$2 ? 0 : window.innerHeight - 20;
 	    const defaultSize = vue.computed(() => {
 	      let width = 0;
 	      let height = 0;
@@ -17174,16 +17190,20 @@
 	      }
 	      return {
 	        width: props.width || width,
-	        height
+	        height: Math.min(props.height || height, MAX_HEIGHT)
 	      };
 	    });
 	    const basicStyle = vue.computed(() => {
-	      return {
+	      const result = {
 	        width: `${defaultSize.value.width}px`,
-	        minHeight: `${defaultSize.value.height}px`,
-	        // 注: 服务端渲染为0, 在客服端激活前，展示端存在问题【高度不定】
-	        maxHeight: IS_SERVER$2 ? 0 : `${window.innerHeight - 20}px`
+	        maxHeight: `${MAX_HEIGHT}px`
 	      };
+	      if (props.height) {
+	        result.height = `${defaultSize.value.height}px`;
+	      } else {
+	        result.minHeight = `${defaultSize.value.height}px`;
+	      }
+	      return result;
 	    });
 	    const draggableStyle = vue.computed(() => {
 	      if (IS_SERVER$2 || !props.draggable) return {};
@@ -17306,6 +17326,7 @@
 	     * container在最大值时，需要移除，宽度才会缩回去
 	     */
 	    const handleContentResize = () => {
+	      if (props.height) return;
 	      const needRefreshScroller = !!scroller.value.wrapper.style.getPropertyValue('height');
 	      const needRefreshContainer = !!container.value.style.getPropertyValue('height');
 	      needRefreshContainer && container.value.style.removeProperty('height');
@@ -17451,7 +17472,8 @@
 	              "height": isTransitionEnd.value ? row.height : void 0,
 	              "contentClass": [{
 	                'is-confirm': props.mode
-	              }, props.contentClass, 'vc-modal__content']
+	              }, props.contentClass, 'vc-modal__content'],
+	              "contentStyle": props.contentStyle
 	            }, {
 	              default: () => [typeof props.content === 'string' ? vue.createVNode("div", {
 	                "innerHTML": props.content
@@ -18529,7 +18551,8 @@
 	          }, [vue.createVNode(Spin, {
 	            "size": 16
 	          }, null)]), vue.createVNode(Scroller, {
-	            "class": "vc-select__options"
+	            "class": "vc-select__options",
+	            "max-height": "200px"
 	          }, {
 	            default: () => [props.data ? vue.createVNode("div", null, [props.data.map(item => {
 	              let _slot;
@@ -39176,6 +39199,7 @@
 	      const key = getValueOfRow(row, rowIndex);
 	      const selected = table.store.isSelected(row);
 	      const height = rowHeight || rowData.height;
+	      const maxColumnIndex = columns.length - 1;
 	      return vue.createVNode("div", {
 	        "key": key,
 	        "class": [getRowClass(row, rowIndex), 'vc-table__tr'],
@@ -39211,8 +39235,10 @@
 	          column,
 	          rowIndex,
 	          columnIndex,
+	          selected,
 	          store: table.store,
-	          selected
+	          isHead: columnIndex === 0,
+	          isTail: columnIndex === maxColumnIndex
 	        })]);
 	      })]);
 	    };
@@ -39711,6 +39737,8 @@
 	  stripe: Boolean,
 	  // 是否带有纵向边框
 	  border: Boolean,
+	  // 是否分割线
+	  divider: Boolean,
 	  // 非常影响表格虚拟滚动的性能，按容器的高度手动优化该值
 	  // 后续考虑移除，动态计算
 	  rows: {
@@ -39851,6 +39879,7 @@
 	        'vc-table--fit': props.fit,
 	        'vc-table--striped': props.stripe,
 	        'vc-table--border': props.border || states.isGroup,
+	        'vc-table--divider': props.border || props.divider,
 	        'vc-table--group': states.isGroup,
 	        'vc-table--fluid-height': props.maxHeight,
 	        'vc-table--scrollable-x': layout.states.scrollX,
@@ -40635,10 +40664,11 @@
 	  }
 	  const line = column.line || VcInstance.options.TableColumn?.line;
 	  if (line && value) {
+	    const base = rowData.isHead || rowData.isTail ? 36 : 24; // 目前gap是12
 	    const style = {
 	      // 目前左右pading为10
 	      // TODO: 含有border还要-1
-	      width: (column.realWidth || column.width) - 20 + 'px'
+	      width: (column.realWidth || column.width) - base + 'px'
 	    };
 	    return vue.createVNode(Text, {
 	      "style": style,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deot/vc-components",
-  "version": "1.0.22",
+  "version": "1.0.24",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",