OA/pages/index/index.vue

917 lines
19 KiB
Vue
Raw Normal View History

2023-11-05 00:11:08 +08:00
<template>
<view class="content">
<!-- -->
<!-- #ifdef H5 -->
<view class="content-top" :style="'padding-top:30px'">
<!-- #endif -->
<!-- #ifdef APP-PLUS||MP -->
<view class="content-top" :style="'padding-top:'+statusBarHeight+'px'">
<!-- #endif -->
<retuntop class="close" :isshow="false"></retuntop>
<view class="my_msg-con">
<u--image :showLoading="true" :src="`${HTTP_IMG_URL}${oaUserInfo.thumb}`" width="130.28rpx"
height="130.28rpx" shape="circle" v-if="oaUserInfo.thumb">
</u--image>
<u--image :showLoading="true" v-else src="@/static/img/public/avatar.png" width="130.28rpx"
height="130.28rpx" shape="circle">
</u--image>
<view @click="login" class="name_work" v-if="!$store.state.app.token">
<view class="name">
<text class="nickname">立即登录</text>
</view>
<view class="work">
登录后可查看更多
</view>
</view>
<view class="name_work" style="margin-top: 10rpx;" v-else>
<view class="name">
<text class="nickname">姓名:{{ oaUserInfo.nickname }}</text>
</view>
<view class="work">
<view class="wr_item">
<view class="wr_t_left">(技术部):</view>
<view class="wr_t_right">技术专业</view>
</view>
</view>
</view>
</view>
<view class="top_class">
<view class="top_class-one" v-for="(item,i) in list" :key="i" @click="listbiao(item,i)">
<view class="title_value">
{{item.num}}
</view>
<view class="title">
{{item.name}}
</view>
</view>
</view>
</view>
<view class="content-banner">
2023-11-05 15:34:42 +08:00
<view class="content-banner-title" style="display: flex;justify-content: space-between;">
<view class="">
待办事项
</view>
<view @click="gongao1">
更多
<text class="iconfont icon-xiangyou" style="margin-top: 5rpx;margin-right: 20rpx;"></text>
</view>
2023-11-05 00:11:08 +08:00
</view>
2023-11-05 15:34:42 +08:00
<view class="content-banner-detail" v-for="(item,k) in list2" :key='k' v-if="isshow1">
2023-11-05 00:11:08 +08:00
<view class="banner-detail">
<view class="banner-detail-title">
提醒
</view>
<view class="banner-detail-detail">
2023-11-05 15:34:42 +08:00
{{item.title}}
2023-11-05 00:11:08 +08:00
</view>
</view>
<view class="iconfont icon-xiangyou" style="margin-top: 5rpx;">
</view>
</view>
2023-11-05 15:34:42 +08:00
<view class="bootom-top-three" v-else>
<scroll-view scroll-x="true" scroll-left="0" class="top-three">
<view class="top_users-header">
<view class="">
{{list6.approve}}
</view>
<view class="title1">
待审批
</view>
</view>
<view class="top_users-header">
<view class="">
{{list6.expenses}}
</view>
<view class="title2">
待报销
</view>
</view>
<view class="top_users-header">
<view class="">
{{list6.approve}}
</view>
<view class="title3">
待审发票
</view>
</view>
<view class="top_users-header">
<view class="">
{{list6.approve}}
</view>
<view class="title4">
待回款
</view>
</view>
</scroll-view>
</view>
2023-11-05 00:11:08 +08:00
</view>
<view class="content-sort">
<view class="content-sort-con" v-for="(item,l) in list3" :key="l" @click="appcenter(item,l)">
<view class="sort-img">
<image :src="item.img" mode="aspectFit"></image>
</view>
<view class="name">
{{item.name}}
</view>
</view>
</view>
<view class="content-banner1">
<view class="content-banner-title">
<view class="">
公告
</view>
2023-11-05 15:34:42 +08:00
<view @click="gongao">
2023-11-05 00:11:08 +08:00
更多
<text class="iconfont icon-xiangyou" style="margin-top: 5rpx;margin-right: 20rpx;"></text>
</view>
</view>
<view class="content-banner-detail" v-for="(item,k) in list5" :key='k'>
<view class="banner-detail">
<view class="banner-detail-title">
<view class="">
提醒
</view>
</view>
<view class="banner-detail-detail">
{{item.title}}
</view>
</view>
</view>
</view>
<view class="content-bootom">
<view class="content-bootom-top">
<view class="bootom-top-one">
我的任务
</view>
<view class="bootom-top-two">
<text>更多</text>
<text class="iconfont icon-xiangyou" style="font-size: 25rpx;"></text>
</view>
2023-11-05 15:34:42 +08:00
2023-11-05 00:11:08 +08:00
</view>
<view class="content-bootom-detail">
<view class="bootom-detail" v-for="(item,h) in list4" :key="h">
<view class="bootom-detail-one">
<view class="detail-one-a" v-if='item.priority==4'>
{{item.priority_name}}
</view>
<view class="detail-one-a" v-else style="background-color: #F5F5F5;color: #999999;">
{{item.priority_name}}
</view>
<view class="detail-one-b">
{{item.title}}
</view>
<view class="detail-one-c" v-if="item.flow_status==3">
{{item.flow_name}}
</view>
2023-11-05 15:34:42 +08:00
<view class="detail-one-c" v-else style="background-color: #E4EDFF;color: #3274F9;">
2023-11-05 00:11:08 +08:00
{{item.flow_name}}
</view>
</view>
<view class="bootom-detail-two">
<view class="detail-twoa ">
2023-11-05 15:34:42 +08:00
2023-11-05 00:11:08 +08:00
</view>
<view class="detail-twob">
2023-11-05 15:34:42 +08:00
任务性质{{item.cate_name}} <text style="margin-left: 20rpx;">
计划完成时间{{item.end_time}}</text>
2023-11-05 00:11:08 +08:00
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import retuntop from '@/components/return/index.vue'
import {
getdatatotal,
getDocumentListApi,
projecttasklist,
2023-11-05 15:34:42 +08:00
todosubjec,
tasksubjec
2023-11-05 00:11:08 +08:00
} from '@/api/oa.js'
import {
HTTP_REQUEST_URL
} from '@/config/app.js'
export default {
components: {
retuntop
},
data() {
return {
title: 'Hello',
statusBarHeight: 0,
list: [],
list2: [{
detail: '提醒张三下达的紧急任务待完成'
},
{
detail: '提醒张三下达的紧急任务待完成'
},
],
list3: [{
name: '请假申请',
img: require('@/static/images/s2.png')
}, {
name: '出差申请',
img: require('@/static/images/s4.png')
}, {
name: '请假申请',
img: require('@/static/images/s3.png')
}, {
name: '采购申请',
img: require('@/static/images/s5.png')
}, {
name: '物品维修',
img: require('@/static/images/s8.png')
}, {
name: '用章申请',
img: require('@/static/images/s7.png')
}, {
name: '报销申请',
img: require('@/static/images/s6.png')
}, {
name: '更多',
img: require('@/static/images/s1.png')
}],
list4: [{
name: '紧急',
con: '紧急紧急紧急紧急紧急紧急紧急紧急紧急紧急紧急',
status: '紧急紧',
con1: '紧急紧急紧急紧急紧急紧急紧急紧急紧急紧急紧急',
con2: '紧急紧急紧急紧急紧急紧急紧急紧急紧急紧急紧急',
}, {
name: '紧急',
con: '紧急紧急紧急紧急紧急紧急紧急紧急紧急紧急紧急',
status: '紧急紧',
con1: '紧急紧急紧急紧急紧急紧急紧急紧急紧急紧急紧急',
con2: '紧急紧急紧急紧急紧急紧急紧急紧急紧急紧急紧急',
}, {
name: '紧急',
con: '紧急紧急紧急紧急紧急紧急紧急紧急紧急紧急紧急',
status: '紧急紧',
con1: '紧急紧急紧急紧急紧急紧急紧急紧急紧急紧急紧急',
con2: '紧急紧急紧急紧急紧急紧急紧急紧急紧急紧急紧急',
}],
HTTP_IMG_URL: '',
2023-11-05 15:34:42 +08:00
list5: [],
list6: {},
isshow1:true
2023-11-05 00:11:08 +08:00
}
},
computed: {
oaUserInfo() {
return this.$store.state.app.userInfo
},
},
onLoad() {
this.statusBarHeight = uni.getSystemInfoSync().statusBarHeight;
this.HTTP_IMG_URL = HTTP_REQUEST_URL
this.getList()
this.getDtnote()
this.getDocumentList2()
2023-11-05 15:34:42 +08:00
this.getDtlist()
this.getDtlist1()
2023-11-05 00:11:08 +08:00
},
methods: {
login() {
uni.reLaunch({
url: '/pages/oaLogin/oaLogin'
})
},
//获取公告
async getDtnote() {
let res = await getDocumentListApi({
page: 1,
limit: 2
})
2023-11-05 15:34:42 +08:00
2023-11-05 00:11:08 +08:00
this.list5 = res.data.data
},
async getDtlist() {
let res = await todosubjec()
2023-11-05 15:34:42 +08:00
this.list6 = res.data
2023-11-05 00:11:08 +08:00
// this.list5 = res.data.data
},
async getDtlist1() {
let res = await tasksubjec()
2023-11-05 15:34:42 +08:00
this.list2 = res.data.data
2023-11-05 00:11:08 +08:00
},
//获取任务
async getDocumentList2() {
2023-11-05 15:34:42 +08:00
2023-11-05 00:11:08 +08:00
let res = await projecttasklist({
page: 1,
limit: 3,
2023-11-05 15:34:42 +08:00
2023-11-05 00:11:08 +08:00
})
2023-11-05 15:34:42 +08:00
this.list4 = res.data.data
2023-11-05 00:11:08 +08:00
},
//获取部门
async getList() {
const res = await getdatatotal()
2023-11-05 15:34:42 +08:00
2023-11-05 00:11:08 +08:00
this.list = res.data
},
//列表
listbiao(item, i) {
switch (item.type) {
case "note":
uni.navigateTo({
url: '/pages/users/user_document/index'
})
break;
case "approve":
uni.switchTab({
url: '/pages/examine/index'
})
2023-11-05 15:34:42 +08:00
2023-11-05 00:11:08 +08:00
break;
case "expense":
uni.navigateTo({
url: '/pages/reimbursement/index'
})
break;
case "invoice":
uni.navigateTo({
url: '/pages/invoice/index'
})
break;
case "customer":
uni.navigateTo({
url: '/pages/personneltransfer/index'
})
break;
2023-11-05 15:34:42 +08:00
case "project":
2023-11-05 00:11:08 +08:00
uni.navigateTo({
url: '/pages/project/index'
})
break;
case "task":
uni.switchTab({
url: '/oaTask/oaTask'
})
break;
case "article":
uni.navigateTo({
url: '/pages/users/article/index'
})
break;
}
},
2023-11-05 15:34:42 +08:00
//公告
gongao() {
uni.navigateTo({
url: '/pages/users/user_document/index'
})
},
//待办
gongao1() {
this.isshow1=!this.isshow1
},
2023-11-05 00:11:08 +08:00
//应用中心
appcenter(item, i) {
switch (i) {
case 0:
uni.navigateTo({
url: '/pages/views/com_approve'
})
break;
case 1:
uni.navigateTo({
url: '/pages/appcenter/index'
})
break;
case 2:
uni.navigateTo({
url: '/pages/appcenter/index'
})
break;
case 3:
uni.navigateTo({
url: '/pages/appcenter/index'
})
break;
case 4:
uni.navigateTo({
url: '/pages/appcenter/index'
})
break;
case 5:
uni.navigateTo({
url: '/pages/appcenter/index'
})
break;
case 6:
uni.navigateTo({
url: '/pages/appcenter/index'
})
break;
case 7:
uni.navigateTo({
url: '/pages/appcenter/index'
})
break;
}
}
}
}
</script>
<style lang="scss">
page {
background: #F3F4F8;
}
.content {
.content-top {
width: 100%;
height: 761rpx;
background: #3274F9;
border-radius: 0px 0px 0px 0px;
opacity: 1;
.close {
position: absolute;
right: 0rpx;
margin-top: 30rpx;
}
.top_detail {
display: flex;
margin-top: 138rpx;
margin-bottom: 46rpx;
margin-left: 28rpx;
.top_detail_one {
width: 112rpx;
height: 112rpx;
background: #FFFFFF;
border-radius: 50%;
opacity: 1;
margin-right: 32rpx;
}
.top_detail_two {
.top_detail_twoa {
margin-bottom: 10rpx;
display: flex;
margin-top: 10rpx;
.name {
font-size: 32rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: #FFFFFF;
margin-right: 39rpx;
}
.phone {
font-size: 28rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #FFFFFF;
}
}
.top_detail_twob {
font-size: 28rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #FFFFFF;
}
}
}
.top_class {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding: 28rpx 28rpx;
.top_class-one {
flex-basis: 25%;
margin-bottom: 42rpx;
text-align: center;
.title {
font-size: 25rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #FFFFFF;
}
.title_value {
font-size: 39rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #FFFFFF;
margin-bottom: 21rpx;
}
}
}
}
2023-11-05 15:34:42 +08:00
.bootom-top-three {
display: flex;
white-space: nowrap;
.top_users-header {
display: inline-block;
margin-right: 30rpx;
text-align: center;
font-size: 53rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: rgba(0, 0, 0, 0.8);
.title1 {
width: 131rpx;
height: 42rpx;
line-height: 42rpx;
background-color: #3274F9;
text-align: center;
border-radius: 21rpx 21rpx;
font-size: 25rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #FFFFFF;
}
.title2 {
width: 131rpx;
height: 42rpx;
line-height: 42rpx;
background-color: #F9AA32;
text-align: center;
border-radius: 21rpx 21rpx;
font-size: 25rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #FFFFFF;
}
.title3 {
width: 131rpx;
height: 42rpx;
line-height: 42rpx;
background-color: #F9AA32;
text-align: center;
border-radius: 21rpx 21rpx;
font-size: 25rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #FFFFFF;
}
.title4 {
width: 131rpx;
height: 42rpx;
line-height: 42rpx;
background-color: red;
text-align: center;
border-radius: 21rpx 21rpx;
font-size: 25rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #FFFFFF;
}
}
}
2023-11-05 00:11:08 +08:00
.my_msg-con {
display: flex;
margin-top: 138rpx;
margin-bottom: 46rpx;
margin-left: 28rpx;
.name_work {
margin-left: 31.58rpx;
font-size: 28.07rpx;
.name {
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: #FFFFFF;
margin-right: 39rpx;
margin-top: 20rpx;
.nickname {
font-size: 32rpx;
font-weight: 500;
margin-right: 30rpx;
}
}
}
.work {
margin-top: 14.04rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: #FFFFFF;
margin-right: 39rpx;
.wr_item {
display: flex;
.wr_t_left {
flex-shrink: 0;
margin-right: 12rpx;
}
}
}
.omit {
white-space: nowrap;
/* 禁止换行 */
overflow: hidden;
/* 溢出隐藏 */
text-overflow: ellipsis;
/* 使用省略号代表被截断的文本 */
}
}
.content-banner {
width: 694rpx;
height: 221rpx;
background: #FFFFFF;
border-radius: 21rpx 21rpx;
margin: 0 auto;
margin-top: -100rpx;
padding-left: 28rpx;
padding-top: 28rpx;
.content-banner-title {
font-size: 32rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: rgba(0, 0, 0, 0.8);
}
.content-banner-detail {
display: flex;
justify-content: space-between;
margin-top: 19rpx;
padding-right: 28rpx;
.banner-detail {
display: flex;
.banner-detail-title {
margin-right: 14rpx;
width: 77rpx;
height: 42rpx;
text-align: center;
line-height: 42rpx;
border-radius: 7rpx 7rpx;
opacity: 1;
border: 1px solid #FF8C1A;
font-size: 25rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #FF8C1A;
}
.banner-detail-detail {
font-size: 28rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #666666;
}
}
}
}
.content-banner1 {
width: 694rpx;
height: 221rpx;
background: #FFFFFF;
border-radius: 21rpx 21rpx;
margin: 0 auto;
margin-top: 25rpx;
padding-left: 28rpx;
padding-top: 28rpx;
.content-banner-title {
display: flex;
justify-content: space-between;
font-size: 32rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: rgba(0, 0, 0, 0.8);
}
.content-banner-detail {
display: flex;
justify-content: space-between;
margin-top: 19rpx;
padding-right: 28rpx;
.banner-detail {
display: flex;
.banner-detail-title {
margin-right: 14rpx;
width: 77rpx;
height: 42rpx;
text-align: center;
line-height: 42rpx;
border-radius: 7rpx 7rpx;
opacity: 1;
border: 1px solid #FF8C1A;
font-size: 25rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #FF8C1A;
}
.banner-detail-detail {
font-size: 28rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #666666;
}
}
}
}
.content-sort {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
width: 694rpx;
height: 361rpx;
background: #FFFFFF;
border-radius: 21rpx 21rpx;
margin: 0 auto;
margin-top: 32rpx;
.content-sort-con {
width: 25%;
text-align: center;
margin-top: 28rpx;
.sort-img {
width: 88rpx;
height: 88rpx;
margin: 0 auto;
image {
width: 100%;
height: 100%;
}
}
}
}
.content-bootom {
width: 694rpx;
background: #FFFFFF;
border-radius: 21rpx 21rpx;
margin: 0 auto;
margin-top: 32rpx;
margin-bottom: 32rpx;
.content-bootom-top {
display: flex;
justify-content: space-between;
padding: 28rpx 28rpx;
.bootom-top-one {
font-size: 32rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: rgba(0, 0, 0, 0.8);
}
.bootom-top-two {
font-size: 25rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #000000;
}
}
.content-bootom-detail {
padding: 28rpx 28rpx;
.bootom-detail {
padding-bottom: 21rpx;
padding-top: 21rpx;
border-bottom: 1px solid #CCCCCC;
.bootom-detail-one {
display: flex;
justify-content: space-between;
.detail-one-a {
width: 63rpx;
height: 35rpx;
line-height: 35rpx;
text-align: center;
background: #FFE4E4;
border-radius: 7rpx 7rpx;
font-size: 25rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #F24848;
}
.detail-one-b {
width: 450rpx;
overflow: hidden;
font-size: 28rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: rgba(0, 0, 0, 0.8);
}
.detail-one-c {
width: 116rpx;
height: 49rpx;
line-height: 49rpx;
text-align: center;
background: #DFFCDF;
border-radius: 74rpx 74rpx;
font-size: 28rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #F24848;
}
}
.bootom-detail-two {
.detail-twoa {
font-size: 25rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #333333;
margin-top: 21rpx;
}
.detail-twob {
font-size: 25rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
margin-top: 14rpx;
}
}
}
}
}
}
</style>