emis-frontend/src/views/emis/emisTmsCostFee/EmisTmsCostFeeList.vue
2024-12-05 20:07:40 +08:00

388 lines
16 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">
<SearchForm slot="pageHeader" :model="queryParams" ref="queryForm" size="small" :maxShow="3" label-width="68px" v-show="showSearch" @search="handleQuery" @reset="resetQuery">
<!-- <el-form-item label="" prop="costName">
<el-input
v-model="queryParams.costName"
:placeholder="$t('成本名称')"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item> -->
<el-form-item :label="$t('费用类型')" prop="feeType">
<el-select clearable v-model="queryParams.feeType" placeholder="请选择" style="width:100%">
<el-option
v-for="dict in dict.type.emis_cost_fee_type"
:key="dict.value"
:label="dict.label"
:value="dict.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item :label="$t('分摊类型')" prop="splitType">
<el-select clearable v-model="queryParams.splitType" placeholder="请选择" style="width:100%">
<el-option
v-for="dict in dict.type.emis_cost_split_type"
:key="dict.value"
:label="dict.label"
:value="dict.value"
></el-option>
</el-select>
</el-form-item>
</SearchForm>
<XdTable
slot="pageContent"
slot-scope="slotProps"
:height="(slotProps.contentHeight)+'px'"
v-loading="loading"
border stripe
size="small"
:data="emisTmsCostFeeList"
: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:emisTmsCostFee: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:emisTmsCostFee: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:emisTmsCostFee:remove']"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="primary"
plain
size="mini"
:disabled="multiple"
@click="handleReCalcProfit"
v-hasPermi="['emis:emisTmsCostProfit:edit']"
>利润重算</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:emisTmsCostFee:export']"
>导出</el-button>
</el-col> -->
</el-row>
</div>
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="序号" align="center" prop="index" min-width="60">
<template slot-scope="scope">
<span v-text="getIndex(scope.$index)"> </span>
</template>
</el-table-column>
<!-- <el-table-column :label="$t('成本序号')" align="center" prop="costNo" min-width="100" /> -->
<!-- <el-table-column :label="$t('成本名称')" align="center" prop="costName" min-width="100" /> -->
<el-table-column :label="$t('成本类型')" align="center" prop="feeType" min-width="100" >
<template slot-scope="scope">
<dict-tag :options="dict.type.emis_cost_fee_type" :value="scope.row.feeType"/>
</template>
</el-table-column>
<el-table-column :label="$t('分摊类型')" align="center" prop="splitType" min-width="100" >
<template slot-scope="scope">
<dict-tag :options="dict.type.emis_cost_split_type" :value="scope.row.splitType"/>
</template>
</el-table-column>
<el-table-column :label="$t('成本时间')" align="center" prop="tradeDate" min-width="100" />
<el-table-column :label="$t('总费用')" align="center" prop="costFee" min-width="100" />
<el-table-column :label="$t('运单总票数')" align="center" prop="sendPieceSum" min-width="100" />
<!-- <el-table-column :label="$t('总件数')" align="center" prop="pieceNumber" min-width="100" /> -->
<el-table-column :label="$t('运单总重')" align="center" prop="totalWeight" min-width="100" />
<el-table-column :label="$t('运单总体积')" align="center" prop="totalVolume" min-width="100" />
<el-table-column :label="$t('运输方式')" align="center" prop="transType" min-width="100" >
<template slot-scope="scope">
<dict-tag :options="dict.type.emis_trans_carrier" :value="scope.row.transType"/>
</template>
</el-table-column>
<el-table-column :label="$t('运输单号')" align="center" prop="transSignNo" min-width="100" />
<!-- <el-table-column :label="$t('供应商代码')" align="center" prop="supplierCode" min-width="100" /> -->
<el-table-column :label="$t('供应商名称')" align="center" prop="supplierName" min-width="150" />
<el-table-column :label="$t('发件地')" align="center" prop="sendPlace" min-width="100" />
<el-table-column :label="$t('目的地')" align="center" prop="destPlace" min-width="100" />
<el-table-column :label="$t('毛重(kg)')" align="center" prop="realTotalWeight" min-width="100" />
<el-table-column :label="$t('包裹数')" align="center" prop="realPieceNumber" min-width="100" />
<!-- <el-table-column :label="$t('成本费')" align="center" prop="costFee" min-width="100" /> -->
<!-- <el-table-column :label="$t('总票数')" align="center" prop="sendPieceSum" min-width="100" /> -->
<!-- <el-table-column :label="$t('总件数')" align="center" prop="pieceNumber" min-width="100" /> -->
<!-- <el-table-column :label="$t('总重量')" align="center" prop="totalWeight" min-width="100" /> -->
<!-- <el-table-column :label="$t('总体积')" align="center" prop="totalVolume" min-width="100" /> -->
<el-table-column :label="$t('财务确认状态')" align="center" prop="blConfirmCenter" min-width="120" >
<template slot-scope="scope">
<span v-if="scope.row.blConfirmCenter=='0'" >未确认</span>
<el-tag v-if="scope.row.blConfirmCenter=='1'" type="success">已确认</el-tag>
</template>
</el-table-column>
<el-table-column :label="$t('财务确认人')" align="center" prop="confirmCenterManName" min-width="100" />
<el-table-column :label="$t('财务确认时间')" align="center" prop="confirmCenterDate" min-width="170" />
<el-table-column :label="$t('财务备注')" align="center" prop="confirmCenterNote" min-width="100" />
<!-- <el-table-column :label="$t('财务确认状态')" align="center" prop="blConfirmCenter" min-width="100" />
<el-table-column :label="$t('财务确认日期')" align="center" prop="confirmCenterDate" min-width="100" />
<el-table-column :label="$t('财务确认备注')" align="center" prop="confirmCenterNote" min-width="100" />
<el-table-column :label="$t('财务确认人')" align="center" prop="confirmCenterManCode" min-width="100" />
<el-table-column :label="$t('财务确认站点')" align="center" prop="confirmCenterCode" min-width="100" />
<el-table-column :label="$t('站点确认状态')" align="center" prop="blConfirmSite" min-width="100" />
<el-table-column :label="$t('站点确认日期')" align="center" prop="confirmSiteDate" min-width="100" />
<el-table-column :label="$t('站点确认人')" align="center" prop="confirmSiteManCode" min-width="100" />
<el-table-column :label="$t('网点确认备注')" align="center" prop="confirmSiteNote" min-width="100" />
<el-table-column :label="$t('确认网点代码')" align="center" prop="confirmSiteCode" min-width="100" /> -->
<el-table-column :label="$t('备注')" align="center" prop="remark" min-width="100" />
</XdTable>
<el-dialog :title="titleForm" :visible.sync="openForm" width="70%" :close-on-click-modal="false" :destroy-on-close="true" v-dialogDrag append-to-body>
<EmisTmsCostFeeForm :id="currentId" @on-changed="handleFormChanged" @on-cancel="cancelForm"></EmisTmsCostFeeForm>
</el-dialog>
</XdPageContainer>
</template>
<script>
import { listEmisTmsCostFee, getEmisTmsCostFee, delEmisTmsCostFee, addEmisTmsCostFee, updateEmisTmsCostFee } from "@/api/emis/emisTmsCostFee";
import elDateSimplePicker from '@/components/DatePickerAdv/elDateSimplePicker';
// import emisTmsCostFeeView from '@/views/emis/emisTmsCostFee/emisTmsCostFeeView';
import EmisTmsCostFeeForm from '@/views/emis/emisTmsCostFee/emisTmsCostFeeForm';
export default {
name: "emisTmsCostFee",
components: { elDateSimplePicker,EmisTmsCostFeeForm },
dicts: ['emis_cost_fee_type','emis_cost_split_type','emis_trans_carrier','emis_payment_type'],
data() {
return {
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 创建时间搜索
dateTimeRange:[],
// 总条数
total: 0,
// TMS运输成本账单表格数据
emisTmsCostFeeList: [],
currentId:null,
openForm: false,
titleForm: "",
// 弹出展示层
id:null,
titleView:"",
openView: false,
// 更新站点时间范围
daterangeConfirmCenterDate: [],
// 更新站点时间范围
daterangeConfirmSiteDate: [],
// 更新站点时间范围
daterangeCreateTime: [],
// 更新站点时间范围
daterangeUpdateTime: [],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 20,
costName: null,
feeType: null,
splitType: null,
},
};
},
created() {
this.getList();
},
methods: {
/** 查询TMS运输成本账单列表 */
getList() {
this.loading = true;
listEmisTmsCostFee(this.addDateRange(this.queryParams, this.dateTimeRange)).then(response => {
this.emisTmsCostFeeList = response.rows;
this.total = response.total;
this.loading = false;
});
},
handleReCalcProfit(){
},
/** 搜索按钮操作 */
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
},
// 排序 查询字段是表格中字段名字 动态取值排序顺序
handleSortChange(column) {
this.queryParams.orderByColumn = column.prop;
this.queryParams.isAsc = column.order;
this.getList();
},
/** 新增按钮操作 */
handleAdd(row) {
this.currentId=null;
this.openForm= true;
this.titleForm = "成本费用录入";
},
handleShowMoreInput(){
this.moreInputVisible = !this.moreInputVisible;
},
/** 修改按钮操作 */
handleUpdate(row) {
this.currentId=row.id || this.ids;
this.openForm = true;
this.titleForm = "修改成本";
},
handleView(row) {
this.id=row.id;
this.titleView="查看";
this.openView=true;
// this.router.push({ path: '/emis/emisTmsCostFee/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 delEmisTmsCostFee(ids);
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => {});
},
/** 导出按钮操作 */
handleExport() {
// this.download('emis/emisTmsCostFee/export', {
// ...this.queryParams
// }, `emisTmsCostFee_${new Date().getTime()}.xlsx`)
const loadingInstance = this.$loading({
text: '正在导出...'
})
var qParam = {...this.queryParams};
qParam.pageNum=1;
qParam.pageSize=5000;
listEmisTmsCostFee(this.addDateRange(qParam, this.dateTimeRange)).then(response => {
this.downloadLoading = false
if (response.code === 200) {
const curList = response.rows
import('@/vendor/Export2Excel').then(excel => {
const tHeader = ['id','成本序号','成本名称','成本类型','分摊类型','成本费','总票数','总件数','总重量','总体积','财务确认状态','财务确认日期','财务确认备注','财务确认人','财务确认站点','站点确认状态','站点确认日期','站点确认人','网点确认备注','确认网点代码','备注','删除标志(0代表存在','创建者','创建时间','更新者','更新时间','创建站点','更新站点',];
const filterVal = ['id','costNo','costName','feeType','splitType','costFee','sendPieceSum','pieceNumber','totalWeight','totalVolume','blConfirmCenter','confirmCenterDate','confirmCenterNote','confirmCenterManCode','confirmCenterCode','blConfirmSite','confirmSiteDate','confirmSiteManCode','confirmSiteNote','confirmSiteCode','remark','delFlag','createBy','createTime','updateBy','updateTime','createSite','updateSite',];
const data = this.formatJson(filterVal, curList, response.rows)
excel.export_json_to_excel({
header: tHeader,
data,
filename: 'TMS运输成本账单',
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 === 'status') {
var statusStr='xxx'
if(v[j] == 10){
statusStr='xxx'
}
return statusStr;
}
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>