feat 项目页样式
This commit is contained in:
5
.gitignore
vendored
5
.gitignore
vendored
@@ -12,6 +12,7 @@ node_modules
|
|||||||
dist
|
dist
|
||||||
*.local
|
*.local
|
||||||
.opencode
|
.opencode
|
||||||
|
.omo
|
||||||
|
|
||||||
# Editor directories and files
|
# Editor directories and files
|
||||||
.idea
|
.idea
|
||||||
@@ -20,7 +21,3 @@ dist
|
|||||||
*.njsproj
|
*.njsproj
|
||||||
*.sln
|
*.sln
|
||||||
*.sw?
|
*.sw?
|
||||||
|
|
||||||
# unh
|
|
||||||
pages.json
|
|
||||||
manifest.json
|
|
||||||
|
|||||||
@@ -93,4 +93,3 @@ Road_roller/
|
|||||||
| `src/utils` | 工具函数,自动导入 |
|
| `src/utils` | 工具函数,自动导入 |
|
||||||
|
|
||||||
### 功能模块
|
### 功能模块
|
||||||
标题字体是22px
|
|
||||||
|
|||||||
@@ -1,38 +1,95 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
defineProps<{
|
defineProps<{
|
||||||
projectName: string
|
projectName: string
|
||||||
status: string
|
stakeRange: string
|
||||||
tags: string[]
|
status: number
|
||||||
time: string
|
workTime: string
|
||||||
trigger: string
|
compactArea: string
|
||||||
|
rollerCount: string
|
||||||
}>()
|
}>()
|
||||||
|
|
||||||
|
function getStatusText(status: number) {
|
||||||
|
const map: Record<number, string> = {
|
||||||
|
0: '作业中',
|
||||||
|
1: '暂停中',
|
||||||
|
2: '已结束',
|
||||||
|
}
|
||||||
|
return map[status] || '未知'
|
||||||
|
}
|
||||||
|
|
||||||
|
function getStatusColor(status: number) {
|
||||||
|
const map: Record<number, string> = {
|
||||||
|
0: '#52c41a',
|
||||||
|
1: '#faad14',
|
||||||
|
2: '#999999',
|
||||||
|
}
|
||||||
|
return map[status] || '#999999'
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<view class="project-item">
|
<view class="project-item">
|
||||||
|
<!-- 头部:图标 + 项目名 + 状态 -->
|
||||||
<view class="item-header">
|
<view class="item-header">
|
||||||
<text class="project-name">
|
<view class="header-left">
|
||||||
{{ projectName }}
|
<image class="project-icon" src="/static/machine.png" mode="aspectFit" />
|
||||||
</text>
|
<view class="header-info">
|
||||||
<text class="status">
|
<text class="project-name">
|
||||||
{{ status }}
|
{{ projectName }}
|
||||||
</text>
|
</text>
|
||||||
</view>
|
<text class="stake-range">
|
||||||
|
{{ stakeRange }}
|
||||||
<view class="tags">
|
</text>
|
||||||
<view v-for="(tag, index) in tags" :key="index" class="tag">
|
</view>
|
||||||
<text class="tag-text">
|
</view>
|
||||||
{{ tag }}
|
<view class="status-badge">
|
||||||
|
<view class="status-dot" :style="{ backgroundColor: getStatusColor(status) }" />
|
||||||
|
<text class="status-text" :style="{ color: getStatusColor(status) }">
|
||||||
|
{{ getStatusText(status) }}
|
||||||
</text>
|
</text>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<text class="time">
|
<!-- 数据统计 -->
|
||||||
{{ time }}
|
<view class="stats-row">
|
||||||
</text>
|
<view class="stat-item">
|
||||||
<text class="trigger">
|
<text class="stat-label">
|
||||||
{{ trigger }}
|
作业时长
|
||||||
</text>
|
</text>
|
||||||
|
<text class="stat-value">
|
||||||
|
{{ workTime }}
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
<view class="stat-item">
|
||||||
|
<text class="stat-label">
|
||||||
|
压实面积
|
||||||
|
</text>
|
||||||
|
<text class="stat-value">
|
||||||
|
{{ compactArea }}
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
<view class="stat-item">
|
||||||
|
<text class="stat-label">
|
||||||
|
碾压遍数
|
||||||
|
</text>
|
||||||
|
<text class="stat-value">
|
||||||
|
{{ rollerCount }}
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 操作按钮 -->
|
||||||
|
<view v-if="status === 0 || status === 1" class="btn-row">
|
||||||
|
<wd-button size="large" type="primary" round>
|
||||||
|
开始项目
|
||||||
|
</wd-button>
|
||||||
|
<wd-button size="large" type="warning" round>
|
||||||
|
暂停项目
|
||||||
|
</wd-button>
|
||||||
|
<wd-button size="large" type="danger" round>
|
||||||
|
结束项目
|
||||||
|
</wd-button>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -47,49 +104,85 @@ defineProps<{
|
|||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
margin-bottom: 12px;
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-left {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.project-icon {
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-info {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
|
||||||
.project-name {
|
.project-name {
|
||||||
font-size: 22px;
|
font-size: 40rpx;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
color: #333;
|
color: #333;
|
||||||
}
|
}
|
||||||
|
|
||||||
.status {
|
.stake-range {
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
|
||||||
|
.status-badge {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.status-dot {
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background-color: #52c41a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.status-text {
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
padding: 4px 12px;
|
|
||||||
border-radius: 12px;
|
|
||||||
background-color: #f6ffed;
|
|
||||||
color: #52c41a;
|
color: #52c41a;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tags {
|
.stats-row {
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: 8px;
|
justify-content: space-around;
|
||||||
margin-bottom: 12px;
|
padding: 16px 0;
|
||||||
|
border-top: 1px solid #f5f5f5;
|
||||||
|
border-bottom: 1px solid #f5f5f5;
|
||||||
|
margin-bottom: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tag {
|
.stat-item {
|
||||||
background-color: #fff1f0;
|
display: flex;
|
||||||
border-radius: 8px;
|
flex-direction: column;
|
||||||
padding: 4px 12px;
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tag-text {
|
.stat-label {
|
||||||
font-size: 14px;
|
font-size: 40rpx;
|
||||||
color: #ff4d4f;
|
color: #999;
|
||||||
|
margin-bottom: 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.time {
|
.stat-value {
|
||||||
font-size: 18px;
|
font-size: 40rpx;
|
||||||
color: #666;
|
font-weight: bold;
|
||||||
display: block;
|
color: #333;
|
||||||
margin-bottom: 8px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.trigger {
|
.btn-row {
|
||||||
font-size: 18px;
|
display: flex;
|
||||||
color: #666;
|
justify-content: flex-end;
|
||||||
|
gap: 60rpx;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
76
src/manifest.json
Normal file
76
src/manifest.json
Normal file
@@ -0,0 +1,76 @@
|
|||||||
|
{
|
||||||
|
"name": "Road_roller",
|
||||||
|
"appid": "__UNI__BA80270",
|
||||||
|
"description": "",
|
||||||
|
"versionName": "1.0.0",
|
||||||
|
"versionCode": "100",
|
||||||
|
"transformPx": false,
|
||||||
|
"app-plus": {
|
||||||
|
"usingComponents": true,
|
||||||
|
"nvueStyleCompiler": "uni-app",
|
||||||
|
"compilerVersion": 3,
|
||||||
|
"splashscreen": {
|
||||||
|
"alwaysShowBeforeRender": true,
|
||||||
|
"waiting": true,
|
||||||
|
"autoclose": true,
|
||||||
|
"delay": 0
|
||||||
|
},
|
||||||
|
"modules": {
|
||||||
|
"Bluetooth": {},
|
||||||
|
"SQLite": {}
|
||||||
|
},
|
||||||
|
"distribute": {
|
||||||
|
"android": {
|
||||||
|
"permissions": [
|
||||||
|
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
|
||||||
|
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
|
||||||
|
"<uses-feature android:name=\"android.hardware.camera\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"ios": {},
|
||||||
|
"sdkConfigs": {}
|
||||||
|
},
|
||||||
|
"screenOrientation": [
|
||||||
|
"landscape-primary"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"quickapp": {},
|
||||||
|
"mp-weixin": {
|
||||||
|
"appid": "",
|
||||||
|
"setting": {
|
||||||
|
"urlCheck": false
|
||||||
|
},
|
||||||
|
"usingComponents": true,
|
||||||
|
"darkmode": true,
|
||||||
|
"themeLocation": "theme.json"
|
||||||
|
},
|
||||||
|
"mp-alipay": {
|
||||||
|
"usingComponents": true
|
||||||
|
},
|
||||||
|
"mp-baidu": {
|
||||||
|
"usingComponents": true
|
||||||
|
},
|
||||||
|
"mp-toutiao": {
|
||||||
|
"usingComponents": true
|
||||||
|
},
|
||||||
|
"uniStatistics": {
|
||||||
|
"enable": false
|
||||||
|
},
|
||||||
|
"vueVersion": "3",
|
||||||
|
"h5": {
|
||||||
|
"darkmode": true,
|
||||||
|
"themeLocation": "theme.json"
|
||||||
|
}
|
||||||
|
}
|
||||||
145
src/pages.json
Normal file
145
src/pages.json
Normal file
@@ -0,0 +1,145 @@
|
|||||||
|
{
|
||||||
|
"easycom": {
|
||||||
|
"autoscan": true,
|
||||||
|
"custom": {
|
||||||
|
"^wd-(.*)": "@wot-ui/ui/components/wd-$1/wd-$1.vue",
|
||||||
|
"^uni-(.*)": "@dcloudio/uni-ui/lib/uni-$1/uni-$1.vue"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"globalStyle": {
|
||||||
|
"backgroundColor": "@bgColor",
|
||||||
|
"backgroundColorBottom": "@bgColorBottom",
|
||||||
|
"backgroundColorTop": "@bgColorTop",
|
||||||
|
"backgroundTextStyle": "@bgTxtStyle",
|
||||||
|
"navigationBarBackgroundColor": "#ffffff",
|
||||||
|
"navigationBarTextStyle": "black",
|
||||||
|
"navigationBarTitleText": "Road-Roller"
|
||||||
|
},
|
||||||
|
"pages": [
|
||||||
|
// GENERATED BY UNI-PAGES, PLATFORM: H5 || APP
|
||||||
|
{
|
||||||
|
"path": "pages/Ahome/index",
|
||||||
|
"type": "page",
|
||||||
|
"layout": false,
|
||||||
|
"style": {
|
||||||
|
"navigationStyle": "custom"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/bluetooth/index",
|
||||||
|
"type": "page",
|
||||||
|
"layout": false,
|
||||||
|
"style": {
|
||||||
|
"navigationStyle": "custom"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/heatmap/index",
|
||||||
|
"type": "page",
|
||||||
|
"layout": false,
|
||||||
|
"style": {
|
||||||
|
"navigationStyle": "custom"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/message/index",
|
||||||
|
"type": "page",
|
||||||
|
"layout": false,
|
||||||
|
"style": {
|
||||||
|
"navigationStyle": "custom"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/project/index",
|
||||||
|
"type": "page",
|
||||||
|
"layout": false,
|
||||||
|
"style": {
|
||||||
|
"navigationStyle": "custom"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/report/index",
|
||||||
|
"type": "page",
|
||||||
|
"layout": false,
|
||||||
|
"style": {
|
||||||
|
"navigationStyle": "custom"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/rtk/index",
|
||||||
|
"type": "page",
|
||||||
|
"layout": false,
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "RTK轨迹"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/settings/index",
|
||||||
|
"type": "page",
|
||||||
|
"layout": false,
|
||||||
|
"style": {
|
||||||
|
"navigationStyle": "custom"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/warning/index",
|
||||||
|
"type": "page",
|
||||||
|
"layout": false,
|
||||||
|
"style": {
|
||||||
|
"navigationStyle": "custom"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/work/index",
|
||||||
|
"type": "page",
|
||||||
|
"layout": false,
|
||||||
|
"style": {
|
||||||
|
"navigationStyle": "custom"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/report/detail/index",
|
||||||
|
"type": "page",
|
||||||
|
"layout": false,
|
||||||
|
"style": {
|
||||||
|
"navigationStyle": "custom"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/warning/detail/index",
|
||||||
|
"type": "page",
|
||||||
|
"layout": false,
|
||||||
|
"style": {
|
||||||
|
"navigationStyle": "custom"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"subPackages": [],
|
||||||
|
"tabBar": {
|
||||||
|
"backgroundColor": "@tabBgColor",
|
||||||
|
"borderStyle": "@tabBorderStyle",
|
||||||
|
"color": "@tabFontColor",
|
||||||
|
"selectedColor": "@tabSelectedColor",
|
||||||
|
"list": [
|
||||||
|
// GENERATED BY UNI-PAGES, PLATFORM: H5 || APP
|
||||||
|
{
|
||||||
|
"pagePath": "pages/Ahome/index",
|
||||||
|
"text": "首页",
|
||||||
|
"iconPath": "static/home.png",
|
||||||
|
"selectedIconPath": "static/home1.png"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"pagePath": "pages/work/index",
|
||||||
|
"text": "工作",
|
||||||
|
"iconPath": "static/work.png",
|
||||||
|
"selectedIconPath": "static/work1.png"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"pagePath": "pages/report/index",
|
||||||
|
"text": "报告",
|
||||||
|
"iconPath": "static/report.png",
|
||||||
|
"selectedIconPath": "static/report1.png"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -13,17 +13,19 @@ const tabs = ['全部', '进行中', '已结束']
|
|||||||
const projects = [
|
const projects = [
|
||||||
{
|
{
|
||||||
projectName: '徐工XS65H #01',
|
projectName: '徐工XS65H #01',
|
||||||
status: '进行中',
|
stakeRange: 'K1+200-K1+800',
|
||||||
tags: ['定位异常', '警告'],
|
status: 0,
|
||||||
time: '14:10:04·已持续5分30秒',
|
workTime: '8h',
|
||||||
trigger: '触发阈值:RTK信号弱,精度下降',
|
compactArea: '28.5m²',
|
||||||
|
rollerCount: '10遍',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
projectName: '徐工XS65H #01',
|
projectName: '徐工XS65H #02',
|
||||||
status: '进行中',
|
stakeRange: 'K2+100-K2+600',
|
||||||
tags: ['定位异常', '警告'],
|
status: 2,
|
||||||
time: '14:10:04·已持续5分30秒',
|
workTime: '5h',
|
||||||
trigger: '触发阈值:RTK信号弱,精度下降',
|
compactArea: '15.2m²',
|
||||||
|
rollerCount: '6遍',
|
||||||
},
|
},
|
||||||
]
|
]
|
||||||
|
|
||||||
@@ -65,10 +67,11 @@ function handleCreate() {
|
|||||||
v-for="(item, index) in projects"
|
v-for="(item, index) in projects"
|
||||||
:key="index"
|
:key="index"
|
||||||
:project-name="item.projectName"
|
:project-name="item.projectName"
|
||||||
|
:stake-range="item.stakeRange"
|
||||||
:status="item.status"
|
:status="item.status"
|
||||||
:tags="item.tags"
|
:work-time="item.workTime"
|
||||||
:time="item.time"
|
:compact-area="item.compactArea"
|
||||||
:trigger="item.trigger"
|
:roller-count="item.rollerCount"
|
||||||
/>
|
/>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|||||||
BIN
src/static/machine.png
Normal file
BIN
src/static/machine.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
Reference in New Issue
Block a user