lw_test/app/mobile/view/vote/detail.html

{extend name="public/base"/}
{block name="css"}
<style>
    .article{
        background:white;
        padding:0 10px;
        margin-bottom:10px;
    }

    .article h3{
        padding:10px 0;
        margin:0;
    }

    .article .article-info{
        align-items:center;
        display:flex;
        justify-content:space-between;
        margin:5px;
        font-size:12px;
    }

    .article .article-info .s-time{
        color:#b4b4b4;
    }

    .article .article-info .s-comment{
        background:#f5f7f9;
        border-radius:5px;
        flex-shrink:0;
        font-size:14px;
        padding:5px 10px;
    }

    .content{
        padding-bottom:1px;
    }

    .content, .content img{
        max-width:100%;
    }
</style>
{/block}
{block name="body"}
<van-nav-bar
        class="nav-theme"
        :fixed="true"
        :placeholder="true"
        left-text="返回"
        left-arrow
        @click-left="onBack"
>
    <template #title>
        <span class="text-white">活动详情</span>
    </template>
</van-nav-bar>

<div class="article">
    <header>
        <h3>{$info.title}</h3>
        <section class="article-info">
            <div class="s-author">
                <div class="s-time">
                    <time>{$info.start_time} 至 {$info.end_time}</time>
                </div>
            </div>
        </section>
    </header>
    <section class="content">
        {$info.content}
    </section>
</div>

<van-radio-group v-model="checked" :disabled="is_apply">
    <van-cell-group inset>
        {volist name="info.option" id="v"}
        <van-cell title="{$v}" clickable @click="onOption('{$v}')">
            <template #right-icon>
                <van-radio name="{$v}"></van-radio>
            </template>
        </van-cell>
        {/volist}
        <van-button type="primary" block @click="submit" v-if="!is_apply">提交</van-button>
    </van-cell-group>
</van-radio-group>
{/block}
{block name="script"}
<script>
    function v_setup() {
        let base = {};

        base.is_click = false;
        base.is_apply = Vue.ref({$is_apply});
        base.checked = Vue.ref('{$option_name}');
        base.onBack = () => {
            location.href = "{:url('/')}";
        };
        base.onOption = (v) => {
            if (base.is_apply.value) {
                return false;
            }
            base.checked.value = v;
        };
        base.submit = () => {
            if (base.is_click) {
                return false;
            }
            base.is_click = true;
            if (base.checked.value === '') {
                vant.showFailToast('请选择投票的项目');
                base.is_click = false;
                return false;
            }
            postJson('/vote/apply', {option_name: base.checked.value, id: {$info.id}}).then(({data, code}) => {
                base.is_click = false;
                if (code === 0) {
                    vant.showSuccessToast('投票成功');
                    base.is_apply.value = true;
                }
            })
        };

        return base;
    }
</script>
{/block}