<template>
<view class="" style="background: #F3F6FA;height: 100vh;overflow: auto;">
<view class="box">
<view class="boxxiao">
<view class="">
<view class="name">
商品名称
</view>
<input v-model="name" class="input" type="text" placeholder="请输入商品名称" />
</view>
<view class="">
<view class="name">
商品编码
</view>
<input v-model="productNo" class="input" type="text" placeholder="请输入商品编码" />
</view>
<view class="">
<view class="name">
商品分类
</view>
<input v-model="categoryName" @click="openPicker(1)" class="input" type="text"
placeholder="请输入商品分类" />
</view>
<view class="">
<view class="name">
品牌
</view>
<input v-model="brandName" @click="openPicker(2)" class="input" type="text" placeholder="请输入商品分类" />
</view>
<view class="">
<view class="name">
排序
</view>
<input v-model="sort" class="input" type="text" placeholder="请输入排序" />
</view>
<view class="">
<view class="name">
单价
</view>
<input class="input" type="text" placeholder="请输入单价" />
</view>
<view class="">
<view class="name">
单位
</view>
<input v-model="price" class="input" type="text" placeholder="请输入单位" />
</view>
<view class="">
<view class="name">
重量
</view>
<input v-model="weight" class="input" type="text" placeholder="请输入重量" />
</view>
<view class="">
<view class="name">
单位
</view>
<input v-model="unit" class="input" type="text" placeholder="请输入单位" />
</view>
</view>
<view class="boxxiao1">
<view class="statc">
<view class="">
状态
</view>
<view class="statcright">
<view class="xiaj shang">
上架
</view>
<view class="xiaj ">
下架
</view>
</view>
</view>
</view>
<view class="">
<view class="updtitle">
产品图片
</view>
<view class="updoimg">
<view class="upindex">
<view class="unindexleft">
主图
</view>
<view class="">
<view class="">
<view class="uplbt">
<view class="imgbox" v-for="(item, index) in fileList" :key="index">
<image class="imgs" :src="item"></image>
</view>
<image @click="chooseImage" v-if="fileList.length<1"
style="width: 156rpx;height: 156rpx;padding: 0 10rpx 10rpx 10rpx;"
src="/static/Merchantindex/Frame_17@2x.png" mode=""></image>
</view>
</view>
</view>
<view class="text13">
请上传 大小不超过 5MB 格式为 pngipgjpeg 的文件
</view>
</view>
<view class="upindex">
<view class="unindexleft" @click="chooseImage">
轮播图
</view>
<view class="">
<view class="uplbt">
<view class="imgbox" v-for="(item, index) in fileList2" :key="index">
<image class="imgs" :src="item"></image>
</view>
<image @click="chooseImage2"
style="width: 156rpx;height: 156rpx;padding: 0 10rpx 10rpx 10rpx;"
src="/static/Merchantindex/Frame_17@2x.png" mode=""></image>
</view>
<view class="text13">
请上传 大小不超过 5MB 格式为 pngipgjpeg 的文件
</view>
</view>
</view>
</view>
<view class="guige">
<view class="">
规格类型
</view>
<view class="">
添加
</view>
</view>
<view class="gglxbxo">
<view class="">
<view class="name">
材质
</view>
<input class="input" type="text" placeholder="请输入材质" />
</view>
<view class="">
<view class="name">
颜色
</view>
<input class="input" type="text" placeholder="请输入颜色" />
</view>
<view class="">
<view class="name">
销售价格
</view>
<input class="input" type="text" placeholder="请输入销售价格" />
</view>
<view class="" style="height: 40rpx;">
</view>
<view class="upindex">
<view class="unindexleft" @click="chooseImage">
展示图片
</view>
<view class="">
<view class="uplbt">
<view class="imgbox" v-for="(item, index) in fileList2" :key="index">
<image class="imgs" :src="item"></image>
</view>
<image @click="chooseImage2"
style="width: 156rpx;height: 156rpx;padding: 0 10rpx 10rpx 10rpx;"
src="/static/Merchantindex/Frame_17@2x.png" mode=""></image>
</view>
<view class="text13">
请上传 大小不超过 5MB 格式为 pngipgjpeg 的文件
</view>
</view>
</view>
</view>
<view class="tetx">
详细描述
</view>
<view class="container">
<button @click="insertImage">插入图片</button>
<editor id="editor" class="rech" placeholder="请输入内容" @input="onInput" @statusbar="statusbar"
@ready="onEditorReady">
</editor>
</view>
</view>
</view>
<view class="tail">
<view class="taill">
上传
</view>
</view>
</view>
<uv-picker ref="picker" :columns="columns" @confirm="confirm"></uv-picker>
<uv-picker ref="picker1" :columns="columns1" @confirm="confirm1"></uv-picker>
</template>
<script>
import {
request,
BASE_URL
} from '@/utils/request.js';
export default {
data() {
return {
name: "",
productNo: "",
sort: "",
price: "",
weight: "",
unit: "",
categoryName: "",
brandName: "",
shopIds: "",
pic: "",
fileList: [],
fileList2: [],
placeholder: '请输入内容',
editorCtx: null,
columns: [
[]
],
columns1: [
[]
],
}
},
mounted() {
this.getInfo()
this.getcategory()
this.getbrand()
},
methods: {
openPicker(ins) {
if (ins == 1) {
this.$refs.picker.open();
}
if (ins == 2) {
this.$refs.picker1.open();
}
},
confirm(e) {
console.log('confirm', e);
this.categoryName = e.value[0]
},
confirm1(e) {
console.log('confirm', e);
this.brandName = e.value[0]
},
async getInfo() {
const res = await request({
url: 'wechat/getInfo',
method: 'get'
});
this.shopIds = res.shopIds[0]
console.log("个人信息", res.shopIds[0])
},
async getcategory() {
console.log(this.shopIds)
const res = await request({
url: 'pms/category/page?pageNum=1&pageSize=999999',
method: 'get'
});
console.log("商品分类", res)
for (var i = 0; i < res.rows.length; i++) {
this.columns[0].push(res.rows[i].name)
}
},
async getbrand() {
console.log(this.shopIds)
const res = await request({
url: 'pms/brand/page?pageNum=1&pageSize=99999',
method: 'get'
});
console.log("品牌分类", res)
for (var i = 0; i < res.rows.length; i++) {
this.columns1[0].push(res.rows[i].name)
}
},
chooseImage() {
uni.chooseImage({
count: 1,
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'],
success: (res) => {
console.log(res)
this.fileList.push(res.tempFilePaths[0])
// this.uploadFile(res.tempFilePaths[0]);
async this.convertToBinary(res.tempFilePaths[0]).then(binaryData => {
console.log('二进制数据:', binaryData);
const res = await request({
url: 'ommon/upload',
method: 'post',
data:{
file:binaryData
}
});
// 你可以在这里处理二进制数据，例如上传到服务器
}).catch(error => {
console.error('转换失败:', error);
});
}
});
},
convertToBinary(filePath) {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.onload = (e) => {
resolve(e.target.result); // 成功时返回二进制数据
};
reader.onerror = (error) => {
reject(error); // 失败时抛出错误
};
reader.readAsArrayBuffer(filePath); // 读取文件为二进制数据
});
},
chooseImage2() {
uni.chooseImage({
count: 1,
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'],
success: (res) => {
this.fileList2.push(res.tempFilePaths[0])
// this.uploadFile(res.tempFilePaths[0]);
}
});
},
onEditorReady() {
uni.createSelectorQuery().in(this).select('#editor').context((res) => {
if (res) {
this.editorCtx = res.context;
}
}).exec();
},
insertImage() {
wx.chooseImage({
count: 1,
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'],
success: (res) => {
const filePath = res.tempFilePaths[0];
this.editorCtx.insertImage({
src: filePath,
alt: '图片',
width: '100%',
height: 'auto',
success: () => {
console.log('图片插入成功');
}
});
}
});
}
}
}
</script>
<style>
@import url("Uploadproduct.css")
</style>
chooseImage怎么修改
最新发布
本文介绍了当程序遇到<null>时导致崩溃的问题及两种解决方案。第一种方法是使用if语句判断是否等于NSNull，第二种方法是判断对象类型是否为NSNull。文章强调了基础技术的重要性。
扫一扫
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
