Commit c4176e46d8820fd649352f510c6e44156b5c9fe7
0 parents
Exists in
master
add file
Showing
11 changed files
with
1958 additions
and
0 deletions
Show diff stats
.gitignore
| File was created | 1 | .idea/ | |
| 2 | run/ | ||
| 3 | *.pyc | ||
| 4 |
handlers/__init__.py
handlers/index.py
| File was created | 1 | # coding: utf-8 | |
| 2 | |||
| 3 | import tornado.web | ||
| 4 | |||
| 5 | class BaseHandler(tornado.web.RequestHandler): | ||
| 6 | |||
| 7 | def __init__(self, *args, **kwargs): | ||
| 8 | super(BaseHandler, self).__init__(*args, **kwargs) | ||
| 9 | x_real_ip = self.request.headers.get("X-Real-IP") | ||
| 10 | self.remote_ip = self.request.remote_ip if not x_real_ip else x_real_ip | ||
| 11 | |||
| 12 | def render(self, template_name, **kwargs): | ||
| 13 | super(BaseHandler, self).render(template_name, **kwargs) | ||
| 14 | |||
| 15 | class IndexHandler(BaseHandler): | ||
| 16 | |||
| 17 | def get(self): | ||
| 18 | return self.render('index.html') | ||
| 19 | |||
| 20 | |||
| 21 | class WebAppHandler(BaseHandler): | ||
| 22 | |||
| 23 | def get(self): | ||
| 24 | return self.render('webapp.html') | ||
| 25 |
log.py
| File was created | 1 | # coding: utf-8 | |
| 2 | |||
| 3 | from os import path | ||
| 4 | import logging.config | ||
| 5 | |||
| 6 | def init_log(log_dir, debug=False): | ||
| 7 | if not path.exists(log_dir): | ||
| 8 | print 'log path is not exist:%s' % log_dir | ||
| 9 | exit(-1) | ||
| 10 | |||
| 11 | config = { | ||
| 12 | 'version': 1, | ||
| 13 | 'disable_existing_loggers': False, | ||
| 14 | 'formatters': { | ||
| 15 | 'default': { | ||
| 16 | 'format': '%(levelname)s %(asctime)s %(module)s:%(funcName)s:%(lineno)d %(message)s' | ||
| 17 | }, | ||
| 18 | 'simple': { | ||
| 19 | 'format': '%(level)s %(message)s' | ||
| 20 | } | ||
| 21 | }, | ||
| 22 | 'handlers': { | ||
| 23 | 'console': { | ||
| 24 | 'level': 'DEBUG', | ||
| 25 | 'class': 'logging.StreamHandler', | ||
| 26 | 'formatter': 'default', | ||
| 27 | }, | ||
| 28 | 'file': { | ||
| 29 | 'level': 'DEBUG', | ||
| 30 | 'class': 'logging.handlers.RotatingFileHandler', | ||
| 31 | 'filename': path.join(log_dir, 'webapp.log'), | ||
| 32 | 'maxBytes': 1024 * 1024 * 50, | ||
| 33 | 'backupCount': 5, | ||
| 34 | 'formatter': 'default', | ||
| 35 | }, | ||
| 36 | }, | ||
| 37 | 'loggers': { | ||
| 38 | 'starmachine': { | ||
| 39 | 'handlers': ['console', 'file'], | ||
| 40 | 'level': 'DEBUG', | ||
| 41 | 'propagate': False, | ||
| 42 | }, | ||
| 43 | } | ||
| 44 | } | ||
| 45 | |||
| 46 | logging.config.dictConfig(config) | ||
| 47 |
server.py
| File was created | 1 | # coding: utf-8 | |
| 2 | |||
| 3 | import os | ||
| 4 | import tornado.ioloop | ||
| 5 | import tornado.autoreload | ||
| 6 | import tornado.web | ||
| 7 | from tornado.options import define, options, parse_command_line | ||
| 8 | import settings | ||
| 9 | from log import init_log | ||
| 10 | |||
| 11 | |||
| 12 | def init_settings(): | ||
| 13 | # 加载环境配置项 | ||
| 14 | define('port', default=8080, type=int, help=u'监听端口') | ||
| 15 | define("log_dir", default='run', type=str, help=u'日志目录') | ||
| 16 | define('profile', default='local', type=str, help=u'运行配置') | ||
| 17 | |||
| 18 | parse_command_line() | ||
| 19 | init_log(options.log_dir) | ||
| 20 | return options | ||
| 21 | |||
| 22 | def start_application(): | ||
| 23 | from url import urls | ||
| 24 | log_dir = os.path.join(os.path.dirname(__file__), 'run') | ||
| 25 | application_settings = { | ||
| 26 | 'handlers': urls, | ||
| 27 | 'debug': settings.DEBUG, | ||
| 28 | 'template_path': os.path.join(os.path.dirname(__file__), 'templates'), | ||
| 29 | 'static_path': os.path.join(os.path.dirname(__file__), 'static'), | ||
| 30 | } | ||
| 31 | application = tornado.web.Application(**application_settings) | ||
| 32 | |||
| 33 | print 'server on port %s' % settings.PORT | ||
| 34 | print 'server log on %s' % log_dir | ||
| 35 | |||
| 36 | application.listen(settings.PORT) | ||
| 37 | io_loop = tornado.ioloop.IOLoop.instance() | ||
| 38 | |||
| 39 | io_loop.start() | ||
| 40 | |||
| 41 | def run(): | ||
| 42 | init_settings() | ||
| 43 | start_application() | ||
| 44 | |||
| 45 | if __name__ == '__main__': | ||
| 46 | run() |
settings.py
| File was created | 1 | # coding: utf-8 | |
| 2 | |||
| 3 | DEBUG = True | ||
| 4 | PORT = 8080 |
static/img/banner.png
20.2 KB
static/js/tpl.js
| File was created | 1 | $(function(){ | |
| 2 | // 轮播图 | ||
| 3 | var mySwiper = new Swiper ('.swiper-container', { | ||
| 4 | direction: 'horizontal', | ||
| 5 | loop: true, | ||
| 6 | // 如果需要分页器 | ||
| 7 | pagination: '.swiper-pagination', | ||
| 8 | // 如果需要前进后退按钮 | ||
| 9 | nextButton: '.swiper-button-next', | ||
| 10 | prevButton: '.swiper-button-prev' | ||
| 11 | }); | ||
| 12 | $(".banner-wrap").height(window.innerWidth * 430 / 2732); | ||
| 13 | var pages = [1], | ||
| 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}' | ||
| 16 | + '</p><div class="code-mask"><img class="code" src="${qrcode}" alt="">' | ||
| 17 | + '<span class="select-btn js-preview-btn">预览</span>${copy}</div></li> ', | ||
| 18 | _cataData = {}, | ||
| 19 | _appData = {}, | ||
| 20 | cdnUrl="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend"; | ||
| 21 | getCategory(); | ||
| 22 | $('body').on('click', '#first-navs span', function(event) { | ||
| 23 | if($(this).hasClass('active')){ | ||
| 24 | return; | ||
| 25 | } | ||
| 26 | var cate = $(this).attr("data-cate"), | ||
| 27 | index = $(this).index(); | ||
| 28 | |||
| 29 | $(this).addClass('active').siblings('.active').removeClass('active'); | ||
| 30 | $(".tpl-content").eq(index).addClass('active').siblings('.active').removeClass('active'); | ||
| 31 | if($(this).hasClass('js-uninitial')){ | ||
| 32 | $(this).removeClass('js-uninitial'); | ||
| 33 | if ($('.tpl-content.active .tpl-container').hasClass('js-requesting')) { | ||
| 34 | return; | ||
| 35 | }; | ||
| 36 | $('.tpl-content.active .tpl-container').addClass('js-requesting'); | ||
| 37 | getTpls(cate, index); | ||
| 38 | } | ||
| 39 | }).on('click','.tpl-sec-navs span' ,function(event) { | ||
| 40 | if($(this).hasClass('active')){ | ||
| 41 | return; | ||
| 42 | } | ||
| 43 | var cate = $(this).attr("data-cate"), | ||
| 44 | index = $("#first-navs .active").index(); | ||
| 45 | |||
| 46 | $(this).addClass('active').siblings('.active').removeClass('active'); | ||
| 47 | pages[index] = 1; | ||
| 48 | $(".tpl-container").removeClass('js-no-more').eq(index).find('.js-tpl').remove(); | ||
| 49 | getTpls(cate, index); | ||
| 50 | }).on('click', '.choose-btn', function(event) { | ||
| 51 | // var appId = $(this).parent().parent().attr('data-id'); | ||
| 52 | // if($(this).hasClass('js-preview-btn')){ | ||
| 53 | // initialPreview(appId); | ||
| 54 | // $('#preview-tpl-dialog').show('slow'); | ||
| 55 | // $('#add-app-dialog').attr('data-id', appId).attr('data-color', ''); | ||
| 56 | // }else{ | ||
| 57 | // $('#add-app-dialog').attr('data-id', appId).attr('data-color', '').show('slow'); | ||
| 58 | // } | ||
| 59 | |||
| 60 | var $li = $(this).closest('li'), | ||
| 61 | param = { | ||
| 62 | app_name : $li.children('.name').text(), | ||
| 63 | description: '' , | ||
| 64 | logo : cdnUrl + '/static/invitation/images/logo.png', | ||
| 65 | cover: cdnUrl + '/static/webapp/images/share_feng.jpg' , | ||
| 66 | f_app_id : $li.attr("data-id") | ||
| 67 | }; | ||
| 68 | addApp($(this) , param); | ||
| 69 | event.stopPropagation(); | ||
| 70 | }).on('click', '.code-mask', function(event) { | ||
| 71 | var appId = $(this).closest('li').attr('data-id'); | ||
| 72 | window.open('/webapp/?r=pc/Webapp/preview&id=' + appId +'&f_tpl=1'); | ||
| 73 | }).on('click', '.empty-tpl', function(event) { | ||
| 74 | // var appId = $(this).attr('data-id'); | ||
| 75 | // $('#add-app-dialog').attr('data-id', appId).attr('data-color', '').show('slow'); | ||
| 76 | var $li = $(this).closest('li'), | ||
| 77 | param = { | ||
| 78 | app_name : '我的应用', | ||
| 79 | description: '', | ||
| 80 | logo : cdnUrl + '/static/invitation/images/logo.png', | ||
| 81 | cover: cdnUrl + '/static/webapp/images/share_feng.jpg' | ||
| 82 | }; | ||
| 83 | addApp($(this) , param); | ||
| 84 | }) | ||
| 85 | |||
| 86 | |||
| 87 | function getCategory(){ | ||
| 88 | $ajax('/index.php?r=pc/AppData/AppCategoryList','get',{type : 0},'json', | ||
| 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 | |||
| 132 | function getTpls(cate, index){ | ||
| 133 | var $container = $('.tpl-container').eq(index), | ||
| 134 | param = {type: 0, page: pages[index], page_size: 20}; | ||
| 135 | |||
| 136 | if(cate == -1){ | ||
| 137 | param.user = 1; | ||
| 138 | }else{ | ||
| 139 | param.cate_id = cate; | ||
| 140 | } | ||
| 141 | $ajax('/index.php?r=pc/AppData/AppTplList','get',param,'json', | ||
| 142 | function(data){ | ||
| 143 | if (data.status === 0) { | ||
| 144 | var tpls = data.data; | ||
| 145 | tpls.length && dealData(tpls, $container, index); | ||
| 146 | |||
| 147 | pages[index]++; | ||
| 148 | if(data.is_more == 0){ | ||
| 149 | $container.addClass('js-no-more'); | ||
| 150 | } | ||
| 151 | }else{ | ||
| 152 | alertTip(data.data); | ||
| 153 | } | ||
| 154 | $container.removeClass('js-requesting'); | ||
| 155 | }, | ||
| 156 | function(data){ | ||
| 157 | alertTip(data.tpls); | ||
| 158 | $container.removeClass('js-requesting') | ||
| 159 | }); | ||
| 160 | } | ||
| 161 | |||
| 162 | function dealData(tpls, $container, index){ | ||
| 163 | $container.find('.filler').remove(); | ||
| 164 | |||
| 165 | var content = '', | ||
| 166 | addAmount = tpls.length, | ||
| 167 | curAmount = $container.find('.js-tpl').length, | ||
| 168 | temp = (addAmount+curAmount)%col, | ||
| 169 | fillerAmount = ( temp ? col : 0 ), // 需要增加的filler个数 | ||
| 170 | shadowLis = ''; | ||
| 171 | |||
| 172 | $.each(tpls, function(i, item){ | ||
| 173 | content += ' ' + parseTemplate(item, index); | ||
| 174 | }); | ||
| 175 | for(var i=0; i<fillerAmount; i++){ | ||
| 176 | shadowLis += ' <li class="filler"> </li>'; | ||
| 177 | } | ||
| 178 | content += shadowLis; | ||
| 179 | |||
| 180 | $container.append(content); | ||
| 181 | } | ||
| 182 | |||
| 183 | // 拼接请求到的数据内容 | ||
| 184 | function parseTemplate(data , index){ | ||
| 185 | var html = _template.replace(/\$\{(\w+)\}/g, function($0, $1){ | ||
| 186 | switch($1){ | ||
| 187 | case 'copy': | ||
| 188 | // if(index==0){ | ||
| 189 | // return '<span class="select-btn choose-btn">复制</span>'; | ||
| 190 | // }else{ | ||
| 191 | return '<span class="select-btn choose-btn">选择</span>'; | ||
| 192 | // } | ||
| 193 | |||
| 194 | default : | ||
| 195 | return data[$1]; | ||
| 196 | } | ||
| 197 | }); | ||
| 198 | return html; | ||
| 199 | } | ||
| 200 | |||
| 201 | |||
| 202 | // .on('click', '#group-page-container .group-nav', function(event) { | ||
| 203 | // // 组折叠 | ||
| 204 | // event.preventDefault(); | ||
| 205 | // var target = $(this).parent(); | ||
| 206 | // target.toggleClass('active'); | ||
| 207 | // }).on('click', '#group-page-container .page-nav', function(event) { | ||
| 208 | // if($(this).hasClass('active')){ | ||
| 209 | // return; | ||
| 210 | // } | ||
| 211 | // $('.page-nav.active').removeClass('active'); | ||
| 212 | // $(this).addClass('active'); | ||
| 213 | |||
| 214 | // var router = $(this).attr('data-router'), | ||
| 215 | // $preview = $('#preview-iframe'), | ||
| 216 | // url = '/app?_app_id='+$('#add-app-dialog').attr('data-id')+'&router='+router, | ||
| 217 | // customFeature = _appData[router].customFeature; | ||
| 218 | |||
| 219 | // if(customFeature.form){ | ||
| 220 | // url += '&detail=-1'; | ||
| 221 | // } | ||
| 222 | // $preview.attr('src',url); | ||
| 223 | // }).on('click', '.style-color-wrap li', function(event) { | ||
| 224 | // $(this).addClass('selected').siblings('.selected').removeClass('selected'); | ||
| 225 | // setColor($(this).attr('data-color')); | ||
| 226 | // }).on('click', '.zhichi-dialog .js-btn', function(event) { | ||
| 227 | // var type = $(this).attr('data-type'); | ||
| 228 | // switch (type){ | ||
| 229 | // case 'next': | ||
| 230 | // // $('#preview-tpl-dialog').hide(); | ||
| 231 | // $('#add-app-dialog').show(); | ||
| 232 | // break; | ||
| 233 | // case 'add': | ||
| 234 | // addApp($(this)); | ||
| 235 | // break; | ||
| 236 | // case 'cancel': | ||
| 237 | // $('#add-app-dialog').hide('slow'); | ||
| 238 | // break; | ||
| 239 | // } | ||
| 240 | // }).on('click', '.change-img-wrap', function(event) { | ||
| 241 | // // 初始化 打开我的图片 | ||
| 242 | // showImgResourceBox($(this).find('img')); | ||
| 243 | // }).on('click', '.style-palette li', function(event) { | ||
| 244 | // if(confirm('您确定要更换应用的风格颜色吗？此操作会影响该应用所有的顶部导航/底部导航/按钮/分类/标题/分割线。')){ | ||
| 245 | // color = $(this).attr('data-color'); | ||
| 246 | // me.savePage(); | ||
| 247 | // me.setStyleColor(); | ||
| 248 | // me.parsePage($('#group-page-container .page-nav.active').attr('data-router')); | ||
| 249 | // me.sthChange(); | ||
| 250 | // }else{ | ||
| 251 | // return false; | ||
| 252 | // } | ||
| 253 | // }); | ||
| 254 | // | ||
| 255 | $(window).scroll(function(event) { | ||
| 256 | var $content = $('.tpl-content.active'), | ||
| 257 | $container = $content.find('.tpl-container'); | ||
| 258 | if ($container.hasClass('js-requesting') || $container.hasClass('js-no-more')) { | ||
| 259 | return; | ||
| 260 | } | ||
| 261 | var scTop = $(this).scrollTop() + 50, | ||
| 262 | scheight = $(document).height() - $(this).height(); | ||
| 263 | if(scTop >= scheight){ | ||
| 264 | var index = $('#first-navs > .active').index(), | ||
| 265 | cate = $content.find('.tpl-sec-navs .active').attr('data-cate') || $('#first-navs > .active').attr('data-cate'); | ||
| 266 | $container.addClass('js-requesting'); | ||
| 267 | getTpls(cate, index); | ||
| 268 | } | ||
| 269 | }); | ||
| 270 | |||
| 271 | // $('#preview-tpl-dialog').zDialog({ | ||
| 272 | // width: 720, | ||
| 273 | // height: 620, | ||
| 274 | // title: 'APP模板预览' | ||
| 275 | // }); | ||
| 276 | |||
| 277 | // $('#add-app-dialog').zDialog({ | ||
| 278 | // width: 400, | ||
| 279 | // height: 403, | ||
| 280 | // title: '创建APP' | ||
| 281 | // }); | ||
| 282 | |||
| 283 | $('#select-color-control').spectrum({ | ||
| 284 | chooseText: '确定', | ||
| 285 | cancelText: '取消', | ||
| 286 | showInput: true, | ||
| 287 | allowEmpty:false, | ||
| 288 | containerClassName: 'full-spectrum', | ||
| 289 | showInitial: true, | ||
| 290 | showPalette: false, | ||
| 291 | showSelectionPalette: false, | ||
| 292 | showAlpha: true, | ||
| 293 | maxPaletteSize: 10, | ||
| 294 | preferredFormat: 'hex', | ||
| 295 | localStorageKey: 'spectrum.demo', | ||
| 296 | change: function(color){ | ||
| 297 | setColor(color); | ||
| 298 | } | ||
| 299 | }); | ||
| 300 | |||
| 301 | function setColor(color){ | ||
| 302 | var _color = new String(color), | ||
| 303 | appId = $('#add-app-dialog').attr('data-id'); | ||
| 304 | $('#add-app-dialog').attr('data-color', _color); | ||
| 305 | $('#preview-iframe').attr('src', '/app?_app_id='+appId+'&style_color='+encodeURIComponent(_color)); | ||
| 306 | } | ||
| 307 | |||
| 308 | function initialPreview(appId){ | ||
| 309 | // 预览时 | ||
| 310 | var $preview = $('#preview-iframe'); | ||
| 311 | $preview.attr('src', '/app?_app_id='+appId); | ||
| 312 | |||
| 313 | $ajax('/index.php?r=pc/AppData/detail','get',{app_id: appId},'json',function(data){ | ||
| 314 | if (data.status === 0) { | ||
| 315 | var info = data.data; | ||
| 316 | |||
| 317 | _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; | ||
| 319 | |||
| 320 | parseCata(); | ||
| 321 | }else{ | ||
| 322 | alertTip(data.data); | ||
| 323 | } | ||
| 324 | |||
| 325 | }); | ||
| 326 | } | ||
| 327 | function parseCata(router){ | ||
| 328 | var cataStr = '', | ||
| 329 | targetRouter = router || 'page00', | ||
| 330 | cataDataContent = _cataData.data; | ||
| 331 | for(var cata in cataDataContent) { | ||
| 332 | if(cataDataContent[cata]){ | ||
| 333 | var pages = cataDataContent[cata].pages, | ||
| 334 | 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">'; | ||
| 336 | for(var item in pages){ | ||
| 337 | i++; | ||
| 338 | cataStr += parsePageNavStr(pages[item].router, pages[item].title, pages[item].name); | ||
| 339 | } | ||
| 340 | if(i<=0){ | ||
| 341 | cataStr += '<p class="empty-group-tip">此分组暂无页面</p>'; | ||
| 342 | } | ||
| 343 | |||
| 344 | cataStr += '</ul></li>'; | ||
| 345 | } | ||
| 346 | }; | ||
| 347 | $('#group-page-container').empty().append(cataStr); | ||
| 348 | $('#group-page-container .page-nav[data-router="'+targetRouter+'"]').addClass('active'); | ||
| 349 | } | ||
| 350 | 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>'; | ||
| 352 | return str; | ||
| 353 | } | ||
| 354 | |||
| 355 | function addApp($btn , param){ | ||
| 356 | if($btn.hasClass('requesting')){ | ||
| 357 | return; | ||
| 358 | } | ||
| 359 | // var name = $('#app-name').val(), | ||
| 360 | // description = $('#app-description').val(), | ||
| 361 | // logo = $('#app-logo').attr('src'), | ||
| 362 | // cover = $('#app-cover').attr('src'); | ||
| 363 | |||
| 364 | // if(name.length<=0){ | ||
| 365 | // alertTip('请输入应用名'); | ||
| 366 | // $('#app-name').focus(); | ||
| 367 | // return; | ||
| 368 | // } | ||
| 369 | |||
| 370 | // if(description.length<=0){ | ||
| 371 | // alertTip('请输入应用描述'); | ||
| 372 | // $('#app-description').focus(); | ||
| 373 | // return; | ||
| 374 | // } | ||
| 375 | // if(logo===cdnUrl+'/static/invitation/images/logo.png'){ | ||
| 376 | // alertTip('请上传logo'); | ||
| 377 | // return; | ||
| 378 | // } | ||
| 379 | // if(cover===cdnUrl+'/static/webapp/images/share_feng.jpg'){ | ||
| 380 | // alertTip('请上传封面'); | ||
| 381 | // return; | ||
| 382 | // } | ||
| 383 | |||
| 384 | // var appId = $('#add-app-dialog').attr('data-id'), | ||
| 385 | // color = $('#add-app-dialog').attr('data-color'), | ||
| 386 | // param = { | ||
| 387 | // app_name : name, | ||
| 388 | // description: description, | ||
| 389 | // logo : logo, | ||
| 390 | // cover: cover, | ||
| 391 | // style_color: color | ||
| 392 | // }; | ||
| 393 | |||
| 394 | // if(appId!='-1'){ | ||
| 395 | // // appId=='-1'的话 表示没有选择模版 | ||
| 396 | // param.f_app_id = appId; | ||
| 397 | // } | ||
| 398 | // if(color){ | ||
| 399 | // // 预览模版，有选择风格颜色并确定使用该模版时，需要把app里相关的组件变化做处理，并把修改后的app_data发给后台保存 | ||
| 400 | // setAppData(color); | ||
| 401 | // param.app_data = JSON.stringify(_appData); | ||
| 402 | // } | ||
| 403 | |||
| 404 | $btn.addClass('requesting'); | ||
| 405 | $ajax('/index.php?r=pc/AppData/add','post', param,'json',function(data){ | ||
| 406 | $btn.removeClass('requesting'); | ||
| 407 | if (data.status === 0) { | ||
| 408 | window.location.href = '/index.php?r=pc/Webapp/edit&id='+data.data; | ||
| 409 | }else if (data.status === 2) { | ||
| 410 | loginFunc(); | ||
| 411 | $('.lr-mask').show('slow'); | ||
| 412 | } else if (data.status === 3){ | ||
| 413 | confirmTip({ | ||
| 414 | text : data.data, | ||
| 415 | ConfirmText:'立即升级', | ||
| 416 | CancelText: '暂不升级', | ||
| 417 | ConfirmFunction : function(){ | ||
| 418 | window.open('/index.php?r=pc/Index/appVipPacket'); | ||
| 419 | }, | ||
| 420 | CancelFunction : function(){ | ||
| 421 | |||
| 422 | }, | ||
| 423 | CloseFunction : function(){ | ||
| 424 | |||
| 425 | } | ||
| 426 | }) | ||
| 427 | } else { | ||
| 428 | alertTip(data.data); | ||
| 429 | } | ||
| 430 | }, | ||
| 431 | function(data){ | ||
| 432 | $btn.removeClass('requesting'); | ||
| 433 | alertTip(data.data); | ||
| 434 | }); | ||
| 435 | } | ||
| 436 | |||
| 437 | function setAppData(color){ | ||
| 438 | for(var router in _appData){ | ||
| 439 | var eles = _appData[router].eles; | ||
| 440 | setAppEles(eles, color); | ||
| 441 | } | ||
| 442 | } | ||
| 443 | function setAppEles(eles, color){ | ||
| 444 | $(eles).each(function(index, ele) { | ||
| 445 | switch(ele.type){ | ||
| 446 | case 'top-nav': | ||
| 447 | case 'bottom-nav': | ||
| 448 | case 'button': | ||
| 449 | ele.style = ele.style || {}; | ||
| 450 | ele.style['background-color'] = color; | ||
| 451 | break; | ||
| 452 | case 'classify': | ||
| 453 | ele.customFeature = ele.customFeature || {}; | ||
| 454 | ele.customFeature['selectedColor'] = color; | ||
| 455 | break; | ||
| 456 | case 'breakline': | ||
| 457 | ele.style = ele.style || {}; | ||
| 458 | ele.style['border-color'] = color; | ||
| 459 | break; | ||
| 460 | case 'title-ele': | ||
| 461 | ele.customFeature = ele.customFeature || {}; | ||
| 462 | ele.customFeature['markColor'] = color; | ||
| 463 | break; | ||
| 464 | case 'static-vessel': | ||
| 465 | case 'free-vessel': | ||
| 466 | case 'list-vessel': | ||
| 467 | case 'dynamic-vessel': | ||
| 468 | case 'form-vessel': | ||
| 469 | setAppEles(ele.content, color); | ||
| 470 | break; | ||
| 471 | case 'layout-vessel': | ||
| 472 | setAppEles(ele.content.leftEles, color); | ||
| 473 | setAppEles(ele.content.rightEles, color); | ||
| 474 | break; | ||
| 475 | } | ||
| 476 | }); | ||
| 477 | } | ||
| 478 | |||
| 479 | $("#add-label-span").on('click', function(event) { | ||
| 480 | $("#add-label").show(); | ||
| 481 | }); | ||
| 482 | $("#add-label").on('click', '.labelClose', function(event) { | ||
| 483 | $("#add-label").hide(); | ||
| 484 | }); | ||
| 485 | |||
| 486 | }); |
templates/index.html
| File was created | 1 | ||
| 2 | <!DOCTYPE html> | ||
| 3 | <html lang="zh-CN"> | ||
| 4 | <head> | ||
| 5 | <title>小程序开发联盟</title> | ||
| 6 | <meta name="renderer" content="webkit"> | ||
| 7 | <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" > | ||
| 8 | <meta charset="UTF-8" name="description" 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"> | ||
| 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"> | ||
| 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"> | ||
| 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"> | ||
| 17 | <script src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/js/library/jquery-2.1.4.min.js"></script> | ||
| 18 | </head> | ||
| 19 | <body class="webapp" is_login="0"> | ||
| 20 | <!-- 导航 --> | ||
| 21 | |||
| 22 | <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 | |||
| 25 | <div class="nav-wrap"> | ||
| 26 | <div class="nav-logo"> | ||
| 27 | <a href="/index.php?r=pc/index/AppHome"> | ||
| 28 | <img src="http://1251027630.cdn.myqcloud.com/1251027630/ | ||
| 29 | zhichi_frontend/static/pc/index/img/nav_logo.png" alt=""> | ||
| 30 | 秀野堂</a> | ||
| 31 | </div> | ||
| 32 | <ul class="top-menu"> | ||
| 33 | <li class="menu-one"> | ||
| 34 | <a target="_blank">微信小程序</a> | ||
| 35 | </li> | ||
| 36 | <li class="menu-one"> | ||
| 37 | <a target="_blank">Home</a> | ||
| 38 | </li> | ||
| 39 | <li class="menu-one"> | ||
| 40 | <a>发现</a> | ||
| 41 | </li> | ||
| 42 | <li class="menu-one"> | ||
| 43 | <a href="/index.php?r=pc/Webapp/exclusive" target='_blank'>私塾</a> | ||
| 44 | </li> | ||
| 45 | <li class="menu-one"> | ||
| 46 | <a href="/index.php?r=pc/Webapp/AppTpl">我要定制</a> | ||
| 47 | </li> | ||
| 48 | </ul> | ||
| 49 | </div> | ||
| 50 | <!-- 导航 end --> | ||
| 51 | <!-- banner --> | ||
| 52 | <div class="banner-wrap"> | ||
| 53 | <div class="swiper-container"> | ||
| 54 | <img src="/static/img/banner.png/" style="width:100%;"/> | ||
| 55 | </div> | ||
| 56 | </div> | ||
| 57 | <!-- banner end --> | ||
| 58 | <!-- 预览 --> | ||
| 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/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/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/webapp/js/tpl.js"></script>--> | ||
| 65 | <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 | <style rel="stylesheet"> | ||
| 68 | .webapp-box { | ||
| 69 | position: fixed; | ||
| 70 | -webkit-transform: translateX(-10000px); | ||
| 71 | -moz-transform: translateX(-10000px); | ||
| 72 | transform: translateX(-10000px); | ||
| 73 | z-index: 1001; | ||
| 74 | left: 50%; | ||
| 75 | top: 10%; | ||
| 76 | width: 603px; | ||
| 77 | min-height: 460px; | ||
| 78 | margin-left: -300px; | ||
| 79 | padding-bottom: 15px; | ||
| 80 | border: 1px solid #DDD; | ||
| 81 | border-radius: 10px; | ||
| 82 | box-shadow: 5px 5px 20px rgba(0,0,0,.4),-5px -5px 20px rgba(0,0,0,.4); | ||
| 83 | background: #FFF; | ||
| 84 | } | ||
| 85 | .webapp-box input[type=file]:focus, .webapp-box input[type=checkbox]:focus, .webapp-box input[type=radio]:focus { | ||
| 86 | outline: none; | ||
| 87 | } | ||
| 88 | |||
| 89 | |||
| 90 | .webapp-box-header { | ||
| 91 | /* position: absolute; | ||
| 92 | top: 0; | ||
| 93 | left: 0; | ||
| 94 | z-index: 2;*/ | ||
| 95 | width: 100%; | ||
| 96 | height: 45px; | ||
| 97 | background: #FFF; | ||
| 98 | border-bottom: 1px solid #e5e5e5; | ||
| 99 | border-radius: 10px 10px 0 0; | ||
| 100 | } | ||
| 101 | .webapp-box-header-ul { | ||
| 102 | margin: 12px 0 0 10px; | ||
| 103 | padding: 0; | ||
| 104 | font-size: 0; | ||
| 105 | text-align: center; | ||
| 106 | } | ||
| 107 | .webapp-box-header-ul li { | ||
| 108 | display: inline-block; | ||
| 109 | padding: 5px 16px; | ||
| 110 | cursor: pointer; | ||
| 111 | font-size: 14px; | ||
| 112 | border-top: 1px solid #ddd; | ||
| 113 | border-bottom: 1px solid #ddd; | ||
| 114 | } | ||
| 115 | .webapp-box-header-ul li:first-child { | ||
| 116 | border-top-left-radius: 5px; | ||
| 117 | border-bottom-left-radius: 5px; | ||
| 118 | border-left: 1px solid #ddd; | ||
| 119 | } | ||
| 120 | .webapp-box-header-ul li:last-child { | ||
| 121 | border-top-right-radius: 5px; | ||
| 122 | border-bottom-right-radius: 5px; | ||
| 123 | border-right: 1px solid #ddd; | ||
| 124 | } | ||
| 125 | .webapp-box-header-ul li.active { | ||
| 126 | background: #00a3e9; | ||
| 127 | color: #FFF; | ||
| 128 | } | ||
| 129 | .webapp-box-close { | ||
| 130 | position: absolute; | ||
| 131 | top: 15px; | ||
| 132 | right: 20px; | ||
| 133 | cursor: pointer; | ||
| 134 | font-size: 2.1rem; | ||
| 135 | font-weight: bold; | ||
| 136 | line-height: 1; | ||
| 137 | color: #000; | ||
| 138 | text-shadow: 0 1px 0 #fff; | ||
| 139 | opacity: .2; | ||
| 140 | } | ||
| 141 | .webapp-box-content { | ||
| 142 | /*position: relative;*/ | ||
| 143 | /*box-sizing: border-box;*/ | ||
| 144 | /*padding: 55px 0 50px;*/ | ||
| 145 | width: 100%; | ||
| 146 | /*height: 100%;*/ | ||
| 147 | background: #FFF; | ||
| 148 | border-radius: 15px; | ||
| 149 | } | ||
| 150 | .box-hide { | ||
| 151 | display: none; | ||
| 152 | } | ||
| 153 | .webapp-box-content .box-resource-content { | ||
| 154 | display: none; | ||
| 155 | } | ||
| 156 | .webapp-box-content .webapp-content-tab { | ||
| 157 | padding-left: 10px; | ||
| 158 | margin: 0; | ||
| 159 | max-height: 140px; | ||
| 160 | overflow-y: auto; | ||
| 161 | } | ||
| 162 | .webapp-box-content .webapp-content-tab li { | ||
| 163 | display: inline-block; | ||
| 164 | padding: 5px 14px; | ||
| 165 | margin: 5px 0; | ||
| 166 | cursor: pointer; | ||
| 167 | } | ||
| 168 | .webapp-box-content .webapp-content-tab li.active { | ||
| 169 | border-radius: 6px; | ||
| 170 | background: #00a3e9; | ||
| 171 | color: #FFF; | ||
| 172 | } | ||
| 173 | .webapp-box-content .content-top-operation { | ||
| 174 | /* position: absolute; | ||
| 175 | bottom: 49px; | ||
| 176 | left: 0; | ||
| 177 | right: 0;*/ | ||
| 178 | background: #f7f7f7; | ||
| 179 | padding: 8px; | ||
| 180 | } | ||
| 181 | .webapp-box-content .content-top-operation ul { | ||
| 182 | margin: 0; | ||
| 183 | padding: 0; | ||
| 184 | } | ||
| 185 | .content-top-operation .box-operation-menu li { | ||
| 186 | margin-right: 5px; | ||
| 187 | } | ||
| 188 | #webapp-img-box .resource-list-wrap { | ||
| 189 | /* position: absolute; | ||
| 190 | top: 100px; | ||
| 191 | bottom: 100px; | ||
| 192 | left: 0; | ||
| 193 | right: 0;*/ | ||
| 194 | display: none; | ||
| 195 | height: 290px; | ||
| 196 | /*width: 100%;*/ | ||
| 197 | padding-left: 15px; | ||
| 198 | padding-top: 8px; | ||
| 199 | overflow-x: hidden; | ||
| 200 | overflow-y: auto; | ||
| 201 | } | ||
| 202 | #webapp-img-box .resource-list li { | ||
| 203 | display: inline-block; | ||
| 204 | margin: 0 15px 15px 0; | ||
| 205 | position: relative; | ||
| 206 | border: 1px solid transparent; | ||
| 207 | } | ||
| 208 | #webapp-img-box .resource-list li:hover, | ||
| 209 | #webapp-img-box .resource-list li.selected { | ||
| 210 | border-color: #ccc; | ||
| 211 | } | ||
| 212 | #webapp-img-box .resource-list li:hover { | ||
| 213 | background-color: #ddd; | ||
| 214 | } | ||
| 215 | #webapp-img-box .resource-list li.selected:after { | ||
| 216 | position: absolute; | ||
| 217 | right: -12px; | ||
| 218 | top: -10px; | ||
| 219 | display: block; | ||
| 220 | width: 24px; | ||
| 221 | height: 24px; | ||
| 222 | content: '√'; | ||
| 223 | color: #fff; | ||
| 224 | font-family: "微软雅黑"; | ||
| 225 | line-height: 22px; | ||
| 226 | text-align: center; | ||
| 227 | border: 2px solid #fff; | ||
| 228 | background: #6abb03; | ||
| 229 | border-radius: 50%; | ||
| 230 | } | ||
| 231 | /*.webapp-box-content .resource-list .img-title { | ||
| 232 | width: 72px; | ||
| 233 | height: 24px; | ||
| 234 | line-height: 24px; | ||
| 235 | margin: 0; | ||
| 236 | font-size: 12px; | ||
| 237 | white-space: nowrap; | ||
| 238 | overflow: hidden; | ||
| 239 | text-overflow: ellipsis; | ||
| 240 | }*/ | ||
| 241 | #webapp-img-box .resource-list .img-operate { | ||
| 242 | display: none; | ||
| 243 | position: absolute; | ||
| 244 | left: 0; | ||
| 245 | right: 0; | ||
| 246 | bottom: 0; | ||
| 247 | z-index: 1; | ||
| 248 | } | ||
| 249 | #webapp-my-img .resource-list li:hover .img-operate, | ||
| 250 | body[data-admin="1"] #webapp-system-img li:hover .img-operate, | ||
| 251 | body[admin="1"] #webapp-system-img li:hover .img-operate { | ||
| 252 | display: block; | ||
| 253 | } | ||
| 254 | #webapp-img-box .resource-list .img-operate a { | ||
| 255 | display: table-cell; | ||
| 256 | width: 1%; | ||
| 257 | padding: 2px; | ||
| 258 | text-align: center; | ||
| 259 | color: #fff; | ||
| 260 | font-size: 12px; | ||
| 261 | text-decoration: none; | ||
| 262 | background-color: rgba(0,0,0,.5); | ||
| 263 | } | ||
| 264 | #webapp-img-box .resource-list .img-operate a:hover { | ||
| 265 | background-color: rgba(0,0,0,.8); | ||
| 266 | } | ||
| 267 | #webapp-img-box .resource-list .progress-mask { | ||
| 268 | position: absolute; | ||
| 269 | top: 0; | ||
| 270 | left: 0; | ||
| 271 | right: 0; | ||
| 272 | bottom: 0; | ||
| 273 | background-color: rgba(0,0,0,.8); | ||
| 274 | z-index: 2; | ||
| 275 | padding-top: 30px; | ||
| 276 | color: #fff; | ||
| 277 | text-align: center; | ||
| 278 | font-size: 16px; | ||
| 279 | } | ||
| 280 | #webapp-img-box .resource-list .upload-fail-tip { | ||
| 281 | display: none; | ||
| 282 | } | ||
| 283 | .webuploader-container { | ||
| 284 | position: relative; | ||
| 285 | } | ||
| 286 | .webapp-box-footer { | ||
| 287 | position: absolute; | ||
| 288 | bottom: 0; | ||
| 289 | left: 0; | ||
| 290 | right: 0; | ||
| 291 | height: 50px; | ||
| 292 | line-height: 40px; | ||
| 293 | padding-right: 30px; | ||
| 294 | border-radius: 0 0 10px 10px; | ||
| 295 | background: #FFF; | ||
| 296 | border-top: 1px solid #e5e5e5; | ||
| 297 | z-index: 2; | ||
| 298 | font-size: 12px; | ||
| 299 | } | ||
| 300 | #img-crop-box .webapp-box-footer { | ||
| 301 | text-align: right; | ||
| 302 | } | ||
| 303 | .webapp-box .webuploader-pick { | ||
| 304 | font-size: inherit !important; | ||
| 305 | background-color: transparent; | ||
| 306 | overflow: initial; | ||
| 307 | } | ||
| 308 | .webapp-box .resource-select-num { | ||
| 309 | color: #0034FF; | ||
| 310 | } | ||
| 311 | .webapp-box .form-control { | ||
| 312 | display: inline-block; | ||
| 313 | width: 120px; | ||
| 314 | } | ||
| 315 | .webapp-box .progress-bar { | ||
| 316 | position: absolute; | ||
| 317 | left: 365px; | ||
| 318 | top: 20px; | ||
| 319 | } | ||
| 320 | .webapp-box .thumbnail { | ||
| 321 | display: inline-block; | ||
| 322 | width: 80px; | ||
| 323 | height: 80px; | ||
| 324 | margin: 0; | ||
| 325 | text-align: center; | ||
| 326 | font-size: 0; | ||
| 327 | border: none; | ||
| 328 | } | ||
| 329 | .webapp-box .thumbnail:before, .webapp-box .thumbnail:after { | ||
| 330 | content: ""; | ||
| 331 | display: inline-block; | ||
| 332 | width: 0; | ||
| 333 | height: 100%; | ||
| 334 | vertical-align: middle; | ||
| 335 | } | ||
| 336 | .webapp-box .thumbnail img { | ||
| 337 | display: inline-block; | ||
| 338 | max-width: 100%; | ||
| 339 | max-height: 100%; | ||
| 340 | vertical-align: middle; | ||
| 341 | } | ||
| 342 | #img-crop-box { | ||
| 343 | width: 700px; | ||
| 344 | height: 500px; | ||
| 345 | margin-left: -350px; | ||
| 346 | } | ||
| 347 | .img-crop-scope { | ||
| 348 | width: 508px; | ||
| 349 | height: 320px; | ||
| 350 | margin-top: 20px; | ||
| 351 | text-align: center; | ||
| 352 | font-size: 0; | ||
| 353 | border: 1px solid #bbb; | ||
| 354 | background-color: #ccc; | ||
| 355 | overflow: hidden; | ||
| 356 | } | ||
| 357 | .img-crop-top-input { | ||
| 358 | padding: 7px 10px; | ||
| 359 | background-color: #eee; | ||
| 360 | } | ||
| 361 | .jcrop-holder > input[type="radio"] { | ||
| 362 | left: -2000px !important; | ||
| 363 | } | ||
| 364 | .webapp-sub-cate { | ||
| 365 | display: none; | ||
| 366 | padding: 8px 15px; | ||
| 367 | } | ||
| 368 | .webapp-sub-cate > span { | ||
| 369 | cursor: pointer; | ||
| 370 | margin-right: 8px; | ||
| 371 | padding-right: 8px; | ||
| 372 | border-right: 1px solid; | ||
| 373 | color: #6c6c6c; | ||
| 374 | } | ||
| 375 | .webapp-sub-cate > span.active { | ||
| 376 | color: #00a3e9; | ||
| 377 | } | ||
| 378 | .img-box-ui-radio { | ||
| 379 | display: inline-block; | ||
| 380 | width: 22px; | ||
| 381 | height: 22px; | ||
| 382 | position: relative; | ||
| 383 | overflow: visible; | ||
| 384 | border: 0; | ||
| 385 | background: 0 0; | ||
| 386 | -webkit-appearance: none; | ||
| 387 | outline: 0; | ||
| 388 | vertical-align: middle; | ||
| 389 | } | ||
| 390 | .img-box-ui-radio:before { | ||
| 391 | content: ''; | ||
| 392 | display: block; | ||
| 393 | width: 16px; | ||
| 394 | height: 16px; | ||
| 395 | border: 2px solid #dfe0e1; | ||
| 396 | border-radius: 16px; | ||
| 397 | background-clip: padding-box; | ||
| 398 | position: absolute; | ||
| 399 | left: 0; | ||
| 400 | top: 0; | ||
| 401 | } | ||
| 402 | .img-box-ui-radio:checked:before { | ||
| 403 | border: 2px solid #18b4ed; | ||
| 404 | } | ||
| 405 | .img-box-ui-radio:after { | ||
| 406 | content: ''; | ||
| 407 | display: block; | ||
| 408 | width: 8px; | ||
| 409 | height: 8px; | ||
| 410 | background: #dfe0e1; | ||
| 411 | border-radius: 8px; | ||
| 412 | position: absolute; | ||
| 413 | left: 6px; | ||
| 414 | top: 6px; | ||
| 415 | } | ||
| 416 | .img-box-ui-radio:checked:after { | ||
| 417 | background: #18b4ed; | ||
| 418 | } | ||
| 419 | .img-crop-body-left { | ||
| 420 | float: left; | ||
| 421 | padding: 10px; | ||
| 422 | margin: 0 20px; | ||
| 423 | border: 1px solid #eee; | ||
| 424 | } | ||
| 425 | .img-crop-body-left label { | ||
| 426 | display: block; | ||
| 427 | padding: 0 8px; | ||
| 428 | margin: 16px 0; | ||
| 429 | text-align: right; | ||
| 430 | } | ||
| 431 | .img-crop-body-left .img-box-ui-radio { | ||
| 432 | margin-left: 10px; | ||
| 433 | } | ||
| 434 | .webapp-box .btn { | ||
| 435 | display: inline-block; | ||
| 436 | padding: 6px 12px; | ||
| 437 | width: auto; | ||
| 438 | font-size: 14px; | ||
| 439 | line-height: 18px; | ||
| 440 | border: 1px solid #ccc; | ||
| 441 | border-radius: 3px; | ||
| 442 | color: #666; | ||
| 443 | background-color: #fff; | ||
| 444 | cursor: pointer; | ||
| 445 | vertical-align: middle; | ||
| 446 | } | ||
| 447 | .webapp-box .btn.green { | ||
| 448 | color: #fff; | ||
| 449 | background-color: #03d8a2; | ||
| 450 | border-color: #05C897; | ||
| 451 | } | ||
| 452 | .webapp-box .btn.orange { | ||
| 453 | color: #fff; | ||
| 454 | background-color: #ff9f22; | ||
| 455 | border-color: #ee9016; | ||
| 456 | } | ||
| 457 | .webapp-box .btn.blue { | ||
| 458 | color: #fff; | ||
| 459 | background-color: #1dc6f1; | ||
| 460 | border-color: #15bbe5; | ||
| 461 | } | ||
| 462 | .webapp-box input[type="text"] { | ||
| 463 | border: 1px solid #ccc; | ||
| 464 | border-radius: 4px; | ||
| 465 | font-size: 14px; | ||
| 466 | line-height: 14px; | ||
| 467 | padding: 6px; | ||
| 468 | box-shadow: inset 0 1px 3px rgba(0,0,0,.2); | ||
| 469 | outline: 0; | ||
| 470 | -webkit-user-select: text; | ||
| 471 | } | ||
| 472 | .webapp-box select { | ||
| 473 | border: 1px solid #ccc; | ||
| 474 | border-radius: 4px; | ||
| 475 | line-height: 14px; | ||
| 476 | padding: 6px 4px 6px 6px; | ||
| 477 | box-shadow: inset 0 2px 8px rgba(0,0,0,.2); | ||
| 478 | outline: 0; | ||
| 479 | width: 160px; | ||
| 480 | margin: 0; | ||
| 481 | } | ||
| 482 | input[type="file"]{ | ||
| 483 | opacity: 0; | ||
| 484 | } | ||
| 485 | </style> | ||
| 486 | <div class="tpl-content active"> | ||
| 487 | <div class="tpl-sec-navs"></div> | ||
| 488 | <ul class="tpl-container js-no-more"> | ||
| 489 | <li data-id="pz5ouz71UG" data-desc="undefined" data-logo="undefined" | ||
| 490 | class="js-tpl"> | ||
| 491 | <img class="cover" src="http://img.weiye.me/zcimgdir/album/ | ||
| 492 | file_5816e850e6ff8.jpg" onerror="errorWeiyeCover(this)"> | ||
| 493 | <p class="name">影视小程序（微信标准）</p> | ||
| 494 | <div class="code-mask"> | ||
| 495 | <img class="code" src="http://img.weiye.me/tmp_file/4c35ae9d7bbc06ec8d3384f90d001ee6.png" alt=""> | ||
| 496 | <span class="select-btn js-preview-btn">预览</span> | ||
| 497 | <span class="select-btn choose-btn">选择</span> | ||
| 498 | </div> | ||
| 499 | </li> | ||
| 500 | <li data-id="SHq4Dzxth8" data-desc="undefined" data-logo="undefined" | ||
| 501 | class="js-tpl"> | ||
| 502 | <img class="cover" src="http://img.weiye.me/zcimgdir/album/ | ||
| 503 | file_5707497a71a30.jpg" onerror="errorWeiyeCover(this)"> | ||
| 504 | <p class="name">商品售卖（可支付）</p> | ||
| 505 | <div class="code-mask"> | ||
| 506 | <img class="code" src="http://img.weiye.me/tmp_file/ | ||
| 507 | 372dd5a13d48d91ae24fd55f83164c17.png" alt=""> | ||
| 508 | <span class="select-btn js-preview-btn">预览</span> | ||
| 509 | <span class="select-btn choose-btn">选择</span> | ||
| 510 | </div> | ||
| 511 | </li> | ||
| 512 | <li data-id="58v33MQ2mh" data-desc="undefined" data-logo="undefined" | ||
| 513 | class="js-tpl"> | ||
| 514 | <img class="cover" src="http://img.zhichiwangluo.com/zcimgdir/album/ | ||
| 515 | file_569a0c2312394.jpg" onerror="errorWeiyeCover(this)"> | ||
| 516 | <p class="name">好新闻</p> | ||
| 517 | <div class="code-mask"> | ||
| 518 | <img class="code" src="http://img.zhichiwangluo.com/tmp_file/ | ||
| 519 | a12306b208e330b8790ab6dcefcbf4c6.png" alt=""> | ||
| 520 | <span class="select-btn js-preview-btn">预览</span> | ||
| 521 | <span class="select-btn choose-btn">选择</span> | ||
| 522 | </div> | ||
| 523 | </li> | ||
| 524 | <li data-id="zl31CBBC1b" data-desc="undefined" data-logo="undefined" | ||
| 525 | class="js-tpl"> | ||
| 526 | <img class="cover" src="http://img.weiye.me/zcimgdir/album/ | ||
| 527 | file_576df5d02fc70.jpg" onerror="errorWeiyeCover(this)"> | ||
| 528 | <p class="name">旅游</p> | ||
| 529 | <div class="code-mask"> | ||
| 530 | <img class="code" src="http://img.weiye.me/tmp_file/ | ||
| 531 | 3a6dca9b50f64d5033f020b30f521bdd.png" alt=""> | ||
| 532 | <span class="select-btn js-preview-btn">预览</span> | ||
| 533 | <span class="select-btn choose-btn">选择</span> | ||
| 534 | </div> | ||
| 535 | </li> | ||
| 536 | <li data-id="ZSU6l4y4P6" data-desc="undefined" data-logo="undefined" | ||
| 537 | class="js-tpl"> | ||
| 538 | <img class="cover" src="http://img.weiye.me/zcimgdir/album/ | ||
| 539 | file_57fa1d7c68129.jpg" onerror="errorWeiyeCover(this)"> | ||
| 540 | <p class="name">双十一模板</p> | ||
| 541 | <div class="code-mask"> | ||
| 542 | <img class="code" src="http://img.weiye.me/tmp_file/ | ||
| 543 | 21b9bec8d88a32d9e9731e3a1498e580.png" alt=""> | ||
| 544 | <span class="select-btn js-preview-btn">预览</span> | ||
| 545 | <span class="select-btn choose-btn">选择</span> | ||
| 546 | </div> | ||
| 547 | </li> | ||
| 548 | </ul> | ||
| 549 | </div> | ||
| 550 | </body> | ||
| 551 | </html> |
templates/webapp.html
| File was created | 1 | ||
| 2 | <!DOCTYPE html> | ||
| 3 | <html lang="zh-CN"> | ||
| 4 | <head> | ||
| 5 | <title>即速应用-预览</title> | ||
| 6 | <meta name="renderer" content="webkit"> | ||
| 7 | <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" > | ||
| 8 | <meta charset="UTF-8" name="description" content="深圳市咫尺网络科技开发有限公司，专注于移动互联网营销解决方案，拥有微信服务号活动汇，微社区微活动应用，及酷炫的邀请函微页等产品，提供快捷方便活动管理，分享、报名统计，营销推广等服务。精彩活动，尽在咫尺！丰富您的活动，精彩您的人生，快来发起属于您的活动吧！"> | ||
| 9 | <meta name="keywords" content="活动汇,微活动,咫尺活动,微页,咫尺网络,微杂志,微邀请函,喜帖,电子邀请函,H5应用,APP,微场景,场景应用,微场景制作,场景应用制作"> | ||
| 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"> | ||
| 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"> | ||
| 14 | html { | ||
| 15 | height: 0; | ||
| 16 | overflow: visible; | ||
| 17 | } | ||
| 18 | body { | ||
| 19 | min-width: 1200px; | ||
| 20 | background-color: #fff; | ||
| 21 | padding-top: 10px; | ||
| 22 | box-sizing: border-box; | ||
| 23 | transform-origin: center 0; | ||
| 24 | -webkit-transform-origin: center 0; | ||
| 25 | -ms-transform-origin: center 0; | ||
| 26 | -moz-transform-origin: center 0; | ||
| 27 | } | ||
| 28 | .preview-wrap { | ||
| 29 | width: 1180px; | ||
| 30 | margin-left: auto; | ||
| 31 | margin-right: auto; | ||
| 32 | text-align: center; | ||
| 33 | } | ||
| 34 | #phone-component { | ||
| 35 | position: relative; | ||
| 36 | display: inline-block; | ||
| 37 | width: 332px; | ||
| 38 | height: 678px; | ||
| 39 | margin-left: 80px; | ||
| 40 | margin-right: 80px; | ||
| 41 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone/6s.png); | ||
| 42 | background-size: 100% 100%; | ||
| 43 | background-repeat: no-repeat; | ||
| 44 | vertical-align: top; | ||
| 45 | z-index: 999; | ||
| 46 | } | ||
| 47 | .phone-head{ | ||
| 48 | position: absolute; | ||
| 49 | top: 81px; | ||
| 50 | left: 22px; | ||
| 51 | width: 288px; | ||
| 52 | height: 58px; | ||
| 53 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone-head.jpg); | ||
| 54 | background-size: 100% 100%; | ||
| 55 | background-repeat: no-repeat; | ||
| 56 | } | ||
| 57 | .phone-head span{ | ||
| 58 | color: #fff; | ||
| 59 | cursor: pointer; | ||
| 60 | position: absolute; | ||
| 61 | left: 10px; | ||
| 62 | top: 25px; | ||
| 63 | font-size: 14px; | ||
| 64 | line-height: 25px; | ||
| 65 | padding-left: 14px; | ||
| 66 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/left.png); | ||
| 67 | background-size: auto 15px; | ||
| 68 | background-repeat: no-repeat; | ||
| 69 | background-position: left center; | ||
| 70 | } | ||
| 71 | .phone-content { | ||
| 72 | position: absolute; | ||
| 73 | top: 139px; | ||
| 74 | left: 22px; | ||
| 75 | width: 288px; | ||
| 76 | height: 454px; | ||
| 77 | overflow: hidden; | ||
| 78 | background-color: #fff; | ||
| 79 | } | ||
| 80 | .preview-iframe { | ||
| 81 | display: block; | ||
| 82 | position: relative; | ||
| 83 | width: 320px; | ||
| 84 | height: 504px; | ||
| 85 | transform: scale(0.9); | ||
| 86 | -webkit-transform: scale(0.9); | ||
| 87 | -ms-transform: scale(0.9); | ||
| 88 | -moz-transform: scale(0.9); | ||
| 89 | transform-origin: 0 0; | ||
| 90 | -webkit-transform-origin: 0 0; | ||
| 91 | -ms-transform-origin: 0 0; | ||
| 92 | -moz-transform-origin: 0 0; | ||
| 93 | outline: none; | ||
| 94 | border: none; | ||
| 95 | } | ||
| 96 | #phone-component .page::-webkit-scrollbar, | ||
| 97 | iframe::-webkit-scrollbar { | ||
| 98 | width: 0; | ||
| 99 | height: 0; | ||
| 100 | } | ||
| 101 | #phone-component .page.dialog-page { | ||
| 102 | background-color: rgba(0,0,0,.5); | ||
| 103 | } | ||
| 104 | .nav-component { | ||
| 105 | display: inline-block; | ||
| 106 | width: 220px; | ||
| 107 | margin-top: 55px; | ||
| 108 | vertical-align: top; | ||
| 109 | text-align: left; | ||
| 110 | } | ||
| 111 | .left-component{ | ||
| 112 | width: 250px; | ||
| 113 | text-align: center; | ||
| 114 | } | ||
| 115 | .nav-component .box-title { | ||
| 116 | color: #535353; | ||
| 117 | font-size: 14px; | ||
| 118 | margin-bottom: 15px; | ||
| 119 | } | ||
| 120 | .nav-component .box-title.title2{ | ||
| 121 | margin-top: 30px; | ||
| 122 | margin-bottom: 15px; | ||
| 123 | } | ||
| 124 | .app-link-wrap input , .copy-link-wrap button{ | ||
| 125 | background-color: #fff; | ||
| 126 | border: 1px solid #ccc; | ||
| 127 | color: #535353; | ||
| 128 | width: 220px; | ||
| 129 | height: 36px; | ||
| 130 | font-size: 14px; | ||
| 131 | outline: none; | ||
| 132 | } | ||
| 133 | .app-link-wrap input{ | ||
| 134 | width: 198px; | ||
| 135 | height: 38px; | ||
| 136 | padding: 0 10px; | ||
| 137 | margin-bottom: 15px; | ||
| 138 | } | ||
| 139 | .nav-component .group-page-container { | ||
| 140 | height: 400px; | ||
| 141 | line-height: 32px; | ||
| 142 | color: #fff; | ||
| 143 | background-color: #fff; | ||
| 144 | text-indent: 34px; | ||
| 145 | border: 1px solid #ccc; | ||
| 146 | overflow-y: auto; | ||
| 147 | } | ||
| 148 | .nav-component .group-page-nav .group-nav { | ||
| 149 | position: relative; | ||
| 150 | background-color: #8d8d8d; | ||
| 151 | cursor: pointer; | ||
| 152 | line-height: 40px; | ||
| 153 | } | ||
| 154 | .nav-component .group-page-nav .group-nav:before { | ||
| 155 | content: ''; | ||
| 156 | position: absolute; | ||
| 157 | left: 6px; | ||
| 158 | top: 7px; | ||
| 159 | width: 24px; | ||
| 160 | height: 22px; | ||
| 161 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/icons.png); | ||
| 162 | background-repeat: no-repeat; | ||
| 163 | background-size: auto 24px; | ||
| 164 | background-position-x: -96px; | ||
| 165 | } | ||
| 166 | .nav-component .group-page-nav .group-nav:after { | ||
| 167 | content: ''; | ||
| 168 | position: absolute; | ||
| 169 | right: 12px; | ||
| 170 | top: 17px; | ||
| 171 | display: block; | ||
| 172 | width: 14px; | ||
| 173 | height: 9px; | ||
| 174 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/down.png); | ||
| 175 | background-size: 100% auto; | ||
| 176 | background-repeat: no-repeat; | ||
| 177 | } | ||
| 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); | ||
| 180 | } | ||
| 181 | .nav-component .group-page-nav .page-navs { | ||
| 182 | display: none; | ||
| 183 | background-color: #f4f4f4; | ||
| 184 | color: #999; | ||
| 185 | cursor: pointer; | ||
| 186 | } | ||
| 187 | .nav-component .group-page-nav .page-navs .page-nav { | ||
| 188 | position: relative; | ||
| 189 | line-height: 35px; | ||
| 190 | background-color: #fff; | ||
| 191 | border-bottom: 1px solid #c6c6c6; | ||
| 192 | } | ||
| 193 | .nav-component .group-page-nav.active .page-navs { | ||
| 194 | display: block; | ||
| 195 | } | ||
| 196 | .nav-component .group-page-nav .page-navs .active{ | ||
| 197 | background-color: #c6c6c6; | ||
| 198 | color: #fff; | ||
| 199 | } | ||
| 200 | .nav-component .group-page-nav .page-navs li{ | ||
| 201 | box-sizing: border-box; | ||
| 202 | -webkit-box-sizing: border-box; | ||
| 203 | } | ||
| 204 | .nav-component .group-page-nav .page-navs li:hover { | ||
| 205 | outline: 1px solid #ffb100; | ||
| 206 | text-indent: 33px; | ||
| 207 | border: 1px solid #ffb100; | ||
| 208 | border-top: 0; | ||
| 209 | } | ||
| 210 | .nav-component .group-page-nav .page-navs .empty-group-tip { | ||
| 211 | background-color: #fff!important; | ||
| 212 | color: #666; | ||
| 213 | text-align: center; | ||
| 214 | text-indent: 0; | ||
| 215 | cursor: default; | ||
| 216 | } | ||
| 217 | #preview-code { | ||
| 218 | width: 180px; | ||
| 219 | height: 180px; | ||
| 220 | } | ||
| 221 | .code-container { | ||
| 222 | display: inline-block; | ||
| 223 | padding: 10px; | ||
| 224 | border: 1px solid #ccc; | ||
| 225 | } | ||
| 226 | .cata-phone-tab { | ||
| 227 | display: inline-block; | ||
| 228 | margin-right: 26px; | ||
| 229 | margin-top: 147px; | ||
| 230 | cursor: pointer; | ||
| 231 | } | ||
| 232 | .cata-phone-tab > div { | ||
| 233 | padding: 14px 7px; | ||
| 234 | width: 18px; | ||
| 235 | margin-left: auto; | ||
| 236 | margin-right: auto; | ||
| 237 | color: #666; | ||
| 238 | border: 1px solid #ccc; | ||
| 239 | } | ||
| 240 | .cata-phone-tab > div.active { | ||
| 241 | color: #fff; | ||
| 242 | background: #8d8d8d; | ||
| 243 | border: 1px solid #8d8d8d; | ||
| 244 | } | ||
| 245 | .phone-model { | ||
| 246 | display: none; | ||
| 247 | } | ||
| 248 | .phone-model-list { | ||
| 249 | color: #999; | ||
| 250 | font-size: 16px; | ||
| 251 | line-height: 36px; | ||
| 252 | text-align: center; | ||
| 253 | } | ||
| 254 | .phone-model-list li { | ||
| 255 | margin-bottom: 5px; | ||
| 256 | border: 1px solid #ccc; | ||
| 257 | cursor: pointer; | ||
| 258 | } | ||
| 259 | .phone-model-list li.active { | ||
| 260 | color: #fff; | ||
| 261 | background-color: #8d8d8d; | ||
| 262 | border-color: #8d8d8d; | ||
| 263 | } | ||
| 264 | #phone-component.phone-6plus { | ||
| 265 | width: 332px; | ||
| 266 | height: 670px; | ||
| 267 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone/6s.png); | ||
| 268 | } | ||
| 269 | #phone-component.phone-6plus .phone-head { | ||
| 270 | top: 81px; | ||
| 271 | left: 22px; | ||
| 272 | width: 288px; | ||
| 273 | } | ||
| 274 | #phone-component.phone-6plus .phone-content { | ||
| 275 | top: 139px; | ||
| 276 | left: 22px; | ||
| 277 | width: 288px; | ||
| 278 | height: 446px; | ||
| 279 | } | ||
| 280 | #phone-component.phone-6plus .preview-iframe { | ||
| 281 | width: 320px; | ||
| 282 | height: 495px; | ||
| 283 | transform: scale(0.9); | ||
| 284 | -webkit-transform: scale(0.9); | ||
| 285 | -ms-transform: scale(0.9); | ||
| 286 | -moz-transform: scale(0.9); | ||
| 287 | } | ||
| 288 | #phone-component.phone-5s { | ||
| 289 | width: 312px; | ||
| 290 | height: 648px; | ||
| 291 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone/5s.png); | ||
| 292 | } | ||
| 293 | #phone-component.phone-5s .phone-head { | ||
| 294 | top: 93px; | ||
| 295 | left: 25px; | ||
| 296 | width: 262px; | ||
| 297 | } | ||
| 298 | #phone-component.phone-5s .phone-content { | ||
| 299 | top: 150px; | ||
| 300 | left: 26px; | ||
| 301 | width: 260px; | ||
| 302 | height: 405px; | ||
| 303 | } | ||
| 304 | #phone-component.phone-5s .preview-iframe { | ||
| 305 | width: 320px; | ||
| 306 | height: 498px; | ||
| 307 | transform: scale(0.8125); | ||
| 308 | -webkit-transform: scale(0.8125); | ||
| 309 | -ms-transform: scale(0.8125); | ||
| 310 | -moz-transform: scale(0.8125); | ||
| 311 | } | ||
| 312 | #phone-component.phone-note4 { | ||
| 313 | width: 340px; | ||
| 314 | height: 665px; | ||
| 315 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone/note4.png); | ||
| 316 | } | ||
| 317 | #phone-component.phone-note4 .phone-head { | ||
| 318 | top: 56px; | ||
| 319 | left: 16px; | ||
| 320 | width: 306px; | ||
| 321 | } | ||
| 322 | #phone-component.phone-note4 .phone-content { | ||
| 323 | left: 17px; | ||
| 324 | top: 114px; | ||
| 325 | width: 305px; | ||
| 326 | height: 497px; | ||
| 327 | } | ||
| 328 | #phone-component.phone-note4 .preview-iframe { | ||
| 329 | width: 320px; | ||
| 330 | height: 521px; | ||
| 331 | transform: scale(0.953215); | ||
| 332 | -webkit-transform: scale(0.953215); | ||
| 333 | -ms-transform: scale(0.953215); | ||
| 334 | -moz-transform: scale(0.953215); | ||
| 335 | } | ||
| 336 | #phone-component.phone-p8 { | ||
| 337 | width: 334px; | ||
| 338 | height: 650px; | ||
| 339 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone/p8.png); | ||
| 340 | } | ||
| 341 | #phone-component.phone-p8 .phone-head { | ||
| 342 | top: 57px; | ||
| 343 | left: 10px; | ||
| 344 | width: 315px; | ||
| 345 | } | ||
| 346 | #phone-component.phone-p8 .phone-content { | ||
| 347 | top: 115px; | ||
| 348 | left: 10px; | ||
| 349 | width: 315px; | ||
| 350 | height: 480px; | ||
| 351 | } | ||
| 352 | #phone-component.phone-p8 .preview-iframe { | ||
| 353 | width: 322px; | ||
| 354 | height: 491px; | ||
| 355 | transform: scale(0.978125); | ||
| 356 | -webkit-transform: scale(0.978125); | ||
| 357 | -ms-transform: scale(0.978125); | ||
| 358 | -moz-transform: scale(0.978125); | ||
| 359 | } | ||
| 360 | #phone-component.phone-mi4 { | ||
| 361 | width: 330px; | ||
| 362 | height: 660px; | ||
| 363 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone/mi4.png); | ||
| 364 | } | ||
| 365 | #phone-component.phone-mi4 .phone-head { | ||
| 366 | top: 63px; | ||
| 367 | left: 17px; | ||
| 368 | width: 296px; | ||
| 369 | } | ||
| 370 | #phone-component.phone-mi4 .phone-content { | ||
| 371 | top: 121px; | ||
| 372 | left: 17px; | ||
| 373 | width: 296px; | ||
| 374 | height: 462px; | ||
| 375 | } | ||
| 376 | #phone-component.phone-mi4 .preview-iframe { | ||
| 377 | width: 322px; | ||
| 378 | height: 503px; | ||
| 379 | transform: scale(0.91875); | ||
| 380 | -webkit-transform: scale(0.91875); | ||
| 381 | -ms-transform: scale(0.91875); | ||
| 382 | -moz-transform: scale(0.91875); | ||
| 383 | } | ||
| 384 | #phone-component.ipad-air { | ||
| 385 | width: 460px; | ||
| 386 | height: 660px; | ||
| 387 | background-image: url(http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp/images/phone/ipad-air.png); | ||
| 388 | } | ||
| 389 | #phone-component.ipad-air .phone-head { | ||
| 390 | top: 59px; | ||
| 391 | left: 30px; | ||
| 392 | width: 400px; | ||
| 393 | height: 80px; | ||
| 394 | } | ||
| 395 | #phone-component.ipad-air .phone-head > span { | ||
| 396 | top: 40px; | ||
| 397 | } | ||
| 398 | #phone-component.ipad-air .phone-content { | ||
| 399 | top: 139px; | ||
| 400 | left: 30px; | ||
| 401 | width: 400px; | ||
| 402 | height: 461px; | ||
| 403 | } | ||
| 404 | #phone-component.ipad-air .preview-iframe { | ||
| 405 | width: 323px; | ||
| 406 | height: 373px; | ||
| 407 | transform: scale(1.2375); | ||
| 408 | -webkit-transform: scale(1.2375); | ||
| 409 | -ms-transform: scale(1.2375); | ||
| 410 | -moz-transform: scale(1.2375); | ||
| 411 | } | ||
| 412 | |||
| 413 | .bottom-tab { | ||
| 414 | margin-top: 78px; | ||
| 415 | width: 36px !important; | ||
| 416 | padding: 0 !important; | ||
| 417 | } | ||
| 418 | .bottom-tab > span { | ||
| 419 | display: block; | ||
| 420 | width: 36px; | ||
| 421 | height: 50px; | ||
| 422 | line-height: 40px; | ||
| 423 | font-size: 20px; | ||
| 424 | text-align: center; | ||
| 425 | color: #aaa; | ||
| 426 | cursor: pointer; | ||
| 427 | background-color: #fff; | ||
| 428 | } | ||
| 429 | .bottom-tab > span:first-child { | ||
| 430 | border-bottom: 1px solid #e7e7e7; | ||
| 431 | } | ||
| 432 | .bottom-tab a { | ||
| 433 | display: inline-block; | ||
| 434 | color: #aaa; | ||
| 435 | width: 100%; | ||
| 436 | height: 100%; | ||
| 437 | font-size: 12px; | ||
| 438 | line-height: 1em; | ||
| 439 | } | ||
| 440 | .bottom-tab a > span { | ||
| 441 | display: inline-block; | ||
| 442 | width: 100%; | ||
| 443 | margin: 5px 0; | ||
| 444 | font-size: 20px; | ||
| 445 | vertical-align: top; | ||
| 446 | } | ||
| 447 | </style> | ||
| 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> | ||
| 450 | <script type="text/javascript"> | ||
| 451 | var scaleRatio = window.innerHeight/683, | ||
| 452 | scaleStr; | ||
| 453 | |||
| 454 | if(scaleRatio > 1){ | ||
| 455 | scaleRatio = 1; | ||
| 456 | } | ||
| 457 | scaleStr = 'scale('+scaleRatio+')'; | ||
| 458 | window.onload = function(){ | ||
| 459 | $('.webapp').css({ | ||
| 460 | transform: scaleStr, | ||
| 461 | '-webkit-transform': scaleStr, | ||
| 462 | '-ms-transform': scaleStr, | ||
| 463 | '-moz-transform': scaleStr | ||
| 464 | }); | ||
| 465 | }; | ||
| 466 | </script> | ||
| 467 | <script type='text/javascript'> | ||
| 468 | var _vds = _vds || []; | ||
| 469 | window._vds = _vds; | ||
| 470 | (function(){ | ||
| 471 | _vds.push(['setAccountId', '9fd21c28eb55d8a5']); | ||
| 472 | (function() { | ||
| 473 | var vds = document.createElement('script'); | ||
| 474 | vds.type='text/javascript'; | ||
| 475 | vds.async = true; | ||
| 476 | vds.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'dn-growing.qbox.me/vds.js'; | ||
| 477 | var s = document.getElementsByTagName('script')[0]; | ||
| 478 | s.parentNode.insertBefore(vds, s); | ||
| 479 | })(); | ||
| 480 | })(); | ||
| 481 | </script> | ||
| 482 | </head> | ||
| 483 | <body class="webapp" is_login="0"> | ||
| 484 | <div id="preview-wrap" class="preview-wrap"> | ||
| 485 | <div class="nav-component left-component"> | ||
| 486 | <p class="box-title">扫描二维码预览并分享给朋友</p> | ||
| 487 | <div class="code-container"> | ||
| 488 | <img src="" id="preview-code"> | ||
| 489 | </div> | ||
| 490 | <p class="box-title title2">或复制链接发送给朋友</p> | ||
| 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> | ||
| 493 | </div> | ||
| 494 | <div id="phone-component" class="phone-6plus"> | ||
| 495 | <div class="phone-head"><span id="go-back">返回</span></div> | ||
| 496 | <div id="phone-container" class="phone-content"> | ||
| 497 | <iframe class="preview-iframe" id="preview-iframe" frameborder="0" allowtransparency="true" seamless></iframe> | ||
| 498 | </div> | ||
| 499 | </div> | ||
| 500 | <div class="cata-phone-tab"> | ||
| 501 | <div class="tab-item-cata active">目录</div> | ||
| 502 | <div class="tab-item-phone">机型</div> | ||
| 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> | ||
| 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> | ||
| 507 | </div> | ||
| 508 | <div id="nav-component" class="nav-component"> | ||
| 509 | <p class="box-title">按目录浏览</p> | ||
| 510 | <ul id="group-page-container" class="group-page-container"></ul> | ||
| 511 | </div> | ||
| 512 | <div id="phone-model" class="phone-model nav-component"> | ||
| 513 | <p class="box-title">此预览仅供参考，以实际设备为准</p> | ||
| 514 | <ul class="phone-model-list"> | ||
| 515 | <li class="active" data-type="phone-6plus">iPhone 6 Plus</li> | ||
| 516 | <li data-type="phone-5s">iPhone 5s</li> | ||
| 517 | <li data-type="phone-note4">三星Note 4</li> | ||
| 518 | <li data-type="phone-p8">华为P8</li> | ||
| 519 | <li data-type="phone-mi4">小米M4</li> | ||
| 520 | <li data-type="ipad-air">iPad Air 2</li> | ||
| 521 | </ul> | ||
| 522 | </div> | ||
| 523 | </div> | ||
| 524 | <!-- 登录注册 --> | ||
| 525 | <link rel="stylesheet" href="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/webapp_home/css/app_login_reg.css?version=10213"> | ||
| 526 | |||
| 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> | ||
| 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=""> | ||
| 531 | <div class="lr" id="login-panel"> | ||
| 532 | <div class="lr-left"> | ||
| 533 | <div class="reg-wrap"> | ||
| 534 | <img src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/index/images/toreg.png"> | ||
| 535 | <div class="to-reg">注册</div> | ||
| 536 | </div> | ||
| 537 | <div class="login-wrap"> | ||
| 538 | <img src="http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend/static/pc2/index/images/tologin.png"> | ||
| 539 | <div class="to-login">登录</div> | ||
| 540 | </div> | ||
| 541 | </div><div class="lr-right"> | ||
| 542 | <div class="login-info-wrap"> | ||
| 543 | <div class="title">登录<span>(个人/企业账号)</span></div> | ||
| 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"> | ||
| 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> | ||
| 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> | ||
| 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> | ||
| 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> | ||
| 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> | ||
| 556 | </div> | ||
| 557 | </div> | ||
| 558 | <div class="wx-login" > | ||
| 559 | <div class="title">微信登录</div> | ||
| 560 | <img class="code-img" src=""> | ||
| 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> | ||
| 563 | </div> | ||
| 564 | <div class="reg-info-wrap"> | ||
| 565 | <div class="reg-type"><span class="active">个人注册</span><span>企业注册</span></div> | ||
| 566 | <div class="person-reg"> | ||
| 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> | ||
| 569 | |||
| 570 | <div class="perfit-info" > | ||
| 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"> | ||
| 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> | ||
| 575 | <input type="text" placeholder="邀请码" id="perfit-invite" class="long-input"> | ||
| 576 | <div class="login-btn" id="perfit-info">注册</div> | ||
| 577 | </div> | ||
| 578 | </div> | ||
| 579 | <div class="company-reg"> | ||
| 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> --> | ||
| 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> --> | ||
| 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"> | ||
| 586 | <option value="政府机构">政府机构</option> | ||
| 587 | <option value="微信">微信</option> | ||
| 588 | <option value="传媒广告">传媒广告</option> | ||
| 589 | <option value="电商">电商</option> | ||
| 590 | <option value="餐饮">餐饮</option> | ||
| 591 | <option value="家具">家具</option> | ||
| 592 | <option value="IT">IT</option> | ||
| 593 | <option value="教育">教育</option> | ||
| 594 | <option value="房地产">房地产</option> | ||
| 595 | <option value="服装">服装</option> | ||
| 596 | <option value="婚庆">婚庆</option> | ||
| 597 | <option value="娱乐">娱乐</option> | ||
| 598 | <option value="旅游">旅游</option> | ||
| 599 | <option value="汽车">汽车</option> | ||
| 600 | <option value="美容">美容</option> | ||
| 601 | <option value="摄影">摄影</option> | ||
| 602 | <option value="公益">公益</option> | ||
| 603 | <option value="金融">金融</option> | ||
| 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> | ||
| 606 | <div style="margin-top: 15px;"><input id="inviteCode" class="short-input" placeholder="邀请码，可不填"><span class="reg-btn">注册</span></div> | ||
| 607 | </div> | ||
| 608 | </div> | ||
| 609 | <div class="findBackPw"> | ||
| 610 | <div class="title"><span class="findtype" type="phone">手机找回</span><span class="changetype">通过邮箱找回</span></div> | ||
| 611 | <div> | ||
| 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> | ||
| 614 | <input type="password" id="newPw1" 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> | ||
| 617 | <p class="login-now" style="margin-top: 30px;text-align: center;color: #3091f2;cursor: pointer;">我想起来了，去登录 ></p> | ||
| 618 | </div> | ||
| 619 | </div> | ||
| 620 | </div> | ||
| 621 | </div> | ||
| 622 | </div> | ||
| 623 | <!-- 登录注册 完 --> | ||
| 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> | ||
| 626 | <script> | ||
| 627 | $(function() { | ||
| 628 | var appId = GetQueryString('id'), | ||
| 629 | cdnUrl= 'http://1251027630.cdn.myqcloud.com/1251027630/zhichi_frontend', | ||
| 630 | _appData = {}; | ||
| 631 | initialPreview(appId); | ||
| 632 | |||
| 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>'); | ||
| 635 | } | ||
| 636 | |||
| 637 | $('body').on('click', '#group-page-container .group-nav', function(event) { | ||
| 638 | // 组折叠 | ||
| 639 | event.preventDefault(); | ||
| 640 | var target = $(this).parent(); | ||
| 641 | target.toggleClass('active'); | ||
| 642 | }).on('click', '#group-page-container .page-nav', function(event) { | ||
| 643 | if($(this).hasClass('active')){ | ||
| 644 | return; | ||
| 645 | } | ||
| 646 | $('.page-nav.active').removeClass('active'); | ||
| 647 | $(this).addClass('active'); | ||
| 648 | |||
| 649 | var router = $(this).attr('data-router'), | ||
| 650 | $preview = $('#preview-iframe'), | ||
| 651 | url = 'http://jisuapp.cn/app?_app_id='+appId+'&router='+router, | ||
| 652 | historyId = GetQueryString('history_id'), | ||
| 653 | customFeature = _appData[router].customFeature; | ||
| 654 | |||
| 655 | historyId && (url += '&history_id='+historyId); | ||
| 656 | if(customFeature.form){ | ||
| 657 | url += '&detail=-1'; | ||
| 658 | } | ||
| 659 | $preview.attr('src',url); | ||
| 660 | |||
| 661 | }).on('click', '.choose-tpl', function(){ | ||
| 662 | if($('body').attr('is_login') == 0){ | ||
| 663 | loginFunc(); | ||
| 664 | $(".lr-mask").show(); | ||
| 665 | return; | ||
| 666 | } | ||
| 667 | var param = { | ||
| 668 | app_name : '我的应用', | ||
| 669 | description: '' , | ||
| 670 | logo : cdnUrl + '/static/invitation/images/logo.png', | ||
| 671 | cover: cdnUrl + '/static/webapp/images/share_feng.jpg' , | ||
| 672 | f_app_id : appId | ||
| 673 | }, | ||
| 674 | $btn = $(this); | ||
| 675 | |||
| 676 | if($btn.hasClass('requesting')) { return; } | ||
| 677 | $btn.addClass('requesting'); | ||
| 678 | $ajax('http://jisuapp.cn/index.php?r=pc/AppData/add','post', param,'json',function(data){ | ||
| 679 | $btn.removeClass('requesting'); | ||
| 680 | if (data.status === 0) { | ||
| 681 | window.location.href = 'http://jisuapp.cn/index.php?r=pc/Webapp/edit&id='+data.data; | ||
| 682 | } else if (data.status === 3){ | ||
| 683 | confirmTip({ | ||
| 684 | text : data.data + "<p>是否去升级VIP？</p>", | ||
| 685 | ConfirmFunction : function(){ | ||
| 686 | window.open('http://jisuapp.cn/index.php?r=pc/Index/appVipPacket'); | ||
| 687 | } | ||
| 688 | }); | ||
| 689 | } else { | ||
| 690 | alertTip(data.data); | ||
| 691 | } | ||
| 692 | }, function(data){ | ||
| 693 | $btn.removeClass('requesting'); | ||
| 694 | alertTip(data.data); | ||
| 695 | }); | ||
| 696 | }); | ||
| 697 | function initialPreview(appId){ | ||
| 698 | // 预览时 | ||
| 699 | var $preview = $('#preview-iframe'), | ||
| 700 | router = GetQueryString('router'), | ||
| 701 | para = { | ||
| 702 | app_id: appId, | ||
| 703 | history_id: GetQueryString('history_id') || '' | ||
| 704 | }; | ||
| 705 | |||
| 706 | $ajax('http://jisuapp.cn/index.php?r=AppData/detail','get',para,'json',function(data){ | ||
| 707 | if (data.status === 0) { | ||
| 708 | var info = data.data, | ||
| 709 | _cataData = typeof info.cata_data === 'string' ? JSON.parse(info.cata_data) : info.cata_data; | ||
| 710 | |||
| 711 | _appData = typeof info.app_data === 'string' ? JSON.parse(info.app_data) : info.app_data; | ||
| 712 | $('#preview-code').attr('src', info.qrcode); | ||
| 713 | $('#app-link').val(info.url); | ||
| 714 | parseCata(_cataData); | ||
| 715 | if(!router){ | ||
| 716 | router = _appData.version == 1 ? _appData.data['homepage-router'] : 'page10000'; | ||
| 717 | } | ||
| 718 | $('#group-page-container .page-nav[data-router='+router+']').trigger('click'); | ||
| 719 | }else{ | ||
| 720 | alertTip(data.data); | ||
| 721 | } | ||
| 722 | |||
| 723 | }); | ||
| 724 | } | ||
| 725 | function parseCata(_cataData, router){ | ||
| 726 | var cataStr = '', | ||
| 727 | targetRouter = router || 'page10000', | ||
| 728 | cataDataContent = _cataData.data; | ||
| 729 | for(var cata in cataDataContent) { | ||
| 730 | if(cataDataContent[cata]){ | ||
| 731 | var pages = cataDataContent[cata].pages, | ||
| 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">'; | ||
| 734 | for(var item in pages){ | ||
| 735 | i++; | ||
| 736 | cataStr += parsePageNavStr(pages[item].router, pages[item].title, pages[item].name); | ||
| 737 | } | ||
| 738 | if(i<=0){ | ||
| 739 | cataStr += '<p class="empty-group-tip">此分组暂无页面</p>'; | ||
| 740 | } | ||
| 741 | |||
| 742 | cataStr += '</ul></li>'; | ||
| 743 | } | ||
| 744 | }; | ||
| 745 | $('#group-page-container').empty().append(cataStr); | ||
| 746 | } | ||
| 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>'; | ||
| 749 | return str; | ||
| 750 | } | ||
| 751 | |||
| 752 | $("#copy-link").on('copy', function(e){ | ||
| 753 | e.clipboardData.clearData(); | ||
| 754 | e.clipboardData.setData('text/plain', $('#app-link').val()); | ||
| 755 | e.preventDefault(); | ||
| 756 | }).on('aftercopy', function(e){ | ||
| 757 | alertTip('复制成功'); | ||
| 758 | }); | ||
| 759 | |||
| 760 | $("#go-back").on('click' , function(event) { | ||
| 761 | var $preview = $('#preview-iframe')[0]; | ||
| 762 | $preview.contentWindow.history.back() | ||
| 763 | }); | ||
| 764 | |||
| 765 | $('.tab-item-cata').on('click', function(){ | ||
| 766 | $(this).addClass('active').siblings().removeClass('active'); | ||
| 767 | $('#phone-model').css('display', 'none'); | ||
| 768 | $('#nav-component').css('display', 'inline-block'); | ||
| 769 | }); | ||
| 770 | |||
| 771 | $('.tab-item-phone').on('click', function(){ | ||
| 772 | $(this).addClass('active').siblings().removeClass('active'); | ||
| 773 | $('#phone-model').css('display', 'inline-block'); | ||
| 774 | $('#nav-component').css('display', 'none'); | ||
| 775 | }); | ||
| 776 | |||
| 777 | $('.phone-model-list').on('click', 'li', function(){ | ||
| 778 | var type = $(this).attr('data-type'), | ||
| 779 | $phone = $('#phone-component'), | ||
| 780 | $iframe = $phone.find('iframe'); | ||
| 781 | |||
| 782 | $(this).addClass('active').siblings('.active').removeClass('active'); | ||
| 783 | $phone.attr('class', type); | ||
| 784 | }); | ||
| 785 | }); | ||
| 786 | </script> | ||
| 787 | </body> | ||
| 788 | </html> |
url.py
| File was created | 1 | # coding: utf-8 | |
| 2 | |||
| 3 | from handlers.index import IndexHandler, WebAppHandler | ||
| 4 | |||
| 5 | |||
| 6 | urls = [ | ||
| 7 | # 首页链接 | ||
| 8 | (r'/', IndexHandler), | ||
| 9 | (r'/webapp/$', WebAppHandler), | ||
| 10 | ] |