diff --git a/src/views/mes/deviceledger/detail/editIndex.vue b/src/views/mes/deviceledger/detail/editIndex.vue
index b8adc3db..067675be 100644
--- a/src/views/mes/deviceledger/detail/editIndex.vue
+++ b/src/views/mes/deviceledger/detail/editIndex.vue
@@ -12,22 +12,17 @@
           v-loading="formLoading || fileUploading"
           :element-loading-text="t('common.loading')"
         >
-          <el-row :gutter="16">
-            <el-col :span="8">
-              <el-form-item :label="t('EquipmentManagement.EquipmentLedger.images')" prop="images">
-                <UploadImg style="height: 100px" v-model="formData.images" />
-              </el-form-item>
-            </el-col>
-            <el-col :span="16">
+          <el-row :gutter="20" class="device-basic-layout">
+            <el-col :xs="24" :lg="18" class="device-basic-fields">
               <el-form-item :label="t('EquipmentManagement.EquipmentLedger.deviceCode')" prop="deviceCode">
-                <el-row :gutter="20" style="width: 100%">
-                  <el-col :xs="18" :sm="18" :md="16" :lg="14" :xl="10">
+                <el-row :gutter="12" class="device-code-row">
+                  <el-col :xs="18" :sm="18" :md="18" :lg="19" :xl="20">
                     <el-input v-model="formData.deviceCode"
                               :placeholder="t('EquipmentManagement.EquipmentLedger.placeholderDeviceCode')"
                               :disabled="Boolean(formData.isCode) || formType === 'update'" />
                   </el-col>
-                  <el-col :xs="24" :sm="6" :md="4" :lg="3" :xl="2">
-                    <div>
+                  <el-col :xs="6" :sm="6" :md="6" :lg="5" :xl="4">
+                    <div class="device-code-switch">
                       <el-switch v-model="formData.isCode" :disabled="formType === 'update'"
                                  @change="handleCodeAutoChange" />
                     </div>
@@ -72,57 +67,90 @@
 
               </el-row>
 
+              <el-row :gutter="20">
+                <el-col :span="12">
+                  <el-form-item :label="t('EquipmentManagement.EquipmentLedger.isSchedueld')" prop="isScheduled">
+                    <el-switch v-model="formData.isScheduled" :active-value="1" :inactive-value="0"
+                               :active-text="t('EquipmentManagement.EquipmentLedger.yes')"
+                               :inactive-text="t('EquipmentManagement.EquipmentLedger.no')" inline-prompt />
+                  </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                  <el-form-item :label="t('EquipmentManagement.EquipmentLedger.productionDate')" prop="productionDate">
+                    <el-date-picker v-model="formData.productionDate" type="date" value-format="YYYY-MM-DD"
+                                    :placeholder="t('EquipmentManagement.EquipmentLedger.placeholderProductionDate')" class="!w-full" />
+                  </el-form-item>
+                </el-col>
+              </el-row>
 
+              <el-row :gutter="20">
+                <el-col :span="12">
+                  <el-form-item :label="t('EquipmentManagement.EquipmentLedger.factoryEntryDate')" prop="factoryEntryDate">
+                    <el-date-picker v-model="formData.factoryEntryDate" type="date" value-format="YYYY-MM-DD"
+                                    :placeholder="t('EquipmentManagement.EquipmentLedger.placeholderFactoryEntryDate')" class="!w-full" />
+                  </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                  <el-form-item :label="t('EquipmentManagement.EquipmentLedger.deviceLocation')" prop="deviceLocation">
+                    <el-input v-model="formData.deviceLocation"
+                              :placeholder="t('EquipmentManagement.EquipmentLedger.placeholderDeviceLocation')" />
+                  </el-form-item>
+                </el-col>
+              </el-row>
 
-            </el-col>
-            <el-col :span="8">
-              <el-form-item :label="t('EquipmentManagement.EquipmentLedger.isSchedueld')" prop="isScheduled">
-                <el-switch v-model="formData.isScheduled" :active-value="1" :inactive-value="0"
-                           :active-text="t('EquipmentManagement.EquipmentLedger.yes')"
-                           :inactive-text="t('EquipmentManagement.EquipmentLedger.no')" inline-prompt />
-              </el-form-item>
-            </el-col>
-            <el-col :span="8">
-              <el-form-item :label="t('EquipmentManagement.EquipmentLedger.productionDate')" prop="productionDate">
-                <el-date-picker v-model="formData.productionDate" type="date" value-format="YYYY-MM-DD"
-                                :placeholder="t('EquipmentManagement.EquipmentLedger.placeholderProductionDate')" class="!w-full" />
-              </el-form-item>
-            </el-col>
-
-            <el-col :span="8">
-              <el-form-item :label="t('EquipmentManagement.EquipmentLedger.factoryEntryDate')" prop="factoryEntryDate">
-                <el-date-picker v-model="formData.factoryEntryDate" type="date" value-format="YYYY-MM-DD"
-                                :placeholder="t('EquipmentManagement.EquipmentLedger.placeholderFactoryEntryDate')" class="!w-full" />
-              </el-form-item>
-            </el-col>
+              <el-row :gutter="20">
+                <el-col :span="12">
+                  <el-form-item :label="t('EquipmentManagement.EquipmentLedger.deviceManagerName')" prop="deviceManagerIds">
+                    <el-select v-model="formData.deviceManagerIds" multiple filterable clearable
+                               :placeholder="t('EquipmentManagement.EquipmentLedger.placeholderDeviceManagerIds')" class="!w-full">
+                      <el-option v-for="item in users" :key="item.id" :label="item.nickname" :value="item.id" />
+                    </el-select>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                  <el-form-item :label="t('EquipmentManagement.EquipmentLedger.criticalComponent')" prop="componentIds">
+                    <el-input :model-value="criticalComponentDisplay" readonly clearable class="device-ledger-selection-input"
+                              :placeholder="t('EquipmentManagement.EquipmentLedger.placeholderComponentIds')"
+                              @clear="clearCriticalComponent" @click="openCriticalComponentDialog" />
+                  </el-form-item>
+                </el-col>
+              </el-row>
 
-            <el-col :span="12">
-              <el-form-item :label="t('EquipmentManagement.EquipmentLedger.deviceLocation')" prop="deviceLocation">
-                <el-input v-model="formData.deviceLocation"
-                          :placeholder="t('EquipmentManagement.EquipmentLedger.placeholderDeviceLocation')" />
-              </el-form-item>
-            </el-col>
-            <el-col :span="12">
-              <el-form-item :label="t('EquipmentManagement.EquipmentLedger.deviceManagerName')" prop="deviceManagerIds">
-                <el-select v-model="formData.deviceManagerIds" multiple filterable clearable
-                           :placeholder="t('EquipmentManagement.EquipmentLedger.placeholderDeviceManagerIds')" class="!w-full">
-                  <el-option v-for="item in users" :key="item.id" :label="item.nickname" :value="item.id" />
-                </el-select>
-              </el-form-item>
-            </el-col>
-            <el-col :span="12">
-              <el-form-item :label="t('EquipmentManagement.EquipmentLedger.criticalComponent')" prop="componentIds">
-                <el-input :model-value="criticalComponentDisplay" readonly clearable class="device-ledger-selection-input"
-                          :placeholder="t('EquipmentManagement.EquipmentLedger.placeholderComponentIds')"
-                          @clear="clearCriticalComponent" @click="openCriticalComponentDialog" />
-              </el-form-item>
+              <el-row :gutter="20">
+                <el-col :span="12">
+                  <el-form-item :label="t('EquipmentManagement.EquipmentLedger.sparePart')" prop="beijianIds">
+                    <el-input :model-value="beijianDisplay" readonly clearable class="device-ledger-selection-input"
+                              :placeholder="t('EquipmentManagement.EquipmentLedger.placeholderBeijianIds')" @clear="clearBeijian" @click="openBeijianDialog"/>
+                  </el-form-item>
+                </el-col>
+              </el-row>
             </el-col>
 
-            <el-col :span="12">
-              <el-form-item :label="t('EquipmentManagement.EquipmentLedger.sparePart')" prop="beijianIds">
-                <el-input :model-value="beijianDisplay" readonly clearable class="device-ledger-selection-input"
-                          :placeholder="t('EquipmentManagement.EquipmentLedger.placeholderBeijianIds')" @clear="clearBeijian" @click="openBeijianDialog"/>
-              </el-form-item>
+            <el-col :xs="24" :lg="6" class="device-basic-media">
+              <div class="device-media-panel">
+                <el-form-item label-width="0" prop="images" class="device-media-item">
+                  <div class="device-media-box device-media-upload-box">
+                    <span class="device-media-label">{{ t('EquipmentManagement.EquipmentLedger.images') }}</span>
+                    <UploadImg class="device-media-upload" v-model="formData.images" />
+                  </div>
+                </el-form-item>
+                <el-form-item v-if="formType === 'update'" label-width="0" prop="qrcodeUrl" class="device-media-item">
+                  <div class="device-media-box device-media-code-box">
+                    <span class="device-media-label">{{ t('EquipmentManagement.EquipmentLedger.qrcode') }}</span>
+                    <div class="device-media-code">
+                      <QrcodeActionCard :image-url="formData.qrcodeUrl" :print-id="formData.id"
+                                        :print-title="`${formData.deviceName || 'Device'} QR Code`" :print-paper-width="80" :print-paper-height="80"
+                                        :print-max-width="220" :empty-text="t('EquipmentManagement.EquipmentLedger.qrcodeEmpty')"
+                                        :error-text="t('EquipmentManagement.EquipmentLedger.qrcodeLoadError')"
+                                        :refresh-url="getQrcodeRefreshUrl()" :refresh-disabled="!formData.id || !formData.deviceCode"
+                                        refresh-confirm-text="Refresh QR code?"
+                                        :template-json="formData.templateJson"
+                                        :print-data="buildPrintData()"
+                                        @refresh-success="handleQrcodeRefreshSuccess" />
+                    </div>
+                  </div>
+                </el-form-item>
+              </div>
             </el-col>
 
             <el-col :span="24">
@@ -135,19 +163,6 @@
                 />
               </el-form-item>
             </el-col>
-            <el-col v-if="formType === 'update'" :span="24">
-              <el-form-item :label="t('EquipmentManagement.EquipmentLedger.qrcode')" prop="qrcodeUrl">
-                <QrcodeActionCard :image-url="formData.qrcodeUrl" :print-id="formData.id"
-                                  :print-title="`${formData.deviceName || 'Device'} QR Code`" :print-paper-width="80" :print-paper-height="80"
-                                  :print-max-width="220" :empty-text="t('EquipmentManagement.EquipmentLedger.qrcodeEmpty')"
-                                  :error-text="t('EquipmentManagement.EquipmentLedger.qrcodeLoadError')"
-                                  :refresh-url="getQrcodeRefreshUrl()" :refresh-disabled="!formData.id || !formData.deviceCode"
-                                  refresh-confirm-text="Refresh QR code?"
-                                  :template-json="formData.templateJson"
-                                  :print-data="buildPrintData()"
-                                  @refresh-success="handleQrcodeRefreshSuccess" />
-              </el-form-item>
-            </el-col>
 
             <el-col :span="24">
               <el-form-item :label="t('EquipmentManagement.EquipmentLedger.remark')" prop="remark">
@@ -1157,13 +1172,76 @@ onBeforeUnmount(() => {
 }
 
 .device-ledger-detail-main {
-  display: flex;
   min-height: 224px;
-  //padding: 18px 0;
+  padding-top: 12px;
   margin-bottom: 10px;
   gap: 28px;
   box-sizing: border-box;
+}
+
+.device-ledger-detail-main :deep(.el-form) {
+  width: 100%;
+}
+
+.device-basic-layout {
+  align-items: flex-start;
+}
+
+.device-basic-fields {
+  min-width: 0;
+}
+
+.device-code-row {
+  width: 100%;
+}
+
+.device-code-switch {
+  display: flex;
   align-items: center;
+  height: 32px;
+}
+
+.device-basic-media {
+  display: flex;
+  justify-content: flex-end;
+}
+
+.device-media-panel {
+  width: 100%;
+  max-width: 260px;
+  padding: 12px 12px 4px;
+  box-sizing: border-box;
+  border: 1px solid var(--el-border-color-lighter);
+  border-radius: 6px;
+  background: var(--el-fill-color-extra-light);
+}
+
+.device-media-item {
+  margin-bottom: 16px;
+}
+
+.device-media-item :deep(.el-form-item__label) {
+  justify-content: flex-start;
+}
+
+.device-media-item :deep(.el-form-item__content) {
+  justify-content: center;
+}
+
+.device-media-upload {
+  width: 100%;
+  min-height: 120px;
+}
+
+.device-media-code {
+  width: 148px;
+  height: 148px;
+}
+
+.device-media-code :deep(.qrcode-action-card__img),
+.device-media-code :deep(.qrcode-action-card__error) {
+  width: 148px;
+  height: 148px;
 }
 
 .device-ledger-detail-tabs {
@@ -1198,11 +1276,34 @@ onBeforeUnmount(() => {
   background: var(--el-bg-color);
   box-shadow: 0 -4px 12px rgb(0 0 0 / 6%);
 }
-</style>
 
+@media (max-width: 1199px) {
+  .device-basic-media {
+    justify-content: flex-start;
+  }
 
+  .device-media-panel {
+    max-width: none;
+  }
+}
 
+@media (max-width: 767px) {
+  .device-basic-fields :deep(.el-col) {
+    max-width: 100%;
+    flex: 0 0 100%;
+  }
 
+  .device-code-row :deep(.el-col:first-child) {
+    max-width: 75%;
+    flex: 0 0 75%;
+  }
+
+  .device-code-row :deep(.el-col:last-child) {
+    max-width: 25%;
+    flex: 0 0 25%;
+  }
+}
+</style>