WebApp学院助手研发

作者:焦旭涛
项目:学院助手APP
完成时间:2018-7-20~2018-12-15

实现功能

学院助手主要功能如下:
  1. 首页技术文章分享
  2. 学院当地天气信息查询
  3. 快捷翻译功能
  4. 问题全局搜索
  5. 查看学院公告

首页技术分享
进入软件的首页就是一个技术文章的信息流,同学们可以在这里查看各种类型技术文章以及学院发布的公告和置顶的通知。
还在路上,稍等...
首页的功能包括下拉刷新与上拉加载,点击相应的列表就可以跳转对应的文章网页。
还在路上,稍等...

学院当地天气信息查询
在首页、其它、工具界面的右上角都会显示当前实时的天气信息,点击即可跳转查看更详细的天气信息。
还在路上,稍等...

这里的天气信息的查询使用的是百度的接口,然后通过处理返回的数据再进行各项内容的绑定。

$.ajax({
    url:"http://api.map.baidu.com/telematics/v3/weather?location=南沙&output=json", 
       dataType:"jsonp",
       jsonpCallback:"admin_cross",
       success:function(data){
       var data=data.results[0];
       var ssqw=data.weather_data[0].date;
       var tq=ssqw.match(/实时:(\S*)℃/)[1]+"℃";
       
       $("#city").text("南沙");//城市
       $("#sswd").text(tq);//当前气温
    } 
});

快捷翻译功能
在工具页面的中间就是一个简单翻译功能,可以快速的实现中文翻译英语与英语翻译中文。
还在路上,稍等...
这个翻译的功能是通过调用百度翻译提供接口来实现的。

 //翻译
 function fanyiss(){
  	var fy=$("#textarea").val();
	var to = 'zh';//翻译后语言
	var p = /[a-z]/i;//这里通过正则判断输入的是中文还是英文
	var b = p.test(fy);
   if(b==false){to='en';}
	var appid = '';//appid 与key 需要自己去百度申请
	var key = '';
	var salt = (new Date).getTime();
	
	var query = fy;//翻译内容
	var from = 'auto';//翻以前语言
	var str1 = appid + query + salt +key;//拼接参数
	var sign = $.md5(str1);//签名
	$.ajax({//请求数据
		url: 'http://api.fanyi.baidu.com/api/trans/vip/translate',
		type: 'get',
		dataType: 'jsonp',
	    data: {
	        q: query,
	        appid: appid,
	        salt: salt,
	        from: from,
	        to: to,
	        sign: sign
	    },
	    success: function (data) {
	         $("#fyjg").val(data.trans_result[0].dst);//翻译成功进行赋值
	    } 
	});
  } 

问题全局搜索
点击底部导航的搜索即可进入全局搜索的界面,用户只需要输入自己想问的问题就可以快速的在五大平台(百度、优快云、百度知道、博客、文库)内进行详细的搜索。
在最底部最右滑动可在五大平台中进行切换。
还在路上,稍等... 还在路上,稍等...
这个功能的实现其实很简单,在请求这些网站查找东西时其实都只是一个参数的问题,只要找到这个请求参数进行修改然后直接请求就可以了。

参数shuru就是用户输入的搜索内容
mui.openWindow({//百度
	url:"https://www.baidu.com/s?wd="+shuru+"&ie=utf-8",
	id:"baidu",
}).appendJsFile("../js/qjss.js"); 
mui.preload({ //CDNS
	url:"https://so.youkuaiyun.com/so/search/s.do?q="+shuru,
	id:"cdns",
}).appendJsFile("../js/qjss.js"); 
mui.preload({//知道
	url:"https://zhidao.baidu.com/search?lm=0&rn=10&pn=0&fr=search&ie=gbk&word="+shuru,
	id:"zhidao",
}).appendJsFile("../js/qjss.js"); 
mui.preload({//博客 
	url:"https://zzk.cnblogs.com/s?t=b&w="+shuru,
	id:"boke",
}).appendJsFile("../js/qjss.js");  
mui.preload({ //文库  
	url:"https://wk.baidu.com/search?word="+shuru,
	id:"wenku",
}).appendJsFile("../js/qjss.js");     

查看学院公告
点击其它页面点击学院公告即可查看学院的公告信息,点击公告可以跳转至公告详情页面
这个学院公告的发布与查询都是通过数据存储平台的接口服务来实现的

mui.plusReady(function(){
	var ku={ //请求的参数   
		s:'',
		model_name:'zhusj ', 
		perpage:"500",//请求条数
		where:'[["leixin","=","公 告"]]',//筛选条件
		callback: "yesok"  //成功函数
	}
	$.ajax({  
		url:"",//请求路径
		dataType:"jsonp", 
		data:guanxin1(ku),//参数处理	
		cache: true,  
		jsonpCallback:"yesok", 
	});
});


function yesok(data){
	var data=data.data.list;
	$.each(data,function(i){//遍历请求到的数据,追加内容列表
		$("#tajidja").prepend('<li class="mui-table-view-cell mui-media" url='+data[i].lianjie+'>'
		+'<img class="mui-media-object mui-pull-left" src="../fonts/gx-logo.png">'
		+'<div class="mui-media-body">'
		    +data[i].bt+
		 ' <p class="mui-ellipsis">'+data[i].add_time+'</p>'
		+'</div>'
		+' </li>'); 
	});	
}
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值