some_news
/
index.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>iview example</title>
    <link rel="stylesheet" type="text/css" href="./static/styles/iview.css">
    <script type="text/javascript" src="http://vuejs.org/js/vue.min.js"></script>
    <script type="text/javascript" src="./static/iview.min.js"></script>
    <style>
        .index-list {
            margin-top: 12px;
        }
    </style>
</head>
<body>
<div id="app">
    <i-Menu mode="horizontal" theme="light" active-name="1">
        <Menu-item name="1">
            Nodejs
        </Menu-item>
        <Menu-item name="2">
            列表
        </Menu-item>
        <Menu-item name="4">
            关于
        </Menu-item>
    </i-Menu>

    <Row>
        <i-col offset="3" span="18" class="index-list">
            <Tabs type="card" :animated="false" @on-click="get_tab">
                <Tab-pane label="疯狂的项目" name="mad_datas">
                    <i-Table :columns="col" :data="mad_datas"></i-Table>
                </Tab-pane>
                <Tab-pane label="通用项目" name="common_datas">
                    <i-Table :columns="col" :data="common_datas"></i-Table>
                </Tab-pane>
                <Tab-pane label="函数式项目" name="functional_datas">
                    <i-Table :columns="col" :data="functional_datas"></i-Table>
                </Tab-pane>
                <Tab-pane label="http项目" name="http_datas">
                    <i-Table :columns="col" :data="http_datas"></i-Table>
                </Tab-pane>
            </Tabs>

        </i-col>
    </Row>


    <!--<i-button @click="show">Click me!</i-button>-->
    <!--<Modal v-model="visible" title="Welcome">欢迎使用 iView</Modal>-->
</div>
<script>
    const mad_urls = ['https://github.com/feross/webtorrent','https://github.com/mafintosh/peerflix','https://github.com/ipfs/js-ipfs','https://github.com/cjb/GitTorrent','https://github.com/mafintosh/peerwiki','https://github.com/mafintosh/peercast','https://github.com/Turfjs/turf','https://github.com/mafintosh/webcat','https://github.com/erelsgl/limdu','https://github.com/kadtools/kad','https://github.com/twobucks/seedshot','https://github.com/creationix/js-git','https://github.com/skale-me/skale-engine'];
    const common_urls = ['https://github.com/sindresorhus/np','https://github.com/sindresorhus/trash','https://github.com/sindresorhus/npm-name','https://github.com/sindresorhus/speed-test','https://github.com/sindresorhus/emoj','https://github.com/sindresorhus/pageres','https://github.com/sindresorhus/cpy','https://github.com/MrRio/vtop','https://github.com/sindresorhus/empty-trash','https://github.com/sindresorhus/is-up','https://github.com/sindresorhus/is-online','https://github.com/sindresorhus/public-ip','https://github.com/sindresorhus/clipboard-cli','https://github.com/chjj/ttystudio','https://github.com/sindresorhus/xo','https://github.com/feross/standard','https://github.com/samverschueren/dev-time-cli','https://github.com/alanshaw/david','https://github.com/indexzero/http-server','https://github.com/tapio/live-server','https://github.com/kessler/node-bcat','https://github.com/pawurb/normit','https://github.com/slap-editor/slap','https://github.com/danielstjules/jsinspect','https://github.com/millermedeiros/esformatter','https://github.com/sindresorhus/fkill-cli','https://github.com/danielstjules/pjs','https://github.com/davglass/license-checker','https://github.com/juliangruber/browser-run','https://github.com/sindresorhus/tmpin','https://github.com/runvnc/modhelp','https://github.com/kevva/wifi-password-cli','https://github.com/sindresorhus/wallpaper','https://github.com/kevva/brightness-cli','https://github.com/maxogden/torrent','https://github.com/jasnell/tfa','https://github.com/kilianc/rtail','https://github.com/sindresorhus/kill-tabs','https://github.com/wooorm/alex','https://github.com/dthree/vantage','https://github.com/noraesae/pen','https://github.com/beatfreaker/subdownloader','https://github.com/sindresorhus/dark-mode','https://github.com/nogizhopaboroda/iponmap','https://github.com/Javascipt/Jsome','https://github.com/mischah/itunes-remote','https://github.com/beatfreaker/text-meme-cli','https://github.com/samverschueren/mobicon-cli','https://github.com/samverschueren/mobisplash-cli','https://github.com/rtfpessoa/diff2html-cli','https://github.com/dthree/cash','https://github.com/sindresorhus/vaca','https://github.com/sindresorhus/gh-home','https://github.com/sindresorhus/npm-home','https://github.com/VictorBjelkholm/trymodule','https://github.com/cortezcristian/terminal-recorder','https://github.com/kucherenko/jscpd','https://github.com/Raathigesh/Atmo','https://github.com/siddharthkp/auto-install','https://github.com/linuxenko/lessmd','https://github.com/siddharthkp/cost-of-modules','https://github.com/localtunnel/localtunnel'];
    const functional_urls =['https://lodash.com/','https://github.com/facebook/immutable-js','http://swannodette.github.io/mori/','http://ramdajs.com/','http://folktalejs.org/','http://documentcloud.github.io/underscore-contrib/','http://moutjs.com/','http://baconjs.github.io/','http://reactivex.io/','https://github.com/dtao/lazy.js','https://github.com/rpominov/kefir'];
    const http_urls = ['https://github.com/sindresorhus/got','https://github.com/sindresorhus/gh-got','https://github.com/mzabriskie/axios','https://github.com/request/request','https://github.com/pgte/nock','https://github.com/indutny/node-spdy','https://github.com/hapijs/wreck','https://github.com/kevva/download','https://github.com/nodejitsu/node-http-proxy','https://github.com/h2non/rocky','https://github.com/visionmedia/superagent','https://github.com/bitinn/node-fetch','https://github.com/bbc/flashheart','https://github.com/micromata/http-fake-backend'];

    const trans_url_map = url=>{
        const obj={};
        obj.title = url.split('/').pop() || url.split('//').pop();
        obj.url = url;
        return obj;
    };
    const mad_datas = mad_urls.map(trans_url_map);
    const common_datas = common_urls.map(trans_url_map);
    const functional_datas = functional_urls.map(trans_url_map);
    const http_datas = http_urls.map(trans_url_map);

    const app = new Vue({
        el: '#app',
        data: {
            tab_name:'mad_datas',
            visible: false,
            col:[{
                title:'项目名称',
                key:'title'
            },{
                title:'地址',
                key:'url'
            },{
                title:'操作',
                key:'go',
                render: (h, params) => {
                    return h('div', [
                        h('Button', {
                            props: {
                                type: 'text',
                                size: 'small'
                            },
                            on:{
                                click:function(){
                                    app.show(params);
                                }
                            }
                        }, '查看')
                    ]);
                }
            }],
            mad_datas,
            common_datas,
            functional_datas,
            http_datas
        },
        methods: {
            show: function ({index}) {
                const {url} = app[app.tab_name][index];
                window.open(url);
            },
            get_tab(params){
                this.tab_name = params;
            }
        }
    })
</script>
</body>
</html>