若依前端APP版使用教程&企业微信(uni app)

作者 : admin 本文共3132个字,预计阅读时间需要8分钟 发布时间: 2024-06-16 共1人阅读
教程网址
名称网址备注
图标组件uni-icons 图标 | uni-app官网
1 增加页面流程

        新增Page>新增API>新增组件(可选)>新增样式(可选)>新增路径(page.json)

1.1 page.json添加如下代码,此文件项目根目录下
 {
   "path": "pages/mes/pro/feedback/index",
   "style": {
     "navigationBarTitleText": "工单报工"
   }
 }
1.2 pages的(pages/mes/pro/feedback/)下面新增index.vue文件,代码如下

  
    
      
		
		
		   
		  
		  
        
          
        
        
          
        
        
          
        
        
          
        
      
      
    
  





  page {
    background-color: #ffffff;
  }

  .example {
    padding: 15px;
    background-color: #fff;
  }

  .segmented-control {
    margin-bottom: 15px;
  }

  .button-group {
    margin-top: 15px;
    display: flex;
    justify-content: space-around;
  }

  .form-item {
    display: flex;
    align-items: center;
    flex: 1;
  }

  .button {
    display: flex;
    align-items: center;
    height: 35px;
    line-height: 35px;
    margin-left: 10px;
  }

2 APP中调用企业微信扫一扫功能

        如果公众号,服务号,小程序,引用相应的artifacetId就行了,可参生作者说明文档

2.1  在pom.xml中文件引用包(主模块)
           
                com.github.binarywang
                weixin-java-cp
                4.5.0
            
 2.2  新增企业微信Service的类,需要配合企业微信的APID和应用的配置信息,如下

                // 替换成自己应用的appId和secret,agentId,操作访法,百度或官方文件档
                Integer agentId = 1111111;
                String corpId=”XXXXXXXX”;
                String corpSecret = “XXXXXXXX”;

package com.ktg.web.controller.system;


import me.chanjar.weixin.common.bean.WxJsapiSignature;
import me.chanjar.weixin.common.error.WxErrorException;
import me.chanjar.weixin.cp.api.impl.WxCpServiceImpl;
import me.chanjar.weixin.cp.config.impl.WxCpDefaultConfigImpl;
import org.springframework.stereotype.Service;

@Service
public class QywxService {


    //获取对应应用的签名
    public WxJsapiSignature getJsapiSignture(String url) throws WxErrorException, WxErrorException {
        // 替换成自己应用的appId和secret,agentId
        Integer agentId = 1111111;
        String corpId="XXXXXXXX";
        String corpSecret = "XXXXXXXX";

        WxCpDefaultConfigImpl config = new WxCpDefaultConfigImpl();
        config.setCorpId(corpId);      // 设置微信企业号的appid
        config.setCorpSecret(corpSecret);  // 设置微信企业号的app corpSecret
        config.setAgentId(agentId);     // 设置微信企业号应用ID


        WxCpServiceImpl wxCpService = new WxCpServiceImpl();
        wxCpService.setWxCpConfigStorage(config);
        System.out.println("WxJsapiSignature===url==="+url);

        WxJsapiSignature wxJsapiSignature = wxCpService.createJsapiSignature(url);
        //wxJsapiSignature中可以直接获取签名信息 且方法内部添加了缓存功能
        return wxJsapiSignature;
    }

}

若依前端APP版使用教程&企业微信(uni app)插图 

2.3 新增QywxController的类 

package com.ktg.web.controller.system;

import me.chanjar.weixin.common.bean.WxJsapiSignature;
import me.chanjar.weixin.common.error.WxErrorException;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;

@RestController
public class QywxController {

    @Autowired
    private QywxService qywxService;


    @GetMapping(value = "/system/qywx/signature/")
    public WxJsapiSignature getJsapiSignature(@RequestParam("url") String url) {
        try {  // 直接调用wxMpServer 接口
            System.out.println("访问WxJsapiSignature=====/system/qywx/signature/" + url + "");
            WxJsapiSignature wxJsapiSignature = qywxService.getJsapiSignture(url);
            System.out.println("AppId===" + wxJsapiSignature.getAppId());
            System.out.println("Timestamp===" + wxJsapiSignature.getTimestamp());
            System.out.println("NonceStr===" + wxJsapiSignature.getNonceStr());
            System.out.println("Signature===" + wxJsapiSignature.getSignature());
            return wxJsapiSignature;
        } catch (WxErrorException e) {
            return null;
        }
    }

}

2.4 前端项目添加API的配置

3. 表单行内多个组件并排显示

        思路:将一个View,把多个组件包在一起,在使用 display: flex 布局显示

		
			
			
				
										
			
		  
		  
  .dis-flex {
	  display: flex !important;
  }

本站无任何商业行为
个人在线分享 » 若依前端APP版使用教程&企业微信(uni app)
E-->