parent
f7c5a3a2ac
commit
6c0b8a9c6a
@ -0,0 +1,229 @@
|
||||
<template>
|
||||
<div class="my-meeting-style">
|
||||
<div class="dom-search-style">
|
||||
<span>会议状态</span>
|
||||
<a-select :value="status" style="width: 100%" @change="statusChange">
|
||||
<a-select-option v-for="item in statusArr" :key="item.id">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
<div class="apply-content-div">
|
||||
<a-spin :spinning="showLoading">
|
||||
<div class="data-list-div">
|
||||
<vue-scroll :ops="listScroll" style="height:25rem" v-if="!showLoading && dataList.length > 0">
|
||||
<div class="data-row-div" v-for="item,index in dataList" :key="item.room_id">
|
||||
<div class="top-info-row-div">
|
||||
<span class="room-type-div">{{item.room_type_str}}</span>
|
||||
</div>
|
||||
<div class="info-row-div">
|
||||
<a-icon type="history" /><span class="room-other-info-div">{{item.begin_time + '--' + item.end_time}}</span>
|
||||
</div>
|
||||
<div class="info-row-div">
|
||||
<a-icon type="safety-certificate" /><span class="room-other-info-div">{{item.theme}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</vue-scroll>
|
||||
<div class="no-data-div" v-if="!showLoading && dataList.length == 0">
|
||||
<a-empty></a-empty>
|
||||
</div>
|
||||
</div>
|
||||
</a-spin>
|
||||
</div>
|
||||
<div class="page-dom-div">
|
||||
<a-icon type="left-circle" title="上一页"
|
||||
:class="'page-icon-dom '+ (pageNumber == 1?'cannot-click':'can-click')"
|
||||
v-on:click="changePage('previous')"/>
|
||||
<span class="total-num-span">共{{totolNum}}条</span>
|
||||
<a-icon type="right-circle" title="下一页"
|
||||
:class="'page-icon-dom '+ (pageNumber == totalPage?'cannot-click':'can-click')"
|
||||
v-on:click="changePage('next')"/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {Select,Spin,Empty,Icon} from 'ant-design-vue';
|
||||
import InterConfig from '../meetingRoom/interConfig';
|
||||
export default{
|
||||
data(){
|
||||
return {
|
||||
showLoading: true,
|
||||
listScroll: this.StaticParams.scrollOption,
|
||||
statusArr: [{id: 3, name: "全部"}, {id: 0, name: "未开始"}, {id: 1, name: "进行中"}, {
|
||||
id: 2,
|
||||
name: "延时中"
|
||||
}, {id: -1, name: "已结束"}],
|
||||
status: 3,
|
||||
pageNumber: 1,
|
||||
pageSize: 6,
|
||||
totolNum: 0,
|
||||
totalPage: 0,
|
||||
dataList: [],//数据列表集合
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.getMyMeetingList();
|
||||
},
|
||||
methods: {
|
||||
statusChange: function (status) {
|
||||
if (this.status !== status) {
|
||||
this.status = status;
|
||||
this.getMyMeetingList();
|
||||
}
|
||||
},
|
||||
getMyMeetingList: function () {
|
||||
this.showLoading = true;
|
||||
let param = {
|
||||
org_id: this.BaseConfig.person_info_my.bureau_id,
|
||||
person_id: this.BaseConfig.userInfo.person_id,
|
||||
page_number: this.pageNumber,
|
||||
page_size: this.pageSize,
|
||||
}
|
||||
if (this.status < 3) {
|
||||
param.meeting_status = this.status;
|
||||
}
|
||||
this.InterfaceConfig.callInterface([{
|
||||
url: InterConfig.getMyMeetingList.url,
|
||||
params: param,
|
||||
method: InterConfig.getMyMeetingList.method,
|
||||
isTestLogin: InterConfig.getMyMeetingList.isTestLogin,
|
||||
}], (result) => {
|
||||
this.showLoading = false;
|
||||
let resData = result[0].data;
|
||||
if (resData.code === 2000) {
|
||||
this.dataList = resData.data.list;
|
||||
this.totolNum = resData.data.total_row;
|
||||
this.totalPage = resData.data.total_page;
|
||||
}
|
||||
})
|
||||
},
|
||||
//页面切换
|
||||
changePage: function (type) {
|
||||
if (type == 'previous') {
|
||||
if (this.pageNumber == 1) {
|
||||
return;
|
||||
}
|
||||
this.pageNumber--;
|
||||
} else if (type == 'next') {
|
||||
if (this.pageNumber == this.totalPage) {
|
||||
return;
|
||||
}
|
||||
this.pageNumber++;
|
||||
}
|
||||
this.getMyMeetingList();
|
||||
},
|
||||
},
|
||||
components: {
|
||||
ASelect: Select,
|
||||
ASelectOption: Select.Option,
|
||||
ASpin:Spin,
|
||||
AEmpty:Empty,
|
||||
AIcon:Icon
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.my-meeting-style {
|
||||
width: 100%;
|
||||
min-height: 20rem;
|
||||
padding: 0.5rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.dom-search-style {
|
||||
width: 50%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
.ant-select {
|
||||
width: calc(100% - 100px) !important;
|
||||
margin-left: 0.5rem;
|
||||
}
|
||||
}
|
||||
.apply-content-div{
|
||||
width: 100%;
|
||||
min-height: 15rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
.ant-spin-nested-loading{
|
||||
width: 100% !important;
|
||||
}
|
||||
.data-list-div{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
.data-row-div{
|
||||
width: 100%;
|
||||
min-height: 5rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0.5rem 0 0.5rem 0;
|
||||
border-bottom: 1px solid #f2f2f2;
|
||||
.top-info-row-div {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
margin-bottom: 0.2rem;
|
||||
.room-type-div {
|
||||
border: 1px solid #31a8fa;
|
||||
color: #31a8fa;
|
||||
padding: 0 0.2rem;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.default-span-div {
|
||||
width: calc(100% - 10rem);
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-left: 0.5rem;
|
||||
}
|
||||
}
|
||||
.info-row-div {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-start;
|
||||
margin-top: 0.5rem;
|
||||
overflow-y: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
.room-other-info-div {
|
||||
padding: 0 0.5rem;
|
||||
/*background-color: #f59a23;*/
|
||||
color:var(--moduleFontColor);
|
||||
border-radius: 10px;
|
||||
margin-right: 0.5rem;
|
||||
margin-bottom: 0.2rem;
|
||||
}
|
||||
.no-data-tips {
|
||||
background-color: #f2f2f2;
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.page-dom-div {
|
||||
height: 2.5rem;
|
||||
line-height: 2.5rem;
|
||||
text-align: right;
|
||||
padding-right: 0.5rem;
|
||||
.page-icon-dom {
|
||||
font-size: 1.2rem;
|
||||
border: none;
|
||||
border-radius: 1rem;
|
||||
}
|
||||
.cannot-click {
|
||||
background-color: #a3b0c0;
|
||||
color: white;
|
||||
}
|
||||
.can-click {
|
||||
background-color: #31a8fa;
|
||||
color: white;
|
||||
}
|
||||
.total-num-span {
|
||||
margin-left: 1rem;
|
||||
margin-right: 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,229 @@
|
||||
<template>
|
||||
<div class="my-meeting-large-style">
|
||||
<div class="dom-search-style">
|
||||
<span>会议状态</span>
|
||||
<a-select :value="status" style="width: 100%" @change="statusChange">
|
||||
<a-select-option v-for="item in statusArr" :key="item.id">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
<div class="apply-content-div">
|
||||
<a-spin :spinning="showLoading">
|
||||
<vue-scroll :ops="listScroll" style="height:25rem" v-if="!showLoading && dataList.length > 0">
|
||||
<div class="data-list-div">
|
||||
<div class="data-row-div" v-for="item,index in dataList" :key="item.room_id">
|
||||
<div class="top-info-row-div">
|
||||
<span class="room-type-div">{{item.room_type_str}}</span>
|
||||
</div>
|
||||
<div class="info-row-div">
|
||||
<a-icon type="history" /><span class="room-other-info-div">{{item.begin_time + '--' + item.end_time}}</span>
|
||||
</div>
|
||||
<div class="info-row-div">
|
||||
<a-icon type="safety-certificate" /><span class="room-other-info-div">{{item.theme}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</vue-scroll>
|
||||
<div class="no-data-div" v-if="!showLoading && dataList.length == 0">
|
||||
<a-empty></a-empty>
|
||||
</div>
|
||||
</a-spin>
|
||||
</div>
|
||||
<div class="page-dom-div">
|
||||
<a-icon type="left-circle" title="上一页"
|
||||
:class="'page-icon-dom '+ (pageNumber == 1?'cannot-click':'can-click')"
|
||||
v-on:click="changePage('previous')"/>
|
||||
<span class="total-num-span">共{{totolNum}}条</span>
|
||||
<a-icon type="right-circle" title="下一页"
|
||||
:class="'page-icon-dom '+ (pageNumber == totalPage?'cannot-click':'can-click')"
|
||||
v-on:click="changePage('next')"/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {Select,Spin,Empty,Icon} from 'ant-design-vue';
|
||||
import InterConfig from '../meetingRoom/interConfig';
|
||||
export default{
|
||||
data(){
|
||||
return {
|
||||
showLoading: true,
|
||||
listScroll: this.StaticParams.scrollOption,
|
||||
statusArr: [{id: 3, name: "全部"}, {id: 0, name: "未开始"}, {id: 1, name: "进行中"}, {
|
||||
id: 2,
|
||||
name: "延时中"
|
||||
}, {id: -1, name: "已结束"}],
|
||||
status: 3,
|
||||
pageNumber: 1,
|
||||
pageSize: 8,
|
||||
totolNum: 0,
|
||||
totalPage: 0,
|
||||
dataList: [],//数据列表集合
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.getMyMeetingList();
|
||||
},
|
||||
methods: {
|
||||
statusChange: function (status) {
|
||||
if (this.status !== status) {
|
||||
this.status = status;
|
||||
this.getMyMeetingList();
|
||||
}
|
||||
},
|
||||
getMyMeetingList: function () {
|
||||
this.showLoading = true;
|
||||
let param = {
|
||||
org_id: this.BaseConfig.person_info_my.bureau_id,
|
||||
person_id: this.BaseConfig.userInfo.person_id,
|
||||
page_number: this.pageNumber,
|
||||
page_size: this.pageSize,
|
||||
}
|
||||
if (this.status < 3) {
|
||||
param.meeting_status = this.status;
|
||||
}
|
||||
this.InterfaceConfig.callInterface([{
|
||||
url: InterConfig.getMyMeetingList.url,
|
||||
params: param,
|
||||
method: InterConfig.getMyMeetingList.method,
|
||||
isTestLogin: InterConfig.getMyMeetingList.isTestLogin,
|
||||
}], (result) => {
|
||||
this.showLoading = false;
|
||||
let resData = result[0].data;
|
||||
if (resData.code === 2000) {
|
||||
this.dataList = resData.data.list;
|
||||
this.totolNum = resData.data.total_row;
|
||||
this.totalPage = resData.data.total_page;
|
||||
}
|
||||
})
|
||||
},
|
||||
//页面切换
|
||||
changePage: function (type) {
|
||||
if (type == 'previous') {
|
||||
if (this.pageNumber == 1) {
|
||||
return;
|
||||
}
|
||||
this.pageNumber--;
|
||||
} else if (type == 'next') {
|
||||
if (this.pageNumber == this.totalPage) {
|
||||
return;
|
||||
}
|
||||
this.pageNumber++;
|
||||
}
|
||||
this.getMyMeetingList();
|
||||
},
|
||||
},
|
||||
components: {
|
||||
ASelect: Select,
|
||||
ASelectOption: Select.Option,
|
||||
ASpin:Spin,
|
||||
AEmpty:Empty,
|
||||
AIcon:Icon
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.my-meeting-large-style {
|
||||
width: 100%;
|
||||
min-height: 20rem;
|
||||
padding: 0.5rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.dom-search-style {
|
||||
width: 50%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
.ant-select {
|
||||
width: calc(100% - 100px) !important;
|
||||
margin-left: 0.5rem;
|
||||
}
|
||||
}
|
||||
.apply-content-div{
|
||||
width: 100%;
|
||||
min-height: 15rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
.ant-spin-nested-loading{
|
||||
width: 100% !important;
|
||||
}
|
||||
.data-list-div{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-start;
|
||||
.data-row-div{
|
||||
width: 50%;
|
||||
height: auto;
|
||||
padding: 0.5rem 0 0.5rem 0;
|
||||
border-bottom: 1px solid #f2f2f2;
|
||||
.top-info-row-div {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
margin-bottom: 0.2rem;
|
||||
.room-type-div {
|
||||
border: 1px solid #31a8fa;
|
||||
color: #31a8fa;
|
||||
padding: 0 0.2rem;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.default-span-div {
|
||||
width: calc(100% - 10rem);
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-left: 0.5rem;
|
||||
}
|
||||
}
|
||||
.info-row-div {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-start;
|
||||
margin-top: 0.5rem;
|
||||
overflow-y: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
.room-other-info-div {
|
||||
padding: 0 0.5rem;
|
||||
/*background-color: #f59a23;*/
|
||||
color:var(--moduleFontColor);
|
||||
border-radius: 10px;
|
||||
margin-right: 0.5rem;
|
||||
margin-bottom: 0.2rem;
|
||||
}
|
||||
.no-data-tips {
|
||||
background-color: #f2f2f2;
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.page-dom-div {
|
||||
height: 2.5rem;
|
||||
line-height: 2.5rem;
|
||||
text-align: right;
|
||||
padding-right: 0.5rem;
|
||||
.page-icon-dom {
|
||||
font-size: 1.2rem;
|
||||
border: none;
|
||||
border-radius: 1rem;
|
||||
}
|
||||
.cannot-click {
|
||||
background-color: #a3b0c0;
|
||||
color: white;
|
||||
}
|
||||
.can-click {
|
||||
background-color: #31a8fa;
|
||||
color: white;
|
||||
}
|
||||
.total-num-span {
|
||||
margin-left: 1rem;
|
||||
margin-right: 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in new issue