<template>
|
<div class="app-container">
|
<div class="filter-container">
|
<el-row style="padding-top: 10px">
|
<div style="display: block;">
|
<div class="basic_search">
|
<span>地域：  </span>
|
<el-select
|
v-model="queryForm.province"
|
placeholder="请选择省份"
|
clearable
|
filterable
|
@change="changeArea('province')">
|
<el-option
|
v-for="item in provinceList"
|
:key="item.id"
|
:label="item.name"
|
:value="item.name"
|
>
|
</el-option>
|
</el-select>
|
</div>
|
<div class="basic_search">
|
<el-select v-model="queryForm.city" prop="city" clearable filterable @change="changeArea('city')">
|
<el-option
|
v-for="item in cityList"
|
:key="item.id"
|
:label="item.name"
|
:value="item.name"
|
>
|
</el-option>
|
</el-select>
|
</div>
|
<div class="basic_search">
|
<el-select v-model="queryForm.area" clearable filterable @change="changeArea('area')">
|
<el-option
|
v-for="item in districtList"
|
:key="item.id"
|
:label="item.name"
|
:value="item.name"
|
>
|
</el-option>
|
</el-select>
|
</div>
|
<div class="basic_search">
|
<el-select v-model="queryForm.town" clearable filterable @change="changeArea('town')" >
|
<el-option
|
v-for="item in streetList"
|
:key="item.id"
|
:label="item.name"
|
:value="item.name"
|
>
|
</el-option>
|
</el-select>
|
</div>
|
<div class="basic_search">
|
<el-select v-model="queryForm.community" clearable filterable>
|
<el-option
|
v-for="item in committeeList"
|
:key="item.id"
|
:label="item.name"
|
:value="item.name"
|
>
|
</el-option>
|
</el-select>
|
</div>
|
</div>
|
|
</el-row>
|
<el-row style="padding-top: 10px">
|
企业名称：
|
<el-input v-model="queryForm.name" class="filter-item" placeholder="企业名称" style="width: 20%;padding-right: 15px"
|
@keyup.enter.native="queryHandle"/>
|
|
企业类型：
|
<el-select
|
v-model.trim="queryForm.enterpriseType"
|
placeholder="请选择企业类型"
|
style="width:13%;">
|
<el-option
|
v-for="(item,index) in checkTypeList"
|
:label="item.text"
|
:value="item.text"
|
:key="index"/>
|
</el-select>
|
许可证有效状态：
|
<el-select
|
v-model.trim="queryForm.licenseValid"
|
placeholder="请选择许可证有效状态"
|
style="width:13%;">
|
<el-option
|
v-for="item in licenseValidList"
|
:label="item.text"
|
:value="item.id"
|
:key="item.id"/>
|
</el-select>
|
<!-- <el-button class="filter-item" style="margin-left: 15px;" type="primary" icon="el-icon-refresh"-->
|
<!-- @click="refreshHandle">立即更新-->
|
<!-- </el-button>-->
|
<el-button class="filter-item" style="margin-left: 15px;" type="primary" icon="el-icon-download"
|
@click="exportAllHandle">导出
|
</el-button>
|
<el-button class="filter-item" style="margin-left: 10px;" type="primary" icon="el-icon-search"
|
@click="queryHandle"/>
|
<el-button v-if="userType === 1" class="filter-item" style="margin-left: 10px; background-color: #f56c6c" type="danger" icon="el-icon-delete"
|
@click="clearHandle">清空库存
|
</el-button>
|
</el-row>
|
|
</div>
|
<div class="table_content">
|
<el-table
|
v-loading="listLoading"
|
:key="tableKey"
|
:data="stockTotalData"
|
ref="multipleTable"
|
border
|
fit
|
highlight-current-row
|
style="width: 100%;"
|
@sort-change="sortChange"
|
@selection-change="handleSelectionChange"
|
>
|
<el-table-column
|
type="selection"
|
width="55"/>
|
<el-table-column type="index" label="序号" align="center" width="80"/>
|
<el-table-column label="企业名称" prop="enterpriseName" align="center" sortable="custom">
|
<template slot-scope="scope">
|
<el-link type="primary" v-if="scope.row.enterpriseName !== '总计'" @click="showDetail(scope.row.owner)">{{ scope.row.enterpriseName }}</el-link>
|
<span v-if="scope.row.enterpriseName === '总计'">总计</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="地区" align="center" sortable="custom">
|
<template slot-scope="scope">
|
{{[scope.row.province,scope.row.city,scope.row.district].filter(item=>item!=="" &item!=null).join("-")}}
|
</template>
|
</el-table-column>
|
|
<el-table-column label="库存总数（箱）" prop="stockNum" align="center" sortable="custom">
|
<template slot-scope="scope">
|
<span>{{ scope.row.stockNum }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="爆竹类（箱）" prop="firecracker" align="center" sortable="custom">
|
<template slot-scope="scope">
|
<span>{{ scope.row.firecracker }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="喷花类（箱）" prop="spray" align="center" sortable="custom">
|
<template slot-scope="scope">
|
<span>{{ scope.row.spray }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="旋转类（箱）" prop="rotation" align="center" sortable="custom">
|
<template slot-scope="scope">
|
<span>{{ scope.row.rotation }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="吐珠类（箱）" prop="bead" align="center" sortable="custom">
|
<template slot-scope="scope">
|
<span>{{ scope.row.bead }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="玩具类（箱）" prop="toy" align="center" sortable="custom">
|
<template slot-scope="scope">
|
<span>{{ scope.row.toy }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="组合烟花类（箱）" prop="combined" align="center" sortable="custom">
|
<template slot-scope="scope">
|
<span>{{ scope.row.combined }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="更新时间" prop="updateat" align="center" sortable="custom">
|
<template slot-scope="scope">
|
<span>{{ scope.row.updateat }}</span>
|
</template>
|
</el-table-column>
|
</el-table>
|
<br>
|
<el-pagination
|
v-show="recordTotal>0"
|
:current-page="currentPage"
|
:page-sizes="[30, 50, 100, 200]"
|
:page-size="pageSize"
|
:total="recordTotal"
|
layout="total, sizes, prev, pager, next, jumper"
|
background
|
style="float:right;"
|
@size-change="handleSizeChange"
|
@current-change="handleCurrentChange"
|
/>
|
<br>
|
</div>
|
</div>
|
|
</template>
|
|
<script>
|
import {getManufacturerTree} from "../../api/product";
|
import {computePageCount, parseTime} from "../../utils";
|
import {parseError} from "../../utils/messageDialog";
|
import {clearStock, enterpriseStockList, refreshStock} from "../../api/stock";
|
import Cookies from 'js-cookie'
|
import {getCityListData, getProvinceListData} from "../../api/area";
|
import {dictionaryAllItems} from "../../api/dictionary";
|
import {mapGetters} from "vuex";
|
|
export default {
|
name: "enterpriseStock",
|
data(){
|
return{
|
pageSize: 30,
|
recordTotal: 0,
|
currentPage: 1,
|
pageTotal: 0,
|
tableKey: 0,
|
stockData:[],
|
selectData:[],
|
listLoading: true,
|
manufacturerTree:[],
|
provinceList:[],
|
cityList:[],
|
districtList:[],
|
streetList:[],
|
committeeList:[],
|
checkTypeList:[],
|
dateRange:[],
|
licenseValidList:[{id:1,text:'有效'},{id:0, text:'无效'}],
|
isSupervision : Cookies.get('isSupervision'),
|
queryForm: {
|
name: '',
|
beginDate:'',
|
endDate:'',
|
province:'',
|
city:'',
|
|
|
area:'',
|
town:'',
|
community:'',
|
enterpriseType:'',
|
licenseValid:1,
|
},
|
totalRow:{'enterpriseName':"总计",'stockNum':0}
|
}
|
},
|
mounted(){
|
getManufacturerTree().then(res=>{
|
this.manufacturerTree=(res.data) ;
|
});
|
this.queryDateHandle();
|
this.getDictionaryCheckType();
|
if (this.isSupervision === 'null'){
|
this.queryForm.enterpriseType = "烟花爆竹批发经营"
|
}
|
this.getStockList()
|
this.getProvince();
|
},
|
computed: {
|
...mapGetters([
|
'userType',
|
'username'
|
]),
|
stockTotalData(){
|
const tbody = this.stockData
|
this.totalRow['enterpriseName'] = this.totalRow.name
|
return tbody.length ?[...tbody,this.totalRow]:[]
|
}
|
},
|
methods:{
|
getStockList(){
|
const _this = this;
|
_this.queryForm.beginDate = _this.formatTime(_this.dateRange[0]);
|
_this.queryForm.endDate = _this.formatTime(_this.dateRange[1]);
|
const params = {};
|
params['pageIndex'] = _this.currentPage;
|
params['pageSize'] = _this.pageSize;
|
params['sort'] = _this.sort;
|
params['order'] = _this.order;
|
params['operator'] = Cookies.get('userName') ;
|
params['licenseValid'] = Cookies.get('userName') ;
|
for (const i in _this.queryForm) {
|
params[i] = _this.queryForm[i]
|
}
|
_this.listLoading = true;
|
enterpriseStockList(params).then(response => {
|
const res = response.data;
|
if (res.code === "200") {
|
const result = res.result;
|
_this.recordTotal = result.totalCount;
|
_this.pageSize = result.pageSize;
|
_this.pageTotal = computePageCount(result.totalCount, result.pageSize);
|
_this.currentPage = result.pageIndex;
|
_this.stockData = result.result
|
_this.totalRow = result.extension
|
} else {
|
parseError({error: res.message, vm: _this})
|
}
|
_this.listLoading = false;
|
}).catch(error => {
|
_this.listLoading = false;
|
parseError({error: error, vm: _this})
|
})
|
},
|
showDetail(owner){
|
this.$router.push({path:'/stockInfo/info',query:{owner:owner,beginDate:this.queryForm.beginDate,endDate:this.queryForm.endDate}})
|
},
|
refreshHandle: function () {
|
refreshStock().then(response => {
|
const res = response.data
|
if (res.code === "200") {
|
this.dialogFormVisible = false
|
this.$message({
|
message: '刷新成功',
|
type: 'success'
|
});
|
this.getStockList()
|
} else {
|
parseError({error: res.message, vm: _this})
|
}
|
}).catch(error => {
|
parseError({error: error, vm: _this})
|
})
|
},
|
queryHandle: function () {
|
this.currentPage = 1;
|
this.getStockList();
|
},
|
handleSizeChange: function (val) {
|
this.pageSize = val;
|
this.currentPage = 1;
|
this.getStockList();
|
},
|
handleCurrentChange: function (val) {
|
this.currentPage = val;
|
this.getStockList();
|
},
|
sortChange(param){
|
this.sort = param.prop;
|
this.order = param.order;
|
this.getStockList();
|
},
|
//获取省
|
async getProvince(){
|
let res = await getProvinceListData()
|
if(res.data.code === "200"){
|
this.provinceList = res.data.result.provinceList
|
}
|
},
|
async changeArea(value){
|
if(value === 'province'){
|
this.queryForm.city = ''
|
this.queryForm.area = ''
|
this.queryForm.town = ''
|
this.queryForm.community = ''
|
this.areaListQuery = {
|
type: 2,
|
parenttype: 1,
|
parentname: this.queryForm.province,
|
}
|
let res = await getCityListData(this.areaListQuery)
|
if(res.data.code === "200"){
|
this.cityList = res.data.result
|
}
|
}else if(value === 'city'){
|
this.queryForm.area = ''
|
this.queryForm.town = ''
|
this.queryForm.community = ''
|
this.areaListQuery = {
|
type: 3,
|
parenttype: 2,
|
parentname: this.queryForm.city,
|
}
|
let res = await getCityListData(this.areaListQuery)
|
if(res.data.code === "200"){
|
this.districtList = res.data.result
|
}
|
}else if(value === 'area'){
|
this.queryForm.town = ''
|
this.queryForm.community = ''
|
this.areaListQuery = {
|
type: 4,
|
parenttype: 3,
|
parentname: this.queryForm.area,
|
}
|
let res = await getCityListData(this.areaListQuery)
|
if(res.data.code === "200"){
|
this.streetList = res.data.result
|
}
|
}else if(value === 'town'){
|
this.queryForm.community = '';
|
this.areaListQuery = {
|
type: 5,
|
parenttype: 4,
|
parentname: this.queryForm.town,
|
}
|
let res = await getCityListData(this.areaListQuery)
|
if(res.data.code === "200"){
|
this.committeeList = res.data.result
|
}
|
}
|
},//市、镇、街道、委员会
|
getDictionaryCheckType() {
|
const _this = this;
|
if (_this.checkTypeList && _this.checkTypeList.length > 0) {
|
return
|
}
|
const params = {};
|
params['dictionaryType'] = '安全监管分类';
|
dictionaryAllItems(params).then(response => {
|
const res = response.data;
|
if (res.code === "200") {
|
_this.checkTypeList = res.result
|
} else {
|
parseError({ error: res.message, vm: _this })
|
}
|
}).catch(error => {
|
parseError({ error: error, vm: _this })
|
})
|
},
|
|
clearHandle(){
|
const _selectData = this.$refs.multipleTable.selection;
|
let owners = "";
|
let count = 0;
|
if (_selectData == null || _selectData.length < 1){
|
parseError({ error: "未选中企业信息", vm: this })
|
}
|
_selectData.forEach(item =>{
|
if (item.enterpriseName !== '总计'){
|
owners += item.owner;
|
owners += ",";
|
count++;
|
}
|
});
|
this.$confirm('此操作将永久清除选中的 '+count+' 家企业库存, 是否继续?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
}).then(() => {
|
const params = {}
|
params['owners'] = owners;
|
clearStock(params).then(response =>{
|
const res = response.data;
|
if (res.code === "200") {
|
const result = res.result;
|
this.$message({
|
type: 'success',
|
message: '删除成功!'
|
});
|
}
|
});
|
|
}).catch(() => {
|
this.$message({
|
type: 'info',
|
message: '已取消删除'
|
});
|
});
|
},
|
handleSelectionChange(val){
|
this.selectData = val
|
},
|
queryDateHandle(){
|
const end = new Date();
|
const start = new Date();
|
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
|
start.setHours(0);
|
start.setMinutes(0);
|
start.setSeconds(0);
|
this.dateRange.push(start,end);
|
this.queryForm.beginDate = start;
|
this.queryForm.endDate = end;
|
},
|
exportAllHandle () {
|
const _this = this;
|
const params = {};
|
params['pageIndex'] = 1;
|
params['pageSize'] = 100000;
|
params['sort'] = _this.sort;
|
params['order'] = _this.order;
|
const userName = Cookies.get('userName');
|
const name = Cookies.get('name');
|
params['operator'] = name + '(' + userName + ')';
|
for (const i in _this.queryForm) {
|
if (_this.queryForm[i] != undefined && _this.queryForm[i].toString() !== '') {
|
params[i] = _this.queryForm[i]
|
}
|
}
|
enterpriseStockList(params).then(response => {
|
const res = response.data;
|
if (res.code === "200") {
|
const allData = res.result.result;
|
if (allData.length == 0) {
|
parseError({ error: '当前没有数据', vm: _this });
|
return
|
}
|
allData.push(this.totalRow)
|
import('@/vendor/Export2Excel').then(excel => {
|
const tHeader = ['企业名称','地区', '库存总数（箱）','爆竹类（箱）','喷花类（箱）','旋转类（箱）','吐珠类（箱）','玩具类（箱）','组合烟花类（箱）'];
|
// const filterVal = ['enterpriseName', 'stockNum'];
|
|
const data = allData.map(item=>{
|
return [
|
item.enterpriseName,
|
[item.province,item.city,item.district].filter(item=>item!=="" &item!=null).join("-"),
|
item.stockNum,
|
item.firecracker,
|
item.spray,
|
item.rotation,
|
item.bead,
|
item.toy,
|
item.combined,
|
]
|
})
|
excel.export_json_to_excel({
|
header: tHeader,
|
data,
|
filename: '库存汇总'
|
})
|
})
|
} else {
|
parseError({ error: res.message, vm: _this })
|
}
|
}).catch(error => {
|
parseError({ error: error, vm: _this })
|
})
|
},
|
|
formatJson(filterVal, jsonData) {
|
return jsonData.map((v) =>
|
filterVal.map((j) => {
|
if (j === 'createddate') {
|
return parseTime(v[j], '{y}-{m}-{d}')
|
}else {
|
return v[j]
|
}
|
})
|
)
|
},
|
formatTime: function(value) {
|
let date = new Date(value);
|
let y = date.getFullYear();
|
let MM = date.getMonth() + 1;
|
MM = MM < 10 ? "0" + MM : MM;
|
let d = date.getDate();
|
d = d < 10 ? "0" + d : d;
|
let h = date.getHours();
|
h = h < 10 ? "0" + h : h;
|
let m = date.getMinutes();
|
m = m < 10 ? "0" + m : m;
|
let s = date.getSeconds();
|
s = s < 10 ? "0" + s : s;
|
return y + "-" + MM + "-" + d + " " + h + ":" + m + ":" + s;
|
}
|
},
|
|
}
|
</script>
|
|
<style scoped>
|
.basic_search{
|
display:inline-block;
|
}
|
</style>
|
