出库入库修改

package.json

@@ -39,6 +39,7 @@
     "js-md5": "^0.8.3",
     "jsencrypt": "^3.0.0-rc.1",
     "jszip": "^3.7.1",
+    "lodash": "^4.17.21",
     "material-components-vue": "^1.2.0",
     "mavon-editor": "^2.9.1",
     "normalize.css": "7.0.0",

src/views/invoicing/components/consumableList.vue

@@ -3,13 +3,13 @@
     <el-dialog title="选择耗材" :visible.sync="dialogVisible" @open="resetHandle()">
         <el-form :model="searchForm" inline>
             <el-form-item>
-                <el-input v-model="searchForm.conTypeName" placeholder="耗材类型名称"></el-input>
+                <el-input v-model="searchForm.conTypeName" placeholder="耗材类型名称" @input="onInput"></el-input>
             </el-form-item>
             <el-form-item>
-                <el-input v-model="searchForm.conCode" placeholder="耗材代码"></el-input>
+                <el-input v-model="searchForm.conCode" placeholder="耗材代码" @input="onInput"></el-input>
             </el-form-item>
             <el-form-item>
-                <el-input v-model="searchForm.conName" placeholder="耗材名称"></el-input>
+                <el-input v-model="searchForm.conName" placeholder="耗材名称" @input="onInput"></el-input>
             </el-form-item>
             <el-form-item>
                 <el-button type="primary" @click="getTableData">查询</el-button>
@@ -17,7 +17,8 @@
             </el-form-item>
         </el-form>
         <div class="head-container">
-            <el-table ref="table" :data="tableData.list" v-loading="tableData.loading" @select="firstSelectChange">
+            <el-table ref="table" :data="tableData.list" v-loading="tableData.loading" @select="firstSelectChange"
+                :row-key="getRowKey" @selection-change="onSelectionChange">
                 <el-table-column type="selection" width="55" align="center"></el-table-column>
                 <el-table-column label="耗材名称" prop="conName"></el-table-column>
                 <el-table-column label="价格" prop="price"></el-table-column>
@@ -50,6 +51,8 @@
 <script>
 import { formatDecimal } from '@/utils'
 import { tbConsInfoGet } from "@/api/invoicing";
+import _ from 'lodash'
+
 export default {
     data() {
         return {
@@ -69,13 +72,23 @@ export default {
                 loading: false,
                 list: []
             },
-            goods: []
+            goods: [],
+            stayselection: []
         }
     },
     mounted() {
         this.resetSearchForm = { ...this.searchForm }
     },
     methods: {
+        onInput: _.debounce(function (event) { //防抖请求
+            this.getTableData()
+        }, 500),
+        onSelectionChange(selection) {
+            this.stayselection = selection
+        },
+        getRowKey(row) {
+            return row.id
+        },
         firstSelectChange() {
             // console.log(selection)
             let selection = this.$refs.table.selection
@@ -86,7 +99,8 @@ export default {
         },
         // 确定选商品
         confirmHandle() {
-            let res = this.$refs.table.selection
+            // let res = this.$refs.table.selection
+            let res = this.stayselection
             this.$emit('success', res)
             this.close()
         },

src/views/invoicing/components/shopList.vue

@@ -2,7 +2,7 @@
     <el-dialog title="选择商品" :visible.sync="dialogVisible" @open="resetHandle()">
         <el-form :model="searhForm" inline>
             <el-form-item>
-                <el-input v-model="searhForm.name" placeholder="商品名称"></el-input>
+                <el-input v-model="searhForm.name" placeholder="商品名称" @input="onInput"></el-input>
             </el-form-item>
             <el-form-item>
                 <el-select v-model="searhForm.category" placeholder="商品分类">
@@ -16,8 +16,9 @@
             </el-form-item>
         </el-form>
         <div class="head-container">
-            <el-table ref="table" :data="tableData.list" @select="firstSelectChange" v-loading="tableData.loading">
+            <el-table ref="table" :data="tableData.list" @select="firstSelectChange" v-loading="tableData.loading"
-                <el-table-column type="selection" width="55" align="center"></el-table-column>
+                :row-key="getRowKey" @selection-change="onSelectionChange">
+                <el-table-column type="selection" width="55" align="center" :reserve-selection="true"></el-table-column>
                 <el-table-column label="商品信息">
                     <template v-slot="scope">
                         <div class="shop_info">
@@ -68,7 +69,7 @@
 
 <script>
 import { tbShopCategoryGet, tbProductlist } from "@/api/invoicing";
-
+import _ from 'lodash'
 export default {
     data() {
         return {
@@ -80,19 +81,28 @@ export default {
             categoryList: [],
             tableData: {
                 page: 0,
-                size: 30,
+                size: 10,
                 total: 0,
                 loading: false,
                 list: []
             },
             goods: [],
             // 是否单选
-            isselect: false
+            isselect: false,
+            stayselection: []//待确认
         }
     },
     methods: {
+        onInput: _.debounce(function (event) {//防抖请求
+            this.getTableData()
+        }, 500),
+        onSelectionChange(selection) {
+            this.stayselection = selection
+        },
+        getRowKey(row) {
+            return row.id
+        },
         firstSelectChange() {
-            // console.log(selection)
             let selection = this.$refs.table.selection
             if (selection.length > 1 && this.isselect) {
                 const del_row = selection.shift();
@@ -101,7 +111,8 @@ export default {
         },
         // 确定选商品
         confirmHandle() {
-            let res = this.$refs.table.selection
+            // let res = this.$refs.table.selection
+            let res = this.stayselection
             this.$emit('success', res)
             this.close()
         },
@@ -114,7 +125,7 @@ export default {
             this.searhForm.name = ''
             this.searhForm.category = ''
             this.tableData.page = 0
-            this.tableData.size = 30
+            this.tableData.size = 10
             this.tableData.list = []
             this.getTableData()
         },

src/views/invoicing/operation_in.vue

@@ -13,7 +13,7 @@
                         </div>
                     </div>
                 </el-form-item>
-                <el-form-item label="入库类型" v-if="inTabValue == 'goods'">
+                <!-- <el-form-item label="入库类型" v-if="inTabValue == 'goods'">
                     <div class="shop_type_box">
                         <div class="item" v-for="(item, index) in shopTypes" :key="index"
                             :class="{ active: shopTypesActive == index }" @click="changeTypeEnum(index)">
@@ -34,11 +34,12 @@
                             </div>
                         </div>
                     </div>
-                </el-form-item>
+                </el-form-item> -->
                 <el-row>
-                    <el-col :span="8" v-if="shopTypes[shopTypesActive].value == 'purveyor'">
+                    <el-col :span="8">
                         <el-form-item label="供应商">
-                            <el-select v-model="queryForm.purveyorId" placeholder="请选择供应商" style="width: 220px;">
+                            <el-select v-model="queryForm.purveyorId" placeholder="请选择供应商" clearable
+                                style="width: 220px;" @change="changeTypeEnum">
                                 <el-option :label="item.purveyorName" :value="item.id" v-for="item in purveyorList"
                                     :key="item.id"></el-option>
                             </el-select>
@@ -88,11 +89,14 @@
                         </el-form-item>
                     </el-col>
                 </el-row>
-                <el-form-item>
+                <!-- <el-form-item>
                     <el-button type="primary" @click="$refs.ConsumableList.show(tableData.list)"
                         v-if="inTabValue == 'consumable'">选择耗材</el-button>
                     <el-button type="primary" @click="$refs.shopList.show(tableData.list)" v-else>选择商品</el-button>
-                </el-form-item>
+                </el-form-item> -->
+                <el-autocomplete v-model="autocompletename" :fetch-suggestions="querySearchAsync"
+                    :value-key="inTabValue == 'goods' ? 'name' : 'conName'" :placeholder="inTabValue == 'goods'?'商品搜索':'耗材搜索'" @select="handleSelect"
+                    style="width: 500px;"></el-autocomplete>
             </el-form>
         </div>
         <div class="head-container">
@@ -141,7 +145,7 @@
                 </el-table-column> -->
                 <el-table-column label="操作" width="80">
                     <template v-slot="scope">
-                        <el-button type="text" @click="tableData.list.splice(scope.$index, 1)">删除</el-button>
+                        <el-button type="text" @click="tableData.list.splice(scope.$index, 1),consCountTotal($event, scope.row, 'stockNumber')">删除</el-button>
                     </template>
                 </el-table-column>
             </el-table>
@@ -185,7 +189,7 @@
                 </el-table-column>
                 <el-table-column label="操作" width="80">
                     <template v-slot="scope">
-                        <el-button type="text" @click="tableData.list.splice(scope.$index, 1)">删除</el-button>
+                        <el-button type="text" @click="tableData.list.splice(scope.$index, 1),consCountTotal($event, scope.row, 'stockNumber')">删除</el-button>
                     </template>
                 </el-table-column>
             </el-table>
@@ -215,6 +219,7 @@
 import dayjs from 'dayjs'
 import shopList from './components/shopList'
 import ConsumableList from './components/consumableList'
+import { tbConsInfoGet, tbProductlist } from "@/api/invoicing";
 import { tbShopPurveyorGet, tbProductStockOperateOutAndOn, stockInOut } from '@/api/invoicing'
 import { formatDecimal } from '@/utils'
 export default {
@@ -238,7 +243,7 @@ export default {
                     type: 'in'
                 }
             ],
-            shopTypesActive: 0,
+            shopTypesActive: 1,
             shopTypes: [
                 {
                     label: '供应商入库',
@@ -290,7 +295,10 @@ export default {
             tableData: {
                 list: []
             },
-            showResult: false
+            showResult: false,
+            autocompletename: '',
+            restaurants: [],
+            timeout: null
         }
     },
     mounted() {
@@ -298,11 +306,67 @@ export default {
         this.tbShopPurveyorGet()
     },
     methods: {
+        async querySearchAsync(queryString, cb) {//快捷搜索
+            let res = null
+            if (this.inTabValue == 'goods') {
+                res = await tbProductlist({
+                    page: 0,
+                    size: 20,
+                    name: queryString ? queryString : '',
+                    shopId: localStorage.getItem('shopId'),
+                    sort: 'id',
+                })
+            } else {
+                res = await tbConsInfoGet({
+                    page: 0,
+                    size: 20,
+                    shopId: localStorage.getItem('shopId'),
+                    conName: queryString ? queryString : ''
+                })
+
+            }
+            this.restaurants = res.content
+            if (res.content.length == 0) {//给个提示没有搜到
+                this.$message('无此商品');
+                return false
+            }
+            var uniqueArray = this.restaurants.filter(item1 =>
+                !this.tableData.list.some(item2 => item2.productId == item1.id)
+            );
+            clearTimeout(this.timeout);
+            this.timeout = setTimeout(() => {
+                cb(uniqueArray);
+            }, 1000 * Math.random());
+        },
+        handleSelect(item) {//选定后清空
+            this.autocompletename = ''
+            if (this.inTabValue == 'goods') {
+                this.selectShop([item])
+            } else {
+                this.selectConsumable([item])
+            }
+        },
+        // 选择商品
+        selectShop(res) {
+            let arr = []
+            res.forEach(item => {
+                item.skuList.forEach(i => {
+                    arr.push({
+                        name: item.name,
+                        unitName: item.unitName,
+                        productId: item.id,
+                        number: 0,
+                        totalAmount: '',
+                        ...i
+                    })
+                })
+            })
+            this.tableData.list = [...this.tableData.list, ...arr]
+        },
         // 切换入库内容
         tabChange(value, type) {
-            console.log(type);
+            this.shopTypesActive = type == 'in' ? 0 : 1
             this.inTabValue = value
-            this.shopTypesActive = 0
             this.resetHandle()
         },
         // 计算耗材总价
@@ -343,7 +407,6 @@ export default {
             } else {
                 row[key1] = cvalue
                 row[key2] = cvalue
-
                 let zong = 0
                 this.tableData.list.forEach(ele => {
                     zong += ele.costPrice * ele.number
@@ -353,6 +416,19 @@ export default {
         },
         // 提交
         submitHandle() {
+            if (this.tableData.list.length == 0) {
+                switch (this.inTabValue) {
+                    case 'goods':
+                        this.$message('请先选择商品！');
+                        break;
+                    case 'consumable':
+                        this.$message('请先选择耗材！');
+                        break;
+                    default:
+                        break;
+                }
+                return false
+            }
             this.$refs.queryForm.validate(async valid => {
                 if (valid) {
                     try {
@@ -375,6 +451,8 @@ export default {
                         }
                         this.queryFormLoading = false
                         this.showResult = true
+                        this.$refs.shopList.clearSelection()//清除选项
+                        this.$refs.ConsumableList.clearSelection()//清除选项
                     } catch (error) {
                         console.log(error)
                         this.queryFormLoading = false
@@ -384,32 +462,16 @@ export default {
         },
         // 选择耗材
         selectConsumable(res) {
-            this.tableData.list = res.map(item => {
+            let arr = res.map(item => {
                 item.number = formatDecimal(item.stockNumber - item.stockConsume, 2, true)
                 item.stockNumber = 0
                 item.costPrice = item.price
                 item.conInfold = item.id
                 return item
             })
+            this.tableData.list = [...this.tableData.list, ...arr]
         },
-        // 选择商品
+
-        selectShop(res) {
-            let arr = []
-            res.forEach(item => {
-                item.skuList.forEach(i => {
-                    arr.push({
-                        name: item.name,
-                        unitName: item.unitName,
-                        productId: item.id,
-                        number: 0,
-                        totalAmount: '',
-                        ...i
-                    })
-                })
-            })
-            console.log(arr)
-            this.tableData.list = arr
-        },
         // 初始化
         resetHandle() {
             this.showResult = false
@@ -421,11 +483,23 @@ export default {
             }
             this.tableData.list = []
             this.$refs.queryForm.resetFields()
+            this.$refs.queryForm.resetFields()
         },
         // 切换类型
         changeTypeEnum(index) {
-            this.shopTypesActive = index
+            console.log(this.inTabValue)
-            this.queryForm.type = this.shopTypes[index].value
+            if (this.inTabValue == 'consumable') {
+                return false
+            }
+            if (this.queryForm.purveyorId) {
+                this.shopTypesActive = 0
+            } else {
+                this.shopTypesActive = 1
+            }
+            this.queryForm.type = this.shopTypes[this.shopTypesActive].value
+            // console.log(index)
+            // this.shopTypesActive = index
+            // this.queryForm.type = this.shopTypes[index].value
         },
         // 获取供应商列表
         async tbShopPurveyorGet() {

src/views/invoicing/operation_out.vue

@@ -13,7 +13,7 @@
                         </div>
                     </div>
                 </el-form-item>
-                <el-form-item label="出库类型" v-if="inTabValue == 'goods'">
+                <!-- <el-form-item label="出库类型" v-if="inTabValue == 'goods'">
                     <div class="shop_type_box">
                         <div class="item" v-for="(item, index) in shopTypes" :key="index"
                             :class="{ active: shopTypesActive == index }" @click="changeTypeEnum(index)">
@@ -34,11 +34,12 @@
                             </div>
                         </div>
                     </div>
-                </el-form-item>
+                </el-form-item> -->
                 <el-row>
-                    <el-col :span="8" v-if="shopTypes[shopTypesActive].value == 'reject'">
+                    <el-col :span="8">
                         <el-form-item label="供应商">
-                            <el-select v-model="queryForm.purveyorId" placeholder="请选择供应商" style="width: 220px;">
+                            <el-select clearable v-model="queryForm.purveyorId" placeholder="请选择供应商"
+                                style="width: 220px;" @change="changeTypeEnum">
                                 <el-option :label="item.purveyorName" :value="item.id" v-for="item in purveyorList"
                                     :key="item.id"></el-option>
                             </el-select>
@@ -88,11 +89,15 @@
                         </el-form-item>
                     </el-col>
                 </el-row>
-                <el-form-item>
+                <!-- <el-form-item>
                     <el-button type="primary" @click="$refs.ConsumableList.show(tableData.list)"
                         v-if="inTabValue == 'consumable'">选择耗材</el-button>
                     <el-button type="primary" @click="$refs.shopList.show(tableData.list)" v-else>选择商品</el-button>
-                </el-form-item>
+                </el-form-item> -->
+                <el-autocomplete v-model="autocompletename" :fetch-suggestions="querySearchAsync"
+                    :value-key="inTabValue == 'goods' ? 'name' : 'conName'" :placeholder="inTabValue == 'goods'?'商品搜索':'耗材搜索'" @select="handleSelect"
+                    style="width: 500px;"></el-autocomplete>
+
             </el-form>
         </div>
         <div class="head-container">
@@ -137,7 +142,7 @@
                 </el-table-column> -->
                 <el-table-column label="操作" width="80">
                     <template v-slot="scope">
-                        <el-button type="text" @click="tableData.list.splice(scope.$index, 1)">删除</el-button>
+                        <el-button type="text" @click="tableData.list.splice(scope.$index, 1),consCountTotal($event, scope.row, 'stockNumber')">删除</el-button>
                     </template>
                 </el-table-column>
             </el-table>
@@ -179,7 +184,7 @@
                 </el-table-column>
                 <el-table-column label="操作" width="80">
                     <template v-slot="scope">
-                        <el-button type="text" @click="tableData.list.splice(scope.$index, 1)">删除</el-button>
+                        <el-button type="text" @click="tableData.list.splice(scope.$index, 1),consCountTotal($event, scope.row, 'stockNumber')">删除</el-button>
                     </template>
                 </el-table-column>
             </el-table>
@@ -209,7 +214,8 @@
 import dayjs from 'dayjs'
 import shopList from './components/shopList'
 import ConsumableList from './components/consumableList'
-import { tbShopPurveyorGet, tbProductStockOperateOutAndOn, stockInOut } from '@/api/invoicing'
+import { tbShopPurveyorGet, tbProductStockOperateOutAndOn, stockInOut, tbConsInfoGet, tbProductlist } from '@/api/invoicing'
+
 import { formatDecimal } from '@/utils'
 export default {
     components: {
@@ -232,7 +238,7 @@ export default {
                     type: 'out'
                 }
             ],
-            shopTypesActive: 0,
+            shopTypesActive: 1,
             shopTypes: [
                 {
                     label: '供应商退货',
@@ -284,7 +290,10 @@ export default {
             tableData: {
                 list: []
             },
-            showResult: false
+            showResult: false,
+            autocompletename: '',
+            restaurants: [],
+            timeout: null
         }
     },
     mounted() {
@@ -292,10 +301,50 @@ export default {
         this.tbShopPurveyorGet()
     },
     methods: {
+        async querySearchAsync(queryString, cb) {//快捷搜索
+            let res = null
+            if (this.inTabValue == 'goods') {
+                res = await tbProductlist({
+                    page: 0,
+                    size: 20,
+                    name: queryString ? queryString : '',
+                    shopId: localStorage.getItem('shopId'),
+                    sort: 'id',
+                })
+            } else {
+                res = await tbConsInfoGet({
+                    page: 0,
+                    size: 20,
+                    shopId: localStorage.getItem('shopId'),
+                    conName: queryString ? queryString : ''
+                })
+
+            }
+            this.restaurants = res.content
+            if (res.content.length == 0) {//给个提示没有搜到
+                this.$message('无此商品');
+                return false
+            }
+            var uniqueArray = this.restaurants.filter(item1 =>
+                !this.tableData.list.some(item2 => item2.productId == item1.id)
+            );
+            clearTimeout(this.timeout);
+            this.timeout = setTimeout(() => {
+                cb(uniqueArray);
+            }, 1000 * Math.random());
+        },
+        handleSelect(item) {//选定后清空
+            this.autocompletename = ''
+            if (this.inTabValue == 'goods') {
+                this.selectShop([item])
+            } else {
+                this.selectConsumable([item])
+            }
+        },
         // 切换入库内容
         tabChange(value, type) {
             this.inTabValue = value
-            this.shopTypesActive = 0
+            this.shopTypesActive = 1
             this.resetHandle()
             this.queryForm.type = type
         },
@@ -347,6 +396,19 @@ export default {
         },
         // 提交
         submitHandle() {
+            if (this.tableData.list.length == 0) {
+                switch (this.inTabValue) {
+                    case 'goods':
+                        this.$message('请先选择商品入！');
+                        break;
+                    case 'consumable':
+                        this.$message('请先选择耗材！');
+                        break;
+                    default:
+                        break;
+                }
+                return false
+            }
             this.$refs.queryForm.validate(async valid => {
                 if (valid) {
                     try {
@@ -370,6 +432,8 @@ export default {
                         }
                         this.queryFormLoading = false
                         this.showResult = true
+                        this.$refs.shopList.clearSelection()//清除选项
+                        this.$refs.ConsumableList.clearSelection()//清除选项
                     } catch (error) {
                         console.log(error)
                         this.queryFormLoading = false
@@ -379,13 +443,14 @@ export default {
         },
         // 选择耗材
         selectConsumable(res) {
-            this.tableData.list = res.map(item => {
+            let arr = res.map(item => {
                 item.number = formatDecimal(item.stockNumber - item.stockConsume, 2, true)
                 item.stockNumber = 0
                 item.costPrice = item.price
                 item.conInfold = item.id
                 return item
             })
+            this.tableData.list = [...this.tableData.list, ...arr]
         },
         // 选择商品
         selectShop(res) {
@@ -402,8 +467,7 @@ export default {
                     })
                 })
             })
-            console.log(arr)
+            this.tableData.list = [...this.tableData.list, ...arr]
-            this.tableData.list = arr
         },
         // 初始化
         resetHandle() {
@@ -419,8 +483,14 @@ export default {
         },
         // 切换类型
         changeTypeEnum(index) {
-            this.shopTypesActive = index
+            if (this.queryForm.purveyorId) {
-            this.queryForm.type = this.shopTypes[index].value
+                this.shopTypesActive = 0
+            } else {
+                this.shopTypesActive = 1
+            }
+            this.queryForm.type = this.shopTypes[this.shopTypesActive].value
+            // this.shopTypesActive = index
+            // this.queryForm.type = this.shopTypes[index].value
         },
         // 获取供应商列表
         async tbShopPurveyorGet() {