yujunjun/strapi
1
0
Fork 0
mirror of https://github.com/strapi/strapi.git synced 2025-12-25 14:14:10 +00:00
Code Issues Packages Projects Releases Wiki Activity

New design edit view group field

Browse Source
This commit is contained in:
soupette 2019-08-09 13:23:39 +02:00
parent b36079124b
commit fb5623df66
22 changed files with 671 additions and 136 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
examples/getstarted/api/article/models/Article.settings.json
View File

@ -22,7 +22,8 @@
"type": "text"
},
"published": {
"type": "boolean"
"type": "boolean",
"default": true
},
"json": {
"type": "json"
@ -39,6 +40,10 @@
},
"content": {
"type": "richtext"
},
"tags": {
"collection": "tag",
"via": "articles"
}
}
}

52
examples/getstarted/api/recipe/config/routes.json Normal file
View File

@ -0,0 +1,52 @@
{
"routes": [
{
"method": "GET",
"path": "/recipes",
"handler": "Recipe.find",
"config": {
"policies": []
}
},
{
"method": "GET",
"path": "/recipes/count",
"handler": "Recipe.count",
"config": {
"policies": []
}
},
{
"method": "GET",
"path": "/recipes/:id",
"handler": "Recipe.findOne",
"config": {
"policies": []
}
},
{
"method": "POST",
"path": "/recipes",
"handler": "Recipe.create",
"config": {
"policies": []
}
},
{
"method": "PUT",
"path": "/recipes/:id",
"handler": "Recipe.update",
"config": {
"policies": []
}
},
{
"method": "DELETE",
"path": "/recipes/:id",
"handler": "Recipe.delete",
"config": {
"policies": []
}
}
]
}

8
examples/getstarted/api/recipe/controllers/Recipe.js Normal file
View File

@ -0,0 +1,8 @@
'use strict';
/**
* Read the documentation (https://strapi.io/documentation/3.0.0-beta.x/guides/controllers.html#core-controllers)
* to customize this controller
*/
module.exports = {};

44
examples/getstarted/api/recipe/models/Recipe.js Normal file
View File

@ -0,0 +1,44 @@
'use strict';
/**
* Lifecycle callbacks for the `Recipe` model.
*/
module.exports = {
// Before saving a value.
// Fired before an `insert` or `update` query.
// beforeSave: async (model, attrs, options) => {},
// After saving a value.
// Fired after an `insert` or `update` query.
// afterSave: async (model, response, options) => {},
// Before fetching a value.
// Fired before a `fetch` operation.
// beforeFetch: async (model, columns, options) => {},
// After fetching a value.
// Fired after a `fetch` operation.
// afterFetch: async (model, response, options) => {},
// Before fetching all values.
// Fired before a `fetchAll` operation.
// beforeFetchAll: async (model, columns, options) => {},
// After fetching all values.
// Fired after a `fetchAll` operation.
// afterFetchAll: async (model, response, options) => {},
// Before creating a value.
// Fired before an `insert` query.
// beforeCreate: async (model, attrs, options) => {},
// After creating a value.
// Fired after an `insert` query.
// afterCreate: async (model, attrs, options) => {},
// Before updating a value.
// Fired before an `update` query.
// beforeUpdate: async (model, attrs, options) => {},
// After updating a value.
// Fired after an `update` query.
// afterUpdate: async (model, attrs, options) => {},
// Before destroying a value.
// Fired before a `delete` query.
// beforeDestroy: async (model, attrs, options) => {},
// After destroying a value.
// Fired after a `delete` query.
// afterDestroy: async (model, attrs, options) => {}
};

40
examples/getstarted/api/recipe/models/Recipe.settings.json Normal file
View File

@ -0,0 +1,40 @@
{
"connection": "default",
"collectionName": "recipes",
"info": {
"name": "recipe",
"description": ""
},
"options": {
"increments": true,
"timestamps": [
"created_at",
"updated_at"
],
"comment": ""
},
"attributes": {
"name": {
"type": "string"
},
"description": {
"type": "text"
},
"ingredients": {
"group": "ingredient",
"required": true,
"repeatable": true,
"type": "group"
},
"tools": {
"group": "ingredient",
"required": true,
"repeatable": true,
"type": "group"
},
"mainIngredient": {
"group": "ingredient",
"type": "group"
}
}
}

8
examples/getstarted/api/recipe/services/Recipe.js Normal file
View File

@ -0,0 +1,8 @@
'use strict';
/**
* Read the documentation (https://strapi.io/documentation/3.0.0-beta.x/guides/services.html#core-services)
* to customize this service
*/
module.exports = {};

52
examples/getstarted/api/tag/config/routes.json Normal file
View File

@ -0,0 +1,52 @@
{
"routes": [
{
"method": "GET",
"path": "/tags",
"handler": "Tag.find",
"config": {
"policies": []
}
},
{
"method": "GET",
"path": "/tags/count",
"handler": "Tag.count",
"config": {
"policies": []
}
},
{
"method": "GET",
"path": "/tags/:id",
"handler": "Tag.findOne",
"config": {
"policies": []
}
},
{
"method": "POST",
"path": "/tags",
"handler": "Tag.create",
"config": {
"policies": []
}
},
{
"method": "PUT",
"path": "/tags/:id",
"handler": "Tag.update",
"config": {
"policies": []
}
},
{
"method": "DELETE",
"path": "/tags/:id",
"handler": "Tag.delete",
"config": {
"policies": []
}
}
]
}

8
examples/getstarted/api/tag/controllers/Tag.js Normal file
View File

@ -0,0 +1,8 @@
'use strict';
/**
* Read the documentation (https://strapi.io/documentation/3.0.0-beta.x/guides/controllers.html#core-controllers)
* to customize this controller
*/
module.exports = {};

44
examples/getstarted/api/tag/models/Tag.js Normal file
View File

@ -0,0 +1,44 @@
'use strict';
/**
* Lifecycle callbacks for the `Tag` model.
*/
module.exports = {
// Before saving a value.
// Fired before an `insert` or `update` query.
// beforeSave: async (model, attrs, options) => {},
// After saving a value.
// Fired after an `insert` or `update` query.
// afterSave: async (model, response, options) => {},
// Before fetching a value.
// Fired before a `fetch` operation.
// beforeFetch: async (model, columns, options) => {},
// After fetching a value.
// Fired after a `fetch` operation.
// afterFetch: async (model, response, options) => {},
// Before fetching all values.
// Fired before a `fetchAll` operation.
// beforeFetchAll: async (model, columns, options) => {},
// After fetching all values.
// Fired after a `fetchAll` operation.
// afterFetchAll: async (model, response, options) => {},
// Before creating a value.
// Fired before an `insert` query.
// beforeCreate: async (model, attrs, options) => {},
// After creating a value.
// Fired after an `insert` query.
// afterCreate: async (model, attrs, options) => {},
// Before updating a value.
// Fired before an `update` query.
// beforeUpdate: async (model, attrs, options) => {},
// After updating a value.
// Fired after an `update` query.
// afterUpdate: async (model, attrs, options) => {},
// Before destroying a value.
// Fired before a `delete` query.
// beforeDestroy: async (model, attrs, options) => {},
// After destroying a value.
// Fired after a `delete` query.
// afterDestroy: async (model, attrs, options) => {}
};

23
examples/getstarted/api/tag/models/Tag.settings.json Normal file
View File

@ -0,0 +1,23 @@
{
"connection": "default",
"collectionName": "tags",
"info": {
"name": "tag",
"description": ""
},
"options": {
"increments": true,
"timestamps": true,
"comment": ""
},
"attributes": {
"name": {
"type": "string"
},
"articles": {
"collection": "article",
"dominant": true,
"via": "tags"
}
}
}

8
examples/getstarted/api/tag/services/Tag.js Normal file
View File

@ -0,0 +1,8 @@
'use strict';
/**
* Read the documentation (https://strapi.io/documentation/3.0.0-beta.x/guides/services.html#core-services)
* to customize this service
*/
module.exports = {};

26
examples/getstarted/groups/ingredient.json Normal file
View File

@ -0,0 +1,26 @@
{
"info": {
"name": "ingredient",
"description": ""
},
"connection": "default",
"collectionName": "groups_ingredients",
"attributes": {
"name": {
"type": "string",
"required": true
},
"quantity": {
"type": "integer"
},
"pictures": {
"collection": "file",
"via": "related",
"plugin": "upload",
"required": false
},
"price": {
"type": "decimal"
}
}
}

13
examples/getstarted/groups/tool.json Normal file
View File

@ -0,0 +1,13 @@
{
"info": {
"name": "tool",
"description": ""
},
"connection": "default",
"collectionName": "groups_tools",
"attributes": {
"name": {
"type": "string"
}
}
}

24
packages/strapi-plugin-content-manager/admin/src/assets/images/grab_icon_blue.svg Normal file
View File

@ -0,0 +1,24 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="6px" height="8px" viewBox="0 0 6 8" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 56.3 (81716) - https://sketch.com -->
<title>Icon grab Copy</title>
<desc>Created with Sketch.</desc>
<g id="CM" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="CM-/-018---Content-manager-MULTIPLE-GROUPS-Copy-3" transform="translate(-1002.000000, -639.000000)" fill="#AED4FB">
<g id="Ingredients" transform="translate(271.000000, 576.000000)">
<g id="Flour-Copy" transform="translate(20.000000, 50.000000)">
<g id="Dropdown-OPEN">
<g id="Icon-grab-Copy" transform="translate(711.790795, 13.000000)">
<rect id="Rectangle-4" x="0" y="0" width="2.0167364" height="2"></rect>
<rect id="Rectangle-4" x="3.0251046" y="0" width="2.0167364" height="2"></rect>
<rect id="Rectangle-4" x="0" y="3" width="2.0167364" height="2"></rect>
<rect id="Rectangle-4" x="3.0251046" y="3" width="2.0167364" height="2"></rect>
<rect id="Rectangle-4" x="0" y="6" width="2.0167364" height="2"></rect>
<rect id="Rectangle-4" x="3.0251046" y="6" width="2.0167364" height="2"></rect>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

22
packages/strapi-plugin-content-manager/admin/src/assets/images/grab_icon_error.svg Normal file
View File

@ -0,0 +1,22 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="5px" height="8px" viewBox="0 0 5 8" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 56.3 (81716) - https://sketch.com -->
<title>Icon grab</title>
<desc>Created with Sketch.</desc>
<g id="CM" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="CM-/-018---Content-manager-MULTIPLE-GROUPS-Copy-3" transform="translate(-1003.000000, -1134.000000)" fill="#FAA684">
<g id="Ingredients" transform="translate(271.000000, 576.000000)">
<g id="Milk" transform="translate(20.000000, 545.000000)">
<g id="Icon-grab" transform="translate(712.000000, 13.222222)">
<rect id="Rectangle-4" x="0" y="0" width="2" height="1.88888889"></rect>
<rect id="Rectangle-4" x="3" y="0" width="2" height="1.88888889"></rect>
<rect id="Rectangle-4" x="0" y="2.83333333" width="2" height="1.88888889"></rect>
<rect id="Rectangle-4" x="3" y="2.83333333" width="2" height="1.88888889"></rect>
<rect id="Rectangle-4" x="0" y="5.66666667" width="2" height="1.88888889"></rect>
<rect id="Rectangle-4" x="3" y="5.66666667" width="2" height="1.88888889"></rect>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.4 KiB

55
packages/strapi-plugin-content-manager/admin/src/components/Group/GroupCollapse.js
View File

@ -6,18 +6,27 @@ import { DragSource, DropTarget } from 'react-dnd';
import { Collapse } from 'reactstrap';
import pluginId from '../../pluginId';
import ItemTypes from '../../utils/ItemTypes';
import Grab from '../../assets/images/grab_icon.svg';
import Logo from '../../assets/images/caret_top.svg';
import GrabBlue from '../../assets/images/grab_icon_blue.svg';
import GrabError from '../../assets/images/grab_icon_error.svg';
import { Flex, GroupCollapseWrapper, ImgWrapper } from './components';
import {
Flex,
FormWrapper,
GroupCollapseWrapper,
ImgWrapper,
} from './components';
import Form from './Form';
function GroupCollapse({
connectDragSource,
connectDropTarget,
doesPreviousFieldContainErrorsAndIsOpen,
hasErrors,
isDragging,
isFirst,
isOpen,
layout,
modifiedData,
@ -43,12 +52,30 @@ function GroupCollapse({
connectDragSource(ref);
connectDropTarget(ref);
// TODO change when the error caret top is available
const logo = hasErrors ? Logo : Logo;
let grab = isOpen ? GrabBlue : Grab;
if (hasErrors) {
grab = GrabError;
}
return (
<Fragment>
<GroupCollapseWrapper onClick={onClick} ref={ref} style={{ opacity }}>
<Flex style={{ fontWeight: 500 }}>
<ImgWrapper isOpen={isOpen}>
<img src={Logo} alt="logo" />
<GroupCollapseWrapper
doesPreviousFieldContainErrorsAndIsOpen={
doesPreviousFieldContainErrorsAndIsOpen
}
hasErrors={hasErrors}
isFirst={isFirst}
isOpen={isOpen}
onClick={onClick}
ref={ref}
style={{ opacity }}
>
<Flex>
<ImgWrapper hasErrors={hasErrors} isOpen={isOpen}>
<img src={logo} alt="logo" />
</ImgWrapper>
<FormattedMessage
id={`${pluginId}.containers.Edit.pluginHeader.title.new`}
@ -66,17 +93,17 @@ function GroupCollapse({
>
<i className="fa fa-trash" />
</button>
<button type="button" style={{ lineHeight: '32px' }}>
<button type="button" style={{ lineHeight: '36px' }}>
<img
src={Grab}
src={grab}
alt="grab icon"
style={{ verticalAlign: 'unset' }}
/>
</button>
</Flex>
</GroupCollapseWrapper>
<Collapse isOpen={isOpen}>
<div style={{ paddingTop: '25px' }}>
<Collapse isOpen={isOpen} style={{ backgroundColor: '#f5f5f5' }}>
<FormWrapper hasErrors={hasErrors} isOpen={isOpen}>
{fields.map((fieldRow, key) => {
return (
<div className="row" key={key}>
@ -97,7 +124,7 @@ function GroupCollapse({
</div>
);
})}
</div>
</FormWrapper>
</Collapse>
</Fragment>
);
@ -105,8 +132,11 @@ function GroupCollapse({
GroupCollapse.defaultProps = {
addRelation: () => {},
doesPreviousFieldContainErrorsAndIsOpen: false,
hasErrors: false,
isCreating: true,
isDragging: false,
isFirst: false,
isOpen: false,
layout: {},
move: () => {},
@ -116,7 +146,10 @@ GroupCollapse.defaultProps = {
GroupCollapse.propTypes = {
connectDragSource: PropTypes.func.isRequired,
connectDropTarget: PropTypes.func.isRequired,
doesPreviousFieldContainErrorsAndIsOpen: PropTypes.bool,
hasErrors: PropTypes.bool,
isDragging: PropTypes.bool,
isFirst: PropTypes.bool,
isOpen: PropTypes.bool,
layout: PropTypes.object,
modifiedData: PropTypes.object,

120
packages/strapi-plugin-content-manager/admin/src/components/Group/components.js
View File

@ -1,19 +1,30 @@
import styled from 'styled-components';
import styled, { css } from 'styled-components';
const Button = styled.div`
width: 100%;
height: 34px;
height: 37px;
margin-bottom: 27px;
text-align: center;
background-color: #fafafb;
border-radius: 2px;
border: 1px solid #e3e9f3;
border-top: 1px solid
${({ doesPreviousFieldContainErrorsAndIsClosed }) =>
doesPreviousFieldContainErrorsAndIsClosed ? '#FFA784' : '#e3e9f3'};
border-bottom-left-radius: 2px;
border-bottom-right-radius: 2px;
${({ withBorderRadius }) => {
if (withBorderRadius) {
return css`
border-radius: 2px;
`;
}
}}
color: #333740;
color: #007eff;
font-size: 12px;
font-weight: 700;
-webkit-font-smoothing: antialiased;
line-height: 35px;
line-height: 37px;
cursor: pointer;
text-transform: uppercase;
letter-spacing: 0.5px;
@ -31,14 +42,70 @@ const Flex = styled.div`
`;
const GroupCollapseWrapper = styled(Flex)`
height: 34px;
margin-bottom: 2px;
padding: 0 20px;
height: 36px;
padding: 0 15px;
justify-content: space-between;
line-height: 34px;
background-color: #ffffff;
border: 1px solid ${({ hasErrors, isOpen }) => {
if (hasErrors) {
return '#FFA784';
} else if (isOpen) {
return '#AED4FB';
} else {
return '#e3e9f3';
}
}}
${({ doesPreviousFieldContainErrorsAndIsOpen }) => {
if (doesPreviousFieldContainErrorsAndIsOpen) {
return css`
border-top: 1px solid #ffa784;
`;
}
}}
${({ isFirst }) => {
if (isFirst) {
return css`
border-top-right-radius: 2px;
border-top-left-radius: 2px;
`;
}
}}
border-bottom: 0;
line-height: 36px;
font-size: 13px;
border-radius: 2px;
font-weight: 500;
background-color: ${({ hasErrors, isOpen }) => {
if (hasErrors && isOpen) {
return '#FFE9E0';
} else if (isOpen) {
return '#E6F0FB';
} else {
return '#ffffff';
}
}}
${({ hasErrors, isOpen }) => {
if (hasErrors) {
return css`
color: #f64d0a;
font-weight: 600;
`;
}
if (isOpen) {
return css`
color: #007eff;
font-weight: 600;
`;
}
}}
button,
i,
img {
@ -47,6 +114,7 @@ const GroupCollapseWrapper = styled(Flex)`
outline: 0;
}
}
webkit-font-smoothing: antialiased;
`;
const ImgWrapper = styled.div`
@ -55,11 +123,35 @@ const ImgWrapper = styled.div`
margin: auto;
margin-right: 19px;
border-radius: 50%;
background-color: #e3e9f3;
background-color: ${({ hasErrors, isOpen }) => {
if (hasErrors) {
return '#FAA684';
} else if (isOpen) {
return '#AED4FB';
} else {
return '#e3e9f3';
}
}}
text-align: center;
line-height: 21px;
${({ isOpen }) => !isOpen && 'transform: rotate(180deg)'}
`;
export { Button, Flex, GroupCollapseWrapper, ImgWrapper };
const FormWrapper = styled.div`
padding-top: 27px;
padding-left: 15px;
padding-right: 15px;
border-top: 1px solid
${({ hasErrors, isOpen }) => {
if (hasErrors) {
return '#ffa784';
} else if (isOpen) {
return '#AED4FB';
} else {
return '#e3e9f3';
}
}};
`;
export { Button, Flex, FormWrapper, GroupCollapseWrapper, ImgWrapper };

238
packages/strapi-plugin-content-manager/admin/src/components/Group/index.js
View File

@ -13,6 +13,7 @@ import reducer, { initialState } from './reducer';
function Group({
addField,
groupErrorKeys,
isRepeatable,
label,
layout,
@ -71,12 +72,18 @@ function Group({
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [didCheckErrors]);
const groupValueLength = groupValue.length;
return (
<>
<div className="row">
<div
className="col-12"
style={{ paddingTop: 0, marginTop: '-2px', paddingBottom: 15 }}
style={{
paddingTop: 0,
marginTop: '-2px',
paddingBottom: isRepeatable ? 7 : 14,
}}
>
<span
style={{
@ -84,127 +91,141 @@ function Group({
fontWeight: 500,
}}
>
{label}
{label}&nbsp;
{isRepeatable && `(${groupValueLength})`}
</span>
</div>
</div>
<div
className="row"
style={{
marginLeft: '-10px',
marginRight: '-10px',
marginBottom: '18px',
backgroundColor: '#f5f5f5',
padding: '0 20px 10px 10px',
paddingTop: isRepeatable ? '13px' : '20px',
}}
>
{!isRepeatable ? (
<div className="col-12">
{fields.map((fieldRow, key) => {
return (
<div className="row" key={key}>
{fieldRow.map(field => {
const keys = `${name}.${field.name}`;
{!isRepeatable ? (
<div
style={{
margin: '0 10px',
padding: '0 15px',
paddingTop: 21,
backgroundColor: '#f5f5f5',
marginBottom: 18,
}}
>
{fields.map((fieldRow, key) => {
return (
<div className="row" key={key}>
{fieldRow.map(field => {
const keys = `${name}.${field.name}`;
return (
<Form
key={keys}
modifiedData={modifiedData}
keys={keys}
fieldName={field.name}
layout={layout}
onChange={onChange}
/>
);
})}
</div>
);
})}
</div>
) : (
<div className="col-12">
<div className="row">
{groupValue.map((field, index) => {
return (
<div className="col-12" key={field._temp__id}>
<GroupCollapse
collapseAll={() => {
dispatch({
type: 'COLLAPSE_ALL',
});
}}
onClick={() => {
dispatch({
type: 'TOGGLE_COLLAPSE',
index,
});
}}
findField={findField}
groupName={name}
isOpen={collapses[index].isOpen}
id={field._temp__id}
layout={layout}
return (
<Form
key={keys}
modifiedData={modifiedData}
move={move}
name={`${name}.${index}`}
keys={keys}
fieldName={field.name}
layout={layout}
onChange={onChange}
removeField={e => {
e.stopPropagation();
if (groupValue.length - 1 < min) {
strapi.notification.info(
`${pluginId}.components.Group.notification.info.minimum-requirement`
);
}
const shouldAddEmptyField = groupValue.length - 1 < min;
dispatch({
type: 'REMOVE_COLLAPSE',
index,
shouldAddEmptyField,
});
removeField(`${name}.${index}`, shouldAddEmptyField);
}}
/>
</div>
);
})}
<div className="col-12">
<Button
onClick={() => {
if (groupValue.length < max) {
addField(name);
dispatch({
type: 'ADD_NEW_FIELD',
});
return;
}
strapi.notification.info(
`${pluginId}.components.Group.notification.info.maximum-requirement`
);
}}
>
<i className="fa fa-plus" />
<FormattedMessage
id={`${pluginId}.containers.EditView.Group.add.new`}
/>
</Button>
);
})}
</div>
</div>
</div>
)}
</div>
);
})}
</div>
) : (
<div
style={{
margin: '0 10px',
}}
>
{groupValue.map((field, index) => {
const groupFieldName = `${name}.${index}`;
const doesPreviousFieldContainErrorsAndIsOpen =
groupErrorKeys.includes(`${name}.${index - 1}`) &&
index !== 0 &&
collapses[index - 1].isOpen === false;
const hasErrors = groupErrorKeys.includes(groupFieldName);
return (
<GroupCollapse
key={field._temp__id}
collapseAll={() => {
dispatch({
type: 'COLLAPSE_ALL',
});
}}
doesPreviousFieldContainErrorsAndIsOpen={
doesPreviousFieldContainErrorsAndIsOpen
}
onClick={() => {
dispatch({
type: 'TOGGLE_COLLAPSE',
index,
});
}}
findField={findField}
groupName={name}
hasErrors={hasErrors}
isFirst={index === 0}
isOpen={collapses[index].isOpen}
id={field._temp__id}
layout={layout}
modifiedData={modifiedData}
move={move}
name={groupFieldName}
onChange={onChange}
removeField={e => {
e.stopPropagation();
if (groupValue.length - 1 < min) {
strapi.notification.info(
`${pluginId}.components.Group.notification.info.minimum-requirement`
);
}
const shouldAddEmptyField = groupValue.length - 1 < min;
dispatch({
type: 'REMOVE_COLLAPSE',
index,
shouldAddEmptyField,
});
removeField(`${name}.${index}`, shouldAddEmptyField);
}}
/>
);
})}
<Button
doesPreviousFieldContainErrorsAndIsClosed={
groupValueLength > 0 &&
groupErrorKeys.includes(`${name}.${groupValueLength - 1}`) &&
collapses[groupValueLength - 1].isOpen === false
}
onClick={() => {
if (groupValue.length < max) {
addField(name);
dispatch({
type: 'ADD_NEW_FIELD',
});
return;
}
strapi.notification.info(
`${pluginId}.components.Group.notification.info.maximum-requirement`
);
}}
withBorderRadius={groupValue.length === 0}
>
<i className="fa fa-plus" />
<FormattedMessage
id={`${pluginId}.containers.EditView.Group.add.new`}
/>
</Button>
</div>
)}
</>
);
}
Group.defaultProps = {
addRelation: () => {},
groupErrorKeys: [],
groupValue: {},
label: '',
layout: {},
@ -216,6 +237,7 @@ Group.defaultProps = {
Group.propTypes = {
addField: PropTypes.func.isRequired,
addRelation: PropTypes.func,
groupErrorKeys: PropTypes.array,
groupValue: PropTypes.oneOfType([PropTypes.array, PropTypes.object]),
isRepeatable: PropTypes.bool.isRequired,
label: PropTypes.string,

2
packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/styles.scss
View File

@ -31,7 +31,7 @@
min-height: 294px;
max-height: 555px;
padding: 20px 20px 0 20px;
font-size: 16px;
font-size: 13px;
background-color: #fff;
line-height: 18px !important;
cursor: text;

1
packages/strapi-plugin-content-manager/admin/src/containers/EditView/components.js
View File

@ -2,6 +2,7 @@ import styled from 'styled-components';
const SubWrapper = styled.div`
background: #ffffff;
// background: red;
border-radius: 2px;
box-shadow: 0 2px 4px #e3e9f3;
`;

10
packages/strapi-plugin-content-manager/admin/src/containers/EditView/index.js
View File

@ -459,6 +459,15 @@ function EditView({
);
if (fieldsRow.length === 1 && group.type === 'group') {
const groupErrorKeys = Object.keys(errors)
.filter(errorKey => errorKey.includes(name))
.map(errorKey =>
errorKey
.split('.')
.slice(0, 2)
.join('.')
);
return (
<Group
{...group}
@ -469,6 +478,7 @@ function EditView({
keys: keys.split('.'),
});
}}
groupErrorKeys={groupErrorKeys}
groupValue={groupValue}
key={key}
isRepeatable={group.repeatable || false}

2
packages/strapi-plugin-content-manager/admin/src/containers/SettingViewModel/index.js
View File

@ -243,7 +243,7 @@ function SettingViewModel({
);
});
return ['id', ...options];
return options;
}
return input.selectOptions;