You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1068 lines
28 KiB
1068 lines
28 KiB
<template>
|
|
<view class="page1">
|
|
<view class="top" ref="top">
|
|
<view @tap="backPage" style="width: 80rpx;height: 80rpx;margin: 98rpx 0 0 30rpx;">
|
|
<uni-icons type="left" color="#fff" size="27"></uni-icons>
|
|
</view>
|
|
<view class="top1">
|
|
<text style="display: block;margin-top: 107rpx;color: #fff;">Ai入库</text>
|
|
</view>
|
|
</view>
|
|
<view class="content">
|
|
<view class="prompt">
|
|
<view class="prompt-title">
|
|
<view class="hello-right"></view>
|
|
<view class="ai-bot"></view>
|
|
<view class="hello-left">
|
|
<text style="font-size: 40rpx;font-weight: 800;line-height: 56rpx;color: #fff;">Hi</text>
|
|
</view>
|
|
</view>
|
|
<view class="prompt-title-text">
|
|
<text>欢迎使用Ai助手,为了提高图片识别准确率,建议您按照以下要求上传图片:</text>
|
|
<text>1.每张图片建议您裁剪到20个规格或以下</text>
|
|
<text>2.确保最后一款商品规格截取完整</text>
|
|
<text>3.每张图片输入对应的规格数量</text>
|
|
<text>4.图片越清晰角度越正识别准确率越高,建议使用原相机拍照并在相册内截图后上传</text>
|
|
<text>5.如果拍照后找不到所拍照片,打开微信的设置-通用-照片、视频里面的照片,点击开启后重启微信即可</text>
|
|
<text>6.点击可查看<text @tap="goTutorial" style="color: blue;">使用教程</text></text>
|
|
</view>
|
|
<view class="prompt-title-img">
|
|
<view class="img" v-for="(item,index) in imgList" :key="index">
|
|
<image show-menu-by-longpress :src="item" @tap="showImage(item)"></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view @tap="toggle"
|
|
style="height: 98rpx;line-height: 98rpx;font-size: 34rpx;font-weight: bold;padding-left: 30rpx;position: relative;">
|
|
上传图片
|
|
<view class="title-line"></view>
|
|
<view class="icon-upload">
|
|
<uni-icons type="cloud-upload" color="#00BFFF" size="30"></uni-icons>
|
|
<text style="font-size: 24rpx;float: left;font-weight: normal;">(←点击此处添加主图)</text>
|
|
</view>
|
|
</view>
|
|
<view v-for="(item,index) in purchaseOcrPictureList" :key="index"
|
|
style="display: flex;width: 100%;overflow: scroll;">
|
|
<view class="content-list-img">
|
|
<view class="del-icon" @tap="delImage(index)">
|
|
<uni-icons type="trash" color="#00BFFF" size="20"></uni-icons>
|
|
</view>
|
|
<image show-menu-by-longpress :src="item.ocrPicture" @load='loadImg'
|
|
@tap="showImage(item.ocrPicture)"></image>
|
|
<uni-easyinput type='number' prefixIcon="compose" v-model='item.count' placeholder="请输入规格数量"
|
|
@blur="numChange('zhu',item,index)"></uni-easyinput>
|
|
</view>
|
|
<view v-for="(items,indexs) in item.children" :key="indexs"
|
|
style="width: 200rpx;height: 280rpx;position: relative;background: #fff;margin-left: 20rpx;border-radius: 10px;">
|
|
<view class="del-icon" @tap="delSonImage(index,indexs)">
|
|
<uni-icons type="trash" color="#00BFFF" size="20"></uni-icons>
|
|
</view>
|
|
<image show-menu-by-longpress :src="items.ocrPicture" @load='loadImg'
|
|
@tap="showImage(items.ocrPicture)" style="width: 200rpx;height: 200rpx;padding: 5px;"></image>
|
|
<uni-easyinput type='number' v-model='items.count' placeholder="子图规格数量"
|
|
@blur="numChange('zi',item,index,items,indexs)"></uni-easyinput>
|
|
</view>
|
|
<view @tap="addSonImg(item.id)"
|
|
style="width: 200rpx;height: 219rpx;background: rgba(255,255,255,0.4);margin: 0 20rpx;border-radius: 10px;font-size: 24rpx;color: #777;text-align: center;">
|
|
<uni-icons type="plusempty" color="#777" size="80"></uni-icons>
|
|
<view style="height: 30rpx;line-height: 30rpx;">点击添加子图</view>
|
|
</view>
|
|
</view>
|
|
<view style="height:200rpx;"></view>
|
|
</view>
|
|
<view class="bottom-box" @tap="clickAiBtn">
|
|
<view class="run-line"></view>
|
|
<img class="bottom-img"
|
|
src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/27e2655fe19f454d93970f968d91fbef.png" alt="" />
|
|
<view class="bottom-btn">Ai识别</view>
|
|
</view>
|
|
<!-- 弹出层 -->
|
|
<uni-popup ref="popup" background-color="#fff">
|
|
<view style="height:300rpx;">
|
|
<view class="popup-photo" style="font-size: 28rpx;font-weight: 400;">提示:建议使用原相机拍照并在相册内截图后上传</view>
|
|
<!-- <view @tap="upLoadImg('pai')" class="popup-photo">拍照</view> -->
|
|
<view @tap="upLoadImg('xuan')" class="popup-photo">从相册选择</view>
|
|
<view @tap="$refs.popup.close()" class="popup-photo"
|
|
style="border-bottom:0;border-top:10px solid #eee;">取消</view>
|
|
</view>
|
|
</uni-popup>
|
|
<!-- 打印选择框 -->
|
|
<uni-popup ref="productDialog" background-color="#fff">
|
|
<view class="popup-pay-content"
|
|
:style="{background:'url('+purchaseOcrPictureList[0].ocrPicture+') no-repeat;background-size: 100%;'}">
|
|
<view class="popup-pay-shili">
|
|
<view class="popup-pay-title" style="margin-top: 50rpx;">
|
|
<text>识别规则示例</text>
|
|
</view>
|
|
<view class="content-fur">
|
|
<view>为了提高识别的准确率,请您找一款商品的一条规格信息作为AI识别的示例填入,图片中没有的信息不填</view>
|
|
<!-- <view>
|
|
<image :src="purchaseOcrPictureList[0].ocrPicture" style="width: 100%;height: 50rpx;background-size: 100%;background-repeat: no-repeat;"></image>
|
|
</view> -->
|
|
</view>
|
|
<view style="height: 350rpx;">
|
|
<view
|
|
style="padding-left: 40rpx;display: flex;height: 80rpx;width: 50%;line-height: 80rpx;margin-top: 20rpx;float: left;">
|
|
<text style="display:inline-block;width:100rpx;font-size:22rpx;">
|
|
货号:
|
|
</text>
|
|
<input v-model="productSn" disabled="true" @tap="clickInput('productSn')" type="text"
|
|
placeholder="请输入货号"
|
|
style="display: flex;height: 80rpx;width: 200rpx;line-height: 80rpx;padding-left: 20rpx;border: 1px solid #eee;">
|
|
</view>
|
|
<view
|
|
style="padding-left: 20rpx;display: flex;height: 80rpx;width: 50%;line-height: 80rpx;margin-top: 20rpx;float: left;">
|
|
<text style="display:inline-block;width:100rpx;font-size:22rpx;">
|
|
商品名:
|
|
</text>
|
|
<input v-model="productName" disabled="true" @tap="clickInput('productName')" type="text"
|
|
placeholder="请输入商品名"
|
|
style="display: flex;height: 80rpx;width: 200rpx;line-height: 80rpx;padding-left: 20rpx;border: 1px solid #eee;">
|
|
</view>
|
|
<view
|
|
style="padding-left: 40rpx;display: flex;height: 80rpx;width: 50%;line-height: 80rpx;margin-top: 20rpx;float: left;">
|
|
<text style="display:inline-block;width:100rpx;font-size:22rpx;">
|
|
采购价:
|
|
</text>
|
|
<input v-model="price" @focus="obtainPrice($event,'price')"
|
|
@blur="changessPrice($event,'price')" type="digit" placeholder="请输入价格"
|
|
style="display: flex;height: 80rpx;width: 200rpx;line-height: 80rpx;padding-left: 20rpx;border: 1px solid #eee;">
|
|
</view>
|
|
<view
|
|
style="padding-left: 20rpx;display: flex;height: 80rpx;width: 50%;line-height: 80rpx;margin-top: 20rpx;float: left;">
|
|
<text style="display:inline-block;width:100rpx;font-size:22rpx;">
|
|
数量:
|
|
</text>
|
|
<input v-model="productCount" @focus="obtainPrice($event,'productCount')"
|
|
@blur="changessPrice($event)" type="digit" placeholder="请输入数量"
|
|
style="display: flex;height: 80rpx;width: 200rpx;line-height: 80rpx;padding-left: 20rpx;border: 1px solid #eee;">
|
|
</view>
|
|
<view
|
|
style="padding-left: 40rpx;display: flex;height: 80rpx;width: 50%;line-height: 80rpx;margin-top: 20rpx;float: left;">
|
|
<text style="display:inline-block;width:100rpx;font-size:22rpx;">
|
|
颜色:
|
|
</text>
|
|
<input v-model="color" type="text" disabled="true" @tap="clickInput('color')"
|
|
placeholder="请输入颜色"
|
|
style="display: flex;height: 80rpx;width: 200rpx;line-height: 80rpx;padding-left: 20rpx;border: 1px solid #eee;">
|
|
</view>
|
|
<view
|
|
style="padding-left: 20rpx;display: flex;height: 80rpx;width: 50%;line-height: 80rpx;margin-top: 20rpx;float: left;">
|
|
<text style="display:inline-block;width:100rpx;font-size:22rpx;">
|
|
尺码:
|
|
</text>
|
|
<input v-model="size" type="text" disabled="true" @tap="clickInput('size')"
|
|
placeholder="请输入尺码"
|
|
style="display: flex;height: 80rpx;width: 200rpx;line-height: 80rpx;padding-left: 20rpx;border: 1px solid #eee;">
|
|
</view>
|
|
</view>
|
|
|
|
<view class="popup-pay-container" @tap="identify">
|
|
确认
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</uni-popup>
|
|
<!-- -->
|
|
<uni-popup ref="tanDialog" background-color="#fff">
|
|
<view class="popup-pay-content" style="width: 100%;height: 400rpx;">
|
|
<view style="z-index: 99;background: #fff;border-top: 1px solid #eee;">
|
|
|
|
<view class="popup-pay-title" style="margin-top: 50rpx;">
|
|
<text>请输入{{name=='productSn'?'货号':name=='productName'?'商品名称':name=='price'?'价格':name=='productCount'?'数量':name=='color'?'颜色':name=='size'?'尺码':''}}</text>
|
|
</view>
|
|
<view style="height: 100rpx;">
|
|
<view
|
|
style="padding-left: 40rpx;display: flex;height: 80rpx;width: 90%;line-height: 80rpx;margin: 20rpx auto;">
|
|
<text style="display:inline-block;width:100rpx;font-size:22rpx;">
|
|
{{name=='productSn'?'货号':name=='productName'?'商品名称':name=='price'?'价格':name=='productCount'?'数量':name=='color'?'颜色':name=='size'?'尺码':''}}
|
|
</text>
|
|
<input v-model="nameText" ref="inputText" :focus="focus" type="text" placeholder="请输入"
|
|
style="display: flex;height: 80rpx;width: 75%;line-height: 80rpx;padding-left: 20rpx;border: 1px solid #eee;">
|
|
</view>
|
|
</view>
|
|
|
|
<view class="popup-pay-container" @tap="shurukuang"
|
|
style="position: absolute;bottom: 10px;left: 5%;">
|
|
确认
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</uni-popup>
|
|
<view v-if="isTake" style="position: fixed;width: 100%;height: 100%;z-index: 100;top: 0;">
|
|
<camera device-position="back" output-dimension='max' @initdone='showBtn' flash="off"
|
|
style="width: 100%; height: 100%;"></camera>
|
|
<view style="width: 100%;height: 120rpx;position: fixed;bottom:200rpx;" v-if="isShow == true">
|
|
<view @tap="takePhoto"
|
|
style="width: 120rpx;height: 120rpx;border-radius: 120rpx;background: #fff;margin: 0 auto;border: 2px solid #eee;">
|
|
<view
|
|
style="width: 116rpx;height: 116rpx;border-radius: 116rpx;background: #fff;margin: 0 auto;border: 1px solid #fff;">
|
|
</view>
|
|
</view>
|
|
<view @tap="isTake = false" style="position: absolute;top: 20rpx;left: 100rpx;">
|
|
<uni-icons type="close" color="#777" size="40"></uni-icons>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
components: {},
|
|
data() {
|
|
return {
|
|
imgList: [
|
|
'https://jewel-shop.oss-cn-beijing.aliyuncs.com/f51c446ef147437c9a8200ed2b43ec7f.jpg',
|
|
'https://jewel-shop.oss-cn-beijing.aliyuncs.com/5444bab7df8d47e09c831c054b6e447b.jpg',
|
|
'https://jewel-shop.oss-cn-beijing.aliyuncs.com/44e7ccc2fae74db593bd1a10f538e2de.jpg',
|
|
'https://jewel-shop.oss-cn-beijing.aliyuncs.com/2a55142e562b4ea480ce553c8b84d092.jpg'
|
|
],
|
|
isShow: false,
|
|
focus: false,
|
|
purchaseOcrPictureList: [],
|
|
parentPicturePath: '',
|
|
parentId: '',
|
|
newSubmit: [],
|
|
productSn: "",
|
|
productName: "",
|
|
price: "",
|
|
productCount: "",
|
|
color: "",
|
|
size: "",
|
|
keyBoardHeight: 0,
|
|
name: '',
|
|
nameText: '',
|
|
isTake: false
|
|
}
|
|
},
|
|
onShow() {
|
|
uni.authorize({
|
|
scope: 'scope.writePhotosAlbum',
|
|
success() {
|
|
|
|
},
|
|
fail() {
|
|
this.tui.toast("您未授权,AI入库功能可能会出现错误")
|
|
}
|
|
})
|
|
},
|
|
onLoad() {
|
|
|
|
},
|
|
methods: {
|
|
addSonImg(id) {
|
|
this.parentId = id
|
|
this.toggle()
|
|
},
|
|
splitData(str) {
|
|
return str.split('/')[3].split('.')[0]
|
|
},
|
|
clickAiBtn() {
|
|
this.newSubmit = []
|
|
if (this.purchaseOcrPictureList.length == 0) {
|
|
this.tui.toast("请选择要上传的图片")
|
|
return
|
|
}
|
|
for (let i = 0; i < this.purchaseOcrPictureList.length; i++) {
|
|
if (this.purchaseOcrPictureList[i].count == 0 || this.purchaseOcrPictureList[i].count == '') {
|
|
this.tui.toast("请输入数量")
|
|
return
|
|
} else {
|
|
let data = {
|
|
ocrPicture: this.purchaseOcrPictureList[i].ocrPicture,
|
|
count: this.purchaseOcrPictureList[i].count,
|
|
parentPicturePath: '',
|
|
ocrPictureOrder: i == 0 ? "" : i + 1
|
|
}
|
|
this.newSubmit.push(data)
|
|
if (this.purchaseOcrPictureList[i].children.length > 0) {
|
|
for (let m = 0; m < this.purchaseOcrPictureList[i].children.length; m++) {
|
|
if (this.purchaseOcrPictureList[i].children[m].count == 0 || this.purchaseOcrPictureList[i]
|
|
.children[m].count == '') {
|
|
this.tui.toast("请输入子图片的规格数量")
|
|
return
|
|
} else {
|
|
let data = {
|
|
ocrPicture: this.purchaseOcrPictureList[i].children[m].ocrPicture,
|
|
count: this.purchaseOcrPictureList[i].children[m].count,
|
|
parentPicturePath: this.purchaseOcrPictureList[i].ocrPicture,
|
|
ocrPictureOrder: i == 0 ? "" : (i + 1) + '-' + (m + 1)
|
|
}
|
|
this.newSubmit.push(data)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
this.$refs.productDialog.open('bottom')
|
|
},
|
|
clickInput(name) {
|
|
this.name = name
|
|
if (this.name == 'productSn') {
|
|
this.nameText = this.productSn
|
|
} else if (this.name == 'productName') {
|
|
this.nameText = this.productName
|
|
} else if (this.name == 'price') {
|
|
this.nameText = this.price
|
|
} else if (this.name == 'productCount') {
|
|
this.nameText = this.productCount
|
|
} else if (this.name == 'color') {
|
|
this.nameText = this.color
|
|
} else if (this.name == 'size') {
|
|
this.nameText = this.size
|
|
}
|
|
this.$refs.tanDialog.open('bottom');
|
|
|
|
this.focus = false
|
|
this.$nextTick(() => {
|
|
this.focus = true
|
|
})
|
|
// this.focus = true
|
|
// this.$refs.inputText.focus();
|
|
},
|
|
numChange(type, item, index, items, indexs) {
|
|
if (type == 'zhu') {
|
|
|
|
if (item.count > 20) {
|
|
uni.showModal({
|
|
title: '提示',
|
|
showCancel: false,
|
|
content: '规格数不能超过20,例:“黑色M码”这种为一个规格,“黑色S码”或“白色L码”则为另外的规格,请以此种颜色+尺码组合为一种的方式来计数',
|
|
success: function(res) {}
|
|
});
|
|
this.purchaseOcrPictureList[index].count = ''
|
|
}
|
|
} else if (type == 'zi') {
|
|
if (items.count > 20) {
|
|
uni.showModal({
|
|
title: '提示',
|
|
showCancel: false,
|
|
content: '规格数不能超过20,例:“黑色M码”这种为一个规格,“黑色S码”或“白色L码”则为另外的规格,请以此种颜色+尺码组合为一种的方式来计数',
|
|
success: function(res) {}
|
|
});
|
|
this.purchaseOcrPictureList[index].children[indexs].count = ''
|
|
}
|
|
}
|
|
},
|
|
shurukuang() {
|
|
if (this.name == 'productSn') {
|
|
this.productSn = this.nameText
|
|
} else if (this.name == 'productName') {
|
|
this.productName = this.nameText
|
|
} else if (this.name == 'price') {
|
|
this.price = this.nameText
|
|
} else if (this.name == 'productCount') {
|
|
this.productCount = this.nameText
|
|
} else if (this.name == 'color') {
|
|
this.color = this.nameText
|
|
} else if (this.name == 'size') {
|
|
this.size = this.nameText
|
|
}
|
|
this.name = ""
|
|
this.nameText = ""
|
|
this.$refs.tanDialog.close()
|
|
},
|
|
loadImg() {
|
|
uni.hideLoading();
|
|
},
|
|
identify() {
|
|
let num = 0
|
|
if (this.productSn == "") {
|
|
num += 1
|
|
}
|
|
if (this.productName == "") {
|
|
num += 1
|
|
}
|
|
if (this.price == "") {
|
|
num += 1
|
|
}
|
|
if (this.productCount == "") {
|
|
num += 1
|
|
}
|
|
if (this.color == "") {
|
|
num += 1
|
|
}
|
|
if (this.size == "") {
|
|
num += 1
|
|
}
|
|
if (num == 6) {
|
|
this.tui.toast("未输入规格信息")
|
|
return
|
|
} else {
|
|
this.tui.request("/purchaseOcrPicture/batchSave", "POST", {
|
|
orderId: "",
|
|
purchaseOcrPictureList: this.newSubmit,
|
|
purchaseOcrExample: {
|
|
productSn: this.productSn,
|
|
productName: this.productName,
|
|
price: this.price,
|
|
productCount: this.productCount == '' ? '均码' : this.productCount,
|
|
color: this.color == '' ? '均色' : this.color,
|
|
size: this.size
|
|
}
|
|
|
|
}, false, false).then((res) => {
|
|
if (res.code == 200) {
|
|
uni.navigateBack({
|
|
delta: 1
|
|
})
|
|
|
|
} else {
|
|
this.tui.toast(res.message)
|
|
}
|
|
}).catch((res) => {})
|
|
}
|
|
|
|
},
|
|
backPage() {
|
|
uni.navigateBack({
|
|
delta: 1
|
|
})
|
|
},
|
|
//点击图片放大
|
|
showImage(img) {
|
|
uni.previewImage({
|
|
urls: [img],
|
|
current: img
|
|
})
|
|
},
|
|
toggle() {
|
|
let that = this;
|
|
uni.getSystemInfo({
|
|
success: function(res) {
|
|
that.$refs.popup.open('bottom')
|
|
|
|
}
|
|
});
|
|
},
|
|
showBtn() {
|
|
this.isShow = true
|
|
uni.hideLoading();
|
|
},
|
|
async upLoadImg(type) {
|
|
uni.showLoading({
|
|
title: '加载中...',
|
|
mask: true
|
|
})
|
|
let that = this;
|
|
if (type == 'ios') {
|
|
uni.chooseMedia({
|
|
count: 1,
|
|
mediaType: ['image'],
|
|
sourceType: ['camera', 'album'],
|
|
camera: 'back',
|
|
success(res) {
|
|
that.upLoadFile(res.tempFiles[0].tempFilePath)
|
|
},
|
|
fail() {
|
|
uni.hideLoading();
|
|
}
|
|
})
|
|
} else if (type == 'pai') {
|
|
uni.authorize({
|
|
scope: 'scope.writePhotosAlbum',
|
|
success() {
|
|
that.isTake = true
|
|
uni.hideLoading();
|
|
},
|
|
fail() {
|
|
that.tui.toast("您未授权,AI入库功能可能会出现错误")
|
|
}
|
|
})
|
|
} else if (type == 'xuan') {
|
|
uni.chooseMedia({
|
|
count: 1,
|
|
mediaType: ['image'],
|
|
sourceType: ['album'],
|
|
success(res1) {
|
|
that.upLoadFile(res1.tempFiles[0].tempFilePath)
|
|
},
|
|
fail() {
|
|
uni.hideLoading();
|
|
}
|
|
})
|
|
}
|
|
await this.$refs.popup.close()
|
|
// uni.hideLoading();
|
|
},
|
|
async takePhoto() {
|
|
let that = this;
|
|
const ctx = uni.createCameraContext();
|
|
await ctx.takePhoto({
|
|
quality: 'high',
|
|
success: (res) => {
|
|
let ttt = that
|
|
uni.saveImageToPhotosAlbum({
|
|
filePath: res.tempImagePath,
|
|
success: function() {
|
|
ttt.cameraUpload()
|
|
}
|
|
});
|
|
},
|
|
fail(err) {
|
|
that.isTake = false
|
|
}
|
|
});
|
|
|
|
},
|
|
obtainPrice(e, type, num) {
|
|
this.linshiPrice = e.target.value
|
|
if (type == 'price') {
|
|
this.price = ''
|
|
} else if (type == 'productCount') {
|
|
this.productCount = ''
|
|
}
|
|
},
|
|
changessPrice(e, type) {
|
|
if (type == 'price') {
|
|
if (this.linshiPrice == e.target.value) {
|
|
this.price = e.target.value
|
|
} else {
|
|
if (e.target.value == '') {
|
|
this.price = this.linshiPrice
|
|
} else {
|
|
this.price = e.target.value
|
|
}
|
|
|
|
}
|
|
} else {
|
|
if (this.linshiPrice == e.target.value) {
|
|
this.productCount = e.target.value
|
|
} else {
|
|
if (e.target.value == '') {
|
|
this.productCount = this.linshiPrice
|
|
} else {
|
|
this.productCount = e.target.value
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
},
|
|
cameraUpload() {
|
|
let that = this;
|
|
uni.chooseMedia({
|
|
count: 1,
|
|
mediaType: ['image'],
|
|
sourceType: ['album'],
|
|
success(res1) {
|
|
that.isTake = false
|
|
that.upLoadFile(res1.tempFiles[0].tempFilePath)
|
|
},
|
|
fail() {
|
|
that.isTake = false
|
|
uni.hideLoading();
|
|
},
|
|
complete(res) {}
|
|
})
|
|
},
|
|
async upLoadFile(path) {
|
|
let that = this;
|
|
uni.showLoading({
|
|
title: '加载中...',
|
|
mask: true
|
|
})
|
|
let hiver_token = uni.getStorageSync("hiver_token")
|
|
await uni.uploadFile({
|
|
url: that.tui.interfaceUrl() + '/upload/file',
|
|
filePath: path,
|
|
name: 'file',
|
|
header: {
|
|
"content-type": "multipart/form-data",
|
|
'accessToken': hiver_token
|
|
},
|
|
formData: {},
|
|
success: (uploadFileRes) => {
|
|
|
|
let path = JSON.parse(uploadFileRes.data)
|
|
|
|
if (that.parentId != '') {
|
|
for (let i = 0; i < that.purchaseOcrPictureList
|
|
.length; i++) {
|
|
if (that.purchaseOcrPictureList[i].id ==
|
|
that.parentId) {
|
|
let data = {
|
|
ocrPicture: path.result,
|
|
count: '',
|
|
}
|
|
that.purchaseOcrPictureList[i].children
|
|
.push(data)
|
|
}
|
|
}
|
|
} else {
|
|
let data = {
|
|
ocrPicture: path.result,
|
|
count: '',
|
|
id: that.splitData(path.result),
|
|
children: []
|
|
}
|
|
that.purchaseOcrPictureList.push(data)
|
|
}
|
|
|
|
|
|
},
|
|
fail: (err) => {
|
|
uni.hideLoading();
|
|
uni.showToast({
|
|
title: JSON.stringify(err),
|
|
icon: 'none'
|
|
})
|
|
}
|
|
});
|
|
await setTimeout(res => {
|
|
that.parentId = ''
|
|
// uni.hideLoading();
|
|
}, 1000)
|
|
},
|
|
delImage(index) {
|
|
let that = this;
|
|
uni.showModal({
|
|
title: "提示",
|
|
content: "确定删除吗?",
|
|
success: function(res) {
|
|
if (res.confirm) {
|
|
that.purchaseOcrPictureList.splice(index, 1);
|
|
}
|
|
}
|
|
})
|
|
},
|
|
getKeyBoardHeight(e) {
|
|
this.keyBoardHeight = e.detail.height
|
|
},
|
|
delSonImage(index, indexs) {
|
|
let that = this;
|
|
|
|
uni.showModal({
|
|
title: "提示",
|
|
content: "确定删除该子图吗?",
|
|
success: function(res) {
|
|
if (res.confirm) {
|
|
that.purchaseOcrPictureList[index].children.splice(indexs, 1);
|
|
}
|
|
}
|
|
})
|
|
},
|
|
goTutorial() {
|
|
uni.navigateTo({
|
|
url: `/package2/other/tutorialList`
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
page,
|
|
.page1 {
|
|
background: #F1F5FB;
|
|
font-size: 28rpx;
|
|
}
|
|
|
|
.top {
|
|
width: 780rpx;
|
|
height: 390rpx;
|
|
opacity: 1;
|
|
background: linear-gradient(90deg, #6484fa 0%, #66e8ff 100%);
|
|
overflow: hidden;
|
|
}
|
|
|
|
.top1 {
|
|
width: 780rpx;
|
|
height: 390rpx;
|
|
opacity: 1;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
font-size: 38rpx;
|
|
display: block;
|
|
background: linear-gradient(360deg, #FAF7F7 0%, rgba(255, 255, 255, 0) 100%);
|
|
overflow: hidden;
|
|
}
|
|
|
|
.ai-bot {
|
|
position: absolute;
|
|
top: -8rpx;
|
|
left: 10rpx;
|
|
width: 70rpx;
|
|
height: 60rpx;
|
|
background-size: 100% !important;
|
|
background: url(https://jewel-shop.oss-cn-beijing.aliyuncs.com/66dc640d9e8f4749a234d9ef2af1b257.png) no-repeat;
|
|
}
|
|
|
|
|
|
.hello-left {
|
|
width: 102rpx;
|
|
height: 56rpx;
|
|
opacity: 1;
|
|
margin-left: 100rpx;
|
|
background: linear-gradient(127.96deg, #6585fa 0%, #6ad5fe 100%);
|
|
border-radius: 3px;
|
|
text-align: center;
|
|
-webkit-transform: skewX(8deg);
|
|
transform: skewX(-6deg);
|
|
}
|
|
|
|
.hello-right {
|
|
position: absolute;
|
|
left: 5px;
|
|
bottom: 0rpx;
|
|
width: 120rpx;
|
|
height: 2px;
|
|
opacity: 1;
|
|
background: linear-gradient(180deg, #6585fa 0%, #6ad5fe 100%);
|
|
}
|
|
|
|
.image-box {
|
|
width: 120rpx;
|
|
height: 170rpx;
|
|
display: block;
|
|
overflow: hidden;
|
|
float: left;
|
|
}
|
|
|
|
.image {
|
|
width: 100rpx;
|
|
height: 100rpx;
|
|
margin: 35rpx 0 0 20rpx;
|
|
font-size: 36rpx;
|
|
background: #8470FF;
|
|
border-radius: 50%;
|
|
text-align: center;
|
|
line-height: 100rpx;
|
|
color: #fff;
|
|
}
|
|
|
|
.content-text {
|
|
width: 400rpx;
|
|
height: 200rpx;
|
|
float: left;
|
|
line-height: 50rpx;
|
|
padding-left: 30rpx;
|
|
}
|
|
|
|
.text {
|
|
color: #747474;
|
|
font-size: 28rpx;
|
|
}
|
|
|
|
.content-btn {
|
|
position: relative;
|
|
width: 190rpx;
|
|
height: 170rpx;
|
|
float: left;
|
|
}
|
|
|
|
.btn {
|
|
position: absolute;
|
|
width: 120rpx;
|
|
height: 60rpx;
|
|
background: linear-gradient(90deg, #6691fb 0%, #6ad3fe 100%);
|
|
color: #fff;
|
|
border-radius: 6px;
|
|
text-align: center;
|
|
line-height: 60rpx;
|
|
bottom: 20rpx;
|
|
right: 20rpx;
|
|
}
|
|
|
|
@keyframes blinking {
|
|
0% {
|
|
opacity: 1;
|
|
}
|
|
|
|
50% {
|
|
opacity: 0;
|
|
}
|
|
|
|
100% {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
.blink {
|
|
position: absolute;
|
|
top: 40rpx;
|
|
right: 20rpx;
|
|
animation: blinking 1s infinite;
|
|
}
|
|
|
|
.bottom-box {
|
|
position: fixed;
|
|
bottom: 100rpx;
|
|
right: 0;
|
|
left: 0;
|
|
margin: auto;
|
|
background: #fff;
|
|
width: 255rpx;
|
|
height: 85rpx;
|
|
padding: 5rpx;
|
|
z-index: 99;
|
|
background: linear-gradient(90deg, #FFF0F5 0%, #BCD2EE 100%);
|
|
border-radius: 80rpx;
|
|
overflow: hidden;
|
|
|
|
.bottom-img {
|
|
width: 60rpx;
|
|
height: 60rpx;
|
|
background-size: 100%;
|
|
margin: 10rpx;
|
|
float: left;
|
|
position: absolute;
|
|
top: 0;
|
|
bottom: 0;
|
|
}
|
|
}
|
|
|
|
.btn-x {
|
|
width: 2px;
|
|
height: 40rpx;
|
|
background: #fff;
|
|
border-radius: 2rpx;
|
|
position: absolute;
|
|
top: 40rpx;
|
|
left: 59rpx;
|
|
}
|
|
|
|
.btn-y {
|
|
width: 40rpx;
|
|
height: 2px;
|
|
background: #fff;
|
|
border-radius: 2rpx;
|
|
position: absolute;
|
|
top: 59rpx;
|
|
left: 40rpx;
|
|
}
|
|
|
|
.prompt {
|
|
background: #fff;
|
|
width: 95%;
|
|
height: auto;
|
|
border-radius: 10px;
|
|
margin: -150rpx auto 0;
|
|
display: block;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.prompt-title {
|
|
position: relative;
|
|
width: 300rpx;
|
|
margin: 40rpx 40rpx 20rpx 40rpx;
|
|
}
|
|
|
|
.prompt-title-text {
|
|
display: flex;
|
|
flex-direction: column;
|
|
color: #777;
|
|
font-size: 26rpx;
|
|
width: 90%;
|
|
margin: 0 auto;
|
|
line-height: 40rpx;
|
|
}
|
|
|
|
.img {
|
|
width: 23%;
|
|
margin-left: 1.5%;
|
|
height: 178rpx;
|
|
border: 1px solid #eee;
|
|
padding: 5px;
|
|
float: left;
|
|
border-radius: 10px;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.prompt-title-img {
|
|
width: 93%;
|
|
height: 185rpx;
|
|
margin: 20rpx auto;
|
|
}
|
|
|
|
.content-list-img {
|
|
position: relative;
|
|
width: 360rpx;
|
|
margin-left: 1.5%;
|
|
height: 400rpx;
|
|
border: 1px solid #eee;
|
|
background: #fff;
|
|
border-top-left-radius: 10px;
|
|
border-top-right-radius: 10px;
|
|
margin-bottom: 40rpx;
|
|
|
|
image {
|
|
width: 360rpx;
|
|
height: 80%;
|
|
padding: 10px;
|
|
}
|
|
}
|
|
|
|
.uni-easyinput {
|
|
width: 100%;
|
|
height: 20%;
|
|
font-size: 36rpx;
|
|
line-height: 40rpx;
|
|
background: #F8FAFF;
|
|
text-align: center;
|
|
display: block;
|
|
border: none;
|
|
border-bottom-left-radius: 10px;
|
|
border-bottom-right-radius: 10px;
|
|
}
|
|
|
|
.del-icon {
|
|
width: 50rpx;
|
|
height: 50rpx;
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
}
|
|
|
|
.icon-upload {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 190rpx;
|
|
height: 100%;
|
|
|
|
uni-icons {
|
|
float: left;
|
|
}
|
|
}
|
|
|
|
.title-line {
|
|
width: 70px;
|
|
height: 7px;
|
|
position: absolute;
|
|
bottom: 30rpx;
|
|
left: 30rpx;
|
|
background: rgba(0, 191, 255, 0.5);
|
|
}
|
|
|
|
.bottom-btn {
|
|
width: 100%;
|
|
height: 80rpx;
|
|
padding-left: 100rpx;
|
|
color: #777;
|
|
line-height: 80rpx;
|
|
font-weight: bold;
|
|
position: absolute;
|
|
top: 0;
|
|
bottom: 40rpx;
|
|
font-size: 34rpx;
|
|
}
|
|
|
|
.run-line {
|
|
width: 200px;
|
|
height: 200px;
|
|
-webkit-animation: rotate2 2s linear infinite;
|
|
animation: rotate2 3s linear infinite;
|
|
-webkit-transform-origin: 50% 50%;
|
|
z-index: -2;
|
|
margin: -50% 0 0 -50%;
|
|
background: linear-gradient(90deg, #FFF0F5 0%, #BCD2EE 100%);
|
|
}
|
|
|
|
@keyframes rotate2 {
|
|
0% {
|
|
transform: rotate(0deg);
|
|
}
|
|
|
|
100% {
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
|
|
.popup-photo {
|
|
height: 110rpx;
|
|
line-height: 110rpx;
|
|
text-align: center;
|
|
font-size: 36rpx;
|
|
font-weight: 800;
|
|
border-bottom: 1px solid #eee;
|
|
}
|
|
|
|
.popup-pay-content {
|
|
align-items: center;
|
|
justify-content: center;
|
|
// padding: 15px;
|
|
width: 100%;
|
|
height: 1300rpx;
|
|
max-height: 1300rpx;
|
|
// overflow: scroll;
|
|
overflow: hidden;
|
|
background-color: #fff;
|
|
}
|
|
|
|
.popup-pay-title {
|
|
font-size: 30rpx;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
position: relative;
|
|
border-bottom: 1px solid #eee;
|
|
padding-bottom: 20rpx;
|
|
}
|
|
|
|
.popup-pay-container {
|
|
margin: 40rpx auto 0;
|
|
height: 100rpx;
|
|
border-radius: 10px;
|
|
background: #088FEB;
|
|
line-height: 100rpx;
|
|
text-align: center;
|
|
border-bottom: 1px solid #eee;
|
|
border-top: 1px solid #eee;
|
|
color: #fff;
|
|
width: 90%;
|
|
}
|
|
|
|
.checked {
|
|
background: #60F3FF;
|
|
color: #fff !important;
|
|
}
|
|
|
|
.content-fur {
|
|
border-bottom: 1px solid #eee;
|
|
display: flex;
|
|
line-height: 50rpx;
|
|
padding: 20rpx;
|
|
}
|
|
|
|
.content-low {
|
|
width: auto;
|
|
border: 1px solid #eee;
|
|
display: inline-block;
|
|
min-width: 90rpx;
|
|
padding: 5rpx;
|
|
font-size: 35rpx;
|
|
text-align: center;
|
|
color: #777;
|
|
margin: 20rpx 0 0 20rpx;
|
|
}
|
|
|
|
.popup-pay-shili {
|
|
height: 750rpx;
|
|
margin-top: 550rpx;
|
|
z-index: 99;
|
|
background: #fff;
|
|
border-top: 1px solid #eee;
|
|
}
|
|
|
|
@media screen and (min-width: 470px) {
|
|
|
|
/* 适配宽度为375px及以上的屏幕 */
|
|
.popup-pay-content {
|
|
height: 1000rpx;
|
|
}
|
|
.popup-pay-shili{
|
|
height: 750rpx;
|
|
margin-top: 260rpx;
|
|
z-index: 99;
|
|
background: #fff;
|
|
border-top: 1px solid #eee;
|
|
}
|
|
}
|
|
</style>
|