875 lines
30 KiB
Vue
875 lines
30 KiB
Vue
<script>
|
|
import {getToken} from "@/utils/auth";
|
|
import {getCardCoupon, insertGiftApi, updateGiftApi} from "@/api/integral/gift";
|
|
import {listLJGoods} from "@/api/convenienceStore/ljgoods";
|
|
import {selectTree} from "@/api/convenienceStore/goods";
|
|
import {getGiftCategoryApi} from "@/api/integral/category";
|
|
|
|
export default {
|
|
name: "in-add",
|
|
dicts: ['zhzt', 'lplx', 'redemptionMethod', 'expressShippingCosts', 'shippingMethod'],
|
|
props: ['giftDataF'],
|
|
data() {
|
|
var valiNumberPass = (rule, value, callback) => {//包含小数的数字
|
|
let reg = /^[+-]?(0|([1-9]\d*))(\.\d+)?$/g;
|
|
if (value === '') {
|
|
callback(new Error('请输入内容'));
|
|
} else if (!reg.test(value)) {
|
|
callback(new Error('请输入数字'));
|
|
} else {
|
|
callback();
|
|
}
|
|
};
|
|
return {
|
|
giftTypeOption: [
|
|
{
|
|
value: '1',
|
|
label: '电子券'
|
|
},
|
|
{
|
|
value: '2',
|
|
label: '实物商品'
|
|
}
|
|
],
|
|
title: '添加礼品',
|
|
openCommodity: false,
|
|
getGiftTypeShow: '',
|
|
stock: null,
|
|
// 兑换卷
|
|
cardFavorableList: [],
|
|
// 优惠券
|
|
cardExchangeApiList: [],
|
|
dataForm: {
|
|
id: null,
|
|
giftName: '', // 礼品名称
|
|
categoryId: '', // 分类id
|
|
goodsId: '', // 商品Id
|
|
goodsName: '', // 商品Id
|
|
coverImage: '', // 封面图
|
|
giftImages: [], // 礼品图片
|
|
giftType: '电子券', // 礼品类型
|
|
couponId: '',// 优惠券
|
|
giftQuantity: 1, // 礼品数量
|
|
totalInventory: '', // 库存
|
|
exchangeMethod: '积分', // 兑换方式
|
|
exchangePoints: '', // 兑换积分
|
|
exchangeTimes: '', // 兑换次数
|
|
moneyRatio: '', // 价钱比例
|
|
expressShippingFee: '', // 快递运费
|
|
shippingFeeAmount: '', // 运费金额
|
|
exchangeamount: '', // 兑换金额
|
|
// deliveryMethod:['门店自提'], // 配送方式
|
|
deliveryMethod: [], // 配送方式
|
|
detailedDescription: '', // 图文详情
|
|
categoryName: 1,
|
|
sort: null,
|
|
status: '启用',
|
|
market: 0
|
|
},
|
|
showList: {
|
|
// 优惠类型展示
|
|
coupon: true,
|
|
voucher: false,
|
|
goods: false,
|
|
// 兑换方式展示
|
|
jf: true,
|
|
je: false,
|
|
jfje: false,
|
|
jfjq: false,
|
|
// 配送方式
|
|
delivery: false,
|
|
express: false,
|
|
shippingFee: false
|
|
},
|
|
giftCategoryList: [], // 查询分类列表
|
|
commodityList: [], // 查询分类列表
|
|
|
|
// 批量图片
|
|
giftImages: [],
|
|
// 上传地址
|
|
uploadAction: process.env.VUE_APP_BASE_API + 'backendApi/file/upload',
|
|
uploadHeader: {'Access-Token': getToken()},
|
|
// 隐藏上传
|
|
hideUpload: false,
|
|
// 上传文件列表
|
|
uploadFiles: [
|
|
{
|
|
name: "nihao",
|
|
url: 'http://localhost:8008/static/uploadImages/20231103/ffbbe7d3ee1441fdaf706802fa0f176a.png'
|
|
}
|
|
],
|
|
// 图片根目录
|
|
imagePath: process.env.VUE_APP_BASE_API,
|
|
|
|
dialogImageUrl: "",
|
|
dialogVisible: false,
|
|
rulesInventory: {},
|
|
rules: {
|
|
deliveryMethod: [
|
|
{type: 'array', required: true, message: '请至少选择一个配送方式', trigger: 'change'}
|
|
],
|
|
giftName: [
|
|
{required: true, message: "礼品名称不能为空", trigger: "blur"},
|
|
],
|
|
coverImage: [
|
|
{required: true, message: "封面不能为空", trigger: "blur"},
|
|
],
|
|
giftType: [
|
|
{required: true, message: "礼品类型不能为空", trigger: "change"},
|
|
],
|
|
couponId: [
|
|
{required: true, message: "请选择优惠券", trigger: "blur"},
|
|
],
|
|
goodsId: [
|
|
{required: true, message: "请选择关联商品", trigger: "change"},
|
|
],
|
|
giftQuantity: [
|
|
{required: true, message: "礼品数量不能为空", trigger: "blur"},
|
|
],
|
|
totalInventory: [
|
|
{required: true, message: "礼品库存不能为空", trigger: "blur"},
|
|
],
|
|
exchangeMethod: [
|
|
{required: true, message: "兑换方式不能为空", trigger: "blur"},
|
|
],
|
|
exchangePoints: [
|
|
{required: true, validator: valiNumberPass, trigger: "blur"},
|
|
],
|
|
exchangeAmount: [
|
|
{required: true, validator: valiNumberPass, trigger: "blur"},
|
|
],
|
|
moneyRatio: [
|
|
{required: true, validator: valiNumberPass, trigger: "blur"},
|
|
],
|
|
expressShippingFee: [
|
|
{required: true, message: "快递运费不能为空", trigger: "change"},
|
|
],
|
|
shippingFeeAmount: [
|
|
{required: true, validator: valiNumberPass, trigger: "blur"},
|
|
],
|
|
market: [
|
|
{required: true, validator: valiNumberPass, trigger: "blur"},
|
|
],
|
|
exchangeTimes: [
|
|
{required: true, message: "兑换次数不能为空", trigger: "change"},
|
|
],
|
|
sort: [
|
|
{required: true, message: "礼品排序不能为空", trigger: "blur"},
|
|
],
|
|
status: [
|
|
{required: true, message: "请选择礼品状态", trigger: "change"},
|
|
],
|
|
|
|
},
|
|
commodityForm: {
|
|
cvsGoodId: "",
|
|
cvsGood: "",
|
|
supplierId: "",
|
|
supplier: "",
|
|
detailed: "",
|
|
remark: "",
|
|
page: 1,
|
|
pageSize: 1000,
|
|
isRecovery: 0,
|
|
status: "qy"
|
|
},
|
|
|
|
|
|
cvsGoodList: [],
|
|
// 供应商列表
|
|
supplierList: [],
|
|
|
|
}
|
|
},
|
|
computed: {
|
|
selectedCoupon() {
|
|
return this.cardFavorableList.find(option => option.id === this.dataForm.couponId);
|
|
}
|
|
},
|
|
created() {
|
|
console.log("参数", this.$route.params.giftDataF)
|
|
if (this.$route.params.giftDataF) {
|
|
// 修改 需要查询出 关联的 优惠券 或 商品 以及库存 处理
|
|
this.dataForm = this.$route.params.giftDataF
|
|
this.init(this.dataForm)
|
|
} else {
|
|
// 新增 需要查询 全部的 优惠券
|
|
this.cardFavorableApi()
|
|
|
|
|
|
}
|
|
|
|
},
|
|
methods: {
|
|
handleCouponChange(newVal) {
|
|
console.log('新选择的优惠券对象:', this.selectedCoupon);
|
|
// 设置 礼品库存 最大约束
|
|
this.stock = this.selectedCoupon.tfTotal - this.selectedCoupon.tfGetNum;
|
|
// 设置 礼品库存 初始化 值
|
|
this.dataForm.totalInventory = 1
|
|
},
|
|
// 取消按钮
|
|
async init(data) {
|
|
//查询优惠券
|
|
await this.cardFavorableApi(data);
|
|
await this.selectGiftCategory1();
|
|
//查询商品
|
|
this.getCommodityList(data);
|
|
this.giftImages = []
|
|
data.giftImages = JSON.parse(data.giftImages);
|
|
data.giftImages.forEach(res => {
|
|
let newImage = {
|
|
url: this.imagePath + res,
|
|
fileName: res
|
|
}
|
|
this.giftImages.push(newImage);
|
|
}),
|
|
this.changeGiftType(this.dataForm.giftType)
|
|
this.changeExchange(this.dataForm.exchangeMethod)
|
|
this.changeExpressEDIT()
|
|
|
|
},
|
|
|
|
cancel() {
|
|
this.$router.back();
|
|
|
|
},
|
|
submitForm: function () {
|
|
let this_ = this
|
|
// if (this.dataForm.deliveryMethod.length === 0) {
|
|
// this.$message.warning('请至少选择一个配送方式');
|
|
// return;
|
|
// }
|
|
this_.$refs["form"].validate(valid => {
|
|
if (valid) {
|
|
if (Array.isArray(this_.dataForm.giftImages)) {
|
|
this_.dataForm.giftImages = JSON.stringify(this_.dataForm.giftImages);
|
|
}
|
|
if (this_.dataForm.deliveryMethod != null && Array.isArray(this_.dataForm.deliveryMethod)) {
|
|
this_.dataForm.deliveryMethod = JSON.stringify(this.dataForm.deliveryMethod);
|
|
}
|
|
this_.dataForm.remainingInventory = this_.dataForm.totalInventory
|
|
|
|
if (this_.dataForm.id == null) {
|
|
// 判断是否是新增还是修改
|
|
insertGiftApi(this_.dataForm).then(res => {
|
|
// this_.getList(),
|
|
// this_.open = false
|
|
this.$router.back();
|
|
|
|
})
|
|
} else {
|
|
// 判断是否是新增还是修改
|
|
updateGiftApi(this_.dataForm).then(res => {
|
|
// this_.getList()
|
|
// this_.open = false
|
|
this.$router.back();
|
|
|
|
})
|
|
}
|
|
}
|
|
})
|
|
},
|
|
// 分类查询
|
|
selectGiftCategory1() {
|
|
let queryParams = {pageSize: 1000}
|
|
getGiftCategoryApi(queryParams).then(response => {
|
|
this.giftCategoryList = response.data.records;
|
|
})
|
|
},
|
|
// 选择礼品类型
|
|
changeGiftType(newVal) {
|
|
console.log('新值', newVal)
|
|
let this_ = this
|
|
if (newVal == '电子券') {
|
|
this_.showList.coupon = true
|
|
this_.showList.goods = false
|
|
this_.showList.delivery = false
|
|
} else if (newVal == '实物商品') {
|
|
this_.showList.coupon = false
|
|
this_.showList.goods = true
|
|
this_.showList.delivery = true
|
|
}
|
|
},
|
|
// 上传封面
|
|
handleUploadSuccessCover(file) {
|
|
this.dataForm.coverImage = file.data.fileName;
|
|
},
|
|
// 上传详情图
|
|
handleUploadSuccessGift(file) {
|
|
let newImage = {
|
|
url: process.env.VUE_APP_SERVER_URL + file.data.fileName,
|
|
fileName: file.data.fileName
|
|
}
|
|
if (this.giftImages == undefined) {
|
|
this.giftImages = [];
|
|
}
|
|
this.giftImages.push(newImage);
|
|
this.dataForm.giftImages.push(file.data.fileName);
|
|
|
|
|
|
console.log("this.giftImage", this.giftImages)
|
|
console.log(" this.dataForm.giftImages", this.dataForm.giftImages)
|
|
},
|
|
|
|
// 点击按钮处理
|
|
handleIsopenSelect() {
|
|
this.$forceUpdate()
|
|
},
|
|
handleRemove(file, fileList) {
|
|
|
|
console.log(file, fileList)
|
|
this.giftImages.forEach((image, index) => {
|
|
if (file.url === image.url) {
|
|
this.giftImages.splice(index, 1);
|
|
}
|
|
});
|
|
|
|
this.dataForm.giftImages.forEach((image, index) => {
|
|
if (file.fileName === image) {
|
|
this.dataForm.giftImages.splice(index, 1);
|
|
}
|
|
})
|
|
console.log("this.giftImage", this.giftImages)
|
|
console.log(" this.dataForm.giftImages", this.dataForm.giftImages)
|
|
},
|
|
handlePictureCardPreview(file) {
|
|
console.log(file);
|
|
this.dialogImageUrl = file.url;
|
|
this.dialogVisible = true;
|
|
},
|
|
|
|
|
|
handleChildValue(value) {
|
|
this.dataForm.detailedDescription = value
|
|
},
|
|
|
|
// 快递（处理选择）
|
|
changeExpress(data, flag) {
|
|
let this_ = this
|
|
// express: false,
|
|
// shippingFee: false
|
|
if (flag === 1) {
|
|
if (!this.dataForm.deliveryMethod) {
|
|
this.dataForm.deliveryMethod = [];
|
|
this.showList.express = false
|
|
}
|
|
if (!Array.isArray(this.dataForm.deliveryMethod)) {
|
|
this.dataForm.deliveryMethod = JSON.parse(this.dataForm.deliveryMethod);
|
|
|
|
}
|
|
// const jsonArray = JSON.parse(this.dataForm.deliveryMethod);
|
|
// const index = jsonArray.indexOf(data);
|
|
const index = this.dataForm.deliveryMethod.indexOf(data);
|
|
if (index === -1) {
|
|
this.dataForm.deliveryMethod.push(data);
|
|
// const jsonArray = JSON.parse(this.dataForm.deliveryMethod);
|
|
// jsonArray.push(data)
|
|
// this.dataForm.deliveryMethod = jsonArray
|
|
|
|
if (data == '物流配送') {
|
|
this.showList.express = true
|
|
}
|
|
} else {
|
|
this.dataForm.deliveryMethod.splice(index, 1)
|
|
// const jsonArray = JSON.parse(this.dataForm.deliveryMethod);
|
|
// jsonArray.splice(index, 1);
|
|
// this.dataForm.deliveryMethod = JSON.stringify(jsonArray)
|
|
|
|
if (data == '物流配送') {
|
|
this.showList.express = false
|
|
}
|
|
}
|
|
} else {
|
|
if (data == '包邮') {
|
|
this.showList.shippingFee = false
|
|
} else if (data == '统一运费') {
|
|
this.showList.shippingFee = true
|
|
}
|
|
}
|
|
},
|
|
// 快递 修改时处理
|
|
changeExpressEDIT() {
|
|
if (!this.dataForm.deliveryMethod) {
|
|
this.dataForm.deliveryMethod = [];
|
|
this.showList.express = false
|
|
}
|
|
if (!this.dataForm.expressShippingFee) {
|
|
this.dataForm.expressShippingFee = ''
|
|
this.showList.shippingFee = false
|
|
}
|
|
let this_ = this
|
|
if (!Array.isArray(this_.dataForm.deliveryMethod)) {
|
|
this_.dataForm.deliveryMethod = JSON.parse(this_.dataForm.deliveryMethod);
|
|
}
|
|
if (this_.dataForm.deliveryMethod && this_.dataForm.deliveryMethod.includes("物流配送")) {
|
|
this.showList.express = true
|
|
|
|
}
|
|
if (this_.dataForm.expressShippingFee == "统一运费") {
|
|
this.showList.shippingFee = true
|
|
}
|
|
|
|
},
|
|
// 兑换方式
|
|
changeExchange(newVal) {
|
|
let this_ = this
|
|
if (newVal == '积分') {
|
|
this_.showList.jf = true
|
|
this_.showList.je = false
|
|
this_.showList.jfjq = false
|
|
} else if (newVal == '金额') {
|
|
this_.showList.jf = false
|
|
this_.showList.je = true
|
|
this_.showList.jfjq = false
|
|
} else if (newVal == '积分+金额') {
|
|
this_.showList.jf = true
|
|
this_.showList.je = true
|
|
this_.showList.jfjq = false
|
|
} else if (newVal == '积分+加钱购') {
|
|
this_.showList.jf = true
|
|
this_.showList.je = false
|
|
this_.showList.jfjq = true
|
|
}
|
|
},
|
|
cardFavorableApi(val) {
|
|
getCardCoupon().then(res => {
|
|
this.cardFavorableList = res.data
|
|
if (val.couponId) {
|
|
let obj = this.cardFavorableList.find(option => option.id == val.couponId)
|
|
this.stock = obj.tfTotal - obj.tfGetNum
|
|
console.log('当前库存', this.stock)
|
|
}
|
|
})
|
|
|
|
},
|
|
getCommodity() {
|
|
this.getQueryList()
|
|
this.openCommodity = true
|
|
|
|
},
|
|
// 商品列表
|
|
getCommodityList(data) {
|
|
let this_ = this
|
|
listLJGoods(this_.commodityForm).then(res => {
|
|
this_.commodityList = res.data.records;
|
|
if (data.goodsId){
|
|
let row = this.commodityList.find(option => option.id == data.goodsId)
|
|
this.dataForm.totalInventory = row.stock
|
|
this.stock = row.stock
|
|
this.dataForm.market = row.retailPrice
|
|
this.dataForm.goodsName = row.name
|
|
this.dataForm.goodsId = row.id
|
|
}
|
|
})
|
|
},
|
|
// 查询搜索列表信息
|
|
getQueryList() {
|
|
selectTree().then(response => {
|
|
this.cvsGoodList = response.data.records
|
|
});
|
|
// listSupplier().then(response => {
|
|
// this.supplierList = response.data.records
|
|
// })
|
|
},
|
|
// 查询商品
|
|
inquire() {
|
|
this.getCommodityList();
|
|
},
|
|
handleRowClick(row) {
|
|
this.openCommodity = false
|
|
this.$refs.tables.clearSelection(); // 清除当前选中的行
|
|
this.$refs.tables.toggleRowSelection(row); // 选中当前点击的行
|
|
// 处理选中的行数据
|
|
console.log("row", row)
|
|
// stock
|
|
this.dataForm.totalInventory = row.stock
|
|
this.stock = row.stock
|
|
this.dataForm.market = row.retailPrice
|
|
this.dataForm.goodsName = row.name
|
|
this.dataForm.goodsId = row.id
|
|
|
|
},
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="container1">
|
|
|
|
<div class="card-change" >
|
|
|
|
<div style="display: flex; justify-content: space-between">
|
|
|
|
<div style="width: 62%;height: 500px;">
|
|
<el-form ref="form" :model="dataForm" :rules="rules" label-width="80px">
|
|
|
|
<el-row :gutter="24">
|
|
<el-col :span="12">
|
|
<el-form-item label="礼品名称" prop="giftName">
|
|
<el-input v-model="dataForm.giftName" placeholder="请输入礼品名称" maxlength="30"/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="分类" prop="categoryId">
|
|
<el-select clearable v-model="dataForm.categoryId" placeholder="请选择礼品分类" style="width:100%">
|
|
<el-option label="-不分类-" value=""></el-option>
|
|
<el-option
|
|
v-for="option in giftCategoryList"
|
|
:key="option.id"
|
|
|
|
:label="option.categoryName"
|
|
:value="option.id"
|
|
></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
|
|
<el-row :gutter="24">
|
|
<el-col :span="12">
|
|
<el-form-item label="礼品类型" prop="giftType">
|
|
<el-radio-group v-model="dataForm.giftType" @change="changeGiftType($event)">
|
|
<el-radio
|
|
v-for="dict in giftTypeOption"
|
|
:key="dict.value"
|
|
:label="dict.label"
|
|
:value="dict.value"
|
|
/>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item v-if="showList.coupon" label="优惠券" prop="couponId">
|
|
<el-select v-model="dataForm.couponId" placeholder="请选择" style="width:100%"
|
|
@change="handleCouponChange">
|
|
<el-option
|
|
v-for="option in cardFavorableList"
|
|
:key="option.id"
|
|
:label="option.name"
|
|
:value="option.id"
|
|
></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
|
|
|
|
<el-form-item v-if="showList.goods" label="关联商品" prop="goodsId">
|
|
<el-input v-model="dataForm.goodsName" placeholder="" maxlength="30" style="width:100%"
|
|
@focus="getCommodity"/>
|
|
<!-- </el-select> -->
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
|
|
<el-row :gutter="24">
|
|
<el-col :span="12">
|
|
<el-form-item label="当前库存" prop="">
|
|
<el-input v-model="stock" controls-position="right" :min="1" :max="10" label="" style="width:100%"
|
|
:disabled="true"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="礼品库存" prop="totalInventory">
|
|
<el-input-number v-model.number="dataForm.totalInventory" :disabled="title === '修改礼品'"
|
|
controls-position="right" :min="0" :max="stock"></el-input-number>
|
|
<!-- <el-input :disabled="title === '修改礼品'" v-model.number="dataForm.totalInventory" placeholder="礼品库存" :min="1" :max="stock" maxlength="30" style="width:100%"/>-->
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<!-- <el-row :gutter="24">-->
|
|
<!-- <el-col :span="12">-->
|
|
<!-- <el-form-item label="商品库存" prop="">-->
|
|
<!-- <el-input v-model="stock" controls-position="right" :min="1" :max="10" label="" style="width:100%" :disabled="true"></el-input>-->
|
|
<!-- </el-form-item>-->
|
|
<!-- </el-col>-->
|
|
<!-- <el-col :span="12">-->
|
|
<!-- <el-form-item label="礼品库存" prop="totalInventory">-->
|
|
<!-- <el-input :disabled="title === '修改礼品'" v-model.number="dataForm.totalInventory" placeholder="礼品库存" maxlength="30" style="width:100%"/>-->
|
|
<!-- </el-form-item>-->
|
|
<!-- </el-col>-->
|
|
<!-- </el-row>-->
|
|
|
|
<el-row :gutter="24">
|
|
<el-col :span="12">
|
|
<el-form-item label="成本价" prop="market">
|
|
<el-input v-model="dataForm.market" disabled maxlength="30" style="width:100%">
|
|
<template slot="append">元</template>
|
|
</el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="兑换方式" prop="exchangeMethod">
|
|
<el-radio-group v-model="dataForm.exchangeMethod" @change="changeExchange($event)">
|
|
<el-radio
|
|
v-for="dict in dict.type.redemptionMethod"
|
|
:key="dict.value"
|
|
:label="dict.label"
|
|
@change="handleIsopenSelect"
|
|
:value="dict.value"/>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
|
|
<el-row :gutter="24">
|
|
<el-col :span="12">
|
|
<el-form-item label="礼品排序" prop="sort">
|
|
<el-input-number v-model="dataForm.sort" :min="1" :max="10" label=""
|
|
style="width:100%"></el-input-number>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col v-if="showList.jf" :span="12">
|
|
<el-form-item v-show="showList.jf" label="兑换积分" prop="exchangePoints">
|
|
<el-input v-model="dataForm.exchangePoints" placeholder="" style="width:100%">
|
|
<template slot="append">积分</template>
|
|
</el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col v-if="showList.je" :span="8">
|
|
<el-form-item label="兑换金额" prop="exchangeAmount">
|
|
<el-input v-model="dataForm.exchangeAmount" placeholder="" maxlength="30" style="width:100%">
|
|
<template slot="append">元</template>
|
|
</el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col v-if="showList.jfjq" :span="7">
|
|
<el-form-item label="加钱比例" prop="moneyRatio">
|
|
<el-input v-model="dataForm.moneyRatio" placeholder="" maxlength="30" style="width:100%">
|
|
<template slot="prepend">1积分=</template>
|
|
<template slot="append">元</template>
|
|
</el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
|
|
<el-row :gutter="24">
|
|
<el-col :span="12">
|
|
<el-form-item label="兑换次数" prop="exchangeTimes">
|
|
<el-input v-model.number="dataForm.exchangeTimes" placeholder="" maxlength="30" style="width:100%">
|
|
<template slot="append">次</template>
|
|
</el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
|
|
</el-col>
|
|
</el-row>
|
|
|
|
</el-form>
|
|
|
|
|
|
</div>
|
|
|
|
<div style="width: 35%;height: 550px;">
|
|
<el-form :model="dataForm" :rules="rules" label-width="80px">
|
|
|
|
<el-form-item label="封面图" prop="coverImage">
|
|
<el-upload
|
|
:action="uploadAction"
|
|
list-type="picture-card"
|
|
:class="{hide:hideUpload}"
|
|
:file-list="uploadFiles"
|
|
:auto-upload="true"
|
|
:show-file-list="false"
|
|
:headers="uploadHeader"
|
|
:on-success="handleUploadSuccessCover">
|
|
<img
|
|
v-if="this.dataForm.coverImage"
|
|
:src="imagePath + this.dataForm.coverImage"
|
|
class="list-img"
|
|
/>
|
|
<i v-if="!this.dataForm.coverImage" class="el-icon-plus"></i>
|
|
</el-upload>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="礼品图片">
|
|
<el-upload
|
|
:action="uploadAction"
|
|
list-type="picture-card"
|
|
:file-list="giftImages"
|
|
:headers="uploadHeader"
|
|
:auto-upload="true"
|
|
:on-preview="handlePictureCardPreview"
|
|
:on-success="handleUploadSuccessGift"
|
|
style="height: 100px;"
|
|
:on-remove="handleRemove">
|
|
<i class="el-icon-plus"></i>
|
|
</el-upload>
|
|
<el-dialog :visible.sync="dialogVisible">
|
|
<img width="100%" :src="dialogImageUrl" alt="">s
|
|
</el-dialog>
|
|
|
|
</el-form-item>
|
|
<el-form-item label="配送方式" style="margin-top: 50px" prop="deliveryMethod">
|
|
<el-checkbox v-for="item in dict.type.shippingMethod" :key="item.value" :label="item.label"
|
|
:checked="dataForm.deliveryMethod != null?dataForm.deliveryMethod.includes(item.label):null"
|
|
@change="changeExpress(item.label,1)">{{ item.label }}
|
|
</el-checkbox>
|
|
</el-form-item>
|
|
<!-- <el-form-item label="快递运费" prop="expressShippingFee">-->
|
|
<!-- <el-radio-group v-model="dataForm.expressShippingFee" @change="changeExpress($event,2)">-->
|
|
<!-- <el-radio-->
|
|
<!-- v-for="dict in dict.type.expressShippingCosts"-->
|
|
<!-- :key="dict.value"-->
|
|
<!-- :label="dict.label"-->
|
|
<!-- @change="handleIsopenSelect"-->
|
|
<!-- :value="dict.value"/>-->
|
|
<!-- </el-radio-group>-->
|
|
<!-- </el-form-item>-->
|
|
<!-- <el-form-item label="运费金额" prop="shippingFeeAmount">-->
|
|
<!-- <el-input v-model="dataForm.shippingFeeAmount" placeholder="" maxlength="30" style="width: 202px;" >-->
|
|
<!-- <template slot="append">元</template>-->
|
|
<!-- </el-input>-->
|
|
<!-- </el-form-item>-->
|
|
<el-form-item label="礼品状态" prop="status">
|
|
<el-radio-group v-model="dataForm.status">
|
|
<el-radio
|
|
v-for="dict in dict.type.zhzt"
|
|
:key="dict.value"
|
|
:label="dict.label"
|
|
@change="handleIsopenSelect"
|
|
:value="dict.value"/>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-form>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<el-form :model="dataForm" :rules="rules" label-width="80px">
|
|
|
|
<el-row :gutter="24">
|
|
<el-col :span="23">
|
|
<el-form-item label="图文详情" prop="detailedDescription">
|
|
<editor @input="handleChildValue" :value.default="dataForm.detailedDescription"
|
|
:height.default="150"></editor>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</el-form>
|
|
<div slot="footer" class="dialog-footer">
|
|
<el-button type="primary" @click="submitForm">确 定</el-button>
|
|
<el-button @click="cancel">取 消</el-button>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<el-dialog title="选择商品" :visible.sync="openCommodity" width="1000px" append-to-body :close-on-click-modal="false">
|
|
<el-container>
|
|
<el-header style="">
|
|
<el-form ref="tankForm" :model="commodityForm" label-width="80px">
|
|
<el-row :gutter="24">
|
|
<el-col :span="6">
|
|
<el-form-item label="商品分类">
|
|
<el-select
|
|
v-model="commodityForm.cvsGoodId"
|
|
placeholder="全部"
|
|
clearable
|
|
>
|
|
<el-option v-for="item in cvsGoodList" :key="item.id" :label="item.name" :value="item.id"/>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="6">
|
|
<el-form-item label="供应商" prop="supplierId">
|
|
<el-select
|
|
v-model="commodityForm.supplierId"
|
|
placeholder="全部"
|
|
clearable
|
|
>
|
|
<el-option v-for="item in supplierList" :key="item.id" :label="item.name" :value="item.id"/>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="详细信息">
|
|
<el-input v-model="commodityForm.remark" placeholder="商品名称，拼音码，条形码等信息"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="4">
|
|
<el-button type="primary" @click="inquire()">查询</el-button>
|
|
</el-col>
|
|
</el-row>
|
|
</el-form>
|
|
</el-header>
|
|
<el-main>
|
|
<el-table
|
|
ref="tables"
|
|
:data="commodityList"
|
|
@row-click="handleRowClick"
|
|
border
|
|
>
|
|
<el-table-column type="index" label="序号"></el-table-column>
|
|
|
|
<!-- <el-table-column type="selection" width="55"></el-table-column> -->
|
|
|
|
<el-table-column label="商品名称" align="center" prop="name"/>
|
|
<el-table-column label="商品编码" align="center" prop="goodsNo"/>
|
|
<el-table-column label="分类名称" prop="cvsGoodId" align="center">
|
|
<template slot-scope="scope">
|
|
<span>{{ getName(cvsGoodList, scope.row.cvsGoodId) }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column label="供应商" prop="supplierId" align="center">
|
|
<template slot-scope="scope">
|
|
<span>{{ getName(supplierList, scope.row.supplierId) }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="单位" align="center" prop="unit"/>
|
|
<el-table-column label="当前库存" align="center" prop="stock"/>
|
|
</el-table>
|
|
|
|
</el-main>
|
|
</el-container>
|
|
<!-- <div slot="footer" class="dialog-footer">
|
|
<el-button type="primary" @click="addCommodity">确 定</el-button>
|
|
<el-button @click="cancel">取 消</el-button>
|
|
</div> -->
|
|
</el-dialog>
|
|
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped lang="scss">
|
|
.container1 {
|
|
background: #F4F5F9;
|
|
box-sizing: border-box;
|
|
padding: 10px;
|
|
}
|
|
|
|
.app-container {
|
|
width: 100%;
|
|
height: 100%;
|
|
background: #f6f8f9;
|
|
}
|
|
.card-change{
|
|
height: 91vh;
|
|
}
|
|
.d-dialog > > > .el-upload--picture-card {
|
|
width: 100px;
|
|
height: 100px;
|
|
line-height: 100px;
|
|
}
|
|
|
|
.d-dialog > > > .avatar-uploader .el-upload {
|
|
width: 100px;
|
|
height: 100px;
|
|
}
|
|
|
|
.d-dialog > > > .el-upload-list--picture-card .el-upload-list__item {
|
|
width: 100px;
|
|
height: 100px;
|
|
}
|
|
|
|
.list-img {
|
|
width: 98px;
|
|
height: 98px;
|
|
}
|
|
</style>
|