<template>
  <view>
    <SearchBar
      v-model:query-type="queryType"
      v-model:search-input-value="searchInputValue"
      v-model:search-type="searchType"
      v-model:search-dropdown-value="searchDropdownValue"
      search-btn-icon="add"
      search-btn-text="发布"
      :search-dropdown-list="dropList"
      :search-placeholder="searchPlaceholder"
      :search-tab-list="searchTabList"
      :query-type-data="queryTypeData"
      :height="topHeight"
      @search-btn="onCreateActivity"
      @search="onSearch"
    ></SearchBar>
    <vb-list
      custom-class="mx-15 pt-15"
      :query-fun="queryType == 0 ? apis.amActivity.activityApi.myCreateActivity : myJoinActivity"
      :query-params="queryParams"
      :height="listHeight"
    >
      <template #item="{ item }">
        <ListCard :item="item" :type="itemType" :map="{ id: 'activityId', date: 'activityDate' }"></ListCard>
      </template>
    </vb-list>
  </view>
</template>

<script lang="ts" setup>
import dayjs from "dayjs"
import apis from "@/api"
import route from "@/route"
import appStore from "@/stores"
import ListCard from "@/components/listCard.vue"
import SearchBar from "@/components/searchBar.vue"

import "dayjs/locale/zh-cn" // 导入本地化语言
dayjs.locale("zh-cn") // 使用本地化语言

const params = route.getRouteParams("myActivity")

const isMine = computed(() => {
  return params && params.userName ? false : true
})

const itemType = computed(() => {
  return queryType.value == 0 && isMine.value ? "activityEdit" : "activityDetail"
})

const userName = computed(() => {
  if (params && params.userName) {
    return params.userName
  }
  return appStore.authStore.getUser().userName
})
const amId = computed(() => {
  if (params && params.amId) {
    return params.amId
  }
  return appStore.authStore.getUser().amId
})

const wHeight = uni.getWindowInfo().windowHeight
const topHeight = ref(130)
const listHeight = computed(() => {
  return wHeight - topHeight.value - 15
})

const searchInputValue = ref("")
const queryType = ref(0)
const searchType = ref("")
const searchDropdownValue = ref([])
const queryParams = ref(
  isMine.value
    ? { title: "" }
    : queryType.value == 0
    ? {
        createBy: userName.value,
        auditStatus: 1,
        title: "",
      }
    : {
        amId: amId.value,
        title: "",
      }
)
const searchPlaceholder = ref("搜索校友活动标题")
const queryTypeData = computed(() => {
  return [
    { value: 0, text: "创建的活动" },
    { value: 1, text: "参与的活动" },
  ]
})
const dropList = computed(() => {
  const arr = []
  arr.push({
    emptyTitle: "全部分类",
    data: categoryColumns.value,
    map: { text: "categoryName", value: "categoryId" },
  })
  return arr
})
const categoryColumns = ref<any>([])
const searchTabList = computed(() => {
  const arr = []
  // arr.push({ text: "最新", value: "new" })
  // arr.push({ text: "最热", value: "hot" })
  arr.push({ text: "近一周", value: "week" })
  arr.push({ text: "近一月", value: "month" })
  arr.push({ text: "全部", value: "" })
  return arr
})

const myJoinActivity = (query: any) => {
  return apis.amActivity.activityApi.myJoinActivity(query, amId.value)
}
function onSearch() {
  search()
}

function search() {
  const params: any = {
    title: searchInputValue.value || "",
    category: searchDropdownValue.value[0] || "",
  }
  if (!isMine.value) {
    if (queryType.value == 0) {
      params.createBy = userName.value
      params.auditStatus = "1"
    } else if (queryType.value == 1) {
      params.amId = amId.value
    }
  }

  if (searchType.value) {
    switch (searchType.value) {
      case "new":
        params.orderByColumn = "createTime"
        params.isAsc = "desc"
        break
      case "hot":
        params.orderByColumn = "readCount"
        params.isAsc = "desc"
        break
      case "week":
        params.beginActivityDate = dayjs().startOf("day").add(-7, "day").format("YYYY-MM-DD HH:mm:ss")
        params.endActivityDate = dayjs().endOf("day").format("YYYY-MM-DD HH:mm:ss")
        break
      case "month":
        params.beginActivityDate = dayjs().startOf("day").add(-30, "day").format("YYYY-MM-DD HH:mm:ss")
        params.endActivityDate = dayjs().endOf("day").format("YYYY-MM-DD HH:mm:ss")
        break

      default:
        break
    }
  }

  queryParams.value = params
}
function onCreateActivity() {
  route.navigate("activityEdit")
}
function loadCategory() {
  apis.system.categoryApi.getActivityCategory().then((res) => {
    categoryColumns.value = [{ categoryName: "全部分类", categoryId: "" }, ...res]
  })
}
function init() {
  if (!isMine.value && params.name) {
    uni.setNavigationBarTitle({ title: params.name + "的活动" })
  }
  loadCategory()
}
onLoad(init)
</script>

<style scoped></style>
