UNION_NSI/target/classes/views/mobile/contribution/sonList.html

<!--#
layout("/mobile/platform.html"){
#-->

<style>
    .backdrop {
        width: 100%;
        height: 170px;
    }

    .avatar {
        width: 100%;
        height: 100%;
    }

    .list-item {
        display: flex;
    }

    .list-item .left-img {
        flex: 1;
        display: flex;
        align-items: center;
    }

    .list-item .right-content {
        flex: 2;
        padding-left: 10px;
    }

    .right-content {
        height: 90px;
        width: calc(100% - 130px);
    }

    .right-content > div {
        height: 30px;
        line-height: 30px;
    }

    .right-content .r-title {
        font-size: 15px;
        font-weight: bold;
    }

    .right-content .r-content {
        font-size: 13px;
        color: #7f8481;
    }

    .typeName {
        margin-left: 10px;
        height: 70px;

    }

    .typeName .typeNameLabel {
        font-size: 17px;
        font-weight: bold;
        margin-bottom: 5px;
    }

    .typeName .typeNameContent {
        font-size: 15px;
        color: #7f8481;
    }

    .avatar .van-image__img {
        border-radius: 10px;

    }


    .list-card .van-cell {
        border-radius: 10px;
        padding: 18px 16px;
    }

    .van-cell-group {
        border-radius: 10px;
        height: 130px;
    }
</style>

<div id="app" v-cloak>
    <m-page-loading v-if="mLoading"></m-page-loading>
    <van-nav-bar
            title="项目专题"
            left-arrow
            placeholder
            fixed
            @click-left="history.back()"
            safe-area-inset-top
    ></van-nav-bar>

    <div style=" background-color:#ffffff;">
        <van-image
                class="backdrop"
                fit="cover"

                :src=" FILE_DOMAIN + '/fileStreamPreview?id=' + typeData.contributionTypeFiles[0].id"
        ></van-image>
        <div class="typeName">
            <div class="typeNameLabel">{{typeData.typeName}}
                <van-tag type="danger" round>专题</van-tag>
            </div>
            <div class="van-multi-ellipsis--l2 typeNameContent">
                {{removeHTMLTag(typeData.contributionTypeIntroduce)}}
            </div>

        </div>
    </div>

    <div style="margin: 20px auto 0 auto">
        <van-list :finished="finished">
            <div v-for="o in sonData" class="list-card" @click="openContribution(o)">
                <van-cell-group inset>
                    <van-cell :border="false">
                        <div class="list-item">

                            <div class="left-img">
                                <van-image
                                        class="avatar"
                                        fit="cover"
                                        :src=" FILE_DOMAIN + '/fileStreamPreview?id=' + o.contributionFiles[0].id"
                                ></van-image>
                            </div>
                            <div class="right-content">
                                <div class="r-title">{{o.contributionName}}</div>
                                <div class="van-ellipsis r-content">
                                    {{removeHTMLTag(o.contributionIntroduce)}}
                                </div>
                                <div>
                                    <van-row type="flex" justify="space-between"
                                             style="white-space: nowrap">
                                        <van-col span="12">
                                            已筹：
                                            <sapn style="color: red">
                                                {{o.totalMoney?o.totalMoney:0}}
                                            </sapn>
                                            元
                                        </van-col>
                                        <van-col span="12" class="text-right">
                                            人次：
                                            <sapn style="color: red">{{o.totalUser}}</sapn>
                                            人
                                        </van-col>
                                    </van-row>
                                </div>

                            </div>
                        </div>

                    </van-cell>
                </van-cell-group>
            </div>
        </van-list>
    </div>

</div>

<script>
    var vue = new Vue({
        el: '#app',
        mixins: [mobileMixins],
        data() {
            return {
                sonData: [],
                typeData: {},
            }
        },
        methods: {
            openContribution(data) {
                const time = moment().format('YYYY-MM-DD HH:mm:ss')
                if (!data.sonNum) {
                    if (time < data.contributionStartTime) {
                        this.$toast(data.contributionStartTime + '开始捐款');
                        return;
                    }
                    if (time > data.contributionEndTime) {
                        this.$toast('捐款在' + data.contributionEndTime + '结束');
                        return;
                    }
                }
                window.location.href = '/mobile/contribution/view/contributionView?id=' + data.id
            },
            async pageData(typeCode) {
                const {data} = await $.get("/mobile/contribution/son/pageData", {typeCode: typeCode})
                data.forEach(v => {
                    v.contributionFiles = JSON.parse(v.contributionFiles)
                })
                this.sonData = data
            },
            async getTypeByCode(typeCode) {
                const {data} = await $.get("/mobile/contribution/son/getTypeByCode", {typeCode: typeCode})
                this.typeData = data
            }
        },
        created() {
            const typeCode = this.GetQueryString("typeCode")
            this.pageData(typeCode)
            this.getTypeByCode(typeCode)
        }
    })
</script>


<!--#
}
#-->