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.
265 lines
6.7 KiB
265 lines
6.7 KiB
11 months ago
|
<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>
|