添加销售利润；部门利润；echarts

package-business-analysis/pages/profit-report/echarts-data.js

@@ -0,0 +1,282 @@
+const option1BarColor = ['#95A8CB','#77C5D5','#9BCBEB','#9FAEE5','#DEC9A3','#D59696','#D7ABD5','#BCC1CA'];
+
+const option1 = {
+  tooltip: {
+    trigger: 'item',
+    position: 'inside',
+    padding: [0, 2],
+    formatter: (a) => { return a.name.replaceAll('\n', '') + ':' + a.value },
+    textStyle: {
+      color: '#95A8CB'
+    }
+  },
+  grid: {
+    left: '13%',
+    height: '79%',
+    width: '74%',
+    y: '-7%',
+  },
+  xAxis: {
+    offset: 5,
+    axisTick: {
+      show: false,
+    },
+    axisLine: {
+      onZero: false,
+      lineStyle: {
+        color: '#E9F0FE',
+        width: 2
+      },
+    },
+    axisLabel:{textStyle: { fontSize: 8, color: '#95A8CB' }},
+    type: 'category',
+    data: [],
+  },
+  yAxis: {
+    axisTick: {
+      show: false,
+    },
+    axisLine: {
+      show: false,
+    },
+    axisLabel: {
+      show: false,
+    },
+    splitLine: {
+      lineStyle: {
+        type: 'dashed',
+        color: '#95A8CB',
+        opacity: 0.37
+      }
+    },
+    min: 0,
+    splitNumber: 3
+  },
+  series: [
+    {
+      barMinHeight:5,
+      barWidth: '20px',
+      data: [],
+      type: 'bar'
+    }
+  ]
+};
+  
+const option2 = {
+  grid: {
+    left: '6%',
+    top: '4%',
+    height: '90%',
+    width: '70%',
+    y: '-7%',
+  },
+  xAxis: {
+    axisTick: {
+      show: false,
+    },
+    axisLine: {
+      show: false,
+    },
+    axisLabel: {
+      show: false,
+    },
+    splitLine: {
+      show: false
+    }
+  },
+  yAxis: [
+    {
+      type: 'category',
+      inverse:true,
+      axisLabel: {
+        verticalAlign: "bottom",
+        align: "left",
+        padding: [0, 20, 8, 10],
+        textStyle: {
+          fontSize: 10,
+          color: "#1B365D",
+        }
+      },
+      data: [],
+      yAxisIndex: 0,
+      axisTick: {
+        show: false,
+      },
+      axisLine: {
+        show: false,
+      },
+    },
+    {
+      type: 'category',
+      inverse: true,
+      axisTick: 'none',
+      axisLine: 'none',
+      show: true,
+      axisLabel: {
+        textStyle: {
+          color: '#95A8CB',
+          fontSize: '10'
+        },
+        formatter: (value) => {
+          return '￥ '+value;
+        },
+      },
+      data:[]
+    },
+  ],
+  series: [
+    {
+      showBackground: true,
+      backgroundStyle: {
+        color: '#F8F9FD',
+        barBorderRadius: 6,
+      },
+      barWidth: '6px',
+      itemStyle: {
+        color: {
+          type: 'linear',
+          x: 0,
+          y: 0,
+          x2: 1,
+          y2: 1,
+          colorStops: [{
+            offset: 0, color: '#FFC259' 
+          }, {
+            offset: 1, color: '#FFE3AF'
+          }],
+          global: false 
+        },
+        barBorderRadius: 8,
+      },
+      data: [],
+      type: 'bar'
+    }
+  ]
+};
+
+const option3 = {
+  grid: {
+    left: '6%',
+    top: '4%',
+    height: '90%',
+    width: '70%',
+    y: '-7%',
+  },
+  xAxis: {
+    axisTick: {
+      show: false,
+    },
+    axisLine: {
+      show: false,
+    },
+    axisLabel: {
+      show: false,
+    },
+    splitLine: {
+      show: false
+    }
+  },
+  yAxis: [
+    {
+      type: 'category',
+      inverse:true,
+      axisLabel: {
+        verticalAlign: "bottom",
+        align: "left",
+        padding: [0, 20, 8, 10],
+        textStyle: {
+          fontSize: 10,
+          color: "#1B365D",
+        }
+      },
+      data: [],
+      yAxisIndex: 0,
+      axisTick: {
+        show: false,
+      },
+      axisLine: {
+        show: false,
+      },
+    },
+    {
+      type: 'category',
+      inverse: true,
+      axisTick: 'none',
+      axisLine: 'none',
+      show: true,
+      axisLabel: {
+        textStyle: {
+          color: '#95A8CB',
+          fontSize: '10'
+        },
+        formatter: (value) => {
+          return '￥ '+value;
+        },
+      },
+      data:[]
+    },
+  ],
+  series: [
+    {
+      showBackground: true,
+      backgroundStyle: {
+        color: '#F8F9FD',
+        barBorderRadius: 6,
+      },
+      barWidth: '6px',
+      itemStyle: {
+        color: {
+          type: 'linear',
+          x: 0,
+          y: 0,
+          x2: 1,
+          y2: 1,
+          colorStops: [{
+            offset: 0, color: '#11B7C6'
+          }, {
+            offset: 1, color: '#73D5E2'
+          }],
+          global: false 
+        },
+        barBorderRadius: 8,
+      },
+      data: [],
+      type: 'bar'
+    }
+  ]
+};
+
+const getWAmount = (number)=>{
+	  number =	number.toFixed(2);
+    var arr = number.split('.')
+		return parseInt(arr[0]).toLocaleString()+'.'+arr[1]
+}
+
+const getOpData = (data,labelKey,valueKey,optionType)=>{
+  let options;
+  /* 1：正常的纵向 2：横向标题在左 3：横向标题在上*/
+  if(optionType === 1){
+    options = {...option1}
+    options.xAxis.data = data.map(it=>it[labelKey].length>2?(it[labelKey].substring(0,2)+'\n'+it[labelKey].substring(2,4)):it[labelKey])
+    options.series[0].data = data.map((it,index)=>{return {value:getWAmount(it[valueKey]/10000),itemStyle: {color: option1BarColor[index],barBorderRadius: 1}}})
+    return options;
+  }
+  if(optionType === 2){
+    options = {...option2} /** 业务员姓名太长 type2也用type3的展现形式 单独换下颜色*/
+    options.yAxis[0].data = data.map(it=>it[labelKey])
+    options.yAxis[1].data = data.map(it=>getWAmount(it[valueKey]/10000))
+    options.series[0].data = data.map(it=>getWAmount(it[valueKey]/10000))
+    return options
+  }
+  if(optionType === 3){
+    options = {...option3}
+    options.yAxis[0].data = data.map(it=>it[labelKey])
+    options.yAxis[1].data = data.map(it=>getWAmount(it[valueKey]/10000))
+    options.series[0].data = data.map(it=>getWAmount(it[valueKey]/10000))
+    return options
+  }
+}
+
+module.exports = {getOpData};
+
+

package-business-analysis/pages/profit-report/org-rank/org-rank.js

@@ -0,0 +1,235 @@
+// package5/pages/report/detail/detail.js
+
+const api = require('../../../../utils/api.js');
+const util = require('../../../../utils/util.js')
+const app = getApp()
+const Constants = require('../../../../utils/Constants.js');
+
+
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    active: 0,
+    createTimeType: {
+      "text": "本月",
+      "value": 3
+    },
+    month: [
+      "2024-02-01",
+      "2024-02-29"
+    ],
+    monthFlag: false,
+    monthName: "2024年2月",
+    monthOnChoose: 1706749526365,
+    option1: [
+      {
+        "text": "本日",
+        "value": 1
+      },
+      {
+        "text": "本周",
+        "value": 2
+      },
+      {
+        "text": "本月",
+        "value": 3
+      },
+      {
+        "text": "本年",
+        "value": 5
+      },
+      {
+        "text": "自定义",
+        "value": 0
+      }
+    ],
+    orgFlag: false,
+    orgIds: [],
+    orgNames: null,
+    tab1Columns: [
+      {
+        "name": "orgName",
+        "title": "门店名称",
+        "width": "35%"
+      },
+      {
+        "name": "orderAmount",
+        "title": "成交金额(万)",
+        "type": "amount",
+        "width": "25%"
+      },
+      {
+        "ifNull": "-",
+        "name": "kpiOrderAmount",
+        "title": "任务目标(万)",
+        "type": "amount",
+        "width": "20%"
+      },
+      {
+        "after": "%",
+        "name": "kpiOrderRate",
+        "title": "完成率",
+        "width": "20%"
+      }
+    ],
+    tab1TableData: [],
+    tab1TopData: [
+      {
+        "title": "成交额(总额:万)",
+        "type": "amount",
+        "value": "0.00"
+      },
+      {
+        "title": "成交额(均值:万)",
+        "type": "amount",
+        "value": "0.00"
+      }
+    ],
+    tab2TableData: [],
+    value1: 3, 
+  },
+
+  dateClick(e){
+    if(e.detail === 0){
+      this.selectComponent("#month-components").toggle(true)  
+      this.dropdowncommit({currentTarget:{dataset:{type:'month'}}})
+    }else{
+      this.getReportData()
+    }
+  },
+  onConfirmChooseDate(e) {
+    this.setData({
+      month: this.data.monthOnChoose,
+      monthName: this.formatDate(this.data.monthOnChoose)
+    })
+    this.setData({
+      monthFlag: false
+    })
+    let option1 = this.data.option1
+    option1[option1.length-1].text = this.data.monthName
+    this.setData({
+      option1: option1
+    })
+    this.selectComponent("#month-components").toggle(false)
+    this.getReportData()
+  },
+
+  onCloseChooseDate(e) {
+    this.setData({
+      // monthOnChoose: this.data.month
+      value1: 3,
+
+    })
+    this.setData({
+      monthFlag: false
+    })
+    this.selectComponent("#month-components").toggle()
+    this.getReportData()
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad(options) { },
+
+
+  /** 查询页面展示的所有 */
+  getReportData() {
+    let params = {
+      tab1:  Object.assign(this.getBeginDateAndEndDate(this.data.month),{ userId:app.globalData.user.userId,monthDate: util.formatDayTimeMoth(new Date(this.data.month)),type: 'f_report_s001_index_org_order', cpId: app.globalData.user.ascpId, orgIds: this.data.orgIds ,dateType:this.data.value1}),
+    };
+    api.request(Constants.WX_REPORT + 'select_report_batch', 'POST', params).then(res => {
+      if (res.data.code === 200) {
+        this.setData({
+          tab1TopData: [{ title: '成交额(总额:万)', type: 'amount', value: util.parseFloatFixed2(res.data.data.tab1.sumAmount/10000) },{ title: '成交额(均值:万)', type: 'amount', value: util.parseFloatFixed2(res.data.data.tab1.avgAmount/10000) }],
+          tab1TableData: util.calc10000(res.data.data.tab1.items,['kpiOrderAmount','orderAmount'])
+        })
+      } else {
+        console.error("获取报表失败", res)
+      }
+    })
+  },
+     /**
+   * @desc : 日期组件后的回调
+   * @author : 于继渤
+   * @date : 2022/5/24 12:16
+   */
+  dateCommit(e) {
+    let dateType = e.detail.dateType
+    if (dateType === 'accountdate') {
+      if(e.detail.dateDefault.text === '自定义'){
+        this.setData({
+          value1: 0,
+        })
+      }
+      if(e.detail.dateDefault.text === '本月'){
+        this.setData({
+          value1: 3,
+        })
+      }
+      let data = e.detail.date
+      console.log(e)
+      this.setData({
+        month: data,
+        createTimeType: e.detail.dateDefault
+      })
+      this.selectComponent('#create-time-type').toggle();
+    }
+     this.getReportData()
+  },
+  //#region 基础内容
+  /** 根据月份查出第一天和最后一天 参数是时间戳*/
+  getBeginDateAndEndDate(timestamp) {
+    let month = this.data.month
+    let monthStart = month[0] ? month[0] : ''
+    let monthEnd = month[1] ? month[1] : ''
+    if (month && month[0] && (month[0].indexOf('/') != -1)) {
+      monthStart = month[0].replaceAll('/', '-')
+    }
+    if (month && month[1] && (month[1].indexOf('/') != -1)) {
+      monthEnd = month[1].replaceAll('/', '-')
+    }
+    return { beginDate: monthStart, endDate: monthEnd }
+  },
+  formatDate(value) {
+    var time = new Date(value);
+    var year = time.getFullYear();
+    var month = time.getMonth() + 1;
+    return year + "年" + month + "月"
+  },
+  onInput(e) {
+    this.setData({
+      monthOnChoose: e.detail
+    })
+  },
+
+
+  dropdowncommit(e) {
+    this.setData({
+      [e.currentTarget.dataset.type + 'Flag']: true
+    })
+  },
+
+  /** 下拉多选关闭 */
+  muticloseAll(e) {
+    this.setData({
+      orgFlag: false
+    })
+    this.selectComponent("#org-components").toggle()
+  },
+
+  /** 下拉多选确定 */
+  mutiSearchAll(e) {
+    this.setData({
+      orgIds: e.detail.idList,
+      orgNames: e.detail.names,
+      orgFlag: false
+    })
+    this.selectComponent("#org-components").toggle(false)
+    this.getReportData()
+  },
+  //#endregion
+})

package-business-analysis/pages/profit-report/org-rank/org-rank.json

@@ -0,0 +1,4 @@
+{
+    "usingComponents": {},
+    "navigationBarTitleText": "部门成交额排行"
+  }

package-business-analysis/pages/profit-report/org-rank/org-rank.wxml

@@ -0,0 +1,26 @@
+<view>
+  <!-- 顶部筛选条件 -->
+<van-dropdown-menu>
+  <van-dropdown-item id="create-time-type" title="{{createTimeType.text}}">
+    <dk-dropdown-date id="month-components"  dateType="accountdate" blankFlag="{{false}}" dateDefault='{{createTimeType}}' defaultValue='{{createTimeType.value}}' bind:dateCommit='dateCommit'></dk-dropdown-date>
+  </van-dropdown-item>
+  <van-dropdown-item id="org-components" title="{{orgNames?orgNames:'全部门店' }}" data-type="org" bind:open="dropdowncommit">
+  </van-dropdown-item>
+</van-dropdown-menu>
+
+  <view style="width: calc(100% - 68rpx);padding: 40rpx 34rpx;">
+    <dk-table columns="{{tab1Columns}}" table-data="{{tab1TableData}}" top-data="{{tab1TopData}}" />
+  </view>
+</view>
+
+<!-- 选门店 -->
+<dk-muti-dropdown-item show="{{orgFlag}}" docName="客户资料" id='org' typeName='org' bind:muticommit='mutiSearchAll' bind:muticlose='muticloseAll'></dk-muti-dropdown-item>
+
+<!-- 选时间 -->
+<van-popup position="bottom" show="{{ monthFlag }}" bind:close="onCloseChooseDate" class="popup" style="width:100%" custom-style="border-radius:15rpx;">
+  <view style="display:flex;justify-content: space-around;height:80rpx;">
+    <view style="width:45%;text-align: left;color:#b6b6b6;line-height:80rpx;" catchtap="onCloseChooseDate">取消</view>
+    <view style="width:45%;text-align: right;color:#00A7B5;line-height:80rpx;" catchtap="onConfirmChooseDate">确定</view>
+  </view>
+  <van-datetime-picker type="year-month" value="{{ monthOnChoose }}" bind:input="onInput" show-toolbar="{{false}}" formatter="{{formatter}}" />
+</van-popup>

package-business-analysis/pages/profit-report/org-rank/org-rank.wxss

@@ -0,0 +1,15 @@
+/* package5/pages/report/detail/detail.wxss */
+page{
+    background: #f8f9fd;
+  }
+  
+  .tab-class{
+    color:  #95A8CB;
+    font-family: 'PingFang SC';
+    font-style: normal;
+    font-weight: 500;
+    font-size: 14px;
+  }
+  .tab-active-class{
+    color: #00A7B5 !important;
+  }

package-business-analysis/pages/profit-report/profit-report.js

@@ -0,0 +1,709 @@
+/*******************************************************************************
+ * Copyright(c) 2022 dongke All rights reserved. / Confidential
+ * 类的信息：
+ *		1.程序名称：
+ *		2.功能描述：授权登录
+ * 编辑履历：
+ *		作者				日期					版本				修改内容
+ *		于继渤		  2022-04-25	  1.00		   	首页
+ *******************************************************************************/
+import * as echarts from '../../../pages/ec-canvas/echarts.min';
+import { getOpData } from '../echarts-data.js'
+const app = getApp()
+const api = require('../../../utils/api.js');
+const config = require('../../../config/config.js');
+const Constants = require('../../../utils/Constants.js');
+const common = require('../../../utils/common');
+const chooseGoodsCommon = require('../../../utils/chooseGoodsCommon.js');
+const util = require('../../../utils/util.js')
+const mixins = require('@/mixins/index.js')
+
+Page({
+  mixins: [mixins],
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    service: app.globalData['reportService'],
+    // 查询条件
+    searchContent: [{
+      code: 'makeTime',
+      title: mixins.$t('currentMonth'),
+      defaultValue: 3,
+      searchType: Constants.searchType.date
+    }],
+    menuBtnInfo: null,
+
+    skuloading: false,
+
+    statusItem: { text: '张三', value: "0" },
+
+    statusItem1: { text: '佛山居然店', value: "0" },
+
+    //用户信息
+    userInfo: {},
+
+    functionItem: {
+      text: '功能分区'
+    },
+    functionRegion: [{ text: '常用功能', checked: true }, { text: '待办工作', checked: true }],
+    functionRegions: [' ', '待办工作'],
+
+    //功能分类
+    regions: [{
+      FunctionName: ' ',
+      FunctionCodeOrder: '01'
+    },
+
+    ],
+
+    functionItems: [],
+    functionItems_two: [],
+    accountTimeType: {
+      text: '本日',
+      value: 3
+    },
+    createTimeType: {
+      text: '本月',
+      value: 3
+    },
+    loading: false,
+    pageInfo: {
+      pageSize: 8,
+      currentPage: 1,
+      lastPage: 0,
+    },
+    promotionList_left: [],
+    promotionList_right: [],
+    windowHeight: 0,
+    choosedGoodsList: [],
+
+    currentDate: new Date().getTime() + 100,
+
+    //报表
+
+    lastDate: { text: '本月', value: 3 },
+    option1: [
+      { text: '本日', value: 1 },
+      { text: '本周', value: 2 },
+      { text: '本月', value: 3 },
+      // { text: '本季', value: 4 },
+      { text: '本年', value: 5 },
+      { text: '自定义', value: 0 },
+
+    ],
+    value1: 3,
+
+    orderAnalysis: {},
+    repayAnalysis: {},
+    csmAnalysisHome: {},
+
+    /** 报表数据 */
+
+    ec: {},
+    monthName: util.formatDayYm(new Date()),
+    monthFlag: false,
+    month: new Date().getTime(),
+    monthOnChoose: new Date().getTime(),
+    orgFlag: false,
+    orgIds: [],
+    orgNames: null,
+    formatter(type, value) {
+      if (type === 'year') {
+        return `${value}年`;
+      }
+      if (type === 'month') {
+        return `${value}月`;
+      }
+      if (type === 'day') {
+        return `${value}日`;
+      }
+      if (type === 'hour') {
+        return `${value}时`;
+      }
+      if (type === 'minute') {
+        return `${value}分`;
+      }
+      return value;
+    },
+  },
+  // 设置
+  onClickSet() {
+    wx.navigateTo({
+      url: './home-page-setting'
+    })
+  },
+  // 去公告页
+  toNotice() {
+    wx.navigateTo({
+      url: '/package2/pages/notice/notice'
+    })
+  },
+
+
+
+  /**
+    * 选择下拉后查询
+    */
+  dropdowncommit(e) {
+    this.setData({
+      functionRegions: e.detail.dataList
+    })
+    this.selectComponent('#functionItem').toggle();
+  },
+
+  /**
+  * @desc : 非标商品选择事件
+  * @author : 于继渤
+  * @date : 2022/8/24 13:16
+  */
+  nonGlassSpuItemsTap(e) {
+    chooseGoodsCommon.nonGlassSpuItemsTap(e, this)
+  },
+
+  /**
+* @desc : 切换sku商品规格
+* @author : 周兴
+* @date : 2022/6/1 10:16
+*/
+  changeSkuSpecs(e) {
+    chooseGoodsCommon.changeSkuSpecsCommon(e, this);
+  },
+
+  /**
+  * @desc : 切换组合促销明细
+  * @date : 2022/7/5 16:49
+  * @author : 周兴
+  */
+  changeCombinedItem(e) {
+    chooseGoodsCommon.changeCombinedItemCommon(e, this)
+  },
+  /**
+   * @desc : 销售价格编辑
+   * @author : 常皓宁
+   * @date : 2022/5/31 14:45
+   */
+  changeSalesPriceField(e) {
+    let priceSale = e.detail.value;
+    chooseGoodsCommon.changeSalesPriceCommon(priceSale, this)
+  },
+  /**
+ * @desc : 修改销售金额
+ * @author : 周兴
+ * @date : 2022/7/4 14:45
+ */
+  changeItemAmountField(e) {
+    chooseGoodsCommon.changeItemAmountFieldCommon(e, this)
+  },
+  /**
+* @desc : 改变标识
+* @author : 周兴
+* @date : 2022/8/6 17:16
+*/
+  changeAllReadyCheckBox(e) {
+    chooseGoodsCommon.changeAllReadyCheckBoxCommon(e, this)
+  },
+
+  /**
+   * @desc : 修改销售价格
+  * @author : 周兴
+  * @date : 2022/7/6 14:45
+  */
+  changeSalesPrice(priceSale) {
+    chooseGoodsCommon.changeSalesPriceCommon(priceSale, this)
+  },
+
+  /**
+   * 关闭产品
+   * @param {*} e 
+   */
+  closeAddItemInfo() {
+    chooseGoodsCommon.closeAddItemInfoCommon(this)
+  },
+
+  getCode() {
+    return new Promise((resolve, reject) => {
+      wx.qy.getQrCode({
+        success: function (res) {
+          var qrCode = res.qrCode
+          resolve(qrCode)
+        }
+      })
+
+    })
+  },
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+    this.setData({
+      menuBtnInfo: wx.getMenuButtonBoundingClientRect()
+    })
+
+    let _this = this;
+    wx.getSystemInfo({
+      success: function (res) {
+        _this.setData({
+          windowHeight: res.windowHeight,
+          windowWidth: res.windowWidth
+        })
+      }
+    })
+
+    if (app.globalData.user) {
+      this.setData({
+        userInfo: app.globalData.user,
+      })
+    }
+    wx.setStorageSync('choosedGoodsList', [])
+
+    // 报表查询数据
+    this.getSaleProfit()
+  },
+
+
+  /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+  onPullDownRefresh: function () {
+    //调用刷新时将执行的方法
+    this.onRefresh();
+  },
+
+  onRefresh() {
+    //在当前页面显示导航条加载动画
+    wx.showNavigationBarLoading()
+    //显示 loading 提示框。需主动调用 wx.hideLoading 才能关闭提示框
+    //报表查询数据
+    this.getSaleProfit()
+  },
+
+
+
+  /**
+   * @desc : 打开商品
+   * @author : 周兴
+   * @date : 2022/7/2 20:16
+   */
+  openAddItemInfo(e) {
+    // chooseGoodsCommon.openAddItemInfoCommon(e,this,'home-page')
+    this.setData({
+      goodsSkuList: []
+    })
+
+    let item = e.currentTarget.dataset.item
+    //促销类型
+    let promotionType = e.currentTarget.dataset.promotiontype
+    //促销类型
+    item.promotionTypeName = e.currentTarget.dataset.promotiontype == 2 ? '组合促销' : '单品促销'
+    item.itemQuantity = 1
+
+    item.activityId = e.currentTarget.dataset.item.activityId
+    item.warehouseId = app.globalData.user.whId
+    item.whId = app.globalData.user.whId
+    item.warehouseName = app.globalData.user.whName
+    item.wh_Name = app.globalData.user.whName
+    // if (item.activityIds && item.activityIds.length > 0) {
+    //   item.activityId = item.activityIds[0] ? item.activityIds[0] : null
+    // }
+    item.activityName = item.activityNames
+    item.orderItemQuantity = item.itemQuantity
+
+    item.pricePromotionName = item.priceName
+    item.promotionId = item.priceId
+    delete item['apvResult']
+    delete item['apvResultName']
+    delete item['apvUserIds']
+    // delete item['combinedTypeList']
+    delete item['flgValid']
+
+    // 组合促销
+    if (promotionType == "2") {
+
+      //促销价
+      item.pricePromotion = e.currentTarget.dataset.item.pricePromotion ? e.currentTarget.dataset.item.pricePromotion : e.currentTarget.dataset.item.sumPrice
+      item.priceSale = item.pricePromotion
+      item.promotionType = Constants.PROMOTION_TYPE.COMBINED
+      if (item.imageInfo.length > 0) {
+        item.iconThumPath = item.imageInfo[0].path
+      }
+      delete item['imageInfo']
+
+      chooseGoodsCommon.getCombinedByPriceId(e, this);
+      this.setData({
+        show1: false,
+        show2: false,
+        show3: false,
+        show4: true,
+        show5: false
+      })
+    }
+    else {
+      // item.titleTag = '单品促销'
+      // item.title = item.skuModel
+      // item.desc = item.skuName
+      item.promotionType = Constants.PROMOTION_TYPE.PRMOTION
+      item.itemAmount = item.sumPrice
+
+      item.pricePromotion = e.currentTarget.dataset.item.pricePromotion ?
+        e.currentTarget.dataset.item.pricePromotion : item.sumPrice
+      item.priceSale = item.sumPrice
+      // 根据spuId获取sku相关信息
+      chooseGoodsCommon.getSkuBySpuId(e, this);
+      this.setData({
+        show1: true,
+        show2: false,
+        show3: false,
+        show4: false,
+        show5: false
+      })
+    }
+
+    this.setData({
+      currentChoosedItem: item,
+      showAdd: true,
+    })
+  },
+
+  /**
+   * @desc : 选择数据
+   * @date : 2022/7/4 16:49
+   * @author : 周兴
+   */
+  chooseSkuInfo() {
+    let currentChoosedItem = this.data.currentChoosedItem
+    currentChoosedItem.goodsSkuList = this.data.goodsSkuList
+    //校验选择商品数量不能为0
+    if (currentChoosedItem.itemQuantity === 0 || !currentChoosedItem.itemQuantity) {
+      wx.showToast({
+        title: '数量不能为0',
+        image: '/static/image/warning.png',
+        duration: 1000
+      })
+      return
+    }
+    //校验除赠品标识外价格不能为0
+    else if (!currentChoosedItem.flgGift && currentChoosedItem.priceSale == 0) {
+      wx.showToast({
+        title: '销售价格未填写',
+        image: '/static/image/warning.png',
+        duration: 1000
+      })
+      return
+    }
+    // 如果是组合需要判断bom中子件是否有标价
+    else if (currentChoosedItem.combinedList && currentChoosedItem.combinedList.length > 0) {
+      // currentChoosedItem.combinedList.forEach(it => {
+      //   if (!it.priceStandard && it.priceStandard != 0) {
+      //     wx.showToast({
+      //       title: '商品标价未设置',
+      //       image: '/static/image/warning.png',
+      //       duration: 1000
+      //     })
+      //     return;
+      //   }
+      // })
+    }
+    // 如果标价为0 不允许加入购物车
+    else if (!currentChoosedItem.priceStandard && currentChoosedItem.priceStandard != 0) {
+      // wx.showToast({
+      //   title: '商品标价未设置',
+      //   image: '/static/image/warning.png',
+      //   duration: 1000
+      // })
+      // return;
+    }
+    // 如果没有sku 那么不允许
+    if (currentChoosedItem.promotionType != Constants.PROMOTION_TYPE.COMBINED && (!currentChoosedItem.skuId || currentChoosedItem.skuId == 0)) {
+      wx.showToast({
+        title: '未选择商品规格',
+        image: '/static/image/warning.png',
+        duration: 1000
+      })
+      return
+    }
+    // 已选商品列表
+    let choosedGoodsList = this.data.choosedGoodsList
+
+
+    // 判断商品是否在已选列表中存在
+    let filterRows = choosedGoodsList.filter(it => it.id == currentChoosedItem.id);
+    let currentChoosedItemTemp = { ...currentChoosedItem }
+    if (!filterRows || filterRows.length == 0) {
+      if (!this.data.showChoosedFlag) {
+        choosedGoodsList.push(currentChoosedItemTemp)
+      }
+
+    }
+    this.setData({
+      choosedGoodsList: choosedGoodsList,
+      showAdd: false
+    })
+
+    choosedGoodsList.forEach(res => {
+      res.id = util.getGuid()
+    })
+
+    let choosedGoodsListSync = wx.getStorageSync('choosedGoodsList')
+    if (choosedGoodsListSync.length > 0) {
+      let filterRows = choosedGoodsListSync.filter(it => it.priceId + '_' + it.spuId
+        == currentChoosedItem.priceId + '_' + currentChoosedItem.spuId);
+      if (!filterRows || filterRows.length == 0) {
+        choosedGoodsListSync.push(currentChoosedItem)
+      }
+    } else {
+      choosedGoodsListSync.push(currentChoosedItem)
+    }
+
+
+
+    wx.setStorageSync('choosedGoodsList', choosedGoodsListSync)
+    wx.setStorageSync('homeData', {
+      skuData: this.data.skuData ? this.data.skuData : [],
+      skuSpecsData: this.data.skuSpecsData ? this.data.skuSpecsData : [],
+      skuSpecsList: this.data.skuSpecsList ? this.data.skuSpecsList : [],
+    })
+
+    let cartNum = choosedGoodsListSync.length  //默认数据
+    if (cartNum != 0) {
+      //设置角标
+      wx.setTabBarBadge({
+        index: 2, //第几个tab
+        text: cartNum.toString()
+      })
+    } else {
+      //移除角标
+      wx.removeTabBarBadge({
+        index: 2,
+      })
+    }
+
+    //计算合计金额
+    chooseGoodsCommon.getSumAmount(this);
+  },
+
+
+
+  /**
+ * 数量的变化事件
+ * @param {*} e 
+ */
+  changeAllreadyChooseQuantityPop(e) {
+    let currentChoosedItem = this.data.currentChoosedItem
+    currentChoosedItem.itemQuantity = e.detail
+    currentChoosedItem.itemAmount = Number(currentChoosedItem.priceSale * currentChoosedItem.itemQuantity).toFixed(2)
+    currentChoosedItem.itemAmount = isNaN(currentChoosedItem.itemAmount) ? 0 : currentChoosedItem.itemAmount
+    this.setData({
+      currentChoosedItem: currentChoosedItem
+    })
+
+  },
+
+  //触底分页函数
+  paging() {
+
+  },
+
+
+
+  /**
+   * @desc : 页面滚动时执行
+   * @date : 2022/5/12 16:49
+   * @author : 于继渤
+   */
+  onPageScroll: function () {
+
+    /**
+     * @desc : 关闭下拉  
+     * @date : 2022/5/12 16:49
+     * @author : 于继渤
+     */
+    //TODO  有ID同名问题记得修改
+    // this.selectComponent('#statusItem').onClosed()
+    // this.selectComponent('#statusItem').rerender()
+
+    // this.selectComponent('#statusItem1').onClosed()
+    // this.selectComponent('#statusItem1').rerender()
+
+    // this.selectComponent('#accountTimeType').onClosed()
+    // this.selectComponent('#accountTimeType').rerender()
+
+  },
+
+  // 报表相关
+  dateClick(e) {
+    if (e.detail === 0) {
+      this.selectComponent("#month-components").toggle(true)
+      this.dropdowncommit({ currentTarget: { dataset: { type: 'month' } } })
+    } else {
+      this.getSaleProfit()
+    }
+  },
+
+
+  /** 去详细 */
+  toDetail(e) {
+    console.log(e, '/package-business-analysis/pages/profit-report/' + e.currentTarget.dataset.url)
+    wx.navigateTo({
+      url: '/package-business-analysis/pages/profit-report/' + e.currentTarget.dataset.url
+      //  + '?orgIds=' + encodeURIComponent(JSON.stringify(this.data.orgIds)) + '&orgNames=' + encodeURIComponent(JSON.stringify(this.data.orgNames))
+        // + '&dateType=' + this.data.value1 + '&date=' + this.data.month
+    })
+  },
+
+  formatDate(value) {
+    var time = new Date(value);
+    var year = time.getFullYear();
+    var month = time.getMonth() + 1;
+    return year + "年" + month + "月"
+  },
+
+  onInput(e) {
+    this.setData({
+      monthOnChoose: e.detail
+    })
+  },
+
+  onConfirmChooseDate(e) {
+    this.setData({
+      month: this.data.monthOnChoose,
+      monthName: this.formatDate(this.data.monthOnChoose)
+    })
+    this.setData({
+      monthFlag: false
+    })
+    let option1 = this.data.option1
+    option1[option1.length - 1].text = this.data.monthName
+    this.setData({
+      option1: option1
+    })
+    this.selectComponent("#month-components").toggle(false)
+    this.getSaleProfit()
+  },
+
+  onCloseChooseDate(e) {
+    this.setData({
+      // monthOnChoose: this.data.month
+      value1: 3,
+
+    })
+    this.setData({
+      monthFlag: false
+    })
+    this.selectComponent("#month-components").toggle()
+    this.getSaleProfit()
+  },
+
+  dropdowncommit(e) {
+    this.setData({
+      [e.currentTarget.dataset.type + 'Flag']: true
+    })
+  },
+
+  /** 下拉多选关闭 */
+  muticloseAll(e) {
+    this.setData({
+      orgFlag: false
+    })
+    this.selectComponent("#org-components").toggle()
+  },
+
+  /** 下拉多选确定 */
+  mutiSearchAll(e) {
+    this.setData({
+      orgIds: e.detail.idList,
+      orgNames: e.detail.names,
+      orgFlag: false
+    })
+    this.selectComponent("#org-components").toggle(false)
+    this.getSaleProfit()
+  },
+
+  onShow() {
+    this.echartsProfitDate = this.selectComponent("#echartsProfitDate")
+    this.echartsProfitStaff = this.selectComponent("#echartsProfitStaff")
+    this.echartsProfitOrg = this.selectComponent("#echartsProfitOrg")
+    this.echartsProfitSku = this.selectComponent("#echartsProfitSku")
+  },
+
+  /** 设置echarts */
+  setEcharts(name, { data, labelKey, valueKey, type }) {
+    this[name].init((canvas, width, height, dpr) => {
+      const chart = echarts.init(canvas, null, {
+        width: width,
+        height: height,
+        devicePixelRatio: dpr
+      });
+      canvas.setChart(chart);
+      chart.setOption(getOpData(data, labelKey, valueKey, type));
+      return chart;
+    });
+  },
+  /** 根据月份查出第一天和最后一天 参数是时间戳*/
+  getBeginDateAndEndDate(timestamp) {
+    // let date = new Date(timestamp)
+    // let year = date.getFullYear();
+    // let month = date.getMonth() + 1;
+    // let yearAndMonth = year + '-' + (month >= 10 ? month : '0' + month);
+    // return { beginDate: yearAndMonth + '-01', endDate: yearAndMonth + '-' + new Date(year, month, 0).getDate() }
+    let month = this.data.month
+    let monthStart = month[0] ? month[0] : ''
+    let monthEnd = month[1] ? month[1] : ''
+    if (month && month[0] && (month[0].indexOf('/') != -1)) {
+      monthStart = month[0].replaceAll('/', '-')
+    }
+    if (month && month[1] && (month[1].indexOf('/') != -1)) {
+      monthEnd = month[1].replaceAll('/', '-')
+    }
+    return { beginDate: monthStart, endDate: monthEnd }
+
+
+
+
+  },
+
+  /**
+   * 销售毛利点击按日或按月查询
+   */
+  clickProfitDate(e) {
+    this.setData({
+      byDate: e.currentTarget.dataset.value
+    })
+    this.getSaleProfit()
+  },
+
+  /** 查询所有报表信息 */
+  /** 查询页面展示的所有 */
+  getSaleProfit() {
+    this.excute(this.data.service, this.data.service.getSaleProfit, Object.assign({
+      byDate: this.data.byDate
+    }, JSON.parse(this.data.searchForm))).then(res => {
+      if (res.data.code == Constants.SUCESS_CODE) {
+        this.setData({
+          profit: res.data.data.profit,
+        })
+
+        /** 图形重新渲染 */
+        setTimeout(() => {
+          this.setEcharts('echartsProfitDate', { data: res.data.data.dateProfit, labelKey: 'accDate', valueKey: 'profit', type: 1 })
+          this.setEcharts('echartsProfitOrg', { data: res.data.data.orgProfit, labelKey: 'orgName', valueKey: 'profit', type: 3 })
+          this.setEcharts('echartsProfitStaff', { data: res.data.data.staffProfit, labelKey: 'staffName', valueKey: 'profit', type: 3 })
+          this.setEcharts('echartsProfitSku', { data: res.data.data.skuProfit, labelKey: 'skuName', valueKey: 'profit', type: 3 })
+        }, 1000)
+
+      }
+    })
+  },
+
+   /**
+    * 显示tip
+    */
+    showTip(e) {
+      console.log(e)
+      let item = e.currentTarget.dataset.item
+      if (item) {
+        util.showToast(item);
+      }
+    },
+})
+

package-business-analysis/pages/profit-report/profit-report.json

@@ -0,0 +1,4 @@
+{
+  "usingComponents": {  "ec-canvas": "../../../pages/ec-canvas/ec-canvas"},
+  "navigationBarTitleText":"销售利润"
+}

package-business-analysis/pages/profit-report/profit-report.wxml

@@ -0,0 +1,177 @@
+<wxs src='/utils/numberFormat.wxs' module="numberFormat"></wxs>
+
+<loading wx:if="{{loading}}" loadingName="加载中" backgroundColor="#f2f2f2;" opacity="0.8"></loading>
+<!-- 顶部 -->
+
+<!-- 顶部筛选条件 -->
+<view class="head" style="position: fixed;top:0; z-index: 95;">
+  <view style="overflow: hidden;position: absolute;width: 100%; z-index: 6666;">
+    <dk-dropdown-menu  model:value="{{searchForm}}" menuList="{{searchContent}}"  bind:search="getSaleProfit" flgSearchText="{{false}}">
+	</dk-dropdown-menu>
+  </view>
+</view>
+
+
+<view class="func" style="margin-top:100rpx;">
+  <!-- 报表相关 -->
+
+
+
+  <view class="main">
+
+
+    <view class="card-view">
+      <view class="top-card">
+        <view class="top-card-title">销售利润</view>
+        <view class="top-card-icon">
+          <van-icon size="26rpx" name="question-o" data-item="销售利润=收入-成本" catchtap="showTip"/>
+        </view>
+        <view class="top-card-money">
+ 
+          <dk-cell left="0rpx" height="45rpx" contentRight="{{false}}" contentFontSize="16" contentColor="#caa977"
+              contentFontWeight="bold" content="{{profit.profit || 0}}"></dk-cell>
+        </view>
+        <view style="clear: both;" />
+      </view>
+
+      <view class="top-card">
+        <view class="top-card-title">销售利润率</view>
+        <view class="top-card-icon">
+          <van-icon size="26rpx" name="question-o" data-item="销售利润率=(收入-成本)/收入×100%" catchtap="showTip"/>
+        </view>
+        <view class="top-card-percent">{{profit.profitRate || 0}}%</view>
+        <view style="clear: both;" />
+      </view>
+
+      <view class="top-card top-card-bottom">
+        <view class="top-card-bottom-text">
+          <view class="top-card-bottom-text-title">销售总额</view>
+          <dk-cell left="0rpx" height="50rpx" contentRight="{{false}}" contentFontSize="13" contentColor="#95a8cb"
+               content="{{profit.outbound || 0}}"></dk-cell>
+        </view>
+        <view class="top-card-bottom-text">
+          <view class="top-card-bottom-text-title">成本总额</view>
+          <dk-cell left="0rpx" height="50rpx" contentRight="{{false}}" contentFontSize="13" contentColor="#95a8cb"
+               content="{{profit.inbound || 0}}"></dk-cell>
+      </view>
+          
+      </view>
+    </view>
+
+
+    <!-- 销售毛利 -->
+    <view class="card-view2">
+      <view class="card-view-header2">
+        <view class="card-view-header-name2">
+          销售毛利
+          <span class="card-view-header-name3">（近一年）</span>
+        </view>
+        <view class="card-view-header-tags2">
+          <van-button color="#f0f0f0" size="mini" bind:click="clickProfitDate" data-value="true" custom-style="{{byDate=='true'?'color: #5c91ce; border: 1px solid #5c91ce':'color: black'}}" style="margin-right: 10rpx">按日</van-button>
+          <van-button color="#ecf1fa" size="mini" bind:click="clickProfitDate" data-value="false" custom-style="{{!byDate || byDate=='false'?'color: #5c91ce; border: 1px solid #5c91ce':'color: black'}}">按月</van-button>
+          <!-- <view class="card-view-header-tags-tag">详情
+            <van-icon style="margin-left: 14rpx;" name="arrow" />
+          </view> -->
+        </view>
+      </view>
+
+      <view style="z-index: 0 !important;width: 100%; height: 600rpx;">
+        <ec-canvas type="2d" canvas-id="echartsProfitDate" id="echartsProfitDate" ec="{{ ec }}" />
+      </view>
+    </view>
+
+    <!-- 部门利润 -->
+    <view class="card-view">
+      <view class="card-view-header">
+        <view class="card-view-header-name">
+          <image src="/static/image/app.png" class="header-icon" style="width: 30rpx;height:30rpx;margin-right: 15rpx;"></image>
+          部门利润排行
+        </view>
+        <view class="card-view-header-tags" catchtap="toDetail" data-url="org-rank/org-rank">
+          <view class="card-view-header-tags-tag">详情
+            <van-icon style="margin-left: 14rpx;" name="arrow" />
+          </view>
+        </view>
+      </view>
+      <!-- <view class="card-view-content-data-echarts">
+        <view class="card-view-content-data-echarts-data">
+          <view>
+            <text class="small-small-font">￥</text>{{indexOrgOrder.sumAmount ? numberFormat.toThousandCents(numberFormat.numberFormat(indexOrgOrder.sumAmount/10000)) : '0.00'}}
+          </view>
+          <view>成交额(万)</view>
+        </view>
+      </view> -->
+      <view style="z-index: 0 !important;width: 100%; height: 327rpx;">
+        <ec-canvas type="2d" canvas-id="echartsProfitOrg" id="echartsProfitOrg" ec="{{ ec }}" />
+      </view>
+    </view>
+
+    <!-- 部门收款 -->
+    <view class="card-view">
+      <view class="card-view-header">
+        <view class="card-view-header-name">
+          <image src="/static/image/app.png" class="header-icon" style="width: 30rpx;height:30rpx;margin-right: 15rpx;"></image>
+          业务员利润排行
+        </view>
+        <view class="card-view-header-tags" catchtap="toDetail" data-url="/org-repay-rank/org-repay-rank">
+          <view class="card-view-header-tags-tag">详情
+            <van-icon style="margin-left: 14rpx;" name="arrow" />
+          </view>
+        </view>
+      </view>
+      <!-- <view class="card-view-content-data-echarts">
+        <view class="card-view-content-data-echarts-data">
+          <view>
+            <text class="small-small-font">￥</text>{{indexOrgRepay.sumAmount ? numberFormat.toThousandCents(numberFormat.numberFormat(indexOrgRepay.sumAmount/10000)) : '0.00'}}
+          </view>
+          <view>成交额(万)</view>
+        </view>
+      </view> -->
+      <view style="z-index: 0 !important;width: 100%; height: 327rpx;">
+        <ec-canvas type="2d" canvas-id="echartsProfitStaff" id="echartsProfitStaff" ec="{{ ec }}" />
+      </view>
+    </view>
+
+
+    <!-- 业务员成交 -->
+    <view class="card-view">
+      <view class="card-view-header">
+        <view class="card-view-header-name">
+          <image src="/static/image/app.png" class="header-icon" style="width: 30rpx;height:30rpx;margin-right: 15rpx;"></image>
+          商品利润排行
+        </view>
+        <view class="card-view-header-tags" catchtap="toDetail" data-url="/staff-order-rank/staff-order-rank">
+          <view class="card-view-header-tags-tag">详情
+            <van-icon style="margin-left: 14rpx;" name="arrow" />
+          </view>
+        </view>
+      </view>
+      <!-- <view class="card-view-content-data-echarts">
+        <view class="card-view-content-data-echarts-data">
+          <view>
+            <text class="small-small-font">￥</text>{{indexStaffOrder.sumAmount ? numberFormat.toThousandCents(numberFormat.numberFormat(indexStaffOrder.sumAmount/10000)) : '0.00'}}
+          </view>
+          <view>成交额(万)</view>
+        </view>
+      </view> -->
+      <view style="z-index: 0 !important;width: 100%; height: 327rpx;">
+        <ec-canvas type="2d" canvas-id="echartsProfitSku" id="echartsProfitSku" ec="{{ ec }}" />
+      </view>
+    </view>
+
+
+  </view>
+
+
+
+
+  <!-- 选时间 -->
+  <van-popup position="bottom" show="{{ monthFlag }}" bind:close="onCloseChooseDate" class="popup" style="width:100%" custom-style="border-radius:15rpx;">
+    <view style="display:flex;justify-content: space-around;height:80rpx;">
+      <view style="width:45%;text-align: left;color:#b6b6b6;line-height:80rpx;" catchtap="onCloseChooseDate">取消</view>
+      <view style="width:45%;text-align: right;color:#00A7B5;line-height:80rpx;" catchtap="onConfirmChooseDate">确定</view>
+    </view>
+    <van-datetime-picker type="year-month" value="{{ monthOnChoose }}" bind:input="onInput" show-toolbar="{{false}}" formatter="{{formatter}}" />
+  </van-popup>
+</view>
+

package-business-analysis/pages/profit-report/profit-report.wxss

@@ -0,0 +1,884 @@
+page {
+  width: 100%;
+  margin: 0;
+  background: #FFFFFF;
+}
+
+.custom-class {
+  width: 100% !important;
+}
+
+.top {
+  position: fixed;
+  top: 2rpx;
+}
+
+.title {
+  display: flex;
+}
+
+.van-cell-text {
+  margin-left: 12rpx;
+}
+
+
+.van-button {
+  width: 100% !important;
+}
+
+
+.panel-class {
+  margin-bottom: 20rpx;
+}
+
+.test {
+  z-index: 0 !important;
+  width: 100%;
+  height: 600rpx;
+}
+
+/* .van-dropdown-menu__item {
+  flex: 0.7 !important;
+} */
+
+.menu-box {
+  width: 100%;
+  box-sizing: border-box;
+  padding: 0 0 0 22rpx;
+  display: flex;
+  align-items: center;
+  background: white;
+}
+
+.title-class {
+  width: 100% !important;
+
+}
+
+.van-ellipsis {
+  font-size: 32rpx;
+}
+
+.field-class {
+  height: 60rpx;
+  width: 100% !important;
+  padding: 0;
+  display: flex;
+  align-items: center;
+}
+
+.van-search--withaction {
+  padding-right: 0;
+  width: 488rpx !important;
+}
+
+.van-field__input--center {
+  text-align: left !important;
+}
+
+.van-ellipsis {
+  font-size: 30rpx !important;
+}
+
+.finance_block {
+  background: #f5f5f5;
+  margin: 2vw;
+  width: 50vw;
+  text-align: center;
+  padding: 1vw;
+  border-radius: 1vw;
+}
+
+/* 按钮横向排列 */
+.view_class {
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  margin-top: 10rpx;
+  margin-bottom: 10rpx;
+}
+
+.head {
+  /* z-index: 1;  */
+  /* height: 384rpx; */
+  width: 100%; 
+  /* background: #1B365D; */
+}
+
+.head-center {
+  position: absolute;
+  width: 78rpx;
+  height: 80rpx;
+  left: 39rpx;
+  top: 204rpx;
+}
+
+.nick-name {
+  width: 70% !important;
+  position: absolute;
+  width: 64rpx;
+  height: 45rpx;
+  left: 140rpx;
+  top: 209rpx;
+  font-family: 'PingFang HK';
+  font-style: normal;
+  font-weight: 600;
+  font-size: 32rpx;
+  line-height: 45rpx;
+  color: #FFFFFF;
+}
+
+.head .van-ellipsis {
+  font-weight: bolder;
+}
+
+
+.wx-avatar {
+  overflow: hidden;
+  display: block;
+  width: 80rpx;
+  height: 80rpx;
+  border-radius: 50%;
+  border: 1px solid #95a8cb;
+}
+
+.store {
+  position: absolute;
+  width: 364rpx;
+  height: 34rpx;
+  left: 140rpx;
+  top: 254rpx;
+  font-family: 'PingFang HK';
+  font-style: normal;
+  font-weight: 400;
+  font-size: 24rpx;
+  line-height: 34rpx;
+  color: #95A8CB;
+}
+
+.func {
+  width: 100%;
+  height: 440rpx;
+  margin-top: -100rpx;
+  /* background: #F8F9FD; */
+  border-radius: 40rpx 40rpx 0 0;
+
+}
+
+.func-card-blue {
+  width: 47%;
+  height: 198rpx;
+  background: linear-gradient(209.99deg, #E6F2FE 14.33%, #D7EAFF 73.85%);
+  border-radius: 19rpx;
+}
+
+.func-card-purple {
+  width: 47%;
+  height: 198rpx;
+  background: linear-gradient(209.99deg, #E2E8FF 14.33%, #D5DDFF 73.85%);
+  border-radius: 19rpx;
+}
+
+.card-title {
+  margin-top: 24rpx;
+  display: flex;
+  height: 54rpx;
+  align-items: center;
+  width: 100%;
+  /* justify-content: center; */
+}
+
+.card-name {
+  font-family: 'PingFang HK';
+  font-style: normal;
+  font-weight: 600;
+  font-size: 32rpx;
+  line-height: 48rpx;
+  margin-left: 16rpx
+}
+
+.card-name-blue {
+  color: #1B365D;
+}
+
+.card-name-purple {
+  color: #606EB2;
+}
+
+.icon-arrow {
+  width: 32rpx;
+  height: 32rpx;
+  border-radius: 16rpx;
+  margin-left: 20rpx;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.icon-blue {
+  background-color: #B7DBFF;
+}
+
+.icon-purple {
+  background-color: #C3D0FF;
+}
+
+.icon-title {
+  width: 76rpx;
+  height: 84rpx;
+  margin-top: 20rpx;
+  margin-left: 20rpx
+}
+
+.card-bottom {
+  margin-top: 20rpx;
+  display: flex;
+  justify-content: space-evenly;
+}
+
+.card-bottom-button {
+  width: 40%;
+  background: #B7DBFF;
+  height: 80rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 15rpx;
+}
+
+.card-bottom-button-font {
+  font-family: 'PingFang HK';
+  font-style: normal;
+  font-weight: 500;
+  line-height: 31px;
+  color: #1B365D;
+}
+
+.card-bottom-button-blue {
+  background: #B7DBFF;
+  color: #1B365D;
+}
+
+.card-bottom-button-purple {
+  background: #C3D0FF;
+  color: #606EB2;
+}
+
+.combined-card {
+  margin: 10px 2%;
+  height: 430rpx;
+  background-color: #99A8E4;
+  border-radius: 15rpx;
+}
+
+.top-big-text {
+  font-family: 'PingFang HK';
+  font-style: normal;
+  font-weight: 600;
+  font-size: 32rpx;
+  line-height: 45rpx;
+  color: #FFFFFF;
+  margin-left: 18rpx;
+}
+
+.top-small-text {
+  font-family: 'PingFang HK';
+  font-style: normal;
+  font-weight: 400;
+  font-size: 24rpx;
+  line-height: 34rpx;
+  color: #FFFFFF;
+  margin-left: 12rpx;
+}
+
+.scroll-view {
+  white-space: nowrap;
+  display: flex;
+}
+
+.combined {
+  background-color: #FFFFFF;
+  border-radius: 15rpx;
+  display: inline-block;
+  height: 300rpx;
+  width: 75%;
+  margin: 0 30rpx;
+}
+
+.combined-name {
+  margin-top: 12rpx;
+  font-family: 'PingFang HK';
+  font-style: normal;
+  font-weight: 600;
+  font-size: 20rpx;
+  line-height: 28rpx;
+  color: #1B365D;
+}
+
+.combined-detail {
+  font-family: 'PingFang HK';
+  font-style: normal;
+  font-weight: 400;
+  font-size: 18rpx;
+  line-height: 25rpx;
+  color: #CAA977;
+}
+
+.combined-button-view {
+  margin-top: 15rpx;
+  display: flex;
+  justify-content: flex-end;
+}
+
+.combined-button {
+  padding: 4rpx 17rpx 0 17rpx;
+  margin-right: 17rpx;
+  height: 42rpx;
+  background: #FE4F09;
+  border-radius: 48rpx;
+  color: #FFFFFF;
+  font-family: 'PingFang SC';
+  font-style: normal;
+  font-weight: 400;
+  font-size: 15rpx;
+  line-height: 21rpx;
+  display: flex;
+  align-items: center;
+}
+
+.combined-imgs-view {
+  display: flex;
+  align-items: center;
+  justify-content: space-between
+}
+
+.sku-list {
+  display: flex;
+  justify-content: space-evenly;
+  margin-bottom: 20rpx;
+  width: 50%;
+}
+
+.sku-card {
+  width: 94%;
+  height: 495rpx;
+  background-color: #FFFFFF;
+  /* background-color: #1B365D; */
+  border-radius: 15px;
+  box-shadow: 0px 10px 20px rgba(225, 229, 238, 0.6);
+}
+
+.sku-name-detail-item {
+  width: 290rpx;
+  word-break: break-all;
+  overflow: hidden;
+  -webkit-line-clamp: 2;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+}
+
+.sku-image {
+  display: flex;
+  justify-content: center;
+}
+
+.sku-name {
+  font-family: 'PingFang HK';
+  font-style: normal;
+  font-weight: 500;
+  font-size: 26rpx;
+  line-height: 36rpx;
+  color: #1B365D;
+  display: flex;
+  justify-content: center;
+}
+
+.sku-name-detail {
+  font-family: 'PingFang HK';
+  font-style: normal;
+  font-weight: 400;
+  font-size: 22rpx;
+  line-height: 31rpx;
+  color: #CAA977;
+  display: flex;
+  justify-content: center;
+}
+
+.sku-bottom {
+  display: flex;
+  justify-content: center;
+}
+
+.sku-price {
+  line-height: 21rpx;
+  color: #FE4F09;
+  display: flex;
+  width: 290rpx;
+  line-height: 53rpx;
+  margin-top: 30rpx;
+  align-items: center;
+  justify-content: space-between;
+}
+
+
+
+
+.content {
+  text-align: justify;
+}
+
+
+.left,
+.right {
+  display: inline-block;
+  vertical-align: top;
+  width: 50%;
+}
+
+.van-icon-class {
+  width: 15%;
+  text-align: right;
+  padding-right: 10rpx;
+}
+
+.left-class {
+  color: #0072ff;
+  position: fixed;
+  left: 20rpx;
+  top: 196rpx;
+  width: 130rpx !important;
+
+}
+
+.right-class {
+  color: #0072ff;
+  position: fixed;
+  top: 88rpx;
+  width: 18% !important;
+
+}
+
+.thumb-class {
+  width: 85px !important;
+  padding-right: 55px;
+  height: 80px !important;
+}
+
+.van-card__thumb {
+  padding-right: 35px;
+  width: 50px !important;
+  height: 50px !important;
+}
+
+.label-class-two {
+  color: black !important;
+}
+
+.tags {
+  display: flex;
+  flex-wrap: wrap;
+  align-content: stretch;
+  width: 100%;
+  flex-direction: row;
+  justify-content: flex-start;
+  background: white;
+  align-items: center;
+  margin-bottom: 5rpx;
+  margin-top: 10rpx;
+}
+
+.box {
+  height: 200rpx;
+}
+
+
+
+.price-pop-class {
+  font-size: 13px;
+  width: 75%;
+}
+
+
+.tag-bom-item {
+  padding-right: 20rpx;
+}
+
+.tag-text {
+  overflow: hidden !important;
+  text-overflow: ellipsis !important;
+  white-space: nowrap;
+  word-wrap: break-all;
+  width: 100%;
+  height: 44rpx;
+  margin-top: -10rpx;
+  margin-bottom: -10rpx;
+}
+
+.van-field__label {
+  color: #95A8CB !important;
+}
+
+
+
+.button-pop-cell-class {
+  border-radius: 15rpx !important;
+}
+
+.button-pop-class {
+  width: 640rpx !important;
+  height: 88rpx !important;
+  background: #1B365D !important;
+  border-radius: 15rpx !important;
+  border: none !important;
+}
+
+.dk-popup {
+  background-color: transparent !important;
+  overflow-x: hidden;
+}
+
+.value-class {
+  flex: none !important;
+}
+
+/* 报表 */
+
+.main {
+  padding: 38rpx 34rpx 40rpx 34rpx;
+}
+
+
+.card-view {
+  background: #FFFFFF;
+  box-shadow: 0px 10px 20px rgba(225, 229, 238, 0.6);
+  border-radius: 15rpx;
+}
+
+.card-view2 {
+  background: #f8f8f8;
+  box-shadow: 0px 10px 20px rgba(225, 229, 238, 0.6);
+  border-radius: 15rpx;
+}
+
+.top-card {
+  padding: 20rpx 40rpx;
+  height: 50rpx;
+  line-height: 50rpx;
+}
+
+.top-card-title {
+  color: red;
+  font-weight: bold;
+  float: left;
+}
+
+.top-card-icon {
+  float: left;
+  margin-left: 40rpx;
+  height: 100%;
+}
+
+.top-card-icon van-icon {
+  height: 100%;
+}
+
+.top-card-money {
+  float: right;
+  /* color: #caa977; */
+}
+
+.top-card-percent {
+  float: right;
+  color: #002340;
+}
+.top-card-bottom{
+  display: flex;
+}
+.top-card-bottom-text {
+  font-size: 24rpx;
+  color: #95a8cb;
+  margin-right: 40rpx;
+  display: flex;
+}
+
+.top-card-bottom-text-title{
+  margin-right: 20rpx;
+}
+
+.card-view-header {
+  display: flex;
+  background: linear-gradient(90deg, #deeaff 0%, #FAFEFF 100%);
+  padding: 24rpx;
+  border-radius: 15rpx 15rpx 0px 0px;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.card-view-header2 {
+  display: flex;
+  /* background: linear-gradient(90deg, #D9F2F8 0%, #FAFEFF 100%); */
+  padding: 24rpx;
+  border-radius: 15rpx 15rpx 0px 0px;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.card-view-header-name {
+  font-style: normal;
+  font-weight: bolder;
+  font-size: 16px;
+  color: #1B365D;
+  font-family: 'PingFang HK';
+  display: flex;
+  align-items: center;
+}
+
+.card-view-header-name2 {
+  font-style: normal;
+  font-size: 16px;
+  color: black;
+  font-weight: bolder;
+  font-family: 'PingFang HK';
+  display: flex;
+  align-items: center;
+}
+
+.card-view-header-name3 {
+  font-size: 14px;
+  color: #c7c7c7;
+}
+
+.card-view-header-tags-tag {
+  width: 129rpx;
+  height: 54rpx;
+  /* border-radius: 27rpx; */
+  /* border: 1px solid #00A7B5; */
+  color: #95a8cb;
+  font-family: 'PingFang HK';
+  font-style: normal;
+  font-weight: 400;
+  font-size: 26rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.card-view-header-tags2 {
+  display: flex;
+}
+
+
+.card-view-content-data {
+  display: flex;
+  justify-content: space-between;
+  padding: 24rpx 24rpx 0 24rpx;
+}
+
+.card-view-content-data-left>view:nth-child(1) {
+  font-style: normal;
+  font-weight: 600;
+  font-family: 'PingFang SC';
+  font-size: 25px;
+  color: #1B365D;
+}
+
+
+.card-view-content-data-left>view:nth-child(2) {
+  font-style: normal;
+  font-weight: 400;
+  font-size: 14px;
+  color: #95A8CB;
+  font-family: 'PingFang SC';
+  margin-top: 13rpx;
+}
+
+
+.card-view-content-data-left>view:nth-child(3) {
+  font-style: normal;
+  font-weight: 400;
+  font-size: 10px;
+  color: #1B365D;
+  display: flex;
+  align-items: center;
+  line-height: 40rpx;
+  font-family: 'PingFang SC';
+  margin-top: 11rpx;
+}
+
+.card-view-content-data-left>view:nth-child(3)>view:nth-child(n),
+.card-view-content-data-left>view:nth-child(3)>view:nth-child(n)>view:nth-child(n) {
+  display: flex;
+  align-items: center;
+}
+
+.card-view-content-data-left>view:nth-child(3)>view:nth-child(2) {
+  margin-left: 19rpx;
+}
+
+.card-view-content-data-left {
+  padding: 20rpx 0;
+}
+
+.card-view-content-data-right {
+  padding: 20rpx 0;
+  display: grid;
+}
+
+.card-view-content-data-right>view:nth-child(1) {
+  font-style: normal;
+  font-weight: 400;
+  font-size: 14px;
+  color: #1B365D;
+  text-align: right;
+  font-family: 'PingFang SC';
+}
+
+.card-view-content-data-right>view:nth-child(2) {
+  font-style: normal;
+  font-weight: 400;
+  font-size: 10px;
+  color: #95A8CB;
+  margin-bottom: 12rpx;
+  text-align: right;
+  font-family: 'PingFang SC';
+}
+
+.card-view-content-data-right>view:nth-child(3) {
+  font-style: normal;
+  font-weight: 400;
+  font-size: 10px;
+  color: #95A8CB;
+  text-align: right;
+  font-family: 'PingFang SC';
+}
+
+
+/* 小电视 */
+.card-view-content-screen {
+  display: flex;
+  flex-flow: wrap;
+  justify-content: space-between;
+  padding: 0 16rpx 22rpx 16rpx;
+}
+
+.card-view-content-screen-item {
+  border-radius: 15rpx;
+  position: relative;
+  display: grid;
+  align-content: center;
+  width: 32%;
+  height: 108rpx;
+  background: #F8F8F8;
+}
+
+.card-view-content-screen-item:nth-child(n+4) {
+  margin-top: 12rpx;
+}
+
+.card-view-content-screen-item-absolute {
+  color: #1B365D;
+  background-color: #EBEEF3;
+  font-size: 10px;
+  font-family: 'PingFang SC';
+  line-height: 30rpx;
+  padding: 0 10rpx 0 10rpx;
+  border-radius: 15rpx;
+  width: max-content;
+  position: absolute;
+  right: 4.3rpx;
+  top: 4.3rpx;
+
+}
+
+.card-view-content-screen-item-important {
+  font-weight: 600;
+  font-size: 16px;
+  font-family: 'PingFang SC';
+  color: #1B365D;
+  justify-content: center;
+  display: flex;
+  align-items: flex-end;
+}
+
+.card-view-content-screen-item-important-small {
+  font-style: normal;
+  font-weight: 400;
+  font-size: 10px;
+  font-family: 'PingFang SC';
+}
+
+.card-view-content-screen-item-text {
+  font-style: normal;
+  font-weight: 400;
+  font-size: 10px;
+  color: #95A8CB;
+  text-align: center;
+  font-family: 'PingFang SC';
+}
+
+/* eachrts类卡片样式 */
+.card-view-content-data-echarts {
+  display: flex;
+  justify-content: space-between;
+  padding: 24rpx 24rpx 0 24rpx;
+}
+
+.card-view-content-data-echarts-data {
+  display: flex;
+  align-items: flex-end;
+  width: 100%;
+  border-bottom: 1px solid #E9F0FE;
+  margin-bottom: 10px;
+}
+
+.card-view-content-data-echarts-data>view:nth-child(1) {
+  font-family: 'PingFang HK';
+  font-style: normal;
+  font-weight: 600;
+  font-size: 25px;
+  line-height: 40px;
+  color: #1B365D;
+}
+
+.card-view-content-data-echarts-data>view:nth-child(2) {
+  font-family: 'PingFang SC';
+  font-style: normal;
+  font-weight: 400;
+  font-size: 14px;
+  line-height: 40px;
+  color: #95A8CB;
+  margin-left: 14rpx;
+}
+
+.card-view:nth-child(n+2) {
+  margin-top: 40rpx;
+}
+
+.card-view:last-child::after {
+  content: " ";
+  margin-bottom: 40rpx;
+}
+
+.small-cny {
+  font-size: 12px;
+}
+
+.small-small-font {
+  font-size: 10px;
+  line-height: 16px;
+}
+
+.header-icon {
+  box-shadow: 0px 4px 8px #CBE2E7;
+}
+
+/* .van-dropdown-menu {
+  border-radius: 40rpx 40rpx 0rpx 0rpx !important;
+} */
+
+
+
+/* 瀑布流 */
+
+/* pages/test/test.wxss */

pages/ec-canvas/ec-canvas-new.js

@@ -0,0 +1,61 @@
+// package3/pages/ec-canvas/ec-canvas-new.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+   
+})

pages/ec-canvas/ec-canvas-new.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

pages/ec-canvas/ec-canvas-new.wxml

@@ -0,0 +1,2 @@
+<!--package3/pages/ec-canvas/ec-canvas-new.wxml-->
+<text>package3/pages/ec-canvas/ec-canvas-new.wxml</text>

pages/ec-canvas/ec-canvas-new.wxss

@@ -0,0 +1 @@
+/* package3/pages/ec-canvas/ec-canvas-new.wxss */

pages/ec-canvas/ec-canvas.js

@@ -0,0 +1,250 @@
+import WxCanvas from './wx-canvas';
+import * as echarts from './echarts.min';
+
+let ctx;
+
+function compareVersion(v1, v2) {
+  v1 = v1.split('.')
+  v2 = v2.split('.')
+  const len = Math.max(v1.length, v2.length)
+
+  while (v1.length < len) {
+    v1.push('0')
+  }
+  while (v2.length < len) {
+    v2.push('0')
+  }
+
+  for (let i = 0; i < len; i++) {
+    const num1 = parseInt(v1[i])
+    const num2 = parseInt(v2[i])
+
+    if (num1 > num2) {
+      return 1
+    } else if (num1 < num2) {
+      return -1
+    }
+  }
+  return 0
+}
+
+Component({
+  properties: {
+    canvasId: {
+      type: String,
+      value: 'ec-canvas'
+    },
+
+    ec: {
+      type: Object
+    },
+
+    forceUseOldCanvas: {
+      type: Boolean,
+      value: false
+    }
+  },
+
+  data: {
+    isUseNewCanvas: false
+  },
+
+  ready: function () {
+    // Disable prograssive because drawImage doesn't support DOM as parameter
+    // See https://developers.weixin.qq.com/miniprogram/dev/api/canvas/CanvasContext.drawImage.html
+    echarts.registerPreprocessor(option => {
+      if (option && option.series) {
+        if (option.series.length > 0) {
+          option.series.forEach(series => {
+            series.progressive = 0;
+          });
+        }
+        else if (typeof option.series === 'object') {
+          option.series.progressive = 0;
+        }
+      }
+    });
+
+    if (!this.data.ec) {
+      console.warn('组件需绑定 ec 变量，例：<ec-canvas id="mychart-dom-bar" '
+        + 'canvas-id="mychart-bar" ec="{{ ec }}"></ec-canvas>');
+      return;
+    }
+
+    if (!this.data.ec.lazyLoad) {
+      this.init();
+    }
+  },
+
+  methods: {
+    init: function (callback) {
+      const version = wx.getSystemInfoSync().SDKVersion
+
+      const canUseNewCanvas = compareVersion(version, '2.9.0') >= 0;
+      const forceUseOldCanvas = this.data.forceUseOldCanvas;
+      const isUseNewCanvas = canUseNewCanvas && !forceUseOldCanvas;
+      this.setData({ isUseNewCanvas });
+
+      if (forceUseOldCanvas && canUseNewCanvas) {
+        console.warn('开发者强制使用旧canvas,建议关闭');
+      }
+
+      if (isUseNewCanvas) {
+      
+        // 2.9.0 可以使用 <canvas type="2d"></canvas>
+        this.initByNewWay(callback);
+      } else {
+        const isValid = compareVersion(version, '1.9.91') >= 0
+        if (!isValid) {
+          console.error('微信基础库版本过低，需大于等于 1.9.91。'
+            + '参见：https://github.com/ecomfe/echarts-for-weixin'
+            + '#%E5%BE%AE%E4%BF%A1%E7%89%88%E6%9C%AC%E8%A6%81%E6%B1%82');
+          return;
+        } else {
+          console.warn('建议将微信基础库调整大于等于2.9.0版本。升级后绘图将有更好性能');
+          this.initByOldWay(callback);
+        }
+      }
+    },
+
+    initByOldWay(callback) {
+      // 1.9.91 <= version < 2.9.0：原来的方式初始化
+      ctx = wx.createCanvasContext(this.data.canvasId, this);
+      const canvas = new WxCanvas(ctx, this.data.canvasId, false);
+
+      echarts.setCanvasCreator(() => {
+        return canvas;
+      });
+      // const canvasDpr = wx.getSystemInfoSync().pixelRatio // 微信旧的canvas不能传入dpr
+      const canvasDpr = 1
+      var query = wx.createSelectorQuery().in(this);
+      query.select('.ec-canvas').boundingClientRect(res => {
+        if (typeof callback === 'function') {
+          this.chart = callback(canvas, res.width, res.height, canvasDpr);
+        }
+        else if (this.data.ec && typeof this.data.ec.onInit === 'function') {
+          this.chart = this.data.ec.onInit(canvas, res.width, res.height, canvasDpr);
+        }
+        else {
+          this.triggerEvent('init', {
+            canvas: canvas,
+            width: res.width,
+            height: res.height,
+            canvasDpr: canvasDpr // 增加了dpr，可方便外面echarts.init
+          });
+        }
+      }).exec();
+    },
+
+    initByNewWay(callback) {
+      // version >= 2.9.0：使用新的方式初始化
+      const query = wx.createSelectorQuery().in(this)
+      query
+        .select('.ec-canvas')
+        .fields({ node: true, size: true })
+        .exec(res => {
+          const canvasNode = res[0].node
+          this.canvasNode = canvasNode
+
+          const canvasDpr = wx.getSystemInfoSync().pixelRatio
+          const canvasWidth = res[0].width
+          const canvasHeight = res[0].height
+
+          const ctx = canvasNode.getContext('2d')
+
+          const canvas = new WxCanvas(ctx, this.data.canvasId, true, canvasNode)
+          echarts.setCanvasCreator(() => {
+            return canvas
+          })
+
+          if (typeof callback === 'function') {
+            this.chart = callback(canvas, canvasWidth, canvasHeight, canvasDpr)
+          } else if (this.data.ec && typeof this.data.ec.onInit === 'function') {
+            this.chart = this.data.ec.onInit(canvas, canvasWidth, canvasHeight, canvasDpr)
+          } else {
+            this.triggerEvent('init', {
+              canvas: canvas,
+              width: canvasWidth,
+              height: canvasHeight,
+              dpr: canvasDpr
+            })
+          }
+        })
+    },
+    canvasToTempFilePath(opt) {
+      if (this.data.isUseNewCanvas) {
+        // 新版
+        const query = wx.createSelectorQuery().in(this)
+        query
+          .select('.ec-canvas')
+          .fields({ node: true, size: true })
+          .exec(res => {
+            const canvasNode = res[0].node
+            opt.canvas = canvasNode
+            wx.canvasToTempFilePath(opt)
+          })
+      } else {
+        // 旧的
+        if (!opt.canvasId) {
+          opt.canvasId = this.data.canvasId;
+        }
+        ctx.draw(true, () => {
+          wx.canvasToTempFilePath(opt, this);
+        });
+      }
+    },
+
+    touchStart(e) {
+      if (this.chart && e.touches.length > 0) {
+        var touch = e.touches[0];
+        var handler = this.chart.getZr().handler;
+        handler.dispatch('mousedown', {
+          zrX: touch.x,
+          zrY: touch.y
+        });
+        handler.dispatch('mousemove', {
+          zrX: touch.x,
+          zrY: touch.y
+        });
+        handler.processGesture(wrapTouch(e), 'start');
+      }
+    },
+
+    touchMove(e) {
+      if (this.chart && e.touches.length > 0) {
+        var touch = e.touches[0];
+        var handler = this.chart.getZr().handler;
+        handler.dispatch('mousemove', {
+          zrX: touch.x,
+          zrY: touch.y
+        });
+        handler.processGesture(wrapTouch(e), 'change');
+      }
+    },
+
+    touchEnd(e) {
+      if (this.chart) {
+        const touch = e.changedTouches ? e.changedTouches[0] : {};
+        var handler = this.chart.getZr().handler;
+        handler.dispatch('mouseup', {
+          zrX: touch.x,
+          zrY: touch.y
+        });
+        handler.dispatch('click', {
+          zrX: touch.x,
+          zrY: touch.y
+        });
+        handler.processGesture(wrapTouch(e), 'end');
+      }
+    }
+  }
+});
+
+function wrapTouch(event) {
+  for (let i = 0; i < event.touches.length; ++i) {
+    const touch = event.touches[i];
+    touch.offsetX = touch.x;
+    touch.offsetY = touch.y;
+  }
+  return event;
+}

pages/ec-canvas/ec-canvas.json

@@ -0,0 +1,4 @@
+{
+  "component": true,
+  "usingComponents": {}
+}

pages/ec-canvas/ec-canvas.wxml

@@ -0,0 +1,4 @@
+<!-- 新的：接口对其了H5 -->
+<canvas wx:if="{{isUseNewCanvas}}" type="2d" class="ec-canvas" canvas-id="{{ canvasId }}" bindinit="init" bindtouchstart="{{ ec.disableTouch ? '' : 'touchStart' }}" bindtouchmove="{{ ec.disableTouch ? '' : 'touchMove' }}" bindtouchend="{{ ec.disableTouch ? '' : 'touchEnd' }}"></canvas>
+<!-- 旧的 -->
+<canvas wx:else class="ec-canvas" canvas-id="{{ canvasId }}" bindinit="init" bindtouchstart="{{ ec.disableTouch ? '' : 'touchStart' }}" bindtouchmove="{{ ec.disableTouch ? '' : 'touchMove' }}" bindtouchend="{{ ec.disableTouch ? '' : 'touchEnd' }}"></canvas>

pages/ec-canvas/ec-canvas.wxss

@@ -0,0 +1,4 @@
+.ec-canvas {
+  width: 100%;
+  height: 100%;
+}

pages/ec-canvas/wx-canvas.js

@@ -0,0 +1,121 @@
+export default class WxCanvas {
+  constructor(ctx, canvasId, isNew, canvasNode) {
+    this.ctx = ctx;
+    this.canvasId = canvasId;
+    this.chart = null;
+    this.isNew = isNew
+    if (isNew) {
+      this.canvasNode = canvasNode;
+    }
+    else {
+      this._initStyle(ctx);
+    }
+
+    // this._initCanvas(zrender, ctx);
+
+    this._initEvent();
+  }
+
+  getContext(contextType) {
+    if (contextType === '2d') {
+      return this.ctx;
+    }
+  }
+
+  // canvasToTempFilePath(opt) {
+  //   if (!opt.canvasId) {
+  //     opt.canvasId = this.canvasId;
+  //   }
+  //   return wx.canvasToTempFilePath(opt, this);
+  // }
+
+  setChart(chart) {
+    this.chart = chart;
+  }
+
+  attachEvent() {
+    // noop
+  }
+
+  detachEvent() {
+    // noop
+  }
+
+  _initCanvas(zrender, ctx) {
+    zrender.util.getContext = function () {
+      return ctx;
+    };
+
+    zrender.util.$override('measureText', function (text, font) {
+      ctx.font = font || '12px sans-serif';
+      return ctx.measureText(text);
+    });
+  }
+
+  _initStyle(ctx) {
+    var styles = ['fillStyle', 'strokeStyle', 'globalAlpha',
+      'textAlign', 'textBaseAlign', 'shadow', 'lineWidth',
+      'lineCap', 'lineJoin', 'lineDash', 'miterLimit', 'fontSize'];
+
+    styles.forEach(style => {
+      Object.defineProperty(ctx, style, {
+        set: value => {
+          if (style !== 'fillStyle' && style !== 'strokeStyle'
+            || value !== 'none' && value !== null
+          ) {
+            ctx['set' + style.charAt(0).toUpperCase() + style.slice(1)](value);
+          }
+        }
+      });
+    });
+
+    ctx.createRadialGradient = () => {
+      return ctx.createCircularGradient(arguments);
+    };
+  }
+
+  _initEvent() {
+    this.event = {};
+    const eventNames = [{
+      wxName: 'touchStart',
+      ecName: 'mousedown'
+    }, {
+      wxName: 'touchMove',
+      ecName: 'mousemove'
+    }, {
+      wxName: 'touchEnd',
+      ecName: 'mouseup'
+    }, {
+      wxName: 'touchEnd',
+      ecName: 'click'
+    }];
+
+    eventNames.forEach(name => {
+      this.event[name.wxName] = e => {
+        const touch = e.touches[0];
+        this.chart.getZr().handler.dispatch(name.ecName, {
+          zrX: name.wxName === 'tap' ? touch.clientX : touch.x,
+          zrY: name.wxName === 'tap' ? touch.clientY : touch.y
+        });
+      };
+    });
+  }
+
+  set width(w) {
+    if (this.canvasNode) this.canvasNode.width = w
+  }
+  set height(h) {
+    if (this.canvasNode) this.canvasNode.height = h
+  }
+
+  get width() {
+    if (this.canvasNode)
+      return this.canvasNode.width
+    return 0
+  }
+  get height() {
+    if (this.canvasNode)
+      return this.canvasNode.height
+    return 0
+  }
+}