perf: project、module弹框样式调整及字段校验

1.未完成版
This commit is contained in:
chenjinsong
2019-12-27 17:53:17 +08:00
parent b12c79e4bd
commit 65a2e31304
21 changed files with 598 additions and 569 deletions

View File

@@ -3,39 +3,31 @@
<div class="right-box right-box-project" v-if="rightBox.show">
<!-- begin--顶部按钮-->
<div class="right-box-top-btns">
<div class="right-box-top-btn right-box-top-btn-full" @click="esc">
<div class="right-box-btn-icon">
<i class="el-icon-close"></i>
</div>
<span>{{$t('overall.esc')}}</span>
</div>
<div class="right-box-top-btn right-box-top-btn-full" @click="save">
<div class="right-box-btn-icon">
<i class="el-icon-edit-outline"></i>
</div>
<span>{{$t('overall.save')}}</span>
</div>
<div class="right-box-top-btn" v-if="project.id != ''" @click="del">
<div class="right-box-btn-icon">
<i class="el-icon-delete"></i>
</div>
<span>{{$t('overall.delete')}}</span>
</div>
<button type="button" v-if="project.id != ''" @click="del" class="nz-btn nz-btn-size-normal nz-btn-style-light">
<span class="top-tool-btn-txt">{{$t('overall.delete')}}</span>
</button>
<button type="button" @click="save" class="nz-btn nz-btn-size-normal nz-btn-style-normal">
<span class="top-tool-btn-txt">{{$t('overall.save')}}</span>
</button>
<button type="button" @click="esc" class="nz-btn nz-btn-size-normal nz-btn-style-light nz-btn-style-square">
<span class="top-tool-btn-txt"><i class="el-icon-close"></i></span>
</button>
</div>
<!-- end--顶部按钮-->
<!-- begin--标题-->
<div class="right-box-title">{{rightBox.title}}</div>
<!-- end--标题-->
<el-form :model="project" label-position="top" class="right-box-form">
<el-form-item :label='$t("project.project.projectName")' prop="name">
<el-input maxlength="64" show-word-limit v-model="project.name"></el-input>
</el-form-item>
<el-form-item :label='$t("project.project.description")' prop="remark">
<el-input type="textarea" maxlength="1024" show-word-limit v-model="project.remark"></el-input>
</el-form-item>
</el-form>
<el-scrollbar class="right-box-form-box">
<el-form class="right-box-form" :model="project" label-position="top" :rules="rules" ref="projectForm">
<el-form-item :label='$t("project.project.projectName")' prop="name">
<el-input size="mini" maxlength="64" show-word-limit v-model="project.name"></el-input>
</el-form-item>
<el-form-item :label='$t("project.project.description")'>
<el-input size="mini" type="textarea" maxlength="1024" show-word-limit v-model="project.remark"></el-input>
</el-form-item>
</el-form>
</el-scrollbar>
<!--&lt;!&ndash; begin&#45;&#45;表单&ndash;&gt;
<div class="right-box-form">
@@ -75,6 +67,11 @@
show: false,
title: '',
isCreate: false
},
rules: {
name: [
{required: true, message: this.$t('validate.required'), trigger: 'blur'}
]
}
}
},
@@ -90,27 +87,34 @@
/*保存*/
save() {
if (this.project.id) {
this.$put('project', this.project).then(response => {
if (response.code === 200) {
this.$message({duration: 1000, type: 'success', message: this.$t("tip.saveSuccess")});
this.$emit("reload");
this.rightBox.show = false;
this.$refs['projectForm'].validate((valid) => {
if (valid) {
if (this.project.id) {
this.$put('project', this.project).then(response => {
if (response.code === 200) {
this.$message({duration: 1000, type: 'success', message: this.$t("tip.saveSuccess")});
this.$emit("reload");
this.rightBox.show = false;
} else {
this.$message.error(response.msg);
}
});
} else {
this.$message.error(response.msg);
this.$post('project', this.project).then(response => {
if (response.code === 200) {
this.$message({duration: 1000, type: 'success', message: this.$t("tip.saveSuccess")});
this.$emit("reload");
this.rightBox.show = false;
} else {
this.$message.error(response.msg);
}
});
}
});
} else {
this.$post('project', this.project).then(response => {
if (response.code === 200) {
this.$message({duration: 1000, type: 'success', message: this.$t("tip.saveSuccess")});
this.$emit("reload");
this.rightBox.show = false;
} else {
this.$message.error(response.msg);
}
});
}
} else {
console.log('error submit!!');
return false;
}
});
},
/*删除*/