@ysgroup/ui 0.1.15 → 0.1.17

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@ysgroup/ui",
-  "version": "0.1.15",
+  "version": "0.1.17",
   "type": "module",
   "main": "src/index.ts",
   "types": "src/index.ts",
   "dependencies": {
     "@element-plus/icons-vue": "^2.3.1",
-    "@ysgroup/contracts": "^0.1.1",
+    "@ysgroup/contracts": "^0.1.3",
     "@ysgroup/theme": "^0.1.0"
   },
   "peerDependencies": {

package/src/components/YsCrudTable.vue

@@ -7,6 +7,7 @@ import { FIELD_SPECS, ENUM_META } from "@ysgroup/contracts";
 import { enumLabel } from "../tokens-runtime";
 import YsFormDialog from "./YsFormDialog.vue";
 import YsRowActionMenu from "./YsRowActionMenu.vue";
+import YsTableToolbar from "./YsTableToolbar.vue";
 
 interface FieldSpec {
   key: string;
@@ -94,13 +95,7 @@ const displayColumns = computed<FieldSpec[]>(() => {
 const filtered = computed(() => {
   const kw = keyword.value.trim().toLowerCase();
   if (!kw) return props.rows;
-  return props.rows.filter((r) =>
-    displayColumns.value.some((c) =>
-      String(r[c.key] ?? "")
-        .toLowerCase()
-        .includes(kw),
-    ),
-  );
+  return props.rows.filter((r) => displayColumns.value.some((c) => display(r, c).toLowerCase().includes(kw)));
 });
 
 // 搜索词变化时重置到第一页
@@ -159,11 +154,11 @@ function onSubmit(payload: Record<string, unknown>) {
 
 <template>
   <div class="ys-crud">
-    <div class="ys-crud__toolbar">
-      <el-input v-model="keyword" placeholder="搜索" clearable style="width: 200px" />
-      <div class="ys-crud__spacer" />
-      <el-button v-if="!readonly" type="primary" @click="onCreate">{{ createLabel || "新建" }}</el-button>
-    </div>
+    <YsTableToolbar v-model:keyword="keyword">
+      <template #actions
+        ><el-button v-if="!readonly" type="primary" @click="onCreate">{{ createLabel || "新建" }}</el-button></template
+      >
+    </YsTableToolbar>
 
     <el-table :data="paged" v-loading="loading" stripe border size="small" table-layout="fixed" row-key="_id">
       <el-table-column v-for="c in displayColumns" :key="c.key" :label="c.title" :width="columnWidth(c)" show-overflow-tooltip>
@@ -184,23 +179,10 @@ function onSubmit(payload: Record<string, unknown>) {
       </el-table-column>
     </el-table>
 
-    <YsTablePagination
-      v-model:current-page="currentPage"
-      v-model:page-size="pageSize"
-      :total="filtered.length"
-    />
+    <YsTablePagination v-model:current-page="currentPage" v-model:page-size="pageSize" :total="filtered.length" />
 
     <YsFormDialog v-if="!externalEditor" v-model="dialogOpen" :table="table" :record="editing" :hidden="hiddenInForm" :saving="saving" @submit="onSubmit" />
   </div>
 </template>
 
-<style scoped>
-.ys-crud__toolbar {
-  display: flex;
-  align-items: center;
-  margin-bottom: 12px;
-}
-.ys-crud__spacer {
-  flex: 1;
-}
-</style>
+<style scoped></style>

package/src/components/YsSettingsCenterDialog.vue

@@ -129,7 +129,7 @@ defineExpose({
         </template>
         <el-empty v-else description="Root 登录密码由平台安全配置维护，不允许在设置中心修改" :image-size="72" />
       </el-tab-pane>
-      <el-tab-pane v-if="role === 'Manager' && $slots.managerActions" label="前端管理" name="manager-actions">
+      <el-tab-pane v-if="['Admin', 'Manager'].includes(role) && $slots.managerActions" label="前端管理" name="manager-actions">
         <slot name="managerActions" />
       </el-tab-pane>
     </el-tabs>

package/src/components/YsTablePagination.vue

@@ -37,4 +37,4 @@ function updatePageSize(value: number): void {
   margin-top: 12px;
   justify-content: flex-end;
 }
-</style>
+</style>

package/src/components/YsTableToolbar.vue

@@ -0,0 +1,35 @@
+<script setup lang="ts">
+defineProps<{
+  keyword: string;
+  placeholder?: string;
+}>();
+
+const emit = defineEmits<{
+  "update:keyword": [value: string];
+}>();
+</script>
+
+<template>
+  <div class="ys-table-toolbar">
+    <el-input :model-value="keyword" :placeholder="placeholder || '搜索'" clearable class="ys-table-toolbar__search" @update:model-value="emit('update:keyword', String($event))" />
+    <slot />
+    <div class="ys-table-toolbar__spacer" />
+    <slot name="actions" />
+  </div>
+</template>
+
+<style scoped>
+.ys-table-toolbar {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  margin-bottom: 12px;
+  flex-wrap: wrap;
+}
+.ys-table-toolbar__search {
+  width: 200px;
+}
+.ys-table-toolbar__spacer {
+  flex: 1;
+}
+</style>

package/src/index.ts

@@ -1,6 +1,7 @@
 /* @ysgroup/ui —— 平台组件库（基于 Element Plus 封装，令牌来自 @ysgroup/theme）。 */
 
 export { default as YsCrudTable } from "./components/YsCrudTable.vue";
+export { default as YsTableToolbar } from "./components/YsTableToolbar.vue";
 export { default as YsTablePagination } from "./components/YsTablePagination.vue";
 export { default as YsRowActionMenu } from "./components/YsRowActionMenu.vue";
 export type { YsRowAction } from "./components/YsRowActionMenu.vue";