{extend name="public/base_jfm"/}
{block name="css"}
<style>
    .policy-item{width:90%;border:1px solid #eee;margin:20px auto 0 auto;padding:10px 10px;border-radius:10px;box-shadow: 0 0 10px #ccc;box-sizing: border-box;}
    .policy-header {font-size:15px;font-weight:bold;padding-bottom:10px;}
    .policy-footer {font-size:12px;display:flex;color:#8C8C8C;border-top:1px solid #ccc;padding-top:10px;}
    .policy-footer-left {white-space: nowrap;overflow: hidden;text-overflow: ellipsis;width:calc(100% - 100px);}
    .policy-footer-right {margin-left:auto;width:90px;}
</style>
{/block}
{block name="body"}
<img src="__MIMAGES__/header_jfm.png" style="border:none;margin:0;padding:0;width:100%;display:block;"/>
<div class="policy-list">
    <div class="policy-item" v-for="item in list" @click="toDetail(item.id)">
        <div class="policy-header">
            <van-image src="__MIMAGES__/icon_policy.png" height="14px"></van-image>
            {{item.title}}
        </div>
        <div class="policy-footer">
            <div class="policy-footer-left">{{item.government}}</div>
            <div class="policy-footer-right">{{item.publish_time}}</div>
        </div>
    </div>
</div>
{/block}
{block name="script"}
<script>
    function v_setup() {
        let base = {};

        base.list = {$list};
        base.toDetail = (id) => {
            location.href = "{:url('jfm/policyDetail')}?id="+id;
        };

        return base;
    }
</script>
{/block}
{block name="vue"}
<script src="__COMPONENTS__/voteList.js"></script>
{/block}