YANG JIANKUAN
db062c8ee3
- 落地手机端双形态适配框架：同名布局+资源限定符（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>
176 lines
8.2 KiB
HTML
176 lines
8.2 KiB
HTML
<!DOCTYPE html>
|
|
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="utf-8"/>
|
|
<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
|
|
<title>补充信息</title>
|
|
<!-- Tailwind CSS -->
|
|
<script src="https://modao.cc/agent-py/static/source/js/tailwindcss.js"></script>
|
|
<!-- Iconify -->
|
|
<script src="https://modao.cc/agent-py/static/source/js/iconify-icon.min.js"></script>
|
|
<style>
|
|
.no-scrollbar::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
body {
|
|
background-color: #f3f4f6;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
min-height: 100vh;
|
|
margin: 0;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body class="bg-gray-200">
|
|
<!-- Phone Shell -->
|
|
<div class="phone-shell w-[375px] h-[812px] bg-[#F5F5F7] overflow-hidden flex flex-col relative rounded-[48px] border-[10px] border-gray-900 shadow-2xl">
|
|
<!-- Status Bar & Nav Bar Container -->
|
|
<div class="bg-[#1A73E8] flex-none">
|
|
<!-- Status Bar -->
|
|
<div class="h-[44px] flex justify-between items-center px-8 text-white">
|
|
<span class="text-[15px] font-semibold">09:41</span>
|
|
<div class="flex items-center gap-1.5">
|
|
<iconify-icon class="text-lg" icon="mdi:signal-cellular-3"></iconify-icon>
|
|
<iconify-icon class="text-lg" icon="mdi:wifi"></iconify-icon>
|
|
<iconify-icon class="text-xl" icon="mdi:battery"></iconify-icon>
|
|
</div>
|
|
</div>
|
|
<!-- Navigation Bar -->
|
|
<div class="h-[44px] flex items-center px-4 relative">
|
|
<div class="flex items-center text-white cursor-pointer" onclick="window.location.href='main.html'">
|
|
<iconify-icon class="text-2xl" icon="mdi:chevron-left"></iconify-icon>
|
|
<span class="text-sm">返回</span>
|
|
</div>
|
|
<div class="absolute inset-0 flex items-center justify-center pointer-events-none">
|
|
<h1 class="text-white text-lg font-bold">补充信息</h1>
|
|
</div>
|
|
<div class="ml-auto w-10"></div> <!-- Placeholder for right side -->
|
|
</div>
|
|
</div>
|
|
<!-- Content Area -->
|
|
<div class="flex-1 overflow-y-auto no-scrollbar p-4 space-y-4">
|
|
<!-- 收货人信息 -->
|
|
<div class="bg-white rounded-2xl p-5 shadow-sm border border-gray-100/50">
|
|
<div class="flex items-center gap-2 mb-4">
|
|
<div class="w-1.5 h-4 bg-[#1A73E8] rounded-full"></div>
|
|
<h3 class="text-sm font-bold text-gray-900">收货人信息</h3>
|
|
</div>
|
|
<div class="space-y-4">
|
|
<div>
|
|
<label class="text-[13px] text-gray-500 font-medium mb-1.5 block">收货人名称</label>
|
|
<div class="flex items-center bg-gray-50 border border-gray-200 rounded-xl h-10 px-3 focus-within:border-blue-500 focus-within:bg-white transition-all">
|
|
<input class="flex-1 bg-transparent text-[14px] text-gray-800 placeholder-gray-400 outline-none border-none" placeholder="请输入收货人名称" type="text"/>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<label class="text-[13px] text-gray-500 font-medium mb-1.5 block">国家代码</label>
|
|
<div class="relative">
|
|
<select class="w-full bg-gray-50 border border-gray-200 rounded-xl h-10 px-3 text-[14px] text-gray-800 outline-none appearance-none focus:border-blue-500 focus:bg-white transition-all">
|
|
<option disabled="" value="">请选择</option>
|
|
<option selected="" value="US">US - 美国</option>
|
|
<option value="CN">CN - 中国</option>
|
|
<option value="JP">JP - 日本</option>
|
|
<option value="UK">UK - 英国</option>
|
|
<option value="DE">DE - 德国</option>
|
|
<option value="FR">FR - 法国</option>
|
|
</select>
|
|
<iconify-icon class="absolute right-3 top-1/2 -translate-y-1/2 text-gray-400 pointer-events-none text-xl" icon="mdi:chevron-down"></iconify-icon>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<label class="text-[13px] text-gray-500 font-medium mb-1.5 block">通讯方式</label>
|
|
<div class="relative">
|
|
<select class="w-full bg-gray-50 border border-gray-200 rounded-xl h-10 px-3 text-[14px] text-gray-800 outline-none appearance-none focus:border-blue-500 focus:bg-white transition-all">
|
|
<option disabled="" selected="" value="">请选择</option>
|
|
<option value="phone">电话</option>
|
|
<option value="email">邮件</option>
|
|
<option value="fax">传真</option>
|
|
</select>
|
|
<iconify-icon class="absolute right-3 top-1/2 -translate-y-1/2 text-gray-400 pointer-events-none text-xl" icon="mdi:chevron-down"></iconify-icon>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<label class="text-[13px] text-gray-500 font-medium mb-1.5 block">联系号码</label>
|
|
<div class="flex items-center bg-gray-50 border border-gray-200 rounded-xl h-10 px-3 focus-within:border-blue-500 focus-within:bg-white transition-all">
|
|
<input class="flex-1 bg-transparent text-[14px] text-gray-800 placeholder-gray-400 outline-none border-none" placeholder="请输入联系号码" type="text"/>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<label class="text-[13px] text-gray-500 font-medium mb-1.5 block">地址</label>
|
|
<div class="flex items-center bg-gray-50 border border-gray-200 rounded-xl h-10 px-3 focus-within:border-blue-500 focus-within:bg-white transition-all">
|
|
<input class="flex-1 bg-transparent text-[14px] text-gray-800 placeholder-gray-400 outline-none border-none" placeholder="请输入地址" type="text"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- 发货人信息 -->
|
|
<div class="bg-white rounded-2xl p-5 shadow-sm border border-gray-100/50">
|
|
<div class="flex items-center gap-2 mb-4">
|
|
<div class="w-1.5 h-4 bg-[#1A73E8] rounded-full"></div>
|
|
<h3 class="text-sm font-bold text-gray-900">发货人信息</h3>
|
|
</div>
|
|
<div class="space-y-4">
|
|
<div>
|
|
<label class="text-[13px] text-gray-500 font-medium mb-1.5 block">发货人名称</label>
|
|
<div class="flex items-center bg-gray-50 border border-gray-200 rounded-xl h-10 px-3 focus-within:border-blue-500 focus-within:bg-white transition-all">
|
|
<input class="flex-1 bg-transparent text-[14px] text-gray-800 placeholder-gray-400 outline-none border-none" placeholder="请输入发货人名称" type="text"/>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<label class="text-[13px] text-gray-500 font-medium mb-1.5 block">国家代码</label>
|
|
<div class="relative">
|
|
<select class="w-full bg-gray-50 border border-gray-200 rounded-xl h-10 px-3 text-[14px] text-gray-800 outline-none appearance-none focus:border-blue-500 focus:bg-white transition-all">
|
|
<option disabled="" value="">请选择</option>
|
|
<option selected="" value="US">US - 美国</option>
|
|
<option value="CN">CN - 中国</option>
|
|
<option value="JP">JP - 日本</option>
|
|
<option value="UK">UK - 英国</option>
|
|
<option value="DE">DE - 德国</option>
|
|
<option value="FR">FR - 法国</option>
|
|
</select>
|
|
<iconify-icon class="absolute right-3 top-1/2 -translate-y-1/2 text-gray-400 pointer-events-none text-xl" icon="mdi:chevron-down"></iconify-icon>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<label class="text-[13px] text-gray-500 font-medium mb-1.5 block">通讯方式</label>
|
|
<div class="relative">
|
|
<select class="w-full bg-gray-50 border border-gray-200 rounded-xl h-10 px-3 text-[14px] text-gray-800 outline-none appearance-none focus:border-blue-500 focus:bg-white transition-all">
|
|
<option disabled="" selected="" value="">请选择</option>
|
|
<option value="phone">电话</option>
|
|
<option value="email">邮件</option>
|
|
<option value="fax">传真</option>
|
|
</select>
|
|
<iconify-icon class="absolute right-3 top-1/2 -translate-y-1/2 text-gray-400 pointer-events-none text-xl" icon="mdi:chevron-down"></iconify-icon>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<label class="text-[13px] text-gray-500 font-medium mb-1.5 block">联系号码</label>
|
|
<div class="flex items-center bg-gray-50 border border-gray-200 rounded-xl h-10 px-3 focus-within:border-blue-500 focus-within:bg-white transition-all">
|
|
<input class="flex-1 bg-transparent text-[14px] text-gray-800 placeholder-gray-400 outline-none border-none" placeholder="请输入联系号码" type="text"/>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<label class="text-[13px] text-gray-500 font-medium mb-1.5 block">地址</label>
|
|
<div class="flex items-center bg-gray-50 border border-gray-200 rounded-xl h-10 px-3 focus-within:border-blue-500 focus-within:bg-white transition-all">
|
|
<input class="flex-1 bg-transparent text-[14px] text-gray-800 placeholder-gray-400 outline-none border-none" placeholder="请输入地址" type="text"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- 底部确定按钮 -->
|
|
<div class="px-5 py-4 shrink-0">
|
|
<button class="w-full bg-[#2563EB] text-white text-[15px] font-bold py-3.5 rounded-xl shadow-lg shadow-blue-500/30 active:scale-[0.98] transition-all" onclick="alert('补充信息已提交'); window.location.href='main.html'">
|
|
确定
|
|
</button>
|
|
<!-- Home Indicator -->
|
|
<div class="mt-4 flex justify-center">
|
|
<div class="w-32 h-1.5 bg-gray-200 rounded-full"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|