微信小程序之在线任务发布与接单平台（2）

最新推荐文章于 2025-05-20 09:44:58 发布

LINZHENYU1996

最新推荐文章于 2025-05-20 09:44:58 发布

阅读量4.4k

点赞数 2

CC 4.0 BY-SA版权

分类专栏：微信小程序文章标签：微信小程序 js 服务发布

本文链接：https://blog.youkuaiyun.com/LINZHENYU1996/article/details/79765731

微信小程序专栏收录该内容

4 篇文章

订阅专栏

本文介绍了一个小程序中的服务模块设计，包括服务展示和服务详情页的功能实现。通过调用接口获取服务列表，并实现服务详情页的数据传递及操作。文章还涉及了图片处理、数据请求等关键功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

服务相关模块:

已经发布的服务列表

//serviceshow.js

var imageUtil = require('../../utils/util_image.js');
Page({
  data:{
    unit_type: ['次', '小时', '分钟', '单', '幅', '天', '周', '月', '份', '课时', '个', '面议'],
    service_type: ['维修', '打印', '摄像', '代办跑腿', '顺风车'],
    service: [],
    imgUrls: [
      '/img/task_show_banner/service1.jpg',
      '/img/task_show_banner/service2.jpg'
    ],
    imagewidth: 0,//缩放后的宽 
    imageheight: 0,//缩放后的高 
    indicatorDots: true,
    autoplay: true,
    interval: 5000,
    duration: 1000
  },
  imageLoad: function (e) {
    var imageSize = imageUtil.imageUtil(e)
    this.setData({
      imagewidth: imageSize.imageWidth,
      imageheight: imageSize.imageHeight
    })
  },
  service_detail:function(event){
    var item2=event.currentTarget.dataset.item;
    var service1=this.data.service;
    var service2=service1[item2];
    let service3=JSON.stringify(service2);
    wx.navigateTo({
      url: '../servicedetail/servicedetail?service2='+service3,
      success: function(res){
        // success
      },
      fail: function(res) {
        // fail
      },
      complete: function(res) {
        // complete
      }
    })
  },
  request_data:function(e){
    var that=this;
    wx.request({
      url: 'https://www.cc.com/get_service.php',
      data: {
      },
      method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
      header: {'content-type': 'application/json'}, // 设置请求的 header
      success: function(res){
        // success
        that.setData(
          {
            service:res.data
          }
        )
      },
      fail: function(res) {
        // fail
      },
      complete: function(res) {
        // complete
      }
    })
  },
  onLoad:function(options){
    // 生命周期函数--监听页面加载
    this.request_data();
    console.log(getApp().globalData.openid)
  },
  onReady:function(){
    // 生命周期函数--监听页面初次渲染完成
    
  },
  onShow:function(){
    // 生命周期函数--监听页面显示
    
  },
  onHide:function(){
    // 生命周期函数--监听页面隐藏
    
  },
  onUnload:function(){
    // 生命周期函数--监听页面卸载
  },
  onPullDownRefresh: function() {
    // 页面相关事件处理函数--监听用户下拉动作
    console.log('--------下拉刷新-------')
    wx.stopPullDownRefresh();
  },
  onReachBottom: function() {
    // 页面上拉触底事件的处理函数
  },
  onShareAppMessage: function() {
    // 用户点击右上角分享
    return {
      title: 'title', // 分享标题
      desc: 'desc', // 分享描述
      path: 'path' // 分享路径
    }
  }
})

服务详细内容：

//servicedetail.js
var app=getApp();
Page({
  data: {
    unit_type: ['次', '小时', '分钟', '单', '幅', '天', '周', '月', '份', '课时', '个', '面议'],
    service_type: ['维修', '打印', '摄像', '代办跑腿', '顺风车'],
    service:{},
    open_id:null
  },
  submit:function(){
    var that=this;
    wx.request({
      url: 'https://www.cc.com/insert.php',
      data: {
        flag:"sid",
        stid:that.data.service.sid,
        open_id:that.data.open_id
      },
      method: 'POST', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
      // header: {}, // 设置请求的 header
      header:{
        'content-type': 'application/x-www-form-urlencoded'
      },
      success: function(res){
        // success
        wx.redirectTo({
          url: '../meservice/meservice',
          success: function(res){
            // success
          },
          fail: function(res) {
            // fail
          },
          complete: function(res) {
            // complete
          }
        })
      },
      fail: function(res) {
        // fail
      },
      complete: function(res) {
        // complete
      }
    })
  },
  onLoad:function(options){
    // 生命周期函数--监听页面加载
    var that =this;
    app.getUserOpenid(function(openid){
        that.setData({
          open_id:openid
      })
    })
    this.setData({
      service:JSON.parse(options.service2)
    })
  },
  onReady:function(){
    // 生命周期函数--监听页面初次渲染完成
    
  },
  onShow:function(){
    // 生命周期函数--监听页面显示
    
  },
  onHide:function(){
    // 生命周期函数--监听页面隐藏
    
  },
  onUnload:function(){
    // 生命周期函数--监听页面卸载
  },
  onPullDownRefresh: function() {
    // 页面相关事件处理函数--监听用户下拉动作
    
  },
  onReachBottom: function() {
    // 页面上拉触底事件的处理函数
  },
  onShareAppMessage: function() {
    // 用户点击右上角分享
    return {
      title: 'title', // 分享标题
      desc: 'desc', // 分享描述
      path: 'path' // 分享路径
    }
  }
})

个人服务页面：

//meservice.js
var app=getApp()
Page({
  data: {
    unit_type: ['次', '小时', '分钟', '单', '幅', '天', '周', '月', '份', '课时', '个', '面议'],
    service_type: ['维修', '打印', '摄像', '代办跑腿', '顺风车'],
    selected1:true,
    selected2:false,
    service:[],
    service2:[],
    service3:[],
    open_id:""
  },
  judge: function (event) {
    var that = this;
    var judged = event.target.dataset.judged;
    var ttid = event.target.dataset.tid;
    //var gotten = event.target.dataset.gotten;
    /*if (!gotten) {
      wx.showToast({
        title: '等待接单中',
        icon: 'loading',
        duration: 2000
      })
      return;
    }*/
    if (judged == 1) {
      wx.showModal({
        title: '已评价',
        content: '评价内容可在‘我的评价’中查看',
      })
    } else {
      wx.redirectTo({
        url: '../judge/judge?tid=' + ttid + '&flag=1',
      })
    }
  },
  selected1: function () {
    this.setData({
      selected1: true,
      selected2: false
    })
    var that3 = this;
    wx.getStorage({
      key: 'service',
      success: function (res) {
        // success
        that3.setData({
          service3: res.data
        })
      },
      fail: function (res) {
        // fail
      },
      complete: function (res) {
        // complete
      }
    })
  },
  selected2: function () {
    this.setData({
      selected1: false,
      selected2: true
    })
    var that2 = this;
    wx.getStorage({
      key: 'service2',
      success: function (res) {
        // success
        that2.setData({
          service3: res.data
        })
      },
      fail: function (res) {
        // fail
      },
      complete: function (res) {
        // complete
      }
    })
  },

  delete_service: function (event) {
    var that = this;
    var ssid = event.target.dataset.sid;
    console.log(ssid)
    wx.request({
      url: 'https://www.cc.com/delete.php',
      data: {
        flag: 1,
        ssid:ssid
      },
      method: 'POST', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
      header: { 'content-type': 'application/x-www-form-urlencoded' }, // 设置请求的 header
      success: function (res) {
        wx.showModal({
          title: '删除',
          content: '删除成功',
          success:function(res){
            that.onLoad()
          }
        })
      },
      fail: function (res) {
        // fail
      },
      complete: function (res) {
        // complete
      }
    })
  },
  onLoad:function(options){
    // 生命周期函数--监听页面加载
    var that = this;
    app.getUserOpenid(function(openid){
        that.setData({
          open_id:openid
      })
    })

      wx.request({
        url: 'https://www.cc.com/get_me_service.php',
        data: {
          open_id:that.data.open_id,
          flag:1
        },
        method: 'POST', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
        header: {'content-type': 'application/x-www-form-urlencoded'}, // 设置请求的 header
        success: function(res){
            wx.setStorageSync('service', res.data)
            that.setData({
              service3: res.data
            })
        },
        fail: function(res) {
          // fail
        },
        complete: function(res) {
          // complete
        }
      })
      wx.request({
        url: 'https://www.cc.com/get_me_service.php',
        data: {
          open_id:that.data.open_id,
          flag:0
        },
        method: 'POST', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
        header: {'content-type': 'application/x-www-form-urlencoded'}, // 设置请求的 header
        success: function(res){
          // success

            wx.setStorageSync('service2', res.data)

        },
        fail: function(res) {
          // fail
        },
        complete: function(res) {
          // complete
        }
      })


  },
  onReady:function(){
    // 生命周期函数--监听页面初次渲染完成
  },
  onShow:function(){
    // 生命周期函数--监听页面显示
    
  },
  onHide:function(){
    // 生命周期函数--监听页面隐藏
    
  },
  onUnload:function(){
    // 生命周期函数--监听页面卸载
  },
  onPullDownRefresh: function() {
    // 页面相关事件处理函数--监听用户下拉动作
    
  },
  onReachBottom: function() {
    // 页面上拉触底事件的处理函数
  },
  onShareAppMessage: function() {
    // 用户点击右上角分享
    return {
      title: 'title', // 分享标题
      desc: 'desc', // 分享描述
      path: 'path' // 分享路径
    }
  }
})