组件化

src/views/Warehousing/components/upLoad.vue

@@ -0,0 +1,201 @@
+<template>
+  <div>
+    <div
+      class="dialogTableTitle flex a-center jlr"
+      style="
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin: 10px 0;
+      "
+    >
+      <div>
+        <el-button
+          size="small"
+          type="primary"
+          :disabled="browseStatus"
+          @click.prevent="addRelevt()"
+          >新行
+        </el-button>
+      </div>
+    </div>
+    <el-table
+      :data="relevantAttachments"
+      ref="table"
+      tooltip-effect="dark"
+      border
+      stripe
+      style="width: 100%"
+      height="150"
+    >
+      <el-table-column label="序号" type="index" width="80"> </el-table-column>
+      <el-table-column
+        prop="fName"
+        header-align="center"
+        align="center"
+        width="250px"
+        label="附件名称"
+      >
+        <template slot-scope="scope">
+          <el-input
+            v-model="scope.row.fName"
+            :disabled="browseStatus"
+            placeholder="附件名称"
+            show-word-limit
+          />
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="createBy"
+        header-align="center"
+        align="center"
+        width="250px"
+        label="上传人"
+      >
+        <template slot-scope="scope">
+          <el-input
+            v-model="scope.row.createBy"
+            disabled
+            placeholder="上传人"
+            show-word-limit
+          />
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="createTime"
+        header-align="center"
+        align="center"
+        label="上传时间"
+      >
+        <template slot-scope="scope">
+          <el-date-picker
+            v-model="scope.row.createTime"
+            type="date"
+            disabled
+            placeholder="上传时间"
+            format="yyyy-MM-dd HH:mm"
+            value-format="timestamp"
+          ></el-date-picker>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="fUrl"
+        header-align="center"
+        align="center"
+        width="300px"
+        label="上传附件"
+      >
+        <template slot-scope="scope">
+          <div style="display: flex; justify-content: center">
+            <el-upload
+              class="upload-demo"
+              :action="uploadImgUrl"
+              :on-success="
+                (res, file) => {
+                  handleSucces(scope, res, file);
+                }
+              "
+              :headers="headers"
+              :disabled="browseStatus"
+              :show-file-list="false"
+              :limit="1"
+            >
+              <el-button size="small" type="text" :disabled="browseStatus"
+                >点击上传</el-button
+              >
+            </el-upload>
+            <el-button size="small" type="text" @click="checkFile(scope)"
+              >查看</el-button
+            >
+          </div>
+        </template>
+      </el-table-column>
+      <el-table-column
+        header-align="center"
+        align="center"
+        label="操作"
+        width="130PX"
+      >
+        <template slot-scope="scope">
+          <el-button
+            @click.native.prevent="deleteRow(scope.$index, relevantAttachments)"
+            :disabled="browseStatus"
+            size="small"
+            type="text"
+            >删除
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
+
+<script>
+import { getToken } from "@/utils/auth";
+
+export default {
+  props: {
+    relevantAttachments: {
+      type: Array,
+      default: [],
+    },
+    createBy: {
+      type: String,
+      default: null,
+    },
+  },
+  data() {
+    return {
+      headers: {
+        Authorization: "Bearer " + getToken(),
+      },
+      uploadImgUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传的图片服务器地址
+      browseStatus: false,
+    };
+  },
+  methods: {
+    // 新增附件上传
+    addRelevt() {
+      this.relevantAttachments.push({
+        fUrl: null,
+        fName: null,
+        createBy: this.createBy,
+        createTime: Date.parse(new Date()),
+      });
+    },
+    deleteRow(index, rows) {
+      rows.splice(index, 1);
+    },
+    //附件上传
+    handleSucces(scope, res, file) {
+      this.relevantAttachments[scope.$index].fName = res.fileName;
+      this.relevantAttachments[scope.$index].fUrl = res.url;
+      if (!this.relevantAttachments[scope.$index].fUrl) {
+        this.$message.error("上传失败");
+      } else {
+        this.$message.success("上传成功");
+      }
+    },
+    //附件查看
+    checkFile(scope) {
+      if (this.relevantAttachments[scope.$index].fUrl) {
+        window.open(this.relevantAttachments[scope.$index].fUrl);
+      } else {
+        this.$message.error("请上传附件");
+      }
+    },
+  },
+  watch: {
+    relevantAttachments(val) {
+      console.log(val);
+      this.relevantAttachments = val;
+    },
+    createBy(val){
+        this.createBy=val
+    }
+  },
+};
+</script>
+
+<style scoped lang="scss">
+</style>

src/views/Warehousing/inStock/AddOrUpdate.vue

@@ -203,6 +203,45 @@
       </el-row>
       <el-row>
         <el-col :span="8">
+          <el-form-item label="到港日期" prop="fEta">
+            <el-date-picker
+              v-model="form.fEta"
+              style="width: 80%"
+              type="date"
+              :disabled="browseStatus"
+              value-format="timestamp"
+              placeholder="到港日期"
+            >
+            </el-date-picker>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="箱使日期" prop="freeContainerDate">
+            <el-date-picker
+              v-model="form.freeContainerDate"
+              style="width: 80%"
+              type="date"
+              :disabled="browseStatus"
+              value-format="timestamp"
+              placeholder="请选择箱使日期"
+            >
+            </el-date-picker>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="8">
+          <el-form-item label="报关单号" prop="fCustomno">
+            <el-input
+              v-model="form.fCustomno"
+              style="width: 80%"
+              :disabled="browseStatus"
+              laceholder="报关单号"
+            />
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="8">
           <el-form-item label="计划件数" prop="fPlanqty">
             <el-input
               v-model.number="form.fPlanqty"
@@ -583,30 +622,6 @@
         </el-row>
         <el-row>
           <el-col :span="8">
-            <el-form-item label="到港日期" prop="fEta">
-              <el-date-picker
-                v-model="form.fEta"
-                style="width: 80%"
-                type="date"
-                :disabled="browseStatus"
-                value-format="timestamp"
-                placeholder="到港日期"
-              >
-              </el-date-picker>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="报关单号" prop="fCustomno">
-              <el-input
-                v-model="form.fCustomno"
-                style="width: 80%"
-                :disabled="browseStatus"
-                laceholder="报关单号"
-              />
-            </el-form-item>
-          </el-col>
-
-          <el-col :span="8">
             <el-form-item label="经营单位" prop="fSbu">
               <el-select
                 v-model="form.fSbu"
@@ -623,8 +638,6 @@
               </el-select>
             </el-form-item>
           </el-col>
-        </el-row>
-        <el-row>
           <el-col :span="8">
             <el-form-item label="单据编号" prop="fBillno">
               <el-input
@@ -653,6 +666,8 @@
               </el-select>
             </el-form-item>
           </el-col>
+        </el-row>
+        <el-row>
           <el-col :span="8">
             <el-form-item label="制单人" prop="createBy">
               <el-input
@@ -663,8 +678,6 @@
               />
             </el-form-item>
           </el-col>
-        </el-row>
-        <el-row>
           <el-col :span="8">
             <el-form-item label="制单部门" prop="fDeptid">
               <el-select
@@ -683,7 +696,6 @@
               </el-select>
             </el-form-item>
           </el-col>
-
           <el-col :span="8">
             <el-form-item disabled label="制单日期" prop="createTime">
               <el-date-picker
@@ -698,6 +710,8 @@
               </el-date-picker>
             </el-form-item>
           </el-col>
+        </el-row>
+        <el-row>
           <el-col :span="8">
             <el-form-item label="过磅" prop="fIfweigh">
               <el-select
@@ -716,8 +730,6 @@
               </el-select>
             </el-form-item>
           </el-col>
-        </el-row>
-        <el-row>
           <el-col :span="8">
             <el-form-item label="品名" prop="fProductName">
               <el-input
@@ -738,6 +750,8 @@
               />
             </el-form-item>
           </el-col>
+        </el-row>
+        <el-row>
           <el-col :span="8">
             <el-form-item label="存货编号" prop="fBscorpno">
               <el-input
@@ -748,8 +762,6 @@
               />
             </el-form-item>
           </el-col>
-        </el-row>
-        <el-row>
           <el-col :span="8">
             <el-form-item label="质押" prop="fIfpledge">
               <el-select
@@ -1063,143 +1075,10 @@
             >附件明细</span
           >
         </template>
-        <div
-          class="dialogTableTitle flex a-center jlr"
-          style="
-            display: flex;
-            justify-content: space-between;
-            align-items: center;
-            margin: 10px 0;
-          "
-        >
-          <div>
-            <el-button
-              size="small"
-              type="primary"
-              :disabled="browseStatus"
-              @click.prevent="addRelevt()"
-              >新行
-            </el-button>
-          </div>
-        </div>
-        <el-table
-          :data="relevantAttachments"
-          ref="table"
-          tooltip-effect="dark"
-          border
-          stripe
-          style="width: 100%"
-          height="150"
-        >
-          <el-table-column label="序号" type="index" width="80">
-          </el-table-column>
-          <el-table-column
-            prop="fName"
-            header-align="center"
-            align="center"
-            width="250px"
-            label="附件名称"
-          >
-            <template slot-scope="scope">
-              <el-input
-                v-model="scope.row.fName"
-                :disabled="browseStatus"
-                placeholder="附件名称"
-                show-word-limit
-              />
-            </template>
-          </el-table-column>
-          <el-table-column
-            prop="createBy"
-            header-align="center"
-            align="center"
-            width="250px"
-            label="上传人"
-          >
-            <template slot-scope="scope">
-              <el-input
-                v-model="scope.row.createBy"
-                disabled
-                placeholder="上传人"
-                show-word-limit
-              />
-            </template>
-          </el-table-column>
-          <el-table-column
-            prop="createTime"
-            header-align="center"
-            align="center"
-            label="上传时间"
-          >
-            <template slot-scope="scope">
-              <el-date-picker
-                v-model="scope.row.createTime"
-                type="date"
-                disabled
-                placeholder="上传时间"
-                format="yyyy-MM-dd HH:mm"
-                value-format="timestamp"
-              ></el-date-picker>
-            </template>
-          </el-table-column>
-          <el-table-column
-            prop="fUrl"
-            header-align="center"
-            align="center"
-            width="300px"
-            label="上传附件"
-          >
-            <template slot-scope="scope">
-              <div style="display: flex; justify-content: center">
-                <el-upload
-                  class="upload-demo"
-                  :action="uploadImgUrl"
-                  :on-success="
-                    (res, file) => {
-                      handleSucces(scope, res, file);
-                    }
-                  "
-                  :headers="headers"
-                  :disabled="browseStatus"
-                  :show-file-list="false"
-                  :limit="1"
-                >
-                  <el-button size="small" type="text" :disabled="browseStatus"
-                    >点击上传</el-button
-                  >
-                </el-upload>
-                <el-button size="small" type="text" @click="checkFile(scope)"
-                  >查看</el-button
-                >
-                <el-button
-                  size="small"
-                  type="text"
-                  :disabled="browseStatus"
-                  @click="deleteFile(scope)"
-                  >删除</el-button
-                >
-              </div>
-            </template>
-          </el-table-column>
-          <el-table-column
-            header-align="center"
-            align="center"
-            label="操作"
-            width="130PX"
-          >
-            <template slot-scope="scope">
-              <el-button
-                @click.native.prevent="
-                  deleteRow(scope.$index, relevantAttachments)
-                "
-                :disabled="browseStatus"
-                size="small"
-                type="text"
-                >删除
-              </el-button>
-            </template>
-          </el-table-column>
-        </el-table>
+        <up-load
+          :relevantAttachments="relevantAttachments"
+          :createBy="form.createBy"
+        ></up-load>
       </el-collapse-item>
 
       <el-collapse-item>
@@ -3115,18 +2994,14 @@
           </table>
         </div>
         <div
-            style="
-              display: flex;
-              justify-content: space-between;
-              font-size: 12px;
-            "
-          >
-            <div>操作：{{ form.createBy }}</div>
-            <div>司机：</div>
-            <div>理货：</div>
-            <div>掏箱叉车：</div>
-            <div style="width: 150px">码垛叉车：</div>
-          </div>
+          style="display: flex; justify-content: space-between; font-size: 12px"
+        >
+          <div>操作：{{ form.createBy }}</div>
+          <div>司机：</div>
+          <div>理货：</div>
+          <div>掏箱叉车：</div>
+          <div style="width: 150px">码垛叉车：</div>
+        </div>
       </div>
       <span slot="footer" class="dialog-footer">
         <el-button
@@ -3361,6 +3236,7 @@ import Cookies from "js-cookie";
 import { getToken } from "@/utils/auth";
 import { addSet, select, resetModule } from "@/api/system/set";
 import draggable from "vuedraggable";
+import upLoad from "../components/upLoad";
 export default {
   name: "inStock",
   props: {
@@ -3379,6 +3255,7 @@ export default {
     AddOrUpdate,
     ApprovalComments,
     draggable,
+    upLoad,
   },
   data() {
     return {
@@ -3453,10 +3330,6 @@ export default {
       fStorageTypeOptions: [],
       weightList: false,
       importList: {},
-      headers: {
-        Authorization: "Bearer " + getToken(),
-      },
-      uploadImgUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传的图片服务器地址
       sumMum: 0,
       allfPlanqty: 0,
       detailList: [],
@@ -4347,6 +4220,7 @@ export default {
         this.$set(this.form, "fBstime", Date.parse(this.form.fBstime));
         this.$set(this.form, "createTime", Date.parse(this.form.createTime));
         this.$set(this.form, "fChargedate", Date.parse(this.form.fChargedate));
+        this.$set(this.form, "freeContainerDate", Date.parse(this.form.freeContainerDate));
         this.$set(this.form, "fFeetUnit", this.form.fFeetunit);
         this.tfQtynum = (this.form.fPlanqty / 1000).toFixed(2);
         this.tfNetweightnum = (this.form.fPlannetweight / 1000).toFixed(2);
@@ -4661,6 +4535,7 @@ export default {
                 this.$set(this.form, "fEta", Date.parse(this.form.fEta));
                 this.$set(this.form, "fBsdate", Date.parse(this.form.fBsdate));
                 this.$set(this.form, "fBstime", Date.parse(this.form.fBstime));
+                this.$set(this.form, "freeContainerDate", Date.parse(this.form.freeContainerDate));
                 this.$set(this.form, "fFeetUnit", this.form.fFeetunit);
                 this.$set(
                   this.form,
@@ -5156,15 +5031,6 @@ export default {
         this.form.fGrossweight = 0;
       }
     },
-    // 新增附件上传
-    addRelevt() {
-      this.relevantAttachments.push({
-        fUrl: null,
-        fName: null,
-        createBy: this.form.createBy,
-        createTime: Date.parse(new Date()),
-      });
-    },
     // 收款信息新行
     addCollection() {
       this.$refs["form"].validate((valid) => {
@@ -5315,16 +5181,6 @@ export default {
         }
       }
     },
-    //附件上传
-    handleSucces(scope, res, file) {
-      this.relevantAttachments[scope.$index].fName = res.fileName;
-      this.relevantAttachments[scope.$index].fUrl = res.url;
-      if (this.relevantAttachments[scope.$index].fUrl === "") {
-        this.$message.error("上传失败");
-      } else {
-        this.$message.success("上传成功");
-      }
-    },
     //获取登陆人
     queryUser() {
       queryUserVal().then((response) => {

src/views/Warehousing/inStock/index.vue

@@ -43,7 +43,8 @@
               <el-date-picker
                 v-model="queryParams.timeInterval"
                 type="daterange"
-                value-format="yyyy-MM-dd"
+                value-format="yyyy-MM-dd HH:mm:ss"
+                :default-time="['00:00:00', '23:59:59']"
                 clearable
                 style="width: 230px"
                 range-separator="至"
@@ -206,6 +207,25 @@
                 </el-form-item>
               </el-col>
             </el-row>
+            <el-row>
+              <el-col :span="6">
+                <el-form-item label="箱使日期" prop="freeContainerList">
+                  <el-date-picker
+                    v-model="queryParams.freeContainerList"
+                    type="daterange"
+                    value-format="yyyy-MM-dd HH:mm:ss"
+                    :default-time="['00:00:00', '23:59:59']"
+                    clearable
+                    style="width: 230px"
+                    range-separator="至"
+                    start-placeholder="开始日期"
+                    end-placeholder="结束日期"
+                    @keyup.enter.native="handleQuery"
+                  >
+                  </el-date-picker>
+                </el-form-item>
+              </el-col>
+            </el-row>
           </div>
         </el-collapse-transition>
       </el-form>
@@ -673,6 +693,13 @@ export default {
           checked: 0,
           width: 100,
         },
+        {
+          surface: "20",
+          label: "freeContainerDate",
+          name: "箱使日期",
+          checked: 0,
+          width: 100,
+        },
       ],
       setRowList: [],
       getRowList: [],
@@ -795,6 +822,9 @@ export default {
     getList() {
       //获取仓库
       listWarehousebills(this.queryParams).then((response) => {
+        response.rows.map(e=>{
+          e.freeContainerDate=e.freeContainerDate?e.freeContainerDate.substring(0,10):null
+        })
         this.warehousebillsList = response.rows;
         this.total = response.total;
         this.loading = false;