feat: #10000 暂存
This commit is contained in:
parent
2044dd4d6b
commit
83afb5dcd0
16589
resources/frontend/package-lock.json
generated
16589
resources/frontend/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -1,169 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="m-map">
|
|
||||||
<div class="search"
|
|
||||||
v-if="placeSearch">
|
|
||||||
<div id="js-result"
|
|
||||||
v-show="searchKey"
|
|
||||||
class="result"></div>
|
|
||||||
</div>
|
|
||||||
<div id="js-container"
|
|
||||||
class="map">正在加载数据 ...</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import remoteLoad from '@/util/remoteLoad.js'
|
|
||||||
window._AMapSecurityConfig = {
|
|
||||||
securityJsCode: '4c7f32be1ae23595dd423fbdf337df3f',
|
|
||||||
}
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'MapDrag',
|
|
||||||
props: {
|
|
||||||
searchKey: {
|
|
||||||
default: '',
|
|
||||||
},
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
// searchKey: "",
|
|
||||||
placeSearch: null,
|
|
||||||
dragStatus: false,
|
|
||||||
AMapUI: null,
|
|
||||||
AMap: null,
|
|
||||||
city: '',
|
|
||||||
geolocation: null,
|
|
||||||
}
|
|
||||||
},
|
|
||||||
watch: {
|
|
||||||
searchKey() {
|
|
||||||
if (this.searchKey === '') {
|
|
||||||
this.placeSearch.clear()
|
|
||||||
}
|
|
||||||
},
|
|
||||||
},
|
|
||||||
async created() {
|
|
||||||
// 已载入高德地图API，则直接初始化地图
|
|
||||||
if (window.AMap && window.AMapUI) {
|
|
||||||
this.initMap()
|
|
||||||
// 未载入高德地图API，则先载入API再初始化
|
|
||||||
} else {
|
|
||||||
await remoteLoad(
|
|
||||||
'https://webapi.amap.com/maps?v=2.0&key=4b083a38fc17ad7c5e3df667931e0cf0'
|
|
||||||
)
|
|
||||||
await remoteLoad('https://webapi.amap.com/ui/1.1/main.js')
|
|
||||||
this.initMap()
|
|
||||||
}
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
// 搜索
|
|
||||||
handleSearch() {
|
|
||||||
console.log(this.searchKey, '33333oooo')
|
|
||||||
if (this.searchKey) {
|
|
||||||
this.placeSearch.search(this.searchKey)
|
|
||||||
}
|
|
||||||
},
|
|
||||||
// 实例化地图
|
|
||||||
initMap() {
|
|
||||||
// 加载PositionPicker，loadUI的路径参数为模块名中 'ui/' 之后的部分
|
|
||||||
const AMapUI = (this.AMapUI = window.AMapUI)
|
|
||||||
const AMap = (this.AMap = window.AMap)
|
|
||||||
|
|
||||||
const that = this
|
|
||||||
|
|
||||||
AMapUI.loadUI(['misc/PositionPicker'], (PositionPicker) => {
|
|
||||||
const mapConfig = {
|
|
||||||
zoom: 16,
|
|
||||||
}
|
|
||||||
const map = new AMap.Map('js-container', mapConfig)
|
|
||||||
// 获得当前定位的城市
|
|
||||||
AMap.plugin('AMap.CitySearch', function () {
|
|
||||||
const citySearch = new AMap.CitySearch()
|
|
||||||
console.log('citySearch', citySearch)
|
|
||||||
// 加载地图搜索插件
|
|
||||||
AMap.plugin('AMap.PlaceSearch', () => {
|
|
||||||
that.placeSearch = new AMap.PlaceSearch({
|
|
||||||
pageSize: 5,
|
|
||||||
pageIndex: 1,
|
|
||||||
citylimit: false,
|
|
||||||
map: map,
|
|
||||||
panel: 'js-result',
|
|
||||||
// city: that.city, // 设定搜索城市
|
|
||||||
})
|
|
||||||
AMap.Event.addListener(
|
|
||||||
that.placeSearch,
|
|
||||||
'listElementClick',
|
|
||||||
function (e) {
|
|
||||||
that.$emit('listElementClick', e)
|
|
||||||
}
|
|
||||||
)
|
|
||||||
AMap.Event.addListener(
|
|
||||||
that.placeSearch,
|
|
||||||
'markerClick',
|
|
||||||
function (e) {
|
|
||||||
that.$emit('listElementClick', e)
|
|
||||||
}
|
|
||||||
)
|
|
||||||
})
|
|
||||||
// citySearch.getLocalCity(function (status, result) {
|
|
||||||
// console.log('getLocalCity', status, result)
|
|
||||||
// if (status === 'complete' && result.info === 'OK') {
|
|
||||||
// // 查询成功，result即为当前所在城市信息
|
|
||||||
// that.city = result.adcode
|
|
||||||
// }
|
|
||||||
// })
|
|
||||||
})
|
|
||||||
// 启用工具条
|
|
||||||
AMap.plugin(
|
|
||||||
['AMap.ToolBar', 'AMap.Scale', 'AMap.Geolocation'],
|
|
||||||
function () {
|
|
||||||
map.addControl(
|
|
||||||
new AMap.ToolBar({
|
|
||||||
position: 'RB',
|
|
||||||
})
|
|
||||||
)
|
|
||||||
map.addControl(
|
|
||||||
new AMap.Scale({
|
|
||||||
position: 'LB',
|
|
||||||
})
|
|
||||||
)
|
|
||||||
}
|
|
||||||
)
|
|
||||||
// 创建地图拖拽
|
|
||||||
const positionPicker = new PositionPicker({
|
|
||||||
mode: 'dragMap', // 设定为拖拽地图模式，可选'dragMap'、'dragMarker'，默认为'dragMap'
|
|
||||||
map: map, // 依赖地图对象
|
|
||||||
})
|
|
||||||
|
|
||||||
// 启动拖放
|
|
||||||
positionPicker.start()
|
|
||||||
})
|
|
||||||
},
|
|
||||||
},
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="css" scoped>
|
|
||||||
.m-map {
|
|
||||||
max-width: 700px;
|
|
||||||
max-height: 462px;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
.m-map .map {
|
|
||||||
min-width: 700px;
|
|
||||||
min-height: 462px;
|
|
||||||
}
|
|
||||||
.m-map .search {
|
|
||||||
position: absolute;
|
|
||||||
top: 10px;
|
|
||||||
left: 10px;
|
|
||||||
width: 285px;
|
|
||||||
z-index: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.m-map .result {
|
|
||||||
max-height: 300px;
|
|
||||||
overflow: auto;
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
1
resources/frontend/src/main.js
vendored
1
resources/frontend/src/main.js
vendored
@ -6,7 +6,6 @@ import ElementUI from "element-ui";
|
|||||||
import "element-ui/lib/theme-chalk/index.css";
|
import "element-ui/lib/theme-chalk/index.css";
|
||||||
import "@/css/style.css";
|
import "@/css/style.css";
|
||||||
import "./router/index2";
|
import "./router/index2";
|
||||||
import axios from "axios";
|
|
||||||
|
|
||||||
// import Router from 'vue-router'
|
// import Router from 'vue-router'
|
||||||
// const routerPush = Router.prototype.push
|
// const routerPush = Router.prototype.push
|
||||||
|
|||||||
8
resources/frontend/src/router/index1.js
vendored
8
resources/frontend/src/router/index1.js
vendored
@ -11,7 +11,7 @@ const list = [
|
|||||||
{
|
{
|
||||||
path: "GOODS_LIST",
|
path: "GOODS_LIST",
|
||||||
name: "商品列表",
|
name: "商品列表",
|
||||||
component: () => import("../views/yingyeting/yingyeting.vue"),
|
component: () => import("../views/goods/goods.vue"),
|
||||||
meta: {
|
meta: {
|
||||||
keepAlive: true,
|
keepAlive: true,
|
||||||
},
|
},
|
||||||
@ -44,17 +44,17 @@ const list = [
|
|||||||
{
|
{
|
||||||
path: "SYSTEM_LOG",
|
path: "SYSTEM_LOG",
|
||||||
name: "系统日志",
|
name: "系统日志",
|
||||||
component: () => import("../views/shuju/shuju.vue"),
|
component: () => import("../views/logs/logs.vue"),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: "GOODS_LOG",
|
path: "GOODS_LOG",
|
||||||
name: "商品记录",
|
name: "商品记录",
|
||||||
component: () => import("../views/shuju/record.vue"),
|
component: () => import("../views/logs/record.vue"),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: "ADDGOODS",
|
path: "ADDGOODS",
|
||||||
name: "新建商品",
|
name: "新建商品",
|
||||||
component: () => import("../views/yingyeting/addgoods/addgoods.vue"),
|
component: () => import("../views/goods/addgoods/addgoods.vue"),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: "/",
|
path: "/",
|
||||||
|
|||||||
968
resources/frontend/src/views/goods/goods.vue
Normal file
968
resources/frontend/src/views/goods/goods.vue
Normal file
@ -0,0 +1,968 @@
|
|||||||
|
<template>
|
||||||
|
<!-- 商品管理页面 -->
|
||||||
|
<div>
|
||||||
|
<!-- 条件筛选板块 -->
|
||||||
|
<el-card :body-style="{ padding: '20px 20px 0 20px' }">
|
||||||
|
<div class="goods">
|
||||||
|
<el-form ref="form" :inline="true" :model="form">
|
||||||
|
<el-form-item label="商品名称:">
|
||||||
|
<el-input v-model="form.goods_title" placeholder="商品名称" style="width: 100px">
|
||||||
|
</el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="商品种类:">
|
||||||
|
<el-select v-model="form.type_id" placeholder="商品种类" style="width: 125px">
|
||||||
|
<el-option v-for="item in cate" :key="item.id" :label="item.name" :value="item.id">
|
||||||
|
</el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="商品规格:">
|
||||||
|
<el-input v-model="form.sku_title" placeholder="商品规格" style="width: 100px">
|
||||||
|
</el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="商品品牌:">
|
||||||
|
<el-select v-model="form.brand_id" placeholder="商品品牌" style="width: 125px">
|
||||||
|
<el-option v-for="item in brand" :key="item.id" :label="item.name" :value="item.id">
|
||||||
|
</el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="商品状态:">
|
||||||
|
<el-select v-model="form.status" placeholder="商品状态" style="width: 115px">
|
||||||
|
<el-option v-for="item in options" :key="item.id" :label="item.label" :value="item.id">
|
||||||
|
</el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-select v-model="form.keyword_type"
|
||||||
|
style="width: 80px; margin-right: 5px; margin-left: 10px">
|
||||||
|
<el-option v-for="item in options3" :key="item.value" :label="item.label"
|
||||||
|
:value="item.value">
|
||||||
|
</el-option>
|
||||||
|
</el-select>
|
||||||
|
<el-date-picker v-model="value1" type="datetimerange" range-separator="至"
|
||||||
|
start-placeholder="开始时间" end-placeholder="结束时间" value-format="yyyy-MM-dd HH:mm:ss"
|
||||||
|
@change="getSTime" style="width: 300px">
|
||||||
|
</el-date-picker>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="primary" @click="handleChoose()">筛选</el-button>
|
||||||
|
<el-button plain @click="handleReChoose()">重置筛选</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
</el-card>
|
||||||
|
|
||||||
|
<el-card style="margin-top: 30px">
|
||||||
|
<div>
|
||||||
|
<!-- 表格头部操作 -->
|
||||||
|
<div>
|
||||||
|
<span>全部商品(共{{ total }}条)</span>
|
||||||
|
<div class="btn">
|
||||||
|
<el-button type="primary" plain @click="addNewgoods">新建商品</el-button>
|
||||||
|
<el-button type="primary" plain @click="update()">上新</el-button>
|
||||||
|
<el-button type="primary" plain @click="onCount()">库存盘点</el-button>
|
||||||
|
<el-button type="primary" plain @click="handleImport()">导入商品</el-button>
|
||||||
|
<el-button type="primary" plain @click="handleExport()">表格导出</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 表格 -->
|
||||||
|
<el-table ref="multipleTable" :data="tableData" class="table" tooltip-effect="dark" style="width: 100%"
|
||||||
|
@selection-change="handleSelectionChange" max-height="1500">
|
||||||
|
<!-- 多选框 -->
|
||||||
|
<el-table-column type="selection" width="55"></el-table-column>
|
||||||
|
<el-table-column label="商品信息" width="300">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<div class="commodityimg">
|
||||||
|
<img :src="scope.row.goods.img_url" class="Img" />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p>{{ scope.row.goods.title }} {{ scope.row.title }}</p>
|
||||||
|
<p>
|
||||||
|
{{ scope.row.goods.goods_code + "_" + scope.row.sku_code }}
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
{{ scope.row.goods.updated_at }}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="品类">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<div>
|
||||||
|
{{ scope.row.goods.type ? scope.row.goods.type.name : "" }}
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="规格" prop="title"> </el-table-column>
|
||||||
|
<el-table-column label="品牌">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<div>
|
||||||
|
{{ scope.row.goods.brand ? scope.row.goods.brand.name : "" }}
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="two_days_ago_num" sortable label="2T">
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="yesterday_num" sortable label="1T">
|
||||||
|
</el-table-column>
|
||||||
|
|
||||||
|
<el-table-column sortable label="0T" min-width="80">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<div v-if="isShow">
|
||||||
|
<el-input v-model="scope.row.arrived_today_num11"></el-input>
|
||||||
|
</div>
|
||||||
|
<div v-else>
|
||||||
|
{{ scope.row.daily.arrived_today_num }}
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
|
||||||
|
<el-table-column prop="cost" sortable label="成本">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<div v-if="isShow">
|
||||||
|
<el-input v-model="scope.row.cost"></el-input>
|
||||||
|
</div>
|
||||||
|
<div v-else>
|
||||||
|
{{ scope.row.cost != null ? scope.row.cost : 0 }}
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
|
||||||
|
<el-table-column prop="reference_price" sortable label="售价" min-width="80">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<div v-if="scope.row.id === id">
|
||||||
|
<el-input v-model="scope.row.reference_price" @blur="reference_priceBlur(scope.row)">
|
||||||
|
</el-input>
|
||||||
|
</div>
|
||||||
|
<div v-else>
|
||||||
|
{{ scope.row.reference_price }}
|
||||||
|
<el-button slot="reference" class="btn11" @click="reference_priceClick(scope.row.id)">
|
||||||
|
<img src="../../css/img/编辑.png" />
|
||||||
|
</el-button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="num" sortable label="总量" min-width="80">
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="reserve" sortable label="预留" min-width="80">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<div v-if="scope.row.id === id1">
|
||||||
|
<el-input v-model="scope.row.reserve" @blur="reservebBlur(scope.row)"></el-input>
|
||||||
|
</div>
|
||||||
|
<div v-else>
|
||||||
|
{{ scope.row.reserve }}
|
||||||
|
</div>
|
||||||
|
<el-button slot="reference" class="btn11" @click="onreserve(scope.row.id)"><img
|
||||||
|
src="../../css/img/编辑.png" alt="" /></el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
|
||||||
|
<el-table-column sortable label="订单" min-width="80">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<div>
|
||||||
|
<span>{{ scope.row.order_goods_num }}</span>
|
||||||
|
</div>
|
||||||
|
<el-popover placement="right-start" width="200" trigger="hover"
|
||||||
|
v-if="scope.row.order_detail.length !== 0">
|
||||||
|
<div>
|
||||||
|
<span v-for="(j, index) in scope.row.order_detail" :key="index">
|
||||||
|
<div>{{ j.shop.name }}:{{ j.number }}</div>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<el-button class="btn11" type="text" slot="reference"><img src="../../css/img/眼睛.png"
|
||||||
|
alt="" />
|
||||||
|
</el-button>
|
||||||
|
</el-popover>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
|
||||||
|
<el-table-column sortable label="损耗">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<div v-if="scope.row.id === id2">
|
||||||
|
<el-input v-model="scope.row.daily.loss_num"></el-input>
|
||||||
|
</div>
|
||||||
|
<div v-else>
|
||||||
|
{{ scope.row.daily.loss_num }}
|
||||||
|
</div>
|
||||||
|
<el-popover placement="right-start" width="220" trigger="click" @hide="noBubbles">
|
||||||
|
<p>损耗:</p>
|
||||||
|
<el-input v-model="scope.row.daily.loss_num"></el-input>
|
||||||
|
<el-radio-group v-model="radio">
|
||||||
|
<el-radio disabled>原因:</el-radio>
|
||||||
|
<el-radio label="48h以上">48h以上</el-radio>
|
||||||
|
<el-radio label="到货错误">到货错误</el-radio>
|
||||||
|
<el-radio label="灰霉">灰霉</el-radio>
|
||||||
|
<el-radio label="长度">长度</el-radio>
|
||||||
|
<el-radio label="花朵">花朵</el-radio>
|
||||||
|
<el-radio label="其他">其他</el-radio>
|
||||||
|
</el-radio-group>
|
||||||
|
<div class="list_btn">
|
||||||
|
<el-button type="primary" @click="onLoss(scope.row)">保存</el-button>
|
||||||
|
</div>
|
||||||
|
<el-button slot="reference" class="btn11" @click="loss(scope.row.id)"><img
|
||||||
|
src="../../css/img/编辑.png" alt="" /></el-button>
|
||||||
|
</el-popover>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="stock" sortable label="库存">
|
||||||
|
</el-table-column>
|
||||||
|
|
||||||
|
<el-table-column prop="address" sortable label="盘点">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<div v-if="stock">
|
||||||
|
<el-input v-model="scope.row.daily.inventory"></el-input>
|
||||||
|
</div>
|
||||||
|
<el-popover placement="right-start" width="100" trigger="hover" :content="
|
||||||
|
scope.row.daily.inventory_time
|
||||||
|
? scope.row.daily.inventory_time
|
||||||
|
: ''
|
||||||
|
">
|
||||||
|
<div v-if="!stock" slot="reference">
|
||||||
|
{{ scope.row.daily.inventory }}
|
||||||
|
</div>
|
||||||
|
</el-popover>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
|
||||||
|
<el-table-column prop="status" label="状态"> </el-table-column>
|
||||||
|
<el-table-column label="操作" width="100">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<div>
|
||||||
|
<el-button type="text" @click="ejectstock(scope.row)">库存</el-button>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<el-button type="text" @click="handleEdit(scope.row.goods_id, scope.row.id)">编辑
|
||||||
|
</el-button>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<el-button type="text" @click="goodslog(scope.row)">记录</el-button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 点击库存按钮弹出框 -->
|
||||||
|
<el-dialog title="库存修改" :visible.sync="ejectstock1" width="30%"
|
||||||
|
:close-on-click-modal="false">
|
||||||
|
<el-table :data="ommodityInventory" tooltip-effect="dark" style="width: 100%"
|
||||||
|
@selection-change="handleSelectionChange">
|
||||||
|
<el-table-column prop="two_days_ago_num" label="2天前库存">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<div>
|
||||||
|
{{ scope.row.two_days_ago_num }}
|
||||||
|
<el-input v-model="scope.row.two_days_ago_num"></el-input>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="yesterday_num" label="1天前库存">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<div>
|
||||||
|
{{ scope.row.yesterday_num }}
|
||||||
|
<el-input v-model="scope.row.yesterday_num"></el-input>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column sortable label="今日到货">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<div>
|
||||||
|
{{ scope.row.daily.arrived_today_num }}
|
||||||
|
<el-input v-model="scope.row.daily.arrived_today_num"></el-input>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
|
||||||
|
<span slot="footer" class="dialog-footer">
|
||||||
|
<el-button @click="cancelStock()">取 消</el-button>
|
||||||
|
<el-button type="primary" @click="oldStock()">确 定</el-button>
|
||||||
|
</span>
|
||||||
|
</el-dialog>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 底部按钮 -->
|
||||||
|
<div class="footerBtn" v-show="isShow || stock">
|
||||||
|
<el-button type="primary" class="confirmbtn" @click="cancel()">取消</el-button>
|
||||||
|
<el-button type="primary" class="confirmbtn" @click="onSubmit()">保存</el-button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 分页功能 -->
|
||||||
|
<div class="page">
|
||||||
|
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
|
||||||
|
:current-page="current_page" :page-sizes="[15, 50, 100]" :page-size="per_page"
|
||||||
|
layout="total, sizes, prev, pager, next, jumper" :total="Paginationdata.total">
|
||||||
|
</el-pagination>
|
||||||
|
</div>
|
||||||
|
</el-card>
|
||||||
|
|
||||||
|
<!-- 参考售价弹出确认框 -->
|
||||||
|
<el-dialog :visible.sync="dialogVisible3" width="20%" :close-on-click-modal="false">
|
||||||
|
<span>您确定要修改吗?</span>
|
||||||
|
<span slot="footer" class="dialog-footer">
|
||||||
|
<el-button @click="dialogVisible3 = false">取 消</el-button>
|
||||||
|
<el-button type="primary" @click="reference_priceRequest()">确 定</el-button>
|
||||||
|
</span>
|
||||||
|
</el-dialog>
|
||||||
|
|
||||||
|
<!-- 预留量弹出框 -->
|
||||||
|
<el-dialog :visible.sync="dialogVisible4" width="20%" :close-on-click-modal="false">
|
||||||
|
<span>您确定要修改吗?</span>
|
||||||
|
<span slot="footer" class="dialog-footer">
|
||||||
|
<el-button @click="dialogVisible4 = false">取 消</el-button>
|
||||||
|
<el-button type="primary" @click="reserveRequest()">确 定</el-button>
|
||||||
|
</span>
|
||||||
|
</el-dialog>
|
||||||
|
|
||||||
|
<!-- 点击表格导出弹出框 -->
|
||||||
|
<el-dialog title="表格导出" :visible.sync="Tableexport" width="30%" :close-on-click-modal="false">
|
||||||
|
<div>
|
||||||
|
选择:
|
||||||
|
<template>
|
||||||
|
<el-select v-model="value" placeholder="盘点表/运营表/成本表">
|
||||||
|
<el-option v-for="item in options2" :key="item.value" :label="item.label" :value="item.value">
|
||||||
|
</el-option>
|
||||||
|
</el-select>
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
|
<span slot="footer" class="dialog-footer">
|
||||||
|
<el-button @click="Tableexport = false">取 消</el-button>
|
||||||
|
<el-button type="primary" @click="derivation()">确 定</el-button>
|
||||||
|
<!-- <a href="/goods_skus/export">确定</a> -->
|
||||||
|
</span>
|
||||||
|
</el-dialog>
|
||||||
|
|
||||||
|
<!-- 点击商品文件导入弹出框 -->
|
||||||
|
<el-dialog title="导入商品" :visible.sync="docImportDrawer" direction="rtl" custom-class="demo-drawer" ref="drawer"
|
||||||
|
size="20%" width="30%" @close="importForm.imFileList = []" :close-on-click-modal="false">
|
||||||
|
<div class="demo-drawer__content">
|
||||||
|
<el-form :model="importForm" :rules="improtRules" ref="importForm">
|
||||||
|
<el-form-item label="上传文件" label-width="100px" prop="fileList">
|
||||||
|
<el-upload class="uploader" action="" :limit="1"
|
||||||
|
accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
|
||||||
|
:file-list="importForm.fileList" :auto-upload="false" :on-change="importFileChange">
|
||||||
|
<i class="el-icon-plus"></i>
|
||||||
|
</el-upload>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<div class="demo-drawer__footer btn-style">
|
||||||
|
<el-button @click="docImportDrawer = false">取 消</el-button>
|
||||||
|
<el-button type="primary" @click="saveUpload">上 传</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="import-right">
|
||||||
|
<el-button size="medium" class="button-query">
|
||||||
|
<a :href="`http://erp.staging.miaoxuan66.cn/goods/import/template`">下载模板</a>
|
||||||
|
</el-button>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import axios from "axios";
|
||||||
|
import { goods_types, Brand_goods_types } from "../../api/rankingData.js";
|
||||||
|
import {
|
||||||
|
goods,
|
||||||
|
update,
|
||||||
|
singleUpdate,
|
||||||
|
} from "../../api/goods";
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
id: "", //参考售价的id
|
||||||
|
id1: "", //预留量的id
|
||||||
|
id2: "", //损耗的id
|
||||||
|
total: 0, // 总条数
|
||||||
|
radio: "", // 损耗选择的原因
|
||||||
|
brand: [], // 品牌列表
|
||||||
|
cate: [], // 种类列表
|
||||||
|
tableData: [], // 商品列表
|
||||||
|
shopsData: [], //店铺传参数组
|
||||||
|
sku_code: {}, //店铺传参对象
|
||||||
|
// shopOrder: {}, //店铺悬浮窗详情数据
|
||||||
|
options: [
|
||||||
|
{
|
||||||
|
id: "1",
|
||||||
|
label: "在售",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "2",
|
||||||
|
label: "预警",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "0",
|
||||||
|
label: "下架",
|
||||||
|
},
|
||||||
|
], // 商品状态
|
||||||
|
options2: [
|
||||||
|
{
|
||||||
|
value: "inventory",
|
||||||
|
label: "盘点表",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "cost",
|
||||||
|
label: "成本表",
|
||||||
|
},
|
||||||
|
], //表格导出选项下拉列表
|
||||||
|
value: "", //表格导出选择的选项
|
||||||
|
options3: [
|
||||||
|
{
|
||||||
|
value: "stock",
|
||||||
|
label: "库存",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "cost",
|
||||||
|
label: "成本",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "loss_num",
|
||||||
|
label: "损耗",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "reserve",
|
||||||
|
label: "预留",
|
||||||
|
},
|
||||||
|
], //筛选类型下拉选项
|
||||||
|
// 请求商品列表的参数
|
||||||
|
form: {
|
||||||
|
goods_title: "", // 商品名称
|
||||||
|
type_id: "", // 商品种类id
|
||||||
|
brand_id: "", // 商品品牌id
|
||||||
|
sku_title: "", // 商品规格
|
||||||
|
status: "", // 商品状态
|
||||||
|
keyword_type: "stock", //筛选类型
|
||||||
|
keyword_value: "", //日期筛选
|
||||||
|
},
|
||||||
|
Paginationdata: {}, //分页相关数据
|
||||||
|
current_page: 1, //当前页
|
||||||
|
per_page: 100, //每页显示数量
|
||||||
|
multipleSelection: [], //多选框选中的id
|
||||||
|
updateType: "", //更新类型，newest-上新, inventory-库存盘点, stock-库存
|
||||||
|
stock: false, //点击库存显示输入框变量
|
||||||
|
isShow: false, // 点击上新显示输入框
|
||||||
|
ejectstock1: false, //点击库存按钮弹出框变量
|
||||||
|
Importgoods: false, //导入商品变量
|
||||||
|
Tableexport: false, //表格导出变量
|
||||||
|
isShow1: false, //文件传输弹出变量
|
||||||
|
//表格导入相关变量
|
||||||
|
importForm: {
|
||||||
|
fileList: [],
|
||||||
|
},
|
||||||
|
docImportDrawer: false,
|
||||||
|
improtRules: {
|
||||||
|
fileList: [
|
||||||
|
{ required: true, message: "请导入Excel文件", trigger: "change" },
|
||||||
|
{
|
||||||
|
validator: (rule, value, callback) => {
|
||||||
|
if (!value.length) {
|
||||||
|
callback(new Error("请导入Excel文件"));
|
||||||
|
} else {
|
||||||
|
callback();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
trigger: "change",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
// 文件模板手添加到根目录下
|
||||||
|
publicPath: process.env.BASE_URL, // public文件夹路径
|
||||||
|
excelTemplatePath: "", // 数据导入Excel模板下载地址 - 调接口获取
|
||||||
|
visible: false,
|
||||||
|
updateField: "", //reference_price-参考售价, reserve-预留量, loss_num-损耗, status-状态
|
||||||
|
reference_priceShow: false,
|
||||||
|
reserveShow: false, //预留量-input显示变量
|
||||||
|
value1: "", // 筛选的时间
|
||||||
|
ommodityInventory: [], //单个商品库存
|
||||||
|
dialogVisible: false, //上新按钮弹出框变量
|
||||||
|
dialogVisible2: false, //库存盘点弹出框变量
|
||||||
|
dialogVisible3: false, //参考售价弹出框变量
|
||||||
|
dialogVisible4: false, //预留弹出框变量
|
||||||
|
publicId: "", //参考售价 预留量公用id
|
||||||
|
reference_price: "", //参考价格修改传参
|
||||||
|
reserve: "", //预留量修改传参
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 列表编辑
|
||||||
|
handleEdit(goodsid, id) {
|
||||||
|
sessionStorage.setItem("商品ID", goodsid);
|
||||||
|
sessionStorage.setItem("ID", id);
|
||||||
|
this.$router.push("/ADDGOODS");
|
||||||
|
},
|
||||||
|
|
||||||
|
// 获取商品列表
|
||||||
|
getList() {
|
||||||
|
let page = {
|
||||||
|
page: this.current_page,
|
||||||
|
per_page: this.per_page,
|
||||||
|
};
|
||||||
|
goods(page).then((res) => {
|
||||||
|
this.tableData = res.data.data;
|
||||||
|
this.tableData = this.tableData.map((item) => {
|
||||||
|
item = {
|
||||||
|
...item,
|
||||||
|
arrived_today_num11: 0,
|
||||||
|
};
|
||||||
|
return item;
|
||||||
|
});
|
||||||
|
this.total = res.data.meta.total;
|
||||||
|
this.Paginationdata = res.data.meta;
|
||||||
|
this.shopsData = this.tableData.map((item) => {
|
||||||
|
item = item.goods.goods_code + "_" + item.sku_code;
|
||||||
|
return item;
|
||||||
|
});
|
||||||
|
this.sku_code = {
|
||||||
|
sku_code: this.shopsData,
|
||||||
|
};
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
// 筛选
|
||||||
|
handleChoose() {
|
||||||
|
this.form = {
|
||||||
|
...this.form,
|
||||||
|
page: this.current_page,
|
||||||
|
per_page: this.per_page,
|
||||||
|
};
|
||||||
|
|
||||||
|
// 对象值为空清除
|
||||||
|
const newObj = filterParams(this.form);
|
||||||
|
function filterParams(obj) {
|
||||||
|
const _newPar = {};
|
||||||
|
for (const key in obj) {
|
||||||
|
// 如果对象属性的值不为空，就保存该属性（这里我做了限制，如果属性的值为0，保存该属性。如果属性的值全部是空格，属于为空。）
|
||||||
|
if (
|
||||||
|
(obj[key] === 0 || obj[key]) &&
|
||||||
|
obj[key].toString().replace(/(^\s*)|(\s*$)/g, "") !== ""
|
||||||
|
) {
|
||||||
|
// 记录属性
|
||||||
|
_newPar[key] = obj[key];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 返回对象
|
||||||
|
return _newPar;
|
||||||
|
}
|
||||||
|
goods(newObj).then((res) => {
|
||||||
|
this.tableData = res.data.data;
|
||||||
|
this.tableData = this.tableData.map((item) => {
|
||||||
|
item = {
|
||||||
|
...item,
|
||||||
|
arrived_today_num11: 0,
|
||||||
|
};
|
||||||
|
return item;
|
||||||
|
});
|
||||||
|
this.total = res.data.meta.total;
|
||||||
|
this.Paginationdata = res.data.meta;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
// 重置筛选
|
||||||
|
handleReChoose() {
|
||||||
|
this.form = {
|
||||||
|
goods_title: "", // 商品名称
|
||||||
|
type_id: "", // 商品种类id
|
||||||
|
brand_id: "", // 商品品牌id
|
||||||
|
sku_title: "", // 商品规格
|
||||||
|
status: "", // 商品状态
|
||||||
|
};
|
||||||
|
this.value1 = "";
|
||||||
|
},
|
||||||
|
|
||||||
|
// 导入商品按钮
|
||||||
|
handleImport() {
|
||||||
|
this.docImportDrawer = true;
|
||||||
|
},
|
||||||
|
// 导出商品按钮
|
||||||
|
handleExport() {
|
||||||
|
this.Tableexport = true;
|
||||||
|
},
|
||||||
|
|
||||||
|
// 点击上新
|
||||||
|
update() {
|
||||||
|
this.isShow = true;
|
||||||
|
this.stock = false;
|
||||||
|
this.updateType = "newest";
|
||||||
|
},
|
||||||
|
// 复选框按钮
|
||||||
|
handleSelectionChange(val) {
|
||||||
|
this.multipleSelection = val.map((item) => item.id);
|
||||||
|
},
|
||||||
|
// 新增商品跳转
|
||||||
|
addNewgoods() {
|
||||||
|
this.$router.push("/ADDGOODS");
|
||||||
|
},
|
||||||
|
|
||||||
|
//分页功能
|
||||||
|
handleSizeChange(val) {
|
||||||
|
//当前条数
|
||||||
|
this.per_page = val;
|
||||||
|
this.handleChoose();
|
||||||
|
},
|
||||||
|
handleCurrentChange(val) {
|
||||||
|
//当前页
|
||||||
|
this.current_page = val;
|
||||||
|
this.handleChoose();
|
||||||
|
},
|
||||||
|
|
||||||
|
//取消上新or库存盘点
|
||||||
|
cancel() {
|
||||||
|
this.handleChoose();
|
||||||
|
this.isShow = false;
|
||||||
|
this.stock = false;
|
||||||
|
},
|
||||||
|
|
||||||
|
// 点击上新or库存盘点后确认
|
||||||
|
onSubmit() {
|
||||||
|
//判断点击的是上新，再发送上新请求
|
||||||
|
if (this.updateType === "newest") {
|
||||||
|
let skus = this.tableData.map((item) => {
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
id: item.id,
|
||||||
|
cost: item.cost,
|
||||||
|
arrived_today_num: item.arrived_today_num11,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
});
|
||||||
|
let patchdata = {
|
||||||
|
updateType: this.updateType,
|
||||||
|
skus: skus.flat(),
|
||||||
|
};
|
||||||
|
// 上新请求
|
||||||
|
update(patchdata).then((res) => {
|
||||||
|
this.handleChoose();
|
||||||
|
this.$message({
|
||||||
|
message: "上新成功！",
|
||||||
|
type: "success",
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
//判断点击的是库存盘点，再发送库存盘点请求
|
||||||
|
if (this.updateType === "inventory") {
|
||||||
|
let skus = this.tableData.map((item) => {
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
id: item.id,
|
||||||
|
inventory: item.daily.inventory,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
});
|
||||||
|
let patchdata = {
|
||||||
|
updateType: this.updateType,
|
||||||
|
skus: skus.flat(),
|
||||||
|
};
|
||||||
|
// 上新请求
|
||||||
|
update(patchdata).then((res) => {
|
||||||
|
this.handleChoose();
|
||||||
|
this.$message({
|
||||||
|
message: "库存盘点成功！",
|
||||||
|
type: "success",
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
this.isShow = false;
|
||||||
|
this.stock = false;
|
||||||
|
this.handleChoose();
|
||||||
|
},
|
||||||
|
|
||||||
|
// 点击库存盘点
|
||||||
|
onCount() {
|
||||||
|
this.dialogVisible2 = false;
|
||||||
|
this.isShow = false;
|
||||||
|
this.stock = true;
|
||||||
|
this.updateType = "inventory";
|
||||||
|
},
|
||||||
|
|
||||||
|
// 点击库存弹出框
|
||||||
|
ejectstock(row) {
|
||||||
|
this.ommodityInventory = [];
|
||||||
|
this.ejectstock1 = true;
|
||||||
|
this.updateType = "stock";
|
||||||
|
this.ommodityInventory.push(row);
|
||||||
|
},
|
||||||
|
|
||||||
|
//库存弹出框取消
|
||||||
|
cancelStock() {
|
||||||
|
this.handleChoose();
|
||||||
|
this.ejectstock1 = false;
|
||||||
|
},
|
||||||
|
|
||||||
|
// 库存弹出框确认
|
||||||
|
oldStock() {
|
||||||
|
this.ejectstock1 = false;
|
||||||
|
//判断点击的是库存，再发送库存请求
|
||||||
|
if (this.updateType === "stock") {
|
||||||
|
let skus = [
|
||||||
|
{
|
||||||
|
id: this.ommodityInventory[0].id,
|
||||||
|
yesterday_num: this.ommodityInventory[0].yesterday_num,
|
||||||
|
two_days_ago_num: this.ommodityInventory[0].two_days_ago_num,
|
||||||
|
arrived_today_num:
|
||||||
|
this.ommodityInventory[0].daily.arrived_today_num,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
let stockpatch = {
|
||||||
|
updateType: this.updateType,
|
||||||
|
skus: skus,
|
||||||
|
};
|
||||||
|
// 库存请求
|
||||||
|
update(stockpatch).then((res) => {
|
||||||
|
this.handleChoose();
|
||||||
|
this.$message({
|
||||||
|
message: "库存更新成功！",
|
||||||
|
type: "success",
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
// 商品导入
|
||||||
|
importFile() {
|
||||||
|
this.docImportDrawer = true;
|
||||||
|
},
|
||||||
|
// 数据导入-上传Excel
|
||||||
|
async importFileChange(file, fileList) {
|
||||||
|
this.importForm.fileList = fileList; // 检验上传文件是否为空
|
||||||
|
},
|
||||||
|
// 确定上传
|
||||||
|
saveUpload() {
|
||||||
|
this.$refs.importForm.validate(async (isValid) => {
|
||||||
|
if (!isValid) return;
|
||||||
|
try {
|
||||||
|
// 主要是这二行代码
|
||||||
|
const params = new FormData();
|
||||||
|
params.append("goodsSkus", this.importForm.fileList[0].raw);
|
||||||
|
|
||||||
|
this.isLoadingDialog = true;
|
||||||
|
let token = localStorage.getItem("token");
|
||||||
|
axios
|
||||||
|
.post("/api/goods_skus", params, {
|
||||||
|
headers: {
|
||||||
|
Authorization: `Bearer ${token}`,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
.then((res) => {
|
||||||
|
if (res.status === 200) {
|
||||||
|
this.$message.success("模板导入成功");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
this.docImportDrawer = false;
|
||||||
|
} finally {
|
||||||
|
this.isLoadingDialog = false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
// 数据导入-获取Excel模板地址
|
||||||
|
getExcelTemplatePath() {
|
||||||
|
this.$requestInternet.get("/api/xxx").then((res) => {
|
||||||
|
this.excelTemplatePath = res;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
// 表格导出
|
||||||
|
derivation() {
|
||||||
|
window.open("/goods_skus/export?exportType=" + this.value);
|
||||||
|
},
|
||||||
|
|
||||||
|
// 点击记录按钮跳转商品记录
|
||||||
|
goodslog(row) {
|
||||||
|
this.$router.push({
|
||||||
|
path: "/GOODS_LOG",
|
||||||
|
query: {
|
||||||
|
id: row.id,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
// 获取筛选时间
|
||||||
|
getSTime(val) {
|
||||||
|
this.form.keyword_value = val.join(" - ");
|
||||||
|
},
|
||||||
|
|
||||||
|
// 参考价格点击修改
|
||||||
|
reference_priceClick(id) {
|
||||||
|
this.updateField = "reference_price";
|
||||||
|
this.reference_priceShow = true;
|
||||||
|
this.id = id;
|
||||||
|
this.id1 = "";
|
||||||
|
},
|
||||||
|
|
||||||
|
// 参考价格input框失去焦点弹出确认框
|
||||||
|
reference_priceBlur(row) {
|
||||||
|
this.dialogVisible3 = true;
|
||||||
|
this.publicId = row.id;
|
||||||
|
this.reference_price = row.reference_price;
|
||||||
|
},
|
||||||
|
|
||||||
|
//参考价格弹出框确认修改请求
|
||||||
|
reference_priceRequest() {
|
||||||
|
this.dialogVisible3 = false;
|
||||||
|
let reference_priceData = {
|
||||||
|
updateField: this.updateField,
|
||||||
|
reference_price: this.reference_price,
|
||||||
|
};
|
||||||
|
singleUpdate(this.publicId, reference_priceData).then((res) => {
|
||||||
|
this.id = "";
|
||||||
|
this.$message({
|
||||||
|
message: "参考售价修改成功！",
|
||||||
|
type: "success",
|
||||||
|
});
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
onreserve(id) {
|
||||||
|
this.updateField = "reserve";
|
||||||
|
this.id1 = id;
|
||||||
|
this.id = "";
|
||||||
|
},
|
||||||
|
|
||||||
|
// 预留量 失去焦点触发确认框
|
||||||
|
reservebBlur(row) {
|
||||||
|
this.reserve = row.reserve;
|
||||||
|
this.dialogVisible4 = true;
|
||||||
|
this.publicId = row.id;
|
||||||
|
},
|
||||||
|
|
||||||
|
// 预留量弹出框确认请求
|
||||||
|
reserveRequest() {
|
||||||
|
let reservebData = {
|
||||||
|
updateField: this.updateField,
|
||||||
|
reserve: this.reserve,
|
||||||
|
};
|
||||||
|
singleUpdate(this.publicId, reservebData).then((res) => {
|
||||||
|
this.id1 = "";
|
||||||
|
this.dialogVisible4 = false;
|
||||||
|
this.$message({
|
||||||
|
message: "预留量修改成功！",
|
||||||
|
type: "success",
|
||||||
|
});
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
loss(id) {
|
||||||
|
this.updateField = "loss_num";
|
||||||
|
this.id2 = id;
|
||||||
|
this.id = "";
|
||||||
|
this.id1 = "";
|
||||||
|
},
|
||||||
|
|
||||||
|
// 添加损耗
|
||||||
|
onLoss(row) {
|
||||||
|
let id = row.id;
|
||||||
|
let lossData = {
|
||||||
|
updateField: this.updateField,
|
||||||
|
reason: this.radio,
|
||||||
|
loss_num: row.daily.loss_num,
|
||||||
|
};
|
||||||
|
singleUpdate(id, lossData).then((res) => {
|
||||||
|
this.getList();
|
||||||
|
this.id2 = "";
|
||||||
|
this.$message({
|
||||||
|
message: "损耗添加成功！",
|
||||||
|
type: "success",
|
||||||
|
});
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
//损耗框取消
|
||||||
|
noBubbles() {
|
||||||
|
this.handleChoose();
|
||||||
|
this.updateField = "";
|
||||||
|
this.id2 = "";
|
||||||
|
},
|
||||||
|
|
||||||
|
// 获取商品种类
|
||||||
|
getgoodsType() {
|
||||||
|
let param = {
|
||||||
|
per_page: 99999,
|
||||||
|
};
|
||||||
|
goods_types(param).then((res) => {
|
||||||
|
this.cate = res.data.data;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
// 获取商品品牌
|
||||||
|
getbrandType() {
|
||||||
|
let parsm = {
|
||||||
|
per_page: 99999,
|
||||||
|
};
|
||||||
|
Brand_goods_types(parsm).then((res) => {
|
||||||
|
this.brand = res.data.data;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
watch: {
|
||||||
|
$route(to, from) {
|
||||||
|
window.location.reload(); //监测到路由发生跳转时刷新一次页面
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
mounted() {
|
||||||
|
this.getList();
|
||||||
|
this.getgoodsType();
|
||||||
|
this.getbrandType();
|
||||||
|
this.id = "";
|
||||||
|
this.id1 = "";
|
||||||
|
this.id2 = "";
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="css" scoped>
|
||||||
|
.table {
|
||||||
|
margin-top: 40px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn {
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
.commodityimg {
|
||||||
|
width: 59px;
|
||||||
|
height: 59px;
|
||||||
|
background: rgba(227, 227, 227, 0.39);
|
||||||
|
opacity: 1;
|
||||||
|
display: block;
|
||||||
|
margin-right: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.Img {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.confirmbtn {
|
||||||
|
width: 114px;
|
||||||
|
height: 44px;
|
||||||
|
border-radius: 3px;
|
||||||
|
margin-top: 21px;
|
||||||
|
margin-bottom: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.import-right {
|
||||||
|
margin-top: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.import-right a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .btn11 {
|
||||||
|
padding: 0;
|
||||||
|
width: 14px;
|
||||||
|
height: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .btn11 img {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.page {
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -1,972 +0,0 @@
|
|||||||
<template>
|
|
||||||
<!-- 商品管理页面 -->
|
|
||||||
<div>
|
|
||||||
<!-- 条件筛选板块 -->
|
|
||||||
<el-card class="box-card">
|
|
||||||
<div class="goods">
|
|
||||||
<el-form ref="form" :inline="true" :model="form">
|
|
||||||
<el-form-item label="商品名称:">
|
|
||||||
<el-input v-model="form.goods_title" placeholder="商品名称" style="width: 100px">
|
|
||||||
</el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="商品种类:">
|
|
||||||
<el-select v-model="form.type_id" placeholder="商品种类" style="width: 125px">
|
|
||||||
<el-option v-for="item in cate" :key="item.id" :label="item.name" :value="item.id">
|
|
||||||
</el-option>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="商品规格:">
|
|
||||||
<el-input v-model="form.sku_title" placeholder="商品规格" style="width: 100px">
|
|
||||||
</el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="商品品牌:">
|
|
||||||
<el-select v-model="form.brand_id" placeholder="商品品牌" style="width: 125px">
|
|
||||||
<el-option v-for="item in brand" :key="item.id" :label="item.name" :value="item.id">
|
|
||||||
</el-option>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="商品状态:">
|
|
||||||
<el-select v-model="form.status" placeholder="商品状态" style="width: 115px">
|
|
||||||
<el-option v-for="item in options" :key="item.id" :label="item.label" :value="item.id">
|
|
||||||
</el-option>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item>
|
|
||||||
<el-select v-model="form.keyword_type" style="width: 80px; margin-right: 5px; margin-left: 10px">
|
|
||||||
<el-option v-for="item in options3" :key="item.value" :label="item.label" :value="item.value">
|
|
||||||
</el-option>
|
|
||||||
</el-select>
|
|
||||||
<el-date-picker v-model="value1" type="datetimerange" range-separator="至" start-placeholder="开始时间"
|
|
||||||
end-placeholder="结束时间" value-format="yyyy-MM-dd HH:mm:ss" @change="getSTime" style="width: 300px">
|
|
||||||
</el-date-picker>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item>
|
|
||||||
<el-button type="primary" @click="handleChoose()">筛选</el-button>
|
|
||||||
<el-button plain @click="handleReChoose()">重置筛选</el-button>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
</el-card>
|
|
||||||
|
|
||||||
<el-card class="box-card1" style="margin-top: 30px">
|
|
||||||
<div>
|
|
||||||
<!-- 表格头部操作 -->
|
|
||||||
<div>
|
|
||||||
<span>全部商品(共{{ total }}条)</span>
|
|
||||||
<div class="btn">
|
|
||||||
<el-button type="primary" plain @click="addNewgoods">新建商品</el-button>
|
|
||||||
<el-button type="primary" plain @click="update()">上新</el-button>
|
|
||||||
<el-button type="primary" plain @click="onCount()">库存盘点</el-button>
|
|
||||||
<el-button type="primary" plain @click="handleImport()">导入商品</el-button>
|
|
||||||
<el-button type="primary" plain @click="handleExport()">表格导出</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 参考售价弹出确认框 -->
|
|
||||||
<el-dialog :visible.sync="dialogVisible3" width="20%" :close-on-click-modal="false">
|
|
||||||
<span>您确定要修改吗?</span>
|
|
||||||
<span slot="footer" class="dialog-footer">
|
|
||||||
<el-button @click="dialogVisible3 = false">取 消</el-button>
|
|
||||||
<el-button type="primary" @click="reference_priceRequest()">确 定</el-button>
|
|
||||||
</span>
|
|
||||||
</el-dialog>
|
|
||||||
|
|
||||||
<!-- 预留量弹出框 -->
|
|
||||||
<el-dialog :visible.sync="dialogVisible4" width="20%" :close-on-click-modal="false">
|
|
||||||
<span>您确定要修改吗?</span>
|
|
||||||
<span slot="footer" class="dialog-footer">
|
|
||||||
<el-button @click="dialogVisible4 = false">取 消</el-button>
|
|
||||||
<el-button type="primary" @click="reserveRequest()">确 定</el-button>
|
|
||||||
</span>
|
|
||||||
</el-dialog>
|
|
||||||
|
|
||||||
<!-- 点击表格导出弹出框 -->
|
|
||||||
<el-dialog title="表格导出" :visible.sync="Tableexport" width="30%" :close-on-click-modal="false">
|
|
||||||
<div>
|
|
||||||
选择:
|
|
||||||
<template>
|
|
||||||
<el-select v-model="value" placeholder="盘点表/运营表/成本表">
|
|
||||||
<el-option v-for="item in options2" :key="item.value" :label="item.label" :value="item.value">
|
|
||||||
</el-option>
|
|
||||||
</el-select>
|
|
||||||
</template>
|
|
||||||
</div>
|
|
||||||
<span slot="footer" class="dialog-footer">
|
|
||||||
<el-button @click="Tableexport = false">取 消</el-button>
|
|
||||||
<el-button type="primary" @click="derivation()">确 定</el-button>
|
|
||||||
<!-- <a href="/goods_skus/export">确定</a> -->
|
|
||||||
</span>
|
|
||||||
</el-dialog>
|
|
||||||
|
|
||||||
<!-- 点击商品文件导入弹出框 -->
|
|
||||||
<el-dialog title="导入商品" :visible.sync="docImportDrawer" direction="rtl" custom-class="demo-drawer" ref="drawer"
|
|
||||||
size="20%" width="30%" @close="importForm.imFileList = []" :close-on-click-modal="false">
|
|
||||||
<div class="demo-drawer__content">
|
|
||||||
<el-form :model="importForm" :rules="improtRules" ref="importForm">
|
|
||||||
<el-form-item label="上传文件" label-width="100px" prop="fileList">
|
|
||||||
<el-upload class="uploader" action="" :limit="1"
|
|
||||||
accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
|
|
||||||
:file-list="importForm.fileList" :auto-upload="false" :on-change="importFileChange">
|
|
||||||
<i class="el-icon-plus"></i>
|
|
||||||
</el-upload>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
<div class="demo-drawer__footer btn-style">
|
|
||||||
<el-button @click="docImportDrawer = false">取 消</el-button>
|
|
||||||
<el-button type="primary" @click="saveUpload">上 传</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="import-right">
|
|
||||||
<el-button size="medium" class="button-query">
|
|
||||||
<a :href="`http://erp.staging.miaoxuan66.cn/goods/import/template`">下载模板</a>
|
|
||||||
</el-button>
|
|
||||||
</div>
|
|
||||||
</el-dialog>
|
|
||||||
|
|
||||||
<!-- 表格 -->
|
|
||||||
<el-table ref="multipleTable" :data="tableData" class="table" tooltip-effect="dark" style="width: 100%"
|
|
||||||
@selection-change="handleSelectionChange" max-height="1500">
|
|
||||||
<!-- 多选框 -->
|
|
||||||
<el-table-column type="selection" width="55"></el-table-column>
|
|
||||||
<el-table-column label="商品信息" width="300">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<div class="commodityimg">
|
|
||||||
<img :src="scope.row.goods.img_url" class="Img" />
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<p>{{ scope.row.goods.title }} {{ scope.row.title }}</p>
|
|
||||||
<p>
|
|
||||||
{{ scope.row.goods.goods_code + "_" + scope.row.sku_code }}
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
{{ scope.row.goods.updated_at }}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column label="品类">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<div>
|
|
||||||
{{ scope.row.goods.type ? scope.row.goods.type.name : "" }}
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column label="规格" prop="title"> </el-table-column>
|
|
||||||
<el-table-column label="品牌">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<div>
|
|
||||||
{{ scope.row.goods.brand ? scope.row.goods.brand.name : "" }}
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column prop="two_days_ago_num" sortable label="2T">
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column prop="yesterday_num" sortable label="1T">
|
|
||||||
</el-table-column>
|
|
||||||
|
|
||||||
<el-table-column sortable label="0T" min-width="80">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<div v-if="isShow">
|
|
||||||
<el-input v-model="scope.row.arrived_today_num11"></el-input>
|
|
||||||
</div>
|
|
||||||
<div v-else>
|
|
||||||
{{ scope.row.daily.arrived_today_num }}
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
|
|
||||||
<el-table-column prop="cost" sortable label="成本">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<div v-if="isShow">
|
|
||||||
<el-input v-model="scope.row.cost"></el-input>
|
|
||||||
</div>
|
|
||||||
<div v-else>
|
|
||||||
{{ scope.row.cost != null ? scope.row.cost : 0 }}
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
|
|
||||||
<el-table-column prop="reference_price" sortable label="售价" min-width="80">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<div v-if="scope.row.id === id">
|
|
||||||
<el-input v-model="scope.row.reference_price" @blur="reference_priceBlur(scope.row)"></el-input>
|
|
||||||
</div>
|
|
||||||
<div v-else>
|
|
||||||
{{ scope.row.reference_price }}
|
|
||||||
<el-button slot="reference" class="btn11" @click="reference_priceClick(scope.row.id)"><img
|
|
||||||
src="../../css/img/编辑.png" /></el-button>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column prop="num" sortable label="总量" min-width="80">
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column prop="reserve" sortable label="预留" min-width="80">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<div v-if="scope.row.id === id1">
|
|
||||||
<el-input v-model="scope.row.reserve" @blur="reservebBlur(scope.row)"></el-input>
|
|
||||||
</div>
|
|
||||||
<div v-else>
|
|
||||||
{{ scope.row.reserve }}
|
|
||||||
</div>
|
|
||||||
<el-button slot="reference" class="btn11" @click="onreserve(scope.row.id)"><img src="../../css/img/编辑.png"
|
|
||||||
alt="" /></el-button>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
|
|
||||||
<el-table-column sortable label="订单" min-width="80">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<div>
|
|
||||||
<span>{{ scope.row.order_goods_num }}</span>
|
|
||||||
</div>
|
|
||||||
<el-popover placement="right-start" width="200" trigger="hover"
|
|
||||||
v-if="scope.row.order_detail.length !== 0">
|
|
||||||
<div>
|
|
||||||
<span v-for="(j, index) in scope.row.order_detail" :key="index">
|
|
||||||
<div>{{ j.shop.name }}:{{ j.number }}</div>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<el-button class="btn11" type="text" slot="reference"><img src="../../css/img/眼睛.png" alt="" />
|
|
||||||
</el-button>
|
|
||||||
</el-popover>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
|
|
||||||
<el-table-column sortable label="损耗">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<div v-if="scope.row.id === id2">
|
|
||||||
<el-input v-model="scope.row.daily.loss_num"></el-input>
|
|
||||||
</div>
|
|
||||||
<div v-else>
|
|
||||||
{{ scope.row.daily.loss_num }}
|
|
||||||
</div>
|
|
||||||
<el-popover placement="right-start" width="220" trigger="click" @hide="noBubbles">
|
|
||||||
<p>损耗:</p>
|
|
||||||
<el-input v-model="scope.row.daily.loss_num"></el-input>
|
|
||||||
<el-radio-group v-model="radio">
|
|
||||||
<el-radio disabled>原因:</el-radio>
|
|
||||||
<el-radio label="48h以上">48h以上</el-radio>
|
|
||||||
<el-radio label="到货错误">到货错误</el-radio>
|
|
||||||
<el-radio label="灰霉">灰霉</el-radio>
|
|
||||||
<el-radio label="长度">长度</el-radio>
|
|
||||||
<el-radio label="花朵">花朵</el-radio>
|
|
||||||
<el-radio label="其他">其他</el-radio>
|
|
||||||
</el-radio-group>
|
|
||||||
<div class="list_btn">
|
|
||||||
<el-button type="primary" @click="onLoss(scope.row)">保存</el-button>
|
|
||||||
</div>
|
|
||||||
<el-button slot="reference" class="btn11" @click="loss(scope.row.id)"><img src="../../css/img/编辑.png"
|
|
||||||
alt="" /></el-button>
|
|
||||||
</el-popover>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column prop="stock" sortable label="库存">
|
|
||||||
</el-table-column>
|
|
||||||
|
|
||||||
<el-table-column prop="address" sortable label="盘点">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<div v-if="stock">
|
|
||||||
<el-input v-model="scope.row.daily.inventory"></el-input>
|
|
||||||
</div>
|
|
||||||
<el-popover placement="right-start" width="100" trigger="hover" :content="
|
|
||||||
scope.row.daily.inventory_time
|
|
||||||
? scope.row.daily.inventory_time
|
|
||||||
: ''
|
|
||||||
">
|
|
||||||
<div v-if="!stock" slot="reference">
|
|
||||||
{{ scope.row.daily.inventory }}
|
|
||||||
</div>
|
|
||||||
</el-popover>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
|
|
||||||
<el-table-column prop="status" label="状态"> </el-table-column>
|
|
||||||
<el-table-column label="操作" width="100">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<div>
|
|
||||||
<el-button type="text" @click="ejectstock(scope.row)">库存</el-button>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<el-button type="text" @click="handleEdit(scope.row.goods_id, scope.row.id)">编辑</el-button>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<el-button type="text" @click="goodslog(scope.row)">记录</el-button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 点击库存按钮弹出框 -->
|
|
||||||
<el-dialog title="库存修改" :visible.sync="ejectstock1" width="30%" :close-on-click-modal="false">
|
|
||||||
<el-table :data="ommodityInventory" tooltip-effect="dark" style="width: 100%"
|
|
||||||
@selection-change="handleSelectionChange">
|
|
||||||
<el-table-column prop="two_days_ago_num" label="2天前库存">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<div>
|
|
||||||
{{ scope.row.two_days_ago_num }}
|
|
||||||
<el-input v-model="scope.row.two_days_ago_num"></el-input>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column prop="yesterday_num" label="1天前库存">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<div>
|
|
||||||
{{ scope.row.yesterday_num }}
|
|
||||||
<el-input v-model="scope.row.yesterday_num"></el-input>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column sortable label="今日到货">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<div>
|
|
||||||
{{ scope.row.daily.arrived_today_num }}
|
|
||||||
<el-input v-model="scope.row.daily.arrived_today_num"></el-input>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
</el-table>
|
|
||||||
|
|
||||||
<span slot="footer" class="dialog-footer">
|
|
||||||
<el-button @click="cancelStock()">取 消</el-button>
|
|
||||||
<el-button type="primary" @click="oldStock()">确 定</el-button>
|
|
||||||
</span>
|
|
||||||
</el-dialog>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
</el-table>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 底部按钮 -->
|
|
||||||
<div class="footerBtn" v-show="isShow || stock">
|
|
||||||
<el-button type="primary" class="confirmbtn" @click="cancel()">取消</el-button>
|
|
||||||
<el-button type="primary" class="confirmbtn" @click="onSubmit()">保存</el-button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 分页功能 -->
|
|
||||||
<div class="page">
|
|
||||||
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
|
|
||||||
:current-page="current_page" :page-sizes="[15, 50, 100]" :page-size="per_page"
|
|
||||||
layout="total, sizes, prev, pager, next, jumper" :total="Paginationdata.total">
|
|
||||||
</el-pagination>
|
|
||||||
</div>
|
|
||||||
</el-card>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import axios from "axios";
|
|
||||||
import { goods_types, Brand_goods_types } from "../../api/rankingData.js";
|
|
||||||
import {
|
|
||||||
goods,
|
|
||||||
update,
|
|
||||||
singleUpdate,
|
|
||||||
shops,
|
|
||||||
tableExport,
|
|
||||||
} from "../../api/goods";
|
|
||||||
export default {
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
id: "", //参考售价的id
|
|
||||||
id1: "", //预留量的id
|
|
||||||
id2: "", //损耗的id
|
|
||||||
total: 0, // 总条数
|
|
||||||
radio: "", // 损耗选择的原因
|
|
||||||
brand: [], // 品牌列表
|
|
||||||
cate: [], // 种类列表
|
|
||||||
tableData: [], // 商品列表
|
|
||||||
shopsData: [], //店铺传参数组
|
|
||||||
sku_code: {}, //店铺传参对象
|
|
||||||
// shopOrder: {}, //店铺悬浮窗详情数据
|
|
||||||
options: [
|
|
||||||
{
|
|
||||||
id: "1",
|
|
||||||
label: "在售",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "2",
|
|
||||||
label: "预警",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "0",
|
|
||||||
label: "下架",
|
|
||||||
},
|
|
||||||
], // 商品状态
|
|
||||||
options2: [
|
|
||||||
{
|
|
||||||
value: "inventory",
|
|
||||||
label: "盘点表",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
value: "cost",
|
|
||||||
label: "成本表",
|
|
||||||
},
|
|
||||||
], //表格导出选项下拉列表
|
|
||||||
value: "", //表格导出选择的选项
|
|
||||||
options3: [
|
|
||||||
{
|
|
||||||
value: "stock",
|
|
||||||
label: "库存",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
value: "cost",
|
|
||||||
label: "成本",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
value: "loss_num",
|
|
||||||
label: "损耗",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
value: "reserve",
|
|
||||||
label: "预留",
|
|
||||||
},
|
|
||||||
], //筛选类型下拉选项
|
|
||||||
// 请求商品列表的参数
|
|
||||||
form: {
|
|
||||||
goods_title: "", // 商品名称
|
|
||||||
type_id: "", // 商品种类id
|
|
||||||
brand_id: "", // 商品品牌id
|
|
||||||
sku_title: "", // 商品规格
|
|
||||||
status: "", // 商品状态
|
|
||||||
keyword_type: "stock", //筛选类型
|
|
||||||
keyword_value: "", //日期筛选
|
|
||||||
},
|
|
||||||
Paginationdata: {}, //分页相关数据
|
|
||||||
current_page: 1, //当前页
|
|
||||||
per_page: 100, //每页显示数量
|
|
||||||
multipleSelection: [], //多选框选中的id
|
|
||||||
updateType: "", //更新类型，newest-上新, inventory-库存盘点, stock-库存
|
|
||||||
stock: false, //点击库存显示输入框变量
|
|
||||||
isShow: false, // 点击上新显示输入框
|
|
||||||
ejectstock1: false, //点击库存按钮弹出框变量
|
|
||||||
Importgoods: false, //导入商品变量
|
|
||||||
Tableexport: false, //表格导出变量
|
|
||||||
isShow1: false, //文件传输弹出变量
|
|
||||||
//表格导入相关变量
|
|
||||||
importForm: {
|
|
||||||
fileList: [],
|
|
||||||
},
|
|
||||||
docImportDrawer: false,
|
|
||||||
improtRules: {
|
|
||||||
fileList: [
|
|
||||||
{ required: true, message: "请导入Excel文件", trigger: "change" },
|
|
||||||
{
|
|
||||||
validator: (rule, value, callback) => {
|
|
||||||
if (!value.length) {
|
|
||||||
callback(new Error("请导入Excel文件"));
|
|
||||||
} else {
|
|
||||||
callback();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
trigger: "change",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
// 文件模板手添加到根目录下
|
|
||||||
publicPath: process.env.BASE_URL, // public文件夹路径
|
|
||||||
excelTemplatePath: "", // 数据导入Excel模板下载地址 - 调接口获取
|
|
||||||
visible: false,
|
|
||||||
updateField: "", //reference_price-参考售价, reserve-预留量, loss_num-损耗, status-状态
|
|
||||||
reference_priceShow: false,
|
|
||||||
reserveShow: false, //预留量-input显示变量
|
|
||||||
value1: "", // 筛选的时间
|
|
||||||
ommodityInventory: [], //单个商品库存
|
|
||||||
dialogVisible: false, //上新按钮弹出框变量
|
|
||||||
dialogVisible2: false, //库存盘点弹出框变量
|
|
||||||
dialogVisible3: false, //参考售价弹出框变量
|
|
||||||
dialogVisible4: false, //预留弹出框变量
|
|
||||||
publicId: "", //参考售价 预留量公用id
|
|
||||||
reference_price: "", //参考价格修改传参
|
|
||||||
reserve: "", //预留量修改传参
|
|
||||||
};
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
// 列表编辑
|
|
||||||
handleEdit(goodsid, id) {
|
|
||||||
sessionStorage.setItem("商品ID", goodsid);
|
|
||||||
sessionStorage.setItem("ID", id);
|
|
||||||
this.$router.push("/ADDGOODS");
|
|
||||||
},
|
|
||||||
|
|
||||||
// 获取商品列表
|
|
||||||
getList() {
|
|
||||||
let page = {
|
|
||||||
page: this.current_page,
|
|
||||||
per_page: this.per_page,
|
|
||||||
};
|
|
||||||
goods(page).then((res) => {
|
|
||||||
this.tableData = res.data.data;
|
|
||||||
this.tableData = this.tableData.map((item) => {
|
|
||||||
item = {
|
|
||||||
...item,
|
|
||||||
arrived_today_num11: 0,
|
|
||||||
};
|
|
||||||
return item;
|
|
||||||
});
|
|
||||||
this.total = res.data.meta.total;
|
|
||||||
this.Paginationdata = res.data.meta;
|
|
||||||
this.shopsData = this.tableData.map((item) => {
|
|
||||||
item = item.goods.goods_code + "_" + item.sku_code;
|
|
||||||
return item;
|
|
||||||
});
|
|
||||||
this.sku_code = {
|
|
||||||
sku_code: this.shopsData,
|
|
||||||
};
|
|
||||||
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
// 筛选
|
|
||||||
handleChoose() {
|
|
||||||
this.form = {
|
|
||||||
...this.form,
|
|
||||||
page: this.current_page,
|
|
||||||
per_page: this.per_page,
|
|
||||||
};
|
|
||||||
|
|
||||||
// 对象值为空清除
|
|
||||||
const newObj = filterParams(this.form);
|
|
||||||
function filterParams(obj) {
|
|
||||||
const _newPar = {};
|
|
||||||
for (const key in obj) {
|
|
||||||
// 如果对象属性的值不为空，就保存该属性（这里我做了限制，如果属性的值为0，保存该属性。如果属性的值全部是空格，属于为空。）
|
|
||||||
if (
|
|
||||||
(obj[key] === 0 || obj[key]) &&
|
|
||||||
obj[key].toString().replace(/(^\s*)|(\s*$)/g, "") !== ""
|
|
||||||
) {
|
|
||||||
// 记录属性
|
|
||||||
_newPar[key] = obj[key];
|
|
||||||
}
|
|
||||||
}
|
|
||||||
// 返回对象
|
|
||||||
return _newPar;
|
|
||||||
}
|
|
||||||
goods(newObj).then((res) => {
|
|
||||||
this.tableData = res.data.data;
|
|
||||||
this.tableData = this.tableData.map((item) => {
|
|
||||||
item = {
|
|
||||||
...item,
|
|
||||||
arrived_today_num11: 0,
|
|
||||||
};
|
|
||||||
return item;
|
|
||||||
});
|
|
||||||
this.total = res.data.meta.total;
|
|
||||||
this.Paginationdata = res.data.meta;
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
// 重置筛选
|
|
||||||
handleReChoose() {
|
|
||||||
this.form = {
|
|
||||||
goods_title: "", // 商品名称
|
|
||||||
type_id: "", // 商品种类id
|
|
||||||
brand_id: "", // 商品品牌id
|
|
||||||
sku_title: "", // 商品规格
|
|
||||||
status: "", // 商品状态
|
|
||||||
};
|
|
||||||
this.value1 = "";
|
|
||||||
},
|
|
||||||
|
|
||||||
// 导入商品按钮
|
|
||||||
handleImport() {
|
|
||||||
this.docImportDrawer = true;
|
|
||||||
},
|
|
||||||
// 导出商品按钮
|
|
||||||
handleExport() {
|
|
||||||
this.Tableexport = true;
|
|
||||||
},
|
|
||||||
|
|
||||||
// 点击上新
|
|
||||||
update() {
|
|
||||||
this.isShow = true;
|
|
||||||
this.stock = false;
|
|
||||||
this.updateType = "newest";
|
|
||||||
},
|
|
||||||
// 复选框按钮
|
|
||||||
handleSelectionChange(val) {
|
|
||||||
this.multipleSelection = val.map((item) => item.id);
|
|
||||||
},
|
|
||||||
// 新增商品跳转
|
|
||||||
addNewgoods() {
|
|
||||||
this.$router.push("/ADDGOODS");
|
|
||||||
},
|
|
||||||
|
|
||||||
//分页功能
|
|
||||||
handleSizeChange(val) {
|
|
||||||
//当前条数
|
|
||||||
this.per_page = val;
|
|
||||||
this.handleChoose();
|
|
||||||
},
|
|
||||||
handleCurrentChange(val) {
|
|
||||||
//当前页
|
|
||||||
this.current_page = val;
|
|
||||||
this.handleChoose();
|
|
||||||
},
|
|
||||||
|
|
||||||
//取消上新or库存盘点
|
|
||||||
cancel() {
|
|
||||||
this.handleChoose();
|
|
||||||
this.isShow = false;
|
|
||||||
this.stock = false;
|
|
||||||
},
|
|
||||||
|
|
||||||
// 点击上新or库存盘点后确认
|
|
||||||
onSubmit() {
|
|
||||||
//判断点击的是上新，再发送上新请求
|
|
||||||
if (this.updateType === "newest") {
|
|
||||||
let skus = this.tableData.map((item) => {
|
|
||||||
return [
|
|
||||||
{
|
|
||||||
id: item.id,
|
|
||||||
cost: item.cost,
|
|
||||||
arrived_today_num: item.arrived_today_num11,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
});
|
|
||||||
let patchdata = {
|
|
||||||
updateType: this.updateType,
|
|
||||||
skus: skus.flat(),
|
|
||||||
};
|
|
||||||
// 上新请求
|
|
||||||
update(patchdata).then((res) => {
|
|
||||||
this.handleChoose();
|
|
||||||
this.$message({
|
|
||||||
message: "上新成功！",
|
|
||||||
type: "success",
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
//判断点击的是库存盘点，再发送库存盘点请求
|
|
||||||
if (this.updateType === "inventory") {
|
|
||||||
let skus = this.tableData.map((item) => {
|
|
||||||
return [
|
|
||||||
{
|
|
||||||
id: item.id,
|
|
||||||
inventory: item.daily.inventory,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
});
|
|
||||||
let patchdata = {
|
|
||||||
updateType: this.updateType,
|
|
||||||
skus: skus.flat(),
|
|
||||||
};
|
|
||||||
// 上新请求
|
|
||||||
update(patchdata).then((res) => {
|
|
||||||
this.handleChoose();
|
|
||||||
this.$message({
|
|
||||||
message: "库存盘点成功！",
|
|
||||||
type: "success",
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
this.isShow = false;
|
|
||||||
this.stock = false;
|
|
||||||
this.handleChoose();
|
|
||||||
},
|
|
||||||
|
|
||||||
// 点击库存盘点
|
|
||||||
onCount() {
|
|
||||||
this.dialogVisible2 = false;
|
|
||||||
this.isShow = false;
|
|
||||||
this.stock = true;
|
|
||||||
this.updateType = "inventory";
|
|
||||||
},
|
|
||||||
|
|
||||||
// 点击库存弹出框
|
|
||||||
ejectstock(row) {
|
|
||||||
this.ommodityInventory = [];
|
|
||||||
this.ejectstock1 = true;
|
|
||||||
this.updateType = "stock";
|
|
||||||
this.ommodityInventory.push(row);
|
|
||||||
},
|
|
||||||
|
|
||||||
//库存弹出框取消
|
|
||||||
cancelStock() {
|
|
||||||
this.handleChoose();
|
|
||||||
this.ejectstock1 = false;
|
|
||||||
},
|
|
||||||
|
|
||||||
// 库存弹出框确认
|
|
||||||
oldStock() {
|
|
||||||
this.ejectstock1 = false;
|
|
||||||
//判断点击的是库存，再发送库存请求
|
|
||||||
if (this.updateType === "stock") {
|
|
||||||
let skus = [
|
|
||||||
{
|
|
||||||
id: this.ommodityInventory[0].id,
|
|
||||||
yesterday_num: this.ommodityInventory[0].yesterday_num,
|
|
||||||
two_days_ago_num: this.ommodityInventory[0].two_days_ago_num,
|
|
||||||
arrived_today_num:
|
|
||||||
this.ommodityInventory[0].daily.arrived_today_num,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
let stockpatch = {
|
|
||||||
updateType: this.updateType,
|
|
||||||
skus: skus,
|
|
||||||
};
|
|
||||||
// 库存请求
|
|
||||||
update(stockpatch).then((res) => {
|
|
||||||
this.handleChoose();
|
|
||||||
this.$message({
|
|
||||||
message: "库存更新成功！",
|
|
||||||
type: "success",
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
// 商品导入
|
|
||||||
importFile() {
|
|
||||||
this.docImportDrawer = true;
|
|
||||||
},
|
|
||||||
// 数据导入-上传Excel
|
|
||||||
async importFileChange(file, fileList) {
|
|
||||||
this.importForm.fileList = fileList; // 检验上传文件是否为空
|
|
||||||
},
|
|
||||||
// 确定上传
|
|
||||||
saveUpload() {
|
|
||||||
this.$refs.importForm.validate(async (isValid) => {
|
|
||||||
if (!isValid) return;
|
|
||||||
try {
|
|
||||||
// 主要是这二行代码
|
|
||||||
const params = new FormData();
|
|
||||||
params.append("goodsSkus", this.importForm.fileList[0].raw);
|
|
||||||
|
|
||||||
this.isLoadingDialog = true;
|
|
||||||
let token = localStorage.getItem("token");
|
|
||||||
axios
|
|
||||||
.post("/api/goods_skus", params, {
|
|
||||||
headers: {
|
|
||||||
Authorization: `Bearer ${token}`,
|
|
||||||
},
|
|
||||||
})
|
|
||||||
.then((res) => {
|
|
||||||
if (res.status === 200) {
|
|
||||||
this.$message.success("模板导入成功");
|
|
||||||
}
|
|
||||||
});
|
|
||||||
this.docImportDrawer = false;
|
|
||||||
} finally {
|
|
||||||
this.isLoadingDialog = false;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
// 数据导入-获取Excel模板地址
|
|
||||||
getExcelTemplatePath() {
|
|
||||||
this.$requestInternet.get("/api/xxx").then((res) => {
|
|
||||||
this.excelTemplatePath = res;
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
// 表格导出
|
|
||||||
derivation() {
|
|
||||||
window.open('/goods_skus/export?exportType=' + this.value);
|
|
||||||
},
|
|
||||||
|
|
||||||
// 点击记录按钮跳转商品记录
|
|
||||||
goodslog(row) {
|
|
||||||
this.$router.push({
|
|
||||||
path: "/GOODS_LOG",
|
|
||||||
query: {
|
|
||||||
id: row.id,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
// 获取筛选时间
|
|
||||||
getSTime(val) {
|
|
||||||
this.form.keyword_value = val.join(" - ");
|
|
||||||
},
|
|
||||||
|
|
||||||
// 参考价格点击修改
|
|
||||||
reference_priceClick(id) {
|
|
||||||
this.updateField = "reference_price";
|
|
||||||
this.reference_priceShow = true;
|
|
||||||
this.id = id;
|
|
||||||
this.id1 = "";
|
|
||||||
},
|
|
||||||
|
|
||||||
// 参考价格input框失去焦点弹出确认框
|
|
||||||
reference_priceBlur(row) {
|
|
||||||
this.dialogVisible3 = true;
|
|
||||||
this.publicId = row.id;
|
|
||||||
this.reference_price = row.reference_price;
|
|
||||||
},
|
|
||||||
|
|
||||||
//参考价格弹出框确认修改请求
|
|
||||||
reference_priceRequest() {
|
|
||||||
this.dialogVisible3 = false;
|
|
||||||
let reference_priceData = {
|
|
||||||
updateField: this.updateField,
|
|
||||||
reference_price: this.reference_price,
|
|
||||||
};
|
|
||||||
singleUpdate(this.publicId, reference_priceData).then((res) => {
|
|
||||||
this.id = "";
|
|
||||||
this.$message({
|
|
||||||
message: "参考售价修改成功！",
|
|
||||||
type: "success",
|
|
||||||
});
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
onreserve(id) {
|
|
||||||
this.updateField = "reserve";
|
|
||||||
this.id1 = id;
|
|
||||||
this.id = "";
|
|
||||||
},
|
|
||||||
|
|
||||||
// 预留量 失去焦点触发确认框
|
|
||||||
reservebBlur(row) {
|
|
||||||
this.reserve = row.reserve;
|
|
||||||
this.dialogVisible4 = true;
|
|
||||||
this.publicId = row.id;
|
|
||||||
},
|
|
||||||
|
|
||||||
// 预留量弹出框确认请求
|
|
||||||
reserveRequest() {
|
|
||||||
let reservebData = {
|
|
||||||
updateField: this.updateField,
|
|
||||||
reserve: this.reserve,
|
|
||||||
};
|
|
||||||
singleUpdate(this.publicId, reservebData).then((res) => {
|
|
||||||
this.id1 = "";
|
|
||||||
this.dialogVisible4 = false;
|
|
||||||
this.$message({
|
|
||||||
message: "预留量修改成功！",
|
|
||||||
type: "success",
|
|
||||||
});
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
loss(id) {
|
|
||||||
this.updateField = "loss_num";
|
|
||||||
this.id2 = id;
|
|
||||||
this.id = "";
|
|
||||||
this.id1 = "";
|
|
||||||
},
|
|
||||||
|
|
||||||
// 添加损耗
|
|
||||||
onLoss(row) {
|
|
||||||
let id = row.id;
|
|
||||||
let lossData = {
|
|
||||||
updateField: this.updateField,
|
|
||||||
reason: this.radio,
|
|
||||||
loss_num: row.daily.loss_num,
|
|
||||||
};
|
|
||||||
singleUpdate(id, lossData).then((res) => {
|
|
||||||
this.getList();
|
|
||||||
this.id2 = "";
|
|
||||||
this.$message({
|
|
||||||
message: "损耗添加成功！",
|
|
||||||
type: "success",
|
|
||||||
});
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
//损耗框取消
|
|
||||||
noBubbles() {
|
|
||||||
this.handleChoose();
|
|
||||||
this.updateField = "";
|
|
||||||
this.id2 = "";
|
|
||||||
},
|
|
||||||
|
|
||||||
// 获取商品种类
|
|
||||||
getgoodsType() {
|
|
||||||
let param = {
|
|
||||||
per_page:99999
|
|
||||||
}
|
|
||||||
goods_types(param).then((res) => {
|
|
||||||
this.cate = res.data.data;
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
// 获取商品品牌
|
|
||||||
getbrandType() {
|
|
||||||
let parsm = {
|
|
||||||
per_page:99999
|
|
||||||
}
|
|
||||||
Brand_goods_types(parsm).then((res) => {
|
|
||||||
this.brand = res.data.data;
|
|
||||||
});
|
|
||||||
},
|
|
||||||
},
|
|
||||||
|
|
||||||
watch: {
|
|
||||||
$route(to, from) {
|
|
||||||
window.location.reload(); //监测到路由发生跳转时刷新一次页面
|
|
||||||
},
|
|
||||||
},
|
|
||||||
|
|
||||||
mounted() {
|
|
||||||
this.getList();
|
|
||||||
this.getgoodsType();
|
|
||||||
this.getbrandType();
|
|
||||||
this.id = "";
|
|
||||||
this.id1 = "";
|
|
||||||
this.id2 = "";
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="css" scoped>
|
|
||||||
.loss {
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.table {
|
|
||||||
margin-top: 40px;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.btn {
|
|
||||||
float: right;
|
|
||||||
}
|
|
||||||
|
|
||||||
::v-deep .cell {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.commodityimg {
|
|
||||||
width: 59px;
|
|
||||||
height: 59px;
|
|
||||||
background: rgba(227, 227, 227, 0.39);
|
|
||||||
opacity: 1;
|
|
||||||
display: block;
|
|
||||||
margin-right: 12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.Img {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.confirmbtn {
|
|
||||||
width: 114px;
|
|
||||||
height: 44px;
|
|
||||||
border-radius: 3px;
|
|
||||||
margin-top: 21px;
|
|
||||||
margin-bottom: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.import-right {
|
|
||||||
margin-top: 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.import-right a {
|
|
||||||
text-decoration: none;
|
|
||||||
color: black;
|
|
||||||
}
|
|
||||||
|
|
||||||
::v-deep .btn11 {
|
|
||||||
padding: 0;
|
|
||||||
width: 14px;
|
|
||||||
height: 14px;
|
|
||||||
}
|
|
||||||
|
|
||||||
::v-deep .btn11 img {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.page {
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
Loading…
x
Reference in New Issue
Block a user