<template>
    <div class="edit-popup">
        <popup ref="popupRef" :title="title" :async="true" width="800px" @close="handleClose"
            :clickModalClose="mode == 'show'" :button="false">
            <el-table :data="pager.lists">
                <el-table-column label="ID" prop="task.id" show-overflow-tooltip width="80" />
                <el-table-column label="名称" prop="task.title" width="300" show-overflow-tooltip />
                <el-table-column label="金额" prop="task.money" show-overflow-tooltip />
                <el-table-column label="状态" prop="templateInfo.status" show-overflow-tooltip>
                    <template #default="{ row }">
                        <span
                            :style="{ color: row.task.status == 2 ? '#F5D984' : row.task.status == 3 ? '#37BE5F' : '#EBEBEB' }">
                            {{
                                statusFn(row.task.status) }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="操作" prop="street" show-overflow-tooltip align="center">
                    <template #default="{ row }">
                        <span style="cursor: pointer;color: #4A5DFF;" @click="openTask(row)">详情</span>
                    </template>
                </el-table-column>
            </el-table>
        </popup>
    </div>
</template>
  
<script lang="ts" setup name="taskEidt">
import Popup from "@/components/popup/index.vue";
import { usePaging } from "@/hooks/usePaging";

import { getDayTaskList } from "@/api/task";
import { timeFormat } from "@/utils/util";
const route = useRoute();

const emit = defineEmits(["success", "close",'openDeatl']);
const popupRef = shallowRef<InstanceType<typeof Popup>>();
const isShow = ref(false);
const title = ref("任务列表");
const mode = ref('')
const queryParams = {
    company_id: '',
    date: '',
    page_size:50
}
const dayTaskList = ref("")
//打开弹窗
const open = async (date, id) => {

    queryParams.company_id = id
    queryParams.date = timeFormat(date)
    await getLists();

  

    popupRef.value?.open();
};
// 打开任务详情
const openTask=(row)=>{
    emit("openDeatl",row);
}


const statusFn = (status) => {
    if (status == 2) return "进行中"
    if (status == 3) return "已完成"
    if (status == 5) return "已关闭"

}



const tagClick = (item) => {
    emit("open", item);

}
// 关闭回调
const handleClose = () => {
    emit("close");
};

defineExpose({
    open,
});

// 分页相关
const { pager, getLists, resetParams, resetPage } = usePaging({
    fetchFun: getDayTaskList,
    params: queryParams,
});


</script>
<style lang="scss" scoped>
.formdata {
    .el-form-item {
        .el-date-picker {
            width: 100%;
        }
    }
}

.tag-li {
    margin: 5px;
}
</style>
  