Merge branch 'v3.5.1' of http://git.ycjcjy.com/zhiyuxing/miniapp-v3 into v3.5.1

# Conflicts:
#	src/components/charts/Line.js

src/components/charts/Line.js

 import echarts from '../ec-canvas/echarts'
 import './style.scss'
 
-function initChart(callback, options) {
+function initChart(options, callback) {
   return function (canvas, width, height) {
     const chart = echarts.init(canvas, null, {
       width: width,
       height: height
     });
     canvas.setChart(chart);
-    chart.setOption(options);
+    chart.setOption(options);    
     callback && callback(chart);
     return chart;
   }
 }
 
+function createLineOptions(source = []) {
+  const colorWithOpacity = op => `rgba(187,156,121, ${op})`
+
+  const defaultOpt = {
+    color: [colorWithOpacity(1)],
+    xAxis: {
+      type: 'category',
+      boundaryGap: false,
+      axisLabel: {
+        textStyle: {
+          color: '#666'
+        }
+      }
+
+    },
+    yAxis: {
+      type: 'value',
+      axisLabel: {
+        textStyle: {
+          color: '#666'
+        }
+      }
+    },
+    grid: {
+      left: '10%',
+      right: '8%',
+      bottom: '12%',
+      top: '10%',
+    },
+    series: [],
+  }
+
+  // 数据展示只展示 5 个
+  const endValue = source.length - 1 > 0 ? source.length - 1 : 0
+  const startValue = endValue - 5 > 0 ? endValue - 5 : 0
+
+  return {
+    ...defaultOpt,
+    dataset: { source },
+    dataZoom: [{
+      type: 'slider',
+      startValue, endValue,
+      show: true,
+      xAxisIndex: [0],
+      handleSize: 10,//滑动条的 左右2个滑动条的大小  
+      height: 20,//组件高度  
+      left: 30, //左边的距离  
+      right: 30,//右边的距离  
+      bottom: 0,//下边的距离  
+      handleColor: 'rgba(0,0,0,0.1)',//h滑动图标的颜色  
+      realtime : true,
+      handleStyle: {
+        borderColor: "#999",
+        borderWidth: "1",
+        shadowBlur: 2,
+        background: "rgba(0,0,0,0.1)",
+        shadowColor: "rgba(0,0,0,0.1)",
+      },
+      backgroundColor: 'rgba(0,0,0,0.1)',//两边未选中的滑动条区域的颜色  
+      showDataShadow: false,//是否显示数据阴影 默认auto  
+      showDetail: false,
+
+    }],
+    series: [{
+      type: 'line',
+      dimensions: ['name', 'value'],
+      symbolSize: 6,
+      smooth: true,
+      label: {
+        show: true,
+        formatter: '{@value}人'
+      },
+      lineStyle: {
+        shadowColor: colorWithOpacity(0.5),
+        shadowBlur: 5,
+        shadowOffsetY: 7
+      },
+      areaStyle: {
+        color: {
+          type: 'linear',
+          x: 0,
+          y: 0,
+          x2: 0,
+          y2: 1,
+          colorStops: [{
+            offset: 0, color: colorWithOpacity(0.2) // 0% 处的颜色
+          }, {
+            offset: 1, color: colorWithOpacity(0) // 100% 处的颜色
+          }],
+          global: false,
+        }
+      },
+    }],
+  }
+}
+
 /**
  * 传入 source 的格式为 [{ name: xxx, value: xxx }, {}]
  */
     }
   }
 
-  // this.echart
-  echart = null
+  // this.ecComponent
+  chart = null;
   ecComponent = null
 
   state = {
     ec: { lazyLoad: true },
+    isDisposed: false,
   }
 
-  // 禁止 props 变更时渲染
-  shouldComponentUpdate(nextProps) {
-    console.log('--nextProps--->', nextProps)
-
-    this.refreshChart(nextProps.source)
-
-    return false
+  componentDidShow() {
+    this.setState({ isDisposed: false })
   }
 
-  handleEcComponent(ref) {
-    this.ecComponent = ref
+  componentDidHide() {
+    this.setState({ isDisposed: true })
   }
 
-  handleChart(chart) {
-    this.echart = chart
+  componentDidMount() {
+    this.ecComponent = this.$scope.selectComponent(`#${this.props.lid}`)
+    this.init(this.props)
   }
 
-  createOptions(source = []) {
-    const colorWithOpacity = op => `rgba(187,156,121, ${op})`
-
-    const defaultOpt = {
-      color: [colorWithOpacity(1)],
-      xAxis: {
-        type: 'category',
-        boundaryGap: false,
-        axisLabel: {
-          textStyle: {
-            color: '#666'
-          }
-        }
+  componentWillReceiveProps(nextProps) {
+    // 简单优化, 不显示的组件不更新
+    // 但是有个 bug 。如果此时有 props 更新, 会导致页面绘制的数据错误
+    if (this.state.isDisposed) return
 
-      },
-      yAxis: {
-        type: 'value',
-        axisLabel: {
-          textStyle: {
-            color: '#666'
-          }
-        }
-      },
-      grid: {
-        left: '10%',
-        right: '9%',
-        bottom: '13%',
-        top: '11%',
-      },
-      series: [],
-    }
-
-    // 数据展示只展示 5 个
-    const endValue = source.length - 1 > 0 ? source.length - 1 : 0
-    const startValue = endValue - 5 > 0 ? endValue - 5 : 0
-
-    return {
-      ...defaultOpt,
-      dataset: { source },
-      dataZoom: [{
-        type: 'slider',
-        startValue, endValue,
-        show: true,
-        xAxisIndex: [0],
-        handleSize: 10,//滑动条的 左右2个滑动条的大小 
-        height: 24,//组件高度  
-        left: 10, //左边的距离  
-        right: 10,//右边的距离  
-        bottom: 0,//下边的距离  
-        handleColor: 'rgba(0,0,0,0.1)',//h滑动图标的颜色  
-        realtime : true,
-        handleStyle: {
-          borderColor: "#999",
-          borderWidth: "1",
-          shadowBlur: 2,
-          background: "rgba(0,0,0,0.1)",
-          shadowColor: "rgba(0,0,0,0.1)",
-        },
-        backgroundColor: 'rgba(0,0,0,0.1)',//两边未选中的滑动条区域的颜色  
-        showDataShadow: false,//是否显示数据阴影 默认auto  
-        showDetail: false,
-
-      }],
-      series: [{
-        type: 'line',
-        dimensions: ['name', 'value'],
-        symbolSize: 6,
-        smooth: true,
-        label: {
-          show: true,
-          formatter: '{@value}人'
-        },
-        lineStyle: {
-          shadowColor: colorWithOpacity(0.5),
-          shadowBlur: 5,
-          shadowOffsetY: 7,
-        },
-        areaStyle: {
-          color: {
-            type: 'linear',
-            x: 0,
-            y: 0,
-            x2: 0,
-            y2: 1,
-            colorStops: [{
-              offset: 0, color: colorWithOpacity(0.2) // 0% 处的颜色
-            }, {
-              offset: 1, color: colorWithOpacity(0) // 100% 处的颜色
-            }],
-            global: false,
-          }
-        },
-      }],
+    // 简单的性能优化, 只有数据改变了才重新绘图
+    if (JSON.stringify(nextProps.source) != JSON.stringify(this.props.source)) {
+      this.init(nextProps)
     }
   }
 
-  refreshChart(source) {
-    const options = this.createOptions(source)
-
-    if (!this.echart) {
-      if (this.ecComponent) {
-        const initFunc = initChart(this.handleChart.bind(this), options)
-        this.ecComponent.init(initFunc)
-      } else {
-        console.warn('echart componet not ready')
+  init = (props) => {
+    const tk = setTimeout(() => {
+      if (this.ecComponent && props.source && props.source.length) {
+        const options = createLineOptions(props.source)
+        this.ecComponent.init(initChart(options, chart => (this.chart = chart)))
       }
-    } else {
-      this.echart.setOption(options)
-    }
+
+      clearTimeout(tk)
+    }, 500)
   }
 
   render() {
-    // this.refreshChart(this.props.source)
     return (
       <View style="width:100vw;height:480rpx;position: relative;">
         <View className="map-container">
-          <ec-canvas ref={this.handleEcComponent} ec={this.state.ec}></ec-canvas>
+          <ec-canvas id={this.props.lid} ec={this.state.ec}></ec-canvas>
         </View>
       </View>
     )

src/pages/activity/detail/index.js

         return
       }
 
-      const { userInfo: { person } } = this.props
+      const { userInfo: { person, miniApp } } = this.props
       const { avatarurl, nickname, personId } = person
       const { detail: { dynamicId, posters, createDate } } = this.state
       const payload = {
           title: posters[0].posterTitle,//海报标题
           posterDescription: posters[0].posterDescription,//海报标题
           createDate: createDate,//时间
+          miniAppName: miniApp.name, // 小程序名称
         }
         resolve(data)
       })

src/pages/activity/detail/poster.js

       {
         x: 100,
         y: 1065,
-        text: '橙蕉',
+        text: data.miniAppName,
         fontSize: 34,
         color: 'red',
         baseLine: 'middle',
         lineHeight: 48,
-        width: 120,
+        width: (data.miniAppName || '').length * 30 + 60,
         zIndex: 11
       },
       {
-        x: 190,
+        x: (data.miniAppName || '').length * 30 + 130,
         y: 1065,
         text: '热门活动',
         fontSize: 26,

src/pages/card/index.js

         resolve(posterData)
         return
       }
-      const { userInfo: { person }, projectDetail: { buildingId }, cardInfo } = this.props
+      const { userInfo: { person, miniApp }, projectDetail: { buildingId }, cardInfo } = this.props
       const { id } = cardInfo
       const { personId } = person
       const payload = {
         "page": 'pages/card/index',
       }
       getMiniQrcode(payload).then(qrcode => {
-        let data = Object.assign({ qrcode }, cardInfo)
+        let data = Object.assign({ qrcode, miniAppName: miniApp.name }, cardInfo)
         resolve(data)
       })
     })

src/pages/card/poster.js

       {
         x: 170,
         y: 755,
-        text: '橙蕉',
+        text: data.miniAppName,
         fontSize: 34,
         color: 'red',
         baseLine: 'middle',
         lineHeight: 48,
-        width: 120,
+        width: (data.miniAppName || '').length * 30 + 60,
         zIndex: 100
       },
       {
-        x: 260,
+        x: (data.miniAppName || '').length * 30 + 200,
         y: 755,
         text: '查看主页',
         fontSize: 26,
       {
         x: 320,
         y: 1075,
-        text: '橙蕉',
+        text: data.miniAppName,
         fontSize: 32,
         color: '#b5b3b3',
         baseLine: 'middle',

src/pages/news/detail/index.js

         resolve(posterData)
         return
       }
-      const { userInfo: { person } } = this.props
+      const { userInfo: { person, miniApp } } = this.props
       const { avatarurl, nickname, personId } = person
       const { newsId, detail: { posters, newsName, createDate } } = this.state
       const payload = {
           title: posters[0].posterTitle,//资讯海报标题
           posterDescription: posters[0].posterDescription,//资讯海报描述
           createDate: createDate,//资讯时间
-          poster: posters[0].posterImg
+          poster: posters[0].posterImg,
+          miniAppName: miniApp.name,
         }
         resolve(data)
       })

src/pages/news/detail/poster.js

       {
         x: 100,
         y: 1065,
-        text: '橙蕉',
+        text: data.miniAppName,
         fontSize: 34,
         color: 'red',
         baseLine: 'middle',
         lineHeight: 48,
-        width: 120,
+        width: (data.miniAppName || '').length * 30 + 60,
         zIndex: 11
       },
       {
-        x: 190,
+        x: (data.miniAppName || '').length * 30 + 130,
         y: 1065,
         text: '查看资讯',
         fontSize: 26,

src/pages/person/customerAnalysis/analysis.js

 import LineChart from "../../../components/charts/Line";
 const nothing = require('@assets/person/nothing.png')
 
+const rand = n => Math.random().toString(36).substr(2, n)
 
 @connect(({ user, city }) => ({ user, city }))
 export default class analysis extends Taro.Component {
     chartInfo: [],
     chartInfo2: [],
     chartInfo3: [],
+    lineIds: [ rand(7), rand(7), rand(7) ],
   }
 
   componentWillUnmount() {
 
     const tabList = [{ title: '新增客户' }, { title: '跟进客户' }, { title: '到访客户' }]
     const dailyMonth = ['日', '月']
-    const { sexInfo, chartInfo, chartInfo2, chartInfo3, checkedWhich, current } = this.state
+    const { sexInfo, chartInfo, chartInfo2, chartInfo3, checkedWhich, current, lineIds } = this.state
 
     return (
       <View>
               </View>
               {
                 chartInfo.length &&
-                <LineChart source={chartInfo} />
+                <LineChart source={chartInfo} lid={lineIds[0]} />
               }
               {
                 !chartInfo.length &&
                 </View>
               </View>
               {chartInfo2.length &&
-                <LineChart source={chartInfo2} />
+                <LineChart source={chartInfo2} lid={lineIds[1]}/>
               }
               {
                 !chartInfo2.length &&
               </View>
               {
                 chartInfo3.length &&
-                <LineChart source={chartInfo3} />
+                <LineChart source={chartInfo3} lid={lineIds[2]} />
               }
               {
                 !chartInfo3.length &&

src/pages/project/detail/index.js

         return
       }
       const {
-        userInfo: { person: { avatarurl, nickname, personId } },
+        userInfo: { person: { avatarurl, nickname, personId }, miniApp },
         projectDetail: { posters, buildingId, poster, price, buildingRestaurant, createDate, buildingName, tel, buildingTag, uvList = {} }
       } = this.props
       const { total = 0 } = uvList
           buildingName: posters[0].posterTitle,//标题
           createDate: createDate,//时间
           buildingTag: buildingTag,//标签,
-          total: total//围观人数
+          total: total, //围观人数
+          miniAppName: miniApp.name,
         }
         resolve(data)
       })

src/pages/project/detail/poster.js

       {
         x: 100,
         y: 1070,
-        text: '橙蕉',
+        text: data.miniAppName,
         fontSize: 34,
         color: 'red',
         baseLine: 'middle',
         lineHeight: 48,
-        width: 120,
+        width: (data.miniAppName || '').length * 30 + 60,
         zIndex: 11
       },
       {
-        x: 190,
+        x: (data.miniAppName || '').length * 30 + 130,
         y: 1070,
         text: '项目详情',
         fontSize: 26,

src/pages/shop/index.js

 import { AtTabs, AtTabsPane } from 'taro-ui'
 import "taro-ui/dist/style/components/tabs.scss"
 import './index.scss'
-import {getThumbnail } from '@utils/tools'
+import { getThumbnail } from '@utils/tools'
 // import Search from '@components/search'
 import Banner from './banner'
 import ready from '@utils/ready'
     goodsList: [],
     user: {},
     current: 0,
-    points:0
+    points: 0
   }
 
-  componentDidShow() {
+  componentDidShow () {
 
     Taro.showLoading()
     ready.queue(() => {
     Taro.hideLoading()
   }
 
-  loadBannerList() {
+  loadBannerList () {
     const payload = {
       showPosition: 'mall',
       cityId: this.props.curCity.id
     })
   }
 
-  loadList() {
+  loadList () {
 
 
     Taro.showLoading()
     })
   }
 
-  loadGoodsBuilding() {
+  loadGoodsBuilding () {
     const payload = {
 
       cityId: this.props.curCity.id
     })
   }
 
-  handleClick(value) {
+  handleClick (value) {
 
     this.setState({
       current: value
 
   }
 
-  onViewDetail(item) {
+  onViewDetail (item) {
     Taro.navigateTo({
       url: `/pages/shop/detail/index?id=${item.goodsId}`
     })
   }
 
-  goPointRecords() {
+  goPointRecords () {
     const { person: { points } } = this.props.userInfo
     Taro.navigateTo({
       url: `/pages/shop/integralDetail/index?points=` + points
     })
   }
 
-  goPointRule() {
+  goPointRule () {
     Taro.navigateTo({
       url: `/pages/shop/rule/index`
     })
   }
 
-  handleLocationClick() {
+  handleLocationClick () {
     Taro.navigateTo({
       url: `/pages/city/index`
     })
   }
 
-  doSign() {
+  doSign () {
     const { user: { id, havaSigned } } = this.state
     if (havaSigned) {
       return
     })
   }
 
-  loadUserInfo() {
+  loadUserInfo () {
     // debugger
     queryUserInfo().then(user => {
       console.log(user, "user")
     })
   }
 
-  renderLogin() {
+  renderLogin () {
     return <Authorize></Authorize>
   }
   handleBannerClick = (item) => {
     console.log(this, "this")
     this.redirectTo(item)
   }
-  redirectTo({ targetId, contentType, buildingId } = {}) {
+  redirectTo ({ targetId, contentType, buildingId } = {}) {
     switch (contentType) {
       // 项目
       case 'project':
     }
   }
 
-  renderGoods() {
+  renderGoods () {
     const { goods: { records = [] } } = this.props
     const { goodsList, goodsBuilding, current } = this.state
 
             {
               goodsList.length &&
               goodsList.map(item => (
-                
+
                 <View className="item" key={item.goodsId} onClick={this.onViewDetail.bind(this, item)}>
-                  {console.log(item,'--item---')}
+                  {console.log(item, '--item---')}
                   <Image className="item__img" mode="aspectFill" src={item.imgUrl} />
                   <View className="item__title">{item.goodsName}</View>
                   <View className="item__des">
         {
           goodsBuilding && goodsBuilding.length >= 2 &&
           <View className="list__wrap">
-            <View className="hot_title" style={{marginBottom:'0'}}>热门商品</View>
+            <View className="hot_title" style={{ marginBottom: '0' }}>热门商品</View>
             <AtTabs scroll tabDirection='horizontal' current={current} tabList={goodsBuilding} onClick={this.handleClick.bind(this)}>
 
               {goodsBuilding.map((l_item, index) => (
     )
   }
 
-  renderDetail() {
+  renderDetail () {
     const { user, points } = this.state
     const { userInfo: { person }, curCity } = this.props
     const { bannerList = [] } = this.state
     );
   }
 
-  render() {
+  render () {
     const { person: { phone, tel } } = this.props.userInfo
 
     return (