334 lines
10 KiB
Vue
334 lines
10 KiB
Vue
<template>
|
||
<page-layout :desc="desc">
|
||
<div class="page-body">
|
||
|
||
<vxe-form :data="formOptions.data" ref="xForm" :title-width="formOptions.titleWidth"
|
||
:title-align="formOptions.titleAlign" :rules="formOptions.rules" :items="formOptions.items" titleColon>
|
||
<!-- =========================== 自定义区域 Start ======================= -->
|
||
|
||
<!-- =========================== 自定义区域 End ======================= -->
|
||
</vxe-form>
|
||
|
||
<div class="mk-toolbar" v-if="isEdit">
|
||
|
||
</div>
|
||
|
||
<div class="footerbar">
|
||
<a-button type="primary" @click="ok">确定</a-button>
|
||
<a-button @click="cancel">取消</a-button>
|
||
</div>
|
||
|
||
</div>
|
||
</page-layout>
|
||
</template>
|
||
|
||
<script>
|
||
import BASE_URL from '@/services/Middle/transport/DriverWages/api.js';
|
||
import PageLayout from '@/layouts/PageLayout'
|
||
|
||
|
||
export default {
|
||
|
||
name: 'DriverWagesGiornaleLogUpdate',
|
||
i18n: require('./i18n'),
|
||
components: {PageLayout},
|
||
props: {
|
||
pageMode: {
|
||
type: String,
|
||
default: "edit"
|
||
},
|
||
dataId: {}
|
||
|
||
},
|
||
|
||
data() {
|
||
|
||
// 页面数据变量
|
||
var pageData = {
|
||
// 当前项目名称
|
||
currentConfigName: "",
|
||
// 当前项目ID
|
||
currentBeid: 0,
|
||
|
||
uploadDefaultImg: null,
|
||
detailDataFieldName: "driver_wages",
|
||
|
||
actions: {
|
||
// =============================== 接口地址 自动生成 Start ===============================
|
||
LogList: `${BASE_URL.BASE_URL}/DriverWages/v1/log/list`, // 操作日志列表
|
||
LogDetail: `${BASE_URL.BASE_URL}/DriverWages/v1/log/detail`, // 操作日志详情
|
||
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`, // 批量处理司机工资结余日志
|
||
|
||
// =============================== 接口地址 自动生成 End ===============================
|
||
},
|
||
|
||
keyName: 'id',
|
||
// 是否编辑模式
|
||
isEdit: false,
|
||
// 表单数据
|
||
formOptions: {
|
||
data: {
|
||
// =============================== 表单数据 自动生成 Start ===============================
|
||
|
||
id: 0,
|
||
code: "",
|
||
staff_uid: 0,
|
||
balance_type: "",
|
||
balance_amount: 0,
|
||
total_balance: 0,
|
||
remark: "",
|
||
create_uid: 0,
|
||
update_uid: 0,
|
||
create_time: new Date(2100, 1, 1).getTime() / 10000,
|
||
update_time: new Date(2100, 1, 1).getTime() / 10000,
|
||
|
||
// =============================== 表单数据 自动生成 End ===============================
|
||
},
|
||
// 标题宽度
|
||
titleWidth: 100,
|
||
// 标题对齐方式
|
||
titleAlign: 'right',
|
||
|
||
// 表单校验规则
|
||
rules: {
|
||
// =============================== 表单校验 自动生成 Start ===============================
|
||
|
||
code: [
|
||
{message: '请输入编码'}
|
||
],
|
||
staff_uid: [
|
||
{message: '请输入员工uid'}
|
||
],
|
||
balance_type: [
|
||
{message: '请输入结余类型:1增加，2减少'}
|
||
],
|
||
balance_amount: [
|
||
{message: '请输入修改金额'}
|
||
],
|
||
total_balance: [
|
||
{message: '请输入总结余金额'}
|
||
],
|
||
remark: [
|
||
{message: '请输入备注'}
|
||
],
|
||
|
||
// =============================== 表单校验 自动生成 End ===============================
|
||
},
|
||
// 表单项
|
||
items: [
|
||
// =============================== 表单项 自动生成 Start ===============================
|
||
|
||
{field: 'code', title: '编码', span: 12, itemRender: {name: '$input'}},
|
||
{field: 'staff_uid', title: '员工uid', span: 12, itemRender: {name: '$input'}},
|
||
{field: 'balance_type', title: '结余类型:1增加，2减少', span: 12, itemRender: {name: '$input'}},
|
||
{field: 'balance_amount', title: '修改金额', span: 12, itemRender: {name: '$input'}},
|
||
{field: 'total_balance', title: '总结余金额', span: 12, itemRender: {name: '$input'}},
|
||
{field: 'remark', title: '备注', span: 12, itemRender: {name: '$input'}},
|
||
|
||
// =============================== 表单项 自动生成 End ===============================
|
||
]
|
||
},
|
||
// 新增模式表单项
|
||
addModeItems: [],
|
||
|
||
|
||
};
|
||
|
||
pageData.actions.get = pageData.actions.DriverWagesDetail;
|
||
pageData.actions.create = pageData.actions.DriverWagesCreate;
|
||
pageData.actions.update = pageData.actions.DriverWagesUpdate;
|
||
|
||
// 合并表单数据及配置
|
||
pageData.formOptions = Object.assign({}, this.$mk.config.defaults.formOptions, pageData.formOptions);
|
||
|
||
return pageData;
|
||
},
|
||
|
||
computed: {
|
||
// desc() {
|
||
// return this.$t('editPageDesc')
|
||
// }
|
||
},
|
||
|
||
|
||
created() {
|
||
|
||
|
||
// 获取路由的id参数
|
||
let dataId = this.getDataId();
|
||
|
||
// 如果有id参数，说明是编辑模式
|
||
if (dataId) {
|
||
const json = `{"id":${dataId}}`;
|
||
this.$mk.post({
|
||
url: this.actions.get,
|
||
loading: "加载中...",
|
||
data: json,
|
||
config: {
|
||
headers: {
|
||
'Content-Type': 'application/json'
|
||
}
|
||
}
|
||
}).then(a => {
|
||
// =============================== 时间字段判断 自动生成 Start ===============================
|
||
|
||
if (a.data[this.detailDataFieldName].create_time) {
|
||
a.data[this.detailDataFieldName].create_time = new Date(a.data[this.detailDataFieldName].create_time * 1000);
|
||
}
|
||
if (a.data[this.detailDataFieldName].update_time) {
|
||
a.data[this.detailDataFieldName].update_time = new Date(a.data[this.detailDataFieldName].update_time * 1000);
|
||
}
|
||
|
||
// =============================== 时间字段判断 自动生成 End ===============================
|
||
this.formOptions.data = a.data[this.detailDataFieldName];
|
||
}).catch((a) => {
|
||
this.$mk.error(a.data.msg);
|
||
});
|
||
|
||
this.isEdit = true;
|
||
} else {
|
||
// 如果没有id参数，说明是新增模式
|
||
if(this.addModeItems){
|
||
this.addModeItems.forEach(item => {
|
||
this.pageOptions.formOptions.items.push(item);
|
||
})
|
||
}
|
||
|
||
}
|
||
|
||
},
|
||
// 函数
|
||
methods: {
|
||
|
||
|
||
// 获取路由的id参数
|
||
getDataId() {
|
||
let dataId = this.dataId;
|
||
if (this.$route.params.id) {
|
||
dataId = this.$route.params.id;
|
||
}
|
||
if (!dataId) {
|
||
dataId = 0;
|
||
}
|
||
return dataId;
|
||
},
|
||
|
||
|
||
// 返回
|
||
back() {
|
||
// 如果是新增模式，关闭当前页面
|
||
if (!this.isEdit) {
|
||
this.$closePage({
|
||
closeRoute: "/DriverWages/DriverWagesGiornaleLogCreate"
|
||
});
|
||
} else {
|
||
// 如果是编辑模式，关闭当前页面
|
||
this.$closePage({
|
||
closeRoute: "/DriverWages/DriverWagesGiornaleLogUpdate"
|
||
});
|
||
}
|
||
// 打开列表页面
|
||
this.$openPage('/DriverWages/DriverWagesGiornaleLogList')
|
||
},
|
||
|
||
// 保存
|
||
ok() {
|
||
|
||
let save = () => {
|
||
|
||
|
||
// 如果是新增模式，提交新增接口 如果是编辑模式，提交编辑接口
|
||
let action = !this.isEdit ? this.actions.create : this.actions.update;
|
||
// 如果是新增模式，提交的数据中加入id 如果是编辑模式，提交的数据中不加入id
|
||
let postdata = Object.assign({}, this.formOptions.data);
|
||
// 如果是编辑模式
|
||
if (this.isEdit) {
|
||
// postdata = { DriverWagesGiornaleLog: postdata }
|
||
}
|
||
// 格式化提交的数据
|
||
this.$mk.formatFormData({data: postdata, rules: this.formOptions.items});
|
||
|
||
|
||
// 提交数据
|
||
this.$mk.post({
|
||
url: action,
|
||
loading: "保存中...",
|
||
data: postdata,
|
||
useBigInt: true,
|
||
}).then(() => { // 成功回调
|
||
this.$mk.success("保存成功");
|
||
if (!this.isEdit) { // 如果是新增模式，关闭当前页面
|
||
this.back();
|
||
this.$forceUpdate()
|
||
}
|
||
}).catch((a) => { // 失败回调
|
||
this.$mk.error(a.data.msg); // 显示错误信息
|
||
});
|
||
|
||
|
||
};
|
||
|
||
|
||
// 验证表单
|
||
this.$mk.validateForm({form: this.$refs.xForm}).then(() => { // 验证表单
|
||
save(); // 提交保存
|
||
}).catch(count => { // 验证失败
|
||
this.$mk.error(`存在${count}项错误，请检查`);
|
||
});
|
||
|
||
|
||
},
|
||
|
||
|
||
// 取消 返回
|
||
cancel() {
|
||
this.back();
|
||
}
|
||
},
|
||
// 监听属性
|
||
watch: {}
|
||
};
|
||
|
||
</script>
|
||
|
||
|
||
<style scoped lang="less">
|
||
.page-body {
|
||
padding: 30px;
|
||
background: @base-bg-color;
|
||
}
|
||
|
||
.formtabs .ant-tabs-tabpane {
|
||
/* background: white; */
|
||
padding: 12px;
|
||
}
|
||
|
||
.gridPanel {
|
||
height: calc(100vh - 600px);
|
||
}
|
||
|
||
.footerbar {
|
||
padding-left: 10px;
|
||
}
|
||
|
||
.imagePanel {
|
||
cursor: pointer;
|
||
padding: 10px;
|
||
width: 100px;
|
||
|
||
img {
|
||
width: 80px;
|
||
height: 80px;
|
||
}
|
||
}
|
||
</style>
|