优化

src/views/farm/cropRecord/index.vue

@@ -3,9 +3,6 @@
 
     <!-- 搜索工作栏 -->
     <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
-      <!-- <el-form-item label="作物名" prop="cropId">
-        <el-input v-model="queryParams.cropId" placeholder="请输入物料id" clearable @keyup.enter.native="handleQuery"/>
-      </el-form-item> -->
       <el-form-item label="作物名" prop="cropId">
         <el-select v-model="queryParams.cropId" placeholder="请选择" clearable size="small">
           <el-option v-for="item in cropList" :label="item.name" :value="item.id" :key="item.id" />
@@ -58,8 +55,8 @@
       </el-table-column>
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
-          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
-                     v-hasPermi="['farm:crop-record:update']">修改</el-button>
+          <!-- <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
+                     v-hasPermi="['farm:crop-record:update']">修改</el-button> -->
           <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
                      v-hasPermi="['farm:crop-record:delete']">删除</el-button>
         </template>
@@ -73,22 +70,28 @@
     <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
       <el-form ref="form" :model="form" :rules="rules" label-width="80px">
         <el-form-item label="作物选择">
-          <el-select  v-model="form.cropId" placeholder="请选择">
+          <el-select  v-model="form.cropId" placeholder="请选择" @change="selectCrop">
             <el-option v-for="item in cropList" :key="item.id" :label="item.name" :value="item.id"> {{item.name}}
             </el-option>
           </el-select>
         </el-form-item>
         <el-form-item label="操作类型" prop="type">
           <el-radio-group v-model="form.type">
-            <el-radio :label="false">出库</el-radio>
-            <el-radio :label="true">入库</el-radio>
+            <el-radio :label="false" @change="changeType(false)">出库</el-radio>
+            <el-radio :label="true" @change="changeType(true)">入库</el-radio>
         </el-radio-group>
         </el-form-item>
-        <el-form-item label="操作数量" prop="stock">
-          <el-input v-model="form.stock" placeholder="请输入操作数量" />
+
+        <el-form-item label="当前数量" prop="currentStock">
+          <span> {{currentStock}}  </span>
         </el-form-item>
-        <el-form-item label="剩余数量" prop="afterStock">
-          <el-input v-model="form.afterStock" placeholder="请输入剩余数量" />
+        
+        
+        <el-form-item label="操作数量" prop="stock">
+          <el-input v-model="form.stock" type="number" placeholder="请输入操作数量" @blur="stockChange(form.stock)"/>
+        </el-form-item>
+        <el-form-item label="剩余数量"  prop="afterStock">
+          <el-input v-model="form.afterStock" type="number" :disabled="true" placeholder="请输入剩余数量" />
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
@@ -102,8 +105,8 @@
 <script>
 import { createCropRecord, updateCropRecord, deleteCropRecord, getCropRecord, getCropRecordPage, exportCropRecordExcel } from "@/api/farm/cropRecord";
 import Editor from '@/components/Editor';
-import { getCropPage } from "@/api/farm/crop";
-import elementIcons from '../../bxg/components/icons/element-icons';
+import { getCropPage, getCrop } from "@/api/farm/crop";
+
 
 export default {
   name: "CropRecord",
@@ -143,8 +146,8 @@ export default {
         stock: [{ required: true, message: "操作数量不能为空", trigger: "blur" }],
         afterStock: [{ required: true, message: "剩余数量不能为空", trigger: "blur" }],
       },
-      cropList:[]   //作物List
-      
+      cropList:[],   //作物List
+      currentStock: null
     };
   },
   created() {
@@ -193,6 +196,8 @@ export default {
         stock: undefined,
         afterStock: undefined,
       };
+      this.currentStock = undefined;
+      this.getCrop();
       this.resetForm("form");
     },
     /** 搜索按钮操作 */
@@ -220,6 +225,7 @@ export default {
         this.form = response.data;
         this.open = true;
         this.title = "修改";
+        this.selectCrop(response.data.cropId);
       });
     },
     /** 提交按钮 */
@@ -270,7 +276,25 @@ export default {
           this.$download.excel(response, '${table.classComment}.xls');
           this.exportLoading = false;
         }).catch(() => {});
+    },
+    selectCrop(rows){
+      this.cropList.forEach(crop =>{
+        if(crop.id == rows){
+          this.currentStock = crop.stock;
+        }
+      })
+    },
+    stockChange(number){
+      if(this.form.type){
+        this.form.afterStock = parseInt(this.currentStock) + parseInt(number);
+      }else{
+        this.form.afterStock = parseInt(this.currentStock) - parseInt(number);
+      }
+    },
+    changeType(boolType){
+      this.stockChange(this.form.stock);
     }
-  }
+  },
+ 
 };
 </script>