Files
orico-wms-ts-admin/src/views/export/list/index.vue
2025-07-15 11:11:52 +08:00

100 lines
3.4 KiB
Vue

<!-- 委外订单列表 -->
<template>
<div class="table-box">
<Search :formData="datas.formData" :ruleForm="datas.ruleForm" @handleSearch="handleSearch" @handleReset="handleReset" />
<!-- 表格 -->
<ProTable
ref="proTable"
:columns="datas.columns"
:request-api="getListApi"
:init-param="datas.initParam"
:ruleForm="datas.ruleForm"
:formData="datas.formData"
>
<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">
import Search from "@/components/Search/index.vue";
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 { cloneDeep } from "lodash-es";
import { useSearchInfoObject, useSetSearchData } from "@/hooks/useSearch";
const proTable = ref<any>();
// 数据源
const datas: any = reactive({
columns: COLUMNS, //列表配置项
initParam: cloneDeep(RULEFORM), // 初始化搜索条件|重置搜索条件
ruleForm: cloneDeep(RULEFORM), // 搜索条件
formData: FORMDATA, //搜索配置项,
type: {}
});
//获取当前组织仓库
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();
const handleSearch = () => {
proTable!.value.initPage(datas.ruleForm);
};
const handleReset = () => {
datas.ruleForm = cloneDeep(RULEFORM);
datas.exportList = cloneDeep(RULEFORM);
proTable!.value.initPage(datas.initParam);
};
</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>