From 7808619b659bfd06b44f13606ec2e571e8626d2a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=B7=A6=E6=96=87=E7=A5=BA?= Date: Fri, 2 Feb 2018 22:43:31 +0800 Subject: [PATCH 1/3] =?UTF-8?q?=E5=88=9D=E6=AD=A5=E8=81=94=E8=B0=83?= =?UTF-8?q?=E6=B5=8B=E8=AF=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- requirements.txt | 2 + src/static/index.js | 311 ++++-------------- .../js/jquery.svg3dtagcloud.js | 3 + src/static/manage.js | 44 +++ src/templates/index.html | 3 +- src/templates/manage.html | 13 +- src/users_db.py | 33 +- 7 files changed, 154 insertions(+), 255 deletions(-) create mode 100644 requirements.txt create mode 100644 src/static/manage.js diff --git a/requirements.txt b/requirements.txt new file mode 100644 index 0000000..cedc407 --- /dev/null +++ b/requirements.txt @@ -0,0 +1,2 @@ +bottle==0.12.13 +tinydb==3.7.0 diff --git a/src/static/index.js b/src/static/index.js index 278432a..6b1060d 100644 --- a/src/static/index.js +++ b/src/static/index.js @@ -1,118 +1,19 @@ $(document).ready(function () { - /* var running; - - var settings = { - entries: entries, - width: 800, - height: 600, - radius: '65%', - radiusMin: 75, - bgDraw: true, - bgColor: 'none', - opacityOver: 0.90, - opacityOut: 0.05, - opacitySpeed: 1, - fov: 500, - speed: 1, - fontFamily: 'Oswald, Arial, sans-serif', - fontSize: '15', - hoverFontSize: '55', - fontColor: '#fff', - fontWeight: 'normal',//bold - fontStyle: 'normal',//italic - fontStretch: 'wider',//wider, narrower, ultra-condensed, extra-condensed, condensed, semi-condensed, semi-expanded, expanded, extra-expanded, ultra-expanded - fontToUpperCase: true, - // tooltipFontFamily: 'Oswald, Arial, sans-serif', - // tooltipFontSize: '11', - // tooltipFontColor: '#fff', - // tooltipFontWeight: 'normal',//bold - // tooltipFontStyle: 'normal',//italic - // tooltipFontStretch: 'normal',//wider, narrower, ultra-condensed, extra-condensed, condensed, semi-condensed, semi-expanded, expanded, extra-expanded, ultra-expanded - // tooltipFontToUpperCase: false, - // tooltipTextAnchor: 'left', - // tooltipDiffX: 0, - // tooltipDiffY: 10 - - }; - - var svg3DTagCloud = new SVG3DTagCloud(document.getElementById('holder'), settings);*/ - - /* $('#start').click(function () { - if (running) { - alert('正在抽奖'); - return; - } - svg3DTagCloud.speed(6); - running = true; - - }); - $('#end').click(function () { - stop(); - render(1); - }); - - $('#test').click(function () { - list(); - });*/ - - // $( '#holder' ).svg3DTagCloud( settings ); - /* function render(i) { - console.log(i); - if (i === 5) { - setTimeout(function () { - list(); - stop(); - }, 1000); - return; - } - ; - setTimeout(function () { - stop(); - setTimeout(function () { - chose(i); - render(++i); - }, 500) - }, 2500) - } - - function stop() { - running = false; - svg3DTagCloud.reset(); - svg3DTagCloud.speed(1); - } - - function chose(i) { - svg3DTagCloud.chose([{ - index: i - }]); - } - - function list() { - var offset = $(".holder").offset(); - layer.open({ - type: 1, - area: '800px', - offset: [offset.top, offset.left], - closeBtn: 1, //不显示关闭按钮 - anim: 3, - title: '中奖名单', - shadeClose: false, //开启遮罩关闭 - content: '
' - }); - }*/ new UI(); }); -class BS{ - constructor(){ + +class BS { + constructor() { } - static fetch(url,data,type){ - return new Promise((resolve)=>{ + + static fetch(url, data, type) { + return new Promise((resolve) => { $.ajax({ - type:type?type:'GET', - data:data?data:{}, + type: type ? type : 'GET', + data: data ? data : {}, url, - success(resp){ + success(resp) { resolve(resp) } }) @@ -120,153 +21,38 @@ class BS{ } - static run(award_id){ - return this.fetch('/run',{ - award_id - },'POST'); + static run() { + return this.fetch('/run'); } - static stopAndResult(){ - return this.fetch('/draw_lottery'); + + static stopAndResult(award_id) { + return this.fetch('/draw_lottery',{award_id}); } - static getLucklessUsers(){ + static getLucklessUsers() { return this.fetch('/luckless_users'); } - static getLuckyUsers(){ + + static getLuckyUsers() { return this.fetch('/luckless_users'); } - static getAwards(){ + + static getAwards() { return this.fetch('/awards'); } - static getUsers(){ + + static getUsers() { return this.fetch('/users'); } } + class UI { constructor() { this.running = false; - this.entries = [ - - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '张三三', url:'javascript:void(0)', target: '_top', id: 'admin'}, - {label: '李四', url: 'http://www.flashforum.de/', target: '_top'}, - {label: '王污污', url: 'http://www.jqueryscript.net/', target: '_top'}, - {label: '赵六六', url: 'http://www.jqueryscript.net/', target: '_top'}, - {label: '赵六六', url: 'http://www.jqueryscript.net/', target: '_top'}, - - - ]; + this.entries = []; this.settings = { - entries: this.entries, width: 800, height: 600, radius: '65%', @@ -298,15 +84,26 @@ class UI { // tooltipDiffY: 10 }; - this.svg3DTagCloud = new SVG3DTagCloud(document.getElementById('holder'), this.settings); - this.buildCloud(); + this.buildCloud().then(()=>{ + this.settings.entries = this.entries; + this.svg3DTagCloud = new SVG3DTagCloud(document.getElementById('holder'), this.settings); + }); this.bindEvent(); } - - buildCloud() { - BS.getUsers().then((resp)=>{ - console.log(resp) + return BS.getUsers().then((resp) => { + console.log(resp); + let entry = []; + $(resp.data).each((i, val) => { + entry.push({ + label: val.name, + uid:val.uid, + role:val.role, + url: 'javascript:void(0)', + target: '_top' + }) + }); + this.entries = entry; }) } @@ -316,14 +113,23 @@ class UI { alert('正在抽奖'); return; } - this.svg3DTagCloud.speed(6); - this.running = true; - + //todo + BS.run().then(resp=>{ + console.log(resp); + this.svg3DTagCloud.speed(6); + this.running = true; + }); }); $('#end').click(() => { console.log('click'); - this.stop(); - this.render(1); + //todo + BS.stopAndResult("9f7cfd85a39e40f2975e7a62ca9dbca5").then(resp=>{ + console.log(resp); + this.stop(); + let uid= 'G0001'; + let index = $(`[data-uid=${uid}]`).data('index'); + this.render(index); + }); }); $('#test').click(() => { this.list(); @@ -332,13 +138,14 @@ class UI { } render(i) { - console.log(i); + this.chose(i); + /* console.log(i); if (i >= 5) { setTimeout(() => { this.stop(); - setTimeout(()=>{ + setTimeout(() => { this.list(); - },1000) + }, 1000) }, 1000); return; } @@ -348,7 +155,7 @@ class UI { this.chose(i); this.render(++i); }, 500) - }, 2500) + }, 2500)*/ } stop() { diff --git a/src/static/jquery-svg3dtagcloud-plugin-master/js/jquery.svg3dtagcloud.js b/src/static/jquery-svg3dtagcloud-plugin-master/js/jquery.svg3dtagcloud.js index 4dee8b5..21ab389 100644 --- a/src/static/jquery-svg3dtagcloud-plugin-master/js/jquery.svg3dtagcloud.js +++ b/src/static/jquery-svg3dtagcloud-plugin-master/js/jquery.svg3dtagcloud.js @@ -261,6 +261,9 @@ THE SOFTWARE. entry.link = document.createElementNS( svgNS, 'a' ); entry.link.setAttributeNS( 'http://www.w3.org/1999/xlink', 'xlink:href', entryObj.url ); entry.link.setAttribute( 'target', entryObj.target ); + entry.link.setAttribute( 'data-uid', entryObj.uid ); + entry.link.setAttribute( 'data-role', entryObj.role ); + entry.link.setAttribute( 'data-index', index ); // entry.link.addEventListener( 'mouseover', mouseOverHandler, true ); // entry.link.addEventListener( 'mouseout', mouseOutHandler, true ); entry.link.appendChild( entry.element ); diff --git a/src/static/manage.js b/src/static/manage.js new file mode 100644 index 0000000..6a839f8 --- /dev/null +++ b/src/static/manage.js @@ -0,0 +1,44 @@ +/** + * Created by zuowenqi on 2018/2/2 0002 + */ +class BS{ + constructor(){ + + } + static fetch(url,data,type){ + return new Promise((resolve)=>{ + $.ajax({ + type:type?type:'GET', + data:data?data:{}, + url, + success(resp){ + resolve(resp) + } + }) + }) + + } + static addAwards(award_name,award_capacity){ + console.log(); + return this.fetch('/add_award',{ + award_name,award_capacity + }); + } + static getAwards(){ + return this.fetch('/awards'); + } +} +$(function(){ + BS.addAwards("一等奖",1).then(resp=>{ + console.log(resp) + }); + BS.addAwards("二等奖",5).then(resp=>{ + console.log(resp) + }); + BS.addAwards("三等奖",10).then(resp=>{ + console.log(resp) + }); + BS.getAwards().then(resp=>{ + console.log(resp); + }) +}); \ No newline at end of file diff --git a/src/templates/index.html b/src/templates/index.html index 04bfea1..a953652 100644 --- a/src/templates/index.html +++ b/src/templates/index.html @@ -18,6 +18,7 @@
    +
@@ -25,7 +26,7 @@

开始 停止 - 中奖 + 中奖结果

diff --git a/src/templates/manage.html b/src/templates/manage.html index 566549b..8442e33 100644 --- a/src/templates/manage.html +++ b/src/templates/manage.html @@ -3,8 +3,19 @@ Title + + + - + +增加 +修改 +删除 + + + \ No newline at end of file diff --git a/src/users_db.py b/src/users_db.py index d6c5859..e83a083 100644 --- a/src/users_db.py +++ b/src/users_db.py @@ -3,4 +3,35 @@ def load(): - return [] + return [ + { + "uid": "G0001", + "name": "谷歌", + "award_id": None, + "role": 0 + }, + { + "uid": "G0002", + "name": "百度", + "award_id": None, + "role": 1 + }, + { + "uid": "G0003", + "name": "搜狗", + "award_id": None, + "role": 2 + }, + { + "uid": "G0004", + "name": "360", + "award_id": None, + "role": 3 + }, + { + "uid": "G0005", + "name": "亚马逊", + "award_id": None, + "role": 1 + } + ] From 3b373fa969cabb45619c0013d0655757fd8e0be6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=B7=A6=E6=96=87=E7=A5=BA?= Date: Sun, 4 Feb 2018 01:09:26 +0800 Subject: [PATCH 2/3] =?UTF-8?q?=E5=89=8D=E7=AB=AF=E8=81=94=E8=B0=83?= =?UTF-8?q?=E6=8A=BD=E5=A5=96=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/static/index.js | 133 +++++++++++++----- .../js/jquery.svg3dtagcloud.js | 1 + src/static/manage.js | 87 +++++++++--- src/templates/index.html | 4 +- src/templates/manage.html | 10 +- 5 files changed, 173 insertions(+), 62 deletions(-) diff --git a/src/static/index.js b/src/static/index.js index 6b1060d..19db7d5 100644 --- a/src/static/index.js +++ b/src/static/index.js @@ -26,7 +26,7 @@ class BS { } static stopAndResult(award_id) { - return this.fetch('/draw_lottery',{award_id}); + return this.fetch('/draw_lottery', {award_id}); } static getLucklessUsers() { @@ -42,15 +42,23 @@ class BS { return this.fetch('/awards'); } + static getAward(award_id) { + return this.fetch('/award', { + award_id + }); + } + static getUsers() { return this.fetch('/users'); } + } class UI { constructor() { this.running = false; + this.currentAward = ''; this.entries = []; this.settings = { width: 800, @@ -84,12 +92,17 @@ class UI { // tooltipDiffY: 10 }; - this.buildCloud().then(()=>{ + this.buildCloud().then(() => { this.settings.entries = this.entries; this.svg3DTagCloud = new SVG3DTagCloud(document.getElementById('holder'), this.settings); }); this.bindEvent(); + this.initVisualSocket(); + BS.getAwards().then(resp => { + console.log(resp) + }) } + buildCloud() { return BS.getUsers().then((resp) => { console.log(resp); @@ -97,8 +110,8 @@ class UI { $(resp.data).each((i, val) => { entry.push({ label: val.name, - uid:val.uid, - role:val.role, + uid: val.uid, + role: val.role, url: 'javascript:void(0)', target: '_top' }) @@ -107,14 +120,37 @@ class UI { }) } + initVisualSocket() { + let tempAwardId = ''; + setInterval(() => { + tempAwardId = localStorage.getItem('current_award'); + if (this.currentAward !== tempAwardId) { + this.currentAward = tempAwardId; + this.refreshCurrentAward(); + } + }, 2 * 1000); + } + + refreshCurrentAward() { + BS.getAward(this.currentAward).then((resp) => { + console.log(resp); + if (resp.status === 200) { + let awardInfo = resp.data; + $('#currentAwardName').html(awardInfo.award_name); + $('#currentTimes').html(awardInfo.award_capacity); + } + + }) + } + + bindEvent() { $('#start').click(() => { if (this.running) { alert('正在抽奖'); return; } - //todo - BS.run().then(resp=>{ + BS.run().then(resp => { console.log(resp); this.svg3DTagCloud.speed(6); this.running = true; @@ -122,13 +158,11 @@ class UI { }); $('#end').click(() => { console.log('click'); - //todo - BS.stopAndResult("9f7cfd85a39e40f2975e7a62ca9dbca5").then(resp=>{ + BS.stopAndResult(this.currentAward).then(resp => { console.log(resp); - this.stop(); - let uid= 'G0001'; - let index = $(`[data-uid=${uid}]`).data('index'); - this.render(index); + if (resp.status === 200) { + this.render(resp.data, 0); + } }); }); $('#test').click(() => { @@ -137,25 +171,17 @@ class UI { } - render(i) { - this.chose(i); - /* console.log(i); - if (i >= 5) { - setTimeout(() => { - this.stop(); - setTimeout(() => { - this.list(); - }, 1000) - }, 1000); + + render(data, i) { + // debugger + if (i >= data.length) { + this.currentlist(data); return; } - setTimeout(() => { - this.stop(); - setTimeout(() => { - this.chose(i); - this.render(++i); - }, 500) - }, 2500)*/ + this.chose(data[i]).then(() => { + i++; + this.render(data, i); + }); } stop() { @@ -164,13 +190,48 @@ class UI { this.svg3DTagCloud.speed(1); } - chose(i) { - this.svg3DTagCloud.chose([{ - index: i - }]); + chose(user) { + return new Promise((resolve) => { + let uid = user.uid; + let name = user.name; + let index = $(`[data-uid=${uid}]`).data('index'); + this.svg3DTagCloud.chose([{ + index + }]); + let currentList = `
  • ${name}
    • `; + $('.current-list').append(currentList); + setTimeout(() => { + // this.stop() + resolve(); + }, 3 * 1000) + }).then(() => { + return new Promise((resolve) => { + this.stop(); + setTimeout(() => { + resolve(); + }, 500) + }); + + }) + } - let currentList = `
  • 张三三
    • `; - $('.current-list').append(currentList); + currentlist(data) { + let offset = $(".holder").offset(); + let DOM = '`; + layer.open({ + type: 1, + area: '800px', + offset: [offset.top, offset.left], + closeBtn: 1, //不显示关闭按钮 + anim: 3, + title: '本次中奖名单', + shadeClose: false, //开启遮罩关闭 + content: `
    ${DOM}
    ` + }); } list() { @@ -181,7 +242,7 @@ class UI { offset: [offset.top, offset.left], closeBtn: 1, //不显示关闭按钮 anim: 3, - title: '中奖名单', + title: '本次中奖名单', shadeClose: false, //开启遮罩关闭 content: '
    • 1111
    • 111
    • 2222
    ' }); diff --git a/src/static/jquery-svg3dtagcloud-plugin-master/js/jquery.svg3dtagcloud.js b/src/static/jquery-svg3dtagcloud-plugin-master/js/jquery.svg3dtagcloud.js index 21ab389..9885a4a 100644 --- a/src/static/jquery-svg3dtagcloud-plugin-master/js/jquery.svg3dtagcloud.js +++ b/src/static/jquery-svg3dtagcloud-plugin-master/js/jquery.svg3dtagcloud.js @@ -280,6 +280,7 @@ THE SOFTWARE. } entry.index = index; + entry.uid = entryObj.uid; entry.mouseOver = false; entry.vectorPosition = { x:x, y:y, z:z }; diff --git a/src/static/manage.js b/src/static/manage.js index 6a839f8..e383113 100644 --- a/src/static/manage.js +++ b/src/static/manage.js @@ -1,44 +1,85 @@ /** * Created by zuowenqi on 2018/2/2 0002 */ -class BS{ - constructor(){ +class BS { + constructor() { } - static fetch(url,data,type){ - return new Promise((resolve)=>{ + + static fetch(url, data, type) { + return new Promise((resolve) => { $.ajax({ - type:type?type:'GET', - data:data?data:{}, + type: type ? type : 'GET', + data: data ? data : {}, url, - success(resp){ + success(resp) { resolve(resp) } }) }) } - static addAwards(award_name,award_capacity){ - console.log(); - return this.fetch('/add_award',{ - award_name,award_capacity - }); + + static addAwards(award_name, award_capacity) { + award_capacity*=1; + return this.fetch('/add_award', { + award_name, award_capacity + }); } - static getAwards(){ + + static getAwards() { return this.fetch('/awards'); } + static setCurrent(id){ + return new Promise(resolve=>{ + let prev =localStorage.getItem('current_award')||''; + localStorage.setItem('prev_award',prev); + localStorage.setItem('current_award',id); + resolve(localStorage.getItem('current_award')); + }) + } } -$(function(){ - BS.addAwards("一等奖",1).then(resp=>{ - console.log(resp) + +$(function () { + $('#add').click(e => { + layer.open({ + title:'增加', + content: `
    +奖品名
    +数量 +
    `, + yes: function () { + let name = $('#addname').val(); + let num = $('#addnum').val(); + BS.addAwards(name, num).then(resp => { + console.log(resp); + flushAwards() + }); + } + }); }); - BS.addAwards("二等奖",5).then(resp=>{ - console.log(resp) + $('#reset').click(e => { + BS.fetch('/reset').then(resp => { + }); }); - BS.addAwards("三等奖",10).then(resp=>{ + $(document).on('click','.set',e=>{ + let aid = $(e.target).data('aid'); + BS.setCurrent(aid).then((resp)=>{ + console.log(resp) + }) + }) + flushAwards() + +}); + +function flushAwards() { + BS.getAwards().then(resp => { console.log(resp) - }); - BS.getAwards().then(resp=>{ - console.log(resp); + let ul = '' + resp.data.forEach((val) => { + let list = `
    • ` + ul += list; + }) + $('ul').html(ul) }) -}); \ No newline at end of file +} \ No newline at end of file diff --git a/src/templates/index.html b/src/templates/index.html index a953652..28585a0 100644 --- a/src/templates/index.html +++ b/src/templates/index.html @@ -12,8 +12,8 @@
    -

    当前奖项：二等奖

    -

    抽取人数：1

    +

    当前奖项：设置中

    +

    抽取人数：设置中

    diff --git a/src/templates/manage.html b/src/templates/manage.html index 8442e33..0ca7c69 100644 --- a/src/templates/manage.html +++ b/src/templates/manage.html @@ -6,14 +6,22 @@ +
      -
    增加 修改 删除 +reset From dd195953dae111aa57b9d038ea97308a1605a1a3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=B7=A6=E6=96=87=E7=A5=BA?= Date: Mon, 5 Feb 2018 10:11:17 +0800 Subject: [PATCH 3/3] =?UTF-8?q?=E8=B0=83=E6=95=B4=E6=A0=B7=E5=BC=8F=20?= =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E6=89=80=E6=9C=89=E4=B8=AD=E5=A5=96=E5=88=97?= =?UTF-8?q?=E8=A1=A8=E5=BC=B9=E7=AA=97?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/static/index.css | 40 +++++++++++++++-- src/static/index.js | 95 ++++++++++++++++++++++++++++++--------- src/static/manage.css | 47 +++++++++++++++++++ src/static/manage.js | 76 ++++++++++++++++++++++--------- src/templates/index.html | 6 +-- src/templates/manage.html | 18 +++----- 6 files changed, 219 insertions(+), 63 deletions(-) create mode 100644 src/static/manage.css diff --git a/src/static/index.css b/src/static/index.css index 6cfbbc5..08e7db1 100644 --- a/src/static/index.css +++ b/src/static/index.css @@ -21,27 +21,28 @@ body { overflow: hidden; background: url("./images/bg.jpg") no-repeat; background-color: #141a48; - font-family:"Microsoft YaHei UI","Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; + font-family:"Microsoft YaHei","Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; } .content{ width:1024px; height:768px; min-width:800px; margin:0 auto; - border:1px solid white; + /*border:1px solid white;*/ } .holder{ width:800px; + min-height:600px; /*margin:0 auto;*/ } .btns{ text-align: center; } -.btns a{ +.btns button{ margin-left: 10px; margin-right: 10px; } -.btns a i{ +.btns button i{ margin-right: 6px; } .title{ @@ -84,4 +85,35 @@ h4{ margin-left: 10px; margin-right: 5px; color: #ffffff; +} +.luckerList h5{ + font-size: 22px; + margin-top: 10px; + margin-bottom: 10px; + padding-bottom: 8px; + padding-top: 8px; + border-bottom: 1px solid rgba(34, 36, 38, .15); +} +.luckerList{ + padding-left: 10px; + padding-right: 10px; + box-sizing: border-box; +} +.luckerList ul{ + padding-left: 10px; + padding-right: 10px; + box-sizing: border-box; + list-style: none; +} +.luckerList ul li:first-child{ + border-top: none; +} +.luckerList ul li{ + box-sizing: border-box; + font-size: 16px; + padding-bottom: 10px; + /*border-bottom: 1px solid rgba(34, 36, 38, .15);*/ +} +.luckerList ul li span{ + font-size: 12px; } \ No newline at end of file diff --git a/src/static/index.js b/src/static/index.js index 19db7d5..17f5414 100644 --- a/src/static/index.js +++ b/src/static/index.js @@ -1,5 +1,5 @@ $(document).ready(function () { - new UI(); + new Index(); }); class BS { @@ -34,8 +34,7 @@ class BS { } static getLuckyUsers() { - return this.fetch('/luckless_users'); - + return this.fetch('/lucky_users'); } static getAwards() { @@ -55,7 +54,7 @@ class BS { } -class UI { +class Index { constructor() { this.running = false; this.currentAward = ''; @@ -93,18 +92,15 @@ class UI { }; this.buildCloud().then(() => { - this.settings.entries = this.entries; this.svg3DTagCloud = new SVG3DTagCloud(document.getElementById('holder'), this.settings); }); this.bindEvent(); this.initVisualSocket(); - BS.getAwards().then(resp => { - console.log(resp) - }) + } buildCloud() { - return BS.getUsers().then((resp) => { + return BS.getLucklessUsers().then((resp) => { console.log(resp); let entry = []; $(resp.data).each((i, val) => { @@ -117,14 +113,26 @@ class UI { }) }); this.entries = entry; + this.settings.entries = this.entries; + }) + } + + rebuild() { + this.buildCloud().then(() => { + $('.holder').empty(); + this.svg3DTagCloud = new SVG3DTagCloud(document.getElementById('holder'), this.settings); }) + } initVisualSocket() { + // this.refreshCurrentAward(); let tempAwardId = ''; setInterval(() => { tempAwardId = localStorage.getItem('current_award'); if (this.currentAward !== tempAwardId) { + /*change*/ + // window.location.reload(1); this.currentAward = tempAwardId; this.refreshCurrentAward(); } @@ -132,6 +140,7 @@ class UI { } refreshCurrentAward() { + if (this.currentAward === '') return; BS.getAward(this.currentAward).then((resp) => { console.log(resp); if (resp.status === 200) { @@ -157,25 +166,29 @@ class UI { }); }); $('#end').click(() => { + if (!this.running) { + return; + } console.log('click'); BS.stopAndResult(this.currentAward).then(resp => { + this.running = false; console.log(resp); if (resp.status === 200) { this.render(resp.data, 0); } }); }); - $('#test').click(() => { + $('#luckyUsers').click(() => { this.list(); }); } - render(data, i) { // debugger if (i >= data.length) { this.currentlist(data); + this.rebuild(); return; } this.chose(data[i]).then(() => { @@ -185,7 +198,6 @@ class UI { } stop() { - this.running = false; this.svg3DTagCloud.reset(); this.svg3DTagCloud.speed(1); } @@ -225,6 +237,7 @@ class UI { layer.open({ type: 1, area: '800px', + skin: 'layui-layer-lan', //样式类名 offset: [offset.top, offset.left], closeBtn: 1, //不显示关闭按钮 anim: 3, @@ -236,15 +249,55 @@ class UI { list() { let offset = $(".holder").offset(); - layer.open({ - type: 1, - area: '800px', - offset: [offset.top, offset.left], - closeBtn: 1, //不显示关闭按钮 - anim: 3, - title: '本次中奖名单', - shadeClose: false, //开启遮罩关闭 - content: '
    • 1111
    • 111
    • 2222
    ' + let awards={}; + let load=layer.load(2); + BS.getAwards().then(resp=>{ + resp.data.map((val)=>{ + console.log(val); + if(typeof awards[val.award_id]==="undefined"){ + awards[val.award_id]={}; + } + awards[val.award_id].name = val.award_name; + awards[val.award_id].data=[]; + + }) + + }).then(()=>{ + return BS.getLuckyUsers().then(resp => { + resp.data.map(val=>{ + awards[val.award_id].data.push(val) + }) + }); + }).then(()=>{ + layer.close(load); + console.log(awards); + let content = ``; + for(let key of Object.keys(awards)){ + let award = awards[key]; + let lisArray=award.data.map((data)=>{ + return `
  • ${data.name}【${data.uid}】
    • ` + }); + content+=` +
    +
    ${award.name}
    +
      + ${lisArray.join("")} +
    +
    `; + } + layer.open({ + type: 1, + area: '800px', + skin: 'layui-layer-lan', //样式类名 + offset: [offset.top, offset.left], + closeBtn: 1, //不显示关闭按钮 + anim: 3, + title: '所有中奖名单', + shadeClose: false, //开启遮罩关闭 + content: ` +
    ${content} +
    ` + }); }); } } diff --git a/src/static/manage.css b/src/static/manage.css new file mode 100644 index 0000000..91e0d14 --- /dev/null +++ b/src/static/manage.css @@ -0,0 +1,47 @@ +.fr { + float: right; +} + +.list { + padding: 0; + display: block; + list-style: none; +} + +.list > li:hover { + background: #f0f0f0; +} + +.list > li { + padding-top: 5px; + padding-bottom: 5px; + display: list-item; + box-sizing: border-box; + border-top: 1px solid rgba(34, 36, 38, .15); +} + +.list > li.cur .fr:before { + content: '当前轮'; + font-size: 12px; +} + +.list > li > div { + display: block; + vertical-align: middle; +} + +.list > li:after { + content: ""; + clear: both; + display: block; + height: 0; +} + +.list > li .content { + font-size: 16px; + line-height: 1.5; +} + +.list > li:first-child { + border-top: none; +} \ No newline at end of file diff --git a/src/static/manage.js b/src/static/manage.js index e383113..3f43688 100644 --- a/src/static/manage.js +++ b/src/static/manage.js @@ -21,7 +21,7 @@ class BS { } static addAwards(award_name, award_capacity) { - award_capacity*=1; + award_capacity *= 1; return this.fetch('/add_award', { award_name, award_capacity }); @@ -30,56 +30,88 @@ class BS { static getAwards() { return this.fetch('/awards'); } - static setCurrent(id){ - return new Promise(resolve=>{ - let prev =localStorage.getItem('current_award')||''; - localStorage.setItem('prev_award',prev); - localStorage.setItem('current_award',id); + + static setCurrent(id) { + return new Promise(resolve => { + let prev = localStorage.getItem('current_award') || ''; + localStorage.setItem('prev_award', prev); + localStorage.setItem('current_award', id); resolve(localStorage.getItem('current_award')); }) } + + static getCurrent() { + return localStorage.getItem('current_award'); + } } $(function () { $('#add').click(e => { layer.open({ - title:'增加', - content: `
    -奖品名
    -数量 -
    `, - yes: function () { + title: '增加', + content: ` +
    奖品名
    +
    数 量
    +`, + yes: function (index) { let name = $('#addname').val(); let num = $('#addnum').val(); BS.addAwards(name, num).then(resp => { console.log(resp); - flushAwards() + flushAwards(); + if (resp.status === 200) { + layer.close(index); + } else { + alert(resp.msg); + } }); } }); }); $('#reset').click(e => { - BS.fetch('/reset').then(resp => { + layer.confirm('确定要重置吗', (index) => { + BS.fetch('/reset').then(resp => { + if (resp.status === 200) { + layer.close(index); + } + }); }); }); - $(document).on('click','.set',e=>{ + $(document).on('click', '.js-set', e => { let aid = $(e.target).data('aid'); - BS.setCurrent(aid).then((resp)=>{ - console.log(resp) + let $lis = $('#awardList').find('li'); + BS.setCurrent(aid).then((resp) => { + $lis.removeClass('cur'); + $(e.target).closest('li').addClass('cur'); }) - }) + }).on('click', '.js-remove', e => { + let aid = $(e.target).data('aid'); + layer.confirm('确认要删除该项？',()=>{ + layer.alert('暂不支持') + }) + }); flushAwards() }); function flushAwards() { + let currentAward = BS.getCurrent(); BS.getAwards().then(resp => { - console.log(resp) - let ul = '' + console.log(resp); + let ul = ''; resp.data.forEach((val) => { - let list = `
    • ` + let list = ` +
  • +
    + 设置成当前轮 + +
    +
    + 奖项名称：${val.award_name}，数量：${val.award_capacity} +
    +
    • `; ul += list; }) - $('ul').html(ul) + $('#awardList').html(ul) }) } \ No newline at end of file diff --git a/src/templates/index.html b/src/templates/index.html index 28585a0..3ca713e 100644 --- a/src/templates/index.html +++ b/src/templates/index.html @@ -24,9 +24,9 @@

    - 开始 - 停止 - 中奖结果 + + +

    diff --git a/src/templates/manage.html b/src/templates/manage.html index 0ca7c69..7d57269 100644 --- a/src/templates/manage.html +++ b/src/templates/manage.html @@ -6,22 +6,14 @@ - + -