@a2simcode/ui 0.0.54 → 0.0.56

package/docs/examples/button/size.vue

@@ -1,14 +1,14 @@
-<template>
-  <div style="display: flex; flex-direction: column; gap: 16px">
-    <div style="display: flex; gap: 8px; align-items: center">
-      <j-button size="large" type="primary" label="Large" />
-      <j-button size="default" type="primary" label="Default" />
-      <j-button size="small" type="primary" label="Small" />
-    </div>
-    <div style="display: flex; gap: 8px; align-items: center">
-      <j-button size="large" label="Large" />
-      <j-button size="default" label="Default" />
-      <j-button size="small" label="Small" />
-    </div>
-  </div>
-</template>
+<template>
+  <div style="display: flex; flex-direction: column; gap: 16px">
+    <div style="display: flex; gap: 8px; align-items: center">
+      <j-button size="large" type="primary" label="Large" />
+      <j-button size="default" type="primary" label="Default" />
+      <j-button size="small" type="primary" label="Small" />
+    </div>
+    <div style="display: flex; gap: 8px; align-items: center">
+      <j-button size="large" label="Large" />
+      <j-button size="default" label="Default" />
+      <j-button size="small" label="Small" />
+    </div>
+  </div>
+</template>

package/docs/examples/button/type.vue

@@ -1,9 +1,9 @@
-<template>
-  <div style="display: flex; gap: 8px; flex-wrap: wrap">
-    <j-button type="primary" label="Primary Button" />
-    <j-button label="Default Button" />
-    <j-button type="dashed" label="Dashed Button" />
-    <j-button type="text" label="Text Button" />
-    <j-button type="link" label="Link Button" />
-  </div>
-</template>
+<template>
+  <div style="display: flex; gap: 8px; flex-wrap: wrap">
+    <j-button type="primary" label="Primary Button" />
+    <j-button label="Default Button" />
+    <j-button type="dashed" label="Dashed Button" />
+    <j-button type="text" label="Text Button" />
+    <j-button type="link" label="Link Button" />
+  </div>
+</template>

package/docs/examples/button-select/basic.vue

@@ -1,19 +1,19 @@
-<template>
-  <div>
-    <j-button-select v-model="value" :options="options" />
-    <div style="margin-top: 12px">选中: {{ value }}</div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-
-const value = ref('')
-
-const options = [
-  { label: '新增', value: 'add', icon: 'material-symbols-light:add' },
-  { label: '导出', value: 'export', icon: 'material-symbols-light:download' },
-  { label: '导入', value: 'import', icon: 'material-symbols-light:upload' },
-  { label: '刷新', value: 'refresh', icon: 'material-symbols-light:refresh' },
-]
-</script>
+<template>
+  <div>
+    <j-button-select v-model="value" :options="options" />
+    <div style="margin-top: 12px">选中: {{ value }}</div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const value = ref('')
+
+const options = [
+  { label: '新增', value: 'add', icon: 'material-symbols-light:add' },
+  { label: '导出', value: 'export', icon: 'material-symbols-light:download' },
+  { label: '导入', value: 'import', icon: 'material-symbols-light:upload' },
+  { label: '刷新', value: 'refresh', icon: 'material-symbols-light:refresh' },
+]
+</script>

package/docs/examples/buttons/basic.vue

@@ -1,45 +1,45 @@
-<template>
-  <div>
-    <j-buttons :list="buttonList" />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-import { ElMessage } from 'element-plus'
-
-const buttonList = ref([
-  {
-    id: 'add',
-    label: '新增',
-    config: {
-      type: 'primary',
-      icon: 'material-symbols-light:add',
-    },
-    click: () => {
-      ElMessage.success('点击了新增按钮')
-    },
-  },
-  {
-    id: 'edit',
-    label: '编辑',
-    config: {
-      icon: 'material-symbols-light:edit-outline',
-    },
-    click: () => {
-      ElMessage.info('点击了编辑按钮')
-    },
-  },
-  {
-    id: 'delete',
-    label: '删除',
-    config: {
-      danger: true,
-      icon: 'material-symbols-light:delete-outline',
-    },
-    click: () => {
-      ElMessage.warning('点击了删除按钮')
-    },
-  },
-])
-</script>
+<template>
+  <div>
+    <j-buttons :list="buttonList" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import { ElMessage } from 'element-plus'
+
+const buttonList = ref([
+  {
+    id: 'add',
+    label: '新增',
+    config: {
+      type: 'primary',
+      icon: 'material-symbols-light:add',
+    },
+    click: () => {
+      ElMessage.success('点击了新增按钮')
+    },
+  },
+  {
+    id: 'edit',
+    label: '编辑',
+    config: {
+      icon: 'material-symbols-light:edit-outline',
+    },
+    click: () => {
+      ElMessage.info('点击了编辑按钮')
+    },
+  },
+  {
+    id: 'delete',
+    label: '删除',
+    config: {
+      danger: true,
+      icon: 'material-symbols-light:delete-outline',
+    },
+    click: () => {
+      ElMessage.warning('点击了删除按钮')
+    },
+  },
+])
+</script>

package/docs/examples/buttons/disabled.vue

@@ -1,36 +1,36 @@
-<template>
-  <div>
-    <j-buttons :list="buttonList" />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-
-const buttonList = ref([
-  {
-    id: 'add',
-    label: '新增',
-    config: {
-      type: 'primary',
-      icon: 'material-symbols-light:add',
-    },
-  },
-  {
-    id: 'edit',
-    label: '编辑（禁用）',
-    config: {
-      icon: 'material-symbols-light:edit-outline',
-      disabled: true,
-    },
-  },
-  {
-    id: 'delete',
-    label: '删除',
-    config: {
-      danger: true,
-      icon: 'material-symbols-light:delete-outline',
-    },
-  },
-])
-</script>
+<template>
+  <div>
+    <j-buttons :list="buttonList" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const buttonList = ref([
+  {
+    id: 'add',
+    label: '新增',
+    config: {
+      type: 'primary',
+      icon: 'material-symbols-light:add',
+    },
+  },
+  {
+    id: 'edit',
+    label: '编辑（禁用）',
+    config: {
+      icon: 'material-symbols-light:edit-outline',
+      disabled: true,
+    },
+  },
+  {
+    id: 'delete',
+    label: '删除',
+    config: {
+      danger: true,
+      icon: 'material-symbols-light:delete-outline',
+    },
+  },
+])
+</script>

package/docs/examples/buttons/dropdown.vue

@@ -1,63 +1,63 @@
-<template>
-  <div>
-    <j-buttons :list="buttonList" />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-import { ElMessage } from 'element-plus'
-
-const buttonList = ref([
-  {
-    id: 'add',
-    label: '新增',
-    config: {
-      type: 'primary',
-      icon: 'material-symbols-light:add',
-    },
-    click: () => {
-      ElMessage.success('点击了新增按钮')
-    },
-  },
-  {
-    id: 'more',
-    label: '更多操作',
-    config: {
-      icon: 'material-symbols-light:more-horiz',
-    },
-    children: [
-      {
-        id: 'export',
-        label: '导出',
-        config: {
-          icon: 'material-symbols-light:download',
-        },
-        click: () => {
-          ElMessage.info('点击了导出')
-        },
-      },
-      {
-        id: 'import',
-        label: '导入',
-        config: {
-          icon: 'material-symbols-light:upload',
-        },
-        click: () => {
-          ElMessage.info('点击了导入')
-        },
-      },
-      {
-        id: 'refresh',
-        label: '刷新',
-        config: {
-          icon: 'material-symbols-light:refresh',
-        },
-        click: () => {
-          ElMessage.info('点击了刷新')
-        },
-      },
-    ],
-  },
-])
-</script>
+<template>
+  <div>
+    <j-buttons :list="buttonList" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import { ElMessage } from 'element-plus'
+
+const buttonList = ref([
+  {
+    id: 'add',
+    label: '新增',
+    config: {
+      type: 'primary',
+      icon: 'material-symbols-light:add',
+    },
+    click: () => {
+      ElMessage.success('点击了新增按钮')
+    },
+  },
+  {
+    id: 'more',
+    label: '更多操作',
+    config: {
+      icon: 'material-symbols-light:more-horiz',
+    },
+    children: [
+      {
+        id: 'export',
+        label: '导出',
+        config: {
+          icon: 'material-symbols-light:download',
+        },
+        click: () => {
+          ElMessage.info('点击了导出')
+        },
+      },
+      {
+        id: 'import',
+        label: '导入',
+        config: {
+          icon: 'material-symbols-light:upload',
+        },
+        click: () => {
+          ElMessage.info('点击了导入')
+        },
+      },
+      {
+        id: 'refresh',
+        label: '刷新',
+        config: {
+          icon: 'material-symbols-light:refresh',
+        },
+        click: () => {
+          ElMessage.info('点击了刷新')
+        },
+      },
+    ],
+  },
+])
+</script>

package/docs/examples/buttons/group.vue

@@ -1,52 +1,52 @@
-<template>
-  <div style="display: flex; flex-direction: column; gap: 16px">
-    <j-buttons :list="buttonList" />
-    <div style="color: #666; font-size: 14px">通过设置不同的 groupId，按钮会自动分组显示</div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-import { ElMessage } from 'element-plus'
-
-const buttonList = ref([
-  {
-    id: 'add',
-    label: '新增',
-    config: {
-      type: 'primary',
-    },
-    groupId: 'group1',
-    click: () => {
-      ElMessage.success('分组1：新增')
-    },
-  },
-  {
-    id: 'edit',
-    label: '编辑',
-    groupId: 'group1',
-    click: () => {
-      ElMessage.info('分组1：编辑')
-    },
-  },
-  {
-    id: 'delete',
-    label: '删除',
-    config: {
-      danger: true,
-    },
-    groupId: 'group2',
-    click: () => {
-      ElMessage.warning('分组2：删除')
-    },
-  },
-  {
-    id: 'export',
-    label: '导出',
-    groupId: 'group2',
-    click: () => {
-      ElMessage.info('分组2：导出')
-    },
-  },
-])
-</script>
+<template>
+  <div style="display: flex; flex-direction: column; gap: 16px">
+    <j-buttons :list="buttonList" />
+    <div style="color: #666; font-size: 14px">通过设置不同的 groupId，按钮会自动分组显示</div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import { ElMessage } from 'element-plus'
+
+const buttonList = ref([
+  {
+    id: 'add',
+    label: '新增',
+    config: {
+      type: 'primary',
+    },
+    groupId: 'group1',
+    click: () => {
+      ElMessage.success('分组1：新增')
+    },
+  },
+  {
+    id: 'edit',
+    label: '编辑',
+    groupId: 'group1',
+    click: () => {
+      ElMessage.info('分组1：编辑')
+    },
+  },
+  {
+    id: 'delete',
+    label: '删除',
+    config: {
+      danger: true,
+    },
+    groupId: 'group2',
+    click: () => {
+      ElMessage.warning('分组2：删除')
+    },
+  },
+  {
+    id: 'export',
+    label: '导出',
+    groupId: 'group2',
+    click: () => {
+      ElMessage.info('分组2：导出')
+    },
+  },
+])
+</script>

package/docs/examples/buttons/link.vue

@@ -1,47 +1,47 @@
-<template>
-  <div style="display: flex; flex-direction: column; gap: 16px">
-    <div>
-      <div style="margin-bottom: 8px; color: #666">默认按钮:</div>
-      <j-buttons :list="buttonList" />
-    </div>
-    <div>
-      <div style="margin-bottom: 8px; color: #666">链接按钮:</div>
-      <j-buttons :list="buttonList" :is-link="true" />
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-import { ElMessage } from 'element-plus'
-
-const buttonList = ref([
-  {
-    id: 'add',
-    label: '新增',
-    config: {
-      type: 'primary',
-    },
-    click: () => {
-      ElMessage.success('点击了新增按钮')
-    },
-  },
-  {
-    id: 'edit',
-    label: '编辑',
-    click: () => {
-      ElMessage.info('点击了编辑按钮')
-    },
-  },
-  {
-    id: 'delete',
-    label: '删除',
-    config: {
-      danger: true,
-    },
-    click: () => {
-      ElMessage.warning('点击了删除按钮')
-    },
-  },
-])
-</script>
+<template>
+  <div style="display: flex; flex-direction: column; gap: 16px">
+    <div>
+      <div style="margin-bottom: 8px; color: #666">默认按钮:</div>
+      <j-buttons :list="buttonList" />
+    </div>
+    <div>
+      <div style="margin-bottom: 8px; color: #666">链接按钮:</div>
+      <j-buttons :list="buttonList" :is-link="true" />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import { ElMessage } from 'element-plus'
+
+const buttonList = ref([
+  {
+    id: 'add',
+    label: '新增',
+    config: {
+      type: 'primary',
+    },
+    click: () => {
+      ElMessage.success('点击了新增按钮')
+    },
+  },
+  {
+    id: 'edit',
+    label: '编辑',
+    click: () => {
+      ElMessage.info('点击了编辑按钮')
+    },
+  },
+  {
+    id: 'delete',
+    label: '删除',
+    config: {
+      danger: true,
+    },
+    click: () => {
+      ElMessage.warning('点击了删除按钮')
+    },
+  },
+])
+</script>

package/docs/examples/buttons/popup.vue

@@ -1,39 +1,39 @@
-<template>
-  <div>
-    <j-buttons :list="buttonList" />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref, h } from 'vue'
-import { ElMessage } from 'element-plus'
-
-const buttonList = ref([
-  {
-    id: 'open',
-    label: '打开弹窗',
-    config: {
-      type: 'primary',
-      icon: 'material-symbols-light:open-in-new',
-    },
-    click: ({ openLayer }: any) => {
-      openLayer({
-        title: '示例弹窗',
-        width: 600,
-        name: {
-          setup(props: any, { expose }: any) {
-            expose({
-              ok: () => {
-                ElMessage.success('点击了确定')
-                return true
-              },
-            })
-            return () =>
-              h('div', { style: 'padding: 16px' }, '这是一个通过 j-buttons 点击打开的弹窗。')
-          },
-        },
-      })
-    },
-  },
-])
-</script>
+<template>
+  <div>
+    <j-buttons :list="buttonList" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, h } from 'vue'
+import { ElMessage } from 'element-plus'
+
+const buttonList = ref([
+  {
+    id: 'open',
+    label: '打开弹窗',
+    config: {
+      type: 'primary',
+      icon: 'material-symbols-light:open-in-new',
+    },
+    click: ({ openLayer }: any) => {
+      openLayer({
+        title: '示例弹窗',
+        width: 600,
+        name: {
+          setup(props: any, { expose }: any) {
+            expose({
+              ok: () => {
+                ElMessage.success('点击了确定')
+                return true
+              },
+            })
+            return () =>
+              h('div', { style: 'padding: 16px' }, '这是一个通过 j-buttons 点击打开的弹窗。')
+          },
+        },
+      })
+    },
+  },
+])
+</script>