From e0ec5efff480f43f44c78b1e55b508f381d80843 Mon Sep 17 00:00:00 2001 From: Triumph-light <2495685883@qq.com> Date: Sat, 19 Jul 2025 23:21:36 +0800 Subject: [PATCH 1/6] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E5=AF=B9=E8=B1=A1?= =?UTF-8?q?=E9=BB=98=E8=AE=A4=E5=80=BC=E6=A0=BC=E5=BC=8F=E5=B1=95=E7=A4=BA?= =?UTF-8?q?=E6=8D=A2=E8=A1=8C=EF=BC=8C=E5=AF=BC=E8=87=B4=E8=A1=A8=E6=A0=BC?= =?UTF-8?q?=E5=B1=95=E7=A4=BA=E5=A5=87=E6=80=AA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/compiler/compile-src-code-md.ts | 21 +++++++++++++++++++ 1 file changed, 21 insertions(+) diff --git a/packages/website-build/src/compiler/compile-src-code-md.ts b/packages/website-build/src/compiler/compile-src-code-md.ts index 86f4833..61fc6cf 100644 --- a/packages/website-build/src/compiler/compile-src-code-md.ts +++ b/packages/website-build/src/compiler/compile-src-code-md.ts @@ -9,6 +9,24 @@ import { parser } from '@mpxjs/vuese-parser' import { Render } from '@mpxjs/vuese-markdown-render' import { renderOptions } from '../common/options.js' +/** + * 将字符串的对象转为可读的markdown格式 + * @param str + * @returns + */ +function convertObjectStringToMarkdownHtml(str) { + if (!str) return + return ( + '
' +
+    str
+      .trim()
+      .split('\n')
+      .map(line => line.replace(//g, '>')) // 防止HTML标签注入
+      .join('
') + + '
' + ) +} + /** * 解析 cube-ui src 文件夹下的组件,生成md文档 * @@ -44,6 +62,9 @@ const genSrcCodeMd = function (srcDir: string, component: string, fnMixins) { item.type = item.type.replace(/\n/g, '
') item.type = item.type.replace(new RegExp(optionalMark, 'g'), '?') }) + text.props?.forEach(item => { + item.default = convertObjectStringToMarkdownHtml(item.default) + }) const render = new Render(text, Object.assign({ name: component } as any, renderOptions)) From fe79d1f4278adbb89b36b5577ce08abe06d39cd8 Mon Sep 17 00:00:00 2001 From: Triumph-light <2495685883@qq.com> Date: Mon, 21 Jul 2025 22:52:45 +0800 Subject: [PATCH 2/6] =?UTF-8?q?feat:=20=E5=AE=8C=E5=96=84=E6=96=B9?= =?UTF-8?q?=E6=B3=95=EF=BC=8C=E4=BC=98=E5=8C=96=E5=B1=95=E7=A4=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../website-build/src/compiler/compile-src-code-md.ts | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/packages/website-build/src/compiler/compile-src-code-md.ts b/packages/website-build/src/compiler/compile-src-code-md.ts index 61fc6cf..5cfa889 100644 --- a/packages/website-build/src/compiler/compile-src-code-md.ts +++ b/packages/website-build/src/compiler/compile-src-code-md.ts @@ -19,9 +19,14 @@ function convertObjectStringToMarkdownHtml(str) { return ( '
' +
     str
-      .trim()
       .split('\n')
-      .map(line => line.replace(//g, '>')) // 防止HTML标签注入
+      .map((line, idx) => {
+        line = line.replace(/\s+/g, '').replace(//g, '>')
+        if (idx !== 0 && idx !== str.split('\n').length - 1) {
+          line = '  ' + line
+        }
+        return line
+      }) // 防止HTML标签注入
       .join('
') + '
' ) From 12a48c1d043f6044602f87531e26afc6a75819eb Mon Sep 17 00:00:00 2001 From: Triumph-light <2495685883@qq.com> Date: Thu, 24 Jul 2025 15:47:59 +0800 Subject: [PATCH 3/6] =?UTF-8?q?feat:=20=E6=94=AF=E6=8C=81=E5=B5=8C?= =?UTF-8?q?=E5=A5=97=E5=AF=B9=E8=B1=A1=E5=B1=95=E7=A4=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../website-build/src/compiler/compile-src-code-md.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/website-build/src/compiler/compile-src-code-md.ts b/packages/website-build/src/compiler/compile-src-code-md.ts index 5cfa889..d925c1c 100644 --- a/packages/website-build/src/compiler/compile-src-code-md.ts +++ b/packages/website-build/src/compiler/compile-src-code-md.ts @@ -14,16 +14,16 @@ import { renderOptions } from '../common/options.js' * @param str * @returns */ -function convertObjectStringToMarkdownHtml(str) { +export function convertObjectStringToMarkdownHtml(str) { if (!str) return return ( '
' +
     str
       .split('\n')
       .map((line, idx) => {
-        line = line.replace(/\s+/g, '').replace(//g, '>')
-        if (idx !== 0 && idx !== str.split('\n').length - 1) {
-          line = '  ' + line
+        // 第一行和最后一行是{},将括号的前后空白字符去除,只保留属性的
+        if (!(idx !== 0 && idx !== str.split('\n').length - 1)) {
+          line = line.replace(/\s+/g, '').replace(//g, '>')
         }
         return line
       }) // 防止HTML标签注入

From 03f3f3922f3731349fac35c9384fc685e02b3b5f Mon Sep 17 00:00:00 2001
From: Triumph-light <2495685883@qq.com>
Date: Thu, 31 Jul 2025 20:26:36 +0800
Subject: [PATCH 4/6] =?UTF-8?q?feat:=20=E6=96=B0=E5=A2=9Eupload=E7=BB=84?=
 =?UTF-8?q?=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 example/app.mpx                               |   3 +-
 example/common/config.ts                      |   3 +-
 example/pages/upload/index.mpx                |  28 ++
 .../stylus/theme/components/upload.styl       |   1 +
 .../lib/components/upload/css.styl            | 133 ++++++
 .../lib/components/upload/hooks.js            |  19 +
 .../lib/components/upload/index.mpx           | 427 +++++++++++++++++
 .../lib/components/upload/utils.js            |  16 +
 .../stylus/theme/components/upload.styl       |   1 +
 .../src/components/upload/css.styl            | 133 ++++++
 .../src/components/upload/hooks.ts            |  21 +
 .../src/components/upload/index.mpx           | 430 ++++++++++++++++++
 .../src/components/upload/utils.ts            |  38 ++
 13 files changed, 1251 insertions(+), 2 deletions(-)
 create mode 100644 example/pages/upload/index.mpx
 create mode 100644 packages/mpx-cube-ui/lib/common/stylus/theme/components/upload.styl
 create mode 100644 packages/mpx-cube-ui/lib/components/upload/css.styl
 create mode 100644 packages/mpx-cube-ui/lib/components/upload/hooks.js
 create mode 100644 packages/mpx-cube-ui/lib/components/upload/index.mpx
 create mode 100644 packages/mpx-cube-ui/lib/components/upload/utils.js
 create mode 100644 packages/mpx-cube-ui/src/common/stylus/theme/components/upload.styl
 create mode 100644 packages/mpx-cube-ui/src/components/upload/css.styl
 create mode 100644 packages/mpx-cube-ui/src/components/upload/hooks.ts
 create mode 100644 packages/mpx-cube-ui/src/components/upload/index.mpx
 create mode 100644 packages/mpx-cube-ui/src/components/upload/utils.ts

diff --git a/example/app.mpx b/example/app.mpx
index 31ac28e..3804c4d 100644
--- a/example/app.mpx
+++ b/example/app.mpx
@@ -49,7 +49,8 @@
       "./pages/switch/index",
       "./pages/loading/index",
       "./pages/input/index",
-      "./pages/action-sheet/index"
+      "./pages/action-sheet/index",
+      "./pages/upload/index"
     ]
   }
 
diff --git a/example/common/config.ts b/example/common/config.ts
index 51b4910..1bfaa57 100644
--- a/example/common/config.ts
+++ b/example/common/config.ts
@@ -61,7 +61,8 @@ export default {
           'date-picker',
           'time-picker',
           'rate',
-          'switch'
+          'switch',
+          'upload',
         ]
       },
       {
diff --git a/example/pages/upload/index.mpx b/example/pages/upload/index.mpx
new file mode 100644
index 0000000..99ea107
--- /dev/null
+++ b/example/pages/upload/index.mpx
@@ -0,0 +1,28 @@
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/packages/mpx-cube-ui/lib/common/stylus/theme/components/upload.styl b/packages/mpx-cube-ui/lib/common/stylus/theme/components/upload.styl
new file mode 100644
index 0000000..ecc515f
--- /dev/null
+++ b/packages/mpx-cube-ui/lib/common/stylus/theme/components/upload.styl
@@ -0,0 +1 @@
+$upload-background-color := #FFF;
\ No newline at end of file
diff --git a/packages/mpx-cube-ui/lib/components/upload/css.styl b/packages/mpx-cube-ui/lib/components/upload/css.styl
new file mode 100644
index 0000000..b96559d
--- /dev/null
+++ b/packages/mpx-cube-ui/lib/components/upload/css.styl
@@ -0,0 +1,133 @@
+@require "../../common/stylus/variable.styl"
+@require "../../common/stylus/theme/components/upload.styl";
+.uploader-wrapper
+  display flex
+  flex-wrap wrap
+  gap 20rpx
+.card-container
+  position relative
+.card-container .close-icon
+  display flex
+  align-items center
+  justify-content center
+  position absolute
+  top 10rpx
+  right 10rpx
+  width 24rpx
+  height 24rpx
+  cursor pointer
+.card
+  width 167rpx
+  height 167rpx
+  border-radius 16rpx
+  overflow hidden
+  position relative
+  background-color $var(upload-background-color)
+  box-sizing border-box
+  font-family PingFangSC-Regular
+  font-size 18rpx
+  color #E8C5AA
+  letter-spacing 0
+  text-align center
+  font-weight 400
+.thumb
+  width 100%
+  height 100%
+  object-fit cover
+.preview-icon
+  position absolute
+  top 0
+  right 0
+  bottom 0
+  left 0
+  display flex
+  align-items center
+  justify-content center
+  background-color rgba(0, 0, 0, 0.5)
+  color #fff
+  font-size 24rpx
+  padding 4rpx 8rpx
+  border-radius 8rpx
+  opacity 0
+  transition opacity 0.2s
+.uploading
+  position absolute
+  top 0
+  display flex
+  flex-direction column
+  align-items center
+  justify-content center
+  background-color rgba(0, 0, 0, 0.5)
+.uploading-text
+  margin-bottom 10rpx
+@keyframes spin
+  0%
+    transform rotate(0deg)
+  100%
+    transform rotate(360deg)
+.progress
+  width 30rpx
+  height 30rpx
+  margin-bottom 7rpx
+  &.loading
+    animation spin 1s linear infinite
+.progress-bar
+  height 100%
+  background-color #3b82f6
+  transition width 0.3s
+.upload-btn
+  display flex
+  flex-direction column
+  align-items center
+  justify-content center
+  border-style dashed
+  border-color #cbd5e1
+  color #666
+.plus
+  width 30rpx
+  height 30rpx
+.text
+  font-size 22rpx
+.error
+  position absolute
+  top 0
+  display flex
+  align-content center
+  justify-content center
+  flex-direction column
+.error-icon
+  font-size 30rpx
+  margin-bottom 5rpx
+.preview-mask
+  position fixed
+  top 0
+  left 0
+  right 0
+  bottom 0
+  background-color rgba(0, 0, 0, 0.9)
+  z-index 999
+  display flex
+  align-items center
+  justify-content center
+  .close-icon
+    position absolute
+    top 114rpx
+    left 32rpx
+    width 36rpx
+    height 36rpx
+  .indicator
+    position absolute
+    top 114rpx
+    left 50%
+    transform translateX(-50%)
+    color #fff
+    font-size 24rpx
+.preview-img
+  width 100%
+  height 60%
+  border-radius 12rpx
+.mpx-image
+  width 100%
+  height 100%
+  background-size contain
+  background-repeat no-repeat
\ No newline at end of file
diff --git a/packages/mpx-cube-ui/lib/components/upload/hooks.js b/packages/mpx-cube-ui/lib/components/upload/hooks.js
new file mode 100644
index 0000000..3862738
--- /dev/null
+++ b/packages/mpx-cube-ui/lib/components/upload/hooks.js
@@ -0,0 +1,19 @@
+import { onUnmounted, ref } from "@mpxjs/core";
+// 节流hooks
+export const useDebounceFn = (fn, delay) => {
+    const timer = ref();
+    onUnmounted(() => {
+        clearTimeout(timer.value);
+    });
+    return {
+        run: (...args) => {
+            if (timer.value) {
+                clearTimeout(timer.value);
+            }
+            timer.value = setTimeout(() => {
+                fn(...args);
+                timer.value = undefined;
+            }, delay);
+        }
+    };
+};
diff --git a/packages/mpx-cube-ui/lib/components/upload/index.mpx b/packages/mpx-cube-ui/lib/components/upload/index.mpx
new file mode 100644
index 0000000..345ba6e
--- /dev/null
+++ b/packages/mpx-cube-ui/lib/components/upload/index.mpx
@@ -0,0 +1,427 @@
+
+
+
+
+
diff --git a/packages/mpx-cube-ui/lib/components/upload/utils.js b/packages/mpx-cube-ui/lib/components/upload/utils.js
new file mode 100644
index 0000000..64593f5
--- /dev/null
+++ b/packages/mpx-cube-ui/lib/components/upload/utils.js
@@ -0,0 +1,16 @@
+export function getByPath(obj, path) {
+    return path.split('.').reduce((prev, curr) => prev && prev[curr], obj);
+}
+/**
+ * 对请求的返回结构做目标转化
+ * @param source
+ * @param target
+ * @returns
+ */
+export function transformRes(source, target) {
+    target = { ...target };
+    for (const key in target) {
+        target[key] = getByPath(source, target[key]);
+    }
+    return target;
+}
diff --git a/packages/mpx-cube-ui/src/common/stylus/theme/components/upload.styl b/packages/mpx-cube-ui/src/common/stylus/theme/components/upload.styl
new file mode 100644
index 0000000..ecc515f
--- /dev/null
+++ b/packages/mpx-cube-ui/src/common/stylus/theme/components/upload.styl
@@ -0,0 +1 @@
+$upload-background-color := #FFF;
\ No newline at end of file
diff --git a/packages/mpx-cube-ui/src/components/upload/css.styl b/packages/mpx-cube-ui/src/components/upload/css.styl
new file mode 100644
index 0000000..b96559d
--- /dev/null
+++ b/packages/mpx-cube-ui/src/components/upload/css.styl
@@ -0,0 +1,133 @@
+@require "../../common/stylus/variable.styl"
+@require "../../common/stylus/theme/components/upload.styl";
+.uploader-wrapper
+  display flex
+  flex-wrap wrap
+  gap 20rpx
+.card-container
+  position relative
+.card-container .close-icon
+  display flex
+  align-items center
+  justify-content center
+  position absolute
+  top 10rpx
+  right 10rpx
+  width 24rpx
+  height 24rpx
+  cursor pointer
+.card
+  width 167rpx
+  height 167rpx
+  border-radius 16rpx
+  overflow hidden
+  position relative
+  background-color $var(upload-background-color)
+  box-sizing border-box
+  font-family PingFangSC-Regular
+  font-size 18rpx
+  color #E8C5AA
+  letter-spacing 0
+  text-align center
+  font-weight 400
+.thumb
+  width 100%
+  height 100%
+  object-fit cover
+.preview-icon
+  position absolute
+  top 0
+  right 0
+  bottom 0
+  left 0
+  display flex
+  align-items center
+  justify-content center
+  background-color rgba(0, 0, 0, 0.5)
+  color #fff
+  font-size 24rpx
+  padding 4rpx 8rpx
+  border-radius 8rpx
+  opacity 0
+  transition opacity 0.2s
+.uploading
+  position absolute
+  top 0
+  display flex
+  flex-direction column
+  align-items center
+  justify-content center
+  background-color rgba(0, 0, 0, 0.5)
+.uploading-text
+  margin-bottom 10rpx
+@keyframes spin
+  0%
+    transform rotate(0deg)
+  100%
+    transform rotate(360deg)
+.progress
+  width 30rpx
+  height 30rpx
+  margin-bottom 7rpx
+  &.loading
+    animation spin 1s linear infinite
+.progress-bar
+  height 100%
+  background-color #3b82f6
+  transition width 0.3s
+.upload-btn
+  display flex
+  flex-direction column
+  align-items center
+  justify-content center
+  border-style dashed
+  border-color #cbd5e1
+  color #666
+.plus
+  width 30rpx
+  height 30rpx
+.text
+  font-size 22rpx
+.error
+  position absolute
+  top 0
+  display flex
+  align-content center
+  justify-content center
+  flex-direction column
+.error-icon
+  font-size 30rpx
+  margin-bottom 5rpx
+.preview-mask
+  position fixed
+  top 0
+  left 0
+  right 0
+  bottom 0
+  background-color rgba(0, 0, 0, 0.9)
+  z-index 999
+  display flex
+  align-items center
+  justify-content center
+  .close-icon
+    position absolute
+    top 114rpx
+    left 32rpx
+    width 36rpx
+    height 36rpx
+  .indicator
+    position absolute
+    top 114rpx
+    left 50%
+    transform translateX(-50%)
+    color #fff
+    font-size 24rpx
+.preview-img
+  width 100%
+  height 60%
+  border-radius 12rpx
+.mpx-image
+  width 100%
+  height 100%
+  background-size contain
+  background-repeat no-repeat
\ No newline at end of file
diff --git a/packages/mpx-cube-ui/src/components/upload/hooks.ts b/packages/mpx-cube-ui/src/components/upload/hooks.ts
new file mode 100644
index 0000000..045235e
--- /dev/null
+++ b/packages/mpx-cube-ui/src/components/upload/hooks.ts
@@ -0,0 +1,21 @@
+import { onUnmounted, ref } from '@mpxjs/core'
+
+// 节流hooks
+export const useDebounceFn = (fn, delay) => {
+  const timer = ref()
+
+  onUnmounted(() => {
+    clearTimeout(timer.value)
+  })
+  return {
+    run: (...args) => {
+      if (timer.value) {
+        clearTimeout(timer.value)
+      }
+      timer.value = setTimeout(() => {
+        fn(...args)
+        timer.value = undefined
+      }, delay)
+    }
+  }
+}
diff --git a/packages/mpx-cube-ui/src/components/upload/index.mpx b/packages/mpx-cube-ui/src/components/upload/index.mpx
new file mode 100644
index 0000000..d65489a
--- /dev/null
+++ b/packages/mpx-cube-ui/src/components/upload/index.mpx
@@ -0,0 +1,430 @@
+
+
+
+
+
diff --git a/packages/mpx-cube-ui/src/components/upload/utils.ts b/packages/mpx-cube-ui/src/components/upload/utils.ts
new file mode 100644
index 0000000..716c760
--- /dev/null
+++ b/packages/mpx-cube-ui/src/components/upload/utils.ts
@@ -0,0 +1,38 @@
+/**
+ * 根据 path 获取对象数据
+ */
+type Prev = [never, 0, 1, 2, 3, 4, 5]
+type Join = T extends string | number ? P extends string | number ? `${T}.${P}` : never : never
+type Paths =
+  Depth extends never ?
+    never
+    : T extends object
+      ? {
+          [K in keyof T & (string | number)]:
+            T[K] extends object
+              ? `${K}` | Join>
+              : `${K}`
+        }[keyof T & (string | number)]
+      : never
+
+export function getByPath>(obj: T, path: K) {
+  return path.split('.').reduce((prev, curr) => prev && prev[curr], obj)
+}
+
+/**
+ * 对请求的返回结构做目标转化
+ * @param source
+ * @param target
+ * @returns
+ */
+export function transformRes>>(
+  source: TSource, target: TTarget
+) {
+  target = { ...target }
+  const result = {} as Record
+  for (const key in target) {
+    const path = target[key]
+    result[key] = getByPath(source, path)
+  }
+  return result
+}

From 2ff63536e2fc9ee8035e3e6713da1ae00ea251f4 Mon Sep 17 00:00:00 2001
From: Triumph-light <2495685883@qq.com>
Date: Thu, 31 Jul 2025 20:28:28 +0800
Subject: [PATCH 5/6] =?UTF-8?q?feat:=20=E5=8F=96=E6=B6=88transformRes?=
 =?UTF-8?q?=E7=9A=84=E7=B1=BB=E5=9E=8B=E9=99=90=E5=88=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/mpx-cube-ui/src/components/upload/utils.ts | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/packages/mpx-cube-ui/src/components/upload/utils.ts b/packages/mpx-cube-ui/src/components/upload/utils.ts
index 716c760..4893e56 100644
--- a/packages/mpx-cube-ui/src/components/upload/utils.ts
+++ b/packages/mpx-cube-ui/src/components/upload/utils.ts
@@ -25,11 +25,9 @@ export function getByPath>(obj: T, path: K) {
  * @param target
  * @returns
  */
-export function transformRes>>(
-  source: TSource, target: TTarget
-) {
+export function transformRes(source, target) {
   target = { ...target }
-  const result = {} as Record
+  const result = {}
   for (const key in target) {
     const path = target[key]
     result[key] = getByPath(source, path)

From 6c477454752b6e6ab68c54737e2fcc3f25aecc0d Mon Sep 17 00:00:00 2001
From: Triumph-light <2495685883@qq.com>
Date: Thu, 31 Jul 2025 21:07:13 +0800
Subject: [PATCH 6/6] =?UTF-8?q?feat:=20=E5=AF=B9promise=E5=A4=B1=E8=B4=A5?=
 =?UTF-8?q?=E5=8A=A0=E4=B8=8Areject?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/mpx-cube-ui/src/components/upload/index.mpx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/mpx-cube-ui/src/components/upload/index.mpx b/packages/mpx-cube-ui/src/components/upload/index.mpx
index d65489a..c3a5dd2 100644
--- a/packages/mpx-cube-ui/src/components/upload/index.mpx
+++ b/packages/mpx-cube-ui/src/components/upload/index.mpx
@@ -190,6 +190,7 @@ const chooseImage = async () => {
       return await chooseImageWeb()
     default:
       console.error('Unsupported environment:', __mpx_mode__)
+      return Promise.reject(new Error('Unsupported environment'))
   }
 }
 
@@ -235,7 +236,7 @@ const postFiles = async (url, file): Promise => {
         }).then(res => res.json())
           .then(res => resolve(transformRes(res, props.transform)))
           .catch(err => {
-            throw new Error(err)
+            reject(err)
           })
       })
     }