emis-frontend/src/views/emis/emisCreditSalesmen/index.vue
2025-08-21 17:46:47 +08:00

476 lines
17 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<XdPageContainer class="app-container">
<div slot="pageHeader" class="tab-container">
<SearchForm :model="queryParams" ref="queryForm" size="small" :maxShow="20" label-width="100px" v-show="showSearch" @search="handleQuery" @reset="resetQuery">
<el-form-item :label="$t('员工姓名')" prop="salesmen">
<EmpNamePicker1 :placeholder="$t('员工姓名')" v-model="queryParams.salesmen" ></EmpNamePicker1>
</el-form-item>
<el-form-item label="运输方式" prop="transType">
<el-select v-model="queryParams.transType" placeholder="运输方式" clearable filterable>
<el-option
v-for="item in dict.type.emis_biz_shipping_method"
v-bind:key="item.value"
v-bind:label="item.label"
v-bind:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="剩余余额" prop="curMoney">
<NumberRangePicker style="width:200px" v-model="queryParams.params.curMoneyRange"> </NumberRangePicker>
</el-form-item>
<el-form-item label="启用状态" prop="blOpen">
<el-select v-model="queryParams.blOpen" filterable placeholder="启用状态" @change="handleQuery">
<el-option key="1" label="启用" :value="1" />
<el-option key="0" label="停用" :value="0" />
</el-select>
</el-form-item>
<el-form-item label="剩余比率(%)" prop="curMoneyRate">
<NumberRangePicker style="width:200px" v-model="queryParams.params.curMoneyRateRange"> </NumberRangePicker>
</el-form-item>
</SearchForm>
</div>
<XdTable v-loading="loading"
slot="pageContent"
slot-scope="slotProps"
:height="(slotProps.contentHeight)+'px'"
ref="refTable"
storageName="emisCreditSalesmenList_main_250820"
border stripe
size="small"
:data="emisCreditSalesmenList"
:showSearch.sync="showSearch"
:queryParams="queryParams"
:total="total"
@queryTable="getList"
@selection-change="handleSelectionChange"
@sort-change="handleSortChange"
>
<div slot="toolbar">
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['emis:emisCreditSalesmen:add']"
>新增额度</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
plain
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['emis:emisCreditSalesmen:edit']"
>修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['emis:emisCreditSalesmen:remove']"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['emis:emisCreditSalesmen:export']"
>导出</el-button>
</el-col>
</el-row>
</div>
<el-table-column type="selection" width="55" align="center" />
<el-table-column :label="$t('额度编号')" align="center" prop="accCode" min-width="150" />
<el-table-column :label="$t('员工姓名')" align="center" prop="salesmen" min-width="120" :sortable="true"/>
<el-table-column :label="$t('固定额度')" align="center" prop="creditMoney" min-width="120" :sortable="true" />
<el-table-column :label="$t('临时额度')" align="center" prop="tempCreditMoney" min-width="120" :sortable="true" />
<el-table-column :label="$t('剩余额度')" align="center" prop="curMoney" min-width="120" :sortable="true">
<template slot-scope="scope">
{{ (scope.row.tempCreditMoney - scope.row.useMoney + scope.row.satisfyMoney).toFixed(2) }}
</template>
</el-table-column>
<el-table-column :label="$t('总已用额度')" align="center" prop="useMoney" min-width="120" :sortable="true">
<template slot-scope="scope">
<div class="link-type" @click="handleShowBillList(scope.row,null)">{{ scope.row.useMoney }}</div>
</template>
</el-table-column>
<el-table-column :label="$t('账期内已用')" align="center" prop="inTermMoney" min-width="120" :sortable="true">
<template slot-scope="scope">
<div class="link-type" @click="handleShowBillList(scope.row,2)">{{ scope.row.inTermMoney }}</div>
</template>
</el-table-column>
<el-table-column :label="$t('超期已用')" align="center" prop="overTermMoney" min-width="120" :sortable="true">
<template slot-scope="scope">
<div class="link-type" @click="handleShowBillList(scope.row,1)">{{ scope.row.overTermMoney }}</div>
</template>
</el-table-column>
<el-table-column :label="$t('理赔金额')" align="center" prop="satisfyMoney" min-width="80" >
<template slot-scope="scope">
<div class="link-type" @click="handleShowSatisfyMoneyList(scope.row,null)">{{ scope.row.satisfyMoney }}</div>
</template>
</el-table-column>
<el-table-column :label="$t('剩余比例(%)')" align="center" prop="curMoneyRate" min-width="130" :sortable="true">
<template slot-scope="scope">
{{ ( ((scope.row.tempCreditMoney - scope.row.useMoney)/(scope.row.tempCreditMoney))*100 ).toFixed(2) }}%
</template>
</el-table-column>
<el-table-column :label="$t('运输方式')" align="center" prop="transType" min-width="200" :show-overflow-tooltip="true">
<template slot-scope="scope">
<dict-tag :options="dict.type.emis_biz_shipping_method" :value="scope.row.transType"/>
</template>
</el-table-column>
<el-table-column :label="$t('开始日期')" align="center" prop="startDate" min-width="170" sortable/>
<el-table-column :label="$t('结束日期')" align="center" prop="endDate" min-width="170" sortable/>
<el-table-column :label="$t('备注')" align="center" prop="remark" min-width="100" />
<el-table-column label="创建人" align="center" prop="createByName" width="80" :show-overflow-tooltip="true"/>
<el-table-column label="创建网点" align="center" prop="createSiteName" width="80" :show-overflow-tooltip="true"/>
<el-table-column label="创建时间" align="center" prop="createTime" width="170"/>
<el-table-column label="修改人" align="center" prop="updateByName" width="80" :show-overflow-tooltip="true"/>
<el-table-column label="修改网点" align="center" prop="updateSiteName" width="80" :show-overflow-tooltip="true"/>
<el-table-column label="修改时间" align="center" prop="updateTime" width="170" sortable/>
</XdTable>
<el-dialog :title="titleForm" :visible.sync="openForm" width="50%" :destroy-on-close="true" v-dialogDrag append-to-body>
<emisCreditSalesmenForm :id="currentId" @on-changed="handleFormChanged" @on-cancel="cancelForm"></EmisCreditSalesmenForm>
</el-dialog>
<!--
<el-dialog :title="titleView" :visible.sync="openView" width="60%" :close-on-click-modal="false" v-dialogDrag append-to-body>
<emisCreditSalesmenView :id="id" ></EmisCreditSalesmenView>
</el-dialog>
-->
</XdPageContainer>
</template>
<script>
import { listEmisCreditSalesmen, getEmisCreditSalesmen, delEmisCreditSalesmen, addEmisCreditSalesmen, updateEmisCreditSalesmen } from "@/api/emis/emisCreditSalesmen";
import elDateSimplePicker from '@/components/DatePickerAdv/elDateSimplePicker';
// import emisCreditSalesmenView from '@/views/emis/emisCreditSalesmen/emisCreditSalesmenView';
import emisCreditSalesmenForm from '@/views/emis/emisCreditSalesmen/emisCreditSalesmenForm';
import NumberRangePicker from '@/components/NumberRange/NumberRangePicker';
import { formatSearchStr,deepClone } from '@/utils/index'
import EmpNamePicker1 from '@/views/emis/EmisBaseTools/EmpNamePicker.vue';
export default {
name: "EmisCreditSalesmen",
components: { elDateSimplePicker,emisCreditSalesmenForm,EmpNamePicker1,NumberRangePicker },
dicts: ['emis_biz_shipping_method'],
data() {
return {
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 创建时间搜索
dateTimeRange:[],
// 总条数
total: 0,
// 销售信用额度表格数据
emisCreditSalesmenList: [],
currentId:null,
openForm: false,
titleForm: "",
// 弹出展示层
id:null,
titleView:"",
openView: false,
selectionList:null,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 20,
salesmen: null,
curMoney: null,
curMoneyRate: null,
creditMoney: null,
currency: null,
transType: null,
startDate: null,
endDate: null,
blOpen: null,
blLock: null,
remark: null,
delFlag: null,
params:{
curMoneyRange:null,
curMoneyRateRange:null,
}
},
};
},
created() {
this.getList();
},
methods: {
getProperty(obj, str) {
str = str.replace(/\[(\w+)\]/g, ".$1"); // 处理数组下标
let arr = str.split(".");
for (let i in arr) {
obj = obj[arr[i]] || "";
}
return obj;
},
sortFun: function (attr, rev) {
//第一个参数传入info里的prop表示排的是哪一列,第二个参数是升还是降排序
if (rev == undefined||rev==null) {
rev = 1;
} else {
rev = (rev) ? 1 : -1;
}
let that=this;
return function (a, b) {
a = that.getProperty(a,attr);
b = that.getProperty(b,attr);
if (a < b) {
return rev * -1;
}
if (a > b) {
return rev * 1;
}
return 0;
}
},
// 排序 查询字段是表格中字段名字 动态取值排序顺序
handleSortChange(column) {
this.emisCreditSalesmenList = this.emisCreditSalesmenList.sort(
this.sortFun(column.prop, column.order === 'ascending')
);
},
/** 查询销售信用额度列表 */
getList() {
this.loading = true;
let qParam = {...this.queryParams}
if(qParam.params.curMoneyRange&&qParam.params.curMoneyRange.length>0){
qParam=this.addDateRange(qParam, qParam.params.curMoneyRange,'CurMoney')
}
if(qParam.params.curMoneyRateRange&&qParam.params.curMoneyRateRange.length>0){
qParam=this.addDateRange(qParam, qParam.params.curMoneyRateRange,'CurMoneyRate')
}
listEmisCreditSalesmen(qParam).then(response => {
this.emisCreditSalesmenList = response.rows;
this.total = response.total;
this.loading = false;
});
},
handleShowBillList(row,queryQuotaType){
let item0=row;
this.$router.push(
{
path: '/d24/customerManagement/CreditSendWaybillList',
query: {
action: "queryByCredit",
payee: item0.salesmen,
startDate: item0.startDate,
endDate: item0.endDate,
transType: item0.transType,
queryQuotaType:queryQuotaType,
'_t':(new Date()).getTime()
}
}
);
},
//理赔金额明细列表
handleShowSatisfyMoneyList(row,queryQuotaType){
console.log('handleShowStatisfy')
let item0=row;
this.$router.push(
{
path: '/d24/customerManagement/SatisfyMoneySendWaybillList',
query: {
action: "queryByCredit",
payee: item0.salesmen,
startDate: item0.startDate,
endDate: item0.endDate,
transType: item0.transType,
queryQuotaType:queryQuotaType,
'_t':(new Date()).getTime()
}
}
);
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length!==1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd(row) {
this.currentId=null;
this.openForm= true;
this.titleForm = "新增";
},
handleShowMoreInput(){
this.moreInputVisible = !this.moreInputVisible;
},
/** 修改按钮操作 */
handleUpdate(row) {
this.currentId= row.id||this.ids[0];
this.openForm = true;
this.titleForm = "修改";
},
handleView(row) {
this.id=row.id;
this.titleView="查看";
this.openView=true;
// this.router.push({ path: '/emis/emisCreditSalesmen/viewDetail', query: { id: row.id }})
},
handleFormChanged(){
this.openForm = false;
this.getList();
},
cancelForm(){
this.openForm = false;
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids;
this.$modal.confirm('是否确认删除').then(function() {
return delEmisCreditSalesmen(ids);
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => {});
},
/** 导出按钮操作 */
/** 导出按钮操作 */
handleExport() {
const loadingInstance = this.$loading({
text: '正在导出...'
})
if(this.selectionList&&this.selectionList.length>0){
this.exportData(this.selectionList,loadingInstance);
}
else{
let qParam = {...this.queryParams}
if(qParam.params.curMoneyRange&&qParam.params.curMoneyRange.length>0){
qParam=this.addDateRange(qParam, qParam.params.curMoneyRange,'CurMoney')
}
if(qParam.params.curMoneyRateRange&&qParam.params.curMoneyRateRange.length>0){
qParam=this.addDateRange(qParam, qParam.params.curMoneyRateRange,'CurMoneyRate')
}
qParam.pageNum=1;
qParam.pageSize=20000;
listEmisCreditSalesmen(qParam).then(response => {
if (response.code === 200) {
this.exportData(response.rows,loadingInstance);
}
});
}
},
exportData(selData,loadingInstance){
const curList =selData
import('@/vendor/Export2Excel').then(excel => {
const exportParam=this.$refs.refTable.getExportParam();
const tHeader = exportParam.header;
const filterVal = exportParam.filter;
const data = this.formatJson(filterVal, curList, selData)
excel.export_json_to_excel({
header: tHeader,
data,
filename: '月结客户额度列表',
autoWidth: true
})
loadingInstance.close()
})
},
formatJson(filterVal, jsonData, resData) {
let index = 0
return jsonData.map(v => filterVal.map(j => {
if (j === 'index') {
return ++index
}
if (j === 'curMoney') {
return (v['creditMoney'] - v['useMoney']).toFixed(2);
}
if (j === 'curMoneyRate') {
return (((v['creditMoney'] - v['useMoney'])/v['creditMoney'])*100 ).toFixed(2);
}
if (j === 'transType') {
return this.selectDictLabels(this.dict.type.emis_biz_shipping_method,v[j]);
}
return v[j]
}))
},
/** 列索引函数 */
getIndex($index) {
return (this.queryParams.pageNum - 1) * this.queryParams.pageSize + $index + 1
},
/** 时间搜索响应函数 */
dateTimeChange(value){
this.dateTimeRange=value;
},
}
};
</script>
<style scoped>
.el-divider{
margin-top: 0px;
background: 0 0;
border-top: 1px solid #E6EBF5;
}
.el-divider__text {
color: #0955ee;
cursor: pointer;
}
</style>