专题静态

This commit is contained in:
老叶
2021-10-12 13:54:03 +08:00
parent 7c6a144f6a
commit a59972df1b
9 changed files with 363 additions and 178 deletions
+2 -2
View File
@@ -1,12 +1,12 @@
<!-- components/poster/index.wxml -->
<view class="poster fixed {{isShow?'show':'hide'}}">
<view class="poster-bg absolute top-0 bottom-0 left-0 right-0" bindtap="hidePoster"></view>
<view class="poster-main absolute top-0 bottom-0 left-0 right-0" catchtap="hidePoster">
<view class="poster-main absolute top-0 bottom-0 left-0 right-0">
<view class="poster-main-img absolute box-center-middle">
<canvas canvas-id='postercanvas' class='canvas absolute box-center-middle' style="width:{{canvasInfo.width}};height:{{canvasInfo.height}}"></canvas>
<view wx:if="{{showOptBtn}}"><image class="block wp100 ulib-r10" wx:if="{{tempPosterPath}}" src="{{tempPosterPath}}" mode="widthFix" catchtap="preview" /></view>
<view class="mt40 fn-flex" wx:if="{{showOptBtn}}">
<button class="fn-flex-item bds-2-fff btn-no-bg font-32 color-fff ulib-r750 text-center ml20 mr20" bindtap="pushLink" data-url="/pages/distribute/special/index?iscall=0">专题预览</button>
<button class="fn-flex-item bds-2-fff btn-no-bg font-32 color-fff ulib-r750 text-center ml20 mr20" catchtap="pushLink" data-url="/pages/distribute/special/index?iscall=0">专题预览</button>
<button class=" fn-flex-item btn-f9394d font-32 color-fff ulib-r750 text-center ml20 mr20" hover-class="btn-f9394d-hover" catchtap="saveToAblum">保存分享</button>
</view>
</view>
+1
View File
@@ -1,4 +1,5 @@
{
"navigationBarTitleText": "数据分析",
"enablePullDownRefresh": true,
"navigationBarTextStyle": "white",
"navigationBarBackgroundColor": "#1a1c26",
+47 -16
View File
@@ -1,21 +1,52 @@
<view class="fixed top-0 left-0 bottom-0 bg-f8 con-160 z-index-0" style='overflow-y:auto'>
<view class="bg-fff">
<block wx:for='{{cate_list}}' wx:for-item='item' wx:key='index'>
<view class="relative topicSort pt35 pb35 pl15 pr15 font-24 {{cateIndex == index?'active bg-fff':'bg-f8 color-666'}} {{cateIndex == index-1?'ulib-rtr20':''}} {{cateIndex == index+1?'ulib-rbr20':''}}" bindtap='choosingCate' data-index='{{index}}'>
<view class="text-nowrap line-height-90">{{item.name}}</view>
</view>
</block>
</view>
</view>
<view class="ml160">
<view class="fn-clear">
<block wx:for='{{list}}' wx:for-item='item' wx:key='index'>
<image bindtap="showPoster" data-index="{{index}}" class='block fn-fl mt30 ml30 img-250x445 box-shadow-000-3-5' lazy-load="{{true}}" mode="aspectFit" src="{{item.img}}"></image>
</block>
<view class="container img-top-cover pt30" style="background-image:url({{imgUrl}}distribute/zc-bg.jpg);">
<view class="relative pl30 pr30 color-fff">
<view class="pt30 pb60 text-center color-fff">
<view class="font-44">分享素材,获得属于你的专属客户</view>
<view class="mt10 font-28">所有报名用户都会直接进入你的客户</view>
</view>
</view>
<lcb-listmore isLoading='{{loading}}' isEnd='{{end&&list.length>6}}' isNoData='{{noData}}'></lcb-listmore>
<view class="bg-fff ml30 mr30 pt60 pb50 pl60 pr60 box-shadow-000-10-10 ulib-r10 fn-flex fn-flex-between text-center font-28">
<view bindtap="pushLink" data-url="/pages/distribute/material/index">
<image class='text-middle img-50x50' lazy-load="{{true}}" mode="aspectFill" src="{{imgUrl}}distribute/icon-sucai.png"></image>
<text class="ml15 text-middle">推广素材</text>
</view>
<view bindtap="pushLink" data-url="/pages/distribute/statistics/index">
<image class='text-middle img-50x50' lazy-load="{{true}}" mode="aspectFill" src="{{imgUrl}}distribute/icon-shuju.png"></image>
<text class="ml15 text-middle">推广数据</text>
</view>
</view>
<view class="mt30 inner40" bindtap="pushLink" data-url="lcb://navigateToMiniPrograms??appId=wx98e64c11aac45966@path=/pages/storeInfo/index">
<button class="btn-f9394d font-32 color-fff ulib-r750 text-center ml35 mr35 pt10 pb10">分享店铺</button>
</view>
<view class="fixed pb100 left-0 right-0 bottom-0 text-center">
<view class="inline-block bg-f8 pt10 pb10 pl40 pr40 font-28 color-999 ulib-r750" bindtap="optShowKefu">
<i class="iconfont icon-kefu"></i>
联系小狸
</view>
</view>
</view>
<!-- <lcb-footer></lcb-footer> -->
<lcb-backChannel></lcb-backChannel>
<distributePoster isShow="{{poster.isShow}}" customImg="{{poster.customPoster}}" isCreateQrcode="{{poster.isCreateQrcode}}" qccodeid="{{poster.qrcodeid}}" slogan="{{poster.slogan}}"></distributePoster>
<lcb-msg isShow="{{isShowKefu}}" button="false" isHasClose="down">
<view slot="content">
<view class="coms-dialog-kf">
<view class="pic-top"></view>
<view class="tit">
<text>添加客服微信号</text>
</view>
<view class="font-26 color-999 text-center mt15">分销问题,下单问题都可以加我哦</view>
<view class="relative">
<button class="btn-concat">去添加</button>
<view class="absolute left-0 top-0 right-0 bottom-0 opacity-0 text-center overflowhidden">
<QYWXcontact buttonText="{{4}}" class="pt40 pb40" bind:completemessage="completemessage" styleType='3' plugid='877ffe64ccc36a5f308252eadc3066df' />
<QYWXcontact buttonText="{{4}}" class="pt40 pb40" bind:completemessage="completemessage" styleType='3' plugid='877ffe64ccc36a5f308252eadc3066df' />
</view>
</view>
</view>
</view>
</lcb-msg>
+54 -6
View File
@@ -13,12 +13,12 @@ Page({
flag: 1,
poster: {
isShow: false,
status:0,
isCreateQrcode: false,
qrcodeid:'',
customPoster: '',
slogan:'',
},
showPoster:false,
},
onLoad: function (options) {
for (let key in options) {
@@ -142,16 +142,44 @@ Page({
//生成海报
showPoster(e){
let index = e.currentTarget.dataset.index
let that = this
if(that.data.list[index].status == 0){
that.setData({
showPoster:true,
currentIndex:index,
})
}else{
wx.showLoading({
title: '正在生成中...',
})
that.setData({
'poster.isCreateQrcode':true,
'poster.qrcodeid':that.data.list[index].id,
'poster.customPoster':that.data.list[index].img,
'poster.slogan':that.data.list[index].title,
})
setTimeout(function(){
that.setData({
'poster.isShow': true
})
wx.hideLoading()
},3000)
}
},
//生成海报
createSpecial(e){
let that = this
wx.showLoading({
title: '正在生成中...',
})
that.setData({
'poster.status':that.data.list[index].status,
showPoster:false,
'poster.isCreateQrcode':true,
'poster.qrcodeid':that.data.list[index].id,
'poster.customPoster':that.data.list[index].img,
'poster.slogan':that.data.list[index].title,
'poster.qrcodeid':that.data.list[that.data.currentIndex].id,
'poster.customPoster':that.data.list[that.data.currentIndex].img,
'poster.slogan':that.data.list[that.data.currentIndex].title,
})
setTimeout(function(){
that.setData({
@@ -159,7 +187,27 @@ Page({
})
wx.hideLoading()
},3000)
},
//复制内容
copyWord(e){
if(e.currentTarget.dataset.tx){
wx.setClipboardData({
data: e.currentTarget.dataset.tx,
success (res) {
_.utils.$toast('复制成功')
}
})
}else{
_.utils.$toast('目前无文案')
}
},
//推送链接
pushLink(e){
if(e.currentTarget.dataset.url){
_.$router.openUrlScheme(e.currentTarget.dataset.url)
}
},
//页面相关事件处理函数--监听用户下拉动作
+27 -1
View File
@@ -14,8 +14,34 @@
</block>
</view>
<view class="bg-fff mt30 ml30 mr30 inner30 box-shadow-000-10-10 ulib-r10">
<view class="font-32 color-666 line-height-16">哪吒V仅售28999元,立即预约马上试驾,还可享受5年电池质保~</view>
<view class="mt10 text-right">
<view class="inline-block bg-333 pt5 pb5 pl20 pr20 font-22 color-fff ulib-r750" bindtap="copyWord" data-tx="哪吒V仅售28999元,立即预约马上试驾,还可享受5年电池质保~">复制</view>
</view>
</view>
<view class="bg-fff mt30 ml30 mr30 inner30 box-shadow-000-10-10 ulib-r10">
<view class="font-32 color-666 line-height-16">哪吒V仅售28999元,立即预约马上试驾,还可享受5年电池质保~</view>
<view class="mt10 text-right">
<view class="inline-block bg-333 pt5 pb5 pl20 pr20 font-22 color-fff ulib-r750" bindtap="copyWord" data-tx="哪吒V仅售28999元,立即预约马上试驾,还可享受5年电池质保~">复制</view>
</view>
</view>
<lcb-listmore isLoading='{{loading}}' isEnd='{{end&&list.length>6}}' isNoData='{{noData}}'></lcb-listmore>
</view>
<distributePoster isShow="{{poster.isShow}}" customImg="{{poster.customPoster}}" isCreateQrcode="{{poster.isCreateQrcode}}" qccodeid="{{poster.qrcodeid}}" slogan="{{poster.slogan}}" status="{{poster.slogan}}"></distributePoster>
<distributePoster isShow="{{poster.isShow}}" customImg="{{poster.customPoster}}" isCreateQrcode="{{poster.isCreateQrcode}}" qccodeid="{{poster.qrcodeid}}" slogan="{{poster.slogan}}"></distributePoster>
<lcb-msg isShow="{{showPoster}}" isTransparent='{{true}}'>
<view slot="content">
<view style="width:580rpx;">
<image class="block wp100 ulib-r10" src="{{list[currentIndex].img}}" mode="widthFix" />
</view>
<view class="mt40 fn-flex">
<button class="fn-flex-item bds-2-fff btn-no-bg font-32 color-fff ulib-r750 text-center ml20 mr20" bindtap="pushLink" data-url="/pages/distribute/special/index?iscall=0">专题预览</button>
<button class="fn-flex-item btn-f9394d font-32 color-fff ulib-r750 text-center ml20 mr20" hover-class="btn-f9394d-hover" catchtap="createSpecial">生成专题</button>
</view>
</view>
</lcb-msg>
+168 -73
View File
@@ -1,113 +1,182 @@
import _ from '../../../commons/js/commons';
import _ from '../../../commons/js/commons'
import popularData from '../../../commons/js/lib/popularData';
import * as echarts from '../../../ecCanvas/components/ec-canvas/echarts';
let chartData;
function initChart(canvas, width, height, dpr) {
const app = getApp()
let barChartData;
let lineChartData;
function barChart(canvas, width, height, dpr) {
const chart = echarts.init(canvas, null, {
width: width,
height: height,
devicePixelRatio: dpr // new
});
canvas.setChart(chart);
let option = chartData
let option = barChartData
chart.setOption(option);
return chart;
}
function lineChart(canvas, width, height, dpr) {
const chart = echarts.init(canvas, null, {
width: width,
height: height,
devicePixelRatio: dpr // new
});
canvas.setChart(chart);
let option = lineChartData
chart.setOption(option);
return chart;
}
Page({
data: {
imgUrl: _.config.imgUrl,//静态图片路径
tab_list:[
imgUrl:_.config.imgUrl,
showBarChart:false,//是否显示Bar图表
ecBar:{},
showLineChart:false,//是否显示Line图表
ecLine:{},
storeArray: [],
storeobj: [],
storeIndex:0,
staffArray: [],
staffobj: [],
staffIndex:-1,
tabId:'1',
tab:[
{
title:'近7日',
value:7,
id: 1,
title: '客户数据'
},
{
title:'近30日',
value:30,
id: 2,
title: '订单数据'
},
],
tabvalue:7,
custom:[],//客户数据
order:[],//订单数据
},
onLoad: function (options) {
onLoad(options) {
for (let key in options) {
this.setData({
[key]: options[key]
})
}
popularData.getDateLater(0,0).then(res => {
this.setData({
dateTime:res[0],
})
})
this.getdata()
this.getAppStatisticsOcust()
},
//获取统计数据
getdata(){
onShow: function () {
},
chartData = {
legend: {
data: ['浏览', '报名', '成交'],
bottom:20,
left: 'center',
z: 100
},
grid: {
containLabel: true
},
tooltip: {
show: true,
trigger: 'axis'
},
xAxis: {
type: 'category',
boundaryGap: false,
data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
// show: false
},
yAxis: {
x: 'center',
type: 'value',
splitLine: {
lineStyle: {
type: 'dashed'
}
//获取管理门店
getAppUserAdmins(){
let params = {};
params['biz_id'] = this.data.storeobj[this.data.storeIndex].id;
params['page'] = 1;
params['size'] = 1000;
_.apiQuery.getAppUserAdmins(params).then(res => {
let staffArray = []
res.data.list.forEach(item => {
staffArray.push(item.uname)
})
this.setData({
staffArray:staffArray,
staffobj: res.data.list,
})
});
},
//数据分析-订单数据
getAppStatisticsOcust(){
let res = {
"code":200,
"data":{
"stat_data":{
"tooltip":{"trigger":"axis"},
"legend":{
"top":"bottom",
"data":["浏览","客户","订单"]
},
"grid":{"top":"10%","left":"2%","right":"5%","bottom":"15%","containLabel":true},
"xAxis":{"type":"category","boundaryGap":false,"data":["10月","11月","12月"]},
"yAxis":{"type":"value"},
"series":[
{"name":"浏览","type":"line","stack":"总量","data":[2,3,4],"smooth":true},
{"name":"客户","type":"line","stack":"总量","data":[3,6,7],"smooth":true},
{"name":"订单","type":"line","stack":"总量","data":[5,2,1],"smooth":true},
]
},
// show: false
"season_data":[],
"season":3
},
series: [
{
name: '浏览',
type: 'line',
smooth: true,
data: [18, 36, 65, 30, 78, 40, 33]
},
{
name: '报名',
type: 'line',
smooth: true,
data: [12, 50, 51, 35, 70, 30, 20]
},
{
name: '成交',
type: 'line',
smooth: true,
data: [10, 30, 31, 50, 40, 20, 10]
}
]
};
"msg":""
}
lineChartData = res.data.stat_data
this.setData({
ec: {
onInit:initChart
}
order:res.data.custom,
showLineChart:true,
['ecLine.onInit']:lineChart,
})
wx.stopPullDownRefresh()
// let params = {};
// params['biz_id'] = this.data.storeobj[this.data.storeIndex].id;
// params['day'] = this.data.dateTime;
// if(this.data.staffIndex>-1){
// params['admin_id'] = this.data.staffobj[this.data.staffIndex].id;
// }
// _.apiQuery.getAppStatisticsOcust(params).then(res => {
// lineChartData = res.data.stat_data
// this.setData({
// order:res.data.custom,
// showLineChart:true,
// ['ecLine.onInit']:lineChart,
// })
// wx.stopPullDownRefresh()
// });
},
//却换时间tab
changeTab(e){
//选择城市
changeCity(e) {
this.setData({
tabvalue: e.currentTarget.dataset.value,
city_id:this.data.cityList[e.detail.value].city_id,
cityIndex: e.detail.value
})
//this.getDxtPhoneBill()
this.getAppUserBizs()
},
//选择门店
changeStore(e) {
this.setData({
storeIndex: e.detail.value
})
this.getAppStatisticsOcust()
},
//日期选择
changeDate(e){
this.setData({
dateTime: e.detail.value,
})
if(this.data.tabId==1){
this.getAppStatisticsScust()
}else if(this.data.tabId==2){
this.getAppStatisticsOcust()
}
},
//推送链接
@@ -119,6 +188,32 @@ Page({
//页面相关事件处理函数--监听用户下拉动作
onPullDownRefresh: function () {
//this.getAppUserBizs()
},
})
})
function getLineOption() {
return{
grid: {
top: '15%',
left: '2%',
right: '5%',
bottom: '5%',
containLabel: true
},
xAxis: {
type: 'category',
data: ['1月', '2月', '3月',]
},
yAxis: {
type: 'value'
},
series: [{
data: [20, 932, 901,],
type: 'line',
smooth: true
}]
};
}
+6 -1
View File
@@ -1,5 +1,10 @@
{
"navigationBarTitleText": "推广与提现",
"navigationBarTitleText": "数据分析",
"enablePullDownRefresh": true,
"navigationBarTextStyle": "white",
"navigationBarBackgroundColor": "#1a1c26",
"backgroundColor": "#ffffff",
"backgroundColorTop": "#1a1c26",
"usingComponents": {
"ec-canvas": "../../../ecCanvas/components/ec-canvas/ec-canvas"
}
+58 -58
View File
@@ -1,69 +1,69 @@
<view class="container img-top-cover" style="background-image:url({{imgUrl}}distribute/zc-bg.jpg);">
<view class="inner30">
<view class="color-fff">
<view class="font-22">
<i class="iconfont icon-shujuweihu font-26"></i>
<text class="ml10">累计数据</text>
<view class="container">
<view class="inner30 img-top-cover" style="background-image:url({{imgUrl}}channel/theme.jpg);">
<!-- 管辖门店 -->
<view class="inner30 pt40 bg-fff box-shadow-000-10-10 ulib-r10">
<view class="bg-f6 pt25 pb25 pl30 pr30 font-32 fn-clear ulib-r10">泉州鲤城区4s店</view>
<view class="mt20 bg-f6 pt25 pb25 pl30 pr30 font-32 fn-clear ulib-r10">
<view class="fn-fl">日期选择</view>
<picker class="fn-fr" mode="date" value="{{dateTime}}" bindchange="changeDate">
<view class="color-666">
<text>{{dateTime}}</text>
<i class="iconfont ml10 icon-gengduo font-26 color-999"></i>
</view>
</picker>
</view>
<view class="pt40 pb50 fn-flex fn-flex-between text-left">
<view>
<view class="font-40">19.00W</view>
<view class="font-28">浏览</view>
</view>
<view>
<view class="font-40">2345</view>
<view class="font-28">报名</view>
</view>
<view>
<view class="font-40">1875</view>
<view class="font-28">成交</view>
</view>
<view class="mt20 bg-f6 pt25 pb25 pl30 pr30 font-32 fn-clear ulib-r10">
<view class="fn-fl">素材选择</view>
<picker class="fn-fr" bindchange="changeStaff" value="{{staffIndex}}" range="{{staffArray}}">
<view class="color-666">
<text wx:if="{{staffIndex == -1}}">全部</text>
<text wx:else>{{staffArray[staffIndex]}}</text>
<i class="iconfont ml10 icon-gengduo font-26 color-999"></i>
</view>
</picker>
</view>
</view>
<view class="bg-fff inner30 box-shadow-000-10-10 ulib-r10">
<view class="font-22">
<i class="iconfont icon-car-fill font-26"></i>
<text class="ml10">推广车型</text>
</view>
<view class="fn-flex fn-flex-between pt20 pb10 text-left">
<view>
<view class="font-32">东风EX1</view>
<view class="font-22 color-999">车型</view>
<!-- 数据分析·订单 -->
<view>
<view class="mt40 inner30 pr0 pt40 bg-fff box-shadow-000-10-10 ulib-r10">
<view class="fn-flex fn-flex-wrap pt20 pb30">
<view class="wp33 pr25">
<view class="relative pt15 pb15 pl75 bg-f6 ulib-r10 overflowhidden line-height-13">
<view class="absolute top-0 left-0 bottom-0 pl60 bg-999">
<i class="absolute box-center-middle iconfont font-30 color-fff icon-liulan"></i>
</view>
<view class="font-28 text-bold">233</view>
<view class="font-22 color-666">浏览次数</view>
</view>
</view>
<view class="wp33 pr25">
<view class="relative pt15 pb15 pl75 bg-f6 ulib-r10 overflowhidden line-height-13">
<view class="absolute top-0 left-0 bottom-0 pl60 bg-999">
<i class="absolute box-center-middle iconfont font-30 color-fff icon-baoming"></i>
</view>
<view class="font-28 text-bold">233</view>
<view class="font-22 color-666">报名客户</view>
</view>
</view>
<view class="wp33 pr25">
<view class="relative pt15 pb15 pl75 bg-f6 ulib-r10 overflowhidden line-height-13">
<view class="absolute top-0 left-0 bottom-0 pl60 bg-999">
<i class="absolute box-center-middle iconfont font-30 color-fff icon-dingdan"></i>
</view>
<view class="font-28 text-bold">12.23w</view>
<view class="font-22 color-666">订单客户</view>
</view>
</view>
</view>
<view>
<view class="font-32">4353</view>
<view class="font-22 color-999">报名</view>
<view class="relative height-500 mr30 z-index-0">
<view class="absolute wp100 height-500">
<ec-canvas class="absolute top-0 bottom-0 left-0 right-0" ec="{{ ecLine }}"></ec-canvas>
</view>
<view>
<view class="font-32">265</view>
<view class="font-22 color-999">成交</view>
</view>
<view>
<view class="font-32">26.13W</view>
<view class="font-22 color-999">佣金</view>
</view>
</view>
</view>
</view>
<view class="mt10">
<view class="relative pl30 pr200 z-index-1">
<view class="font-22">
<i class="iconfont icon-qushi font-26"></i>
<text class="ml10">浏览情况趋势图</text>
</view>
<view class="absolute fn-flex right-0 mr30 box-middle space-nowrap font-20">
<block wx:for='{{tab_list}}' wx:key='index'>
<view class="fn-flex-item bg-fff pt10 pb10 pl20 pr20 {{tabvalue==item.value?'bg-f9394d color-fff':'bg-f6'}} {{index==0?'ulib-rl10':''}} {{index==tab_list.length-1?'ml-1 ulib-rr10':''}}" bindtap="changeTab" data-value="{{item.value}}">{{item.title}}</view>
</block>
</view>
</view>
<view class="echarts-con">
<ec-canvas id="mychart-dom-line" canvas-id="mychart-line" ec="{{ ec }}"></ec-canvas>
</view>
</view>
</view>
<lcb-footer></lcb-footer>
<lcb-backChannel></lcb-backChannel>
</view>
-21
View File
@@ -1,21 +0,0 @@
/* pages/distribute/statistics/index.wxss */
@import '../../../commons/css/custom/kefu.wxss';
.echarts-con {
position:relative;
top:-20px;
bottom: 0;
left: 0;
right: 0;
height:560rpx;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
box-sizing: border-box;
}
ec-canvas {
width: 100%;
height: 100%;
}