reservationapplication.vue
6.18 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
<template>
<div class="from_box" id="Step1">
<a-form :form="form" style="max-width: 800px; margin: 40px auto 0;">
<a-form-item label="1. 预计到达时间">
<font color="#6C6C6C" size="2">请在预约时间内，到地磅激活IC卡，并到门岗室点击允许入厂</font>
<j-date v-decorator="[ 'dateStr', validatorRules.dateStr]" placeholder="请选择预约时间" style="width: 100%"/>
</a-form-item>
<a-form-item label="2. 订单号">
<a-input placeholder="请输入订单号" v-decorator="[ 'order_number', validatorRules.order_number]"/>
</a-form-item>
<a-form-item label="3. 车辆预约物流形式">
<a-select placeholder="请选择预约形式" v-decorator="[ 'reservation_method', validatorRules.reservation_method]">
<a-select-option value="1">客户自提</a-select-option>
<a-select-option value="2">工厂送到</a-select-option>
</a-select>
</a-form-item>
<a-form-item label="4. 车牌号码">
<a-input placeholder="请输入车牌号码" v-decorator="[ 'car_number', validatorRules.car_number]"/>
</a-form-item>
<a-form-item label="5. 司机名称">
<a-input placeholder="请输入司机名称" v-decorator="['driver_name', validatorRules.driver_name]"/>
</a-form-item>
<a-form-item label="6. 司机手机号">
<a-input placeholder="请输入司机手机号" v-decorator="[ 'phone_number', validatorRules.phone_number]"/>
</a-form-item>
<a-form-item label="7. 车型">
<a-select placeholder="请选择车型" v-decorator="['vehicle', validatorRules.vehicle]">
<a-select-option value="1">箱型</a-select-option>
<a-select-option value="2">平板车</a-select-option>
</a-select>
</a-form-item>
<a-form-item label="8. 汽车吨位">
<a-input placeholder="请输入 汽车吨位" v-decorator="['vehicle_tonnage', validatorRules.vehicle_tonnage]"/>
</a-form-item>
<a-form-item label="9. 装车/卸车">
<a-select placeholder="请选择" v-decorator="['objective', validatorRules.objective]">
<a-select-option value="1">装车</a-select-option>
<a-select-option value="2">卸车</a-select-option>
</a-select>
</a-form-item>
<a-form-item label="10. 客户名称">
<a-input placeholder="请输入客户名称" v-decorator="['customer_name', validatorRules.customer_name]"/>
</a-form-item>
<a-form-item label="11. 月台组选择">
<a-select placeholder="请选择月台组" v-decorator="[ 'railway_platform', validatorRules.railway_platform]">
<a-select-option value="1">月台1</a-select-option>
<a-select-option value="2">月台2</a-select-option>
<a-select-option value="3">月台3</a-select-option>
</a-select>
</a-form-item>
<a-form-item label="12. 填表人电话">
<a-input placeholder="请输入填表人电话" v-decorator="[ 'submit_phone', validatorRules.submit_phone]"/>
</a-form-item>
<font color="#6C6C6C"> 注意事项：<br>
1、请在预约时间内拿提单到公司地磅激活IC卡，并在此期间内到门岗室（入厂登记处）点击允许入厂，在预约时间外后激活卡，预约无效。<br>
2. 如要修改预约信息或取消预约，请扫描预约更改二维码填写信息或者拨打电话：0731-88289175，然后再重新预约。</font>
<br>
</a-form>
<a-form-item :wrapperCol="{span: 19, offset: 5}">
<a-button type="primary" @click="onSubmit()">下一步</a-button>
</a-form-item>
</div>
</template>
<script>
import JDate from '@/components/jeecg/JDate.vue'
import { examine } from '@api/api'
export default {
name: 'Step1',
components: {
JDate
},
data() {
return {
dateStr: '',
formMess: {
order_number: '',
reservation_method: '',
car_number: '',
driver_name: '',
phone_number: '',
vehicle: '',
vehicle_tonnage: '',
objective: '',
customer_name: '',
railway_platform: '',
submit_phone: ''
},
model: {},
form: this.$form.createForm(this),
validatorRules: {
order_number: {
rules: [
{ required: true, message: '请输入订单号!' },
{ min: 2, max: 30, message: '长度在 2 到 30 个字符', trigger: 'blur' }
]
},
phone_number:
{
rules: [{required: true, message: '请输入手机号!'}, {validator: this.validatePhone}],
},
reservation_method:
{
rules: [
{ required: true, message: '请选择物料形式!' },
]
},
submit_phone:
{
rules: [{required: true, message: '请输入手机号!'}, {validator: this.validatePhone}],
},
dateStr:{
rules: [
{ required: true, message: '请选择预约时间!' },
]
}
}
}
},
methods: {
onSubmit() {
this.form.validateFields((err, values) => {
let formData = Object.assign(this.model, values);
console.log("控制台输出内容--------------------:"+err)
console.log("控制台输出内容2--------------------:"+values)
examine(formData)
})
},
validatePhone(rule, value, callback){
if(!value){
callback()
}else{
if(new RegExp(/^1[3|4|5|7|8|9][0-9]\d{8}$/).test(value)){
var params = {
tableName: 'sys_user',
fieldName: 'phone',
fieldVal: value,
dataId: this.userId
};
duplicateCheck(params).then((res) => {
if (res.success) {
callback()
} else {
callback("手机号已存在!")
}
})
}else{
callback("请输入正确格式的手机号码!");
}
}
},
}
}
</script>
<style scoped>
</style>