Merge pull request #4357 from deandex/feature/project-plan-simplification-0

fix: #4355 - remove duration from payload, #4350 - revert back duration field and css

Author: mirzailhami

src/projects/detail/components/PhaseCard/EditStageForm.jsx

@@ -76,7 +76,6 @@ class EditStageForm extends React.Component {
   }
 
   submitValue(model) {
-    console.log(model)
     const { phase, phaseIndex, updatePhaseAction } = this.props
     const {
       publishClicked
@@ -91,8 +90,7 @@ class EditStageForm extends React.Component {
       description: model.description || ' ',
       startDate: updatedStartDate,
       endDate: updatedEndDate || '',
-      status: newStatus,
-      duration: moment.utc(updatedEndDate).diff(updatedStartDate, 'days')
+      status: newStatus
     })
     this.setState({
       isUpdating: true,
@@ -102,6 +100,7 @@ class EditStageForm extends React.Component {
   }
 
   onFormSubmit(model) {
+    console.log(model)
     const { phase } = this.props
     const { showActivatingWarning, publishClicked } = this.state
 
@@ -244,8 +243,6 @@ class EditStageForm extends React.Component {
     endDate = moment.utc(endDate).format('YYYY-MM-DD')
     const canDelete = phase.status !== PHASE_STATUS_ACTIVE && phase.status !== PHASE_STATUS_COMPLETED
     const isDraft = phase.status === PHASE_STATUS_DRAFT
-    const duration = moment.utc(endDate).diff(startDate, 'days')
-    console.log(duration)
 
     return (
       <div styleName="container">
@@ -326,14 +323,6 @@ class EditStageForm extends React.Component {
                   name="endDate"
                   value={endDate}
                 />
-                <TCFormFields.TextInput
-                  wrapperClass={`${styles['input-row']}`}
-                  disabled
-                  label="Duration"
-                  type="text"
-                  name="duration"
-                  value={`${duration} days`}
-                />
               </div>
               {!showActivatingWarning ? (
                 <div styleName="group-bottom">

src/projects/detail/components/PhaseCard/EditStageForm.scss

@@ -33,7 +33,7 @@
 
 .input-row {
   display: inline-block;
-  width: 45%;
+  width: 50%;
 
   :global  {
 
@@ -51,7 +51,7 @@
   }
   input, textarea {
     display: inline-block;
-    width:calc(100% - 170px);
+    width:calc(100% - 170px)!important;
   }
 
   textarea{
@@ -67,7 +67,7 @@
     white-space: nowrap;
     display: block;
     width: 150px;
-    
+
   }
 
   input:not([type="checkbox"]):disabled {
@@ -108,7 +108,7 @@
 
 .title-label-layer,
 .description-label-layer {
-  
+
   .input-row {
     width: 100%;
     input {
@@ -158,40 +158,6 @@
   }
 }
 
-.label-layer {
-  .input-row:nth-child(1) {
-    input {
-      width: calc(100% - 170px);
-    }
-  }
-
-  .input-row:nth-child(2) {
-    width: 35%;
-
-    label {
-      width: 75px;
-    }
-
-    input{
-      width: calc(100% - 100px);
-    }
-  }
-  
-  .input-row:nth-child(3) {
-    width: 20%;
-
-    label {
-      width: 70px;
-      padding-right: 0;
-    }
-
-    input{
-      width: calc(100% - 90px);
-      font-size: 13px;
-    }
-  }
-}
-
 // screen < 1024px
 @media screen and (max-width: 1023px) {
   .label-layer:nth-child(4) > :global(.Tooltip) {
@@ -205,7 +171,7 @@
   .label-layer,
   .input-row {
     display: block;
-    width: 100% !important;
+    width: 100%;
     input:not([type="checkbox"]):disabled {
       width: 100%;
     }
@@ -237,7 +203,7 @@
       display: block;
     }
     label {
-      width: 100% !important;
+      width: 100%;
       display: block;
       text-align: left;
       margin: 0;