create-yss-spec 3.3.0 → 3.3.3

package/template/.qoder/skills/yss-ui/assets/demos/tree/basic-left/index.vue

@@ -1,124 +0,0 @@
-<template>
-  <div class="layout-demo">
-    <div ref="treeAreaRef" style="width: 280px">
-      <YTree
-        v-model:search-value="search"
-        :tree-data="data"
-        :get-node-actions="getActions"
-        :expanded-keys="expandedKeys"
-        :field-names="{ title: 'name', key: 'code', children: 'children' }"
-        :height="treeHeight"
-        @action="handleAction"
-        @expand="onExpand"
-      >
-        <template #node-prefix="{ node }">
-          <FolderOpenOutlined v-if="!isLeaf(node) && isExpanded(node)" />
-          <FolderOutlined v-else-if="!isLeaf(node)" />
-          <FileOutlined v-else />
-        </template>
-      </YTree>
-    </div>
-    <div class="right-demo">右侧区域（表格占位）</div>
-  </div>
-</template>
-<script setup lang="ts">
-import { ref } from 'vue';
-import { YTree } from '@yss-ui/components';
-import { useTreeHeight, YTREE_SEARCH_HEIGHT } from '@yss-ui/hooks';
-import { FolderOutlined, FolderOpenOutlined, FileOutlined } from '@ant-design/icons-vue';
-
-const treeAreaRef = ref<HTMLDivElement>();
-const search = ref('');
-const expandedKeys = ref<string[]>(['root']);
-
-const { treeHeight } = useTreeHeight(treeAreaRef, {
-  extraOffset: YTREE_SEARCH_HEIGHT,
-});
-
-const data = ref([
-  {
-    code: 'root',
-    name: '所有任务流',
-    children: [
-      { code: 'test', name: 'test' },
-      { code: 'a', name: '委外管理平台委外管理平台委外管理平台委外管理平台' },
-      { code: 'b0', name: '投资管理演示' },
-      { code: 'c', name: '数仓演示' },
-      { code: 'd', name: '数据质量V2' },
-      { code: 'b', name: '投资管理演示' },
-      { code: 'c1', name: '数仓演示' },
-      { code: 'd1', name: '数据质量V2' },
-      { code: 'b1', name: '投资管理演示' },
-      { code: 'c2', name: '数仓演示' },
-      { code: 'd2', name: '数据质量V2' },
-      { code: 'b2', name: '投资管理演示' },
-      { code: 'c3', name: '数仓演示' },
-      { code: 'd3', name: '数据质量V2' },
-      { code: 'b3', name: '投资管理演示' },
-      { code: 'c4', name: '数仓演示' },
-      { code: 'd4', name: '数据质量V2' },
-      { code: 'b4', name: '投资管理演示' },
-      { code: 'c5', name: '数仓演示' },
-      { code: 'd5', name: '数据质量V2' },
-      { code: 'b5', name: '投资管理演示' },
-      { code: 'c6', name: '数仓演示' },
-      { code: 'd6', name: '数据质量V2' },
-      { code: 'b6', name: '投资管理演示' },
-      { code: 'c7', name: '数仓演示' },
-      { code: 'd7', name: '数据质量V2' },
-      { code: 'b7', name: '投资管理演示' },
-      { code: 'c8', name: '数仓演示' },
-      { code: 'd8', name: '数据质量V2' },
-      { code: 'b8', name: '投资管理演示' },
-      { code: 'c9', name: '数仓演示' },
-      { code: 'd9', name: '数据质量V2' },
-      { code: 'b9', name: '投资管理演示' },
-      { code: 'c10', name: '数仓演示' },
-      { code: 'd10', name: '数据质量V2底部' },
-    ],
-  },
-]);
-
-const getActions = (_node: any) => {
-  return [
-    { key: 'new-folder', label: '新建文件夹' },
-    { key: 'rename', label: '重命名' },
-    { key: 'move', label: '移动到' },
-    { key: 'export', label: '导出' },
-    { key: 'import', label: '导入' },
-    { key: 'delete', label: '删除', danger: true },
-  ];
-};
-
-const onExpand = (keys: (string | number)[], _info: any) => {
-  expandedKeys.value = keys.map(k => String(k));
-};
-
-const handleAction = (payload: { key: string; node: any }) => {
-  console.info('action:', payload);
-};
-
-const isLeaf = (node: any): boolean => {
-  return !Array.isArray(node.children) || node.children.length === 0;
-};
-
-const isExpanded = (node: any): boolean => {
-  return expandedKeys.value.includes(String(node.key));
-};
-</script>
-
-<style scoped lang="less">
-.layout-demo {
-  display: flex;
-  gap: 16px;
-  height: 300px;
-  overflow: auto;
-}
-
-.right-demo {
-  flex: 1;
-  border: 1px dashed #e5e6eb;
-  padding: 16px;
-  background-color: var(--y-demo-placeholder-bg, rgba(0, 0, 0, 0.03));
-}
-</style>

package/template/.qoder/skills/yss-ui/assets/demos/tree/datasource-group/index.vue

@@ -1,31 +0,0 @@
-<template>
-  <div style="width: 300px">
-    <YTree :tree-data="sources" :ellipsis-tooltip="true">
-      <template #node-title="{ node, text }">
-        <span>
-          {{ text }}
-          <span v-if="node.count" style="margin-left: 6px; color: #8b5cf6">({{ node.count }})</span>
-        </span>
-      </template>
-    </YTree>
-  </div>
-</template>
-<script setup lang="ts">
-import { YTree } from '@yss-ui/components';
-const sources = [
-  {
-    key: 'all',
-    title: '所有数据来源',
-    count: 54,
-    children: [
-      { key: 'sys1', title: '系统1', count: 1, children: [{ key: 'oracle3', title: '测试Oracle3' }] },
-      { key: 'sys2', title: '系统2', count: 1, children: [{ key: 'mysql34', title: '测试Mysql34' }] },
-      { key: 'sys3', title: '系统3', count: 1 },
-      { key: 'sys4', title: '系统4', count: 1 },
-      { key: 'unassigned', title: '未分配', count: 31 },
-      { key: 'dev', title: '数据开发使用', count: 16 },
-      { key: 'crm', title: '客户关系管理系统', count: 3 },
-    ],
-  },
-];
-</script>

package/template/.qoder/skills/yss-ui/assets/demos/tree/multi-checkable/index.vue

@@ -1,86 +0,0 @@
-<template>
-  <div class="demo">
-    <div class="panel">
-      <YTree
-        v-model:checked-keys="checkedKeys"
-        :tree-data="data"
-        checkable
-        default-expand-all
-        :selectable="false"
-        block-node
-        @check="onCheck"
-      />
-    </div>
-    <div class="result">
-      <div class="result__title">已勾选 Keys：</div>
-      <div class="result__list">
-        <span v-for="k in checkedKeys" :key="k" class="tag">{{ k }}</span>
-      </div>
-    </div>
-  </div>
-</template>
-<script setup lang="ts">
-import { ref } from 'vue';
-import { YTree } from '@yss-ui/components';
-
-const checkedKeys = ref<(string | number)[]>(['1-1']);
-const data = ref([
-  {
-    key: 'root',
-    title: '多选（复选框）',
-    children: [
-      {
-        key: '1',
-        title: '分组-1',
-        children: [
-          { key: '1-1', title: '项-1-1' },
-          { key: '1-2', title: '项-1-2' },
-        ],
-      },
-      {
-        key: '2',
-        title: '分组-2',
-        children: [
-          { key: '2-1', title: '项-2-1' },
-          { key: '2-2', title: '项-2-2' },
-        ],
-      },
-    ],
-  },
-]);
-
-const onCheck = (keys: any, info: any) => {
-  // antdv 事件形态：keys 可能是数组或对象（受控/非受控差异）
-  checkedKeys.value = Array.isArray(keys) ? keys : keys.checked;
-  console.info('checked:', keys, info);
-};
-</script>
-<style scoped lang="less">
-.demo {
-  display: flex;
-  flex-direction: column;
-  gap: 12px;
-}
-.panel {
-  width: 320px;
-}
-.result__title {
-  color: var(--y-demo-text-secondary, rgba(0, 0, 0, 0.65));
-  font-size: 12px;
-}
-.result__list {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 6px;
-  margin-top: 6px;
-}
-.tag {
-  display: inline-flex;
-  align-items: center;
-  padding: 2px 6px;
-  border-radius: 4px;
-  background-color: var(--y-demo-chip-bg, rgba(0, 0, 0, 0.04));
-  border: 1px solid var(--y-demo-chip-border, rgba(0, 0, 0, 0.08));
-  font-size: 12px;
-}
-</style>

package/template/.qoder/skills/yss-ui/assets/demos/tree/multiple-select/index.vue

@@ -1,76 +0,0 @@
-<template>
-  <div class="demo">
-    <YTree
-      v-model:selected-keys="selectedKeys"
-      :tree-data="data"
-      :multiple="true"
-      default-expand-all
-      block-node
-      @select="onSelect"
-    />
-    <div class="tips">按住 Cmd/Ctrl 可多选节点</div>
-    <div class="result">
-      <span v-for="k in selectedKeys" :key="k" class="tag">{{ k }}</span>
-    </div>
-  </div>
-</template>
-<script setup lang="ts">
-import { ref } from 'vue';
-import { YTree } from '@yss-ui/components';
-
-const selectedKeys = ref<(string | number)[]>(['1-1']);
-const data = ref([
-  {
-    key: 'root',
-    title: '多选（高亮选中）',
-    children: [
-      {
-        key: '1',
-        title: '分组-1',
-        children: [
-          { key: '1-1', title: '项-1-1' },
-          { key: '1-2', title: '项-1-2' },
-        ],
-      },
-      {
-        key: '2',
-        title: '分组-2',
-        children: [
-          { key: '2-1', title: '项-2-1' },
-          { key: '2-2', title: '项-2-2' },
-        ],
-      },
-    ],
-  },
-]);
-
-const onSelect = (keys: any, info: any) => {
-  selectedKeys.value = Array.isArray(keys) ? keys : keys.selected;
-  console.info('selected:', keys, info);
-};
-</script>
-<style scoped lang="less">
-.demo {
-  width: 320px;
-}
-.tips {
-  margin-top: 8px;
-  color: var(--y-demo-text-secondary, rgba(0, 0, 0, 0.65));
-  font-size: 12px;
-}
-.result {
-  margin-top: 6px;
-  display: flex;
-  flex-wrap: wrap;
-  gap: 6px;
-}
-.tag {
-  display: inline-flex;
-  align-items: center;
-  padding: 2px 6px;
-  border-radius: 4px;
-  background-color: var(--y-demo-chip-bg, rgba(0, 0, 0, 0.04));
-  border: 1px solid var(--y-demo-chip-border, rgba(0, 0, 0, 0.08));
-  font-size: 12px;
-}
-</style>

package/template/.qoder/skills/yss-ui/assets/demos/tree/resource-list/index.vue

@@ -1,41 +0,0 @@
-<template>
-  <div style="width: 280px">
-    <YTree :tree-data="resources" block-node>
-      <template #node-title="{ node, text }">
-        <span :style="{ color: node.color || 'inherit' }">{{ text }}</span>
-      </template>
-    </YTree>
-  </div>
-</template>
-<script setup lang="ts">
-import { YTree } from '@yss-ui/components';
-const resources = [
-  {
-    key: 'all',
-    title: '全部',
-    color: '#001a7d',
-    children: [
-      {
-        key: 'srv',
-        title: '服务资源',
-        color: '#1d39c4',
-        children: [
-          { key: 'core', title: '核心应用' },
-          { key: 'eureka', title: 'Eureka' },
-        ],
-      },
-      {
-        key: 'sys',
-        title: '系统资源',
-        color: '#595959',
-        children: [
-          { key: 'db', title: '数据源' },
-          { key: 'redis', title: 'Redis' },
-          { key: 'tomcat', title: 'Tomcat', color: '#3371ff' },
-        ],
-      },
-      { key: 'biz', title: '业务资源', color: '#8c8c8c' },
-    ],
-  },
-];
-</script>

package/template/.qoder/skills/yss-ui/assets/demos/tree/search-toolbar/index.vue

@@ -1,156 +0,0 @@
-<template>
-  <div class="layout-demo">
-    <div style="width: 280px">
-      <YTree
-        v-model:search-value="search"
-        :tree-data="data"
-        :get-node-actions="getActions"
-        :expanded-keys="expandedKeys"
-        @action="handleAction"
-        @expand="onExpand"
-      >
-        <template #search>
-          <div class="toolbar">
-            <AInput v-model:value="search" allow-clear placeholder="请输入关键词" size="small" class="toolbar__input" />
-            <div class="toolbar__actions">
-              <span class="toolbar-icon" title="刷新" @click="reloadTree">
-                <ReloadOutlined />
-              </span>
-              <span class="toolbar-icon" title="新增文件夹" @click="createFile">
-                <FolderAddOutlined />
-              </span>
-            </div>
-          </div>
-        </template>
-        <template #node-prefix="{ node }">
-          <FolderOpenOutlined v-if="!isLeaf(node) && isExpanded(node)" />
-          <FolderOutlined v-else-if="!isLeaf(node)" />
-          <FileOutlined v-else />
-        </template>
-      </YTree>
-    </div>
-    <div class="right-demo">右侧区域（表格占位）</div>
-  </div>
-</template>
-<script setup lang="ts">
-import { ref } from 'vue';
-import { YTree } from '@yss-ui/components';
-import { Input as AInput } from 'ant-design-vue';
-import {
-  FolderOutlined,
-  FolderOpenOutlined,
-  FileOutlined,
-  ReloadOutlined,
-  FolderAddOutlined,
-} from '@ant-design/icons-vue';
-
-const search = ref('');
-const expandedKeys = ref<string[]>(['root']);
-
-const data = ref([
-  {
-    key: 'root',
-    title: '所有任务流',
-    children: [
-      { key: 'test', title: 'test' },
-      { key: 'a', title: '委外管理平台委外管理平台委外管理平台委外管理平台' },
-      { key: 'b', title: '投资管理演示' },
-      { key: 'c', title: '数仓演示' },
-      { key: 'd', title: '数据质量V2' },
-    ],
-  },
-]);
-
-const getActions = (_node: any) => {
-  return [
-    { key: 'new-folder', label: '新建文件夹' },
-    { key: 'rename', label: '重命名' },
-    { key: 'move', label: '移动到' },
-    { key: 'export', label: '导出' },
-    { key: 'import', label: '导入' },
-    { key: 'delete', label: '删除', danger: true },
-  ];
-};
-
-function onExpand(keys: (string | number)[], _info: any) {
-  expandedKeys.value = keys.map(k => String(k));
-}
-
-const handleAction = (payload: { key: string; node: any }) => {
-  console.info('action:', payload);
-};
-
-const reloadTree = () => {
-  expandedKeys.value = ['root'];
-  data.value = [...data.value];
-};
-
-const createFile = () => {
-  const root = data.value[0];
-  const id = `new_${Date.now()}`;
-  (root.children = root.children || []).push({ key: id, title: `新文件_${id.slice(-4)}` });
-  data.value = [...data.value];
-};
-
-const isLeaf = (node: any): boolean => {
-  return !Array.isArray(node.children) || node.children.length === 0;
-};
-
-const isExpanded = (node: any): boolean => {
-  return expandedKeys.value.includes(String(node.key));
-};
-</script>
-<style scoped lang="less">
-.layout-demo {
-  display: flex;
-  gap: 16px;
-}
-
-.right-demo {
-  flex: 1;
-  border: 1px dashed #e5e6eb;
-  padding: 16px;
-  background-color: var(--y-demo-placeholder-bg, rgba(0, 0, 0, 0.03));
-}
-.toolbar {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  width: 100%;
-}
-
-.toolbar__input {
-  flex: 1;
-  min-width: 0;
-}
-
-.toolbar__actions {
-  margin-left: auto;
-  display: inline-flex;
-  align-items: center;
-  gap: 4px;
-}
-
-.toolbar-icon {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: 24px;
-  height: 24px;
-  border-radius: 6px;
-  cursor: pointer;
-  color: var(--y-tree-toolbar-icon, rgb(0 0 0 / 65%));
-  transition:
-    background-color 0.2s ease,
-    color 0.2s ease;
-}
-
-.toolbar-icon:hover {
-  background-color: var(--y-tree-toolbar-hover-bg, rgb(0 0 0 / 6%));
-  color: var(--y-tree-toolbar-icon-hover, rgb(0 0 0 / 85%));
-}
-
-.toolbar-icon:active {
-  background-color: var(--y-tree-toolbar-active-bg, rgb(0 0 0 / 10%));
-}
-</style>

package/template/.qoder/skills/yss-ui/assets/demos/tree/slot-icon/index.vue

@@ -1,36 +0,0 @@
-<template>
-  <div style="width: 320px">
-    <YTree :tree-data="data" default-expand-all :show-icon="true" block-node>
-      <!-- 直传 antdv 的 #icon 插槽（组件已完整透传） -->
-      <template #icon="{ data }">
-        <template v-if="Array.isArray(data?.children) && data.children.length">
-          <FolderOutlined />
-        </template>
-        <template v-else>
-          <FileOutlined />
-        </template>
-      </template>
-    </YTree>
-  </div>
-</template>
-<script setup lang="ts">
-import { YTree } from '@yss-ui/components';
-import { FolderOutlined, FileOutlined } from '@ant-design/icons-vue';
-
-const data = [
-  {
-    key: 'root',
-    title: '显示图标（icon 插槽）',
-    children: [
-      { key: '1', title: '文件-1' },
-      { key: '2', title: '文件-2' },
-      {
-        key: '3',
-        title: '目录',
-        children: [{ key: '3-1', title: '文件-3-1' }],
-      },
-    ],
-  },
-];
-</script>
-<style scoped lang="less"></style>

package/template/.qoder/skills/yss-ui/assets/demos/tree/slot-switcher-icon/index.vue

@@ -1,34 +0,0 @@
-<template>
-  <div style="width: 320px">
-    <YTree :tree-data="data" default-expand-all block-node>
-      <!-- 直传 antdv 的 #switcherIcon 插槽（组件已完整透传） -->
-      <template #switcherIcon="{ expanded }">
-        <span style="display: inline-flex; align-items: center">
-          <CaretDownOutlined v-if="expanded" />
-          <CaretRightOutlined v-else />
-        </span>
-      </template>
-    </YTree>
-  </div>
-</template>
-<script setup lang="ts">
-import { YTree } from '@yss-ui/components';
-import { CaretDownOutlined, CaretRightOutlined } from '@ant-design/icons-vue';
-
-const data = [
-  {
-    key: 'root',
-    title: '自定义展开/收起图标',
-    children: [
-      { key: '1', title: '子节点-1' },
-      { key: '2', title: '子节点-2' },
-      {
-        key: '3',
-        title: '子节点-3',
-        children: [{ key: '3-1', title: '子节点-3-1' }],
-      },
-    ],
-  },
-];
-</script>
-<style scoped lang="less"></style>

package/template/.qoder/skills/yss-ui/assets/docs/components/button.md

@@ -1,79 +0,0 @@
----
-title: Button 按钮
-description: 基于 Ant Design Vue Button 封装的企业级按钮组件
-toc: content
----
-
-# Button 按钮
-
-基于 Ant Design Vue `Button` 的企业级封装，统一主题与权限能力，提供一致的 API 与用法体验。
-
-## 何时使用
-
-- 标记并触发一个动作（或一组动作）。
-- 需要统一主题色和交互规范。
-- 需要简化权限控制（隐藏/禁用）。
-
-## 代码演示
-
-### 尺寸与块级
-
-<code src="./demos/button/size.vue"></code>
-
-### 加载/禁用/幽灵/危险
-
-<code src="./demos/button/states.vue"></code>
-
-### 权限按钮（localStorage）
-
-统一用 `YButton` 传入 `permissionCode` 即可：
-
-<code src="./demos/button/permission.vue"></code>
-
-<code src="./demos/button/auth-basic.vue"></code>
-
-### 权限下拉（localStorage）
-
-<code src="./demos/button/auth-dropdown.vue"></code>
-
-## API
-
-### YButton Props
-
-| 属性 | 类型 | 默认值 | 说明 |
-| --- | --- | --- | --- |
-| theme | `'primary' \| 'success' \| 'warning' \| 'danger'` | `'primary'` | 主题类名扩展，便于统一定制样式（不会改变 AntD 原始外观，需结合 CSS 变量使用）。 |
-| type | `'default' \| 'primary' \| 'dashed' \| 'link' \| 'text'` | `'default'` | 同 AntD Button。 |
-| size | `'small' \| 'middle' \| 'large'` | `'middle'` | 同 AntD Button。 |
-| loading | `boolean \| { delay?: number }` | `false` | 同 AntD Button，支持延迟。 |
-| disabled | `boolean` | `false` | 同 AntD Button。 |
-| danger | `boolean` | `false` | 同 AntD Button。 |
-| ghost | `boolean` | `false` | 同 AntD Button。 |
-| shape | `'circle' \| 'round'` | `-` | 同 AntD Button。 |
-| block | `boolean` | `false` | 同 AntD Button。 |
-| htmlType | `'button' \| 'submit' \| 'reset'` | `'button'` | 同 AntD Button。 |
-| href | `string` | `-` | 透传给 AntD，用作外链（渲染为 `<a>`）。 |
-| target | `string` | `-` | 透传给 AntD，配合 `href` 使用。 |
-| permissionCode | `string` | `-` | 按钮权限码；传入则启用权限逻辑。 |
-| fallback | `'hide' \| 'disable'` | `'hide'` | 无权限时策略：隐藏或禁用。 |
-| modifiers | `Array<'stop' \| 'prevent'>` | `[]` | 点击修饰：阻止冒泡/默认。 |
-
-### YButton Events
-
-| 事件名 | 回调参数 | 说明 |
-| --- | --- | --- |
-| click | `(e: MouseEvent)` | 点击事件（当 `disabled/loading` 时不会触发）。 |
-
-### YButton Slots
-
-| 插槽名 | 说明 |
-| --- | --- |
-| default | 按钮内容。 |
-| icon | 图标插槽（已转发至 AntD `#icon`）。 |
-
-### 与 Ant Design Vue 的对齐清单
-
-- Props：已对齐 AntD Button 常用属性，并新增 `theme`。非声明式属性通过 `$attrs` 透传。
-- Slots：支持默认插槽与 `#icon` 插槽（向下转发至 AntD）。
-- Events：对齐 AntD 的 `click` 行为；`disabled/loading` 下不触发。
-- 跳转能力：支持 `href/target` 透传，渲染为链接按钮。