Commit 74559363 authored by 张锡奇's avatar 张锡奇

upload

parent 3172affb
...@@ -61,6 +61,7 @@ ...@@ -61,6 +61,7 @@
"html-webpack-plugin": "^2.30.1", "html-webpack-plugin": "^2.30.1",
"jest": "^22.0.4", "jest": "^22.0.4",
"jest-serializer-vue": "^0.3.0", "jest-serializer-vue": "^0.3.0",
"lrz": "^4.9.40",
"nightwatch": "^0.9.12", "nightwatch": "^0.9.12",
"node-notifier": "^5.1.2", "node-notifier": "^5.1.2",
"optimize-css-assets-webpack-plugin": "^3.2.0", "optimize-css-assets-webpack-plugin": "^3.2.0",
......
...@@ -38,7 +38,7 @@ export default { ...@@ -38,7 +38,7 @@ export default {
*/ */
uuid() { uuid() {
var s = []; var s = [];
var hexDigits = "0123456789abcdef"; var hexDigits = "0123456789ABCDEF";
for (var i = 0; i < 36; i++) { for (var i = 0; i < 36; i++) {
s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1); s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
} }
...@@ -54,12 +54,15 @@ export default { ...@@ -54,12 +54,15 @@ export default {
* @param option 参考csdn: https://blog.csdn.net/qq_27626333/article/details/81463139 * @param option 参考csdn: https://blog.csdn.net/qq_27626333/article/details/81463139
*/ */
ossUploadFile(option) { ossUploadFile(option) {
const tempFile = option.tempFile
const file = option.file const file = option.file
const self = this const self = this
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
const extensionName = file.name.substr(file.name.indexOf('.')) // 文件扩展名 const extensionName = file.name.substr(file.name.indexOf('.')) // 文件扩展名
const fileName = `${option.sProjectNo}/${self.uuid()+extensionName}` const fileName = `${option.iProjectId}${option.sProjectNo}/${(option.uuid || self.uuid())}.jpg`
console.log(option.uuid)
// 执行上传 // 执行上传
self.createOssClient(option.bucket).then(client => { self.createOssClient(option.bucket).then(client => {
// 异步上传,返回数据 // 异步上传,返回数据
...@@ -69,7 +72,7 @@ export default { ...@@ -69,7 +72,7 @@ export default {
}) })
// 上传处理 // 上传处理
// 分片上传文件 // 分片上传文件
client.multipartUpload(fileName, file, { client.multipartUpload(fileName, tempFile, {
headers:{ headers:{
'Content-Type': 'image/jpg' 'Content-Type': 'image/jpg'
}, },
...@@ -80,7 +83,6 @@ export default { ...@@ -80,7 +83,6 @@ export default {
// option.onProgress(e) // option.onProgress(e)
} }
}).then((val) => { }).then((val) => {
console.info(val,fileName)
if (val.res.statusCode === 200) { if (val.res.statusCode === 200) {
console.log('seccess') console.log('seccess')
// option.onSuccess(val) // option.onSuccess(val)
......
...@@ -12,7 +12,7 @@ function urlFun(name){ ...@@ -12,7 +12,7 @@ function urlFun(name){
/** /**
* 默认公司 * 默认公司
*/ */
// default:`http://192.168.4.25:5001`, // default:`http://192.168.4.44:5001`,
// default:`https://weixin.huansi.net/apiproxy/huansi/hszh_HSFabricTradeTest`, // default:`https://weixin.huansi.net/apiproxy/huansi/hszh_HSFabricTradeTest`,
// default:`https://weixin.huansi.net/apiproxy/huansi/service/proxy/${userID}`, // default:`https://weixin.huansi.net/apiproxy/huansi/service/proxy/${userID}`,
default:`https://weixin.huansi.net/apiproxy/huansi/Tip`, default:`https://weixin.huansi.net/apiproxy/huansi/Tip`,
......
...@@ -59,6 +59,38 @@ export default { ...@@ -59,6 +59,38 @@ export default {
fixed:true, fixed:true,
fixedLeftWidth:'0px' fixedLeftWidth:'0px'
}, },
{
width:'80px',
name:'加工进度',
align:'center',
color:'#2d8cf0',
fixed:true,
fixedLeftWidth:'100px',
field:'look',
render: (h,params) => {
return h('span',{
style: {
'text-decoration':'underline',
'color':'#2d8cf0'
},
on:{
'click':()=>{
if(params.row.sStatus == "生产新增"){
this.$vux.confirm.show({
title:"提示",
content:'该订单无跟踪信息!',
showCancelButton:false,
})
return false;
}
wx.miniProgram.navigateTo({
url:`/sub/pages/orderTracking/index?formPage=process&sStatus=${params.row.sStatus}&begin_date=${this.search.dBeginDate}&end_date=${this.search.dEndDate}&sContractNo=${params.row.sContractNo}`
})
}
}
},'查看')
}
},
{ {
width:'100px', width:'100px',
name:'加工商', name:'加工商',
...@@ -134,7 +166,7 @@ export default { ...@@ -134,7 +166,7 @@ export default {
tbodyTdBorder:false, tbodyTdBorder:false,
tbodyHeight:'calc(100vh - 120px)', tbodyHeight:'calc(100vh - 120px)',
tbodyTrBorderBottom:'1px solid #dbe9f8', tbodyTrBorderBottom:'1px solid #dbe9f8',
width:'1200px' width:'1280px'
}, },
status:[], status:[],
row:{}, row:{},
......
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
>td{ >td{
padding-bottom:18px; padding-bottom:18px;
>div{ >div{
height: 45px; height: 70px;
background: #fff; background: #fff;
padding: 6px 0; padding: 6px 0;
display: flex; display: flex;
...@@ -45,7 +45,7 @@ ...@@ -45,7 +45,7 @@
<table cellspacing="0" v-if="list.length>0"> <table cellspacing="0" v-if="list.length>0">
<tr> <tr>
<td></td> <td></td>
<td>米数</td> <td>数量</td>
<td>匹数</td> <td>匹数</td>
<td>金额</td> <td>金额</td>
</tr> </tr>
...@@ -58,9 +58,12 @@ ...@@ -58,9 +58,12 @@
<span style="width:100%;"> <span style="width:100%;">
{{Number(v.M_nQty||0).toLocaleString()}}(M) {{Number(v.M_nQty||0).toLocaleString()}}(M)
</span> </span>
<span> <span style="width:100%;">
{{Number(v.YD_nQty||0).toLocaleString()}}(YD) {{Number(v.YD_nQty||0).toLocaleString()}}(YD)
</span> </span>
<span style="width:100%;">
{{Number(v.KG_nQty||0).toLocaleString()}}(KG)
</span>
</div> </div>
</td> </td>
<td> <td>
......
...@@ -52,6 +52,23 @@ ...@@ -52,6 +52,23 @@
color: #004974; color: #004974;
text-decoration: none; text-decoration: none;
} }
.INFO{
width:100%;
height:60px;
margin-top:20px;
>span{
font-weight: bold;
}
>div{
margin-top:10px;
>div{
display: flex;
>span{
flex:1;
}
}
}
}
.uploaded{ .uploaded{
width:100%; width:100%;
height:1px; height:1px;
...@@ -74,6 +91,12 @@ ...@@ -74,6 +91,12 @@
} }
} }
} }
.canvas{
width:100%;
overflow: auto;
position: fixed;
top:-1000000px;
}
} }
</style> </style>
...@@ -86,16 +109,32 @@ ...@@ -86,16 +109,32 @@
</div> </div>
<input ref="upload" id="selectfiles" type="file" accept="image/*" multiple> <input ref="upload" id="selectfiles" type="file" accept="image/*" multiple>
</a> </a>
<div class="INFO">
<span>面料详情:</span>
<div>
<div>
<span>产品名称:{{query.sMaterialName}}</span>
<span>产品编号:{{query.sMaterialNo}}</span>
</div>
<div>
<span>颜色:{{query.sColorName}}</span>
<span>色号:{{query.sColorNo}}</span>
</div>
</div>
</div>
<div class="uploaded"> <div class="uploaded">
<span>已上传的图片:</span> <span>已上传的图片:</span>
<div> <div>
<img v-for="(item,index) in fileList" :key="index" class="previewer-demo-img" :src="item.src" width="100" @click.stop="show(index)" /> <img v-for="(item,index) in fileList" :key="index" class="previewer-demo-img" ref="image" :src="item.src" width="100" @click.stop="show(index)" />
</div> </div>
</div> </div>
<div v-transfer-dom> <div v-transfer-dom>
<previewer :list="fileList" ref="previewer" :options="options" @on-index-change="logIndexChange"></previewer> <previewer :list="fileList" ref="previewer" :options="options" @on-index-change="logIndexChange"></previewer>
</div> </div>
<div class="canvas">
<canvas id="canvas" ref="canvas"></canvas>
</div>
</div> </div>
</template> </template>
...@@ -105,6 +144,8 @@ import Axios from 'axios'; ...@@ -105,6 +144,8 @@ import Axios from 'axios';
var DOMParser = require('xmldom').DOMParser; var DOMParser = require('xmldom').DOMParser;
import {Previewer , TransferDom} from 'vux'; import {Previewer , TransferDom} from 'vux';
import oss from '@/libs/aliOss' import oss from '@/libs/aliOss'
import { setTimeout } from 'timers';
import lrz from 'lrz';
export default { export default {
name: 'uploadImg', name: 'uploadImg',
...@@ -127,6 +168,8 @@ export default { ...@@ -127,6 +168,8 @@ export default {
}, },
fileList:[], fileList:[],
query:{}, query:{},
canvasHeight:0,
canvasWidth:0
} }
}, },
components:{ components:{
...@@ -136,30 +179,55 @@ export default { ...@@ -136,30 +179,55 @@ export default {
TransferDom TransferDom
}, },
async mounted(){ async mounted(){
var that = window.d = this; var that = window.d = this;
this.query = this.$route.query; this.query = this.$route.query;
let url = `${this.query.sWebServiceURL}/projectpic/HS/${this.query.uGUID}.jpg`.replace(/\w+\.asmx\//,''); let url;
Axios({ console.log(this.query)
method: 'GET', if(!!this.query.sLocalPicUrl){
url: url url = `${this.query.sLocalPicUrl.split('/SavePicWebService.asmx?wsdl')[0]}/projectpic/${this.query.uGUID}.jpg`.replace(/\w+\.asmx\//,'');
}).then(res=>{ }else{
url = `https://huansi-sample.oss-cn-hangzhou.aliyuncs.com/${this.query.iProjectId}${this.query.sProjectNo}/${this.query.uGUID}.jpg?m=${Math.random()}`;
}
this.fileList.push( this.fileList.push(
{ {
src:url src:url
} }
) )
}).catch(err=>{ // Axios({
console.log(err) // method: 'GET',
}) // url: url
// }).then(res=>{
// this.fileList.push(
// {
// src:url
// }
// )
// }).catch(err=>{
// console.log(err)
// })
this.$refs['upload'].addEventListener('change', function() { this.$refs['upload'].addEventListener('change', function() {
that.$vux.loading.show({
text: '上传中'
})
var t_files = this.files; var t_files = this.files;
var str = ''; var str = '';
var reader=new FileReader(); var reader=new FileReader();
reader.onload = function(e){ reader.onload = function(e){
e.preventDefault(); e.preventDefault();
var image = new Image();
image.onload=function(){
var width = image.width;
var height = image.height;
};
that.initCanvas(e.target.result).then(res=>{
image.src = res;
lrz(res)
.then(function (rst) {
var file = that.$refs['upload']; var file = that.$refs['upload'];
var tempFile = rst.file;
var filePath = file.value; //js中无法获取文件的真是路径 var filePath = file.value; //js中无法获取文件的真是路径
var fileName = filePath.substring(filePath.lastIndexOf('\\')+1); //文件名 var fileName = filePath.substring(filePath.lastIndexOf('\\')+1); //文件名
var extName = fileName.substring(fileName.lastIndexOf('.')+1); //后缀名 var extName = fileName.substring(fileName.lastIndexOf('.')+1); //后缀名
...@@ -171,7 +239,8 @@ export default { ...@@ -171,7 +239,8 @@ export default {
}) })
return false; return false;
} }
if (parseInt(file.files[0].size / 1024) > (1024 * 10)) {
if (parseInt(tempFile.size / 1024) > (1024 * 10)) {
that.$vux.confirm.show({ that.$vux.confirm.show({
title:"提示", title:"提示",
content:`图片大小超过10M,请重新上传!`, content:`图片大小超过10M,请重新上传!`,
...@@ -179,17 +248,57 @@ export default { ...@@ -179,17 +248,57 @@ export default {
}) })
return false; return false;
} }
// oss.ossUploadFile({bucket:'huansi',sProjectNo:'HSTIP',file:file.files[0]}).then(file => {
// console.log(file)
// })
// return false;
that.upload(reader.result); //或者 e.target.result都是一样的,都是base64码 if(!!that.query.sLocalPicUrl){
that.upload(rst.base64); //或者 e.target.result都是一样的,都是base64码
}else{
oss.ossUploadFile({uuid:that.query.uGUID,bucket:'huansi-sample',iProjectId:that.query.iProjectId,sProjectNo:that.query.sProjectNo,tempFile:tempFile,file:file}).then(file => {
setTimeout(()=>{
that.$set(that.fileList[0],'src',`https://huansi-sample.oss-cn-hangzhou.aliyuncs.com/${that.query.iProjectId}${that.query.sProjectNo}/${that.query.uGUID}.jpg?m=${Math.random()}`)
that.$vux.loading.hide();
},1000)
})
}
// 处理成功会执行
})
.catch(function (err){
// 处理失败会执行
})
.always(function () {
// 不管是成功失败,都会执行
});
});
} }
reader.readAsDataURL(this.files[0]); reader.readAsDataURL(this.files[0]);
}, false); }, false);
}, },
methods:{ methods:{
initCanvas(imgsrc) {
return new Promise((resolve)=>{
let canvas = this.$refs['canvas']
let txt = String(new Date().getTime());
if(canvas.getContext) {
let ctx = canvas.getContext('2d');
var img = new Image();
img.src = imgsrc;
img.onload = function() {
var imgWidth = img.width;
var imgHeight = img.height;
canvas.width = imgWidth;
canvas.height = imgHeight;
ctx.drawImage(img, 0, 0);
ctx.fillStyle = 'rgba(0, 0, 0, 0.1)';
ctx.font = '1px sans-serif';
ctx.fillText(txt, canvas.width - 40, canvas.height - 5);
let base64 = '' ;//base64
img.setAttribute("crossOrigin",'Anonymous')
base64 = canvas.toDataURL("image/jpg");
resolve(base64);
}
}
})
},
show(index){ show(index){
this.$refs['previewer'].show(index) this.$refs['previewer'].show(index)
}, },
...@@ -198,7 +307,7 @@ export default { ...@@ -198,7 +307,7 @@ export default {
}, },
upload(base64,callback){ upload(base64,callback){
let _base64 = Util.deepClone(base64); let _base64 = Util.deepClone(base64);
console.log(_base64)
if(_base64.indexOf('data:image/png;base64,') != -1){ if(_base64.indexOf('data:image/png;base64,') != -1){
_base64 = _base64.split('data:image/png;base64,') _base64 = _base64.split('data:image/png;base64,')
}else if(_base64.indexOf('data:image/jpg;base64,') != -1){ }else if(_base64.indexOf('data:image/jpg;base64,') != -1){
...@@ -209,12 +318,12 @@ export default { ...@@ -209,12 +318,12 @@ export default {
this.$vux.loading.show({ this.$vux.loading.show({
text: '上传中' text: '上传中'
}) })
var datacopy = `<?xml version="1.0" encoding="utf-8"?><soap12:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap12="http://www.w3.org/2003/05/soap-envelope"><soap12:Body><SavePic xmlns="http://tempuri.org/"><sToken>F563EBDF-0FC1-4777-96B8-033C3E89D6F8</sToken><sProjectNo>${this.query.sProjectNo}</sProjectNo><sGuid>${this.query.uGUID}</sGuid><sBase64>${_base64}</sBase64></SavePic></soap12:Body></soap12:Envelope>` var datacopy = `<?xml version="1.0" encoding="utf-8"?><soap12:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap12="http://www.w3.org/2003/05/soap-envelope"><soap12:Body><SavePic xmlns="http://tempuri.org/"><sToken>F563EBDF-0FC1-4777-96B8-033C3E89D6F8</sToken><sProjectNo>${this.query.sProjectNo}</sProjectNo><sGuid>${this.query.uGUID}</sGuid><sBase64>${_base64}</sBase64></SavePic></soap12:Body></soap12:Envelope>`
var xhr = new XMLHttpRequest(); var xhr = new XMLHttpRequest();
//打开连接 //打开连接
xhr.open('POST',this.query.sWebServiceURL,true); console.log(this.query.sLocalPicUrl.substr(0,this.query.sLocalPicUrl.length - 1))
xhr.open('POST',this.query.sLocalPicUrl.substr(0,this.query.sLocalPicUrl.length - 1),true);
//重新设置请求头 //重新设置请求头
xhr.setRequestHeader("Content-Type","text/xml;charset=UTF-8"); xhr.setRequestHeader("Content-Type","text/xml;charset=UTF-8");
...@@ -277,7 +386,7 @@ export default { ...@@ -277,7 +386,7 @@ export default {
// } // }
// Axios({ // Axios({
// method: 'POST', // method: 'POST',
// url: this.query.sWebServiceURL, // url: this.query.sLocalPicUrl,
// data: datacopy, // data: datacopy,
// headers: headers // headers: headers
// }).then(res=>{ // }).then(res=>{
......
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