liumin
/
NewZkgj
1
0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

日报页面切图

dev
douzhuo 2 years ago
parent
73ef29eb55
commit
9a169e8c2a
5 changed files with 390 additions and 153 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +12
    -2
      pages.json
  2. +124
    -149
      pages/mine/messageList.vue
  3. +237
    -0
      pages/mine/reportExcel/dayReport.vue
  4. BIN
      static/images/notice.png
  5. +17
    -2
      uview-ui/components/u-navbar/u-navbar.vue

+ 12
- 2
pages.json View File

@@ -230,8 +230,18 @@
"path": "messageList", "path": "messageList",
"style": { "style": {
"navigationBarTitleText": "消息", "navigationBarTitleText": "消息",
"navigationBarBackgroundColor": "#2671E2",
"navigationBarTextStyle": "white"
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
}
},
{
"path": "reportExcel/dayReport",
"style": {
"navigationBarTitleText": "接待日报",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black",
"navigationStyle": "custom"
} }
}, { }, {


+ 124
- 149
pages/mine/messageList.vue View File

@@ -1,81 +1,73 @@
<template> <template>
<view class="message_list"> <view class="message_list">
<!-- <u-tabs :list="list" :show-bar="false" :is-scroll="false" :current="current" @change="change"></u-tabs> -->
<view class="listMain">
<view class="upgradeList">
<scroll-view :scroll-top="scrollTop" refresher-enabled="true" :refresher-triggered="triggered"
@refresherpulling="onPulling" @refresherrefresh="onRefresh" @refresherrestore="onRestore"
:scroll-y="true" class="scroll-Y" @scrolltolower="lower">
<block v-if="updateAnnList.length!=0">
<block v-for="(item,index) in updateAnnList" :key="index">
<view class="upgradeItem" @click="goDetail(item.content,item.id,item.title)">
<view class="notRead">
<view v-if="item.readFlag==0" class="red"></view>
</view>
<view class="right">
<view class="title">{{item.title}}</view>
<view class="time">{{item.createTime}}</view>
</view>
</view>
</block>
</block>
<block v-else>
<view style=" padding: 100rpx 0;">
<u-empty text="暂无数据" mode="list"></u-empty>
</view>
</block>
</scroll-view>
<!-- 公告 -->
<view class="m-nav">
<view class="m-n-lside">
<image src="@/static/images/notice.png" mode=""></image>
全部102条消息
</view>
<view class="m-n-rside">
全部已读
</view> </view>
</view>
<!-- 选项卡 -->
<view class="m-tabs">
<u-tabs :list="list" :current="current" :is-scroll="false" @change="change"></u-tabs>
</view>
<!-- <view class="systemList" v-if="current==0">
<block v-if="sysItemList.length!=0">
<block v-for="(item,index) in sysItemList" :key="index">
<view class="sysItem">
<image class="headpic" src="../../static/images/function1.png"></image>
<template v-if="current == 0">
<scroll-view :scroll-top="scrollTop" refresher-enabled="true" :refresher-triggered="triggered"
@refresherpulling="onPulling" @refresherrefresh="onRefresh" @refresherrestore="onRestore"
:scroll-y="true" class="scroll-Y" @scrolltolower="lower">
<template v-if="updateAnnList.length!=0">
<block v-for="(item,index) in updateAnnList" :key="index">
<view class="upgradeItem" @click="goReception(item)">
<view class="right"> <view class="right">
<view class="headInfo">
<view class="title">优秀案例</view>
<view class="info">评价你：非常好，品牌价值观还需要补充</view>
</view>
<view class="content">
我的评论：非常好，品牌价值观还需要补充我的评论：非常好，品牌价值观还需要补充我的评论：非常好，品牌价值观还需要补充我的评论：非常好，品牌价值观还需要补充
</view>
<view class="time">
2021-01-12 12：23：01
<view class="title">
{{item.title}}
<template v-if="item.readFlag==0">
<view class="notRead"></view>
</template>
</view> </view>
<view class="time">{{item.createTime}}</view>
</view> </view>
</view> </view>
</block> </block>
</block>
<block v-else>
<view style=" padding: 100rpx 0;">
</template>
<template v-else>
<view style="padding: 100rpx 0;">
<u-empty text="暂无数据" mode="list"></u-empty> <u-empty text="暂无数据" mode="list"></u-empty>
</view> </view>
</block>
</view>
<view class="upgradeList" v-if="current==1">
<block v-if="updateAnnList.length!=0">
</template>
</scroll-view>
</template>
<!-- 升级公告 -->
<template v-if="current == 1">
<scroll-view :scroll-top="scrollTop" refresher-enabled="true" :refresher-triggered="triggered"
@refresherpulling="onPulling" @refresherrefresh="onRefresh" @refresherrestore="onRestore"
:scroll-y="true" class="scroll-Y" @scrolltolower="lower">
<template v-if="updateAnnList.length!=0">
<block v-for="(item,index) in updateAnnList" :key="index"> <block v-for="(item,index) in updateAnnList" :key="index">
<view class="upgradeItem" @click="goDetail(item.content,item.id)">
<view class="notRead">
<view v-if="item.readFlag==0" class="red"></view>
</view>
<view class="upgradeItem" @click="goDetail(item.content,item.id,item.title)">
<view class="right"> <view class="right">
<view class="title">{{item.title}}</view>
<view class="title">
{{item.title}}
<template v-if="item.readFlag==0">
<view class="notRead"></view>
</template>
</view>
<view class="time">{{item.createTime}}</view> <view class="time">{{item.createTime}}</view>
</view> </view>
</view> </view>
</block> </block>
</block>
<block v-else>
<view style=" padding: 100rpx 0;">
</template>
<template v-else>
<view style="padding: 100rpx 0;">
<u-empty text="暂无数据" mode="list"></u-empty> <u-empty text="暂无数据" mode="list"></u-empty>
</view> </view>
</block>
</view>
-->
</view>
</template>
</scroll-view>
</template>
</view> </view>
</template> </template>
@@ -93,10 +85,9 @@
updateAnnList: [], updateAnnList: [],
sysItemList: [], sysItemList: [],
list: [{ list: [{
name: '系统消息'
name: '接待报告'
}, { }, {
name: `升级公告`,
count: "",
name: '升级公告',
}], }],
current: 0, current: 0,
pageNum: 1, pageNum: 1,
@@ -108,22 +99,21 @@
this.pageNum = 1 this.pageNum = 1
this.updateInit() this.updateInit()
}, },
onLoad() { onLoad() {
this._freshing = false; this._freshing = false;
setTimeout(() => { setTimeout(() => {
this.triggered = true; this.triggered = true;
}, 1000) }, 1000)
}, },
onPullDownRefresh() { onPullDownRefresh() {
this.updateInit() this.updateInit()
setTimeout(function() { setTimeout(function() {
uni.stopPullDownRefresh(); uni.stopPullDownRefresh();
}, 1000); }, 1000);
}, },
// onReachBottom(){
// this.pageNum++
// this.updateInit()
// },
methods: { methods: {
onPulling(e) { onPulling(e) {
console.log("onpulling", e); console.log("onpulling", e);
@@ -138,18 +128,17 @@
this._freshing = false; this._freshing = false;
}, 3000) }, 3000)
}, },
onRestore() { onRestore() {
this.triggered = 'restore'; // 需要重置 this.triggered = 'restore'; // 需要重置
console.log("onRestore"); console.log("onRestore");
}, },
// uppers(e) {
// this.pageNum = 1
// this.updateInit()
// },
lower(e) { lower(e) {
this.pageNum++ this.pageNum++
this.updateInit() this.updateInit()
},
},
updateInit() { updateInit() {
uni.request({ uni.request({
url: config.service.updateList, url: config.service.updateList,
@@ -165,9 +154,6 @@
}, },
success: (res) => { success: (res) => {
// this.updateAnnList = res.data.data.list.results // this.updateAnnList = res.data.data.list.results
if (res.data.data != null) {
this.list[1].count = res.data.data.count
}
if (res.data.data == null) { if (res.data.data == null) {
console.log(11) console.log(11)
uni.showToast({ uni.showToast({
@@ -175,9 +161,9 @@
duration: 2000 duration: 2000
}); });
} else { } else {
if(this.pageNum!=1){
if (this.pageNum != 1) {
this.updateAnnList = [...this.updateAnnList, ...res.data.data.list.results]; this.updateAnnList = [...this.updateAnnList, ...res.data.data.list.results];
}else{
} else {
this.updateAnnList = res.data.data.list.results this.updateAnnList = res.data.data.list.results
} }
} }
@@ -191,6 +177,13 @@
url: "./messageDetail?content=" + link + "&id=" + id + "&tit=" + title url: "./messageDetail?content=" + link + "&id=" + id + "&tit=" + title
}) })
}, },
// 跳转日报
goReception(item) {
uni.navigateTo({
url: `/pages/mine/reportExcel/dayReport`
})
},
change(index) { change(index) {
this.current = index; this.current = index;
if (this.current == 1) { if (this.current == 1) {
@@ -202,97 +195,79 @@
</script> </script>
<style lang="scss"> <style lang="scss">
.scroll-Y {
height: 100%;
width: 100%;
position: fixed;
}
.message_list { .message_list {
.u-tab-item {
border: 0.5rpx solid #dedede;
}
width: 100vw;
height: calc(100vh - var(--window-top));
background: #F8F8F8;
display: flex;
flex-direction: column;
.listMain {
margin-top: 20rpx;
.m-nav {
flex-shrink: 0;
padding: 0 30rpx;
width: 100%;
height: 68rpx;
display: flex;
align-items: center;
.systemList {
.sysItem {
padding: 20rpx;
border: 1rpx solid #ccc;
display: flex;
margin: 16rpx 0;
.m-n-lside {
flex-grow: 1;
display: flex;
align-items: center;
.headpic {
width: 70rpx;
height: 70rpx;
border-radius: 100%;
margin-right: 30rpx;
}
image {
margin-right: 16rpx;
width: 36rpx;
height: 36rpx;
}
}
.right {
.headInfo {
.title {
font-size: 32rpx;
font-weight: bold;
margin-bottom: 8rpx;
}
}
.m-n-rside {
flex-shrink: 0;
padding: 6rpx 14rpx;
border: 1rpx solid #E0E0E0;
font-size: 24rpx;
}
}
.content {
width: 600rpx;
background: #e6e6e6;
padding: 10rpx;
margin: 14rpx 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.m-tabs {
flex-shrink: 0;
}
.time {
color: #6f6f6f;
font-size: 24rpx;
}
}
}
}
.scroll-Y {
padding: 20rpx 0 0 0;
flex-grow: 1;
overflow-y: scroll;
.upgradeList {
.upgradeItem {
padding: 20rpx;
border: 1rpx solid #ccc;
margin: 16rpx 0;
display: flex;
.upgradeItem {
margin: 0 0 20rpx 0;
padding: 24rpx 30rpx 28rpx;
height: 156rpx;
display: flex;
background: #fff;
.notRead {
width: 14rpx;
height: 14rpx;
margin-right: 20rpx;
margin-top: 16rpx;
.right {
.title {
font-size: 32rpx;
font-weight: bold;
display: flex;
.red {
.notRead {
width: 14rpx;
height: 14rpx;
background: #FF0000; background: #FF0000;
width: 100%;
height: 100%;
border-radius: 100%; border-radius: 100%;
} }
} }
.right {
.title {
font-size: 32rpx;
font-weight: bold;
margin-bottom: 8rpx;
}
.time {
color: #6f6f6f;
font-size: 24rpx;
}
.time {
margin: 18rpx 0 0 0;
color: #6f6f6f;
font-size: 24rpx;
} }
} }
} }
} }
} }


+ 237
- 0
pages/mine/reportExcel/dayReport.vue View File

@@ -0,0 +1,237 @@
<template>
<view class="pages">
<!-- 导航栏 -->
<view class="nav-header">
<u-navbar title="数智工牌日报" titles="05.02"></u-navbar>
</view>
<!-- 日报内容部分 -->
<view class="container">
<!-- 头部日报卡 -->
<view class="c-head-card">
<view class="c-title-text">
桃源避暑山庄新型项目数智工牌日报
<text class="date">01月27日</text>
</view>
<view class="creative-time">
生成时间：2022-01-27 22:00
</view>
</view>
<!-- 循环渲染的数据 -->
<view class="dateList">
<!-- -->
<view class="arrs">
<block v-for="(data, index) in 11" :key="index">
<view class="arrs-items">
<view class="left">
{{ index+1 }}
</view>
<view class="right">
<view class="r-title">
<text>接待量：</text>
<text class="num">879次</text>
</view>
<view class="r-box">
<view class="r-box-item">
<text>接待量</text><text>100</text>
</view>
<view class="r-box-item">
<text>有效接待</text><text>100</text>
</view>
<view class="r-box-item-lang">
<view>有效接待率<text>80%</text></view>
<view class="contrast">对比昨天<text class="down">-5%</text></view>
</view>
</view>
<view class="ranking">
<block v-for="(rank, rankIndex) in 3" :key="rankIndex">
<view class="ranking-item">
<view class="serial">
{{ rankIndex+1 }}
</view>
<view class="lside">
产品设计
</view>
<view class="rside">
(100%)
</view>
</view>
</block>
</view>
</view>
</view>
</block>
</view>
</view>
</view>
</view>
</template>

<script>
</script>

<style lang="scss" scoped>
.pages {
width: 100vw;
min-height: 100vh;
display: flex;
flex-direction: column;
.nav-header {
flex-shrink: 0;
}
.container {
padding: 30rpx 30rpx 0;
flex-grow: 1;
display: flex;
flex-direction: column;
.c-head-card {
padding: 30rpx;
width: 100%;
height: 252rpx;
border: 2rpx solid #000000;
border-radius: 12rpx;
box-shadow: 10rpx 10rpx #2671E2;
display: flex;
flex-direction: column;
.c-title-text {
position: relative;
flex-grow: 1;
font-size: 48rpx;
color: #303030;
.date {
position: absolute;
right: 0;
bottom: 6rpx;
font-size: 30rpx;
color: #303030;
}
}
.creative-time {
margin: 20rpx 0 0 0;
flex-shrink: 0;
}
}
.dateList {
width: 100%;
.arrs {
width: 100%;
.arrs-items {
margin: 40rpx 0 0 0;
display: flex;
.left {
flex-shrink: 0;
margin-right: 12rpx;
width: 48rpx;
height: 44rpx;
display: flex;
justify-content: center;
border-radius: 8rpx;
border: 1rpx solid #999999;
font-size: 32rpx;
}
.right {
flex-grow: 1;
.r-title {
font-size: 32rpx;
height: 44rpx;
display: flex;
align-items: center;
.num {
font-size: 34rpx;
}
}
.r-box {
padding: 21rpx 0 0 0;
display: flex;
flex-wrap: wrap;
.r-box-item {
margin-right: 24rpx;
}
.r-box-item-lang {
margin-top: 19rpx;
width: 100%;
display: flex;
align-items: center;
.contrast {
margin: 0 0 0 24rpx;
display: flex;
align-items: center;
}
.down {
color: #43CD80;
font-size: 34rpx;
}
.up {
font-size: 34rpx;
color: #E7483C;
}
}
}
.ranking {
padding: 21rpx 0 0 0;
display: flex;
flex-direction: column;
.ranking-item {
margin-bottom: 22rpx;
display: flex;
align-items: center;
font-size: 30rpx;
.serial {
flex-shrink: 0;
width: 42rpx;
height: 42rpx;
background: #2671E2;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
color: #fff;
}
.lside {
margin: 0 20rpx;
color: #505050;
}
.rside {
flex-shrink: 0;
font-size: 32rpx;
}
}
}
}
}
}
}
}
}
</style>

BIN
static/images/notice.png View File

Before After
Width: 72  |  Height: 72  |  Size: 1.9 KiB

+ 17
- 2
uview-ui/components/u-navbar/u-navbar.vue View File

@@ -17,8 +17,12 @@
> >
{{ title }} {{ title }}
</view> </view>
<view class="u-titles" v-if="titles != ''">
{{ titles }}
</view>
</view> </view>
<view class="u-slot-content"><slot></slot></view>
<view class="u-slot-content" :style="[titleStyle]"><slot></slot></view>
<view class="u-slot-right"><slot name="right"></slot></view> <view class="u-slot-right"><slot name="right"></slot></view>
</view> </view>
</view> </view>
@@ -99,6 +103,11 @@ export default {
type: String, type: String,
default: '' default: ''
}, },
// 标题下面的副标题
titles: {
type: String,
default: ''
},
// 标题的宽度，如果需要自定义右侧内容，且右侧内容很多时，可能需要减少这个宽度，单位rpx // 标题的宽度，如果需要自定义右侧内容，且右侧内容很多时，可能需要减少这个宽度，单位rpx
titleWidth: { titleWidth: {
type: [String, Number], type: [String, Number],
@@ -259,13 +268,14 @@ export default {


.u-navbar-content-title { .u-navbar-content-title {
display: flex; display: flex;
flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
flex: 1; flex: 1;
position: absolute; position: absolute;
left: 0; left: 0;
right: 0; right: 0;
height: 60rpx;
min-height: 60rpx;
text-align: center; text-align: center;
flex-shrink: 0; flex-shrink: 0;
} }
@@ -280,6 +290,11 @@ export default {
flex: 1; flex: 1;
} }


.u-titles {
font-size: 24rpx;
text-align: center;
}

.u-navbar-right { .u-navbar-right {
flex: 1; flex: 1;
display: flex; display: flex;


Write Preview
Loading…
Cancel
Save