460 行
20 KiB
HTML
可执行文件
460 行
20 KiB
HTML
可执行文件
<!doctype html>
|
|
<html>
|
|
<!--[1.7.90]-->
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport"
|
|
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
|
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
|
<title>库存报表</title>
|
|
<link rel="stylesheet" href="__PUBLIC__/vue/element-ui.css">
|
|
<link rel="stylesheet" href="/Public/css/component-serial.css?v=1.0.0">
|
|
<style>
|
|
[v-cloak] {
|
|
display: none;
|
|
}
|
|
|
|
/* 对齐表格 */
|
|
.el-table th.gutter {
|
|
display: table-cell !important;
|
|
}
|
|
|
|
.time {
|
|
font-size: 13px;
|
|
color: #999;
|
|
margin: auto 1px;
|
|
}
|
|
|
|
.demo-table-expand {
|
|
font-size: 0;
|
|
}
|
|
|
|
.demo-table-expand label {
|
|
width: 90px;
|
|
color: #99a9bf;
|
|
}
|
|
|
|
.demo-table-expand .el-form-item {
|
|
margin-right: 0;
|
|
margin-bottom: 0;
|
|
width: 100%;
|
|
}
|
|
|
|
.tip {
|
|
padding: 8px 16px;
|
|
background-color: #ecf8ff;
|
|
border-radius: 4px;
|
|
border-left: 5px solid #50bfff;
|
|
font-size: 14px;
|
|
color: #409EFF;
|
|
}
|
|
|
|
.clearfix {
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
margin-top: 5px;
|
|
}
|
|
|
|
.seek {
|
|
margin-right: 10px;
|
|
margin-top: 10px;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.seek_input {
|
|
width: 190px;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<div id="app" v-cloak style="margin-left: 5px;">
|
|
<div class="tip">
|
|
<p>注：规格商品每种规格定义为一种商品，例：毛衣红、黄、蓝即为三种商品展示</p>
|
|
</div>
|
|
<div style="display: flex;padding-bottom: 10px;flex-wrap: wrap;">
|
|
<div class="seek">
|
|
<el-input class="seek_input" v-model="seek_data.goods_name" placeholder="商品名称" clearable size="small">
|
|
</el-input>
|
|
</div>
|
|
<div class="seek">
|
|
<el-input class="seek_input" v-model="seek_data.keyword" placeholder="货号/条码" clearable size="small">
|
|
</el-input>
|
|
</div>
|
|
<div class="seek">
|
|
<el-cascader class="seek_input" v-model="seek_data.class_ids" :props="props" :options="class_data"
|
|
:change-on-select="true" :clearable="true" expand-trigger="hover" size="small" placeholder="商品分类">
|
|
</el-cascader>
|
|
</div>
|
|
<div class="seek">
|
|
<el-select class="seek_input" v-model="seek_data.supplier_id" clearable placeholder="供货商" size="small">
|
|
<el-option v-for="(val,index) in supplier" :label="val.supplier_name" :value="val.id" :key="index">
|
|
</el-option>
|
|
</el-select>
|
|
</div>
|
|
<div class="seek">
|
|
<el-select class="seek_input" v-model="seek_data.goods_brand_id" clearable placeholder="品牌"
|
|
size="small">
|
|
<el-option v-for="(val,index) in goods_brand" :label="val.name" :value="val.id" :key="index">
|
|
</el-option>
|
|
</el-select>
|
|
</div>
|
|
<div class="seek">
|
|
<el-select class="seek_input" v-model="seek_data.pricing_method" size="small" clearable placeholder="类型"
|
|
size="small">
|
|
<el-option v-for="(val,index) in exchange_weigh" :label="val.name" :value="val.type" :key="index">
|
|
</el-option>
|
|
</el-select>
|
|
</div>
|
|
<div class="seek">
|
|
<el-button type="primary" @click="seek" size="small">查询</el-button>
|
|
</div>
|
|
<div class="seek">
|
|
<el-button type="primary" @click="reset" size="small">重置</el-button>
|
|
</div>
|
|
<div class="seek">
|
|
<el-button type="primary" @click="exportExcel" size="small">导出</el-button>
|
|
</div>
|
|
</div>
|
|
<el-row :gutter="12">
|
|
<el-col :span="5">
|
|
<el-card shadow="always" :body-style="{ padding: '0px' }">
|
|
<div style="padding: 14px;">
|
|
<span style="color: #999;">商品合计</span>
|
|
<div class="bottom clearfix">
|
|
<span class="time">{{total}}</span>
|
|
<span class="time">（种）</span>
|
|
</div>
|
|
</div>
|
|
</el-card>
|
|
</el-col>
|
|
<el-col :span="5">
|
|
<el-card shadow="always" :body-style="{ padding: '0px' }">
|
|
<div style="padding: 14px;">
|
|
<span style="color: #999;">库存合计</span>
|
|
<div class="bottom clearfix">
|
|
<span class="time">{{not_weigh_stock}}</span>
|
|
<span class="time">（非称重）</span>
|
|
<span class="time">{{weigh_stock}}</span>
|
|
<span class="time">（称重）</span>
|
|
</div>
|
|
</div>
|
|
</el-card>
|
|
</el-col>
|
|
<el-col :span="5">
|
|
<el-card shadow="always" :body-style="{ padding: '0px' }">
|
|
<div style="padding: 14px;">
|
|
<span style="color: #999;">进价合计</span>
|
|
<div class="bottom clearfix">
|
|
<span class="time">{{purchase_price}}</span>
|
|
<span class="time">（元）</span>
|
|
</div>
|
|
</div>
|
|
</el-card>
|
|
</el-col>
|
|
<el-col :span="5">
|
|
<el-card shadow="always" :body-style="{ padding: '0px' }">
|
|
<div style="padding: 14px;">
|
|
<span style="color: #999;">售出合计</span>
|
|
<div class="bottom clearfix">
|
|
<span class="time">{{retail_price_total}}</span>
|
|
<span class="time">（店）</span>
|
|
<span class="time">{{online_price_total}}</span>
|
|
<span class="time">（商）</span>
|
|
</div>
|
|
</div>
|
|
</el-card>
|
|
</el-col>
|
|
</el-row>
|
|
<template>
|
|
<el-tabs v-model="tab" @tab-click="close_tab">
|
|
<el-tab-pane label="普通商品" name="common"></el-tab-pane>
|
|
<el-tab-pane label="规格商品" name="sku"></el-tab-pane>
|
|
</el-tabs>
|
|
<el-table :data="goods_list" border size="mini" max-height="500">
|
|
<el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
|
|
<el-table-column prop="goods_name" label="商品名称" :show-overflow-tooltip="true" min-width="150">
|
|
</el-table-column>
|
|
<el-table-column prop="class_name" label="商品分类" :show-overflow-tooltip="true" min-width="150">
|
|
</el-table-column>
|
|
<el-table-column prop="goods_number" label="货号" :show-overflow-tooltip="true"></el-table-column>
|
|
<el-table-column label="库存" width="90" :show-overflow-tooltip="true">
|
|
<template slot-scope="scope">
|
|
<el-button type="text" size="mini" @click="detailsSerial(scope.$index)"
|
|
v-if="scope.row.serial_number_state == 1 && scope.row.stock > 0">
|
|
{{scope.row.stock}}
|
|
</el-button>
|
|
<span v-else>{{scope.row.stock}}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="进价" align="center" min-width="120">
|
|
<el-table-column prop="purchase_price" label="单件" :show-overflow-tooltip="true"></el-table-column>
|
|
<el-table-column prop="all_purchase" label="统计" :show-overflow-tooltip="true"></el-table-column>
|
|
</el-table-column>
|
|
<el-table-column label="售价" align="center" min-width="120">
|
|
<el-table-column prop="retail_price" label="店内" :show-overflow-tooltip="true"></el-table-column>
|
|
<el-table-column prop="online_price" label="商城" :show-overflow-tooltip="true"></el-table-column>
|
|
</el-table-column>
|
|
<el-table-column label="预售合计" align="center" min-width="150">
|
|
<el-table-column prop="sell_retail_total" label="店内" :show-overflow-tooltip="true">
|
|
</el-table-column>
|
|
<el-table-column prop="sell_online_total" label="商城" :show-overflow-tooltip="true">
|
|
</el-table-column>
|
|
</el-table-column>
|
|
<el-table-column label="会员价" align="center" min-width="140">
|
|
<el-table-column prop="store_mem_price" label="店内" :show-overflow-tooltip="true"></el-table-column>
|
|
<el-table-column prop="shop_mem_price" label="商城" :show-overflow-tooltip="true"></el-table-column>
|
|
</el-table-column>
|
|
<el-table-column prop="source_name" label="渠道" width="100" :show-overflow-tooltip="true">
|
|
</el-table-column>
|
|
<el-table-column prop="exchange_weigh_type" label="类型" width="70" :show-overflow-tooltip="true">
|
|
</el-table-column>
|
|
<el-table-column prop="supplier_name" label="供货商" :show-overflow-tooltip="true" width="80">
|
|
</el-table-column>
|
|
<el-table-column prop="goods_brand_name" label="品牌" :show-overflow-tooltip="true"></el-table-column>
|
|
</el-table>
|
|
<el-pagination @size-change="size_change" @current-change="current_change" :current-page.sync="page"
|
|
layout="total, sizes, prev, pager, next, jumper" :pager-count="5"
|
|
:page-sizes="[10,20,30,40,50,60,70,80,90]" :page-size="10" :total="total">
|
|
</el-pagination>
|
|
</template>
|
|
<component-serial :visible.sync="serialVisible" :parent-data="serialGoodsData"
|
|
get-data-type="inventoryStatisticsReport">
|
|
</component-serial>
|
|
</div>
|
|
</body>
|
|
<script src="__PUBLIC__/jquery/js/jquery-3.2.1.min.js"></script>
|
|
<script src="__PUBLIC__/vue/js/vue2.5.16.js"></script>
|
|
<script src="__PUBLIC__/vue/element-ui.js"></script>
|
|
<script src="/Public/js/component-serial.js?v=1.0.0"></script>
|
|
<script src="/Public/js/common.js"></script>
|
|
<script>
|
|
var app = new Vue({
|
|
el: '#app',
|
|
data: function () {
|
|
return {
|
|
store_id: '', // 门店id
|
|
tab: 'common', // tab 选项
|
|
goods_list: [], // 商品列表
|
|
class_data: [], // 分类数据
|
|
supplier: [], // 供货商
|
|
goods_brand: [], // 商品品牌
|
|
seek_data: { // 搜索数据
|
|
goods_name: '', // 商品名称
|
|
keyword: '', // 商品货号、条码
|
|
class_ids: [], // 商品分类
|
|
supplier_id: '', // 供货商id
|
|
goods_brand_id: '', // 品牌id
|
|
pricing_method: '', // 是否称重 1. 非称重 2. 称重
|
|
},
|
|
page: 1, // 分页
|
|
limit: 10, // 每页显示条数
|
|
total: 0, // 总数 int类型
|
|
weigh_stock: 0, // 称重
|
|
not_weigh_stock: 0, // 非称重
|
|
purchase_price: 0, // 成本
|
|
retail_price_total: 0, // 店内售出总和
|
|
online_price_total: 0, // 商城 售出总和
|
|
props: { // 定义层级选择器
|
|
'value': 'id',
|
|
'label': 'class_name',
|
|
},
|
|
exchange_weigh: [ // 销售类型
|
|
{type: 1, name: '非称重'},
|
|
{type: 2, name: '称重'}],
|
|
serialVisible: false, //串号录入窗口开关
|
|
serialGoodsData: {}, //串号录入当前商品数据对象
|
|
};
|
|
},
|
|
|
|
methods: {
|
|
|
|
/* tab 选项 */
|
|
close_tab() {
|
|
if (this.tab == 'common') {
|
|
this.page = 1;
|
|
this.get_goods_list();
|
|
} else {
|
|
this.page = 1;
|
|
this.get_sku_list();
|
|
}
|
|
},
|
|
|
|
/* 获取搜索条件 */
|
|
get_seek_list() {
|
|
var that = this;
|
|
$.ajax({
|
|
url: "{:U('get_seek_list')}",
|
|
type: "post",
|
|
data: {store_id: that.store_id},
|
|
success: function (res) {
|
|
that.class_data = res.class_data;
|
|
that.supplier = res.supplier;
|
|
that.goods_brand = res.goods_brand;
|
|
that.guide = res.guide;
|
|
}
|
|
})
|
|
},
|
|
|
|
/* 获取普通商品 */
|
|
get_goods_list() {
|
|
var that = this;
|
|
var loading = that.$loading({
|
|
lock: true,
|
|
text: '数据获取中，请等待...',
|
|
spinner: 'el-icon-loading',
|
|
background: 'rgba(255, 255, 255, 0.7)'
|
|
});
|
|
$.ajax({
|
|
url: "{:U('getGoodsList')}",
|
|
type: "post",
|
|
data: {store_id: that.store_id, page: that.page, limit: that.limit, seek_data: that.seek_data},
|
|
success: function (res) {
|
|
loading.close();
|
|
if (res.status == 1) {
|
|
that.goods_list = res.goods_list;
|
|
that.total = res.total;
|
|
that.purchase_price = res.purchase_price;
|
|
that.weigh_stock = res.weigh_stock;
|
|
that.not_weigh_stock = res.not_weigh_stock;
|
|
that.retail_price_total = res.retail_price_total;
|
|
that.online_price_total = res.online_price_total;
|
|
} else {
|
|
that.clearGoodsList();
|
|
}
|
|
}
|
|
})
|
|
},
|
|
|
|
/* 获取规格商品 */
|
|
get_sku_list() {
|
|
var that = this;
|
|
var loading = that.$loading({
|
|
lock: true,
|
|
text: '数据获取中，请等待...',
|
|
spinner: 'el-icon-loading',
|
|
background: 'rgba(255, 255, 255, 0.7)'
|
|
});
|
|
$.ajax({
|
|
url: "{:U('getSkuGoodsList')}",
|
|
type: "post",
|
|
data: {store_id: that.store_id, page: that.page, limit: that.limit, seek_data: that.seek_data},
|
|
success: function (res) {
|
|
loading.close();
|
|
if (res.status == 1) {
|
|
that.goods_list = res.goods_list;
|
|
that.total = res.total;
|
|
that.purchase_price = res.purchase_price;
|
|
that.weigh_stock = res.weigh_stock;
|
|
that.not_weigh_stock = res.not_weigh_stock;
|
|
that.retail_price_total = res.retail_price_total;
|
|
that.online_price_total = res.online_price_total;
|
|
} else {
|
|
that.clearGoodsList();
|
|
}
|
|
}
|
|
})
|
|
},
|
|
|
|
/* 切换每页数量 */
|
|
size_change(val) {
|
|
this.limit = val;
|
|
this.page = 1;
|
|
if (this.tab == 'common') {this.get_goods_list();}
|
|
else {this.get_sku_list();}
|
|
|
|
},
|
|
|
|
/* 切换页数 */
|
|
current_change(val) {
|
|
this.page = val;
|
|
if (this.tab == 'common') {this.get_goods_list();}
|
|
else {this.get_sku_list();}
|
|
},
|
|
|
|
/* 重置表单 */
|
|
reset() {
|
|
this.page = 1;
|
|
this.seek_data.goods_name = '';
|
|
this.seek_data.keyword = '';
|
|
this.seek_data.class_ids = [];
|
|
this.seek_data.supplier_id = '';
|
|
this.seek_data.goods_brand_id = '';
|
|
this.seek_data.pricing_method = '';
|
|
/* 重新加载 */
|
|
if (this.tab == 'common') {
|
|
this.get_goods_list();
|
|
} else {
|
|
this.get_sku_list();
|
|
}
|
|
},
|
|
|
|
/* 搜索 */
|
|
seek() {
|
|
this.page = 1;
|
|
if (this.tab == 'common') {
|
|
this.get_goods_list();
|
|
} else {
|
|
this.get_sku_list();
|
|
}
|
|
},
|
|
|
|
/* 清除数据 */
|
|
clearGoodsList() {
|
|
this.goods_list = [];
|
|
this.total = 0;
|
|
this.purchase_price = 0;
|
|
this.weigh_stock = 0;
|
|
this.not_weigh_stock = 0;
|
|
this.retail_price_total = 0;
|
|
this.online_price_total = 0;
|
|
},
|
|
|
|
/* 导出 */
|
|
exportExcel() {
|
|
var goods_type = this.tab == 'common' ? '普通商品' : '规格商品';
|
|
var type = this.tab == 'common' ? 1 : 2;
|
|
if (!this.seek_data.goods_name && !this.seek_data.keyword && this.seek_data.class_ids.length <= 0 && !this.seek_data.supplier_id && !this.seek_data.goods_brand_id && !this.seek_data.pricing_method) {
|
|
this.$confirm('确定导出所有' + goods_type + '数据吗？', '提示', {
|
|
confirmButtonText: '确定',
|
|
cancelButtonText: '取消',
|
|
type: 'warning'
|
|
}).then(() => {
|
|
window.location.href = "{:U('stock_export')}?type=" + type + "&store_id=" + this.store_id;
|
|
});
|
|
} else {
|
|
window.location.href = "{:U('stock_export')}?type=" + type + "&store_id=" + this.store_id + "&seek_data=" + JSON.stringify(this.seek_data);
|
|
}
|
|
},
|
|
/**
|
|
* @description: 打开串号详情窗口
|
|
* @param {Number} index: 当前商品索引
|
|
*/
|
|
detailsSerial(index) {
|
|
this.serialVisible = true
|
|
this.serialGoodsData = this.goods_list[index]
|
|
this.serialGoodsData.store_id = this.store_id
|
|
},
|
|
},
|
|
|
|
created: function () {
|
|
// 接受参数
|
|
var store_id = "{$store_id}";
|
|
if (!store_id || store_id == 0) {
|
|
this.$message({
|
|
showClose: true,
|
|
message: '系统异常,请重新登录',
|
|
type: 'error'
|
|
});
|
|
return false;
|
|
}
|
|
this.store_id = store_id;
|
|
this.get_goods_list();
|
|
this.get_seek_list();
|
|
},
|
|
})
|
|
</script>
|
|
|
|
</html> |