提交 38e05341 authored 作者: 王鹏飞's avatar 王鹏飞

update

上级 91859b33
...@@ -2,9 +2,8 @@ ...@@ -2,9 +2,8 @@
<div class="upload-wrapper"> <div class="upload-wrapper">
<el-upload <el-upload
class="avatar-uploader" class="avatar-uploader"
action="https://webapp-pub.ezijing.com" action="https://webapp-pub.oss-cn-beijing.aliyuncs.com"
type="drag" type="drag"
:show-file-list="false"
:before-upload="beforeUpload" :before-upload="beforeUpload"
:on-success="handleSuccess" :on-success="handleSuccess"
:data="data" :data="data"
......
<template> <template>
<section class="app-main"> <section class="app-main">
<div class="app-main-header"> <div class="app-main-inner">
<app-breadcrumb v-if="hasBreadcrumb"></app-breadcrumb> <div class="app-main-header">
</div> <app-breadcrumb v-if="hasBreadcrumb"></app-breadcrumb>
<div class="app-main-container"> </div>
<router-view></router-view> <div class="app-main-container">
<router-view></router-view>
</div>
</div> </div>
</section> </section>
</template> </template>
...@@ -35,9 +37,16 @@ export default { ...@@ -35,9 +37,16 @@ export default {
margin-left: 200px; margin-left: 200px;
padding: 0 24px; padding: 0 24px;
} }
.app-main-inner {
max-width: 1272px;
margin: 0 auto;
}
.app-main-container::after { .app-main-container::after {
content: ''; content: '';
display: table; display: table;
clear: both; clear: both;
} }
.el-form--label-top .el-form-item__label {
padding-bottom: 0;
}
</style> </style>
<template> <template>
<div v-loading="loading" element-loading-text="拼命加载中"> <div v-loading="loading" element-loading-text="拼命加载中">
<el-form :model="ruleForm" :rules="rules" label-width="120px" ref="ruleForm" @submit.native.prevent> <el-form :model="ruleForm" :rules="rules" label-position="top" ref="ruleForm" @submit.native.prevent>
<app-card title="商品类型"> <app-card title="商品类型">
<el-radio-group v-model="ruleForm.category_id"> <el-radio-group v-model="ruleForm.category_id">
<el-radio :label="item.id" border v-for="item in goodsType" :key="item.id">{{ item.name }}</el-radio> <el-radio :label="item.id" border v-for="item in goodsType" :key="item.id">{{ item.name }}</el-radio>
</el-radio-group> </el-radio-group>
</app-card> </app-card>
<app-card title="基本信息"> <app-card title="基本信息">
<el-form-item label="商品名" prop="spu_name"> <el-row :gutter="20">
<el-input placeholder="请输入店铺、品牌、机构的全称" v-model="ruleForm.spu_name"></el-input> <el-col :span="12">
</el-form-item> <el-form-item label="商品标题" prop="spu_name">
<el-form-item label="分享描述" prop="describe"> <el-input placeholder="请输入店铺、品牌、机构的全称" v-model="ruleForm.spu_name"></el-input>
<el-input v-model="ruleForm.describe"></el-input> </el-form-item>
<p class="form-tips">微信分享给好友时会显示,建议36个字以内</p> </el-col>
</el-form-item> <el-col :span="12">
<el-form-item label="分享描述" prop="describe">
<el-input v-model="ruleForm.describe"></el-input>
<p class="form-tips">微信分享给好友时会显示,建议36个字以内</p>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="商品卖点" prop="charact"> <el-form-item label="商品卖点" prop="charact">
<el-input v-model="ruleForm.charact"></el-input> <el-input v-model="ruleForm.charact"></el-input>
<p class="form-tips">在商品详情页标题下面展示卖点信息,建议60字以内</p> <p class="form-tips">在商品详情页标题下面展示卖点信息,建议60字以内</p>
</el-form-item> </el-form-item>
<el-form-item label="商品图" prop="chart_oss"> <el-form-item label="商品图" prop="chart_oss">
<app-upload v-model="ruleForm.chart_oss"></app-upload> <app-upload v-model="ruleForm.chart_oss"></app-upload>
<p class="form-tips">建议尺寸:800*800像素,你可以拖拽图片调整顺序,最多上传15张</p> <p class="form-tips">建议尺寸:800*800像素,你可以拖拽图片调整顺序,最多上传15张</p>
</el-form-item> </el-form-item>
...@@ -34,6 +41,7 @@ ...@@ -34,6 +41,7 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
</app-card> </app-card>
<app-card title="价格库存"> <app-card title="价格库存">
<el-form-item label="商品规格" prop="skuKeyValueList"> <el-form-item label="商品规格" prop="skuKeyValueList">
<sku v-model="ruleForm.skuKeyValueList"></sku> <sku v-model="ruleForm.skuKeyValueList"></sku>
...@@ -45,40 +53,22 @@ ...@@ -45,40 +53,22 @@
> >
<sku-view :sku="ruleForm.skuKeyValueList" v-model="ruleForm.goodStockList"></sku-view> <sku-view :sku="ruleForm.skuKeyValueList" v-model="ruleForm.goodStockList"></sku-view>
</el-form-item> </el-form-item>
<!-- <el-form-item label="价格" prop="sellPrice">
<el-input v-model="ruleForm.sellPrice" :disabled="disabledInput">
<template slot="prepend">¥</template>
</el-input>
</el-form-item>
<el-form-item label="划线价" prop="originPrice">
<el-input v-model="ruleForm.originPrice"></el-input>
</el-form-item>
<el-form-item label="库存" prop="balanceCount">
<el-input v-model="ruleForm.balanceCount" :disabled="disabledInput"></el-input>
</el-form-item>
<el-form-item label="成本价" prop="code">
<el-input v-model="ruleForm.code">
<template slot="prepend">¥</template>
</el-input>
</el-form-item> -->
</app-card> </app-card>
<app-card title="其他信息"> <app-card title="其他信息">
<el-form-item label="开售方式" prop="sales_type"> <el-form-item label="开售方式" prop="sales_type">
<el-radio-group v-model="ruleForm.sales_type"> <el-radio-group v-model="ruleForm.sales_type">
<el-radio label="1">立即开售</el-radio> <el-radio label="1">立即开售</el-radio>
<div> <el-radio label="2">定时开售</el-radio>
<el-radio label="2">定时开售</el-radio>
<el-input v-model="ruleForm.sales_time" v-if="ruleForm.sales_type === '2'" />
</div>
<el-radio label="3">放入仓库</el-radio> <el-radio label="3">放入仓库</el-radio>
</el-radio-group> </el-radio-group>
<el-input v-model="ruleForm.sales_time" v-if="ruleForm.sales_type === '2'" />
</el-form-item> </el-form-item>
<el-form-item label="立即购买按钮" prop="buy_button_text"> <el-form-item label="立即购买按钮" prop="buy_button_text">
<el-radio-group v-model="ruleForm.buy_button_text"> <el-radio-group v-model="ruleForm.buy_button_text">
<el-radio label="1">默认名称</el-radio> <el-radio label="1">默认名称</el-radio>
<el-radio label="2">自定义名称</el-radio> <el-radio label="2">自定义名称</el-radio>
<el-input v-model="ruleForm.buy_button_text" />
</el-radio-group> </el-radio-group>
<el-input v-model="ruleForm.buy_button_text" />
</el-form-item> </el-form-item>
<el-form-item label="售后服务" prop="after_sales_mode"> <el-form-item label="售后服务" prop="after_sales_mode">
<el-radio-group v-model="ruleForm.after_sales_mode"> <el-radio-group v-model="ruleForm.after_sales_mode">
...@@ -87,10 +77,10 @@ ...@@ -87,10 +77,10 @@
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
</app-card> </app-card>
<div class="form-action"> <div class="form-footer">
<div class="inner"> <div class="inner">
<el-button size="small" type="primary" @click="onSubmit">保存并查看</el-button> <el-button type="primary" @click="onSubmit">保存并查看</el-button>
<el-button size="small" @click="onCancel">下一步</el-button> <el-button @click="onCancel">下一步</el-button>
</div> </div>
</div> </div>
</el-form> </el-form>
...@@ -107,12 +97,7 @@ import skuView from '@/components/goods/skuView' ...@@ -107,12 +97,7 @@ import skuView from '@/components/goods/skuView'
// 接口 // 接口
import { addGoods, updateGoods, getGoodsList } from '@/api/goods' import { addGoods, updateGoods, getGoodsList } from '@/api/goods'
export default { export default {
components: { components: { AppCard, AppUpload, sku, skuView },
AppCard,
AppUpload,
sku,
skuView
},
data() { data() {
return { return {
pid: '', // ID pid: '', // ID
...@@ -135,59 +120,13 @@ export default { ...@@ -135,59 +120,13 @@ export default {
buy_button_text: '1', buy_button_text: '1',
goodStockList: [], // 规格明细 goodStockList: [], // 规格明细
spu_context: '', spu_context: '',
skuKeyValueList: [ skuKeyValueList: [],
// {
// spec_id: '1',
// spec_name: '颜色',
// value: [{ spec_value_id: '1', spec_value: '红' }]
// },
// {
// spec_id: '2',
// spec_name: '大小',
// value: [
// { spec_value_id: '1', spec_value: 'L' },
// { spec_value_id: '2', spec_value: 'M' }
// ]
// }
],
stock_sub_method: '2', stock_sub_method: '2',
after_sales_mode: '2', after_sales_mode: '2',
app_button_text: '', app_button_text: '',
sales_time: '', sales_time: '',
buy_limit: '1' buy_limit: '1'
}, },
// ruleForm: {
// category_id: '1', // 商品类型
// spu_name: '', // 商品名
// describe: '', // 分享描述
// charact: '', // 商品亮点
// chart_oss: '', // 商品图
// main_chart_oss: '', // 商品主图
// group_id: '', // 商品分组
// balanceCount: '', // 库存
// goodStockList: [], // 规格明细
// originPrice: '', // 原价
// sellPrice: '', // 现价
// skuKeyValueList: [
// {
// spec_id: '1',
// spec_name: '颜色',
// value: [{ spec_value_id: '1', spec_value: '红' }]
// },
// {
// spec_id: '2',
// spec_name: '大小',
// value: [
// { spec_value_id: '1', spec_value: 'L' },
// { spec_value_id: '2', spec_value: 'M' }
// ]
// }
// ], // 商品规格
// spu_context: '',
// after_sales_mode:'2',
// startTime: null // 售卖开始时间
// },
rules: { rules: {
spu_name: [{ required: true, message: '商品名称不可为空', trigger: 'blur' }] spu_name: [{ required: true, message: '商品名称不可为空', trigger: 'blur' }]
// goodPhotoList: [{ required: true, message: '最少需要添加一张商品图', trigger: 'blur' }], // goodPhotoList: [{ required: true, message: '最少需要添加一张商品图', trigger: 'blur' }],
...@@ -223,25 +162,6 @@ export default { ...@@ -223,25 +162,6 @@ export default {
this.disabledInput = false this.disabledInput = false
} }
} }
// 规格明细
// 'ruleForm.goodStockList': {
// handler(value) {
// if (value.length && this.ruleForm.skuKeyValueList && this.ruleForm.skuKeyValueList.length) {
// this.disabledInput = true
// // 取最小价格
// const min = this.$lodash.minBy(value, item => item.sellPrice)
// this.ruleForm.sellPrice = (min && min.sellPrice) || 0
// // 库存
// this.ruleForm.balanceCount = value.reduce((total, item) => {
// return total + (parseFloat(item.balanceCount) || 0)
// }, 0)
// } else {
// this.disabledInput = false
// }
// },
// immediate: true,
// deep: true
// }
}, },
methods: { methods: {
// 初始化 // 初始化
...@@ -315,9 +235,6 @@ export default { ...@@ -315,9 +235,6 @@ export default {
// } // }
const params = Object.assign({ shop_id: this.shopId }, this.ruleForm) const params = Object.assign({ shop_id: this.shopId }, this.ruleForm)
params.spec = JSON.stringify(params.goodStockList) params.spec = JSON.stringify(params.goodStockList)
console.log(params)
// delete params.goodStockList
// delete params.skuKeyValueList
if (isPass) { if (isPass) {
this.isEdit ? this.onEdit(params) : this.onAdd(params) this.isEdit ? this.onEdit(params) : this.onAdd(params)
} else { } else {
...@@ -373,14 +290,25 @@ export default { ...@@ -373,14 +290,25 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.module-item { ::v-deep .el-form--label-top .el-form-item__label {
max-width: 800px; padding: 0;
} }
.module-item-title { .form-tips {
font-size: 18px; margin-top: 12px;
font-weight: 700; color: #b1b2b3;
margin-bottom: 16px; line-height: 1;
} }
.module-item-content { .form-footer {
position: sticky;
bottom: 0;
z-index: 118;
border-top: 0.5px solid rgba(0, 0, 0, 0.05);
background-color: rgba(255, 255, 255, 0.95);
.inner {
height: 80px;
display: flex;
justify-content: center;
align-items: center;
}
} }
</style> </style>
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论