生产制造追溯系统-通过微信小程序实现移动端报表平台(代码片段)

关键词：

前言

前两篇文章主要梳理了一下在生产过程中如何更高效、更稳定的实现条码打印，有不少园子里的朋友私信我，互相讨论了一些技术方面的问题，双方都各有收获，再此感谢博客园提供的这个交流平台，让五湖四海的朋友能够汇聚在一起，互相学习、互相进步！！

生产制造追溯系统-条码打印

生产制造追溯系统-再说条码打印

突破，将报表延伸至移动端

最近几年手机应用的发展速度大家有目共睹，就拿移动支付来说，放在十年前根本不敢想象现如今出门完全不用带现金，一部手机足够了，甚至有的地方可以刷脸支付，忘了带手机也没关系；随着科技的飞速发展，用户的要求也随之越来越高，这篇文章要说的也是跟手机有关--移动报表平台.

首先我们需要搭建环境，其实很简单，按照“微信web开发者工具”即可，下载地址如下：

下载 微信web开发者工具

安装好了之后如下图所示，可双击打开：

点击上图所示的 + 按钮，弹出如下图所示的配置对话框：

项目名称：填写该项目的名称，没有特别要求。

目录：表示本地开发电脑上面存放该项目的地方。

APPID：这个 AppID 是需要我们登录到微信公众号平台进行申请的，这里的 APPID一定要跟公众平台上面的 ID 一致。

配置完成之后，我们开发编写代码来实现我们需要的功能--通过小程序查询生产状态及进度，这里要区分一下每一种类型的文件表示的意思。

index.wxml

<!--index.wxml-->
<view class="container">
<view class="section searcha" wx:for="numa">
  <view class="search-input-wrapper ">
          <input bindinput="bind_lotname_Input" bindconfirm="query"   class="search-input" placeholder="输入工单号码进行搜索" value="search_lotname" confirm-type="search" />
        </view>

  <block>
    <icon type="search"   bindtap="bind_icon_search"   size="30" color="‘orange‘"/>
  </block>
</view>
<view class="section">
  <view wx:for="json_str" wx:for-item="item" class="flex-wrp line" style="flex-direction:column;">
   <view style=‘display:flex;‘>
   <view>产品名称：</view>
   <view>item["PRODUCT_NAME"]</view>
   </view>

    <view style=‘display:flex;‘>
   <view>工单总数：</view>
   <view>item["QUANTITY"]</view>
   </view>

   <view style=‘display:flex;‘>
   <view>生产工序：</view>
   <view>item["ROUTE_STEP"]</view>
   </view>
    <view style=‘display:flex;‘>
   <view>产出数量：</view>
   <view>item["OUTPUT_QTY"]</view>
   </view>
    <view style=‘display:flex;‘>
   <view>等待维修：</view>
   <view>item["WAITE_REPAIR_QTY"]</view>
   </view>
       <view style=‘display:flex;‘>
   <view>完成进度：</view>
   <view>item["PROCESS_VALUE"]</view>
   </view>
  </view>
</view>
<!-- <button bindtap="bindButtonTap">Search</button> -->

 
</view>

index.js


    wx.request(
      url: ‘https://www.123.cn/api/type=wip&action=wip_status‘, //获取JSON数据
      data:  str: that.data.search_lotname ,
      header: 
        ‘content-type‘: ‘application/json‘ // 默认值
      ,
      success(res)         
        that.setData(
          json_str:res.data
        );
        console.log(res.data);
      
    )

初步效果如下图所示，通过工单号码随时随地查询当前工单的完成进度,网页端与小程序对比：

目前所踩到的坑

1.Api接口不支持 IP 地址与端口，只能使用域名。

微信开发文档里面已经说明了，不允许使用类似 127.0.0.1 这种 IP 地址直接访问服务器，路径中也不能包含端口，就算是默认的端口也不能出现，必须通过域名来访问，比如          https://www.baidu.com/api/...

2.只能使用 https协议。

http是不安全的，必须在 IIS 中配置 https协议，而https是需要证书的，我们可以购买或者使用免费的证书，作者是在阿里云申请的免费证书，将证书下载之后拷贝到IIS即可，下面会放图。

3.对应的服务器 TLS 为 TLS 1.0，小程序要求的 TLS 版本必须大于等于1.2。

这是由于服务器 TLS 版本过低引起的，windows server 2008 R2或以上，都可以打开 TLS 1.2，方法见下图。

总结

后续开发过程中，我会将所遇到的困难记录下来并做个总结，这样方便其他朋友少走弯路，如果您觉得对您有帮助，请帮忙点个赞，谢谢！！

目前还只是第一步，后续将会逐渐开发一些更实用的功能，比如说各种查询报表，从而提升用户操作的便利性。

开源微信小程序--借书系统

...面风格良好，功能完整。具有注册登录、图书搜索、书单系统、订单管理等功能。这是一个完整的小程序项目，包括了前后端的开发，并且撰写了完善的文档，适合初学者学习。文档真的是很完善，可以看出作者是真的费心了。... 查看详情

生产制造追溯系统

生产制造追溯系统，包括流程控制、客户资料、产品资料、工单资料等基础信息维护，全程条码化管理。系统特点：1）采用强大数据采集引擎、整合数据采集渠道，覆盖整个工厂制造现场,保证现场数据的实时、准确、全面2）全... 查看详情

微信小程序一般去哪里对接一些商品接口

...您可以在小程序中调用它们的API实现相应的功能。3.自有系统API：如果您自己拥有商品数据和系统，可以开发相应的API接口，利用服务器端技术来完成数据的同步和交互，使小程序能够获得相应的商品信息。4 查看详情

生产制造追溯系统-再说条码打印(代码片段)

...处都是条码，一维码、二维码随处可见，更别说一家从事生产制造加工的工厂了，而条码种类繁多、离线打印等情况就直接导致了条码管控上的难度，甚至会出现较为严重的品质事件，上一个版本中我是通过Web应用程序调用WinFor... 查看详情

微信小程序审核不通过，提示涉及信息安全风险

微信小程序审核不通过，【发布拼图照片】涉及信息安全风险，平台不支持。不知道为什么涉及信息安全风险，就一个点击选择相册图片，然后拼图得红包的小程序，模仿小程序群拼图，类似这个小程序。。求大神帮忙。如果哪... 查看详情

智慧工厂管理平台建设，智慧工厂管理系统开发

...调度”、在线质量控制、车间物料规划与控制、生产过程追溯、可视化过程监控和生产状态分析等功能于一身，通过实现高度的自动化和信息化，打造智慧工厂，最终达到成本削减、生产效能提升和品质保证的目的。二、智慧工... 查看详情

微信小程序小游戏怎么开发？

小猪CMS小程序管理系统怎么样？您好，“微信小程序”开发之前必须要完成和注册认证。如果是个人或者小公司想开发微信小程序，也可以找微信认证第三方开发商，比如赢在移动、正品科技等。1、微信小程序注册在微信公众... 查看详情

万物皆可集成系列：低代码对接微信小程序

...，微信官方有自己的一套标准和开发模式，对于通过低代码开发平台开发 查看详情

基于微信小程序的劳务咨询系统设计与实现

随着科学技术的飞速发展，各行各业都在努力与现代先进技术接轨，通过科技手段提高自身的优势；对于劳务咨询服务平台小程序当然也不能排除在外，随着网络技术的不断成熟，带动了劳务咨询服务平台小... 查看详情

微信小程序前后端分离怎么实现

...实现效果和性能。参考技术A微信小程序前后端分离可以通过以下步骤来实现：1.前端使用框架如Vue、React等，通过AJAX或fetch等方式向后端发送请求，获取数据并展示。2.后端使用RESTfulAPI接口提供服务，将数据以JSON格式返回给前端... 查看详情

微信小程序用户授权

...下，获取到用户唯一标识，通过这个唯一标识映射到我们系统的userId就可以建立用户体系管理用户。流程：注意事项:需要弹出选项需要用户选择才能完成的授权操作，一般是为了获得用户手机号和用户信息等。获取用户信息授... 查看详情

计算机毕业设计ssm+vue基本微信小程序的执法助手平台

...助手。该微信小程序的执法助手平台分为前端和Java后端系统。前端小程序应用官方提供的API文档，主要功能为民警手机微信端查看公告资讯，进行人口登记，车辆违章管理，在线交流 查看详情

微信小程序java外卖点餐平台系统(ssm+uniapp)

...题；2.   熟练掌握JavaWeb开发语言和MySQL数据库管理系统；3.   熟悉前端与后端数据交互的相关知识；4.   该设计要能实现线上购物的操作、记录、统计等功能；5.   在规定时间内完成设计、制作和调试；... 查看详情

微信小程序无法获取到unionid(专业踩坑20年)

...一个微信开放平台下的不同应用，unionid是相同的。我们系统都做了移动应用、网站应用、和公众帐号的微信登入，我们后端这边是有微信绑定账号功 查看详情

每日总结2023-03-27

...界面，后台等思路决定等完成基本构建再进行实现。准备通过审题，命题方向为消费互联方向，具体时在网约车上实现销售功能，可以通知司机端和后端货物缺少信息，在最近的充电站点、加油站点进行补货等操作，司机可以通... 查看详情

互融云农产品追溯系统：区块链存证技术实现双向可追溯

...品安全与品质相关信息，实现从农田到餐桌的双向可追溯。农产品需求量大、覆盖范围广，安全问题关乎大众身体健康。农产品溯源，对于存在疑问的农产品可做到及时发现、及时处理，同时规范农产品种植、加... 查看详情

通过微信小程序实现登录功能

...0c;包括用户名、密码输入框和登录按钮。将用户名和密码通过HTTPSPOST请求发送到后端服务器。后端服务器验证用户名和密码是否正确，如果正确，则生成并返回一个session_key。前端接收到session_key后，将其保存在本地st... 查看详情

移动报表展现

...现用户最关注的数据。通过手势左右滑动可在首页报表与系统资源列表间方便地切换。支持报表翻页、缩放、锁定表头、超链接钻取、统计图，移动端随时随地查看报表。 灵活的查询交互功能，提供丰富的查询输入控件，移... 查看详情