提交 163a4602 authored 作者: 王鹏飞's avatar 王鹏飞

feat: 创建会议新增并发数选择

上级 1a8edce0
module.exports = { module.exports = {
domain: 'dev.ezijing.com', domain: 'dev.ezijing.com',
// url: 'https://live-broadcast2-admin.ezijing.com/api', // url: 'https://live-broadcast2-admin.ezijing.com/api',
url: 'https://meetings.ezijing.com/api', url: 'https://live-center.ezijing.com/api',
webpack: { webpack: {
externals: { externals: {
CKEDITOR: 'window.CKEDITOR', CKEDITOR: 'window.CKEDITOR',
......
...@@ -86,4 +86,10 @@ export function fileUpload(formData) { ...@@ -86,4 +86,10 @@ export function fileUpload(formData) {
// 获取oss signature // 获取oss signature
export function getSignature() { export function getSignature() {
return httpRequest.get('/api/usercenter/aliyun/get-signature') return httpRequest.get('/api/usercenter/aliyun/get-signature')
} }
\ No newline at end of file /**
* 获取时间段内的会议个数
*/
export function getMeetingCount(params) {
return httpRequest.get('/api/live/admin/v3/tencent/meeting/count', { params })
}
...@@ -2,17 +2,17 @@ ...@@ -2,17 +2,17 @@
<div class="calendar"> <div class="calendar">
<div class="calendar-h"> <div class="calendar-h">
<el-button icon="el-icon-arrow-left" size="mini" circle @click="btnClick('pre')"></el-button> <el-button icon="el-icon-arrow-left" size="mini" circle @click="btnClick('pre')"></el-button>
<span>{{curYearMonth}}</span> <span>{{ curYearMonth }}</span>
<el-button icon="el-icon-arrow-right" size="mini" circle @click="btnClick('next')"></el-button> <el-button icon="el-icon-arrow-right" size="mini" circle @click="btnClick('next')"></el-button>
</div> </div>
<div class="week-bar"> <div class="week-bar">
<span v-for="item in weekList" :key="item">{{item}}</span> <span v-for="item in weekList" :key="item">{{ item }}</span>
</div> </div>
<div class="calendar-day-list"> <div class="calendar-day-list">
<ul :class="{'range-selecting': rangeState.selecting}"> <ul :class="{ 'range-selecting': rangeState.selecting }">
<li v-for="item in dayList" :key="item.getTime()" @click="selectDay(item)"> <li v-for="item in dayList" :key="item.getTime()" @click="selectDay(item)">
<div :class="getDayCellClasses(item)"> <div :class="getDayCellClasses(item)">
<span>{{item.getTime() === toDay ? '今' : item.getDate()}}</span> <span>{{ item.getTime() === toDay ? '今' : item.getDate() }}</span>
</div> </div>
</li> </li>
</ul> </ul>
...@@ -20,12 +20,12 @@ ...@@ -20,12 +20,12 @@
</div> </div>
</template> </template>
<script> <script>
import { getMeetingCount } from '@/api/common'
import { dateFormat, getYMDByDate } from '@/utils/dateAlgs' import { dateFormat, getYMDByDate } from '@/utils/dateAlgs'
import getDays from './getDays' import getDays from './getDays'
export default { export default {
props: { props: {
defaultDate: { defaultDate: {},
},
type: { type: {
type: String, type: String,
default: 'date' // 'date', 'daterange' default: 'date' // 'date', 'daterange'
...@@ -45,12 +45,13 @@ export default { ...@@ -45,12 +45,13 @@ export default {
rangeEndDate: null, rangeEndDate: null,
rangeDates: [], rangeDates: [],
selectFirstDate: null, selectFirstDate: null,
selectLastDate: null selectLastDate: null,
dateCountList: []
} }
}, },
computed: { computed: {
toDay() { toDay() {
const date = new Date(); const date = new Date()
const todayTime = new Date(date.getFullYear(), date.getMonth(), date.getDate()).getTime() const todayTime = new Date(date.getFullYear(), date.getMonth(), date.getDate()).getTime()
return todayTime return todayTime
}, },
...@@ -96,8 +97,6 @@ export default { ...@@ -96,8 +97,6 @@ export default {
immediate: true immediate: true
} }
}, },
created() {
},
methods: { methods: {
init() { init() {
this.activeDate = '' this.activeDate = ''
...@@ -119,7 +118,13 @@ export default { ...@@ -119,7 +118,13 @@ export default {
default: this.selectFirstDate && !this.rangeStartDate && date.getTime() === this.selectFirstDate.getTime(), default: this.selectFirstDate && !this.rangeStartDate && date.getTime() === this.selectFirstDate.getTime(),
'start-date': this.rangeStartDate && date.getTime() === this.rangeStartDate.getTime(), 'start-date': this.rangeStartDate && date.getTime() === this.rangeStartDate.getTime(),
'end-date': this.rangeStartDate && date.getTime() === this.rangeEndDate.getTime(), 'end-date': this.rangeStartDate && date.getTime() === this.rangeEndDate.getTime(),
'is-range': this.rangeDates.length > 0 && this.rangeDates.some(d => date.getTime() === d.getTime()) 'is-range': this.rangeDates.length > 0 && this.rangeDates.some(d => date.getTime() === d.getTime()),
'has-meeting': this.dateCountList.some(item => {
if (+new Date(item.date) === date.getTime()) {
return !!item.total
}
return false
})
} }
return classes return classes
}, },
...@@ -129,10 +134,11 @@ export default { ...@@ -129,10 +134,11 @@ export default {
}, },
initDays() { initDays() {
this.dayList = getDays(this.monthFirstDate) this.dayList = getDays(this.monthFirstDate)
this.getMeetingCount()
}, },
btnClick(type) { btnClick(type) {
const month = type === 'pre' ? this.activeMonth - 1 : this.activeMonth + 1; const month = type === 'pre' ? this.activeMonth - 1 : this.activeMonth + 1
this.monthFirstDate = new Date(this.activeYear, month, 1); this.monthFirstDate = new Date(this.activeYear, month, 1)
this.initDays() this.initDays()
}, },
selectDay(date) { selectDay(date) {
...@@ -166,7 +172,10 @@ export default { ...@@ -166,7 +172,10 @@ export default {
this.rangeEndDate = isReverse ? this.selectFirstDate : this.selectLastDate this.rangeEndDate = isReverse ? this.selectFirstDate : this.selectLastDate
this.getRangeDates() this.getRangeDates()
this.rangeState.selecting = false this.rangeState.selecting = false
this.$emit('change', { dates: [this.rangeStartDate, this.rangeEndDate], daysCount: this.rangeDates.length + 1 }) this.$emit('change', {
dates: [this.rangeStartDate, this.rangeEndDate],
daysCount: this.rangeDates.length + 1
})
} }
} else { } else {
} }
...@@ -175,88 +184,98 @@ export default { ...@@ -175,88 +184,98 @@ export default {
const sDate = getYMDByDate(this.rangeStartDate) const sDate = getYMDByDate(this.rangeStartDate)
const eDate = getYMDByDate(this.rangeEndDate) const eDate = getYMDByDate(this.rangeEndDate)
const datesArr = [] const datesArr = []
while ((eDate.getTime() - sDate.getTime()) > 0) { while (eDate.getTime() - sDate.getTime() > 0) {
const year = sDate.getFullYear(); const year = sDate.getFullYear()
const month = sDate.getMonth(); const month = sDate.getMonth()
const day = sDate.getDate(); const day = sDate.getDate()
datesArr.push(new Date(year, month, day)); datesArr.push(new Date(year, month, day))
sDate.setDate(day + 1); sDate.setDate(day + 1)
} }
this.rangeDates = datesArr this.rangeDates = datesArr
}, },
handleMouseMove(it) { handleMouseMove(it) {
// if (!this.rangeState.selecting) return; // if (!this.rangeState.selecting) return;
// console.log(it) // console.log(it)
},
getMeetingCount() {
const startTime = this.dayList[0]
const endTime = this.dayList[this.dayList.length - 1]
getMeetingCount({
start_time: dateFormat(startTime, '{y}-{m}-{d}'),
end_time: dateFormat(endTime, '{y}-{m}-{d}')
}).then(res => {
this.dateCountList = res.data
})
} }
} }
} }
</script> </script>
<style scoped> <style lang="scss" scoped>
.calendar{ .calendar {
color:#606266; color: #606266;
width:224px; width: 224px;
} }
.calendar-h{ .calendar-h {
padding:10px 0; padding: 10px 0;
width:204px; width: 204px;
margin:0 auto; margin: 0 auto;
display:flex; display: flex;
} }
.calendar-h span{ .calendar-h span {
display:block; display: block;
line-height:28px; line-height: 28px;
flex:1; flex: 1;
text-align:center; text-align: center;
} }
.week-bar{ .week-bar {
display:flex; display: flex;
width:224px; width: 224px;
margin:0 auto; margin: 0 auto;
} }
.week-bar>span{ .week-bar > span {
width:32px; width: 32px;
text-align:center; text-align: center;
font-size:12px; font-size: 12px;
} }
.calendar-day-list{ .calendar-day-list {
width:252px; width: 252px;
margin:0 auto; margin: 0 auto;
} }
.calendar-day-list ul{ .calendar-day-list ul {
display:flex; display: flex;
flex-wrap:wrap; flex-wrap: wrap;
padding-top:10px; padding-top: 10px;
} }
.calendar-day-list li{ .calendar-day-list li {
width:32px; width: 32px;
height:32px; height: 32px;
text-align:center; text-align: center;
font-size:12px; font-size: 12px;
position:relative; position: relative;
cursor:pointer; cursor: pointer;
} }
.calendar-day-list li div{ .calendar-day-list li div {
padding:2px 0; padding: 2px 0;
} }
.calendar-day-list li span{ .calendar-day-list li span {
display:inline-block; display: inline-block;
width:24px; width: 24px;
height:24px; height: 24px;
line-height:24px; line-height: 24px;
border-radius: 50%; border-radius: 50%;
-moz-user-select:none; /*火狐*/ -moz-user-select: none; /*火狐*/
-webkit-user-select:none; /*webkit浏览器*/ -webkit-user-select: none; /*webkit浏览器*/
-ms-user-select:none; /*IE10*/ -ms-user-select: none; /*IE10*/
-khtml-user-select:none; /*早期浏览器*/ -khtml-user-select: none; /*早期浏览器*/
user-select:none; user-select: none;
} }
.calendar-day-list li .grey span{ .calendar-day-list li .grey span {
color:#c0c4cc; color: #c0c4cc;
} }
.calendar-day-list li span:hover{ .calendar-day-list li span:hover {
background-color: #f5f7fa; background-color: #f5f7fa;
} }
.calendar-day-list li .today span{ .calendar-day-list li .today span {
background: #ecf5ff; background: #ecf5ff;
color: #409eff; color: #409eff;
} }
...@@ -264,31 +283,46 @@ export default { ...@@ -264,31 +283,46 @@ export default {
.calendar-day-list li .start-date, .calendar-day-list li .start-date,
.calendar-day-list li .end-date, .calendar-day-list li .end-date,
.calendar-day-list li .default, .calendar-day-list li .default,
.range-selecting li div:hover{ .range-selecting li div:hover {
background-color: #f2f6fc; background-color: #f2f6fc;
} }
.calendar-day-list li .start-date{ .calendar-day-list li .start-date {
border-radius:12px 0 0 12px; border-radius: 12px 0 0 12px;
margin-left: 2px; margin-left: 2px;
} }
.calendar-day-list li .end-date{ .calendar-day-list li .end-date {
border-radius:0 12px 12px 0; border-radius: 0 12px 12px 0;
margin-right: 2px; margin-right: 2px;
} }
.calendar-day-list li .start-date.end-date, .calendar-day-list li .start-date.end-date,
.calendar-day-list li .default, .calendar-day-list li .default,
.range-selecting li div:hover{ .range-selecting li div:hover {
border-radius:12px; border-radius: 12px;
margin:0 2px; margin: 0 2px;
} }
.calendar-day-list li .current span, .calendar-day-list li .current span,
.calendar-day-list li .start-date span, .calendar-day-list li .start-date span,
.calendar-day-list li .end-date span{ .calendar-day-list li .end-date span {
background-color: #409eff; background-color: #409eff;
color:#fff; color: #fff;
}
.calendar-day-list li .default span,
.range-selecting li:hover span {
background-color: rgba(64, 158, 255, 0.4);
color: #fff;
} }
.calendar-day-list li .default span, .range-selecting li:hover span{ .calendar-day-list li .has-meeting {
background-color: rgba(64,158,255, .4); position: relative;
color:#fff; &::after {
content: '';
position: absolute;
top: 0;
right: 2px;
width: 4px;
height: 4px;
background-color: #aa1941;
border-radius: 50%;
overflow: hidden;
}
} }
</style> </style>
\ No newline at end of file
<template> <template>
<div class="schedule"> <div class="schedule">
<div class="multi-schedule-header" ref="scheduleHeader"> <div class="multi-schedule-header" ref="scheduleHeader">
<div v-for="(schedule, idx) in scheduleList" :key="idx" :style="{'min-width': minWidth}">{{schedule.name}}</div> <div v-for="(schedule, idx) in scheduleList" :key="idx" :style="{ 'min-width': minWidth }">
{{ schedule.name }}
</div>
</div> </div>
<el-scrollbar ref="scheduleScroll" style="height: calc(100% - 50px)"> <el-scrollbar ref="scheduleScroll" style="height: calc(100% - 50px)">
<div class="schedule-container"> <div class="schedule-container">
<div class="time-line" :style="{width: containerWidth}"> <div class="time-line" :style="{ width: containerWidth }">
<div class="time-dot" :ref="'timeDot-'+ index" v-for="(dot, index) in timeDots" :key="dot.time" :style="{height: timeLineHeight + 'px'}"> <div
<span class="time">{{dot.time}}</span><el-divider></el-divider> class="time-dot"
:ref="'timeDot-' + index"
v-for="(dot, index) in timeDots"
:key="dot.time"
:style="{ height: timeLineHeight + 'px' }"
>
<span class="time">{{ dot.time }}</span
><el-divider></el-divider>
</div> </div>
</div> </div>
<div class="time-now" v-if="isToday" :style="{top: nowTimeTop + 'px', width: containerWidth}"> <div class="time-now" v-if="isToday" :style="{ top: nowTimeTop + 'px', width: containerWidth }">
<span class="time">{{Date.now() | timeFormat}}</span> <span class="time">{{ Date.now() | timeFormat }}</span>
<el-divider></el-divider> <el-divider></el-divider>
</div> </div>
<div class="multi-schedule"> <div class="multi-schedule">
<schedule-item :options="options" :schedule="schedule" :date="date" v-for="(schedule, idx) in scheduleList" :key="idx" @details="detailsHandle" @new="newScheduleHandle"> <schedule-item
:options="options"
:schedule="schedule"
:date="date"
v-for="(schedule, idx) in scheduleList"
:key="idx"
@details="detailsHandle"
@new="newScheduleHandle(...arguments, schedule)"
>
<template #content="scope"> <template #content="scope">
<slot name="content" :data= "scope.data"/> <slot name="content" :data="scope.data" />
</template> </template>
<template #details-popper="scope"> <template #details-popper="scope">
<slot name="details-popper" :data= "scope.data"/> <slot name="details-popper" :data="scope.data" />
</template> </template>
</schedule-item> </schedule-item>
</div> </div>
...@@ -32,7 +49,8 @@ ...@@ -32,7 +49,8 @@
width="440" width="440"
trigger="manual" trigger="manual"
popper-class="schedule-popover" popper-class="schedule-popover"
v-model="newPopoverVisible"> v-model="newPopoverVisible"
>
<div class="new-schedule-popover-container" style="position:relative;"> <div class="new-schedule-popover-container" style="position:relative;">
<slot name="new-schedule" :data="newScheduleData"> <slot name="new-schedule" :data="newScheduleData">
<div style="padding:0 10px;"> <div style="padding:0 10px;">
...@@ -40,15 +58,42 @@ ...@@ -40,15 +58,42 @@
新建日程 新建日程
</h5> </h5>
<p> <p>
日程主题: <el-input style="width:354px;" v-model="createTitle" placeholder="输入日程主题" size="mini"></el-input> 日程主题:
<el-input style="width:354px;" v-model="createTitle" placeholder="输入日程主题" size="mini"></el-input>
</p> </p>
<p style="margin:10px 0;"> <p style="margin:10px 0;">
开始时间: <el-date-picker style="width:200px;" v-model="startDate" type="date" placeholder="选择日期" size="mini"></el-date-picker> 开始时间:
<el-time-select style="width:150px;" v-model="startTime" :picker-options="{ step: '00:30' }" placeholder="选择时间" size="mini"></el-time-select> <el-date-picker
style="width:200px;"
v-model="startDate"
type="date"
placeholder="选择日期"
size="mini"
></el-date-picker>
<el-time-select
style="width:150px;"
v-model="startTime"
:picker-options="{ step: '00:30' }"
placeholder="选择时间"
size="mini"
></el-time-select>
</p> </p>
<p> <p>
开始时间: <el-date-picker style="width:200px;" v-model="endDate" type="date" placeholder="选择日期" size="mini"></el-date-picker> 开始时间:
<el-time-select style="width:150px;" v-model="endTime" :picker-options="{ step: '00:30' }" placeholder="选择时间" size="mini"></el-time-select> <el-date-picker
style="width:200px;"
v-model="endDate"
type="date"
placeholder="选择日期"
size="mini"
></el-date-picker>
<el-time-select
style="width:150px;"
v-model="endTime"
:picker-options="{ step: '00:30' }"
placeholder="选择时间"
size="mini"
></el-time-select>
</p> </p>
<p style="margin:10px 0;text-align:center;"> <p style="margin:10px 0;text-align:center;">
<el-button type="primary" size="mini">创建日程</el-button> <el-button type="primary" size="mini">创建日程</el-button>
...@@ -67,18 +112,30 @@ ...@@ -67,18 +112,30 @@
width="360" width="360"
trigger="manual" trigger="manual"
popper-class="schedule-popover" popper-class="schedule-popover"
v-model="detailsPopoverVisible"> v-model="detailsPopoverVisible"
>
<slot name="details-popover" :data="detailsData"> <slot name="details-popover" :data="detailsData">
<div class="schedule-ev-details"> <div class="schedule-ev-details">
<h5>{{detailsData.ev.title}}</h5> <h5>{{ detailsData.ev.title }}</h5>
<p>{{detailsData.ev.startTime | timeFormat}}-{{detailsData.ev.endTime | timeFormat}}</p> <p>{{ detailsData.ev.startTime | timeFormat }}-{{ detailsData.ev.endTime | timeFormat }}</p>
</div> </div>
</slot> </slot>
</el-popover> </el-popover>
<div v-show="detailsPopoverVisible" class="detailsPopoverBtn" :style="detailsPopoverBtnStyle" v-popover:detailsPopover @click="detailsPopoverVisible = !detailsPopoverVisible"> <div
</div> v-show="detailsPopoverVisible"
class="detailsPopoverBtn"
:style="detailsPopoverBtnStyle"
v-popover:detailsPopover
@click="detailsPopoverVisible = !detailsPopoverVisible"
></div>
<div v-show="newPopoverVisible" class="schedule-mask" @touchmove.prevent @mousewheel.prevent></div> <div v-show="newPopoverVisible" class="schedule-mask" @touchmove.prevent @mousewheel.prevent></div>
<div v-show="detailsPopoverVisible" class="details-mask" @click="detailsPopoverVisible = !detailsPopoverVisible" @touchmove.prevent @mousewheel.prevent></div> <div
v-show="detailsPopoverVisible"
class="details-mask"
@click="detailsPopoverVisible = !detailsPopoverVisible"
@touchmove.prevent
@mousewheel.prevent
></div>
</div> </div>
</template> </template>
<script> <script>
...@@ -94,7 +151,7 @@ export default { ...@@ -94,7 +151,7 @@ export default {
require: true require: true
}, },
date: { date: {
validator: (value) => { validator: value => {
return typeof value === 'object' && (value === null || value instanceof Date) return typeof value === 'object' && (value === null || value instanceof Date)
} }
} }
...@@ -135,6 +192,12 @@ export default { ...@@ -135,6 +192,12 @@ export default {
hasCreate() { hasCreate() {
return this.permissions.includes('f_tencentmeeting_create') return this.permissions.includes('f_tencentmeeting_create')
}, },
hasConcurrency500() {
return this.permissions.includes('content_concurrency_500')
},
hasConcurrency1000() {
return this.permissions.includes('content_concurrency_1000')
},
minWidth() { minWidth() {
return this.options.minWidth || '200px' return this.options.minWidth || '200px'
}, },
...@@ -151,19 +214,22 @@ export default { ...@@ -151,19 +214,22 @@ export default {
return getTimeDots(this.options.start, this.options.end, this.options.step) return getTimeDots(this.options.start, this.options.end, this.options.step)
}, },
startDotTimestamp() { startDotTimestamp() {
const date = this.date; const date = this.date
const startHour = parseInt(this.options.start) const startHour = parseInt(this.options.start)
return new Date(date.getFullYear(), date.getMonth(), date.getDate(), startHour, 0, 0).getTime() return new Date(date.getFullYear(), date.getMonth(), date.getDate(), startHour, 0, 0).getTime()
}, },
isToday() { isToday() {
const now = new Date(); const now = new Date()
const date = this.date const date = this.date
return date.getTime() === new Date(now.getFullYear(), now.getMonth(), now.getDate()).getTime() && this.startDotTimestamp < Date.now() return (
date.getTime() === new Date(now.getFullYear(), now.getMonth(), now.getDate()).getTime() &&
this.startDotTimestamp < Date.now()
)
}, },
nowTimeTop() { nowTimeTop() {
const now = Date.now(); const now = Date.now()
const timeRange = now - this.startDotTimestamp const timeRange = now - this.startDotTimestamp
const top = timeRange * this.timeLineHeight / (this.options.step * 60 * 1000) + 5 const top = (timeRange * this.timeLineHeight) / (this.options.step * 60 * 1000) + 5
return top return top
} }
}, },
...@@ -239,33 +305,32 @@ export default { ...@@ -239,33 +305,32 @@ export default {
}, },
mounted() { mounted() {
// console.log(this.containerWidth) // console.log(this.containerWidth)
this.$refs.scheduleScroll.wrap.addEventListener('scroll', this.scrollHandle); this.$refs.scheduleScroll.wrap.addEventListener('scroll', this.scrollHandle)
window.addEventListener('resize', this.handleResize) window.addEventListener('resize', this.handleResize)
}, },
beforeDestroy() { beforeDestroy() {
this.$refs.scheduleScroll.wrap.removeEventListener('scroll', this.scrollHandle); this.$refs.scheduleScroll.wrap.removeEventListener('scroll', this.scrollHandle)
this.$refs.scheduleScroll.wrap.removeEventListener('resize', this.handleResize); this.$refs.scheduleScroll.wrap.removeEventListener('resize', this.handleResize)
}, },
methods: { methods: {
calcWidth() { calcWidth() {
let minWidth = this.minWidth; let minWidth = this.minWidth
if (minWidth && typeof minWidth === 'string') { if (minWidth && typeof minWidth === 'string') {
minWidth = minWidth.replace('px', '') minWidth = minWidth.replace('px', '')
minWidth = parseFloat(minWidth) minWidth = parseFloat(minWidth)
} }
const count = this.scheduleList.length; const count = this.scheduleList.length
let viewWidth = 0 let viewWidth = 0
try { try {
viewWidth = this.$refs.scheduleScroll.wrap.clientWidth viewWidth = this.$refs.scheduleScroll.wrap.clientWidth
} catch { } catch {}
}
if (viewWidth - 50 < minWidth * count) { if (viewWidth - 50 < minWidth * count) {
return minWidth * count + 'px' return minWidth * count + 'px'
} else { } else {
return 'calc(100% - 50px)' return 'calc(100% - 50px)'
} }
}, },
handleResize () { handleResize() {
this.containerWidth = this.calcWidth() this.containerWidth = this.calcWidth()
}, },
documentClick() { documentClick() {
...@@ -286,12 +351,23 @@ export default { ...@@ -286,12 +351,23 @@ export default {
this.detailsPopoverVisible = true this.detailsPopoverVisible = true
}, 100) }, 100)
}, },
newScheduleHandle(val) { newScheduleHandle(val, data) {
if (!this.hasCreate) { if (!this.hasCreate) {
this.$message.error('你没有权限创建会议') this.$message.error('你没有权限创建会议')
return return
} }
this.newScheduleData = Object.assign(val, { date: this.date }) if (data.type === 3 && !this.hasConcurrency500) {
this.$message.error('你没有权限创建500方以上会议')
return
}
if (data.type === 4 && !this.hasConcurrency1000) {
this.$message.error('你没有权限创建1000方以上会议')
return
}
// 1公用用户(用于创建腾讯会议300方会议), 2普通用户, 3公共用户(腾讯会议500方),4公共用户(腾讯会议1000方)',
// 1:300方 2:500方 3:1000方
const concurrencyMap = { 1: 1, 2: 1, 3: 2, 4: 3 }
this.newScheduleData = Object.assign(val, { date: this.date, concurrency: concurrencyMap[data.type] })
this.newPopoverBtnStyle.left = val.x this.newPopoverBtnStyle.left = val.x
this.newPopoverBtnStyle.top = val.y this.newPopoverBtnStyle.top = val.y
this.newPopoverBtnStyle.width = val.width this.newPopoverBtnStyle.width = val.width
...@@ -308,13 +384,13 @@ export default { ...@@ -308,13 +384,13 @@ export default {
} }
</script> </script>
<style scoped> <style scoped>
.schedule{ .schedule {
position:relative; position: relative;
} }
.multi-schedule-header{ .multi-schedule-header {
display:flex; display: flex;
height:50px; height: 50px;
padding-left:50px; padding-left: 50px;
overflow-x: auto; overflow-x: auto;
-ms-overflow-style: none; -ms-overflow-style: none;
overflow: -moz-scrollbars-none; overflow: -moz-scrollbars-none;
...@@ -322,124 +398,124 @@ export default { ...@@ -322,124 +398,124 @@ export default {
.multi-schedule-header::-webkit-scrollbar { .multi-schedule-header::-webkit-scrollbar {
display: none; display: none;
} }
.multi-schedule-header>div{ .multi-schedule-header > div {
flex:1; flex: 1;
min-width:300px; min-width: 300px;
line-height:50px; line-height: 50px;
text-align:center; text-align: center;
-moz-user-select:none; /*火狐*/ -moz-user-select: none; /*火狐*/
-webkit-user-select:none; /*webkit浏览器*/ -webkit-user-select: none; /*webkit浏览器*/
-ms-user-select:none; /*IE10*/ -ms-user-select: none; /*IE10*/
-khtml-user-select:none; /*早期浏览器*/ -khtml-user-select: none; /*早期浏览器*/
user-select:none; user-select: none;
} }
.schedule-container{ .schedule-container {
position:relative; position: relative;
/* height:calc(100% - 50px); */ /* height:calc(100% - 50px); */
} }
.multi-schedule{ .multi-schedule {
display:flex; display: flex;
padding:5px 0 0 50px; padding: 5px 0 0 50px;
/* width:calc(100% - 50px); */ /* width:calc(100% - 50px); */
} }
.multi-schedule>.schedule{ .multi-schedule > .schedule {
flex:1; flex: 1;
} }
.time-line{ .time-line {
position:absolute; position: absolute;
width:100%; width: 100%;
z-index:0; z-index: 0;
left:0; left: 0;
top:5px; top: 5px;
padding:0 0 10px 50px; padding: 0 0 10px 50px;
} }
.time-dot{ .time-dot {
position:relative; position: relative;
} }
.time{ .time {
width:50px; width: 50px;
line-height:20px; line-height: 20px;
font-size:14px; font-size: 14px;
color:#BEBEBE; color: #bebebe;
text-align:center; text-align: center;
position:absolute; position: absolute;
left:-50px; left: -50px;
top:-10px; top: -10px;
} }
.time-dot ::v-deep.el-divider{ .time-dot ::v-deep.el-divider {
margin:0; margin: 0;
background-color:#E7E7E7; background-color: #e7e7e7;
} }
.time-dot:last-child{ .time-dot:last-child {
height:1px !important; height: 1px !important;
} }
.time-now{ .time-now {
width:calc(100% - 50px); width: calc(100% - 50px);
padding-left:48px; padding-left: 48px;
position:absolute; position: absolute;
left:0; left: 0;
top:10px; top: 10px;
z-index:1; z-index: 1;
} }
.time-now .time{ .time-now .time {
left: 0; left: 0;
} }
.time-now span{ .time-now span {
color:#FD1E1E; color: #fd1e1e;
background-color:#fff; background-color: #fff;
padding:5px 0; padding: 5px 0;
} }
.time-now ::v-deep.el-divider{ .time-now ::v-deep.el-divider {
background-color:#FD0000; background-color: #fd0000;
margin:0; margin: 0;
width:calc(100% + 2px); width: calc(100% + 2px);
} }
.newPopoverBtn{ .newPopoverBtn {
position:fixed; position: fixed;
box-sizing:border-box; box-sizing: border-box;
padding:4px padding: 4px;
} }
.newPopoverBtn p{ .newPopoverBtn p {
color:#fff; color: #fff;
background:#52b837; background: #52b837;
border-radius:4px; border-radius: 4px;
height:calc(100%); height: calc(100%);
position:relative; position: relative;
} }
.newPopoverBtn p:after{ .newPopoverBtn p:after {
content:"无主题"; content: '无主题';
position:absolute; position: absolute;
left:50%; left: 50%;
top:50%; top: 50%;
transform:translate(-50%, -50%) transform: translate(-50%, -50%);
} }
.detailsPopoverBtn{ .detailsPopoverBtn {
position:fixed; position: fixed;
z-index:99; z-index: 99;
} }
.schedule-mask{ .schedule-mask {
position:absolute; position: absolute;
left:0; left: 0;
top:0; top: 0;
right:0; right: 0;
bottom:0; bottom: 0;
z-index:10; z-index: 10;
} }
.details-mask{ .details-mask {
position:absolute; position: absolute;
left:0; left: 0;
top:0; top: 0;
right:0; right: 0;
bottom:0; bottom: 0;
z-index:8; z-index: 8;
} }
.schedule ::v-deep.el-scrollbar__wrap{ .schedule ::v-deep.el-scrollbar__wrap {
overflow-x: auto; overflow-x: auto;
} }
.schedule ::v-deep.el-scrollbar__wrap::-webkit-scrollbar{ .schedule ::v-deep.el-scrollbar__wrap::-webkit-scrollbar {
display: none; display: none;
} }
.schedule ::v-deep.el-scrollbar__bar{ .schedule ::v-deep.el-scrollbar__bar {
z-index:9; z-index: 9;
} }
</style> </style>
\ No newline at end of file
...@@ -294,6 +294,7 @@ export default { ...@@ -294,6 +294,7 @@ export default {
}, },
more() { more() {
const query = { const query = {
concurrency: this.data.concurrency,
account: this.data.accountId, account: this.data.accountId,
start: this.startTimestamp, start: this.startTimestamp,
end: this.endTimestamp end: this.endTimestamp
...@@ -312,6 +313,7 @@ export default { ...@@ -312,6 +313,7 @@ export default {
const form = this.form const form = this.form
const params = { const params = {
instanceid: 1, instanceid: 1,
concurrency: this.data.concurrency,
userid: this.data.accountId, userid: this.data.accountId,
subject: form.subject, subject: form.subject,
start_time: dateFormat(this.startTimestamp), start_time: dateFormat(this.startTimestamp),
......
...@@ -105,6 +105,7 @@ export default { ...@@ -105,6 +105,7 @@ export default {
const account = { const account = {
userid: _accont.userid, userid: _accont.userid,
name: _accont.username, name: _accont.username,
type: _accont.type,
events: [] events: []
} }
for (let j = 0; j < mList.length; j++) { for (let j = 0; j < mList.length; j++) {
......
<template> <template>
<el-form ref="ruleForm" :model="form" :rules="rules" label-width="130px"> <el-form ref="ruleForm" :model="form" :rules="rules" label-width="130px">
<el-form-item label="会议并发数" prop="concurrency">
<el-radio-group v-model="form.concurrency" size="small" v-if="!isEdit">
<el-radio :label="1" border>300方</el-radio>
<el-radio :label="2" border v-if="hasConcurrency500">500方</el-radio>
<el-radio :label="3" border v-if="hasConcurrency1000">1000方</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="会议主题" prop="subject"> <el-form-item label="会议主题" prop="subject">
<el-input v-model="form.subject" size="small" /> <el-input v-model="form.subject" size="small" />
</el-form-item> </el-form-item>
...@@ -7,26 +14,70 @@ ...@@ -7,26 +14,70 @@
<el-col :span="11"> <el-col :span="11">
<!-- <el-form-item prop="startDate" require> --> <!-- <el-form-item prop="startDate" require> -->
<el-form-item> <el-form-item>
<el-date-picker v-model="form.startDate" type="date" placeholder="选择日期" style="width: 100%" size="small" :clearable="timerClear" :editable="timerClear" :picker-options="startDateOptions" :format="startDateShowFormat" @change="startDateChange" :disabled="isReviewRecurring"/> <el-date-picker
v-model="form.startDate"
type="date"
placeholder="选择日期"
style="width: 100%"
size="small"
:clearable="timerClear"
:editable="timerClear"
:picker-options="startDateOptions"
:format="startDateShowFormat"
@change="startDateChange"
:disabled="isReviewRecurring"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="2" class="line">-</el-col> <el-col :span="2" class="line">-</el-col>
<el-col :span="11"> <el-col :span="11">
<el-form-item prop="startTime"> <el-form-item prop="startTime">
<el-time-select v-model="form.startTime" style="width: 100%" :picker-options="startTimeOptions" placeholder="选择时间" size="small" :clearable="timerClear" :editable="timerClear" @change="startTimeChange" :disabled="isReviewRecurring"/> <el-time-select
v-model="form.startTime"
style="width: 100%"
:picker-options="startTimeOptions"
placeholder="选择时间"
size="small"
:clearable="timerClear"
:editable="timerClear"
@change="startTimeChange"
:disabled="isReviewRecurring"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-form-item> </el-form-item>
<el-form-item label="结束时间" required> <el-form-item label="结束时间" required>
<el-col :span="11"> <el-col :span="11">
<el-form-item prop="endDate"> <el-form-item prop="endDate">
<el-date-picker v-model="form.endDate" type="date" placeholder="选择日期" style="width: 100%" size="small" :clearable="timerClear" :editable="timerClear" :picker-options="endDateOptions" :format="endDateShowFormat" @change="endDateChange" :disabled="isReviewRecurring"/> <el-date-picker
v-model="form.endDate"
type="date"
placeholder="选择日期"
style="width: 100%"
size="small"
:clearable="timerClear"
:editable="timerClear"
:picker-options="endDateOptions"
:format="endDateShowFormat"
@change="endDateChange"
:disabled="isReviewRecurring"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="2" class="line">-</el-col> <el-col :span="2" class="line">-</el-col>
<el-col :span="11"> <el-col :span="11">
<el-form-item prop="endTime"> <el-form-item prop="endTime">
<el-time-select v-model="form.endTime" style="width: 100%" :picker-options="endTimeOptions" placeholder="选择时间" size="small" :clearable="timerClear" :editable="timerClear" @change="dateChange" :disabled="isReviewRecurring"/> <el-time-select
v-model="form.endTime"
style="width: 100%"
:picker-options="endTimeOptions"
placeholder="选择时间"
size="small"
:clearable="timerClear"
:editable="timerClear"
@change="dateChange"
:disabled="isReviewRecurring"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-form-item> </el-form-item>
...@@ -38,30 +89,66 @@ ...@@ -38,30 +89,66 @@
</el-col> </el-col>
</el-form-item> </el-form-item>
<el-form-item label="周期会议"> <el-form-item label="周期会议">
<el-switch v-model="form.meeting_type" :active-value="1" :inactive-value="0" :disabled="isReviewRecurring"/> <el-switch v-model="form.meeting_type" :active-value="1" :inactive-value="0" :disabled="isReviewRecurring" />
</el-form-item> </el-form-item>
<el-form-item v-show="form.meeting_type" style="margin: -20px 0 10px;"> <el-form-item v-show="form.meeting_type" style="margin: -20px 0 10px;">
<p>{{recurringTypeOptions[form.recurring_rule.recurring_type]}}</p> <p>{{ recurringTypeOptions[form.recurring_rule.recurring_type] }}</p>
<p style="line-height: 24px;color:#999;">结束于{{form.recurring_rule.until_date | timeFormat}} {{form.recurring_rule.until_count}}场会议</p> <p style="line-height: 24px;color:#999;">
结束于{{ form.recurring_rule.until_date | timeFormat }} {{ form.recurring_rule.until_count }}场会议
</p>
</el-form-item> </el-form-item>
<el-form-item label="重复频率" v-if="form.meeting_type" required> <el-form-item label="重复频率" v-if="form.meeting_type" required>
<el-col :span="11"> <el-col :span="11">
<el-select style="width: 100%" v-model="form.recurring_rule.recurring_type" placeholder="选择重复频率" size="small" @change="recurringTypeChange" :disabled="isReviewRecurring"> <el-select
<el-option :label="item" :value="index" v-for="(item, index) in recurringTypeOptions" :key="index"/> style="width: 100%"
v-model="form.recurring_rule.recurring_type"
placeholder="选择重复频率"
size="small"
@change="recurringTypeChange"
:disabled="isReviewRecurring"
>
<el-option :label="item" :value="index" v-for="(item, index) in recurringTypeOptions" :key="index" />
</el-select> </el-select>
</el-col> </el-col>
</el-form-item> </el-form-item>
<el-form-item label="结束重复" v-if="form.meeting_type" required> <el-form-item label="结束重复" v-if="form.meeting_type" required>
<el-col :span="11"> <el-col :span="11">
<el-select style="width: 100%" v-model="form.recurring_rule.until_type" placeholder="请选择" size="small" :disabled="isReviewRecurring"> <el-select
style="width: 100%"
v-model="form.recurring_rule.until_type"
placeholder="请选择"
size="small"
:disabled="isReviewRecurring"
>
<el-option label="结束于某天" :value="0" /> <el-option label="结束于某天" :value="0" />
<el-option label="限制会议次数" :value="1" /> <el-option label="限制会议次数" :value="1" />
</el-select> </el-select>
</el-col> </el-col>
<el-col :span="2" class="line">-</el-col> <el-col :span="2" class="line">-</el-col>
<el-col :span="11"> <el-col :span="11">
<el-date-picker v-if="form.recurring_rule.until_type === 0" v-model="form.recurring_rule.until_date" type="date" placeholder="选择结束日期" style="width: 100%" size="small" :clearable="timerClear" :editable="timerClear" :picker-options="untilDateOptions" @change="setUntilCount" :disabled="isReviewRecurring" /> <el-date-picker
<el-input-number v-else v-model="form.recurring_rule.until_count" :min="1" :max="50" size="small" controls-position="right" @change="setUntilDate" :disabled="isReviewRecurring"></el-input-number> v-if="form.recurring_rule.until_type === 0"
v-model="form.recurring_rule.until_date"
type="date"
placeholder="选择结束日期"
style="width: 100%"
size="small"
:clearable="timerClear"
:editable="timerClear"
:picker-options="untilDateOptions"
@change="setUntilCount"
:disabled="isReviewRecurring"
/>
<el-input-number
v-else
v-model="form.recurring_rule.until_count"
:min="1"
:max="50"
size="small"
controls-position="right"
@change="setUntilDate"
:disabled="isReviewRecurring"
></el-input-number>
</el-col> </el-col>
</el-form-item> </el-form-item>
<el-form-item label="指定会议管理员"> <el-form-item label="指定会议管理员">
...@@ -77,19 +164,37 @@ ...@@ -77,19 +164,37 @@
<span style="float: right; color: #8492a6; font-size: 13px; margin:0 20px 0 10px;" v-else>ID:{{ user.id }}</span> <span style="float: right; color: #8492a6; font-size: 13px; margin:0 20px 0 10px;" v-else>ID:{{ user.id }}</span>
</el-option> </el-option>
</el-select> --> </el-select> -->
<user-search v-model="form.managers" :fetchApi="fetchApiSearch" :defaultList="userList" :options="{ size: 'small', multiple: true, clearable: true }"/> <user-search
v-model="form.managers"
:fetchApi="fetchApiSearch"
:defaultList="userList"
:options="{ size: 'small', multiple: true, clearable: true }"
/>
</el-col> </el-col>
</el-form-item> </el-form-item>
<el-form-item label="会议主持人"> <el-form-item label="会议主持人">
<el-select style="width: 100%" v-model="form.hosts" placeholder="请选择腾讯会议用户,支持关键字搜索" size="small" multiple filterable remote :remote-method="fetchTxAccountList" :loading="searchLoading" clearable> <el-select
<el-option :label="user.username" :value="user.userid" v-for="user in txAccountList" :key="user.id" > style="width: 100%"
<span style="float: left"> v-model="form.hosts"
{{ user.username }} placeholder="请选择腾讯会议用户,支持关键字搜索"
<template v-if="user.phone">(手机号:{{user.phone}})</template> size="small"
</span> multiple
<span style="float: right; color: #8492a6; font-size: 13px; margin:0 20px 0 10px;" v-if="user.email">邮箱:{{ user.email }}</span> filterable
</el-option> remote
</el-select> :remote-method="fetchTxAccountList"
:loading="searchLoading"
clearable
>
<el-option :label="user.username" :value="user.userid" v-for="user in txAccountList" :key="user.id">
<span style="float: left">
{{ user.username }}
<template v-if="user.phone">(手机号:{{ user.phone }})</template>
</span>
<span style="float: right; color: #8492a6; font-size: 13px; margin:0 20px 0 10px;" v-if="user.email"
>邮箱:{{ user.email }}</span
>
</el-option>
</el-select>
</el-form-item> </el-form-item>
<el-form-item label="会议设置" style="margin-bottom:2px;"> <el-form-item label="会议设置" style="margin-bottom:2px;">
<el-col :span="10"> <el-col :span="10">
...@@ -97,7 +202,16 @@ ...@@ -97,7 +202,16 @@
</el-col> </el-col>
<el-col :span="14"> <el-col :span="14">
<el-form-item v-if="form.hasPwd" prop="password" style="margin-bottom:0;"> <el-form-item v-if="form.hasPwd" prop="password" style="margin-bottom:0;">
<el-input style="width: 170px" v-model="form.password" placeholder="请输入4-6位数字密码" type="password" size="small" :show-password="true" @input="val => form.password = val.replace(/[^\d.]/g, '')" :maxlength="6"/> <el-input
style="width: 170px"
v-model="form.password"
placeholder="请输入4-6位数字密码"
type="password"
size="small"
:show-password="true"
@input="val => (form.password = val.replace(/[^\d.]/g, ''))"
:maxlength="6"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-form-item> </el-form-item>
...@@ -131,8 +245,21 @@ ...@@ -131,8 +245,21 @@
<el-checkbox style="width: 150px" v-model="form.live_config.enable_live_password">开启观看直播密码</el-checkbox> <el-checkbox style="width: 150px" v-model="form.live_config.enable_live_password">开启观看直播密码</el-checkbox>
</el-col> </el-col>
<el-col :span="14"> <el-col :span="14">
<el-form-item v-if="form.live_config.enable_live_password" prop="live_config.live_password" style="margin-bottom:0;"> <el-form-item
<el-input style="width: 170px" v-model="form.live_config.live_password" placeholder="请输入4-6位数字密码" type="password" size="small" :show-password="true" @input="val => form.live_config.live_password = val.replace(/[^\d.]/g, '')" :maxlength="6"/> v-if="form.live_config.enable_live_password"
prop="live_config.live_password"
style="margin-bottom:0;"
>
<el-input
style="width: 170px"
v-model="form.live_config.live_password"
placeholder="请输入4-6位数字密码"
type="password"
size="small"
:show-password="true"
@input="val => (form.live_config.live_password = val.replace(/[^\d.]/g, ''))"
:maxlength="6"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-form-item> </el-form-item>
...@@ -140,7 +267,7 @@ ...@@ -140,7 +267,7 @@
<el-checkbox v-model="form.live_config.enable_live_im">准许观众讨论</el-checkbox> <el-checkbox v-model="form.live_config.enable_live_im">准许观众讨论</el-checkbox>
</el-form-item> </el-form-item>
<el-form-item style="padding-left: 100px"> <el-form-item style="padding-left: 100px">
<el-button type="primary" @click="submitForm('ruleForm')" size="mini">{{btnText}}</el-button> <el-button type="primary" @click="submitForm('ruleForm')" size="mini">{{ btnText }}</el-button>
<!-- <el-button @click="resetForm('ruleForm')" size="mini">重置</el-button> --> <!-- <el-button @click="resetForm('ruleForm')" size="mini">重置</el-button> -->
<el-button @click="goList" size="mini">取消</el-button> <el-button @click="goList" size="mini">取消</el-button>
</el-form-item> </el-form-item>
...@@ -148,7 +275,15 @@ ...@@ -148,7 +275,15 @@
</template> </template>
<script> <script>
import UserSearch from '@/components/UserSearch/index' import UserSearch from '@/components/UserSearch/index'
import { timeTrans, dateFormat, getYMDByDate, getTimestampYMD, getCurHalfHour, computedDateByRateTimes, computedTimesByRateDate } from '@/utils/dateAlgs' import {
timeTrans,
dateFormat,
getYMDByDate,
getTimestampYMD,
getCurHalfHour,
computedDateByRateTimes,
computedTimesByRateDate
} from '@/utils/dateAlgs'
import { searchUserList } from '@api/common' import { searchUserList } from '@api/common'
import { getTxAccountList } from '@api/tencent' import { getTxAccountList } from '@api/tencent'
import { mapGetters } from 'vuex' import { mapGetters } from 'vuex'
...@@ -237,6 +372,7 @@ export default { ...@@ -237,6 +372,7 @@ export default {
timerClear: false, timerClear: false,
// startDateShowFormat: 'yyyy-MM-dd', // startDateShowFormat: 'yyyy-MM-dd',
form: { form: {
concurrency: 1,
subject: '', subject: '',
startDate: nowDate, startDate: nowDate,
startTime: getCurHalfHour('start'), startTime: getCurHalfHour('start'),
...@@ -299,6 +435,15 @@ export default { ...@@ -299,6 +435,15 @@ export default {
}, },
computed: { computed: {
...mapGetters(['user']), ...mapGetters(['user']),
isEdit() {
return !!this.data
},
hasConcurrency500() {
return this.$store.state.user.permissions?.includes('content_concurrency_500')
},
hasConcurrency1000() {
return this.$store.state.user.permissions?.includes('content_concurrency_1000')
},
startDateShowFormat() { startDateShowFormat() {
const date = this.form.startDate const date = this.form.startDate
if (typeof date === 'object' && date instanceof Date) { if (typeof date === 'object' && date instanceof Date) {
...@@ -445,7 +590,7 @@ export default { ...@@ -445,7 +590,7 @@ export default {
}, },
watch: { watch: {
data: { data: {
handler: function (val) { handler: function(val) {
if (val && val.startDate) { if (val && val.startDate) {
console.log(this.reviewList) console.log(this.reviewList)
this.userList = this.reviewList.userList this.userList = this.reviewList.userList
...@@ -562,6 +707,7 @@ export default { ...@@ -562,6 +707,7 @@ export default {
const form = this.form const form = this.form
const params = { const params = {
instanceid: 1, instanceid: 1,
concurrency: form.concurrency,
subject: form.subject, subject: form.subject,
start_time: dateFormat(this.startTimestamp), start_time: dateFormat(this.startTimestamp),
end_time: dateFormat(this.endTimestamp), end_time: dateFormat(this.endTimestamp),
...@@ -623,12 +769,12 @@ export default { ...@@ -623,12 +769,12 @@ export default {
.el-form { .el-form {
flex: 1; flex: 1;
max-width: 540px; max-width: 540px;
padding:20px 0 10px; padding: 20px 0 10px;
} }
.line { .line {
text-align: center; text-align: center;
} }
.el-form ::v-deep.el-input-number__increase{ .el-form ::v-deep.el-input-number__increase {
margin-top:1px; margin-top: 1px;
} }
</style> </style>
\ No newline at end of file
<template> <template>
<div class="meeting-account-create"> <div class="meeting-account-create">
<div class="inner"> <div class="inner">
<meeting-form :data="reviewData" :users="userList" @submitForm="handleSubmit" @dateChange="handleDateChange"></meeting-form> <meeting-form
:data="reviewData"
:users="userList"
@submitForm="handleSubmit"
@dateChange="handleDateChange"
></meeting-form>
<div class="right-container"> <div class="right-container">
<div class="title">{{ reviewData.startDate | timeFormat }} {{ reviewData.startDate | timeFormat('星期{a}') }}</div> <div class="title">
{{ reviewData.startDate | timeFormat }} {{ reviewData.startDate | timeFormat('星期{a}') }}
</div>
<schedule :options="options" :data="schedule" :date="reviewData.startDate" /> <schedule :options="options" :data="schedule" :date="reviewData.startDate" />
<div class="pre-time-range" :style="{ top: getTop, height: getHeight }"></div> <div class="pre-time-range" :style="{ top: getTop, height: getHeight }"></div>
</div> </div>
</div> </div>
<meeting-success-dialog :dialogVisible.sync="dialogVisible" :details="details"/> <meeting-success-dialog :dialogVisible.sync="dialogVisible" :details="details" />
</div> </div>
</template> </template>
<script> <script>
...@@ -18,8 +25,8 @@ import MeetingSuccessDialog from '@/components/MeetingSuccessDialog/index' ...@@ -18,8 +25,8 @@ import MeetingSuccessDialog from '@/components/MeetingSuccessDialog/index'
import { createMeeting, getMeetingDetails, getNonpagedMeetingList } from '@api/common' import { createMeeting, getMeetingDetails, getNonpagedMeetingList } from '@api/common'
import { timeTrans, getYMDByDate, dateFormat, isSameDate } from '@/utils/dateAlgs' import { timeTrans, getYMDByDate, dateFormat, isSameDate } from '@/utils/dateAlgs'
import { mapGetters } from 'vuex' import { mapGetters } from 'vuex'
export default ({ export default {
data () { data() {
return { return {
dialogVisible: false, dialogVisible: false,
reviewData: { reviewData: {
...@@ -107,7 +114,7 @@ export default ({ ...@@ -107,7 +114,7 @@ export default ({
}, },
watch: { watch: {
dialogVisible: { dialogVisible: {
handler: function (nv) { handler: function(nv) {
if (!nv) { if (!nv) {
this.goList() this.goList()
} }
...@@ -144,7 +151,7 @@ export default ({ ...@@ -144,7 +151,7 @@ export default ({
text: '获取腾讯会议详情,请稍后...', text: '获取腾讯会议详情,请稍后...',
spinner: 'el-icon-loading', spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)' background: 'rgba(0, 0, 0, 0.7)'
}); })
const params = { const params = {
meeting_id: obj.meeting_id meeting_id: obj.meeting_id
} }
...@@ -163,6 +170,8 @@ export default ({ ...@@ -163,6 +170,8 @@ export default ({
spinner: 'el-icon-loading', spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)' background: 'rgba(0, 0, 0, 0.7)'
}) })
const query = this.$route.query
params.concurrency = query.concurrency ? parseInt(query.concurrency) || 1 : 1
params.userid = this.userid params.userid = this.userid
createMeeting(params).then(res => { createMeeting(params).then(res => {
loading.close() loading.close()
...@@ -176,13 +185,15 @@ export default ({ ...@@ -176,13 +185,15 @@ export default ({
}, },
fetchMeetingDetails(params) { fetchMeetingDetails(params) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
getMeetingDetails(params).then(res => { getMeetingDetails(params)
if (res.code === 0 && res.data.id) { .then(res => {
resolve(res.data) if (res.code === 0 && res.data.id) {
} else { resolve(res.data)
reject(res) } else {
} reject(res)
}).catch((err) => reject(err)) }
})
.catch(err => reject(err))
}) })
}, },
fetchMeetingList() { fetchMeetingList() {
...@@ -194,19 +205,21 @@ export default ({ ...@@ -194,19 +205,21 @@ export default ({
start_time: start, start_time: start,
end_time: end end_time: end
} }
getNonpagedMeetingList(params).then((res) => { getNonpagedMeetingList(params)
if (res.code === 0 && res.data && res.data.list) { .then(res => {
console.log(res.data.list) if (res.code === 0 && res.data && res.data.list) {
this.schedule.events = res.data.list console.log(res.data.list)
} else { this.schedule.events = res.data.list
} } else {
}).catch() }
})
.catch()
} }
} }
}) }
</script> </script>
<style scoped> <style scoped>
.meeting-account-create{ .meeting-account-create {
overflow-y: auto; overflow-y: auto;
height: calc(100% - 52px); height: calc(100% - 52px);
} }
...@@ -215,7 +228,7 @@ export default ({ ...@@ -215,7 +228,7 @@ export default ({
background: #fff; background: #fff;
margin: 0 15px; margin: 0 15px;
border-radius: 4px; border-radius: 4px;
padding-bottom:10px; padding-bottom: 10px;
} }
.right-container { .right-container {
position: relative; position: relative;
...@@ -238,8 +251,8 @@ export default ({ ...@@ -238,8 +251,8 @@ export default ({
width: calc(100% - 70px); width: calc(100% - 70px);
background: #52b837; background: #52b837;
} }
.search-keywords-checked{ .search-keywords-checked {
color: #F56C6C; color: #f56c6c;
font-size: 12px; font-size: 12px;
line-height: 1; line-height: 1;
padding-top: 4px; padding-top: 4px;
...@@ -250,22 +263,22 @@ export default ({ ...@@ -250,22 +263,22 @@ export default ({
.right-container .el-scrollbar ::v-deep.el-scrollbar__wrap { .right-container .el-scrollbar ::v-deep.el-scrollbar__wrap {
/* overflow:hidden; */ /* overflow:hidden; */
} }
.tx-meeting-container ::v-deep.el-dialog__header{ .tx-meeting-container ::v-deep.el-dialog__header {
padding-top:14px; padding-top: 14px;
} }
.tx-meeting-container ::v-deep.el-dialog__headerbtn{ .tx-meeting-container ::v-deep.el-dialog__headerbtn {
top:12px; top: 12px;
right:12px; right: 12px;
} }
.tx-meeting-container ::v-deep.el-dialog__body{ .tx-meeting-container ::v-deep.el-dialog__body {
padding:10px 0; padding: 10px 0;
margin:0 20px; margin: 0 20px;
border: 1px solid #DBDBDB; border: 1px solid #dbdbdb;
} }
.tx-meeting-container ::v-deep.el-dialog__footer{ .tx-meeting-container ::v-deep.el-dialog__footer {
padding-bottom:16px; padding-bottom: 16px;
} }
.tx-meeting-container ::v-deep.el-dialog .el-form-item{ .tx-meeting-container ::v-deep.el-dialog .el-form-item {
margin:0; margin: 0;
} }
</style> </style>
<template> <template>
<div class="account"> <div class="account">
<h5>账号管理 <el-button style="float:right;margin:12px 30px 0 0" size="mini" type="primary" plain @click="handleAdd" v-if="hasCreate">新增账号</el-button></h5> <h5>
账号管理
<el-button
style="float:right;margin:12px 30px 0 0"
size="mini"
type="primary"
plain
@click="handleAdd"
v-if="hasCreate"
>新增账号</el-button
>
</h5>
<div class="inner"> <div class="inner">
<div class="search-filter"> <div class="search-filter">
<div class="filter-item"> <div class="filter-item">
...@@ -22,23 +33,38 @@ ...@@ -22,23 +33,38 @@
<div class="filter-item"> <div class="filter-item">
<el-button type="primary" icon="el-icon-search" size="mini" @click="fetchAccountList">查询</el-button> <el-button type="primary" icon="el-icon-search" size="mini" @click="fetchAccountList">查询</el-button>
<el-button icon="el-icon-refresh-left" size="mini" @click="reset">重置</el-button> <el-button icon="el-icon-refresh-left" size="mini" @click="reset">重置</el-button>
<el-button type="text" size="mini" @click="isCollapse = !isCollapse">{{isCollapse ? '收起':'展开'}}</el-button> <el-button type="text" size="mini" @click="isCollapse = !isCollapse">{{
isCollapse ? '收起' : '展开'
}}</el-button>
</div> </div>
</div> </div>
<div class="delete-bar" v-if="hasDelete"> <div class="delete-bar" v-if="hasDelete">
<i class="el-icon-warning"></i> 已选择 <span class="num">{{selection.length || 0}}</span><el-button type="text" size="m" :disabled="!selection.length" @click="handleDelete('')" style="margin-left:15px;">删除</el-button> <i class="el-icon-warning"></i> 已选择 <span class="num">{{ selection.length || 0 }}</span>
<el-button
type="text"
size="m"
:disabled="!selection.length"
@click="handleDelete('')"
style="margin-left:15px;"
>删除</el-button
>
</div> </div>
<div class="table-container"> <div class="table-container">
<el-table :data="listData" style="width: 100%;" height="100%" v-loading="loading" @selection-change="handleSelectionChange"> <el-table
:data="listData"
style="width: 100%;"
height="100%"
v-loading="loading"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="45" v-if="hasDelete" /> <el-table-column type="selection" width="45" v-if="hasDelete" />
<el-table-column prop="username" label="姓名" min-width="120" /> <el-table-column prop="username" label="姓名" min-width="120" />
<el-table-column prop="phone" label="手机号码" min-width="80"/> <el-table-column prop="phone" label="手机号码" min-width="80" />
<el-table-column prop="email" label="邮箱" min-width="140"/> <el-table-column prop="email" label="邮箱" min-width="140" />
<el-table-column prop="userid" label="用户ID" min-width="120"/> <el-table-column prop="userid" label="用户ID" min-width="120" />
<el-table-column label="用户类型" min-width="80"> <el-table-column label="用户类型" min-width="90">
<template slot-scope="{ row }"> <template slot-scope="{ row }">
<span v-if="row.type === 2">普通用户</span> <span>{{ userType(row.type) }}</span>
<span v-else>虚拟会议室</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" min-width="80" v-if="hasUpdate"> <el-table-column label="操作" min-width="80" v-if="hasUpdate">
...@@ -50,7 +76,16 @@ ...@@ -50,7 +76,16 @@
</el-table> </el-table>
</div> </div>
<div class="footer-bar"> <div class="footer-bar">
<el-pagination :current-page.sync="curPage" :page-size.sync="pageSize" :page-sizes="[10, 20, 50, 100]" layout="total, prev, pager, next, sizes, jumper" :total="total" @current-change="pageChange" @size-change="pageChange" style="text-align:right;"></el-pagination> <el-pagination
:current-page.sync="curPage"
:page-size.sync="pageSize"
:page-sizes="[10, 20, 50, 100]"
layout="total, prev, pager, next, sizes, jumper"
:total="total"
@current-change="pageChange"
@size-change="pageChange"
style="text-align:right;"
></el-pagination>
</div> </div>
</div> </div>
<el-dialog :title="domicTitle" :visible.sync="dialogVisible" width="420px" center @close="handleDialogClose"> <el-dialog :title="domicTitle" :visible.sync="dialogVisible" width="420px" center @close="handleDialogClose">
...@@ -59,7 +94,12 @@ ...@@ -59,7 +94,12 @@
<el-input v-model="form.userid" size="small" disabled></el-input> <el-input v-model="form.userid" size="small" disabled></el-input>
</el-form-item> </el-form-item>
<el-form-item label="ID" prop="userid" v-else> <el-form-item label="ID" prop="userid" v-else>
<user-search v-model="form.userid" @select="handleSelect" :fetchApi="fetchApiSearch" :options="{ size: 'small' }"/> <user-search
v-model="form.userid"
@select="handleSelect"
:fetchApi="fetchApiSearch"
:options="{ size: 'small' }"
/>
</el-form-item> </el-form-item>
<el-form-item label="名称" prop="username"> <el-form-item label="名称" prop="username">
<el-input v-model="form.username" size="small"></el-input> <el-input v-model="form.username" size="small"></el-input>
...@@ -92,12 +132,12 @@ const defaultForm = { ...@@ -92,12 +132,12 @@ const defaultForm = {
} }
export default { export default {
components: { UserSearch }, components: { UserSearch },
data () { data() {
const phoneReg = /^1(3[0-9]|4[01456879]|5[0-35-9]|6[2567]|7[0-8]|8[0-9]|9[0-35-9])\d{8}$/ const phoneReg = /^1(3[0-9]|4[01456879]|5[0-35-9]|6[2567]|7[0-8]|8[0-9]|9[0-35-9])\d{8}$/
const checkMobile = (rule, value, callback) => { const checkMobile = (rule, value, callback) => {
if (value) { if (value) {
if (!phoneReg.test(value)) { if (!phoneReg.test(value)) {
callback(new Error('手机号格式错误')); callback(new Error('手机号格式错误'))
} else { } else {
callback() callback()
} }
...@@ -107,7 +147,7 @@ export default { ...@@ -107,7 +147,7 @@ export default {
const checkEmail = (rule, value, callback) => { const checkEmail = (rule, value, callback) => {
if (value) { if (value) {
if (!emailReg.test(value)) { if (!emailReg.test(value)) {
callback(new Error('邮箱格式错误')); callback(new Error('邮箱格式错误'))
} else { } else {
callback() callback()
} }
...@@ -173,6 +213,15 @@ export default { ...@@ -173,6 +213,15 @@ export default {
this.fetchAccountList() this.fetchAccountList()
}, },
methods: { methods: {
userType(type) {
const map = {
1: '虚拟会议室300方',
2: '普通用户',
3: '虚拟会议室500方',
4: '虚拟会议室1000方'
}
return map[type] || type
},
handleSelectionChange(val) { handleSelectionChange(val) {
this.selection = val this.selection = val
}, },
...@@ -182,11 +231,13 @@ export default { ...@@ -182,11 +231,13 @@ export default {
this.form.phone = val.mobile this.form.phone = val.mobile
}, },
reset() { reset() {
Object.keys(this.filter).map(key => { this.filter[key] = '' }) Object.keys(this.filter).map(key => {
this.filter[key] = ''
})
this.fetchAccountList() this.fetchAccountList()
}, },
handleDialogClose() { handleDialogClose() {
this.$refs.ruleForm.resetFields(); this.$refs.ruleForm.resetFields()
this.dialogVisible = false this.dialogVisible = false
this.form = Object.assign({}, defaultForm) this.form = Object.assign({}, defaultForm)
}, },
...@@ -210,20 +261,22 @@ export default { ...@@ -210,20 +261,22 @@ export default {
this.$confirm('此操作将删除所选中项的数据, 是否继续执行?', '提示', { this.$confirm('此操作将删除所选中项的数据, 是否继续执行?', '提示', {
confirmButtonText: '确定', confirmButtonText: '确定',
cancelButtonText: '取消' cancelButtonText: '取消'
}).then(() => { })
this.fetchDeleteAccount(ids) .then(() => {
}).catch(() => {}); this.fetchDeleteAccount(ids)
})
.catch(() => {})
}, },
pageChange() { pageChange() {
this.fetchAccountList() this.fetchAccountList()
}, },
handleBtn() { handleBtn() {
this.$refs.ruleForm.validate((valid) => { this.$refs.ruleForm.validate(valid => {
if (valid) { if (valid) {
this.dialogType === 'add' ? this.fetchCreateAccount() : this.fetchUpdateAccount() this.dialogType === 'add' ? this.fetchCreateAccount() : this.fetchUpdateAccount()
this.dialogVisible = false this.dialogVisible = false
} }
}); })
}, },
fetchAccountList() { fetchAccountList() {
const params = { const params = {
...@@ -240,7 +293,7 @@ export default { ...@@ -240,7 +293,7 @@ export default {
if (params[key] === '') delete params[key] if (params[key] === '') delete params[key]
}) })
this.loading = true this.loading = true
getTxAccountList(params).then((res) => { getTxAccountList(params).then(res => {
this.loading = false this.loading = false
if (res.code === 0 && res.data.data) { if (res.code === 0 && res.data.data) {
this.listData = res.data.data this.listData = res.data.data
...@@ -256,7 +309,7 @@ export default { ...@@ -256,7 +309,7 @@ export default {
phone: form.phone, phone: form.phone,
email: form.email email: form.email
} }
createTxAccount(params).then((res) => { createTxAccount(params).then(res => {
if (res.code === 0 && res.data.id) { if (res.code === 0 && res.data.id) {
this.$message.success('创建账户成功') this.$message.success('创建账户成功')
this.fetchAccountList() this.fetchAccountList()
...@@ -272,7 +325,7 @@ export default { ...@@ -272,7 +325,7 @@ export default {
phone, phone,
email email
} }
updateTxAccount(userid, params).then((res) => { updateTxAccount(userid, params).then(res => {
if (res.code === 0 && res.data.status === true) { if (res.code === 0 && res.data.status === true) {
this.$message.success('更新账户成功') this.$message.success('更新账户成功')
this.fetchAccountList() this.fetchAccountList()
...@@ -282,7 +335,7 @@ export default { ...@@ -282,7 +335,7 @@ export default {
}) })
}, },
fetchDeleteAccount(userids) { fetchDeleteAccount(userids) {
deleteTxAccount({ userids }).then((res) => { deleteTxAccount({ userids }).then(res => {
if (res.code === 0 && res.data.status === true) { if (res.code === 0 && res.data.status === true) {
this.$message.success('删除账户成功') this.$message.success('删除账户成功')
this.fetchAccountList() this.fetchAccountList()
...@@ -296,50 +349,50 @@ export default { ...@@ -296,50 +349,50 @@ export default {
} }
</script> </script>
<style scoped> <style scoped>
.account{ .account {
height:100%; height: 100%;
} }
h5{ h5 {
font-size: 16px; font-size: 16px;
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;
color:#333; color: #333;
font-weight: 500; font-weight: 500;
line-height:50px; line-height: 50px;
text-indent:20px; text-indent: 20px;
} }
.inner{ .inner {
height: calc(100% - 50px - 15px); height: calc(100% - 50px - 15px);
background: #FFFFFF; background: #ffffff;
border-radius: 10px; border-radius: 10px;
margin:0 16px; margin: 0 16px;
box-sizing:border-box; box-sizing: border-box;
padding:14px 14px 6px; padding: 14px 14px 6px;
display:flex; display: flex;
flex-direction:column; flex-direction: column;
} }
.table-container{ .table-container {
flex:1; flex: 1;
} }
.search-filter{ .search-filter {
display:flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
padding:10px; padding: 10px;
} }
.search-filter .filter-item{ .search-filter .filter-item {
width:33.33%; width: 33.33%;
margin-bottom:15px; margin-bottom: 15px;
} }
.search-filter label{ .search-filter label {
display:inline-block; display: inline-block;
width:60px; width: 60px;
text-align:right; text-align: right;
padding-right:10px; padding-right: 10px;
} }
.search-filter ::v-deep.el-input{ .search-filter ::v-deep.el-input {
width: calc(100% - 120px); width: calc(100% - 120px);
} }
.search-keywords-checked{ .search-keywords-checked {
color: #F56C6C; color: #f56c6c;
font-size: 12px; font-size: 12px;
line-height: 1; line-height: 1;
padding-top: 4px; padding-top: 4px;
...@@ -347,30 +400,31 @@ h5{ ...@@ -347,30 +400,31 @@ h5{
top: 100%; top: 100%;
right: 0; right: 0;
} }
.footer-bar{ .footer-bar {
padding:8px 0 4px; padding: 8px 0 4px;
} }
.delete-bar{ .delete-bar {
padding:0 20px; padding: 0 20px;
background: #ecf5ff; background: #ecf5ff;
border: #b3d8ff 1px solid; border: #b3d8ff 1px solid;
border-radius:4px; border-radius: 4px;
margin-bottom:15px; margin-bottom: 15px;
} }
.delete-bar i, .delete-bar .num{ .delete-bar i,
color:#409EFF; .delete-bar .num {
color: #409eff;
} }
.account ::v-deep.el-dialog__header{ .account ::v-deep.el-dialog__header {
padding-top:14px; padding-top: 14px;
} }
.account ::v-deep.el-dialog__headerbtn{ .account ::v-deep.el-dialog__headerbtn {
top:12px; top: 12px;
right:12px; right: 12px;
} }
.account ::v-deep.el-dialog__body{ .account ::v-deep.el-dialog__body {
padding:10px 20px padding: 10px 20px;
} }
.account ::v-deep.el-dialog__footer{ .account ::v-deep.el-dialog__footer {
padding-bottom:16px; padding-bottom: 16px;
} }
</style> </style>
\ No newline at end of file
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论