| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455 | <template>  <el-table :data="list" style="width: 100%;padding-top: 15px;">    <el-table-column label="Order_No" min-width="200">      <template slot-scope="scope">        {{ scope.row.order_no | orderNoFilter }}      </template>    </el-table-column>    <el-table-column label="Price" width="195" align="center">      <template slot-scope="scope">        ¥{{ scope.row.price | toThousandFilter }}      </template>    </el-table-column>    <el-table-column label="Status" width="100" align="center">      <template slot-scope="{row}">        <el-tag :type="row.status | statusFilter">          {{ row.status }}        </el-tag>      </template>    </el-table-column>  </el-table></template><script>import { transactionList } from '@/api/remote-search'export default {  filters: {    statusFilter(status) {      const statusMap = {        success: 'success',        pending: 'danger'      }      return statusMap[status]    },    orderNoFilter(str) {      return str.substring(0, 30)    }  },  data() {    return {      list: null    }  },  created() {    this.fetchData()  },  methods: {    fetchData() {      transactionList().then(response => {        this.list = response.data.items.slice(0, 8)      })    }  }}</script>
 |