<script setup>
import { useUniApi } from 'hooks/use-uni-api'
import { getWorkDataListApi } from '@/api/elevator'
import { usePaging } from '@/composables/use-paging'
const { navigateTo } = useUniApi()

// 期望时间 关联电梯 电梯地址 维保人员 物业是否评价 工作描述
const keyValue = reactive([
  { key: '期望时间', value: '', field: 'expectTime' },
  { key: '关联电梯', value: '', field: 'elevatorName' },
  { key: '工作描述', value: '', field: 'description' }
])
const toDetail = ({ workType, id, elevatorNum }) => {
  const str = `?id=${id}&elevatorNum=${elevatorNum}`
  if (workType === 1) {
    navigateTo(`/pages/views/elevator-rescue/detail${str}`)
  } else if (workType === 2) {
    navigateTo(`/pages/views/elevator-maintenance/detail${str}`)
  } else if (workType === 3) {
    navigateTo(`/pages/views/elevator-maintenance/detail${str}`)
  }
}

// 1.救援 2.维修 3.维保
const workTypeMap = {
  1: '救援',
  2: '维修',
  3: '维保'
}

const query = ref({
  elevatorName: '',
  stateList: '4,7'
})
const { paging, dataList, queryHandler, clearHandler, enterHandler } =
  usePaging({
    apiFn: getWorkDataListApi,
    query
  })

const options = ref({})
onLoad(async (e) => {
  options.value = e
})
</script>

<template>
  <view class="elevator-rescue" w-full h-100vh flex-col f-s-c bg="#F8F8F8">
    <view f-c-c mt-8 w-full flex-none bg-white>
      <up-input
        v-model="query.elevatorName"
        placeholder="请输入电梯名称"
        prefix-icon="search"
        prefix-icon-style="font-size: 22px;color: #909399"
        clearable
        :border="`${'none'}`"
        :custom-style="{
          height: '80rpx',
          padding: '0 20rpx'
        }"
        @clear="
          () => {
            query.elevatorName = ''
            clearHandler()
          }
        "
        @confirm="enterHandler"
      />
    </view>

    <view w-full flex-auto overflow-hidden mt-8 bg-white>
      <z-paging
        ref="paging"
        v-model="dataList"
        :fixed="false"
        @query="queryHandler"
      >
        <up-card
          v-for="(item, index) in dataList"
          :key="index"
          :title="`发布人员：${item.publisher}`"
          @click="toDetail(item)"
        >
          <template #body>
            <view>
              <view px-30 text-36 font-500 f-c-c justify-between>
                <text>已完成</text>
                <text text-28 text="#909399">{{ item.operationTime }}</text>
              </view>
              <up-cell title="工作类型" :value="workTypeMap[item.workType]" />
              <up-cell
                v-for="(val, idx) in keyValue"
                :key="idx"
                :title="val.key"
                :value="item[val.field]"
              />
            </view>
          </template>
        </up-card>
      </z-paging>
    </view>
  </view>
</template>
