Skip to content

F
filemanage
Commit 8699b5ea by wangyalan-git
Options

用户管理，文档管理模块，首页

parent b69dc7ab
Showing with 336 additions and 2054 deletions
index.html
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" /> <meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="icon" href="static/favicon.ico" /> <link rel="icon" href="static/favicon.ico" />
<title>万科物资管理平台</title> <title>万科文档库平台管理后台</title>
<style> <style>
html, html,
body, body,
...@@ -245,7 +245,7 @@ ...@@ -245,7 +245,7 @@
<div class="loader-section section-left"></div> <div class="loader-section section-left"></div>
<div class="loader-section section-right"></div> <div class="loader-section section-right"></div>
<div class="load_title"> <div class="load_title">
正在加载 万科物资管理平台 请耐心等待 正在加载 万科文档库平台管理后台 请耐心等待
</div> </div>
</div> </div>
</div> </div>
......
src/api/home.js 0 → 100644
// 首页
import request from '@/utils/request'
// 万科后台_获取首页统计今日数据
export function getHomeData (params) {
return request({
url: 'vankeStatisticalChart/getHomeData',
method: 'post',
params: params
})
}
// 万科后台_获取首页入库物品类别分布
export function selectInBoundByCategory(data) {
return request({
url: 'vankeStatisticalChart/selectInBoundByCategory',
method: 'post',
data
})
}
// 万科后台_获取首页领取物品类别分布
export function selectOutBoundByCategory(data) {
return request({
url: 'vankeStatisticalChart/selectOutBoundByCategory',
method: 'post',
data
})
}
// 万科后台_获取首页申领人部门分布
export function selectOutBoundByDepartId(data) {
return request({
url: 'vankeStatisticalChart/selectOutBoundByDepartId',
method: 'post',
data
})
}
// 万科后台_获取首页统计出库值和入库值的变化曲线图
export function selectStockByGoodsIdAndTime(data) {
return request({
url: 'vankeStatisticalChart/selectStockByGoodsIdAndTime',
method: 'post',
data
})
}
src/router/index.js
...@@ -35,130 +35,23 @@ export const constantRouterMap = [ ...@@ -35,130 +35,23 @@ export const constantRouterMap = [
}] }]
export const asyncRouterMap = [ export const asyncRouterMap = [
// 库存模块 // 文档
{ {
path: '/inv', path: '/doc',
component: Layout, component: Layout,
redirect: '/inv/stockAdmin', redirect: '/doc/docList',
name: 'inv', name: 'doc',
meta: { title: '库存管理', icon: 'sms-subject' }, meta: { title: '文档管理', icon: 'sms-subject' },
children: [{ children: [{
path: 'stockAdmin', path: 'docList',
name: 'stockAdmin', name: 'docList',
component: () => import('@/views/inv/stockAdmin'), component: () => import('@/views/doc/DocList'),
meta: { title: '入库管理', icon: 'product-list' }, meta: { title: '文档列表', icon: 'product-list' }
}, },{
{ path: 'docType',
path: 'warehouseAdmin', name: 'docType',
name: 'warehouseAdmin', component: () => import('@/views/doc/DocType'),
component: () => import('@/views/inv/warehouseAdmin'), meta: { title: '文档类型', icon: 'product-list' }
meta: { title: '出库管理', icon: 'product-list' },
},
{
path: 'storeList',
name: 'storeList',
component: () => import('@/views/inv/StoreList'),
meta: { title: '库存清单', icon: 'product-cate' }
},
{
path: 'goodsCategory',
name: 'goodsCategory',
component: () => import('@/views/inv/GoodsCateogory'),
meta: { title: '物品类别', icon: 'product-cate' }
}, {
path: 'depotAdmin',
name: 'depotAdmin',
component: () => import('@/views/inv/DepotAdmin'),
meta: { title: '库房管理', icon: 'product-cate' }
}]
},
// 供应商模块
{
path: '/ssm',
component: Layout,
redirect: '/ssm/supplierShopList',
name: 'ssm',
meta: { title: '供应商', icon: 'sms-subject' },
children: [{
path: 'supplierList',
name: 'supplierList',
component: () => import('@/views/ssm/SupplierList'),
meta: { title: '供应商列表', icon: 'product-list' },
}]
},
// 报表管理
{
path: '/sta',
component: Layout,
redirect: '/sta/inventoryChart',
name: 'sta',
meta: { title: '报表管理', icon: 'sms-subject' },
children: [{
path: 'inventoryChart',
name: 'inventoryChart',
component: () => import('@/views/sta/InventoryChart'),
meta: { title: '库存情况', icon: 'product-list' },
},
{
path: 'recipients',
name: 'recipients',
component: () => import('@/views/sta/Recipients'),
meta: { title: '领用情况', icon: 'product-list' },
}]
},
// 部门管理
{
path: '/dep',
component: Layout,
redirect: '/dep/departmentList',
name: 'dep',
meta: { title: '部门管理', icon: 'sms-subject' },
children: [{
path: 'departmentList',
name: 'departmentList',
component: () => import('@/views/dep/DepartmentList'),
meta: { title: '部门列表', icon: 'product-list' }
}]
},
// 管理员
{
path: '/use',
component: Layout,
redirect: '/use/adminList',
name: 'use',
meta: { title: '用户管理', icon: 'product-list' },
children: [{
path: 'adminList',
name: 'adminList',
component: () => import('@/views/use/AdminList'),
meta: { title: '管理员列表', icon: 'product-list' },
},
{
path: 'userList',
name: 'userList',
component: () => import('@/views/use/UserList'),
meta: { title: '用户列表', icon: 'product-cate' }
}]
},
{
path: '/set',
component: Layout,
redirect: '/set/log',
name: 'set',
meta: { title: '系统设置', icon: 'product-list' },
children: [
{
path: 'log',
name: 'log',
component: () => import('@/views/set/log'),
meta: { title: '操作日志', icon: 'ums-role' },
hidden: false
},
{
path: 'setting',
name: 'setting',
component: () => import('@/views/set/setting'),
meta: { title: '配置管理', icon: 'product-list' },
}] }]
}, },
// 权限模块 // 权限模块
...@@ -169,12 +62,12 @@ export const asyncRouterMap = [ ...@@ -169,12 +62,12 @@ export const asyncRouterMap = [
name: 'ums', name: 'ums',
meta: { title: '权限', icon: 'ums' }, meta: { title: '权限', icon: 'ums' },
children: [ children: [
// { {
// path: 'admin', path: 'admin',
// name: 'admin', name: 'admin',
// component: () => import('@/views/ums/admin/index'), component: () => import('@/views/ums/admin/index'),
// meta: { title: '用户列表', icon: 'ums-admin' } meta: { title: '用户列表', icon: 'ums-admin' }
// }, },
{ {
path: 'role', path: 'role',
name: 'role', name: 'role',
......
src/views/inv/StockAdmin.vue → src/views/doc/DocList.vue
...@@ -6,10 +6,10 @@ ...@@ -6,10 +6,10 @@
<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.name"
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"
...@@ -27,6 +27,9 @@ ...@@ -27,6 +27,9 @@
<!-- 表格栏 --> <!-- 表格栏 -->
<el-card class="filter-container mt15" <el-card class="filter-container mt15"
shadow="never"> shadow="never">
<el-row type="flex" class="btn-groups" >
<el-button type="primary" @click="handleImport">上传</el-button>
</el-row>
<div class="table-container"> <div class="table-container">
<el-table :data="list" <el-table :data="list"
v-loading="listLoading" v-loading="listLoading"
...@@ -35,39 +38,32 @@ ...@@ -35,39 +38,32 @@
<el-table-column type="selection" <el-table-column type="selection"
align="center" align="center"
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.name}}</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.goodsNo}}</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">{{scope.row.goodsCategoryName}}</template>
</template>
</el-table-column>
<el-table-column label="入库日期"
align="center">
<template slot-scope="scope">{{scope.row.createtime | formatTime}}</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.stockRoomName || '--'}}</template> <template slot-scope="scope">{{scope.row.createTime | formatTime}}</template>
</el-table-column> </el-table-column>
<el-table-column label="操作" <el-table-column label="操作"
width="220"
align="center"> align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button size="mini" <el-button size="mini"
type="success" type="primary"
@click="handleView(scope.row)">查看详情 @click="handleDown(scope.row.id)">下载
</el-button> </el-button>
<el-button size="mini" <el-button size="mini"
type="primary" type="danger"
@click="exportEntry(scope.row.id)">生成入库单 @click="handleDelete(scope.row.id)">删除
</el-button> </el-button>
</template> </template>
</el-table-column> </el-table-column>
...@@ -86,34 +82,37 @@ ...@@ -86,34 +82,37 @@
</el-pagination> </el-pagination>
</div> </div>
</el-card> </el-card>
<!-- end --> <!-- 弹窗-->
<!-- 弹窗 --> <import-goods-modal ref="importGoods" @ok="getList"></import-goods-modal>
<inventory-details-modal ref="detail"
@ok="getList"></inventory-details-modal>
<!-- end -->
</div> </div>
</template> </template>
<script> <script>
import moment from 'moment' import moment from 'moment/moment'
import { getInboundRecordList } from '@/api/inventory' import { getGoodsList, getGoodsCategoryList, getStockRooms, editGoods } from '@/api/inventory'
import inventoryDetailsModal from './modules/inventoryDetailsModal' import { getSuppliersList } from '@/api/supplier'
import ImportGoodsModal from './modules/importGoodsModal'
// 列表查询参数默认值 // 列表查询参数默认值
const defaultListQuery = { const defaultListQuery = {
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10,
goodsMame: '' name: '',
goodsCategoryId: '',
supplierId: '',
stockRoomId: ''
} }
export default { export default {
name: 'StockAdmin', name: 'DocList',
components: { inventoryDetailsModal }, components: {
ImportGoodsModal
},
data() { data() {
return { return {
listQuery: Object.assign({}, defaultListQuery), listQuery: Object.assign({}, defaultListQuery),
list: [], list: [],
total: 0, total: 0,
listLoading: false, listLoading: false,
multipleSelection: [], multipleSelection: []
} }
}, },
created() { created() {
...@@ -153,10 +152,7 @@ export default { ...@@ -153,10 +152,7 @@ export default {
this.listLoading = true this.listLoading = true
//请求数据 //请求数据
console.log('listQuery', this.listQuery) console.log('listQuery', this.listQuery)
if(this.$store.getters.type == 2){ getGoodsList(this.listQuery).then(res => {
this.listQuery.stockRoomId = this.$store.getters.stockRoomId
}
getInboundRecordList(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
...@@ -164,10 +160,30 @@ export default { ...@@ -164,10 +160,30 @@ export default {
this.listLoading = false this.listLoading = false
}) })
}, },
// 查看 // 新增
handleView(id) { handleAdd() {
this.$refs.detail.init() this.$refs.addGoods.add()
} },
// 导入
handleImport() {
this.$refs.importGoods.add()
},
handleDown(){
},
// 删除
handleDelete(id){
this.$confirm('是否删除该物品?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
editGoods({id: id,deleteStatus: 0 }).then(res=>{
this.getList()
})
}).catch(() => {
});
},
} }
} }
</script> </script>
...@@ -186,4 +202,8 @@ export default { ...@@ -186,4 +202,8 @@ export default {
.input-width { .input-width {
width: 180px; width: 180px;
} }
.btn-groups button {
width: 100px;
}
</style> </style>
src/views/inv/GoodsCateogory.vue → src/views/doc/DocType.vue
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
<el-table-column type="selection" <el-table-column type="selection"
align="center" align="center"
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.name}}</template> <template slot-scope="scope">{{scope.row.name}}</template>
</el-table-column> </el-table-column>
...@@ -46,13 +46,13 @@ ...@@ -46,13 +46,13 @@
</div> </div>
</el-card> </el-card>
<!-- 弹窗--> <!-- 弹窗-->
<add-category ref="addCategory" @ok="getList"></add-category> <add-type ref="addCategory" @ok="getList"></add-type>
</div> </div>
</template> </template>
<script> <script>
import moment from 'moment' import moment from 'moment'
import { getGoodsCategoryList, editGoodsCategory } from '@/api/inventory' import { getGoodsCategoryList, editGoodsCategory } from '@/api/inventory'
import AddCategory from './modules/addCategory' import AddType from './modules/addType'
// 列表查询参数默认值 // 列表查询参数默认值
const defaultListQuery = { const defaultListQuery = {
pageNum: 1, pageNum: 1,
...@@ -60,8 +60,8 @@ const defaultListQuery = { ...@@ -60,8 +60,8 @@ const defaultListQuery = {
} }
export default { export default {
name: 'goodsCategory', name: 'docType',
components: {AddCategory}, components: {AddType},
data() { data() {
return { return {
listQuery: Object.assign({}, defaultListQuery), listQuery: Object.assign({}, defaultListQuery),
...@@ -122,7 +122,7 @@ export default { ...@@ -122,7 +122,7 @@ export default {
}, },
// 删除 // 删除
handleDelete(id){ handleDelete(id){
this.$confirm('是否删除该物品类别?', '提示', { this.$confirm('是否删除该文档类型?', '提示', {
confirmButtonText: '确定', confirmButtonText: '确定',
cancelButtonText: '取消', cancelButtonText: '取消',
type: 'warning' type: 'warning'
......
src/views/inv/modules/addCategory.vue → src/views/doc/modules/addType.vue
...@@ -8,12 +8,12 @@ ...@@ -8,12 +8,12 @@
ref="attributeForm" ref="attributeForm"
v-loading="loading" v-loading="loading"
label-width="150px"> label-width="150px">
<el-form-item label="物品类别：" <el-form-item label="文档类型："
:rules="[{required: true, trigger: 'blur', message: '请输入物品类别名称'}]" :rules="[{required: true, trigger: 'blur', message: '请输入文档类型名称'}]"
prop="name"> prop="name">
<el-input size="small" <el-input size="small"
class="input-width" class="input-width"
placeholder="请输入物品类别名称" placeholder="请输入文档类型名称"
v-model="model.name"></el-input> v-model="model.name"></el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
import { addGoodsCategory } from '@/api/inventory' import { addGoodsCategory } from '@/api/inventory'
// 移动属性 // 移动属性
export default { export default {
name: 'addCategory', name: 'addType',
data () { data () {
return { return {
visible: false, visible: false,
...@@ -50,7 +50,7 @@ export default { ...@@ -50,7 +50,7 @@ export default {
}, },
add(){ add(){
this.id = null this.id = null
this.title="新增物品类别" this.title="新增文档类型"
this.init() this.init()
this.visible= true this.visible= true
}, },
......
src/views/doc/modules/importGoodsModal.vue 0 → 100644
<template>
<el-dialog :visible.sync="visible"
:title="title"
center
width="500px"
:close-on-click-modal="false">
<div class="scroll-container no-bottom"
ref="scrollContainer">
<el-form :model="modal" ref="modal" label-width="100px">
<el-form-item prop="name"
label="文档名称"
:rules="[{required: true,trigger: 'blur',message: '文档名称不能为空'}]">
<el-input v-model="modal.name" class="input-width"
placeholder="请输入文档名称"></el-input>
</el-form-item>
<el-form-item prop="type"
label="文档类型"
:rules="[{required: true,trigger: 'blur',message: '请选择文档类型'}]">
<el-select v-model="modal.type" class="input-width"
placeholder="请选择文档类型">
<el-option v-for="item in categoryOptions"
:key="item.id"
:label="item.name"
:value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item prop="doc"
label="文档"
:rules="[{required: true,trigger: 'blur',message: '请选择文档类型'}]">
<el-upload
class="upload-demo"
:action="actionURL"
:limit="1"
:on-success="afterSuccess"
name='file'>
<el-button size="small" type="primary">选择文档</el-button>
<div slot="tip" class="el-upload__tip">只能上传不超过20MB的文件</div>
</el-upload>
</el-form-item>
</el-form>
</div>
<div slot="footer">
<el-button type="primary"
@click="submit('modal')">确认
</el-button>
<el-button
@click="close">返回
</el-button>
</div>
<!-- end -->
</el-dialog>
</template>
<script>
import { getGoodsCategoryList, addGoodList, getStockRooms, getGoodsList } from '@/api/inventory'
import XLSX from 'xlsx'
// 添加编辑属性
export default {
name: 'importGoodsModal',
data() {
return {
actionURL:'',
files: null, //文件列表
visible: false,
title: null,
loading: false,
modal: {},
categoryOptions:[]
}
},
methods: {
// 物品类别
getGoodsCategoryList() {
getGoodsCategoryList().then(res => {
this.categoryOptions = res.data.list
})
},
init() {
this.modal={
name: '',
type: '',
doc: ''
}
this.getGoodsCategoryList()
this.$nextTick(() => {
this.$refs.scrollContainer.scrollTop = 0
})
},
add() {
this.init()
this.title = '上传文件'
this.visible = true
},
close() {
this.visible = false
},
submit(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
addGoodList({ vankeGoodsList: this.modal.tableData }).then(res => {
this.$emit('ok')
this.visible = false
})
} else {
this.$message.warning('请检查必填项是否输入')
}
})
},
afterSuccess(response,file,fileList) {
console.log(response) //返回的是上传之后后台返回的结果
}
}
}
</script>
<style scoped>
.scroll-container {
max-height: 50vh;
overflow: hidden;
overflow-y: auto;
}
.input-width {
width: 300px;
}
.el-upload__tip {
color: #999;
font-size: 10px;
line-height: 23px;
}
</style>
src/views/home/index.vue
...@@ -7,8 +7,8 @@ ...@@ -7,8 +7,8 @@
<svg-icon icon-class="delivery" <svg-icon icon-class="delivery"
class="total-icon"> class="total-icon">
</svg-icon> </svg-icon>
<div class="total-title">今日出库（件）</div> <div class="total-title">今日上传</div>
<div class="total-value">200</div> <div class="total-value">{{homeData['今日出库']}}</div>
</div> </div>
</el-col> </el-col>
<el-col> <el-col>
...@@ -16,8 +16,8 @@ ...@@ -16,8 +16,8 @@
<svg-icon icon-class="put" <svg-icon icon-class="put"
class="total-icon"> class="total-icon">
</svg-icon> </svg-icon>
<div class="total-title">今日入库（件）</div> <div class="total-title">今日下载</div>
<div class="total-value">5000.00</div> <div class="total-value">{{homeData['今日入库']}}</div>
</div> </div>
</el-col> </el-col>
<el-col> <el-col>
...@@ -25,8 +25,8 @@ ...@@ -25,8 +25,8 @@
<svg-icon icon-class="warn" <svg-icon icon-class="warn"
class="total-icon"> class="total-icon">
</svg-icon> </svg-icon>
<div class="total-title">库存预警</div> <div class="total-title">累计上传</div>
<div class="total-value">￥50000.00</div> <div class="total-value">{{homeData['库存预警']}}</div>
</div> </div>
</el-col> </el-col>
<el-col> <el-col>
...@@ -34,17 +34,8 @@ ...@@ -34,17 +34,8 @@
<svg-icon icon-class="person" <svg-icon icon-class="person"
class="total-icon"> class="total-icon">
</svg-icon> </svg-icon>
<div class="total-title">今日申领人</div> <div class="total-title">累计下载</div>
<div class="total-value">50000.00</div> <div class="total-value">{{homeData['今日申领人']}}</div>
</div>
</el-col>
<el-col>
<div class="total-frame">
<svg-icon icon-class="inventory"
class="total-icon">
</svg-icon>
<div class="total-title">剩余库存</div>
<div class="total-value">5000.00</div>
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
...@@ -53,40 +44,33 @@ ...@@ -53,40 +44,33 @@
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="12"> <el-col :span="12">
<div class="out-border"> <div class="out-border">
<div class="layout-title">出库入库</div> <div class="layout-title">今日下载排行</div>
<div style="padding: 10px;border-left:1px solid #DCDFE6"> <div style="padding: 40px">
<el-button type="primary" plain>7天</el-button> <el-table
<el-button plain>15天</el-button> :data="homeData.stockWarns"
<div> style="width: 100%">
<ve-line :data="chartData" <el-table-column
:legend-visible="false" prop="name">
:loading="loading" </el-table-column>
:data-empty="dataEmpty" <el-table-column
:settings="chartSettings"></ve-line> prop="goodsCategoryName">
</div> </el-table-column>
</el-table>
</div> </div>
</div> </div>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<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">
<el-table <el-table
:data="tableData" :data="homeData.stockWarns"
style="width: 100%"> style="width: 100%">
<el-table-column <el-table-column
prop="date" prop="name">
label="日期"
width="180">
</el-table-column>
<el-table-column
prop="name"
label="姓名"
width="180">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="address" prop="goodsCategoryName">
label="地址">
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
...@@ -94,198 +78,30 @@ ...@@ -94,198 +78,30 @@
</el-col> </el-col>
</el-row> </el-row>
</div> </div>
<div class="overview-layout">
<el-row :gutter="20">
<el-col :span="8">
<div class="out-border">
<div class="layout-title">领取物品类别分布</div>
<div style="padding: 10px;border-left:1px solid #DCDFE6">
<el-button type="primary" plain>昨天</el-button>
<el-button type="primary" plain>7天</el-button>
<el-button plain>15天</el-button>
<div>
<ve-pie :data="chartData1" :settings="chartSettings1"></ve-pie>
</div>
</div>
</div>
</el-col>
<el-col :span="8">
<div class="out-border">
<div class="layout-title">入库物品类别分布</div>
<div style="padding: 10px;border-left:1px solid #DCDFE6">
<el-button type="primary" plain>昨天</el-button>
<el-button type="primary" plain>7天</el-button>
<el-button plain>15天</el-button>
<div>
<ve-pie :data="chartData1" :settings="chartSettings1"></ve-pie>
</div>
</div>
</div>
</el-col>
<el-col :span="8">
<div class="out-border">
<div class="layout-title">申领人部门分布</div>
<div style="padding: 10px;border-left:1px solid #DCDFE6">
<el-button type="primary" plain>昨天</el-button>
<el-button type="primary" plain>7天</el-button>
<el-button plain>15天</el-button>
<div>
<ve-pie :data="chartData1" :settings="chartSettings1"></ve-pie>
</div>
</div>
</div>
</el-col>
</el-row>
</div>
</el-card> </el-card>
</template> </template>
<script> <script>
import { str2Date } from '@/utils/date' import { str2Date } from '@/utils/date'
import { getHomeData,selectStockByGoodsIdAndTime,selectInBoundByCategory,selectOutBoundByCategory,selectOutBoundByDepartId } from '@/api/home'
const DATA_FROM_BACKEND = {
columns: ['date', 'orderCount', 'orderAmount'],
rows: [
{ date: '2018-11-01', orderCount: 10, orderAmount: 100 },
{ date: '2018-11-02', orderCount: 20, orderAmount: 2230 },
{ date: '2018-11-03', orderCount: 33, orderAmount: 3623 },
{ date: '2018-11-04', orderCount: 50, orderAmount: 6423 },
{ date: '2018-11-05', orderCount: 80, orderAmount: 8492 },
{ date: '2018-11-06', orderCount: 60, orderAmount: 6293 },
{ date: '2018-11-07', orderCount: 20, orderAmount: 2293 },
{ date: '2018-11-08', orderCount: 60, orderAmount: 6293 },
{ date: '2018-11-09', orderCount: 50, orderAmount: 5293 },
{ date: '2018-11-10', orderCount: 30, orderAmount: 3293 },
{ date: '2018-11-11', orderCount: 20, orderAmount: 2293 },
{ date: '2018-11-12', orderCount: 80, orderAmount: 8293 },
{ date: '2018-11-13', orderCount: 100, orderAmount: 10293 },
{ date: '2018-11-14', orderCount: 10, orderAmount: 1293 },
{ date: '2018-11-15', orderCount: 40, orderAmount: 4293 }
]
}
export default { export default {
name: 'home', name: 'home',
data() { data() {
const that = this
return { return {
chartData1: { homeData: {},
columns: ['日期', '访问用户'],
rows: [
{ '日期': '1/1', '访问用户': 1393 },
{ '日期': '1/2', '访问用户': 3530 },
{ '日期': '1/3', '访问用户': 2923 },
{ '日期': '1/4', '访问用户': 1723 },
{ '日期': '1/5', '访问用户': 3792 },
{ '日期': '1/6', '访问用户': 4593 }
]
},
chartSettings1:{
dimension: '日期',
metrics: '访问用户'
},
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 弄'
}, {
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
}, {
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
}, {
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
}],
pickerOptions: {
shortcuts: [{
text: '最近一周',
onClick(picker) {
const end = new Date()
let start = new Date()
start.setFullYear(2018)
start.setMonth(10)
start.setDate(1)
end.setTime(start.getTime() + 3600 * 1000 * 24 * 7)
picker.$emit('pick', [start, end])
}
}, {
text: '最近一月',
onClick(picker) {
const end = new Date()
let start = new Date()
start.setFullYear(2018)
start.setMonth(10)
start.setDate(1)
end.setTime(start.getTime() + 3600 * 1000 * 24 * 30)
picker.$emit('pick', [start, end])
}
}]
},
orderCountDate: '',
chartSettings: {
xAxisType: 'time',
area: true,
axisSite: { right: ['orderAmount'] },
labelMap: { 'orderCount': '订单数量', 'orderAmount': '订单金额' }
},
chartData: {
columns: [],
rows: []
},
loading: false,
dataEmpty: false
} }
}, },
created() { created() {
this.initOrderCountDate() this.getHomeData()
this.getData()
}, },
methods: { methods: {
handleDateChange() { getHomeData() {
this.getData() getHomeData({ queryTime: '2020-06-28' }).then(res => {
}, this.homeData = res.data
initOrderCountDate() { this.homeData.stockWarns = res.data['库存预警集合'].splice(0,7)
let start = new Date() })
start.setFullYear(2018)
start.setMonth(10)
start.setDate(1)
const end = new Date()
end.setTime(start.getTime() + 1000 * 60 * 60 * 24 * 7)
this.orderCountDate = [start, end]
},
getData() {
setTimeout(() => {
this.chartData = {
columns: ['date', 'orderCount', 'orderAmount'],
rows: []
}
for (let i = 0; i < DATA_FROM_BACKEND.rows.length; i++) {
let item = DATA_FROM_BACKEND.rows[i]
let currDate = str2Date(item.date)
let start = this.orderCountDate[0]
let end = this.orderCountDate[1]
if (currDate.getTime() >= start.getTime() && currDate.getTime() <= end.getTime()) {
this.chartData.rows.push(item)
}
}
this.dataEmpty = false
this.loading = false
}, 1000)
} }
} }
} }
...@@ -303,7 +119,7 @@ export default { ...@@ -303,7 +119,7 @@ export default {
.total-frame { .total-frame {
border: 1px solid #dcdfe6; border: 1px solid #dcdfe6;
padding: 20px; padding: 20px 50px;
height: 100px; height: 100px;
} }
......
src/views/inv/DepotAdmin.vue deleted 100644 → 0
<template> 
<div class="app-container">
<!-- 表格栏 -->
<el-card class="filter-container mt15"
shadow="never">
<el-row type="flex" class="btn-groups">
<el-button type="primary" size="medium" @click="handleAdd">新增</el-button>
</el-row>
<div class="table-container">
<el-table :data="list"
v-loading="listLoading"
@selection-change="handleSelectionChange"
border>
<el-table-column type="selection"
align="center"
width="50"></el-table-column>
<el-table-column label="库房名称"
align="center">
<template slot-scope="scope">{{scope.row.name}}</template>
</el-table-column>
<el-table-column label="管理员"
align="center">
<template slot-scope="scope">{{scope.row.username}}</template>
</el-table-column>
<el-table-column label="创建时间"
align="center">
<template slot-scope="scope">{{scope.row.createtime | formatTime}}</template>
</el-table-column>
<el-table-column label="操作"
align="center">
<template slot-scope="scope">
<el-button size="mini"
type="danger"
@click="handleDelete(scope.row.id)">删除
</el-button>
</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"
:current-page.sync="listQuery.pageNum"
:page-size="listQuery.pageSize"
:page-sizes="[10,30,50]"
:total="total">
</el-pagination>
</div>
</el-card>
<!-- 弹窗-->
<add-depot ref="addDepot" @ok="getList"></add-depot>
</div>
</template>
<script>
import moment from 'moment'
import { getStockRooms, editDepartment } from '@/api/inventory'
import AddDepot from './modules/addDepot'
// 列表查询参数默认值
const defaultListQuery = {
pageNum: 1,
pageSize: 10
}
export default {
name: 'DepotAdmin',
components: { AddDepot },
data() {
return {
listQuery: Object.assign({}, defaultListQuery),
list: [],
total: 0,
listLoading: false,
multipleSelection: [],
}
},
created() {
this.getList()
},
filters: {
formatTime(time) {
if (!time) {
return '--'
}
return moment(time).format('YYYY-MM-DD HH:mm:ss')
}
},
methods: {
handleResetSearch() {
this.listQuery = Object.assign({}, defaultListQuery)
this.getList()
},
handleSearchList() {
this.listQuery.pageNum = 1
this.getList()
},
handleSizeChange(val) {
this.listQuery.pageNum = 1
this.listQuery.pageSize = val
this.getList()
},
handleCurrentChange(val) {
this.listQuery.pageNum = val
this.getList()
},
handleSelectionChange(vals) {
this.multipleSelection = vals
},
//请求数据
getList() {
this.listLoading = true
//请求数据
console.log('listQuery', this.listQuery)
getStockRooms(this.listQuery).then(res => {
this.listLoading = false
this.list = res.data.list
this.total = res.data.total
}).catch(err => {
this.listLoading = false
})
},
// 添加
handleAdd() {
this.$refs.addDepot.add()
},
// 删除
handleDelete(id){
this.$confirm('是否删除该库房?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
editDepartment({id: id,deleteStatus: 0 }).then(res=>{
this.getList()
})
}).catch(() => {
});
}
}
}
</script>
<style scoped>
.app-container {
font-size: 14px;
color: #606266;
padding: 0 15px;
margin-top: 0;
}
.mt15 {
margin-top: 15px;
}
.input-width {
width: 180px;
}
.btn-groups button {
width: 100px;
}
</style>
src/views/inv/StoreList.vue deleted 100644 → 0
<template> 
<div class="app-container">
<!-- 搜索栏 -->
<el-card class="filter-container"
shadow="never">
<el-form :inline="true"
:model="listQuery"
size="small">
<el-form-item label="物品名称：">
<el-input v-model="listQuery.name"
class="input-width"
placeholder="请输入物品名称"></el-input>
</el-form-item>
<el-form-item label="物品类别：">
<el-select v-model="listQuery.goodsCategoryId"
class="input-width"
clearable
placeholder="请选择物品类别">
<el-option v-for="item in categoryOptions"
:key="item.id"
:label="item.name"
:value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="供应商：">
<el-select v-model="listQuery.supplierId"
class="input-width"
clearable
placeholder="请选择供应商">
<el-option v-for="item in supplierOptions"
:key="item.id"
:label="item.supplierName"
:value="item.id"></el-option>
</el-select>
</el-form-item>
<!-- 超级管理员可见-->
<el-form-item label="库房："
v-if="$store.getters.type == 1">
<el-select v-model="listQuery.stockRoomId"
class="input-width"
clearable
placeholder="请选择库房">
<el-option v-for="item in depotOptions"
:key="item.id"
:label="item.name"
:value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary"
@click="handleSearchList"
icon="el-icon-search"
size="small">搜索
</el-button>
<el-button @click="handleResetSearch"
icon="el-icon-refresh"
size="small">重置
</el-button>
</el-form-item>
</el-form>
</el-card>
<!-- 表格栏 -->
<el-card class="filter-container mt15"
shadow="never">
<el-row type="flex" class="btn-groups" justify="end">
<el-button type="primary" @click="handleAdd">新增</el-button>
<el-button type="success" @click="handleAdd">扫码入库</el-button>
<el-button type="info" @click="handleAdd">扫码出库</el-button>
<el-button type="warning" @click="handleImport">导入</el-button>
</el-row>
<div class="table-container">
<el-table :data="list"
v-loading="listLoading"
@selection-change="handleSelectionChange"
border>
<el-table-column type="selection"
align="center"
width="50"></el-table-column>
<el-table-column label="物品名称"
align="center">
<template slot-scope="scope">{{scope.row.name}}</template>
</el-table-column>
<el-table-column label="型号"
align="center">
<template slot-scope="scope">{{scope.row.goodsNo}}</template>
</el-table-column>
<el-table-column label="物品类别"
align="center">
<template slot-scope="scope">{{scope.row.goodsCategoryName}}</template>
</el-table-column>
<el-table-column label="数量"
align="center">
<template slot-scope="scope">{{scope.row.goodsNum}}</template>
</el-table-column>
<el-table-column label="价格"
align="center">
<template slot-scope="scope">{{scope.row.prict || 0}}</template>
</el-table-column>
<el-table-column label="供应商"
align="center">
<template slot-scope="scope">{{scope.row.supplierName || '--'}}</template>
</el-table-column>
<el-table-column label="所属库房"
align="center">
<template slot-scope="scope">{{scope.row.stockRoomName || '--'}}</template>
</el-table-column>
<!-- <el-table-column label="操作"-->
<!-- align="center">-->
<!-- <template slot-scope="scope">-->
<!-- <el-button size="mini"-->
<!-- type="danger"-->
<!-- @click="handleDelete(scope.row.id)">删除</el-button>-->
<!-- </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"
:current-page.sync="listQuery.pageNum"
:page-size="listQuery.pageSize"
:page-sizes="[10,30,50]"
:total="total">
</el-pagination>
</div>
</el-card>
<!-- 弹窗-->
<add-goods-modal ref="addGoods" @ok="getList"></add-goods-modal>
<import-goods-modal ref="importGoods" @ok="getList"></import-goods-modal>
</div>
</template>
<script>
import moment from 'moment'
import { getGoodsList,getGoodsCategoryList,getStockRooms, editGoods } from '@/api/inventory'
import {getSuppliersList} from '@/api/supplier'
import AddGoodsModal from './modules/addGoodsModal'
import ImportGoodsModal from './modules/importGoodsModal'
// 列表查询参数默认值
const defaultListQuery = {
pageNum: 1,
pageSize: 10,
name: '',
goodsCategoryId: '',
supplierId: '',
stockRoomId: ''
}
export default {
name: 'StoreList',
components: {
AddGoodsModal,
ImportGoodsModal
},
data() {
return {
listQuery: Object.assign({}, defaultListQuery),
list: [],
total: 0,
listLoading: false,
multipleSelection: [],
categoryOptions: [],
supplierOptions: [],
depotOptions: []
}
},
created() {
this.getList()
this.getGoodsCategoryList()
this.getSuppliersList()
this.getStockRooms()
},
filters: {
formatTime(time) {
if (!time) {
return '--'
}
return moment(time).format('YYYY-MM-DD HH:mm:ss')
}
},
methods: {
handleResetSearch() {
this.listQuery = Object.assign({}, defaultListQuery)
this.getList()
},
handleSearchList() {
this.listQuery.pageNum = 1
this.getList()
},
handleSizeChange(val) {
this.listQuery.pageNum = 1
this.listQuery.pageSize = val
this.getList()
},
handleCurrentChange(val) {
this.listQuery.pageNum = val
this.getList()
},
handleSelectionChange(vals) {
this.multipleSelection = vals
},
// 删除
// handleDelete(id){
// this.$confirm('是否删除该物品?', '提示', {
// confirmButtonText: '确定',
// cancelButtonText: '取消',
// type: 'warning'
// }).then(() => {
// editGoods({id: id,deleteStatus: 0 }).then(res=>{
// this.getList()
// })
// }).catch(() => {
// });
// },
// 物品类别
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
})
},
//请求数据
getList() {
this.listLoading = true
//请求数据
console.log('listQuery', this.listQuery)
if(this.$store.getters.type == 2){
this.listQuery.stockRoomId = this.$store.getters.stockRoomId
}
getGoodsList(this.listQuery).then(res => {
this.listLoading = false
this.list = res.data.list
this.total = res.data.total
}).catch(err => {
this.listLoading = false
})
},
// 新增
handleAdd(){
this.$refs.addGoods.add()
},
// 导入
handleImport(){
this.$refs.importGoods.add()
}
}
}
</script>
<style scoped>
.app-container {
font-size: 14px;
color: #606266;
padding: 0 15px;
margin-top: 0;
}
.mt15 {
margin-top: 15px;
}
.input-width {
width: 180px;
}
.btn-groups button{
width: 100px;
}
</style>
src/views/inv/WarehouseAdmin.vue deleted 100644 → 0
<template> 
<div class="app-container">
<!-- 搜索栏 -->
<el-card class="filter-container"
shadow="never">
<el-form :inline="true"
:model="listQuery"
size="small">
<el-form-item label="物品名称：">
<el-input v-model="listQuery.goodsMame"
class="input-width"
placeholder="请输入物品名称"></el-input>
</el-form-item>
<el-form-item label="物品类别：">
<el-select v-model="listQuery.goodsCategoryId"
class="input-width"
clearable
placeholder="请选择物品类别">
<el-option v-for="item in categoryOptions"
:key="item.id"
:label="item.name"
:value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="部门：">
<el-select v-model="listQuery.departId"
class="input-width"
clearable
placeholder="请选择部门">
<el-option v-for="item in departmentOptions"
:key="item.id"
:label="item.name"
:value="item.id"></el-option>
</el-select>
</el-form-item>
<!-- 超级管理员可见-->
<el-form-item label="库房：" v-if="$store.getters.type == 1">
<el-select v-model="listQuery.stockRoomId"
class="input-width"
clearable
placeholder="请选择库房">
<el-option v-for="item in depotOptions"
:key="item.id"
:label="item.name"
:value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary"
@click="handleSearchList"
icon="el-icon-search"
size="small">搜索
</el-button>
<el-button @click="handleResetSearch"
icon="el-icon-refresh"
size="small">重置
</el-button>
</el-form-item>
</el-form>
</el-card>
<!-- 表格栏 -->
<el-card class="filter-container mt15"
shadow="never">
<div class="table-container">
<el-table :data="list"
v-loading="listLoading"
@selection-change="handleSelectionChange"
border>
<el-table-column type="selection"
align="center"
width="50"></el-table-column>
<el-table-column label="物品名称"
align="center">
<template slot-scope="scope">{{scope.row.goodsName}}</template>
</el-table-column>
<el-table-column label="型号"
align="center">
<template slot-scope="scope">{{scope.row.goodsNo}}</template>
</el-table-column>
<el-table-column label="物品类别"
align="center">
<template slot-scope="scope">{{scope.row.goodsCategoryName}}</template>
</el-table-column>
<el-table-column label="数量"
align="center">
<template slot-scope="scope">{{scope.row.outboundNum}}</template>
</el-table-column>
<el-table-column label="申领人"
align="center">
<template slot-scope="scope">{{$store.getters.type == 1? scope.row.backOutboundName : scope.row.receptOutboundName}}</template>
</el-table-column>
<el-table-column label="所属部门"
align="center">
<template slot-scope="scope">{{scope.row.departmentName || '--'}}</template>
</el-table-column>
<el-table-column label="所属库房"
align="center">
<template slot-scope="scope">{{scope.row.stockRoomName || '--'}}</template>
</el-table-column>
<el-table-column label="出库日期"
align="center">
<template slot-scope="scope">{{scope.row.createtime | formatTime }}</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"
:current-page.sync="listQuery.pageNum"
:page-size="listQuery.pageSize"
:page-sizes="[10,30,50]"
:total="total">
</el-pagination>
</div>
</el-card>
</div>
</template>
<script>
import moment from 'moment'
import { getOutboundRecordList, getGoodsCategoryList, getStockRooms, getDepartmentList } from '@/api/inventory'
// 列表查询参数默认值
const defaultListQuery = {
pageNum: 1,
pageSize: 10,
goodsCategoryId: '',
stockRoomId: '',
goodsMame: '',
memberName: '',
departId: ''
}
export default {
name: 'WarehouseAdmin',
components: {},
data() {
return {
listQuery: Object.assign({}, defaultListQuery),
list: [],
total: 0,
listLoading: false,
multipleSelection: [],
categoryOptions: [],
depotOptions: [],
departmentOptions: []
}
},
created() {
this.getList()
this.getGoodsCategoryList()
this.getStockRooms()
this.getDepartmentList()
},
filters: {
formatTime(time) {
if (!time) {
return '--'
}
return moment(time).format('YYYY-MM-DD HH:mm:ss')
}
},
methods: {
handleResetSearch() {
this.listQuery = Object.assign({}, defaultListQuery)
this.getList()
},
handleSearchList() {
this.listQuery.pageNum = 1
this.getList()
},
handleSizeChange(val) {
this.listQuery.pageNum = 1
this.listQuery.pageSize = val
this.getList()
},
handleCurrentChange(val) {
this.listQuery.pageNum = val
this.getList()
},
handleSelectionChange(vals) {
this.multipleSelection = vals
},
// 物品类别
getGoodsCategoryList() {
getGoodsCategoryList().then(res => {
this.categoryOptions = res.data.list
})
},
// 库房
getStockRooms() {
getStockRooms().then(res => {
this.depotOptions = res.data.list
})
},
getDepartmentList() {
getDepartmentList().then(res => {
this.departmentOptions = res.data.list
})
},
//请求数据
getList() {
this.listLoading = true
//请求数据
console.log('listQuery', this.listQuery)
if (this.$store.getters.type == 2) {
this.listQuery.stockRoomId = this.$store.getters.stockRoomId
}
getOutboundRecordList(this.listQuery).then(res => {
this.listLoading = false
this.list = res.data.list
this.total = res.data.total
}).catch(err => {
this.listLoading = false
})
}
}
}
</script>
<style scoped>
.app-container {
font-size: 14px;
color: #606266;
padding: 0 15px;
margin-top: 0;
}
.mt15 {
margin-top: 15px;
}
.input-width {
width: 180px;
}
</style>
src/views/inv/modules/addGoodsModal.vue deleted 100644 → 0
<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-button type="primary" size="medium" @click="handleAdd">新增</el-button>
</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-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="scope.row.id? true: false"></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 } from '@/api/inventory'
import { getSuppliersList } from '@/api/supplier'
// 添加编辑属性
export default {
name: 'addGoodsModal',
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: []
}
},
methods: {
// 物品类别
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) {
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].supplierId = item.supplierId
this.formData.tableData[index].goodsCategoryId = item.goodsCategoryId
console.log('item', item)
}
}
}
</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/inv/modules/importGoodsModal.vue deleted 100644 → 0
<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 prop="name" label="物品名称">
<template slot-scope="scope">
<el-form-item size="mini" :prop="'tableData.' + scope.$index + '.name'"
:rules="[{required: true,trigger: 'change',message: '物品名称不能为空'}]">
<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="scope.row.id? true: false"></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,message: '请选择物品类别',trigger: 'change'}]">
<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 } from '@/api/inventory'
import { getSuppliersList } from '@/api/supplier'
import XLSX from 'xlsx'
// 添加编辑属性
export default {
name: 'importGoodsModal',
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,
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: {
// 物品类别
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() {
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
},
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) {
this.$refs[formName].validate((valid) => {
if (valid) {
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
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
},
//删除文件
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.name = sheet['物品名称']
rowTable.goodsNo = sheet['型号']
rowTable.goodsNum = sheet['数量']
rowTable.prict = sheet['价格']
rowTable.barCode = sheet['条形码']
if (sheet['物品类别']) {
let isExist = this.categoryOptions.findIndex(item =>
item.name === sheet['物品类别']
)
isExist === -1 && (rowTable.goodsCategoryId = null)
isExist !== -1 && (rowTable.goodsCategoryId = this.categoryOptions[isExist].id)
}
if (sheet['供应商']) {
let isExist = this.supplierOptions.findIndex(item =>
item.supplierName === sheet['供应商']
)
isExist === -1 && (rowTable.supplierId = null)
isExist !== -1 && (rowTable.supplierId = this.supplierOptions[isExist].id)
}
if (sheet['所属库房']) {
let isExist = this.depotOptions.findIndex(item =>
item.name === sheet['所属库房']
)
isExist === -1 && (rowTable.stockRoomId = null)
isExist !== -1 && (rowTable.stockRoomId = this.depotOptions[isExist].id)
}
if (sheet['物品名称']) {
let isExist = this.goodsList.findIndex(item =>
item.name === sheet['物品名称']
)
isExist === -1 && (rowTable.id = null)
if( isExist !== -1){
rowTable.id = this.goodsList[isExist].id
rowTable.prict = this.goodsList[isExist].prict
rowTable.goodsNo = this.goodsList[isExist].goodsNo
rowTable.barCode = this.goodsList[isExist].barCode
rowTable.goodsCategoryId = this.goodsList[isExist].goodsCategoryId
rowTable.stockRoomId = this.goodsList[isExist].stockRoomId
rowTable.supplierId = this.goodsList[isExist].supplierId
}
}
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: 100px;
}
.el-upload__tip {
color: #999;
font-size: 10px;
}
</style>
src/views/inv/modules/inventoryDetailsModal.vue deleted 100644 → 0
<template>
<el-dialog :visible.sync="visible"
title="物品详情"
center
width="720px">
<!-- start -->
<div class="scroll-container"
ref="scrollContainer">
<el-table
:data="tableData"
style="width: 100%">
<el-table-column
prop="date"
label="物品名称">
</el-table-column>
<el-table-column
prop="name"
label="型号">
</el-table-column>
<el-table-column
prop="address"
label="物品类别">
</el-table-column>
<el-table-column
prop="address"
label="数量">
</el-table-column>
<el-table-column
prop="address"
label="价格（元）">
</el-table-column>
<el-table-column
prop="address"
label="供应商">
</el-table-column>
</el-table>
</div>
<div slot="footer">
<el-button type="primary"
@click="close">返回
</el-button>
</div>
<!-- end -->
</el-dialog>
</template>
<script>
import { addMember,updateMcht } from '@/api/inventory'
// 添加编辑属性
export default {
name: 'inventoryDetailsModal',
data() {
return {
visible: false,
title: null,
loading: false,
tableData: new Array(10).fill({
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: {
init() {
this.visible = true
this.$nextTick(() => {
this.$refs.scrollContainer.scrollTop = 0
})
},
close() {
this.visible = false
}
}
}
</script>
<style scoped>
.scroll-container {
max-height: 50vh;
overflow: hidden;
overflow-y: auto;
}
</style>
src/views/ums/admin/index.vue
...@@ -6,12 +6,6 @@ ...@@ -6,12 +6,6 @@
<el-form :inline="true" <el-form :inline="true"
:model="listQuery" :model="listQuery"
size="small"> size="small">
<!-- <el-form-item label="部门：">-->
<!-- <el-cascader v-model="listQuery.departIds"-->
<!-- style="width: 250px;"-->
<!-- :props="{ expandTrigger: 'hover', checkStrictly: true, value: 'id', label: 'departName', children: 'departParamList' }"-->
<!-- :options="allDepartList"></el-cascader>-->
<!-- </el-form-item>-->
<el-form-item label="角色名："> <el-form-item label="角色名：">
<el-select v-model="listQuery.roleId" <el-select v-model="listQuery.roleId"
style="width: 250px;"> style="width: 250px;">
...@@ -65,6 +59,17 @@ ...@@ -65,6 +59,17 @@
align="center" align="center"
prop="roleName"> prop="roleName">
</el-table-column> </el-table-column>
<el-table-column label="是否启用"
width="140"
align="center">
<template slot-scope="scope">
<el-switch @change="handleStatusChange(scope.$index, scope.row)"
:active-value="1"
:inactive-value="0"
v-model="scope.row.status">
</el-switch>
</template>
</el-table-column>
<!-- <el-table-column label="部门"--> <!-- <el-table-column label="部门"-->
<!-- align="center"--> <!-- align="center"-->
<!-- prop="departName">--> <!-- prop="departName">-->
...@@ -89,10 +94,6 @@ ...@@ -89,10 +94,6 @@
type="danger" type="danger"
@click="handleDelete(scope.row)">删除 @click="handleDelete(scope.row)">删除
</el-button> </el-button>
<el-button size="mini"
type="info"
@click="handleLook(scope.row)">日志
</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
...@@ -316,8 +317,25 @@ export default { ...@@ -316,8 +317,25 @@ export default {
}) })
} }
}, },
handleLook(row) { handleStatusChange(index, row) {
this.$router.push({ name: 'log', params: { name: row.username } }) this.$confirm('是否要修改该状态?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
updateStatus(row.id, { status: row.status }).then(response => {
this.$message({
type: 'success',
message: '修改成功!'
})
})
}).catch(() => {
this.$message({
type: 'info',
message: '取消修改'
})
this.getList()
})
}, },
getList() { getList() {
this.listLoading = true this.listLoading = true
......
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