feat(order): 更新订单页面表单内容与提示信息
- 修改页面提示标题为"欢迎留言" - 简化表单字段,移除产品选择、参考链接及文件上传功能 - 调整表单布局和标签文案,统一使用"留言标题"和"留言内容" - 更新内容输入框的占位符文本 - 修改必填项验证提示信息,适配新的留言场景
This commit is contained in:
@@ -11,10 +11,10 @@
|
||||
<template #extra>
|
||||
</template>
|
||||
<el-card shadow="hover" class="my-5 sm:my-10 sm:px-2">
|
||||
<div class="grid grid-cols-1 sm:grid-cols-3 gap-8">
|
||||
<div class="grid grid-cols-1 sm:grid-cols-4 gap-8">
|
||||
<div class="col-span-2">
|
||||
<div class="my-2">
|
||||
<el-alert title="填写您的需求,为您量身定制." type="warning"/>
|
||||
<el-alert title="欢迎留言" type="warning"/>
|
||||
</div>
|
||||
<el-form
|
||||
ref="formRef"
|
||||
@@ -24,57 +24,13 @@
|
||||
label-position="left"
|
||||
status-icon
|
||||
>
|
||||
<el-form-item :label="$t('order.title')" prop="title" class="hover:bg-gray-50 p-2">
|
||||
<el-select
|
||||
v-model="form.title"
|
||||
filterable
|
||||
placeholder="选择产品"
|
||||
@change="onWebsite"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in siteList"
|
||||
:key="item.websiteId"
|
||||
:label="item.websiteName"
|
||||
:value="item.websiteId"
|
||||
>
|
||||
<div class="flex justify-between">
|
||||
<span>{{ item.websiteName }}</span>
|
||||
<span class="text-gray-300">
|
||||
{{ `${item.websiteCode}.websoft.top` }}
|
||||
</span>
|
||||
</div>
|
||||
</el-option>
|
||||
</el-select>
|
||||
<el-form-item label="留言标题" class="hover:bg-gray-50 p-2" prop="reference">
|
||||
<el-input v-model="form.title" placeholder="留言标题"/>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('order.content')" prop="content" class="hover:bg-gray-50 p-2">
|
||||
<el-input type="textarea" :rows="5" cols="80" v-model="form.content"
|
||||
placeholder="请填写您的项目需求"/>
|
||||
placeholder="请填写留言内容"/>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('order.reference')" class="hover:bg-gray-50 p-2" prop="reference">
|
||||
<el-input v-model="form.reference" :placeholder="$t('order.reference')"/>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('order.files')" class="hover:bg-gray-50 p-2" prop="reference">
|
||||
<el-upload
|
||||
v-model:file-list="files"
|
||||
:headers="{
|
||||
Authorization: token,
|
||||
TenantId: 5,
|
||||
}"
|
||||
:limit="2"
|
||||
:on-preview="handlePictureCardPreview"
|
||||
:on-remove="filesRemove"
|
||||
:on-success="filesOnSuccess"
|
||||
action="https://server.gxbsnx.com/api/oss/upload"
|
||||
list-type="picture-card"
|
||||
>
|
||||
<el-icon>
|
||||
<Plus/>
|
||||
</el-icon>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
<template v-if="token">
|
||||
|
||||
</template>
|
||||
<template v-if="!token">
|
||||
<el-form-item :label="$t('order.realName')" class="hover:bg-gray-50 p-2" prop="realName">
|
||||
<el-input v-model="form.realName" :placeholder="$t('order.realName')"/>
|
||||
@@ -106,8 +62,18 @@
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="hidden-sm-and-down">
|
||||
<el-image class="py-2" v-if="page.icon" :src="page.icon"/>
|
||||
<div class="w-full col-span-2">
|
||||
<div class="p-3">
|
||||
<div class="w-full text-lg font-bold">
|
||||
最新留言
|
||||
</div>
|
||||
<div class="likes-list my2 w-full">
|
||||
<div v-for="(item,index) in orders" :key="index" class="item flex justify-between bg-gray-50 p-4 mb-2">
|
||||
<div class="text-sm">{{ item.content }}</div>
|
||||
<div class="text-sm text-gray-400">{{ item.createTime }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
@@ -127,7 +93,7 @@ import {useLayout, usePage, useUser} from "~/composables/configState";
|
||||
import {getNavIdByParamsId} from "~/utils/common";
|
||||
import type {CmsOrder} from "~/api/cms/cmsOrder/model";
|
||||
import useFormData from "~/utils/use-form-data";
|
||||
import {addCmsOrder} from "~/api/cms/cmsOrder";
|
||||
import {addCmsOrder, pageCmsOrder } from "~/api/cms/cmsOrder";
|
||||
import {getCaptcha} from "~/api/passport/login";
|
||||
import {getCmsNavigation, listCmsNavigation} from "~/api/cms/cmsNavigation";
|
||||
import {listCmsWebsite, pageCmsWebsiteAll} from "~/api/cms/cmsWebsite";
|
||||
@@ -157,6 +123,7 @@ const filesStr = ref<string[]>([])
|
||||
const captcha = ref('');
|
||||
const text = ref<string>('');
|
||||
const loading = ref(false)
|
||||
const orders = ref<CmsOrder[]>([])
|
||||
|
||||
|
||||
const {form, resetFields} = useFormData<CmsOrder>({
|
||||
@@ -230,7 +197,7 @@ const rules = reactive<FormRules<CmsOrder>>({
|
||||
{required: true, message: '请输入联系人姓名', trigger: 'blur'},
|
||||
],
|
||||
content: [
|
||||
{required: true, message: '请输入您的开发需求', trigger: 'blur'},
|
||||
{required: true, message: '请输入您的留言内容', trigger: 'blur'},
|
||||
]
|
||||
})
|
||||
|
||||
@@ -287,6 +254,11 @@ const reload = async () => {
|
||||
form.email = user.value.email
|
||||
}
|
||||
|
||||
// 留言列表
|
||||
pageCmsOrder({isSettled: true}).then(response => {
|
||||
orders.value = response?.list || []
|
||||
})
|
||||
|
||||
changeCaptcha()
|
||||
} catch (error) {
|
||||
console.error('Failed to load page data:', error)
|
||||
|
||||
Reference in New Issue
Block a user