Skip to content

S
shop-new
提交 ca336fe7 authored 作者: 王天霸's avatar 王天霸
浏览文件
操作

1

上级 8efba4dc
全部展开 隐藏空白字符变更
内嵌 并排
正在显示 包含 0 行增加 和 3557 行删除
src/views/system/goods/add/components/goodsimg.vue deleted 100644 → 0
浏览文件 @ 8efba4dc
<template>
<div class="goods-img" v-loading="loading">
<el-form ref="goodsDeForm" :model="goodsDeForm" :rules="goodsDeRules" label-width="150px" size="small">
<el-form-item label="商品详情：" prop="spxq">
<span class="tip-span" style="display: block;line-height: 34px;">上传图片详情，用于商品详情页展示，建议尺寸宽度为750px或790px</span>
<el-upload
class="upload-img"
list-type="picture-card"
action="#"
:limit="10"
:on-exceed="limitImg10"
:http-request="uploadGoodsDetailsImg"
:on-preview="handlePicPreview"
:on-remove="handleRemove"
:file-list="goodsDetailsImgFileList"
><i class="el-icon-plus" />
</el-upload>
<el-dialog :visible.sync="goodsDeImgVisible">
<img width="100%" :src="goodsDeImgUrlDialog" alt="">
</el-dialog>
</el-form-item>
</el-form>
</div>
</template>
<script>
import {UploadImg} from '@/api/module/goods'
export default {
name: "Goodsimg",
props: {
imgdata: {
type: Object,
required: true
}
},
data() {
let checkImg = (rule, value, callback) => {
if (this.goodsDetailsImgFileList.length < 1) {
callback(new Error("请上传商品详情的图片"));
} else {
callback();
}
};
return {
loading: false,
goodsDeForm: {
spxq: ''
},
goodsDeRules: {
spxq:[{required: true, message: '请上传商品详情图片', validator: checkImg}]
},
goodsDeImgVisible: false,
goodsDeImgUrlDialog: '',
goodsDetailsImgFileList: [],
};
},
components: {},
mounted() {
},
watch: {},
methods: {
// 上传 详情 图片
uploadGoodsDetailsImg(param) {
this.getBase64(param.file).then( res => {
let result = res.split(",");
this.Base64img = result[1];
let data = {"image":this.Base64img};
UploadImg(data).then( res=> {
let urlObj = {'url': ''};
if(res.data) {
urlObj.url = res.data.data.imageUrl;
this.goodsDetailsImgFileList.push(urlObj);
this.$message({type:'success',message:'图片上传成功'});
// // 只清除一次，不浪费哦
if(this.goodsDetailsImgFileList.length === 1) {
this.$refs.goodsDeForm.clearValidate('spxq');
}
}
});
});
},
// 详情图片，限制 20 张
limitImg10() {
this.$message({ message: '最多上传10张图片', type: 'warning' })
},
// 详情图片 预览
handlePicPreview(file) {
this.goodsDeImgUrlDialog = file.url;
this.goodsDeImgVisible = true;
},
// 删除 详情图片
handleRemove(file) {
for (let i = 0; i < this.goodsDetailsImgFileList.length; i++) {
if (file.uid === this.goodsDetailsImgFileList[i].uid) {
this.goodsDetailsImgFileList.splice(i, 1)
}
}
if(this.goodsDetailsImgFileList.length === 0) {
this.$refs.goodsDeForm.validateField('spxq')
}else {
this.$refs.goodsDeForm.clearValidate('spxq');
}
},
// 商品详情 子组件 form表单校验, 在父组件中被调用
validateGoodsDeImgForm() {
let flag = null
this.$refs['goodsDeForm'].validate(valid => {
if (valid) {
flag = true
} else {
flag = false
}
})
return flag
},
// -------------------------通用
// 图片转换为 base64
getBase64(file) {
return new Promise(function (resolve, reject) {
let reader = new FileReader();
let imgResult = "";
reader.readAsDataURL(file);
reader.onload = function () {
imgResult = reader.result;
};
reader.onerror = function (error) {
reject(error);
};
reader.onloadend = function () {
resolve(imgResult);
};
});
},
},
};
</script>
<style lang="scss" type="text/stylus" scoped>
.goods-img {
padding: 15px 0px;
margin-top: 18px;
}
/* 一般提示性文字 */
.tip-span {
color: #909399;
font-size: 12px;
}
</style>
src/views/system/goods/add/components/goodsparameter.vue deleted 100644 → 0
浏览文件 @ 8efba4dc
<template>
<div class="goods-parameter">
<p class="tip-p">
<el-link class="edit-type-span el-icon-search" type="primary" :underline="false">查看各类价格说明</el-link>
<span class="tip-span">所有商品价格均为含税价，必须开具发票</span>
</p>
<div v-for="(item,index) in orgGoodsPam.pamTableList" :key="index" class="single-spe-con">
<p style="margin: 10px 0;color: #333;font-size: 14px;font-weight: 400;">
<!-- <span v-html="preTableTitle[index]">-->
<!-- {{ preTableTitle[index] }}-->
<!-- </span>-->
<span v-for="(itemv,indexv) in orgGoodsPam.pamDataList[index]" style="margin-right:20px;">
{{orgGoodsPam.pamNameList[indexv]['specName']}}
<span>：</span>
{{itemv[0]}}
</span>
</p>
<el-table
border
size="small"
:data="item"
style="width: 80%"
>
<el-table-column align="center" prop="hh1" label="协议价">
<template slot-scope="scope">
<el-input size="mini" style="width:90%" v-model="scope.row.hh1" placeholder="请输入协议价"></el-input>
</template>
</el-table-column>
<el-table-column align="center" prop="hh2" label="结算价">
<template slot-scope="scope">
<el-input size="mini" style="width:90%" v-model="scope.row.hh2" :disabled="true" placeholder="根据结算价自动计算"></el-input>
</template>
</el-table-column>
<el-table-column align="center" prop="hh3" label="指导价">
<template slot-scope="scope">
<el-input size="mini" style="width:90%" v-model="scope.row.hh3" placeholder="请输入指导价"></el-input>
</template>
</el-table-column>
<el-table-column align="center" prop="hh4" label="市场价">
<template slot-scope="scope">
<el-input size="mini" style="width:90%" v-model="scope.row.hh4" placeholder="请输入市场价"></el-input>
</template>
</el-table-column>
<el-table-column align="center" prop="hh5" label="库存量">
<template slot-scope="scope">
<el-input size="mini" style="width:90%" v-model="scope.row.hh5" placeholder="请输入库存量"></el-input>
</template>
</el-table-column>
<el-table-column align="center" prop="hh6" label="库存预警">
<template slot-scope="scope">
<el-input size="mini" style="width:90%" v-model="scope.row.hh6" placeholder="请输入预警值"></el-input>
</template>
</el-table-column>
<el-table-column align="center" prop="hh7" label="图片">
<template slot-scope="scope">
</template>
</el-table-column>
</el-table>
</div>
</div>
</template>
<script>
export default {
name: 'goodsparameter',
props: {
parameterdata: {
type: Object,
required: true
}
},
data() {
return {
orgGoodsPam: {},
preTableTitle: [],
// 规格名称数组
// goodsSpecNameList: [],
// // 每一个规格，都是一张表格
// goodsPam:[
// {
// speNameList:[ '颜色','尺码' ],
// goodsParametersList: [],
// goodsPamPreTable: [{
// hh1: '',
// hh2: '',
// hh3: '',
// hh4: '',
// hh5: '',
// hh6: '',
// hh7: '',
// }],
// },
// {
// speNameList:[ '颜色','尺码' ],
// goodsParametersList: [],
// goodsPamPreTable: [ {
// hh1: '',
// hh2: '',
// hh3: '',
// hh4: '',
// hh5: '',
// hh6: '',
// hh7: '',
// } ]}
// ],
// goodsPamPreTable: [],
// goodsPamPreObj:
} // return end
},
watch:{
'parameterdata': function(val) {
this.orgGoodsPam = val;
//this.preTableTitle = [];
// this.orgGoodsPam.pamDataList.forEach((item)=> {
// let preTitle = '';
// if (!Array.isArray(item)) {
// preTitle = this.orgGoodsPam.pamNameList[0].specName + '：' + item;
// }else {
// item.forEach((itemI,indexI)=> {
// preTitle += (this.orgGoodsPam.pamNameList[indexI].specName + " " + itemI) + " ";
// });
// }
// this.preTableTitle.push(preTitle);
// });
},
},
created() {
//this.orgGoodsPam = this.parameterdata;
},
mounted() {
//console.log("9999",this.goodsPamPreList);
},
methods: {
} // methods end
}
</script>
<style scoped>
p {
margin: 0;
padding: 0;
}
.tip-p {
margin: 0 0 20px 0;
}
.goods-parameter {
padding: 15px 0;
margin-top: 18px;
}
.edit-type-span {
display: inline-block;
cursor: pointer;
margin: 0 20px;
}
.single-spe-con {
margin: 25px 0;
}
/* 一般提示性文字 */
.tip-span {
color: #909399;
font-size: 12px;
}
</style>
src/views/system/goods/add/index.vue deleted 100644 → 0
浏览文件 @ 8efba4dc
差异被折叠。
src/views/system/goods/offsale/index.vue deleted 100644 → 0
浏览文件 @ 8efba4dc
<template>
<div class="app-container">
<el-card class="box-card">
<div slot="header" class="clearfix">
<el-form :inline="true" class="queryFormInline">
<el-row :span="24" type="flex" align="middle" justify="space-between">
<el-col :span="18">
<p style="font-size: 18px; float:left;">下架商品列表</p>
</el-col>
<el-col :span="6">
<el-form-item style="float: right">
<el-button
type="primary"
icon="el-icon-plus"
size="mini"
@click="handleAdd"
>新增
</el-button>
<el-button
type="success"
icon="el-icon-edit"
size="mini"
@click="handleOnsale"
>申请上架
</el-button>
<el-button
type="danger"
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
>删除
</el-button>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
<!-- <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="商品ID" prop="goods_id">
<el-input
v-model="queryParams.goods_id"
placeholder="请输入商品ID"
clearable
size="small"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form> -->
<el-table v-loading="loading" :data="goodsList" :height="tableHeight" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center"/>
<el-table-column label="商品主图" align="center" width="100" prop="defaultImage">
<template slot-scope="scope">
<el-image
style="width: 60px; height: 50px"
:src="scope.row.defaultImage"
></el-image>
</template>
</el-table-column>
<el-table-column label="商品ID" align="center" prop="goodsId"/>
<el-table-column label="商品名称" align="center" prop="goodsName"/>
<el-table-column label="协议价" align="center" :formatter="formatePrice" prop="jsPrice"/>
<el-table-column label="物流运费" align="center" :formatter="formatePrice" prop="wlPrice"/>
<el-table-column label="市场售价" align="center" :formatter="formatePrice" prop="scPrice"/>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
@click="handleUpdate(scope.row)"
>编辑
</el-button>
<el-divider direction="vertical"></el-divider>
<el-button
size="mini"
type="text"
@click="handleDelete(scope.row)"
>删除
</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改goods对话框 -->
<el-dialog :title="title" :visible.sync="open" width="80%" append-to-body>
<IndexBtn :option="form" @closeDialog="closeDialog"/>
</el-dialog>
</el-card>
</div>
</template>
<script>
import IndexBtn from '../add'
import {listGoods, getGoods, delGoods, addGoods, updateGoods, OffSaleList, Onsale} from '@/api/module/goods'
export default {
name: "goods",
data() {
return {
fullHeight: 0,
tableHeight: 0,
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// goods表格数据
goodsList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 查询参数
queryParams: {
isOnsale: 0
},
// 表单参数
form: {},
// 表单校验
rules: {
goods_name: [
{required: true, message: "商品名称不能为空", trigger: "blur"}
],
}
};
},
components: {
IndexBtn
},
created() {
this.getList();
this.$nextTick(() => {
this.fullHeight = document.getElementsByClassName('box-card')[0].clientHeight
})
},
watch: {
fullHeight(val) {
let formHeight = document.getElementsByClassName('clearfix')[0].clientHeight
this.tableHeight = val - formHeight - 100;
}
},
methods: {
//格式化价格
formatePrice(row, s, value, i) {
var nm = 0
var money = value
if (money > 0) {
nm = money / 100
}
return nm
},
/** 查询goods列表 */
getList() {
this.loading = true;
listGoods(this.queryParams).then(res => {
if(res.code === 1 && res.data) {
this.goodsList = res.data.list;
this.total = res.data.count;
}else if(res.code === 0) {
if(res.msg) {
this.$message({type: 'error',message: res.msg});
}else {
this.$message({type: 'error',message: '数据出错啦！'});
}
}
this.loading = false;
});
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.goodsId)
this.single = true
this.multiple = !selection.length
},
/** 上架操作 */
handleOnsale(row) {
const rowIds = row.goodsId || this.ids;
let params = {"ids": rowIds, "status": 1};
if(!rowIds || rowIds.length === 0) {
this.$message({message: '请先选择要上架的商品数据', type: 'warning'});
return;
}
Onsale(params).then(res => {
this.msgSuccess("成功申请" + res.length + "个商品");
});
},
/** 新增按钮操作 */
handleAdd() {
this.$router.push({
path: '/system/goods/add'
});
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const goods_id = row.goodsId
this.$router.push({
path: '/system/goods/add', query: {goodsId: goods_id}
});
// getGoods(goods_id).then(response => {
// this.form = response.data;
// this.open = true;
// this.title = "修改goods";
// });
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.goods_id != null) {
updateGoods(this.form).then(response => {
if (response.code === 0) {
this.msgSuccess("修改成功");
this.open = false;
this.getList();
}
});
} else {
addGoods(this.form).then(response => {
if (response.code === 0) {
this.msgSuccess("新增成功");
this.open = false;
this.getList();
}
});
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const goods_ids = row.goodsId || this.ids;
this.$confirm('是否确认删除商品ID为"' + goods_ids + '"的数据项?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function () {
return delGoods(goods_ids);
}).then(() => {
this.getList();
this.msgSuccess("删除成功");
}).catch(function () {
});
},
// 子组件关闭父组件对话框
closeDialog(params) {
this.open = params;
}
} //methods结束
};
</script>
<style scoped>
.app-container {
height: 100%;
}
.box-card {
height: 100%;
}
.box-card /deep/ .el-card__body {
height: 100%;
overflow: hidden;
}
.el-table {
height: calc(100% - 120px);
}
/deep/ .el-dialog {
height: 90%;
overflow: hidden;
}
/deep/ .el-dialog__body {
height: 100%;
//height: calc(100% - 20px);
overflow-x: hidden;
overflow-y: scroll;
}
</style>
src/views/system/goods/onsale/index.vue deleted 100644 → 0
浏览文件 @ 8efba4dc
<template>
<div class="app-container">
<el-card class="box-card">
<div slot="header" class="clearfix">
<el-form :model="queryParams" ref="queryForm" :inline="true" class="queryFormInline">
<el-row :span="24" type="flex" align="middle" justify="space-between">
<el-col :span="20">
<el-form-item label="商品Id" prop="goodsId">
<el-input
size="small"
placeholder="请输入商品Id"
v-model="queryParams.goodsId"
></el-input>
</el-form-item>
<el-form-item label="商品名称" prop="goodsName">
<el-input
size="small"
placeholder="请输入商品名称"
v-model="queryParams.goodsName"
></el-input>
</el-form-item>
<el-form-item>
<el-button
size="mini"
type="primary"
icon="el-icon-search"
@click="handleQuery"
>搜索</el-button>
<el-button
size="mini"
icon="el-icon-refresh"
@click="resetQuery('queryForm')"
>重置</el-button>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item style="float: right">
<el-button
type="primary"
icon="el-icon-plus"
size="mini"
@click="handleAdd"
>新增
</el-button>
<el-button
type="success"
icon=""
size="mini"
@click="handleOffGoods"
>商品下架
</el-button>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
<el-table v-loading="loading" :data="goodsList" :height="tableHeight" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center"/>
<el-table-column label="商品主图" align="center" width="100" prop="defaultImage">
<template slot-scope="scope">
<el-image
style="width: 60px; height: 50px"
:src="scope.row.defaultImage"
></el-image>
</template>
</el-table-column>
<el-table-column label="商品ID" align="center" prop="goodsId"/>
<el-table-column label="商品名称" align="center" prop="goodsName"/>
<el-table-column label="协议价" align="center" :formatter="formatePrice" prop="jsPrice"/>
<el-table-column label="物流运费" align="center" :formatter="formatePrice" prop="wlPrice"/>
<el-table-column label="市场售价" align="center" :formatter="formatePrice" prop="scPrice"/>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
@click="handleOffGoods(scope.row)"
>下架
</el-button>
<el-divider direction="vertical"></el-divider>
<el-button
size="mini"
type="text"
@click="handleUpdate(scope.row)"
>编辑
</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改goods对话框 -->
<el-dialog :title="title" :visible.sync="open" :modal-append-to-body="false" width="90%"
style="height:90%;overflow:hidden;" append-to-body>
<IndexBtn :option="form"/>
</el-dialog>
</el-card>
</div>
</template>
<script>
import IndexBtn from '../add'
import {listGoods, getGoods, delGoods, addGoods, updateGoods, Onsale} from '@/api/module/goods'
export default {
name: "goods",
data() {
return {
fullHeight: 0,
tableHeight: 0,
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// goods表格数据
goodsList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 查询参数
queryParams: {
isOnsale: 1,
goodsId: '',
goodsName: ''
},
// 表单参数
form: {},
// 表单校验
rules: {
goods_name: [
{required: true, message: "商品名称不能为空", trigger: "blur"}
],
}
};
},
components: {
IndexBtn
},
created() {
this.getList();
this.$nextTick(() => {
this.fullHeight = document.getElementsByClassName('box-card')[0].clientHeight
})
},
watch: {
fullHeight(val) {
let formHeight = document.getElementsByClassName('clearfix')[0].clientHeight
this.tableHeight = val - formHeight - 100;
}
},
methods: {
/*商品下架*/
handleOffGoods(row) {
const rowIds = row.goodsId || this.ids;
let params = {"ids": rowIds, "status": 0};
if (!rowIds || rowIds.length === 0) {
this.$message({message: '请先选择要下架的商品数据', type: 'warning'});
return;
}
this.$confirm('是否确认下架商品ID为"' + rowIds + '"的数据项?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function () {
return Onsale(params);
}).then(() => {
this.getList();
this.msgSuccess("下架成功");
}).catch(() => {
});
},
//格式化价格
formatePrice(row, s, value, i) {
var nm = 0
var money = value
if (money > 0) {
nm = money / 100
}
return nm
},
/** 查询goods列表 */
getList() {
this.loading = true;
listGoods(this.queryParams).then(res => {
if(res.code === 1 && res.data) {
this.goodsList = res.data.list;
this.total = res.data.count;
}else if(res.code === 0) {
if(res.msg) {
this.$message({type: 'error',message: res.msg});
}else {
this.$message({type: 'error',message: '数据出错啦！'});
}
}
this.loading = false;
});
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.goodsId)
this.single = selection.length !== 1
this.multiple = !selection.length
},
/** 下架操作 */
handleOnsale() {
Onsale({"ids": this.ids, "status": 0}).then(response => {
this.msgSuccess("成功申请" + response.data.length + "个商品");
});
},
/** 新增按钮操作 */
handleAdd() {
this.$router.push({
path: '/system/goods/add'
});
},
/** 详情按钮操作 */
handleUpdate(row) {
const goods_id = row.goodsId
this.$router.push({
path: '/system/goods/add', query: {goodsId: goods_id}
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.goodsId != null) {
updateGoods(this.form).then(response => {
if (response.code === 0) {
this.msgSuccess("修改成功");
this.open = false;
this.getList();
}
});
} else {
addGoods(this.form).then(response => {
if (response.code === 0) {
this.msgSuccess("新增成功");
this.open = false;
this.getList();
}
});
}
}
});
},
// 重置
resetQuery(form) {
this.resetForm("queryForm");
this.handleQuery();
},
} //methods结束
};
</script>
<style scoped>
.app-container {
height: 100%;
}
/deep/ .el-dialog {
height: 100%;
}
/deep/ .el-dialog__body {
height: 80%;
overflow-y: scroll;
}
.box-card {
height: 100%;
}
.box-card /deep/ .el-card__body {
height: 100%;
overflow: hidden;
}
.el-table {
height: calc(100% - 120px);
}
</style>
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论