style(attachment): 统一附件上传按钮位置及样式及提示文案格式

- 将站点所有附件上传按钮移至表格下方左侧，与批量下载按钮分开，布局统一
- 统一附件上传按钮旁提示文案格式，改为同一行按钮右侧显示，间距固定30px，文本左对齐
- 统一附件上传支持文件格式说明为“支持pdf、bmp、jpeg、png、jpg、doc、docx、ppt、pptx、xlsx、xls、eml、msg、zip的文件格式，单个文件不超过500M”
- 统一单个附件文件大小限制改为500M，涉及多页面文件修改
- 恢复vehicle-attachment-upload组件showTip属性门控，支持按需隐藏提示
- 修复master-order编辑页附件上传按钮与描述文字排列，改为单行且按钮左侧描述右侧排列
- 优化customer-archive客商材料上传按钮及提示的布局，按钮左、提示右，间距30px，超长文案省略
- 调整部分页面缩进与标签样式，提升视觉一致性
- 修改部分组件及页面的css样式，适配上述布局与样式调整

src/views/business/contract-manage.vue

@@ -275,25 +275,19 @@
                 <el-option label="是" :value="1" />
               </el-select>
             </el-form-item>
-            <el-form-item label="一式">
-              <div class="contract-manage-form__inline-number">
-                <el-input
-                  v-model="form.copyCount"
-                  placeholder="请输入"
-                  @input="value => integerInput('copyCount', value)"
-                />
-                <span>份</span>
-              </div>
+            <el-form-item label="一式（份）">
+              <el-input
+                v-model="form.copyCount"
+                placeholder="请输入"
+                @input="value => integerInput('copyCount', value)"
+              />
             </el-form-item>
-            <el-form-item label="回款账期">
-              <div class="contract-manage-form__inline-number">
-                <el-input
-                  v-model="form.paymentDays"
-                  placeholder="请输入"
-                  @input="value => integerInput('paymentDays', value)"
-                />
-                <span>天</span>
-              </div>
+            <el-form-item label="回款账期（天）">
+              <el-input
+                v-model="form.paymentDays"
+                placeholder="请输入"
+                @input="value => integerInput('paymentDays', value)"
+              />
             </el-form-item>
           </div>
           <el-form-item label="备注" prop="remark" class="contract-manage-form__remark">
@@ -1059,27 +1053,11 @@ const AttachmentSection = defineComponent({
       [
         h('div', { class: 'dialog-section-title' }, this.title),
         h('div', { class: 'contract-manage-form__attachment-head' }, [
-          h('div', { class: 'contract-manage-form__attachment-actions' }, [
-            ...(!this.readonly
-              ? [
-                  h(VehicleAttachmentUpload, {
-                    modelValue: this.rows,
-                    fileTypes: this.attachmentFileTypes,
-                    maxSize: 500,
-                    showTip: false,
-                    showFileList: false,
-                    buttonText: '上传附件',
-                    'onUpdate:modelValue': this.handleChange,
-                    onChange: this.handleChange,
-                  }),
-                ]
-              : []),
-            h(
-              ElButton,
-              { type: 'primary', disabled: !this.rows.length, onClick: this.batchDownload },
-              () => '批量下载'
-            ),
-          ]),
+          h(
+            ElButton,
+            { type: 'primary', disabled: !this.rows.length, onClick: this.batchDownload },
+            () => '批量下载'
+          ),
         ]),
         h(
           ElTable,
@@ -1093,6 +1071,23 @@ const AttachmentSection = defineComponent({
           },
           () => columns
         ),
+        ...(!this.readonly
+          ? [
+              h('div', { class: 'contract-manage-form__attachment-upload' }, [
+                h(VehicleAttachmentUpload, {
+                  modelValue: this.rows,
+                  fileTypes: this.attachmentFileTypes,
+                  maxSize: 500,
+                  showTip: true,
+                  tip: '支持pdf、bmp、jpeg、png、jpg、doc、docx、ppt、pptx、xlsx、xls、eml、msg、zip的文件格式，单个文件不超过500M',
+                  showFileList: false,
+                  buttonText: '上传附件',
+                  'onUpdate:modelValue': this.handleChange,
+                  onChange: this.handleChange,
+                }),
+              ]),
+            ]
+          : []),
       ]
     );
   },
@@ -2229,25 +2224,6 @@ export default {
     }
   }
 
-  &__inline-number {
-    display: flex;
-    align-items: center;
-    gap: 8px;
-    width: 360px;
-    max-width: 100%;
-
-    :deep(.el-input) {
-      flex: 1;
-      width: auto;
-      min-width: 0;
-    }
-
-    span {
-      flex: none;
-      color: #606266;
-    }
-  }
-
   &__billing-head,
   &__attachment-head {
     display: flex;
@@ -2350,22 +2326,29 @@ export default {
   margin-bottom: 16px;
 }
 
-:deep(.contract-manage-form__attachment-actions) {
-  display: inline-flex;
-  align-items: center;
-  justify-content: flex-end;
-  flex-wrap: nowrap;
-  gap: 8px;
-  white-space: nowrap;
-}
+:deep(.contract-manage-form__attachment-upload) {
+  display: flex;
+  justify-content: flex-start;
+  margin-top: 12px;
 
-:deep(.contract-manage-form__attachment-actions .vehicle-attachment-upload) {
-  flex: 0 0 auto;
-  width: auto !important;
-}
+  :deep(.vehicle-attachment-upload) {
+    display: flex;
+    align-items: center;
+    width: auto;
+  }
 
-:deep(.contract-manage-form__attachment-actions .el-upload) {
-  display: inline-flex;
+  :deep(.el-upload) {
+    display: inline-flex;
+  }
+
+  :deep(.el-upload__tip) {
+    display: inline-block;
+    margin: 0 0 0 30px;
+    color: #909399;
+    font-size: 13px;
+    line-height: 1.4;
+    text-align: left;
+  }
 }
 
 .contract-manage-detail {
@@ -2415,4 +2398,8 @@ export default {
   white-space: normal;
   line-height: 1.2;
 }
+.contract-manage-form__tip {
+  color: #ff0000;
+  font-size: 12px;
+}
 </style>