<view style="margin:15px">
<van-row>
<van-col span="20">
<van-field value="{{ name }}" border="{{ false }}" disabled is-link bindtap="showPopup" label="传感器类别："/>
</van-col>
<van-col span="4">
<van-button type="primary" size="small" style=" line-height: 90rpx;" bindtap="getCategoryArr">查询</van-button>
</van-col>
</van-row>
<view class="table" style="margin-top:15px">
<view class="tr">
<view class="th">参数</view>
<view class="th" wx:for="{{headerList}}" wx:key="{{item1}}">{{item.title}}</view>
</view>
<view class="tr" wx:for="{{bodyList}}" wx:key="{{item2}}" data-index="{{index}}">
<view class="td" wx:if="{{index==0}}">最大值</view>
<view class="td" wx:if="{{index==1}}">最小值</view>
<view class="td" wx:if="{{index==2}}">典型值</view>
<view class="td" wx:if="{{index==3}}">单位</view>
<view class="td" wx:if="{{index==4}}">精度</view>
<view class="td" wx:if="{{item.param0}}">{{item.param0}}</view>
<view class="td" wx:if="{{item.param1}}">{{item.param1}}</view>
<view class="td" wx:if="{{item.param2}}">{{item.param2}}</view>
</view>
</view>
.js
const api = require('../../utils/api.js') // 引入api接口管理文件
Page({
data: {
headerList: [], //表头
bodyList: [], //表身体
categoryArr: [],
// //弹出层控制
show: false,
id: '',
name: '',
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (option) {
this.getinfo()
this.getCategoryArr()
},
// 获取 下拉框信息
getinfo() {
api._get('/oil/queryTranList/' + wx.getStorageSync('userId'), {}).then(res => {
console.log(res)
let arr = []
res.bodyList.forEach((item, index) => {
for (const key in item) {
item[key] = item[key] ? item[key] : '-'
}
arr.push(item)
})
this.setData({
name: res.tranList[0].name,
headerList: Object.assign([], res.headerList),
bodyList: Object.assign([], arr),
categoryArr: Object.assign([], res.tranList),
})
}).catch(e => {
console.log(e)
})
},
// 查询获取
getCategoryArr() {
api._get('/oil/tranInfo/' + this.data.id, ).then(res => {
let arr = []
res.bodyList.forEach((item, index) => {
for (const key in item) {
item[key] = item[key] ? item[key] : '-'
}
arr.push(item)
})
this.setData({
headerList: Object.assign([], res.headerList),
bodyList: Object.assign([], res.bodyList),
})
}).catch(e => {
console.log(e)
})
},
//选择器 点击完成按钮时触发
onConfirm(event) {
this.setData({
'id': event.detail.value.id,
'name': event.detail.value.name,
show: false,
});
},
//选择器 点击取消按钮时触发
categoryOnClose() {
this.setData({
show: false
});
},
//点击触发弹出框
showPopup() {
this.setData({
show: true
});
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
},
})
.wxss
page {
height: 100%; font-size: 30rpx;
}
/* table */
.table {
border: 1px solid #dadada;
border-right: 0;
border-bottom: 0;
width: 98%;
font-size: 30rpx;
}
.tr {
width: 100%;
display: flex;
justify-content: space-between;
}
.th,
.td {
padding: 10px;
border-bottom: 1px solid #dadada;
border-right: 1px solid #dadada;
text-align: center;
width: 100%
}
.th {
font-weight: 400;
background-color: #dadada
}
/* */
.dynamic {
margin-top: 15rpx;
width: 100%;
background: white;
}
.van-field__label--disabled {
color: #646566 !important;
}
.van-field__control {
color: #323233 !important;
}
.boxxx {
width:100%;
height:600rpx;
background-color: dadada;
}
