tend.vue 2.04 KB
Newer Older
xulili's avatar
xulili committed
1 2 3 4
/* 点播趋势图 */
<template>
<div class="trend-wrapper  height100 overview-detail">
    <div class="ecahrts-panel-box">
xulili's avatar
xulili committed
5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21
        <div class="panel-box-header">
            <span class="title">趋势图</span>
             <el-date-picker
                v-model="value1"
                type="daterange"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
          ></el-date-picker>
            <div class="tip">
                <span class="tip-title">页面说明:</span>
                <span>默认展示当月点播总量趋势图及详情表格,可按照时间段进行检索,图表可以联动变化。</span>
            </div>
        </div>
        <div class="panel-box-content">
            <trend-line/>
        </div>
xulili's avatar
xulili committed
22 23
    </div>
    <div class="rank-panel-box">
xulili's avatar
xulili committed
24 25 26 27 28 29 30 31 32
         <div class="panel-box-header">
              <span class="title">点播趋势排行</span>
         </div>
         <div class="panel-box-content">
             <rank-table 
             :tList="tList"
             :data="data"   
             />
         </div>  
xulili's avatar
xulili committed
33 34 35 36
    </div>
</div>
</template>
<script>
xulili's avatar
xulili committed
37
import {trendLine, rankTable} from './components'
xulili's avatar
xulili committed
38 39 40
export default {
    data(){
        return {
xulili's avatar
xulili committed
41 42 43 44 45 46 47 48 49 50 51 52 53 54
            value1:'',
            tList:['排名','统计时间','点播总量'],
            data:[
                {index:1,time:'2021年1月',num:'268'},
                {index:2,time:'2021年1月',num:'268'},
                {index:3,time:'2021年1月',num:'268'},
                {index:4,time:'2021年1月',num:'268'},
                {index:5,time:'2021年1月',num:'268'},
                {index:6,time:'2021年1月',num:'268'},
                {index:7,time:'2021年1月',num:'268'},
                {index:8,time:'2021年1月',num:'268'},
                {index:9,time:'2021年1月',num:'268'},
                {index:10,time:'2021年1月',num:'268'}
            ]
xulili's avatar
xulili committed
55 56
        }
    },
xulili's avatar
xulili committed
57
    components:{trendLine, rankTable},
xulili's avatar
xulili committed
58 59 60 61 62 63 64
    methods:{
        
    }
}
</script>

<style lang="less" scoped>
xulili's avatar
xulili committed
65

xulili's avatar
xulili committed
66
</style>