skyline-console/docs/en/develop/2-catalog-introduction.md

381 lines
22 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

English | [Chinese](../../zh/develop/2-catalog-introduction.md)
# Introduction to the first-level directory
- `Gruntfile.js`Used to collect i18n
- `LICENSE`: This project uses Apache License
- `Makefile`:
- `README.md`: A brief description of the front-end startup, please refer to the docs for details
- `config`: webpack configuration, which contains webpack configuration in public, development environment, test environment, and build environment
- `cypress.json`: E2E test configuration file
- `docker`: Contains the docker configuration used in the development environment, generation environment, and test environment
- `docs`: Documentation introduction, including Chinese, English, development documentation, testing documentation, the en documentation is temporarily missing
- `jest.config.js`: Unit test configuration file
- `jsconfig.json`: javascript code configuration file
- `package.json`: Configuration files such as installation packages and commands
- `yarn.lock`: The version lock file of the package
- `.babelrc`: Babel configuration file
- `.dockerignore`: File configuration ignored by docker
- `.eslintignore`: File configuration ignored by eslint
- `.eslint`: Eslint configuration
- `.gitignore`: File configuration ignored by git
- `.gitreview`: Gitreview configuration
- `.prettierignore`: File configuration ignored by prettier
- `.prettierrc`: Prettier configuration
- `src`: The folder where the development code is located! ! !
- `test`: The folder where the test code is located! ! ! Contains e2e test code and basic code for unit testing
- `tools`: Other tools folder, containing git tools
# Directory Introduction for src
- `src/components`: Public component
- `src/api`: API, not used yet
- `src/asset`: Images, template and other static files
- `src/containers`:
- Components with state
- Basic class
- [BaseList](3-1-BaseList-introduction.md)
- [BaseDetail](3-3-BaseDetail-introduction.md)
- [BaseForm](3-6-FormAction-introduction.md)
- [BaseModalAction](3-7-ModalAction-introduction.md)
- [BaseConfirmAction](3-8-ConfirmAction-introduction.md)
- [BaseStepAction](3-9-StepAction-introduction.md)
- `src/core`:
- `index.js`: Entry file
- `routes.js`: Routing configuration by module
- `i18n.js`
- `App.jsx`
- `src/layouts`:
- Define all the components of the overall page layout
- Blank layout BlankLayout
- Layout used for login page UserLayout
- The layout used for the content page BaseLayout(Use of lists, details, forms, etc.)
- `menu.jsx`: Menu configuration used by the console
- `admin-menu.jsx`: Menu configuration used by the management platform
- `src/locales`: i18n
- `src/resources`:
- Define the state/search items of each resource being shared
- Define the table columns where each resource is shared
- Define the reuse function of each resource
- `src/stores`:
- Data acquisition and operation of resources, etc.
- Name the resource name according to lowercase letters and hyphens
- The directory is divided into two levels: for example `nova/instances.js`, `cinder/volume.js`
- `src/utils`:
- Public function(time format、regexp、cookie、localStorage、......)
- Corresponding unit test, ending with test.js or spec.js
- `src/styles`: Basic styles, common styles, style variables, etc.
- `src/pages`:
- Progressively according to the page hierarchy (according to: menu item-secondary menu)
- All directory names are lowercase and hyphenated. The directory contains two folders `containers` and `routers`, and one file `App.js`
- Store pages corresponding to secondary directories under `containers`
- `routes` is used to configure routing
# Directory Introduction for src/pages
- Divide the directory with the first and second level menus, the first level menu is listed under `src/pages`, and the corresponding second level menu page is under `src/pages/xxx/containers`, take "Compute-Instance" as an example , "Compute" corresponds to the `src/pages/compute` directory, and "Instance" corresponds to the `src/pages/compute/containers/Instance` directory
- `src/pages/compute/containers/Instance/index.jsx`: Instance list page, inherited from [BaseList component](3-1-BaseList-introduction.md) (with Tab
Page, just inherit the TabBaseList component)
- `src/pages/compute/containers/Instance/Detail`
- Instance detail page
- `index.jsx`inherited from[BaseDetail Component](3-3-BaseDetail-introduction.md)
- `src/pages/compute/containers/Instance/actions`
- Instance operation
- `Lock.jsx` Lock the instance, inherited from[BaseConfirmAction](3-8-ConfirmAction-introduction.md)
- `AttachInterface.jsx` inherited from[BaseModalAction](3-7-ModalAction-introduction.md)
- `StepCreate/index.jsx`inherited from[BaseStepAction](3-9-StepAction-introduction.md)
- `src/pages/compute/routes`
- `index.js` Configure routing
- It is agreed that whether the route contains "-admin" to determine whether it is the management platform or the console
# Directory Introduction for test
[English](../../en/test/2-catalog-introduction.md) | [Chinese](../../zh/test/2-catalog-introduction.md)
# Catalog Introduction-Image Version
```
.
├── Gruntfile.js (Used to collect i18n)
├── LICENSE
├── Makefile
├── README.md
├── config
│   ├── theme.js
│   ├── webpack.common.js
│   ├── webpack.dev.js (Webpack configuration used during development)
│   ├── webpack.e2e.js (The webpack configuration used during e2e testing can generate a package for testing coverage)
│   └── webpack.prod.js (Webpack packaging configuration used by the generation environment)
├── cypress.json (E2E configuration)
├── docker
│   ├── dev.dockerfile
│   ├── nginx.conf
│   ├── prod.dockerfile
│   └── test.dockerfile
├── docs (Documents)
├── jest.config.js (Unit testing configuration)
├── jsconfig.json
├── package.json
├── src
│   ├── api (Api summary, not used yet)
│   ├── asset
│   │   ├── image (Images placement)
│   │   └── template
│   │   └── index.html
│   ├── components (Public components)
│   ├── containers
│   │   ├── Action
│   │   │   ├── ConfirmAction (Confirmed action base class)
│   │   │   ├── FormAction (Single page action base class)
│   │   │   ├── ModalAction (Pop-up action base class)
│   │   │   ├── StepAction (Multi-step single-page action, for example: create a cloud host)
│   │   │   └── index.jsx
│   │   ├── BaseDetail (Detail page base class with detailed information)
│   │   ├── List (The base class of the list page, for example: cloud host)
│   │   ├── TabDetail (The base class of the detail page with tab switching, for example: instance details)
│   │   └── TabList (List page with tab switch)
│   ├── core
│   │   ├── App.jsx
│   │   ├── i18n.js
│   │   ├── index.jsx (Entry)
│   │   └── routes.js (Routing configuration by module)
│   ├── layouts
│   │   ├── Base (Layout used after login)
│   │   ├── Blank (Blank layout)
│   │   ├── User (Layout used for login)
│   │   ├── admin-menu.jsx (Menu configuration used by the management platform)
│   │   └── menu.jsx (Menu configuration used by the console)
│   ├── locales (Translation)
│   │   ├── en.json
│   │   ├── index.js
│   │   └── zh.json
│   ├── pages (The page-directory structure is assigned according to: menu item-secondary menu, where the pages of the secondary menu are placed in the containers folder)
│   │   ├── base
│   │   │   ├── App.jsx
│   │   │   ├── containers
│   │   │   │   ├── 404 (404 page)
│   │   │   │   │   └── index.jsx
│   │   │   │   ├── AdminOverview (Management platform home page)
│   │   │   │   │   ├── components
│   │   │   │   │   │   ├── ComputeService.jsx
│   │   │   │   │   │   ├── NetworkService.jsx
│   │   │   │   │   │   ├── PlatformInfo.jsx
│   │   │   │   │   │   ├── ResourceOverview.jsx
│   │   │   │   │   │   └── VirtualResource.jsx
│   │   │   │   │   ├── index.jsx
│   │   │   │   │   └── style.less
│   │   │   │   └── Overview (Console home page)
│   │   │   │   ├── components
│   │   │   │   │   ├── ProjectInfo.jsx
│   │   │   │   │   ├── QuotaOverview.jsx
│   │   │   │   │   └── ResourceStatistic.jsx
│   │   │   │   ├── index.jsx
│   │   │   │   └── style.less
│   │   │   └── routes (Routing configuration)
│   │   │   └── index.js
│   │   ├── compute
│   │   │   ├── App.jsx
│   │   │   ├── containers
│   │   │   │   ├── BareMetalNode (Bare metal configuration)
│   │   │   │   ├── Flavor (Instance type)
│   │   │   │   ├── HostAggregate (Host Aggregate)
│   │   │   │   │   ├── Aggregate (Host Aggregate)
│   │   │   │   │   ├── AvailabilityZone (Availability zone)
│   │   │   │   │   └── index.jsx
│   │   │   │   ├── Hypervisors (Hypervisors management)
│   │   │   │   │   ├── ComputeHost (Compute host)
│   │   │   │   │   ├── Hypervisor (Hypervisor manager)
│   │   │   │   │   └── index.jsx
│   │   │   │   ├── Image (Image)
│   │   │   │   ├── Instance (Instance)
│   │   │   │   │   ├── Detail (Detail page)
│   │   │   │   │   │   ├── BaseDetail (Base info)
│   │   │   │   │   │   ├── SecurityGroup (Security group)
│   │   │   │   │   │   └── index.jsx
│   │   │   │   │   ├── actions (Actions)
│   │   │   │   │   │   ├── AssociateFip.jsx (Associate fip ip)
│   │   │   │   │   │   ├── AttachInterface.jsx (Attach interface)
│   │   │   │   │   │   ├── AttachIsoVolume.jsx (Attach iso volume)
│   │   │   │   │   │   ├── AttachVolume.jsx (Attach volume)
│   │   │   │   │   │   ├── ChangePassword.jsx (Change password)
│   │   │   │   │   │   ├── Console.jsx (Console)
│   │   │   │   │   │   ├── CreateImage.jsx (Create Image)
│   │   │   │   │   │   ├── CreateIronic (Create ironic-Step-by-step Form)
│   │   │   │   │   │   │   ├── BaseStep
│   │   │   │   │   │   │   │   └── index.jsx
│   │   │   │   │   │   │   ├── ConfirmStep
│   │   │   │   │   │   │   │   └── index.jsx
│   │   │   │   │   │   │   ├── NetworkStep
│   │   │   │   │   │   │   │   └── index.jsx
│   │   │   │   │   │   │   ├── SystemStep
│   │   │   │   │   │   │   │   └── index.jsx
│   │   │   │   │   │   │   ├── index.jsx
│   │   │   │   │   │   │   └── index.less
│   │   │   │   │   │   ├── CreateSnapshot.jsx (Create snapshot)
│   │   │   │   │   │   ├── Delete.jsx (Delete instance)
│   │   │   │   │   │   ├── DeleteIronic.jsx (Delete ironic)
│   │   │   │   │   │   ├── DetachInterface.jsx (Detach interface)
│   │   │   │   │   │   ├── DetachIsoVolume.jsx (Detach iso volume)
│   │   │   │   │   │   ├── DetachVolume.jsx (Detach volume)
│   │   │   │   │   │   ├── DisassociateFip.jsx (Disassociate fip iP)
│   │   │   │   │   │   ├── Edit.jsx (Edit instance)
│   │   │   │   │   │   ├── ExtendRootVolume.jsx (Expand the root disk)
│   │   │   │   │   │   ├── LiveMigrate.jsx (Live migrate)
│   │   │   │   │   │   ├── Lock.jsx (Lock instance)
│   │   │   │   │   │   ├── ManageSecurityGroup.jsx (Manage security group)
│   │   │   │   │   │   ├── Migrate.jsx (Migrate)
│   │   │   │   │   │   ├── Pause.jsx (Pause instance)
│   │   │   │   │   │   ├── Reboot.jsx (Reboot instance)
│   │   │   │   │   │   ├── Rebuild.jsx (Rebuild instance)
│   │   │   │   │   │   ├── RebuildSelect.jsx (Select the image to rebuild the instance)
│   │   │   │   │   │   ├── Resize.jsx (Change configuration)
│   │   │   │   │   │   ├── ResizeOnline.jsx (Modify configuration online)
│   │   │   │   │   │   ├── Resume.jsx (Resume instance)
│   │   │   │   │   │   ├── Shelve.jsx (Shelve instance)
│   │   │   │   │   │   ├── SoftDelete.jsx (Soft delete instance)
│   │   │   │   │   │   ├── SoftReboot.jsx (Soft reboot instance)
│   │   │   │   │   │   ├── Start.jsx (Start instance)
│   │   │   │   │   │   ├── StepCreate (Create a instance-step by step creation)
│   │   │   │   │   │   │   ├── BaseStep
│   │   │   │   │   │   │   │   └── index.jsx
│   │   │   │   │   │   │   ├── ConfirmStep
│   │   │   │   │   │   │   │   └── index.jsx
│   │   │   │   │   │   │   ├── NetworkStep
│   │   │   │   │   │   │   │   └── index.jsx
│   │   │   │   │   │   │   ├── SystemStep
│   │   │   │   │   │   │   │   └── index.jsx
│   │   │   │   │   │   │   ├── index.jsx
│   │   │   │   │   │   │   └── index.less
│   │   │   │   │   │   ├── Stop.jsx (Stop instance)
│   │   │   │   │   │   ├── Suspend.jsx (Suspend instance)
│   │   │   │   │   │   ├── Unlock.jsx (Unlock instance)
│   │   │   │   │   │   ├── Unpause.jsx (Unpause instance)
│   │   │   │   │   │   ├── Unshelve.jsx (Unshelve instance)
│   │   │   │   │   │   ├── index.jsx
│   │   │   │   │   │   └── index.less
│   │   │   │   │   ├── components (Component)
│   │   │   │   │   │   ├── FlavorSelectTable.jsx
│   │   │   │   │   │   └── index.less
│   │   │   │   │   ├── index.jsx
│   │   │   │   │   └── index.less
│   │   │   │   ├── Keypair (Key pair)
│   │   │   │   └── ServerGroup (Instance group)
│   │   │   └── routes (Routing configuration under the compute menu)
│   │   │   └── index.js
│   │   ├── configuration (Platform configuration)
│   │   │   ├── App.jsx
│   │   │   ├── containers
│   │   │   │   ├── Metadata (Metadata definition)
│   │   │   │   ├── Setting (System configuration)
│   │   │   │   └── SystemInfo (System info)
│   │   │   └── routes (Routing configuration under the platform configuration menu)
│   │   │   └── index.js
│   │   ├── heat (Resource orchestration)
│   │   │   ├── App.jsx
│   │   │   ├── containers
│   │   │   │   └── Stack (Stack)
│   │   │   └── routes (Routing configuration under the resource arrangement menu)
│   │   │   └── index.js
│   │   ├── identity (Identity management)
│   │   │   ├── App.jsx
│   │   │   ├── containers
│   │   │   │   ├── Domain (Domain)
│   │   │   │   ├── Project (Project)
│   │   │   │   ├── Role (Role)
│   │   │   │   ├── User (User)
│   │   │   │   └── UserGroup (User group)
│   │   │   └── routes (Routing configuration)
│   │   │   └── index.js
│   │   ├── management (Operation and maintenance management)
│   │   │   ├── App.jsx
│   │   │   ├── containers
│   │   │   │   └── RecycleBin (Recycle bin)
│   │   │   └── routes (Routing configuration)
│   │   │   └── index.js
│   │   ├── network (Network)
│   │   │   ├── App.jsx
│   │   │   ├── containers
│   │   │   │   ├── FloatingIp (Floating ip)
│   │   │   │   ├── LoadBalancers (Load balancing)
│   │   │   │   ├── Network (Network)
│   │   │   │   ├── QoSPolicy (Qos policy)
│   │   │   │   ├── Router (Routing)
│   │   │   │   ├── SecurityGroup (Security group)
│   │   │   │   ├── Topology (Network topology)
│   │   │   │   ├── VPN (VPN)
│   │   │   │   └── VirtualAdapter (Virtual Adapter)
│   │   │   └── routes (Routing configuration)
│   │   │   └── index.js
│   │   ├── storage (Storage)
│   │   │   ├── App.jsx
│   │   │   ├── containers
│   │   │   │   ├── Backup (Backup)
│   │   │   │   ├── Snapshot (Volume snapshot)
│   │   │   │   ├── Storage (Storage backend)
│   │   │   │   ├── Volume (Volume)
│   │   │   │   └── VolumeType (Volume type)
│   │   │   │   ├── QosSpec (QoS)
│   │   │   │   ├── VolumeType (Volume type)
│   │   │   │   └── index.jsx
│   │   │   └── routes ()
│   │   │   └── index.js
│   │   └── user (Login page)
│   │   ├── App.jsx
│   │   ├── containers
│   │   │   ├── ChangePassword (Change password-according to system configuration)
│   │   │   │   ├── index.jsx
│   │   │   │   └── index.less
│   │   │   └── Login (Login)
│   │   │   ├── index.jsx
│   │   │   └── index.less
│   │   └── routes (Routing configuration)
│   │   └── index.js
│   ├── resources (Store the public functions and status of each resource used by itself)
│   ├── stores (Data processing, divide folders by resource type)
│   │   ├── base-list.js (Base class for list data)
│   │   ├── base.js (Base class for data manipulation)
│   │   ├── cinder
│   │   ├── glance
│   │   ├── heat
│   │   ├── ironic
│   │   ├── keystone
│   │   ├── neutron
│   │   ├── nova
│   │   ├── octavia
│   │   ├── overview-admin.js
│   │   ├── project.js
│   │   ├── root.js
│   │   └── skyline
│   ├── styles (Public styles)
│   │   ├── base.less
│   │   ├── main.less
│   │   ├── reset.less
│   │   └── variables.less
│   └── utils (Public functions)
│   ├── RouterConfig.jsx
│   ├── constants.js
│   ├── cookie.js
│   ├── file.js
│   ├── file.spec.js
│   ├── index.js
│   ├── index.test.js (Unit testing)
│   ├── local-storage.js
│   ├── local-storage.spec.js (Unit testing)
│   ├── request.js
│   ├── table.jsx
│   ├── time.js
│   ├── time.spec.js
│   ├── translate.js
│   ├── translate.spec.js
│   ├── validate.js
│   ├── yaml.js
│   └── yaml.spec.js
├── test
│   ├── e2e (E2E testing)
│   └── unit (Unit testing)
├── tools
│   └── git_config
│   └── commit_message.txt
└── yarn.lock
```