|
|
|
|
@ -1,94 +1,164 @@
|
|
|
|
|
<template>
|
|
|
|
|
<view class="page-container">
|
|
|
|
|
<NavBar :title="'备件详情'" />
|
|
|
|
|
<NavBar :title="t('sparepartInventory.detailTitle')" />
|
|
|
|
|
|
|
|
|
|
<view class="content-section" v-if="detail">
|
|
|
|
|
<!-- 标题 -->
|
|
|
|
|
<view class="page-title-bar">
|
|
|
|
|
<view class="page-title-bar-line"></view>
|
|
|
|
|
<text class="page-title">备件基本信息</text>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="detail-card">
|
|
|
|
|
<!-- 图片 + 前三行信息 -->
|
|
|
|
|
<view class="info-row-top">
|
|
|
|
|
<view class="item-image-wrap">
|
|
|
|
|
<image v-if="detailImage" :src="detailImage" class="item-image" mode="aspectFill" />
|
|
|
|
|
<view v-else class="item-image-placeholder">📦</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="item-info-col">
|
|
|
|
|
<view class="item-row"><text class="item-label">物料名称</text><text class="item-value">{{ textValue(detail.name) }}</text></view>
|
|
|
|
|
<view class="item-row"><text class="item-label">物料编码</text><text class="item-value">{{ textValue(detail.barCode) }}</text></view>
|
|
|
|
|
<view class="item-row"><text class="item-label">物料小类</text><text class="item-value">{{ textValue(detail.categoryName) }}</text></view>
|
|
|
|
|
<scroll-view scroll-y class="detail-scroll">
|
|
|
|
|
<view v-if="detail" class="content-section">
|
|
|
|
|
<view class="detail-card">
|
|
|
|
|
<view class="info-row-top">
|
|
|
|
|
<view class="item-image-wrap">
|
|
|
|
|
<image v-if="detailImage" :src="detailImage" class="item-image" mode="aspectFill" />
|
|
|
|
|
<view v-else class="item-image-placeholder">📦</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="item-info-col">
|
|
|
|
|
<view class="item-row">
|
|
|
|
|
<text class="item-label">{{ t('sparepartInventory.productName') }}</text>
|
|
|
|
|
<text class="item-value">{{ textValue(detail.name || detail.productName) }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="item-row">
|
|
|
|
|
<text class="item-label">{{ t('sparepartInventory.barCode') }}</text>
|
|
|
|
|
<text class="item-value">{{ textValue(detail.barCode || detail.productBarCode) }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="item-row">
|
|
|
|
|
<text class="item-label">{{ t('sparepartInventory.category') }}</text>
|
|
|
|
|
<text class="item-value">{{ textValue(detail.categoryName || detail.subCategoryName) }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<!-- 其余信息 -->
|
|
|
|
|
<view class="info-list">
|
|
|
|
|
<view class="info-row"><text class="info-label">仓库</text><text class="info-value">{{ textValue(warehouseName) }}</text></view>
|
|
|
|
|
<view class="info-row"><text class="info-label">库区</text><text class="info-value">{{ textValue(areaName) }}</text></view>
|
|
|
|
|
<view class="info-row"><text class="info-label">库存展示</text><text class="info-value highlight">{{ textValue(detail.stockDisplay) }}</text></view>
|
|
|
|
|
<view class="info-row"><text class="info-label">基本数量</text><text class="info-value highlight">{{ textValue(stockCount) }}{{ stockUnit !== '-' ? stockUnit : '' }}</text></view>
|
|
|
|
|
<view class="info-row"><text class="info-label">包装/换算规则</text><text class="info-value">{{ textValue(packagingRule) }}</text></view>
|
|
|
|
|
<view class="info-row"><text class="info-label">最近入库</text><text class="info-value">{{ formatDateTime(recentInTime) }}</text></view>
|
|
|
|
|
<view class="info-row"><text class="info-label">最近出库</text><text class="info-value">{{ formatDateTime(recentOutTime) }}</text></view>
|
|
|
|
|
|
|
|
|
|
<view class="section-card">
|
|
|
|
|
<view class="section-header">
|
|
|
|
|
<view class="section-icon">
|
|
|
|
|
<uni-icons type="info" size="22" color="#1f7cff" />
|
|
|
|
|
</view>
|
|
|
|
|
<text class="section-title">{{ t('sparepartInventory.stockInfo') }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
<view class="info-list">
|
|
|
|
|
<view class="info-row">
|
|
|
|
|
<text class="info-label">{{ t('sparepartInventory.packagingRule') }}</text>
|
|
|
|
|
<text class="info-value">{{ textValue(detail.packagingRule) }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="info-row">
|
|
|
|
|
<text class="info-label">{{ t('sparepartInventory.warehouse') }}</text>
|
|
|
|
|
<text class="info-value">{{ textValue(detail.warehouseName) }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="info-row block-row">
|
|
|
|
|
<text class="info-label">{{ t('sparepartInventory.stockDisplay') }}</text>
|
|
|
|
|
<view class="tag-wrap">
|
|
|
|
|
<text v-for="item in stockDisplayList" :key="item" class="stock-tag">{{ item }}</text>
|
|
|
|
|
<text v-if="!stockDisplayList.length" class="info-value">-</text>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="info-row block-row">
|
|
|
|
|
<text class="info-label">{{ t('sparepartInventory.areaStockDisplay') }}</text>
|
|
|
|
|
<view class="tag-wrap">
|
|
|
|
|
<text v-for="item in areaStockDisplayList" :key="item" class="stock-tag area-tag">{{ item }}</text>
|
|
|
|
|
<text v-if="!areaStockDisplayList.length" class="info-value">-</text>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="info-row">
|
|
|
|
|
<text class="info-label">{{ t('sparepartInventory.totalPackageCount') }}</text>
|
|
|
|
|
<text class="info-value highlight">{{ formatStockCount(detail.totalPackageCount) }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="info-row">
|
|
|
|
|
<text class="info-label">{{ t('sparepartInventory.totalBaseCount') }}</text>
|
|
|
|
|
<text class="info-value highlight">{{ formatStockCount(detail.totalBaseCount) }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="info-row">
|
|
|
|
|
<text class="info-label">{{ t('sparepartInventory.unit') }}</text>
|
|
|
|
|
<text class="info-value">{{ textValue(detail.unitName) }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="info-row">
|
|
|
|
|
<text class="info-label">{{ t('sparepartInventory.latestInTime') }}</text>
|
|
|
|
|
<text class="info-value">{{ formatDateTime(detail.latestInTime) }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="info-row">
|
|
|
|
|
<text class="info-label">{{ t('sparepartInventory.latestOutTime') }}</text>
|
|
|
|
|
<text class="info-value">{{ formatDateTime(detail.latestOutTime) }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
<view v-else-if="loading" class="hint">加载中...</view>
|
|
|
|
|
<view v-else class="hint">加载失败</view>
|
|
|
|
|
<view v-else-if="loading" class="hint">{{ t('functionCommon.loading') }}</view>
|
|
|
|
|
<view v-else class="hint">{{ t('functionCommon.loadFailed') }}</view>
|
|
|
|
|
</scroll-view>
|
|
|
|
|
</view>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script setup>
|
|
|
|
|
import { ref, computed } from 'vue'
|
|
|
|
|
import { computed, ref } from 'vue'
|
|
|
|
|
import { onLoad } from '@dcloudio/uni-app'
|
|
|
|
|
import { useI18n } from 'vue-i18n'
|
|
|
|
|
import NavBar from '@/components/common/NavBar.vue'
|
|
|
|
|
import { getSparepartInventoryPage, getSparepartDetail } from '@/api/mes/sparepart'
|
|
|
|
|
|
|
|
|
|
const { t } = useI18n()
|
|
|
|
|
const detail = ref(null)
|
|
|
|
|
const loading = ref(true)
|
|
|
|
|
const stockCount = ref(0)
|
|
|
|
|
const stockUnit = ref('-')
|
|
|
|
|
const packagingRule = ref('-')
|
|
|
|
|
const warehouseName = ref('-')
|
|
|
|
|
const areaName = ref('-')
|
|
|
|
|
const recentInTime = ref('')
|
|
|
|
|
const recentOutTime = ref('')
|
|
|
|
|
|
|
|
|
|
const stockDisplayList = computed(() => formatStockDisplay(detail.value?.stockDisplay))
|
|
|
|
|
const areaStockDisplayList = computed(() => getAreaStockDisplayList(detail.value?.areaStocks))
|
|
|
|
|
const detailImage = computed(() => {
|
|
|
|
|
const images = detail.value?.images
|
|
|
|
|
const images = detail.value?.images || detail.value?.image || detail.value?.picUrl
|
|
|
|
|
if (!images) return ''
|
|
|
|
|
if (Array.isArray(images) && images.length) return String(images[0])
|
|
|
|
|
return String(images).split(',')[0]?.trim() || ''
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
function textValue(v) {
|
|
|
|
|
if (v === 0) return '0'
|
|
|
|
|
if (v == null) return '-'
|
|
|
|
|
const s = String(v).trim()
|
|
|
|
|
return s || '-'
|
|
|
|
|
function textValue(value) {
|
|
|
|
|
if (value === 0) return '0'
|
|
|
|
|
if (value == null) return '-'
|
|
|
|
|
const text = String(value).trim()
|
|
|
|
|
return text || '-'
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function formatStockDisplay() {
|
|
|
|
|
// 优先用 stockData 的 stockDisplay,兜底用 count+unit
|
|
|
|
|
if (stockCount.value > 0) {
|
|
|
|
|
const su = stockUnit.value && stockUnit.value !== '-' ? stockUnit.value : ''
|
|
|
|
|
return su ? `${stockCount.value}${su}` : String(stockCount.value)
|
|
|
|
|
}
|
|
|
|
|
return '-'
|
|
|
|
|
function formatStockCount(value) {
|
|
|
|
|
if (value === undefined || value === null || value === '') return '-'
|
|
|
|
|
const num = Number(value)
|
|
|
|
|
return Number.isFinite(num) ? num.toLocaleString() : String(value)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function formatStockDisplay(value) {
|
|
|
|
|
if (!value) return []
|
|
|
|
|
return String(value)
|
|
|
|
|
.split(',')
|
|
|
|
|
.map((item) => item.trim())
|
|
|
|
|
.filter(Boolean)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function getAreaStockDisplayList(value) {
|
|
|
|
|
if (!Array.isArray(value)) return []
|
|
|
|
|
return value
|
|
|
|
|
.map((item) => item?.stockDisplay?.trim())
|
|
|
|
|
.filter(Boolean)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function formatDateTime(value) {
|
|
|
|
|
if (!value) return '-'
|
|
|
|
|
// 时间戳
|
|
|
|
|
const n = Number(value)
|
|
|
|
|
if (Number.isFinite(n) && n > 0) {
|
|
|
|
|
const d = new Date(n < 1e12 ? n * 1000 : n)
|
|
|
|
|
if (!Number.isNaN(d.getTime())) {
|
|
|
|
|
return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')} ${String(d.getHours()).padStart(2, '0')}:${String(d.getMinutes()).padStart(2, '0')}:${String(d.getSeconds()).padStart(2, '0')}`
|
|
|
|
|
}
|
|
|
|
|
if (Array.isArray(value) && value.length >= 3) {
|
|
|
|
|
const [year, month, day, hour = 0, minute = 0, second = 0] = value
|
|
|
|
|
const pad = (n) => String(n).padStart(2, '0')
|
|
|
|
|
return `${year}-${pad(month)}-${pad(day)} ${pad(hour)}:${pad(minute)}:${pad(second)}`
|
|
|
|
|
}
|
|
|
|
|
return String(value)
|
|
|
|
|
const text = String(value).trim()
|
|
|
|
|
if (!text) return '-'
|
|
|
|
|
const numeric = Number(text)
|
|
|
|
|
if (Number.isFinite(numeric)) {
|
|
|
|
|
const timestamp = text.length === 10 ? numeric * 1000 : numeric
|
|
|
|
|
const date = new Date(timestamp)
|
|
|
|
|
if (!Number.isNaN(date.getTime())) return formatDate(date)
|
|
|
|
|
}
|
|
|
|
|
const date = new Date(text)
|
|
|
|
|
return Number.isNaN(date.getTime()) ? text : formatDate(date)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function formatDate(date) {
|
|
|
|
|
const pad = (n) => String(n).padStart(2, '0')
|
|
|
|
|
return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())} ${pad(date.getHours())}:${pad(date.getMinutes())}:${pad(date.getSeconds())}`
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
onLoad(async (options) => {
|
|
|
|
|
@ -98,30 +168,24 @@ onLoad(async (options) => {
|
|
|
|
|
const arId = options?.areaId
|
|
|
|
|
if (!id && !productId) {
|
|
|
|
|
loading.value = false
|
|
|
|
|
uni.showToast({ title: '缺少备件信息', icon: 'none' })
|
|
|
|
|
uni.showToast({ title: t('sparepartInventory.noDetailId'), icon: 'none' })
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
try {
|
|
|
|
|
// 优先从列表页传来的完整数据
|
|
|
|
|
const cached = getApp().globalData._sparepartInventoryDetail
|
|
|
|
|
if (cached && String(cached.productId) === String(id || productId)) {
|
|
|
|
|
// 映射字段名:列表页 productName -> 详情页 name
|
|
|
|
|
detail.value = {
|
|
|
|
|
name: cached.productName,
|
|
|
|
|
barCode: cached.barCode,
|
|
|
|
|
name: cached.productName || cached.name,
|
|
|
|
|
barCode: cached.barCode || cached.productBarCode,
|
|
|
|
|
categoryName: cached.categoryName,
|
|
|
|
|
standard: cached.standard,
|
|
|
|
|
...cached
|
|
|
|
|
...cached,
|
|
|
|
|
stockDisplay: cached.stockDisplay || String(cached.count || ''),
|
|
|
|
|
unitName: cached.unitName || cached.purchaseUnitName,
|
|
|
|
|
totalPackageCount: cached.totalPackageCount ?? cached.count,
|
|
|
|
|
totalBaseCount: cached.totalBaseCount ?? cached.count,
|
|
|
|
|
latestInTime: cached.recentInTime || cached.latestInTime,
|
|
|
|
|
latestOutTime: cached.recentOutTime || cached.latestOutTime
|
|
|
|
|
}
|
|
|
|
|
stockCount.value = Number(cached.count ?? 0)
|
|
|
|
|
stockUnit.value = cached.unitName || '-'
|
|
|
|
|
detail.value.stockDisplay = cached.stockDisplay || String(cached.count || '')
|
|
|
|
|
packagingRule.value = cached.packagingRule || '-'
|
|
|
|
|
warehouseName.value = cached.warehouseName || '-'
|
|
|
|
|
areaName.value = cached.areaName || '-'
|
|
|
|
|
recentInTime.value = cached.recentInTime || ''
|
|
|
|
|
recentOutTime.value = cached.recentOutTime || ''
|
|
|
|
|
// 异步加载图片(stock/page 不含 images)
|
|
|
|
|
if (!cached.images) {
|
|
|
|
|
getSparepartDetail(cached.productId).then(res => {
|
|
|
|
|
const pd = res?.data || res
|
|
|
|
|
@ -133,7 +197,6 @@ onLoad(async (options) => {
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 兜底:并行调 stock/page + product/get 获取完整数据
|
|
|
|
|
const [pageRes, prodRes] = await Promise.all([
|
|
|
|
|
getSparepartInventoryPage({
|
|
|
|
|
pageNo: 1,
|
|
|
|
|
@ -150,23 +213,26 @@ onLoad(async (options) => {
|
|
|
|
|
const pd = prodRes?.data || prodRes
|
|
|
|
|
if (item) {
|
|
|
|
|
detail.value = {
|
|
|
|
|
name: item.productName,
|
|
|
|
|
name: item.productName || item.name,
|
|
|
|
|
barCode: item.barCode || item.productBarCode,
|
|
|
|
|
categoryName: item.categoryName || item.subCategoryName,
|
|
|
|
|
...item,
|
|
|
|
|
stockDisplay: item.stockDisplay || String(item.count || ''),
|
|
|
|
|
images: pd?.images || item.images // product/get 专供图片
|
|
|
|
|
unitName: item.unitName || item.purchaseUnitName,
|
|
|
|
|
totalPackageCount: item.totalPackageCount ?? item.count,
|
|
|
|
|
totalBaseCount: item.totalBaseCount ?? item.count,
|
|
|
|
|
latestInTime: item.recentInTime || item.latestInTime,
|
|
|
|
|
latestOutTime: item.recentOutTime || item.latestOutTime,
|
|
|
|
|
images: pd?.images || item.images
|
|
|
|
|
}
|
|
|
|
|
stockCount.value = Number(item.count ?? 0)
|
|
|
|
|
stockUnit.value = item.unitName || item.purchaseUnitName || '-'
|
|
|
|
|
packagingRule.value = item.packagingRule || '-'
|
|
|
|
|
warehouseName.value = item.warehouseName || '-'
|
|
|
|
|
areaName.value = item.areaName || '-'
|
|
|
|
|
recentInTime.value = item.recentInTime || ''
|
|
|
|
|
recentOutTime.value = item.recentOutTime || ''
|
|
|
|
|
} else {
|
|
|
|
|
detail.value = { name: '-', barCode: '-', categoryName: '-', standard: '-', stockDisplay: '-', images: pd?.images }
|
|
|
|
|
detail.value = {
|
|
|
|
|
name: '-', barCode: '-', categoryName: '-',
|
|
|
|
|
stockDisplay: '-', images: pd?.images
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
} catch (e) {
|
|
|
|
|
console.error('获取备件详情失败:', e)
|
|
|
|
|
uni.showToast({ title: t('functionCommon.loadFailed'), icon: 'none' })
|
|
|
|
|
} finally {
|
|
|
|
|
loading.value = false
|
|
|
|
|
}
|
|
|
|
|
@ -174,132 +240,32 @@ onLoad(async (options) => {
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
|
.page-container {
|
|
|
|
|
min-height: 100vh;
|
|
|
|
|
background: #f3f4f6;
|
|
|
|
|
padding-bottom: 40rpx;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.content-section {
|
|
|
|
|
padding: 24rpx 28rpx;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* 页面标题 */
|
|
|
|
|
.page-title-bar {
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
gap: 10rpx;
|
|
|
|
|
padding: 0 0 20rpx;
|
|
|
|
|
}
|
|
|
|
|
.page-title-bar-line {
|
|
|
|
|
width: 6rpx;
|
|
|
|
|
height: 32rpx;
|
|
|
|
|
border-radius: 3rpx;
|
|
|
|
|
background: #2563eb;
|
|
|
|
|
flex-shrink: 0;
|
|
|
|
|
}
|
|
|
|
|
.page-title {
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
color: #1a1a1a;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* 详情卡片 */
|
|
|
|
|
.detail-card {
|
|
|
|
|
background: #fff;
|
|
|
|
|
border-radius: 16rpx;
|
|
|
|
|
padding: 28rpx;
|
|
|
|
|
box-shadow: 0 2rpx 12rpx rgba(15, 23, 42, 0.04);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* 图片 + 前三行 */
|
|
|
|
|
.info-row-top {
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
padding-bottom: 20rpx;
|
|
|
|
|
border-bottom: 1rpx solid #f3f4f6;
|
|
|
|
|
margin-bottom: 20rpx;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.item-image-wrap {
|
|
|
|
|
width: 130rpx;
|
|
|
|
|
height: 130rpx;
|
|
|
|
|
border-radius: 12rpx;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
background: #f8fafc;
|
|
|
|
|
border: 1rpx solid #f0f0f0;
|
|
|
|
|
flex-shrink: 0;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
margin-right: 24rpx;
|
|
|
|
|
}
|
|
|
|
|
.page-container { min-height: 100vh; background: #f5f7fb; }
|
|
|
|
|
.detail-scroll { height: calc(100vh - 120rpx); }
|
|
|
|
|
.content-section { padding: 20rpx 24rpx 40rpx; }
|
|
|
|
|
.detail-card { padding: 28rpx; margin-bottom: 20rpx; background: #ffffff; border-radius: 16rpx; box-shadow: 0 2rpx 12rpx rgba(15, 23, 42, 0.04); }
|
|
|
|
|
.info-row-top { display: flex; align-items: center; }
|
|
|
|
|
.item-image-wrap { width: 130rpx; height: 130rpx; border-radius: 12rpx; overflow: hidden; background: #f8fafc; border: 1rpx solid #f0f0f0; flex-shrink: 0; display: flex; align-items: center; justify-content: center; margin-right: 24rpx; }
|
|
|
|
|
.item-image { width: 100%; height: 100%; }
|
|
|
|
|
.item-image-placeholder { font-size: 48rpx; opacity: 0.2; }
|
|
|
|
|
|
|
|
|
|
.item-info-col {
|
|
|
|
|
flex: 1;
|
|
|
|
|
min-width: 0;
|
|
|
|
|
}
|
|
|
|
|
.item-row {
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
gap: 16rpx;
|
|
|
|
|
padding: 8rpx 0;
|
|
|
|
|
&:last-child { padding-bottom: 0; }
|
|
|
|
|
}
|
|
|
|
|
.item-label {
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
color: #9ca3af;
|
|
|
|
|
flex-shrink: 0;
|
|
|
|
|
}
|
|
|
|
|
.item-value {
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
color: #374151;
|
|
|
|
|
text-align: right;
|
|
|
|
|
word-break: break-all;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.info-list {
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.info-row {
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
gap: 20rpx;
|
|
|
|
|
padding: 16rpx 0;
|
|
|
|
|
border-bottom: 1rpx solid #f3f4f6;
|
|
|
|
|
&:last-child { border-bottom: 0; }
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.info-label {
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
color: #9ca3af;
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
flex-shrink: 0;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.info-value {
|
|
|
|
|
flex: 1;
|
|
|
|
|
text-align: right;
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
color: #374151;
|
|
|
|
|
word-break: break-all;
|
|
|
|
|
|
|
|
|
|
&.highlight {
|
|
|
|
|
color: #1f4b79;
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.hint {
|
|
|
|
|
text-align: center;
|
|
|
|
|
padding: 160rpx 0;
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
color: #9ca3af;
|
|
|
|
|
}
|
|
|
|
|
.item-info-col { flex: 1; min-width: 0; }
|
|
|
|
|
.item-row { display: flex; align-items: center; justify-content: space-between; gap: 16rpx; padding: 8rpx 0; }
|
|
|
|
|
.item-row:last-child { padding-bottom: 0; }
|
|
|
|
|
.item-label { font-size: 28rpx; color: #9ca3af; flex-shrink: 0; }
|
|
|
|
|
.item-value { font-size: 28rpx; color: #374151; text-align: right; word-break: break-all; }
|
|
|
|
|
.section-card { padding: 24rpx; margin-bottom: 20rpx; background: #ffffff; border: 1rpx solid #eef2f7; border-radius: 20rpx; box-shadow: 0 6rpx 18rpx rgba(15, 23, 42, 0.04); }
|
|
|
|
|
.section-header { display: flex; align-items: center; gap: 12rpx; margin-bottom: 22rpx; padding-bottom: 18rpx; border-bottom: 1rpx solid #f1f5f9; }
|
|
|
|
|
.section-icon { width: 40rpx; height: 40rpx; border-radius: 10rpx; background: #eff6ff; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
|
|
|
|
|
.section-title { font-size: 32rpx; font-weight: 600; color: #1f2937; }
|
|
|
|
|
.info-list { display: flex; flex-direction: column; }
|
|
|
|
|
.info-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 20rpx; padding: 18rpx 0; border-bottom: 1rpx solid #f3f4f6; }
|
|
|
|
|
.info-row:last-child { border-bottom: 0; }
|
|
|
|
|
.info-row.block-row { flex-direction: column; gap: 12rpx; }
|
|
|
|
|
.info-label { width: 190rpx; font-size: 26rpx; color: #94a3b8; flex-shrink: 0; }
|
|
|
|
|
.info-value { flex: 1; text-align: right; font-size: 27rpx; color: #334155; line-height: 1.5; word-break: break-all; }
|
|
|
|
|
.info-value.highlight { color: #1f4b79; font-weight: 700; }
|
|
|
|
|
.tag-wrap { width: 100%; display: flex; flex-wrap: wrap; gap: 12rpx; justify-content: flex-end; }
|
|
|
|
|
.stock-tag { max-width: 100%; padding: 8rpx 16rpx; border-radius: 999rpx; color: #1d4ed8; background: #dbeafe; font-size: 24rpx; line-height: 1.35; word-break: break-all; }
|
|
|
|
|
.area-tag { color: #0369a1; background: #e0f2fe; }
|
|
|
|
|
.hint { padding: 160rpx 0; text-align: center; color: #94a3b8; font-size: 26rpx; }
|
|
|
|
|
</style>
|
|
|
|
|
|