This commit is contained in:
parent
f4104a97ab
commit
dcb7454386
|
@ -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",
|
||||||
|
|
|
@ -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
|
||||||
|
})
|
||||||
|
}
|
|
@ -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 // 如果使用中文,无需设置,请删除
|
||||||
|
|
|
@ -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'),
|
||||||
|
|
|
@ -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>
|
||||||
|
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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: {
|
||||||
|
|
Loading…
Reference in New Issue