<template>
|
<div class="zhipaiForm-wrap">
|
<el-dialog
|
:before-close="handleClose"
|
title="指派任务"
|
:visible.sync="dialogVisible"
|
width="35%">
|
<div class="zhipaiForm-main">
|
<el-form :model="zhipaiForm" :rules="zhipaiRules" ref="zhipaiForm" label-width="100px" class="demo-ruleForm">
|
<el-form-item label="车牌号：" prop="carNo">
|
<el-input v-model="zhipaiForm.carNo"></el-input>
|
</el-form-item>
|
<el-form-item label="车牌颜色：" prop="color">
|
<el-input v-model="zhipaiForm.color"></el-input>
|
</el-form-item>
|
<el-form-item label="车辆类型：" prop="carType">
|
<el-input v-model="zhipaiForm.carType"></el-input>
|
</el-form-item>
|
<el-form-item label="违章类型：" prop="violationTypeId">
|
<!--<el-input v-model="zhipaiForm.violationTypeId"></el-input>-->
|
<el-select v-model="zhipaiForm.violationTypeId" placeholder="请选择">
|
<el-option
|
v-for="item in weizhangOptions"
|
:key="item.id"
|
:label="item.content"
|
:value="item.id">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="位置：" prop="address">
|
<el-input v-model="zhipaiForm.address"></el-input>
|
</el-form-item>
|
<el-form-item label="执行人：" prop="userId">
|
<!--<el-input v-model="zhipaiForm.userId"></el-input>-->
|
<el-select v-model="zhipaiForm.userId" placeholder="请选择">
|
<el-option
|
v-for="item in zhixingrenOptions"
|
:key="item.id"
|
:label="item.name"
|
:value="item.id">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="备注：" prop="remark">
|
<el-input type="textarea" v-model="zhipaiForm.remark"></el-input>
|
</el-form-item>
|
<el-form-item>
|
<div class="fabuBtn">
|
<el-button type="primary" @click="submitForm('zhipaiForm')">发布</el-button>
|
</div>
|
</el-form-item>
|
</el-form>
|
</div>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
export default {
|
name: "zhipaiForm",
|
data() {
|
return {
|
pageConfig:{
|
saveData:this.$systemconfig.basePath + '/ticket/save2',
|
weizhangData:this.$systemconfig.basePath + '/violationType/findAll',
|
zhixingrenData:this.$systemconfig.basePath + '/user/findAll',
|
},
|
weizhangOptions:[],
|
zhixingrenOptions:[],
|
dialogVisible:false,
|
zhipaiForm:{
|
carNo:'',
|
color:'',
|
carType:'',
|
violationTypeId:'',
|
address:'',
|
userId:'',
|
type:1,
|
remark:''
|
},
|
zhipaiRules:{
|
carNo: [
|
{ required: true, message: '请输入车牌号', trigger: 'blur' },
|
],
|
color: [
|
{ required: true, message: '请输入车辆颜色', trigger: 'blur' },
|
],
|
carType: [
|
{ required: true, message: '请输入车辆类型', trigger: 'blur' },
|
],
|
violationTypeId: [
|
{ required: true, message: '请选择违章类型', trigger: 'change' },
|
],
|
address: [
|
{ required: true, message: '请输入位置', trigger: 'blur' },
|
],
|
userId: [
|
{ required: true, message: '请选择执行人', trigger: 'change' },
|
],
|
}
|
}
|
},
|
methods:{
|
handleClose() {
|
this.dialogVisible = false
|
this.$refs.zhipaiForm.resetFields();
|
},
|
initData() {
|
this.dialogVisible = true
|
this.$byutil.postData4(this,this.pageConfig.weizhangData,null,res => {
|
this.weizhangOptions = res.data
|
})
|
this.$byutil.postData4(this,this.pageConfig.zhixingrenData,null,res => {
|
this.zhixingrenOptions = res.data
|
})
|
},
|
submitForm(formName) {
|
this.$refs[formName].validate((valid) => {
|
if(valid) {
|
this.$byutil.postData(this,this.pageConfig.saveData,this.zhipaiForm,res => {
|
this.$refs[formName].resetFields();
|
this.dialogVisible = false
|
this.$message.success(res.msg)
|
})
|
}
|
})
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss">
|
.zhipaiForm-wrap{
|
.el-dialog__title{
|
color: #fff;
|
}
|
.el-dialog__wrapper{
|
background:rgba(0,0,0,0.6);
|
}
|
.el-dialog, .el-pager li{
|
background:rgba(0,0,0,0.5);
|
}
|
.el-form-item__label{
|
color: #00fff6;
|
}
|
.el-input__inner{
|
background:transparent;
|
color: #fff;
|
border: 1px solid #00fff6;
|
}
|
.el-textarea__inner{
|
background:transparent;
|
color: #fff;
|
border: 1px solid #00fff6;
|
}
|
.fabuBtn{
|
.el-button{
|
width: 1.0417rem /* 200/192 */;
|
border:1px solid #00fff6;
|
background:transparent;
|
}
|
}
|
.el-select{
|
width: 100%;
|
}
|
}
|
</style>
|
|
<style lang="scss" scoped>
|
.fabuBtn{
|
display: flex;
|
justify-content: center;
|
}
|
</style>
|
