2022.8.4
This commit is contained in:
yezhenman
parent
2d913c605c
commit
e4e16e9a2b
32
resources/frontend/src/api/goods.js
vendored
32
resources/frontend/src/api/goods.js
vendored
@ -3,8 +3,38 @@ import http from '@/util/http.js'
|
||||
// 商品管理列表
|
||||
export function goods (data) {
|
||||
return http({
|
||||
url: '/api/goods',
|
||||
url: '/api/goods_skus',
|
||||
method: 'get',
|
||||
data
|
||||
})
|
||||
}
|
||||
// 新建商品
|
||||
export function addGoods (data) {
|
||||
return http({
|
||||
url: '/api/goods',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
// 查看商品
|
||||
export function checkGoods (id) {
|
||||
return http({
|
||||
url: `/api/goods_skus/${id}`,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
// 商品列表
|
||||
export function goodsList () {
|
||||
return http({
|
||||
url: '/api/goods',
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
// 更新商品
|
||||
export function updateGoods (id, data) {
|
||||
return http({
|
||||
url: `/api/goods_skus/${id}`,
|
||||
method: 'patch',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
11
resources/frontend/src/api/rankingData.js
vendored
11
resources/frontend/src/api/rankingData.js
vendored
@ -55,20 +55,20 @@ export function goods_types (data) {
|
||||
export function Delgoods_types (id) {
|
||||
return http({
|
||||
url: `/api/goods_types/${id}`,
|
||||
method: 'delete',
|
||||
method: 'delete'
|
||||
|
||||
})
|
||||
}
|
||||
// 新增种类
|
||||
export function Addgoods_types (data) {
|
||||
return http({
|
||||
url: `/api/goods_types/`,
|
||||
url: '/api/goods_types/',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
// 编辑种类
|
||||
export function editGoods_types (id,data) {
|
||||
export function editGoods_types (id, data) {
|
||||
return http({
|
||||
url: `/api/goods_types/${id}`,
|
||||
method: 'patch',
|
||||
@ -87,8 +87,7 @@ export function Brand_goods_types (data) {
|
||||
export function DelBrand_goods_types (id) {
|
||||
return http({
|
||||
url: `/api/goods_brands/${id}`,
|
||||
method: 'delete',
|
||||
|
||||
method: 'delete'
|
||||
})
|
||||
}
|
||||
// 新增品牌
|
||||
@ -100,7 +99,7 @@ export function AddBrandgoods_types (data) {
|
||||
})
|
||||
}
|
||||
// 编辑品牌
|
||||
export function editBrand_types(id,data) {
|
||||
export function editBrand_types (id, data) {
|
||||
return http({
|
||||
url: `/api/goods_brands/${id}`,
|
||||
method: 'patch',
|
||||
|
||||
24
resources/frontend/src/api/shop.js
vendored
Normal file
24
resources/frontend/src/api/shop.js
vendored
Normal file
@ -0,0 +1,24 @@
|
||||
import http from '@/util/http.js'
|
||||
// 店铺平台列表
|
||||
export function shopListId () {
|
||||
return http({
|
||||
url: '/api/shop_platforms',
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
// 店铺新增
|
||||
export function shopAdd (data) {
|
||||
return http({
|
||||
url: '/api/shops',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
// 店铺列表
|
||||
export function storeList (data) {
|
||||
return http({
|
||||
url: '/api/shops',
|
||||
method: 'get',
|
||||
data
|
||||
})
|
||||
}
|
||||
@ -1,26 +1,30 @@
|
||||
<template>
|
||||
<div class="m-map">
|
||||
<div class="search" v-if="placeSearch">
|
||||
<div id="js-result" v-show="searchKey" class="result"></div>
|
||||
<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 id="js-container"
|
||||
class="map">正在加载数据 ...</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import remoteLoad from '@/util/remoteLoad.js'
|
||||
window._AMapSecurityConfig = {
|
||||
securityJsCode: '4c7f32be1ae23595dd423fbdf337df3f'
|
||||
securityJsCode: '4c7f32be1ae23595dd423fbdf337df3f',
|
||||
}
|
||||
// import { MapKey } from './config'
|
||||
|
||||
export default {
|
||||
name: 'MapDrag',
|
||||
props: {
|
||||
searchKey: {
|
||||
default: ''
|
||||
}
|
||||
default: '',
|
||||
},
|
||||
data () {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// searchKey: "",
|
||||
placeSearch: null,
|
||||
@ -28,37 +32,39 @@ export default {
|
||||
AMapUI: null,
|
||||
AMap: null,
|
||||
city: '',
|
||||
geolocation: null
|
||||
geolocation: null,
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
searchKey () {
|
||||
searchKey() {
|
||||
if (this.searchKey === '') {
|
||||
this.placeSearch.clear()
|
||||
}
|
||||
}
|
||||
},
|
||||
async created () {
|
||||
},
|
||||
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/maps?v=2.0&key=4b083a38fc17ad7c5e3df667931e0cf0'
|
||||
)
|
||||
await remoteLoad('https://webapi.amap.com/ui/1.1/main.js')
|
||||
this.initMap()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 搜索
|
||||
handleSearch () {
|
||||
handleSearch() {
|
||||
console.log(this.searchKey, '33333oooo')
|
||||
if (this.searchKey) {
|
||||
this.placeSearch.search(this.searchKey)
|
||||
}
|
||||
},
|
||||
// 实例化地图
|
||||
initMap () {
|
||||
initMap() {
|
||||
// 加载PositionPicker，loadUI的路径参数为模块名中 'ui/' 之后的部分
|
||||
const AMapUI = (this.AMapUI = window.AMapUI)
|
||||
const AMap = (this.AMap = window.AMap)
|
||||
@ -67,7 +73,7 @@ export default {
|
||||
|
||||
AMapUI.loadUI(['misc/PositionPicker'], (PositionPicker) => {
|
||||
const mapConfig = {
|
||||
zoom: 16
|
||||
zoom: 16,
|
||||
}
|
||||
const map = new AMap.Map('js-container', mapConfig)
|
||||
// 获得当前定位的城市
|
||||
@ -81,15 +87,23 @@ export default {
|
||||
pageIndex: 1,
|
||||
citylimit: false,
|
||||
map: map,
|
||||
panel: 'js-result'
|
||||
panel: 'js-result',
|
||||
// city: that.city, // 设定搜索城市
|
||||
})
|
||||
AMap.Event.addListener(that.placeSearch, 'listElementClick', function (e) {
|
||||
AMap.Event.addListener(
|
||||
that.placeSearch,
|
||||
'listElementClick',
|
||||
function (e) {
|
||||
that.$emit('listElementClick', e)
|
||||
})
|
||||
AMap.Event.addListener(that.placeSearch, 'markerClick', function (e) {
|
||||
}
|
||||
)
|
||||
AMap.Event.addListener(
|
||||
that.placeSearch,
|
||||
'markerClick',
|
||||
function (e) {
|
||||
that.$emit('listElementClick', e)
|
||||
})
|
||||
}
|
||||
)
|
||||
})
|
||||
// citySearch.getLocalCity(function (status, result) {
|
||||
// console.log('getLocalCity', status, result)
|
||||
@ -100,29 +114,32 @@ export default {
|
||||
// })
|
||||
})
|
||||
// 启用工具条
|
||||
AMap.plugin(['AMap.ToolBar', 'AMap.Scale', 'AMap.Geolocation'], function () {
|
||||
AMap.plugin(
|
||||
['AMap.ToolBar', 'AMap.Scale', 'AMap.Geolocation'],
|
||||
function () {
|
||||
map.addControl(
|
||||
new AMap.ToolBar({
|
||||
position: 'RB'
|
||||
position: 'RB',
|
||||
})
|
||||
)
|
||||
map.addControl(
|
||||
new AMap.Scale({
|
||||
position: 'LB'
|
||||
position: 'LB',
|
||||
})
|
||||
)
|
||||
})
|
||||
}
|
||||
)
|
||||
// 创建地图拖拽
|
||||
const positionPicker = new PositionPicker({
|
||||
mode: 'dragMap', // 设定为拖拽地图模式，可选'dragMap'、'dragMarker'，默认为'dragMap'
|
||||
map: map // 依赖地图对象
|
||||
map: map, // 依赖地图对象
|
||||
})
|
||||
|
||||
// 启动拖放
|
||||
positionPicker.start()
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
214
resources/frontend/src/components/upload/index.vue
Normal file
214
resources/frontend/src/components/upload/index.vue
Normal file
@ -0,0 +1,214 @@
|
||||
<!--
|
||||
* @Description:头像上传组件
|
||||
* @Author: czw (725551805@qq.com)
|
||||
* @Date: 2022-03-03 18:50:30
|
||||
* @LastEditors: czw (725551805@qq.com)
|
||||
* @LastEditTime: 2022-03-14 09:14:24
|
||||
* @FilePath: /glxt/src/views/home/home/index.vue
|
||||
-->
|
||||
<template>
|
||||
<div>
|
||||
<el-upload name="image"
|
||||
:action="uploadAction"
|
||||
:headers="uploadHeaders"
|
||||
:on-preview="handleChange"
|
||||
:on-remove="beforeRemove"
|
||||
:on-success='good'
|
||||
:file-list="img"
|
||||
:limit="number"
|
||||
:before-upload="handleBeforeUpload"
|
||||
:on-change="handleEditChange"
|
||||
accept=".png,.jpg"
|
||||
list-type="picture-card"
|
||||
:class="hideUploadEdit?'hide':''"
|
||||
:show-file-list='true'>
|
||||
<i class="el-icon-plus"></i>
|
||||
</el-upload>
|
||||
|
||||
<div class="demo-image__preview"
|
||||
v-if='imageUrl'>
|
||||
<el-image class="hidden__el-image"
|
||||
ref="elImage"
|
||||
:src="imageUrl"
|
||||
:preview-src-list="previewSrcList">
|
||||
</el-image>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getToken } from '@/util/auth'
|
||||
export default {
|
||||
name: '', // 页面名称
|
||||
components: {}, // 挂载组件
|
||||
props: {
|
||||
// 上传图片数量
|
||||
number: {
|
||||
type: Number,
|
||||
default: 1,
|
||||
},
|
||||
file: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
}, // 组件传值
|
||||
data() {
|
||||
return {
|
||||
hideUploadEdit: false, // 判断显示图片上传限制隐藏
|
||||
url: '/api/upload', // 请求接口
|
||||
imageUrl: '', // 图片展示
|
||||
previewSrcList: [], // 展示图片列表
|
||||
list: [], // 上传图片列表
|
||||
img: [], // 实际展示的图片
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
// 上传的地址
|
||||
uploadAction() {
|
||||
return 'https://ct-upimg.yx090.com' + this.url
|
||||
},
|
||||
// 设置上传的请求头部
|
||||
uploadHeaders() {
|
||||
return {
|
||||
// authorization: 'Bearer' + getToken(),
|
||||
'Content-Type': 'multipart/form-data',
|
||||
}
|
||||
},
|
||||
}, // 计算机属性 类似与data概念
|
||||
watch: {
|
||||
file: {
|
||||
handler(val) {
|
||||
if (val) {
|
||||
console.log(val, 'ppp')
|
||||
var imges = []
|
||||
val.forEach((element) => {
|
||||
imges = element.url.split(',')
|
||||
this.list = imges
|
||||
})
|
||||
imges.forEach((element) => {
|
||||
this.img.push({ url: this.computedGetPictureSrc(element) })
|
||||
})
|
||||
const previewSrcList = imges.map((ele) => {
|
||||
return this.computedGetPictureSrc(ele)
|
||||
})
|
||||
this.previewSrcList = previewSrcList
|
||||
if (val.length === this.number) {
|
||||
this.hideUploadEdit = true
|
||||
}
|
||||
}
|
||||
},
|
||||
deep: true,
|
||||
immediate: true,
|
||||
},
|
||||
}, // 监控data中数据变化
|
||||
methods: {
|
||||
computedGetPictureSrc(src) {
|
||||
return 'https://ct-upimg.yx090.com/' + src
|
||||
},
|
||||
/**
|
||||
* @author: czw (725551805@qq.com)
|
||||
* @description: 判断显示图片上传限制隐藏
|
||||
* @param {*} file
|
||||
* @param {*} fileList
|
||||
* @return {*}
|
||||
* @Date: 2022-03-03 21:16:54
|
||||
*/
|
||||
handleEditChange(file, fileList) {
|
||||
if (fileList.length === this.number) {
|
||||
this.hideUploadEdit = true
|
||||
}
|
||||
},
|
||||
/**
|
||||
* @author: czw (725551805@qq.com)
|
||||
* @description: 上传成功
|
||||
* @param {*}
|
||||
* @return {*}
|
||||
* @Date: 2022-03-03 19:59:45
|
||||
*/
|
||||
good(file, fileList) {
|
||||
this.previewSrcList.push(fileList.url)
|
||||
console.log(this.previewSrcList, '------')
|
||||
// file.data.forEach((element) => {
|
||||
// this.list.push(element.url)
|
||||
// })
|
||||
|
||||
this.$emit('urlimg', fileList.url)
|
||||
},
|
||||
/**
|
||||
* @author: czw (725551805@qq.com)
|
||||
* @description: 点击放大
|
||||
* @param {*}
|
||||
* @return {*}
|
||||
* @Date: 2022-03-03 18:59:28
|
||||
*/
|
||||
handleChange(file) {
|
||||
this.imageUrl = file.url
|
||||
this.$nextTick(() => {
|
||||
this.$refs.elImage.clickHandler()
|
||||
})
|
||||
},
|
||||
/**
|
||||
* @author: czw (725551805@qq.com)
|
||||
* @description:删除
|
||||
* @param {*}
|
||||
* @return {*}
|
||||
* @Date: 2022-03-03 18:59:40
|
||||
*/
|
||||
beforeRemove(file, fileList) {
|
||||
if (fileList.length === this.number) {
|
||||
this.hideUploadEdit = true
|
||||
} else {
|
||||
this.hideUploadEdit = false
|
||||
}
|
||||
if (file.response) {
|
||||
file.response.data.forEach((element) => {
|
||||
for (var i = 0; i < this.list.length; i++) {
|
||||
if (element.url === this.list[i]) {
|
||||
this.list.splice(i, 1)
|
||||
}
|
||||
}
|
||||
})
|
||||
} else {
|
||||
console.log(file, 'iiii')
|
||||
for (var i = 0; i < this.list.length; i++) {
|
||||
if (file.url === this.computedGetPictureSrc(this.list[i])) {
|
||||
this.list.splice(i, 1)
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
/**
|
||||
* @author: czw (725551805@qq.com)
|
||||
* @description:自动删除
|
||||
* @param {*}
|
||||
* @return {*}
|
||||
* @Date: 2022-03-03 19:53:25
|
||||
*/
|
||||
handleBeforeUpload(file) {
|
||||
const isLt2M = file.size / 1024 / 1024 < 2
|
||||
if (!isLt2M) {
|
||||
this.$message.error('上传头像图片大小不能超过 2MB!')
|
||||
return false
|
||||
}
|
||||
},
|
||||
}, // 挂载一些方法
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.demo-image__preview {
|
||||
height: 0;
|
||||
}
|
||||
.hidden__el-image {
|
||||
width: 0;
|
||||
height: 0;
|
||||
::v-deep .el-image__preview {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.hide .el-upload--picture-card {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
24
resources/frontend/src/store/index.js
vendored
24
resources/frontend/src/store/index.js
vendored
@ -1,13 +1,15 @@
|
||||
import Vue from "vue";
|
||||
import Vuex from "vuex";
|
||||
import Vue from 'vue'
|
||||
import Vuex from 'vuex'
|
||||
|
||||
Vue.use(Vuex);
|
||||
Vue.use(Vuex)
|
||||
|
||||
const store = new Vuex.Store({
|
||||
state: {},
|
||||
mutations: {},
|
||||
actions: {},
|
||||
modules: {},
|
||||
});
|
||||
|
||||
export default store;
|
||||
export default new Vuex.Store({
|
||||
state: {
|
||||
},
|
||||
mutations: {
|
||||
},
|
||||
actions: {
|
||||
},
|
||||
modules: {
|
||||
}
|
||||
})
|
||||
|
||||
@ -1,55 +1,113 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-button type="primary"
|
||||
@click="handAdd">新增</el-button>
|
||||
<el-table :data="tableData"
|
||||
border
|
||||
style="width: 100%">
|
||||
<el-table-column prop="date"
|
||||
label="日期"
|
||||
<el-table-column prop="id"
|
||||
label="ID"
|
||||
width="180">
|
||||
</el-table-column>
|
||||
<el-table-column prop="name"
|
||||
label="姓名"
|
||||
label="店铺名称"
|
||||
width="180">
|
||||
</el-table-column>
|
||||
<el-table-column prop="plat_id"
|
||||
label="所属平台">
|
||||
</el-table-column>
|
||||
<el-table-column prop="address"
|
||||
label="地址">
|
||||
label="操作">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="primary"
|
||||
@click="handEdit(scope.row.id,scope.row)">编辑</el-button>
|
||||
<el-button type="danger"
|
||||
@click="handdel(scope.row.id)">授权</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!-- 新增店铺 -->
|
||||
<el-dialog title="新增店铺"
|
||||
:visible.sync="dialogFormVisible">
|
||||
<el-form :model="form">
|
||||
<el-form-item label="店铺名称">
|
||||
<el-input v-model="form.name"
|
||||
placeholder="输入店铺名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="店铺平台">
|
||||
<el-select v-model="form.plat_id"
|
||||
placeholder="输入店铺平台">
|
||||
<el-option v-for="(item,index) in storeId"
|
||||
:key="index"
|
||||
:label="item"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer"
|
||||
class="dialog-footer">
|
||||
<el-button @click="dialogFormVisible = false">取 消</el-button>
|
||||
<el-button type="primary"
|
||||
@click="addSubmit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { shopListId, shopAdd, storeList } from '../../api/shop'
|
||||
export default {
|
||||
name: 'GlxtStore',
|
||||
|
||||
data() {
|
||||
return {
|
||||
tableData: [
|
||||
{
|
||||
date: '2016-05-02',
|
||||
name: '王小虎',
|
||||
address: '上海市普陀区金沙江路 1518 弄',
|
||||
dialogFormVisible: false,
|
||||
form: {
|
||||
name: '',
|
||||
plat_id: '',
|
||||
},
|
||||
{
|
||||
date: '2016-05-04',
|
||||
name: '王小虎',
|
||||
address: '上海市普陀区金沙江路 1517 弄',
|
||||
},
|
||||
{
|
||||
date: '2016-05-01',
|
||||
name: '王小虎',
|
||||
address: '上海市普陀区金沙江路 1519 弄',
|
||||
},
|
||||
{
|
||||
date: '2016-05-03',
|
||||
name: '王小虎',
|
||||
address: '上海市普陀区金沙江路 1516 弄',
|
||||
},
|
||||
],
|
||||
storeId: [], // 店铺id
|
||||
tableData: [],
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {},
|
||||
|
||||
methods: {},
|
||||
mounted() {
|
||||
// 获取平台
|
||||
shopListId().then((res) => {
|
||||
this.storeId = res.data.data
|
||||
})
|
||||
// 展示店铺列表
|
||||
this.getStoreList()
|
||||
},
|
||||
methods: {
|
||||
// 点击新增
|
||||
handAdd() {
|
||||
this.form.name = ''
|
||||
this.form.plat_id = ''
|
||||
this.dialogFormVisible = true
|
||||
},
|
||||
// 新增商品
|
||||
addSubmit() {
|
||||
const datas = this.form
|
||||
shopAdd(datas).then((res) => {
|
||||
if (res.status == 200) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '添加成功',
|
||||
})
|
||||
}
|
||||
})
|
||||
this.dialogFormVisible = false
|
||||
this.getStoreList()
|
||||
},
|
||||
// 店铺列表
|
||||
getStoreList() {
|
||||
storeList().then((res) => {
|
||||
this.tableData = res.data.data
|
||||
console.log(res, 'kkk')
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@ -1,9 +1,11 @@
|
||||
<template>
|
||||
<div class="conent">
|
||||
<!-- 新增按钮 -->
|
||||
<div class="btn">
|
||||
<el-button type="primary" @click="dialogVisible = true">新增</el-button>
|
||||
</div>
|
||||
|
||||
<!-- 点击新增弹出表单 -->
|
||||
<div class="from">
|
||||
<el-dialog title="新增用户" :visible.sync="dialogVisible" width="30%">
|
||||
<div>
|
||||
@ -31,58 +33,132 @@
|
||||
</el-dialog>
|
||||
</div>
|
||||
|
||||
<!-- 点击编辑弹出表单信息 -->
|
||||
<div class="edit_from">
|
||||
<el-dialog title="编辑" :visible.sync="editVisible" width="30%">
|
||||
<div>
|
||||
<el-form label-width="80px">
|
||||
<el-form-item label="ID">
|
||||
<el-input v-model="edit_from.id"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="姓名">
|
||||
<el-input v-model="edit_from.name"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="邮箱">
|
||||
<el-input v-model="edit_from.email"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="角色">
|
||||
<el-input v-model="edit_from.role_name"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="密码">
|
||||
<el-input v-model="edit_from.password"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="密码确认">
|
||||
<el-input v-model="edit_from.password_confirmation"></el-input>
|
||||
</el-form-item>
|
||||
<div class="from-btn">
|
||||
<el-button type="danger" @click="editVisible = false"
|
||||
>取消</el-button
|
||||
>
|
||||
<el-button @click="onEdit()">确认</el-button>
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
|
||||
<!-- 用户列表 -->
|
||||
<div class="table">
|
||||
<template>
|
||||
<el-table :data="tableList" style="width: 100%">
|
||||
<el-table-column prop="id" label="ID" width="400"></el-table-column>
|
||||
<el-table-column prop="name" label="姓名" width="400">
|
||||
</el-table-column>
|
||||
<el-table-column prop="email" label="角色" width="400">
|
||||
</el-table-column>
|
||||
<el-table-column prop="id" label="ID"></el-table-column>
|
||||
<el-table-column prop="name" label="姓名"> </el-table-column>
|
||||
<el-table-column label="角色"> 超级管理员</el-table-column>
|
||||
<el-table-column label="操作">
|
||||
<el-button>编辑</el-button>
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="openEdit(scope.row)">编辑</el-button>
|
||||
<el-button type="danger">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
<!-- 分页功能 -->
|
||||
<div class="block">
|
||||
<el-pagination
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
:current-page="current_page"
|
||||
:page-sizes="[15, 50, 100]"
|
||||
:page-size="15"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="Paginationdata.total"
|
||||
>
|
||||
</el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
export default {
|
||||
name: "GlxtUsers",
|
||||
|
||||
data() {
|
||||
return {
|
||||
id: "",
|
||||
dialogVisible: false, //新增按钮变量
|
||||
editVisible: false, //编辑按钮变量
|
||||
tableList: [], //列表数据
|
||||
from: {
|
||||
//表单数据（用户名密码确认密码角色名）
|
||||
name: "",
|
||||
password: "",
|
||||
password_confirmation: "",
|
||||
role_name: "超级管理员",
|
||||
},
|
||||
edit_from: {
|
||||
// 编辑返回默认数据
|
||||
created_at: "",
|
||||
deleted_at: null,
|
||||
email: "",
|
||||
id: "",
|
||||
name: "",
|
||||
password: "",
|
||||
password_confirmation: "",
|
||||
role_name: "超级管理员",
|
||||
},
|
||||
Paginationdata: {}, //分页相关数据
|
||||
current_page: 1, //当前页
|
||||
per_page: 15, //每页显示数量
|
||||
};
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.getList(); //进入调用用户表单数据请求
|
||||
},
|
||||
methods: {
|
||||
//用户表单数据请求
|
||||
getList() {
|
||||
axios
|
||||
.get("api/users", {
|
||||
.get("api/users",{
|
||||
headers: {
|
||||
Authorization:
|
||||
"Bearer w1rr6IsxZIud46dIrGIivNAroFpqN52sSpXhk3azpPq2ZTbUXhgKTOLheoRm",
|
||||
},
|
||||
params:{
|
||||
page:this.current_page,
|
||||
per_page:this.per_page,
|
||||
}
|
||||
})
|
||||
.then((res) => {
|
||||
console.log(res);
|
||||
this.tableList = res.data.data;
|
||||
this.Paginationdata = res.data.meta;
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
//点击新增确认
|
||||
onSubmit() {
|
||||
// 请求
|
||||
axios
|
||||
.post("/api/users", this.from, {
|
||||
headers: {
|
||||
@ -91,9 +167,67 @@ export default {
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
console.log(res);
|
||||
});
|
||||
this.tableList = [...this.tableList, res.data.data];
|
||||
this.dialogVisible = false;
|
||||
this.getList();
|
||||
this.from = {};
|
||||
this.$message({
|
||||
message: "账号添加成功！",
|
||||
type: "success",
|
||||
});
|
||||
});
|
||||
},
|
||||
//点击编辑
|
||||
openEdit(e) {
|
||||
this.editVisible = true;
|
||||
console.log(e.id);
|
||||
let id = e.id;
|
||||
this.id = e.id;
|
||||
// 请求id对应数据
|
||||
axios
|
||||
.get(`/api/users/${id}`, {
|
||||
headers: {
|
||||
Authorization:
|
||||
"Bearer w1rr6IsxZIud46dIrGIivNAroFpqN52sSpXhk3azpPq2ZTbUXhgKTOLheoRm",
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
console.log(res.data.data);
|
||||
this.edit_from = res.data.data;
|
||||
});
|
||||
},
|
||||
//编辑完确认请求
|
||||
onEdit() {
|
||||
let id = this.id;
|
||||
console.log(id);
|
||||
axios
|
||||
.patch(`/api/users/${id}`, this.edit_from, {
|
||||
headers: {
|
||||
Authorization:
|
||||
"Bearer w1rr6IsxZIud46dIrGIivNAroFpqN52sSpXhk3azpPq2ZTbUXhgKTOLheoRm",
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
this.tableList = [...this.tableList, res.data.data];
|
||||
this.editVisible = false;
|
||||
this.getList();
|
||||
this.$message({
|
||||
message: "账号修改成功！",
|
||||
type: "success",
|
||||
});
|
||||
});
|
||||
this.editVisible = false;
|
||||
},
|
||||
//分页功能
|
||||
handleSizeChange(val) {
|
||||
this.current_page = val;
|
||||
console.log(this.current_page);
|
||||
this.getList();
|
||||
},
|
||||
handleCurrentChange(val) {
|
||||
this.per_page = val;
|
||||
console.log(this.per_page);
|
||||
this.getList();
|
||||
},
|
||||
},
|
||||
};
|
||||
@ -125,4 +259,8 @@ export default {
|
||||
justify-content: space-around;
|
||||
align-content: center;
|
||||
}
|
||||
|
||||
.block {
|
||||
margin-top: 30px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -5,109 +5,104 @@
|
||||
style="margin:20px">
|
||||
<div class="add-item-info"
|
||||
style="margin-bottom:10px;margin-left:52px">
|
||||
<div>
|
||||
<div style="font-size:14px;">商品列表：</div>
|
||||
<el-select v-model="lid"
|
||||
placeholder="选择商品">
|
||||
<el-option v-for="item in goodschoose"
|
||||
:key="item.id"
|
||||
:label="item.title"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<span style="font-size:14px;">商品图片：</span>
|
||||
<el-upload class="upload"
|
||||
action="/api/admin/upload"
|
||||
<!-- <UploadTem @urlimg='hanleurlimg'
|
||||
:number="2"
|
||||
:file='file' /> -->
|
||||
<!-- <el-upload class="upload"
|
||||
action="https://ct-upimg.yx090.com/api/upload"
|
||||
list-type="picture-card"
|
||||
:on-success="uploadGalleryItem"
|
||||
:on-remove="removeGalleryItem"
|
||||
:file-list="gallery">
|
||||
:on-success="successUpload"
|
||||
:on-error="errorUpload"
|
||||
:on-remove="removeUpload"
|
||||
:headers="headers"
|
||||
:limit="1">
|
||||
<img v-if="imageUrl"
|
||||
:src="imageUrl"
|
||||
class="avatar">
|
||||
<i v-else
|
||||
class="el-icon-plus avatar-uploader-icon"></i>
|
||||
</el-upload>
|
||||
</el-upload> -->
|
||||
</div>
|
||||
<el-form ref="form"
|
||||
:inline="true"
|
||||
:model="form">
|
||||
<div>
|
||||
<el-form-item label="商品名称：">
|
||||
<el-select v-model="form.name1"
|
||||
placeholder="商品名称">
|
||||
<el-option v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
<el-input placeholder="商品名称"
|
||||
v-model="form.title"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="商品编码：">
|
||||
<el-input placeholder="商品编码"
|
||||
v-model="form.goods_code"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="商品种类：">
|
||||
<el-select v-model="form.name2"
|
||||
<el-select v-model="form.type_id"
|
||||
placeholder="商品种类">
|
||||
<el-option v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
<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-select v-model="form.name3"
|
||||
<el-select v-model="form.brand_id"
|
||||
placeholder="商品品牌">
|
||||
<el-option v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
<el-option v-for="item in brand"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</div>
|
||||
<div v-for="(item,i) in specifyList">
|
||||
<div v-for="(item,i) in skus"
|
||||
:key="i">
|
||||
<span style="margin-right:-15px">{{i+1}}.</span>
|
||||
<el-form-item label="商品规格：">
|
||||
<el-select v-model="specifyList[i].specify"
|
||||
placeholder="商品规格">
|
||||
<!-- <el-option v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
</el-option> -->
|
||||
</el-select>
|
||||
<el-input placeholder="商品规格"
|
||||
v-model="skus[i].title"></el-input>
|
||||
</el-form-item>
|
||||
<span class="addto"
|
||||
v-if="!gid"
|
||||
@click="handleAdd()">+</span>
|
||||
<el-form-item label="商品编码：">
|
||||
<el-select v-model="specifyList[i].code"
|
||||
<el-form-item label="规格编码：">
|
||||
<el-input v-model="skus[i].sku_code"
|
||||
placeholder="商品编码">
|
||||
<!-- <el-option v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
</el-option> -->
|
||||
</el-select>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="商品状态：">
|
||||
<el-select v-model="specifyList[i].state"
|
||||
placeholder="在售（默认）">
|
||||
<!-- <el-option v-for="item in options"
|
||||
:key="item.value"
|
||||
<el-select v-model="skus[i].status"
|
||||
placeholder="下架（默认）">
|
||||
<el-option v-for="item in options"
|
||||
:key="item.id"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
</el-option> -->
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<div>
|
||||
<el-form-item label="商品数量：">
|
||||
<el-select v-model="specifyList[i].number"
|
||||
<el-input v-model="skus[i].num"
|
||||
placeholder="商品数量">
|
||||
<!-- <el-option v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
</el-option> -->
|
||||
</el-select>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="商品成本：">
|
||||
<el-select v-model="specifyList[i].cost"
|
||||
<el-input v-model="skus[i].cost"
|
||||
placeholder="商品成本">
|
||||
<!-- <el-option v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
</el-option> -->
|
||||
</el-select>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-button type="primary"
|
||||
@click="handleDelete(i)">删除</el-button>
|
||||
@ -115,7 +110,8 @@
|
||||
</div>
|
||||
<div class="btn">
|
||||
<el-form-item>
|
||||
<el-button type="primary">保存</el-button>
|
||||
<el-button type="primary"
|
||||
@click="handleSave()">保存</el-button>
|
||||
<el-button plain>取消</el-button>
|
||||
</el-form-item>
|
||||
</div>
|
||||
@ -129,69 +125,202 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import UploadTem from '../../../components/upload/index.vue'
|
||||
import {
|
||||
addGoods,
|
||||
checkGoods,
|
||||
goodsList,
|
||||
updateGoods,
|
||||
} from '../../../api/goods.js'
|
||||
import { goods_types, Brand_goods_types } from '../../../api/rankingData.js'
|
||||
export default {
|
||||
components: {
|
||||
UploadTem,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
gallery: '',
|
||||
imageUrl: '',
|
||||
specifyList: [
|
||||
lid: '', // 选择的商品列表id
|
||||
gid: '', // 商品id
|
||||
brand: [], // 品牌列表
|
||||
cate: [], // 种类列表
|
||||
goodschoose: [], // 商品列表
|
||||
// 规格列表
|
||||
skus: [
|
||||
{
|
||||
specify: '',
|
||||
code: '',
|
||||
state: '',
|
||||
number: '',
|
||||
title: '',
|
||||
sku_code: '',
|
||||
status: '',
|
||||
num: '',
|
||||
cost: '',
|
||||
},
|
||||
], // 规格列表
|
||||
],
|
||||
|
||||
// 增加商品表单
|
||||
form: {
|
||||
name1: '',
|
||||
name2: '',
|
||||
name3: '',
|
||||
name4: '',
|
||||
name5: '',
|
||||
name6: '',
|
||||
goods_id: '',
|
||||
title: '',
|
||||
img_url: 'abc.jpg',
|
||||
type_id: '',
|
||||
brand_id: '',
|
||||
goods_code: '',
|
||||
},
|
||||
// 商品状态
|
||||
options: [
|
||||
{
|
||||
value: '选项1',
|
||||
label: '黄金糕',
|
||||
id: '1',
|
||||
label: '在售',
|
||||
},
|
||||
{
|
||||
value: '选项2',
|
||||
label: '双皮奶',
|
||||
id: '2',
|
||||
label: '预警',
|
||||
},
|
||||
{
|
||||
value: '选项3',
|
||||
label: '蚵仔煎',
|
||||
},
|
||||
{
|
||||
value: '选项4',
|
||||
label: '龙须面',
|
||||
},
|
||||
{
|
||||
value: '选项5',
|
||||
label: '北京烤鸭',
|
||||
id: '0',
|
||||
label: '下架',
|
||||
},
|
||||
],
|
||||
file: [],
|
||||
}
|
||||
},
|
||||
|
||||
watch: {
|
||||
lid: {
|
||||
handler(newVal, oldVal) {
|
||||
if (newVal) {
|
||||
this.goodschoose.forEach((item) => {
|
||||
if (item.id == newVal) {
|
||||
this.form = { ...item }
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
deep: true, // 深度监听
|
||||
immediate: true, // 第一次改变就执行
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
// 查看一个商品
|
||||
handleUpdate() {
|
||||
this.gid = this.$route.query
|
||||
if (this.gid.id) {
|
||||
checkGoods(this.gid.id).then((res) => {
|
||||
console.log(res.data.data, 'oooppuu')
|
||||
const data = res.data.data
|
||||
const sku = this.skus[0]
|
||||
const list = {}
|
||||
Object.keys(data).map((key) => {
|
||||
Object.keys(sku).map((i) => {
|
||||
if (key == i) {
|
||||
list[i] = data[key]
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
}
|
||||
},
|
||||
// 商品列表
|
||||
handleList() {
|
||||
goodsList().then((res) => {
|
||||
this.goodschoose = res.data.data
|
||||
})
|
||||
},
|
||||
// 保存，增加一个商品
|
||||
handleSave() {
|
||||
if (this.gid) {
|
||||
const goods = this.form
|
||||
const sku = this.skus[0]
|
||||
const updata = {
|
||||
...goods,
|
||||
...sku,
|
||||
goods_id: this.lid,
|
||||
}
|
||||
console.log(updata, '24235345')
|
||||
// updateGoods(updata, this.gid).then((res) => {
|
||||
// console.log(res, '66666666')
|
||||
// })
|
||||
} else {
|
||||
const datas = {
|
||||
...this.form,
|
||||
skus: this.skus,
|
||||
}
|
||||
addGoods(datas)
|
||||
.then((res) => {
|
||||
if (res.data.httpCode == 200) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '添加成功',
|
||||
})
|
||||
this.updateForm()
|
||||
}
|
||||
})
|
||||
.catch((e) => {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: e.response.data.errorMessage.goods_code[0],
|
||||
})
|
||||
})
|
||||
}
|
||||
},
|
||||
// 修改成功后重置表单
|
||||
updateForm() {
|
||||
this.form = {
|
||||
title: '',
|
||||
img_url: 'abc.jpg',
|
||||
type_id: '',
|
||||
brand_id: '',
|
||||
goods_code: '',
|
||||
}
|
||||
this.skus = [
|
||||
{
|
||||
title: '',
|
||||
sku_code: '',
|
||||
status: '',
|
||||
num: '',
|
||||
cost: '',
|
||||
},
|
||||
]
|
||||
},
|
||||
// 增加一个商品规格
|
||||
handleAdd() {
|
||||
this.specifyList.push({
|
||||
specify: '',
|
||||
code: '',
|
||||
state: '',
|
||||
number: '',
|
||||
this.skus.push({
|
||||
title: '',
|
||||
sku_code: '',
|
||||
status: '',
|
||||
num: '',
|
||||
cost: '',
|
||||
})
|
||||
},
|
||||
// 删除一个商品规格
|
||||
handleDelete(index) {
|
||||
this.specifyList.splice(index, 1)
|
||||
this.skus.splice(index, 1)
|
||||
},
|
||||
uploadGalleryItem() {},
|
||||
removeGalleryItem() {},
|
||||
hanleurlimg(val) {
|
||||
console.log(val, '=+++++++++')
|
||||
},
|
||||
// 上传商品图片
|
||||
successUpload(file, fileList) {
|
||||
console.log(file, fileList, 5555)
|
||||
},
|
||||
errorUpload(file, fileList) {
|
||||
console.log(file, fileList, 5555)
|
||||
},
|
||||
// 移除商品图片
|
||||
removeUpload() {},
|
||||
},
|
||||
mounted() {
|
||||
this.gid = this.$route.query
|
||||
// 获取商品种类
|
||||
goods_types().then((res) => {
|
||||
this.cate = res.data.data
|
||||
})
|
||||
// 获取商品品牌
|
||||
Brand_goods_types().then((res) => {
|
||||
this.brand = res.data.data
|
||||
})
|
||||
this.handleList()
|
||||
this.handleUpdate()
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -8,67 +8,67 @@
|
||||
:inline="true"
|
||||
:model="form">
|
||||
<el-form-item label="商品名称：">
|
||||
<el-select v-model="form.name1"
|
||||
<el-input v-model="form.goods_title"
|
||||
placeholder="商品名称">
|
||||
<el-option v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="商品种类：">
|
||||
<el-select v-model="form.name2"
|
||||
<el-select v-model="form.type_id"
|
||||
placeholder="商品种类">
|
||||
<el-option v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
<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-select v-model="form.name3"
|
||||
<el-input v-model="form.sku_title"
|
||||
placeholder="商品规格">
|
||||
<el-option v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="商品品牌：">
|
||||
<el-select v-model="form.name4"
|
||||
<el-select v-model="form.brand_id"
|
||||
placeholder="商品品牌">
|
||||
<el-option v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
<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-input v-model="form.keyword_type"
|
||||
placeholder="商品库存">
|
||||
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="商品状态：">
|
||||
<el-select v-model="form.name5"
|
||||
<el-select v-model="form.status"
|
||||
placeholder="商品状态">
|
||||
<el-option v-for="item in options"
|
||||
:key="item.value"
|
||||
:key="item.id"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="创建时间：">
|
||||
<el-date-picker v-model="value1"
|
||||
<el-date-picker v-model="timer"
|
||||
type="datetimerange"
|
||||
range-separator="至"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
align="right">
|
||||
align="right"
|
||||
value-format="yyyy-MM-DD hh:mm:ss">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary">筛选</el-button>
|
||||
<el-button plain>重置筛选</el-button>
|
||||
<el-button type="primary"
|
||||
@click="handleChoose">筛选</el-button>
|
||||
<el-button plain
|
||||
@click="handleReChoose">重置筛选</el-button>
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
@ -95,9 +95,11 @@
|
||||
<el-button type="primary"
|
||||
plain>库存盘点</el-button>
|
||||
<el-button type="primary"
|
||||
plain>导入商品</el-button>
|
||||
plain
|
||||
@click="handleImport">导入商品</el-button>
|
||||
<el-button type="primary"
|
||||
plain>表格导出</el-button>
|
||||
plain
|
||||
@click="handleExport">表格导出</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
@ -112,36 +114,45 @@
|
||||
width="55">
|
||||
</el-table-column>
|
||||
<el-table-column label="商品信息">
|
||||
<template slot-scope="scope">{{ scope.row.date }}</template>
|
||||
<template slot-scope="scope">
|
||||
<div>{{ scope.row.goods.img_url}}</div>
|
||||
<div>{{ scope.row.goods.title}}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="name"
|
||||
label="品类">
|
||||
<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 prop="address"
|
||||
label="规格">
|
||||
<el-table-column label="规格"
|
||||
prop="title">
|
||||
</el-table-column>
|
||||
<el-table-column prop="name"
|
||||
label="品牌">
|
||||
<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="address"
|
||||
<el-table-column prop="two_days_ago_num"
|
||||
sortable
|
||||
label="2天前库存">
|
||||
</el-table-column>
|
||||
<el-table-column prop="name"
|
||||
<el-table-column prop="yesterday_num"
|
||||
sortable
|
||||
label="1天前库存">
|
||||
</el-table-column>
|
||||
<el-table-column prop=""
|
||||
sortable
|
||||
<el-table-column sortable
|
||||
label="今日到货">
|
||||
<template>
|
||||
<div v-if="isShow">
|
||||
<template slot-scope="scope">
|
||||
<div>
|
||||
<div v-if="true">
|
||||
<el-input v-model="input"></el-input>
|
||||
</div>
|
||||
<div>{{ scope.row.daily!=null?scope.row.daily.arrived_today_num:0}}</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
</el-table-column>
|
||||
<el-table-column prop=""
|
||||
<el-table-column prop="cost"
|
||||
sortable
|
||||
label="成本">
|
||||
<template>
|
||||
@ -151,58 +162,76 @@
|
||||
</template>
|
||||
|
||||
</el-table-column>
|
||||
<el-table-column prop="address"
|
||||
<el-table-column prop="reference_price"
|
||||
sortable
|
||||
label="参考售价">
|
||||
|
||||
</el-table-column>
|
||||
<el-table-column prop="name"
|
||||
<el-table-column prop="num"
|
||||
sortable
|
||||
label="总量">
|
||||
</el-table-column>
|
||||
<el-table-column prop="address"
|
||||
<el-table-column prop="reserve"
|
||||
sortable
|
||||
label="预留量">
|
||||
</el-table-column>
|
||||
<el-table-column prop="name"
|
||||
<!-- <el-table-column prop="name"
|
||||
sortable
|
||||
label="店铺订单">
|
||||
</el-table-column>
|
||||
<el-table-column prop="address"
|
||||
sortable
|
||||
</el-table-column> -->
|
||||
<el-table-column sortable
|
||||
label="损耗">
|
||||
<template>
|
||||
<div class="loss">66</div>
|
||||
|
||||
<template slot-scope="scope">
|
||||
|
||||
<el-popover width="200"
|
||||
placement="right"
|
||||
trigger="hover">
|
||||
<div class="detail">
|
||||
<div>损耗数量：<input /></div>
|
||||
<span>损耗：</span>
|
||||
<el-input></el-input>
|
||||
</div>
|
||||
<el-radio-group v-model="radio">
|
||||
<el-radio :label="3">备选项</el-radio>
|
||||
<el-radio :label="6">备选项</el-radio>
|
||||
<el-radio :label="9">备选项</el-radio>
|
||||
<el-radio :label="3">48h以上</el-radio>
|
||||
<el-radio :label="6">到货错误</el-radio>
|
||||
<el-radio :label="9">灰霉</el-radio>
|
||||
<el-radio :label="2">长度</el-radio>
|
||||
<el-radio :label="4">花朵</el-radio>
|
||||
<el-radio :label="5">其他</el-radio>
|
||||
</el-radio-group>
|
||||
|
||||
<div class="list_btn">
|
||||
<el-button type="primary">保存</el-button>
|
||||
<el-button>取消</el-button>
|
||||
</div>
|
||||
<div class="loss"
|
||||
slot="reference">{{ scope.row.daily?scope.row.daily.arrived_loss_num:0}}</div>
|
||||
</el-popover>
|
||||
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="name"
|
||||
<el-table-column prop="stock"
|
||||
sortable
|
||||
label="库存">
|
||||
</el-table-column>
|
||||
<el-table-column prop="address"
|
||||
sortable
|
||||
label="库存盘点">
|
||||
<el-input v-model="input"></el-input>
|
||||
<template slot-scope="scope">
|
||||
<div>{{ scope.row.daily?scope.row.daily.inventory:0}}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="name"
|
||||
<el-table-column prop="status"
|
||||
label="状态">
|
||||
</el-table-column>
|
||||
<el-table-column label="操作">
|
||||
<template>
|
||||
<template slot-scope="scope">
|
||||
<div>
|
||||
<el-button type="text">修改</el-button>
|
||||
<el-button type="text">库存</el-button>
|
||||
</div>
|
||||
<div>
|
||||
<el-button type="text">编辑</el-button>
|
||||
<el-button type="text"
|
||||
@click="handleEdit(scope.row.id)">编辑</el-button>
|
||||
</div>
|
||||
<div>
|
||||
<el-button type="text">记录</el-button>
|
||||
@ -215,90 +244,59 @@
|
||||
</div>
|
||||
<el-button type="primary">确定</el-button>
|
||||
</el-card>
|
||||
|
||||
<el-pagination @size-change="handleSizeChange"
|
||||
<div class="page-pagination">
|
||||
<el-pagination :total="total"
|
||||
class="mt-4"
|
||||
:current-page="form.page"
|
||||
:page-size="form.per_page"
|
||||
@current-change="handleCurrentChange"
|
||||
:current-page="currentPage4"
|
||||
:page-sizes="[100, 200, 300, 400]"
|
||||
:page-size="100"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="400">
|
||||
@size-change="handleSizeChange"
|
||||
layout="total, prev, pager, next, jumper">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { goods } from '../../api/goods'
|
||||
import { goods_types, Brand_goods_types } from '../../api/rankingData.js'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
total: 0, // 总条数
|
||||
timer: '', // 筛选的时间
|
||||
radio: '', // 损耗选择的原因
|
||||
brand: [], // 品牌列表
|
||||
cate: [], // 种类列表
|
||||
isShow: false, // 点击上新显示输入框
|
||||
tableData: [], // 商品列表
|
||||
// 商品状态
|
||||
options: [
|
||||
{
|
||||
value: '选项1',
|
||||
label: '黄金糕',
|
||||
id: '1',
|
||||
label: '在售',
|
||||
},
|
||||
{
|
||||
value: '选项2',
|
||||
label: '双皮奶',
|
||||
id: '2',
|
||||
label: '预警',
|
||||
},
|
||||
{
|
||||
value: '选项3',
|
||||
label: '蚵仔煎',
|
||||
},
|
||||
{
|
||||
value: '选项4',
|
||||
label: '龙须面',
|
||||
},
|
||||
{
|
||||
value: '选项5',
|
||||
label: '北京烤鸭',
|
||||
},
|
||||
],
|
||||
tableData: [
|
||||
{
|
||||
date: '2016-05-03',
|
||||
name: '王小虎',
|
||||
address: '上海市普陀区金沙江路 1518 弄',
|
||||
},
|
||||
{
|
||||
date: '2016-05-02',
|
||||
name: '王小虎',
|
||||
address: '上海市普陀区金沙江路 1518 弄',
|
||||
},
|
||||
{
|
||||
date: '2016-05-04',
|
||||
name: '王小虎',
|
||||
address: '上海市普陀区金沙江路 1518 弄',
|
||||
},
|
||||
{
|
||||
date: '2016-05-01',
|
||||
name: '王小虎',
|
||||
address: '上海市普陀区金沙江路 1518 弄',
|
||||
},
|
||||
{
|
||||
date: '2016-05-08',
|
||||
name: '王小虎',
|
||||
address: '上海市普陀区金沙江路 1518 弄',
|
||||
},
|
||||
{
|
||||
date: '2016-05-06',
|
||||
name: '王小虎',
|
||||
address: '上海市普陀区金沙江路 1518 弄',
|
||||
},
|
||||
{
|
||||
date: '2016-05-07',
|
||||
name: '王小虎',
|
||||
address: '上海市普陀区金沙江路 1518 弄',
|
||||
id: '0',
|
||||
label: '下架',
|
||||
},
|
||||
],
|
||||
|
||||
// 请求商品列表的参数
|
||||
form: {
|
||||
name1: '',
|
||||
name2: '',
|
||||
name3: '',
|
||||
name4: '',
|
||||
name5: '',
|
||||
name6: '',
|
||||
goods_title: '', // 商品名称
|
||||
type_id: '', // 商品种类id
|
||||
brand_id: '', // 商品品牌id
|
||||
sku_title: '', // 商品规格
|
||||
status: '', // 商品状态
|
||||
keyword_type: '', // 库存
|
||||
keyword_value: '',
|
||||
page: 1,
|
||||
per_page: 5,
|
||||
},
|
||||
input: '',
|
||||
value1: '',
|
||||
@ -306,6 +304,52 @@ export default {
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 列表编辑
|
||||
handleEdit(id) {
|
||||
this.$router.push('/addgoods?id=' + id)
|
||||
},
|
||||
// 获取商品列表
|
||||
getList() {
|
||||
this.form.keyword_value = this.timer[0] + '-' + this.timer[1]
|
||||
const forms = { ...this.form }
|
||||
console.log(forms, 'opopo')
|
||||
goods(forms).then((res) => {
|
||||
this.tableData = res.data.data
|
||||
console.log(res, 111)
|
||||
// console.log(this.tableData, 'ppp')
|
||||
})
|
||||
},
|
||||
// 筛选
|
||||
handleChoose() {
|
||||
this.getList()
|
||||
},
|
||||
// 分页-当前页改变
|
||||
handleCurrentChange(e) {
|
||||
this.form.page = e
|
||||
this.handleChoose()
|
||||
},
|
||||
// 分页
|
||||
handleSizeChange(e) {
|
||||
this.form.per_page = e
|
||||
this.getList()
|
||||
},
|
||||
// 重置筛选
|
||||
handleReChoose() {
|
||||
this.form = {
|
||||
goods_title: '', // 商品名称
|
||||
type_id: '', // 商品种类id
|
||||
brand_id: '', // 商品品牌id
|
||||
sku_title: '', // 商品规格
|
||||
status: '', // 商品状态
|
||||
keyword_type: '',
|
||||
}
|
||||
this.timer = ''
|
||||
},
|
||||
|
||||
// 导入商品
|
||||
handleImport() {},
|
||||
// 导出商品
|
||||
handleExport() {},
|
||||
// 点击上新
|
||||
update() {
|
||||
this.isShow = true
|
||||
@ -318,24 +362,20 @@ export default {
|
||||
},
|
||||
// 新增商品
|
||||
addNewgoods() {
|
||||
this.$router.push({ path: '/index/yingyeting/addgoods' })
|
||||
this.$router.push({ path: '/addgoods' })
|
||||
},
|
||||
// 分页
|
||||
handleSizeChange(val) {
|
||||
console.log(`每页 ${val} 条`)
|
||||
},
|
||||
handleCurrentChange(val) {
|
||||
console.log(`当前页: ${val}`)
|
||||
},
|
||||
// 商品列表
|
||||
getGoods() {
|
||||
goods().then((res) => {
|
||||
console.log('商品列表', res)
|
||||
mounted() {
|
||||
// 获取商品种类
|
||||
goods_types().then((res) => {
|
||||
this.cate = res.data.data
|
||||
})
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.getGoods()
|
||||
// 获取商品品牌
|
||||
Brand_goods_types().then((res) => {
|
||||
this.brand = res.data.data
|
||||
})
|
||||
// 获取商品列表
|
||||
this.getList()
|
||||
},
|
||||
}
|
||||
</script>
|
||||
@ -344,14 +384,19 @@ export default {
|
||||
.loss {
|
||||
position: relative;
|
||||
}
|
||||
.detail {
|
||||
position: absolute;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border: 1px solid black;
|
||||
background: red;
|
||||
right: 0;
|
||||
|
||||
/deep/ .detail .el-button,
|
||||
/deep/ .detail .el-button--primary {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
line-height: 5px;
|
||||
}
|
||||
/deep/ .detail .el-input,
|
||||
/deep/ .detail .el-input__inner {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
.goods {
|
||||
}
|
||||
.table {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user