<script setup lang="ts">
import PrevIcon from '@/components/EpPagination/PrevIcon.vue'
import NextIcon from '@/components/EpPagination/NextIcon.vue'

type IRow = any
let tableData = $ref<IRow[]>([])

const keyword = ref('')
const form_query = reactive({
  page: 1,
  limit: 10,
})

let total = $ref(100)

function handleQuery() {
  return request({
    baseURL: window.GLOBAL_CONFIG.myxjyszptx,
    url: '/openapi/chart/school_resource.php',
    data: {
      area_id: 2615,
      keyword: keyword.value,
      ...form_query,
    },
  }).then((res) => {
    // console.log('res :>> ', res.data)
    if (res.code === '1') {
      tableData = res.data.page_data
      total = res.data.total_rows * 1
    }
  })
}

handleQuery()

const router = useRouter()
function routerBack() {
  router.back()
}
</script>

<template>
  <div class="card h-full">
    <div class="flex justify-between mt-5 mb-7">
      <div>
        <el-button class="_" type="primary" @click="routerBack">
          返回
        </el-button>
      </div>
      <div class="flex">
        <input-search v-model="keyword" @search="handleQuery" />
      </div>
    </div>

    <el-table :data="tableData" style="width: 100%">
      <!-- <el-table-column type="selection" width="55" /> -->
      <el-table-column prop="school_name" label="学校名称" show-overflow-tooltip width="auto" />
      <el-table-column prop="upload_num" label="上传资源数" show-overflow-tooltip width="180" />
      <el-table-column prop="download_num" label="资源下载数" show-overflow-tooltip width="180" />
      <el-table-column prop="class_num" label="听课教室数" show-overflow-tooltip width="180" />
      <el-table-column prop="zj_class_num" label="主讲教室数" show-overflow-tooltip width="180" />
    </el-table>

    <div class="flex_center mt-6">
      <el-pagination
        v-model:current-page="form_query.page" v-model:page-size="form_query.limit"
        layout="total, prev, pager, next, jumper" :total="total" :prev-icon="PrevIcon" :next-icon="NextIcon"
        @current-change="handleQuery"
      />
    </div>
  </div>
</template>

<style lang="scss" scoped>
@use "~/styles/input-search.scss";
@use "~/styles/button.scss";
@use "~/styles/table.scss";
@use "~/styles/message-box.scss";
@use "~/styles/dialog.scss";
@use "~/styles/pagination.scss";
</style>
