You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
264 lines
6.7 KiB
264 lines
6.7 KiB
<template> |
|
<view class="page"> |
|
<view class="block"> |
|
<view class="form-list edit-form"> |
|
<view class="line"> |
|
<view class="name">商品名称</view> |
|
<input type="text" placeholder="请输入商品名称" v-model="form.prodName" /> |
|
</view> |
|
<view class="line"> |
|
<view class="name">产品分类</view> |
|
<view class="inline"> |
|
<uni-data-picker class="picker-input" :clear-icon="false" placeholder="请选择产品分类" popup-title="请选择产品分类" preload :localdata="provinces" :map="{text: 'provinceName', value: 'provinceName'}" v-model="form.categoryId"></uni-data-picker> |
|
</view> |
|
</view> |
|
<view class="py"> |
|
<uni-file-picker v-model="pic" limit="5" title="请上传封面图片,至少一张" :auto-upload="false" @select="uploadDes"></uni-file-picker> |
|
</view> |
|
|
|
</view> |
|
</view> |
|
|
|
<view class="block"> |
|
<view class="form-list edit-form"> |
|
<view class="line textarea-line no-bd"> |
|
<textarea placeholder="描述一下宝贝的品牌型号、货品来源..." v-model="form.brief"></textarea> |
|
</view> |
|
<view class="py"> |
|
<uni-file-picker v-model="pic" limit="10" title="添加优质图片" :auto-upload="false" @select="uploadDes"></uni-file-picker> |
|
</view> |
|
</view> |
|
</view> |
|
|
|
<view class="title">产品规格</view> |
|
<view v-for="(item, i) in form.skuList" :key="i" class="block"> |
|
<view class="form-list edit-form"> |
|
<view class="line"> |
|
<view class="name">规格名称</view> |
|
<input type="text" placeholder="请输入规格名称" v-model="item.skuName" /> |
|
</view> |
|
<view class="line"> |
|
<view class="name">价格</view> |
|
<view class="price-select" @click="showPrice">请选择</view> |
|
</view> |
|
<view class="line"> |
|
<view class="name">库存</view> |
|
<uni-number-box v-model="item.stocks" :max="100" :min="1"></uni-number-box> |
|
</view> |
|
</view> |
|
</view> |
|
<view class="plus-sku"> |
|
<uni-icons class="icon" type="plus" size="30" color="#007eff" @click="addSku"></uni-icons> |
|
</view> |
|
|
|
|
|
<view class="btns"> |
|
<view class="btn" @click="submit(3)">存草稿</view> |
|
<view class="btn publish" @click="submit(0)">发布</view> |
|
</view> |
|
|
|
|
|
<uni-popup ref="popup" background-color="#fff" type="bottom"> |
|
<view class="block"> |
|
<view class="form-list edit-form"> |
|
<view class="line"> |
|
<view class="name">售价：</view> |
|
<input type="text" placeholder="请输入售价" v-model="form.prodName" /> |
|
</view> |
|
<view class="line"> |
|
<view class="name">优惠价：</view> |
|
<input type="text" placeholder="请输入优惠价" v-model="form.prodName" /> |
|
</view> |
|
</view> |
|
</view> |
|
</uni-popup> |
|
</view> |
|
</template> |
|
|
|
<script> |
|
import { queryProvince, queryCity, queryTeamInfo, updateTeamInfo, enterpriseCertificationStatus } from '@/apis/modules/user.js' |
|
import { save, update, info, categoryList } from '@/apis/modules/goods.js' |
|
import OSS from '@/libs/Oss/upload' |
|
export default { |
|
data() { |
|
return { |
|
openId: uni.getStorageSync('openId'), |
|
info: {}, |
|
form: { |
|
brief: '', |
|
categoryId: '', |
|
content: '', |
|
oriPrice: '', |
|
pic: '', |
|
price: '', |
|
prodName: '', |
|
skuList: [ |
|
{ |
|
actualStocks: '', |
|
oriPrice: '', |
|
price: '', |
|
skuName: '', |
|
stocks: '', |
|
} |
|
], |
|
totalStocks: '' |
|
}, |
|
originSku: {}, |
|
pic: [], |
|
submiting: false, |
|
uploading: false, |
|
classifications: [], |
|
} |
|
}, |
|
computed: { |
|
// 平台名字 |
|
platformName() { |
|
return this.info.platformSource === '6' ? '供应商' : this.info.platformSource === '5' ? '幼儿园' : '' |
|
}, |
|
}, |
|
onLoad() { |
|
this.originSku = JSON.parse(JSON.stringify(this.form.skuList[0])) |
|
this.getCategory() |
|
// this.getProvince() |
|
}, |
|
methods: { |
|
// 企业认证信息 |
|
async getEnterInfo() { |
|
const { data } = await enterpriseCertificationStatus(this.openId) |
|
if (data) { |
|
this.info = data |
|
data.platformSource === '6' && this.getClassification() |
|
} |
|
}, |
|
// 供应商分类 |
|
async getCategory() { |
|
const { data } = await categoryList() |
|
this.classifications = data |
|
}, |
|
// 获取省份 |
|
async getProvince() { |
|
const { list } = await queryProvince() |
|
this.provinces = list |
|
this.getInfo() |
|
}, |
|
// 获取城市 |
|
async getCity() { |
|
const { list } = await queryCity({ |
|
provinceId: this.provinces.find(e => e.provinceName == this.form.province).provinceId |
|
}) |
|
this.cities = list |
|
this.cityId = '' |
|
}, |
|
// 上传logo |
|
uploadLogo() { |
|
const that = this |
|
uni.chooseImage({ |
|
success: (res) => { |
|
const file = res.tempFilePaths[0]; |
|
OSS(file, ({ url }) => { |
|
that.form.logoUrl = url |
|
}) |
|
} |
|
}); |
|
}, |
|
// 上传描述图片 |
|
uploadDes(e){ |
|
OSS(e.tempFilePaths[0], (res) => { |
|
this.pic.push({ |
|
name: res.name, |
|
extname: res.ext, |
|
url: res.url, |
|
}) |
|
}) |
|
}, |
|
// 显示价格弹框 |
|
showPrice() { |
|
this.$refs.popup.open() |
|
}, |
|
// 新增sku |
|
addSku() { |
|
this.form.skuList.push(this.originSku) |
|
}, |
|
// 提交 |
|
async submit(status) { |
|
if (this.submiting) return false |
|
const { form } = this |
|
if (!form.prodName) return this.$util.errMsg(`请输入商品名称！`) |
|
if (!this.pic.length) return this.$util.errMsg(`请上传封面图片！`) |
|
if (!form.brief) return this.$util.errMsg(`请输入商品描述！`) |
|
if (!form.skuList.length) return this.$util.errMsg(`请输入产品规格！`) |
|
this.submiting = true |
|
form.pic = this.pic.map(e => e.url).join() |
|
form.status = status |
|
try { |
|
if (this.id) { |
|
await update(form) |
|
this.$util.sucMsg('保存成功！') |
|
} else { |
|
await save(form) |
|
this.$util.sucMsg('发布成功！') |
|
} |
|
|
|
setTimeout(() => { |
|
uni.navigateBack() |
|
}, 1500) |
|
} catch(e) { |
|
this.submiting = false |
|
} |
|
} |
|
} |
|
} |
|
</script> |
|
|
|
<style scoped lang="scss"> |
|
.page { |
|
padding-bottom: 170rpx; |
|
-webkit-overflow-scrolling: touch; |
|
} |
|
/deep/.picker-input { |
|
.arrow-area { |
|
display: none; |
|
} |
|
.input-value, .selected-list { |
|
padding: 0; |
|
} |
|
} |
|
.price-select { |
|
font-size: 24rpx; |
|
color: #333; |
|
} |
|
.title { |
|
margin: 40rpx 24rpx 24rpx; |
|
font-size: 30rpx; |
|
font-weight: 600; |
|
color: #333; |
|
} |
|
.plus-sku { |
|
text-align: center; |
|
} |
|
.btns { |
|
z-index: 10; |
|
position: fixed; |
|
bottom: env(safe-area-inset-bottom); |
|
bottom: 0; |
|
width: 100%; |
|
padding: 20rpx; |
|
display: flex; |
|
justify-content: center; |
|
box-sizing: border-box; |
|
background-color: #fff; |
|
box-shadow: 0px 0px 7rpx 0px rgba(203, 203, 203, 0.55); |
|
.btn { |
|
padding: 16rpx 60rpx; |
|
margin-left: 20rpx; |
|
font-size: 28rpx; |
|
color: #333; |
|
background-color: #d8d8d8; |
|
border-radius: 20px; |
|
} |
|
.publish { |
|
color: #fff; |
|
background-color: $uni-primary; |
|
} |
|
} |
|
</style>
|
|
|