feat: 移动端表单必填项标记红色 * 号 + 提交校验

- 客户单位/日期/纪要内容/计划拜访时间 标记 *
- 缺失必填项时 ElMessage.warning 提示
- CSS: .required-star { color: var(--vermilion); }

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
2026-07-12 20:28:54 +08:00
parent 6d1ccbb246
commit ff0a38a369
6 changed files with 18 additions and 10 deletions
+5 -3
View File
@@ -72,7 +72,8 @@ async function handleQuickCreate() {
}
async function handleSubmit() {
if (!form.value.customer_id) { ElMessage.warning('请选择客户'); return }
if (!form.value.customer_id) { ElMessage.warning('请选择客户单位'); return }
if (!form.value.plan_date) { ElMessage.warning('请选择计划拜访时间'); return }
submitLoading.value = true
try {
if (isEdit.value) {
@@ -117,7 +118,7 @@ async function handleDelete() {
<el-form label-position="top" class="editorial-form">
<el-form-item>
<template #label><span class="form-label">客户单位</span></template>
<template #label><span class="form-label">客户单位 <span class="required-star">*</span></span></template>
<el-select v-model="form.customer_id" filterable remote :remote-method="handleCustomerSearch" placeholder="搜索客户" style="width:100%">
<el-option v-for="c in customers" :key="c.id" :label="c.name" :value="c.id" />
<template #empty>
@@ -142,7 +143,7 @@ async function handleDelete() {
</el-form-item>
<el-form-item>
<template #label><span class="form-label">计划拜访时间</span></template>
<template #label><span class="form-label">计划拜访时间 <span class="required-star">*</span></span></template>
<el-date-picker v-model="form.plan_date" type="date" style="width:100%" />
</el-form-item>
@@ -234,4 +235,5 @@ async function handleDelete() {
.header-delete-btn:hover { background: var(--vermilion); color: #fff; }
.btn-loading { width: 16px; height: 16px; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin 0.6s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.required-star { color: var(--vermilion); font-weight: 700; }
</style>