完善界面,修改bug
This commit is contained in:
parent
00ad605bc2
commit
70d088a4ba
15
pages.json
15
pages.json
@ -13,7 +13,7 @@
|
||||
"pages": [{
|
||||
"path": "pages/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "天然气工具集",
|
||||
"navigationBarTitleText": "首页",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
@ -24,15 +24,15 @@
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/work",
|
||||
"path": "pages/calc",
|
||||
"style": {
|
||||
"navigationBarTitleText": "工作台"
|
||||
"navigationBarTitleText": "天然气工具集"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/template",
|
||||
"style": {
|
||||
"navigationBarTitleText": "模板"
|
||||
"navigationBarTitleText": "常用资料"
|
||||
}
|
||||
},
|
||||
{
|
||||
@ -250,7 +250,10 @@
|
||||
"path": "index"
|
||||
},
|
||||
{
|
||||
"path": "main"
|
||||
"path": "main",
|
||||
"style": {
|
||||
"navigationBarTitleText": "计算工具"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
@ -269,7 +272,7 @@
|
||||
"text": "首页"
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/work",
|
||||
"pagePath": "pages/calc",
|
||||
"iconPath": "static/images/tabbar/work.png",
|
||||
"selectedIconPath": "static/images/tabbar/work_.png",
|
||||
"text": "计算"
|
||||
|
||||
@ -1,9 +1,5 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<image class="logo" src="@/static/logo.png"></image>
|
||||
<view class="text-area">
|
||||
<text class="title"> 天然气工具集</text>
|
||||
</view>
|
||||
<NG-cal-tools></NG-cal-tools>
|
||||
</view>
|
||||
</template>
|
||||
@ -13,8 +9,6 @@
|
||||
onMounted
|
||||
} from 'vue';
|
||||
import NGCalTools from '@/pages_caltools/pages/index'
|
||||
|
||||
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.content {
|
||||
@ -24,14 +18,7 @@
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.logo {
|
||||
height: 200rpx;
|
||||
width: 200rpx;
|
||||
margin-top: 200rpx;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-bottom: 50rpx;
|
||||
}
|
||||
|
||||
|
||||
.text-area {
|
||||
display: flex;
|
||||
48
pages/template - 副本.vue
Normal file
48
pages/template - 副本.vue
Normal file
@ -0,0 +1,48 @@
|
||||
<script setup lang="ts">
|
||||
import tab from "@/plugins/tab";
|
||||
import list from "./template.config.js";
|
||||
|
||||
interface ListItem {
|
||||
groupName: string;
|
||||
list: FieldItem[];
|
||||
}
|
||||
|
||||
interface FieldItem {
|
||||
title: string;
|
||||
icon: string;
|
||||
path: string;
|
||||
}
|
||||
|
||||
const listData = list as ListItem[];
|
||||
const getIcon = (path: string) => `../static/uview/demo/${path}.png`;
|
||||
const openPage = (path: string) => tab.navigateTo(path)
|
||||
const getGroupTitle = (item: ListItem) => item.groupName;
|
||||
const getFieldTitle = (item: FieldItem) => item.title;
|
||||
</script>
|
||||
<template>
|
||||
<view class="wrap">
|
||||
<view class="list-wrap">
|
||||
<u-cell-group title-bg-color="rgb(243, 244, 246)" :title="getGroupTitle(item)" v-for="(item, index) in listData"
|
||||
:key="index">
|
||||
<u-cell :titleStyle="{ fontWeight: 500 }" @click="openPage(item1.path)" :title="getFieldTitle(item1)"
|
||||
v-for="(item1, index1) in item.list" :key="index1">
|
||||
<template v-slot:icon>
|
||||
<image class="u-cell-icon" :src="getIcon(item1.icon)" mode="widthFix"></image>
|
||||
</template>
|
||||
</u-cell>
|
||||
</u-cell-group>
|
||||
</view>
|
||||
<u-gap height="70"></u-gap>
|
||||
</view>
|
||||
</template>
|
||||
<style lang="scss" scoped>
|
||||
page {
|
||||
background-color: rgb(240, 242, 244);
|
||||
}
|
||||
|
||||
.u-cell-icon {
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
margin-right: 8rpx;
|
||||
}
|
||||
</style>
|
||||
@ -1,48 +1,577 @@
|
||||
<script setup lang="ts">
|
||||
import tab from "@/plugins/tab";
|
||||
import list from "./template.config.js";
|
||||
|
||||
interface ListItem {
|
||||
groupName: string;
|
||||
list: FieldItem[];
|
||||
}
|
||||
|
||||
interface FieldItem {
|
||||
title: string;
|
||||
icon: string;
|
||||
path: string;
|
||||
}
|
||||
|
||||
const listData = list as ListItem[];
|
||||
const getIcon = (path: string) => `../static/uview/demo/${path}.png`;
|
||||
const openPage = (path: string) => tab.navigateTo(path)
|
||||
const getGroupTitle = (item: ListItem) => item.groupName;
|
||||
const getFieldTitle = (item: FieldItem) => item.title;
|
||||
</script>
|
||||
<template>
|
||||
<view class="wrap">
|
||||
<view class="list-wrap">
|
||||
<u-cell-group title-bg-color="rgb(243, 244, 246)" :title="getGroupTitle(item)" v-for="(item, index) in listData"
|
||||
:key="index">
|
||||
<u-cell :titleStyle="{ fontWeight: 500 }" @click="openPage(item1.path)" :title="getFieldTitle(item1)"
|
||||
v-for="(item1, index1) in item.list" :key="index1">
|
||||
<template v-slot:icon>
|
||||
<image class="u-cell-icon" :src="getIcon(item1.icon)" mode="widthFix"></image>
|
||||
</template>
|
||||
</u-cell>
|
||||
</u-cell-group>
|
||||
</view>
|
||||
<u-gap height="70"></u-gap>
|
||||
</view>
|
||||
</template>
|
||||
<style lang="scss" scoped>
|
||||
page {
|
||||
background-color: rgb(240, 242, 244);
|
||||
}
|
||||
<view class="standard-query-container">
|
||||
<!-- 查询条件区域 -->
|
||||
<view class="query-section">
|
||||
<uni-forms :modelValue="queryForm" label-position="top">
|
||||
<view class="query-grid">
|
||||
<!-- 标准号选择 -->
|
||||
<uni-forms-item label="标准号" name="standardNumber" class="query-item">
|
||||
<uni-data-select v-model="queryForm.standardNumber" :localdata="standardOptions"
|
||||
placeholder="请选择标准号" :clear="true" />
|
||||
</uni-forms-item>
|
||||
|
||||
.u-cell-icon {
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
margin-right: 8rpx;
|
||||
}
|
||||
<!-- 资料分类选择 -->
|
||||
<uni-forms-item label="资料分类" name="category" class="query-item">
|
||||
<uni-data-select v-model="queryForm.category" :localdata="categoryOptions" placeholder="请选择资料分类"
|
||||
:clear="true" />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 资料类型选择 -->
|
||||
<uni-forms-item label="资料类型" name="materialType" class="query-item">
|
||||
<uni-data-select v-model="queryForm.materialType" :localdata="materialTypeOptions"
|
||||
placeholder="请选择资料类型" :clear="true" />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 关键词搜索 -->
|
||||
<uni-forms-item label="关键词" name="keywords" class="query-item">
|
||||
<uni-easyinput v-model="queryForm.keywords" placeholder="请输入关键词搜索" :clearable="true" />
|
||||
</uni-forms-item>
|
||||
</view>
|
||||
</uni-forms>
|
||||
|
||||
<!-- 查询按钮 -->
|
||||
<view class="query-actions">
|
||||
<button class="query-btn" @click="handleQuery">查询</button>
|
||||
<button class="reset-btn" @click="handleReset">重置</button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 查询结果区域 -->
|
||||
<view class="result-section">
|
||||
<!-- 结果统计 -->
|
||||
<view class="result-header">
|
||||
<text class="result-count">共找到 {{resultList.length}} 条记录</text>
|
||||
</view>
|
||||
|
||||
<!-- 结果列表 -->
|
||||
<view class="result-list">
|
||||
<view v-for="item in resultList" :key="item.id" class="result-item" @click="handleItemClick(item)">
|
||||
<view class="item-header">
|
||||
<text class="item-title">{{item.title}}</text>
|
||||
<text class="item-standard">{{item.standardNumber}}</text>
|
||||
</view>
|
||||
|
||||
<view class="item-content">
|
||||
<text class="item-category">{{item.category}} - {{item.materialType}}</text>
|
||||
<text class="item-desc">{{item.description}}</text>
|
||||
</view>
|
||||
|
||||
<!-- 图片预览 -->
|
||||
<view v-if="item.images && item.images.length > 0" class="image-preview">
|
||||
<image v-for="(img, index) in item.images.slice(0, 3)" :key="index" :src="img.thumbnail"
|
||||
class="preview-img" mode="aspectFill" @click.stop="previewImage(item.images, index)" />
|
||||
<text v-if="item.images.length > 3" class="more-count">+{{item.images.length - 3}}</text>
|
||||
</view>
|
||||
|
||||
<!-- 表格预览 -->
|
||||
<view v-if="item.tables && item.tables.length > 0" class="table-preview">
|
||||
<text class="table-count">包含 {{item.tables.length}} 个表格</text>
|
||||
</view>
|
||||
|
||||
<view class="item-footer">
|
||||
<text class="item-tags">
|
||||
<text v-for="tag in item.tags" :key="tag" class="tag">{{tag}}</text>
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 空状态 -->
|
||||
<view v-if="resultList.length === 0" class="empty-state">
|
||||
<image src="/static/empty.png" class="empty-img" mode="aspectFit"></image>
|
||||
<text class="empty-text">暂无查询结果</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 图片预览模态框 -->
|
||||
<uni-popup ref="imagePopup" type="center" background-color="#000">
|
||||
<view class="image-popup">
|
||||
<swiper :current="currentImageIndex" class="image-swiper" @change="onSwiperChange">
|
||||
<swiper-item v-for="(img, index) in currentImages" :key="index">
|
||||
<image :src="img.url" class="popup-image" mode="aspectFit"
|
||||
@longpress="handleImageLongPress(img)" />
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
<view class="image-info">
|
||||
<text class="image-index">{{currentImageIndex + 1}} / {{currentImages.length}}</text>
|
||||
<text class="image-desc">{{currentImageDesc}}</text>
|
||||
</view>
|
||||
<view class="popup-actions">
|
||||
<button class="close-btn" @click="closeImagePopup">关闭</button>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
reactive,
|
||||
onMounted
|
||||
} from 'vue'
|
||||
|
||||
// 查询表单数据
|
||||
const queryForm = reactive({
|
||||
standardNumber: '',
|
||||
category: '',
|
||||
materialType: '',
|
||||
keywords: ''
|
||||
})
|
||||
|
||||
// 选择器选项
|
||||
const standardOptions = ref([{
|
||||
value: 'GB 17820-2018',
|
||||
text: 'GB 17820-2018 天然气'
|
||||
},
|
||||
{
|
||||
value: 'GB 50028-2006',
|
||||
text: 'GB 50028-2006 城镇燃气设计规范'
|
||||
},
|
||||
{
|
||||
value: 'SY/T 5922-2012',
|
||||
text: 'SY/T 5922-2012 天然气管道运行规范'
|
||||
},
|
||||
{
|
||||
value: 'JJG 1030-2007',
|
||||
text: 'JJG 1030-2007 超声流量计检定规程'
|
||||
},
|
||||
{
|
||||
value: 'GB/T 18604-2014',
|
||||
text: 'GB/T 18604-2014 用气体超声流量计测量天然气流量'
|
||||
}
|
||||
])
|
||||
|
||||
const categoryOptions = ref([{
|
||||
value: 'standard',
|
||||
text: '标准规范'
|
||||
},
|
||||
{
|
||||
value: 'regulation',
|
||||
text: '规程规范'
|
||||
},
|
||||
{
|
||||
value: 'safety',
|
||||
text: '安全资料'
|
||||
},
|
||||
{
|
||||
value: 'technical',
|
||||
text: '技术手册'
|
||||
},
|
||||
{
|
||||
value: 'calculation',
|
||||
text: '计算图表'
|
||||
}
|
||||
])
|
||||
|
||||
const materialTypeOptions = ref([{
|
||||
value: 'image',
|
||||
text: '图片资料'
|
||||
},
|
||||
{
|
||||
value: 'table',
|
||||
text: '表格数据'
|
||||
},
|
||||
{
|
||||
value: 'chart',
|
||||
text: '图表曲线'
|
||||
},
|
||||
{
|
||||
value: 'formula',
|
||||
text: '计算公式'
|
||||
}
|
||||
])
|
||||
|
||||
// 查询结果列表
|
||||
const resultList = ref([{
|
||||
id: 1,
|
||||
title: '天然气组分与热值关系图表',
|
||||
standardNumber: 'GB 17820-2018',
|
||||
category: 'calculation',
|
||||
materialType: 'chart',
|
||||
description: '展示不同天然气组分与热值之间的对应关系曲线',
|
||||
images: [{
|
||||
url: '/static/charts/heat-value-chart.jpg',
|
||||
thumbnail: '/static/charts/heat-value-thumb.jpg',
|
||||
description: '热值关系图表'
|
||||
}],
|
||||
tables: [],
|
||||
tags: ['热值', '组分', '计算']
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: '管道流量计算参数表',
|
||||
standardNumber: 'SY/T 5922-2012',
|
||||
category: 'technical',
|
||||
materialType: 'table',
|
||||
description: '不同管径和压力下的流量计算参数参考表',
|
||||
images: [],
|
||||
tables: [{
|
||||
title: '流量参数表',
|
||||
data: []
|
||||
}],
|
||||
tags: ['流量', '管径', '计算']
|
||||
}
|
||||
])
|
||||
|
||||
// 图片预览相关
|
||||
const imagePopup = ref(null)
|
||||
const currentImages = ref([])
|
||||
const currentImageIndex = ref(0)
|
||||
const currentImageDesc = ref('')
|
||||
|
||||
// 查询操作
|
||||
const handleQuery = () => {
|
||||
// 模拟查询逻辑
|
||||
console.log('执行查询:', queryForm)
|
||||
// 实际开发中这里应该是API调用
|
||||
}
|
||||
|
||||
const handleReset = () => {
|
||||
Object.keys(queryForm).forEach(key => {
|
||||
queryForm[key] = ''
|
||||
})
|
||||
}
|
||||
|
||||
// 点击结果项
|
||||
const handleItemClick = (item) => {
|
||||
console.log('点击项目:', item)
|
||||
// 跳转到详情页或执行其他操作
|
||||
uni.navigateTo({
|
||||
url: `/pages/material/detail?id=${item.id}`
|
||||
})
|
||||
}
|
||||
|
||||
// 图片预览
|
||||
const previewImage = (images, index) => {
|
||||
currentImages.value = images
|
||||
currentImageIndex.value = index
|
||||
currentImageDesc.value = images[index]?.description || ''
|
||||
imagePopup.value.open()
|
||||
}
|
||||
|
||||
const onSwiperChange = (e) => {
|
||||
currentImageIndex.value = e.detail.current
|
||||
currentImageDesc.value = currentImages.value[currentImageIndex.value]?.description || ''
|
||||
}
|
||||
|
||||
const closeImagePopup = () => {
|
||||
imagePopup.value.close()
|
||||
}
|
||||
|
||||
const handleImageLongPress = (img) => {
|
||||
uni.showActionSheet({
|
||||
itemList: ['保存图片', '分享'],
|
||||
success: (res) => {
|
||||
if (res.tapIndex === 0) {
|
||||
// 保存图片逻辑
|
||||
uni.saveImageToPhotosAlbum({
|
||||
filePath: img.url,
|
||||
success: () => {
|
||||
uni.showToast({
|
||||
title: '保存成功',
|
||||
icon: 'success'
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
// 初始化数据
|
||||
console.log('页面加载完成')
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.standard-query-container {
|
||||
padding: 20rpx;
|
||||
background-color: #f8f8f8;
|
||||
min-height: 100vh;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* 查询区域样式 */
|
||||
.query-section {
|
||||
background-color: #ffffff;
|
||||
border-radius: 12rpx;
|
||||
padding: 24rpx;
|
||||
margin-bottom: 24rpx;
|
||||
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
|
||||
.query-grid {
|
||||
display: grid;
|
||||
gap: 24rpx;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.query-item {
|
||||
margin-bottom: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.query-actions {
|
||||
display: flex;
|
||||
gap: 20rpx;
|
||||
margin-top: 24rpx;
|
||||
|
||||
.query-btn,
|
||||
.reset-btn {
|
||||
flex: 1;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
border-radius: 8rpx;
|
||||
font-size: 28rpx;
|
||||
|
||||
&::after {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
.query-btn {
|
||||
background-color: #007aff;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.reset-btn {
|
||||
background-color: #f0f0f0;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
/* 结果区域样式 */
|
||||
.result-section {
|
||||
background-color: #ffffff;
|
||||
border-radius: 12rpx;
|
||||
padding: 24rpx;
|
||||
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
|
||||
.result-header {
|
||||
margin-bottom: 24rpx;
|
||||
|
||||
.result-count {
|
||||
font-size: 26rpx;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
|
||||
.result-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 24rpx;
|
||||
}
|
||||
|
||||
.result-item {
|
||||
border: 1rpx solid #e0e0e0;
|
||||
border-radius: 12rpx;
|
||||
padding: 24rpx;
|
||||
background-color: #fafafa;
|
||||
|
||||
.item-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
margin-bottom: 16rpx;
|
||||
|
||||
.item-title {
|
||||
font-size: 30rpx;
|
||||
font-weight: 600;
|
||||
color: #333333;
|
||||
flex: 1;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.item-standard {
|
||||
font-size: 24rpx;
|
||||
color: #007aff;
|
||||
background-color: #e6f3ff;
|
||||
padding: 4rpx 12rpx;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.item-content {
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.item-category {
|
||||
display: block;
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.item-desc {
|
||||
font-size: 26rpx;
|
||||
color: #333333;
|
||||
line-height: 1.5;
|
||||
}
|
||||
}
|
||||
|
||||
.image-preview {
|
||||
display: flex;
|
||||
gap: 12rpx;
|
||||
margin-bottom: 16rpx;
|
||||
|
||||
.preview-img {
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
|
||||
.more-count {
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
background-color: #f0f0f0;
|
||||
border-radius: 6rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
|
||||
.table-preview {
|
||||
margin-bottom: 16rpx;
|
||||
|
||||
.table-count {
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
background-color: #f0f0f0;
|
||||
padding: 8rpx 16rpx;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.item-footer {
|
||||
.item-tags {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 12rpx;
|
||||
|
||||
.tag {
|
||||
font-size: 22rpx;
|
||||
color: #007aff;
|
||||
background-color: #e6f3ff;
|
||||
padding: 4rpx 12rpx;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.empty-state {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 80rpx 0;
|
||||
|
||||
.empty-img {
|
||||
width: 200rpx;
|
||||
height: 200rpx;
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.empty-text {
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
|
||||
/* 图片预览弹窗样式 */
|
||||
.image-popup {
|
||||
width: 90vw;
|
||||
height: 80vh;
|
||||
background-color: #000000;
|
||||
border-radius: 12rpx;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.image-swiper {
|
||||
flex: 1;
|
||||
height: 60vh;
|
||||
|
||||
.popup-image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.image-info {
|
||||
padding: 20rpx;
|
||||
background-color: rgba(0, 0, 0, 0.7);
|
||||
|
||||
.image-index {
|
||||
font-size: 26rpx;
|
||||
color: #ffffff;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.image-desc {
|
||||
font-size: 26rpx;
|
||||
color: #cccccc;
|
||||
}
|
||||
}
|
||||
|
||||
.popup-actions {
|
||||
padding: 20rpx;
|
||||
|
||||
.close-btn {
|
||||
background-color: #333333;
|
||||
color: #ffffff;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
border-radius: 8rpx;
|
||||
|
||||
&::after {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 响应式布局 */
|
||||
@media screen and (max-width: 768px) {
|
||||
.query-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px) {
|
||||
.query-grid {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
}
|
||||
|
||||
/* 表单元素深度样式 */
|
||||
:deep(.uni-forms-item) {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
|
||||
:deep(.uni-forms-item__label) {
|
||||
font-size: 26rpx;
|
||||
color: #333333;
|
||||
margin-bottom: 8rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
:deep(.uni-data-select__input),
|
||||
:deep(.uni-easyinput__content) {
|
||||
width: 100%;
|
||||
min-height: 80rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
:deep(.uni-input-input),
|
||||
:deep(.uni-easyinput__content input) {
|
||||
font-size: 28rpx;
|
||||
padding: 0 20rpx;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
}
|
||||
</style>
|
||||
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<view class="app-container">
|
||||
<view class="form-container">
|
||||
<uni-forms label-position="top" :modelValue="formData" class="component-form">
|
||||
<view class="form-row">
|
||||
<view class="fields-grid">
|
||||
<!-- 常用组分选择框 -->
|
||||
<uni-forms-item label="常用组分" class="form-item">
|
||||
<uni-data-select v-model="selectedComponent" @change="handleComponentChange" placeholder="请选择常用组分"
|
||||
@ -15,10 +15,10 @@
|
||||
</view>
|
||||
</uni-forms>
|
||||
|
||||
<uni-forms :modelValue="formData" label-position="top" class="component-form">
|
||||
<uni-forms :modelValue="formData" label-position="top" class="component-form" :label-width="160">
|
||||
<view class="fields-grid">
|
||||
<uni-forms-item v-for="field in componentFields" :key="field.prop" :label="field.label"
|
||||
:name="field.prop" class="field-item">
|
||||
:name="field.prop" class="form-item">
|
||||
<uni-easyinput v-model="formData[field.prop]" type="digit" @input="handleValueChange"
|
||||
@focus="selectAllText" />
|
||||
</uni-forms-item>
|
||||
@ -55,7 +55,7 @@
|
||||
text: item.label
|
||||
}))
|
||||
})
|
||||
|
||||
|
||||
|
||||
// 字段配置元数据
|
||||
const COMPONENT_FIELDS = [{
|
||||
@ -194,7 +194,7 @@
|
||||
query.select(`[data-field="${event.target.dataset.field}"]`).node((res) => {
|
||||
const node = res.node;
|
||||
if (node && node.setSelectionRange) {
|
||||
node.setSelectionRange(0, node.value.length);
|
||||
node.setSelectionRange(0, node.value.length);
|
||||
}
|
||||
}).exec();
|
||||
}
|
||||
@ -227,7 +227,7 @@
|
||||
emitUpdate();
|
||||
} catch (error) {
|
||||
uni.showToast({
|
||||
title: '获取标准组分失败',
|
||||
title: '获取标准组分失败',
|
||||
icon: 'none'
|
||||
});
|
||||
console.error(error);
|
||||
@ -276,69 +276,130 @@
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.app-container {
|
||||
padding: 20rpx;
|
||||
.form-container {
|
||||
padding: 10rpx;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.component-form {
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.form-row {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 20rpx;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.form-item {
|
||||
flex: 1;
|
||||
min-width: 300rpx;
|
||||
background-color: #ffffff;
|
||||
border-radius: 12rpx;
|
||||
padding: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
|
||||
/* 网格布局容器 */
|
||||
.fields-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(300rpx, 1fr));
|
||||
gap: 20rpx;
|
||||
gap: 24rpx;
|
||||
/* 表单项之间的间距 */
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.field-item {
|
||||
margin-bottom: 0;
|
||||
/* 表单项基础样式 */
|
||||
.form-item {
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.total-input {
|
||||
font-weight: bold;
|
||||
color: #007AFF;
|
||||
/* 响应式布局 - 屏幕宽度小于768px时显示2列 */
|
||||
@media screen and (max-width: 768px) {
|
||||
.fields-grid {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
}
|
||||
|
||||
/* 响应式布局 - 屏幕宽度大于等于768px时显示3列 */
|
||||
@media screen and (min-width: 768px) {
|
||||
.fields-grid {
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
}
|
||||
}
|
||||
|
||||
/* 优化表单元素样式 */
|
||||
:deep(.uni-forms-item) {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
|
||||
/* 调整uni-ui组件样式 */
|
||||
:deep(.uni-forms-item__label) {
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
:deep(.uni-input-input) {
|
||||
font-size: 28rpx;
|
||||
font-size: 22rpx;
|
||||
color: #868686;
|
||||
margin-bottom: 5rpx;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
:deep(.uni-data-select__input),
|
||||
:deep(.uni-easyinput__content) {
|
||||
width: 100%;
|
||||
min-height: 70rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
:deep(.uni-input-input),
|
||||
:deep(.uni-easyinput__content input) {
|
||||
font-size: 28rpx;
|
||||
padding: 0 20rpx;
|
||||
height: 70rpx;
|
||||
line-height: 70rpx;
|
||||
}
|
||||
|
||||
/* 禁用输入框的特殊样式 */
|
||||
.total-input :deep(.uni-easyinput__content) {
|
||||
background-color: #f5f7fa;
|
||||
border-color: #e4e7ed;
|
||||
}
|
||||
|
||||
.total-input :deep(.uni-input-input) {
|
||||
background-color: #f5f7fa;
|
||||
color: #606266;
|
||||
-webkit-text-fill-color: #606266;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 确保小屏幕下表单不溢出 */
|
||||
@media screen and (max-width: 480px) {
|
||||
.form-container {
|
||||
padding: 10rpx;
|
||||
}
|
||||
|
||||
.component-form {
|
||||
padding: 16rpx;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.fields-grid {
|
||||
gap: 16rpx;
|
||||
}
|
||||
|
||||
:deep(.uni-forms-item__label) {
|
||||
font-size: 22rpx;
|
||||
}
|
||||
|
||||
:deep(.uni-input-input) {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
|
||||
/* 针对选择器的特殊样式调整 */
|
||||
:deep(.uni-data-select) {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
:deep(.uni-data-select__selector) {
|
||||
min-height: 70rpx;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
|
||||
:deep(.total-input .uni-input-input) {
|
||||
font-weight: bold;
|
||||
color: #007AFF;
|
||||
:deep(.uni-data-select__input-text) {
|
||||
font-size: 28rpx;
|
||||
line-height: 70rpx;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
|
||||
@media (max-width: 750px) {
|
||||
.fields-grid {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
gap: 15rpx;
|
||||
}
|
||||
|
||||
.form-item {
|
||||
min-width: 250rpx;
|
||||
}
|
||||
/* 数字输入框的特殊样式 */
|
||||
:deep(input[type="digit"]) {
|
||||
text-align: right;
|
||||
}
|
||||
</style>
|
||||
@ -4,38 +4,49 @@
|
||||
<div>NGResult 数据: {{ NGResult }}</div> -->
|
||||
<view v-if="dMeterType === '4'" class="section-title">GB/T 17747</view>
|
||||
<u-divider v-if="dMeterType === '4'"></u-divider>
|
||||
<uni-forms v-if="dMeterType === '4'" :label-width="160" :modelValue="NGResult" label-position="top" ref="queryRef">
|
||||
<uni-forms v-if="dMeterType === '4'" :label-width="160" :modelValue="NGResult" label-position="top"
|
||||
ref="queryRef">
|
||||
|
||||
<view class="form-grid">
|
||||
<uni-forms-item class="form-item" label="分子量" name="dMrx">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dMrx" placeholder="请输入分子量" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dMrx"
|
||||
placeholder="分子量" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="标况压缩因子" name="dZb">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dZb" placeholder="请输入标况压缩因子" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dZb"
|
||||
placeholder="标况压缩因子" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="工况压缩因子" name="dZf">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dZf" placeholder="请输入工况压缩因子" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dZf"
|
||||
placeholder="工况压缩因子" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="超压缩系数" name="dFpv">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dFpv" placeholder="请输入超压缩系数" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dFpv"
|
||||
placeholder="超压缩系数" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="标况摩尔密度" name="dDb">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dDb" placeholder="请输入标况摩尔密度" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dDb"
|
||||
placeholder="标况摩尔密度" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="工况摩尔密度" name="dDf">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dDf" placeholder="请输入工况摩尔密度" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dDf"
|
||||
placeholder="工况摩尔密度" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="标况质量密度" name="dRhob">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dRhob" placeholder="请输入标况质量密度" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dRhob"
|
||||
placeholder="标况质量密度" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="工况质量密度" name="dRhof">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dRhof" placeholder="请输入工况质量密度" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dRhof"
|
||||
placeholder="工况质量密度" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="理想气体的相对密度" name="dRD_Ideal">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dRD_Ideal" placeholder="请输入理想气体的相对密度" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dRD_Ideal"
|
||||
placeholder="理想气体的相对密度" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="真实气体的相对密度" name="dRD_Real">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dRD_Real" placeholder="请输入真实气体的相对密度" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dRD_Real"
|
||||
placeholder="真实气体的相对密度" />
|
||||
</uni-forms-item>
|
||||
</view>
|
||||
</uni-forms>
|
||||
@ -43,49 +54,49 @@
|
||||
<view v-if="dMeterType === '5'" class="section-title">AGA No10</view>
|
||||
<u-divider v-if="dMeterType === '5'"></u-divider>
|
||||
<uni-forms v-if="dMeterType === '5'" :modelValue="NGResult" label-position="top" ref="queryRef"
|
||||
:label-width="160">
|
||||
:label-width="160">
|
||||
<view class="form-grid">
|
||||
<uni-forms-item class="form-item" label="理想气体的比焓" name="dHo">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dHo" placeholder="请输入理想气体的比焓" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dHo"
|
||||
placeholder="理想气体的比焓" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="真实气体的焓" name="dH">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dH" placeholder="请输入真实气体的焓" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dH"
|
||||
placeholder="真实气体的焓" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="真实气体的熵" name="dS">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dS" placeholder="请输入真实气体的熵" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dS"
|
||||
placeholder="真实气体的熵" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="理想气体定压热容" name="dCpi">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dCpi" placeholder="请输入理想气体定压热容" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dCpi"
|
||||
placeholder="理想气体定压热容" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="定压热容" name="dCp">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dCp" placeholder="请输入定压热容" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dCp"
|
||||
placeholder="定压热容" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="定容积热容" name="dCv">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dCv" placeholder="请输入定容积热容" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dCv"
|
||||
placeholder="定容积热容" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="比热比" name="dk">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dk" placeholder="请输入比热比" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dk"
|
||||
placeholder="比热比" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="等熵指数" name="dKappa">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dKappa" placeholder="请输入等熵指数" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dKappa"
|
||||
placeholder="等熵指数" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="声速" name="dSOS">
|
||||
<!-- 假设 a-yjly-inputunit 组件已经适配 uniapp -->
|
||||
<!-- <a-yjly-inputunit
|
||||
:value="NGResult.dSOS"
|
||||
:unit-type="'speed'"
|
||||
:unit-order="NGResult.dSOSUnit"
|
||||
:show-english-only="true"
|
||||
:decimal-places="5"
|
||||
:input-disable="true"
|
||||
:width="selectWidth"
|
||||
@update:value="NGResult.dSOS = $event"
|
||||
@update:unitOrder="NGResult.dSOSUnit = $event"
|
||||
/> -->
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dSOS" placeholder="请输入声速" />
|
||||
<uni-forms-item class="form-item" label="声速m/s" name="dSOS">
|
||||
<!-- <a-yjly-inputunit v-model="NGResult.dSOS" :unit-type="'speed'" :show-english-only="true"
|
||||
:decimal-places="5" :input-disable="true" :width="selectWidth" /> -->
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dSOS"
|
||||
placeholder="声速" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="临界流函数" name="dCstar">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dCstar" placeholder="请输入临界流函数" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dCstar"
|
||||
placeholder="临界流函数" />
|
||||
</uni-forms-item>
|
||||
</view>
|
||||
</uni-forms>
|
||||
@ -93,43 +104,54 @@
|
||||
<view v-if="dMeterType === '6'" class="section-title">GB/T 11062</view>
|
||||
<u-divider v-if="dMeterType === '6'"></u-divider>
|
||||
<uni-forms v-if="dMeterType === '6'" :modelValue="NGResult" label-position="top" ref="queryRef"
|
||||
:label-width="160">
|
||||
:label-width="160">
|
||||
<view class="form-grid">
|
||||
<uni-forms-item class="form-item" label="摩尔高位发热量" name="dHhvMol">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dHhvMol" placeholder="请输入摩尔高位发热量" />
|
||||
<uni-forms-item class="form-item" label="摩尔高位发热量MJ/mol" name="dHhvMol">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dHhvMol"
|
||||
placeholder="摩尔高位发热量" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="摩尔低位发热量" name="dLhvMol">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dLhvMol" placeholder="请输入摩尔低位发热量" />
|
||||
<uni-forms-item class="form-item" label="摩尔低位发热量MJ/mol" name="dLhvMol">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dLhvMol"
|
||||
placeholder="摩尔低位发热量" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="体积高位发热量" name="dHhvv">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dHhvv" placeholder="请输入体积高位发热量" />
|
||||
<uni-forms-item class="form-item" label="体积高位发热量MJ/m³" name="dHhvv">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dHhvv"
|
||||
placeholder="体积高位发热量" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="体积低位发热量" name="dLhvv">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dLhvv" placeholder="请输入体积低位发热量" />
|
||||
<uni-forms-item class="form-item" label="体积低位发热量MJ/m³" name="dLhvv">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dLhvv"
|
||||
placeholder="体积低位发热量" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="质量高位发热量" name="dHhvm">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dHhvm" placeholder="请输入质量高位发热量" />
|
||||
<uni-forms-item class="form-item" label="质量高位发热量MJ/t" name="dHhvm">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dHhvm"
|
||||
placeholder="质量高位发热量" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="质量地位发热量" name="dLhvm">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dLhvm" placeholder="请输入质量地位发热量" />
|
||||
<uni-forms-item class="form-item" label="质量地位发热量MJ/t" name="dLhvm">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dLhvm"
|
||||
placeholder="质量地位发热量" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="标况压缩因子" name="dZb11062">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dZb11062" placeholder="请输入标况压缩因子" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dZb11062"
|
||||
placeholder="标况压缩因子" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="标况质量密度" name="dRhob11062">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dRhob11062" placeholder="请输入标况质量密度" />
|
||||
<uni-forms-item class="form-item" label="标况质量密度kg/m³" name="dRhob11062">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dRhob11062"
|
||||
placeholder="标况质量密度" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="工况质量密度" name="dRhof11062">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dRhof11062" placeholder="请输入工况质量密度" />
|
||||
<uni-forms-item class="form-item" label="工况质量密度kg/m³" name="dRhof11062">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dRhof11062"
|
||||
placeholder="工况质量密度" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="理想气体的相对密度" name="dRD_Ideal11062">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dRD_Ideal11062" placeholder="请输入理想气体的相对密度" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dRD_Ideal11062"
|
||||
placeholder="理想气体的相对密度" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="真实气体的相对密度" name="dRD_Real11062">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dRD_Real11062" placeholder="请输入真实气体的相对密度" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dRD_Real11062"
|
||||
placeholder="真实气体的相对密度" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="真实气体的沃泊指数" name="dWobbeIndex">
|
||||
<uni-easyinput disabledd :clearable="false" :value="NGResult.dWobbeIndex" placeholder="请输入真实气体的沃泊指数" />
|
||||
<uni-easyinput disabled :clearable="false" :value="NGResult.dWobbeIndex" placeholder="真实气体的沃泊指数" />
|
||||
</uni-forms-item>
|
||||
</view>
|
||||
</uni-forms>
|
||||
@ -139,40 +161,52 @@
|
||||
:label-width="160">
|
||||
<view class="form-grid">
|
||||
<uni-forms-item class="form-item" label="临界压力" name="dPc">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dPc" placeholder="请输入临界压力" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dPc"
|
||||
placeholder="临界压力" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="临界温度" name="dTC">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dTC" placeholder="请输入临界温度" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dTC"
|
||||
placeholder="临界温度" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="爆炸上限" name="dBzsx">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dBzsx" placeholder="请输入爆炸上限" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dBzsx"
|
||||
placeholder="爆炸上限" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="爆炸下限" name="dBzxx">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dBzxx" placeholder="请输入爆炸下限" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dBzxx"
|
||||
placeholder="爆炸下限" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="总炭含量(kg/m3)" name="dTotalC">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dTotalC" placeholder="请输入总炭含量(kg/m3)" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dTotalC"
|
||||
placeholder="总炭含量(kg/m3)" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="C2组分含量(kg/m3)" name="dC2">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dC2" placeholder="请输入C2组分含量(kg/m3)" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dC2"
|
||||
placeholder="C2组分含量(kg/m3)" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="C2以上组分含量(kg/m3)" name="dC2j">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dC2j" placeholder="请输入C2以上组分含量(kg/m3)" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dC2j"
|
||||
placeholder="C2以上组分含量(kg/m3)" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="C3以上组分含量(kg/m3)" name="dC3j">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dC3j" placeholder="请输入C3以上组分含量(kg/m3)" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dC3j"
|
||||
placeholder="C3以上组分含量(kg/m3)" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="C4以上组分含量(kg/m3)" name="dC4j">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dC4j" placeholder="请输入C4以上组分含量(kg/m3)" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dC4j"
|
||||
placeholder="C4以上组分含量(kg/m3)" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="C5以上组分含量(kg/m3)" name="dC5j">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dC5j" placeholder="请输入C5以上组分含量(kg/m3)" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dC5j"
|
||||
placeholder="C5以上组分含量(kg/m3)" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="C6以上组分含量(kg/m3)" name="dC6j">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dC6j" placeholder="请输入C6以上组分含量(kg/m3)" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dC6j"
|
||||
placeholder="C6以上组分含量(kg/m3)" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item class="form-item" label="C3C4组分含量(kg/m3)" name="dC3C4">
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dC3C4" placeholder="请输入C3C4组分含量(kg/m3)" />
|
||||
<uni-easyinput class="easyInput" disabled :clearable="false" :value="NGResult.dC3C4"
|
||||
placeholder="C3C4组分含量(kg/m3)" />
|
||||
</uni-forms-item>
|
||||
</view>
|
||||
</uni-forms>
|
||||
@ -343,7 +377,7 @@
|
||||
<style scoped>
|
||||
/* 容器样式 */
|
||||
.form-container {
|
||||
padding: 20rpx;
|
||||
padding: 5rpx;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
}
|
||||
@ -375,7 +409,8 @@
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
}
|
||||
}
|
||||
.easyInput{
|
||||
|
||||
.easyInput {
|
||||
color: blue;
|
||||
font-weight: 400;
|
||||
}
|
||||
@ -386,9 +421,9 @@
|
||||
}
|
||||
|
||||
:deep(.uni-forms-item__label) {
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
margin-bottom: 8rpx;
|
||||
font-size: 22rpx;
|
||||
color: #868686;
|
||||
margin-bottom: 5rpx;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
@ -403,11 +438,24 @@
|
||||
:deep(.uni-input-input),
|
||||
:deep(.uni-easyinput__content input) {
|
||||
font-size: 28rpx;
|
||||
padding: 0 20rpx;
|
||||
padding: 0 10rpx;
|
||||
height: 70rpx;
|
||||
line-height: 70rpx;
|
||||
}
|
||||
|
||||
/* 针对输入框禁用状态的样式优化 */
|
||||
:deep(.uni-easyinput__content.is-disabled) {
|
||||
background-color: #f5f7fa;
|
||||
border-color: #e4e7ed;
|
||||
}
|
||||
|
||||
:deep(.uni-input-input:disabled) {
|
||||
background-color: #f5f7fa;
|
||||
color: #161718;
|
||||
-webkit-text-fill-color: #606266;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 确保小屏幕下表单不溢出 */
|
||||
@media screen and (max-width: 480px) {
|
||||
.form-container {
|
||||
|
||||
@ -64,21 +64,21 @@
|
||||
<uni-forms-item v-if="meterPar.dMeterType === '0' || meterPar.dMeterType === '3'" label="管道内径"
|
||||
name="dPipeD" class="form-item">
|
||||
<a-yjly-inputunit v-model="meterPar.dPipeD" :unit-type="'length'"
|
||||
:unitOrder.sync="meterPar.dLenUnit" :show-english-only="false" :decimal-places="5"
|
||||
:unitOrder.sync="meterPar.dLenUnit" :show-english-only="true" :decimal-places="5"
|
||||
:width="selectWidth" />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 孔板孔径 -->
|
||||
<uni-forms-item v-if="meterPar.dMeterType === '0'" label="孔板孔径" name="dOrificeD" class="form-item">
|
||||
<a-yjly-inputunit v-model="meterPar.dOrificeD" :unit-type="'length'"
|
||||
:unitOrder.sync="meterPar.dOrificeUnit" :show-english-only="false" :decimal-places="5"
|
||||
:unitOrder.sync="meterPar.dOrificeUnit" :show-english-only="true" :decimal-places="5"
|
||||
:width="selectWidth" />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 喉部直径 -->
|
||||
<uni-forms-item v-if="meterPar.dMeterType === '3'" label="喉部直径" name="dOrificeD" class="form-item">
|
||||
<a-yjly-inputunit v-model="meterPar.dOrificeD" :unit-type="'length'"
|
||||
:unitOrder.sync="meterPar.dOrificeUnit" :show-english-only="false" :decimal-places="5"
|
||||
:unitOrder.sync="meterPar.dOrificeUnit" :show-english-only="true" :decimal-places="5"
|
||||
:width="selectWidth" />
|
||||
</uni-forms-item>
|
||||
|
||||
@ -91,27 +91,27 @@
|
||||
<!-- 当地大气压 -->
|
||||
<uni-forms-item v-if="meterPar.dPfType === '0'" label="当地大气压" name="dPatm" class="form-item">
|
||||
<a-yjly-inputunit v-model="meterPar.dPatm" :unit-type="'pressure'"
|
||||
:unitOrder.sync="meterPar.dPatmUnit" :show-english-only="false" :decimal-places="6"
|
||||
:unitOrder.sync="meterPar.dPatmUnit" :show-english-only="true" :decimal-places="6"
|
||||
:width="selectWidth" />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 输入压力 -->
|
||||
<uni-forms-item label="输入压力" name="dPf" class="form-item">
|
||||
<a-yjly-inputunit v-model="meterPar.dPf" :unit-type="'pressure'" :unitOrder.sync="meterPar.dPfUnit"
|
||||
:show-english-only="false" :decimal-places="5" :width="selectWidth" />
|
||||
:show-english-only="true" :decimal-places="5" :width="selectWidth" />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 输入温度 -->
|
||||
<uni-forms-item label="输入温度" name="dTf" class="form-item">
|
||||
<a-yjly-inputunit v-model="meterPar.dTf" :unit-type="'temperature'"
|
||||
:unitOrder.sync="meterPar.dTfUnit" :show-english-only="false" :decimal-places="5"
|
||||
:unitOrder.sync="meterPar.dTfUnit" :show-english-only="true" :decimal-places="5"
|
||||
:width="selectWidth" />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 输入差压 -->
|
||||
<uni-forms-item v-if="meterPar.dMeterType === '0'" label="输入差压" name="dDp" class="form-item">
|
||||
<a-yjly-inputunit v-model="meterPar.dDp" :unit-type="'pressure'" :unitOrder.sync="meterPar.dDpUnit"
|
||||
:show-english-only="false" :decimal-places="5" :width="selectWidth" />
|
||||
:show-english-only="true" :decimal-places="5" :width="selectWidth" />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 流出系数 -->
|
||||
@ -129,7 +129,7 @@
|
||||
<uni-forms-item v-if="meterPar.dMeterType === '1' || meterPar.dMeterType === '2'" label="脉冲数"
|
||||
name="dPulseNum" class="form-item">
|
||||
<a-yjly-inputunit v-model="meterPar.dPulseNum" :unit-type="'user'"
|
||||
:unitOrder.sync="meterPar.dVGscUnit" :show-english-only="false" :decimal-places="5"
|
||||
:unitOrder.sync="meterPar.dVGscUnit" :show-english-only="true" :decimal-places="5"
|
||||
:user-defined="true" :user-definedunit-name="'个'" :enable-convert="false"
|
||||
:width="selectWidth" />
|
||||
</uni-forms-item>
|
||||
@ -137,70 +137,70 @@
|
||||
<!-- 管束车容积 -->
|
||||
<uni-forms-item v-if="meterPar.dMeterType === '8'" label="管束车容积" name="dVGsc" class="form-item">
|
||||
<a-yjly-inputunit v-model="meterPar.dVGsc" :unit-type="'volume'"
|
||||
:unitOrder.sync="meterPar.dVGscUnit" :show-english-only="false" :decimal-places="5"
|
||||
:unitOrder.sync="meterPar.dVGscUnit" :show-english-only="true" :decimal-places="5"
|
||||
:width="selectWidth" />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 最大体积流量 -->
|
||||
<uni-forms-item v-if="meterPar.dBqdd === '1'" label="最大体积流量" name="dVFlowMax" class="form-item">
|
||||
<a-yjly-inputunit v-model="meterPar.dVFlowMax" :unit-type="'volumeflow'"
|
||||
:unitOrder.sync="meterPar.dVFlowUnit" :show-english-only="false" :decimal-places="5"
|
||||
:unitOrder.sync="meterPar.dVFlowUnit" :show-english-only="true" :decimal-places="5"
|
||||
:width="selectWidth" />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 最小体积流量 -->
|
||||
<uni-forms-item v-if="meterPar.dBqdd === '1'" label="最小体积流量" name="dVFlowMin" class="form-item">
|
||||
<a-yjly-inputunit v-model="meterPar.dVFlowMin" :unit-type="'volumeflow'"
|
||||
:unitOrder.sync="meterPar.dVFlowUnit" :show-english-only="false" :decimal-places="5"
|
||||
:unitOrder.sync="meterPar.dVFlowUnit" :show-english-only="true" :decimal-places="5"
|
||||
:width="selectWidth" />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 常用流量 -->
|
||||
<uni-forms-item v-if="meterPar.dBqdd === '1'" label="常用流量" name="dVFlowCon" class="form-item">
|
||||
<a-yjly-inputunit v-model="meterPar.dVFlowCon" :unit-type="'volumeflow'"
|
||||
:unitOrder.sync="meterPar.dVFlowUnit" :show-english-only="false" :decimal-places="5"
|
||||
:unitOrder.sync="meterPar.dVFlowUnit" :show-english-only="true" :decimal-places="5"
|
||||
:enable-convert="true" :width="selectWidth" />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 压力量程下限 -->
|
||||
<uni-forms-item v-if="meterPar.dBqdd === '1'" label="压力量程下限" name="dPfRangeMin" class="form-item">
|
||||
<a-yjly-inputunit v-model="meterPar.dPfRangeMin" :unit-type="'pressure'"
|
||||
:unitOrder.sync="meterPar.dPfUnit" :show-english-only="false" :decimal-places="5"
|
||||
:unitOrder.sync="meterPar.dPfUnit" :show-english-only="true" :decimal-places="5"
|
||||
:width="selectWidth" />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 压力量程上限 -->
|
||||
<uni-forms-item v-if="meterPar.dBqdd === '1'" label="压力量程上限" name="dPfRangeMax" class="form-item">
|
||||
<a-yjly-inputunit v-model="meterPar.dPfRangeMax" :unit-type="'pressure'"
|
||||
:unitOrder.sync="meterPar.dPfUnit" :show-english-only="false" :decimal-places="5"
|
||||
:unitOrder.sync="meterPar.dPfUnit" :show-english-only="true" :decimal-places="5"
|
||||
:width="selectWidth" />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 差压量程下限 -->
|
||||
<uni-forms-item v-if="meterPar.dBqdd === '1'" label="差压量程下限" name="dDpRangeMin" class="form-item">
|
||||
<a-yjly-inputunit v-model="meterPar.dDpRangeMin" :unit-type="'pressure'"
|
||||
:unitOrder.sync="meterPar.dDpUnit" :show-english-only="false" :decimal-places="5"
|
||||
:unitOrder.sync="meterPar.dDpUnit" :show-english-only="true" :decimal-places="5"
|
||||
:width="selectWidth" />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 差压量程上限 -->
|
||||
<uni-forms-item v-if="meterPar.dBqdd === '1'" label="差压量程上限" name="dDpRangeMax" class="form-item">
|
||||
<a-yjly-inputunit v-model="meterPar.dDpRangeMax" :unit-type="'pressure'"
|
||||
:unitOrder.sync="meterPar.dDpUnit" :show-english-only="false" :decimal-places="5"
|
||||
:unitOrder.sync="meterPar.dDpUnit" :show-english-only="true" :decimal-places="5"
|
||||
:width="selectWidth" />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 温度计量程下限 -->
|
||||
<uni-forms-item v-if="meterPar.dBqdd === '1'" label="温度计量程下限" name="dTfRangeMin" class="form-item">
|
||||
<a-yjly-inputunit v-model="meterPar.dTfRangeMin" :unit-type="'temperature'"
|
||||
:unitOrder.sync="meterPar.dTfUnit" :show-english-only="false" :decimal-places="5"
|
||||
:unitOrder.sync="meterPar.dTfUnit" :show-english-only="true" :decimal-places="5"
|
||||
:width="selectWidth" />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 温度计量程上限 -->
|
||||
<uni-forms-item v-if="meterPar.dBqdd === '1'" label="温度计量程上限" name="dTfRangeMax" class="form-item">
|
||||
<a-yjly-inputunit v-model="meterPar.dTfRangeMax" :unit-type="'temperature'"
|
||||
:unitOrder.sync="meterPar.dTfUnit" :show-english-only="false" :decimal-places="5"
|
||||
:unitOrder.sync="meterPar.dTfUnit" :show-english-only="true" :decimal-places="5"
|
||||
:width="selectWidth" />
|
||||
</uni-forms-item>
|
||||
</view>
|
||||
@ -405,8 +405,7 @@
|
||||
});
|
||||
|
||||
// 定义 emits
|
||||
const emits = defineEmits(['update:modelValue']);
|
||||
|
||||
const emits = defineEmits(['update:modelValue'])
|
||||
// 定义响应式数据
|
||||
const selectWidth = ref(0);
|
||||
const meterPar = ref(deepClone(props.modelValue));
|
||||
@ -463,7 +462,7 @@
|
||||
<style scoped>
|
||||
/* 容器样式 */
|
||||
.form-container {
|
||||
padding: 20rpx;
|
||||
padding: 10rpx;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
}
|
||||
@ -502,9 +501,9 @@
|
||||
}
|
||||
|
||||
:deep(.uni-forms-item__label) {
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
margin-bottom: 8rpx;
|
||||
font-size: 22rpx;
|
||||
color: #868686;
|
||||
margin-bottom: 5rpx;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
@ -535,11 +534,11 @@
|
||||
}
|
||||
|
||||
:deep(.uni-forms-item__label) {
|
||||
font-size: 26rpx;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
|
||||
:deep(.uni-input-input) {
|
||||
font-size: 26rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,347 +1,363 @@
|
||||
<template>
|
||||
<view class="app-container">
|
||||
<uni-forms :modelValue="meterResult" ref="queryRef" label-position="top" :label-width="160" >
|
||||
<!-- 响应式网格容器 -->
|
||||
<view class="form-grid">
|
||||
|
||||
<!-- 标况体积流量m³/s -->
|
||||
<uni-forms-item :style="{ width: selectWidth + 'px' }" label="标况体积流量m³/s" name="dVFlowb">
|
||||
<a-yjly-inputunit
|
||||
:modelValue="meterResult.dVFlowb"
|
||||
:unit-type="'volumeflow'"
|
||||
:unitOrder.sync="meterResult.dVFlowUnit"
|
||||
:show-english-only="true"
|
||||
:decimal-places="5"
|
||||
:width="selectWidth"
|
||||
:input-disable="true"
|
||||
/>
|
||||
</uni-forms-item>
|
||||
<uni-forms :modelValue="meterResult" ref="queryRef" label-position="top" :label-width="160">
|
||||
<!-- 响应式网格容器 -->
|
||||
<view class="form-grid">
|
||||
|
||||
<!-- 工况体积流量 -->
|
||||
<uni-forms-item :style="{ width: selectWidth + 'px' }" label="工况体积流量" name="dVFlowf">
|
||||
<a-yjly-inputunit
|
||||
:modelValue="meterResult.dVFlowf"
|
||||
:unit-type="'volumeflow'"
|
||||
:unitOrder.sync="meterResult.dVFlowWorkUnit"
|
||||
:show-english-only="true"
|
||||
:decimal-places="5"
|
||||
:input-disable="true"
|
||||
:width="selectWidth"
|
||||
/>
|
||||
</uni-forms-item>
|
||||
<!-- 标况体积流量m³/s -->
|
||||
<uni-forms-item :style="{ width: selectWidth + 'px' }" label="标况体积流量m³/s" name="dVFlowb">
|
||||
<a-yjly-inputunit :modelValue="meterResult.dVFlowb" :unit-type="'volumeflow'"
|
||||
v-model:unitOrder="meterResult.dVFlowUnit" :show-english-only="true" :decimal-places="5"
|
||||
:width="selectWidth" :input-disable="true" />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 标况质量流量 -->
|
||||
<uni-forms-item :style="{ width: selectWidth + 'px' }" label="标况质量流量" name="dMFlowb">
|
||||
<a-yjly-inputunit
|
||||
:modelValue="meterResult.dMFlowb"
|
||||
:unit-type="'massflow'"
|
||||
:unitOrder.sync="meterResult.dMFlowUnit"
|
||||
:input-disable="true"
|
||||
:show-english-only="true"
|
||||
:decimal-places="5"
|
||||
:width="selectWidth"
|
||||
/>
|
||||
</uni-forms-item>
|
||||
<!-- 工况体积流量 -->
|
||||
<uni-forms-item :style="{ width: selectWidth + 'px' }" label="工况体积流量" name="dVFlowf">
|
||||
<a-yjly-inputunit :modelValue="meterResult.dVFlowf" :unit-type="'volumeflow'"
|
||||
v-model:unitOrder="meterResult.dVFlowWorkUnit" :show-english-only="true" :decimal-places="5"
|
||||
:input-disable="true" :width="selectWidth" />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 标况能量流量 -->
|
||||
<uni-forms-item :style="{ width: selectWidth + 'px' }" label="标况能量流量" name="dEFlowb">
|
||||
<a-yjly-inputunit
|
||||
:modelValue="meterResult.dEFlowb"
|
||||
:unit-type="'energyflow'"
|
||||
:unitOrder.sync="meterResult.dEFlowUnit"
|
||||
:show-english-only="true"
|
||||
:decimal-places="5"
|
||||
:width="selectWidth"
|
||||
:input-disable="true"
|
||||
/>
|
||||
</uni-forms-item>
|
||||
<!-- 求超压缩因子 E -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="超压缩因子Fz" name="dE">
|
||||
<uni-easyinput :modelValue="meterResult.dFpv" placeholder=" " disabled />
|
||||
</uni-forms-item>
|
||||
<!-- 求渐近速度系数 E -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="求渐近速度系数 E" name="dE">
|
||||
<uni-easyinput :modelValue="meterResult.dE" placeholder=" " disabled />
|
||||
</uni-forms-item>
|
||||
<!-- 标况质量流量 -->
|
||||
<uni-forms-item :style="{ width: selectWidth + 'px' }" label="标况质量流量" name="dMFlowb">
|
||||
<a-yjly-inputunit :modelValue="meterResult.dMFlowb" :unit-type="'massflow'"
|
||||
v-model:unitOrder="meterResult.dMFlowUnit" :input-disable="true" :show-english-only="true"
|
||||
:decimal-places="5" :width="selectWidth" />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 求相对密度系数 FG -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="求相对密度系数 FG" name="dFG">
|
||||
<uni-easyinput :modelValue="meterResult.dFG" placeholder=" " disabled />
|
||||
</uni-forms-item>
|
||||
<!-- 标况能量流量 -->
|
||||
<uni-forms-item :style="{ width: selectWidth + 'px' }" label="标况能量流量" name="dEFlowb">
|
||||
<a-yjly-inputunit :modelValue="meterResult.dEFlowb" :unit-type="'energyflow'"
|
||||
v-model:unitOrder="meterResult.dEFlowUnit" :show-english-only="true" :decimal-places="5"
|
||||
:width="selectWidth" :input-disable="true" />
|
||||
</uni-forms-item>
|
||||
<!-- 求超压缩因子 E -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="超压缩因子Fz"
|
||||
name="dE">
|
||||
<uni-easyinput :modelValue="meterResult.dFpv" placeholder=" " disabled />
|
||||
</uni-forms-item>
|
||||
<!-- 求渐近速度系数 E -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="求渐近速度系数 E"
|
||||
name="dE">
|
||||
<uni-easyinput :modelValue="meterResult.dE" placeholder=" " disabled />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 求流动温度系数 FT -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="求流动温度系数 FT" name="dFT">
|
||||
<uni-easyinput :modelValue="meterResult.dFT" placeholder="" disabled />
|
||||
</uni-forms-item>
|
||||
<!-- 求相对密度系数 FG -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="求相对密度系数 FG"
|
||||
name="dFG">
|
||||
<uni-easyinput :modelValue="meterResult.dFG" placeholder=" " disabled />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 求动力粘度dlnd -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="求动力粘度dlnd" name="dDViscosity">
|
||||
<uni-easyinput :modelValue="meterResult.dDViscosity" placeholder="" disabled />
|
||||
</uni-forms-item>
|
||||
<!-- 求流动温度系数 FT -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="求流动温度系数 FT"
|
||||
name="dFT">
|
||||
<uni-easyinput :modelValue="meterResult.dFT" placeholder="" disabled />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 求可膨胀系数 -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="求可膨胀系数" name="dDExpCoefficient">
|
||||
<uni-easyinput :modelValue="meterResult.dDExpCoefficient" placeholder="" disabled />
|
||||
</uni-forms-item>
|
||||
<!-- 求动力粘度dlnd -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="求动力粘度dlnd"
|
||||
name="dDViscosity">
|
||||
<uni-easyinput :modelValue="meterResult.dDViscosity" placeholder="" disabled />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 管道雷诺数 -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="管道雷诺数" name="dRnPipe">
|
||||
<uni-easyinput :modelValue="meterResult.dRnPipe" placeholder="" disabled />
|
||||
</uni-forms-item>
|
||||
<!-- 流出系数 -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="流出系数" name="dCdCorrect">
|
||||
<uni-easyinput :modelValue="meterResult.dCd" placeholder="" disabled />
|
||||
</uni-forms-item>
|
||||
<!-- 求可膨胀系数 -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="求可膨胀系数"
|
||||
name="dDExpCoefficient">
|
||||
<uni-easyinput :modelValue="meterResult.dDExpCoefficient" placeholder="" disabled />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 修正后的流出系数 -->
|
||||
<uni-forms-item v-if="dMeterType === '3'" :style="{ width: selectWidth + 'px' }" label="修正后的流出系数" name="dCdCorrect">
|
||||
<uni-easyinput :modelValue="meterResult.dCdCorrect" placeholder="" disabled />
|
||||
</uni-forms-item>
|
||||
<!-- 管道雷诺数 -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="管道雷诺数"
|
||||
name="dRnPipe">
|
||||
<uni-easyinput :modelValue="meterResult.dRnPipe" placeholder="" disabled />
|
||||
</uni-forms-item>
|
||||
<!-- 流出系数 -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="流出系数"
|
||||
name="dCdCorrect">
|
||||
<uni-easyinput :modelValue="meterResult.dCd" placeholder="" disabled />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 喷嘴的流出系数 -->
|
||||
<uni-forms-item v-if="dMeterType === '3'" :style="{ width: selectWidth + 'px' }" label="喷嘴的流出系数" name="dCdNozell">
|
||||
<uni-easyinput :modelValue="meterResult.dCdNozell" placeholder="" disabled />
|
||||
</uni-forms-item>
|
||||
<!-- 修正后的流出系数 -->
|
||||
<uni-forms-item v-if="dMeterType === '3'" :style="{ width: selectWidth + 'px' }" label="修正后的流出系数"
|
||||
name="dCdCorrect">
|
||||
<uni-easyinput :modelValue="meterResult.dCdCorrect" placeholder="" disabled />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 管道内天然气流速 -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="管道内天然气流速" name="dVelocityFlow">
|
||||
<a-yjly-inputunit
|
||||
:modelValue="meterResult.dVelocityFlow"
|
||||
:unit-type="'speed'"
|
||||
:unitOrder.sync="meterResult.dVelocityUnit"
|
||||
:show-english-only="true"
|
||||
:decimal-places="5"
|
||||
:input-disable="true"
|
||||
:width="selectWidth"
|
||||
/>
|
||||
</uni-forms-item>
|
||||
<!-- 喷嘴的流出系数 -->
|
||||
<uni-forms-item v-if="dMeterType === '3'" :style="{ width: selectWidth + 'px' }" label="喷嘴的流出系数"
|
||||
name="dCdNozell">
|
||||
<uni-easyinput :modelValue="meterResult.dCdNozell" placeholder="" disabled />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 压力损失 -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="压力损失" name="dPressLost">
|
||||
<a-yjly-inputunit
|
||||
:modelValue="meterResult.dPressLost"
|
||||
:unit-type="'pressure'"
|
||||
:unitOrder.sync="meterResult.dPressLostUnit"
|
||||
:show-english-only="true"
|
||||
:decimal-places="5"
|
||||
:input-disable="true"
|
||||
:width="selectWidth"
|
||||
/>
|
||||
</uni-forms-item>
|
||||
<!-- 管道内天然气流速 -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="管道内天然气流速"
|
||||
name="dVelocityFlow">
|
||||
<a-yjly-inputunit :modelValue="meterResult.dVelocityFlow" :unit-type="'speed'"
|
||||
v-model:unitOrder="meterResult.dVelocityUnit" :show-english-only="true" :decimal-places="5"
|
||||
:input-disable="true" :width="selectWidth" />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 直径比 -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="直径比" name="dBeta">
|
||||
<uni-easyinput :modelValue="meterResult.dBeta" placeholder="" disabled />
|
||||
</uni-forms-item>
|
||||
<!-- 压力损失 -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="压力损失"
|
||||
name="dPressLost">
|
||||
<a-yjly-inputunit :modelValue="meterResult.dPressLost" :unit-type="'pressure'"
|
||||
v-model:unitOrder="meterResult.dPressLostUnit" :show-english-only="true" :decimal-places="5"
|
||||
:input-disable="true" :width="selectWidth" />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 等熵指数 -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="等熵指数" name="dKappa">
|
||||
<uni-easyinput :modelValue="meterResult.dKappa" placeholder="" disabled />
|
||||
</uni-forms-item>
|
||||
<!-- 直径比 -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="直径比"
|
||||
name="dBeta">
|
||||
<uni-easyinput :modelValue="meterResult.dBeta" placeholder="" disabled />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 孔板锐利度系数Bk -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="孔板锐利度系数Bk" name="dBk">
|
||||
<uni-easyinput :modelValue="meterResult.dBk" placeholder="" disabled />
|
||||
</uni-forms-item>
|
||||
<!-- 等熵指数 -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="等熵指数"
|
||||
name="dKappa">
|
||||
<uni-easyinput :modelValue="meterResult.dKappa" placeholder="" disabled />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 管道粗糙度系数 Gme -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="管道粗糙度系数 Gme" name="dRoughNessPipe">
|
||||
<uni-easyinput :modelValue="meterResult.dRoughNessPipe" placeholder="" disabled />
|
||||
</uni-forms-item>
|
||||
<!-- 孔板锐利度系数Bk -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="孔板锐利度系数Bk"
|
||||
name="dBk">
|
||||
<uni-easyinput :modelValue="meterResult.dBk" placeholder="" disabled />
|
||||
</uni-forms-item>
|
||||
|
||||
<!-- 管道粗糙度系数 Gme -->
|
||||
<uni-forms-item v-if="dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="管道粗糙度系数 Gme"
|
||||
name="dRoughNessPipe">
|
||||
<uni-easyinput :modelValue="meterResult.dRoughNessPipe" placeholder="" disabled />
|
||||
</uni-forms-item>
|
||||
</view>
|
||||
</uni-forms>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, watch, onMounted } from 'vue';
|
||||
|
||||
import {
|
||||
ref,
|
||||
watch,
|
||||
onMounted
|
||||
} from 'vue';
|
||||
|
||||
// 定义 props
|
||||
const props = defineProps({
|
||||
modelValue: {
|
||||
type: Object,
|
||||
default: () => ({
|
||||
dE: 0,
|
||||
dFG: 0,
|
||||
dFT: 0,
|
||||
dDViscosity: 0,
|
||||
dDExpCoefficient: 0,
|
||||
dRnPipe: 0,
|
||||
dBk: 0,
|
||||
dRoughNessPipe: 0,
|
||||
dCdCorrect: 0,
|
||||
dCdNozell: 0,
|
||||
dVFlowb: 0,
|
||||
dVFlowf: 0,
|
||||
dVFlowUnit: 0,
|
||||
dMFlowb: 0,
|
||||
dMFlowUnit: 0,
|
||||
dEFlowb: 0,
|
||||
dEFlowUnit: 0,
|
||||
dVelocityFlow: 0,
|
||||
dVelocityUnit: 0,
|
||||
dPressLost: 0,
|
||||
dPressLostUnit: 0,
|
||||
dBeta: 0,
|
||||
dKappa: 0
|
||||
})
|
||||
},
|
||||
elFormWidth: {
|
||||
type: Number,
|
||||
default: 180
|
||||
},
|
||||
dMeterType: {
|
||||
type: String,
|
||||
default: '0'
|
||||
}
|
||||
});
|
||||
|
||||
// 定义响应式数据
|
||||
const meterResult = ref({
|
||||
dE: 0,
|
||||
dFG: 0,
|
||||
dFT: 0,
|
||||
dDViscosity: 0,
|
||||
dDExpCoefficient: 0,
|
||||
dRnPipe: 0,
|
||||
dBk: 0,
|
||||
dRoughNessPipe: 0,
|
||||
dCdCorrect: 0,
|
||||
dCdNozell: 0,
|
||||
dVFlowb: 0,
|
||||
dVFlowf: 0,
|
||||
dVFlowUnit: 0,
|
||||
dMFlowb: 0,
|
||||
dMFlowUnit: 0,
|
||||
dEFlowb: 0,
|
||||
dEFlowUnit: 0,
|
||||
dVelocityFlow: 0,
|
||||
dVelocityUnit: 0,
|
||||
dPressLost: 0,
|
||||
dPressLostUnit: 0,
|
||||
dBeta: 0,
|
||||
dKappa: 0
|
||||
});
|
||||
const selectWidth = ref(0);
|
||||
// 定义 props
|
||||
const props = defineProps({
|
||||
modelValue: {
|
||||
type: Object,
|
||||
default: () => ({
|
||||
dE: 0,
|
||||
dFG: 0,
|
||||
dFT: 0,
|
||||
dDViscosity: 0,
|
||||
dDExpCoefficient: 0,
|
||||
dRnPipe: 0,
|
||||
dBk: 0,
|
||||
dRoughNessPipe: 0,
|
||||
dCdCorrect: 0,
|
||||
dCdNozell: 0,
|
||||
dVFlowb: 0,
|
||||
dVFlowf: 0,
|
||||
dVFlowUnit: 0,
|
||||
dMFlowb: 0,
|
||||
dMFlowUnit: 0,
|
||||
dEFlowb: 0,
|
||||
dEFlowUnit: 0,
|
||||
dVelocityFlow: 0,
|
||||
dVelocityUnit: 0,
|
||||
dPressLost: 0,
|
||||
dPressLostUnit: 0,
|
||||
dBeta: 0,
|
||||
dKappa: 0
|
||||
})
|
||||
},
|
||||
elFormWidth: {
|
||||
type: Number,
|
||||
default: 180
|
||||
},
|
||||
dMeterType: {
|
||||
type: String,
|
||||
default: '0'
|
||||
}
|
||||
});
|
||||
|
||||
// 监听 elFormWidth 的变化
|
||||
watch(
|
||||
() => props.elFormWidth,
|
||||
(newVal) => {
|
||||
selectWidth.value = newVal;
|
||||
},
|
||||
{ deep: true }
|
||||
);
|
||||
// 定义响应式数据
|
||||
const meterResult = ref({
|
||||
dE: 0,
|
||||
dFG: 0,
|
||||
dFT: 0,
|
||||
dDViscosity: 0,
|
||||
dDExpCoefficient: 0,
|
||||
dRnPipe: 0,
|
||||
dBk: 0,
|
||||
dRoughNessPipe: 0,
|
||||
dCdCorrect: 0,
|
||||
dCdNozell: 0,
|
||||
dVFlowb: 0,
|
||||
dVFlowf: 0,
|
||||
dVFlowUnit: 0,
|
||||
dMFlowb: 0,
|
||||
dMFlowUnit: 0,
|
||||
dEFlowb: 0,
|
||||
dEFlowUnit: 0,
|
||||
dVelocityFlow: 0,
|
||||
dVelocityUnit: 0,
|
||||
dPressLost: 0,
|
||||
dPressLostUnit: 0,
|
||||
dBeta: 0,
|
||||
dKappa: 0
|
||||
});
|
||||
const selectWidth = ref(0);
|
||||
|
||||
// 监听 value 的变化
|
||||
watch(
|
||||
() => props.modelValue,
|
||||
(newVal) => {
|
||||
console.log(newVal);
|
||||
const processedValue = { ...newVal };
|
||||
for (const key in processedValue) {
|
||||
if (processedValue.hasOwnProperty(key)) {
|
||||
const value = processedValue[key];
|
||||
// 判断是否为有效的数值
|
||||
if (typeof value === 'number' && !isNaN(value) && isFinite(value)) {
|
||||
// 使用 toFixed 方法设置小数点位数
|
||||
processedValue[key] = parseFloat(value.toFixed(6));
|
||||
// 监听 elFormWidth 的变化
|
||||
watch(
|
||||
() => props.elFormWidth,
|
||||
(newVal) => {
|
||||
selectWidth.value = newVal;
|
||||
}, {
|
||||
deep: true
|
||||
}
|
||||
);
|
||||
|
||||
// 监听 value 的变化
|
||||
watch(
|
||||
() => props.modelValue,
|
||||
(newVal) => {
|
||||
console.log(newVal);
|
||||
const processedValue = {
|
||||
...newVal
|
||||
};
|
||||
for (const key in processedValue) {
|
||||
if (processedValue.hasOwnProperty(key)) {
|
||||
const value = processedValue[key];
|
||||
// 判断是否为有效的数值
|
||||
if (typeof value === 'number' && !isNaN(value) && isFinite(value)) {
|
||||
// 使用 toFixed 方法设置小数点位数
|
||||
processedValue[key] = parseFloat(value.toFixed(6));
|
||||
}
|
||||
}
|
||||
}
|
||||
meterResult.value = JSON.parse(JSON.stringify(processedValue));
|
||||
}, {
|
||||
deep: true
|
||||
}
|
||||
meterResult.value = JSON.parse(JSON.stringify(processedValue));
|
||||
},
|
||||
{ deep: true }
|
||||
);
|
||||
);
|
||||
|
||||
// 挂载后设置 selectWidth
|
||||
onMounted(() => {
|
||||
// 在 DOM 更新后获取宽度
|
||||
selectWidth.value = props.elFormWidth;
|
||||
});
|
||||
// 挂载后设置 selectWidth
|
||||
onMounted(() => {
|
||||
// 在 DOM 更新后获取宽度
|
||||
selectWidth.value = props.elFormWidth;
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 容器样式 */
|
||||
.form-container {
|
||||
padding: 20rpx;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
}
|
||||
.app-container {
|
||||
padding: 5rpx;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* 网格布局容器 */
|
||||
.form-grid {
|
||||
display: grid;
|
||||
gap: 24rpx;
|
||||
/* 表单项之间的间距 */
|
||||
width: 100%;
|
||||
}
|
||||
/* 网格布局容器 */
|
||||
.form-grid {
|
||||
display: grid;
|
||||
gap: 24rpx;
|
||||
/* 表单项之间的间距 */
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* 表单项基础样式 */
|
||||
.form-item {
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
/* 表单项基础样式 */
|
||||
.form-item {
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* 响应式布局 - 屏幕宽度小于768px时显示2列 */
|
||||
@media screen and (max-width: 768px) {
|
||||
.form-grid {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
}
|
||||
/* 响应式布局 - 屏幕宽度小于768px时显示2列 */
|
||||
@media screen and (max-width: 768px) {
|
||||
.form-grid {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
}
|
||||
|
||||
/* 响应式布局 - 屏幕宽度大于等于768px时显示3列 */
|
||||
@media screen and (min-width: 768px) {
|
||||
.form-grid {
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
}
|
||||
}
|
||||
/* 响应式布局 - 屏幕宽度大于等于768px时显示3列 */
|
||||
@media screen and (min-width: 768px) {
|
||||
.form-grid {
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
}
|
||||
}
|
||||
|
||||
/* 优化表单元素样式 */
|
||||
:deep(.uni-forms-item) {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
/* 优化表单元素样式 */
|
||||
:deep(.uni-forms-item) {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
|
||||
:deep(.uni-forms-item__label) {
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
margin-bottom: 8rpx;
|
||||
line-height: 1.4;
|
||||
}
|
||||
:deep(.uni-forms-item__label) {
|
||||
font-size: 22rpx;
|
||||
color: #868686;
|
||||
margin-bottom: 5rpx;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
:deep(.uni-data-select__input),
|
||||
:deep(.uni-easyinput__content),
|
||||
:deep(.a-yjly-inputunit) {
|
||||
width: 100%;
|
||||
min-height: 70rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
:deep(.uni-data-select__input),
|
||||
:deep(.uni-easyinput__content),
|
||||
:deep(.a-yjly-inputunit) {
|
||||
width: 100%;
|
||||
min-height: 70rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
:deep(.uni-input-input),
|
||||
:deep(.uni-easyinput__content input) {
|
||||
font-size: 28rpx;
|
||||
padding: 0 20rpx;
|
||||
height: 70rpx;
|
||||
line-height: 70rpx;
|
||||
}
|
||||
:deep(.uni-input-input),
|
||||
:deep(.uni-easyinput__content input) {
|
||||
font-size: 28rpx;
|
||||
padding: 0 20rpx;
|
||||
height: 70rpx;
|
||||
line-height: 70rpx;
|
||||
}
|
||||
|
||||
/* 确保小屏幕下表单不溢出 */
|
||||
@media screen and (max-width: 480px) {
|
||||
.form-container {
|
||||
padding: 10rpx;
|
||||
}
|
||||
/* 确保小屏幕下表单不溢出 */
|
||||
@media screen and (max-width: 480px) {
|
||||
.app-container {
|
||||
padding: 10rpx;
|
||||
}
|
||||
|
||||
.form-grid {
|
||||
gap: 16rpx;
|
||||
}
|
||||
.form-grid {
|
||||
gap: 16rpx;
|
||||
}
|
||||
|
||||
:deep(.uni-forms-item__label) {
|
||||
font-size: 26rpx;
|
||||
}
|
||||
:deep(.uni-forms-item__label) {
|
||||
font-size: 22rpx;
|
||||
}
|
||||
|
||||
:deep(.uni-input-input) {
|
||||
font-size: 26rpx;
|
||||
}
|
||||
}
|
||||
:deep(.uni-input-input) {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
|
||||
/* 针对输入框禁用状态的样式优化 */
|
||||
:deep(.uni-easyinput__content.is-disabled) {
|
||||
background-color: #f5f7fa;
|
||||
border-color: #e4e7ed;
|
||||
}
|
||||
|
||||
:deep(.uni-input-input:disabled) {
|
||||
background-color: #f5f7fa;
|
||||
color: #606266;
|
||||
-webkit-text-fill-color: #606266;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 自定义输入单位组件的样式调整 */
|
||||
:deep(.a-yjly-inputunit) {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
:deep(.a-yjly-inputunit .uni-easyinput__content) {
|
||||
flex: 1;
|
||||
margin-right: 8rpx;
|
||||
}
|
||||
|
||||
:deep(.a-yjly-inputunit .uni-data-select) {
|
||||
flex-shrink: 0;
|
||||
width: 120rpx;
|
||||
}
|
||||
</style>
|
||||
@ -43,7 +43,7 @@
|
||||
|
||||
export default {
|
||||
name: 'UniUnitConverter',
|
||||
emits: ['input', 'update:unitOrder', 'conversion'],
|
||||
emits: ['update:modelValue', 'update:unitOrder', 'conversion'],
|
||||
props: {
|
||||
unitType: {
|
||||
type: String,
|
||||
|
||||
Loading…
Reference in New Issue
Block a user