<template>
  <view class="page-container">
    <scroll-view class="page-body" scroll-y>
      <view class="data-list">
        <view class="data-card" v-for="(item, index) in staffList" :key="item.id">
          <view class="data-card-header">
            <text class="data-card-title">{{ index + 1 }}. {{ item.handler_name }}</text>
            <text class="data-card-tag blue">{{ item.handler_code }}</text>
          </view>
        </view>
      </view>
    </scroll-view>
  </view>
</template>

<script>
import { api } from '@/api/index'

export default {
  data() {
    return {
      searchKey: '',
      staffList: [],
      allStaffList: []
    }
  },
  watch: {
    searchKey(val) {
      this.filterList(val)
    }
  },
  onLoad() {
    this.loadStaffList()
  },
  methods: {
    async loadStaffList() {
      const res = await api.handler({ type: ''})
      console.log('获取经办人列表结果:', res)
      if (res.code === 1000) {
        this.allStaffList = res.data || []
        this.staffList = this.allStaffList
      }
    },
    filterList(keyword) {
      if (!keyword) {
        this.staffList = this.allStaffList
        return
      }
      const key = keyword.toLowerCase()
      this.staffList = this.allStaffList.filter(item =>
        (item.handler_name && item.handler_name.toLowerCase().includes(key)) ||
        (item.handler_code && item.handler_code.toLowerCase().includes(key))
      )
    }
  }
}
</script>
