diff --git a/pages/detail/detail.vue b/pages/detail/detail.vue index 8712868..a047cfc 100755 --- a/pages/detail/detail.vue +++ b/pages/detail/detail.vue @@ -207,46 +207,45 @@ {{ transactionType === 'sell' ? '选择持仓' : '股票代码' }} - + + - - - + + + + {{ result.ticker || result.stockCode }} + {{ result.name || result.stockName }} + + {{ result.assetType }} {{ result.exchange || '' }} - - + + - + - 数量{{ transactionType === 'sell' && maxSellAmount > 0 ? `(最多可卖 ${maxSellAmount} 份)` : '' }} + 数量{{ transactionType === 'sell' && maxSellAmount > 0 ? ` (最多可卖 ${maxSellAmount} 份)` : '' }} @@ -254,25 +253,22 @@ 价格 - - 交易时间 - {{ transactionForm.transactionDate }} + {{ transactionForm.transactionDate || '请选择日期' }} @@ -282,8 +278,9 @@ 备注 @@ -363,12 +360,11 @@ const transactionForm = ref({ price: '', currency: '', // 默认使用组合币种 transactionDate: getCurrentDate(), + dateTimestamp: Date.now(), remark: '' }); // 当前选中持仓的最大可卖数量 const maxSellAmount = ref(0); -// 日期选择器显示状态 -const showDatePicker = ref(false); // 货币选择相关 const currencyList = ref([ @@ -384,14 +380,36 @@ const onCurrencyChange = (e) => { }; const onDateChange = (e) => { - // u-datetime-picker返回格式为YYYY-MM-DD - transactionForm.value.transactionDate = e.value; - showDatePicker.value = false; + // u-datetime-picker返回时间戳 + const date = new Date(e.value); + const year = date.getFullYear(); + const month = String(date.getMonth() + 1).padStart(2, '0'); + const day = String(date.getDate()).padStart(2, '0'); + transactionForm.value.transactionDate = `${year}-${month}-${day}`; + transactionForm.value.dateTimestamp = e.value; }; // 股票搜索相关 const searchResults = ref([]); const searchTimer = ref(null); + +// 点击股票代码输入框(卖出时显示持仓列表) +const handleStockInputClick = () => { + if (transactionType.value === 'sell') { + // 卖出时显示当前持仓列表 + searchResults.value = positions.value.map(pos => ({ + ticker: pos.stockCode, + stockCode: pos.stockCode, + stockName: pos.stockName, + name: pos.stockName, + assetType: pos.assetType || 'Stock', + currency: pos.currency, + amount: pos.amount, + exchange: '' + })); + } +}; + const searchStock = async (keyword) => { // 防抖 if (searchTimer.value) clearTimeout(searchTimer.value); @@ -886,16 +904,16 @@ const deletePortfolio = async () => { .form-select { width: 100%; - max-width: 200rpx; /* 限制货币选择框最大宽度 */ - height: 72rpx; - border: 1rpx solid #E5E7EB; - border-radius: 12rpx; + height: 80rpx; + background-color: #F9FAFB; + border: 2rpx solid #E5E7EB; + border-radius: 16rpx; padding: 0 20rpx; display: flex; align-items: center; justify-content: space-between; - font-size: 24rpx; - color: #111827; + font-size: 26rpx; + color: #1F2937; } .modal-footer { @@ -927,4 +945,77 @@ const deletePortfolio = async () => { background-color: #064E3B; color: #fff; } + +/* 搜索下拉列表 */ +.relative { + position: relative; +} + +.search-dropdown { + position: absolute; + top: 100%; + left: 0; + right: 0; + background-color: #FFFFFF; + border: 1rpx solid #E5E7EB; + border-radius: 12rpx; + margin-top: 4rpx; + max-height: 300rpx; + overflow-y: auto; + z-index: 100; + box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.1); +} + +.dropdown-item { + padding: 16rpx 20rpx; + border-bottom: 1rpx solid #F3F4F6; + display: flex; + justify-content: space-between; + align-items: center; +} + +.dropdown-item:last-child { + border-bottom: none; +} + +.dropdown-item:active { + background-color: #F3F4F6; +} + +.item-left { + display: flex; + flex-direction: column; + gap: 4rpx; +} + +.item-ticker { + font-size: 26rpx; + font-weight: 600; + color: #1F2937; +} + +.item-name { + font-size: 22rpx; + color: #6B7280; +} + +.item-right { + display: flex; + flex-direction: row; + align-items: center; + gap: 8rpx; +} + +.item-type { + font-size: 18rpx; + color: #064E3B; + background-color: #D1FAE5; + padding: 2rpx 8rpx; + border-radius: 4rpx; +} + +.item-exchange { + font-size: 22rpx; + color: #9CA3AF; +} \ No newline at end of file