<template>
<view class="release-page">
<!-- #ifdef APP-PLUS -->
<uni-nav-bar fixed="true" left-icon="back" :status-bar="true" :border="false" title="发布" @clickLeft="back">
</uni-nav-bar>
<!-- #endif -->
<!-- #ifdef MP-WEIXIN -->
<uni-nav-bar fixed="true" :border="false">
</uni-nav-bar>
<view style="height:80rpx;"></view>
<!-- #endif -->
<view class="allBox">
<!-- 输入内容 -->
<view class="textBox">
<textarea class="site fontSize" minlength="0" maxlength="100" @input="descInput" v-model="form.goods_text" placeholder="请输入内容"></textarea>
<text class="xianzhi">{{remnant}}/100</text>
<view class="video" @click="getVideo">
<image src="/static/image/video1.png"></image>
</view>
<view class="photo" @click="getImg">
<image src="/static/image/photo1.png"></image>
</view>
<text class="inputCss fontSize">
<text class="tipsX">*</text>
上传图片或视频（图片最多上传9张，视频最多上传1个）
</text>
</view>
<view class="upload">
<!-- <input class="inputCss fontSize" disabled placeholder="上传图片或时评（图片最多上传9张，视频最多上传1个）" type="text" /> -->
<view class="imageBox flexWrap">
<view v-if="showList.length > 0" v-for="(item,index) in showList" :key="index" class="imgre">
<text @click="del(index)" class="del themeG">×</text>
<image v-if="item.type == 'img'" @click="lookPic(index,showList)" :src="item.img" mode="" class="selectImg"></image>
<image v-if="item.type =='video'" @click="payModeSelect(index)" :src="item.img+'?x-oss-process=video/snapshot,t_1000,f_jpg,w_800,h_600,ar_auto'"
mode="" class="selectImg"></image>
<u-icon v-if="item.type =='video'" @click="payModeSelect(index)" color="#fff" name="play-circle" size="60" class="play"></u-icon>
</view>
<!-- <image @click="getImg" v-if="fileList.length < 9" src="../../../static/image/save.png" mode="" class="selectImg"></image> -->
</view>
</view>
<view class="formBox">
<!-- 商品分类 -->
<view class="classification">
<text class="tipsX">*</text>
<text class="fontSize">商品分类</text>
<view class="selectList">
<picker mode="multiSelector" class="cpicker" @change="changePicker" @columnchange="bindMultiPickerColumnChange" :value="multiIndex"
:range="multiArray">
<input disabled type="text" v-model="form.memberType" class="listIpt" />
</picker>
<u-icon name="arrow-right"></u-icon>
</view>
</view>
<!-- 商品标题 -->
<view class="classification">
<text class="tipsX">*</text>
<text class="fontSize">商品标题</text>
<view class="selectList">
<input type="text" v-model="form.goods_name" class="listIpt" />
<!-- <u-icon name="arrow-right"></u-icon> -->
</view>
</view>
<!-- 商品原价 -->
<!-- <view class="classification" @click="getFocus(0)">
<text>商品原价</text>
<view class="selectList">
<text v-if="form.goods_marketprice">￥</text>
<input type="number" :focus="evaluateState" @blur="blurFocus(0)" maxlength="8" v-model="form.goods_marketprice" :style="{width:priceWidth+'upx'}" @input="priceInput" class="listIpt" />
</view>
</view> -->
<!-- 商品现价 -->
<view class="classification" @click="getFocus(1)">
<text class="tipsX">*</text>
<text class="fontSize">商品现价</text>
<view class="selectList">
<text v-if="form.goods_price">￥</text>
<input type="number" :focus="evaluateState1" @blur="blurFocus(1)" maxlength="8" v-model="form.goods_price" :style="{width:priceWidth2+'upx'}" @input="priceInput2" class="listIpt" />
<!-- <u-icon name="arrow-right"></u-icon> -->
</view>
</view>
<!-- 库存 -->
<view class="classification" @click="getFocus(0)">
<text class="tipsX">*</text>
<text class="fontSize">商品库存</text>
<view class="selectList">
<input type="number" :focus="evaluateState" @blur="blurFocus(0)" maxlength="8" v-model="form.goods_storage" @input="priceInput" class="listIpt" />
</view>
</view>
<!-- 配送方式 -->
<view class="classification">
<text class="tipsX">*</text>
<text class="fontSize">配送方式</text>
<view class="selectList">
<picker mode="selector" class="cpicker" @change="changePickerF" :value="listIndex" :range="listMode">
<text class="fontSizeSM">{{listMode[listIndex]}}</text>
</picker>
<u-icon name="arrow-right"></u-icon>
</view>
</view>
<!-- 商品运费 -->
<view class="classification" @click="getFocus(2)">
<text class="tipsX">*</text>
<text class="fontSize">商品运费</text>
<view class="selectList">
<text v-if="form.goods_freight || listIndex && default_shipping_fee">￥</text>
<input v-if="listIndex == 1" :value="default_shipping_fee" type="number" disabled style="width:100px;" class="listIpt" />
<input v-else type="number" :focus="evaluateState2" @blur="blurFocus(2)" maxlength="8" :style="{width:priceWidth3+'upx'}" @input="priceInput3" v-model="form.goods_freight" class="listIpt" />
</view>
</view>
<!-- 是否可以退款 -->
<!-- <view class="classification">
<text>能否退货</text>
<view class="selectList">
<picker mode="selector" class="cpicker" @change="isRefundChangePicker" :value="isRefund"
:range="isRefundList">
<text>{{isRefundList[isRefund]}}</text>
</picker>
<u-icon name="arrow-right"></u-icon>
</view>
</view> -->
<!-- 发货地址 -->
<view class="classification" @click="selectAddress">
<text class="tipsX">*</text>
<text class="fontSize">发货地址</text>
<view class="selectList">
<input type="text" disabled v-model="addressText" class="listIpt" />
<u-icon name="arrow-right"></u-icon>
</view>
</view>
</view>
<view class="relesePage" @click="uploadShop" :class="{'isClick':isClick}">
发布
</view>
</view>
<!-- 弹框 -->
<uni-popup ref="payMode" type="center" :animation="true">
<view class="picBox">
<video :src="lookPicIndex" controls autoplay></video>
</view>
</uni-popup>
</view>
</template>
<script>
import uniPopup from '@/component/uni-popup/uni-popup.vue';
import uniNavBar from '@/component/uni-nav-bar/uni-nav-bar.vue';
export default {
components: {
uniPopup,
uniNavBar
},
data() {
return {
showList: [],
fileList: [],
listMode:['快递','平台配送'],
listIndex:1,
isRefundList:['否','是'],
isRefund:0,
form: {
goods_name: '',
goods_price: '',
goods_freight_type:1,
goods_freight: '',
memberType: '',
goods_text: '',
goods_storage:''
},
place_of_delivery: '',
idsForm: {
gc_id_1: '',
gc_id_2: '',
gc_id_3: ''
},
addressText: '',
video: '',
image: '',
show: false,
// needFreight: null,
remnant: 0,
oneType: [],
twoType: [],
threeType: [],
oneTypeIndex: 0,
twoTypeIndex: 0,
multiArray: [],
multiIndex: [0, 0, 0],
oldIndex: [],
allClass: [],
isFreight: false,
lookPicIndex:'',
recordIndex: null,
priceWidth:60,
afterWidth:0,
priceWidth2:60,
afterWidth2:0,
priceWidth3:60,
afterWidth3:0,
evaluateState:false,
evaluateState1:false,
evaluateState2:false,
titleFocus:false,
imgList:[],
isClick:false,
default_shipping_fee:''
}
},
onLoad(e) {
let addressId = uni.getStorageSync("address");
if (addressId) {
let that = this;
that.place_of_delivery = addressId;
that.getAddressDetail(addressId);
uni.getStorage({
key:"allData",
success(res) {
let data = JSON.parse(res.data);
if(data.form.goods_price){
that.priceWidth2 = that.priceWidth2+(data.form.goods_price.length*20);
}
if(data.form.goods_freight){
that.priceWidth3 = that.priceWidth3+(data.form.goods_freight.length*20);
}
that.form = data.form;
that.fileList = data.fileList;
that.showList = data.showList;
that.idsForm = data.idsForm;
that.video = data.video;
that.listIndex = data.listIndex;
}
})
}
},
onShow() {
let that = this;
that.getAddressData();
that.getUserInfo();
that.getClass();
uni.getStorage({
key: 'address',
success(res) {
if (res.data) {
that.getAddressDetail(res.data);
that.place_of_delivery = res.data;
}
}
});
},
methods: {
back(){
uni.switchTab({
url:'/pages/index/index'
})
},
getAddressData () {
let that = this;
that.$util.request({
url:'/mobile/index.php?act=member_address&op=address_list',
method:'get',
data:{}
}).then(res =>{
if(res.error_code == 0) {
for(var i = 0; i < res.datas.address_list.length ; i++){
if(res.datas.address_list[i].is_default == 1){
that.addressText = res.datas.address_list[i].area_info + ' ' + res.datas.address_list[i].address;
that.place_of_delivery = res.datas.address_list[i].address_id;
}
}
}
})
},
// 获取用户信息
getUserInfo() {
this.$util.request({
url: '/mobile/index.php?act=member_index&op=index',
method: 'post',
data: {}
}).then(res => {
if (res.error_code == 0) {
if (res.datas.member_is_store == 0) {
uni.showToast({
title: '您还不是卖家，请先申请入驻',
icon: 'none',
duration: 1000,
success() {
// 此处得改
setTimeout(() => {
uni.navigateTo({
url: '/pagesB/pages/sellerPresence/sellerPresence'
})
}, 1000)
}
})
}
}
})
},
// 图片预览
lookPic(current,urls){
let newArr = [];
for(var i = 0; i < urls.length; i++){
if(urls[i].type == 'img'){
newArr.push(urls[i].img);
}
}
urls = newArr;
uni.previewImage({
current:current,
urls:urls,
indicator:'number'
})
},
// 弹窗
payModeSelect(index) {
let that = this;
this.$refs.payMode.open()
this.lookPicIndex = this.showList[index].img;
},
closeWin() {
this.$refs.payMode.close()
},
getAddressDetail(id) {
let that = this;
that.$util.request({
url: '/mobile/index.php?act=member_address&op=address_info',
method: 'get',
data: {
address_id :id
}
}).then(res => {
that.addressText = res.datas.address_info.area_info + ' ' + res.datas.address_info.address;;
})
},
getImg() {
let that = this;
if (that.showList.length >= 9) {
uni.showToast({
title: '上传数量上限',
icon: 'none',
duration: 1000
})
return false;
}
uni.chooseImage({
count: 9,
sourceType: ['album', 'camera'],
success(res) {
// let img = res.tempFilePaths;
// console.log(res.tempFilePaths)
// let img = res.tempFilePaths[0].join(",");
let url = 'index.php?act=goods&op=authUploadImg';
// console.log(img);
let iNum = 9 - that.showList.length;
for(let i = 0; i < res.tempFilePaths.length; i++){
if(i == iNum){
return false
}
setTimeout(()=>{
that.uploadImg(res.tempFilePaths[i], 'img', '图片', url)
},i*200)
}
if(res.tempFilePaths.length > iNum){
uni.showToast({
title:'上传数量上限',
icon:'none'
})
}
// console.log(res.tempFilePaths[0].split(","))
// that.uploadImg(res.tempFilePaths[0], 'img', '图片', url)
}
})
},
// 获取视频
getVideo() {
let that = this;
if (that.showList.length >= 9) {
uni.showToast({
title: '上传数量上限',
icon: 'none',
duration: 1000
})
return
}
if (that.video) {
uni.showToast({
title: '视频只能上传1个',
icon: 'none',
duration: 1000
})
return
}
uni.chooseVideo({
count: 1,
sourceType: ['camera', 'album'],
success: function(res) {
let url = 'index.php?act=goods&op=upload_video';
let str = res.tempFilePath.substring(0,4);
// 拍摄
if(str != "file"){
let result = that.uploadPro(res.tempFilePath, '视频', url);
result.then(imgStr=>{
imgStr = JSON.parse(imgStr.data);
if (imgStr.error_code == 0) {
that.recordIndex = that.showList.length;
that.showList.push({
img: imgStr.datas.full_image_url,
type: 'video'
})
that.video = imgStr.datas.image_url;
uni.showToast({
title: imgStr.message,
icon: "none"
})
} else {
uni.showToast({
title: imgStr.message,
icon: "none"
})
}
uni.hideLoading();
});
}else{
that.uploadImg(res.tempFilePath, 'video', '视频', url)
}
},
fail(e) {
console.log(e)
}
});
},
// 图片视屏删除
del(index) {
if (this.recordIndex == index) {
this.video = '';
this.showList.splice(index, 1);
this.recordIndex = null;
} else {
this.showList.splice(index, 1);
if(this.recordIndex != null && this.recordIndex < index){
this.fileList.splice(index-1, 1);
}else{
this.fileList.splice(index, 1);
}
if (this.recordIndex > index) {
this.recordIndex--;
}
}
},
// 返回上一页
onBackPress(e) {
if (e.from == "backbutton") {
uni.removeStorage({
key: 'allData'
})
uni.navigateBack({
delta: 1
})
}
},
// 发布
uploadShop() {
let that = this;
if(that.isClick){
return false;
}
that.image = '';
for (var i = 0; i < that.fileList.length; i++) {
if (that.fileList[i].type == 'img') {
that.image += that.fileList[i].img;
that.image += ','
}
}
that.image = that.image.substr(0, that.image.length - 1);
// if (this.listIndex == 1) {
// this.form.goods_freight = this.needFreight;
// }
if(that.image == "" && that.video == ""){
uni.showToast({
title:'必须上传一张图片或者视频',
icon:'none'
})
return false
}
if(that.idsForm.gc_id_1 == '' && that.idsForm.gc_id_2 == ''){
uni.showToast({
title:'请选择分类',
icon:'none'
})
return false
}
if(that.form["goods_storage"] < 1){
uni.showToast({
title:'库存不能小于1',
icon:'none'
})
return false
}
for (var i in that.form){
if(that.listIndex == 1){
if(that.form[i] == '' && i != "goods_freight"){
uni.showToast({
title:'请完善信息',
icon:'none'
})
return false
}
}else{
if(that.form[i] == ''){
uni.showToast({
title:'请完善信息',
icon:'none'
})
return false
}
}
}
let data = {
goods_text: that.form.goods_text,
gc_id_1: that.idsForm.gc_id_1,
gc_id_2: that.idsForm.gc_id_2,
goods_name: that.form.goods_name,
goods_price: that.form.goods_price,
goods_freight: that.form.goods_freight,
goods_freight_type:that.form.goods_freight_type,
place_of_delivery: that.place_of_delivery,
goods_video: that.video,
goods_image: that.image,
goods_storage:that.form.goods_storage
}
that.isClick = true;
that.$util.request({
url: '/mobile/index.php?act=goods&op=add_goods',
method: 'post',
data: data
}).then(res => {
if (res.error_code == 0) {
uni.showToast({
title: res.message,
icon: 'success',
duration: 1000,
success() {
setTimeout(()=>{
uni.navigateTo({
url: '/pagesA/pages/user/sell'
})
that.clearData();
},1000)
}
})
uni.removeStorage({
key: 'allData'
})
uni.removeStorage({
key: 'address'
})
} else {
uni.showToast({
title: res.message,
icon: 'none',
duration: 1000
})
}
setTimeout(()=>{
that.isClick = false;
},2000)
})
},
// 跳转到地址
selectAddress() {
let allData = {
form:this.form,
fileList:this.fileList,
showList:this.showList,
idsForm:this.idsForm,
video:this.video,
listIndex:this.listIndex
}
uni.setStorage({
key: 'allData',
data: JSON.stringify(allData)
})
uni.navigateTo({
url: '/pages/address/address?type=releaseA'
})
},
descInput() {
var txtVal = this.form.goods_text.length;
this.remnant = txtVal;
},
popup(index) {
this.form.freeItem = this.list[index].text;
},
// 获取分类
getClass() {
this.multiArray = [];
this.oneType = [];
this.twoType = [];
this.$util.request({
url: '/mobile/index.php?act=goods_class&op=getAllClass',
method: 'get',
data: {}
}).then(res => {
this.allClass = res.datas.goods_class;
this.default_shipping_fee = res.datas.default_shipping_fee;
this.renderPicker(true);
})
},
// 联动处理
renderPicker(isT, arr) {
let num = 1;
let num1 = 1;
if (isT) {
this.oneType = [];
}
for (var i = 0; i < this.allClass.length; i++) {
if (isT) {
this.oneType.push(this.allClass[i].gc_name);
this.twoType = [];
} else {
if (this.oneType[arr[0]] == this.allClass[i].gc_name) {
this.idsForm.gc_id_1 = this.allClass[i].gc_id;
this.oldIndex[0] = this.allClass[i].gc_id;
}
}
if (this.allClass[this.oneTypeIndex].class2.length != 0) {
for (var j = 0; j < this.allClass[this.oneTypeIndex].class2.length; j++) {
if (isT) {
this.twoType.push(this.allClass[this.oneTypeIndex].class2[j].gc_name);
this.threeType = [];
} else {
if (this.twoType[arr[1]] == this.allClass[this.oneTypeIndex].class2[j].gc_name) {
if (num == 1) {
this.idsForm.gc_id_2 = this.allClass[this.oneTypeIndex].class2[j].gc_id;
this.oldIndex[1] = this.allClass[this.oneTypeIndex].class2[j].gc_id;
num++;
}
}
}
// if (this.allClass[this.oneTypeIndex].class2[this.twoTypeIndex].class3.length != 0) {
// for (var l = 0; l < this.allClass[this.oneTypeIndex].class2[this.twoTypeIndex].class3.length; l++) {
// if (isT) {
// this.threeType.push(this.allClass[this.oneTypeIndex].class2[this.twoTypeIndex].class3[l].gc_name);
// } else {
// if (this.threeType[arr[2]] == this.allClass[this.oneTypeIndex].class2[this.twoTypeIndex].class3[l].gc_name) {
// if (num1 == 1) {
// this.idsForm.gc_id_3 = this.allClass[this.oneTypeIndex].class2[this.twoTypeIndex].class3[l].gc_id;
// this.oldIndex[2] = this.allClass[this.oneTypeIndex].class2[this.twoTypeIndex].class3[l].gc_id;
// num1++;
// }
// }
// }
// }
// }
}
}
}
// console.log(this.oneType)
if (isT) {
if (this.oneType.length != 0) {
this.multiArray.push(this.oneType);
}
if (this.twoType.length != 0) {
this.multiArray.push(this.twoType);
}
// if (this.threeType.length != 0) {
// this.multiArray.push(this.threeType);
// }
}
},
bindMultiPickerColumnChange: function(e) {
this.multiArray = [];
if (e.detail.column == 0) {
this.oneTypeIndex = e.detail.value;
this.twoTypeIndex = 0;
} else if (e.detail.column == 1) {
this.twoTypeIndex = e.detail.value;
}
this.multiIndex[e.detail.column] = e.detail.value;
this.renderPicker(true);
this.$forceUpdate();
},
// 确定时改变
changePicker(e) {
// if (e.detail.value.length == 3 && this.threeType[e.detail.value[2]] != undefined) {
// this.form.memberType = this.multiArray[0][this.multiIndex[0]] + ',' + this.multiArray[1][this.multiIndex[1]] + ',' +
// this.multiArray[2][this.multiIndex[2]];
// } else {
this.form.memberType = this.multiArray[0][this.multiIndex[0]] + ',' + this.multiArray[1][this.multiIndex[1]];
// }
this.renderPicker(false, e.detail.value);
},
changePickerF(e) {
this.listIndex = e.detail.value;
if (e.detail.value == 0) {
// this.isFreight = false;
// this.form.goods_freight = 0;
this.form.goods_freight_type = 2;
}else if(e.detail.value == 1){
// this.isFreight = true;
this.form.goods_freight_type = 1;
this.form.goods_freight = '';
}
// else {
// this.isFreight = false;
// this.form.goods_freight = -1;
// }
},
// isRefundChangePicker(e){
// this.isRefund = e.detail.value;
// this.form.goods_refund_type = e.detail.value;
// },
uploadPro(tempFilePaths, text ,url) {
uni.showLoading({
title:text+'上传中'
})
let that = this;
let data = that.$utilImg.request(url);
return new Promise(res => {
uni.uploadFile({
// 需要上传的地址
url: 'http://xbbang.aitecc.com/mobile/' + url,
// filePath 需要上传的文件
filePath: tempFilePaths,
name: 'file',
formData: {
key: data.key,
api_sign: data.api_sign,
comefrom: data.comefrom,
api_time: data.api_time,
api_member_id: data.api_member_id,
api_member_name: data.api_member_name,
},
success(res1) {
res(res1);
}
})
})
},
// 图片视屏上传
async uploadImg(tempFilePaths, type, text, url) {
let that = this;
let imgStr = await that.uploadPro(tempFilePaths,text,url);
imgStr = JSON.parse(imgStr.data);
if (imgStr.error_code == 0) {
if (type == 'img') {
console.log(imgStr)
that.showList.push({
img: imgStr.datas.full_image_url,
type: 'img'
})
that.fileList.push({
img: imgStr.datas.image_url,
type: 'img'
});
} else {
that.recordIndex = that.showList.length;
that.showList.push({
img: imgStr.datas.full_image_url,
type: 'video'
})
that.video = imgStr.datas.image_url;
}
uni.showToast({
title: imgStr.message,
icon: "none"
})
} else {
uni.showToast({
title: imgStr.message,
icon: "none"
})
}
uni.hideLoading()
// uni.showToast({
// title: text + "上传中",
// icon: "none",
// duration:1000,
// success: (result) => {
// }
// })
},
// 长度计算
priceInput(e){
if(this.afterWidth < e.detail.value.length){
this.priceWidth += 20;
}else if(this.afterWidth != e.detail.value.length){
if(this.priceWidth>40){
this.priceWidth -= 20;
}
}
this.afterWidth = e.detail.value.length;
},
// 长度计算
priceInput2(e){
if(this.afterWidth2 < e.detail.value.length){
this.priceWidth2 += 20;
}else if(this.afterWidth2 != e.detail.value.length){
if(this.priceWidth2>40){
this.priceWidth2 -= 20;
}
}
this.afterWidth2 = e.detail.value.length;
},
// 长度计算
priceInput3(e){
if(this.afterWidth3 < e.detail.value.length){
this.priceWidth3 += 20;
}else if(this.afterWidth3 != e.detail.value.length){
if(this.priceWidth3>40){
this.priceWidth3 -= 20;
}
}
this.afterWidth3 = e.detail.value.length;
},
getFocus(type){
if(type == 0){
this.evaluateState = !this.evaluateState;
}else if (type == 1){
this.evaluateState1 = !this.evaluateState1;
}else{
this.evaluateState2 = !this.evaluateState2;
}
},
blurFocus(type){
if(type == 0){
this.evaluateState = !this.evaluateState;
}else if (type == 1){
this.evaluateState1 = !this.evaluateState1;
}else{
this.evaluateState2 = !this.evaluateState2;
}
},
clearData(){
this.showList = [],
this.fileList = [],
this.listMode = ['快递','平台配送'],
this.listIndex = 1,
this.isRefundList =['否','是'],
this.isRefund =0,
this.form = {
goods_name: '',
goods_price: '',
goods_freight: '',
goods_freight_type:1,
memberType: '',
goods_text: '',
goods_storage:'',
},
this.place_of_delivery = '',
this.idsForm = {
gc_id_1: '',
gc_id_2: '',
gc_id_3: ''
},
this.addressText = '',
this.video = '',
this.image = '',
this.show = false,
this.needFreight = null,
this.remnant = 0,
this.oneType = [],
this.twoType = [],
this.threeType = [],
this.oneTypeIndex = 0,
this.twoTypeIndex = 0,
this.multiArray = [],
this.multiIndex = [0, 0, 0],
this.oldIndex = [],
this.allClass = [],
this.isFreight = false,
this.lookPicIndex = '',
this.lookPicType = '',
this.recordIndex = null,
this.priceWidth = 60,
this.afterWidth = 0,
this.priceWidth2 = 60,
this.afterWidth2 = 0,
this.priceWidth3 = 60,
this.afterWidth3 = 0,
this.evaluateState = false,
this.evaluateState1 = false,
this.evaluateState2 = false,
this.titleFocus = false,
this.imgList = []
}
}
}
</script>
<style scoped lang="scss">
.imagePic {
width: 130rpx !important;
height: 130rpx !important;
}
.fontSize {
font-size: 35rpx !important;
font-weight: 400 !important;
}
.fontSizeSM {
font-size: 30rpx !important;
font-weight: 400 !important;
}
.release-page {
.allBox{
padding: 20upx;
box-sizing: border-box;
.textBox {
width: 100%;
position: relative;
// background-color: #F7F7F7;
// height: 520rpx;
.site {
width: 100%;
height: 430upx;
background: rgba(247, 247, 247, 1);
border-radius: 8upx;
// padding-left: 30upx;
padding:20upx;
// padding-top: 30upx;
box-sizing: border-box;
}
.xianzhi {
position: absolute;
right: 36upx;
bottom: 108upx;
}
.site::-webkit-input-placeholder {
color: #ddd;
}
.video,
.photo {
position: absolute;
left: 30upx;
bottom: 120upx;
width: 154upx;
height: 154upx;
display: flex;
justify-content: center;
align-items: center;
background-color: #fff;
cursor: pointer;
image {
width: 40upx;
height: 34upx;
color: rgba(251, 133, 57, 1);
}
.imageStyle {
width: 154upx;
height: 154upx;
}
}
.photo {
left: 225upx;
}
}
.upload {
margin-top: 46upx;
.selectImg {
width: 224rpx;
height: 224rpx;
border-radius: 20rpx;
}
.imageBox {
.imgre {
position: relative;
margin-right: 14rpx;
&:nth-child(3n) {
margin-right: 0;
}
.play{
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%,-50%);
}
.del {
position: absolute;
color: #fff;
right: 10rpx;
top: 10rpx;
width: 40rpx;
height: 40rpx;
border-radius: 50%;
text-align: center;
z-index: 99;
}
}
}
}
.formBox {
margin-top: 20upx;
.classification {
height: 70upx;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid #f5f5f5;
margin-bottom: 20upx;
text {
font-size: 24upx;
font-family: PingFang SC;
font-weight: 500;
color: rgba(92, 92, 92, 1);
}
.selectList {
display: flex;
align-items: center;
flex: 1;
display: flex;
justify-content: flex-end;
.cpicker{
width: 100%;
text-align: right;
}
.listIpt {
// border: 1px solid #333;
box-sizing: border-box;
padding-left: 20upx;
padding-right: 20upx;
width: 100%;
font-size: 30upx;
text-align: right;
font-family: PingFang SC;
font-weight: 500;
color: rgba(92, 92, 92, 1);
}
}
}
}
.relesePage {
height: 78upx;
background: rgba(251, 133, 57, 1);
border-radius: 8upx;
font-size: 30upx;
font-family: PingFang SC;
font-weight: 500;
color: rgba(255, 255, 255, 1);
line-height: 78upx;
text-align: center;
margin-top: 61upx;
}
.isClick{
background-color: #ccc;
}
.showCreator {
background: rgba(255, 255, 255, 1);
border-radius: 30upx;
.ht {
height: 115upx;
border-bottom: 1px solid #f5f5f5;
line-height: 115upx;
text-align: center;
color: #333;
}
}
}
}
.inputCss {
color: #999999;
margin-bottom: 20upx;
display: flex;
font-size: 30upx;
flex-wrap: nowrap;
}
</style>
浙公网安备 33010602011771号