离线件入库

src/views/Inventory/OfflinePartsStorage/index.vue

@@ -1,106 +1,75 @@
 <template>
   <div>
-    <div class="main">
-      <div style="padding: 0 10px">
-        <div style="width:330px;margin: 10px auto">
-          <el-radio v-model="searchType" label="1" border @change="radioChange">扫码合同二维码</el-radio>
-          <el-radio v-model="searchType" label="2" border @change="radioChange">选择供应商合同</el-radio>
-        </div>
-        <el-form label-width="80px" onsubmit="return false" style="font-size: 22px;">
-          <el-form-item v-if="searchType==='1'" label="二维码">
-            <el-input id="code3" v-model="qrCode" placeholder="若不扫码，可在此输入合同流水号" @keyup.native.enter="codeChange1()" @focus="onfocus1()"/>
-          </el-form-item>
-          <el-form-item v-if="searchType==='2'" label="供应商" style="margin-top: 10px">
-            <el-select v-model="supplierValue" placeholder="请选择供应商" filterable style="width: 100%" @change="supplierChange">
-              <el-option
-                v-for="item in supplier"
-                :key="item.value"
-                :label="item.label"
-                :value="item.value"/>
-            </el-select>
-          </el-form-item>
-          <el-form-item v-if="searchType==='2'" label="合同编号" style="margin-top: 10px">
-            <el-select v-model="contractValue" placeholder="请选择合同" filterable style="width: 100%">
-              <el-option
-                v-for="item in contract"
-                :key="item.value"
-                :label="item.label"
-                :value="item.value"/>
-            </el-select>
-          </el-form-item>
-          <el-button type="primary" style="margin-bottom: 10px;width: 100%" @click="searchContractDetail">查询明细</el-button>
-          <hr>
-          <el-form-item v-if="searchType==='1'" label="供应商" style="margin-top: 10px">
-            <el-input v-model="supplierName" readonly placeholder="请扫码查询"/>
-          </el-form-item>
-          <el-form-item v-if="searchType==='1'" label="合同编号" style="margin-top: 10px">
-            <el-input v-model="contractNumber" readonly placeholder="请扫码查询"/>
-          </el-form-item>
-        </el-form>
-      </div>
-      <el-table ref="multipleTable" :data="table1" border size="mini" highlight-current-row style="width: 100%;" height="350px" @selection-change="handleSelectionChange">
-        <el-table-column :selectable="selectable" type="selection" align="center" width="35px"/>
-        <el-table-column label="名称" min-width="50px" align="center" show-overflow-tooltip prop="物料名称">
+    <el-card>
+      <span>供应商：</span>
+      <el-select v-model="supplierValue" placeholder="请选择供应商" filterable size="small" style="width: 200px" @change="supplierChange">
+        <el-option
+          v-for="item in supplier"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value"/>
+      </el-select>
+      <span>合同：</span>
+      <el-select v-model="contractValue" placeholder="请选择合同" filterable size="small" style="width: 200px">
+        <el-option
+          v-for="item in contract"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value"/>
+      </el-select>
+      <el-button type="success" size="small" style="margin-left: 10px" @click="searchContractDetail">查询明细</el-button>
+    </el-card>
+    <el-card>
+      <el-table ref="multipleTable" :data="table1" border size="mini" highlight-current-row style="width: 100%;margin-bottom: 5px" height="350px" @selection-change="handleSelectionChange">
+        <el-table-column :selectable="selectable" type="selection" align="center" width="50px"/>
+        <el-table-column label="名称" width="200px" align="center" show-overflow-tooltip prop="物料名称">
           <template slot-scope="scope">
             <el-tooltip :content="scope.row.物料名称" effect="dark">
               <span>{{ scope.row.物料名称 }}</span>
             </el-tooltip>
           </template>
         </el-table-column>
-        <el-table-column label="规格型号" min-width="50px" align="center" show-overflow-tooltip>
+        <el-table-column label="规格型号" min-width="300px" align="center" show-overflow-tooltip>
           <template slot-scope="scope">
             <el-tooltip :content="scope.row.物料规格 + ' ' + scope.row.物料型号" effect="dark">
               <span>{{ scope.row.物料规格 + ' ' + scope.row.物料型号 }}</span>
             </el-tooltip>
           </template>
         </el-table-column>
-        <el-table-column label="采购数量" align="center" width="50" show-overflow-tooltip prop="数量">
+        <el-table-column label="采购数量" align="center" width="180" show-overflow-tooltip prop="数量">
           <template slot-scope="scope">
             {{ scope.row.数量 }}
           </template>
         </el-table-column>
-        <el-table-column label="已到数量" align="center" width="50" show-overflow-tooltip prop="到货数量">
+        <el-table-column label="已到数量" align="center" width="180" show-overflow-tooltip prop="到货数量">
           <template slot-scope="scope">
             {{ scope.row.到货数量 }}
           </template>
         </el-table-column>
-        <el-table-column label="到货数量" align="center" min-width="120" show-overflow-tooltip>
+        <el-table-column label="到货数量" align="center" width="200" show-overflow-tooltip>
           <template slot-scope="scope">
             <el-input-number v-model="scope.row.本次到货数量" :min="0" :precision="2" size="mini" style="margin: 0;width: 100%"/>
           </template>
         </el-table-column>
       </el-table>
-      <hr style="margin: 10px 0">
-      <div style="width:310px;margin: 10px auto">
-        <el-radio v-model="locateType" label="1" border @change="radioChange2">扫码货位二维码</el-radio>
-        <el-radio v-model="locateType" label="2" border @change="radioChange2">选择仓库货位</el-radio>
-      </div>
-      <el-form label-width="80px" onsubmit="return false" style="margin-right:10px;margin-left: 10px">
-        <el-form-item v-show="locateType==='1'" label="货位码">
-          <el-input id="locate" v-model="locateNumber" placeholder="若不扫码，可在此输入货位流水号" @keyup.native.enter="codeChange2()" @focus="onfocus2()"/>
-        </el-form-item>
-        <el-form-item v-show="locateType==='2'" label="仓库名称">
-          <el-select v-model="inventoryNumber" style="width: 100%" placeholder="仓库名称" @change="getLocate">
-            <el-option
-              v-for="item in inventoryName"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value"/>
-          </el-select>
-        </el-form-item>
-        <el-form-item v-show="locateType==='2'" label="货位名称">
-          <el-select v-model="locateNumber" style="width: 100%" placeholder="货位名称">
-            <el-option
-              v-for="item in locateName"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value"/>
-          </el-select>
-        </el-form-item>
-      </el-form>
-      <el-button type="primary" style="margin-bottom: 70px;width: 100%" @click="submitInStorage">确认入库</el-button>
-    </div>
-    <i-tabs/>
+      <span>仓库名称：</span>
+      <el-select v-model="inventoryNumber" style="width: 200px" filterable size="small" placeholder="仓库名称" @change="getLocate">
+        <el-option
+          v-for="item in inventoryName"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value"/>
+      </el-select>
+      <span>货位名称：</span>
+      <el-select v-model="locateNumber" style="width: 200px" filterable size="small" placeholder="货位名称">
+        <el-option
+          v-for="item in locateName"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value"/>
+      </el-select>
+      <el-button type="primary" style="margin-left: 5px" size="small" @click="submitInStorage">确认入库</el-button>
+    </el-card>
   </div>
 </template>