From bdeaa2721bfdbec1f1a4c9bd10135f9792f7c61d Mon Sep 17 00:00:00 2001
From: claw_bot <claw@jb18cm.plus>
Date: Fri, 13 Mar 2026 03:42:25 +0000
Subject: [PATCH] =?UTF-8?q?feat:=20=E7=94=A8uview-plus=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E6=9B=BF=E6=8D=A2=E5=8E=9F=E7=94=9Finput=E5=92=8Cbutton?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

config.vue:
- 组合名称输入框替换为u-input
- 持仓列表输入框替换为u-input
- 日期选择替换为u-datetime-picker
- 创建按钮替换为u-button

detail.vue:
- 底部操作按钮替换为u-button
- 弹窗确认/取消按钮替换为u-button

strategies/edit.vue:
- 所有表单输入框替换为u-input
- 底部保存/删除按钮替换为u-button
---
 pages/config/config.vue        |  48 +++++++++++----
 pages/detail/detail.vue        |  47 +++++++++++----
 pages/strategies/edit/edit.vue | 107 ++++++++++++++++++++++++++++-----
 3 files changed, 162 insertions(+), 40 deletions(-)

diff --git a/pages/config/config.vue b/pages/config/config.vue
index 5a20a94..a4f76f0 100755
--- a/pages/config/config.vue
+++ b/pages/config/config.vue
@@ -11,8 +11,12 @@
 
       <view class="form-item">
         <text class="label">组合名称</text>
-        <input class="input-box" type="text" v-model="form.name" placeholder="给你的组合起个名字 (如: 养老定投)"
-          placeholder-class="placeholder-style" />
+        <u-input 
+          v-model="form.name" 
+          placeholder="给你的组合起个名字 (如: 养老定投)"
+          :border="false"
+          :customStyle="{ backgroundColor: '#F9FAFB', borderRadius: '20rpx', height: '96rpx', padding: '0 32rpx' }"
+        />
       </view>
 
       <view class="form-item">
@@ -62,12 +66,13 @@
           <view class="item-grid">
             <view class="grid-col relative">
               <text class="sub-label">单元名称/代码</text>
-              <input 
-                class="mini-input" 
+              <u-input 
                 v-model="item.name" 
                 placeholder="如 TMF" 
                 :disabled="selectedStrategy?.type === 'risk_parity'"
-                @input="(e) => searchStock(e.detail.value, index)"
+                :border="false"
+                :customStyle="{ backgroundColor: '#FFFFFF', borderRadius: '16rpx', height: '72rpx', padding: '0 20rpx' }"
+                @input="(e) => searchStock(e, index)"
                 @focus="() => { activeSearchIndex.value = -1; searchResults.value = []; }"
               />
               <!-- 搜索下拉列表 -->
@@ -88,22 +93,38 @@
             </view>
             <view class="grid-col">
               <text class="sub-label">买入均价</text>
-              <input class="mini-input" type="digit" v-model="item.price" placeholder="0.00" />
+              <u-input 
+                v-model="item.price" 
+                type="number"
+                placeholder="0.00" 
+                :border="false"
+                :customStyle="{ backgroundColor: '#FFFFFF', borderRadius: '16rpx', height: '72rpx', padding: '0 20rpx' }"
+              />
             </view>
             <view class="grid-col">
               <text class="sub-label">持有数量</text>
-              <input class="mini-input" type="number" v-model="item.amount" placeholder="0" />
+              <u-input 
+                v-model="item.amount" 
+                type="number"
+                placeholder="0" 
+                :border="false"
+                :customStyle="{ backgroundColor: '#FFFFFF', borderRadius: '16rpx', height: '72rpx', padding: '0 20rpx' }"
+              />
             </view>
           </view>
 
           <view class="date-row">
             <text class="sub-label">建仓日期</text>
-            <picker mode="date" :value="item.date" @change="(e) => onDateChange(e, index)">
+            <u-datetime-picker
+              v-model="item.dateValue || Date.now()"
+              mode="date"
+              @confirm="(e) => { item.date = e.value; item.dateValue = e.value; }"
+            >
               <view class="date-picker-display">
                 <text>{{ item.date || '请选择日期' }}</text>
-                <uni-icons type="calendar" size="16" color="#9CA3AF"></uni-icons>
+                <u-icon name="calendar" size="16" color="#9CA3AF"></u-icon>
               </view>
-            </picker>
+            </u-datetime-picker>
           </view>
 
         </view>
@@ -115,7 +136,12 @@
         <text class="summary-label">预计初始投入</text>
         <text class="summary-val">¥ {{ totalInvestment }}</text>
       </view>
-      <button class="submit-btn" @click="submitForm">创建组合</button>
+      <u-button 
+        type="primary" 
+        text="创建组合"
+        :customStyle="{ backgroundColor: '#064E3B', borderRadius: '24rpx', height: '96rpx', fontSize: '30rpx', fontWeight: '700' }"
+        @click="submitForm"
+      ></u-button>
     </view>
 
   </view>
diff --git a/pages/detail/detail.vue b/pages/detail/detail.vue
index b2d79a6..8712868 100755
--- a/pages/detail/detail.vue
+++ b/pages/detail/detail.vue
@@ -170,17 +170,28 @@
     </view>
 
     <view class="action-section fixed-bottom">
-      <button class="action-btn btn-delete" @click="deletePortfolio">
-        <uni-icons type="trash" size="20" color="#DC2626"></uni-icons>
-      </button>
-      <button class="action-btn btn-buy" @click="handleBuy">
-        <uni-icons type="download" size="20" color="#FFFFFF"></uni-icons>
-        <text class="btn-text">增加</text>
-      </button>
-      <button class="action-btn btn-sell" @click="handleSell">
-        <uni-icons type="upload" size="20" color="#064E3B"></uni-icons>
-        <text class="btn-text">减少</text>
-      </button>
+      <u-button 
+        type="error" 
+        :plain="true"
+        icon="trash"
+        :customStyle="{ flex: '0 0 96rpx', width: '96rpx', height: '96rpx', borderRadius: '24rpx', backgroundColor: '#FEE2E2', borderColor: '#FEE2E2' }"
+        @click="deletePortfolio"
+      ></u-button>
+      <u-button 
+        type="primary" 
+        icon="download"
+        text="增加"
+        :customStyle="{ backgroundColor: '#064E3B', borderRadius: '24rpx', height: '96rpx', fontSize: '30rpx', fontWeight: '700' }"
+        @click="handleBuy"
+      ></u-button>
+      <u-button 
+        type="primary" 
+        :plain="true"
+        icon="upload"
+        text="减少"
+        :customStyle="{ borderRadius: '24rpx', height: '96rpx', fontSize: '30rpx', fontWeight: '700', borderColor: '#064E3B', color: '#064E3B' }"
+        @click="handleSell"
+      ></u-button>
     </view>
 
     <!-- 交易表单弹窗 -->
@@ -278,8 +289,18 @@
         </view>
         
         <view class="modal-footer">
-          <button class="cancel-btn" @click="showTransactionForm = false">取消</button>
-          <button class="confirm-btn" @click="submitTransaction">确认</button>
+          <u-button 
+            type="default" 
+            text="取消"
+            :customStyle="{ borderRadius: '12rpx', height: '80rpx', fontSize: '24rpx', fontWeight: '600', backgroundColor: '#F3F4F6', color: '#6B7280' }"
+            @click="showTransactionForm = false"
+          ></u-button>
+          <u-button 
+            type="primary" 
+            text="确认"
+            :customStyle="{ backgroundColor: '#064E3B', borderRadius: '12rpx', height: '80rpx', fontSize: '24rpx', fontWeight: '600' }"
+            @click="submitTransaction"
+          ></u-button>
         </view>
       </view>
     </view>
diff --git a/pages/strategies/edit/edit.vue b/pages/strategies/edit/edit.vue
index e3b018c..835d7c8 100755
--- a/pages/strategies/edit/edit.vue
+++ b/pages/strategies/edit/edit.vue
@@ -38,12 +38,22 @@
         
         <view class="form-item">
           <text class="label">策略名称</text>
-          <input class="input-field" v-model="formData.name" placeholder="例如: 双均线趋势策略" />
+          <u-input 
+            v-model="formData.name" 
+            placeholder="例如: 双均线趋势策略"
+            :border="false"
+            :customStyle="{ backgroundColor: '#F9FAFB', borderRadius: '20rpx', height: '88rpx', padding: '0 24rpx' }"
+          />
         </view>
 
         <view class="form-item">
           <text class="label">策略描述</text>
-          <input class="input-field" v-model="formData.description" placeholder="描述策略的用途和特点" />
+          <u-input 
+            v-model="formData.description" 
+            placeholder="描述策略的用途和特点"
+            :border="false"
+            :customStyle="{ backgroundColor: '#F9FAFB', borderRadius: '20rpx', height: '88rpx', padding: '0 24rpx' }"
+          />
         </view>
 
         <view class="form-item">
@@ -58,18 +68,35 @@
 
         <view class="form-item">
           <text class="label">标签</text>
-          <input class="input-field" v-model="formData.tags" placeholder="用逗号分隔，如：趋势,均线" />
+          <u-input 
+            v-model="formData.tags" 
+            placeholder="用逗号分隔，如：趋势,均线"
+            :border="false"
+            :customStyle="{ backgroundColor: '#F9FAFB', borderRadius: '20rpx', height: '88rpx', padding: '0 24rpx' }"
+          />
         </view>
 
         <template v-if="currentType === 'ma_trend'">
           <view class="flex-row gap-3">
             <view class="form-item flex-1">
               <text class="label">短期周期</text>
-              <input class="input-field" type="number" v-model="formData.shortPeriod" placeholder="20" />
+              <u-input 
+                v-model="formData.shortPeriod" 
+                type="number"
+                placeholder="20"
+                :border="false"
+                :customStyle="{ backgroundColor: '#F9FAFB', borderRadius: '20rpx', height: '88rpx', padding: '0 24rpx' }"
+              />
             </view>
             <view class="form-item flex-1">
               <text class="label">长期周期</text>
-              <input class="input-field" type="number" v-model="formData.longPeriod" placeholder="60" />
+              <u-input 
+                v-model="formData.longPeriod" 
+                type="number"
+                placeholder="60"
+                :border="false"
+                :customStyle="{ backgroundColor: '#F9FAFB', borderRadius: '20rpx', height: '88rpx', padding: '0 24rpx' }"
+              />
             </view>
           </view>
           <view class="form-item">
@@ -89,11 +116,23 @@
         <template v-if="currentType === 'risk_parity'">
           <view class="form-item">
             <text class="label">回看周期</text>
-            <input class="input-field" type="number" v-model="formData.lookbackPeriod" placeholder="60" />
+            <u-input 
+              v-model="formData.lookbackPeriod" 
+              type="number"
+              placeholder="60"
+              :border="false"
+              :customStyle="{ backgroundColor: '#F9FAFB', borderRadius: '20rpx', height: '88rpx', padding: '0 24rpx' }"
+            />
           </view>
           <view class="form-item">
             <text class="label">再平衡阈值</text>
-            <input class="input-field" type="digit" v-model="formData.rebalanceThreshold" placeholder="0.05" />
+            <u-input 
+              v-model="formData.rebalanceThreshold" 
+              type="digit"
+              placeholder="0.05"
+              :border="false"
+              :customStyle="{ backgroundColor: '#F9FAFB', borderRadius: '20rpx', height: '88rpx', padding: '0 24rpx' }"
+            />
           </view>
           
           <view class="form-item">
@@ -107,11 +146,12 @@
                 <view class="asset-inputs">
                   <view class="asset-input relative">
                     <text class="asset-label">代码</text>
-                    <input 
-                      class="input-field" 
+                    <u-input 
                       v-model="asset.symbol" 
                       placeholder="如 AAPL"
-                      @input="(e) => searchStock(e.detail.value, index)"
+                      :border="false"
+                      :customStyle="{ backgroundColor: '#F9FAFB', borderRadius: '16rpx', height: '72rpx', padding: '0 20rpx' }"
+                      @input="(e) => searchStock(e, index)"
                     />
                     <!-- 搜索下拉列表 -->
                     <view class="search-dropdown" v-if="searchResults.length > 0 && activeAssetIndex === index">
@@ -131,7 +171,13 @@
                   </view>
                   <view class="asset-input">
                     <text class="asset-label">目标权重</text>
-                    <input class="input-field" type="digit" v-model="asset.targetWeight" placeholder="0.6" />
+                    <u-input 
+                      v-model="asset.targetWeight" 
+                      type="digit"
+                      placeholder="0.6"
+                      :border="false"
+                      :customStyle="{ backgroundColor: '#F9FAFB', borderRadius: '16rpx', height: '72rpx', padding: '0 20rpx' }"
+                    />
                   </view>
                 </view>
               </view>
@@ -150,11 +196,23 @@
         <template v-if="currentType === 'chandelier_exit'">
           <view class="form-item">
             <text class="label">ATR 周期</text>
-            <input class="input-field" type="number" v-model="formData.period" placeholder="22" />
+            <u-input 
+              v-model="formData.period" 
+              type="number"
+              placeholder="22"
+              :border="false"
+              :customStyle="{ backgroundColor: '#F9FAFB', borderRadius: '20rpx', height: '88rpx', padding: '0 24rpx' }"
+            />
           </view>
           <view class="form-item">
             <text class="label">ATR 倍数</text>
-            <input class="input-field" type="digit" v-model="formData.multiplier" placeholder="3.0" />
+            <u-input 
+              v-model="formData.multiplier" 
+              type="digit"
+              placeholder="3.0"
+              :border="false"
+              :customStyle="{ backgroundColor: '#F9FAFB', borderRadius: '20rpx', height: '88rpx', padding: '0 24rpx' }"
+            />
           </view>
           <view class="form-item">
             <text class="label">使用收盘价</text>
@@ -175,10 +233,27 @@
 
     <view class="footer-bar">
       <view class="btn-row" v-if="isEditMode">
-        <button class="delete-btn" @click="deleteStrategy">删除策略</button>
-        <button class="submit-btn" @click="submit">更新策略配置</button>
+        <u-button 
+          type="error" 
+          text="删除策略"
+          :plain="true"
+          :customStyle="{ flex: '0 0 180rpx', borderRadius: '24rpx', height: '96rpx', fontSize: '24rpx', fontWeight: '700', backgroundColor: '#FEE2E2', borderColor: '#FEE2E2', color: '#DC2626' }"
+          @click="deleteStrategy"
+        ></u-button>
+        <u-button 
+          type="primary" 
+          text="更新策略配置"
+          :customStyle="{ backgroundColor: '#064E3B', borderRadius: '24rpx', height: '96rpx', fontSize: '30rpx', fontWeight: '700' }"
+          @click="submit"
+        ></u-button>
       </view>
-      <button class="submit-btn" @click="submit" v-else>保存策略配置</button>
+      <u-button 
+        v-else
+        type="primary" 
+        text="保存策略配置"
+        :customStyle="{ backgroundColor: '#064E3B', borderRadius: '24rpx', height: '96rpx', fontSize: '30rpx', fontWeight: '700' }"
+        @click="submit"
+      ></u-button>
     </view>
 
   </view>