Skip to content

W
wx-app-hairDryer
Commit e64d39db by 姜雷
Options

init

parent 2d46949e
Showing with 255 additions and 106 deletions
.gitignore
......@@ -21,3 +21,4 @@
npm-debug.log*
yarn-debug.log*
yarn-error.log*
package-lock.json
.postcssrc.js 0 → 100644
// https://github.com/michael-ciniawsky/postcss-load-config
module.exports = {
plugins: {
'postcss-flexbugs-fixes': {},
'postcss-import': {},
'postcss-url': {},
'postcss-aspect-ratio-mini': {},
'postcss-write-svg': {
utf8: false,
},
'postcss-cssnext': {},
'postcss-px-to-viewport': {
viewportWidth: 640, // (Number) The width of the viewport.
viewportHeight: 1136, // (Number) The height of the viewport.
unitPrecision: 5, // (Number) The decimal numbers to allow the REM units to grow to.
viewportUnit: 'vw', // (String) Expected units.
selectorBlackList: ['.ignore', '.hairlines'], // (Array) The selectors to ignore and leave as px.
minPixelValue: 1, // (Number) Set the minimum pixel value to replace.
mediaQuery: false, // (Boolean) Allow px to be converted in media queries.
},
'postcss-viewport-units': {},
cssnano: {
preset: 'advanced',
autoprefixer: false,
'postcss-zindex': false,
},
},
};
package.json
......@@ -2,9 +2,12 @@
"name": "wx-school-home",
"version": "0.1.0",
"private": true,
"homepage": "/schoolHome",
"dependencies": {
"postcss-px-to-viewport": "^1.1.0",
"react": "^16.8.2",
"react-dom": "^16.8.2",
"react-router-dom": "^4.3.1",
"react-scripts": "2.1.5"
},
"scripts": {
......
public/index.html
......@@ -13,6 +13,8 @@
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<script src="//g.alicdn.com/fdilab/lib3rd/viewport-units-buggyfill/0.6.2/??viewport-units-buggyfill.hacks.min.js,viewport-units-buggyfill.min.js"></script>
<script src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
......@@ -27,15 +29,12 @@
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
<script>
window.onload = function() {
window.viewportUnitsBuggyfill.init({
hacks: window.viewportUnitsBuggyfillHacks,
});
};
</script>
</body>
</html>
public/manifest.json
{
"short_name": "React App",
"name": "Create React App Sample",
"short_name": "School Home",
"name": "Wechat School Home",
"icons": [
{
"src": "favicon.ico",
......
src/App.css deleted 100644 → 0
.App {
text-align: center;
}
.App-logo {
animation: App-logo-spin infinite 20s linear;
height: 40vmin;
pointer-events: none;
}
.App-header {
background-color: #282c34;
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: calc(10px + 2vmin);
color: white;
}
.App-link {
color: #61dafb;
}
@keyframes App-logo-spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
src/App.js deleted 100644 → 0
import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
class App extends Component {
render() {
return (
<div className="App">
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<p>
Edit <code>src/App.js</code> and save to reload.
</p>
<a
className="App-link"
href="https://reactjs.org"
target="_blank"
rel="noopener noreferrer"
>
Learn React
</a>
</header>
</div>
);
}
}
export default App;
src/App.test.js deleted 100644 → 0
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
it('renders without crashing', () => {
const div = document.createElement('div');
ReactDOM.render(<App />, div);
ReactDOM.unmountComponentAtNode(div);
});
src/containers/App.js 0 → 100644
import React, { useState } from 'react';
import { Switch, Route } from 'react-router-dom';
import UserInfoContext, { initUserinfo } from '../context/userinfo-context';
import Index from './Index/Index';
function App() {
const [userinfo, setUserinfo] = useState(initUserinfo);
return (
<UserInfoContext.Provider
value={{
userinfo: userinfo,
updateUserInfo: setUserinfo,
}}>
<Switch>
<Route exact path='/' component={Index} />
</Switch>
</UserInfoContext.Provider>
);
}
export default App;
src/containers/Home/Home.js 0 → 100644
import React, { useContext } from 'react';
import UserInfoContext from '../../context/userinfo-context';
function Home() {
const { userinfo, updateUserInfo } = useContext(UserInfoContext);
return (
<div>
Home
{userinfo.userId}
<button
onClick={() =>
updateUserInfo({
userId: '3456',
})
}>
更新用户
</button>
</div>
);
}
export default Home;
src/containers/Index/Index.js 0 → 100644
import React, { useState, useEffect } from 'react';
import './style.css';
function Index() {
const [loginText, setLoginText] = useState('载入中...');
useEffect(() => {
const { search } = window.location;
const paramsString = search.substring(1);
const searchParams = new URLSearchParams(paramsString);
const code = searchParams.get('code');
console.log(code);
if (code) {
setLoginText('微信授权中...');
} else {
console.log('跳转微信授权接口');
// const { APP_ID } = config;
// console.log(APP_ID);
// let rUrl = encodeURIComponent(window.location.href.split('#')[0]);
// window.location.href = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${APP_ID}&redirect_uri=${rUrl}&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect`;
}
}, []);
return <div className='LoginIndex'>{loginText}</div>;
}
export default Index;
src/containers/Index/style.css 0 → 100644
.LoginIndex {
padding: 50px;
}
src/context/userinfo-context.js 0 → 100644
import React from 'react';
function is_weixn() {
var ua = navigator.userAgent.toLowerCase();
return ua.match(/MicroMessenger/i) === 'micromessenger';
}
export const initUserinfo = {
isWx: is_weixn(),
userId: '123',
token: '',
campusId: '',
campusName: '',
barcode: '',
position: {
id: null,
position: null,
mode: null,
isBind: false,
deviceType: null,
},
};
export const UserContext = React.createContext({
userinfo: initUserinfo,
updateUserInfo: () => {},
});
export default UserContext;
src/index.css deleted 100644 → 0
body {
margin: 0;
padding: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen",
"Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
code {
font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
monospace;
}
src/index.js
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import './styles/index.css';
import App from './containers/App';
import * as serviceWorker from './serviceWorker';
import { BrowserRouter } from 'react-router-dom';
ReactDOM.render(<App />, document.getElementById('root'));
import packageConfig from '../package.json';
ReactDOM.render(
<BrowserRouter basename={packageConfig.homepage}>
<App />
</BrowserRouter>,
document.getElementById('root'),
);
// If you want your app to work offline and load faster, you can change
// unregister() to register() below. Note this comes with some pitfalls.
......
src/logo.svg deleted 100644 → 0
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.9 595.3">
<g fill="#61DAFB">
<path d="M666.3 296.5c0-32.5-40.7-63.3-103.1-82.4 14.4-63.6 8-114.2-20.2-130.4-6.5-3.8-14.1-5.6-22.4-5.6v22.3c4.6 0 8.3.9 11.4 2.6 13.6 7.8 19.5 37.5 14.9 75.7-1.1 9.4-2.9 19.3-5.1 29.4-19.6-4.8-41-8.5-63.5-10.9-13.5-18.5-27.5-35.3-41.6-50 32.6-30.3 63.2-46.9 84-46.9V78c-27.5 0-63.5 19.6-99.9 53.6-36.4-33.8-72.4-53.2-99.9-53.2v22.3c20.7 0 51.4 16.5 84 46.6-14 14.7-28 31.4-41.3 49.9-22.6 2.4-44 6.1-63.6 11-2.3-10-4-19.7-5.2-29-4.7-38.2 1.1-67.9 14.6-75.8 3-1.8 6.9-2.6 11.5-2.6V78.5c-8.4 0-16 1.8-22.6 5.6-28.1 16.2-34.4 66.7-19.9 130.1-62.2 19.2-102.7 49.9-102.7 82.3 0 32.5 40.7 63.3 103.1 82.4-14.4 63.6-8 114.2 20.2 130.4 6.5 3.8 14.1 5.6 22.5 5.6 27.5 0 63.5-19.6 99.9-53.6 36.4 33.8 72.4 53.2 99.9 53.2 8.4 0 16-1.8 22.6-5.6 28.1-16.2 34.4-66.7 19.9-130.1 62-19.1 102.5-49.9 102.5-82.3zm-130.2-66.7c-3.7 12.9-8.3 26.2-13.5 39.5-4.1-8-8.4-16-13.1-24-4.6-8-9.5-15.8-14.4-23.4 14.2 2.1 27.9 4.7 41 7.9zm-45.8 106.5c-7.8 13.5-15.8 26.3-24.1 38.2-14.9 1.3-30 2-45.2 2-15.1 0-30.2-.7-45-1.9-8.3-11.9-16.4-24.6-24.2-38-7.6-13.1-14.5-26.4-20.8-39.8 6.2-13.4 13.2-26.8 20.7-39.9 7.8-13.5 15.8-26.3 24.1-38.2 14.9-1.3 30-2 45.2-2 15.1 0 30.2.7 45 1.9 8.3 11.9 16.4 24.6 24.2 38 7.6 13.1 14.5 26.4 20.8 39.8-6.3 13.4-13.2 26.8-20.7 39.9zm32.3-13c5.4 13.4 10 26.8 13.8 39.8-13.1 3.2-26.9 5.9-41.2 8 4.9-7.7 9.8-15.6 14.4-23.7 4.6-8 8.9-16.1 13-24.1zM421.2 430c-9.3-9.6-18.6-20.3-27.8-32 9 .4 18.2.7 27.5.7 9.4 0 18.7-.2 27.8-.7-9 11.7-18.3 22.4-27.5 32zm-74.4-58.9c-14.2-2.1-27.9-4.7-41-7.9 3.7-12.9 8.3-26.2 13.5-39.5 4.1 8 8.4 16 13.1 24 4.7 8 9.5 15.8 14.4 23.4zM420.7 163c9.3 9.6 18.6 20.3 27.8 32-9-.4-18.2-.7-27.5-.7-9.4 0-18.7.2-27.8.7 9-11.7 18.3-22.4 27.5-32zm-74 58.9c-4.9 7.7-9.8 15.6-14.4 23.7-4.6 8-8.9 16-13 24-5.4-13.4-10-26.8-13.8-39.8 13.1-3.1 26.9-5.8 41.2-7.9zm-90.5 125.2c-35.4-15.1-58.3-34.9-58.3-50.6 0-15.7 22.9-35.6 58.3-50.6 8.6-3.7 18-7 27.7-10.1 5.7 19.6 13.2 40 22.5 60.9-9.2 20.8-16.6 41.1-22.2 60.6-9.9-3.1-19.3-6.5-28-10.2zM310 490c-13.6-7.8-19.5-37.5-14.9-75.7 1.1-9.4 2.9-19.3 5.1-29.4 19.6 4.8 41 8.5 63.5 10.9 13.5 18.5 27.5 35.3 41.6 50-32.6 30.3-63.2 46.9-84 46.9-4.5-.1-8.3-1-11.3-2.7zm237.2-76.2c4.7 38.2-1.1 67.9-14.6 75.8-3 1.8-6.9 2.6-11.5 2.6-20.7 0-51.4-16.5-84-46.6 14-14.7 28-31.4 41.3-49.9 22.6-2.4 44-6.1 63.6-11 2.3 10.1 4.1 19.8 5.2 29.1zm38.5-66.7c-8.6 3.7-18 7-27.7 10.1-5.7-19.6-13.2-40-22.5-60.9 9.2-20.8 16.6-41.1 22.2-60.6 9.9 3.1 19.3 6.5 28.1 10.2 35.4 15.1 58.3 34.9 58.3 50.6-.1 15.7-23 35.6-58.4 50.6zM320.8 78.4z"/>
<circle cx="420.9" cy="296.5" r="45.7"/>
<path d="M520.5 78.1z"/>
</g>
</svg>
src/styles/index.css 0 → 100644
body,
html {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
font-family: sans-serif;
}
figure,
p {
margin: 0;
padding: 0;
}
img {
display: block;
width: 100%;
}
[aspectratio] {
position: relative;
}
[aspectratio]::before {
content: '';
display: block;
width: 1px;
margin-left: -1px;
height: 0;
}
[aspectratio-content] {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
overflow: hidden;
}
[aspectratio-content] img {
width: 100%;
height: 100%;
vertical-align: top;
}
[w-750-260] {
aspect-ratio: '750:260';
}
[w-750-190] {
aspect-ratio: '750:190';
}
.bb1px {
position: relative;
}
.bb1px::after {
content: '';
display: block;
position: absolute;
width: 100%;
height: 1px;
margin-top: -1px;
left: 0;
right: 0;
bottom: 0;
background: #dcdcdc;
transform: scaleY(0.5);
}
.bt1px {
position: relative;
}
.bt1px::after {
content: '';
display: block;
position: absolute;
width: 100%;
height: 1px;
margin-top: -1px;
left: 0;
right: 0;
top: 0;
background: #dcdcdc;
transform: scaleY(0.5);
}
.ellipsis {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.ellipsis-2lines {
overflow: hidden;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
display: -webkit-box;
}
#root,
.App {
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
overflow-y: scroll;
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment