153 lines
3.7 KiB
JavaScript
153 lines
3.7 KiB
JavaScript
// Copyright 2021 99cloud
|
|
//
|
|
// Licensed under the Apache License, Version 2.0 (the "License");
|
|
// you may not use this file except in compliance with the License.
|
|
// You may obtain a copy of the License at
|
|
//
|
|
// http://www.apache.org/licenses/LICENSE-2.0
|
|
//
|
|
// Unless required by applicable law or agreed to in writing, software
|
|
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
// See the License for the specific language governing permissions and
|
|
// limitations under the License.
|
|
|
|
import React, { Component } from 'react';
|
|
import { inject, observer } from 'mobx-react';
|
|
import TabSelectTable from 'components/FormItem/TabSelectTable';
|
|
import { VolumeStore } from 'stores/cinder/volume';
|
|
import {
|
|
volumeColumns,
|
|
volumeFilters,
|
|
volumeSortProps,
|
|
} from 'resources/volume';
|
|
|
|
@inject('rootStore')
|
|
@observer
|
|
export default class VolumeSelectTable extends Component {
|
|
constructor(props) {
|
|
super(props);
|
|
this.stores = {
|
|
available: new VolumeStore(),
|
|
shared: new VolumeStore(),
|
|
};
|
|
}
|
|
|
|
get currentProjectId() {
|
|
return this.props.rootStore.projectId;
|
|
}
|
|
|
|
get hasAdminRole() {
|
|
return this.props.rootStore.hasAdminRole;
|
|
}
|
|
|
|
get showExternal() {
|
|
const { showExternal = false } = this.props;
|
|
return showExternal;
|
|
}
|
|
|
|
get networkTabs() {
|
|
const tabs = [
|
|
{ title: t('Available'), key: 'available' },
|
|
{ title: t('Shared'), key: 'shared' },
|
|
];
|
|
tabs.forEach((tab) => {
|
|
tab.props = this.getSelectTableProps(tab);
|
|
});
|
|
return tabs;
|
|
}
|
|
|
|
getSelectTableProps = (tab) => ({
|
|
columns: this.getColumns(tab),
|
|
filterParams: this.getVolumeFilters(tab),
|
|
extraParams: this.getVolumeExtraParams(tab),
|
|
backendPageStore: this.getStore(tab),
|
|
disabledFunc: this.getDisabledFunc(tab),
|
|
isMulti: this.props.isMulti || false,
|
|
...volumeSortProps,
|
|
});
|
|
|
|
getUrl = () => {};
|
|
|
|
getColumns = (tab) => {
|
|
const columns = volumeColumns;
|
|
const { key } = tab;
|
|
if (key === 'available') {
|
|
return columns.filter(
|
|
(it) => it.dataIndex !== 'status' && it.dataIndex !== 'attachments'
|
|
);
|
|
}
|
|
if (key === 'shared') {
|
|
return columns.filter((it) => it.dataIndex !== 'multiattach');
|
|
}
|
|
return columns;
|
|
};
|
|
|
|
onChange = (value) => {
|
|
const { onChange } = this.props;
|
|
onChange && onChange(value);
|
|
};
|
|
|
|
get labelStyle() {
|
|
return {
|
|
marginRight: 16,
|
|
};
|
|
}
|
|
|
|
getStore(tab) {
|
|
const { key } = tab;
|
|
return this.stores[key];
|
|
}
|
|
|
|
getVolumeFilters = (tab) => {
|
|
const { key } = tab;
|
|
const filters = [...volumeFilters];
|
|
if (key === 'shared') {
|
|
return filters.filter((it) => it.name !== 'multiattach');
|
|
}
|
|
if (key === 'available') {
|
|
return filters.filter((it) => it.name !== 'status');
|
|
}
|
|
return filters;
|
|
};
|
|
|
|
getVolumeExtraParams = (tab) => {
|
|
const { key } = tab;
|
|
if (key === 'shared') {
|
|
return { multiattach: true };
|
|
}
|
|
if (key === 'available') {
|
|
return { status: 'available' };
|
|
}
|
|
return {};
|
|
};
|
|
|
|
getDisabledFunc(tab) {
|
|
if (tab.key === 'available') {
|
|
const { disabledFunc = null } = this.props;
|
|
return disabledFunc;
|
|
}
|
|
return this.disallowedMultiAttach;
|
|
}
|
|
|
|
disallowedMultiAttach = (volume) => {
|
|
const { attachments = [] } = volume;
|
|
const { serverId } = this.props;
|
|
const attach = attachments.find((it) => it.server_id === serverId);
|
|
return !!attach;
|
|
};
|
|
|
|
render() {
|
|
const { isMulti = false, header, value } = this.props;
|
|
return (
|
|
<TabSelectTable
|
|
tabs={this.networkTabs}
|
|
onChange={this.onChange}
|
|
isMulti={isMulti}
|
|
header={header}
|
|
value={value}
|
|
/>
|
|
);
|
|
}
|
|
}
|