| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487 |
- <!doctype html>
- <html>
- <head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
- <meta name="apple-mobile-web-app-capable" content="yes">
- <meta name="apple-mobile-web-app-status-bar-style" content="black">
- <title>我的效率</title>
- <link href="../../css/OA-style.css" rel="stylesheet" />
- <link href="../../css/myxl.css" rel="stylesheet" />
- <style type="text/css">
- html,
- body {
- background-color: #efeff4;
- }
-
- .mui-segmented-control .mui-control-item.mui-active {
- background-color: #00c4cb;
- }
-
- .mui-segmented-control {
- border: 1px solid #00c4cb;
- }
-
- .mui-segmented-control .mui-control-item {
- border-left: 1px solid #00c4cb;
- color: #00C4CB;
- }
-
- .mui-bar~.mui-content .mui-fullscreen {
- top: 44px;
- height: auto;
- }
-
- .mui-pull-top-tips {
- position: absolute;
- top: -20px;
- left: 50%;
- margin-left: -25px;
- width: 40px;
- height: 40px;
- border-radius: 100%;
- z-index: 1;
- }
-
- .mui-bar~.mui-pull-top-tips {
- top: 24px;
- }
-
- .mui-pull-top-wrapper {
- width: 42px;
- height: 42px;
- display: block;
- text-align: center;
- background-color: #efeff4;
- border: 1px solid #ddd;
- border-radius: 25px;
- background-clip: padding-box;
- box-shadow: 0 4px 10px #bbb;
- overflow: hidden;
- }
-
- .mui-pull-top-tips.mui-transitioning {
- -webkit-transition-duration: 200ms;
- transition-duration: 200ms;
- }
-
- .mui-pull-top-tips .mui-pull-loading {
- /*-webkit-backface-visibility: hidden;
- -webkit-transition-duration: 400ms;
- transition-duration: 400ms;*/
- margin: 0;
- }
-
- .mui-pull-top-wrapper .mui-icon,
- .mui-pull-top-wrapper .mui-spinner {
- margin-top: 7px;
- }
-
- .mui-pull-top-wrapper .mui-icon.mui-reverse {
- /*-webkit-transform: rotate(180deg) translateZ(0);*/
- }
-
- .mui-pull-bottom-tips {
- text-align: center;
- background-color: #efeff4;
- font-size: 15px;
- line-height: 40px;
- color: #777;
- }
-
- .mui-pull-top-canvas {
- overflow: hidden;
- background-color: #fafafa;
- border-radius: 40px;
- box-shadow: 0 4px 10px #bbb;
- width: 40px;
- height: 40px;
- margin: 0 auto;
- }
-
- .mui-pull-top-canvas canvas {
- width: 40px;
- }
-
- .mui-slider-indicator.mui-segmented-control {
- background-color: #efeff4;
- }
-
- .mui-scroll1 {
- z-index: 1;
- width: 100%;
- }
-
- .mui-table-view-cell{padding: 8px 0px;}
- .mui-bar-nav {background: #00c4cb;}
- </style>
- </head>
- <body>
- <header class="mui-bar mui-bar-nav" id="login">
- <a class="mui-action-back back mui-pull-left"><img src="../../images/back.png"></a>
- <h1 class="mui-title">待办效率</h1>
- </header>
-
- <div class="mui-content">
- <div id="slider" class="mui-slider mui-fullscreen">
- <div style="padding: 10px 10px;">
- <div id="segmentedControl" class="mui-segmented-control">
- <div class="mui-scroll1">
- <a class="mui-control-item mui-active" href="#item1mobile" style="font-size: 16px;">未签收</a>
- <a class="mui-control-item" href="#item2mobile" style="font-size: 16px;">已签收</a>
- </div>
- </div>
- </div>
- <div class="mui-slider-group">
- <div id="item1mobile" class="mui-slider-item mui-control-content mui-active">
- <div class="mui-scroll-wrapper">
- <div class="mui-scroll" id="pullrefresh">
- <ul class="mui-table-view" id="items1">
- <li class="mui-table-view-cell" :data-id="item.xiaolv_id" v-for="item in item1" @tap="open_detail(item)" style="margin: 0px 10px;">
- <!--<div class="list_gg_item mui-clearfix">
- <div class="mui-card-header tongzhi_title"><b>{{item.duban_name}}</b></div>
- <div class="mui-card-content">
- <div class="mui-card-content-inner">
- <div >
- <div class="tongzhi_div"><img class="tongzhi_img" src="../../images/dubanneirong.png" style="width: 15px;"></div>
- <div class="tongzhi_div2">{{item.content}}</div><p></p>
- <div class="tongzhi_div"><img class="tongzhi_img" src="../../images/dubanneirong.png" style="width: 15px;"></div>
- <div class="tongzhi_div2" v-html="item.huanji"></div><p></p>
- <span class="tongzhi_div"><img class="tongzhi_img" src="../../images/zhibanshijian.png"style="width: 15px;"></span>
- <span class="tongzhi_div1">{{item.duban_date}}至<font v-html="item.yujing_date"></font></span>
- </div>
- </div>
- </div>
- </div>-->
- <div class="dbxl_div" style="margin-bottom:0px !important; overflow: hidden;">
- <div><b>{{item.duban_name}}</b><span class="dbxl_span" v-html="item.huanji"></span></div>
- <div class="dbxl_div1" style="overflow: hidden;">
- <div class="dbxl_div2">
- <div class="dbxl_div_border"style="background-color: #EEEEEE;height:4px;border: #EEEEEE;"></div>
- <div class="dbxl_div_border2" ><center>
- <div class="dbxl_time1">{{item.duban_date}}</div>
- <div class="dbxl_time2"><font v-html="item.yujing_date"></font></div>
- </center></div>
- </div>
- <div class="dbxl_div3">
- <div class="dbxl_div_border" style="background-color: #EEEEEE;height:4px;border: #EEEEEE;">
-
- </div>
- <div class="dbxl_div_border2" style="overflow:hidden; text-overflow:ellipsis;display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:3; text-indent: 1em; ">
- <div class="dbxl_center">{{item.content}}</div>
- </div>
- </div>
- </div>
- </div>
- </li>
- </ul>
- </div>
- </div>
- </div>
-
-
- <div id="item2mobile" class="mui-slider-item mui-control-content ">
- <div class="mui-scroll-wrapper">
- <div class="mui-scroll" id="pullrefresh2">
- <ul class="mui-table-view" id="items2">
- <li class="mui-table-view-cell" :data-id="item.xiaolv_id" v-for="item in item2" @tap="open_detail(item)">
- <!--<div class="list_gg_item mui-clearfix">
- <div class="mui-card-header tongzhi_title"><b>{{item.duban_name}}</b></div>
- <div class="mui-card-content">
- <div class="mui-card-content-inner">
- <div >
- <div class="tongzhi_div"><img class="tongzhi_img" src="../../images/dubanneirong.png" style="width: 15px;"></div>
- <div class="tongzhi_div2">{{item.content}}</div><p></p>
- <div class="tongzhi_div"><img class="tongzhi_img" src="../../images/dubanneirong.png" style="width: 15px;"></div>
- <div class="tongzhi_div2" v-html="item.huanji"></div><p></p>
- <span class="tongzhi_div"><img class="tongzhi_img" src="../../images/zhibanshijian.png"style="width: 15px;"></span>
- <span class="tongzhi_div1">{{item.duban_date}}至<font v-html="item.yujing_date"></font></span>
- </div>
- </div>
- </div>
- </div>-->
- <div class="dbxl_div" style="margin-bottom:0px !important; overflow: hidden;">
- <div><b>{{item.duban_name}}</b><span class="dbxl_span" v-html="item.huanji"></span></div>
- <div class="dbxl_div1" style="overflow: hidden;">
- <div class="dbxl_div2">
- <div class="dbxl_div_border" style="background-color: #EEEEEE;height:4px;border: #EEEEEE;"></div>
- <div class="dbxl_div_border2"><center>
- <div class="dbxl_time1">{{item.duban_date}}</div>
- <div class="dbxl_time2"><font v-html="item.yujing_date"></font></div>
- </center></div>
- </div>
- <div class="dbxl_div3">
- <div class="dbxl_div_border" style="background-color: #EEEEEE;height:4px;border: #EEEEEE;">
- </div>
- <div class="dbxl_div_border2" style="overflow:hidden; text-overflow:ellipsis;display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:3; ">
- <div class="dbxl_center">{{item.content}}</div>
- </div>
- </div>
- </div>
- </div>
- </li>
- </ul>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- <script type="text/javascript" src="../../js/jquery-1.11.2.min.js"></script>
- <script src="../../js/mui.min.js"></script>
- <script src="../../js/config.js"></script>
- <script src="../../js/app.js"></script>
- <script src="../../js/vue.min.js"></script>
- <script src="../../js/mui.pullToRefresh.js"></script>
- <script src="../../js/mui.pullToRefresh.material.js"></script>
- <script>
- mui.init();
- var pageNo = 1;
- var pageNo2 = 1;
- var pageNo3 = 1;
- (function($) {
- //初始化单页的区域滚动
- mui('.mui-scroll-wrapper').scroll();
- //阻尼系数
- var deceleration = mui.os.ios ? 0.003 : 0.0009;
- $('.mui-scroll-wrapper').scroll({
- bounce: false,
- indicators: true, //是否显示滚动条
- deceleration: deceleration
- });
-
- mui.plusReady(function() {
- var self = plus.webview.currentWebview();
- id = self.xiaolv_id;
-
- $.each(document.querySelectorAll('.mui-slider-group .mui-scroll'), function(index, pullRefreshEl) {
- $(pullRefreshEl).pullToRefresh({
- //container: '.list_item',
- down: {
- // style: 'circle', //必选,下拉刷新样式,目前支持原生5+ ‘circle’ 样式
- // color: '#2BD009', //可选,默认“#2BD009” 下拉刷新控件颜色
- // height: '50px', //可选,默认50px.下拉刷新控件的高度,
- // range: '100px', //可选 默认100px,控件可下拉拖拽的范围
- // offset: '0px', //可选 默认0px,下拉刷新控件的起始位置
- // auto: true, //可选,默认false.首次加载自动上拉刷新一次
- callback: function() {
- var self = this;
- setTimeout(function() {
- var ul = self.element.querySelector('.mui-table-view');
- reloadNews(ul, self);
- self.endPullDownToRefresh();
- }, 1000); //必选,刷新函数,根据具体业务来编写,比如通过ajax从服务器获取新数据;
- }
- },
- up: {
- contentrefresh: '正在加载...',
- auto: true, //可选,默认false.自动上拉加载一次
- callback: function() {
- var self = this;
- setTimeout(function() {
- var ul = self.element.querySelector('.mui-table-view');
- console.log(pullRefreshEl.id);
- pullupRefresh(ul, self);
- self.endPullUpToRefresh();
- }, 1000);
- }
- }
- });
- //statusBarBackground: '#FFFFFF', //设置状态栏颜色,仅iOS可用
- // preloadLimit:5,
- });
- });
- })(mui);
-
- var vmA = new Vue({
- el: '#pullrefresh',
- data: {
- item1: [] //列表信息流数据
- }
- });
-
- var vmB = new Vue({
- el: '#items2',
- data: {
- item2: [] //列表信息流数据
- }
- });
-
-
- /**
- * 下拉刷新具体业务实现
- */
- function reloadNews(ul,self) {
- /*vmA.item1 = [];
- addData();*/
- var dataType = self.element.id;
- if("pullrefresh" == dataType) {
- pageNo = 1;
- vmA.item1 = [];
- addData(ul, self);
- } else if("pullrefresh2" == dataType) {
- pageNo2 = 1;
- vmB.item2 = [];
- addData2(ul, self);
- }
- }
-
- /**
- * 上拉加载具体业务实现
- */
- function pullupRefresh(ul, self) {
- var dataType = self.element.id;
- if("pullrefresh" == dataType) {
- addData(ul, self);
- } else if("pullrefresh2" == dataType) {
- addData2(ul, self);
- }
- }
-
- function addData(ul, self) {
- var state3= mui('#state');//状态显示
- var url = API.API_URL();
- var serviceId = "oa_efficiency_2018V0010PHONE003";
- var state = app.getState(); //获取登陆信息
- var userId = state.user.useId;
- var state2 = "0"; //督办状态
- var obj = {
- currentUser: userId,
- pSize: APP.PageSize,
- p: pageNo,
- state:state2
- };
- app.ajax(serviceId,obj, function(data) {
- //服务器返回响应
- console.log(JSON.stringify(data))
- var result = data.returnParams;
-
- var totalRow = data.total;
- //var totalPage = data.current;
- var totalPage = Math.ceil(totalRow / APP.PageSize);
- console.log("=====总页数=====" + totalPage);
- var list = data.list;
- console.log(list.length);
- if(list.length > 0) {
- vmA.item1 = vmA.item1.concat(convert(list));
- }
- if(totalPage==0||totalPage==1){
- self.endPullUpToRefresh(true);
- }else{
- self.endPullUpToRefresh(totalPage == pageNo);//参数为true代表没有更多数据了。
- }
- if(pageNo == 1 && totalPage > 1)
- self.refresh(true); //调用.refresh(true)方法,可重置上拉加载控件,注意:refresh()中需传入true
- pageNo = pageNo + 1;
- });
- }
-
- function addData2(ul, self) {
- var url = API.API_URL();
- var serviceId = "oa_efficiency_2018V0010PHONE003";
- var state = app.getState(); //获取登陆信息
- var userId = state.user.useId;
- var state2 = "1"; //督办状态
- var obj = {
- currentUser: userId,
- pSize: APP.PageSize,
- p: pageNo2,
- state:state2
- };
- app.ajax(serviceId,obj, function(data) {
- //服务器返回响应
- console.log(JSON.stringify(data))
- var result = data.returnParams;
-
- var totalRow = data.total;
- //var totalPage = data.current;
- var totalPage = Math.ceil(totalRow / APP.PageSize);
- console.log("=====总页数=====" + totalPage);
- var list = data.list;
- if(totalPage == 0) {
- totalPage = 1;
- }
- console.log(list.length);
- if(list.length > 0) {
- vmB.item2 = vmB.item2.concat(convert(list));
- }
- if(totalPage==0||totalPage==1){
- self.endPullUpToRefresh(true);
- }else{
- self.endPullUpToRefresh(totalPage == pageNo);//参数为true代表没有更多数据了。
- }
- if(pageNo2 == 1 && totalPage > 1)
- self.refresh(true); //调用.refresh(true)方法,可重置上拉加载控件,注意:refresh()中需传入true
- pageNo2 = pageNo2 + 1;
- });
- }
-
- /**
- * 1、将服务端返回数据,转换成前端需要的格式
- * 2、若服务端返回格式和前端所需格式相同,则不需要改功能
- *
- * @param {Array} item1
- */
- function convert(items) {
- var newItems = [];
- var state2 = "";
- items.forEach(function(item) {
- var date = item.yujing_date;
- var yujing = new Date(Date.parse(date .replace(/-/g,"/")));
- if(new Date() > yujing || new Date() == yujing) {
- yujing_date='<font color="red">'+date+'</font>';
- } else if (new Date(new Date().getTime() + 3*24*60*60*1000)> yujing || new Date(new Date().getTime() + 3*24*60*60*1000) == yujing) {
- yujing_date='<font color="#f60">'+date+'</font>';
- } else {
- yujing_date='<font color="#008000">'+date+'</font>';
- }
- var huanji = item.huanji;
- if("1"==huanji) {
- huanji = '<font color="#008000">普通</font>';
- }
- if("2"==huanji) {
- huanji = '<font color="#f60">紧急</font>';
- }
- if("3"==huanji) {
- huanji = '<font color="red">特急</font>';
- }
- newItems.push({
- xiaolv_id: item.xiaolv_id,
- duban_name:item.duban_name,
- title: item.duban_name,
- duban_date:item.duban_date,
- yujing_date:yujing_date,
- fankui_id:item.fankui_id,
- state:state2,
- huanji:huanji,
- states:item.states,
- content: item.content == null ? "" : item.content.substr(0, 60)
- });
- });
- return newItems;
- }
-
- /**
- * 打开督办详情
- *
- * @param {Object} item 当前点击的督办对象
- */
- function open_detail(item) {
- if("0"==item.states) {
- mui.openWindow({
- url: '../../page/efficiency/efficiencySignInfo.html',
- id: 'efficiencySignInfo.html',
- extras:{'xiaolv_id':item.xiaolv_id,'fankui_id':item.fankui_id}
- })
- } else {
- mui.openWindow({
- url: '../../page/efficiency/efficiencyFeedbackInfo.html',
- id: 'efficiencyFeedbackInfo.html',
- extras:{'xiaolv_id':item.xiaolv_id,'fankui_id':item.fankui_id}
- })
- }
- }
- </script>
- </body>
- </html>
|