feat 项目页样式

This commit is contained in:
Ironsp
2026-09-11 09:27:10 +08:00
parent 9d39a48117
commit aba6d4c09e
7 changed files with 376 additions and 63 deletions

View File

@@ -1,38 +1,95 @@
<script setup lang="ts">
defineProps<{
projectName: string
status: string
tags: string[]
time: string
trigger: string
stakeRange: string
status: number
workTime: 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>
<template>
<view class="project-item">
<!-- 头部:图标 + 项目名 + 状态 -->
<view class="item-header">
<text class="project-name">
{{ projectName }}
</text>
<text class="status">
{{ status }}
</text>
</view>
<view class="tags">
<view v-for="(tag, index) in tags" :key="index" class="tag">
<text class="tag-text">
{{ tag }}
<view class="header-left">
<image class="project-icon" src="/static/machine.png" mode="aspectFit" />
<view class="header-info">
<text class="project-name">
{{ projectName }}
</text>
<text class="stake-range">
{{ stakeRange }}
</text>
</view>
</view>
<view class="status-badge">
<view class="status-dot" :style="{ backgroundColor: getStatusColor(status) }" />
<text class="status-text" :style="{ color: getStatusColor(status) }">
{{ getStatusText(status) }}
</text>
</view>
</view>
<text class="time">
{{ time }}
</text>
<text class="trigger">
{{ trigger }}
</text>
<!-- 数据统计 -->
<view class="stats-row">
<view class="stat-item">
<text class="stat-label">
作业时长
</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>
</template>
@@ -47,49 +104,85 @@ defineProps<{
display: flex;
justify-content: space-between;
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 {
font-size: 22px;
font-size: 40rpx;
font-weight: bold;
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;
padding: 4px 12px;
border-radius: 12px;
background-color: #f6ffed;
color: #52c41a;
}
.tags {
.stats-row {
display: flex;
gap: 8px;
margin-bottom: 12px;
justify-content: space-around;
padding: 16px 0;
border-top: 1px solid #f5f5f5;
border-bottom: 1px solid #f5f5f5;
margin-bottom: 16px;
}
.tag {
background-color: #fff1f0;
border-radius: 8px;
padding: 4px 12px;
.stat-item {
display: flex;
flex-direction: column;
align-items: center;
}
.tag-text {
font-size: 14px;
color: #ff4d4f;
.stat-label {
font-size: 40rpx;
color: #999;
margin-bottom: 4px;
}
.time {
font-size: 18px;
color: #666;
display: block;
margin-bottom: 8px;
.stat-value {
font-size: 40rpx;
font-weight: bold;
color: #333;
}
.trigger {
font-size: 18px;
color: #666;
.btn-row {
display: flex;
justify-content: flex-end;
gap: 60rpx;
}
</style>

76
src/manifest.json Normal file
View 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
View 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"
}
]
}
}

View File

@@ -13,17 +13,19 @@ const tabs = ['全部', '进行中', '已结束']
const projects = [
{
projectName: '徐工XS65H #01',
status: '进行中',
tags: ['定位异常', '警告'],
time: '14:10:04·已持续5分30秒',
trigger: '触发阈值:RTK信号弱,精度下降',
stakeRange: 'K1+200-K1+800',
status: 0,
workTime: '8h',
compactArea: '28.5m²',
rollerCount: '10遍',
},
{
projectName: '徐工XS65H #01',
status: '进行中',
tags: ['定位异常', '警告'],
time: '14:10:04·已持续5分30秒',
trigger: '触发阈值:RTK信号弱,精度下降',
projectName: '徐工XS65H #02',
stakeRange: 'K2+100-K2+600',
status: 2,
workTime: '5h',
compactArea: '15.2m²',
rollerCount: '6遍',
},
]
@@ -65,10 +67,11 @@ function handleCreate() {
v-for="(item, index) in projects"
:key="index"
:project-name="item.projectName"
:stake-range="item.stakeRange"
:status="item.status"
:tags="item.tags"
:time="item.time"
:trigger="item.trigger"
:work-time="item.workTime"
:compact-area="item.compactArea"
:roller-count="item.rollerCount"
/>
</view>
</view>

BIN
src/static/machine.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB