Skip to content

N
national_museum_vod
Commit 96574266 authored by qzhxx's avatar qzhxx
Browse files
Options

视频管理

parent 206d8168
Expand all Show whitespace changes
Inline Side-by-side
Showing with 1853 additions and 145 deletions
config/index.js
View file @ 96574266
......@@ -9,10 +9,10 @@ module.exports = {
// Paths
assetsSubDirectory: 'static',
assetsPublicPath: './',
assetsPublicPath: '/',
proxyTable: {
'/mall': {
target: "http://192.168.110.93/chnmuseum-party/",
target: "http://192.168.110.67/mall/",
changeOrigin: true,
pathRewrite: {
'^/mall': '/' // 重写接口
......
src/components/end/top.vue
View file @ 96574266
<template>
<div class="header_container" style="overflow:hidden;">
<div class="headerTitle l-float">中国国家博物馆建党百年展点播院线服务平台</div>
<el-dropdown class="adminlogo r-float H100" @command="handleCommand" trigger="click">
<div class="box">
<span class="el-dropdown-link">
......@@ -175,6 +176,17 @@
width: 100%;
height: 63px;
background-color: #dd44;
.headerTitle {
// width: 100%;
/*height: 8%;*/
height: 63px;
line-height: 63px;
// background: #002140;
font-size: 24px;
font-weight: 600;
// color: rgba(255, 255, 255, 1);
// text-align: center;
}
.header_icon{
line-height:63px;
margin-right:20px;
......
src/page/content/video/content/add.vue 0 → 100644
View file @ 96574266
<template>
<div class="addFormBox">
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="180px" class="addForm">
<el-form-item label="版权方名称" prop="name">
<el-input v-model="ruleForm.name"></el-input>
</el-form-item>
<el-form-item label="版权方有效期" required>
<el-date-picker
v-model="value1"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
></el-date-picker>
</el-form-item>
<el-form-item class="addTip">
<span>若没有相应的视频分类，请点击</span>
<el-button type="text" @click="addVideoClass">新建视频分类</el-button>
</el-form-item>
<el-form-item label="请选择预设视频分类">
<el-select placeholder="请选择预设视频分类" multiple v-model="department" @change="getSelectDep">
<el-checkbox :style="selfstyle" v-model="checkedThing" @change="selectAllThing">全选</el-checkbox>
<el-option
v-for="(item, index) in departments"
:label="item.label"
:value="item.label"
:key="index"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="备注">
<el-input type="textarea" v-model="ruleForm.desc"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitForm('ruleForm')">确定</el-button>
<el-button @click="resetForm('ruleForm')">取消</el-button>
</el-form-item>
</el-form>
<!--新增弹框-->
<el-dialog
title="新建视频分类"
:modal-append-to-body="false"
class="addDialog"
:visible.sync="dialogVisible"
:before-close="close"
>
<div class="form_box">
<el-form :model="classForm" ref="classForm" :rules="rules" id="ruleo" label-position="left">
<el-form-item label="视频分类名称" prop="name">
<el-input v-model="classForm.name"></el-input>
</el-form-item>
<el-form-item label="备注">
<el-input type="textarea" v-model="classForm.desc"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button class="r-float" size="mini" type="primary" @click="save">确定</el-button>
<el-button class="r-float" size="mini" @click="close">取 消</el-button>
</div>
</div>
</el-dialog>
</div>
</template>
<script>
export default {
data() {
return {
dialogVisible: false,
formLabelWidth: "100px",
form: {
name: ""
},
classForm: {
menuName: "",
menuUrl: "",
parentId: "",
sort: ""
},
value1: "",
ruleForm: {
name: "",
region: "",
date1: "",
date2: "",
delivery: false,
type: [],
resource: "",
desc: ""
},
departments: [
{
value: "Beijing",
label: "北京"
},
{
value: "Shanghai",
label: "上海"
},
{
value: "Nanjing",
label: "南京"
},
{
value: "Chengdu",
label: "成都"
},
{
value: "Shenzhen",
label: "深圳"
},
{
value: "Guangzhou",
label: "广州"
}
],
checkedThing: false,
department: [],
selfstyle: {
textAlign: "right",
width: "100%",
paddingRight: "10px"
},
rules: {
name: [
{ required: true, message: "请输入版权方名称", trigger: "blur" },
{ min: 3, max: 5, message: "长度在 3 到 5 个字符", trigger: "blur" }
],
region: [
{ required: true, message: "请选择活动区域", trigger: "change" }
],
date1: [
{
type: "date",
required: true,
message: "请选择日期",
trigger: "change"
}
],
date2: [
{
type: "date",
required: true,
message: "请选择时间",
trigger: "change"
}
],
type: [
{
type: "array",
required: true,
message: "请至少选择一个活动性质",
trigger: "change"
}
],
resource: [
{ required: true, message: "请选择活动资源", trigger: "change" }
],
desc: [{ required: true, message: "请填写活动形式", trigger: "blur" }]
}
};
},
methods: {
// 新建视频分类
addVideoClass() {
this.dialogVisible = true;
},
save() {
this.dialogVisible = false;
},
// 新增关闭
close() {
this.dialogVisible = false;
for (let key in this.classForm) {
this.classForm[key] = null;
}
this.$refs["classForm"].resetFields();
},
submitForm(formName) {
this.$refs[formName].validate(valid => {
if (valid) {
alert("submit!");
} else {
console.log("error submit!!");
return false;
}
});
},
resetForm(formName) {
this.$refs[formName].resetFields();
history.go(-1);
},
getSelectDep(department) {
// debugger
if (department.length === this.departments.length) {
this.checkedThing = true;
} else {
this.checkedThing = false;
}
},
selectAllThing() {
// debugger
this.department = [];
if (this.checkedThing) {
this.departments.map(item => {
this.department.push(item.label);
});
} else {
this.department = [];
}
}
}
};
</script>
<style lang="less">
// @import "../../../../style/common";
.addFormBox {
height: calc(100% - 40px);
width: 100%;
position: relative;
.addForm {
position: absolute;
height: 100%;
width: 600px;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
margin: 20px;
.addTip {
height:10px;
line-height: 10px;
// background: pink;
color: red;
// position:absolute;
// right:0
// float:right;
}
}
.el-dialog {
width: 360px;
background: rgba(255, 255, 255, 1);
box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.2);
border-radius: 4px;
.el-dialog__header {
padding: 15px;
border-bottom: 1px solid rgba(0, 0, 0, 0.09);
}
.el-dialog__body {
padding: 0px !important;
border: 1px solid transparent;
.form_box {
padding-bottom: 40px;
.el-form {
margin-bottom: 20px;
.el-form-item {
margin: 10px 50px 20px;
.el-form-item__content {
width: 280px;
}
}
.el-input {
width: 100%;
}
}
.dialog-footer {
// border-top: 1px solid rgba(0,0,0,0.09);
padding-top: 8px;
.el-button {
margin-right: 10px;
padding: 8px 16px;
}
}
}
}
}
}
</style>
\ No newline at end of file
src/page/content/video/content/index.vue
View file @ 96574266
This diff is collapsed.
src/page/content/video/copyright/add.vue
View file @ 96574266
<template>
<div class="addFormBox">
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="180px" class="addForm">
<el-form-item label="版权方名称" prop="name">
<el-input v-model="ruleForm.name"></el-input>
</el-form-item>
<el-form-item label="版权方有效期" required>
<el-date-picker
v-model="value1"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
></el-date-picker>
</el-form-item>
<el-form-item class="addTip">
<span>若没有相应的视频分类，请点击</span>
<el-button type="text" @click="addVideoClass">新建视频分类</el-button>
</el-form-item>
<el-form-item label="请选择预设视频分类">
<el-select placeholder="请选择预设视频分类" multiple v-model="department" @change="getSelectDep">
<el-checkbox :style="selfstyle" v-model="checkedThing" @change="selectAllThing">全选</el-checkbox>
<el-option
v-for="(item, index) in departments"
:label="item.label"
:value="item.label"
:key="index"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="备注">
<el-input type="textarea" v-model="ruleForm.desc"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitForm('ruleForm')">确定</el-button>
<el-button @click="resetForm('ruleForm')">取消</el-button>
</el-form-item>
</el-form>
<!--新增弹框-->
<el-dialog
title="新建视频分类"
:modal-append-to-body="false"
class="addDialog"
:visible.sync="dialogVisible"
:before-close="close"
>
<div class="form_box">
<el-form :model="classForm" ref="classForm" :rules="rules" id="ruleo" label-position="left">
<el-form-item label="视频分类名称" prop="name">
<el-input v-model="classForm.name"></el-input>
</el-form-item>
<el-form-item label="备注">
<el-input type="textarea" v-model="classForm.desc"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button class="r-float" size="mini" type="primary" @click="save">确定</el-button>
<el-button class="r-float" size="mini" @click="close">取 消</el-button>
</div>
</div>
</el-dialog>
</div>
</template>
<script>
export default {
data() {
return {
dialogVisible: false,
formLabelWidth: "100px",
form: {
name: ""
},
classForm: {
menuName: "",
menuUrl: "",
parentId: "",
sort: ""
},
value1: "",
ruleForm: {
name: "",
region: "",
date1: "",
date2: "",
delivery: false,
type: [],
resource: "",
desc: ""
},
departments: [
{
value: "Beijing",
label: "北京"
},
{
value: "Shanghai",
label: "上海"
},
{
value: "Nanjing",
label: "南京"
},
{
value: "Chengdu",
label: "成都"
},
{
value: "Shenzhen",
label: "深圳"
},
{
value: "Guangzhou",
label: "广州"
}
],
checkedThing: false,
department: [],
selfstyle: {
textAlign: "right",
width: "100%",
paddingRight: "10px"
},
rules: {
name: [
{ required: true, message: "请输入版权方名称", trigger: "blur" },
{ min: 3, max: 5, message: "长度在 3 到 5 个字符", trigger: "blur" }
],
region: [
{ required: true, message: "请选择活动区域", trigger: "change" }
],
date1: [
{
type: "date",
required: true,
message: "请选择日期",
trigger: "change"
}
],
date2: [
{
type: "date",
required: true,
message: "请选择时间",
trigger: "change"
}
],
type: [
{
type: "array",
required: true,
message: "请至少选择一个活动性质",
trigger: "change"
}
],
resource: [
{ required: true, message: "请选择活动资源", trigger: "change" }
],
desc: [{ required: true, message: "请填写活动形式", trigger: "blur" }]
}
};
},
methods: {
// 新建视频分类
addVideoClass() {
this.dialogVisible = true;
},
save() {
this.dialogVisible = false;
},
// 新增关闭
close() {
this.dialogVisible = false;
for (let key in this.classForm) {
this.classForm[key] = null;
}
this.$refs["classForm"].resetFields();
},
submitForm(formName) {
this.$refs[formName].validate(valid => {
if (valid) {
alert("submit!");
} else {
console.log("error submit!!");
return false;
}
});
},
resetForm(formName) {
this.$refs[formName].resetFields();
history.go(-1);
},
getSelectDep(department) {
// debugger
if (department.length === this.departments.length) {
this.checkedThing = true;
} else {
this.checkedThing = false;
}
},
selectAllThing() {
// debugger
this.department = [];
if (this.checkedThing) {
this.departments.map(item => {
this.department.push(item.label);
});
} else {
this.department = [];
}
}
}
};
</script>
<style lang="less">
// @import "../../../../style/common";
.addFormBox {
height: calc(100% - 40px);
width: 100%;
position: relative;
.addForm {
position: absolute;
height: 100%;
width: 600px;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
margin: 20px;
.addTip {
height:10px;
line-height: 10px;
// background: pink;
color: red;
// position:absolute;
// right:0
// float:right;
}
}
.el-dialog {
width: 360px;
background: rgba(255, 255, 255, 1);
box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.2);
border-radius: 4px;
.el-dialog__header {
padding: 15px;
border-bottom: 1px solid rgba(0, 0, 0, 0.09);
}
.el-dialog__body {
padding: 0px !important;
border: 1px solid transparent;
.form_box {
padding-bottom: 40px;
.el-form {
margin-bottom: 20px;
.el-form-item {
margin: 10px 50px 20px;
.el-form-item__content {
width: 280px;
}
}
.el-input {
width: 100%;
}
}
.dialog-footer {
// border-top: 1px solid rgba(0,0,0,0.09);
padding-top: 8px;
.el-button {
margin-right: 10px;
padding: 8px 16px;
}
}
}
}
}
}
</style>
\ No newline at end of file
src/page/content/video/copyright/index.vue
View file @ 96574266
This diff is collapsed.
src/page/end/menuRouter.vue
View file @ 96574266
<template>
<div class="container H100 W100">
<div class="aside H100 l-float">
<div class="logoTitle">机荟虚拟营业厅管理端</div>
<!-- <div class="logoTitle">机荟虚拟营业厅管理端</div> -->
<el-menu :default-active="defaultActive" :unique-opened="true" active-background-color="#545c64"
@open="handleOpen" @close="handleClose" router >
<el-menu-item v-if="item.children.length==0" v-for="item in menuList" :key="item.label" :index="item.menuUrl"
......
src/router/index.js
View file @ 96574266
......@@ -39,7 +39,13 @@ const hotProductsRecord = r => require.ensure([],()=>r(require('@/page/end/hotPr
const popularActiveRecord = r => require.ensure([],()=>r(require('@/page/end/popularActiveRecord')),'popularActiveRecord');
// 内容管理
const videoCopyright = r => require.ensure([],()=>r(require('@/page/content/video/copyright/add')),'videoCopyright');
const videoCopyright = r => require.ensure([],()=>r(require('@/page/content/video/copyright/index')),'videoCopyright');
const videoCopyrightAdd = r => require.ensure([],()=>r(require('@/page/content/video/copyright/add')),'videoCopyrightAdd');
const videoCopyrightUpdate = r => require.ensure([],()=>r(require('@/page/content/video/copyright/add')),'videoCopyrightUpdate');
const videoContent = r => require.ensure([],()=>r(require('@/page/content/video/content/index')),'videoContent');
const videoContentAdd = r => require.ensure([],()=>r(require('@/page/content/video/content/add')),'videoContentAdd');
const videoContentUpdate = r => require.ensure([],()=>r(require('@/page/content/video/content/add')),'videoContentUpdate');
/*跳转的页面*/
// 新建服务指南
......@@ -194,6 +200,32 @@ const router = new Router({
name: '视频版权方管理',
component: videoCopyright
},
{
path: '/videoCopyrightAdd',
name: '新建版权方',
component: videoCopyrightAdd
},
{
path: '/videoCopyrightUpdate',
name: '修改版权方',
component: videoCopyrightUpdate
},
{
path: '/videoContent',
name: '视频内容管理',
component: videoContent
},
{
path: '/videoContentAdd',
name: '新建视频',
component: videoContentAdd
},
{
path: '/videoContentUpdate',
name: '修改视频',
component: videoContentUpdate
},
//新建页面
{
......
src/style/common.less
View file @ 96574266
......@@ -95,6 +95,15 @@ div{
box-sizing: border-box;
background: #fff;
}
.h678{
height: 90%;
width:100%;
//min-width: 815px;
//margin: 24px 24px 0px 24px;
padding: 24px;
box-sizing: border-box;
background: #fff;
}
.el-pagination{
text-align: right;
......@@ -264,6 +273,19 @@ span.el-breadcrumb__separator {
margin-right: 0;
}
}
.el-date-editor.el-input__inner{
width: 300px;
}
.el-date-editor .el-range__icon {
line-height: 25px;
}
.el-date-editor .el-range-separator {
padding: 0 5px;
line-height: 25px;
width: 10%;
color: #303133;
}
@media (max-width: 1200px){
.el-date-editor.el-input,
.el-date-editor.el-input__inner,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment