@a2simcode/ui 0.0.54 → 0.0.56

package/docs/examples/editor/basic.vue

@@ -1,15 +1,15 @@
-<template>
-  <div>
-    <j-editor v-model:value="content" height="300" placeholder="请输入内容..." />
-    <div style="margin-top: 20px;">
-      <h3>Content:</h3>
-      <div>{{ content }}</div>
-    </div>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import { ref } from 'vue'
-
-const content = ref('<p>Hello <b>SimCode UI</b>!</p>')
-</script>
+<template>
+  <div>
+    <j-editor v-model:value="content" height="300" placeholder="请输入内容..." />
+    <div style="margin-top: 20px;">
+      <h3>Content:</h3>
+      <div>{{ content }}</div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { ref } from 'vue'
+
+const content = ref('<p>Hello <b>SimCode UI</b>!</p>')
+</script>

package/docs/examples/form/basic.vue

@@ -1,242 +1,242 @@
-<template>
-  <div>
-    <j-form ref="formRef" :schema="schema" :config="formConfig" />
-    <div style="margin-top: 16px; padding-left: 100px">
-      <j-button type="primary" label="提交" @click="handleSubmit"></j-button>
-      <j-button style="margin-left: 8px" label="重置" @click="handleReset"></j-button>
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { ref, reactive } from 'vue'
-
-const formRef = ref()
-
-const formConfig = reactive({
-  labelWidth: 100,
-  labelPosition: 'right',
-  size: 'default',
-  gutter: 16,
-  span: 24,
-})
-
-const schema = [
-  {
-    type: 'j-input',
-    config: {
-      label: '用户名',
-      field: 'username',
-      placeholder: '请输入用户名',
-      rule: [{ required: true, message: '请输入用户名' }],
-    },
-  },
-  {
-    type: 'j-input',
-    config: {
-      label: '邮箱',
-      field: 'email',
-      placeholder: '请输入邮箱',
-      rule: [
-        { required: true, message: '请输入邮箱' },
-        { type: 'email', message: '请输入正确的邮箱格式' },
-      ],
-    },
-  },
-  {
-    type: 'j-number',
-    config: {
-      label: '年龄',
-      field: 'age',
-      placeholder: '请输入年龄',
-      min: 0,
-      max: 150,
-    },
-  },
-  {
-    type: 'j-select',
-    config: {
-      label: '选择器',
-      field: 'select',
-      placeholder: '请选择',
-      options: [
-        { label: '选项1', value: '1' },
-        { label: '选项2', value: '2' },
-      ],
-    },
-  },
-  {
-    type: 'j-radio',
-    config: {
-      label: '单选框',
-      field: 'radio',
-      options: [
-        { label: '选项1', value: '1' },
-        { label: '选项2', value: '2' },
-      ],
-    },
-  },
-  {
-    type: 'j-checkbox',
-    config: {
-      label: '多选框',
-      field: 'checkbox',
-      options: [
-        { label: '选项1', value: '1' },
-        { label: '选项2', value: '2' },
-      ],
-    },
-  },
-  {
-    type: 'j-switch',
-    config: {
-      label: '开关',
-      field: 'switch',
-    },
-  },
-  {
-    type: 'j-slider',
-    config: {
-      label: '滑块',
-      field: 'slider',
-    },
-  },
-  {
-    type: 'j-rate',
-    config: {
-      label: '评分',
-      field: 'rate',
-    },
-  },
-  {
-    type: 'j-cascader-select',
-    config: {
-      label: '级联选择',
-      field: 'cascader',
-      options: [
-        {
-          label: '指南',
-          value: 'guide',
-          children: [
-            { label: '设计原则', value: 'design' },
-            { label: '导航', value: 'navigation' },
-          ],
-        },
-      ],
-    },
-  },
-  {
-    type: 'j-input-tag',
-    config: {
-      label: '标签输入',
-      field: 'tags',
-      placeholder: '请输入标签',
-    },
-  },
-  {
-    type: 'j-input-color',
-    config: {
-      label: '颜色选择',
-      field: 'color',
-      placeholder: '请选择颜色',
-    },
-  },
-  {
-    type: 'j-autocomplete',
-    config: {
-      label: '自动补全',
-      field: 'autocomplete',
-      placeholder: '请输入内容',
-      options: [
-        { value: 'Vue', link: 'https://github.com/vuejs/vue' },
-        { value: 'React', link: 'https://github.com/facebook/react' },
-      ],
-    },
-  },
-  {
-    type: 'j-tree-select',
-    config: {
-      label: '树形选择',
-      field: 'tree',
-      placeholder: '请选择',
-      options: [
-        {
-          label: '指南',
-          value: 'guide',
-          children: [
-            { label: '设计原则', value: 'design' },
-            { label: '导航', value: 'navigation' },
-          ],
-        },
-      ],
-    }
-  },
-  {
-    type: 'j-upload',
-    config: {
-      label: '上传',
-      field: 'upload',
-      placeholder: '点击上传',
-      isNotApi: true,
-    },
-  },
-  {
-    type: 'j-code-mirror',
-    config: {
-      label: '代码编辑',
-      field: 'code',
-      height: 200,
-      style: { 'margin-bottom': '18px' },
-    },
-  },
-  {
-    type: 'j-tabs',
-    config: {
-      field: 'f_Type',
-    },
-    children: [
-      {
-        config: {
-          label: '常规',
-        },
-        children: [
-          {
-            type: 'j-input',
-            config: {
-              label: '主机',
-              field: 'f_Server',
-            },
-          },
-        ],
-      },
-      {
-        config: {
-          label: '高级',
-        },
-        children: [
-          {
-            type: 'j-input',
-            config: {
-              label: '连接串',
-              field: 'f_DbConnection',
-            },
-          },
-        ],
-      },
-    ],
-  },
-]
-
-const handleSubmit = async () => {
-  const valid = await formRef.value.validate()
-  if (valid) {
-    const formData = formRef.value.getFormData()
-    console.log('表单数据:', formData)
-    alert('提交成功！')
-  }
-}
-
-const handleReset = () => {
-  formRef.value.reset()
-}
-</script>
+<template>
+  <div>
+    <j-form ref="formRef" :schema="schema" :config="formConfig" />
+    <div style="margin-top: 16px; padding-left: 100px">
+      <j-button type="primary" label="提交" @click="handleSubmit"></j-button>
+      <j-button style="margin-left: 8px" label="重置" @click="handleReset"></j-button>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, reactive } from 'vue'
+
+const formRef = ref()
+
+const formConfig = reactive({
+  labelWidth: 100,
+  labelPosition: 'right',
+  size: 'default',
+  gutter: 16,
+  span: 24,
+})
+
+const schema = [
+  {
+    type: 'j-input',
+    config: {
+      label: '用户名',
+      field: 'username',
+      placeholder: '请输入用户名',
+      rule: [{ required: true, message: '请输入用户名' }],
+    },
+  },
+  {
+    type: 'j-input',
+    config: {
+      label: '邮箱',
+      field: 'email',
+      placeholder: '请输入邮箱',
+      rule: [
+        { required: true, message: '请输入邮箱' },
+        { type: 'email', message: '请输入正确的邮箱格式' },
+      ],
+    },
+  },
+  {
+    type: 'j-number',
+    config: {
+      label: '年龄',
+      field: 'age',
+      placeholder: '请输入年龄',
+      min: 0,
+      max: 150,
+    },
+  },
+  {
+    type: 'j-select',
+    config: {
+      label: '选择器',
+      field: 'select',
+      placeholder: '请选择',
+      options: [
+        { label: '选项1', value: '1' },
+        { label: '选项2', value: '2' },
+      ],
+    },
+  },
+  {
+    type: 'j-radio',
+    config: {
+      label: '单选框',
+      field: 'radio',
+      options: [
+        { label: '选项1', value: '1' },
+        { label: '选项2', value: '2' },
+      ],
+    },
+  },
+  {
+    type: 'j-checkbox',
+    config: {
+      label: '多选框',
+      field: 'checkbox',
+      options: [
+        { label: '选项1', value: '1' },
+        { label: '选项2', value: '2' },
+      ],
+    },
+  },
+  {
+    type: 'j-switch',
+    config: {
+      label: '开关',
+      field: 'switch',
+    },
+  },
+  {
+    type: 'j-slider',
+    config: {
+      label: '滑块',
+      field: 'slider',
+    },
+  },
+  {
+    type: 'j-rate',
+    config: {
+      label: '评分',
+      field: 'rate',
+    },
+  },
+  {
+    type: 'j-cascader-select',
+    config: {
+      label: '级联选择',
+      field: 'cascader',
+      options: [
+        {
+          label: '指南',
+          value: 'guide',
+          children: [
+            { label: '设计原则', value: 'design' },
+            { label: '导航', value: 'navigation' },
+          ],
+        },
+      ],
+    },
+  },
+  {
+    type: 'j-input-tag',
+    config: {
+      label: '标签输入',
+      field: 'tags',
+      placeholder: '请输入标签',
+    },
+  },
+  {
+    type: 'j-input-color',
+    config: {
+      label: '颜色选择',
+      field: 'color',
+      placeholder: '请选择颜色',
+    },
+  },
+  {
+    type: 'j-autocomplete',
+    config: {
+      label: '自动补全',
+      field: 'autocomplete',
+      placeholder: '请输入内容',
+      options: [
+        { value: 'Vue', link: 'https://github.com/vuejs/vue' },
+        { value: 'React', link: 'https://github.com/facebook/react' },
+      ],
+    },
+  },
+  {
+    type: 'j-tree-select',
+    config: {
+      label: '树形选择',
+      field: 'tree',
+      placeholder: '请选择',
+      options: [
+        {
+          label: '指南',
+          value: 'guide',
+          children: [
+            { label: '设计原则', value: 'design' },
+            { label: '导航', value: 'navigation' },
+          ],
+        },
+      ],
+    }
+  },
+  {
+    type: 'j-upload',
+    config: {
+      label: '上传',
+      field: 'upload',
+      placeholder: '点击上传',
+      isNotApi: true,
+    },
+  },
+  {
+    type: 'j-code-mirror',
+    config: {
+      label: '代码编辑',
+      field: 'code',
+      height: 200,
+      style: { 'margin-bottom': '18px' },
+    },
+  },
+  {
+    type: 'j-tabs',
+    config: {
+      field: 'f_Type',
+    },
+    children: [
+      {
+        config: {
+          label: '常规',
+        },
+        children: [
+          {
+            type: 'j-input',
+            config: {
+              label: '主机',
+              field: 'f_Server',
+            },
+          },
+        ],
+      },
+      {
+        config: {
+          label: '高级',
+        },
+        children: [
+          {
+            type: 'j-input',
+            config: {
+              label: '连接串',
+              field: 'f_DbConnection',
+            },
+          },
+        ],
+      },
+    ],
+  },
+]
+
+const handleSubmit = async () => {
+  const valid = await formRef.value.validate()
+  if (valid) {
+    const formData = formRef.value.getFormData()
+    console.log('表单数据:', formData)
+    alert('提交成功！')
+  }
+}
+
+const handleReset = () => {
+  formRef.value.reset()
+}
+</script>

package/docs/examples/guid/basic.vue

@@ -1,10 +1,10 @@
-<template>
-  <j-guid v-model="value" />
-  <p v-if="value" style="margin-top: 12px; color: #606266">生成的 UUID: {{ value }}</p>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-
-const value = ref('')
-</script>
+<template>
+  <j-guid v-model="value" />
+  <p v-if="value" style="margin-top: 12px; color: #606266">生成的 UUID: {{ value }}</p>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const value = ref('')
+</script>

package/docs/examples/guid/size.vue

@@ -1,13 +1,13 @@
-<template>
-  <div style="display: flex; flex-direction: column; gap: 12px">
-    <j-guid v-model="value" size="large" style="width: 300px" />
-    <j-guid v-model="value" style="width: 300px" />
-    <j-guid v-model="value" size="small" style="width: 300px" />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-
-const value = ref('')
-</script>
+<template>
+  <div style="display: flex; flex-direction: column; gap: 12px">
+    <j-guid v-model="value" size="large" style="width: 300px" />
+    <j-guid v-model="value" style="width: 300px" />
+    <j-guid v-model="value" size="small" style="width: 300px" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const value = ref('')
+</script>