一、时间范围选择器两个字段转一个字段
<el-form-item label="证明有效期开始时间:">
<el-date-picker
v-model="validTime"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="yyyy-MM-dd">
</el-date-picker>
</el-form-item>
data() {
return {
validTime: [],
// 表单参数
form: {},
}
}
methods: {
// 表单重置
reset() {
this.form = {
id: null,
firstId: null,
qualificationName: null,
qualificationType: null,
qualificationGrade: null,
qualificationUrl: null,
validStartTime: null,
validEndTime: null
};
this.validTime = ['', ''];
this.resetForm("form");
},
/** 查看资质信息详情 */
viewDetail(row) {
this.reset();
console.log("=====" + row.id)
getFirstQualification(row.id).then(response => {
this.form = response.data;
this.view = true;
this.title = "客户资质信息详情";
this.validTime[0] = this.form.validStartTime;
this.validTime[1] = this.form.validEndTime;
});
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const id = row.id
getFirstQualification(row.id).then(response => {
this.form = response.data;
this.validTime = [this.form.validStartTime, this.form.validEndTime]
// this.validTime[0] = this.form.validStartTime;
// this.validTime[1] = this.form.validEndTime
alert(this.validTime);
this.open = true;
this.title = "修改客户资质信息";
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
let startTime = null;
let endTime = null;
if (this.validTime != null) {
console.log("this.validTime" + this.validTime);
startTime = this.validTime[0];
endTime = this.validTime[1];
}
this.form.validStartTime = startTime;
this.form.validEndTime = endTime;
if (valid) {
if (this.form.id != null) {
console.log(this.form,"123456789")
updateFirstQualification(this.form).then(response => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
this.form.firstId = this.firstIdScope;
console.log("新增的数据:" + this.form)
addFirstQualification(this.form).then(response => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
},
}
遇到的坑就是修改按钮,数据不能回显,###
- 正确写法:
this.validTime = [this.form.validStartTime, this.form.validEndTime] - 错误写法:
// this.validTime[0] = this.form.validStartTime;
// this.validTime[1] = this.form.validEndTime