<template>
    <up-collapse-item :title="`布置工作（${getAssignWorkNum}）`">
        <global-page
            :fixed="false"
            :height="height"
            :showNavbar="false"
            :custom="false"
            isDataList
            refresherEnabled
            loadingMoreEnabled
            :params="{
                userId: userStore.userInfo?.id
            }"
            :api="getArrangeWorkListForAppApi"
            @handleQuery="handleQuery"
            auto
        >
            <template #default="{ item }">
                <view class="item" @tap="goDetails(item)">
                    <view class="item-title">
                        <view class="left">
                            <custom-state :value="item.state == 1 ? 'OPEN' : 'CLOSE'"></custom-state>
                            <view class="txt u-line-1">{{ item.seat }}</view>
                        </view>
                        <view class="right u-line-1">{{ getParamNameByValue('LayoutWorkType', item.workType) }}</view>
                    </view>
                    <view class="item-content u-line-3">
                        {{ item.taskDescribe }}
                    </view>
                    <view class="item-footer">
                        <view class="label">
                            <global-icon icon="calendar"></global-icon>
                            <text class="txt">
                                {{ timeStampFormat(item.startTime, { format: 'YYYY/MM/DD' }) }}
                                -
                                {{ timeStampFormat(item.feedbackTime, { format: 'YYYY/MM/DD' }) }}
                            </text>
                        </view>
                        <view class="label">
                            <global-icon icon="idcard"></global-icon>
                            <text class="txt">提出人:{{ item.presenter || '-' }}</text>
                        </view>
                    </view>
                </view>
            </template>
        </global-page>
    </up-collapse-item>
</template>

<script setup>
import { timeStampFormat } from 'mocp/utils/tool'
import { getParamNameByValue } from 'mocp/hooks/use-params/useParams'
import { getArrangeWorkListForAppApi } from 'mocp/api/my-toDo'
import useUserStore from 'mocp/store/user'
import useMyToDoStore from 'mocp/store/my-toDo'
import { storeToRefs } from 'pinia'

const userStore = useUserStore()
const myToDoStore = useMyToDoStore()
const { getAssignWorkNum } = storeToRefs(myToDoStore)
const ps = defineProps({
    height: {
        type: String,
        default: ''
    }
})
const goDetails = (data) => {
    uni.$mocpJump.navigateTo('/panel/assign-work/details', { id: data.id })
}
const handleQuery = ({ res }) => {
    myToDoStore.setState('assignWorkNum', parseInt(res.data.total) || 0)
}
</script>
<style lang="scss" scoped></style>
