366 lines
11 KiB
Vue
366 lines
11 KiB
Vue
<template>
|
||
<div class="detail">
|
||
|
||
<!-- <div class="header">-->
|
||
<!-- <h1>详情</h1>-->
|
||
<!-- </div>-->
|
||
<a-descriptions size="small" :title="pageOptions.title" bordered>
|
||
<a-descriptions-item label="员工姓名">
|
||
|
||
{{ staff_detail.name }}
|
||
</a-descriptions-item>
|
||
<a-descriptions-item label="员工工号">
|
||
{{ staff_detail.code }}
|
||
</a-descriptions-item>
|
||
<a-descriptions-item label="员工电话">
|
||
{{ staff_detail.phone }}
|
||
</a-descriptions-item>
|
||
<a-descriptions-item label="运输总公里数">
|
||
{{ data.transport_mileage }}
|
||
</a-descriptions-item>
|
||
<a-descriptions-item label="本月份总公里数">
|
||
{{ data.month_mileage }}
|
||
</a-descriptions-item>
|
||
<a-descriptions-item label="工资结余">
|
||
{{ data.wages_balance }} 元
|
||
</a-descriptions-item>
|
||
</a-descriptions>
|
||
<div class="amount">
|
||
<h2>
|
||
修改结余
|
||
</h2>
|
||
<li>
|
||
<span>操作金额：</span>
|
||
<a-input id="inputNumber" style="width: 200px;margin-right: 10px;" prefix="￥" suffix="RMB" v-model="amount"
|
||
:min="1" :max="1000000000" placeholder="请输入要操作的金额" />
|
||
</li>
|
||
<li>
|
||
<span>操作备注：</span>
|
||
<a-textarea v-model="remark" placeholder="请输入要操作的备注" :auto-size="{ minRows: 3, maxRows: 5 }"
|
||
style="width: 200px;margin-right: 10px;" />
|
||
</li>
|
||
<li>
|
||
|
||
<div class="btns" style="z-index:99999;">
|
||
<!-- 增加结余按钮 -->
|
||
<a-popconfirm title="是否增加结余？" ok-text="确认" cancel-text="取消" @confirm="addBalance" @cancel="cancel"
|
||
autoAdjustOverflow="true"
|
||
>
|
||
<a-button class="btn-add-balance" type="primary">增加结余</a-button>
|
||
</a-popconfirm>
|
||
<!-- 减少结余按钮 -->
|
||
<a-popconfirm title="是否减少结余？" ok-text="确认" cancel-text="取消" @confirm="reduceBalance" @cancel="cancel"
|
||
|
||
autoAdjustOverflow="true"
|
||
>
|
||
<a-button class="btn-reduce-balance" type="danger"> 减少结余</a-button>
|
||
</a-popconfirm>
|
||
|
||
</div>
|
||
</li>
|
||
</div>
|
||
|
||
<!-- 结余日志列表 -->
|
||
<div class="balance-log">
|
||
<h2>
|
||
结余日志
|
||
</h2>
|
||
|
||
<ZkTableList ref="ZkTableList" :ListUrl="this.DriverWagesGiornaleLogSearch" :ListUrlData="this.zkSelectData"
|
||
:Columns="this.columns" :ListFieldName="this.zkSelectDataFieldName" :dataId="dataId">
|
||
</ZkTableList>
|
||
|
||
</div>
|
||
|
||
</div>
|
||
</template>
|
||
<script>
|
||
import BASE_URL from '@/services/Middle/transport/DriverWages/api.js';
|
||
import ZkTableList from './zkTableList.vue'
|
||
// import ZkTable from "@/components/zk/zkTable.vue";
|
||
|
||
export default {
|
||
components: {
|
||
ZkTableList
|
||
},
|
||
props: {
|
||
dataId: {
|
||
},
|
||
pageOptions: {
|
||
type: Object
|
||
},
|
||
ApiUrl: {
|
||
type: String
|
||
},
|
||
ApiData: {
|
||
type: Object
|
||
},
|
||
|
||
},
|
||
data() {
|
||
return {
|
||
|
||
DriverWagesSurplusAdd: `${BASE_URL.BASE_URL}/DriverWages/v1/driver/wages/surplus/add`, // 增加司机结余
|
||
DriverWagesSurplusReduce: `${BASE_URL.BASE_URL}/DriverWages/v1/driver/wages/surplus/reduce`, // 减少司机结余 DriverWagesSurplusLogList: `${BASE_URL.BASE_URL}/Custom/v1/balance/log/list`, // 客户结余日志列表
|
||
DriverWagesGiornaleLogList: `${BASE_URL.BASE_URL}/DriverWages/v1/driver/wages/giornale/log/list`, // 司机工资结余日志列表
|
||
DriverWagesGiornaleLogSearch: `${BASE_URL.BASE_URL}/DriverWages/v1/driver/wages/giornale/log/search`, // 司机工资结余日志搜索
|
||
DriverWagesGiornaleLogDetail: `${BASE_URL.BASE_URL}/DriverWages/v1/driver/wages/giornale/log/detail`, // 司机工资结余日志详情
|
||
DriverWagesGiornaleLogCreate: `${BASE_URL.BASE_URL}/DriverWages/v1/driver/wages/giornale/log/create`, // 创建司机工资结余日志
|
||
DriverWagesGiornaleLogUpdate: `${BASE_URL.BASE_URL}/DriverWages/v1/driver/wages/giornale/log/update`, // 更新司机工资结余日志
|
||
DriverWagesGiornaleLogDelete: `${BASE_URL.BASE_URL}/DriverWages/v1/driver/wages/giornale/log/detele`, // 删除司机工资结余日志
|
||
DriverWagesGiornaleLogBatchDelete: `${BASE_URL.BASE_URL}/DriverWages/v1/driver/wages/giornale/log/batchDelete`, // 批量删除司机工资结余日志
|
||
DriverWagesGiornaleLogBatchUpdate: `${BASE_URL.BASE_URL}/DriverWages/v1/driver/wages/giornale/log/batchUpdate`, // 批量更新司机工资结余日志
|
||
DriverWagesGiornaleLogBatchCreate: `${BASE_URL.BASE_URL}/DriverWages/v1/driver/wages/giornale/log/batchCreate`, // 批量创建司机工资结余日志
|
||
DriverWagesGiornaleLogBatchHandle: `${BASE_URL.BASE_URL}/DriverWages/v1/driver/wages/giornale/log/batchHandle`, // 批量处理司机工资结余日志
|
||
zkSelectData: {
|
||
page: 1,
|
||
end_time: 0,
|
||
start_time: 0,
|
||
search_rules: [
|
||
],
|
||
order_bys: [
|
||
],
|
||
limit: 50
|
||
},
|
||
zkSelectDataFieldName: "DriverWagesGiornaleLog",
|
||
// 表格列配置
|
||
columns: [
|
||
|
||
|
||
// =============================== 表格列 自动生成 Start ===============================
|
||
|
||
// { type: 'checkbox', width: 50 }, // 多选框
|
||
{ type: 'seq', width: 30 }, // 序号
|
||
|
||
|
||
// =============================== 表格列 自动生成 Start ===============================
|
||
|
||
|
||
{ field: 'code', sortable: true, title: '编码', width: 120 }, // 编码
|
||
// { field: 'staff_uid', sortable: true, title: '员工uid', width: 250 }, // 员工uid
|
||
{ field: 'truck_name', sortable: true, title: '车辆名称', width: 120 }, // 车辆名称
|
||
{ field: 'truck_number', sortable: true, title: '车牌号', width: 120 }, // 车牌号
|
||
{ field: 'balance_type', sortable: true, title: '结余类型', width: 100 }, // 结余类型:1增加，2减少
|
||
{ field: 'balance_amount', sortable: true, title: '修改金额', width: 120 }, // 修改金额
|
||
{ field: 'total_balance', sortable: true, title: '总结余金额', width: 120 }, // 总结余金额
|
||
{ field: 'remark', sortable: true, title: '备注', width: "auto" }, // 备注
|
||
|
||
{
|
||
field: 'create_time',
|
||
formatter: 'formatDateTime',
|
||
width: 160,
|
||
sortable: true,
|
||
title: '时间',
|
||
showHeaderOverflow: true
|
||
}, // 创建时间
|
||
|
||
|
||
// =============================== 表格列 自动生成 Start ===============================
|
||
|
||
// =============================== 表格列 自动生成 Start ===============================
|
||
|
||
],
|
||
amount: 0,
|
||
remark: "",
|
||
data: {
|
||
|
||
},
|
||
staff_detail: {
|
||
},
|
||
}
|
||
},
|
||
created() {
|
||
this.initDetailData();
|
||
},
|
||
filters: {
|
||
formatDate: function (value) {
|
||
if (value) {
|
||
// 时间戳转日期格式格式化日期时间
|
||
return new Date(value).toLocaleString().replace(/:\d{1,2}$/, ' ');
|
||
} else {
|
||
return "";
|
||
}
|
||
},
|
||
// 格式化状态
|
||
formatStatus: function (value) {
|
||
if (value === 1) {
|
||
return "正常";
|
||
|
||
// return "success";
|
||
} else if (value === 0) {
|
||
return "停用";
|
||
// return "error";
|
||
} else {
|
||
return "未知";
|
||
// return "warning";
|
||
}
|
||
},
|
||
},
|
||
methods: {
|
||
initDetailData() {
|
||
// console.log("this.pageOptions.FieldName:", this.pageOptions.FieldName)
|
||
// console.log("this.pageOptions.ApiUrl:", this.pageOptions.ApiUrl);
|
||
// console.log("this.pageOptions.ApiData:", this.pageOptions.ApiData);
|
||
|
||
// this.dataId 转换为bigint
|
||
// 如果this.dataId是对象，则需要转换为数字
|
||
|
||
this.$zk.post({
|
||
url: this.pageOptions.ApiUrl,
|
||
data: this.pageOptions.ApiData,
|
||
|
||
|
||
loading: "加载中...",
|
||
useBigInt: true,
|
||
config: {
|
||
headers: {
|
||
'Content-Type': 'application/json'
|
||
}
|
||
}
|
||
}).then(a => {
|
||
console.log("a", a)
|
||
console.log("this.pageOptions.ApiUrl", this.pageOptions.ApiUrl)
|
||
this.data = a.data[this.pageOptions.FieldName];
|
||
this.staff_detail = a.data[this.pageOptions.FieldName].staff_detail;
|
||
}).catch((a) => {
|
||
this.$mk.error(a.msg, "aaa");
|
||
});
|
||
},
|
||
addBalance() {
|
||
this.addBalanceApi();
|
||
},
|
||
reduceBalance() {
|
||
this.reduceBalanceApi();
|
||
},
|
||
|
||
addBalanceApi() {
|
||
// 转换 this.amount 为数字
|
||
this.amount = Number(this.amount);
|
||
// 如果不为数字
|
||
if (this.amount === undefined || isNaN(this.amount)) {
|
||
this.$mk.error("请输入正确的金额");
|
||
return
|
||
}
|
||
if (this.amount <= 0) {
|
||
this.$mk.error("请输入正确的金额");
|
||
return
|
||
}
|
||
// 调用增加结余接口
|
||
this.$zk.post({
|
||
url: this.DriverWagesSurplusAdd,
|
||
data: {
|
||
staff_uid: this.staff_detail.id,
|
||
add_balance: this.amount,
|
||
remark: this.remark
|
||
},
|
||
loading: "加载中...",
|
||
useBigInt: true,
|
||
config: {
|
||
headers: {
|
||
'Content-Type': 'application/json'
|
||
}
|
||
}
|
||
}).then(a => {
|
||
console.log("a", a);
|
||
// 成功提示 刷新页面
|
||
this.$mk.success("增加结余成功");
|
||
// 刷新页面
|
||
this.initDetailData() // 刷新
|
||
// 刷新列表
|
||
this.$refs.ZkTableList.refresh()
|
||
}).catch((a) => {
|
||
this.$mk.error(a.msg, "aaa");
|
||
});
|
||
},
|
||
reduceBalanceApi() {
|
||
// 转换 this.amount 为数字
|
||
this.amount = Number(this.amount);
|
||
// 如果不为数字
|
||
if (this.amount === undefined || isNaN(this.amount)) {
|
||
this.$mk.error("请输入正确的金额");
|
||
return
|
||
}
|
||
if (this.amount <= 0) {
|
||
this.$mk.error("请输入正确的金额");
|
||
return
|
||
}
|
||
// 调用减少结余接口
|
||
this.$zk.post({
|
||
url: this.DriverWagesSurplusReduce,
|
||
data: {
|
||
|
||
staff_uid: this.staff_detail.id,
|
||
reduce_balance: this.amount,
|
||
remark: this.remark
|
||
|
||
},
|
||
loading: "加载中...",
|
||
useBigInt: true,
|
||
config: {
|
||
headers: {
|
||
'Content-Type': 'application/json'
|
||
}
|
||
}
|
||
}).then(a => {
|
||
console.log("a", a);
|
||
// 成功提示 刷新页面
|
||
this.$mk.success("减少结余成功");
|
||
// 刷新页面
|
||
this.initDetailData() // 刷新
|
||
// 刷新列表
|
||
this.$refs.ZkTableList.refresh()
|
||
|
||
}).catch((a) => {
|
||
this.$mk.error(a.msg, "aaa");
|
||
});
|
||
|
||
},
|
||
|
||
cancel() {
|
||
console.log('cancel');
|
||
},
|
||
confirm() {
|
||
console.log('confirm');
|
||
}
|
||
},
|
||
|
||
|
||
}
|
||
</script>
|
||
<style scoped lang="less">
|
||
.detail {
|
||
margin: 10px;
|
||
|
||
}
|
||
|
||
.btns {
|
||
|
||
margin-top: 10px;
|
||
|
||
.btn-add-balance {}
|
||
|
||
.btn-reduce-balance {
|
||
margin-left: 10px;
|
||
}
|
||
}
|
||
|
||
.amount {
|
||
margin-top: 20px;
|
||
|
||
li {
|
||
margin-top: 10px;
|
||
list-style: none;
|
||
|
||
span {
|
||
display: inline-block;
|
||
width: 80px;
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
.balance-log {
|
||
margin-top: 20px;
|
||
height: 600px;
|
||
}
|
||
</style> |