第一次发布
This commit is contained in:
caolc
231
src/views/driver/vehicle/OilVehicleOwnerAdd.vue
Normal file
231
src/views/driver/vehicle/OilVehicleOwnerAdd.vue
Normal file
@@ -0,0 +1,231 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-row>
|
||||
<el-form
|
||||
:model="oilVehicleOwner"
|
||||
label-width="100px"
|
||||
:size="$store.getters.size"
|
||||
>
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>车辆基础信息</span>
|
||||
</div>
|
||||
|
||||
<el-row type="flex">
|
||||
<el-col>
|
||||
<el-form-item label="车牌号" prop="plateNumber">
|
||||
<el-input v-model="oilVehicleOwner.plateNumber" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col>
|
||||
<el-form-item label="车辆所属" prop="ownership">
|
||||
<el-select
|
||||
v-model="oilVehicleOwner.ownership"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-option label="个人" value="DRIVER" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col>
|
||||
<el-form-item label="司机" prop="customerId">
|
||||
<el-select
|
||||
v-model="oilVehicleOwner.customerId"
|
||||
style="width: 100%"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
reserve-keyword
|
||||
:remote-method="userRemoteMethod"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in userList"
|
||||
:key="item.id"
|
||||
:label="
|
||||
item.phone +
|
||||
' ( ' +
|
||||
(item.userName ? item.userName + '-' : '') +
|
||||
item.userCode +
|
||||
' ) '
|
||||
"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col>
|
||||
<el-form-item label="常用油品" prop="normsOilNumber">
|
||||
<el-select
|
||||
v-model="oilVehicleOwner.normsOilNumber"
|
||||
style="width: 100%"
|
||||
clearable
|
||||
filterable
|
||||
>
|
||||
<el-option
|
||||
v-for="item in oilList"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row type="flex">
|
||||
<el-col>
|
||||
<el-form-item label="车牌颜色" prop="plateColor">
|
||||
<el-select
|
||||
v-model="oilVehicleOwner.plateColor"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-option label="黄色" value="黄色" />
|
||||
<el-option label="蓝色" value="蓝色" />
|
||||
<el-option label="绿色" value="绿色" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col>
|
||||
<el-form-item label="燃油类型" prop="fuelType">
|
||||
<el-select
|
||||
v-model="oilVehicleOwner.fuelType"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-option label="汽油" value="汽油" />
|
||||
<el-option label="柴油" value="柴油" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col>
|
||||
<el-form-item label="油箱大小" prop="tankSize">
|
||||
<el-input v-model="oilVehicleOwner.tankSize" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col>
|
||||
<el-form-item label="车辆类型" prop="vehicleType">
|
||||
<el-select
|
||||
v-model="oilVehicleOwner.vehicleType"
|
||||
style="width: 100%"
|
||||
clearable
|
||||
filterable
|
||||
>
|
||||
<el-option
|
||||
v-for="item in vehicleTypeList"
|
||||
:key="item.typeCode"
|
||||
:label="item.typeName"
|
||||
:value="item.typeCode"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row type="flex">
|
||||
<el-col>
|
||||
<el-form-item label="禁用标识" prop="enableMark">
|
||||
<el-switch
|
||||
v-model="oilVehicleOwner.enableMark"
|
||||
active-color="#13ce66"
|
||||
inactive-color="#ff4949"
|
||||
:active-value="1"
|
||||
:inactive-value="0"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col />
|
||||
<el-col />
|
||||
</el-row>
|
||||
</el-card>
|
||||
<el-col :span="24" style="text-align: right">
|
||||
<el-button @click="close">取消</el-button>
|
||||
<el-button type="primary" @click="submit">提交</el-button>
|
||||
</el-col>
|
||||
</el-form>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import oilVehicleOwnerApi from "@/api/user/oilVehicleOwner";
|
||||
import sysCustomerInfoApi from "@/api/user/sysCustomerInfo";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
gridNum: {
|
||||
row: {
|
||||
gutter: 2,
|
||||
},
|
||||
cols: {
|
||||
xs: 24,
|
||||
sm: 24,
|
||||
md: 12,
|
||||
lg: 12,
|
||||
xl: 6,
|
||||
},
|
||||
},
|
||||
userList: [], // 司机集合
|
||||
vehicleTypeList: [], // 车辆类型集合
|
||||
oilList: [], // 油品集合
|
||||
oilVehicleOwner: {
|
||||
enableSource: "XOIL_OMS_WEB",
|
||||
createSource: "XOIL_OMS_WEB",
|
||||
updateSource: "XOIL_OMS_WEB",
|
||||
ownership: "DRIVER",
|
||||
enableMark: 1,
|
||||
customerId: null,
|
||||
companyId: null,
|
||||
},
|
||||
};
|
||||
},
|
||||
created() {
|
||||
oilVehicleOwnerApi.getVehicleType().then((res) => {
|
||||
this.vehicleTypeList = res.data;
|
||||
});
|
||||
oilVehicleOwnerApi.getOils().then((res) => {
|
||||
this.oilList = res.data;
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
submit() {
|
||||
this.save(this.oilVehicleOwner);
|
||||
},
|
||||
userRemoteMethod(value) {
|
||||
// 远程搜索
|
||||
if (value) {
|
||||
sysCustomerInfoApi.liekQuery(value).then((res) => {
|
||||
this.userList = res.data;
|
||||
});
|
||||
}
|
||||
},
|
||||
save() {
|
||||
// 保存
|
||||
oilVehicleOwnerApi.saveDispatch(this.oilVehicleOwner).then((res) => {
|
||||
this.$message.success(res.msg);
|
||||
this.$emit("closeDialog");
|
||||
this.$emit("getByPage");
|
||||
this.oilVehicleOwner = {};
|
||||
});
|
||||
},
|
||||
close() {
|
||||
this.$emit("closeDialog");
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.text {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.item {
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
.clearfix:before,
|
||||
.clearfix:after {
|
||||
display: table;
|
||||
content: "";
|
||||
}
|
||||
.clearfix:after {
|
||||
clear: both;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user