作者 liaolinfeng

测试提交

  1 +//app.js
  2 +App({
  3 + post(url, data, headerParams) {
  4 + /**
  5 + * 自定义post函数,返回Promise
  6 + * +-------------------
  7 + * @param {String} url 接口网址
  8 + * @param {arrayObject} data 要传的数组对象 like: {name: 'name', age: 32}
  9 + * +-------------------
  10 + * @return {Promise} promise 返回promise供后续操作
  11 + */
  12 + wx.showNavigationBarLoading()
  13 + wx.showLoading({
  14 + title: '加载中',
  15 + })
  16 + var promise = new Promise((resolve, reject) => {
  17 + let that = this;
  18 + let postData = data;
  19 + let baseurl = 'https://soochow.w.broteam.cn/api/';//仅为实例地址
  20 + let header = Object.assign({ 'content-type': 'application/x-www-form-urlencoded' }, headerParams)
  21 + //发起网络请求
  22 + wx.request({
  23 + url: baseurl + url,
  24 + data: postData,
  25 + method: 'POST',
  26 + header: header ,
  27 + success: function (res) {//返回取得的数据
  28 + if (res.data.code == '10001'){
  29 + wx.clearStorageSync()
  30 + wx.showModal({
  31 + title: '提示',
  32 + content: res.data.msg,
  33 + showCancel: false,
  34 + success: function(res){
  35 + wx.redirectTo({
  36 + url: '/pages/start/start',
  37 + })
  38 + }
  39 + })
  40 + return false
  41 + }else{
  42 + resolve(res.data);
  43 + }
  44 + setTimeout(function () {
  45 + wx.hideLoading()
  46 + }, 600)
  47 + wx.hideNavigationBarLoading()
  48 + },
  49 + error: function (e) {
  50 + reject("网络错误");
  51 + wx.hideLoading();
  52 + wx.hideNavigationBarLoading();
  53 + wx.showModal({
  54 + title: '提示',
  55 + content: res.data.msg,
  56 + showCancel: false
  57 + })
  58 + }
  59 + })
  60 + })
  61 + wx.hideLoading();
  62 + return promise;
  63 + },
  64 + onLaunch: function () {
  65 + // 展示本地存储能力
  66 + var logs = wx.getStorageSync('logs') || []
  67 + logs.unshift(Date.now())
  68 + wx.setStorageSync('logs', logs)
  69 +
  70 + // 登录
  71 + wx.login({
  72 + success: res => {
  73 + // 发送 res.code 到后台换取 openId, sessionKey, unionId
  74 + }
  75 + })
  76 + // 获取用户信息
  77 + wx.getSetting({
  78 + success: res => {
  79 + if (res.authSetting['scope.userInfo']) {
  80 + // 已经授权,可以直接调用 getUserInfo 获取头像昵称,不会弹框
  81 + wx.getUserInfo({
  82 + success: res => {
  83 + // 可以将 res 发送给后台解码出 unionId
  84 + this.globalData.userInfo = res.userInfo
  85 + // 由于 getUserInfo 是网络请求,可能会在 Page.onLoad 之后才返回
  86 + // 所以此处加入 callback 以防止这种情况
  87 + if (this.userInfoReadyCallback) {
  88 + this.userInfoReadyCallback(res)
  89 + }
  90 + }
  91 + })
  92 + }
  93 + }
  94 + })
  95 + },
  96 + globalData: {
  97 + userInfo: null
  98 + }
  99 +})
  1 +{
  2 + "pages": [
  3 + "pages/start/start",
  4 + "pages/chooseadress/chooseadress",
  5 + "pages/share_record/share_record",
  6 + "pages/index/index",
  7 + "pages/poster/poster",
  8 + "pages/record/record",
  9 + "pages/share_code/share_code"
  10 + ],
  11 + "window": {
  12 + "backgroundTextStyle": "light",
  13 + "navigationBarBackgroundColor": "#fff",
  14 + "navigationBarTitleText": "WeChat",
  15 + "navigationBarTextStyle": "black"
  16 + }
  17 +}
  1 +/**app.wxss**/
  2 +page{
  3 + width:100%;
  4 + height:100%;
  5 + overflow: hidden;
  6 +}
  7 +.container {
  8 + height: 100%;
  9 + display: flex;
  10 + flex-direction: column;
  11 + align-items: center;
  12 + justify-content: space-between;
  13 + padding: 200rpx 0;
  14 + box-sizing: border-box;
  15 +}
  1 +function AMapWX(a){this.key=a.key,this.requestConfig={key:a.key,s:"rsx",platform:"WXJS",appname:a.key,sdkversion:"1.2.0",logversion:"2.0"}}AMapWX.prototype.getWxLocation=function(a,b){wx.getLocation({type:"gcj02",success:function(a){var c=a.longitude+","+a.latitude;wx.setStorage({key:"userLocation",data:c}),b(c)},fail:function(c){wx.getStorage({key:"userLocation",success:function(a){a.data&&b(a.data)}}),a.fail({errCode:"0",errMsg:c.errMsg||""})}})},AMapWX.prototype.getRegeo=function(a){function c(c){var d=b.requestConfig;wx.request({url:"https://restapi.amap.com/v3/geocode/regeo",data:{key:b.key,location:c,extensions:"all",s:d.s,platform:d.platform,appname:b.key,sdkversion:d.sdkversion,logversion:d.logversion},method:"GET",header:{"content-type":"application/json"},success:function(b){var d,e,f,g,h,i,j,k,l;b.data.status&&"1"==b.data.status?(d=b.data.regeocode,e=d.addressComponent,f=[],g="",d&&d.roads[0]&&d.roads[0].name&&(g=d.roads[0].name+"附近"),h=c.split(",")[0],i=c.split(",")[1],d.pois&&d.pois[0]&&(g=d.pois[0].name+"附近",j=d.pois[0].location,j&&(h=parseFloat(j.split(",")[0]),i=parseFloat(j.split(",")[1]))),e.provice&&f.push(e.provice),e.city&&f.push(e.city),e.district&&f.push(e.district),e.streetNumber&&e.streetNumber.street&&e.streetNumber.number?(f.push(e.streetNumber.street),f.push(e.streetNumber.number)):(k="",d&&d.roads[0]&&d.roads[0].name&&(k=d.roads[0].name),f.push(k)),f=f.join(""),l=[{iconPath:a.iconPath,width:a.iconWidth,height:a.iconHeight,name:f,desc:g,longitude:h,latitude:i,id:0,regeocodeData:d}],a.success(l)):a.fail({errCode:b.data.infocode,errMsg:b.data.info})},fail:function(b){a.fail({errCode:"0",errMsg:b.errMsg||""})}})}var b=this;a.location?c(a.location):b.getWxLocation(a,function(a){c(a)})},AMapWX.prototype.getWeather=function(a){function d(d){var e="base";a.type&&"forecast"==a.type&&(e="all"),wx.request({url:"https://restapi.amap.com/v3/weather/weatherInfo",data:{key:b.key,city:d,extensions:e,s:c.s,platform:c.platform,appname:b.key,sdkversion:c.sdkversion,logversion:c.logversion},method:"GET",header:{"content-type":"application/json"},success:function(b){function c(a){var b={city:{text:"城市",data:a.city},weather:{text:"天气",data:a.weather},temperature:{text:"温度",data:a.temperature},winddirection:{text:"风向",data:a.winddirection+"风"},windpower:{text:"风力",data:a.windpower+"级"},humidity:{text:"湿度",data:a.humidity+"%"}};return b}var d,e;b.data.status&&"1"==b.data.status?b.data.lives?(d=b.data.lives,d&&d.length>0&&(d=d[0],e=c(d),e["liveData"]=d,a.success(e))):b.data.forecasts&&b.data.forecasts[0]&&a.success({forecast:b.data.forecasts[0]}):a.fail({errCode:b.data.infocode,errMsg:b.data.info})},fail:function(b){a.fail({errCode:"0",errMsg:b.errMsg||""})}})}function e(e){wx.request({url:"https://restapi.amap.com/v3/geocode/regeo",data:{key:b.key,location:e,extensions:"all",s:c.s,platform:c.platform,appname:b.key,sdkversion:c.sdkversion,logversion:c.logversion},method:"GET",header:{"content-type":"application/json"},success:function(b){var c,e;b.data.status&&"1"==b.data.status?(e=b.data.regeocode,e.addressComponent?c=e.addressComponent.adcode:e.aois&&e.aois.length>0&&(c=e.aois[0].adcode),d(c)):a.fail({errCode:b.data.infocode,errMsg:b.data.info})},fail:function(b){a.fail({errCode:"0",errMsg:b.errMsg||""})}})}var b=this,c=b.requestConfig;a.city?d(a.city):b.getWxLocation(a,function(a){e(a)})},AMapWX.prototype.getPoiAround=function(a){function d(d){var e={key:b.key,location:d,s:c.s,platform:c.platform,appname:b.key,sdkversion:c.sdkversion,logversion:c.logversion};a.querytypes&&(e["types"]=a.querytypes),a.querykeywords&&(e["keywords"]=a.querykeywords),wx.request({url:"https://restapi.amap.com/v3/place/around",data:e,method:"GET",header:{"content-type":"application/json"},success:function(b){var c,d,e,f;if(b.data.status&&"1"==b.data.status){if(b=b.data,b&&b.pois){for(c=[],d=0;d<b.pois.length;d++)e=0==d?a.iconPathSelected:a.iconPath,c.push({latitude:parseFloat(b.pois[d].location.split(",")[1]),longitude:parseFloat(b.pois[d].location.split(",")[0]),iconPath:e,width:22,height:32,id:d,name:b.pois[d].name,address:b.pois[d].address});f={markers:c,poisData:b.pois},a.success(f)}}else a.fail({errCode:b.data.infocode,errMsg:b.data.info})},fail:function(b){a.fail({errCode:"0",errMsg:b.errMsg||""})}})}var b=this,c=b.requestConfig;a.location?d(a.location):b.getWxLocation(a,function(a){d(a)})},AMapWX.prototype.getStaticmap=function(a){function f(b){c.push("location="+b),a.zoom&&c.push("zoom="+a.zoom),a.size&&c.push("size="+a.size),a.scale&&c.push("scale="+a.scale),a.markers&&c.push("markers="+a.markers),a.labels&&c.push("labels="+a.labels),a.paths&&c.push("paths="+a.paths),a.traffic&&c.push("traffic="+a.traffic);var e=d+c.join("&");a.success({url:e})}var e,b=this,c=[],d="https://restapi.amap.com/v3/staticmap?";c.push("key="+b.key),e=b.requestConfig,c.push("s="+e.s),c.push("platform="+e.platform),c.push("appname="+e.appname),c.push("sdkversion="+e.sdkversion),c.push("logversion="+e.logversion),a.location?f(a.location):b.getWxLocation(a,function(a){f(a)})},AMapWX.prototype.getInputtips=function(a){var b=this,c=b.requestConfig,d={key:b.key,s:c.s,platform:c.platform,appname:b.key,sdkversion:c.sdkversion,logversion:c.logversion};a.location&&(d["location"]=a.location),a.keywords&&(d["keywords"]=a.keywords),a.type&&(d["type"]=a.type),a.city&&(d["city"]=a.city),a.citylimit&&(d["citylimit"]=a.citylimit),wx.request({url:"https://restapi.amap.com/v3/assistant/inputtips",data:d,method:"GET",header:{"content-type":"application/json"},success:function(b){b&&b.data&&b.data.tips&&a.success({tips:b.data.tips})},fail:function(b){a.fail({errCode:"0",errMsg:b.errMsg||""})}})},AMapWX.prototype.getDrivingRoute=function(a){var b=this,c=b.requestConfig,d={key:b.key,s:c.s,platform:c.platform,appname:b.key,sdkversion:c.sdkversion,logversion:c.logversion};a.origin&&(d["origin"]=a.origin),a.destination&&(d["destination"]=a.destination),a.strategy&&(d["strategy"]=a.strategy),a.waypoints&&(d["waypoints"]=a.waypoints),a.avoidpolygons&&(d["avoidpolygons"]=a.avoidpolygons),a.avoidroad&&(d["avoidroad"]=a.avoidroad),wx.request({url:"https://restapi.amap.com/v3/direction/driving",data:d,method:"GET",header:{"content-type":"application/json"},success:function(b){b&&b.data&&b.data.route&&a.success({paths:b.data.route.paths,taxi_cost:b.data.route.taxi_cost||""})},fail:function(b){a.fail({errCode:"0",errMsg:b.errMsg||""})}})},AMapWX.prototype.getWalkingRoute=function(a){var b=this,c=b.requestConfig,d={key:b.key,s:c.s,platform:c.platform,appname:b.key,sdkversion:c.sdkversion,logversion:c.logversion};a.origin&&(d["origin"]=a.origin),a.destination&&(d["destination"]=a.destination),wx.request({url:"https://restapi.amap.com/v3/direction/walking",data:d,method:"GET",header:{"content-type":"application/json"},success:function(b){b&&b.data&&b.data.route&&a.success({paths:b.data.route.paths})},fail:function(b){a.fail({errCode:"0",errMsg:b.errMsg||""})}})},AMapWX.prototype.getTransitRoute=function(a){var b=this,c=b.requestConfig,d={key:b.key,s:c.s,platform:c.platform,appname:b.key,sdkversion:c.sdkversion,logversion:c.logversion};a.origin&&(d["origin"]=a.origin),a.destination&&(d["destination"]=a.destination),a.strategy&&(d["strategy"]=a.strategy),a.city&&(d["city"]=a.city),a.cityd&&(d["cityd"]=a.cityd),wx.request({url:"https://restapi.amap.com/v3/direction/transit/integrated",data:d,method:"GET",header:{"content-type":"application/json"},success:function(b){if(b&&b.data&&b.data.route){var c=b.data.route;a.success({distance:c.distance||"",taxi_cost:c.taxi_cost||"",transits:c.transits})}},fail:function(b){a.fail({errCode:"0",errMsg:b.errMsg||""})}})},AMapWX.prototype.getRidingRoute=function(a){var b=this,c=b.requestConfig,d={key:b.key,s:c.s,platform:c.platform,appname:b.key,sdkversion:c.sdkversion,logversion:c.logversion};a.origin&&(d["origin"]=a.origin),a.destination&&(d["destination"]=a.destination),wx.request({url:"https://restapi.amap.com/v4/direction/bicycling",data:d,method:"GET",header:{"content-type":"application/json"},success:function(b){b&&b.data&&b.data.data&&a.success({paths:b.data.data.paths})},fail:function(b){a.fail({errCode:"0",errMsg:b.errMsg||""})}})},module.exports.AMapWX=AMapWX;
  1 +var config = {
  2 + key: '856d7698b954d8c2356bce3a3be86f1d'
  3 +}
  4 +
  5 +module.exports.Config = config;
  1 +const app= getApp();
  2 +var amapFile = require('../../libs/amap-wx.js');
  3 +var config = require('../../libs/config.js');
  4 +Page({
  5 + /**
  6 + * 页面的初始数据
  7 + */
  8 + data: {
  9 + showright: true,
  10 + showbtn: true,
  11 + showitem:false,
  12 + chooseitem: [],
  13 + cityList: [],
  14 + currentindex: 0 ,//当前index
  15 + //地图部分的数据
  16 + staticsrc:'',//生成的静态图
  17 + markers: [],
  18 + latitude: '',//当前维度
  19 + longitude: '',//当前经度
  20 + textData: {},//
  21 + city: '',
  22 + tips: '',//input输入选项
  23 + scale: '12',
  24 + width:'50',
  25 + height: '40',
  26 + iconPathSelected: '../../images/yy.png',
  27 + iconPath: '../../images/dingwei_no.png'
  28 + },
  29 + chooseone(e) {
  30 + let that = this;
  31 + let index = e.currentTarget.dataset.index;
  32 + let cityList = that.data.cityList;
  33 + let showright = that.data.showright;
  34 + if (cityList[index].name=='自定义'){
  35 + showright=false;
  36 + }else{
  37 + showright = true;
  38 + }
  39 + for (let i in cityList){
  40 + if (i == index){
  41 + cityList[i].parentcheck = true;
  42 + }else{
  43 + cityList[i].parentcheck = false;
  44 + }
  45 + }
  46 + that.setData({
  47 + cityList: cityList,
  48 + showright: showright,
  49 + currentindex:index
  50 + })
  51 + },
  52 + choosetwo(e){
  53 + let that=this;
  54 + let cityList = that.data.cityList;
  55 + let index = e.currentTarget.dataset.index;
  56 + let currentindex = that.data.currentindex;
  57 + cityList[currentindex].children[index].check = !cityList[currentindex].children[index].check;
  58 + for (let obj of cityList){
  59 + let num = obj.num;
  60 + if (obj.parentcheck){
  61 + num=0
  62 + for (let item of obj.children){
  63 + if (item.check){
  64 + num++;
  65 + }
  66 + }
  67 + }
  68 + obj.num=num;
  69 + }
  70 + that.setData({
  71 + cityList: cityList
  72 + })
  73 + },
  74 + //输入关键词并获取周围位置提示
  75 + setkeyword(e){
  76 + let that=this;
  77 + var keywords = e.detail.value;
  78 + if (keywords==''){
  79 + that.setData({
  80 + tips: ''
  81 + });
  82 + }else{
  83 + var key = config.Config.key;
  84 + var myAmapFun = new amapFile.AMapWX({ key: key });
  85 + myAmapFun.getInputtips({
  86 + keywords: keywords,
  87 + location: that.data.lonlat,
  88 + city: that.data.city,
  89 + success: function (data) {
  90 + if (data && data.tips) {
  91 + let newtips = [];
  92 + for (let obj of data.tips) {
  93 + if (obj.location != undefined && obj.location != '') {//把没有坐标的地址删掉
  94 + newtips.push(obj)
  95 + }
  96 + }
  97 + that.setData({
  98 + tips: newtips,
  99 + });
  100 + }
  101 + }
  102 + })
  103 + }
  104 + },
  105 + //设置关键词
  106 + choosekeyword(e){
  107 + let that=this;
  108 + that.setData({
  109 + keywords: e.currentTarget.dataset.keywords
  110 + })
  111 + if (that.data.keywords.length >0){
  112 + let location = e.currentTarget.dataset.location.split(',')
  113 + let tempMark = [{
  114 + id: '0',
  115 + name: e.currentTarget.dataset.keywords,
  116 + latitude: location[1],//纬度
  117 + longitude: location[0],//经度
  118 + iconPath: this.data.iconPath,
  119 + width: this.data.width,
  120 + height: this.data.height
  121 + }]
  122 + that.setData({
  123 + markers: tempMark,
  124 + latitude: location[1],//纬度
  125 + longitude: location[0],//经度
  126 + tips: '',
  127 + scale: '13'
  128 + })
  129 + }else{
  130 + that.setData({
  131 + tips: ''
  132 + })
  133 + }
  134 +
  135 + },
  136 + //刚刚开始拿到地图
  137 + getMap(){
  138 + var that = this;
  139 + var key = config.Config.key;
  140 + var myAmapFun = new amapFile.AMapWX({ key: key});
  141 + myAmapFun.getRegeo({
  142 + iconPathSelected: '../../images/yy.png',
  143 + iconPath: "../../images/dingwei_no.png",
  144 + iconWidth: 50,
  145 + iconHeight: 40,
  146 + location:'120.5544751,31.34876492',//中心点苏州市姑苏区
  147 + success: function (data) {
  148 + that.setData({
  149 + latitude: data[0].latitude,
  150 + longitude: data[0].longitude,
  151 + city: data[0].regeocodeData.addressComponent.city
  152 + });
  153 +
  154 + },
  155 + fail: function (info) {
  156 +
  157 + }
  158 + })
  159 + },
  160 + //根据坐标找到地图
  161 + mapkey(location){
  162 + var that = this;
  163 + that.setData({
  164 + tips:''
  165 + })
  166 + var key = config.Config.key;
  167 + var myAmapFun = new amapFile.AMapWX({ key: key });
  168 + var params = {
  169 + iconPathSelected: '../../images/yy.png',
  170 + iconPath: '../../images/dingwei_no.png',
  171 + success: function (data) {
  172 + let markersData = data.markers;
  173 + var poisData = data.poisData;
  174 + var markers_new = [];
  175 + markersData.forEach(function (item, index) {
  176 + markers_new.push({
  177 + id: item.id,
  178 + latitude: item.latitude,
  179 + longitude: item.longitude,
  180 + iconPath: item.iconPath,
  181 + width: item.width,
  182 + height: item.height
  183 + })
  184 + })
  185 + if (poisData.length > 0) {
  186 + let chooseitem = that.data.chooseitem;
  187 + chooseitem.push(poisData[0]);
  188 + that.setData({
  189 + markers: markers_new,
  190 + city: poisData[0].cityname || '',
  191 + latitude: markersData[0].latitude,//维度,
  192 + longitude: markersData[0].longitude , //经度,
  193 + chooseitem: chooseitem
  194 + });
  195 + } else {
  196 + wx.getLocation({
  197 + type: 'gcj02',
  198 + success: function (res) {
  199 + that.setData({
  200 + latitude: res.latitude
  201 + });
  202 + that.setData({
  203 + longitude: res.longitude
  204 + });
  205 + that.setData({
  206 + city: '苏州市'
  207 + });
  208 + },
  209 + fail: function () {
  210 + that.setData({
  211 + latitude: 31.32416
  212 + });
  213 + that.setData({
  214 + longitude: 120.629029
  215 + });
  216 + that.setData({
  217 + city: '苏州市'
  218 + });
  219 + }
  220 + })
  221 +
  222 + }
  223 + },
  224 + fail: function (info) {
  225 +
  226 + }
  227 + }
  228 + params.location = location;
  229 + params.querykeywords=that.data.city
  230 + myAmapFun.getPoiAround(params)
  231 + },
  232 + delchooseitem(e){
  233 + let that=this;
  234 + let cityList = that.data.cityList;
  235 + let chooseitem = that.data.chooseitem;
  236 + chooseitem.splice(parseInt(e.currentTarget.dataset.index),1);
  237 + cityList[cityList.length - 1].num = chooseitem.length;
  238 + that.setData({
  239 + chooseitem: chooseitem,
  240 + cityList: cityList
  241 + })
  242 + },
  243 + //获取景点信息
  244 + getdata(){
  245 + let that=this;
  246 + let url ='home/home/index';
  247 + console.log(wx.getStorageSync('token'))
  248 + let header={
  249 + 'XX-Token': wx.getStorageSync('token')
  250 + }
  251 + app.post(url, {}, header).then((res)=>{
  252 + let cityList = [];
  253 + let currentlist=[];
  254 + let j=0;
  255 + for(let i in res){
  256 + if(res[i].length>0){
  257 + for (let j in res[i]) {
  258 + res[i][j].check = false;
  259 + }
  260 + let tem = {
  261 + id: j,
  262 + num: 0,
  263 + name: i,
  264 + parentcheck: false,
  265 + children: res[i]
  266 + };
  267 + if (j == 0) {
  268 + currentlist = res[i];
  269 + tem.parentcheck = true;
  270 + }
  271 + j++;
  272 + cityList.push(tem)
  273 + }
  274 + }
  275 + let t={
  276 + id:j+1,
  277 + num: 0,
  278 + name: '自定义',
  279 + parentcheck: false,
  280 + children: []
  281 + }
  282 + cityList.push(t);
  283 +
  284 + that.setData({
  285 + cityList: cityList,
  286 + currentlist: currentlist
  287 + })
  288 + }).catch((errMsg)=>{
  289 + console.log(errMsg)
  290 + })
  291 + },
  292 + makertap(e){
  293 + console.log(e)
  294 + var that = this;
  295 + var id = e.markerId;
  296 + let markersData = this.data.markers
  297 + let chooseitem = this.data.chooseitem
  298 + let cityList = this.data.cityList
  299 + let choose
  300 + if(chooseitem.length>0){
  301 + for (let obj of chooseitem) {
  302 + if (obj.name == markersData[0].name) {
  303 + choose = false
  304 + return false
  305 + } else {
  306 + choose = true
  307 + }
  308 + }
  309 + if (choose) {
  310 + chooseitem.push(markersData[0])
  311 + cityList[cityList.length - 1].num = chooseitem.length
  312 + this.setData({
  313 + chooseitem: chooseitem,
  314 + cityList: cityList
  315 + })
  316 + }
  317 + }else{
  318 + chooseitem.push(markersData[0])
  319 + cityList[cityList.length - 1].num = chooseitem.length
  320 + this.setData({
  321 + chooseitem: chooseitem,
  322 + cityList: cityList
  323 + })
  324 + }
  325 + },
  326 + changeMarkerColor: function (data, i) {
  327 + var that = this;
  328 + var markers = [];
  329 + for (var j = 0; j < data.length; j++) {
  330 + if (j == i) {
  331 + data[j].iconPath = "../../img/marker_checked.png";
  332 + } else {
  333 + data[j].iconPath = "../../img/marker.png";
  334 + }
  335 + markers.push({
  336 + id: data[j].id,
  337 + latitude: data[j].latitude,
  338 + longitude: data[j].longitude,
  339 + iconPath: data[j].iconPath,
  340 + width: data[j].width,
  341 + height: data[j].height
  342 + })
  343 + }
  344 + that.setData({
  345 + markers: markers
  346 + });
  347 + },
  348 + showMarkerInfo: function (data, i) {
  349 + var that = this;
  350 + let chooseitem = that.data.chooseitem;
  351 + that.setData({
  352 + textData: {
  353 + name: data[i].name,
  354 + desc: data[i].address
  355 + }
  356 + });
  357 + },
  358 + //生成静态地图
  359 + getStaticmap(markers) {
  360 + var that = this;
  361 + var key = config.Config.key;
  362 + var myAmapFun = new amapFile.AMapWX({ key: key });
  363 + wx.getSystemInfo({
  364 + success: function (data) {
  365 + var height = 400;
  366 + var width = 600;
  367 + var size = width + "*" + height;
  368 + myAmapFun.getStaticmap({
  369 + zoom: 8,
  370 + size: size,
  371 + scale: 2,
  372 + location: "120.629029,31.32416",//中心点苏州拙政园
  373 + markers: markers,
  374 + success: function (data) {
  375 + wx.setStorageSync('staticsrc', data.url)
  376 + that.setData({
  377 + staticsrc: data.url
  378 + })
  379 + },
  380 + fail: function (info) {
  381 +
  382 + }
  383 + })
  384 + }
  385 + })
  386 + },
  387 + //生成音乐LOGo
  388 + gorecord(){
  389 + let that=this;
  390 + let cityList = that.data.cityList;
  391 + let chooseitem = that.data.chooseitem;
  392 + let staticmarkers = "-1,http://omzkju13s.bkt.clouddn.com/Aknvs.png,0:120.635512,31.32853";
  393 + let locationurl='';
  394 + let tempLocation = []
  395 + for (let obj of cityList){
  396 + for (let item of obj.children){
  397 + if (item.check){
  398 + tempLocation.push(item.coordinate)
  399 + // if(locationurl==''){
  400 + // locationurl = item.coordinate;
  401 + // }else{
  402 + locationurl += '|' + item.coordinate;
  403 + // }
  404 + staticmarkers += (';'+ item.coordinate);
  405 + }
  406 + }
  407 + }
  408 + if(chooseitem.length>0){
  409 + for(let obj of chooseitem){
  410 + let tempLocation = obj.longitude +','+ obj.latitude
  411 + locationurl += '|'+tempLocation
  412 + }
  413 + }
  414 + that.getStaticmap(staticmarkers)//调用静态图生成方法,生成图片
  415 + if (locationurl.length==0){
  416 + wx.showToast({
  417 + title: '请选择地址',
  418 + icon: 'none',
  419 + duration: 2000,
  420 + })
  421 + }else{
  422 + let url ='home/home/create';
  423 + let header = {
  424 + 'XX-Token': wx.getStorageSync('token')
  425 + }
  426 + let params={
  427 + coordinate: locationurl,
  428 + file: that.data.staticsrc,
  429 + token: wx.getStorageSync('token')
  430 + }
  431 + app.post(url, params, header).then((res)=>{
  432 + console.log(res.code)
  433 + if(res.code==20000){
  434 + wx.navigateTo({
  435 + url: '../record/record?poster_id=' + res.poster_id,
  436 + success: function (res) { },
  437 + fail: function (res) { },
  438 + complete: function (res) { },
  439 + })
  440 + }
  441 + }).catch((errMsg)=>{
  442 + wx.showModal({
  443 + title: '提示',
  444 + content: errMsg.msg,
  445 + showCancel: false
  446 + })
  447 + console.log(errMsg)
  448 + })
  449 + }
  450 + },
  451 + /**
  452 + * 生命周期函数--监听页面加载
  453 + */
  454 + onLoad: function(options) {
  455 + let that=this;
  456 + that.getdata();
  457 + that.getMap();
  458 + },
  459 + /**
  460 + * 生命周期函数--监听页面初次渲染完成
  461 + */
  462 + onReady: function() {
  463 +
  464 + },
  465 +
  466 + /**
  467 + * 生命周期函数--监听页面显示
  468 + */
  469 + onShow: function() {
  470 +
  471 + },
  472 +
  473 + /**
  474 + * 生命周期函数--监听页面隐藏
  475 + */
  476 + onHide: function() {
  477 +
  478 + },
  479 +
  480 + /**
  481 + * 生命周期函数--监听页面卸载
  482 + */
  483 + onUnload: function() {
  484 +
  485 + },
  486 +
  487 + /**
  488 + * 页面相关事件处理函数--监听用户下拉动作
  489 + */
  490 + onPullDownRefresh: function() {
  491 +
  492 + },
  493 +
  494 + /**
  495 + * 页面上拉触底事件的处理函数
  496 + */
  497 + onReachBottom: function() {
  498 +
  499 + },
  500 +
  501 + /**
  502 + * 用户点击右上角分享
  503 + */
  504 + onShareAppMessage: function() {
  505 +
  506 + }
  507 +})
  1 +{
  2 + "navigationBarTitleText": "踏趣苏州",
  3 + "navigationBarBackgroundColor": "#fff"
  4 +}
  1 +<!--pages/chooseadress/chooseadress.wxml-->
  2 +<view class='bg'>
  3 + <image src='../../images/bg@2x.jpg'></image>
  4 + <image src='{{src}}'></image>
  5 + <view class='top_text'>必选地点</view>
  6 + <view class='main'>
  7 + <view class='main_left'>
  8 + <view class="left_cell {{item.parentcheck?'activity_cell':''}}" wx:for='{{cityList}}' wx:key bindtap='chooseone' data-index='{{index}}'>
  9 + <view class='unit_num' wx:if='{{item.num != 0}}'>{{item.num}}</view>
  10 + <text>{{item.name}}</text>
  11 + </view>
  12 + </view>
  13 + <view class="main_rigth {{showright?'heiht80':''}}" wx:if='{{showright}}'>
  14 + <view class="rigth_cell {{item.check?'activity_cell':''}}" wx:for='{{cityList[currentindex].children}}' data-index='{{index}}' wx:key bindtap='choosetwo'>{{item.scenic_name}}</view>
  15 + </view>
  16 + <view class="main_rigth {{showright?'':'heiht100'}}" wx:else>
  17 + <view class='seach_box'>
  18 + <view class='seach_text'>
  19 + <input placeholder='请输入地点' bindinput='setkeyword'
  20 + value='{{keywords}}' placeholder-class='pclass'></input>
  21 + </view>
  22 + <cover-view class='seach_items' wx:if='{{tips.length !=0 }}'>
  23 + <cover-view class='seach_item' wx:for='{{tips}}' wx:key data-keywords='{{item.name}} ' data-location='{{item.location}}' bindtap='choosekeyword'>
  24 + <cover-view>{{item.name}}</cover-view>
  25 +
  26 + </cover-view>
  27 + </cover-view>
  28 + </view>
  29 + <view class='map_box'>
  30 + <view class='map_container'>
  31 + <map class="map" id="map" longitude="{{longitude}}" latitude="{{latitude}}" show-location="true" scale="{{scale}}" markers="{{markers}}" bindmarkertap="makertap"></map>
  32 + </view>
  33 + </view>
  34 + <view class='tab_box' wx:if='{{chooseitem.length!=0}}'>
  35 + <view class='tab_cell' wx:for='{{chooseitem}}' wx:key style='order:{{chooseitem.length-index}}'>
  36 + <view class='close_box' catchtap='delchooseitem' data-index='{{index}}'>
  37 + <image src='../../images/close2.png'></image>
  38 + </view>
  39 + <text>{{item.name}}</text>
  40 + </view>
  41 + </view>
  42 + </view>
  43 + </view>
  44 + <view class='bottom_btn' wx:if='{{showbtn}}' bindtap='gorecord'>生成我的音乐LOGO</view>
  45 +</view>
  1 +/* pages/chooseadress/chooseadress.wxss */
  2 +page{
  3 + width: 100%;
  4 + height: 100%;
  5 + overflow: hidden
  6 +}
  7 +.map_container{
  8 + position: absolute;
  9 + top: 0;
  10 + bottom: 0;
  11 + left: 0;
  12 + right: 0;
  13 +}
  14 +.bg{
  15 + position: fixed;
  16 + top:0;
  17 + left:0;
  18 + right: 0;
  19 + bottom:0;
  20 + width:100%;
  21 + height: 100%;
  22 +}
  23 +.bg image{
  24 + width:100%;
  25 + height: 100%;
  26 +}
  27 +.top_text{
  28 + position: absolute;
  29 + color:#222;
  30 + font-size:40rpx;
  31 + top:4%;
  32 + left:50%;
  33 + transform: translateX(-50%);
  34 + font-weight: bold;
  35 +}
  36 +.main{
  37 + position: absolute;
  38 + top:15%;
  39 + height: 80%;
  40 + width:100%;
  41 + padding:0 0 0 30rpx;
  42 + color:#D85372;
  43 + font-size:30rpx;
  44 + display: flex;
  45 +}
  46 +.main_left{
  47 +
  48 + height: 80%;
  49 + overflow-y: auto;
  50 + overflow-x: hidden;
  51 + margin:0 20rpx 0 0;
  52 +}
  53 +.left_cell{
  54 + position: relative;
  55 + padding:0 10rpx;
  56 + width:125rpx;
  57 + height: 88rpx;
  58 + overflow-x: auto;
  59 + text-align:left;
  60 + display: flex;
  61 + align-items: center;
  62 + white-space: nowrap;
  63 + border:1rpx solid #D85372;
  64 + border-radius: 10rpx;
  65 + margin:0 0 24rpx 0;
  66 +}
  67 +.unit_num{
  68 + position: absolute;
  69 + width:32rpx;
  70 + height: 32rpx;
  71 + border-radius: 50%;
  72 + top:8rpx;
  73 + right:5rpx;
  74 + background-color: #FFC426;
  75 + font-size:26rpx;
  76 + color:#222222;
  77 + display: flex;
  78 + justify-content: center;
  79 + align-items: center;
  80 + z-index:5;
  81 +}
  82 +.main_rigth{
  83 + width:560rpx;
  84 + height: 80%;
  85 + overflow-x: hidden;
  86 + overflow-y: auto;
  87 +
  88 +}
  89 +.heiht80{
  90 + height: 80%;
  91 +}
  92 +.heiht100{
  93 + height: 100%;
  94 +}
  95 +.rigth_cell{
  96 + display: inline-block;
  97 + padding: 0 34rpx;
  98 + margin:0 20rpx 24rpx 0;
  99 + height: 88rpx;
  100 + line-height: 88rpx;
  101 + text-align: center;
  102 + border-radius: 10rpx;
  103 + border:1rpx solid #D85372;
  104 +}
  105 +.seach_box{
  106 + width:530rpx;
  107 + box-sizing: border-box;
  108 + position:relative;
  109 +}
  110 +.seach_items{
  111 + background-color: #fff;
  112 + position: absolute;
  113 + top:88rpx;
  114 + width:530rpx;
  115 + border-radius: 10rpx;
  116 + padding:0 30rpx;
  117 + box-sizing: border-box;
  118 + z-index:100;
  119 + height: 600rpx;
  120 + overflow-y: scroll;
  121 +}
  122 +.seach_item{
  123 + padding:25rpx 0;
  124 + display: flex;
  125 + justify-content: space-between;
  126 + align-items: center;
  127 + color:#D85372;
  128 + font-size:30rpx;
  129 + border-bottom: 1rpx #ccc dashed;
  130 +}
  131 +.seach_item:last-child{
  132 + border:none;
  133 +}
  134 +.icon_img{
  135 + width:13rpx;
  136 + height:22rpx;
  137 +}
  138 +.icon_img image{
  139 + display: block;
  140 + width:100%;
  141 + height: 100%;
  142 +}
  143 +.seach_text{
  144 + height: 88rpx;
  145 + width:100%;
  146 + box-sizing: border-box;
  147 + overflow: hidden;
  148 + border-radius: 10rpx;
  149 + border:1rpx solid #D85372;
  150 + margin:0 30rpx 0 0;
  151 +}
  152 +.seach_text input{
  153 + box-sizing: border-box;
  154 + padding:0 30rpx;
  155 + width:100%;
  156 + height: 100%;
  157 + color:#D85372;
  158 + font-size:30rpx;
  159 +}
  160 +.pclass{
  161 + color:#D85372;
  162 +}
  163 +.map_box{
  164 + position: relative;
  165 + margin:24rpx 0 0 0;
  166 + width:530rpx;
  167 + height: 528rpx;
  168 + overflow: hidden;
  169 +}
  170 +.tab_box{
  171 + width:100%;
  172 + padding:10rpx 0 0 0;
  173 + box-sizing: border-box;
  174 + height: 210rpx;
  175 + overflow-y: auto;
  176 + margin:60rpx 0 0 0;
  177 + display: flex;
  178 + flex-wrap: wrap;
  179 +}
  180 +
  181 +.tab_cell{
  182 + position: relative;
  183 + display: flex;
  184 + justify-content: center;
  185 + align-items: center;
  186 + color:#fff;
  187 + font-weight: bold;
  188 + background-color: #DB214C;
  189 + border-radius: 10rpx;
  190 + height: 88rpx;
  191 + padding:0 30rpx;
  192 + margin: 0 30rpx 20rpx 0;
  193 +}
  194 +.close_box{
  195 +position:absolute;
  196 +top:-8rpx;
  197 +right:-9rpx;
  198 +width:32rpx;
  199 +height:32rpx;
  200 +border-radius:50%;
  201 +overflow:hidden;
  202 +background-color: #fff;
  203 +}
  204 +.close_box image{
  205 + width:100%;
  206 + height: 100%;
  207 +}
  208 +.bottom_btn{
  209 + position: absolute;
  210 + display: flex;
  211 + align-items: center;
  212 + justify-content: center;
  213 + background-color: #007CC2;
  214 + bottom:0;
  215 + height: 88rpx;
  216 + width:100%;
  217 + color:#fff;
  218 + font-size:32rpx;
  219 +}
  220 +.activity_cell{
  221 + background-color:#DB214C;
  222 + color:#fff;
  223 + font-weight: bold;
  224 +}
  225 +.map_container map{
  226 + width:100%;
  227 + height: 100%;
  228 +}
  229 +.map_text{
  230 + position: absolute;
  231 + left: 0;
  232 + right: 0;
  233 + bottom: 0px;
  234 + height: 80px;
  235 + background: #fff;
  236 + padding: 0 15px;
  237 +}
  238 +text{
  239 + margin: 5px 0;
  240 + display: block;
  241 + font-size:12px;
  242 + text-overflow: ellipsis;
  243 + white-space: nowrap;
  244 + overflow: hidden;
  245 +}
  1 +//index.js
  2 +//获取应用实例
  3 +const app = getApp()
  4 +
  5 +Page({
  6 + data: {
  7 + list:[{
  8 + id:0,
  9 + }]
  10 + },
  11 + gochoose(){
  12 + wx.navigateTo({
  13 + url: '../chooseadress/chooseadress',
  14 + success: function(res) {},
  15 + fail: function(res) {},
  16 + complete: function(res) {},
  17 + })
  18 +
  19 + },
  20 + onLoad: function () {
  21 +
  22 + },
  23 +})
  1 +{
  2 +"navigationBarTitleText": "踏趣苏州",
  3 +"navigationBarBackgroundColor": "#fff"
  4 +}
  1 +<view class='bg'>
  2 + <image src='../../images/bg@2x.jpg'></image>
  3 + <view class='top_text'>
  4 + <view class='mini_title'>去过的地方,就是连接起来的一段脚步音符</view>
  5 + <view class='title'>来制作你的音乐logo吧</view>
  6 + </view>
  7 + <view class='center_img'>
  8 + <image src='../../images/suzhou@2x.png'></image>
  9 + </view>
  10 + <view class='index_btn' bindtap='gochoose'>下一步</view>
  11 +</view>
  1 +.bg{
  2 + width:100%;
  3 + height: 100%;
  4 +
  5 + position: fixed;
  6 + top:0;
  7 + bottom:0;
  8 + left:0;
  9 +}
  10 +.bg image{
  11 + width:100%;
  12 + height: 100%;
  13 +}
  14 +.top_text{
  15 + width:100%;
  16 + top:5%;
  17 + position: absolute;
  18 + color:#DB214C;
  19 + font-weight: bold;
  20 + text-align: center;
  21 +
  22 +}
  23 +.mini_title{
  24 + font-size:25rpx;
  25 + margin:0 0 20rpx 0;
  26 +}
  27 +.title{
  28 + font-size:47rpx;
  29 + word-spacing: 10rpx;
  30 +}
  31 +.center_img{
  32 + position: absolute;
  33 + width:656rpx;
  34 + height: 572rpx;
  35 + z-index:2;
  36 + top:24%;
  37 + left:50%;
  38 + transform: translateX(-50%);
  39 + overflow: hidden;
  40 +}
  41 +.center_img image{
  42 + width:100%;
  43 +}
  44 +.index_btn{
  45 + position: absolute;
  46 + z-index:3;
  47 + color:#fff;
  48 + font-size:32rpx;
  49 + width:320rpx;
  50 + height: 80rpx;
  51 + line-height: 80rpx;
  52 + text-align: center;
  53 + bottom:8%;
  54 + left:50%;
  55 + transform: translateX(-50%);
  56 + background-color: #007CC2;
  57 + border-radius: 40rpx;
  58 +}
  59 +.index_btn:active{
  60 + opacity: 0.7;
  61 +}
  1 +// pages/poster.js
  2 +Page({
  3 +
  4 + /**
  5 + * 页面的初始数据
  6 + */
  7 + data: {
  8 +
  9 + },
  10 +
  11 + /**
  12 + * 生命周期函数--监听页面加载
  13 + */
  14 + onLoad: function (options) {
  15 +
  16 + },
  17 +
  18 + /**
  19 + * 生命周期函数--监听页面初次渲染完成
  20 + */
  21 + onReady: function () {
  22 +
  23 + },
  24 +
  25 + /**
  26 + * 生命周期函数--监听页面显示
  27 + */
  28 + onShow: function () {
  29 +
  30 + },
  31 +
  32 + /**
  33 + * 生命周期函数--监听页面隐藏
  34 + */
  35 + onHide: function () {
  36 +
  37 + },
  38 +
  39 + /**
  40 + * 生命周期函数--监听页面卸载
  41 + */
  42 + onUnload: function () {
  43 +
  44 + },
  45 +
  46 + /**
  47 + * 页面相关事件处理函数--监听用户下拉动作
  48 + */
  49 + onPullDownRefresh: function () {
  50 +
  51 + },
  52 +
  53 + /**
  54 + * 页面上拉触底事件的处理函数
  55 + */
  56 + onReachBottom: function () {
  57 +
  58 + },
  59 +
  60 + /**
  61 + * 用户点击右上角分享
  62 + */
  63 + onShareAppMessage: function () {
  64 +
  65 + }
  66 +})
  1 +{"navigationBarTitleText": "踏趣苏州"}
  1 +<!--pages/poster.wxml-->
  2 +<view class='bg'>
  3 + <image src='../../images/abg.png'></image>
  4 + <view class='item_box'>
  5 + <view class='item'>
  6 + <text>巴塞罗那因为高迪的建筑,拥有了自然万物的灵魂。
  7 +而我们又该如何表达苏州?巴塞罗那因为高迪的建筑,拥有了自然万物的灵魂。
  8 +而我们又该如何表达苏州?</text>
  9 + <text>巴塞罗那因为高迪的建筑,拥有了自然万物的灵魂。
  10 +而我们又该如何表达苏州?巴塞罗那因为高迪的建筑,拥有了自然万物的灵魂。
  11 +而我们又该如何表达苏州?</text>
  12 + </view>
  13 +
  14 + <view class='item'>
  15 + <view class='item_title'>作品要求</view>
  16 + <view class='item_cell'>
  17 + <text class='item_left'>内容</text>
  18 + <view class='item_rigth'>你在任何的城市行旅创意作品</view>
  19 + </view>
  20 + <view class='item_cell'>
  21 + <text class='item_left'>形式</text>
  22 + <view class='item_rigth'>音频节目、原创歌曲、短视频均可。</view>
  23 + </view>
  24 + <view class='item_cell'>
  25 + <text class='item_left'>时长</text>
  26 + <view class='item_rigth'>5分钟以内。</view>
  27 + </view>
  28 + </view>
  29 + <view class='item_btn'>开始提交</view>
  30 + </view>
  31 +
  32 +</view>
  1 +/* pages/poster.wxss */
  2 +@import "../index/index.wxss";
  3 +.item_box{
  4 +position: absolute;
  5 +top:5%;
  6 +left:50%;
  7 +transform: translateX(-50%);
  8 +width:654rpx;
  9 +}
  10 +.item{
  11 + margin:26rpx 0 0 0;
  12 + color:#542C70;
  13 + font-size:32rpx;
  14 + width:654rpx;
  15 + height: 470rpx;
  16 + overflow-y: auto;
  17 + border-radius: 15rpx;
  18 + box-sizing: border-box;
  19 + padding:60rpx 40rpx;
  20 + background-color: rgba(255,255,255,1);
  21 +
  22 +}
  23 +.item_title{
  24 + color:#333;
  25 + font-size: 32rpx;
  26 + font-weight: bold;
  27 +}
  28 +.item_cell{
  29 + margin:30rpx 0;
  30 + position: relative;
  31 + color:#333;
  32 + font-size:30rpx;
  33 + padding:0 0 0 84rpx;
  34 +}
  35 +.item_left{
  36 + position: absolute;
  37 + left:0;
  38 + top:0;
  39 + display: inline-block;
  40 + margin: 0 20rpx 0 0;
  41 + padding:5rpx 8rpx;
  42 + border-radius: 5rpx;
  43 + color:#fff;
  44 + font-weight: bold;
  45 + font-size: 28rpx;
  46 + background-color: #B63556;
  47 +}
  48 +.item_rigth{
  49 + width:420rpx;
  50 + display: inline-block;
  51 +}
  52 +.item_btn{
  53 + position: absolute;
  54 + width:520rpx;
  55 + height: 88rpx;
  56 + border-radius: 44rpx;
  57 + left: 50%;
  58 + bottom:-44rpx;
  59 + transform: translateX(-50%);
  60 + color:#fff;
  61 + font-weight: bold;
  62 + font-size:34rpx;
  63 + display: flex;
  64 + justify-content: center;
  65 + align-items: center;
  66 + background: linear-gradient(to right,#952567,#D93948)
  67 +}
  68 +.item_btn:active{
  69 + opacity: 0.7
  70 +}
  1 +// pages/record/record.js
  2 +const app = getApp();
  3 +var amapFile = require('../../libs/amap-wx.js');
  4 +var config = require('../../libs/config.js');
  5 +var bgM = wx.createInnerAudioContext();
  6 +Page({
  7 + /**
  8 + * 页面的初始数据
  9 + */
  10 + data: {
  11 + play:true, //true为播放,flase暂停
  12 + //地图数据
  13 + markers: [],//显示点的坐标对象
  14 + latitude: '',//当前显示的点维度
  15 + longitude: '',//当前显示点的经度
  16 + scale:'12',
  17 + src:'',
  18 + startsec:'00:00',
  19 + endsec:'00:00',
  20 + palyrate:'',//播放的百分比
  21 + poster_id:'',//海报ID
  22 + musicsrc:'',
  23 + duration:0
  24 + },
  25 + //生成静态地图
  26 + getStaticmap(markers) {
  27 + var that = this;
  28 + var key = config.Config.key;
  29 + var myAmapFun = new amapFile.AMapWX({ key: key });
  30 + wx.getSystemInfo({
  31 + success: function (data) {
  32 + var height = 300;
  33 + var width = 500;
  34 + var size = width + "*" + height;
  35 + myAmapFun.getStaticmap({
  36 + zoom: 8,
  37 + size: size,
  38 + scale: 2,
  39 + location: "120.644312,31.421561",//中心点苏州火车北站
  40 + markers: markers,
  41 + success: function (data) {
  42 + that.setData({
  43 + staticsrc: data.url
  44 + })
  45 + },
  46 + fail: function (info) {
  47 + // wx.showModal({title:info.errMsg})
  48 + }
  49 + })
  50 + }
  51 + })
  52 + },
  53 + goshare_code(){
  54 + wx.navigateTo({
  55 + url: '../share_code/share_code',
  56 + success: function(res) {},
  57 + fail: function(res) {},
  58 + complete: function(res) {},
  59 + })
  60 + },
  61 + audioPlay: function (e) {//播放
  62 + let that=this;
  63 + that.setData({
  64 + play:false
  65 + })
  66 + bgM.src = that.data.musicsrc;
  67 + bgM.play();
  68 + setTimeout(() => {
  69 + bgM.currentTime
  70 + bgM.onTimeUpdate(() => {
  71 + let palyrate = (parseInt(bgM.currentTime) / parseInt(bgM.duration)) * 100;//播放的百分比
  72 + that.setData({
  73 + startsec: '00:' +(bgM.currentTime.toFixed(0) < 10 ? '0' + bgM.currentTime.toFixed(0) : bgM.currentTime.toFixed(0)),
  74 + endsec: '00:' +(bgM.duration.toFixed(0) < 10 ? '0' + bgM.duration.toFixed(0) : bgM.duration.toFixed(0)) ,
  75 + palyrate: palyrate
  76 + })
  77 + })
  78 + bgM.onEnded(() => {
  79 + that.setData({
  80 + startsec: '00' + ':00',
  81 + endsec: '00:' +( bgM.duration.toFixed(0) < 10 ? '0' + bgM.duration.toFixed(0) : bgM.duration.toFixed(0)) ,
  82 + palyrate: 0,
  83 + play: true
  84 + })
  85 + })
  86 + that.setData({
  87 + duration: bgM.duration
  88 + })
  89 + }, 1000)
  90 + },
  91 + audioPause: function () {//暂停
  92 + let that = this;
  93 + that.setData({
  94 + play: true
  95 + })
  96 + bgM.pause();
  97 + },
  98 + //根据坐标显示点
  99 + getlocationmap(location,id){
  100 + var that = this;
  101 + let markers = that.data.markers;
  102 + var key = config.Config.key;
  103 + var myAmapFun = new amapFile.AMapWX({ key: '856d7698b954d8c2356bce3a3be86f1d'});
  104 + myAmapFun.getRegeo({
  105 + iconPath: "../../images/yingfu.png",
  106 + iconWidth: 22,
  107 + iconHeight: 32,
  108 + location: location,
  109 + success: function (data) {
  110 + var newmarker = {
  111 + id: id,
  112 + latitude: data[0].latitude,
  113 + longitude: data[0].longitude,
  114 + iconPath: data[0].iconPath,
  115 + width: data[0].width,
  116 + height: data[0].height
  117 + }
  118 + markers[id] = newmarker;
  119 + that.setData({
  120 + markers: markers
  121 + });
  122 + console.log(that.data.markers)
  123 + that.setData({
  124 + latitude: data[0].latitude
  125 + });
  126 + that.setData({
  127 + longitude: data[0].longitude
  128 + });
  129 + that.setData({
  130 + textData: {
  131 + name: data[0].name,
  132 + desc: data[0].desc
  133 + }
  134 + })
  135 + },
  136 + fail: function (info) {
  137 +
  138 + }
  139 + })
  140 + },
  141 + makertap(e) {
  142 + console.log(e);
  143 + var that = this;
  144 + var id = e.markerId;
  145 + },
  146 + getdata(){
  147 + let that=this;
  148 + let url ='home/home/click_one';
  149 + let params={
  150 + id: that.data.poster_id
  151 + }
  152 + app.post(url, params,{}).then((res)=>{
  153 + if(res.code==20000){
  154 + that.setData({
  155 + musicsrc: res.url
  156 + })
  157 + bgM.src = that.data.musicsrc;
  158 + for (let i in res.coordinate){
  159 + that.getlocationmap(res.coordinate[i], i);
  160 + }
  161 + }
  162 + }).catch((errMsg)=>{
  163 + })
  164 + },
  165 + //保存图片
  166 + saveImg() {
  167 +
  168 + let that=this;
  169 + // let params = {
  170 + // pages: '/pages/share_record/share_record',
  171 + // scene: that.data.poster_id,
  172 + // }
  173 + console.log(typeof wx.getStorageSync('staticsrc'))
  174 + let params={
  175 + file: wx.getStorageSync('staticsrc'),
  176 + poster_id: that.data.poster_id,
  177 + page: 'pages/start/start'
  178 + }
  179 + // let url = 'home/home/code';
  180 + let url = 'home/home/poster';
  181 + app.post(url, params,{}).then((res) => {
  182 +
  183 + if(res.code == 20000){
  184 +
  185 + let imgUrl = res.url
  186 + wx.showLoading({
  187 + title: '加载中',
  188 + })
  189 + wx.downloadFile({
  190 + url: imgUrl,
  191 + success: function (res) {
  192 + wx.saveImageToPhotosAlbum({
  193 + filePath: res.tempFilePath,
  194 + success: function (res) {
  195 + wx.hideLoading()
  196 + wx.showToast({
  197 + icon: 'none',
  198 + title: '图片保存成功,可以分享到朋友圈'
  199 + })
  200 + },
  201 + fail: function (res) {
  202 + wx.showToast({
  203 + icon: 'none',
  204 + title: '图片保存失败'
  205 + })
  206 + console.log(res)
  207 + }
  208 + })
  209 + },
  210 + fail: function (res) {
  211 + // wx.showModal({
  212 + // title: '提示',
  213 + // content: '图片保存失败,请重试',
  214 + // showCancel: false
  215 + // })
  216 + }
  217 + })
  218 + }
  219 +
  220 + }).catch((errMsg) => {
  221 + // wx.showModal({
  222 + // title: '提示',
  223 + // content: errMsg,
  224 + // showCancel: false
  225 + // })
  226 + })
  227 + },
  228 + /**
  229 + * 生命周期函数--监听页面加载
  230 + */
  231 + onLoad: function (options) {
  232 + let that=this;
  233 + that.setData({
  234 + poster_id: options.poster_id,
  235 +
  236 + })
  237 + that.getdata();
  238 + },
  239 + /**
  240 + * 生命周期函数--监听页面初次渲染完成
  241 + */
  242 + onReady: function () {
  243 +
  244 + },
  245 +
  246 + /**
  247 + * 生命周期函数--监听页面显示
  248 + */
  249 + onShow: function () {
  250 +
  251 + },
  252 +
  253 + /**
  254 + * 生命周期函数--监听页面隐藏
  255 + */
  256 + onHide: function () {
  257 + bgM.pause();
  258 + },
  259 + /**
  260 + * 生命周期函数--监听页面卸载
  261 + */
  262 + onUnload: function () {
  263 +
  264 + },
  265 +
  266 + /**
  267 + * 页面相关事件处理函数--监听用户下拉动作
  268 + */
  269 + onPullDownRefresh: function () {
  270 +
  271 + },
  272 +
  273 + /**
  274 + * 页面上拉触底事件的处理函数
  275 + */
  276 + onReachBottom: function () {
  277 +
  278 + },
  279 +
  280 + /**
  281 + * 用户点击右上角分享
  282 + */
  283 + /**
  284 + * 用户点击右上角分享
  285 + */
  286 + onShareAppMessage: function (options) {
  287 + let that=this;
  288 + // 设置菜单中的转发按钮触发转发事件时的转发内容
  289 + var shareObj = {
  290 + title:'踏趣苏州', // 默认是小程序的名称(可以写slogan等)
  291 + path: '/pages/share_record/share_record?poster_id=' + that.data.poster_id, // 默认是当前页面,必须是以‘/’开头的完整路径
  292 + imgUrl: '',//自定义图片路径,可以是本地文件路径、代码包文件路径或者网络图片路径,支持PNG及JPG,不传入 imageUrl 则使用默认截图。显示图片长宽比是 5:4
  293 + success: function (res) {
  294 + // 转发成功之后的回调
  295 + if (res.errMsg == 'shareAppMessage:ok') { }
  296 + },
  297 + fail: function () {
  298 + // 转发失败之后的回调
  299 + if (res.errMsg == 'shareAppMessage:fail cancel') {
  300 + // 用户取消转发
  301 + } else if (res.errMsg == 'shareAppMessage:fail') {
  302 + // 转发失败,其中 detail message 为详细失败信息
  303 + }
  304 + },
  305 + complete: function () {
  306 + // 转发结束之后的回调(转发成不成功都会执行)
  307 + }
  308 + }   // 来自页面内的按钮的转发
  309 +
  310 + if (options.from == 'button') {
  311 + // 此处可以修改 shareObj 中的内容
  312 + // shareObj.path = '/pages/start/start?status=' + options.target.dataset.status
  313 + }   // 返回shareObj
  314 +
  315 + return shareObj;
  316 + }
  317 +})
  1 +{
  2 + "navigationBarTitleText": "踏趣苏州"
  3 +}
  1 +<!--pages/record/record.wxml-->
  2 +<view class='bg'>
  3 + <image src='../../images/bg@2x.jpg'></image>
  4 + <view class='top_text'>
  5 + <view class='mini_title'>去过的地方,就是连接起来的一段脚步音符</view>
  6 + <view class='title'>来制作你的音乐logo吧</view>
  7 + </view>
  8 + <view class='center_img'>
  9 + <view class='map_container'>
  10 + <block wx:if='{{src}}'>
  11 + <image src='{{src}}'></image>
  12 + </block>
  13 + <block>
  14 + <map class="map" id="map" longitude="{{longitude}}" latitude="{{latitude}}" show-location="true" scale="{{scale}}" markers="{{markers}}" bindmarkertap="makertap" ></map>
  15 + </block>
  16 + </view>
  17 + </view>
  18 +
  19 +<view class='bottom_box'>
  20 + <view class='play_box'>
  21 + <view class='play_left' bindtap="audioPlay" wx:if='{{play}}'>
  22 + <image src='../../images/zanting@2x.png'></image>
  23 + </view>
  24 + <view class='play_left' bindtap="audioPause" wx:else>
  25 + <image src='../../images/bofang@2x.png'></image>
  26 + </view>
  27 + <view class='play_rigth'>
  28 + <view class='play_text'>来听听你的专属脚步音乐logo</view>
  29 + <audio src="" id="myAudio" loop duration currentTime></audio>
  30 + <view class='play_control'>
  31 + <view class='play_item_yes' style="width:{{palyrate}}%">
  32 + </view>
  33 + <view class='silde_item' style="left:{{palyrate}}%"></view>
  34 + <view class='play_item_no' style="width:{{100-palyrate}}%"></view>
  35 + <view class='play_num'>
  36 + <view>{{startsec}}</view>
  37 + <view>{{endsec}}</view>
  38 + </view>
  39 +
  40 + </view>
  41 +
  42 + </view>
  43 + </view>
  44 + <view class='btn_box'>
  45 + <button class='btn' open-type='share'>转发到好友或群聊</button>
  46 + <view class='btn end_btn' bindtap='saveImg'>保存图片后发至朋友圈让更多好友听到</view>
  47 + </view>
  48 +</view>
  49 +</view>
  1 +/* pages/record/record.wxss */
  2 +@import "../index/index.wxss";
  3 +
  4 +.center_img {
  5 +top:18%;
  6 +width:100%;
  7 +height:500rpx;
  8 +}
  9 +
  10 +.bottom_box{
  11 + position:absolute;
  12 + left:50%;
  13 + transform: translateX(-50%);
  14 + bottom:5%;
  15 + width:560rpx;
  16 + overflow: hidden;
  17 +}
  18 +.play_box{
  19 + width:560rpx;
  20 + height: 132rpx;
  21 + border-radius: 10rpx;
  22 + background-color: #fff;
  23 + padding:0 20rpx;
  24 + box-sizing: border-box;
  25 + display: flex;
  26 + overflow: hidden;
  27 + align-items: center;
  28 +}
  29 +.play_left{
  30 + width:88rpx;
  31 + height: 88rpx;
  32 + overflow: hidden;
  33 + display: flex;
  34 + justify-content: center;
  35 + align-items: center;
  36 +}
  37 +.play_rigth{
  38 + position: relative;
  39 + width:420rpx;
  40 + margin:0 0 0 12rpx;
  41 +}
  42 +.play_left image{
  43 + width:100%;
  44 + height: 100%;
  45 +}
  46 +.play_text{
  47 + text-align: center;
  48 + color:#333030;
  49 + font-size:24rpx;
  50 +}
  51 +.play_rigth audio{
  52 + height: 34rpx;
  53 +}
  54 +.btn_box{
  55 + margin:16rpx 0 0 0;
  56 + width:560rpx;
  57 + background-color: #fff;
  58 + padding:30rpx 20rpx;
  59 + border-radius: 10rpx;
  60 + box-sizing: border-box;
  61 +}
  62 +.btn{
  63 + width:520rpx;
  64 + height: 80rpx;
  65 + display: flex;
  66 + justify-content: center;
  67 + align-items: center;
  68 + color:#fff;
  69 + border-radius: 40rpx;
  70 + background-color: #007CC2;
  71 + font-size:32rpx;
  72 +}
  73 +.end_btn{
  74 + margin:36rpx 0 0 0;
  75 + font-size:28rpx;
  76 +}
  77 +.play_control{
  78 + top:40rpx;
  79 + width:100%;
  80 + height: 100%;
  81 + padding:10rpx 0 0 0;
  82 + position: absolute;
  83 +
  84 +}
  85 +.play_item_yes{
  86 + width:0;
  87 + position: relative;
  88 + float: left;
  89 + height: 6rpx;
  90 + background-color: #007CC2;
  91 +}
  92 +.silde_item{
  93 + left: 0;
  94 + top:4rpx;
  95 + z-index:100;
  96 + position: absolute;
  97 + height: 20rpx;
  98 + width:8rpx;
  99 + background-color: #007CC2;
  100 +}
  101 +.play_item_no{
  102 + width:100%;
  103 + float: right;
  104 + height: 6rpx;
  105 + background-color: #999;
  106 +}
  107 +.play_num{
  108 + width:100%;
  109 + display: flex;
  110 + justify-content: space-between;
  111 + align-items: center;
  112 + color:#007CC2;
  113 + font-size:24rpx;
  114 +}
  115 +.play_num.notime{
  116 + opacity: 0
  117 +}
  118 +.map_container{
  119 + width:100%;
  120 + height: 100%;
  121 +}
  122 +.map_container map{
  123 + width:100%;
  124 + height: 100%;
  125 +}
  1 +// pages/share_code.js
  2 +Page({
  3 +
  4 + /**
  5 + * 页面的初始数据
  6 + */
  7 + data: {
  8 +
  9 + },
  10 +
  11 + /**
  12 + * 生命周期函数--监听页面加载
  13 + */
  14 + onLoad: function (options) {
  15 +
  16 + },
  17 +
  18 + /**
  19 + * 生命周期函数--监听页面初次渲染完成
  20 + */
  21 + onReady: function () {
  22 +
  23 + },
  24 +
  25 + /**
  26 + * 生命周期函数--监听页面显示
  27 + */
  28 + onShow: function () {
  29 +
  30 + },
  31 +
  32 + /**
  33 + * 生命周期函数--监听页面隐藏
  34 + */
  35 + onHide: function () {
  36 +
  37 + },
  38 +
  39 + /**
  40 + * 生命周期函数--监听页面卸载
  41 + */
  42 + onUnload: function () {
  43 +
  44 + },
  45 +
  46 + /**
  47 + * 页面相关事件处理函数--监听用户下拉动作
  48 + */
  49 + onPullDownRefresh: function () {
  50 +
  51 + },
  52 +
  53 + /**
  54 + * 页面上拉触底事件的处理函数
  55 + */
  56 + onReachBottom: function () {
  57 +
  58 + },
  59 +
  60 + /**
  61 + * 用户点击右上角分享
  62 + */
  63 + onShareAppMessage: function () {
  64 +
  65 + }
  66 +})
  1 +{
  2 + "navigationBarTitleText": "踏趣苏州"
  3 +}
  1 +<!--pages/share_code.wxml-->
  2 +<view class='bg'>
  3 + <image src='../../images/bg@2x.png'></image>
  4 + <view class='top_text'>
  5 + <view class='mini_title'>去过的地方,就是连接起来的一段脚步音符</view>
  6 + <view class='title'>来制作你的音乐logo吧</view>
  7 + </view>
  8 + <view class='center_img'>
  9 + <image src='../../images/suzhou@2x.png'></image>
  10 + </view>
  11 + <view class='code_box'></view>
  12 +</view>
  1 +/* pages/share_code.wxss */
  2 +@import "../index/index.wxss";
  3 +.code_box{
  4 +position:absolute;
  5 +right:7%;
  6 +bottom:26%;
  7 +z-index:4;
  8 +background-color:#000;
  9 +width:137rpx;
  10 +height:137rpx;
  11 +overflow:hidden;
  12 +
  13 +}
  14 +.code_box image{
  15 + width:100%;
  16 + height: 100%;
  17 +}
  1 +// pages/record/record.js
  2 +const app = getApp();
  3 +var amapFile = require('../../libs/amap-wx.js');
  4 +var config = require('../../libs/config.js');
  5 +var bgM = wx.createInnerAudioContext();
  6 +Page({
  7 + /**
  8 + * 页面的初始数据
  9 + */
  10 + data: {
  11 + play: true, //true为播放,flase暂停
  12 + //地图数据
  13 + markers: [],//显示点的坐标对象
  14 + latitude: '',//当前显示的点维度
  15 + longitude: '',//当前显示点的经度
  16 + scale: '12',
  17 + src: '',
  18 + startsec: '00:00',
  19 + endsec: '00:00',
  20 + palyrate: '',//播放的百分比
  21 + musicsrc: ''
  22 + },
  23 + audioPlay: function (e) {//播放
  24 + let that = this;
  25 + that.setData({
  26 + play: false
  27 + })
  28 + bgM.src = that.data.musicsrc;
  29 + bgM.play();
  30 + setTimeout(() => {
  31 + bgM.currentTime
  32 + bgM.onTimeUpdate(() => {
  33 + let palyrate = (parseInt(bgM.currentTime) / parseInt(bgM.duration)) * 100;//播放的百分比
  34 + that.setData({
  35 + startsec: '00:' + (bgM.currentTime.toFixed(0) < 10 ? '0' + bgM.currentTime.toFixed(0) : bgM.currentTime.toFixed(0)),
  36 + endsec: '00:' + (bgM.duration.toFixed(0) < 10 ? '0' + bgM.duration.toFixed(0) : bgM.duration.toFixed(0)),
  37 + palyrate: palyrate
  38 + })
  39 + })
  40 + bgM.onEnded(() => {
  41 + that.setData({
  42 + startsec: '00' + ':00',
  43 + endsec: '00:' + (bgM.duration.toFixed(0) < 10 ? '0' + bgM.duration.toFixed(0) : bgM.duration.toFixed(0)),
  44 + palyrate: 0,
  45 + play: true
  46 + })
  47 + })
  48 + that.setData({
  49 + duration: bgM.duration
  50 + })
  51 + }, 1000)
  52 + },
  53 + audioPause: function () {//暂停
  54 + let that = this;
  55 + that.setData({
  56 + play: true
  57 + })
  58 + bgM.pause();
  59 + },
  60 + //根据坐标显示点
  61 + getlocationmap(location, id) {
  62 + var that = this;
  63 + let markers = that.data.markers;
  64 + var key = config.Config.key;
  65 + var myAmapFun = new amapFile.AMapWX({ key: '856d7698b954d8c2356bce3a3be86f1d' });
  66 + myAmapFun.getRegeo({
  67 + iconPath: "../../images/yingfu.png",
  68 + iconWidth: 22,
  69 + iconHeight: 32,
  70 + location: location,
  71 + success: function (data) {
  72 + var newmarker = {
  73 + id: id,
  74 + latitude: data[0].latitude,
  75 + longitude: data[0].longitude,
  76 + iconPath: data[0].iconPath,
  77 + width: data[0].width,
  78 + height: data[0].height
  79 + }
  80 + markers[id] = newmarker;
  81 + that.setData({
  82 + markers: markers
  83 + });
  84 + console.log(that.data.markers)
  85 + that.setData({
  86 + latitude: data[0].latitude
  87 + });
  88 + that.setData({
  89 + longitude: data[0].longitude
  90 + });
  91 + that.setData({
  92 + textData: {
  93 + name: data[0].name,
  94 + desc: data[0].desc
  95 + }
  96 + })
  97 + },
  98 + fail: function (info) {
  99 +
  100 + }
  101 + })
  102 + },
  103 + makertap(e) {
  104 + console.log(e);
  105 + var that = this;
  106 + var id = e.markerId;
  107 + },
  108 + goindex(){
  109 + wx.reLaunch({
  110 + url: '../start/start',
  111 + success: function(res) {},
  112 + fail: function(res) {},
  113 + complete: function(res) {},
  114 + })
  115 + },
  116 + getdata(id){
  117 + let that = this;
  118 + let url = 'home/home/click_one';
  119 + let params = {
  120 + id: id
  121 + }
  122 + app.post(url, params,{}).then((res) => {
  123 + if (res.code == 20000) {
  124 + that.setData({
  125 + musicsrc: res.url
  126 + })
  127 + for (let i in res.coordinate) {
  128 + that.getlocationmap(res.coordinate[i], i);
  129 + }
  130 + }
  131 + }).catch((errMsg) => {
  132 + })
  133 + },
  134 + /**
  135 + * 生命周期函数--监听页面加载
  136 + */
  137 + onLoad: function (options) {
  138 + let that=this;
  139 + if (options.poster_id != undefined){
  140 + var poster_id = decodeURIComponent(options.poster_id)
  141 + that.getdata(poster_id);
  142 + }
  143 + },
  144 + /**
  145 + * 生命周期函数--监听页面初次渲染完成
  146 + */
  147 + onReady: function () {
  148 +
  149 + },
  150 +
  151 + /**
  152 + * 生命周期函数--监听页面显示
  153 + */
  154 + onShow: function () {
  155 +
  156 + },
  157 +
  158 + /**
  159 + * 生命周期函数--监听页面隐藏
  160 + */
  161 + onHide: function () {
  162 + bgM.pause();
  163 + },
  164 + /**
  165 + * 生命周期函数--监听页面卸载
  166 + */
  167 + onUnload: function () {
  168 +
  169 + },
  170 +
  171 + /**
  172 + * 页面相关事件处理函数--监听用户下拉动作
  173 + */
  174 + onPullDownRefresh: function () {
  175 +
  176 + },
  177 +
  178 + /**
  179 + * 页面上拉触底事件的处理函数
  180 + */
  181 + onReachBottom: function () {
  182 +
  183 + },
  184 +
  185 + /**
  186 + * 用户点击右上角分享
  187 + */
  188 + onShareAppMessage: function () {
  189 +
  190 + }
  191 +})
  1 +{"navigationBarTitleText": "踏趣苏州"}
  1 +<!--pages/share_record/share_record.wxml-->
  2 +<!--pages/record/record.wxml-->
  3 +<view class='bg'>
  4 + <image src='../../images/bg@2x.jpg'></image>
  5 + <view class='top_text'>
  6 + <view class='mini_title'>去过的地方,就是连接起来的一段脚步音符</view>
  7 + <view class='title'> 来听听我制作的音乐logo吧</view>
  8 + </view>
  9 + <view class='center_img'>
  10 + <view class='map_container'>
  11 + <block wx:if='{{src}}'>
  12 + <image src='{{src}}'></image>
  13 + </block>
  14 + <block>
  15 + <map class="map" id="map" longitude="{{longitude}}" latitude="{{latitude}}" show-location="true" scale="{{scale}}" markers="{{markers}}" bindmarkertap="makertap" ></map>
  16 + </block>
  17 + </view>
  18 + </view>
  19 +
  20 +<view class='bottom_box'>
  21 + <view class='play_box'>
  22 + <view class='play_left' bindtap="audioPlay" wx:if='{{play}}'>
  23 + <image src='../../images/zanting@2x.png'></image>
  24 + </view>
  25 + <view class='play_left' bindtap="audioPause" wx:else>
  26 + <image src='../../images/bofang@2x.png'></image>
  27 + </view>
  28 + <view class='play_rigth'>
  29 + <view class='play_text'>来听听她的专属脚步音乐logo</view>
  30 + <audio src="" id="myAudio" loop duration currentTime></audio>
  31 + <view class='play_control'>
  32 + <view class='play_item_yes' style="width:{{palyrate}}%">
  33 + </view>
  34 + <view class='silde_item' style="left:{{palyrate}}%"></view>
  35 + <view class='play_item_no' style="width:{{100-palyrate}}%"></view>
  36 + <view class='play_num'>
  37 + <view>{{startsec}}</view>
  38 + <view>{{endsec}}</view>
  39 + </view>
  40 +
  41 + </view>
  42 +
  43 + </view>
  44 + </view>
  45 + <view class='btn_box'>
  46 + <view class='btn' bindtap='goindex'>制作你的音乐logo吧!</view>
  47 +
  48 + </view>
  49 +</view>
  50 +
  51 +</view>
  1 +/* pages/record/record.wxss */
  2 +@import "../index/index.wxss";
  3 +
  4 +.center_img {
  5 +top:18%;
  6 +width:100%;
  7 +height:500rpx;
  8 +}
  9 +
  10 +.bottom_box{
  11 + position:absolute;
  12 + left:50%;
  13 + transform: translateX(-50%);
  14 + bottom:5%;
  15 + width:560rpx;
  16 + overflow: hidden;
  17 +}
  18 +.play_box{
  19 + width:560rpx;
  20 + height: 132rpx;
  21 + border-radius: 10rpx;
  22 + background-color: #fff;
  23 + padding:0 20rpx;
  24 + box-sizing: border-box;
  25 + display: flex;
  26 + overflow: hidden;
  27 + align-items: center;
  28 +}
  29 +.play_left{
  30 + width:88rpx;
  31 + height: 88rpx;
  32 + overflow: hidden;
  33 + display: flex;
  34 + justify-content: center;
  35 + align-items: center;
  36 +}
  37 +.play_rigth{
  38 + position: relative;
  39 + width:420rpx;
  40 + margin:0 0 0 12rpx;
  41 +}
  42 +.play_left image{
  43 + width:100%;
  44 + height: 100%;
  45 +}
  46 +.play_text{
  47 + text-align: center;
  48 + color:#333030;
  49 + font-size:24rpx;
  50 +}
  51 +.play_rigth audio{
  52 + height: 34rpx;
  53 +}
  54 +.btn_box{
  55 + margin:16rpx 0 0 0;
  56 + width:560rpx;
  57 + background-color: #fff;
  58 + padding:30rpx 20rpx;
  59 + border-radius: 10rpx;
  60 + box-sizing: border-box;
  61 +}
  62 +.btn{
  63 + width:520rpx;
  64 + height: 80rpx;
  65 + display: flex;
  66 + justify-content: center;
  67 + align-items: center;
  68 + color:#fff;
  69 + border-radius: 40rpx;
  70 + background-color: #007CC2;
  71 + font-size:32rpx;
  72 +}
  73 +.end_btn{
  74 + margin:36rpx 0 0 0;
  75 + font-size:28rpx;
  76 +}
  77 +.play_control{
  78 + top:40rpx;
  79 + width:100%;
  80 + height: 100%;
  81 + padding:10rpx 0 0 0;
  82 + position: absolute;
  83 +
  84 +}
  85 +.play_item_yes{
  86 + width:0;
  87 + position: relative;
  88 + float: left;
  89 + height: 6rpx;
  90 + background-color: #007CC2;
  91 +}
  92 +.silde_item{
  93 + left: 0;
  94 + top:4rpx;
  95 + z-index:100;
  96 + position: absolute;
  97 + height: 20rpx;
  98 + width:8rpx;
  99 + background-color: #007CC2;
  100 +}
  101 +.play_item_no{
  102 + width:100%;
  103 + float: right;
  104 + height: 6rpx;
  105 + background-color: #999;
  106 +}
  107 +.play_num{
  108 + width:100%;
  109 + display: flex;
  110 + justify-content: space-between;
  111 + align-items: center;
  112 + color:#007CC2;
  113 + font-size:24rpx;
  114 +}
  115 +.map_container{
  116 + width:100%;
  117 + height: 100%;
  118 +}
  119 +.map_container map{
  120 + width:100%;
  121 + height: 100%;
  122 +}
  1 +// pages/start/start.js
  2 +const app =getApp();
  3 +Page({
  4 + /**
  5 + * 页面的初始数据
  6 + */
  7 + data: {
  8 + },
  9 + start(e){
  10 + let that = this;
  11 + let encryptedData = e.detail.encryptedData;
  12 + let iv = e.detail.iv;
  13 + let raw_data = e.detail.rawData;
  14 + let signature = e.detail.signature;
  15 + wx.login({
  16 + success: (res) => {
  17 + let url = 'wxapp/public/getSessionKey';
  18 + let params = {
  19 + code: res.code
  20 + }
  21 + app.post(url, params,{}).then((res) => {
  22 + if(res.code==20000){
  23 + wx.setStorageSync('openid', res.data.openid);
  24 + wx.setStorageSync('session_key', res.data.session_key);
  25 + that.getlogin(res.data.openid, res.data.session_key, encryptedData, iv, raw_data, signature);
  26 + }
  27 + }).catch((errMsg) => {
  28 + console.log(errMsg)
  29 + })
  30 + }
  31 + })
  32 + },
  33 + getlogin(openid, session_key, encrypted_data, iv, raw_data, signature){
  34 + let url ='wxapp/public/login';
  35 + let params={
  36 + openid: openid,
  37 + session_key: session_key,
  38 + encrypted_data: encrypted_data,
  39 + iv: iv,
  40 + raw_data: raw_data,
  41 + signature: signature
  42 + }
  43 + app.post(url,params).then((res)=>{
  44 + if(res.code==20000){
  45 + wx.setStorageSync('token', res.data.token);
  46 + wx.setStorageSync('user_type', res.data.user_type);
  47 + wx.reLaunch({
  48 + url: '../index/index',
  49 + })
  50 + }
  51 + }).catch((errMsg)=>{
  52 + console.log(errMsg)
  53 + })
  54 + },
  55 + goindex(){
  56 + wx.reLaunch({
  57 + url: '../index/index',
  58 + })
  59 + },
  60 + /**
  61 + * 生命周期函数--监听页面加载
  62 + */
  63 + onLoad: function (options) {
  64 + let that=this;
  65 +
  66 + },
  67 + /**
  68 + * 生命周期函数--监听页面初次渲染完成
  69 + */
  70 + onReady: function () {
  71 +
  72 + },
  73 +
  74 + /**
  75 + * 生命周期函数--监听页面显示
  76 + */
  77 + onShow: function () {
  78 +
  79 + },
  80 +
  81 + /**
  82 + * 生命周期函数--监听页面隐藏
  83 + */
  84 + onHide: function () {
  85 +
  86 + },
  87 +
  88 + /**
  89 + * 生命周期函数--监听页面卸载
  90 + */
  91 + onUnload: function () {
  92 +
  93 + },
  94 +
  95 + /**
  96 + * 页面相关事件处理函数--监听用户下拉动作
  97 + */
  98 + onPullDownRefresh: function () {
  99 +
  100 + },
  101 +
  102 + /**
  103 + * 页面上拉触底事件的处理函数
  104 + */
  105 + onReachBottom: function () {
  106 +
  107 + },
  108 +
  109 + /**
  110 + * 用户点击右上角分享
  111 + */
  112 + onShareAppMessage: function () {
  113 +
  114 + }
  115 +})
  1 +{"navigationBarTitleText": "踏趣苏州"}
  1 +<!--pages/start/start.wxml-->
  2 +<view class='bg'>
  3 + <image src='../../images/bgg@2x.jpg'></image>
  4 +
  5 + <button class='start_btn' open-type='getUserInfo' bindgetuserinfo='start' >来制作属于自己的音乐LOGO</button>
  6 +
  7 +</view>
  1 +/* pages/start/start.wxss */
  2 +@import '../index/index.wxss';
  3 +.start_btn {
  4 +position: absolute;
  5 +z-index:3;
  6 +color:#fff;
  7 +font-size:32rpx;
  8 +width:520rpx;
  9 +height:80rpx;
  10 +line-height:80rpx;
  11 +text-align:center;
  12 +bottom:10%;
  13 +left:50%;
  14 +transform:translateX(-50%);
  15 +background-color:#007CC2;
  16 +border-radius:40rpx;
  17 +}
  18 +.start_btn:active{
  19 + opacity: 0.7;
  20 +}
  1 +{
  2 + "description": "项目配置文件。",
  3 + "packOptions": {
  4 + "ignore": []
  5 + },
  6 + "setting": {
  7 + "urlCheck": true,
  8 + "es6": true,
  9 + "postcss": true,
  10 + "minified": true,
  11 + "newFeature": true
  12 + },
  13 + "compileType": "miniprogram",
  14 + "libVersion": "2.2.5",
  15 + "appid": "wx11570b7f6228bd65",
  16 + "projectname": "%E8%B8%8F%E5%AF%BB%E8%8B%8F%E5%B7%9Eend",
  17 + "isGameTourist": false,
  18 + "condition": {
  19 + "search": {
  20 + "current": -1,
  21 + "list": []
  22 + },
  23 + "conversation": {
  24 + "current": -1,
  25 + "list": []
  26 + },
  27 + "plugin": {
  28 + "current": -1,
  29 + "list": []
  30 + },
  31 + "game": {
  32 + "currentL": -1,
  33 + "list": []
  34 + },
  35 + "miniprogram": {
  36 + "current": -1,
  37 + "list": [
  38 + {
  39 + "id": -1,
  40 + "name": "生成二维码",
  41 + "pathName": "pages/record/record",
  42 + "query": "id=6"
  43 + }
  44 + ]
  45 + }
  46 + }
  47 +}
  1 +const formatTime = date => {
  2 + const year = date.getFullYear()
  3 + const month = date.getMonth() + 1
  4 + const day = date.getDate()
  5 + const hour = date.getHours()
  6 + const minute = date.getMinutes()
  7 + const second = date.getSeconds()
  8 +
  9 + return [year, month, day].map(formatNumber).join('/') + ' ' + [hour, minute, second].map(formatNumber).join(':')
  10 +}
  11 +
  12 +const formatNumber = n => {
  13 + n = n.toString()
  14 + return n[1] ? n : '0' + n
  15 +}
  16 +
  17 +module.exports = {
  18 + formatTime: formatTime
  19 +}