<script>
    export default {
        components: {},
        props: {},
        data() {
            return {}
        },

        methods: {},
    }
</script>

<template>
    <view class="codefun-flex-col page">
        <view class="codefun-mt-14 codefun-flex-col group_2">
            <view class="codefun-flex-row group_3">
                <view class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper">
                    <text class="font_2 text_2">惠农贷款</text>
                </view>
                <view class="codefun-ml-10 codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_2">
                    <text class="font_3 text_3">振兴贷款</text>
                </view>
                <view class="codefun-ml-10 codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_2">
                    <text class="font_3 text_4">灾害保险</text>
                </view>
                <view class="codefun-ml-10 codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_2">
                    <text class="font_3 text_5">价格保险</text>
                </view>
                <view
                    class="codefun-ml-10 codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_2 view"
                >
                    <text class="font_3 text_5">更多服务</text>
                </view>
            </view>
            <view class="codefun-mt-22 codefun-flex-col section_2">
                <text class="codefun-self-start font text_6">惠农贷款政策</text>
                <text class="codefun-self-start font_2 text_7">面向新型农业经营主体，提供便捷资金支持</text>
                <view class="codefun-flex-row equal-division">
                    <view class="codefun-flex-col codefun-items-center section_3 equal-division-item">
                        <image class="image_6" src="/static/images/codefun/65805aa8bc30e1adb6350da711c623c5.png" />
                        <text class="font_4 mt-11">5-50万</text>
                        <text class="font_5 mt-11">额度高</text>
                    </view>
                    <view class="codefun-flex-col codefun-items-center section_3 equal-division-item ml-11">
                        <image class="image_6" src="/static/images/codefun/80992404de789827f849f53777c64863.png" />
                        <text class="codefun-mt-10 font_4">3.85%起</text>
                        <text class="codefun-mt-10 font_5">利率低</text>
                    </view>
                    <view class="codefun-flex-col codefun-items-center section_3 equal-division-item ml-11">
                        <image class="image_6" src="/static/images/codefun/c67aaf6f01b1cbde47843318ac8be555.png" />
                        <text class="codefun-mt-10 font_4">最长3年</text>
                        <text class="codefun-mt-10 font_6">期限长</text>
                    </view>
                </view>
                <text class="codefun-self-start font text_8">申请条件</text>
                <view class="codefun-flex-col codefun-self-stretch section_4">
                    <view class="codefun-flex-row codefun-items-center">
                        <view class="section_5" />
                        <text class="font_2 text_9 ml-9">年龄18-65周岁，具有完全民事行为能力</text>
                    </view>
                    <view class="codefun-flex-row codefun-items-center mt-15">
                        <view class="section_5" />
                        <text class="font_2 text_10 ml-9">具有本地户籍或有效居住证明</text>
                    </view>
                    <view class="codefun-flex-row codefun-items-center mt-15">
                        <view class="section_5" />
                        <text class="font_2 text_11 ml-9">从事农业生产经营或农产品加工活动</text>
                    </view>
                    <view class="codefun-flex-row codefun-items-center mt-15">
                        <view class="section_5" />
                        <text class="font_2 text_12 ml-9">信用记录良好，无不良征信记录</text>
                    </view>
                </view>
                <text class="codefun-self-start font text_13">办理流程</text>
                <view class="codefun-flex-col codefun-self-stretch section_6">
                    <view class="codefun-flex-row codefun-justify-between codefun-items-center group_4">
                        <view class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_3">
                            <text class="font_7 text_14">1</text>
                        </view>
                        <view class="section_7" />
                        <view class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_3">
                            <text class="font_7 text_15">2</text>
                        </view>
                        <view class="section_7" />
                        <view class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_3">
                            <text class="font_7 text_16">3</text>
                        </view>
                        <view class="section_7" />
                        <view class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_3 view_2">
                            <text class="font_7 text_17">4</text>
                        </view>
                    </view>
                    <view class="codefun-flex-row codefun-justify-between mt-9">
                        <text class="font_8 text_18">提交申请</text>
                        <text class="font_8 text_19">资料审核</text>
                        <text class="font_8 text_20">签约授信</text>
                        <text class="font_8 text_21">放款到账</text>
                    </view>
                </view>
                <text class="codefun-self-start font text_22">申请案例</text>
                <view class="codefun-flex-row equal-division_2">
                    <view class="codefun-flex-col codefun-items-center section_8 equal-division-item_2">
                        <text class="font_9">576人</text>
                        <text class="font_5 text_23 mt-11">本县已申请</text>
                    </view>
                    <view class="codefun-flex-col codefun-items-center section_8 equal-division-item_2 ml-11">
                        <text class="font_9">3天</text>
                        <text class="font_5 text_23 mt-11">平均放款</text>
                    </view>
                    <view class="codefun-flex-col codefun-items-center section_8 equal-division-item_2 ml-11">
                        <text class="font_9">98%</text>
                        <text class="font_6 text_23 mt-11">满意度</text>
                    </view>
                </view>
                <view class="codefun-flex-col codefun-self-stretch section_9">
                    <view class="codefun-flex-row codefun-justify-between codefun-items-center codefun-self-stretch">
                        <view class="codefun-flex-row codefun-items-center">
                            <image
                                class="codefun-shrink-0 image_7"
                                src="/static/images/codefun/a3188845d5d70f8bff3e95dcca8e2ff3.png"
                            />
                            <text class="font_2 text_24 ml-9">李**</text>
                        </view>
                        <view class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_4">
                            <text class="font_5 text_25">农户认证</text>
                        </view>
                    </view>
                    <text class="codefun-mt-10 codefun-self-stretch font_2 text_26">
                        种植大户，申请20万元贷款用于扩大生产模，3天放款，节省利息8000元/年
                    </text>
                    <text class="codefun-mt-10 codefun-self-start font_5 text_27">2025.09.10</text>
                </view>
            </view>
        </view>
    </view>
</template>

<style scoped lang="scss">
    .ml-5 {
        margin-left: 10rpx;
    }
    .mt-23 {
        margin-top: 46rpx;
    }
    .mt-15 {
        margin-top: 30rpx;
    }
    .mt-9 {
        margin-top: 18rpx;
    }
    .ml-11 {
        margin-left: 22rpx;
    }
    .mt-11 {
        margin-top: 22rpx;
    }
    .ml-9 {
        margin-left: 18rpx;
    }
    .page {
        padding-bottom: 28rpx;
        background-color: #e6f5e8;
        mix-blend-mode: NOTTHROUGH;
        width: 100%;
        overflow-y: auto;
        overflow-x: hidden;
        height: 100%;
        .section {
            padding: 26rpx 28rpx 32rpx 36rpx;
            background-color: #5db66f;
            mix-blend-mode: NOTTHROUGH;
            .image {
                border-radius: 64rpx;
                width: 108rpx;
                height: 42rpx;
            }
            .image_2 {
                mix-blend-mode: NOTTHROUGH;
                width: 34rpx;
                height: 22rpx;
            }
            .image_3 {
                mix-blend-mode: NOTTHROUGH;
                width: 30rpx;
                height: 22rpx;
            }
            .image_4 {
                width: 48rpx;
                height: 22rpx;
            }
            .group {
                padding: 0 6rpx;
                .image_5 {
                    mix-blend-mode: NOTTHROUGH;
                    width: 14rpx;
                    height: 26rpx;
                }
                .pos {
                    position: absolute;
                    left: 6rpx;
                    top: 50%;
                    transform: translateY(-50%);
                }
                .text {
                    color: #ffffffe6;
                    line-height: 29.8rpx;
                }
            }
        }
        .group_2 {
            padding-left: 28rpx;
            .group_3 {
                overflow-x: auto;

                .text-wrapper {
                    padding: 24rpx;
                    background-color: #5db66f;
                    border-radius: 19998rpx;
                    mix-blend-mode: NOTTHROUGH;
                    height: 72rpx;
                    .text_2 {
                        color: #ffffff;
                        line-height: 25.92rpx;
                    }
                }
                .text-wrapper_2 {
                    padding: 24rpx;
                    background-color: #ffffff;
                    border-radius: 19998rpx;
                    mix-blend-mode: NOTTHROUGH;
                    height: 72rpx;
                    .font_3 {
                        font-size: 28rpx;
                        font-family: DingTalk Sans;
                        line-height: 27.42rpx;
                        color: #1f2937;
                    }
                    .text_3 {
                        line-height: 25.92rpx;
                    }
                    .text_4 {
                        line-height: 26.02rpx;
                    }
                    .text_5 {
                        line-height: 26.18rpx;
                    }
                }
                .view {
                    margin-right: 20rpx;
                }
            }
            .section_2 {
                margin-right: 28rpx;
                padding: 16rpx 24rpx 24rpx;
                background-color: #ffffff;
                border-radius: 17.54rpx;
                mix-blend-mode: NOTTHROUGH;
                .text_6 {
                    line-height: 29.96rpx;
                }
                .text_7 {
                    margin-top: 32rpx;
                    line-height: 26.54rpx;
                }
                .equal-division {
                    align-self: stretch;
                    margin-top: 20rpx;
                    .section_3 {
                        flex: 1 1 200.54rpx;
                        .image_6 {
                            width: 48rpx;
                            height: 48rpx;
                        }
                        .font_4 {
                            font-size: 32rpx;
                            font-family: DingTalk Sans;
                            line-height: 27.42rpx;
                            color: #5db66f;
                        }
                    }
                    .equal-division-item {
                        padding: 16rpx 0;
                        background-color: #f9fafb;
                        border-radius: 16rpx;
                        mix-blend-mode: NOTTHROUGH;
                        backdrop-filter: blur(4rpx);
                        height: 178rpx;
                        border-left: solid 2rpx #ffffff;
                        border-right: solid 2rpx #ffffff;
                        border-top: solid 2rpx #ffffff;
                        border-bottom: solid 2rpx #ffffff;
                    }
                }
                .text_8 {
                    margin-top: 40rpx;
                    line-height: 29.76rpx;
                }
                .section_4 {
                    margin-top: 24rpx;
                    padding: 24rpx 16rpx;
                    background-color: #f9fafb;
                    border-radius: 16rpx;
                    mix-blend-mode: NOTTHROUGH;
                    backdrop-filter: blur(4rpx);
                    border-left: solid 2rpx #ffffff;
                    border-right: solid 2rpx #ffffff;
                    border-top: solid 2rpx #ffffff;
                    border-bottom: solid 2rpx #ffffff;
                    .section_5 {
                        background-color: #5db66f;
                        border-radius: 19998rpx;
                        width: 16rpx;
                        height: 16rpx;
                    }
                    .text_9 {
                        line-height: 26.62rpx;
                    }
                    .text_10 {
                        line-height: 25.98rpx;
                    }
                    .text_11 {
                        line-height: 25.9rpx;
                    }
                    .text_12 {
                        line-height: 26.54rpx;
                    }
                }
                .text_13 {
                    margin-top: 40rpx;
                }
                .section_6 {
                    margin-top: 24rpx;
                    padding: 24rpx 32rpx 24rpx 40rpx;
                    background-color: #f9fafb;
                    border-radius: 16rpx;
                    mix-blend-mode: NOTTHROUGH;
                    backdrop-filter: blur(4rpx);
                    border-left: solid 2rpx #ffffff;
                    border-right: solid 2rpx #ffffff;
                    border-top: solid 2rpx #ffffff;
                    border-bottom: solid 2rpx #ffffff;
                    .group_4 {
                        padding: 0 16rpx;
                        .text-wrapper_3 {
                            padding: 20rpx 0;
                            background-color: #5db66f;
                            border-radius: 19998rpx;
                            width: 60rpx;
                            height: 60rpx;
                            .font_7 {
                                font-size: 28rpx;
                                font-family: DingTalk Sans;
                                line-height: 21.96rpx;
                                color: #ffffff;
                            }
                            .text_14 {
                                line-height: 20.64rpx;
                            }
                            .text_15 {
                                line-height: 21rpx;
                            }
                            .text_16 {
                                line-height: 21.4rpx;
                            }
                            .text_17 {
                                line-height: 20.64rpx;
                            }
                        }
                        .section_7 {
                            background-color: #5db66f;
                            width: 40rpx;
                            height: 1.74rpx;
                        }
                        .view_2 {
                            margin-right: 8rpx;
                        }
                    }
                    .font_8 {
                        font-size: 24rpx;
                        font-family: DingTalk Sans;
                        line-height: 21.96rpx;
                        color: #666666;
                    }
                    .text_18 {
                        line-height: 22.28rpx;
                    }
                    .text_19 {
                        line-height: 22.2rpx;
                    }
                    .text_20 {
                        line-height: 22.18rpx;
                    }
                    .text_21 {
                        line-height: 22.18rpx;
                    }
                }
                .text_22 {
                    margin-top: 40rpx;
                    line-height: 29.92rpx;
                }
                .equal-division_2 {
                    align-self: stretch;
                    margin-top: 32rpx;
                    .section_8 {
                        flex: 1 1 200.36rpx;
                        .font_9 {
                            font-size: 32rpx;
                            font-family: DingTalk Sans;
                            line-height: 24.44rpx;
                            color: #5db66f;
                        }
                        .text_23 {
                            line-height: 22.08rpx;
                        }
                    }
                    .equal-division-item_2 {
                        padding: 28rpx 0 16rpx;
                        background-color: #f9fafb;
                        border-radius: 16rpx;
                        mix-blend-mode: NOTTHROUGH;
                        backdrop-filter: blur(4rpx);
                        height: 120rpx;
                        border-left: solid 2rpx #ffffff;
                        border-right: solid 2rpx #ffffff;
                        border-top: solid 2rpx #ffffff;
                        border-bottom: solid 2rpx #ffffff;
                    }
                }
                .font_5 {
                    font-size: 24rpx;
                    font-family: DingTalk Sans;
                    line-height: 21.96rpx;
                    color: #999999;
                }
                .font_6 {
                    font-size: 24rpx;
                    font-family: HarmonyOSSansSC;
                    line-height: 21.96rpx;
                    color: #999999;
                }
                .section_9 {
                    margin-top: 16rpx;
                    padding: 24rpx 24rpx 28rpx;
                    background-color: #f9fafb;
                    border-radius: 16rpx;
                    .image_7 {
                        width: 64rpx;
                        height: 64rpx;
                    }
                    .text_24 {
                        color: #5db66f;
                        line-height: 25.68rpx;
                    }
                    .text-wrapper_4 {
                        padding: 8rpx 0;
                        background-color: #5db66f33;
                        border-radius: 19998rpx;
                        width: 128rpx;
                        height: 40rpx;
                        .text_25 {
                            color: #5db66f;
                            line-height: 22.34rpx;
                        }
                    }
                    .text_26 {
                        line-height: 40rpx;
                        text-align: justify;
                    }
                    .text_27 {
                        line-height: 18.22rpx;
                    }
                }
            }
            .font_2 {
                font-size: 28rpx;
                font-family: DingTalk Sans;
                line-height: 27.42rpx;
                color: #666666;
            }
        }
        .font {
            font-size: 32rpx;
            font-family: DingTalk Sans;
            line-height: 29.88rpx;
            color: #333333;
        }
    }
</style>
