Skip to content

I
intel_promotion_manage
Commit c6ac05d4 authored by 张伯涛's avatar 张伯涛
Browse files
Options

首页顶部样式修改

parent a0c06a88
Hide whitespace changes
Inline Side-by-side
Showing with 103 additions and 72 deletions
src/router/index.js
View file @ c6ac05d4
......@@ -94,7 +94,7 @@ export const constantRoutes = [
path: 'dashboard',
name: 'dashboard',
component: () => import('@/views/dashboard/index/index'),
meta: { title: '首页', icon: 'dashboard', affix: true }
meta: { title: '首页', icon: 'druid', affix: true }
}]
},
{
......
src/views/dashboard/index/index.vue
View file @ c6ac05d4
<template>
<div class="dashboard-container" id="dashboard">
<div id="dashboard" class="dashboard-container">
<div class="dashboard-text">
{{companyName}}运营报表
<el-select v-model="company" :disabled="!queryShop" filterable @change="changeCompany" placeholder="请选择所属商家">
<el-option
v-for="(item,index) in deptList"
:key="index"
:label="item.unitName"
:value="item.businessId"
/>
</el-select>
<div>运营报表</div>
<div class="titleBottom">
<div class="titleBottom_companyName">--{{ companyName }}</div>
<el-select v-model="company" :disabled="!queryShop" filterable placeholder="请选择所属商家" @change="changeCompany">
<el-option
v-for="(item,index) in deptList"
:key="index"
:label="item.unitName"
:value="item.businessId"
/>
</el-select>
</div>
</div>
<el-row :gutter="20">
<el-col :span="8">
<el-card class="box-card">
<el-col :span="24" >
<el-col :span="24">
<div class="card-panel-num">代言人</div>
</el-col>
<el-col :span="12" >
<div class="card-panel-text">绑定人数</div>
<div class="card-panel-num">
{{agentNum}}人
<div class="card_content">
<div>
<div class="card-panel-text">绑定人数</div>
<div class="card-panel-num">
{{ agentNum }}人
</div>
</div>
</el-col>
<el-col :span="12">
<!-- <svg-icon icon-class="form" ></svg-icon>-->
<el-image :src="require('@/icons/image/leijiyonghu@2x.png')" class="topimage"></el-image>
</el-col>
<div>
<!-- <svg-icon icon-class="form" ></svg-icon>-->
<el-image :src="require('@/icons/image/leijiyonghu@2x.png')" class="topimage" />
</div>
</div>
</el-card>
</el-col>
<el-col :span="8">
<el-card class="box-card">
<el-col :span="24" >
<el-col :span="24">
<div class="card-panel-num">视频</div>
</el-col>
<el-col :span="12" >
<div class="card-panel-text">视频总数量</div>
<div class="card-panel-num">
{{videoNum}}个
<div class="card_content">
<div>
<div class="card-panel-text">视频总数量</div>
<div class="card-panel-num">
{{ videoNum }}个
</div>
</div>
</el-col>
<el-col :span="12" >
<div class="card-panel-text">视频推广次数</div>
<div class="card-panel-num">
{{videoViews}}次
<div>
<div class="card-panel-text">视频推广次数</div>
<div class="card-panel-num">
{{ videoViews }}次
</div>
</div>
</el-col>
</div>
</el-card>
</el-col>
<el-col :span="8">
<el-card class="box-card">
<el-col :span="24" >
<el-col :span="24">
<div class="card-panel-num">文章</div>
</el-col>
<el-col :span="12" >
<div class="card-panel-text">总数量</div>
<div class="card-panel-num">
{{articleNum}}篇
<div class="card_content">
<div>
<div class="card-panel-text">总数量</div>
<div class="card-panel-num">
{{ articleNum }}篇
</div>
</div>
</el-col>
<el-col :span="12" >
<div class="card-panel-text">推广次数</div>
<div class="card-panel-num">
{{articleViews}}次
<div>
<div class="card-panel-text">推广次数</div>
<div class="card-panel-num">
{{ articleViews }}次
</div>
</div>
</el-col>
</div>
</el-card>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<v-chart :options="barData" class="chart section" ref="barChart"/>
<!-- <v-chart :options="lineData" ref="lineChart"/>-->
<v-chart ref="barChart" :options="barData" class="chart section" />
<!-- <v-chart :options="lineData" ref="lineChart"/>-->
</el-col>
</el-row>
<el-row :gutter="20" >
<el-row :gutter="20">
<el-col :span="12">
<!-- <v-chart :options="redarData" class="chart section" ref="radarChart"/>-->
<v-chart :options="pieData" class="chart section" ref="pieChart"/>
<!-- <v-chart :options="redarData" class="chart section" ref="radarChart"/>-->
<v-chart ref="pieChart" :options="pieData" class="chart section" />
</el-col>
<el-col :span="12">
<v-chart :options="barData" class="chart section" ref="barChart"/>
<v-chart ref="barChart" :options="barData" class="chart section" />
</el-col>
</el-row>
<!-- <el-row :gutter="20" >-->
<!-- <el-col :span="12">-->
<!-- <v-chart :options="pieData" class="chart section" ref="pieChart"/>-->
<!-- </el-col>-->
<!-- <el-col :span="12">-->
<!-- <el-table :data="tableData" class="section">-->
<!-- <el-table-column-->
<!-- prop="date"-->
<!-- :label="'日期'"-->
<!-- width="180">-->
<!-- </el-table-column>-->
<!-- <el-table-column-->
<!-- prop="name"-->
<!-- :label="'姓名'"-->
<!-- width="180">-->
<!-- </el-table-column>-->
<!-- <el-table-column-->
<!-- prop="address"-->
<!-- :label="'地址'">-->
<!-- </el-table-column>-->
<!-- </el-table>-->
<!-- <el-row :gutter="20" >-->
<!-- <el-col :span="12">-->
<!-- <v-chart :options="pieData" class="chart section" ref="pieChart"/>-->
<!-- </el-col>-->
<!-- <el-col :span="12">-->
<!-- <el-table :data="tableData" class="section">-->
<!-- <el-table-column-->
<!-- prop="date"-->
<!-- :label="'日期'"-->
<!-- width="180">-->
<!-- </el-table-column>-->
<!-- <el-table-column-->
<!-- prop="name"-->
<!-- :label="'姓名'"-->
<!-- width="180">-->
<!-- </el-table-column>-->
<!-- <el-table-column-->
<!-- prop="address"-->
<!-- :label="'地址'">-->
<!-- </el-table-column>-->
<!-- </el-table>-->
<!-- </el-col>-->
<!-- </el-col>-->
<!-- </el-row>-->
<!-- </el-row>-->
</div>
</template>
<script src="./dashboard.js"></script>
<style rel="stylesheet/scss" lang="scss" scoped>
.titleBottom{
padding-top: 20px;
display: flex;
align-items: center;
justify-content: center;
margin-left: 450px;
.titleBottom_companyName{
padding-right: 20px;
}
}
.el-row{
margin-bottom: 20px;
&:last-child {
......@@ -143,7 +162,18 @@
height: 100%;
}
.box-card{
padding: 10px;
height:126px;
::v-deep .el-card__body{
padding: 0!important;
}
.card_content{
width: 100%;
padding: 0 70px;
display: flex;
align-items: center;
justify-content: space-between;
}
}
.chart{
height: 240px;
......@@ -166,6 +196,7 @@
color:gray;
}
.card-panel-num{
text-align: center;
padding-top:10px;
font-size:20px;
font-weight: bold;
......
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