<template>
  <main class="tab-content rules">
    <fieldset class="card">
      <legend>规则列表</legend>

      <wc-scroll class="scroll">
        <ul class="list">
          <li class="item" v-for="it in rules">
            <span>{{ it.type }}</span>
            <span>{{ it.payload }}</span>
            <span class="type">{{ it.proxy }}</span>
          </li>
        </ul>
      </wc-scroll>
    </fieldset>
  </main>
</template>

<script>
import fetch from '@/lib/fetch'

export default {
  data() {
    return {
      rules: []
    }
  },

  mounted() {
    this.getRule()
  },

  methods: {
    getRule() {
      fetch('/rules').then(r => {
        console.log(r)
        this.rules = r.rules
      })
    }
  }
}
</script>
