DeployCloudChoose.js 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362
  1. import React, {Component} from 'react';
  2. import {Layout, Button, notification, Spin} from 'antd';
  3. import {getCookie} from "../../../cookie";
  4. import {graphqlUrl, storeFile} from "../../../config";
  5. import {SHOW_CLOUD} from "../../../gql";
  6. import {request} from 'graphql-request'
  7. import axios from 'axios';
  8. import {deployAll} from "../../../config";
  9. import {ADD_APIGWPATH, ADD_APIGROUP, ADD_DEPLOY, ADD_PROJECT} from "../../../gql";
  10. import {idGen} from "../../../func";
  11. const {Content} = Layout;
  12. axios.defaults.withCredentials = true;
  13. class DeployCloudChoose extends Component {
  14. constructor() {
  15. super();
  16. this.state = {
  17. userID: 'demo',
  18. dbKind: 'mongodb', // mongodb fc-db
  19. cloudName: 'tencent',
  20. cloudID: 'tencent_CloudID',
  21. secretID: '',
  22. secretKey: '',
  23. appId: '',
  24. bucketName: '',
  25. disabled: false
  26. }
  27. }
  28. componentWillMount() {
  29. this._isMounted = true;
  30. let userID = getCookie('user_id') || this.state.userID;
  31. if (userID !== undefined && userID !== '') {
  32. this.setState({
  33. userID
  34. });
  35. // 查询是否设置 cloud
  36. request(graphqlUrl, SHOW_CLOUD, {user_id: userID}).then(data => {
  37. data.cloud_by_props.forEach(cloud => {
  38. switch (cloud.cloudName) {
  39. case 'tencent':
  40. this.setState({
  41. cloudID: cloud.id,
  42. secretID: cloud.secretId,
  43. secretKey: cloud.secretKey,
  44. appId: cloud.appId,
  45. cloudName: 'tencent'
  46. });
  47. break;
  48. case 'aliyun':
  49. // 没写
  50. break;
  51. case 'amazon':
  52. // 没写
  53. break;
  54. default:
  55. break;
  56. }
  57. });
  58. }
  59. )
  60. }
  61. if (this.props.location && this.props.location.state) {
  62. switch (this.props.location.state.schemaID) {
  63. case 'order_schemaID':
  64. this.setState({
  65. bucketName: 'appointment'
  66. });
  67. break;
  68. case 'ecommerce_schemaID':
  69. this.setState({
  70. bucketName: 'e-commerce'
  71. });
  72. break;
  73. default:
  74. break;
  75. }
  76. }
  77. }
  78. componentWillUnmount() {
  79. this._isMounted = false;
  80. }
  81. deploy() {
  82. let _this = this;
  83. let {userID, dbKind, bucketName} = this.state;
  84. if (bucketName === '') {
  85. console.log('state, 没有传值');
  86. } else {
  87. // 开始调用
  88. console.log('开始调用');
  89. this.setState({
  90. disabled: true
  91. });
  92. let now = new Date().getTime(),
  93. functionName = this.state.userID + '_' + bucketName.substr(0, 2) + '_' + now,
  94. serviceName = this.state.userID + '_' + bucketName.substr(0, 2) + '_' + now,
  95. resources = [`${bucketName}/schema.edn`, `${bucketName}/resolve-map.edn`, `${bucketName}/${dbKind}/${userID}/deploy-conf.edn`];
  96. if (dbKind === 'mongodb') {
  97. resources.push(`${bucketName}/${dbKind}/${userID}/mongo-config.edn`)
  98. }
  99. console.log('now', now, 'functionName', functionName, 'serviceName', serviceName, 'resources', resources);
  100. axios.post(deployAll,
  101. {
  102. 'fc-name': functionName,
  103. 'bucket': dbKind === 'mongodb'? 'native-fc' : 'fcdb-deploy',
  104. 'object-file': 'fc-only.zip',
  105. 'res-bucket': 'case',
  106. 'resources': resources,
  107. 'service-name': serviceName,
  108. 'path': "/*"
  109. })
  110. .then(function (response) {
  111. console.log('response', response);
  112. if(response['data']['apigw-result'] && response['data']['fc-result']) {
  113. // 处理数据
  114. let result = response['data']['apigw-result'];
  115. let apiData = result['api-info'];
  116. let serviceData = result['service-info'];
  117. // 存数据
  118. let pathID = idGen('path'),
  119. groupID = idGen('group'),
  120. deployID = idGen('deploy'),
  121. projectID = idGen('project');
  122. let {apiId, path, method} = apiData;
  123. let {serviceName, serviceId, subDomain} = serviceData;
  124. let {userID, cloudID} = _this.state;
  125. let pathVarObj = {
  126. id: idGen('path'),
  127. user_id: userID,
  128. apiGWGroup_id: pathID,
  129. deploy_id: deployID,
  130. apiGWName: functionName,
  131. requestMethod: method,
  132. apiGWPath: path,
  133. apiId: apiId,
  134. apiGWDesc: '',
  135. serviceType: 'SCF',
  136. timeout: 300,
  137. createdAt: now,
  138. updatedAt: ''
  139. };
  140. let projectVarObj = {
  141. id: projectID,
  142. projectType: 'case',
  143. cloud_id: cloudID,
  144. user_id: userID,
  145. projectName: functionName,
  146. database_id: '',
  147. apiGWGroup_id: '',
  148. deploy_id: '',
  149. case_id: '',
  150. wxConfig_id: '',
  151. schema_id: '',
  152. createdAt: now,
  153. updatedAt: '',
  154. projectStatus: 'deployed'
  155. };
  156. let groupVarObj = {
  157. id: groupID,
  158. cloud_id: cloudID,
  159. user_id: userID,
  160. userStatus: '',
  161. userDomain: '',
  162. groupName: serviceName,
  163. frontType: '',
  164. region: '',
  165. environmentName: '',
  166. defaultDomain: subDomain,
  167. status: '',
  168. serviceId: serviceId,
  169. createdAt: now,
  170. updatedAt: ''
  171. };
  172. let deployVarObj = {
  173. id: deployID,
  174. cloud_id: cloudID,
  175. functionName,
  176. cosObjectName: '',
  177. region: '',
  178. cosBucketRegion: '',
  179. description: '',
  180. cosBucketName: '',
  181. vpcId: '',
  182. subnetId: '',
  183. memorySize: 512,
  184. timeout: 300,
  185. handler: '',
  186. serviceName: "",
  187. fc_id: '',
  188. createdAt: now,
  189. updatedAt: ''
  190. };
  191. let add_apigwpath = request(graphqlUrl, ADD_APIGWPATH, pathVarObj),
  192. add_project = request(graphqlUrl, ADD_PROJECT, projectVarObj),
  193. add_apigroup = request(graphqlUrl, ADD_APIGROUP, groupVarObj),
  194. add_deploy = request(graphqlUrl, ADD_DEPLOY, deployVarObj);
  195. Promise.all([add_apigwpath, add_project, add_apigroup, add_deploy])
  196. .then(value => {
  197. console.log(value);
  198. // 展示数据
  199. if(this._isMounted) {
  200. _this.setState({
  201. disabled: false
  202. });
  203. }
  204. _this.props.changeTabBar('my-deploy');
  205. _this.props.history.push({
  206. pathname: `/common/deploy`,
  207. state: {
  208. // 处理传回数据,直接拼接
  209. url: `http://${subDomain}/test/graphql`
  210. }
  211. });
  212. })
  213. .catch(err => {
  214. console.log(err);
  215. });
  216. } else {
  217. console.log('deployAll 失败');
  218. }
  219. })
  220. .catch(function (error) {
  221. console.log('axios error', error);
  222. });
  223. }
  224. }
  225. render() {
  226. let {userID, disabled, appId, secretID, secretKey, bucketName, dbKind} = this.state;
  227. return (
  228. <div className={'deploy-choose-cloud'}>
  229. <Layout style={{padding: '24px', minHeight: '300px'}}>
  230. <Content style={{padding: '20px 50px', background: '#fff'}}>
  231. <div className={'choose-cloud'}>
  232. <span className={'choose-cloud-title'}>系统默认设置</span><span
  233. className={'choose-cloud-content'}>部署在系统云服务商,部署成功后返回结果</span>
  234. </div>
  235. <div className={'choose-cloud'}>
  236. <span className={'choose-cloud-title'}>自定义设置</span><span
  237. className={'choose-cloud-content'}>部署在自有云服务商,部署成功后返回结果,可登陆云服务商后台查看部署结果</span>
  238. </div>
  239. <div className={'choose-cloud-button-group'}>
  240. {
  241. disabled ?
  242. <Spin/>
  243. :
  244. <div>
  245. <Button className={'choose-cloud-button'} type='primary' onClick={() => {
  246. this.deploy();
  247. }}>系统默认部署</Button>
  248. <Button className={'choose-cloud-button'} type='primary' onClick={() => {
  249. if (userID === 'demo') {
  250. notification['warning']({
  251. message: '需要登录',
  252. description: '后续使用,需要先登录',
  253. });
  254. this.props.history.push({
  255. pathname: `/login`
  256. })
  257. } else {
  258. if (appId && secretID && secretKey) {
  259. this.setState({
  260. disabled: true
  261. });
  262. // store *.edn to cos
  263. let deployConf = dbKind === 'mongodb' ?
  264. ` {:secretId "${secretID}"\n` +
  265. ` :secretKey "${secretKey}"\n` +
  266. ` :appId "${appId}"\n` +
  267. ' :region "ap-beijing" \n' +
  268. ' }\n'
  269. :
  270. ` {:secretId "${secretID}"\n` +
  271. ` :secretKey "${secretKey}"\n` +
  272. ` :appId "${appId}"\n` +
  273. ' :region "ap-beijing"\n' +
  274. ' :bucket "fc-db"\n' +
  275. ' :trustStore "/etc/ssl/certs/java/cacerts"\n' +
  276. ` :fc-db-store "save/${bucketName}.dat"\n` +
  277. ' :fc-db-dir "fc-db"\n' +
  278. ' :graphql-url "http://orderfcdb.ioobot.cn/graphql"\n' +
  279. ' :local-tmp-dir "/tmp"\n' +
  280. ' :local-db-file "fcdb.dat"\n' +
  281. ' :update-tx? true \n' +
  282. ' :force-down? true\n' +
  283. ' }';
  284. let a = axios.post(storeFile, {
  285. 'file-name': `${bucketName}/${dbKind}/${userID}/deploy-conf.edn`,
  286. bucket: 'case',
  287. cont: deployConf
  288. });
  289. let cont = '{:uri {\n' +
  290. ':auth {:admin-db "order"\n' +
  291. ' :u "ly"\n' +
  292. ' :p "autorunC1705"\n' +
  293. ' :host "119.27.174.13"}}\n' +
  294. ' :db-name "order"}';
  295. let b = dbKind === 'mongodb' ?
  296. axios.post(storeFile, {
  297. 'file-name': `${bucketName}/${dbKind}/${userID}/mongo-config.edn`,
  298. bucket: 'case',
  299. cont
  300. })
  301. :
  302. Promise.resolve({status: 200});
  303. Promise.all([a, b]).then(value=> {
  304. if(value.every(res=> res.status === 200)) {
  305. console.log('store file success , start deploying');
  306. this.deploy();
  307. }
  308. });
  309. } else {
  310. notification['warning']({
  311. message: '需要填写配置',
  312. description: '后续使用,需要先填写配置',
  313. });
  314. this.props.history.push({
  315. pathname: `/login/cloud`
  316. })
  317. }
  318. }
  319. }}>自定义参数设置</Button>
  320. </div>
  321. }
  322. </div>
  323. </Content>
  324. </Layout>
  325. </div>
  326. )
  327. }
  328. }
  329. export default DeployCloudChoose