mirror of
https://gitlab.com/CIEFWorldwideSdnBhd/exchange.git
synced 2026-08-19 04:14:04 +00:00
correct linting error
This commit is contained in:
Edmond Teh
@@ -14,17 +14,14 @@
|
||||
<!-- upload image -->
|
||||
<div class="card-body">
|
||||
|
||||
<el-upload :action="'/api/booking/' + booking_id + '/upload-po'" :auto-upload="false" :on-change="beforeFileUpload" :on-exceed="handleExceed" :on-preview="handlePreview" :on-remove="handleRemove"
|
||||
:on-error="uploadError" class="upload-demo uploadAreaOne" accept=".jpeg, .jpg, .png, .bmp, .doc, .docx, .xls, .xlsx, .pdf"
|
||||
drag multiple>
|
||||
<el-upload :action="'/api/booking/' + booking_id + '/upload-po'" :auto-upload="false" :on-change="beforeFileUpload" :on-exceed="handleExceed" :on-preview="handlePreview" :on-remove="handleRemove" :on-error="uploadError" class="upload-demo uploadAreaOne" accept=".jpeg, .jpg, .png, .bmp, .doc, .docx, .xls, .xlsx, .pdf" drag multiple>
|
||||
<i class="el-icon-upload" />
|
||||
<div class="el-upload__text">Drop file here or
|
||||
<em>click to upload</em>
|
||||
</div>
|
||||
<div slot="tip" class="el-upload__tip">bmp/jpeg/jpg/png/pdf/xls/xlxs/doc/docx files with a size less than 3MB</div>
|
||||
</el-upload>
|
||||
<el-upload class="upload-demo uploadAreaTwo" :action="'/api/booking/' + booking_id + '/upload-po'" :on-preview="handlePreview"
|
||||
:on-remove="handleRemove" :before-remove="beforeRemove" multiple :file-list="fileList">
|
||||
<el-upload :action="'/api/booking/' + booking_id + '/upload-po'" :on-preview="handlePreview" :on-remove="handleRemove" :before-remove="beforeRemove" :file-list="fileList" multiple class="upload-demo uploadAreaTwo" >
|
||||
<el-button size="small" type="primary">Click to upload</el-button>
|
||||
<div slot="tip" class="el-upload__tip">jpg/png files with a size less than 500kb</div>
|
||||
</el-upload>
|
||||
@@ -40,8 +37,8 @@
|
||||
<div class="card">
|
||||
<div class="card-header">China Bank Slip</div>
|
||||
<div class="card-body">
|
||||
<a target="_blank" :href="getURL(booking_details.china_bankslip_path)">
|
||||
<img v-if="isImage(booking_details.china_bankslip_path)" v-bind:src="booking_details.china_bankslip_path" class="image">
|
||||
<a :href="getURL(booking_details.china_bankslip_path)" target="_blank" >
|
||||
<img v-if="isImage(booking_details.china_bankslip_path)" :src="booking_details.china_bankslip_path" class="image">
|
||||
<p v-else>Download</p>
|
||||
</a>
|
||||
</div>
|
||||
@@ -95,7 +92,7 @@
|
||||
<td>{{ booking_details.rate }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td/>
|
||||
<td>
|
||||
<b>MYR {{ booking_details.bia }}</b>
|
||||
</td>
|
||||
@@ -114,8 +111,8 @@
|
||||
<div class="card-header">Order Bankin Slip</div>
|
||||
<div class="row">
|
||||
<div class="card-body">
|
||||
<a target="_blank" :href="getURL(booking_details.user_bankslip_path)">
|
||||
<img v-if="isImage(booking_details.user_bankslip_path)" v-bind:src="booking_details.user_bankslip_path" class="image">
|
||||
<a :href="getURL(booking_details.user_bankslip_path)" target="_blank" >
|
||||
<img v-if="isImage(booking_details.user_bankslip_path)" :src="booking_details.user_bankslip_path" class="image">
|
||||
<p v-else>Download</p>
|
||||
</a>
|
||||
</div>
|
||||
@@ -184,7 +181,7 @@
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
import ProgressTrack from '~/components/ProgressTrack'
|
||||
import ProgressTrack from '~/components/ProgressTrack'
|
||||
import X2ProgressTrack from '~/components/X2ProgressTrack'
|
||||
import axios from 'axios'
|
||||
import ImageCompressor from 'image-compressor.js'
|
||||
@@ -194,142 +191,140 @@ export default {
|
||||
'progress-track': ProgressTrack,
|
||||
'x2-progress-track': X2ProgressTrack
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
booking_id: this.$route.params.id,
|
||||
trackerConfig :{
|
||||
status: 5,
|
||||
term: null
|
||||
},
|
||||
purchaseOrderArray: [],
|
||||
loading_btn: false,
|
||||
booking_details: {
|
||||
id: null,
|
||||
amount: null,
|
||||
bia: null,
|
||||
user_bankslip_path: null,
|
||||
china_bankslip_path: null,
|
||||
}
|
||||
}
|
||||
},
|
||||
beforeCreate() {
|
||||
const loading = this.$loading({
|
||||
lock: true,
|
||||
text: 'Please wait..',
|
||||
spinner: 'el-icon-loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)'
|
||||
})
|
||||
|
||||
axios
|
||||
.get('/api/booking/' + this.$route.params.id)
|
||||
.then((response) => {
|
||||
this.booking_details = response.data
|
||||
this.trackerConfig.term = response.data.term
|
||||
loading.close()
|
||||
|
||||
}).catch((error) => {
|
||||
console.log(error)
|
||||
loading.close()
|
||||
this.$router.push({
|
||||
name: 'notfound'
|
||||
})
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
uploadPo() {
|
||||
this.loading_btn = true
|
||||
console.log(this.purchaseOrderArray);
|
||||
axios
|
||||
.post('/api/booking/' + this.$route.params.id + '/confirm-po', { images: this.purchaseOrderArray})
|
||||
.then((response) => {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: 'Your PO has been uploaded. We are processing the Invoice.',
|
||||
type: 'success',
|
||||
duration: 5000
|
||||
})
|
||||
this.$router.push({
|
||||
name: 'home'
|
||||
})
|
||||
this.loading_btn = false
|
||||
}).catch((error) => {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: "Please upload your purchase order",
|
||||
type: 'error',
|
||||
duration: 30000
|
||||
})
|
||||
this.loading_btn = false
|
||||
})
|
||||
data () {
|
||||
return {
|
||||
booking_id: this.$route.params.id,
|
||||
trackerConfig: {
|
||||
status: 5,
|
||||
term: null
|
||||
},
|
||||
beforeFileUpload(file, fileList) {
|
||||
this.purchaseOrderArray = [];
|
||||
var vm = this;
|
||||
for (var i in fileList) {
|
||||
var filetype = fileList[i].raw.type.split("/")[0];
|
||||
if(filetype === 'image'){
|
||||
new ImageCompressor(fileList[i].raw, {
|
||||
quality: .4,
|
||||
convertSize: 1500000,
|
||||
success(result) {
|
||||
vm.convertFile(result)
|
||||
},
|
||||
error(e) {
|
||||
console.log(e.message);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
this.convertFile(fileList[i].raw)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
convertFile(file){
|
||||
var vm = this,
|
||||
reader = new FileReader();
|
||||
reader.readAsDataURL(file);
|
||||
reader.onloadend = function() {
|
||||
vm.purchaseOrderArray.push(reader.result);
|
||||
console.log(vm.purchaseOrderArray);
|
||||
}
|
||||
},
|
||||
handleRemove(file, fileList) {
|
||||
console.log(file, fileList)
|
||||
// Should send some reqeust to controller to delete the file
|
||||
},
|
||||
handlePreview(file) {
|
||||
console.log(file)
|
||||
},
|
||||
handleExceed(files, fileList) {
|
||||
this.$message.warning(
|
||||
`The limit is 3, you selected ${files.length} files this time, add up to ${files.length + fileList.length} totally`
|
||||
)
|
||||
},
|
||||
beforeRemove(file, fileList) {
|
||||
return this.$confirm(`确定移除 ${file.name}？`)
|
||||
},
|
||||
uploadError(file, fileList) {
|
||||
this.$message.warning(`Incorrect file format or file size too big.`)
|
||||
},
|
||||
getExtension(path) {
|
||||
return path.slice(-3);
|
||||
},
|
||||
isImage(path) {
|
||||
if(path != null){
|
||||
var ext = this.getExtension(path);
|
||||
return ext === 'jpg' || ext === 'jpeg' || ext === 'bmp' || ext === 'png';
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
|
||||
},
|
||||
getURL(path) {
|
||||
var getUrl = window.location;
|
||||
var baseUrl = getUrl.protocol + "//" + getUrl.host;
|
||||
return baseUrl + path;
|
||||
purchaseOrderArray: [],
|
||||
loading_btn: false,
|
||||
booking_details: {
|
||||
id: null,
|
||||
amount: null,
|
||||
bia: null,
|
||||
user_bankslip_path: null,
|
||||
china_bankslip_path: null
|
||||
}
|
||||
}
|
||||
},
|
||||
beforeCreate () {
|
||||
const loading = this.$loading({
|
||||
lock: true,
|
||||
text: 'Please wait..',
|
||||
spinner: 'el-icon-loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)'
|
||||
})
|
||||
|
||||
axios
|
||||
.get('/api/booking/' + this.$route.params.id)
|
||||
.then((response) => {
|
||||
console.log(response)
|
||||
this.booking_details = response.data
|
||||
this.trackerConfig.term = response.data.term
|
||||
loading.close()
|
||||
}).catch((error) => {
|
||||
console.log(error)
|
||||
loading.close()
|
||||
this.$router.push({
|
||||
name: 'notfound'
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
methods: {
|
||||
uploadPo () {
|
||||
this.loading_btn = true
|
||||
console.log(this.purchaseOrderArray)
|
||||
axios
|
||||
.post('/api/booking/' + this.$route.params.id + '/confirm-po', { images: this.purchaseOrderArray })
|
||||
.then((response) => {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: 'Your PO has been uploaded. We are processing the Invoice.',
|
||||
type: 'success',
|
||||
duration: 5000
|
||||
})
|
||||
this.$router.push({
|
||||
name: 'home'
|
||||
})
|
||||
this.loading_btn = false
|
||||
}).catch((error) => {
|
||||
console.error(error)
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: 'Please upload your purchase order',
|
||||
type: 'error',
|
||||
duration: 30000
|
||||
})
|
||||
this.loading_btn = false
|
||||
})
|
||||
},
|
||||
beforeFileUpload (file, fileList) {
|
||||
this.purchaseOrderArray = []
|
||||
const vm = this
|
||||
for (let i in fileList) {
|
||||
const filetype = fileList[i].raw.type.split('/')[0]
|
||||
if (filetype === 'image') {
|
||||
ImageCompressor(fileList[i].raw, {
|
||||
quality: 0.4,
|
||||
convertSize: 1500000,
|
||||
success (result) {
|
||||
vm.convertFile(result)
|
||||
},
|
||||
error (e) {
|
||||
console.error(e.message)
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.convertFile(fileList[i].raw)
|
||||
}
|
||||
}
|
||||
},
|
||||
convertFile (file) {
|
||||
let vm = this
|
||||
const reader = new FileReader()
|
||||
reader.readAsDataURL(file)
|
||||
reader.onloadend = function () {
|
||||
vm.purchaseOrderArray.push(reader.result)
|
||||
console.log(vm.purchaseOrderArray)
|
||||
}
|
||||
},
|
||||
handleRemove (file, fileList) {
|
||||
console.log(file, fileList)
|
||||
// Should send some reqeust to controller to delete the file
|
||||
},
|
||||
handlePreview (file) {
|
||||
console.log(file)
|
||||
},
|
||||
handleExceed (files, fileList) {
|
||||
this.$message.warning(
|
||||
`The limit is 3, you selected ${files.length} files this time, add up to ${files.length + fileList.length} totally`
|
||||
)
|
||||
},
|
||||
beforeRemove (file, fileList) {
|
||||
return this.$confirm(`确定移除 ${file.name}？`)
|
||||
},
|
||||
uploadError (file, fileList) {
|
||||
this.$message.warning(`Incorrect file format or file size too big.`)
|
||||
},
|
||||
getExtension (path) {
|
||||
return path.slice(-3)
|
||||
},
|
||||
isImage (path) {
|
||||
if (path != null) {
|
||||
const ext = this.getExtension(path)
|
||||
return ext === 'jpg' || ext === 'jpeg' || ext === 'bmp' || ext === 'png'
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
},
|
||||
getURL (path) {
|
||||
const getUrl = window.location
|
||||
const baseUrl = getUrl.protocol + '//' + getUrl.host
|
||||
return baseUrl + path
|
||||
}
|
||||
}
|
||||
</script>
|
||||
}
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user