refactor(页面): 优化页面生命周期和组件逻辑

重构页面生命周期钩子,统一使用uni-app的onShow替代vue的onShow
移除重复请求检查逻辑,简化数据获取函数
在配置页面自动填充策略参数并禁用相关输入
移除不必要的添加/删除股票行功能
This commit is contained in:
niannian zheng 2026-03-02 19:16:14 +08:00
parent 43280fa447
commit 4ea7c5c2d0
3 changed files with 50 additions and 52 deletions

View File

@ -32,17 +32,13 @@
</view>
<view class="section-card">
<view class="card-header justify-between">
<view class="card-header">
<view class="flex-row items-center gap-2">
<view class="header-icon bg-blue-100">
<uni-icons type="wallet" size="18" color="#1D4ED8"></uni-icons>
</view>
<text class="header-title">初始化记录</text>
</view>
<view class="add-btn" @click="addStockRow">
<uni-icons type="plus" size="14" color="#064E3B"></uni-icons>
<text class="add-text">添加单元</text>
</view>
</view>
<view class="stock-list">
@ -50,14 +46,12 @@
<view class="item-header">
<text class="item-index">单元 #{{ index + 1 }}</text>
<uni-icons type="trash" size="18" color="#EF4444" @click="removeStockRow(index)"
v-if="form.stocks.length > 1"></uni-icons>
</view>
<view class="item-grid">
<view class="grid-col">
<text class="sub-label">单元名称/代码</text>
<input class="mini-input" v-model="item.name" placeholder="如 TMF" />
<input class="mini-input" v-model="item.name" placeholder="如 TMF" disabled />
</view>
<view class="grid-col">
<text class="sub-label">买入均价</text>
@ -95,7 +89,8 @@
</template>
<script setup>
import { ref, computed, onMounted, getCurrentInstance } from 'vue';
import { ref, computed, getCurrentInstance } from 'vue';
import { onShow } from '@dcloudio/uni-app';
const { proxy } = getCurrentInstance();
const api = proxy.$api;
@ -103,6 +98,9 @@ const api = proxy.$api;
const strategies = ref([]);
const strategyIndex = ref(-1);
//
let isFetching = false;
const form = ref({
name: '',
stocks: [
@ -133,6 +131,8 @@ const fetchStrategies = async () => {
id: item.id,
name: item.name,
desc: item.description,
type: item.type,
parameters: item.config ? JSON.parse(item.config) : {},
color: '#10B981'
}));
}
@ -141,26 +141,31 @@ const fetchStrategies = async () => {
}
};
onMounted(async () => {
await fetchStrategies();
});
const onStrategyChange = (e) => {
strategyIndex.value = e.detail.value;
const strategy = strategies.value[strategyIndex.value];
console.log('选择的策略:', strategy);
console.log('策略参数:', strategy?.parameters);
if (strategy && strategy.parameters && strategy.parameters.assets) {
form.value.stocks = strategy.parameters.assets.map(asset => ({
name: asset.symbol,
price: '',
amount: '',
date: ''
}));
console.log('自动填充标的:', form.value.stocks);
} else {
form.value.stocks = [{ name: '', price: '', amount: '', date: '' }];
console.log('未找到标的配置,使用默认值');
}
};
const onDateChange = (e, index) => {
form.value.stocks[index].date = e.detail.value;
};
const addStockRow = () => {
form.value.stocks.push({ name: '', price: '', amount: '', date: '' });
};
const removeStockRow = (index) => {
form.value.stocks.splice(index, 1);
};
const submitForm = async () => {
if (!form.value.name) return uni.showToast({ title: '请输入组合名称', icon: 'none' });
if (strategyIndex.value === -1) return uni.showToast({ title: '请选择策略', icon: 'none' });
@ -196,6 +201,12 @@ const submitForm = async () => {
uni.showToast({ title: '创建失败,请重试', icon: 'none' });
}
};
onShow(async () => {
isFetching = true;
await fetchStrategies();
isFetching = false;
});
</script>
<style scoped>
@ -281,22 +292,6 @@ const submitForm = async () => {
color: #1F2937;
}
/* 添加按钮 */
.add-btn {
display: flex;
align-items: center;
background-color: #ECFDF5;
padding: 8rpx 20rpx;
border-radius: 100rpx;
gap: 8rpx;
}
.add-text {
font-size: 24rpx;
font-weight: 600;
color: #064E3B;
}
/* 表单项 */
.form-item {
margin-bottom: 32rpx;
@ -419,6 +414,12 @@ const submitForm = async () => {
color: #1F2937;
}
.mini-input[disabled] {
background-color: #F3F4F6;
color: #6B7280;
cursor: not-allowed;
}
/* 日期选择 */
.date-picker-display {
background-color: #FFFFFF;

View File

@ -91,7 +91,8 @@
</template>
<script setup>
import { ref, onShow } from 'vue';
import { ref } from 'vue';
import { onShow } from '@dcloudio/uni-app';
import { api } from '../../utils/api';
//
@ -109,7 +110,6 @@ let isFetching = false;
// API
const fetchAssetData = async () => {
if (isFetching) return;
try {
console.log('开始获取资产数据...');
const response = await api.assets.getAssetData();
@ -132,7 +132,6 @@ const fetchAssetData = async () => {
// API
const fetchHoldingsData = async () => {
if (isFetching) return;
try {
console.log('开始获取持仓数据...');
const response = await api.assets.getHoldings();
@ -161,7 +160,14 @@ const fetchHoldingsData = async () => {
}
};
//
const goConfig = () => {
uni.navigateTo({ url: '/pages/config/config' });
};
const goDetail = (holdingId) => {
uni.navigateTo({ url: `/pages/detail/detail?id=${holdingId}` });
};
onShow(async () => {
console.log('首页显示,刷新数据...');
isFetching = true;
@ -173,14 +179,6 @@ onShow(async () => {
isFetching = false;
});
const goConfig = () => {
uni.navigateTo({ url: '/pages/config/config' });
};
const goDetail = (holdingId) => {
uni.navigateTo({ url: `/pages/detail/detail?id=${holdingId}` });
};
</script>
<style scoped>

View File

@ -61,7 +61,8 @@
</template>
<script setup>
import { ref, onShow, getCurrentInstance } from 'vue';
import { ref, getCurrentInstance } from 'vue';
import { onShow } from '@dcloudio/uni-app';
const { proxy } = getCurrentInstance();
const api = proxy.$api;
@ -72,7 +73,6 @@ const strategies = ref([]);
let isFetching = false;
const fetchStrategies = async () => {
if (isFetching) return;
try {
const response = await api.strategies.getStrategies();
if (response.code === 200) {
@ -95,7 +95,6 @@ const fetchStrategies = async () => {
}
};
//
onShow(async () => {
isFetching = true;
await fetchStrategies();