样式修改

chenxt
1 parent 291c5919
Showing 4 changed files with 163 additions and 72 deletions
src/components/Common/CommonComponent/index.js
src/components/Common/CommonViewTable/index.js
src/indexNew.less
src/mes/common/commonModelComponent/index.js
@@ -1953,6 +1953,7 @@ export default class CommonComponent extends Component {
       const sFontColor = this.props.showConfig.sFontColor;
       obj.labelCol.style = { color: sFontColor, fontWeight: 'bold', backgroundColor: '#BFEFFF' };
     }
+    
     /*   返回值   */
     return obj;
   };
@@ -1997,6 +1998,7 @@ export default class CommonComponent extends Component {
         className: styles.formItemMag10, /*   样式名称   */
         ...this.formItemLayout, /*   主要是rowspan和colspan   */
       };
+
     }
     if (this.props.itemLabel === 'hide') {
       delete obj.label;
@@ -2974,7 +2976,7 @@ export default class CommonComponent extends Component {
     const fieldDecoratorProps = this.getFieldDecoratorProps();
     /*   通用组件(主表存在getFieldDecorator表单验证,而从表则不需要)   */
     const commonAssembly = this.props.bNewForm ? innerInput : (
-      <FormItem {...outFormItemProps}>
+      <FormItem {...outFormItemProps} >
         {viewInfo}
         {speacilNote}
         {imgBox}
@@ -301,14 +301,14 @@ class CommonViewTableRc extends Component {
           )
         : [];
     }
-    const formItemLayout = {
+    let formItemLayout = {
       labelCol: {
-        span: 7,
+        span: this.props?.sModelsId !== "17086722220003015078585693314000" ? 7 : 16,
         style: { color: "rgba(0, 0, 0, 0.65)", backgroundColor: "#BFEFFF" }
       },
-      wrapperCol: { span: 17 }
+      wrapperCol: { span: this.props?.sModelsId !== "17086722220003015078585693314000" ? 17 : 8, }
     };
-
+    
     /* 字段弹窗功能 */
     let commonFieldPopupProps = {};
     let commonFieldPopupTitle = "选择弹窗";
@@ -119,8 +119,8 @@
       .ant-form-item-label:not(.skipFlexBasis) {
         background-color: var(--form-label-bgColor, #EEEEEE) !important;
-        flex-basis: 160px !important;
-        max-width: 160px !important;
+        // flex-basis: 160px !important;
+        // max-width: 160px !important;
         height: var(--form-label-height, 40px);
         //   .size(160px, var(--form-label-height , 40px));
         line-height: 27px;
@@ -1650,7 +1650,7 @@ const CommonModelComponent = props =&gt; {
       tableBtnsConfig,
       children = []
     } = config;
-
+    
     if (showType === "none") {
       if (!children.length) return "";
       const footerComponent = useFooterComponent({ ...props, sTabName });
@@ -1671,7 +1671,7 @@ const CommonModelComponent = props =&gt; {
     } else if (showType === "costom") {
       return <RouterComponent {...props} sModelType={sName} />;
     } else {
-      const componentProps = {
+      let componentProps = {
         ...props,
         showType, // 展示类型（表单/表格）
         enabled: !bMesBill ? defaultEnabled : enabled, // 是否可编辑
@@ -1701,6 +1701,8 @@ const CommonModelComponent = props =&gt; {
     extraStyle.flexDirection = 'column';
     extraStyle.paddingTop = 5;
   }
+  const { sModelsId } = props;
+  const isNotTab = sModelsId === '12710101117119423319470'
   return (
     <>
@@ -1786,69 +1788,155 @@ const CommonModelComponent = props =&gt; {
                 {sEntireTabName && (
                   <TabTitleComponent {...props} sTabName={sEntireTabNameNew} />
                 )}
-                <Tabs
-                  destroyInactiveTabPane
-                  style={{ marginTop: sEntireTabName ? -10 : 0 }}
-                  onChange={() => {
-                    // setTimeout(() => {
-                    //   props.onSaveState({
-                    //     xlyTableKey: commonUtils.createSid()
-                    //   });
-                    // }, 0);
-                    if (window.refreshTableList) {
-                      props.onSaveState({
-                        refreshTableList: window.refreshTableList
-                      });
-                      window.refreshTableList = null;
-                    }
-                  }}
-                >
-                  {configList
-                    .filter(
-                      item =>
-                        !props.hideTabList ||
-                        !props.hideTabList.includes(item.sName)
-                    )
-                    .map((config, index) => {
-                      const { sName, sEnglishTabName, sBig5TabName, sTabName } = config;
-                      const sTabNewName = sLanguage === 'sEnglish' ? sEnglishTabName : sLanguage === 'sBig5' ?
-                        sBig5TabName : sTabName;
-                      let disabled = false;
-
-                      if (sTabName === "拼接列表" && sName === "slaveWypj3") {
-                        // 特殊处理：拼接详情可保存时，拼接列表tab不可点击
-                        disabled =
-                          props.slaveWypj2Data?.[0]?.bSave === false ||
-                          props.slaveWypj2Data?.[0]?.bSave === 0;
-                      } else if (
-                        (sTabName === "复卷成品检验列表" &&
-                          sName === "salveWydm3") ||
-                        (sTabName === "卷盘明细" && sName === "salveWydm4")
-                      ) {
-                        // 特殊处理：复卷成品检验详情可保存时，复卷成品检验列表/卷盘明细tab不可点击
-                        disabled =
-                          props.salveWydm2Data?.[0]?.bSave === false ||
-                          props.salveWydm2Data?.[0]?.bSave === 0;
-                      } else if (
-                        sTabName === "成品批次列表" &&
-                        sName === "salveWybz3"
-                      ) {
-                        // 特殊处理：成品批次详情可保存时，成品批次列表列表tab不可点击
-                        disabled =
-                          props.salveWybz2Data?.[0]?.bSave === false ||
-                          props.salveWybz2Data?.[0]?.bSave === 0;
+                {
+                  !isNotTab ? <Tabs
+                    destroyInactiveTabPane
+                    style={{ marginTop: sEntireTabName ? -10 : 0 }}
+                    onChange={() => {
+
+                      if (window.refreshTableList) {
+                        props.onSaveState({
+                          refreshTableList: window.refreshTableList
+                        });
+                        window.refreshTableList = null;
                       }
-                      return (
-                        <TabPane
-                          tab={sTabNewName}
-                          key={`${sName}_${sTabName}`}
-                          disabled={disabled}
-                        >
-                          {getComponent(config, index)}
-                        </TabPane>
-                      );
-                    })}
-                </Tabs>
+                    }}
+                  >
+                    {configList
+                      .filter(
+                        item =>
+                          !props.hideTabList ||
+                          !props.hideTabList.includes(item.sName)
+                      )
+                      .map((config, index) => {
+                        const { sName, sEnglishTabName, sBig5TabName, sTabName } = config;
+                        const sTabNewName = sLanguage === 'sEnglish' ? sEnglishTabName : sLanguage === 'sBig5' ?
+                          sBig5TabName : sTabName;
+                        let disabled = false;
+
+                        if (sTabName === "拼接列表" && sName === "slaveWypj3") {
+                          // 特殊处理：拼接详情可保存时，拼接列表tab不可点击
+                          disabled =
+                            props.slaveWypj2Data?.[0]?.bSave === false ||
+                            props.slaveWypj2Data?.[0]?.bSave === 0;
+                        } else if (
+                          (sTabName === "复卷成品检验列表" &&
+                            sName === "salveWydm3") ||
+                          (sTabName === "卷盘明细" && sName === "salveWydm4")
+                        ) {
+                          // 特殊处理：复卷成品检验详情可保存时，复卷成品检验列表/卷盘明细tab不可点击
+                          disabled =
+                            props.salveWydm2Data?.[0]?.bSave === false ||
+                            props.salveWydm2Data?.[0]?.bSave === 0;
+                        } else if (
+                          sTabName === "成品批次列表" &&
+                          sName === "salveWybz3"
+                        ) {
+                          // 特殊处理：成品批次详情可保存时，成品批次列表列表tab不可点击
+                          disabled =
+                            props.salveWybz2Data?.[0]?.bSave === false ||
+                            props.salveWybz2Data?.[0]?.bSave === 0;
+                        }
+                        return (
+                          <TabPane
+                            tab={sTabNewName}
+                            key={`${sName}_${sTabName}`}
+                            disabled={disabled}
+                          >
+                            {getComponent(config, index)}
+                          </TabPane>
+                        );
+                      })}
+                  </Tabs> : <div style={{ width: '100%', height: '100%' }}>
+                    {
+                      (() => {
+                        const visibleConfigs = configList.filter(
+                          item =>
+                            !props.hideTabList ||
+                            !props.hideTabList.includes(item.sName)
+                        );
+
+                        const first = visibleConfigs[0];
+                        const secondAndThird = visibleConfigs.slice(1, 3); // 索引 1 和 2
+                        const rest = visibleConfigs.slice(3);
+
+                        return (
+                          <>
+                            {/* 第一个单独一行 */}
+                            {first && (
+                              <div style={{ width: '100%', marginBottom: '8px' }}>
+                                {renderConfig(first, 0)}
+                              </div>
+                            )}
+
+                            {/* 第二和第三放一行 */}
+                            {secondAndThird.length > 0 && (
+                              <div
+                                style={{
+                                  display: 'flex',
+                                  gap: '8px',
+                                  marginBottom: '8px',
+                                  width: '100%',
+                                }}
+                              >
+                                {secondAndThird.map((config, idx) => {
+                                  const indexInOriginal = idx + 1; // 原始索引：1, 2
+                                  return (
+                                    <div
+                                      key={config.sName || indexInOriginal}
+                                      style={{ flex: 1, minWidth: 0 }}
+                                    >
+                                      {renderConfig(config, indexInOriginal)}
+                                    </div>
+                                  );
+                                })}
+                              </div>
+                            )}
+
+                            {/* 剩下的每个占一行 */}
+                            {rest.map((config, idx) => {
+                              const originalIndex = idx + 3;
+                              return (
+                                <div
+                                  key={config.sName || originalIndex}
+                                  style={{ width: '100%', marginBottom: '8px' }}
+                                >
+                                  {renderConfig(config, originalIndex)}
+                                </div>
+                              );
+                            })}
+                          </>
+                        );
+
+                        // 提取公共逻辑，避免重复
+                        function renderConfig(config, index) {
+                          const { sName, sEnglishTabName, sBig5TabName, sTabName } = config;
+                          let disabled = false;
+
+                          if (sTabName === '拼接列表' && sName === 'slaveWypj3') {
+                            disabled =
+                              props.slaveWypj2Data?.[0]?.bSave === false ||
+                              props.slaveWypj2Data?.[0]?.bSave === 0;
+                          } else if (
+                            (sTabName === '复卷成品检验列表' && sName === 'salveWydm3') ||
+                            (sTabName === '卷盘明细' && sName === 'salveWydm4')
+                          ) {
+                            disabled =
+                              props.salveWydm2Data?.[0]?.bSave === false ||
+                              props.salveWydm2Data?.[0]?.bSave === 0;
+                          } else if (sTabName === '成品批次列表' && sName === 'salveWybz3') {
+                            disabled =
+                              props.salveWybz2Data?.[0]?.bSave === false ||
+                              props.salveWybz2Data?.[0]?.bSave === 0;
+                          }
+
+                          return getComponent(config, index);
+                        }
+                      })()
+                    }
+                  </div>
+                }
+
               </div>
             );
           }
@@ -2015,7 +2103,8 @@ const CommonViewTableComponent = props =&gt; {
         if (commonUtils.isEmptyObject(viewRow)) {
           viewProps.enabledNew = false;
         }
-
+        console.log(viewProps, 'viewProps');
+        
         return (
           <>
             <TabTitleComponent {...props} sTabName={groupList[index]} />