|
|
@ -1,5 +1,6 @@ |
|
|
|
<template> |
|
|
|
<template> |
|
|
|
<div class="article-manager"> |
|
|
|
<div class="article-manager"> |
|
|
|
|
|
|
|
<div style="width: 100%; height:500px" id="chart"></div> |
|
|
|
<el-card :bordered="false" shadow="never" class="ivu-mt mt16" :body-style="{ padding: '0 20px 20px' }"> |
|
|
|
<el-card :bordered="false" shadow="never" class="ivu-mt mt16" :body-style="{ padding: '0 20px 20px' }"> |
|
|
|
<!-- <div > |
|
|
|
<!-- <div > |
|
|
|
<el-form :model="page" label-width="80px" label-position="right" inline @submit.native.prevent class="mt16"> |
|
|
|
<el-form :model="page" label-width="80px" label-position="right" inline @submit.native.prevent class="mt16"> |
|
|
@ -26,16 +27,8 @@ |
|
|
|
<el-button type="primary" class="bnt" @click="refresh()">刷新</el-button> |
|
|
|
<el-button type="primary" class="bnt" @click="refresh()">刷新</el-button> |
|
|
|
<el-button class="export" @click="exports">导出</el-button> |
|
|
|
<el-button class="export" @click="exports">导出</el-button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<el-table |
|
|
|
<el-table :data="tableList" class="ivu-mt mt14" v-loading="loading" highlight-current-row :row-key="getRowKey" |
|
|
|
:data="tableList" |
|
|
|
border @selection-change="handleSelectRow" empty-text="暂无数据"> |
|
|
|
class="ivu-mt mt14" |
|
|
|
|
|
|
|
v-loading="loading" |
|
|
|
|
|
|
|
highlight-current-row |
|
|
|
|
|
|
|
:row-key="getRowKey" |
|
|
|
|
|
|
|
border |
|
|
|
|
|
|
|
@selection-change="handleSelectRow" |
|
|
|
|
|
|
|
empty-text="暂无数据" |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
<el-table-column label="商品名称" align="center"> |
|
|
|
<el-table-column label="商品名称" align="center"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<span>{{ scope.row.searchInfo }}</span> |
|
|
|
<span>{{ scope.row.searchInfo }}</span> |
|
|
@ -76,15 +69,9 @@ |
|
|
|
</el-table-column> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
</el-table> |
|
|
|
<div class="acea-row row-right page"> |
|
|
|
<div class="acea-row row-right page"> |
|
|
|
<el-pagination |
|
|
|
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" |
|
|
|
@size-change="handleSizeChange" |
|
|
|
:current-page="page.currentPage" :page-sizes="[10, 15, 20, 30]" :page-size="page.pageSize" |
|
|
|
@current-change="handleCurrentChange" |
|
|
|
layout="total, sizes, prev, pager, next, jumper" :total="page.totalCount" /> |
|
|
|
:current-page="page.currentPage" |
|
|
|
|
|
|
|
:page-sizes="[10, 15, 20, 30]" |
|
|
|
|
|
|
|
:page-size="page.pageSize" |
|
|
|
|
|
|
|
layout="total, sizes, prev, pager, next, jumper" |
|
|
|
|
|
|
|
:total="page.totalCount" |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</el-card> |
|
|
|
</el-card> |
|
|
|
</div> |
|
|
|
</div> |
|
|
@ -92,7 +79,7 @@ |
|
|
|
|
|
|
|
|
|
|
|
<script> |
|
|
|
<script> |
|
|
|
import marketingApi from '@/api/finance/marketing.js' |
|
|
|
import marketingApi from '@/api/finance/marketing.js' |
|
|
|
|
|
|
|
import echarts from "echarts"; |
|
|
|
export default { |
|
|
|
export default { |
|
|
|
name: 'product_productList', |
|
|
|
name: 'product_productList', |
|
|
|
|
|
|
|
|
|
|
@ -130,15 +117,66 @@ export default { |
|
|
|
|
|
|
|
|
|
|
|
this.getList() |
|
|
|
this.getList() |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
mounted() { |
|
|
|
activated() {}, |
|
|
|
this.echartsInit() |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
activated() { }, |
|
|
|
methods: { |
|
|
|
methods: { |
|
|
|
|
|
|
|
echartsInit() { |
|
|
|
|
|
|
|
var myChart = echarts.init(document.getElementById('chart')); |
|
|
|
|
|
|
|
let option = { |
|
|
|
|
|
|
|
title: { |
|
|
|
|
|
|
|
text: '一级分类商品', |
|
|
|
|
|
|
|
// subtext: 'Fake Data', |
|
|
|
|
|
|
|
left: 'center' |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
tooltip: { |
|
|
|
|
|
|
|
trigger: 'item' |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
legend: { |
|
|
|
|
|
|
|
// orient: 'vertical', |
|
|
|
|
|
|
|
bottom: "20" |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
series: [ |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
type: 'pie', |
|
|
|
|
|
|
|
radius: '50%', |
|
|
|
|
|
|
|
center: ['25%', '50%'], |
|
|
|
|
|
|
|
data: [ |
|
|
|
|
|
|
|
{ value: 335, name: '彩妆' }, |
|
|
|
|
|
|
|
{ value: 310, name: '留学' }, |
|
|
|
|
|
|
|
{ value: 310, name: '派遣玉缘轩' }, |
|
|
|
|
|
|
|
{ value: 310, name: '法律服务' }, |
|
|
|
|
|
|
|
{ value: 310, name: '食品' } |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
] |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
type: 'pie', |
|
|
|
|
|
|
|
radius: '50%', |
|
|
|
|
|
|
|
center: ['75%', '50%'], |
|
|
|
|
|
|
|
data: [ |
|
|
|
|
|
|
|
{ value: 310, name: '餐饮' }, |
|
|
|
|
|
|
|
{ value: 310, name: '酒水汽车' }, |
|
|
|
|
|
|
|
{ value: 310, name: '厨具家电男装' }, |
|
|
|
|
|
|
|
{ value: 310, name: '口腔护理洗护' }, |
|
|
|
|
|
|
|
{ value: 310, name: '学习' } |
|
|
|
|
|
|
|
] |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
] |
|
|
|
|
|
|
|
}; |
|
|
|
|
|
|
|
myChart.setOption(option); |
|
|
|
|
|
|
|
//动态修改图大小 |
|
|
|
|
|
|
|
window.onresize = function () { |
|
|
|
|
|
|
|
myChart.resize(); |
|
|
|
|
|
|
|
}; |
|
|
|
|
|
|
|
}, |
|
|
|
closeLabel(label) { |
|
|
|
closeLabel(label) { |
|
|
|
let index = this.dataLabel.indexOf(this.dataLabel.filter(d => d.id == label.id)[0]) |
|
|
|
let index = this.dataLabel.indexOf(this.dataLabel.filter(d => d.id == label.id)[0]) |
|
|
|
this.dataLabel.splice(index, 1) |
|
|
|
this.dataLabel.splice(index, 1) |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
getPath() {}, |
|
|
|
getPath() { }, |
|
|
|
// 导出 |
|
|
|
// 导出 |
|
|
|
async exports() { |
|
|
|
async exports() { |
|
|
|
let [th, filekey, data, fileName] = [[], [], [], ''] |
|
|
|
let [th, filekey, data, fileName] = [[], [], [], ''] |
|
|
@ -162,7 +200,7 @@ export default { |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
getExcelData(excelData) {}, |
|
|
|
getExcelData(excelData) { }, |
|
|
|
|
|
|
|
|
|
|
|
getRowKey(row) { |
|
|
|
getRowKey(row) { |
|
|
|
return row.id |
|
|
|
return row.id |
|
|
@ -203,7 +241,7 @@ export default { |
|
|
|
this.getList() |
|
|
|
this.getList() |
|
|
|
}, |
|
|
|
}, |
|
|
|
// 数据导出; |
|
|
|
// 数据导出; |
|
|
|
exportData: function() {}, |
|
|
|
exportData: function () { }, |
|
|
|
|
|
|
|
|
|
|
|
// 详情 |
|
|
|
// 详情 |
|
|
|
detail(row) { |
|
|
|
detail(row) { |
|
|
@ -232,6 +270,7 @@ export default { |
|
|
|
height: 54px !important; |
|
|
|
height: 54px !important; |
|
|
|
line-height: 54px !important; |
|
|
|
line-height: 54px !important; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
::v-deep .ivu-modal-mask { |
|
|
|
::v-deep .ivu-modal-mask { |
|
|
|
z-index: 999 !important; |
|
|
|
z-index: 999 !important; |
|
|
|
} |
|
|
|
} |
|
|
@ -321,19 +360,23 @@ export default { |
|
|
|
font-size: 12px; |
|
|
|
font-size: 12px; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.el-dropdown-link { |
|
|
|
.el-dropdown-link { |
|
|
|
cursor: pointer; |
|
|
|
cursor: pointer; |
|
|
|
color: var(--prev-color-primary); |
|
|
|
color: var(--prev-color-primary); |
|
|
|
font-size: 12px; |
|
|
|
font-size: 12px; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.el-icon-arrow-down { |
|
|
|
.el-icon-arrow-down { |
|
|
|
font-size: 12px; |
|
|
|
font-size: 12px; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.el-dropdown-menu__item { |
|
|
|
.el-dropdown-menu__item { |
|
|
|
a { |
|
|
|
a { |
|
|
|
color: #606266; |
|
|
|
color: #606266; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.label_width { |
|
|
|
.label_width { |
|
|
|
width: 400px; |
|
|
|
width: 400px; |
|
|
|
} |
|
|
|
} |
|
|
|