school-select.vue 1.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455
  1. <template>
  2. <ie-page bg-color="#F6F8FA">
  3. <z-paging ref="paging" v-model="list" :auto="false" :default-page-size="30" @query="handleQuery">
  4. <template #top>
  5. <view>
  6. <ie-navbar title="选择学校" />
  7. <view class="bg-white px-30 py-20">
  8. <uv-input placeholder="请输入关键字" border="surround" shape="circle" prefixIcon="search"
  9. prefixIconStyle="font-size: 22px;color: #909399" v-model="keyword" @confirm="handleConfirm"></uv-input>
  10. </view>
  11. </view>
  12. </template>
  13. <view class="mt-16">
  14. <view class="p-20 bg-white" v-for="item in list" :key="item.id" @click="handleItemClick(item)">
  15. {{ item.name }}
  16. </view>
  17. </view>
  18. </z-paging>
  19. </ie-page>
  20. </template>
  21. <script lang="ts" setup>
  22. import { getSchoolList } from '@/api/modules/user';
  23. import { SchoolItem } from '@/types/user';
  24. import { useTransferPage } from '@/hooks/useTransferPage';
  25. const { transferTo, transferBack } = useTransferPage();
  26. const keyword = ref<string>('');
  27. const list = ref<SchoolItem[]>([]);
  28. const paging = ref();
  29. const handleQuery = (pageNum: number, pageSize: number) => {
  30. uni.$ie.showLoading();
  31. getSchoolList({
  32. keyword: keyword.value,
  33. pageNum,
  34. pageSize
  35. }).then(res => {
  36. paging.value.complete(res.rows, res.total);
  37. }).catch(e => {
  38. paging.value.complete(false);
  39. }).finally(() => {
  40. uni.$ie.hideLoading();
  41. });
  42. };
  43. const handleItemClick = (item: SchoolItem) => {
  44. transferBack(item);
  45. };
  46. const handleConfirm = () => {
  47. paging.value.reload();
  48. };
  49. onMounted(() => {
  50. paging.value.reload();
  51. });
  52. </script>
  53. <style lang="scss" scoped></style>