diff --git a/src/AppConfig.js b/src/AppConfig.js index a5a063b0..3b223f44 100644 --- a/src/AppConfig.js +++ b/src/AppConfig.js @@ -56,7 +56,7 @@ window._debugType = debugType; export function initAxiosInterceptors(props) { initOnlineOfflineListener(); var proxy = "http://localhost:3000"; - proxy = "https://testforgeplus.trustie.net"; + proxy = "http://192.168.1.37:3000"; const requestMap = {}; window.setfalseInRequestMap = function (keyName) { diff --git a/src/mulan/HOC/Index.scss b/src/mulan/HOC/Index.scss index 886c61de..27ad3572 100644 --- a/src/mulan/HOC/Index.scss +++ b/src/mulan/HOC/Index.scss @@ -48,10 +48,10 @@ padding-top: 60px; } .footsnav{ - // position: absolute; - // width: 100%; - // bottom: 0px; - // left: 0px; + position: absolute; + width: 100%; + bottom: 0px; + left: 0px; text-align: center; padding-bottom:10px; background-color: #fff; diff --git a/src/mulan/Index.jsx b/src/mulan/Index.jsx index 358af59b..7c1a1900 100644 --- a/src/mulan/Index.jsx +++ b/src/mulan/Index.jsx @@ -1,4 +1,4 @@ -import React, { useEffect } from 'react'; +import React, { useEffect, useState } from 'react'; import { HomeHoc } from './HOC/HomeHoc'; import { Link } from 'react-router-dom'; import './Index.scss'; @@ -11,8 +11,25 @@ import icon2 from './images/icon2.png'; import active1 from './images/active1.jpg'; import active2 from './images/active2.png'; import DefaultImg from './images/default.png'; +import perl from './images/perl.png'; +import deno from './images/deno.png'; +import go7c from './images/go7c.png'; +// import axios from 'axios'; function Index(props){ + // const [ recommand ,setRecommand ] =useState(undefined); + // useEffect(()=>{ + // getRecommand(); + // },[]) + + // function getRecommand(){ + // const url = `/projects/recommand.json`; + // axios.get(url).then(result=>{ + // if(result && result.data){ + // setRecommand(result.data.data); + // } + // }).catch(error=>{}) + // } return(
@@ -26,11 +43,27 @@ function Index(props){
@@ -126,7 +143,15 @@ function Index(props){
@@ -169,7 +194,6 @@ function Index(props){
木兰开源社区版权所有 ©2020 技术支持:长沙智擎科技 粤ICP备12009483号 -
diff --git a/src/mulan/Index.scss b/src/mulan/Index.scss index e8b9fc37..efa9cf87 100644 --- a/src/mulan/Index.scss +++ b/src/mulan/Index.scss @@ -207,6 +207,17 @@ margin-right: 10px; } } + .imgBox{ + width: 145px; + height: 90px; + display: flex; + align-items: center; + justify-content: center; + img{ + max-width: 100%; + max-height: 100%; + } + } .news-title{ font-size: 16px; margin-bottom:5px; diff --git a/src/mulan/Projects/Index.jsx b/src/mulan/Projects/Index.jsx index 1d690df0..61145826 100644 --- a/src/mulan/Projects/Index.jsx +++ b/src/mulan/Projects/Index.jsx @@ -1,66 +1,100 @@ -import React from 'react'; +import React, { useEffect, useState } from 'react'; import { HOC } from '../HOC/Index'; import {Link} from 'react-router-dom'; import Title from '../../forge/Component/Title'; import { AlignCenter } from '../../forge/Component/layout'; import './Index.scss'; import DefaultImg from '../images/default.png'; - +const data =[ + { + name:"LAMP - Web开发平台", + desc:"LAMP是一个开源 Web开发平台,它使用Linux作为操作系统,使用Apache作为Web服务器,使用MySQL作为关系数据库管理系统,以及使用PHP作为面向对象的脚本语言。(有时使用Perl或Python代替PHP。)", + tags:["go","mit","linux"], + imageurl:"" + }, + { + name:"OpenStack - 一个开源的云计算管理平台项目", + desc:"OpenStack是一个开源的云计算管理平台项目,是一系列软件开源项目的组合。由NASA(美国国家航空航天局)和Rackspace合作研发并发起,以Apache许可证(Apache软件基金会发布的一个自由软件许可证)授权的开源代码项目。", + tags:["python/C++","Apache License 2.0","Linux"], + imageurl:"" + }, + { + name:"QEMU - 一种通用的开源计算机仿真器和虚拟器", + desc:"QEMU是一种通用的开源计算机仿真器和虚拟器。", + tags:["C","GPL","Linux"], + imageurl:"" + }, + { + name:"OpenBMC - 开源的下一代系统管理软件架构", + desc:"OpenBMC是一个开源的软件架构用于构建一个完整的基板管理控制器(BMC)的Linux image。", + tags:["C","GPL","Linux"], + imageurl:"" + }, + { + name:"Redis - key-value存储系统", + desc:"Redis是一个使用ANSI C语言编写的开源key-value内存数据库系统,Redis支持字符串(String), 哈希(Hash), 列表(list), 集合(sets) 和 有序集合(sorted sets)等数据结构类型,并提供多种语言的API。", + tags:["C/C++","BSD","Linux"], + imageurl:"" + }, + { + name:"ElasticSearch - 分布式多用户搜索引擎", + desc:"ElasticSearch是一个基于Lucene的搜索服务器。它提供了一个分布式多用户能力的全文搜索引擎。", + tags:["Java","Elastic License","Linux"], + imageurl:"" + }, + { + name:"Redis - key-value存储系统", + desc:"Redis是一个使用ANSI C语言编写的开源key-value内存数据库系统,Redis支持字符串(String), 哈希(Hash), 列表(list), 集合(sets) 和 有序集合(sorted sets)等数据结构类型,并提供多种语言的API。", + tags:["C/C++","BSD","Linux"], + imageurl:"" + }, + { + name:"MySQL - 关系型数据库", + desc:"MySQL 是一个关系型数据库管理系统。", + tags:["C/C++","GPL","Linux"], + imageurl:"" + } +] function Index(props){ + const [ list , setList ] = useState(undefined); + useEffect(()=>{ + setList(data); + },[]) return(
基础类开源软件 -
-
  • - LAMP - Web开发平台 - -

    LAMP是一个开源 Web开发平台,它使用Linux作为操作系统,使用Apache作为Web服务器,使用MySQL作为关系数据库管理系统,以及使用PHP作为面向对象的脚本语言。(有时使用Perl或Python代替PHP。)

    - -
    -
    - Go - MIT - Linux + { + list && list.length > 0 ? +
    + { + list.map((item,key)=>{ + return( +
  • + {item.name} + +

    {item.desc}

    + +
    + { + item.tags && item.tags.length>0 && +
    + { + item.tags.map((i,k)=>{ + return( + {i} + ) + }) + } +
    + } +
  • + ) + }) + }
    - -
  • - LAMP - Web开发平台 - -

    LAMP是一个开源 Web开发平台,它使用Linux作为操作系统,使用Apache作为Web服务器,使用MySQL作为关系数据库管理系统,以及使用PHP作为面向对象的脚本语言。(有时使用Perl或Python代替PHP。)

    - -
    -
    - Go - MIT - Linux -
    -
  • -
  • - LAMP - Web开发平台 - -

    LAMP是一个开源 Web开发平台,它使用Linux作为操作系统,使用Apache作为Web服务器,使用MySQL作为关系数据库管理系统,以及使用PHP作为面向对象的脚本语言。(有时使用Perl或Python代替PHP。)

    - -
    -
    - Go - MIT - Linux -
    -
  • -
  • - LAMP - Web开发平台 - -

    LAMP是一个开源 Web开发平台,它使用Linux作为操作系统,使用Apache作为Web服务器,使用MySQL作为关系数据库管理系统,以及使用PHP作为面向对象的脚本语言。(有时使用Perl或Python代替PHP。)

    - -
    -
    - Go - MIT - Linux -
    -
  • -
    + :"" + }
    ) diff --git a/src/mulan/Projects/Index.scss b/src/mulan/Projects/Index.scss index b01914b2..1c193d3e 100644 --- a/src/mulan/Projects/Index.scss +++ b/src/mulan/Projects/Index.scss @@ -1,18 +1,20 @@ .panels{ width: 1200px; - margin:0px auto; + margin:20px auto 60px; .projectsList{ margin:20px; box-shadow: 0px 0px 10px rgba(0,0,0,0.1); .lists{ + min-height:500px; padding:20px 30px; display: flex; flex-wrap: wrap; + align-items: flex-start;; & > li{ margin-right: 2%; border: 1px solid #eee; width: 32%; - margin-bottom: 20px; + margin-bottom: 25px; border-radius: 4px; min-height: 200px; box-shadow: 0 4px 8px 0 rgba(95,101,105,0.1); @@ -20,7 +22,7 @@ transform: translateY(-2px); box-shadow: 0 12px 20px 0 rgba(95,101,105,0.15); } - &:nth-child(3){ + &:nth-child(3n){ margin-right: 0px; } .listName{ diff --git a/src/mulan/images/deno.png b/src/mulan/images/deno.png new file mode 100644 index 00000000..19eb82b6 Binary files /dev/null and b/src/mulan/images/deno.png differ diff --git a/src/mulan/images/go7c.png b/src/mulan/images/go7c.png new file mode 100644 index 00000000..419c94b1 Binary files /dev/null and b/src/mulan/images/go7c.png differ diff --git a/src/mulan/images/perl.png b/src/mulan/images/perl.png new file mode 100644 index 00000000..a9e521a5 Binary files /dev/null and b/src/mulan/images/perl.png differ