zly/electricity_bill_calc_wx
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

导入抄表记录完成电表列表部分（未调试）

Browse Source
This commit is contained in:
qiaomu
2025-09-08 17:31:03 +08:00
parent 71ad4995c8
commit 70737fa2b8
16 changed files with 249 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
pages/writeReading/components/meterList/components/meterItem/index.js Normal file
View File

@@ -0,0 +1,32 @@
// pages/writeReading/components/meterList/components/meterItem/index.js
Component({
/**
* 组件的属性列表
*/
properties: {
active: Boolean,
},
observers: {
"active": function (newValue) {
this.setData({
isDeep: newValue
})
}
},
/**
* 组件的初始数据
*/
data: {
},
/**
* 组件的方法列表
*/
methods: {
onClick: function() {
this.triggerEvent("click")
}
}
})

4
pages/writeReading/components/meterList/components/meterItem/index.json Normal file
View File

@@ -0,0 +1,4 @@
{
"component": true,
"usingComponents": {}
}

4
pages/writeReading/components/meterList/components/meterItem/index.wxml Normal file
View File

@@ -0,0 +1,4 @@
<!--pages/writeReading/components/meterList/components/meterItem/index.wxml-->
<view class="wrapper {{isDeep ? 'deepBg' : ''}}" bind:tap="onClick">
标1东-3071312452636756756857
</view>

22
pages/writeReading/components/meterList/components/meterItem/index.wxss Normal file
View File

@@ -0,0 +1,22 @@
/* pages/writeReading/components/meterList/components/meterItem/index.wxss */
.wrapper {
border-radius: 20rpx;
padding: 20rpx;
margin-bottom: 30rpx;
width: 200rpx;
box-sizing: border-box;
margin-right: 20rpx;
background-color: white;
word-break: break-all;
overflow: hidden;
font-size: 32rpx;
height: 150rpx;
display: flex;
align-items: center;
}
.deepBg {
background-color: var(--deep-green);
color: white;
}

30
pages/writeReading/components/meterList/index.js
View File

@@ -13,7 +13,7 @@ Component({
*/
data: {
animationData: {}, // 存储动画数据
position: -100
position: 0
},
lifetimes: {
attached() {
@@ -31,11 +31,35 @@ Component({
methods: {
handleLeft() {
// 将动画数据设置到 data 中，从而触发视图更新
const currentPosition = this.data.position
if (currentPosition === 0) {
this.setData({
position: currentPosition,
});
return;
}
this.setData({
position: this.data.position - 100,
position: this.data.position + 300,
});
},
handleRight() {
// // 将动画数据设置到 data 中，从而触发视图更新
// const currentPosition = this.data.position
// if (currentPosition === 0) {
// this.setData({
// position: currentPosition,
// });
// return;
// }
this.setData({
position: this.data.position - 300,
});
},
onChangeMeter() {
console.log("---------------")
}
}
})

3
pages/writeReading/components/meterList/index.json
View File

@@ -1,6 +1,7 @@
{
"component": true,
"usingComponents": {
"van-icon": "@vant/weapp/icon/index",
"meter-item": "./components/meterItem/index"
}
}

23
pages/writeReading/components/meterList/index.wxml
View File

@@ -4,21 +4,26 @@
<view class="title">
<text> 电表列表 </text>
</view>
<view style="display: flex; align-items: center;">
<view bind:tap="handleLeft">
左
</view>
<view style="display: flex; align-items: center;margin-top: 20rpx;">
<van-icon name="arrow-left" size="50rpx" bind:tap="handleLeft" />
<scroll-view
scroll-x="{{true}}"
class="meterListScrollView"
>
<view style="width: 1000px; margin-left: {{position}}rpx">
12345623425346356356356 12345623425346356356356 12345623425346356356356 12345623425346356356356
<view style="margin-left: {{position}}rpx; display: flex;">
<meter-item active="{{true}}" />
<meter-item active="{{false}}" bind:click="onChangeMeter" />
<meter-item active="{{false}}" />
<meter-item active="{{false}}" />
<meter-item active="{{false}}" />
<meter-item active="{{false}}" />
<meter-item active="{{false}}" />
<meter-item active="{{false}}" />
<meter-item active="{{false}}" />
<meter-item active="{{false}}" />
</view>
</scroll-view>
<view>
右
</view>
<van-icon name="arrow" size="50rpx" bind:tap="handleRight" />
</view>
</view>

8
pages/writeReading/components/meterList/index.wxss
View File

@@ -1,7 +1,7 @@
/* pages/writeReading/components/meterList/index.wxss */
.wrapper {
padding: 0 20rpx;
padding: 0 20rpx 20rpx;
}
.title {
@@ -12,5 +12,9 @@
flex: 1;
margin-left: 20rpx;
margin-right: 20rpx;
overflow: hidden;
overflow-x: hidden;
}
page {
background-color: #ebedf0;
}