修改计算页面和导航方法
This commit is contained in:
parent
e1897f20ef
commit
4d23f9e9d0
@ -38,13 +38,18 @@
|
||||
try {
|
||||
const response = await listConvert(queryParams.value);
|
||||
const unitDataGrouped = groupByUnitType(response.rows);
|
||||
// #ifdef APP || APP-PLUS
|
||||
uni.setStorageSync({
|
||||
key: 'unitData',
|
||||
data: unitDataGrouped,
|
||||
data: JSON.stringify(unitDataGrouped),
|
||||
success: function() {
|
||||
console.log('缓存成功');
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
localStorage.setItem('unitData', JSON.stringify(unitDataGrouped))
|
||||
// #endif
|
||||
|
||||
} catch (error) {
|
||||
console.error('获取单位数据失败:', error);
|
||||
|
||||
@ -43,7 +43,39 @@
|
||||
/* ios打包配置 */
|
||||
"ios" : {},
|
||||
/* SDK配置 */
|
||||
"sdkConfigs" : {}
|
||||
"sdkConfigs" : {},
|
||||
"icons" : {
|
||||
"android" : {
|
||||
"hdpi" : "unpackage/res/icons/72x72.png",
|
||||
"xhdpi" : "unpackage/res/icons/96x96.png",
|
||||
"xxhdpi" : "unpackage/res/icons/144x144.png",
|
||||
"xxxhdpi" : "unpackage/res/icons/192x192.png"
|
||||
},
|
||||
"ios" : {
|
||||
"appstore" : "unpackage/res/icons/1024x1024.png",
|
||||
"ipad" : {
|
||||
"app" : "unpackage/res/icons/76x76.png",
|
||||
"app@2x" : "unpackage/res/icons/152x152.png",
|
||||
"notification" : "unpackage/res/icons/20x20.png",
|
||||
"notification@2x" : "unpackage/res/icons/40x40.png",
|
||||
"proapp@2x" : "unpackage/res/icons/167x167.png",
|
||||
"settings" : "unpackage/res/icons/29x29.png",
|
||||
"settings@2x" : "unpackage/res/icons/58x58.png",
|
||||
"spotlight" : "unpackage/res/icons/40x40.png",
|
||||
"spotlight@2x" : "unpackage/res/icons/80x80.png"
|
||||
},
|
||||
"iphone" : {
|
||||
"app@2x" : "unpackage/res/icons/120x120.png",
|
||||
"app@3x" : "unpackage/res/icons/180x180.png",
|
||||
"notification@2x" : "unpackage/res/icons/40x40.png",
|
||||
"notification@3x" : "unpackage/res/icons/60x60.png",
|
||||
"settings@2x" : "unpackage/res/icons/58x58.png",
|
||||
"settings@3x" : "unpackage/res/icons/87x87.png",
|
||||
"spotlight@2x" : "unpackage/res/icons/80x80.png",
|
||||
"spotlight@3x" : "unpackage/res/icons/120x120.png"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
/* 快应用特有相关 */
|
||||
|
||||
@ -229,6 +229,7 @@
|
||||
]
|
||||
},
|
||||
{
|
||||
|
||||
"root": "pages_geek/pages",
|
||||
"pages": [
|
||||
{
|
||||
@ -241,7 +242,21 @@
|
||||
"path": "upload/index"
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
{
|
||||
|
||||
"root": "pages_caltools/pages",
|
||||
"pages": [
|
||||
{
|
||||
"path": "index"
|
||||
},
|
||||
{
|
||||
"path": "main"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
|
||||
],
|
||||
"tabBar": {
|
||||
"color": "#000000",
|
||||
|
||||
@ -12,7 +12,7 @@
|
||||
ref,
|
||||
onMounted
|
||||
} from 'vue';
|
||||
import NGCalTools from '@/pages_NGCalTools/pages/index'
|
||||
import NGCalTools from '@/pages_caltools/pages/index'
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
@ -425,9 +425,9 @@
|
||||
watch(
|
||||
() => meterPar.value,
|
||||
(newVal) => {
|
||||
console.log(11111, newVal)
|
||||
// console.log(11111, newVal)
|
||||
if (!isObjectEqual(newVal, props.modelValue)) {
|
||||
console.log('Emit to parent', newVal);
|
||||
// console.log('Emit to parent', newVal);
|
||||
emits('update:modelValue', deepClone(newVal));
|
||||
}
|
||||
}, {
|
||||
159
ruoyi-geek-app/pages_caltools/pages/index.vue
Normal file
159
ruoyi-geek-app/pages_caltools/pages/index.vue
Normal file
@ -0,0 +1,159 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
|
||||
<!-- Swiper 组件,用于在不同计算分组间滑动 -->
|
||||
<swiper class="calc-swiper" :current="currentTab" @change="handleSwiperChange" indicator-dots
|
||||
indicator-color="#BBBBBB" indicator-active-color="#007AFF">
|
||||
<!-- 遍历分组数据,动态生成 swiper-item -->
|
||||
<swiper-item v-for="(group, groupIndex) in calcGroups" :key="groupIndex">
|
||||
<!-- 3x3 宫格布局 -->
|
||||
<view class="page-header">{{group.name}}</view>
|
||||
<uni-grid :column-num="3" :show-border="true" border-color="#EEEEEE">
|
||||
<!-- 遍历每个分组下的功能项,动态生成宫格 -->
|
||||
<uni-grid-item class="grid-item" v-for="(item, itemIndex) in group.items" :key="itemIndex"
|
||||
@click="navigateToCalc(item)">
|
||||
<view class="grid-icon">
|
||||
<uni-icons :type="item.icon" size="32" :color="group.color"></uni-icons>
|
||||
</view>
|
||||
<view class="grid-text">{{ item.name }}</view>
|
||||
</uni-grid-item>
|
||||
</uni-grid>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref
|
||||
} from 'vue';
|
||||
import {
|
||||
useRouter
|
||||
} from 'vue-router'; // Vue 3 推荐使用 vue-router
|
||||
|
||||
// 响应式数据:当前激活的 Swiper 标签索引
|
||||
const currentTab = ref(0);
|
||||
|
||||
// 路由实例
|
||||
const router = useRouter();
|
||||
// 核心数据:计算分组和功能项定义
|
||||
const calcGroups = [{
|
||||
name: '流量计算',
|
||||
color: '#007AFF',
|
||||
items: [{
|
||||
name: '差压式流量计算',
|
||||
icon: 'flow',
|
||||
dMeterType:0
|
||||
},
|
||||
{
|
||||
name: '速度式流量计算',
|
||||
icon: 'speedometer',
|
||||
dMeterType:1
|
||||
},
|
||||
|
||||
]
|
||||
},
|
||||
{
|
||||
name: '参数计算',
|
||||
color: '#5AC8FA',
|
||||
items: [{
|
||||
name: '压缩因子',
|
||||
icon: 'compress',
|
||||
dMeterType:4
|
||||
},
|
||||
{
|
||||
name: '声速计算',
|
||||
icon: 'fire',
|
||||
dMeterType:5
|
||||
},
|
||||
{
|
||||
name: '发热量',
|
||||
icon: 'volume-high',
|
||||
dMeterType:6
|
||||
},
|
||||
{
|
||||
name: '其他参数',
|
||||
icon: 'density',
|
||||
dMeterType:7
|
||||
}
|
||||
]
|
||||
}
|
||||
];
|
||||
|
||||
/**
|
||||
* 处理 Swiper 滑动切换事件
|
||||
* @param {Object} e 事件对象
|
||||
*/
|
||||
const handleSwiperChange = (e) => {
|
||||
currentTab.value = e.detail.current;
|
||||
};
|
||||
|
||||
/**
|
||||
* 导航到具体的计算页面
|
||||
* @param {Object} group 当前点击的分组对象
|
||||
* @param {number} itemIndex 点击项在分组内的索引
|
||||
*/
|
||||
const navigateToCalc = (item) => {
|
||||
const dMeterType = item.dMeterType;
|
||||
|
||||
console.log(`导航到计算页面,dMeterType: ${dMeterType}`);
|
||||
|
||||
// 使用 UniApp 原生导航 API
|
||||
uni.navigateTo({
|
||||
// 注意:路径前要加 '/',并且 query 参数直接拼接在 URL 后面
|
||||
url: `/pages_caltools/pages/main?dMeterType=${dMeterType}`
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.container {
|
||||
padding: 16px;
|
||||
background-color: #F5F5F5;
|
||||
box-sizing: border-box;
|
||||
min-height: 100vh;
|
||||
/* 使用 min-height 确保在内容不足时也占满屏幕 */
|
||||
}
|
||||
|
||||
.page-header {
|
||||
font-size: 18px;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.calc-swiper {
|
||||
/* 关键:让 swiper 占满剩余空间 */
|
||||
width: calc(100vw - 100px);
|
||||
;
|
||||
height: calc(100vh - 70px);
|
||||
}
|
||||
|
||||
/* 确保宫格充满父容器 */
|
||||
uni-grid {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.grid-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
.grid-icon {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.grid-text {
|
||||
font-size: 10px;
|
||||
color: #333333;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
</style>
|
||||
@ -32,7 +32,7 @@
|
||||
watch
|
||||
} from 'vue';
|
||||
import {
|
||||
onLoad
|
||||
onLoad,onShow
|
||||
} from '@dcloudio/uni-app';
|
||||
import meterPar from '../components/meterPar';
|
||||
import ngComponents from '../components/NGCom';
|
||||
@ -49,7 +49,6 @@
|
||||
const btnText = ref('');
|
||||
const elFormItemWidth = ref(160);
|
||||
const elFormItemWidthmin = ref(140);
|
||||
const activeTab = ref('meterpar');
|
||||
const isShowMessage = ref(false);
|
||||
const message = ref('');
|
||||
const parentMeterPar = ref({
|
||||
@ -188,13 +187,14 @@
|
||||
const dMeterType = ref('0');
|
||||
|
||||
//在页面加载时获取参数
|
||||
onMounted(() => {
|
||||
// if (options.dMeterType) {
|
||||
dMeterType.value ='0';// options.dMeterType;
|
||||
parentMeterPar.value.dMeterType = '0';//dMeterType.value;
|
||||
// }
|
||||
onLoad((options) => {
|
||||
if (options.dMeterType) {
|
||||
dMeterType.value = options.dMeterType;
|
||||
parentMeterPar.value.dMeterType = dMeterType.value;
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
// 监听 dMeterType 的变化
|
||||
watch(dMeterType, (newValue) => {
|
||||
if (['0', '1', '2', '3'].includes(newValue)) {
|
||||
@ -241,7 +241,7 @@
|
||||
if (parentMeterPar.value.dngComponents === '') {
|
||||
message.value = '组分为空,请输入天然气组分!';
|
||||
showMessage();
|
||||
activeTab.value = 'ngComponents';
|
||||
current.value = 1;
|
||||
return;
|
||||
}
|
||||
// 清空 parentNGResult 的值
|
||||
@ -253,7 +253,7 @@
|
||||
try {
|
||||
const res = await calcNGPar(parentMeterPar.value);
|
||||
parentNGResult.value = res.data;
|
||||
activeTab.value = 'meterresult';
|
||||
current.value = 2;
|
||||
console.log('Response:', res);
|
||||
} catch (error) {
|
||||
console.error('Request error:', error);
|
||||
@ -270,7 +270,7 @@
|
||||
if (parentMeterPar.value.dngComponents === '') {
|
||||
message.value = '组分为空,请输入天然气组分!';
|
||||
showMessage();
|
||||
activeTab.value = 'ngComponents';
|
||||
current.value = 1;
|
||||
return;
|
||||
}
|
||||
// 清空 parentMeterResult 的值
|
||||
@ -283,7 +283,7 @@
|
||||
const res = await calcFlow(parentMeterPar.value);
|
||||
parentMeterResult.value = res.data[0];
|
||||
console.log('Response:', parentMeterResult.value);
|
||||
activeTab.value = 'meterresult';
|
||||
current.value = 2;
|
||||
} catch (error) {
|
||||
console.error('Request error:', error);
|
||||
uni.showToast({
|
||||
BIN
ruoyi-geek-app/static/caltools/DpMeter.jpg
Normal file
BIN
ruoyi-geek-app/static/caltools/DpMeter.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.8 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 30 KiB |
@ -192,9 +192,15 @@
|
||||
// 后台的API可自行开发,这里提供了js数据格式
|
||||
// const res = await listSysUnitConvert({ unitType: unitType, status: 'Y' });
|
||||
// this.unitData = res.rows;
|
||||
const tempData=uni.getStorageSync("unitData")
|
||||
// console.log(JSON.stringify(tempData));
|
||||
var unitDatalist = ( tempData);
|
||||
var tempData = [];
|
||||
// #ifdef APP || APP-PLUS
|
||||
tempData = uni.getStorageSync("unitData");
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
tempData = localStorage.getItem("unitData");
|
||||
// #endif
|
||||
// console.log((tempData));
|
||||
var unitDatalist = JSON.parse(tempData);
|
||||
// console.log(unitDatalist);
|
||||
this.unitData = unitDatalist[unitType];
|
||||
// console.log(this.unitData);
|
||||
|
||||
Loading…
Reference in New Issue
Block a user