Commit 6d2aee2f9fd49550b8b93ff412a9be7681a3635c
1 parent
06ba74ebca
Exists in
master
修改html
Showing
3 changed files
with
62 additions
and
127 deletions
Show diff stats
static/js/tpl.js
| 1 | $(function(){ | 1 | $(function(){ |
| 2 | // 轮播图 | 2 | // 轮播图 |
| 3 | var mySwiper = new Swiper ('.swiper-container', { | 3 | var mySwiper = new Swiper ('.swiper-container', { |
| 4 | direction: 'horizontal', | 4 | direction: 'horizontal', |
| 5 | loop: true, | 5 | loop: true, |
| 6 | // 如果需要分页器 | 6 | // 如果需要分页器 |
| 7 | pagination: '.swiper-pagination', | 7 | pagination: '.swiper-pagination', |
| 8 | // 如果需要前进后退按钮 | 8 | // 如果需要前进后退按钮 |
| 9 | nextButton: '.swiper-button-next', | 9 | nextButton: '.swiper-button-next', |
| 10 | prevButton: '.swiper-button-prev' | 10 | prevButton: '.swiper-button-prev' |
| 11 | }); | 11 | }); |
| 12 | $(".banner-wrap").height(window.innerWidth * 430 / 2732); | 12 | $(".banner-wrap").height(window.innerWidth * 430 / 2732); |
| 13 | var pages = [1], | 13 | var pages = [1], |
| 14 | col = parseInt((+$('body').width() * 0.8 < 750 ? 750 : +$('body').width() * 0.8) / 227), | 14 | col = parseInt((+$('body').width() * 0.8 < 750 ? 750 : +$('body').width() * 0.8) / 227), |
| 15 | _template = '<li data-id="${app_id}" data-desc="${description}" data-logo="${logo}" class="js-tpl"><img class="cover" src="${cover}" onerror="errorWeiyeCover(this)"><p class="name">${app_name}' | 15 | _template = '<li data-id="${app_id}" data-desc="${description}" data-logo="${logo}" class="js-tpl"><img class="cover" src="${cover}" onerror="errorWeiyeCover(this)"><p class="name">${app_name}' |
| 16 | + '</p><div class="code-mask"><img class="code" src="${qrcode}" alt="">' | 16 | + '</p><div class="code-mask"><img class="code" src="${qrcode}" alt="">' |
| 17 | + '<span class="select-btn js-preview-btn">预览</span>${copy}</div></li> ', | 17 | + '<span class="select-btn js-preview-btn">预览</span>${copy}</div></li> ', |
| 18 | _cataData = {}, | 18 | _cataData = {}, |
| 19 | _appData = {}, | 19 | _appData = {}, |
| 20 | cdnUrl="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend"; | 20 | cdnUrl="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend"; |
| 21 | getCategory(); | 21 | getCategory(); |
| 22 | $('body').on('click', '#first-navs span', function(event) { | 22 | $('body').on('click', '#first-navs span', function(event) { |
| 23 | if($(this).hasClass('active')){ | 23 | if($(this).hasClass('active')){ |
| 24 | return; | 24 | return; |
| 25 | } | 25 | } |
| 26 | var cate = $(this).attr("data-cate"), | 26 | var cate = $(this).attr("data-cate"), |
| 27 | index = $(this).index(); | 27 | index = $(this).index(); |
| 28 | 28 | ||
| 29 | $(this).addClass('active').siblings('.active').removeClass('active'); | 29 | $(this).addClass('active').siblings('.active').removeClass('active'); |
| 30 | $(".tpl-content").eq(index).addClass('active').siblings('.active').removeClass('active'); | 30 | $(".tpl-content").eq(index).addClass('active').siblings('.active').removeClass('active'); |
| 31 | if($(this).hasClass('js-uninitial')){ | 31 | if($(this).hasClass('js-uninitial')){ |
| 32 | $(this).removeClass('js-uninitial'); | 32 | $(this).removeClass('js-uninitial'); |
| 33 | if ($('.tpl-content.active .tpl-container').hasClass('js-requesting')) { | 33 | if ($('.tpl-content.active .tpl-container').hasClass('js-requesting')) { |
| 34 | return; | 34 | return; |
| 35 | }; | 35 | }; |
| 36 | $('.tpl-content.active .tpl-container').addClass('js-requesting'); | 36 | $('.tpl-content.active .tpl-container').addClass('js-requesting'); |
| 37 | getTpls(cate, index); | 37 | getTpls(cate, index); |
| 38 | } | 38 | } |
| 39 | }).on('click','.tpl-sec-navs span' ,function(event) { | 39 | }).on('click','.tpl-sec-navs span' ,function(event) { |
| 40 | if($(this).hasClass('active')){ | 40 | if($(this).hasClass('active')){ |
| 41 | return; | 41 | return; |
| 42 | } | 42 | } |
| 43 | var cate = $(this).attr("data-cate"), | 43 | var cate = $(this).attr("data-cate"), |
| 44 | index = $("#first-navs .active").index(); | 44 | index = $("#first-navs .active").index(); |
| 45 | 45 | ||
| 46 | $(this).addClass('active').siblings('.active').removeClass('active'); | 46 | $(this).addClass('active').siblings('.active').removeClass('active'); |
| 47 | pages[index] = 1; | 47 | pages[index] = 1; |
| 48 | $(".tpl-container").removeClass('js-no-more').eq(index).find('.js-tpl').remove(); | 48 | $(".tpl-container").removeClass('js-no-more').eq(index).find('.js-tpl').remove(); |
| 49 | getTpls(cate, index); | 49 | getTpls(cate, index); |
| 50 | }).on('click', '.choose-btn', function(event) { | 50 | }).on('click', '.choose-btn', function(event) { |
| 51 | // var appId = $(this).parent().parent().attr('data-id'); | 51 | // var appId = $(this).parent().parent().attr('data-id'); |
| 52 | // if($(this).hasClass('js-preview-btn')){ | 52 | // if($(this).hasClass('js-preview-btn')){ |
| 53 | // initialPreview(appId); | 53 | // initialPreview(appId); |
| 54 | // $('#preview-tpl-dialog').show('slow'); | 54 | // $('#preview-tpl-dialog').show('slow'); |
| 55 | // $('#add-app-dialog').attr('data-id', appId).attr('data-color', ''); | 55 | // $('#add-app-dialog').attr('data-id', appId).attr('data-color', ''); |
| 56 | // }else{ | 56 | // }else{ |
| 57 | // $('#add-app-dialog').attr('data-id', appId).attr('data-color', '').show('slow'); | 57 | // $('#add-app-dialog').attr('data-id', appId).attr('data-color', '').show('slow'); |
| 58 | // } | 58 | // } |
| 59 | 59 | ||
| 60 | var $li = $(this).closest('li'), | 60 | var $li = $(this).closest('li'), |
| 61 | param = { | 61 | param = { |
| 62 | app_name : $li.children('.name').text(), | 62 | app_name : $li.children('.name').text(), |
| 63 | description: '' , | 63 | description: '' , |
| 64 | logo : cdnUrl + '/static/invitation/images/logo.png', | 64 | logo : cdnUrl + '/static/invitation/images/logo.png', |
| 65 | cover: cdnUrl + '/static/webapp/images/share_feng.jpg' , | 65 | cover: cdnUrl + '/static/webapp/images/share_feng.jpg' , |
| 66 | f_app_id : $li.attr("data-id") | 66 | f_app_id : $li.attr("data-id") |
| 67 | }; | 67 | }; |
| 68 | addApp($(this) , param); | 68 | addApp($(this) , param); |
| 69 | event.stopPropagation(); | 69 | event.stopPropagation(); |
| 70 | }).on('click', '.code-mask', function(event) { | 70 | }).on('click', '.code-mask', function(event) { |
| 71 | var appId = $(this).closest('li').attr('data-id'); | 71 | var appId = $(this).closest('li').attr('data-id'); |
| 72 | window.open('/webapp/?r=pc/Webapp/preview&id=' + appId +'&f_tpl=1'); | 72 | window.open('/webapp/?r=pc/Webapp/preview&id=' + appId +'&f_tpl=1'); |
| 73 | }).on('click', '.empty-tpl', function(event) { | 73 | }).on('click', '.empty-tpl', function(event) { |
| 74 | // var appId = $(this).attr('data-id'); | 74 | // var appId = $(this).attr('data-id'); |
| 75 | // $('#add-app-dialog').attr('data-id', appId).attr('data-color', '').show('slow'); | 75 | // $('#add-app-dialog').attr('data-id', appId).attr('data-color', '').show('slow'); |
| 76 | var $li = $(this).closest('li'), | 76 | var $li = $(this).closest('li'), |
| 77 | param = { | 77 | param = { |
| 78 | app_name : '我的应用', | 78 | app_name : '我的应用', |
| 79 | description: '', | 79 | description: '', |
| 80 | logo : cdnUrl + '/static/invitation/images/logo.png', | 80 | logo : cdnUrl + '/static/invitation/images/logo.png', |
| 81 | cover: cdnUrl + '/static/webapp/images/share_feng.jpg' | 81 | cover: cdnUrl + '/static/webapp/images/share_feng.jpg' |
| 82 | }; | 82 | }; |
| 83 | addApp($(this) , param); | 83 | addApp($(this) , param); |
| 84 | }) | 84 | }) |
| 85 | 85 | ||
| 86 | 86 | ||
| 87 | function getCategory(){ | 87 | function getCategory(){} |
| 88 | $ajax('/index.php?r=pc/AppData/AppCategoryList','get',{type : 0},'json', | 88 | |
| 89 | function(data){ | ||
| 90 | if (data.status === 0) { | ||
| 91 | var categorys = data.data, | ||
| 92 | contentsStr = '', | ||
| 93 | firstCateStr = ''; | ||
| 94 | if(categorys.length){ | ||
| 95 | $(categorys).each(function(index, item) { | ||
| 96 | var secCates = item.cate, | ||
| 97 | contentStr = '<div class="tpl-content '+(index==0 ? 'active' : '')+'"><div class="tpl-sec-navs">', | ||
| 98 | secCatesStr = ''; | ||
| 99 | |||
| 100 | if(secCates.length > 0){ | ||
| 101 | secCatesStr += '<span data-cate="'+item.id+'" class="active">全部</span>'; | ||
| 102 | $(secCates).each(function(index, el) { | ||
| 103 | secCatesStr += '<span data-cate="'+el.id+'">'+el.name+'</span>'; | ||
| 104 | }); | ||
| 105 | } | ||
| 106 | |||
| 107 | firstCateStr += '<span data-cate="'+item.id+'" class="'+(index==0 ? 'active' : 'js-uninitial')+'">'+item.name+'</span>' | ||
| 108 | contentStr += secCatesStr + '</div><ul class="tpl-container"><li class="empty-tpl" data-id="-1"><div class="note-icon"></div><p class="name">空白模板</p></li></ul></div>'; | ||
| 109 | contentsStr += contentStr; | ||
| 110 | pages.push(1); | ||
| 111 | }); | ||
| 112 | |||
| 113 | $('#first-navs').append(firstCateStr); | ||
| 114 | $('body').append(contentsStr); | ||
| 115 | if (window.location.hash == '#single') { | ||
| 116 | // 线上data-cate = 12 | ||
| 117 | $('#first-navs span[data-cate="12"]').trigger('click'); | ||
| 118 | }; | ||
| 119 | getTpls(categorys[0].id , 0); | ||
| 120 | }else{ | ||
| 121 | // 没有分类时 | ||
| 122 | $('#first-navs span').eq(0).trigger('click'); | ||
| 123 | } | ||
| 124 | }else{ | ||
| 125 | alertTip(data.data); | ||
| 126 | } | ||
| 127 | },function(data){ | ||
| 128 | alertTip(data.data); | ||
| 129 | }); | ||
| 130 | } | ||
| 131 | 89 | ||
| 132 | function getTpls(cate, index){ | 90 | function getTpls(cate, index){ |
| 133 | var $container = $('.tpl-container').eq(index), | 91 | var $container = $('.tpl-container').eq(index), |
| 134 | param = {type: 0, page: pages[index], page_size: 20}; | 92 | param = {type: 0, page: pages[index], page_size: 20}; |
| 135 | 93 | ||
| 136 | if(cate == -1){ | 94 | if(cate == -1){ |
| 137 | param.user = 1; | 95 | param.user = 1; |
| 138 | }else{ | 96 | }else{ |
| 139 | param.cate_id = cate; | 97 | param.cate_id = cate; |
| 140 | } | 98 | } |
| 141 | $ajax('/index.php?r=pc/AppData/AppTplList','get',param,'json', | 99 | $ajax('/index.php?r=pc/AppData/AppTplList','get',param,'json', |
| 142 | function(data){ | 100 | function(data){ |
| 143 | if (data.status === 0) { | 101 | if (data.status === 0) { |
| 144 | var tpls = data.data; | 102 | var tpls = data.data; |
| 145 | tpls.length && dealData(tpls, $container, index); | 103 | tpls.length && dealData(tpls, $container, index); |
| 146 | 104 | ||
| 147 | pages[index]++; | 105 | pages[index]++; |
| 148 | if(data.is_more == 0){ | 106 | if(data.is_more == 0){ |
| 149 | $container.addClass('js-no-more'); | 107 | $container.addClass('js-no-more'); |
| 150 | } | 108 | } |
| 151 | }else{ | 109 | }else{ |
| 152 | alertTip(data.data); | 110 | alertTip(data.data); |
| 153 | } | 111 | } |
| 154 | $container.removeClass('js-requesting'); | 112 | $container.removeClass('js-requesting'); |
| 155 | }, | 113 | }, |
| 156 | function(data){ | 114 | function(data){ |
| 157 | alertTip(data.tpls); | 115 | alertTip(data.tpls); |
| 158 | $container.removeClass('js-requesting') | 116 | $container.removeClass('js-requesting') |
| 159 | }); | 117 | }); |
| 160 | } | 118 | } |
| 161 | 119 | ||
| 162 | function dealData(tpls, $container, index){ | 120 | function dealData(tpls, $container, index){ |
| 163 | $container.find('.filler').remove(); | 121 | $container.find('.filler').remove(); |
| 164 | 122 | ||
| 165 | var content = '', | 123 | var content = '', |
| 166 | addAmount = tpls.length, | 124 | addAmount = tpls.length, |
| 167 | curAmount = $container.find('.js-tpl').length, | 125 | curAmount = $container.find('.js-tpl').length, |
| 168 | temp = (addAmount+curAmount)%col, | 126 | temp = (addAmount+curAmount)%col, |
| 169 | fillerAmount = ( temp ? col : 0 ), // 需要增加的filler个数 | 127 | fillerAmount = ( temp ? col : 0 ), // 需要增加的filler个数 |
| 170 | shadowLis = ''; | 128 | shadowLis = ''; |
| 171 | 129 | ||
| 172 | $.each(tpls, function(i, item){ | 130 | $.each(tpls, function(i, item){ |
| 173 | content += ' ' + parseTemplate(item, index); | 131 | content += ' ' + parseTemplate(item, index); |
| 174 | }); | 132 | }); |
| 175 | for(var i=0; i<fillerAmount; i++){ | 133 | for(var i=0; i<fillerAmount; i++){ |
| 176 | shadowLis += ' <li class="filler"> </li>'; | 134 | shadowLis += ' <li class="filler"> </li>'; |
| 177 | } | 135 | } |
| 178 | content += shadowLis; | 136 | content += shadowLis; |
| 179 | 137 | ||
| 180 | $container.append(content); | 138 | $container.append(content); |
| 181 | } | 139 | } |
| 182 | 140 | ||
| 183 | // 拼接请求到的数据内容 | 141 | // 拼接请求到的数据内容 |
| 184 | function parseTemplate(data , index){ | 142 | function parseTemplate(data , index){ |
| 185 | var html = _template.replace(/\$\{(\w+)\}/g, function($0, $1){ | 143 | var html = _template.replace(/\$\{(\w+)\}/g, function($0, $1){ |
| 186 | switch($1){ | 144 | switch($1){ |
| 187 | case 'copy': | 145 | case 'copy': |
| 188 | // if(index==0){ | 146 | // if(index==0){ |
| 189 | // return '<span class="select-btn choose-btn">复制</span>'; | 147 | // return '<span class="select-btn choose-btn">复制</span>'; |
| 190 | // }else{ | 148 | // }else{ |
| 191 | return '<span class="select-btn choose-btn">选择</span>'; | 149 | return '<span class="select-btn choose-btn">选择</span>'; |
| 192 | // } | 150 | // } |
| 193 | 151 | ||
| 194 | default : | 152 | default : |
| 195 | return data[$1]; | 153 | return data[$1]; |
| 196 | } | 154 | } |
| 197 | }); | 155 | }); |
| 198 | return html; | 156 | return html; |
| 199 | } | 157 | } |
| 200 | 158 | ||
| 201 | 159 | ||
| 202 | // .on('click', '#group-page-container .group-nav', function(event) { | 160 | // .on('click', '#group-page-container .group-nav', function(event) { |
| 203 | // // 组折叠 | 161 | // // 组折叠 |
| 204 | // event.preventDefault(); | 162 | // event.preventDefault(); |
| 205 | // var target = $(this).parent(); | 163 | // var target = $(this).parent(); |
| 206 | // target.toggleClass('active'); | 164 | // target.toggleClass('active'); |
| 207 | // }).on('click', '#group-page-container .page-nav', function(event) { | 165 | // }).on('click', '#group-page-container .page-nav', function(event) { |
| 208 | // if($(this).hasClass('active')){ | 166 | // if($(this).hasClass('active')){ |
| 209 | // return; | 167 | // return; |
| 210 | // } | 168 | // } |
| 211 | // $('.page-nav.active').removeClass('active'); | 169 | // $('.page-nav.active').removeClass('active'); |
| 212 | // $(this).addClass('active'); | 170 | // $(this).addClass('active'); |
| 213 | 171 | ||
| 214 | // var router = $(this).attr('data-router'), | 172 | // var router = $(this).attr('data-router'), |
| 215 | // $preview = $('#preview-iframe'), | 173 | // $preview = $('#preview-iframe'), |
| 216 | // url = '/app?_app_id='+$('#add-app-dialog').attr('data-id')+'&router='+router, | 174 | // url = '/app?_app_id='+$('#add-app-dialog').attr('data-id')+'&router='+router, |
| 217 | // customFeature = _appData[router].customFeature; | 175 | // customFeature = _appData[router].customFeature; |
| 218 | 176 | ||
| 219 | // if(customFeature.form){ | 177 | // if(customFeature.form){ |
| 220 | // url += '&detail=-1'; | 178 | // url += '&detail=-1'; |
| 221 | // } | 179 | // } |
| 222 | // $preview.attr('src',url); | 180 | // $preview.attr('src',url); |
| 223 | // }).on('click', '.style-color-wrap li', function(event) { | 181 | // }).on('click', '.style-color-wrap li', function(event) { |
| 224 | // $(this).addClass('selected').siblings('.selected').removeClass('selected'); | 182 | // $(this).addClass('selected').siblings('.selected').removeClass('selected'); |
| 225 | // setColor($(this).attr('data-color')); | 183 | // setColor($(this).attr('data-color')); |
| 226 | // }).on('click', '.zhichi-dialog .js-btn', function(event) { | 184 | // }).on('click', '.zhichi-dialog .js-btn', function(event) { |
| 227 | // var type = $(this).attr('data-type'); | 185 | // var type = $(this).attr('data-type'); |
| 228 | // switch (type){ | 186 | // switch (type){ |
| 229 | // case 'next': | 187 | // case 'next': |
| 230 | // // $('#preview-tpl-dialog').hide(); | 188 | // // $('#preview-tpl-dialog').hide(); |
| 231 | // $('#add-app-dialog').show(); | 189 | // $('#add-app-dialog').show(); |
| 232 | // break; | 190 | // break; |
| 233 | // case 'add': | 191 | // case 'add': |
| 234 | // addApp($(this)); | 192 | // addApp($(this)); |
| 235 | // break; | 193 | // break; |
| 236 | // case 'cancel': | 194 | // case 'cancel': |
| 237 | // $('#add-app-dialog').hide('slow'); | 195 | // $('#add-app-dialog').hide('slow'); |
| 238 | // break; | 196 | // break; |
| 239 | // } | 197 | // } |
| 240 | // }).on('click', '.change-img-wrap', function(event) { | 198 | // }).on('click', '.change-img-wrap', function(event) { |
| 241 | // // 初始化 打开我的图片 | 199 | // // 初始化 打开我的图片 |
| 242 | // showImgResourceBox($(this).find('img')); | 200 | // showImgResourceBox($(this).find('img')); |
| 243 | // }).on('click', '.style-palette li', function(event) { | 201 | // }).on('click', '.style-palette li', function(event) { |
| 244 | // if(confirm('您确定要更换应用的风格颜色吗？此操作会影响该应用所有的顶部导航/底部导航/按钮/分类/标题/分割线。')){ | 202 | // if(confirm('您确定要更换应用的风格颜色吗？此操作会影响该应用所有的顶部导航/底部导航/按钮/分类/标题/分割线。')){ |
| 245 | // color = $(this).attr('data-color'); | 203 | // color = $(this).attr('data-color'); |
| 246 | // me.savePage(); | 204 | // me.savePage(); |
| 247 | // me.setStyleColor(); | 205 | // me.setStyleColor(); |
| 248 | // me.parsePage($('#group-page-container .page-nav.active').attr('data-router')); | 206 | // me.parsePage($('#group-page-container .page-nav.active').attr('data-router')); |
| 249 | // me.sthChange(); | 207 | // me.sthChange(); |
| 250 | // }else{ | 208 | // }else{ |
| 251 | // return false; | 209 | // return false; |
| 252 | // } | 210 | // } |
| 253 | // }); | 211 | // }); |
| 254 | // | 212 | // |
| 255 | $(window).scroll(function(event) { | 213 | $(window).scroll(function(event) { |
| 256 | var $content = $('.tpl-content.active'), | 214 | var $content = $('.tpl-content.active'), |
| 257 | $container = $content.find('.tpl-container'); | 215 | $container = $content.find('.tpl-container'); |
| 258 | if ($container.hasClass('js-requesting') || $container.hasClass('js-no-more')) { | 216 | if ($container.hasClass('js-requesting') || $container.hasClass('js-no-more')) { |
| 259 | return; | 217 | return; |
| 260 | } | 218 | } |
| 261 | var scTop = $(this).scrollTop() + 50, | 219 | var scTop = $(this).scrollTop() + 50, |
| 262 | scheight = $(document).height() - $(this).height(); | 220 | scheight = $(document).height() - $(this).height(); |
| 263 | if(scTop >= scheight){ | 221 | if(scTop >= scheight){ |
| 264 | var index = $('#first-navs > .active').index(), | 222 | var index = $('#first-navs > .active').index(), |
| 265 | cate = $content.find('.tpl-sec-navs .active').attr('data-cate') || $('#first-navs > .active').attr('data-cate'); | 223 | cate = $content.find('.tpl-sec-navs .active').attr('data-cate') || $('#first-navs > .active').attr('data-cate'); |
| 266 | $container.addClass('js-requesting'); | 224 | $container.addClass('js-requesting'); |
| 267 | getTpls(cate, index); | 225 | getTpls(cate, index); |
| 268 | } | 226 | } |
| 269 | }); | 227 | }); |
| 270 | 228 | ||
| 271 | // $('#preview-tpl-dialog').zDialog({ | 229 | // $('#preview-tpl-dialog').zDialog({ |
| 272 | // width: 720, | 230 | // width: 720, |
| 273 | // height: 620, | 231 | // height: 620, |
| 274 | // title: 'APP模板预览' | 232 | // title: 'APP模板预览' |
| 275 | // }); | 233 | // }); |
| 276 | 234 | ||
| 277 | // $('#add-app-dialog').zDialog({ | 235 | // $('#add-app-dialog').zDialog({ |
| 278 | // width: 400, | 236 | // width: 400, |
| 279 | // height: 403, | 237 | // height: 403, |
| 280 | // title: '创建APP' | 238 | // title: '创建APP' |
| 281 | // }); | 239 | // }); |
| 282 | 240 | ||
| 283 | $('#select-color-control').spectrum({ | 241 | $('#select-color-control').spectrum({ |
| 284 | chooseText: '确定', | 242 | chooseText: '确定', |
| 285 | cancelText: '取消', | 243 | cancelText: '取消', |
| 286 | showInput: true, | 244 | showInput: true, |
| 287 | allowEmpty:false, | 245 | allowEmpty:false, |
| 288 | containerClassName: 'full-spectrum', | 246 | containerClassName: 'full-spectrum', |
| 289 | showInitial: true, | 247 | showInitial: true, |
| 290 | showPalette: false, | 248 | showPalette: false, |
| 291 | showSelectionPalette: false, | 249 | showSelectionPalette: false, |
| 292 | showAlpha: true, | 250 | showAlpha: true, |
| 293 | maxPaletteSize: 10, | 251 | maxPaletteSize: 10, |
| 294 | preferredFormat: 'hex', | 252 | preferredFormat: 'hex', |
| 295 | localStorageKey: 'spectrum.demo', | 253 | localStorageKey: 'spectrum.demo', |
| 296 | change: function(color){ | 254 | change: function(color){ |
| 297 | setColor(color); | 255 | setColor(color); |
| 298 | } | 256 | } |
| 299 | }); | 257 | }); |
| 300 | 258 | ||
| 301 | function setColor(color){ | 259 | function setColor(color){ |
| 302 | var _color = new String(color), | 260 | var _color = new String(color), |
| 303 | appId = $('#add-app-dialog').attr('data-id'); | 261 | appId = $('#add-app-dialog').attr('data-id'); |
| 304 | $('#add-app-dialog').attr('data-color', _color); | 262 | $('#add-app-dialog').attr('data-color', _color); |
| 305 | $('#preview-iframe').attr('src', '/app?_app_id='+appId+'&style_color='+encodeURIComponent(_color)); | 263 | $('#preview-iframe').attr('src', '/app?_app_id='+appId+'&style_color='+encodeURIComponent(_color)); |
| 306 | } | 264 | } |
| 307 | 265 | ||
| 308 | function initialPreview(appId){ | 266 | function initialPreview(appId){ |
| 309 | // 预览时 | 267 | // 预览时 |
| 310 | var $preview = $('#preview-iframe'); | 268 | var $preview = $('#preview-iframe'); |
| 311 | $preview.attr('src', '/app?_app_id='+appId); | 269 | $preview.attr('src', '/app?_app_id='+appId); |
| 312 | 270 | ||
| 313 | $ajax('/index.php?r=pc/AppData/detail','get',{app_id: appId},'json',function(data){ | 271 | $ajax('/index.php?r=pc/AppData/detail','get',{app_id: appId},'json',function(data){ |
| 314 | if (data.status === 0) { | 272 | if (data.status === 0) { |
| 315 | var info = data.data; | 273 | var info = data.data; |
| 316 | 274 | ||
| 317 | _cataData = typeof info.cata_data === 'string' ? JSON.parse(info.cata_data) : info.cata_data; | 275 | _cataData = typeof info.cata_data === 'string' ? JSON.parse(info.cata_data) : info.cata_data; |
| 318 | _appData = typeof info.app_data === 'string' ? JSON.parse(info.app_data) : info.app_data; | 276 | _appData = typeof info.app_data === 'string' ? JSON.parse(info.app_data) : info.app_data; |
| 319 | 277 | ||
| 320 | parseCata(); | 278 | parseCata(); |
| 321 | }else{ | 279 | }else{ |
| 322 | alertTip(data.data); | 280 | alertTip(data.data); |
| 323 | } | 281 | } |
| 324 | 282 | ||
| 325 | }); | 283 | }); |
| 326 | } | 284 | } |
| 327 | function parseCata(router){ | 285 | function parseCata(router){ |
| 328 | var cataStr = '', | 286 | var cataStr = '', |
| 329 | targetRouter = router || 'page00', | 287 | targetRouter = router || 'page00', |
| 330 | cataDataContent = _cataData.data; | 288 | cataDataContent = _cataData.data; |
| 331 | for(var cata in cataDataContent) { | 289 | for(var cata in cataDataContent) { |
| 332 | if(cataDataContent[cata]){ | 290 | if(cataDataContent[cata]){ |
| 333 | var pages = cataDataContent[cata].pages, | 291 | var pages = cataDataContent[cata].pages, |
| 334 | i = 0; | 292 | i = 0; |
| 335 | cataStr += '<li class="group-page-nav active" data-index="'+cataDataContent[cata].index+'"><p class="group-nav">'+cataDataContent[cata].group+'</p><ul class="page-navs">'; | 293 | cataStr += '<li class="group-page-nav active" data-index="'+cataDataContent[cata].index+'"><p class="group-nav">'+cataDataContent[cata].group+'</p><ul class="page-navs">'; |
| 336 | for(var item in pages){ | 294 | for(var item in pages){ |
| 337 | i++; | 295 | i++; |
| 338 | cataStr += parsePageNavStr(pages[item].router, pages[item].title, pages[item].name); | 296 | cataStr += parsePageNavStr(pages[item].router, pages[item].title, pages[item].name); |
| 339 | } | 297 | } |
| 340 | if(i<=0){ | 298 | if(i<=0){ |
| 341 | cataStr += '<p class="empty-group-tip">此分组暂无页面</p>'; | 299 | cataStr += '<p class="empty-group-tip">此分组暂无页面</p>'; |
| 342 | } | 300 | } |
| 343 | 301 | ||
| 344 | cataStr += '</ul></li>'; | 302 | cataStr += '</ul></li>'; |
| 345 | } | 303 | } |
| 346 | }; | 304 | }; |
| 347 | $('#group-page-container').empty().append(cataStr); | 305 | $('#group-page-container').empty().append(cataStr); |
| 348 | $('#group-page-container .page-nav[data-router="'+targetRouter+'"]').addClass('active'); | 306 | $('#group-page-container .page-nav[data-router="'+targetRouter+'"]').addClass('active'); |
| 349 | } | 307 | } |
| 350 | function parsePageNavStr (router, title, name){ | 308 | function parsePageNavStr (router, title, name){ |
| 351 | var str = '<li class="page-nav" data-router="'+router+'" data-title="'+title+'" data-name="'+name+'"><span class="js-page-name">'+name+'</span></li>'; | 309 | var str = '<li class="page-nav" data-router="'+router+'" data-title="'+title+'" data-name="'+name+'"><span class="js-page-name">'+name+'</span></li>'; |
| 352 | return str; | 310 | return str; |
| 353 | } | 311 | } |
| 354 | 312 | ||
| 355 | function addApp($btn , param){ | 313 | function addApp($btn , param){ |
| 356 | if($btn.hasClass('requesting')){ | 314 | if($btn.hasClass('requesting')){ |
| 357 | return; | 315 | return; |
| 358 | } | 316 | } |
| 359 | // var name = $('#app-name').val(), | 317 | // var name = $('#app-name').val(), |
| 360 | // description = $('#app-description').val(), | 318 | // description = $('#app-description').val(), |
| 361 | // logo = $('#app-logo').attr('src'), | 319 | // logo = $('#app-logo').attr('src'), |
| 362 | // cover = $('#app-cover').attr('src'); | 320 | // cover = $('#app-cover').attr('src'); |
| 363 | 321 | ||
| 364 | // if(name.length<=0){ | 322 | // if(name.length<=0){ |
| 365 | // alertTip('请输入应用名'); | 323 | // alertTip('请输入应用名'); |
| 366 | // $('#app-name').focus(); | 324 | // $('#app-name').focus(); |
| 367 | // return; | 325 | // return; |
| 368 | // } | 326 | // } |
| 369 | 327 | ||
| 370 | // if(description.length<=0){ | 328 | // if(description.length<=0){ |
| 371 | // alertTip('请输入应用描述'); | 329 | // alertTip('请输入应用描述'); |
| 372 | // $('#app-description').focus(); | 330 | // $('#app-description').focus(); |
| 373 | // return; | 331 | // return; |
| 374 | // } | 332 | // } |
| 375 | // if(logo===cdnUrl+'/static/invitation/images/logo.png'){ | 333 | // if(logo===cdnUrl+'/static/invitation/images/logo.png'){ |
| 376 | // alertTip('请上传logo'); | 334 | // alertTip('请上传logo'); |
| 377 | // return; | 335 | // return; |
| 378 | // } | 336 | // } |
| 379 | // if(cover===cdnUrl+'/static/webapp/images/share_feng.jpg'){ | 337 | // if(cover===cdnUrl+'/static/webapp/images/share_feng.jpg'){ |
| 380 | // alertTip('请上传封面'); | 338 | // alertTip('请上传封面'); |
| 381 | // return; | 339 | // return; |
| 382 | // } | 340 | // } |
| 383 | 341 | ||
| 384 | // var appId = $('#add-app-dialog').attr('data-id'), | 342 | // var appId = $('#add-app-dialog').attr('data-id'), |
| 385 | // color = $('#add-app-dialog').attr('data-color'), | 343 | // color = $('#add-app-dialog').attr('data-color'), |
| 386 | // param = { | 344 | // param = { |
| 387 | // app_name : name, | 345 | // app_name : name, |
| 388 | // description: description, | 346 | // description: description, |
| 389 | // logo : logo, | 347 | // logo : logo, |
| 390 | // cover: cover, | 348 | // cover: cover, |
| 391 | // style_color: color | 349 | // style_color: color |
| 392 | // }; | 350 | // }; |
| 393 | 351 | ||
| 394 | // if(appId!='-1'){ | 352 | // if(appId!='-1'){ |
| 395 | // // appId=='-1'的话 表示没有选择模版 | 353 | // // appId=='-1'的话 表示没有选择模版 |
| 396 | // param.f_app_id = appId; | 354 | // param.f_app_id = appId; |
| 397 | // } | 355 | // } |
| 398 | // if(color){ | 356 | // if(color){ |
| 399 | // // 预览模版，有选择风格颜色并确定使用该模版时，需要把app里相关的组件变化做处理，并把修改后的app_data发给后台保存 | 357 | // // 预览模版，有选择风格颜色并确定使用该模版时，需要把app里相关的组件变化做处理，并把修改后的app_data发给后台保存 |
| 400 | // setAppData(color); | 358 | // setAppData(color); |
| 401 | // param.app_data = JSON.stringify(_appData); | 359 | // param.app_data = JSON.stringify(_appData); |
| 402 | // } | 360 | // } |
| 403 | 361 | ||
| 404 | $btn.addClass('requesting'); | 362 | $btn.addClass('requesting'); |
| 405 | $ajax('/index.php?r=pc/AppData/add','post', param,'json',function(data){ | 363 | $ajax('/index.php?r=pc/AppData/add','post', param,'json',function(data){ |
| 406 | $btn.removeClass('requesting'); | 364 | $btn.removeClass('requesting'); |
| 407 | if (data.status === 0) { | 365 | if (data.status === 0) { |
| 408 | window.location.href = '/index.php?r=pc/Webapp/edit&id='+data.data; | 366 | window.location.href = '/index.php?r=pc/Webapp/edit&id='+data.data; |
| 409 | }else if (data.status === 2) { | 367 | }else if (data.status === 2) { |
| 410 | loginFunc(); | 368 | loginFunc(); |
| 411 | $('.lr-mask').show('slow'); | 369 | $('.lr-mask').show('slow'); |
| 412 | } else if (data.status === 3){ | 370 | } else if (data.status === 3){ |
| 413 | confirmTip({ | 371 | confirmTip({ |
| 414 | text : data.data, | 372 | text : data.data, |
| 415 | ConfirmText:'立即升级', | 373 | ConfirmText:'立即升级', |
| 416 | CancelText: '暂不升级', | 374 | CancelText: '暂不升级', |
| 417 | ConfirmFunction : function(){ | 375 | ConfirmFunction : function(){ |
| 418 | window.open('/index.php?r=pc/Index/appVipPacket'); | 376 | window.open('/index.php?r=pc/Index/appVipPacket'); |
| 419 | }, | 377 | }, |
| 420 | CancelFunction : function(){ | 378 | CancelFunction : function(){ |
| 421 | 379 | ||
| 422 | }, | 380 | }, |
| 423 | CloseFunction : function(){ | 381 | CloseFunction : function(){ |
| 424 | 382 | ||
| 425 | } | 383 | } |
| 426 | }) | 384 | }) |
| 427 | } else { | 385 | } else { |
| 428 | alertTip(data.data); | 386 | alertTip(data.data); |
| 429 | } | 387 | } |
| 430 | }, | 388 | }, |
| 431 | function(data){ | 389 | function(data){ |
| 432 | $btn.removeClass('requesting'); | 390 | $btn.removeClass('requesting'); |
| 433 | alertTip(data.data); | 391 | alertTip(data.data); |
| 434 | }); | 392 | }); |
| 435 | } | 393 | } |
| 436 | 394 | ||
| 437 | function setAppData(color){ | 395 | function setAppData(color){ |
| 438 | for(var router in _appData){ | 396 | for(var router in _appData){ |
| 439 | var eles = _appData[router].eles; | 397 | var eles = _appData[router].eles; |
| 440 | setAppEles(eles, color); | 398 | setAppEles(eles, color); |
| 441 | } | 399 | } |
| 442 | } | 400 | } |
| 443 | function setAppEles(eles, color){ | 401 | function setAppEles(eles, color){ |
| 444 | $(eles).each(function(index, ele) { | 402 | $(eles).each(function(index, ele) { |
| 445 | switch(ele.type){ | 403 | switch(ele.type){ |
| 446 | case 'top-nav': | 404 | case 'top-nav': |
| 447 | case 'bottom-nav': | 405 | case 'bottom-nav': |
| 448 | case 'button': | 406 | case 'button': |
| 449 | ele.style = ele.style || {}; | 407 | ele.style = ele.style || {}; |
| 450 | ele.style['background-color'] = color; | 408 | ele.style['background-color'] = color; |
| 451 | break; | 409 | break; |
| 452 | case 'classify': | 410 | case 'classify': |
| 453 | ele.customFeature = ele.customFeature || {}; | 411 | ele.customFeature = ele.customFeature || {}; |
| 454 | ele.customFeature['selectedColor'] = color; | 412 | ele.customFeature['selectedColor'] = color; |
| 455 | break; | 413 | break; |
| 456 | case 'breakline': | 414 | case 'breakline': |
| 457 | ele.style = ele.style || {}; | 415 | ele.style = ele.style || {}; |
| 458 | ele.style['border-color'] = color; | 416 | ele.style['border-color'] = color; |
| 459 | break; | 417 | break; |
| 460 | case 'title-ele': | 418 | case 'title-ele': |
| 461 | ele.customFeature = ele.customFeature || {}; | 419 | ele.customFeature = ele.customFeature || {}; |
| 462 | ele.customFeature['markColor'] = color; | 420 | ele.customFeature['markColor'] = color; |
| 463 | break; | 421 | break; |
| 464 | case 'static-vessel': | 422 | case 'static-vessel': |
| 465 | case 'free-vessel': | 423 | case 'free-vessel': |
| 466 | case 'list-vessel': | 424 | case 'list-vessel': |
| 467 | case 'dynamic-vessel': | 425 | case 'dynamic-vessel': |
| 468 | case 'form-vessel': | 426 | case 'form-vessel': |
| 469 | setAppEles(ele.content, color); | 427 | setAppEles(ele.content, color); |
| 470 | break; | 428 | break; |
| 471 | case 'layout-vessel': | 429 | case 'layout-vessel': |
| 472 | setAppEles(ele.content.leftEles, color); | 430 | setAppEles(ele.content.leftEles, color); |
| 473 | setAppEles(ele.content.rightEles, color); | 431 | setAppEles(ele.content.rightEles, color); |
| 474 | break; | 432 | break; |
| 475 | } | 433 | } |
| 476 | }); | 434 | }); |
| 477 | } | 435 | } |
| 478 | 436 | ||
| 479 | $("#add-label-span").on('click', function(event) { | 437 | $("#add-label-span").on('click', function(event) { |
| 480 | $("#add-label").show(); | 438 | $("#add-label").show(); |
| 481 | }); | 439 | }); |
| 482 | $("#add-label").on('click', '.labelClose', function(event) { | 440 | $("#add-label").on('click', '.labelClose', function(event) { |
| 483 | $("#add-label").hide(); | 441 | $("#add-label").hide(); |
| 484 | }); | 442 | }); |
| 485 | 443 | ||
| 486 | }); | 444 | }); |
templates/index.html
| 1 | 1 | ||
| 2 | <!DOCTYPE html> | 2 | <!DOCTYPE html> |
| 3 | <html lang="zh-CN"> | 3 | <html lang="zh-CN"> |
| 4 | <head> | 4 | <head> |
| 5 | <title>小程序开发联盟</title> | 5 | <title>小程序开发联盟</title> |
| 6 | <meta name="renderer" content="webkit"> | 6 | <meta name="renderer" content="webkit"> |
| 7 | <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" > | 7 | <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" > |
| 8 | <meta charset="UTF-8" name="description" content="小程序开发联盟"> | 8 | <meta charset="UTF-8" name="description" content="小程序开发联盟"> |
| 9 | <meta name="keywords" content="小程序开发联盟"> | 9 | <meta name="keywords" content="小程序开发联盟"> |
| 10 | <link rel="shortcut icon" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/common/images/favicon.ico" type="image/x-icon"> | 10 | <link rel="shortcut icon" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/common/images/favicon.ico" type="image/x-icon"> |
| 11 | <link rel="stylesheet" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/css/swiper.min.css?version=10213"> | 11 | <link rel="stylesheet" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/css/swiper.min.css?version=10213"> |
| 12 | <link rel="stylesheet" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/css/webuploader.css"> | 12 | <link rel="stylesheet" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/css/webuploader.css"> |
| 13 | <link rel="stylesheet" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc/invitation/spectrum/spectrum.css"> | 13 | <link rel="stylesheet" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc/invitation/spectrum/spectrum.css"> |
| 14 | <link rel="stylesheet" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/css/common.css?version=10213"> | 14 | <link rel="stylesheet" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/css/common.css?version=10213"> |
| 15 | <link rel="stylesheet" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/css/tpl.css?version=10213"> | 15 | <link rel="stylesheet" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/css/tpl.css?version=10213"> |
| 16 | <link rel="stylesheet" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/css/jquery.Jcrop.min.css"> | 16 | <link rel="stylesheet" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/css/jquery.Jcrop.min.css"> |
| 17 | <script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/js/library/jquery-2.1.4.min.js"></script> | 17 | <script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/js/library/jquery-2.1.4.min.js"></script> |
| 18 | <script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/js/swiper.min.js?version=10213"></script> | ||
| 18 | </head> | 19 | </head> |
| 19 | <body class="webapp" is_login="0"> | 20 | <body class="webapp" is_login="0"> |
| 20 | <!-- 导航 --> | 21 | <!-- 导航 --> |
| 21 | 22 | ||
| 22 | <link rel="stylesheet" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp_home/css/nav.css?version=10213"> | 23 | <link rel="stylesheet" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp_home/css/nav.css?version=10213"> |
| 23 | <script type="text/javascript" src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/js/cookie.js"></script> | 24 | <script type="text/javascript" src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/js/cookie.js"></script> |
| 24 | 25 | ||
| 25 | <div class="nav-wrap"> | 26 | <div class="nav-wrap"> |
| 26 | <div class="nav-logo"> | 27 | <div class="nav-logo"> |
| 27 | <a href="/index.php?r=pc/index/AppHome"> | 28 | <a href="/"> |
| 28 | <img src="http://1251027630.cdn.myqcloud.com/1251027630/ | 29 | <img src="http://1251027630.cdn.myqcloud.com/1251027630/ |
| 29 | zhichi_frontend/static/pc/index/img/nav_logo.png" alt=""> | 30 | zhichi_frontend/static/pc/index/img/nav_logo.png" alt=""> |
| 30 | 秀野堂</a> | 31 | 秀野堂</a> |
| 31 | </div> | 32 | </div> |
| 32 | <ul class="top-menu"> | 33 | <ul class="top-menu"> |
| 33 | <li class="menu-one"> | 34 | <li class="menu-one"> |
| 34 | <a target="_blank">微信小程序</a> | 35 | <a target="_blank">微信小程序</a> |
| 35 | </li> | 36 | </li> |
| 36 | <li class="menu-one"> | 37 | <li class="menu-one"> |
| 37 | <a target="_blank">Home</a> | 38 | <a target="_blank">Home</a> |
| 38 | </li> | 39 | </li> |
| 39 | <li class="menu-one"> | 40 | <li class="menu-one"> |
| 40 | <a>发现</a> | 41 | <a>发现</a> |
| 41 | </li> | 42 | </li> |
| 42 | <li class="menu-one"> | 43 | <li class="menu-one"> |
| 43 | <a href="/index.php?r=pc/Webapp/exclusive" target='_blank'>私塾</a> | 44 | <a href="/" target='_blank'>私塾</a> |
| 44 | </li> | 45 | </li> |
| 45 | <li class="menu-one"> | 46 | <li class="menu-one"> |
| 46 | <a href="/index.php?r=pc/Webapp/AppTpl">我要定制</a> | 47 | <a href="/">我要定制</a> |
| 47 | </li> | 48 | </li> |
| 48 | </ul> | 49 | </ul> |
| 49 | </div> | 50 | </div> |
| 50 | <!-- 导航 end --> | 51 | <!-- 导航 end --> |
| 51 | <!-- banner --> | 52 | <!-- banner --> |
| 52 | <div class="banner-wrap"> | 53 | <div class="banner" style="width:100%; position:relative;"> |
| 53 | <div class="swiper-container"> | 54 | <div class="swiper-container"> |
| 54 | <img src="/static/img/banner.png/" style="width:100%;"/> | 55 | <img src="/static/img/banner.png/" style="width:100%;"/> |
| 55 | </div> | 56 | </div> |
| 56 | </div> | 57 | </div> |
| 57 | <!-- banner end --> | 58 | <!-- banner end --> |
| 58 | <!-- 预览 --> | 59 | <!-- 预览 --> |
| 59 | <script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/js/webuploader.nolog.min.js"></script> | 60 | <script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/js/webuploader.nolog.min.js"></script> |
| 60 | <script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/js/jquery.Jcrop.min.js"></script> | 61 | <script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/js/jquery.Jcrop.min.js"></script> |
| 61 | <script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc/invitation/spectrum/spectrum.js"></script> | 62 | <script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc/invitation/spectrum/spectrum.js"></script> |
| 62 | <script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/js/common.js"></script> | 63 | <script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/js/common.js"></script> |
| 63 | <script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc/invitation/js/tip.js"></script> | 64 | <script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc/invitation/js/tip.js"></script> |
| 64 | <!--<script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/js/tpl.js"></script>--> | 65 | <!--<script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/js/tpl.js"></script>--> |
| 65 | <script src="/static/js/tpl.js"></script> | 66 | <script src="/static/js/tpl.js"></script> |
| 66 | <link rel="stylesheet" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/css/jquery.Jcrop.min.css"> | 67 | <link rel="stylesheet" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/css/jquery.Jcrop.min.css"> |
| 67 | <style rel="stylesheet"> | 68 | <style rel="stylesheet"> |
| 68 | .webapp-box { | 69 | .webapp-box { |
| 69 | position: fixed; | 70 | position: fixed; |
| 70 | -webkit-transform: translateX(-10000px); | 71 | -webkit-transform: translateX(-10000px); |
| 71 | -moz-transform: translateX(-10000px); | 72 | -moz-transform: translateX(-10000px); |
| 72 | transform: translateX(-10000px); | 73 | transform: translateX(-10000px); |
| 73 | z-index: 1001; | 74 | z-index: 1001; |
| 74 | left: 50%; | 75 | left: 50%; |
| 75 | top: 10%; | 76 | top: 10%; |
| 76 | width: 603px; | 77 | width: 603px; |
| 77 | min-height: 460px; | 78 | min-height: 460px; |
| 78 | margin-left: -300px; | 79 | margin-left: -300px; |
| 79 | padding-bottom: 15px; | 80 | padding-bottom: 15px; |
| 80 | border: 1px solid #DDD; | 81 | border: 1px solid #DDD; |
| 81 | border-radius: 10px; | 82 | border-radius: 10px; |
| 82 | box-shadow: 5px 5px 20px rgba(0,0,0,.4),-5px -5px 20px rgba(0,0,0,.4); | 83 | box-shadow: 5px 5px 20px rgba(0,0,0,.4),-5px -5px 20px rgba(0,0,0,.4); |
| 83 | background: #FFF; | 84 | background: #FFF; |
| 84 | } | 85 | } |
| 85 | .webapp-box input[type=file]:focus, .webapp-box input[type=checkbox]:focus, .webapp-box input[type=radio]:focus { | 86 | .webapp-box input[type=file]:focus, .webapp-box input[type=checkbox]:focus, .webapp-box input[type=radio]:focus { |
| 86 | outline: none; | 87 | outline: none; |
| 87 | } | 88 | } |
| 88 | 89 | ||
| 89 | 90 | ||
| 90 | .webapp-box-header { | 91 | .webapp-box-header { |
| 91 | /* position: absolute; | 92 | /* position: absolute; |
| 92 | top: 0; | 93 | top: 0; |
| 93 | left: 0; | 94 | left: 0; |
| 94 | z-index: 2;*/ | 95 | z-index: 2;*/ |
| 95 | width: 100%; | 96 | width: 100%; |
| 96 | height: 45px; | 97 | height: 45px; |
| 97 | background: #FFF; | 98 | background: #FFF; |
| 98 | border-bottom: 1px solid #e5e5e5; | 99 | border-bottom: 1px solid #e5e5e5; |
| 99 | border-radius: 10px 10px 0 0; | 100 | border-radius: 10px 10px 0 0; |
| 100 | } | 101 | } |
| 101 | .webapp-box-header-ul { | 102 | .webapp-box-header-ul { |
| 102 | margin: 12px 0 0 10px; | 103 | margin: 12px 0 0 10px; |
| 103 | padding: 0; | 104 | padding: 0; |
| 104 | font-size: 0; | 105 | font-size: 0; |
| 105 | text-align: center; | 106 | text-align: center; |
| 106 | } | 107 | } |
| 107 | .webapp-box-header-ul li { | 108 | .webapp-box-header-ul li { |
| 108 | display: inline-block; | 109 | display: inline-block; |
| 109 | padding: 5px 16px; | 110 | padding: 5px 16px; |
| 110 | cursor: pointer; | 111 | cursor: pointer; |
| 111 | font-size: 14px; | 112 | font-size: 14px; |
| 112 | border-top: 1px solid #ddd; | 113 | border-top: 1px solid #ddd; |
| 113 | border-bottom: 1px solid #ddd; | 114 | border-bottom: 1px solid #ddd; |
| 114 | } | 115 | } |
| 115 | .webapp-box-header-ul li:first-child { | 116 | .webapp-box-header-ul li:first-child { |
| 116 | border-top-left-radius: 5px; | 117 | border-top-left-radius: 5px; |
| 117 | border-bottom-left-radius: 5px; | 118 | border-bottom-left-radius: 5px; |
| 118 | border-left: 1px solid #ddd; | 119 | border-left: 1px solid #ddd; |
| 119 | } | 120 | } |
| 120 | .webapp-box-header-ul li:last-child { | 121 | .webapp-box-header-ul li:last-child { |
| 121 | border-top-right-radius: 5px; | 122 | border-top-right-radius: 5px; |
| 122 | border-bottom-right-radius: 5px; | 123 | border-bottom-right-radius: 5px; |
| 123 | border-right: 1px solid #ddd; | 124 | border-right: 1px solid #ddd; |
| 124 | } | 125 | } |
| 125 | .webapp-box-header-ul li.active { | 126 | .webapp-box-header-ul li.active { |
| 126 | background: #00a3e9; | 127 | background: #00a3e9; |
| 127 | color: #FFF; | 128 | color: #FFF; |
| 128 | } | 129 | } |
| 129 | .webapp-box-close { | 130 | .webapp-box-close { |
| 130 | position: absolute; | 131 | position: absolute; |
| 131 | top: 15px; | 132 | top: 15px; |
| 132 | right: 20px; | 133 | right: 20px; |
| 133 | cursor: pointer; | 134 | cursor: pointer; |
| 134 | font-size: 2.1rem; | 135 | font-size: 2.1rem; |
| 135 | font-weight: bold; | 136 | font-weight: bold; |
| 136 | line-height: 1; | 137 | line-height: 1; |
| 137 | color: #000; | 138 | color: #000; |
| 138 | text-shadow: 0 1px 0 #fff; | 139 | text-shadow: 0 1px 0 #fff; |
| 139 | opacity: .2; | 140 | opacity: .2; |
| 140 | } | 141 | } |
| 141 | .webapp-box-content { | 142 | .webapp-box-content { |
| 142 | /*position: relative;*/ | 143 | /*position: relative;*/ |
| 143 | /*box-sizing: border-box;*/ | 144 | /*box-sizing: border-box;*/ |
| 144 | /*padding: 55px 0 50px;*/ | 145 | /*padding: 55px 0 50px;*/ |
| 145 | width: 100%; | 146 | width: 100%; |
| 146 | /*height: 100%;*/ | 147 | /*height: 100%;*/ |
| 147 | background: #FFF; | 148 | background: #FFF; |
| 148 | border-radius: 15px; | 149 | border-radius: 15px; |
| 149 | } | 150 | } |
| 150 | .box-hide { | 151 | .box-hide { |
| 151 | display: none; | 152 | display: none; |
| 152 | } | 153 | } |
| 153 | .webapp-box-content .box-resource-content { | 154 | .webapp-box-content .box-resource-content { |
| 154 | display: none; | 155 | display: none; |
| 155 | } | 156 | } |
| 156 | .webapp-box-content .webapp-content-tab { | 157 | .webapp-box-content .webapp-content-tab { |
| 157 | padding-left: 10px; | 158 | padding-left: 10px; |
| 158 | margin: 0; | 159 | margin: 0; |
| 159 | max-height: 140px; | 160 | max-height: 140px; |
| 160 | overflow-y: auto; | 161 | overflow-y: auto; |
| 161 | } | 162 | } |
| 162 | .webapp-box-content .webapp-content-tab li { | 163 | .webapp-box-content .webapp-content-tab li { |
| 163 | display: inline-block; | 164 | display: inline-block; |
| 164 | padding: 5px 14px; | 165 | padding: 5px 14px; |
| 165 | margin: 5px 0; | 166 | margin: 5px 0; |
| 166 | cursor: pointer; | 167 | cursor: pointer; |
| 167 | } | 168 | } |
| 168 | .webapp-box-content .webapp-content-tab li.active { | 169 | .webapp-box-content .webapp-content-tab li.active { |
| 169 | border-radius: 6px; | 170 | border-radius: 6px; |
| 170 | background: #00a3e9; | 171 | background: #00a3e9; |
| 171 | color: #FFF; | 172 | color: #FFF; |
| 172 | } | 173 | } |
| 173 | .webapp-box-content .content-top-operation { | 174 | .webapp-box-content .content-top-operation { |
| 174 | /* position: absolute; | 175 | /* position: absolute; |
| 175 | bottom: 49px; | 176 | bottom: 49px; |
| 176 | left: 0; | 177 | left: 0; |
| 177 | right: 0;*/ | 178 | right: 0;*/ |
| 178 | background: #f7f7f7; | 179 | background: #f7f7f7; |
| 179 | padding: 8px; | 180 | padding: 8px; |
| 180 | } | 181 | } |
| 181 | .webapp-box-content .content-top-operation ul { | 182 | .webapp-box-content .content-top-operation ul { |
| 182 | margin: 0; | 183 | margin: 0; |
| 183 | padding: 0; | 184 | padding: 0; |
| 184 | } | 185 | } |
| 185 | .content-top-operation .box-operation-menu li { | 186 | .content-top-operation .box-operation-menu li { |
| 186 | margin-right: 5px; | 187 | margin-right: 5px; |
| 187 | } | 188 | } |
| 188 | #webapp-img-box .resource-list-wrap { | 189 | #webapp-img-box .resource-list-wrap { |
| 189 | /* position: absolute; | 190 | /* position: absolute; |
| 190 | top: 100px; | 191 | top: 100px; |
| 191 | bottom: 100px; | 192 | bottom: 100px; |
| 192 | left: 0; | 193 | left: 0; |
| 193 | right: 0;*/ | 194 | right: 0;*/ |
| 194 | display: none; | 195 | display: none; |
| 195 | height: 290px; | 196 | height: 290px; |
| 196 | /*width: 100%;*/ | 197 | /*width: 100%;*/ |
| 197 | padding-left: 15px; | 198 | padding-left: 15px; |
| 198 | padding-top: 8px; | 199 | padding-top: 8px; |
| 199 | overflow-x: hidden; | 200 | overflow-x: hidden; |
| 200 | overflow-y: auto; | 201 | overflow-y: auto; |
| 201 | } | 202 | } |
| 202 | #webapp-img-box .resource-list li { | 203 | #webapp-img-box .resource-list li { |
| 203 | display: inline-block; | 204 | display: inline-block; |
| 204 | margin: 0 15px 15px 0; | 205 | margin: 0 15px 15px 0; |
| 205 | position: relative; | 206 | position: relative; |
| 206 | border: 1px solid transparent; | 207 | border: 1px solid transparent; |
| 207 | } | 208 | } |
| 208 | #webapp-img-box .resource-list li:hover, | 209 | #webapp-img-box .resource-list li:hover, |
| 209 | #webapp-img-box .resource-list li.selected { | 210 | #webapp-img-box .resource-list li.selected { |
| 210 | border-color: #ccc; | 211 | border-color: #ccc; |
| 211 | } | 212 | } |
| 212 | #webapp-img-box .resource-list li:hover { | 213 | #webapp-img-box .resource-list li:hover { |
| 213 | background-color: #ddd; | 214 | background-color: #ddd; |
| 214 | } | 215 | } |
| 215 | #webapp-img-box .resource-list li.selected:after { | 216 | #webapp-img-box .resource-list li.selected:after { |
| 216 | position: absolute; | 217 | position: absolute; |
| 217 | right: -12px; | 218 | right: -12px; |
| 218 | top: -10px; | 219 | top: -10px; |
| 219 | display: block; | 220 | display: block; |
| 220 | width: 24px; | 221 | width: 24px; |
| 221 | height: 24px; | 222 | height: 24px; |
| 222 | content: '√'; | 223 | content: '√'; |
| 223 | color: #fff; | 224 | color: #fff; |
| 224 | font-family: "微软雅黑"; | 225 | font-family: "微软雅黑"; |
| 225 | line-height: 22px; | 226 | line-height: 22px; |
| 226 | text-align: center; | 227 | text-align: center; |
| 227 | border: 2px solid #fff; | 228 | border: 2px solid #fff; |
| 228 | background: #6abb03; | 229 | background: #6abb03; |
| 229 | border-radius: 50%; | 230 | border-radius: 50%; |
| 230 | } | 231 | } |
| 231 | /*.webapp-box-content .resource-list .img-title { | 232 | /*.webapp-box-content .resource-list .img-title { |
| 232 | width: 72px; | 233 | width: 72px; |
| 233 | height: 24px; | 234 | height: 24px; |
| 234 | line-height: 24px; | 235 | line-height: 24px; |
| 235 | margin: 0; | 236 | margin: 0; |
| 236 | font-size: 12px; | 237 | font-size: 12px; |
| 237 | white-space: nowrap; | 238 | white-space: nowrap; |
| 238 | overflow: hidden; | 239 | overflow: hidden; |
| 239 | text-overflow: ellipsis; | 240 | text-overflow: ellipsis; |
| 240 | }*/ | 241 | }*/ |
| 241 | #webapp-img-box .resource-list .img-operate { | 242 | #webapp-img-box .resource-list .img-operate { |
| 242 | display: none; | 243 | display: none; |
| 243 | position: absolute; | 244 | position: absolute; |
| 244 | left: 0; | 245 | left: 0; |
| 245 | right: 0; | 246 | right: 0; |
| 246 | bottom: 0; | 247 | bottom: 0; |
| 247 | z-index: 1; | 248 | z-index: 1; |
| 248 | } | 249 | } |
| 249 | #webapp-my-img .resource-list li:hover .img-operate, | 250 | #webapp-my-img .resource-list li:hover .img-operate, |
| 250 | body[data-admin="1"] #webapp-system-img li:hover .img-operate, | 251 | body[data-admin="1"] #webapp-system-img li:hover .img-operate, |
| 251 | body[admin="1"] #webapp-system-img li:hover .img-operate { | 252 | body[admin="1"] #webapp-system-img li:hover .img-operate { |
| 252 | display: block; | 253 | display: block; |
| 253 | } | 254 | } |
| 254 | #webapp-img-box .resource-list .img-operate a { | 255 | #webapp-img-box .resource-list .img-operate a { |
| 255 | display: table-cell; | 256 | display: table-cell; |
| 256 | width: 1%; | 257 | width: 1%; |
| 257 | padding: 2px; | 258 | padding: 2px; |
| 258 | text-align: center; | 259 | text-align: center; |
| 259 | color: #fff; | 260 | color: #fff; |
| 260 | font-size: 12px; | 261 | font-size: 12px; |
| 261 | text-decoration: none; | 262 | text-decoration: none; |
| 262 | background-color: rgba(0,0,0,.5); | 263 | background-color: rgba(0,0,0,.5); |
| 263 | } | 264 | } |
| 264 | #webapp-img-box .resource-list .img-operate a:hover { | 265 | #webapp-img-box .resource-list .img-operate a:hover { |
| 265 | background-color: rgba(0,0,0,.8); | 266 | background-color: rgba(0,0,0,.8); |
| 266 | } | 267 | } |
| 267 | #webapp-img-box .resource-list .progress-mask { | 268 | #webapp-img-box .resource-list .progress-mask { |
| 268 | position: absolute; | 269 | position: absolute; |
| 269 | top: 0; | 270 | top: 0; |
| 270 | left: 0; | 271 | left: 0; |
| 271 | right: 0; | 272 | right: 0; |
| 272 | bottom: 0; | 273 | bottom: 0; |
| 273 | background-color: rgba(0,0,0,.8); | 274 | background-color: rgba(0,0,0,.8); |
| 274 | z-index: 2; | 275 | z-index: 2; |
| 275 | padding-top: 30px; | 276 | padding-top: 30px; |
| 276 | color: #fff; | 277 | color: #fff; |
| 277 | text-align: center; | 278 | text-align: center; |
| 278 | font-size: 16px; | 279 | font-size: 16px; |
| 279 | } | 280 | } |
| 280 | #webapp-img-box .resource-list .upload-fail-tip { | 281 | #webapp-img-box .resource-list .upload-fail-tip { |
| 281 | display: none; | 282 | display: none; |
| 282 | } | 283 | } |
| 283 | .webuploader-container { | 284 | .webuploader-container { |
| 284 | position: relative; | 285 | position: relative; |
| 285 | } | 286 | } |
| 286 | .webapp-box-footer { | 287 | .webapp-box-footer { |
| 287 | position: absolute; | 288 | position: absolute; |
| 288 | bottom: 0; | 289 | bottom: 0; |
| 289 | left: 0; | 290 | left: 0; |
| 290 | right: 0; | 291 | right: 0; |
| 291 | height: 50px; | 292 | height: 50px; |
| 292 | line-height: 40px; | 293 | line-height: 40px; |
| 293 | padding-right: 30px; | 294 | padding-right: 30px; |
| 294 | border-radius: 0 0 10px 10px; | 295 | border-radius: 0 0 10px 10px; |
| 295 | background: #FFF; | 296 | background: #FFF; |
| 296 | border-top: 1px solid #e5e5e5; | 297 | border-top: 1px solid #e5e5e5; |
| 297 | z-index: 2; | 298 | z-index: 2; |
| 298 | font-size: 12px; | 299 | font-size: 12px; |
| 299 | } | 300 | } |
| 300 | #img-crop-box .webapp-box-footer { | 301 | #img-crop-box .webapp-box-footer { |
| 301 | text-align: right; | 302 | text-align: right; |
| 302 | } | 303 | } |
| 303 | .webapp-box .webuploader-pick { | 304 | .webapp-box .webuploader-pick { |
| 304 | font-size: inherit !important; | 305 | font-size: inherit !important; |
| 305 | background-color: transparent; | 306 | background-color: transparent; |
| 306 | overflow: initial; | 307 | overflow: initial; |
| 307 | } | 308 | } |
| 308 | .webapp-box .resource-select-num { | 309 | .webapp-box .resource-select-num { |
| 309 | color: #0034FF; | 310 | color: #0034FF; |
| 310 | } | 311 | } |
| 311 | .webapp-box .form-control { | 312 | .webapp-box .form-control { |
| 312 | display: inline-block; | 313 | display: inline-block; |
| 313 | width: 120px; | 314 | width: 120px; |
| 314 | } | 315 | } |
| 315 | .webapp-box .progress-bar { | 316 | .webapp-box .progress-bar { |
| 316 | position: absolute; | 317 | position: absolute; |
| 317 | left: 365px; | 318 | left: 365px; |
| 318 | top: 20px; | 319 | top: 20px; |
| 319 | } | 320 | } |
| 320 | .webapp-box .thumbnail { | 321 | .webapp-box .thumbnail { |
| 321 | display: inline-block; | 322 | display: inline-block; |
| 322 | width: 80px; | 323 | width: 80px; |
| 323 | height: 80px; | 324 | height: 80px; |
| 324 | margin: 0; | 325 | margin: 0; |
| 325 | text-align: center; | 326 | text-align: center; |
| 326 | font-size: 0; | 327 | font-size: 0; |
| 327 | border: none; | 328 | border: none; |
| 328 | } | 329 | } |
| 329 | .webapp-box .thumbnail:before, .webapp-box .thumbnail:after { | 330 | .webapp-box .thumbnail:before, .webapp-box .thumbnail:after { |
| 330 | content: ""; | 331 | content: ""; |
| 331 | display: inline-block; | 332 | display: inline-block; |
| 332 | width: 0; | 333 | width: 0; |
| 333 | height: 100%; | 334 | height: 100%; |
| 334 | vertical-align: middle; | 335 | vertical-align: middle; |
| 335 | } | 336 | } |
| 336 | .webapp-box .thumbnail img { | 337 | .webapp-box .thumbnail img { |
| 337 | display: inline-block; | 338 | display: inline-block; |
| 338 | max-width: 100%; | 339 | max-width: 100%; |
| 339 | max-height: 100%; | 340 | max-height: 100%; |
| 340 | vertical-align: middle; | 341 | vertical-align: middle; |
| 341 | } | 342 | } |
| 342 | #img-crop-box { | 343 | #img-crop-box { |
| 343 | width: 700px; | 344 | width: 700px; |
| 344 | height: 500px; | 345 | height: 500px; |
| 345 | margin-left: -350px; | 346 | margin-left: -350px; |
| 346 | } | 347 | } |
| 347 | .img-crop-scope { | 348 | .img-crop-scope { |
| 348 | width: 508px; | 349 | width: 508px; |
| 349 | height: 320px; | 350 | height: 320px; |
| 350 | margin-top: 20px; | 351 | margin-top: 20px; |
| 351 | text-align: center; | 352 | text-align: center; |
| 352 | font-size: 0; | 353 | font-size: 0; |
| 353 | border: 1px solid #bbb; | 354 | border: 1px solid #bbb; |
| 354 | background-color: #ccc; | 355 | background-color: #ccc; |
| 355 | overflow: hidden; | 356 | overflow: hidden; |
| 356 | } | 357 | } |
| 357 | .img-crop-top-input { | 358 | .img-crop-top-input { |
| 358 | padding: 7px 10px; | 359 | padding: 7px 10px; |
| 359 | background-color: #eee; | 360 | background-color: #eee; |
| 360 | } | 361 | } |
| 361 | .jcrop-holder > input[type="radio"] { | 362 | .jcrop-holder > input[type="radio"] { |
| 362 | left: -2000px !important; | 363 | left: -2000px !important; |
| 363 | } | 364 | } |
| 364 | .webapp-sub-cate { | 365 | .webapp-sub-cate { |
| 365 | display: none; | 366 | display: none; |
| 366 | padding: 8px 15px; | 367 | padding: 8px 15px; |
| 367 | } | 368 | } |
| 368 | .webapp-sub-cate > span { | 369 | .webapp-sub-cate > span { |
| 369 | cursor: pointer; | 370 | cursor: pointer; |
| 370 | margin-right: 8px; | 371 | margin-right: 8px; |
| 371 | padding-right: 8px; | 372 | padding-right: 8px; |
| 372 | border-right: 1px solid; | 373 | border-right: 1px solid; |
| 373 | color: #6c6c6c; | 374 | color: #6c6c6c; |
| 374 | } | 375 | } |
| 375 | .webapp-sub-cate > span.active { | 376 | .webapp-sub-cate > span.active { |
| 376 | color: #00a3e9; | 377 | color: #00a3e9; |
| 377 | } | 378 | } |
| 378 | .img-box-ui-radio { | 379 | .img-box-ui-radio { |
| 379 | display: inline-block; | 380 | display: inline-block; |
| 380 | width: 22px; | 381 | width: 22px; |
| 381 | height: 22px; | 382 | height: 22px; |
| 382 | position: relative; | 383 | position: relative; |
| 383 | overflow: visible; | 384 | overflow: visible; |
| 384 | border: 0; | 385 | border: 0; |
| 385 | background: 0 0; | 386 | background: 0 0; |
| 386 | -webkit-appearance: none; | 387 | -webkit-appearance: none; |
| 387 | outline: 0; | 388 | outline: 0; |
| 388 | vertical-align: middle; | 389 | vertical-align: middle; |
| 389 | } | 390 | } |
| 390 | .img-box-ui-radio:before { | 391 | .img-box-ui-radio:before { |
| 391 | content: ''; | 392 | content: ''; |
| 392 | display: block; | 393 | display: block; |
| 393 | width: 16px; | 394 | width: 16px; |
| 394 | height: 16px; | 395 | height: 16px; |
| 395 | border: 2px solid #dfe0e1; | 396 | border: 2px solid #dfe0e1; |
| 396 | border-radius: 16px; | 397 | border-radius: 16px; |
| 397 | background-clip: padding-box; | 398 | background-clip: padding-box; |
| 398 | position: absolute; | 399 | position: absolute; |
| 399 | left: 0; | 400 | left: 0; |
| 400 | top: 0; | 401 | top: 0; |
| 401 | } | 402 | } |
| 402 | .img-box-ui-radio:checked:before { | 403 | .img-box-ui-radio:checked:before { |
| 403 | border: 2px solid #18b4ed; | 404 | border: 2px solid #18b4ed; |
| 404 | } | 405 | } |
| 405 | .img-box-ui-radio:after { | 406 | .img-box-ui-radio:after { |
| 406 | content: ''; | 407 | content: ''; |
| 407 | display: block; | 408 | display: block; |
| 408 | width: 8px; | 409 | width: 8px; |
| 409 | height: 8px; | 410 | height: 8px; |
| 410 | background: #dfe0e1; | 411 | background: #dfe0e1; |
| 411 | border-radius: 8px; | 412 | border-radius: 8px; |
| 412 | position: absolute; | 413 | position: absolute; |
| 413 | left: 6px; | 414 | left: 6px; |
| 414 | top: 6px; | 415 | top: 6px; |
| 415 | } | 416 | } |
| 416 | .img-box-ui-radio:checked:after { | 417 | .img-box-ui-radio:checked:after { |
| 417 | background: #18b4ed; | 418 | background: #18b4ed; |
| 418 | } | 419 | } |
| 419 | .img-crop-body-left { | 420 | .img-crop-body-left { |
| 420 | float: left; | 421 | float: left; |
| 421 | padding: 10px; | 422 | padding: 10px; |
| 422 | margin: 0 20px; | 423 | margin: 0 20px; |
| 423 | border: 1px solid #eee; | 424 | border: 1px solid #eee; |
| 424 | } | 425 | } |
| 425 | .img-crop-body-left label { | 426 | .img-crop-body-left label { |
| 426 | display: block; | 427 | display: block; |
| 427 | padding: 0 8px; | 428 | padding: 0 8px; |
| 428 | margin: 16px 0; | 429 | margin: 16px 0; |
| 429 | text-align: right; | 430 | text-align: right; |
| 430 | } | 431 | } |
| 431 | .img-crop-body-left .img-box-ui-radio { | 432 | .img-crop-body-left .img-box-ui-radio { |
| 432 | margin-left: 10px; | 433 | margin-left: 10px; |
| 433 | } | 434 | } |
| 434 | .webapp-box .btn { | 435 | .webapp-box .btn { |
| 435 | display: inline-block; | 436 | display: inline-block; |
| 436 | padding: 6px 12px; | 437 | padding: 6px 12px; |
| 437 | width: auto; | 438 | width: auto; |
| 438 | font-size: 14px; | 439 | font-size: 14px; |
| 439 | line-height: 18px; | 440 | line-height: 18px; |
| 440 | border: 1px solid #ccc; | 441 | border: 1px solid #ccc; |
| 441 | border-radius: 3px; | 442 | border-radius: 3px; |
| 442 | color: #666; | 443 | color: #666; |
| 443 | background-color: #fff; | 444 | background-color: #fff; |
| 444 | cursor: pointer; | 445 | cursor: pointer; |
| 445 | vertical-align: middle; | 446 | vertical-align: middle; |
| 446 | } | 447 | } |
| 447 | .webapp-box .btn.green { | 448 | .webapp-box .btn.green { |
| 448 | color: #fff; | 449 | color: #fff; |
| 449 | background-color: #03d8a2; | 450 | background-color: #03d8a2; |
| 450 | border-color: #05C897; | 451 | border-color: #05C897; |
| 451 | } | 452 | } |
| 452 | .webapp-box .btn.orange { | 453 | .webapp-box .btn.orange { |
| 453 | color: #fff; | 454 | color: #fff; |
| 454 | background-color: #ff9f22; | 455 | background-color: #ff9f22; |
| 455 | border-color: #ee9016; | 456 | border-color: #ee9016; |
| 456 | } | 457 | } |
| 457 | .webapp-box .btn.blue { | 458 | .webapp-box .btn.blue { |
| 458 | color: #fff; | 459 | color: #fff; |
| 459 | background-color: #1dc6f1; | 460 | background-color: #1dc6f1; |
| 460 | border-color: #15bbe5; | 461 | border-color: #15bbe5; |
| 461 | } | 462 | } |
| 462 | .webapp-box input[type="text"] { | 463 | .webapp-box input[type="text"] { |
| 463 | border: 1px solid #ccc; | 464 | border: 1px solid #ccc; |
| 464 | border-radius: 4px; | 465 | border-radius: 4px; |
| 465 | font-size: 14px; | 466 | font-size: 14px; |
| 466 | line-height: 14px; | 467 | line-height: 14px; |
| 467 | padding: 6px; | 468 | padding: 6px; |
| 468 | box-shadow: inset 0 1px 3px rgba(0,0,0,.2); | 469 | box-shadow: inset 0 1px 3px rgba(0,0,0,.2); |
| 469 | outline: 0; | 470 | outline: 0; |
| 470 | -webkit-user-select: text; | 471 | -webkit-user-select: text; |
| 471 | } | 472 | } |
| 472 | .webapp-box select { | 473 | .webapp-box select { |
| 473 | border: 1px solid #ccc; | 474 | border: 1px solid #ccc; |
| 474 | border-radius: 4px; | 475 | border-radius: 4px; |
| 475 | line-height: 14px; | 476 | line-height: 14px; |
| 476 | padding: 6px 4px 6px 6px; | 477 | padding: 6px 4px 6px 6px; |
| 477 | box-shadow: inset 0 2px 8px rgba(0,0,0,.2); | 478 | box-shadow: inset 0 2px 8px rgba(0,0,0,.2); |
| 478 | outline: 0; | 479 | outline: 0; |
| 479 | width: 160px; | 480 | width: 160px; |
| 480 | margin: 0; | 481 | margin: 0; |
| 481 | } | 482 | } |
| 482 | input[type="file"]{ | 483 | input[type="file"]{ |
| 483 | opacity: 0; | 484 | opacity: 0; |
| 484 | } | 485 | } |
| 485 | </style> | 486 | </style> |
| 486 | <div class="tpl-content active"> | 487 | <div class="tpl-content active"> |
| 487 | <div class="tpl-sec-navs"></div> | 488 | <div class="tpl-sec-navs"></div> |
| 488 | <ul class="tpl-container js-no-more"> | 489 | <ul class="tpl-container js-no-more"> |
| 489 | <li class="empty-tpl" data-id="-1"> | 490 | <li data-id="pz5ouz71UG" data-desc="undefined" data-logo="undefined" class="js-tpl"> |
| 490 | <div class="note-icon"></div><p class="name">空白模板</p> | 491 | <img class="cover" src="http://img.weiye.me/zcimgdir/album/ file_5816e850e6ff8.jpg" onerror="errorWeiyeCover(this)"> |
| 492 | <p class="name">影视小程序（微信标准）</p> | ||
| 493 | <div class="code-mask"> | ||
| 494 | <img class="code" src="http://img.weiye.me/tmp_file/ 4c35ae9d7bbc06ec8d3384f90d001ee6.png" alt=""> | ||
| 495 | <span class="select-btn js-preview-btn">预览</span> | ||
| 496 | <span class="select-btn choose-btn">选择</span> | ||
| 497 | </div> | ||
| 491 | </li> | 498 | </li> |
| 492 | <li data-id="pz5ouz71UG" data-desc="undefined" data-logo="undefined" | 499 | <li data-id="4waa4fTr5A" data-desc="undefined" data-logo="undefined" class="js-tpl"> |
| 493 | class="js-tpl"> | 500 | <img class="cover" src="http://img.weiye.me/zcimgdir/album/ file_58107dfe7f576.jpg" onerror="errorWeiyeCover(this)"> |
| 494 | <img class="cover" src="http://img.weiye.me/zcimgdir/album/ | 501 | <p class="name">书城小程序（微信标准）</p> |
| 495 | file_5816e850e6ff8.jpg" onerror="errorWeiyeCover(this)"> | 502 | <div class="code-mask"> |
| 496 | <p class="name">影视小程序（微信标准）</p> | 503 | <img class="code" src="http://img.weiye.me/tmp_file/ 8ac1cb0f43e1b1431af5c8a92d5440cd.png" alt=""> |
| 497 | <div class="code-mask"> | 504 | <span class="select-btn js-preview-btn">预览</span> |
| 498 | <img class="code" src="http://img.weiye.me/tmp_file/ | 505 | <span class="select-btn choose-btn">选择</span> |
| 499 | 4c35ae9d7bbc06ec8d3384f90d001ee6.png" alt=""> | 506 | </div> |
| 500 | <span class="select-btn js-preview-btn">预览</span> | ||
| 501 | <span class="select-btn choose-btn">选择</span> | ||
| 502 | </div> | ||
| 503 | </li> | 507 | </li> |
| 504 | <li data-id="4waa4fTr5A" data-desc="undefined" data-logo="undefined" | 508 | <li data-id="PxUXde4z7S" data-desc="undefined" data-logo="undefined" class="js-tpl"> |
| 505 | class="js-tpl"> | 509 | <img class="cover" src="http://img.weiye.me/zcimgdir/thumb/ t_147635308757ff5c3fb6a6a.jpg" onerror="errorWeiyeCover(this)"> |
| 506 | <img class="cover" src="http://img.weiye.me/zcimgdir/album/ | 510 | <p class="name">变美APP</p> |
| 507 | file_58107dfe7f576.jpg" onerror="errorWeiyeCover(this)"> | 511 | <div class="code-mask"> |
| 508 | <p class="name">书城小程序（微信标准）</p> | 512 | <img class="code" src="http://img.weiye.me/tmp_file/ 7bba01abf99bf1252c9bcdb7709b626d.png" alt=""> |
| 509 | <div class="code-mask"> | 513 | <span class="select-btn js-preview-btn">预览</span> |
| 510 | <img class="code" src="http://img.weiye.me/tmp_file/ | 514 | <span class="select-btn choose-btn">选择</span> |
| 511 | 8ac1cb0f43e1b1431af5c8a92d5440cd.png" alt=""> | 515 | </div> |
| 512 | <span class="select-btn js-preview-btn">预览</span> | ||
| 513 | <span class="select-btn choose-btn">选择</span> | ||
| 514 | </div> | ||
| 515 | </li> | 516 | </li> |
| 516 | <li data-id="PxUXde4z7S" data-desc="undefined" data-logo="undefined" | 517 | <li data-id="4M29h38u8h" data-desc="undefined" data-logo="undefined" class="js-tpl"> |
| 517 | class="js-tpl"> | 518 | <img class="cover" src="http://img.weiye.me/zcimgdir/thumb/ t_147617437457fca2265bdc8.png" onerror="errorWeiyeCover(this)"> |
| 518 | <img class="cover" src="http://img.weiye.me/zcimgdir/thumb/ | 519 | <p class="name">网红APP</p> |
| 519 | t_147635308757ff5c3fb6a6a.jpg" onerror="errorWeiyeCover(this)"> | 520 | <div class="code-mask"> |
| 520 | <p class="name">变美APP</p> | 521 | <img class="code" src="http://img.weiye.me/tmp_file/ b6035ca76e59b6728a48bcd10d7b8bcd.png" alt=""> |
| 521 | <div class="code-mask"> | 522 | <span class="select-btn js-preview-btn">预览</span> |
| 522 | <img class="code" src="http://img.weiye.me/tmp_file/ | 523 | <span class="select-btn choose-btn">选择</span> |
| 523 | 7bba01abf99bf1252c9bcdb7709b626d.png" alt=""> | 524 | </div> |
| 524 | <span class="select-btn js-preview-btn">预览</span> | ||
| 525 | <span class="select-btn choose-btn">选择</span> | ||
| 526 | </div> | ||
| 527 | </li> | 525 | </li> |
| 528 | <li data-id="4M29h38u8h" data-desc="undefined" data-logo="undefined" | 526 | <li data-id="9K7PCc4cmG" data-desc="undefined" data-logo="undefined" class="js-tpl"> |
| 529 | class="js-tpl"> | 527 | <img class="cover" src="http://img.weiye.me/zcimgdir/album/ file_57fddb054a6cf.png" onerror="errorWeiyeCover(this)"> |
| 530 | <img class="cover" src="http://img.weiye.me/zcimgdir/thumb/ | 528 | <p class="name">双十一抢购</p> |
| 531 | t_147617437457fca2265bdc8.png" onerror="errorWeiyeCover(this)"> | 529 | <div class="code-mask"> |
| 532 | <p class="name">网红APP</p> | 530 | <img class="code" src="http://img.weiye.me/tmp_file/ 7d8abc28f1d64983f9162ec206c105b8.png" alt=""> |
| 533 | <div class="code-mask"> | 531 | <span class="select-btn js-preview-btn">预览</span> |
| 534 | <img class="code" src="http://img.weiye.me/tmp_file/ | 532 | <span class="select-btn choose-btn">选择</span></div> |
| 535 | b6035ca76e59b6728a48bcd10d7b8bcd.png" alt=""> | ||
| 536 | <span class="select-btn js-preview-btn">预览</span> | ||
| 537 | <span class="select-btn choose-btn">选择</span> | ||
| 538 | </div> | ||
| 539 | </li> | 533 | </li> |
| 540 | <li data-id="9K7PCc4cmG" data-desc="undefined" | 534 | <li data-id="ZSU6l4y4P6" data-desc="undefined" data-logo="undefined" class="js-tpl"> |
| 541 | data-logo="undefined" class="js-tpl"> | 535 | <img class="cover" src="http://img.weiye.me/zcimgdir/album/ file_57fa1d7c68129.jpg" onerror="errorWeiyeCover(this)"> |
| 542 | <img class="cover" src="http://img.weiye.me/zcimgdir/album/ | 536 | <p class="name">双十一模板</p> |
| 543 | file_57fddb054a6cf.png" onerror="errorWeiyeCover(this)"> | 537 | <div class="code-mask"> |
| 544 | <p class="name">双十一抢购</p> | 538 | <img class="code" src="http://img.weiye.me/tmp_file/ 21b9bec8d88a32d9e9731e3a1498e580.png" alt=""> |
| 545 | <div class="code-mask"> | 539 | <span class="select-btn js-preview-btn">预览</span> |
| 546 | <img class="code" src="http://img.weiye.me/tmp_file/ | 540 | <span class="select-btn choose-btn">选择</span> |
| 547 | 7d8abc28f1d64983f9162ec206c105b8.png" alt=""> | 541 | </div> |
| 548 | <span class="select-btn js-preview-btn">预览</span> | ||
| 549 | <span class="select-btn choose-btn">选择</span></div> | ||
| 550 | </li> | 542 | </li> |
| 551 | <li data-id="ZSU6l4y4P6" data-desc="undefined" data-logo="undefined" | 543 | <li data-id="gGmd7NT1Re" data-desc="undefined" data-logo="undefined" class="js-tpl"> |
| 552 | class="js-tpl"> | 544 | <img class="cover" src="http://img.weiye.me/zcimgdir/album/ file_57bbc4011a30b.jpg" onerror="errorWeiyeCover(this)"> |
| 553 | <img class="cover" src="http://img.weiye.me/zcimgdir/album/ | 545 | <p class="name">婚庆</p> |
| 554 | file_57fa1d7c68129.jpg" onerror="errorWeiyeCover(this)"> | 546 | <div class="code-mask"> |
| 555 | <p class="name">双十一模板</p> | 547 | <img class="code" src="http://img.weiye.me/tmp_file/ 6bbfc44e652f7a26c8ce6cc592aad973.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="NBcwCELLqZ" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_574692ffb216c.png" onerror="errorWeiyeCover(this)"><p class="name">彼时此刻（公众号）</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/829375b57b659f1d41a7e1ede3d6c547.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="SHq4Dzxth8" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_5707497a71a30.jpg" onerror="errorWeiyeCover(this)"><p class="name">商品售卖（可支付）</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/372dd5a13d48d91ae24fd55f83164c17.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="V1as6EDAPg" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_57e4d3e3cccc2.jpg" onerror="errorWeiyeCover(this)"><p class="name">贝婴用品</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/3f13b8bfb89aaf3b18e9ee7e880889c9.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="qd3n59KLKk" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_57e3cfdcc6b83.jpg" onerror="errorWeiyeCover(this)"><p class="name">装修购买建材</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/a008da8ed64c0269d3f0bd36ee147026.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="5rmOw00GDg" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_57c40aaf7a3b1.jpg" onerror="errorWeiyeCover(this)"><p class="name">房产APP2后台上传版</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/71b6bbcf7c48989745dd072b3b72b93c.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="DbSTHt1uzp" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_57de7ade03c04.jpg" onerror="errorWeiyeCover(this)"><p class="name">婚纱摄影</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/ff8d9adaeeba5ff03e71441cabef003c.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="Ra8JoRi25h" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_57d9289da7412.jpg" onerror="errorWeiyeCover(this)"><p class="name">上门维修、上门服务</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/6adc2c6559176d0ad6761ef33ce034fb.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="atiiP6ckof" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_57d11a505bef3.png" onerror="errorWeiyeCover(this)"><p class="name">中秋大促销模版</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/ddc0091f9bbb537490e7fe8387d874d4.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="Z2zwu40dL2" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/thumb/t_147098957157ad85038a43b.png" onerror="errorWeiyeCover(this)"><p class="name">房产APP后台上传版</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/d6c40c21a79cd7983962bf4f2f58a1a9.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="SDkeSYaKxZ" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_579afe19ad4d6.jpg" onerror="errorWeiyeCover(this)"><p class="name">微买房</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/8866adc5a24f58a6a57c6d96ee8737be.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="zl31CBBC1b" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_576df5d02fc70.jpg" onerror="errorWeiyeCover(this)"><p class="name">旅游</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/3a6dca9b50f64d5033f020b30f521bdd.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="u3SgxxQQ31" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_5757f48552daa.jpg" onerror="errorWeiyeCover(this)"><p class="name">宏业地产—房源展示</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/6bd2ce56e70c5788f2a2aa0d2be1d25e.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="X3X837IQ3L" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/thumb/t_146967291757996dd59aaa7.jpg" onerror="errorWeiyeCover(this)"><p class="name">照片冲印</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/9d163d9356aa31f15d310d598932ee7d.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="taNz15kI0x" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_57bd60ab6d95b.jpg" onerror="errorWeiyeCover(this)"><p class="name">婚纱摄影模版</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/255bcaba4c059f86ccb5090f9b09c246.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="tV73K7YXzH" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_57bc0a0b20930.jpg" onerror="errorWeiyeCover(this)"><p class="name">婚宴酒店模版</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/20623cb7d92eccc217f0d5ca99cae418.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="AI6AI6K6aI" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_574eb89ec60e7.jpg" onerror="errorWeiyeCover(this)"><p class="name">女裤电商模板</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/d0bb3d67de9323333395ad463ce4b908.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="9FTOOn0XBb" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_57465f697db85.jpg" onerror="errorWeiyeCover(this)"><p class="name">婚庆模版</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/8b415391c3b317dddc8a5773147d24dc.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="9yfZSctt2c" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/thumb/t_146710285657723688df422.jpg" onerror="errorWeiyeCover(this)"><p class="name">餐厅点餐，外卖订单</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/d39439029190321f02c54c0b6ae38d58.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="1ddD7927cL" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_575facd31cb6d.png" onerror="errorWeiyeCover(this)"><p class="name">吃货小店</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/47fdab31bdf302b6b9343e9369fbfe9c.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="Uu89y8BrP9" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/thumb/t_1464856742574ff0a6a0f7e.png" onerror="errorWeiyeCover(this)"><p class="name">粽子店app</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/fd4ebb00dba99c5c4af0ee769348e253.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="ve3mFoFJjm" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_5722c26875498.gif" onerror="errorWeiyeCover(this)"><p class="name">库腾科勒润滑油</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/7a44496312b89ebde9b6c1305addadf4.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="QQKFfW0FQ0" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_5774da40bdb19.jpg" onerror="errorWeiyeCover(this)"><p class="name">我的水果屋，电商模版</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/0d9e98b81ae81a93f66ac47b9b66b95a.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="lvxxVeXs4X" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_57a845f48a40c.png" onerror="errorWeiyeCover(this)"><p class="name">房来了</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/0c29411a69decd921822f65c4162c98a.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="0yX4Jy8JJj" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_5756a4024a406.png" onerror="errorWeiyeCover(this)"><p class="name">宠物家app</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/36908ac27f27931933e340ef2766d6ec.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="A4zppxz2xJ" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/thumb/t_1464661011574cf4136dd71.jpg" onerror="errorWeiyeCover(this)"><p class="name">家居用品模板 （可支付）</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/62c7949b9eeda4817208073ee196b018.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="BebI3aa60k" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_576cdf6bde660.png" onerror="errorWeiyeCover(this)"><p class="name">一双鞋子的故事</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/07610b59c9ac57a1e65d01b111e0db8b.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="yr1rX7Go0r" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_574fec7048792.png" onerror="errorWeiyeCover(this)"><p class="name">儿童</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/2d1bd42759a6f387ad8aab1548b447b7.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="PCZpCOoHzE" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_574ea71cb758a.jpg" onerror="errorWeiyeCover(this)"><p class="name">五谷养生店app</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/836dc3b0fb2a730eaedbe1e74fd1428d.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="hTj7j3voHE" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_576baa726e6bd.jpg" onerror="errorWeiyeCover(this)"><p class="name">薰衣草小店</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/e233e7edbf8e31d34193fafd57a9907b.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="18H531u3T3" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.weiye.me/zcimgdir/album/file_574271a25c73e.jpg" onerror="errorWeiyeCover(this)"><p class="name">婚礼定制模板</p><div class="code-mask"><img class="code" src="http://img.weiye.me/tmp_file/09929c0012d12a1373ff103ebc17cc5a.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="5b6f64i4Z4" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.zhichiwangluo.com/zcimgdir/album/file_56a0889e15229.jpg" onerror="errorWeiyeCover(this)"><p class="name">单品售卖</p><div class="code-mask"><img class="code" src="http://img.zhichiwangluo.com/tmp_file/a284d9f62d22c638691a699f96b742f7.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="DT4vtBhtHw" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.zhichiwangluo.com/zcimgdir/album/file_56a1a3f4d9847.png" onerror="errorWeiyeCover(this)"><p class="name">餐饮模板</p><div class="code-mask"><img class="code" src="http://img.zhichiwangluo.com/tmp_file/1d3f6e404db72b3d7ce2ea9a87f49c20.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> <li data-id="58v33MQ2mh" data-desc="undefined" data-logo="undefined" class="js-tpl"><img class="cover" src="http://img.zhichiwangluo.com/zcimgdir/album/file_569a0c2312394.jpg" onerror="errorWeiyeCover(this)"><p class="name">好新闻</p><div class="code-mask"><img class="code" src="http://img.zhichiwangluo.com/tmp_file/a12306b208e330b8790ab6dcefcbf4c6.png" alt=""><span class="select-btn js-preview-btn">预览</span><span class="select-btn choose-btn">选择</span></div></li> </ul> |
| 556 | <div class="code-mask"> | ||
| 557 | <img class="code" src="http://img.weiye.me/tmp_file/ | ||
| 558 | 21b9bec8d88a32d9e9731e3a1498e580.png" alt=""> | ||
| 559 | <span class="select-btn js-preview-btn">预览</span> | ||
| 560 | <span class="select-btn choose-btn">选择</span> | ||
| 561 | </div> | 548 | </div> |
| 562 | </li> | ||
| 563 | <li data-id="gGmd7NT1Re" data-desc="undefined" data-logo="undefined" | ||
| 564 | class="js-tpl"> | ||
| 565 | <img class="cover" src="http://img.weiye.me/zcimgdir/album/ | ||
| 566 | file_57bbc4011a30b.jpg" onerror="errorWeiyeCover(this)"> |
templates/webapp.html
| 1 | 1 | ||
| 2 | <!DOCTYPE html> | 2 | <!DOCTYPE html> |
| 3 | <html lang="zh-CN"> | 3 | <html lang="zh-CN"> |
| 4 | <head> | 4 | <head> |
| 5 | <title>即速应用-预览</title> | 5 | <title>秀野堂-预览</title> |
| 6 | <meta name="renderer" content="webkit"> | 6 | <meta name="renderer" content="webkit"> |
| 7 | <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" > | 7 | <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" > |
| 8 | <meta charset="UTF-8" name="description" content="深圳市咫尺网络科技开发有限公司，专注于移动互联网营销解决方案，拥有微信服务号活动汇，微社区微活动应用，及酷炫的邀请函微页等产品，提供快捷方便活动管理，分享、报名统计，营销推广等服务。精彩活动，尽在咫尺！丰富您的活动，精彩您的人生，快来发起属于您的活动吧！"> | 8 | <meta charset="UTF-8" name="description" content="秀野堂"> |
| 9 | <meta name="keywords" content="活动汇,微活动,咫尺活动,微页,咫尺网络,微杂志,微邀请函,喜帖,电子邀请函,H5应用,APP,微场景,场景应用,微场景制作,场景应用制作"> | 9 | <meta name="keywords" content="秀野堂"> |
| 10 | <link rel="shortcut icon" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/common/images/favicon.ico" type="image/x-icon"> | 10 | <link rel="shortcut icon" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/common/images/favicon.ico" type="image/x-icon"> |
| 11 | <link rel="stylesheet" href="/zhichi_frontend/static/webapp/css/pc_icomoon.css"> | 11 | <link rel="stylesheet" href="/zhichi_frontend/static/webapp/css/pc_icomoon.css"> |
| 12 | <link rel="stylesheet" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/css/common.css?version=10213"> | 12 | <link rel="stylesheet" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/css/common.css?version=10213"> |
| 13 | <style type="text/css"> | 13 | <style type="text/css"> |
| 14 | html { | 14 | html { |
| 15 | height: 0; | 15 | height: 0; |
| 16 | overflow: visible; | 16 | overflow: visible; |
| 17 | } | 17 | } |
| 18 | body { | 18 | body { |
| 19 | min-width: 1200px; | 19 | min-width: 1200px; |
| 20 | background-color: #fff; | 20 | background-color: #fff; |
| 21 | padding-top: 10px; | 21 | padding-top: 10px; |
| 22 | box-sizing: border-box; | 22 | box-sizing: border-box; |
| 23 | transform-origin: center 0; | 23 | transform-origin: center 0; |
| 24 | -webkit-transform-origin: center 0; | 24 | -webkit-transform-origin: center 0; |
| 25 | -ms-transform-origin: center 0; | 25 | -ms-transform-origin: center 0; |
| 26 | -moz-transform-origin: center 0; | 26 | -moz-transform-origin: center 0; |
| 27 | } | 27 | } |
| 28 | .preview-wrap { | 28 | .preview-wrap { |
| 29 | width: 1180px; | 29 | width: 1180px; |
| 30 | margin-left: auto; | 30 | margin-left: auto; |
| 31 | margin-right: auto; | 31 | margin-right: auto; |
| 32 | text-align: center; | 32 | text-align: center; |
| 33 | } | 33 | } |
| 34 | #phone-component { | 34 | #phone-component { |
| 35 | position: relative; | 35 | position: relative; |
| 36 | display: inline-block; | 36 | display: inline-block; |
| 37 | width: 332px; | 37 | width: 332px; |
| 38 | height: 678px; | 38 | height: 678px; |
| 39 | margin-left: 80px; | 39 | margin-left: 80px; |
| 40 | margin-right: 80px; | 40 | margin-right: 80px; |
| 41 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone/6s.png); | 41 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone/6s.png); |
| 42 | background-size: 100% 100%; | 42 | background-size: 100% 100%; |
| 43 | background-repeat: no-repeat; | 43 | background-repeat: no-repeat; |
| 44 | vertical-align: top; | 44 | vertical-align: top; |
| 45 | z-index: 999; | 45 | z-index: 999; |
| 46 | } | 46 | } |
| 47 | .phone-head{ | 47 | .phone-head{ |
| 48 | position: absolute; | 48 | position: absolute; |
| 49 | top: 81px; | 49 | top: 81px; |
| 50 | left: 22px; | 50 | left: 22px; |
| 51 | width: 288px; | 51 | width: 288px; |
| 52 | height: 58px; | 52 | height: 58px; |
| 53 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone-head.jpg); | 53 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone-head.jpg); |
| 54 | background-size: 100% 100%; | 54 | background-size: 100% 100%; |
| 55 | background-repeat: no-repeat; | 55 | background-repeat: no-repeat; |
| 56 | } | 56 | } |
| 57 | .phone-head span{ | 57 | .phone-head span{ |
| 58 | color: #fff; | 58 | color: #fff; |
| 59 | cursor: pointer; | 59 | cursor: pointer; |
| 60 | position: absolute; | 60 | position: absolute; |
| 61 | left: 10px; | 61 | left: 10px; |
| 62 | top: 25px; | 62 | top: 25px; |
| 63 | font-size: 14px; | 63 | font-size: 14px; |
| 64 | line-height: 25px; | 64 | line-height: 25px; |
| 65 | padding-left: 14px; | 65 | padding-left: 14px; |
| 66 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/left.png); | 66 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/left.png); |
| 67 | background-size: auto 15px; | 67 | background-size: auto 15px; |
| 68 | background-repeat: no-repeat; | 68 | background-repeat: no-repeat; |
| 69 | background-position: left center; | 69 | background-position: left center; |
| 70 | } | 70 | } |
| 71 | .phone-content { | 71 | .phone-content { |
| 72 | position: absolute; | 72 | position: absolute; |
| 73 | top: 139px; | 73 | top: 139px; |
| 74 | left: 22px; | 74 | left: 22px; |
| 75 | width: 288px; | 75 | width: 288px; |
| 76 | height: 454px; | 76 | height: 454px; |
| 77 | overflow: hidden; | 77 | overflow: hidden; |
| 78 | background-color: #fff; | 78 | background-color: #fff; |
| 79 | } | 79 | } |
| 80 | .preview-iframe { | 80 | .preview-iframe { |
| 81 | display: block; | 81 | display: block; |
| 82 | position: relative; | 82 | position: relative; |
| 83 | width: 320px; | 83 | width: 320px; |
| 84 | height: 504px; | 84 | height: 504px; |
| 85 | transform: scale(0.9); | 85 | transform: scale(0.9); |
| 86 | -webkit-transform: scale(0.9); | 86 | -webkit-transform: scale(0.9); |
| 87 | -ms-transform: scale(0.9); | 87 | -ms-transform: scale(0.9); |
| 88 | -moz-transform: scale(0.9); | 88 | -moz-transform: scale(0.9); |
| 89 | transform-origin: 0 0; | 89 | transform-origin: 0 0; |
| 90 | -webkit-transform-origin: 0 0; | 90 | -webkit-transform-origin: 0 0; |
| 91 | -ms-transform-origin: 0 0; | 91 | -ms-transform-origin: 0 0; |
| 92 | -moz-transform-origin: 0 0; | 92 | -moz-transform-origin: 0 0; |
| 93 | outline: none; | 93 | outline: none; |
| 94 | border: none; | 94 | border: none; |
| 95 | } | 95 | } |
| 96 | #phone-component .page::-webkit-scrollbar, | 96 | #phone-component .page::-webkit-scrollbar, |
| 97 | iframe::-webkit-scrollbar { | 97 | iframe::-webkit-scrollbar { |
| 98 | width: 0; | 98 | width: 0; |
| 99 | height: 0; | 99 | height: 0; |
| 100 | } | 100 | } |
| 101 | #phone-component .page.dialog-page { | 101 | #phone-component .page.dialog-page { |
| 102 | background-color: rgba(0,0,0,.5); | 102 | background-color: rgba(0,0,0,.5); |
| 103 | } | 103 | } |
| 104 | .nav-component { | 104 | .nav-component { |
| 105 | display: inline-block; | 105 | display: inline-block; |
| 106 | width: 220px; | 106 | width: 220px; |
| 107 | margin-top: 55px; | 107 | margin-top: 55px; |
| 108 | vertical-align: top; | 108 | vertical-align: top; |
| 109 | text-align: left; | 109 | text-align: left; |
| 110 | } | 110 | } |
| 111 | .left-component{ | 111 | .left-component{ |
| 112 | width: 250px; | 112 | width: 250px; |
| 113 | text-align: center; | 113 | text-align: center; |
| 114 | } | 114 | } |
| 115 | .nav-component .box-title { | 115 | .nav-component .box-title { |
| 116 | color: #535353; | 116 | color: #535353; |
| 117 | font-size: 14px; | 117 | font-size: 14px; |
| 118 | margin-bottom: 15px; | 118 | margin-bottom: 15px; |
| 119 | } | 119 | } |
| 120 | .nav-component .box-title.title2{ | 120 | .nav-component .box-title.title2{ |
| 121 | margin-top: 30px; | 121 | margin-top: 30px; |
| 122 | margin-bottom: 15px; | 122 | margin-bottom: 15px; |
| 123 | } | 123 | } |
| 124 | .app-link-wrap input , .copy-link-wrap button{ | 124 | .app-link-wrap input , .copy-link-wrap button{ |
| 125 | background-color: #fff; | 125 | background-color: #fff; |
| 126 | border: 1px solid #ccc; | 126 | border: 1px solid #ccc; |
| 127 | color: #535353; | 127 | color: #535353; |
| 128 | width: 220px; | 128 | width: 220px; |
| 129 | height: 36px; | 129 | height: 36px; |
| 130 | font-size: 14px; | 130 | font-size: 14px; |
| 131 | outline: none; | 131 | outline: none; |
| 132 | } | 132 | } |
| 133 | .app-link-wrap input{ | 133 | .app-link-wrap input{ |
| 134 | width: 198px; | 134 | width: 198px; |
| 135 | height: 38px; | 135 | height: 38px; |
| 136 | padding: 0 10px; | 136 | padding: 0 10px; |
| 137 | margin-bottom: 15px; | 137 | margin-bottom: 15px; |
| 138 | } | 138 | } |
| 139 | .nav-component .group-page-container { | 139 | .nav-component .group-page-container { |
| 140 | height: 400px; | 140 | height: 400px; |
| 141 | line-height: 32px; | 141 | line-height: 32px; |
| 142 | color: #fff; | 142 | color: #fff; |
| 143 | background-color: #fff; | 143 | background-color: #fff; |
| 144 | text-indent: 34px; | 144 | text-indent: 34px; |
| 145 | border: 1px solid #ccc; | 145 | border: 1px solid #ccc; |
| 146 | overflow-y: auto; | 146 | overflow-y: auto; |
| 147 | } | 147 | } |
| 148 | .nav-component .group-page-nav .group-nav { | 148 | .nav-component .group-page-nav .group-nav { |
| 149 | position: relative; | 149 | position: relative; |
| 150 | background-color: #8d8d8d; | 150 | background-color: #8d8d8d; |
| 151 | cursor: pointer; | 151 | cursor: pointer; |
| 152 | line-height: 40px; | 152 | line-height: 40px; |
| 153 | } | 153 | } |
| 154 | .nav-component .group-page-nav .group-nav:before { | 154 | .nav-component .group-page-nav .group-nav:before { |
| 155 | content: ''; | 155 | content: ''; |
| 156 | position: absolute; | 156 | position: absolute; |
| 157 | left: 6px; | 157 | left: 6px; |
| 158 | top: 7px; | 158 | top: 7px; |
| 159 | width: 24px; | 159 | width: 24px; |
| 160 | height: 22px; | 160 | height: 22px; |
| 161 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/icons.png); | 161 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/icons.png); |
| 162 | background-repeat: no-repeat; | 162 | background-repeat: no-repeat; |
| 163 | background-size: auto 24px; | 163 | background-size: auto 24px; |
| 164 | background-position-x: -96px; | 164 | background-position-x: -96px; |
| 165 | } | 165 | } |
| 166 | .nav-component .group-page-nav .group-nav:after { | 166 | .nav-component .group-page-nav .group-nav:after { |
| 167 | content: ''; | 167 | content: ''; |
| 168 | position: absolute; | 168 | position: absolute; |
| 169 | right: 12px; | 169 | right: 12px; |
| 170 | top: 17px; | 170 | top: 17px; |
| 171 | display: block; | 171 | display: block; |
| 172 | width: 14px; | 172 | width: 14px; |
| 173 | height: 9px; | 173 | height: 9px; |
| 174 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/down.png); | 174 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/down.png); |
| 175 | background-size: 100% auto; | 175 | background-size: 100% auto; |
| 176 | background-repeat: no-repeat; | 176 | background-repeat: no-repeat; |
| 177 | } | 177 | } |
| 178 | .nav-component .group-page-nav.active .group-nav:after { | 178 | .nav-component .group-page-nav.active .group-nav:after { |
| 179 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/up.png); | 179 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/up.png); |
| 180 | } | 180 | } |
| 181 | .nav-component .group-page-nav .page-navs { | 181 | .nav-component .group-page-nav .page-navs { |
| 182 | display: none; | 182 | display: none; |
| 183 | background-color: #f4f4f4; | 183 | background-color: #f4f4f4; |
| 184 | color: #999; | 184 | color: #999; |
| 185 | cursor: pointer; | 185 | cursor: pointer; |
| 186 | } | 186 | } |
| 187 | .nav-component .group-page-nav .page-navs .page-nav { | 187 | .nav-component .group-page-nav .page-navs .page-nav { |
| 188 | position: relative; | 188 | position: relative; |
| 189 | line-height: 35px; | 189 | line-height: 35px; |
| 190 | background-color: #fff; | 190 | background-color: #fff; |
| 191 | border-bottom: 1px solid #c6c6c6; | 191 | border-bottom: 1px solid #c6c6c6; |
| 192 | } | 192 | } |
| 193 | .nav-component .group-page-nav.active .page-navs { | 193 | .nav-component .group-page-nav.active .page-navs { |
| 194 | display: block; | 194 | display: block; |
| 195 | } | 195 | } |
| 196 | .nav-component .group-page-nav .page-navs .active{ | 196 | .nav-component .group-page-nav .page-navs .active{ |
| 197 | background-color: #c6c6c6; | 197 | background-color: #c6c6c6; |
| 198 | color: #fff; | 198 | color: #fff; |
| 199 | } | 199 | } |
| 200 | .nav-component .group-page-nav .page-navs li{ | 200 | .nav-component .group-page-nav .page-navs li{ |
| 201 | box-sizing: border-box; | 201 | box-sizing: border-box; |
| 202 | -webkit-box-sizing: border-box; | 202 | -webkit-box-sizing: border-box; |
| 203 | } | 203 | } |
| 204 | .nav-component .group-page-nav .page-navs li:hover { | 204 | .nav-component .group-page-nav .page-navs li:hover { |
| 205 | outline: 1px solid #ffb100; | 205 | outline: 1px solid #ffb100; |
| 206 | text-indent: 33px; | 206 | text-indent: 33px; |
| 207 | border: 1px solid #ffb100; | 207 | border: 1px solid #ffb100; |
| 208 | border-top: 0; | 208 | border-top: 0; |
| 209 | } | 209 | } |
| 210 | .nav-component .group-page-nav .page-navs .empty-group-tip { | 210 | .nav-component .group-page-nav .page-navs .empty-group-tip { |
| 211 | background-color: #fff!important; | 211 | background-color: #fff!important; |
| 212 | color: #666; | 212 | color: #666; |
| 213 | text-align: center; | 213 | text-align: center; |
| 214 | text-indent: 0; | 214 | text-indent: 0; |
| 215 | cursor: default; | 215 | cursor: default; |
| 216 | } | 216 | } |
| 217 | #preview-code { | 217 | #preview-code { |
| 218 | width: 180px; | 218 | width: 180px; |
| 219 | height: 180px; | 219 | height: 180px; |
| 220 | } | 220 | } |
| 221 | .code-container { | 221 | .code-container { |
| 222 | display: inline-block; | 222 | display: inline-block; |
| 223 | padding: 10px; | 223 | padding: 10px; |
| 224 | border: 1px solid #ccc; | 224 | border: 1px solid #ccc; |
| 225 | } | 225 | } |
| 226 | .cata-phone-tab { | 226 | .cata-phone-tab { |
| 227 | display: inline-block; | 227 | display: inline-block; |
| 228 | margin-right: 26px; | 228 | margin-right: 26px; |
| 229 | margin-top: 147px; | 229 | margin-top: 147px; |
| 230 | cursor: pointer; | 230 | cursor: pointer; |
| 231 | } | 231 | } |
| 232 | .cata-phone-tab > div { | 232 | .cata-phone-tab > div { |
| 233 | padding: 14px 7px; | 233 | padding: 14px 7px; |
| 234 | width: 18px; | 234 | width: 18px; |
| 235 | margin-left: auto; | 235 | margin-left: auto; |
| 236 | margin-right: auto; | 236 | margin-right: auto; |
| 237 | color: #666; | 237 | color: #666; |
| 238 | border: 1px solid #ccc; | 238 | border: 1px solid #ccc; |
| 239 | } | 239 | } |
| 240 | .cata-phone-tab > div.active { | 240 | .cata-phone-tab > div.active { |
| 241 | color: #fff; | 241 | color: #fff; |
| 242 | background: #8d8d8d; | 242 | background: #8d8d8d; |
| 243 | border: 1px solid #8d8d8d; | 243 | border: 1px solid #8d8d8d; |
| 244 | } | 244 | } |
| 245 | .phone-model { | 245 | .phone-model { |
| 246 | display: none; | 246 | display: none; |
| 247 | } | 247 | } |
| 248 | .phone-model-list { | 248 | .phone-model-list { |
| 249 | color: #999; | 249 | color: #999; |
| 250 | font-size: 16px; | 250 | font-size: 16px; |
| 251 | line-height: 36px; | 251 | line-height: 36px; |
| 252 | text-align: center; | 252 | text-align: center; |
| 253 | } | 253 | } |
| 254 | .phone-model-list li { | 254 | .phone-model-list li { |
| 255 | margin-bottom: 5px; | 255 | margin-bottom: 5px; |
| 256 | border: 1px solid #ccc; | 256 | border: 1px solid #ccc; |
| 257 | cursor: pointer; | 257 | cursor: pointer; |
| 258 | } | 258 | } |
| 259 | .phone-model-list li.active { | 259 | .phone-model-list li.active { |
| 260 | color: #fff; | 260 | color: #fff; |
| 261 | background-color: #8d8d8d; | 261 | background-color: #8d8d8d; |
| 262 | border-color: #8d8d8d; | 262 | border-color: #8d8d8d; |
| 263 | } | 263 | } |
| 264 | #phone-component.phone-6plus { | 264 | #phone-component.phone-6plus { |
| 265 | width: 332px; | 265 | width: 332px; |
| 266 | height: 670px; | 266 | height: 670px; |
| 267 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone/6s.png); | 267 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone/6s.png); |
| 268 | } | 268 | } |
| 269 | #phone-component.phone-6plus .phone-head { | 269 | #phone-component.phone-6plus .phone-head { |
| 270 | top: 81px; | 270 | top: 81px; |
| 271 | left: 22px; | 271 | left: 22px; |
| 272 | width: 288px; | 272 | width: 288px; |
| 273 | } | 273 | } |
| 274 | #phone-component.phone-6plus .phone-content { | 274 | #phone-component.phone-6plus .phone-content { |
| 275 | top: 139px; | 275 | top: 139px; |
| 276 | left: 22px; | 276 | left: 22px; |
| 277 | width: 288px; | 277 | width: 288px; |
| 278 | height: 446px; | 278 | height: 446px; |
| 279 | } | 279 | } |
| 280 | #phone-component.phone-6plus .preview-iframe { | 280 | #phone-component.phone-6plus .preview-iframe { |
| 281 | width: 320px; | 281 | width: 320px; |
| 282 | height: 495px; | 282 | height: 495px; |
| 283 | transform: scale(0.9); | 283 | transform: scale(0.9); |
| 284 | -webkit-transform: scale(0.9); | 284 | -webkit-transform: scale(0.9); |
| 285 | -ms-transform: scale(0.9); | 285 | -ms-transform: scale(0.9); |
| 286 | -moz-transform: scale(0.9); | 286 | -moz-transform: scale(0.9); |
| 287 | } | 287 | } |
| 288 | #phone-component.phone-5s { | 288 | #phone-component.phone-5s { |
| 289 | width: 312px; | 289 | width: 312px; |
| 290 | height: 648px; | 290 | height: 648px; |
| 291 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone/5s.png); | 291 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone/5s.png); |
| 292 | } | 292 | } |
| 293 | #phone-component.phone-5s .phone-head { | 293 | #phone-component.phone-5s .phone-head { |
| 294 | top: 93px; | 294 | top: 93px; |
| 295 | left: 25px; | 295 | left: 25px; |
| 296 | width: 262px; | 296 | width: 262px; |
| 297 | } | 297 | } |
| 298 | #phone-component.phone-5s .phone-content { | 298 | #phone-component.phone-5s .phone-content { |
| 299 | top: 150px; | 299 | top: 150px; |
| 300 | left: 26px; | 300 | left: 26px; |
| 301 | width: 260px; | 301 | width: 260px; |
| 302 | height: 405px; | 302 | height: 405px; |
| 303 | } | 303 | } |
| 304 | #phone-component.phone-5s .preview-iframe { | 304 | #phone-component.phone-5s .preview-iframe { |
| 305 | width: 320px; | 305 | width: 320px; |
| 306 | height: 498px; | 306 | height: 498px; |
| 307 | transform: scale(0.8125); | 307 | transform: scale(0.8125); |
| 308 | -webkit-transform: scale(0.8125); | 308 | -webkit-transform: scale(0.8125); |
| 309 | -ms-transform: scale(0.8125); | 309 | -ms-transform: scale(0.8125); |
| 310 | -moz-transform: scale(0.8125); | 310 | -moz-transform: scale(0.8125); |
| 311 | } | 311 | } |
| 312 | #phone-component.phone-note4 { | 312 | #phone-component.phone-note4 { |
| 313 | width: 340px; | 313 | width: 340px; |
| 314 | height: 665px; | 314 | height: 665px; |
| 315 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone/note4.png); | 315 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone/note4.png); |
| 316 | } | 316 | } |
| 317 | #phone-component.phone-note4 .phone-head { | 317 | #phone-component.phone-note4 .phone-head { |
| 318 | top: 56px; | 318 | top: 56px; |
| 319 | left: 16px; | 319 | left: 16px; |
| 320 | width: 306px; | 320 | width: 306px; |
| 321 | } | 321 | } |
| 322 | #phone-component.phone-note4 .phone-content { | 322 | #phone-component.phone-note4 .phone-content { |
| 323 | left: 17px; | 323 | left: 17px; |
| 324 | top: 114px; | 324 | top: 114px; |
| 325 | width: 305px; | 325 | width: 305px; |
| 326 | height: 497px; | 326 | height: 497px; |
| 327 | } | 327 | } |
| 328 | #phone-component.phone-note4 .preview-iframe { | 328 | #phone-component.phone-note4 .preview-iframe { |
| 329 | width: 320px; | 329 | width: 320px; |
| 330 | height: 521px; | 330 | height: 521px; |
| 331 | transform: scale(0.953215); | 331 | transform: scale(0.953215); |
| 332 | -webkit-transform: scale(0.953215); | 332 | -webkit-transform: scale(0.953215); |
| 333 | -ms-transform: scale(0.953215); | 333 | -ms-transform: scale(0.953215); |
| 334 | -moz-transform: scale(0.953215); | 334 | -moz-transform: scale(0.953215); |
| 335 | } | 335 | } |
| 336 | #phone-component.phone-p8 { | 336 | #phone-component.phone-p8 { |
| 337 | width: 334px; | 337 | width: 334px; |
| 338 | height: 650px; | 338 | height: 650px; |
| 339 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone/p8.png); | 339 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone/p8.png); |
| 340 | } | 340 | } |
| 341 | #phone-component.phone-p8 .phone-head { | 341 | #phone-component.phone-p8 .phone-head { |
| 342 | top: 57px; | 342 | top: 57px; |
| 343 | left: 10px; | 343 | left: 10px; |
| 344 | width: 315px; | 344 | width: 315px; |
| 345 | } | 345 | } |
| 346 | #phone-component.phone-p8 .phone-content { | 346 | #phone-component.phone-p8 .phone-content { |
| 347 | top: 115px; | 347 | top: 115px; |
| 348 | left: 10px; | 348 | left: 10px; |
| 349 | width: 315px; | 349 | width: 315px; |
| 350 | height: 480px; | 350 | height: 480px; |
| 351 | } | 351 | } |
| 352 | #phone-component.phone-p8 .preview-iframe { | 352 | #phone-component.phone-p8 .preview-iframe { |
| 353 | width: 322px; | 353 | width: 322px; |
| 354 | height: 491px; | 354 | height: 491px; |
| 355 | transform: scale(0.978125); | 355 | transform: scale(0.978125); |
| 356 | -webkit-transform: scale(0.978125); | 356 | -webkit-transform: scale(0.978125); |
| 357 | -ms-transform: scale(0.978125); | 357 | -ms-transform: scale(0.978125); |
| 358 | -moz-transform: scale(0.978125); | 358 | -moz-transform: scale(0.978125); |
| 359 | } | 359 | } |
| 360 | #phone-component.phone-mi4 { | 360 | #phone-component.phone-mi4 { |
| 361 | width: 330px; | 361 | width: 330px; |
| 362 | height: 660px; | 362 | height: 660px; |
| 363 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone/mi4.png); | 363 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone/mi4.png); |
| 364 | } | 364 | } |
| 365 | #phone-component.phone-mi4 .phone-head { | 365 | #phone-component.phone-mi4 .phone-head { |
| 366 | top: 63px; | 366 | top: 63px; |
| 367 | left: 17px; | 367 | left: 17px; |
| 368 | width: 296px; | 368 | width: 296px; |
| 369 | } | 369 | } |
| 370 | #phone-component.phone-mi4 .phone-content { | 370 | #phone-component.phone-mi4 .phone-content { |
| 371 | top: 121px; | 371 | top: 121px; |
| 372 | left: 17px; | 372 | left: 17px; |
| 373 | width: 296px; | 373 | width: 296px; |
| 374 | height: 462px; | 374 | height: 462px; |
| 375 | } | 375 | } |
| 376 | #phone-component.phone-mi4 .preview-iframe { | 376 | #phone-component.phone-mi4 .preview-iframe { |
| 377 | width: 322px; | 377 | width: 322px; |
| 378 | height: 503px; | 378 | height: 503px; |
| 379 | transform: scale(0.91875); | 379 | transform: scale(0.91875); |
| 380 | -webkit-transform: scale(0.91875); | 380 | -webkit-transform: scale(0.91875); |
| 381 | -ms-transform: scale(0.91875); | 381 | -ms-transform: scale(0.91875); |
| 382 | -moz-transform: scale(0.91875); | 382 | -moz-transform: scale(0.91875); |
| 383 | } | 383 | } |
| 384 | #phone-component.ipad-air { | 384 | #phone-component.ipad-air { |
| 385 | width: 460px; | 385 | width: 460px; |
| 386 | height: 660px; | 386 | height: 660px; |
| 387 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone/ipad-air.png); | 387 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone/ipad-air.png); |
| 388 | } | 388 | } |
| 389 | #phone-component.ipad-air .phone-head { | 389 | #phone-component.ipad-air .phone-head { |
| 390 | top: 59px; | 390 | top: 59px; |
| 391 | left: 30px; | 391 | left: 30px; |
| 392 | width: 400px; | 392 | width: 400px; |
| 393 | height: 80px; | 393 | height: 80px; |
| 394 | } | 394 | } |
| 395 | #phone-component.ipad-air .phone-head > span { | 395 | #phone-component.ipad-air .phone-head > span { |
| 396 | top: 40px; | 396 | top: 40px; |
| 397 | } | 397 | } |
| 398 | #phone-component.ipad-air .phone-content { | 398 | #phone-component.ipad-air .phone-content { |
| 399 | top: 139px; | 399 | top: 139px; |
| 400 | left: 30px; | 400 | left: 30px; |
| 401 | width: 400px; | 401 | width: 400px; |
| 402 | height: 461px; | 402 | height: 461px; |
| 403 | } | 403 | } |
| 404 | #phone-component.ipad-air .preview-iframe { | 404 | #phone-component.ipad-air .preview-iframe { |
| 405 | width: 323px; | 405 | width: 323px; |
| 406 | height: 373px; | 406 | height: 373px; |
| 407 | transform: scale(1.2375); | 407 | transform: scale(1.2375); |
| 408 | -webkit-transform: scale(1.2375); | 408 | -webkit-transform: scale(1.2375); |
| 409 | -ms-transform: scale(1.2375); | 409 | -ms-transform: scale(1.2375); |
| 410 | -moz-transform: scale(1.2375); | 410 | -moz-transform: scale(1.2375); |
| 411 | } | 411 | } |
| 412 | 412 | ||
| 413 | .bottom-tab { | 413 | .bottom-tab { |
| 414 | margin-top: 78px; | 414 | margin-top: 78px; |
| 415 | width: 36px !important; | 415 | width: 36px !important; |
| 416 | padding: 0 !important; | 416 | padding: 0 !important; |
| 417 | } | 417 | } |
| 418 | .bottom-tab > span { | 418 | .bottom-tab > span { |
| 419 | display: block; | 419 | display: block; |
| 420 | width: 36px; | 420 | width: 36px; |
| 421 | height: 50px; | 421 | height: 50px; |
| 422 | line-height: 40px; | 422 | line-height: 40px; |
| 423 | font-size: 20px; | 423 | font-size: 20px; |
| 424 | text-align: center; | 424 | text-align: center; |
| 425 | color: #aaa; | 425 | color: #aaa; |
| 426 | cursor: pointer; | 426 | cursor: pointer; |
| 427 | background-color: #fff; | 427 | background-color: #fff; |
| 428 | } | 428 | } |
| 429 | .bottom-tab > span:first-child { | 429 | .bottom-tab > span:first-child { |
| 430 | border-bottom: 1px solid #e7e7e7; | 430 | border-bottom: 1px solid #e7e7e7; |
| 431 | } | 431 | } |
| 432 | .bottom-tab a { | 432 | .bottom-tab a { |
| 433 | display: inline-block; | 433 | display: inline-block; |
| 434 | color: #aaa; | 434 | color: #aaa; |
| 435 | width: 100%; | 435 | width: 100%; |
| 436 | height: 100%; | 436 | height: 100%; |
| 437 | font-size: 12px; | 437 | font-size: 12px; |
| 438 | line-height: 1em; | 438 | line-height: 1em; |
| 439 | } | 439 | } |
| 440 | .bottom-tab a > span { | 440 | .bottom-tab a > span { |
| 441 | display: inline-block; | 441 | display: inline-block; |
| 442 | width: 100%; | 442 | width: 100%; |
| 443 | margin: 5px 0; | 443 | margin: 5px 0; |
| 444 | font-size: 20px; | 444 | font-size: 20px; |
| 445 | vertical-align: top; | 445 | vertical-align: top; |
| 446 | } | 446 | } |
| 447 | </style> | 447 | </style> |
| 448 | <script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/js/library/jquery-2.1.4.min.js"></script> | 448 | <script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/js/library/jquery-2.1.4.min.js"></script> |
| 449 | <script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc/invitation/js/tip.js"></script> | 449 | <script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc/invitation/js/tip.js"></script> |
| 450 | <script type="text/javascript"> | 450 | <script type="text/javascript"> |
| 451 | var scaleRatio = window.innerHeight/683, | 451 | var scaleRatio = window.innerHeight/683, |
| 452 | scaleStr; | 452 | scaleStr; |
| 453 | 453 | ||
| 454 | if(scaleRatio > 1){ | 454 | if(scaleRatio > 1){ |
| 455 | scaleRatio = 1; | 455 | scaleRatio = 1; |
| 456 | } | 456 | } |
| 457 | scaleStr = 'scale('+scaleRatio+')'; | 457 | scaleStr = 'scale('+scaleRatio+')'; |
| 458 | window.onload = function(){ | 458 | window.onload = function(){ |
| 459 | $('.webapp').css({ | 459 | $('.webapp').css({ |
| 460 | transform: scaleStr, | 460 | transform: scaleStr, |
| 461 | '-webkit-transform': scaleStr, | 461 | '-webkit-transform': scaleStr, |
| 462 | '-ms-transform': scaleStr, | 462 | '-ms-transform': scaleStr, |
| 463 | '-moz-transform': scaleStr | 463 | '-moz-transform': scaleStr |
| 464 | }); | 464 | }); |
| 465 | }; | 465 | }; |
| 466 | </script> | 466 | </script> |
| 467 | <script type='text/javascript'> | 467 | <script type='text/javascript'> |
| 468 | var _vds = _vds || []; | 468 | var _vds = _vds || []; |
| 469 | window._vds = _vds; | 469 | window._vds = _vds; |
| 470 | (function(){ | 470 | (function(){ |
| 471 | _vds.push(['setAccountId', '9fd21c28eb55d8a5']); | 471 | _vds.push(['setAccountId', '9fd21c28eb55d8a5']); |
| 472 | (function() { | 472 | (function() { |
| 473 | var vds = document.createElement('script'); | 473 | var vds = document.createElement('script'); |
| 474 | vds.type='text/javascript'; | 474 | vds.type='text/javascript'; |
| 475 | vds.async = true; | 475 | vds.async = true; |
| 476 | vds.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'dn-growing.qbox.me/vds.js'; | 476 | vds.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'dn-growing.qbox.me/vds.js'; |
| 477 | var s = document.getElementsByTagName('script')[0]; | 477 | var s = document.getElementsByTagName('script')[0]; |
| 478 | s.parentNode.insertBefore(vds, s); | 478 | s.parentNode.insertBefore(vds, s); |
| 479 | })(); | 479 | })(); |
| 480 | })(); | 480 | })(); |
| 481 | </script> | 481 | </script> |
| 482 | </head> | 482 | </head> |
| 483 | <body class="webapp" is_login="0"> | 483 | <body class="webapp" is_login="0"> |
| 484 | <div id="preview-wrap" class="preview-wrap"> | 484 | <div id="preview-wrap" class="preview-wrap"> |
| 485 | <div class="nav-component left-component"> | 485 | <div class="nav-component left-component"> |
| 486 | <p class="box-title">扫描二维码预览并分享给朋友</p> | 486 | <p class="box-title">扫描二维码预览并分享给朋友</p> |
| 487 | <div class="code-container"> | 487 | <div class="code-container"> |
| 488 | <img src="" id="preview-code"> | 488 | <img src="" id="preview-code"> |
| 489 | </div> | 489 | </div> |
| 490 | <p class="box-title title2">或复制链接发送给朋友</p> | 490 | <p class="box-title title2">或复制链接发送给朋友</p> |
| 491 | <div class="app-link-wrap"><input type="text" id="app-link"></div> | 491 | <div class="app-link-wrap"><input type="text" id="app-link"></div> |
| 492 | <div class="copy-link-wrap"><button id="copy-link">复制链接</button></div> | 492 | <div class="copy-link-wrap"><button id="copy-link">复制链接</button></div> |
| 493 | </div> | 493 | </div> |
| 494 | <div id="phone-component" class="phone-6plus"> | 494 | <div id="phone-component" class="phone-6plus"> |
| 495 | <div class="phone-head"><span id="go-back">返回</span></div> | 495 | <div class="phone-head"><span id="go-back">返回</span></div> |
| 496 | <div id="phone-container" class="phone-content"> | 496 | <div id="phone-container" class="phone-content"> |
| 497 | <iframe class="preview-iframe" id="preview-iframe" frameborder="0" allowtransparency="true" seamless></iframe> | 497 | <iframe class="preview-iframe" id="preview-iframe" frameborder="0" allowtransparency="true" seamless></iframe> |
| 498 | </div> | 498 | </div> |
| 499 | </div> | 499 | </div> |
| 500 | <div class="cata-phone-tab"> | 500 | <div class="cata-phone-tab"> |
| 501 | <div class="tab-item-cata active">目录</div> | 501 | <div class="tab-item-cata active">目录</div> |
| 502 | <div class="tab-item-phone">机型</div> | 502 | <div class="tab-item-phone">机型</div> |
| 503 | <div class="bottom-tab"> | 503 | <div class="bottom-tab"> |
| 504 | <span><a target="_blank" href="/index.php?r=pc/Webapp/exclusive"><span class="icon-container icon-heart" title="我要定制"></span>定制</a></span> | 504 | <span><a target="_blank" href="/index.php?r=pc/Webapp/exclusive"><span class="icon-container icon-heart" title="我要定制"></span>定制</a></span> |
| 505 | <span><a target="_blank" href="http://jq.qq.com/?_wv=1027&k=2Fp43Eg"><span class="icon-container icon-earphone"></span>客服</a></span> | 505 | <span><a target="_blank" href="http://jq.qq.com/?_wv=1027&k=2Fp43Eg"><span class="icon-container icon-earphone"></span>客服</a></span> |
| 506 | </div> | 506 | </div> |
| 507 | </div> | 507 | </div> |
| 508 | <div id="nav-component" class="nav-component"> | 508 | <div id="nav-component" class="nav-component"> |
| 509 | <p class="box-title">按目录浏览</p> | 509 | <p class="box-title">按目录浏览</p> |
| 510 | <ul id="group-page-container" class="group-page-container"></ul> | 510 | <ul id="group-page-container" class="group-page-container"></ul> |
| 511 | </div> | 511 | </div> |
| 512 | <div id="phone-model" class="phone-model nav-component"> | 512 | <div id="phone-model" class="phone-model nav-component"> |
| 513 | <p class="box-title">此预览仅供参考，以实际设备为准</p> | 513 | <p class="box-title">此预览仅供参考，以实际设备为准</p> |
| 514 | <ul class="phone-model-list"> | 514 | <ul class="phone-model-list"> |
| 515 | <li class="active" data-type="phone-6plus">iPhone 6 Plus</li> | 515 | <li class="active" data-type="phone-6plus">iPhone 6 Plus</li> |
| 516 | <li data-type="phone-5s">iPhone 5s</li> | 516 | <li data-type="phone-5s">iPhone 5s</li> |
| 517 | <li data-type="phone-note4">三星Note 4</li> | 517 | <li data-type="phone-note4">三星Note 4</li> |
| 518 | <li data-type="phone-p8">华为P8</li> | 518 | <li data-type="phone-p8">华为P8</li> |
| 519 | <li data-type="phone-mi4">小米M4</li> | 519 | <li data-type="phone-mi4">小米M4</li> |
| 520 | <li data-type="ipad-air">iPad Air 2</li> | 520 | <li data-type="ipad-air">iPad Air 2</li> |
| 521 | </ul> | 521 | </ul> |
| 522 | </div> | 522 | </div> |
| 523 | </div> | 523 | </div> |
| 524 | <!-- 登录注册 --> | 524 | <!-- 登录注册 --> |
| 525 | <link rel="stylesheet" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp_home/css/app_login_reg.css?version=10213"> | 525 | <link rel="stylesheet" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp_home/css/app_login_reg.css?version=10213"> |
| 526 | 526 | ||
| 527 | <script type="text/javascript" src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/js/jquery.md5.js"></script> | 527 | <script type="text/javascript" src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/js/jquery.md5.js"></script> |
| 528 | <script type="text/javascript" src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/js/cookie.js"></script> | 528 | <script type="text/javascript" src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/js/cookie.js"></script> |
| 529 | <script type="text/javascript" src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp_home/js/app_login_reg.js?version=10213"></script> | 529 | <script type="text/javascript" src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp_home/js/app_login_reg.js?version=10213"></script> |
| 530 | <div class="lr-mask" id="login_wrap" user_token=""> | 530 | <div class="lr-mask" id="login_wrap" user_token=""> |
| 531 | <div class="lr" id="login-panel"> | 531 | <div class="lr" id="login-panel"> |
| 532 | <div class="lr-left"> | 532 | <div class="lr-left"> |
| 533 | <div class="reg-wrap"> | 533 | <div class="reg-wrap"> |
| 534 | <img src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/index/images/toreg.png"> | 534 | <img src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/index/images/toreg.png"> |
| 535 | <div class="to-reg">注册</div> | 535 | <div class="to-reg">注册</div> |
| 536 | </div> | 536 | </div> |
| 537 | <div class="login-wrap"> | 537 | <div class="login-wrap"> |
| 538 | <img src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/index/images/tologin.png"> | 538 | <img src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/index/images/tologin.png"> |
| 539 | <div class="to-login">登录</div> | 539 | <div class="to-login">登录</div> |
| 540 | </div> | 540 | </div> |
| 541 | </div><div class="lr-right"> | 541 | </div><div class="lr-right"> |
| 542 | <div class="login-info-wrap"> | 542 | <div class="login-info-wrap"> |
| 543 | <div class="title">登录<span>(个人/企业账号)</span></div> | 543 | <div class="title">登录<span>(个人/企业账号)</span></div> |
| 544 | <input style="margin-top: 60px;" id="login-username" type="text" placeholder="邮箱/手机号" class="long-input"> | 544 | <input style="margin-top: 60px;" id="login-username" type="text" placeholder="邮箱/手机号" class="long-input"> |
| 545 | <input style="margin-top: 20px;" id="login-password" type="password" placeholder="请输入6-20位密码" class="long-input"> | 545 | <input style="margin-top: 20px;" id="login-password" type="password" placeholder="请输入6-20位密码" class="long-input"> |
| 546 | <div class="Rempw"><input type="checkbox" id="remberPw" checked><label for="remberPw">记住密码</label><span class="forgetPw">忘记密码</span></div> | 546 | <div class="Rempw"><input type="checkbox" id="remberPw" checked><label for="remberPw">记住密码</label><span class="forgetPw">忘记密码</span></div> |
| 547 | <div id="login-btn" class="login-btn">登录</div> | 547 | <div id="login-btn" class="login-btn">登录</div> |
| 548 | <p style="padding: 10px 0;">还没有账号？<span class="reg-now">免费注册</span></p> | 548 | <p style="padding: 10px 0;">还没有账号？<span class="reg-now">免费注册</span></p> |
| 549 | <div style="margin-top: 10px;"><span class="cross-Line"></span><span style="margin: 0 10px;font-size: 16px;">第三方账号登录</span><span class="cross-Line"></span></div> | 549 | <div style="margin-top: 10px;"><span class="cross-Line"></span><span style="margin: 0 10px;font-size: 16px;">第三方账号登录</span><span class="cross-Line"></span></div> |
| 550 | <div class="img-qq"> | 550 | <div class="img-qq"> |
| 551 | <a class="login-wx" href="javascript:;"><img title="微信" src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/index/images/wx.png"></a> | 551 | <a class="login-wx" href="javascript:;"><img title="微信" src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/index/images/wx.png"></a> |
| 552 | <a class="login_qq" href="http://www.zhichiwangluo.com/index.php?r=Login/qLogin"><img title="QQ" src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/index/images/qq.png"></a> | 552 | <a class="login_qq" href="http://www.zhichiwangluo.com/index.php?r=Login/qLogin"><img title="QQ" src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/index/images/qq.png"></a> |
| 553 | <a class="login_wd" href="/index.php?r=Login/wdlogin"><img title="微店" src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/index/images/wd.png"></a> | 553 | <a class="login_wd" href="/index.php?r=Login/wdlogin"><img title="微店" src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/index/images/wd.png"></a> |
| 554 | <a class="login_qq" href="/index.php?r=login/WMLogin"><img title="微盟" src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/index/images/weimob.png"></a> | 554 | <a class="login_qq" href="/index.php?r=login/WMLogin"><img title="微盟" src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/index/images/weimob.png"></a> |
| 555 | <a class="login_qq" href="/index.php?r=login/WBLogin"><img title="微博" src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/index/images/wb.png"></a> | 555 | <a class="login_qq" href="/index.php?r=login/WBLogin"><img title="微博" src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/index/images/wb.png"></a> |
| 556 | </div> | 556 | </div> |
| 557 | </div> | 557 | </div> |
| 558 | <div class="wx-login" > | 558 | <div class="wx-login" > |
| 559 | <div class="title">微信登录</div> | 559 | <div class="title">微信登录</div> |
| 560 | <img class="code-img" src=""> | 560 | <img class="code-img" src=""> |
| 561 | <p style="text-align: center;"><span class="cross-Line"></span>微信扫码登录<span class="cross-Line"></span></p> | 561 | <p style="text-align: center;"><span class="cross-Line"></span>微信扫码登录<span class="cross-Line"></span></p> |
| 562 | <p class="account-login" style="margin-top: 30px;text-align: center;color: #3091f2;cursor: pointer;">返回账号登陆</p> | 562 | <p class="account-login" style="margin-top: 30px;text-align: center;color: #3091f2;cursor: pointer;">返回账号登陆</p> |
| 563 | </div> | 563 | </div> |
| 564 | <div class="reg-info-wrap"> | 564 | <div class="reg-info-wrap"> |
| 565 | <div class="reg-type"><span class="active">个人注册</span><span>企业注册</span></div> | 565 | <div class="reg-type"><span class="active">个人注册</span><span>企业注册</span></div> |
| 566 | <div class="person-reg"> | 566 | <div class="person-reg"> |
| 567 | <img class="code-img" src="" alt=""> | 567 | <img class="code-img" src="" alt=""> |
| 568 | <p style="text-align: center;"><span style="width:55px;" class="cross-Line"></span><span style="margin: 0 5px;">微信扫码注册</span><span style="width:55px;" class="cross-Line"></span></p> | 568 | <p style="text-align: center;"><span style="width:55px;" class="cross-Line"></span><span style="margin: 0 5px;">微信扫码注册</span><span style="width:55px;" class="cross-Line"></span></p> |
| 569 | 569 | ||
| 570 | <div class="perfit-info" > | 570 | <div class="perfit-info" > |
| 571 | <input style="margin-top: 60px;" type="text" id="perfit-phone" placeholder="手机号" class="long-input"> | 571 | <input style="margin-top: 60px;" type="text" id="perfit-phone" placeholder="手机号" class="long-input"> |
| 572 | <input type="password" placeholder="密码" id="perfit-pw1" class="long-input"> | 572 | <input type="password" placeholder="密码" id="perfit-pw1" class="long-input"> |
| 573 | <input type="password" placeholder="确认密码" id="perfit-pw2" class="long-input"> | 573 | <input type="password" placeholder="确认密码" id="perfit-pw2" class="long-input"> |
| 574 | <input type="text" placeholder="验证码" id="perfit-code" style="width: 177px"><span class="getPerfitCode">获取验证码</span> | 574 | <input type="text" placeholder="验证码" id="perfit-code" style="width: 177px"><span class="getPerfitCode">获取验证码</span> |
| 575 | <input type="text" placeholder="邀请码" id="perfit-invite" class="long-input"> | 575 | <input type="text" placeholder="邀请码" id="perfit-invite" class="long-input"> |
| 576 | <div class="login-btn" id="perfit-info">注册</div> | 576 | <div class="login-btn" id="perfit-info">注册</div> |
| 577 | </div> | 577 | </div> |
| 578 | </div> | 578 | </div> |
| 579 | <div class="company-reg"> | 579 | <div class="company-reg"> |
| 580 | <input type="text" id="reg-fullname" placeholder="企业名称" class="long-input"><!-- <label class="necessary">*</label> --> | 580 | <input type="text" id="reg-fullname" placeholder="企业名称" class="long-input"><!-- <label class="necessary">*</label> --> |
| 581 | <input type="text" id="reg-phone" placeholder="手机号" class="long-input"><img style="width: 20px;vertical-align: middle;margin-left: 10px;" id="reg-phone-exist"><!-- <label class="necessary">*</label> --> | 581 | <input type="text" id="reg-phone" placeholder="手机号" class="long-input"><img style="width: 20px;vertical-align: middle;margin-left: 10px;" id="reg-phone-exist"><!-- <label class="necessary">*</label> --> |
| 582 | <input type="password" class="reg-password long-input" placeholder="密码" class="long-input"><!-- <label class="necessary">*</label> --> | 582 | <input type="password" class="reg-password long-input" placeholder="密码" class="long-input"><!-- <label class="necessary">*</label> --> |
| 583 | <input type="password" class="reg-conpassword long-input" placeholder="确认密码" class="long-input"><!-- <label class="necessary">*</label> --> | 583 | <input type="password" class="reg-conpassword long-input" placeholder="确认密码" class="long-input"><!-- <label class="necessary">*</label> --> |
| 584 | <input type="text" id="phone-code" placeholder="验证码" class="short-input" style="margin-top: 15px;width: 146px;"><span class="getPhoneCode">获取验证码</span> | 584 | <input type="text" id="phone-code" placeholder="验证码" class="short-input" style="margin-top: 15px;width: 146px;"><span class="getPhoneCode">获取验证码</span> |
| 585 | <select id="reg-company-type"> | 585 | <select id="reg-company-type"> |
| 586 | <option value="政府机构">政府机构</option> | 586 | <option value="政府机构">政府机构</option> |
| 587 | <option value="微信">微信</option> | 587 | <option value="微信">微信</option> |
| 588 | <option value="传媒广告">传媒广告</option> | 588 | <option value="传媒广告">传媒广告</option> |
| 589 | <option value="电商">电商</option> | 589 | <option value="电商">电商</option> |
| 590 | <option value="餐饮">餐饮</option> | 590 | <option value="餐饮">餐饮</option> |
| 591 | <option value="家具">家具</option> | 591 | <option value="家具">家具</option> |
| 592 | <option value="IT">IT</option> | 592 | <option value="IT">IT</option> |
| 593 | <option value="教育">教育</option> | 593 | <option value="教育">教育</option> |
| 594 | <option value="房地产">房地产</option> | 594 | <option value="房地产">房地产</option> |
| 595 | <option value="服装">服装</option> | 595 | <option value="服装">服装</option> |
| 596 | <option value="婚庆">婚庆</option> | 596 | <option value="婚庆">婚庆</option> |
| 597 | <option value="娱乐">娱乐</option> | 597 | <option value="娱乐">娱乐</option> |
| 598 | <option value="旅游">旅游</option> | 598 | <option value="旅游">旅游</option> |
| 599 | <option value="汽车">汽车</option> | 599 | <option value="汽车">汽车</option> |
| 600 | <option value="美容">美容</option> | 600 | <option value="美容">美容</option> |
| 601 | <option value="摄影">摄影</option> | 601 | <option value="摄影">摄影</option> |
| 602 | <option value="公益">公益</option> | 602 | <option value="公益">公益</option> |
| 603 | <option value="金融">金融</option> | 603 | <option value="金融">金融</option> |
| 604 | </select> | 604 | </select> |
| 605 | <div><select id="province-select"><option disabled selected>选择省</option></select><select id="city-select"><option disabled selected>选择市</option></select><select id="area-select"><option disabled selected>选择区</option></select></div> | 605 | <div><select id="province-select"><option disabled selected>选择省</option></select><select id="city-select"><option disabled selected>选择市</option></select><select id="area-select"><option disabled selected>选择区</option></select></div> |
| 606 | <div style="margin-top: 15px;"><input id="inviteCode" class="short-input" placeholder="邀请码，可不填"><span class="reg-btn">注册</span></div> | 606 | <div style="margin-top: 15px;"><input id="inviteCode" class="short-input" placeholder="邀请码，可不填"><span class="reg-btn">注册</span></div> |
| 607 | </div> | 607 | </div> |
| 608 | </div> | 608 | </div> |
| 609 | <div class="findBackPw"> | 609 | <div class="findBackPw"> |
| 610 | <div class="title"><span class="findtype" type="phone">手机找回</span><span class="changetype">通过邮箱找回</span></div> | 610 | <div class="title"><span class="findtype" type="phone">手机找回</span><span class="changetype">通过邮箱找回</span></div> |
| 611 | <div> | 611 | <div> |
| 612 | <input style="margin-top: 60px;" id="email-or-phone" type="text" class="account long-input" placeholder="注册手机号"> | 612 | <input style="margin-top: 60px;" id="email-or-phone" type="text" class="account long-input" placeholder="注册手机号"> |
| 613 | <input type="text" id="code-input" class="short-input" placeholder="验证码"><span class="getCode">获取验证码</span> | 613 | <input type="text" id="code-input" class="short-input" placeholder="验证码"><span class="getCode">获取验证码</span> |
| 614 | <input type="password" id="newPw1" class="long-input" placeholder="新密码"> | 614 | <input type="password" id="newPw1" class="long-input" placeholder="新密码"> |
| 615 | <input type="password" id="newPw2" class="long-input" placeholder="确认密码"> | 615 | <input type="password" id="newPw2" class="long-input" placeholder="确认密码"> |
| 616 | <div style="margin-top: 25px;" id='findReset' class="login-btn">确认</div> | 616 | <div style="margin-top: 25px;" id='findReset' class="login-btn">确认</div> |
| 617 | <p class="login-now" style="margin-top: 30px;text-align: center;color: #3091f2;cursor: pointer;">我想起来了，去登录 ></p> | 617 | <p class="login-now" style="margin-top: 30px;text-align: center;color: #3091f2;cursor: pointer;">我想起来了，去登录 ></p> |
| 618 | </div> | 618 | </div> |
| 619 | </div> | 619 | </div> |
| 620 | </div> | 620 | </div> |
| 621 | </div> | 621 | </div> |
| 622 | </div> | 622 | </div> |
| 623 | <!-- 登录注册 完 --> | 623 | <!-- 登录注册 完 --> |
| 624 | <script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/js/library/jquery.zeroclipboard.min.js"></script> | 624 | <script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/js/library/jquery.zeroclipboard.min.js"></script> |
| 625 | <script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/js/common.js"></script> | 625 | <script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/common/js/common.js"></script> |
| 626 | <script> | 626 | <script> |
| 627 | $(function() { | 627 | $(function() { |
| 628 | var appId = GetQueryString('id'), | 628 | var appId = GetQueryString('id'), |
| 629 | cdnUrl= 'http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend', | 629 | cdnUrl= 'http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend', |
| 630 | _appData = {}; | 630 | _appData = {}; |
| 631 | initialPreview(appId); | 631 | initialPreview(appId); |
| 632 | 632 | ||
| 633 | if(GetQueryString('f_tpl') == 1){ | 633 | if(GetQueryString('f_tpl') == 1){ |
| 634 | $('#nav-component').append('<div class="copy-link-wrap" style="margin-top:15px;"><button class="choose-tpl" style="background-color:#fdcb2e; color:#3f4125; border-color:#fdcb2e; border-bottom:4px solid #e1ab00;">使用模板</button></div>'); | 634 | $('#nav-component').append('<div class="copy-link-wrap" style="margin-top:15px;"><button class="choose-tpl" style="background-color:#fdcb2e; color:#3f4125; border-color:#fdcb2e; border-bottom:4px solid #e1ab00;">使用模板</button></div>'); |
| 635 | } | 635 | } |
| 636 | 636 | ||
| 637 | $('body').on('click', '#group-page-container .group-nav', function(event) { | 637 | $('body').on('click', '#group-page-container .group-nav', function(event) { |
| 638 | // 组折叠 | 638 | // 组折叠 |
| 639 | event.preventDefault(); | 639 | event.preventDefault(); |
| 640 | var target = $(this).parent(); | 640 | var target = $(this).parent(); |
| 641 | target.toggleClass('active'); | 641 | target.toggleClass('active'); |
| 642 | }).on('click', '#group-page-container .page-nav', function(event) { | 642 | }).on('click', '#group-page-container .page-nav', function(event) { |
| 643 | if($(this).hasClass('active')){ | 643 | if($(this).hasClass('active')){ |
| 644 | return; | 644 | return; |
| 645 | } | 645 | } |
| 646 | $('.page-nav.active').removeClass('active'); | 646 | $('.page-nav.active').removeClass('active'); |
| 647 | $(this).addClass('active'); | 647 | $(this).addClass('active'); |
| 648 | 648 | ||
| 649 | var router = $(this).attr('data-router'), | 649 | var router = $(this).attr('data-router'), |
| 650 | $preview = $('#preview-iframe'), | 650 | $preview = $('#preview-iframe'), |
| 651 | url = 'http://jisuapp.cn/app?_app_id='+appId+'&router='+router, | 651 | url = 'http://jisuapp.cn/app?_app_id='+appId+'&router='+router, |
| 652 | historyId = GetQueryString('history_id'), | 652 | historyId = GetQueryString('history_id'), |
| 653 | customFeature = _appData[router].customFeature; | 653 | customFeature = _appData[router].customFeature; |
| 654 | 654 | ||
| 655 | historyId && (url += '&history_id='+historyId); | 655 | historyId && (url += '&history_id='+historyId); |
| 656 | if(customFeature.form){ | 656 | if(customFeature.form){ |
| 657 | url += '&detail=-1'; | 657 | url += '&detail=-1'; |
| 658 | } | 658 | } |
| 659 | $preview.attr('src',url); | 659 | $preview.attr('src',url); |
| 660 | 660 | ||
| 661 | }).on('click', '.choose-tpl', function(){ | 661 | }).on('click', '.choose-tpl', function(){ |
| 662 | if($('body').attr('is_login') == 0){ | 662 | if($('body').attr('is_login') == 0){ |
| 663 | loginFunc(); | 663 | loginFunc(); |
| 664 | $(".lr-mask").show(); | 664 | $(".lr-mask").show(); |
| 665 | return; | 665 | return; |
| 666 | } | 666 | } |
| 667 | var param = { | 667 | var param = { |
| 668 | app_name : '我的应用', | 668 | app_name : '我的应用', |
| 669 | description: '' , | 669 | description: '' , |
| 670 | logo : cdnUrl + '/static/invitation/images/logo.png', | 670 | logo : cdnUrl + '/static/invitation/images/logo.png', |
| 671 | cover: cdnUrl + '/static/webapp/images/share_feng.jpg' , | 671 | cover: cdnUrl + '/static/webapp/images/share_feng.jpg' , |
| 672 | f_app_id : appId | 672 | f_app_id : appId |
| 673 | }, | 673 | }, |
| 674 | $btn = $(this); | 674 | $btn = $(this); |
| 675 | 675 | ||
| 676 | if($btn.hasClass('requesting')) { return; } | 676 | if($btn.hasClass('requesting')) { return; } |
| 677 | $btn.addClass('requesting'); | 677 | $btn.addClass('requesting'); |
| 678 | $ajax('http://jisuapp.cn/index.php?r=pc/AppData/add','post', param,'json',function(data){ | 678 | $ajax('http://jisuapp.cn/index.php?r=pc/AppData/add','post', param,'json',function(data){ |
| 679 | $btn.removeClass('requesting'); | 679 | $btn.removeClass('requesting'); |
| 680 | if (data.status === 0) { | 680 | if (data.status === 0) { |
| 681 | window.location.href = 'http://jisuapp.cn/index.php?r=pc/Webapp/edit&id='+data.data; | 681 | window.location.href = 'http://jisuapp.cn/index.php?r=pc/Webapp/edit&id='+data.data; |
| 682 | } else if (data.status === 3){ | 682 | } else if (data.status === 3){ |
| 683 | confirmTip({ | 683 | confirmTip({ |
| 684 | text : data.data + "<p>是否去升级VIP？</p>", | 684 | text : data.data + "<p>是否去升级VIP？</p>", |
| 685 | ConfirmFunction : function(){ | 685 | ConfirmFunction : function(){ |
| 686 | window.open('http://jisuapp.cn/index.php?r=pc/Index/appVipPacket'); | 686 | window.open('http://jisuapp.cn/index.php?r=pc/Index/appVipPacket'); |
| 687 | } | 687 | } |
| 688 | }); | 688 | }); |
| 689 | } else { | 689 | } else { |
| 690 | alertTip(data.data); | 690 | alertTip(data.data); |
| 691 | } | 691 | } |
| 692 | }, function(data){ | 692 | }, function(data){ |
| 693 | $btn.removeClass('requesting'); | 693 | $btn.removeClass('requesting'); |
| 694 | alertTip(data.data); | 694 | alertTip(data.data); |
| 695 | }); | 695 | }); |
| 696 | }); | 696 | }); |
| 697 | function initialPreview(appId){ | 697 | function initialPreview(appId){ |
| 698 | // 预览时 | 698 | // 预览时 |
| 699 | var $preview = $('#preview-iframe'), | 699 | var $preview = $('#preview-iframe'), |
| 700 | router = GetQueryString('router'), | 700 | router = GetQueryString('router'), |
| 701 | para = { | 701 | para = { |
| 702 | app_id: appId, | 702 | app_id: appId, |
| 703 | history_id: GetQueryString('history_id') || '' | 703 | history_id: GetQueryString('history_id') || '' |
| 704 | }; | 704 | }; |
| 705 | 705 | ||
| 706 | $ajax('http://jisuapp.cn/index.php?r=AppData/detail','get',para,'json',function(data){ | 706 | $ajax('http://jisuapp.cn/index.php?r=AppData/detail','get',para,'json',function(data){ |
| 707 | if (data.status === 0) { | 707 | if (data.status === 0) { |
| 708 | var info = data.data, | 708 | var info = data.data, |
| 709 | _cataData = typeof info.cata_data === 'string' ? JSON.parse(info.cata_data) : info.cata_data; | 709 | _cataData = typeof info.cata_data === 'string' ? JSON.parse(info.cata_data) : info.cata_data; |
| 710 | 710 | ||
| 711 | _appData = typeof info.app_data === 'string' ? JSON.parse(info.app_data) : info.app_data; | 711 | _appData = typeof info.app_data === 'string' ? JSON.parse(info.app_data) : info.app_data; |
| 712 | $('#preview-code').attr('src', info.qrcode); | 712 | $('#preview-code').attr('src', info.qrcode); |
| 713 | $('#app-link').val(info.url); | 713 | $('#app-link').val(info.url); |
| 714 | parseCata(_cataData); | 714 | parseCata(_cataData); |
| 715 | if(!router){ | 715 | if(!router){ |
| 716 | router = _appData.version == 1 ? _appData.data['homepage-router'] : 'page10000'; | 716 | router = _appData.version == 1 ? _appData.data['homepage-router'] : 'page10000'; |
| 717 | } | 717 | } |
| 718 | $('#group-page-container .page-nav[data-router='+router+']').trigger('click'); | 718 | $('#group-page-container .page-nav[data-router='+router+']').trigger('click'); |
| 719 | }else{ | 719 | }else{ |
| 720 | alertTip(data.data); | 720 | alertTip(data.data); |
| 721 | } | 721 | } |
| 722 | 722 | ||
| 723 | }); | 723 | }); |
| 724 | } | 724 | } |
| 725 | function parseCata(_cataData, router){ | 725 | function parseCata(_cataData, router){ |
| 726 | var cataStr = '', | 726 | var cataStr = '', |
| 727 | targetRouter = router || 'page10000', | 727 | targetRouter = router || 'page10000', |
| 728 | cataDataContent = _cataData.data; | 728 | cataDataContent = _cataData.data; |
| 729 | for(var cata in cataDataContent) { | 729 | for(var cata in cataDataContent) { |
| 730 | if(cataDataContent[cata]){ | 730 | if(cataDataContent[cata]){ |
| 731 | var pages = cataDataContent[cata].pages, | 731 | var pages = cataDataContent[cata].pages, |
| 732 | i = 0; | 732 | i = 0; |
| 733 | cataStr += '<li class="group-page-nav active" data-index="'+cataDataContent[cata].index+'"><p class="group-nav">'+cataDataContent[cata].group+'</p><ul class="page-navs">'; | 733 | cataStr += '<li class="group-page-nav active" data-index="'+cataDataContent[cata].index+'"><p class="group-nav">'+cataDataContent[cata].group+'</p><ul class="page-navs">'; |
| 734 | for(var item in pages){ | 734 | for(var item in pages){ |
| 735 | i++; | 735 | i++; |
| 736 | cataStr += parsePageNavStr(pages[item].router, pages[item].title, pages[item].name); | 736 | cataStr += parsePageNavStr(pages[item].router, pages[item].title, pages[item].name); |
| 737 | } | 737 | } |
| 738 | if(i<=0){ | 738 | if(i<=0){ |
| 739 | cataStr += '<p class="empty-group-tip">此分组暂无页面</p>'; | 739 | cataStr += '<p class="empty-group-tip">此分组暂无页面</p>'; |
| 740 | } | 740 | } |
| 741 | 741 | ||
| 742 | cataStr += '</ul></li>'; | 742 | cataStr += '</ul></li>'; |
| 743 | } | 743 | } |
| 744 | }; | 744 | }; |
| 745 | $('#group-page-container').empty().append(cataStr); | 745 | $('#group-page-container').empty().append(cataStr); |
| 746 | } | 746 | } |
| 747 | function parsePageNavStr (router, title, name){ | 747 | function parsePageNavStr (router, title, name){ |
| 748 | var str = '<li class="page-nav" data-router="'+router+'" data-title="'+title+'" data-name="'+name+'"><span class="js-page-name">'+name+'</span></li>'; | 748 | var str = '<li class="page-nav" data-router="'+router+'" data-title="'+title+'" data-name="'+name+'"><span class="js-page-name">'+name+'</span></li>'; |
| 749 | return str; | 749 | return str; |
| 750 | } | 750 | } |
| 751 | 751 | ||
| 752 | $("#copy-link").on('copy', function(e){ | 752 | $("#copy-link").on('copy', function(e){ |
| 753 | e.clipboardData.clearData(); | 753 | e.clipboardData.clearData(); |
| 754 | e.clipboardData.setData('text/plain', $('#app-link').val()); | 754 | e.clipboardData.setData('text/plain', $('#app-link').val()); |
| 755 | e.preventDefault(); | 755 | e.preventDefault(); |
| 756 | }).on('aftercopy', function(e){ | 756 | }).on('aftercopy', function(e){ |
| 757 | alertTip('复制成功'); | 757 | alertTip('复制成功'); |
| 758 | }); | 758 | }); |
| 759 | 759 | ||
| 760 | $("#go-back").on('click' , function(event) { | 760 | $("#go-back").on('click' , function(event) { |
| 761 | var $preview = $('#preview-iframe')[0]; | 761 | var $preview = $('#preview-iframe')[0]; |
| 762 | $preview.contentWindow.history.back() | 762 | $preview.contentWindow.history.back() |
| 763 | }); | 763 | }); |
| 764 | 764 | ||
| 765 | $('.tab-item-cata').on('click', function(){ | 765 | $('.tab-item-cata').on('click', function(){ |
| 766 | $(this).addClass('active').siblings().removeClass('active'); | 766 | $(this).addClass('active').siblings().removeClass('active'); |
| 767 | $('#phone-model').css('display', 'none'); | 767 | $('#phone-model').css('display', 'none'); |
| 768 | $('#nav-component').css('display', 'inline-block'); | 768 | $('#nav-component').css('display', 'inline-block'); |
| 769 | }); | 769 | }); |
| 770 | 770 | ||
| 771 | $('.tab-item-phone').on('click', function(){ | 771 | $('.tab-item-phone').on('click', function(){ |
| 772 | $(this).addClass('active').siblings().removeClass('active'); | 772 | $(this).addClass('active').siblings().removeClass('active'); |
| 773 | $('#phone-model').css('display', 'inline-block'); | 773 | $('#phone-model').css('display', 'inline-block'); |
| 774 | $('#nav-component').css('display', 'none'); | 774 | $('#nav-component').css('display', 'none'); |
| 775 | }); | 775 | }); |
| 776 | 776 | ||
| 777 | $('.phone-model-list').on('click', 'li', function(){ | 777 | $('.phone-model-list').on('click', 'li', function(){ |
| 778 | var type = $(this).attr('data-type'), | 778 | var type = $(this).attr('data-type'), |
| 779 | $phone = $('#phone-component'), | 779 | $phone = $('#phone-component'), |
| 780 | $iframe = $phone.find('iframe'); | 780 | $iframe = $phone.find('iframe'); |
| 781 | 781 | ||
| 782 | $(this).addClass('active').siblings('.active').removeClass('active'); | 782 | $(this).addClass('active').siblings('.active').removeClass('active'); |
| 783 | $phone.attr('class', type); | 783 | $phone.attr('class', type); |
| 784 | }); | 784 | }); |
| 785 | }); | 785 | }); |
| 786 | </script> | 786 | </script> |
| 787 | </body> | 787 | </body> |
| 788 | </html> | 788 | </html> |