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.
 
 
 
 
 
 
yanzong_qianduan/pages/news3/ManualEntry.vue

440 lines
9.8 KiB

<template>
<view>
<view class="section">
<u-field v-model="form.config" label="商品型号" placeholder="请输入商品型号">
</u-field>
<u-field v-model="form.shopNum" label="商品数量" placeholder="请输入商品数量">
</u-field>
</view>
<view class="section">
<u-input class="realAddr" type="textarea" placeholder="请粘贴或输入文本,点击“识别”自动识别姓名、电话和地址" v-model="content">
</u-input>
<view class="btnContent">
<view class="btn" @click="onIntelligence" :style="{'opacity': content?1:0.6 }">
识别
</view>
</view>
</view>
<view class="section">
<u-field v-model="form.getPeopleName" label="收货人" placeholder="请输入收货人姓名">
</u-field>
<u-field v-model="form.getPeoplePhone" label="手机号" placeholder="请输入收货人手机号">
</u-field>
<u-field @click="cityShow=true" v-model="form.city" :disabled="true" label="所属城市" placeholder="请选择"
right-icon="arrow-right">
</u-field>
<u-picker mode="region" v-model="cityShow" @confirm="regionChage">{{form.city}}</u-picker>
<view class="addrDetail">
<view class="addrTitle">
详细地址
</view>
<u-input type="textarea" v-model="form.address" placeholder="请输入详细地址"></u-input>
</view>
</view>
<view class="section">
<u-field @click="modeShow=true" v-model="form.setGoodsMode" :disabled="true" label="发货模式" placeholder="待选择"
right-icon="arrow-right">
</u-field>
<u-action-sheet :list="modeList" v-model="modeShow"></u-action-sheet>
<u-field v-model="form.setGoodsCompany" label="发货公司" placeholder="请输入上游公司名字">
</u-field>
<u-field v-model="form.setGoodsName" label="发货人" placeholder="请输入上游渠道商名字">
</u-field>
<u-field v-model="form.setGoodsPhone" label="发货人电话" placeholder="请输入上游渠道商电话">
</u-field>
<u-field @click="goodsShow=true" v-model="form.wuliuCompany" :disabled="true" label="物流公司"
placeholder="请选择物流公司" right-icon="arrow-right">
</u-field>
<u-action-sheet :list="kuaidiList" v-model="goodsShow"></u-action-sheet>
<u-field v-model="form.orderNum" label="物流单号" placeholder="请输入物流单号">
</u-field>
</view>
<view class="recordList">
<view class="recordItem c">
<view class="recordTitle">
转账记录<text class="intro">最多上传5张</text>
</view>
<u-upload :action="action" :header="header" @on-uploaded="transferSuccess" width="180" height="180"
:file-list="transferList" :custom-btn="true" max-count="1">
<template v-slot:addBtn>
<view class="slot-btn" hover-class="slot-btn__hover" hover-stay-time="150">
<image src="/static/news/icon-upload.png"></image>
<view class="1">上传图片</view>
</view>
</template>
</u-upload>
</view>
<view class="recordItem c">
<view class="recordTitle">
聊天记录<text class="intro">最多上传5张</text>
</view>
<u-upload :action="action" :header="header" @on-uploaded="chatSuccess" width="180" height="180"
:file-list="chatList" :custom-btn="true" max-count="1">
<template v-slot:addBtn>
<view class="slot-btn" hover-class="slot-btn__hover" hover-stay-time="150">
<image src="/static/news/icon-upload.png"></image>
<view class="1">上传图片</view>
</view>
</template>
</u-upload>
</view>
</view>
<view class="footerBtn" @click="onSubmit">
提交
</view>
</view>
</template>
<script>
import * as UploadApi from '@/api/upload'
import * as newFunApi from '@/api/newFun'
import Config from '@/core/config'
export default {
data() {
return {
form: {
config: '',
shopNum: null,
auto: '',
getPeopleName: '',
getPeoplePhone: '',
city: null,
address: '',
setGoodsMode: null,
setGoodsCompany: '',
setGoodsName: '',
setGoodsPhone: '',
wuliuCompany: '',
orderNum: '',
transferImgId:'',
chatImgId:''
},
content: '',
modeList: [{
text: '店内现货',
}],
kuaidiList: [{
text: '顺丰快递',
}],
cityShow: false,
modeShow: false,
goodsShow: false,
transferList: [],
chatList: [],
action: '',
}
},
onReady() {
this.action = (Config.get('apiUrl') + 'upload/image').replace("index.php?s=/", "")
this.header = {
'Storeid': uni.getStorageSync('Store').storeInfo.store_id,
'Access-Token': uni.getStorageSync('AccessToken'),
'platform': "MP-WEIXIN",
}
},
methods: {
// 智能识别
onIntelligence() {
if (!this.content) {
return this.$toast('请输入识别内容')
}
newFunApi.analysis({
content: this.content
})
.then(res => {
if (res.status) {
let data = res.data.detail
this.form.city = data.region.province + data.region.city + data.region.region;
this.form.getPeopleName = data.name
this.form.getPeoplePhone = data.phone
this.form.address = data.detail
console.log(data)
uni.showToast({
title: '识别成功',
icon: 'none',
duration: 2000
})
} else {
uni.showToast({
title: '识别失败',
icon: 'none',
duration: 2000
})
}
})
.finally()
},
// 提交信息
onSubmit() {
const that = this;
that.uploadFile()
that.uploadFileRecord()
if (!that.form.name) {
return that.$toast('请输入商品名称')
}
let params = {
...that.imgage_ids,
...that.imgage2_ids
}
},
showAction() {
this.modeShow = true;
},
showgoodsAction() {
this.goodsShow = true;
},
regionChage(e) {
this.form.city = e.province.name + e.city.name + e.area.name;
},
//接受上传返回的数据
transferSuccess(list) {
if (list.length > 0) {
const {
response
} = list[0];
if (response.status == 200) {
uni.showToast({
title: "上传成功"
})
console.log(response.data.fileInfo.file_id)
this.form.transferImgId = response.data.fileInfo.file_id
}
}
},
//接受上传返回的数据
chatSuccess(list) {
if (list.length > 0) {
const {
response
} = list[0];
if (response.status == 200) {
uni.showToast({
title: "上传成功"
})
console.log(response.data.fileInfo.file_id)
this.form.chatImgId = response.data.fileInfo.file_id
}
}
},
}
}
</script>
<style lang="scss" scoped>
page {
min-height: 100%;
background-color: #F7F8FA;
padding-bottom: 96upx;
}
.section {
background-color: #fff;
padding: 0 26upx;
margin-top: 16upx;
.realAddr {
padding: 40upx 0 !important;
::v-deep .uni-input-wrapper {
text-align: left !important;
}
::v-deep .uni-input-placeholder {
white-space: pre-wrap;
}
}
.btnContent {
display: flex;
justify-content: flex-end;
padding-bottom: 30upx;
}
.btn {
width: 120upx;
height: 50upx;
background: #FE483B;
border-radius: 19px 19px 19px 19px;
opacity: 1;
line-height: 50upx;
text-align: center;
font-size: 24upx;
font-family: PingFang SC, PingFang SC;
font-weight: 500;
color: #FFFFFF;
}
.addrDetail {
padding: 0 10upx;
.addrTitle {
font-size: 28upx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #303030;
margin-top: 32upx;
}
}
}
.selectContent {
border-top: 1px solid transparent;
margin-top: 6upx;
padding-bottom: 100upx;
}
::v-deep .u-field {
padding: 30upx 10upx;
}
::v-deep .uni-input-wrapper {
text-align: right;
}
.recordList {
padding: 30upx;
background-color: #fff;
margin-top: 14upx;
.recordItem {
.recordTitle {
font-size: 28upx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #353535;
margin-bottom: 20upx;
.intro {
font-size: 24upx;
font-family: PingFang SC, PingFang SC;
font-weight: 500;
color: #9F9F9F;
margin-left: 28upx;
}
}
.picList {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
margin: 12upx 0;
text-align: center;
image {
width: 200upx;
height: 160upx;
}
}
}
}
.footerBtn {
width: 80%;
height: 88upx;
background: #FFAAA4;
border-radius: 36px 36px 36px 36px;
opacity: 1;
font-size: 28upx;
font-family: PingFang SC, PingFang SC;
font-weight: 500;
color: #FFFFFF;
line-height: 88upx;
text-align: center;
margin: 96upx auto 0 auto;
}
.c {
padding-top: 20rpx;
overflow: hidden;
.slot-btn {
width: 180rpx;
height: 180rpx;
background: #F6F6F6;
border-radius: 10rpx;
border: 1px solid #C0C0C0;
text-align: center;
font-size: 28rpx;
font-weight: 500;
color: #6D6D6D;
.l {
line-height: 30rpx;
}
image {
width: 50rpx;
height: 50rpx;
display: block;
margin: 0 auto;
margin-top: 30rpx;
}
}
}
.photo {
display: flex;
justify-content: flex-start;
padding: 20rpx 0;
overflow: hidden;
.slot-btn {
width: 80px;
height: 80px;
background: #FFFFFF;
border-radius: 10rpx;
border: 1px solid #C0C0C0;
text-align: center;
font-size: 24rpx;
font-weight: 500;
color: #D1D1D1;
image {
width: 50rpx;
height: 50rpx;
margin-top: 20rpx;
}
}
}
.file_img {
overflow: hidden;
position: relative;
margin-right: 10rpx;
image {
width: 80px;
height: 80px;
}
.image-delete {
position: absolute;
top: -10rpx;
right: -10rpx;
height: 42rpx;
width: 42rpx;
background: rgba(0, 0, 0, 0.64);
border-radius: 50%;
color: #fff;
font-weight: bolder;
font-size: 22rpx;
z-index: 10;
display: flex;
justify-content: center;
align-items: center;
}
}
</style>