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

最新推荐文章于 2025-05-20 09:44:58 发布
原创 最新推荐文章于 2025-05-20 09:44:58 发布 · 4.4k 阅读 · 15 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#微信小程序 #js #服务发布

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

摘要生成于 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' // 分享路径
    }
  }
})


在线任务平台
01-17
基于微信的任务发布接收平台，包含微信、支付宝支付；PHP版
微信小程序-建设项目验收-工作派遣-接单
10-22
在“微信小程序-建设项目验收-工作派遣-接单”这个主题中，我们主要探讨的是如何利用微信小程序来实现一个完整的建设项目管理流程，具体涉及以下几个关键知识点： 1. **微信小程序开发**：微信小程序开发使用的是...
小程序之任务发布与接单平台
qq_39195079的博客
05-27 9930
占位
vue3校园跑腿任务接单系统 微信小程序springboot
最新发布
QQ3166678367的博客
05-20 1088
在校园生活中，学生们经常面临各种琐碎事务的处理，如取快递、买饭、送资料等。这些事务虽然不大，但却占据了大量的时间和精力，影响了学生的学习和生活质量。为了解决这一问题，校园跑腿服务应运而生。然而，传统的校园跑腿服务往往依赖于人工调度和现金支付，存在效率低下、管理困难等问题。因此，开发一款基于移动互联网技术的校园跑腿服务系统显得尤为重要。微信小程序作为一种轻量级的应用形式，无需下载安装即可使用，具有即用即走的特性，非常适合在校园环境中推广。
微信小程序之在线任务发布与接单平台（图）
热门推荐
Zyuchen
03-31 3万+
#end time:2017/06/18系统主要功能界面运行情况及结果：系统运行环境要求及操作说明:工具：微信web开发者工具 / 申请微信小程序开发权限系统总结和体会:    经过这次的数据库实践，让我在加强掌握数据库能力的同时，领会到了许多平时课堂上所没有接受的课外知识，如js、php、微信小程序，很让人受益颇丰。这次实践是让我懂得如何去运用，进行的分析设计综合的训练，让我们将理论与实际相结合...
微信小程序0 校园任务跑腿接单平台 Android hbuilderx App毕业设计.
QQ3166678367的博客
05-05 1570
校园跑腿平台+后台管理系统|前后分离VUE》该项目含有源码、论文等资料、配套开发软件、软件安装教程、项目发布教程等 本系统包含微信小程序前台和Java做的后台管理系统，该后台采用前后台前后分离的形式使用Java+VUE 微信小程序——前台涉及技术：WXML 和 WXSS、JavaScript、uniapp Java——后台涉及技术： 前端使用技术：JSP,HTML5,CSS3、JavaScript、VUE等 后端使用技术：Spring、SpringMvc、Mybatis（SSM）等 ...
发布任务接单小程序开发制作
hanlin1888的博客
12-11 1983
发布任务接单小程序开发制作 网上发布任务接单平台，任务发布，接单竞标，资金提现。任务详情、后台发布任务、用户注册审核、项目自定义、支持多人参与、支持竞选竞标。 用户端功能： 项目：报名接单 我的:已接项目在线咨询 项目订单：确认订单项目订单取消订单完成报告 资金：提现 资料：注册信息，审核进度。 后台管理功能：项目分类、自定义项目内容、项目管理、指导老师、审核、学员管理、资金管理、会员管理、完成进度、订单管理、订单操作、确认提现、提现管理、编辑协议、文章协议管
基于微信小程序的校园互助平台设计与实现（毕业论文）
09-14
分别对应任务发布者和任务接收者。 后台系统管理员用户，在后台管理页面有一系列管理员功能。包括管理用户信息、管理订单信息、管理资金等。 发布任务:提出问题，上传需要他人帮忙的任务，任务被完成后，发单人需要...
微信小程序蓝牙连接小票打印机实例代码详解
10-16
微信小程序提供了蓝牙API，使得开发者能够实现设备间的无线通信，例如与蓝牙小票打印机进行交互。 首先，我们需要开启蓝牙并搜索附近的打印机设备。这可以通过调用`wx.openBluetoothAdapter`来实现，接着使用`wx....
(微信小程序毕业设计)跑腿平台(源码).rar
05-14
这个项目旨在提供一个便捷的在线跑腿服务，用户可以通过微信小程序进行操作，实现线上下单、任务发布等功能。下面将详细介绍该项目的技术栈、主要功能以及实现过程。 1. **技术栈** - **微信小程序**：作为前端...
微信小程序悬赏信息发布系统源码数据库.zip
09-01
微信小程序悬赏信息发布系统是一种基于微信平台的应用，用于发布和管理悬赏任务，鼓励用户参与完成任务并获得奖励。此系统通常包含用户管理、任务发布、任务查询、任务完成及奖励发放等多个模块，旨在提高用户活跃度...
任务监督平台基于微信小程序
08-10
任务监督平台、基于微信小程序
微信小程序-微信小程序示例教程（任务清单）
08-06
WeApp TODOS > A todos app by wechat weapp runtime Preview License MIT © 汪磊
微信小程序-外卖点餐平台
11-10
微信小程序外卖点餐平台源代码，内含15个功能页面，满足点餐开发所需的基本功能
微信小程序-软件推广平台
02-12
这个微信小程序总共有4个页面，有新闻页面、有首页、有详细信息页面、有发布的项目页面；实现从云开发的数据库里面增删改查数据；
发接任务平台公众号小程序开发
weixin_44039884的博客
01-16 481
主页用户、资金流水、财务——财务记录一、订单付款记录、系统设置、基础设置、上传配置、短信配置、支付配置、消息管理、管理员管理、管理权限、角色管理菜单管理、公众号、应用、小程序、维护——附件官理、附件分类管理、插件。
任务平台网站app小程序系统
河南漫云科技的博客
09-06 274
【代码】任务平台网站app小程序系统。
微信小程序之在线任务发布与接单平台
Zyuchen
03-31 1万+
目的：初步掌握数据库应用系统分析设计的基本方法；进一步提高分析与解决问题的综合能力；初步掌握数据库建模工具的使用方法；熟悉掌握C/S或B/S结构的数据库应用系统开发的整个过程。环境：计算机硬件配置: Apache / PHP / MySQL / 微信小程序操作系统: Linux / Windows 10 64位 / 微信小程序数据库管理系统: Mysql数据库服务器系统设计与开发用到的工具：Sub...
轻松接单-----小程序商城
dj18922799812的博客
08-28 5827
一早业务部就在各路渠道寻找意向客户，绞尽脑汁，唯恐哪位大boss稍有不慎便弃我们而去… 在众人兢兢业业，时，业务员L轻描淡写的说他昨晚加进一个微信，毫无征兆的就成交一单小程序商城系统，这个系统是我们的标品项目，虽说物美价廉，但平常日子也是需要攻关许久方可成交。羡慕之余又暗生敬佩！ T跟我们分享：要干一行爱一行，“冰冻三尺非一日之寒，水滴石穿非一日之功”凡事都不可能一蹴而就。需要用心经营个人事业...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值