Commit e9f38b07 by shaojiawen

update: 接口

parent fd554451
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1658109499599" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4660" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
</style></defs><path d="M882.688 680.448l-164.864-202.752c-7.68-9.728-19.456-15.36-31.744-15.36H332.288c-12.288 0-24.064 5.632-31.744 15.36l-164.864 202.752v105.984h746.496v-105.984h0.512z" fill="#2F54EB" p-id="4661"></path><path d="M332.288 459.264H686.08c13.312 0 25.6 6.144 34.304 16.384l165.376 203.776v110.08H132.608v-110.08L297.984 476.16l2.56 2.048m31.744-12.288c-11.264 0-22.016 5.12-29.184 14.336l-163.84 201.728V783.36h739.84v-101.376l-163.84-201.728c-7.168-8.704-17.92-13.824-29.184-14.336H332.288z" fill="#2B2E36" p-id="4662"></path><path d="M245.76 229.376c0-13.824 10.752-24.576 24.576-24.576h475.136c13.824 0 24.576 10.752 24.576 24.576v647.168c0 13.824-10.752 24.576-24.576 24.576H270.336c-13.824 0-24.576-10.752-24.576-24.576V229.376z" fill="#FFFFFF" p-id="4663"></path><path d="M242.688 229.376c0-15.36 12.288-27.648 27.648-27.648h475.136c15.36 0 27.648 12.288 27.648 27.648v647.168c0 15.36-12.288 27.648-27.648 27.648H270.336c-15.36 0-27.648-12.288-27.648-27.648V229.376z m27.648-21.504c-11.776 0-21.504 9.728-21.504 21.504v647.168c0 11.776 9.728 21.504 21.504 21.504h475.136c11.776 0 21.504-9.728 21.504-21.504V229.376c0-11.776-9.728-21.504-21.504-21.504H270.336z" fill="#2B2E36" p-id="4664"></path><path d="M681.984 269.824H336.384c-7.68 0-13.824 6.144-13.824 13.824v171.52c0 7.68 6.144 13.824 13.824 13.824h345.6c7.68 0 13.824-6.144 13.824-13.824V283.136c0-7.168-6.144-13.312-13.824-13.312z" fill="#E8ECFD" p-id="4665"></path><path d="M336.384 272.896c-5.632 0-10.24 4.608-10.24 10.24v171.52c0 5.632 4.608 10.24 10.24 10.24h345.6c5.632 0 10.24-4.608 10.24-10.24V283.136c0-5.632-4.608-10.24-10.24-10.24H336.384z m-12.288-1.536c3.072-3.072 7.68-5.12 12.288-5.12h345.6c9.216 0 16.896 7.68 16.896 16.896v172.032c0 9.216-7.68 16.896-16.896 16.896H336.384c-9.216 0-16.896-7.68-16.896-16.896V283.136c-0.512-4.096 1.536-8.704 4.608-11.776z" fill="#2B2E36" p-id="4666"></path><path d="M881.152 924.16c-5.12 21.504-24.064 36.864-46.592 36.864H183.808c-22.016 0-40.96-15.36-46.592-36.864-1.024-4.096-1.536-8.192-1.536-12.288V680.96h181.248c20.48 0.512 36.352 16.896 36.352 37.376v0.512c0 20.48 15.872 36.864 36.352 36.864h239.616c20.48 0 36.352-16.896 36.352-36.864-0.512-20.48 15.872-36.864 36.352-37.376h181.248v230.912c-0.512 3.584-1.024 7.68-2.048 11.776z" fill="#FFFFFF" p-id="4667"></path><path d="M132.608 677.376h184.32c22.016 0.512 39.424 18.432 39.424 40.448v0.512c0 18.432 14.848 33.28 33.28 33.792h239.616c18.432 0 33.28-15.36 33.28-33.792-0.512-22.016 17.408-40.448 39.424-40.448h184.32v234.496c0 4.608-0.512 8.704-1.536 13.312-5.632 23.04-26.112 38.912-49.664 39.424H183.808c-23.552-0.512-44.032-16.384-49.664-39.424-1.024-4.096-1.536-8.704-1.536-13.312v-235.008z m744.96 245.76c1.024-3.584 1.536-7.68 1.536-11.776v-227.84H701.44c-18.432 0.512-33.28 15.36-32.768 33.792 0 22.016-17.408 39.936-39.424 40.448H389.12c-22.016 0-39.936-18.432-39.424-40.448v-0.512c0.512-18.432-14.336-33.792-32.768-33.792H139.264v227.84c0 4.096 0.512 7.68 1.536 11.776 4.608 19.968 22.528 34.304 43.008 34.304H834.56c20.48 0.512 38.4-13.824 43.008-33.792z" fill="#2B2E36" p-id="4668"></path><path d="M680.448 543.744H337.92c-8.704 0-15.36 7.168-15.36 15.36 0 8.704 7.168 15.36 15.36 15.36h342.016c8.704 0 15.36-7.168 15.36-15.36 0.512-8.704-6.656-15.36-14.848-15.36z m0 80.896H337.92c-8.704 0-15.36 7.168-15.36 15.872 0 8.192 6.656 14.848 15.36 15.36h342.016c8.704 0 15.36-7.168 15.36-15.36s-6.656-15.872-14.848-15.872z" fill="#D1D9FC" p-id="4669"></path><path d="M860.672 107.52l18.944 18.944-67.072 67.072-18.944-18.944L860.672 107.52z m-162.816-52.224h26.624v95.232h-26.624V55.296z m133.12 202.24h95.232v26.624h-95.232v-26.624z" fill="#2F54EB" p-id="4670"></path></svg>
\ No newline at end of file
......@@ -37,7 +37,7 @@
</div>
</div>
</div>
<div class="fixed-tab" v-if="scrollTop > 300">
<div class="fixed-tab" v-if="scrollTop >= fixedHeight">
<el-tabs v-model="activeName" type="card">
<el-tab-pane label="详情信息" name="first"> <div></div> </el-tab-pane>
<el-tab-pane label="数据统计" name="second">
......@@ -72,6 +72,7 @@ export default {
},
data() {
return {
fixedHeight: 280,
codeInfo: {},
loading: false,
activeName: 'first',
......@@ -143,6 +144,7 @@ export default {
if (resData.code == 0) {
that.statusIndex = resData.result.statusFlag == 1 && resData.result.overFlag == 1 ? 4 : resData.result.statusFlag;
that.codeInfo = resData.result;
that.fixedHeight = that.codeInfo.statusFlag != 2 ? 280 : 237;
return;
}
errMsg.errorMsg(resData);
......@@ -157,6 +159,7 @@ export default {
scrollMethod: _throttle(function() {
// 节流会不自然 左右不滑动
this.scrollTop = document.getElementById('hb-layout-pager-one').scrollTop;
console.log(this.scrollTop);
}, 100)
},
mounted() {
......
......@@ -8,7 +8,7 @@
</div>
<div class="flex">
<i class="iconfont-hb3 iconzhibiaoshuoming color-1890ff"></i>
<div class="color-1890ff font-14 p-l-6" @click="explain('http://baidu.com')">指标说明</div>
<div class="color-1890ff font-14 p-l-6" @click="explain('https://www.yuque.com/exnmlu/oo64hg/thm172#OoBcf')">指标说明</div>
</div>
</div>
<ul class="flex">
......@@ -53,7 +53,7 @@
</div>
<div class="flex">
<i class="iconfont-hb3 iconzhibiaoshuoming color-1890ff"></i>
<div class="color-1890ff font-14 p-l-6" @click="explain('http://baidu.com')">指标说明</div>
<div class="color-1890ff font-14 p-l-6" @click="explain('https://www.yuque.com/exnmlu/oo64hg/thm172#OoBcf')">指标说明</div>
</div>
</div>
<data-detail :id="hmId"></data-detail>
......@@ -81,7 +81,32 @@ export default {
data() {
return {
loading: false,
// dateList: [],
dateList: [
// { bizDate: '2018/8/1', 新增人数: 4623 }
// { bizDate: '2018/8/2', 新增人数: 6145 },
// { bizDate: '2018/8/3', 新增人数: 508 },
// { bizDate: '2018/8/4', 新增人数: 289 },
// { bizDate: '2018/8/5', 新增人数: 289 },
// { bizDate: '2018/8/6', 新增人数: 289 },
// { bizDate: '2018/8/7', 新增人数: 289 },
// { bizDate: '2018/8/8', 新增人数: 289 },
// { bizDate: '2018/8/9', 新增人数: 289 },
// { bizDate: '2018/8/10', 新增人数: 289 },
// { bizDate: '2018/8/11', 新增人数: 289 },
// { bizDate: '2018/8/12', 新增人数: 289 },
// { bizDate: '2018/8/13', 新增人数: 2589 },
// { bizDate: '2018/8/14', 新增人数: 289 },
// { bizDate: '2018/8/15', 新增人数: 289 },
// { bizDate: '2018/8/16', 新增人数: 29 },
// { bizDate: '2018/8/17', 新增人数: 289 },
// { bizDate: '2018/8/18', 新增人数: 9 },
// { bizDate: '2018/8/19', 新增人数: 2189 },
// { bizDate: '2018/8/20', 新增人数: 289 },
// { bizDate: '2018/8/21', 新增人数: 2869 },
// { bizDate: '2018/8/22', 新增人数: 289 },
// { bizDate: '2018/8/23', 新增人数: 2809 }
],
overViewData: { addNumT: 0, addNum: 0, dateList: [] }
};
},
......@@ -105,39 +130,6 @@ export default {
let resData = res.data;
that.loading = false;
if (resData.code == 0) {
// let resData = {
// result: {
// addNumT: 20,
// addNum: 10,
// dateList: [
// { bizDate: '2018/8/1', addNum: 4623 },
// { bizDate: '2018/8/2', addNum: 6145 },
// { bizDate: '2018/8/3', addNum: 508 },
// { bizDate: '2018/8/4', addNum: 289 },
// { bizDate: '2018/8/5', addNum: 289 },
// { bizDate: '2018/8/6', addNum: 289 },
// { bizDate: '2018/8/7', addNum: 289 },
// { bizDate: '2018/8/8', addNum: 289 },
// { bizDate: '2018/8/9', addNum: 289 },
// { bizDate: '2018/8/10', addNum: 289 },
// { bizDate: '2018/8/11', addNum: 289 },
// { bizDate: '2018/8/12', addNum: 289 },
// { bizDate: '2018/8/13', addNum: 2589 },
// { bizDate: '2018/8/14', addNum: 289 },
// { bizDate: '2018/8/15', addNum: 289 },
// { bizDate: '2018/8/16', addNum: 29 },
// { bizDate: '2018/8/17', addNum: 289 },
// { bizDate: '2018/8/18', addNum: 9 },
// { bizDate: '2018/8/19', addNum: 2189 },
// { bizDate: '2018/8/20', addNum: 289 },
// { bizDate: '2018/8/21', addNum: 2869 },
// { bizDate: '2018/8/22', addNum: 289 },
// { bizDate: '2018/8/23', addNum: 2809 }
// ]
// }
// };
((resData.result || {}).dateList || []).map(function(date) {
date['新增人数'] = date.addNum;
});
......
<template>
<div :id="id"></div>
<!-- <div v-if="charData.length" :id="id"></div> -->
<!-- <div v-else class="chart--nodata"></div> -->
<div>
<div :id="id"></div>
<div v-if="!charData.length" class="chart--nodata">
<div>
<img class="image-120" src="@/assets/no-data.svg" />
<p class="font-14 color-606266 no-data-text">暂无数据</p>
</div>
</div>
</div>
<!-- <div :id="id"></div> -->
<!-- <div v-if="!charData.length" class="chart--nodata">
<div>
<img class="image-120" src="@/assets/no-data.svg" />
<p class="font-14 color-606266 no-data-text">暂无数据</p>
</div>
</div> -->
</template>
<script>
// import G2 from '@antv/g2';
import * as G2 from '@antv/g2';
export default {
components: {},
data() {
return {
chart: null
......@@ -17,7 +31,7 @@ export default {
charData: {
type: Array,
default() {
return [];
return []; //{ bizDate: '2018/8/1', 新增人数: 4623 }
}
},
id: String,
......@@ -42,6 +56,7 @@ export default {
methods: {
async drawChart() {
this.chart && this.chart.destroy();
if (!this.charData.length) return;
this.chart = new G2.Chart({
container: this.id,
height: 359,
......@@ -50,14 +65,10 @@ export default {
padding: [20, 40, 80, 80]
});
//装载数据
// { date: '2018/8/1', 新增人数: 4623 },
// { date: '2018/8/2', 新增人数: 6145 },
// { date: '2018/8/3', 新增人数: 508 },
// { date: '2018/8/4', 新增人数: 289 }
// this.chart.data(this.charData); // 载入数据源
this.chart.data(this.charData, {
bizDate: {
// type: 'cat', //分类
alias: '日期' //别名
},
新增人数: {
......@@ -110,11 +121,17 @@ export default {
position: 'top-left',
items: [{ name: '新增人数', value: '新增人数', marker: { symbol: 'line', style: { stroke: '#4B74E8', lineWidth: 12, lineHeight: 8 } } }]
});
this.chart
.line()
.position('bizDate*新增人数')
.color('#4B74E8');
if (this.charData.length > 1) {
this.chart
.line()
.position('bizDate*新增人数')
.color('#4B74E8');
} else {
this.chart
.point()
.position('bizDate*新增人数')
.color('#4B74E8');
}
this.chart.removeInteraction('legend-filter'); // 自定义图例,移除默认的分类图例筛选交互
//图表绘制的最后一步,用于将图表渲染至画布
......@@ -123,3 +140,20 @@ export default {
}
};
</script>
<style lang="scss" scoped>
.chart--nodata {
height: 256px;
width: 100%;
display: flex;
justify-content: center;
.image-120 {
width: 120px;
height: 120px;
padding-top: 60px;
}
.no-data-text {
text-align: center;
padding-top: 18px;
}
}
</style>
......@@ -39,14 +39,14 @@
<el-table ref="useMemberTableRef" v-loading="loading" :data="useMemberData" tooltip-effect="dark">
<el-table-column prop="" label="导购信息" show-overflow-tooltip min-width="185px">
<template slot-scope="scope">
<p class="line-20 text-ellipsis">{{ scope.row.clerkName }}</p>
<p class="color-606266 line-18 text-ellipsis font-12">{{ scope.row.clerkCode }}</p>
<p class="line-20 text-ellipsis">{{ scope.row.clerkName || '--' }}</p>
<p class="color-606266 line-18 text-ellipsis font-12">{{ scope.row.clerkCode || '--' }}</p>
</template>
</el-table-column>
<el-table-column prop="" label="导购所属门店" show-overflow-tooltip min-width="185px">
<template slot-scope="scope">
<p class="line-20 text-ellipsis">{{ scope.row.storeName }}</p>
<p class="color-606266 line-18 text-ellipsis font-12">{{ scope.row.storeCode }}</p>
<p class="line-20 text-ellipsis">{{ scope.row.storeName || '--' }}</p>
<p class="color-606266 line-18 text-ellipsis font-12">{{ scope.row.storeCode || '--' }}</p>
</template>
</el-table-column>
<el-table-column prop="" label="企微号" show-overflow-tooltip min-width="185px">
......
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