Files
td_official/src/views/out/outTable/index.vue
2025-09-09 09:08:34 +08:00

122 lines
4.2 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<div class="p-2">
<el-tabs type="border-card" @tab-change="handleTabChange" v-model="activeTab">
<el-tab-pane v-for="(item, index) in tabList" :key="index" :label="item.label" :name="item.value">
<el-card shadow="hover">
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
<el-form-item label="计划月份" prop="month">
<el-date-picker v-model="queryParams.month" type="month" value-format="YYYY-MM" placeholder="请选择计划月份" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
</el-card>
<el-card shadow="never">
<el-table v-loading="loading" :data="tableData">
<el-table-column label="项目" align="center" prop="projectName" />
<el-table-column label="项目总产值" align="center" prop="totalValue" />
<el-table-column label="月预计产值" align="center" prop="monthlyEstimatedValue" />
<el-table-column label="完成产值(第一周)" align="center" prop="firstWeekCompletionValue" />
<el-table-column label="完成产值(第二周)" align="center" prop="secondWeekCompletionValue" />
<el-table-column label="完成产值(第三周)" align="center" prop="thirdWeekCompletionValue" />
<el-table-column label="完成产值(第四周)" align="center" prop="fourthWeekCompletionValue" />
<el-table-column label="完成产值(第五周)" align="center" prop="fifthWeekCompletionValue" />
<el-table-column label="完成产值月合计" align="center" prop="totalCompletionValue" />
<el-table-column label="产值差额" align="center" prop="valueDifference" />
<el-table-column label="预计累计产值" align="center" prop="estimatedAccumulatedValue" />
<el-table-column label="累计完成产值" align="center" prop="accumulatedCompletionValue" />
<el-table-column label="产值差额" align="center" prop="valueDifferenceAccumulation" />
<el-table-column label="项目完成总进度" align="center" prop="totalCompletionProgress" />
</el-table>
<pagination
v-show="total > 0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
</el-card>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script setup lang="ts">
import { useUserStoreHook } from '@/store/modules/user';
import { listOutTable } from '@/api/out/outTable';
const userStore = useUserStoreHook();
const currentProject = computed(() => userStore.selectedProject);
const activeTab = ref('1');
const queryParams = ref({
month: '',
pageNum: 1,
pageSize: 10
});
const total = ref(0);
const tableData = ref([]);
const loading = ref(false);
const tabList = [
{
value: '1',
label: '对甲施工报表'
},
{
value: '2',
label: '对乙施工报表'
}
];
//切换表单
const handleTabChange = (tab) => {
activeTab.value = tab;
// queryParams.value.month = '';
handleQuery();
};
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.value.pageNum = 1;
getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
resetMonth();
handleQuery();
};
// 获取列表
const getList = async () => {
const params = {
...queryParams.value,
projectId: currentProject.value?.id,
type: activeTab.value
};
console.log(params);
const res = await listOutTable(params);
if (res.code == 200) {
tableData.value = res.rows;
total.value = res.total;
}
};
const resetMonth=()=>{
const currentDate = new Date();
const year = currentDate.getFullYear();
const month = currentDate.getMonth() + 1; // 月份从0开始所以需要加1
// 形成"YYYY-M"格式
const formattedDate = `${year}-${String(month).padStart(2, '0')}`;
queryParams.value.month = formattedDate;
}
onMounted(() => {
resetMonth();
getList();
});
</script>
<style scoped lang="scss"></style>