Skip to content

D
dsk-operate-sys-cscec
Commit dcfd8615 authored by tyn's avatar tyn
Browse files
Options

merge

parent 127904c7
Hide whitespace changes
Inline Side-by-side
Showing with 771 additions and 7 deletions
dsk-operate-ui/src/api/projectCostLedger/index.js
View file @ dcfd8615
......@@ -376,3 +376,40 @@ export const getFieldExpensesOtherListApi = (params = {}) => request({
method: "get",
params
});
// 成本汇总
/**
* 成本汇总左侧一级菜单
* @param {*} params
* @returns
*/
export const getCostSummaryMenuTreeApi = (params = {}) => request({
url: "/cbSummary/cbNameList",
method: "get",
params
});
/**
* 成本汇总已添加成本月份
* @param {*} params
* @returns
*/
export const getCostSummaryMonthListApi = (params = {}) => request({
url: "/cbSummary/expenseDateList",
method: "get",
params
});
/**
* 获取成本汇总数据列表
* @param {*} params
* @returns
*/
export const getCostSummaryListApi = (params = {}) => request({
url: "/cbSummary/list",
method: "get",
params
});
dsk-operate-ui/src/assets/styles/index.scss
View file @ dcfd8615
......@@ -553,7 +553,6 @@ li {
background: #dcebff;
}
.el-table__fixed {
//bottom:0 !important;
.el-table__body {
padding-bottom: 16px;
}
......@@ -582,7 +581,7 @@ li {
background: rgba(0,0,0,.2);
border: 4px solid #f3f4f5;
&:hover {
background: #7d7d7d;
// background: #7d7d7d;
}
}
.el-scrollbar {
......
dsk-operate-ui/src/components/CustomTable/index.vue
View file @ dcfd8615
<template>
<div class="table-list-com-ins"
<div class="custom-table-list-com-ins"
:class="{'is-empty-table' : !tableDataTotal,'no-pagination' : !hasQueryParams,'auto-max-height' : maxHeight,'has-y-Scroll' : maxHeight && hasYScroll}"
:style="maxBodyFixedStyle">
<div class="table-item">
......@@ -300,7 +300,7 @@ export default {
</script>
<style lang="scss" scoped>
.table-list-com-ins {
.custom-table-list-com-ins {
/* 空数据样式 */
&.is-empty-table {
.table-item {
......@@ -428,6 +428,154 @@ export default {
}
.el-table {
width: 100%;
height: auto;
font-size: 14px;
color: #232323;
.cell {
padding-right: 12px;
padding-left: 12px;
line-height: 21px;
font-size: 12px;
font-weight: 400;
}
th {
height: 40px;
padding: 9px 0px;
.cell {
color: rgba(35, 35, 35, 0.8);
}
}
td {
padding: 9px 0px;
.cell {
color: #232323;
}
}
.sort-caret.ascending {
border-bottom-color: rgba(0, 129, 255, 0.5);
}
.ascending .sort-caret.ascending {
border-bottom-color: #0081ff;
}
.sort-caret.descending {
border-top-color: rgba(0, 129, 255, 0.5);
}
.descending .sort-caret.descending {
border-top-color: #0081ff;
}
.el-table__header-wrapper {
box-sizing: border-box;
th {
background: #f0f3fa;
}
}
.el-table__fixed-header-wrapper {
th {
background: #f0f3fa;
}
}
.el-table__body tr.current-row > td.el-table__cell {
background: none;
}
.caret-wrapper {
width: 10px;
}
.el-table__body-wrapper {
&::-webkit-scrollbar {
width: 16px; //竖轴宽度
height: 16px; //横轴宽度
}
&::-webkit-scrollbar-track {
background-color: #f3f4f5;
border-radius: 0;
}
&::-webkit-scrollbar-thumb {
background: rgba(0, 0, 0, 0.2);
border: 4px solid #f3f4f5;
border-radius: 10px;
}
&::-webkit-scrollbar-corner {
background: #f3f4f5;
}
tr {
&.current-row > td {
background-color: initial;
}
&:nth-child(2n) {
background: #f8fbff;
}
}
tr:hover > td.el-table__cell {
background: #dcebff;
}
}
.el-table__body tr.hover-row > td.el-table__cell {
background: #dcebff;
}
.el-table__fixed {
.el-table__body {
padding-bottom: 16px;
}
tr:nth-child(2n) {
background-color: #f8fbff;
}
}
::-webkit-scrollbar-track-piece {
//滚动条凹槽的颜色，还可以设置边框属性
background-color: #f3f4f5;
height: 16px;
padding: 0 4px;
}
//滚动条的宽度
::-webkit-scrollbar {
width: 8px;
height: 16px;
background-color: #f3f4f5;
border-radius: 6px;
}
//滚动条的滑块
::-webkit-scrollbar-thumb {
border-radius: 8px;
height: 8px;
margin: 0 4px;
background: rgba(0, 0, 0, 0.2);
border: 4px solid #f3f4f5;
&:hover {
background: #7d7d7d;
}
}
.el-scrollbar {
height: 16px;
.el-scrollbar__bar.is-horizontal {
height: 8px;
}
.el-scrollbar__thumb {
background: rgba(0, 0, 0, 0.2);
&:hover {
background: #566380;
}
}
}
&.custom-table {
.el-table__body-wrapper {
/* 滚动条在最左侧时 */
......
dsk-operate-ui/src/views/projectCostLedger/detail/components/CostSummary/index.vue 0 → 100644
View file @ dcfd8615
<template>
<div class="cost-summary-container">
<!-- 按项目汇总 成本汇总切换 -->
<div class="category-type-container">
<div class="category-list-item" v-for="(type,index) of categoryList" :key="type.value"
:class="{'is-current-category' : currentCategory == type.value}" @click.stop="currentCategoryChange(type.value)">{{type.label}}</div>
</div>
<!-- 成本菜单以及列表 -->
<div class="cost-summary-content-container">
<!-- 左侧菜单 -->
<div class="left-side-menu">
<project-side-menu ref="projectSideMenu" :menuTree="menuTreeList" :menuOptions="menuOptions" :unique-opened="false"
:default-active="currentNodeValue" @select="menuSelect">
<template slot="成本汇总-1">
<img src="@/assets/images/projectCostLedger/icon_cost_detail_8.svg" alt="">
<div class="project-sub-menu-title-text">成本汇总</div>
</template>
</project-side-menu>
</div>
<!-- 右侧列表 -->
<div class="right-table-list-container">
<div class="project-table-list-header">
<div class="project-table-list-haeder-left">
<el-select v-model="recordDate" placeholder="请选择年月" class="project-month-select-options" clearable @change="monthChange">
<el-option v-for="item in monthList" :key="item.expenseDate" :label="item.label" :value="item.expenseDate">
</el-option>
</el-select>
</div>
<div class="project-table-list-haeder-right">
</div>
</div>
<!-- 数据列表部分 -->
<div class="project-feedsummary-list-container">
<dsk-skeleton v-if="tableLoading"></dsk-skeleton>
<!-- 非实体工程材料列表 -->
<el-form :model="dataForm" ref="feedSummaryForm" :show-message="false" v-else-if="!tableLoading" class="feed-summary-form">
<custom-table :tableData="dataForm.tableDataList" :formColum="formColum" :max-height="true" :tableDataTotal="total" :paging="false"
:cell-class-name="cellClassName">
</custom-table>
</el-form>
</div>
</div>
</div>
</div>
</template>
<script>
import ProjectSideMenu from "@/views/projectCostLedger/detail/components/ProjectSideMenu";
import DskSkeleton from "@/components/DskSkeleton";
import CustomTable from "@/components/CustomTable";
import { getCostSummaryMenuTreeApi, getCostSummaryMonthListApi, getCostSummaryListApi } from "@/api/projectCostLedger";
import { v4 } from 'uuid';
import dayjs from "dayjs";
import { cloneDeep } from "lodash-es";
import { add } from "@/utils/decimal";
export default {
name: "costSummary",
props: {
// 项目ID
projectId: {
type: String,
required: true,
default: ""
},
// 详情信息
projectDetailInfo: {
type: Object,
default: () => ({})
}
},
watch: {
projectDetailInfo: {
handler(newValue) {
this.comProjectDetailInfo = newValue ? cloneDeep(newValue) : {};
this.init(this.comProjectDetailInfo);
},
deep: true,
},
projectId: {
handler(newValue) {
this.comProjectId = newValue;
}
},
recordDate: {
handler(newValue, oldValue) {
this.oldRecordDate = newValue;
}
}
},
components: {
ProjectSideMenu,
DskSkeleton,
CustomTable
},
data() {
return {
// 当前分类 1 按项目汇总 2 成本汇总
currentCategory: 1,
categoryList: [
{
label: "按项目汇总",
value: 1
},
{
label: "成本科目汇总",
value: 2
},
],
menuOptions: {
nodeName: "cbName",
nodeValue: "id",
},
comProjectDetailInfo: this.projectDetailInfo ? cloneDeep(this.projectDetailInfo) : {},
comProjectId: this.projectId,
menuTreeList: [],
// 加载数据列表
tableLoading: true,
total: 0,
// 列表表头
formColum: [
// { label: '序号', prop: "staticSerialNumber", type: "index", lock: true, width: "53", fixed: false, uid: v4() },
// { label: '操作', prop: "action-field-bar", width: "99", uid: v4(), fixed: "right" },
],
monthList: [],
// 源数据月份
originMonthList: [],
dataForm: {
// 数据列表源数据
tableDataList: [],
},
// 当前查询的数据月份
recordDate: "",
// 历史查询月份
oldRecordDate: "",
// 当前选中子菜单的父类名称
currentParentName: "",
// 当前选中的成本科目
currentNodeValue: "",
// 源数据列表
originTableDataList: [],
// 填写成本弹窗
showAddActualCost: false,
// 填写成本 编辑状态
addActualCostEditStatus: false,
// 当前选择的成本年份
selectActualCostTime: "",
};
},
//可访问data属性
created() {
this.init(this.comProjectDetailInfo);
},
//计算集
computed: {
},
//方法集
methods: {
cellClassName({ row, column, rowIndex, columnIndex }) {
// console.log(column);
const { property } = column;
if (editPropNames.includes(property)) {
return `can-edit-column-${property}`;
}
return "";
},
getNowMonth() {
return dayjs(new Date().valueOf()).format("YYYYMM");
},
// 返回当前月是否在server month集合中
includeNowMonth(time) {
return this.originMonthList.includes(time);
},
currentCategoryChange(category) {
if (category == this.currentCategory) return;
this.currentCategory = category;
},
async init(detail = {}, resetDate = "") {
try {
this.resetEditStatus();
const { projectId, cbStage } = detail;
if (!projectId) return;
const params = {
projectId,
cbStage,
cbType: this.currentCategory
};
await this.getCostSummaryMenuTree(params);
await this.getCostSummaryMonthList(params);
await this.initDefaultSetting(resetDate);
} catch (error) {
console.log(error);
} finally {
this.tableLoading = false;
}
},
async initDefaultSetting(resetDate = "") {
try {
await this.$nextTick();
const first = this.$refs["projectSideMenu"].getFirstLevelWithDeepId();
const menus = this.$refs["projectSideMenu"].getResultMenuList();
const defaultCurrent = this.findMenuNode(menus, first);
// 默认选中结构劳务分包
if (defaultCurrent) {
this.currentNodeValue = defaultCurrent.nodeValue;
const parentName = defaultCurrent.parent ? this.getCurrentType(defaultCurrent.parent) : defaultCurrent.nodeName;
if (parentName) this.currentParentName = parentName;
const params = this.createRequestConditions(resetDate);
await this.getCostSummaryList(params);
}
} catch (error) {
console.log(error);
}
},
getCurrentType(parent) {
if (parent.level == 2) {
return parent.nodeName;
}
if (parent.parent) {
return this.getCurrentType(parent.parent);
}
},
findMenuNode(tree, nodeValue, targetName = "nodeValue") {
for (const item of tree) {
if (item[targetName] == nodeValue) return item;
if (item.children instanceof Array) {
const result = this.findMenuNode(item.children, nodeValue, targetName);
if (result) return result;
}
}
},
// 创建查询条件
createRequestConditions(resetDate = "") {
const { projectId, cbStage } = this.comProjectDetailInfo;
const params = {
projectId,
cbStage
};
params["id"] = this.currentNodeValue;
params["cbType"] = this.currentCategory;
// 判断当月是否存在于server返回month集合中 有传入的重置时间 采用重置时间
const _now = this.getNowMonth();
if (resetDate && this.includeNowMonth(resetDate)) {
params["recordDate"] = resetDate;
} else if (this.includeNowMonth(_now)) {
params["recordDate"] = _now;
}
return params;
},
async getCostSummaryMenuTree(params) {
try {
const result = await getCostSummaryMenuTreeApi(params);
if (result.code == 200 && result.data instanceof Array) {
const _tempArray = result.data;
const _tempMenu = {
id: 0,
cbName: this.currentCategory == 1 ? "成本汇总" : "房建类成本科目",
children: _tempArray
};
this.menuTreeList = [_tempMenu];
}
} catch (error) {
}
},
async getCostSummaryMonthList(params) {
try {
const monthList = await getCostSummaryMonthListApi(params);
if (monthList.code == 200 && monthList.data instanceof Array) {
const data = monthList.data;
this.originMonthList = cloneDeep(data);
const _now = this.getNowMonth();
this.recordDate = _now;
// this.oldRecordDate = _now;
// 默认以当前月数据为准 若不包含当前月 需要手动push数据
if (!data.includes(_now)) {
data.push({
expenseDate: _now,
isLock: 0
});
}
// 年月排序
let _tempMonthList = this.monthsSort(data);
_tempMonthList = _tempMonthList.map(item => {
return {
label: dayjs(item.expenseDate).format("YYYY年MM月"),
expenseDate: item.expenseDate,
isLock: item.isLock
};
});
this.monthList = _tempMonthList;
}
} catch (error) {
}
},
monthChange(month) {
// 当前月
const _now = this.getNowMonth();
// 请求列表参数
const params = this.createRequestConditions();
// 清空了年月 默认选中当前月
if (!month) {
this.recordDate = _now;
// 如果命中的旧月份 等于当前月 且 不处于编辑状态 说明清空的是默认查询月 不调用接口
if (this.oldRecordDate == _now && !this.addActualCostEditStatus) return;
} else {
// 正常选择
params["recordDate"] = month;
}
this.resetEditStatus();
// 获取列表数据
this.getFeedSummaryList(params);
},
monthsSort(monthList) {
const sortResult = monthList.sort((before, after) => {
const _before = Object.prototype.toString.call(before) == "[object Object]" ? before["expenseDate"] : before;
const _after = Object.prototype.toString.call(before) == "[object Object]" ? after["expenseDate"] : after;
return parseInt(_after) - parseInt(_before);
});
return sortResult;
},
async getCostSummaryList(params = {}) {
try {
this.tableLoading = true;
const list = await getCostSummaryListApi(params);
if (list.code == 200 && list.data instanceof Array) {
const _temp = list.data;
this.$set(this.dataForm, "tableDataList", cloneDeep(_temp));
this.originTableDataList = cloneDeep(_temp);
this.total = _temp.length;
}
} catch (error) {
console.log(error);
} finally {
this.tableLoading = false;
}
},
// 编辑状态下 进行了其它操作
resetEditStatus() {
// 当前需要编辑或者新增的成本年份
const _selectActualCostTime = this.selectActualCostTime;
this.addActualCostEditStatus = false;
this.selectActualCostTime = "";
/**
* 判断 当前需要编辑 或者新增的成本年份是否存在于server返回的month数组中 不存在则删除 该月份 然后 选中当前月
* 默认本月
*/
if (!_selectActualCostTime) return;
if (!this.originMonthList.includes(_selectActualCostTime) && _selectActualCostTime != this.getNowMonth()) {
const index = this.monthList.findIndex(item => item.value == _selectActualCostTime);
if (index != -1) {
this.monthList.splice(index, 1);
this.recordDate = this.getNowMonth();
}
}
},
async menuSelect(currentId, currentTemp) {
this.resetEditStatus();
this.currentNodeValue = currentId;
const parentName = currentTemp.parent ? this.getCurrentType(currentTemp.parent) : currentId;
if (parentName) this.currentParentName = parentName;
const params = this.createRequestConditions(this.recordDate);
this.getFeedSummaryList(params);
},
},
}
</script>
<style lang="scss" scoped>
.cost-summary-container {
width: 100%;
height: 100%;
overflow: hidden;
.category-type-container {
height: 64px;
width: 100%;
display: flex;
align-items: center;
padding: 16px;
box-sizing: border-box;
border-bottom: 1px solid #eeeeee;
background: #fff;
.category-list-item {
height: 32px;
padding: 0px 20px;
color: #303133;
font-size: 12px;
font-weight: 400;
border-radius: 4px;
border: 1px solid #dcdfe6;
box-sizing: border-box;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
transition: all 0.3s;
&:nth-of-type(2n - 1) {
border-right: unset !important;
border-top-right-radius: 0px;
border-bottom-right-radius: 0px;
}
&:nth-of-type(2n) {
border-left: unset !important;
border-top-left-radius: 0px;
border-bottom-left-radius: 0px;
}
&.is-current-category {
color: #fff;
border: 1px solid #0081ff;
background: #0081ff;
}
}
}
.cost-summary-content-container {
width: 100%;
height: calc(100% - 64px);
display: flex;
align-items: center;
overflow: hidden;
.left-side-menu {
width: 220px;
min-width: 220px;
height: 100%;
}
.right-table-list-container {
width: calc(100% - 220px);
height: 100%;
box-sizing: border-box;
background: #fff;
padding: 16px;
::v-deep .project-table-list-header {
margin-bottom: 16px;
display: flex;
align-items: center;
justify-content: space-between;
.project-table-list-haeder-left {
display: flex;
align-items: center;
.project-month-select-options {
width: 140px;
.el-input__inner {
height: 32px;
line-height: 32px;
padding: 0px 12px;
border-radius: 2px;
border-color: #dcdfe6;
font-size: 14px;
color: #232323;
font-weight: 350;
}
.el-input__suffix {
right: 12px;
.el-input__icon {
line-height: 32px;
width: auto;
}
}
.el-input__prefix {
display: none;
}
}
}
.project-table-list-haeder-right {
display: flex;
align-items: center;
.actual-cost-btn,
.unit-conversion-btn {
height: 32px;
display: flex;
align-items: center;
justify-content: center;
padding: 0px 12px;
background-color: #0081ff;
border-color: #0081ff;
border-radius: 4px;
color: #fff;
font-size: 14px;
font-weight: 350;
margin-right: 16px;
}
}
}
.project-feedsummary-list-container {
position: relative;
width: 100%;
height: calc(100% - 48px);
overflow: auto;
.feed-summary-form {
height: 100%;
}
.dsk-skeleton-outer-container {
padding: 0px;
height: 100%;
}
::v-deep .custom-table-list-com-ins {
.table-item {
.el-table {
th {
height: 40px;
}
.cell {
font-size: 14px;
font-weight: 350;
}
.inner-edit-input-item {
margin-bottom: 0px;
.el-form-item__content {
line-height: 32px;
}
&.is-error {
.el-input__inner {
&:focus {
border-color: #ff4949;
}
}
}
.el-input__inner {
line-height: 32px;
height: 32px;
border-radius: 2px;
padding-left: 8px;
&:focus {
border-color: #0081ff;
}
}
.el-input__clear {
line-height: 32px;
}
}
}
}
}
.project-action-field-bar {
display: flex;
align-items: center;
.push-project-use {
color: #0081ff;
font-size: 14px;
font-weight: 350;
cursor: pointer;
&.is-emty-quantities {
cursor: not-allowed;
color: rgba(35, 35, 35, 0.4);
}
}
}
}
}
}
}
</style>
dsk-operate-ui/src/views/projectCostLedger/detail/components/FeedSummary/index.vue
View file @ dcfd8615
......@@ -850,7 +850,7 @@ export default {
height: 100%;
}
::v-deep .table-list-com-ins {
::v-deep .custom-table-list-com-ins {
.table-item {
.el-table {
th {
......
dsk-operate-ui/src/views/projectCostLedger/detail/components/FieldExpenses/index.vue
View file @ dcfd8615
......@@ -466,7 +466,7 @@ export default {
height: 100%;
}
::v-deep .table-list-com-ins {
::v-deep .custom-table-list-com-ins {
.table-item {
.el-table {
th {
......
dsk-operate-ui/src/views/projectCostLedger/detail/index.vue
View file @ dcfd8615
......@@ -29,6 +29,9 @@
<!-- 现场经费 -->
<field-expenses v-if="current == 'fieldExpenses'" :project-id="projectId" :project-detail-info="detailInfo"></field-expenses>
<!-- 成本汇总 -->
<cost-summary v-if="current == 'cost'" :project-id="projectId" :project-detail-info="detailInfo"></cost-summary>
</div>
</div>
</div>
......@@ -50,6 +53,8 @@ import OtherProjects from "@/views/projectCostLedger/detail/components/OtherProj
import ProfitLoss from "@/views/projectCostLedger/detail/components/ProfitLoss";
// 现场经费
import FieldExpenses from "@/views/projectCostLedger/detail/components/FieldExpenses";
// 成本汇总
import CostSummary from "@/views/projectCostLedger/detail/components/CostSummary";
import { v4 } from "uuid";
import { cloneDeep } from "lodash-es";
import { getProjectDetailApi } from "@/api/projectCostLedger";
......@@ -64,7 +69,8 @@ export default {
OtherProjects,
ProfitLoss,
MeasureItems,
FieldExpenses
FieldExpenses,
CostSummary
},
data() {
return {
......
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