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

update

上级 91859b33
......@@ -2,9 +2,8 @@
<div class="upload-wrapper">
<el-upload
class="avatar-uploader"
action="https://webapp-pub.ezijing.com"
action="https://webapp-pub.oss-cn-beijing.aliyuncs.com"
type="drag"
:show-file-list="false"
:before-upload="beforeUpload"
:on-success="handleSuccess"
:data="data"
......
<template>
<section class="app-main">
<div class="app-main-header">
<app-breadcrumb v-if="hasBreadcrumb"></app-breadcrumb>
</div>
<div class="app-main-container">
<router-view></router-view>
<div class="app-main-inner">
<div class="app-main-header">
<app-breadcrumb v-if="hasBreadcrumb"></app-breadcrumb>
</div>
<div class="app-main-container">
<router-view></router-view>
</div>
</div>
</section>
</template>
......@@ -35,9 +37,16 @@ export default {
margin-left: 200px;
padding: 0 24px;
}
.app-main-inner {
max-width: 1272px;
margin: 0 auto;
}
.app-main-container::after {
content: '';
display: table;
clear: both;
}
.el-form--label-top .el-form-item__label {
padding-bottom: 0;
}
</style>
<template>
<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="商品类型">
<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-group>
</app-card>
<app-card title="基本信息">
<el-form-item label="商品名" prop="spu_name">
<el-input placeholder="请输入店铺、品牌、机构的全称" v-model="ruleForm.spu_name"></el-input>
</el-form-item>
<el-form-item label="分享描述" prop="describe">
<el-input v-model="ruleForm.describe"></el-input>
<p class="form-tips">微信分享给好友时会显示,建议36个字以内</p>
</el-form-item>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="商品标题" prop="spu_name">
<el-input placeholder="请输入店铺、品牌、机构的全称" v-model="ruleForm.spu_name"></el-input>
</el-form-item>
</el-col>
<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-input v-model="ruleForm.charact"></el-input>
<p class="form-tips">在商品详情页标题下面展示卖点信息,建议60字以内</p>
</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>
<p class="form-tips">建议尺寸:800*800像素,你可以拖拽图片调整顺序,最多上传15张</p>
</el-form-item>
......@@ -34,6 +41,7 @@
</el-select>
</el-form-item>
</app-card>
<app-card title="价格库存">
<el-form-item label="商品规格" prop="skuKeyValueList">
<sku v-model="ruleForm.skuKeyValueList"></sku>
......@@ -45,40 +53,22 @@
>
<sku-view :sku="ruleForm.skuKeyValueList" v-model="ruleForm.goodStockList"></sku-view>
</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 title="其他信息">
<el-form-item label="开售方式" prop="sales_type">
<el-radio-group v-model="ruleForm.sales_type">
<el-radio label="1">立即开售</el-radio>
<div>
<el-radio label="2">定时开售</el-radio>
<el-input v-model="ruleForm.sales_time" v-if="ruleForm.sales_type === '2'" />
</div>
<el-radio label="2">定时开售</el-radio>
<el-radio label="3">放入仓库</el-radio>
</el-radio-group>
<el-input v-model="ruleForm.sales_time" v-if="ruleForm.sales_type === '2'" />
</el-form-item>
<el-form-item label="立即购买按钮" prop="buy_button_text">
<el-radio-group v-model="ruleForm.buy_button_text">
<el-radio label="1">默认名称</el-radio>
<el-radio label="2">自定义名称</el-radio>
<el-input v-model="ruleForm.buy_button_text" />
</el-radio-group>
<el-input v-model="ruleForm.buy_button_text" />
</el-form-item>
<el-form-item label="售后服务" prop="after_sales_mode">
<el-radio-group v-model="ruleForm.after_sales_mode">
......@@ -87,10 +77,10 @@
</el-radio-group>
</el-form-item>
</app-card>
<div class="form-action">
<div class="form-footer">
<div class="inner">
<el-button size="small" type="primary" @click="onSubmit">保存并查看</el-button>
<el-button size="small" @click="onCancel">下一步</el-button>
<el-button type="primary" @click="onSubmit">保存并查看</el-button>
<el-button @click="onCancel">下一步</el-button>
</div>
</div>
</el-form>
......@@ -107,12 +97,7 @@ import skuView from '@/components/goods/skuView'
// 接口
import { addGoods, updateGoods, getGoodsList } from '@/api/goods'
export default {
components: {
AppCard,
AppUpload,
sku,
skuView
},
components: { AppCard, AppUpload, sku, skuView },
data() {
return {
pid: '', // ID
......@@ -135,59 +120,13 @@ export default {
buy_button_text: '1',
goodStockList: [], // 规格明细
spu_context: '',
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' }
// ]
// }
],
skuKeyValueList: [],
stock_sub_method: '2',
after_sales_mode: '2',
app_button_text: '',
sales_time: '',
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: {
spu_name: [{ required: true, message: '商品名称不可为空', trigger: 'blur' }]
// goodPhotoList: [{ required: true, message: '最少需要添加一张商品图', trigger: 'blur' }],
......@@ -223,25 +162,6 @@ export default {
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: {
// 初始化
......@@ -315,9 +235,6 @@ export default {
// }
const params = Object.assign({ shop_id: this.shopId }, this.ruleForm)
params.spec = JSON.stringify(params.goodStockList)
console.log(params)
// delete params.goodStockList
// delete params.skuKeyValueList
if (isPass) {
this.isEdit ? this.onEdit(params) : this.onAdd(params)
} else {
......@@ -373,14 +290,25 @@ export default {
</script>
<style lang="scss" scoped>
.module-item {
max-width: 800px;
::v-deep .el-form--label-top .el-form-item__label {
padding: 0;
}
.module-item-title {
font-size: 18px;
font-weight: 700;
margin-bottom: 16px;
.form-tips {
margin-top: 12px;
color: #b1b2b3;
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>
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论