chore: 优化演示代码

2025-06-06 16:37:18 +08:00 · 2024-01-11 01:53:32 +08:00 · 2024-01-11 01:53:32 +08:00 · 9d965a7c63
commit 9d965a7c63
parent 81552e0261
22 changed files with 77 additions and 88 deletions
--- a/package.json
+++ b/package.json
@ -83,7 +83,7 @@
    "responsive-storage": "^2.2.0",
    "sortablejs": "^1.15.1",
    "swiper": "^11.0.5",
-    "typeit": "^8.8.0",
+    "typeit": "8.7.1",
    "v-contextmenu": "3.0.0",
    "v3-infinite-loading": "^1.3.1",
    "version-rocket": "^1.7.1",
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@ -111,8 +111,8 @@ dependencies:
    specifier: ^11.0.5
    version: 11.0.5
  typeit:
-    specifier: ^8.8.0
-    version: 8.8.0
+    specifier: 8.7.1
+    version: 8.7.1
  v-contextmenu:
    specifier: 3.0.0
    version: 3.0.0(vue@3.4.7)
@ -2067,10 +2067,6 @@ packages:
    resolution: {integrity: sha512-9aEbYZ3TbYMznPdcdr3SmIrLXwC/AKZXQeCf9Pgao5CKb8CyHuEX5jzWPTkvregvhRJHcpRO6BFoGW9ycaOkYw==}
    dev: false

-  /@types/web-animations-js@2.2.16:
-    resolution: {integrity: sha512-ATELeWMFwj8eQiH0KmvsCl1V2lu/qx/CjOBmv4ADSZS5u8r4reMyjCXtxG7khqyiwH3IOMNdrON/Ugn94OUcRA==}
-    dev: false
-
  /@types/web-bluetooth@0.0.14:
    resolution: {integrity: sha512-5d2RhCard1nQUC3aHcq/gHzWYO6K0WJmAbjO7mQJgCQKtZpgXxv1rOM6O/dBDhDYYVutk1sciOgNSe+5YyfM8A==}
    dev: false
@ -8469,11 +8465,9 @@ packages:
      is-typedarray: 1.0.0
    dev: false

-  /typeit@8.8.0:
-    resolution: {integrity: sha512-GQp6OW7vxro1HN3F7UPL0C2KzkGs8bFtUgmJSeK+xNhdofI40mkWxrBT2AXQwtS5Txkg7ttwplxvWCQxnUXyrw==}
+  /typeit@8.7.1:
+    resolution: {integrity: sha512-Bx/O4NMz10NWh9FWYtVwV4XwGHF9UDJfpCZPJRtw2/oUcahFAStU8J0t19aroPfTV6s1UlS5ICoqilOqmEnh2Q==}
    requiresBuild: true
-    dependencies:
-      '@types/web-animations-js': 2.2.16
    dev: false

  /typescript@5.3.3:
--- a/src/components/ReAnimateSelector/src/index.vue
+++ b/src/components/ReAnimateSelector/src/index.vue
@ -72,6 +72,7 @@ function onMouseleave() {

 <template>
  <el-select
+    class="!w-[200px]"
    :model-value="inputValue"
    placeholder="请选择动画"
    clearable
--- a/src/components/ReIcon/src/Select.vue
+++ b/src/components/ReIcon/src/Select.vue
@ -121,7 +121,7 @@ watch(
 </script>

 <template>
-  <div class="selector w-[350px]">
+  <div class="selector w-[220px]">
    <el-input v-model="inputValue" disabled>
      <template #append>
        <el-popover
--- a/src/views/able/print/index.vue
+++ b/src/views/able/print/index.vue
@ -81,10 +81,10 @@ const tableData: User[] = [
    <template #header>
      <div class="card-header">
        <span class="font-medium">打印功能（报表、图表、图片）</span>
-        <div>
+        <div class="flex">
          <el-select
            v-model="value"
-            class="m-2"
+            class="!w-[100px] mr-2"
            placeholder="Select"
            size="small"
          >
@ -121,7 +121,7 @@ const tableData: User[] = [
          }
        }"
      >
-        <p class="font-medium pt-1">Table</p>
+        <p class="font-medium text-lg text-center">Table</p>
        <el-table
          border
          :data="tableData"
@ -135,8 +135,6 @@ const tableData: User[] = [
        </el-table>
      </el-col>

-      <el-divider />
-
      <el-col
        v-motion
        :xs="11"
@ -156,7 +154,7 @@ const tableData: User[] = [
          }
        }"
      >
-        <p class="font-medium pt-1">Echart</p>
+        <p class="font-medium text-lg text-center">Echart</p>
        <pieChart class="echart mt-[10px]" />
      </el-col>

@ -179,11 +177,11 @@ const tableData: User[] = [
          }
        }"
      >
-        <p class="font-medium pt-1">Image</p>
+        <p class="font-medium text-lg text-center">Image</p>
        <img
-          src="https://avatars.githubusercontent.com/u/44761321?v=4"
+          src="https://pure-admin-utils.netlify.app/logo.png"
          alt="avatars"
-          class="img mt-[10px] w-[250px] h-[250px] m-auto"
+          class="img mt-[10px] m-auto"
        />
      </el-col>
    </el-row>
--- a/src/views/error/403.vue
+++ b/src/views/error/403.vue
@ -24,7 +24,7 @@ const router = useRouter();
          opacity: 1,
          y: 0,
          transition: {
-            delay: 100
+            delay: 80
          }
        }"
      >
@ -41,7 +41,7 @@ const router = useRouter();
          opacity: 1,
          y: 0,
          transition: {
-            delay: 300
+            delay: 120
          }
        }"
      >
@ -58,7 +58,7 @@ const router = useRouter();
          opacity: 1,
          y: 0,
          transition: {
-            delay: 500
+            delay: 160
          }
        }"
        @click="router.push('/')"
--- a/src/views/error/404.vue
+++ b/src/views/error/404.vue
@ -24,7 +24,7 @@ const router = useRouter();
          opacity: 1,
          y: 0,
          transition: {
-            delay: 100
+            delay: 80
          }
        }"
      >
@ -41,7 +41,7 @@ const router = useRouter();
          opacity: 1,
          y: 0,
          transition: {
-            delay: 300
+            delay: 120
          }
        }"
      >
@ -58,7 +58,7 @@ const router = useRouter();
          opacity: 1,
          y: 0,
          transition: {
-            delay: 500
+            delay: 160
          }
        }"
        @click="router.push('/')"
--- a/src/views/error/500.vue
+++ b/src/views/error/500.vue
@ -24,7 +24,7 @@ const router = useRouter();
          opacity: 1,
          y: 0,
          transition: {
-            delay: 100
+            delay: 80
          }
        }"
      >
@ -41,7 +41,7 @@ const router = useRouter();
          opacity: 1,
          y: 0,
          transition: {
-            delay: 300
+            delay: 120
          }
        }"
      >
@ -58,7 +58,7 @@ const router = useRouter();
          opacity: 1,
          y: 0,
          transition: {
-            delay: 500
+            delay: 160
          }
        }"
        @click="router.push('/')"
--- a/src/views/permission/page/index.vue
+++ b/src/views/permission/page/index.vue
@ -53,7 +53,7 @@ function onChange() {
          <span>当前角色：{{ username }}</span>
        </div>
      </template>
-      <el-select v-model="username" @change="onChange">
+      <el-select v-model="username" class="!w-[160px]" @change="onChange">
        <el-option
          v-for="item in options"
          :key="item.value"
--- a/src/views/pure-table/high.vue
+++ b/src/views/pure-table/high.vue
@ -33,7 +33,7 @@ function tabClick({ index }) {

    <el-alert
      title="高级用法中所有表格都设置了 row-key ，后端需返回唯一值的字段，比如id 作用：1. 用来优化 Table
-      的渲染，尤其当字段在深层结构中；2. 防止拖拽后表格组件内部混乱（拖拽必须设置哦，坑都帮您们踩过啦 ❤️）"
+      的渲染，尤其当字段在深层结构中；2. 防止拖拽后表格组件内部混乱（拖拽必须设置）"
      type="info"
      :closable="false"
    />
--- a/src/views/pure-table/high/list.tsx
+++ b/src/views/pure-table/high/list.tsx
@ -71,7 +71,7 @@ export const list = [
  {
    key: "watermark",
    content: rendContent("watermark"),
-    title: "水印（无法删除的水印哦🤓️）",
+    title: "水印",
    component: Watermark
  },
  {
--- a/src/views/pure-table/high/table-select/multiple/index.vue
+++ b/src/views/pure-table/high/table-select/multiple/index.vue
@ -20,7 +20,7 @@ const {
  <el-select
    ref="selectRef"
    v-model="selectValue"
-    class="w-[160px]"
+    class="!w-[200px]"
    placeholder="请选择"
    clearable
    multiple
--- a/src/views/pure-table/high/table-select/radio/index.vue
+++ b/src/views/pure-table/high/table-select/radio/index.vue
@ -17,6 +17,7 @@ const {
  <el-select
    ref="selectRef"
    v-model="selectValue"
+    class="!w-[200px]"
    placeholder="请选择"
    clearable
  >
--- a/src/views/pure-table/high/watermark/columns.tsx
+++ b/src/views/pure-table/high/watermark/columns.tsx
@ -34,8 +34,8 @@ export function useColumns(waterRef: Ref) {
        font: "16px Microsoft YaHei",
        globalAlpha: 0.8,
        forever: true,
-        width: 252,
-        height: 80
+        width: 240,
+        height: 90
      });
    });
  });
--- a/src/views/pure-table/index.vue
+++ b/src/views/pure-table/index.vue
@ -20,13 +20,13 @@ function tabClick({ index }) {
        <span class="font-medium">
          平台二次封装 element-plus 的 Table ，完全兼容 Api
          并提供灵活的配置项以及完善的类型提醒，再也不用将代码都写在 template
-          里了，欢迎 Star
+          里了
          <el-link
            href="https://github.com/pure-admin/pure-admin-table"
            target="_blank"
            style="margin: 0 4px 5px; font-size: 16px"
          >
-            @pureadmin/table
+            @pureadmin/table 源码
          </el-link>
        </span>
      </div>
--- a/src/views/result/columns.tsx
+++ b/src/views/result/columns.tsx
@ -6,10 +6,10 @@ export function useColumns() {
    {
      cellRenderer: () => {
        return (
-          <span class="flex items-center -mt-6">
+          <div class="w-full">
+            <div class="flex items-center">
              <iconify-icon-offline
                icon={CloseCircleLine}
-              color="#F56C6C"
                width="18px"
                height="18px"
              />
@ -27,17 +27,11 @@ export function useColumns() {
                  height="18px"
                />
              </a>
-          </span>
-        );
-      }
-    },
-    {
-      cellRenderer: () => {
-        return (
-          <span class="flex items-center -mt-8">
+            </div>
+            <br />
+            <div class="flex items-center">
              <iconify-icon-offline
                icon={CloseCircleLine}
-              color="#F56C6C"
                width="18px"
                height="18px"
              />
@ -55,7 +49,8 @@ export function useColumns() {
                  height="18px"
                />
              </a>
-          </span>
+            </div>
+          </div>
        );
      }
    }
--- a/src/views/result/fail.vue
+++ b/src/views/result/fail.vue
@ -26,7 +26,7 @@ const { columns } = useColumns();
    <PureDescriptions
      :columns="columns"
      title="您提交的内容有如下错误："
-      class="p-6 ml-10 mr-10 bg-[#fafafa] dark:bg-[#1d1d1d]"
+      class="p-6 w-[90%] m-auto bg-[#fafafa] dark:bg-[#1d1d1d]"
    />
  </el-card>
 </template>
--- a/src/views/result/success.vue
+++ b/src/views/result/success.vue
@ -41,7 +41,7 @@ const columns = [
        </div>
      </template>
    </el-result>
-    <div class="p-6 ml-10 mr-10 bg-[#fafafa] dark:bg-[#1d1d1d]">
+    <div class="p-6 w-[90%] m-auto bg-[#fafafa] dark:bg-[#1d1d1d]">
      <PureDescriptions title="项目名称" :columns="columns" class="mb-5" />
      <el-steps :active="2">
        <el-step title="创建项目">
--- a/src/views/system/dept/index.vue
+++ b/src/views/system/dept/index.vue
@ -41,7 +41,7 @@ const {
          v-model="form.name"
          placeholder="请输入部门名称"
          clearable
-          class="!w-[200px]"
+          class="!w-[180px]"
        />
      </el-form-item>
      <el-form-item label="状态：" prop="status">
--- a/src/views/system/role/index.vue
+++ b/src/views/system/role/index.vue
@ -49,7 +49,7 @@ const {
          v-model="form.name"
          placeholder="请输入角色名称"
          clearable
-          class="!w-[200px]"
+          class="!w-[180px]"
        />
      </el-form-item>
      <el-form-item label="角色标识：" prop="code">
--- a/src/views/system/user/index.vue
+++ b/src/views/system/user/index.vue
@ -70,7 +70,7 @@ const {
            v-model="form.username"
            placeholder="请输入用户名称"
            clearable
-            class="!w-[160px]"
+            class="!w-[180px]"
          />
        </el-form-item>
        <el-form-item label="手机号码：" prop="phone">
@ -78,7 +78,7 @@ const {
            v-model="form.phone"
            placeholder="请输入手机号码"
            clearable
-            class="!w-[160px]"
+            class="!w-[180px]"
          />
        </el-form-item>
        <el-form-item label="状态：" prop="status">
@ -86,7 +86,7 @@ const {
            v-model="form.status"
            placeholder="请选择"
            clearable
-            class="!w-[160px]"
+            class="!w-[180px]"
          >
            <el-option label="已开启" value="1" />
            <el-option label="已关闭" value="0" />
--- a/src/views/tabs/index.vue
+++ b/src/views/tabs/index.vue
@ -86,7 +86,7 @@ function onCloseTags() {
    <el-divider />
    <el-tree-select
      v-model="currentValues"
-      class="w-[300px]"
+      class="!w-[300px]"
      node-key="uniqueId"
      placeholder="请选择要关闭的标签"
      clearable