<template>
  <view class="tabs_content">
    <hs-tabs :list="list" :current="useModel.currentTabs.value" @onChange="handleTabsChange" />
    <view class="status_select">
      <view
        v-for="(i, index) in status_list"
        :key="index"
        class="status_item"
        :style="statusEd === i?.value?getBorderColorInfo():''"
        @click="handleStatusChange(i)"
      >
        {{ i?.label }}
      </view>
    </view>
  </view>
</template>

<script setup lang="ts">
import { ref } from 'vue'
import { getBorderColorInfo } from '@/common/libraries/getPageConfig'
const statusEd = ref('')
let list = [
  { label: '我的审核', value: '1' },
  { label: '我的申请', value: '2' }
]
const status_list = [
  { label: '全部', value: '' },
  { label: '待审核', value: 'Pending' },
  { label: '审核通过', value: 'Approved' },
  { label: '审核拒绝', value: 'Rejected' }
]
const emit = defineEmits(['change'])
import useModel from '../model'
import method from '../method'

const handleStatusChange = (e: { value: string }) => {
  useModel.formData.value.approval_owner_status = e?.value
  useModel.formData.value.status = e?.value
  statusEd.value = e?.value
  method.handleSrarch()
}

const handleTabsChange = (idx: number) => {
  useModel.currentTabs.value = idx
  useModel.formData.value.approval_owner_status = ''
  useModel.formData.value.status = ''
  statusEd.value = ''
  method.handleSrarch()
  // method?.handleGetList()
}
</script>

<style lang="scss" scoped>
.tabs_content {
  border-top: 1rpx solid #eee;
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  z-index: 100;
  background-color: #fff;
  .filter_content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1rpx solid #eee;
    padding: 15rpx 30rpx;
  }
  .status_select {
    display: flex;
    align-items: center;
    padding: 25rpx 0;
    .status_item {
      margin-left: 30rpx;
      padding: 8rpx 20rpx;
      border: 1rpx solid #eee;
      border-radius: 100rpx;
      color: #666;
      font-size: 25rpx;
    }
    .active_status {
      color: #2a7efb;
      border: 1rpx solid #2a7efb;
    }
  }
}
</style>
