MAD 2 Quiz 2: 6 August 2023 (May 2023 term)

1function data(d) {
2  return new Promise((res) => {
3    setTimeout(() => res('Your Data'), d * 1000)
4  })
5}
6
7function delta(d) {
8  return new Promise((res) => {
9    if (d > 3) {
10      setTimeout(() => res('delta'), d * 500)
11    } else {
12      return res('delta')
13    }
14  })
15}
16async function getData(d) {
17  const start = Date.now()
18  const _delta = await delta(d)
19  const _data = await data(d)
20  const end = Date.now()
21  const timeDifference = end - start
22}
23
24getData(4)

1const Teams = {
2  template: `<ol><li v-for='team in
3teams'>{{team.name}}</li></ol>`,
4  data() {
5    return {
6      teams: [
7        { name: 'India', points: 827 },
8        { name: 'Australia', points: 820 },
9      ],
10    }
11  },
12}
13const Rankings = {
14  template: `<ol><li v-for='team in sortedTeams'>
15{{team.name}}</li></ol>`,
16  data() {
17    return Teams.data()
18  },
19  computed: {
20    sortedTeams() {
21      return this.teams.sort((team1, team2) => {
22        return team1.points - team2.points // Statement 1
23      })
24    },
25  },
26}
27
28const router = new VueRouter({
29  routes: [
30    { path: '/', component: Teams },
31    { path: '/ranking', component: Rankings },
32  ],
33})
34
35new Vue({
36  el: '#app',
37  template: `<div> <router-view /> </div>`,
38  router,
39})

1<div id="app"></div>

1<body>
2    <div id="app"></div>
3</body>

1const Category = {
2  template:
3  `<div>{{$route.params.name}}<router-view></router-view></div>
4  `,
5}
6
7const Error = {
8  template: `<div><slot> Page Not Found </slot></div>`,
9}
10const Product = {
11  template: `
12  <div>
13    <div v-if='filteredProducts.length > 0'>
14        <div v-for='product in filteredProducts'>
15            Name: {{product.name}}, Price: {{product.price}}
16        </div>
17    </div>
18    <Error v-else> No {{keyword}} Found </Error>
19  </div>`,
20  data() {
21    return {
22      keyword: this.$route.params.name,
23      products: [
24        { category: 'Mobile', name: 'Samsung', price: '10K' },

1        { category: 'Mobile', name: 'Apple', price: '50K' },
2        { category: 'Laptop', name: 'Lenovo', price: '70K' },
3      ],
4    }
5  },
6  computed: {
7    filteredProducts() {
8      return this.products.filter(
9        (product) =>
10          product.category.toLowerCase() ==
11  this.keyword.toLowerCase()
12      )
13    },
14  },
15  components: {
16    Error,
17  },
18}
19const router = new VueRouter({
20  routes: [
21    {
22      path: '/category/:name',
23      component: Category,
24      children: [{ path: 'product', component: Product }],
25    },
26    { path: '*', component: Error },
27  ],
28})
29
30new Vue({
31  el: '#app',
32  template: '<div><router-view /></div>',
33  router,
34})