Skip to content

T
tsndu-web
Commit b2676bd1 by weijiguang
Options

1

parent 389a9cef
Showing with 881 additions and 211 deletions
src/api/invoke_methods.js
......@@ -38,7 +38,7 @@ import {
updateContract,
terminateContract,
returnDeposit,
listPlanning,
listPlanningByContractId,
listDriver,
createDriver,
updateDriver,
......@@ -46,7 +46,13 @@ import {
listFee,
createFee,
disableFee,
enableFee,
enableFee,
searchPlanning,
paying,
delay,
getContract,
getDriver,
getVehicle,
} from "./request_methods";
export default {
......@@ -185,8 +191,17 @@ export default {
asyncReturnDeposit(_, payload) {
return returnDeposit(payload)
},
asyncListPlanning(_, payload) {
return listPlanning(payload)
asyncListPlanningByContractId(_, payload) {
return listPlanningByContractId(payload)
},
asyncSearchPlanning(_, payload) {
return searchPlanning(payload)
},
asyncPaying(_, payload) {
return paying(payload)
},
asyncDelay(_, payload) {
return delay(payload)
},
asyncListDriver(_, payload) {
......@@ -202,6 +217,15 @@ export default {
return updateDriver(payload)
},
asyncGetContract(_, payload) {
return getContract(payload)
},
asyncGetDriver(_, payload) {
return getDriver(payload)
},
asyncGetVehicle(_, payload) {
return getVehicle(payload)
},
},
mutations: {
}
......
src/api/request_methods.js
import axios from "@/libs/axios";
import { stringify } from "qs";
const proxy = process.env.NODE_ENV == 'development' ? "/apis" : "https://smp.sskuaixiu.com/api/order/pub-open/";
if(process.env.NODE_ENV == 'development') {
console.log("dev: " + proxy);
} else {
console.log("env: " + proxy);
}
// if(process.env.NODE_ENV == 'development') {
// console.log("dev: " + proxy);
// } else {
// console.log("env: " + proxy);
// }
// 上传文件
export const uploadFile = params => axios.post(`${proxy}/file/upload`, params, { "Content-Type": "multipart/form-data" });
// 行驶证识别
......@@ -97,7 +97,13 @@ export const terminateContract = data => axios.post(`${proxy}/contract/terminate
// 合同 / 车源合同 返还押金
export const returnDeposit = data => axios.post(`${proxy}/contract/return/deposit`, data);
// 合同 / 费用计划列表
export const listPlanning = data => axios.post(`${proxy}/contract/list/planning/${data.contractId}/${data.type}`);
export const listPlanningByContractId = data => axios.post(`${proxy}/planning/list/${data.contractId}/${data.type}`);
// 应收帐款 / 费用计划列表
export const searchPlanning = data => axios.post(`${proxy}/planning/list/`, data);
// 应收帐款 / 付款
export const paying = data => axios.post(`${proxy}/planning/paying/`, data);
// 应收帐款 / 延期
export const delay = data => axios.post(`${proxy}/planning/delay/`, data);
// 司机 / 列表
export const listDriver = data => axios.post(`${proxy}/driver/list`, data);
......@@ -105,4 +111,11 @@ export const listAllDriver = data => axios.post(`${proxy}/driver/list/all`, data
// 司机 / 创建
export const createDriver = data => axios.post(`${proxy}/driver/create`, data);
// 司机 / 更新
export const updateDriver = data => axios.post(`${proxy}/driver/update`, data);
\ No newline at end of file
export const updateDriver = data => axios.post(`${proxy}/driver/update`, data);
// 合同 / 根据id获取合同信息
export const getContract = data => axios.post(`${proxy}/contract/get/${data}`);
// 司机 / 根据id获取司机信息
export const getDriver = data => axios.post(`${proxy}/driver/get/${data}`);
// 车辆 / 根据id获取车辆信息
export const getVehicle = data => axios.post(`${proxy}/vehicle/get/${data}`);
\ No newline at end of file
src/libs/constants.js
......@@ -21,3 +21,10 @@ export const depositStatusOption = [
{text: "部分已退", value: 1},
{text: "全部已退", value: 2},
];
// 费用计划，付款状态
export const paymentStatusOption = [
{text: "未付", value: 0},
{text: "部分已付", value: 1},
{text: "全部已付", value: 2},
];
src/router/routers.js
......@@ -181,20 +181,12 @@ export default [
component: () => import("@/view/driver_contract/list/index.vue")
},
{
path: '/driver_contract/bill_week',
key: 'driver_contract_bill_week',
path: '/driver_contract/receivables',
key: 'driver_receivables',
icon: 'logo-xbox',
title: '七日内交租',
visable: false,
component: () => import("@/view/vehicle/list/index.vue")
},
{
path: '/driver_contract/bill_month',
key: 'driver_contract_bill_month',
icon: 'logo-xbox',
title: '本月交租',
title: '应收帐款',
visable: false,
component: () => import("@/view/vehicle/list/index.vue")
component: () => import("@/view/driver_contract/receivables/index.vue")
},
]
},
......
src/view/driver/add/index.js
......@@ -195,7 +195,6 @@ export default {
},
saveDriver() {
this.$refs.driverForm.validate(valid => {
console.log("saveDriver:"+valid);
if (valid) {
dispatch("invoke/asyncCreateDriver", this.driverForm).then(({ code }) => {
this.submitLoading = false;
......
src/view/driver/edit/index.js
......@@ -71,7 +71,6 @@ export default {
this.$refs.driverForm.resetFields();
if(show) {
console.log(this.driver);
this.driverForm.id = this.driver.id;
this.driverForm.frontFileId = this.driver.frontFile.id;
this.driverForm.frontFileUrl = this.driver.frontFile.filePath;
......@@ -237,7 +236,6 @@ export default {
},
saveDriver() {
this.$refs.driverForm.validate(valid => {
console.log("saveDriver:"+valid);
if (valid) {
dispatch("invoke/asyncUpdateDriver", this.driverForm).then(({ code }) => {
this.submitLoading = false;
......
src/view/driver/list/index.js
......@@ -56,7 +56,6 @@ export default {
records:[],
};
}
console.log(this.data)
});
},
changePage(current) {
......
src/view/driver_contract/edit/index.js
......@@ -40,7 +40,6 @@ export default {
diffDepositAmount: null,
startDate: null,
endDate: null,
depositAmount: null,
rentAmount: null,
leaseType: null,
remark: null,
......@@ -64,7 +63,6 @@ export default {
this.contractForm.diffDepositAmount = null;
this.contractForm.startDate = null;
this.contractForm.endDate = null;
this.contractForm.depositAmount = null;
this.contractForm.rentAmount = null;
this.contractForm.leaseType = null;
this.contractForm.remark = null;
......@@ -86,7 +84,6 @@ export default {
this.contractForm.startDate = this.contract.startDate;
this.contractForm.endDate = this.contract.endDate;
this.contractForm.leaseType = this.contract.leaseType;
this.contractForm.depositAmount = this.contract.depositAmount;
this.contractForm.returnDepositAmount = this.contract.returnDepositAmount;
this.contractForm.rentAmount = this.contract.rentAmount;
this.contractForm.remark = this.contract.remark;
......@@ -132,7 +129,7 @@ export default {
listRentPlanning() {
this.rentLoading = true;
const requestData = { contractId: this.contract.id, type: 1 };
dispatch("invoke/asyncListPlanning", requestData).then(({ data }) => {
dispatch("invoke/asyncListPlanningByContractId", requestData).then(({ data }) => {
this.rentLoading = false;
this.rentDatas = data;
});
......@@ -140,7 +137,7 @@ export default {
listFeePlanning() {
this.feeLoading = true;
const requestData = { contractId: this.contract.id, type: 2 };
dispatch("invoke/asyncListPlanning", requestData).then(({ data }) => {
dispatch("invoke/asyncListPlanningByContractId", requestData).then(({ data }) => {
this.feeLoading = false;
this.feeDatas = data;
});
......
src/view/driver_contract/edit/index.vue
......@@ -18,7 +18,7 @@
</Row>
<Row>
<Col span="8">
<FormItem label="应付押金" prop="payableDepositAmount">{{ contractForm.payableDepositAmount }}</FormItem>
<FormItem label="应收押金" prop="payableDepositAmount">{{ contractForm.payableDepositAmount }}</FormItem>
</Col>
<Col span="8">
<FormItem label="实收押金" prop="paidDepositAmount">{{ contractForm.paidDepositAmount }}</FormItem>
......
src/view/driver_contract/list/index.vue
......@@ -5,12 +5,12 @@
<Row :gutter="2">
<Col span="4">
<FormItem label="车辆信息" >
<Input v-model="vehicleInfo" placeholder="车牌号" clearable/>
<Input v-model="vehicleInfo" placeholder="车牌号/品牌" clearable/>
</FormItem>
</Col>
<Col span="4">
<FormItem label="司机信息" >
<Input v-model="driverInfo" placeholder="姓名/手机号" clearable/>
<Input v-model="driverInfo" placeholder="姓名/手机号/身份证" clearable/>
</FormItem>
</Col>
<Col span="4">
......
src/view/driver_contract/list/return_deposit/index.js
......@@ -10,8 +10,6 @@ export default {
contract: null,
visible: false,
submitLoading: false,
mainUploadStatus: false,
secondUploadStatus: false,
returnFormRule: {
returnAmount: [{ required: true, message: "请输入返还金额", trigger: "blur" }, { validator: isInteger, trigger: "blur" } ],
},
......
src/view/driver_contract/receivables/delay/index.js 0 → 100644
import store from "@/store";
const { dispatch } = store;
import { isInteger } from "@/libs/validator.js";
import { paymentStatusOption } from "@/libs/constants.js";
export default {
components: { },
data() {
return {
planning: null,
visible: false,
submitLoading: false,
payingFormRule: {
amount: [{ required: true, message: "请输入返还金额", trigger: "blur" }, { validator: isInteger, trigger: "blur" } ],
},
payingForm: {
planningId: 0,
plateNo: null,
paymentStatus: null,
planDate: null,
delayDate: null,
name: null,
payableAmount: null,
paidAmount: null,
diffAmount: null,
amount: null,
remark: null,
},
disabledOption: {
disabledDate (date) {
return date && date.valueOf() < Date.now() - 86400000;
}
},
};
},
computed: {
},
watch: {
visible(show) {
this.submitLoading = false;
this.$refs.payingForm.resetFields();
this.payingForm.planningId = null;
this.payingForm.plateNo = null;
this.payingForm.paymentStatus = null;
this.payingForm.planDate = null;
this.payingForm.delayDate = null;
this.payingForm.name = null;
this.payingForm.payableAmount = null;
this.payingForm.paidAmount = null;
this.payingForm.diffAmount = null;
this.payingForm.amount = null;
this.payingForm.remark = null;
if(show) {
this.payingForm.planningId = this.planning.id;
this.payingForm.plateNo = this.planning.plateNo;
this.payingForm.planDate = this.planning.planDate;
if(this.planning.delayDate) {
this.payingForm.delayDate = this.planning.delayDate;
} else {
this.payingForm.delayDate = this.planning.planDate;
}
this.payingForm.name = this.planning.name;
this.payingForm.payableAmount = this.planning.payableAmount;
this.payingForm.paidAmount = this.planning.paidAmount;
this.payingForm.diffAmount = this.planning.payableAmount - this.planning.paidAmount;
this.payingForm.paymentStatus = paymentStatusOption.filter(item => item.value === this.planning.paymentStatus)[0].text;
}
},
},
methods: {
setAll() {
this.payingForm.amount = "" + this.payingForm.diffAmount;
},
saveReturnDeposit() {
this.$refs.payingForm.validate(valid => {
if (valid) {
const requestData = {
planningId: this.payingForm.planningId,
delayDate: this.payingForm.delayDate,
remark: this.payingForm.remark,
}
dispatch("invoke/asyncDelay", requestData).then(({ code }) => {
this.submitLoading = false;
if (code === 1) {
this.$Message.success("延期成功");
this.$emit("search");
this.visible = false;
}
});
}
});
},
},
mounted() {
}
};
src/view/driver_contract/receivables/delay/index.vue 0 → 100644
<template>
<div>
<Modal width="600" v-model="visible" title="延期" >
<div>
<Form ref="payingForm" :model="payingForm" :rules="payingFormRule" :label-width="80" label-colon>
<Row>
<Col span="12">
<FormItem label="车牌号" prop="plateNo">{{ payingForm.plateNo }}</FormItem>
</Col>
<Col span="12">
<FormItem label="收款状态" prop="status">{{ payingForm.paymentStatus }}</FormItem>
</Col>
</Row>
<Row>
<Col span="12">
<FormItem label="应收日期" prop="planDate">{{ payingForm.planDate }}</FormItem>
</Col>
<Col span="12">
<FormItem label="款项名称" prop="name">{{ payingForm.name }}</FormItem>
</Col>
</Row>
<Row :gutter="10">
<Col span="8">
<FormItem label="应收金额" prop="payableAmount">{{ payingForm.payableAmount }}</FormItem>
</Col>
<Col span="8">
<FormItem label="已收金额" prop="paidAmount">{{ payingForm.paidAmount }}</FormItem>
</Col>
<Col span="8">
<FormItem label="欠收金额" prop="diffAmount">{{ payingForm.diffAmount }}</FormItem>
</Col>
</Row>
<Row :gutter="10">
<Col span="24">
<FormItem label="延期日期" prop="delayDate">
<DatePicker v-model="payingForm.delayDate" style="width: 100%" placeholder="请输入延期日期" :options="disabledOption"></DatePicker>
</FormItem>
</Col>
</Row>
<Row>
<Col span="24">
<FormItem label="备注" prop="remark">
<Input v-model="payingForm.remark" type="textarea" :rows="4" placeholder="请输入备注" style="width: 100%" />
</FormItem>
</Col>
</Row>
</Form>
</div>
<div slot="footer">
<Button @click="visible = false">取消</Button>
<Button @click="saveReturnDeposit" :loading="submitLoading" type="primary">确定</Button>
</div>
</Modal>
</div>
</template>
<script src="./index.js"/>
<style lang="less" scoped>
</style>
\ No newline at end of file
src/view/driver_contract/receivables/helper.js 0 → 100644
import { paymentStatusOption } from "@/libs/constants.js";
export const columns = (search, showContract, showDriver, showVehicle, showPaying, showDelay) => [
// {
// title: "id",
// key: "id",
// align: "center",
// width: 60,
// },
{
title: "付款状态",
align: "center",
minWidth: 120,
render: (h, { row }) => {
const { paymentStatus } = row;
const [{ text }] = paymentStatusOption.filter(item => item.value === paymentStatus);
return h("span", text);
}
},
{
title: "费用类型",
key: "name",
align: "center",
minWidth: 120,
},
{
title: "合同",
align: "center",
minWidth: 160,
render: (h, { row }) => {
const { contractCode } = row;
return h(
"a",
{
on: { click: () => {
showContract(row);
}}
},
contractCode
);
}
},
{
title: "司机",
align: "center",
minWidth: 100,
render: (h, { row }) => {
const { driverName } = row;
return h(
"a",
{
on: { click: () => {
showDriver(row);
}}
},
driverName
);
}
},
{
title: "车辆",
align: "center",
minWidth: 100,
render: (h, { row }) => {
const { plateNo } = row;
return h(
"a",
{
on: { click: () => {
showVehicle(row);
}}
},
plateNo
);
}
},
{
title: "应收金额",
key: "payableAmount",
align: "center",
minWidth: 100,
},
{
title: "已收金额",
key: "paidAmount",
align: "center",
minWidth: 100,
},
{
title: "费用日期",
key: "planDate",
align: "center",
minWidth: 100,
},
{
title: "延期至",
key: "delayDate",
align: "center",
minWidth: 100,
},
{
title: "操作",
align: "center",
fixed: 'right',
width: 130,
render(h, { row }) {
const { status, paymentStatus } = row;
var emptyTag = h("span","　");
if(status == 0 || paymentStatus==2) {
return h("span", [emptyTag]);
}
var payingTag = h(
"Button",
{
props: { type: "primary", size: "small" },
on: { click: () => { showPaying(row); }}
},
"收款"
);
var delayTag = h(
"Button",
{
props: { type: "primary", size: "small" },
on: { click: () => { showDelay(row); }}
},
"延期"
);
return h("span", [payingTag, emptyTag, delayTag]);
}
},
];
src/view/driver_contract/receivables/index.js 0 → 100644
import store from "@/store";
const { dispatch } = store;
import moment from "moment";
import { columns } from "./helper.js";
import { Timing } from "@/components/index.js";
import { paymentStatusOption } from "@/libs/constants.js";
import Paying from "./paying/index.vue";
import Delay from "./delay/index.vue";
import EditContract from "../edit/index.vue";
import EditVehicle from "@/view/vehicle/edit/index.vue";
import EditDriver from "@/view/driver/edit/index.vue";
export default {
components: { Timing, Paying, Delay, paymentStatusOption, EditContract, EditVehicle, EditDriver },
data() {
return {
loading: false,
loadingVisible: false,
columns: [],
paymentStatusOption: paymentStatusOption,
changeCurrent: 1,
searchForm: {
category: "全部",
type: null,
typeName: null,
driverInfo: null,
vehicleInfo: null,
planDate: null,
planDateStart: null,
planDateEnd: null,
paymentStatus: 0,
status: null,
},
data: {
total:0,
current: 1,
records:[],
},
page: {
size: 10,
},
}
},
watch: {
"searchForm.category"() {
if(this.searchForm.category == '全部') {
this.searchForm.planDate = [];
} else if(this.searchForm.category == '已超期') {
this.searchForm.planDate = [moment().subtract(10, "years").format().substring(0,10), moment().subtract(1, "days").format().substring(0,10)];
} else if(this.searchForm.category == '1周内') {
this.searchForm.planDate = [moment().format().substring(0,10), moment().subtract(-7, "days").format().substring(0,10)];
} else if(this.searchForm.category == '1月内') {
this.searchForm.planDate = [moment().format().substring(0,10), moment().subtract(-30, "days").format().substring(0,10)];
}
this.search();
}
},
methods: {
showEdit() {
},
search(current = 1) {
this.loading = true;
if(this.searchForm.planDate != null) {
this.searchForm.planDateStart = this.searchForm.planDate[0];
this.searchForm.planDateEnd = this.searchForm.planDate[1];
}
dispatch("invoke/asyncSearchPlanning", {
current,
size: this.page.size,
records: this.searchForm
}).then(({ data }) => {
this.loading = false
if (data != null) {
this.data = {...data};
} else {
this.data = {
total:0,
current: 1,
records:[],
};
}
});
},
changePage(current) {
this.search(current);
this.changeCurrent = current
},
changeSize(value) {
this.page.size = value
this.search();
},
showContract(planning) {
this.loadingVisible = true;
dispatch("invoke/asyncGetContract", planning.contractId).then(({ data }) => {
this.loadingVisible = false;
if (data == null) {
return;
}
this.$refs.editContract.contract = data;
this.$refs.editContract.readonly = true;
this.$refs.editContract.visible = true;
}, (error) => {
this.loadingVisible = false;
});
},
showDriver(planning) {
this.loadingVisible = true;
dispatch("invoke/asyncGetDriver", planning.driverId).then(({ data }) => {
this.loadingVisible = false;
if (data == null) {
return;
}
this.$refs.editDriver.driver = data;
this.$refs.editDriver.readonly = true;
this.$refs.editDriver.visible = true;
}, (error) => {
this.loadingVisible = false;
});
},
showVehicle(planning) {
this.loadingVisible = true;
dispatch("invoke/asyncGetVehicle", planning.vehicleId).then(({ data }) => {
this.loadingVisible = false;
if (data == null) {
return;
}
this.$refs.editVehicle.vehicle = data;
this.$refs.editVehicle.readonly = true;
this.$refs.editVehicle.visible = true;
}, (error) => {
this.loadingVisible = false;
});
},
showPaying(planning) {
this.$refs.paying.planning = planning;
this.$refs.paying.visible = true;
},
showDelay(planning) {
this.$refs.delay.planning = planning;
this.$refs.delay.visible = true;
},
},
mounted() {
this.columns = columns(this.search, this.showContract, this.showDriver, this.showVehicle, this.showPaying, this.showDelay);
this.search();
}
};
src/view/driver_contract/receivables/index.vue 0 → 100644
<template>
<div>
<Paying ref="paying" @search="search" />
<Delay ref="delay" @search="search" />
<EditContract ref="editContract" />
<EditVehicle ref="editVehicle" />
<EditDriver ref="editDriver" />
<Card>
<Form :label-width="80" label-colon>
<Row :gutter="5">
<Col span="6">
<FormItem label="计划状态" >
<RadioGroup v-model="searchForm.category" type="button">
<Radio label="全部"></Radio>
<Radio label="已超期"></Radio>
<Radio label="1周内"></Radio>
<Radio label="1月内"></Radio>
</RadioGroup>
</FormItem>
</Col>
<Col span="6">
<FormItem label="计划日期" >
<Timing v-model="searchForm.planDate" data-type="date" :intervalWidth="5" />
</FormItem>
</Col>
<Col span="6">
<FormItem label="付款状态" >
<Select v-model.trim="searchForm.paymentStatus" filterable clearable>
<Option v-for="item in paymentStatusOption" :value="item.value" :key="item.value">{{ item.text }}</Option>
</Select>
</FormItem>
</Col>
</Row>
<Row :gutter="5" >
<Col span="6">
<FormItem label="司机信息" >
<Input v-model="searchForm.driverInfo" placeholder="姓名/手机号/身份证" clearable/>
</FormItem>
</Col>
<Col span="6">
<FormItem label="车辆信息" >
<Input v-model="searchForm.vehicleInfo" placeholder="车牌号/品牌" clearable/>
</FormItem>
</Col>
<Col span="6">
<Button @click="search()" type="primary"><Icon type="ios-search-outline" /> 查询</Button>
</Col>
</Row>
</Form>
</Card>
<Card style="margin-top:10px">
<Table border :loading="loading" :columns="columns" :data="data.records"/>
<Spin fix v-if="loadingVisible"/>
<Page
style="margin-top:10px"
:total="Number(data.total)"
:current="Number(data.current)"
@on-change="changePage"
@on-page-size-change="changeSize"
:placement="'top'"
:page-size-opts="[10, 30, 50, 100]"
show-sizer
show-elevator
show-total></Page>
</Card>
</div>
</template>
<script src="./index.js"></script>
<style>
.ivu-table-cell {
padding-left: 0;
padding-right: 0;
}
.ivu-table td {
height: 30px;
}
</style>
\ No newline at end of file
src/view/driver_contract/receivables/paying/index.js 0 → 100644
import store from "@/store";
const { dispatch } = store;
import { isInteger } from "@/libs/validator.js";
import { paymentStatusOption } from "@/libs/constants.js";
export default {
components: { },
data() {
return {
planning: null,
visible: false,
submitLoading: false,
payingFormRule: {
amount: [{ required: true, message: "请输入返还金额", trigger: "blur" }, { validator: isInteger, trigger: "blur" } ],
},
payingForm: {
planningId: 0,
plateNo: null,
paymentStatus: null,
planDate: null,
name: null,
payableAmount: null,
paidAmount: null,
diffAmount: null,
amount: null,
remark: null,
},
};
},
computed: {
},
watch: {
visible(show) {
this.submitLoading = false;
this.$refs.payingForm.resetFields();
this.payingForm.planningId = null;
this.payingForm.plateNo = null;
this.payingForm.paymentStatus = null;
this.payingForm.planDate = null;
this.payingForm.name = null;
this.payingForm.payableAmount = null;
this.payingForm.paidAmount = null;
this.payingForm.diffAmount = null;
this.payingForm.amount = null;
this.payingForm.remark = null;
if(show) {
this.payingForm.planningId = this.planning.id;
this.payingForm.plateNo = this.planning.plateNo;
this.payingForm.planDate = this.planning.planDate;
this.payingForm.name = this.planning.name;
this.payingForm.payableAmount = this.planning.payableAmount;
this.payingForm.paidAmount = this.planning.paidAmount;
this.payingForm.diffAmount = this.planning.payableAmount - this.planning.paidAmount;
this.payingForm.paymentStatus = paymentStatusOption.filter(item => item.value === this.planning.paymentStatus)[0].text;
}
},
},
methods: {
setAll() {
this.payingForm.amount = "" + this.payingForm.diffAmount;
},
saveReturnDeposit() {
this.$refs.payingForm.validate(valid => {
if (valid) {
const requestData = {
planningId: this.payingForm.planningId,
amount: this.payingForm.amount,
remark: this.payingForm.remark,
}
dispatch("invoke/asyncPaying", requestData).then(({ code }) => {
this.submitLoading = false;
if (code === 1) {
this.$Message.success("收款成功");
this.$emit("search");
this.visible = false;
}
});
}
});
},
},
mounted() {
}
};
src/view/driver_contract/receivables/paying/index.vue 0 → 100644
<template>
<div>
<Modal width="600" v-model="visible" title="收款" >
<div>
<Form ref="payingForm" :model="payingForm" :rules="payingFormRule" :label-width="80" label-colon>
<Row>
<Col span="12">
<FormItem label="车牌号" prop="plateNo">{{ payingForm.plateNo }}</FormItem>
</Col>
<Col span="12">
<FormItem label="收款状态" prop="status">{{ payingForm.paymentStatus }}</FormItem>
</Col>
</Row>
<Row>
<Col span="12">
<FormItem label="应收日期" prop="planDate">{{ payingForm.planDate }}</FormItem>
</Col>
<Col span="12">
<FormItem label="款项名称" prop="name">{{ payingForm.name }}</FormItem>
</Col>
</Row>
<Row :gutter="10">
<Col span="8">
<FormItem label="应收金额" prop="payableAmount">{{ payingForm.payableAmount }}</FormItem>
</Col>
<Col span="8">
<FormItem label="已收金额" prop="paidAmount">{{ payingForm.paidAmount }}</FormItem>
</Col>
<Col span="8">
<FormItem label="欠收金额" prop="diffAmount">{{ payingForm.diffAmount }}</FormItem>
</Col>
</Row>
<Row :gutter="10">
<Col span="20">
<FormItem label="本次缴款金额" prop="amount">
<Input v-model.trim="payingForm.amount" type="number" />
</FormItem>
</Col>
<Col span="4">
<Button @click="setAll" type="primary" style="width:100%">全部</Button>
</Col>
</Row>
<Row>
<Col span="24">
<FormItem label="备注" prop="remark">
<Input v-model="payingForm.remark" type="textarea" :rows="4" placeholder="请输入备注" style="width: 100%" />
</FormItem>
</Col>
</Row>
</Form>
</div>
<div slot="footer">
<Button @click="visible = false">取消</Button>
<Button @click="saveReturnDeposit" :loading="submitLoading" type="primary">确定</Button>
</div>
</Modal>
</div>
</template>
<script src="./index.js"/>
<style lang="less" scoped>
</style>
\ No newline at end of file
src/view/driver_contract/sign/index.vue
......@@ -27,7 +27,7 @@
</Row>
<Row>
<Col span="8">
<FormItem label="应付押金" prop="payableDepositAmount">
<FormItem label="应收押金" prop="payableDepositAmount">
<Input v-model.trim="contractForm.payableDepositAmount" type="number" />
</FormItem>
</Col>
......
src/view/source_contract/edit/helper.js
export const columns = () => [
export const logColumns = () => [
{
title: "序号",
key: "id",
......@@ -30,3 +30,49 @@ export const columns = () => [
align: "center",
},
];
export const rentColumns = () => [
{
title: "状态",
align: "center",
width: 120,
render(h, { row }) {
try {
const { paymentStatus } = row;
return h("span", {style: {color: paymentStatus == 2 ? 'green' : 'red' }}, paymentStatus == 2 ? '已付' : '未付');
} catch(e) {
console.log(e);
}
}
},
{
title: "类型",
key: "name",
align: "center",
width: 120,
},
{
title: "日期",
key: "planDate",
align: "center",
width: 120,
},
{
title: "应付金额",
key: "payableAmount",
align: "center",
width: 120,
},
{
title: "已付金额",
key: "paidAmount",
align: "center",
width: 120,
},
{
title: "备注",
key: "remark",
align: "center",
},
];
src/view/source_contract/edit/index.js
import store from "@/store";
const { dispatch } = store;
import { columns } from "./helper.js";
import { isInteger } from "@/libs/validator.js";
import { logColumns, rentColumns } from "./helper.js";
import { leaseTypeOption } from "@/libs/constants.js";
export default {
components: { },
components: { leaseTypeOption },
data() {
return {
logLoading: false,
logDatas: [],
logColumns: [],
leaseTypeOption: leaseTypeOption,
rentLoading: false,
rentDatas: [],
rentColumns: [],
contract: null,
readonly: false,
visible: false,
submitLoading: false,
mainUploadStatus: false,
secondUploadStatus: false,
selectTab: null,
contractFormRule: {
odograph: [{ required: true, message: "请输入里程数", trigger: "blur" }, { validator: isInteger, trigger: "blur" } ],
depositAmount: [{ required: true, message: "请输入押金", trigger: "blur" }, { validator: isInteger, trigger: "blur" }],
rentAmount: [{ required: true, message: "请输入月租金", trigger: "blur" }, { validator: isInteger, trigger: "blur" }],
startDate: [{ type: "date", required: true, message: "请选择开始日期", trigger: "change" }],
endDate: [{ type: "date", required: true, message: "请选择结束日期", trigger: "change" }],
},
contractForm: {
contractId: 0,
type: 1,
......@@ -33,10 +30,11 @@ export default {
vehicle: null,
source: null,
odograph: null,
odographEv: null,
payableDepositAmount: null,
paidDepositAmount: null,
diffDepositAmount: null,
startDate: null,
endDate: null,
depositAmount: null,
rentAmount: null,
leaseType: null,
remark: null,
......@@ -58,7 +56,6 @@ export default {
this.contractForm.odographEv = null;
this.contractForm.startDate = null;
this.contractForm.endDate = null;
this.contractForm.depositAmount = null;
this.contractForm.rentAmount = null;
this.contractForm.leaseType = null;
this.contractForm.remark = null;
......@@ -73,13 +70,14 @@ export default {
this.contractForm.code = this.contract.code;
this.contractForm.vehicle = vehicleInfo;
this.contractForm.source = this.contract.sourceVo.name;
this.contractForm.odograph = ""+this.contract.odograph;
this.contractForm.odographEv = ""+this.contract.odographEv;
this.contractForm.odograph = this.contract.odograph;
this.contractForm.payableDepositAmount = this.contract.payableDepositAmount;
this.contractForm.paidDepositAmount = this.contract.paidDepositAmount;
this.contractForm.diffDepositAmount = (this.contract.payableDepositAmount - this.contract.paidDepositAmount);
this.contractForm.startDate = this.contract.startDate;
this.contractForm.endDate = this.contract.endDate;
this.contractForm.leaseType = this.contract.leaseType;
this.contractForm.depositAmount = ""+this.contract.depositAmount;
this.contractForm.returnDepositAmount = ""+this.contract.returnDepositAmount;
this.contractForm.returnDepositAmount = this.contract.returnDepositAmount;
this.contractForm.rentAmount = ""+this.contract.rentAmount;
this.contractForm.remark = this.contract.remark;
......@@ -91,6 +89,7 @@ export default {
}
this.listLogs();
this.listRentPlanning();
} else {
this.logDatas = [];
}
......@@ -99,66 +98,6 @@ export default {
},
},
methods: {
handleView(item) {
},
handleRemove(file) {
// const fileList = this.$refs.upload.fileList;
// this.$refs.upload.fileList.splice(fileList.indexOf(file), 1);
this.uploadList.splice(this.uploadList.indexOf(file), 1);
},
handleFormatError (file) {
this.$Notice.warning({
title: 'The file format is incorrect',
desc: 'File format of ' + file.name + ' is incorrect, please select jpg or png.'
});
},
handleMaxSize (file) {
this.$Notice.warning({
title: 'Exceeding file size limit',
desc: 'File ' + file.name + ' is too large, no more than 2M.'
});
},
handleBeforeUpload(file) {
const formData = new FormData();
formData.append("file", file);
const item = {id: 0, url: "", status: ""};
this.uploadList.push(item);
dispatch("invoke/asyncUploadFile", formData).then(res => {
const { code, data, msg } = res;
if(code == 1) {
this.$Message.info("上传成功");
item.id = data.id;
item.url = data.filePath;
item.status = "finished";
} else {
this.$Message.info("上传失败");
}
});
return false;
},
saveContract() {
// console.log(this.contractForm);
// return;
this.$refs.contractForm.validate(valid => {
if (valid) {
this.uploadList.forEach(f => {
this.contractForm.files.push(f.id);
})
dispatch("invoke/asyncUpdateContract", this.contractForm).then(({ code }) => {
this.submitLoading = false;
if (code === 1) {
this.$Message.success("合同修改成功");
this.$emit("search");
this.visible = false;
}
});
}
});
},
listVehicles() {
dispatch("invoke/asyncListNoSourceContractVehicles").then(({ data }) => {
this.vehicles = data;
......@@ -174,9 +113,18 @@ export default {
dispatch("invoke/asyncListLogs", contractId).then(({ data }) => {
this.logDatas = data;
});
}
},
listRentPlanning() {
this.rentLoading = true;
const requestData = { contractId: this.contract.id, type: 1 };
dispatch("invoke/asyncListPlanningByContractId", requestData).then(({ data }) => {
this.rentLoading = false;
this.rentDatas = data;
});
},
},
mounted() {
this.logColumns = columns();
this.logColumns = logColumns();
this.rentColumns = rentColumns();
}
};
src/view/source_contract/edit/index.vue
......@@ -4,75 +4,57 @@
<Tabs v-model="selectTab">
<TabPane label="合同信息" icon="md-document" name="contractTab">
<div>
<Form ref="contractForm" :model="contractForm" :rules="contractFormRule" :label-width="80" label-colon>
<Form ref="contractForm" :model="contractForm" :label-width="80" label-colon>
<Row>
<Col span="8">
<FormItem label="车辆信息" prop="vehicle">
<Input v-model.trim="contractForm.vehicle" type="text" disabled />
</FormItem>
<FormItem label="车辆信息" prop="vehicle">{{ contractForm.vehicle }}</FormItem>
</Col>
<Col span="8">
<FormItem label="车源信息" prop="source">
<Input v-model.trim="contractForm.source" type="text" disabled />
</FormItem>
<FormItem label="车源信息" prop="source">{{ contractForm.source }}</FormItem>
</Col>
<Col span="8">
<FormItem label="租赁方式" prop="leaseType">
<Input v-model.trim="contractForm.leaseType" type="text" :disabled="readonly"/>
</FormItem>
<FormItem label="里程数" prop="odograph">{{ contractForm.odograph }}</FormItem>
</Col>
</Row>
<Row>
<Col span="8">
<FormItem label="月租金" prop="rentAmount">
<Input v-model.trim="contractForm.rentAmount" type="number" :disabled="readonly"/>
</FormItem>
<FormItem label="应付押金" prop="payableDepositAmount">{{ contractForm.payableDepositAmount }}</FormItem>
</Col>
<Col span="8">
<FormItem label="押金" prop="depositAmount">
<Input v-model.trim="contractForm.depositAmount" type="number" :disabled="readonly"/>
</FormItem>
<FormItem label="实付押金" prop="paidDepositAmount">{{ contractForm.paidDepositAmount }}</FormItem>
</Col>
<Col span="8">
<FormItem label="反还押金" prop="returnDepositAmount">
<Input v-model.trim="contractForm.returnDepositAmount" type="number" disabled />
</FormItem>
<FormItem label="欠付押金" prop="diffDepositAmount">{{ contractForm.diffDepositAmount }}</FormItem>
</Col>
</Row>
<Row>
<Col span="8">
<FormItem label="开始日期" prop="startDate">
<DatePicker v-model="contractForm.startDate" type="date" style="width: 100%" placeholder="请输入开始日期":disabled="readonly"></DatePicker>
</FormItem>
<FormItem label="周期租金" prop="rentAmount">{{ contractForm.rentAmount }}</FormItem>
</Col>
<Col span="8">
<FormItem label="结束日期" prop="endDate">
<DatePicker v-model="contractForm.endDate" type="date" style="width: 100%" placeholder="请输入结束日期":disabled="readonly"></DatePicker>
</FormItem>
</Col>
<Col span="8">
<FormItem label="里程数" prop="odograph">
<Input v-model.trim="contractForm.odograph" type="number" :disabled="readonly"/>
</FormItem>
<FormItem label="反还押金" prop="returnDepositAmount">{{ contractForm.returnDepositAmount }}</FormItem>
</Col>
</Row>
<Row>
<Col span="8">
<FormItem label="ev里程数" prop="odographEv">
<Input v-model.trim="contractForm.odographEv" type="number" :disabled="readonly"/>
</FormItem>
<FormItem label="租赁方式" prop="leaseType">{{ contractForm.leaseType==null ? "" : leaseTypeOption.filter(item => item.value === contractForm.leaseType)[0].text }}</FormItem>
</Col>
<Col span="8">
<FormItem label="开始日期" prop="startDate">{{ contractForm.startDate }}</FormItem>
</Col>
<Col span="8">
<FormItem label="结束日期" prop="endDate">{{ contractForm.endDate }}</FormItem>
</Col>
</Row>
<Row>
<Col span="24">
<FormItem label="备注" prop="remark">
<Input v-model="contractForm.remark" type="textarea" :rows="4" placeholder="请输入备注" style="width: 100%" :disabled="readonly"/>
</FormItem>
<FormItem label="备注" prop="remark">{{ contractForm.remark == null ? "无" : contractForm.remark }}</FormItem>
</Col>
</Row>
<Row>
<Col span="24">
<FormItem label="验车照片">
<div v-if="uploadList==null || uploadList.length==0">无</div>
<div class="demo-upload-list" v-for="item in uploadList">
<template v-if="item.status === 'finished'">
<img :src="item.url" style="width: 60px;height:60px;line-height: 60px;">
......@@ -81,27 +63,8 @@
<Icon type="ios-trash-outline" @click.native="handleRemove(item)" v-if="!readonly"></Icon>
</div>
</template>
<template v-else>
<Spin size="small" fix ></Spin>
</template>
<template v-else><Spin size="small" fix ></Spin></template>
</div>
<Upload
ref="upload"
v-if="!readonly"
:show-upload-list="false"
:max-size="1024"
:on-format-error="handleFormatError"
:on-exceeded-size="handleMaxSize"
:before-upload="handleBeforeUpload"
multiple
accept="image/*"
type="drag"
action="//jsonplaceholder.typicode.com/posts/"
style="display: inline-block;width:60px;">
<div style="width: 60px;height:60px;line-height: 60px;">
<Icon type="ios-camera" size="20"></Icon>
</div>
</Upload>
</FormItem>
</Col>
</Row>
......@@ -109,15 +72,14 @@
</div>
</TabPane>
<TabPane label="操作日志" icon="md-create" name="logTab">
<Table border
:loading="logLoading"
:columns="logColumns"
:data="logDatas"/>
<Table border :loading="logLoading" :columns="logColumns" :data="logDatas"/>
</TabPane>
<TabPane label="租金计划" icon="logo-usd" name="rentTab">
<Table border :loading="rentLoading" :columns="rentColumns" :data="rentDatas"/>
</TabPane>
</Tabs>
<div slot="footer">
<Button @click="visible = false">取消</Button>
<Button @click="saveContract" :loading="submitLoading" type="primary" v-if="!readonly">确定</Button>
</div>
</Modal>
</div>
......
src/view/source_contract/list/helper.js
import Actions from "./actions/index.vue";
import { depositStatusOption, leaseTypeOption } from "@/libs/constants.js";
export const columns = (search, showContract, showVehicle, showReturnDeposit) => [
{
......@@ -87,12 +88,6 @@ export const columns = (search, showContract, showVehicle, showReturnDeposit) =>
minWidth: 100,
},
{
title: "ev里程",
key: "odographEv",
align: "center",
minWidth: 100,
},
{
title: "合同开始日期",
key: "startDate",
align: "center",
......@@ -106,9 +101,13 @@ export const columns = (search, showContract, showVehicle, showReturnDeposit) =>
},
{
title: "租赁方式",
key: "leaseType",
align: "center",
minWidth: 120,
render: (h, { row }) => {
const { leaseType } = row;
const [{ text }] = leaseTypeOption.filter(item => item.value === leaseType);
return h("span", text);
}
},
{
title: "月租金",
......@@ -134,13 +133,14 @@ export const columns = (search, showContract, showVehicle, showReturnDeposit) =>
minWidth: 120,
render: (h, { row }) => {
const { depositStatus } = row;
if(depositStatus == 0){
return h("span", {style: {color: "red" }}, "未返还");
} else if(depositStatus == 1){
return h("span", {style: {color: "green" }}, "全部返还");
} else if(depositStatus == 2){
return h("span", {style: {color: "orange" }}, "部分返还");
const [{ text }] = depositStatusOption.filter(item => item.value === depositStatus);
var color = "red";
if(depositStatus == 1) {
color = "orange";
} else if(depositStatus == 2) {
color = "green";
}
return h("span", {style: {color: color }}, text);
}
},
{
......
src/view/source_contract/list/index.js
......@@ -5,14 +5,16 @@ import SignContract from "../sign/index.vue";
import EditContract from "../edit/index.vue";
import EditVehicle from "@/view/vehicle/edit/index.vue";
import ReturnDeposit from "./return_deposit/index.vue";
import { depositStatusOption } from "@/libs/constants.js";
export default {
components: { SignContract, EditContract, EditVehicle, ReturnDeposit },
components: { SignContract, EditContract, EditVehicle, ReturnDeposit, depositStatusOption },
data() {
return {
loading: false,
columns: [],
plateNo: "",
depositStatusOption: depositStatusOption,
vehicleInfo: "",
status: null,
depositStatus: null,
type: 1,
......@@ -32,7 +34,7 @@ export default {
search(current = 1) {
this.searchForm = {
type: this.type,
plateNo: this.plateNo,
vehicleInfo: this.vehicleInfo,
status: this.status,
depositStatus: this.depositStatus,
};
......
src/view/source_contract/list/index.vue
......@@ -4,8 +4,8 @@
<Form :label-width="80" label-colon>
<Row :gutter="5">
<Col span="4">
<FormItem label="车牌号码" >
<Input v-model="plateNo" placeholder="Enter something..." clearable/>
<FormItem label="车辆信息" >
<Input v-model="vehicleInfo" placeholder="车牌号" clearable/>
</FormItem>
</Col>
<Col span="4">
......@@ -18,10 +18,8 @@
</Col>
<Col span="4">
<FormItem label="押金状态" >
<Select v-model.trim="depositStatus" clearable>
<Option :value="0" :key="0">未返还</Option>
<Option :value="1" :key="1">全部返还</Option>
<Option :value="2" :key="2">部分返还</Option>
<Select v-model.trim="depositStatus" filterable clearable>
<Option v-for="item in depositStatusOption" :value="item.value" :key="item.value">{{ item.text }}</Option>
</Select>
</FormItem>
</Col>
......
src/view/source_contract/sign/index.js
import store from "@/store";
const { dispatch } = store;
import moment from "moment";
import { isInteger } from "@/libs/validator.js";
import AddVehicle from "@/view/vehicle/add/index.vue";
import { leaseTypeOption } from "@/libs/constants.js";
......@@ -18,6 +19,7 @@ export default {
payableDepositAmount: [{ required: true, message: "请输入应付押金", trigger: "blur" }, { validator: isInteger, trigger: "blur" }],
paidDepositAmount: [{ required: true, message: "请输入实收押金", trigger: "blur" }, { validator: isInteger, trigger: "blur" }],
rentAmount: [{ required: true, message: "请输入月租金", trigger: "blur" }, { validator: isInteger, trigger: "blur" }],
firstPaidAmount: [{ required: true, message: "首次实收租金", trigger: "blur" }, { validator: isInteger, trigger: "blur" }],
leaseType: [{ type: "number", required: true, message: "请选择租赁方式", trigger: "change" }],
startDate: [{ type: "date", required: true, message: "请选择开始日期", trigger: "change" }],
leasePeriod: [{ required: true, message: "请输入租赁周期", trigger: "blur" }, { validator: isInteger, trigger: "blur" }],
......@@ -29,9 +31,11 @@ export default {
odograph: null,
payableDepositAmount: null,
paidDepositAmount: null,
diffDepositAmount: null,
startDate: null,
rentAmount: null,
leaseType: null,
firstPaidAmount: null,
leaseType: 1,
leasePeriod: null,
remark: null,
files: [],
......@@ -54,19 +58,26 @@ export default {
this.leasePeriodName = "周期/月";
}
},
'contractForm.payableDepositAmount'() {
this.contractForm.diffDepositAmount = this.contractForm.payableDepositAmount - this.contractForm.paidDepositAmount;
},
'contractForm.paidDepositAmount'() {
this.contractForm.diffDepositAmount = this.contractForm.payableDepositAmount - this.contractForm.paidDepositAmount;
},
visible(show) {
this.submitLoading = false;
this.$refs.contractForm.resetFields();
if(show) {
this.contractForm.files = [];
this.listVehicles();
this.listSources();
this.contractForm.startDate = moment().format().substring(0,10);
}
},
},
methods: {
onAddComplete(vehicle) {
console.log(vehicle);
this.vehicles.unshift(vehicle);
this.contractForm.vehicleId = vehicle.id;
},
......
src/view/source_contract/sign/index.vue
......@@ -28,11 +28,6 @@
</Row>
<Row>
<Col span="8">
<FormItem label="周期租金" prop="rentAmount">
<Input v-model.trim="contractForm.rentAmount" type="number" />
</FormItem>
</Col>
<Col span="8">
<FormItem label="应付押金" prop="payableDepositAmount">
<Input v-model.trim="contractForm.payableDepositAmount" type="number" />
</FormItem>
......@@ -42,6 +37,23 @@
<Input v-model.trim="contractForm.paidDepositAmount" type="number" />
</FormItem>
</Col>
<Col span="8">
<FormItem label="欠付押金" prop="diffDepositAmount">
<Input v-model.trim="contractForm.diffDepositAmount" type="number" readonly/>
</FormItem>
</Col>
</Row>
<Row>
<Col span="8">
<FormItem label="周期租金" prop="rentAmount">
<Input v-model.trim="contractForm.rentAmount" type="number" />
</FormItem>
</Col>
<Col span="8">
<FormItem label="首次实收租金" prop="firstPaidAmount">
<Input v-model.trim="contractForm.firstPaidAmount" type="number" />
</FormItem>
</Col>
</Row>
<Row>
<Col span="8">
......
src/view/vehicle/add/index.js
......@@ -183,7 +183,6 @@ export default {
dispatch("invoke/asyncCreateVehicle", this.vehicleForm).then(({ code, data }) => {
this.submitLoading = false;
if (code === 1) {
console.log(data);
this.$Message.success("添加成功");
this.$emit("search", data);
this.visible = false;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment