|
|
@@ -1,183 +1,203 @@
|
|
|
<template>
|
|
|
<div class="tenant">
|
|
|
- <div class="content">
|
|
|
- <div style="padding: 20px 0 0 20px">
|
|
|
- <el-form :inline="true" :model="queryForm">
|
|
|
- <el-form-item label="年份">
|
|
|
- <el-date-picker
|
|
|
- v-model="queryForm.time"
|
|
|
- type="year"
|
|
|
- placeholder="请选择"
|
|
|
- format="YYYY"
|
|
|
- value-format="YYYY"
|
|
|
- clearable
|
|
|
- @change="onQuery"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="业务员">
|
|
|
- <el-select
|
|
|
- v-model="queryForm.userId"
|
|
|
- placeholder="请选择"
|
|
|
- clearable
|
|
|
- @change="onQuery"
|
|
|
+ <div style="padding: 20px 0 0 20px; background: #fff">
|
|
|
+ <el-form :inline="true" :model="queryForm">
|
|
|
+ <el-form-item label="年份">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="queryForm.time"
|
|
|
+ type="year"
|
|
|
+ placeholder="请选择"
|
|
|
+ format="YYYY"
|
|
|
+ value-format="YYYY"
|
|
|
+ clearable
|
|
|
+ @change="onQuery"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="业务员">
|
|
|
+ <el-select
|
|
|
+ v-model="queryForm.userId"
|
|
|
+ placeholder="请选择"
|
|
|
+ clearable
|
|
|
+ @change="onQuery"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in userList"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ :key="item.value"
|
|
|
>
|
|
|
- <el-option
|
|
|
- v-for="item in userList"
|
|
|
- :label="item.label"
|
|
|
- :value="item.value"
|
|
|
- :key="item.value"
|
|
|
- >
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item>
|
|
|
- <el-button type="primary" @click="onQuery">搜索</el-button>
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
- </div>
|
|
|
- <byTable
|
|
|
- :hideTable="true"
|
|
|
- :hidePagination="true"
|
|
|
- :source="sourceList.data"
|
|
|
- :pagination="sourceList.pagination"
|
|
|
- :config="config"
|
|
|
- :loading="loading"
|
|
|
- :statConfig="statConfig"
|
|
|
- :selectConfig="selectConfig"
|
|
|
- highlight-current-row
|
|
|
- :action-list="[]"
|
|
|
- @get-list="getList"
|
|
|
- >
|
|
|
- <template #amount="{ item }">
|
|
|
- <div></div>
|
|
|
- </template>
|
|
|
- </byTable>
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="primary" @click="onQuery">搜索</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <div style="margin: 20px 0; padding: 0 20px; background: #fff">
|
|
|
<div
|
|
|
- style="padding: 0 20px 20px 20px; background-color: white"
|
|
|
- v-if="rateStatus"
|
|
|
+ style="
|
|
|
+ color: #000;
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: 700;
|
|
|
+ height: 60px;
|
|
|
+ line-height: 60px;
|
|
|
+ "
|
|
|
>
|
|
|
- <el-table v-loading="loading" :data="sourceList.data">
|
|
|
- <el-table-column label="合同编号">
|
|
|
- <el-table-column label="" prop="contractCode" width="160">
|
|
|
- <template #default="{ row }">
|
|
|
- <div style="width: 100%">
|
|
|
- <a
|
|
|
- style="
|
|
|
- color: #409eff;
|
|
|
- cursor: pointer;
|
|
|
- word-break: break-all;
|
|
|
- "
|
|
|
- @click="openDetails(row)"
|
|
|
- >{{ row.contractCode }}</a
|
|
|
- >
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="客户名称">
|
|
|
- <el-table-column label="" prop="customerName" min-width="200" />
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="业务员">
|
|
|
- <el-table-column label="" prop="userName" width="120" />
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="销售合同金额">
|
|
|
- <el-table-column label="" prop="contractAmount" width="120">
|
|
|
- <template #default="{ row }">
|
|
|
- <div style="width: 100%">
|
|
|
- {{ row.contractCurrency }}
|
|
|
- {{ moneyFormat(row.contractAmount, 2) }}
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="收入">
|
|
|
- <el-table-column
|
|
|
- label="合同到账"
|
|
|
- prop="contractArrival"
|
|
|
- width="120"
|
|
|
- />
|
|
|
- <el-table-column label="退税" prop="taxReturnAmount" width="120" />
|
|
|
- <el-table-column label="其他收入" prop="otherIncome" width="120" />
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="采购合同金额">
|
|
|
- <el-table-column label="" prop="purchaseAmount" width="120">
|
|
|
- <template #default="{ row }">
|
|
|
- <div style="width: 100%">
|
|
|
- {{ row.purchaseCurrency }}
|
|
|
- {{ moneyFormat(row.purchaseAmount, 2) }}
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="支出">
|
|
|
- <el-table-column label="支付货款" prop="payForGoods" width="120" />
|
|
|
- <el-table-column
|
|
|
- label="其他支出"
|
|
|
- prop="otherExpenses"
|
|
|
- width="120"
|
|
|
- />
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="统计">
|
|
|
- <el-table-column label="收入合计" prop="totalIncome" width="120" />
|
|
|
- <el-table-column
|
|
|
- label="支出合计"
|
|
|
- prop="totalExpenses"
|
|
|
- width="120"
|
|
|
- />
|
|
|
- <el-table-column label="毛利" prop="grossGrofit" width="120" />
|
|
|
- <el-table-column label="毛利率" prop="grossRofitMargin" width="120">
|
|
|
- <template #default="{ row }">
|
|
|
- <div style="width: 100%">{{ row.grossRofitMargin }}%</div>
|
|
|
- </template></el-table-column
|
|
|
- >
|
|
|
+ 统计
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <ul id="ul-box">
|
|
|
+ <li
|
|
|
+ v-for="(i, index) in statConfig[0].data"
|
|
|
+ v-show="i.data"
|
|
|
+ :key="index"
|
|
|
+ class="multi-data"
|
|
|
+ :class="'theme' + i.type"
|
|
|
+ @click="i.click ? i.click(i, index) : ''"
|
|
|
+ :style="i.click ? 'cursor: pointer' : ''"
|
|
|
+ >
|
|
|
+ <div class="label">{{ i.label }}</div>
|
|
|
+ <div class="num-warp">
|
|
|
+ <div class="num-box" v-for="(j, jindex) in i.data" :key="jindex">
|
|
|
+ <div class="num-small" :style="'color:' + j.color">
|
|
|
+ {{ j.num }}
|
|
|
+ </div>
|
|
|
+ <div class="label-small">{{ j.label }}</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div
|
|
|
+ style="padding: 0 20px 20px 20px; background-color: white"
|
|
|
+ v-if="rateStatus"
|
|
|
+ >
|
|
|
+ <div class="by-search">
|
|
|
+ <div></div>
|
|
|
+ <div style="display: flex; margin-top: 15px">
|
|
|
+ <el-input
|
|
|
+ :placeholder="$t('common.pleaseEnterKeywords')"
|
|
|
+ suffix-icon="search"
|
|
|
+ size="mini"
|
|
|
+ v-model="sourceList.pagination.keyword"
|
|
|
+ @keyup.enter="getList"
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ style="margin-left: 10px"
|
|
|
+ size="default"
|
|
|
+ v-no-double-click="getList"
|
|
|
+ >{{ $t("common.search") }}</el-button
|
|
|
+ >
|
|
|
+ <!-- <div class="more-icon">
|
|
|
+ <i class="iconfont icon-iconx_saixuan"></i>
|
|
|
+ </div> -->
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <el-table v-loading="loading" :data="sourceList.data">
|
|
|
+ <el-table-column label="合同编号">
|
|
|
+ <el-table-column label="" prop="contractCode" width="160">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <div style="width: 100%">
|
|
|
+ <a
|
|
|
+ style="color: #409eff; cursor: pointer; word-break: break-all"
|
|
|
+ @click="openDetails(row)"
|
|
|
+ >{{ row.contractCode }}</a
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="提成">
|
|
|
- <el-table-column label="售后" prop="afterSalesAmount" width="120" />
|
|
|
- <el-table-column label="公共" prop="publicAmount" width="120" />
|
|
|
- <el-table-column
|
|
|
- label="总办"
|
|
|
- prop="haveOverallAmount"
|
|
|
- width="120"
|
|
|
- />
|
|
|
- <el-table-column
|
|
|
- label="部门提成"
|
|
|
- prop="departmentalCommission"
|
|
|
- width="120"
|
|
|
- />
|
|
|
- <el-table-column
|
|
|
- label="个人提成"
|
|
|
- prop="personalCommission"
|
|
|
- width="120"
|
|
|
- />
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="客户名称">
|
|
|
+ <el-table-column label="" prop="customerName" min-width="200" />
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="业务员">
|
|
|
+ <el-table-column label="" prop="userName" width="120" />
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="销售合同金额">
|
|
|
+ <el-table-column label="" prop="contractAmount" width="120">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <div style="width: 100%">
|
|
|
+ {{ row.contractCurrency }}
|
|
|
+ {{ moneyFormat(row.contractAmount, 2) }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="收入">
|
|
|
<el-table-column
|
|
|
- label="操作"
|
|
|
- align="center"
|
|
|
- width="100"
|
|
|
- fixed="right"
|
|
|
- >
|
|
|
+ label="合同到账"
|
|
|
+ prop="contractArrival"
|
|
|
+ width="120"
|
|
|
+ />
|
|
|
+ <el-table-column label="退税" prop="taxReturnAmount" width="120" />
|
|
|
+ <el-table-column label="其他收入" prop="otherIncome" width="120" />
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="采购合同金额">
|
|
|
+ <el-table-column label="" prop="purchaseAmount" width="120">
|
|
|
<template #default="{ row }">
|
|
|
- <div>
|
|
|
- <el-button type="primary" @click="changeExchangeRate(row)" link
|
|
|
- >调整</el-button
|
|
|
- >
|
|
|
+ <div style="width: 100%">
|
|
|
+ {{ row.purchaseCurrency }}
|
|
|
+ {{ moneyFormat(row.purchaseAmount, 2) }}
|
|
|
</div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- </el-table>
|
|
|
- </div>
|
|
|
- <el-row style="padding: 20px" justify="end" type="flex">
|
|
|
- <el-pagination
|
|
|
- background
|
|
|
- layout="total, sizes, prev, pager, next, jumper"
|
|
|
- :current-page="sourceList.pagination.pageNum"
|
|
|
- :page-size="sourceList.pagination.pageSize"
|
|
|
- :total="sourceList.pagination.total"
|
|
|
- @size-change="handleSizeChange"
|
|
|
- @current-change="handlePageChange"
|
|
|
- />
|
|
|
- </el-row>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="支出">
|
|
|
+ <el-table-column label="支付货款" prop="payForGoods" width="120" />
|
|
|
+ <el-table-column label="其他支出" prop="otherExpenses" width="120" />
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="统计">
|
|
|
+ <el-table-column label="收入合计" prop="totalIncome" width="120" />
|
|
|
+ <el-table-column label="支出合计" prop="totalExpenses" width="120" />
|
|
|
+ <el-table-column label="毛利" prop="grossGrofit" width="120" />
|
|
|
+ <el-table-column label="毛利率" prop="grossRofitMargin" width="120">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <div style="width: 100%">{{ row.grossRofitMargin }}%</div>
|
|
|
+ </template></el-table-column
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="提成">
|
|
|
+ <el-table-column label="售后" prop="afterSalesAmount" width="120" />
|
|
|
+ <el-table-column label="公共" prop="publicAmount" width="120" />
|
|
|
+ <el-table-column label="总办" prop="haveOverallAmount" width="120" />
|
|
|
+ <el-table-column
|
|
|
+ label="部门提成"
|
|
|
+ prop="departmentalCommission"
|
|
|
+ width="120"
|
|
|
+ />
|
|
|
+ <el-table-column
|
|
|
+ label="个人提成"
|
|
|
+ prop="personalCommission"
|
|
|
+ width="120"
|
|
|
+ />
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" align="center" width="100" fixed="right">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <div>
|
|
|
+ <el-button type="primary" @click="changeExchangeRate(row)" link
|
|
|
+ >调整</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
</div>
|
|
|
+ <el-row style="padding: 20px; background: #fff" justify="end" type="flex">
|
|
|
+ <el-pagination
|
|
|
+ background
|
|
|
+ layout="total, sizes, prev, pager, next, jumper"
|
|
|
+ :current-page="sourceList.pagination.pageNum"
|
|
|
+ :page-size="sourceList.pagination.pageSize"
|
|
|
+ :total="sourceList.pagination.total"
|
|
|
+ @size-change="handleSizeChange"
|
|
|
+ @current-change="handlePageChange"
|
|
|
+ />
|
|
|
+ </el-row>
|
|
|
|
|
|
<el-dialog title="调整" v-if="openChange" v-model="openChange" width="700">
|
|
|
<byForm
|
|
|
@@ -669,4 +689,112 @@ const openDetails = (row) => {
|
|
|
::v-deep(.el-input-number .el-input__inner) {
|
|
|
text-align: left;
|
|
|
}
|
|
|
+
|
|
|
+.by-search {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ .more-icon {
|
|
|
+ float: right;
|
|
|
+ cursor: pointer;
|
|
|
+ line-height: 32px;
|
|
|
+ text-align: center;
|
|
|
+ margin-left: 5px;
|
|
|
+ }
|
|
|
+}
|
|
|
+#ul-box {
|
|
|
+ padding: 0;
|
|
|
+ overflow: hidden;
|
|
|
+ margin: 0;
|
|
|
+ li {
|
|
|
+ list-style: none;
|
|
|
+ min-width: 285px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ margin: 0 20px 20px 0;
|
|
|
+ background: #eff6ff;
|
|
|
+ float: left;
|
|
|
+ overflow: hidden;
|
|
|
+ padding: 20px;
|
|
|
+ color: #333333;
|
|
|
+ border-radius: 10px;
|
|
|
+ .label {
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+ .label::before {
|
|
|
+ width: 10px;
|
|
|
+ height: 10px;
|
|
|
+ content: "";
|
|
|
+ border-radius: 50%;
|
|
|
+ background: #0084ff;
|
|
|
+ display: inline-block;
|
|
|
+ margin-right: 10px;
|
|
|
+ }
|
|
|
+ .num {
|
|
|
+ margin-top: 10px;
|
|
|
+ font-size: 24px;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ //#F5F3FF #9E64ED
|
|
|
+ .theme2 {
|
|
|
+ background: #f5f3ff;
|
|
|
+ .label::before {
|
|
|
+ background: #9e64ed;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ //#FFF1E1 #FF9315
|
|
|
+ .theme3 {
|
|
|
+ background: #fff1e1;
|
|
|
+ .label::before {
|
|
|
+ background: #ff9315;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ //#E2FBE8 #39C55A
|
|
|
+ .theme4 {
|
|
|
+ background: #e2fbe8;
|
|
|
+ .label::before {
|
|
|
+ background: #39c55a;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .theme5 {
|
|
|
+ background: #ffebe9;
|
|
|
+ .label::before {
|
|
|
+ background: #f94539;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .theme6 {
|
|
|
+ background: #e4f9f9;
|
|
|
+ .label::before {
|
|
|
+ background: #53cbcb;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .multi-data {
|
|
|
+ .label::before {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .label {
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #333;
|
|
|
+ margin-bottom: 8px;
|
|
|
+ }
|
|
|
+ .num-warp {
|
|
|
+ overflow: hidden;
|
|
|
+ .num-box {
|
|
|
+ float: left;
|
|
|
+ min-width: 80px;
|
|
|
+ margin-right: 20px;
|
|
|
+ .num-small {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+ margin-bottom: 8px;
|
|
|
+ }
|
|
|
+ .label-small {
|
|
|
+ color: #666;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
cz