@a2simcode/ui 0.0.175 → 0.0.177

package/docs/examples/slider-captcha/custom.vue

@@ -1,48 +1,48 @@
-<template>
-  <div class="slider-captcha-demo">
-    <div class="demo-item">
-      <p>自定义颜色样式</p>
-      <j-slider-captcha
-        v-model="isPassing1"
-        :bar-style="{ background: 'linear-gradient(to right, #667eea 0%, #764ba2 100%)' }"
-        :action-style="{ background: '#667eea' }"
-      />
-    </div>
-    <div class="demo-item">
-      <p>自定义尺寸</p>
-      <j-slider-captcha
-        v-model="isPassing2"
-        :wrapper-style="{ height: '50px', borderRadius: '25px' }"
-        :action-style="{ width: '50px', height: '50px', borderRadius: '50%' }"
-      />
-    </div>
-    <div class="demo-item">
-      <p>自定义边框样式</p>
-      <j-slider-captcha
-        v-model="isPassing3"
-        :wrapper-style="{ border: '2px dashed #409eff', borderRadius: '8px' }"
-      />
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-
-const isPassing1 = ref(false)
-const isPassing2 = ref(false)
-const isPassing3 = ref(false)
-</script>
-
-<style scoped>
-.slider-captcha-demo {
-  display: flex;
-  flex-direction: column;
-  gap: 32px;
-}
-.demo-item p {
-  margin-bottom: 12px;
-  font-size: 14px;
-  color: #666;
-}
-</style>
+<template>
+  <div class="slider-captcha-demo">
+    <div class="demo-item">
+      <p>自定义颜色样式</p>
+      <j-slider-captcha
+        v-model="isPassing1"
+        :bar-style="{ background: 'linear-gradient(to right, #667eea 0%, #764ba2 100%)' }"
+        :action-style="{ background: '#667eea' }"
+      />
+    </div>
+    <div class="demo-item">
+      <p>自定义尺寸</p>
+      <j-slider-captcha
+        v-model="isPassing2"
+        :wrapper-style="{ height: '50px', borderRadius: '25px' }"
+        :action-style="{ width: '50px', height: '50px', borderRadius: '50%' }"
+      />
+    </div>
+    <div class="demo-item">
+      <p>自定义边框样式</p>
+      <j-slider-captcha
+        v-model="isPassing3"
+        :wrapper-style="{ border: '2px dashed #409eff', borderRadius: '8px' }"
+      />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const isPassing1 = ref(false)
+const isPassing2 = ref(false)
+const isPassing3 = ref(false)
+</script>
+
+<style scoped>
+.slider-captcha-demo {
+  display: flex;
+  flex-direction: column;
+  gap: 32px;
+}
+.demo-item p {
+  margin-bottom: 12px;
+  font-size: 14px;
+  color: #666;
+}
+</style>

package/docs/examples/switch/basic.vue

@@ -1,16 +1,16 @@
-<template>
-  <div style="display: flex; flex-direction: column; gap: 12px">
-    <j-switch v-model="value1" />
-    <j-switch
-      v-model="value2"
-      style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
-    />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-
-const value1 = ref(true)
-const value2 = ref(true)
-</script>
+<template>
+  <div style="display: flex; flex-direction: column; gap: 12px">
+    <j-switch v-model="value1" />
+    <j-switch
+      v-model="value2"
+      style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const value1 = ref(true)
+const value2 = ref(true)
+</script>

package/docs/examples/switch/disabled.vue

@@ -1,13 +1,13 @@
-<template>
-  <div style="display: flex; flex-direction: column; gap: 16px">
-    <j-switch v-model="value1" disabled />
-    <j-switch v-model="value2" readonly />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-
-const value1 = ref(true)
-const value2 = ref(false)
-</script>
+<template>
+  <div style="display: flex; flex-direction: column; gap: 16px">
+    <j-switch v-model="value1" disabled />
+    <j-switch v-model="value2" readonly />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const value1 = ref(true)
+const value2 = ref(false)
+</script>

package/docs/examples/switch/loading.vue

@@ -1,13 +1,13 @@
-<template>
-  <div style="display: flex; flex-direction: column; gap: 16px">
-    <j-switch v-model="value1" loading />
-    <j-switch v-model="value2" loading />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-
-const value1 = ref(true)
-const value2 = ref(false)
-</script>
+<template>
+  <div style="display: flex; flex-direction: column; gap: 16px">
+    <j-switch v-model="value1" loading />
+    <j-switch v-model="value2" loading />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const value1 = ref(true)
+const value2 = ref(false)
+</script>

package/docs/examples/switch/size.vue

@@ -1,15 +1,15 @@
-<template>
-  <div style="display: flex; flex-direction: column; gap: 16px">
-    <j-switch v-model="value1" size="large" />
-    <j-switch v-model="value2" />
-    <j-switch v-model="value3" size="small" />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-
-const value1 = ref(true)
-const value2 = ref(true)
-const value3 = ref(true)
-</script>
+<template>
+  <div style="display: flex; flex-direction: column; gap: 16px">
+    <j-switch v-model="value1" size="large" />
+    <j-switch v-model="value2" />
+    <j-switch v-model="value3" size="small" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const value1 = ref(true)
+const value2 = ref(true)
+const value3 = ref(true)
+</script>

package/docs/examples/switch/text.vue

@@ -1,13 +1,13 @@
-<template>
-  <div style="display: flex; flex-direction: column; gap: 16px">
-    <j-switch v-model="value1" active-text="开" inactive-text="关" />
-    <j-switch v-model="value2" inline-prompt active-text="开启" inactive-text="关闭" />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-
-const value1 = ref(true)
-const value2 = ref(false)
-</script>
+<template>
+  <div style="display: flex; flex-direction: column; gap: 16px">
+    <j-switch v-model="value1" active-text="开" inactive-text="关" />
+    <j-switch v-model="value2" inline-prompt active-text="开启" inactive-text="关闭" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const value1 = ref(true)
+const value2 = ref(false)
+</script>

package/docs/examples/table/action-filter.vue

@@ -1,126 +1,126 @@
-<template>
-  <div style="position: relative; width: 100%; height: 500px">
-    <j-table
-      :columns="columns"
-      :records="records"
-      :actions="actions"
-      :action-filter="actionFilter"
-      :row-key="'id'"
-      :is-multiple="true"
-    />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-import { ElMessage } from 'element-plus'
-
-const columns = ref([
-  {
-    id: 'name',
-    config: {
-      label: '名称',
-      width: 'auto',
-      align: 'left',
-    },
-  },
-  {
-    id: 'status',
-    config: {
-      label: '状态',
-      width: 'auto',
-      align: 'center',
-    },
-  },
-  {
-    id: 'updateTime',
-    config: {
-      label: '最近更新时间',
-      width: 'auto',
-      align: 'center',
-    },
-  },
-])
-
-const records = ref([
-  {
-    id: '1',
-    name: '项目A',
-    status: '进行中',
-    updateTime: '2025-12-25 20:55:52',
-  },
-  {
-    id: '2',
-    name: '项目B',
-    status: '已完成',
-    updateTime: '2025-12-25 20:51:17',
-  },
-  {
-    id: '3',
-    name: '项目C',
-    status: '待审核',
-    updateTime: '2025-12-25 20:51:11',
-  },
-  {
-    id: '4',
-    name: '项目D',
-    status: '已归档',
-    updateTime: '2025-12-24 16:43:50',
-  },
-])
-
-const actions = ref([
-  {
-    id: 'edit',
-    label: '编辑',
-    click: (scope: Record<string, any>) => {
-      ElMessage.success(`编辑: ${scope.data.name}`)
-    },
-  },
-  {
-    id: 'delete',
-    label: '删除',
-    config: { danger: true },
-    click: (scope: Record<string, any>) => {
-      ElMessage.warning(`删除: ${scope.data.name}`)
-    },
-  },
-  {
-    id: 'approve',
-    label: '通过审核',
-    click: (scope: Record<string, any>) => {
-      ElMessage.success(`通过审核: ${scope.data.name}`)
-    },
-  },
-  {
-    id: 'preview',
-    label: '预览',
-    click: (scope: Record<string, any>) => {
-      ElMessage.info(`预览: ${scope.data.name}`)
-    },
-  },
-])
-
-const actionFilter = ({
-  action,
-  record,
-  selected,
-}: {
-  action: { id: string }
-  record: Record<string, any>
-  selected: boolean
-}) => {
-  console.log(action, selected, { disabled: !selected })
-  if (action.id === 'delete') {
-    return { display: record.status !== '已归档', disabled: !selected }
-  }
-  if (action.id === 'edit') {
-    console.log(action, selected, { disabled: !selected })
-    return { disabled: !selected }
-  }
-  if (action.id === 'approve') {
-    return { display: record.status === '待审核', disabled: !selected }
-  }
-  return { display: true }
-}
-</script>
+<template>
+  <div style="position: relative; width: 100%; height: 500px">
+    <j-table
+      :columns="columns"
+      :records="records"
+      :actions="actions"
+      :action-filter="actionFilter"
+      :row-key="'id'"
+      :is-multiple="true"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import { ElMessage } from 'element-plus'
+
+const columns = ref([
+  {
+    id: 'name',
+    config: {
+      label: '名称',
+      width: 'auto',
+      align: 'left',
+    },
+  },
+  {
+    id: 'status',
+    config: {
+      label: '状态',
+      width: 'auto',
+      align: 'center',
+    },
+  },
+  {
+    id: 'updateTime',
+    config: {
+      label: '最近更新时间',
+      width: 'auto',
+      align: 'center',
+    },
+  },
+])
+
+const records = ref([
+  {
+    id: '1',
+    name: '项目A',
+    status: '进行中',
+    updateTime: '2025-12-25 20:55:52',
+  },
+  {
+    id: '2',
+    name: '项目B',
+    status: '已完成',
+    updateTime: '2025-12-25 20:51:17',
+  },
+  {
+    id: '3',
+    name: '项目C',
+    status: '待审核',
+    updateTime: '2025-12-25 20:51:11',
+  },
+  {
+    id: '4',
+    name: '项目D',
+    status: '已归档',
+    updateTime: '2025-12-24 16:43:50',
+  },
+])
+
+const actions = ref([
+  {
+    id: 'edit',
+    label: '编辑',
+    click: (scope: Record<string, any>) => {
+      ElMessage.success(`编辑: ${scope.data.name}`)
+    },
+  },
+  {
+    id: 'delete',
+    label: '删除',
+    config: { danger: true },
+    click: (scope: Record<string, any>) => {
+      ElMessage.warning(`删除: ${scope.data.name}`)
+    },
+  },
+  {
+    id: 'approve',
+    label: '通过审核',
+    click: (scope: Record<string, any>) => {
+      ElMessage.success(`通过审核: ${scope.data.name}`)
+    },
+  },
+  {
+    id: 'preview',
+    label: '预览',
+    click: (scope: Record<string, any>) => {
+      ElMessage.info(`预览: ${scope.data.name}`)
+    },
+  },
+])
+
+const actionFilter = ({
+  action,
+  record,
+  selected,
+}: {
+  action: { id: string }
+  record: Record<string, any>
+  selected: boolean
+}) => {
+  console.log(action, selected, { disabled: !selected })
+  if (action.id === 'delete') {
+    return { display: record.status !== '已归档', disabled: !selected }
+  }
+  if (action.id === 'edit') {
+    console.log(action, selected, { disabled: !selected })
+    return { disabled: !selected }
+  }
+  if (action.id === 'approve') {
+    return { display: record.status === '待审核', disabled: !selected }
+  }
+  return { display: true }
+}
+</script>