Browse Source

feat:首页+子系统静态代码

master
zhaobing’ 1 year ago
parent
commit
404bf5b1a3
  1. 11
      weapp/app.json
  2. BIN
      weapp/images/check.png
  3. BIN
      weapp/images/elevator.png
  4. BIN
      weapp/images/sevenDays.png
  5. BIN
      weapp/images/tabBar/icon_home.png
  6. BIN
      weapp/images/tabBar/icon_home_active.png
  7. BIN
      weapp/images/xunjian.png
  8. 66
      weapp/package/homePage/homePage.js
  9. 3
      weapp/package/homePage/homePage.json
  10. 2
      weapp/package/homePage/homePage.wxml
  11. 1
      weapp/package/homePage/homePage.wxss
  12. 182
      weapp/package/subSystem/subSystem.js
  13. 5
      weapp/package/subSystem/subSystem.json
  14. 15
      weapp/package/subSystem/subSystem.wxml
  15. 23
      weapp/package/subSystem/subSystem.wxss
  16. 59
      weapp/pages/home/home.js
  17. 55
      weapp/pages/home/home.wxml
  18. 17
      weapp/pages/home/home.wxss

11
weapp/app.json

@ -20,8 +20,8 @@
"troubleshooting/shootingForm/index",
"inspectionReport/inspectionReport",
"pointsStatus/pointsStatus",
"homePage/homePage",
"pie/index"
"pie/index",
"subSystem/subSystem"
]
}
],
@ -54,11 +54,12 @@
"iconPath": "images/tabBar/icon_person.png",
"selectedIconPath": "images/tabBar/icon_person_active.png",
"text": "我的"
},
}
,
{
"pagePath": "pages/home/home",
"iconPath": "images/tabBar/icon_polling.png",
"selectedIconPath": "images/tabBar/icon_polling_active.png",
"iconPath": "/images/tabBar/icon_home.png",
"selectedIconPath": "/images/tabBar/icon_home_active.png",
"text": "首页"
}
]

BIN
weapp/images/check.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

BIN
weapp/images/elevator.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
weapp/images/sevenDays.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

BIN
weapp/images/tabBar/icon_home.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 KiB

BIN
weapp/images/tabBar/icon_home_active.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 517 B

BIN
weapp/images/xunjian.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

66
weapp/package/homePage/homePage.js

@ -1,66 +0,0 @@
// package/homePage/homePage.js
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage() {
}
})

3
weapp/package/homePage/homePage.json

@ -1,3 +0,0 @@
{
"usingComponents": {}
}

2
weapp/package/homePage/homePage.wxml

@ -1,2 +0,0 @@
<!--package/homePage/homePage.wxml-->
<text>package/homePage/homePage.wxml</text>

1
weapp/package/homePage/homePage.wxss

@ -1 +0,0 @@
/* package/homePage/homePage.wxss */

182
weapp/package/subSystem/subSystem.js

@ -0,0 +1,182 @@
// package/subSystem/subSystem.js
import * as echarts from 'echarts' // 从 npm 引入 echarts
let chart = null;
function initChart(canvas, width, height, dpr) {
chart = echarts.init(canvas, null, {
width: width,
height: height,
devicePixelRatio: dpr // new
});
canvas.setChart(chart);
var option = {
tooltip: {
trigger: 'axis',
axisPointer: { // 坐标轴指示器,坐标轴触发有效
type: 'shadow' // 默认为直线,可选为:'line' | 'shadow'
},
confine: true
},
legend: {
data: ['热度', '正面', '负面']
},
grid: {
left: 20,
right: 20,
bottom: 15,
top: 40,
containLabel: true
},
xAxis: [
{
type: 'value',
axisLine: {
lineStyle: {
color: '#999'
}
},
axisLabel: {
color: '#666'
}
}
],
yAxis: [
{
type: 'category',
axisTick: { show: false },
data: ['汽车之家', '今日头条', '百度贴吧', '一点资讯', '微信', '微博', '知乎'],
axisLine: {
lineStyle: {
color: '#999'
}
},
axisLabel: {
color: '#666'
}
}
],
series: [
{
name: '热度',
type: 'bar',
label: {
normal: {
show: true,
position: 'inside'
}
},
data: [300, 270, 340, 344, 300, 320, 310],
itemStyle: {
// emphasis: {
// color: '#37a2da'
// }
}
},
{
name: '正面',
type: 'bar',
stack: '总量',
label: {
normal: {
show: true
}
},
data: [120, 102, 141, 174, 190, 250, 220],
itemStyle: {
// emphasis: {
// color: '#32c5e9'
// }
}
},
{
name: '负面',
type: 'bar',
stack: '总量',
label: {
normal: {
show: true,
position: 'left'
}
},
data: [-20, -32, -21, -34, -90, -130, -110],
itemStyle: {
// emphasis: {
// color: '#67e0e3'
// }
}
}
]
};
chart.setOption(option);
return chart;
}
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
wx.setNavigationBarTitle({
title: options.key,
});
// 其他渲染逻辑
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage() {
}
})

5
weapp/package/subSystem/subSystem.json

@ -0,0 +1,5 @@
{
"usingComponents": {
}
}

15
weapp/package/subSystem/subSystem.wxml

@ -0,0 +1,15 @@
<!--package/subSystem/subSystem.wxml-->
<view style="display: flex;justify-content: space-around;padding-top: 10px; background-image: linear-gradient(179deg, #006BE3 0%, #4E87FF 16%, #4e87ff00 93%);">
<view>
<view>本月巡检次数</view>
<view class="number">0</view>
</view>
<view>
<view>本月维修次数</view>
<view class="number">0</view>
</view>
</view>
<view class="card">
<ec-canvas id="mychart-dom-bar" canvas-id="mychart-bar" echarts="{{ echarts }}" ec="{{ ec }}"></ec-canvas>
</view>

23
weapp/package/subSystem/subSystem.wxss

@ -0,0 +1,23 @@
/* package/subSystem/subSystem.wxss */
.number{
width: 40px;
height: 26px;
font-family: D-DINExp;
font-weight: DINExp;
font-size: 24px;
color: #FFFFFF;
letter-spacing: 0;
}
.card {
font-family: PingFangSC-Medium;
font-weight: 500;
font-size: 16px;
color: #333333;
background-color: #fff;
border: 1px solid #ddd;
border-radius: 8px;
padding: 10px 0px;
margin: 5px 5px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

59
weapp/pages/home/home.js

@ -1,10 +1,58 @@
// pages/home/home.js
Page({
jumpToSubSystem (options) {
console.log('1sadsdasd',options)
const key = options.currentTarget.dataset.key;
wx.navigateTo({
url: `/package/subSystem/subSystem?key=${key}`,
})
},
/**
* 页面的初始数据
*/
data: {
itemList:[{
picPath:'/images/conduct.png',
itemName:'指挥中心'
},
{
picPath:'/images/waterSupply.png',
itemName:'给水仓'
},
{
picPath:'/images/pipeGallery.png',
itemName:'管廊本体'
},
{
picPath:'/images/elevator.png',
itemName:'电梯系统'
},
{
picPath:'/images/power.png',
itemName:'供配电系统'
},
{
picPath:'/images/gas.png',
itemName:'燃气仓'
},
{
picPath:'/images/security.png',
itemName:'安防系统'
},
{
picPath:'/images/highTension.png',
itemName:'高压电力仓'
},
{
picPath:'/images/electricalStorageRoom.png',
itemName:'电气仓'
},
{
picPath:'/images/lightningProtection.png',
itemName:'防雷与接地'
}
],
},
@ -12,9 +60,14 @@ Page({
* 生命周期函数--监听页面加载
*/
onLoad (options) {
const {windowHeight}=wx.getSystemInfoSync()
const pageHeight=windowHeight - 48
this.setData({
pageHeight:pageHeight+'px'
})
console.log('xxxx',pageHeight)
},
/**
* 生命周期函数--监听页面初次渲染完成
*/

55
weapp/pages/home/home.wxml

@ -1,5 +1,52 @@
<!--pages/home/home.wxml-->
<view>
<image src="/images/email.svg" />
</view>
<text>pages/home/home.wxml</text>
<view style="height:{{pageHeight}} ; overflow: auto;">
<!--顶部图片-->
<view class="top">
<image src="/images/email.svg" style="width: 100px;height: 100px;" />
</view>
<!--子系统列表-->
<view class="list card" style="display: flex; flex-wrap: wrap;">
<view style="min-width: 25%; margin: 10px 0px;text-align: center;" wx:for="{{itemList}}" wx:for-item="item" wx:key="*this" data-key="{{item.itemName}}" bindtap="jumpToSubSystem">
<image src="{{item.picPath}}" style="width: 29.97px;height: 28.93px;" />
<view>{{item.itemName}}</view>
</view>
</view>
<!--最近7天统计-->
<view class="card">
最近7天统计
<view style="background-image:url('/images/sevenDays.png');width: 100%; height: 99px; background-repeat: no-repeat;display: flex">
<view>
<image src="/images/check.png" style="width:36px;height:36px;margin:40px 10px 20px 10px" />
</view>
<view style="margin:40px 10px 20px 10px">
<view>巡检次数</view>
<view>次</view>
</view>
</view>
<view style="display: flex; justify-content: space-around;">
<view style="margin:10px 0px;">发现问题个数</view>
<view style="margin:10px 0px;">个</view>
<view style="margin:10px 0px;">发现问题个数</view>
<view style="margin:10px 0px;">个</view>
</view>
</view>
<!--总巡巡检统计-->
<view class="card">
总巡巡检统计
<view style="background-image:url('/images/xunjian.png');width: 100%; height: 99px; background-repeat: no-repeat;display: flex;">
<view>
<image src="/images/check.png" style="width:36px;height:36px;margin:40px 10px 20px 10px" />
</view>
<view style="margin:40px 10px 20px 10px">
<view>巡检次数</view>
<view>次</view>
</view>
</view>
<view style="display: flex; justify-content: space-around;">
<view style="margin:10px 0px;">发现问题个数</view>
<view style="margin:10px 0px;">个</view>
<view style="margin:10px 0px;">发现问题个数</view>
<view style="margin:10px 0px;">个</view>
</view>
</view>
</view>

17
weapp/pages/home/home.wxss

@ -1 +1,16 @@
/* pages/home/home.wxss */
/* pages/home/home.wxss */
.list {
font-family: PingFangSC-Regular;
font-weight: 400;
font-size: 12px;
color: #333333;
letter-spacing: 0;
}
.card {
background-color: #fff;
border: 1px solid #ddd;
border-radius: 8px;
/* padding: 10px; */
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
margin: 10px;
}
Loading…
Cancel
Save