20261008
This commit is contained in:
@@ -0,0 +1,372 @@
|
||||
<template>
|
||||
<view class="wrap">
|
||||
<!-- 吸顶 -->
|
||||
<u-sticky offset-top="0" customNavHeight="0">
|
||||
<!-- 顶部 -->
|
||||
<uititle title="发布现货"></uititle>
|
||||
</u-sticky>
|
||||
<view class="layout layout-publish m-top-20">
|
||||
<view class="group flex align-center">
|
||||
<view class="lb need m-right-20">现货名称:</view>
|
||||
<view class="vl flex-1">
|
||||
<u--input
|
||||
disabled
|
||||
placeholder="请输入内容"
|
||||
border="surround"
|
||||
v-model="formData.name"
|
||||
></u--input>
|
||||
</view>
|
||||
</view>
|
||||
<view class="tag-title m-top-30">
|
||||
点击添加现货
|
||||
<text class="limit">（至少选择1个现货，最多可选择5个现货）</text>
|
||||
</view>
|
||||
<view class="tag-box flex justify-start flex-wrap">
|
||||
<view :class="['item', formData.categoryIds.includes(item._id) ? 'active' : '']"
|
||||
style="flex: 0 0 30%"
|
||||
v-for="(item,index) in goodsCate" :key="index"
|
||||
@click="handTag(item)">{{ item.name }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="group flex align-center">
|
||||
<view class="lb need m-right-20">库存约:</view>
|
||||
<view class="vl" style="width: 300rpx;">
|
||||
<u--input
|
||||
placeholder="请输入内容"
|
||||
border="surround"
|
||||
v-model="formData.stock"
|
||||
></u--input>
|
||||
</view>
|
||||
<view class="fix m-left-20">吨</view>
|
||||
</view>
|
||||
<view class="group flex align-center m-top-30">
|
||||
<view class="lb need m-right-20">供货地:</view>
|
||||
<view class="vl flex-1" @click="showAddress">
|
||||
<u--input
|
||||
readonly
|
||||
placeholder="请选择"
|
||||
border="surround"
|
||||
v-model="address"
|
||||
suffixIcon="arrow-down"
|
||||
style="pointer-events:none"
|
||||
>
|
||||
</u--input>
|
||||
</view>
|
||||
</view>
|
||||
<view class="group m-top-30">
|
||||
<view class="lb m-right-20">产品规格单价:</view>
|
||||
<view class="m-top-30">
|
||||
<u-upload
|
||||
accept="file"
|
||||
:fileList="formData.files"
|
||||
@afterRead="afterRead"
|
||||
@delete="deletePic"
|
||||
multiple
|
||||
:maxCount="10"
|
||||
></u-upload>
|
||||
</view>
|
||||
</view>
|
||||
<view class="group flex align-center m-top-30">
|
||||
<view class="lb m-right-20">报价有效期:</view>
|
||||
<view class="vl flex-1" @click.native="isPickDate = true">
|
||||
<u--input
|
||||
style="pointer-events:none"
|
||||
readonly
|
||||
placeholder="请输入内容"
|
||||
suffixIcon="calendar"
|
||||
v-model="formData.answerEndTime"
|
||||
></u--input>
|
||||
</view>
|
||||
</view>
|
||||
<view class="group m-top-30">
|
||||
<view class="lb m-right-20">产品现场图片:</view>
|
||||
<view class="m-top-30">
|
||||
<u-upload
|
||||
accept="image"
|
||||
:fileList="formData.images"
|
||||
@afterRead="afterReadImages"
|
||||
@delete="deletePicImages"
|
||||
multiple
|
||||
:maxCount="10"
|
||||
></u-upload>
|
||||
</view>
|
||||
</view>
|
||||
<view class="group flex align-center m-top-30">
|
||||
<view class="lb need m-right-20">是否购买全国广告位:</view>
|
||||
<view class="vl flex-1">
|
||||
<u-switch v-model="formData.buyAll" @change="getAmount(true)"></u-switch>
|
||||
</view>
|
||||
</view>
|
||||
<view class="group flex align-center m-top-30">
|
||||
<view class="lb need m-right-20">是否购买省份广告位:</view>
|
||||
<view class="vl flex-1">
|
||||
<u-switch v-model="formData.buyTop"
|
||||
:disabled="address === '' || totalAmount === 0"
|
||||
@change="getAmount()"></u-switch>
|
||||
</view>
|
||||
</view>
|
||||
<view class="group flex align-center m-top-30">
|
||||
<view class="lb need m-right-20">购买广告位时长(月):</view>
|
||||
<view class="vl flex-1">
|
||||
<u-number-box v-model="formData.buyTopNum"></u-number-box>
|
||||
</view>
|
||||
</view>
|
||||
<p class="text-main text-25 my-20" v-if="formData.buyAll">您已选择购买全国广告位,无法继续购买省份广告位</p>
|
||||
<view class="group flex align-center m-top-30">
|
||||
<view class="lb need m-right-20">广告位价格:</view>
|
||||
<view class="vl flex-1">
|
||||
{{ totalAmount }}元
|
||||
</view>
|
||||
</view>
|
||||
<u-button class="public-btn" text="提交" @click.native="add"></u-button>
|
||||
</view>
|
||||
<AddressSelect ref="AddressSelect" @confirm="regionConfirm"/>
|
||||
<u-datetime-picker :show="isPickDate" v-model="answerEndTime" mode="date"
|
||||
:minDate="minDate" @cancel="isPickDate = false"
|
||||
@confirm="handConfirmDate"></u-datetime-picker>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uititle from '@/components/common/title'
|
||||
import AddressSelect from "@/components/AddressSelect.vue";
|
||||
import dayjs from 'dayjs'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
AddressSelect,
|
||||
uititle,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tagIndex: -1,
|
||||
fileList1: [],
|
||||
formData: {
|
||||
name: '',
|
||||
stock: '',
|
||||
answerEndTime: '',
|
||||
buyTop: false,
|
||||
buyAll: false,
|
||||
buyTopNum: 1,
|
||||
categoryIds: [],
|
||||
files: [],
|
||||
images: [],
|
||||
address: {}
|
||||
},
|
||||
address: '',
|
||||
amount: '',
|
||||
answerEndTime: '',
|
||||
goodsCate: [],
|
||||
isPickDate: false,
|
||||
minDate: Number(new Date()),
|
||||
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
handConfirmDate({value}) {
|
||||
this.formData.answerEndTime = dayjs(value).format('YYYY-MM-DD')
|
||||
this.isPickDate = false
|
||||
},
|
||||
changeBuyAll(val) {
|
||||
if (val && this.formData.buyTop) this.formData.buyTop = false
|
||||
},
|
||||
handTag(val) {
|
||||
const index = this.formData.categoryIds.findIndex(item => item === val._id)
|
||||
if (index === -1 && this.formData.categoryIds.length === 5) return this.$message.error('最多选择五个分类')
|
||||
if (index === -1) this.formData.categoryIds.push(val._id)
|
||||
else this.formData.categoryIds.splice(index, 1)
|
||||
this.formData.name = this.formData.categoryIds.map(item => this.goodsCate.find(val => val._id === item).name).join('、')
|
||||
},
|
||||
afterRead({file}) {
|
||||
file.forEach(item => {
|
||||
uniCloud.uploadFile({
|
||||
filePath: item.url,
|
||||
cloudPath: dayjs().format('YYYY/MM/DD') + '/' + item.name,
|
||||
success: ({fileID}) => {
|
||||
uniCloud.getTempFileURL({
|
||||
fileList: [fileID]
|
||||
}).then(res => {
|
||||
this.formData.files.push({
|
||||
url: res.fileList[0].tempFileURL,
|
||||
name: item.name
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
deletePic({index}) {
|
||||
this.formData.files.splice(index, 1)
|
||||
},
|
||||
afterReadImages({file}) {
|
||||
file.forEach(item => {
|
||||
uniCloud.uploadFile({
|
||||
filePath: item.url,
|
||||
cloudPath: dayjs().format('YYYY/MM/DD') + '/' + item.name,
|
||||
success: ({fileID}) => {
|
||||
uniCloud.getTempFileURL({
|
||||
fileList: [fileID]
|
||||
}).then(res => {
|
||||
this.formData.images.push({
|
||||
url: res.fileList[0].tempFileURL,
|
||||
name: item.name
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
deletePicImages({index}) {
|
||||
this.formData.images.splice(index, 1)
|
||||
},
|
||||
async getGoodsCate() {
|
||||
const {data} = await vk.callFunction({
|
||||
url: 'client/spot/category/pub/getList',
|
||||
data: {
|
||||
whereJson: {
|
||||
level: 2
|
||||
}
|
||||
}
|
||||
});
|
||||
this.goodsCate = data
|
||||
},
|
||||
showAddress() {
|
||||
this.$refs.AddressSelect.open(this.address);
|
||||
},
|
||||
regionConfirm({province, city, area}) {
|
||||
this.formData.address = {province, city, area}
|
||||
this.address = `${province.name} ${city.name} ${area.name}`
|
||||
this.getAmount()
|
||||
},
|
||||
async add() {
|
||||
if (this.formData.categoryIds.length === 0) return this.$message.error('请选择分类')
|
||||
if (!this.formData.stock) return this.$message.error('请填写库存')
|
||||
if (JSON.stringify(this.formData.address) === '{}') return this.$message.error('请选择供货地')
|
||||
this.formData.files = this.formData.files.map(i => i.url)
|
||||
this.formData.images = this.formData.images.map(i => i.url)
|
||||
const res = await vk.callFunction({
|
||||
title: '请求中...',
|
||||
url: 'client/spot/goods/kh/addUpdate',
|
||||
data: this.formData
|
||||
})
|
||||
if (this.formData.buyTop || this.formData.buyAll) {
|
||||
vk.navigateTo({
|
||||
url: `/pages/shop/pay?id=${res.data}`
|
||||
})
|
||||
} else uni.redirectTo({url: '/pages/goods/goods'});
|
||||
},
|
||||
onFormSuccess(res) {
|
||||
if (this.formData.buyTop) {
|
||||
vk.navigateTo({
|
||||
url: `/pages/shop/pay?id=${res.data.data}`
|
||||
})
|
||||
} else uni.redirectTo({url: '/pages/goods/goods'});
|
||||
},
|
||||
getAmount(isAll = false) {
|
||||
this.amount = 0
|
||||
if (!isAll && JSON.stringify(this.form1.data.address) === '{}') return
|
||||
if (isAll) {
|
||||
this.formData.buyTop = !this.formData.buyAll
|
||||
}else {
|
||||
this.formData.buyAll = !this.formData.buyTop
|
||||
}
|
||||
vk.callFunction({
|
||||
url: 'client/spot/amount/pub/getDetail',
|
||||
data: {
|
||||
province: isAll ? -1 : this.form1.data.address.province.code,
|
||||
},
|
||||
success: (res) => {
|
||||
if (res.data) {
|
||||
this.amount = parseFloat(res.data.amount)
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
onLoad() {
|
||||
this.getGoodsCate()
|
||||
},
|
||||
computed: {
|
||||
totalAmount() {
|
||||
let amount = 0
|
||||
if (this.amount) amount = this.amount * this.formData.buyTopNum
|
||||
return amount
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.public-btn {
|
||||
width: 95%;
|
||||
margin-top: 60rpx;
|
||||
color: #ffffff;
|
||||
background: #A92924;
|
||||
}
|
||||
|
||||
.layout-publish {
|
||||
padding: 20rpx 30rpx;
|
||||
}
|
||||
|
||||
.tag-title {
|
||||
font-size: 26rpx;
|
||||
line-height: 40rpx;
|
||||
color: #000000;
|
||||
|
||||
.limit {
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
|
||||
.tag-box {
|
||||
padding: 20rpx 0;
|
||||
|
||||
.item {
|
||||
padding: 6rpx 10rpx;
|
||||
font-size: 24rpx;
|
||||
line-height: 32rpx;
|
||||
color: #555555;
|
||||
}
|
||||
|
||||
.active {
|
||||
color: #A92924;
|
||||
}
|
||||
}
|
||||
|
||||
.lb, .fix {
|
||||
position: relative;
|
||||
font-size: 26rpx;
|
||||
line-height: 40rpx;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.lbx {
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.download {
|
||||
padding: 8rpx 20rpx;
|
||||
font-size: 24rpx;
|
||||
line-height: 36rpx;
|
||||
color: #A92924;
|
||||
border: 1px solid #A92924;
|
||||
}
|
||||
|
||||
.need::before {
|
||||
position: absolute;
|
||||
left: -16rpx;
|
||||
top: 50%;
|
||||
z-index: 9;
|
||||
margin-top: -12rpx;
|
||||
content: '*';
|
||||
color: #A92924;
|
||||
font-size: 32rpx;
|
||||
line-height: 1;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user