剔除不上线内容
This commit is contained in:
aixianling
553
src/pending/party/AppThreeSessions/AppThreeSessions.vue
Normal file
553
src/pending/party/AppThreeSessions/AppThreeSessions.vue
Normal file
@@ -0,0 +1,553 @@
|
||||
<template>
|
||||
<div class="page">
|
||||
<div v-if="isShow" style="height:100%;">
|
||||
<div class="fixed-top" style="width:100%;">
|
||||
<!-- 头部搜索样式 -->
|
||||
<div class="search-box">
|
||||
<div class="search-input flex-row" @click="changeSearchBox">
|
||||
<image src="https://cdn.cunwuyun.cn/img/search-red.svg"></image>
|
||||
<span>{{ inputValue }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 选择时间和类型 -->
|
||||
<div class='slect flex-row'>
|
||||
<!-- 类型选择 -->
|
||||
<div class="uni-list type-slect">
|
||||
<div class="uni-list-cell">
|
||||
<div class="uni-list-cell-db">
|
||||
<picker @change="bindPickerChange" :range="array" range-key="dictName">
|
||||
<div class="uni-input">{{ meetTypespan }}</div>
|
||||
<image src="https://cdn.cunwuyun.cn/img/down.svg"></image>
|
||||
</picker>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 时间选择 -->
|
||||
<div class="uni-list type-slect">
|
||||
<div class="uni-list-cell">
|
||||
<div class="uni-list-cell-db">
|
||||
<picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindDateChange"
|
||||
fields='month'>
|
||||
<div class="uni-input">{{ day }}</div>
|
||||
<image src="https://cdn.cunwuyun.cn/img/down.svg"></image>
|
||||
</picker>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="session-list">
|
||||
<div class="session-item" v-for="(item, index) in meetList" :key="index">
|
||||
<div class="item-top" @click="toSessionDetail(item.meetingId, item.status)">
|
||||
<div class="item-title mar-b12">{{ item.meetingAgenda }}</div>
|
||||
<div class="item-info">
|
||||
<span class="info-label">会议状态：</span>
|
||||
<span :class="'item-status'+item.postStatus" class="info-value">
|
||||
{{ $dict.getLabel('postStatus', item.postStatus) }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="item-info">
|
||||
<span class="info-label">开始时间：</span>
|
||||
<span class="info-value">{{ item.startTime || '-' }}</span>
|
||||
</div>
|
||||
<div class="item-info">
|
||||
<span class="info-label">会议地点：</span>
|
||||
<span class="info-value">{{ item.meetingAddress || '-' }}</span>
|
||||
</div>
|
||||
<div class="item-info">
|
||||
<span class="info-label">主持人员：</span>
|
||||
<span class="info-value">{{ item.hostName || '-' }}</span>
|
||||
</div>
|
||||
<div class="item-info mar-b12">
|
||||
<span class="info-label">会议类型：</span>
|
||||
<span class="info-value">{{ item.meetingClassification || '-' }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item-bottom">
|
||||
<span class="item-btn border-E1E1E1" v-if="item.status == 3">已请假</span>
|
||||
<span class="item-btn border-1365DD" v-if="item.status == 0" @click="signMeeting(item.meetingId)">签到</span>
|
||||
<span class="item-btn border-E1E1E1" v-if="item.status == 1">已签到</span>
|
||||
<span class="item-btn border-E1E1E1" v-if="item.status == 4">不签到</span>
|
||||
</div>
|
||||
<div class="item-status" :class="'item-status'+item.postStatus">
|
||||
{{ $dict.getLabel('postStatus', item.postStatus) }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<AiEmpty v-if="meetList.length == 0"/>
|
||||
</div>
|
||||
<div v-if="!isShow" class="search-input">
|
||||
<div class="input-box flex-row">
|
||||
<input class="input" placeholder="请输入会议标题" focus="false" v-model="searchValue" @blur="onBlur"/>
|
||||
<image class="sousuo" src="https://cdn.cunwuyun.cn/img/search-active.svg"></image>
|
||||
<image v-if="searchValue" @tap="clearInput" class="clear"
|
||||
src="https://cdn.cunwuyun.cn/img/empty-Input.svg"></image>
|
||||
<div class="search-word" @click="search">搜索</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {mapState} from 'vuex'
|
||||
|
||||
export default {
|
||||
name:"AppThreeSessions",
|
||||
appName: "三会一课",
|
||||
data() {
|
||||
const currentDate = this.getDate({
|
||||
format: true
|
||||
})
|
||||
return {
|
||||
inputValue: "请输入会议标题",
|
||||
isShow: true,
|
||||
array: [],
|
||||
meetType: "",
|
||||
meetTypespan: "会议类型",
|
||||
index: 0,
|
||||
date: currentDate,
|
||||
day: "会议时间",
|
||||
createDate: "",//创建时间
|
||||
meetList: [],
|
||||
searchValue: "",//搜索框输入值
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
pages: 2,
|
||||
userId: '',
|
||||
partyId: '',
|
||||
meetTypeIndex: '',
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
startDate() {
|
||||
return this.getDate('start');
|
||||
},
|
||||
endDate() {
|
||||
return this.getDate('end');
|
||||
},
|
||||
...mapState(['user']),
|
||||
},
|
||||
onLoad() {
|
||||
this.partyId = this.user.id
|
||||
this.$dict.load('postStatus', 'meetingClassification')
|
||||
this.array = this.$dict.getDict('meetingClassification')
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
signMeeting(id) {
|
||||
this.$http.post(`/app/appthreemeetinguser/signByMeetingIdAndUserIdForWX?meetingId=${id}&userId=${this.user.id}`, null, {}).then(res => {
|
||||
if (res.code == 0) {
|
||||
this.$toast('签到成功')
|
||||
this.pageNum = 1;
|
||||
this.pages = 2;
|
||||
this.getList()
|
||||
}
|
||||
}).catch(err => {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: err,
|
||||
duration: 2000
|
||||
});
|
||||
})
|
||||
},
|
||||
btnClick(span) {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: span,
|
||||
duration: 2000
|
||||
});
|
||||
},
|
||||
bindPickerChange(e) {
|
||||
this.array.map((item, index) => {
|
||||
if (e.detail.value == item.dictValue) {
|
||||
this.meetTypespan = this.array[index].dictName
|
||||
}
|
||||
})
|
||||
this.meetTypeIndex = e.detail.value
|
||||
this.pageNum = 1;
|
||||
this.pages = 2;
|
||||
this.pageSize = 10;
|
||||
this.getList()
|
||||
},
|
||||
bindDateChange: function (e) {
|
||||
this.day = e.target.value;
|
||||
this.createDate = e.target.value + '-' + "01"
|
||||
this.pageNum = 1;
|
||||
this.pages = 2;
|
||||
this.pageSize = 10;
|
||||
this.getList()
|
||||
},
|
||||
getDate(type) {
|
||||
const date = new Date();
|
||||
let year = date.getFullYear();
|
||||
let month = date.getMonth() + 1;
|
||||
let day = date.getDate();
|
||||
|
||||
if (type === 'start') {
|
||||
year = year - 60;
|
||||
} else if (type === 'end') {
|
||||
year = year + 2;
|
||||
}
|
||||
month = month > 9 ? month : '0' + month;
|
||||
day = day > 9 ? day : '0' + day;
|
||||
|
||||
return `${year}-${month}-08 00:00:00 `;
|
||||
},
|
||||
changeSearchBox() {
|
||||
this.isShow = false;
|
||||
},
|
||||
onBlur(e) {
|
||||
this.searchValue = e.target.value;
|
||||
if (this.searchValue) {
|
||||
this.inputValue = this.searchValue;
|
||||
} else {
|
||||
this.inputValue = "请输入会议标题";
|
||||
}
|
||||
},
|
||||
search() {
|
||||
this.isShow = true;
|
||||
this.pageNum = 1;
|
||||
this.pageSize = 10;
|
||||
this.pages = 2;
|
||||
this.getList()
|
||||
},
|
||||
clearInput() {
|
||||
this.searchValue = ''
|
||||
this.inputValue = "请输入会议标题";
|
||||
},
|
||||
getList() {
|
||||
if (this.pageNum > this.pages) return
|
||||
// var searchYMD = ''
|
||||
// if(this.createDate) {
|
||||
// searchYMD = this.createDate + '-01'
|
||||
// }
|
||||
this.$http.post(`/app/appthreemeetinguser/listForWX?meetingUserId=${this.user.id}&meetingAgenda=${this.searchValue}&meetingClassification=${this.meetTypeIndex}&searchYMD=${this.createDate}¤t=${this.pageNum}&size=${this.pageSize}`
|
||||
).then(res => {
|
||||
if (res.code == 0) {
|
||||
const meetList = this.pageNum > 1 ? [...this.meetList, ...res.data.records] : res.data.records
|
||||
meetList.map(item => {
|
||||
if (item.meetingClassification.length == 1) {
|
||||
item.meetingClassification = this.$dict.getLabel('meetingClassification', item.meetingClassification)
|
||||
} else {
|
||||
var typeList = item.meetingClassification.split(',')
|
||||
typeList.map((items, index) => {
|
||||
if (index == 0) {
|
||||
item.meetingClassification = this.$dict.getLabel('meetingClassification', items)
|
||||
} else {
|
||||
item.meetingClassification = item.meetingClassification + ',' + this.$dict.getLabel('meetingClassification', items)
|
||||
}
|
||||
return item.meetingClassification
|
||||
})
|
||||
return item.meetingClassification
|
||||
}
|
||||
return item
|
||||
})
|
||||
this.pages = Math.ceil(res.data.total / 10)
|
||||
this.meetList = meetList
|
||||
}
|
||||
})
|
||||
},
|
||||
toSessionDetail(id, signStatus) {
|
||||
uni.navigateTo({
|
||||
url: `../threeSessions/threeSessionsDetail?id=${id}&signStatus=${signStatus}&token=${uni.getStorageSync("token")}`
|
||||
})
|
||||
},
|
||||
leave() {
|
||||
uni.showModal({
|
||||
title: '如需请假，请联系签到负责人',
|
||||
confirmspan: "确认",
|
||||
confirmColor: "#135AB8",
|
||||
success: function (res) {
|
||||
if (res.confirm) {
|
||||
} else if (res.cancel) {
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
changeStatus(id, signStatus, joinStatus, signMethod, absence, meetingUserId, meetingId, successspan) {
|
||||
let signTime = new Date().getFullYear() + '-' + this.isDate(new Date().getMonth() + 1) + '-' + this.isDate(new Date().getDate()) + ' ' + this.isDate(new Date().getHours()) + ':' + this.isDate(new Date().getMinutes()) + ':' + this.isDate(new Date().getSeconds())
|
||||
var params = {
|
||||
id,
|
||||
signStatus,
|
||||
joinStatus,
|
||||
signMethod,
|
||||
absence,
|
||||
signUserId: this.user.id,
|
||||
signUserName: this.user.realName,
|
||||
signTime,
|
||||
meetingUserId,
|
||||
meetingId
|
||||
}
|
||||
this.$http.post(`/app/appthreemeetinguser/addOrUpdate`, null, {
|
||||
data: params
|
||||
}).then(res => {
|
||||
if (res?.code == 0) {
|
||||
uni.showToast({
|
||||
title: successspan + '成功！',
|
||||
duration: 2000
|
||||
});
|
||||
this.pageNum = 1;
|
||||
this.pages = 2;
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
},
|
||||
isDate(num) {
|
||||
if (num < 10) {
|
||||
num = '0' + num
|
||||
}
|
||||
return num
|
||||
},
|
||||
},
|
||||
onReachBottom() {
|
||||
this.pageNum = this.pageNum + 1
|
||||
this.getList()
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scope>
|
||||
@import "../../../common/common.css";
|
||||
|
||||
.page {
|
||||
.search-box {
|
||||
width: 100%;
|
||||
height: 112px;
|
||||
background-color: #e60012;
|
||||
padding: 24px 32px;
|
||||
box-sizing: border-box;
|
||||
|
||||
.search-input {
|
||||
line-height: 64px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: #CE0010;
|
||||
border-radius: 32px;
|
||||
color: #F0CBCD;
|
||||
font-size: 26px;
|
||||
|
||||
image {
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
margin: 8px 8px 8px 24px;
|
||||
position: relative;
|
||||
top: 6px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.slect {
|
||||
width: 100%;
|
||||
height: 96px;
|
||||
background-color: #fff;
|
||||
color: #666;
|
||||
|
||||
.type-slect {
|
||||
width: 50%;
|
||||
border-right: 1px solid #F7F7F7;
|
||||
margin: 30px 0;
|
||||
box-sizing: border-box;
|
||||
text-align: center;
|
||||
font-size: 26px;
|
||||
|
||||
.uni-input {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
top: 6px;
|
||||
margin-left: 8 srpx;
|
||||
}
|
||||
}
|
||||
|
||||
.type-slect:nth-child(2) {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
.search-input {
|
||||
.input-box {
|
||||
width: 100%;
|
||||
height: 112px;
|
||||
background-color: #fff;
|
||||
padding: 24px 32px;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
|
||||
.sousuo {
|
||||
position: absolute;
|
||||
top: 35px;
|
||||
left: 60px;
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
}
|
||||
|
||||
.input {
|
||||
background-color: #F3F3F3;
|
||||
width: 598px;
|
||||
height: 64px;
|
||||
color: #999999;
|
||||
font-size: 26px;
|
||||
margin-left: 8px;
|
||||
border-radius: 32px;
|
||||
padding-left: 70px;
|
||||
padding-right: 60px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.clear {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
position: absolute;
|
||||
top: 40px;
|
||||
right: 130px;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.search-word {
|
||||
font-size: 28px;
|
||||
color: #135AB8;
|
||||
line-height: 60px;
|
||||
margin-left: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.session-list {
|
||||
padding-top: 224px;
|
||||
|
||||
.session-item {
|
||||
width: 686px;
|
||||
margin: 0 auto 32px auto;
|
||||
background-color: #fff;
|
||||
// height: 462rpx;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
|
||||
.item-top {
|
||||
padding: 32px 32px 0 32px;
|
||||
}
|
||||
|
||||
.item-title {
|
||||
font-size: 32px;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
line-height: 44px;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.item-info {
|
||||
line-height: 42px;
|
||||
font-size: 28px;
|
||||
margin-bottom: 8px;
|
||||
|
||||
.info-label {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.item-bottom {
|
||||
border-top: 2px solid #EEE;
|
||||
text-align: right;
|
||||
padding-right: 64px;
|
||||
box-sizing: border-box;
|
||||
line-height: 96px;
|
||||
|
||||
.item-btn {
|
||||
display: inline-block;
|
||||
width: 152px;
|
||||
height: 52px;
|
||||
line-height: 52px;
|
||||
border-radius: 28px;
|
||||
text-align: center;
|
||||
font-size: 28px;
|
||||
margin-left: 32px;
|
||||
border: 2px solid #E1E1E1;
|
||||
}
|
||||
}
|
||||
|
||||
.info-value {
|
||||
color: #343D65;
|
||||
background-color: #fff !important;
|
||||
}
|
||||
|
||||
.item-status {
|
||||
position: absolute;
|
||||
top: 14px;
|
||||
right: -36rpx;
|
||||
width: 140px;
|
||||
text-align: center;
|
||||
line-height: 44px;
|
||||
font-size: 24px;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
.item-status1 {
|
||||
color: #FF9B2B;
|
||||
background-color: #FFF3E8;
|
||||
}
|
||||
|
||||
.item-status0 {
|
||||
color: #2EA222;
|
||||
background-color: #EAF5E8;
|
||||
}
|
||||
|
||||
.item-status3 {
|
||||
color: #999;
|
||||
background-color: #F2F2F2;
|
||||
}
|
||||
|
||||
.item-status2 {
|
||||
color: #5A98F2;
|
||||
background-color: #F1F6FF;
|
||||
}
|
||||
|
||||
.color-1365DD {
|
||||
color: #1365DD;
|
||||
}
|
||||
|
||||
.color-FF4466 {
|
||||
color: #FF4466;
|
||||
}
|
||||
|
||||
.color-333333 {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.color-606060 {
|
||||
color: #606060;
|
||||
}
|
||||
|
||||
.border-1365DD {
|
||||
border-color: #1365DD !important;
|
||||
color: #1365DD !important;
|
||||
}
|
||||
|
||||
.border-E1E1E1 {
|
||||
border-color: #E1E1E1 !important;
|
||||
color: #606060;
|
||||
}
|
||||
|
||||
.border-E1E1E1 {
|
||||
border-color: #E1E1E1 !important;
|
||||
}
|
||||
|
||||
.mar-b12 {
|
||||
margin-bottom: 26px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.no-affairs {
|
||||
width: 100%;
|
||||
height: calc(100% - 210rpx);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user