2025-07-19 20:00:08 +08:00

117 lines
2.9 KiB
Vue

<template>
<view class="add-container">
<common-header title="新增酒厂" theme="distiller" @back="goBack" />
<view class="add-content">
<uni-forms ref="form" :model="formData" :rules="rules" label-width="120">
<uni-forms-item label="酒厂名称" required name="name">
<uni-easyinput v-model="formData.name" placeholder="请输入酒厂名称" />
</uni-forms-item>
<uni-forms-item label="酒厂地址" name="address">
<uni-easyinput v-model="formData.address" placeholder="请输入酒厂地址" />
</uni-forms-item>
<uni-forms-item label="联系人" name="contact">
<uni-easyinput v-model="formData.contact" placeholder="请输入联系人" />
</uni-forms-item>
<uni-forms-item label="联系电话" name="phone">
<uni-easyinput v-model="formData.phone" placeholder="请输入联系电话" />
</uni-forms-item>
<uni-forms-item label="酒厂描述" name="description">
<uni-easyinput
v-model="formData.description"
type="textarea"
placeholder="请输入酒厂描述"
:auto-height="true" />
</uni-forms-item>
</uni-forms>
<view class="form-actions">
<uni-button type="default" @click="goBack">取消</uni-button>
<uni-button type="primary" @click="submitForm" :loading="submitting">保存</uni-button>
</view>
</view>
</view>
</template>
<script>
import CommonHeader from '@/components/common-header/common-header.vue'
export default {
name: 'DistillerAdd',
components: {
CommonHeader
},
data() {
return {
formData: {
name: '',
address: '',
contact: '',
phone: '',
description: ''
},
rules: {
name: {
rules: [{ required: true, errorMessage: '请输入酒厂名称' }]
}
},
submitting: false
}
},
methods: {
async submitForm() {
try {
// 表单验证
const valid = await this.$refs.form.validate()
if (!valid) return
this.submitting = true
// TODO: Replace with actual API call
const response = await this.$http.post('/brewery/distiller', this.formData)
this.$modal.showToast('保存成功')
// 返回上一页
setTimeout(() => {
uni.navigateBack()
}, 1500)
} catch (error) {
console.error('保存失败:', error)
this.$modal.showToast('保存失败')
} finally {
this.submitting = false
}
},
goBack() {
uni.navigateBack()
}
}
}
</script>
<style lang="scss" scoped>
.add-container {
min-height: 100vh;
background: #f5f7fa;
}
.add-content {
padding: 20rpx;
}
.form-actions {
display: flex;
gap: 20rpx;
margin-top: 60rpx;
padding: 0 20rpx;
}
</style>