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

upload

parent 3172affb
......@@ -61,6 +61,7 @@
"html-webpack-plugin": "^2.30.1",
"jest": "^22.0.4",
"jest-serializer-vue": "^0.3.0",
"lrz": "^4.9.40",
"nightwatch": "^0.9.12",
"node-notifier": "^5.1.2",
"optimize-css-assets-webpack-plugin": "^3.2.0",
......
......@@ -38,7 +38,7 @@ export default {
*/
uuid() {
var s = [];
var hexDigits = "0123456789abcdef";
var hexDigits = "0123456789ABCDEF";
for (var i = 0; i < 36; i++) {
s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
}
......@@ -54,12 +54,15 @@ export default {
* @param option 参考csdn: https://blog.csdn.net/qq_27626333/article/details/81463139
*/
ossUploadFile(option) {
const tempFile = option.tempFile
const file = option.file
const self = this
return new Promise((resolve, reject) => {
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 => {
// 异步上传,返回数据
......@@ -69,7 +72,7 @@ export default {
})
// 上传处理
// 分片上传文件
client.multipartUpload(fileName, file, {
client.multipartUpload(fileName, tempFile, {
headers:{
'Content-Type': 'image/jpg'
},
......@@ -80,7 +83,6 @@ export default {
// option.onProgress(e)
}
}).then((val) => {
console.info(val,fileName)
if (val.res.statusCode === 200) {
console.log('seccess')
// option.onSuccess(val)
......
......@@ -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/service/proxy/${userID}`,
default:`https://weixin.huansi.net/apiproxy/huansi/Tip`,
......
......@@ -59,6 +59,38 @@ export default {
fixed:true,
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',
name:'加工商',
......@@ -134,7 +166,7 @@ export default {
tbodyTdBorder:false,
tbodyHeight:'calc(100vh - 120px)',
tbodyTrBorderBottom:'1px solid #dbe9f8',
width:'1200px'
width:'1280px'
},
status:[],
row:{},
......
......@@ -16,7 +16,7 @@
>td{
padding-bottom:18px;
>div{
height: 45px;
height: 70px;
background: #fff;
padding: 6px 0;
display: flex;
......@@ -45,7 +45,7 @@
<table cellspacing="0" v-if="list.length>0">
<tr>
<td></td>
<td>米数</td>
<td>数量</td>
<td>匹数</td>
<td>金额</td>
</tr>
......@@ -58,9 +58,12 @@
<span style="width:100%;">
{{Number(v.M_nQty||0).toLocaleString()}}(M)
</span>
<span>
<span style="width:100%;">
{{Number(v.YD_nQty||0).toLocaleString()}}(YD)
</span>
<span style="width:100%;">
{{Number(v.KG_nQty||0).toLocaleString()}}(KG)
</span>
</div>
</td>
<td>
......
......@@ -52,6 +52,23 @@
color: #004974;
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{
width:100%;
height:1px;
......@@ -74,6 +91,12 @@
}
}
}
.canvas{
width:100%;
overflow: auto;
position: fixed;
top:-1000000px;
}
}
</style>
......@@ -86,16 +109,32 @@
</div>
<input ref="upload" id="selectfiles" type="file" accept="image/*" multiple>
</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">
<span>已上传的图片:</span>
<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 v-transfer-dom>
<previewer :list="fileList" ref="previewer" :options="options" @on-index-change="logIndexChange"></previewer>
</div>
<div class="canvas">
<canvas id="canvas" ref="canvas"></canvas>
</div>
</div>
</template>
......@@ -105,6 +144,8 @@ import Axios from 'axios';
var DOMParser = require('xmldom').DOMParser;
import {Previewer , TransferDom} from 'vux';
import oss from '@/libs/aliOss'
import { setTimeout } from 'timers';
import lrz from 'lrz';
export default {
name: 'uploadImg',
......@@ -127,6 +168,8 @@ export default {
},
fileList:[],
query:{},
canvasHeight:0,
canvasWidth:0
}
},
components:{
......@@ -136,30 +179,55 @@ export default {
TransferDom
},
async mounted(){
var that = window.d = this;
this.query = this.$route.query;
let url = `${this.query.sWebServiceURL}/projectpic/HS/${this.query.uGUID}.jpg`.replace(/\w+\.asmx\//,'');
Axios({
method: 'GET',
url: url
}).then(res=>{
let url;
console.log(this.query)
if(!!this.query.sLocalPicUrl){
url = `${this.query.sLocalPicUrl.split('/SavePicWebService.asmx?wsdl')[0]}/projectpic/${this.query.uGUID}.jpg`.replace(/\w+\.asmx\//,'');
}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(
{
src:url
}
)
}).catch(err=>{
console.log(err)
})
// Axios({
// method: 'GET',
// url: url
// }).then(res=>{
// this.fileList.push(
// {
// src:url
// }
// )
// }).catch(err=>{
// console.log(err)
// })
this.$refs['upload'].addEventListener('change', function() {
that.$vux.loading.show({
text: '上传中'
})
var t_files = this.files;
var str = '';
var reader=new FileReader();
reader.onload = function(e){
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 tempFile = rst.file;
var filePath = file.value; //js中无法获取文件的真是路径
var fileName = filePath.substring(filePath.lastIndexOf('\\')+1); //文件名
var extName = fileName.substring(fileName.lastIndexOf('.')+1); //后缀名
......@@ -171,7 +239,8 @@ export default {
})
return false;
}
if (parseInt(file.files[0].size / 1024) > (1024 * 10)) {
if (parseInt(tempFile.size / 1024) > (1024 * 10)) {
that.$vux.confirm.show({
title:"提示",
content:`图片大小超过10M,请重新上传!`,
......@@ -179,17 +248,57 @@ export default {
})
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]);
}, false);
},
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){
this.$refs['previewer'].show(index)
},
......@@ -198,7 +307,7 @@ export default {
},
upload(base64,callback){
let _base64 = Util.deepClone(base64);
console.log(_base64)
if(_base64.indexOf('data:image/png;base64,') != -1){
_base64 = _base64.split('data:image/png;base64,')
}else if(_base64.indexOf('data:image/jpg;base64,') != -1){
......@@ -209,12 +318,12 @@ export default {
this.$vux.loading.show({
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 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");
......@@ -277,7 +386,7 @@ export default {
// }
// Axios({
// method: 'POST',
// url: this.query.sWebServiceURL,
// url: this.query.sLocalPicUrl,
// data: datacopy,
// headers: headers
// }).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