Compare commits

..

2 Commits

Author SHA1 Message Date
faiz 1def7c7d0d 1 2024-09-19 18:17:05 +08:00
faiz dcb7454386 排班 2024-09-19 18:16:35 +08:00
9 changed files with 782 additions and 114 deletions

View File

@ -15,6 +15,12 @@
"test:ci": "npm run lint && npm run test:unit" "test:ci": "npm run lint && npm run test:unit"
}, },
"dependencies": { "dependencies": {
"@fullcalendar/core": "^6.1.15",
"@fullcalendar/daygrid": "^6.1.15",
"@fullcalendar/interaction": "^6.1.15",
"@fullcalendar/list": "^6.1.15",
"@fullcalendar/timegrid": "^6.1.15",
"@fullcalendar/vue": "^6.1.15",
"@wangeditor/editor": "^5.1.23", "@wangeditor/editor": "^5.1.23",
"@wangeditor/editor-for-vue": "^1.0.2", "@wangeditor/editor-for-vue": "^1.0.2",
"axios": "0.18.1", "axios": "0.18.1",
@ -30,6 +36,7 @@
"js-cookie": "2.2.0", "js-cookie": "2.2.0",
"jsonlint": "1.6.3", "jsonlint": "1.6.3",
"jszip": "3.2.1", "jszip": "3.2.1",
"moment": "^2.30.1",
"normalize.css": "7.0.0", "normalize.css": "7.0.0",
"nprogress": "0.2.0", "nprogress": "0.2.0",
"path-to-regexp": "2.4.0", "path-to-regexp": "2.4.0",

View File

@ -0,0 +1,41 @@
import request from '@/utils/request'
//直播间列表
export function liveroom() {
return request({
url: '/admin/liveroom/index',
method: 'get'
})
}
// 排班列表
export function roomWorks(live_room_id) {
return request({
url: '/admin/liveroom/roomWorks',
method: 'get',
params: { live_room_id }
})
}
// 可排班主播列表
export function availableZhubo(params) {
return request({
url: '/admin/liveroom/availableZhubo',
method: 'get',
params: params
})
}
// 编辑直播间
export function saveProducts(data) {
return request({
url: '/admin/liveroom/saveProducts',
method: 'post',
data
})
}
// 保存排班信息
export function saveRoomWorks(data) {
return request({
url: '/admin/liveroom/saveRoomWorks',
method: 'post',
data
})
}

View File

@ -3,7 +3,7 @@ import Vue from 'vue'
import Cookies from 'js-cookie' import Cookies from 'js-cookie'
import 'normalize.css/normalize.css' // a modern alternative to CSS resets import 'normalize.css/normalize.css' // a modern alternative to CSS resets
import consts from '@/utils/consts'
import Element from 'element-ui' import Element from 'element-ui'
import './styles/element-variables.scss' import './styles/element-variables.scss'
// import enLang from 'element-ui/lib/locale/lang/en'// 如果使用中文语言包请默认支持,无需额外引入,请删除该依赖 // import enLang from 'element-ui/lib/locale/lang/en'// 如果使用中文语言包请默认支持,无需额外引入,请删除该依赖
@ -36,7 +36,7 @@ if (process.env.NODE_ENV === 'production') {
const { mockXHR } = require('../mock') const { mockXHR } = require('../mock')
mockXHR() mockXHR()
} }
Vue.prototype.$consts = consts
Vue.use(Element, { Vue.use(Element, {
size: Cookies.get('size') || 'medium' // set element-ui default size size: Cookies.get('size') || 'medium' // set element-ui default size
// locale: enLang // 如果使用中文,无需设置,请删除 // locale: enLang // 如果使用中文,无需设置,请删除

View File

@ -103,6 +103,15 @@ export const asyncRoutes = [
roles: ['admin'] roles: ['admin']
} }
}, },
{
path: 'scheduling',
component: () => import('@/views/scheduling/index'),
name: 'scheduling',
meta: {
title: '直播排班',
roles: ['admin']
}
},
{ {
path: 'onlines', path: 'onlines',
component: () => import('@/views/onlines/online.vue'), component: () => import('@/views/onlines/online.vue'),

View File

@ -1,28 +1,56 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<div class="filter-container"> <div class="filter-container">
<el-input v-model="listQuery.username" placeholder="用户名" style="width: 200px; margin-right: 10px;" <el-input
class="filter-item" /> v-model="listQuery.username"
<el-button class="filter-item" type="primary" icon="el-icon-search" @click="getList"> placeholder="用户名"
style="width: 200px; margin-right: 10px"
class="filter-item"
/>
<el-button
class="filter-item"
type="primary"
icon="el-icon-search"
@click="getList"
>
搜索 搜索
</el-button> </el-button>
<el-button class="filter-item" type="primary" icon="el-icon-circle-plus" @click="onAdd"> <el-button
添加主播排班 class="filter-item"
type="primary"
icon="el-icon-circle-plus"
@click="onAdd"
>
添加主播
</el-button> </el-button>
</div> </div>
<el-table v-loading="listLoading" :data="list" border fit highlight-current-row style="width: 100%"> <el-table
v-loading="listLoading"
:data="list"
border
fit
highlight-current-row
style="width: 100%"
>
<el-table-column align="center" fixed label="操作" width="220"> <el-table-column align="center" fixed label="操作" width="220">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button type="danger" @click="onDel(scope.row)" size="small" icon="el-icon-delete-solid"> <el-button
type="danger"
@click="onDel(scope.row)"
size="small"
icon="el-icon-delete-solid"
>
删除 删除
</el-button> </el-button>
<el-button type="primary" @click="onSave(scope.row)" size="small" icon="el-icon-edit"> <el-button
type="primary"
@click="onAdd(scope.row)"
size="small"
icon="el-icon-edit"
>
修改 修改
</el-button> </el-button>
</template> </template>
@ -36,191 +64,236 @@
<el-table-column align="center" label="用户名" width="160"> <el-table-column align="center" label="用户名" width="160">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ scope.row.admin.username }}</span> <span>{{ scope.row.username }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" label="姓名" width="160"> <el-table-column align="center" label="姓名" width="160">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ scope.row.admin.name }}</span> <span>{{ scope.row.name }}</span>
</template> </template>
</el-table-column> </el-table-column>
<!-- <el-table-column align="center" width="100px" label="头像"> <el-table-column align="center" label="手机号" width="160">
<template slot-scope="scope"> <template slot-scope="scope">
<el-avatar :size="50" :src="scope.row.admin.avatar"></el-avatar> <span>{{ scope.row.mobile }}</span>
</template>
</el-table-column>-->
<el-table-column align="center" label="排班时间">
<template slot-scope="scope">
{{ scope.row.start| parseTime('{y}-{m}-{d} {h}:{i}') }} - {{ scope.row.end| parseTime('{y}-{m}-{d} {h}:{i}') }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" label="岗位" width="160">
<template slot-scope="scope">
<span>{{ scope.row.type == 2 ? "主播" : "中控" }}</span>
</template>
</el-table-column>
<!-- <el-table-column align="center" label="排班时间">
<template slot-scope="scope">
{{ scope.row.start | parseTime("{y}-{m}-{d} {h}:{i}") }} -
{{ scope.row.end | parseTime("{y}-{m}-{d} {h}:{i}") }}
</template>
</el-table-column> -->
<el-table-column align="center" label="平台"> <!-- <el-table-column align="center" label="平台">
<template slot-scope="scope"> <template slot-scope="scope">
<template v-for="i in scope.row.os"> <template v-for="i in scope.row.os">
{{ oss[i] }} {{ oss[i] }}
</template> </template>
</template> </template>
</el-table-column> -->
<el-table-column align="center" label="订单数">
<template slot-scope="scope">
{{ scope.row.orders }}
</template>
</el-table-column>
<el-table-column align="center" label="直播时长">
<template slot-scope="scope">
{{ scope.row.work_time }}
</template>
</el-table-column> </el-table-column>
<el-table-column align="center" label="订单金额"> <el-table-column align="center" label="订单金额">
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.total/100 }} {{ scope.row.total }}
</template> </template>
</el-table-column> </el-table-column>
<!-- <el-table-column width="140px" align="center" label="创建时间">
<el-table-column width="140px" align="center" label="创建时间">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ scope.row.create_time | parseTime('{y}-{m}-{d} {h}:{i}') }}</span> <span>{{
scope.row.create_time | parseTime("{y}-{m}-{d} {h}:{i}")
}}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column width="140px" align="center" label="修改时间"> <el-table-column width="140px" align="center" label="修改时间">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ scope.row.update_time | parseTime('{y}-{m}-{d} {h}:{i}') }}</span> <span>{{
scope.row.update_time | parseTime("{y}-{m}-{d} {h}:{i}")
}}</span>
</template> </template>
</el-table-column> </el-table-column> -->
</el-table> </el-table>
<pagination v-show="total > 0" :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.limit" @pagination="getList" /> <pagination
v-show="total > 0"
:total="total"
:page.sync="listQuery.page"
:limit.sync="listQuery.limit"
@pagination="getList"
/>
<!--
<el-dialog title="修改排班" :visible.sync="dialogWork"> <el-dialog title="修改排班" :visible.sync="dialogWork">
<el-form label-width="120px" :model="item"> <el-form label-width="120px" :model="item">
<el-form-item label="上班时间"> <el-form-item label="上班时间">
<el-date-picker <el-date-picker
v-model="item.date" v-model="item.date"
type="datetimerange" type="datetimerange"
range-separator="至" range-separator="至"
start-placeholder="开始日期" start-placeholder="开始日期"
end-placeholder="结束日期"> end-placeholder="结束日期"
>
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
<el-form-item label="渠道"> <el-form-item label="渠道">
<el-checkbox-group v-model="item.oss"> <el-checkbox-group v-model="item.oss">
<el-checkbox v-for="(v,i,k) in oss" :label="i" :key="k">{{v}}</el-checkbox> <el-checkbox v-for="(v, i, k) in oss" :label="i" :key="k">{{
v
}}</el-checkbox>
</el-checkbox-group> </el-checkbox-group>
</el-form-item> </el-form-item>
</el-form> </el-form>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button type="primary" @click="onSave()"> </el-button> <el-button type="primary" @click="onSave()"> </el-button>
</div> </div>
</el-dialog> </el-dialog> -->
<el-dialog title="主播排班表" :visible.sync="dialogCreate"> <el-dialog :title="title" :visible.sync="dialogCreate">
<el-form label-width="120px"> <el-form ref="form" :model="form" label-width="80px">
<el-row v-for="an in anchors" :key="an.id" style="margin-bottom: 10px;"> <el-form-item label="用户名" prop="username">
<el-col :span="2">{{ an.name }}</el-col> <el-input placeholder="用户名" v-model="form.username"></el-input>
<el-col :span="14"> </el-form-item>
<el-date-picker <el-form-item label="姓名" prop="name">
v-model="an.times" <el-input placeholder="姓名" v-model="form.name"></el-input>
type="datetimerange" </el-form-item>
range-separator="至" <el-form-item label="手机号" prop="mobile">
start-placeholder="开始日期" <el-input placeholder="请输入手机号" v-model="form.mobile"></el-input>
:default-time="['07:00:00', '23:59:59']" </el-form-item>
style="width:90%" <el-form-item label="岗位" prop="type">
end-placeholder="结束日期"> <el-radio-group v-model="form.type">
</el-date-picker> <el-radio :label="2">主播</el-radio>
</el-col> <el-radio :label="3">中控</el-radio>
<el-col :span="8"> </el-radio-group>
<el-checkbox-group v-model="an.os"> </el-form-item>
<el-checkbox v-for="(v,i,k) in oss" :label="i" :key="k">{{v}}</el-checkbox>
</el-checkbox-group>
</el-col>
</el-row>
</el-form> </el-form>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button type="primary" v-loading="loading" @click="onSaves()"> </el-button> <el-button type="primary" v-loading="loading" @click="onSaves(form)"
> </el-button
>
</div> </div>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
import Pagination from '@/components/Pagination' // Secondary package based on el-pagination import Pagination from "@/components/Pagination"; // Secondary package based on el-pagination
export default { export default {
name: 'Works', name: "Works",
components: { Pagination }, components: { Pagination },
data() { data() {
return { return {
oss: {}, oss: {},
list: null, list: null,
title: "",
total: 0, total: 0,
listLoading: true, listLoading: true,
loading: false, loading: false,
listQuery: { listQuery: {
page: 1, page: 1,
limit: 20 limit: 20,
},
form: {
username: "",
name: "",
mobile: "",
type: 2,
}, },
dialogWork: false, dialogWork: false,
dialogCreate: false, dialogCreate: false,
item: {}, item: {},
anchors: [] anchors: [],
} };
}, },
created() { created() {
this.getList() this.getList();
}, },
methods: { methods: {
getList() { getList() {
this.$axios.get('/admin/work/index', { params: this.listQuery }).then(response => { this.$axios
this.list = response.data.data .get("/admin/liveroom/zhuboStatistics", { params: this.listQuery })
this.total = response.data.total .then((response) => {
this.oss = response.ext.oss this.list = response.data.data;
this.listLoading = false this.total = response.data.total;
}).catch(err => { this.listLoading = false;
}) })
.catch((err) => {});
}, },
onDel(item) { onDel(item) {
this.$axios.post('/admin/work/del', {id: item.id}).then(res => { this.$axios
this.dialogVisible = false .post("/admin/work/del", { id: item.id })
this.getList() .then((res) => {
}).catch(err => { this.dialogVisible = false;
this.getList();
}) })
.catch((err) => {});
}, },
onSave(from) { // onSave(from) {
if(from) { // if (from) {
this.$set(from,'date',[new Date(from.start), new Date(from.end)]); // this.$set(from, "date", [new Date(from.start), new Date(from.end)]);
this.item = from; // this.item = from;
this.item.os = from.os+''; // this.item.os = from.os + "";
this.dialogWork = true; // this.dialogWork = true;
return // return;
} // }
this.$axios.post('/admin/work/save', this.item).then(response => { // this.$axios
this.dialogWork = false // .post("/admin/work/save", this.item)
this.getList() // .then((response) => {
}).catch(err => { // this.dialogWork = false;
}) // this.getList();
}, // })
onAdd() { // .catch((err) => {});
this.$axios.get('/admin/work/anchor').then((res) => { // },
this.anchors = res.data || [] onAdd(item) {
this.dialogCreate = true // this.anchors = res.data || [];
}).catch(err=>{ this.dialogCreate = true;
this.$nextTick((res) => {
}) this.$refs["form"].resetFields();
this.title = item.id ? "编辑" : "添加";
this.form = item.id
? { ...item }
: {
username: "",
name: "",
mobile: "",
type: 2,
};
});
}, },
onSaves() { onSaves() {
if(this.loading) return this.$axios
this.loading = true .post("/admin/admin/save", this.form)
this.$axios.post('/admin/work/save2', this.anchors).then(res => { .then((response) => {
this.dialogCreate = false this.$message({
this.loading = false message: "成功",
}).catch(err=> { type: "success",
this.loading = false });
}) this.dialogCreate = false;
} this.getList();
} })
} .catch((err) => {});
},
},
};
</script> </script>

View File

@ -0,0 +1,279 @@
<template>
<div class="app-container">
<div class="scheduling_head">
<div class="head_lable">产品编号:</div>
<div
class="scheduling_tab"
@click="handleClick(index)"
:key="index"
:class="activeName == item.id ? 'active' : ''"
v-for="(item, index) in liveroomList"
>
{{ item.name }}
</div>
<el-button type="primary" style="margin-left: 210px" @click="handleEdit"
>编辑</el-button
>
</div>
<div class="scheduling_tab_pana">
<div class="table-list" v-for="item in roomWorksList">
<div class="table-list_item">
<div class="tit">
{{ item.date }}
</div>
</div>
<div class="table-list_item">
<div class="tit">
{{ item.date_name
}}<i
@click="handleAdds('', item.date)"
class="el-icon-circle-plus"
></i>
</div>
</div>
<div class="table-list-box" v-for="it in item.work">
<div class="border" @dblclick="handleAdds(it, item.date)">
<div style="margin-bottom: 10px">
AM {{ extractTime(it.start) }}~{{ extractTime(it.end) }}
</div>
<div>主播{{ it.zhubo.name }}</div>
<div>中控{{ it.zhongkong.name }}</div>
<div>路线{{ it.route ? it.route : "无" }}</div>
</div>
</div>
</div>
</div>
<liveroom-update
v-if="addOrUpdateVisible"
ref="addOrUpdate"
@update="saveProducts"
></liveroom-update>
<roomWorksUpdate
v-if="roomVisible"
ref="roomUpdate"
:title="title"
@update="saveRoomWorks"
></roomWorksUpdate>
</div>
</template>
<script>
import {
liveroom,
roomWorks,
availableZhubo,
saveProducts,
saveRoomWorks,
} from "@/api/scheduling";
import liveroomUpdate from "./liveroom-update.vue";
import roomWorksUpdate from "./room-works";
export default {
name: "Scheduling",
data() {
return {
list: [],
activeName: "",
listLoading: true,
title: "添加排班",
listQuery: {
page: 1,
limit: 20,
title: "",
status: "",
},
total: 0,
dialogVisible: false,
dialogType: "new",
liveroomList: [],
roomWorksList: [],
product_ids: "",
live_room_id: "",
addOrUpdateVisible: false,
roomVisible: false,
};
},
components: {
liveroomUpdate,
roomWorksUpdate,
},
async mounted() {
await this.liveroom();
this.roomWorks();
},
methods: {
extractTime(dateTimeStr) {
//
const regex = /^(\d{4})-(\d{2})-(\d{2}) (\d{2}):(\d{2}):(\d{2})$/;
const match = dateTimeStr.match(regex);
if (!match) {
throw new Error("不匹配");
}
//
return `${match[4]}:${match[5]}:${match[6]}`;
},
isCurrentTimeAfter(startTimeStr) {
// Date
const startTime = new Date(startTimeStr);
//
const currentTime = new Date();
//
return currentTime >= startTime;
},
//
async liveroom() {
try {
let { data } = await liveroom();
this.liveroomList = data;
this.activeName = this.liveroomList[0].id + "";
this.live_room_id = this.liveroomList[0].id;
this.product_ids = this.liveroomList[0].product_ids;
} catch (err) {
console.log(err);
}
},
//
async roomWorks() {
try {
let { data } = await roomWorks(this.live_room_id);
this.roomWorksList = data;
} catch (err) {
console.log(err);
}
},
// tab
handleClick(i) {
let { id, product_ids } = this.liveroomList[i];
this.live_room_id = id;
this.product_ids = product_ids;
this.activeName = id + "";
this.roomWorks();
},
//
handleEdit() {
this.addOrUpdateVisible = true;
this.$nextTick(() => {
this.$refs["addOrUpdate"].init(this.live_room_id, this.product_ids);
});
},
//
handleAdds(form, date) {
console.log(form);
this.title = form.id ? "编辑排班" : "添加排班";
if (form.id && this.isCurrentTimeAfter(form.start)) {
return this.$message.error("当前时间无法编辑");
}
this.roomVisible = true;
this.$nextTick(() => {
this.$refs["roomUpdate"].init(this.live_room_id, { ...form }, date);
});
},
saveProducts(form) {
this.liveroom();
saveProducts(form).then((res) => {
this.$message({
message: "直播间编辑成功",
type: "success",
});
});
},
saveRoomWorks(form) {
saveRoomWorks(form).then((res) => {
this.roomWorks();
this.$message({
message: "添加排班成功",
type: "success",
});
});
},
handleAdd() {},
},
};
</script>
<style lang="scss" scoped>
.app-container {
position: relative;
padding-bottom: 60px; /* 分页条的高度 */
}
::v-deep .el-tabs__nav-wrap::after {
display: none;
}
.filter-container,
.el-table {
padding-bottom: 5px; /* 分页条的高度,以避免内容重叠 */
}
::v-deep .el-row {
height: 50px;
line-height: 50px;
}
.head_lable {
font-size: 14px;
color: #3d3d3d;
font-weight: 700;
margin-right: 10px;
}
.scheduling_head {
display: flex;
align-items: center;
margin-bottom: 28px;
}
.scheduling_tab {
display: inline-block;
padding: 12px 28px;
font-size: 16px;
border: 1px solid #e2e2e2;
border-radius: 5px;
cursor: pointer;
& + .scheduling_tab {
margin-left: 10px;
}
}
.active {
border-color: #1269ff;
}
.el-icon-circle-plus {
color: #367af0;
font-size: 16px;
}
.scheduling_tab_pana {
display: flex;
justify-content: space-between;
// align-items: center;
.table-list {
flex-basis: 14.3%;
.table-list_item {
height: 56px;
background: #e4ecff;
display: flex;
// justify-content: center;
align-items: center;
border: 1px solid #d7ddeb;
margin-right: -1px;
margin-bottom: -1px;
.tit {
width: 100%;
display: flex;
justify-content: space-evenly;
}
}
.table-list-box {
padding: 15px;
font-size: 14px;
color: #ffffff;
border: 1px solid #d7ddeb;
margin-right: -1px;
margin-bottom: -1px;
.border {
padding: 13px;
background: #367af0;
cursor: pointer;
}
}
}
}
</style>

View File

@ -0,0 +1,51 @@
<template>
<el-dialog
title="编辑直播间"
:visible.sync="dialogVisible"
width="30%"
:before-close="handleClose"
>
<el-form ref="form" :model="form" label-width="80px">
<el-form-item label="直播间id" prop="product_ids">
<el-input v-model="form.product_ids"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false"> </el-button>
<el-button type="primary" @click="handleEdit"> </el-button>
</span>
</el-dialog>
</template>
<script>
export default {
props: {},
data() {
return {
dialogVisible: false,
form: {
product_ids: "",
live_room_id: "",
},
};
},
methods: {
init(live_room_id, product_ids) {
this.dialogVisible = true;
this.form.product_ids = product_ids;
this.form.live_room_id = live_room_id;
console.log(this.form);
},
handleClose() {
this.dialogVisible = false;
},
handleEdit() {
this.dialogVisible = false;
this.$emit("update", this.form);
},
},
};
</script>
<style scoped lang="scss"></style>

View File

@ -0,0 +1,208 @@
<template>
<el-dialog
:title="title"
:visible.sync="dialogVisible"
width="30%"
:before-close="handleClose"
>
<el-form :rules="rules" ref="form" :model="form" label-width="80px">
<el-form-item label="直播间" prop="live_room_id">
<el-select v-model="form.live_room_id" placeholder="请选择直播间">
<el-option
v-for="item in liveroomList"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<!-- <el-form-item label="开始时间" prop="start">
<el-date-picker
@change="handleDate"
v-model="form.start"
value-format="yyyy-MM-dd HH:mm:ss"
type="datetime"
placeholder="选择日期时间"
>
</el-date-picker>
</el-form-item>
<el-form-item label="结束时间" prop="end">
<el-date-picker
v-model="form.end"
value-format="yyyy-MM-dd HH:mm:ss"
type="datetime"
@change="handleDate"
placeholder="选择日期时间"
>
</el-date-picker>
</el-form-item> -->
<el-form-item label="时间">
<el-time-select
placeholder="起始时间"
v-model="startTime"
:picker-options="{
start: '08:00',
step: '00:15',
end: '24:00',
}"
>
</el-time-select>
<el-time-select
placeholder="结束时间"
@change="handleDate"
v-model="endTime"
:picker-options="{
start: '08:00',
step: '00:15',
end: '24:00',
minTime: startTime,
}"
>
</el-time-select>
</el-form-item>
<el-form-item label="主播" prop="zhubo_id">
<el-select v-model="form.zhubo_id" placeholder="请选择主播">
<el-option
v-for="item in zhuboList"
:label="item.name"
:value="item.id"
:disabled="item.disabled"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="中控" prop="zhongkong_id">
<el-select v-model="form.zhongkong_id" placeholder="请选择中控">
<el-option
v-for="item in zhongkongList"
:label="item.name"
:value="item.id"
:disabled="item.disabled"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="路线">
<el-input v-model="form.route"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false"> </el-button>
<el-button type="primary" @click="handleEdit"> </el-button>
</span>
</el-dialog>
</template>
<script>
import { availableZhubo, liveroom } from "@/api/scheduling";
export default {
props: {
title: {
type: String,
default: "添加排班",
},
},
data() {
return {
dialogVisible: false,
startTime: "",
endTime: "",
form: {
live_room_id: "",
start: "",
end: "",
zhubo_id: "",
zhongkong_id: "",
route: "",
},
zhuboList: [],
zhongkongList: [],
liveroomList: [],
dayDate: "",
rules: {
live_room_id: [
{ required: true, message: "请选择直播间", trigger: "change" },
],
zhongkong_id: [
{ required: true, message: "请选择中控", trigger: "change" },
],
zhubo_id: [
{ required: true, message: "请选择主播", trigger: "change" },
],
// date: [{ required: true, message: "", trigger: "change" }],
},
};
},
watch: {
form: function () {
this.handleDate();
},
},
methods: {
extractTime(dateTimeStr) {
//
const regex = /^(\d{4})-(\d{2})-(\d{2}) (\d{2}):(\d{2}):(\d{2})$/;
const match = dateTimeStr.match(regex);
if (!match) {
throw new Error("不匹配");
}
//
return `${match[4]}:${match[5]}`;
},
init(live_room_id, form, date) {
this.dialogVisible = true;
this.$nextTick((res) => {
this.$refs["form"].resetFields();
this.dayDate = date;
this.form = !!form.id
? form
: {
live_room_id: "",
start: "",
end: "",
zhubo_id: "",
zhongkong_id: "",
};
this.form.live_room_id = live_room_id;
this.startTime = form.id ? this.extractTime(this.form.start) : "";
this.endTime = form.id ? this.extractTime(this.form.end) : "";
console.log(this.startTime);
console.log(this.endTime);
});
this.liveroom();
},
//
async liveroom() {
try {
let { data } = await liveroom();
this.liveroomList = data;
} catch (err) {
console.log(err);
}
},
handleClose() {
this.dialogVisible = false;
},
handleDate() {
this.form.end = `${this.dayDate} ${this.endTime}:00`;
this.form.start = `${this.dayDate} ${this.startTime}:00`;
if (this.form.end && this.form.start) {
availableZhubo({ ...this.form, type: 2 }).then((res) => {
this.zhuboList = res.data;
});
availableZhubo({ ...this.form, type: 3 }).then((res) => {
this.zhongkongList = res.data;
});
}
},
handleEdit() {
// this.form.end = `${this.dayDate} ${this.startTime}:00`;
// this.form.start = `${this.dayDate} ${this.endTime}:00`;
this.dialogVisible = false;
this.$emit("update", this.form);
},
},
};
</script>
<style scoped lang="scss"></style>

View File

@ -38,8 +38,8 @@ module.exports = {
}, },
proxy: { proxy: {
'/dev-api': { // 接口地址 以 api开头的都走下面的配置 '/dev-api': { // 接口地址 以 api开头的都走下面的配置
target: 'https://www.szjinao.cn', // 代理目标地址为后端服务器地址 127.0.0.1 192.168.1.2 // target: 'https://www.szjinao.cn', // 代理目标地址为后端服务器地址 127.0.0.1 192.168.1.2
// target: 'http://192.168.0.6:8787', // 代理目标地址为后端服务器地址 127.0.0.1 192.168.1.2 target: 'http://192.168.0.100:8787', // 代理目标地址为后端服务器地址 127.0.0.1 192.168.1.2
ws: true, // 是否支持 websocket 请求 支持 ws: true, // 是否支持 websocket 请求 支持
changeOrigin: true, // 是否启用跨域 changeOrigin: true, // 是否启用跨域
pathRewrite: { pathRewrite: {