Files
manpengan 2516cc2085 ui: 暗色金融风重构 + 自定义货币选择器
- 深色主题:深蓝背景 + 毛玻璃卡片 + 金色结果数字
- 自定义底部弹窗货币选择器,替换原生白色 Picker
- 换算卡片内容居中竖排布局
- 汇率信息条改为竖排独立卡片
- 实时脉冲徽章 + 蓝紫渐变互换按钮

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-18 18:19:02 +08:00

87 lines
2.0 KiB
JavaScript

const { CURRENCIES, getPickerData } = require('../../utils/currencies');
const { getRates, convert, formatAmount, formatRate } = require('../../utils/rate');
const pickerData = getPickerData();
Page({
data: {
pickerData,
baseIndex: 0,
amount: '100',
list: [],
updatedAt: '',
loading: true,
error: '',
rates: null,
showPicker: false,
},
onLoad() {
this.loadRates();
},
onPullDownRefresh() {
this.loadRates().then(() => {
wx.stopPullDownRefresh();
});
},
async loadRates() {
this.setData({ loading: true, error: '' });
try {
const baseCode = CURRENCIES[this.data.baseIndex].code;
const { rates, updatedAt } = await getRates(baseCode);
this.setData({ rates, updatedAt, loading: false });
this.buildList();
} catch (e) {
this.setData({ loading: false, error: '汇率获取失败,请下拉刷新重试' });
}
},
buildList() {
const { rates, baseIndex, amount } = this.data;
if (!rates) return;
const num = parseFloat(amount);
if (isNaN(num) || num <= 0) {
this.setData({ list: [] });
return;
}
const baseCode = CURRENCIES[baseIndex].code;
const list = CURRENCIES
.filter((c) => c.code !== baseCode)
.map((c) => {
const converted = convert(num, baseCode, c.code, rates);
const unitRate = convert(1, baseCode, c.code, rates);
return {
flag: c.flag,
code: c.code,
name: c.name,
converted: formatAmount(converted, c.code),
unitRate: formatRate(unitRate),
};
});
this.setData({ list });
},
openBasePicker() {
this.setData({ showPicker: true });
},
handlePickerSelect(e) {
this.setData({ baseIndex: e.detail.value, showPicker: false });
this.loadRates();
},
handlePickerClose() {
this.setData({ showPicker: false });
},
handleAmountInput(e) {
this.setData({ amount: e.detail.value });
this.buildList();
},
});