@deppon/deppon-template 2.5.6 → 2.5.8

package/README.md

@@ -325,6 +325,11 @@ const handleClick = () => {
 </script>
 ```
 
+## 设计规范
+
+-   [设计规范文档（Markdown）](./docs/design-spec.md)
+-   [设计规范可视化页面](./docs/design-spec.html)（浏览器直接打开）
+
 ## ProIframe 内嵌页
 
 在 ProLayout 内通过 iframe 加载页面，支持路由动态传 `url`。详见 [docs/pro-iframe.md](./docs/pro-iframe.md) 或文档站 [ProIframe 说明](../../docs/docs/deppon-template-pro-iframe.md)。

package/es/index.js

@@ -1,5 +1,5 @@
 import '_virtual/_rollup-plugin-inject-process-env.js';
-import './pro-form';
+export { default as ProForm } from './pro-form/index.js';
 import './pro-table';
 import './pro-dialog/ProDialog.vue.js';
 import './pro-field';
@@ -8,7 +8,6 @@ import './pro-field';
 export { default as ProFieldSelect } from './pro-field/components/Select';
 import './pro-field';
 export { default as ProFieldDatePicker } from './pro-field/components/DatePicker';
-export { default as ProForm } from './pro-form';
 export { default as ProTable } from './pro-table';
 import './pro-layout';
 export { default as ProLayout } from './pro-layout';

package/es/pro-form/form-slots.d.ts

@@ -0,0 +1,21 @@
+import type { SlotsType } from 'vue';
+export interface ProFormActionsSlotForm {
+    validate?: (props?: string | string[]) => Promise<boolean>;
+    resetFields?: () => void;
+    setFieldsValue?: (values: Record<string, unknown>) => void;
+    clearValidate?: (props?: string | string[]) => void;
+    submit?: () => void;
+    reset?: () => void;
+    validateField?: (props?: string | string[]) => Promise<boolean>;
+    getFieldsValue?: () => Record<string, unknown>;
+    [key: string]: unknown;
+}
+export interface ProFormActionsSlotProps {
+    form: ProFormActionsSlotForm;
+    model?: Record<string, unknown>;
+}
+export interface ProFormSlotMap {
+    actions: (props: ProFormActionsSlotProps) => unknown;
+    title: () => unknown;
+}
+export type ProFormSlots = SlotsType<ProFormSlotMap>;

package/es/pro-form/index.d.ts

@@ -1,4 +1,22 @@
 import type { DefineComponent } from 'vue';
+import type { ProFormSlots } from './form-slots';
+
+export type { ProFormActionsSlotForm, ProFormActionsSlotProps, ProFormSlotMap, ProFormSlots } from './form-slots';
+
+declare const ProForm: DefineComponent<
+    Record<string, unknown>,
+    Record<string, unknown>,
+    unknown,
+    {},
+    {},
+    {},
+    {},
+    {},
+    string,
+    {},
+    Record<string, unknown>,
+    {},
+    ProFormSlots
+>;
 
-declare const ProForm: DefineComponent<Record<string, never>, Record<string, never>, any>;
 export default ProForm;

package/es/pro-form/index.js

@@ -1,3 +1,8 @@
 import '../_virtual/_rollup-plugin-inject-process-env.js';
 import './ProForm.vue.js';
-export { default } from './ProForm.vue_vue_type_script_setup_true_lang.vue.js';
+import script from './ProForm.vue_vue_type_script_setup_true_lang.vue.js';
+
+var ProForm = script;
+var ProForm$1 = ProForm;
+
+export { ProForm$1 as default };

package/es/pro-layout/ProLayout.vue.css

@@ -1216,9 +1216,6 @@ body .el-overlay-dialog,
   --pro-layout-text-muted: #64748b;
   /* 顶栏横向菜单：圆体（可通过 --pro-layout-top-menu-font-family 覆盖） */
   --pro-layout-top-menu-font-family: 'DM Sans', 'Yuanti SC', 'Yuanti TC', 'Hiragino Sans GB', 'PingFang SC', 'Microsoft YaHei UI', system-ui, sans-serif;
-  --pro-layout-top-menu-active-bar-width: 28px;
-  --pro-layout-top-menu-active-bar-height: 3px;
-  --pro-layout-top-menu-active-bar-offset: 4px;
   background: var(--pro-layout-shell-bg) !important;
   color: var(--pro-layout-text);
   font-family: 'DM Sans', 'PingFang SC', 'Microsoft YaHei', system-ui, sans-serif;
@@ -2060,7 +2057,7 @@ body .el-overlay-dialog,
   padding: 0 6px;
   /* 覆盖 Element Plus：.el-menu-item [class^=el-icon] 的 margin-right，间距改由 label 的 gap 控制 */
   /* 首项（工作台）：极浅底、紧凑内边距；选中与顶栏其它项一致用主题色 */
-  /* 其余项选中：加粗、近黑字；下划线挂在菜单项上，绝对定位不占布局、不挡选中背景 */
+  /* 其余项选中：--el-color-primary 点亮文案与图标（工作台 --lead 保持独立样式） */
 }
 .pro-layout__top-menu-glass {
   display: flex;
@@ -2265,65 +2262,39 @@ body .el-overlay-dialog,
   color: var(--el-color-primary, #409eff) !important;
 }
 .pro-layout__top-menu .el-menu-item.is-active:not(.pro-layout__top-menu-divider):not(.pro-layout__top-menu-item--lead) {
-  position: relative !important;
-  color: rgba(0, 0, 0, 0.88) !important;
+  color: var(--el-color-primary, #409eff) !important;
   background: transparent !important;
   box-shadow: none !important;
-  font-weight: 700 !important;
-}
-.pro-layout__top-menu .el-menu-item.is-active:not(.pro-layout__top-menu-divider):not(.pro-layout__top-menu-item--lead)::after {
-  content: '';
-  position: absolute;
-  left: 50%;
-  bottom: -2px;
-  width: var(--pro-layout-top-menu-active-bar-width);
-  height: var(--pro-layout-top-menu-active-bar-height);
-  transform: translateX(-50%);
-  border-radius: 999px;
-  background: var(--pro-layout-accent, #6366f1);
-  box-shadow: 0 1px 4px color-mix(in srgb, var(--pro-layout-accent, #6366f1) 35%, transparent);
-  pointer-events: none;
-  z-index: 1;
+  font-weight: 600 !important;
 }
 .pro-layout__top-menu .el-menu-item.is-active:not(.pro-layout__top-menu-divider):not(.pro-layout__top-menu-item--lead):hover {
   background: transparent !important;
 }
 .pro-layout__top-menu .el-sub-menu.is-active:not(.pro-layout__top-menu-item--lead) > .el-sub-menu__title {
-  position: relative !important;
-  color: rgba(0, 0, 0, 0.88) !important;
+  color: var(--el-color-primary, #409eff) !important;
   background: transparent !important;
   box-shadow: none !important;
-  font-weight: 700 !important;
-}
-.pro-layout__top-menu .el-sub-menu.is-active:not(.pro-layout__top-menu-item--lead) > .el-sub-menu__title::after {
-  content: '';
-  position: absolute;
-  left: 50%;
-  bottom: -2px;
-  width: var(--pro-layout-top-menu-active-bar-width);
-  height: var(--pro-layout-top-menu-active-bar-height);
-  transform: translateX(-50%);
-  border-radius: 999px;
-  background: var(--pro-layout-accent, #6366f1);
-  box-shadow: 0 1px 4px color-mix(in srgb, var(--pro-layout-accent, #6366f1) 35%, transparent);
-  pointer-events: none;
-  z-index: 1;
+  font-weight: 600 !important;
 }
 .pro-layout__top-menu .el-sub-menu.is-active:not(.pro-layout__top-menu-item--lead) > .el-sub-menu__title:hover {
   background: transparent !important;
 }
 .pro-layout__top-menu  .el-menu-item.is-active:not(.pro-layout__top-menu-divider):not(.pro-layout__top-menu-item--lead) .pro-layout__top-menu-item-label,
 .pro-layout__top-menu .el-sub-menu.is-active:not(.pro-layout__top-menu-item--lead) .pro-layout__top-menu-item-label {
-  color: rgba(0, 0, 0, 0.88) !important;
-  font-weight: 700 !important;
+  color: var(--el-color-primary, #409eff) !important;
+  font-weight: 600 !important;
 }
 .pro-layout__top-menu  .el-menu-item.is-active:not(.pro-layout__top-menu-divider):not(.pro-layout__top-menu-item--lead) .pro-layout__top-menu-item-text,
 .pro-layout__top-menu .el-sub-menu.is-active:not(.pro-layout__top-menu-item--lead) .pro-layout__top-menu-item-text {
-  color: rgba(0, 0, 0, 0.88) !important;
+  color: var(--el-color-primary, #409eff) !important;
 }
 .pro-layout__top-menu  .el-menu-item.is-active:not(.pro-layout__top-menu-divider):not(.pro-layout__top-menu-item--lead) .pro-layout__top-menu-item-icon,
 .pro-layout__top-menu .el-sub-menu.is-active:not(.pro-layout__top-menu-item--lead) .pro-layout__top-menu-item-icon {
-  color: rgba(0, 0, 0, 0.62) !important;
+  color: var(--el-color-primary, #409eff) !important;
+}
+.pro-layout__top-menu  .el-menu-item.is-active:not(.pro-layout__top-menu-divider):not(.pro-layout__top-menu-item--lead) .pro-layout__top-menu-item-icon svg,
+.pro-layout__top-menu .el-sub-menu.is-active:not(.pro-layout__top-menu-item--lead) .pro-layout__top-menu-item-icon svg {
+  fill: currentColor !important;
 }
 .pro-layout__top-menu .el-sub-menu__icon-arrow {
   margin-left: 2px !important;
@@ -2331,7 +2302,7 @@ body .el-overlay-dialog,
   color: rgba(0, 0, 0, 0.35) !important;
 }
 .pro-layout__top-menu .el-sub-menu.is-active:not(.pro-layout__top-menu-item--lead) .el-sub-menu__icon-arrow {
-  color: rgba(0, 0, 0, 0.5) !important;
+  color: var(--el-color-primary, #409eff) !important;
 }
 .pro-layout__breadcrumb {
   display: flex;

package/es/pro-table/ProTable.vue.css

@@ -1244,8 +1244,8 @@ body .el-overlay-dialog,
 }
 .pro-table-container .table-wrapper {
   position: relative !important;
-  overflow-x: auto !important;
-  /* 确保横向滚动条出现 */
+  /* 横向滚动交给 el-table 内部 scrollbar，避免与 fixed 列双滚动层导致 show-overflow-tooltip 定位偏移 */
+  overflow-x: hidden !important;
   /* 加载状态时隐藏滚动条 */
   /* 只有启用拖拽时才显示 grab 光标 */
   /* 拖拽时禁用文本选择 */

package/es/pro-table/ProTable.vue_vue_type_script_setup_true_lang.vue.js

@@ -1,26 +1,26 @@
 import '../_virtual/_rollup-plugin-inject-process-env.js';
 import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _typeof from '@babel/runtime/helpers/typeof';
 import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import _regeneratorRuntime from '@babel/runtime/regenerator';
 import { defineComponent, useAttrs, computed, ref, watch, onMounted, onUnmounted, provide, openBlock, createElementBlock, normalizeClass, renderSlot, toDisplayString, createCommentVNode, createBlock, unref, withCtx, createVNode, createTextVNode, createElementVNode, normalizeStyle, mergeProps, createSlots, normalizeProps, guardReactiveProps, Fragment, renderList, nextTick } from 'vue';
 import { ElButton, ElSkeleton, ElTable, ElEmpty, ElTableColumn, ElPagination } from '@deppon/deppon-ui';
+import ProForm from '../pro-form/index.js';
 import './ProTableColumn.vue.js';
 import './ToolBar/index.vue.js';
-import script$2 from './ToolBar/index.vue_vue_type_script_setup_true_lang.vue.js';
-import script$3 from './ProTableColumn.vue_vue_type_script_setup_true_lang.vue.js';
-import script$1 from '../pro-form/ProForm.vue_vue_type_script_setup_true_lang.vue.js';
+import script$1 from './ToolBar/index.vue_vue_type_script_setup_true_lang.vue.js';
+import script$2 from './ProTableColumn.vue_vue_type_script_setup_true_lang.vue.js';
 
-var _excluded = ["fixedTable", "showHeader", "showPagination", "showOperations", "showToolbar", "dataSource", "columns", "currentPage", "pageSize", "pageSizes", "total", "loading", "searchLabelWidth", "searchCols", "rowSelection", "height", "searchTitle", "tableTitle", "editable", "readonly", "toolbar", "toolbarOptions", "tableSize"],
+var _excluded = ["fixedTable", "showHeader", "showPagination", "showOperations", "showToolbar", "dataSource", "columns", "currentPage", "pageSize", "pageSizes", "total", "loading", "searchLabelWidth", "searchCols", "rowSelection", "height", "searchTitle", "tableTitle", "editable", "readonly", "toolbar", "toolbarOptions", "tableSize", "tooltipOptions"],
   _excluded2 = ["_originalIndex"];
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
 function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var _hoisted_1 = {
   key: 0,
   "class": "table-header-title"
@@ -285,8 +285,15 @@ var script = /*@__PURE__*/defineComponent({
         attrs.toolbar;
         attrs.toolbarOptions;
         attrs.tableSize;
-        var tableAttrs = _objectWithoutProperties(attrs, _excluded);
-      return tableAttrs;
+        var userTooltipOptions = attrs.tooltipOptions,
+        tableAttrs = _objectWithoutProperties(attrs, _excluded);
+
+      // 溢出 tooltip 默认挂到 body，避免 appendTo=tableWrapper + 固定列/外层滚动导致 popper 错位
+      return _objectSpread(_objectSpread({}, tableAttrs), {}, {
+        tooltipOptions: _objectSpread({
+          appendTo: 'body'
+        }, userTooltipOptions)
+      });
     });
 
     // 表格引用
@@ -3811,7 +3818,7 @@ var script = /*@__PURE__*/defineComponent({
         }])
       }, [__props.searchTitle || _ctx.$slots.searchTitle ? (openBlock(), createElementBlock("div", _hoisted_1, [renderSlot(_ctx.$slots, "searchTitle", {}, function () {
         return [__props.searchTitle ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(__props.searchTitle), 1 /* TEXT */)) : createCommentVNode("v-if", true)];
-      })])) : createCommentVNode("v-if", true), __props.showHeader ? (openBlock(), createElementBlock("div", _hoisted_3, [searchColumns.value.length > 0 ? (openBlock(), createBlock(unref(script$1), {
+      })])) : createCommentVNode("v-if", true), __props.showHeader ? (openBlock(), createElementBlock("div", _hoisted_3, [searchColumns.value.length > 0 ? (openBlock(), createBlock(unref(ProForm), {
         key: 0,
         ref_key: "searchFormRef",
         ref: searchFormRef,
@@ -3852,7 +3859,7 @@ var script = /*@__PURE__*/defineComponent({
         key: 1
       })])) : createCommentVNode("v-if", true), __props.tableTitle || _ctx.$slots.tableTitle || __props.showOperations || __props.showToolbar ? (openBlock(), createElementBlock("div", _hoisted_4, [__props.tableTitle || _ctx.$slots.tableTitle ? (openBlock(), createElementBlock("div", _hoisted_5, [renderSlot(_ctx.$slots, "tableTitle", {}, function () {
         return [__props.tableTitle ? (openBlock(), createElementBlock("span", _hoisted_6, toDisplayString(__props.tableTitle), 1 /* TEXT */)) : createCommentVNode("v-if", true)];
-      })])) : createCommentVNode("v-if", true), __props.showOperations || __props.showToolbar ? (openBlock(), createElementBlock("div", _hoisted_7, [__props.showOperations ? (openBlock(), createElementBlock("div", _hoisted_8, [renderSlot(_ctx.$slots, "operations")])) : createCommentVNode("v-if", true), __props.showToolbar ? (openBlock(), createBlock(script$2, {
+      })])) : createCommentVNode("v-if", true), __props.showOperations || __props.showToolbar ? (openBlock(), createElementBlock("div", _hoisted_7, [__props.showOperations ? (openBlock(), createElementBlock("div", _hoisted_8, [renderSlot(_ctx.$slots, "operations")])) : createCommentVNode("v-if", true), __props.showToolbar ? (openBlock(), createBlock(script$1, {
         key: 1,
         columns: __props.columns,
         options: __props.toolbarOptions,
@@ -3934,7 +3941,7 @@ var script = /*@__PURE__*/defineComponent({
           })) : createCommentVNode("v-if", true), tableColumns.value && tableColumns.value.length > 0 ? (openBlock(true), createElementBlock(Fragment, {
             key: 2
           }, renderList(tableColumns.value, function (column) {
-            return openBlock(), createBlock(script$3, {
+            return openBlock(), createBlock(script$2, {
               key: column.prop || column.key || column.label,
               column: column,
               editable: __props.editable || __props.rowEdit,

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@deppon/deppon-template",
-    "version": "2.5.6",
+    "version": "2.5.8",
     "main": "es/index.js",
     "module": "es/index.js",
     "typings": "es/index.d.ts",
@@ -51,11 +51,11 @@
         "less": "^4.2.0"
     },
     "dependencies": {
-        "@deppon/deppon-assets": "2.5.6",
-        "@deppon/deppon-request": "2.5.6",
-        "@deppon/deppon-router": "2.5.6",
-        "@deppon/deppon-ui": "2.5.6",
-        "@deppon/deppon-utils": "2.5.6",
+        "@deppon/deppon-assets": "2.5.8",
+        "@deppon/deppon-request": "2.5.8",
+        "@deppon/deppon-router": "2.5.8",
+        "@deppon/deppon-ui": "2.5.8",
+        "@deppon/deppon-utils": "2.5.8",
         "dayjs": "^1.11.10",
         "lodash-es": "^4.17.21",
         "mitt": "^3.0.1"