xbx #19
98
src/components/ReviewItem.vue
Normal file
98
src/components/ReviewItem.vue
Normal file
@ -0,0 +1,98 @@
|
|||||||
|
<template>
|
||||||
|
<div class="reviewitem">
|
||||||
|
<div class="top">
|
||||||
|
<img src="" alt="">
|
||||||
|
<div class="name">qweqw</div>
|
||||||
|
<div class="lv">
|
||||||
|
<div class="img">
|
||||||
|
<img src="" alt="">
|
||||||
|
<img src="" alt="">
|
||||||
|
<img src="" alt="">
|
||||||
|
<img src="" alt="">
|
||||||
|
<img src="" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="num">8.0</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="cont">
|
||||||
|
dafjkldashfjksdhjkhfgjkdshjkfgsdhjkghjkshgjsjkhg
|
||||||
|
</div>
|
||||||
|
<div class="bottom">
|
||||||
|
<div class="date">2020-10-10</div>
|
||||||
|
<div class="reply">回复</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.reviewitem{
|
||||||
|
width: 100%;
|
||||||
|
margin-bottom: 50px;
|
||||||
|
.top{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
>img{
|
||||||
|
width: 57px;
|
||||||
|
height: 57px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background-color: #0f0;
|
||||||
|
|
||||||
|
}
|
||||||
|
.name{
|
||||||
|
font-size: 13px;
|
||||||
|
color: #111;
|
||||||
|
margin-left: 10px;
|
||||||
|
|
||||||
|
}
|
||||||
|
.lv{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
.img{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
>img{
|
||||||
|
width: 12px;
|
||||||
|
height: 12px;
|
||||||
|
background-color: #0f0;
|
||||||
|
margin-left: 3px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.num{
|
||||||
|
font-size: 11px;
|
||||||
|
color: #D12C2E;
|
||||||
|
margin-left: 3px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.cont{
|
||||||
|
margin-left: 67px;
|
||||||
|
font-size: 11px;
|
||||||
|
line-height: 1.2;
|
||||||
|
|
||||||
|
}
|
||||||
|
.bottom{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-left: 67px;
|
||||||
|
margin-top: 25px;
|
||||||
|
.date{
|
||||||
|
font-size: 10px;
|
||||||
|
color: #999;
|
||||||
|
|
||||||
|
}
|
||||||
|
.reply{
|
||||||
|
font-size: 10px;
|
||||||
|
color: #08AE98;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent } from 'vue';
|
||||||
|
|
||||||
|
export default defineComponent({
|
||||||
|
setup(){
|
||||||
|
console.log(1)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
</script>
|
||||||
87
src/components/VideoCont.vue
Normal file
87
src/components/VideoCont.vue
Normal file
@ -0,0 +1,87 @@
|
|||||||
|
<template>
|
||||||
|
<div class="cont">
|
||||||
|
<div class="title">视频数据</div>
|
||||||
|
<div class="info">
|
||||||
|
<div class="item">
|
||||||
|
<img src="" alt="">
|
||||||
|
<span>sdasjdkasfklasjkfjakl</span>
|
||||||
|
</div>
|
||||||
|
<div class="item">
|
||||||
|
<img src="" alt="">
|
||||||
|
<span>sdasjdkasfklasjkfjakl</span>
|
||||||
|
</div>
|
||||||
|
<div class="item">
|
||||||
|
<img src="" alt="">
|
||||||
|
<span>sdasjdkasfklasjkfjakl</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="button">
|
||||||
|
<div class="modify">修改该视频</div>
|
||||||
|
<div class="del">删除该视频</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.cont{
|
||||||
|
width: 316px;
|
||||||
|
height: 563px;
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 17px;
|
||||||
|
padding: 0 28px;
|
||||||
|
position: relative;
|
||||||
|
.title{
|
||||||
|
padding: 23px 0 11px 0;
|
||||||
|
font-size: 13px;
|
||||||
|
color: #111;
|
||||||
|
line-height: 1;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
.info{
|
||||||
|
.item{
|
||||||
|
display: flex;
|
||||||
|
align-content: center;
|
||||||
|
margin-top: 23px;
|
||||||
|
>img{
|
||||||
|
width: 24px;
|
||||||
|
height: 24px;
|
||||||
|
background-color: #0f0;
|
||||||
|
}
|
||||||
|
>span{
|
||||||
|
font-size: 11px;
|
||||||
|
color: #666;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.button{
|
||||||
|
position: absolute;
|
||||||
|
width: 260px;
|
||||||
|
bottom: 28px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
>div{
|
||||||
|
width: 114px;
|
||||||
|
height: 23px;
|
||||||
|
border-radius: 3px;
|
||||||
|
font-size: 10px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 23px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.modify{
|
||||||
|
background-color: #08AE98;
|
||||||
|
}
|
||||||
|
.del{
|
||||||
|
background-color: #D12C2E;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent } from 'vue';
|
||||||
|
|
||||||
|
export default defineComponent({
|
||||||
|
|
||||||
|
})
|
||||||
|
</script>
|
||||||
123
src/components/VideoItem.vue
Normal file
123
src/components/VideoItem.vue
Normal file
@ -0,0 +1,123 @@
|
|||||||
|
<template>
|
||||||
|
<div class="videoitem">
|
||||||
|
<img src="" alt="" class="cover">
|
||||||
|
<img src="" alt="" class="play">
|
||||||
|
<div class="title">
|
||||||
|
sadghaskghdfjkaghjkfha
|
||||||
|
<span class="lv">7.3分</span>
|
||||||
|
</div>
|
||||||
|
<div class="info">
|
||||||
|
<div class="datetime">
|
||||||
|
<span>2020-09-11</span>
|
||||||
|
<span class="time">09:30</span>
|
||||||
|
</div>``
|
||||||
|
<div class="feature">
|
||||||
|
<div>
|
||||||
|
<img src="" alt="">
|
||||||
|
<span>123</span>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<img src="" alt="">
|
||||||
|
<span>3</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="state audit fail">
|
||||||
|
审核中
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.videoitem{
|
||||||
|
width: 226px;
|
||||||
|
height: 198px;
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 17px;
|
||||||
|
overflow: hidden;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
position: relative;
|
||||||
|
box-shadow: 0px 5px 6px 0px rgba(158, 158, 158, 0.11);
|
||||||
|
.cover{
|
||||||
|
width: 100%;
|
||||||
|
height: 127px;
|
||||||
|
background-color: #0f0;
|
||||||
|
}
|
||||||
|
.play{
|
||||||
|
position: absolute;
|
||||||
|
top: 52px;
|
||||||
|
left: 101px;
|
||||||
|
width: 23px;
|
||||||
|
height: 23px;
|
||||||
|
}
|
||||||
|
.title{
|
||||||
|
margin-top: 16px;
|
||||||
|
font-display: 11px;
|
||||||
|
color: #111;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
>span{
|
||||||
|
margin-left: 11px;
|
||||||
|
font-size: 10px;
|
||||||
|
color: #f55455;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.info{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
.datetime{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 10px;
|
||||||
|
color: #666;
|
||||||
|
.time{
|
||||||
|
margin-left: 15px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.feature{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 18px;
|
||||||
|
>div{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
>img{
|
||||||
|
width: 11px;
|
||||||
|
height: 11px;
|
||||||
|
}
|
||||||
|
>span{
|
||||||
|
font-size: 10px;
|
||||||
|
color: #111;
|
||||||
|
margin-left: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.state{
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
width: 67px;
|
||||||
|
height: 23px;
|
||||||
|
border-radius: 0 17px 0 17px;
|
||||||
|
font-size: 10px;
|
||||||
|
line-height: 23px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.audit{
|
||||||
|
background-color: #CEF9F0;
|
||||||
|
color: #08AE98;
|
||||||
|
}
|
||||||
|
.fail{
|
||||||
|
background-color: #f9d6f6;
|
||||||
|
color: #D12C2E;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent } from 'vue';
|
||||||
|
|
||||||
|
export default defineComponent({
|
||||||
|
|
||||||
|
})
|
||||||
|
</script>
|
||||||
27
src/components/VideoPlay.vue
Normal file
27
src/components/VideoPlay.vue
Normal file
@ -0,0 +1,27 @@
|
|||||||
|
<template>
|
||||||
|
<div class="video">
|
||||||
|
<video src=""></video>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.video{
|
||||||
|
width: 976px;
|
||||||
|
height: 563px;
|
||||||
|
border-radius: 17px;
|
||||||
|
background-color: #0f0;
|
||||||
|
overflow: hidden;
|
||||||
|
>video{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent } from 'vue';
|
||||||
|
|
||||||
|
export default defineComponent({
|
||||||
|
setup(){
|
||||||
|
console.log(1)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
</script>
|
||||||
93
src/components/VideoReview.vue
Normal file
93
src/components/VideoReview.vue
Normal file
@ -0,0 +1,93 @@
|
|||||||
|
<template>
|
||||||
|
<div class="review">
|
||||||
|
<div class="top">
|
||||||
|
<div class="title">
|
||||||
|
该视频评价
|
||||||
|
<span>8.0分</span>
|
||||||
|
</div>
|
||||||
|
<div class="score">8.0分</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="list">
|
||||||
|
<ReviewItem></ReviewItem>
|
||||||
|
<ReviewItem></ReviewItem>
|
||||||
|
<ReviewItem></ReviewItem>
|
||||||
|
<ReviewItem></ReviewItem>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="reply">
|
||||||
|
<a-textarea v-model:value="value" placeholder="Basic usage" :rows="4" />
|
||||||
|
<div class="send">发表留言</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.review{
|
||||||
|
width: 1320px;
|
||||||
|
background-color: #fff;
|
||||||
|
padding: 0 28px 56px 28px;
|
||||||
|
border-radius: 17px;
|
||||||
|
.top{
|
||||||
|
padding: 28px 0 18px 0;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
border-bottom: 1px solid #ededed;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
.title{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 12px;
|
||||||
|
color: #111;
|
||||||
|
>span{
|
||||||
|
width: 56px;
|
||||||
|
height: 17px;
|
||||||
|
background-color: #F9D5D6;
|
||||||
|
border-radius: 2px;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 17px;
|
||||||
|
text-align: center;
|
||||||
|
margin-left: 6px;
|
||||||
|
color: #D12B2D;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.score{
|
||||||
|
font-size: 12px;
|
||||||
|
color: #D12B2D;
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.reply{
|
||||||
|
padding-top: 28px;
|
||||||
|
border-top: 1px solid #ededed;
|
||||||
|
&::v-deep .ant-input{
|
||||||
|
font-size: 11px;
|
||||||
|
}
|
||||||
|
.send{
|
||||||
|
width: 62px;
|
||||||
|
height: 22px;
|
||||||
|
margin-top: 30px;
|
||||||
|
background-color: #07AD97;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 22px;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 9px;
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent } from 'vue';
|
||||||
|
import ReviewItem from "./ReviewItem.vue"
|
||||||
|
|
||||||
|
export default defineComponent({
|
||||||
|
components:{
|
||||||
|
ReviewItem
|
||||||
|
},
|
||||||
|
serup(){
|
||||||
|
console.log(1)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
</script>
|
||||||
@ -16,7 +16,6 @@
|
|||||||
.body{
|
.body{
|
||||||
display: flex;
|
display: flex;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
min-width: 1366px;
|
|
||||||
height: calc(100% - 57px);
|
height: calc(100% - 57px);
|
||||||
.container{
|
.container{
|
||||||
width: calc(100% - 171px);
|
width: calc(100% - 171px);
|
||||||
|
|||||||
45
src/layout/Regime.vue
Normal file
45
src/layout/Regime.vue
Normal file
@ -0,0 +1,45 @@
|
|||||||
|
<template>
|
||||||
|
<div class="mine" :style="{height:height + 'px'}">
|
||||||
|
<NavTop style="flex-shrink:0"></NavTop>
|
||||||
|
<div class="body">
|
||||||
|
<router-view/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.mine{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
.body{
|
||||||
|
display: flex;
|
||||||
|
width: 100%;
|
||||||
|
height: calc(100% - 57px);
|
||||||
|
overflow: auto;
|
||||||
|
background-color: #F5F5F5;
|
||||||
|
padding: 23px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent, onMounted, ref } from 'vue';
|
||||||
|
import NavTop from "@/components/NavTop.vue"
|
||||||
|
|
||||||
|
export default defineComponent({
|
||||||
|
components:{
|
||||||
|
NavTop
|
||||||
|
},
|
||||||
|
setup(){
|
||||||
|
console.log(1)
|
||||||
|
const height = ref(0);
|
||||||
|
onMounted(() => {
|
||||||
|
height.value = document.documentElement.clientHeight;
|
||||||
|
})
|
||||||
|
window.onresize=function(){
|
||||||
|
height.value = document.documentElement.clientHeight;
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
height
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
</script>
|
||||||
@ -1,5 +1,4 @@
|
|||||||
import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router'
|
import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router'
|
||||||
import Home from '../views/Home.vue'
|
|
||||||
import Login from "../views/login/Login.vue"
|
import Login from "../views/login/Login.vue"
|
||||||
|
|
||||||
const routes: Array<RouteRecordRaw> = [
|
const routes: Array<RouteRecordRaw> = [
|
||||||
@ -25,6 +24,21 @@ const routes: Array<RouteRecordRaw> = [
|
|||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path:"/regime",
|
||||||
|
name:"Regime",
|
||||||
|
component: () => import("../layout/Regime.vue"),
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
path: "video",
|
||||||
|
component: () => import("../views/regime/Video.vue")
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: "videoinfo",
|
||||||
|
component: () => import("../views/regime/VideoInfo.vue")
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
{
|
{
|
||||||
path: '/',
|
path: '/',
|
||||||
name: 'Home',
|
name: 'Home',
|
||||||
|
|||||||
140
src/views/regime/Video.vue
Normal file
140
src/views/regime/Video.vue
Normal file
@ -0,0 +1,140 @@
|
|||||||
|
<template>
|
||||||
|
<div class="video">
|
||||||
|
<div class="nav">
|
||||||
|
<div class="tabs">
|
||||||
|
<div class="on">全部视频</div>
|
||||||
|
<div>审核中</div>
|
||||||
|
<div>未通过</div>
|
||||||
|
<div>已发布</div>
|
||||||
|
</div>
|
||||||
|
<div class="sel">
|
||||||
|
<img src="" alt="" class="icon">
|
||||||
|
<input type="text">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="list">
|
||||||
|
<VideoItem></VideoItem>
|
||||||
|
<VideoItem></VideoItem>
|
||||||
|
<VideoItem></VideoItem>
|
||||||
|
<VideoItem></VideoItem>
|
||||||
|
<VideoItem></VideoItem>
|
||||||
|
<VideoItem></VideoItem>
|
||||||
|
<VideoItem></VideoItem>
|
||||||
|
<VideoItem></VideoItem>
|
||||||
|
<VideoItem></VideoItem>
|
||||||
|
<VideoItem></VideoItem>
|
||||||
|
</div>
|
||||||
|
<div class="pages">
|
||||||
|
<a-pagination v-model:current="page" :total="500" :showLessItems="true" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.video{
|
||||||
|
width: 100%;
|
||||||
|
height: 706px;
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 17px;
|
||||||
|
padding: 40px;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
.nav{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
justify-content: space-between;
|
||||||
|
width: 100%;
|
||||||
|
.tabs{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #111;
|
||||||
|
padding: 11px 0;
|
||||||
|
>div{
|
||||||
|
margin-right: 58px;
|
||||||
|
}
|
||||||
|
.on{
|
||||||
|
color: #08AE98;
|
||||||
|
position: relative;
|
||||||
|
&::before{
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
bottom: -12px;
|
||||||
|
width: 57px;
|
||||||
|
height: 1px;
|
||||||
|
background-color: #08AE98;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
.sel{
|
||||||
|
width: 171px;
|
||||||
|
height: 26px;
|
||||||
|
border: 1px solid #999;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 8px;
|
||||||
|
border-radius: 4px;
|
||||||
|
>img{
|
||||||
|
width: 11px;
|
||||||
|
height: 11px;
|
||||||
|
|
||||||
|
}
|
||||||
|
>input{
|
||||||
|
width: 119px;
|
||||||
|
font-size: 9px;
|
||||||
|
line-height: 1;
|
||||||
|
margin-left: 6px;
|
||||||
|
border: none;
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.list{
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
width: 100%;
|
||||||
|
>div{
|
||||||
|
margin-top: 28px;
|
||||||
|
margin-left: 23px;
|
||||||
|
&:nth-child(1),&:nth-child(6){
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.pages{
|
||||||
|
position: absolute;
|
||||||
|
bottom: 114px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
&::v-deep .ant-pagination-next > .ant-pagination-item-link, &::v-deep .ant-pagination-prev > .ant-pagination-item-link, &::v-deep .ant-pagination-item, &::v-deep .ant-pagination-jump-next-custom-icon, &::v-deep .ant-pagination-jump-prev-custom-icon{
|
||||||
|
border: 1px solid #08AE98;
|
||||||
|
}
|
||||||
|
&::v-deep .ant-pagination-item-active a{
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
&::v-deep .ant-pagination-item-active{
|
||||||
|
background-color: #08AE98;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent, ref } from 'vue';
|
||||||
|
import VideoItem from "@/components/VideoItem.vue"
|
||||||
|
export default defineComponent({
|
||||||
|
components:{
|
||||||
|
VideoItem
|
||||||
|
},
|
||||||
|
setup(){
|
||||||
|
const page = ref(6);
|
||||||
|
return {
|
||||||
|
page
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
</script>
|
||||||
38
src/views/regime/VideoInfo.vue
Normal file
38
src/views/regime/VideoInfo.vue
Normal file
@ -0,0 +1,38 @@
|
|||||||
|
<template>
|
||||||
|
<div class="videoinfo">
|
||||||
|
<div class="info">
|
||||||
|
<VideoPlay></VideoPlay>
|
||||||
|
<VideoCont></VideoCont>
|
||||||
|
</div>
|
||||||
|
<VideoReview class="review"></VideoReview>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.videoinfo{
|
||||||
|
width: 1320px;
|
||||||
|
height: 563px;
|
||||||
|
.info{
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
.review{
|
||||||
|
margin-top: 28px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent } from 'vue';
|
||||||
|
import VideoPlay from "@/components/VideoPlay.vue"
|
||||||
|
import VideoCont from "@/components/VideoCont.vue"
|
||||||
|
import VideoReview from "@/components/VideoReview.vue"
|
||||||
|
export default defineComponent({
|
||||||
|
components:{
|
||||||
|
VideoPlay,
|
||||||
|
VideoCont,
|
||||||
|
VideoReview
|
||||||
|
},
|
||||||
|
setup(){
|
||||||
|
console.log(1)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
</script>
|
||||||
Loading…
Reference in New Issue
Block a user