Prechádzať zdrojové kódy

feat: cargo.子表体积调整为弹窗输入长宽高自动计算.

peter 3 týždňov pred
rodič
commit
19b41972ea

+ 89 - 4
src/pages/cargo-consolidation-request/index.vue

@@ -526,12 +526,15 @@
           width="70"
         >
           <template #default="scope">
-            <el-input
+            <el-button
+              @click="openCubeDialog(scope)"
               :disabled="!['Arrangement', 'my_request'].includes(currentTab)"
-              v-model="scope.row.Cube"
+              type="primary"
               size="small"
-              @change="scope.row.editFlag = true"
-            ></el-input>
+              text
+            >
+              {{ scope.row.Cube || '点击输入' }}
+            </el-button>
           </template>
         </el-table-column>
         <el-table-column
@@ -595,6 +598,45 @@
         ></div>
       </el-drawer>
     </div>
+    <el-dialog
+      style="margin-top: 35vh"
+      title="体积输入(直接输入体积, 或输入长宽高自动计算)"
+      :modelValue="cubeDialogVisible >= 0"
+      @close="closeCubeDialog"
+      width="400px"
+    >
+      <el-form>
+        <el-form-item label="length (m)">
+          <el-input v-model="cubeForm.l"></el-input>
+        </el-form-item>
+        <el-form-item label="width (m)">
+          <el-input v-model="cubeForm.w"></el-input>
+        </el-form-item>
+        <el-form-item label="height (m)">
+          <el-input v-model="cubeForm.h"></el-input>
+        </el-form-item>
+        <el-form-item label="cube (m³)">
+          <el-input v-model="cubeForm2.c"></el-input>
+        </el-form-item>
+        <el-form-item>
+          <div class="w-full flex justify-center">
+            <el-button
+              size="small"
+              type="primary"
+              @click="commitCube"
+            >
+              确定
+            </el-button>
+            <el-button
+              size="small"
+              @click="closeCubeDialog"
+            >
+              取消
+            </el-button>
+          </div>
+        </el-form-item>
+      </el-form>
+    </el-dialog>
   </div>
 </template>
 
@@ -617,6 +659,7 @@ import {
   ElMessageBox,
   ElNotification,
   ElDrawer,
+  ElDialog,
 } from 'element-plus'
 import cloneDeep from 'lodash.clonedeep'
 import dayjs from 'dayjs'
@@ -1404,6 +1447,48 @@ const openMapDrawer = (row: any) => {
 const closeMapDrawer = () => {
   mapDrawerVisible.value = false
 }
+let cubeDialogVisible = ref(-1)
+let cubeForm = ref({
+  l: '',
+  w: '',
+  h: '',
+})
+let cubeForm2 = ref({
+  c: '' as string | number,
+})
+watch(
+  cubeForm,
+  () => {
+    cubeForm2.value.c =
+      Number(cubeForm.value.l) *
+      Number(cubeForm.value.w) *
+      Number(cubeForm.value.h)
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+let openCubeDialog = (obj: any) => {
+  let index = obj.$index
+  if (index < 0 || index >= subList.value.length) return
+  const row = subList.value[index]
+  cubeForm2.value.c = row.Cube || ''
+  cubeDialogVisible.value = index
+}
+let commitCube = () => {
+  const row = subList.value[cubeDialogVisible.value]
+  row.Cube = Number(cubeForm2.value.c).toFixed(2) || ''
+  row.editFlag = true
+  closeCubeDialog()
+}
+let closeCubeDialog = () => {
+  cubeDialogVisible.value = -1
+  cubeForm.value.l = ''
+  cubeForm.value.w = ''
+  cubeForm.value.h = ''
+  cubeForm2.value.c = ''
+}
 </script>
 <style lang="scss">
 .page-cargo-consolidation {