|
|
<template>
|
|
|
<view class="page" v-if="showPage">
|
|
|
<view class="pageMain">
|
|
|
<view class="padding-bottom-25">
|
|
|
<view class="line-40 margin-bottom-15">
|
|
|
<text class="text-30 text-e62 text-bold">*</text>
|
|
|
<text class="text-30 text-bold text-33">添加商品封面图</text>
|
|
|
<text class="text-24 text-aa">（一张建议尺寸300*300）</text>
|
|
|
</view>
|
|
|
<ty-image-images-upload :count="1" :video-count="0" @imageChange="coverImgChange"
|
|
|
:image_list="coverImg">
|
|
|
</ty-image-images-upload>
|
|
|
</view>
|
|
|
<view class="padding-bottom-25">
|
|
|
<view class="line-40 margin-bottom-15">
|
|
|
<text class="text-30 text-bold text-33">添加商品展示图</text>
|
|
|
<text class="text-24 text-aa">（最多5张）</text>
|
|
|
</view>
|
|
|
<ty-image-images-upload :count="5" :video-count="0" @imageChange="showImgChange"
|
|
|
:image_list="showImgList">
|
|
|
</ty-image-images-upload>
|
|
|
</view>
|
|
|
<view class="padding-bottom-25">
|
|
|
<view class="line-40 margin-bottom-15">
|
|
|
<text class="text-30 text-bold text-33">添加商品视频</text>
|
|
|
</view>
|
|
|
<ty-image-images-upload :count="0" :video-count="1" @videoChange="showVideoChange"
|
|
|
:video_list="showVideo" @openVideoPop="openVideoPop" @closeVideoPop="closeVideoPop">
|
|
|
</ty-image-images-upload>
|
|
|
</view>
|
|
|
<view class="margin-bottom-10">
|
|
|
<view class="line-40 margin-bottom-15">
|
|
|
<text class="text-30 text-e62 text-bold">*</text>
|
|
|
<text class="text-30 text-bold text-33">商品标题</text>
|
|
|
</view>
|
|
|
<view class="margin-top-25 padding-bottom-30 border-bottom-ed">
|
|
|
<input placeholder="请输入商品名称" class="line-height-40 text-26" placeholder-class="text-aa"
|
|
|
v-model="goodsName" maxlength="20" />
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="border-bottom-ed flex align-center margin-bottom-40">
|
|
|
<view class="">
|
|
|
<text class="text-30 text-e62 text-bold">*</text>
|
|
|
<text class="text-30 text-bold text-33">选择商品分类</text>
|
|
|
</view>
|
|
|
<picker :range="cates" range-key="name" :value="cateIndex" @change="changeCate"
|
|
|
class="flex-one margin-left-30">
|
|
|
<view class="flex line-height-100 align-center justify-end">
|
|
|
<view class="text-30" :class="cateIndex == null ? 'text-aa' : ''">
|
|
|
{{cateIndex == null ? '请选择' : cates[cateIndex].name}}
|
|
|
</view>
|
|
|
<view class="tyIcon-huaban text-4d text-32 margin-left-10"></view>
|
|
|
</view>
|
|
|
</picker>
|
|
|
</view>
|
|
|
<view class="margin-bottom-40">
|
|
|
<view class="text-30 text-bold margin-bottom-15">
|
|
|
商品详情-文字
|
|
|
</view>
|
|
|
<view class="areaBox">
|
|
|
<textarea v-model="goodsDetail" placeholder="请输入商品详情" class="text-30 line-45 textareaBox"
|
|
|
placeholder-class="text-aa" maxlength="500"></textarea>
|
|
|
<view class="text-right margin-top-20 text-24 text-aa">
|
|
|
{{goodsDetail.length > 500 ? 500 : goodsDetail.length}}/500
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="padding-bottom-25">
|
|
|
<view class="line-40 margin-bottom-15">
|
|
|
<text class="text-30 text-bold text-33">商品详情-图片</text>
|
|
|
<text class="text-24 text-aa">（最多9张）</text>
|
|
|
</view>
|
|
|
<ty-image-images-upload :count="9" :video-count="0" @imageChange="detailImgListChange"
|
|
|
:image_list="detailImgList">
|
|
|
</ty-image-images-upload>
|
|
|
</view>
|
|
|
<view class="margin-bottom-40">
|
|
|
<view class="text-30 text-bold margin-bottom-15">
|
|
|
商品价格-文字
|
|
|
</view>
|
|
|
<view class="areaBox">
|
|
|
<textarea v-model="goodsPrice" placeholder="请输入商品价格" class="text-30 line-45 textareaBox"
|
|
|
placeholder-class="text-aa"></textarea>
|
|
|
<view class="text-right margin-top-20 text-24 text-aa">
|
|
|
{{goodsPrice.length > 500 ? 500 : goodsPrice.length}}/500
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="padding-bottom-25">
|
|
|
<view class="line-40 margin-bottom-15">
|
|
|
<text class="text-30 text-bold text-33">商品价格-图片</text>
|
|
|
<text class="text-24 text-aa">（最多5张）</text>
|
|
|
</view>
|
|
|
<ty-image-images-upload :count="5" :video-count="0" @imageChange="priceImgListChange"
|
|
|
:image_list="priceImgList">
|
|
|
</ty-image-images-upload>
|
|
|
</view>
|
|
|
<view class="margin-bottom-40">
|
|
|
<view class="text-30 text-bold margin-bottom-15">
|
|
|
消防检测报告-文字
|
|
|
</view>
|
|
|
<view class="areaBox">
|
|
|
<textarea v-model="reportMsg" placeholder="请输入商品检测报告文字" class="text-30 line-45 textareaBox"
|
|
|
placeholder-class="text-aa"></textarea>
|
|
|
<view class="text-right margin-top-20 text-24 text-aa">
|
|
|
{{reportMsg.length > 500 ? 500 : reportMsg.length}}/500
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="padding-bottom-45">
|
|
|
<view class="line-40 margin-bottom-15">
|
|
|
<text class="text-30 text-bold text-33">消防检测报告-图片</text>
|
|
|
<text class="text-24 text-aa">（最多5张）</text>
|
|
|
</view>
|
|
|
<ty-image-images-upload :count="5" :video-count="0" @imageChange="reporImgListChange"
|
|
|
:image_list="reporImgList">
|
|
|
</ty-image-images-upload>
|
|
|
</view>
|
|
|
<block v-if="status == 5">
|
|
|
<view class="text-ff85 text-28 text-bold line-40 margin-bottom-15">
|
|
|
审核意见
|
|
|
</view>
|
|
|
<view class="bg-f5 padding-20 text-28 text-33 line-40">
|
|
|
{{refuseReason}}
|
|
|
</view>
|
|
|
</block>
|
|
|
</view>
|
|
|
<cover-view class="flex align-center justify-center bottomBox" v-if="showBottomBtn">
|
|
|
<cover-view class="btn1 margin-right-30 text-30 text-33 text-bold" @click="tapSave(1)">暂存</cover-view>
|
|
|
<cover-view class="btn2 text-30 text-ff text-bold" @click="tapSave(2)">提交</cover-view>
|
|
|
</cover-view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
id: '',
|
|
|
coverImg: [], //封面图
|
|
|
showImgList: [], //展示图
|
|
|
showVideo: [], //商品视频
|
|
|
goodsName: '', //商品名称
|
|
|
cates: [],
|
|
|
cateIndex: null,
|
|
|
goodsDetail: '', //商品详情
|
|
|
detailImgList: [], //商品详情图片
|
|
|
goodsPrice: '', //商品价格
|
|
|
priceImgList: [], //商品价格图片
|
|
|
reportMsg: '', //消防检测报告
|
|
|
reporImgList: [], //报告图片
|
|
|
status: 1, //1-暂存 2-待审核 3-未上架 4-已通过 5-已拒绝
|
|
|
refuseReason: '',
|
|
|
showPage: false,
|
|
|
showBottomBtn:true,
|
|
|
}
|
|
|
},
|
|
|
|
|
|
onLoad(options) {
|
|
|
this.id = options.id ? options.id : '';
|
|
|
uni.setNavigationBarTitle({
|
|
|
title: this.id ? '编辑商品' : '添加商品'
|
|
|
})
|
|
|
this.getPageData()
|
|
|
},
|
|
|
methods: {
|
|
|
getPageData() {
|
|
|
this.rq.getData('fire/api/Supply/getProductData', {
|
|
|
product_id: this.id ? this.id : 0
|
|
|
}, {
|
|
|
loading: 1
|
|
|
}).then(res => {
|
|
|
if (res.code == 0) {
|
|
|
this.cates = res.data.category;
|
|
|
if (this.id) {
|
|
|
if (res.data.product_data.cover_img) {
|
|
|
this.coverImg.push(res.data.product_data.cover_img);
|
|
|
}
|
|
|
this.showImgList = res.data.product_data.img_path == '' ? [] : res.data.product_data.img_path;
|
|
|
if (res.data.product_data.video_url) {
|
|
|
this.showVideo.push({
|
|
|
video_url: res.data.product_data.video_url,
|
|
|
image_url: res.data.product_data.video_cover_img
|
|
|
});
|
|
|
}
|
|
|
this.goodsName = res.data.product_data.name;
|
|
|
this.cates.forEach((item, index) => {
|
|
|
if (item.id == res.data.product_data.category_id) {
|
|
|
this.cateIndex = index;
|
|
|
}
|
|
|
})
|
|
|
this.goodsDetail = res.data.product_data.detail;
|
|
|
this.detailImgList = res.data.product_data.detail_img == '' ? [] : res.data.product_data.detail_img;
|
|
|
this.reportMsg = res.data.product_data.report;
|
|
|
this.reporImgList = res.data.product_data.report_img == '' ? [] : res.data.product_data.report_img;
|
|
|
this.goodsPrice = res.data.product_data.price;
|
|
|
this.priceImgList = res.data.product_data.price_img == '' ? [] : res.data.product_data.price_img;
|
|
|
this.status = res.data.product_data.status;
|
|
|
this.refuseReason = res.data.product_data.examine_idea;
|
|
|
}
|
|
|
this.showPage = true;
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
// 上传封面图
|
|
|
coverImgChange(e) {
|
|
|
this.coverImg = e.image_list;
|
|
|
},
|
|
|
// 展示图
|
|
|
showImgChange(e) {
|
|
|
this.showImgList = e.image_list;
|
|
|
},
|
|
|
// 视频
|
|
|
showVideoChange(e) {
|
|
|
this.showVideo = e.video_list;
|
|
|
},
|
|
|
// 选择分类
|
|
|
changeCate(e) {
|
|
|
this.cateIndex = e.detail.value;
|
|
|
},
|
|
|
// 商品详情图
|
|
|
detailImgListChange(e) {
|
|
|
this.detailImgList = e.image_list;
|
|
|
},
|
|
|
// 商品价格图片
|
|
|
priceImgListChange(e) {
|
|
|
this.priceImgList = e.image_list;
|
|
|
},
|
|
|
// 消防检测图片
|
|
|
reporImgListChange(e) {
|
|
|
this.reporImgList = e.image_list;
|
|
|
},
|
|
|
// 播放视频
|
|
|
openVideoPop(e){
|
|
|
this.showBottomBtn = false
|
|
|
},
|
|
|
closeVideoPop(e){
|
|
|
this.showBottomBtn = true
|
|
|
},
|
|
|
// 保存
|
|
|
tapSave(type) {
|
|
|
//1-暂存 2-提交
|
|
|
if (type == 1) {
|
|
|
if (this.goodsName == '') {
|
|
|
this.cn.alert('请输入商品名称');
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
if (type == 2) {
|
|
|
if (this.coverImg.length == 0) {
|
|
|
this.cn.alert('请添加商品封面图');
|
|
|
return;
|
|
|
}
|
|
|
if (this.goodsName == '') {
|
|
|
this.cn.alert('请输入商品名称');
|
|
|
return;
|
|
|
}
|
|
|
if (this.cateIndex == null) {
|
|
|
this.cn.alert('请选择商品分类');
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
this.rq.getData('fire/api/Supply/supplyAddProduct', {
|
|
|
type: type,
|
|
|
id: this.id ? this.id : 0,
|
|
|
name: this.goodsName,
|
|
|
cover_img: this.coverImg.join(','),
|
|
|
category_id: this.cateIndex == null ? '' : this.cates[this.cateIndex].id,
|
|
|
img_path: this.showImgList.join(','),
|
|
|
video_url: this.showVideo.length ? this.showVideo[0].video_url : '',
|
|
|
detail: this.goodsDetail,
|
|
|
detail_img: this.detailImgList.join(','),
|
|
|
report: this.reportMsg,
|
|
|
report_img: this.reporImgList.join(','),
|
|
|
price: this.goodsPrice,
|
|
|
price_img: this.priceImgList.join(','),
|
|
|
}).then(res => {
|
|
|
if (res.code == 0) {
|
|
|
if (type == 1) {
|
|
|
this.cn.alert('暂存成功')
|
|
|
} else {
|
|
|
this.cn.alert('提交成功，请等待后台审核').then(() => {
|
|
|
uni.navigateBack({
|
|
|
delta: 1
|
|
|
})
|
|
|
})
|
|
|
}
|
|
|
}
|
|
|
})
|
|
|
|
|
|
}
|
|
|
}
|
|
|
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style scoped>
|
|
|
.pageMain {
|
|
|
width: 100vw;
|
|
|
min-height: 100vh;
|
|
|
background: #fff;
|
|
|
padding: 20rpx 30rpx calc(150rpx + env(safe-area-inset-bottom));
|
|
|
box-sizing: border-box;
|
|
|
}
|
|
|
|
|
|
.areaBox {
|
|
|
width: 100%;
|
|
|
border-radius: 10rpx;
|
|
|
border: 1rpx solid #DDDDDD;
|
|
|
padding: 20rpx;
|
|
|
}
|
|
|
|
|
|
.textareaBox {
|
|
|
width: 100%;
|
|
|
height: 210rpx;
|
|
|
}
|
|
|
|
|
|
.bottomBox {
|
|
|
width: 100vw;
|
|
|
background: #fff;
|
|
|
position: fixed;
|
|
|
left: 0;
|
|
|
bottom: 0;
|
|
|
padding: 10rpx 30rpx calc(10rpx + env(safe-area-inset-bottom));
|
|
|
box-sizing: border-box;
|
|
|
z-index: 6;
|
|
|
}
|
|
|
|
|
|
.btn2,
|
|
|
.btn1 {
|
|
|
width: 248rpx;
|
|
|
line-height: 42rpx;
|
|
|
padding: 22rpx 0;
|
|
|
text-align: center;
|
|
|
border-radius: 10px;
|
|
|
}
|
|
|
|
|
|
.btn2 {
|
|
|
background: #2F97FF;
|
|
|
border: 2rpx solid #2F97FF;
|
|
|
}
|
|
|
|
|
|
.btn1 {
|
|
|
background: #fff;
|
|
|
border: 2rpx solid #777777;
|
|
|
}
|
|
|
</style>
|
