添加进货清单

config/index.js

@@ -3,8 +3,8 @@
 // see http://vuejs-templates.github.io/webpack for documentation.
 
 const path = require('path')
-// const proxyUrl = 'https://dev.colexiu.com'
-const proxyUrl = 'https://test.dayaedu.com'
+const proxyUrl = 'https://dev.dayaedu.com'
+// const proxyUrl = 'https://test.dayaedu.com'
 
 module.exports = {
   dev: {

config/prod.env.js

@@ -3,6 +3,6 @@ module.exports = {
   NODE_ENV: '"production"',
 
 }
-BASE_API: '"https://test.dayaedu.com"'
-// BASE_API: '"http://dev.colexiu.com"'
+// BASE_API: '"https://test.dayaedu.com"'
+BASE_API: '"http://dev.colexiu.com"'
 // let target = "https://test.dayaedu.com";

src/api/product.js

@@ -73,3 +73,21 @@ export function getProduct(id) {
   })
 }
 
+/** 进货清单列表 */
+export function getProductSkuStockRecord(params) {
+  return request({
+    url:'/PmsProductSkuStockRecord/list',
+    method:'post',
+    data:params
+  })
+}
+
+/** 新增商品库存入库记录 */
+export function getProductSkuStockRecordCreate(params) {
+  return request({
+    url:'/PmsProductSkuStockRecord/create',
+    method:'post',
+    data:params
+  })
+}
+

src/main.js

@@ -21,6 +21,42 @@ Vue.use(VCharts)
 
 Vue.config.productionTip = false
 
+
+// 将selects全局混入当前vue实例中
+Vue.mixin({
+  methods: {
+    isNumber(val, max) {
+      // 只能输入正整数，且可以限制最大值，用法：@input="e => (form.cloud_room_up_limit = isNumber(e, 7))"
+      val = val.replace(/\b(0+)+[^0-9]*/gi, "");
+      if (val > max) {
+        val = max;
+      }
+      return val;
+    },
+    keyupEvent(e) {
+      // 正数，小数2位 @keyup.native='keyupEvent($event)'
+      e.target.value = e.target.value.replace(/[^\d.]/g, "");
+      e.target.value = e.target.value.replace(/\.{2,}/g, ".");
+      e.target.value = e.target.value.replace(/^\./g, "0.");
+      e.target.value = e.target.value.replace(
+        /^\d*\.\d*\./g,
+        e.target.value.substring(0, e.target.value.length - 1)
+      );
+      e.target.value = e.target.value.replace(/^0[^\.]+/g, "0");
+      e.target.value = e.target.value.replace(/^(\d+)\.(\d\d).*$/, "$1.$2");
+    },
+    changeHash(value) {
+      const origin = window.location.origin;
+      history.replaceState(
+        "",
+        "",
+        `${origin}/#${this.$route.path}?opt=${value}`
+      );
+    },
+  }
+});
+
+
 new Vue({
   el: '#app',
   router,

src/router/index.js

@@ -134,6 +134,13 @@ export const asyncRouterMap = [
         component: () => import('@/views/pms/brand/update'),
         meta: {title: '编辑品牌'},
         hidden: true
+      },
+      {
+        path: 'purchaseList',
+        name: 'purchaseList',
+        component: () => import('@/views/pms/purchaseList'),
+        meta: {title: '进货清单'},
+        hidden: true
       }
     ]
   },

src/utils/downLoadFile.js

@@ -59,9 +59,9 @@ export const Export = (that, params, message, func) => {
               }, 1000);
               return
             } else if(json.code == 200){
-              that.$message.success(json.msg)
+              that.$message.success(json.msg || json.message)
             } else {
-              that.$message.error(json.msg)
+              that.$message.error(json.msg || json.message)
             }
             if (func) {
               func()

src/utils/index.js

@@ -1,3 +1,5 @@
+import dayjs from 'dayjs'
+
 export function parseTime(time, cFormat) {
   if (arguments.length === 0) {
     return null
@@ -52,3 +54,23 @@ export function formatTime(time, option) {
     return d.getMonth() + 1 + '月' + d.getDate() + '日' + d.getHours() + '时' + d.getMinutes() + '分'
   }
 }
+
+
+export function getTimes (times, keys = [], format = 'YYYY-MM-DD') {
+  if (times && times.length) {
+    return format == 'YYYY-MM-DD'
+      ? {
+          [keys[0] || 'start']: dayjs(times[0]).isValid()
+            ? dayjs(times[0]).format(format) + ' 00:00:00'
+            : '',
+          [keys[1] || 'end']: dayjs(times[1]).isValid()
+            ? dayjs(times[1]).format(format) + ' 23:59:59'
+            : ''
+        }
+      : {
+          [keys[0] || 'start']: dayjs(times[0]).isValid() ? dayjs(times[0]).format(format) : '',
+          [keys[1] || 'end']: dayjs(times[1]).isValid() ? dayjs(times[1]).format(format) : ''
+        }
+  }
+  return {}
+}

src/views/pms/product/index.vue

@@ -102,9 +102,19 @@
     <el-card class="operate-container" shadow="never">
       <i class="el-icon-tickets"></i>
       <span>数据列表</span>
-      <el-button class="btn-add" @click="handleAddProduct()" size="mini">
-        添加
-      </el-button>
+
+      <div class="btn-add">
+        <el-button  @click="handleAddProduct()" size="mini">
+          添加
+        </el-button>
+        <el-button type="primary" @click="handleDownloadStock()" size="mini">
+          导出库存
+        </el-button>
+        <el-button type="primary" @click="handleDownloadProductStock()" size="mini">
+          导出进货清单
+        </el-button>
+      </div>
+
     </el-card>
     <div class="table-container">
       <el-table
@@ -203,7 +213,7 @@
         </el-table-column> -->
         <el-table-column label="操作" width="220" align="center">
           <template slot-scope="scope">
-            <p>
+            <p class="table-btn-group">
               <el-button
                 size="mini"
                 @click="handleShowProduct(scope.$index, scope.row)"
@@ -220,6 +230,11 @@
                 @click="handleDelete(scope.$index, scope.row)"
                 >删除
               </el-button>
+
+              <el-button
+                size="mini"
+                @click="handleShowPurchase(scope.row)">进货清单
+              </el-button>
             </p>
             <p>
               <!-- <el-button
@@ -267,7 +282,7 @@
     <el-dialog
       title="编辑货品信息"
       :visible.sync="editSkuInfo.dialogVisible"
-      width="40%"
+      width="60%"
     >
       <span>商品货号：</span>
       <span>{{ editSkuInfo.productSn }}</span>
@@ -290,7 +305,8 @@
       >
         <el-table-column label="SKU编号" align="center">
           <template slot-scope="scope">
-            <el-input v-model="scope.row.skuCode"></el-input>
+            <!-- <el-input v-model="scope.row.skuCode"></el-input> -->
+            {{ scope.row.skuCode  }}
           </template>
         </el-table-column>
         <el-table-column
@@ -303,14 +319,19 @@
             {{ getProductSkuSp(scope.row, index) }}
           </template>
         </el-table-column>
-        <el-table-column label="销售价格" width="80" align="center">
+        <el-table-column label="销售价格" align="center">
           <template slot-scope="scope">
             <el-input v-model="scope.row.price"></el-input>
           </template>
         </el-table-column>
-        <el-table-column label="商品库存" width="80" align="center">
+        <el-table-column label="内部库存" align="center">
+          <template slot-scope="scope">
+            {{ scope.row.internalStock  }}
+          </template>
+        </el-table-column>
+        <el-table-column label="税务库存" align="center">
           <template slot-scope="scope">
-            <el-input v-model="scope.row.stock"></el-input>
+            {{scope.row.taxStock}}
           </template>
         </el-table-column>
         <el-table-column label="库存预警值" width="100" align="center">
@@ -343,7 +364,7 @@ import {
 import { fetchList as fetchProductAttrList } from "@/api/productAttr";
 import { fetchList as fetchBrandList } from "@/api/brand";
 import { fetchListWithChildren } from "@/api/productCate";
-
+import { Export } from "@/utils/downLoadFile";
 const defaultListQuery = {
   keyword: null,
   pageNum: 1,
@@ -584,6 +605,30 @@ export default {
     handleAddProduct() {
       this.$router.push({ path: "/pms/addProduct" });
     },
+    handleDownloadStock() {
+      Export(
+        this,
+        {
+          url: "/api-mall-admin/export/productExport",
+          fileName: "库存列表.xls",
+          method: "get",
+          params: { ...this.listQuery },
+        },
+        "您确定导出库存?"
+      );
+    },
+    handleDownloadProductStock() {
+      Export(
+        this,
+        {
+          url: "/api-mall-admin/export/productStockRecordExport",
+          fileName: "进货清单.xls",
+          method: "get",
+          params: { ...this.listQuery },
+        },
+        "您确定导出进货清单?"
+      );
+    },
     handleBatchOperate() {
       if (this.operateType == null) {
         this.$message({
@@ -698,6 +743,9 @@ export default {
     handleShowVerifyDetail(index, row) {
       console.log("handleShowVerifyDetail", row);
     },
+    handleShowPurchase(row) {
+      this.$router.push({ path: "/pms/purchaseList", query: { id: row.id, name: row.name } });
+    },
     handleShowLog(index, row) {
       console.log("handleShowLog", row);
     },
@@ -763,5 +811,12 @@ export default {
 ::v-deep.el-select--small {
   width: 203px !important;
 }
+
+.table-btn-group {
+  .el-button {
+    margin: 5px 3px;
+  }
+
+}
 </style>
 

src/views/pms/purchaseList/index.vue

@@ -0,0 +1,349 @@
+<template>
+
+  <div class="app-container">
+    <el-card class="filter-container" shadow="never">
+      <div>
+        <i class="el-icon-search"></i>
+        <span>筛选搜索</span>
+        <el-button
+          style="float: right"
+          @click="handleSearchList()"
+          type="primary"
+          size="small"
+        >
+          查询结果
+        </el-button>
+        <el-button
+          style="float: right; margin-right: 15px"
+          @click="handleResetSearch()"
+          size="small"
+        >
+          重置
+        </el-button>
+      </div>
+      <div style="margin-top: 15px">
+        <el-form
+          :inline="true"
+          :model="listQuery"
+          size="small"
+          label-width="120px"
+        >
+          <el-form-item label="批次号：">
+            <el-input
+              style="width: 203px"
+              v-model="listQuery.id"
+              placeholder="请输入批次号"
+            ></el-input>
+          </el-form-item>
+          <el-form-item label="备查货号：">
+            <el-input
+              style="width: 203px"
+              v-model="listQuery.selectProductSn"
+              placeholder="请输入备查货号"
+            ></el-input>
+          </el-form-item>
+          <el-form-item label="入库时间：">
+             <el-date-picker
+              v-model="listQuery.timer"
+              type="daterange"
+              align="right"
+              unlink-panels
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              format="yyyy-MM-dd"
+              value-format="yyyy-MM-dd"
+              :clearable="false"
+            >
+            </el-date-picker>
+          </el-form-item>
+        </el-form>
+      </div>
+    </el-card>
+    <el-card class="operate-container" shadow="never">
+      <i class="el-icon-tickets"></i>
+      <span>数据列表</span>
+
+      <div class="btn-add">
+        <el-button  @click="handleAddProduct()" size="mini">
+          新增入库
+        </el-button>
+        <el-button type="primary" @click="handleDownloadStock()" size="mini">
+          导出记录
+        </el-button>
+      </div>
+
+    </el-card>
+    <div class="table-container">
+      <el-table
+        ref="productTable"
+        :data="list"
+        style="width: 100%"
+        v-loading="listLoading"
+        border
+      >
+        <el-table-column label="批次号" width="100" align="center">
+          <template slot-scope="scope">{{ scope.row.id }}</template>
+        </el-table-column>
+        <el-table-column label="备查货号" width="120" align="center" >
+          <template slot-scope="scope">{{ scope.row.selectProductSn }}</template>
+        </el-table-column>
+        <el-table-column label="sku编号" align="center">
+          <template slot-scope="scope">
+            <p>{{ scope.row.productSkuId }}</p>
+          </template>
+        </el-table-column>
+        <el-table-column label="内部库存" align="center">
+          <template slot-scope="scope">
+            <p>{{ scope.row.internalStock }}</p>
+          </template>
+        </el-table-column>
+         <el-table-column label="内部售出数量" align="center">
+          <template slot-scope="scope">
+            <p>{{ scope.row.internalSaleStock }}</p>
+          </template>
+        </el-table-column>
+         <el-table-column label="税务库存" align="center">
+          <template slot-scope="scope">
+            <p>{{ scope.row.taxStock }}</p>
+          </template>
+        </el-table-column>
+         <el-table-column label="税务售出库存" align="center">
+          <template slot-scope="scope">
+            <p>{{ scope.row.taxSaleStock }}</p>
+          </template>
+        </el-table-column>
+         <el-table-column label="采购价" align="center">
+          <template slot-scope="scope">
+            <p>{{ scope.row.price }}</p>
+          </template>
+        </el-table-column>
+         <el-table-column label="入库日期" align="center">
+          <template slot-scope="scope">
+            <p>{{ scope.row.createTime }}</p>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <div class="pagination-container">
+      <el-pagination
+        background
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        layout="total, sizes,prev, pager, next,jumper"
+        :page-size="listQuery.pageSize"
+        :page-sizes="[5, 10, 15]"
+        :current-page.sync="listQuery.pageNum"
+        :total="total"
+      >
+      </el-pagination>
+    </div>
+    <el-dialog
+      title="新增入库"
+      :visible.sync="dialogVisible"
+      width="40%"
+    >
+      <el-form ref="productAttrCatForm" :model="editSkuInfo" :rules="rules" label-width="120px">
+        <el-form-item label="查备货号" prop="selectProductSn">
+          <el-input size="small" v-model="editSkuInfo.selectProductSn" placeholder="请输入查备货号" auto-complete="off"></el-input>
+        </el-form-item>
+        <el-form-item label="内部库存" prop="internalStock">
+          <el-input size="small" v-model="editSkuInfo.internalStock" @input="
+            val => {
+              onchange(val)
+            }
+          "  placeholder="请输入内部库存" auto-complete="off"></el-input>
+          <!-- <el-input-number size="small" class="inputposition" v-model="editSkuInfo.internalStock" placeholder="请输入内部库存" :controls="false" /> -->
+        </el-form-item>
+        <el-form-item label="税务库存" prop="taxStock">
+          <el-input size="small" v-model="editSkuInfo.taxStock" @input="
+            val => {
+              editSkuInfo.taxStock = val.replace(/[^\d]/g, '');
+            }
+          "  placeholder="请输入税务库存" auto-complete="off"></el-input>
+        </el-form-item>
+        <el-form-item label="采购价" prop="price">
+          <el-input size="small" v-model="editSkuInfo.price" @keyup.native="keyupEvent($event)" placeholder="请输入采购价" auto-complete="off"></el-input>
+        </el-form-item>
+        <el-form-item label="Sku" prop="productSkuId">
+          <el-select size="small" v-model="editSkuInfo.productSkuId" style="width:100%" placeholder="请选择Sku">
+            <el-option
+              v-for="item in stockList"
+              :key="item.id"
+              :label="item.spText"
+              :value="item.id">
+            </el-option>
+          </el-select>
+        </el-form-item>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="handleClose">取 消</el-button>
+        <el-button type="primary" @click="handleConfirm('productAttrCatForm')"
+          >确 定</el-button
+        >
+      </span>
+    </el-dialog>
+  </div>
+</template>
+<script>
+import { Export } from "@/utils/downLoadFile";
+import { getTimes } from '@/utils'
+import {
+  fetchList as fetchSkuStockList
+} from "@/api/skuStock";
+import {
+  getProductSkuStockRecord,
+  getProductSkuStockRecordCreate
+} from "@/api/product";
+const defaultListQuery = {
+  keyword: null,
+  pageNum: 1,
+  pageSize: 5,
+  id: null,
+  selectProductSn: null,
+  timer: null
+};
+export default {
+  name: "productList",
+  data() {
+    return {
+      dialogVisible: false,
+      editSkuInfo: {
+        productId: null,
+        productSkuId: null,
+        selectProductSn: null,
+        internalStock: null,
+        taxStock: null,
+        price: null
+      },
+      rules: {
+        selectProductSn: [{ required: true, message: '请输入查备货号', trigger: 'blur' }],
+        internalStock: [{ required: true, message: '请输入内部库存', trigger: 'blur' }],
+        taxStock: [{ required: true, message: '请输入税务库存', trigger: 'blur' }],
+        price: [{ required: true, message: '请输入采购价', trigger: 'blur' }],
+        productSkuId: [{ required: true, message: '请选择Sku', trigger: 'change, blur' }],
+      },
+      stockList: [],
+      productId: null,
+      listQuery: Object.assign({}, defaultListQuery),
+      list: null,
+      total: null,
+      listLoading: true,
+      selectProductCateValue: null,
+      multipleSelection: [],
+      productCateOptions: [],
+      brandOptions: [],
+    };
+  },
+  created() {
+    this.productId = this.$route.query.id;
+    this.getList();
+  },
+  methods: {
+    onchange(val) {
+      this.editSkuInfo.internalStock = val.replace(/[^\d]/g, '');
+    },
+    getList() {
+      this.listLoading = true;
+      const { timer, ...more } = this.listQuery;
+      getProductSkuStockRecord({...more, productId: this.productId, ...getTimes(timer, ['startTime', 'endTime'])}).then((response) => {
+        this.listLoading = false;
+        this.list = response.data.list;
+        this.total = response.data.total;
+      });
+    },
+    handleConfirm(formName){
+        this.$refs[formName].validate((valid) => {
+          if (valid) {
+            let obj = {
+              ...this.editSkuInfo,
+              productId: this.productId,
+            }
+            getProductSkuStockRecordCreate(obj).then(response=>{
+                this.$message({
+                  message: '添加成功',
+                  type: 'success',
+                  duration:1000
+                });
+                this.dialogVisible = false;
+                this.handleClose()
+                this.getList();
+              });
+          } else {
+            console.log('error submit!!');
+            return false;
+          }
+        });
+      },
+      handleClose(){
+        if (!this.dialogVisible && this.$refs.productAttrCatForm) {
+          this.$refs.productAttrCatForm.clearValidate()
+        }
+      },
+    handleSearchList() {
+      this.listQuery.pageNum = 1;
+      this.getList();
+    },
+    handleAddProduct() {
+      fetchSkuStockList(this.productId).then((response) => {
+        try {
+          // debugger
+        const tempResult = response.data || [];
+        tempResult.forEach((product) => {
+          const spData = product.spData ? JSON.parse(product.spData) : [{ key: '默认' }]
+          let spText  = ''
+          spData.forEach((sp) => {
+            spText += sp.key + (sp.value ? ':' + sp.value: '')
+          })
+          product.spText = spText
+        })
+
+        this.stockList = tempResult;
+        this.dialogVisible = true;
+        } catch(e) {
+          console.log(e)
+        }
+      });
+
+    },
+    handleDownloadStock() {
+      Export(
+        this,
+        {
+          url: "/api-mall-admin/export/pmsProductSkuStockRecord",
+          fileName: "进货清单记录.xls",
+          method: "post",
+          params: { ...this.listQuery, productId: this.productId },
+        },
+        "您确定导出进货清单记录?"
+      );
+    },
+    handleSizeChange(val) {
+      this.listQuery.pageNum = 1;
+      this.listQuery.pageSize = val;
+      this.getList();
+    },
+    handleCurrentChange(val) {
+      this.listQuery.pageNum = val;
+      this.getList();
+    },
+    handleResetSearch() {
+      this.selectProductCateValue = [];
+      this.listQuery = Object.assign({}, defaultListQuery);
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+::v-deep.el-select--small {
+  width: 203px !important;
+}
+
+.inputposition {
+  width: 100%;
+input {
+  text-align: left;
+}
+}
+</style>
+