|
@@ -2,21 +2,16 @@
|
|
|
<div class="manage">
|
|
|
<div class="add-container">
|
|
|
<el-button type="primary" @click="append('INCOME')">增加收入</el-button>
|
|
|
- <el-button type="primary" @click="append('COST')">增加支出</el-button>
|
|
|
+ <el-button type="primary" @click="append('COST')">增加成本</el-button>
|
|
|
</div>
|
|
|
<el-card class="right-card">
|
|
|
<el-table
|
|
|
:data="manageData"
|
|
|
- style="width: 100%">
|
|
|
+ style="width: 100%"
|
|
|
+ :row-class-name="tableRowClassName">
|
|
|
<el-table-column type="expand">
|
|
|
<template slot-scope="props">
|
|
|
<el-form label-position="left" inline class="demo-table-expand">
|
|
|
- <el-form-item label="部门">
|
|
|
- <span>{{ props.row.department.name }}</span>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="ID">
|
|
|
- <span>{{ props.row.id }}</span>
|
|
|
- </el-form-item>
|
|
|
<el-form-item label="备注">
|
|
|
<span>{{ props.row.remark }}</span>
|
|
|
</el-form-item>
|
|
@@ -30,7 +25,7 @@
|
|
|
<el-table-column
|
|
|
label="类型">
|
|
|
<template slot-scope="props">
|
|
|
- <span>{{ props.row.type == 'COST' ? '支出' : '收入' }}</span>
|
|
|
+ <span>{{ props.row.type == 'COST' ? '成本' : '收入' }}</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
@@ -42,10 +37,16 @@
|
|
|
prop="project.name">
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
- label="明细"
|
|
|
- prop="amount">
|
|
|
+ label="产品"
|
|
|
+ prop="product.name">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="金额">
|
|
|
+ <template slot-scope="props">
|
|
|
+ <span>{{ props.row.type == 'COST' ? '-' + props.row.amount : '+' + props.row.amount }}</span>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="操作">
|
|
|
+ <el-table-column label="操作" width="80">
|
|
|
<template slot-scope="scope">
|
|
|
<el-button
|
|
|
size="mini"
|
|
@@ -60,7 +61,7 @@
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
</el-card>
|
|
|
- <el-dialog :title="type" :visible.sync="dialogFormVisible">
|
|
|
+ <el-dialog :title="type == 'INCOME' ? '收入' : '成本'" :visible.sync="dialogFormVisible">
|
|
|
<el-form :model="form" ref="form">
|
|
|
<el-form-item label="选择部门" prop="deptId" :label-width="formLabelWidth" :rules="[{ required: true, message: '名称不能为空'}]">
|
|
|
<el-select v-model="form.deptId" placeholder="请选择部门">
|
|
@@ -92,7 +93,7 @@
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
- <el-form-item v-else label="支出类型" prop="costTypeId" :label-width="formLabelWidth" :rules="[{ required: true, message: '状态不能为空'}]">
|
|
|
+ <el-form-item v-else label="成本类型" prop="costTypeId" :label-width="formLabelWidth" :rules="[{ required: true, message: '状态不能为空'}]">
|
|
|
<el-select v-model="form.costTypeId" placeholder="请选择类型">
|
|
|
<el-option
|
|
|
v-for="item in costTypeSelectData"
|
|
@@ -109,7 +110,7 @@
|
|
|
<el-option label="内部核算" value="INTERNAL"></el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
- <el-form-item v-else label="支出人" prop="companyType" :label-width="formLabelWidth" :rules="[{ required: true, message: '状态不能为空'}]">
|
|
|
+ <el-form-item v-else label="成本部门/单位/人" prop="companyType" :label-width="formLabelWidth" :rules="[{ required: true, message: '状态不能为空'}]">
|
|
|
<el-select v-model="form.companyType" placeholder="请选择状态值" @change="selectChange">
|
|
|
<el-option label="外部" value="COMPANY"></el-option>
|
|
|
<el-option label="部门" value="DEPARTMENT"></el-option>
|
|
@@ -224,6 +225,14 @@ export default {
|
|
|
})
|
|
|
},
|
|
|
methods: {
|
|
|
+ tableRowClassName({row, rowIndex}) {
|
|
|
+ if (row.type === 'COST') {
|
|
|
+ return 'cost-row';
|
|
|
+ } else {
|
|
|
+ return 'income-row';
|
|
|
+ }
|
|
|
+ return '';
|
|
|
+ },
|
|
|
//选项框联动
|
|
|
selectChange(val) {
|
|
|
switch (val) {
|
|
@@ -328,5 +337,12 @@ export default {
|
|
|
margin-bottom: 0;
|
|
|
width: 50%;
|
|
|
}
|
|
|
+ .el-table .cost-row {
|
|
|
+ color: green;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-table .income-row {
|
|
|
+ color: red;
|
|
|
+ }
|
|
|
</style>
|
|
|
|