bri-components 1.3.27 → 1.3.28

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "bri-components",
-    "version": "1.3.27",
+    "version": "1.3.28",
     "author": "dengshanghui",
     "description": "a component lib for vue project",
     "main": "src/index.js",

package/src/components/controls/base/BriUpload/BriUpload.vue

@@ -15,7 +15,7 @@
             'BriUpload-disabled': canEdit && !finalCanEdit,
             'BriUpload-readonly': !canEdit,
             'BriUpload-unit': !canEdit && isInTable,
-            [`BriUpload-${showType}`]: true,
+            [`BriUpload-${showMode}`]: true,
         }"
     >
         <!-- 编辑 -->
@@ -40,11 +40,11 @@
             >
 
             <slot>
-                <div :class="`BriUpload-${showType}-add`">
+                <div :class="`BriUpload-${showMode}-add`">
                     <!-- 上传 -->
                     <i-circle
                         v-if="percent"
-                        :class="`BriUpload-${showType}-circle`"
+                        :class="`BriUpload-${showMode}-circle`"
                         :percent="percent"
                         :stroke-color="percentColor"
                     >
@@ -54,7 +54,7 @@
                             type="ios-checkmark"
                         ></Icon>
                         <!-- 上传中 -->
-                        <span v-else-if="showType === 'old'">
+                        <span v-else-if="showMode === 'old'">
                             {{ percent }}%
                         </span>
                     </i-circle>
@@ -66,7 +66,7 @@
                             @click="clickUpload"
                         ></dsh-icons>
 
-                        <span v-if="showType !== 'inline'">
+                        <span v-if="showMode !== 'inline'">
                             点击上传{{ subType === 'image' ? "图片" : "文件" }}
                         </span>
                     </template>
@@ -80,7 +80,7 @@
                 :canEdit="finalCanEdit"
                 :files="curValList"
                 :emptyShowVal="emptyShowVal"
-                :showType="showType"
+                :showMode="showMode"
                 :propsObj="propsObj"
                 @deleteItem="clickDeteItem"
             ></upload-list>
@@ -138,7 +138,7 @@
             selfPropsObj () {
                 return {
                     _fileType: "file",
-                    _showType: this.isHeightAuto ? "old" : "inline", // 宽度为100%、且不在级联表格或内部表格里的 显示老版
+                    _showMode: this.isHeightAuto ? "old" : "inline", // 宽度为100%、且不在级联表格或内部表格里的 显示老版
                     // _multiple: true,
                     _useType: "drag",
                     _maxSize: 1024 * 1024,
@@ -153,8 +153,8 @@
             subType () {
                 return this.selfPropsObj._fileType;
             },
-            showType () {
-                return this.isInTable ? "inline" : this.selfPropsObj._showType;
+            showMode () {
+                return this.isInTable ? "inline" : this.selfPropsObj._showMode;
             },
             useType () {
                 return this.selfPropsObj._useType;
@@ -178,7 +178,7 @@
                     [`${prefixCls}-select`]: this.useType === "select",
                     [`${prefixCls}-drag`]: this.useType === "drag",
                     [`${prefixCls}-dragOver`]: this.useType === "drag" && this.dragOver,
-                    [`BriUpload-${this.showType}-wrapper`]: true
+                    [`BriUpload-${this.showMode}-wrapper`]: true
                 };
             }
         },

package/src/components/controls/base/BriUpload/uploadList.vue

@@ -1,10 +1,10 @@
 <template>
     <div
         class="uploadList"
-        :class="`uploadList-${showType}`"
+        :class="`uploadList-${showMode}`"
     >
         <!-- 普通文本模式 -->
-        <template v-if="showType ==='old'">
+        <template v-if="showMode ==='old'">
             <!-- 有值 -->
             <div
                 v-if="files.length"
@@ -116,7 +116,7 @@
                     return [];
                 }
             },
-            showType: {
+            showMode: {
                 type: String,
                 default: "old" // inline, old, normal
             },

package/src/components/controls/base/DshCascader/DshCascader.vue

@@ -5,7 +5,7 @@
         class="DshCascader"
     >
         <component
-            :is="showTypeMap[showType]"
+            :is="showTypeMap[showMode]"
             v-model="showModal"
             :activeValue="curValList"
             :data="cascaderData"
@@ -77,7 +77,7 @@
         class="DshCascaders"
     >
         <component
-            :is="showTypeMap[showType]"
+            :is="showTypeMap[showMode]"
             v-model="showModal"
             :multipleMode="multipleMode"
             :data="cascaderData"

package/src/components/controls/base/DshCascader/components/cascaderModal.vue

@@ -40,11 +40,11 @@
                                 <div
                                     v-if="canUseModeSwitch"
                                     class="mode"
-                                    @click="showMode = showMode === 'default' ? 'flat' : 'default'"
+                                    @click="searchMode = searchMode === 'default' ? 'flat' : 'default'"
                                 >
                                     <dsh-icons :list="[{ icon: 'md-swap' }]" />
                                     <span class="mode-name">
-                                        {{ showMode === "default" ? "按层级" : "按平级" }}
+                                        {{ searchMode === "default" ? "按层级" : "按平级" }}
                                     </span>
                                 </div>
 
@@ -206,7 +206,7 @@
 
             search () {
                 this.selectedValue = [];
-                this.showMode = "default";
+                this.searchMode = "default";
             },
             clickItem (node) {
                 // 避免重复点击

package/src/components/controls/base/DshCascader/components/cascaderPicker.vue

@@ -51,11 +51,11 @@
                                 <div
                                     v-if="canUseModeSwitch"
                                     class="mode"
-                                    @click="showMode = showMode === 'default' ? 'flat' : 'default'"
+                                    @click="searchMode = searchMode === 'default' ? 'flat' : 'default'"
                                 >
                                     <dsh-icons :list="[{ icon: 'md-swap' }]" />
                                     <span class="mode-name">
-                                        {{ showMode === "default" ? "按层级" : "按平级" }}
+                                        {{ searchMode === "default" ? "按层级" : "按平级" }}
                                     </span>
                                 </div>
 
@@ -243,7 +243,7 @@
 
             search () {
                 this.selectedValue = [];
-                this.showMode = "default";
+                this.searchMode = "default";
                 this.curTabIndex = 0;
             },
             clickItem (node) {
@@ -261,7 +261,7 @@
                 }
 
                 // 区分展示方式
-                if (this.showMode === "default" && node.children.length) {
+                if (this.searchMode === "default" && node.children.length) {
                     this.curTabIndex = this.curTabIndex + 1;
                 }
             }

package/src/components/controls/base/DshCoordinates.vue

@@ -191,13 +191,14 @@
         computed: {
             selfPropsObj () {
                 return {
+                    _showType: "marker", // "marker", "multipleMarker", "polyline", "polygon", "rectangle"
                     _icon: "ios-map-outline",
 
                     ...this.propsObj,
                     ...this.commonDealPropsObj
                 };
             },
-            showType () {
+            showMode () {
                 return this.selfPropsObj._showType;
             },
 
@@ -323,7 +324,7 @@
                 if (!this.$isEmptyData(this.newVal)) {
                     this.handleAddMarker(this.newVal.lnglat, true);
 
-                    if (this.showType === "multipleMarker") { // 多选打开绘图功能
+                    if (this.showMode === "multipleMarker") { // 多选打开绘图功能
                         this.finalCanEdit && this.handleOpenDraw();
                     }
                 } else {
@@ -332,10 +333,10 @@
             },
             handleMouseToolCallback (e) {
                 if (e.obj.CLASS_NAME === "AMap.Marker") {
-                    if (this.showType === "marker") {
+                    if (this.showMode === "marker") {
                         this.plot = e.obj;
                         this.handleCloseDraw();
-                    } else if (this.showType === "multipleMarker") {
+                    } else if (this.showMode === "multipleMarker") {
                         if (this.plot) {
                             this.plot.push(e.obj);
                         } else {
@@ -369,7 +370,7 @@
                 }
             },
             // 打开绘图
-            handleOpenDraw (type = this.showType) {
+            handleOpenDraw (type = this.showMode) {
                 switch (type) {
                 case "marker": {
                     this.mouseTool.marker(markerOpt);
@@ -402,7 +403,7 @@
                 this.mouseTool.close();
             },
             // 添加图形
-            handleAddMarker (location, centerView = true, type = this.showType) {
+            handleAddMarker (location, centerView = true, type = this.showMode) {
                 location = JSON.parse(JSON.stringify(location));
                 // 分类型添加
                 if (["polygon", "rectangle", "circle"].includes(type)) {
@@ -417,12 +418,12 @@
                     !this.marker && (this.marker = new AMap.Marker());
                     this.marker.setPosition(location);
                     this.marker.setMap(this.map);
-                    if (this.showType === "marker") {
+                    if (this.showMode === "marker") {
                         this.handleRmoveMarker();
                         this.handleCloseDraw();
                         this.newVal.lnglat = [location];
                         this.getRegeoCode();
-                    } else if (this.showType === "multipleMarker") {
+                    } else if (this.showMode === "multipleMarker") {
                         this.newVal.lnglat.push(location);
                         this.getRegeoCode();
                     }
@@ -445,7 +446,7 @@
                 }
             },
             // 移除图形
-            handleRmoveMarker (type = this.showType) {
+            handleRmoveMarker (type = this.showMode) {
                 if (["default"].includes(type)) {
                     this.marker && this.map.remove(this.marker);
                     this.plot && this.map.remove(this.plot);

package/src/components/controls/base/DshNumber/DshNumber.vue

@@ -155,8 +155,8 @@
 
         &-edit {
             &-suffix {
-                min-width: 32px;
-                padding: 0px 6px;
+                min-width: 30px;
+                padding: 0px 5px;
                 border-left: 1px solid @borderColor;
                 background-color: #F0F0F0;
                 text-align: center;

package/src/components/controls/base/DshSelect/DshCheckbox.vue

@@ -5,7 +5,7 @@
         class="DshCheckbox"
     >
         <!-- flat方式 -->
-        <template v-if="showType === 'flat'">
+        <template v-if="showMode === 'flat'">
             <!-- 有选项 -->
             <template v-if="listData.length">
                 <CheckboxGroup

package/src/components/controls/base/DshSelect/DshSelect.vue

@@ -5,7 +5,7 @@
         class="DshSelect"
     >
         <!-- flat方式 -->
-        <template v-if="['flat', 'button'].includes(showType)">
+        <template v-if="['flat', 'button'].includes(showMode)">
             <!-- 有选项 -->
             <template v-if="listData.length">
                 <RadioGroup
@@ -161,7 +161,7 @@
                 };
             },
             radioGroupType () {
-                return this.showType === "button" ? "button" : undefined;
+                return this.showMode === "button" ? "button" : undefined;
             }
         },
         created () {},

package/src/components/controls/mixins/cascaderMixin.js

@@ -35,7 +35,7 @@ export default {
                 _joinSymbol: _joinSymbol // 级联拼接符
             };
         },
-        showType () {
+        showMode () {
             return this.selfPropsObj._showMode;
         },
         colorMap () {

package/src/components/controls/mixins/cascaderPickerMixin.js

@@ -33,7 +33,7 @@ export default {
     data () {
         return {
             searchName: "",
-            showMode: "default", // "flat", "default"
+            searchMode: "default", // "flat", "default"
             maxFlatModeSearchNum: 80,
 
             inputStr: "",
@@ -102,7 +102,7 @@ export default {
         useFlatMode () {
             return this.filterable &&
                 this.canUseModeSwitch &&
-                this.showMode === "flat";
+                this.searchMode === "flat";
         },
         modeTip () {
             return `在搜索时，会出现层级和平级切换开关，但搜索出的结果超${this.maxFlatModeSearchNum}个时，\

package/src/components/controls/mixins/controlMixin.js

@@ -132,7 +132,7 @@ export default {
             return {
                 // TODO: 此处的请输入可能还有请选择之类的，待处理
                 _placeholder: this.canEdit && this.propsObj._enterType !== "calculate"
-                    ? (this.propsObj._placeholder || `请${selectControlTypes.includes(this.controlType) ? "选择" : "输入"}${this.propsObj._name}`)
+                    ? (this.propsObj._placeholder || `${selectControlTypes.includes(this.controlType) ? "选择" : "输入"}${this.propsObj._name}`)
                     : undefined,
                 _clearable: this.finalCanEdit && (this.propsObj._clearable === undefined ? true : this.propsObj._clearable),
                 _disabled: this.propsObj._disabled || ["serialNumber"].includes(this.controlType) || !this.finalCanEdit

package/src/components/controls/mixins/selectMixin.js

@@ -36,7 +36,7 @@ export default {
         nameKey () {
             return this.selfPropsObj._nameKey;
         },
-        showType () {
+        showMode () {
             return this.selfPropsObj._optionKind;
         },
         colorMap () {

package/src/components/controls/senior/selectDepartments.vue

@@ -172,11 +172,21 @@
                     _highSearch: false,
                     _changeOnSelect: true,
                     _searchString: "",
+                    _reverseFilter: false,
+                    _userDepartFilterVals: [],
 
                     ...this.propsObj,
                     ...this.commonDealPropsObj
                 };
             },
+            // 反向过滤
+            reverseFilter () {
+                return this.selfPropsObj._reverseFilter;
+            },
+            // 禁止显示的部门以及部门下人员
+            listFilterVals () {
+                return this.selfPropsObj._userDepartFilterVals;
+            },
             highSearch () {
                 return this.isOnSearch ? true : this.selfPropsObj._highSearch;
             },
@@ -295,7 +305,14 @@
                     },
                     callback: data => {
                         this.loading = false;
-                        this.departmentList = data.list;
+                        this.departmentList = this.listFilterVals.length
+                            ? data.list.filter(
+                                item =>
+                                    this.reverseFilter
+                                        ? !this.listFilterVals.includes(item._key)
+                                        : this.listFilterVals.includes(item._key)
+                            )
+                            : data.list;
                     }
                 });
             }

package/src/components/controls/senior/selectUsers/selectUsers.vue

@@ -337,7 +337,6 @@
                 };
                 this.curDepartment = {};
                 this.pagePropsObj.page = 1;
-                this.getUserListData();
                 this.getDepartmentListData();
             },
             search () {
@@ -421,11 +420,11 @@
                     },
                     loadingName: "loading",
                     callback: data => {
-                        this.userList = this.listFilterVals.length
+                        this.userList = this.allListFilterVals.length
                             ? data.list.filter(item =>
                                 this.reverseFilter
-                                    ? !this.listFilterVals.includes(item.departmentKey)
-                                    : this.listFilterVals.includes(item.departmentKey)
+                                    ? !this.allListFilterVals.includes(item.departmentKey)
+                                    : this.allListFilterVals.includes(item.departmentKey)
                             )
                             : data.list;
                         this.total = data.total;
@@ -471,6 +470,10 @@
                         searchString: this.propsObj.searchString
                     },
                     callback: data => {
+                        // 当前部门被过滤，所有子级部门同样过滤
+                        const depts = data.list.filter(item => this.listFilterVals.includes(item._key));
+                        this.allListFilterVals = this.getAllListFilterVals(depts).map(item => item._key);
+
                         this.departmentList = [
                             ...(
                                 this.highSearch
@@ -512,8 +515,20 @@
                                     : data.list
                             )
                         ];
+
+                        this.getUserListData();
                     }
                 });
+            },
+
+            getAllListFilterVals (list) {
+                if (list.length) {
+                    let stack = [...list];
+                    return stack.reduce((prev, item) => {
+                        return prev.concat(item.children && item.children.length ? this.getAllListFilterVals(item.children) : []);
+                    }, stack);
+                }
+                return [];
             }
         },
         filters: {

package/src/components/list/DshBox/DshCrossTable.vue

@@ -196,6 +196,7 @@
                                 :key="dataItem._id"
                                 class="DshCrossTable-td-checkbox"
                                 :style="{
+                                    width: colWidth ? colWidth + 'px' : '200px',
                                     background: '#f4f4f4',
                                     textAlign: 'center'
                                 }"
@@ -217,6 +218,7 @@
                             :key="dataItem._id"
                             class="DshCrossTable-td-index"
                             :style="{
+                                width: colWidth ? colWidth + 'px' : '200px',
                                 background: '#f4f4f4',
                                 textAlign: 'center'
                             }"
@@ -232,6 +234,9 @@
             <div
                 v-if="showTable"
                 class="DshCrossTable-right-body"
+                :style="showScrollX === false ? {
+                    overflowX: 'hidden'
+                } : {}"
                 @scroll="tableScroll($event)"
             >
                 <!-- 无数据 -->
@@ -333,6 +338,7 @@
                             :key="dataItem._id"
                             class="DshCrossTable-td-operation"
                             :style="{
+                                width: colWidth ? colWidth + 'px' : '200px',
                                 background: '#f4f4f4',
                             }"
                         >
@@ -403,6 +409,7 @@
                 rowWidth: 0,
                 colWidth: 0,
                 titleWidth: 200,
+                showScrollX: false,
                 showTable: false,
                 currentPage: 1,
                 pagesize: 10,
@@ -557,14 +564,16 @@
                 let that = this;
                 erd.listenTo(document.getElementById("DshCrossTable-right"), function (element) {
                     // 计算宽度
-                    let tableWidth = that.$refs["DshCrossTable-right"].clientWidth;
+                    let tableWidth = that.$refs["DshCrossTable-right"].clientWidth - 10;
                     let nums = tableWidth / 200;
                     let dataTotal = that.data.length;
                     if (nums >= dataTotal) {
                         that.rowWidth = tableWidth;
-                        that.colWidth = (tableWidth - 10) / dataTotal;
+                        that.colWidth = tableWidth / dataTotal;
+                        that.showScrollX = false;
                     } else {
                         that.rowWidth = dataTotal * 200;
+                        that.showScrollX = true;
                     }
 
                     // that.rowWidth = 200 * that.data.length;

package/src/components/list/DshCascaderTable.vue

@@ -410,7 +410,7 @@
             },
             // 整行校验结果
             getRowRuleResult (row, rowIndex) {
-                this.filterColumns.every(col => this.getColRuleResult(col, row[col.nodeKey], rowIndex, true).bool);
+                return this.filterColumns.every(col => this.getColRuleResult(col, row[col.nodeKey], rowIndex).bool);
             },
             // 单元格校验结果
             getColRuleResult (col, row, rowIndex) {

package/src/components/list/DshTreeTable.vue

@@ -52,7 +52,7 @@
                 const treeData = this.getCalcuTree(this.data, this.filterColumns);
                 return this.$getTreeFlatArr(treeData, node =>
                     (this.searchFormList.length ? this.$isAdvRelyAccord(this.advSearchObj, node) : true) &&
-                    (node.level === 1 || node.__isShow__)
+                    (node.level === 1 || node.__isRendered__)
                 );
             },
             footerData () {
@@ -120,14 +120,11 @@
                     cellStyleOption: {
                         bodyCellClass: ({ row, column, rowIndex }) => {
                             return "bri-table-td" +
-                                `${
-                                    this.canEdit
-                                        ? " bri-table-td-edit"
-                                        : " bri-table-td-show"
-                                }` +
+                                `${this.canEdit ? " bri-table-td-edit" : " bri-table-td-show"}` +
+                                `${row.__isShow__ === false ? " bri-table-td-hide" : ""}` +
                                 `${
                                     ["__isExpand__"].includes(column._key)
-                                        ? " bri-table-td-normal"
+                                        ? " bri-table-td-expand"
                                         : ["__index__"].includes(column._key)
                                             ? " bri-table-td-index"
                                             : ""
@@ -158,22 +155,22 @@
                     _key: "__isExpand__",
                     key: "__isExpand__",
                     field: "__isExpand__",
-                    width: 46,
+                    width: 48,
                     align: "center",
                     fixed: "left",
                     renderBodyCell: ({ row, column, rowIndex }, h) => {
                         return row.children && row.children.length
                             ? h("Icon", {
                                 style: {
-                                    width: "14px",
-                                    height: "14px",
+                                    width: "16px",
+                                    height: "16px",
                                     cursor: "pointer",
                                     transform: row.__isExpand__ ? "rotate(90deg)" : "rotate(0deg)",
                                     transition: "transform 0.4s"
                                 },
                                 props: {
                                     type: "ios-arrow-forward",
-                                    size: "14"
+                                    size: "18"
                                 },
                                 on: {
                                     click: () => {
@@ -252,12 +249,10 @@
                 };
             },
             toggleExpand (row, bool = true) {
-                this.$set(row, "__isRendered__", true);
-
+                this.$set(row, "__isRendered__", true);// 作用不大 可有可无
                 this.$set(row, "__isExpand__", bool);
-                row.children.forEach(subRow => {
-                    this.$set(subRow, "__isShow__", bool);
-                });
+
+                this.toggleDescendantsShow(row, bool);
             },
             // 点击 -添加一行
             clickCreate (operationItem, row, rowIndex) {
@@ -273,48 +268,38 @@
             },
             // 点击 -删除行
             clickDelete (operationItem, row, rowIndex) {
-                const parentNode = this.getParentNode(this.data, row);
-                const index = parentNode.children.findIndex(childNode => childNode._id === row._id);
-                parentNode.children.splice(index, 1);
-                console.log(index);
-                console.log(parentNode);
-                // this.$Modal.confirm({
-                //     title: "警告",
-                //     content: "确定删除吗？",
-                //     onOk: () => {
-
-                //     }
-                // });
+                this.$Modal.confirm({
+                    title: "警告",
+                    content: "确定删除吗？",
+                    onOk: () => {
+                        const parentNode = this.getParentNode(this.data, row);
+                        const index = parentNode.children.findIndex(childNode => childNode._id === row._id);
+                        parentNode.children.splice(index, 1);
+                        console.log(index);
+                        console.log(parentNode);
+                    }
+                });
             },
 
+            /* ------ 工具方法 ------- */
             getCalcuTree (tree = [], columns) {
                 const loop = (list = []) =>
                     list.reduce((newList, node) => {
                         if (node.children && node.children.length) {
                             node.isLeaf = false;
-
                             node.children = loop(node.children);
+
                             columns.reduce((newNode, col) => {
-                                newNode[col._key] = col._type === "number" && ![undefined, null, "", "no"].includes(col._summaryType)
-                                    ? this.$calNumList(
-                                        node.children.map(subNode => subNode[col._key]),
-                                        col._summaryType,
-                                        { ...col, _defaultDigit: 2 },
-                                        false
-                                    )
-                                    : newNode[col._key];
-                                // this.$set(
-                                //     newNode,
-                                //     col._key,
-                                //     col._type === "number" && ![undefined, null, "", "no"].includes(col._summaryType)
-                                //         ? this.$calNumList(
-                                //             node.children.map(subNode => subNode[col._key]),
-                                //             col._summaryType,
-                                //             { ...col, _defaultDigit: 2 },
-                                //             false
-                                //         )
-                                //         : newNode[col._key]
-                                // );
+                                if (col._type === "number" && ![undefined, null, "", "no"].includes(col._summaryType)) {
+                                    newNode[col._key] = col._type === "number" && ![undefined, null, "", "no"].includes(col._summaryType)
+                                        ? this.$calNumList(
+                                            node.children.map(subNode => subNode[col._key]),
+                                            col._summaryType,
+                                            { ...col, _defaultDigit: 2 },
+                                            false
+                                        )
+                                        : newNode[col._key];
+                                }
 
                                 return newNode;
                             }, node);
@@ -353,6 +338,29 @@
                     loop(tree);
                     return parentNode;
                 }
+            },
+            toggleDescendantsShow (node, bool) {
+                const loop = (node, isFirstSon) => {
+                    if (node.children && node.children.length) {
+                        node.children.forEach(subNode => {
+                            if (isFirstSon) {
+                                this.$set(subNode, "__isRendered__", true);
+                                this.$set(subNode, "__isShow__", bool);
+                            } else {
+                                if (bool) {
+                                    this.$set(subNode, "__isShow__", subNode.__isTmpShow__);
+                                } else {
+                                    this.$set(subNode, "__isTmpShow__", subNode.__isShow__);
+                                    this.$set(subNode, "__isShow__", false);
+                                }
+                            }
+
+                            loop(subNode);
+                        });
+                    }
+                };
+
+                loop(node, true);
             }
         }
     };

package/src/components/list/mixins/tableBaseMixin.js

@@ -53,7 +53,7 @@ export default {
                 _heightAuto: false, // 单元格高度自适应
                 _useSelection: false, // 使用选择列
                 _useIndex: true, // 使用序号列
-                _useSummary: true, // 使用汇总行
+                _useSummary: false, // 使用汇总行
                 _disabledBtns: false, // 禁用增删按钮
                 _disabledCreateBtn: false, // 置灰新增按钮，目前只内部使用，comp_web数据表配置页那块
                 _disabledOldDataRow: false, // 置灰老数据行包含删除

package/src/styles/components/list/BriTable.less

@@ -37,34 +37,43 @@
                 height: 100% !important;
 
                 .ve-table-content-wrapper table.ve-table-content {
-                    thead.ve-table-header tr.ve-table-header-tr th.ve-table-header-th {
-                        padding: 4px 8px;
-
-                        .ve-table-filter .ve-table-filter-icon {
-                            &:hover {
-                                color: @themeColor;
+                    thead.ve-table-header {
+                        tr.ve-table-header-tr th.ve-table-header-th {
+                            padding: 4px 8px;
+    
+                            .ve-table-filter .ve-table-filter-icon {
+                                &:hover {
+                                    color: @themeColor;
+                                }
                             }
-                        }
-                        
-                        // 排序
-                        .ve-table-sort {
-                            position: absolute !important;
-                            top: 5px;
-                            right: 4px;
-
-                            .icon-vet-sort-top-arrow:before {
-                                content: "\e6347";
+                            
+                            // 排序
+                            .ve-table-sort {
+                                position: absolute !important;
+                                top: 5px;
+                                right: 4px;
+    
+                                .icon-vet-sort-top-arrow:before {
+                                    content: "\e6347";
+                                }
+    
+                                .icon-vet-sort-bottom-arrow:before {
+                                    content: "\e6349";
+                                }
                             }
+                        }
+                    }
+
+                    tbody.ve-table-body {
+                        tr.ve-table-body-tr, 
+                        tr.ve-table-expand-tr {
+                            height: auto;
 
-                            .icon-vet-sort-bottom-arrow:before {
-                                content: "\e6349";
+                            td.ve-table-body-td {
+                                padding: 4px 16px;
                             }
                         }
                     }
-                    
-                    // tbody.ve-table-body tr.ve-table-body-tr td.ve-table-body-td {
-                    //     padding: 4px 12px;
-                    // }
                 }
             }
             
@@ -91,7 +100,7 @@
     &-empty {
         width: 100%;
         height: 100%;
-        padding: 9px 20px;
+        padding: 9px 16px;
         border: 1px solid @borderColor;
         border-top: none;
         // border-bottom-left-radius: @borderRadius;
@@ -115,12 +124,12 @@
         position: relative;
 
         &-tip {
-            padding: 0px 0px 0px 20px;
+            padding: 0px 0px 0px 16px;
             font-size: 12px;
             line-height: 1;
             color: #ed4014;
             position: absolute;
-            top: calc(100% - 13px);
+            top: calc(100% - 12px);
             left: 0px;
         }
 
@@ -142,19 +151,20 @@
         }
 
         &-edit {
-            padding: 4px 20px 12px 20px!important;
+            padding: 4px 16px 12px 16px!important;
         }
         &-show {
-            padding: 4px 20px!important;
-            // padding: 4px 12px!important;
+  
         }
-        &-normal {
-            padding: 4px 8px!important;
-            // padding: 4px 12px!important;
+        &-hide {
+            display: none!important;
         }
         &-index {
             padding: 4px 16px 4px 12px!important;
         }
+        &-expand {
+
+        }
     }
 }
 

package/src/styles/global/text.less

@@ -33,9 +33,6 @@
     font-weight: 600;
     color: @textColor;
 }
-.dsh-hide {
-    display: none!important;
-}
 .dsh-subtip {
     width: 100%;
     text-align: center;

package/src/utils/table.js

@@ -9,8 +9,8 @@ const getHeadRender = function (h, column, {
         style: {
             display: "inline-block",
             maxWidth: "100%",
-            paddingLeft: "12px",
-            paddingRight: column._description ? "30px" : "12px",
+            paddingLeft: "8px",
+            paddingRight: column._description ? "26px" : "8px",
             verticalAlign: "middle",
             position: "relative"
         }
@@ -19,7 +19,7 @@ const getHeadRender = function (h, column, {
             style: {
                 position: "absolute",
                 top: "0px",
-                left: "0px",
+                left: "-2px",
                 color: "#ed4014"
             }
         }, "*"),
@@ -41,7 +41,7 @@ const getHeadRender = function (h, column, {
             style: {
                 position: "absolute",
                 bottom: "1px",
-                right: "12px",
+                right: "8px",
                 cursor: "pointer"
             },
             props: {
@@ -68,6 +68,7 @@ const transformToColumns = function (form, {
     return form
         .map(col => {
             const typeData = this.$modFieldMap[col._type] || {};
+            const typeWidth = typeData.width + (col._type === "number" && col._unit ? col._unit.length * 16 : 0);
 
             return {
                 title: col._name,
@@ -75,7 +76,7 @@ const transformToColumns = function (form, {
                 key: col._key,
                 align: col._align || typeData.align,
                 fixed: col._fixed,
-                width: col._width || typeData.width,
+                width: col._width || typeWidth,
                 sortBy: showHeadFilter
                     ? col._sortBy || typeData.sortBy
                     : undefined,