Skip to content

W
web-project
Commit fa9f9b69 authored by ccc2wdd's avatar ccc2wdd
Browse files
Options

结算管理，统计页面有初始年份和季度

parent e173f956
Hide whitespace changes
Inline Side-by-side
Showing with 239 additions and 216 deletions
src/views/settlementManagement/statistic/index.vue
View file @ fa9f9b69
...@@ -8,244 +8,267 @@ ...@@ -8,244 +8,267 @@
</template> </template>
</BasicForm> </BasicForm>
<Table <Table
:pagination="false" :pagination="false"
:dataSource="dataSource" :dataSource="dataSource"
:columns="columns" :columns="columns"
bordered bordered
:loading="loadingRef" :loading="loadingRef"
:rowClassName="setRowClassName" :rowClassName="setRowClassName"
:scroll="{ x: 1300,y: 350 }" :scroll="{ x: 1300, y: 350 }"
> />
</Table>
</PageCard> </PageCard>
<StatisticWindow @register="register" /> <StatisticWindow @register="register" />
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { onMounted, ref } from 'vue'; import { onMounted, ref } from 'vue';
import { Table } from 'ant-design-vue'; import { Table } from 'ant-design-vue';
import { getListAll,exportStatisticList } from '@/api/project/settlementManage'; import { getListAll, exportStatisticList } from '@/api/project/settlementManage';
import {BasicForm, FormActionType, FormSchema, useForm} from '@/components/Form'; import { BasicForm, FormActionType, FormSchema, useForm } from '@/components/Form';
import StatisticWindow from '@/views/monthlyPlan/statisticWindow/statisticWindow.vue'; import StatisticWindow from '@/views/monthlyPlan/statisticWindow/statisticWindow.vue';
import { useModal } from '@/components/Modal'; import { useModal } from '@/components/Modal';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import PageCard from '@/components/Page/src/PageCard.vue'; import PageCard from '@/components/Page/src/PageCard.vue';
import { downloadByData } from '@/utils/file/download'; import { downloadByData } from '@/utils/file/download';
import { useUserStore } from '@/store/modules/user'; import { useUserStore } from '@/store/modules/user';
import moment from 'moment';
const seach = ref([ const currentMonth = moment().format('MM');
{ const currentquarter = getQuarter();
field: 'givenYear', function getQuarter() {
label: '', if (currentMonth <= 3) {
component: 'DatePicker', return '第一季度';
componentProps: { } else if (currentMonth <= 6) {
placeholder: '年份', return '第二季度';
picker: 'year', } else if (currentMonth <= 9) {
valueFormat: 'YYYY', return '第三季度';
format: 'YYYY', } else {
style: { return '第四季度';
width: '100%', }
}
const params = ref({ givenYear: '', quarter: '', deptId: '' });
const seach = ref([
{
field: 'givenYear',
label: '',
component: 'DatePicker',
componentProps: {
defaultValue: moment().format('YYYY'),
placeholder: '年份',
picker: 'year',
valueFormat: 'YYYY',
format: 'YYYY',
style: {
width: '100%',
},
}, },
colProps: { span: 4 },
}, },
colProps: { span: 4 }, {
}, field: 'quarter',
{ label: '',
field: 'quarter', component: 'Select',
label: '', componentProps: {
component: 'Select', placeholder: '季度',
componentProps: { defaultValue: currentquarter,
placeholder: '季度', options: [
options: [ {
{ label: '第一季度',
label: '第一季度', value: '第一季度',
value: '第一季度', },
}, {
{ label: '第二季度',
label: '第二季度', value: '第二季度',
value: '第二季度', },
}, {
{ label: '第三季度',
label: '第三季度', value: '第三季度',
value: '第三季度', },
}, {
{ label: '第四季度',
label: '第四季度', value: '第四季度',
value: '第四季度', },
}, ],
], },
colProps: { span: 4 },
}, },
colProps: { span: 4 }, ]);
}, const deptId = ref('');
]) onMounted(async () => {
const deptId = ref(''); deptId.value = useUserStore().userInfo.deptId;
onMounted(async () => { // 设置当前年份
deptId.value = useUserStore().userInfo.deptId; params.value.givenYear = moment().format('YYYY');
getStatisticList(); // 设置当前季度
}); params.value.quarter = currentquarter;
getStatisticList();
});
// defineOptions({ name: 'MonthlyPlan' }); // defineOptions({ name: 'MonthlyPlan' });
const [register, { openModal: openModal }] = useModal(); const [register, { openModal: openModal }] = useModal();
const formElRef = ref<Nullable<FormActionType>>(null); const formElRef = ref<Nullable<FormActionType>>(null);
const [registerForm, { getFieldsValue }] = useForm({ const [registerForm, { getFieldsValue }] = useForm({
labelWidth: 90, labelWidth: 90,
baseColProps: { span: 24 }, baseColProps: { span: 24 },
schemas: seach, schemas: seach,
showActionButtonGroup: false, showActionButtonGroup: false,
}); });
async function exportCount() { async function exportCount() {
const params = getFieldsValue(); const data = await exportStatisticList(params.value);
const data = await exportStatisticList(params); downloadByData(data, '结算管理统计报表' + '.xls');
downloadByData(data, '结算管理统计报表' + '.xls');
}
const loadingRef = ref(false);
function handleSubmit() {
getStatisticList();
}
function setRowClassName(record) {
if (record.projectName === '总计(万元)') {
return 'rowcolor';
} }
if (record.companyName === '合计(万元)'){ const loadingRef = ref(false);
return 'rowcolor'; function handleSubmit() {
} else { let data = getFieldsValue();
return; params.value = data;
getStatisticList();
} }
} function setRowClassName(record) {
if (record.projectName === '总计(万元)') {
function getCurrentDateFormatted() { return 'rowcolor';
const now = new Date(); }
const year = now.getFullYear(); if (record.companyName === '合计(万元)') {
const month = (now.getMonth() + 1).toString().padStart(2, '0'); // 月份从0开始，所以要加1，并且格式化为两位数 return 'rowcolor';
return `${year}-${month}`; } else {
} return;
async function getStatisticList() {
const params = getFieldsValue();
loadingRef.value = true;
let data = await getListAll(params);
// dataSource.value = data;
let propsList = ['companyName','projectName'];
propsList.map((item) => {
changeData(data, item);
});
loadingRef.value = false;
}
function changeData(data, field) {
if (field == 'companyName'){
let count = 0; //重复项的第一项
let indexCount = 1; //下一项
while (indexCount < data.length) {
var item = data.slice(count, count + 1)[0]; //获取没有比较的第一个对象
if (!item[`${field}rowSpan`]) {
item[`${field}rowSpan`] = 1; //初始化为1
}
if (item[field] === data[indexCount][field]) {
//第一个对象与后面的对象相比，有相同项就累加，并且后面相同项设置为0
item[`${field}rowSpan`]++;
data[indexCount][`${field}rowSpan`] = 0;
} else {
count = indexCount;
}
indexCount++;
} }
} }
if (field == 'projectName'){
let count = 0; //重复项的第一项 function getCurrentDateFormatted() {
let indexCount = 1; //下一项 const now = new Date();
while (indexCount < data.length) { const year = now.getFullYear();
var item = data.slice(count, count + 1)[0]; //获取没有比较的第一个对象 const month = (now.getMonth() + 1).toString().padStart(2, '0'); // 月份从0开始，所以要加1，并且格式化为两位数
if (!item[`${field}rowSpan`]) { return `${year}-${month}`;
item[`${field}rowSpan`] = 1; //初始化为1 }
} async function getStatisticList() {
if (item[field] === data[indexCount][field] && item['companyName'] === data[indexCount]['companyName']) { loadingRef.value = true;
//第一个对象与后面的对象相比，有相同项就累加，并且后面相同项设置为0 let data = await getListAll(params.value);
item[`${field}rowSpan`]++; // dataSource.value = data;
data[indexCount][`${field}rowSpan`] = 0; let propsList = ['companyName', 'projectName'];
} else { propsList.map((item) => {
count = indexCount; changeData(data, item);
});
loadingRef.value = false;
}
function changeData(data, field) {
if (field == 'companyName') {
let count = 0; //重复项的第一项
let indexCount = 1; //下一项
while (indexCount < data.length) {
var item = data.slice(count, count + 1)[0]; //获取没有比较的第一个对象
if (!item[`${field}rowSpan`]) {
item[`${field}rowSpan`] = 1; //初始化为1
}
if (item[field] === data[indexCount][field]) {
//第一个对象与后面的对象相比，有相同项就累加，并且后面相同项设置为0
item[`${field}rowSpan`]++;
data[indexCount][`${field}rowSpan`] = 0;
} else {
count = indexCount;
}
indexCount++;
} }
}
if (field == 'projectName') {
let count = 0; //重复项的第一项
let indexCount = 1; //下一项
while (indexCount < data.length) {
var item = data.slice(count, count + 1)[0]; //获取没有比较的第一个对象
if (!item[`${field}rowSpan`]) {
item[`${field}rowSpan`] = 1; //初始化为1
}
if (
item[field] === data[indexCount][field] &&
item['companyName'] === data[indexCount]['companyName']
) {
//第一个对象与后面的对象相比，有相同项就累加，并且后面相同项设置为0
item[`${field}rowSpan`]++;
data[indexCount][`${field}rowSpan`] = 0;
} else {
count = indexCount;
}
indexCount++; indexCount++;
}
} }
dataSource.value = data;
} }
dataSource.value = data;
}
// 列表 // 列表
const dataSource = ref([]); const dataSource = ref([]);
// 表头 // 表头
const columns = [ const columns = [
{ {
title: '公司名称', title: '公司名称',
dataIndex: 'companyName', dataIndex: 'companyName',
fixed: 'left', fixed: 'left',
width: 180, width: 180,
customCell: (_, any) => ({ customCell: (_, any) => ({
rowSpan: _.companyNamerowSpan, rowSpan: _.companyNamerowSpan,
}), }),
}, },
{ {
title: '项目名称', title: '项目名称',
dataIndex: 'projectName', dataIndex: 'projectName',
width: 180, width: 180,
}, },
{ {
title: '立项投资额(万元)', title: '立项投资额(万元)',
dataIndex: 'projectInvestment', dataIndex: 'projectInvestment',
width: 180, width: 180,
}, },
{ {
title: '资金来源', title: '资金来源',
dataIndex: 'fundingSource', dataIndex: 'fundingSource',
width: 180, width: 180,
}, },
{ {
title: '招标方式', title: '招标方式',
dataIndex: 'biddingMethod', dataIndex: 'biddingMethod',
width: 180, width: 180,
}, },
{ {
title: '合同类型', title: '合同类型',
dataIndex: 'contracYpe', dataIndex: 'contracYpe',
width: 180, width: 180,
}, },
{ {
title: '合同名称', title: '合同名称',
dataIndex: 'contractName', dataIndex: 'contractName',
width: 180, width: 180,
}, },
{ {
title: '合同形式', title: '合同形式',
dataIndex: 'formOfContract', dataIndex: 'formOfContract',
width: 180, width: 180,
}, },
{ {
title: '合同金额(万元)', title: '合同金额(万元)',
dataIndex: 'contractAmount', dataIndex: 'contractAmount',
width: 180, width: 180,
}, },
{ {
title: '签证变更金额(万元)', title: '签证变更金额(万元)',
dataIndex: 'submittedForSettlement', dataIndex: 'submittedForSettlement',
width: 180, width: 180,
}, },
{ {
title: '结算报送金额(万元)', title: '结算报送金额(万元)',
dataIndex: 'superContractScale', dataIndex: 'superContractScale',
width: 180, width: 180,
}, },
{ {
title: '结算审定金额(万元)', title: '结算审定金额(万元)',
dataIndex: 'sumOfMoney', dataIndex: 'sumOfMoney',
width: 180, width: 180,
}, },
]; ];
const { push } = useRouter(); const { push } = useRouter();
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
::v-deep .ant-table-tbody .ant-table-row { ::v-deep .ant-table-tbody .ant-table-row {
&.rowcolor .ant-table-cell-fix-left { &.rowcolor .ant-table-cell-fix-left {
background-color: #f5f5f5; background-color: #f5f5f5;
}
} }
}
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment