Commit eb99fc8b authored by xiangzj's avatar xiangzj

要货图片上传和嵌入第三方H5页面

parent a7516285
......@@ -1135,6 +1135,28 @@
}
// "enablePullDownRefresh": true
}
},
{
"path" : "pages/out-web-site/out-web-site",
"style": {
"app-plus": {
"titleNView": {
"titleAlign": "left",
"titleColor": "#333",
"titleSize": "17px",
"backgroundColor": "#fff",
"titleText": "外部链接",
"autoBackButton": true,
"splitLine": {
"color": "#ccc",
"height": "0.5px"
}
}
},
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
}
],
"globalStyle": {
......@@ -1168,12 +1190,14 @@
"iconPath": "static/image/tab_purchase@3x.png",
"selectedIconPath": "static/image/tab_purchase_red@3x.png",
"text": "要货"
}, {
},
{
"pagePath": "pages/message/message",
"iconPath": "static/image/tab_message@3x.png",
"selectedIconPath": "static/image/tab_message_red@3x.png",
"text": "消息"
}, {
},
{
"pagePath": "pages/usercenter/usercenter",
"iconPath": "static/image/tab_my@3x.png",
"selectedIconPath": "static/image/tab_my_red@3x.png",
......
......@@ -366,7 +366,7 @@
this.condition.startDate = this.handleDate(timeRangeFormat(item))
}
this.condition.endDate = this.handleDate(timeRangeFormat('tomorrow'))
this.pageList[this.tabIndex].refreshData()
this.pageList && this.pageList[this.tabIndex].refreshData()
},
handleDate(date){
const str1 = date.slice(0,4)
......
......@@ -138,10 +138,16 @@
<text class="detal-item-label">备注</text>
<text class="detal-item-value detal-item-value3">{{newsItem.remark}}</text>
</view>
<!-- <view class="block-detal-item attach-block">
<view class="block-detal-item attach-block">
<text class="detal-item-label">附件</text>
<image class="attach-file" src="@/static/image/avatar@3x.png" mode="aspectFit"></image>
<view class="upload-block">
<uni-file-picker readonly :value="allFiles" :imageStyles="imageStyles" file-mediatype="image">
</uni-file-picker>
</view>
<!-- <view class="" v-for="item in allFiles">
<image class="attach-file" :src="item" mode="aspectFit"></image>
</view> -->
</view>
<view class="float-btn-block">
<view class="float-btn" @click="handleShowReceiveDetail">
<text class="float-btn__text">{{ishowReceiveDetail?'收起':'展示完整信息'}}</text>
......@@ -158,7 +164,9 @@
// #ifdef APP-NVUE
const dom = weex.requireModule('dom')
// #endif
import { doQuery, attachmentDownFile } from '@/servers/purchaseList.js'
import store from '@/store/index.js'
import { pathToBase64, base64ToPath } from 'image-tools'
export default {
props: {
newsItem: {
......@@ -174,6 +182,7 @@
ishowReceiveDetail: false,
receiveInfoHeight: '132',
receiveInfoDetailSize: {},
allFiles: [],
}
},
// watch:{
......@@ -186,10 +195,20 @@
// }
// },
computed: {
imageStyles() {
return {
width: 64,
height: 64,
border: {
radius: '50%'
}
}
},
receiveInfoHeightComputed() {
console.log(this.receiveInfoHeight - 0,'[][]')
if(this.receiveInfoHeight - 0 === 0){
return { "minHeight": "385px" }
const height = this.allFiles.length > 0 ? 485 : 385
return { "minHeight": height + "px" }
}else{
return {
"height": `${this.receiveInfoHeight}px`
......@@ -198,6 +217,7 @@
}
},
mounted() {
this.getFiles(this.newsItem.id)
// setTimeout(() => {
// const result = dom.getComponentRect(this.$refs.receiveInfo, option => {
// console.log('getComponentRect:', option)
......@@ -208,6 +228,43 @@
// }, 100);
},
methods: {
async getFiles(id) {
const params = {
bizId: id,
bizCode: 'wantGoods'
}
const res= await doQuery(params)
res.data.forEach((ele,idx) => {
this.downFiles(ele)
});
},
async downFiles(item) {
// 获取arraybuffer格式数据
let res = await uni.request({
method: "POST",
url: `http://221.10.127.60:5000/crm-app/attachmentDownFile?id=`+item.id,
params: {
id: item.id
},
header: {
'X-Auth-Token': store.state.vuex_token,
// 'content-type': 'multipart/form-data'
},
responseType: "arraybuffer" //只有text、arraybuffer两种
})
const buff = res[1].data
// 转成base64格式路径
const base64Src = 'data:image/png;base64,' + uni.arrayBufferToBase64(buff);
// 通过 image-tools 中方法再将base64路径转为普通路径,用于预览
const path = await base64ToPath(base64Src);
const picObj = {
...item,
"name": item.fileName,
"extname": item.fileKind,
"url":path,
}
this.allFiles.push(picObj)
},
click() {
this.$emit('click');
},
......@@ -496,4 +553,11 @@
.cell-list {
flex-direction: column;
}
.upload-block {
display: flex;
height: 388rpx;
border-radius: 4px;
margin-top: 20rpx;
flex-direction: column;
}
</style>
......@@ -12,8 +12,8 @@
</div>
</uni-refresh>
<uni-cell v-for="(item, index) in dataList" :key="item.id">
<order-item v-if="!saveItemFlag" :newsItem="item" @click.native="goDetail(item)"></order-item>
<saveItem v-else :newsItem="item" @click.native="goDetail(item,'saveItem')"></saveItem>
<order-item v-if="!saveItemFlag && item.id" :newsItem="item" @click.native="goDetail(item)"></order-item>
<saveItem v-if="saveItemFlag && item.id" :newsItem="item" @click.native="goDetail(item,'saveItem')"></saveItem>
</uni-cell>
<uni-cell v-if="isLoading || dataList.length > 4">
<view class="loading-more">
......@@ -33,7 +33,7 @@
import noData from '@/components/nodata.nvue';
import orderItem from './order-item.nvue';
import saveItem from './save-item.nvue';
import { findAppGoodsSingle, findSavedApplyBill } from '@/servers/purchaseList.js'
import { findAppGoodsSingle, findSavedApplyBill, doQuery } from '@/servers/purchaseList.js'
export default {
components: {
uniList,
......@@ -112,6 +112,15 @@
// #endif
},
methods: {
async getFiles(id) {
const params = {
bizId: id,
bizCode: 'wantGoods'
}
const res= await doQuery(params)
console.log(res,'------')
// this.gridOptions2.data = data
},
async loadData(refresh) {
if (this.isLoading) {
return;
......
<template>
<view class="">
<view class="status_bar" :style="navHeight"></view>
<web-view ref="web-view" class="uni-flex-item" :src="src" :webview-styles="webview_styles" @message="message"
@error="error" @loading="loading" @loaded="loaded">
</web-view>
</view>
</template>
<script>
export default {
data() {
return {
src: 'https://www.baidu.com',
webview_styles: {
}
}
},
onLoad() {
this.getWebviewPage()
},
computed: {
navHeight() {
return {
'height': `100px`
}
},
},
methods: {
getWebviewPage() {
setTimeout(() => {
uni.setNavigationBarTitle({
title: "需要显示的title",
});
}, 2000);
},
message(event) {
console.log(JSON.stringify(event.detail));
},
error(event) {
console.log(JSON.stringify(event.detail));
},
loading(event) {
console.log(JSON.stringify(event.type));
},
loaded(event ) {
console.log(JSON.stringify(event.type));
},
}
}
</script>
<style>
.uni-input-v {
padding: 10rpx 0;
}
.uni-btn-ml {
margin-left: 10rpx;
}
.uni-flex-item{
height: 100%
}
.status_bar {
height: var(--status-bar-height);
}
</style>
......@@ -117,7 +117,18 @@
</uni-file-picker>
</view> -->
</view>
<view class="middle summary">
<view class="summary-block">
<image class="icon_plan" src="@/static/image/icon_plan@3x.png" mode=""></image>
<text class="upload-text">附件上传(最多上传3张图片)</text>
</view>
<view class="upload-block">
<uni-file-picker ref='files' limit="3" :auto-upload='false' :value="allFilesPath" v-model="allFilesPath" file-mediatype="image"
:imageStyles="imageStyles" @select="select" @progress="progress" @success="success" @fail='fail' @delete='deletes'>
<text>+</text>
</uni-file-picker>
</view>
</view>
<!-- <text class="receive-record">历史收货信息</text>
<view class="middle view receive-record-view">
<view class="text-block text-block-last receive-record-info">
......@@ -162,16 +173,20 @@
import {
mapState
} from 'vuex'
import store from '@/store/index.js'
import {
querySysDictionaryDetailsByCode,
getReceipt,
findByCustomer,
startProcessInstanceByKey,
advance,
saveBizData
saveBizData,
webUploadFile,
doDeleteFile,
doQuery,
attachmentDownFile
} from '@/servers/purchaseList.js'
import { pathToBase64, base64ToPath } from 'image-tools'
export default {
data() {
return {
......@@ -186,10 +201,16 @@
fileList: [],
scrollTop: 0,
objectId: '',
flag: false
flag: false,
allFiles: [],
allFilesPath: [],
}
},
props: {
sourceType: {
type: String,
default: ''
},
orderItem: {
type: Object,
default () {
......@@ -211,6 +232,15 @@
}
},
computed: {
imageStyles() {
return {
width: 64,
height: 64,
border: {
radius: '50%'
}
}
},
navHeight() {
return {
'height': `${this.sysinfo.safeArea.top + 44}px`
......@@ -267,7 +297,9 @@
_this.orderItem.spurtCodeUnit = data.selectShuntCode.info.partner
_this.orderItem.spurtCodeUnitName = data.selectShuntCode.info.name_org1
})
if(this.sourceType === 'myPurchase'){
this.getFiles(this.orderItem.id)
}
},
onUnload() {
uni.$off('selectShuntAccountInfo')
......@@ -288,6 +320,44 @@
// this.queryData()
},
methods: {
async getFiles(id) {
const params = {
bizId: id,
bizCode: 'wantGoods'
}
const res= await doQuery(params)
res.data.forEach((ele,idx) => {
this.downFiles(ele)
});
},
async downFiles(item) {
console.log(item,'item')
// 获取arraybuffer格式数据
let res = await uni.request({
method: "POST",
url: `http://221.10.127.60:5000/crm-app/attachmentDownFile?id=`+item.id,
params: {
id: item.id
},
header: {
'X-Auth-Token': store.state.vuex_token,
// 'content-type': 'multipart/form-data'
},
responseType: "arraybuffer" //只有text、arraybuffer两种
})
const buff = res[1].data
// 转成base64格式路径
const base64Src = 'data:image/png;base64,' + uni.arrayBufferToBase64(buff);
// 通过 image-tools 中方法再将base64路径转为普通路径,用于预览
const path = await base64ToPath(base64Src);
const picObj = {
...item,
"name": item.fileName,
"extname": item.fileKind,
"url":path,
}
this.allFilesPath.push(picObj)
},
fnCheckOrderByNo() {
this.$refs.popup.close()
uni.redirectTo({
......@@ -410,27 +480,49 @@
progress(e) {
console.log('上传进度:', e)
},
// 选择文件
select(e) {
console.log('选择文件:', e ,this.fileList)
// let _this = this
// const unit16Array = await formatToUnit16Array(e.tempFiles[0].file)
// let reader = new FileReader();
// let fileObj = {
// FILENAME: e.tempFiles[0].name,
// MIMETYPE: '',
// DOC_TYPE: e.tempFiles[0].fileType,
// XCONTENT: unit16Array,
// FILELENGTH: e.tempFiles[0].size,
// ZZFLD00002D: this.userInfo.code,
// ZZFLD00002D_DSCR: this.userInfo.name,
// }
// reader.readAsDataURL(e.tempFiles[0].file);
// reader.onload = function(e) {
// // fileObj.XCONTENT = e.target.result;
// _this.imgFileBase64.push(fileObj);
// console.log('2222', e)
// }
async select(data) {
data.tempFilePaths.forEach((item,idx) => {
console.log('idx',data.tempFilePaths[idx],data.tempFiles[idx].file.name)
uni.uploadFile({
url: `http://221.10.127.60:5000/crm-app/webUpload/ajaxUpload`,
filePath: data.tempFilePaths[idx],
name: 'file',
formData: {
bizId: this.orderItem.fileBizId,
bizCode: 'wantGoods',
formSecretLevel: 0,
name: data.tempFiles[idx].file.name,
type: data.tempFiles[idx].file.fileType,
lastModifiedDate: data.tempFiles[idx].file.lastModifiedDate,
size: data.tempFiles[idx].file.size,
// file: data.tempFiles[idx].file
},
header: {
// 'Access-Control-Allow-Origin': 'http://221.10.127.60',
'Access-Control-Allow-Origin': '*',
'method': "POST",
'X-Auth-Token': store.state.vuex_token,
// 'content-type': 'multipart/form-data'
},
success: (uploadFileRes) => {
this.allFiles.push(JSON.parse(uploadFileRes.data).data)
console.log(this.allFiles, '成功');
uni.showToast({
title: '上传成功!',
duration: 2000,
icon: 'none'
})
},
fail: (uploadFileRes) => {
uni.showToast({
title: '上传失败!',
duration: 2000,
icon: 'none'
})
},
})
})
},
// 上传成功
success(e) {
......@@ -440,10 +532,33 @@
fail(e) {
console.log('上传失败:', e)
},
async deletes(e){
const params = {
id: e.tempFile.id,
isCheck: false
}
const res = await doDeleteFile(params)
if(res.status - 0 === 1){
const arr = this.allFiles.filter(item => item.fileName === e.tempFile.name || item.fileName === e.tempFile.fileName )
this.allFiles = [...arr]
console.log(this.allFiles)
}
},
preStep() {
// uni.switchTab({
// url: '/pages/purchase-main/purchase-main'
// })
// 返回上一级 把刚刚上传的附件删除
if(this.allFiles.length > 0){
this.allFiles.forEach(ele => {
const params = {
id: ele.id,
isCheck: false
}
const res = doDeleteFile(params)
this.allFiles = []
});
}
this.$emit('click', 'purchaseMain')
},
async preSave(){
......@@ -735,27 +850,6 @@
font-weight: 600;
}
.upload-block {
display: flex;
align-items: center;
width: 188rpx;
height: 188rpx;
background: #f5f6f7;
border: 1px dashed #dedede;
border-radius: 4px;
margin-bottom: 40rpx;
}
.uni-file-picker {
width: 100%;
height: 100%;
}
/deep/ .uni-file-picker__container {
width: 100%;
height: 100%;
}
.receive-record-view {
padding: 40rpx 48rpx;
}
......@@ -919,4 +1013,48 @@
padding-top: 30rpx;
justify-content: start;
}
.summary-block {
display: flex;
align-items: center;
}
.summary {
display: flex;
flex-direction: column;
align-items: flex-start;
margin-bottom: 32rpx;
padding: 32rpx 48rpx 140rpx;
}
.icon_plan {
width: 36rpx;
height: 36rpx;
margin-right: 8rpx;
}
.upload-block {
display: flex;
// width: 100%;
// align-items: center;
// justify-content: center;
// align-self: center;
// width: 388rpx;
height: 388rpx;
// background: #f5f6f7;
// border: 1px dashed #dedede;
border-radius: 4px;
margin-top: 90rpx;
flex-direction: column;
}
.upload-text {
flex: 2;
font-size: 32rpx;
color: #333;
font-weight: 500;
}
.summary {
display: flex;
flex-direction: column;
align-items: flex-start;
margin-bottom: 32rpx;
padding: 32rpx 48rpx 140rpx;
}
</style>
......@@ -2,7 +2,7 @@
<view class="apply-history view" :style="winHeight">
<view class="status_bar" :style="navHeight"></view>
<view class="apply-history-wrapper view">
<component :style="componentHeight" :orderItem='detail' :channelTypeArr='channelTypeArr' :is="currentTabComponent" @click="changeComponent" @submit="submit"></component>
<component :style="componentHeight" :sourceType='sourceType' :orderItem='detail' :channelTypeArr='channelTypeArr' :is="currentTabComponent" @click="changeComponent" @submit="submit" ></component>
</view>
</view>
</template>
......@@ -10,7 +10,7 @@
import {
mapState
} from 'vuex'
import { initAppWantGoods, getChannelType, findById } from '@/servers/purchaseList.js'
import { initAppWantGoods, getChannelType, findById, generateUUID } from '@/servers/purchaseList.js'
import purchaseMain from '../purchase-main/purchase-main'
import purchaseReceive from '../purchase-receive/purchase-receive'
......@@ -125,6 +125,18 @@
this.sourceType === 'purchase' && this.getDetail()
},
methods: {
// changeUUid(res){
// if(res.data.length > 0){
// this.detail.fileBizId = res.data[0].bizId
// }else{
// this.generateUUID()
// }
// },
// 获取生成文件id
async generateUUID(){
const res = await generateUUID()
this.detail.fileBizId = res.data
},
async findById(id){
const res = await findById(id)
this.detail = {
......@@ -139,6 +151,8 @@
shuntTypeName: res.data.shuntChannelsTypeTextView,
...res.data,
shuntDealerName: res.data.shuntDealer,
fileBizId: res.data.id,
bizCode: 'wantGoods'
}
this.getChannelType()
},
......@@ -176,8 +190,11 @@
billStatus: "E001",
status: 0,
isShunt: '0',
fileBizId: null,
bizCode: 'wantGoods'
}
this.getChannelType()
this.sourceType === 'purchase' && this.generateUUID()
},
changeComponent(com) {
this.currentTabComponent = com;
......
......@@ -81,3 +81,38 @@ export async function getCtrbase(params) {
const res = await apiHelper.post('/sap/bc/ztpm/to_new_crm/transdata/get_ctrbase', params)
return res
}
/**
* 生成唯一id
*/
export async function generateUUID(params) {
const res = await apiHelper.get('/crm-app/utils/randomUUID')
return res
}
/**
* 公共api
* 上传附件
* @param {*} params
*/
export async function webUploadFile(params) {
const res = await apiHelper.post('/crm-app/webUpload/ajaxUpload', params)
return res
}
/**
* 公共api
* 删除附件
* @param {*} params
*/
export async function doDeleteFile(params) {
const res = await apiHelper.post('/crm-app/attachment/doDelete', params, {'Content-Type': 'application/x-www-form-urlencoded'})
return res
}
// 获取要货附件
export async function doQuery(params) {
const res = await apiHelper.post('/crm-app/attachment/doQuery', params, {'Content-Type': 'application/x-www-form-urlencoded'})
return res
}
// 下载附件
export async function attachmentDownFile(params) {
const res = await apiHelper.post('/crm-app/attachmentDownFile', params)
return res
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment