部署结果添加二维码展示

package.json

@@ -55,6 +55,7 @@
     "postcss-loader": "3.0.0",
     "postcss-preset-env": "6.0.6",
     "postcss-safe-parser": "4.0.1",
+    "qrcode.react": "^0.9.2",
     "react": "^16.6.0",
     "react-apollo": "^2.2.4",
     "react-app-polyfill": "^0.1.3",

src/app/basicVersion/caseShow/index.css

@@ -55,10 +55,14 @@
 .detail-images {
     display: flex;
     flex-wrap: wrap;
-    justify-content: space-around;
+    justify-content: flex-start;
     margin-top: 20px;
 }
 
+.detail-images img{
+    padding: 20px 40px 20px 0;
+}
+
 .case-detail-attention {
     color: red;
 }

src/app/basicVersion/myDeploy/MyDeploy.jsx

@@ -58,7 +58,7 @@ class MyDeploy extends Component {
 
         return (
             <div>
-                <Layout style={{ padding: '24px',minHeight:'300px' }}>
+                <Layout style={{ padding: '24px' }}>
                     <Content style={{ background: '#fff' }}>
                         {
                             // 登录用户与非登录用户区别对待

src/app/basicVersion/myDeploy/TencentDeploy.js

@@ -7,6 +7,7 @@ import {
 import {request} from 'graphql-request'
 import copy from 'copy-to-clipboard';
 import axios from 'axios';
+import QRCode from 'qrcode.react';
 import {graphqlUrl} from "../../../config";
 
 axios.defaults.withCredentials = true;
@@ -97,10 +98,12 @@ class TencentDeploy extends Component {
                             <div className={'schema-name'}><FormattedMessage id='service manage'/></div>
                             <div className={'schema-table-list-title'}>
                                 <Row>
-                                    <Col span={5}><span className={'schema-table-title'}><FormattedMessage
+                                    <Col span={4}><span className={'schema-table-title'}><FormattedMessage
                                         id='groupName'/></span></Col>
-                                    <Col span={15}><span className={'schema-table-title'}><FormattedMessage
+                                    <Col span={10}><span className={'schema-table-title'}><FormattedMessage
                                         id='defaultDomain'/></span></Col>
+                                    <Col span={6}><span className={'schema-table-title'}><FormattedMessage
+                                        id='qrcode'/></span></Col>
                                     <Col span={4}><span className={'schema-table-title'}><FormattedMessage
                                         id='operation'/></span></Col>
                                 </Row>
@@ -111,16 +114,23 @@ class TencentDeploy extends Component {
                                         {
                                             deployed.map(deploy => (
                                                 <Row key={deploy.id}>
-                                                    <Col span={5}>
+                                                    <Col span={4}>
                                                         <span className={'schema-table-content'}>{deploy.groupName.replace(regexp, '')}</span>
                                                     </Col>
-                                                    <Col span={15}>
+                                                    <Col span={10}>
                                                         <span className={'schema-table-content'}>{`http://${deploy.defaultDomain}/test`} </span>
                                                         <Icon type="copy" theme="twoTone" onClick={() => {
                                                             copy(`http://${deploy.defaultDomain}/test`);
                                                             message.success('复制成功.');
                                                         }}/>
                                                     </Col>
+                                                    <Col span={6}>
+                                                        <QRCode
+                                                            value={deploy.userDomain ? `http://${deploy.userDomain}` : `http://${deploy.defaultDomain}/test`}
+                                                            size={128}
+                                                            includeMargin={true}
+                                                        />
+                                                    </Col>
                                                     <Col span={4}>
                                                         <Button type={'danger'} size={'small'}
                                                                 style={{marginTop: 10}}><FormattedMessage id='delete'/></Button>

src/language/en_US.js

@@ -158,6 +158,7 @@ const en_US = {
     "next-step":"next",
 
     'Submit Support Ticket': 'Submit Support Ticket',
+    'qrcode':'qrcode',
 
     'Example': 'Example',
     'My deploy': 'My deploy',

src/language/zh_CN.js

@@ -159,6 +159,7 @@ const zh_CN = {
     "next-step":"下一步",
 
     'Submit Support Ticket': '提交工单',
+    'qrcode':'扫码体验',
 
     'Example': '案例',
     'My deploy': '我的部署',