feat:重构按钮和icon组件

2026-04-07 17:23:05 +08:00
parent 672d457a35
commit 653737c481
95 changed files with 3261 additions and 1342 deletions
@@ -0,0 +1,8 @@
+{
+    "component": true,
+    "usingComponents": {
+        "toy-button": "/toy/button/button"
+    },
+    "styleIsolation": "apply-shared",
+    "addGlobalClass": true
+}
@@ -0,0 +1,44 @@
+@import '../../style/theme.less';
+
+.preview-footer-actions {
+    position: fixed;
+    left: 0;
+    bottom: 0;
+    width: 100%;
+    padding: 0 24rpx;
+    padding-bottom: calc(24rpx + env(safe-area-inset-bottom));
+    box-sizing: border-box;
+    z-index: 60;
+
+    &__bar {
+        max-width: 686rpx;
+        margin: 0 auto;
+        background: @bg-white;
+        border-radius: 48rpx;
+        padding: 20rpx;
+        box-shadow: 0 12rpx 40rpx rgba(0, 0, 0, 0.12);
+        border: 1rpx solid #f0e7d6;
+        display: flex;
+        gap: 16rpx;
+    }
+
+    &__secondary {
+        flex: 4;
+    }
+
+    &__primary {
+        flex: 6;
+    }
+
+    &__secondary .toy-btn,
+    &__primary .toy-btn {
+        width: 100%;
+        height: 88rpx;
+        border-radius: 28rpx;
+        font-size: 30rpx;
+    }
+
+    &__primary .toy-btn--primary {
+        box-shadow: 0 4rpx 12rpx rgba(255, 215, 0, 0.3);
+    }
+}
@@ -0,0 +1,40 @@
+/**
+ * 预览页底部悬浮操作条：左为次级操作（分享，toy-button type=secondary），右为主操作（保存等，primary）。
+ */
+Component({
+    options: {
+        styleIsolation: 'apply-shared',
+        addGlobalClass: true,
+    },
+    properties: {
+        primaryText: {
+            type: String,
+            value: '保存到作品库',
+        },
+        secondaryText: {
+            type: String,
+            value: '分享',
+        },
+        disabled: {
+            type: Boolean,
+            value: false,
+        },
+        loading: {
+            type: Boolean,
+            value: false,
+        },
+        shareOpenType: {
+            type: String,
+            value: 'share',
+        },
+    },
+    methods: {
+        onPrimaryTap() {
+            if (this.data.disabled || this.data.loading) return;
+            this.triggerEvent('primary');
+        },
+        onSecondaryTap() {
+            this.triggerEvent('secondary');
+        },
+    },
+});
@@ -0,0 +1,23 @@
+<view class="preview-footer-actions">
+    <view class="preview-footer-actions__bar">
+        <toy-button
+            class="preview-footer-actions__secondary"
+            type="secondary"
+            icon="line-share"
+            icon-size="40rpx"
+            open-type="{{ shareOpenType }}"
+            bind:click="onSecondaryTap">
+            {{ secondaryText }}
+        </toy-button>
+        <toy-button
+            class="preview-footer-actions__primary"
+            type="primary"
+            icon="download"
+            icon-size="40rpx"
+            disabled="{{ disabled }}"
+            loading="{{ loading }}"
+            bind:click="onPrimaryTap">
+            {{ primaryText }}
+        </toy-button>
+    </view>
+</view>