This commit is contained in:
浅念
2025-12-12 18:34:44 +08:00
parent 2c10e621aa
commit 5112803313
49 changed files with 3677 additions and 2571 deletions
+225 -81
View File
@@ -1,68 +1,87 @@
<template>
<view class="publish-page">
<uni-nav-bar leftText=" " :fixed="true" :border="false" @clickLeft="leftClick" color="#000000" backgroundColor="#fff" :statusBar="true" title="发布页"></uni-nav-bar>
<uni-nav-bar leftText=" " :fixed="true" :border="false" @clickLeft="leftClick" color="#000000" backgroundColor="#fff" :statusBar="true" title="样机发布"></uni-nav-bar>
<view class="form-card">
<view class="section-label">选择发布标签</view>
<picker mode="selector" :range="categoryOptions" range-key="name" @change="onCategoryChange">
<view class="select-input gradient-bg">
<view class="category-content">
<view class="fridge-icon">
<image :src="iconurl" mode=""></image>
</view>
<text class="category-text">{{form.category || '请选择发布标签'}}</text>
</view>
<u-icon name="arrow-down" color="#fff" size="20"></u-icon>
<view class="select-input gradient-bg" @click="showSelect1 = true">
<view class="category-content">
<text class="category-text">{{form.category || '请输入/选择型号'}}</text>
</view>
</picker>
<view class="mag-top">
<textarea v-model="form.content" class="content-textarea" placeholder="请输入文字内容"
:maxlength="maxWords" @input="handleContentInput" />
<u-icon name="arrow-down" color="#3BC8BE" size="20"></u-icon>
</view>
<view class="media-upload-wrapper mag-top">
<uni-file-picker fileMediatype="image" limit="9" @select="selectMedia" @delete="delfn" :imageStyles="imageStyles">
<view class="upload-icon-wrapper">
<image src="/static/image/photo.png" mode="" class="addimg"></image>
<text class="upload-text">添加图片</text>
</view>
</uni-file-picker>
<!-- <view class="upload-area" @click="selectMedia" v-if="form.media.length < maxMedia">
<view class="upload-icon-wrapper">
<view class="camera-icon">
<image src="/static/image/photo.png" mode=""></image>
<view class="conts mag-top">
<view class="">
<textarea v-model="form.content" class="content-textarea" placeholder="请输入文字内容"
:maxlength="maxWords" @input="handleContentInput" />
</view>
<view class="media-upload-wrapper">
<uni-file-picker fileMediatype="image" limit="9" @select="selectMedia" @delete="delfn" :imageStyles="imageStyles">
<view class="upload-icon-wrapper">
<image src="/static/image/photo.png" mode="" class="addimg"></image>
</view>
<text class="upload-text">添加图片</text>
</view>
</view> -->
<!-- <view class="media-preview" v-for="(item, index) in form.media" :key="index">
<image :src="item.url" mode="aspectFill" class="preview-image"></image>
<view class="delete-btn" @click.stop="deleteMedia(index)">
<u-icon name="close" size="18" color="#fff"></u-icon>
</view>
</view> -->
</uni-file-picker>
</view>
<view class="help-text">
<u-icon name="info-circle" size="18" color="#A6ABB7"></u-icon>
<text>文字不多于2000字,图片不多于9张</text>
</view>
</view>
<view class="help-text">
<u-icon name="info-circle" size="18" color="#A6ABB7"></u-icon>
<text>文字不多于2000字,图片不多于9张</text>
<view class="mag-top">
<picker mode="selector" :range="conditionOptions" range-key="name" @change="onCategoryChange">
<view class="select-input gradient-bg">
<view class="category-content">
<text class="category-text">{{form.agename || '请选择样机新旧程度'}}</text>
</view>
<u-icon name="arrow-down" color="#3BC8BE" size="20"></u-icon>
</view>
</picker>
</view>
</view>
<view class="agreement">
<label class="agree-label" @click="toggleAgreement">
<checkbox :checked="agree" style="transform:scale(0.8)"></checkbox>
<text>我已阅读并同意</text>
<text class="link" @click.stop="viewAgreement">《发布协议》</text>
</label>
</view>
<!-- <button class="primary-btn gradient-btn" :class="{disabled: !canSubmit}" :disabled="!canSubmit" @click="submitForm">立即发布</button> -->
<button class="primary-btn gradient-btn" @click="submitForm">立即发布</button>
<u-popup :show="show" :closeOnClickOverlay="false" :round="10" mode="center">
<view class="cont-text" >
<view class="" v-html="viewAgreementcont">
<view class="mag-top">
<input class="uni-input" focus v-model="form.price" placeholder="请输入折扣价格" />
</view>
<view class="detils">
<view v-html="productcontents">
</view>
</view>
</view>
<!-- 型号选择弹层 -->
<view v-if="showSelect1" class="select-popup">
<view class="popup-mask" @click="showSelect1=false"></view>
<view class="popup-panel">
<view class="popup-header">
<input class="popup-search" v-model="searchKey1" placeholder="搜索型号" />
<text class="popup-close" @click="showSelect1=false">取消</text>
</view>
<scroll-view scroll-y class="popup-list">
<view
v-for="item in filteredCategories"
:key="item.id"
class="popup-item"
@click="selectCategory(item)"
>
{{ item.model }}
</view>
<view v-if="!filteredCategories.length" class="popup-empty">暂无数据</view>
</scroll-view>
</view>
</view>
<view class="foot">
<view class="agreement">
<label class="agree-label" @click="toggleAgreement">
<checkbox :checked="agree" style="transform:scale(0.8)"></checkbox>
<text>我已阅读并同意</text>
<text class="link" @click.stop="viewAgreement">《发布协议》</text>
</label>
<button class="primary-btn gradient-btn" @click="submitForm">立即发布</button>
</view>
</view>
<u-popup :show="show" :closeOnClickOverlay="false" :round="10" mode="center">
<view class="cont-text" >
<rich-text :nodes="viewAgreementcont"></rich-text>
</view>
<view class="cent">
<button class="btn1" @click="show = !show">取消</button>
<button class="btn" @click="agreementbtn">确定</button>
@@ -94,17 +113,36 @@
</template>
<script>
import { request,showToast } from '@/api/apiT.js'
import { request,showToast } from '@/api/apiT.js'
export default {
name: 'PublishPage',
data(){
return {
showSelect1:false,
showSelect2:false,
searchKey1:'',
productcontents:'',
categoryOptions:[],
conditionOptions:[
{name:'全新',value:'10'},
{name:'9成新',value:'9'},
{name:'8成新',value:'8'},
{name:'7成新',value:'7'},
{name:'6成新',value:'6'},
{name:'5成新',value:'5'},
{name:'4成新',value:'4'},
{name:'3成新',value:'3'},
{name:'2成新',value:'2'},
{name:'1成新',value:'1'},
],
form:{
agename:'',
age:'',
category:'',
category_id:'',
sku_id:'',
content:'',
media:[]
media:[],
price:''
},
selfChecked: false,
showlogin:false,
@@ -119,16 +157,38 @@ export default {
computed:{
canSubmit(){
return this.agree && this.form.content.trim().length>0 && this.form.media.length>0
}
},
filteredCategories(){
if(!this.searchKey1) return this.categoryOptions
return this.categoryOptions.filter(i => (i.model || '').toLowerCase().includes(this.searchKey1.toLowerCase()))
}
},
onLoad() {
this.getcategory()
},
onShow() {
this.syncTabbar()
// this.getset()
// this.syncTabbar()
},
methods:{
getlocation(){
wx.getFuzzyLocation({
type: 'wgs84',
success(res) {
console.log("模糊定位:", res)
},
fail(err) {
console.log("模糊定位失败:", err)
}
})
},
selectCategory(item){
this.form.category = item.model || ''
this.form.sku_id = item.id || ''
this.productcontents = item.desc || ''
console.log(this.productcontents)
this.showSelect1 = false
},
goprivacy(){
uni.navigateTo({
url: '/pages/login/agreement',// 替换为你要跳转的页面路径
@@ -176,16 +236,14 @@ export default {
}
})
},
//商品下拉
getcategory(){
request({
url:'common/post/category/list',
url:'common/sku/preset',
method:'GET'
}).then(res => {
if (res.data.code == 200) {
this.categoryOptions = res.data.data.records || [];
this.form.category = res.data.data.records[0].name
this.form.category_id = res.data.data.records[0].id
this.iconurl = res.data.data.records[0].icon_preset_pull
this.categoryOptions = res.data.data|| [];
}
})
},
@@ -201,10 +259,9 @@ export default {
onCategoryChange(e){
console.log(e)
const index = e.detail.value; // picker 返回的 index
const selectCity = this.categoryOptions[index]; // 直接取整条数据
this.iconurl = selectCity.icon_preset_pull
this.form.category = selectCity.name
this.form.category_id = selectCity.id
const selectCity = this.conditionOptions[index]; // 直接取整条数据
this.form.agename = selectCity.name
this.form.age = selectCity.name
},
handleContentInput(e){
if(e.detail.value.length>this.maxWords){
@@ -214,7 +271,7 @@ export default {
uploadfn(imgUrl){
return new Promise((resolve, reject) => {
uni.uploadFile({
url: 'https://bsh.info.hb.hnzhwlkj.cn/upload/image?scene=postlist',
url: 'https://cb.hnxinyouhe.com/upload/image?scene=postlist',
filePath: imgUrl,
name: 'image',
header:{'content-type': 'application/x-www-form-urlencoded','Fdesk-Auth-Token': 'Bearer ' + uni.getStorageSync('token'),'Fdesk-Language': uni.getStorageSync('i18locale')?uni.getStorageSync('i18locale'):'zh','Fdesk-Login-Type': 'wechat','Fdesk-System-Code':'wechat'},
@@ -314,6 +371,9 @@ export default {
</script>
<style lang="scss">
.detils{
margin-top: 40rpx;
}
.cent{
display: flex;
align-items: center;
@@ -356,7 +416,7 @@ export default {
.form-card{
background: #fff;
padding: 30rpx;
margin-bottom: 24rpx;
margin-bottom: 400rpx;
box-shadow: 0 12rpx 30rpx rgba(0,0,0,0.04);
}
.section-label{
@@ -374,7 +434,19 @@ export default {
justify-content: space-between;
}
.gradient-bg{
background: linear-gradient(90deg, #206ff4 0%, #42e0a2 100%);
background: #F4F4F4;
color: #999999;
}
.conts{
background: #F4F4F4;
color: #999999;
padding: 20rpx;
border-radius: 10rpx;
}
.uni-input{
background: #F4F4F4;
padding: 20rpx 25rpx;
border-radius: 10rpx;
}
.category-content{
display: flex;
@@ -418,7 +490,7 @@ export default {
}
.category-text{
font-size: 28rpx;
color: #fff;
color: #999999;
font-weight: 500;
}
.mag-top{
@@ -458,8 +530,8 @@ export default {
margin-bottom: 12rpx;
}
.addimg{
width: 26px;
height: 22px;
width: 215rpx;
height: 215rpx;
}
.upload-text{
font-size: 26rpx;
@@ -496,10 +568,14 @@ export default {
align-items: center;
gap: 8rpx;
}
.agreement{
margin: 20rpx 0 40rpx;
padding: 20px 12px;
.foot{
background: #fff;
position: fixed;
bottom: 1rpx;
width: 100%;
}
.agreement{
margin: 20px 12px;
}
.agree-label{
display: flex;
@@ -515,15 +591,83 @@ export default {
}
.primary-btn{
color: #fff;
border-radius: 999px;
border-radius: 20rpx;
height: 88rpx;
line-height: 88rpx;
font-size: 32rpx;
border: none;
margin: 40px 12px;
}
.gradient-btn{
background: linear-gradient(180deg, #206ff4 0%, #42e0a2 100%);
background: #3BC8BE;
margin-top: 20rpx;
}
.select-popup{
position: fixed;
inset: 0;
z-index: 999;
}
.popup-mask{
position: absolute;
inset: 0;
background: rgba(0,0,0,0.35);
}
.popup-panel{
position: absolute;
left: 0;
right: 0;
bottom: 0;
background: #fff;
border-top-left-radius: 20rpx;
border-top-right-radius: 20rpx;
max-height: 40vh; /* 控制整体可视高度 */
display: flex;
flex-direction: column;
padding: 20rpx;
box-sizing: border-box;
}
.popup-header{
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 16rpx;
}
.popup-search{
flex: 1;
height: 72rpx;
border-radius: 10rpx;
background: #f4f4f4;
padding: 0 20rpx;
font-size: 28rpx;
color: #333;
margin-right: 12rpx;
box-sizing: border-box;
}
.popup-title{
font-size: 28rpx;
color: #333;
}
.popup-close{
font-size: 28rpx;
color: #3BC8BE;
}
.popup-list{
flex: 1;
max-height: calc(40vh - 140rpx); /* 预留头部高度,保证可滚动 */
}
.popup-item{
padding: 20rpx 12rpx;
border-bottom: 1px solid #f0f0f0;
font-size: 28rpx;
color: #333;
}
.popup-item:last-child{
border-bottom: none;
}
.popup-empty{
text-align: center;
color: #999;
font-size: 26rpx;
padding: 30rpx 0;
}
.cont-text{
max-width: 350px;