@a2simcode/ui 0.0.55 → 0.0.57

package/docs/examples/tree/expand-on-click.vue

@@ -1,39 +1,39 @@
-<template>
-  <div>
-    <h3>点击节点不展开（默认）</h3>
-    <div style="height: 200px; margin-bottom: 20px">
-      <j-tree :list="treeList" />
-    </div>
-    <h3>点击节点展开</h3>
-    <div style="height: 200px">
-      <j-tree :list="treeList" expand-on-click-node />
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-
-const treeList = ref([
-  {
-    label: '一级 1',
-    value: '1',
-    children: [
-      {
-        label: '二级 1-1',
-        value: '1-1',
-      },
-    ],
-  },
-  {
-    label: '一级 2',
-    value: '2',
-    children: [
-      {
-        label: '二级 2-1',
-        value: '2-1',
-      },
-    ],
-  },
-])
-</script>
+<template>
+  <div>
+    <h3>点击节点不展开（默认）</h3>
+    <div style="height: 200px; margin-bottom: 20px">
+      <j-tree :list="treeList" />
+    </div>
+    <h3>点击节点展开</h3>
+    <div style="height: 200px">
+      <j-tree :list="treeList" expand-on-click-node />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const treeList = ref([
+  {
+    label: '一级 1',
+    value: '1',
+    children: [
+      {
+        label: '二级 1-1',
+        value: '1-1',
+      },
+    ],
+  },
+  {
+    label: '一级 2',
+    value: '2',
+    children: [
+      {
+        label: '二级 2-1',
+        value: '2-1',
+      },
+    ],
+  },
+])
+</script>

package/docs/examples/tree/flat-data.vue

@@ -1,20 +1,20 @@
-<template>
-  <div style="height: 400px">
-    <j-tree :list="flatList" :is-tree-data="false" />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-
-// 扁平数组数据，会自动转换为树形结构
-const flatList = ref([
-  { label: '一级 1', value: '1', pid: '' },
-  { label: '二级 1-1', value: '1-1', pid: '1' },
-  { label: '三级 1-1-1', value: '1-1-1', pid: '1-1' },
-  { label: '一级 2', value: '2', pid: '' },
-  { label: '二级 2-1', value: '2-1', pid: '2' },
-  { label: '二级 2-2', value: '2-2', pid: '2' },
-  { label: '一级 3', value: '3', pid: '' },
-])
-</script>
+<template>
+  <div style="height: 400px">
+    <j-tree :list="flatList" :is-tree-data="false" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+// 扁平数组数据，会自动转换为树形结构
+const flatList = ref([
+  { label: '一级 1', value: '1', pid: '' },
+  { label: '二级 1-1', value: '1-1', pid: '1' },
+  { label: '三级 1-1-1', value: '1-1-1', pid: '1-1' },
+  { label: '一级 2', value: '2', pid: '' },
+  { label: '二级 2-1', value: '2-1', pid: '2' },
+  { label: '二级 2-2', value: '2-2', pid: '2' },
+  { label: '一级 3', value: '3', pid: '' },
+])
+</script>

package/docs/examples/tree/icon.vue

@@ -1,40 +1,40 @@
-<template>
-  <div style="height: 400px">
-    <j-tree
-      :list="treeList"
-      default-icon="material-symbols-light:folder"
-      default-icon-color="#1890ff"
-    />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-
-const treeList = ref([
-  {
-    label: '一级 1',
-    value: '1',
-    nodeIcon: 'material-symbols-light:home',
-    nodeIconColor: '#52c41a',
-    children: [
-      {
-        label: '二级 1-1',
-        value: '1-1',
-        nodeIcon: 'material-symbols-light:settings',
-        nodeIconColor: '#ff4d4f',
-      },
-    ],
-  },
-  {
-    label: '一级 2',
-    value: '2',
-    children: [
-      {
-        label: '二级 2-1',
-        value: '2-1',
-      },
-    ],
-  },
-])
-</script>
+<template>
+  <div style="height: 400px">
+    <j-tree
+      :list="treeList"
+      default-icon="material-symbols-light:folder"
+      default-icon-color="#1890ff"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const treeList = ref([
+  {
+    label: '一级 1',
+    value: '1',
+    nodeIcon: 'material-symbols-light:home',
+    nodeIconColor: '#52c41a',
+    children: [
+      {
+        label: '二级 1-1',
+        value: '1-1',
+        nodeIcon: 'material-symbols-light:settings',
+        nodeIconColor: '#ff4d4f',
+      },
+    ],
+  },
+  {
+    label: '一级 2',
+    value: '2',
+    children: [
+      {
+        label: '二级 2-1',
+        value: '2-1',
+      },
+    ],
+  },
+])
+</script>

package/docs/examples/tree/load-data.vue

@@ -1,37 +1,37 @@
-<template>
-  <div style="height: 400px">
-    <j-tree :load-data="loadData" :after-load-data="afterLoadData" />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-
-const loadData = async () => {
-  // 模拟异步加载数据
-  return new Promise((resolve) => {
-    setTimeout(() => {
-      resolve([
-        {
-          label: '一级 1',
-          value: '1',
-          children: [
-            {
-              label: '二级 1-1',
-              value: '1-1',
-            },
-          ],
-        },
-        {
-          label: '一级 2',
-          value: '2',
-        },
-      ])
-    }, 1000)
-  })
-}
-
-const afterLoadData = (treeData: any[], list: any[]) => {
-  console.log('数据加载完成：', treeData, list)
-}
-</script>
+<template>
+  <div style="height: 400px">
+    <j-tree :load-data="loadData" :after-load-data="afterLoadData" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const loadData = async () => {
+  // 模拟异步加载数据
+  return new Promise((resolve) => {
+    setTimeout(() => {
+      resolve([
+        {
+          label: '一级 1',
+          value: '1',
+          children: [
+            {
+              label: '二级 1-1',
+              value: '1-1',
+            },
+          ],
+        },
+        {
+          label: '一级 2',
+          value: '2',
+        },
+      ])
+    }, 1000)
+  })
+}
+
+const afterLoadData = (treeData: any[], list: any[]) => {
+  console.log('数据加载完成：', treeData, list)
+}
+</script>

package/docs/examples/tree/methods.vue

@@ -1,74 +1,74 @@
-<template>
-  <div>
-    <div style="margin-bottom: 20px">
-      <j-button label="设置选中节点为 2-1" @click="handleSetValue" />
-      <j-button label="获取选中节点" style="margin-left: 10px" @click="handleGetValue" />
-      <j-button label="设置选中 ['1-1', '2-1']" style="margin-left: 10px" @click="handleSetCheck" />
-      <j-button label="获取选中节点" style="margin-left: 10px" @click="handleGetCheck" />
-      <j-button label="刷新数据" style="margin-left: 10px" @click="handleRefresh" />
-    </div>
-    <div style="height: 400px">
-      <j-tree
-        ref="treeRef"
-        :list="treeList"
-        checkable
-        :default-checked-keys="['1-1']"
-      />
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-
-const treeRef = ref()
-
-const treeList = ref([
-  {
-    label: '一级 1',
-    value: '1',
-    children: [
-      {
-        label: '二级 1-1',
-        value: '1-1',
-      },
-    ],
-  },
-  {
-    label: '一级 2',
-    value: '2',
-    children: [
-      {
-        label: '二级 2-1',
-        value: '2-1',
-      },
-      {
-        label: '二级 2-2',
-        value: '2-2',
-      },
-    ],
-  },
-])
-
-const handleSetValue = () => {
-  treeRef.value?.setValue('2-1')
-}
-
-const handleGetValue = () => {
-  const value = treeRef.value?.getValue()
-  console.log('当前选中节点：', value)
-}
-
-const handleSetCheck = () => {
-  treeRef.value?.setCheck(['1-1', '2-1'])
-}
-
-const handleGetCheck = () => {
-  const checked = treeRef.value?.getCheck()
-  console.log('选中的节点：', checked)
-}
-
-const handleRefresh = () => {
-  treeRef.value?.refreshData()
-}
-</script>
+<template>
+  <div>
+    <div style="margin-bottom: 20px">
+      <j-button label="设置选中节点为 2-1" @click="handleSetValue" />
+      <j-button label="获取选中节点" style="margin-left: 10px" @click="handleGetValue" />
+      <j-button label="设置选中 ['1-1', '2-1']" style="margin-left: 10px" @click="handleSetCheck" />
+      <j-button label="获取选中节点" style="margin-left: 10px" @click="handleGetCheck" />
+      <j-button label="刷新数据" style="margin-left: 10px" @click="handleRefresh" />
+    </div>
+    <div style="height: 400px">
+      <j-tree
+        ref="treeRef"
+        :list="treeList"
+        checkable
+        :default-checked-keys="['1-1']"
+      />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const treeRef = ref()
+
+const treeList = ref([
+  {
+    label: '一级 1',
+    value: '1',
+    children: [
+      {
+        label: '二级 1-1',
+        value: '1-1',
+      },
+    ],
+  },
+  {
+    label: '一级 2',
+    value: '2',
+    children: [
+      {
+        label: '二级 2-1',
+        value: '2-1',
+      },
+      {
+        label: '二级 2-2',
+        value: '2-2',
+      },
+    ],
+  },
+])
+
+const handleSetValue = () => {
+  treeRef.value?.setValue('2-1')
+}
+
+const handleGetValue = () => {
+  const value = treeRef.value?.getValue()
+  console.log('当前选中节点：', value)
+}
+
+const handleSetCheck = () => {
+  treeRef.value?.setCheck(['1-1', '2-1'])
+}
+
+const handleGetCheck = () => {
+  const checked = treeRef.value?.getCheck()
+  console.log('选中的节点：', checked)
+}
+
+const handleRefresh = () => {
+  treeRef.value?.refreshData()
+}
+</script>

package/docs/examples/tree/theme.vue

@@ -1,33 +1,33 @@
-<template>
-  <div>
-    <h3>默认主题</h3>
-    <div style="height: 200px; margin-bottom: 20px">
-      <j-tree :list="treeList" theme="default" />
-    </div>
-    <h3>菜单主题</h3>
-    <div style="height: 200px">
-      <j-tree :list="treeList" theme="menu" />
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-
-const treeList = ref([
-  {
-    label: '一级 1',
-    value: '1',
-    children: [
-      {
-        label: '二级 1-1',
-        value: '1-1',
-      },
-    ],
-  },
-  {
-    label: '一级 2',
-    value: '2',
-  },
-])
-</script>
+<template>
+  <div>
+    <h3>默认主题</h3>
+    <div style="height: 200px; margin-bottom: 20px">
+      <j-tree :list="treeList" theme="default" />
+    </div>
+    <h3>菜单主题</h3>
+    <div style="height: 200px">
+      <j-tree :list="treeList" theme="menu" />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const treeList = ref([
+  {
+    label: '一级 1',
+    value: '1',
+    children: [
+      {
+        label: '二级 1-1',
+        value: '1-1',
+      },
+    ],
+  },
+  {
+    label: '一级 2',
+    value: '2',
+  },
+])
+</script>

package/docs/examples/upload/accept.vue

@@ -1,31 +1,31 @@
-<template>
-  <div style="display: flex; flex-direction: column; gap: 16px">
-    <div>
-      <p style="margin-bottom: 8px">只接受 PDF 文件：</p>
-      <j-upload
-        v-model="pdfFile"
-        placeholder="上传PDF"
-        :is-not-api="true"
-        accept=".pdf"
-        :is-tip="true"
-      />
-    </div>
-    <div>
-      <p style="margin-bottom: 8px">只接受 Excel 文件：</p>
-      <j-upload
-        v-model="excelFile"
-        placeholder="上传Excel"
-        :is-not-api="true"
-        accept=".xlsx,.xls"
-        :is-tip="true"
-      />
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-
-const pdfFile = ref('')
-const excelFile = ref('')
-</script>
+<template>
+  <div style="display: flex; flex-direction: column; gap: 16px">
+    <div>
+      <p style="margin-bottom: 8px">只接受 PDF 文件：</p>
+      <j-upload
+        v-model="pdfFile"
+        placeholder="上传PDF"
+        :is-not-api="true"
+        accept=".pdf"
+        :is-tip="true"
+      />
+    </div>
+    <div>
+      <p style="margin-bottom: 8px">只接受 Excel 文件：</p>
+      <j-upload
+        v-model="excelFile"
+        placeholder="上传Excel"
+        :is-not-api="true"
+        accept=".xlsx,.xls"
+        :is-tip="true"
+      />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const pdfFile = ref('')
+const excelFile = ref('')
+</script>

package/docs/examples/upload/basic.vue

@@ -1,12 +1,12 @@
-<template>
-  <div>
-    <j-upload v-model="fileId" placeholder="点击上传" :is-not-api="true" />
-    <p v-if="fileId" style="margin-top: 12px; color: #606266">文件ID: {{ fileId }}</p>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-
-const fileId = ref('')
-</script>
+<template>
+  <div>
+    <j-upload v-model="fileId" placeholder="点击上传" :is-not-api="true" />
+    <p v-if="fileId" style="margin-top: 12px; color: #606266">文件ID: {{ fileId }}</p>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const fileId = ref('')
+</script>

package/docs/examples/upload/drag.vue

@@ -1,11 +1,11 @@
-<template>
-  <div>
-    <j-upload v-model="fileId" placeholder="拖拽上传文件" :is-not-api="true" :drag="true" />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-
-const fileId = ref('')
-</script>
+<template>
+  <div>
+    <j-upload v-model="fileId" placeholder="拖拽上传文件" :is-not-api="true" :drag="true" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const fileId = ref('')
+</script>

package/docs/examples/upload/image.vue

@@ -1,17 +1,17 @@
-<template>
-  <div>
-    <j-upload
-      v-model="fileId"
-      placeholder="上传图片"
-      :is-not-api="true"
-      :is-upload-img="true"
-      :limit="3"
-    />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-
-const fileId = ref('')
-</script>
+<template>
+  <div>
+    <j-upload
+      v-model="fileId"
+      placeholder="上传图片"
+      :is-not-api="true"
+      :is-upload-img="true"
+      :limit="3"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const fileId = ref('')
+</script>