仓库管理列表页

yangfeng

2023-09-15 12e5839f8b2b958cbd3e0047ee5f9873ff65495d

 src/views/productManage/product/AddProductDialog.vue

@@ -32,75 +32,23 @@
        style="height: 60vh; overflow-x: hidden"
      >
        <div class="content-btn">
          <el-button plain size="mini">标签打印</el-button>
          <el-button plain size="mini">更新数量</el-button>
          <el-button plain size="mini">执行补货</el-button>
          <el-button plain size="mini" disabled>标签打印</el-button>
          <el-button plain size="mini" disabled>更新数量</el-button>
          <el-button plain size="mini" disabled>执行补货</el-button>
        </div>

        <div class="basic-info">
          <div class="content-number">
            <div class="sub-number">
              <div class="left"><i class="el-icon-s-fold"></i></div>
              <div class="right">
                <div class="right-label">{{ 0 }}</div>
                <div class="right-label">额外的价格</div>
              </div>
            </div>
            <div class="sub-number">
              <div class="left"><i class="el-icon-present"></i></div>
              <div class="right">
                <div class="right-label">{{ "0.00" + "件" }}</div>
                <div class="right-label">在手</div>
              </div>
            </div>
            <div class="sub-number">
              <div class="left"><i class="el-icon-present"></i></div>
              <div class="right">
                <div class="right-label">{{ "0.00" + "件" }}</div>
                <div class="right-label">预测</div>
              </div>
            </div>
            <div class="sub-number">
              <div class="left icon-view"><i class="el-icon-sort"></i></div>
              <div class="right">
                <div class="right-label">{{ "进: " + 0 }}</div>
                <div class="right-label">{{ "出: " + 0 }}</div>
              </div>
            </div>
            <div class="sub-number">
              <div class="left"><i class="el-icon-refresh"></i></div>
              <div class="right">
                <div class="right-label">{{ 0 }}</div>
                <div class="right-label">重订货规则</div>
              </div>
            </div>
            <div class="sub-number">
              <div class="left"><i class="el-icon-help"></i></div>
              <div class="right">
                <div class="right-one">上架规则</div>
              </div>
            </div>
            <div class="sub-number">
              <div class="left"><i class="el-icon-s-data"></i></div>
              <div class="right">
                <div class="right-label">{{ "0.00" + "件" }}</div>
                <div class="right-label">已售</div>
              </div>
            </div>
            <div class="sub-number">
              <div class="left"><i class="el-icon-bank-card"></i></div>
              <div class="right">
                <div class="right-label">{{ "0.00" + "件" }}</div>
                <div class="right-label">已采购</div>
              </div>
            </div>
          </div>
          <FormBtnsView :add-product="addProduct" @inOutBoundClick="inOutBoundClick" :show-procure="showProcure" />
          <div class="basic-info-view">
            <el-row>
              <el-col :span="20">
                <div style="margin-left: 20px">产品名称</div>
                <el-form-item label="" prop="client_name" label-width="20px">
                  <el-input v-model="editConfig.infomation.client_name" placeholder=""></el-input>
                  <el-input
                    v-model="editConfig.infomation.client_name"
                    placeholder=""
                    :disabled="!showFooter"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="4">
@@ -111,8 +59,12 @@
              </el-col>
              <el-col :span="24">
                <div style="margin-left: 20px; margin-top: -30px">
                  <el-checkbox v-model="marketable">可销售</el-checkbox>
                  <el-checkbox v-model="procurable">可采购</el-checkbox>
                  <el-checkbox v-model="marketable" :disabled="!showFooter" @change="checkboxChange('销售', $event)"
                    >可销售</el-checkbox
                  >
                  <el-checkbox v-model="procurable" :disabled="!showFooter" @change="checkboxChange('采购', $event)"
                    >可采购</el-checkbox
                  >
                </div>
              </el-col>
            </el-row>
@@ -320,12 +272,11 @@
              <div class="purchase-view">
                <div class="left">
                  <div class="second-label">作业</div>
                  <el-form-item label="路线" prop="client_name" style="margin-left: 20px">
                    <el-checkbox-group v-model="editConfig.infomation.type">
                      <el-checkbox label="贝思科供应产品来自北京仓" name="type"></el-checkbox>
                      <el-checkbox label="贝思科-warehouse#6:供应产品来自贝思科123" name="type"></el-checkbox>
                      <el-checkbox label="贝思科-warehouse#4:供应产品来自北京仓" name="type"></el-checkbox>
                      <el-checkbox label="贝思科-warehouse#4:供应产品来自贝思科123" name="type"></el-checkbox>
                  <el-form-item label="路线" prop="checkedCities" style="margin-left: 20px">
                    <el-checkbox-group v-model="checkedCities" :min="1" :max="2">
                      <el-checkbox v-for="city in cities" :label="city" :key="city" class="list-item">{{
                        city.length > 20 ? city.substring(0, 20) + "..." : city
                      }}</el-checkbox>
                    </el-checkbox-group>
                  </el-form-item>
                </div>
@@ -352,7 +303,7 @@
                      style="width: 85%"
                      :disabled="!showFooter"
                    ></el-input>
                    <span>kg</span>
                    <span> kg</span>
                  </el-form-item>
                  <el-form-item label="体积" prop="client_name" style="margin-left: 20px">
                    <el-input
@@ -362,7 +313,7 @@
                      style="width: 85%"
                      :disabled="!showFooter"
                    ></el-input>
                    <span>m³</span>
                    <span> m³</span>
                  </el-form-item>
                  <el-form-item label="客户前置时间" prop="client_name" style="margin-left: 20px">
                    <el-input
@@ -372,7 +323,7 @@
                      style="width: 85%"
                      :disabled="!showFooter"
                    ></el-input>
                    <span>天</span>
                    <span> 天</span>
                  </el-form-item>
                  <el-form-item label="HS编码" prop="name" style="margin-left: 20px">
                    <el-input
@@ -461,6 +412,7 @@

<script>
import CommonFormTableView from "@/components/makepager/CommonFormTableView"

let inputElement = null
export default {
  name: "AddProductDialog",
@@ -471,7 +423,7 @@
        return {
          visible: false,
          title: "新建",
          infomation: {}
          infomation: { type: [] }
        }
      }
    }
@@ -507,7 +459,11 @@
      showFooter: false, // 是否显示取消保存
      imageSrc: "", // 图片地址
      marketable: true, // 可销售
      procurable: true // 可采购
      procurable: true, // 可采购
      checkedCities: ["上海", "北京"],
      cities: ["上海对对对对对对多多多多多多多北京对对对对对对", "北京对对对对对对多", "广州", "深圳"],
      addProduct: false,
      showProcure: true
    }
  },
  created() {
@@ -521,32 +477,12 @@
        this.showButton = false
        this.showEdit = false
        this.showFooter = true
        this.addProduct = true
      } else {
        this.showEdit = true
        this.showFooter = false
        this.addProduct = false
      }
      // } else if (this.editConfig.infomation.status === "完成") {
      //   this.showButton = true
      //   this.showEdit = false
      //   this.isDelClick = true
      //   this.showFooter = false
      // } else if (this.editConfig.infomation.status === "已取消") {
      //   this.showButton = true
      //   this.showEdit = false
      //   this.showFooter = false
      // } else {
      //   this.showButton = true
      //   this.showEdit = true
      //   this.showFooter = false
      // }
      // if (this.editConfig.title === "新建") {
      //   this.list[0].status = "active"
      // } else {
      //   this.list.map((item) => {
      //     if (item.label === this.editConfig.infomation.status) {
      //       item.status = "active"
      //     } else {
      //       item.status = "todo"
      //     }
      //   })
      // }
    },
    // 关闭
    handleClose() {
@@ -621,19 +557,21 @@
    },
    // 上传图片
    toGetImg() {
      if (inputElement === null) {
        // 生成文件上传的控件
        inputElement = document.createElement("input")
        inputElement.setAttribute("type", "file")
        inputElement.style.display = "none"
        if (window.addEventListener) {
          inputElement.addEventListener("change", this.uploadFile, false)
        } else {
          inputElement.attachEvent("onchange", this.uploadFile)
      if (this.showFooter) {
        if (inputElement === null) {
          // 生成文件上传的控件
          inputElement = document.createElement("input")
          inputElement.setAttribute("type", "file")
          inputElement.style.display = "none"
          if (window.addEventListener) {
            inputElement.addEventListener("change", this.uploadFile, false)
          } else {
            inputElement.attachEvent("onchange", this.uploadFile)
          }
          document.body.appendChild(inputElement)
        }
        document.body.appendChild(inputElement)
        inputElement.click()
      }
      inputElement.click()
    },
    uploadFile(el) {
      if (el && el.target && el.target.files && el.target.files.length > 0) {
@@ -661,6 +599,16 @@
            //formData.append('file', files); // 可以传到后台的数据
          }
        }
      }
    },
    // 进出点击
    inOutBoundClick() {
      this.$router.push({ path: "/reportForm/inOutboundDetail", query: { name: "产品名称/出入库明细" } })
    },
    // 可销售/可采购
    checkboxChange(val, param) {
      if (val === "采购") {
        this.showProcure = param
      }
    }
  }
@@ -757,6 +705,9 @@
    border-bottom: 1px solid #d9d9d9;
    margin-bottom: 10px;
  }
  .list-item {
    width: 300px;
  }
  .avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;