eric/aerologic-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 完成国际出港移库/出库交接页面5.5寸手机端适配

Browse Source 
- 落地手机端双形态适配框架：同名布局+资源限定符（layout/手机、
  layout-sw600dp/平板）自动切换，DeviceUtil 设备形态判定，7个
  手机版公共组件（PhoneSearchBar/StatusTab/DataLayout/FilterPanel/
  BottomBar/StatBox/KvItem）
- 完成「国际出港移库」「国际出港出库交接」两页手机端适配，新增
  各自详情页（IntExpMoveDetailActivity/IntExpOutHandoverDetailActivity）
- 手机端首页菜单接入"出港移库""出库交接"入口
- 修复手机端进入页面先横屏后转竖屏的闪屏问题：Manifest 全项目
  192 处改为 screenOrientation="unspecified"，由 BaseActivity
  按设备形态运行时锁定方向
- 修复该方案的中间版本在平板端引入的回归（先竖后横 + UI放大1.6倍）
- AutoSize 补充手机竖屏 390×844 设计基准
- 修复 CHANGELOG.md 因脚本异常导致的内容重复损坏（膨胀至12万行），
  恢复正常结构并补充本次变更记录

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
杨建宽
2026-07-29 14:18:29 +08:00
parent 9c4588e47e
commit db062c8ee3
134 changed files with 19602 additions and 2965 deletions
Download Patch File Download Diff File Expand all files Collapse all files

306
documents/5.5寸手持端设计文件/03_出港计重/weight-detail.html Normal file
View File

@@ -0,0 +1,306 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8"/>
<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
<title>计重明细</title>
<script src="https://modao.cc/agent-py/static/source/js/tailwindcss.js"></script>
<script src="https://modao.cc/agent-py/static/source/js/iconify-icon.min.js"></script>
<style>
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
background-color: #F3F4F6;
font-size: 13px;
}
.safe-bottom {
padding-bottom: env(safe-area-inset-bottom);
}
.no-scrollbar::-webkit-scrollbar {
display: none;
}
.no-scrollbar {
-ms-overflow-style: none;
scrollbar-width: none;
}
.btn-active:active {
opacity: 0.7;
}
</style>
</head>
<body class="bg-gray-200 min-h-screen flex items-center justify-center p-4">
<div class="relative w-[390px] h-[844px] bg-[#1a1a1a] rounded-[55px] shadow-2xl border-[6px] border-[#333] flex flex-col overflow-hidden">
<div class="flex-1 bg-white mt-0 mb-1 mx-1 rounded-[46px] overflow-hidden flex flex-col relative">
<!-- 状态栏 -->
<div class="bg-[#2563EB] text-white h-11 px-7 flex items-end pb-2 justify-between text-[14px] font-medium z-50">
<span>09:41</span>
<div class="flex items-center gap-1.5 pb-0.5">
<iconify-icon icon="mdi:signal-cellular-3"></iconify-icon>
<iconify-icon icon="mdi:wifi"></iconify-icon>
<iconify-icon icon="mdi:battery"></iconify-icon>
</div>
</div>
<!-- 列表页 -->
<div id="listPage" class="flex-1 flex flex-col overflow-hidden relative bg-gray-100">
<header class="relative bg-[#2563EB] text-white flex items-center h-12 px-3 sticky top-0 z-50">
<div class="flex items-center btn-active" onclick="window.location.href='records.html'">
<iconify-icon icon="mdi:chevron-left" width="28"></iconify-icon>
<span class="text-sm font-medium text-white -ml-1">返回</span>
</div>
<h1 class="absolute left-1/2 -translate-x-1/2 text-lg font-bold text-white">计重明细</h1>
</header>
<div class="flex-1 overflow-y-auto p-4 no-scrollbar">
<!-- 运单卡片（与 781333617 样式统一） -->
<div class="bg-white rounded-2xl shadow-md shadow-black/5 overflow-hidden relative mb-3">
<!-- 顶部渐变装饰条 -->
<div class="h-1" style="background: linear-gradient(90deg, #2563EB, #60A5FA, #2563EB);"></div>
<!-- 内容区 -->
<div class="px-5 py-4">
<!-- 第一行：运单号 + 状态徽标 -->
<div class="flex items-center justify-between mb-3">
<div class="flex items-center gap-2">
<div class="w-2 h-2 rounded-full bg-blue-500 animate-pulse"></div>
<span class="text-[20px] font-bold text-gray-900 tracking-wider">78133363396</span>
</div>
<span class="text-[11px] font-medium text-blue-600 bg-blue-50 px-2.5 py-1 rounded-full border border-blue-100">国际出港</span>
</div>
<!-- 分割线 -->
<div class="border-t border-gray-50 mb-3"></div>
<!-- 统一信息区域：浅灰底圆角容器 -->
<div class="bg-gray-50/70 rounded-xl px-4 py-3">
<div class="grid grid-cols-3 gap-2 text-center">
<div>
<p class="text-[10px] text-gray-400 mb-0.5">总件数</p>
<p class="text-[15px] font-bold text-gray-800">85</p>
</div>
<div>
<p class="text-[10px] text-gray-400 mb-0.5">总重量(kg)</p>
<p class="text-[15px] font-bold text-gray-800">1560</p>
</div>
<div>
<p class="text-[10px] text-gray-400 mb-0.5">托盘总重(kg)</p>
<p class="text-[15px] font-bold text-gray-800">54</p>
</div>
</div>
</div>
</div>
</div>
<!-- 左滑卡片1 -->
<div class="swipe-item bg-white rounded-xl shadow-sm mb-3 overflow-hidden relative" data-id="1">
<div class="swipe-content p-4 relative z-10 bg-white">
<div class="flex justify-between py-2">
<span class="text-gray-600">运抵件数</span>
<span class="font-medium piece">20</span>
</div>
<div class="flex justify-between py-2">
<span class="text-gray-600">运抵重量(kg)</span>
<span class="font-medium weight">320</span>
</div>
<div class="flex justify-between py-2">
<span class="text-gray-500">托盘自重(kg)</span>
<span class="text-gray-600">18</span>
</div>
<div class="flex justify-between py-2">
<span class="text-gray-500">计重人</span>
<span class="text-gray-600 user">张三</span>
</div>
<div class="flex justify-between py-2">
<span class="text-gray-500">计重时间</span>
<span class="text-gray-600 time">2026-07-05 10:02:15</span>
</div>
</div>
<div class="swipe-action absolute top-0 right-0 bottom-0 w-[60px] bg-[#2563EB] flex items-center justify-center z-0">
<button class="text-white text-sm" onclick="goEdit(1)">修改</button>
</div>
</div>
<!-- 卡片2 -->
<div class="swipe-item bg-white rounded-xl shadow-sm mb-3 overflow-hidden relative" data-id="2">
<div class="swipe-content p-4 relative z-10 bg-white">
<div class="flex justify-between py-2">
<span class="text-gray-600">运抵件数</span>
<span class="font-medium piece">35</span>
</div>
<div class="flex justify-between py-2">
<span class="text-gray-600">运抵重量(kg)</span>
<span class="font-medium weight">590</span>
</div>
<div class="flex justify-between py-2">
<span class="text-gray-500">托盘自重(kg)</span>
<span class="text-gray-600">18</span>
</div>
<div class="flex justify-between py-2">
<span class="text-gray-500">计重人</span>
<span class="text-gray-600 user">张三</span>
</div>
<div class="flex justify-between py-2">
<span class="text-gray-500">计重时间</span>
<span class="text-gray-600 time">2026-07-05 10:25:30</span>
</div>
</div>
<div class="swipe-action absolute top-0 right-0 bottom-0 w-[60px] bg-[#2563EB] flex items-center justify-center z-0">
<button class="text-white text-sm" onclick="goEdit(2)">修改</button>
</div>
</div>
<!-- 卡片3 -->
<div class="swipe-item bg-white rounded-xl shadow-sm mb-3 overflow-hidden relative" data-id="3">
<div class="swipe-content p-4 relative z-10 bg-white">
<div class="flex justify-between py-2">
<span class="text-gray-600">运抵件数</span>
<span class="font-medium piece">30</span>
</div>
<div class="flex justify-between py-2">
<span class="text-gray-600">运抵重量(kg)</span>
<span class="font-medium weight">650</span>
</div>
<div class="flex justify-between py-2">
<span class="text-gray-500">托盘自重(kg)</span>
<span class="text-gray-600">18</span>
</div>
<div class="flex justify-between py-2">
<span class="text-gray-500">计重人</span>
<span class="text-gray-600 user">张三</span>
</div>
<div class="flex justify-between py-2">
<span class="text-gray-500">计重时间</span>
<span class="text-gray-600 time">2026-07-05 11:45:08</span>
</div>
</div>
<div class="swipe-action absolute top-0 right-0 bottom-0 w-[60px] bg-[#2563EB] flex items-center justify-center z-0">
<button class="text-white text-sm" onclick="goEdit(3)">修改</button>
</div>
</div>
</div>
</div>
<!-- 修改记录页面（完全在手机容器内） -->
<div id="editPage" class="absolute inset-0 bg-gray-100 z-[60] flex flex-col hidden">
<div class="bg-[#2563EB] text-white h-11 px-7 flex items-end pb-2 justify-between text-[14px] font-medium z-50 flex-none">
<span>09:41</span>
<div class="flex items-center gap-1.5 pb-0.5">
<iconify-icon icon="mdi:signal-cellular-3"></iconify-icon>
<iconify-icon icon="mdi:wifi"></iconify-icon>
<iconify-icon icon="mdi:battery"></iconify-icon>
</div>
</div>
<header class="relative bg-[#2563EB] text-white flex items-center h-12 px-3 flex-none">
<div class="flex items-center btn-active" onclick="closeEditPage()">
<iconify-icon icon="mdi:chevron-left" width="28"></iconify-icon>
<span class="text-sm font-medium text-white -ml-1">返回</span>
</div>
<h1 class="absolute left-1/2 -translate-x-1/2 text-lg font-bold text-white">修改记录</h1>
</header>
<div class="flex-1 overflow-y-auto p-4 no-scrollbar">
<div class="bg-white rounded-xl shadow-sm overflow-hidden px-4">
<div class="flex items-center py-[14px] border-b border-gray-100">
<span class="w-[90px] text-[13px] font-medium text-[#6B7280] shrink-0">运抵件数<span class="text-red-500 ml-0.5">*</span></span>
<input id="edit_piece" class="flex-1 bg-transparent outline-none text-gray-800 text-[14px]">
</div>
<div class="flex items-center py-[14px] border-b border-gray-100">
<span class="w-[90px] text-[13px] font-medium text-[#6B7280] shrink-0">运抵重量(kg)<span class="text-red-500 ml-0.5">*</span></span>
<input id="edit_weight" class="flex-1 bg-transparent outline-none text-gray-800 text-[14px]">
</div>
<div class="flex items-center py-[14px] border-b border-gray-100">
<span class="w-[90px] text-[13px] font-medium text-[#6B7280] shrink-0">托盘自重(kg)<span class="text-red-500 ml-0.5">*</span></span>
<input value="18" class="flex-1 bg-transparent outline-none text-gray-800 text-[14px]">
</div>
<div class="flex items-center py-[14px] border-b border-gray-100">
<span class="w-[90px] text-[13px] font-medium text-[#6B7280] shrink-0">计重人</span>
<input id="edit_user" disabled class="flex-1 bg-transparent outline-none text-gray-500 text-[14px]">
</div>
<div class="flex items-center py-[14px]">
<span class="w-[90px] text-[13px] font-medium text-[#6B7280] shrink-0">计重时间</span>
<input id="edit_time" disabled class="flex-1 bg-transparent outline-none text-gray-500 text-[14px]">
</div>
</div>
<button class="w-full mt-8 bg-[#2563EB] text-white py-3.5 rounded-[10px] font-bold text-[16px] shadow-lg shadow-blue-500/30 btn-active" onclick="saveEdit()">保存</button>
</div>
</div>
</div>
</div>
<script>
let currentEditId = null
// 左滑效果（鼠标+触摸）
document.querySelectorAll('.swipe-item').forEach(item => {
const content = item.querySelector('.swipe-content')
let startX = 0
let isDragging = false
item.addEventListener('mousedown', e => {
isDragging = true
startX = e.clientX
e.preventDefault()
})
window.addEventListener('mousemove', e => {
if (!isDragging) return
const dx = startX - e.clientX
if (dx > 0) {
const off = Math.min(dx, 60)
content.style.transform = `translateX(-${off}px)`
}
})
window.addEventListener('mouseup', () => {
if (!isDragging) return
isDragging = false
const dx = startX - event.clientX
if (dx > 30) {
content.style.transform = 'translateX(-60px)'
} else {
content.style.transform = ''
}
})
item.addEventListener('touchstart', e => {
startX = e.touches[0].clientX
})
item.addEventListener('touchmove', e => {
const dx = startX - e.touches[0].clientX
if (dx > 0) {
const off = Math.min(dx, 60)
content.style.transform = `translateX(-${off}px)`
}
})
item.addEventListener('touchend', () => {
const dx = startX - event.changedTouches[0].clientX
content.style.transform = dx > 30 ? 'translateX(-60px)' : ''
})
})
function goEdit(id) {
currentEditId = id
const item = document.querySelector(`.swipe-item[data-id="${id}"]`)
document.getElementById('edit_piece').value = item.querySelector('.piece').innerText
document.getElementById('edit_weight').value = item.querySelector('.weight').innerText
document.getElementById('edit_user').value = item.querySelector('.user').innerText
document.getElementById('edit_time').value = item.querySelector('.time').innerText
document.getElementById('listPage').classList.add('hidden')
document.getElementById('editPage').classList.remove('hidden')
}
function closeEditPage() {
document.getElementById('editPage').classList.add('hidden')
document.getElementById('listPage').classList.remove('hidden')
}
function saveEdit() {
const p = document.getElementById('edit_piece').value
const w = document.getElementById('edit_weight').value
const item = document.querySelector(`.swipe-item[data-id="${currentEditId}"]`)
item.querySelector('.piece').innerText = p
item.querySelector('.weight').innerText = w
closeEditPage()
}
</script>
</body>
</html>