<template>
  <Page name="search-staff">
    <template #header>
      <search-bar v-model="searchForm.name" placeholder="请输入姓名" auto @confirm="onSearch" />
    </template>
    <template #content>
      <List ref="list" v-model="list" :api="searchAPI">
        <template v-for="(item, index) in list">
          <zui-cell :key="index" @click="onSelect(item)">
            <template #title>
              <text>{{ item.name }}</text>
            </template>
          </zui-cell>
        </template>
      </List>
    </template>
  </Page>
</template>

<script>
export default {
  data() {
    return {
      list: [],
      searchForm: {
        name: '',
      },
    };
  },
  methods: {
    searchAPI(params) {
      return uni.$u.api.filter.pricingEmployee({ ...params, ...this.searchForm });
    },
    onSelect(item) {
      uni.$emit('select-staff', item);
      uni.navigateBack();
    },
  },
};
</script>

<style lang="scss">
.page-search-staff {
  &__header {
    padding: 15rpx 22rpx !important;
  }
}
</style>