Skip to content

basic-uniapp-v3
basic-uniapp-v3
提交 e07d0d6f 作者: 宇宙超人
操作

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

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