|
@@ -0,0 +1,297 @@
|
|
|
+<template>
|
|
|
+ <div class="app-container">
|
|
|
+ <div class="title-container">
|
|
|
+ <breadcrumb id="breadcrumb-container" class="breadcrumb-container"/>
|
|
|
+ </div>
|
|
|
+ <y-page-list-layout :page-list="pageData" :page-para="listQuery" :get-page-list="getList">
|
|
|
+ <template slot="left">
|
|
|
+ <el-input
|
|
|
+ v-model="listQuery.name"
|
|
|
+ placeholder="项目名称"
|
|
|
+ clearable
|
|
|
+ style="margin-left: 20px;width: 320px;float: left;"
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ <el-input
|
|
|
+ v-model="listQuery.businessNo"
|
|
|
+ placeholder="流水号"
|
|
|
+ clearable
|
|
|
+ style="margin-left: 20px;width: 320px;float: left;"
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ <el-input
|
|
|
+ v-model="listQuery.clientManager"
|
|
|
+ placeholder="客户经理"
|
|
|
+ clearable
|
|
|
+ style="margin-left: 20px;width: 320px;float: left;"
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ <el-select
|
|
|
+ v-model="listQuery.marketerStatus"
|
|
|
+ placeholder="客户经理提成状态"
|
|
|
+ clearable
|
|
|
+ filterable
|
|
|
+ style="margin-left: 20px;width: 150px;float: left;"
|
|
|
+ class="filter-item"
|
|
|
+ >
|
|
|
+ <el-option label="待预提" value="TO_PREDICTING"/>
|
|
|
+ <el-option label="已预提" value="PREDICTED"/>
|
|
|
+ <el-option label="回款中" value="NOT_PAYMENT"/>
|
|
|
+ <el-option label="待结算" value="NOT_SETTLE"/>
|
|
|
+ <el-option label="已结算" value="CLOSED"/>
|
|
|
+ </el-select>
|
|
|
+ <el-select
|
|
|
+ v-model="listQuery.participantStatus"
|
|
|
+ placeholder="参与人提成状态"
|
|
|
+ clearable
|
|
|
+ filterable
|
|
|
+ style="margin-left: 20px;width: 150px;float: left;"
|
|
|
+ class="filter-item"
|
|
|
+ >
|
|
|
+ <el-option label="未开始" value="NOT_START"/>
|
|
|
+ <el-option label="预提中" value="PREDICTING"/>
|
|
|
+ <el-option label="待结算" value="NOT_SETTLE"/>
|
|
|
+ <el-option label="已结算" value="CLOSED"/>
|
|
|
+ </el-select>
|
|
|
+ <el-button
|
|
|
+ class="filter-item"
|
|
|
+ style="margin-left: 10px;float: left;"
|
|
|
+ type="primary"
|
|
|
+ @click="getList"
|
|
|
+ round
|
|
|
+ >搜索
|
|
|
+ </el-button>
|
|
|
+ <el-button
|
|
|
+ class="filter-item"
|
|
|
+ style="float: left;"
|
|
|
+ round
|
|
|
+ type="warning"
|
|
|
+ @click="resetSearch()"
|
|
|
+ >重置
|
|
|
+ </el-button>
|
|
|
+ </template>
|
|
|
+ <parentTable
|
|
|
+ v-loading="listLoading"
|
|
|
+ :data="pageData.records"
|
|
|
+ slot="table"
|
|
|
+ style="width: 100%;"
|
|
|
+ >
|
|
|
+ <el-table-column label="项目名称" align="center" width="250">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <span>{{ row.name }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="事业部流水号" align="center" width="135">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <span>{{ row.businessNo }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="合同金额(元)" align="center" width="110">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <span>{{ row.amount}}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="客户经理" align="center" width="100">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <span>{{ row.clientManager}}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="客户经理可预提" align="center" width="120">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <el-tag type="success">{{ row.marketerAdvanceBrokerageAble===true?'是':'否'}}</el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="客户经理已预提" align="center" width="120">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <el-tag type="success">{{ row.marketerAdvanceBrokerageDone===true?'是':'否'}}</el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="客户经理提成金额(元)" align="center" width="160">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <span>{{ row.marketerBrokerageAmount}}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="客户经理提成状态" align="center" width="150">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <el-tag type="success">{{brokerageStatus(row.marketerStatus)}}</el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="客户经理提成率" align="center" width="120">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <span>{{ row.brokerageRate}}%</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="参与人预计提成总金额(元)" align="center" width="200">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <span>{{ row.participantPredictBrokerageAmount}}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="参与人实际提成总金额(元)" align="center" width="190">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <span>{{ row.participantActualBrokerageAmount}}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="参与人提成状态" align="center" width="120">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <el-tag type="success">{{brokerageStatus(row.participantStatus)}}</el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="预计提成总金额(元)" align="center" width="150">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <span style="color: red">{{ row.brokeragePredictAmount}}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="已提成总金额(元)" align="center" width="130">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <span style="color: red">{{ row.brokerageActualAmount}}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" align="center" width="100" fixed="right">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <el-button
|
|
|
+ class-name="filter-item"
|
|
|
+ type="primary"
|
|
|
+ @click="goDetail(row.id)"
|
|
|
+ round
|
|
|
+ >提成明细</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </parentTable>
|
|
|
+ </y-page-list-layout>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+ import YPageListLayout from '@/components/YPageListLayout'
|
|
|
+ import Breadcrumb from '@/components/Breadcrumb'
|
|
|
+ import PermissionButton from '@/components/PermissionButton/PermissionButton'
|
|
|
+ import { fileDown } from '../../utils/file'
|
|
|
+
|
|
|
+ export default {
|
|
|
+ name: 'ViewsBrokerageCollect',
|
|
|
+ components: {
|
|
|
+ Breadcrumb,
|
|
|
+ YPageListLayout,
|
|
|
+ },
|
|
|
+ filters: {
|
|
|
+ statusFilter(status) {
|
|
|
+ const statusMap = {
|
|
|
+ published: 'success',
|
|
|
+ draft: 'info',
|
|
|
+ deleted: 'danger',
|
|
|
+ }
|
|
|
+ return statusMap[status]
|
|
|
+ },
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ isDisable:false,
|
|
|
+ tableKey: 0,
|
|
|
+ pageData: { records: [] },
|
|
|
+ total: 20,
|
|
|
+ listLoading: true,
|
|
|
+ listQuery: {
|
|
|
+ page: 1,
|
|
|
+ size: 10,
|
|
|
+ descs: 'id',
|
|
|
+ state:null
|
|
|
+ },
|
|
|
+ listQueryKey: 'keyword',
|
|
|
+ importLoading: false,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ goDetail(id){
|
|
|
+ this.$router.push(`/brokerage/item/detail?generalId=${id}`)
|
|
|
+ },
|
|
|
+ resetSearch() {
|
|
|
+ this.listQuery = {
|
|
|
+ current: 1,
|
|
|
+ size: 10,
|
|
|
+ descs: 'id',
|
|
|
+ };
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+ brokerageStatus(val){
|
|
|
+ if (val === 'NOT_START'){
|
|
|
+ return '未开始';
|
|
|
+ }
|
|
|
+ if (val === 'PREDICTING'){
|
|
|
+ return '预提中';
|
|
|
+ }
|
|
|
+ if (val === 'TO_PREDICTING'){
|
|
|
+ return '待预提';
|
|
|
+ }
|
|
|
+ if (val === 'PREDICTED'){
|
|
|
+ return '已预提';
|
|
|
+ }
|
|
|
+ if (val === 'NOT_PAYMENT'){
|
|
|
+ return '回款中';
|
|
|
+ }
|
|
|
+ if (val === 'FREEZE'){
|
|
|
+ return '冻结';
|
|
|
+ }
|
|
|
+ if (val === 'NOT_SETTLE'){
|
|
|
+ return '待结算';
|
|
|
+ }
|
|
|
+ if (val === 'CLOSED'){
|
|
|
+ return '已结算';
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getList() {
|
|
|
+ const that = this;
|
|
|
+ this.listLoading = true;
|
|
|
+ this.$api.itemBrokerageGeneral.list(Object.assign({}, that.listQuery)).then((res) => {
|
|
|
+ that.pageData = res.data;
|
|
|
+ setTimeout(() => {
|
|
|
+ that.listLoading = false
|
|
|
+ }, 200)
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ that.listLoading = false
|
|
|
+ })
|
|
|
+ },
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .right {
|
|
|
+ flex: 1;
|
|
|
+
|
|
|
+ .title {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 500;
|
|
|
+ color: rgba(51, 51, 51, 1);
|
|
|
+ line-height: 35px;
|
|
|
+ margin-bottom: 8px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .menu-2-box {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .menu-2-item {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ color: #656565;
|
|
|
+ font-size: 12px;
|
|
|
+ width: 230px;
|
|
|
+ height: 101px;
|
|
|
+ background: rgb(255, 185, 129);
|
|
|
+ border-radius: 3px;
|
|
|
+ padding-left: 20px;
|
|
|
+ margin-right: 10px;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ cursor: pointer;
|
|
|
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
|
|
|
+
|
|
|
+ .text {
|
|
|
+ margin-left: 16px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|