<script setup lang="ts">
    import successfulDialog from '@/components/ConfirmDialog/successfulDialog.vue'
    import { getCurrentDateTime } from '@/utils/date'
    import * as HomeAPI from '@/api/model/home'
    import { useUserStore } from '@/store/modules/user'

    const userStore = useUserStore()
    const consultRecord = reactive({
        id: '',
        mobile: '', // 咨询人号码
        consultTime: '', // 咨询时间
        bizType: 1, // 业务类型(1代理记账,2农资,3农机,4金融)
        enterpriseId: 1324324324, // 意向企业
        feedbackRemark: '', // 反馈备注
    })
    const pageData = reactive({
        showLogoutDialog: false,
    })
    onShow(() => {
        const { id, realname, phone } = userStore.getUserInfo
        consultRecord.id = id
        consultRecord.mobile = phone
        consultRecord.feedbackRemark = realname
    })
    // 立即申请
    function onApplyClick() {
        consultRecord.consultTime = getCurrentDateTime()
        HomeAPI.postConsultRecordAdd(consultRecord).then((res) => {
            pageData.showLogoutDialog = true
        })
    }
    // 提交申请
    function handleConfirmLogout() {
        pageData.showLogoutDialog = false
    }
    // 查看大图
    function onViewImage(imageUrl) {
        uni.previewImage({
            urls: [imageUrl],
        })
    }
</script>

<template>
    <view class="codefun-flex-col page">
        <view class="codefun-flex-col group_2">
            <view class="codefun-flex-col group_3">
                <view class="codefun-flex-col section_2">
                    <text class="codefun-self-start font text_2">代理记账政策</text>
                    <text class="codefun-self-stretch font_2 text_3">
                        为农场主提供专业、高效的财务管理解决方案，省时省心更省钱
                    </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/6d0a7c763a538e5bc93fa50d6dd4fc8f.png" />
                            <view class="codefun-mt-10 group_4">
                                <text class="font_3 text_4">99元</text>
                                <text class="font_4 text_5">/月起</text>
                            </view>
                            <text class="codefun-mt-10 font_5 text_9">价格低</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/3971dc28a5d847e08378fe0687e87cf4.png" />
                            <view class="group_4 mt-11">
                                <text class="font_3 text_6">10+</text>
                                <text class="font_4 text_7">项服务</text>
                            </view>
                            <text class="font_5 text_10 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/be09c7cafe008e9795f0f6a5df7928d8.png" />
                            <view class="group_4 mt-11">
                                <text class="font_3">24</text>
                                <text class="font_4 text_8">小时响应</text>
                            </view>
                            <text class="text_11 mt-11">效率高</text>
                        </view>
                    </view>
                </view>
                <view class="codefun-mt-12 codefun-flex-col section_4">
                    <text class="codefun-self-start font text_12">郴州市财汇商务咨询有限公司</text>
                    <text class="codefun-self-stretch font_6 text_13">
                        郴州市财汇商务咨询有限公司自2022年成立以来，业务发展迅速，客户群体以政府及公共机构为主。服务涵盖：
                    </text>
                    <view class="codefun-flex-col codefun-self-stretch group_5">
                        <view class="codefun-flex-row group_6">
                            <view class="codefun-shrink-0 codefun-self-start section_5 view" />
                            <view class="codefun-flex-1 group_7 ml-7">
                                <text class="font_2">村集体经济板块</text>
                                <text class="font_6"><br /></text>
                                <text class="font_6 text_14">
                                    与资兴农商行、市建行合作，为北湖区、资兴市近200个村集体在“互联网+监督”平台提供代理记账服务
                                </text>
                            </view>
                        </view>
                        <view class="codefun-mt-8 codefun-flex-row group_8">
                            <view class="codefun-shrink-0 codefun-self-start section_5 view_2" />
                            <view class="codefun-flex-1 group_9 ml-7">
                                <text class="font_2">专项审计板块</text>
                                <text class="font_6"><br /></text>
                                <text class="font_6">承接资兴市村干部任期经济审计、市教</text>
                                <text class="font_6 text_15">科院定期财务内审等</text>
                            </view>
                        </view>
                        <view class="codefun-mt-8 codefun-flex-row">
                            <view class="codefun-shrink-0 codefun-self-start section_5 view_3" />
                            <view class="codefun-flex-1 group_10 ml-7">
                                <text class="font_2">行政事业板块</text>
                                <text class="font_6 text_17">
                                    <br />
                                </text>
                                <text class="font_6 text_16"
                                    >为市委编办、市委组织部等20余家单位提供代理记账、资产盘点等服务</text
                                >
                            </view>
                        </view>
                        <view class="codefun-mt-8 codefun-flex-row group_11">
                            <view class="codefun-shrink-0 codefun-self-start section_5 view_4" />
                            <view class="codefun-flex-1 group_12 ml-7">
                                <text class="font_2">教育系统板块</text>
                                <text class="font_6 text_18">
                                    <br />
                                    完成桂阳县48所中小学食堂内审、桂阳一中/二中资产清查、市教育局校车成本核算等项目
                                </text>
                            </view>
                        </view>
                    </view>
                </view>
                <view class="codefun-mt-12 codefun-flex-col section_6">
                    <text class="codefun-self-start font">业务操作流程</text>
                    <view class="codefun-flex-col codefun-self-stretch section_7 mt-17">
                        <view class="codefun-flex-row codefun-items-center">
                            <view class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper">
                                <text class="font_7">1</text>
                            </view>
                            <text class="font_8 text_19 ml-13">村级报账</text>
                        </view>
                        <view
                            class="codefun-flex-row codefun-justify-center codefun-items-start codefun-relative group_13"
                        >
                            <view class="section_8 pos_2" />
                            <text class="font_9 text_20">报账员整理收支凭证，填写电子交接清单</text>
                        </view>
                        <view class="codefun-flex-row codefun-items-center group_14">
                            <view class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper">
                                <text class="font_7 text_21">2</text>
                            </view>
                            <text class="font_8 ml-13">乡镇报审</text>
                        </view>
                        <view class="codefun-flex-row group_15">
                            <view class="codefun-shrink-0 codefun-self-start section_9 view_5" />
                            <text class="codefun-flex-1 font_6 text_22 ml-27">
                                提交资料至乡镇审核员，审核通过后打印清单并签字交接
                            </text>
                        </view>
                        <view class="codefun-flex-row codefun-items-center group_16">
                            <view class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper">
                                <text class="font_10">3</text>
                            </view>
                            <text class="font_8 text_23 ml-13">报账资料传递</text>
                        </view>
                        <view class="codefun-flex-row codefun-items-start group_17">
                            <view class="codefun-shrink-0 section_9 view_6" />
                            <text class="font_9 text_24 ml-27">乡镇联络员将各村资料定期移交代理记账公司</text>
                        </view>
                        <view class="codefun-flex-row codefun-items-center group_18">
                            <view class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper">
                                <text class="font_7">4</text>
                            </view>
                            <text class="font_8 text_25 ml-13">记账处理</text>
                        </view>
                        <view class="codefun-flex-row codefun-justify-between codefun-items-start group_17">
                            <view class="section_9 view_6" />
                            <text class="font_9 text_26">记账员处理账务，并及时通知乡镇进行审核</text>
                        </view>
                        <view class="codefun-flex-row codefun-items-center group_19">
                            <view class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper">
                                <text class="font_7 text_27">5</text>
                            </view>
                            <text class="font_8 ml-13">审核处理</text>
                        </view>
                        <view class="codefun-flex-row group_20">
                            <view class="codefun-shrink-0 codefun-self-start section_9 view_7" />
                            <text class="codefun-flex-1 font_6 text_28 ml-27">
                                乡镇审核员复核记账凭证（科目、业务、数据），确保无误
                            </text>
                        </view>
                        <view class="codefun-flex-col group_21">
                            <view class="codefun-flex-row codefun-items-center codefun-self-stretch">
                                <view class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper">
                                    <text class="font_10">6</text>
                                </view>
                                <text class="font_8 text_29 ml-13">档案移交</text>
                            </view>
                            <text class="codefun-mt-2 codefun-self-end font_6 text_30">
                                记账员装订会计档案，移交乡镇存档并办理交接手续
                            </text>
                        </view>
                    </view>
                </view>
                <view class="codefun-mt-12 codefun-flex-col section_10">
                    <text class="codefun-self-start font text_31">公司资质</text>
                    <view class="codefun-mt-18 codefun-flex-row equal-division_2">
                        <view
                            class="codefun-flex-col codefun-justify-start codefun-items-center image-wrapper equal-division-item_2"
                            @click="onViewImage('/static/images/codefun/e10c098c837a0091dfe41ecd14dbaff5.png')"
                        >
                            <image class="image_7" src="/static/images/codefun/e10c098c837a0091dfe41ecd14dbaff5.png" />
                        </view>
                        <view
                            class="codefun-flex-col codefun-justify-start codefun-items-center image-wrapper equal-division-item_2 ml-15"
                            @click="onViewImage('/static/images/codefun/7ad157344b66cce4731d077aa759c0f9.png')"
                        >
                            <image class="image_7" src="/static/images/codefun/7ad157344b66cce4731d077aa759c0f9.png" />
                        </view>
                    </view>
                </view>
            </view>
            <view
                class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_2"
                @click="onApplyClick"
            >
                <text class="font_8 text_32">立即申请</text>
            </view>
        </view>

        <successfulDialog
            v-model:show="pageData.showLogoutDialog"
            title="申请成功"
            content="平台已收到申请，将尽快与您取得联系！"
            confirmText="我知道了"
            @confirm="handleConfirmLogout"
        />
    </view>
</template>

<style scoped lang="scss">
    .ml-5 {
        margin-left: 10rpx;
    }
    .mt-23 {
        margin-top: 46rpx;
    }
    .ml-11 {
        margin-left: 22rpx;
    }
    .mt-11 {
        margin-top: 22rpx;
    }
    .ml-7 {
        margin-left: 14rpx;
    }
    .mt-17 {
        margin-top: 34rpx;
    }
    .ml-27 {
        margin-left: 54rpx;
    }
    .ml-13 {
        margin-left: 26rpx;
    }
    .ml-15 {
        margin-left: 30rpx;
    }
    .page {
        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.64rpx;
                }
            }
        }
        .group_2 {
            padding: 0 28rpx 56rpx;
            .group_3 {
                padding: 28rpx 0 48rpx;
                .section_2 {
                    padding: 32rpx 24rpx 24rpx;
                    background-color: #ffffff;
                    border-radius: 16rpx;
                    mix-blend-mode: NOTTHROUGH;
                    .text_2 {
                        line-height: 30.02rpx;
                    }
                    .text_3 {
                        margin-top: 24rpx;
                        color: #666666;
                    }
                    .equal-division {
                        align-self: stretch;
                        margin-top: 20rpx;
                        .section_3 {
                            flex: 1 1 200.54rpx;
                            .image_6 {
                                width: 48rpx;
                                height: 48rpx;
                            }
                            .group_4 {
                                line-height: 24rpx;
                                .font_3 {
                                    font-size: 32rpx;
                                    font-family: SourceHanSansCN;
                                    line-height: 24rpx;
                                    color: #5db66f;
                                }
                                .text_4 {
                                    line-height: 27.24rpx;
                                }
                                .font_4 {
                                    font-size: 24rpx;
                                    font-family: SourceHanSansCN;
                                    line-height: 24rpx;
                                    color: #5db66f;
                                }
                                .text_5 {
                                    line-height: 24.52rpx;
                                }
                                .text_6 {
                                    line-height: 24.44rpx;
                                }
                                .text_7 {
                                    line-height: 22.34rpx;
                                }
                                .text_8 {
                                    line-height: 22.7rpx;
                                }
                            }
                            .font_5 {
                                font-size: 24rpx;
                                font-family: SourceHanSansCN;
                                line-height: 24rpx;
                                color: #999999;
                            }
                            .text_9 {
                                line-height: 22.32rpx;
                            }
                            .text_10 {
                                line-height: 22.32rpx;
                            }
                            .text_11 {
                                color: #999999;
                                font-size: 24rpx;
                                font-family: HarmonyOSSansSC;
                                line-height: 22.32rpx;
                            }
                        }
                        .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;
                        }
                    }
                }
                .section_4 {
                    padding: 36rpx 12rpx 24rpx 24rpx;
                    background-color: #ffffff;
                    border-radius: 11.76rpx;
                    mix-blend-mode: NOTTHROUGH;
                    .text_12 {
                        line-height: 30.2rpx;
                    }
                    .text_13 {
                        margin-top: 28rpx;
                        text-align: justify;
                    }
                    .group_5 {
                        margin-top: 16rpx;
                        .group_6 {
                            margin-right: 12rpx;
                            .view {
                                margin-top: 16rpx;
                            }
                            .group_7 {
                                height: 121.14rpx;
                                .text_14 {
                                    text-align: justify;
                                }
                            }
                        }
                        .group_8 {
                            margin-right: 12rpx;
                            .view_2 {
                                margin-top: 12rpx;
                            }
                            .group_9 {
                                height: 121.18rpx;
                                .text_15 {
                                    text-align: justify;
                                }
                            }
                        }
                        .section_5 {
                            background-color: #5db66f;
                            border-radius: 19998rpx;
                            width: 16rpx;
                            height: 16rpx;
                        }
                        .view_3 {
                            margin-top: 8rpx;
                        }
                        .group_10 {
                            height: 119.4rpx;
                            .text_17 {
                                color: #000000;
                            }
                            .text_16 {
                                text-align: justify;
                            }
                        }
                        .group_11 {
                            margin-right: 12rpx;
                            .view_4 {
                                margin-top: 12rpx;
                            }
                            .group_12 {
                                height: 119.62rpx;
                                .text_18 {
                                    text-align: justify;
                                }
                            }
                        }
                    }
                }
                .font_2 {
                    font-size: 28rpx;
                    font-family: SourceHanSansCN;
                    line-height: 40rpx;
                    color: #5db66f;
                }
                .section_6 {
                    padding: 40rpx 24rpx 24rpx;
                    background-color: #ffffff;
                    border-radius: 23.98rpx;
                    mix-blend-mode: NOTTHROUGH;
                    .section_7 {
                        padding: 20rpx 16rpx 20rpx 22rpx;
                        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;
                        .text-wrapper {
                            padding: 20rpx 0;
                            background-color: #5db66f;
                            border-radius: 19998rpx;
                            width: 60rpx;
                            height: 60rpx;
                            .font_7 {
                                font-size: 28rpx;
                                font-family: SourceHanSansCN;
                                line-height: 20.64rpx;
                                color: #ffffff;
                            }
                            .text_21 {
                                line-height: 21rpx;
                            }
                            .font_10 {
                                font-size: 28rpx;
                                font-family: SourceHanSansCN;
                                line-height: 21.4rpx;
                                color: #ffffff;
                            }
                            .text_27 {
                                line-height: 21.02rpx;
                            }
                        }
                        .text_19 {
                            line-height: 26.24rpx;
                        }
                        .group_13 {
                            margin-top: 12rpx;
                            padding: 0 30rpx 20rpx;
                            .section_8 {
                                background-color: #5db66f;
                                width: 2rpx;
                                height: 32rpx;
                            }
                            .pos_2 {
                                position: absolute;
                                left: 30rpx;
                                bottom: 0;
                            }
                            .text_20 {
                                line-height: 22.76rpx;
                            }
                        }
                        .group_14 {
                            margin-top: 24rpx;
                        }
                        .group_15 {
                            margin: 4rpx 4rpx 0 32rpx;
                            .view_5 {
                                margin-top: 32rpx;
                            }
                            .text_22 {
                                text-align: justify;
                            }
                        }
                        .group_16 {
                            margin-top: 20rpx;
                            .text_23 {
                                line-height: 26.3rpx;
                            }
                        }
                        .group_17 {
                            margin-top: 12rpx;
                            padding: 0 32rpx;
                            .view_6 {
                                margin-top: 12rpx;
                            }
                            .text_24 {
                                line-height: 22.48rpx;
                            }
                            .text_26 {
                                margin-right: 28rpx;
                                line-height: 22.7rpx;
                            }
                        }
                        .section_9 {
                            background-color: #5db66f;
                            width: 1.74rpx;
                            height: 32rpx;
                        }
                        .font_9 {
                            font-size: 24rpx;
                            font-family: SourceHanSansCN;
                            line-height: 24rpx;
                            color: #666666;
                        }
                        .group_18 {
                            margin-top: 24rpx;
                            .text_25 {
                                line-height: 26.1rpx;
                            }
                        }
                        .group_19 {
                            margin-top: 24rpx;
                        }
                        .group_20 {
                            margin-left: 32rpx;
                            margin-right: 4rpx;
                            .view_7 {
                                margin-top: 32rpx;
                            }
                            .text_28 {
                                text-align: justify;
                            }
                        }
                        .group_21 {
                            margin-right: 4rpx;
                            margin-top: 24rpx;
                            .text_29 {
                                line-height: 26.44rpx;
                            }
                            .text_30 {
                                text-align: justify;
                                width: 512rpx;
                            }
                        }
                    }
                }
                .font_6 {
                    font-size: 24rpx;
                    font-family: SourceHanSansCN;
                    line-height: 40rpx;
                    color: #666666;
                }
                .section_10 {
                    padding: 40rpx 24rpx 24rpx;
                    background-color: #ffffff;
                    border-radius: 16rpx;
                    mix-blend-mode: NOTTHROUGH;
                    .text_31 {
                        line-height: 29.76rpx;
                    }
                    .equal-division_2 {
                        align-self: stretch;
                        .image-wrapper {
                            flex: 1 1 307.6rpx;
                            .image_7 {
                                border-radius: 8rpx;
                                width: 266rpx;
                                height: 188rpx;
                            }
                        }
                        .equal-division-item_2 {
                            padding: 16rpx 0;
                            background-color: #f9fafb;
                            border-radius: 8rpx;
                            mix-blend-mode: NOTTHROUGH;
                            backdrop-filter: blur(4rpx);
                            height: 222rpx;
                            border-left: solid 2rpx #ffffff;
                            border-right: solid 2rpx #ffffff;
                            border-top: solid 2rpx #ffffff;
                            border-bottom: solid 2rpx #ffffff;
                        }
                    }
                }
            }
            .text-wrapper_2 {
                margin: 0 24rpx;
                padding: 24rpx 0;
                background-color: #ff9800;
                border-radius: 198rpx;
                .text_32 {
                    color: #ffffff;
                    line-height: 25.92rpx;
                }
            }
            .font_8 {
                font-size: 28rpx;
                font-family: SourceHanSansCN;
                line-height: 26.34rpx;
                color: #333333;
            }
        }
        .font {
            font-size: 32rpx;
            font-family: SourceHanSansCN;
            line-height: 29.8rpx;
            color: #333333;
        }
    }
</style>
