Merge remote-tracking branch 'origin/master'

config/webpack.config.dev.js

@@ -231,14 +231,8 @@ module.exports = {
                                         },
                                     },
                                 ],
-                                [
-                                    "import",
-                                    {
-                                        "libraryName": "antd",
-                                        "libraryDirectory": "es",
-                                        "style": "css",   // or 'css'
-                                    }
-                                ]
+                                ["import", {libraryName: "antd", libraryDirectory: "es", style: "css"},  "ant"],
+                                ["import", { libraryName: "antd-mobile", libraryDirectory: "lib", style: "css"}, "antd-mobile"]
                             ],
                             // This is a feature of `babel-loader` for webpack (not Babel itself).
                             // It enables caching results in ./node_modules/.cache/babel-loader/

package-lock.json

@@ -5875,7 +5875,8 @@
         },
         "ansi-regex": {
           "version": "2.1.1",
-          "bundled": true
+          "bundled": true,
+          "optional": true
         },
         "aproba": {
           "version": "1.2.0",
@@ -6240,7 +6241,8 @@
         },
         "safe-buffer": {
           "version": "5.1.1",
-          "bundled": true
+          "bundled": true,
+          "optional": true
         },
         "safer-buffer": {
           "version": "2.1.2",
@@ -6288,6 +6290,7 @@
         "strip-ansi": {
           "version": "3.0.1",
           "bundled": true,
+          "optional": true,
           "requires": {
             "ansi-regex": "^2.0.0"
           }
@@ -6326,11 +6329,13 @@
         },
         "wrappy": {
           "version": "1.0.2",
-          "bundled": true
+          "bundled": true,
+          "optional": true
         },
         "yallist": {
           "version": "3.0.2",
-          "bundled": true
+          "bundled": true,
+          "optional": true
         }
       }
     },

src/case/billApp/src/App.js → src/case/BillApp/src/App.js

@@ -1,7 +1,7 @@
 import React, { Component } from 'react';
 import { BrowserRouter as Router, Switch, Route} from 'react-router-dom';
 
-import NavBars from './components/Common/NavBar'
+import NavBars from './components/App/NavBar'
 import TabBarBottom from './components/App/TabBarBottom'
 
 import './App.css';

src/case/orderApp/src/components/Common/NavBar.jsx → src/case/BillApp/src/components/App/NavBar.jsx

@@ -18,7 +18,7 @@ export default class NavBars extends Component{
                     <Icon key="0" type="search" style={{ marginRight: '16px' }} />,
                     <Icon key="1" type="ellipsis" />,
                 ]}
-                ><span style={{fontSize:'14px'}}>电商小程序</span>
+                ><span style={{fontSize:'14px'}}>记账小程序</span>
                 </NavBar>
             </div>
         )

src/case/billApp/src/components/App/TabBarBottom.jsx → src/case/BillApp/src/components/App/TabBarBottom.jsx

@@ -48,7 +48,7 @@ class TabBarBottom extends React.Component {
   render() {
     //这里渲染一次
     return (
-      <div style={this.state.fullScreen ? { position: 'fixed', height: '100%', width: '100%', top: 0 } : { height: 400 }} className="TabBarBottom">
+      <div style={this.state.fullScreen ? { position: 'absolute', height: '100%', width: '100%', bottom: 0 } : { height: 400 }}>
         <TabBar
           unselectedTintColor="#949494"
           tintColor="#33A3F4"

src/case/billApp/src/components/HomePage/Button.jsx → src/case/BillApp/src/components/HomePage/Button.jsx

@@ -1,6 +1,6 @@
 import React, { Component } from 'react';
 import { Button, WhiteSpace, WingBlank } from 'antd-mobile';
-import { genPercentAdd } from 'antd/lib/upload/utils';
+// import { genPercentAdd } from 'antd/lib/upload/utils';
 
 export default function Buttons(){
     let buttonStyle={

src/case/billApp/src/components/HomePage/IconList.jsx → src/case/BillApp/src/components/HomePage/IconList.jsx

@@ -6,9 +6,9 @@ const Item = List.Item;
 
 
 export default class IconList extends Component{
-    constructor(props){
-        super(props)
-    }
+    // constructor(props){
+    //     super(props)
+    // }
 
     render(){
         return (

src/case/orderApp/src/App.js → src/case/OrderApp/src/App.js

@@ -2,15 +2,15 @@ import React, { Component } from 'react';
 
 import './App.css';
 
-import NavBars from './components/Common/NavBar'
+import NavBars from './components/App/NavBar'
 import TabBarBottom from './components/App/TabBarBottom'
 
 
 
 class OrderApp extends Component {
-  constructor(props){
-    super(props)
-  }
+  // constructor(props){
+  //   super(props)
+  // }
   
   render() {
     return (

src/case/shopApp/src/components/Common/NavBar.jsx → src/case/OrderApp/src/components/App/NavBar.jsx

@@ -18,7 +18,7 @@ export default class NavBars extends Component{
                     <Icon key="0" type="search" style={{ marginRight: '16px' }} />,
                     <Icon key="1" type="ellipsis" />,
                 ]}
-                ><span style={{fontSize:'14px'}}>电商小程序</span>
+                ><span style={{fontSize:'14px'}}>预约小程序</span>
                 </NavBar>
             </div>
         )

src/case/orderApp/src/components/App/TabBarBottom.css → src/case/OrderApp/src/components/App/TabBarBottom.css

@@ -1,7 +1,3 @@
-/* .TabBarBottom{
-    position: absolute;
-    bottom: 0;
-} */
 .subTitle{
     box-sizing: border-box;
     text-align: center;

src/case/orderApp/src/components/App/TabBarBottom.jsx → src/case/OrderApp/src/components/App/TabBarBottom.jsx

@@ -20,7 +20,7 @@ class TabBarBottom extends Component {
     if(page==='index'){
       //console.log(page)
       return (
-        <div style={{ backgroundColor: 'white', height: '100%', textAlign: 'center' }}>
+        <div className="pageWrap">
           <HomePage />
         </div>
       );
@@ -29,7 +29,7 @@ class TabBarBottom extends Component {
     if(page==='user'){
       //console.log(page)
       return (
-        <div style={{ backgroundColor: 'white', height: '100%', textAlign: 'center' }}>
+        <div className="pageWrap">
           <UserPage />
         </div>
       );
@@ -41,7 +41,7 @@ class TabBarBottom extends Component {
   render() {
     //这里渲染一次
     return (
-      <div style={this.state.fullScreen ? { position: 'fixed', height: '100%', width: '100%', top: 0 } : { height: 400 }} className="TabBarBottom">
+      <div style={this.state.fullScreen ? { position: 'absolute', height: '100%', width: '100%', bottom: 0 } : { height: 400 }} className="TabBarBottom">
         <TabBar
           unselectedTintColor="#949494"
           tintColor="#33A3F4"

src/case/orderApp/src/components/HomePage/Cards.jsx → src/case/OrderApp/src/components/HomePage/Cards.jsx

@@ -1,14 +1,14 @@
 import React, { Component } from 'react';
 import { Card, WingBlank, WhiteSpace } from 'antd-mobile';
-import { Item } from 'antd-mobile/lib/tab-bar';
+// import { Item } from 'antd-mobile/lib/tab-bar';
 import './Cards.css'
 
 
 class Cards extends Component{
-    constructor(props){
-        //console.log('111',props)
-        super(props)
-    }
+    // constructor(props){
+    //     //console.log('111',props)
+    //     super(props)
+    // }
 
     onClickChange(e,d){
         //console.log('onClickChange',e,d)

src/case/orderApp/src/components/HomePage/Slide.jsx → src/case/OrderApp/src/components/HomePage/Slide.jsx

@@ -37,7 +37,6 @@ class Slide extends React.Component {
           <Carousel
             autoplay={false}
             infinite
-            autoplay
             slideWidth={1}
             beforeChange={(from, to) => console.log(`slide from ${from} to ${to}`)}
             afterChange={index => console.log('slide to', index)}

src/case/shopApp/src/App.css → src/case/ShopApp/src/App.css

@@ -14,7 +14,7 @@
     padding: 15px 0;
     overflow-x: hidden;
     overflow-y: hidden;
-    background-color:#fff;
+    background:#fff;
     
 }
 
@@ -35,5 +35,11 @@ p.p1,p.p2,p.p3{
     font-size: 13px;
 }
 
+.pageWrap{
+    margin-top: 45px;
+    background: #ffffff;
+    border: 2px solid red;
+}
+
 
 

src/case/ShopApp/src/App.js

@@ -0,0 +1,42 @@
+import React, { Component } from 'react';
+import './App.css';
+// import 'antd-mobile/dist/antd-mobile.css';
+
+import NavBars from './components/App/NavBar'
+import TabBarBottom from './components/App/TabBarBottom'
+import ProductDetail from './components/ProductDetailPage/ProductDetail'
+
+class ShopApp extends Component {
+  //showComponent
+  constructor(props){
+    super(props)
+    this.state={
+      page:'',
+      product_id:''
+    }
+  }
+  renderPage(page=""){
+    if(page==='detail'){
+      return(<div className="pageWrap"><ProductDetail product_id={this.state.product_id}/></div>)
+    }else{
+      return(<div><TabBarBottom changePage={this.changePage.bind(this)}/></div>)
+    }
+  }
+
+  changePage(page='',product_id){
+    this.setState({page,product_id})
+  }
+  render() {
+    return (
+      <div className="AppWrap">
+        <div className="phone6s">
+          <div className="App">
+            <NavBars changePage={this.changePage.bind(this)}/>
+            {this.renderPage(this.state.page)}
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+export default ShopApp;

src/case/ShopApp/src/api/graphql_request.js

@@ -0,0 +1,12 @@
+import { request } from 'graphql-request'
+import URL from './url_config'
+
+
+export const graphqls=(query,variables)=>{
+   
+    //console.log(URL.HTTP_DATA_URL)
+    const http_request=URL.HTTP_DATA_URL
+      
+    return request(http_request, query,variables).then(data =>data)
+}
+

src/case/billApp/src/components/Common/NavBar.jsx → src/case/ShopApp/src/components/App/NavBar.jsx

@@ -5,7 +5,7 @@ import './NavBar.css'
 
 export default class NavBars extends Component{
     goBack(){
-        console.log('back')
+        this.props.changePage('','')
     }
     render(){
         return(

src/case/shopApp/src/components/App/TabBarBottom.jsx → src/case/ShopApp/src/components/App/TabBarBottom.jsx

@@ -25,15 +25,15 @@ class TabBarBottom extends Component {
     if(page==='index'){
       //console.log(page)
       return (
-        <div style={{ backgroundColor: 'white', height: '100%', textAlign: 'center' }}>
-         <HomePage />
+        <div className="pageWrap">
+         <HomePage changePage={this.props.changePage}/>
         </div>
       );
     }
     if(page==='shopCar'){
       //console.log(page)
       return (
-        <div style={{ backgroundColor: 'white', height: '100%', textAlign: 'center' }}>
+        <div className="pageWrap">
          <ShopCar />
         </div>
       );
@@ -41,7 +41,7 @@ class TabBarBottom extends Component {
     if(page==='user'){
       //console.log(page)
       return (
-        <div style={{ backgroundColor: 'white', height: '100%', textAlign: 'center' }}>
+        <div className="pageWrap">
         <UserPage />
         </div>
       );
@@ -51,7 +51,7 @@ class TabBarBottom extends Component {
   render() {
     //这里渲染一次
     return (
-      <div style={this.state.fullScreen ? { position: 'fixed', height: '100%', width: '100%', top: 0 } : { height: 400 }} className="TabBarBottom">
+      <div style={this.state.fullScreen ? { position: 'absolute', height: '100%', width: '100%', bottom: 0 } : { height: 400 }} className="TabBarBottom">
         <TabBar
           unselectedTintColor="#949494"
           tintColor="#33A3F4"

src/case/shopApp/src/components/HomePage/Cards.jsx → src/case/ShopApp/src/components/HomePage/Cards.jsx

@@ -16,8 +16,9 @@ class Cards extends Component{
         }
     }
     //点击后跳转到商品详情页面
-    onClickChange(e,id){
+    onClickChange(id){
         console.log('product_id',id)
+        this.props.changePage('detail',id)
     }
     
     render(){
@@ -28,7 +29,7 @@ class Cards extends Component{
                 <WingBlank size="lg" key={index} className="Card">
                     <WhiteSpace size="lg" />
                         {/*<Link to={"/detail?product_id="+item.id}>*/}
-                            <Card onClick={(e)=>{this.onClickChange(e,item.id)}}>
+                            <Card onClick={(e)=>{this.onClickChange(item.id)}}>
                                 <Card.Header
                                     title={<span className="title">{item.name}</span>}
                                     extra={<span className="hot">热门</span>} 

src/case/shopApp/src/components/HomePage/HomePage.jsx → src/case/ShopApp/src/components/HomePage/HomePage.jsx

@@ -71,10 +71,7 @@ class HomePage extends Component{
         this.setState({
             detail:"true"
         })
-
-
     }
-
     changeComponent(e){
         if(e==='1'){
             return(
@@ -89,7 +86,7 @@ class HomePage extends Component{
                 <div>
                     <Search getProductByName={this.getGoods.bind(this)}/>
                     <TabBarTop tabs={this.state.tabs} tabChange={this.tabChange.bind(this)}/>
-                    <Cards products={this.state.products||[]}/>
+                    <Cards products={this.state.products||[]} changePage={this.props.changePage}/>
                 </div>
             )
         }

src/case/shopApp/src/components/HomePage/Search.jsx → src/case/ShopApp/src/components/HomePage/Search.jsx

@@ -23,7 +23,7 @@ class Search extends Component {
     this.manualFocusInst.focus();
   }
   render() {
-    return (<div style={{marginTop:'45px'}}>
+    return (<div>
       <SearchBar
         value={this.state.value}
         placeholder="请输入要搜索的商品名"

src/case/ShopApp/src/components/ProductDetailPage/ProductDetail.jsx

@@ -0,0 +1,33 @@
+import React, { Component } from 'react';
+
+import {graphqls} from '../../api/graphql_request'
+import {getProductById} from '../../api/graphql/product'
+
+export default class ProductDetail extends Component{
+    constructor(props){
+        super(props)
+        this.state={
+            product:{}
+        }
+    }
+
+    getProduct(){
+        graphqls(getProductById,{id:this.props.product_id}).then((e)=>{
+            console.log('productId',e.product_by_id)
+            this.setState({
+                product:e.product_by_id
+            })
+        })
+    }
+
+    componentDidMount(){
+        this.getProduct()
+    }
+    render(){
+        return(
+            <div>
+                商品详情页
+            </div>
+        )
+    }
+}

src/case/billApp/src/App.test.js

@@ -1,9 +0,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/case/billApp/src/index.css

@@ -1,15 +0,0 @@
-body {
-  box-sizing: border-box;
-  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/case/billApp/src/index.js

@@ -1,16 +0,0 @@
-import React, { Component } from 'react';
-import ReactDOM from 'react-dom';
-
-import './index.css';
-import App from './App';
-import * as serviceWorker from './serviceWorker';
-//import { Button } from 'antd-mobile';
-
-ReactDOM.render(<App />, 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.
-// Learn more about service workers: http://bit.ly/CRA-PWA
-serviceWorker.unregister();
-
-

src/case/billApp/src/serviceWorker.js

@@ -1,135 +0,0 @@
-// This optional code is used to register a service worker.
-// register() is not called by default.
-
-// This lets the app load faster on subsequent visits in production, and gives
-// it offline capabilities. However, it also means that developers (and users)
-// will only see deployed updates on subsequent visits to a page, after all the
-// existing tabs open on the page have been closed, since previously cached
-// resources are updated in the background.
-
-// To learn more about the benefits of this model and instructions on how to
-// opt-in, read http://bit.ly/CRA-PWA
-
-const isLocalhost = Boolean(
-  window.location.hostname === 'localhost' ||
-    // [::1] is the IPv6 localhost address.
-    window.location.hostname === '[::1]' ||
-    // 127.0.0.1/8 is considered localhost for IPv4.
-    window.location.hostname.match(
-      /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
-    )
-);
-
-export function register(config) {
-  if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
-    // The URL constructor is available in all browsers that support SW.
-    const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);
-    if (publicUrl.origin !== window.location.origin) {
-      // Our service worker won't work if PUBLIC_URL is on a different origin
-      // from what our page is served on. This might happen if a CDN is used to
-      // serve assets; see https://github.com/facebook/create-react-app/issues/2374
-      return;
-    }
-
-    window.addEventListener('load', () => {
-      const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
-
-      if (isLocalhost) {
-        // This is running on localhost. Let's check if a service worker still exists or not.
-        checkValidServiceWorker(swUrl, config);
-
-        // Add some additional logging to localhost, pointing developers to the
-        // service worker/PWA documentation.
-        navigator.serviceWorker.ready.then(() => {
-          console.log(
-            'This web app is being served cache-first by a service ' +
-              'worker. To learn more, visit http://bit.ly/CRA-PWA'
-          );
-        });
-      } else {
-        // Is not localhost. Just register service worker
-        registerValidSW(swUrl, config);
-      }
-    });
-  }
-}
-
-function registerValidSW(swUrl, config) {
-  navigator.serviceWorker
-    .register(swUrl)
-    .then(registration => {
-      registration.onupdatefound = () => {
-        const installingWorker = registration.installing;
-        if (installingWorker == null) {
-          return;
-        }
-        installingWorker.onstatechange = () => {
-          if (installingWorker.state === 'installed') {
-            if (navigator.serviceWorker.controller) {
-              // At this point, the updated precached content has been fetched,
-              // but the previous service worker will still serve the older
-              // content until all client tabs are closed.
-              console.log(
-                'New content is available and will be used when all ' +
-                  'tabs for this page are closed. See http://bit.ly/CRA-PWA.'
-              );
-
-              // Execute callback
-              if (config && config.onUpdate) {
-                config.onUpdate(registration);
-              }
-            } else {
-              // At this point, everything has been precached.
-              // It's the perfect time to display a
-              // "Content is cached for offline use." message.
-              console.log('Content is cached for offline use.');
-
-              // Execute callback
-              if (config && config.onSuccess) {
-                config.onSuccess(registration);
-              }
-            }
-          }
-        };
-      };
-    })
-    .catch(error => {
-      console.error('Error during service worker registration:', error);
-    });
-}
-
-function checkValidServiceWorker(swUrl, config) {
-  // Check if the service worker can be found. If it can't reload the page.
-  fetch(swUrl)
-    .then(response => {
-      // Ensure service worker exists, and that we really are getting a JS file.
-      const contentType = response.headers.get('content-type');
-      if (
-        response.status === 404 ||
-        (contentType != null && contentType.indexOf('javascript') === -1)
-      ) {
-        // No service worker found. Probably a different app. Reload the page.
-        navigator.serviceWorker.ready.then(registration => {
-          registration.unregister().then(() => {
-            window.location.reload();
-          });
-        });
-      } else {
-        // Service worker found. Proceed as normal.
-        registerValidSW(swUrl, config);
-      }
-    })
-    .catch(() => {
-      console.log(
-        'No internet connection found. App is running in offline mode.'
-      );
-    });
-}
-
-export function unregister() {
-  if ('serviceWorker' in navigator) {
-    navigator.serviceWorker.ready.then(registration => {
-      registration.unregister();
-    });
-  }
-}

src/case/orderApp/src/App.test.js

@@ -1,9 +0,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/case/orderApp/src/index.css

@@ -1,14 +0,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/case/orderApp/src/index.js

@@ -1,30 +0,0 @@
-import React, { Component } from 'react';
-import ReactDOM from 'react-dom';
-import { BrowserRouter as Router, Switch, Route} from 'react-router-dom';
-
-
-import './index.css';
-import App from './App';
-import * as serviceWorker from './serviceWorker';
-//import { Button } from 'antd-mobile';
-
-
-class MainApp extends Component{
-    render(){
-        return(
-            <Router>
-                <Route exact path="/" component={App}/>
-            </Router>
-        )
-    }
-}
-
-
-ReactDOM.render(<MainApp />, 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.
-// Learn more about service workers: http://bit.ly/CRA-PWA
-serviceWorker.unregister();
-
-

src/case/orderApp/src/serviceWorker.js

@@ -1,135 +0,0 @@
-// This optional code is used to register a service worker.
-// register() is not called by default.
-
-// This lets the app load faster on subsequent visits in production, and gives
-// it offline capabilities. However, it also means that developers (and users)
-// will only see deployed updates on subsequent visits to a page, after all the
-// existing tabs open on the page have been closed, since previously cached
-// resources are updated in the background.
-
-// To learn more about the benefits of this model and instructions on how to
-// opt-in, read http://bit.ly/CRA-PWA
-
-const isLocalhost = Boolean(
-  window.location.hostname === 'localhost' ||
-    // [::1] is the IPv6 localhost address.
-    window.location.hostname === '[::1]' ||
-    // 127.0.0.1/8 is considered localhost for IPv4.
-    window.location.hostname.match(
-      /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
-    )
-);
-
-export function register(config) {
-  if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
-    // The URL constructor is available in all browsers that support SW.
-    const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);
-    if (publicUrl.origin !== window.location.origin) {
-      // Our service worker won't work if PUBLIC_URL is on a different origin
-      // from what our page is served on. This might happen if a CDN is used to
-      // serve assets; see https://github.com/facebook/create-react-app/issues/2374
-      return;
-    }
-
-    window.addEventListener('load', () => {
-      const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
-
-      if (isLocalhost) {
-        // This is running on localhost. Let's check if a service worker still exists or not.
-        checkValidServiceWorker(swUrl, config);
-
-        // Add some additional logging to localhost, pointing developers to the
-        // service worker/PWA documentation.
-        navigator.serviceWorker.ready.then(() => {
-          console.log(
-            'This web app is being served cache-first by a service ' +
-              'worker. To learn more, visit http://bit.ly/CRA-PWA'
-          );
-        });
-      } else {
-        // Is not localhost. Just register service worker
-        registerValidSW(swUrl, config);
-      }
-    });
-  }
-}
-
-function registerValidSW(swUrl, config) {
-  navigator.serviceWorker
-    .register(swUrl)
-    .then(registration => {
-      registration.onupdatefound = () => {
-        const installingWorker = registration.installing;
-        if (installingWorker == null) {
-          return;
-        }
-        installingWorker.onstatechange = () => {
-          if (installingWorker.state === 'installed') {
-            if (navigator.serviceWorker.controller) {
-              // At this point, the updated precached content has been fetched,
-              // but the previous service worker will still serve the older
-              // content until all client tabs are closed.
-              console.log(
-                'New content is available and will be used when all ' +
-                  'tabs for this page are closed. See http://bit.ly/CRA-PWA.'
-              );
-
-              // Execute callback
-              if (config && config.onUpdate) {
-                config.onUpdate(registration);
-              }
-            } else {
-              // At this point, everything has been precached.
-              // It's the perfect time to display a
-              // "Content is cached for offline use." message.
-              console.log('Content is cached for offline use.');
-
-              // Execute callback
-              if (config && config.onSuccess) {
-                config.onSuccess(registration);
-              }
-            }
-          }
-        };
-      };
-    })
-    .catch(error => {
-      console.error('Error during service worker registration:', error);
-    });
-}
-
-function checkValidServiceWorker(swUrl, config) {
-  // Check if the service worker can be found. If it can't reload the page.
-  fetch(swUrl)
-    .then(response => {
-      // Ensure service worker exists, and that we really are getting a JS file.
-      const contentType = response.headers.get('content-type');
-      if (
-        response.status === 404 ||
-        (contentType != null && contentType.indexOf('javascript') === -1)
-      ) {
-        // No service worker found. Probably a different app. Reload the page.
-        navigator.serviceWorker.ready.then(registration => {
-          registration.unregister().then(() => {
-            window.location.reload();
-          });
-        });
-      } else {
-        // Service worker found. Proceed as normal.
-        registerValidSW(swUrl, config);
-      }
-    })
-    .catch(() => {
-      console.log(
-        'No internet connection found. App is running in offline mode.'
-      );
-    });
-}
-
-export function unregister() {
-  if ('serviceWorker' in navigator) {
-    navigator.serviceWorker.ready.then(registration => {
-      registration.unregister();
-    });
-  }
-}

src/case/shopApp/src/App.js

@@ -1,24 +0,0 @@
-import React, { Component } from 'react';
-import './App.css';
-import 'antd-mobile/dist/antd-mobile.css';
-
-import NavBars from './components/Common/NavBar'
-import TabBarBottom from './components/App/TabBarBottom'
-
-class ShopApp extends Component {
-  //showComponent
-  render() {
-    return (
-      <div className="AppWrap">
-        <div className="phone6s">
-          <div className="App">
-            <NavBars />
-            <TabBarBottom />
-          </div>
-        </div>
-      </div>
-     
-    );
-  }
-}
-export default ShopApp;

src/case/shopApp/src/App.test.js

@@ -1,9 +0,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/case/shopApp/src/api/graphql_request.js

@@ -1,33 +0,0 @@
-import { request } from 'graphql-request'
-import URL from './url_config'
-
-
-export const graphqls=(query,variables)=>{
-   
-    //console.log(URL.HTTP_DATA_URL)
-    const http_request=URL.HTTP_DATA_URL
-      
-    return request(http_request, query,variables).then(data =>data)
-}
-
-
-/* import {graphqls} from './api/graphql_request'
-
-let query=`query productbyprops($category: String, $updatedAt: String, $name: String, $createdAt: String, $status: String, $intro: String, $price: Float, $img: String, $stock: Int) {
-    productbyprops: product_by_props(category: $category updatedAt: $updatedAt name: $name createdAt: $createdAt status: $status intro: $intro price: $price img: $img stock: $stock) {
-        category
-        updatedAt
-        unit
-        name
-        createdAt
-        status
-        id
-        intro
-        price
-        img
-        stock
-    }
-}`,
-variables={}
-
-graphqls(query,variables).then(data=>console.log(data)) */

src/case/shopApp/src/components/App/TabBarBottom.css

@@ -1,5 +0,0 @@
-div.TabBarBottom{
-    position: absolute !important;
-    bottom: 0;
-    z-index: 5;
-} 

src/case/shopApp/src/components/HomePage/HomePage.css

@@ -1,3 +0,0 @@
-.homeWrap{
-    margin-top: 45px;
-}

src/case/shopApp/src/index.css

@@ -1,14 +0,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/case/shopApp/src/index.js

@@ -1,34 +0,0 @@
-import React, { Component } from 'react';
-import ReactDOM from 'react-dom';
-import { BrowserRouter as Router, Switch, Route} from 'react-router-dom';
-
-
-import './index.css';
-import App from './App';
-import * as serviceWorker from './serviceWorker';
-//import { Button } from 'antd-mobile';
-
-
-class MainApp extends Component{
-        render(){
-            return(
-                <Router>
-                    <Switch>
-                        <Route exact path="/" render={() => {
-                            return <App />;
-                        }}/>
-                    </Switch>
-                </Router>
-            )
-        }
-    }
-
-
-ReactDOM.render(<MainApp />, 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.
-// Learn more about service workers: http://bit.ly/CRA-PWA
-serviceWorker.unregister();
-
-

src/case/shopApp/src/serviceWorker.js

@@ -1,135 +0,0 @@
-// This optional code is used to register a service worker.
-// register() is not called by default.
-
-// This lets the app load faster on subsequent visits in production, and gives
-// it offline capabilities. However, it also means that developers (and users)
-// will only see deployed updates on subsequent visits to a page, after all the
-// existing tabs open on the page have been closed, since previously cached
-// resources are updated in the background.
-
-// To learn more about the benefits of this model and instructions on how to
-// opt-in, read http://bit.ly/CRA-PWA
-
-const isLocalhost = Boolean(
-  window.location.hostname === 'localhost' ||
-    // [::1] is the IPv6 localhost address.
-    window.location.hostname === '[::1]' ||
-    // 127.0.0.1/8 is considered localhost for IPv4.
-    window.location.hostname.match(
-      /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
-    )
-);
-
-export function register(config) {
-  if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
-    // The URL constructor is available in all browsers that support SW.
-    const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);
-    if (publicUrl.origin !== window.location.origin) {
-      // Our service worker won't work if PUBLIC_URL is on a different origin
-      // from what our page is served on. This might happen if a CDN is used to
-      // serve assets; see https://github.com/facebook/create-react-app/issues/2374
-      return;
-    }
-
-    window.addEventListener('load', () => {
-      const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
-
-      if (isLocalhost) {
-        // This is running on localhost. Let's check if a service worker still exists or not.
-        checkValidServiceWorker(swUrl, config);
-
-        // Add some additional logging to localhost, pointing developers to the
-        // service worker/PWA documentation.
-        navigator.serviceWorker.ready.then(() => {
-          console.log(
-            'This web app is being served cache-first by a service ' +
-              'worker. To learn more, visit http://bit.ly/CRA-PWA'
-          );
-        });
-      } else {
-        // Is not localhost. Just register service worker
-        registerValidSW(swUrl, config);
-      }
-    });
-  }
-}
-
-function registerValidSW(swUrl, config) {
-  navigator.serviceWorker
-    .register(swUrl)
-    .then(registration => {
-      registration.onupdatefound = () => {
-        const installingWorker = registration.installing;
-        if (installingWorker == null) {
-          return;
-        }
-        installingWorker.onstatechange = () => {
-          if (installingWorker.state === 'installed') {
-            if (navigator.serviceWorker.controller) {
-              // At this point, the updated precached content has been fetched,
-              // but the previous service worker will still serve the older
-              // content until all client tabs are closed.
-              console.log(
-                'New content is available and will be used when all ' +
-                  'tabs for this page are closed. See http://bit.ly/CRA-PWA.'
-              );
-
-              // Execute callback
-              if (config && config.onUpdate) {
-                config.onUpdate(registration);
-              }
-            } else {
-              // At this point, everything has been precached.
-              // It's the perfect time to display a
-              // "Content is cached for offline use." message.
-              console.log('Content is cached for offline use.');
-
-              // Execute callback
-              if (config && config.onSuccess) {
-                config.onSuccess(registration);
-              }
-            }
-          }
-        };
-      };
-    })
-    .catch(error => {
-      console.error('Error during service worker registration:', error);
-    });
-}
-
-function checkValidServiceWorker(swUrl, config) {
-  // Check if the service worker can be found. If it can't reload the page.
-  fetch(swUrl)
-    .then(response => {
-      // Ensure service worker exists, and that we really are getting a JS file.
-      const contentType = response.headers.get('content-type');
-      if (
-        response.status === 404 ||
-        (contentType != null && contentType.indexOf('javascript') === -1)
-      ) {
-        // No service worker found. Probably a different app. Reload the page.
-        navigator.serviceWorker.ready.then(registration => {
-          registration.unregister().then(() => {
-            window.location.reload();
-          });
-        });
-      } else {
-        // Service worker found. Proceed as normal.
-        registerValidSW(swUrl, config);
-      }
-    })
-    .catch(() => {
-      console.log(
-        'No internet connection found. App is running in offline mode.'
-      );
-    });
-}
-
-export function unregister() {
-  if ('serviceWorker' in navigator) {
-    navigator.serviceWorker.ready.then(registration => {
-      registration.unregister();
-    });
-  }
-}

src/components/app/App.jsx

@@ -22,8 +22,12 @@ import {SHOW_ALL_SCHEMA} from "../gql";
 import axios from 'axios';
 import {getCookie} from "../cookie";
 
-//引入案例
-import ShopApp from '../../case/shopApp/src/App'
+//案例入口
+import ShopApp from '../../case/ShopApp/src/App'
+import OrderApp from '../../case/OrderApp/src/App'
+import BillApp from '../../case/BillApp/src/App'
+
+
 
 
 axios.defaults.withCredentials = true;

src/components/common/application/Application.js

@@ -1,13 +1,21 @@
 import React, {Component} from 'react';
-import ShopApp from '../../../case/shopApp/src/App'
-import billApp from '../../../case/shopApp/src/App'
-import orderApp from '../../../case/shopApp/src/App'
+import ShopApp from '../../../case/ShopApp/src/App'
+import BillApp from '../../../case/BillApp/src/App'
+import OrderApp from '../../../case/OrderApp/src/App'
 class Application extends Component {
 
     render() {
+        let schemaName = this.props.location.state ? this.props.location.state.schemaName : 'ecommerce';
         return (
             <div>
-                <ShopApp/>
+                {
+                    schemaName === "ecommerce" ?
+                        <ShopApp/> :
+                        schemaName === 'bills'?
+                            <BillApp /> :
+                                <OrderApp />
+
+                }
             </div>
         )
     }

src/components/trialCase/TrialCase.jsx

@@ -59,7 +59,7 @@ class TrialCase extends Component {
                                     case 'schema':
                                         return <Schema trialcase={true} userID={this.state.userID} schemaName={schemaName} schemaID={schemaID} history={this.props.history} location={this.props.location}/>;
                                     case 'application':
-                                        return <Application />;
+                                        return <Application location={this.props.location}/>;
                                     case 'deploy':
                                         return <Deploy userID={this.state.userID} schemaID={schemaID} schemaName={schemaName}/>;
                                     case 'graphql':