lw_test/app/mobile/view/human/guide.html

{extend name="public/base_human"/}
{block name="css"}
<style>
    .box {width:100%;box-sizing: border-box;padding:0 20px 20px 20px;}
    .title {color:#0070C0;font-size:20px;text-align: center;}
    .sub-title {color:#0070C0;margin-bottom: 0;font-weight: bold;}
    .content {text-indent: 2em;}
    .mt-5 {margin-top:5px;}
    .mb-5 {margin-bottom: 5px;}
    .t0 {text-indent: 0;}
    .company {display: block;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>

<img src="/static/mobile/images/human/guide1.png" @click="showImage(0)" class="company" alt="">
<img src="/static/mobile/images/human/guide2.png" @click="showImage(1)" class="company" alt="">
<img src="/static/mobile/images/human/guide3.png" @click="showImage(2)" class="company" alt="">
<img src="/static/mobile/images/human/guide4.png" @click="showImage(3)" class="company" alt="">
<img src="/static/mobile/images/human/guide5.png" @click="showImage(4)" class="company" alt="">
<img src="/static/mobile/images/human/guide6.png" @click="showImage(5)" class="company" alt="">
<img src="/static/mobile/images/human/guide7.png" @click="showImage(6)" class="company" alt="">
<img src="/static/mobile/images/human/guide8.png" @click="showImage(7)" class="company" alt="">
<img src="/static/mobile/images/human/guide9.png" @click="showImage(8)" class="company" alt="">
<img src="/static/mobile/images/human/guide10.png" @click="showImage(9)" class="company" alt="">
<img src="/static/mobile/images/human/guide11.png" @click="showImage(10)" class="company" alt="">

{/block}
{block name="script"}
<script>
    function v_setup() {
        let base = {};

        base.onBack = () => {
            history.back();
        };

        base.showImage = (index) => {
            vant.showImagePreview({
                images:[
                    '/static/mobile/images/human/guide1.png',
                    '/static/mobile/images/human/guide2.png',
                    '/static/mobile/images/human/guide3.png',
                    '/static/mobile/images/human/guide4.png',
                    '/static/mobile/images/human/guide5.png',
                    '/static/mobile/images/human/guide6.png',
                    '/static/mobile/images/human/guide7.png',
                    '/static/mobile/images/human/guide8.png',
                    '/static/mobile/images/human/guide9.png',
                    '/static/mobile/images/human/guide10.png',
                    '/static/mobile/images/human/guide11.png',
                ],
                startPosition: index,
            });
        };

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