Wifi分销多开版
免费分享给大家

功能模块：

WIFI管理

新建编辑WIFI、累计有效次数统计、搜索WIFI、WIFI码管理、批量新建WIFI码

佣金管理

查看每日佣金记录
查看每次连接分成
任意比例设置

团队管理

团长、拓展员、商家
可任意设置下级佣金比例
可通过审核和拒绝代理申请

结算单管理

提现管理

支付宝提现、微信提现、收款码上传

话不多说先看效果图

小程序采用原生代码

    use: [ "customLoading", "custom", "userInfo" ],
    data: {
        singlePage: "singlePage" === i.globalData.mode,
        menuList: [],
        defaultAvatar: "".concat(i.globalData.moduleHost, "/resources/image/default_user.png"),
        defaultInvite: "".concat(i.globalData.moduleHost, "/resources/image/invite.png"),
        defaultManager: "".concat(i.globalData.moduleHost, "/resources/image/invite.png"),
        showPopupImage: !1,
        currentItem: {}
    },
    onLoad: function() {
        var e = this;
        t.default.getCustom(function(t) {
            console.log("custom: ", t), e._initAd(), t.title && wx.setNavigationBarTitle({
                title: t.title
            });
        });
    },
    _initAd: function() {
        var e = this.data.$.custom;
        wx.createInterstitialAd && 1 == e.ad_screen_active && (n = wx.createInterstitialAd({
            adUnitId: e.ad_screen || ""
        })).onError(function(e) {
            console.error("插屏广告加载失败：", e);
        });
    },
    onShow: function() {
        var e = this.data.$.custom;
        setTimeout(function() {
            n && 1 == e.ad_screen_active && n.show().catch(function(e) {
                console.error("插屏广告加载失败：", e);
            });
        }, 1e3 * e.ad_screen_timeout);
    },
    onClose: function() {
        this.setData({
            showPopupImage: !1
        });
    },
    handleBannerItemClick: function(e) {
        var t = e.currentTarget.dataset.item;
        switch (t.type) {
          case "h5":
            t.url ? wx.navigateTo({
                url: "/pages/webview/index?src=".concat(t.url)
            }) : i.utils.modalText("未设置跳转内容，操作失败");
            break;

          case "mini":
            wx.navigateToMiniProgram({
                appId: t.appid,
                path: decodeURIComponent(t.url),
                fail: function(e) {
                    var a = e.errMsg;
                    "navigateToMiniProgram:fail invalid appid" === a ? i.utils.modalText("跳转失败，可能是小程序路径或appid填写错误") : "navigateToMiniProgram:fail can't navigate to myself" === a && wx.navigateTo({
                        url: decodeURIComponent(t.url)
                    });
                }
            });
        }
    },
    handleItemClick: function(e) {
        var t = e.currentTarget.dataset.item;
        switch (t.type) {
          case "h5":
            t.url ? wx.navigateTo({
                url: "/pages/webview/index?src=".concat(t.url)
            }) : i.utils.modalText("未设置内容，操作失败");
            break;

          case "image":
            t.content ? this.setData({
                showPopupImage: !0,
                currentItem: {
                    content: t.content
                }
            }) : i.utils.modalText("未设置内容，操作失败");
            break;

          case "text":
            t.content ? wx.showModal({
                title: t.title || "",
                content: t.content,
                showCancel: !1,
                confirmText: t.confirm_text || "我知道了"
            }) : i.utils.toastText("未设置内容，操作失败");
            break;

          case "mini":
            if (!t.appid) return void wx.navigateTo({
                url: t.url
            });
            wx.navigateToMiniProgram({
                appId: t.appid,
                path: decodeURIComponent(t.url),
                fail: function(e) {
                    var a = e.errMsg;
                    "navigateToMiniProgram:fail invalid appid" === a ? i.utils.modalText("跳转失败，可能是小程序路径或appid填写错误") : "navigateToMiniProgram:fail can't navigate to myself" === a && wx.navigateTo({
                        url: t.url
                    });
                }
            });
        }
    },
    handleCreateWifi: function() {
        wx.navigateTo({
            url: "/wifi/edit/index"
        });
    },
    handleManagerClick: function() {
        wx.navigateTo({
            url: "/wifi/list/index"
        });
    },
    handleInvite: function() {
        wx.navigateTo({
            url: "/pages/invite/index"
        });
    },
    handleMember: function() {
        wx.navigateTo({
            url: "/pages/member/index"
        });
    },
    onShareAppMessage: function() {
        var e = this.data.$.custom || {};
        return {
            title: e.share_title || "无需密码，一键连WiFi",
            path: "/pages/home/index?share=1&uid=" + this.data.$.userInfo.id,
            imageUrl: e.share_icon || i.globalData.moduleHost + "/resources/image/wifi_square2.png"
        };
    },
    onShareTimeline: function() {
        var e = this.data.$.custom || {};
        return {
            title: e.share_title || "点击创建您的专属WiFi",
            imageUrl: e.share_icon || i.globalData.moduleHost + "/resources/image/wifi_square2.png"
        };
    }

附上下载地址：立即下载
留下个关注吧~
感谢阅读

前言

17年电赛H题中要求编写WIFI上位机实现远程幅频特性曲线显示，
以下是本人在近期摸索出来的一些心得及体会。

一、使用QT Creator编写上位机

1.工具准备
QT Creator是一款功能强大，基于C/C++的轻量级开发软件，其中封装了大量的库，类似于VS开发，我们只需将用到的库文件导入工程即可。但在安装的时候对新手不太友好，推荐国内的镜像安装，教程：Qt Creator下载和安装(详细教程)
文章中详细给出了配置开发环境的方法，可能有些人会觉得很麻烦，实际上，文章最后提供了一种傻瓜式安装，只需下载一个程序，可在安装时再根据需求配置开发环境，以下是我下载的版本。
环境配置完成，此时就可以编写上位机了。新手教程：手把手教你编写第一个上位机
当然，我们要实现WIFI通信，那就先需要具备相应的网络通信概念，基本的TCP/UDP通信协议，Socket监听机制可以初步了解一下，看不懂也没关系，毕竟我们是站在巨人的肩膀上的，可以去找找对应的开源项目，多多研读源码，再结合相关概念，一步步去理解代码的含义，个人认为这是一个比较好的学习方法。

2.绘制UI界面
在QT中绘制UI界面一般有两种方式，一是直接在.ui文件中添加控件，二是将控件代码加入Cpp文件，具体方法之前的链接中可查看。QT Creator与外界交互的核心机制是通过槽（Slot）与函数绑定，通过信号（Signal）触发回调函数。若想做出更美观的界面，可参考：如何做出优美的QT界面
类似于CSS，QT还提供了用于界面美化的QSS。具体用法可参考：QSS基本语法
原始的界面经过QSS加工后如下，并增加了保存曲线为图片的功能。

3.编写代码
由于工程中需要绘图功能，故需要导入对应绘图库，这里用的是QCustomPlot库，
源代码地址：QCustomPlot官网库
库中函数用法可使用快捷键F1查看。

WIFI通信与绘图的核心代码：

void WifiReceiver::newSocketConnect()//客户端接入
{
    //得到连入的socket
    g_tcpSocket = g_tcpServer->nextPendingConnection();
    //有可读的消息触发读函数
    connect(g_tcpSocket,SIGNAL(readyRead()),this,SLOT(readMeassage()));
    //对方解除连接
    (g_tcpSocket,SIGNAL(disconnected()),this,SLOT(on_BTN_disconnect_clicked()));
    QString tempString = "已连接："+g_tcpSocket->peerAddress().toString() + " "+QString::number(g_tcpSocket->peerPort());
    ui->statusBar->showMessage(tempString);
}

void WifiReceiver::readMeassage()
{
    QByteArray data = g_tcpSocket->readAll();

    //数据分割  x1,x2...xn|y1,y2....yn,
    //x1,x2...xn|y1,y2....yn 为发送格式,必须按格式发送，否则程序将崩溃
    QList<QByteArray> dataList = data.split('|');
    QVector<QByteArray> tempX = dataList[0].split(',').toVector();
    QVector<QByteArray> tempY = dataList[1].split(',').toVector();

    //转换为double
    QVector<double> posX,posY;
    for(int index = 0;index < tempX.size();index++)
    {
        posX.append(double(tempX[index].toDouble()));
    }
    for(int index = 0;index < tempY.size();index++)
    {
        posY.append(double(tempY[index].toDouble()));
    }

    qDebug()<<"posX:"<<posX;
    qDebug()<<"posY:"<<posY;

    /****************曲线绘制****************/
    ui->WID_customPlot->graph(0)->setData(posX,posY);
//    ui->WID_customPlot->graph(0)->rescaleAxes();
    ui->WID_customPlot->replot();
}

保存曲线代码：

/*保存曲线图片*/
bool WifiReceiver::on_saveButton_clicked()
{
    QString filename = QFileDialog::getSaveFileName();
    if(filename =="")
    {
        QMessageBox::information(this,"fail","保存失败！");
        return false;
    }
    if(filename.endsWith(".png"))
    {
        QMessageBox::information(this,"success","保存成功！");
        return ui->WID_customPlot->savePng(filename,ui->WID_customPlot->width(),ui->WID_customPlot->height());
    }
    if( filename.endsWith(".jpg")||filename.endsWith(".jpeg") ){
        QMessageBox::information(this,"success","成功保存为jpg文件");
        return ui->WID_customPlot->saveJpg(filename, ui->WID_customPlot->width(), ui->WID_customPlot->height() );

    }
    if( filename.endsWith(".bmp") ){
        QMessageBox::information(this,"success","成功保存为bmp文件");
        return ui->WID_customPlot->saveBmp( filename, ui->WID_customPlot->width(), ui->WID_customPlot->height() );

    }
    if( filename.endsWith(".pdf") ){
        QMessageBox::information(this,"success","成功保存为pdf文件");
        return ui->WID_customPlot->savePdf( filename, ui->WID_customPlot->width(), ui->WID_customPlot->height() );
  }
   else{
    //否则追加后缀名为.png保存文件
        QMessageBox::information(this,"success","保存成功,已默认保存为png文件");
    return ui->WID_customPlot->savePng(filename.append(".png"), ui->WID_customPlot->width(), ui->WID_customPlot->height() );

   }
}

二、上位机与网络调试助手联调

上位机调试完毕后，可利用网络调试助手进行通信，查看能否正常联网以及实现绘图功能。
若程序已以release版本发布，打开可执行程序WifiReceiver.exe：

上位机作为服务端（Server），网络调试助手作为客户端（Client）连接：

输入本地IP和端口号，连接成功后发送数据，得到数据绘制的曲线效果如下：

保存曲线到本地：

三、总结

关于 QT上位机和网络开发，本人目前仍属于初级阶段，还需要继续学习有关网络通信的知识，欢迎各位大神指教。