449 lines
8.8 KiB
Vue
449 lines
8.8 KiB
Vue
<template>
|
|
<view class="content" :style="{'height':BarHeight+'px'}">
|
|
<view class="content-con">
|
|
<view class="content-left">
|
|
<view class="content-left-img">
|
|
<image src="@/static/images/logo.png" mode=""></image>
|
|
</view>
|
|
<view class="content-left-one" v-for="(item, index) in list" :key="index" @click="getlist(index)">
|
|
<view class="left-one" :class="{ 'lefcolor': num === index }">
|
|
{{item.name}}
|
|
</view>
|
|
</view>
|
|
<view class="content-left-bottom">
|
|
<view class="left-bottom-left">
|
|
<view class="left-bottom">
|
|
<image :src="oaUserInfo.avatar" mode=""></image>
|
|
</view>
|
|
<view class="left-bottom1">
|
|
{{oaUserInfo.nickname}}
|
|
</view>
|
|
</view>
|
|
<view class="left-bottom-right">
|
|
<view class="bottom-right1">
|
|
<view class="bottom-right_a">
|
|
</view>
|
|
<view class="bottom-right_b">
|
|
{{oaUserInfo.nickname ?'在线':'离线'}}
|
|
</view>
|
|
</view>
|
|
<view class="bottom-right2" @click="logout">
|
|
切换账号
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="content-right">
|
|
<index ref="list" @onfunction='onfunction' v-show="showIndexComponent" />
|
|
<indexa :type='type' @outfun='outfun' v-if="showIndexAComponent" />
|
|
<index1 ref="list1" @onfunction='onfunction' v-show="showIndex1Component" />
|
|
<indexb :type='type' @outfun='outfun' v-if="showIndexBComponent" />
|
|
<pindex ref="list2" @onfunction='onfunction' v-show="showPIndexComponent" />
|
|
<indexc :type='type' @outfun='outfun' v-if="showIndexCComponent" />
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
getdatatotal,
|
|
getDocumentListApi,
|
|
projecttasklist,
|
|
todosubjec,
|
|
tasksubjec
|
|
} from '@/api/oa.js'
|
|
import {
|
|
HTTP_REQUEST_URL
|
|
} from '@/config/app.js'
|
|
import Cache from '@/utils/cache';
|
|
import index from '@/components/index/index.vue'
|
|
import index1 from '@/components/index/index1.vue'
|
|
import pindex from '@/components/index/indexg.vue'
|
|
import indexa from '@/components/index/detaila.vue'
|
|
import indexb from '@/components/index/detailb.vue'
|
|
import indexc from '@/components/index/detailc.vue'
|
|
export default {
|
|
components: {
|
|
index,
|
|
index1,
|
|
pindex,
|
|
indexa,
|
|
indexb,
|
|
indexc
|
|
},
|
|
data() {
|
|
|
|
return {
|
|
title: 'Hello',
|
|
BarHeight: '',
|
|
list: [{
|
|
name: '待取货',
|
|
id: 0
|
|
},
|
|
{
|
|
name: '配送中',
|
|
id: 1
|
|
},
|
|
{
|
|
name: '已送达',
|
|
id: 2
|
|
},
|
|
],
|
|
num: 0,
|
|
isshow: true,
|
|
isshow1: true,
|
|
isshow2: true,
|
|
type: ''
|
|
}
|
|
},
|
|
computed: {
|
|
oaUserInfo() {
|
|
return this.$store.state.app.userInfo
|
|
},
|
|
showIndexComponent: function() {
|
|
return this.num === 0 && this.isshow;
|
|
},
|
|
showIndexAComponent: function() {
|
|
return this.num === 0 && !this.isshow;
|
|
},
|
|
showIndex1Component: function() {
|
|
return this.num === 1 && this.isshow1;
|
|
},
|
|
showIndexBComponent: function() {
|
|
return this.num === 1 && !this.isshow1;
|
|
},
|
|
showPIndexComponent: function() {
|
|
return this.num === 2 && this.isshow2;
|
|
},
|
|
showIndexCComponent: function() {
|
|
return this.num === 2 && !this.isshow2;
|
|
}
|
|
},
|
|
|
|
onLoad() {
|
|
|
|
if (!Cache.get("TOKEN")) {
|
|
uni.showModal({
|
|
title: '提示',
|
|
content: '用户信息不存在,是否确定登录？',
|
|
cancelText: "取消", // 取消按钮的文字
|
|
confirmText: "确认", // 确认按钮的文字
|
|
showCancel: true, // 是否显示取消按钮，默认为 true
|
|
confirmColor: '#f55850',
|
|
cancelColor: '#39B54A',
|
|
success: (res) => {
|
|
if (res.confirm) {
|
|
uni.reLaunch({
|
|
url: '/pages/oaLogin/oaLogin'
|
|
})
|
|
console.log('comfirm') //点击确定之后执行的代码
|
|
} else {
|
|
console.log('cancel') //点击取消之后执行的代码
|
|
}
|
|
}
|
|
})
|
|
|
|
|
|
}
|
|
|
|
},
|
|
|
|
// onPullDownRefresh() {
|
|
// if (this.num == 0 && this.isshow) {
|
|
// this.$refs.list.refresh()
|
|
// uni.stopPullDownRefresh()
|
|
// } else if (this.num == 1 && this.isshow1) {
|
|
// this.$refs.list1.refresh()
|
|
// uni.stopPullDownRefresh()
|
|
// } else if (this.num == 2 && this.isshow2) {
|
|
// this.$refs.list2.refresh()
|
|
// uni.stopPullDownRefresh()
|
|
// }
|
|
// },
|
|
onShow() {
|
|
|
|
this.$nextTick(() => {
|
|
setTimeout(() => {
|
|
|
|
if (this.num == 0 && this.isshow) {
|
|
|
|
this.$refs.list.refresh()
|
|
|
|
|
|
} else if (this.num == 1 && this.isshow1) {
|
|
|
|
this.$refs.list1.refresh()
|
|
|
|
|
|
|
|
} else if (this.num == 2 && this.isshow2) {
|
|
|
|
this.$refs.list2.refresh()
|
|
|
|
}
|
|
}, 0)
|
|
})
|
|
},
|
|
|
|
mounted() {
|
|
|
|
|
|
},
|
|
methods: {
|
|
login() {
|
|
uni.clearStorageSync()
|
|
uni.reLaunch({
|
|
url: '/pages/oaLogin/oaLogin'
|
|
})
|
|
},
|
|
logout() {
|
|
|
|
uni.showModal({
|
|
title: '提示',
|
|
content: '确定退出？',
|
|
cancelText: "取消", // 取消按钮的文字
|
|
confirmText: "确认", // 确认按钮的文字
|
|
showCancel: true, // 是否显示取消按钮，默认为 true
|
|
confirmColor: '#f55850',
|
|
cancelColor: '#39B54A',
|
|
success: (res) => {
|
|
if (res.confirm) {
|
|
uni.reLaunch({
|
|
url: '/pages/oaLogin/oaLogin'
|
|
})
|
|
console.log('comfirm') //点击确定之后执行的代码
|
|
} else {
|
|
console.log('cancel') //点击取消之后执行的代码
|
|
}
|
|
}
|
|
})
|
|
|
|
},
|
|
getlist(index) {
|
|
this.num = index
|
|
if (index == 1) {
|
|
this.$refs.list1.refresh()
|
|
this.isshow2 = true
|
|
this.isshow = true
|
|
uni.showLoading({
|
|
title: '加载中'
|
|
})
|
|
}
|
|
if (index == 2) {
|
|
this.isshow1 = true
|
|
this.isshow = true
|
|
this.$refs.list2.refresh()
|
|
|
|
uni.showLoading({
|
|
title: '加载中'
|
|
})
|
|
}
|
|
|
|
if (index == 0) {
|
|
uni.showLoading({
|
|
title: '加载中'
|
|
})
|
|
this.$refs.list.refresh()
|
|
|
|
this.isshow1 = true
|
|
this.isshow2 = true
|
|
}
|
|
|
|
},
|
|
onfunction(e, id) {
|
|
|
|
if (id == 1) {
|
|
this.isshow = false
|
|
this.type = e
|
|
} else if (id == 2) {
|
|
this.isshow1 = false
|
|
this.type = e
|
|
} else {
|
|
this.isshow2 = false
|
|
this.type = e
|
|
}
|
|
|
|
},
|
|
|
|
|
|
|
|
outfun(e) {
|
|
if (e == 1) {
|
|
this.$refs.list.refresh()
|
|
this.isshow = true
|
|
} else if (e == 2) {
|
|
this.$refs.list1.refresh()
|
|
this.isshow1 = true
|
|
} else {
|
|
this.$refs.list2.refresh()
|
|
this.isshow2 = true
|
|
}
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
page {
|
|
// background: #Fff;
|
|
// width: 1024px;
|
|
// border: 1px solid red;
|
|
|
|
}
|
|
|
|
.content {
|
|
position: relative;
|
|
height: 100vh;
|
|
|
|
|
|
.content-con {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.content-left {
|
|
width: 136rpx;
|
|
|
|
|
|
|
|
margin-left: 10rpx;
|
|
margin-right: 10rpx;
|
|
|
|
.content-left-img {
|
|
width: 50rpx;
|
|
height: 45rpx;
|
|
margin: 0 auto;
|
|
margin-bottom: 37rpx;
|
|
margin-top: 40rpx;
|
|
|
|
image {
|
|
width: 50rpx;
|
|
height: 45rpx;
|
|
}
|
|
}
|
|
|
|
.content-left-one {
|
|
text-align: center;
|
|
width: 136rpx;
|
|
height: 39rpx;
|
|
line-height: 39rpx;
|
|
margin-bottom: 30rpx;
|
|
}
|
|
|
|
.left-one {
|
|
|
|
|
|
font-size: 13rpx;
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
font-weight: 500;
|
|
color: #333333;
|
|
|
|
margin: 0 auto;
|
|
|
|
|
|
}
|
|
|
|
.lefcolor {
|
|
background: #DDE9FE;
|
|
font-size: 13rpx;
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
font-weight: 500;
|
|
color: #0022C7;
|
|
}
|
|
|
|
.content-left-bottom {
|
|
position: absolute;
|
|
width: 136rpx;
|
|
bottom: 0rpx;
|
|
height: 62rpx;
|
|
|
|
|
|
background-color: #F5F8FE;
|
|
|
|
.left-bottom-left {
|
|
display: flex;
|
|
|
|
.left-bottom1 {
|
|
font-size: 12rpx;
|
|
font-family: PingFang SC-Semibold, PingFang SC;
|
|
font-weight: 600;
|
|
color: #0022C7;
|
|
margin-top: 10rpx;
|
|
}
|
|
|
|
.left-bottom {
|
|
width: 26rpx;
|
|
height: 26rpx;
|
|
border-radius: 50%;
|
|
margin-right: 10rpx;
|
|
margin-left: 30rpx;
|
|
|
|
image {
|
|
width: 26rpx;
|
|
height: 26rpx;
|
|
border-radius: 50%;
|
|
}
|
|
|
|
|
|
}
|
|
}
|
|
|
|
.left-bottom-right {
|
|
display: flex;
|
|
justify-content: space-around;
|
|
line-height: 25rpx;
|
|
margin-top: 10rpx;
|
|
|
|
.bottom-right1 {
|
|
display: flex;
|
|
|
|
|
|
.bottom-right_a {
|
|
width: 10rpx;
|
|
height: 10rpx;
|
|
border-radius: 50%;
|
|
background-color: #46BE61;
|
|
margin-top: 8rpx;
|
|
margin-right: 10rpx;
|
|
}
|
|
|
|
.bottom-right_b {
|
|
font-size: 10rpx;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #333333;
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.bottom-right2 {
|
|
font-size: 10rpx;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #333333;
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
.content-right {
|
|
background: linear-gradient(180deg, #D8E6FE 0%, rgba(228, 236, 251, 0.39) 16%, rgba(244, 246, 252, 0.61) 100%);
|
|
border-radius: 15px 0px 0px 0px;
|
|
padding-top: 5rpx;
|
|
padding-left: 15rpx;
|
|
padding-right: 15rpx;
|
|
width: calc(100% - 156rpx);
|
|
|
|
}
|
|
|
|
}
|
|
</style> |