Commit 2b7eeb76 authored by qzhxx's avatar qzhxx

视频

parent 263429fd
<template>
<div class="header_container" style="overflow:hidden;">
<div class="headerTitle l-float">中国国家博物馆建党百年展点播院线服务平台</div>
<!-- <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">
......
......@@ -5,10 +5,10 @@ export const menuList = [
{
subtitle:'视频管理',
subMenu:[
{label:'视频版权方管理', imgUrl:''},
{label:'视频分类管理', imgUrl:''},
{label:'视频内容管理', imgUrl:''},
{label:'视频汇出', imgUrl:''},
{label:'视频版权方管理', imgUrl:'',url:'/videoCopyright'},
{label:'视频分类管理', imgUrl:'',url:'/videoClassify'},
{label:'视频内容管理', imgUrl:'',url:'/videoContent'},
{label:'视频汇出', imgUrl:'',url:'/videoRemit'},
]
},
{
......
.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;
.addTipMsg{
background:#ddd;
padding-right:30px;
border-radius:10px;
}
.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;
}
}
}
}
}
}
\ No newline at end of file
.listPage {
background: #f9f9f9;
.content_box {
.btn_form_add {
height: 32px;
text-align: center;
padding: 0 15px;
margin-bottom: 15px;
}
.scrool {
width: 100%;
height: calc(100% - 100px);
overflow-x: hidden;
overflow-y: scroll;
.el-table {
.el-table__header-wrapper {
.el-table__header {
.has-gutter tr th {
background: rgba(250, 250, 250, 1);
}
}
}
.el-table__body-wrapper {
width: 100%;
table tbody tr td {
padding: 6px 0px;
}
}
}
}
/*!*编辑弹框*!*/
.el-dialog {
width: 600px;
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;
}
}
}
}
}
}
}
\ No newline at end of file
<template>
<h1>视频分类</h1>
</template>
\ No newline at end of file
<div class="unit-admin-wrapper">
分类
</div>
</template>
<script>
export default {
data(){
return{
}
},
mounted(){
},
methods:{
}
}
</script>
<style lang="less" scoped>
</style>
\ No newline at end of file
<template>
<div class="addFormBox">
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="180px" class="addForm">
<el-form-item label="版权方名称" prop="name">
<el-form-item label="视频名称">
<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 class="addTip">
<span>若没有相应的版权方,请点击</span>
<el-button type="text" @click="addVideoCopyright">新建版权方</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 class="addTip">
<span>若没有相应的视频分类,请点击</span>
......@@ -28,11 +34,49 @@
></el-option>
</el-select>
</el-form-item>
<el-form-item label="备注">
<el-input type="textarea" v-model="ruleForm.desc"></el-input>
<el-form-item label="视频缩略图">
<el-upload action="#" list-type="picture-card" :auto-upload="false">
<i slot="default" class="el-icon-plus"></i>
<div slot="file" slot-scope="{file}">
<img class="el-upload-list__item-thumbnail" :src="file.url" alt />
<span class="el-upload-list__item-actions">
<span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
<i class="el-icon-zoom-in"></i>
</span>
<span
v-if="!disabled"
class="el-upload-list__item-delete"
@click="handleDownload(file)"
>
<i class="el-icon-download"></i>
</span>
<span
v-if="!disabled"
class="el-upload-list__item-delete"
@click="handleRemove(file)"
>
<i class="el-icon-delete"></i>
</span>
</span>
</div>
</el-upload>
<el-dialog :visible.sync="dialogVisible">
<img width="100%" :src="dialogImageUrl" alt />
</el-dialog>
</el-form-item>
<el-form-item label="上传视频">
<el-upload
class="upload-demo"
drag
action="https://jsonplaceholder.typicode.com/posts/"
multiple
>
<i class="el-icon-upload"></i>
<div class="el-upload__text">点击上传</div>
</el-upload>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitForm('ruleForm')">确定</el-button>
<el-button type="primary" @click="submitForm('ruleForm')">提交审核</el-button>
<el-button @click="resetForm('ruleForm')">取消</el-button>
</el-form-item>
</el-form>
......@@ -41,7 +85,7 @@
title="新建视频分类"
:modal-append-to-body="false"
class="addDialog"
:visible.sync="dialogVisible"
:visible.sync="dialogVisibleForm"
:before-close="close"
>
<div class="form_box">
......@@ -65,7 +109,10 @@
export default {
data() {
return {
dialogImageUrl: "",
dialogVisible: false,
disabled: false,
dialogVisibleForm: false,
formLabelWidth: "100px",
form: {
name: ""
......@@ -162,12 +209,24 @@ export default {
};
},
methods: {
handleRemove(file) {
console.log(file);
},
handlePictureCardPreview(file) {
this.dialogImageUrl = file.url;
this.dialogVisible = true;
},
handleDownload(file) {
console.log(file);
},
// 新建版权方
addVideoCopyright() {},
// 新建视频分类
addVideoClass() {
this.dialogVisible = true;
this.dialogVisibleForm = true;
},
save() {
this.dialogVisible = false;
this.dialogVisibleForm = false;
},
// 新增关闭
close() {
......@@ -216,65 +275,5 @@ export default {
};
</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;
}
}
}
}
}
}
@import "../../style/add";
</style>
\ No newline at end of file
<template>
<div class="menuManagePage H100">
<div class="listPage H100">
<!-- <div class="head_box">
<h6>内容管理&nbsp;/&nbsp;视频内容管理</h6>
<h4>视频内容管理</h4>
</div>-->
<el-card class="head_box">
<div class="head_box">
<el-form :inline="true" :model="form" class="search-form" onsubmit="return false;">
<el-form-item label="版权方名称">
<el-input
......@@ -15,7 +15,7 @@
clearable
></el-input>
</el-form-item>
<el-form-item label="版权方有效期" required>
<el-form-item label="版权方有效期">
<el-date-picker
v-model="value1"
type="daterange"
......@@ -30,10 +30,9 @@
</el-form-item>
</el-form>
<div class="tipMsg">
<p>页面说明:</p>
<p>可通过版权方、视频分类及视频名称模糊搜索快速筛选视频信息,可对视频信息进行修改、删除。</p>
<span><strong>页面说明:</strong>可通过版权方、视频分类及视频名称模糊搜索快速筛选视频信息,可对视频信息进行修改、删除。</span>
</div>
</el-card>
</div>
<div class="content_box">
<div class="form_box h778px">
<el-button
......@@ -45,12 +44,14 @@
>&nbsp;&nbsp;&nbsp;</el-button>
<div class="scrool">
<el-table
border
:header-cell-style="{background:'#9B1E23',borderColor:'#FFFFFF',color:'#FFFFFF',textAlign:'center'}"
style="width:100%;"
ref="multipleTable"
:data="tableData"
@selection-change="handleSelectionChange"
>
<el-table-column type="index" width="55" label="序号"></el-table-column>
<el-table-column type="index" width="120" label="序号"></el-table-column>
<el-table-column show-overflow-tooltip label="视频名称" prop="menuName"></el-table-column>
<el-table-column show-overflow-tooltip label="版权方" prop="menuUrl"></el-table-column>
<el-table-column label="视频分类" prop="sort"></el-table-column>
......@@ -58,7 +59,7 @@
<el-table-column label="操作" header-align="center" align="center">
<template slot-scope="scope" width="220">
<el-button-group>
<el-button title="删除" type="text" size="mini" @click="handleDelete(scope.row)">删除</el-button>
<el-button title="删除" type="text" size="mini" @click="handleDelete(scope.row)">删除&nbsp;&nbsp;</el-button>
<el-button
title="编辑"
size="mini"
......@@ -69,8 +70,8 @@
title="编辑"
size="mini"
type="text"
@click="openEdit(scope.row)"
>编辑&nbsp;&nbsp;</el-button>
@click="openDetails(scope.row)"
>查看详情</el-button>
</el-button-group>
</template>
......@@ -150,7 +151,7 @@
</div>
</el-dialog>
<!--编辑弹框-->
<el-dialog title="编辑" :visible.sync="FormVisible" :before-close="close">
<el-dialog title="查看详情" :visible.sync="FormVisible" :before-close="close">
<div class="form_box">
<el-form :model="editform" ref="editform" :rules="rules">
<el-form-item label="排序值:" prop="sort" :label-width="formLabelWidth">
......@@ -412,6 +413,10 @@ export default {
// _this.editform= Object.assign({}, row);
// _this.FormVisible = true;
},
openDetails(){
let _this=this;
_this.FormVisible = true;
},
// 删除
handleDelete(row) {
let _this = this;
......@@ -549,82 +554,5 @@ export default {
<style lang="less">
@import "../../../../style/common";
.tipMsg{
height: 95px;
width:500px;
background:#ddd;
position:absolute;
right: 0;
top: 63px;
}
.menuManagePage {
.content_box {
.btn_form_add {
height: 32px;
text-align: center;
padding: 0 15px;
margin-bottom: 15px;
}
.scrool {
width: 100%;
height: calc(100% - 100px);
overflow-x: hidden;
overflow-y: scroll;
.el-table {
.el-table__header-wrapper {
.el-table__header {
.has-gutter tr th {
background: rgba(250, 250, 250, 1);
}
}
}
.el-table__body-wrapper {
width: 100%;
table tbody tr td {
padding: 6px 0px;
}
}
}
}
/*!*编辑弹框*!*/
.el-dialog {
width: 600px;
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;
}
}
}
}
}
}
}
@import "../../style/list";
</style>
<template>
<div class="addFormBox">
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="180px" class="addForm">
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="140px" class="addForm">
<el-form-item label="页面说明:" class="addTipMsg">
可新建版权方信息。“*”为必填项。预设视频分类中没有合适的选项,可点击“新建视频分类”在弹框中新建分类
</el-form-item>
<el-form-item label="版权方名称" prop="name">
<el-input v-model="ruleForm.name"></el-input>
</el-form-item>
......@@ -216,65 +219,5 @@ export default {
};
</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;
}
}
}
}
}
}
@import "../../style/add";
</style>
\ No newline at end of file
<template>
<div class="menuManagePage H100">
<div class="listPage H100">
<!-- <div class="head_box">
<h6>内容管理&nbsp;/&nbsp;视频版权方管理</h6>
<h4>视频版权方管理</h4>
</div>-->
<el-card class="head_box">
<div class="head_box">
<div class="tipMsg">
<span><strong>页面说明:</strong>展示所有单位的互动频次统计图及统计表格</span>
</div>
<el-form :inline="true" :model="form" class="search-form" onsubmit="return false;">
<el-form-item label="版权方名称">
<el-input
......@@ -15,7 +18,7 @@
clearable
></el-input>
</el-form-item>
<el-form-item label="版权方有效期" required>
<el-form-item label="版权方有效期">
<el-date-picker
v-model="value1"
type="daterange"
......@@ -29,11 +32,8 @@
<el-button size="mini" class="btn_form_search" >重置</el-button>
</el-form-item>
</el-form>
<div class="tipMsg">
<p>页面说明:</p>
<p>展示所有单位的互动频次统计图及统计表格</p>
</div>
</el-card>
</div>
<div class="content_box">
<div class="form_box h778px">
<el-button
......@@ -45,12 +45,14 @@
>&nbsp;&nbsp;&nbsp;</el-button>
<div class="scrool">
<el-table
border
:header-cell-style="{background:'#9B1E23',borderColor:'#FFFFFF',color:'#FFFFFF',textAlign:'center'}"
style="width:100%;"
ref="multipleTable"
:data="tableData"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column type="index" width="120" label="序号"></el-table-column>
<el-table-column show-overflow-tooltip label="版权方名称" prop="menuName"></el-table-column>
<el-table-column show-overflow-tooltip label="视频分类" prop="menuUrl"></el-table-column>
<el-table-column label="创建时间" prop="sort"></el-table-column>
......@@ -543,82 +545,5 @@ export default {
<style lang="less">
@import "../../../../style/common";
.tipMsg{
height: 95px;
width:500px;
background:#ddd;
position:absolute;
right: 0;
top: 63px;
}
.menuManagePage {
.content_box {
.btn_form_add {
height: 32px;
text-align: center;
padding: 0 15px;
margin-bottom: 15px;
}
.scrool {
width: 100%;
height: calc(100% - 100px);
overflow-x: hidden;
overflow-y: scroll;
.el-table {
.el-table__header-wrapper {
.el-table__header {
.has-gutter tr th {
background: rgba(250, 250, 250, 1);
}
}
}
.el-table__body-wrapper {
width: 100%;
table tbody tr td {
padding: 6px 0px;
}
}
}
}
/*!*编辑弹框*!*/
.el-dialog {
width: 600px;
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;
}
}
}
}
}
}
}
@import "../../style/list";
</style>
<template>
<div class="container H100 W100">
<div class="aside H100 l-float">
<!-- <div class="logoTitle">机荟虚拟营业厅管理端</div> -->
<!-- <div class="aside H100 l-float">
<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"
......@@ -18,13 +18,13 @@
<el-menu-item v-for="citem in menu.children" :index="citem.menuUrl" :key="citem.url" @click="changeIcon($event)" :class="citem.class?citem.class:''">{{citem.label}}</el-menu-item>
</el-submenu>
</el-menu>
</div>
</div> -->
<div class="right_part H100 r-float">
<top class="header"></top>
<!-- <top class="header"></top> -->
<div class="main">
<router-view></router-view>
</div>
<foot class="foot_title"></foot>
<!-- <foot class="foot_title"></foot> -->
</div>
</div>
......@@ -354,7 +354,8 @@
}
}
.right_part {
width: calc(100% - 256px);
width:100%;
// width: calc(100% - 256px);
/*min-width: 768px;*/
background: #fff;
overflow-x: auto;
......@@ -367,7 +368,8 @@
}
.main {
width: 100%;
height: calc(100% - 123px);
height:100%;
// height: calc(100% - 123px);
overflow-x: auto;
>div{
min-width: 768px;
......
......@@ -232,36 +232,83 @@ const router = new Router({
},
// --- 国博内容管理
{
path: '/videoCopyright',
name: '视频版权方管理',
component: videoCopyright
},
{
path: '/videoCopyrightAdd',
name: '新建版权方',
component: videoCopyrightAdd
component: videoCopyrightAdd,
meta:{
showBreadcrumb:true,
title:'新建版权方',
}
},
{
path: '/videoCopyrightUpdate',
name: '修改版权方',
component: videoCopyrightUpdate
component: videoCopyrightUpdate,
meta:{
showBreadcrumb:true,
title:'修改版权方',
}
},
{
path: '/videoContent',
name: '视频内容管理',
component: videoContent
},
// {
// path: '/videoContent',
// name: '视频内容管理',
// component: videoContent
// },
{
path: '/videoContentAdd',
name: '新建视频',
component: videoContentAdd
component: videoContentAdd,
meta:{
showBreadcrumb:true,
title:'新建视频',
}
},
{
path: '/videoContentUpdate',
name: '修改视频',
component: videoContentUpdate
component: videoContentUpdate,
meta:{
showBreadcrumb:true,
title:'修改视频',
}
},
{
path: '/videoCopyright',
name: '视频版权方管理',
component: () => import('@/page/content/video/copyright/index'),
meta:{
showBreadcrumb:true,
title:'视频版权方管理',
}
},
{
path: '/videoClassify',
name: '视频分类管理',
component: () => import('@/page/content/video/classify/index'),
meta:{
showBreadcrumb:true,
title:'视频分类管理',
}
},
{
path: '/videoContent',
name: '视频内容管理',
component: () => import('@/page/content/video/content/index'),
meta:{
showBreadcrumb:true,
title:'视频内容管理',
}
},
{
path: '/videoRemit',
name: '视频汇出',
component: () => import('@/page/content/video/remit/index'),
meta:{
showBreadcrumb:true,
title:'视频汇出',
}
},
//新建页面
......
*{
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
body, div, span, header, footer, nav, section, aside, article, ul, dl, dt, dd, li, a, p, h1, h2, h3, h4,h5, h6, i, b, textarea, button, input, select, figure, figcaption {
body,
div,
span,
header,
footer,
nav,
section,
aside,
article,
ul,
dl,
dt,
dd,
li,
a,
p,
h1,
h2,
h3,
h4,
h5,
h6,
i,
b,
textarea,
button,
input,
select,
figure,
figcaption {
padding: 0;
margin: 0;
list-style: none;
......@@ -12,145 +42,199 @@ body, div, span, header, footer, nav, section, aside, article, ul, dl, dt, dd, l
text-decoration: none;
border: none;
font-family: fSourceHanSansCN-Regular;
-webkit-tap-highlight-color:transparent;
-webkit-tap-highlight-color: transparent;
-webkit-font-smoothing: antialiased;
&:focus {
outline: none;
}
}
html,body{
html,
body {
height: 100%;
width: 100%;
color: #333;
}
h1,h2,h3,h4,h5,h6{
h1,
h2,
h3,
h4,
h5,
h6 {
margin: 0px;
}
ol {
padding-left: 20px !important;
}
ol li{
list-style-type:decimal;
}
div{
ol li {
list-style-type: decimal;
}
.mar0{
div {}
.mar0 {
margin: 0px;
}
.pad0{
.pad0 {
padding: 0px;
}
.l-float{
.l-float {
float: left;
}
.r-float{
.r-float {
float: right;
}
.H100{
.H100 {
height: 100%;
}
.W100{
.W100 {
width: 100%;
}
.head_box{
.head_box {
position: relative;
width: 100%;
height:97px;
height: 80px;
padding: 20px;
}
.head_box{
h6{
font-size:14px;
font-weight:400;
color:rgba(0,0,0,0.65);
background: #FFFFFF;
border: 1px solid #FFFFFF;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.10);
border-radius: 8px;
border-radius: 8px;
h6 {
font-size: 14px;
font-weight: 400;
color: rgba(0, 0, 0, 0.65);
margin-bottom: 10px;
}
h4{
font-size:20px;
font-weight:500;
color:rgba(0,0,0,0.85);
h4 {
font-size: 20px;
font-weight: 500;
color: rgba(0, 0, 0, 0.85);
}
.tipMsg{
height: 80px;
line-height: 35px;
width:400px;
position:absolute;
right: 0;
top: 0;
// right: 20px;
// top: 133px;
}
}
.marl20{
.marl20 {
margin-left: 20px;
}
.content_box{
.content_box {
//overflow-x: scroll;
//overflow-y: hidden;
width: calc(100% - 0px);
height: calc(100% - 97px);
background: #F0F2F5;
border: 1px solid transparent;
height: calc(100% - 100px);
// background: #F0F2F5;
// border: 1px solid transparent;
//overflow: hidden;
padding: 24px;
padding-bottom: 0;
}
.h778px{
height: 97%;
width:100%;
//min-width: 815px;
//margin: 24px 24px 0px 24px;
padding: 24px;
box-sizing: border-box;
background: #fff;
padding: 0px;
margin-top: 20px;
background: #FFFFFF;
border: 1px solid #FFFFFF;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.10);
border-radius: 8px;
border-radius: 8px;
}
.h678{
height: 90%;
width:100%;
.h778px {
height: 100%;
width: 100%;
//min-width: 815px;
//margin: 24px 24px 0px 24px;
padding: 24px;
padding: 20px;
box-sizing: border-box;
background: #fff;
background: #FFFFFF;
border: 1px solid #FFFFFF;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.10);
border-radius: 8px;
border-radius: 8px;
}
.el-pagination{
.el-pagination {
text-align: right;
margin-top: 10px;
}
.el-pagination.is-background.el-pagination--small .btn-next, .el-pagination.is-background.el-pagination--small .btn-prev, .el-pagination.is-background.el-pagination--small .el-pager li{
width:32px;
height:32px;
border-radius:6px;
line-height:30px;
border:1px solid rgba(217,217,217,1)
.el-pagination.is-background.el-pagination--small .btn-next,
.el-pagination.is-background.el-pagination--small .btn-prev,
.el-pagination.is-background.el-pagination--small .el-pager li {
width: 32px;
height: 32px;
border-radius: 6px;
line-height: 30px;
border: 1px solid rgba(217, 217, 217, 1)
}
/*分页*/
.el-pagination.is-background .btn-prev, .btn-next, .el-pagination.is-background .el-pager li {
.el-pagination.is-background .btn-prev,
.btn-next,
.el-pagination.is-background .el-pager li {
margin: 0 5px;
background-color: #fff;
border:1px solid rgba(217,217,217,1);
border: 1px solid rgba(217, 217, 217, 1);
}
.el-pagination.is-background .btn-next, .el-pagination.is-background .btn-prev, .el-pagination.is-background .el-pager li {
.el-pagination.is-background .btn-next,
.el-pagination.is-background .btn-prev,
.el-pagination.is-background .el-pager li {
margin: 0 5px;
background-color: #fff;
border:1px solid rgba(217,217,217,1);
border: 1px solid rgba(217, 217, 217, 1);
}
.el-pagination.is-background .el-pager li {
background-color: #fff;
border:1px solid rgba(217,217,217,1);
border: 1px solid rgba(217, 217, 217, 1);
}
.el-message-box{
.el-message-box {
.el-message-box--center {
padding-bottom: 6px;
.el-message-box__header{
.el-message-box__header {
border-bottom: 2px solid #eee;
}
.el-message-box__content{
.el-message-box__content {
padding: 0 0;
.el-input__inner{
.el-input__inner {
border: none;
}
.el-message-box__input{
.el-message-box__input {
padding: 0 0;
height: 200px;
}
}
.el-message-box__btns{
.el-message-box__btns {
border-top: 2px solid #eee;
}
}
......@@ -159,14 +243,15 @@ div{
// 状态
.statusBox{
span{
.statusBox {
span {
width: 10px;
height: 10px;
}
.active{
width:6px;
height:6px;
.active {
width: 6px;
height: 6px;
border-radius: 50%;
display: inline-block;
margin-right: 5px;
......@@ -177,55 +262,64 @@ div{
.el-breadcrumb {
margin-bottom: 18px;
}
span.el-breadcrumb__inner{
span.el-breadcrumb__inner {
font-weight: 400 !important;
color: rgba(0,0,0,0.65) !important;
color: rgba(0, 0, 0, 0.65) !important;
}
span.el-breadcrumb__separator {
margin: 0 5px;
color: #c0c4cc;
font-weight: 400;
color: rgba(0,0,0,0.45);
color: rgba(0, 0, 0, 0.45);
}
//排序
::-webkit-scrollbar
{
::-webkit-scrollbar {
width: 6px;
height: 6px;
background-color: #F5F5F5;
}
::-webkit-scrollbar-thumb
{
::-webkit-scrollbar-thumb {
border-radius: 10px;
background-color: #D9D9D9;
}
.sort-dialog {
.el-dialog {
margin-top: 15vh;
}
.el-dialog__body {
padding: 0 20px 15px;
span.tips {
color: #989898;
}
.hidden-box {
width: 100%;
overflow: hidden;
}
.list {
margin-top: 10px;
border: 1px solid #D9D9D9;
max-height: 465px;
overflow-x: hidden;
overflow-y: auto;
.item {
padding: 4px 10px;
overflow: hidden;
border-bottom: 1px solid #D9D9D9;
&:last-child {
border-bottom: none;
}
img {
width: 36px;
height: 36px;
......@@ -233,9 +327,11 @@ span.el-breadcrumb__separator {
vertical-align: middle;
margin-right: 6px;
}
span.title {
line-height: 36px;
}
span.index {
display: inline-block;
width: 25px;
......@@ -252,48 +348,57 @@ span.el-breadcrumb__separator {
}
}
}
//列表页-搜索框
.search-form{
.search-form {
@inputW: 220px;
@inputH: 32px;
.el-date-editor.el-input,
.el-date-editor.el-input__inner,
.el-input--mini .el-input__inner{
.el-input--mini .el-input__inner {
width: @inputW;
height: @inputH;
line-height: @inputH;
font-size: 14px;
}
.el-form-item{
&+.el-form-item{
.el-form-item {
&+.el-form-item {
margin-left: 20px;
}
&:last-child{
&:last-child {
margin-left: 0;
margin-right: 0;
}
}
.el-date-editor.el-input__inner{
.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){
}
@media (max-width: 1200px) {
.el-date-editor.el-input,
.el-date-editor.el-input__inner,
.el-input--mini .el-input__inner{
.el-input--mini .el-input__inner {
width: @inputW - 10px;
}
.el-form-item {
& + .el-form-item {
&+.el-form-item {
margin-left: 0;
}
}
......
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