ShipOwner_WxApp/miniprogram/pages/takePhoto/takePhoto.wxml

<!-- pages/takePhoto/takePhoto.wxml -->
<view class="container">
    <!-- 顶部标题 -->
    <view class="header">内河干散货运输船东服务</view>
    <!-- 内容区域 -->
    <view class="content">
        <!-- 签到、拍货物、拍单据按钮 -->
        <view class="btn-group">
            <view class="btn btn-green" bindtap="onSignIn">签到</view>
            <view class="btn btn-blue" bindtap="onTakeCargoPhoto">拍货物</view>
            <view class="btn btn-red" bindtap="onTakeDocPhoto">拍单据</view>
        </view>
        <!-- 码头服务查询 -->
        <view class="card">
            <view class="card-header">码头服务查询</view>
            <view class="card-content">
                <!-- 搜索栏 -->
                <view class="search-box">
                    <input type="text" class="search-input" placeholder="输入关键词搜索" />
                    <view class="search-btn">搜索</view>
                </view>
                <!-- 热门推荐 -->
                <view class="section-title">热门推荐</view>
                <view class="hot-services">
                    <view class="service-item df">
                        <view class="df aic">
                            <view class="service-name">张师傅</view>
                            <view class="service-type">机械维修</view>
                        </view>
                        <view class="btn btn-phone" data-phone="13800138001">
                            <image class="tel" src="../../images/tel-f.png"></image>
                            拨打电话
                        </view>
                    </view>
                    <view class="service-item">
                        <view class="df aic">
                            <view class="service-name">李经理</view>
                            <view class="service-type">船舶补给</view>
                        </view>
                        <view class="btn btn-phone" data-phone="13800138002">
                            <image class="tel" src="../../images/tel-f.png"></image>
                            拨打电话
                        </view>
                    </view>
                    <view class="service-item">
                        <view class="df aic">
                            <view class="service-name">王工</view>
                            <view class="service-type">电气维修</view>
                        </view>
                        <view class="btn btn-phone" data-phone="13800138003">
                            <image class="tel" src="../../images/tel-f.png"></image>
                            拨打电话
                        </view>
                    </view>
                    <view class="service-item">
                        <view class="df aic">
                            <view class="service-name">赵队长</view>
                            <view class="service-type">应急救援</view>
                        </view>
                        <view class="btn btn-phone" data-phone="13800138004">
                            <image class="tel" src="../../images/tel-f.png"></image>
                            拨打电话
                        </view>
                    </view>
                </view>
                <!-- 水位信息 -->
                <view class="section-title">水位信息</view>
                <view class="water-level-info">
                    <view class="water-level-item">
                        <view class="water-level-station">九江站</view>
                        <view class="water-level-value">15.2米</view>
                        <view class="water-level-trend rising">↑ 0.3米</view>
                    </view>
                    <view class="water-level-item">
                        <view class="water-level-station">武汉站</view>
                        <view class="water-level-value">18.5米</view>
                        <view class="water-level-trend falling">↓ 0.2米</view>
                    </view>
                    <view class="water-level-item">
                        <view class="water-level-station">南京站</view>
                        <view class="water-level-value">10.1米</view>
                        <view class="water-level-trend stable">→ 0.0米</view>
                    </view>
                </view>
            </view>
        </view>
        <!-- 新能源船舶政策解读 -->
        <view class="card">
            <view class="card-header">新能源船舶政策解读</view>
            <view class="card-content">
                <!-- 拆船政策 -->
                <view class="section-title mt0">拆船政策</view>
                <view class="policy-table">
                    <view class="policy-header">
                        <view class="policy-cell">吨位</view>
                        <view class="policy-cell">补贴额度</view>
                    </view>
                    <view class="policy-row">
                        <view class="policy-cell">500</view>
                        <view class="policy-cell">30万元/艘</view>
                    </view>
                    <view class="policy-row">
                        <view class="policy-cell">1000</view>
                        <view class="policy-cell">50万元/艘</view>
                    </view>
                    <view class="policy-row">
                        <view class="policy-cell">2000</view>
                        <view class="policy-cell">80万元/艘</view>
                    </view>
                </view>
                <!-- 造船政策 -->
                <view class="section-title">造船政策</view>
                <view class="policy-table">
                    <view class="policy-header">
                        <view class="policy-cell">吨位</view>
                        <view class="policy-cell">新能源类型</view>
                        <view class="policy-cell">补贴额度</view>
                    </view>
                    <view class="policy-row">
                        <view class="policy-cell">500</view>
                        <view class="policy-cell">电力推进</view>
                        <view class="policy-cell">50万元/艘</view>
                    </view>
                    <view class="policy-row">
                        <view class="policy-cell">1000</view>
                        <view class="policy-cell">LNG动力</view>
                        <view class="policy-cell">80万元/艘</view>
                    </view>
                    <view class="policy-row">
                        <view class="policy-cell">2000</view>
                        <view class="policy-cell">混合动力</view>
                        <view class="policy-cell">100万元/艘</view>
                    </view>
                </view>
            </view>
        </view>
        <!-- 智能服务 -->
        <view class="card">
            <view class="card-header">智能服务</view>
            <view class="card-content">
                <view class="list-item">
                    <view class="tag tag-warning">提醒</view>
                    您的船舶年检即将到期，到期日期：2023年12月31日
                </view>
                <view class="list-item">
                    <view class="tag tag-danger">提醒</view>
                    您有3本证书即将到期
                    <view style="margin-top: 10px">
                        <view class="cert-item">
                            <view>船舶检验证书</view>
                            <view class="expire-date">到期时间：2023年12月15日</view>
                        </view>
                        <view class="cert-item">
                            <view>船舶营运证</view>
                            <view class="expire-date">到期时间：2023年12月20日</view>
                        </view>
                        <view class="cert-item">
                            <view>船员适任证书</view>
                            <view class="expire-date">到期时间：2023年12月25日</view>
                        </view>
                    </view>
                </view>
                <view class="list-item">
                    <view class="tag">提醒</view>
                    您有2个船员资质可升级
                    <view style="margin-top: 10px">
                        <view class="cert-item">
                            <view>三副</view>
                            <view class="upgrade-info">可升级为：二副</view>
                        </view>
                        <view class="cert-item">
                            <view>机工</view>
                            <view class="upgrade-info">可升级为：三管轮</view>
                        </view>
                    </view>
                </view>
                <view class="list-item contact-info">
                    <view class="mb20">船舶年检证书办理与资质请联系朱经理</view>
                    <view class="btn btn-phone" data-phone="13800138000">拨打电话</view>
                </view>
            </view>
        </view>
        <!-- 搜查附近货盘 -->
        <view class="card">
            <view class="card-header">搜查附近货盘</view>
            <view class="card-content">
                <view class="search-box">
                    <input type="text" class="search-input" placeholder="输入关键词搜索" />
                    <view class="search-btn">搜索</view>
                </view>
                <view class="map-container">
                    <view>地图区域 - 显示船舶与货盘</view>
                    <!-- 这里可以使用微信小程序的map组件替换 -->
                    <view class="map-marker ship"></view>
                    <view class="map-marker cargo" style="top: 30%; left: 60%"></view>
                    <view class="map-marker cargo" style="top: 50%; left: 30%"></view>
                    <view class="map-marker cargo" style="top: 60%; left: 55%"></view>
                </view>
                <!-- 货盘列表 -->
                <view class="cargo-list">
                    <view class="cargo-item">
                        <view class="cargo-info">
                            <text class="cargo-type">煤炭</text>
                            <view>| 南京港 → 芜湖港 |</view>
                            <view>3000吨</view>
                        </view>
                        <view class="cargo-meta">
                            <view class="cargo-distance">距离: 约50公里</view>
                            <view class="btn btn-phone" data-phone="13900139001">
                                <image class="tel" src="../../images/tel-f.png"></image>
                                拨打电话
                            </view>
                        </view>
                    </view>
                    <view class="cargo-item">
                        <view class="cargo-info">
                            <text class="cargo-type">砂石</text>
                            <view>| 马鞍山港 → 安庆港 |</view>
                            <view>5000吨</view>
                        </view>
                        <view class="cargo-meta">
                            <view class="cargo-distance">距离: 约80公里</view>
                            <view class="btn btn-phone" data-phone="13900139002">
                                <image class="tel" src="../../images/tel-f.png"></image>
                                拨打电话
                            </view>
                        </view>
                    </view>
                    <view class="cargo-item">
                        <view class="cargo-info">
                            <text class="cargo-type">水泥</text>
                            <view>| 芜湖港 → 九江港 |</view>
                            <view>2000吨</view>
                        </view>
                        <view class="cargo-meta">
                            <view class="cargo-distance">距离: 约120公里</view>
                            <view class="btn btn-phone" data-phone="13900139003">
                                <image class="tel" src="../../images/tel-f.png"></image>
                                拨打电话
                            </view>
                        </view>
                    </view>
                </view>
            </view>
        </view>
    </view>
</view>