为了账号安全,请及时绑定邮箱和手机立即绑定

【金秋打卡】第2天 全新升级,基于Vue3新标准,打造后台综合解决方案 第二讲

标签:
Html5 JavaScript

课程章节: 标准化大厂编程规范解决方案之ESLint + Git Hooks

主讲老师: Sunday

课程内容:

今天学习的内容包括:

为什么需要编程规范

课程收获:

2.1 心得:

var QQMapWX = require('../../utils/qqmap-wx-jssdk.min.js');
var utils = require("../../utils/util.js");
var app = getApp();
var qqmapsdk = new QQMapWX({
  key: app.globalData.QQMapKey
});

Page({

  /**
   * 页面的初始数据
   */
  data: {
    items: [],
    fromLatLng: '',
    location: '',
    shareOrderId: '',
    scenicSpotDetail: {},
    isCollection: false,
    txtHidden1: false,
    txtHidden2: false,
    hiddenView1: false,
    hiddenView2: false,
    img: "../../images/gobg.png",
    maskHidden: false,
    params: {
      scenicSpotId: ''
    },
    imgUrls: [],
    indicatorDots: false,
    autoplay: true,
    circular: true,
    interval: 3000,
    duration: 1000,
    beforeColor: "white", //指示点颜色
    afterColor: "red", //当前选中的指示点颜色,
    QrCodeImg: "",
    ShareImg: ""
  },


  setIndexFilterData: function (res) {
    var that = this;
    //console.log(res.data)
    this.setData({
      items: res.data
    });
    //console.log(that.data.items)
  },

  addCollection: function () {
    var that = this;
    var openid = wx.getStorageSync('wxOpenId');
    if (!openid) {
      wx.navigateTo({
        url: '../login/login'
      })
    }

    that.joinCollection(openid);
  },

  joinCollection: function (openId) {
    var that = this;
    if (openId.length > 0) {
      wx.request({
        url: app.getUrl(app.globalData.joinCollection),
        data: {
          scenicSpotId: that.data.params.scenicSpotId,
          openId: openId
        },
        success: function (res) {
          var result = res.data;
          if (result.result) {
            if (result.data == 1) {
              that.setData({
                isCollection: true
              });
              wx.showToast({
                title: '收藏成功',
                icon: 'success',
                duration: 2000
              })
            } else if (result.data == 2) {
              that.setData({
                isCollection: false
              });
              wx.showToast({
                title: '取消收藏成功',
                icon: 'success',
                duration: 2000
              })
            } else {
              wx.showToast({
                title: '操作失败',
                icon: 'fail',
                duration: 2000
              })
            }
          };
        },
        fail: function (err) {
          wx.hideLoading();
        }, //请求失败
        complete: function () { } //请求完成后执行的函数
      })
    } else {
      wx.navigateTo({
        url: '../login/login'
      })
    }
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    var that = this;
    //console.log(app.globalData.userLocation)   
    if (options.q) {
      //获取二维码的携带的链接信息
      var qrUrl = decodeURIComponent(options.q)
      that.data.params.scenicSpotId = utils.getQueryString(qrUrl, 'scenicSpotId');
    }
    else {
      that.data.params.scenicSpotId = options.scenicSpotId;
      var shareOrderId = options.shareOrderId;
      if (shareOrderId != undefined && shareOrderId.length > 0) {
        that.data.shareOrderId = shareOrderId;
        that.joinShareRecord();
      }
    }

    that.getLocation();
    that.getScenicSpotDetailInfo();
  },
  getLocation: function () {
    var that = this;
    wx.getLocation({
      type: 'wgs84',
      success: function (res) {
        // wx.setStorage({
        //   key: "o2oFromLatLng",
        //   data: res.latitude + "," + res.longitude
        // });
        that.setData({
          fromLatLng: res.latitude + "," + res.longitude,
        });
        that.getStoreList(1);
      },
      fail: function () {
        that.setData({
          location: ''
        });
      }
    })
  },
  joinShareRecord: function () {
    var that = this;
    var scenicSpotId = that.data.params.scenicSpotId;
    var shareOrderId = that.data.shareOrderId;
    wx.request({
      url: app.getUrl(app.globalData.joinShareRecord),
      data: {
        scenicSpotId: that.data.params.scenicSpotId,
        orderId: shareOrderId
      },
      success: function (res) {
        var result = res.data;
        if (result.result) {
        }
      },
      fail: function (err) {
      }, //请求失败
      complete: function () { } //请求完成后执行的函数
    });
  },
  getStoreList: function (pageIndex) {
    var that = this;
    if (that.data.loadDataing) {
      return;
    }
    var latlng = that.data.fromLatLng.split(",");
    qqmapsdk.reverseGeocoder({
      coord_type: 1,
      location: {
        latitude: latlng[0],
        longitude: latlng[1]
      },
      success: function (qqres) {
        //console.log(qqres)
        that.setData({
          location: qqres.result.address_component.city
        });
        app.globalData.userLocation = qqres.result.address_component.city;
      },
      fail: function (res) {
        wx.showToast({
          title: '获取位置失败'
        })
      }
    });
  },

  previewImg: function (e) {
    var src = e.currentTarget.dataset.src;
    var srcList = e.currentTarget.dataset.srclist;
    var previewList = [];
    for (var i = 0; i < srcList.length; i++) {
      previewList.push(srcList[i].CommentImage);
    }

    //图片预览
    wx.previewImage({
      current: src, // 当前显示图片的http链接
      urls: previewList // 需要预览的图片http链接列表
    })
  },
  onShareAppMessage: function (res) {
    var that = this;
    return {
      title: '盘个团旅游',
      path: '/pages/scenicDetail/scenicDetail?scenicSpotId=' + that.data.params.scenicSpotId,
      imageUrl: ''
    }
  },
  onShow: function () {
    var that = this;
    var openid = wx.getStorageSync('wxOpenId');
    if (openid) {
      wx.request({
        url: app.getUrl(app.globalData.getMyCollection),
        data: {
          scenicSpotId: that.data.params.scenicSpotId,
          openId: openid
        },
        success: function (res) {
          var result = res.data;
          if (result.result) {
            that.setData({
              isCollection: result.data
            });

          }
          wx.hideLoading();
        },
        fail: function (err) {
          wx.hideLoading();
        }, //请求失败
        complete: function () { } //请求完成后执行的函数
      });
    }
  },
  getScenicSpotDetailInfo: function () {
    var that = this;
    wx.showLoading({
      title: "数据加载中..."
    });
    var openid = wx.getStorageSync('wxOpenId');
    //console.log(app.globalData.userLocation)
    wx.request({
      url: app.getUrl(app.globalData.getScenicSpotDetailInfo),
      data: {
        scenicSpotId: that.data.params.scenicSpotId,
        openId: openid
      },
      success: function (res) {
        var result = res.data;
        if (result.result) {
          wx.setNavigationBarTitle({
            title: result.data.Name
          });

          var shareStr = that.data.params.scenicSpotId + 1;
          var qrStr = that.data.params.scenicSpotId + 2;
          utils.base64src(result.data.ShareImg, shareStr, res => {
            // console.log(res) // 返回图片地址,直接赋值到image标签即可
            that.setData({
              ShareImg: res,
            });
          });

          utils.base64src(result.data.QrCode, qrStr, res => {
            // console.log(res) // 返回图片地址,直接赋值到image标签即可
            that.setData({
              QrCodeImg: res,
            });
          });


          that.setData({
            scenicSpotDetail: result.data
          });

          if (result.data != null) {
            that.setData({
              imgUrls: result.data.ImgList
            });
          }

        }
        wx.hideLoading();
      },
      fail: function (err) {
        wx.hideLoading();
      }, //请求失败
      complete: function () { } //请求完成后执行的函数
    });
  },
  reserve: function (e) {
    // console.log(e);
    app.getOpenId(function (openid) {
      if (openid) {
        wx.navigateTo({
          url: e.target.dataset.url
        })
      } else {
        wx.navigateTo({
          url: '../login/login'
        })
      }
    }, 'scenicDetail');
  },
  seeMap: function (e) {
    var address = e.currentTarget.dataset.address
    qqmapsdk.geocoder({
      address: address,
      success: function (res) {
        //console.log(res.result.location.lng);
        var latitude = res.result.location.lat
        var longitude = res.result.location.lng
        wx.openLocation({
          latitude: latitude,
          longitude: longitude,
          address: address,
          scale: 28
        })

      },
      fail: function (res) {
        // console.log(res);
      },
      complete: function (res) {
        // console.log(res);
      }
    });
  },

})

图片描述

点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消