提交 e07d0d6f 作者: 宇宙超人

产销发布页面修改,选择器去掉input事件,app端下载文件方法修改

上级 7ef27b6c
<template> <template>
<u-modal :show="show" :title="dialogTitle" :showConfirmButton="false" :showCancelButton="false" <u-modal :show="show" :title="dialogTitle" :showConfirmButton="false" :showCancelButton="false" @close="handleClose"
@close="handleClose" :closeOnClickOverlay="false"> :closeOnClickOverlay="false">
<view class="dialog-content"> <view class="dialog-content">
<u-form :model="formData" :rules="rules" ref="formRef" label-width="180rpx"> <u-form :model="formData" :rules="rules" ref="formRef" label-width="180rpx">
<!-- 设备基本信息 --> <!-- 设备基本信息 -->
...@@ -11,8 +11,13 @@ ...@@ -11,8 +11,13 @@
</u-form-item> </u-form-item>
<u-form-item label="设备类型" prop="deviceType" required> <u-form-item label="设备类型" prop="deviceType" required>
<u-input v-model="formData.deviceTypeText" placeholder="请选择设备类型" border="bottom" <view class="address-display" @click="showDeviceTypePicker = true">
@click="showDeviceTypePicker = true" /> <text :class="{ 'placeholder-text': !formData.deviceTypeText }">
{{ formData.deviceTypeText || '请选择设备类型' }}
</text>
</view>
<!-- <u-input v-model="formData.deviceTypeText" placeholder="请选择设备类型" border="bottom"
@click="showDeviceTypePicker = true" /> -->
</u-form-item> </u-form-item>
<u-form-item label="设备标识" prop="deviceIdentifier" required> <u-form-item label="设备标识" prop="deviceIdentifier" required>
...@@ -21,7 +26,8 @@ ...@@ -21,7 +26,8 @@
<!-- 操作按钮 --> <!-- 操作按钮 -->
<view class="dialog-buttons"> <view class="dialog-buttons">
<u-button type="primary" @click="handleSubmit" :loading="loading" size="normal" class="submit-btn" color="var(--fui-color-success)"> <u-button type="primary" @click="handleSubmit" :loading="loading" size="normal" class="submit-btn"
color="var(--fui-color-success)">
{{ submitButtonText }} {{ submitButtonText }}
</u-button> </u-button>
<u-button @click="handleClose" size="normal" class="cancel-btn">取消</u-button> <u-button @click="handleClose" size="normal" class="cancel-btn">取消</u-button>
...@@ -100,7 +106,7 @@ const rules = { ...@@ -100,7 +106,7 @@ const rules = {
{ min: 2, max: 50, message: '设备名称长度在2-50个字符之间', trigger: 'blur' } { min: 2, max: 50, message: '设备名称长度在2-50个字符之间', trigger: 'blur' }
], ],
deviceType: [ deviceType: [
{ required: true, message: '请选择设备类型',type:'number', trigger: 'change' } { required: true, message: '请选择设备类型', type: 'number', trigger: 'change' }
], ],
deviceIdentifier: [ deviceIdentifier: [
{ required: true, message: '请输入设备唯一标识', trigger: 'blur' }, { required: true, message: '请输入设备唯一标识', trigger: 'blur' },
...@@ -136,7 +142,7 @@ const resetFormData = () => { ...@@ -136,7 +142,7 @@ const resetFormData = () => {
formData.deviceType = '' formData.deviceType = ''
formData.deviceTypeText = '' formData.deviceTypeText = ''
formData.deviceIdentifier = '' formData.deviceIdentifier = ''
// 清除验证状态 // 清除验证状态
if (formRef.value) { if (formRef.value) {
formRef.value.resetFields() formRef.value.resetFields()
...@@ -146,11 +152,11 @@ const resetFormData = () => { ...@@ -146,11 +152,11 @@ const resetFormData = () => {
// 加载编辑数据 // 加载编辑数据
const loadEditData = () => { const loadEditData = () => {
if (!props.editData) return if (!props.editData) return
formData.deviceName = props.editData.deviceName || '' formData.deviceName = props.editData.deviceName || ''
formData.deviceType = props.editData.deviceType || '' formData.deviceType = props.editData.deviceType || ''
formData.deviceIdentifier = props.editData.deviceIdentifier || '' formData.deviceIdentifier = props.editData.deviceIdentifier || ''
// 设置设备类型文本 // 设置设备类型文本
if (props.editData.deviceType) { if (props.editData.deviceType) {
const typeOption = deviceTypeOptions.value.find(item => item.value === props.editData.deviceType) const typeOption = deviceTypeOptions.value.find(item => item.value === props.editData.deviceType)
...@@ -181,14 +187,14 @@ const handleSubmit = async () => { ...@@ -181,14 +187,14 @@ const handleSubmit = async () => {
if (!valid) { if (!valid) {
return return
} }
loading.value = true loading.value = true
// 准备提交数据 // 准备提交数据
const submitData = { const submitData = {
...formData ...formData
} }
// 根据 editData 判断是新增还是修改 // 根据 editData 判断是新增还是修改
let result let result
if (props.editData && props.editData.id) { if (props.editData && props.editData.id) {
...@@ -207,11 +213,11 @@ const handleSubmit = async () => { ...@@ -207,11 +213,11 @@ const handleSubmit = async () => {
uni.showToast({ title: '操作成功', icon: 'success' }) uni.showToast({ title: '操作成功', icon: 'success' })
emit('update:show', false) emit('update:show', false)
emit('submitSuccess') emit('submitSuccess')
} catch (error) { } catch (error) {
console.log('提交失败:', error) console.log('提交失败:', error)
uni.showToast({ uni.showToast({
title: '操作失败', title: '操作失败',
icon: 'none', icon: 'none',
duration: 2000 duration: 2000
}) })
...@@ -256,17 +262,19 @@ defineExpose({ ...@@ -256,17 +262,19 @@ defineExpose({
display: flex; display: flex;
gap: 20rpx; gap: 20rpx;
margin-top: 40rpx; margin-top: 40rpx;
.submit-btn { .submit-btn {
flex: 1; flex: 1;
::v-deep .u-button { ::v-deep .u-button {
background-color: #5DB66F; background-color: #5DB66F;
border-color: #5DB66F; border-color: #5DB66F;
} }
} }
.cancel-btn { .cancel-btn {
flex: 1; flex: 1;
::v-deep .u-button { ::v-deep .u-button {
background-color: #fff; background-color: #fff;
color: #666; color: #666;
...@@ -300,6 +308,27 @@ defineExpose({ ...@@ -300,6 +308,27 @@ defineExpose({
min-width: 0; min-width: 0;
} }
} }
.address-display {
display: flex;
justify-content: space-between;
align-items: center;
padding: 12rpx 18rpx;
background-color: transparent;
border-bottom: 2rpx solid #e4e7ed;
border-radius: 0;
cursor: pointer;
width: 100%;
text {
flex: 1;
font-size: 28rpx;
color: #333;
}
.placeholder-text {
color: #c0c4cc;
}
}
::v-deep .u-form-item__body__left__content__required { ::v-deep .u-form-item__body__left__content__required {
position: static; position: static;
...@@ -340,11 +369,11 @@ defineExpose({ ...@@ -340,11 +369,11 @@ defineExpose({
border-radius: 20rpx; border-radius: 20rpx;
padding: 20rpx 0rpx; padding: 20rpx 0rpx;
} }
.u-modal__header { .u-modal__header {
border-bottom: 2rpx solid #f0f0f0; border-bottom: 2rpx solid #f0f0f0;
padding: 30rpx; padding: 30rpx;
.u-modal__header__title { .u-modal__header__title {
font-size: 32rpx; font-size: 32rpx;
font-weight: 600; font-weight: 600;
......
...@@ -8,9 +8,12 @@ ...@@ -8,9 +8,12 @@
<u-input v-model="formData.baseName" placeholder="请输入基地名称" border="bottom" /> <u-input v-model="formData.baseName" placeholder="请输入基地名称" border="bottom" />
</u-form-item> </u-form-item>
<u-form-item label="基地类型" prop="baseType" required> <u-form-item label="基地类型" prop="baseType" required class="clickable" @click="show.farmType = true">
<u-input v-model="formData.baseTypeText" placeholder="请选择基地类型" border="bottom" <view class="address-display">
@click="show.farmType = true" /> <text :class="{'placeholder-text': !formData.baseTypeText}">
{{ formData.baseTypeText || '请选择基地类型' }}
</text>
</view>
</u-form-item> </u-form-item>
<u-form-item label="规模" prop="scale" required> <u-form-item label="规模" prop="scale" required>
...@@ -24,9 +27,12 @@ ...@@ -24,9 +27,12 @@
<!-- 地址信息 --> <!-- 地址信息 -->
<view class="section-title">地址信息</view> <view class="section-title">地址信息</view>
<u-form-item label="省市区" prop="province" required> <u-form-item label="省市区" prop="province" required class="clickable" @click="show.address = true">
<u-input v-model="formData.province" placeholder="请选择省市区" border="bottom" <view class="address-display">
@click="show.address = true" /> <text :class="{'placeholder-text': !formData.province}">
{{ formData.province || '请选择省市区' }}
</text>
</view>
</u-form-item> </u-form-item>
<u-form-item label="详细地址" prop="detailedAddress" required> <u-form-item label="详细地址" prop="detailedAddress" required>
...@@ -464,10 +470,18 @@ onLoad((pageOptions) => { ...@@ -464,10 +470,18 @@ onLoad((pageOptions) => {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
padding: 20rpx 0; padding: 12rpx 18rpx;
background-color: transparent; background-color: transparent;
border-bottom: 2rpx solid #e4e7ed; border-bottom: 2rpx solid #e4e7ed;
border-radius: 0; border-radius: 0;
cursor: pointer;
width: 100%;
text {
flex: 1;
font-size: 28rpx;
color: #333;
}
.placeholder-text { .placeholder-text {
color: #c0c4cc; color: #c0c4cc;
...@@ -572,4 +586,24 @@ onLoad((pageOptions) => { ...@@ -572,4 +586,24 @@ onLoad((pageOptions) => {
} }
} }
} }
// 表单项点击区域样式
::v-deep .u-form-item {
&.clickable {
cursor: pointer;
.u-form-item__body__right {
position: relative;
&:after {
content: '';
position: absolute;
top: 0;
left: -20rpx;
right: -20rpx;
bottom: 0;
}
}
}
}
</style> </style>
<script setup lang="ts"> <script setup lang="ts">
import { reactive } from 'vue' import { reactive } from 'vue'
import { onPullDownRefresh, onHide, onUnload } from '@dcloudio/uni-app' import { onPullDownRefresh } from '@dcloudio/uni-app'
import dayjs from 'dayjs' import dayjs from 'dayjs'
import { closeSplashscreenAndChechUpgrade } from '@/utils/upgrade' import { closeSplashscreenAndChechUpgrade } from '@/utils/upgrade'
import * as WeatherAPI from '@/api/model/weather' import * as WeatherAPI from '@/api/model/weather'
......
...@@ -8,7 +8,11 @@ import SaveDialog from '../device/components/save-dialog.vue' ...@@ -8,7 +8,11 @@ import SaveDialog from '../device/components/save-dialog.vue'
onPullDownRefresh(() => { onPullDownRefresh(() => {
setTimeout(function () { setTimeout(function () {
uni.stopPullDownRefresh() uni.stopPullDownRefresh()
Message.toast('刷新成功') uni.showToast({
title: '刷新成功',
icon: 'success',
duration: 1500
})
}, 1000) }, 1000)
}) })
...@@ -244,9 +248,9 @@ function onResourceClick(resource: any) { ...@@ -244,9 +248,9 @@ function onResourceClick(resource: any) {
} }
// 资源下载点击事件 // 资源下载点击事件
function onDownloadClick(resource: any) { function onDownloadClick(e, resource: any) {
// 阻止事件冒泡 // 阻止事件冒泡
event?.stopPropagation() e?.stopPropagation()
// 显示加载提示 // 显示加载提示
uni.showLoading({ uni.showLoading({
...@@ -281,7 +285,11 @@ function downloadFileForWeb(resource: any) { ...@@ -281,7 +285,11 @@ function downloadFileForWeb(resource: any) {
// 清理 // 清理
document.body.removeChild(link) document.body.removeChild(link)
uni.hideLoading() uni.hideLoading()
Message.toast('开始下载') uni.showToast({
title: '开始下载',
icon: 'success',
duration: 1500
})
} }
// 原生平台下载文件函数 // 原生平台下载文件函数
...@@ -294,7 +302,11 @@ function downloadFileForNative(resource: any) { ...@@ -294,7 +302,11 @@ function downloadFileForNative(resource: any) {
tempFilePath: res.tempFilePath, tempFilePath: res.tempFilePath,
success: (saveRes) => { success: (saveRes) => {
uni.hideLoading() uni.hideLoading()
Message.toast('下载成功') uni.showToast({
title: '下载成功',
icon: 'success',
duration: 1500
})
// 提示用户文件已保存 // 提示用户文件已保存
uni.showModal({ uni.showModal({
...@@ -307,7 +319,11 @@ function downloadFileForNative(resource: any) { ...@@ -307,7 +319,11 @@ function downloadFileForNative(resource: any) {
fileType: resource.fileType?.toString() || '', fileType: resource.fileType?.toString() || '',
showMenu: true, showMenu: true,
fail: () => { fail: () => {
Message.toast('无法打开文件') uni.showToast({
title: '无法打开文件',
icon: 'error',
duration: 1500
})
}, },
}) })
} }
...@@ -317,18 +333,30 @@ function downloadFileForNative(resource: any) { ...@@ -317,18 +333,30 @@ function downloadFileForNative(resource: any) {
fail: (err) => { fail: (err) => {
uni.hideLoading() uni.hideLoading()
console.error('保存文件失败:', err) console.error('保存文件失败:', err)
Message.toast('保存文件失败') uni.showToast({
title: '保存文件失败',
icon: 'error',
duration: 1500
})
}, },
}) })
} else { } else {
uni.hideLoading() uni.hideLoading()
Message.toast(`下载失败,状态码: ${res.statusCode}`) uni.showToast({
title: `下载失败,状态码: ${res.statusCode}`,
icon: 'error',
duration: 1500
})
} }
}, },
fail: (err) => { fail: (err) => {
uni.hideLoading() uni.hideLoading()
console.error('下载失败:', err) console.error('下载失败:', err)
Message.toast('网络错误,下载失败') uni.showToast({
title: '网络错误,下载失败',
icon: 'error',
duration: 1500
})
}, },
}) })
} }
...@@ -478,7 +506,7 @@ function onHelpClick(help: any) { ...@@ -478,7 +506,7 @@ function onHelpClick(help: any) {
</view> </view>
</view> </view>
<view class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_4" <view class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_4"
@click.stop="onDownloadClick(resource)"> @click.stop="(e) => onDownloadClick(e, resource)">
<text class="font_10">下载</text> <text class="font_10">下载</text>
</view> </view>
</view> </view>
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论