Skip to content

M
manage
Commit 1dd30f95 by wangyalan-git
Options

操作日志,用户列表，管理员列表

parent 1ed4c475
Showing with 1717 additions and 92 deletions
package-lock.json
...@@ -1634,7 +1634,7 @@ ...@@ -1634,7 +1634,7 @@
}, },
"cfb": { "cfb": {
"version": "1.1.4", "version": "1.1.4",
"resolved": "https://registry.npm.taobao.org/cfb/download/cfb-1.1.4.tgz?cache=0&sync_timestamp=1584079355027&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fcfb%2Fdownload%2Fcfb-1.1.4.tgz", "resolved": "https://registry.npm.taobao.org/cfb/download/cfb-1.1.4.tgz",
"integrity": "sha1-gf017eTJGdjwliqUWC4d+vcFHio=", "integrity": "sha1-gf017eTJGdjwliqUWC4d+vcFHio=",
"requires": { "requires": {
"adler-32": "~1.2.0", "adler-32": "~1.2.0",
...@@ -1645,7 +1645,7 @@ ...@@ -1645,7 +1645,7 @@
"dependencies": { "dependencies": {
"commander": { "commander": {
"version": "2.20.3", "version": "2.20.3",
"resolved": "https://registry.npm.taobao.org/commander/download/commander-2.20.3.tgz", "resolved": "https://registry.npm.taobao.org/commander/download/commander-2.20.3.tgz?cache=0&sync_timestamp=1584148356834&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fcommander%2Fdownload%2Fcommander-2.20.3.tgz",
"integrity": "sha1-/UhehMA+tIgcIHIrpIA16FMa6zM=" "integrity": "sha1-/UhehMA+tIgcIHIrpIA16FMa6zM="
} }
} }
...@@ -1877,7 +1877,7 @@ ...@@ -1877,7 +1877,7 @@
"dependencies": { "dependencies": {
"commander": { "commander": {
"version": "2.14.1", "version": "2.14.1",
"resolved": "https://registry.npm.taobao.org/commander/download/commander-2.14.1.tgz", "resolved": "https://registry.npm.taobao.org/commander/download/commander-2.14.1.tgz?cache=0&sync_timestamp=1584148356834&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fcommander%2Fdownload%2Fcommander-2.14.1.tgz",
"integrity": "sha1-IjUSPjevjKPGXfRbAm29NXsBuao=" "integrity": "sha1-IjUSPjevjKPGXfRbAm29NXsBuao="
} }
} }
...@@ -10486,7 +10486,7 @@ ...@@ -10486,7 +10486,7 @@
}, },
"ssf": { "ssf": {
"version": "0.10.3", "version": "0.10.3",
"resolved": "https://registry.npm.taobao.org/ssf/download/ssf-0.10.3.tgz?cache=0&sync_timestamp=1592373934925&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fssf%2Fdownload%2Fssf-0.10.3.tgz", "resolved": "https://registry.npm.taobao.org/ssf/download/ssf-0.10.3.tgz",
"integrity": "sha1-jq4fwpyQpVLnkhII+BiS1vd6yys=", "integrity": "sha1-jq4fwpyQpVLnkhII+BiS1vd6yys=",
"requires": { "requires": {
"frac": "~1.1.2" "frac": "~1.1.2"
...@@ -12127,7 +12127,7 @@ ...@@ -12127,7 +12127,7 @@
"dependencies": { "dependencies": {
"commander": { "commander": {
"version": "2.17.1", "version": "2.17.1",
"resolved": "https://registry.npm.taobao.org/commander/download/commander-2.17.1.tgz", "resolved": "https://registry.npm.taobao.org/commander/download/commander-2.17.1.tgz?cache=0&sync_timestamp=1584148356834&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fcommander%2Fdownload%2Fcommander-2.17.1.tgz",
"integrity": "sha1-vXerfebelCBc6sxy8XFtKfIKd78=" "integrity": "sha1-vXerfebelCBc6sxy8XFtKfIKd78="
} }
} }
......
src/api/inventory.js
...@@ -122,3 +122,43 @@ export function editDepart(params) { ...@@ -122,3 +122,43 @@ export function editDepart(params) {
params params
}) })
} }
// 万科h5_查询一条商品记录
export function getGoodsDetail(data) {
return request({
url: 'vankeGoods/selectOneByOter',
method: 'post',
data
})
}
// 万科h5_校验二维码唯一标识符
export function checkQcode (params) {
return request({
url: 'staff/checkOnlyId',
method: 'get',
params
})
}
// 根据会员id查询一条数据
export function getMemberInfo (params) {
return request({
url: 'umsMember/selectOneByMemberId',
method: 'get',
params
})
}
// 万科后台_出库多条物品
export function outGoods(data) {
return request({
url: 'vankeGoods/OutVankeGoodsList',
method: 'post',
data
})
}
// 万科后台_入库单分页查询
export function getInBoundList (params) {
return request({
url: 'vankeInboundOrder/getPageList',
method: 'get',
params
})
}
src/api/user.js
...@@ -29,3 +29,11 @@ export function cancleAdmin(data) { ...@@ -29,3 +29,11 @@ export function cancleAdmin(data) {
data data
}) })
} }
// 万科后台_批量导入会员
export function importMember(data) {
return request({
url: 'umsMember/vankeImportMember',
method: 'post',
data
})
}
src/store/modules/user.js
...@@ -7,7 +7,7 @@ const user = { ...@@ -7,7 +7,7 @@ const user = {
token: getToken(), token: getToken(),
name: '', name: '',
userId: getCookie("userId"), userId: getCookie("userId"),
memeberId: getCookie("memeberId"), memberId: getCookie("memberId"),
stockRoomId: getCookie("stockRoomId"), stockRoomId: getCookie("stockRoomId"),
avatar: '', avatar: '',
roles: [] roles: []
...@@ -27,9 +27,9 @@ const user = { ...@@ -27,9 +27,9 @@ const user = {
state.userId = userId state.userId = userId
setCookie("userId", userId, 15) setCookie("userId", userId, 15)
}, },
SET_MEMBERID: (state, memeberId) => { SET_MEMBERID: (state, memberId) => {
state.memeberId = memeberId state.memberId = memberId
setCookie("memeberId", memeberId, 15) setCookie("memberId", memberId, 15)
}, },
SET_STOCKROOMID: (state, stockRoomId) => { SET_STOCKROOMID: (state, stockRoomId) => {
state.stockRoomId = stockRoomId state.stockRoomId = stockRoomId
......
src/views/home/index.vue
...@@ -58,7 +58,9 @@ ...@@ -58,7 +58,9 @@
<el-button size="small" :type="inOutType==6? 'primary': ''" plain @click="selectStockByGoodsIdAndTime(6)">7天</el-button> <el-button size="small" :type="inOutType==6? 'primary': ''" plain @click="selectStockByGoodsIdAndTime(6)">7天</el-button>
<el-button size="small" :type="inOutType==14? 'primary': ''" plain @click="selectStockByGoodsIdAndTime(14)">15天</el-button> <el-button size="small" :type="inOutType==14? 'primary': ''" plain @click="selectStockByGoodsIdAndTime(14)">15天</el-button>
<div> <div>
<ve-line :data="chartData" :legend-visible="false" :settings="chartSetting"></ve-line> <ve-line :data="chartData" :loading="loading"
:data-empty="dataEmpty" :settings="chartSetting">
</ve-line>
</div> </div>
</div> </div>
</div> </div>
...@@ -66,7 +68,7 @@ ...@@ -66,7 +68,7 @@
<el-col :span="10"> <el-col :span="10">
<div class="out-border"> <div class="out-border">
<div class="layout-title">库存预警</div> <div class="layout-title">库存预警</div>
<div style="padding: 40px"> <div style="padding: 40px;height: 451px;">
<el-table <el-table
:data="homeData.stockWarns" :data="homeData.stockWarns"
style="width: 100%"> style="width: 100%">
...@@ -137,7 +139,7 @@ ...@@ -137,7 +139,7 @@
<script> <script>
import { str2Date } from '@/utils/date' import { str2Date } from '@/utils/date'
import { getHomeData,selectStockByGoodsIdAndTime,selectInBoundByCategory,selectOutBoundByCategory,selectOutBoundByDepartId } from '@/api/home' import { getHomeData,selectStockByGoodsIdAndTime,selectInBoundByCategory,selectOutBoundByCategory,selectOutBoundByDepartId } from '@/api/home'
import 'v-charts/lib/style.css'
export default { export default {
name: 'home', name: 'home',
data() { data() {
...@@ -224,6 +226,9 @@ export default { ...@@ -224,6 +226,9 @@ export default {
this.inOutType= type this.inOutType= type
selectStockByGoodsIdAndTime({dateList: this.formatEveryDay(this.inOutType)}).then(res=>{ selectStockByGoodsIdAndTime({dateList: this.formatEveryDay(this.inOutType)}).then(res=>{
this.chartData.rows = res.data this.chartData.rows = res.data
if(!this.chartData.rows){
this.dataEmpty = true
}
}) })
}, },
getHomeData() { getHomeData() {
......
src/views/inv/StockAdmin.vue
<template>  <template> 
<div class="app-container"> <div class="app-container">
<!-- 搜索栏 --> <!-- 搜索栏 -->
<el-card class="filter-container" <!-- <el-card class="filter-container"-->
shadow="never"> <!-- shadow="never">-->
<el-form :inline="true" <!-- <el-form :inline="true"-->
:model="listQuery" <!-- :model="listQuery"-->
size="small"> <!-- size="small">-->
<el-form-item label="物品名称："> <!-- <el-form-item label="物品名称：">-->
<el-input v-model="listQuery.goodsMame" <!-- <el-input v-model="listQuery.goodsMame"-->
class="input-width" <!-- class="input-width"-->
placeholder="请输入物品名称"></el-input> <!-- placeholder="请输入物品名称"></el-input>-->
</el-form-item> <!-- </el-form-item>-->
<el-form-item> <!-- <el-form-item>-->
<el-button type="primary" <!-- <el-button type="primary"-->
@click="handleSearchList" <!-- @click="handleSearchList"-->
icon="el-icon-search" <!-- icon="el-icon-search"-->
size="small">搜索 <!-- size="small">搜索-->
</el-button> <!-- </el-button>-->
<el-button @click="handleResetSearch" <!-- <el-button @click="handleResetSearch"-->
icon="el-icon-refresh" <!-- icon="el-icon-refresh"-->
size="small">重置 <!-- size="small">重置-->
</el-button> <!-- </el-button>-->
</el-form-item> <!-- </el-form-item>-->
</el-form> <!-- </el-form>-->
</el-card> <!-- </el-card>-->
<!-- 表格栏 --> <!-- 表格栏 -->
<el-card class="filter-container mt15" <el-card class="filter-container mt15"
shadow="never"> shadow="never">
...@@ -37,15 +37,16 @@ ...@@ -37,15 +37,16 @@
width="50"></el-table-column> width="50"></el-table-column>
<el-table-column label="物品名称" <el-table-column label="物品名称"
align="center"> align="center">
<template slot-scope="scope">{{scope.row.goodsName}}</template> <template slot-scope="scope">{{scope.row.vorList | getName}}</template>
</el-table-column> </el-table-column>
<el-table-column label="总数量" <el-table-column label="总数量"
align="center"> align="center">
<template slot-scope="scope">{{scope.row.inboundNum}}</template> <template slot-scope="scope">{{scope.row.vorList | getNum}}</template>
</el-table-column> </el-table-column>
<el-table-column label="入库人" <el-table-column label="入库人"
align="center"> align="center">
<template slot-scope="scope">{{$store.getters.type == 1? scope.row.backInboundName : scope.row.receptInboundName}} <template slot-scope="scope">{{$store.getters.type == 1? scope.row.backName :
scope.row.receptName}}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="入库日期" <el-table-column label="入库日期"
...@@ -67,7 +68,7 @@ ...@@ -67,7 +68,7 @@
</el-button> </el-button>
<el-button size="mini" <el-button size="mini"
type="primary" type="primary"
@click="exportEntry(scope.row.id)">生成入库单 @click="exportEntry(scope.row)">生成入库单
</el-button> </el-button>
</template> </template>
</el-table-column> </el-table-column>
...@@ -95,13 +96,12 @@ ...@@ -95,13 +96,12 @@
</template> </template>
<script> <script>
import moment from 'moment' import moment from 'moment'
import { getInboundRecordList } from '@/api/inventory' import { getInBoundList } from '@/api/inventory'
import inventoryDetailsModal from './modules/inventoryDetailsModal' import inventoryDetailsModal from './modules/inventoryDetailsModal'
// 列表查询参数默认值 // 列表查询参数默认值
const defaultListQuery = { const defaultListQuery = {
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10
goodsMame: ''
} }
export default { export default {
...@@ -116,7 +116,7 @@ export default { ...@@ -116,7 +116,7 @@ export default {
multipleSelection: [], multipleSelection: [],
} }
}, },
created() { mounted() {
this.getList() this.getList()
}, },
filters: { filters: {
...@@ -125,7 +125,28 @@ export default { ...@@ -125,7 +125,28 @@ export default {
return '--' return '--'
} }
return moment(time).format('YYYY-MM-DD HH:mm:ss') return moment(time).format('YYYY-MM-DD HH:mm:ss')
} },
getName(value) {
if (!value.length) {
return '--'
}
let arr = []
value.forEach(item => {
arr.push(item.goodsName)
})
return arr.join('/')
},
getNum(value) {
if (!value.length) {
return '0'
}
let num = 0
value.forEach(item => {
num += item.inboundNum
})
return num
},
}, },
methods: { methods: {
handleResetSearch() { handleResetSearch() {
...@@ -153,10 +174,10 @@ export default { ...@@ -153,10 +174,10 @@ export default {
this.listLoading = true this.listLoading = true
//请求数据 //请求数据
console.log('listQuery', this.listQuery) console.log('listQuery', this.listQuery)
if(this.$store.getters.type == 2){ // if(this.$store.getters.type == 2){
this.listQuery.stockRoomId = this.$store.getters.stockRoomId // this.listQuery.stockRoomId = this.$store.getters.stockRoomId
} // }
getInboundRecordList(this.listQuery).then(res => { getInBoundList(this.listQuery).then(res => {
this.listLoading = false this.listLoading = false
this.list = res.data.list this.list = res.data.list
this.total = res.data.total this.total = res.data.total
...@@ -165,8 +186,27 @@ export default { ...@@ -165,8 +186,27 @@ export default {
}) })
}, },
// 查看 // 查看
handleView(id) { handleView(row) {
this.$refs.detail.init() this.$refs.detail.init(row)
},
// 导出
exportEntry(row) {
if (!row.vorList.length) {
this.$message.warning('没有可生成的入库单')
}
require.ensure([], () => {
let { exportJsonToExcel } = require('../../../static/Export2Excel')
// 表头
let tHeader = ['物品名称', '型号', '物品类别', '数量', '价格（元）', '供应商']
//表头对应字段名，要和下面数据key对应
let filterVal = ['goodsName', 'goodsNo', 'categoryName', 'inboundNum', 'prict', 'supplierName']
let data = this.formatJson(filterVal, row.vorList) //数据格式化
exportJsonToExcel(tHeader, data, '入库单') //导出文件
})
},
// 数据格式化
formatJson(filterVal, jsonData) {
return jsonData.map(v => filterVal.map(j => v[j]))
} }
} }
} }
......
src/views/inv/StoreList.vue
...@@ -64,8 +64,8 @@ ...@@ -64,8 +64,8 @@
shadow="never"> shadow="never">
<el-row type="flex" class="btn-groups" justify="end"> <el-row type="flex" class="btn-groups" justify="end">
<el-button type="primary" @click="handleAdd">新增</el-button> <el-button type="primary" @click="handleAdd">新增</el-button>
<el-button type="success" @click="handleAdd">扫码入库</el-button> <el-button type="success" @click="handleScanPut">扫码入库</el-button>
<el-button type="info" @click="handleAdd">扫码出库</el-button> <el-button type="info" @click="handleScanOut">扫码出库</el-button>
<el-button type="warning" @click="handleImport">导入</el-button> <el-button type="warning" @click="handleImport">导入</el-button>
</el-row> </el-row>
<div class="table-container"> <div class="table-container">
...@@ -130,6 +130,8 @@ ...@@ -130,6 +130,8 @@
<!-- 弹窗--> <!-- 弹窗-->
<add-goods-modal ref="addGoods" @ok="getList"></add-goods-modal> <add-goods-modal ref="addGoods" @ok="getList"></add-goods-modal>
<import-goods-modal ref="importGoods" @ok="getList"></import-goods-modal> <import-goods-modal ref="importGoods" @ok="getList"></import-goods-modal>
<scan-put-storage ref="scanPut" @ok="getList"></scan-put-storage>
<scan-out-storage ref="scanOut" @ok="getList"></scan-out-storage>
</div> </div>
</template> </template>
<script> <script>
...@@ -138,6 +140,8 @@ import { getGoodsList,getGoodsCategoryList,getStockRooms, editGoods } from '@/ap ...@@ -138,6 +140,8 @@ import { getGoodsList,getGoodsCategoryList,getStockRooms, editGoods } from '@/ap
import {getSuppliersList} from '@/api/supplier' import {getSuppliersList} from '@/api/supplier'
import AddGoodsModal from './modules/addGoodsModal' import AddGoodsModal from './modules/addGoodsModal'
import ImportGoodsModal from './modules/importGoodsModal' import ImportGoodsModal from './modules/importGoodsModal'
import ScanPutStorage from './modules/scanPutStorage'
import ScanOutStorage from './modules/scanOutStorage'
// 列表查询参数默认值 // 列表查询参数默认值
const defaultListQuery = { const defaultListQuery = {
pageNum: 1, pageNum: 1,
...@@ -151,8 +155,10 @@ const defaultListQuery = { ...@@ -151,8 +155,10 @@ const defaultListQuery = {
export default { export default {
name: 'StoreList', name: 'StoreList',
components: { components: {
ScanOutStorage,
AddGoodsModal, AddGoodsModal,
ImportGoodsModal ImportGoodsModal,
ScanPutStorage
}, },
data() { data() {
return { return {
...@@ -252,6 +258,13 @@ export default { ...@@ -252,6 +258,13 @@ export default {
handleAdd(){ handleAdd(){
this.$refs.addGoods.add() this.$refs.addGoods.add()
}, },
// 扫码入库
handleScanPut(){
this.$refs.scanPut.add()
},
handleScanOut(){
this.$refs.scanOut.add()
},
// 导入 // 导入
handleImport(){ handleImport(){
this.$refs.importGoods.add() this.$refs.importGoods.add()
......
src/views/inv/WarehouseAdmin.vue
...@@ -79,7 +79,7 @@ ...@@ -79,7 +79,7 @@
</el-table-column> </el-table-column>
<el-table-column label="物品类别" <el-table-column label="物品类别"
align="center"> align="center">
<template slot-scope="scope">{{scope.row.goodsCategoryName}}</template> <template slot-scope="scope">{{scope.row.categoryName}}</template>
</el-table-column> </el-table-column>
<el-table-column label="数量" <el-table-column label="数量"
align="center"> align="center">
......
src/views/inv/modules/addGoodsModal.vue
...@@ -272,6 +272,10 @@ export default { ...@@ -272,6 +272,10 @@ export default {
// row.isOK = !row.isOK // row.isOK = !row.isOK
// }, // },
submit(formName) { submit(formName) {
if(!this.formData.tableData.length){
this.$message.warning('请检查必填项')
return
}
this.$refs[formName].validate((valid) => { this.$refs[formName].validate((valid) => {
if (valid) { if (valid) {
let data = this.formData.tableData let data = this.formData.tableData
......
src/views/inv/modules/importGoodsModal.vue
...@@ -343,6 +343,10 @@ export default { ...@@ -343,6 +343,10 @@ export default {
// console.log('this.formData.tableData',this.formData.tableData) // console.log('this.formData.tableData',this.formData.tableData)
// }, // },
submit(formName) { submit(formName) {
if(!this.formData.tableData.length){
this.$message.warning('请检查必填项')
return
}
this.$refs[formName].validate((valid) => { this.$refs[formName].validate((valid) => {
if (valid) { if (valid) {
addGoodList({ vankeGoodsList: this.formData.tableData }).then(res => { addGoodList({ vankeGoodsList: this.formData.tableData }).then(res => {
...@@ -462,6 +466,9 @@ export default { ...@@ -462,6 +466,9 @@ export default {
isExist === -1 && (rowTable.stockRoomId = null) isExist === -1 && (rowTable.stockRoomId = null)
isExist !== -1 && (rowTable.stockRoomId = this.depotOptions[isExist].id) isExist !== -1 && (rowTable.stockRoomId = this.depotOptions[isExist].id)
} }
if(this.$store.getters.type == 2){
rowTable.stockRoomId = this.$store.getters.stockRoomId
}
if (sheet['物品名称']) { if (sheet['物品名称']) {
let isExist = this.goodsList.findIndex(item => let isExist = this.goodsList.findIndex(item =>
item.name === sheet['物品名称'] item.name === sheet['物品名称']
......
src/views/inv/modules/inventoryDetailsModal.vue
...@@ -10,27 +10,27 @@ ...@@ -10,27 +10,27 @@
:data="tableData" :data="tableData"
style="width: 100%"> style="width: 100%">
<el-table-column <el-table-column
prop="date" prop="goodsName"
label="物品名称"> label="物品名称">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="name" prop="goodsNo"
label="型号"> label="型号">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="address" prop="categoryName"
label="物品类别"> label="物品类别">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="address" prop="inboundNum"
label="数量"> label="数量">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="address" prop="prict"
label="价格（元）"> label="价格（元）">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="address" prop="supplierName"
label="供应商"> label="供应商">
</el-table-column> </el-table-column>
</el-table> </el-table>
...@@ -44,7 +44,6 @@ ...@@ -44,7 +44,6 @@
</el-dialog> </el-dialog>
</template> </template>
<script> <script>
import { addMember,updateMcht } from '@/api/inventory'
// 添加编辑属性 // 添加编辑属性
export default { export default {
...@@ -54,37 +53,16 @@ export default { ...@@ -54,37 +53,16 @@ export default {
visible: false, visible: false,
title: null, title: null,
loading: false, loading: false,
tableData: new Array(10).fill({ tableData: []
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
})
// tableData: [{
// date: '2016-05-02',
// name: '王小虎',
// address: '上海市普陀区金沙江路 1518 弄'
// }, {
// date: '2016-05-04',
// name: '王小虎',
// address: '上海市普陀区金沙江路 1517 弄'
// }, {
// date: '2016-05-01',
// name: '王小虎',
// address: '上海市普陀区金沙江路 1519 弄'
// }, {
// date: '2016-05-03',
// name: '王小虎',
// address: '上海市普陀区金沙江路 1516 弄'
// }]
} }
}, },
methods: { methods: {
init() { init(row) {
this.visible = true this.visible = true
this.tableData = row.vorList
this.$nextTick(() => { this.$nextTick(() => {
this.$refs.scrollContainer.scrollTop = 0 this.$refs.scrollContainer.scrollTop = 0
}) })
}, },
close() { close() {
this.visible = false this.visible = false
......
src/views/inv/modules/scanOutStorage.vue 0 → 100644
<template>
<el-dialog :visible.sync="visible"
:title="title"
center
width="1000px"
:close-on-click-modal="false">
<!-- start -->
<el-row type="flex" style="font-weight: bold;" v-if="JSON.stringify(userInfo)!= '{}'">
<el-col><p>申领人： <span>{{userInfo.name}}</span></p></el-col>
<el-col><p>所属部门：<span>{{userInfo.departName}}</span></p></el-col>
<el-col>
<p>员工编号：<span>{{userInfo.jobNo}}</span></p></el-col>
</el-row>
<el-row style="padding: 10px 0;text-align: left;" type="flex" :gutter="10">
<el-col :span="5">
<el-input size="medium" ref="barCodeInput" v-model="memberCode" @keyup.enter.native="changeQrCode"
placeholder="点击扫描员工二维码"></el-input>
</el-col>
<el-col :span="5">
<el-input size="medium" ref="barCodeInput" v-model="barCode" @keyup.enter.native="changeBarCode"
placeholder="点击扫描条形码"></el-input>
</el-col>
</el-row>
<div class="scroll-container no-bottom"
ref="scrollContainer">
<el-form :model="formData" ref="formData">
<el-table
:data="formData.tableData"
style="width: 100%"
:row-class-name="tableRowClassName"
>
<el-table-column prop="name" label="物品名称" align="left" style="justify-content: flex-start;">
<template slot-scope="scope">
<el-form-item size="mini" :prop="'tableData.' + scope.$index + '.name'"
:rules="[{required: true,trigger: 'change',message: '物品名称不能为空'}]">
<el-input v-if="scope.row.isOK" v-model="scope.row.name" class="input-width"
placeholder="物品名称"
:disabled="scope.row.id? true: false"></el-input>
<!-- <el-autocomplete-->
<!-- :maxlength="30"-->
<!-- class="input-width"-->
<!-- v-model="scope.row.name"-->
<!-- :fetch-suggestions="querySearch"-->
<!-- v-if="scope.row.isOK"-->
<!-- placeholder="物品名称"-->
<!-- @select="handleSelect(scope.$index,scope.row)"-->
<!-- ></el-autocomplete>-->
<span v-else>{{scope.row.name}}</span>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="型号">
<template slot-scope="scope">
<el-form-item size="mini" :prop="'tableData.' + scope.$index + '.goodsNo'"
:rules="[{required: true,trigger: 'blur',message: '型号不能为空'}]">
<el-input v-if="scope.row.isOK" v-model="scope.row.goodsNo" class="input-width"
placeholder="型号"
:disabled="scope.row.id? true: false"></el-input>
<span v-else>{{scope.row.goodsNo}}</span>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="条形码">
<template slot-scope="scope">
<el-form-item size="mini" :prop="'tableData.' + scope.$index + '.barCode'"
:rules="[{required: true,trigger: 'blur',message: '条形码不能为空'}]">
<el-input v-if="scope.row.isOK" v-model="scope.row.barCode" class="input-width"
placeholder="条形码"
disabled></el-input>
<span v-else>{{scope.row.barCode}}</span>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="物品类别">
<template slot-scope="scope">
<el-form-item size="mini" :prop="'tableData.' + scope.$index + '.goodsCategoryId'"
:rules="[{required: true,trigger: 'change',message: '类别不能为空'}]">
<el-select v-if="scope.row.isOK" v-model="scope.row.goodsCategoryId"
class="input-width"
clearable
placeholder="物品类别"
:disabled="scope.row.id? true: false">
<el-option v-for="item in categoryOptions"
:key="item.id"
:label="item.name"
:value="item.id"></el-option>
</el-select>
<span v-else>{{getName(scope.row.goodsCategoryId, categoryOptions)}}</span>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="数量">
<template slot-scope="scope">
<el-form-item size="mini" :prop="'tableData.' + scope.$index + '.goodsNum'"
:rules="[{validator: validateNum,trigger: 'blur'}]">
<!-- <el-input v-if="scope.row.isOK" v-model="scope.row.goodsNum" class="input-width"-->
<!-- placeholder="数量"></el-input>-->
<el-input-number v-if="scope.row.isOK" class="input-width" v-model="scope.row.goodsNum" :min="1" :max="scope.row.maxNum" label="数量"></el-input-number>
<span v-else>{{scope.row.goodsNum}}</span>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="价格（元）">
<template slot-scope="scope">
<el-form-item size="mini" :prop="'tableData.' + scope.$index + '.prict'"
:rules="[{validator: validatePrice,trigger: 'blur'}]">
<el-input v-if="scope.row.isOK" v-model="scope.row.prict" class="input-width"
placeholder="价格"
:disabled="scope.row.id? true: false"></el-input>
<span v-else>{{scope.row.prict}}</span>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="供应商">
<template slot-scope="scope">
<el-form-item size="mini" :prop="'tableData.' + scope.$index + '.supplierId'"
:rules="[{required: true,trigger: 'change',message: '供应商不能为空'}]">
<el-select v-if="scope.row.isOK" v-model="scope.row.supplierId"
class="input-width"
clearable
placeholder="供应商"
:disabled="scope.row.id? true: false">
<el-option v-for="item in supplierOptions"
:key="item.id"
:label="item.supplierName"
:value="item.id"></el-option>
</el-select>
<span v-else>{{getName(scope.row.supplierId, supplierOptions,1)}}</span>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="库房">
<template slot-scope="scope">
<el-form-item size="mini" :prop="'tableData.' + scope.$index + '.stockRoomId'"
:rules="[{required: true,trigger: 'change',message: '库房不能为空'}]">
<el-select v-if="scope.row.isOK" v-model="scope.row.stockRoomId"
class="input-width"
clearable
placeholder="库房"
:disabled="scope.row.id || ($store.getters.type == 2)? true: false">
<el-option v-for="item in depotOptions"
:key="item.id"
:label="item.name"
:value="item.id"></el-option>
</el-select>
<span v-else>{{getName(scope.row.stockRoomId, depotOptions)}}</span>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="操作"
align="center"
width="50">
<template slot-scope="scope">
<el-link type="danger" :underline="false" @click="handleDelete(scope.$index)">删除</el-link>
<!-- <el-button type="danger" size="small" @click="handleDelete(scope.$index)">删除</el-button>-->
</template>
</el-table-column>
</el-table>
</el-form>
</div>
<div slot="footer">
<el-button type="primary"
@click="submit('formData')">确认
</el-button>
<el-button
@click="close">返回
</el-button>
</div>
<!-- end -->
</el-dialog>
</template>
<script>
import {
getGoodsCategoryList,
outGoods,
getStockRooms,
getGoodsList,
getGoodsDetail,
checkQcode,
getMemberInfo
} from '@/api/inventory'
import { getSuppliersList } from '@/api/supplier'
// 添加编辑属性
export default {
name: 'scanOutStorage',
data() {
var validatePrice = (rule, value, callback) => {
if (value === '') {
callback(new Error('价格不能为空'))
} else {
let priceReg = /^[0-9]+(.[0-9]{2})?$/
if (!priceReg.test(value)) {
callback(new Error('价格不符合要求'))
}
callback()
}
}
var validateNum = (rule, value, callback) => {
if (value === '') {
callback(new Error('数量不能为空'))
} else {
let myReg = /^\d{1,}$/
if (!myReg.test(value)) {
callback(new Error('数量必须为正整数'))
}
callback()
}
}
return {
validatePrice: validatePrice,
validateNum: validateNum,
visible: false,
title: null,
loading: false,
formData: {
tableData: [],
},
categoryOptions: [],
supplierOptions: [],
depotOptions: [],
goodsList: [],
barCode: null,
memberCode: null,
userInfo: {}
}
},
// created(){
// window.onload = () => {
// do something
// }
// },
methods: {
handleScan() {
this.$refs['barCodeInput'].focus()
},
// 物品类别
getGoodsCategoryList() {
getGoodsCategoryList().then(res => {
this.categoryOptions = res.data.list
})
},
// 供应商
getSuppliersList() {
getSuppliersList().then(res => {
this.supplierOptions = res.data.list
})
},
// 库房
getStockRooms() {
getStockRooms().then(res => {
this.depotOptions = res.data.list
})
},
// 物品
getGoodsList() {
console.log(12121212)
getGoodsList().then(res => {
for (var i of res.data.list) {
i.value = i.name
}
this.goodsList = res.data.list
})
},
init() {
this.getGoodsList()
this.getGoodsCategoryList()
this.getSuppliersList()
this.getStockRooms()
this.formData.tableData = []
this.$nextTick(() => {
this.$refs.scrollContainer.scrollTop = 0
})
},
add() {
this.init()
this.title = '扫码出库'
this.visible = true
},
close() {
this.visible = false
},
// handleAdd() {
// // for (var i of this.formData.tableData) {
// // i.isOK = false
// // }
// this.formData.tableData.push({
// name: '',
// goodsNo: '',
// goodsNum: '',
// prict: '',
// supplierId: '',
// goodsCategoryId: '',
// stockRoomId: this.$store.getters.stockRoomId,
// barCode: '',
// isOK: true
// },)
// },
tableRowClassName({ row, rowIndex }) {
// 把每一行的索引放进row
row.index = rowIndex
},
// dbclick(row, event, column) {
// for (var i of this.formData.tableData) {
// i.isOK = false
// }
// row.isOK = !row.isOK
// },
submit(formName) {
if(!this.userInfo.id){
this.$message.warning('请扫描员工二维码')
return
}
if (!this.formData.tableData.length) {
this.$message.warning('请检查必填项')
return
}
this.$refs[formName].validate((valid) => {
if (valid) {
console.log("id",this.$store.getters)
let data = this.formData.tableData
outGoods({
memberId: this.userInfo.id,
outMemberId: this.$store.getters.memberId,
vankeGoodsDtoList: this.formData.tableData
}).then(res => {
this.$emit('ok')
this.visible = false
})
} else {
this.$message.warning('请检查必填项')
}
})
},
// 删除
handleDelete(index) {
this.formData.tableData.splice(index, 1)
},
// 获取名称
getName(id, arr, type) {
if (!id) {
return ''
}
let name = null
console.log('arr,id', arr, id)
if (type) {
name = arr.filter(item => item.id == id)[0].supplierName
} else {
name = arr.filter(item => item.id == id)[0].name
}
return name
},
querySearch(queryString, cb) {
var goodsList = this.goodsList
var results = queryString ? goodsList.filter(this.createFilter(queryString)) : goodsList
// 调用 callback 返回建议列表的数据
cb(results)
},
createFilter(queryString) {
return (restaurant) => {
return (restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0)
}
},
handleSelect(index, row) {
let item = this.goodsList.filter(good => good.name === row.name)[0]
this.formData.tableData[index].id = item.id
this.formData.tableData[index].goodsNo = item.goodsNo
this.formData.tableData[index].barCode = item.barCode
this.formData.tableData[index].stockRoomId = item.stockRoomId
this.formData.tableData[index].prict = item.prict
this.formData.tableData[index].supplierId = item.supplierId
this.formData.tableData[index].goodsCategoryId = item.goodsCategoryId
console.log('item', item)
},
// 改变扫码枪
changeQrCode() {
// let data = {"onlyId":"c7535c6f80d345b5b7e513c98993499a","memberId":"36"}
const data = JSON.parse(this.memberCode)
checkQcode(data).then(res => {
console.log('校验结果', res)
getMemberInfo({ memberId: data.memberId }).then(res => {
console.log('userId', res)
this.userInfo = res.data
})
})
this.memberCode = null
},
// 改变barcode
changeBarCode(value) {
getGoodsDetail({
barCode: this.barCode,
stockRoomId: this.$store.getters.type == 2 ? this.$store.getters.stockRoomId : null
}).then(res => {
if (!res.data) {
this.$message.warning('该物品暂未入库')
return
}
let data = res.data
let params = {
id: data.id,
barCode: data.barCode,
name: data.name,
stockRoomId: data.stockRoomId,
prict: data.prict,
goodsNo: data.goodsNo,
supplierId: data.supplierId,
goodsCategoryId: data.goodsCategoryId,
goodsNum: 1,
isOK: true,
maxNum: data.goodsNum
}
let isExist = this.formData.tableData.findIndex(item =>
item.id === data.id
)
if (isExist === -1) {
this.formData.tableData.push(params)
} else {
this.formData.tableData[isExist].goodsNum = this.formData.tableData[isExist].goodsNum + 1
}
console.log('要出库的商品', this.formData.tableData)
})
this.barCode = ''
}
}
}
</script>
<style scoped>
.info {
background: #ffffff;
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
}
.info p {
width: 40%;
padding: 10px 0 10px 20px;
line-height: 18px;
color: #999999;
text-align: left;
}
.info span {
color: #020202;
}
.scroll-container {
max-height: 50vh;
overflow: hidden;
overflow-y: auto;
}
.input-width {
width: 100px;
}
</style>
<style>
.no-bottom .el-form-item--mini.el-form-item, .el-form-item--small.el-form-item {
margin-bottom: 0;
}
.no-bottom .el-form-item__error {
position: relative;
top: 0;
margin: 5px 0;
}
.no-bottom .el-table th, .el-table td {
vertical-align: top;
}
</style>
src/views/inv/modules/scanPutStorage.vue 0 → 100644
<template>
<el-dialog :visible.sync="visible"
:title="title"
center
width="1000px"
:close-on-click-modal="false">
<!-- start -->
<el-row style="padding: 10px 0;text-align: left;">
<!-- <el-col span="4"> <el-button type="primary" size="medium" @click="handleScan">扫描条形码</el-button></el-col>-->
<el-input size="medium" ref="barCodeInput" v-model="barCode" @keyup.enter.native="changeBarCode"
placeholder="点击扫描条形码" style="width: 300px;"></el-input>
</el-row>
<div class="scroll-container no-bottom"
ref="scrollContainer">
<el-form :model="formData" ref="formData">
<el-table
:data="formData.tableData"
style="width: 100%"
:row-class-name="tableRowClassName"
>
<el-table-column prop="name" label="物品名称" align="left" style="justify-content: flex-start;">
<template slot-scope="scope">
<el-form-item size="mini" :prop="'tableData.' + scope.$index + '.name'"
:rules="[{required: true,trigger: 'change',message: '物品名称不能为空'}]">
<el-input v-if="scope.row.isOK" v-model="scope.row.name" class="input-width"
placeholder="物品名称"
:disabled="scope.row.id? true: false"></el-input>
<!-- <el-autocomplete-->
<!-- :maxlength="30"-->
<!-- class="input-width"-->
<!-- v-model="scope.row.name"-->
<!-- :fetch-suggestions="querySearch"-->
<!-- v-if="scope.row.isOK"-->
<!-- placeholder="物品名称"-->
<!-- @select="handleSelect(scope.$index,scope.row)"-->
<!-- ></el-autocomplete>-->
<span v-else>{{scope.row.name}}</span>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="型号">
<template slot-scope="scope">
<el-form-item size="mini" :prop="'tableData.' + scope.$index + '.goodsNo'"
:rules="[{required: true,trigger: 'blur',message: '型号不能为空'}]">
<el-input v-if="scope.row.isOK" v-model="scope.row.goodsNo" class="input-width"
placeholder="型号"
:disabled="scope.row.id? true: false"></el-input>
<span v-else>{{scope.row.goodsNo}}</span>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="条形码">
<template slot-scope="scope">
<el-form-item size="mini" :prop="'tableData.' + scope.$index + '.barCode'"
:rules="[{required: true,trigger: 'blur',message: '条形码不能为空'}]">
<el-input v-if="scope.row.isOK" v-model="scope.row.barCode" class="input-width"
placeholder="条形码"
disabled></el-input>
<span v-else>{{scope.row.barCode}}</span>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="物品类别">
<template slot-scope="scope">
<el-form-item size="mini" :prop="'tableData.' + scope.$index + '.goodsCategoryId'"
:rules="[{required: true,trigger: 'change',message: '类别不能为空'}]">
<el-select v-if="scope.row.isOK" v-model="scope.row.goodsCategoryId"
class="input-width"
clearable
placeholder="物品类别"
:disabled="scope.row.id? true: false">
<el-option v-for="item in categoryOptions"
:key="item.id"
:label="item.name"
:value="item.id"></el-option>
</el-select>
<span v-else>{{getName(scope.row.goodsCategoryId, categoryOptions)}}</span>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="数量">
<template slot-scope="scope">
<el-form-item size="mini" :prop="'tableData.' + scope.$index + '.goodsNum'"
:rules="[{validator: validateNum,trigger: 'blur'}]">
<el-input v-if="scope.row.isOK" v-model="scope.row.goodsNum" class="input-width"
placeholder="数量"></el-input>
<span v-else>{{scope.row.goodsNum}}</span>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="价格（元）">
<template slot-scope="scope">
<el-form-item size="mini" :prop="'tableData.' + scope.$index + '.prict'"
:rules="[{validator: validatePrice,trigger: 'blur'}]">
<el-input v-if="scope.row.isOK" v-model="scope.row.prict" class="input-width"
placeholder="价格"
:disabled="scope.row.id? true: false"></el-input>
<span v-else>{{scope.row.prict}}</span>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="供应商">
<template slot-scope="scope">
<el-form-item size="mini" :prop="'tableData.' + scope.$index + '.supplierId'"
:rules="[{required: true,trigger: 'change',message: '供应商不能为空'}]">
<el-select v-if="scope.row.isOK" v-model="scope.row.supplierId"
class="input-width"
clearable
placeholder="供应商"
:disabled="scope.row.id? true: false">
<el-option v-for="item in supplierOptions"
:key="item.id"
:label="item.supplierName"
:value="item.id"></el-option>
</el-select>
<span v-else>{{getName(scope.row.supplierId, supplierOptions,1)}}</span>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="库房">
<template slot-scope="scope">
<el-form-item size="mini" :prop="'tableData.' + scope.$index + '.stockRoomId'"
:rules="[{required: true,trigger: 'change',message: '库房不能为空'}]">
<el-select v-if="scope.row.isOK" v-model="scope.row.stockRoomId"
class="input-width"
clearable
placeholder="库房"
:disabled="scope.row.id || ($store.getters.type == 2)? true: false">
<el-option v-for="item in depotOptions"
:key="item.id"
:label="item.name"
:value="item.id"></el-option>
</el-select>
<span v-else>{{getName(scope.row.stockRoomId, depotOptions)}}</span>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="操作"
align="center"
width="50">
<template slot-scope="scope">
<el-link type="danger" :underline="false" @click="handleDelete(scope.$index)">删除</el-link>
<!-- <el-button type="danger" size="small" @click="handleDelete(scope.$index)">删除</el-button>-->
</template>
</el-table-column>
</el-table>
</el-form>
</div>
<div slot="footer">
<el-button type="primary"
@click="submit('formData')">确认
</el-button>
<el-button
@click="close">返回
</el-button>
</div>
<!-- end -->
</el-dialog>
</template>
<script>
import { getGoodsCategoryList, addGoodList, getStockRooms, getGoodsList, getGoodsDetail } from '@/api/inventory'
import { getSuppliersList } from '@/api/supplier'
// 添加编辑属性
export default {
name: 'scanPutStorage',
data() {
var validatePrice = (rule, value, callback) => {
if (value === '') {
callback(new Error('价格不能为空'))
} else {
let priceReg = /^[0-9]+(.[0-9]{2})?$/
if (!priceReg.test(value)) {
callback(new Error('价格不符合要求'))
}
callback()
}
}
var validateNum = (rule, value, callback) => {
if (value === '') {
callback(new Error('数量不能为空'))
} else {
let myReg = /^\d{1,}$/
if (!myReg.test(value)) {
callback(new Error('数量必须为正整数'))
}
callback()
}
}
return {
validatePrice: validatePrice,
validateNum: validateNum,
visible: false,
title: null,
loading: false,
formData: {
tableData: [],
},
categoryOptions: [],
supplierOptions: [],
depotOptions: [],
goodsList: [],
barCode: null
}
},
// created(){
// window.onload = () => {
// do something
// }
// },
methods: {
handleScan() {
this.$refs['barCodeInput'].focus()
},
// 物品类别
getGoodsCategoryList() {
getGoodsCategoryList().then(res => {
this.categoryOptions = res.data.list
})
},
// 供应商
getSuppliersList() {
getSuppliersList().then(res => {
this.supplierOptions = res.data.list
})
},
// 库房
getStockRooms() {
getStockRooms().then(res => {
this.depotOptions = res.data.list
})
},
// 物品
getGoodsList() {
console.log(12121212)
getGoodsList().then(res => {
for (var i of res.data.list) {
i.value = i.name
}
this.goodsList = res.data.list
})
},
init() {
this.getGoodsList()
this.getGoodsCategoryList()
this.getSuppliersList()
this.getStockRooms()
this.formData.tableData = []
this.$nextTick(() => {
this.$refs.scrollContainer.scrollTop = 0
})
},
add() {
this.init()
this.title = '扫码入库'
this.visible = true
},
close() {
this.visible = false
},
// handleAdd() {
// // for (var i of this.formData.tableData) {
// // i.isOK = false
// // }
// this.formData.tableData.push({
// name: '',
// goodsNo: '',
// goodsNum: '',
// prict: '',
// supplierId: '',
// goodsCategoryId: '',
// stockRoomId: this.$store.getters.stockRoomId,
// barCode: '',
// isOK: true
// },)
// },
tableRowClassName({ row, rowIndex }) {
// 把每一行的索引放进row
row.index = rowIndex
},
// dbclick(row, event, column) {
// for (var i of this.formData.tableData) {
// i.isOK = false
// }
// row.isOK = !row.isOK
// },
submit(formName) {
if(!this.formData.tableData.length){
this.$message.warning('请检查必填项')
return
}
this.$refs[formName].validate((valid) => {
if (valid) {
let data = this.formData.tableData
addGoodList({ vankeGoodsList: this.formData.tableData }).then(res => {
this.$emit('ok')
this.visible = false
})
} else {
this.$message.warning('请检查必填项')
}
})
},
// 删除
handleDelete(index) {
this.formData.tableData.splice(index, 1)
},
// 获取名称
getName(id, arr, type) {
if (!id) {
return ''
}
let name = null
console.log('arr,id', arr, id)
if (type) {
name = arr.filter(item => item.id == id)[0].supplierName
} else {
name = arr.filter(item => item.id == id)[0].name
}
return name
},
querySearch(queryString, cb) {
var goodsList = this.goodsList
var results = queryString ? goodsList.filter(this.createFilter(queryString)) : goodsList
// 调用 callback 返回建议列表的数据
cb(results)
},
createFilter(queryString) {
return (restaurant) => {
return (restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0)
}
},
handleSelect(index, row) {
let item = this.goodsList.filter(good => good.name === row.name)[0]
this.formData.tableData[index].id = item.id
this.formData.tableData[index].goodsNo = item.goodsNo
this.formData.tableData[index].barCode = item.barCode
this.formData.tableData[index].stockRoomId = item.stockRoomId
this.formData.tableData[index].prict = item.prict
this.formData.tableData[index].supplierId = item.supplierId
this.formData.tableData[index].goodsCategoryId = item.goodsCategoryId
console.log('item', item)
},
// 改变barcode
changeBarCode(value) {
console.log('value', value, this.barCode)
getGoodsDetail({
barCode: this.barCode,
stockRoomId: this.$store.getters.type == 2 ? this.$store.getters.stockRoomId : null
}).then(res => {
let stockRoomId = this.$store.getters.type == 2 ? this.$store.getters.stockRoomId : null
let data = res.data
let params = {
id: data ? data.id : null,
goodsNo: data ? data.goodsNo : null,
barCode: data ? data.barCode : this.barCode,
stockRoomId: data ? data.stockRoomId : stockRoomId,
prict: data ? data.prict : null,
supplierId: data ? data.supplierId : null,
goodsCategoryId: data ? data.goodsCategoryId : null,
name: data ? data.name : null,
goodsNum: 1,
isOK: true
}
let isExist = this.formData.tableData.findIndex(item =>
item.barCode === params.barCode
)
console.log('isExist', isExist)
if (isExist === -1) {
this.formData.tableData.push(params)
} else {
this.formData.tableData[isExist].goodsNum = this.formData.tableData[isExist].goodsNum + 1
// this.formData.tableData.splice(isExist,1,this.formData.tableData[isExist])
}
console.log('要出库的商品', this.formData.tableData)
this.barCode = ''
})
}
}
}
</script>
<style scoped>
.scroll-container {
max-height: 50vh;
overflow: hidden;
overflow-y: auto;
}
.input-width {
width: 100px;
}
</style>
<style>
.no-bottom .el-form-item--mini.el-form-item, .el-form-item--small.el-form-item {
margin-bottom: 0;
}
.no-bottom .el-form-item__error {
position: relative;
top: 0;
margin: 5px 0;
}
.no-bottom .el-table th, .el-table td {
vertical-align: top;
}
</style>
src/views/ums/menu/index.vue
...@@ -213,4 +213,7 @@ export default { ...@@ -213,4 +213,7 @@ export default {
</script> </script>
<style scoped> <style scoped>
.operate-container .btn-add {
float: none;
}
</style> </style>
src/views/use/AdminList.vue
...@@ -46,7 +46,7 @@ ...@@ -46,7 +46,7 @@
</el-table-column> </el-table-column>
<el-table-column label="AD用户" <el-table-column label="AD用户"
align="center"> align="center">
<template slot-scope="scope">{{scope.row.departName || '--'}}</template> <template slot-scope="scope">{{scope.row.jobNo || '--'}}</template>
</el-table-column> </el-table-column>
<el-table-column label="部门" <el-table-column label="部门"
align="center"> align="center">
......
src/views/use/UserList.vue
...@@ -95,15 +95,18 @@ ...@@ -95,15 +95,18 @@
<!-- end --> <!-- end -->
<!-- 弹窗 --> <!-- 弹窗 -->
<add-admin ref="addAdmin" <add-admin ref="addAdmin"
@ok="getList"></add-admin> @ok="getList"></add-admin>
<import-member-modal ref="importMember"
@ok="getList"></import-member-modal>
<!-- end --> <!-- end -->
</div> </div>
</template> </template>
<script> <script>
import moment from 'moment' import moment from 'moment'
import { getMemberList, getAuditDetail, updateMcht } from '@/api/user' import { getMemberList, getAuditDetail, updateMcht } from '@/api/user'
import { getDepartmentList} from '@/api/inventory' import { getDepartmentList } from '@/api/inventory'
import AddAdmin from './modules/AddAdmin' import AddAdmin from './modules/AddAdmin'
import ImportMemberModal from './modules/importMemberModal'
// 列表查询参数默认值 // 列表查询参数默认值
const defaultListQuery = { const defaultListQuery = {
pageNum: 1, pageNum: 1,
...@@ -115,7 +118,7 @@ const defaultListQuery = { ...@@ -115,7 +118,7 @@ const defaultListQuery = {
export default { export default {
name: 'UserList', name: 'UserList',
components: { AddAdmin }, components: { AddAdmin, ImportMemberModal },
data() { data() {
return { return {
departmentOptions: [], departmentOptions: [],
...@@ -177,13 +180,13 @@ export default { ...@@ -177,13 +180,13 @@ export default {
this.listLoading = false this.listLoading = false
}) })
}, },
// 添加管理员 // 导入用户
handleAdd() { handleAdd() {
this.$refs.addSupplier.add() this.$refs.importMember.add()
}, },
// 设置为管理员 // 设置为管理员
handleSet(row) { handleSet(row) {
this.$refs.addAdmin.add(row) this.$refs.addAdmin.add(row)
} }
} }
} }
......
src/views/use/modules/importMemberModal.vue 0 → 100644
<template>
<el-dialog :visible.sync="visible"
:title="title"
center
width="1000px"
:close-on-click-modal="false">
<!-- excel表格上传 -->
<el-upload
:auto-upload="false"
:on-change="elInFile"
:on-remove="remove"
ref="upload"
action="https://jsonplaceholder.typicode.com"
class="upload-demo"
accept=".xlsx, .xls">
<el-button slot="trigger" size="mini" type="primary" plain>选取文件</el-button>
<div slot="tip" class="el-upload__tip">只能选取Excel文件</div>
</el-upload>
<div class="scroll-container no-bottom"
ref="scrollContainer">
<el-form :model="formData" ref="formData">
<el-table
:data="formData.tableData"
style="width: 100%"
:row-class-name="tableRowClassName">
<el-table-column label="账号">
<template slot-scope="scope">
<el-form-item size="mini" :prop="'tableData.' + scope.$index + '.account'"
:rules="[{required: true,trigger: 'blur',message: '账号不能为空'}]">
<el-input v-if="scope.row.isOK" v-model="scope.row.account" class="input-width"
placeholder="账号"></el-input>
<span v-else>{{scope.row.account}}</span>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="用户名称">
<template slot-scope="scope">
<el-form-item size="mini" :prop="'tableData.' + scope.$index + '.username'"
:rules="[{required: true,trigger: 'blur',message: '用户名称不能为空'}]">
<el-input v-if="scope.row.isOK" v-model="scope.row.username" class="input-width"
placeholder="用户名称"></el-input>
<span v-else>{{scope.row.username}}</span>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="手机号">
<template slot-scope="scope">
<el-form-item size="mini" :prop="'tableData.' + scope.$index + '.mobile'"
:rules="[{required: true,trigger: 'blur',message: '手机号不能为空'}]">
<el-input v-if="scope.row.isOK" v-model="scope.row.mobile" class="input-width"
:maxlength="11"
placeholder="手机号"></el-input>
<span v-else>{{scope.row.mobile}}</span>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="员工编号">
<template slot-scope="scope">
<el-form-item size="mini" :prop="'tableData.' + scope.$index + '.jobNo'"
:rules="[{required: true,trigger: 'blur',message: '员工编号不能为空'}]">
<el-input v-if="scope.row.isOK" v-model="scope.row.jobNo" class="input-width"
placeholder="员工编号"></el-input>
<span v-else>{{scope.row.jobNo}}</span>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="部门名称">
<template slot-scope="scope">
<el-form-item size="mini" :prop="'tableData.' + scope.$index + '.department'"
:rules="[{required: true,trigger: 'blur',message: '部门名称不能为空'}]">
<el-input v-if="scope.row.isOK" v-model="scope.row.department" class="input-width"
placeholder="部门名称"></el-input>
<span v-else>{{scope.row.department}}</span>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="操作"
align="center"
width="50">
<template slot-scope="scope">
<el-link type="danger" :underline="false" @click="handleDelete(scope.$index)">删除</el-link>
<!-- <el-button type="danger" size="small" @click="handleDelete(scope.$index)">删除</el-button>-->
</template>
</el-table-column>
</el-table>
</el-form>
</div>
<div slot="footer">
<el-button type="primary"
@click="submit('formData')">确认
</el-button>
<el-button
@click="close">返回
</el-button>
</div>
<!-- end -->
</el-dialog>
</template>
<script>
import { importMember } from '@/api/user'
import XLSX from 'xlsx'
// 添加编辑属性
export default {
name: 'importMemberModal',
data() {
return {
files: null, //文件列表
visible: false,
title: null,
loading: false,
formData: {
tableData: [],
},
categoryOptions: [],
supplierOptions: [],
depotOptions: [],
goodsList: []
}
},
beforeCreate() {
/**
* 读取Excel文件，转为{@link Object}对象（自定义函数）
* @return {@link Object}：workbook，整个文档对象；
*/
FileReader.prototype.read2workbook = function () {
let redABS = false //是否将文件读取为二进制字符串
let bytes = new Uint8Array(this.result) //无符号整型数组
if (redABS) {
// let fix = new TextDecoder(encode || 'UTF-8').decode(bytes);
let fix = fixdata(bytes)
let b2a = btoa(fix) //js原生方法：将字符转为base64编码。对应的atob(base64)方法，将base64转字符
var wb = XLSX.read(b2a, {
type: 'base64'
})
} else {
let len = bytes.byteLength
let binarys = new Array(len) //创建定长数组，存储文本
for (let i = 0; i < len; i++)
binarys[i] = String.fromCharCode(bytes[i])
let binary = binarys.join('')
var wb = XLSX.read(binary, {
type: 'binary'
})
}
return wb //workbook
}
/**
* 解析为...格式
*/
FileReader.prototype.read2 = function (format = 'json') {
let wb = this.read2workbook()
if (!wb)
return null
let r = {}
let formats = ['json', 'formulae', 'html', 'txt', 'csv', 'dif', 'slk', 'eth'] //可被解析的格式
format = formats.indexOf(format) == -1 ? 'json' : format
wb.SheetNames.forEach(name => { //遍历每张纸数据
r[name] = XLSX.utils['sheet_to_' + format](wb.Sheets[name])
})
return r
}
/**
* 解析为JSON
* @description: 此解析方式，XLSX将使用表格首行的每列名称，当作sheet数组对象的Key。
* 故Excel每个工作表格的第一行必须有表头，且名称不可重复。
*/
FileReader.prototype.read2JS = function () {
return this.read2()
}
/* 重写readAsBinaryString函数 */
FileReader.prototype.readAsBinaryString = function (f) {
if (!this.onload) //如果this未重写onload函数，则创建一个公共处理方式
this.onload = e => { //在this.onload函数中，完成公共处理
let rs = this.read2workbook()
}
this.readAsArrayBuffer(f) //内部会回调this.onload方法
}
/**
* char值转String
* @param data {@link Array}：char值；
* @return {@link String}
*/
function fixdata(data) {
let w = 1024 << 10 //每次读取1M字节
let len = Math.floor(data.byteLength / w)
let o = new Array(len)
for (var i = 0; i < len; i++)
o[i] = String.fromCharCode.apply(null, new Uint8Array(data.slice(i * w, (i + 1) * w)))
o[i] = String.fromCharCode.apply(null, new Uint8Array(data.slice(i * w)))
return o.join('')
}
},
methods: {
init() {
this.formData.tableData = []
this.$nextTick(() => {
this.$refs.scrollContainer.scrollTop = 0
})
},
add() {
this.init()
this.title = '导入用户'
this.visible = true
},
close() {
this.visible = false
},
tableRowClassName ({row, rowIndex}) {
// 把每一行的索引放进row
row.index = rowIndex;
},
// dbclick(row, event, column) {
// console.log('row, event, column',row, event, column)
// for (var i of this.formData.tableData) {
// i.isOK = false
// }
// row.isOK = !row.isOK
// this.formData.tableData.splice(row.index,1,row)
// console.log('this.formData.tableData',this.formData.tableData)
// },
submit(formName) {
if(!this.formData.tableData.length){
this.$message.warning('请检查必填项')
return
}
this.$refs[formName].validate((valid) => {
if (valid) {
importMember({ vimdList: this.formData.tableData }).then(res => {
this.$emit('ok')
this.visible = false
})
} else {
this.$message.warning('请检查必填项是否输入')
}
})
},
// 删除
handleDelete(index) {
this.formData.tableData.splice(index, 1)
},
//删除文件
remove() {
this.formData.tableData = []
},
/**
* input-file调用此函数时，默认传入"$event"
* @param e {@link Object}：$event事件对象；
*/
inFile(e) {
this.files = (e.target || e.srcElement).files //获取"input-file"的FileList对象
if (!this.files || !this.files.length)
return
for (let i = 0, len = this.files.length; i < len; i++)
this.read(this.files[i])
},
/**
* 文件状态改变时的钩子，添加文件、上传成功和上传失败时都会被调用。
* @param f {@link Object}：当前上传的文件；
* @param fs {@link Array}：当前文件列表；
*/
elInFile(f, fs) {
if (fs.length > 1) {
fs.splice(0, 1)
}
this.read(f.raw)
this.$nextTick(() => {
this.$refs.formData.clearValidate()
})
},
/**
* 解析
* @param f {@link File}
*/
read(f) {
let rd = new FileReader()
rd.onload = e => { //this.readAsArrayBuffer函数内，会回调this.onload函数。在这里处理结果
let sheetArray = rd.read2JS()
let tables = []
for (var sheet of sheetArray.Sheet1) {
let rowTable = {}
rowTable.isOK = true
rowTable.account = sheet['账号']
rowTable.department = sheet['部门名称']
rowTable.jobNo = sheet['员工编号']
rowTable.mobile = sheet['手机号']
rowTable.username = sheet['用户名称']
tables.push(rowTable)
this.formData.tableData = tables
}
}
rd.readAsBinaryString(f)
}
}
}
</script>
<style scoped>
.scroll-container {
max-height: 50vh;
overflow: hidden;
overflow-y: auto;
}
.input-width {
width: 120px;
}
.el-upload__tip {
color: #999;
font-size: 10px;
}
</style>
static/Blod.js 0 → 100644
/* eslint-disable */
/* Blob.js
* A Blob implementation.
* 2014-05-27
*
* By Eli Grey, http://eligrey.com
* By Devin Samarin, https://github.com/eboyjr
* License: X11/MIT
* See LICENSE.md
*/
/*global self, unescape */
/*jslint bitwise: true, regexp: true, confusion: true, es5: true, vars: true, white: true,
plusplus: true */
/*! @source http://purl.eligrey.com/github/Blob.js/blob/master/Blob.js */
(function (view) {
"use strict";
view.URL = view.URL || view.webkitURL;
if (view.Blob && view.URL) {
try {
new Blob;
return;
} catch (e) {}
}
// Internally we use a BlobBuilder implementation to base Blob off of
// in order to support older browsers that only have BlobBuilder
var BlobBuilder = view.BlobBuilder || view.WebKitBlobBuilder || view.MozBlobBuilder || (function(view) {
var
get_class = function(object) {
return Object.prototype.toString.call(object).match(/^\[object\s(.*)\]$/)[1];
}
, FakeBlobBuilder = function BlobBuilder() {
this.data = [];
}
, FakeBlob = function Blob(data, type, encoding) {
this.data = data;
this.size = data.length;
this.type = type;
this.encoding = encoding;
}
, FBB_proto = FakeBlobBuilder.prototype
, FB_proto = FakeBlob.prototype
, FileReaderSync = view.FileReaderSync
, FileException = function(type) {
this.code = this[this.name = type];
}
, file_ex_codes = (
"NOT_FOUND_ERR SECURITY_ERR ABORT_ERR NOT_READABLE_ERR ENCODING_ERR "
+ "NO_MODIFICATION_ALLOWED_ERR INVALID_STATE_ERR SYNTAX_ERR"
).split(" ")
, file_ex_code = file_ex_codes.length
, real_URL = view.URL || view.webkitURL || view
, real_create_object_URL = real_URL.createObjectURL
, real_revoke_object_URL = real_URL.revokeObjectURL
, URL = real_URL
, btoa = view.btoa
, atob = view.atob
, ArrayBuffer = view.ArrayBuffer
, Uint8Array = view.Uint8Array
;
FakeBlob.fake = FB_proto.fake = true;
while (file_ex_code--) {
FileException.prototype[file_ex_codes[file_ex_code]] = file_ex_code + 1;
}
if (!real_URL.createObjectURL) {
URL = view.URL = {};
}
URL.createObjectURL = function(blob) {
var
type = blob.type
, data_URI_header
;
if (type === null) {
type = "application/octet-stream";
}
if (blob instanceof FakeBlob) {
data_URI_header = "data:" + type;
if (blob.encoding === "base64") {
return data_URI_header + ";base64," + blob.data;
} else if (blob.encoding === "URI") {
return data_URI_header + "," + decodeURIComponent(blob.data);
} if (btoa) {
return data_URI_header + ";base64," + btoa(blob.data);
} else {
return data_URI_header + "," + encodeURIComponent(blob.data);
}
} else if (real_create_object_URL) {
return real_create_object_URL.call(real_URL, blob);
}
};
URL.revokeObjectURL = function(object_URL) {
if (object_URL.substring(0, 5) !== "data:" && real_revoke_object_URL) {
real_revoke_object_URL.call(real_URL, object_URL);
}
};
FBB_proto.append = function(data/*, endings*/) {
var bb = this.data;
// decode data to a binary string
if (Uint8Array && (data instanceof ArrayBuffer || data instanceof Uint8Array)) {
var
str = ""
, buf = new Uint8Array(data)
, i = 0
, buf_len = buf.length
;
for (; i < buf_len; i++) {
str += String.fromCharCode(buf[i]);
}
bb.push(str);
} else if (get_class(data) === "Blob" || get_class(data) === "File") {
if (FileReaderSync) {
var fr = new FileReaderSync;
bb.push(fr.readAsBinaryString(data));
} else {
// async FileReader won't work as BlobBuilder is sync
throw new FileException("NOT_READABLE_ERR");
}
} else if (data instanceof FakeBlob) {
if (data.encoding === "base64" && atob) {
bb.push(atob(data.data));
} else if (data.encoding === "URI") {
bb.push(decodeURIComponent(data.data));
} else if (data.encoding === "raw") {
bb.push(data.data);
}
} else {
if (typeof data !== "string") {
data += ""; // convert unsupported types to strings
}
// decode UTF-16 to binary string
bb.push(unescape(encodeURIComponent(data)));
}
};
FBB_proto.getBlob = function(type) {
if (!arguments.length) {
type = null;
}
return new FakeBlob(this.data.join(""), type, "raw");
};
FBB_proto.toString = function() {
return "[object BlobBuilder]";
};
FB_proto.slice = function(start, end, type) {
var args = arguments.length;
if (args < 3) {
type = null;
}
return new FakeBlob(
this.data.slice(start, args > 1 ? end : this.data.length)
, type
, this.encoding
);
};
FB_proto.toString = function() {
return "[object Blob]";
};
FB_proto.close = function() {
this.size = this.data.length = 0;
};
return FakeBlobBuilder;
}(view));
view.Blob = function Blob(blobParts, options) {
var type = options ? (options.type || "") : "";
var builder = new BlobBuilder();
if (blobParts) {
for (var i = 0, len = blobParts.length; i < len; i++) {
builder.append(blobParts[i]);
}
}
return builder.getBlob(type);
};
}(typeof self !== "undefined" && self || typeof window !== "undefined" && window || this.content || this));
static/Export2Excel.js 0 → 100644
/* eslint-disable */
require('script-loader!file-saver');
require('./Blod');
require('script-loader!xlsx/dist/xlsx.core.min');
function generateArray(table) {
var out = [];
var rows = table.querySelectorAll('tr');
var ranges = [];
for (var R = 0; R < rows.length; ++R) {
var outRow = [];
var row = rows[R];
var columns = row.querySelectorAll('td');
for (var C = 0; C < columns.length; ++C) {
var cell = columns[C];
var colspan = cell.getAttribute('colspan');
var rowspan = cell.getAttribute('rowspan');
var cellValue = cell.innerText;
if (cellValue !== "" && cellValue == +cellValue) cellValue = +cellValue;
//Skip ranges
ranges.forEach(function (range) {
if (R >= range.s.r && R <= range.e.r && outRow.length >= range.s.c && outRow.length <= range.e.c) {
for (var i = 0; i <= range.e.c - range.s.c; ++i) outRow.push(null);
}
});
//Handle Row Span
if (rowspan || colspan) {
rowspan = rowspan || 1;
colspan = colspan || 1;
ranges.push({s: {r: R, c: outRow.length}, e: {r: R + rowspan - 1, c: outRow.length + colspan - 1}});
}
;
//Handle Value
outRow.push(cellValue !== "" ? cellValue : null);
//Handle Colspan
if (colspan) for (var k = 0; k < colspan - 1; ++k) outRow.push(null);
}
out.push(outRow);
}
return [out, ranges];
};
function datenum(v, date1904) {
if (date1904) v += 1462;
var epoch = Date.parse(v);
return (epoch - new Date(Date.UTC(1899, 11, 30))) / (24 * 60 * 60 * 1000);
}
function sheet_from_array_of_arrays(data, opts) {
var ws = {};
var range = {s: {c: 10000000, r: 10000000}, e: {c: 0, r: 0}};
for (var R = 0; R != data.length; ++R) {
for (var C = 0; C != data[R].length; ++C) {
if (range.s.r > R) range.s.r = R;
if (range.s.c > C) range.s.c = C;
if (range.e.r < R) range.e.r = R;
if (range.e.c < C) range.e.c = C;
var cell = {v: data[R][C]};
if (cell.v == null) continue;
var cell_ref = XLSX.utils.encode_cell({c: C, r: R});
if (typeof cell.v === 'number') cell.t = 'n';
else if (typeof cell.v === 'boolean') cell.t = 'b';
else if (cell.v instanceof Date) {
cell.t = 'n';
cell.z = XLSX.SSF._table[14];
cell.v = datenum(cell.v);
}
else cell.t = 's';
ws[cell_ref] = cell;
}
}
if (range.s.c < 10000000) ws['!ref'] = XLSX.utils.encode_range(range);
return ws;
}
function Workbook() {
if (!(this instanceof Workbook)) return new Workbook();
this.SheetNames = [];
this.Sheets = {};
}
function s2ab(s) {
var buf = new ArrayBuffer(s.length);
var view = new Uint8Array(buf);
for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
return buf;
}
export function export_table_to_excel(id) {
var theTable = document.getElementById(id);
console.log('a')
var oo = generateArray(theTable);
var ranges = oo[1];
/* original data */
var data = oo[0];
var ws_name = "SheetJS";
console.log(data);
var wb = new Workbook(), ws = sheet_from_array_of_arrays(data);
/* add ranges to worksheet */
// ws['!cols'] = ['apple', 'banan'];
ws['!merges'] = ranges;
/* add worksheet to workbook */
wb.SheetNames.push(ws_name);
wb.Sheets[ws_name] = ws;
var wbout = XLSX.write(wb, {bookType: 'xlsx', bookSST: false, type: 'binary'});
saveAs(new Blob([s2ab(wbout)], {type: "application/octet-stream"}), "test.xlsx")
}
function formatJson(jsonData) {
console.log(jsonData)
}
export function exportJsonToExcel(th, jsonData, defaultTitle) {
/* original data */
var data = jsonData;
data.unshift(th);
var ws_name = "SheetJS";
var wb = new Workbook(), ws = sheet_from_array_of_arrays(data);
/* add worksheet to workbook */
wb.SheetNames.push(ws_name);
wb.Sheets[ws_name] = ws;
var wbout = XLSX.write(wb, {bookType: 'xlsx', bookSST: false, type: 'binary'});
var title = defaultTitle || '列表'
saveAs(new Blob([s2ab(wbout)], {type: "application/octet-stream"}), title + ".xlsx")
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment