<script setup lang="ts" name="LeaveList">
import { ref } from 'vue'
// import { useRouter } from 'vue-router'
// import { showConfirmDialog, showSuccessToast } from 'vant'
import { useUserStore } from '@/store/modules/user'
import { getCrossDayOutRequestlist } from '@/api/attendance/outRequest'
import { revokeProcess } from '@/api/flowEngine/flowInterface'
import { useDict } from '../../common/utils/dict'
import PullList from '../../components/List/PullList.vue'
import LeaveListItem from './modules/LeaveListItem.vue'
import customFab from '@/components/customFab.vue'
const { audit_status, request_leave_type } = useDict('audit_status', 'request_leave_type')
// console.log(audit_status)
const userStore = useUserStore()
// const router = useRouter()

const pullListRef = ref<InstanceType<typeof PullList>>()
const queryParams = ref({
  pageNum: 1,
  pageSize: 5,
  reason: ''
  // employeesCode: userInfo.value.userCode
})

// 请求方法，传入PullList组件，需返回{rows: [], total: number}
function onRequest(query?: any, isRefresh?: boolean): Promise<{rows: any[], total: number}> {
  return getCrossDayOutRequestlist(query)
}

// 跨天外出详情
function onClickItem(item) {
   console.log('123')
  // 已退回 和 已撤回
  if (['5', '6'].includes(item.auditStatus)) {
     uni.navigateTo({
      url:'/attendance/outRequest/add?id=' + item.id,
    })
    return
  }
  console.log('123')
  uni.navigateTo({
    url:'/attendance/outRequest/detail?id=' + item.id + '&instanceId=' + item.instanceId
  })
}

// // 销假
// function onClose(item) {
//   // router.push({ path: '/attendance/leave/close',
//   //   query: { 
//   //     id: item.id, 
//   //     beginTime: item.beginTime, 
//   //     endTime: item.endTime, 
//   //     leaveType: item.leaveType 
//   //   }
//   // })


//   uni.navigateTo({
//     url:'/attendance/leave/close?id=' + item.id + '&beginTime=' + item.beginTime + '&endTime=' + item.endTime + '&leaveType=' + item.leaveType
//   })



// }

// 撤办
function onRevoke(item) {
  uni.showModal({
    title: '撤办',
    content: `隔天外出：${item.reason}，确认撤办吗？`,
    success: (res) => {
      if (res.confirm) {
        return new Promise((resolve, reject) => {
          revokeProcess({
            instanceId: item.instanceId
          }).then(() => {
              uni.showToast({
                title: '撤办成功',
                icon: 'success'
              })
              setTimeout(() => {
                resolve(true)
                pullListRef.value?.refresh()
              }, 500)
          
          }).catch(() => {
            reject(false)
          })
        })
      } else if (res.cancel) {
        console.log('用户点击取消')
      }
    }
  })

}

// 点击添加
function onClickAdd() {
  uni.navigateTo({
    url:'/attendance/outRequest/add',
  })
}

function handleSearchChange(e) {
    queryParams.value.reason = e.detail // 手动更新数据:ml-citation{ref="2,8" data="citationList"}
  }
function onSearch() {

  pullListRef.value?.refresh()
}
</script>

<template>
    <div class="query-wrap">
      <div class="search-pad">
        <van-search
          :value="queryParams.reason"
          @change="handleSearchChange"
          shape="round"
          placeholder="请输入搜索关键词"
          useActionSlot
          @search="onSearch"
          @clear="onSearch">
          <template #action>
            <div class="search-btn" @click="onSearch">搜索</div>
          </template>
        </van-search>
      </div>
    </div>
    <!-- </div> -->
    <PullList ref="pullListRef" v-model:query-string="queryParams" :isFixed="false" zHeight="80vh"  :request-method="onRequest">
      <template #default="{ item, index }">
         <div style="padding: 0 30rpx;" >
            <LeaveListItem
              :item="item"
              :user-info="userStore.userInfo"
              :audit_status="audit_status"
              :request_leave_type="request_leave_type"
              @revoke.stop="onRevoke"
              @tap="onClickItem(item)" />
          </div>
                        <!-- @close.stop="onClose" -->
      </template>
    </PullList>
    <customFab  icon @click="onClickAdd" />

</template>

<style lang="less" scoped>
.search-pad {
  padding: 30rpx;
  box-sizing: border-box;
}
:deep(.van-search) {
  position: relative;
  z-index: 1;
  padding: 20rpx;
  // min-height: 4.4rem;
  border-radius:24rpx;
  box-shadow: 0 4rpx 40rpx rgba(64, 103, 251, 0.14);
  // overflow: hidden;
}
.search-btn {
  padding: 0 16.6rpx;
}
</style>
