Commit e9ff1f91 by weijiguang

i

parent 4a7e7f22
...@@ -29,6 +29,7 @@ import { ...@@ -29,6 +29,7 @@ import {
createData, createData,
listVehicle, listVehicle,
listNoSourceContractVehicles, listNoSourceContractVehicles,
listAllowRentVehicles,
createVehicle, createVehicle,
updateVehicle, updateVehicle,
listContract, listContract,
...@@ -40,6 +41,11 @@ import { ...@@ -40,6 +41,11 @@ import {
listDriver, listDriver,
createDriver, createDriver,
updateDriver, updateDriver,
listAllDriver,
listFee,
createFee,
disableFee,
enableFee,
} from "./request_methods"; } from "./request_methods";
export default { export default {
...@@ -132,12 +138,28 @@ export default { ...@@ -132,12 +138,28 @@ export default {
return createData(payload) return createData(payload)
}, },
asyncListFee(_, payload) {
return listFee(payload)
},
asyncCreateFee(_, payload) {
return createFee(payload)
},
asyncDisableFee(_, payload) {
return disableFee(payload)
},
asyncEnableFee(_, payload) {
return enableFee(payload)
},
asyncListVehicle(_, payload) { asyncListVehicle(_, payload) {
return listVehicle(payload) return listVehicle(payload)
}, },
asyncListNoSourceContractVehicles(_, payload) { asyncListNoSourceContractVehicles(_, payload) {
return listNoSourceContractVehicles(payload) return listNoSourceContractVehicles(payload)
}, },
asyncListAllowRentVehicles(_, payload) {
return listAllowRentVehicles(payload)
},
asyncCreateVehicle(_, payload) { asyncCreateVehicle(_, payload) {
return createVehicle(payload) return createVehicle(payload)
}, },
...@@ -166,6 +188,9 @@ export default { ...@@ -166,6 +188,9 @@ export default {
asyncListDriver(_, payload) { asyncListDriver(_, payload) {
return listDriver(payload) return listDriver(payload)
}, },
asyncListAllDriver(_, payload) {
return listAllDriver(payload)
},
asyncCreateDriver(_, payload) { asyncCreateDriver(_, payload) {
return createDriver(payload) return createDriver(payload)
}, },
......
...@@ -66,10 +66,19 @@ export const listVehicleType = data => axios.post(`${proxy}/data/vehicleTypes`, ...@@ -66,10 +66,19 @@ export const listVehicleType = data => axios.post(`${proxy}/data/vehicleTypes`,
export const listUseCharacters = data => axios.post(`${proxy}/data/useCharacters`, data); export const listUseCharacters = data => axios.post(`${proxy}/data/useCharacters`, data);
// 数据 / 创建 // 数据 / 创建
export const createData = data => axios.post(`${proxy}/data/create`, data); export const createData = data => axios.post(`${proxy}/data/create`, data);
// 费用项 / 列表
export const listFee = data => axios.post(`${proxy}/fee/list/${data}`);
// 费用项 / 创建
export const createFee = data => axios.post(`${proxy}/fee/create`, data);
// 费用项 / 禁用
export const disableFee = data => axios.post(`${proxy}/fee/disable/${data}`);
// 费用项 / 启用
export const enableFee = data => axios.post(`${proxy}/fee/enable/${data}`);
// 车辆 / 列表 // 车辆 / 列表
export const listVehicle = data => axios.post(`${proxy}/vehicle/list`, data); export const listVehicle = data => axios.post(`${proxy}/vehicle/list`, data);
export const listNoSourceContractVehicles = data => axios.post(`${proxy}/vehicle/no/source/contract/vehicles`, data); export const listNoSourceContractVehicles = data => axios.post(`${proxy}/vehicle/no/source/contract/vehicles`, data);
export const listAllowRentVehicles = data => axios.post(`${proxy}/vehicle/allow/rent/vehicles`, data);
// 车辆 / 创建 // 车辆 / 创建
export const createVehicle = data => axios.post(`${proxy}/vehicle/create`, data); export const createVehicle = data => axios.post(`${proxy}/vehicle/create`, data);
// 车辆 / 修改 // 车辆 / 修改
...@@ -90,6 +99,7 @@ export const returnDeposit = data => axios.post(`${proxy}/contract/return/deposi ...@@ -90,6 +99,7 @@ export const returnDeposit = data => axios.post(`${proxy}/contract/return/deposi
// 司机 / 列表 // 司机 / 列表
export const listDriver = data => axios.post(`${proxy}/driver/list`, data); export const listDriver = data => axios.post(`${proxy}/driver/list`, data);
export const listAllDriver = data => axios.post(`${proxy}/driver/list/all`, data);
// 司机 / 创建 // 司机 / 创建
export const createDriver = data => axios.post(`${proxy}/driver/create`, data); export const createDriver = data => axios.post(`${proxy}/driver/create`, data);
// 司机 / 更新 // 司机 / 更新
......
...@@ -87,6 +87,14 @@ export default [ ...@@ -87,6 +87,14 @@ export default [
title: '品牌型号', title: '品牌型号',
visable: false, visable: false,
component: () => import("@/view/data/model/index.vue") component: () => import("@/view/data/model/index.vue")
},
{
path: '/data/fee',
key: 'fee',
icon: 'logo-xbox',
title: '费用项',
visable: false,
component: () => import("@/view/data/fee/index.vue")
} }
] ]
}, },
...@@ -124,7 +132,7 @@ export default [ ...@@ -124,7 +132,7 @@ export default [
}, },
{ {
path: '/source_contract/bill_week', path: '/source_contract/bill_week',
key: 'bill_week', key: 'source_contract_bill_week',
icon: 'logo-xbox', icon: 'logo-xbox',
title: '七日内交租', title: '七日内交租',
visable: false, visable: false,
...@@ -132,7 +140,7 @@ export default [ ...@@ -132,7 +140,7 @@ export default [
}, },
{ {
path: '/source_contract/bill_month', path: '/source_contract/bill_month',
key: 'bill_month', key: 'source_contract_bill_month',
icon: 'logo-xbox', icon: 'logo-xbox',
title: '本月交租', title: '本月交租',
visable: false, visable: false,
...@@ -157,4 +165,37 @@ export default [ ...@@ -157,4 +165,37 @@ export default [
}, },
] ]
}, },
{
path: '/driver_contract',
key: 'driver_contract',
icon: 'logo-xbox',
title: '司机合同',
visable: false,
children: [
{
path: '/driver_contract/list',
key: 'driver_contract_list',
icon: 'logo-xbox',
title: '合同查询',
visable: false,
component: () => import("@/view/driver_contract/list/index.vue")
},
{
path: '/driver_contract/bill_week',
key: 'driver_contract_bill_week',
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: '本月交租',
visable: false,
component: () => import("@/view/vehicle/list/index.vue")
},
]
},
] ]
import store from "@/store";
const { dispatch } = store;
import { isInteger } from "@/libs/validator.js";
import { timingOption } from "../helper.js";
export default {
components: { timingOption },
data() {
return {
visible: false,
submitLoading: false,
timingOption: timingOption,
saveFormRule: {
name: [{ required: true, message: "请输入费用项名称", trigger: "blur" } ],
timing: [{ required: true, message: "请选择收费时机", trigger: "blur", type: "number" } ],
amount: [{ required: true, message: "请输入金额", trigger: "blur" }, { validator: isInteger, trigger: "blur" } ],
},
saveForm: {
name: "",
timing: null,
amount: null,
}
};
},
computed: {
},
watch: {
visible(show) {
this.submitLoading = false;
this.$refs.saveForm.resetFields();
},
},
methods: {
saveFee() {
this.$refs.saveForm.validate(valid => {
if (valid) {
this.submitLoading = true;
dispatch("invoke/asyncCreateFee", this.saveForm).then(({ code }) => {
this.submitLoading = false;
if (code === 1) {
this.$Message.success("添加成功");
this.$emit("search");
this.visible = false;
}
});
}
});
}
},
mounted() {
}
};
<template>
<div>
<Button icon="ios-add" type="primary" @click="visible = true">添加费用项</Button>
<Modal width="400" v-model="visible" title="费用项信息">
<div>
<Form ref="saveForm" :model="saveForm" :rules="saveFormRule" :label-width="100">
<Row>
<Col span="24">
<FormItem label="费用项名称" prop="name">
<Input v-model.trim="saveForm.name" type="text" />
</FormItem>
</Col>
</Row>
<Row>
<Col span="24">
<FormItem label="交费时机" prop="timing">
<Select v-model.trim="saveForm.timing" filterable>
<Option v-for="item in timingOption" :value="item.value" :key="item.value">{{ item.text }}</Option>
</Select>
</FormItem>
</Col>
</Row>
<Row>
<Col span="24">
<FormItem label="金额" prop="amount">
<Input v-model.trim="saveForm.amount" type="text" />
</FormItem>
</Col>
</Row>
</Form>
</div>
<div slot="footer">
<Button @click="visible = false">取消</Button>
<Button @click="saveFee" :loading="submitLoading" type="primary">确定</Button>
</div>
</Modal>
</div>
</template>
<script src="./index.js"/>
export const timingOption = [
{text: "一次性", value: 1},
{text: "周度", value: 2},
{text: "月度", value: 3},
{text: "季度", value: 4},
{text: "年度", value: 5},
];
export const columns = (disable, enable) => [
{
title: "ID",
key: "id",
align: "center",
minWidth: 60,
},
{
title: "费用名称",
key: "name",
align: "center",
minWidth: 100,
},
{
title: "收费时机",
align: "center",
minWidth: 100,
render(h, { row }) {
try {
const { timing } = row;
const [{ text }] = timingOption.filter(item => item.value === timing);
if(!text) {
text = "";
}
return h("span", text);
} catch(e) {
console.log(e);
}
}
},
{
title: "金额",
key: "amount",
align: "center",
minWidth: 100,
},
{
title: "状态",
align: "center",
minWidth: 100,
render(h, { row }) {
try {
const { status } = row;
return h("span", {style: {color: status == 1 ? 'green' : 'red' }}, status == 1 ? '有效' : '失效');
} catch(e) {
console.log(e);
}
}
},
{
title: "操作",
align: "center",
fixed: 'right',
width: 180,
render(h, { row }) {
try {
const { status } = row;
var disableTag = h(
"Poptip",
{
props: { title: "确定停用当前费用项吗?", transfer: true, confirm: true, size: "small" },
on: { "on-ok": () => { disable(row); } }
},
[
h("Button", {props: {type: "error", size: "small"}}, "停用")
]
);
var enableTag = h(
"Button",
{
props: { type: "primary", size: "small" },
on: { click: () => { enable(row); }}
},
"启用"
);
return h("span", status == 1 ? [disableTag] : [enableTag]);
} catch(e) {
console.log(e);
}
}
},
];
import store from "@/store";
const { dispatch } = store;
import { columns } from "./helper.js";
import AddFee from "./add/index.vue";
export default {
components: { AddFee },
data() {
return {
loading: false,
columns: [],
name: "",
changeCurrent: 1,
data: [],
}
},
methods: {
disable(fee) {
dispatch("invoke/asyncDisableFee", fee.id).then(({ data }) => {
fee.status = 0;
});
},
enable(fee) {
dispatch("invoke/asyncEnableFee", fee.id).then(({ data }) => {
fee.status = 1;
});
},
search() {
dispatch("invoke/asyncListFee", -1).then(({ data }) => {
this.loading = false;
if (data != null) {
this.data = data;
} else {
this.data = [];
}
});
},
},
mounted() {
this.columns = columns(this.disable, this.enable);
this.search();
}
};
<template>
<div>
<Card>
<Form :label-width="100">
<Row>
<Col span="24">
<AddFee @search="search" ref="addDialog" style="float:right"/>
</Col>
</Row>
</Form>
</Card>
<Card style="margin-top:10px">
<Table
border
:loading="loading"
:columns="columns"
:data="data" />
</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
...@@ -7,6 +7,7 @@ export default { ...@@ -7,6 +7,7 @@ export default {
return { return {
visible: false, visible: false,
driver: null, driver: null,
readonly: false,
submitLoading: false, submitLoading: false,
frontUploadStatus: false, frontUploadStatus: false,
backUploadStatus: false, backUploadStatus: false,
...@@ -70,6 +71,7 @@ export default { ...@@ -70,6 +71,7 @@ export default {
this.$refs.driverForm.resetFields(); this.$refs.driverForm.resetFields();
if(show) { if(show) {
console.log(this.driver);
this.driverForm.id = this.driver.id; this.driverForm.id = this.driver.id;
this.driverForm.frontFileId = this.driver.frontFile.id; this.driverForm.frontFileId = this.driver.frontFile.id;
this.driverForm.frontFileUrl = this.driver.frontFile.filePath; this.driverForm.frontFileUrl = this.driver.frontFile.filePath;
......
...@@ -18,12 +18,12 @@ ...@@ -18,12 +18,12 @@
</Col> </Col>
<Col span="6"> <Col span="6">
<FormItem label="电话" prop="phone"> <FormItem label="电话" prop="phone">
<Input v-model.trim="driverForm.phone" type="text" /> <Input v-model.trim="driverForm.phone" type="text" :disabled="readonly"/>
</FormItem> </FormItem>
</Col> </Col>
<Col span="6"> <Col span="6">
<FormItem label="性别" prop="gender"> <FormItem label="性别" prop="gender">
<Select v-model.trim="driverForm.gender" > <Select v-model.trim="driverForm.gender" :disabled="readonly">
<Option value="男" key="男"></Option> <Option value="男" key="男"></Option>
<Option value="女" key="女"></Option> <Option value="女" key="女"></Option>
</Select> </Select>
...@@ -33,22 +33,22 @@ ...@@ -33,22 +33,22 @@
<Row> <Row>
<Col span="6"> <Col span="6">
<FormItem label="紧急联系人" prop="contactName"> <FormItem label="紧急联系人" prop="contactName">
<Input v-model.trim="driverForm.contactName" type="text" /> <Input v-model.trim="driverForm.contactName" type="text" :disabled="readonly"/>
</FormItem> </FormItem>
</Col> </Col>
<Col span="6"> <Col span="6">
<FormItem label="紧急联系人电话" prop="contactPhone"> <FormItem label="紧急联系人电话" prop="contactPhone">
<Input v-model.trim="driverForm.contactPhone" type="text" /> <Input v-model.trim="driverForm.contactPhone" type="text" :disabled="readonly"/>
</FormItem> </FormItem>
</Col> </Col>
<Col span="6"> <Col span="6">
<FormItem label="现住址" prop="address"> <FormItem label="现住址" prop="address">
<Input v-model.trim="driverForm.address" type="text" /> <Input v-model.trim="driverForm.address" type="text" :disabled="readonly"/>
</FormItem> </FormItem>
</Col> </Col>
<Col span="6"> <Col span="6">
<FormItem label="网约车执照" prop="serviceLicense"> <FormItem label="网约车执照" prop="serviceLicense">
<Select v-model.trim="driverForm.serviceLicense"> <Select v-model.trim="driverForm.serviceLicense" :disabled="readonly">
<Option value="1" key="1"></Option> <Option value="1" key="1"></Option>
<Option value="0" key="0"></Option> <Option value="0" key="0"></Option>
</Select> </Select>
...@@ -59,7 +59,7 @@ ...@@ -59,7 +59,7 @@
<br/> <br/>
<Card :bordered="false"> <Card :bordered="false">
<p slot="title"><Icon type="ios-film-outline"></Icon> 身份证照片</p> <p slot="title"><Icon type="ios-film-outline"></Icon> 身份证照片</p>
<Row :gutter="20"> <Row :gutter="20" v-if="!readonly">
<Col span="12"> <Col span="12">
<Upload type="drag" action :before-upload="handleUploadFront" accept="image/*" > <Upload type="drag" action :before-upload="handleUploadFront" accept="image/*" >
<div style="padding: 20px 0"> <div style="padding: 20px 0">
...@@ -85,6 +85,15 @@ ...@@ -85,6 +85,15 @@
</Upload> </Upload>
</Col> </Col>
</Row> </Row>
<Row :gutter="20" v-if="readonly">
<Col span="24">
<div style="padding: 20px 0">
<img v-if="driverForm.frontFileUrl!=null" class="img" :src="driverForm.frontFileUrl" />
&nbsp;
<img v-if="driverForm.backFileUrl!=null" class="img" :src="driverForm.backFileUrl" />
</div>
</Col>
</Row>
</Card> </Card>
<br/> <br/>
<Card :bordered="false"> <Card :bordered="false">
...@@ -92,34 +101,34 @@ ...@@ -92,34 +101,34 @@
<Row> <Row>
<Col span="8"> <Col span="8">
<FormItem label="民族" prop="nation"> <FormItem label="民族" prop="nation">
<Input v-model.trim="driverForm.nation" type="text" /> <Input v-model.trim="driverForm.nation" type="text" :disabled="readonly"/>
</FormItem> </FormItem>
</Col> </Col>
<Col span="8"> <Col span="8">
<FormItem label="出生日期" prop="birthday"> <FormItem label="出生日期" prop="birthday">
<DatePicker v-model="driverForm.birthday" type="date" style="width: 100%" placeholder="请输入出生日期"></DatePicker> <DatePicker v-model="driverForm.birthday" type="date" style="width: 100%" placeholder="请输入出生日期" :disabled="readonly" />
</FormItem> </FormItem>
</Col> </Col>
<Col span="8"> <Col span="8">
<FormItem label="身份证地址" prop="originAddress"> <FormItem label="身份证地址" prop="originAddress">
<Input v-model.trim="driverForm.originAddress" type="text" /> <Input v-model.trim="driverForm.originAddress" type="text" :disabled="readonly"/>
</FormItem> </FormItem>
</Col> </Col>
</Row> </Row>
<Row> <Row>
<Col span="8"> <Col span="8">
<FormItem label="发证机关" prop="issueOrganization"> <FormItem label="发证机关" prop="issueOrganization">
<Input v-model.trim="driverForm.issueOrganization" type="text" /> <Input v-model.trim="driverForm.issueOrganization" type="text" :disabled="readonly"/>
</FormItem> </FormItem>
</Col> </Col>
<Col span="8"> <Col span="8">
<FormItem label="有效期-起" prop="identityValidPeriodStart"> <FormItem label="有效期-起" prop="identityValidPeriodStart">
<DatePicker v-model="driverForm.identityValidPeriodStart" type="date" style="width: 100%" placeholder="请输入开始日期"></DatePicker> <DatePicker v-model="driverForm.identityValidPeriodStart" type="date" style="width: 100%" placeholder="请输入开始日期" :disabled="readonly"/>
</FormItem> </FormItem>
</Col> </Col>
<Col span="8"> <Col span="8">
<FormItem label="有效期-止" prop="identityValidPeriodEnd"> <FormItem label="有效期-止" prop="identityValidPeriodEnd">
<DatePicker v-model="driverForm.identityValidPeriodEnd" type="date" style="width: 100%" placeholder="请输入结束日期"></DatePicker> <DatePicker v-model="driverForm.identityValidPeriodEnd" type="date" style="width: 100%" placeholder="请输入结束日期" :disabled="readonly"/>
</FormItem> </FormItem>
</Col> </Col>
</Row> </Row>
...@@ -127,7 +136,7 @@ ...@@ -127,7 +136,7 @@
<br/> <br/>
<Card :bordered="false"> <Card :bordered="false">
<p slot="title"><Icon type="ios-film-outline"></Icon> 驾驶证照片</p> <p slot="title"><Icon type="ios-film-outline"></Icon> 驾驶证照片</p>
<Row :gutter="20"> <Row :gutter="20" v-if="!readonly">
<Col span="12"> <Col span="12">
<Upload type="drag" action :before-upload="handleUploadMain" accept="image/*" > <Upload type="drag" action :before-upload="handleUploadMain" accept="image/*" >
<div style="padding: 20px 0"> <div style="padding: 20px 0">
...@@ -153,6 +162,15 @@ ...@@ -153,6 +162,15 @@
</Upload> </Upload>
</Col> </Col>
</Row> </Row>
<Row :gutter="20" v-if="readonly">
<Col span="24">
<div style="padding: 20px 0">
<img v-if="driverForm.mainFileUrl!=null" class="img" :src="driverForm.mainFileUrl" />
&nbsp;
<img v-if="driverForm.secondFileUrl!=null" class="img" :src="driverForm.secondFileUrl" />
</div>
</Col>
</Row>
</Card> </Card>
<br/> <br/>
<Card :bordered="false"> <Card :bordered="false">
...@@ -160,34 +178,34 @@ ...@@ -160,34 +178,34 @@
<Row> <Row>
<Col span="8"> <Col span="8">
<FormItem label="驾驶证号" prop="credentialNo"> <FormItem label="驾驶证号" prop="credentialNo">
<Input v-model.trim="driverForm.credentialNo" type="text" /> <Input v-model.trim="driverForm.credentialNo" type="text" :disabled="readonly"/>
</FormItem> </FormItem>
</Col> </Col>
<Col span="8"> <Col span="8">
<FormItem label="档案编号" prop="fileNo"> <FormItem label="档案编号" prop="fileNo">
<Input v-model.trim="driverForm.fileNo" type="text" /> <Input v-model.trim="driverForm.fileNo" type="text" :disabled="readonly"/>
</FormItem> </FormItem>
</Col> </Col>
<Col span="8"> <Col span="8">
<FormItem label="准驾车型" prop="drivingClass"> <FormItem label="准驾车型" prop="drivingClass">
<Input v-model.trim="driverForm.drivingClass" type="text" /> <Input v-model.trim="driverForm.drivingClass" type="text" :disabled="readonly"/>
</FormItem> </FormItem>
</Col> </Col>
</Row> </Row>
<Row> <Row>
<Col span="8"> <Col span="8">
<FormItem label="首次发证日期" prop="firstIssue"> <FormItem label="首次发证日期" prop="firstIssue">
<DatePicker v-model="driverForm.firstIssue" type="date" style="width: 100%" placeholder="请输入首次发证日期"></DatePicker> <DatePicker v-model="driverForm.firstIssue" type="date" style="width: 100%" placeholder="请输入首次发证日期" :disabled="readonly"/>
</FormItem> </FormItem>
</Col> </Col>
<Col span="8"> <Col span="8">
<FormItem label="有效期-起" prop="licenseValidPeriodStart"> <FormItem label="有效期-起" prop="licenseValidPeriodStart">
<DatePicker v-model="driverForm.licenseValidPeriodStart" type="date" style="width: 100%" placeholder="请输入开始日期"></DatePicker> <DatePicker v-model="driverForm.licenseValidPeriodStart" type="date" style="width: 100%" placeholder="请输入开始日期" :disabled="readonly"/>
</FormItem> </FormItem>
</Col> </Col>
<Col span="8"> <Col span="8">
<FormItem label="有效期-止" prop="licenseValidPeriodEnd"> <FormItem label="有效期-止" prop="licenseValidPeriodEnd">
<DatePicker v-model="driverForm.licenseValidPeriodEnd" type="date" style="width: 100%" placeholder="请输入结束日期"></DatePicker> <DatePicker v-model="driverForm.licenseValidPeriodEnd" type="date" style="width: 100%" placeholder="请输入结束日期" :disabled="readonly"/>
</FormItem> </FormItem>
</Col> </Col>
</Row> </Row>
...@@ -196,7 +214,7 @@ ...@@ -196,7 +214,7 @@
</div> </div>
<div slot="footer"> <div slot="footer">
<Button @click="visible = false">取消</Button> <Button @click="visible = false">取消</Button>
<Button @click="saveDriver" :loading="submitLoading" type="primary">确定</Button> <Button v-if="!readonly" @click="saveDriver" :loading="submitLoading" type="primary">确定</Button>
</div> </div>
</Modal> </Modal>
</div> </div>
......
export const columns = () => [
{
title: "序号",
key: "id",
align: "center",
width: 80,
},
{
title: "操作",
key: "action",
align: "center",
width: 120,
},
{
title: "时间",
key: "operationTime",
align: "center",
width: 180,
},
{
title: "操作人",
key: "operatorName",
align: "center",
width: 120,
},
{
title: "操作内容",
key: "content",
align: "center",
},
];
import store from "@/store";
const { dispatch } = store;
import { columns } from "./helper.js";
import { isInteger } from "@/libs/validator.js";
export default {
components: { },
data() {
return {
logLoading: false,
logDatas: [],
logColumns: [],
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,
code: null,
vehicle: null,
driver: null,
odograph: null,
odographEv: null,
startDate: null,
endDate: null,
depositAmount: null,
rentAmount: null,
leaseType: null,
remark: null,
files: [],
},
uploadList: []
};
},
computed: {
},
watch: {
visible(show) {
this.submitLoading = false;
this.contractForm.contractId = 0;
this.contractForm.code = null;
this.contractForm.vehicle = null;
this.contractForm.driver = null;
this.contractForm.odograph = null;
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;
this.contractForm.files = [];
this.uploadList = [];
if(show) {
this.selectTab = "contractTab";
const vo = this.contract.vehicleVo;
const vehicleInfo = vo.id + " / " + vo.plateNo + " / " + vo.color + " / " + vo.brandName + " / " + vo.model;
this.contractForm.contractId = this.contract.id;
this.contractForm.code = this.contract.code;
this.contractForm.vehicle = vehicleInfo;
this.contractForm.driver = this.contract.driverVo.name + " / " + this.contract.driverVo.phone;
this.contractForm.odograph = ""+this.contract.odograph;
this.contractForm.odographEv = ""+this.contract.odographEv;
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;
if(this.contract.files) {
this.contract.files.forEach(file => {
const item = {id: file.id, url: file.filePath, status: "finished"};
this.uploadList.push(item);
})
}
this.listLogs();
} else {
this.logDatas = [];
}
// console.log(this.uploadList);
// console.log(this.contractForm);
},
},
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;
},
saveVehicle() {
// 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;
});
},
listSources() {
dispatch("invoke/asyncListSource", {}).then(({ data }) => {
this.sources = data;
});
},
listLogs() {
const contractId = this.contract.id;
dispatch("invoke/asyncListLogs", contractId).then(({ data }) => {
this.logDatas = data;
});
}
},
mounted() {
this.logColumns = columns();
}
};
<template>
<div>
<Modal width="800" v-model="visible" title="车源合同 - 修改" fullscreen>
<Tabs v-model="selectTab">
<TabPane label="合同信息" icon="md-document" name="contractTab">
<div>
<Form ref="contractForm" :model="contractForm" :rules="contractFormRule" :label-width="80" label-colon>
<Row>
<Col span="8">
<FormItem label="车辆信息" prop="vehicle">
<Input v-model.trim="contractForm.vehicle" type="text" disabled />
</FormItem>
</Col>
<Col span="8">
<FormItem label="司机信息" prop="driver">
<Input v-model.trim="contractForm.driver" type="text" disabled />
</FormItem>
</Col>
<Col span="8">
<FormItem label="租赁方式" prop="leaseType">
<Input v-model.trim="contractForm.leaseType" type="text" :disabled="readonly"/>
</FormItem>
</Col>
</Row>
<Row>
<Col span="8">
<FormItem label="月租金" prop="rentAmount">
<Input v-model.trim="contractForm.rentAmount" type="number" :disabled="readonly"/>
</FormItem>
</Col>
<Col span="8">
<FormItem label="押金" prop="depositAmount">
<Input v-model.trim="contractForm.depositAmount" type="number" :disabled="readonly"/>
</FormItem>
</Col>
<Col span="8">
<FormItem label="反还押金" prop="returnDepositAmount">
<Input v-model.trim="contractForm.returnDepositAmount" type="number" disabled />
</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>
</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>
</Col>
</Row>
<Row>
<Col span="8">
<FormItem label="ev里程数" prop="odographEv">
<Input v-model.trim="contractForm.odographEv" type="number" :disabled="readonly"/>
</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>
</Col>
</Row>
<Row>
<Col span="24">
<FormItem label="验车照片">
<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;">
<div class="demo-upload-list-cover">
<Icon type="ios-eye-outline" @click.native="handleView(item)"></Icon>
<Icon type="ios-trash-outline" @click.native="handleRemove(item)" v-if="!readonly"></Icon>
</div>
</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>
</Form>
</div>
</TabPane>
<TabPane label="操作日志" icon="md-create" name="logTab">
<Table border
:loading="logLoading"
:columns="logColumns"
:data="logDatas"/>
</TabPane>
</Tabs>
<div slot="footer">
<Button @click="visible = false">取消</Button>
<Button @click="saveVehicle" :loading="submitLoading" type="primary" v-if="!readonly">确定</Button>
</div>
</Modal>
</div>
</template>
<script src="./index.js"/>
<style lang="less" scoped>
.img {
max-height:200px;
}
.demo-upload-list{
display: inline-block;
width: 60px;
height: 60px;
text-align: center;
line-height: 60px;
border: 1px solid transparent;
border-radius: 4px;
overflow: hidden;
background: #fff;
position: relative;
box-shadow: 0 1px 1px rgba(0,0,0,.2);
margin-right: 4px;
}
.demo-upload-list img{
width: 100%;
height: 100%;
}
.demo-upload-list-cover{
display: none;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: rgba(0,0,0,.6);
}
.demo-upload-list:hover .demo-upload-list-cover{
display: block;
}
.demo-upload-list-cover i{
color: #fff;
font-size: 20px;
cursor: pointer;
margin: 0 2px;
}
</style>
\ No newline at end of file
import store from "@/store";
const { dispatch } = store;
export default {
components: { },
props: {
"data": {},
"params": {},
showContract: Function,
showReturnDeposit: Function,
},
data() {
return {
}
},
methods: {
onClick(name) {
if(name === "edit") {
this.showContract(this.data, false);
}
if(name === "returnVehicle") {
}
if(name === "returnDeposit") {
this.showReturnDeposit(this.data);
}
if(name === "terminate") {
this.showConfirmTerminate();
}
},
showConfirmTerminate() {
this.$Modal.confirm({
title: '中止',
content: '确定中止当前合同?',
onOk: () => {
this.terminateContract();
}
});
},
terminateContract() {
const requestData = {
contractId: this.data.id,
}
dispatch("invoke/asyncTerminateContract", requestData).then(({ code }) => {
this.submitLoading = false;
if (code === 1) {
this.$Message.success("中止合同成功");
}
});
}
},
mounted() {
}
};
<template>
<Dropdown style="margin-left: 20px" transfer @on-click="onClick" trigger="click" v-if="params.edit||params.returnVehicle||params.returnDeposit||params.terminate">
<Button type="primary" size="small">
操作
<Icon type="ios-arrow-down"></Icon>
</Button>
<DropdownMenu slot="list">
<DropdownItem v-if="params.edit" name="edit">修改合同</DropdownItem>
<DropdownItem v-if="params.returnVehicle" name="returnVehicle">返还车辆</DropdownItem>
<DropdownItem v-if="params.returnDeposit" name="returnDeposit">返还押金</DropdownItem>
<DropdownItem v-if="params.terminate" name="terminate">中止合同</DropdownItem>
</DropdownMenu>
</Dropdown>
</template>
<script src="./index.js"></script>
import Actions from "./actions/index.vue";
export const columns = (search, showContract, showVehicle, showReturnDeposit, showDriver) => [
{
title: "合同ID",
key: "id",
align: "center",
minWidth: 50,
},
{
title: "合同编号",
align: "center",
minWidth: 180,
render: (h, { row }) => {
const { code } = row;
return h(
"a",
{
on: { click: () => {
showContract(row, true);
}}
},
code
);
}
},
{
title: "车牌号",
align: "center",
minWidth: 120,
render: (h, { row }) => {
const { vehicleVo } = row;
return h(
"a",
{
on: { click: () => {
showVehicle(vehicleVo);
}}
},
vehicleVo.plateNo
);
}
},
{
title: "品牌/型号",
align: "center",
minWidth: 100,
render(h, { row }) {
try {
const { vehicleVo } = row;
return h("span", `${vehicleVo.brandName} / ${vehicleVo.model}`);
} catch(e) {
console.log(e);
}
}
},
{
title: "司机姓名",
align: "center",
minWidth: 120,
render(h, { row }) {
try {
const { driverVo } = row;
return h(
"a",
{
on: { click: () => {
showDriver(driverVo);
}}
},
driverVo.name
);
} catch(e) {
console.log(e);
}
}
},
{
title: "司机电话",
key: "driverVo.phone",
align: "center",
minWidth: 120,
},
// {
// title: "车源联系人",
// align: "center",
// minWidth: 120,
// render(h, { row }) {
// try {
// const { sourceVo } = row;
// return h("div", {domProps: { innerHTML: sourceVo.contactName + "<br/>" + sourceVo.contactPhone}});
// } catch(e) {
// console.log(e);
// }
// }
// },
{
title: "里程",
key: "odograph",
align: "center",
minWidth: 100,
},
{
title: "ev里程",
key: "odographEv",
align: "center",
minWidth: 100,
},
{
title: "合同开始日期",
key: "startDate",
align: "center",
minWidth: 120,
},
{
title: "合同结束日期",
key: "endDate",
align: "center",
minWidth: 120,
},
{
title: "租赁方式",
key: "leaseType",
align: "center",
minWidth: 120,
},
{
title: "月租金",
key: "rentAmount",
align: "center",
minWidth: 100,
},
{
title: "押金金额",
key: "depositAmount",
align: "center",
minWidth: 100,
},
{
title: "已返还押金金额",
key: "returnDepositAmount",
align: "center",
minWidth: 100,
},
{
title: "押金状态",
align: "center",
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" }}, "部分返还");
}
}
},
{
title: "合同状态",
align: "center",
width: 120,
render(h, { row }) {
try {
const { status } = row;
return h("span", {style: {color: status == 1 ? 'green' : 'red' }}, status == 1 ? '有效' : '失效');
} catch(e) {
console.log(e);
}
}
},
{
title: "操作",
align: "center",
fixed: 'right',
width: 150,
render(h, { row }) {
const { status, depositStatus } = row;
const params = {
edit: status == 1 ? true : false,
terminate: status == 1 ? true : false,
returnDeposit: depositStatus == 1 || status == 1 ? false : true,
};
return h(Actions, {
props: {
data: row,
params: params,
showContract: showContract,
showReturnDeposit: showReturnDeposit,
}
});
}
},
];
import store from "@/store";
const { dispatch } = store;
import { columns } from "./helper.js";
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 EditDriver from "@/view/driver/edit/index.vue";
export default {
components: { SignContract, EditContract, EditVehicle, ReturnDeposit, EditDriver },
data() {
return {
loading: false,
columns: [],
plateNo: "",
status: null,
depositStatus: null,
type: 2,
changeCurrent: 1,
data: {
total:0,
current: 1,
records:[],
},
page: {
size: 10,
},
}
},
methods: {
search(current = 1) {
this.searchForm = {
type: this.type,
plateNo: this.plateNo,
status: this.status,
depositStatus: this.depositStatus,
};
this.loading = true
const initQuery = {
current,
size: this.page.size,
records: this.searchForm
};
dispatch("invoke/asyncListContract", {
...initQuery
}).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(contract, readonly) {
this.$refs.editContract.contract = contract;
this.$refs.editContract.readonly = readonly;
this.$refs.editContract.visible = true;
},
showReturnDeposit(contract) {
this.$refs.returnDeposit.contract = contract;
this.$refs.returnDeposit.visible = true;
},
showVehicle(vehicle) {
this.$refs.editVehicle.vehicle = vehicle;
this.$refs.editVehicle.readonly = true;
this.$refs.editVehicle.visible = true;
},
showDriver(driver) {
this.$refs.editDriver.driver = driver;
this.$refs.editDriver.readonly = true;
this.$refs.editDriver.visible = true;
}
},
mounted() {
this.columns = columns(this.search, this.showContract, this.showVehicle, this.showReturnDeposit, this.showDriver);
this.search();
}
};
<template>
<div>
<Card>
<Form :label-width="80" label-colon>
<Row :gutter="5">
<Col span="4">
<FormItem label="车牌号码" >
<Input v-model="plateNo" placeholder="Enter something..." clearable/>
</FormItem>
</Col>
<Col span="4">
<FormItem label="合同状态" >
<Select v-model.trim="status" clearable>
<Option :value="1" :key="1">有效</Option>
<Option :value="0" :key="0">无效</Option>
</Select>
</FormItem>
</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>
</FormItem>
</Col>
<Col span="2">
<Button @click="search()" type="primary"><Icon type="ios-search-outline" /> 查询</Button>
</Col>
<Col span="10">
<SignContract ref="signContract" @search="search" style="float:right" />
<EditContract ref="editContract" @search="search" />
<ReturnDeposit ref="returnDeposit" @search="search" />
<EditVehicle ref="editVehicle" />
<EditDriver ref="editDriver" />
</Col>
</Row>
</Form>
</Card>
<Card style="margin-top:10px">
<Table
border
:loading="loading"
:columns="columns"
:data="data.records"/>
<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
import store from "@/store";
const { dispatch } = store;
import { isInteger } from "@/libs/validator.js";
export default {
components: { },
data() {
return {
contract: null,
visible: false,
submitLoading: false,
mainUploadStatus: false,
secondUploadStatus: false,
returnFormRule: {
returnAmount: [{ required: true, message: "请输入本次退还押金", trigger: "blur" }, { validator: isInteger, trigger: "blur" }],
},
returnForm: {
plateNo: null,
depositStatus: null,
depositAmount: null,
returnDepositAmount: null,
returnAmount: null,
remark: null,
},
};
},
computed: {
},
watch: {
visible(show) {
this.submitLoading = false;
this.$refs.returnForm.resetFields();
this.returnForm.plateNo = null;
this.returnForm.depositStatus = null;
this.returnForm.depositAmount = null;
this.returnForm.returnDepositAmount = null;
this.returnForm.returnAmount = null;
this.returnForm.remark = null;
if(show) {
this.returnForm.plateNo = this.contract.vehicleVo.plateNo;
this.returnForm.depositAmount = this.contract.depositAmount;
this.returnForm.returnDepositAmount = this.contract.returnDepositAmount;
if (this.contract.depositStatus == 0) {
this.returnForm.depositStatus = "未返还";
} else if (this.contract.depositStatus == 1) {
this.returnForm.depositStatus = "全部返还";
} else if (this.contract.depositStatus == 2) {
this.returnForm.depositStatus = "部分返还";
}
}
},
},
methods: {
setAll() {
this.returnForm.returnAmount = this.returnForm.depositAmount - this.returnForm.returnDepositAmount;
},
saveReturnDeposit() {
this.$refs.returnForm.validate(valid => {
if (valid) {
const requestData = {
contractId: this.contract.id,
returnAmount: this.returnForm.returnAmount,
remark: this.returnForm.remark,
}
dispatch("invoke/asyncReturnDeposit", requestData).then(({ code }) => {
this.submitLoading = false;
if (code === 1) {
this.$Message.success("返还成功");
this.$emit("search");
this.visible = false;
}
});
}
});
},
},
mounted() {
}
};
<template>
<div>
<Modal width="600" v-model="visible" title="返还押金" >
<div>
<Form ref="returnForm" :model="returnForm" :rules="returnFormRule" :label-width="80" label-colon>
<Row>
<Col span="24">
<FormItem label="车牌号" prop="plateNo">
<Input v-model.trim="returnForm.plateNo" disabled />
</FormItem>
</Col>
</Row>
<Row>
<Col span="24">
<FormItem label="押金状态" prop="status">
<Input v-model.trim="returnForm.depositStatus" disabled />
</FormItem>
</Col>
</Row>
<Row :gutter="10">
<Col span="12">
<FormItem label="全部押金" prop="depositAmount">
<Input v-model.trim="returnForm.depositAmount" disabled />
</FormItem>
</Col>
<Col span="12">
<FormItem label="已还金额" prop="returnDepositAmount">
<Input v-model.trim="returnForm.returnDepositAmount" disabled />
</FormItem>
</Col>
</Row>
<Row :gutter="10">
<Col span="20">
<FormItem label="本次返还" prop="returnAmount">
<Input v-model.trim="returnForm.returnAmount" />
</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="returnForm.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
import store from "@/store";
const { dispatch } = store;
import { isInteger } from "@/libs/validator.js";
export default {
components: { },
data() {
return {
visible: false,
submitLoading: false,
contractFormRule: {
vehicleId: [{
type: "number",
required: true,
message: "请选择车辆",
trigger: "change"
}
],
driverId: [{
type: "number",
required: true,
message: "请选择司机",
trigger: "change"
}
],
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: {
type: 2,
vehicleId: null,
driverId: null,
odograph: null,
odographEv: null,
startDate: null,
endDate: null,
depositAmount: null,
rentAmount: null,
leaseType: null,
remark: null,
files: [],
},
vehicles: [],
drivers: [],
uploadList: [],
defaultList: [],
};
},
computed: {
},
watch: {
visible(show) {
this.submitLoading = false;
this.$refs.contractForm.resetFields();
if(show) {
this.listVehicles();
this.listDrivers();
}
},
},
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;
},
saveVehicle() {
this.$refs.contractForm.validate(valid => {
if (valid) {
this.uploadList.forEach(f => {
this.contractForm.files.push(f.id);
})
dispatch("invoke/asyncSignContract", this.contractForm).then(({ code }) => {
this.submitLoading = false;
if (code === 1) {
this.$Message.success("合同签订成功");
this.$emit("search");
this.visible = false;
}
});
}
});
},
listVehicles() {
dispatch("invoke/asyncListAllowRentVehicles").then(({ data }) => {
this.vehicles = data;
});
},
listDrivers() {
dispatch("invoke/asyncListAllDriver", {}).then(({ data }) => {
this.drivers = data;
});
}
},
mounted() {
}
};
<template>
<div>
<Button icon="ios-add" type="primary" @click="visible = true">司机签约</Button>
<Modal width="800" v-model="visible" title="司机合同 - 签约" fullscreen>
<div>
<Form ref="contractForm" :model="contractForm" :rules="contractFormRule" :label-width="80" label-colon>
<Row>
<Col span="8">
<FormItem label="车辆信息" prop="vehicleId">
<Select v-model.trim="contractForm.vehicleId" filterable>
<Option v-for="item in vehicles" :value="item.id" :key="item.id">{{ item.id + " / " + item.plateNo + " / " + item.color + " / " + item.brandName + " / " + item.model }}</Option>
</Select>
</FormItem>
</Col>
<Col span="8">
<FormItem label="司机信息" prop="driverId">
<Select v-model.trim="contractForm.driverId" filterable>
<Option v-for="item in drivers" :value="item.id" :key="item.id">{{ item.name + " / " + item.phone}}</Option>
</Select>
</FormItem>
</Col>
<Col span="8">
<FormItem label="租赁方式" prop="leaseType">
<Input v-model.trim="contractForm.leaseType" type="text" />
</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="depositAmount">
<Input v-model.trim="contractForm.depositAmount" type="number" />
</FormItem>
</Col>
<Col span="8">
<FormItem label="里程数" prop="odograph">
<Input v-model.trim="contractForm.odograph" type="number" />
</FormItem>
</Col>
</Row>
<Row>
<Col span="8">
<FormItem label="开始日期" prop="startDate">
<DatePicker v-model="contractForm.startDate" type="date" style="width: 100%" placeholder="请输入开始日期"></DatePicker>
</FormItem>
</Col>
<Col span="8">
<FormItem label="结束日期" prop="endDate">
<DatePicker v-model="contractForm.endDate" type="date" style="width: 100%" placeholder="请输入结束日期"></DatePicker>
</FormItem>
</Col>
<Col span="8">
<FormItem label="ev里程数" prop="odographEv">
<Input v-model.trim="contractForm.odographEv" type="number" />
</FormItem>
</Col>
</Row>
<Row>
<Col span="24">
<FormItem label="备注" prop="remark">
<Input v-model="contractForm.remark" type="textarea" :rows="4" placeholder="请输入备注" style="width: 100%" />
</FormItem>
</Col>
</Row>
<Row>
<Col span="24">
<FormItem label="验车照片">
<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;">
<div class="demo-upload-list-cover">
<Icon type="ios-eye-outline" @click.native="handleView(item)"></Icon>
<Icon type="ios-trash-outline" @click.native="handleRemove(item)"></Icon>
</div>
</template>
<template v-else>
<Spin size="small" fix ></Spin>
</template>
</div>
<Upload
ref="upload"
:show-upload-list="false"
:default-file-list="defaultList"
: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>
</Form>
</div>
<div slot="footer">
<Button @click="visible = false">取消</Button>
<Button @click="saveVehicle" :loading="submitLoading" type="primary">确定</Button>
</div>
</Modal>
</div>
</template>
<script src="./index.js"/>
<style lang="less" scoped>
.img {
max-height:200px;
}
.demo-upload-list{
display: inline-block;
width: 60px;
height: 60px;
text-align: center;
line-height: 60px;
border: 1px solid transparent;
border-radius: 4px;
overflow: hidden;
background: #fff;
position: relative;
box-shadow: 0 1px 1px rgba(0,0,0,.2);
margin-right: 4px;
}
.demo-upload-list img{
width: 100%;
height: 100%;
}
.demo-upload-list-cover{
display: none;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: rgba(0,0,0,.6);
}
.demo-upload-list:hover .demo-upload-list-cover{
display: block;
}
.demo-upload-list-cover i{
color: #fff;
font-size: 20px;
cursor: pointer;
margin: 0 2px;
}
</style>
\ No newline at end of file
...@@ -11,9 +11,9 @@ ...@@ -11,9 +11,9 @@
</div> </div>
</Menu> </Menu>
</Header> </Header>
<Layout style="position:absolute;top: 64px;bottom: 0px;left: 0px;right: 0px;"> <Layout style="position:absolute; top:64px; bottom:0px; left:0px; right:0px;">
<Sider hide-trigger :style="{background: '#fff'}"> <Sider hide-trigger :style="{background: '#fff'}">
<Menu theme="light" width="auto" :open-names="['1']" ref="menu" @on-select="onMenuSelect"> <Menu theme="light" width="auto" :open-names="['1']" ref="menu" @on-select="onMenuSelect" accordion>
<div v-for='(item, index) in routers' v-bind:key='index'> <div v-for='(item, index) in routers' v-bind:key='index'>
<div v-if='item.visable && !item.children'> <div v-if='item.visable && !item.children'>
<MenuItem :name="item.key" ><Icon :type="item.icon"></Icon> {{item.title}}</MenuItem> <MenuItem :name="item.key" ><Icon :type="item.icon"></Icon> {{item.title}}</MenuItem>
......
...@@ -41,19 +41,19 @@ export const columns = (search, showContract, showVehicle, showReturnDeposit) => ...@@ -41,19 +41,19 @@ export const columns = (search, showContract, showVehicle, showReturnDeposit) =>
); );
} }
}, },
// { {
// title: "品牌/型号", title: "品牌/型号",
// align: "center", align: "center",
// minWidth: 100, minWidth: 100,
// render(h, { row }) { render(h, { row }) {
// try { try {
// const { vehicleVo } = row; const { vehicleVo } = row;
// return h("span", `${vehicleVo.brandName} / ${vehicleVo.model}`); return h("span", `${vehicleVo.brandName} / ${vehicleVo.model}`);
// } catch(e) { } catch(e) {
// console.log(e); console.log(e);
// } }
// } }
// }, },
{ {
title: "车源名称", title: "车源名称",
align: "center", align: "center",
......
...@@ -8,8 +8,6 @@ export default { ...@@ -8,8 +8,6 @@ export default {
return { return {
visible: false, visible: false,
submitLoading: false, submitLoading: false,
mainUploadStatus: false,
secondUploadStatus: false,
contractFormRule: { contractFormRule: {
vehicleId: [{ vehicleId: [{
type: "number", type: "number",
......
...@@ -114,6 +114,7 @@ export default { ...@@ -114,6 +114,7 @@ export default {
this.vehicleForm.color = this.vehicle.color; this.vehicleForm.color = this.vehicle.color;
this.vehicleForm.type = this.vehicle.type; this.vehicleForm.type = this.vehicle.type;
this.vehicleForm.owner = this.vehicle.owner;
this.vehicleForm.address = this.vehicle.address; this.vehicleForm.address = this.vehicle.address;
this.vehicleForm.useCharacter = this.vehicle.useCharacter; this.vehicleForm.useCharacter = this.vehicle.useCharacter;
this.vehicleForm.licenseModel = this.vehicle.licenseModel; this.vehicleForm.licenseModel = this.vehicle.licenseModel;
......
<template> <template>
<div> <div>
<Modal width="800" v-model="visible" title="车辆信息 - 修改" fullscreen > <Modal width="800" v-model="visible" title="车辆信息 - 修改" fullscreen>
<div> <div>
<Form ref="vehicleForm" :model="vehicleForm" :rules="vehicleFormRule" :label-width="80"> <Form ref="vehicleForm" :model="vehicleForm" :rules="vehicleFormRule" :label-width="80">
<Card :bordered="false"> <Card :bordered="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