@a2simcode/ui 0.0.256 → 0.0.258

package/docs/examples/button/loading.vue

@@ -1,6 +1,6 @@
-<template>
-  <div style="display: flex; gap: 8px; flex-wrap: wrap">
-    <j-button loading type="primary" label="Loading" />
-    <j-button :loading="{ delay: 500 }" type="primary" label="Delay 500ms" />
-  </div>
-</template>
+<template>
+  <div style="display: flex; gap: 8px; flex-wrap: wrap">
+    <j-button loading type="primary" label="Loading" />
+    <j-button :loading="{ delay: 500 }" type="primary" label="Delay 500ms" />
+  </div>
+</template>

package/docs/examples/button/shape.vue

@@ -1,7 +1,7 @@
-<template>
-  <div style="display: flex; gap: 8px; flex-wrap: wrap">
-    <j-button type="primary" label="Default" />
-    <j-button shape="round" type="primary" label="Round" />
-    <j-button shape="circle" type="primary" icon="mdi:search" not-label />
-  </div>
-</template>
+<template>
+  <div style="display: flex; gap: 8px; flex-wrap: wrap">
+    <j-button type="primary" label="Default" />
+    <j-button shape="round" type="primary" label="Round" />
+    <j-button shape="circle" type="primary" icon="mdi:search" not-label />
+  </div>
+</template>

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/status.vue

@@ -1,34 +1,34 @@
-<template>
-  <div style="display: flex; flex-direction: column; gap: 12px">
-    <div style="display: flex; gap: 8px; flex-wrap: wrap">
-      <j-button status="success" label="Success" />
-      <j-button status="warning" label="Warning" />
-      <j-button status="danger" label="Danger" />
-    </div>
-    <div style="display: flex; gap: 8px; flex-wrap: wrap">
-      <j-button type="primary" status="success" label="Primary Success" />
-      <j-button type="primary" status="warning" label="Primary Warning" />
-      <j-button type="primary" status="danger" label="Primary Danger" />
-    </div>
-    <div style="display: flex; gap: 8px; flex-wrap: wrap">
-      <j-button type="dashed" status="success" label="Dashed Success" />
-      <j-button type="dashed" status="warning" label="Dashed Warning" />
-      <j-button type="dashed" status="danger" label="Dashed Danger" />
-    </div>
-    <div style="display: flex; gap: 8px; flex-wrap: wrap">
-      <j-button type="text" status="success" label="Text Success" />
-      <j-button type="text" status="warning" label="Text Warning" />
-      <j-button type="text" status="danger" label="Text Danger" />
-    </div>
-    <div style="display: flex; gap: 8px; flex-wrap: wrap">
-      <j-button type="link" status="success" label="Link Success" />
-      <j-button type="link" status="warning" label="Link Warning" />
-      <j-button type="link" status="danger" label="Link Danger" />
-    </div>
-    <div style="display: flex; gap: 8px; flex-wrap: wrap">
-      <j-button type="outline" status="success" label="Outline Success" />
-      <j-button type="outline" status="warning" label="Outline Warning" />
-      <j-button type="outline" status="danger" label="Outline Danger" />
-    </div>
-  </div>
-</template>
+<template>
+  <div style="display: flex; flex-direction: column; gap: 12px">
+    <div style="display: flex; gap: 8px; flex-wrap: wrap">
+      <j-button status="success" label="Success" />
+      <j-button status="warning" label="Warning" />
+      <j-button status="danger" label="Danger" />
+    </div>
+    <div style="display: flex; gap: 8px; flex-wrap: wrap">
+      <j-button type="primary" status="success" label="Primary Success" />
+      <j-button type="primary" status="warning" label="Primary Warning" />
+      <j-button type="primary" status="danger" label="Primary Danger" />
+    </div>
+    <div style="display: flex; gap: 8px; flex-wrap: wrap">
+      <j-button type="dashed" status="success" label="Dashed Success" />
+      <j-button type="dashed" status="warning" label="Dashed Warning" />
+      <j-button type="dashed" status="danger" label="Dashed Danger" />
+    </div>
+    <div style="display: flex; gap: 8px; flex-wrap: wrap">
+      <j-button type="text" status="success" label="Text Success" />
+      <j-button type="text" status="warning" label="Text Warning" />
+      <j-button type="text" status="danger" label="Text Danger" />
+    </div>
+    <div style="display: flex; gap: 8px; flex-wrap: wrap">
+      <j-button type="link" status="success" label="Link Success" />
+      <j-button type="link" status="warning" label="Link Warning" />
+      <j-button type="link" status="danger" label="Link Danger" />
+    </div>
+    <div style="display: flex; gap: 8px; flex-wrap: wrap">
+      <j-button type="outline" status="success" label="Outline Success" />
+      <j-button type="outline" status="warning" label="Outline Warning" />
+      <j-button type="outline" status="danger" label="Outline Danger" />
+    </div>
+  </div>
+</template>

package/docs/examples/button/type.vue

@@ -1,10 +1,10 @@
-<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" />
-    <j-button type="outline" label="Outline 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" />
+    <j-button type="outline" label="Outline 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,62 +1,62 @@
-<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: {
-      status: 'danger',
-      icon: 'material-symbols-light:delete-outline',
-    },
-    click: () => {
-      ElMessage.warning('点击了删除按钮')
-    },
-  },
-  {
-    id: 'upload',
-    label: '上传',
-    config: {
-      action: 'upload',
-      type: 'primary',
-      icon: 'material-symbols-light:upload-file',
-      uploadAccept: 'image/*',
-      uploadCallback: (data: any) => {
-        console.log(data)
-        return true // 上传的网络请求返回 true 表示上传成功
-      },
-      uploadSuccess: () => {
-        console.log('上传成功')
-      },
-    },
-  },
-])
-</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: {
+      status: 'danger',
+      icon: 'material-symbols-light:delete-outline',
+    },
+    click: () => {
+      ElMessage.warning('点击了删除按钮')
+    },
+  },
+  {
+    id: 'upload',
+    label: '上传',
+    config: {
+      action: 'upload',
+      type: 'primary',
+      icon: 'material-symbols-light:upload-file',
+      uploadAccept: 'image/*',
+      uploadCallback: (data: any) => {
+        console.log(data)
+        return true // 上传的网络请求返回 true 表示上传成功
+      },
+      uploadSuccess: () => {
+        console.log('上传成功')
+      },
+    },
+  },
+])
+</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: {
-      status: 'danger',
-      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: {
+      status: 'danger',
+      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: '导出123132',
-        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: '导出123132',
+        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: {
-      status: 'danger',
-    },
-    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: {
+      status: 'danger',
+    },
+    groupId: 'group2',
+    click: () => {
+      ElMessage.warning('分组2：删除')
+    },
+  },
+  {
+    id: 'export',
+    label: '导出',
+    groupId: 'group2',
+    click: () => {
+      ElMessage.info('分组2：导出')
+    },
+  },
+])
+</script>