user.vue.html

<meta http-equiv="cache-control" content="no-cache" />
<script src="//cdn.jsdelivr.net/npm/vue@2"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.21/lodash.min.js"></script>


<div id="app" width="100%">
    <div v-if="loaded">
        <p><small> This list was autogenerated from <a href="https://www.mtmt.hu/">MTMT</a> on {{date}}. Generate your <a href="https://github.com/ferdinandyb/mtmt-publist">own</a>. </small></p>
    <ol>
        <li v-for="a in orderedArticles">
            <span v-for="w in _.orderBy(a.Authors,'Index')">
                <b v-if="w.IsUser == true">{{w.FamilyName}}, {{w.GivenName[0]}}., </b>
                <span v-else>{{w.FamilyName}}, {{w.GivenName[0]}}., </span>
            </span>
            <i><a v-bind:href="a.Doi">{{a.Title}}</a>, </i>
            {{a.Journal}}
            ({{a.Year}})
        </li>
    </ol>
    </div>
    <div v-else>
    Generating up-to-date paperlist from MTMT, please wait.
    </div>
</div>

<script>
var app = new Vue({
	el: '#app',
    data: {
    	articles : [],
        date: "",
        loaded: false
    },
    methods: {

    },
    computed: {
  		orderedArticles: function () {
    		return _.orderBy(this.articles, 'Year', 'desc')
  		}
	},
    mounted(){
    fetch ("/mtmt-publist/user?mtid=10028021").then(res => res.json()).then(
    json => {
        this.articles = json.Papers
        var date = new Date(json.Time * 1000);
        this.date = date.toLocaleString();
        this.loaded = true
    }
    )
    }
})
</script>