<!-- 委外订单列表 -->
<template>
    <div class="table-box">
        <ProTable
            ref="proTable"
            :formData="datas.formData"
            :columns="datas.columns"
            :request-api="getListApi"
            :init-param="datas.initParam"
            :orgCode="datas.ruleForm.orgCode"
        >
            <template #type="scope">
                {{ datas.type[scope.row.type] }}
            </template>
            <template #status="scope">
                <span v-if="scope.row.status === '导出成功'" style="color: #3ad6ac">
                    {{ scope.row.status }}
                    <i class="iconfont icon-chenggong"></i>
                </span>
                <span v-if="scope.row.status === '导出失败'" style="color: #ff5363">
                    {{ scope.row.status }}
                    <i class="iconfont icon-shijing"></i>
                </span>
                <span v-if="scope.row.status === '正在导出'" style="color: #fdc027">{{ scope.row.status + "..." }}</span>
            </template>
            <template #filePath="scope">
                <a
                    style="color: #4178d5"
                    :href="scope.row.filePath"
                    v-if="
                        scope.row.statusKey == 1 &&
                        Math.abs((new Date(scope.row.date).getTime() - new Date().getTime()) / (24 * 60 * 60 * 1000)) <= 7
                    "
                    >下载</a
                >
                <a v-else style="color: #666666; cursor: no-drop">下载</a>
            </template>
        </ProTable>
    </div>
</template>

<script setup lang="ts" name="exportList">
import ProTable from "@/components/ProTable/index.vue";
import { ref, reactive } from "vue";
import { getListApi, getStatusApi } from "@/api/modules/exportList";
import { RULEFORM, FORMDATA, COLUMNS } from "./constant/list/index";
import { useUserStore } from "@/stores/modules/user";
import { cloneDeep } from "lodash-es";
import { useSearchInfoObject, useSetSearchData } from "@/hooks/useSearch";
const proTable = ref<any>();
// 获取用户信息(组织id)
const userStore = useUserStore();
// 数据源
const datas: any = reactive({
    columns: COLUMNS, //列表配置项
    initParam: cloneDeep(RULEFORM), // 初始化搜索条件|重置搜索条件
    ruleForm: cloneDeep(RULEFORM), // 搜索条件
    formData: FORMDATA, //搜索配置项,
    type: {},
    selectionList: []
});

// //获取当前组织仓库
const getStatus = async () => {
    const result: Record<string, any> = await getStatusApi();
    if (result.status === 200) {
        const { data } = result;
        datas.type = data.type;
        datas.formData = useSetSearchData(datas.formData, {
            type: useSearchInfoObject(data.type),
            status: useSearchInfoObject(data.status)
        });
    }
};
getStatus();

// onActivated(() => {
//     proTable!.value.initPage();
// });
watch(
    () => userStore.orgCode,
    newVal => {
        datas.ruleForm.orgCode = newVal;
        datas.initParam.orgCode = newVal;
    },
    {
        immediate: true,
        deep: true
    }
);
</script>
<style scope lang="scss">
.main-container {
    width: -moz-available;
    width: -webkit-fill-available;
    width: stretch;
    height: -moz-available;
    height: -webkit-fill-available;
    height: stretch;
    height: 100% !important;
    margin: 0 16px;
}
</style>
