Skip to content

Z
zc-qiyewx-app
You need to sign in or sign up before continuing.
Commit e0c536a5 authored by 杨勇飞's avatar 杨勇飞
Browse files
Options

增加日报填写页面

parent 6ded782d
Hide whitespace changes
Inline Side-by-side
Showing with 365 additions and 42 deletions
pages.json
View file @ e0c536a5
......@@ -3,8 +3,12 @@
{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "运营看板",
"titleAlign": "center"
"navigationBarTitleText": "首页"
}
},{
"path": "pages/dailyReport/index",
"style": {
"navigationBarTitleText": "日报详情"
}
}
],
......
pages/dailyReport/index.vue 0 → 100644
View file @ e0c536a5
<template>
<view class="daily-report">
<!-- 顶部统计 -->
<view class="report-stats">
<view class="stat-item">
<text class="number" style="color: #52c41a;">{{ stats.submitted }}</text>
<text class="label">已提交</text>
</view>
<view class="stat-item">
<text class="number" style="color: #ff4d4f;">{{ stats.unsubmitted }}</text>
<text class="label">未提交</text>
</view>
<view class="stat-item">
<text class="number" style="color: #1890ff;">{{ stats.total }}</text>
<text class="label">总人数</text>
</view>
</view>
<!-- 日报列表 -->
<scroll-view class="report-list" scroll-y>
<view
class="report-card"
v-for="(report, index) in reports"
:key="index"
>
<view class="card-header">
<view class="left">
<text class="name">{{ report.name }}</text>
<text class="status" :class="report.status ? 'submitted' : 'unsubmitted'">
{{ report.status ? '已提交' : '未提交' }}
</text>
</view>
<text class="time">{{ report.submitTime || '-' }}</text>
</view>
<view class="card-content" v-if="report.status">
<view class="work-item">
<view class="work-header">
<text class="work-title">今日重点工作</text>
</view>
<view class="work-content">{{ report.todayWork }}</view>
</view>
<view class="work-item">
<view class="work-header">
<text class="work-title">本周重点工作</text>
</view>
<view class="work-content">{{ report.weekWork }}</view>
</view>
</view>
</view>
</scroll-view>
</view>
</template>
<script>
export default {
data() {
return {
stats: {
total: 20,
submitted: 15,
unsubmitted: 5
},
reports: [
{
name: '张三',
status: true,
submitTime: '2024-03-20 09:30',
todayWork: '完成项目A的需求分析和原型设计',
weekWork: '推进项目A的整体进度，完成核心功能开发'
},
{
name: '李四',
status: true,
submitTime: '2024-03-20 09:15',
todayWork: '完成用户管理模块的开发和测试',
weekWork: '完成系统核心模块的开发和单元测试'
},
{
name: '王五',
status: true,
submitTime: '2024-03-20 08:45',
todayWork: '进行项目B的技术方案评审，解决遗留问题',
weekWork: '完成项目B的架构设计和核心模块开发'
},
{
name: '赵六',
status: false,
submitTime: '',
todayWork: '',
weekWork: ''
},
{
name: '钱七',
status: true,
submitTime: '2024-03-20 09:45',
todayWork: '处理生产环境的紧急bug，优化系统性能',
weekWork: '系统性能优化，处理生产环境反馈问题'
},
{
name: '孙八',
status: false,
submitTime: '',
todayWork: '',
weekWork: ''
},
{
name: '周九',
status: true,
submitTime: '2024-03-20 08:30',
todayWork: '完成数据统计模块的开发和联调',
weekWork: '数据统计模块开发和测试用例编写'
},
{
name: '吴十',
status: true,
submitTime: '2024-03-20 09:20',
todayWork: '进行项目C的需求评审和技术方案设计',
weekWork: '项目C的整体规划和核心功能开发'
},
{
name: '郑十一',
status: false,
submitTime: '',
todayWork: '',
weekWork: ''
},
{
name: '王十二',
status: true,
submitTime: '2024-03-20 09:10',
todayWork: '完成支付模块的单元测试和联调',
weekWork: '支付模块的开发和性能优化'
}
// ... 其他员工数据
]
}
}
}
</script>
<style lang="scss">
.daily-report {
// padding: 15px;
background: #f5f7fa;
min-height: 100vh;
.report-stats {
display: flex;
justify-content: space-around;
background: #fff;
padding: 20px 15px;
border-radius: 8px;
// margin-bottom: 15px;
box-shadow: 0 2px 12px rgba(0,0,0,0.05);
.stat-item {
text-align: center;
padding: 15px 24px;
background: #f9f9f9;
border-radius: 6px;
.number {
display: block;
font-size: 28px;
font-weight: bold;
color: #333;
margin-bottom: 8px;
&:after {
content: '';
display: block;
width: 24px;
height: 2px;
background: #1890ff;
margin: 8px auto 0;
border-radius: 1px;
}
}
.label {
font-size: 14px;
color: #999;
}
}
}
.report-list {
height: calc(100vh - 120px);
.report-card {
display: block;
background: #fff;
border-radius: 8px;
padding: 15px;
margin-bottom: 15px;
box-shadow: 0 2px 12px rgba(0,0,0,0.05);
transition: all 0.3s ease;
&:hover {
transform: translateY(-2px);
box-shadow: 0 4px 16px rgba(0,0,0,0.08);
}
.card-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 10px;
.left {
display: flex;
align-items: center;
gap: 10px;
.name {
font-size: 16px;
font-weight: bold;
color: #333;
position: relative;
padding-left: 12px;
&:before {
content: '';
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 4px;
height: 16px;
background: #1890ff;
border-radius: 2px;
}
}
.status {
padding: 4px 12px;
border-radius: 10px;
font-size: 12px;
&.submitted {
background: rgba(82, 196, 26, 0.1);
color: #52c41a;
border: 1px solid rgba(82, 196, 26, 0.2);
}
&.unsubmitted {
background: rgba(255, 77, 79, 0.1);
color: #ff4d4f;
border: 1px solid rgba(255, 77, 79, 0.2);
}
}
}
.time {
font-size: 14px;
color: #999;
}
}
.card-content {
.work-item {
display: block;
border-top: 1px solid #f0f0f0;
padding-top: 10px;
margin-bottom: 10px;
.work-header {
display: flex;
align-items: center;
margin-bottom: 8px;
position: relative;
padding-left: 12px;
&:before {
content: '';
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 3px;
height: 14px;
background: #1890ff;
opacity: 1;
border-radius: 1.5px;
}
}
.work-title {
font-size: 14px;
color: #333;
font-weight: 500;
}
.work-content {
font-size: 14px;
color: #666;
line-height: 1.6;
padding: 12px 15px;
background: #fafafa;
border-radius: 4px;
white-space: pre-wrap;
word-break: break-all;
text-align: justify;
}
}
}
}
}
}
</style>
pages/index/index.vue
View file @ e0c536a5
<template>
<view class="report-container">
<!-- 顶部统计概览 -->
<view class="top-stats">
<!-- <view class="top-stats">
<view class="stat-item">
<text class="label">占位区域</text>
<text class="value">1280</text>
......@@ -18,7 +18,7 @@
<text class="label">占位区域</text>
<text class="value">￥896.5w</text>
</view>
</view>
</view> -->
<!-- 顶部时间导航 -->
<view class="time-nav">
......@@ -32,7 +32,7 @@
<view class="project-card">
<view class="overview-content">
<!-- 左侧环状进度 -->
<view class="progress-circle">
<view class="progress-circle" @click="navigateToDailyReport">
<view class="circle-wrapper" :style="{
background: `conic-gradient(#52C41A 0% ${currentData.overview.submitRate}%, rgba(245,245,245,0.3) ${currentData.overview.submitRate}% 100%)`
}">
......@@ -43,7 +43,7 @@
<text class="submitted"> {{currentData.overview.submitCount}}</text>
<text class="should-submitted"> /{{currentData.overview.totalCount}}</text>
</view>
<text class="label">日报提交</text>
<text class="label">日报提交</text>
</view>
</view>
</view>
......@@ -54,27 +54,27 @@
<view class="stat-row">
<view class="stat-item">
<view class="stat-block light-green">
<text class="number">{{currentData.overview.stats.projectCount}}</text>
<text class="rate">项目</text>
<text class="number">{{currentData.overview.stats.projectCount}}</text>
<text class="rate">项目</text>
</view>
</view>
<view class="stat-item">
<view class="stat-block light-orange">
<text class="number">{{currentData.overview.stats.orderCount}}</text>
<text class="rate">单量</text>
<text class="number">{{currentData.overview.stats.orderCount}}</text>
<text class="rate">单量</text>
</view>
</view>
</view>
<view class="stat-row">
<view class="stat-item">
<view class="stat-block green">
<text class="number">{{currentData.overview.stats.volumeCount}}</text>
<text class="number">{{currentData.overview.stats.volumeCount}}</text>
<text class="rate">方量m³</text>
</view>
</view>
<view class="stat-item">
<view class="stat-block orange">
<text class="number">{{currentData.overview.stats.weightCount}}</text>
<text class="number">{{currentData.overview.stats.weightCount}}</text>
<text class="rate">重量T</text>
</view>
</view>
......@@ -163,7 +163,7 @@
left: 0,
top: 0
}"></view>
<view class="progress monthly" :style="{
<view class="progress monthly" :style="{
backgroundColor: '#13C2C2',
position: 'absolute',
height: '100%',
......@@ -202,6 +202,7 @@
</view>
<!-- 项目对比图表区域 -->
<!-- todo: 当前排序和模拟老板干涉 -->
<view class="chart-container">
<view class="chart-header">
<text class="chart-title">项目对比(前10)</text>
......@@ -236,7 +237,7 @@
:loading="loading"
emptyText="暂无数据"
>
<uni-tr>
<uni-tr>
<uni-th align="center" width="60">模拟老板</uni-th>
<uni-th align="center" width="50">应收(万)</uni-th>
<uni-th align="center" width="50">应付(万)</uni-th>
......@@ -257,8 +258,8 @@
<uni-td>{{ item.volume }}</uni-td>
<uni-td>{{ item.weight }}</uni-td>
<uni-td>{{ item.manpower }}</uni-td>
</uni-tr>
</uni-table>
</uni-tr>
</uni-table>
</view>
</view>
</view>
......@@ -968,7 +969,7 @@ import { uniIcons } from '@dcloudio/uni-ui'
data = this.currentData.projectChartData
xAxisNames = this.currentData.projectChartData.projectNames
}
// 创建排序用的数组
const sortArray = xAxisNames.map((name, index) => ({
name,
......@@ -1002,19 +1003,19 @@ import { uniIcons } from '@dcloudio/uni-ui'
})
}else if(chart === 'myProjectChart'){
this.myProjectChart.setOption({
xAxis: {
data: sortArray.map(item => item.name)
},
series: [{
name: '应收',
data: sortArray.map(item => item.receivable)
}, {
name: '应付',
data: sortArray.map(item => item.payable)
}, {
xAxis: {
data: sortArray.map(item => item.name)
},
series: [{
name: '应收',
data: sortArray.map(item => item.receivable)
}, {
name: '应付',
data: sortArray.map(item => item.payable)
}, {
name: '利润率',
data: sortArray.map(item => item.profitRate)
}]
}]
})
}
},
......@@ -1033,6 +1034,12 @@ import { uniIcons } from '@dcloudio/uni-ui'
{ data: this.currentData.projectChartData.profitRate }
]
})
},
navigateToDailyReport() {
// 使用uni-app的导航方法跳转到日报查看页面
uni.navigateTo({
url: '/pages/dailyReport/index'
});
}
},
beforeDestroy() {
......@@ -1204,9 +1211,9 @@ import { uniIcons } from '@dcloudio/uni-ui'
.submit-info {
.label {
display: block;
display: block;
font-size: 14px;
color: #333;
color: #333;
font-weight: 500;
margin-bottom: 4px;
}
......@@ -1215,11 +1222,11 @@ import { uniIcons } from '@dcloudio/uni-ui'
display: flex;
flex-direction: row;
gap: 2px;
font-size: 12px;
font-size: 12px;
justify-self: center;
.submitted {
display: block;
display: block;
font-size: 20px;
font-weight: bold;
color: #52C41A;
......@@ -1299,8 +1306,8 @@ import { uniIcons } from '@dcloudio/uni-ui'
width: 60px;
margin-right: 20px;
height: 100%;
display: flex;
flex-direction: column;
display: flex;
flex-direction: column;
justify-content: center;
padding: 10px 0;
......@@ -1310,8 +1317,8 @@ import { uniIcons } from '@dcloudio/uni-ui'
border-radius: 12px;
font-size: 28px;
display: flex;
align-items: center;
justify-content: center;
align-items: center;
justify-content: center;
color: #fff;
}
}
......@@ -1450,7 +1457,7 @@ import { uniIcons } from '@dcloudio/uni-ui'
border-radius: 8px;
margin-bottom: 15px;
padding-bottom: 15px;
.chart-header {
padding: 15px 15px 0px 15px;
display: flex;
......@@ -1477,7 +1484,7 @@ import { uniIcons } from '@dcloudio/uni-ui'
border: 1px solid #E8E8E8;
cursor: pointer;
transition: all 0.3s ease;
display: flex;
display: flex;
align-items: center;
margin-left: 8px;
......@@ -1517,9 +1524,9 @@ import { uniIcons } from '@dcloudio/uni-ui'
&::-webkit-scrollbar-thumb {
background: rgba(0, 0, 0, 0.1);
border-radius: 3px;
}
.chart-wrapper {
}
.chart-wrapper {
height: 220px;
width: 100%;
padding: 0 0 5px 0;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment